stone-kit/dist/pages/SelectPage/SelectPage.js

uikit for redesign

import { jsxs as s, jsx as e } from "react/jsx-runtime";
import { useState as n } from "react";
import { SummarySelect as u } from "../../components/SummarySelect/ui/SummarySelect.js";
import { F as m, S as y } from "../../FilterWithSave-D4iIFzmS.js";
import { defaultOption as i, defaultCategory as a } from "./const.js";
import { CheckboxSelect as v } from "../../components/CheckboxSelect/ui/CheckboxSelect.js";
import { CheckBox as k } from "../../components/CheckBox/CheckBox.js";
import { Switcher as S } from "../../components/Switcher/ui/Switcher.js";
import { Select as c } from "../../components/Select/ui/Select.js";
const x = "_sort_1szg2_1", V = "_filterWithSave_1szg2_14", r = {
  sort: x,
  filterWithSave: V
}, F = () => {
  const [p, g] = n(i[0]), [t, b] = n([]), [o, h] = n("options"), f = [
    {
      label: "sdfsdfsdf",
      setValue: () => {
      },
      isSelected: !1,
      disabled: !0
    },
    {
      label: "sdfsdfsdf",
      setValue: () => {
      },
      isSelected: !0,
      disabled: !1
    },
    {
      label: "sdfsdfsdf",
      setValue: () => {
      },
      isSelected: !1,
      disabled: !1
    },
    {
      label: "sdfsdfsdf",
      setValue: () => {
      },
      isSelected: !0,
      disabled: !1
    },
    {
      label: "sdfsdfsdf",
      setValue: () => {
      },
      isSelected: !0,
      disabled: !1
    }
  ], C = (l) => {
    !l || !l.target || g(l.target.value);
  }, d = (l) => {
    l && b(l);
  };
  return /* @__PURE__ */ s("div", { className: r.root, children: [
    /* @__PURE__ */ s("div", { children: [
      /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
        m,
        {
          onClick: () => console.log("filter"),
          onSaveClick: () => console.log("save"),
          onClearClick: () => console.log("clear"),
          onTabClick: () => console.log("year"),
          tabs: [
            { value: "dfsdf", state: !1 },
            { value: "dfsdf", state: !1 },
            { value: "dfsdf", state: !1 },
            { value: "dfsdf", state: !1 },
            { value: "dfsdf", state: !1 },
            { value: "dfsdf", state: !1 },
            { value: "dddddddd", state: !1 }
          ]
        }
      ) }),
      /* @__PURE__ */ s("div", { children: [
        /* @__PURE__ */ e("h2", { children: " Селектор с чекбоксами" }),
        /* @__PURE__ */ e(v, { checkboxes: f })
      ] }),
      /* @__PURE__ */ s("div", { children: [
        /* @__PURE__ */ e("h2", { children: " Селектор с чекбоксами" }),
        /* @__PURE__ */ e(v, { checkboxes: f, isPromotion: !0 })
      ] }),
      /* @__PURE__ */ s("div", { children: [
        /* @__PURE__ */ e("h2", { children: "старый чекбокс" }),
        /* @__PURE__ */ e(
          k,
          {
            isChecked: !1,
            emitIsChecked: () => {
              console.log("check");
            }
          }
        )
      ] }),
      /* @__PURE__ */ s("div", { children: [
        /* @__PURE__ */ e("h2", { children: " Фильтрация с сохранением" }),
        /* @__PURE__ */ e("div", { className: r.filterWithSave, children: /* @__PURE__ */ e(m, {}) })
      ] }),
      /* @__PURE__ */ e("h2", { children: "Сорт селект" }),
      /* @__PURE__ */ e("div", { className: r.sort, children: /* @__PURE__ */ e(
        y,
        {
          mini: !0,
          selectedOption: p,
          options: i,
          onChange: (l) => C(l)
        }
      ) })
    ] }),
    /* @__PURE__ */ s("div", { className: r.summarySelect, children: [
      /* @__PURE__ */ s("div", { style: { display: "flex", gap: "20px" }, children: [
        /* @__PURE__ */ e("h2", { children: "SummarySelect" }),
        /* @__PURE__ */ e(
          S,
          {
            isActive: o === "category",
            onClick: () => h(o === "options" ? "category" : "options"),
            children: "mode category"
          }
        ),
        /* @__PURE__ */ e(
          S,
          {
            isActive: o === "double",
            onClick: () => h(o === "options" ? "double" : "options"),
            children: "mode double"
          }
        )
      ] }),
      /* @__PURE__ */ e(
        u,
        {
          mode: o,
          label: "Проект",
          isShowReset: !0,
          selectedValues: t,
          options: o === "category" ? a : i,
          onChange: (l) => d(l),
          selectAll: { enabled: !0 }
        }
      ),
      /* @__PURE__ */ e(
        u,
        {
          mode: "single",
          label: "Проект",
          isShowReset: !0,
          selectedValues: t,
          options: i,
          onChange: (l) => d(l)
        }
      )
    ] }),
    /* @__PURE__ */ s("div", { children: [
      /* @__PURE__ */ e("h2", { children: "Селект mode option" }),
      /* @__PURE__ */ e(
        c,
        {
          selectedValues: t,
          options: a,
          onChange: (l) => d(l)
        }
      )
    ] }),
    /* @__PURE__ */ s("div", { children: [
      /* @__PURE__ */ e("h2", { children: "Селект mode category" }),
      /* @__PURE__ */ e(
        c,
        {
          mode: "category",
          selectedValues: t,
          options: a,
          onChange: (l) => d(l)
        }
      )
    ] }),
    /* @__PURE__ */ s("div", { children: [
      /* @__PURE__ */ e("h2", { children: "Селект mode double" }),
      /* @__PURE__ */ e(
        c,
        {
          selectAll: { enabled: !0 },
          selectedValues: t,
          options: a,
          mode: "double",
          clickableOptions: ["Category1", "options1", "options3"],
          onChange: (l) => d(l)
        }
      )
    ] }),
    /* @__PURE__ */ s("div", { children: [
      /* @__PURE__ */ e("h2", { children: "Селект кнопка" }),
      /* @__PURE__ */ e("div", { style: { display: "flex", justifyContent: "flex-end" }, children: /* @__PURE__ */ e(
        c,
        {
          isBtn: !0,
          size_s: "small",
          size_l: "medium",
          isListRight: !0,
          selectedValues: t,
          options: i,
          onChange: (l) => d(l)
        }
      ) })
    ] })
  ] });
};
export {
  F as SelectPage
};