npm - @jenesei-software/jenesei-kit-react - Versions diffs - 2.3.2 → 2.3.3 - Mend

@jenesei-software/jenesei-kit-react 2.3.2 → 2.3.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (59) hide show

package/build/{input-otp-MDjIcfVu.cjs → input-otp-B9zfjb5u.cjs} RENAMED Viewed

@@ -1,3 +1,3 @@
-const q=require("./chunk-Dd8m0Ver.cjs"),C=require("./utils-DCIq-5FL.cjs"),R=require("./error-aQfsl_Kl.cjs"),I=require("./input-DMm67Wyr.cjs");let o=require("react/jsx-runtime"),l=require("react");var j=e=>{const[f,h]=(0,l.useState)(new Array(e.length).fill("")),s=(0,l.useRef)([]),g=(0,l.useRef)(null),m=(0,l.useCallback)((t,i)=>{i.preventDefault();const n=i.clipboardData.getData("Text").replace(/\D/g,"").split("");n.length&&h(u=>{const r=[...u];let c=t;for(let a=0;a<n.length&&c<r.length;a++)r[c]=n[a],c++;const d=r.join("");return e.onChange?.(d),r.every(a=>a!=="")&&e.onComplete?.(d),setTimeout(()=>{const a=r.indexOf("");a!==-1?s.current[a]?.focus():c<r.length&&s.current[c]?.focus()},0),r})},[e.onChange,e.onComplete]),y=(0,l.useCallback)((t,i)=>{/^\d*$/.test(i)&&h(n=>{const u=[...n];return u[t]=i.slice(-1),e.onChange&&e.onChange(u.join("")),u.every(r=>r!=="")&&e.onComplete?.(u.join("")),i&&t<n.length-1&&setTimeout(()=>{s.current[t+1]?.focus()},0),u})},[e.onChange,e.onComplete]),T=(t,i)=>{const n=s.current[t];if(n){if(i.key==="ArrowRight"){const u=t<f.length-1?t+1:0,r=s.current[u];r&&(r.focus(),setTimeout(()=>r.setSelectionRange(0,r.value.length),0))}if(i.key==="ArrowLeft"){const u=t>0?t-1:f.length-1,r=s.current[u];r&&(r.focus(),setTimeout(()=>r.setSelectionRange(0,r.value.length),0))}i.key==="Backspace"&&(n.value?setTimeout(()=>n.setSelectionRange(0,n.value.length),0):t>0&&setTimeout(()=>{const u=s.current[t-1];u&&(u.focus(),u.setSelectionRange(0,u.value.length))},0))}},v=(0,l.useCallback)(t=>{setTimeout(()=>t.target.setSelectionRange(0,t.target.value.length),0)},[]);return(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)("div",{className:e.className,style:{gap:`calc(${C.CSS_VARS.size[e.size].padding} - 2px)`,width:"100%",display:"flex",alignItems:"flex-start",...e.style},id:e.id,ref:g,onBlur:t=>{setTimeout(()=>{g.current&&!g.current.contains(document.activeElement)&&e.onBlur?.(t)},0)},onFocus:t=>{setTimeout(()=>{g.current?.contains(document.activeElement)&&e.onFocus?.(t)},0)},children:f.map((t,i)=>(0,o.jsx)(I.Input,{isWidthAsHeight:!0,tabIndex:i+1,ref:n=>{s.current[i]=n},variety:"standard",type:"text",inputMode:"numeric",maxLength:1,value:t,onFocus:v,onPaste:n=>m(i,n),onChange:n=>y(i,n),onKeyDown:n=>T(i,n),genre:e.genre,size:e.size,sxTypography:e.sxTypography,isBold:e.isBold,isFullRadius:e.isFullRadius,isDisabled:e.isDisabled,isHidden:e.isHidden,isHiddenBorder:e.isHiddenBorder},i))}),e?.error?.isError&&(0,o.jsx)(R.ErrorMessage,{size:e?.error.size??e.size,sxTypography:{size:"16px",weight:"400",...e?.error.sxTypography},...e.error})]})};Object.defineProperty(exports,"InputOTP",{enumerable:!0,get:function(){return j}});
+const q=require("./chunk-Dd8m0Ver.cjs"),C=require("./utils-DCIq-5FL.cjs"),R=require("./error-aQfsl_Kl.cjs"),I=require("./input-BW0CKgfw.cjs");let o=require("react/jsx-runtime"),l=require("react");var j=e=>{const[f,h]=(0,l.useState)(new Array(e.length).fill("")),s=(0,l.useRef)([]),g=(0,l.useRef)(null),m=(0,l.useCallback)((t,i)=>{i.preventDefault();const n=i.clipboardData.getData("Text").replace(/\D/g,"").split("");n.length&&h(u=>{const r=[...u];let c=t;for(let a=0;a<n.length&&c<r.length;a++)r[c]=n[a],c++;const d=r.join("");return e.onChange?.(d),r.every(a=>a!=="")&&e.onComplete?.(d),setTimeout(()=>{const a=r.indexOf("");a!==-1?s.current[a]?.focus():c<r.length&&s.current[c]?.focus()},0),r})},[e.onChange,e.onComplete]),y=(0,l.useCallback)((t,i)=>{/^\d*$/.test(i)&&h(n=>{const u=[...n];return u[t]=i.slice(-1),e.onChange&&e.onChange(u.join("")),u.every(r=>r!=="")&&e.onComplete?.(u.join("")),i&&t<n.length-1&&setTimeout(()=>{s.current[t+1]?.focus()},0),u})},[e.onChange,e.onComplete]),T=(t,i)=>{const n=s.current[t];if(n){if(i.key==="ArrowRight"){const u=t<f.length-1?t+1:0,r=s.current[u];r&&(r.focus(),setTimeout(()=>r.setSelectionRange(0,r.value.length),0))}if(i.key==="ArrowLeft"){const u=t>0?t-1:f.length-1,r=s.current[u];r&&(r.focus(),setTimeout(()=>r.setSelectionRange(0,r.value.length),0))}i.key==="Backspace"&&(n.value?setTimeout(()=>n.setSelectionRange(0,n.value.length),0):t>0&&setTimeout(()=>{const u=s.current[t-1];u&&(u.focus(),u.setSelectionRange(0,u.value.length))},0))}},v=(0,l.useCallback)(t=>{setTimeout(()=>t.target.setSelectionRange(0,t.target.value.length),0)},[]);return(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)("div",{className:e.className,style:{gap:`calc(${C.CSS_VARS.size[e.size].padding} - 2px)`,width:"100%",display:"flex",alignItems:"flex-start",...e.style},id:e.id,ref:g,onBlur:t=>{setTimeout(()=>{g.current&&!g.current.contains(document.activeElement)&&e.onBlur?.(t)},0)},onFocus:t=>{setTimeout(()=>{g.current?.contains(document.activeElement)&&e.onFocus?.(t)},0)},children:f.map((t,i)=>(0,o.jsx)(I.Input,{isWidthAsHeight:!0,tabIndex:i+1,ref:n=>{s.current[i]=n},variety:"standard",type:"text",inputMode:"numeric",maxLength:1,value:t,onFocus:v,onPaste:n=>m(i,n),onChange:n=>y(i,n),onKeyDown:n=>T(i,n),genre:e.genre,size:e.size,sxTypography:e.sxTypography,isBold:e.isBold,isFullRadius:e.isFullRadius,isDisabled:e.isDisabled,isHidden:e.isHidden,isHiddenBorder:e.isHiddenBorder},i))}),e?.error?.isError&&(0,o.jsx)(R.ErrorMessage,{size:e?.error.size??e.size,sxTypography:{size:"16px",weight:"400",...e?.error.sxTypography},...e.error})]})};Object.defineProperty(exports,"InputOTP",{enumerable:!0,get:function(){return j}});
-//# sourceMappingURL=input-otp-MDjIcfVu.cjs.map
+//# sourceMappingURL=input-otp-B9zfjb5u.cjs.map

package/build/{input-otp-MDjIcfVu.cjs.map → input-otp-B9zfjb5u.cjs.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"input-otp-~~MDjIcfVu~~.cjs","names":[],"sources":["../src/components/input-otp/component.tsx"],"sourcesContent":["import { ErrorMessage } from '@local/components/error';\nimport { Input } from '@local/components/input';\nimport { CSS_VARS } from '@local/styles/utils';\n\nimport { ClipboardEvent, FocusEvent, KeyboardEvent, useCallback, useRef, useState } from 'react';\n\nimport { IInputOTP } from './component.types';\n\nexport const InputOTP = (props: IInputOTP) => {\n const [otp, setOtp] = useState<string[]>(new Array(props.length).fill(''));\n const inputsRef = useRef<(HTMLInputElement \| null)[]>([]);\n const wrapperRef = useRef<HTMLDivElement \| null>(null);\n\n const handlePaste = useCallback(\n (index: number, e: ClipboardEvent<HTMLInputElement>) => {\n e.preventDefault();\n\n const pasteData = e.clipboardData.getData('Text');\n const digits = pasteData.replace(/\\D/g, '').split('');\n\n if (!digits.length) return;\n\n setOtp((prevOtp) => {\n const newOtp = [...prevOtp];\n let currentIndex = index;\n\n for (let i = 0; i < digits.length && currentIndex < newOtp.length; i++) {\n newOtp[currentIndex] = digits[i];\n currentIndex++;\n }\n\n const joined = newOtp.join('');\n\n props.onChange?.(joined);\n\n if (newOtp.every((char) => char !== '')) {\n props.onComplete?.(joined);\n }\n\n setTimeout(() => {\n const firstEmpty = newOtp.indexOf('');\n if (firstEmpty !== -1) {\n inputsRef.current[firstEmpty]?.focus();\n } else if (currentIndex < newOtp.length) {\n inputsRef.current[currentIndex]?.focus();\n }\n }, 0);\n\n return newOtp;\n });\n },\n [props.onChange, props.onComplete],\n );\n\n const handleChange = useCallback(\n (index: number, value: string) => {\n if (!/^\\d*$/.test(value)) return;\n\n setOtp((prevOtp) => {\n const newOtp = [...prevOtp];\n newOtp[index] = value.slice(-1);\n\n if (props.onChange) {\n props.onChange(newOtp.join(''));\n }\n\n if (newOtp.every((char) => char !== '')) {\n props.onComplete?.(newOtp.join(''));\n }\n\n if (value && index < prevOtp.length - 1) {\n setTimeout(() => {\n inputsRef.current[index + 1]?.focus();\n }, 0);\n }\n\n return newOtp;\n });\n },\n [props.onChange, props.onComplete],\n );\n\n const handleKeyDown = (index: number, e: KeyboardEvent<HTMLInputElement>) => {\n const input = inputsRef.current[index];\n\n if (!input) return;\n\n if (e.key === 'ArrowRight') {\n const nextIndex = index < otp.length - 1 ? index + 1 : 0;\n const nextInput = inputsRef.current[nextIndex];\n\n if (nextInput) {\n nextInput.focus();\n setTimeout(() => nextInput.setSelectionRange(0, nextInput.value.length), 0);\n }\n }\n\n if (e.key === 'ArrowLeft') {\n const prevIndex = index > 0 ? index - 1 : otp.length - 1;\n const prevInput = inputsRef.current[prevIndex];\n\n if (prevInput) {\n prevInput.focus();\n setTimeout(() => prevInput.setSelectionRange(0, prevInput.value.length), 0);\n }\n }\n\n if (e.key === 'Backspace') {\n if (input.value) {\n setTimeout(() => input.setSelectionRange(0, input.value.length), 0);\n } else if (index > 0) {\n setTimeout(() => {\n const prevInput = inputsRef.current[index - 1];\n if (prevInput) {\n prevInput.focus();\n prevInput.setSelectionRange(0, prevInput.value.length);\n }\n }, 0);\n }\n }\n };\n\n const handleFocusInput = useCallback((e: FocusEvent<HTMLInputElement>) => {\n setTimeout(() => e.target.setSelectionRange(0, e.target.value.length), 0);\n }, []);\n return (\n <>\n <div\n className={props.className}\n style={{\n gap: `calc(${CSS_VARS.size[props.size].padding} - 2px)`,\n width: '100%',\n display: 'flex',\n alignItems: 'flex-start',\n ...props.style,\n }}\n id={props.id}\n ref={wrapperRef}\n onBlur={(e) => {\n setTimeout(() => {\n if (wrapperRef.current && !wrapperRef.current.contains(document.activeElement)) {\n props.onBlur?.(e);\n }\n }, 0);\n }}\n onFocus={(e) => {\n setTimeout(() => {\n if (wrapperRef.current?.contains(document.activeElement)) {\n props.onFocus?.(e);\n }\n }, 0);\n }}\n >\n {otp.map((digit, index) => (\n <Input\n isWidthAsHeight\n key={index}\n tabIndex={index + 1}\n ref={(el) => {\n inputsRef.current[index] = el;\n }}\n variety='standard'\n type='text'\n inputMode='numeric'\n maxLength={1}\n value={digit}\n onFocus={handleFocusInput}\n onPaste={(e) => handlePaste(index, e)}\n onChange={(value) => handleChange(index, value)}\n onKeyDown={(e) => handleKeyDown(index, e)}\n genre={props.genre}\n size={props.size}\n sxTypography={props.sxTypography}\n isBold={props.isBold}\n isFullRadius={props.isFullRadius}\n isDisabled={props.isDisabled}\n isHidden={props.isHidden}\n isHiddenBorder={props.isHiddenBorder}\n />\n ))}\n </div>\n {props?.error?.isError && (\n <ErrorMessage\n size={props?.error.size ?? props.size}\n sxTypography={{ size: '16px', weight: '400', ...props?.error.sxTypography }}\n {...props.error}\n />\n )}\n </>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"input-otp-B9zfjb5u.cjs","names":[],"sources":["../src/components/input-otp/component.tsx"],"sourcesContent":["import { ErrorMessage } from '@local/components/error';\nimport { Input } from '@local/components/input';\nimport { CSS_VARS } from '@local/styles/utils';\n\nimport { ClipboardEvent, FocusEvent, KeyboardEvent, useCallback, useRef, useState } from 'react';\n\nimport { IInputOTP } from './component.types';\n\nexport const InputOTP = (props: IInputOTP) => {\n const [otp, setOtp] = useState<string[]>(new Array(props.length).fill(''));\n const inputsRef = useRef<(HTMLInputElement \| null)[]>([]);\n const wrapperRef = useRef<HTMLDivElement \| null>(null);\n\n const handlePaste = useCallback(\n (index: number, e: ClipboardEvent<HTMLInputElement>) => {\n e.preventDefault();\n\n const pasteData = e.clipboardData.getData('Text');\n const digits = pasteData.replace(/\\D/g, '').split('');\n\n if (!digits.length) return;\n\n setOtp((prevOtp) => {\n const newOtp = [...prevOtp];\n let currentIndex = index;\n\n for (let i = 0; i < digits.length && currentIndex < newOtp.length; i++) {\n newOtp[currentIndex] = digits[i];\n currentIndex++;\n }\n\n const joined = newOtp.join('');\n\n props.onChange?.(joined);\n\n if (newOtp.every((char) => char !== '')) {\n props.onComplete?.(joined);\n }\n\n setTimeout(() => {\n const firstEmpty = newOtp.indexOf('');\n if (firstEmpty !== -1) {\n inputsRef.current[firstEmpty]?.focus();\n } else if (currentIndex < newOtp.length) {\n inputsRef.current[currentIndex]?.focus();\n }\n }, 0);\n\n return newOtp;\n });\n },\n [props.onChange, props.onComplete],\n );\n\n const handleChange = useCallback(\n (index: number, value: string) => {\n if (!/^\\d*$/.test(value)) return;\n\n setOtp((prevOtp) => {\n const newOtp = [...prevOtp];\n newOtp[index] = value.slice(-1);\n\n if (props.onChange) {\n props.onChange(newOtp.join(''));\n }\n\n if (newOtp.every((char) => char !== '')) {\n props.onComplete?.(newOtp.join(''));\n }\n\n if (value && index < prevOtp.length - 1) {\n setTimeout(() => {\n inputsRef.current[index + 1]?.focus();\n }, 0);\n }\n\n return newOtp;\n });\n },\n [props.onChange, props.onComplete],\n );\n\n const handleKeyDown = (index: number, e: KeyboardEvent<HTMLInputElement>) => {\n const input = inputsRef.current[index];\n\n if (!input) return;\n\n if (e.key === 'ArrowRight') {\n const nextIndex = index < otp.length - 1 ? index + 1 : 0;\n const nextInput = inputsRef.current[nextIndex];\n\n if (nextInput) {\n nextInput.focus();\n setTimeout(() => nextInput.setSelectionRange(0, nextInput.value.length), 0);\n }\n }\n\n if (e.key === 'ArrowLeft') {\n const prevIndex = index > 0 ? index - 1 : otp.length - 1;\n const prevInput = inputsRef.current[prevIndex];\n\n if (prevInput) {\n prevInput.focus();\n setTimeout(() => prevInput.setSelectionRange(0, prevInput.value.length), 0);\n }\n }\n\n if (e.key === 'Backspace') {\n if (input.value) {\n setTimeout(() => input.setSelectionRange(0, input.value.length), 0);\n } else if (index > 0) {\n setTimeout(() => {\n const prevInput = inputsRef.current[index - 1];\n if (prevInput) {\n prevInput.focus();\n prevInput.setSelectionRange(0, prevInput.value.length);\n }\n }, 0);\n }\n }\n };\n\n const handleFocusInput = useCallback((e: FocusEvent<HTMLInputElement>) => {\n setTimeout(() => e.target.setSelectionRange(0, e.target.value.length), 0);\n }, []);\n return (\n <>\n <div\n className={props.className}\n style={{\n gap: `calc(${CSS_VARS.size[props.size].padding} - 2px)`,\n width: '100%',\n display: 'flex',\n alignItems: 'flex-start',\n ...props.style,\n }}\n id={props.id}\n ref={wrapperRef}\n onBlur={(e) => {\n setTimeout(() => {\n if (wrapperRef.current && !wrapperRef.current.contains(document.activeElement)) {\n props.onBlur?.(e);\n }\n }, 0);\n }}\n onFocus={(e) => {\n setTimeout(() => {\n if (wrapperRef.current?.contains(document.activeElement)) {\n props.onFocus?.(e);\n }\n }, 0);\n }}\n >\n {otp.map((digit, index) => (\n <Input\n isWidthAsHeight\n key={index}\n tabIndex={index + 1}\n ref={(el) => {\n inputsRef.current[index] = el;\n }}\n variety='standard'\n type='text'\n inputMode='numeric'\n maxLength={1}\n value={digit}\n onFocus={handleFocusInput}\n onPaste={(e) => handlePaste(index, e)}\n onChange={(value) => handleChange(index, value)}\n onKeyDown={(e) => handleKeyDown(index, e)}\n genre={props.genre}\n size={props.size}\n sxTypography={props.sxTypography}\n isBold={props.isBold}\n isFullRadius={props.isFullRadius}\n isDisabled={props.isDisabled}\n isHidden={props.isHidden}\n isHiddenBorder={props.isHiddenBorder}\n />\n ))}\n </div>\n {props?.error?.isError && (\n <ErrorMessage\n size={props?.error.size ?? props.size}\n sxTypography={{ size: '16px', weight: '400', ...props?.error.sxTypography }}\n {...props.error}\n />\n )}\n </>\n );\n};\n"],"mappings":"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"}

package/build/{input-otp-q4zKk_nP.js → input-otp-DWTU3oR1.js} RENAMED Viewed

@@ -1,6 +1,6 @@
 import { r as R } from "./utils-BRgi6734.js";
 import { t as I } from "./error-iaB6e_aq.js";
-import { t as w } from "./input-Buf_HFGH.js";
+import { t as w } from "./input-BS1SNtLb.js";
 import { Fragment as S, jsx as g, jsxs as x } from "react/jsx-runtime";
 import { useCallback as f, useRef as d, useState as z } from "react";
 var k = (e) => {
@@ -103,4 +103,4 @@ export {
   k as t
 };
-//# sourceMappingURL=input-otp-q4zKk_nP.js.map
+//# sourceMappingURL=input-otp-DWTU3oR1.js.map

package/build/{input-otp-q4zKk_nP.js.map → input-otp-DWTU3oR1.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"input-otp-~~q4zKk_nP~~.js","names":[],"sources":["../src/components/input-otp/component.tsx"],"sourcesContent":["import { ErrorMessage } from '@local/components/error';\nimport { Input } from '@local/components/input';\nimport { CSS_VARS } from '@local/styles/utils';\n\nimport { ClipboardEvent, FocusEvent, KeyboardEvent, useCallback, useRef, useState } from 'react';\n\nimport { IInputOTP } from './component.types';\n\nexport const InputOTP = (props: IInputOTP) => {\n const [otp, setOtp] = useState<string[]>(new Array(props.length).fill(''));\n const inputsRef = useRef<(HTMLInputElement \| null)[]>([]);\n const wrapperRef = useRef<HTMLDivElement \| null>(null);\n\n const handlePaste = useCallback(\n (index: number, e: ClipboardEvent<HTMLInputElement>) => {\n e.preventDefault();\n\n const pasteData = e.clipboardData.getData('Text');\n const digits = pasteData.replace(/\\D/g, '').split('');\n\n if (!digits.length) return;\n\n setOtp((prevOtp) => {\n const newOtp = [...prevOtp];\n let currentIndex = index;\n\n for (let i = 0; i < digits.length && currentIndex < newOtp.length; i++) {\n newOtp[currentIndex] = digits[i];\n currentIndex++;\n }\n\n const joined = newOtp.join('');\n\n props.onChange?.(joined);\n\n if (newOtp.every((char) => char !== '')) {\n props.onComplete?.(joined);\n }\n\n setTimeout(() => {\n const firstEmpty = newOtp.indexOf('');\n if (firstEmpty !== -1) {\n inputsRef.current[firstEmpty]?.focus();\n } else if (currentIndex < newOtp.length) {\n inputsRef.current[currentIndex]?.focus();\n }\n }, 0);\n\n return newOtp;\n });\n },\n [props.onChange, props.onComplete],\n );\n\n const handleChange = useCallback(\n (index: number, value: string) => {\n if (!/^\\d*$/.test(value)) return;\n\n setOtp((prevOtp) => {\n const newOtp = [...prevOtp];\n newOtp[index] = value.slice(-1);\n\n if (props.onChange) {\n props.onChange(newOtp.join(''));\n }\n\n if (newOtp.every((char) => char !== '')) {\n props.onComplete?.(newOtp.join(''));\n }\n\n if (value && index < prevOtp.length - 1) {\n setTimeout(() => {\n inputsRef.current[index + 1]?.focus();\n }, 0);\n }\n\n return newOtp;\n });\n },\n [props.onChange, props.onComplete],\n );\n\n const handleKeyDown = (index: number, e: KeyboardEvent<HTMLInputElement>) => {\n const input = inputsRef.current[index];\n\n if (!input) return;\n\n if (e.key === 'ArrowRight') {\n const nextIndex = index < otp.length - 1 ? index + 1 : 0;\n const nextInput = inputsRef.current[nextIndex];\n\n if (nextInput) {\n nextInput.focus();\n setTimeout(() => nextInput.setSelectionRange(0, nextInput.value.length), 0);\n }\n }\n\n if (e.key === 'ArrowLeft') {\n const prevIndex = index > 0 ? index - 1 : otp.length - 1;\n const prevInput = inputsRef.current[prevIndex];\n\n if (prevInput) {\n prevInput.focus();\n setTimeout(() => prevInput.setSelectionRange(0, prevInput.value.length), 0);\n }\n }\n\n if (e.key === 'Backspace') {\n if (input.value) {\n setTimeout(() => input.setSelectionRange(0, input.value.length), 0);\n } else if (index > 0) {\n setTimeout(() => {\n const prevInput = inputsRef.current[index - 1];\n if (prevInput) {\n prevInput.focus();\n prevInput.setSelectionRange(0, prevInput.value.length);\n }\n }, 0);\n }\n }\n };\n\n const handleFocusInput = useCallback((e: FocusEvent<HTMLInputElement>) => {\n setTimeout(() => e.target.setSelectionRange(0, e.target.value.length), 0);\n }, []);\n return (\n <>\n <div\n className={props.className}\n style={{\n gap: `calc(${CSS_VARS.size[props.size].padding} - 2px)`,\n width: '100%',\n display: 'flex',\n alignItems: 'flex-start',\n ...props.style,\n }}\n id={props.id}\n ref={wrapperRef}\n onBlur={(e) => {\n setTimeout(() => {\n if (wrapperRef.current && !wrapperRef.current.contains(document.activeElement)) {\n props.onBlur?.(e);\n }\n }, 0);\n }}\n onFocus={(e) => {\n setTimeout(() => {\n if (wrapperRef.current?.contains(document.activeElement)) {\n props.onFocus?.(e);\n }\n }, 0);\n }}\n >\n {otp.map((digit, index) => (\n <Input\n isWidthAsHeight\n key={index}\n tabIndex={index + 1}\n ref={(el) => {\n inputsRef.current[index] = el;\n }}\n variety='standard'\n type='text'\n inputMode='numeric'\n maxLength={1}\n value={digit}\n onFocus={handleFocusInput}\n onPaste={(e) => handlePaste(index, e)}\n onChange={(value) => handleChange(index, value)}\n onKeyDown={(e) => handleKeyDown(index, e)}\n genre={props.genre}\n size={props.size}\n sxTypography={props.sxTypography}\n isBold={props.isBold}\n isFullRadius={props.isFullRadius}\n isDisabled={props.isDisabled}\n isHidden={props.isHidden}\n isHiddenBorder={props.isHiddenBorder}\n />\n ))}\n </div>\n {props?.error?.isError && (\n <ErrorMessage\n size={props?.error.size ?? props.size}\n sxTypography={{ size: '16px', weight: '400', ...props?.error.sxTypography }}\n {...props.error}\n />\n )}\n </>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"input-otp-DWTU3oR1.js","names":[],"sources":["../src/components/input-otp/component.tsx"],"sourcesContent":["import { ErrorMessage } from '@local/components/error';\nimport { Input } from '@local/components/input';\nimport { CSS_VARS } from '@local/styles/utils';\n\nimport { ClipboardEvent, FocusEvent, KeyboardEvent, useCallback, useRef, useState } from 'react';\n\nimport { IInputOTP } from './component.types';\n\nexport const InputOTP = (props: IInputOTP) => {\n const [otp, setOtp] = useState<string[]>(new Array(props.length).fill(''));\n const inputsRef = useRef<(HTMLInputElement \| null)[]>([]);\n const wrapperRef = useRef<HTMLDivElement \| null>(null);\n\n const handlePaste = useCallback(\n (index: number, e: ClipboardEvent<HTMLInputElement>) => {\n e.preventDefault();\n\n const pasteData = e.clipboardData.getData('Text');\n const digits = pasteData.replace(/\\D/g, '').split('');\n\n if (!digits.length) return;\n\n setOtp((prevOtp) => {\n const newOtp = [...prevOtp];\n let currentIndex = index;\n\n for (let i = 0; i < digits.length && currentIndex < newOtp.length; i++) {\n newOtp[currentIndex] = digits[i];\n currentIndex++;\n }\n\n const joined = newOtp.join('');\n\n props.onChange?.(joined);\n\n if (newOtp.every((char) => char !== '')) {\n props.onComplete?.(joined);\n }\n\n setTimeout(() => {\n const firstEmpty = newOtp.indexOf('');\n if (firstEmpty !== -1) {\n inputsRef.current[firstEmpty]?.focus();\n } else if (currentIndex < newOtp.length) {\n inputsRef.current[currentIndex]?.focus();\n }\n }, 0);\n\n return newOtp;\n });\n },\n [props.onChange, props.onComplete],\n );\n\n const handleChange = useCallback(\n (index: number, value: string) => {\n if (!/^\\d*$/.test(value)) return;\n\n setOtp((prevOtp) => {\n const newOtp = [...prevOtp];\n newOtp[index] = value.slice(-1);\n\n if (props.onChange) {\n props.onChange(newOtp.join(''));\n }\n\n if (newOtp.every((char) => char !== '')) {\n props.onComplete?.(newOtp.join(''));\n }\n\n if (value && index < prevOtp.length - 1) {\n setTimeout(() => {\n inputsRef.current[index + 1]?.focus();\n }, 0);\n }\n\n return newOtp;\n });\n },\n [props.onChange, props.onComplete],\n );\n\n const handleKeyDown = (index: number, e: KeyboardEvent<HTMLInputElement>) => {\n const input = inputsRef.current[index];\n\n if (!input) return;\n\n if (e.key === 'ArrowRight') {\n const nextIndex = index < otp.length - 1 ? index + 1 : 0;\n const nextInput = inputsRef.current[nextIndex];\n\n if (nextInput) {\n nextInput.focus();\n setTimeout(() => nextInput.setSelectionRange(0, nextInput.value.length), 0);\n }\n }\n\n if (e.key === 'ArrowLeft') {\n const prevIndex = index > 0 ? index - 1 : otp.length - 1;\n const prevInput = inputsRef.current[prevIndex];\n\n if (prevInput) {\n prevInput.focus();\n setTimeout(() => prevInput.setSelectionRange(0, prevInput.value.length), 0);\n }\n }\n\n if (e.key === 'Backspace') {\n if (input.value) {\n setTimeout(() => input.setSelectionRange(0, input.value.length), 0);\n } else if (index > 0) {\n setTimeout(() => {\n const prevInput = inputsRef.current[index - 1];\n if (prevInput) {\n prevInput.focus();\n prevInput.setSelectionRange(0, prevInput.value.length);\n }\n }, 0);\n }\n }\n };\n\n const handleFocusInput = useCallback((e: FocusEvent<HTMLInputElement>) => {\n setTimeout(() => e.target.setSelectionRange(0, e.target.value.length), 0);\n }, []);\n return (\n <>\n <div\n className={props.className}\n style={{\n gap: `calc(${CSS_VARS.size[props.size].padding} - 2px)`,\n width: '100%',\n display: 'flex',\n alignItems: 'flex-start',\n ...props.style,\n }}\n id={props.id}\n ref={wrapperRef}\n onBlur={(e) => {\n setTimeout(() => {\n if (wrapperRef.current && !wrapperRef.current.contains(document.activeElement)) {\n props.onBlur?.(e);\n }\n }, 0);\n }}\n onFocus={(e) => {\n setTimeout(() => {\n if (wrapperRef.current?.contains(document.activeElement)) {\n props.onFocus?.(e);\n }\n }, 0);\n }}\n >\n {otp.map((digit, index) => (\n <Input\n isWidthAsHeight\n key={index}\n tabIndex={index + 1}\n ref={(el) => {\n inputsRef.current[index] = el;\n }}\n variety='standard'\n type='text'\n inputMode='numeric'\n maxLength={1}\n value={digit}\n onFocus={handleFocusInput}\n onPaste={(e) => handlePaste(index, e)}\n onChange={(value) => handleChange(index, value)}\n onKeyDown={(e) => handleKeyDown(index, e)}\n genre={props.genre}\n size={props.size}\n sxTypography={props.sxTypography}\n isBold={props.isBold}\n isFullRadius={props.isFullRadius}\n isDisabled={props.isDisabled}\n isHidden={props.isHidden}\n isHiddenBorder={props.isHiddenBorder}\n />\n ))}\n </div>\n {props?.error?.isError && (\n <ErrorMessage\n size={props?.error.size ?? props.size}\n sxTypography={{ size: '16px', weight: '400', ...props?.error.sxTypography }}\n {...props.error}\n />\n )}\n </>\n );\n};\n"],"mappings":";;;;;AAQA,IAAa,IAAA,CAAY,MAAqB;AAC5C,QAAM,CAAC,GAAK,CAAA,IAAU,EAAmB,IAAI,MAAM,EAAM,MAAA,EAAQ,KAAK,EAAA,CAAG,GACnE,IAAY,EAAoC,CAAA,CAAE,GAClD,IAAa,EAA8B,IAAA,GAE3C,IAAc,EAAA,CACjB,GAAe,MAAwC;AACtD,IAAA,EAAE,eAAA;AAGF,UAAM,IADY,EAAE,cAAc,QAAQ,MAAA,EACjB,QAAQ,OAAO,EAAA,EAAI,MAAM,EAAA;AAElD,IAAK,EAAO,UAEZ,EAAA,CAAQ,MAAY;AAClB,YAAM,IAAS,CAAC,GAAG,CAAA;AACnB,UAAI,IAAe;AAEnB,eAAS,IAAI,GAAG,IAAI,EAAO,UAAU,IAAe,EAAO,QAAQ;AACjE,QAAA,EAAO,CAAA,IAAgB,EAAO,CAAA,GAC9B;AAGF,YAAM,IAAS,EAAO,KAAK,EAAA;AAE3B,aAAA,EAAM,WAAW,CAAA,GAEb,EAAO,MAAA,CAAO,MAAS,MAAS,EAAA,KAClC,EAAM,aAAa,CAAA,GAGrB,WAAA,MAAiB;AACf,cAAM,IAAa,EAAO,QAAQ,EAAA;AAClC,QAAI,MAAe,KACjB,EAAU,QAAQ,CAAA,GAAa,MAAA,IACtB,IAAe,EAAO,UAC/B,EAAU,QAAQ,CAAA,GAAe,MAAA;AAAA,SAElC,CAAA,GAEI;AAAA;KAGX,CAAC,EAAM,UAAU,EAAM,UAAA,CAAW,GAG9B,IAAe,EAAA,CAClB,GAAe,MAAkB;AAChC,IAAK,QAAQ,KAAK,CAAA,KAElB,EAAA,CAAQ,MAAY;AAClB,YAAM,IAAS,CAAC,GAAG,CAAA;AACnB,aAAA,EAAO,CAAA,IAAS,EAAM,MAAM,EAAA,GAExB,EAAM,YACR,EAAM,SAAS,EAAO,KAAK,EAAA,CAAG,GAG5B,EAAO,MAAA,CAAO,MAAS,MAAS,EAAA,KAClC,EAAM,aAAa,EAAO,KAAK,EAAA,CAAG,GAGhC,KAAS,IAAQ,EAAQ,SAAS,KACpC,WAAA,MAAiB;AACf,QAAA,EAAU,QAAQ,IAAQ,CAAA,GAAI,MAAA;AAAA,SAC7B,CAAA,GAGE;AAAA;KAGX,CAAC,EAAM,UAAU,EAAM,UAAA,CAAW,GAG9B,IAAA,CAAiB,GAAe,MAAuC;AAC3E,UAAM,IAAQ,EAAU,QAAQ,CAAA;AAEhC,QAAK,GAEL;AAAA,UAAI,EAAE,QAAQ,cAAc;AAC1B,cAAM,IAAY,IAAQ,EAAI,SAAS,IAAI,IAAQ,IAAI,GACjD,IAAY,EAAU,QAAQ,CAAA;AAEpC,QAAI,MACF,EAAU,MAAA,GACV,WAAA,MAAiB,EAAU,kBAAkB,GAAG,EAAU,MAAM,MAAA,GAAS,CAAA;AAAA;AAI7E,UAAI,EAAE,QAAQ,aAAa;AACzB,cAAM,IAAY,IAAQ,IAAI,IAAQ,IAAI,EAAI,SAAS,GACjD,IAAY,EAAU,QAAQ,CAAA;AAEpC,QAAI,MACF,EAAU,MAAA,GACV,WAAA,MAAiB,EAAU,kBAAkB,GAAG,EAAU,MAAM,MAAA,GAAS,CAAA;AAAA;AAI7E,MAAI,EAAE,QAAQ,gBACR,EAAM,QACR,WAAA,MAAiB,EAAM,kBAAkB,GAAG,EAAM,MAAM,MAAA,GAAS,CAAA,IACxD,IAAQ,KACjB,WAAA,MAAiB;AACf,cAAM,IAAY,EAAU,QAAQ,IAAQ,CAAA;AAC5C,QAAI,MACF,EAAU,MAAA,GACV,EAAU,kBAAkB,GAAG,EAAU,MAAM,MAAA;AAAA,SAEhD,CAAA;AAAA;AAAA,KAKH,IAAmB,EAAA,CAAa,MAAoC;AACxE,eAAA,MAAiB,EAAE,OAAO,kBAAkB,GAAG,EAAE,OAAO,MAAM,MAAA,GAAS,CAAA;AAAA,KACtE,CAAA,CAAE;AACL,SACE,gBAAA,EAAA,GAAA,EAAA,UAAA,CACE,gBAAA,EAAC,OAAD;AAAA,IACE,WAAW,EAAM;AAAA,IACjB,OAAO;AAAA,MACL,KAAK,QAAQ,EAAS,KAAK,EAAM,IAAA,EAAM,OAAA;AAAA,MACvC,OAAO;AAAA,MACP,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,GAAG,EAAM;AAAA;IAEX,IAAI,EAAM;AAAA,IACV,KAAK;AAAA,IACL,QAAA,CAAS,MAAM;AACb,iBAAA,MAAiB;AACf,QAAI,EAAW,WAAW,CAAC,EAAW,QAAQ,SAAS,SAAS,aAAA,KAC9D,EAAM,SAAS,CAAA;AAAA,SAEhB,CAAA;AAAA;IAEL,SAAA,CAAU,MAAM;AACd,iBAAA,MAAiB;AACf,QAAI,EAAW,SAAS,SAAS,SAAS,aAAA,KACxC,EAAM,UAAU,CAAA;AAAA,SAEjB,CAAA;AAAA;cAGJ,EAAI,IAAA,CAAK,GAAO,MACf,gBAAA,EAAC,GAAD;AAAA,MACE,iBAAA;AAAA,MAEA,UAAU,IAAQ;AAAA,MAClB,KAAA,CAAM,MAAO;AACX,QAAA,EAAU,QAAQ,CAAA,IAAS;AAAA;MAE7B,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,WAAU;AAAA,MACV,WAAW;AAAA,MACX,OAAO;AAAA,MACP,SAAS;AAAA,MACT,SAAA,CAAU,MAAM,EAAY,GAAO,CAAA;AAAA,MACnC,UAAA,CAAW,MAAU,EAAa,GAAO,CAAA;AAAA,MACzC,WAAA,CAAY,MAAM,EAAc,GAAO,CAAA;AAAA,MACvC,OAAO,EAAM;AAAA,MACb,MAAM,EAAM;AAAA,MACZ,cAAc,EAAM;AAAA,MACpB,QAAQ,EAAM;AAAA,MACd,cAAc,EAAM;AAAA,MACpB,YAAY,EAAM;AAAA,MAClB,UAAU,EAAM;AAAA,MAChB,gBAAgB,EAAM;AAAA,OArBjB,CAAA,CAsBL;AAAA,GAEA,GACL,GAAO,OAAO,WACb,gBAAA,EAAC,GAAD;AAAA,IACE,MAAM,GAAO,MAAM,QAAQ,EAAM;AAAA,IACjC,cAAc;AAAA,MAAE,MAAM;AAAA,MAAQ,QAAQ;AAAA,MAAO,GAAG,GAAO,MAAM;AAAA;IAC7D,GAAI,EAAM;AAAA,GACV,CAAA,EAEH,CAAA"}

package/build/{pagination-ZXl2fVKZ.cjs → pagination-CzmrFLcs.cjs} RENAMED Viewed

@@ -1,3 +1,3 @@
-const q=require("./chunk-Dd8m0Ver.cjs"),f=require("./proxy-BDese6Pb.cjs"),m=require("./AnimatePresence-DeKd4Eek.cjs"),g=require("./component-CbJ_P8yq.cjs");require("./component-stack.cjs.js");const a=require("./button-6CFvwtSz.cjs");let t=require("react/jsx-runtime"),i=require("react");var I=e=>{const l=(0,i.useMemo)(()=>e.index===0&&!e.isInfinity,[e.index,e.isInfinity]),c=(0,i.useMemo)(()=>e.index===e.length-1&&!e.isInfinity,[e.index,e.isInfinity,e.length]),u=(0,i.useMemo)(()=>e.gap??12,[e.gap]),d=(0,i.useMemo)(()=>e.lengthData??{},[e.lengthData]),x=(0,i.useCallback)(()=>{e.index===0?e.isInfinity&&e.changeIndex(e.length-1):e.changeIndex(e.index-1)},[e.index,e.isInfinity,e.length,e.changeIndex]),s=(0,i.useCallback)(()=>{e.index===e.length-1?e.isInfinity&&e.changeIndex(0):e.changeIndex(e.index+1)},[e.index,e.isInfinity,e.length,e.changeIndex]),r=(0,i.useMemo)(()=>{const h=Math.floor(e.viewQuantity/2),n=Math.max(0,Math.min(e.index-h,e.length-e.viewQuantity)),o=Math.min(e.length,n+e.viewQuantity);return Array.from({length:o-n},(b,y)=>n+y)},[e.index,e.viewQuantity,e.length]);return(0,t.jsxs)(g.Stack,{className:e.className,style:{height:"fit-content",gap:`${u}px`,...e.style},children:[(0,t.jsx)(a.Button,{isDisabled:l,isHidden:l,onClick:x,...e.buttonControl,icons:[{type:"id",size:"large",name:"Arrow2",order:-1,turn:90}],children:!e.buttonControl.isWidthAsHeight&&e.locale.prev}),(0,t.jsx)(g.Stack,{sx:{width:"fit-content",height:"fit-content",display:"flex",gap:`${u}px`,alignItems:"center",justifyContent:"flex-start"},children:Array.from({length:e.length}).map((h,n)=>(0,t.jsx)(m.AnimatePresence,{mode:"popLayout",children:r.includes(n)&&(0,t.jsx)(f.motion.div,{layout:!0,initial:{opacity:0,scale:.95},animate:{opacity:1,scale:1},exit:{opacity:0,scale:.95,transition:{duration:.1,ease:"easeInOut"}},transition:{default:{duration:.1,ease:"easeOut"}},children:(0,t.jsx)(a.Button,{isWidthAsHeight:!0,...n===e.index?e.buttonCount.active:e.buttonCount.inactive,...d?.[n],onClick:()=>e.changeIndex(n),children:d?.[n]?.icons?.length?null:n+1})})},n))}),(0,t.jsx)(a.Button,{isDisabled:c,isHidden:c,onClick:s,...e.buttonControl,icons:[{type:"id",size:"large",name:"Arrow2",turn:-90}],children:!e.buttonControl.isWidthAsHeight&&e.locale.next})]})};Object.defineProperty(exports,"Pagination",{enumerable:!0,get:function(){return I}});
+const q=require("./chunk-Dd8m0Ver.cjs"),f=require("./proxy-BDese6Pb.cjs"),m=require("./AnimatePresence-DeKd4Eek.cjs"),g=require("./component-CbJ_P8yq.cjs");require("./component-stack.cjs.js");const a=require("./button-C1H35JQG.cjs");let t=require("react/jsx-runtime"),i=require("react");var I=e=>{const l=(0,i.useMemo)(()=>e.index===0&&!e.isInfinity,[e.index,e.isInfinity]),c=(0,i.useMemo)(()=>e.index===e.length-1&&!e.isInfinity,[e.index,e.isInfinity,e.length]),u=(0,i.useMemo)(()=>e.gap??12,[e.gap]),d=(0,i.useMemo)(()=>e.lengthData??{},[e.lengthData]),x=(0,i.useCallback)(()=>{e.index===0?e.isInfinity&&e.changeIndex(e.length-1):e.changeIndex(e.index-1)},[e.index,e.isInfinity,e.length,e.changeIndex]),s=(0,i.useCallback)(()=>{e.index===e.length-1?e.isInfinity&&e.changeIndex(0):e.changeIndex(e.index+1)},[e.index,e.isInfinity,e.length,e.changeIndex]),r=(0,i.useMemo)(()=>{const h=Math.floor(e.viewQuantity/2),n=Math.max(0,Math.min(e.index-h,e.length-e.viewQuantity)),o=Math.min(e.length,n+e.viewQuantity);return Array.from({length:o-n},(b,y)=>n+y)},[e.index,e.viewQuantity,e.length]);return(0,t.jsxs)(g.Stack,{className:e.className,style:{height:"fit-content",gap:`${u}px`,...e.style},children:[(0,t.jsx)(a.Button,{isDisabled:l,isHidden:l,onClick:x,...e.buttonControl,icons:[{type:"id",size:"large",name:"Arrow2",order:-1,turn:90}],children:!e.buttonControl.isWidthAsHeight&&e.locale.prev}),(0,t.jsx)(g.Stack,{sx:{width:"fit-content",height:"fit-content",display:"flex",gap:`${u}px`,alignItems:"center",justifyContent:"flex-start"},children:Array.from({length:e.length}).map((h,n)=>(0,t.jsx)(m.AnimatePresence,{mode:"popLayout",children:r.includes(n)&&(0,t.jsx)(f.motion.div,{layout:!0,initial:{opacity:0,scale:.95},animate:{opacity:1,scale:1},exit:{opacity:0,scale:.95,transition:{duration:.1,ease:"easeInOut"}},transition:{default:{duration:.1,ease:"easeOut"}},children:(0,t.jsx)(a.Button,{isWidthAsHeight:!0,...n===e.index?e.buttonCount.active:e.buttonCount.inactive,...d?.[n],onClick:()=>e.changeIndex(n),children:d?.[n]?.icons?.length?null:n+1})})},n))}),(0,t.jsx)(a.Button,{isDisabled:c,isHidden:c,onClick:s,...e.buttonControl,icons:[{type:"id",size:"large",name:"Arrow2",turn:-90}],children:!e.buttonControl.isWidthAsHeight&&e.locale.next})]})};Object.defineProperty(exports,"Pagination",{enumerable:!0,get:function(){return I}});
-//# sourceMappingURL=pagination-ZXl2fVKZ.cjs.map
+//# sourceMappingURL=pagination-CzmrFLcs.cjs.map

package/build/{pagination-ZXl2fVKZ.cjs.map → pagination-CzmrFLcs.cjs.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pagination-~~ZXl2fVKZ~~.cjs","names":[],"sources":["../src/components/pagination/component.tsx"],"sourcesContent":["import { Button } from '@local/components/button';\nimport { Stack } from '@local/components/stack';\n\nimport { AnimatePresence, motion } from 'framer-motion';\nimport { FC, useCallback, useMemo } from 'react';\n\nimport { DEFAULT_COMPONENT_PAGINATION_GAP } from './component.constants';\nimport { IPagination } from './component.types';\n\nexport const Pagination: FC<IPagination> = (props) => {\n const isDisabledPrevious = useMemo(() => props.index === 0 && !props.isInfinity, [props.index, props.isInfinity]);\n const isDisabledNext = useMemo(\n () => props.index === props.length - 1 && !props.isInfinity,\n [props.index, props.isInfinity, props.length],\n );\n\n const gap = useMemo(() => props.gap ?? DEFAULT_COMPONENT_PAGINATION_GAP, [props.gap]);\n const lengthData = useMemo(() => props.lengthData ?? {}, [props.lengthData]);\n const handlePrevious = useCallback(() => {\n if (props.index === 0) {\n if (props.isInfinity) {\n props.changeIndex(props.length - 1);\n }\n } else {\n props.changeIndex(props.index - 1);\n }\n }, [props.index, props.isInfinity, props.length, props.changeIndex]);\n\n const handleNext = useCallback(() => {\n if (props.index === props.length - 1) {\n if (props.isInfinity) {\n props.changeIndex(0);\n }\n } else {\n props.changeIndex(props.index + 1);\n }\n }, [props.index, props.isInfinity, props.length, props.changeIndex]);\n\n const visibleButtons = useMemo(() => {\n const half = Math.floor(props.viewQuantity / 2);\n const start = Math.max(0, Math.min(props.index - half, props.length - props.viewQuantity));\n const end = Math.min(props.length, start + props.viewQuantity);\n return Array.from({ length: end - start }, (_, i) => start + i);\n }, [props.index, props.viewQuantity, props.length]);\n\n return (\n <Stack\n className={props.className}\n style={{\n height: 'fit-content',\n gap: `${gap}px`,\n ...props.style,\n }}\n >\n <Button\n isDisabled={isDisabledPrevious}\n isHidden={isDisabledPrevious}\n onClick={handlePrevious}\n {...props.buttonControl}\n icons={[\n {\n type: 'id',\n size: 'large',\n name: 'Arrow2',\n order: -1,\n turn: 90,\n },\n ]}\n >\n {!props.buttonControl.isWidthAsHeight && props.locale.prev}\n </Button>\n\n <Stack\n sx={{\n width: 'fit-content',\n height: 'fit-content',\n display: 'flex',\n gap: `${gap}px`,\n alignItems: 'center',\n justifyContent: 'flex-start',\n }}\n >\n {Array.from({ length: props.length }).map((_, i) => {\n const isVisible = visibleButtons.includes(i);\n return (\n <AnimatePresence key={i} mode='popLayout'>\n {isVisible && (\n <motion.div\n layout\n initial={{ opacity: 0, scale: 0.95 }}\n animate={{ opacity: 1, scale: 1 }}\n exit={{ opacity: 0, scale: 0.95, transition: { duration: 0.1, ease: 'easeInOut' } }}\n transition={{\n default: { duration: 0.1, ease: 'easeOut' },\n }}\n >\n <Button\n isWidthAsHeight\n {...(i === props.index ? props.buttonCount.active : props.buttonCount.inactive)}\n {...lengthData?.[i]}\n onClick={() => props.changeIndex(i)}\n >\n {lengthData?.[i]?.icons?.length ? null : i + 1}\n </Button>\n </motion.div>\n )}\n </AnimatePresence>\n );\n })}\n </Stack>\n\n <Button\n isDisabled={isDisabledNext}\n isHidden={isDisabledNext}\n onClick={handleNext}\n {...props.buttonControl}\n icons={[\n {\n type: 'id',\n size: 'large',\n name: 'Arrow2',\n turn: -90,\n },\n ]}\n >\n {!props.buttonControl.isWidthAsHeight && props.locale.next}\n </Button>\n </Stack>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"pagination-CzmrFLcs.cjs","names":[],"sources":["../src/components/pagination/component.tsx"],"sourcesContent":["import { Button } from '@local/components/button';\nimport { Stack } from '@local/components/stack';\n\nimport { AnimatePresence, motion } from 'framer-motion';\nimport { FC, useCallback, useMemo } from 'react';\n\nimport { DEFAULT_COMPONENT_PAGINATION_GAP } from './component.constants';\nimport { IPagination } from './component.types';\n\nexport const Pagination: FC<IPagination> = (props) => {\n const isDisabledPrevious = useMemo(() => props.index === 0 && !props.isInfinity, [props.index, props.isInfinity]);\n const isDisabledNext = useMemo(\n () => props.index === props.length - 1 && !props.isInfinity,\n [props.index, props.isInfinity, props.length],\n );\n\n const gap = useMemo(() => props.gap ?? DEFAULT_COMPONENT_PAGINATION_GAP, [props.gap]);\n const lengthData = useMemo(() => props.lengthData ?? {}, [props.lengthData]);\n const handlePrevious = useCallback(() => {\n if (props.index === 0) {\n if (props.isInfinity) {\n props.changeIndex(props.length - 1);\n }\n } else {\n props.changeIndex(props.index - 1);\n }\n }, [props.index, props.isInfinity, props.length, props.changeIndex]);\n\n const handleNext = useCallback(() => {\n if (props.index === props.length - 1) {\n if (props.isInfinity) {\n props.changeIndex(0);\n }\n } else {\n props.changeIndex(props.index + 1);\n }\n }, [props.index, props.isInfinity, props.length, props.changeIndex]);\n\n const visibleButtons = useMemo(() => {\n const half = Math.floor(props.viewQuantity / 2);\n const start = Math.max(0, Math.min(props.index - half, props.length - props.viewQuantity));\n const end = Math.min(props.length, start + props.viewQuantity);\n return Array.from({ length: end - start }, (_, i) => start + i);\n }, [props.index, props.viewQuantity, props.length]);\n\n return (\n <Stack\n className={props.className}\n style={{\n height: 'fit-content',\n gap: `${gap}px`,\n ...props.style,\n }}\n >\n <Button\n isDisabled={isDisabledPrevious}\n isHidden={isDisabledPrevious}\n onClick={handlePrevious}\n {...props.buttonControl}\n icons={[\n {\n type: 'id',\n size: 'large',\n name: 'Arrow2',\n order: -1,\n turn: 90,\n },\n ]}\n >\n {!props.buttonControl.isWidthAsHeight && props.locale.prev}\n </Button>\n\n <Stack\n sx={{\n width: 'fit-content',\n height: 'fit-content',\n display: 'flex',\n gap: `${gap}px`,\n alignItems: 'center',\n justifyContent: 'flex-start',\n }}\n >\n {Array.from({ length: props.length }).map((_, i) => {\n const isVisible = visibleButtons.includes(i);\n return (\n <AnimatePresence key={i} mode='popLayout'>\n {isVisible && (\n <motion.div\n layout\n initial={{ opacity: 0, scale: 0.95 }}\n animate={{ opacity: 1, scale: 1 }}\n exit={{ opacity: 0, scale: 0.95, transition: { duration: 0.1, ease: 'easeInOut' } }}\n transition={{\n default: { duration: 0.1, ease: 'easeOut' },\n }}\n >\n <Button\n isWidthAsHeight\n {...(i === props.index ? props.buttonCount.active : props.buttonCount.inactive)}\n {...lengthData?.[i]}\n onClick={() => props.changeIndex(i)}\n >\n {lengthData?.[i]?.icons?.length ? null : i + 1}\n </Button>\n </motion.div>\n )}\n </AnimatePresence>\n );\n })}\n </Stack>\n\n <Button\n isDisabled={isDisabledNext}\n isHidden={isDisabledNext}\n onClick={handleNext}\n {...props.buttonControl}\n icons={[\n {\n type: 'id',\n size: 'large',\n name: 'Arrow2',\n turn: -90,\n },\n ]}\n >\n {!props.buttonControl.isWidthAsHeight && props.locale.next}\n </Button>\n </Stack>\n );\n};\n"],"mappings":"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"}

package/build/{pagination-BFTnpYCz.js → pagination-DWlnuh1H.js} RENAMED Viewed

@@ -2,7 +2,7 @@ import { t as I } from "./proxy-BFHkqO7P.js";
 import { t as b } from "./AnimatePresence-BWc2vFe-.js";
 import { t as u } from "./component-DGfyD5-u.js";
 import "./component-stack.es.js";
-import { t as a } from "./button-D6Bg00Uh.js";
+import { t as a } from "./button-9k2nzpqW.js";
 import { jsx as e, jsxs as v } from "react/jsx-runtime";
 import { useCallback as x, useMemo as i } from "react";
 var N = (t) => {
@@ -117,4 +117,4 @@ export {
   N as t
 };
-//# sourceMappingURL=pagination-BFTnpYCz.js.map
+//# sourceMappingURL=pagination-DWlnuh1H.js.map

package/build/{pagination-BFTnpYCz.js.map → pagination-DWlnuh1H.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pagination-~~BFTnpYCz~~.js","names":[],"sources":["../src/components/pagination/component.tsx"],"sourcesContent":["import { Button } from '@local/components/button';\nimport { Stack } from '@local/components/stack';\n\nimport { AnimatePresence, motion } from 'framer-motion';\nimport { FC, useCallback, useMemo } from 'react';\n\nimport { DEFAULT_COMPONENT_PAGINATION_GAP } from './component.constants';\nimport { IPagination } from './component.types';\n\nexport const Pagination: FC<IPagination> = (props) => {\n const isDisabledPrevious = useMemo(() => props.index === 0 && !props.isInfinity, [props.index, props.isInfinity]);\n const isDisabledNext = useMemo(\n () => props.index === props.length - 1 && !props.isInfinity,\n [props.index, props.isInfinity, props.length],\n );\n\n const gap = useMemo(() => props.gap ?? DEFAULT_COMPONENT_PAGINATION_GAP, [props.gap]);\n const lengthData = useMemo(() => props.lengthData ?? {}, [props.lengthData]);\n const handlePrevious = useCallback(() => {\n if (props.index === 0) {\n if (props.isInfinity) {\n props.changeIndex(props.length - 1);\n }\n } else {\n props.changeIndex(props.index - 1);\n }\n }, [props.index, props.isInfinity, props.length, props.changeIndex]);\n\n const handleNext = useCallback(() => {\n if (props.index === props.length - 1) {\n if (props.isInfinity) {\n props.changeIndex(0);\n }\n } else {\n props.changeIndex(props.index + 1);\n }\n }, [props.index, props.isInfinity, props.length, props.changeIndex]);\n\n const visibleButtons = useMemo(() => {\n const half = Math.floor(props.viewQuantity / 2);\n const start = Math.max(0, Math.min(props.index - half, props.length - props.viewQuantity));\n const end = Math.min(props.length, start + props.viewQuantity);\n return Array.from({ length: end - start }, (_, i) => start + i);\n }, [props.index, props.viewQuantity, props.length]);\n\n return (\n <Stack\n className={props.className}\n style={{\n height: 'fit-content',\n gap: `${gap}px`,\n ...props.style,\n }}\n >\n <Button\n isDisabled={isDisabledPrevious}\n isHidden={isDisabledPrevious}\n onClick={handlePrevious}\n {...props.buttonControl}\n icons={[\n {\n type: 'id',\n size: 'large',\n name: 'Arrow2',\n order: -1,\n turn: 90,\n },\n ]}\n >\n {!props.buttonControl.isWidthAsHeight && props.locale.prev}\n </Button>\n\n <Stack\n sx={{\n width: 'fit-content',\n height: 'fit-content',\n display: 'flex',\n gap: `${gap}px`,\n alignItems: 'center',\n justifyContent: 'flex-start',\n }}\n >\n {Array.from({ length: props.length }).map((_, i) => {\n const isVisible = visibleButtons.includes(i);\n return (\n <AnimatePresence key={i} mode='popLayout'>\n {isVisible && (\n <motion.div\n layout\n initial={{ opacity: 0, scale: 0.95 }}\n animate={{ opacity: 1, scale: 1 }}\n exit={{ opacity: 0, scale: 0.95, transition: { duration: 0.1, ease: 'easeInOut' } }}\n transition={{\n default: { duration: 0.1, ease: 'easeOut' },\n }}\n >\n <Button\n isWidthAsHeight\n {...(i === props.index ? props.buttonCount.active : props.buttonCount.inactive)}\n {...lengthData?.[i]}\n onClick={() => props.changeIndex(i)}\n >\n {lengthData?.[i]?.icons?.length ? null : i + 1}\n </Button>\n </motion.div>\n )}\n </AnimatePresence>\n );\n })}\n </Stack>\n\n <Button\n isDisabled={isDisabledNext}\n isHidden={isDisabledNext}\n onClick={handleNext}\n {...props.buttonControl}\n icons={[\n {\n type: 'id',\n size: 'large',\n name: 'Arrow2',\n turn: -90,\n },\n ]}\n >\n {!props.buttonControl.isWidthAsHeight && props.locale.next}\n </Button>\n </Stack>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"pagination-DWlnuh1H.js","names":[],"sources":["../src/components/pagination/component.tsx"],"sourcesContent":["import { Button } from '@local/components/button';\nimport { Stack } from '@local/components/stack';\n\nimport { AnimatePresence, motion } from 'framer-motion';\nimport { FC, useCallback, useMemo } from 'react';\n\nimport { DEFAULT_COMPONENT_PAGINATION_GAP } from './component.constants';\nimport { IPagination } from './component.types';\n\nexport const Pagination: FC<IPagination> = (props) => {\n const isDisabledPrevious = useMemo(() => props.index === 0 && !props.isInfinity, [props.index, props.isInfinity]);\n const isDisabledNext = useMemo(\n () => props.index === props.length - 1 && !props.isInfinity,\n [props.index, props.isInfinity, props.length],\n );\n\n const gap = useMemo(() => props.gap ?? DEFAULT_COMPONENT_PAGINATION_GAP, [props.gap]);\n const lengthData = useMemo(() => props.lengthData ?? {}, [props.lengthData]);\n const handlePrevious = useCallback(() => {\n if (props.index === 0) {\n if (props.isInfinity) {\n props.changeIndex(props.length - 1);\n }\n } else {\n props.changeIndex(props.index - 1);\n }\n }, [props.index, props.isInfinity, props.length, props.changeIndex]);\n\n const handleNext = useCallback(() => {\n if (props.index === props.length - 1) {\n if (props.isInfinity) {\n props.changeIndex(0);\n }\n } else {\n props.changeIndex(props.index + 1);\n }\n }, [props.index, props.isInfinity, props.length, props.changeIndex]);\n\n const visibleButtons = useMemo(() => {\n const half = Math.floor(props.viewQuantity / 2);\n const start = Math.max(0, Math.min(props.index - half, props.length - props.viewQuantity));\n const end = Math.min(props.length, start + props.viewQuantity);\n return Array.from({ length: end - start }, (_, i) => start + i);\n }, [props.index, props.viewQuantity, props.length]);\n\n return (\n <Stack\n className={props.className}\n style={{\n height: 'fit-content',\n gap: `${gap}px`,\n ...props.style,\n }}\n >\n <Button\n isDisabled={isDisabledPrevious}\n isHidden={isDisabledPrevious}\n onClick={handlePrevious}\n {...props.buttonControl}\n icons={[\n {\n type: 'id',\n size: 'large',\n name: 'Arrow2',\n order: -1,\n turn: 90,\n },\n ]}\n >\n {!props.buttonControl.isWidthAsHeight && props.locale.prev}\n </Button>\n\n <Stack\n sx={{\n width: 'fit-content',\n height: 'fit-content',\n display: 'flex',\n gap: `${gap}px`,\n alignItems: 'center',\n justifyContent: 'flex-start',\n }}\n >\n {Array.from({ length: props.length }).map((_, i) => {\n const isVisible = visibleButtons.includes(i);\n return (\n <AnimatePresence key={i} mode='popLayout'>\n {isVisible && (\n <motion.div\n layout\n initial={{ opacity: 0, scale: 0.95 }}\n animate={{ opacity: 1, scale: 1 }}\n exit={{ opacity: 0, scale: 0.95, transition: { duration: 0.1, ease: 'easeInOut' } }}\n transition={{\n default: { duration: 0.1, ease: 'easeOut' },\n }}\n >\n <Button\n isWidthAsHeight\n {...(i === props.index ? props.buttonCount.active : props.buttonCount.inactive)}\n {...lengthData?.[i]}\n onClick={() => props.changeIndex(i)}\n >\n {lengthData?.[i]?.icons?.length ? null : i + 1}\n </Button>\n </motion.div>\n )}\n </AnimatePresence>\n );\n })}\n </Stack>\n\n <Button\n isDisabled={isDisabledNext}\n isHidden={isDisabledNext}\n onClick={handleNext}\n {...props.buttonControl}\n icons={[\n {\n type: 'id',\n size: 'large',\n name: 'Arrow2',\n turn: -90,\n },\n ]}\n >\n {!props.buttonControl.isWidthAsHeight && props.locale.next}\n </Button>\n </Stack>\n );\n};\n"],"mappings":"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"}

package/build/{select-BdGRG7zf.js → select-Bn-24dwy.js} RENAMED Viewed

@@ -4,10 +4,10 @@ import { n as De, t as _e } from "./functions-DzX-pTN8.js";
 import { r as Ft } from "./icon-Y-IZxLXB.js";
 import { useMergeRefs as ws } from "./hooks-use-merge-refs.es.js";
 import { useTypographyStyles as zn } from "./hooks-use-typography-styles.es.js";
-import { t as Nt } from "./button-D6Bg00Uh.js";
+import { t as Nt } from "./button-9k2nzpqW.js";
 import { t as Hn } from "./error-iaB6e_aq.js";
 import { n as Un, t as Vn } from "./popover--NOw9qfd.js";
-import { t as jn } from "./textarea-DLZq4RT-.js";
+import { t as jn } from "./textarea-BW_LYAhr.js";
 import { t as qe } from "./typography-Tebu6c9L.js";
 import { Fragment as Gn, jsx as L, jsxs as ye } from "react/jsx-runtime";
 import * as ht from "react";
@@ -3441,4 +3441,4 @@ export {
   Eo as t
 };
-//# sourceMappingURL=select-BdGRG7zf.js.map
+//# sourceMappingURL=select-Bn-24dwy.js.map