@janbox/storefront-ui 1.0.0

package/dist/lib/icon-button/types.d.ts

@@ -0,0 +1,15 @@
+import { JSX } from 'react';
+import { IconProps } from '../icon';
+import { ButtonVariant, ColorVariant, PropsWithCSS, ResponsiveDesign, SizeVariant, ShallowMerge } from '../../types';
+export type IconButtonResponsiveProps = PropsWithCSS<{
+    size?: SizeVariant;
+}>;
+type IconButtonExtendedProps = ResponsiveDesign<IconButtonResponsiveProps> & {
+    color?: ColorVariant;
+    variant?: ButtonVariant;
+    icon?: IconProps;
+    isLoading?: boolean;
+};
+export type IconButtonProps = ShallowMerge<JSX.IntrinsicElements["button"], IconButtonExtendedProps>;
+export {};
+//# sourceMappingURL=types.d.ts.map

package/dist/lib/icon-button/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/lib/icon-button/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5B,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEpC,OAAO,EACL,aAAa,EACb,YAAY,EACZ,YAAY,EACZ,gBAAgB,EAChB,WAAW,EACX,YAAY,EACb,MAAM,aAAa,CAAC;AAErB,MAAM,MAAM,yBAAyB,GAAG,YAAY,CAAC;IACnD,IAAI,CAAC,EAAE,WAAW,CAAC;CACpB,CAAC,CAAC;AAEH,KAAK,uBAAuB,GAAG,gBAAgB,CAAC,yBAAyB,CAAC,GAAG;IAC3E,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,YAAY,CACxC,GAAG,CAAC,iBAAiB,CAAC,QAAQ,CAAC,EAC/B,uBAAuB,CACxB,CAAC"}

package/dist/lib/image/helpers.cjs

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const utils_index = require("../../utils/index.cjs");
+const defaultProps = {
+  loading: "lazy",
+  xs: {
+    css: {
+      objectFit: "cover"
+    }
+  }
+};
+const getImageProps = (extended) => {
+  return utils_index.mergeComponentProps(defaultProps, extended);
+};
+exports.getImageProps = getImageProps;

package/dist/lib/image/helpers.d.ts

@@ -0,0 +1,3 @@
+import { ImageProps } from './types';
+export declare const getImageProps: (extended: ImageProps) => ImageProps;
+//# sourceMappingURL=helpers.d.ts.map

package/dist/lib/image/helpers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/lib/image/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAarC,eAAO,MAAM,aAAa,aAAc,UAAU,eAEjD,CAAC"}

package/dist/lib/image/helpers.js

@@ -0,0 +1,15 @@
+import { mergeComponentProps } from "../../utils/index.js";
+const defaultProps = {
+  loading: "lazy",
+  xs: {
+    css: {
+      objectFit: "cover"
+    }
+  }
+};
+const getImageProps = (extended) => {
+  return mergeComponentProps(defaultProps, extended);
+};
+export {
+  getImageProps
+};

package/dist/lib/image/image.cjs

@@ -0,0 +1,36 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const react = require("react");
+const lodashEs = require("lodash-es");
+const helpers = require("./helpers.cjs");
+const imagePlaceholder = require("../../assets/svg/image-placeholder.svg.cjs");
+const theme_screens = require("../../theme/screens.cjs");
+require("../../theme/palette.cjs");
+const Image = react.forwardRef((_props, ref) => {
+  const { xs, sm, md, lg, fallback = true, src, ...rest } = helpers.getImageProps(_props);
+  const fallbackSrc = react.useMemo(() => {
+    if (lodashEs.isString(fallback)) return fallback;
+    return fallback ? imagePlaceholder : void 0;
+  }, [fallback]);
+  const css = [
+    {
+      maxHeight: "100%"
+    },
+    xs == null ? void 0 : xs.css,
+    {
+      [theme_screens.mediaQuery("sm")]: sm == null ? void 0 : sm.css,
+      [theme_screens.mediaQuery("md")]: md == null ? void 0 : md.css,
+      [theme_screens.mediaQuery("lg")]: lg == null ? void 0 : lg.css
+    }
+  ];
+  const onError = (e) => {
+    var _a;
+    if (fallbackSrc) {
+      e.currentTarget.src = fallbackSrc;
+    }
+    (_a = rest.onError) == null ? void 0 : _a.call(rest, e);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx("img", { src: src || fallbackSrc, alt: "", css, ...rest, ref, onError });
+});
+exports.Image = Image;

package/dist/lib/image/image.d.ts

@@ -0,0 +1,3 @@
+import { ImageProps } from './types';
+export declare const Image: import('react').ForwardRefExoticComponent<Omit<ImageProps, "ref"> & import('react').RefAttributes<HTMLImageElement>>;
+//# sourceMappingURL=image.d.ts.map

package/dist/lib/image/image.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"image.d.ts","sourceRoot":"","sources":["../../../src/lib/image/image.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAKrC,eAAO,MAAM,KAAK,sHA6BhB,CAAC"}

package/dist/lib/image/image.js

@@ -0,0 +1,36 @@
+import { jsx } from "@emotion/react/jsx-runtime";
+import { forwardRef, useMemo } from "react";
+import { isString } from "lodash-es";
+import { getImageProps } from "./helpers.js";
+import IMAGE_PLACEHOLDER from "../../assets/svg/image-placeholder.svg.js";
+import { mediaQuery } from "../../theme/screens.js";
+import "../../theme/palette.js";
+const Image = forwardRef((_props, ref) => {
+  const { xs, sm, md, lg, fallback = true, src, ...rest } = getImageProps(_props);
+  const fallbackSrc = useMemo(() => {
+    if (isString(fallback)) return fallback;
+    return fallback ? IMAGE_PLACEHOLDER : void 0;
+  }, [fallback]);
+  const css = [
+    {
+      maxHeight: "100%"
+    },
+    xs == null ? void 0 : xs.css,
+    {
+      [mediaQuery("sm")]: sm == null ? void 0 : sm.css,
+      [mediaQuery("md")]: md == null ? void 0 : md.css,
+      [mediaQuery("lg")]: lg == null ? void 0 : lg.css
+    }
+  ];
+  const onError = (e) => {
+    var _a;
+    if (fallbackSrc) {
+      e.currentTarget.src = fallbackSrc;
+    }
+    (_a = rest.onError) == null ? void 0 : _a.call(rest, e);
+  };
+  return /* @__PURE__ */ jsx("img", { src: src || fallbackSrc, alt: "", css, ...rest, ref, onError });
+});
+export {
+  Image
+};

package/dist/lib/image/index.d.ts

@@ -0,0 +1,4 @@
+export * from './image';
+export * from './types';
+export * from './helpers';
+//# sourceMappingURL=index.d.ts.map

package/dist/lib/image/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/lib/image/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC"}

package/dist/lib/image/types.d.ts

@@ -0,0 +1,8 @@
+import { JSX } from 'react';
+import { ResponsiveDesign, PropsWithCSS, ShallowMerge } from '../../types';
+type ImageExtendedProps = {
+    fallback?: string | boolean;
+} & ResponsiveDesign<PropsWithCSS>;
+export type ImageProps = ShallowMerge<JSX.IntrinsicElements["img"], ImageExtendedProps>;
+export {};
+//# sourceMappingURL=types.d.ts.map

package/dist/lib/image/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/lib/image/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5B,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAEvE,KAAK,kBAAkB,GAAG;IACxB,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;CAC7B,GAAG,gBAAgB,CAAC,YAAY,CAAC,CAAC;AAEnC,MAAM,MAAM,UAAU,GAAG,YAAY,CACnC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,EAC5B,kBAAkB,CACnB,CAAC"}

package/dist/lib/index.d.ts

@@ -0,0 +1,62 @@
+export * from './grid';
+export * from './text';
+export * from './swiper';
+export * from './marquee';
+export * from './button';
+export * from './checkbox';
+export * from './accordion';
+export * from './image';
+export * from './input';
+export * from './textarea';
+export * from './select';
+export * from './popover';
+export * from './radio-button';
+export * from './linear-progress';
+export * from './highlight-words';
+export * from './menu';
+export * from './icon';
+export * from './flag';
+export * from './unordered-list';
+export * from './flexbox';
+export * from './tabs';
+export * from './swiper';
+export * from './floating';
+export * from './box';
+export * from './form-label';
+export * from './icon-button';
+export * from './container';
+export * from './star-rating';
+export * from './pagination';
+export * from './dialog';
+export * from './generic-element';
+export * from './loading';
+export * from './link';
+export * from './trans-html';
+export * from './count-up';
+export * from './nav-link';
+export * from './breadcrumbs';
+export * from './phone-input';
+export * from './form-helper-text';
+export * from './otp-input';
+export * from './notifications';
+export * from './countdown-timer';
+export * from './drawer';
+export * from './filter-panel';
+export * from './collapse';
+export * from './input-number';
+export * from './table';
+export * from './badge';
+export * from './switch';
+export * from './chip';
+export * from './stepper';
+export * from './progress';
+export * from './input-range';
+export * from './tooltip';
+export * from './multiple-select';
+export * from './date-picker';
+export * from './time-picker';
+export * from './video';
+export * from './lightbox';
+export * from './cascader';
+export * from './primitive';
+//# sourceMappingURL=index.d.ts.map

package/dist/lib/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/lib/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,kBAAkB,CAAC;AACjC,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,OAAO,CAAC;AACtB,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,mBAAmB,CAAC;AAClC,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,oBAAoB,CAAC;AACnC,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC;AAChC,cAAc,mBAAmB,CAAC;AAClC,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,WAAW,CAAC;AAC1B,cAAc,mBAAmB,CAAC;AAClC,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC"}

package/dist/lib/input/helpers.cjs

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const theme_screens = require("../../theme/screens.cjs");
+require("../../theme/palette.cjs");
+const theme_typography = require("../../theme/typography.cjs");
+const utils_index = require("../../utils/index.cjs");
+const defaultProps = {
+  xs: {
+    size: "md"
+  }
+};
+const getInputCssBySize = (size) => {
+  const { inputPaddingX, inputSize, textVariant } = utils_index.getSizeVariantState(size);
+  return {
+    paddingLeft: inputPaddingX,
+    paddingRight: inputPaddingX,
+    height: inputSize,
+    fontSize: textVariant ? theme_typography.getTypographyVar(textVariant).fontSize : void 0,
+    lineHeight: textVariant ? theme_typography.getTypographyVar(textVariant).lineHeight : void 0
+  };
+};
+const getInputProps = (extended) => {
+  return utils_index.mergeComponentProps(
+    defaultProps,
+    extended,
+    ...theme_screens.screens.map((screen) => {
+      return (current) => {
+        var _a;
+        return {
+          [screen]: {
+            css: getInputCssBySize((_a = current[screen]) == null ? void 0 : _a.size)
+          }
+        };
+      };
+    })
+  );
+};
+exports.getInputProps = getInputProps;

package/dist/lib/input/helpers.d.ts

@@ -0,0 +1,3 @@
+import { InputProps } from './types';
+export declare const getInputProps: (extended: InputProps) => InputProps;
+//# sourceMappingURL=helpers.d.ts.map

package/dist/lib/input/helpers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/lib/input/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAwB,MAAM,SAAS,CAAC;AAwB3D,eAAO,MAAM,aAAa,aAAc,UAAU,eAcjD,CAAC"}

package/dist/lib/input/helpers.js

@@ -0,0 +1,38 @@
+import { screens } from "../../theme/screens.js";
+import "../../theme/palette.js";
+import { getTypographyVar } from "../../theme/typography.js";
+import { mergeComponentProps, getSizeVariantState } from "../../utils/index.js";
+const defaultProps = {
+  xs: {
+    size: "md"
+  }
+};
+const getInputCssBySize = (size) => {
+  const { inputPaddingX, inputSize, textVariant } = getSizeVariantState(size);
+  return {
+    paddingLeft: inputPaddingX,
+    paddingRight: inputPaddingX,
+    height: inputSize,
+    fontSize: textVariant ? getTypographyVar(textVariant).fontSize : void 0,
+    lineHeight: textVariant ? getTypographyVar(textVariant).lineHeight : void 0
+  };
+};
+const getInputProps = (extended) => {
+  return mergeComponentProps(
+    defaultProps,
+    extended,
+    ...screens.map((screen) => {
+      return (current) => {
+        var _a;
+        return {
+          [screen]: {
+            css: getInputCssBySize((_a = current[screen]) == null ? void 0 : _a.size)
+          }
+        };
+      };
+    })
+  );
+};
+export {
+  getInputProps
+};

package/dist/lib/input/index.d.ts

@@ -0,0 +1,4 @@
+export * from './input';
+export * from './types';
+export * from './helpers';
+//# sourceMappingURL=index.d.ts.map

package/dist/lib/input/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/lib/input/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC"}

package/dist/lib/input/input.cjs

@@ -0,0 +1,205 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const react = require("react");
+const react$1 = require("@floating-ui/react");
+const lodashEs = require("lodash-es");
+const helpers = require("./helpers.cjs");
+const input_module = require("./input.module.scss.cjs");
+const utils_index = require("../../utils/index.cjs");
+const eyeHidden = require("../../assets/svg/eye-hidden.svg.cjs");
+const eyeShowVisible = require("../../assets/svg/eye-show-visible.svg.cjs");
+const theme_screens = require("../../theme/screens.cjs");
+require("../../theme/palette.cjs");
+const formHelperText = require("../form-helper-text/form-helper-text.cjs");
+const icon = require("../icon/icon.cjs");
+const stylesheet = require("../../utils/stylesheet.cjs");
+const Input = react.forwardRef((_props, ref) => {
+  const {
+    type,
+    xs,
+    sm,
+    md,
+    lg,
+    prefix,
+    suffix,
+    containerProps,
+    mainProps,
+    className,
+    helperText,
+    error,
+    startIcon,
+    endIcon,
+    onChange: onChangeProp,
+    transform,
+    debounce = 0,
+    mode = "onChange",
+    value,
+    ...rest
+  } = helpers.getInputProps(_props);
+  const inputRef = react.useRef(null);
+  const [showPassword, setShowPassword] = react.useState(false);
+  const [typingValue, setTypingValue] = react.useState();
+  const timeoutFn = react.useRef(null);
+  const beforeChangeValue = react.useRef("");
+  const mergedRefs = react$1.useMergeRefs([ref, inputRef]);
+  const onChange = (e, force = false) => {
+    e.target.value = transform ? transform(e.target.value) : e.target.value;
+    if (timeoutFn.current) {
+      clearTimeout(timeoutFn.current);
+    }
+    const isFocused = document.activeElement === e.target;
+    if (force || !isFocused) {
+      onChangeProp == null ? void 0 : onChangeProp(e);
+      return;
+    }
+    if (mode === "onBlur") {
+      if (lodashEs.isString(value)) {
+        setTypingValue(e.target.value);
+      }
+      return;
+    }
+    if (debounce > 0) {
+      if (lodashEs.isString(value)) {
+        setTypingValue(e.target.value);
+      }
+      timeoutFn.current = setTimeout(() => {
+        onChangeProp == null ? void 0 : onChangeProp(e);
+      }, debounce);
+      return;
+    }
+    onChangeProp == null ? void 0 : onChangeProp(e);
+  };
+  const onFocus = (e) => {
+    var _a;
+    beforeChangeValue.current = e.target.value;
+    (_a = rest.onFocus) == null ? void 0 : _a.call(rest, e);
+  };
+  const onBlur = (e) => {
+    var _a;
+    if (beforeChangeValue.current !== e.target.value) {
+      if (mode === "onBlur" || debounce > 0) {
+        onChange(e, true);
+      }
+    }
+    (_a = rest.onBlur) == null ? void 0 : _a.call(rest, e);
+    setTimeout(() => {
+      setTypingValue(void 0);
+    }, debounce);
+  };
+  const css = [
+    createStyle(xs),
+    {
+      [theme_screens.mediaQuery("sm")]: createStyle(sm),
+      [theme_screens.mediaQuery("md")]: createStyle(md),
+      [theme_screens.mediaQuery("lg")]: createStyle(lg)
+    }
+  ];
+  const toggleShowPassword = (e) => {
+    e.stopPropagation();
+    setShowPassword((prev) => !prev);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ...containerProps, className: stylesheet.cn(input_module.default.input__container, containerProps == null ? void 0 : containerProps.className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        css,
+        ...mainProps,
+        className: stylesheet.cn(
+          input_module.default.input__main,
+          {
+            [input_module.default.input__main_error]: error
+          },
+          mainProps == null ? void 0 : mainProps.className
+        ),
+        children: [
+          prefix,
+          !!startIcon && /* @__PURE__ */ jsxRuntime.jsx(
+            icon.Icon,
+            {
+              ...startIcon,
+              xs: {
+                size: utils_index.getSizeVariantState(xs == null ? void 0 : xs.size).iconSize,
+                ...startIcon.xs
+              },
+              sm: {
+                size: utils_index.getSizeVariantState(sm == null ? void 0 : sm.size).iconSize,
+                ...startIcon.sm
+              },
+              md: {
+                size: utils_index.getSizeVariantState(md == null ? void 0 : md.size).iconSize,
+                ...startIcon.md
+              },
+              lg: {
+                size: utils_index.getSizeVariantState(lg == null ? void 0 : lg.size).iconSize,
+                ...startIcon.lg
+              }
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "input",
+            {
+              "data-error": error,
+              type: type === "password" && showPassword ? "text" : type,
+              className: stylesheet.cn(input_module.default.input__control, className),
+              ...rest,
+              value: typingValue ?? value,
+              ref: mergedRefs,
+              onChange,
+              onBlur,
+              onFocus
+            }
+          ),
+          !!endIcon && /* @__PURE__ */ jsxRuntime.jsx(
+            icon.Icon,
+            {
+              ...endIcon,
+              xs: {
+                size: utils_index.getSizeVariantState(xs == null ? void 0 : xs.size).iconSize,
+                ...endIcon.xs
+              },
+              sm: {
+                size: utils_index.getSizeVariantState(sm == null ? void 0 : sm.size).iconSize,
+                ...endIcon.sm
+              },
+              md: {
+                size: utils_index.getSizeVariantState(md == null ? void 0 : md.size).iconSize,
+                ...endIcon.md
+              },
+              lg: {
+                size: utils_index.getSizeVariantState(lg == null ? void 0 : lg.size).iconSize,
+                ...endIcon.lg
+              }
+            }
+          ),
+          suffix,
+          type === "password" && /* @__PURE__ */ jsxRuntime.jsx(
+            icon.Icon,
+            {
+              onClick: toggleShowPassword,
+              css: { cursor: "pointer" },
+              xs: {
+                size: utils_index.getSizeVariantState(xs == null ? void 0 : xs.size).iconSize
+              },
+              sm: {
+                size: utils_index.getSizeVariantState(sm == null ? void 0 : sm.size).iconSize
+              },
+              md: {
+                size: utils_index.getSizeVariantState(md == null ? void 0 : md.size).iconSize
+              },
+              lg: {
+                size: utils_index.getSizeVariantState(lg == null ? void 0 : lg.size).iconSize
+              },
+              source: showPassword ? eyeShowVisible : eyeHidden
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(formHelperText.FormHelperText, { error, children: helperText })
+  ] });
+});
+const createStyle = ({ css } = {}) => {
+  return [css];
+};
+exports.Input = Input;

package/dist/lib/input/input.d.ts

@@ -0,0 +1,3 @@
+import { InputProps } from './types';
+export declare const Input: import('react').ForwardRefExoticComponent<Omit<InputProps, "ref"> & import('react').RefAttributes<HTMLInputElement>>;
+//# sourceMappingURL=input.d.ts.map

package/dist/lib/input/input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/lib/input/input.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,UAAU,EAAwB,MAAM,SAAS,CAAC;AAW3D,eAAO,MAAM,KAAK,sHA+LhB,CAAC"}