@seed-ship/mcp-ui-solid 6.19.1 → 6.20.0

package/dist/components/AutocompleteDropdown.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteDropdown.cjs","sources":["../../src/components/AutocompleteDropdown.tsx"],"sourcesContent":["/**\n * AutocompleteDropdown Component\n * Displays data-driven dropdown suggestions\n *\n * Sprint Autocomplete Feature\n */\n\nimport { Component, For, Show, createMemo, JSX } from 'solid-js'\nimport type { AutocompleteOption } from '../types'\n\n/**\n * Props for AutocompleteDropdown\n */\nexport interface AutocompleteDropdownProps {\n  /**\n   * Options to display\n   */\n  options: AutocompleteOption[]\n\n  /**\n   * Currently selected index\n   */\n  selectedIndex: number\n\n  /**\n   * Whether dropdown is visible\n   */\n  isOpen: boolean\n\n  /**\n   * Callback when option is selected\n   */\n  onSelect: (option: AutocompleteOption) => void\n\n  /**\n   * Callback when option is hovered\n   */\n  onHover?: (index: number) => void\n\n  /**\n   * Whether loading\n   */\n  isLoading?: boolean\n\n  /**\n   * Custom class\n   */\n  class?: string\n\n  /**\n   * Max height\n   */\n  maxHeight?: string\n\n  /**\n   * Empty state message\n   */\n  emptyMessage?: string\n\n  /**\n   * Loading message\n   */\n  loadingMessage?: string\n\n  /**\n   * Highlight matching text in options\n   */\n  highlightMatch?: string\n\n  /**\n   * Position (default: 'bottom')\n   */\n  position?: 'top' | 'bottom'\n\n  /**\n   * Custom option renderer\n   */\n  renderOption?: (option: AutocompleteOption, isSelected: boolean) => JSX.Element\n}\n\n/**\n * Highlight matching text\n */\nfunction highlightText(text: string, match?: string): JSX.Element {\n  if (!match || !text) {\n    return <>{text}</>\n  }\n\n  const lowerText = text.toLowerCase()\n  const lowerMatch = match.toLowerCase()\n  const startIndex = lowerText.indexOf(lowerMatch)\n\n  if (startIndex === -1) {\n    return <>{text}</>\n  }\n\n  const before = text.slice(0, startIndex)\n  const matched = text.slice(startIndex, startIndex + match.length)\n  const after = text.slice(startIndex + match.length)\n\n  return (\n    <>\n      {before}\n      <strong class=\"mcp-autocomplete-highlight\">{matched}</strong>\n      {after}\n    </>\n  )\n}\n\n/**\n * Default option renderer\n */\nconst DefaultOptionRenderer: Component<{\n  option: AutocompleteOption\n  isSelected: boolean\n  highlightMatch?: string\n}> = (props) => {\n  const displayLabel = createMemo(() =>\n    props.option.label || props.option.value\n  )\n\n  return (\n    <div class=\"mcp-autocomplete-option-content\">\n      <Show when={props.option.icon}>\n        <span class=\"mcp-autocomplete-option-icon\">{props.option.icon}</span>\n      </Show>\n      <div class=\"mcp-autocomplete-option-text\">\n        <span class=\"mcp-autocomplete-option-label\">\n          {highlightText(displayLabel(), props.highlightMatch)}\n        </span>\n        <Show when={props.option.description}>\n          <span class=\"mcp-autocomplete-option-description\">\n            {props.option.description}\n          </span>\n        </Show>\n      </div>\n    </div>\n  )\n}\n\n/**\n * AutocompleteDropdown Component\n */\nexport const AutocompleteDropdown: Component<AutocompleteDropdownProps> = (props) => {\n  const positionStyles = createMemo((): JSX.CSSProperties => {\n    if (props.position === 'top') {\n      return {\n        bottom: '100%',\n        'margin-bottom': '4px'\n      }\n    }\n    return {\n      top: '100%',\n      'margin-top': '4px'\n    }\n  })\n\n  const containerStyles = createMemo((): JSX.CSSProperties => ({\n    position: 'absolute',\n    left: '0',\n    right: '0',\n    'z-index': '50',\n    'background-color': '#ffffff',\n    border: '1px solid #e5e7eb',\n    'border-radius': '6px',\n    'box-shadow': '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',\n    'max-height': props.maxHeight || '240px',\n    overflow: 'auto',\n    ...positionStyles()\n  }))\n\n  return (\n    <Show when={props.isOpen}>\n      <div\n        class={`mcp-autocomplete-dropdown ${props.class || ''}`}\n        style={containerStyles()}\n        role=\"listbox\"\n        aria-label=\"Suggestions\"\n      >\n        {/* Loading state */}\n        <Show when={props.isLoading}>\n          <div\n            class=\"mcp-autocomplete-loading\"\n            style={{\n              padding: '12px 16px',\n              color: '#6b7280',\n              'font-size': '0.875rem',\n              display: 'flex',\n              'align-items': 'center',\n              gap: '8px'\n            }}\n          >\n            <span\n              style={{\n                display: 'inline-block',\n                width: '14px',\n                height: '14px',\n                border: '2px solid #e5e7eb',\n                'border-top-color': '#3b82f6',\n                'border-radius': '50%',\n                animation: 'mcp-spin 0.6s linear infinite'\n              }}\n            />\n            {props.loadingMessage || 'Loading...'}\n          </div>\n        </Show>\n\n        {/* Empty state */}\n        <Show when={!props.isLoading && props.options.length === 0}>\n          <div\n            class=\"mcp-autocomplete-empty\"\n            style={{\n              padding: '12px 16px',\n              color: '#9ca3af',\n              'font-size': '0.875rem',\n              'text-align': 'center'\n            }}\n          >\n            {props.emptyMessage || 'No suggestions found'}\n          </div>\n        </Show>\n\n        {/* Options list */}\n        <Show when={!props.isLoading && props.options.length > 0}>\n          <ul\n            class=\"mcp-autocomplete-options\"\n            style={{ margin: '0', padding: '4px 0', 'list-style': 'none' }}\n          >\n            <For each={props.options}>\n              {(option, index) => {\n                const isSelected = () => index() === props.selectedIndex\n                const isDisabled = () => option.disabled\n\n                return (\n                  <li\n                    role=\"option\"\n                    aria-selected={isSelected()}\n                    aria-disabled={isDisabled()}\n                    class={`mcp-autocomplete-option ${isSelected() ? 'mcp-autocomplete-option-selected' : ''} ${isDisabled() ? 'mcp-autocomplete-option-disabled' : ''}`}\n                    style={{\n                      padding: '8px 16px',\n                      cursor: isDisabled() ? 'not-allowed' : 'pointer',\n                      'background-color': isSelected() ? '#eff6ff' : 'transparent',\n                      color: isDisabled() ? '#9ca3af' : '#374151',\n                      'font-size': '0.875rem',\n                      transition: 'background-color 150ms ease'\n                    }}\n                    onClick={() => {\n                      if (!isDisabled()) {\n                        props.onSelect(option)\n                      }\n                    }}\n                    onMouseEnter={() => {\n                      if (!isDisabled()) {\n                        props.onHover?.(index())\n                      }\n                    }}\n                  >\n                    <Show\n                      when={props.renderOption}\n                      fallback={\n                        <DefaultOptionRenderer\n                          option={option}\n                          isSelected={isSelected()}\n                          highlightMatch={props.highlightMatch}\n                        />\n                      }\n                    >\n                      {props.renderOption!(option, isSelected())}\n                    </Show>\n                  </li>\n                )\n              }}\n            </For>\n          </ul>\n        </Show>\n\n        {/* Footer hint */}\n        <Show when={!props.isLoading && props.options.length > 0}>\n          <div\n            class=\"mcp-autocomplete-footer\"\n            style={{\n              padding: '6px 12px',\n              'border-top': '1px solid #e5e7eb',\n              'background-color': '#f9fafb',\n              'font-size': '0.75rem',\n              color: '#6b7280'\n            }}\n          >\n            <kbd style={{\n              'background-color': '#e5e7eb',\n              padding: '1px 4px',\n              'border-radius': '2px',\n              'font-family': 'inherit',\n              'font-size': '0.7rem'\n            }}>↑</kbd>\n            {' '}\n            <kbd style={{\n              'background-color': '#e5e7eb',\n              padding: '1px 4px',\n              'border-radius': '2px',\n              'font-family': 'inherit',\n              'font-size': '0.7rem'\n            }}>↓</kbd>\n            {' to navigate, '}\n            <kbd style={{\n              'background-color': '#e5e7eb',\n              padding: '1px 4px',\n              'border-radius': '2px',\n              'font-family': 'inherit',\n              'font-size': '0.7rem'\n            }}>Enter</kbd>\n            {' to select, '}\n            <kbd style={{\n              'background-color': '#e5e7eb',\n              padding: '1px 4px',\n              'border-radius': '2px',\n              'font-family': 'inherit',\n              'font-size': '0.7rem'\n            }}>Esc</kbd>\n            {' to dismiss'}\n          </div>\n        </Show>\n      </div>\n    </Show>\n  )\n}\n\nexport default AutocompleteDropdown\n"],"names":["highlightText","text","match","lowerText","toLowerCase","lowerMatch","startIndex","indexOf","before","slice","matched","length","after","_el$","_$getNextElement","_tmpl$","_$insert","DefaultOptionRenderer","props","displayLabel","createMemo","option","label","value","_el$2","_tmpl$4","_el$9","firstChild","_el$0","_co$2","_$getNextMarker","nextSibling","_el$4","_el$5","_el$7","_el$8","_co$","_$createComponent","Show","when","icon","children","_el$3","_tmpl$2","highlightMatch","description","_el$6","_tmpl$3","AutocompleteDropdown","positionStyles","position","bottom","top","containerStyles","left","right","border","maxHeight","overflow","isOpen","_el$1","_tmpl$9","_el$24","_el$25","_co$4","_el$26","_el$27","_co$5","_el$28","_el$29","_co$6","_el$30","_el$31","_co$7","isLoading","_el$10","_tmpl$5","_el$11","_el$12","_el$13","_co$3","loadingMessage","_$memo","options","_el$14","_tmpl$6","emptyMessage","_el$15","_tmpl$7","For","each","index","isSelected","selectedIndex","isDisabled","disabled","_el$32","_tmpl$0","addEventListener","onHover","$$click","onSelect","renderOption","fallback","_$effect","_p$","_v$3","_v$4","_v$5","_v$6","_v$7","_v$8","e","_$setAttribute","t","a","_$className","o","_$setStyleProperty","i","n","undefined","_$runHydrationEvents","_el$16","_tmpl$8","_el$17","_el$18","_el$19","_el$20","_el$21","_el$22","_v$","class","_v$2","_$style","_$delegateEvents"],"mappings":"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"}
+{"version":3,"file":"AutocompleteDropdown.cjs","sources":["../../src/components/AutocompleteDropdown.tsx"],"sourcesContent":["/**\n * AutocompleteDropdown Component\n * Displays data-driven dropdown suggestions\n *\n * Sprint Autocomplete Feature\n */\n\nimport { Component, For, Show, createMemo, JSX } from 'solid-js'\nimport type { AutocompleteOption } from '../types'\nimport { useMCPUIStrings } from '../context/MCPUIStringsContext'\n\n/**\n * Props for AutocompleteDropdown\n */\nexport interface AutocompleteDropdownProps {\n  /**\n   * Options to display\n   */\n  options: AutocompleteOption[]\n\n  /**\n   * Currently selected index\n   */\n  selectedIndex: number\n\n  /**\n   * Whether dropdown is visible\n   */\n  isOpen: boolean\n\n  /**\n   * Callback when option is selected\n   */\n  onSelect: (option: AutocompleteOption) => void\n\n  /**\n   * Callback when option is hovered\n   */\n  onHover?: (index: number) => void\n\n  /**\n   * Whether loading\n   */\n  isLoading?: boolean\n\n  /**\n   * Custom class\n   */\n  class?: string\n\n  /**\n   * Max height\n   */\n  maxHeight?: string\n\n  /**\n   * Empty state message\n   */\n  emptyMessage?: string\n\n  /**\n   * Loading message\n   */\n  loadingMessage?: string\n\n  /**\n   * Highlight matching text in options\n   */\n  highlightMatch?: string\n\n  /**\n   * Position (default: 'bottom')\n   */\n  position?: 'top' | 'bottom'\n\n  /**\n   * Custom option renderer\n   */\n  renderOption?: (option: AutocompleteOption, isSelected: boolean) => JSX.Element\n}\n\n/**\n * Highlight matching text\n */\nfunction highlightText(text: string, match?: string): JSX.Element {\n  if (!match || !text) {\n    return <>{text}</>\n  }\n\n  const lowerText = text.toLowerCase()\n  const lowerMatch = match.toLowerCase()\n  const startIndex = lowerText.indexOf(lowerMatch)\n\n  if (startIndex === -1) {\n    return <>{text}</>\n  }\n\n  const before = text.slice(0, startIndex)\n  const matched = text.slice(startIndex, startIndex + match.length)\n  const after = text.slice(startIndex + match.length)\n\n  return (\n    <>\n      {before}\n      <strong class=\"mcp-autocomplete-highlight\">{matched}</strong>\n      {after}\n    </>\n  )\n}\n\n/**\n * Default option renderer\n */\nconst DefaultOptionRenderer: Component<{\n  option: AutocompleteOption\n  isSelected: boolean\n  highlightMatch?: string\n}> = (props) => {\n  const displayLabel = createMemo(() =>\n    props.option.label || props.option.value\n  )\n\n  return (\n    <div class=\"mcp-autocomplete-option-content\">\n      <Show when={props.option.icon}>\n        <span class=\"mcp-autocomplete-option-icon\">{props.option.icon}</span>\n      </Show>\n      <div class=\"mcp-autocomplete-option-text\">\n        <span class=\"mcp-autocomplete-option-label\">\n          {highlightText(displayLabel(), props.highlightMatch)}\n        </span>\n        <Show when={props.option.description}>\n          <span class=\"mcp-autocomplete-option-description\">\n            {props.option.description}\n          </span>\n        </Show>\n      </div>\n    </div>\n  )\n}\n\n/**\n * AutocompleteDropdown Component\n */\nexport const AutocompleteDropdown: Component<AutocompleteDropdownProps> = (props) => {\n  const strings = useMCPUIStrings()\n  const positionStyles = createMemo((): JSX.CSSProperties => {\n    if (props.position === 'top') {\n      return {\n        bottom: '100%',\n        'margin-bottom': '4px'\n      }\n    }\n    return {\n      top: '100%',\n      'margin-top': '4px'\n    }\n  })\n\n  const containerStyles = createMemo((): JSX.CSSProperties => ({\n    position: 'absolute',\n    left: '0',\n    right: '0',\n    'z-index': '50',\n    'background-color': '#ffffff',\n    border: '1px solid #e5e7eb',\n    'border-radius': '6px',\n    'box-shadow': '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',\n    'max-height': props.maxHeight || '240px',\n    overflow: 'auto',\n    ...positionStyles()\n  }))\n\n  return (\n    <Show when={props.isOpen}>\n      <div\n        class={`mcp-autocomplete-dropdown ${props.class || ''}`}\n        style={containerStyles()}\n        role=\"listbox\"\n        aria-label={strings.autocompleteSuggestions}\n      >\n        {/* Loading state */}\n        <Show when={props.isLoading}>\n          <div\n            class=\"mcp-autocomplete-loading\"\n            style={{\n              padding: '12px 16px',\n              color: '#6b7280',\n              'font-size': '0.875rem',\n              display: 'flex',\n              'align-items': 'center',\n              gap: '8px'\n            }}\n          >\n            <span\n              style={{\n                display: 'inline-block',\n                width: '14px',\n                height: '14px',\n                border: '2px solid #e5e7eb',\n                'border-top-color': '#3b82f6',\n                'border-radius': '50%',\n                animation: 'mcp-spin 0.6s linear infinite'\n              }}\n            />\n            {props.loadingMessage || strings.autocompleteLoading}\n          </div>\n        </Show>\n\n        {/* Empty state */}\n        <Show when={!props.isLoading && props.options.length === 0}>\n          <div\n            class=\"mcp-autocomplete-empty\"\n            style={{\n              padding: '12px 16px',\n              color: '#9ca3af',\n              'font-size': '0.875rem',\n              'text-align': 'center'\n            }}\n          >\n            {props.emptyMessage || strings.autocompleteEmpty}\n          </div>\n        </Show>\n\n        {/* Options list */}\n        <Show when={!props.isLoading && props.options.length > 0}>\n          <ul\n            class=\"mcp-autocomplete-options\"\n            style={{ margin: '0', padding: '4px 0', 'list-style': 'none' }}\n          >\n            <For each={props.options}>\n              {(option, index) => {\n                const isSelected = () => index() === props.selectedIndex\n                const isDisabled = () => option.disabled\n\n                return (\n                  <li\n                    role=\"option\"\n                    aria-selected={isSelected()}\n                    aria-disabled={isDisabled()}\n                    class={`mcp-autocomplete-option ${isSelected() ? 'mcp-autocomplete-option-selected' : ''} ${isDisabled() ? 'mcp-autocomplete-option-disabled' : ''}`}\n                    style={{\n                      padding: '8px 16px',\n                      cursor: isDisabled() ? 'not-allowed' : 'pointer',\n                      'background-color': isSelected() ? '#eff6ff' : 'transparent',\n                      color: isDisabled() ? '#9ca3af' : '#374151',\n                      'font-size': '0.875rem',\n                      transition: 'background-color 150ms ease'\n                    }}\n                    onClick={() => {\n                      if (!isDisabled()) {\n                        props.onSelect(option)\n                      }\n                    }}\n                    onMouseEnter={() => {\n                      if (!isDisabled()) {\n                        props.onHover?.(index())\n                      }\n                    }}\n                  >\n                    <Show\n                      when={props.renderOption}\n                      fallback={\n                        <DefaultOptionRenderer\n                          option={option}\n                          isSelected={isSelected()}\n                          highlightMatch={props.highlightMatch}\n                        />\n                      }\n                    >\n                      {props.renderOption!(option, isSelected())}\n                    </Show>\n                  </li>\n                )\n              }}\n            </For>\n          </ul>\n        </Show>\n\n        {/* Footer hint */}\n        <Show when={!props.isLoading && props.options.length > 0}>\n          <div\n            class=\"mcp-autocomplete-footer\"\n            style={{\n              padding: '6px 12px',\n              'border-top': '1px solid #e5e7eb',\n              'background-color': '#f9fafb',\n              'font-size': '0.75rem',\n              color: '#6b7280'\n            }}\n          >\n            <kbd style={{\n              'background-color': '#e5e7eb',\n              padding: '1px 4px',\n              'border-radius': '2px',\n              'font-family': 'inherit',\n              'font-size': '0.7rem'\n            }}>↑</kbd>\n            {' '}\n            <kbd style={{\n              'background-color': '#e5e7eb',\n              padding: '1px 4px',\n              'border-radius': '2px',\n              'font-family': 'inherit',\n              'font-size': '0.7rem'\n            }}>↓</kbd>\n            {strings.autocompleteHintNavigate}\n            <kbd style={{\n              'background-color': '#e5e7eb',\n              padding: '1px 4px',\n              'border-radius': '2px',\n              'font-family': 'inherit',\n              'font-size': '0.7rem'\n            }}>Enter</kbd>\n            {strings.autocompleteHintSelect}\n            <kbd style={{\n              'background-color': '#e5e7eb',\n              padding: '1px 4px',\n              'border-radius': '2px',\n              'font-family': 'inherit',\n              'font-size': '0.7rem'\n            }}>Esc</kbd>\n            {strings.autocompleteHintDismiss}\n          </div>\n        </Show>\n      </div>\n    </Show>\n  )\n}\n\nexport default AutocompleteDropdown\n"],"names":["highlightText","text","match","lowerText","toLowerCase","lowerMatch","startIndex","indexOf","before","slice","matched","length","after","_el$","_$getNextElement","_tmpl$","_$insert","DefaultOptionRenderer","props","displayLabel","createMemo","option","label","value","_el$2","_tmpl$4","_el$9","firstChild","_el$0","_co$2","_$getNextMarker","nextSibling","_el$4","_el$5","_el$7","_el$8","_co$","_$createComponent","Show","when","icon","children","_el$3","_tmpl$2","highlightMatch","description","_el$6","_tmpl$3","AutocompleteDropdown","strings","useMCPUIStrings","positionStyles","position","bottom","top","containerStyles","left","right","border","maxHeight","overflow","isOpen","_el$1","_tmpl$9","_el$28","_el$29","_co$7","_el$30","_el$31","_co$8","_el$32","_el$33","_co$9","_el$34","_el$35","_co$0","isLoading","_el$10","_tmpl$5","_el$11","_el$12","_el$13","_co$3","loadingMessage","autocompleteLoading","_$memo","options","_el$14","_tmpl$6","emptyMessage","autocompleteEmpty","_el$15","_tmpl$7","For","each","index","isSelected","selectedIndex","isDisabled","disabled","_el$36","_tmpl$0","addEventListener","onHover","$$click","onSelect","renderOption","fallback","_$effect","_p$","_v$4","_v$5","_v$6","_v$7","_v$8","_v$9","e","_$setAttribute","t","a","_$className","o","_$setStyleProperty","i","n","undefined","_$runHydrationEvents","_el$16","_tmpl$8","_el$17","_el$18","_el$19","_el$22","_el$23","_co$4","_el$20","_el$24","_el$25","_co$5","_el$21","_el$26","_el$27","_co$6","autocompleteHintNavigate","autocompleteHintSelect","autocompleteHintDismiss","_v$","class","_v$2","_v$3","autocompleteSuggestions","_$style","_$delegateEvents"],"mappings":"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"}

package/dist/components/AutocompleteDropdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteDropdown.d.ts","sourceRoot":"","sources":["../../src/components/AutocompleteDropdown.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,SAAS,EAAyB,GAAG,EAAE,MAAM,UAAU,CAAA;AAChE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAA;AAElD;;GAEG;AACH,MAAM,WAAW,yBAAyB;IACxC;;OAEG;IACH,OAAO,EAAE,kBAAkB,EAAE,CAAA;IAE7B;;OAEG;IACH,aAAa,EAAE,MAAM,CAAA;IAErB;;OAEG;IACH,MAAM,EAAE,OAAO,CAAA;IAEf;;OAEG;IACH,QAAQ,EAAE,CAAC,MAAM,EAAE,kBAAkB,KAAK,IAAI,CAAA;IAE9C;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAEjC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IAEnB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAA;IAEvB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAA;IAEvB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;IAE3B;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,kBAAkB,EAAE,UAAU,EAAE,OAAO,KAAK,GAAG,CAAC,OAAO,CAAA;CAChF;AA8DD;;GAEG;AACH,eAAO,MAAM,oBAAoB,EAAE,SAAS,CAAC,yBAAyB,CAuLrE,CAAA;AAED,eAAe,oBAAoB,CAAA"}
+{"version":3,"file":"AutocompleteDropdown.d.ts","sourceRoot":"","sources":["../../src/components/AutocompleteDropdown.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,SAAS,EAAyB,GAAG,EAAE,MAAM,UAAU,CAAA;AAChE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAA;AAGlD;;GAEG;AACH,MAAM,WAAW,yBAAyB;IACxC;;OAEG;IACH,OAAO,EAAE,kBAAkB,EAAE,CAAA;IAE7B;;OAEG;IACH,aAAa,EAAE,MAAM,CAAA;IAErB;;OAEG;IACH,MAAM,EAAE,OAAO,CAAA;IAEf;;OAEG;IACH,QAAQ,EAAE,CAAC,MAAM,EAAE,kBAAkB,KAAK,IAAI,CAAA;IAE9C;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAEjC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IAEnB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAA;IAEvB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAA;IAEvB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;IAE3B;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,kBAAkB,EAAE,UAAU,EAAE,OAAO,KAAK,GAAG,CAAC,OAAO,CAAA;CAChF;AA8DD;;GAEG;AACH,eAAO,MAAM,oBAAoB,EAAE,SAAS,CAAC,yBAAyB,CAwLrE,CAAA;AAED,eAAe,oBAAoB,CAAA"}

package/dist/components/AutocompleteDropdown.js

@@ -1,6 +1,7 @@
 import { createComponent, getNextElement, getNextMarker, insert, memo, effect, setAttribute, className, setStyleProperty, runHydrationEvents, style, template, delegateEvents } from "solid-js/web";
 import { createMemo, Show, For } from "solid-js";
-var _tmpl$ = /* @__PURE__ */ template(`<strong class=mcp-autocomplete-highlight>`), _tmpl$2 = /* @__PURE__ */ template(`<span class=mcp-autocomplete-option-icon>`), _tmpl$3 = /* @__PURE__ */ template(`<span class=mcp-autocomplete-option-description>`), _tmpl$4 = /* @__PURE__ */ template(`<div class=mcp-autocomplete-option-content><!$><!/><div class=mcp-autocomplete-option-text><span class=mcp-autocomplete-option-label></span><!$><!/>`), _tmpl$5 = /* @__PURE__ */ template(`<div class=mcp-autocomplete-loading style="padding:12px 16px;color:#6b7280;font-size:0.875rem;display:flex;align-items:center;gap:8px"><span style="display:inline-block;width:14px;height:14px;border:2px solid #e5e7eb;border-top-color:#3b82f6;border-radius:50%;animation:mcp-spin 0.6s linear infinite"></span><!$><!/>`), _tmpl$6 = /* @__PURE__ */ template(`<div class=mcp-autocomplete-empty style="padding:12px 16px;color:#9ca3af;font-size:0.875rem;text-align:center">`), _tmpl$7 = /* @__PURE__ */ template(`<ul class=mcp-autocomplete-options style="margin:0;padding:4px 0;list-style:none">`), _tmpl$8 = /* @__PURE__ */ template(`<div class=mcp-autocomplete-footer style="padding:6px 12px;border-top:1px solid #e5e7eb;background-color:#f9fafb;font-size:0.75rem;color:#6b7280"><kbd style="background-color:#e5e7eb;padding:1px 4px;border-radius:2px;font-family:inherit;font-size:0.7rem">↑</kbd> <kbd style="background-color:#e5e7eb;padding:1px 4px;border-radius:2px;font-family:inherit;font-size:0.7rem">↓</kbd> to navigate, <kbd style="background-color:#e5e7eb;padding:1px 4px;border-radius:2px;font-family:inherit;font-size:0.7rem">Enter</kbd> to select, <kbd style="background-color:#e5e7eb;padding:1px 4px;border-radius:2px;font-family:inherit;font-size:0.7rem">Esc</kbd> to dismiss`), _tmpl$9 = /* @__PURE__ */ template(`<div role=listbox aria-label=Suggestions><!$><!/><!$><!/><!$><!/><!$><!/>`), _tmpl$0 = /* @__PURE__ */ template(`<li role=option style="padding:8px 16px;font-size:0.875rem;transition:background-color 150ms ease">`);
+import { useMCPUIStrings } from "../context/MCPUIStringsContext.js";
+var _tmpl$ = /* @__PURE__ */ template(`<strong class=mcp-autocomplete-highlight>`), _tmpl$2 = /* @__PURE__ */ template(`<span class=mcp-autocomplete-option-icon>`), _tmpl$3 = /* @__PURE__ */ template(`<span class=mcp-autocomplete-option-description>`), _tmpl$4 = /* @__PURE__ */ template(`<div class=mcp-autocomplete-option-content><!$><!/><div class=mcp-autocomplete-option-text><span class=mcp-autocomplete-option-label></span><!$><!/>`), _tmpl$5 = /* @__PURE__ */ template(`<div class=mcp-autocomplete-loading style="padding:12px 16px;color:#6b7280;font-size:0.875rem;display:flex;align-items:center;gap:8px"><span style="display:inline-block;width:14px;height:14px;border:2px solid #e5e7eb;border-top-color:#3b82f6;border-radius:50%;animation:mcp-spin 0.6s linear infinite"></span><!$><!/>`), _tmpl$6 = /* @__PURE__ */ template(`<div class=mcp-autocomplete-empty style="padding:12px 16px;color:#9ca3af;font-size:0.875rem;text-align:center">`), _tmpl$7 = /* @__PURE__ */ template(`<ul class=mcp-autocomplete-options style="margin:0;padding:4px 0;list-style:none">`), _tmpl$8 = /* @__PURE__ */ template(`<div class=mcp-autocomplete-footer style="padding:6px 12px;border-top:1px solid #e5e7eb;background-color:#f9fafb;font-size:0.75rem;color:#6b7280"><kbd style="background-color:#e5e7eb;padding:1px 4px;border-radius:2px;font-family:inherit;font-size:0.7rem">↑</kbd> <kbd style="background-color:#e5e7eb;padding:1px 4px;border-radius:2px;font-family:inherit;font-size:0.7rem">↓</kbd><!$><!/><kbd style="background-color:#e5e7eb;padding:1px 4px;border-radius:2px;font-family:inherit;font-size:0.7rem">Enter</kbd><!$><!/><kbd style="background-color:#e5e7eb;padding:1px 4px;border-radius:2px;font-family:inherit;font-size:0.7rem">Esc</kbd><!$><!/>`), _tmpl$9 = /* @__PURE__ */ template(`<div role=listbox><!$><!/><!$><!/><!$><!/><!$><!/>`), _tmpl$0 = /* @__PURE__ */ template(`<li role=option style="padding:8px 16px;font-size:0.875rem;transition:background-color 150ms ease">`);
 function highlightText(text, match) {
   if (!match || !text) {
     return text;
@@ -49,6 +50,7 @@ const DefaultOptionRenderer = (props) => {
   })();
 };
 const AutocompleteDropdown = (props) => {
+  const strings = useMCPUIStrings();
   const positionStyles = createMemo(() => {
     if (props.position === "top") {
       return {
@@ -79,27 +81,27 @@ const AutocompleteDropdown = (props) => {
       return props.isOpen;
     },
     get children() {
-      var _el$1 = getNextElement(_tmpl$9), _el$24 = _el$1.firstChild, [_el$25, _co$4] = getNextMarker(_el$24.nextSibling), _el$26 = _el$25.nextSibling, [_el$27, _co$5] = getNextMarker(_el$26.nextSibling), _el$28 = _el$27.nextSibling, [_el$29, _co$6] = getNextMarker(_el$28.nextSibling), _el$30 = _el$29.nextSibling, [_el$31, _co$7] = getNextMarker(_el$30.nextSibling);
+      var _el$1 = getNextElement(_tmpl$9), _el$28 = _el$1.firstChild, [_el$29, _co$7] = getNextMarker(_el$28.nextSibling), _el$30 = _el$29.nextSibling, [_el$31, _co$8] = getNextMarker(_el$30.nextSibling), _el$32 = _el$31.nextSibling, [_el$33, _co$9] = getNextMarker(_el$32.nextSibling), _el$34 = _el$33.nextSibling, [_el$35, _co$0] = getNextMarker(_el$34.nextSibling);
       insert(_el$1, createComponent(Show, {
         get when() {
           return props.isLoading;
         },
         get children() {
           var _el$10 = getNextElement(_tmpl$5), _el$11 = _el$10.firstChild, _el$12 = _el$11.nextSibling, [_el$13, _co$3] = getNextMarker(_el$12.nextSibling);
-          insert(_el$10, () => props.loadingMessage || "Loading...", _el$13, _co$3);
+          insert(_el$10, () => props.loadingMessage || strings.autocompleteLoading, _el$13, _co$3);
           return _el$10;
         }
-      }), _el$25, _co$4);
+      }), _el$29, _co$7);
       insert(_el$1, createComponent(Show, {
         get when() {
           return memo(() => !!!props.isLoading)() && props.options.length === 0;
         },
         get children() {
           var _el$14 = getNextElement(_tmpl$6);
-          insert(_el$14, () => props.emptyMessage || "No suggestions found");
+          insert(_el$14, () => props.emptyMessage || strings.autocompleteEmpty);
           return _el$14;
         }
-      }), _el$27, _co$5);
+      }), _el$31, _co$8);
       insert(_el$1, createComponent(Show, {
         get when() {
           return memo(() => !!!props.isLoading)() && props.options.length > 0;
@@ -114,19 +116,19 @@ const AutocompleteDropdown = (props) => {
               const isSelected = () => index() === props.selectedIndex;
               const isDisabled = () => option.disabled;
               return (() => {
-                var _el$32 = getNextElement(_tmpl$0);
-                _el$32.addEventListener("mouseenter", () => {
+                var _el$36 = getNextElement(_tmpl$0);
+                _el$36.addEventListener("mouseenter", () => {
                   var _a;
                   if (!isDisabled()) {
                     (_a = props.onHover) == null ? void 0 : _a.call(props, index());
                   }
                 });
-                _el$32.$$click = () => {
+                _el$36.$$click = () => {
                   if (!isDisabled()) {
                     props.onSelect(option);
                   }
                 };
-                insert(_el$32, createComponent(Show, {
+                insert(_el$36, createComponent(Show, {
                   get when() {
                     return props.renderOption;
                   },
@@ -146,13 +148,13 @@ const AutocompleteDropdown = (props) => {
                   }
                 }));
                 effect((_p$) => {
-                  var _v$3 = isSelected(), _v$4 = isDisabled(), _v$5 = `mcp-autocomplete-option ${isSelected() ? "mcp-autocomplete-option-selected" : ""} ${isDisabled() ? "mcp-autocomplete-option-disabled" : ""}`, _v$6 = isDisabled() ? "not-allowed" : "pointer", _v$7 = isSelected() ? "#eff6ff" : "transparent", _v$8 = isDisabled() ? "#9ca3af" : "#374151";
-                  _v$3 !== _p$.e && setAttribute(_el$32, "aria-selected", _p$.e = _v$3);
-                  _v$4 !== _p$.t && setAttribute(_el$32, "aria-disabled", _p$.t = _v$4);
-                  _v$5 !== _p$.a && className(_el$32, _p$.a = _v$5);
-                  _v$6 !== _p$.o && setStyleProperty(_el$32, "cursor", _p$.o = _v$6);
-                  _v$7 !== _p$.i && setStyleProperty(_el$32, "background-color", _p$.i = _v$7);
-                  _v$8 !== _p$.n && setStyleProperty(_el$32, "color", _p$.n = _v$8);
+                  var _v$4 = isSelected(), _v$5 = isDisabled(), _v$6 = `mcp-autocomplete-option ${isSelected() ? "mcp-autocomplete-option-selected" : ""} ${isDisabled() ? "mcp-autocomplete-option-disabled" : ""}`, _v$7 = isDisabled() ? "not-allowed" : "pointer", _v$8 = isSelected() ? "#eff6ff" : "transparent", _v$9 = isDisabled() ? "#9ca3af" : "#374151";
+                  _v$4 !== _p$.e && setAttribute(_el$36, "aria-selected", _p$.e = _v$4);
+                  _v$5 !== _p$.t && setAttribute(_el$36, "aria-disabled", _p$.t = _v$5);
+                  _v$6 !== _p$.a && className(_el$36, _p$.a = _v$6);
+                  _v$7 !== _p$.o && setStyleProperty(_el$36, "cursor", _p$.o = _v$7);
+                  _v$8 !== _p$.i && setStyleProperty(_el$36, "background-color", _p$.i = _v$8);
+                  _v$9 !== _p$.n && setStyleProperty(_el$36, "color", _p$.n = _v$9);
                   return _p$;
                 }, {
                   e: void 0,
@@ -163,31 +165,35 @@ const AutocompleteDropdown = (props) => {
                   n: void 0
                 });
                 runHydrationEvents();
-                return _el$32;
+                return _el$36;
               })();
             }
           }));
           return _el$15;
         }
-      }), _el$29, _co$6);
+      }), _el$33, _co$9);
       insert(_el$1, createComponent(Show, {
         get when() {
           return memo(() => !!!props.isLoading)() && props.options.length > 0;
         },
         get children() {
-          var _el$16 = getNextElement(_tmpl$8), _el$17 = _el$16.firstChild, _el$18 = _el$17.nextSibling, _el$19 = _el$18.nextSibling, _el$20 = _el$19.nextSibling, _el$21 = _el$20.nextSibling, _el$22 = _el$21.nextSibling;
-          _el$22.nextSibling;
+          var _el$16 = getNextElement(_tmpl$8), _el$17 = _el$16.firstChild, _el$18 = _el$17.nextSibling, _el$19 = _el$18.nextSibling, _el$22 = _el$19.nextSibling, [_el$23, _co$4] = getNextMarker(_el$22.nextSibling), _el$20 = _el$23.nextSibling, _el$24 = _el$20.nextSibling, [_el$25, _co$5] = getNextMarker(_el$24.nextSibling), _el$21 = _el$25.nextSibling, _el$26 = _el$21.nextSibling, [_el$27, _co$6] = getNextMarker(_el$26.nextSibling);
+          insert(_el$16, () => strings.autocompleteHintNavigate, _el$23, _co$4);
+          insert(_el$16, () => strings.autocompleteHintSelect, _el$25, _co$5);
+          insert(_el$16, () => strings.autocompleteHintDismiss, _el$27, _co$6);
           return _el$16;
         }
-      }), _el$31, _co$7);
+      }), _el$35, _co$0);
       effect((_p$) => {
-        var _v$ = `mcp-autocomplete-dropdown ${props.class || ""}`, _v$2 = containerStyles();
+        var _v$ = `mcp-autocomplete-dropdown ${props.class || ""}`, _v$2 = containerStyles(), _v$3 = strings.autocompleteSuggestions;
         _v$ !== _p$.e && className(_el$1, _p$.e = _v$);
         _p$.t = style(_el$1, _v$2, _p$.t);
+        _v$3 !== _p$.a && setAttribute(_el$1, "aria-label", _p$.a = _v$3);
         return _p$;
       }, {
         e: void 0,
-        t: void 0
+        t: void 0,
+        a: void 0
       });
       return _el$1;
     }

package/dist/components/AutocompleteDropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteDropdown.js","sources":["../../src/components/AutocompleteDropdown.tsx"],"sourcesContent":["/**\n * AutocompleteDropdown Component\n * Displays data-driven dropdown suggestions\n *\n * Sprint Autocomplete Feature\n */\n\nimport { Component, For, Show, createMemo, JSX } from 'solid-js'\nimport type { AutocompleteOption } from '../types'\n\n/**\n * Props for AutocompleteDropdown\n */\nexport interface AutocompleteDropdownProps {\n  /**\n   * Options to display\n   */\n  options: AutocompleteOption[]\n\n  /**\n   * Currently selected index\n   */\n  selectedIndex: number\n\n  /**\n   * Whether dropdown is visible\n   */\n  isOpen: boolean\n\n  /**\n   * Callback when option is selected\n   */\n  onSelect: (option: AutocompleteOption) => void\n\n  /**\n   * Callback when option is hovered\n   */\n  onHover?: (index: number) => void\n\n  /**\n   * Whether loading\n   */\n  isLoading?: boolean\n\n  /**\n   * Custom class\n   */\n  class?: string\n\n  /**\n   * Max height\n   */\n  maxHeight?: string\n\n  /**\n   * Empty state message\n   */\n  emptyMessage?: string\n\n  /**\n   * Loading message\n   */\n  loadingMessage?: string\n\n  /**\n   * Highlight matching text in options\n   */\n  highlightMatch?: string\n\n  /**\n   * Position (default: 'bottom')\n   */\n  position?: 'top' | 'bottom'\n\n  /**\n   * Custom option renderer\n   */\n  renderOption?: (option: AutocompleteOption, isSelected: boolean) => JSX.Element\n}\n\n/**\n * Highlight matching text\n */\nfunction highlightText(text: string, match?: string): JSX.Element {\n  if (!match || !text) {\n    return <>{text}</>\n  }\n\n  const lowerText = text.toLowerCase()\n  const lowerMatch = match.toLowerCase()\n  const startIndex = lowerText.indexOf(lowerMatch)\n\n  if (startIndex === -1) {\n    return <>{text}</>\n  }\n\n  const before = text.slice(0, startIndex)\n  const matched = text.slice(startIndex, startIndex + match.length)\n  const after = text.slice(startIndex + match.length)\n\n  return (\n    <>\n      {before}\n      <strong class=\"mcp-autocomplete-highlight\">{matched}</strong>\n      {after}\n    </>\n  )\n}\n\n/**\n * Default option renderer\n */\nconst DefaultOptionRenderer: Component<{\n  option: AutocompleteOption\n  isSelected: boolean\n  highlightMatch?: string\n}> = (props) => {\n  const displayLabel = createMemo(() =>\n    props.option.label || props.option.value\n  )\n\n  return (\n    <div class=\"mcp-autocomplete-option-content\">\n      <Show when={props.option.icon}>\n        <span class=\"mcp-autocomplete-option-icon\">{props.option.icon}</span>\n      </Show>\n      <div class=\"mcp-autocomplete-option-text\">\n        <span class=\"mcp-autocomplete-option-label\">\n          {highlightText(displayLabel(), props.highlightMatch)}\n        </span>\n        <Show when={props.option.description}>\n          <span class=\"mcp-autocomplete-option-description\">\n            {props.option.description}\n          </span>\n        </Show>\n      </div>\n    </div>\n  )\n}\n\n/**\n * AutocompleteDropdown Component\n */\nexport const AutocompleteDropdown: Component<AutocompleteDropdownProps> = (props) => {\n  const positionStyles = createMemo((): JSX.CSSProperties => {\n    if (props.position === 'top') {\n      return {\n        bottom: '100%',\n        'margin-bottom': '4px'\n      }\n    }\n    return {\n      top: '100%',\n      'margin-top': '4px'\n    }\n  })\n\n  const containerStyles = createMemo((): JSX.CSSProperties => ({\n    position: 'absolute',\n    left: '0',\n    right: '0',\n    'z-index': '50',\n    'background-color': '#ffffff',\n    border: '1px solid #e5e7eb',\n    'border-radius': '6px',\n    'box-shadow': '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',\n    'max-height': props.maxHeight || '240px',\n    overflow: 'auto',\n    ...positionStyles()\n  }))\n\n  return (\n    <Show when={props.isOpen}>\n      <div\n        class={`mcp-autocomplete-dropdown ${props.class || ''}`}\n        style={containerStyles()}\n        role=\"listbox\"\n        aria-label=\"Suggestions\"\n      >\n        {/* Loading state */}\n        <Show when={props.isLoading}>\n          <div\n            class=\"mcp-autocomplete-loading\"\n            style={{\n              padding: '12px 16px',\n              color: '#6b7280',\n              'font-size': '0.875rem',\n              display: 'flex',\n              'align-items': 'center',\n              gap: '8px'\n            }}\n          >\n            <span\n              style={{\n                display: 'inline-block',\n                width: '14px',\n                height: '14px',\n                border: '2px solid #e5e7eb',\n                'border-top-color': '#3b82f6',\n                'border-radius': '50%',\n                animation: 'mcp-spin 0.6s linear infinite'\n              }}\n            />\n            {props.loadingMessage || 'Loading...'}\n          </div>\n        </Show>\n\n        {/* Empty state */}\n        <Show when={!props.isLoading && props.options.length === 0}>\n          <div\n            class=\"mcp-autocomplete-empty\"\n            style={{\n              padding: '12px 16px',\n              color: '#9ca3af',\n              'font-size': '0.875rem',\n              'text-align': 'center'\n            }}\n          >\n            {props.emptyMessage || 'No suggestions found'}\n          </div>\n        </Show>\n\n        {/* Options list */}\n        <Show when={!props.isLoading && props.options.length > 0}>\n          <ul\n            class=\"mcp-autocomplete-options\"\n            style={{ margin: '0', padding: '4px 0', 'list-style': 'none' }}\n          >\n            <For each={props.options}>\n              {(option, index) => {\n                const isSelected = () => index() === props.selectedIndex\n                const isDisabled = () => option.disabled\n\n                return (\n                  <li\n                    role=\"option\"\n                    aria-selected={isSelected()}\n                    aria-disabled={isDisabled()}\n                    class={`mcp-autocomplete-option ${isSelected() ? 'mcp-autocomplete-option-selected' : ''} ${isDisabled() ? 'mcp-autocomplete-option-disabled' : ''}`}\n                    style={{\n                      padding: '8px 16px',\n                      cursor: isDisabled() ? 'not-allowed' : 'pointer',\n                      'background-color': isSelected() ? '#eff6ff' : 'transparent',\n                      color: isDisabled() ? '#9ca3af' : '#374151',\n                      'font-size': '0.875rem',\n                      transition: 'background-color 150ms ease'\n                    }}\n                    onClick={() => {\n                      if (!isDisabled()) {\n                        props.onSelect(option)\n                      }\n                    }}\n                    onMouseEnter={() => {\n                      if (!isDisabled()) {\n                        props.onHover?.(index())\n                      }\n                    }}\n                  >\n                    <Show\n                      when={props.renderOption}\n                      fallback={\n                        <DefaultOptionRenderer\n                          option={option}\n                          isSelected={isSelected()}\n                          highlightMatch={props.highlightMatch}\n                        />\n                      }\n                    >\n                      {props.renderOption!(option, isSelected())}\n                    </Show>\n                  </li>\n                )\n              }}\n            </For>\n          </ul>\n        </Show>\n\n        {/* Footer hint */}\n        <Show when={!props.isLoading && props.options.length > 0}>\n          <div\n            class=\"mcp-autocomplete-footer\"\n            style={{\n              padding: '6px 12px',\n              'border-top': '1px solid #e5e7eb',\n              'background-color': '#f9fafb',\n              'font-size': '0.75rem',\n              color: '#6b7280'\n            }}\n          >\n            <kbd style={{\n              'background-color': '#e5e7eb',\n              padding: '1px 4px',\n              'border-radius': '2px',\n              'font-family': 'inherit',\n              'font-size': '0.7rem'\n            }}>↑</kbd>\n            {' '}\n            <kbd style={{\n              'background-color': '#e5e7eb',\n              padding: '1px 4px',\n              'border-radius': '2px',\n              'font-family': 'inherit',\n              'font-size': '0.7rem'\n            }}>↓</kbd>\n            {' to navigate, '}\n            <kbd style={{\n              'background-color': '#e5e7eb',\n              padding: '1px 4px',\n              'border-radius': '2px',\n              'font-family': 'inherit',\n              'font-size': '0.7rem'\n            }}>Enter</kbd>\n            {' to select, '}\n            <kbd style={{\n              'background-color': '#e5e7eb',\n              padding: '1px 4px',\n              'border-radius': '2px',\n              'font-family': 'inherit',\n              'font-size': '0.7rem'\n            }}>Esc</kbd>\n            {' to dismiss'}\n          </div>\n        </Show>\n      </div>\n    </Show>\n  )\n}\n\nexport default AutocompleteDropdown\n"],"names":["highlightText","text","match","lowerText","toLowerCase","lowerMatch","startIndex","indexOf","before","slice","matched","length","after","_el$","_$getNextElement","_tmpl$","_$insert","DefaultOptionRenderer","props","displayLabel","createMemo","option","label","value","_el$2","_tmpl$4","_el$9","firstChild","_el$0","_co$2","_$getNextMarker","nextSibling","_el$4","_el$5","_el$7","_el$8","_co$","_$createComponent","Show","when","icon","children","_el$3","_tmpl$2","highlightMatch","description","_el$6","_tmpl$3","AutocompleteDropdown","positionStyles","position","bottom","top","containerStyles","left","right","border","maxHeight","overflow","isOpen","_el$1","_tmpl$9","_el$24","_el$25","_co$4","_el$26","_el$27","_co$5","_el$28","_el$29","_co$6","_el$30","_el$31","_co$7","isLoading","_el$10","_tmpl$5","_el$11","_el$12","_el$13","_co$3","loadingMessage","_$memo","options","_el$14","_tmpl$6","emptyMessage","_el$15","_tmpl$7","For","each","index","isSelected","selectedIndex","isDisabled","disabled","_el$32","_tmpl$0","addEventListener","onHover","$$click","onSelect","renderOption","fallback","_$effect","_p$","_v$3","_v$4","_v$5","_v$6","_v$7","_v$8","e","_$setAttribute","t","a","_$className","o","_$setStyleProperty","i","n","undefined","_$runHydrationEvents","_el$16","_tmpl$8","_el$17","_el$18","_el$19","_el$20","_el$21","_el$22","_v$","class","_v$2","_$style","_$delegateEvents"],"mappings":"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"}
+{"version":3,"file":"AutocompleteDropdown.js","sources":["../../src/components/AutocompleteDropdown.tsx"],"sourcesContent":["/**\n * AutocompleteDropdown Component\n * Displays data-driven dropdown suggestions\n *\n * Sprint Autocomplete Feature\n */\n\nimport { Component, For, Show, createMemo, JSX } from 'solid-js'\nimport type { AutocompleteOption } from '../types'\nimport { useMCPUIStrings } from '../context/MCPUIStringsContext'\n\n/**\n * Props for AutocompleteDropdown\n */\nexport interface AutocompleteDropdownProps {\n  /**\n   * Options to display\n   */\n  options: AutocompleteOption[]\n\n  /**\n   * Currently selected index\n   */\n  selectedIndex: number\n\n  /**\n   * Whether dropdown is visible\n   */\n  isOpen: boolean\n\n  /**\n   * Callback when option is selected\n   */\n  onSelect: (option: AutocompleteOption) => void\n\n  /**\n   * Callback when option is hovered\n   */\n  onHover?: (index: number) => void\n\n  /**\n   * Whether loading\n   */\n  isLoading?: boolean\n\n  /**\n   * Custom class\n   */\n  class?: string\n\n  /**\n   * Max height\n   */\n  maxHeight?: string\n\n  /**\n   * Empty state message\n   */\n  emptyMessage?: string\n\n  /**\n   * Loading message\n   */\n  loadingMessage?: string\n\n  /**\n   * Highlight matching text in options\n   */\n  highlightMatch?: string\n\n  /**\n   * Position (default: 'bottom')\n   */\n  position?: 'top' | 'bottom'\n\n  /**\n   * Custom option renderer\n   */\n  renderOption?: (option: AutocompleteOption, isSelected: boolean) => JSX.Element\n}\n\n/**\n * Highlight matching text\n */\nfunction highlightText(text: string, match?: string): JSX.Element {\n  if (!match || !text) {\n    return <>{text}</>\n  }\n\n  const lowerText = text.toLowerCase()\n  const lowerMatch = match.toLowerCase()\n  const startIndex = lowerText.indexOf(lowerMatch)\n\n  if (startIndex === -1) {\n    return <>{text}</>\n  }\n\n  const before = text.slice(0, startIndex)\n  const matched = text.slice(startIndex, startIndex + match.length)\n  const after = text.slice(startIndex + match.length)\n\n  return (\n    <>\n      {before}\n      <strong class=\"mcp-autocomplete-highlight\">{matched}</strong>\n      {after}\n    </>\n  )\n}\n\n/**\n * Default option renderer\n */\nconst DefaultOptionRenderer: Component<{\n  option: AutocompleteOption\n  isSelected: boolean\n  highlightMatch?: string\n}> = (props) => {\n  const displayLabel = createMemo(() =>\n    props.option.label || props.option.value\n  )\n\n  return (\n    <div class=\"mcp-autocomplete-option-content\">\n      <Show when={props.option.icon}>\n        <span class=\"mcp-autocomplete-option-icon\">{props.option.icon}</span>\n      </Show>\n      <div class=\"mcp-autocomplete-option-text\">\n        <span class=\"mcp-autocomplete-option-label\">\n          {highlightText(displayLabel(), props.highlightMatch)}\n        </span>\n        <Show when={props.option.description}>\n          <span class=\"mcp-autocomplete-option-description\">\n            {props.option.description}\n          </span>\n        </Show>\n      </div>\n    </div>\n  )\n}\n\n/**\n * AutocompleteDropdown Component\n */\nexport const AutocompleteDropdown: Component<AutocompleteDropdownProps> = (props) => {\n  const strings = useMCPUIStrings()\n  const positionStyles = createMemo((): JSX.CSSProperties => {\n    if (props.position === 'top') {\n      return {\n        bottom: '100%',\n        'margin-bottom': '4px'\n      }\n    }\n    return {\n      top: '100%',\n      'margin-top': '4px'\n    }\n  })\n\n  const containerStyles = createMemo((): JSX.CSSProperties => ({\n    position: 'absolute',\n    left: '0',\n    right: '0',\n    'z-index': '50',\n    'background-color': '#ffffff',\n    border: '1px solid #e5e7eb',\n    'border-radius': '6px',\n    'box-shadow': '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',\n    'max-height': props.maxHeight || '240px',\n    overflow: 'auto',\n    ...positionStyles()\n  }))\n\n  return (\n    <Show when={props.isOpen}>\n      <div\n        class={`mcp-autocomplete-dropdown ${props.class || ''}`}\n        style={containerStyles()}\n        role=\"listbox\"\n        aria-label={strings.autocompleteSuggestions}\n      >\n        {/* Loading state */}\n        <Show when={props.isLoading}>\n          <div\n            class=\"mcp-autocomplete-loading\"\n            style={{\n              padding: '12px 16px',\n              color: '#6b7280',\n              'font-size': '0.875rem',\n              display: 'flex',\n              'align-items': 'center',\n              gap: '8px'\n            }}\n          >\n            <span\n              style={{\n                display: 'inline-block',\n                width: '14px',\n                height: '14px',\n                border: '2px solid #e5e7eb',\n                'border-top-color': '#3b82f6',\n                'border-radius': '50%',\n                animation: 'mcp-spin 0.6s linear infinite'\n              }}\n            />\n            {props.loadingMessage || strings.autocompleteLoading}\n          </div>\n        </Show>\n\n        {/* Empty state */}\n        <Show when={!props.isLoading && props.options.length === 0}>\n          <div\n            class=\"mcp-autocomplete-empty\"\n            style={{\n              padding: '12px 16px',\n              color: '#9ca3af',\n              'font-size': '0.875rem',\n              'text-align': 'center'\n            }}\n          >\n            {props.emptyMessage || strings.autocompleteEmpty}\n          </div>\n        </Show>\n\n        {/* Options list */}\n        <Show when={!props.isLoading && props.options.length > 0}>\n          <ul\n            class=\"mcp-autocomplete-options\"\n            style={{ margin: '0', padding: '4px 0', 'list-style': 'none' }}\n          >\n            <For each={props.options}>\n              {(option, index) => {\n                const isSelected = () => index() === props.selectedIndex\n                const isDisabled = () => option.disabled\n\n                return (\n                  <li\n                    role=\"option\"\n                    aria-selected={isSelected()}\n                    aria-disabled={isDisabled()}\n                    class={`mcp-autocomplete-option ${isSelected() ? 'mcp-autocomplete-option-selected' : ''} ${isDisabled() ? 'mcp-autocomplete-option-disabled' : ''}`}\n                    style={{\n                      padding: '8px 16px',\n                      cursor: isDisabled() ? 'not-allowed' : 'pointer',\n                      'background-color': isSelected() ? '#eff6ff' : 'transparent',\n                      color: isDisabled() ? '#9ca3af' : '#374151',\n                      'font-size': '0.875rem',\n                      transition: 'background-color 150ms ease'\n                    }}\n                    onClick={() => {\n                      if (!isDisabled()) {\n                        props.onSelect(option)\n                      }\n                    }}\n                    onMouseEnter={() => {\n                      if (!isDisabled()) {\n                        props.onHover?.(index())\n                      }\n                    }}\n                  >\n                    <Show\n                      when={props.renderOption}\n                      fallback={\n                        <DefaultOptionRenderer\n                          option={option}\n                          isSelected={isSelected()}\n                          highlightMatch={props.highlightMatch}\n                        />\n                      }\n                    >\n                      {props.renderOption!(option, isSelected())}\n                    </Show>\n                  </li>\n                )\n              }}\n            </For>\n          </ul>\n        </Show>\n\n        {/* Footer hint */}\n        <Show when={!props.isLoading && props.options.length > 0}>\n          <div\n            class=\"mcp-autocomplete-footer\"\n            style={{\n              padding: '6px 12px',\n              'border-top': '1px solid #e5e7eb',\n              'background-color': '#f9fafb',\n              'font-size': '0.75rem',\n              color: '#6b7280'\n            }}\n          >\n            <kbd style={{\n              'background-color': '#e5e7eb',\n              padding: '1px 4px',\n              'border-radius': '2px',\n              'font-family': 'inherit',\n              'font-size': '0.7rem'\n            }}>↑</kbd>\n            {' '}\n            <kbd style={{\n              'background-color': '#e5e7eb',\n              padding: '1px 4px',\n              'border-radius': '2px',\n              'font-family': 'inherit',\n              'font-size': '0.7rem'\n            }}>↓</kbd>\n            {strings.autocompleteHintNavigate}\n            <kbd style={{\n              'background-color': '#e5e7eb',\n              padding: '1px 4px',\n              'border-radius': '2px',\n              'font-family': 'inherit',\n              'font-size': '0.7rem'\n            }}>Enter</kbd>\n            {strings.autocompleteHintSelect}\n            <kbd style={{\n              'background-color': '#e5e7eb',\n              padding: '1px 4px',\n              'border-radius': '2px',\n              'font-family': 'inherit',\n              'font-size': '0.7rem'\n            }}>Esc</kbd>\n            {strings.autocompleteHintDismiss}\n          </div>\n        </Show>\n      </div>\n    </Show>\n  )\n}\n\nexport default AutocompleteDropdown\n"],"names":["highlightText","text","match","lowerText","toLowerCase","lowerMatch","startIndex","indexOf","before","slice","matched","length","after","_el$","_$getNextElement","_tmpl$","_$insert","DefaultOptionRenderer","props","displayLabel","createMemo","option","label","value","_el$2","_tmpl$4","_el$9","firstChild","_el$0","_co$2","_$getNextMarker","nextSibling","_el$4","_el$5","_el$7","_el$8","_co$","_$createComponent","Show","when","icon","children","_el$3","_tmpl$2","highlightMatch","description","_el$6","_tmpl$3","AutocompleteDropdown","strings","useMCPUIStrings","positionStyles","position","bottom","top","containerStyles","left","right","border","maxHeight","overflow","isOpen","_el$1","_tmpl$9","_el$28","_el$29","_co$7","_el$30","_el$31","_co$8","_el$32","_el$33","_co$9","_el$34","_el$35","_co$0","isLoading","_el$10","_tmpl$5","_el$11","_el$12","_el$13","_co$3","loadingMessage","autocompleteLoading","_$memo","options","_el$14","_tmpl$6","emptyMessage","autocompleteEmpty","_el$15","_tmpl$7","For","each","index","isSelected","selectedIndex","isDisabled","disabled","_el$36","_tmpl$0","addEventListener","onHover","$$click","onSelect","renderOption","fallback","_$effect","_p$","_v$4","_v$5","_v$6","_v$7","_v$8","_v$9","e","_$setAttribute","t","a","_$className","o","_$setStyleProperty","i","n","undefined","_$runHydrationEvents","_el$16","_tmpl$8","_el$17","_el$18","_el$19","_el$22","_el$23","_co$4","_el$20","_el$24","_el$25","_co$5","_el$21","_el$26","_el$27","_co$6","autocompleteHintNavigate","autocompleteHintSelect","autocompleteHintDismiss","_v$","class","_v$2","_v$3","autocompleteSuggestions","_$style","_$delegateEvents"],"mappings":"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"}

package/dist/components/AutocompleteFormField.cjs

@@ -5,11 +5,13 @@ const solidJs = require("solid-js");
 const useConditionalField = require("../hooks/useConditionalField.cjs");
 const useAutocomplete = require("../hooks/useAutocomplete.cjs");
 const AutocompleteContext = require("../context/AutocompleteContext.cjs");
+const MCPUIStringsContext = require("../context/MCPUIStringsContext.cjs");
 const GhostText = require("./GhostText.cjs");
 const AutocompleteDropdown = require("./AutocompleteDropdown.cjs");
 var _tmpl$ = /* @__PURE__ */ web.template(`<span class="text-red-500 ml-1"aria-hidden=true>*`), _tmpl$2 = /* @__PURE__ */ web.template(`<label class="block text-sm font-medium text-gray-700 dark:text-gray-300"><!$><!/><!$><!/>`), _tmpl$3 = /* @__PURE__ */ web.template(`<div class=relative><!$><!/><input aria-autocomplete=list aria-haspopup=listbox autocomplete=off style=position:relative;z-index:2><!$><!/>`), _tmpl$4 = /* @__PURE__ */ web.template(`<p class="text-xs text-gray-500 dark:text-gray-400">`), _tmpl$5 = /* @__PURE__ */ web.template(`<p role=alert class="text-xs text-red-600 dark:text-red-400">`), _tmpl$6 = /* @__PURE__ */ web.template(`<div class=space-y-1><!$><!/><div class=relative></div><!$><!/><!$><!/>`), _tmpl$7 = /* @__PURE__ */ web.template(`<input>`);
 const AutocompleteFormField = (props) => {
   var _a, _b, _c, _d;
+  const strings = MCPUIStringsContext.useMCPUIStrings();
   const autocompleteCtx = AutocompleteContext.useAutocompleteContextSafe();
   const {
     isVisible
@@ -169,7 +171,7 @@ const AutocompleteFormField = (props) => {
                   return autocomplete.isOpen();
                 },
                 get hintText() {
-                  return autocomplete.ghostText() ? "Tab to accept" : void 0;
+                  return web.memo(() => !!autocomplete.ghostText())() ? strings.autocompleteTabToAccept : void 0;
                 },
                 get isLoading() {
                   return autocomplete.isLoading();

package/dist/components/AutocompleteFormField.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteFormField.cjs","sources":["../../src/components/AutocompleteFormField.tsx"],"sourcesContent":["/**\n * AutocompleteFormField Component\n * Form field with integrated autocomplete support\n *\n * Sprint Autocomplete Feature\n */\n\nimport { Component, Show, createSignal, createMemo, Accessor, createEffect, on } from 'solid-js'\nimport type { FormFieldParams, FieldAutocompleteConfig, AutocompleteContext } from '../types'\nimport { useConditionalField } from '../hooks/useConditionalField'\nimport { useAutocomplete } from '../hooks/useAutocomplete'\nimport { useAutocompleteContextSafe } from '../context/AutocompleteContext'\nimport { GhostText } from './GhostText'\nimport { AutocompleteDropdown } from './AutocompleteDropdown'\n\n/**\n * Extended FormFieldParams with autocomplete config\n */\nexport interface AutocompleteFormFieldParams extends FormFieldParams {\n  /**\n   * Autocomplete configuration for this field\n   */\n  autocomplete?: FieldAutocompleteConfig\n}\n\n/**\n * Props for AutocompleteFormField\n */\nexport interface AutocompleteFormFieldProps {\n  /**\n   * Field configuration\n   */\n  field: AutocompleteFormFieldParams\n\n  /**\n   * Current field value\n   */\n  value: any\n\n  /**\n   * Error message\n   */\n  error?: string\n\n  /**\n   * Change handler\n   */\n  onChange: (value: any) => void\n\n  /**\n   * Whether field is disabled\n   */\n  disabled?: boolean\n\n  /**\n   * Form data accessor for conditional visibility and context\n   */\n  formData?: Accessor<Record<string, any>>\n}\n\n/**\n * AutocompleteFormField Component\n */\nexport const AutocompleteFormField: Component<AutocompleteFormFieldProps> = (props) => {\n  // Check if autocomplete context is available\n  const autocompleteCtx = useAutocompleteContextSafe()\n\n  // Conditional visibility\n  const { isVisible } = useConditionalField({\n    condition: props.field.showWhen,\n    formData: props.formData || (() => ({}))\n  })\n\n  // Local input value for autocomplete (may differ during suggestion)\n  const [localValue, setLocalValue] = createSignal(String(props.value || ''))\n\n  // Sync external value changes\n  createEffect(on(() => props.value, (newValue) => {\n    setLocalValue(String(newValue || ''))\n  }))\n\n  // Build autocomplete context\n  const autocompleteContext = createMemo((): AutocompleteContext | undefined => {\n    const formData = props.formData?.()\n    const config = props.field.autocomplete\n\n    if (!config?.contextFields?.length && !formData) {\n      return { fieldName: props.field.name }\n    }\n\n    const contextData: Record<string, any> = {}\n    if (config?.contextFields && formData) {\n      config.contextFields.forEach(field => {\n        if (formData[field] !== undefined) {\n          contextData[field] = formData[field]\n        }\n      })\n    }\n\n    return {\n      fieldName: props.field.name,\n      formData: contextData\n    }\n  })\n\n  // Initialize autocomplete hook\n  const autocomplete = useAutocomplete({\n    inputValue: localValue,\n    pluginId: props.field.autocomplete?.plugin,\n    fieldConfig: props.field.autocomplete,\n    context: () => autocompleteContext() || { fieldName: props.field.name },\n    enabled: !!(props.field.autocomplete?.enabled && autocompleteCtx),\n    minChars: props.field.autocomplete?.minChars,\n    debounceMs: props.field.autocomplete?.debounceMs,\n    onInputChange: (value) => {\n      setLocalValue(value)\n      props.onChange(value)\n    }\n  })\n\n  // Handle input change\n  const handleInput = (value: string) => {\n    setLocalValue(value)\n    props.onChange(value)\n  }\n\n  // Handle key down\n  const handleKeyDown = (e: KeyboardEvent) => {\n    if (autocomplete.handleKeyDown(e)) {\n      return\n    }\n  }\n\n  // Base input class\n  const baseInputClass = () => `\n    w-full px-3 py-2 border rounded-md\n    focus:ring-2 focus:ring-blue-500 focus:border-blue-500\n    disabled:bg-gray-100 disabled:cursor-not-allowed\n    ${props.error\n      ? 'border-red-500 focus:ring-red-500'\n      : 'border-gray-300 dark:border-gray-600'}\n    dark:bg-gray-700 dark:text-white\n  `\n\n  const fieldId = () => `field-${props.field.name}`\n  const errorId = () => `${props.field.name}-error`\n\n  // Check if field supports autocomplete (text-based fields only)\n  const supportsAutocomplete = createMemo(() =>\n    ['text', 'email'].includes(props.field.type)\n  )\n\n  // Whether to show autocomplete features\n  const showAutocomplete = createMemo(() =>\n    supportsAutocomplete() &&\n    props.field.autocomplete?.enabled &&\n    autocompleteCtx !== undefined\n  )\n\n  return (\n    <Show when={isVisible()}>\n      <div class=\"space-y-1\">\n        {/* Label */}\n        <Show when={props.field.label}>\n          <label\n            for={fieldId()}\n            class=\"block text-sm font-medium text-gray-700 dark:text-gray-300\"\n          >\n            {props.field.label}\n            <Show when={props.field.required}>\n              <span class=\"text-red-500 ml-1\" aria-hidden=\"true\">*</span>\n            </Show>\n          </label>\n        </Show>\n\n        {/* Input with autocomplete */}\n        <div class=\"relative\">\n          <Show\n            when={showAutocomplete()}\n            fallback={\n              /* Standard input without autocomplete */\n              <input\n                id={fieldId()}\n                type={props.field.type}\n                name={props.field.name}\n                value={props.value || ''}\n                onInput={(e) => props.onChange(e.currentTarget.value)}\n                placeholder={props.field.placeholder}\n                disabled={props.disabled}\n                required={props.field.required}\n                minLength={props.field.minLength}\n                maxLength={props.field.maxLength}\n                pattern={props.field.pattern}\n                aria-invalid={!!props.error}\n                aria-describedby={props.error ? errorId() : undefined}\n                class={baseInputClass()}\n              />\n            }\n          >\n            {/* Autocomplete-enabled input */}\n            <div class=\"relative\">\n              {/* Ghost text overlay (for completion type) */}\n              <Show when={autocomplete.resultType() === 'completion'}>\n                <GhostText\n                  inputValue={localValue()}\n                  ghostText={autocomplete.ghostText()}\n                  visible={autocomplete.isOpen()}\n                  hintText={autocomplete.ghostText() ? 'Tab to accept' : undefined}\n                  isLoading={autocomplete.isLoading()}\n                />\n              </Show>\n\n              <input\n                id={fieldId()}\n                type={props.field.type}\n                name={props.field.name}\n                value={localValue()}\n                onInput={(e) => handleInput(e.currentTarget.value)}\n                onKeyDown={handleKeyDown}\n                onBlur={() => {\n                  // Delay dismiss to allow click on dropdown\n                  setTimeout(() => autocomplete.dismiss(), 150)\n                }}\n                onFocus={() => {\n                  if (localValue().length >= (props.field.autocomplete?.minChars || 1)) {\n                    autocomplete.open()\n                  }\n                }}\n                placeholder={props.field.placeholder}\n                disabled={props.disabled}\n                required={props.field.required}\n                minLength={props.field.minLength}\n                maxLength={props.field.maxLength}\n                pattern={props.field.pattern}\n                aria-invalid={!!props.error}\n                aria-describedby={props.error ? errorId() : undefined}\n                aria-autocomplete=\"list\"\n                aria-expanded={autocomplete.isOpen()}\n                aria-haspopup=\"listbox\"\n                class={`${baseInputClass()} ${autocomplete.resultType() === 'completion' ? 'bg-transparent' : ''}`}\n                style={{\n                  position: 'relative',\n                  'z-index': '2'\n                }}\n                autocomplete=\"off\"\n              />\n\n              {/* Dropdown (for options type) */}\n              <Show when={autocomplete.resultType() === 'options'}>\n                <AutocompleteDropdown\n                  options={autocomplete.options()}\n                  selectedIndex={autocomplete.selectedIndex()}\n                  isOpen={autocomplete.isOpen()}\n                  isLoading={autocomplete.isLoading()}\n                  onSelect={(option) => {\n                    handleInput(option.value)\n                    autocomplete.dismiss()\n                  }}\n                  onHover={(_index) => {\n                    // Could add hover selection here\n                  }}\n                  highlightMatch={localValue()}\n                  loadingMessage={props.field.autocomplete?.loadingPlaceholder}\n                />\n              </Show>\n            </div>\n          </Show>\n        </div>\n\n        {/* Help text */}\n        <Show when={props.field.helpText && !props.error}>\n          <p class=\"text-xs text-gray-500 dark:text-gray-400\">\n            {props.field.helpText}\n          </p>\n        </Show>\n\n        {/* Error message */}\n        <Show when={props.error}>\n          <p id={errorId()} role=\"alert\" class=\"text-xs text-red-600 dark:text-red-400\">\n            {props.error}\n          </p>\n        </Show>\n      </div>\n    </Show>\n  )\n}\n\nexport default AutocompleteFormField\n"],"names":["AutocompleteFormField","props","autocompleteCtx","useAutocompleteContextSafe","isVisible","useConditionalField","condition","field","showWhen","formData","localValue","setLocalValue","createSignal","String","value","createEffect","on","newValue","autocompleteContext","createMemo","config","autocomplete","contextFields","length","fieldName","name","contextData","forEach","undefined","useAutocomplete","inputValue","pluginId","plugin","fieldConfig","context","enabled","minChars","debounceMs","onInputChange","onChange","handleInput","handleKeyDown","e","baseInputClass","error","fieldId","errorId","supportsAutocomplete","includes","type","showAutocomplete","_$createComponent","Show","when","children","_el$","_$getNextElement","_tmpl$6","_el$15","firstChild","_el$16","_co$5","_$getNextMarker","nextSibling","_el$8","_el$17","_el$18","_co$6","_el$19","_el$20","_co$7","_$insert","label","_el$2","_tmpl$2","_el$4","_el$5","_co$","_el$6","_el$7","_co$2","required","_tmpl$","_$effect","_$setAttribute","fallback","_el$21","_tmpl$7","$$input","currentTarget","_p$","_v$12","_v$13","_v$14","_v$15","placeholder","_v$16","disabled","_v$17","_v$18","minLength","_v$19","maxLength","_v$20","pattern","_v$21","_v$22","_v$23","t","a","o","i","_$setProperty","n","s","h","r","d","l","u","_$className","_$runHydrationEvents","_el$9","_tmpl$3","_el$1","_el$10","_co$3","_el$0","_el$11","_el$12","_co$4","resultType","GhostText","ghostText","visible","isOpen","hintText","isLoading","addEventListener","open","setTimeout","dismiss","$$keydown","AutocompleteDropdown","options","selectedIndex","onSelect","option","onHover","_index","highlightMatch","loadingMessage","loadingPlaceholder","_v$","_v$2","_v$3","_v$4","_v$5","_v$6","_v$7","_v$8","_v$9","_v$0","_v$1","_v$10","_v$11","c","_$memo","helpText","_el$13","_tmpl$4","_el$14","_tmpl$5","_$delegateEvents"],"mappings":"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"}
+{"version":3,"file":"AutocompleteFormField.cjs","sources":["../../src/components/AutocompleteFormField.tsx"],"sourcesContent":["/**\n * AutocompleteFormField Component\n * Form field with integrated autocomplete support\n *\n * Sprint Autocomplete Feature\n */\n\nimport { Component, Show, createSignal, createMemo, Accessor, createEffect, on } from 'solid-js'\nimport type { FormFieldParams, FieldAutocompleteConfig, AutocompleteContext } from '../types'\nimport { useConditionalField } from '../hooks/useConditionalField'\nimport { useAutocomplete } from '../hooks/useAutocomplete'\nimport { useAutocompleteContextSafe } from '../context/AutocompleteContext'\nimport { useMCPUIStrings } from '../context/MCPUIStringsContext'\nimport { GhostText } from './GhostText'\nimport { AutocompleteDropdown } from './AutocompleteDropdown'\n\n/**\n * Extended FormFieldParams with autocomplete config\n */\nexport interface AutocompleteFormFieldParams extends FormFieldParams {\n  /**\n   * Autocomplete configuration for this field\n   */\n  autocomplete?: FieldAutocompleteConfig\n}\n\n/**\n * Props for AutocompleteFormField\n */\nexport interface AutocompleteFormFieldProps {\n  /**\n   * Field configuration\n   */\n  field: AutocompleteFormFieldParams\n\n  /**\n   * Current field value\n   */\n  value: any\n\n  /**\n   * Error message\n   */\n  error?: string\n\n  /**\n   * Change handler\n   */\n  onChange: (value: any) => void\n\n  /**\n   * Whether field is disabled\n   */\n  disabled?: boolean\n\n  /**\n   * Form data accessor for conditional visibility and context\n   */\n  formData?: Accessor<Record<string, any>>\n}\n\n/**\n * AutocompleteFormField Component\n */\nexport const AutocompleteFormField: Component<AutocompleteFormFieldProps> = (props) => {\n  const strings = useMCPUIStrings()\n  // Check if autocomplete context is available\n  const autocompleteCtx = useAutocompleteContextSafe()\n\n  // Conditional visibility\n  const { isVisible } = useConditionalField({\n    condition: props.field.showWhen,\n    formData: props.formData || (() => ({}))\n  })\n\n  // Local input value for autocomplete (may differ during suggestion)\n  const [localValue, setLocalValue] = createSignal(String(props.value || ''))\n\n  // Sync external value changes\n  createEffect(on(() => props.value, (newValue) => {\n    setLocalValue(String(newValue || ''))\n  }))\n\n  // Build autocomplete context\n  const autocompleteContext = createMemo((): AutocompleteContext | undefined => {\n    const formData = props.formData?.()\n    const config = props.field.autocomplete\n\n    if (!config?.contextFields?.length && !formData) {\n      return { fieldName: props.field.name }\n    }\n\n    const contextData: Record<string, any> = {}\n    if (config?.contextFields && formData) {\n      config.contextFields.forEach(field => {\n        if (formData[field] !== undefined) {\n          contextData[field] = formData[field]\n        }\n      })\n    }\n\n    return {\n      fieldName: props.field.name,\n      formData: contextData\n    }\n  })\n\n  // Initialize autocomplete hook\n  const autocomplete = useAutocomplete({\n    inputValue: localValue,\n    pluginId: props.field.autocomplete?.plugin,\n    fieldConfig: props.field.autocomplete,\n    context: () => autocompleteContext() || { fieldName: props.field.name },\n    enabled: !!(props.field.autocomplete?.enabled && autocompleteCtx),\n    minChars: props.field.autocomplete?.minChars,\n    debounceMs: props.field.autocomplete?.debounceMs,\n    onInputChange: (value) => {\n      setLocalValue(value)\n      props.onChange(value)\n    }\n  })\n\n  // Handle input change\n  const handleInput = (value: string) => {\n    setLocalValue(value)\n    props.onChange(value)\n  }\n\n  // Handle key down\n  const handleKeyDown = (e: KeyboardEvent) => {\n    if (autocomplete.handleKeyDown(e)) {\n      return\n    }\n  }\n\n  // Base input class\n  const baseInputClass = () => `\n    w-full px-3 py-2 border rounded-md\n    focus:ring-2 focus:ring-blue-500 focus:border-blue-500\n    disabled:bg-gray-100 disabled:cursor-not-allowed\n    ${props.error\n      ? 'border-red-500 focus:ring-red-500'\n      : 'border-gray-300 dark:border-gray-600'}\n    dark:bg-gray-700 dark:text-white\n  `\n\n  const fieldId = () => `field-${props.field.name}`\n  const errorId = () => `${props.field.name}-error`\n\n  // Check if field supports autocomplete (text-based fields only)\n  const supportsAutocomplete = createMemo(() =>\n    ['text', 'email'].includes(props.field.type)\n  )\n\n  // Whether to show autocomplete features\n  const showAutocomplete = createMemo(() =>\n    supportsAutocomplete() &&\n    props.field.autocomplete?.enabled &&\n    autocompleteCtx !== undefined\n  )\n\n  return (\n    <Show when={isVisible()}>\n      <div class=\"space-y-1\">\n        {/* Label */}\n        <Show when={props.field.label}>\n          <label\n            for={fieldId()}\n            class=\"block text-sm font-medium text-gray-700 dark:text-gray-300\"\n          >\n            {props.field.label}\n            <Show when={props.field.required}>\n              <span class=\"text-red-500 ml-1\" aria-hidden=\"true\">*</span>\n            </Show>\n          </label>\n        </Show>\n\n        {/* Input with autocomplete */}\n        <div class=\"relative\">\n          <Show\n            when={showAutocomplete()}\n            fallback={\n              /* Standard input without autocomplete */\n              <input\n                id={fieldId()}\n                type={props.field.type}\n                name={props.field.name}\n                value={props.value || ''}\n                onInput={(e) => props.onChange(e.currentTarget.value)}\n                placeholder={props.field.placeholder}\n                disabled={props.disabled}\n                required={props.field.required}\n                minLength={props.field.minLength}\n                maxLength={props.field.maxLength}\n                pattern={props.field.pattern}\n                aria-invalid={!!props.error}\n                aria-describedby={props.error ? errorId() : undefined}\n                class={baseInputClass()}\n              />\n            }\n          >\n            {/* Autocomplete-enabled input */}\n            <div class=\"relative\">\n              {/* Ghost text overlay (for completion type) */}\n              <Show when={autocomplete.resultType() === 'completion'}>\n                <GhostText\n                  inputValue={localValue()}\n                  ghostText={autocomplete.ghostText()}\n                  visible={autocomplete.isOpen()}\n                  hintText={\n                    autocomplete.ghostText() ? strings.autocompleteTabToAccept : undefined\n                  }\n                  isLoading={autocomplete.isLoading()}\n                />\n              </Show>\n\n              <input\n                id={fieldId()}\n                type={props.field.type}\n                name={props.field.name}\n                value={localValue()}\n                onInput={(e) => handleInput(e.currentTarget.value)}\n                onKeyDown={handleKeyDown}\n                onBlur={() => {\n                  // Delay dismiss to allow click on dropdown\n                  setTimeout(() => autocomplete.dismiss(), 150)\n                }}\n                onFocus={() => {\n                  if (localValue().length >= (props.field.autocomplete?.minChars || 1)) {\n                    autocomplete.open()\n                  }\n                }}\n                placeholder={props.field.placeholder}\n                disabled={props.disabled}\n                required={props.field.required}\n                minLength={props.field.minLength}\n                maxLength={props.field.maxLength}\n                pattern={props.field.pattern}\n                aria-invalid={!!props.error}\n                aria-describedby={props.error ? errorId() : undefined}\n                aria-autocomplete=\"list\"\n                aria-expanded={autocomplete.isOpen()}\n                aria-haspopup=\"listbox\"\n                class={`${baseInputClass()} ${autocomplete.resultType() === 'completion' ? 'bg-transparent' : ''}`}\n                style={{\n                  position: 'relative',\n                  'z-index': '2'\n                }}\n                autocomplete=\"off\"\n              />\n\n              {/* Dropdown (for options type) */}\n              <Show when={autocomplete.resultType() === 'options'}>\n                <AutocompleteDropdown\n                  options={autocomplete.options()}\n                  selectedIndex={autocomplete.selectedIndex()}\n                  isOpen={autocomplete.isOpen()}\n                  isLoading={autocomplete.isLoading()}\n                  onSelect={(option) => {\n                    handleInput(option.value)\n                    autocomplete.dismiss()\n                  }}\n                  onHover={(_index) => {\n                    // Could add hover selection here\n                  }}\n                  highlightMatch={localValue()}\n                  loadingMessage={props.field.autocomplete?.loadingPlaceholder}\n                />\n              </Show>\n            </div>\n          </Show>\n        </div>\n\n        {/* Help text */}\n        <Show when={props.field.helpText && !props.error}>\n          <p class=\"text-xs text-gray-500 dark:text-gray-400\">\n            {props.field.helpText}\n          </p>\n        </Show>\n\n        {/* Error message */}\n        <Show when={props.error}>\n          <p id={errorId()} role=\"alert\" class=\"text-xs text-red-600 dark:text-red-400\">\n            {props.error}\n          </p>\n        </Show>\n      </div>\n    </Show>\n  )\n}\n\nexport default AutocompleteFormField\n"],"names":["AutocompleteFormField","props","strings","useMCPUIStrings","autocompleteCtx","useAutocompleteContextSafe","isVisible","useConditionalField","condition","field","showWhen","formData","localValue","setLocalValue","createSignal","String","value","createEffect","on","newValue","autocompleteContext","createMemo","config","autocomplete","contextFields","length","fieldName","name","contextData","forEach","undefined","useAutocomplete","inputValue","pluginId","plugin","fieldConfig","context","enabled","minChars","debounceMs","onInputChange","onChange","handleInput","handleKeyDown","e","baseInputClass","error","fieldId","errorId","supportsAutocomplete","includes","type","showAutocomplete","_$createComponent","Show","when","children","_el$","_$getNextElement","_tmpl$6","_el$15","firstChild","_el$16","_co$5","_$getNextMarker","nextSibling","_el$8","_el$17","_el$18","_co$6","_el$19","_el$20","_co$7","_$insert","label","_el$2","_tmpl$2","_el$4","_el$5","_co$","_el$6","_el$7","_co$2","required","_tmpl$","_$effect","_$setAttribute","fallback","_el$21","_tmpl$7","$$input","currentTarget","_p$","_v$12","_v$13","_v$14","_v$15","placeholder","_v$16","disabled","_v$17","_v$18","minLength","_v$19","maxLength","_v$20","pattern","_v$21","_v$22","_v$23","t","a","o","i","_$setProperty","n","s","h","r","d","l","u","_$className","_$runHydrationEvents","_el$9","_tmpl$3","_el$1","_el$10","_co$3","_el$0","_el$11","_el$12","_co$4","resultType","GhostText","ghostText","visible","isOpen","hintText","_$memo","autocompleteTabToAccept","isLoading","addEventListener","open","setTimeout","dismiss","$$keydown","AutocompleteDropdown","options","selectedIndex","onSelect","option","onHover","_index","highlightMatch","loadingMessage","loadingPlaceholder","_v$","_v$2","_v$3","_v$4","_v$5","_v$6","_v$7","_v$8","_v$9","_v$0","_v$1","_v$10","_v$11","c","helpText","_el$13","_tmpl$4","_el$14","_tmpl$5","_$delegateEvents"],"mappings":";;;;;;;;;;;AAgEO,MAAMA,wBAAgEC,CAAAA,UAAU;;AACrF,QAAMC,UAAUC,oBAAAA,gBAAAA;AAEhB,QAAMC,kBAAkBC,oBAAAA,2BAAAA;AAGxB,QAAM;AAAA,IAAEC;AAAAA,EAAAA,IAAcC,wCAAoB;AAAA,IACxCC,WAAWP,MAAMQ,MAAMC;AAAAA,IACvBC,UAAUV,MAAMU,aAAa,OAAO;EAAC,CACtC;AAGD,QAAM,CAACC,YAAYC,aAAa,IAAIC,QAAAA,aAAaC,OAAOd,MAAMe,SAAS,EAAE,CAAC;AAG1EC,UAAAA,aAAaC,QAAAA,GAAG,MAAMjB,MAAMe,OAAQG,CAAAA,aAAa;AAC/CN,kBAAcE,OAAOI,YAAY,EAAE,CAAC;AAAA,EACtC,CAAC,CAAC;AAGF,QAAMC,sBAAsBC,QAAAA,WAAW,MAAuC;;AAC5E,UAAMV,YAAWV,MAAAA,MAAMU,aAANV,gBAAAA,IAAAA;AACjB,UAAMqB,SAASrB,MAAMQ,MAAMc;AAE3B,QAAI,GAACD,MAAAA,iCAAQE,kBAARF,gBAAAA,IAAuBG,WAAU,CAACd,UAAU;AAC/C,aAAO;AAAA,QAAEe,WAAWzB,MAAMQ,MAAMkB;AAAAA,MAAAA;AAAAA,IAClC;AAEA,UAAMC,cAAmC,CAAA;AACzC,SAAIN,iCAAQE,kBAAiBb,UAAU;AACrCW,aAAOE,cAAcK,QAAQpB,CAAAA,UAAS;AACpC,YAAIE,SAASF,KAAK,MAAMqB,QAAW;AACjCF,sBAAYnB,KAAK,IAAIE,SAASF,KAAK;AAAA,QACrC;AAAA,MACF,CAAC;AAAA,IACH;AAEA,WAAO;AAAA,MACLiB,WAAWzB,MAAMQ,MAAMkB;AAAAA,MACvBhB,UAAUiB;AAAAA,IAAAA;AAAAA,EAEd,CAAC;AAGD,QAAML,eAAeQ,gBAAAA,gBAAgB;AAAA,IACnCC,YAAYpB;AAAAA,IACZqB,WAAUhC,WAAMQ,MAAMc,iBAAZtB,mBAA0BiC;AAAAA,IACpCC,aAAalC,MAAMQ,MAAMc;AAAAA,IACzBa,SAASA,MAAMhB,yBAAyB;AAAA,MAAEM,WAAWzB,MAAMQ,MAAMkB;AAAAA,IAAAA;AAAAA,IACjEU,SAAS,CAAC,IAAEpC,WAAMQ,MAAMc,iBAAZtB,mBAA0BoC,YAAWjC;AAAAA,IACjDkC,WAAUrC,WAAMQ,MAAMc,iBAAZtB,mBAA0BqC;AAAAA,IACpCC,aAAYtC,WAAMQ,MAAMc,iBAAZtB,mBAA0BsC;AAAAA,IACtCC,eAAgBxB,CAAAA,UAAU;AACxBH,oBAAcG,KAAK;AACnBf,YAAMwC,SAASzB,KAAK;AAAA,IACtB;AAAA,EAAA,CACD;AAGD,QAAM0B,cAAcA,CAAC1B,UAAkB;AACrCH,kBAAcG,KAAK;AACnBf,UAAMwC,SAASzB,KAAK;AAAA,EACtB;AAGA,QAAM2B,gBAAgBA,CAACC,MAAqB;AAC1C,QAAIrB,aAAaoB,cAAcC,CAAC,GAAG;AACjC;AAAA,IACF;AAAA,EACF;AAGA,QAAMC,iBAAiBA,MAAM;AAAA;AAAA;AAAA;AAAA,MAIzB5C,MAAM6C,QACJ,sCACA,sCAAsC;AAAA;AAAA;AAI5C,QAAMC,UAAUA,MAAM,SAAS9C,MAAMQ,MAAMkB,IAAI;AAC/C,QAAMqB,UAAUA,MAAM,GAAG/C,MAAMQ,MAAMkB,IAAI;AAGzC,QAAMsB,uBAAuB5B,QAAAA,WAAW,MACtC,CAAC,QAAQ,OAAO,EAAE6B,SAASjD,MAAMQ,MAAM0C,IAAI,CAC7C;AAGA,QAAMC,mBAAmB/B,QAAAA,WAAW,MAAA;;AAClC4B,uCACAhD,MAAAA,MAAMQ,MAAMc,iBAAZtB,gBAAAA,IAA0BoC,YAC1BjC,oBAAoB0B;AAAAA,GACtB;AAEA,SAAAuB,IAAAA,gBACGC,QAAAA,MAAI;AAAA,IAAA,IAACC,OAAI;AAAA,aAAEjD,UAAAA;AAAAA,IAAW;AAAA,IAAA,IAAAkD,WAAA;AAAA,UAAAC,OAAAC,IAAAA,eAAAC,OAAA,GAAAC,SAAAH,KAAAI,YAAA,CAAAC,QAAAC,KAAA,IAAAC,IAAAA,cAAAJ,OAAAK,WAAA,GAAAC,QAAAJ,OAAAG,aAAAE,SAAAD,MAAAD,aAAA,CAAAG,QAAAC,KAAA,IAAAL,IAAAA,cAAAG,OAAAF,WAAA,GAAAK,SAAAF,OAAAH,aAAA,CAAAM,QAAAC,KAAA,IAAAR,IAAAA,cAAAM,OAAAL,WAAA;AAAAQ,iBAAAhB,MAAAJ,IAAAA,gBAGlBC,cAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAEtD,MAAMQ,MAAMiE;AAAAA,QAAK;AAAA,QAAA,IAAAlB,WAAA;AAAA,cAAAmB,QAAAjB,IAAAA,eAAAkB,OAAA,GAAAC,QAAAF,MAAAd,YAAA,CAAAiB,OAAAC,IAAA,IAAAf,IAAAA,cAAAa,MAAAZ,WAAA,GAAAe,QAAAF,MAAAb,aAAA,CAAAgB,OAAAC,KAAA,IAAAlB,IAAAA,cAAAgB,MAAAf,WAAA;AAAAQ,cAAAA,OAAAE,OAAA,MAKxB1E,MAAMQ,MAAMiE,OAAKI,OAAAC,IAAA;AAAAN,qBAAAE,OAAAtB,IAAAA,gBACjBC,cAAI;AAAA,YAAA,IAACC,OAAI;AAAA,qBAAEtD,MAAMQ,MAAM0E;AAAAA,YAAQ;AAAA,YAAA,IAAA3B,WAAA;AAAA,qBAAAE,IAAAA,eAAA0B,MAAA;AAAA,YAAA;AAAA,UAAA,CAAA,GAAAH,OAAAC,KAAA;AAAAG,cAAAA,aAAAC,IAAAA,aAAAX,OAAA,OAJ3B5B,QAAAA,CAAS,CAAA;AAAA,iBAAA4B;AAAAA,QAAA;AAAA,MAAA,CAAA,GAAAb,QAAAC,KAAA;AAAAU,iBAAAP,OAAAb,IAAAA,gBAYfC,cAAI;AAAA,QAAA,IACHC,OAAI;AAAA,iBAAEH,iBAAAA;AAAAA,QAAkB;AAAA,QAAA,IACxBmC,WAAQ;AAAA;AAAA;AAAA,aACN,MAAA;AAAA,kBAAAC,SAAA9B,IAAAA,eAAA+B,OAAA;AAAAD,qBAAAE,UAMY9C,CAAAA,MAAM3C,MAAMwC,SAASG,EAAE+C,cAAc3E,KAAK;AAACqE,kBAAAA,OAAAO,CAAAA,QAAA;AAAA,oBAAAC,QAJjD9C,WAAS+C,QACP7F,MAAMQ,MAAM0C,MAAI4C,QAChB9F,MAAMQ,MAAMkB,MAAIqE,QAGT/F,MAAMQ,MAAMwF,aAAWC,QAC1BjG,MAAMkG,UAAQC,QACdnG,MAAMQ,MAAM0E,UAAQkB,QACnBpG,MAAMQ,MAAM6F,WAASC,QACrBtG,MAAMQ,MAAM+F,WAASC,QACvBxG,MAAMQ,MAAMiG,SAAOC,QACd,CAAC,CAAC1G,MAAM6C,OAAK8D,QACT3G,MAAM6C,QAAQE,YAAYlB,QAAS+E,QAC9ChE,eAAAA;AAAgBgD,0BAAAD,IAAAhD,KAAA0C,IAAAA,aAAAE,QAAA,MAAAI,IAAAhD,IAAAiD,KAAA;AAAAC,0BAAAF,IAAAkB,KAAAxB,IAAAA,aAAAE,QAAA,QAAAI,IAAAkB,IAAAhB,KAAA;AAAAC,0BAAAH,IAAAmB,KAAAzB,IAAAA,aAAAE,QAAA,QAAAI,IAAAmB,IAAAhB,KAAA;AAAAC,0BAAAJ,IAAAoB,KAAA1B,IAAAA,aAAAE,QAAA,eAAAI,IAAAoB,IAAAhB,KAAA;AAAAE,0BAAAN,IAAAqB,KAAAC,IAAAA,YAAA1B,QAAA,YAAAI,IAAAqB,IAAAf,KAAA;AAAAE,0BAAAR,IAAAuB,KAAAD,IAAAA,YAAA1B,QAAA,YAAAI,IAAAuB,IAAAf,KAAA;AAAAC,0BAAAT,IAAAwB,KAAA9B,IAAAA,aAAAE,QAAA,aAAAI,IAAAwB,IAAAf,KAAA;AAAAE,0BAAAX,IAAAyB,KAAA/B,IAAAA,aAAAE,QAAA,aAAAI,IAAAyB,IAAAd,KAAA;AAAAE,0BAAAb,IAAA0B,KAAAhC,IAAAA,aAAAE,QAAA,WAAAI,IAAA0B,IAAAb,KAAA;AAAAE,0BAAAf,IAAA2B,KAAAjC,IAAAA,aAAAE,QAAA,gBAAAI,IAAA2B,IAAAZ,KAAA;AAAAC,0BAAAhB,IAAA4B,KAAAlC,IAAAA,aAAAE,QAAA,oBAAAI,IAAA4B,IAAAZ,KAAA;AAAAC,0BAAAjB,IAAA6B,KAAAC,IAAAA,UAAAlC,QAAAI,IAAA6B,IAAAZ,KAAA;AAAA,uBAAAjB;AAAAA,cAAA,GAAA;AAAA,gBAAAhD,GAAAd;AAAAA,gBAAAgF,GAAAhF;AAAAA,gBAAAiF,GAAAjF;AAAAA,gBAAAkF,GAAAlF;AAAAA,gBAAAmF,GAAAnF;AAAAA,gBAAAqF,GAAArF;AAAAA,gBAAAsF,GAAAtF;AAAAA,gBAAAuF,GAAAvF;AAAAA,gBAAAwF,GAAAxF;AAAAA,gBAAAyF,GAAAzF;AAAAA,gBAAA0F,GAAA1F;AAAAA,gBAAA2F,GAAA3F;AAAAA,cAAAA,CAAA;AAAAuD,kBAAAA,OAAA,MAAA6B,IAAAA,YAAA1B,iBAVhBvF,MAAMe,SAAS,EAAE,CAAA;AAAA2G,qCAAAA;AAAA,qBAAAnC;AAAAA,YAAA,GAAA;AAAA;AAAA,QAAA;AAAA,QAAA,IAAAhC,WAAA;AAAA,cAAAoE,QAAAlE,IAAAA,eAAAmE,OAAA,GAAAC,QAAAF,MAAA/D,YAAA,CAAAkE,QAAAC,KAAA,IAAAhE,IAAAA,cAAA8D,MAAA7D,WAAA,GAAAgE,QAAAF,OAAA9D,aAAAiE,SAAAD,MAAAhE,aAAA,CAAAkE,QAAAC,KAAA,IAAApE,kBAAAkE,OAAAjE,WAAA;AAAAQ,qBAAAmD,OAAAvE,IAAAA,gBAiBzBC,cAAI;AAAA,YAAA,IAACC,OAAI;AAAA,qBAAEhC,aAAa8G,iBAAiB;AAAA,YAAY;AAAA,YAAA,IAAA7E,WAAA;AAAA,qBAAAH,IAAAA,gBACnDiF,UAAAA,WAAS;AAAA,gBAAA,IACRtG,aAAU;AAAA,yBAAEpB,WAAAA;AAAAA,gBAAY;AAAA,gBAAA,IACxB2H,YAAS;AAAA,yBAAEhH,aAAagH,UAAAA;AAAAA,gBAAW;AAAA,gBAAA,IACnCC,UAAO;AAAA,yBAAEjH,aAAakH,OAAAA;AAAAA,gBAAQ;AAAA,gBAAA,IAC9BC,WAAQ;AAAA,yBACNC,IAAAA,KAAA,MAAA,CAAA,CAAApH,aAAagH,WAAW,EAAA,IAAGrI,QAAQ0I,0BAA0B9G;AAAAA,gBAAS;AAAA,gBAAA,IAExE+G,YAAS;AAAA,yBAAEtH,aAAasH,UAAAA;AAAAA,gBAAW;AAAA,cAAA,CAAA;AAAA,YAAA;AAAA,UAAA,CAAA,GAAAd,QAAAC,KAAA;AAAAC,gBAAAa,iBAAA,SAe5B,MAAM;;AACb,gBAAIlI,aAAaa,aAAWxB,MAAAA,MAAMQ,MAAMc,iBAAZtB,gBAAAA,IAA0BqC,aAAY,IAAI;AACpEf,2BAAawH,KAAAA;AAAAA,YACf;AAAA,UACF,CAAC;AAAAd,gBAAAa,iBAAA,QARO,MAAM;AAEZE,uBAAW,MAAMzH,aAAa0H,QAAAA,GAAW,GAAG;AAAA,UAC9C,CAAC;AAAAhB,gBAAAiB,YAJUvG;AAAasF,gBAAAvC,UADd9C,CAAAA,MAAMF,YAAYE,EAAE+C,cAAc3E,KAAK;AAACyD,qBAAAmD,OAAAvE,IAAAA,gBA+BnDC,cAAI;AAAA,YAAA,IAACC,OAAI;AAAA,qBAAEhC,aAAa8G,iBAAiB;AAAA,YAAS;AAAA,YAAA,IAAA7E,WAAA;AAAA,qBAAAH,IAAAA,gBAChD8F,qBAAAA,sBAAoB;AAAA,gBAAA,IACnBC,UAAO;AAAA,yBAAE7H,aAAa6H,QAAAA;AAAAA,gBAAS;AAAA,gBAAA,IAC/BC,gBAAa;AAAA,yBAAE9H,aAAa8H,cAAAA;AAAAA,gBAAe;AAAA,gBAAA,IAC3CZ,SAAM;AAAA,yBAAElH,aAAakH,OAAAA;AAAAA,gBAAQ;AAAA,gBAAA,IAC7BI,YAAS;AAAA,yBAAEtH,aAAasH,UAAAA;AAAAA,gBAAW;AAAA,gBACnCS,UAAWC,CAAAA,WAAW;AACpB7G,8BAAY6G,OAAOvI,KAAK;AACxBO,+BAAa0H,QAAAA;AAAAA,gBACf;AAAA,gBACAO,SAAUC,CAAAA,WAAW;AAAA,gBACnB;AAAA,gBACD,IACDC,iBAAc;AAAA,yBAAE9I,WAAAA;AAAAA,gBAAY;AAAA,gBAAA,IAC5B+I,iBAAc;;AAAA,0BAAE1J,MAAAA,MAAMQ,MAAMc,iBAAZtB,gBAAAA,IAA0B2J;AAAAA,gBAAkB;AAAA,cAAA,CAAA;AAAA,YAAA;AAAA,UAAA,CAAA,GAAAzB,QAAAC,KAAA;AAAA/C,cAAAA,OAAAO,CAAAA,QAAA;AAAA,gBAAAiE,MAjD1D9G,QAAAA,GAAS+G,OACP7J,MAAMQ,MAAM0C,MAAI4G,OAChB9J,MAAMQ,MAAMkB,MAAIqI,OAaT/J,MAAMQ,MAAMwF,aAAWgE,OAC1BhK,MAAMkG,UAAQ+D,OACdjK,MAAMQ,MAAM0E,UAAQgF,OACnBlK,MAAMQ,MAAM6F,WAAS8D,OACrBnK,MAAMQ,MAAM+F,WAAS6D,OACvBpK,MAAMQ,MAAMiG,SAAO4D,OACd,CAAC,CAACrK,MAAM6C,OAAKyH,OACTtK,MAAM6C,QAAQE,QAAAA,IAAYlB,QAAS0I,QAEtCjJ,aAAakH,OAAAA,GAAQgC,QAE7B,GAAG5H,eAAAA,CAAgB,IAAItB,aAAa8G,WAAAA,MAAiB,eAAe,mBAAmB,EAAE;AAAEwB,oBAAAjE,IAAAhD,KAAA0C,IAAAA,aAAA2C,OAAA,MAAArC,IAAAhD,IAAAiH,GAAA;AAAAC,qBAAAlE,IAAAkB,KAAAxB,IAAAA,aAAA2C,OAAA,QAAArC,IAAAkB,IAAAgD,IAAA;AAAAC,qBAAAnE,IAAAmB,KAAAzB,IAAAA,aAAA2C,OAAA,QAAArC,IAAAmB,IAAAgD,IAAA;AAAAC,qBAAApE,IAAAoB,KAAA1B,IAAAA,aAAA2C,OAAA,eAAArC,IAAAoB,IAAAgD,IAAA;AAAAC,qBAAArE,IAAAqB,KAAAC,IAAAA,YAAAe,OAAA,YAAArC,IAAAqB,IAAAgD,IAAA;AAAAC,qBAAAtE,IAAAuB,KAAAD,IAAAA,YAAAe,OAAA,YAAArC,IAAAuB,IAAA+C,IAAA;AAAAC,qBAAAvE,IAAAwB,KAAA9B,IAAAA,aAAA2C,OAAA,aAAArC,IAAAwB,IAAA+C,IAAA;AAAAC,qBAAAxE,IAAAyB,KAAA/B,IAAAA,aAAA2C,OAAA,aAAArC,IAAAyB,IAAA+C,IAAA;AAAAC,qBAAAzE,IAAA0B,KAAAhC,IAAAA,aAAA2C,OAAA,WAAArC,IAAA0B,IAAA+C,IAAA;AAAAC,qBAAA1E,IAAA2B,KAAAjC,IAAAA,aAAA2C,OAAA,gBAAArC,IAAA2B,IAAA+C,IAAA;AAAAC,qBAAA3E,IAAA4B,KAAAlC,IAAAA,aAAA2C,OAAA,oBAAArC,IAAA4B,IAAA+C,IAAA;AAAAC,sBAAA5E,IAAA6B,KAAAnC,IAAAA,aAAA2C,OAAA,iBAAArC,IAAA6B,IAAA+C,KAAA;AAAAC,sBAAA7E,IAAA8E,KAAAhD,IAAAA,UAAAO,OAAArC,IAAA8E,IAAAD,KAAA;AAAA,mBAAA7E;AAAAA,UAAA,GAAA;AAAA,YAAAhD,GAAAd;AAAAA,YAAAgF,GAAAhF;AAAAA,YAAAiF,GAAAjF;AAAAA,YAAAkF,GAAAlF;AAAAA,YAAAmF,GAAAnF;AAAAA,YAAAqF,GAAArF;AAAAA,YAAAsF,GAAAtF;AAAAA,YAAAuF,GAAAvF;AAAAA,YAAAwF,GAAAxF;AAAAA,YAAAyF,GAAAzF;AAAAA,YAAA0F,GAAA1F;AAAAA,YAAA2F,GAAA3F;AAAAA,YAAA4I,GAAA5I;AAAAA,UAAAA,CAAA;AAAAuD,cAAAA,aAAA6B,IAAAA,YAAAe,OAAA,SAvB3FrH,WAAAA,CAAY,CAAA;AAAA+G,iCAAAA;AAAA,iBAAAC;AAAAA,QAAA;AAAA,MAAA,CAAA,CAAA;AAAAnD,iBAAAhB,MAAAJ,IAAAA,gBAsD1BC,cAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAEoF,IAAAA,KAAA,MAAA,CAAA,CAAA1I,MAAMQ,MAAMkK,QAAQ,EAAA,KAAI,CAAC1K,MAAM6C;AAAAA,QAAK;AAAA,QAAA,IAAAU,WAAA;AAAA,cAAAoH,SAAAlH,IAAAA,eAAAmH,OAAA;AAAApG,cAAAA,OAAAmG,QAAA,MAE3C3K,MAAMQ,MAAMkK,QAAQ;AAAA,iBAAAC;AAAAA,QAAA;AAAA,MAAA,CAAA,GAAAxG,QAAAC,KAAA;AAAAI,iBAAAhB,MAAAJ,IAAAA,gBAKxBC,cAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAEtD,MAAM6C;AAAAA,QAAK;AAAA,QAAA,IAAAU,WAAA;AAAA,cAAAsH,SAAApH,IAAAA,eAAAqH,OAAA;AAAAtG,cAAAA,OAAAqG,QAAA,MAElB7K,MAAM6C,KAAK;AAAAuC,cAAAA,aAAAC,IAAAA,aAAAwF,QAAA,MADP9H,QAAAA,CAAS,CAAA;AAAA,iBAAA8H;AAAAA,QAAA;AAAA,MAAA,CAAA,GAAAvG,QAAAC,KAAA;AAAA,aAAAf;AAAAA,IAAA;AAAA,EAAA,CAAA;AAO1B;AAEoCuH,IAAAA,eAAA,CAAA,SAAA,SAAA,CAAA;;"}

package/dist/components/AutocompleteFormField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteFormField.d.ts","sourceRoot":"","sources":["../../src/components/AutocompleteFormField.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,SAAS,EAAkC,QAAQ,EAAoB,MAAM,UAAU,CAAA;AAChG,OAAO,KAAK,EAAE,eAAe,EAAE,uBAAuB,EAAuB,MAAM,UAAU,CAAA;AAO7F;;GAEG;AACH,MAAM,WAAW,2BAA4B,SAAQ,eAAe;IAClE;;OAEG;IACH,YAAY,CAAC,EAAE,uBAAuB,CAAA;CACvC;AAED;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACzC;;OAEG;IACH,KAAK,EAAE,2BAA2B,CAAA;IAElC;;OAEG;IACH,KAAK,EAAE,GAAG,CAAA;IAEV;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd;;OAEG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAA;IAE9B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB;;OAEG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAA;CACzC;AAED;;GAEG;AACH,eAAO,MAAM,qBAAqB,EAAE,SAAS,CAAC,0BAA0B,CA8NvE,CAAA;AAED,eAAe,qBAAqB,CAAA"}
+{"version":3,"file":"AutocompleteFormField.d.ts","sourceRoot":"","sources":["../../src/components/AutocompleteFormField.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,SAAS,EAAkC,QAAQ,EAAoB,MAAM,UAAU,CAAA;AAChG,OAAO,KAAK,EAAE,eAAe,EAAE,uBAAuB,EAAuB,MAAM,UAAU,CAAA;AAQ7F;;GAEG;AACH,MAAM,WAAW,2BAA4B,SAAQ,eAAe;IAClE;;OAEG;IACH,YAAY,CAAC,EAAE,uBAAuB,CAAA;CACvC;AAED;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACzC;;OAEG;IACH,KAAK,EAAE,2BAA2B,CAAA;IAElC;;OAEG;IACH,KAAK,EAAE,GAAG,CAAA;IAEV;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd;;OAEG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAA;IAE9B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB;;OAEG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAA;CACzC;AAED;;GAEG;AACH,eAAO,MAAM,qBAAqB,EAAE,SAAS,CAAC,0BAA0B,CAiOvE,CAAA;AAED,eAAe,qBAAqB,CAAA"}

package/dist/components/AutocompleteFormField.js

@@ -1,13 +1,15 @@
-import { createComponent, getNextElement, getNextMarker, insert, effect, setAttribute, setProperty, className, runHydrationEvents, memo, template, delegateEvents } from "solid-js/web";
+import { createComponent, getNextElement, getNextMarker, insert, effect, setAttribute, memo, setProperty, className, runHydrationEvents, template, delegateEvents } from "solid-js/web";
 import { createSignal, createEffect, on, createMemo, Show } from "solid-js";
 import { useConditionalField } from "../hooks/useConditionalField.js";
 import { useAutocomplete } from "../hooks/useAutocomplete.js";
 import { useAutocompleteContextSafe } from "../context/AutocompleteContext.js";
+import { useMCPUIStrings } from "../context/MCPUIStringsContext.js";
 import { GhostText } from "./GhostText.js";
 import { AutocompleteDropdown } from "./AutocompleteDropdown.js";
 var _tmpl$ = /* @__PURE__ */ template(`<span class="text-red-500 ml-1"aria-hidden=true>*`), _tmpl$2 = /* @__PURE__ */ template(`<label class="block text-sm font-medium text-gray-700 dark:text-gray-300"><!$><!/><!$><!/>`), _tmpl$3 = /* @__PURE__ */ template(`<div class=relative><!$><!/><input aria-autocomplete=list aria-haspopup=listbox autocomplete=off style=position:relative;z-index:2><!$><!/>`), _tmpl$4 = /* @__PURE__ */ template(`<p class="text-xs text-gray-500 dark:text-gray-400">`), _tmpl$5 = /* @__PURE__ */ template(`<p role=alert class="text-xs text-red-600 dark:text-red-400">`), _tmpl$6 = /* @__PURE__ */ template(`<div class=space-y-1><!$><!/><div class=relative></div><!$><!/><!$><!/>`), _tmpl$7 = /* @__PURE__ */ template(`<input>`);
 const AutocompleteFormField = (props) => {
   var _a, _b, _c, _d;
+  const strings = useMCPUIStrings();
   const autocompleteCtx = useAutocompleteContextSafe();
   const {
     isVisible
@@ -167,7 +169,7 @@ const AutocompleteFormField = (props) => {
                   return autocomplete.isOpen();
                 },
                 get hintText() {
-                  return autocomplete.ghostText() ? "Tab to accept" : void 0;
+                  return memo(() => !!autocomplete.ghostText())() ? strings.autocompleteTabToAccept : void 0;
                 },
                 get isLoading() {
                   return autocomplete.isLoading();