feat: add interfaces for secondary menu items with various types and functionalities

ts_web/elements/interfaces/secondarymenu.ts

@@ -0,0 +1,93 @@
+/**
+ * Secondary Menu Item Types
+ *
+ * Supports 8 item types:
+ * 1. Tab - selectable, stays highlighted (existing behavior)
+ * 2. Action - executes without selection (primary = blue)
+ * 3. Danger Action - red styling with optional confirmation
+ * 4. Filter - checkbox toggle, emits immediately
+ * 5. Multi-Filter - collapsible box with multiple checkboxes
+ * 6. Divider - visual separator
+ * 7. Header - non-interactive label
+ * 8. Link - opens URL
+ */
+
+// Base properties shared by interactive items
+export interface ISecondaryMenuItemBase {
+  key: string;
+  iconName?: string;
+  disabled?: boolean;
+  hidden?: boolean;
+}
+
+// 1. Tab - existing behavior (selectable, stays highlighted)
+export interface ISecondaryMenuItemTab extends ISecondaryMenuItemBase {
+  type?: 'tab'; // default if omitted for backward compatibility
+  action: () => void;
+  badge?: string | number;
+  badgeVariant?: 'default' | 'success' | 'warning' | 'error';
+}
+
+// 2 & 3. Action - executes without selection
+export interface ISecondaryMenuItemAction extends ISecondaryMenuItemBase {
+  type: 'action';
+  action: () => void | Promise<void>;
+  variant?: 'primary' | 'danger'; // primary = blue (default), danger = red
+  confirmMessage?: string; // Shows confirmation dialog before executing
+}
+
+// 4. Single filter toggle
+export interface ISecondaryMenuItemFilter extends ISecondaryMenuItemBase {
+  type: 'filter';
+  active: boolean;
+  onToggle: (active: boolean) => void;
+}
+
+// 5. Multi-select filter group (collapsible)
+export interface ISecondaryMenuItemMultiFilter extends ISecondaryMenuItemBase {
+  type: 'multiFilter';
+  collapsed?: boolean; // Accordion state
+  options: Array<{
+    key: string;
+    label: string;
+    checked: boolean;
+    iconName?: string;
+  }>;
+  onChange: (selectedKeys: string[]) => void;
+}
+
+// 6. Divider
+export interface ISecondaryMenuItemDivider {
+  type: 'divider';
+}
+
+// 7. Header/Label
+export interface ISecondaryMenuItemHeader {
+  type: 'header';
+  label: string;
+}
+
+// 8. External link
+export interface ISecondaryMenuItemLink extends ISecondaryMenuItemBase {
+  type: 'link';
+  href: string;
+  external?: boolean; // Opens in new tab (default: true if href starts with http)
+}
+
+// Union type for all secondary menu items
+export type ISecondaryMenuItem =
+  | ISecondaryMenuItemTab
+  | ISecondaryMenuItemAction
+  | ISecondaryMenuItemFilter
+  | ISecondaryMenuItemMultiFilter
+  | ISecondaryMenuItemDivider
+  | ISecondaryMenuItemHeader
+  | ISecondaryMenuItemLink;
+
+// Group interface for secondary menu
+export interface ISecondaryMenuGroup {
+  name: string;
+  iconName?: string;
+  collapsed?: boolean;
+  items: ISecondaryMenuItem[];
+}