import { j as n } from "../../../../../../../_virtual/jsx-runtime.js";
import c from "../../../../../../../node_modules/.pnpm/react-select@5.10.1_@types_react@18.3.3_react-dom@18.3.0-canary-3d9b20132-20240124_reac_11750499356771f030ba7ab2c97fa340/node_modules/react-select/dist/react-select.esm.js";
import { useState as p } from "react";
import { tx as o, css as m } from "../../../../../../style-system/dist/twind.js";
import { useFonts as d, getFontLabel as g } from "../../../hooks/use-fonts.js";
import { c as h } from "../../../../../../../node_modules/.pnpm/react-select@5.10.1_@types_react@18.3.3_react-dom@18.3.0-canary-3d9b20132-20240124_reac_11750499356771f030ba7ab2c97fa340/node_modules/react-select/dist/Select-aab027f3.esm.js";
const x = ({ data: e }) => /* @__PURE__ */ n.jsx("div", { className: "px-2 py-1 text-xs bg-gray-200 text-gray-600", children: e.group });
function C({ initialValue: e, onChange: s, fontType: i }) {
  const [r, l] = p(e), a = d(i), u = {
    control: (t) => (t.isFocused, "outline-none bg-white rounded !min-h-full border border-gray-300"),
    valueContainer: () => "bg-white px-2.5",
    placeholder: () => "text-sm bg-white",
    input: () => "text-sm outline-none !focus:outline-none !focus-within:outline-none [&>input]:focus:ring-0 [&>input]:focus-within:ring-0",
    container: () => "text-sm h-8",
    menu: () => "text-sm bg-white shadow-2xl rounded py-1",
    menuList: () => m({
      scrollbarColor: "var(--violet-4) var(--violet-2)",
      scrollBehavior: "smooth",
      scrollbarWidth: "thin",
      "&:hover": {
        scrollbarColor: "var(--violet-7) var(--violet-3)"
      }
    }),
    loadingMessage(t) {
      return o("text-sm py-2");
    },
    indicatorsContainer: () => "text-sm pr-1.5 font-normal scale-75",
    option: (t) => t.isSelected ? o("bg-upstart-100 px-2 py-1.5") : o("bg-white px-2 py-1.5 hover:(bg-upstart-600 text-white)")
  };
  return /* @__PURE__ */ n.jsx(
    c,
    {
      unstyled: !0,
      filterOption: h({ ignoreAccents: !1, matchFrom: "start", ignoreCase: !0 }),
      defaultValue: { ...r, label: g(r) },
      onChange: (t) => {
        t !== null && (l(t.value), s(t.value));
      },
      classNames: u,
      components: {
        // @ts-ignore
        GroupHeading: x
        // Uncomment this to use react-window
        // MenuList, Option
      },
      options: a
    }
  );
}
export {
  C as default
};
//# sourceMappingURL=font.js.map
