@seed-ship/mcp-ui-solid 2.0.0 → 2.1.0

package/README.md

@@ -5,6 +5,55 @@ SolidJS components for rendering MCP-generated UI resources. Part of the MCP UI
 [![npm version](https://img.shields.io/npm/v/@seed-ship/mcp-ui-solid.svg)](https://www.npmjs.com/package/@seed-ship/mcp-ui-solid)
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
 
+## What's New in v2.0.0
+
+### Highlights
+
+- **Configurable Iframe Whitelist** - Control iframe security with `IframePolicy`: `strict`, `extend`, or `allow-all`
+- **60+ Whitelisted Domains** - Expanded default whitelist for business use cases
+- **New Component Types** - Forms, Modals, Action Groups, Image Gallery, Video, Code, Map
+- **Table Virtualization** - Handle 10,000+ rows with smooth scrolling
+- **Map Clustering** - Auto-cluster markers for large datasets
+- **Native Chart.js Support** - Optional direct Chart.js rendering (no iframe)
+
+### Configurable Iframe Security
+
+```typescript
+import { validateComponent, DEFAULT_IFRAME_DOMAINS } from '@seed-ship/mcp-ui-solid'
+
+// Default: strict whitelist
+validateComponent(component)
+
+// Extend whitelist with custom domains
+validateComponent(component, {
+  iframePolicy: 'extend',
+  customIframeDomains: ['my-trusted-site.com']
+})
+
+// Disable whitelist (use with caution)
+validateComponent(component, { iframePolicy: 'allow-all' })
+
+// View default whitelist
+console.log(DEFAULT_IFRAME_DOMAINS)
+```
+
+### Whitelisted Domains (v2.0.0)
+
+| Category | Domains |
+|----------|---------|
+| **Video** | youtube.com, vimeo.com, loom.com, cloudflarestream.com, streamable.com |
+| **Diagrams** | mermaid.live, excalidraw.com, lucidchart.com, figma.com, miro.com |
+| **Code** | github.com, gitlab.com, codepen.io, codesandbox.io, stackblitz.com, replit.com |
+| **Google** | docs, sheets, slides, drive, maps, datastudio, lookerstudio |
+| **Business** | notion.so, airtable.com, calendly.com, typeform.com, cal.com |
+| **Analytics** | tableau.com, powerbi.com, observablehq.com |
+| **Design** | canva.com, figma.com |
+| **Maps** | maps.google.com, openstreetmap.org |
+| **Previews** | vercel.app, netlify.app |
+| **E-commerce** | amazon.com, amazon.fr, amazon.de, amazon.co.uk, etc. |
+
+---
+
 ## Overview
 
 `@seed-ship/mcp-ui-solid` provides a complete rendering solution for MCP (Model Context Protocol) generated UIs. It enables AI/LLM systems to generate structured, interactive dashboards that are rendered with SolidJS.
@@ -389,7 +438,7 @@ function CustomStreaming() {
 
 This package follows [Semantic Versioning](https://semver.org/). See [CHANGELOG.md](./CHANGELOG.md) for release notes.
 
-**Current Version:** 1.0.43
+**Current Version:** 2.0.1
 
 ## License
 

package/dist/components/AutocompleteDropdown.cjs

@@ -0,0 +1,201 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const web = require("solid-js/web");
+const solidJs = require("solid-js");
+var _tmpl$ = /* @__PURE__ */ web.template(`<strong class=mcp-autocomplete-highlight>`), _tmpl$2 = /* @__PURE__ */ web.template(`<span class=mcp-autocomplete-option-icon>`), _tmpl$3 = /* @__PURE__ */ web.template(`<span class=mcp-autocomplete-option-description>`), _tmpl$4 = /* @__PURE__ */ web.template(`<div class=mcp-autocomplete-option-content><!$><!/><div class=mcp-autocomplete-option-text><span class=mcp-autocomplete-option-label></span><!$><!/>`), _tmpl$5 = /* @__PURE__ */ web.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__ */ web.template(`<div class=mcp-autocomplete-empty style="padding:12px 16px;color:#9ca3af;font-size:0.875rem;text-align:center">`), _tmpl$7 = /* @__PURE__ */ web.template(`<ul class=mcp-autocomplete-options style="margin:0;padding:4px 0;list-style:none">`), _tmpl$8 = /* @__PURE__ */ web.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__ */ web.template(`<div role=listbox aria-label=Suggestions><!$><!/><!$><!/><!$><!/><!$><!/>`), _tmpl$0 = /* @__PURE__ */ web.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;
+  }
+  const lowerText = text.toLowerCase();
+  const lowerMatch = match.toLowerCase();
+  const startIndex = lowerText.indexOf(lowerMatch);
+  if (startIndex === -1) {
+    return text;
+  }
+  const before = text.slice(0, startIndex);
+  const matched = text.slice(startIndex, startIndex + match.length);
+  const after = text.slice(startIndex + match.length);
+  return [before, (() => {
+    var _el$ = web.getNextElement(_tmpl$);
+    web.insert(_el$, matched);
+    return _el$;
+  })(), after];
+}
+const DefaultOptionRenderer = (props) => {
+  const displayLabel = solidJs.createMemo(() => props.option.label || props.option.value);
+  return (() => {
+    var _el$2 = web.getNextElement(_tmpl$4), _el$9 = _el$2.firstChild, [_el$0, _co$2] = web.getNextMarker(_el$9.nextSibling), _el$4 = _el$0.nextSibling, _el$5 = _el$4.firstChild, _el$7 = _el$5.nextSibling, [_el$8, _co$] = web.getNextMarker(_el$7.nextSibling);
+    web.insert(_el$2, web.createComponent(solidJs.Show, {
+      get when() {
+        return props.option.icon;
+      },
+      get children() {
+        var _el$3 = web.getNextElement(_tmpl$2);
+        web.insert(_el$3, () => props.option.icon);
+        return _el$3;
+      }
+    }), _el$0, _co$2);
+    web.insert(_el$5, () => highlightText(displayLabel(), props.highlightMatch));
+    web.insert(_el$4, web.createComponent(solidJs.Show, {
+      get when() {
+        return props.option.description;
+      },
+      get children() {
+        var _el$6 = web.getNextElement(_tmpl$3);
+        web.insert(_el$6, () => props.option.description);
+        return _el$6;
+      }
+    }), _el$8, _co$);
+    return _el$2;
+  })();
+};
+const AutocompleteDropdown = (props) => {
+  const positionStyles = solidJs.createMemo(() => {
+    if (props.position === "top") {
+      return {
+        bottom: "100%",
+        "margin-bottom": "4px"
+      };
+    }
+    return {
+      top: "100%",
+      "margin-top": "4px"
+    };
+  });
+  const containerStyles = solidJs.createMemo(() => ({
+    position: "absolute",
+    left: "0",
+    right: "0",
+    "z-index": "50",
+    "background-color": "#ffffff",
+    border: "1px solid #e5e7eb",
+    "border-radius": "6px",
+    "box-shadow": "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
+    "max-height": props.maxHeight || "240px",
+    overflow: "auto",
+    ...positionStyles()
+  }));
+  return web.createComponent(solidJs.Show, {
+    get when() {
+      return props.isOpen;
+    },
+    get children() {
+      var _el$1 = web.getNextElement(_tmpl$9), _el$24 = _el$1.firstChild, [_el$25, _co$4] = web.getNextMarker(_el$24.nextSibling), _el$26 = _el$25.nextSibling, [_el$27, _co$5] = web.getNextMarker(_el$26.nextSibling), _el$28 = _el$27.nextSibling, [_el$29, _co$6] = web.getNextMarker(_el$28.nextSibling), _el$30 = _el$29.nextSibling, [_el$31, _co$7] = web.getNextMarker(_el$30.nextSibling);
+      web.insert(_el$1, web.createComponent(solidJs.Show, {
+        get when() {
+          return props.isLoading;
+        },
+        get children() {
+          var _el$10 = web.getNextElement(_tmpl$5), _el$11 = _el$10.firstChild, _el$12 = _el$11.nextSibling, [_el$13, _co$3] = web.getNextMarker(_el$12.nextSibling);
+          web.insert(_el$10, () => props.loadingMessage || "Loading...", _el$13, _co$3);
+          return _el$10;
+        }
+      }), _el$25, _co$4);
+      web.insert(_el$1, web.createComponent(solidJs.Show, {
+        get when() {
+          return web.memo(() => !!!props.isLoading)() && props.options.length === 0;
+        },
+        get children() {
+          var _el$14 = web.getNextElement(_tmpl$6);
+          web.insert(_el$14, () => props.emptyMessage || "No suggestions found");
+          return _el$14;
+        }
+      }), _el$27, _co$5);
+      web.insert(_el$1, web.createComponent(solidJs.Show, {
+        get when() {
+          return web.memo(() => !!!props.isLoading)() && props.options.length > 0;
+        },
+        get children() {
+          var _el$15 = web.getNextElement(_tmpl$7);
+          web.insert(_el$15, web.createComponent(solidJs.For, {
+            get each() {
+              return props.options;
+            },
+            children: (option, index) => {
+              const isSelected = () => index() === props.selectedIndex;
+              const isDisabled = () => option.disabled;
+              return (() => {
+                var _el$32 = web.getNextElement(_tmpl$0);
+                _el$32.addEventListener("mouseenter", () => {
+                  var _a;
+                  if (!isDisabled()) {
+                    (_a = props.onHover) == null ? void 0 : _a.call(props, index());
+                  }
+                });
+                _el$32.$$click = () => {
+                  if (!isDisabled()) {
+                    props.onSelect(option);
+                  }
+                };
+                web.insert(_el$32, web.createComponent(solidJs.Show, {
+                  get when() {
+                    return props.renderOption;
+                  },
+                  get fallback() {
+                    return web.createComponent(DefaultOptionRenderer, {
+                      option,
+                      get isSelected() {
+                        return isSelected();
+                      },
+                      get highlightMatch() {
+                        return props.highlightMatch;
+                      }
+                    });
+                  },
+                  get children() {
+                    return props.renderOption(option, isSelected());
+                  }
+                }));
+                web.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 && web.setAttribute(_el$32, "aria-selected", _p$.e = _v$3);
+                  _v$4 !== _p$.t && web.setAttribute(_el$32, "aria-disabled", _p$.t = _v$4);
+                  _v$5 !== _p$.a && web.className(_el$32, _p$.a = _v$5);
+                  _v$6 !== _p$.o && web.setStyleProperty(_el$32, "cursor", _p$.o = _v$6);
+                  _v$7 !== _p$.i && web.setStyleProperty(_el$32, "background-color", _p$.i = _v$7);
+                  _v$8 !== _p$.n && web.setStyleProperty(_el$32, "color", _p$.n = _v$8);
+                  return _p$;
+                }, {
+                  e: void 0,
+                  t: void 0,
+                  a: void 0,
+                  o: void 0,
+                  i: void 0,
+                  n: void 0
+                });
+                web.runHydrationEvents();
+                return _el$32;
+              })();
+            }
+          }));
+          return _el$15;
+        }
+      }), _el$29, _co$6);
+      web.insert(_el$1, web.createComponent(solidJs.Show, {
+        get when() {
+          return web.memo(() => !!!props.isLoading)() && props.options.length > 0;
+        },
+        get children() {
+          var _el$16 = web.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;
+          return _el$16;
+        }
+      }), _el$31, _co$7);
+      web.effect((_p$) => {
+        var _v$ = `mcp-autocomplete-dropdown ${props.class || ""}`, _v$2 = containerStyles();
+        _v$ !== _p$.e && web.className(_el$1, _p$.e = _v$);
+        _p$.t = web.style(_el$1, _v$2, _p$.t);
+        return _p$;
+      }, {
+        e: void 0,
+        t: void 0
+      });
+      return _el$1;
+    }
+  });
+};
+web.delegateEvents(["click"]);
+exports.AutocompleteDropdown = AutocompleteDropdown;
+exports.default = AutocompleteDropdown;
+//# sourceMappingURL=AutocompleteDropdown.cjs.map

package/dist/components/AutocompleteDropdown.cjs.map

@@ -0,0 +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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"}

package/dist/components/AutocompleteDropdown.d.ts

@@ -0,0 +1,71 @@
+/**
+ * AutocompleteDropdown Component
+ * Displays data-driven dropdown suggestions
+ *
+ * Sprint Autocomplete Feature
+ */
+import { Component, JSX } from 'solid-js';
+import type { AutocompleteOption } from '../types';
+/**
+ * Props for AutocompleteDropdown
+ */
+export interface AutocompleteDropdownProps {
+    /**
+     * Options to display
+     */
+    options: AutocompleteOption[];
+    /**
+     * Currently selected index
+     */
+    selectedIndex: number;
+    /**
+     * Whether dropdown is visible
+     */
+    isOpen: boolean;
+    /**
+     * Callback when option is selected
+     */
+    onSelect: (option: AutocompleteOption) => void;
+    /**
+     * Callback when option is hovered
+     */
+    onHover?: (index: number) => void;
+    /**
+     * Whether loading
+     */
+    isLoading?: boolean;
+    /**
+     * Custom class
+     */
+    class?: string;
+    /**
+     * Max height
+     */
+    maxHeight?: string;
+    /**
+     * Empty state message
+     */
+    emptyMessage?: string;
+    /**
+     * Loading message
+     */
+    loadingMessage?: string;
+    /**
+     * Highlight matching text in options
+     */
+    highlightMatch?: string;
+    /**
+     * Position (default: 'bottom')
+     */
+    position?: 'top' | 'bottom';
+    /**
+     * Custom option renderer
+     */
+    renderOption?: (option: AutocompleteOption, isSelected: boolean) => JSX.Element;
+}
+/**
+ * AutocompleteDropdown Component
+ */
+export declare const AutocompleteDropdown: Component<AutocompleteDropdownProps>;
+export default AutocompleteDropdown;
+//# sourceMappingURL=AutocompleteDropdown.d.ts.map

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

@@ -0,0 +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"}

package/dist/components/AutocompleteDropdown.js

@@ -0,0 +1,201 @@
+import { delegateEvents, createComponent, getNextElement, template, getNextMarker, insert, memo, effect, setAttribute, className, setStyleProperty, runHydrationEvents, style } 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">`);
+function highlightText(text, match) {
+  if (!match || !text) {
+    return text;
+  }
+  const lowerText = text.toLowerCase();
+  const lowerMatch = match.toLowerCase();
+  const startIndex = lowerText.indexOf(lowerMatch);
+  if (startIndex === -1) {
+    return text;
+  }
+  const before = text.slice(0, startIndex);
+  const matched = text.slice(startIndex, startIndex + match.length);
+  const after = text.slice(startIndex + match.length);
+  return [before, (() => {
+    var _el$ = getNextElement(_tmpl$);
+    insert(_el$, matched);
+    return _el$;
+  })(), after];
+}
+const DefaultOptionRenderer = (props) => {
+  const displayLabel = createMemo(() => props.option.label || props.option.value);
+  return (() => {
+    var _el$2 = getNextElement(_tmpl$4), _el$9 = _el$2.firstChild, [_el$0, _co$2] = getNextMarker(_el$9.nextSibling), _el$4 = _el$0.nextSibling, _el$5 = _el$4.firstChild, _el$7 = _el$5.nextSibling, [_el$8, _co$] = getNextMarker(_el$7.nextSibling);
+    insert(_el$2, createComponent(Show, {
+      get when() {
+        return props.option.icon;
+      },
+      get children() {
+        var _el$3 = getNextElement(_tmpl$2);
+        insert(_el$3, () => props.option.icon);
+        return _el$3;
+      }
+    }), _el$0, _co$2);
+    insert(_el$5, () => highlightText(displayLabel(), props.highlightMatch));
+    insert(_el$4, createComponent(Show, {
+      get when() {
+        return props.option.description;
+      },
+      get children() {
+        var _el$6 = getNextElement(_tmpl$3);
+        insert(_el$6, () => props.option.description);
+        return _el$6;
+      }
+    }), _el$8, _co$);
+    return _el$2;
+  })();
+};
+const AutocompleteDropdown = (props) => {
+  const positionStyles = createMemo(() => {
+    if (props.position === "top") {
+      return {
+        bottom: "100%",
+        "margin-bottom": "4px"
+      };
+    }
+    return {
+      top: "100%",
+      "margin-top": "4px"
+    };
+  });
+  const containerStyles = createMemo(() => ({
+    position: "absolute",
+    left: "0",
+    right: "0",
+    "z-index": "50",
+    "background-color": "#ffffff",
+    border: "1px solid #e5e7eb",
+    "border-radius": "6px",
+    "box-shadow": "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
+    "max-height": props.maxHeight || "240px",
+    overflow: "auto",
+    ...positionStyles()
+  }));
+  return createComponent(Show, {
+    get when() {
+      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);
+      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);
+          return _el$10;
+        }
+      }), _el$25, _co$4);
+      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");
+          return _el$14;
+        }
+      }), _el$27, _co$5);
+      insert(_el$1, createComponent(Show, {
+        get when() {
+          return memo(() => !!!props.isLoading)() && props.options.length > 0;
+        },
+        get children() {
+          var _el$15 = getNextElement(_tmpl$7);
+          insert(_el$15, createComponent(For, {
+            get each() {
+              return props.options;
+            },
+            children: (option, index) => {
+              const isSelected = () => index() === props.selectedIndex;
+              const isDisabled = () => option.disabled;
+              return (() => {
+                var _el$32 = getNextElement(_tmpl$0);
+                _el$32.addEventListener("mouseenter", () => {
+                  var _a;
+                  if (!isDisabled()) {
+                    (_a = props.onHover) == null ? void 0 : _a.call(props, index());
+                  }
+                });
+                _el$32.$$click = () => {
+                  if (!isDisabled()) {
+                    props.onSelect(option);
+                  }
+                };
+                insert(_el$32, createComponent(Show, {
+                  get when() {
+                    return props.renderOption;
+                  },
+                  get fallback() {
+                    return createComponent(DefaultOptionRenderer, {
+                      option,
+                      get isSelected() {
+                        return isSelected();
+                      },
+                      get highlightMatch() {
+                        return props.highlightMatch;
+                      }
+                    });
+                  },
+                  get children() {
+                    return props.renderOption(option, isSelected());
+                  }
+                }));
+                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);
+                  return _p$;
+                }, {
+                  e: void 0,
+                  t: void 0,
+                  a: void 0,
+                  o: void 0,
+                  i: void 0,
+                  n: void 0
+                });
+                runHydrationEvents();
+                return _el$32;
+              })();
+            }
+          }));
+          return _el$15;
+        }
+      }), _el$29, _co$6);
+      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;
+          return _el$16;
+        }
+      }), _el$31, _co$7);
+      effect((_p$) => {
+        var _v$ = `mcp-autocomplete-dropdown ${props.class || ""}`, _v$2 = containerStyles();
+        _v$ !== _p$.e && className(_el$1, _p$.e = _v$);
+        _p$.t = style(_el$1, _v$2, _p$.t);
+        return _p$;
+      }, {
+        e: void 0,
+        t: void 0
+      });
+      return _el$1;
+    }
+  });
+};
+delegateEvents(["click"]);
+export {
+  AutocompleteDropdown,
+  AutocompleteDropdown as default
+};
+//# sourceMappingURL=AutocompleteDropdown.js.map

package/dist/components/AutocompleteDropdown.js.map

@@ -0,0 +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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"}