@tessera-ui/core 0.4.0 → 0.5.0

package/dist/collection/components/input/input.stories.js

@@ -1,151 +0,0 @@
-// Hand-written stories for ts-input
-export default {
-    title: 'Components/Input',
-    tags: ['autodocs'],
-    argTypes: {
-        value: { control: 'text', description: 'The input\'s value.' },
-        type: {
-            control: 'select',
-            options: ['text', 'email', 'password', 'number', 'tel', 'url', 'search'],
-            description: 'The input type.',
-        },
-        size: {
-            control: 'select',
-            options: ['xs', 'sm', 'md', 'lg', 'xl'],
-            description: 'The input\'s size.',
-        },
-        label: { control: 'text', description: 'Label text displayed above the input.' },
-        placeholder: { control: 'text', description: 'Placeholder text.' },
-        helpText: { control: 'text', description: 'Help text displayed below the input.' },
-        error: { control: 'text', description: 'Renders the input in an error state with an error message.' },
-        required: { control: 'boolean', description: 'Makes the input required.' },
-        disabled: { control: 'boolean', description: 'Renders the input as disabled.' },
-        readonly: { control: 'boolean', description: 'Renders the input as readonly.' },
-        maxlength: { control: 'number', description: 'Maximum character length.' },
-        name: { control: 'text', description: 'Name attribute for form submission.' },
-    },
-};
-const Template = (args) => {
-    const attrs = [];
-    if (args.value !== undefined && args.value !== null && args.value !== '')
-        attrs.push(`value="${args.value}"`);
-    if (args.type !== undefined && args.type !== null)
-        attrs.push(`type="${args.type}"`);
-    if (args.size !== undefined && args.size !== null)
-        attrs.push(`size="${args.size}"`);
-    if (args.label !== undefined && args.label !== null && args.label !== '')
-        attrs.push(`label="${args.label}"`);
-    if (args.placeholder !== undefined && args.placeholder !== null && args.placeholder !== '')
-        attrs.push(`placeholder="${args.placeholder}"`);
-    if (args.helpText !== undefined && args.helpText !== null && args.helpText !== '')
-        attrs.push(`help-text="${args.helpText}"`);
-    if (args.error !== undefined && args.error !== null && args.error !== '')
-        attrs.push(`error="${args.error}"`);
-    if (args.required)
-        attrs.push('required');
-    if (args.disabled)
-        attrs.push('disabled');
-    if (args.readonly)
-        attrs.push('readonly');
-    if (args.maxlength !== undefined && args.maxlength !== null)
-        attrs.push(`maxlength="${args.maxlength}"`);
-    if (args.name !== undefined && args.name !== null && args.name !== '')
-        attrs.push(`name="${args.name}"`);
-    return `<div style="max-width: 400px;"><ts-input ${attrs.join(' ')}></ts-input></div>`;
-};
-export const Default = Object.assign(Template.bind({}), {
-    args: {
-        value: '',
-        type: 'text',
-        size: 'md',
-        label: 'Full Name',
-        placeholder: 'Enter your full name',
-        helpText: 'As it appears on your government ID.',
-        disabled: false,
-        readonly: false,
-        required: false,
-    },
-});
-export const Sizes = () => `
-  <ts-stack gap="3" style="max-width: 400px;">
-    <ts-input size="xs" label="Extra Small" placeholder="xs input"></ts-input>
-    <ts-input size="sm" label="Small" placeholder="sm input"></ts-input>
-    <ts-input size="md" label="Medium" placeholder="md input"></ts-input>
-    <ts-input size="lg" label="Large" placeholder="lg input"></ts-input>
-    <ts-input size="xl" label="Extra Large" placeholder="xl input"></ts-input>
-  </ts-stack>
-`;
-export const Types = () => `
-  <ts-stack gap="3" style="max-width: 400px;">
-    <ts-input type="text" label="Username" placeholder="johndoe"></ts-input>
-    <ts-input type="email" label="Email Address" placeholder="john@example.com"></ts-input>
-    <ts-input type="password" label="Password" placeholder="Enter password"></ts-input>
-    <ts-input type="number" label="Quantity" placeholder="0"></ts-input>
-    <ts-input type="tel" label="Phone Number" placeholder="+1 (555) 000-0000"></ts-input>
-    <ts-input type="url" label="Website" placeholder="https://example.com"></ts-input>
-    <ts-input type="search" label="Search" placeholder="Search products..."></ts-input>
-  </ts-stack>
-`;
-export const States = () => `
-  <ts-stack gap="3" style="max-width: 400px;">
-    <ts-input label="Default" placeholder="Editable input"></ts-input>
-    <ts-input label="With Value" value="jane@example.com" placeholder="Email"></ts-input>
-    <ts-input label="Disabled" placeholder="Cannot edit" disabled></ts-input>
-    <ts-input label="Read Only" value="Read-only content" readonly></ts-input>
-    <ts-input label="Required" placeholder="This field is required" required></ts-input>
-    <ts-input label="With Help Text" placeholder="Choose a username" help-text="Must be 3-20 characters, letters and numbers only."></ts-input>
-    <ts-input label="Error State" value="invalid-email" error="Please enter a valid email address."></ts-input>
-  </ts-stack>
-`;
-export const WithIcons = () => `
-  <ts-stack gap="3" style="max-width: 400px;">
-    <ts-input label="Search" placeholder="Search files...">
-      <ts-icon slot="prefix" name="search" size="sm"></ts-icon>
-    </ts-input>
-    <ts-input label="Email" placeholder="you@company.com">
-      <ts-icon slot="prefix" name="mail" size="sm"></ts-icon>
-    </ts-input>
-    <ts-input label="Website" placeholder="https://example.com">
-      <ts-icon slot="prefix" name="globe" size="sm"></ts-icon>
-    </ts-input>
-    <ts-input label="Amount" placeholder="0.00">
-      <span slot="prefix" style="font-weight: 600; color: var(--ts-color-text-secondary); padding-left: 4px;">$</span>
-      <span slot="suffix" style="color: var(--ts-color-text-secondary); padding-right: 4px;">USD</span>
-    </ts-input>
-    <ts-input label="Password" type="password" placeholder="Enter password">
-      <ts-icon slot="prefix" name="lock" size="sm"></ts-icon>
-      <ts-icon slot="suffix" name="eye" size="sm"></ts-icon>
-    </ts-input>
-  </ts-stack>
-`;
-export const Composition = () => `
-  <ts-stack gap="4" style="max-width: 400px;">
-    <ts-card bordered padding="lg">
-      <span slot="header"><h3 style="margin: 0;">Sign In</h3></span>
-      <ts-stack gap="3">
-        <ts-input label="Email" type="email" placeholder="john@example.com" required>
-          <ts-icon slot="prefix" name="mail" size="sm"></ts-icon>
-        </ts-input>
-        <ts-input label="Password" type="password" placeholder="Enter your password" required>
-          <ts-icon slot="prefix" name="lock" size="sm"></ts-icon>
-        </ts-input>
-      </ts-stack>
-      <span slot="footer">
-        <ts-stack gap="2" style="padding-top: 8px;">
-          <ts-button block variant="primary">Sign In</ts-button>
-          <ts-button appearance="link" variant="primary">Forgot your password?</ts-button>
-        </ts-stack>
-      </span>
-    </ts-card>
-
-    <ts-row gap="2" align="end">
-      <div style="flex: 1;">
-        <ts-input placeholder="Enter invite code" label="Invite Code">
-          <ts-icon slot="prefix" name="ticket" size="sm"></ts-icon>
-        </ts-input>
-      </div>
-      <ts-button variant="primary">Redeem</ts-button>
-    </ts-row>
-  </ts-stack>
-`;
-//# sourceMappingURL=input.stories.js.map

package/dist/collection/components/input/input.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"input.stories.js","sourceRoot":"","sources":["../../../src/components/input/input.stories.ts"],"names":[],"mappings":"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","sourcesContent":["// Hand-written stories for ts-input\n\nexport default {\n  title: 'Components/Input',\n  tags: ['autodocs'],\n  argTypes: {\n    value: { control: 'text', description: 'The input\\'s value.' },\n    type: {\n      control: 'select',\n      options: ['text', 'email', 'password', 'number', 'tel', 'url', 'search'],\n      description: 'The input type.',\n    },\n    size: {\n      control: 'select',\n      options: ['xs', 'sm', 'md', 'lg', 'xl'],\n      description: 'The input\\'s size.',\n    },\n    label: { control: 'text', description: 'Label text displayed above the input.' },\n    placeholder: { control: 'text', description: 'Placeholder text.' },\n    helpText: { control: 'text', description: 'Help text displayed below the input.' },\n    error: { control: 'text', description: 'Renders the input in an error state with an error message.' },\n    required: { control: 'boolean', description: 'Makes the input required.' },\n    disabled: { control: 'boolean', description: 'Renders the input as disabled.' },\n    readonly: { control: 'boolean', description: 'Renders the input as readonly.' },\n    maxlength: { control: 'number', description: 'Maximum character length.' },\n    name: { control: 'text', description: 'Name attribute for form submission.' },\n  },\n};\n\nconst Template = (args: Record<string, unknown>): string => {\n  const attrs: string[] = [];\n  if (args.value !== undefined && args.value !== null && args.value !== '') attrs.push(`value=\"${args.value}\"`);\n  if (args.type !== undefined && args.type !== null) attrs.push(`type=\"${args.type}\"`);\n  if (args.size !== undefined && args.size !== null) attrs.push(`size=\"${args.size}\"`);\n  if (args.label !== undefined && args.label !== null && args.label !== '') attrs.push(`label=\"${args.label}\"`);\n  if (args.placeholder !== undefined && args.placeholder !== null && args.placeholder !== '') attrs.push(`placeholder=\"${args.placeholder}\"`);\n  if (args.helpText !== undefined && args.helpText !== null && args.helpText !== '') attrs.push(`help-text=\"${args.helpText}\"`);\n  if (args.error !== undefined && args.error !== null && args.error !== '') attrs.push(`error=\"${args.error}\"`);\n  if (args.required) attrs.push('required');\n  if (args.disabled) attrs.push('disabled');\n  if (args.readonly) attrs.push('readonly');\n  if (args.maxlength !== undefined && args.maxlength !== null) attrs.push(`maxlength=\"${args.maxlength}\"`);\n  if (args.name !== undefined && args.name !== null && args.name !== '') attrs.push(`name=\"${args.name}\"`);\n  return `<div style=\"max-width: 400px;\"><ts-input ${attrs.join(' ')}></ts-input></div>`;\n};\n\nexport const Default = Object.assign(Template.bind({}) as typeof Template & { args: Record<string, unknown> }, {\n  args: {\n    value: '',\n    type: 'text',\n    size: 'md',\n    label: 'Full Name',\n    placeholder: 'Enter your full name',\n    helpText: 'As it appears on your government ID.',\n    disabled: false,\n    readonly: false,\n    required: false,\n  },\n});\n\nexport const Sizes = (): string => `\n  <ts-stack gap=\"3\" style=\"max-width: 400px;\">\n    <ts-input size=\"xs\" label=\"Extra Small\" placeholder=\"xs input\"></ts-input>\n    <ts-input size=\"sm\" label=\"Small\" placeholder=\"sm input\"></ts-input>\n    <ts-input size=\"md\" label=\"Medium\" placeholder=\"md input\"></ts-input>\n    <ts-input size=\"lg\" label=\"Large\" placeholder=\"lg input\"></ts-input>\n    <ts-input size=\"xl\" label=\"Extra Large\" placeholder=\"xl input\"></ts-input>\n  </ts-stack>\n`;\n\nexport const Types = (): string => `\n  <ts-stack gap=\"3\" style=\"max-width: 400px;\">\n    <ts-input type=\"text\" label=\"Username\" placeholder=\"johndoe\"></ts-input>\n    <ts-input type=\"email\" label=\"Email Address\" placeholder=\"john@example.com\"></ts-input>\n    <ts-input type=\"password\" label=\"Password\" placeholder=\"Enter password\"></ts-input>\n    <ts-input type=\"number\" label=\"Quantity\" placeholder=\"0\"></ts-input>\n    <ts-input type=\"tel\" label=\"Phone Number\" placeholder=\"+1 (555) 000-0000\"></ts-input>\n    <ts-input type=\"url\" label=\"Website\" placeholder=\"https://example.com\"></ts-input>\n    <ts-input type=\"search\" label=\"Search\" placeholder=\"Search products...\"></ts-input>\n  </ts-stack>\n`;\n\nexport const States = (): string => `\n  <ts-stack gap=\"3\" style=\"max-width: 400px;\">\n    <ts-input label=\"Default\" placeholder=\"Editable input\"></ts-input>\n    <ts-input label=\"With Value\" value=\"jane@example.com\" placeholder=\"Email\"></ts-input>\n    <ts-input label=\"Disabled\" placeholder=\"Cannot edit\" disabled></ts-input>\n    <ts-input label=\"Read Only\" value=\"Read-only content\" readonly></ts-input>\n    <ts-input label=\"Required\" placeholder=\"This field is required\" required></ts-input>\n    <ts-input label=\"With Help Text\" placeholder=\"Choose a username\" help-text=\"Must be 3-20 characters, letters and numbers only.\"></ts-input>\n    <ts-input label=\"Error State\" value=\"invalid-email\" error=\"Please enter a valid email address.\"></ts-input>\n  </ts-stack>\n`;\n\nexport const WithIcons = (): string => `\n  <ts-stack gap=\"3\" style=\"max-width: 400px;\">\n    <ts-input label=\"Search\" placeholder=\"Search files...\">\n      <ts-icon slot=\"prefix\" name=\"search\" size=\"sm\"></ts-icon>\n    </ts-input>\n    <ts-input label=\"Email\" placeholder=\"you@company.com\">\n      <ts-icon slot=\"prefix\" name=\"mail\" size=\"sm\"></ts-icon>\n    </ts-input>\n    <ts-input label=\"Website\" placeholder=\"https://example.com\">\n      <ts-icon slot=\"prefix\" name=\"globe\" size=\"sm\"></ts-icon>\n    </ts-input>\n    <ts-input label=\"Amount\" placeholder=\"0.00\">\n      <span slot=\"prefix\" style=\"font-weight: 600; color: var(--ts-color-text-secondary); padding-left: 4px;\">$</span>\n      <span slot=\"suffix\" style=\"color: var(--ts-color-text-secondary); padding-right: 4px;\">USD</span>\n    </ts-input>\n    <ts-input label=\"Password\" type=\"password\" placeholder=\"Enter password\">\n      <ts-icon slot=\"prefix\" name=\"lock\" size=\"sm\"></ts-icon>\n      <ts-icon slot=\"suffix\" name=\"eye\" size=\"sm\"></ts-icon>\n    </ts-input>\n  </ts-stack>\n`;\n\nexport const Composition = (): string => `\n  <ts-stack gap=\"4\" style=\"max-width: 400px;\">\n    <ts-card bordered padding=\"lg\">\n      <span slot=\"header\"><h3 style=\"margin: 0;\">Sign In</h3></span>\n      <ts-stack gap=\"3\">\n        <ts-input label=\"Email\" type=\"email\" placeholder=\"john@example.com\" required>\n          <ts-icon slot=\"prefix\" name=\"mail\" size=\"sm\"></ts-icon>\n        </ts-input>\n        <ts-input label=\"Password\" type=\"password\" placeholder=\"Enter your password\" required>\n          <ts-icon slot=\"prefix\" name=\"lock\" size=\"sm\"></ts-icon>\n        </ts-input>\n      </ts-stack>\n      <span slot=\"footer\">\n        <ts-stack gap=\"2\" style=\"padding-top: 8px;\">\n          <ts-button block variant=\"primary\">Sign In</ts-button>\n          <ts-button appearance=\"link\" variant=\"primary\">Forgot your password?</ts-button>\n        </ts-stack>\n      </span>\n    </ts-card>\n\n    <ts-row gap=\"2\" align=\"end\">\n      <div style=\"flex: 1;\">\n        <ts-input placeholder=\"Enter invite code\" label=\"Invite Code\">\n          <ts-icon slot=\"prefix\" name=\"ticket\" size=\"sm\"></ts-icon>\n        </ts-input>\n      </div>\n      <ts-button variant=\"primary\">Redeem</ts-button>\n    </ts-row>\n  </ts-stack>\n`;\n"]}

package/dist/collection/components/menu/menu-item.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"menu-item.js","sourceRoot":"","sources":["../../../src/components/menu/menu-item.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, Event, h, Host, Element, Method } from '@stencil/core';\nimport type { EventEmitter } from '@stencil/core';\n\n/**\n * @slot - Default slot for menu item label content.\n * @slot prefix - Content before the label (e.g., icon).\n * @slot suffix - Content after the label (e.g., shortcut or badge).\n *\n * @part base - The menu item container element.\n * @part prefix - The prefix slot wrapper.\n * @part label - The label wrapper.\n * @part suffix - The suffix slot wrapper.\n */\n@Component({\n  tag: 'ts-menu-item',\n  styleUrl: 'menu-item.css',\n  shadow: true,\n})\nexport class TsMenuItem {\n  @Element() hostEl!: HTMLElement;\n\n  /** Disables the menu item. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** The value associated with this menu item. */\n  @Prop({ reflect: true }) value = '';\n\n  /** If provided, renders the item as a link. */\n  @Prop() href?: string;\n\n  /** Emitted when the menu item is selected. */\n  @Event({ eventName: 'tsSelect' }) tsSelect!: EventEmitter<{ value: string }>;\n\n  private baseEl?: HTMLElement;\n\n  /** Focus the menu item. */\n  @Method()\n  async setFocus(): Promise<void> {\n    this.baseEl?.focus();\n  }\n\n  connectedCallback(): void {\n    // Allow the host element to delegate focus to the inner element\n    this.hostEl.addEventListener('focus', () => {\n      this.baseEl?.focus();\n    });\n  }\n\n  private handleClick = (): void => {\n    if (this.disabled) return;\n    this.tsSelect.emit({ value: this.value });\n  };\n\n  private handleKeydown = (event: KeyboardEvent): void => {\n    if (this.disabled) return;\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n      this.tsSelect.emit({ value: this.value });\n    }\n  };\n\n  // eslint-disable-next-line @typescript-eslint/explicit-function-return-type\n  render() {\n    const isLink = !!this.href;\n    const Tag = isLink ? 'a' : 'div';\n\n    const linkAttrs = isLink\n      ? {\n          href: this.disabled ? undefined : this.href,\n        }\n      : {};\n\n    return (\n      <Host\n        class={{\n          'ts-menu-item': true,\n          'ts-menu-item--disabled': this.disabled,\n        }}\n      >\n        <Tag\n          {...linkAttrs}\n          ref={(el) => (this.baseEl = el as HTMLElement)}\n          class=\"menu-item__base\"\n          part=\"base\"\n          role=\"menuitem\"\n          tabindex={this.disabled ? -1 : 0}\n          aria-disabled={this.disabled ? 'true' : undefined}\n          onClick={this.handleClick}\n          onKeyDown={this.handleKeydown}\n        >\n          <span class=\"menu-item__prefix\" part=\"prefix\">\n            <slot name=\"prefix\" />\n          </span>\n\n          <span class=\"menu-item__label\" part=\"label\">\n            <slot />\n          </span>\n\n          <span class=\"menu-item__suffix\" part=\"suffix\">\n            <slot name=\"suffix\" />\n          </span>\n        </Tag>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/menu/menu-item.stories.js

@@ -1,4 +0,0 @@
-// Stories for ts-menu-item are in the parent component's stories file
-// This file exists only to prevent auto-generation
-export default { title: 'Internal/menu-item', tags: ['!autodocs'] };
-//# sourceMappingURL=menu-item.stories.js.map

package/dist/collection/components/menu/menu-item.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"menu-item.stories.js","sourceRoot":"","sources":["../../../src/components/menu/menu-item.stories.ts"],"names":[],"mappings":"AAAA,sEAAsE;AACtE,mDAAmD;AAEnD,eAAe,EAAE,KAAK,EAAE,oBAAoB,EAAE,IAAI,EAAE,CAAC,WAAW,CAAC,EAAE,CAAC","sourcesContent":["// Stories for ts-menu-item are in the parent component's stories file\n// This file exists only to prevent auto-generation\n\nexport default { title: 'Internal/menu-item', tags: ['!autodocs'] };\n"]}

package/dist/collection/components/menu/menu.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"menu.js","sourceRoot":"","sources":["../../../src/components/menu/menu.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, State, Event, h, Host, Element, Watch, Listen } from '@stencil/core';\nimport type { EventEmitter } from '@stencil/core';\nimport { generateId } from '../../utils/aria';\n\nexport type TsMenuPlacement = 'bottom-start' | 'bottom-end' | 'top-start' | 'top-end';\n\nexport type TsMenuTrigger = 'click' | 'hover';\n\n/**\n * @slot trigger - The element that opens the menu (e.g., a button).\n * @slot - Default slot for ts-menu-item children.\n *\n * @part panel - The dropdown panel container.\n */\n@Component({\n  tag: 'ts-menu',\n  styleUrl: 'menu.css',\n  shadow: true,\n})\nexport class TsMenu {\n  @Element() hostEl!: HTMLElement;\n\n  private menuId = generateId('ts-menu');\n  private triggerEl?: HTMLElement;\n\n  /** Whether the menu dropdown is open. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  /** How the menu is triggered. */\n  @Prop({ reflect: true }) trigger: TsMenuTrigger = 'click';\n\n  /** Placement of the dropdown relative to the trigger. */\n  @Prop({ reflect: true }) placement: TsMenuPlacement = 'bottom-start';\n\n  /** Emitted when the menu opens. */\n  @Event({ eventName: 'tsOpen' }) tsOpen!: EventEmitter<void>;\n\n  /** Emitted when the menu closes. */\n  @Event({ eventName: 'tsClose' }) tsClose!: EventEmitter<void>;\n\n  /** Tracks the currently focused item index for keyboard navigation. */\n  @State() focusedIndex = -1;\n\n  @Watch('open')\n  handleOpenChange(isOpen: boolean): void {\n    if (isOpen) {\n      this.tsOpen.emit();\n      requestAnimationFrame(() => {\n        this.focusFirstItem();\n      });\n    } else {\n      this.focusedIndex = -1;\n      this.tsClose.emit();\n    }\n  }\n\n  @Listen('click', { target: 'document' })\n  handleDocumentClick(event: MouseEvent): void {\n    if (this.open && !this.hostEl.contains(event.target as Node)) {\n      this.open = false;\n    }\n  }\n\n  @Listen('tsSelect')\n  handleItemSelect(): void {\n    this.open = false;\n    this.triggerEl?.focus();\n  }\n\n  @Listen('keydown')\n  handleKeydown(event: KeyboardEvent): void {\n    if (!this.open) return;\n\n    const items = this.getMenuItems();\n    if (items.length === 0) return;\n\n    switch (event.key) {\n      case 'ArrowDown': {\n        event.preventDefault();\n        this.focusedIndex = (this.focusedIndex + 1) % items.length;\n        this.focusItem(items[this.focusedIndex]);\n        break;\n      }\n      case 'ArrowUp': {\n        event.preventDefault();\n        this.focusedIndex = this.focusedIndex <= 0 ? items.length - 1 : this.focusedIndex - 1;\n        this.focusItem(items[this.focusedIndex]);\n        break;\n      }\n      case 'Home': {\n        event.preventDefault();\n        this.focusedIndex = 0;\n        this.focusItem(items[0]);\n        break;\n      }\n      case 'End': {\n        event.preventDefault();\n        this.focusedIndex = items.length - 1;\n        this.focusItem(items[this.focusedIndex]);\n        break;\n      }\n      case 'Escape': {\n        event.preventDefault();\n        this.open = false;\n        this.triggerEl?.focus();\n        break;\n      }\n      case 'Tab': {\n        this.open = false;\n        break;\n      }\n    }\n  }\n\n  private getMenuItems(): HTMLElement[] {\n    return Array.from(this.hostEl.querySelectorAll<HTMLElement>('ts-menu-item:not([disabled])'));\n  }\n\n  private focusItem(el: HTMLElement): void {\n    const item = el as HTMLElement & { setFocus?: () => Promise<void> };\n    if (typeof item.setFocus === 'function') {\n      item.setFocus();\n    } else {\n      el.focus();\n    }\n  }\n\n  private focusFirstItem(): void {\n    const items = this.getMenuItems();\n    if (items.length > 0) {\n      this.focusedIndex = 0;\n      this.focusItem(items[0]);\n    }\n  }\n\n  private handleTriggerClick = (): void => {\n    if (this.trigger === 'click') {\n      this.open = !this.open;\n    }\n  };\n\n  private handleTriggerKeydown = (event: KeyboardEvent): void => {\n    if (event.key === 'ArrowDown' || event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n      this.open = true;\n    }\n  };\n\n  private handleMouseEnter = (): void => {\n    if (this.trigger === 'hover') {\n      this.open = true;\n    }\n  };\n\n  private handleMouseLeave = (): void => {\n    if (this.trigger === 'hover') {\n      this.open = false;\n    }\n  };\n\n  // eslint-disable-next-line @typescript-eslint/explicit-function-return-type\n  render() {\n    return (\n      <Host\n        class={{\n          'ts-menu': true,\n          'ts-menu--open': this.open,\n        }}\n        onMouseEnter={this.handleMouseEnter}\n        onMouseLeave={this.handleMouseLeave}\n      >\n        <div\n          class=\"menu__trigger\"\n          ref={(el) => (this.triggerEl = el)}\n          onClick={this.handleTriggerClick}\n          onKeyDown={this.handleTriggerKeydown}\n          aria-haspopup=\"true\"\n          aria-expanded={this.open ? 'true' : 'false'}\n          aria-controls={this.menuId}\n        >\n          <slot name=\"trigger\" />\n        </div>\n\n        <div\n          class={{\n            'menu__panel': true,\n            'menu__panel--open': this.open,\n            [`menu__panel--${this.placement}`]: true,\n          }}\n          part=\"panel\"\n          id={this.menuId}\n          role=\"menu\"\n          aria-hidden={!this.open ? 'true' : undefined}\n        >\n          <slot />\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/menu/menu.stories.js

@@ -1,126 +0,0 @@
-// Hand-written stories for ts-menu
-export default {
-    title: 'Components/Menu',
-    tags: ['autodocs'],
-    argTypes: {
-        open: { control: 'boolean', description: 'Whether the menu dropdown is open.' },
-        trigger: {
-            control: 'select',
-            options: ['click', 'hover'],
-            description: 'How the menu is triggered.',
-        },
-        placement: {
-            control: 'select',
-            options: ['bottom-start', 'bottom-end', 'top-start', 'top-end'],
-            description: 'Placement of the dropdown relative to the trigger.',
-        },
-    },
-};
-const Template = (args) => {
-    const attrs = [];
-    if (args.open)
-        attrs.push('open');
-    if (args.trigger !== undefined && args.trigger !== null)
-        attrs.push(`trigger="${args.trigger}"`);
-    if (args.placement !== undefined && args.placement !== null)
-        attrs.push(`placement="${args.placement}"`);
-    return `
-    <ts-menu ${attrs.join(' ')}>
-      <ts-button slot="trigger">Actions</ts-button>
-      <ts-menu-item value="edit">Edit</ts-menu-item>
-      <ts-menu-item value="duplicate">Duplicate</ts-menu-item>
-      <ts-menu-item value="archive">Archive</ts-menu-item>
-      <ts-menu-item value="delete">Delete</ts-menu-item>
-    </ts-menu>
-  `;
-};
-export const Default = Object.assign(Template.bind({}), {
-    args: {
-        open: false,
-        trigger: 'click',
-        placement: 'bottom-start',
-    },
-});
-export const Placements = () => `
-  <div style="display: flex; gap: 24px; flex-wrap: wrap; padding: 80px 20px;">
-    <ts-menu placement="bottom-start">
-      <ts-button slot="trigger">Bottom Start</ts-button>
-      <ts-menu-item value="one">Option One</ts-menu-item>
-      <ts-menu-item value="two">Option Two</ts-menu-item>
-      <ts-menu-item value="three">Option Three</ts-menu-item>
-    </ts-menu>
-    <ts-menu placement="bottom-end">
-      <ts-button slot="trigger">Bottom End</ts-button>
-      <ts-menu-item value="one">Option One</ts-menu-item>
-      <ts-menu-item value="two">Option Two</ts-menu-item>
-      <ts-menu-item value="three">Option Three</ts-menu-item>
-    </ts-menu>
-    <ts-menu placement="top-start">
-      <ts-button slot="trigger">Top Start</ts-button>
-      <ts-menu-item value="one">Option One</ts-menu-item>
-      <ts-menu-item value="two">Option Two</ts-menu-item>
-      <ts-menu-item value="three">Option Three</ts-menu-item>
-    </ts-menu>
-    <ts-menu placement="top-end">
-      <ts-button slot="trigger">Top End</ts-button>
-      <ts-menu-item value="one">Option One</ts-menu-item>
-      <ts-menu-item value="two">Option Two</ts-menu-item>
-      <ts-menu-item value="three">Option Three</ts-menu-item>
-    </ts-menu>
-  </div>
-`;
-export const WithDisabledItems = () => `
-  <ts-menu>
-    <ts-button slot="trigger">File Actions</ts-button>
-    <ts-menu-item value="edit">Edit</ts-menu-item>
-    <ts-menu-item value="duplicate">Duplicate</ts-menu-item>
-    <ts-menu-item value="move" disabled>Move (no permission)</ts-menu-item>
-    <ts-menu-item value="archive">Archive</ts-menu-item>
-    <ts-menu-item value="delete" disabled>Delete (locked)</ts-menu-item>
-  </ts-menu>
-`;
-export const HoverTrigger = () => `
-  <ts-menu trigger="hover">
-    <ts-button slot="trigger">Hover Me</ts-button>
-    <ts-menu-item value="profile">Profile</ts-menu-item>
-    <ts-menu-item value="settings">Settings</ts-menu-item>
-    <ts-menu-item value="help">Help Center</ts-menu-item>
-    <ts-menu-item value="logout">Log Out</ts-menu-item>
-  </ts-menu>
-`;
-export const WithLinks = () => `
-  <ts-menu>
-    <ts-button slot="trigger">Navigate</ts-button>
-    <ts-menu-item value="docs" href="https://example.com/docs">Documentation</ts-menu-item>
-    <ts-menu-item value="api" href="https://example.com/api">API Reference</ts-menu-item>
-    <ts-menu-item value="changelog" href="https://example.com/changelog">Changelog</ts-menu-item>
-    <ts-menu-item value="support" href="https://example.com/support">Support</ts-menu-item>
-  </ts-menu>
-`;
-export const ContextMenu = () => `
-  <div style="display: flex; gap: 16px;">
-    <ts-menu placement="bottom-end">
-      <ts-button slot="trigger" appearance="ghost" size="sm">...</ts-button>
-      <ts-menu-item value="edit">Edit</ts-menu-item>
-      <ts-menu-item value="duplicate">Duplicate</ts-menu-item>
-      <ts-menu-item value="archive">Archive</ts-menu-item>
-      <ts-menu-item value="delete">Delete</ts-menu-item>
-    </ts-menu>
-  </div>
-`;
-export const UserMenu = () => `
-  <ts-menu placement="bottom-end">
-    <ts-button slot="trigger" appearance="ghost">
-      <div style="display: flex; align-items: center; gap: 8px;">
-        <ts-avatar name="James Kennedy" color="#6366f1" size="xs"></ts-avatar>
-        <span>James Kennedy</span>
-      </div>
-    </ts-button>
-    <ts-menu-item value="profile">My Profile</ts-menu-item>
-    <ts-menu-item value="settings">Account Settings</ts-menu-item>
-    <ts-menu-item value="billing">Billing</ts-menu-item>
-    <ts-menu-item value="team">Team Management</ts-menu-item>
-    <ts-menu-item value="logout">Sign Out</ts-menu-item>
-  </ts-menu>
-`;
-//# sourceMappingURL=menu.stories.js.map

package/dist/collection/components/menu/menu.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"menu.stories.js","sourceRoot":"","sources":["../../../src/components/menu/menu.stories.ts"],"names":[],"mappings":"AAAA,mCAAmC;AAEnC,eAAe;IACb,KAAK,EAAE,iBAAiB;IACxB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACR,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,oCAAoC,EAAE;QAC/E,OAAO,EAAE;YACP,OAAO,EAAE,QAAQ;YACjB,OAAO,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC;YAC3B,WAAW,EAAE,4BAA4B;SAC1C;QACD,SAAS,EAAE;YACT,OAAO,EAAE,QAAQ;YACjB,OAAO,EAAE,CAAC,cAAc,EAAE,YAAY,EAAE,WAAW,EAAE,SAAS,CAAC;YAC/D,WAAW,EAAE,oDAAoD;SAClE;KACF;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,IAA6B,EAAU,EAAE;IACzD,MAAM,KAAK,GAAa,EAAE,CAAC;IAC3B,IAAI,IAAI,CAAC,IAAI;QAAE,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAClC,IAAI,IAAI,CAAC,OAAO,KAAK,SAAS,IAAI,IAAI,CAAC,OAAO,KAAK,IAAI;QAAE,KAAK,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC;IACjG,IAAI,IAAI,CAAC,SAAS,KAAK,SAAS,IAAI,IAAI,CAAC,SAAS,KAAK,IAAI;QAAE,KAAK,CAAC,IAAI,CAAC,cAAc,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC;IACzG,OAAO;eACM,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC;;;;;;;GAO3B,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAwD,EAAE;IAC7G,IAAI,EAAE;QACJ,IAAI,EAAE,KAAK;QACX,OAAO,EAAE,OAAO;QAChB,SAAS,EAAE,cAAc;KAC1B;CACF,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,UAAU,GAAG,GAAW,EAAE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2BvC,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAW,EAAE,CAAC;;;;;;;;;CAS9C,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,GAAW,EAAE,CAAC;;;;;;;;CAQzC,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,GAAW,EAAE,CAAC;;;;;;;;CAQtC,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,GAAW,EAAE,CAAC;;;;;;;;;;CAUxC,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAW,EAAE,CAAC;;;;;;;;;;;;;;CAcrC,CAAC","sourcesContent":["// Hand-written stories for ts-menu\n\nexport default {\n  title: 'Components/Menu',\n  tags: ['autodocs'],\n  argTypes: {\n    open: { control: 'boolean', description: 'Whether the menu dropdown is open.' },\n    trigger: {\n      control: 'select',\n      options: ['click', 'hover'],\n      description: 'How the menu is triggered.',\n    },\n    placement: {\n      control: 'select',\n      options: ['bottom-start', 'bottom-end', 'top-start', 'top-end'],\n      description: 'Placement of the dropdown relative to the trigger.',\n    },\n  },\n};\n\nconst Template = (args: Record<string, unknown>): string => {\n  const attrs: string[] = [];\n  if (args.open) attrs.push('open');\n  if (args.trigger !== undefined && args.trigger !== null) attrs.push(`trigger=\"${args.trigger}\"`);\n  if (args.placement !== undefined && args.placement !== null) attrs.push(`placement=\"${args.placement}\"`);\n  return `\n    <ts-menu ${attrs.join(' ')}>\n      <ts-button slot=\"trigger\">Actions</ts-button>\n      <ts-menu-item value=\"edit\">Edit</ts-menu-item>\n      <ts-menu-item value=\"duplicate\">Duplicate</ts-menu-item>\n      <ts-menu-item value=\"archive\">Archive</ts-menu-item>\n      <ts-menu-item value=\"delete\">Delete</ts-menu-item>\n    </ts-menu>\n  `;\n};\n\nexport const Default = Object.assign(Template.bind({}) as typeof Template & { args: Record<string, unknown> }, {\n  args: {\n    open: false,\n    trigger: 'click',\n    placement: 'bottom-start',\n  },\n});\n\nexport const Placements = (): string => `\n  <div style=\"display: flex; gap: 24px; flex-wrap: wrap; padding: 80px 20px;\">\n    <ts-menu placement=\"bottom-start\">\n      <ts-button slot=\"trigger\">Bottom Start</ts-button>\n      <ts-menu-item value=\"one\">Option One</ts-menu-item>\n      <ts-menu-item value=\"two\">Option Two</ts-menu-item>\n      <ts-menu-item value=\"three\">Option Three</ts-menu-item>\n    </ts-menu>\n    <ts-menu placement=\"bottom-end\">\n      <ts-button slot=\"trigger\">Bottom End</ts-button>\n      <ts-menu-item value=\"one\">Option One</ts-menu-item>\n      <ts-menu-item value=\"two\">Option Two</ts-menu-item>\n      <ts-menu-item value=\"three\">Option Three</ts-menu-item>\n    </ts-menu>\n    <ts-menu placement=\"top-start\">\n      <ts-button slot=\"trigger\">Top Start</ts-button>\n      <ts-menu-item value=\"one\">Option One</ts-menu-item>\n      <ts-menu-item value=\"two\">Option Two</ts-menu-item>\n      <ts-menu-item value=\"three\">Option Three</ts-menu-item>\n    </ts-menu>\n    <ts-menu placement=\"top-end\">\n      <ts-button slot=\"trigger\">Top End</ts-button>\n      <ts-menu-item value=\"one\">Option One</ts-menu-item>\n      <ts-menu-item value=\"two\">Option Two</ts-menu-item>\n      <ts-menu-item value=\"three\">Option Three</ts-menu-item>\n    </ts-menu>\n  </div>\n`;\n\nexport const WithDisabledItems = (): string => `\n  <ts-menu>\n    <ts-button slot=\"trigger\">File Actions</ts-button>\n    <ts-menu-item value=\"edit\">Edit</ts-menu-item>\n    <ts-menu-item value=\"duplicate\">Duplicate</ts-menu-item>\n    <ts-menu-item value=\"move\" disabled>Move (no permission)</ts-menu-item>\n    <ts-menu-item value=\"archive\">Archive</ts-menu-item>\n    <ts-menu-item value=\"delete\" disabled>Delete (locked)</ts-menu-item>\n  </ts-menu>\n`;\n\nexport const HoverTrigger = (): string => `\n  <ts-menu trigger=\"hover\">\n    <ts-button slot=\"trigger\">Hover Me</ts-button>\n    <ts-menu-item value=\"profile\">Profile</ts-menu-item>\n    <ts-menu-item value=\"settings\">Settings</ts-menu-item>\n    <ts-menu-item value=\"help\">Help Center</ts-menu-item>\n    <ts-menu-item value=\"logout\">Log Out</ts-menu-item>\n  </ts-menu>\n`;\n\nexport const WithLinks = (): string => `\n  <ts-menu>\n    <ts-button slot=\"trigger\">Navigate</ts-button>\n    <ts-menu-item value=\"docs\" href=\"https://example.com/docs\">Documentation</ts-menu-item>\n    <ts-menu-item value=\"api\" href=\"https://example.com/api\">API Reference</ts-menu-item>\n    <ts-menu-item value=\"changelog\" href=\"https://example.com/changelog\">Changelog</ts-menu-item>\n    <ts-menu-item value=\"support\" href=\"https://example.com/support\">Support</ts-menu-item>\n  </ts-menu>\n`;\n\nexport const ContextMenu = (): string => `\n  <div style=\"display: flex; gap: 16px;\">\n    <ts-menu placement=\"bottom-end\">\n      <ts-button slot=\"trigger\" appearance=\"ghost\" size=\"sm\">...</ts-button>\n      <ts-menu-item value=\"edit\">Edit</ts-menu-item>\n      <ts-menu-item value=\"duplicate\">Duplicate</ts-menu-item>\n      <ts-menu-item value=\"archive\">Archive</ts-menu-item>\n      <ts-menu-item value=\"delete\">Delete</ts-menu-item>\n    </ts-menu>\n  </div>\n`;\n\nexport const UserMenu = (): string => `\n  <ts-menu placement=\"bottom-end\">\n    <ts-button slot=\"trigger\" appearance=\"ghost\">\n      <div style=\"display: flex; align-items: center; gap: 8px;\">\n        <ts-avatar name=\"James Kennedy\" color=\"#6366f1\" size=\"xs\"></ts-avatar>\n        <span>James Kennedy</span>\n      </div>\n    </ts-button>\n    <ts-menu-item value=\"profile\">My Profile</ts-menu-item>\n    <ts-menu-item value=\"settings\">Account Settings</ts-menu-item>\n    <ts-menu-item value=\"billing\">Billing</ts-menu-item>\n    <ts-menu-item value=\"team\">Team Management</ts-menu-item>\n    <ts-menu-item value=\"logout\">Sign Out</ts-menu-item>\n  </ts-menu>\n`;\n"]}

package/dist/collection/components/modal/modal.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"modal.js","sourceRoot":"","sources":["../../../src/components/modal/modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Prop,\n  State,\n  Event,\n  h,\n  Host,\n  Element,\n  Method,\n  Watch,\n} from '@stencil/core';\nimport type { EventEmitter } from '@stencil/core';\nimport type { TsSize } from '../../types';\nimport { generateId, trapFocus } from '../../utils/aria';\n\n/**\n * @slot - Default slot for modal body content.\n * @slot header - Modal header content.\n * @slot footer - Modal footer content (e.g., action buttons).\n *\n * @part overlay - The backdrop overlay.\n * @part dialog - The dialog container.\n * @part header - The header wrapper.\n * @part body - The body wrapper.\n * @part footer - The footer wrapper.\n * @part close - The close button.\n */\n@Component({\n  tag: 'ts-modal',\n  styleUrl: 'modal.css',\n  shadow: true,\n})\nexport class TsModal {\n  @Element() hostEl!: HTMLElement;\n\n  private dialogEl?: HTMLElement;\n  private removeFocusTrap?: () => void;\n  private previouslyFocused?: HTMLElement;\n  private modalId = generateId('ts-modal');\n\n  /** Whether the modal is open. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  /** The modal's width size preset. */\n  @Prop({ reflect: true }) size: TsSize = 'md';\n\n  /** Label for accessibility (used as aria-label). */\n  @Prop() label?: string;\n\n  /** Whether clicking the overlay closes the modal. */\n  @Prop() closeOnOverlay = true;\n\n  /** Whether pressing Escape closes the modal. */\n  @Prop() closeOnEscape = true;\n\n  /** Whether to show the close button. */\n  @Prop() showClose = true;\n\n  /** Emitted when the modal opens. */\n  @Event({ eventName: 'tsOpen' }) tsOpen!: EventEmitter<void>;\n\n  /** Emitted when the modal closes. */\n  @Event({ eventName: 'tsClose' }) tsClose!: EventEmitter<void>;\n\n  /** Internal animation state. */\n  @State() isAnimating = false;\n\n  @Watch('open')\n  handleOpenChange(isOpen: boolean): void {\n    if (isOpen) {\n      this.openModal();\n    } else {\n      this.closeModal();\n    }\n  }\n\n  /** Programmatically open the modal. */\n  @Method()\n  async show(): Promise<void> {\n    this.open = true;\n  }\n\n  /** Programmatically close the modal. */\n  @Method()\n  async close(): Promise<void> {\n    this.open = false;\n  }\n\n  private openModal(): void {\n    this.previouslyFocused = document.activeElement as HTMLElement;\n    this.isAnimating = true;\n    this.tsOpen.emit();\n\n    // Prevent body scroll\n    document.body.style.overflow = 'hidden';\n\n    requestAnimationFrame(() => {\n      if (this.dialogEl) {\n        this.removeFocusTrap = trapFocus(this.dialogEl);\n        // Focus the dialog itself\n        this.dialogEl.focus();\n      }\n    });\n  }\n\n  private closeModal(): void {\n    this.isAnimating = false;\n    this.tsClose.emit();\n\n    // Restore body scroll\n    document.body.style.overflow = '';\n\n    // Clean up focus trap\n    this.removeFocusTrap?.();\n\n    // Restore focus\n    this.previouslyFocused?.focus();\n  }\n\n  disconnectedCallback(): void {\n    this.removeFocusTrap?.();\n    document.body.style.overflow = '';\n  }\n\n  private handleOverlayClick = (): void => {\n    if (this.closeOnOverlay) {\n      this.close();\n    }\n  };\n\n  private handleDialogClick = (event: MouseEvent): void => {\n    // Prevent overlay click from firing when clicking inside the dialog\n    event.stopPropagation();\n  };\n\n  private handleKeydown = (event: KeyboardEvent): void => {\n    if (event.key === 'Escape' && this.closeOnEscape) {\n      event.stopPropagation();\n      this.close();\n    }\n  };\n\n  private handleCloseClick = (): void => {\n    this.close();\n  };\n\n  // eslint-disable-next-line @typescript-eslint/explicit-function-return-type\n  render() {\n    if (!this.open) return null;\n\n    return (\n      <Host\n        class={{\n          'ts-modal': true,\n          'ts-modal--open': this.open,\n        }}\n        onKeyDown={this.handleKeydown}\n      >\n        <div class=\"modal__overlay\" part=\"overlay\" onClick={this.handleOverlayClick}>\n          <div\n            ref={(el) => (this.dialogEl = el)}\n            class={{\n              'modal__dialog': true,\n              [`modal__dialog--${this.size}`]: true,\n            }}\n            part=\"dialog\"\n            role=\"dialog\"\n            aria-modal=\"true\"\n            aria-label={this.label}\n            aria-labelledby={!this.label ? `${this.modalId}-header` : undefined}\n            tabindex={-1}\n            onClick={this.handleDialogClick}\n          >\n            {this.showClose && (\n              <button\n                class=\"modal__close\"\n                part=\"close\"\n                type=\"button\"\n                aria-label=\"Close modal\"\n                onClick={this.handleCloseClick}\n              >\n                ✕\n              </button>\n            )}\n\n            <div class=\"modal__header\" part=\"header\" id={`${this.modalId}-header`}>\n              <slot name=\"header\" />\n            </div>\n\n            <div class=\"modal__body\" part=\"body\">\n              <slot />\n            </div>\n\n            <div class=\"modal__footer\" part=\"footer\">\n              <slot name=\"footer\" />\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}