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

uikit for redesign

import { jsxs as d, jsx as c } from "react/jsx-runtime";
import { useState as r } from "react";
import { CheckBox as i } from "../../components/CheckBox/CheckBox.js";
const P = "_root_1br5a_1", q = "_wrapper_1br5a_5", A = "_lighContainer_1br5a_11", F = "_darkContainer_1br5a_11", h = {
  root: P,
  wrapper: q,
  lighContainer: A,
  darkContainer: F
}, K = () => {
  const [t, k] = r(!0), [s, n] = r(!1), [a, l] = r(!0), [o, m] = r(!1), [u, g] = r(!0), [C, _] = r(!1), [L, D] = r(!1), [z, I] = r(!0), [M, f] = r(!0), [p, v] = r(!1), [S, E] = r(!0), [U, b] = r(!1), [x, w] = r(!0), [N, y] = r(!1), [B, W] = r(!1), [j, T] = r(!0);
  return /* @__PURE__ */ d("div", { className: h.root, children: [
    /* @__PURE__ */ c("div", { style: { fontWeight: "bold" }, children: "CheckBox variants:" }),
    /* @__PURE__ */ d("div", { className: h.wrapper, children: [
      /* @__PURE__ */ d("div", { className: h.lighContainer, children: [
        /* @__PURE__ */ c("div", { style: { fontWeight: "bold", marginTop: 16 }, children: "Light variant:" }),
        /* @__PURE__ */ c(
          i,
          {
            isChecked: a,
            emitIsChecked: (e) => {
              l(e), console.log("checked light large", e);
            },
            variant: "light",
            size_l: !0,
            children: "light / large / checked"
          }
        ),
        /* @__PURE__ */ c(
          i,
          {
            isChecked: o,
            emitIsChecked: (e) => {
              m(e), console.log("unchecked light large", e);
            },
            variant: "light",
            size_l: !0,
            children: "light / large / unchecked"
          }
        ),
        /* @__PURE__ */ d(
          i,
          {
            isChecked: t,
            emitIsChecked: (e) => {
              k(e), console.log("checked light medium", e);
            },
            variant: "light",
            size_m: !0,
            children: [
              "light / medium / checked",
              " "
            ]
          }
        ),
        /* @__PURE__ */ c(
          i,
          {
            isChecked: s,
            emitIsChecked: (e) => {
              n(e), console.log("unchecked light medium", e);
            },
            variant: "light",
            size_m: !0,
            children: "light / medium / unchecked"
          }
        ),
        /* @__PURE__ */ c(
          i,
          {
            isChecked: u,
            emitIsChecked: (e) => {
              g(e), console.log("checked light small", e);
            },
            variant: "light",
            size_s: !0,
            children: "light / small / checked"
          }
        ),
        /* @__PURE__ */ c(
          i,
          {
            isChecked: C,
            emitIsChecked: (e) => {
              _(e), console.log("unchecked light small", e);
            },
            variant: "light",
            size_s: !0,
            children: "light / small / unchecked"
          }
        ),
        /* @__PURE__ */ c(
          i,
          {
            isChecked: L,
            emitIsChecked: (e) => {
              D(e), console.log("unchecked light medium", e);
            },
            variant: "light",
            error: !0,
            size_m: !0,
            children: "light / medium / unchecked / error"
          }
        ),
        /* @__PURE__ */ c(
          i,
          {
            isChecked: z,
            emitIsChecked: (e) => {
              I(e), console.log("unchecked light medium", e);
            },
            variant: "light",
            error: !0,
            size_m: !0,
            children: "light / medium / unchecked / error"
          }
        )
      ] }),
      /* @__PURE__ */ d("div", { className: h.darkContainer, children: [
        /* @__PURE__ */ c("div", { style: { fontWeight: "bold", marginTop: 16 }, children: "Dark variant:" }),
        /* @__PURE__ */ c(
          i,
          {
            isChecked: S,
            emitIsChecked: (e) => {
              E(e), console.log("checked dark large", e);
            },
            variant: "dark",
            size_l: !0,
            children: "dark / large / checked"
          }
        ),
        /* @__PURE__ */ c(
          i,
          {
            isChecked: U,
            emitIsChecked: (e) => {
              b(e), console.log("unchecked dark large", e);
            },
            variant: "dark",
            size_l: !0,
            children: "dark / large / unchecked"
          }
        ),
        /* @__PURE__ */ c(
          i,
          {
            isChecked: M,
            emitIsChecked: (e) => {
              f(e), console.log("checked dark medium", e);
            },
            variant: "dark",
            size_m: !0,
            children: "dark / medium / checked"
          }
        ),
        /* @__PURE__ */ c(
          i,
          {
            isChecked: p,
            emitIsChecked: (e) => {
              v(e), console.log("unchecked dark medium", e);
            },
            variant: "dark",
            size_m: !0,
            children: "dark / medium / unchecked"
          }
        ),
        /* @__PURE__ */ c(
          i,
          {
            isChecked: x,
            emitIsChecked: (e) => {
              w(e), console.log("checked dark small", e);
            },
            variant: "dark",
            size_s: !0,
            children: "dark / small / checked"
          }
        ),
        /* @__PURE__ */ c(
          i,
          {
            isChecked: N,
            emitIsChecked: (e) => {
              y(e), console.log("unchecked dark small", e);
            },
            variant: "dark",
            size_s: !0,
            children: "dark / small / unchecked"
          }
        ),
        /* @__PURE__ */ c(
          i,
          {
            isChecked: B,
            emitIsChecked: (e) => {
              W(e), console.log("unchecked dark medium", e);
            },
            variant: "dark",
            size_m: !0,
            error: !0,
            children: "dark / medium / unchecked / error"
          }
        ),
        /* @__PURE__ */ c(
          i,
          {
            isChecked: j,
            emitIsChecked: (e) => {
              T(e), console.log("unchecked dark medium", e);
            },
            variant: "dark",
            size_m: !0,
            error: !0,
            children: "dark / medium / checked / error"
          }
        )
      ] })
    ] })
  ] });
};
export {
  K as CheckBoxPage
};