@expcat/tigercat-react 2.1.1 → 2.1.3

package/dist/chunk-KVCI2346.mjs

@@ -1,732 +0,0 @@
-import {
-  renderOverlayPortal,
-  useAnchoredOverlay
-} from "./chunk-HKAZXG74.mjs";
-import {
-  useTigerConfig
-} from "./chunk-YSIXURBW.mjs";
-
-// src/components/Select.tsx
-import {
-  classNames as classNames2,
-  selectDropdownBaseClasses,
-  selectSearchInputClasses,
-  selectDoneActionClasses,
-  selectDoneButtonClasses
-} from "@expcat/tigercat-core";
-
-// src/components/Select/state.ts
-import { useCallback, useEffect, useId, useMemo, useRef, useState } from "react";
-import {
-  classNames,
-  getSelectTriggerClasses,
-  selectBaseClasses,
-  createSelectSearchDebouncer,
-  flattenSelectOptions,
-  resolveCreatableSelectOption,
-  resolveSelectFilteredOptions,
-  findFirstEnabledIndex as pickerFindFirstEnabledIndex,
-  findLastEnabledIndex as pickerFindLastEnabledIndex,
-  findNextEnabledIndex as pickerFindNextEnabledIndex,
-  resolveLocaleText,
-  mergeTigerLocale,
-  getSelectLabels
-} from "@expcat/tigercat-core";
-var SELECT_KEYS = /* @__PURE__ */ new Set([
-  "options",
-  "size",
-  "disabled",
-  "placeholder",
-  "searchable",
-  "searchValue",
-  "defaultSearchValue",
-  "clearable",
-  "emptyText",
-  "maxTagCount",
-  "virtual",
-  "remote",
-  "searchDebounce",
-  "creatable",
-  "createOptionText",
-  "listHeight",
-  "labels",
-  "onSearchChange",
-  "onCreate",
-  "className",
-  "value",
-  "onChange",
-  "multiple",
-  "locale"
-]);
-function useSelectState(props) {
-  const {
-    options = [],
-    size = "md",
-    disabled = false,
-    placeholder = "Select an option",
-    searchable = false,
-    searchValue,
-    defaultSearchValue = "",
-    clearable = true,
-    emptyText,
-    maxTagCount,
-    remote = false,
-    searchDebounce = 0,
-    creatable = false,
-    createOptionText = "Create",
-    virtual = false,
-    listHeight = 256,
-    labels: labelsOverride,
-    onSearchChange,
-    onCreate,
-    className,
-    value,
-    onChange,
-    multiple,
-    locale
-  } = props;
-  const isMultiple = multiple === true;
-  const config = useTigerConfig();
-  const mergedLocale = useMemo(
-    () => mergeTigerLocale(config.locale, locale),
-    [config.locale, locale]
-  );
-  const labels = useMemo(
-    () => getSelectLabels(mergedLocale, labelsOverride),
-    [mergedLocale, labelsOverride]
-  );
-  const divProps = {};
-  for (const [k, v] of Object.entries(props)) {
-    if (!SELECT_KEYS.has(k)) divProps[k] = v;
-  }
-  const instanceId = useId();
-  const listboxId = `tiger-select-listbox-${instanceId}`;
-  const [isOpen, setIsOpen] = useState(false);
-  const [uncontrolledSearchValue, setUncontrolledSearchValue] = useState(defaultSearchValue);
-  const searchQuery = searchValue ?? uncontrolledSearchValue;
-  const [activeIndex, setActiveIndex] = useState(-1);
-  const [createdOptions, setCreatedOptions] = useState([]);
-  const dropdownRef = useRef(null);
-  const triggerRef = useRef(null);
-  const searchInputRef = useRef(null);
-  const searchDebouncerRef = useRef(null);
-  const filteredOptions = useMemo(
-    () => resolveSelectFilteredOptions(options, searchQuery, { searchable, remote }),
-    [options, remote, searchable, searchQuery]
-  );
-  const flatFilteredOptions = useMemo(
-    () => flattenSelectOptions(filteredOptions),
-    [filteredOptions]
-  );
-  const creatableOption = useMemo(
-    () => resolveCreatableSelectOption([...options, ...createdOptions], searchQuery, {
-      creatable: creatable && searchable
-    }),
-    [creatable, createdOptions, options, searchable, searchQuery]
-  );
-  const flatSelectableOptions = useMemo(
-    () => creatableOption ? [...flatFilteredOptions, creatableOption] : flatFilteredOptions,
-    [creatableOption, flatFilteredOptions]
-  );
-  const allOptions = useMemo(() => flattenSelectOptions(options), [options]);
-  const displayText = useMemo(() => {
-    if (isMultiple) {
-      const values = Array.isArray(value) ? value : [];
-      if (values.length === 0) return placeholder;
-      const labels2 = [...allOptions, ...createdOptions].filter((opt) => values.includes(opt.value)).map((opt) => opt.label);
-      if (maxTagCount !== void 0 && labels2.length > maxTagCount) {
-        const visible = labels2.slice(0, maxTagCount);
-        return `${visible.join(", ")} +${labels2.length - maxTagCount}`;
-      }
-      return labels2.join(", ");
-    }
-    if (value === void 0 || value === null || value === "") return placeholder;
-    return [...allOptions, ...createdOptions].find((opt) => opt.value === value)?.label ?? placeholder;
-  }, [isMultiple, value, allOptions, createdOptions, placeholder, maxTagCount]);
-  const showClearButton = useMemo(
-    () => clearable && !disabled && value !== void 0 && value !== null && value !== "" && (!Array.isArray(value) || value.length > 0),
-    [clearable, disabled, value]
-  );
-  const isSelected = (option) => {
-    if (isMultiple) {
-      return (Array.isArray(value) ? value : []).includes(option.value);
-    }
-    return value === option.value;
-  };
-  const getOptionId = (index) => `tiger-select-option-${instanceId}-${index}`;
-  const findFirstEnabledIndex = useCallback(
-    () => pickerFindFirstEnabledIndex(flatSelectableOptions),
-    [flatSelectableOptions]
-  );
-  const findLastEnabledIndex = () => pickerFindLastEnabledIndex(flatSelectableOptions);
-  const findNextEnabledIndex = (current, direction) => pickerFindNextEnabledIndex(flatSelectableOptions, current, direction);
-  const focusOptionAt = useCallback((index) => {
-    if (index < 0) {
-      return;
-    }
-    requestAnimationFrame(() => {
-      const el = dropdownRef.current?.querySelector(`[data-option-index="${index}"]`);
-      el?.focus();
-      el?.scrollIntoView({ block: "nearest" });
-    });
-  }, []);
-  const setActiveAndFocus = (index) => {
-    setActiveIndex(index);
-    focusOptionAt(index);
-  };
-  const closeDropdown = () => {
-    setIsOpen(false);
-    updateSearchValue("");
-    setActiveIndex(-1);
-  };
-  const toggleDropdown = () => {
-    if (!disabled) {
-      setIsOpen((prev) => !prev);
-    }
-  };
-  const getActiveOption = () => {
-    if (activeIndex < 0) {
-      return void 0;
-    }
-    return flatSelectableOptions[activeIndex];
-  };
-  const selectActiveOption = () => {
-    const option = getActiveOption();
-    if (!option || option.disabled) {
-      return;
-    }
-    selectOption(option);
-  };
-  const selectOption = (option) => {
-    if (option.disabled) {
-      return;
-    }
-    if (creatableOption && option.value === creatableOption.value) {
-      setCreatedOptions((current) => [...current, option]);
-      onCreate?.(option);
-    }
-    if (isMultiple) {
-      const currentValue = Array.isArray(value) ? value : [];
-      const nextValue = currentValue.includes(option.value) ? currentValue.filter((v) => v !== option.value) : [...currentValue, option.value];
-      onChange?.(nextValue);
-      return;
-    }
-    ;
-    onChange?.(option.value);
-    closeDropdown();
-    requestAnimationFrame(() => {
-      triggerRef.current?.focus();
-    });
-  };
-  const clearSelection = (event) => {
-    event.stopPropagation();
-    if (isMultiple) {
-      ;
-      onChange?.([]);
-      return;
-    }
-    ;
-    onChange?.(void 0);
-  };
-  const handleSearchInput = (event) => {
-    updateSearchValue(event.target.value);
-  };
-  const updateSearchValue = useCallback(
-    (query) => {
-      if (searchValue === void 0) {
-        setUncontrolledSearchValue(query);
-      }
-      searchDebouncerRef.current?.schedule(query);
-    },
-    [searchValue]
-  );
-  useEffect(() => {
-    searchDebouncerRef.current?.cancel();
-    searchDebouncerRef.current = createSelectSearchDebouncer({
-      delay: searchDebounce,
-      onSearchChange: (query) => onSearchChange?.(query)
-    });
-    return () => searchDebouncerRef.current?.cancel();
-  }, [onSearchChange, searchDebounce]);
-  const handleTriggerKeyDown = (event) => {
-    if (disabled) {
-      return;
-    }
-    switch (event.key) {
-      case "ArrowDown": {
-        event.preventDefault();
-        if (!isOpen) {
-          setIsOpen(true);
-          return;
-        }
-        const next = findNextEnabledIndex(activeIndex, 1);
-        setActiveAndFocus(next);
-        return;
-      }
-      case "ArrowUp": {
-        event.preventDefault();
-        if (!isOpen) {
-          setIsOpen(true);
-          return;
-        }
-        const next = findNextEnabledIndex(activeIndex, -1);
-        setActiveAndFocus(next);
-        return;
-      }
-      case "Enter":
-      case " ": {
-        event.preventDefault();
-        if (!isOpen) {
-          setIsOpen(true);
-          return;
-        }
-        selectActiveOption();
-        return;
-      }
-      case "Escape": {
-        if (isOpen) {
-          event.preventDefault();
-          closeDropdown();
-        }
-        return;
-      }
-      default:
-        return;
-    }
-  };
-  const handleDropdownKeyDown = (event) => {
-    switch (event.key) {
-      case "ArrowDown": {
-        event.preventDefault();
-        const next = findNextEnabledIndex(activeIndex, 1);
-        setActiveAndFocus(next);
-        return;
-      }
-      case "ArrowUp": {
-        event.preventDefault();
-        const next = findNextEnabledIndex(activeIndex, -1);
-        setActiveAndFocus(next);
-        return;
-      }
-      case "Home": {
-        event.preventDefault();
-        const next = findFirstEnabledIndex();
-        setActiveAndFocus(next);
-        return;
-      }
-      case "End": {
-        event.preventDefault();
-        const next = findLastEnabledIndex();
-        setActiveAndFocus(next);
-        return;
-      }
-      case "Enter":
-      case " ": {
-        event.preventDefault();
-        selectActiveOption();
-        return;
-      }
-      case "Escape": {
-        event.preventDefault();
-        closeDropdown();
-        triggerRef.current?.focus();
-        return;
-      }
-      case "Tab": {
-        closeDropdown();
-        return;
-      }
-      default:
-        return;
-    }
-  };
-  const handleSearchKeyDown = (event) => {
-    switch (event.key) {
-      case " ": {
-        event.stopPropagation();
-        return;
-      }
-      case "ArrowDown": {
-        event.preventDefault();
-        event.stopPropagation();
-        const next = activeIndex >= 0 ? activeIndex : findFirstEnabledIndex();
-        setActiveAndFocus(next);
-        return;
-      }
-      case "ArrowUp": {
-        event.preventDefault();
-        event.stopPropagation();
-        const next = activeIndex >= 0 ? activeIndex : findLastEnabledIndex();
-        setActiveAndFocus(next);
-        return;
-      }
-      case "Enter": {
-        if (activeIndex >= 0) {
-          event.preventDefault();
-          event.stopPropagation();
-          selectActiveOption();
-        }
-        return;
-      }
-      case "Escape": {
-        event.preventDefault();
-        event.stopPropagation();
-        closeDropdown();
-        triggerRef.current?.focus();
-        return;
-      }
-      default:
-        return;
-    }
-  };
-  useEffect(() => {
-    if (isOpen && searchable) {
-      searchInputRef.current?.focus();
-    }
-  }, [isOpen, searchable]);
-  useEffect(() => {
-    if (!isOpen) {
-      return;
-    }
-    if (flatSelectableOptions.length === 0) {
-      setActiveIndex(-1);
-      return;
-    }
-    const selectedIndex = (() => {
-      if (isMultiple) {
-        const values = Array.isArray(value) ? value : [];
-        if (values.length === 0) {
-          return -1;
-        }
-        return flatSelectableOptions.findIndex((opt) => values.includes(opt.value) && !opt.disabled);
-      }
-      if (value === void 0 || value === null || value === "") {
-        return -1;
-      }
-      return flatSelectableOptions.findIndex((opt) => opt.value === value && !opt.disabled);
-    })();
-    const nextActive = selectedIndex >= 0 ? selectedIndex : findFirstEnabledIndex();
-    setActiveIndex(nextActive);
-    if (!searchable) {
-      focusOptionAt(nextActive);
-    }
-  }, [
-    isOpen,
-    searchable,
-    flatSelectableOptions,
-    isMultiple,
-    value,
-    findFirstEnabledIndex,
-    focusOptionAt
-  ]);
-  return {
-    listboxId,
-    getOptionId,
-    isOpen,
-    searchQuery,
-    activeIndex,
-    setActiveIndex,
-    dropdownRef,
-    triggerRef,
-    searchInputRef,
-    isMultiple,
-    size,
-    virtual,
-    listHeight,
-    disabled,
-    placeholder,
-    searchable,
-    clearable,
-    emptyText: resolveLocaleText("No options found", emptyText, mergedLocale?.common?.emptyText),
-    createOptionText,
-    className,
-    divProps,
-    searchPlaceholder: resolveLocaleText("Search...", mergedLocale?.common?.searchPlaceholder),
-    clearAriaLabel: resolveLocaleText("Clear selection", mergedLocale?.common?.clearText),
-    doneText: resolveLocaleText(labels.doneText),
-    filteredOptions,
-    flatSelectableOptions,
-    creatableOption,
-    hasOptions: filteredOptions.length > 0,
-    optionsLength: options.length,
-    displayText,
-    showClearButton,
-    containerClasses: classNames(selectBaseClasses, className),
-    triggerClasses: getSelectTriggerClasses(size, disabled, isOpen),
-    isSelected,
-    selectOption,
-    clearSelection,
-    closeDropdown,
-    toggleDropdown,
-    handleSearchInput,
-    handleTriggerKeyDown,
-    handleDropdownKeyDown,
-    handleSearchKeyDown
-  };
-}
-
-// src/components/Select/render-option.tsx
-import { useEffect as useEffect2, useRef as useRef2, useState as useState2 } from "react";
-import {
-  getSelectOptionClasses,
-  selectGroupLabelClasses,
-  selectEmptyStateClasses,
-  isOptionGroup,
-  getPickerOptionAria,
-  getCreateSelectOptionLabel,
-  getSelectVirtualItemHeight,
-  fixedSizeStrategy
-} from "@expcat/tigercat-core";
-
-// src/components/Select/icons.tsx
-import {
-  icon20ViewBox,
-  chevronDownSolidIcon20PathD,
-  closeSolidIcon20PathD,
-  checkSolidIcon20PathD
-} from "@expcat/tigercat-core";
-import { jsx } from "react/jsx-runtime";
-var SelectIcon = ({ path, className }) => /* @__PURE__ */ jsx(
-  "svg",
-  {
-    className,
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: icon20ViewBox,
-    fill: "currentColor",
-    children: /* @__PURE__ */ jsx("path", { fillRule: "evenodd", d: path, clipRule: "evenodd" })
-  }
-);
-var SelectCheckIcon = () => /* @__PURE__ */ jsx(
-  SelectIcon,
-  {
-    path: checkSolidIcon20PathD,
-    className: "w-5 h-5 text-[var(--tiger-select-check-icon,var(--tiger-primary,#2563eb))]"
-  }
-);
-var SelectClearIcon = () => /* @__PURE__ */ jsx(
-  SelectIcon,
-  {
-    path: closeSolidIcon20PathD,
-    className: "w-4 h-4 text-[var(--tiger-select-icon,var(--tiger-text-muted,#9ca3af))] hover:text-[var(--tiger-select-icon-hover,var(--tiger-text-muted,#6b7280))]"
-  }
-);
-var SelectChevronIcon = () => /* @__PURE__ */ jsx(
-  SelectIcon,
-  {
-    path: chevronDownSolidIcon20PathD,
-    className: "w-5 h-5 text-[var(--tiger-select-icon,var(--tiger-text-muted,#9ca3af))] transition-transform"
-  }
-);
-
-// src/components/Select/render-option.tsx
-import { jsx as jsx2, jsxs } from "react/jsx-runtime";
-function renderOption(ctx, option, index, displayLabel = option.label) {
-  const optionSelected = ctx.isSelected(option);
-  const optionActive = index === ctx.activeIndex;
-  const optionAria = getPickerOptionAria({
-    selected: optionSelected,
-    disabled: !!option.disabled
-  });
-  return /* @__PURE__ */ jsx2(
-    "div",
-    {
-      id: ctx.getOptionId(index),
-      "data-option-index": index,
-      ...optionAria,
-      tabIndex: optionActive ? 0 : -1,
-      className: getSelectOptionClasses(optionSelected, !!option.disabled, ctx.size),
-      onMouseEnter: () => {
-        if (!option.disabled) {
-          ctx.setActiveIndex(index);
-        }
-      },
-      onClick: () => ctx.selectOption(option),
-      children: /* @__PURE__ */ jsxs("span", { className: "flex items-center justify-between w-full", children: [
-        /* @__PURE__ */ jsx2("span", { children: displayLabel }),
-        optionSelected && /* @__PURE__ */ jsx2(SelectCheckIcon, {})
-      ] })
-    },
-    option.value
-  );
-}
-var VirtualSelectOptions = ({
-  ctx,
-  options
-}) => {
-  const itemHeight = getSelectVirtualItemHeight(ctx.size);
-  const containerRef = useRef2(null);
-  const [scrollTop, setScrollTop] = useState2(0);
-  const strategy = fixedSizeStrategy(itemHeight);
-  const { startIndex, endIndex, totalHeight } = strategy.getRange(
-    scrollTop,
-    ctx.listHeight,
-    options.length,
-    5
-  );
-  useEffect2(() => {
-    const el = containerRef.current;
-    if (!el || ctx.activeIndex < 0) return;
-    const top = ctx.activeIndex * itemHeight;
-    if (top < el.scrollTop) el.scrollTop = top;
-    else if (top + itemHeight > el.scrollTop + ctx.listHeight)
-      el.scrollTop = top + itemHeight - ctx.listHeight;
-  }, [ctx.activeIndex, itemHeight, ctx.listHeight]);
-  const visible = [];
-  for (let i = startIndex; i <= endIndex; i++) {
-    visible.push(renderOption(ctx, options[i], i));
-  }
-  return /* @__PURE__ */ jsx2(
-    "div",
-    {
-      ref: containerRef,
-      "data-tiger-select-virtual": "",
-      style: { maxHeight: `${ctx.listHeight}px`, overflowY: "auto" },
-      onScroll: (e) => setScrollTop(e.currentTarget.scrollTop),
-      children: /* @__PURE__ */ jsx2("div", { style: { height: `${totalHeight}px`, position: "relative" }, children: /* @__PURE__ */ jsx2("div", { style: { transform: `translateY(${startIndex * itemHeight}px)` }, children: visible }) })
-    }
-  );
-};
-function renderOptions(ctx) {
-  if (!ctx.hasOptions && !ctx.creatableOption) {
-    return /* @__PURE__ */ jsx2("div", { className: selectEmptyStateClasses, children: ctx.emptyText });
-  }
-  const hasGroups = ctx.filteredOptions.some(isOptionGroup);
-  if (ctx.virtual && !hasGroups) {
-    const flat = ctx.filteredOptions.filter((o) => !isOptionGroup(o));
-    const all = ctx.creatableOption ? [...flat, ctx.creatableOption] : flat;
-    return /* @__PURE__ */ jsx2(VirtualSelectOptions, { ctx, options: all });
-  }
-  let optionIndex = -1;
-  const optionNodes = ctx.filteredOptions.map((item) => {
-    if (isOptionGroup(item)) {
-      return /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx2("div", { className: selectGroupLabelClasses, children: item.label }),
-        item.options.map((option) => {
-          optionIndex += 1;
-          return renderOption(ctx, option, optionIndex);
-        })
-      ] }, item.label);
-    }
-    optionIndex += 1;
-    return renderOption(ctx, item, optionIndex);
-  });
-  if (ctx.creatableOption) {
-    optionIndex += 1;
-    optionNodes.push(
-      renderOption(
-        ctx,
-        ctx.creatableOption,
-        optionIndex,
-        getCreateSelectOptionLabel(ctx.creatableOption, ctx.createOptionText)
-      )
-    );
-  }
-  return optionNodes;
-}
-
-// src/components/Select.tsx
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
-var Select = (props) => {
-  const ctx = useSelectState(props);
-  const overlay = useAnchoredOverlay({
-    enabled: ctx.isOpen,
-    referenceRef: ctx.triggerRef,
-    floatingRef: ctx.dropdownRef,
-    placement: "bottom-start",
-    offset: 4,
-    layout: "fullscreen-sm",
-    matchReferenceWidth: true,
-    dismissOnOutside: true,
-    dismissOnEscape: true,
-    restoreFocusOnDismiss: true,
-    onDismiss: ctx.closeDropdown
-  });
-  const dropdown = ctx.isOpen ? /* @__PURE__ */ jsxs2(
-    "div",
-    {
-      ref: ctx.dropdownRef,
-      className: classNames2(selectDropdownBaseClasses, overlay.floatingClasses),
-      style: overlay.floatingStyles,
-      "data-positioned": overlay.positioned,
-      "data-tiger-select-dropdown": "",
-      role: "listbox",
-      id: ctx.listboxId,
-      "aria-multiselectable": ctx.isMultiple ? true : void 0,
-      onKeyDown: ctx.handleDropdownKeyDown,
-      children: [
-        ctx.searchable && /* @__PURE__ */ jsx3(
-          "input",
-          {
-            ref: ctx.searchInputRef,
-            type: "text",
-            className: selectSearchInputClasses,
-            placeholder: ctx.searchPlaceholder,
-            value: ctx.searchQuery,
-            onChange: ctx.handleSearchInput,
-            onKeyDown: ctx.handleSearchKeyDown
-          }
-        ),
-        renderOptions(ctx),
-        /* @__PURE__ */ jsx3("div", { className: selectDoneActionClasses, children: /* @__PURE__ */ jsx3(
-          "button",
-          {
-            type: "button",
-            className: selectDoneButtonClasses,
-            onClick: ctx.closeDropdown,
-            onKeyDown: (event) => {
-              if (event.key === "Enter" || event.key === " ") event.stopPropagation();
-            },
-            children: ctx.doneText
-          }
-        ) })
-      ]
-    }
-  ) : null;
-  return /* @__PURE__ */ jsxs2("div", { ...ctx.divProps, className: ctx.containerClasses, children: [
-    /* @__PURE__ */ jsx3(
-      "button",
-      {
-        ref: ctx.triggerRef,
-        type: "button",
-        className: classNames2(ctx.triggerClasses, ctx.showClearButton ? "pr-14" : "pr-9"),
-        disabled: ctx.disabled,
-        onClick: ctx.toggleDropdown,
-        onKeyDown: ctx.handleTriggerKeyDown,
-        "aria-haspopup": "listbox",
-        "aria-expanded": ctx.isOpen,
-        "aria-controls": ctx.listboxId,
-        "aria-activedescendant": ctx.isOpen && ctx.activeIndex >= 0 ? ctx.getOptionId(ctx.activeIndex) : void 0,
-        "data-state": ctx.isOpen ? "open" : "closed",
-        children: /* @__PURE__ */ jsx3(
-          "span",
-          {
-            className: classNames2(
-              "flex-1 text-left truncate",
-              ctx.displayText === ctx.placeholder && "text-[var(--tiger-select-placeholder,var(--tiger-text-muted,#9ca3af))]"
-            ),
-            children: ctx.displayText
-          }
-        )
-      }
-    ),
-    /* @__PURE__ */ jsxs2("span", { className: "pointer-events-none absolute inset-y-0 right-3 flex items-center gap-1", children: [
-      ctx.showClearButton && /* @__PURE__ */ jsx3(
-        "button",
-        {
-          type: "button",
-          className: "pointer-events-auto inline-flex rounded-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--tiger-select-ring,var(--tiger-primary,#2563eb))]",
-          "data-tiger-select-clear": true,
-          "aria-label": ctx.clearAriaLabel,
-          onClick: ctx.clearSelection,
-          children: /* @__PURE__ */ jsx3(SelectClearIcon, {})
-        }
-      ),
-      /* @__PURE__ */ jsx3("span", { className: classNames2("inline-flex", ctx.isOpen && "rotate-180"), "aria-hidden": "true", children: /* @__PURE__ */ jsx3(SelectChevronIcon, {}) })
-    ] }),
-    dropdown && renderOverlayPortal(dropdown, overlay.target)
-  ] });
-};
-
-export {
-  Select
-};