@salt-ds/lab 1.0.0-alpha.2 → 1.0.0-alpha.20

package/dist-cjs/query-input/internal/SearchList.js

@@ -0,0 +1,75 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var core = require('@salt-ds/core');
+require('../../list/Highlighter.js');
+var ListItem = require('../../list/ListItem.js');
+var List = require('../../list/List.js');
+var ListItemGroup = require('../../list/ListItemGroup.js');
+require('../../common-hooks/collectionProvider.js');
+require('../../common-hooks/keyUtils.js');
+require('../../responsive/useResizeObserver.js');
+require('../../list/VirtualizedList.js');
+var window = require('@salt-ds/window');
+var styles = require('@salt-ds/styles');
+var QueryInput = require('../QueryInput.css.js');
+
+const withBaseName = core.makePrefixer("saltQueryInputSearchList");
+function itemToString(item) {
+  return [item.category, item.value].join(": ");
+}
+function SearchList(props) {
+  const {
+    inputValue,
+    selectedItems,
+    onChange: onChangeProp,
+    rootWidth,
+    highlightedIndex,
+    setHighlightedIndex,
+    visibleCategories
+  } = props;
+  const targetWindow = window.useWindow();
+  styles.useComponentCssInjection({
+    testId: "salt-query-input",
+    css: QueryInput,
+    window: targetWindow
+  });
+  const onChange = React.useCallback(
+    (event, items) => {
+      onChangeProp(items || []);
+    },
+    [onChangeProp]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs(List.List, {
+    checkable: false,
+    "data-testid": "search-list",
+    highlightedIndex,
+    itemTextHighlightPattern: inputValue,
+    itemToString,
+    onHighlight: setHighlightedIndex,
+    onSelectionChange: onChange,
+    selectionStrategy: "multiple",
+    selected: selectedItems,
+    width: rootWidth,
+    children: [
+      visibleCategories.map((inputCategory) => {
+        return /* @__PURE__ */ jsxRuntime.jsx(ListItemGroup.ListItemGroup, {
+          label: inputCategory.name,
+          children: inputCategory.values.map((label) => /* @__PURE__ */ jsxRuntime.jsx(ListItem.ListItem, {
+            label
+          }, label))
+        }, inputCategory.name);
+      }),
+      /* @__PURE__ */ jsxRuntime.jsx(ListItem.ListItem, {
+        className: withBaseName("addKeyword"),
+        children: `Add keyword: "${inputValue}"`
+      })
+    ]
+  });
+}
+
+exports.SearchList = SearchList;
+//# sourceMappingURL=SearchList.js.map

package/dist-cjs/query-input/internal/SearchList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchList.js","sources":["../src/query-input/internal/SearchList.tsx"],"sourcesContent":["import { Dispatch, SetStateAction, useCallback } from \"react\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { List, ListItem, ListItemGroup } from \"../../list\";\n\nimport { SelectionChangeHandler } from \"../../common-hooks\";\n\nimport { QueryInputCategory, QueryInputItem } from \"../queryInputTypes\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport queryInputCss from \"../QueryInput.css\";\n\nconst withBaseName = makePrefixer(\"saltQueryInputSearchList\");\n\nexport interface SearchListProps {\n  inputValue?: string;\n  selectedItems?: QueryInputItem[];\n  onChange: (items: QueryInputItem[]) => void;\n  rootWidth: number;\n  highlightedIndex?: number;\n  visibleCategories: QueryInputCategory[];\n  setHighlightedIndex: Dispatch<SetStateAction<number>>;\n}\n\nfunction itemToString(item: QueryInputItem) {\n  return [item.category, item.value].join(\": \");\n}\n\nexport function SearchList(props: SearchListProps) {\n  const {\n    inputValue,\n    selectedItems,\n    onChange: onChangeProp,\n    rootWidth,\n    highlightedIndex,\n    setHighlightedIndex,\n    visibleCategories,\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-query-input\",\n    css: queryInputCss,\n    window: targetWindow,\n  });\n\n  const onChange: SelectionChangeHandler<QueryInputItem, \"multiple\"> =\n    useCallback(\n      (event, items) => {\n        onChangeProp(items || []);\n      },\n      [onChangeProp]\n    );\n\n  return (\n    <List\n      checkable={false}\n      data-testid=\"search-list\"\n      highlightedIndex={highlightedIndex}\n      itemTextHighlightPattern={inputValue}\n      itemToString={itemToString}\n      onHighlight={setHighlightedIndex}\n      onSelectionChange={onChange}\n      selectionStrategy=\"multiple\"\n      selected={selectedItems}\n      width={rootWidth}\n    >\n      {visibleCategories.map((inputCategory: QueryInputCategory) => {\n        return (\n          <ListItemGroup key={inputCategory.name} label={inputCategory.name}>\n            {inputCategory.values.map((label) => (\n              <ListItem key={label} label={label} />\n            ))}\n          </ListItemGroup>\n        );\n      })}\n      <ListItem className={withBaseName(\"addKeyword\")}>\n        {`Add keyword: \"${inputValue}\"`}\n      </ListItem>\n    </List>\n  );\n}\n"],"names":["makePrefixer","useWindow","useComponentCssInjection","queryInputCss","useCallback","jsxs","List","jsx","ListItemGroup","ListItem"],"mappings":";;;;;;;;;;;;;;;;;;;AAYA,MAAM,YAAA,GAAeA,kBAAa,0BAA0B,CAAA,CAAA;AAY5D,SAAS,aAAa,IAAsB,EAAA;AAC1C,EAAA,OAAO,CAAC,IAAK,CAAA,QAAA,EAAU,KAAK,KAAK,CAAA,CAAE,KAAK,IAAI,CAAA,CAAA;AAC9C,CAAA;AAEO,SAAS,WAAW,KAAwB,EAAA;AACjD,EAAM,MAAA;AAAA,IACJ,UAAA;AAAA,IACA,aAAA;AAAA,IACA,QAAU,EAAA,YAAA;AAAA,IACV,SAAA;AAAA,IACA,gBAAA;AAAA,IACA,mBAAA;AAAA,IACA,iBAAA;AAAA,GACE,GAAA,KAAA,CAAA;AAEJ,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,kBAAA;AAAA,IACR,GAAK,EAAAC,UAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,QACJ,GAAAC,iBAAA;AAAA,IACE,CAAC,OAAO,KAAU,KAAA;AAChB,MAAa,YAAA,CAAA,KAAA,IAAS,EAAE,CAAA,CAAA;AAAA,KAC1B;AAAA,IACA,CAAC,YAAY,CAAA;AAAA,GACf,CAAA;AAEF,EAAA,uBACGC,eAAA,CAAAC,SAAA,EAAA;AAAA,IACC,SAAW,EAAA,KAAA;AAAA,IACX,aAAY,EAAA,aAAA;AAAA,IACZ,gBAAA;AAAA,IACA,wBAA0B,EAAA,UAAA;AAAA,IAC1B,YAAA;AAAA,IACA,WAAa,EAAA,mBAAA;AAAA,IACb,iBAAmB,EAAA,QAAA;AAAA,IACnB,iBAAkB,EAAA,UAAA;AAAA,IAClB,QAAU,EAAA,aAAA;AAAA,IACV,KAAO,EAAA,SAAA;AAAA,IAEN,QAAA,EAAA;AAAA,MAAkB,iBAAA,CAAA,GAAA,CAAI,CAAC,aAAsC,KAAA;AAC5D,QAAA,uBACGC,cAAA,CAAAC,2BAAA,EAAA;AAAA,UAAuC,OAAO,aAAc,CAAA,IAAA;AAAA,UAC1D,QAAc,EAAA,aAAA,CAAA,MAAA,CAAO,GAAI,CAAA,CAAC,0BACxBD,cAAA,CAAAE,iBAAA,EAAA;AAAA,YAAqB,KAAA;AAAA,WAAA,EAAP,KAAqB,CACrC,CAAA;AAAA,SAAA,EAHiB,cAAc,IAIlC,CAAA,CAAA;AAAA,OAEH,CAAA;AAAA,sBACAF,cAAA,CAAAE,iBAAA,EAAA;AAAA,QAAS,SAAA,EAAW,aAAa,YAAY,CAAA;AAAA,QAC3C,QAAiB,EAAA,CAAA,cAAA,EAAA,UAAA,CAAA,CAAA,CAAA;AAAA,OACpB,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}

package/dist-cjs/query-input/internal/ValueList.js

@@ -0,0 +1,68 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var core = require('@salt-ds/core');
+var icons = require('@salt-ds/icons');
+require('../../list/Highlighter.js');
+var ListItem = require('../../list/ListItem.js');
+var List = require('../../list/List.js');
+require('react');
+require('../../common-hooks/collectionProvider.js');
+require('../../common-hooks/keyUtils.js');
+require('../../responsive/useResizeObserver.js');
+require('../../list/VirtualizedList.js');
+
+const withBaseName = core.makePrefixer("saltQueryInputValueList");
+function ValueList(props) {
+  const {
+    category,
+    rootWidth,
+    onBack,
+    selectedValues,
+    onValueToggle,
+    highlightedValueIndex,
+    setHighlightedValueIndex
+  } = props;
+  const handleSelect = (_, value) => {
+    onValueToggle(category, value);
+  };
+  const items = category ? category.values.map((value) => /* @__PURE__ */ jsxRuntime.jsx(ListItem.ListItem, {
+    item: value,
+    children: value
+  }, value)) : [];
+  return /* @__PURE__ */ jsxRuntime.jsx("div", {
+    className: withBaseName(),
+    tabIndex: 0,
+    "data-testid": "value-list",
+    children: /* @__PURE__ */ jsxRuntime.jsxs(List.List, {
+      borderless: true,
+      checkable: false,
+      highlightedIndex: highlightedValueIndex,
+      onHighlight: setHighlightedValueIndex,
+      onSelect: handleSelect,
+      selectionStrategy: "multiple",
+      selected: selectedValues,
+      width: rootWidth,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(ListItem.ListItem, {
+          className: withBaseName("back"),
+          onClick: onBack,
+          selectable: false,
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(icons.ChevronLeftIcon, {}),
+            /* @__PURE__ */ jsxRuntime.jsx("div", {
+              className: withBaseName("category"),
+              children: category ? category.name : ""
+            })
+          ]
+        }),
+        items
+      ]
+    })
+  });
+}
+
+exports.ValueList = ValueList;
+//# sourceMappingURL=ValueList.js.map

package/dist-cjs/query-input/internal/ValueList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ValueList.js","sources":["../src/query-input/internal/ValueList.tsx"],"sourcesContent":["import { QueryInputCategory } from \"../queryInputTypes\";\nimport { Dispatch, ReactElement, SetStateAction } from \"react\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { ChevronLeftIcon } from \"@salt-ds/icons\";\nimport { List, ListItem } from \"../../list\";\nimport { SelectHandler } from \"../../common-hooks\";\n\nconst withBaseName = makePrefixer(\"saltQueryInputValueList\");\n\nexport interface ValueListProps {\n  category: QueryInputCategory | null;\n  rootWidth: number;\n  onBack: () => void;\n  selectedValues: string[];\n  onValueToggle: (category: QueryInputCategory, value: string) => void;\n  highlightedValueIndex?: number;\n  setHighlightedValueIndex: Dispatch<SetStateAction<number>>;\n}\n\nexport function ValueList(props: ValueListProps) {\n  const {\n    category,\n    rootWidth,\n    onBack,\n    selectedValues,\n    onValueToggle,\n    highlightedValueIndex,\n    setHighlightedValueIndex,\n  } = props;\n\n  const handleSelect: SelectHandler = (_, value: string) => {\n    onValueToggle(category!, value);\n  };\n\n  const items: ReactElement[] = category\n    ? category.values.map((value) => (\n        <ListItem key={value} item={value}>\n          {value}\n        </ListItem>\n      ))\n    : [];\n\n  return (\n    <div className={withBaseName()} tabIndex={0} data-testid=\"value-list\">\n      <List\n        borderless={true}\n        checkable={false}\n        highlightedIndex={highlightedValueIndex}\n        onHighlight={setHighlightedValueIndex}\n        onSelect={handleSelect}\n        selectionStrategy=\"multiple\"\n        selected={selectedValues}\n        width={rootWidth}\n      >\n        <ListItem\n          className={withBaseName(\"back\")}\n          onClick={onBack}\n          selectable={false}\n        >\n          <ChevronLeftIcon />\n          <div className={withBaseName(\"category\")}>\n            {category ? category.name : \"\"}\n          </div>\n        </ListItem>\n        {items}\n      </List>\n    </div>\n  );\n}\n"],"names":["makePrefixer","jsx","ListItem","jsxs","List","ChevronLeftIcon"],"mappings":";;;;;;;;;;;;;;;;AAOA,MAAM,YAAA,GAAeA,kBAAa,yBAAyB,CAAA,CAAA;AAYpD,SAAS,UAAU,KAAuB,EAAA;AAC/C,EAAM,MAAA;AAAA,IACJ,QAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,cAAA;AAAA,IACA,aAAA;AAAA,IACA,qBAAA;AAAA,IACA,wBAAA;AAAA,GACE,GAAA,KAAA,CAAA;AAEJ,EAAM,MAAA,YAAA,GAA8B,CAAC,CAAA,EAAG,KAAkB,KAAA;AACxD,IAAA,aAAA,CAAc,UAAW,KAAK,CAAA,CAAA;AAAA,GAChC,CAAA;AAEA,EAAA,MAAM,QAAwB,QAC1B,GAAA,QAAA,CAAS,OAAO,GAAI,CAAA,CAAC,0BAClBC,cAAA,CAAAC,iBAAA,EAAA;AAAA,IAAqB,IAAM,EAAA,KAAA;AAAA,IACzB,QAAA,EAAA,KAAA;AAAA,GADY,EAAA,KAEf,CACD,CAAA,GACD,EAAC,CAAA;AAEL,EAAA,uBACGD,cAAA,CAAA,KAAA,EAAA;AAAA,IAAI,WAAW,YAAa,EAAA;AAAA,IAAG,QAAU,EAAA,CAAA;AAAA,IAAG,aAAY,EAAA,YAAA;AAAA,IACvD,QAAC,kBAAAE,eAAA,CAAAC,SAAA,EAAA;AAAA,MACC,UAAY,EAAA,IAAA;AAAA,MACZ,SAAW,EAAA,KAAA;AAAA,MACX,gBAAkB,EAAA,qBAAA;AAAA,MAClB,WAAa,EAAA,wBAAA;AAAA,MACb,QAAU,EAAA,YAAA;AAAA,MACV,iBAAkB,EAAA,UAAA;AAAA,MAClB,QAAU,EAAA,cAAA;AAAA,MACV,KAAO,EAAA,SAAA;AAAA,MAEP,QAAA,EAAA;AAAA,wBAACD,eAAA,CAAAD,iBAAA,EAAA;AAAA,UACC,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,UAC9B,OAAS,EAAA,MAAA;AAAA,UACT,UAAY,EAAA,KAAA;AAAA,UAEZ,QAAA,EAAA;AAAA,4BAAAD,cAAA,CAACI,qBAAgB,EAAA,EAAA,CAAA;AAAA,4BAChBJ,cAAA,CAAA,KAAA,EAAA;AAAA,cAAI,SAAA,EAAW,aAAa,UAAU,CAAA;AAAA,cACpC,QAAA,EAAA,QAAA,GAAW,SAAS,IAAO,GAAA,EAAA;AAAA,aAC9B,CAAA;AAAA,WAAA;AAAA,SACF,CAAA;AAAA,QACC,KAAA;AAAA,OAAA;AAAA,KACH,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}

package/dist-cjs/query-input/internal/ValueSelector.js

@@ -0,0 +1,107 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var core = require('@salt-ds/core');
+var React = require('react');
+var CategoryList = require('./CategoryList.js');
+var SearchList = require('./SearchList.js');
+var ValueList = require('./ValueList.js');
+var Portal = require('../../portal/Portal.js');
+var WindowContext = require('../../window/WindowContext.js');
+require('../../window/ElectronWindow.js');
+
+const withBaseName = core.makePrefixer("saltQueryInputValueSelector");
+function ValueSelector(props) {
+  const {
+    isOpen,
+    inputValue,
+    anchorElement,
+    popperRef,
+    categories,
+    selectedCategory,
+    onSelectedCategoryChange,
+    width,
+    selectedItems,
+    onValueToggle,
+    highlightedIndex,
+    visibleCategories,
+    highlightedCategoryIndex,
+    highlightedValueIndex,
+    onSearchListChange,
+    setHighlightedValueIndex,
+    setHighlightedCategoryIndex,
+    setHighlightedIndex
+  } = props;
+  const selectedCategoryValues = React.useMemo(() => {
+    if (!selectedCategory) {
+      return [];
+    }
+    return selectedItems.filter((item) => item.category === selectedCategory.name).map(({ value }) => value);
+  }, [selectedCategory, selectedItems]);
+  const onBackToCategories = () => {
+    onSelectedCategoryChange(null);
+  };
+  const renderContent = () => {
+    if (inputValue) {
+      return /* @__PURE__ */ jsxRuntime.jsx(SearchList.SearchList, {
+        inputValue,
+        selectedItems,
+        onChange: onSearchListChange,
+        rootWidth: width,
+        highlightedIndex,
+        visibleCategories,
+        setHighlightedIndex
+      });
+    }
+    if (!selectedCategory) {
+      return /* @__PURE__ */ jsxRuntime.jsx(CategoryList.CategoryList, {
+        categories,
+        rootWidth: width,
+        onCategorySelect: onSelectedCategoryChange,
+        highlightedCategoryIndex,
+        setHighlightedCategoryIndex
+      });
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx(ValueList.ValueList, {
+      category: selectedCategory,
+      rootWidth: width,
+      onBack: onBackToCategories,
+      selectedValues: selectedCategoryValues,
+      onValueToggle,
+      highlightedValueIndex,
+      setHighlightedValueIndex
+    });
+  };
+  const Window = WindowContext.useWindow();
+  const { reference, floating, x, y, strategy } = core.useFloatingUI({
+    placement: "bottom"
+  });
+  const handleRef = core.useForkRef(floating, popperRef);
+  core.useIsomorphicLayoutEffect(() => {
+    if (anchorElement) {
+      reference(anchorElement);
+    }
+  }, [reference, anchorElement]);
+  if (!isOpen) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(Portal.Portal, {
+    children: /* @__PURE__ */ jsxRuntime.jsx(Window, {
+      style: {
+        top: y != null ? y : 0,
+        left: x != null ? x : 0,
+        position: strategy
+      },
+      ref: handleRef,
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", {
+        className: withBaseName("content"),
+        children: renderContent()
+      })
+    })
+  });
+}
+
+exports.ValueSelector = ValueSelector;
+//# sourceMappingURL=ValueSelector.js.map

package/dist-cjs/query-input/internal/ValueSelector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ValueSelector.js","sources":["../src/query-input/internal/ValueSelector.tsx"],"sourcesContent":["import {\n  makePrefixer,\n  useFloatingUI,\n  useForkRef,\n  useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { Dispatch, Ref, SetStateAction, useMemo } from \"react\";\nimport { QueryInputCategory, QueryInputItem } from \"../queryInputTypes\";\nimport { CategoryList } from \"./CategoryList\";\nimport { SearchList } from \"./SearchList\";\nimport { ValueList } from \"./ValueList\";\nimport { Portal } from \"../../portal\";\nimport { useWindow } from \"../../window\";\n\nconst withBaseName = makePrefixer(\"saltQueryInputValueSelector\");\n\nexport interface ValueSelectorProps {\n  isOpen: boolean;\n  anchorElement: HTMLElement | null;\n  popperRef: Ref<HTMLDivElement>;\n\n  inputValue?: string;\n  categories: QueryInputCategory[];\n  selectedCategory: QueryInputCategory | null;\n  onSelectedCategoryChange: (category: QueryInputCategory | null) => void;\n\n  width: number;\n  selectedItems: QueryInputItem[];\n  onValueToggle: (category: QueryInputCategory, value: string) => void;\n  onSearchListChange: (items: QueryInputItem[]) => void;\n\n  highlightedIndex?: number;\n  visibleCategories: QueryInputCategory[];\n\n  highlightedCategoryIndex?: number;\n  highlightedValueIndex?: number;\n  setHighlightedIndex: Dispatch<SetStateAction<number>>;\n  setHighlightedCategoryIndex: Dispatch<SetStateAction<number>>;\n  setHighlightedValueIndex: Dispatch<SetStateAction<number>>;\n}\n\nexport function ValueSelector(props: ValueSelectorProps) {\n  const {\n    isOpen,\n    inputValue,\n    anchorElement,\n    popperRef,\n    categories,\n    selectedCategory,\n    onSelectedCategoryChange,\n    width,\n    selectedItems,\n    onValueToggle,\n    highlightedIndex,\n    visibleCategories,\n    highlightedCategoryIndex,\n    highlightedValueIndex,\n    onSearchListChange,\n    setHighlightedValueIndex,\n    setHighlightedCategoryIndex,\n    setHighlightedIndex,\n  } = props;\n\n  const selectedCategoryValues = useMemo(() => {\n    if (!selectedCategory) {\n      return [];\n    }\n    return selectedItems\n      .filter((item) => item.category === selectedCategory.name)\n      .map(({ value }) => value);\n  }, [selectedCategory, selectedItems]);\n\n  const onBackToCategories = () => {\n    onSelectedCategoryChange(null);\n  };\n\n  const renderContent = () => {\n    if (inputValue) {\n      return (\n        <SearchList\n          inputValue={inputValue}\n          selectedItems={selectedItems}\n          onChange={onSearchListChange}\n          rootWidth={width}\n          highlightedIndex={highlightedIndex}\n          visibleCategories={visibleCategories}\n          setHighlightedIndex={setHighlightedIndex}\n        />\n      );\n    }\n\n    if (!selectedCategory) {\n      return (\n        <CategoryList\n          categories={categories}\n          rootWidth={width}\n          onCategorySelect={onSelectedCategoryChange}\n          highlightedCategoryIndex={highlightedCategoryIndex}\n          setHighlightedCategoryIndex={setHighlightedCategoryIndex}\n        />\n      );\n    }\n\n    return (\n      <ValueList\n        category={selectedCategory}\n        rootWidth={width}\n        onBack={onBackToCategories}\n        selectedValues={selectedCategoryValues}\n        onValueToggle={onValueToggle}\n        highlightedValueIndex={highlightedValueIndex}\n        setHighlightedValueIndex={setHighlightedValueIndex}\n      />\n    );\n  };\n\n  const Window = useWindow();\n  const { reference, floating, x, y, strategy } = useFloatingUI({\n    placement: \"bottom\",\n  });\n  const handleRef = useForkRef<HTMLDivElement>(floating, popperRef);\n  useIsomorphicLayoutEffect(() => {\n    if (anchorElement) {\n      reference(anchorElement);\n    }\n  }, [reference, anchorElement]);\n\n  if (!isOpen) {\n    return null;\n  }\n\n  return (\n    <Portal>\n      <Window\n        style={{\n          top: y ?? 0,\n          left: x ?? 0,\n          position: strategy,\n        }}\n        ref={handleRef}\n      >\n        <div className={withBaseName(\"content\")}>{renderContent()}</div>\n      </Window>\n    </Portal>\n  );\n}\n"],"names":["makePrefixer","useMemo","jsx","SearchList","CategoryList","ValueList","useWindow","useFloatingUI","useForkRef","useIsomorphicLayoutEffect","Portal"],"mappings":"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"}