@infomaximum/ui-kit 0.9.1

package/dist/components/Input/components/InputPassword/InputPassword.js

@@ -0,0 +1,51 @@
+import { jsx } from "@emotion/react/jsx-runtime";
+import { forwardRef, useState, useEffect, memo } from "react";
+import { EyeOutlined, EyeInvisibleOutlined } from "@infomaximum/icons";
+import { Input } from "../../Input.js";
+import { getInputTokens } from "../../Input.tokens.js";
+import { getIconWrapperStyle } from "./InputPassword.styles.js";
+import { useTheme } from "../../../../hooks/useTheme/useTheme.js";
+const defaultSuffixIconRender = (visible) => visible ? /* @__PURE__ */ jsx(EyeOutlined, {}) : /* @__PURE__ */ jsx(EyeInvisibleOutlined, {});
+const InputPasswordComponent = forwardRef((props, ref) => {
+  const {
+    visibilityToggle = true,
+    suffixIconRender = defaultSuffixIconRender,
+    ...restProps
+  } = props;
+  const theme = useTheme();
+  const inputTokens = getInputTokens(theme);
+  const visibilityControlled = typeof visibilityToggle === "object" && visibilityToggle.visible !== void 0;
+  const [visible, setVisible] = useState(() => visibilityControlled ? visibilityToggle.visible : false);
+  useEffect(() => {
+    if (visibilityControlled) {
+      setVisible(visibilityToggle.visible);
+    }
+  }, [visibilityControlled, visibilityToggle]);
+  const onVisibleChange = () => {
+    var _a;
+    if (props.disabled) {
+      return;
+    }
+    const nextVisible = !visible;
+    setVisible(nextVisible);
+    if (typeof visibilityToggle === "object") {
+      (_a = visibilityToggle.onVisibleChange) == null ? void 0 : _a.call(visibilityToggle, nextVisible);
+    }
+  };
+  const suffixIcon = (() => {
+    if (!visibilityToggle) {
+      return;
+    }
+    const icon = suffixIconRender(visible);
+    return /* @__PURE__ */ jsx("span", { onClick: onVisibleChange, onMouseDown: (e) => {
+      e.preventDefault();
+    }, onMouseUp: (e) => {
+      e.preventDefault();
+    }, css: getIconWrapperStyle(inputTokens, props.disabled)(theme), children: icon }, "password-icon");
+  })();
+  return /* @__PURE__ */ jsx(Input, { ...restProps, ref, type: visible ? "text" : "password", suffix: suffixIcon });
+});
+const InputPassword = memo(InputPasswordComponent);
+export {
+  InputPassword
+};

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

@@ -0,0 +1,10 @@
+import { InputTokens } from '../../Input.tokens';
+import { Theme } from 'themes';
+export declare const getIconWrapperStyle: (inputTokens: InputTokens, disabled: boolean | undefined) => (theme: Theme) => {
+    cursor: string;
+    display: string;
+    color: "#8C8C8C" | `rgba(${number}, ${number}, ${number}, 0.3)`;
+    ":hover": {
+        color: `rgba(${number}, ${number}, ${number}, 0.7)` | undefined;
+    };
+};

package/dist/components/Input/components/InputPassword/InputPassword.styles.js

@@ -0,0 +1,11 @@
+const getIconWrapperStyle = (inputTokens, disabled) => (theme) => ({
+  cursor: disabled ? "not-allowed" : "pointer",
+  display: "flex",
+  color: disabled ? inputTokens.inputTextDisabled : theme.transparentBlack30,
+  ":hover": {
+    color: disabled ? void 0 : theme.transparentBlack70
+  }
+});
+export {
+  getIconWrapperStyle
+};

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

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+import { InputProps } from '../../Input.types';
+interface VisibilityToggle {
+    visible?: boolean;
+    onVisibleChange?: (visible: boolean) => void;
+}
+export interface InputPasswordProps extends Omit<InputProps, "suffix"> {
+    suffixIconRender?: (visible?: boolean) => ReactNode;
+    visibilityToggle?: boolean | VisibilityToggle;
+}
+export {};

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

@@ -0,0 +1,2 @@
+import { InputTextAreaProps } from './InputTextArea.types';
+export declare const InputTextArea: import('react').MemoExoticComponent<import('react').ForwardRefExoticComponent<InputTextAreaProps & import('react').RefAttributes<HTMLTextAreaElement>>>;

package/dist/components/Input/components/InputTextArea/InputTextArea.js

@@ -0,0 +1,89 @@
+import { jsx } from "@emotion/react/jsx-runtime";
+import { forwardRef, useRef, useState, useEffect, useMemo, useLayoutEffect, memo } from "react";
+import calculateAutoSizeStyle from "./InputTextArea.utils.js";
+import { getTextareaStyle } from "./InputTextArea.styles.js";
+import { getInputTokens } from "../../Input.tokens.js";
+import { useMergeRefs } from "@floating-ui/react";
+import { useTheme } from "../../../../hooks/useTheme/useTheme.js";
+import { useMergedState } from "../../hooks/useMergeState/useMergeState.js";
+const RESIZE_START = 0;
+const RESIZE_MEASURING = 1;
+const RESIZE_STABLE = 2;
+const InputTextAreaComponent = forwardRef((props, ref) => {
+  const {
+    defaultValue,
+    value: valueProp,
+    status,
+    disabled,
+    autoSize,
+    style,
+    onChange,
+    ...restProps
+  } = props;
+  const theme = useTheme();
+  const inputTokens = getInputTokens(theme);
+  const textAreaRef = useRef(null);
+  const mergedRef = useMergeRefs([textAreaRef, ref]);
+  const errorStatus = status === "error";
+  const needAutoSize = !!autoSize;
+  const [value, setValue] = useMergedState(defaultValue, {
+    value: valueProp
+  });
+  const [resizeState, setResizeState] = useState(RESIZE_STABLE);
+  const [autoSizeStyle, setAutoSizeStyle] = useState();
+  useEffect(() => {
+    if (!window.ResizeObserver || !textAreaRef.current || !autoSize) {
+      return;
+    }
+    const observer = new ResizeObserver((entries) => {
+      requestAnimationFrame(() => {
+        entries.forEach(() => {
+          startResize();
+        });
+      });
+    });
+    observer.observe(textAreaRef.current);
+    return () => observer.disconnect();
+  }, [autoSize]);
+  const startResize = () => {
+    setResizeState(RESIZE_START);
+  };
+  const [minRows, maxRows] = useMemo(() => {
+    if (autoSize && typeof autoSize === "object") {
+      return [autoSize.minRows, autoSize.maxRows];
+    }
+    return [];
+  }, [autoSize]);
+  useLayoutEffect(() => {
+    if (needAutoSize) {
+      startResize();
+    }
+  }, [value, minRows, maxRows, needAutoSize]);
+  useLayoutEffect(() => {
+    if (resizeState === RESIZE_START) {
+      setResizeState(RESIZE_MEASURING);
+    } else if (resizeState === RESIZE_MEASURING) {
+      const textareaStyles = calculateAutoSizeStyle(textAreaRef.current, false, minRows, maxRows);
+      setResizeState(RESIZE_STABLE);
+      setAutoSizeStyle(textareaStyles);
+    }
+  }, [maxRows, minRows, resizeState]);
+  const handleChange = (e) => {
+    setValue(e.target.value);
+    onChange == null ? void 0 : onChange(e);
+  };
+  const mergedAutoSizeStyle = needAutoSize ? autoSizeStyle : null;
+  const mergedStyle = {
+    ...style,
+    ...mergedAutoSizeStyle
+  };
+  if (resizeState === RESIZE_START || resizeState === RESIZE_MEASURING) {
+    mergedStyle.overflowY = "hidden";
+    mergedStyle.overflowX = "hidden";
+  }
+  return /* @__PURE__ */ jsx("textarea", { ...restProps, ref: mergedRef, style: mergedStyle, value, disabled, onChange: handleChange, css: getTextareaStyle(inputTokens, errorStatus, disabled)(theme) });
+});
+const InputTextArea = memo(InputTextAreaComponent);
+export {
+  InputTextArea
+};

package/dist/components/Input/components/InputTextArea/InputTextArea.styles.d.ts

@@ -0,0 +1,33 @@
+import { InputTokens } from '../../Input.tokens';
+import { Theme } from 'themes';
+export declare const getTextareaStyle: (inputTokens: InputTokens, errorStatus: boolean, disabled: boolean | undefined) => (theme: Theme) => {
+    readonly resize: "vertical";
+    readonly minHeight: 28;
+    readonly color: "#262626" | "#8C8C8C";
+    readonly "::placeholder": {
+        readonly color: "#BFBFBF" | "inherit";
+    };
+    readonly backgroundColor: "#F0F0F0" | "#FFFFFF";
+    readonly borderRadius: 4;
+    readonly borderWidth: 1;
+    readonly borderStyle: "solid";
+    readonly borderColor: "#D9D9D9" | "#FF4D4F";
+    readonly ":focus, :focus-within": {
+        readonly outline: "none";
+        readonly borderColor: "#FF4D4F" | "#0CB3B3";
+        readonly boxShadow: `0px 0px 4px 0px rgba(${number}, ${number}, ${number}, 0.5)`;
+    };
+    readonly ":hover": {
+        readonly borderColor: "#FF7875" | "#50CCC4" | undefined;
+    };
+    readonly fontFamily: "Roboto";
+    readonly fontSize: 14;
+    readonly lineHeight: "20px";
+    readonly position: "relative";
+    readonly boxSizing: "border-box";
+    readonly minWidth: 0;
+    readonly width: "100%";
+    readonly cursor: "not-allowed" | undefined;
+    readonly paddingInline: number;
+    readonly paddingBlock: number;
+};

package/dist/components/Input/components/InputTextArea/InputTextArea.styles.js

@@ -0,0 +1,13 @@
+import { getSharedCommonStyle } from "../../Input.styles.js";
+const getTextareaStyle = (inputTokens, errorStatus, disabled) => (theme) => ({
+  ...getSharedCommonStyle(inputTokens, errorStatus, disabled, theme),
+  resize: "vertical",
+  minHeight: theme.controlHeightM,
+  color: disabled ? inputTokens.inputTextDisabled : inputTokens.inputText,
+  "::placeholder": {
+    color: disabled ? "inherit" : inputTokens.inputPlaceholder
+  }
+});
+export {
+  getTextareaStyle
+};

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

@@ -0,0 +1,10 @@
+import { TextareaHTMLAttributes } from 'react';
+interface AutoSizeType {
+    minRows?: number;
+    maxRows?: number;
+}
+export interface InputTextAreaProps extends Pick<TextareaHTMLAttributes<HTMLTextAreaElement>, "id" | "name" | "autoFocus" | "placeholder" | "cols" | "rows" | "maxLength" | "disabled" | "readOnly" | "defaultValue" | "value" | "style" | "onChange" | "onBlur" | "onFocus"> {
+    status?: "error";
+    autoSize?: boolean | AutoSizeType;
+}
+export {};

package/dist/components/Input/components/InputTextArea/InputTextArea.utils.d.ts

@@ -0,0 +1,9 @@
+import { CSSProperties } from 'react';
+export interface NodeType {
+    sizingStyle: string;
+    paddingSize: number;
+    borderSize: number;
+    boxSizing: string;
+}
+export declare function calculateNodeStyling(node: HTMLElement, useCache?: boolean): NodeType;
+export default function calculateAutoSizeStyle(uiTextNode: HTMLTextAreaElement | null, useCache?: boolean, minRows?: number | null, maxRows?: number | null): CSSProperties;

package/dist/components/Input/components/InputTextArea/InputTextArea.utils.js

@@ -0,0 +1,105 @@
+const HIDDEN_TEXTAREA_STYLE = `
+  min-height:0 !important;
+  max-height:none !important;
+  height:0 !important;
+  visibility:hidden !important;
+  overflow:hidden !important;
+  position:absolute !important;
+  z-index:-1000 !important;
+  top:0 !important;
+  right:0 !important;
+  pointer-events: none !important;
+`;
+const SIZING_STYLE = ["letter-spacing", "line-height", "padding-top", "padding-bottom", "font-family", "font-weight", "font-size", "font-variant", "text-rendering", "text-transform", "width", "text-indent", "padding-left", "padding-right", "border-width", "box-sizing", "word-break", "white-space"];
+const computedStyleCache = {};
+let hiddenTextarea;
+function calculateNodeStyling(node, useCache = false) {
+  const nodeRef = node.getAttribute("id") || node.getAttribute("data-reactid") || node.getAttribute("name");
+  if (useCache && computedStyleCache[nodeRef]) {
+    return computedStyleCache[nodeRef];
+  }
+  const style = window.getComputedStyle(node);
+  const boxSizing = style.getPropertyValue("box-sizing") || style.getPropertyValue("-moz-box-sizing") || style.getPropertyValue("-webkit-box-sizing");
+  const paddingSize = parseFloat(style.getPropertyValue("padding-bottom")) + parseFloat(style.getPropertyValue("padding-top"));
+  const borderSize = parseFloat(style.getPropertyValue("border-bottom-width")) + parseFloat(style.getPropertyValue("border-top-width"));
+  const sizingStyle = SIZING_STYLE.map((name) => `${name}:${style.getPropertyValue(name)}`).join(";");
+  const nodeInfo = {
+    sizingStyle,
+    paddingSize,
+    borderSize,
+    boxSizing
+  };
+  if (useCache && nodeRef) {
+    computedStyleCache[nodeRef] = nodeInfo;
+  }
+  return nodeInfo;
+}
+function calculateAutoSizeStyle(uiTextNode, useCache = false, minRows = null, maxRows = null) {
+  if (!uiTextNode) {
+    return {};
+  }
+  if (!hiddenTextarea) {
+    hiddenTextarea = document.createElement("textarea");
+    hiddenTextarea.setAttribute("tab-index", "-1");
+    hiddenTextarea.setAttribute("aria-hidden", "true");
+    hiddenTextarea.setAttribute("name", "hiddenTextarea");
+    document.body.appendChild(hiddenTextarea);
+  }
+  if (uiTextNode.getAttribute("wrap")) {
+    hiddenTextarea.setAttribute("wrap", uiTextNode.getAttribute("wrap"));
+  } else {
+    hiddenTextarea.removeAttribute("wrap");
+  }
+  const {
+    paddingSize,
+    borderSize,
+    boxSizing,
+    sizingStyle
+  } = calculateNodeStyling(uiTextNode, useCache);
+  hiddenTextarea.setAttribute("style", `${sizingStyle};${HIDDEN_TEXTAREA_STYLE}`);
+  hiddenTextarea.value = uiTextNode.value || uiTextNode.placeholder || "";
+  let minHeight = void 0;
+  let maxHeight = void 0;
+  let overflowY = void 0;
+  let height = hiddenTextarea.scrollHeight;
+  if (boxSizing === "border-box") {
+    height += borderSize;
+  } else if (boxSizing === "content-box") {
+    height -= paddingSize;
+  }
+  if (minRows !== null || maxRows !== null) {
+    hiddenTextarea.value = " ";
+    const singleRowHeight = hiddenTextarea.scrollHeight - paddingSize;
+    if (minRows !== null) {
+      minHeight = singleRowHeight * minRows;
+      if (boxSizing === "border-box") {
+        minHeight = minHeight + paddingSize + borderSize;
+      }
+      height = Math.max(minHeight, height);
+    }
+    if (maxRows !== null) {
+      maxHeight = singleRowHeight * maxRows;
+      if (boxSizing === "border-box") {
+        maxHeight = maxHeight + paddingSize + borderSize;
+      }
+      overflowY = height > maxHeight ? void 0 : "hidden";
+      height = Math.min(maxHeight, height);
+    }
+  }
+  const style = {
+    height,
+    overflowY,
+    resize: "none"
+  };
+  if (minHeight) {
+    style.minHeight = minHeight;
+  }
+  if (maxHeight) {
+    style.maxHeight = maxHeight;
+  }
+  return style;
+}
+export {
+  calculateNodeStyling,
+  calculateAutoSizeStyle as default
+};

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

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

package/dist/components/Input/hooks/useKeyboardEvents/useKeyboardEvents.d.ts

@@ -0,0 +1,7 @@
+import { FocusEventHandler, KeyboardEventHandler } from 'react';
+import { UseKeyboardEvents } from './useKeyboardEvents.types';
+export declare const useKeyboardEvents: (options?: UseKeyboardEvents) => {
+    onKeyDown: KeyboardEventHandler<HTMLInputElement>;
+    onKeyUp: KeyboardEventHandler<HTMLInputElement>;
+    onBlur: FocusEventHandler<HTMLInputElement>;
+};

package/dist/components/Input/hooks/useKeyboardEvents/useKeyboardEvents.js

@@ -0,0 +1,43 @@
+import { useRef, useEffect } from "react";
+const useKeyboardEvents = (options) => {
+  const {
+    onPressEnter,
+    onKeyDown,
+    onKeyUp,
+    onBlur,
+    disabled
+  } = options;
+  const enterKeyLockRef = useRef(false);
+  useEffect(() => {
+    if (enterKeyLockRef.current) {
+      enterKeyLockRef.current = false;
+    }
+  }, [disabled]);
+  const handleKeyDown = (e) => {
+    if (onPressEnter && e.key === "Enter" && !enterKeyLockRef.current) {
+      enterKeyLockRef.current = true;
+      onPressEnter(e);
+    }
+    onKeyDown == null ? void 0 : onKeyDown(e);
+  };
+  const handleKeyUp = (e) => {
+    if (e.key === "Enter") {
+      enterKeyLockRef.current = false;
+    }
+    onKeyUp == null ? void 0 : onKeyUp(e);
+  };
+  const handleBlur = (e) => {
+    if (enterKeyLockRef.current) {
+      enterKeyLockRef.current = false;
+    }
+    onBlur == null ? void 0 : onBlur(e);
+  };
+  return {
+    onKeyDown: handleKeyDown,
+    onKeyUp: handleKeyUp,
+    onBlur: handleBlur
+  };
+};
+export {
+  useKeyboardEvents
+};

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

@@ -0,0 +1,3 @@
+import { InputProps } from '../../Input.types';
+export interface UseKeyboardEvents extends Pick<InputProps, "onPressEnter" | "onKeyDown" | "onKeyUp" | "onBlur" | "disabled"> {
+}

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

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

package/dist/components/Input/hooks/useMergeState/useMergeState.d.ts

@@ -0,0 +1,21 @@
+import { default as React } from 'react';
+type Updater1<T> = T | ((prevValue: T) => T);
+export type SetState<T> = (nextValue: Updater1<T>, 
+/**
+ * Will not update state when destroyed.
+ * Developer should make sure this is safe to ignore.
+ */
+ignoreDestroy?: boolean) => void;
+export declare const useLayoutUpdateEffect: typeof React.useEffect;
+type Updater<T> = (updater: T | ((origin: T) => T), ignoreDestroy?: boolean) => void;
+/**
+ * Similar to `useState` but will use props value if provided.
+ * Note that internal use rc-util `useState` hook.
+ */
+export declare function useMergedState<T, R = T>(defaultStateValue: T | (() => T), option?: {
+    defaultValue?: T | (() => T);
+    value?: T;
+    onChange?: (value: T, prevValue: T) => void;
+    postState?: (value: T) => T;
+}): [R, Updater<T>];
+export {};

package/dist/components/Input/hooks/useMergeState/useMergeState.js

@@ -0,0 +1,94 @@
+import React from "react";
+function useSafeState(defaultValue) {
+  const destroyRef = React.useRef(false);
+  const [value, setValue] = React.useState(defaultValue);
+  React.useEffect(() => {
+    destroyRef.current = false;
+    return () => {
+      destroyRef.current = true;
+    };
+  }, []);
+  function safeSetState(updater, ignoreDestroy) {
+    if (ignoreDestroy && destroyRef.current) {
+      return;
+    }
+    setValue(updater);
+  }
+  return [value, safeSetState];
+}
+function canUseDom() {
+  return !!(typeof window !== "undefined" && window.document && window.document.createElement);
+}
+function useEvent(callback) {
+  const fnRef = React.useRef();
+  fnRef.current = callback;
+  const memoFn = React.useCallback((...args) => {
+    var _a;
+    return (_a = fnRef.current) == null ? void 0 : _a.call(fnRef, ...args);
+  }, []);
+  return memoFn;
+}
+const useInternalLayoutEffect = process.env.NODE_ENV !== "test" && canUseDom() ? React.useLayoutEffect : React.useEffect;
+const useLayoutEffect = (callback, deps) => {
+  const firstMountRef = React.useRef(true);
+  useInternalLayoutEffect(() => {
+    return callback(firstMountRef.current);
+  }, deps);
+  useInternalLayoutEffect(() => {
+    firstMountRef.current = false;
+    return () => {
+      firstMountRef.current = true;
+    };
+  }, []);
+};
+const useLayoutUpdateEffect = (callback, deps) => {
+  useLayoutEffect((firstMount) => {
+    if (!firstMount) {
+      return callback();
+    }
+  }, deps);
+};
+function hasValue(value) {
+  return value !== void 0;
+}
+function useMergedState(defaultStateValue, option) {
+  const {
+    defaultValue,
+    value,
+    onChange,
+    postState
+  } = option || {};
+  const [innerValue, setInnerValue] = useSafeState(() => {
+    if (hasValue(value)) {
+      return value;
+    } else if (hasValue(defaultValue)) {
+      return typeof defaultValue === "function" ? defaultValue() : defaultValue;
+    } else {
+      return typeof defaultStateValue === "function" ? defaultStateValue() : defaultStateValue;
+    }
+  });
+  const mergedValue = value !== void 0 ? value : innerValue;
+  const postMergedValue = postState ? postState(mergedValue) : mergedValue;
+  const onChangeFn = useEvent(onChange);
+  const [prevValue, setPrevValue] = useSafeState([mergedValue]);
+  useLayoutUpdateEffect(() => {
+    const prev = prevValue[0];
+    if (innerValue !== prev) {
+      onChangeFn(innerValue, prev);
+    }
+  }, [prevValue]);
+  useLayoutUpdateEffect(() => {
+    if (!hasValue(value)) {
+      setInnerValue(value);
+    }
+  }, [value]);
+  const triggerChange = useEvent((updater, ignoreDestroy) => {
+    setInnerValue(updater, ignoreDestroy);
+    setPrevValue([mergedValue], ignoreDestroy);
+  });
+  return [postMergedValue, triggerChange];
+}
+export {
+  useLayoutUpdateEffect,
+  useMergedState
+};

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

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

package/dist/components/Input/hooks/useRemovePasswordTimeout/useRemovePasswordTimeout.d.ts

@@ -0,0 +1,4 @@
+import { UseRemovePasswordTimeout } from './useRemovePasswordTimeout.types';
+export declare const useRemovePasswordTimeout: (options: UseRemovePasswordTimeout) => {
+    removePasswordTimeout: () => void;
+};

package/dist/components/Input/hooks/useRemovePasswordTimeout/useRemovePasswordTimeout.js

@@ -0,0 +1,49 @@
+import { useRef, useCallback, useEffect } from "react";
+import { usePrevious } from "../../../../hooks/usePrevious.js";
+import { isUndefined } from "lodash-es";
+const useRemovePasswordTimeout = (options) => {
+  const {
+    inputRef,
+    type,
+    triggerOnMount = true
+  } = options;
+  const prevType = usePrevious(type);
+  const removePasswordTimeoutRef = useRef([]);
+  const removePasswordTimeout = useCallback(() => {
+    removePasswordTimeoutRef.current.push(setTimeout(() => {
+      const input = inputRef.current;
+      if (!input) {
+        return;
+      }
+      if (input.getAttribute("type") === "password" && input.hasAttribute("value")) {
+        input.removeAttribute("value");
+      }
+    }));
+  }, [inputRef]);
+  useEffect(() => {
+    if (triggerOnMount) {
+      removePasswordTimeout();
+    }
+  }, [removePasswordTimeout, triggerOnMount]);
+  useEffect(() => {
+    const timers = removePasswordTimeoutRef.current;
+    return () => {
+      timers.forEach((timer) => {
+        if (timer) {
+          clearTimeout(timer);
+        }
+      });
+    };
+  }, []);
+  useEffect(() => {
+    if (!isUndefined(prevType) && prevType !== type && type === "password") {
+      removePasswordTimeout();
+    }
+  }, [prevType, removePasswordTimeout, type]);
+  return {
+    removePasswordTimeout
+  };
+};
+export {
+  useRemovePasswordTimeout
+};

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

@@ -0,0 +1,8 @@
+import { InputProps } from '../../Input.types';
+import { RefObject } from 'react';
+export interface UseRemovePasswordTimeout {
+    inputRef: RefObject<HTMLInputElement>;
+    type: InputProps["type"];
+    /** @default true */
+    triggerOnMount?: boolean;
+}

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

@@ -0,0 +1,2 @@
+export { Input } from './Input';
+export type { InputProps } from './Input.types';

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

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

package/dist/components/Input/utils/resolveOnChange/resolveOnChange.d.ts

@@ -0,0 +1,3 @@
+import { InputProps } from '../../Input.types';
+import { ChangeEvent, MouseEvent as ME } from 'react';
+export declare const resolveOnChange: <T extends HTMLInputElement>(target: T | null, e: ChangeEvent<T> | ME<HTMLButtonElement, MouseEvent>, onChange: InputProps["onChange"], targetValue?: string) => void;

package/dist/components/Input/utils/resolveOnChange/resolveOnChange.js

@@ -0,0 +1,41 @@
+import { emptyString } from "../../../../utils/const/index.js";
+function cloneEvent(event, target, value) {
+  const currentTarget = target.cloneNode(true);
+  const newEvent = Object.create(event, {
+    target: {
+      value: currentTarget
+    },
+    currentTarget: {
+      value: currentTarget
+    }
+  });
+  currentTarget.value = value;
+  if (typeof target.selectionStart === "number" && typeof target.selectionEnd === "number") {
+    currentTarget.selectionStart = target.selectionStart;
+    currentTarget.selectionEnd = target.selectionEnd;
+  }
+  currentTarget.setSelectionRange = (...args) => {
+    target.setSelectionRange(...args);
+  };
+  return newEvent;
+}
+const resolveOnChange = (target, e, onChange, targetValue) => {
+  if (!onChange || !target) {
+    return;
+  }
+  let event = e;
+  if (e.type === "click") {
+    event = cloneEvent(e, target, emptyString);
+    onChange(event);
+    return;
+  }
+  if (target.type !== "file" && targetValue !== void 0) {
+    event = cloneEvent(e, target, targetValue);
+    onChange(event);
+    return;
+  }
+  onChange(event);
+};
+export {
+  resolveOnChange
+};

package/dist/components/InputNumber/InputNumber.d.ts

@@ -0,0 +1,2 @@
+import { InputNumberProps } from './InputNumber.types';
+export declare const InputNumber: import('react').MemoExoticComponent<import('react').ForwardRefExoticComponent<InputNumberProps<string | number> & import('react').RefAttributes<HTMLInputElement>>>;