mimir-ui-kit 1.20.0 → 1.20.2

package/dist/{Input-DdKAiGfJ.js → Input-6mudFqTb.js}

@@ -107,10 +107,8 @@ const Input = memo(
       const handleBlur = (event) => {
         const currentValue = event.currentTarget.value;
         onBlur == null ? void 0 : onBlur(event);
-        if (currentValue) {
-          return;
-        }
         setIsFocused(false);
+        setWithValue(!!currentValue);
       };
       const handleFocus = (event) => {
         if (readonly) {
@@ -145,14 +143,15 @@ const Input = memo(
       const currentRightAddon = renderAddon(rightAddon);
       const mods = {
         [cls.readonly]: disabled2 || readonly,
-        [cls.focused]: isFocused || withValue,
+        [cls.focused]: isFocused,
         [cls.disabled]: disabled2 || readonly,
         [cls["has-label"]]: !!label2,
         [cls["has-left-slot"]]: !!currentLeftAddon,
         [cls["has-right-slot"]]: !!currentRightAddon
       };
+      const isActiveLabel = isFocused || withValue || !!value;
       const labelClassNames = classNames(cls.label, className, cls[size], {
-        [cls["active-label"]]: isFocused || value,
+        [cls["active-label"]]: isActiveLabel,
         [cls.disabled]: disabled2 || readonly,
         [cls["has-left-slot"]]: !!currentLeftAddon
       });
@@ -169,7 +168,7 @@ const Input = memo(
             cls[size],
             {
               [cls.disabled]: disabled2 || readonly,
-              [cls.focused]: isFocused || withValue
+              [cls.focused]: isFocused
             },
             wrapperClassName
           ),
@@ -179,7 +178,7 @@ const Input = memo(
               "span",
               {
                 className: classNames(cls["left-slot"], {
-                  [cls.focused]: isFocused,
+                  [cls.focused]: isActiveLabel,
                   [cls["has-label"]]: !!label2
                 }),
                 children: currentLeftAddon
@@ -206,7 +205,7 @@ const Input = memo(
               "span",
               {
                 className: classNames(cls["right-slot"], {
-                  [cls.focused]: isFocused,
+                  [cls.focused]: isActiveLabel,
                   [cls["has-label"]]: !!label2
                 }),
                 children: currentRightAddon

package/dist/assets/TextArea.css

@@ -1 +1 @@
-._textarea-wrapper_1hbfy_2 ._textarea_1hbfy_2{min-height:var(--textarea-height);padding-top:var(--textarea-space)!important;padding-bottom:var(--textarea-space);resize:none}._textarea-wrapper_1hbfy_2 ._textarea_1hbfy_2._has-label_1hbfy_8{padding-top:var(--textarea-top-space)!important}._textarea-wrapper_1hbfy_2 ._label_1hbfy_11{position:absolute;top:calc(var(--input-space) / 2 - var(--input-space) / 2);left:var(--space-m);z-index:1;display:block;color:var(--label-color);font-size:var(--input-font-size);white-space:nowrap;transform-origin:left center;transition:transform .15s ease-out,left .15s ease-out,color .15s ease-out;pointer-events:none}._textarea-wrapper_1hbfy_2 ._label_1hbfy_11._has-left-slot_1hbfy_24{left:calc(var(--space-m) + var(--icon-size) + var(--clear-button-mg))}._textarea-wrapper_1hbfy_2 ._label_1hbfy_11._active-label_1hbfy_27{transform:scale(var(--label-scaled)) translateY(calc(var(--textarea-transform-label) * -1))}._textarea-wrapper_1hbfy_2 ._label_1hbfy_11._active-label_1hbfy_27._has-left-slot_1hbfy_24{left:calc(var(--space-m) + var(--icon-size) + var(--space-s));transform:scale(var(--label-scaled)) translate(calc((var(--space-m) + var(--left-addon-position)) * 2 * -1),calc(var(--textarea-transform-label) * -1))}._s_1hbfy_35{--textarea-space: var(--space-2s);--textarea-top-space: var(--space-l);--textarea-transform-label: var(--space-xss);--textarea-height: 76px;--textarea-padding: var(--space-xs) var(--space-s)}._m_1hbfy_43{--textarea-space: var(--space-2s);--textarea-top-space: var(--space-l);--textarea-transform-label: var(--space-s);--textarea-height: 88px;--textarea-padding: var(--space-xs) var(--space-s)}._l_1hbfy_11{--textarea-space: var(--space-2m);--textarea-top-space: 25px;--textarea-transform-label: var(--space-m);--textarea-height: 120px;--textarea-padding: var(--space-2m)}
+._textarea-wrapper_mbbjz_2 ._textarea_mbbjz_2{min-height:var(--textarea-height);padding-top:var(--textarea-space)!important;padding-bottom:var(--textarea-space);resize:none}._textarea-wrapper_mbbjz_2 ._textarea_mbbjz_2._has-label_mbbjz_8{padding-top:var(--textarea-top-space)!important}._textarea-wrapper_mbbjz_2 ._label_mbbjz_11{position:absolute;top:calc(var(--textarea-space) / 2 - var(--textarea-space) / 2);left:var(--space-m);z-index:1;display:block;color:var(--label-color);font-size:var(--input-font-size);white-space:nowrap;transform-origin:left center;transition:transform .15s ease-out,left .15s ease-out,color .15s ease-out;pointer-events:none}._textarea-wrapper_mbbjz_2 ._label_mbbjz_11._has-left-slot_mbbjz_24{left:calc(var(--space-m) + var(--icon-size) + var(--clear-button-mg))}._textarea-wrapper_mbbjz_2 ._label_mbbjz_11._active-label_mbbjz_27{transform:scale(var(--label-scaled)) translateY(calc(var(--textarea-transform-label) * -1))}._textarea-wrapper_mbbjz_2 ._label_mbbjz_11._active-label_mbbjz_27._has-left-slot_mbbjz_24{left:calc(var(--space-m) + var(--icon-size) + var(--space-s));transform:scale(var(--label-scaled)) translate(calc((var(--space-m) + var(--left-addon-position)) * 2 * -1),calc(var(--textarea-transform-label) * -1))}._s_mbbjz_35{--textarea-space: var(--space-2s);--textarea-top-space: var(--space-l);--textarea-transform-label: var(--space-xss);--textarea-height: 76px;--textarea-padding: var(--space-xs) var(--space-s)}._m_mbbjz_43{--textarea-space: var(--space-2s);--textarea-top-space: var(--space-l);--textarea-transform-label: var(--space-s);--textarea-height: 88px;--textarea-padding: var(--space-xs) var(--space-s)}._l_mbbjz_11{--textarea-space: var(--space-2m);--textarea-top-space: 25px;--textarea-transform-label: var(--space-m);--textarea-height: 120px;--textarea-padding: var(--space-2m)}

package/dist/components/DatePicker/DatePicker.js

@@ -5,7 +5,7 @@ import { c as cls, D as DatePickerModal } from "../../DatePickerModal-BM0BgzTb.j
 import { useClickOutside } from "../../hooks/useClickOutside/useClickOutside.js";
 import { formating } from "../../utils/index.js";
 import { Button } from "../Button/Button.js";
-import { I as Input } from "../../Input-DdKAiGfJ.js";
+import { I as Input } from "../../Input-6mudFqTb.js";
 const DatePicker = memo(
   forwardRef(
     ({ size, value, onChangeValue, name, before, ...props }, ref) => {

package/dist/components/Input/Input.js

@@ -2,7 +2,7 @@ import "react/jsx-runtime";
 import "../../index-CweZ_OcN.js";
 import "react";
 import "./constants.js";
-import { I } from "../../Input-DdKAiGfJ.js";
+import { I } from "../../Input-6mudFqTb.js";
 import "../../hooks/useMergeRefs/useMergeRefs.js";
 import "../../icons/Icon.js";
 import "../Button/Button.js";

package/dist/components/Input/index.js

@@ -1,4 +1,4 @@
-import { I } from "../../Input-DdKAiGfJ.js";
+import { I } from "../../Input-6mudFqTb.js";
 import { EInputSize, EInputVariant } from "./constants.js";
 export {
   EInputSize,

package/dist/components/InputPassword/InputPassword.js

@@ -2,7 +2,7 @@ import { jsxs, jsx } from "react/jsx-runtime";
 import { memo, forwardRef, useState } from "react";
 import { Icon } from "../../icons/Icon.js";
 import { Button } from "../Button/Button.js";
-import { I as Input } from "../../Input-DdKAiGfJ.js";
+import { I as Input } from "../../Input-6mudFqTb.js";
 import '../../assets/InputPassword.css';const input = "_input_mam1g_2";
 const wrapper = "_wrapper_mam1g_6";
 const button = "_button_mam1g_17";

package/dist/components/InputPhoneNumber/InputPhoneNumber.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { memo, forwardRef, useState, useCallback, useImperativeHandle } from "react";
 import { getMaskedInputPhoneValue, getUnmaskedInputValue } from "./utils.js";
-import { I as Input } from "../../Input-DdKAiGfJ.js";
+import { I as Input } from "../../Input-6mudFqTb.js";
 const InputPhoneNumber = memo(
   forwardRef(
     ({ value = "", onChange, ...props }, ref) => {

package/dist/components/OtpInput/OtpInput.js

@@ -3,7 +3,7 @@ import { c as classNames } from "../../index-CweZ_OcN.js";
 import { forwardRef, useImperativeHandle, Fragment } from "react";
 import { ITEMS_PER_SEPARATOR, DEFAULT_VALUE_LENGTH } from "./constants.js";
 import { useOTPInput } from "./hooks.js";
-import { I as Input } from "../../Input-DdKAiGfJ.js";
+import { I as Input } from "../../Input-6mudFqTb.js";
 import '../../assets/OtpInput.css';const otp = "_otp_196ev_3";
 const input = "_input_196ev_14";
 const separator = "_separator_196ev_28";

package/dist/components/SelectSearch/SelectSearch.js

@@ -4,7 +4,7 @@ import * as React from "react";
 import React__default, { useReducer, useMemo, useSyncExternalStore, useId as useId$1, useEffect, useCallback, useRef, useLayoutEffect, createContext, useContext, useState, Fragment, createRef, forwardRef } from "react";
 import { ESelectSearchSize } from "./constants.js";
 import { Icon } from "../../icons/Icon.js";
-import { I as Input } from "../../Input-DdKAiGfJ.js";
+import { I as Input } from "../../Input-6mudFqTb.js";
 import { EInputVariant, EInputSize } from "../Input/constants.js";
 import { n as n$2, u as u$3, d as o$1, s as s$3, o as o$2, p as p$1, t as t$3, e as s$4, W as W$1, y as y$3, T, H, M as M$1, a as u$5, $ as $f7dceffc5ad7768b$export$4e328f61c538687f, b as $6179b936705e76d3$export$ae780daf29e6d456, D as D$2, c as o$3 } from "../../keyboard-B256ZoM-.js";
 import * as ReactDOM from "react-dom";

package/dist/components/TextArea/TextArea.js

@@ -5,20 +5,20 @@ import { useAutoResizeTextArea } from "./hooks.js";
 import { useMergeRefs } from "../../hooks/useMergeRefs/useMergeRefs.js";
 import { Icon } from "../../icons/Icon.js";
 import { Button } from "../Button/Button.js";
-import { c as cls } from "../../Input-DdKAiGfJ.js";
+import { c as cls } from "../../Input-6mudFqTb.js";
 import { EInputVariant } from "../Input/constants.js";
-import '../../assets/TextArea.css';const textarea = "_textarea_1hbfy_2";
-const label = "_label_1hbfy_11";
-const s = "_s_1hbfy_35";
-const m = "_m_1hbfy_43";
-const l = "_l_1hbfy_11";
+import '../../assets/TextArea.css';const textarea = "_textarea_mbbjz_2";
+const label = "_label_mbbjz_11";
+const s = "_s_mbbjz_35";
+const m = "_m_mbbjz_43";
+const l = "_l_mbbjz_11";
 const textareaCls = {
-  "textarea-wrapper": "_textarea-wrapper_1hbfy_2",
+  "textarea-wrapper": "_textarea-wrapper_mbbjz_2",
   textarea,
-  "has-label": "_has-label_1hbfy_8",
+  "has-label": "_has-label_mbbjz_8",
   label,
-  "has-left-slot": "_has-left-slot_1hbfy_24",
-  "active-label": "_active-label_1hbfy_27",
+  "has-left-slot": "_has-left-slot_mbbjz_24",
+  "active-label": "_active-label_mbbjz_27",
   s,
   m,
   l
@@ -89,10 +89,8 @@ const TextArea = memo(
       const handleBlur = (event) => {
         const currentValue = event.currentTarget.value;
         onBlur == null ? void 0 : onBlur(event);
-        if (currentValue) {
-          return;
-        }
         setIsFocused(false);
+        setWithValue(!!currentValue);
       };
       const handleFocus = (event) => {
         if (readonly) {
@@ -122,17 +120,18 @@ const TextArea = memo(
       const currentRightAddon = renderAddon(rightAddon);
       const mods = {
         [cls.readonly]: disabled || readonly,
-        [cls.focused]: isFocused || withValue,
+        [cls.focused]: isFocused,
         [cls.disabled]: disabled || readonly,
         [cls["has-left-slot"]]: !!currentLeftAddon,
         [cls["has-right-slot"]]: !!currentRightAddon,
         [textareaCls["has-label"]]: !!label2
       };
+      const isActiveLabel = isFocused || withValue || !!value;
       const labelClassNames = classNames(
         cls.label,
         textareaCls.label,
         {
-          [textareaCls["active-label"]]: isFocused || value,
+          [textareaCls["active-label"]]: isActiveLabel,
           [cls.disabled]: disabled || readonly,
           [textareaCls["has-left-slot"]]: !!currentLeftAddon
         },
@@ -157,7 +156,7 @@ const TextArea = memo(
             cls[size],
             {
               [cls.disabled]: disabled || readonly,
-              [cls.focused]: isFocused || withValue
+              [cls.focused]: isFocused
             },
             wrapperClassName
           ),
@@ -167,7 +166,7 @@ const TextArea = memo(
               "span",
               {
                 className: classNames(cls["left-slot"], {
-                  [cls.focused]: isFocused,
+                  [cls.focused]: isActiveLabel,
                   [cls["has-label"]]: !!label2
                 }),
                 children: currentLeftAddon
@@ -191,7 +190,7 @@ const TextArea = memo(
               "span",
               {
                 className: classNames(cls["right-slot"], {
-                  [cls.focused]: isFocused,
+                  [cls.focused]: isActiveLabel,
                   [cls["has-label"]]: !!label2
                 }),
                 children: currentRightAddon

package/dist/components/index.js

@@ -1,6 +1,6 @@
 import { Button } from "./Button/Button.js";
 import { EButtonForm, EButtonSize, EButtonVariantDefault, EButtonVariantOutline, EButtonVariantRound } from "./Button/constants.js";
-import { I } from "../Input-DdKAiGfJ.js";
+import { I } from "../Input-6mudFqTb.js";
 import { EInputSize, EInputVariant } from "./Input/constants.js";
 import { TextArea } from "./TextArea/TextArea.js";
 import { InputPassword } from "./InputPassword/InputPassword.js";

package/dist/index.js

@@ -1,6 +1,6 @@
 import { Button } from "./components/Button/Button.js";
 import { EButtonForm, EButtonSize, EButtonVariantDefault, EButtonVariantOutline, EButtonVariantRound } from "./components/Button/constants.js";
-import { I } from "./Input-DdKAiGfJ.js";
+import { I } from "./Input-6mudFqTb.js";
 import { EInputSize, EInputVariant } from "./components/Input/constants.js";
 import { TextArea } from "./components/TextArea/TextArea.js";
 import { InputPassword } from "./components/InputPassword/InputPassword.js";

package/package.json

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