mimir-ui-kit 1.15.0 → 1.15.2

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

@@ -1,3 +1,3 @@
 export { SelectSearch } from './SelectSearch';
-export type { TSelectSearchProps } from './types';
+export type { TSelectSearchProps, TSelectOption } from './types';
 export { ESelectSearchSize } from './constants';

package/dist/components/SelectSearch/types.d.ts

@@ -1,15 +1,21 @@
+import { ReactNode } from 'react';
 import { ESelectSearchSize } from './constants';
-import { VirtualizedFixedSizeListProps } from './SelectSearch';
 
+export type TSelectOption = {
+    name: string;
+    id: number | string;
+    bottom?: ReactNode;
+    [index: string]: unknown;
+};
 export type TSelectSearchProps = {
     /**
      * Текущее выбранное значение.
      */
-    value?: Record<string, unknown> | null;
+    value?: TSelectOption | null;
     /**
      * Функция обратного вызова при изменении выбранного значения.
      */
-    onChange?: (value: Record<string, unknown>) => void;
+    onChange?: (value: TSelectOption) => void;
     /**
      * Текст-подсказка для поля ввода.
      */
@@ -22,19 +28,18 @@ export type TSelectSearchProps = {
      * Флаг для растягивания компонента на всю ширину контейнера.
      */
     full?: boolean;
-    /**
-     * Дочерние элементы компонента.
-     */
-    children?: React.ReactNode;
-    /**
-     * Свойства для виртуализированного списка фиксированного размера.
-     */
-    virtualizedFixedSizeList?: VirtualizedFixedSizeListProps;
     /**
      * Значение, отображаемое в поле выбора.
      */
     displayValue?: string;
+    /** Показывать ли иконку стрелки выпадающего списка */
     showArrow?: boolean;
+    /** Функция обратного вызова, срабатывающая при изменении поискового запроса */
     onSearch?: (value: string) => void;
+    /** Фильтровать ли варианты на основе поискового запроса */
     filterOnSearch?: boolean;
+    /** Значения, передаваемые в SelectSearch */
+    items: TSelectOption[];
+    /** Класснейм для значения */
+    classNameOption?: string;
 };

package/dist/components/Slider/Slider.d.ts

@@ -21,6 +21,8 @@ type TProps = {
      */
     images?: {
         image?: string;
+        imageDesktop?: string;
+        imageMobile?: string;
         url?: string;
         id?: number;
     }[];

package/dist/components/Slider/Slider.js

@@ -323,7 +323,7 @@ const Slider = ({
   swiperClassName,
   slideClassName,
   imageClassName,
-  delay = 3e3
+  delay = 3e5
 }) => {
   const progressBar = useRef(null);
   const swiperRef = useRef(null);
@@ -401,7 +401,9 @@ const Slider = ({
                 AppImage,
                 {
                   className: classNames(cls.image, imageClassName),
-                  src: img.image
+                  src: img.image,
+                  desktopImage: img.imageDesktop,
+                  mobileImage: img.imageMobile
                 }
               )
             },

package/dist/components/Uploader/Uploader.d.ts

@@ -1,3 +1,4 @@
+import { default as React } from 'react';
 import { imageTypesArr } from './constants';
 
 export type TUploader = {
@@ -18,6 +19,14 @@ export type TUploader = {
      * Максимальный размер файлов.
      */
     maxSize: number;
+    /**
+     * Максимальное количество файлов.
+     */
+    maxFiles: number;
+    /**
+     * Выключен ли Uploader или нет
+     */
+    isDisabled?: boolean;
 };
 export type TUploadValue = {
     value: TFileItem[];
@@ -27,4 +36,4 @@ export type TFileItem = {
     id: number;
     file: File;
 };
-export declare function Uploader({ filesType, onChangeValue, arrayName, maxSize }: TUploader): import("react/jsx-runtime").JSX.Element;
+export declare const Uploader: React.ForwardRefExoticComponent<TUploader & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Uploader/Uploader.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { useId, useRef } from "react";
+import { forwardRef, useRef, useId } from "react";
 import { Icon } from "../../icons/Icon.js";
 import { Button } from "../Button/Button.js";
 import '../../assets/Uploader.css';const cls = {
@@ -25,67 +25,73 @@ const filesTyps = ["jpeg", "jpg", "png", "tiff", "gif"];
 const generateId = (min, max) => {
   return Math.random() * (max - min) + min;
 };
-function Uploader({
-  filesType = filesTyps,
-  onChangeValue,
-  arrayName,
-  maxSize = 15
-}) {
-  const idImg = useId();
-  const ref = useRef(null);
-  const onChange = (e) => {
-    if (e.target.files && e.target.files[0]) {
-      const list = [];
-      Array.from(e.target.files).forEach((el) => {
-        if (filesType.map((name) => MIME[name]).includes(el.type) && el.size / 1024 ** 2 <= maxSize) {
-          list.push({ file: el, id: generateId(1, 100) });
-        }
-      });
-      onChangeValue({ arrayName, value: list });
-    }
-  };
-  const onOpen = () => {
-    var _a;
-    (_a = ref.current) == null ? void 0 : _a.click();
-  };
-  return /* @__PURE__ */ jsxs("div", { className: cls["upload-file__wrapper"], children: [
-    /* @__PURE__ */ jsx(
-      "input",
-      {
-        type: "file",
-        className: cls["upload-file-input"],
-        "aria-label": "Upload",
-        name: "image[]",
-        multiple: true,
-        onChange,
-        title: "",
-        id: idImg,
-        accept: filesType.map((i) => MIME[i]).join()
+const Uploader = forwardRef(
+  (props, ref) => {
+    const {
+      filesType = filesTyps,
+      onChangeValue,
+      arrayName,
+      maxSize = 15,
+      isDisabled
+    } = props;
+    const uploaderRef = useRef(null);
+    const idImg = useId();
+    const onChange = (e) => {
+      if (e.target.files && e.target.files[0]) {
+        const list = [];
+        Array.from(e.target.files).forEach((el) => {
+          if (filesType.map((name) => MIME[name]).includes(el.type) && el.size / 1024 ** 2 <= maxSize) {
+            list.push({ file: el, id: generateId(1, 100) });
+          }
+        });
+        onChangeValue({ arrayName, value: list });
       }
-    ),
-    /* @__PURE__ */ jsxs("label", { htmlFor: idImg, ref, children: [
+    };
+    const onOpen = () => {
+      var _a;
+      (_a = uploaderRef.current) == null ? void 0 : _a.click();
+    };
+    return /* @__PURE__ */ jsxs("div", { className: cls["upload-file__wrapper"], ref, children: [
       /* @__PURE__ */ jsx(
-        Button,
+        "input",
         {
-          size: "m",
-          variant: "secondary-asphalt",
-          leftIcon: /* @__PURE__ */ jsx(Icon, { iconName: "UnionIcon16px" }),
-          onClick: onOpen,
-          children: "Выберите файлы"
+          type: "file",
+          className: cls["upload-file-input"],
+          "aria-label": "Upload",
+          name: "image[]",
+          multiple: true,
+          onChange,
+          title: "",
+          id: idImg,
+          accept: filesType.map((i) => MIME[i]).join(),
+          disabled: isDisabled
         }
       ),
-      /* @__PURE__ */ jsx("b", { children: "Или перетащие сюда" }),
-      /* @__PURE__ */ jsxs("span", { className: cls["upload-text"], children: [
-        "Максимальный размер одного файла – ",
-        maxSize,
-        " Мб",
-        /* @__PURE__ */ jsx("br", {}),
-        "Загрузить можно файлы следующих форматов: ",
-        filesType.join(", ")
+      /* @__PURE__ */ jsxs("label", { htmlFor: idImg, ref: uploaderRef, children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            size: "m",
+            variant: "secondary-asphalt",
+            leftIcon: /* @__PURE__ */ jsx(Icon, { iconName: "UnionIcon16px" }),
+            onClick: onOpen,
+            disabled: isDisabled,
+            children: "Выберите файлы"
+          }
+        ),
+        /* @__PURE__ */ jsx("b", { children: "Или перетащите сюда" }),
+        /* @__PURE__ */ jsxs("span", { className: cls["upload-text"], children: [
+          "Максимальный размер одного файла – ",
+          maxSize,
+          " Мб",
+          /* @__PURE__ */ jsx("br", {}),
+          "Загрузить можно файлы следующих форматов: ",
+          filesType.join(", ")
+        ] })
       ] })
-    ] })
-  ] });
-}
+    ] });
+  }
+);
 export {
   Uploader
 };

package/dist/components/UploaderPhotos/UploaderPhotos.d.ts

@@ -1,3 +1,4 @@
+import { TPhotosDetail } from '../ListPhotos/ListPhotos';
 import { imageTypesArr } from '../Uploader/constants';
 import { TFileItem } from '../Uploader/Uploader';
 
@@ -21,9 +22,17 @@ export type TUploaderPhotos = {
      * type:'delete' в data передает id удаленного файла
      */
     onChange: (j: TOnChangePhotosUpdate) => void;
+    /**
+     * Передаваемые файлы.
+     */
+    value?: TPhotosDetail[];
+    /**
+     * Максимальное количество файлов.
+     */
+    maxFiles: number;
 };
 export type TOnChangePhotosUpdate = {
     type: string;
     data: TFileItem[] | number;
 };
-export declare function UploaderPhotos({ filesType, arrayName, maxSize, onChange }: TUploaderPhotos): import("react/jsx-runtime").JSX.Element;
+export declare const UploaderPhotos: import('react').ForwardRefExoticComponent<TUploaderPhotos & import('react').RefAttributes<HTMLDivElement>>;

package/dist/components/UploaderPhotos/UploaderPhotos.js

@@ -1,46 +1,62 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { useState } from "react";
+import { c as classNames } from "../../index-CweZ_OcN.js";
+import { forwardRef, useState, useEffect } from "react";
 import { ListPhotos } from "../ListPhotos/ListPhotos.js";
 import { Uploader } from "../Uploader/Uploader.js";
 import '../../assets/UploaderPhotos.css';const cls = {
-  "upload-file__wrapper": "_upload-file__wrapper_udscq_2"
+  "upload-file__wrapper": "_upload-file__wrapper_17bcu_2"
 };
-function UploaderPhotos({
-  filesType,
-  arrayName,
-  maxSize,
-  onChange
-}) {
-  const [photos, setPhotos] = useState([]);
-  const onChangeValue = (e) => {
-    setPhotos([
-      ...photos,
-      ...e.value.map((el) => {
-        return {
+const UploaderPhotos = forwardRef(
+  (props, ref) => {
+    const { filesType, arrayName, maxSize, onChange, value, maxFiles } = props;
+    const [photos, setPhotos] = useState(value || []);
+    const isMaxFilesReached = photos.length >= maxFiles;
+    useEffect(() => {
+      if (value) {
+        setPhotos(value);
+      }
+    }, [value]);
+    const onChangeValue = (e) => {
+      const newPhotos = [
+        ...photos,
+        ...e.value.map((el) => ({
           url: URL.createObjectURL(el.file),
           id: el.id
-        };
-      })
-    ]);
-    onChange == null ? void 0 : onChange({ type: "add", data: e.value });
-  };
-  const onDelete = (j) => {
-    setPhotos(j.list);
-    if (j.deleteId) onChange == null ? void 0 : onChange({ type: "delete", data: j.deleteId });
-  };
-  return /* @__PURE__ */ jsxs("div", { className: cls["upload-file__wrapper"], children: [
-    /* @__PURE__ */ jsx(
-      Uploader,
+        }))
+      ];
+      setPhotos(newPhotos);
+      onChange == null ? void 0 : onChange({ type: "add", data: e.value });
+    };
+    const onDelete = (j) => {
+      setPhotos(j.list);
+      if (j.deleteId) onChange == null ? void 0 : onChange({ type: "delete", data: j.deleteId });
+    };
+    return /* @__PURE__ */ jsxs(
+      "div",
       {
-        filesType,
-        arrayName,
-        maxSize,
-        onChangeValue
+        className: classNames(
+          cls["upload-file__wrapper"],
+          isMaxFilesReached && cls.disabled
+        ),
+        children: [
+          /* @__PURE__ */ jsx(
+            Uploader,
+            {
+              filesType,
+              arrayName,
+              maxSize,
+              onChangeValue,
+              ref,
+              maxFiles,
+              isDisabled: isMaxFilesReached
+            }
+          ),
+          /* @__PURE__ */ jsx(ListPhotos, { value: photos, onChange: onDelete })
+        ]
       }
-    ),
-    /* @__PURE__ */ jsx(ListPhotos, { value: photos, onChange: onDelete })
-  ] });
-}
+    );
+  }
+);
 export {
   UploaderPhotos
 };

package/dist/components/index.d.ts

@@ -20,9 +20,7 @@ export { EDrawerPosition } from './Drawer';
 export { Steps, EStepsPrimaryColor, EStepsSecondaryColor, EStepsSize, type TCommonStepsProps } from './Steps';
 export { Vote, EVoteSize, type TCommonVoteProps } from './Vote';
 export { SelectSearch, ESelectSearchSize } from './SelectSearch';
-export type { TSelectSearchProps } from './SelectSearch';
-export { SelectSearchOption } from './SelectSearchOption';
-export type { SelectSearchOptionProps } from './SelectSearchOption';
+export type { TSelectSearchProps, TSelectOption } from './SelectSearch';
 export { Switch } from './Switch';
 export type { TSwitchProps } from './Switch';
 export { Tag, ETagSize, ETagType } from './Tag';

package/dist/components/index.js

@@ -21,7 +21,6 @@ import { Vote } from "./Vote/Vote.js";
 import { EVoteSize } from "./Vote/constants.js";
 import { SelectSearch } from "./SelectSearch/SelectSearch.js";
 import { ESelectSearchSize } from "./SelectSearch/constants.js";
-import { S } from "../SelectSearchOption-snHM9uZX.js";
 import { Switch } from "./Switch/Switch.js";
 import { Tag } from "./Tag/Tag.js";
 import { ETagSize, ETagType } from "./Tag/constants.js";
@@ -73,7 +72,6 @@ export {
   Pagination,
   RadioGroup,
   SelectSearch,
-  S as SelectSearchOption,
   Slider,
   Steps,
   Switch,

package/dist/hooks/index.d.ts

@@ -1,4 +1,4 @@
-export { useMediaQuery, EMediaQuery } from './useMediaQuery';
+export { useMediaQuery, EMediaQuery, EMinMediaQuery } from './useMediaQuery';
 export { useLockBodyScroll } from './useLockBodyScroll';
 export { useInterval } from './useInterval';
 export { useTimer } from './useTimer';

package/dist/hooks/index.js

@@ -1,11 +1,12 @@
 import { useMediaQuery } from "./useMediaQuery/useMediaQuery.js";
-import { EMediaQuery } from "./useMediaQuery/constants.js";
+import { EMediaQuery, EMinMediaQuery } from "./useMediaQuery/constants.js";
 import { useLockBodyScroll } from "./useLockBodyScroll/useLockBodyScroll.js";
 import { useInterval } from "./useInterval/useInterval.js";
 import { useTimer } from "./useTimer/index.js";
 import { useCopyToClipboard } from "./useCopyToClipboard/useCopyToClipboard.js";
 export {
   EMediaQuery,
+  EMinMediaQuery,
   useCopyToClipboard,
   useInterval,
   useLockBodyScroll,

package/dist/hooks/useMediaQuery/constants.d.ts

@@ -8,3 +8,13 @@ export declare enum EMediaQuery {
     XL = "(max-width: 1440px)",
     XXL = "(max-width: 1920px)"
 }
+export declare enum EMinMediaQuery {
+    XSS = "(min-width: 375px)",
+    XS = "(min-width: 600px)",
+    XS1 = "(min-width: 767px)",
+    S = "(min-width: 768px)",
+    M = "(min-width: 960px)",
+    L = "(min-width: 1280px)",
+    XL = "(min-width: 1440px)",
+    XXL = "(min-width: 1920px)"
+}

package/dist/hooks/useMediaQuery/constants.js

@@ -9,6 +9,18 @@ var EMediaQuery = /* @__PURE__ */ ((EMediaQuery2) => {
   EMediaQuery2["XXL"] = "(max-width: 1920px)";
   return EMediaQuery2;
 })(EMediaQuery || {});
+var EMinMediaQuery = /* @__PURE__ */ ((EMinMediaQuery2) => {
+  EMinMediaQuery2["XSS"] = "(min-width: 375px)";
+  EMinMediaQuery2["XS"] = "(min-width: 600px)";
+  EMinMediaQuery2["XS1"] = "(min-width: 767px)";
+  EMinMediaQuery2["S"] = "(min-width: 768px)";
+  EMinMediaQuery2["M"] = "(min-width: 960px)";
+  EMinMediaQuery2["L"] = "(min-width: 1280px)";
+  EMinMediaQuery2["XL"] = "(min-width: 1440px)";
+  EMinMediaQuery2["XXL"] = "(min-width: 1920px)";
+  return EMinMediaQuery2;
+})(EMinMediaQuery || {});
 export {
-  EMediaQuery
+  EMediaQuery,
+  EMinMediaQuery
 };

package/dist/hooks/useMediaQuery/index.d.ts

@@ -1,2 +1,2 @@
 export { useMediaQuery } from './useMediaQuery';
-export { EMediaQuery } from './constants';
+export { EMediaQuery, EMinMediaQuery } from './constants';

package/dist/hooks/useMediaQuery/index.js

@@ -1,6 +1,7 @@
 import { useMediaQuery } from "./useMediaQuery.js";
-import { EMediaQuery } from "./constants.js";
+import { EMediaQuery, EMinMediaQuery } from "./constants.js";
 export {
   EMediaQuery,
+  EMinMediaQuery,
   useMediaQuery
 };

package/dist/index.js

@@ -21,7 +21,6 @@ import { Vote } from "./components/Vote/Vote.js";
 import { EVoteSize } from "./components/Vote/constants.js";
 import { SelectSearch } from "./components/SelectSearch/SelectSearch.js";
 import { ESelectSearchSize } from "./components/SelectSearch/constants.js";
-import { S } from "./SelectSearchOption-snHM9uZX.js";
 import { Switch } from "./components/Switch/Switch.js";
 import { Tag } from "./components/Tag/Tag.js";
 import { ETagSize, ETagType } from "./components/Tag/constants.js";
@@ -38,7 +37,7 @@ import { EToastPosition, EToastVariant } from "./components/Toasts/constants.js"
 import { UploaderPhotos } from "./components/UploaderPhotos/UploaderPhotos.js";
 import { Uploader } from "./components/Uploader/Uploader.js";
 import { useMediaQuery } from "./hooks/useMediaQuery/useMediaQuery.js";
-import { EMediaQuery } from "./hooks/useMediaQuery/constants.js";
+import { EMediaQuery, EMinMediaQuery } from "./hooks/useMediaQuery/constants.js";
 import { useLockBodyScroll } from "./hooks/useLockBodyScroll/useLockBodyScroll.js";
 import { useInterval } from "./hooks/useInterval/useInterval.js";
 import { useTimer } from "./hooks/useTimer/index.js";
@@ -62,6 +61,7 @@ import './assets/index.css';export {
   EInputVariant,
   EMediaQuery,
   EMergedButtonVariantRound,
+  EMinMediaQuery,
   ESelectSearchSize,
   EStepsPrimaryColor,
   EStepsSecondaryColor,
@@ -83,7 +83,6 @@ import './assets/index.css';export {
   Pagination,
   RadioGroup,
   SelectSearch,
-  S as SelectSearchOption,
   Slider,
   Steps,
   Switch,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "mimir-ui-kit",
   "private": false,
-  "version": "1.15.0",
+  "version": "1.15.2",
   "type": "module",
   "exports": {
     ".": {