import { jsx as o } from "../../../external/.pnpm/preact@10.28.2/node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js";
import { useCallback as s } from "../../../external/.pnpm/preact@10.28.2/node_modules/preact/hooks/dist/hooks.module.js";
import { StoreSelectorButtonContent as a } from "./StoreSelectorButton/StoreSelectorButton.js";
import { StoreSelectorItem as c } from "./StoreSelectorItem/StoreSelectorItem.js";
import { useResponsiveContainer as p, containerQueries as u } from "../../../hooks/useResponsiveContainer.js";
/* empty css                   */
import f from "../FormFields/Select/Select.js";
const v = ({ stores: t = [], selectedStoreId: n, setSelectedStoreId: r }) => {
  const i = p(u.down.xs), l = s(
    ({ target: e }) => {
      r(e.value);
    },
    [r]
  ), m = (e) => e.item ? /* @__PURE__ */ o(a, { name: e.item.storeCode, description: e.item.description }) : null;
  return !t || !t.length || t.length === 1 ? null : /* @__PURE__ */ o(
    f,
    {
      className: "adyen-pe-dropdown__store",
      filterable: !1,
      items: t,
      multiSelect: !1,
      onChange: l,
      renderButtonContent: m,
      renderListItem: (e) => /* @__PURE__ */ o(c, { name: e.item.name, description: e.item.description }),
      selected: n,
      setToTargetWidth: i,
      showOverlay: !1,
      withoutCollapseIndicator: !0
    }
  );
};
export {
  v as StoreSelector
};
