stone-kit 0.0.487 → 0.0.488

package/dist/components/Select/ui/Select.d.ts

@@ -1,4 +1,3 @@
-import { default as React } from 'react';
 import { MultiSelectProps } from './Select.types';
 
-export declare const Select: React.NamedExoticComponent<MultiSelectProps>;
+export declare const Select: ({ options, placeholder, error, disabled, disabledOptions, additionalClass, additionalClassOption, additionalClassBtn, onChange, onBlur, selectedValues, isBtn, btnName, clickableOptions, isListRight, sizeIcon, }: MultiSelectProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Select/ui/Select.js

@@ -1,137 +1,138 @@
-import { jsxs as r, Fragment as D, jsx as n } from "react/jsx-runtime";
-import { memo as U, useState as W, useRef as E, useCallback as h, useEffect as R } from "react";
-import { c as $ } from "../../../index-rKuIKazb.js";
-import { NewIcon as b } from "../../NewIcon/ui/NewIcon.js";
-const q = "_multiSelectWrapper_11it8_1", A = "_selectedOptions_11it8_8", G = "_selectedOptionsBtn_11it8_27", H = "_selectedOptionsOpened_11it8_31", J = "_selectedOptionsNotEmpty_11it8_35", K = "_selectOptionsDisabled_11it8_40", M = "_optionsList_11it8_47", P = "_listRight_11it8_63", Q = "_inputWrapper_11it8_67", T = "_option_11it8_47", X = "_optionDisabled_11it8_88", Y = "_optionClickable_11it8_92", Z = "_icon_11it8_96", e = {
-  multiSelectWrapper: q,
-  selectedOptions: A,
-  selectedOptionsBtn: G,
-  selectedOptionsOpened: H,
-  selectedOptionsNotEmpty: J,
-  selectOptionsDisabled: K,
-  optionsList: M,
-  listRight: P,
-  inputWrapper: Q,
-  option: T,
-  optionDisabled: X,
-  optionClickable: Y,
-  icon: Z
-}, c = $.bind(e), V = ({
+import { jsxs as a, Fragment as C, jsx as n } from "react/jsx-runtime";
+import { useState as S, useRef as D, useEffect as W } from "react";
+import { c as F } from "../../../index-rKuIKazb.js";
+import { NewIcon as O } from "../../NewIcon/ui/NewIcon.js";
+const I = "_multiSelectWrapper_11it8_1", U = "_selectedOptions_11it8_8", $ = "_selectedOptionsBtn_11it8_27", q = "_selectedOptionsOpened_11it8_31", A = "_selectedOptionsNotEmpty_11it8_35", G = "_selectOptionsDisabled_11it8_40", H = "_optionsList_11it8_47", J = "_listRight_11it8_63", K = "_inputWrapper_11it8_67", M = "_option_11it8_47", P = "_optionDisabled_11it8_88", Q = "_optionClickable_11it8_92", T = "_icon_11it8_96", e = {
+  multiSelectWrapper: I,
+  selectedOptions: U,
+  selectedOptionsBtn: $,
+  selectedOptionsOpened: q,
+  selectedOptionsNotEmpty: A,
+  selectOptionsDisabled: G,
+  optionsList: H,
+  listRight: J,
+  inputWrapper: K,
+  option: M,
+  optionDisabled: P,
+  optionClickable: Q,
+  icon: T
+}, c = F.bind(e), ee = ({
   options: p,
-  placeholder: L = "Выберите опции",
-  error: x,
-  disabled: g,
-  disabledOptions: k = [],
-  additionalClass: y = "",
-  additionalClassOption: w,
-  additionalClassBtn: j,
-  onChange: d,
-  onBlur: m,
+  placeholder: E = "Выберите опции",
+  error: R,
+  disabled: h,
+  disabledOptions: v = [],
+  additionalClass: L = "",
+  additionalClassOption: x,
+  additionalClassBtn: y,
+  onChange: f,
+  onBlur: g,
   selectedValues: l = [],
-  isBtn: _ = !1,
-  btnName: B,
-  clickableOptions: N,
-  isListRight: z = !1,
-  sizeIcon: u
+  isBtn: d = !1,
+  btnName: w,
+  clickableOptions: b,
+  isListRight: B = !1,
+  sizeIcon: _
 }) => {
-  const [s, S] = W(l), [o, O] = W(!1), v = E(null), F = h(
-    (t) => () => {
-      if (k.some((a) => a.value === t.value))
-        return;
-      const i = s.some((a) => a.value === t.value) ? s.filter((a) => a.value !== t.value) : [...s, t];
-      S(i), d && d(i);
-    },
-    [s, d]
-  ), f = h((t) => {
-    if (v.current && !v.current.contains(t.target)) {
-      if (t.target.closest("svg"))
-        return;
-      O(!1);
-    }
-  }, []), I = h(() => {
-    m && m(s);
-  }, [s, m]);
-  R(() => (document.addEventListener("click", f), () => {
-    document.removeEventListener("click", f);
-  }), [f]);
-  const C = E(l);
-  return R(() => {
-    l.length !== C.current.length && (S(l), C.current = l);
-  }, [l]), /* @__PURE__ */ r(
+  const [i, k] = S(l), [o, m] = S(!1), u = D(null), j = (t) => () => {
+    if (v.includes(t))
+      return;
+    const s = i.some((r) => r.value === t.value) ? i.filter((r) => r.value !== t.value) : [...i, t];
+    k(s), f && f(s);
+  }, z = () => {
+    g && g(i);
+  };
+  W(() => {
+    const t = (s) => {
+      const r = s.target;
+      if (u.current && !u.current.contains(s.target)) {
+        if (r.closest("svg"))
+          return;
+        m(!1);
+      }
+    };
+    return document.addEventListener("click", t), () => {
+      document.removeEventListener("click", t);
+    };
+  }, []);
+  const N = D(l);
+  return W(() => {
+    l.length !== N.current.length && (k(l), N.current = l);
+  }, [l]), /* @__PURE__ */ a(
     "div",
     {
-      ref: v,
-      className: c(e.multiSelectWrapper, { [e.multiSelectWrapperError]: x }, y),
+      ref: u,
+      className: c(e.multiSelectWrapper, { [e.multiSelectWrapperError]: R }, L),
       tabIndex: 0,
-      onBlur: I,
+      onBlur: z,
       children: [
-        /* @__PURE__ */ r("div", { className: c(e.inputWrapper), children: [
-          !_ && /* @__PURE__ */ r(D, { children: [
+        /* @__PURE__ */ a("div", { className: c(e.inputWrapper), children: [
+          !d && /* @__PURE__ */ a(C, { children: [
             /* @__PURE__ */ n(
               "div",
               {
                 className: c(
                   e.selectedOptions,
-                  { [e.selectedOptionsNotEmpty]: s.length > 0 },
-                  { [e.selectOptionsDisabled]: g }
+                  { [e.selectedOptionsNotEmpty]: i.length > 0 },
+                  { [e.selectOptionsDisabled]: h }
                 ),
-                onClick: () => O(!o),
-                children: s.length === 0 ? L : "Выбрано " + s.length
+                onClick: () => m(!o),
+                children: i.length === 0 ? E : "Выбрано " + i.length
               }
             ),
             /* @__PURE__ */ n(
-              b,
+              O,
               {
                 name: "arrowShort",
                 deg: o ? "180" : "0",
-                size: u ?? "24",
+                size: _ ?? "24",
                 additionalClass: e.icon
               }
             )
           ] }),
-          _ && /* @__PURE__ */ r(D, { children: [
+          d && /* @__PURE__ */ a(C, { children: [
             /* @__PURE__ */ n(
               "button",
               {
                 className: c(
                   e.selectedOptions,
                   e.selectedOptionsBtn,
-                  { [e.selectOptionsDisabled]: g },
-                  j
+                  { [e.selectOptionsDisabled]: h },
+                  y
                 ),
-                onClick: () => O(!o),
-                children: B
+                onClick: () => m(!o),
+                children: w
               }
             ),
             /* @__PURE__ */ n(
-              b,
+              O,
               {
                 name: "filter",
                 deg: o ? "180" : "0",
-                size: u ?? "24",
+                size: _ ?? "24",
                 additionalClass: e.icon
               }
             )
           ] })
         ] }),
-        o && /* @__PURE__ */ n("div", { className: c(e.optionsList, { [e.listRight]: z }, w), children: p == null ? void 0 : p.map((t) => /* @__PURE__ */ r(
+        o && /* @__PURE__ */ n("div", { className: c(e.optionsList, { [e.listRight]: B }, x), children: p == null ? void 0 : p.map((t) => /* @__PURE__ */ a(
           "div",
           {
             className: c(e.option, {
-              [e.selected]: s.some((i) => i.value === t.value),
-              [e.optionDisabled]: k.some(
-                (i) => i.value === t.value
+              [e.selected]: i.some((s) => s.value === t.value),
+              [e.optionDisabled]: v.some(
+                (s) => s.value === t.value
               ),
-              [e.optionClickable]: N && N.includes(`${t.value}`) || _
+              [e.optionClickable]: b && b.includes(`${t.value}`) || d
             }),
-            onClick: F(t),
+            onClick: j(t),
             children: [
               /* @__PURE__ */ n("div", { children: t.label }),
               /* @__PURE__ */ n(
-                b,
+                O,
                 {
-                  size: u ?? "20",
-                  name: s.some((i) => i.value === t.value) ? "selectChecked" : "selectUnchecked"
+                  size: _ ?? "20",
+                  name: i.some((s) => s.value === t.value) ? "selectChecked" : "selectUnchecked"
                 }
               )
             ]
@@ -141,8 +142,7 @@ const q = "_multiSelectWrapper_11it8_1", A = "_selectedOptions_11it8_8", G = "_s
       ]
     }
   );
-}, ee = U(V);
-ee.displayName = "Select";
+};
 export {
   ee as Select
 };

package/dist/components/Select/ui/Select.types.d.ts

@@ -1,24 +1,69 @@
-export interface Option {
+export type Option = {
     value: string | number;
     label: string;
-}
+};
+export type Categories = {
+    options: Option[];
+};
+export type TModeSelect = 'options' | 'categories';
 export interface MultiSelectProps {
+    /**
+     * Опции (могут быть опции или категории опций)
+     *
+     * @default false
+     */
     options?: Option[];
     placeholder?: string;
     error?: boolean;
     disabled?: boolean;
+    /**
+     * Доп стили для родителя-контейнера
+     *
+     * @default false
+     */
     additionalClass?: string;
+    /**
+     * Доп стили для каждой опции
+     *
+     * @default false
+     */
     additionalClassOption?: string;
+    /**
+     * Доп стили для кнопки-контейнера
+     *
+     * @default false
+     */
     additionalClassBtn?: string;
     onChange?: (selectedOptions: Option[]) => unknown;
     onBlur?: (selectedOptions: Option[]) => unknown;
+    /**
+     * Значения
+     *
+     * @default false
+     */
     selectedValues?: Option[];
     isBtn?: boolean;
     btnName?: string;
     widthBtn?: string;
+    /**
+     * Ширина
+     *
+     * @default false
+     */
     widthOptionList?: string;
     isListRight?: boolean;
+    /**
+     * Список опций которые будут задизейблены по умолчанию
+     *
+     * @default false
+     */
     disabledOptions?: Option[];
+    /**
+     * Да...
+     *
+     * @default false
+     */
     clickableOptions?: (string | undefined)[];
     sizeIcon?: string;
+    mode?: TModeSelect;
 }

package/package.json

@@ -2,7 +2,7 @@
   "name": "stone-kit",
   "description": "uikit for redesign",
   "private": false,
-  "version": "0.0.487",
+  "version": "0.0.488",
   "author": "Mollycodd1e",
   "license": "ISC",
   "type": "module",