@oneplatformdev/ui 0.1.99-beta.262 → 0.1.99-beta.265

package/Input/Input.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.js","sources":["../../src/Input/Input.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { Eye, EyeOff } from 'lucide-react';\nimport { inputVariants } from './inputVariants';\n\nimport { cn } from '@oneplatformdev/utils';\nimport { InputProps } from './Input.types';\n\nexport const BaseInput = React.forwardRef<HTMLInputElement, InputProps>(\n  (props, ref) => {\n    const {\n      className,\n      variant,\n      type,\n      slotProps: { input, wrapper } = {},\n      onChange,\n      onTransform,\n      counter = false,\n      maxLength,\n      fullSize = false,\n      value,\n      ...rest\n    } = props;\n    const {\n      startAdornment,\n      className: classNameInputSlotProps,\n      ...restInputSlotProps\n    } = input || {};\n    return (\n      <div\n        {...(wrapper || {})}\n        className={cn(\n          'relative',\n          fullSize && 'w-full',\n          wrapper?.className\n        )}>\n        {Boolean(startAdornment) && (\n          <span className=\"absolute left-[10px] top-1/2 -translate-y-1/2\">\n            {startAdornment}\n          </span>\n        )}\n        <input\n          type={type}\n          className={cn(\n            inputVariants({ variant, className }),\n            Boolean(startAdornment) && 'pl-10',\n            classNameInputSlotProps,\n            fullSize && 'min-w-auto',\n          )}\n          ref={ref}\n          maxLength={maxLength}\n          value={value}\n          {...restInputSlotProps}\n          {...rest}\n          onChange={(e) => {\n            if (typeof onTransform?.(e.target.value, e) === 'string') {\n              e.target.value = onTransform(e.target.value, e);\n            }\n            if (onChange) onChange(e);\n          }}\n        />\n        {counter && typeof maxLength === 'number' && (\n          <div className={cn(\n            'w-full text-right inline-flex items-center justify-end',\n            'text-xs font-medium leading-[1.2] text-muted-foreground',\n            'peer-disabled:cursor-not-allowed peer-disabled:opacity-70'\n          )}>\n            {String(value || '').length}/{maxLength}\n          </div>\n        )}\n      </div>\n    );\n  }\n);\nBaseInput.displayName = 'Input';\n\nexport const PasswordInput = React.forwardRef<HTMLInputElement, InputProps>(\n  (props, ref) => {\n    const [isVisible, setIsVisible] = useState<boolean>(false);\n\n    const inputType = isVisible ? 'text' : 'password';\n\n    const toggleVisibility = () => {\n      setIsVisible(!isVisible);\n    };\n\n    return (\n      <div {...(props?.slotProps?.wrapper || {})} className={cn('relative', props?.slotProps?.wrapper?.className)}>\n        <BaseInput {...props} type={inputType} className=\"pr-8\" ref={ref} />\n        <VisibilityButton isVisible={isVisible} onClick={toggleVisibility} />\n      </div>\n    );\n  }\n);\nPasswordInput.displayName = 'PasswordInput';\n\ntype VisibilityButtonProps = {\n  isVisible: boolean\n  onClick: () => void\n}\n\nconst VisibilityButton = ({ isVisible, onClick }:VisibilityButtonProps) => (\n  <button\n    type=\"button\"\n    onClick={onClick}\n    className=\"absolute top-1/2 right-3 transform -translate-y-1/2\"\n  >\n    {isVisible ? <Eye size={16} /> : <EyeOff size={16} />}\n  </button>\n);\n\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n  ({ type, ...props }, ref) => {\n    if (type === 'password') return <PasswordInput type={type} {...props} ref={ref} />;\n    return <BaseInput type={type} {...props} ref={ref} />;\n  }\n);\nInput.displayName = 'Input';\n"],"names":["BaseInput","React","props","ref","className","variant","type","input","wrapper","onChange","onTransform","counter","maxLength","fullSize","value","rest","startAdornment","classNameInputSlotProps","restInputSlotProps","jsxs","cn","jsx","inputVariants","e","PasswordInput","isVisible","setIsVisible","useState","inputType","toggleVisibility","VisibilityButton","onClick","Eye","EyeOff","Input"],"mappings":"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"}
+{"version":3,"file":"Input.js","sources":["../../src/Input/Input.tsx"],"sourcesContent":["import React, { useImperativeHandle, useRef, useState } from 'react';\r\nimport { Eye, EyeOff, X } from 'lucide-react';\r\nimport { inputVariants } from './inputVariants';\r\n\r\nimport { cn } from '@oneplatformdev/utils';\r\nimport { InputProps } from './Input.types';\r\n\r\nconst clearInputNatively = (input: HTMLInputElement | null) => {\r\n  if (!input) return;\r\n  const setter = Object.getOwnPropertyDescriptor(\r\n    HTMLInputElement.prototype,\r\n    'value',\r\n  )?.set;\r\n  setter?.call(input, '');\r\n  input.dispatchEvent(new Event('input', { bubbles: true }));\r\n  input.dispatchEvent(new Event('change', { bubbles: true }));\r\n};\r\n\r\nexport const BaseInput = React.forwardRef<HTMLInputElement, InputProps>(\r\n  (props, ref) => {\r\n    const {\r\n      className,\r\n      variant,\r\n      type,\r\n      slotProps: { input, wrapper } = {},\r\n      onChange,\r\n      onTransform,\r\n      counter = false,\r\n      maxLength,\r\n      fullSize = false,\r\n      value,\r\n      defaultValue,\r\n      disabled,\r\n      readOnly,\r\n      clearable = false,\r\n      onClear,\r\n      ...rest\r\n    } = props;\r\n    const {\r\n      startAdornment,\r\n      className: classNameInputSlotProps,\r\n      ...restInputSlotProps\r\n    } = input || {};\r\n\r\n    const innerRef = useRef<HTMLInputElement>(null);\r\n    useImperativeHandle(ref, () => innerRef.current as HTMLInputElement);\r\n\r\n    const isControlled = value !== undefined;\r\n    const [uncontrolledValue, setUncontrolledValue] = useState<string>(\r\n      defaultValue !== undefined ? String(defaultValue) : '',\r\n    );\r\n    const currentValue = isControlled ? String(value ?? '') : uncontrolledValue;\r\n\r\n    const showClear =\r\n      clearable && !disabled && !readOnly && currentValue.length > 0;\r\n\r\n    const handleClear = () => {\r\n      clearInputNatively(innerRef.current);\r\n      if (!isControlled) setUncontrolledValue('');\r\n      innerRef.current?.focus();\r\n      onClear?.();\r\n    };\r\n\r\n    return (\r\n      <div\r\n        {...(wrapper || {})}\r\n        className={cn(\r\n          'relative',\r\n          fullSize && 'w-full',\r\n          wrapper?.className\r\n        )}>\r\n        {Boolean(startAdornment) && (\r\n          <span className=\"absolute left-[10px] top-1/2 -translate-y-1/2\">\r\n            {startAdornment}\r\n          </span>\r\n        )}\r\n        <input\r\n          type={type}\r\n          className={cn(\r\n            inputVariants({ variant, className }),\r\n            Boolean(startAdornment) && 'pl-10',\r\n            clearable && 'pr-8',\r\n            classNameInputSlotProps,\r\n            fullSize && 'min-w-auto',\r\n          )}\r\n          ref={innerRef}\r\n          maxLength={maxLength}\r\n          value={value}\r\n          defaultValue={defaultValue}\r\n          disabled={disabled}\r\n          readOnly={readOnly}\r\n          {...restInputSlotProps}\r\n          {...rest}\r\n          onChange={(e) => {\r\n            if (typeof onTransform?.(e.target.value, e) === 'string') {\r\n              e.target.value = onTransform(e.target.value, e);\r\n            }\r\n            if (!isControlled) setUncontrolledValue(e.target.value);\r\n            if (onChange) onChange(e);\r\n          }}\r\n        />\r\n        {showClear && (\r\n          <button\r\n            type=\"button\"\r\n            tabIndex={-1}\r\n            aria-label=\"Clear input\"\r\n            onMouseDown={(e) => e.preventDefault()}\r\n            onClick={handleClear}\r\n            className={cn(\r\n              'absolute top-1/2 right-3 -translate-y-1/2',\r\n              'text-muted-foreground hover:text-foreground',\r\n              'inline-flex items-center justify-center',\r\n            )}\r\n          >\r\n            <X size={16} />\r\n          </button>\r\n        )}\r\n        {counter && typeof maxLength === 'number' && (\r\n          <div className={cn(\r\n            'w-full text-right inline-flex items-center justify-end',\r\n            'text-xs font-medium leading-[1.2] text-muted-foreground',\r\n            'peer-disabled:cursor-not-allowed peer-disabled:opacity-70'\r\n          )}>\r\n            {currentValue.length}/{maxLength}\r\n          </div>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n);\r\nBaseInput.displayName = 'Input';\r\n\r\nexport const PasswordInput = React.forwardRef<HTMLInputElement, InputProps>(\r\n  (props, ref) => {\r\n    const [isVisible, setIsVisible] = useState<boolean>(false);\r\n\r\n    const inputType = isVisible ? 'text' : 'password';\r\n\r\n    const toggleVisibility = () => {\r\n      setIsVisible(!isVisible);\r\n    };\r\n\r\n    return (\r\n      <div {...(props?.slotProps?.wrapper || {})} className={cn('relative', props?.slotProps?.wrapper?.className)}>\r\n        <BaseInput {...props} type={inputType} className=\"pr-8\" ref={ref} />\r\n        <VisibilityButton isVisible={isVisible} onClick={toggleVisibility} />\r\n      </div>\r\n    );\r\n  }\r\n);\r\nPasswordInput.displayName = 'PasswordInput';\r\n\r\ntype VisibilityButtonProps = {\r\n  isVisible: boolean\r\n  onClick: () => void\r\n}\r\n\r\nconst VisibilityButton = ({ isVisible, onClick }:VisibilityButtonProps) => (\r\n  <button\r\n    type=\"button\"\r\n    onClick={onClick}\r\n    className=\"absolute top-1/2 right-3 transform -translate-y-1/2\"\r\n  >\r\n    {isVisible ? <Eye size={16} /> : <EyeOff size={16} />}\r\n  </button>\r\n);\r\n\r\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\r\n  ({ type, ...props }, ref) => {\r\n    if (type === 'password') return <PasswordInput type={type} {...props} ref={ref} />;\r\n    return <BaseInput type={type} {...props} ref={ref} />;\r\n  }\r\n);\r\nInput.displayName = 'Input';\r\n"],"names":["clearInputNatively","input","BaseInput","React","props","ref","className","variant","type","wrapper","onChange","onTransform","counter","maxLength","fullSize","value","defaultValue","disabled","readOnly","clearable","onClear","rest","startAdornment","classNameInputSlotProps","restInputSlotProps","innerRef","useRef","useImperativeHandle","isControlled","uncontrolledValue","setUncontrolledValue","useState","currentValue","showClear","handleClear","jsxs","cn","jsx","inputVariants","e","X","PasswordInput","isVisible","setIsVisible","inputType","toggleVisibility","VisibilityButton","onClick","Eye","EyeOff","Input"],"mappings":"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"}

package/Input/Input.stories.js

@@ -1,10 +1,10 @@
 import { jsx as e } from "react/jsx-runtime";
-import { useState as n } from "react";
-import { Search as s, Mail as c } from "lucide-react";
-import { Input as l } from "./Input.js";
+import { useState as o } from "react";
+import { Search as c, Mail as s } from "lucide-react";
+import { Input as n } from "./Input.js";
 const h = {
   title: "Input/Input",
-  component: l,
+  component: n,
   tags: ["autodocs"],
   parameters: {
     layout: "centered"
@@ -14,9 +14,13 @@ const h = {
     variant: "default",
     fullSize: !1,
     counter: !1,
-    disabled: !1
+    disabled: !1,
+    clearable: !1
   },
   argTypes: {
+    clearable: {
+      control: "boolean"
+    },
     variant: {
       control: "select",
       options: ["default", "grey"]
@@ -52,39 +56,39 @@ const h = {
     type: "text",
     placeholder: "Grey input"
   }
-}, f = {
+}, v = {
   args: {
     placeholder: "Search...",
     slotProps: {
       input: {
-        startAdornment: /* @__PURE__ */ e(s, { size: 16 })
+        startAdornment: /* @__PURE__ */ e(c, { size: 16 })
       }
     }
   }
-}, v = {
+}, b = {
   args: {
     type: "email",
     placeholder: "Email address",
     slotProps: {
       input: {
-        startAdornment: /* @__PURE__ */ e(c, { size: 16 })
+        startAdornment: /* @__PURE__ */ e(s, { size: 16 })
       }
     }
   }
-}, y = {
+}, f = {
   args: {
     type: "password",
     placeholder: "Password"
   }
-}, b = {
-  render: (t) => {
-    const [r, o] = n("");
+}, x = {
+  render: (a) => {
+    const [t, l] = o("");
     return /* @__PURE__ */ e("div", { className: "w-[320px]", children: /* @__PURE__ */ e(
-      l,
+      n,
       {
-        ...t,
-        value: r,
-        onChange: (a) => o(a.target.value)
+        ...a,
+        value: t,
+        onChange: (r) => l(r.target.value)
       }
     ) });
   },
@@ -93,8 +97,8 @@ const h = {
     counter: !0,
     maxLength: 50
   }
-}, x = {
-  render: (t) => /* @__PURE__ */ e("div", { className: "w-[480px]", children: /* @__PURE__ */ e(l, { ...t }) }),
+}, y = {
+  render: (a) => /* @__PURE__ */ e("div", { className: "w-[480px]", children: /* @__PURE__ */ e(n, { ...a }) }),
   args: {
     placeholder: "Full width input",
     fullSize: !0
@@ -105,31 +109,94 @@ const h = {
     disabled: !0,
     value: "Disabled value"
   }
-}, S = {
-  render: (t) => {
-    const [r, o] = n("");
+}, C = {
+  render: (a) => {
+    const [t, l] = o("");
     return /* @__PURE__ */ e("div", { className: "w-[320px]", children: /* @__PURE__ */ e(
-      l,
+      n,
       {
-        ...t,
-        value: r,
-        onTransform: (a) => a.replace(/\D/g, ""),
-        onChange: (a) => o(a.target.value)
+        ...a,
+        value: t,
+        onTransform: (r) => r.replace(/\D/g, ""),
+        onChange: (r) => l(r.target.value)
       }
     ) });
   },
   args: {
     placeholder: "Only numbers allowed"
   }
-}, D = {
-  render: (t) => {
-    const [r, o] = n("");
+}, S = {
+  render: (a) => {
+    const [t, l] = o("Clear me");
+    return /* @__PURE__ */ e("div", { className: "w-[320px]", children: /* @__PURE__ */ e(
+      n,
+      {
+        ...a,
+        value: t,
+        onChange: (r) => l(r.target.value),
+        onClear: () => console.log("cleared")
+      }
+    ) });
+  },
+  args: {
+    placeholder: "Type something...",
+    clearable: !0
+  }
+}, N = {
+  render: (a) => /* @__PURE__ */ e("div", { className: "w-[320px]", children: /* @__PURE__ */ e(n, { ...a, defaultValue: "Uncontrolled value" }) }),
+  args: {
+    placeholder: "Type something...",
+    clearable: !0
+  }
+}, V = {
+  render: (a) => {
+    const [t, l] = o("john@example.com");
+    return /* @__PURE__ */ e("div", { className: "w-[320px]", children: /* @__PURE__ */ e(
+      n,
+      {
+        ...a,
+        value: t,
+        onChange: (r) => l(r.target.value)
+      }
+    ) });
+  },
+  args: {
+    type: "email",
+    placeholder: "Email address",
+    clearable: !0,
+    slotProps: {
+      input: {
+        startAdornment: /* @__PURE__ */ e(s, { size: 16 })
+      }
+    }
+  }
+}, P = {
+  render: (a) => {
+    const [t, l] = o("Some text");
+    return /* @__PURE__ */ e("div", { className: "w-[320px]", children: /* @__PURE__ */ e(
+      n,
+      {
+        ...a,
+        value: t,
+        onChange: (r) => l(r.target.value)
+      }
+    ) });
+  },
+  args: {
+    placeholder: "Type something...",
+    clearable: !0,
+    counter: !0,
+    maxLength: 50
+  }
+}, T = {
+  render: (a) => {
+    const [t, l] = o("");
     return /* @__PURE__ */ e("div", { className: "w-[360px]", children: /* @__PURE__ */ e(
-      l,
+      n,
       {
-        ...t,
-        value: r,
-        onChange: (a) => o(a.target.value)
+        ...a,
+        value: t,
+        onChange: (r) => l(r.target.value)
       }
     ) });
   },
@@ -139,16 +206,20 @@ const h = {
   }
 };
 export {
+  S as Clearable,
+  N as ClearableUncontrolled,
+  P as ClearableWithCounter,
+  V as ClearableWithStartAdornment,
   m as Default,
   w as Disabled,
-  v as Email,
-  x as FullWidth,
+  b as Email,
+  y as FullWidth,
   g as GreyVariant,
-  y as Password,
-  D as Playground,
-  b as WithCounter,
-  f as WithStartAdornment,
-  S as WithTransform,
+  f as Password,
+  T as Playground,
+  x as WithCounter,
+  v as WithStartAdornment,
+  C as WithTransform,
   h as default
 };
 //# sourceMappingURL=Input.stories.js.map

package/Input/Input.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.stories.js","sources":["../../src/Input/Input.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from '@storybook/react';\nimport React, { useState } from 'react';\nimport { Mail, Search } from 'lucide-react';\n\nimport { Input } from './Input';\n\nconst meta = {\n  title: 'Input/Input',\n  component: Input,\n  tags: ['autodocs'],\n  parameters: {\n    layout: 'centered',\n  },\n  args: {\n    placeholder: 'Enter text...',\n    variant: 'default',\n    fullSize: false,\n    counter: false,\n    disabled: false,\n  },\n  argTypes: {\n    variant: {\n      control: 'select',\n      options: ['default', 'grey'],\n    },\n    type: {\n      control: 'select',\n      options: ['text', 'password', 'email', 'search', 'number'],\n    },\n    fullSize: {\n      control: 'boolean',\n    },\n    counter: {\n      control: 'boolean',\n    },\n    disabled: {\n      control: 'boolean',\n    },\n    maxLength: {\n      control: 'number',\n    },\n    onChange: { action: 'changed' },\n    onBlur: { action: 'blurred' },\n    onFocus: { action: 'focused' },\n  },\n} satisfies Meta<typeof Input>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const Default: Story = {\n  args: {\n    type: 'text',\n    placeholder: 'Default input',\n  },\n};\n\nexport const GreyVariant: Story = {\n  args: {\n    variant: 'grey',\n    type: 'text',\n    placeholder: 'Grey input',\n  },\n};\n\nexport const WithStartAdornment: Story = {\n  args: {\n    placeholder: 'Search...',\n    slotProps: {\n      input: {\n        startAdornment: <Search size={16} />,\n      },\n    },\n  },\n};\n\nexport const Email: Story = {\n  args: {\n    type: 'email',\n    placeholder: 'Email address',\n    slotProps: {\n      input: {\n        startAdornment: <Mail size={16} />,\n      },\n    },\n  },\n};\n\nexport const Password: Story = {\n  args: {\n    type: 'password',\n    placeholder: 'Password',\n  },\n};\n\nexport const WithCounter: Story = {\n  render: (args) => {\n    const [value, setValue] = useState('');\n\n    return (\n      <div className=\"w-[320px]\">\n        <Input\n          {...args}\n          value={value}\n          onChange={(e) => setValue(e.target.value)}\n        />\n      </div>\n    );\n  },\n  args: {\n    placeholder: 'Type something...',\n    counter: true,\n    maxLength: 50,\n  },\n};\n\nexport const FullWidth: Story = {\n  render: (args) => (\n    <div className=\"w-[480px]\">\n      <Input {...args} />\n    </div>\n  ),\n  args: {\n    placeholder: 'Full width input',\n    fullSize: true,\n  },\n};\n\nexport const Disabled: Story = {\n  args: {\n    placeholder: 'Disabled input',\n    disabled: true,\n    value: 'Disabled value',\n  },\n};\n\nexport const WithTransform: Story = {\n  render: (args) => {\n    const [value, setValue] = useState('');\n\n    return (\n      <div className=\"w-[320px]\">\n        <Input\n          {...args}\n          value={value}\n          onTransform={(next) => next.replace(/\\D/g, '')}\n          onChange={(e) => setValue(e.target.value)}\n        />\n      </div>\n    );\n  },\n  args: {\n    placeholder: 'Only numbers allowed',\n  },\n};\n\nexport const Playground: Story = {\n  render: (args) => {\n    const [value, setValue] = useState('');\n\n    return (\n      <div className=\"w-[360px]\">\n        <Input\n          {...args}\n          value={value}\n          onChange={(e) => setValue(e.target.value)}\n        />\n      </div>\n    );\n  },\n  args: {\n    placeholder: 'Play with controls',\n    maxLength: 100,\n  },\n};\n"],"names":["meta","Input","Default","GreyVariant","WithStartAdornment","jsx","Search","Email","Mail","Password","WithCounter","args","value","setValue","useState","e","FullWidth","Disabled","WithTransform","next","Playground"],"mappings":";;;;AAMA,MAAMA,IAAO;AAAA,EACX,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,MAAM,CAAC,UAAU;AAAA,EACjB,YAAY;AAAA,IACV,QAAQ;AAAA,EAAA;AAAA,EAEV,MAAM;AAAA,IACJ,aAAa;AAAA,IACb,SAAS;AAAA,IACT,UAAU;AAAA,IACV,SAAS;AAAA,IACT,UAAU;AAAA,EAAA;AAAA,EAEZ,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,SAAS,CAAC,WAAW,MAAM;AAAA,IAAA;AAAA,IAE7B,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,SAAS,CAAC,QAAQ,YAAY,SAAS,UAAU,QAAQ;AAAA,IAAA;AAAA,IAE3D,UAAU;AAAA,MACR,SAAS;AAAA,IAAA;AAAA,IAEX,SAAS;AAAA,MACP,SAAS;AAAA,IAAA;AAAA,IAEX,UAAU;AAAA,MACR,SAAS;AAAA,IAAA;AAAA,IAEX,WAAW;AAAA,MACT,SAAS;AAAA,IAAA;AAAA,IAEX,UAAU,EAAE,QAAQ,UAAA;AAAA,IACpB,QAAQ,EAAE,QAAQ,UAAA;AAAA,IAClB,SAAS,EAAE,QAAQ,UAAA;AAAA,EAAU;AAEjC,GAKaC,IAAiB;AAAA,EAC5B,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,aAAa;AAAA,EAAA;AAEjB,GAEaC,IAAqB;AAAA,EAChC,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,MAAM;AAAA,IACN,aAAa;AAAA,EAAA;AAEjB,GAEaC,IAA4B;AAAA,EACvC,MAAM;AAAA,IACJ,aAAa;AAAA,IACb,WAAW;AAAA,MACT,OAAO;AAAA,QACL,gBAAgB,gBAAAC,EAACC,GAAA,EAAO,MAAM,GAAA,CAAI;AAAA,MAAA;AAAA,IACpC;AAAA,EACF;AAEJ,GAEaC,IAAe;AAAA,EAC1B,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,aAAa;AAAA,IACb,WAAW;AAAA,MACT,OAAO;AAAA,QACL,gBAAgB,gBAAAF,EAACG,GAAA,EAAK,MAAM,GAAA,CAAI;AAAA,MAAA;AAAA,IAClC;AAAA,EACF;AAEJ,GAEaC,IAAkB;AAAA,EAC7B,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,aAAa;AAAA,EAAA;AAEjB,GAEaC,IAAqB;AAAA,EAChC,QAAQ,CAACC,MAAS;AAChB,UAAM,CAACC,GAAOC,CAAQ,IAAIC,EAAS,EAAE;AAErC,WACE,gBAAAT,EAAC,OAAA,EAAI,WAAU,aACb,UAAA,gBAAAA;AAAA,MAACJ;AAAA,MAAA;AAAA,QACE,GAAGU;AAAA,QACJ,OAAAC;AAAA,QACA,UAAU,CAACG,MAAMF,EAASE,EAAE,OAAO,KAAK;AAAA,MAAA;AAAA,IAAA,GAE5C;AAAA,EAEJ;AAAA,EACA,MAAM;AAAA,IACJ,aAAa;AAAA,IACb,SAAS;AAAA,IACT,WAAW;AAAA,EAAA;AAEf,GAEaC,IAAmB;AAAA,EAC9B,QAAQ,CAACL,MACP,gBAAAN,EAAC,OAAA,EAAI,WAAU,aACb,UAAA,gBAAAA,EAACJ,GAAA,EAAO,GAAGU,EAAA,CAAM,EAAA,CACnB;AAAA,EAEF,MAAM;AAAA,IACJ,aAAa;AAAA,IACb,UAAU;AAAA,EAAA;AAEd,GAEaM,IAAkB;AAAA,EAC7B,MAAM;AAAA,IACJ,aAAa;AAAA,IACb,UAAU;AAAA,IACV,OAAO;AAAA,EAAA;AAEX,GAEaC,IAAuB;AAAA,EAClC,QAAQ,CAACP,MAAS;AAChB,UAAM,CAACC,GAAOC,CAAQ,IAAIC,EAAS,EAAE;AAErC,WACE,gBAAAT,EAAC,OAAA,EAAI,WAAU,aACb,UAAA,gBAAAA;AAAA,MAACJ;AAAA,MAAA;AAAA,QACE,GAAGU;AAAA,QACJ,OAAAC;AAAA,QACA,aAAa,CAACO,MAASA,EAAK,QAAQ,OAAO,EAAE;AAAA,QAC7C,UAAU,CAACJ,MAAMF,EAASE,EAAE,OAAO,KAAK;AAAA,MAAA;AAAA,IAAA,GAE5C;AAAA,EAEJ;AAAA,EACA,MAAM;AAAA,IACJ,aAAa;AAAA,EAAA;AAEjB,GAEaK,IAAoB;AAAA,EAC/B,QAAQ,CAACT,MAAS;AAChB,UAAM,CAACC,GAAOC,CAAQ,IAAIC,EAAS,EAAE;AAErC,WACE,gBAAAT,EAAC,OAAA,EAAI,WAAU,aACb,UAAA,gBAAAA;AAAA,MAACJ;AAAA,MAAA;AAAA,QACE,GAAGU;AAAA,QACJ,OAAAC;AAAA,QACA,UAAU,CAACG,MAAMF,EAASE,EAAE,OAAO,KAAK;AAAA,MAAA;AAAA,IAAA,GAE5C;AAAA,EAEJ;AAAA,EACA,MAAM;AAAA,IACJ,aAAa;AAAA,IACb,WAAW;AAAA,EAAA;AAEf;"}
+{"version":3,"file":"Input.stories.js","sources":["../../src/Input/Input.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from '@storybook/react';\r\nimport React, { useState } from 'react';\r\nimport { Mail, Search } from 'lucide-react';\r\n\r\nimport { Input } from './Input';\r\n\r\nconst meta = {\r\n  title: 'Input/Input',\r\n  component: Input,\r\n  tags: ['autodocs'],\r\n  parameters: {\r\n    layout: 'centered',\r\n  },\r\n  args: {\r\n    placeholder: 'Enter text...',\r\n    variant: 'default',\r\n    fullSize: false,\r\n    counter: false,\r\n    disabled: false,\r\n    clearable: false,\r\n  },\r\n  argTypes: {\r\n    clearable: {\r\n      control: 'boolean',\r\n    },\r\n    variant: {\r\n      control: 'select',\r\n      options: ['default', 'grey'],\r\n    },\r\n    type: {\r\n      control: 'select',\r\n      options: ['text', 'password', 'email', 'search', 'number'],\r\n    },\r\n    fullSize: {\r\n      control: 'boolean',\r\n    },\r\n    counter: {\r\n      control: 'boolean',\r\n    },\r\n    disabled: {\r\n      control: 'boolean',\r\n    },\r\n    maxLength: {\r\n      control: 'number',\r\n    },\r\n    onChange: { action: 'changed' },\r\n    onBlur: { action: 'blurred' },\r\n    onFocus: { action: 'focused' },\r\n  },\r\n} satisfies Meta<typeof Input>;\r\n\r\nexport default meta;\r\ntype Story = StoryObj<typeof meta>;\r\n\r\nexport const Default: Story = {\r\n  args: {\r\n    type: 'text',\r\n    placeholder: 'Default input',\r\n  },\r\n};\r\n\r\nexport const GreyVariant: Story = {\r\n  args: {\r\n    variant: 'grey',\r\n    type: 'text',\r\n    placeholder: 'Grey input',\r\n  },\r\n};\r\n\r\nexport const WithStartAdornment: Story = {\r\n  args: {\r\n    placeholder: 'Search...',\r\n    slotProps: {\r\n      input: {\r\n        startAdornment: <Search size={16} />,\r\n      },\r\n    },\r\n  },\r\n};\r\n\r\nexport const Email: Story = {\r\n  args: {\r\n    type: 'email',\r\n    placeholder: 'Email address',\r\n    slotProps: {\r\n      input: {\r\n        startAdornment: <Mail size={16} />,\r\n      },\r\n    },\r\n  },\r\n};\r\n\r\nexport const Password: Story = {\r\n  args: {\r\n    type: 'password',\r\n    placeholder: 'Password',\r\n  },\r\n};\r\n\r\nexport const WithCounter: Story = {\r\n  render: (args) => {\r\n    const [value, setValue] = useState('');\r\n\r\n    return (\r\n      <div className=\"w-[320px]\">\r\n        <Input\r\n          {...args}\r\n          value={value}\r\n          onChange={(e) => setValue(e.target.value)}\r\n        />\r\n      </div>\r\n    );\r\n  },\r\n  args: {\r\n    placeholder: 'Type something...',\r\n    counter: true,\r\n    maxLength: 50,\r\n  },\r\n};\r\n\r\nexport const FullWidth: Story = {\r\n  render: (args) => (\r\n    <div className=\"w-[480px]\">\r\n      <Input {...args} />\r\n    </div>\r\n  ),\r\n  args: {\r\n    placeholder: 'Full width input',\r\n    fullSize: true,\r\n  },\r\n};\r\n\r\nexport const Disabled: Story = {\r\n  args: {\r\n    placeholder: 'Disabled input',\r\n    disabled: true,\r\n    value: 'Disabled value',\r\n  },\r\n};\r\n\r\nexport const WithTransform: Story = {\r\n  render: (args) => {\r\n    const [value, setValue] = useState('');\r\n\r\n    return (\r\n      <div className=\"w-[320px]\">\r\n        <Input\r\n          {...args}\r\n          value={value}\r\n          onTransform={(next) => next.replace(/\\D/g, '')}\r\n          onChange={(e) => setValue(e.target.value)}\r\n        />\r\n      </div>\r\n    );\r\n  },\r\n  args: {\r\n    placeholder: 'Only numbers allowed',\r\n  },\r\n};\r\n\r\nexport const Clearable: Story = {\r\n  render: (args) => {\r\n    const [value, setValue] = useState('Clear me');\r\n\r\n    return (\r\n      <div className=\"w-[320px]\">\r\n        <Input\r\n          {...args}\r\n          value={value}\r\n          onChange={(e) => setValue(e.target.value)}\r\n          onClear={() => console.log('cleared')}\r\n        />\r\n      </div>\r\n    );\r\n  },\r\n  args: {\r\n    placeholder: 'Type something...',\r\n    clearable: true,\r\n  },\r\n};\r\n\r\nexport const ClearableUncontrolled: Story = {\r\n  render: (args) => (\r\n    <div className=\"w-[320px]\">\r\n      <Input {...args} defaultValue=\"Uncontrolled value\" />\r\n    </div>\r\n  ),\r\n  args: {\r\n    placeholder: 'Type something...',\r\n    clearable: true,\r\n  },\r\n};\r\n\r\nexport const ClearableWithStartAdornment: Story = {\r\n  render: (args) => {\r\n    const [value, setValue] = useState('john@example.com');\r\n\r\n    return (\r\n      <div className=\"w-[320px]\">\r\n        <Input\r\n          {...args}\r\n          value={value}\r\n          onChange={(e) => setValue(e.target.value)}\r\n        />\r\n      </div>\r\n    );\r\n  },\r\n  args: {\r\n    type: 'email',\r\n    placeholder: 'Email address',\r\n    clearable: true,\r\n    slotProps: {\r\n      input: {\r\n        startAdornment: <Mail size={16} />,\r\n      },\r\n    },\r\n  },\r\n};\r\n\r\nexport const ClearableWithCounter: Story = {\r\n  render: (args) => {\r\n    const [value, setValue] = useState('Some text');\r\n\r\n    return (\r\n      <div className=\"w-[320px]\">\r\n        <Input\r\n          {...args}\r\n          value={value}\r\n          onChange={(e) => setValue(e.target.value)}\r\n        />\r\n      </div>\r\n    );\r\n  },\r\n  args: {\r\n    placeholder: 'Type something...',\r\n    clearable: true,\r\n    counter: true,\r\n    maxLength: 50,\r\n  },\r\n};\r\n\r\nexport const Playground: Story = {\r\n  render: (args) => {\r\n    const [value, setValue] = useState('');\r\n\r\n    return (\r\n      <div className=\"w-[360px]\">\r\n        <Input\r\n          {...args}\r\n          value={value}\r\n          onChange={(e) => setValue(e.target.value)}\r\n        />\r\n      </div>\r\n    );\r\n  },\r\n  args: {\r\n    placeholder: 'Play with controls',\r\n    maxLength: 100,\r\n  },\r\n};\r\n"],"names":["meta","Input","Default","GreyVariant","WithStartAdornment","jsx","Search","Email","Mail","Password","WithCounter","args","value","setValue","useState","e","FullWidth","Disabled","WithTransform","next","Clearable","ClearableUncontrolled","ClearableWithStartAdornment","ClearableWithCounter","Playground"],"mappings":"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"}

package/Input/Input.types.d.ts

@@ -17,5 +17,9 @@ export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement>,
     onPastePrepare?: (value: string, event: React.ClipboardEvent<HTMLInputElement>) => string;
     fullSize?: boolean;
     counter?: boolean;
+    /** Show a clear (X) button inside the input that empties the value and emulates a native input/change event */
+    clearable?: boolean;
+    /** Optional callback fired after the input has been cleared */
+    onClear?: () => void;
 }
 //# sourceMappingURL=Input.types.d.ts.map

package/Input/Input.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Input.types.d.ts","sourceRoot":"","sources":["../../src/Input/Input.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,WAAW,EACX,wBAAwB,EACxB,cAAc,EACd,SAAS,EACV,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEpC,MAAM,WAAW,mBACf,SAAQ,wBAAwB,CAAC,OAAO,SAAS,CAAC;IAClD,cAAc,CAAC,EAAE,SAAS,CAAC;CAC5B;AAED,MAAM,WAAW,cAAc;IAC7B,KAAK,CAAC,EAAE,mBAAmB,CAAC;IAC5B,OAAO,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CAC1C;AAED,MAAM,WAAW,UACf,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,YAAY,CAAC,OAAO,aAAa,CAAC;IACvF,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B,kEAAkE;IAClE,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,MAAM,CAAC;IAC9E,sDAAsD;IACtD,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,KAAK,MAAM,CAAC;IAC1F,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB"}
+{"version":3,"file":"Input.types.d.ts","sourceRoot":"","sources":["../../src/Input/Input.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,WAAW,EACX,wBAAwB,EACxB,cAAc,EACd,SAAS,EACV,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEpC,MAAM,WAAW,mBACf,SAAQ,wBAAwB,CAAC,OAAO,SAAS,CAAC;IAClD,cAAc,CAAC,EAAE,SAAS,CAAC;CAC5B;AAED,MAAM,WAAW,cAAc;IAC7B,KAAK,CAAC,EAAE,mBAAmB,CAAC;IAC5B,OAAO,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CAC1C;AAED,MAAM,WAAW,UACf,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,YAAY,CAAC,OAAO,aAAa,CAAC;IACvF,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B,kEAAkE;IAClE,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,MAAM,CAAC;IAC9E,sDAAsD;IACtD,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,KAAK,MAAM,CAAC;IAC1F,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,+GAA+G;IAC/G,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,+DAA+D;IAC/D,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB"}

package/Input/inputVariants.js.map

@@ -1 +1 @@
-{"version":3,"file":"inputVariants.js","sources":["../../src/Input/inputVariants.tsx"],"sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport const inputVariants = cva(\n  [\n    'flex h-10 w-full rounded-lg border border-input px-3 py-2',\n    'text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground',\n    'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',\n    'group-data-[state=invalid]/form-control:border-destructive',\n    'group-data-[state=valid]/form-control:border-input',\n    'box-border',\n  ],\n  {\n    variants: {\n      variant: {\n        default: 'bg-background',\n        grey: 'bg-slate-200',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n    },\n  }\n);\n"],"names":["inputVariants","cva"],"mappings":";AAEO,MAAMA,IAAgBC;AAAA,EAC3B;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAAA,EAEF;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SAAS;AAAA,QACT,MAAM;AAAA,MAAA;AAAA,IACR;AAAA,IAEF,iBAAiB;AAAA,MACf,SAAS;AAAA,IAAA;AAAA,EACX;AAEJ;"}
+{"version":3,"file":"inputVariants.js","sources":["../../src/Input/inputVariants.tsx"],"sourcesContent":["import { cva } from 'class-variance-authority';\r\n\r\nexport const inputVariants = cva(\r\n  [\r\n    'flex h-10 w-full rounded-lg border border-input px-3 py-2',\r\n    'text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground',\r\n    'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',\r\n    'group-data-[state=invalid]/form-control:border-destructive',\r\n    'group-data-[state=valid]/form-control:border-input',\r\n    'box-border',\r\n  ],\r\n  {\r\n    variants: {\r\n      variant: {\r\n        default: 'bg-background',\r\n        grey: 'bg-slate-200',\r\n      },\r\n    },\r\n    defaultVariants: {\r\n      variant: 'default',\r\n    },\r\n  }\r\n);\r\n"],"names":["inputVariants","cva"],"mappings":";AAEO,MAAMA,IAAgBC;AAAA,EAC3B;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAAA,EAEF;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SAAS;AAAA,QACT,MAAM;AAAA,MAAA;AAAA,IACR;AAAA,IAEF,iBAAiB;AAAA,MACf,SAAS;AAAA,IAAA;AAAA,EACX;AAEJ;"}

package/InputOTP/InputOTP.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InputOTP.d.ts","sourceRoot":"","sources":["../../src/InputOTP/InputOTP.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,QAAA,MAAM,QAAQ;;;;;kBAUqC,GAAG;;;;;;;;;;;;;kBAAH,GAAG;;;;;;;;2FAGpD,CAAA;AAGF,QAAA,MAAM,aAAa,mKAKjB,CAAA;AAGF,QAAA,MAAM,YAAY;WAEiC,MAAM;wCAuBvD,CAAA;AAGF,QAAA,MAAM,iBAAiB,mKAOrB,CAAA;AAGF,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,YAAY,EAAE,iBAAiB,EAAE,CAAA"}
+{"version":3,"file":"InputOTP.d.ts","sourceRoot":"","sources":["../../src/InputOTP/InputOTP.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,QAAA,MAAM,QAAQ;;;;;kBAUmB,GAAG;;;;;;;;;;;;;kBAAH,GAAG;;;;;;;;2FAGlC,CAAA;AAGF,QAAA,MAAM,aAAa,mKAKjB,CAAA;AAGF,QAAA,MAAM,YAAY;WAEiC,MAAM;wCAuBvD,CAAA;AAGF,QAAA,MAAM,iBAAiB,mKAOrB,CAAA;AAGF,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,YAAY,EAAE,iBAAiB,EAAE,CAAA"}

package/InputOTP/InputOTP.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputOTP.js","sources":["../../src/InputOTP/InputOTP.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { OTPInput, OTPInputContext } from \"input-otp\"\nimport { Minus } from \"lucide-react\"\n\nimport { cn } from \"@oneplatformdev/utils\";\n\nconst InputOTP = React.forwardRef<\n  React.ElementRef<typeof OTPInput>,\n  React.ComponentPropsWithoutRef<typeof OTPInput>\n>(({ className, containerClassName, ...props }, ref) => (\n  <OTPInput\n    ref={ref}\n    containerClassName={cn(\n      \"flex items-center gap-2 has-disabled:opacity-50\",\n      containerClassName\n    )}\n    className={cn(\"disabled:cursor-not-allowed\", className)}\n    {...props}\n  />\n))\nInputOTP.displayName = \"InputOTP\"\n\nconst InputOTPGroup = React.forwardRef<\n  React.ElementRef<\"div\">,\n  React.ComponentPropsWithoutRef<\"div\">\n>(({ className, ...props }, ref) => (\n  <div ref={ref} className={cn(\"flex items-center\", className)} {...props} />\n))\nInputOTPGroup.displayName = \"InputOTPGroup\"\n\nconst InputOTPSlot = React.forwardRef<\n  React.ElementRef<\"div\">,\n  React.ComponentPropsWithoutRef<\"div\"> & { index: number }\n>(({ index, className, ...props }, ref) => {\n  const inputOTPContext = React.useContext(OTPInputContext)\n  const { char, hasFakeCaret, isActive } = inputOTPContext.slots[index]\n\n  return (\n    <div\n      ref={ref}\n      className={cn(\n        \"relative flex h-9 w-9 items-center justify-center border-y border-r border-input text-sm shadow-xs transition-all first:rounded-l-md first:border-l last:rounded-r-md\",\n        isActive && \"z-10 ring-1 ring-ring\",\n        className\n      )}\n      {...props}\n    >\n      {char}\n      {hasFakeCaret && (\n        <div className=\"pointer-events-none absolute inset-0 flex items-center justify-center\">\n          <div className=\"h-4 w-px animate-caret-blink bg-foreground duration-1000\" />\n        </div>\n      )}\n    </div>\n  )\n})\nInputOTPSlot.displayName = \"InputOTPSlot\"\n\nconst InputOTPSeparator = React.forwardRef<\n  React.ElementRef<\"div\">,\n  React.ComponentPropsWithoutRef<\"div\">\n>(({ ...props }, ref) => (\n  <div ref={ref} role=\"separator\" {...props}>\n    <Minus />\n  </div>\n))\nInputOTPSeparator.displayName = \"InputOTPSeparator\"\n\nexport { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator }\n"],"names":["InputOTP","React","className","containerClassName","props","ref","jsx","OTPInput","cn","InputOTPGroup","InputOTPSlot","index","inputOTPContext","OTPInputContext","char","hasFakeCaret","isActive","jsxs","InputOTPSeparator","Minus"],"mappings":";;;;;AAQA,MAAMA,IAAWC,EAAM,WAGrB,CAAC,EAAE,WAAAC,GAAW,oBAAAC,GAAoB,GAAGC,KAASC,MAC9C,gBAAAC;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,KAAAF;AAAA,IACA,oBAAoBG;AAAA,MAClB;AAAA,MACAL;AAAA,IAAA;AAAA,IAEF,WAAWK,EAAG,+BAA+BN,CAAS;AAAA,IACrD,GAAGE;AAAA,EAAA;AACN,CACD;AACDJ,EAAS,cAAc;AAEvB,MAAMS,IAAgBR,EAAM,WAG1B,CAAC,EAAE,WAAAC,GAAW,GAAGE,KAASC,wBACzB,OAAA,EAAI,KAAAA,GAAU,WAAWG,EAAG,qBAAqBN,CAAS,GAAI,GAAGE,GAAO,CAC1E;AACDK,EAAc,cAAc;AAE5B,MAAMC,IAAeT,EAAM,WAGzB,CAAC,EAAE,OAAAU,GAAO,WAAAT,GAAW,GAAGE,EAAA,GAASC,MAAQ;AACzC,QAAMO,IAAkBX,EAAM,WAAWY,CAAe,GAClD,EAAE,MAAAC,GAAM,cAAAC,GAAc,UAAAC,MAAaJ,EAAgB,MAAMD,CAAK;AAEpE,SACE,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAZ;AAAA,MACA,WAAWG;AAAA,QACT;AAAA,QACAQ,KAAY;AAAA,QACZd;AAAA,MAAA;AAAA,MAED,GAAGE;AAAA,MAEH,UAAA;AAAA,QAAAU;AAAA,QACAC,uBACE,OAAA,EAAI,WAAU,yEACb,UAAA,gBAAAT,EAAC,OAAA,EAAI,WAAU,2DAAA,CAA2D,EAAA,CAC5E;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR,CAAC;AACDI,EAAa,cAAc;AAE3B,MAAMQ,IAAoBjB,EAAM,WAG9B,CAAC,EAAE,GAAGG,KAASC,wBACd,OAAA,EAAI,KAAAA,GAAU,MAAK,aAAa,GAAGD,GAClC,UAAA,gBAAAE,EAACa,GAAA,CAAA,CAAM,GACT,CACD;AACDD,EAAkB,cAAc;"}
+{"version":3,"file":"InputOTP.js","sources":["../../src/InputOTP/InputOTP.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport * as React from \"react\"\r\nimport { OTPInput, OTPInputContext } from \"input-otp\"\r\nimport { Minus } from \"lucide-react\"\r\n\r\nimport { cn } from \"@oneplatformdev/utils\";\r\n\r\nconst InputOTP = React.forwardRef<\r\n  React.ElementRef<typeof OTPInput>,\r\n  React.ComponentPropsWithoutRef<typeof OTPInput>\r\n>(({ className, containerClassName, ...props }, ref) => (\r\n  <OTPInput\r\n    ref={ref}\r\n    containerClassName={cn(\r\n      \"flex items-center gap-2 has-disabled:opacity-50\",\r\n      containerClassName\r\n    )}\r\n    className={cn(\"disabled:cursor-not-allowed\", className)}\r\n    {...props}\r\n  />\r\n))\r\nInputOTP.displayName = \"InputOTP\"\r\n\r\nconst InputOTPGroup = React.forwardRef<\r\n  React.ElementRef<\"div\">,\r\n  React.ComponentPropsWithoutRef<\"div\">\r\n>(({ className, ...props }, ref) => (\r\n  <div ref={ref} className={cn(\"flex items-center\", className)} {...props} />\r\n))\r\nInputOTPGroup.displayName = \"InputOTPGroup\"\r\n\r\nconst InputOTPSlot = React.forwardRef<\r\n  React.ElementRef<\"div\">,\r\n  React.ComponentPropsWithoutRef<\"div\"> & { index: number }\r\n>(({ index, className, ...props }, ref) => {\r\n  const inputOTPContext = React.useContext(OTPInputContext)\r\n  const { char, hasFakeCaret, isActive } = inputOTPContext.slots[index]\r\n\r\n  return (\r\n    <div\r\n      ref={ref}\r\n      className={cn(\r\n        \"relative flex h-9 w-9 items-center justify-center border-y border-r border-input text-sm shadow-xs transition-all first:rounded-l-md first:border-l last:rounded-r-md\",\r\n        isActive && \"z-10 ring-1 ring-ring\",\r\n        className\r\n      )}\r\n      {...props}\r\n    >\r\n      {char}\r\n      {hasFakeCaret && (\r\n        <div className=\"pointer-events-none absolute inset-0 flex items-center justify-center\">\r\n          <div className=\"h-4 w-px animate-caret-blink bg-foreground duration-1000\" />\r\n        </div>\r\n      )}\r\n    </div>\r\n  )\r\n})\r\nInputOTPSlot.displayName = \"InputOTPSlot\"\r\n\r\nconst InputOTPSeparator = React.forwardRef<\r\n  React.ElementRef<\"div\">,\r\n  React.ComponentPropsWithoutRef<\"div\">\r\n>(({ ...props }, ref) => (\r\n  <div ref={ref} role=\"separator\" {...props}>\r\n    <Minus />\r\n  </div>\r\n))\r\nInputOTPSeparator.displayName = \"InputOTPSeparator\"\r\n\r\nexport { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator }\r\n"],"names":["InputOTP","React","className","containerClassName","props","ref","jsx","OTPInput","cn","InputOTPGroup","InputOTPSlot","index","inputOTPContext","OTPInputContext","char","hasFakeCaret","isActive","jsxs","InputOTPSeparator","Minus"],"mappings":";;;;;AAQA,MAAMA,IAAWC,EAAM,WAGrB,CAAC,EAAE,WAAAC,GAAW,oBAAAC,GAAoB,GAAGC,KAASC,MAC9C,gBAAAC;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,KAAAF;AAAA,IACA,oBAAoBG;AAAA,MAClB;AAAA,MACAL;AAAA,IAAA;AAAA,IAEF,WAAWK,EAAG,+BAA+BN,CAAS;AAAA,IACrD,GAAGE;AAAA,EAAA;AACN,CACD;AACDJ,EAAS,cAAc;AAEvB,MAAMS,IAAgBR,EAAM,WAG1B,CAAC,EAAE,WAAAC,GAAW,GAAGE,KAASC,wBACzB,OAAA,EAAI,KAAAA,GAAU,WAAWG,EAAG,qBAAqBN,CAAS,GAAI,GAAGE,GAAO,CAC1E;AACDK,EAAc,cAAc;AAE5B,MAAMC,IAAeT,EAAM,WAGzB,CAAC,EAAE,OAAAU,GAAO,WAAAT,GAAW,GAAGE,EAAA,GAASC,MAAQ;AACzC,QAAMO,IAAkBX,EAAM,WAAWY,CAAe,GAClD,EAAE,MAAAC,GAAM,cAAAC,GAAc,UAAAC,MAAaJ,EAAgB,MAAMD,CAAK;AAEpE,SACE,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAZ;AAAA,MACA,WAAWG;AAAA,QACT;AAAA,QACAQ,KAAY;AAAA,QACZd;AAAA,MAAA;AAAA,MAED,GAAGE;AAAA,MAEH,UAAA;AAAA,QAAAU;AAAA,QACAC,uBACE,OAAA,EAAI,WAAU,yEACb,UAAA,gBAAAT,EAAC,OAAA,EAAI,WAAU,2DAAA,CAA2D,EAAA,CAC5E;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR,CAAC;AACDI,EAAa,cAAc;AAE3B,MAAMQ,IAAoBjB,EAAM,WAG9B,CAAC,EAAE,GAAGG,KAASC,wBACd,OAAA,EAAI,KAAAA,GAAU,MAAK,aAAa,GAAGD,GAClC,UAAA,gBAAAE,EAACa,GAAA,CAAA,CAAM,GACT,CACD;AACDD,EAAkB,cAAc;"}

package/LICENSE

@@ -1,21 +1,21 @@
-The MIT License (MIT)
-
-Copyright (c) 2025 Oleh Maksimenko
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+The MIT License (MIT)
+
+Copyright (c) 2025 Oleh Maksimenko
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/Label/Label.js.map

@@ -1 +1 @@
-{"version":3,"file":"Label.js","sources":["../../src/Label/Label.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport * as LabelPrimitive from \"@radix-ui/react-label\"\n\nimport { cn } from \"@oneplatformdev/utils\"\n\nfunction Label(props: React.ComponentProps<typeof LabelPrimitive.Root>) {\n  const { className, ...rest } = props;\n  return (\n    <LabelPrimitive.Root\n      data-slot=\"label\"\n      className={cn(\n        \"flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50\",\n        className\n      )}\n      {...rest}\n    />\n  )\n}\nexport { Label, LabelPrimitive }\n\nexport default Label;\n"],"names":["Label","props","className","rest","jsx","LabelPrimitive","cn"],"mappings":";;;AAOA,SAASA,EAAMC,GAAyD;AACtE,QAAM,EAAE,WAAAC,GAAW,GAAGC,EAAA,IAASF;AAC/B,SACE,gBAAAG;AAAA,IAACC,EAAe;AAAA,IAAf;AAAA,MACC,aAAU;AAAA,MACV,WAAWC;AAAA,QACT;AAAA,QACAJ;AAAA,MAAA;AAAA,MAED,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV;"}
+{"version":3,"file":"Label.js","sources":["../../src/Label/Label.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport * as React from \"react\"\r\nimport * as LabelPrimitive from \"@radix-ui/react-label\"\r\n\r\nimport { cn } from \"@oneplatformdev/utils\"\r\n\r\nfunction Label(props: React.ComponentProps<typeof LabelPrimitive.Root>) {\r\n  const { className, ...rest } = props;\r\n  return (\r\n    <LabelPrimitive.Root\r\n      data-slot=\"label\"\r\n      className={cn(\r\n        \"flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50\",\r\n        className\r\n      )}\r\n      {...rest}\r\n    />\r\n  )\r\n}\r\nexport { Label, LabelPrimitive }\r\n\r\nexport default Label;\r\n"],"names":["Label","props","className","rest","jsx","LabelPrimitive","cn"],"mappings":";;;AAOA,SAASA,EAAMC,GAAyD;AACtE,QAAM,EAAE,WAAAC,GAAW,GAAGC,EAAA,IAASF;AAC/B,SACE,gBAAAG;AAAA,IAACC,EAAe;AAAA,IAAf;AAAA,MACC,aAAU;AAAA,MACV,WAAWC;AAAA,QACT;AAAA,QACAJ;AAAA,MAAA;AAAA,MAED,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV;"}

package/Label/labelVariants.js.map

@@ -1 +1 @@
-{"version":3,"file":"labelVariants.js","sources":["../../src/Label/labelVariants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport const labelVariants = cva([\n  'peer-disabled:cursor-not-allowed peer-disabled:opacity-70',\n  'text-md font-medium leading-[150%]',\n  'group-data-[state=valid]/form-control:text-[#363B4E]',\n  'group-data-[state=invalid]/form-control:text-destructive',\n  \"flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50\",\n]);\n"],"names":["labelVariants","cva"],"mappings":";AAEO,MAAMA,IAAgBC,EAAI;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC;"}
+{"version":3,"file":"labelVariants.js","sources":["../../src/Label/labelVariants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\r\n\r\nexport const labelVariants = cva([\r\n  'peer-disabled:cursor-not-allowed peer-disabled:opacity-70',\r\n  'text-md font-medium leading-[150%]',\r\n  'group-data-[state=valid]/form-control:text-[#363B4E]',\r\n  'group-data-[state=invalid]/form-control:text-destructive',\r\n  \"flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50\",\r\n]);\r\n"],"names":["labelVariants","cva"],"mappings":";AAEO,MAAMA,IAAgBC,EAAI;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC;"}

package/LazyLoader/LazyLoader.js

@@ -1,9 +1,8 @@
 import { jsx as o } from "react/jsx-runtime";
-import { Suspense as a } from "react";
-import { LoadingMask as e } from "../LoadingMask/LoadingMask.js";
-import "../LoadingMask/RenderLoadingMask.js";
-const s = (r, m = !0) => (t) => /* @__PURE__ */ o(a, { fallback: m ? /* @__PURE__ */ o(e, {}) : null, children: /* @__PURE__ */ o(r, { ...t }) });
+import { Suspense as m } from "react";
+import { LoadingMask as t } from "../LoadingMask/LoadingMask.js";
+const p = (r, a = !0) => (e) => /* @__PURE__ */ o(m, { fallback: a ? /* @__PURE__ */ o(t, {}) : null, children: /* @__PURE__ */ o(r, { ...e }) });
 export {
-  s as LazyLoader
+  p as LazyLoader
 };
 //# sourceMappingURL=LazyLoader.js.map

package/LazyLoader/LazyLoader.js.map

@@ -1 +1 @@
-{"version":3,"file":"LazyLoader.js","sources":["../../src/LazyLoader/LazyLoader.tsx"],"sourcesContent":["import React, { JSX, Suspense } from 'react';\n\nimport { LoadingMask } from '../LoadingMask';\n\n// TODO: types any\n/**\n * Component lazy load component.\n * @public\n * @see [Documentation](#)\n * @example\n * ```tsx\n * import { lazy } from 'react';\n * import { LazyLoader } from '@oneplatformdev/ui/LazyLoader';\n *\n * const ModuleComponentViewLazy = LazyLoader(\n *  lazy(() => import('path/to/module').then(module => ({\n *      default: module.ModuleComponentView,\n *    })),\n *  ),\n * );\n * ```\n */\nexport const LazyLoader =\n  (Component: React.LazyExoticComponent<any>, showLoader = true) =>\n  (props: any): JSX.Element =>\n    (\n      <Suspense fallback={showLoader ? <LoadingMask /> : null}>\n        <Component {...props} />\n      </Suspense>\n    );\n"],"names":["LazyLoader","Component","showLoader","props","jsx","Suspense","LoadingMask"],"mappings":";;;;AAsBO,MAAMA,IACX,CAACC,GAA2CC,IAAa,OACzD,CAACC,MAEG,gBAAAC,EAACC,GAAA,EAAS,UAAUH,IAAa,gBAAAE,EAACE,KAAY,IAAK,MACjD,4BAACL,GAAA,EAAW,GAAGE,GAAO,EAAA,CACxB;"}
+{"version":3,"file":"LazyLoader.js","sources":["../../src/LazyLoader/LazyLoader.tsx"],"sourcesContent":["import React, { JSX, Suspense } from 'react';\r\n\r\nimport { LoadingMask } from '../LoadingMask';\r\n\r\n// TODO: types any\r\n/**\r\n * Component lazy load component.\r\n * @public\r\n * @see [Documentation](#)\r\n * @example\r\n * ```tsx\r\n * import { lazy } from 'react';\r\n * import { LazyLoader } from '@oneplatformdev/ui/LazyLoader';\r\n *\r\n * const ModuleComponentViewLazy = LazyLoader(\r\n *  lazy(() => import('path/to/module').then(module => ({\r\n *      default: module.ModuleComponentView,\r\n *    })),\r\n *  ),\r\n * );\r\n * ```\r\n */\r\nexport const LazyLoader =\r\n  (Component: React.LazyExoticComponent<any>, showLoader = true) =>\r\n  (props: any): JSX.Element =>\r\n    (\r\n      <Suspense fallback={showLoader ? <LoadingMask /> : null}>\r\n        <Component {...props} />\r\n      </Suspense>\r\n    );\r\n"],"names":["LazyLoader","Component","showLoader","props","jsx","Suspense","LoadingMask"],"mappings":";;;AAsBO,MAAMA,IACX,CAACC,GAA2CC,IAAa,OACzD,CAACC,MAEG,gBAAAC,EAACC,GAAA,EAAS,UAAUH,IAAa,gBAAAE,EAACE,KAAY,IAAK,MACjD,4BAACL,GAAA,EAAW,GAAGE,GAAO,EAAA,CACxB;"}

package/LoadedIcon/LoadedIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoadedIcon.js","sources":["../../src/LoadedIcon/LoadedIcon.tsx"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority';\nimport { LoaderCircleIcon } from 'lucide-react';\nimport { FC, HTMLAttributes, PropsWithChildren } from 'react';\n\nimport { cn } from '@oneplatformdev/utils';\n\nconst loadedIconVariants = cva([\n  'relative',\n], {\n  variants: {\n    size: {\n      inherit: '[&_svg]:size-inherit',\n      xs: '[&_svg]:size-3',\n      sm: '[&_svg]:size-4',\n      md: '[&_svg]:size-5',\n      lg: '[&_svg]:size-6',\n    },\n  },\n  defaultVariants: { size: 'inherit' },\n});\n\ninterface ILoadedIconProps\n  extends HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof loadedIconVariants> {\n  loading?: boolean;\n}\n\nexport const LoadedIcon: FC<PropsWithChildren<ILoadedIconProps>> = (props) => {\n  const { loading, children, size = 'md', className, ...rest } = props;\n  return (\n    <div\n      {...rest}\n      className={cn(loadedIconVariants({ size, className }))}\n    >\n      {loading\n        ? <LoaderCircleIcon className=\"animate-spin\"/>\n        : children}\n    </div>\n  );\n};\n"],"names":["loadedIconVariants","cva","LoadedIcon","props","loading","children","size","className","rest","jsx","cn","LoaderCircleIcon"],"mappings":";;;;AAMA,MAAMA,IAAqBC,EAAI;AAAA,EAC7B;AACF,GAAG;AAAA,EACD,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA;AAAA,EACN;AAAA,EAEF,iBAAiB,EAAE,MAAM,UAAA;AAC3B,CAAC,GAQYC,IAAsD,CAACC,MAAU;AAC5E,QAAM,EAAE,SAAAC,GAAS,UAAAC,GAAU,MAAAC,IAAO,MAAM,WAAAC,GAAW,GAAGC,MAASL;AAC/D,SACE,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGD;AAAA,MACJ,WAAWE,EAAGV,EAAmB,EAAE,MAAAM,GAAM,WAAAC,EAAA,CAAW,CAAC;AAAA,MAEpD,UAAAH,IACG,gBAAAK,EAACE,GAAA,EAAiB,WAAU,gBAAc,IAC1CN;AAAA,IAAA;AAAA,EAAA;AAGV;"}
+{"version":3,"file":"LoadedIcon.js","sources":["../../src/LoadedIcon/LoadedIcon.tsx"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority';\r\nimport { LoaderCircleIcon } from 'lucide-react';\r\nimport { FC, HTMLAttributes, PropsWithChildren } from 'react';\r\n\r\nimport { cn } from '@oneplatformdev/utils';\r\n\r\nconst loadedIconVariants = cva([\r\n  'relative',\r\n], {\r\n  variants: {\r\n    size: {\r\n      inherit: '[&_svg]:size-inherit',\r\n      xs: '[&_svg]:size-3',\r\n      sm: '[&_svg]:size-4',\r\n      md: '[&_svg]:size-5',\r\n      lg: '[&_svg]:size-6',\r\n    },\r\n  },\r\n  defaultVariants: { size: 'inherit' },\r\n});\r\n\r\ninterface ILoadedIconProps\r\n  extends HTMLAttributes<HTMLDivElement>,\r\n    VariantProps<typeof loadedIconVariants> {\r\n  loading?: boolean;\r\n}\r\n\r\nexport const LoadedIcon: FC<PropsWithChildren<ILoadedIconProps>> = (props) => {\r\n  const { loading, children, size = 'md', className, ...rest } = props;\r\n  return (\r\n    <div\r\n      {...rest}\r\n      className={cn(loadedIconVariants({ size, className }))}\r\n    >\r\n      {loading\r\n        ? <LoaderCircleIcon className=\"animate-spin\"/>\r\n        : children}\r\n    </div>\r\n  );\r\n};\r\n"],"names":["loadedIconVariants","cva","LoadedIcon","props","loading","children","size","className","rest","jsx","cn","LoaderCircleIcon"],"mappings":";;;;AAMA,MAAMA,IAAqBC,EAAI;AAAA,EAC7B;AACF,GAAG;AAAA,EACD,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA;AAAA,EACN;AAAA,EAEF,iBAAiB,EAAE,MAAM,UAAA;AAC3B,CAAC,GAQYC,IAAsD,CAACC,MAAU;AAC5E,QAAM,EAAE,SAAAC,GAAS,UAAAC,GAAU,MAAAC,IAAO,MAAM,WAAAC,GAAW,GAAGC,MAASL;AAC/D,SACE,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGD;AAAA,MACJ,WAAWE,EAAGV,EAAmB,EAAE,MAAAM,GAAM,WAAAC,EAAA,CAAW,CAAC;AAAA,MAEpD,UAAAH,IACG,gBAAAK,EAACE,GAAA,EAAiB,WAAU,gBAAc,IAC1CN;AAAA,IAAA;AAAA,EAAA;AAGV;"}

package/LoadingMask/LoadingMask.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoadingMask.js","sources":["../../src/LoadingMask/LoadingMask.tsx"],"sourcesContent":["import { ILoadingMaskProps } from './LoadingMask.types';\nimport { RenderLoadingMask } from './RenderLoadingMask';\nimport { cn } from '@oneplatformdev/utils';\n\nexport const LoadingMask = (props: ILoadingMaskProps) => {\n  const { loading = true, fullWidth = false, className, ...rest } = props;\n  if(!loading) return null;\n  if (!fullWidth) return <RenderLoadingMask />;\n  return (\n    <div\n      {...rest}\n      className={cn(\n        'absolute inset-0',\n        'flex items-center justify-center',\n        className\n      )}\n    >\n      <RenderLoadingMask />\n    </div>\n  );\n};\n"],"names":["LoadingMask","props","loading","fullWidth","className","rest","jsx","cn","RenderLoadingMask"],"mappings":";;;AAIO,MAAMA,IAAc,CAACC,MAA6B;AACvD,QAAM,EAAE,SAAAC,IAAU,IAAM,WAAAC,IAAY,IAAO,WAAAC,GAAW,GAAGC,MAASJ;AAClE,SAAIC,IACCC,IAEH,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGD;AAAA,MACJ,WAAWE;AAAA,QACT;AAAA,QACA;AAAA,QACAH;AAAA,MAAA;AAAA,MAGF,4BAACI,GAAA,CAAA,CAAkB;AAAA,IAAA;AAAA,EAAA,IAVA,gBAAAF,EAACE,GAAA,CAAA,CAAkB,IADtB;AActB;"}
+{"version":3,"file":"LoadingMask.js","sources":["../../src/LoadingMask/LoadingMask.tsx"],"sourcesContent":["import { ILoadingMaskProps } from './LoadingMask.types';\r\nimport { RenderLoadingMask } from './RenderLoadingMask';\r\nimport { cn } from '@oneplatformdev/utils';\r\n\r\nexport const LoadingMask = (props: ILoadingMaskProps) => {\r\n  const { loading = true, fullWidth = false, className, ...rest } = props;\r\n  if(!loading) return null;\r\n  if (!fullWidth) return <RenderLoadingMask />;\r\n  return (\r\n    <div\r\n      {...rest}\r\n      className={cn(\r\n        'absolute inset-0',\r\n        'flex items-center justify-center',\r\n        className\r\n      )}\r\n    >\r\n      <RenderLoadingMask />\r\n    </div>\r\n  );\r\n};\r\n"],"names":["LoadingMask","props","loading","fullWidth","className","rest","jsx","cn","RenderLoadingMask"],"mappings":";;;AAIO,MAAMA,IAAc,CAACC,MAA6B;AACvD,QAAM,EAAE,SAAAC,IAAU,IAAM,WAAAC,IAAY,IAAO,WAAAC,GAAW,GAAGC,MAASJ;AAClE,SAAIC,IACCC,IAEH,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGD;AAAA,MACJ,WAAWE;AAAA,QACT;AAAA,QACA;AAAA,QACAH;AAAA,MAAA;AAAA,MAGF,4BAACI,GAAA,CAAA,CAAkB;AAAA,IAAA;AAAA,EAAA,IAVA,gBAAAF,EAACE,GAAA,CAAA,CAAkB,IADtB;AActB;"}

package/LoadingMask/RenderLoadingMask.js.map

@@ -1 +1 @@
-{"version":3,"file":"RenderLoadingMask.js","sources":["../../src/LoadingMask/RenderLoadingMask.tsx"],"sourcesContent":["import { forwardRef, HTMLAttributes } from 'react';\nimport { cn } from '@oneplatformdev/utils';\n\nexport const RenderLoadingMask = forwardRef<\n  HTMLDivElement,\n  HTMLAttributes<HTMLDivElement>\n>((props, ref) => {\n  const { className, ...rest } = props;\n  return (\n    <div\n      {...rest}\n      ref={ref}\n      className={cn('flex flex-1 items-center justify-center', className)}\n    >\n      <svg\n        className=\"h-8 w-8 animate-spin text-gray-900 dark:text-gray-50\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          d=\"M12 4.75V6.25\"\n          stroke=\"currentColor\"\n          strokeWidth=\"2\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n        />\n        <path\n          d=\"M17.1475 6.8525L16.0625 7.9375\"\n          stroke=\"currentColor\"\n          strokeWidth=\"2\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n        />\n        <path\n          d=\"M19.25 12H17.75\"\n          stroke=\"currentColor\"\n          strokeWidth=\"2\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n        />\n        <path\n          d=\"M17.1475 17.1475L16.0625 16.0625\"\n          stroke=\"currentColor\"\n          strokeWidth=\"2\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n        />\n        <path\n          d=\"M12 17.75V19.25\"\n          stroke=\"currentColor\"\n          strokeWidth=\"2\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n        />\n        <path\n          d=\"M6.8525 17.1475L7.9375 16.0625\"\n          stroke=\"currentColor\"\n          strokeWidth=\"2\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n        />\n        <path\n          d=\"M4.75 12H6.25\"\n          stroke=\"currentColor\"\n          strokeWidth=\"2\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n        />\n        <path\n          d=\"M6.8525 6.8525L7.9375 7.9375\"\n          stroke=\"currentColor\"\n          strokeWidth=\"2\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n        />\n      </svg>\n    </div>\n  );\n});\n"],"names":["RenderLoadingMask","forwardRef","props","ref","className","rest","jsx","cn","jsxs"],"mappings":";;;AAGO,MAAMA,IAAoBC,EAG/B,CAACC,GAAOC,MAAQ;AAChB,QAAM,EAAE,WAAAC,GAAW,GAAGC,EAAA,IAASH;AAC/B,SACE,gBAAAI;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGD;AAAA,MACJ,KAAAF;AAAA,MACA,WAAWI,EAAG,2CAA2CH,CAAS;AAAA,MAElE,UAAA,gBAAAI;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,OAAM;AAAA,UAEN,UAAA;AAAA,YAAA,gBAAAF;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,GAAE;AAAA,gBACF,QAAO;AAAA,gBACP,aAAY;AAAA,gBACZ,eAAc;AAAA,gBACd,gBAAe;AAAA,cAAA;AAAA,YAAA;AAAA,YAEjB,gBAAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,GAAE;AAAA,gBACF,QAAO;AAAA,gBACP,aAAY;AAAA,gBACZ,eAAc;AAAA,gBACd,gBAAe;AAAA,cAAA;AAAA,YAAA;AAAA,YAEjB,gBAAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,GAAE;AAAA,gBACF,QAAO;AAAA,gBACP,aAAY;AAAA,gBACZ,eAAc;AAAA,gBACd,gBAAe;AAAA,cAAA;AAAA,YAAA;AAAA,YAEjB,gBAAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,GAAE;AAAA,gBACF,QAAO;AAAA,gBACP,aAAY;AAAA,gBACZ,eAAc;AAAA,gBACd,gBAAe;AAAA,cAAA;AAAA,YAAA;AAAA,YAEjB,gBAAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,GAAE;AAAA,gBACF,QAAO;AAAA,gBACP,aAAY;AAAA,gBACZ,eAAc;AAAA,gBACd,gBAAe;AAAA,cAAA;AAAA,YAAA;AAAA,YAEjB,gBAAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,GAAE;AAAA,gBACF,QAAO;AAAA,gBACP,aAAY;AAAA,gBACZ,eAAc;AAAA,gBACd,gBAAe;AAAA,cAAA;AAAA,YAAA;AAAA,YAEjB,gBAAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,GAAE;AAAA,gBACF,QAAO;AAAA,gBACP,aAAY;AAAA,gBACZ,eAAc;AAAA,gBACd,gBAAe;AAAA,cAAA;AAAA,YAAA;AAAA,YAEjB,gBAAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,GAAE;AAAA,gBACF,QAAO;AAAA,gBACP,aAAY;AAAA,gBACZ,eAAc;AAAA,gBACd,gBAAe;AAAA,cAAA;AAAA,YAAA;AAAA,UACjB;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAGN,CAAC;"}
+{"version":3,"file":"RenderLoadingMask.js","sources":["../../src/LoadingMask/RenderLoadingMask.tsx"],"sourcesContent":["import { forwardRef, HTMLAttributes } from 'react';\r\nimport { cn } from '@oneplatformdev/utils';\r\n\r\nexport const RenderLoadingMask = forwardRef<\r\n  HTMLDivElement,\r\n  HTMLAttributes<HTMLDivElement>\r\n>((props, ref) => {\r\n  const { className, ...rest } = props;\r\n  return (\r\n    <div\r\n      {...rest}\r\n      ref={ref}\r\n      className={cn('flex flex-1 items-center justify-center', className)}\r\n    >\r\n      <svg\r\n        className=\"h-8 w-8 animate-spin text-gray-900 dark:text-gray-50\"\r\n        viewBox=\"0 0 24 24\"\r\n        fill=\"none\"\r\n        xmlns=\"http://www.w3.org/2000/svg\"\r\n      >\r\n        <path\r\n          d=\"M12 4.75V6.25\"\r\n          stroke=\"currentColor\"\r\n          strokeWidth=\"2\"\r\n          strokeLinecap=\"round\"\r\n          strokeLinejoin=\"round\"\r\n        />\r\n        <path\r\n          d=\"M17.1475 6.8525L16.0625 7.9375\"\r\n          stroke=\"currentColor\"\r\n          strokeWidth=\"2\"\r\n          strokeLinecap=\"round\"\r\n          strokeLinejoin=\"round\"\r\n        />\r\n        <path\r\n          d=\"M19.25 12H17.75\"\r\n          stroke=\"currentColor\"\r\n          strokeWidth=\"2\"\r\n          strokeLinecap=\"round\"\r\n          strokeLinejoin=\"round\"\r\n        />\r\n        <path\r\n          d=\"M17.1475 17.1475L16.0625 16.0625\"\r\n          stroke=\"currentColor\"\r\n          strokeWidth=\"2\"\r\n          strokeLinecap=\"round\"\r\n          strokeLinejoin=\"round\"\r\n        />\r\n        <path\r\n          d=\"M12 17.75V19.25\"\r\n          stroke=\"currentColor\"\r\n          strokeWidth=\"2\"\r\n          strokeLinecap=\"round\"\r\n          strokeLinejoin=\"round\"\r\n        />\r\n        <path\r\n          d=\"M6.8525 17.1475L7.9375 16.0625\"\r\n          stroke=\"currentColor\"\r\n          strokeWidth=\"2\"\r\n          strokeLinecap=\"round\"\r\n          strokeLinejoin=\"round\"\r\n        />\r\n        <path\r\n          d=\"M4.75 12H6.25\"\r\n          stroke=\"currentColor\"\r\n          strokeWidth=\"2\"\r\n          strokeLinecap=\"round\"\r\n          strokeLinejoin=\"round\"\r\n        />\r\n        <path\r\n          d=\"M6.8525 6.8525L7.9375 7.9375\"\r\n          stroke=\"currentColor\"\r\n          strokeWidth=\"2\"\r\n          strokeLinecap=\"round\"\r\n          strokeLinejoin=\"round\"\r\n        />\r\n      </svg>\r\n    </div>\r\n  );\r\n});\r\n"],"names":["RenderLoadingMask","forwardRef","props","ref","className","rest","jsx","cn","jsxs"],"mappings":";;;AAGO,MAAMA,IAAoBC,EAG/B,CAACC,GAAOC,MAAQ;AAChB,QAAM,EAAE,WAAAC,GAAW,GAAGC,EAAA,IAASH;AAC/B,SACE,gBAAAI;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGD;AAAA,MACJ,KAAAF;AAAA,MACA,WAAWI,EAAG,2CAA2CH,CAAS;AAAA,MAElE,UAAA,gBAAAI;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,OAAM;AAAA,UAEN,UAAA;AAAA,YAAA,gBAAAF;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,GAAE;AAAA,gBACF,QAAO;AAAA,gBACP,aAAY;AAAA,gBACZ,eAAc;AAAA,gBACd,gBAAe;AAAA,cAAA;AAAA,YAAA;AAAA,YAEjB,gBAAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,GAAE;AAAA,gBACF,QAAO;AAAA,gBACP,aAAY;AAAA,gBACZ,eAAc;AAAA,gBACd,gBAAe;AAAA,cAAA;AAAA,YAAA;AAAA,YAEjB,gBAAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,GAAE;AAAA,gBACF,QAAO;AAAA,gBACP,aAAY;AAAA,gBACZ,eAAc;AAAA,gBACd,gBAAe;AAAA,cAAA;AAAA,YAAA;AAAA,YAEjB,gBAAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,GAAE;AAAA,gBACF,QAAO;AAAA,gBACP,aAAY;AAAA,gBACZ,eAAc;AAAA,gBACd,gBAAe;AAAA,cAAA;AAAA,YAAA;AAAA,YAEjB,gBAAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,GAAE;AAAA,gBACF,QAAO;AAAA,gBACP,aAAY;AAAA,gBACZ,eAAc;AAAA,gBACd,gBAAe;AAAA,cAAA;AAAA,YAAA;AAAA,YAEjB,gBAAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,GAAE;AAAA,gBACF,QAAO;AAAA,gBACP,aAAY;AAAA,gBACZ,eAAc;AAAA,gBACd,gBAAe;AAAA,cAAA;AAAA,YAAA;AAAA,YAEjB,gBAAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,GAAE;AAAA,gBACF,QAAO;AAAA,gBACP,aAAY;AAAA,gBACZ,eAAc;AAAA,gBACd,gBAAe;AAAA,cAAA;AAAA,YAAA;AAAA,YAEjB,gBAAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,GAAE;AAAA,gBACF,QAAO;AAAA,gBACP,aAAY;AAAA,gBACZ,eAAc;AAAA,gBACd,gBAAe;AAAA,cAAA;AAAA,YAAA;AAAA,UACjB;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAGN,CAAC;"}

package/LoadingProgress/LoadingProgress.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoadingProgress.js","sources":["../../src/LoadingProgress/LoadingProgress.tsx"],"sourcesContent":["import { FC } from \"react\";\n\nimport { cn } from \"@oneplatformdev/utils\";\nimport { loadingProgressVariants } from './loadingProgressVariants';\nimport { ILoadingProgressProps } from './LoadingProgress.types';\n\n// TODO: progress loading for art-metal. remove or refactor\nexport const LoadingProgress: FC<ILoadingProgressProps> = (props) => {\n  const { className, fullWidth = false, size, color, wrapClassName } = props;\n  return (\n    <div\n      className={cn(\n        wrapClassName,\n        'w-fit h-auto',\n        Boolean(fullWidth) && 'flex grow w-full h-full items-center justify-center'\n      )}\n    >\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeWidth=\"2\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        className={cn(\n          loadingProgressVariants({ size, color, className }),\n        )}\n      >\n        <path d=\"M21 12a9 9 0 1 1-6.219-8.56\"/>\n      </svg>\n    </div>\n  );\n};\n"],"names":["LoadingProgress","props","className","fullWidth","size","color","wrapClassName","jsx","cn","loadingProgressVariants"],"mappings":";;;AAOO,MAAMA,IAA6C,CAACC,MAAU;AACnE,QAAM,EAAE,WAAAC,GAAW,WAAAC,IAAY,IAAO,MAAAC,GAAM,OAAAC,GAAO,eAAAC,MAAkBL;AACrE,SACE,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACTF;AAAA,QACA;AAAA,QACA,EAAQH,KAAc;AAAA,MAAA;AAAA,MAGxB,UAAA,gBAAAI;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN,OAAM;AAAA,UACN,QAAO;AAAA,UACP,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,QAAO;AAAA,UACP,aAAY;AAAA,UACZ,eAAc;AAAA,UACd,gBAAe;AAAA,UACf,WAAWC;AAAA,YACTC,EAAwB,EAAE,MAAAL,GAAM,OAAAC,GAAO,WAAAH,GAAW;AAAA,UAAA;AAAA,UAGpD,UAAA,gBAAAK,EAAC,QAAA,EAAK,GAAE,8BAAA,CAA6B;AAAA,QAAA;AAAA,MAAA;AAAA,IACvC;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"LoadingProgress.js","sources":["../../src/LoadingProgress/LoadingProgress.tsx"],"sourcesContent":["import { FC } from \"react\";\r\n\r\nimport { cn } from \"@oneplatformdev/utils\";\r\nimport { loadingProgressVariants } from './loadingProgressVariants';\r\nimport { ILoadingProgressProps } from './LoadingProgress.types';\r\n\r\n// TODO: progress loading for art-metal. remove or refactor\r\nexport const LoadingProgress: FC<ILoadingProgressProps> = (props) => {\r\n  const { className, fullWidth = false, size, color, wrapClassName } = props;\r\n  return (\r\n    <div\r\n      className={cn(\r\n        wrapClassName,\r\n        'w-fit h-auto',\r\n        Boolean(fullWidth) && 'flex grow w-full h-full items-center justify-center'\r\n      )}\r\n    >\r\n      <svg\r\n        xmlns=\"http://www.w3.org/2000/svg\"\r\n        width=\"24\"\r\n        height=\"24\"\r\n        viewBox=\"0 0 24 24\"\r\n        fill=\"none\"\r\n        stroke=\"currentColor\"\r\n        strokeWidth=\"2\"\r\n        strokeLinecap=\"round\"\r\n        strokeLinejoin=\"round\"\r\n        className={cn(\r\n          loadingProgressVariants({ size, color, className }),\r\n        )}\r\n      >\r\n        <path d=\"M21 12a9 9 0 1 1-6.219-8.56\"/>\r\n      </svg>\r\n    </div>\r\n  );\r\n};\r\n"],"names":["LoadingProgress","props","className","fullWidth","size","color","wrapClassName","jsx","cn","loadingProgressVariants"],"mappings":";;;AAOO,MAAMA,IAA6C,CAACC,MAAU;AACnE,QAAM,EAAE,WAAAC,GAAW,WAAAC,IAAY,IAAO,MAAAC,GAAM,OAAAC,GAAO,eAAAC,MAAkBL;AACrE,SACE,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACTF;AAAA,QACA;AAAA,QACA,EAAQH,KAAc;AAAA,MAAA;AAAA,MAGxB,UAAA,gBAAAI;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN,OAAM;AAAA,UACN,QAAO;AAAA,UACP,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,QAAO;AAAA,UACP,aAAY;AAAA,UACZ,eAAc;AAAA,UACd,gBAAe;AAAA,UACf,WAAWC;AAAA,YACTC,EAAwB,EAAE,MAAAL,GAAM,OAAAC,GAAO,WAAAH,GAAW;AAAA,UAAA;AAAA,UAGpD,UAAA,gBAAAK,EAAC,QAAA,EAAK,GAAE,8BAAA,CAA6B;AAAA,QAAA;AAAA,MAAA;AAAA,IACvC;AAAA,EAAA;AAGN;"}

package/LoadingProgress/loadingProgressVariants.js.map

@@ -1 +1 @@
-{"version":3,"file":"loadingProgressVariants.js","sources":["../../src/LoadingProgress/loadingProgressVariants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\n\nexport const loadingProgressVariants = cva(\n  \"animate-spin\",\n  {\n    variants: {\n      color: {\n        primary: 'text-primary',\n        default: ''\n      },\n      size: {\n        default: \"\",\n        sm: \"\",\n        lg: \"w-20 h-20\",\n      },\n    },\n    defaultVariants: {\n      size: \"default\",\n      color: \"default\",\n    },\n  }\n);\n"],"names":["loadingProgressVariants","cva"],"mappings":";AAEO,MAAMA,IAA0BC;AAAA,EACrC;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,OAAO;AAAA,QACL,SAAS;AAAA,QACT,SAAS;AAAA,MAAA;AAAA,MAEX,MAAM;AAAA,QACJ,SAAS;AAAA,QACT,IAAI;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,IACN;AAAA,IAEF,iBAAiB;AAAA,MACf,MAAM;AAAA,MACN,OAAO;AAAA,IAAA;AAAA,EACT;AAEJ;"}
+{"version":3,"file":"loadingProgressVariants.js","sources":["../../src/LoadingProgress/loadingProgressVariants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\r\n\r\nexport const loadingProgressVariants = cva(\r\n  \"animate-spin\",\r\n  {\r\n    variants: {\r\n      color: {\r\n        primary: 'text-primary',\r\n        default: ''\r\n      },\r\n      size: {\r\n        default: \"\",\r\n        sm: \"\",\r\n        lg: \"w-20 h-20\",\r\n      },\r\n    },\r\n    defaultVariants: {\r\n      size: \"default\",\r\n      color: \"default\",\r\n    },\r\n  }\r\n);\r\n"],"names":["loadingProgressVariants","cva"],"mappings":";AAEO,MAAMA,IAA0BC;AAAA,EACrC;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,OAAO;AAAA,QACL,SAAS;AAAA,QACT,SAAS;AAAA,MAAA;AAAA,MAEX,MAAM;AAAA,QACJ,SAAS;AAAA,QACT,IAAI;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,IACN;AAAA,IAEF,iBAAiB;AAAA,MACf,MAAM;AAAA,MACN,OAAO;AAAA,IAAA;AAAA,EACT;AAEJ;"}