@ship-ui/core 0.22.15 → 0.22.17

package/assets/mcp/components.json

@@ -169,7 +169,7 @@
       },
       {
         "name": "clearTimeout",
-        "parameters": "this.destroyTimeout);\n      this.destroyTimeout = null;\n    }\n  }\n\n  private showTooltip(",
+        "parameters": "this.destroyTimeout);\n      this.destroyTimeout = null;\n    }\n  }\n\n  #showTooltip(",
         "returnType": "any",
         "description": ""
       }
@@ -361,7 +361,7 @@
       {
         "name": "execCommand",
         "parameters": "commandId: string, showUI?: boolean, value?: string",
-        "returnType": "boolean;\n  queryCommandState(commandId: string): boolean;\n  queryCommandEnabled(commandId: string): boolean;\n}\n\n// Value Accessor Provider\nconst SHIP_EDITOR_VALUE_ACCESSOR: Provider =",
+        "returnType": "boolean;\n  queryCommandState(commandId: string): boolean;\n  queryCommandEnabled(commandId: string): boolean;\n}\n\n\nconst SHIP_EDITOR_VALUE_ACCESSOR: Provider =",
         "description": ""
       },
       {
@@ -394,6 +394,30 @@
         "returnType": "void",
         "description": ""
       },
+      {
+        "name": "onDOMInput",
+        "parameters": "",
+        "returnType": "any",
+        "description": ""
+      },
+      {
+        "name": "onDOMBlur",
+        "parameters": "",
+        "returnType": "any",
+        "description": ""
+      },
+      {
+        "name": "onCodeInput",
+        "parameters": "event: Event",
+        "returnType": "any",
+        "description": ""
+      },
+      {
+        "name": "onCodeBlur",
+        "parameters": "event: Event",
+        "returnType": "any",
+        "description": ""
+      },
       {
         "name": "formatText",
         "parameters": "command: string, value: string = ''",
@@ -454,18 +478,42 @@
         "returnType": "any",
         "description": ""
       },
+      {
+        "name": "toggleViewMode",
+        "parameters": "",
+        "returnType": "any",
+        "description": ""
+      },
+      {
+        "name": "onSelectionChange",
+        "parameters": "",
+        "returnType": "any",
+        "description": ""
+      },
       {
         "name": "openLinkModal",
         "parameters": "",
         "returnType": "any",
         "description": ""
       },
+      {
+        "name": "applyLink",
+        "parameters": "url: string",
+        "returnType": "any",
+        "description": ""
+      },
       {
         "name": "openImageModal",
         "parameters": "",
         "returnType": "any",
         "description": ""
       },
+      {
+        "name": "applyImage",
+        "parameters": "url: string",
+        "returnType": "any",
+        "description": ""
+      },
       {
         "name": "onComponentFocusIn",
         "parameters": "event: FocusEvent",
@@ -502,6 +550,18 @@
         "returnType": "string",
         "description": ""
       },
+      {
+        "name": "onToolbarKeyDown",
+        "parameters": "event: KeyboardEvent",
+        "returnType": "any",
+        "description": ""
+      },
+      {
+        "name": "onToolbarFocusIn",
+        "parameters": "event: FocusEvent",
+        "returnType": "any",
+        "description": ""
+      },
       {
         "name": "onComponentScroll",
         "parameters": "event: Event",
@@ -703,7 +763,7 @@
     "methods": [
       {
         "name": "Autolayout",
-        "parameters": "true);\n  autoLayout = input<boolean>(false);\n  gridSize = input(20);\n  snapToGrid = input<boolean>(true);\n  gridColor = input<[string, string]>(['#d8d8d8', '#2c2c2c']);\n\n  nodes = model<BlueprintNode[]>([]);\n\n  #currentGridColor = computed(() => this.gridColor()[this.lightMode() ? 0 : 1]);\n\n  panX = signal(0);\n  panY = signal(0);\n  zoomLevel = signal(1);\n  gridSnapSize = signal(20);\n\n  isHoveringNode = signal(false);\n  midpointDivPosition = signal<{ x: number; y: number } | null>(null);\n  showMidpointDiv = signal(false);\n  isLocked = signal(false);\n  draggingConnection = signal<DragState | null>(null);\n  validationErrors = signal<ValidationErrors | null>(null);\n  highlightedConnection = signal<Connection | null>(null);\n\n  #draggingNodeCoordinates = signal<Coordinates | null>(null);\n  #isDragging = signal(false);\n  #lastMouseX = signal(0);\n  #lastMouseY = signal(0);\n  #initialPinchDistance = signal(0);\n  #isNodeDragging = signal(false);\n  #draggedNodeId = signal<string | null>(null);\n  #dragOffset = signal<Coordinates | null>(null);\n  #connections = signal<Connection[]>([]);\n  #canvasWidth = signal(0);\n  #canvasHeight = signal(0);\n\n  @ViewChild('blueprintCanvas', { static: true }) canvasRef!: ElementRef<HTMLCanvasElement>;\n  #ctx!: CanvasRenderingContext2D;\n  #resizeObserver!: ResizeObserver;\n\n  visibleNodes = computed(() => {\n    const nodes = this.nodes();\n    const panX = this.panX();\n    const panY = this.panY();\n    const zoom = this.zoomLevel();\n    const width = this.#canvasWidth();\n    const height = this.#canvasHeight();\n\n    if (width === 0 || height === 0",
+        "parameters": "true);\n  autoLayout = input<boolean>(false);\n  gridSize = input(20);\n  snapToGrid = input<boolean>(true);\n  gridColor = input<[string, string]>(['#d8d8d8', '#2c2c2c']);\n\n  nodes = model<BlueprintNode[]>([]);\n\n  #currentGridColor = computed(() => this.gridColor()[this.lightMode() ? 0 : 1]);\n\n  panX = signal(0);\n  panY = signal(0);\n  zoomLevel = signal(1);\n  gridSnapSize = signal(20);\n\n  isHoveringNode = signal(false);\n  midpointDivPosition = signal<{ x: number; y: number } | null>(null);\n  showMidpointDiv = signal(false);\n  isLocked = signal(false);\n  draggingConnection = signal<DragState | null>(null);\n  validationErrors = signal<ValidationErrors | null>(null);\n  highlightedConnection = signal<Connection | null>(null);\n\n  #draggingNodeCoordinates = signal<Coordinates | null>(null);\n  #isDragging = signal(false);\n  #lastMouseX = signal(0);\n  #lastMouseY = signal(0);\n  #initialPinchDistance = signal(0);\n  #isNodeDragging = signal(false);\n  #draggedNodeId = signal<string | null>(null);\n  #dragOffset = signal<Coordinates | null>(null);\n  #connections = signal<Connection[]>([]);\n  #canvasWidth = signal(0);\n  #canvasHeight = signal(0);\n\n  canvasRef = viewChild.required<ElementRef<HTMLCanvasElement>>('blueprintCanvas');\n  #ctx!: CanvasRenderingContext2D;\n  #resizeObserver!: ResizeObserver;\n\n  visibleNodes = computed(() => {\n    const nodes = this.nodes();\n    const panX = this.panX();\n    const panY = this.panY();\n    const zoom = this.zoomLevel();\n    const width = this.#canvasWidth();\n    const height = this.#canvasHeight();\n\n    if (width === 0 || height === 0",
         "returnType": "any",
         "description": ""
       },
@@ -936,7 +996,7 @@
       },
       {
         "name": "return",
-        "parameters": "pos.left >= 0 &&\n      pos.top >= 0 &&\n      pos.left + m.width <= window.innerWidth &&\n      pos.top + m.height <= window.innerHeight\n    );\n  }\n\n  /** Clamp a position so the popover stays within the viewport */\n  #clampToViewport(pos: { left: number; top: number }, m: DOMRect",
+        "parameters": "pos.left >= 0 &&\n      pos.top >= 0 &&\n      pos.left + m.width <= window.innerWidth &&\n      pos.top + m.height <= window.innerHeight\n    );\n  }\n\n  \n  #clampToViewport(pos: { left: number; top: number }, m: DOMRect",
         "returnType": "any",
         "description": ""
       }
@@ -1101,7 +1161,14 @@
       }
     ],
     "outputs": [],
-    "methods": [],
+    "methods": [
+      {
+        "name": "onInternalInputChange",
+        "parameters": "event: Event",
+        "returnType": "any",
+        "description": ""
+      }
+    ],
     "cssVariables": [
       {
         "name": "--toggle-bg",
@@ -1194,7 +1261,7 @@
     "methods": [
       {
         "name": "effect",
-        "parameters": "() => {\n      const inputs = this.#inputObserver() as HTMLInputElement[];\n      if (inputs.length === 0) return;\n\n      if (inputs[0]) this.setupInput(inputs[0], true);\n      if (inputs[1]) this.setupInput(inputs[1], false);\n    });\n  }\n\n  private setupInput(element: HTMLInputElement, isStart: boolean",
+        "parameters": "() => {\n      const inputs = this.#inputObserver() as HTMLInputElement[];\n      if (inputs.length === 0) return;\n\n      if (inputs[0]) this.#setupInput(inputs[0], true);\n      if (inputs[1]) this.#setupInput(inputs[1], false);\n    });\n  }\n\n  #setupInput(element: HTMLInputElement, isStart: boolean",
         "returnType": "any",
         "description": ""
       },
@@ -1728,7 +1795,7 @@
       },
       {
         "name": "effect",
-        "parameters": "() => {\n      this.items(); // track projected items\n      this.updateProgress();\n    });\n\n    if (typeof MutationObserver !== 'undefined'",
+        "parameters": "() => {\n      this.items(); \n      this.updateProgress();\n    });\n\n    if (typeof MutationObserver !== 'undefined'",
         "returnType": "any",
         "description": ""
       },
@@ -1891,6 +1958,12 @@
         "description": "",
         "defaultValue": "'start'"
       },
+      {
+        "name": "grid",
+        "type": "boolean",
+        "description": "",
+        "defaultValue": "false"
+      },
       {
         "name": "loading",
         "type": "boolean",
@@ -1948,6 +2021,18 @@
       }
     ],
     "methods": [
+      {
+        "name": "effect",
+        "parameters": "() => {\n      if (this.#sort()) return;\n\n      const hostEl = this.#el.nativeElement;\n      if (this.resizable()",
+        "returnType": "any",
+        "description": ""
+      },
+      {
+        "name": "onKeyDown",
+        "parameters": "event: KeyboardEvent",
+        "returnType": "any",
+        "description": ""
+      },
       {
         "name": "onMouseMove",
         "parameters": "event: MouseEvent",
@@ -1956,19 +2041,19 @@
       },
       {
         "name": "cancelAnimationFrame",
-        "parameters": "this.#animationFrameRequest);\n    }\n  }\n}\n\n@Directive({\n  selector: '[shSort]',\n  standalone: true,\n  host: {\n    role: 'columnheader',\n    '[class.sortable]': '!!shSort()',\n    '[attr.tabindex]': 'shSort() ? \"0\" : null',\n    '(click)': 'shSort() ? toggleSort(",
-        "returnType": "null',\n    '[attr.aria-sort]': 'shSort() ? ariaSort() : null',\n    '[class.sort-asc]': 'sortAsc()',\n    '[class.sort-desc]': 'sortDesc()',\n  },\n})\nexport class ShipSort",
+        "parameters": "this.#animationFrameRequest);\n    }\n  }\n}\n\n@Directive({\n  selector: '[shSort]',\n  standalone: true,\n  host: {\n    role: 'columnheader',\n    '[class.sortable]': '!!shSort()',\n    '[attr.tabindex]': 'tabIndex()',\n    '(click)': 'shSort() ? toggleSort($event",
+        "returnType": "null',\n    '[attr.aria-sort]': 'shSort() ? ariaSort() : null',\n    '[class.sort-asc]': 'sortAsc()',\n    '[class.sort-desc]': 'sortDesc()',\n    '[attr.aria-keyshortcuts]': 'ariaKeyshortcuts()',\n  },\n})\nexport class ShipSort",
         "description": ""
       },
       {
-        "name": "onKeyDown",
-        "parameters": "event: KeyboardEvent",
+        "name": "onCleanup",
+        "parameters": "() => observer.disconnect());\n    }\n  });\n\n  bodyEffect = effect(() => {\n    const body = this.tbody()?.nativeElement;\n    const head = this.thead()?.nativeElement;\n\n    if (!body || !head) return;\n\n    const stickyHeaderHeight = this.stickyHeaderHeight();\n\n    queueMicrotask(() => {\n      const hasStickyRowHeaderStartElement = head.querySelectorAll('tr.sticky').length > 0;\n      const stickyBodyRows = body.querySelectorAll('tr.sticky');\n      const hasStickyRowStartElement = stickyBodyRows.length > 0;\n\n      if (hasStickyRowStartElement && hasStickyRowHeaderStartElement",
         "returnType": "any",
         "description": ""
       },
       {
-        "name": "onCleanup",
-        "parameters": "() => observer.disconnect());\n    }\n  });\n\n  bodyEffect = effect(() => {\n    const body = this.tbody()?.nativeElement;\n    const head = this.thead()?.nativeElement;\n\n    if (!body || !head) return;\n\n    const stickyHeaderHeight = this.stickyHeaderHeight();\n\n    queueMicrotask(() => {\n      const hasStickyRowHeaderStartElement = head.querySelectorAll('tr.sticky').length > 0;\n      const stickyBodyRows = body.querySelectorAll('tr.sticky');\n      const hasStickyRowStartElement = stickyBodyRows.length > 0;\n\n      if (hasStickyRowStartElement && hasStickyRowHeaderStartElement",
+        "name": "untracked",
+        "parameters": "() => {\n      const host = this.#el.nativeElement;\n      const allCells = host.querySelectorAll('th, td');\n\n      if (gridActive",
         "returnType": "any",
         "description": ""
       },
@@ -1990,6 +2075,12 @@
         "returnType": "any",
         "description": ""
       },
+      {
+        "name": "onGridKeyDown",
+        "parameters": "event: KeyboardEvent",
+        "returnType": "any",
+        "description": ""
+      },
       {
         "name": "toggleSort",
         "parameters": "column: string",
@@ -2123,8 +2214,8 @@
       },
       {
         "name": "config-table",
-        "html": "<sh-table\n  [loading]=\"isLoading()\"\n  [data]=\"users()\"\n  (dataChange)=\"users.set($event)\"\n  [variant]=\"variant()\"\n  aria-label=\"User Management Configuration Table\">\n  <button shButton actionbar class=\"small primary\" (click)=\"toggleLoading()\">\n    <sh-icon>spinner</sh-icon>\n    Toggle Loading\n  </button>\n  <button shButton actionbar class=\"small flat\" (click)=\"resetData()\">\n    <sh-icon>arrow-counter-clockwise</sh-icon>\n    Reset Data\n  </button>\n\n  <sh-table-content [columns]=\"columns()\" [data]=\"users()\" />\n\n  <!-- Custom User Column Template -->\n  <ng-template #nameTemplate let-row>\n    <div class=\"user-cell\">\n      <span class=\"user-name\">{{ row.name }}</span>\n      <span class=\"user-email\">{{ row.email }}</span>\n    </div>\n  </ng-template>\n\n  <!-- Custom Actions Column Template -->\n  <ng-template #actionsTemplate let-row>\n    <button shButton class=\"small text primary\" (click)=\"editUser(row)\" title=\"Edit user\">\n      <sh-icon>pencil-simple</sh-icon>\n    </button>\n    <button shButton class=\"small text error\" (click)=\"deleteUser(row.id)\" title=\"Delete user\">\n      <sh-icon>trash</sh-icon>\n    </button>\n  </ng-template>\n</sh-table>\n",
-        "ts": "import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, computed, input, signal, TemplateRef, viewChild } from '@angular/core';\nimport { ShipTableVariant } from '@ship-ui/core';\nimport { ShipButton } from '@ship-ui/core/ship-button';\nimport { ShipIcon } from '@ship-ui/core/ship-icon';\nimport { ShipTable, ShipTableColumn, ShipTableContent } from '@ship-ui/core/ship-table';\n\nexport interface ConfigUserElement {\n  id: number;\n  name: string;\n  email: string;\n  role: string;\n  active: boolean;\n  joined: string;\n  bio: string;\n}\n\nconst INITIAL_USERS: ConfigUserElement[] = [\n  {\n    id: 1,\n    name: 'Alice Vance',\n    email: 'alice@shipui.com',\n    role: 'Administrator',\n    active: true,\n    joined: '2025-01-15T09:30:00',\n    bio: 'Lead platform engineer and architect of the design system components.',\n  },\n  {\n    id: 2,\n    name: 'Bob Smith',\n    email: 'bob@shipui.com',\n    role: 'Developer',\n    active: true,\n    joined: '2025-03-22T17:15:00',\n    bio: 'Frontend engineer specializing in accessible interactive charts and graphs.',\n  },\n  {\n    id: 3,\n    name: 'Charlie Brown',\n    email: 'charlie@shipui.com',\n    role: 'Support',\n    active: false,\n    joined: '2025-06-05T11:00:00',\n    bio: 'Customer success advocate passionate about documentation and developer experience.',\n  },\n  {\n    id: 4,\n    name: 'Diana Prince',\n    email: 'diana@shipui.com',\n    role: 'Product Manager',\n    active: true,\n    joined: '2024-10-12T08:45:00',\n    bio: 'Product strategist steering the integration of AI-assisted coding tools.',\n  },\n  {\n    id: 5,\n    name: 'Evan Wright',\n    email: 'evan@shipui.com',\n    role: 'Designer',\n    active: false,\n    joined: '2024-12-01T14:20:00',\n    bio: 'UI/UX specialist designer who crafted the glassmorphism aesthetic guidelines.',\n  },\n];\n\n@Component({\n  selector: 'config-table',\n  standalone: true,\n  imports: [CommonModule, ShipTable, ShipTableContent, ShipButton, ShipIcon],\n  templateUrl: './config-table.html',\n  styleUrl: './config-table.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ConfigTable {\n  variant = input<ShipTableVariant | null>(null);\n\n  // Sample data\n  users = signal<ConfigUserElement[]>([...INITIAL_USERS]);\n  isLoading = signal<boolean>(false);\n\n  // Template viewChild references\n  nameTemplate = viewChild.required<TemplateRef<any>>('nameTemplate');\n  actionsTemplate = viewChild.required<TemplateRef<any>>('actionsTemplate');\n\n  // Reactively build columns once templates are loaded\n  columns = computed<ShipTableColumn<ConfigUserElement>[]>(() => [\n    {\n      id: 'id',\n      header: 'ID',\n      type: 'number',\n      sortable: true,\n      size: '60px',\n      sticky: 'start',\n    },\n    {\n      id: 'name',\n      header: 'User',\n      type: 'string',\n      sortable: true,\n      size: '220px',\n      sticky: 'start',\n      cellTemplate: this.nameTemplate(),\n      rowHeader: true,\n    },\n    {\n      id: 'role',\n      header: 'Role',\n      type: 'badge',\n      sortable: true,\n      size: '150px',\n    },\n    {\n      id: 'active',\n      header: 'Active Status',\n      type: 'boolean',\n      sortable: true,\n      size: '120px',\n    },\n    {\n      id: 'joined',\n      header: 'Joined Date',\n      type: 'date',\n      sortable: true,\n      size: '140px',\n    },\n    {\n      id: 'bio',\n      header: 'Bio',\n      type: 'string',\n      resizable: true,\n      size: '1fr',\n    },\n    {\n      id: 'actions',\n      header: 'Actions',\n      sticky: 'end',\n      cellTemplate: this.actionsTemplate(),\n    },\n  ]);\n\n  toggleLoading() {\n    this.isLoading.set(true);\n    setTimeout(() => {\n      this.isLoading.set(false);\n    }, 1200);\n  }\n\n  deleteUser(id: number) {\n    this.users.update((current) => current.filter((u) => u.id !== id));\n  }\n\n  editUser(user: ConfigUserElement) {\n    alert(`Editing user: ${user.name}`);\n  }\n\n  resetData() {\n    this.users.set([...INITIAL_USERS]);\n  }\n}\n"
+        "html": "<sh-table\n  [loading]=\"isLoading()\"\n  [data]=\"users()\"\n  (dataChange)=\"users.set($event)\"\n  [variant]=\"variant()\"\n  [grid]=\"gridMode()\"\n  aria-label=\"User Management Configuration Table\">\n  <button shButton actionbar class=\"small primary\" (click)=\"toggleLoading()\">\n    <sh-icon>spinner</sh-icon>\n    Toggle Loading\n  </button>\n  <button shButton actionbar class=\"small outline\" [class.primary]=\"gridMode()\" (click)=\"gridMode.set(!gridMode())\">\n    <sh-icon>{{ gridMode() ? 'check-square' : 'square' }}</sh-icon>\n    Interactive Grid: {{ gridMode() ? 'ON' : 'OFF' }}\n  </button>\n  <button shButton actionbar class=\"small flat\" (click)=\"resetData()\">\n    <sh-icon>arrow-counter-clockwise</sh-icon>\n    Reset Data\n  </button>\n\n  <sh-table-content [columns]=\"columns()\" [data]=\"users()\" />\n\n  <!-- Custom User Column Template -->\n  <ng-template #nameTemplate let-row>\n    <div class=\"user-cell\">\n      <span class=\"user-name\">{{ row.name }}</span>\n      <span class=\"user-email\">{{ row.email }}</span>\n    </div>\n  </ng-template>\n\n  <!-- Custom Actions Column Template -->\n  <ng-template #actionsTemplate let-row>\n    <button shButton class=\"small text primary\" (click)=\"editUser(row)\" title=\"Edit user\">\n      <sh-icon>pencil-simple</sh-icon>\n    </button>\n    <button shButton class=\"small text error\" (click)=\"deleteUser(row.id)\" title=\"Delete user\">\n      <sh-icon>trash</sh-icon>\n    </button>\n  </ng-template>\n</sh-table>\n",
+        "ts": "import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, computed, input, signal, TemplateRef, viewChild } from '@angular/core';\nimport { ShipTableVariant } from '@ship-ui/core';\nimport { ShipButton } from '@ship-ui/core/ship-button';\nimport { ShipIcon } from '@ship-ui/core/ship-icon';\nimport { ShipTable, ShipTableColumn, ShipTableContent } from '@ship-ui/core/ship-table';\n\nexport interface ConfigUserElement {\n  id: number;\n  name: string;\n  email: string;\n  role: string;\n  active: boolean;\n  joined: string;\n  bio: string;\n}\n\nconst INITIAL_USERS: ConfigUserElement[] = [\n  {\n    id: 1,\n    name: 'Alice Vance',\n    email: 'alice@shipui.com',\n    role: 'Administrator',\n    active: true,\n    joined: '2025-01-15T09:30:00',\n    bio: 'Lead platform engineer and architect of the design system components.',\n  },\n  {\n    id: 2,\n    name: 'Bob Smith',\n    email: 'bob@shipui.com',\n    role: 'Developer',\n    active: true,\n    joined: '2025-03-22T17:15:00',\n    bio: 'Frontend engineer specializing in accessible interactive charts and graphs.',\n  },\n  {\n    id: 3,\n    name: 'Charlie Brown',\n    email: 'charlie@shipui.com',\n    role: 'Support',\n    active: false,\n    joined: '2025-06-05T11:00:00',\n    bio: 'Customer success advocate passionate about documentation and developer experience.',\n  },\n  {\n    id: 4,\n    name: 'Diana Prince',\n    email: 'diana@shipui.com',\n    role: 'Product Manager',\n    active: true,\n    joined: '2024-10-12T08:45:00',\n    bio: 'Product strategist steering the integration of AI-assisted coding tools.',\n  },\n  {\n    id: 5,\n    name: 'Evan Wright',\n    email: 'evan@shipui.com',\n    role: 'Designer',\n    active: false,\n    joined: '2024-12-01T14:20:00',\n    bio: 'UI/UX specialist designer who crafted the glassmorphism aesthetic guidelines.',\n  },\n];\n\n@Component({\n  selector: 'config-table',\n  standalone: true,\n  imports: [CommonModule, ShipTable, ShipTableContent, ShipButton, ShipIcon],\n  templateUrl: './config-table.html',\n  styleUrl: './config-table.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ConfigTable {\n  variant = input<ShipTableVariant | null>(null);\n\n  // Sample data\n  users = signal<ConfigUserElement[]>([...INITIAL_USERS]);\n  isLoading = signal<boolean>(false);\n  gridMode = signal<boolean>(false);\n\n  // Template viewChild references\n  nameTemplate = viewChild.required<TemplateRef<any>>('nameTemplate');\n  actionsTemplate = viewChild.required<TemplateRef<any>>('actionsTemplate');\n\n  // Reactively build columns once templates are loaded\n  columns = computed<ShipTableColumn<ConfigUserElement>[]>(() => [\n    {\n      id: 'id',\n      header: 'ID',\n      type: 'number',\n      sortable: true,\n      size: '60px',\n      sticky: 'start',\n    },\n    {\n      id: 'name',\n      header: 'User',\n      type: 'string',\n      sortable: true,\n      size: '220px',\n      sticky: 'start',\n      cellTemplate: this.nameTemplate(),\n      rowHeader: true,\n    },\n    {\n      id: 'role',\n      header: 'Role',\n      type: 'badge',\n      sortable: true,\n      size: '150px',\n    },\n    {\n      id: 'active',\n      header: 'Active Status',\n      type: 'boolean',\n      sortable: true,\n      size: '120px',\n    },\n    {\n      id: 'joined',\n      header: 'Joined Date',\n      type: 'date',\n      sortable: true,\n      size: '140px',\n    },\n    {\n      id: 'bio',\n      header: 'Bio',\n      type: 'string',\n      resizable: true,\n      size: '1fr',\n    },\n    {\n      id: 'actions',\n      header: 'Actions',\n      sticky: 'end',\n      cellTemplate: this.actionsTemplate(),\n    },\n  ]);\n\n  toggleLoading() {\n    this.isLoading.set(true);\n    setTimeout(() => {\n      this.isLoading.set(false);\n    }, 1200);\n  }\n\n  deleteUser(id: number) {\n    this.users.update((current) => current.filter((u) => u.id !== id));\n  }\n\n  editUser(user: ConfigUserElement) {\n    alert(`Editing user: ${user.name}`);\n  }\n\n  resetData() {\n    this.users.set([...INITIAL_USERS]);\n  }\n}\n"
       },
       {
         "name": "multi-table-header",
@@ -2240,7 +2331,14 @@
       }
     ],
     "outputs": [],
-    "methods": [],
+    "methods": [
+      {
+        "name": "onInternalInputChange",
+        "parameters": "event: Event",
+        "returnType": "any",
+        "description": ""
+      }
+    ],
     "cssVariables": [
       {
         "name": "--radiod-c",
@@ -2288,7 +2386,7 @@
       {
         "name": "sortableManager",
         "type": "any",
-        "description": "The flat list of all tree nodes. */ readonly items = model<any[]>([]); /** Optional Writable/Readable WritableSignal manager created by createTreeSortableManager.",
+        "description": "",
         "defaultValue": "null"
       },
       {
@@ -2330,19 +2428,19 @@
       {
         "name": "getIcon",
         "type": "(item: any) => string | null",
-        "description": "The flat list of all tree nodes. */ readonly items = model<any[]>([]); /** Optional Writable/Readable WritableSignal manager created by createTreeSortableManager. */ readonly sortableManager = input<any>(null); /** Currently selected node ID. */ readonly selectedId = model<string | null>(null); // Mappings readonly getId = input<(item: any) => string>((item) => item.id); readonly getName = input<(item: any) => string>((item) => item.name); readonly getParentId = input<(item: any) => string | null>((item) => item.parentId); readonly isFolder = input<(item: any) => boolean>((item) => item.type === 'dir'); readonly getIsOpen = input<(item: any) => boolean>((item) => !!item.isOpen); readonly setIsOpen = input<(item: any, isOpen: boolean) => void>((item, open) => { item.isOpen = open; }); /** Function returning a custom icon name for a node.",
+        "description": "",
         "defaultValue": "("
       },
       {
         "name": "items",
         "type": "any[]",
-        "description": "The flat list of all tree nodes.",
+        "description": "",
         "defaultValue": "[]"
       },
       {
         "name": "selectedId",
         "type": "string | null",
-        "description": "The flat list of all tree nodes. */ readonly items = model<any[]>([]); /** Optional Writable/Readable WritableSignal manager created by createTreeSortableManager. */ readonly sortableManager = input<any>(null); /** Currently selected node ID.",
+        "description": "",
         "defaultValue": "null"
       }
     ],
@@ -2536,7 +2634,7 @@
     "methods": [
       {
         "name": "untracked",
-        "parameters": "() => this.drawColorPicker());\n\n      if (this.previousLayoutHash !== layoutHash",
+        "parameters": "() => this.#drawColorPicker());\n\n      if (this.#previousLayoutHash !== layoutHash",
         "returnType": "any",
         "description": ""
       }
@@ -2665,7 +2763,56 @@
     ]
   },
   {
-    "name": "ShipSortable",
+    "name": "ShipListItemSwipeService",
+    "selector": "sh-list-item-swipe",
+    "path": "core/projects/ship-ui/ship-list-item-swipe/ship-list-item-swipe.ts",
+    "description": "",
+    "keywords": [],
+    "inputs": [
+      {
+        "name": "swipeThreshold",
+        "type": "number",
+        "description": "",
+        "defaultValue": "0.3"
+      }
+    ],
+    "outputs": [
+      {
+        "name": "swipeOpen",
+        "type": "'left' | 'right'",
+        "description": ""
+      },
+      {
+        "name": "swipeClose",
+        "type": "void",
+        "description": ""
+      }
+    ],
+    "methods": [
+      {
+        "name": "onTouchStart",
+        "parameters": "e: TouchEvent",
+        "returnType": "any",
+        "description": ""
+      },
+      {
+        "name": "open",
+        "parameters": "side: 'left' | 'right'",
+        "returnType": "any",
+        "description": ""
+      },
+      {
+        "name": "close",
+        "parameters": "",
+        "returnType": "any",
+        "description": ""
+      }
+    ],
+    "cssVariables": [],
+    "examples": []
+  },
+  {
+    "name": "ShipSortableService",
     "selector": "[shSortable]",
     "path": "core/projects/ship-ui/ship-sortable/ship-sortable.ts",
     "description": "### Enable Sorting\n\nApply the\n`shSortable`\ndirective to any container element to enable drag-and-drop reordering.\n\n### Event Handling\n\nListen to the\n`sortDrop`\nevent to update your data source when an item is moved. For tree structures, listen to the\n`treeDrop`\nevent.\n\n### Sortable Manager (Recommended)\n\nVastly simplify drag-and-drop state by passing a manager to the\n`shSortable`\ninput. Use\n`createSortableManager()`\nfor simple and cross-list configurations, or\n`createTreeSortableManager()`\nfor hierarchical trees.\n\n### Tree View Drag & Drop\n\nEnable VSCode-explorer-style tree drag-and-drop by setting\n`sortingMode=\"tree\"`\nand binding\n`[treeItems]`\nto the visible items list. Target folders must include the\n`sortable-folder=\"true\"`\nattribute to accept drop-inside actions.\n\n### Drag Handles\n\nAdd the\n`sort-handle`\nattribute to a specific element within a sortable item to limit dragging to that specific region.",
@@ -2695,6 +2842,18 @@
         "description": "",
         "defaultValue": "'list'"
       },
+      {
+        "name": "touchEnabled",
+        "type": "boolean",
+        "description": "",
+        "defaultValue": "false"
+      },
+      {
+        "name": "touchActivation",
+        "type": "'longpress' | 'handle' | 'none'",
+        "description": "",
+        "defaultValue": "'longpress'"
+      },
       {
         "name": "treeItems",
         "type": "any[]",
@@ -2744,38 +2903,38 @@
         "description": ""
       },
       {
-        "name": "dragLeave",
-        "parameters": "e: DragEvent",
+        "name": "processDragEnter",
+        "parameters": "",
         "returnType": "any",
         "description": ""
       },
       {
-        "name": "dragOver",
+        "name": "dragLeave",
         "parameters": "e: DragEvent",
         "returnType": "any",
         "description": ""
       },
       {
-        "name": "getVisualIndexOfElement",
-        "parameters": "i: number",
-        "returnType": "number",
+        "name": "processDragLeave",
+        "parameters": "clientX: number, clientY: number, relatedTarget: Node | null, force = false",
+        "returnType": "any",
         "description": ""
       },
       {
-        "name": "drop",
-        "parameters": "event: ShipTreeDropEvent, visibleNodesList: T[]",
-        "returnType": "any",
+        "name": "clientX",
+        "parameters": "array: T[],\n  event: Pick<ShipDropEvent, 'previousIndex' | 'currentIndex'> | Pick<AfterDropResponse, 'fromIndex' | 'toIndex'>",
+        "returnType": "T[]",
         "description": ""
       },
       {
-        "name": "dragEnd",
-        "parameters": "",
+        "name": "while",
+        "parameters": "currentParentId !== null && currentParentId !== undefined",
         "returnType": "any",
         "description": ""
       },
       {
-        "name": "while",
-        "parameters": "currentParentId !== null && currentParentId !== undefined",
+        "name": "drop",
+        "parameters": "event: ShipTreeDropEvent, visibleNodesList: T[]",
         "returnType": "any",
         "description": ""
       },
@@ -4695,7 +4854,14 @@
       }
     ],
     "outputs": [],
-    "methods": [],
+    "methods": [
+      {
+        "name": "onInternalInputChange",
+        "parameters": "event: Event",
+        "returnType": "any",
+        "description": ""
+      }
+    ],
     "cssVariables": [
       {
         "name": "--box-bw",
@@ -4856,19 +5022,19 @@
       {
         "name": "mode",
         "type": "'global' | 'local'",
-        "description": "The registered action name (e.g. 'table.next-page', 'dialog.close'). / shA11yKeybinding = input.required<string>(); /** Defines whether the keybinding listener is 'local' (host element keydown) or 'global' (window keydown). Default is 'local'.",
+        "description": "",
         "defaultValue": "'local'"
       },
       {
         "name": "preventDefault",
         "type": "boolean",
-        "description": "The registered action name (e.g. 'table.next-page', 'dialog.close'). / shA11yKeybinding = input.required<string>(); /** Defines whether the keybinding listener is 'local' (host element keydown) or 'global' (window keydown). Default is 'local'. / mode = input<'global' | 'local'>('local'); /** Whether to prevent the default action when the keybinding matches.",
+        "description": "",
         "defaultValue": "true"
       },
       {
         "name": "stopPropagation",
         "type": "boolean",
-        "description": "The registered action name (e.g. 'table.next-page', 'dialog.close'). / shA11yKeybinding = input.required<string>(); /** Defines whether the keybinding listener is 'local' (host element keydown) or 'global' (window keydown). Default is 'local'. / mode = input<'global' | 'local'>('local'); /** Whether to prevent the default action when the keybinding matches. / preventDefault = input<boolean>(true); /** Whether to stop event propagation when the keybinding matches.",
+        "description": "",
         "defaultValue": "true"
       }
     ],
@@ -4876,7 +5042,7 @@
       {
         "name": "triggered",
         "type": "KeyboardEvent",
-        "description": "The registered action name (e.g. 'table.next-page', 'dialog.close'). / shA11yKeybinding = input.required<string>(); /** Defines whether the keybinding listener is 'local' (host element keydown) or 'global' (window keydown). Default is 'local'. / mode = input<'global' | 'local'>('local'); /** Whether to prevent the default action when the keybinding matches. / preventDefault = input<boolean>(true); /** Whether to stop event propagation when the keybinding matches. / stopPropagation = input<boolean>(true); /** Event emitted when the keybinding is triggered."
+        "description": ""
       }
     ],
     "methods": [
@@ -4888,7 +5054,7 @@
       },
       {
         "name": "onCleanup",
-        "parameters": "() => {\n          window.removeEventListener('keydown', listener);\n        });\n      }\n    });\n  }\n\n  /**\n   * Local keydown listener when mode is 'local'\n   */\n  @HostListener('keydown', ['$event'])\n  onKeyDown(event: KeyboardEvent",
+        "parameters": "() => {\n          window.removeEventListener('keydown', listener);\n        });\n      }\n    });\n  }\n\n  \n\n\n  @HostListener('keydown', ['$event'])\n  onKeyDown(event: KeyboardEvent",
         "returnType": "void",
         "description": ""
       }
@@ -4927,31 +5093,31 @@
         "name": "registerDefaults",
         "parameters": "defaults: Record<string, string>",
         "returnType": "void",
-        "description": "Returns true if the platform is running on macOS. / get isMac(): boolean { if (!isPlatformBrowser(this.#platformId)) return false; return navigator.userAgent.toLowerCase().includes('mac'); } constructor() { this.registerDefaults(DEFAULT_KEYBINDINGS); if (this.#overrides) { this.registerOverrides(this.#overrides); } } /** Registers default shortcuts for actions. If an override already exists for a given action, the override takes precedence."
+        "description": ""
       },
       {
         "name": "registerOverrides",
         "parameters": "overrides: Record<string, string>",
         "returnType": "void",
-        "description": "Returns true if the platform is running on macOS. / get isMac(): boolean { if (!isPlatformBrowser(this.#platformId)) return false; return navigator.userAgent.toLowerCase().includes('mac'); } constructor() { this.registerDefaults(DEFAULT_KEYBINDINGS); if (this.#overrides) { this.registerOverrides(this.#overrides); } } /** Registers default shortcuts for actions. If an override already exists for a given action, the override takes precedence. / registerDefaults(defaults: Record<string, string>): void { for (const [action, shortcut] of Object.entries(defaults)) { this.#defaults.set(action, shortcut); // If we don't have an override/binding for this action, set it as the active binding if (!this.#bindings.has(action)) { this.#bindings.set(action, shortcut); } } } /** Registers overrides for actions. Overwrites any existing or default bindings."
+        "description": ""
       },
       {
         "name": "getShortcut",
         "parameters": "action: string",
         "returnType": "string | undefined",
-        "description": "Returns true if the platform is running on macOS. / get isMac(): boolean { if (!isPlatformBrowser(this.#platformId)) return false; return navigator.userAgent.toLowerCase().includes('mac'); } constructor() { this.registerDefaults(DEFAULT_KEYBINDINGS); if (this.#overrides) { this.registerOverrides(this.#overrides); } } /** Registers default shortcuts for actions. If an override already exists for a given action, the override takes precedence. / registerDefaults(defaults: Record<string, string>): void { for (const [action, shortcut] of Object.entries(defaults)) { this.#defaults.set(action, shortcut); // If we don't have an override/binding for this action, set it as the active binding if (!this.#bindings.has(action)) { this.#bindings.set(action, shortcut); } } } /** Registers overrides for actions. Overwrites any existing or default bindings. / registerOverrides(overrides: Record<string, string>): void { for (const [action, shortcut] of Object.entries(overrides)) { this.#bindings.set(action, shortcut); } } /** Retrieves the active shortcut string for a registered action."
+        "description": ""
       },
       {
         "name": "getDefaultShortcut",
         "parameters": "action: string",
         "returnType": "string | undefined",
-        "description": "Returns true if the platform is running on macOS. / get isMac(): boolean { if (!isPlatformBrowser(this.#platformId)) return false; return navigator.userAgent.toLowerCase().includes('mac'); } constructor() { this.registerDefaults(DEFAULT_KEYBINDINGS); if (this.#overrides) { this.registerOverrides(this.#overrides); } } /** Registers default shortcuts for actions. If an override already exists for a given action, the override takes precedence. / registerDefaults(defaults: Record<string, string>): void { for (const [action, shortcut] of Object.entries(defaults)) { this.#defaults.set(action, shortcut); // If we don't have an override/binding for this action, set it as the active binding if (!this.#bindings.has(action)) { this.#bindings.set(action, shortcut); } } } /** Registers overrides for actions. Overwrites any existing or default bindings. / registerOverrides(overrides: Record<string, string>): void { for (const [action, shortcut] of Object.entries(overrides)) { this.#bindings.set(action, shortcut); } } /** Retrieves the active shortcut string for a registered action. / getShortcut(action: string): string | undefined { return this.#bindings.get(action); } /** Retrieves the default shortcut string for a registered action."
+        "description": ""
       },
       {
         "name": "getDisplayShortcut",
         "parameters": "action: string",
         "returnType": "string | undefined",
-        "description": "Returns true if the platform is running on macOS. / get isMac(): boolean { if (!isPlatformBrowser(this.#platformId)) return false; return navigator.userAgent.toLowerCase().includes('mac'); } constructor() { this.registerDefaults(DEFAULT_KEYBINDINGS); if (this.#overrides) { this.registerOverrides(this.#overrides); } } /** Registers default shortcuts for actions. If an override already exists for a given action, the override takes precedence. / registerDefaults(defaults: Record<string, string>): void { for (const [action, shortcut] of Object.entries(defaults)) { this.#defaults.set(action, shortcut); // If we don't have an override/binding for this action, set it as the active binding if (!this.#bindings.has(action)) { this.#bindings.set(action, shortcut); } } } /** Registers overrides for actions. Overwrites any existing or default bindings. / registerOverrides(overrides: Record<string, string>): void { for (const [action, shortcut] of Object.entries(overrides)) { this.#bindings.set(action, shortcut); } } /** Retrieves the active shortcut string for a registered action. / getShortcut(action: string): string | undefined { return this.#bindings.get(action); } /** Retrieves the default shortcut string for a registered action. / getDefaultShortcut(action: string): string | undefined { return this.#defaults.get(action); } /** Gets a formatted, user-friendly shortcut string for display. E.g. 'ctrlOrCmd+Shift+KeyK' -> '⌘⇧K' on macOS, 'Ctrl+Shift+K' on Windows/Linux. Supports comma-separated multiple shortcuts (e.g. 'ArrowRight, d' -> 'ArrowRight, D')."
+        "description": ""
       }
     ],
     "cssVariables": [],
@@ -5681,7 +5847,7 @@
     "methods": [
       {
         "name": "onCleanup",
-        "parameters": "() => {\n      const index = ShipMenu.openMenus.indexOf(this);\n      if (index > -1",
+        "parameters": "() => {\n      const index = openMenus.indexOf(this);\n      if (index > -1",
         "returnType": "any",
         "description": ""
       },

package/bin/src/subset.ts

@@ -4,7 +4,7 @@ import { dirname, resolve } from 'path';
 
 const require = createRequire(import.meta.url);
 
-// @ts-ignore
+
 import wawoff2 from 'wawoff2';
 
 let harfbuzzInst: { harfbuzzJsWasm: any; heapu8: Uint8Array } | null = null;
@@ -42,18 +42,18 @@ export default async function subsetFont(originalFont: Buffer, text: string): Pr
   const face = harfbuzzJsWasm.hb_face_create(blob, 0);
   harfbuzzJsWasm.hb_blob_destroy(blob);
 
-  // equivalent of --font-features=*
-  const layoutFeatures = harfbuzzJsWasm.hb_subset_input_set(input, 6); // HB_SUBSET_SETS_LAYOUT_FEATURE_TAG
+  
+  const layoutFeatures = harfbuzzJsWasm.hb_subset_input_set(input, 6); 
   harfbuzzJsWasm.hb_set_clear(layoutFeatures);
   harfbuzzJsWasm.hb_set_invert(layoutFeatures);
 
-  // equivalent of noLayoutClosure: true
+  
   harfbuzzJsWasm.hb_subset_input_set_flags(
     input,
     harfbuzzJsWasm.hb_subset_input_get_flags(input) | 0x00000200
   );
 
-  // Add mapped unicode indices
+  
   const inputUnicodes = harfbuzzJsWasm.hb_subset_input_unicode_set(input);
   for (const c of text) {
     const cp = c.codePointAt(0);
@@ -93,7 +93,7 @@ export default async function subsetFont(originalFont: Buffer, text: string): Pr
   harfbuzzJsWasm.hb_face_destroy(face);
   harfbuzzJsWasm.free(fontBuffer);
 
-  // Direct compression from TTF -> WOFF2 internally
+  
   const woff2Buffer = await wawoff2.compress(subsetFontBuffer);
   return Buffer.from(woff2Buffer);
 }

package/bin/src/utilities.ts

@@ -1,25 +1,25 @@
-// export function createNameCodeObject(jsonData: Item[]): Record<string, string> {
-//   const nameCodeObject: Record<string, string> = {};
 
-//   for (let i = 0; i < jsonData.length; i++) {
-//     const item = jsonData[i];
-//     const hexCode = item.properties.code.toString(16); // Convert decimal to hex
-//     const codePoint = parseInt(hexCode, 16); // Parse hex to integer code point
-//     const glyph = String.fromCodePoint(codePoint); // Create the glyph
-//     nameCodeObject[item.properties.ligatures] = glyph;
-//   }
 
-//   return nameCodeObject;
-// }
+
+
+
+
+
+
+
+
+
+
+
 
 export const getUnicodeObject = (jsonData: Item[], isDuotone = false): Record<string, [string, string]> => {
   const nameCodeObject: Record<string, [string, string]> = {};
 
   for (let i = 0; i < jsonData.length; i++) {
     const item = jsonData[i];
-    const hexCode = item.properties.code.toString(16); // Convert decimal to hex
-    const codePoint = parseInt(hexCode, 16); // Parse hex to integer code point
-    const glyph = String.fromCodePoint(codePoint); // Create the glyph
+    const hexCode = item.properties.code.toString(16); 
+    const codePoint = parseInt(hexCode, 16); 
+    const glyph = String.fromCodePoint(codePoint); 
     if (glyph === '') {
       console.warn(`Invalid codepoint 0x${hexCode} for ligature ${item.properties.ligatures}`);
       continue;