mimir-ui-kit 1.2.0 → 1.3.0

package/dist/components/Input/Input.js

@@ -1,121 +0,0 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { memo, forwardRef, useState, useEffect } from "react";
-import { c as classNames } from "../../index-CweZ_OcN.js";
-import { EInputVariant } from "./constants.js";
-import '../../assets/Input.css';const label = "_label_1wv6m_5";
-const input = "_input_1wv6m_2";
-const s = "_s_1wv6m_61";
-const m = "_m_1wv6m_73";
-const l = "_l_1wv6m_5";
-const success = "_success_1wv6m_124";
-const alarm = "_alarm_1wv6m_142";
-const error = "_error_1wv6m_160";
-const disabled = "_disabled_1wv6m_178";
-const cls = {
-  "input-wrapper": "_input-wrapper_1wv6m_2",
-  label,
-  "active-label": "_active-label_1wv6m_18",
-  input,
-  s,
-  m,
-  l,
-  "default-gray": "_default-gray_1wv6m_97",
-  "default-white": "_default-white_1wv6m_109",
-  success,
-  alarm,
-  error,
-  disabled,
-  "has-label": "_has-label_1wv6m_196"
-};
-const Input = memo(
-  forwardRef(
-    (props, ref) => {
-      const {
-        value,
-        className,
-        wrapperClassName,
-        variant = EInputVariant.DefaultGray,
-        type = "text",
-        autofocus,
-        readonly,
-        id,
-        onFocus,
-        onBlur,
-        label: label2,
-        disabled: disabled2,
-        size = "m",
-        ...otherProps
-      } = props;
-      const [isFocused, setIsFocused] = useState(autofocus);
-      useEffect(() => {
-        if (autofocus) {
-          setIsFocused(true);
-        }
-      }, [autofocus]);
-      const handleBlur = (event) => {
-        const currentValue = event.currentTarget.value;
-        onBlur == null ? void 0 : onBlur(event);
-        if (currentValue) {
-          return;
-        }
-        setIsFocused(false);
-      };
-      const handleFocus = (event) => {
-        if (readonly) {
-          return;
-        }
-        setIsFocused(true);
-        onFocus == null ? void 0 : onFocus(event);
-      };
-      const mods = {
-        [cls.readonly]: disabled2 || readonly,
-        [cls.focused]: isFocused,
-        [cls.disabled]: disabled2 || readonly,
-        [cls["has-label"]]: !!label2
-      };
-      const labelClassNames = classNames(
-        cls.label,
-        {
-          [cls["active-label"]]: isFocused || value
-        },
-        className,
-        cls[size]
-      );
-      const inputClassNames = classNames(cls.input, mods, className, [
-        cls[variant],
-        cls[size]
-      ]);
-      return /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: classNames(
-            cls["input-wrapper"],
-            cls[variant],
-            wrapperClassName
-          ),
-          children: [
-            label2 && /* @__PURE__ */ jsx("label", { htmlFor: id, className: labelClassNames, children: label2 }),
-            /* @__PURE__ */ jsx(
-              "input",
-              {
-                ref,
-                type,
-                id,
-                className: inputClassNames,
-                onFocus: handleFocus,
-                onBlur: handleBlur,
-                readOnly: readonly,
-                value,
-                ...otherProps
-              }
-            )
-          ]
-        }
-      );
-    }
-  )
-);
-Input.displayName = "Input";
-export {
-  Input
-};

package/dist/components/Input/constants.d.ts

@@ -1,12 +0,0 @@
-export declare enum EInputVariant {
-    Alarm = "alarm",
-    Success = "success",
-    Error = "error",
-    DefaultGray = "default-gray",
-    DefaultWhite = "default-white"
-}
-export declare enum EInputSize {
-    S = "s",
-    M = "m",
-    L = "l"
-}

package/dist/components/Input/constants.js

@@ -1,18 +0,0 @@
-var EInputVariant = /* @__PURE__ */ ((EInputVariant2) => {
-  EInputVariant2["Alarm"] = "alarm";
-  EInputVariant2["Success"] = "success";
-  EInputVariant2["Error"] = "error";
-  EInputVariant2["DefaultGray"] = "default-gray";
-  EInputVariant2["DefaultWhite"] = "default-white";
-  return EInputVariant2;
-})(EInputVariant || {});
-var EInputSize = /* @__PURE__ */ ((EInputSize2) => {
-  EInputSize2["S"] = "s";
-  EInputSize2["M"] = "m";
-  EInputSize2["L"] = "l";
-  return EInputSize2;
-})(EInputSize || {});
-export {
-  EInputSize,
-  EInputVariant
-};

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

@@ -1,3 +0,0 @@
-export { Input, type TProps as TInputProps } from './Input';
-export type { TSize, TVariant } from './types';
-export { EInputSize, EInputVariant } from './constants';

package/dist/components/Input/index.js

@@ -1,7 +0,0 @@
-import { Input } from "./Input.js";
-import { EInputSize, EInputVariant } from "./constants.js";
-export {
-  EInputSize,
-  EInputVariant,
-  Input
-};

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

@@ -1,11 +0,0 @@
-import { InputHTMLAttributes } from 'react';
-import { EInputSize, EInputVariant } from './constants';
-
-export type TSize = `${EInputSize}` | EInputSize;
-export type TVariant = `${EInputVariant}` | EInputVariant;
-export type TCommonCompoundInputProps = {
-    size?: TSize;
-    variant?: TVariant;
-    className?: string;
-};
-export type TInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'readOnly' | 'size' | 'placeholder'>;

package/dist/components/Input/types.js

@@ -1 +0,0 @@
-

package/dist/components/InputPassword/InputPassword.d.ts

@@ -1,12 +0,0 @@
-import { TInputProps } from '../Input';
-
-export type TProps = TInputProps;
-export declare const InputPassword: import('react').MemoExoticComponent<import('react').ForwardRefExoticComponent<import('../Input/types').TInputProps & {
-    size?: import('../Input').TSize;
-    variant?: import('../Input').TVariant;
-    className?: string;
-    wrapperClassName?: string;
-    label?: import('react').ReactNode;
-    autofocus?: boolean;
-    readonly?: boolean;
-} & import('react').RefAttributes<HTMLInputElement>>>;

package/dist/components/InputPassword/InputPassword.js

@@ -1,50 +0,0 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { memo, forwardRef, useState } from "react";
-import { Input } from "../Input/Input.js";
-import { Button } from "../Button/Button.js";
-import { Icon } from "../../icons/Icon.js";
-import '../../assets/InputPassword.css';const input = "_input_mam1g_2";
-const wrapper = "_wrapper_mam1g_6";
-const button = "_button_mam1g_17";
-const cls = {
-  input,
-  wrapper,
-  "input-wrapper": "_input-wrapper_mam1g_13",
-  "button-wrapper": "_button-wrapper_mam1g_17",
-  button
-};
-const InputPassword = memo(
-  forwardRef(
-    ({ size, ...props }, ref) => {
-      const [showPassword, setShowPassword] = useState(false);
-      const handleClick = () => setShowPassword(!showPassword);
-      return /* @__PURE__ */ jsxs("div", { className: cls.wrapper, children: [
-        /* @__PURE__ */ jsx(
-          Input,
-          {
-            ref,
-            className: cls.input,
-            wrapperClassName: cls["input-wrapper"],
-            size,
-            type: showPassword ? "text" : "password",
-            ...props
-          }
-        ),
-        /* @__PURE__ */ jsx("div", { className: cls["button-wrapper"], children: /* @__PURE__ */ jsx(
-          Button,
-          {
-            clear: true,
-            type: "button",
-            className: cls.button,
-            onClick: handleClick,
-            children: /* @__PURE__ */ jsx(Icon, { iconName: "Eye24px" })
-          }
-        ) })
-      ] });
-    }
-  )
-);
-InputPassword.displayName = "InputPassword";
-export {
-  InputPassword
-};

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

@@ -1,2 +0,0 @@
-export { InputPassword } from './InputPassword';
-export type { TProps as TInputPasswordProps } from './InputPassword';

package/dist/components/InputPassword/index.js

@@ -1,4 +0,0 @@
-import { InputPassword } from "./InputPassword.js";
-export {
-  InputPassword
-};

package/dist/components/InputPhoneNumber/InputPhoneNumber.d.ts

@@ -1,12 +0,0 @@
-export type ImperativeHandle = Partial<HTMLInputElement> & {
-    getPhoneNumber: () => string;
-};
-export declare const InputPhoneNumber: import('react').MemoExoticComponent<import('react').ForwardRefExoticComponent<import('../Input/types').TInputProps & {
-    size?: import('../Input').TSize;
-    variant?: import('../Input').TVariant;
-    className?: string;
-    wrapperClassName?: string;
-    label?: import('react').ReactNode;
-    autofocus?: boolean;
-    readonly?: boolean;
-} & import('react').RefAttributes<HTMLInputElement>>>;

package/dist/components/InputPhoneNumber/InputPhoneNumber.js

@@ -1,38 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { memo, forwardRef, useState, useCallback, useImperativeHandle } from "react";
-import { Input } from "../Input/Input.js";
-import { getMaskedInputPhoneValue, getUnmaskedInputValue } from "./utils.js";
-const InputPhoneNumber = memo(
-  forwardRef(
-    ({ value = "", onChange, ...props }, ref) => {
-      const [phone, setPhone] = useState(
-        () => getMaskedInputPhoneValue(value)
-      );
-      const handleChange = useCallback(
-        (event) => {
-          const maskedValue = getMaskedInputPhoneValue(event.target.value);
-          setPhone(maskedValue);
-          onChange == null ? void 0 : onChange({
-            ...event,
-            target: {
-              ...event.target,
-              value: getUnmaskedInputValue(maskedValue)
-            }
-          });
-        },
-        [onChange]
-      );
-      useImperativeHandle(
-        ref,
-        () => ({
-          getPhoneNumber: () => getUnmaskedInputValue(phone)
-        })
-      );
-      return /* @__PURE__ */ jsx(Input, { ref, value: phone, onChange: handleChange, ...props });
-    }
-  )
-);
-InputPhoneNumber.displayName = "InputPhoneNumber";
-export {
-  InputPhoneNumber
-};

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

@@ -1,2 +0,0 @@
-export { InputPhoneNumber } from './InputPhoneNumber';
-export { getMaskedInputPhoneValue, getUnmaskedInputValue } from './utils';

package/dist/components/InputPhoneNumber/index.js

@@ -1,7 +0,0 @@
-import { InputPhoneNumber } from "./InputPhoneNumber.js";
-import { getMaskedInputPhoneValue, getUnmaskedInputValue } from "./utils.js";
-export {
-  InputPhoneNumber,
-  getMaskedInputPhoneValue,
-  getUnmaskedInputValue
-};

package/dist/components/InputPhoneNumber/utils.d.ts

@@ -1,2 +0,0 @@
-export declare const getMaskedInputPhoneValue: (value: string) => string;
-export declare const getUnmaskedInputValue: (value: string) => string;

package/dist/components/InputPhoneNumber/utils.js

@@ -1,26 +0,0 @@
-const getMaskedInputPhoneValue = (value) => {
-  const rawValue = value.replace(/\D/g, "");
-  let formattedValue = "+7 ";
-  if (rawValue.startsWith("7")) {
-    formattedValue += "(" + rawValue.substring(1, 4);
-  } else {
-    formattedValue += rawValue.substring(0, 3);
-  }
-  if (rawValue.length > 4) {
-    formattedValue += ") " + rawValue.substring(4, 7);
-  }
-  if (rawValue.length > 7) {
-    formattedValue += "-" + rawValue.substring(7, 9);
-  }
-  if (rawValue.length > 9) {
-    formattedValue += "-" + rawValue.substring(9, 11);
-  }
-  return formattedValue;
-};
-const getUnmaskedInputValue = (value) => {
-  return value.replace(/\D/g, "");
-};
-export {
-  getMaskedInputPhoneValue,
-  getUnmaskedInputValue
-};

package/dist/components/Loader/Loader.d.ts

@@ -1 +0,0 @@
-export declare const Loader: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Loader/Loader.js

@@ -1,18 +0,0 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import '../../assets/Loader.css';const loader = "_loader_eco13_2";
-const circle = "_circle_eco13_11";
-const animate = "_animate_eco13_1";
-const cls = {
-  loader,
-  circle,
-  animate
-};
-const Loader = () => {
-  return /* @__PURE__ */ jsxs("div", { className: cls.loader, children: [
-    /* @__PURE__ */ jsx("span", { className: cls.circle }),
-    /* @__PURE__ */ jsx("span", { className: cls.circle })
-  ] });
-};
-export {
-  Loader
-};

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

@@ -1 +0,0 @@
-export { Loader } from './Loader';

package/dist/components/Loader/index.js

@@ -1,4 +0,0 @@
-import { Loader } from "./Loader.js";
-export {
-  Loader
-};

package/dist/components/MergedButton/MergedButton.d.ts

@@ -1,17 +0,0 @@
-import { TButtonProps } from '../Button';
-import { EMergedButtonVariantRound } from './constants';
-
-export type TButtonPropsWithoutStyles = Omit<TButtonProps, 'clear' | 'variant' | 'form'> & {
-    variant?: `${EMergedButtonVariantRound}` | EMergedButtonVariantRound;
-};
-type TProps = {
-    /**
-     * Массив кнопок,  который отрисуется в контейнере
-     * */
-    buttons: TButtonPropsWithoutStyles[];
-};
-/**
- * Компонент объединенных кнопок, с округлением у первой и последней кнопки, а так же с другими variant, нежели у обычного Button.
- */
-export declare const MergedButton: import('react').MemoExoticComponent<({ buttons }: TProps) => import("react/jsx-runtime").JSX.Element>;
-export {};

package/dist/components/MergedButton/MergedButton.js

@@ -1,55 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { memo } from "react";
-import { c as classNames } from "../../index-CweZ_OcN.js";
-import { Button } from "../Button/Button.js";
-import { EMergedButtonVariantRound } from "./constants.js";
-import '../../assets/MergedButton.css';const buttons = "_buttons_h653f_2";
-const button = "_button_h653f_2";
-const gray = "_gray_h653f_27";
-const white = "_white_h653f_35";
-const transparent = "_transparent_h653f_42";
-const cls = {
-  buttons,
-  button,
-  gray,
-  white,
-  transparent,
-  "is-icon": "_is-icon_h653f_51"
-};
-const MergedButton = memo(({ buttons: buttons2 }) => {
-  return /* @__PURE__ */ jsx("div", { className: cls.buttons, children: buttons2.map(
-    ({ variant = EMergedButtonVariantRound.White, disabled, ...button2 }, index) => {
-      const buttonProps = {
-        ...button2,
-        isIconButton: button2.isIconButton ?? false,
-        iconName: button2.isIconButton ? button2.iconName : void 0,
-        leftIcon: button2.isIconButton ? void 0 : button2.leftIcon,
-        rightIcon: button2.isIconButton ? void 0 : button2.rightIcon
-      };
-      const className = classNames(
-        cls.button,
-        cls.clear,
-        {
-          [cls[variant]]: !disabled,
-          [cls.disabled]: disabled,
-          [cls["is-icon"]]: button2.isIconButton
-        },
-        button2.className
-      );
-      return /* @__PURE__ */ jsx(
-        Button,
-        {
-          clear: true,
-          disabled,
-          className,
-          ...buttonProps
-        },
-        index
-      );
-    }
-  ) });
-});
-MergedButton.displayName = "MergedButton";
-export {
-  MergedButton
-};

package/dist/components/MergedButton/constants.d.ts

@@ -1,5 +0,0 @@
-export declare enum EMergedButtonVariantRound {
-    Transparent = "transparent",
-    Gray = "gray",
-    White = "white"
-}

package/dist/components/MergedButton/constants.js

@@ -1,9 +0,0 @@
-var EMergedButtonVariantRound = /* @__PURE__ */ ((EMergedButtonVariantRound2) => {
-  EMergedButtonVariantRound2["Transparent"] = "transparent";
-  EMergedButtonVariantRound2["Gray"] = "gray";
-  EMergedButtonVariantRound2["White"] = "white";
-  return EMergedButtonVariantRound2;
-})(EMergedButtonVariantRound || {});
-export {
-  EMergedButtonVariantRound
-};

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

@@ -1,2 +0,0 @@
-export { MergedButton, type TButtonPropsWithoutStyles } from './MergedButton';
-export { EMergedButtonVariantRound } from './constants';

package/dist/components/MergedButton/index.js

@@ -1,6 +0,0 @@
-import { MergedButton } from "./MergedButton.js";
-import { EMergedButtonVariantRound } from "./constants.js";
-export {
-  EMergedButtonVariantRound,
-  MergedButton
-};

package/dist/components/OtpInput/OtpInput.d.ts

@@ -1,23 +0,0 @@
-import { TInputProps } from '../Input';
-
-/**
- * Компонент ввода одноразового пароля (OTP).
- *
- * Компонент представляет собой набор вводов, каждый из которых может содержать только цифры.
- * Пользователь может вводить цифры в каждый ввод, и при вводе каждой цифры происходит автоматическое переключение на следующий ввод.
- */
-export declare const OtpInput: import('react').ForwardRefExoticComponent<Omit<TInputProps, "onChange" | "label"> & {
-    value?: string;
-    /**
-     * Количество полей ввода.
-     */
-    valueLength?: number;
-    /**
-     * Функция, для изменения значения поля ввода.
-     */
-    onChange?: (value: string) => void;
-    /**
-     * Флаг, показывающий нужно ли отображать разделитель между вводами.
-     */
-    needSeparator?: boolean;
-} & import('react').RefAttributes<unknown>>;

package/dist/components/OtpInput/OtpInput.js

@@ -1,70 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { forwardRef, useImperativeHandle, Fragment } from "react";
-import { c as classNames } from "../../index-CweZ_OcN.js";
-import { Input } from "../Input/Input.js";
-import { ITEMS_PER_SEPARATOR, DEFAULT_VALUE_LENGTH } from "./constants.js";
-import { useOTPInput } from "./hooks.js";
-import '../../assets/OtpInput.css';const otp = "_otp_xwv60_3";
-const input = "_input_xwv60_15";
-const separator = "_separator_xwv60_29";
-const cls = {
-  otp,
-  "input-wrapper": "_input-wrapper_xwv60_15",
-  input,
-  separator
-};
-const OtpInput = forwardRef(
-  ({
-    value = "",
-    valueLength = DEFAULT_VALUE_LENGTH,
-    needSeparator = true,
-    onChange,
-    className,
-    ...props
-  }, ref) => {
-    const {
-      data: { inputRefs, valueItems },
-      handlers: { handleChange, handleFocus, handleKeyDown, handlePaste }
-    } = useOTPInput({
-      onChange,
-      value,
-      valueLength
-    });
-    useImperativeHandle(ref, () => ({
-      focus: () => {
-        var _a;
-        (_a = inputRefs.current[0]) == null ? void 0 : _a.focus();
-      }
-    }));
-    return /* @__PURE__ */ jsx("div", { className: classNames(cls.otp, className), children: valueItems.map((digit, idx) => {
-      const nextIndex = idx + 1;
-      const showSeparator = needSeparator && nextIndex % ITEMS_PER_SEPARATOR === 0 && nextIndex !== valueItems.length;
-      return /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(
-          Input,
-          {
-            ref: (el) => inputRefs.current[idx] = el,
-            type: "text",
-            inputMode: "numeric",
-            autoComplete: "one-time-code",
-            pattern: "\\d{1}",
-            maxLength: 1,
-            value: digit,
-            className: cls.input,
-            wrapperClassName: cls["input-wrapper"],
-            onChange: (e) => handleChange(e, idx),
-            onKeyDown: (e) => handleKeyDown(e, idx),
-            onFocus: (e) => handleFocus(e, idx),
-            onPaste: handlePaste,
-            ...props
-          }
-        ),
-        showSeparator && /* @__PURE__ */ jsx("span", { className: classNames(cls.separator) })
-      ] }, idx);
-    }) });
-  }
-);
-OtpInput.displayName = "OtpInput";
-export {
-  OtpInput
-};

package/dist/components/OtpInput/constants.d.ts

@@ -1,3 +0,0 @@
-export declare const RE_DIGIT: RegExp;
-export declare const DEFAULT_VALUE_LENGTH = 6;
-export declare const ITEMS_PER_SEPARATOR = 3;

package/dist/components/OtpInput/constants.js

@@ -1,8 +0,0 @@
-const RE_DIGIT = new RegExp(/^\d+$/);
-const DEFAULT_VALUE_LENGTH = 6;
-const ITEMS_PER_SEPARATOR = 3;
-export {
-  DEFAULT_VALUE_LENGTH,
-  ITEMS_PER_SEPARATOR,
-  RE_DIGIT
-};

package/dist/components/OtpInput/hooks.d.ts

@@ -1,20 +0,0 @@
-import { ChangeEvent, KeyboardEvent, ClipboardEvent, FocusEvent } from 'react';
-
-type TUseOTPInput = {
-    value?: string;
-    valueLength?: number;
-    onChange?: (value: string) => void;
-};
-export declare const useOTPInput: ({ value, valueLength, onChange }: TUseOTPInput) => {
-    handlers: {
-        handleChange: (e: ChangeEvent<HTMLInputElement>, index: number) => void;
-        handleFocus: (e: FocusEvent<HTMLInputElement>, index: number) => void;
-        handleKeyDown: (e: KeyboardEvent<HTMLInputElement>, index: number) => void;
-        handlePaste: (e: ClipboardEvent<HTMLInputElement>) => void;
-    };
-    data: {
-        valueItems: string[];
-        inputRefs: import('react').MutableRefObject<(HTMLInputElement | null)[]>;
-    };
-};
-export {};