stone-kit 0.0.1105 → 0.0.1107

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

@@ -1,95 +1,212 @@
-import { jsxs as u, jsx as l } from "react/jsx-runtime";
-import { memo as D, useState as h, useRef as E, useCallback as v, useEffect as f } from "react";
-import { c as w } from "../../../index-DIxK0V-G.js";
-import { NewIcon as S } from "../../NewIcon/ui/NewIcon.js";
-const y = "_multiSelectWrapper_1hlrv_1", I = "_selectedOptions_1hlrv_7", g = "_selectedOptionsOpened_1hlrv_28", j = "_selectOptionsDisabled_1hlrv_32", z = "_optionsList_1hlrv_39", R = "_inputWrapper_1hlrv_54", U = "_option_1hlrv_39", q = "_icon_1hlrv_76", s = {
-  multiSelectWrapper: y,
-  selectedOptions: I,
-  selectedOptionsOpened: g,
-  selectOptionsDisabled: j,
-  optionsList: z,
-  inputWrapper: R,
-  option: U,
-  icon: q
-}, c = w.bind(s), A = ({
-  options: k,
-  placeholder: W = "Выберите опции",
-  error: b,
-  disabled: N,
-  additionalClass: x = "",
-  onChange: i,
-  onBlur: o,
-  selectedValues: r = []
+import { jsxs as d, jsx as t, Fragment as F } from "react/jsx-runtime";
+import { useState as M, useRef as T, useEffect as k } from "react";
+import { c as re } from "../../../index-YnD2EP-S.js";
+import { s as e, O as q } from "../../../Option-DmDx_xOt.js";
+import { Category as te } from "./Category.js";
+import { handleClickModeOption as ne, handleClickModeCategory as le } from "../model/selectMode.js";
+import { NewIcon as y } from "../../NewIcon/ui/NewIcon.js";
+const c = re.bind(e), pe = ({
+  options: n,
+  customPlaceholder: S,
+  placeholder: D = "Выберите опции",
+  error: G,
+  disabled: $,
+  disabledOptions: p = [],
+  additionalClass: H = "",
+  additionalClassOption: J,
+  additionalClassBtn: K,
+  onChange: Q,
+  onBlur: A,
+  selectedValues: s = [],
+  isBtn: C = !1,
+  btnName: N,
+  clickableOptions: f,
+  isListRight: U = !1,
+  sizeIcon: m,
+  mode: o = "options",
+  onClickItem: x,
+  onCLickSelect: w,
+  size_s: E = "large",
+  size_m: W,
+  size_l: R,
+  betweenSize: X = "small",
+  isDisabledNotClickable: u,
+  isLast: Y,
+  isPositionLeftCheckbox: z,
+  selectAll: L,
+  scrollVersion: Z = "compact",
+  isLoading: I = !1,
+  selectPaddingBottom: h
 }) => {
-  const [t, _] = h(r), [a, O] = h(!1), p = E(null), C = v(
-    (e) => () => {
-      const n = t.some((m) => m.value === e.value) ? t.filter((m) => m.value !== e.value) : [...t, e];
-      _(n), i && i(n);
-    },
-    [t, i]
-  ), d = v((e) => {
-    p.current && !p.current.contains(e.target) && O(!1);
-  }, []), L = v(() => {
-    o && o(t);
-  }, [t, o]);
-  return f(() => (document.addEventListener("click", d), () => {
-    document.removeEventListener("click", d);
-  }), [d]), f(() => {
-    _(r);
-  }, [r]), /* @__PURE__ */ u(
+  const P = { value: "selectAll", label: L?.label ?? "Выбрать все" }, b = () => L?.enabled && n && n.length > 0 ? [P, .../* @__PURE__ */ new Set([...n])] : [.../* @__PURE__ */ new Set([...n])];
+  n = Array.isArray(n) ? b() : [];
+  const [a, _] = M(s), [i, g] = M(!1), v = T(null), V = a.filter((r) => r.value !== "selectAll").length, O = (r) => {
+    x && x(r);
+    const l = {
+      option: r,
+      selectedOptions: a,
+      disabledOptions: p,
+      setSelectedOptions: _,
+      onChange: Q,
+      mode: o,
+      optionsParentArr: n,
+      clickableOptions: f,
+      isDisabledNotClickable: u
+    };
+    Array.isArray(r) ? le(l) : ne(l);
+  }, ee = () => {
+    A && A(a);
+  }, j = (r) => {
+    const l = r.target;
+    if (v.current && !v.current.contains(r.target)) {
+      if (l.closest("svg"))
+        return;
+      g(!1);
+    }
+  };
+  k(() => (document.addEventListener("click", j), () => {
+    document.removeEventListener("click", j);
+  }), [i]);
+  const B = T(s);
+  return k(() => {
+    s.length !== B.current.length && (_(s), B.current = s);
+  }, [s]), /* @__PURE__ */ d(
     "div",
     {
-      ref: p,
-      className: c(s.multiSelectWrapper, { [s.multiSelectWrapperError]: b }, x),
+      ref: v,
+      className: c(e.multiSelectWrapper, { [e.multiSelectWrapperError]: G }, H),
+      style: h !== void 0 && i ? {
+        paddingBottom: `${h}px`,
+        marginBottom: `-${h}px`
+      } : void 0,
       tabIndex: 0,
-      onBlur: L,
+      onBlur: ee,
       children: [
-        /* @__PURE__ */ u("div", { className: c(s.inputWrapper), children: [
-          /* @__PURE__ */ l(
-            "input",
-            {
-              type: "text",
-              readOnly: !0,
-              value: t.length === 0 ? W : "Выбрано " + t.length + " опции",
-              className: c(s.selectedOptions, { [s.selectOptionsDisabled]: N }),
-              onClick: () => O(!a)
-            }
-          ),
-          /* @__PURE__ */ l(
-            S,
-            {
-              name: "arrowShort",
-              deg: a ? "180" : "0",
-              size: "24",
-              additionalClass: s.icon
-            }
-          )
+        /* @__PURE__ */ d("div", { className: c(e.inputWrapper), children: [
+          !C && /* @__PURE__ */ d(F, { children: [
+            /* @__PURE__ */ t(
+              "div",
+              {
+                className: c(
+                  e.selectedOptions,
+                  e[`${E}-size`],
+                  e[`${W}-size_m`],
+                  e[`${R}-size)_l`],
+                  { [e.selectedOptionsNotEmpty]: a.length > 0 },
+                  { [e.selectOptionsDisabled]: $ }
+                ),
+                onClick: () => g(!i),
+                children: /* @__PURE__ */ t("div", { className: e.selectedText, children: S || (a.length === 0 ? D : "Выбрано " + V) })
+              }
+            ),
+            /* @__PURE__ */ t(
+              y,
+              {
+                name: "arrowShort",
+                deg: i ? "180" : "0",
+                size: m ?? "24",
+                additionalClass: e.icon
+              }
+            )
+          ] }),
+          C && /* @__PURE__ */ d(F, { children: [
+            /* @__PURE__ */ t(
+              "button",
+              {
+                className: c(
+                  e.selectedOptions,
+                  e[`${E}-size`],
+                  e[`${W}-size_m`],
+                  e[`${R}-size_l`],
+                  e.selectedOptionsBtn,
+                  { [e.selectOptionsDisabled]: $ },
+                  K
+                ),
+                onClick: () => {
+                  w && w(), g(!i);
+                },
+                children: N
+              }
+            ),
+            /* @__PURE__ */ t(
+              y,
+              {
+                name: "filter",
+                deg: i ? "180" : "0",
+                size: m ?? "24",
+                additionalClass: c(e.icon, { [e.iconBtn]: !N })
+              }
+            )
+          ] })
         ] }),
-        a && /* @__PURE__ */ l("div", { className: s.optionsList, children: k.map((e) => /* @__PURE__ */ u(
+        i && /* @__PURE__ */ t("div", { className: c(
+          e.optionsOuterContainer,
+          e[`betweenSize_${X}`],
+          { [e.listRight]: U },
+          { [e.lastList]: Y },
+          J
+        ), children: I ? /* @__PURE__ */ t("div", { className: e.loaderWrapper, children: /* @__PURE__ */ t(
+          y,
+          {
+            name: "loader",
+            size: "24",
+            color: "currentColor",
+            additionalClass: e.loader
+          }
+        ) }) : !n || n.length === 0 ? /* @__PURE__ */ t("div", { className: e.emptyStateWrapper, children: "Список пуст" }) : /* @__PURE__ */ d(
           "div",
           {
-            className: c(s.option, {
-              [s.selected]: t.some((n) => n.value === e.value)
-            }),
-            onClick: C(e),
+            className: c(e.optionsList, e[`scroll_${Z}`]),
             children: [
-              /* @__PURE__ */ l("div", { children: e.label }),
-              /* @__PURE__ */ l(
-                S,
+              (o === "options" || o === "single") && n?.map((r, l) => /* @__PURE__ */ t(
+                q,
+                {
+                  disabledOptions: p,
+                  clickableOptions: f,
+                  selectedOptions: a,
+                  sizeIcon: m,
+                  option: r,
+                  isPositionLeftCheckbox: z,
+                  handleOptionClick: O,
+                  isDisabledNotClickable: u
+                },
+                l
+              )),
+              (o === "category" || o === "double") && n?.map((r, l) => "options" in r ? /* @__PURE__ */ t(
+                te,
                 {
-                  size: "20",
-                  name: t.some((n) => n.value === e.value) ? "selectChecked" : "selectUnchecked"
-                }
-              )
+                  disabledOptions: p,
+                  clickableOptions: f,
+                  selectedOptions: a,
+                  sizeIcon: m,
+                  category: r,
+                  mode: o,
+                  selectedValues: s,
+                  handleOptionClick: O,
+                  isDisabledNotClickable: u
+                },
+                l
+              ) : r.value === "selectAll" ? /* @__PURE__ */ t(
+                q,
+                {
+                  disabledOptions: p,
+                  clickableOptions: f,
+                  selectedOptions: a,
+                  isPositionLeftCheckbox: z,
+                  sizeIcon: m,
+                  option: r,
+                  handleOptionClick: O,
+                  isDisabledNotClickable: u
+                },
+                l
+              ) : null)
             ]
-          },
-          e.value
-        )) })
+          }
+        ) })
       ]
     }
   );
-}, B = D(A);
-B.displayName = "Select";
+};
 export {
-  B as Select
+  pe as Select
 };

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

@@ -1,14 +1,70 @@
-export interface Option {
+export type TOption = {
     value: string | number;
     label: string;
-}
+    parent?: string;
+    id?: number | string;
+};
+export type TCategory = {
+    value: string | number;
+    label: string;
+    options: TOption[];
+};
+export type TModeSelect = 'options' | 'category' | 'double' | 'single';
+type SelectSizes = 'medium' | 'small' | 'large';
+type BetweenSize = 'small' | 'medium';
+type ScrollVersion = 'standard' | 'compact';
 export interface MultiSelectProps {
-    options: Option[];
+    options: TOption[] | TCategory[];
+    category?: TCategory[];
     placeholder?: string;
     error?: boolean;
     disabled?: boolean;
+    betweenSize?: BetweenSize;
+    size_s?: SelectSizes;
+    size_m?: SelectSizes;
+    size_l?: SelectSizes;
+    /**
+     * Доп стили для родителя-контейнера
+     */
     additionalClass?: string;
-    onChange?: (selectedOptions: Option[]) => void;
-    onBlur?: (selectedOptions: Option[]) => void;
-    selectedValues?: Option[];
+    /**
+     * Доп стили для каждой опции
+     */
+    additionalClassOption?: string;
+    /**
+     * Доп стили для кнопки-контейнера
+     */
+    additionalClassBtn?: string;
+    onChange?: (selectedOptions: TOption[]) => unknown;
+    onBlur?: (selectedOptions: TOption[]) => unknown;
+    selectedValues?: TOption[];
+    isBtn?: boolean;
+    btnName?: string;
+    widthBtn?: string;
+    widthOptionList?: string;
+    isListRight?: boolean;
+    isPositionLeftCheckbox?: boolean;
+    isLast?: boolean;
+    /**
+     * Список опций которые будут задизейблены по умолчанию
+     */
+    disabledOptions?: TOption[];
+    /**
+     * Список опций которые доступны для клика
+     */
+    clickableOptions?: (string | undefined)[];
+    sizeIcon?: string;
+    mode?: TModeSelect;
+    onClickItem?: (option: TOption | TOption[]) => void;
+    onCLickSelect?: () => void;
+    isDisabledNotClickable?: boolean;
+    customPlaceholder?: string;
+    selectAll?: {
+        enabled: boolean;
+        label?: string;
+    };
+    scrollVersion?: ScrollVersion;
+    isLoading?: boolean;
+    selectPaddingBottom?: number;
 }
+export {};

package/dist/components/SliderNavigation/index.d.ts

@@ -1,3 +1,2 @@
 import { SliderNavigation } from './ui/SliderNavigation.tsx';
-
 export { SliderNavigation };

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

@@ -1,3 +1,2 @@
 import { ISliderNavigation } from './SliderNavigation.types.ts';
-
-export declare const SliderNavigation: ({ indexSlide, goPrev, goNext, arr, additionalClassTag, navigationClassName, additionalClassNavButton }: ISliderNavigation) => import("react/jsx-runtime").JSX.Element;
+export declare const SliderNavigation: ({ indexSlide, isDisabledOff, goPrev, goNext, arr, isNeedTag, additionalClassTag, navigationClassName, additionalClassNavButton, size, size_m, size_l, }: ISliderNavigation) => import("react/jsx-runtime").JSX.Element;

package/dist/components/SliderNavigation/ui/SliderNavigation.js

@@ -1,52 +1,65 @@
-import { jsxs as m, jsx as i } from "react/jsx-runtime";
-import { RoundButton as s } from "../../RoundButton/ui/RoundButton.js";
-import { Tag as g } from "../../Tag/ui/Tag.js";
-import { useClientWidth as c } from "../../../shared/useClientWidth.js";
-const f = ({
+import { jsxs as f, jsx as r } from "react/jsx-runtime";
+import { useClientWidth as C } from "../../../shared/useClientWidth.js";
+import { c as T } from "../../../index-YnD2EP-S.js";
+import { RoundButton as d } from "../../RoundButton/ui/RoundButton.js";
+import { Tag as N } from "../../Tag/ui/Tag.js";
+const k = "_sliderTag_1rvl9_1", l = {
+  sliderTag: k
+}, v = T.bind(l), $ = ({
   indexSlide: o,
-  goPrev: n,
-  goNext: t,
+  isDisabledOff: s,
+  goPrev: m,
+  goNext: c,
   arr: e,
-  additionalClassTag: d = "",
-  navigationClassName: l = "",
-  additionalClassNavButton: a = ""
+  isNeedTag: g = !0,
+  additionalClassTag: p = "",
+  navigationClassName: u = "",
+  additionalClassNavButton: t = "",
+  size: n = "medium",
+  size_m: i = "medium",
+  size_l: a = "large"
 }) => {
-  const { isDesktop: r } = c();
-  return /* @__PURE__ */ m("div", { className: l, children: [
-    /* @__PURE__ */ i(
-      s,
+  const { isDesktop: h } = C();
+  return /* @__PURE__ */ f("div", { className: u, children: [
+    /* @__PURE__ */ r(
+      d,
       {
-        size: r ? "large" : "medium",
-        iconName: "arrowLong",
+        iconName: "directionDown",
         deg: "90",
-        disabled: o === 0,
-        additionalClass: a,
-        onClick: n
+        size: n,
+        size_m: i,
+        size_l: a,
+        disabled: s ? !1 : o === 0,
+        additionalClass: t,
+        onClick: m
       }
     ),
-    /* @__PURE__ */ i(
-      g,
+    g && /* @__PURE__ */ r(
+      N,
       {
-        style: { backgroundColor: "#141416" },
-        additionalClass: d,
+        additionalClass: v(l.sliderTag, p),
         variant: "shade",
-        size: "medium",
+        size: h ? "large" : "medium",
+        size_m: i,
+        size_l: a,
         children: `${o + 1} из ${e.length}`
       }
     ),
-    /* @__PURE__ */ i(
-      s,
+    /* @__PURE__ */ r(
+      d,
       {
-        disabled: o === e.length - 1,
-        size: r ? "large" : "medium",
-        iconName: "arrowLong",
+        disabled: s ? !1 : o === e.length - 1,
+        size: n,
+        size_m: i,
+        size_l: a,
+        iconName: "directionDown",
         deg: "-90",
-        additionalClass: a,
-        onClick: t
+        additionalClass: t,
+        onClick: c
       }
     )
   ] });
 };
 export {
-  f as SliderNavigation
+  $ as SliderNavigation
 };

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

@@ -1,3 +1,4 @@
+type Sizes = 'large' | 'medium' | 'small';
 export interface ISliderNavigation {
     indexSlide: number;
     goPrev: () => void;
@@ -6,4 +7,10 @@ export interface ISliderNavigation {
     additionalClassTag?: string;
     additionalClassNavButton?: string;
     navigationClassName?: string;
+    isNeedTag?: boolean;
+    isDisabledOff?: boolean;
+    size?: Sizes;
+    size_m?: Sizes;
+    size_l?: Sizes;
 }
+export {};

package/dist/components/SortSelect/hooks/useSortSelect.d.ts

@@ -1,11 +1,11 @@
 import { MouseEvent } from 'react';
 import { Option } from '../ui/SortSelect.types';
-
+import { TOption } from '../../Select/ui/Select.types.ts';
 interface IUseSortSelect {
     selectedOption: Option | null;
-    setSelectedOption: React.Dispatch<React.SetStateAction<Option | null>>;
+    setSelectedOption?: (event: Option | null) => void;
     setIsOpen: React.Dispatch<React.SetStateAction<boolean>>;
-    containerRef: React.RefObject<HTMLDivElement>;
+    containerRef: React.RefObject<HTMLDivElement | null>;
     isOpen: boolean;
     isMobile: boolean;
     placeholder: string;
@@ -13,12 +13,13 @@ interface IUseSortSelect {
         label: string;
         value: string;
     }) => void;
+    onClickOption?: (option: TOption | TOption[]) => void;
     onBlur?: (event: {
         label: string;
         value: string;
     }) => void;
 }
-export declare const useSortSelect: ({ selectedOption, setSelectedOption, setIsOpen, containerRef, onBlur, onChange, isMobile, placeholder, }: IUseSortSelect) => {
+export declare const useSortSelect: ({ selectedOption, setSelectedOption, setIsOpen, containerRef, onBlur, onChange, onClickOption, isMobile, placeholder, }: IUseSortSelect) => {
     handleDocumentClick: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
     handleBlur: (event: React.FocusEvent<HTMLDivElement>) => void;
     getInputValue: () => string;

package/dist/components/SortSelect/hooks/useSortSelect.js

@@ -1,6 +1,6 @@
 import "react/jsx-runtime";
-import { u as m } from "../../../useSortSelect-A7A_pNcU.js";
-import "../../../index-DIxK0V-G.js";
+import { u as m } from "../../../useSortSelect-IeonkD5d.js";
+import "../../../index-YnD2EP-S.js";
 export {
   m as useSortSelect
 };

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

@@ -1,4 +1,3 @@
 import { default as React } from 'react';
 import { SortSelectProps } from './SortSelect.types';
-
 export declare const SortSelect: React.FC<SortSelectProps>;