"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
require("@emotion/react");
const React = require("react");
const jsxRuntime = require("@emotion/react/jsx-runtime");
const SelectWrap = require("./SelectWrap.js");
const down = require("../../../assets/icon/down.svg.js");
const index = require("../../Input/index.js");
const useClickOutSide = require("../../../utils/useClickOutSide.js");
const uuid = require("../../../utils/uuid.js");
const Select = ({
  defaultOptionIdx,
  options,
  onChange,
  usei18 = false,
  label,
  width = "100%"
}) => {
  const [selectorVisible, setSelectorVisible] = React.useState(false);
  const [selectIdx, setSelectIdx] = React.useState(defaultOptionIdx || 0);
  const ref = React.useRef(null);
  useClickOutSide.useClickOutside(ref, () => {
    setSelectorVisible(false);
  });
  return /* @__PURE__ */ jsxRuntime.jsx(
    SelectWrap.SelectWrap,
    {
      haveLabel: label !== void 0,
      width,
      selectorVisible,
      children: /* @__PURE__ */ jsxRuntime.jsxs(
        "div",
        {
          className: "selectContainer",
          onClick: (e) => {
            e.stopPropagation();
            setSelectorVisible(!selectorVisible);
          },
          ref,
          children: [
            /* @__PURE__ */ jsxRuntime.jsx("img", { src: down, className: "icon" }),
            label && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "inputLabel", children: label }),
            /* @__PURE__ */ jsxRuntime.jsx(
              index.Input,
              {
                value: usei18 ? `${options[selectIdx].name}` : options[selectIdx].name,
                readOnly: true
              }
            ),
            selectorVisible && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "selector", children: options.map((option, idx) => /* @__PURE__ */ jsxRuntime.jsx(
              "div",
              {
                className: "optionContainer",
                onClick: () => {
                  setSelectIdx(idx);
                  onChange == null ? void 0 : onChange(options[idx]);
                  setSelectorVisible(false);
                },
                children: usei18 ? option.name : option.name
              },
              `option${uuid.uuid()}`
            )) })
          ]
        }
      )
    }
  );
};
exports.Select = Select;
//# sourceMappingURL=index.js.map
