@intlayer/design-system 8.2.4 → 8.3.0-canary.0

package/dist/esm/components/Input/InputPassword.mjs

@@ -1,2 +1,2 @@
-"use client";import{Input as e}from"./Input.mjs";import{EyeIcon as t,EyeOffIcon as n}from"lucide-react";import{useState as r}from"react";import{jsx as i,jsxs as a}from"react/jsx-runtime";const o=o=>{let[s,c]=r(!1),l=e=>{e.preventDefault(),e.stopPropagation(),c(e=>!e)},u=s?t:n;return a(`div`,{className:`relative`,children:[i(e,{...o,"aria-label":`password`,type:s?`text`:`password`}),i(`button`,{"data-testid":`eye-icon`,type:`button`,className:`absolute right-2 h-full flex-row items-center`,onClick:l,"aria-label":s?`Hide password`:`Show password`,children:i(u,{className:`mr-2 inline-block cursor-pointer text-neutral`,size:20})})]})};export{o as InputPassword};
+"use client";import{Input as e}from"./Input.mjs";import{useState as t}from"react";import{EyeIcon as n,EyeOffIcon as r}from"lucide-react";import{jsx as i,jsxs as a}from"react/jsx-runtime";const o=o=>{let[s,c]=t(!1),l=e=>{e.preventDefault(),e.stopPropagation(),c(e=>!e)},u=s?n:r;return a(`div`,{className:`relative`,children:[i(e,{...o,"aria-label":`password`,type:s?`text`:`password`}),i(`button`,{"data-testid":`eye-icon`,type:`button`,className:`absolute right-2 h-full flex-row items-center`,onClick:l,"aria-label":s?`Hide password`:`Show password`,children:i(u,{className:`mr-2 inline-block cursor-pointer text-neutral`,size:20})})]})};export{o as InputPassword};
 //# sourceMappingURL=InputPassword.mjs.map

package/dist/esm/components/Input/OTPInput.mjs

@@ -1,4 +1,4 @@
-"use client";import{cn as e}from"../../utils/cn.mjs";import{Button as t}from"../Button/Button.mjs";import{MinusIcon as n}from"lucide-react";import{createContext as r,useContext as i,useEffect as a,useRef as o,useState as s}from"react";import{cva as c}from"class-variance-authority";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";const f=e=>[setTimeout(e,0),setTimeout(e,10),setTimeout(e,50)],p=(e,t)=>{try{e.insertRule(t)}catch{console.error(`input-otp could not insert CSS rule:`,t)}},m=[`[data-lastpass-icon-root]`,`com-1password-button`,`[data-dashlanecreated]`,`[style$="2147483647 !important;"]`].join(`,`),h=({containerRef:e,inputRef:t,pushPasswordManagerStrategy:n,isFocused:r})=>{let[i,o]=s(!1),[c,l]=s(!1),[u,d]=s(!1),f=n===`none`?!1:(n===`increase-width`||n===`experimental-no-flickering`)&&i&&c,p=()=>{let r=e.current,i=t.current;if(!r||!i||u||n===`none`)return;let a=r,s=a.getBoundingClientRect().left+a.offsetWidth,c=a.getBoundingClientRect().top+a.offsetHeight/2,l=s-18,f=c;document.querySelectorAll(m).length===0&&document.elementFromPoint(l,f)===r||(o(!0),d(!0))};return a(()=>{let t=e.current;if(!t||n===`none`)return;let r=()=>{l(window.innerWidth-t.getBoundingClientRect().right>=40)};r();let i=setInterval(r,1e3);return()=>{clearInterval(i)}},[e,n]),a(()=>{let e=r||document.activeElement===t.current;if(n===`none`||!e)return;let i=setTimeout(p,0),a=setTimeout(p,2e3),o=setTimeout(p,5e3),s=setTimeout(()=>{d(!0)},6e3);return()=>{clearTimeout(i),clearTimeout(a),clearTimeout(o),clearTimeout(s)}},[t,r,n]),{hasPWMBadge:i,willPushPWMBadge:f,PWM_BADGE_SPACE_WIDTH:`40px`}},g=e=>{let t=o(void 0);return a(()=>{t.current=e}),t.current},_=r({}),v=({value:t,onChange:n,maxLength:r,pattern:i,placeholder:c,inputMode:m=`numeric`,onComplete:v,onActiveSlotChange:y,pushPasswordManagerStrategy:b=`increase-width`,pasteTransformer:x,containerClassName:S,noScriptCSSFallback:C=`
+"use client";import{cn as e}from"../../utils/cn.mjs";import{Button as t}from"../Button/Button.mjs";import{createContext as n,useContext as r,useEffect as i,useRef as a,useState as o}from"react";import{cva as s}from"class-variance-authority";import{MinusIcon as c}from"lucide-react";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";const f=e=>[setTimeout(e,0),setTimeout(e,10),setTimeout(e,50)],p=(e,t)=>{try{e.insertRule(t)}catch{console.error(`input-otp could not insert CSS rule:`,t)}},m=[`[data-lastpass-icon-root]`,`com-1password-button`,`[data-dashlanecreated]`,`[style$="2147483647 !important;"]`].join(`,`),h=({containerRef:e,inputRef:t,pushPasswordManagerStrategy:n,isFocused:r})=>{let[a,s]=o(!1),[c,l]=o(!1),[u,d]=o(!1),f=n===`none`?!1:(n===`increase-width`||n===`experimental-no-flickering`)&&a&&c,p=()=>{let r=e.current,i=t.current;if(!r||!i||u||n===`none`)return;let a=r,o=a.getBoundingClientRect().left+a.offsetWidth,c=a.getBoundingClientRect().top+a.offsetHeight/2,l=o-18,f=c;document.querySelectorAll(m).length===0&&document.elementFromPoint(l,f)===r||(s(!0),d(!0))};return i(()=>{let t=e.current;if(!t||n===`none`)return;let r=()=>{l(window.innerWidth-t.getBoundingClientRect().right>=40)};r();let i=setInterval(r,1e3);return()=>{clearInterval(i)}},[e,n]),i(()=>{let e=r||document.activeElement===t.current;if(n===`none`||!e)return;let i=setTimeout(p,0),a=setTimeout(p,2e3),o=setTimeout(p,5e3),s=setTimeout(()=>{d(!0)},6e3);return()=>{clearTimeout(i),clearTimeout(a),clearTimeout(o),clearTimeout(s)}},[t,r,n]),{hasPWMBadge:a,willPushPWMBadge:f,PWM_BADGE_SPACE_WIDTH:`40px`}},g=e=>{let t=a(void 0);return i(()=>{t.current=e}),t.current},_=n({}),v=({value:t,onChange:n,maxLength:r,pattern:s,placeholder:c,inputMode:m=`numeric`,onComplete:v,onActiveSlotChange:y,pushPasswordManagerStrategy:b=`increase-width`,pasteTransformer:x,containerClassName:S,noScriptCSSFallback:C=`
 [data-input-otp] {
   --nojs-bg: white !important;
   --nojs-fg: black !important;
@@ -17,5 +17,5 @@
     --nojs-bg: black !important;
     --nojs-fg: white !important;
   }
-}`,render:w,children:T,...E})=>{let[D,ee]=s(typeof E.defaultValue==`string`?E.defaultValue:``),O=t??D,k=g(O),A=e=>{n?.(e),ee(e)},j=i===void 0?null:typeof i==`string`?new RegExp(i):i,M=o(null),N=o(null),P=o({value:O,onChange:A,isIOS:typeof window<`u`&&window?.CSS?.supports?.(`-webkit-touch-callout`,`none`)}),F=o({prev:[M.current?.selectionStart??null,M.current?.selectionEnd??null,M.current?.selectionDirection??`none`]});a(()=>{let e=M.current,t=N.current;if(!e||!t)return;P.current.value!==e.value&&P.current.onChange(e.value),F.current.prev=[e.selectionStart,e.selectionEnd,e.selectionDirection??`none`];let n=()=>{if(document.activeElement!==e){V(null),U(null),G(null);return}let t=e.selectionStart,n=e.selectionEnd,r=e.selectionDirection,i=e.maxLength,a=e.value,o=F.current.prev,s=-1,c=-1,l=r??`none`;if(a.length!==0&&t!==null&&n!==null){let e=t===n,r=t===a.length&&a.length<i;if(e&&!r){let e=t;if(e===0)s=0,c=1,l=`forward`;else if(e===i)s=e-1,c=e,l=`backward`;else if(i>1&&a.length>1){let t=0;if(o[0]!==null&&o[1]!==null){l=e<o[1]?`backward`:`forward`;let n=o[0]===o[1]&&o[0]<i;l===`backward`&&!n&&(t=-1)}s=t+e,c=t+e+1}}s!==-1&&c!==-1&&s!==c&&M.current?.setSelectionRange(s,c,l)}let u=s===-1?t:s,d=c===-1?n:c,f=l;G(t!==null&&n!==null?t===n?t:u:null),V(u),U(d),F.current.prev=[u,d,f]};if(document.addEventListener(`selectionchange`,n,{capture:!0}),n(),document.activeElement===e&&z(!0),!document.getElementById(`input-otp-style`)){let e=document.createElement(`style`);if(e.id=`input-otp-style`,document.head.appendChild(e),e.sheet){let t=`background: transparent !important; color: transparent !important; border-color: transparent !important; opacity: 0 !important; box-shadow: none !important; -webkit-box-shadow: none !important; -webkit-text-fill-color: transparent !important;`;p(e.sheet,`[data-input-otp]::selection { background: transparent !important; color: transparent !important; }`),p(e.sheet,`[data-input-otp]:autofill { ${t} }`),p(e.sheet,`[data-input-otp]:-webkit-autofill { ${t} }`),p(e.sheet,`@supports (-webkit-touch-callout: none) { [data-input-otp] { letter-spacing: -.6em !important; font-weight: 100 !important; font-stretch: ultra-condensed; font-optical-sizing: none !important; left: -1px !important; right: 1px !important; } }`),p(e.sheet,`[data-input-otp] + * { pointer-events: all !important; }`)}}let r=()=>{t&&t.style.setProperty(`--root-height`,`${e.clientHeight}px`)};r();let i=new ResizeObserver(r);return i.observe(e),()=>{document.removeEventListener(`selectionchange`,n,{capture:!0}),i.disconnect()}},[]);let[I,L]=s(!1),[R,z]=s(!1),[B,V]=s(null),[H,U]=s(null),[W,G]=s(null);a(()=>{f(()=>{M.current?.dispatchEvent(new Event(`input`));let e=M.current?.selectionStart??null,t=M.current?.selectionEnd??null,n=M.current?.selectionDirection??`none`;e!==null&&t!==null&&(V(e),U(t),G(e),F.current.prev=[e,t,n])})},[O,R]),a(()=>{k!==void 0&&O!==k&&k.length<r&&O.length===r&&v?.(O)},[r,v,k,O]);let K=o(null);a(()=>{let e=R&&W!==null?W:null;e!==K.current&&(K.current=e,y?.(e))},[R,W,y]);let q=h({containerRef:N,inputRef:M,pushPasswordManagerStrategy:b,isFocused:R}),J=e=>{let t=e.currentTarget.value.slice(0,r);if(t.length>0&&j&&!j.test(t)){e.preventDefault();return}typeof k==`string`&&t.length<k.length&&document.dispatchEvent(new Event(`selectionchange`)),A(t)},Y=()=>{if(M.current){let e=Math.min(M.current.value.length,r-1),t=M.current.value.length;M.current?.setSelectionRange(e,t),V(e),U(t)}z(!0)},X=e=>{let t=M.current;if(!x&&(!P.current.isIOS||!e.clipboardData||!t))return;let n=e.clipboardData.getData(`text/plain`),i=x?x(n):n;e.preventDefault();let a=M.current?.selectionStart,o=M.current?.selectionEnd,s=(a===o?O.slice(0,a??0)+i+O.slice(a??0):O.slice(0,a??0)+i+O.slice(o??0)).slice(0,r);if(!(s.length>0&&j&&!j.test(s))&&t){t.value=s,A(s);let e=Math.min(s.length,r-1),n=s.length;t.setSelectionRange(e,n),V(e),U(n)}},Z={width:q.willPushPWMBadge?`calc(100% + ${q.PWM_BADGE_SPACE_WIDTH})`:`100%`,clipPath:q.willPushPWMBadge?`inset(0 ${q.PWM_BADGE_SPACE_WIDTH} 0 0)`:void 0,fontSize:`var(--root-height)`},Q=u(`input`,{autoComplete:E.autoComplete||`one-time-code`,...E,"data-input-otp":!0,"data-input-otp-placeholder-shown":O.length===0||void 0,"data-input-otp-mss":B,"data-input-otp-mse":H,inputMode:m,pattern:j?.source,"aria-placeholder":c,className:`pointer-events-auto absolute inset-0 -z-10 flex h-full border-0 border-transparent bg-transparent text-center font-mono text-transparent tabular-nums leading-none tracking-[-.5em] caret-transparent opacity-100 shadow-none outline-none`,style:Z,maxLength:r,value:O,ref:M,onPaste:e=>{X(e),E.onPaste?.(e)},onChange:J,onMouseOver:e=>{L(!0),E.onMouseOver?.(e)},onMouseLeave:e=>{L(!1),E.onMouseLeave?.(e)},onKeyDown:e=>{(e.key===`ArrowLeft`||e.key===`ArrowRight`)&&requestAnimationFrame(()=>{let e=M.current;if(e&&document.activeElement===e){let t=e.selectionStart,n=e.selectionEnd;t!==null&&n!==null&&G(t)}}),E.onKeyDown?.(e)},onFocus:e=>{Y(),E.onFocus?.(e)},onBlur:e=>{z(!1),E.onBlur?.(e)}}),$={slots:Array.from({length:r}).map((e,t)=>{let n=R&&B!==null&&H!==null&&(B===H&&t===B||t>=B&&t<H),r=O[t]===void 0?null:O[t];return{char:r,placeholderChar:O[0]===void 0?c?.[t]??null:null,isActive:n,hasFakeCaret:n&&r===null}}),isFocused:R,isHovering:!E.disabled&&I,setSelection:e=>{let t=M.current;if(!t||E.disabled)return;let n=Math.max(0,Math.min(e,r-1));document.activeElement!==t&&t.focus();let i=O[n]!==void 0,a=n,o=i?n+1:n;t.setSelectionRange(a,o),V(a),U(o),z(!0)}},te=w===void 0?u(_.Provider,{value:$,children:T}):w($);return d(l,{children:[C!==null&&u(`noscript`,{children:u(`style`,{children:C})}),d(`div`,{ref:N,className:e(`relative`,E.disabled?`cursor-default`:`cursor-text`,S),children:[te,u(`div`,{className:`absolute inset-0`,children:Q})]})]})},y=c(`block text-center`,{variants:{size:{sm:`h-4 w-3 text-sm`,md:`h-5 w-4 text-base`,lg:`h-6 w-5 text-lg`,xl:`h-7 w-6 text-xl`}},defaultVariants:{size:`md`}}),b=({className:t,render:n,...r})=>u(v,{containerClassName:`relative flex items-center gap-2 has-disabled:opacity-50`,className:e(`disabled:cursor-not-allowed`,t),render:n,...r}),x=({className:t,...n})=>u(`div`,{className:e(`z-10 flex items-center gap-3`,t),...n}),S=({index:n,className:r,onClick:a,onKeyDown:o,...s})=>{let c=i(_),{char:l,isActive:d}=c?.slots[n]??{},{setSelection:f}=c??{};return u(t,{isSelected:d,variant:`input`,color:`custom`,tabIndex:-1,className:e(`relative z-10 px-2!`,d&&`ring-4!`,r),onClick:e=>{f?.(n),a?.(e)},onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),f?.(n)),o?.(e)},label:null,...s,children:u(`span`,{className:`relative z-10 flex h-6 w-4 items-center justify-center`,children:l})})},C=e=>u(`div`,{"aria-hidden":!0,className:`z-0 table h-0.5 w-3 rounded-full bg-border text-text/50`,...e,children:u(n,{})}),w=e=>u(`div`,{"data-indicator":!0,className:`absolute top-0 z-0 h-full w-auto rounded-xl bg-text/20 ring-4 ring-text/20 transition-[left,width] duration-300 ease-in-out [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl motion-reduce:transition-none`,...e});export{w as InputIndicator,b as InputOTP,x as InputOTPGroup,C as InputOTPSeparator,S as InputOTPSlot,v as OTPInput,_ as OTPInputContext,y as inputSlotVariants,h as usePasswordManagerBadge,g as usePrevious};
+}`,render:w,children:T,...E})=>{let[D,ee]=o(typeof E.defaultValue==`string`?E.defaultValue:``),O=t??D,k=g(O),A=e=>{n?.(e),ee(e)},j=s===void 0?null:typeof s==`string`?new RegExp(s):s,M=a(null),N=a(null),P=a({value:O,onChange:A,isIOS:typeof window<`u`&&window?.CSS?.supports?.(`-webkit-touch-callout`,`none`)}),F=a({prev:[M.current?.selectionStart??null,M.current?.selectionEnd??null,M.current?.selectionDirection??`none`]});i(()=>{let e=M.current,t=N.current;if(!e||!t)return;P.current.value!==e.value&&P.current.onChange(e.value),F.current.prev=[e.selectionStart,e.selectionEnd,e.selectionDirection??`none`];let n=()=>{if(document.activeElement!==e){V(null),U(null),G(null);return}let t=e.selectionStart,n=e.selectionEnd,r=e.selectionDirection,i=e.maxLength,a=e.value,o=F.current.prev,s=-1,c=-1,l=r??`none`;if(a.length!==0&&t!==null&&n!==null){let e=t===n,r=t===a.length&&a.length<i;if(e&&!r){let e=t;if(e===0)s=0,c=1,l=`forward`;else if(e===i)s=e-1,c=e,l=`backward`;else if(i>1&&a.length>1){let t=0;if(o[0]!==null&&o[1]!==null){l=e<o[1]?`backward`:`forward`;let n=o[0]===o[1]&&o[0]<i;l===`backward`&&!n&&(t=-1)}s=t+e,c=t+e+1}}s!==-1&&c!==-1&&s!==c&&M.current?.setSelectionRange(s,c,l)}let u=s===-1?t:s,d=c===-1?n:c,f=l;G(t!==null&&n!==null?t===n?t:u:null),V(u),U(d),F.current.prev=[u,d,f]};if(document.addEventListener(`selectionchange`,n,{capture:!0}),n(),document.activeElement===e&&z(!0),!document.getElementById(`input-otp-style`)){let e=document.createElement(`style`);if(e.id=`input-otp-style`,document.head.appendChild(e),e.sheet){let t=`background: transparent !important; color: transparent !important; border-color: transparent !important; opacity: 0 !important; box-shadow: none !important; -webkit-box-shadow: none !important; -webkit-text-fill-color: transparent !important;`;p(e.sheet,`[data-input-otp]::selection { background: transparent !important; color: transparent !important; }`),p(e.sheet,`[data-input-otp]:autofill { ${t} }`),p(e.sheet,`[data-input-otp]:-webkit-autofill { ${t} }`),p(e.sheet,`@supports (-webkit-touch-callout: none) { [data-input-otp] { letter-spacing: -.6em !important; font-weight: 100 !important; font-stretch: ultra-condensed; font-optical-sizing: none !important; left: -1px !important; right: 1px !important; } }`),p(e.sheet,`[data-input-otp] + * { pointer-events: all !important; }`)}}let r=()=>{t&&t.style.setProperty(`--root-height`,`${e.clientHeight}px`)};r();let i=new ResizeObserver(r);return i.observe(e),()=>{document.removeEventListener(`selectionchange`,n,{capture:!0}),i.disconnect()}},[]);let[I,L]=o(!1),[R,z]=o(!1),[B,V]=o(null),[H,U]=o(null),[W,G]=o(null);i(()=>{f(()=>{M.current?.dispatchEvent(new Event(`input`));let e=M.current?.selectionStart??null,t=M.current?.selectionEnd??null,n=M.current?.selectionDirection??`none`;e!==null&&t!==null&&(V(e),U(t),G(e),F.current.prev=[e,t,n])})},[O,R]),i(()=>{k!==void 0&&O!==k&&k.length<r&&O.length===r&&v?.(O)},[r,v,k,O]);let K=a(null);i(()=>{let e=R&&W!==null?W:null;e!==K.current&&(K.current=e,y?.(e))},[R,W,y]);let q=h({containerRef:N,inputRef:M,pushPasswordManagerStrategy:b,isFocused:R}),J=e=>{let t=e.currentTarget.value.slice(0,r);if(t.length>0&&j&&!j.test(t)){e.preventDefault();return}typeof k==`string`&&t.length<k.length&&document.dispatchEvent(new Event(`selectionchange`)),A(t)},Y=()=>{if(M.current){let e=Math.min(M.current.value.length,r-1),t=M.current.value.length;M.current?.setSelectionRange(e,t),V(e),U(t)}z(!0)},X=e=>{let t=M.current;if(!x&&(!P.current.isIOS||!e.clipboardData||!t))return;let n=e.clipboardData.getData(`text/plain`),i=x?x(n):n;e.preventDefault();let a=M.current?.selectionStart,o=M.current?.selectionEnd,s=(a===o?O.slice(0,a??0)+i+O.slice(a??0):O.slice(0,a??0)+i+O.slice(o??0)).slice(0,r);if(!(s.length>0&&j&&!j.test(s))&&t){t.value=s,A(s);let e=Math.min(s.length,r-1),n=s.length;t.setSelectionRange(e,n),V(e),U(n)}},Z={width:q.willPushPWMBadge?`calc(100% + ${q.PWM_BADGE_SPACE_WIDTH})`:`100%`,clipPath:q.willPushPWMBadge?`inset(0 ${q.PWM_BADGE_SPACE_WIDTH} 0 0)`:void 0,fontSize:`var(--root-height)`},Q=u(`input`,{autoComplete:E.autoComplete||`one-time-code`,...E,"data-input-otp":!0,"data-input-otp-placeholder-shown":O.length===0||void 0,"data-input-otp-mss":B,"data-input-otp-mse":H,inputMode:m,pattern:j?.source,"aria-placeholder":c,className:`pointer-events-auto absolute inset-0 -z-10 flex h-full border-0 border-transparent bg-transparent text-center font-mono text-transparent tabular-nums leading-none tracking-[-.5em] caret-transparent opacity-100 shadow-none outline-none`,style:Z,maxLength:r,value:O,ref:M,onPaste:e=>{X(e),E.onPaste?.(e)},onChange:J,onMouseOver:e=>{L(!0),E.onMouseOver?.(e)},onMouseLeave:e=>{L(!1),E.onMouseLeave?.(e)},onKeyDown:e=>{(e.key===`ArrowLeft`||e.key===`ArrowRight`)&&requestAnimationFrame(()=>{let e=M.current;if(e&&document.activeElement===e){let t=e.selectionStart,n=e.selectionEnd;t!==null&&n!==null&&G(t)}}),E.onKeyDown?.(e)},onFocus:e=>{Y(),E.onFocus?.(e)},onBlur:e=>{z(!1),E.onBlur?.(e)}}),$={slots:Array.from({length:r}).map((e,t)=>{let n=R&&B!==null&&H!==null&&(B===H&&t===B||t>=B&&t<H),r=O[t]===void 0?null:O[t];return{char:r,placeholderChar:O[0]===void 0?c?.[t]??null:null,isActive:n,hasFakeCaret:n&&r===null}}),isFocused:R,isHovering:!E.disabled&&I,setSelection:e=>{let t=M.current;if(!t||E.disabled)return;let n=Math.max(0,Math.min(e,r-1));document.activeElement!==t&&t.focus();let i=O[n]!==void 0,a=n,o=i?n+1:n;t.setSelectionRange(a,o),V(a),U(o),z(!0)}},te=w===void 0?u(_.Provider,{value:$,children:T}):w($);return d(l,{children:[C!==null&&u(`noscript`,{children:u(`style`,{children:C})}),d(`div`,{ref:N,className:e(`relative`,E.disabled?`cursor-default`:`cursor-text`,S),children:[te,u(`div`,{className:`absolute inset-0`,children:Q})]})]})},y=s(`block text-center`,{variants:{size:{sm:`h-4 w-3 text-sm`,md:`h-5 w-4 text-base`,lg:`h-6 w-5 text-lg`,xl:`h-7 w-6 text-xl`}},defaultVariants:{size:`md`}}),b=({className:t,render:n,...r})=>u(v,{containerClassName:`relative flex items-center gap-2 has-disabled:opacity-50`,className:e(`disabled:cursor-not-allowed`,t),render:n,...r}),x=({className:t,...n})=>u(`div`,{className:e(`z-10 flex items-center gap-3`,t),...n}),S=({index:n,className:i,onClick:a,onKeyDown:o,...s})=>{let c=r(_),{char:l,isActive:d}=c?.slots[n]??{},{setSelection:f}=c??{};return u(t,{isSelected:d,variant:`input`,color:`custom`,tabIndex:-1,className:e(`relative z-10 px-2!`,d&&`ring-4!`,i),onClick:e=>{f?.(n),a?.(e)},onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),f?.(n)),o?.(e)},label:null,...s,children:u(`span`,{className:`relative z-10 flex h-6 w-4 items-center justify-center`,children:l})})},C=e=>u(`div`,{"aria-hidden":!0,className:`z-0 table h-0.5 w-3 rounded-full bg-border text-text/50`,...e,children:u(c,{})}),w=e=>u(`div`,{"data-indicator":!0,className:`absolute top-0 z-0 h-full w-auto rounded-xl bg-text/20 ring-4 ring-text/20 transition-[left,width] duration-300 ease-in-out [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl motion-reduce:transition-none`,...e});export{w as InputIndicator,b as InputOTP,x as InputOTPGroup,C as InputOTPSeparator,S as InputOTPSlot,v as OTPInput,_ as OTPInputContext,y as inputSlotVariants,h as usePasswordManagerBadge,g as usePrevious};
 //# sourceMappingURL=OTPInput.mjs.map

package/dist/esm/components/LanguageBackground/index.mjs

@@ -1,2 +1,2 @@
-"use client";import{cn as e}from"../../utils/cn.mjs";import{Container as t}from"../Container/index.mjs";import{Flag as n}from"../Flags/Flag.mjs";import{useEffect as r,useState as i}from"react";import{Fragment as a,jsx as o,jsxs as s}from"react/jsx-runtime";import{Locales as c,getHTMLTextDir as l,getLocaleName as u}from"intlayer";const d=(e,t)=>{let n=[...e];for(let e=n.length-1;e>0;e--){let t=Math.floor(Math.random()*(e+1));[n[e],n[t]]=[n[t],n[e]]}return t?n.slice(0,t):n},f=({locale:e,...r})=>o(`div`,{className:`group z-10 mx-8 inline-flex shrink-0 transition-transform duration-300 hover:scale-105`,...r,children:s(t,{roundedSize:`xl`,className:`flex flex-row items-center gap-5 p-3`,children:[o(n,{locale:e,className:`max-h-5 max-w-5 rounded-sm grayscale-80 transition duration-300 group-hover:grayscale-0`,width:640,height:480,loading:`lazy`}),o(`span`,{dir:l(e),lang:e,className:`flex text-nowrap`,children:u(e)})]})}),p=({localeList:t,className:n,...r})=>o(`div`,{className:`relative flex w-full overflow-hidden`,...r,children:s(`div`,{className:e(`inline-flex shrink-0 will-change-transform`,n),children:[t.map((e,t)=>o(f,{locale:e},`${e}-first-${t}`)),t.map((e,t)=>o(f,{locale:e},`${e}-second-${t}`))]})}),m=[,,,,].fill(0).map(()=>[]),h=[,,,,].fill(0).map(()=>d(Object.values(c.ALL_LOCALES),15)),g=({className:t,...n})=>{let[a,c]=i(m),[l,u,d,f]=a;return r(()=>{c(h)},[]),o(`section`,{className:e(`mask-[linear-gradient(to_right,transparent_0,black_128px,black_calc(100%-128px),transparent_100%)] my-10 w-full overflow-hidden`,t),...n,children:s(`div`,{className:`relative flex w-full flex-col gap-5 py-3`,children:[o(p,{localeList:l,className:`horizontal-loop-1`}),o(p,{localeList:u,className:`horizontal-loop-2`}),o(p,{localeList:d,className:`horizontal-loop-1`}),o(p,{localeList:f,className:`horizontal-loop-2`})]})})},_=({children:e})=>s(a,{children:[o(`div`,{className:`absolute top-0 left-0 z-0 flex size-full items-center justify-center`,children:o(g,{className:`mt-[30%]`})}),e]});export{_ as LanguageBackground,g as LanguageSection};
+"use client";import{cn as e}from"../../utils/cn.mjs";import{Container as t}from"../Container/index.mjs";import{Flag as n}from"../Flags/Flag.mjs";import{useEffect as r,useState as i}from"react";import{Fragment as a,jsx as o,jsxs as s}from"react/jsx-runtime";import{ALL_LOCALES as c,getHTMLTextDir as l,getLocaleName as u}from"intlayer";const d=(e,t)=>{let n=[...e];for(let e=n.length-1;e>0;e--){let t=Math.floor(Math.random()*(e+1));[n[e],n[t]]=[n[t],n[e]]}return t?n.slice(0,t):n},f=({locale:e,...r})=>o(`div`,{className:`group z-10 mx-8 inline-flex shrink-0 transition-transform duration-300 hover:scale-105`,...r,children:s(t,{roundedSize:`xl`,className:`flex flex-row items-center gap-5 p-3`,children:[o(n,{locale:e,className:`max-h-5 max-w-5 rounded-sm grayscale-80 transition duration-300 group-hover:grayscale-0`,width:640,height:480,loading:`lazy`}),o(`span`,{dir:l(e),lang:e,className:`flex text-nowrap`,children:u(e)})]})}),p=({localeList:t,className:n,...r})=>o(`div`,{className:`relative flex w-full overflow-hidden`,...r,children:s(`div`,{className:e(`inline-flex shrink-0 will-change-transform`,n),children:[t.map((e,t)=>o(f,{locale:e},`${e}-first-${t}`)),t.map((e,t)=>o(f,{locale:e},`${e}-second-${t}`))]})}),m=[,,,,].fill(0).map(()=>[]),h=[,,,,].fill(0).map(()=>d(Object.values(c),15)),g=({className:t,...n})=>{let[a,c]=i(m),[l,u,d,f]=a;return r(()=>{c(h)},[]),o(`section`,{className:e(`mask-[linear-gradient(to_right,transparent_0,black_128px,black_calc(100%-128px),transparent_100%)] my-10 w-full overflow-hidden`,t),...n,children:s(`div`,{className:`relative flex w-full flex-col gap-5 py-3`,children:[o(p,{localeList:l,className:`horizontal-loop-1`}),o(p,{localeList:u,className:`horizontal-loop-2`}),o(p,{localeList:d,className:`horizontal-loop-1`}),o(p,{localeList:f,className:`horizontal-loop-2`})]})})},_=({children:e})=>s(a,{children:[o(`div`,{className:`absolute top-0 left-0 z-0 flex size-full items-center justify-center`,children:o(g,{className:`mt-[30%]`})}),e]});export{_ as LanguageBackground,g as LanguageSection};
 //# sourceMappingURL=index.mjs.map

package/dist/esm/components/LanguageBackground/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/LanguageBackground/index.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@utils/cn';\nimport { getHTMLTextDir, getLocaleName, type Locale, Locales } from 'intlayer';\nimport {\n  type FC,\n  type HTMLAttributes,\n  type PropsWithChildren,\n  useEffect,\n  useState,\n} from 'react';\nimport { Container } from '../Container';\nimport { Flag } from '../Flags';\n\nconst shuffleArray = (array: string[], limit?: number) => {\n  const shuffled = [...array];\n\n  for (let i = shuffled.length - 1; i > 0; i--) {\n    const randomIndex = Math.floor(Math.random() * (i + 1));\n\n    [shuffled[i], shuffled[randomIndex]] = [shuffled[randomIndex], shuffled[i]];\n  }\n\n  return limit ? shuffled.slice(0, limit) : shuffled;\n};\n\nconst LocalCard: FC<{ locale: string }> = ({ locale, ...props }) => (\n  <div\n    className=\"group z-10 mx-8 inline-flex shrink-0 transition-transform duration-300 hover:scale-105\"\n    {...props}\n  >\n    <Container\n      roundedSize=\"xl\"\n      className=\"flex flex-row items-center gap-5 p-3\"\n    >\n      <Flag\n        locale={locale as Locale}\n        className=\"max-h-5 max-w-5 rounded-sm grayscale-80 transition duration-300 group-hover:grayscale-0\"\n        width={640}\n        height={480}\n        loading=\"lazy\"\n      />\n      <span\n        dir={getHTMLTextDir(locale as Locale)}\n        lang={locale as Locale}\n        className=\"flex text-nowrap\"\n      >\n        {getLocaleName(locale as Locale)}\n      </span>\n    </Container>\n  </div>\n);\n\nconst LocalCardList: FC<{ localeList: string[]; className?: string }> = ({\n  localeList,\n  className,\n  ...props\n}) => (\n  <div className=\"relative flex w-full overflow-hidden\" {...props}>\n    <div\n      className={cn('inline-flex shrink-0 will-change-transform', className)}\n    >\n      {/* First set of cards */}\n      {localeList.map((locale, index) => (\n        <LocalCard key={`${locale}-first-${index}`} locale={locale} />\n      ))}\n      {/* Duplicate set for seamless loop */}\n      {localeList.map((locale, index) => (\n        <LocalCard key={`${locale}-second-${index}`} locale={locale} />\n      ))}\n    </div>\n  </div>\n);\n\nconst NUM_OF_LOCALES = 15;\n\nconst emptyArrayOfLocale: string[][] = new Array(4).fill(0).map(() => []);\nconst arrayOfLocale: string[][] = new Array(4)\n  .fill(0)\n  .map(() => shuffleArray(Object.values(Locales.ALL_LOCALES), NUM_OF_LOCALES));\n\nexport const LanguageSection: FC<HTMLAttributes<HTMLElement>> = ({\n  className,\n  ...props\n}) => {\n  const [localeList, setLocaleList] = useState(emptyArrayOfLocale);\n  const [firstPart, secondPart, thirdPart, fourthPart] = localeList;\n\n  useEffect(() => {\n    setLocaleList(arrayOfLocale);\n  }, []);\n\n  return (\n    <section\n      className={cn(\n        'mask-[linear-gradient(to_right,transparent_0,black_128px,black_calc(100%-128px),transparent_100%)] my-10 w-full overflow-hidden',\n        className\n      )}\n      {...props}\n    >\n      <div className=\"relative flex w-full flex-col gap-5 py-3\">\n        <LocalCardList localeList={firstPart} className=\"horizontal-loop-1\" />\n        <LocalCardList localeList={secondPart} className=\"horizontal-loop-2\" />\n        <LocalCardList localeList={thirdPart} className=\"horizontal-loop-1\" />\n        <LocalCardList localeList={fourthPart} className=\"horizontal-loop-2\" />\n      </div>\n    </section>\n  );\n};\n\nexport const LanguageBackground: FC<PropsWithChildren> = ({ children }) => (\n  <>\n    <div className=\"absolute top-0 left-0 z-0 flex size-full items-center justify-center\">\n      <LanguageSection className=\"mt-[30%]\" />\n    </div>\n    {children}\n  </>\n);\n"],"mappings":"2UAcA,MAAM,GAAgB,EAAiB,IAAmB,CACxD,IAAM,EAAW,CAAC,GAAG,EAAM,CAE3B,IAAK,IAAI,EAAI,EAAS,OAAS,EAAG,EAAI,EAAG,IAAK,CAC5C,IAAM,EAAc,KAAK,MAAM,KAAK,QAAQ,EAAI,EAAI,GAAG,CAEvD,CAAC,EAAS,GAAI,EAAS,IAAgB,CAAC,EAAS,GAAc,EAAS,GAAG,CAG7E,OAAO,EAAQ,EAAS,MAAM,EAAG,EAAM,CAAG,GAGtC,GAAqC,CAAE,SAAQ,GAAG,KACtD,EAAC,MAAD,CACE,UAAU,yFACV,GAAI,WAEJ,EAAC,EAAD,CACE,YAAY,KACZ,UAAU,gDAFZ,CAIE,EAAC,EAAD,CACU,SACR,UAAU,0FACV,MAAO,IACP,OAAQ,IACR,QAAQ,OACR,CAAA,CACF,EAAC,OAAD,CACE,IAAK,EAAe,EAAiB,CACrC,KAAM,EACN,UAAU,4BAET,EAAc,EAAiB,CAC3B,CAAA,CACG,GACR,CAAA,CAGF,GAAmE,CACvE,aACA,YACA,GAAG,KAEH,EAAC,MAAD,CAAK,UAAU,uCAAuC,GAAI,WACxD,EAAC,MAAD,CACE,UAAW,EAAG,6CAA8C,EAAU,UADxE,CAIG,EAAW,KAAK,EAAQ,IACvB,EAAC,EAAD,CAAoD,SAAU,CAA9C,GAAG,EAAO,SAAS,IAA2B,CAC9D,CAED,EAAW,KAAK,EAAQ,IACvB,EAAC,EAAD,CAAqD,SAAU,CAA/C,GAAG,EAAO,UAAU,IAA2B,CAC/D,CACE,GACF,CAAA,CAKF,EAAiC,MAAY,CAAC,KAAK,EAAE,CAAC,QAAU,EAAE,CAAC,CACnE,EAA4B,MAAY,CAC3C,KAAK,EAAE,CACP,QAAU,EAAa,OAAO,OAAO,EAAQ,YAAY,CAAE,GAAe,CAAC,CAEjE,GAAoD,CAC/D,YACA,GAAG,KACC,CACJ,GAAM,CAAC,EAAY,GAAiB,EAAS,EAAmB,CAC1D,CAAC,EAAW,EAAY,EAAW,GAAc,EAMvD,OAJA,MAAgB,CACd,EAAc,EAAc,EAC3B,EAAE,CAAC,CAGJ,EAAC,UAAD,CACE,UAAW,EACT,kIACA,EACD,CACD,GAAI,WAEJ,EAAC,MAAD,CAAK,UAAU,oDAAf,CACE,EAAC,EAAD,CAAe,WAAY,EAAW,UAAU,oBAAsB,CAAA,CACtE,EAAC,EAAD,CAAe,WAAY,EAAY,UAAU,oBAAsB,CAAA,CACvE,EAAC,EAAD,CAAe,WAAY,EAAW,UAAU,oBAAsB,CAAA,CACtE,EAAC,EAAD,CAAe,WAAY,EAAY,UAAU,oBAAsB,CAAA,CACnE,GACE,CAAA,EAID,GAA6C,CAAE,cAC1D,EAAA,EAAA,CAAA,SAAA,CACE,EAAC,MAAD,CAAK,UAAU,gFACb,EAAC,EAAD,CAAiB,UAAU,WAAa,CAAA,CACpC,CAAA,CACL,EACA,CAAA,CAAA"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/LanguageBackground/index.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@utils/cn';\nimport {\n  ALL_LOCALES,\n  getHTMLTextDir,\n  getLocaleName,\n  type Locale,\n} from 'intlayer';\nimport {\n  type FC,\n  type HTMLAttributes,\n  type PropsWithChildren,\n  useEffect,\n  useState,\n} from 'react';\nimport { Container } from '../Container';\nimport { Flag } from '../Flags';\n\nconst shuffleArray = (array: string[], limit?: number) => {\n  const shuffled = [...array];\n\n  for (let i = shuffled.length - 1; i > 0; i--) {\n    const randomIndex = Math.floor(Math.random() * (i + 1));\n\n    [shuffled[i], shuffled[randomIndex]] = [shuffled[randomIndex], shuffled[i]];\n  }\n\n  return limit ? shuffled.slice(0, limit) : shuffled;\n};\n\nconst LocalCard: FC<{ locale: string }> = ({ locale, ...props }) => (\n  <div\n    className=\"group z-10 mx-8 inline-flex shrink-0 transition-transform duration-300 hover:scale-105\"\n    {...props}\n  >\n    <Container\n      roundedSize=\"xl\"\n      className=\"flex flex-row items-center gap-5 p-3\"\n    >\n      <Flag\n        locale={locale as Locale}\n        className=\"max-h-5 max-w-5 rounded-sm grayscale-80 transition duration-300 group-hover:grayscale-0\"\n        width={640}\n        height={480}\n        loading=\"lazy\"\n      />\n      <span\n        dir={getHTMLTextDir(locale as Locale)}\n        lang={locale as Locale}\n        className=\"flex text-nowrap\"\n      >\n        {getLocaleName(locale as Locale)}\n      </span>\n    </Container>\n  </div>\n);\n\nconst LocalCardList: FC<{ localeList: string[]; className?: string }> = ({\n  localeList,\n  className,\n  ...props\n}) => (\n  <div className=\"relative flex w-full overflow-hidden\" {...props}>\n    <div\n      className={cn('inline-flex shrink-0 will-change-transform', className)}\n    >\n      {/* First set of cards */}\n      {localeList.map((locale, index) => (\n        <LocalCard key={`${locale}-first-${index}`} locale={locale} />\n      ))}\n      {/* Duplicate set for seamless loop */}\n      {localeList.map((locale, index) => (\n        <LocalCard key={`${locale}-second-${index}`} locale={locale} />\n      ))}\n    </div>\n  </div>\n);\n\nconst NUM_OF_LOCALES = 15;\n\nconst emptyArrayOfLocale: string[][] = new Array(4).fill(0).map(() => []);\nconst arrayOfLocale: string[][] = new Array(4)\n  .fill(0)\n  .map(() => shuffleArray(Object.values(ALL_LOCALES), NUM_OF_LOCALES));\n\nexport const LanguageSection: FC<HTMLAttributes<HTMLElement>> = ({\n  className,\n  ...props\n}) => {\n  const [localeList, setLocaleList] = useState(emptyArrayOfLocale);\n  const [firstPart, secondPart, thirdPart, fourthPart] = localeList;\n\n  useEffect(() => {\n    setLocaleList(arrayOfLocale);\n  }, []);\n\n  return (\n    <section\n      className={cn(\n        'mask-[linear-gradient(to_right,transparent_0,black_128px,black_calc(100%-128px),transparent_100%)] my-10 w-full overflow-hidden',\n        className\n      )}\n      {...props}\n    >\n      <div className=\"relative flex w-full flex-col gap-5 py-3\">\n        <LocalCardList localeList={firstPart} className=\"horizontal-loop-1\" />\n        <LocalCardList localeList={secondPart} className=\"horizontal-loop-2\" />\n        <LocalCardList localeList={thirdPart} className=\"horizontal-loop-1\" />\n        <LocalCardList localeList={fourthPart} className=\"horizontal-loop-2\" />\n      </div>\n    </section>\n  );\n};\n\nexport const LanguageBackground: FC<PropsWithChildren> = ({ children }) => (\n  <>\n    <div className=\"absolute top-0 left-0 z-0 flex size-full items-center justify-center\">\n      <LanguageSection className=\"mt-[30%]\" />\n    </div>\n    {children}\n  </>\n);\n"],"mappings":"+UAmBA,MAAM,GAAgB,EAAiB,IAAmB,CACxD,IAAM,EAAW,CAAC,GAAG,EAAM,CAE3B,IAAK,IAAI,EAAI,EAAS,OAAS,EAAG,EAAI,EAAG,IAAK,CAC5C,IAAM,EAAc,KAAK,MAAM,KAAK,QAAQ,EAAI,EAAI,GAAG,CAEvD,CAAC,EAAS,GAAI,EAAS,IAAgB,CAAC,EAAS,GAAc,EAAS,GAAG,CAG7E,OAAO,EAAQ,EAAS,MAAM,EAAG,EAAM,CAAG,GAGtC,GAAqC,CAAE,SAAQ,GAAG,KACtD,EAAC,MAAD,CACE,UAAU,yFACV,GAAI,WAEJ,EAAC,EAAD,CACE,YAAY,KACZ,UAAU,gDAFZ,CAIE,EAAC,EAAD,CACU,SACR,UAAU,0FACV,MAAO,IACP,OAAQ,IACR,QAAQ,OACR,CAAA,CACF,EAAC,OAAD,CACE,IAAK,EAAe,EAAiB,CACrC,KAAM,EACN,UAAU,4BAET,EAAc,EAAiB,CAC3B,CAAA,CACG,GACR,CAAA,CAGF,GAAmE,CACvE,aACA,YACA,GAAG,KAEH,EAAC,MAAD,CAAK,UAAU,uCAAuC,GAAI,WACxD,EAAC,MAAD,CACE,UAAW,EAAG,6CAA8C,EAAU,UADxE,CAIG,EAAW,KAAK,EAAQ,IACvB,EAAC,EAAD,CAAoD,SAAU,CAA9C,GAAG,EAAO,SAAS,IAA2B,CAC9D,CAED,EAAW,KAAK,EAAQ,IACvB,EAAC,EAAD,CAAqD,SAAU,CAA/C,GAAG,EAAO,UAAU,IAA2B,CAC/D,CACE,GACF,CAAA,CAKF,EAAiC,MAAY,CAAC,KAAK,EAAE,CAAC,QAAU,EAAE,CAAC,CACnE,EAA4B,MAAY,CAC3C,KAAK,EAAE,CACP,QAAU,EAAa,OAAO,OAAO,EAAY,CAAE,GAAe,CAAC,CAEzD,GAAoD,CAC/D,YACA,GAAG,KACC,CACJ,GAAM,CAAC,EAAY,GAAiB,EAAS,EAAmB,CAC1D,CAAC,EAAW,EAAY,EAAW,GAAc,EAMvD,OAJA,MAAgB,CACd,EAAc,EAAc,EAC3B,EAAE,CAAC,CAGJ,EAAC,UAAD,CACE,UAAW,EACT,kIACA,EACD,CACD,GAAI,WAEJ,EAAC,MAAD,CAAK,UAAU,oDAAf,CACE,EAAC,EAAD,CAAe,WAAY,EAAW,UAAU,oBAAsB,CAAA,CACtE,EAAC,EAAD,CAAe,WAAY,EAAY,UAAU,oBAAsB,CAAA,CACvE,EAAC,EAAD,CAAe,WAAY,EAAW,UAAU,oBAAsB,CAAA,CACtE,EAAC,EAAD,CAAe,WAAY,EAAY,UAAU,oBAAsB,CAAA,CACnE,GACE,CAAA,EAID,GAA6C,CAAE,cAC1D,EAAA,EAAA,CAAA,SAAA,CACE,EAAC,MAAD,CAAK,UAAU,gFACb,EAAC,EAAD,CAAiB,UAAU,WAAa,CAAA,CACpC,CAAA,CACL,EACA,CAAA,CAAA"}

package/dist/esm/components/Link/Link.mjs

@@ -1,2 +1,2 @@
-import{cn as e}from"../../utils/cn.mjs";import{ExternalLink as t,MoveRight as n}from"lucide-react";import{isValidElement as r}from"react";import{cva as i}from"class-variance-authority";import{jsx as a,jsxs as o}from"react/jsx-runtime";import{getLocalizedUrl as s}from"@intlayer/core/localization";let c=function(e){return e.DEFAULT=`default`,e.INVISIBLE_LINK=`invisible-link`,e.BUTTON=`button`,e.BUTTON_OUTLINED=`button-outlined`,e.HOVERABLE=`hoverable`,e}({}),l=function(e){return e.PRIMARY=`primary`,e.SECONDARY=`secondary`,e.DESTRUCTIVE=`destructive`,e.NEUTRAL=`neutral`,e.LIGHT=`light`,e.DARK=`dark`,e.TEXT=`text`,e.TEXT_INVERSE=`text-inverse`,e.ERROR=`error`,e.SUCCESS=`success`,e.CUSTOM=`custom`,e}({}),u=function(e){return e.NONE=`none`,e.SM=`sm`,e.MD=`md`,e.LG=`lg`,e.XL=`xl`,e.TWO_XL=`2xl`,e.THREE_XL=`3xl`,e.FULL=`full`,e}({}),d=function(e){return e.SM=`sm`,e.MD=`md`,e.LG=`lg`,e.XL=`xl`,e.CUSTOM=`custom`,e}({}),f=function(e){return e.DEFAULT=`default`,e.TRUE=`true`,e.FALSE=`false`,e}({});const p=i(`gap-3 transition-all duration-300 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50`,{variants:{variant:{[`${c.DEFAULT}`]:`h-auto justify-start border-inherit bg-current/0 px-1 font-medium decoration-[1.5] underline-offset-5 hover:bg-current/0 hover:text-current/80 hover:underline hover:underline-offset-6`,[`${c.INVISIBLE_LINK}`]:`h-auto justify-start border-inherit bg-current/0 px-1 underline-offset-5 hover:bg-current/0`,[`${c.BUTTON}`]:`relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full bg-current text-center font-medium text-text ring-0 *:text-text-opposite hover:bg-current/90 hover:ring-5 aria-selected:ring-5`,[`${c.BUTTON_OUTLINED}`]:`relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full border-[1.3px] border-current text-center font-medium text-text ring-0 *:text-text hover:bg-current/20 hover:ring-5 aria-selected:ring-5`,[`${c.HOVERABLE}`]:`block rounded-lg border-none bg-current/0 hover:bg-current/10 aria-[current]:bg-current/5`},roundedSize:{[`${u.NONE}`]:`rounded-none`,[`${u.SM}`]:`rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl`,[`${u.MD}`]:`rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl`,[`${u.LG}`]:`rounded-2xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-3xl`,[`${u.XL}`]:`rounded-3xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-4xl`,[`${u.TWO_XL}`]:`rounded-4xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[2.5rem]`,[`${u.THREE_XL}`]:`rounded-[2.5rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[3rem]`,[`${u.FULL}`]:`rounded-full`},color:{[`${l.PRIMARY}`]:`text-primary`,[`${l.SECONDARY}`]:`text-secondary`,[`${l.DESTRUCTIVE}`]:`text-destructive`,[`${l.NEUTRAL}`]:`text-neutral`,[`${l.LIGHT}`]:`text-white`,[`${l.DARK}`]:`text-neutral-800`,[`${l.TEXT}`]:`text-text`,[`${l.TEXT_INVERSE}`]:`text-text-opposite`,[`${l.ERROR}`]:`text-error`,[`${l.SUCCESS}`]:`text-success`,[`${l.CUSTOM}`]:``},size:{[`${d.SM}`]:`text-sm`,[`${d.MD}`]:`text-base`,[`${d.LG}`]:`text-lg`,[`${d.XL}`]:`text-xl`,[`${d.CUSTOM}`]:``},underlined:{[f.DEFAULT]:``,[f.TRUE]:`underline`,[f.FALSE]:`no-underline`}},compoundVariants:[{variant:c.BUTTON,color:l.TEXT_INVERSE,class:`*:text-text`},{variant:c.BUTTON_OUTLINED,color:l.TEXT_INVERSE,class:`text-text-opposite *:text-text-opposite`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],size:d.SM,class:`min-h-7 px-3 max-md:py-1`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],size:d.MD,class:`min-h-8 px-6 max-md:py-2`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],size:d.LG,class:`min-h-10 px-8 max-md:py-3`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],size:d.XL,class:`min-h-11 px-10 max-md:py-4`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.PRIMARY,class:`ring-primary/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.SECONDARY,class:`ring-secondary/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.DESTRUCTIVE,class:`ring-destructive/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.NEUTRAL,class:`ring-neutral/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.LIGHT,class:`ring-white/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.DARK,class:`ring-neutral-800/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.TEXT,class:`ring-text/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.TEXT_INVERSE,class:`ring-text-opposite/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.ERROR,class:`ring-error/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.SUCCESS,class:`ring-success/20`}],defaultVariants:{variant:c.DEFAULT,roundedSize:u.MD,underlined:f.DEFAULT,size:d.MD}}),m=({href:e,isExternalLink:t})=>{let n=typeof e==`string`&&e.trim()!==``;return t===!0||t===void 0&&n&&/^https?:\/\//.test(e)},h=e=>typeof e==`string`||typeof e==`number`?!0:Array.isArray(e)?e.every(h):r(e)?h(e.props.children):!1,g=r=>{let{variant:i=c.DEFAULT,color:u=l.CUSTOM,roundedSize:d,children:f,label:g,className:_,isActive:v,underlined:y,locale:b,size:x,isExternalLink:S,isPageSection:C,href:w,...T}=r,E=S??m(r),D=C??w?.startsWith(`#`)??!1,O=h(f),k=i===c.BUTTON||i===c.BUTTON_OUTLINED,A=E?`noopener noreferrer nofollow`:void 0,j=E?`_blank`:`_self`;return o(`a`,{href:b&&w&&!E&&!D?s(w,b):w,"aria-label":g,rel:A,target:j,"aria-current":v?`page`:void 0,suppressHydrationWarning:!0,className:e(p({variant:i,color:u,roundedSize:d,underlined:y,size:x,className:_})),...T,children:[k&&O?a(`span`,{children:f}):f,E&&O&&a(t,{className:`ml-2 inline-block size-4`}),D&&a(n,{className:`ml-2 inline-block size-4`})]})};export{g as Link,l as LinkColor,u as LinkRoundedSize,d as LinkSize,f as LinkUnderlined,c as LinkVariant,m as checkIsExternalLink,h as isTextChildren,p as linkVariants};
+import{cn as e}from"../../utils/cn.mjs";import{isValidElement as t}from"react";import{cva as n}from"class-variance-authority";import{ExternalLink as r,MoveRight as i}from"lucide-react";import{jsx as a,jsxs as o}from"react/jsx-runtime";import{getLocalizedUrl as s}from"@intlayer/core/localization";let c=function(e){return e.DEFAULT=`default`,e.INVISIBLE_LINK=`invisible-link`,e.BUTTON=`button`,e.BUTTON_OUTLINED=`button-outlined`,e.HOVERABLE=`hoverable`,e}({}),l=function(e){return e.PRIMARY=`primary`,e.SECONDARY=`secondary`,e.DESTRUCTIVE=`destructive`,e.NEUTRAL=`neutral`,e.LIGHT=`light`,e.DARK=`dark`,e.TEXT=`text`,e.TEXT_INVERSE=`text-inverse`,e.ERROR=`error`,e.SUCCESS=`success`,e.CUSTOM=`custom`,e}({}),u=function(e){return e.NONE=`none`,e.SM=`sm`,e.MD=`md`,e.LG=`lg`,e.XL=`xl`,e.TWO_XL=`2xl`,e.THREE_XL=`3xl`,e.FULL=`full`,e}({}),d=function(e){return e.SM=`sm`,e.MD=`md`,e.LG=`lg`,e.XL=`xl`,e.CUSTOM=`custom`,e}({}),f=function(e){return e.DEFAULT=`default`,e.TRUE=`true`,e.FALSE=`false`,e}({});const p=n(`gap-3 transition-all duration-300 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50`,{variants:{variant:{[`${c.DEFAULT}`]:`h-auto justify-start border-inherit bg-current/0 px-1 font-medium decoration-[1.5] underline-offset-5 hover:bg-current/0 hover:text-current/80 hover:underline hover:underline-offset-6`,[`${c.INVISIBLE_LINK}`]:`h-auto justify-start border-inherit bg-current/0 px-1 underline-offset-5 hover:bg-current/0`,[`${c.BUTTON}`]:`relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full bg-current text-center font-medium text-text ring-0 *:text-text-opposite hover:bg-current/90 hover:ring-5 aria-selected:ring-5`,[`${c.BUTTON_OUTLINED}`]:`relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full border-[1.3px] border-current text-center font-medium text-text ring-0 *:text-text hover:bg-current/20 hover:ring-5 aria-selected:ring-5`,[`${c.HOVERABLE}`]:`block rounded-lg border-none bg-current/0 hover:bg-current/10 aria-[current]:bg-current/5`},roundedSize:{[`${u.NONE}`]:`rounded-none`,[`${u.SM}`]:`rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl`,[`${u.MD}`]:`rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl`,[`${u.LG}`]:`rounded-2xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-3xl`,[`${u.XL}`]:`rounded-3xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-4xl`,[`${u.TWO_XL}`]:`rounded-4xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[2.5rem]`,[`${u.THREE_XL}`]:`rounded-[2.5rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[3rem]`,[`${u.FULL}`]:`rounded-full`},color:{[`${l.PRIMARY}`]:`text-primary`,[`${l.SECONDARY}`]:`text-secondary`,[`${l.DESTRUCTIVE}`]:`text-destructive`,[`${l.NEUTRAL}`]:`text-neutral`,[`${l.LIGHT}`]:`text-white`,[`${l.DARK}`]:`text-neutral-800`,[`${l.TEXT}`]:`text-text`,[`${l.TEXT_INVERSE}`]:`text-text-opposite`,[`${l.ERROR}`]:`text-error`,[`${l.SUCCESS}`]:`text-success`,[`${l.CUSTOM}`]:``},size:{[`${d.SM}`]:`text-sm`,[`${d.MD}`]:`text-base`,[`${d.LG}`]:`text-lg`,[`${d.XL}`]:`text-xl`,[`${d.CUSTOM}`]:``},underlined:{[f.DEFAULT]:``,[f.TRUE]:`underline`,[f.FALSE]:`no-underline`}},compoundVariants:[{variant:c.BUTTON,color:l.TEXT_INVERSE,class:`*:text-text`},{variant:c.BUTTON_OUTLINED,color:l.TEXT_INVERSE,class:`text-text-opposite *:text-text-opposite`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],size:d.SM,class:`min-h-7 px-3 max-md:py-1`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],size:d.MD,class:`min-h-8 px-6 max-md:py-2`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],size:d.LG,class:`min-h-10 px-8 max-md:py-3`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],size:d.XL,class:`min-h-11 px-10 max-md:py-4`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.PRIMARY,class:`ring-primary/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.SECONDARY,class:`ring-secondary/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.DESTRUCTIVE,class:`ring-destructive/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.NEUTRAL,class:`ring-neutral/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.LIGHT,class:`ring-white/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.DARK,class:`ring-neutral-800/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.TEXT,class:`ring-text/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.TEXT_INVERSE,class:`ring-text-opposite/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.ERROR,class:`ring-error/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.SUCCESS,class:`ring-success/20`}],defaultVariants:{variant:c.DEFAULT,roundedSize:u.MD,underlined:f.DEFAULT,size:d.MD}}),m=({href:e,isExternalLink:t})=>{let n=typeof e==`string`&&e.trim()!==``;return t===!0||t===void 0&&n&&/^https?:\/\//.test(e)},h=e=>typeof e==`string`||typeof e==`number`?!0:Array.isArray(e)?e.every(h):t(e)?h(e.props.children):!1,g=t=>{let{variant:n=c.DEFAULT,color:u=l.CUSTOM,roundedSize:d,children:f,label:g,className:_,isActive:v,underlined:y,locale:b,size:x,isExternalLink:S,isPageSection:C,href:w,...T}=t,E=S??m(t),D=C??w?.startsWith(`#`)??!1,O=h(f),k=n===c.BUTTON||n===c.BUTTON_OUTLINED,A=E?`noopener noreferrer nofollow`:void 0,j=E?`_blank`:`_self`;return o(`a`,{href:b&&w&&!E&&!D?s(w,b):w,"aria-label":g,rel:A,target:j,"aria-current":v?`page`:void 0,suppressHydrationWarning:!0,className:e(p({variant:n,color:u,roundedSize:d,underlined:y,size:x,className:_})),...T,children:[k&&O?a(`span`,{children:f}):f,E&&O&&a(r,{className:`ml-2 inline-block size-4`}),D&&a(i,{className:`ml-2 inline-block size-4`})]})};export{g as Link,l as LinkColor,u as LinkRoundedSize,d as LinkSize,f as LinkUnderlined,c as LinkVariant,m as checkIsExternalLink,h as isTextChildren,p as linkVariants};
 //# sourceMappingURL=Link.mjs.map

package/dist/esm/components/Link/Link.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Link.mjs","names":[],"sources":["../../../../src/components/Link/Link.tsx"],"sourcesContent":["import { getLocalizedUrl } from '@intlayer/core/localization';\nimport type { LocalesValues } from '@intlayer/types';\nimport { cn } from '@utils/cn';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { ExternalLink, MoveRight } from 'lucide-react';\nimport {\n  type AnchorHTMLAttributes,\n  type DetailedHTMLProps,\n  type FC,\n  isValidElement,\n  type ReactNode,\n} from 'react';\n\n/**\n * Visual style variants for Link component\n */\nexport enum LinkVariant {\n  DEFAULT = 'default',\n  INVISIBLE_LINK = 'invisible-link',\n  BUTTON = 'button',\n  BUTTON_OUTLINED = 'button-outlined',\n  HOVERABLE = 'hoverable',\n}\n\n/**\n * Color theme variants for Link component\n */\nexport enum LinkColor {\n  PRIMARY = 'primary',\n  SECONDARY = 'secondary',\n  DESTRUCTIVE = 'destructive',\n  NEUTRAL = 'neutral',\n  LIGHT = 'light',\n  DARK = 'dark',\n  TEXT = 'text',\n  TEXT_INVERSE = 'text-inverse',\n  ERROR = 'error',\n  SUCCESS = 'success',\n  CUSTOM = 'custom',\n}\n\nexport enum LinkRoundedSize {\n  NONE = 'none',\n  SM = 'sm',\n  MD = 'md',\n  LG = 'lg',\n  XL = 'xl',\n  TWO_XL = '2xl',\n  THREE_XL = '3xl',\n  FULL = 'full',\n}\n\nexport enum LinkSize {\n  SM = 'sm',\n  MD = 'md',\n  LG = 'lg',\n  XL = 'xl',\n  CUSTOM = 'custom',\n}\n\nexport enum LinkUnderlined {\n  DEFAULT = 'default',\n  TRUE = 'true',\n  FALSE = 'false',\n}\n\nexport const linkVariants = cva(\n  'gap-3 transition-all duration-300 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50',\n  {\n    variants: {\n      variant: {\n        [`${LinkVariant.DEFAULT}`]:\n          'h-auto justify-start border-inherit bg-current/0 px-1 font-medium decoration-[1.5] underline-offset-5 hover:bg-current/0 hover:text-current/80 hover:underline hover:underline-offset-6',\n        [`${LinkVariant.INVISIBLE_LINK}`]:\n          'h-auto justify-start border-inherit bg-current/0 px-1 underline-offset-5 hover:bg-current/0',\n\n        [`${LinkVariant.BUTTON}`]:\n          'relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full bg-current text-center font-medium text-text ring-0 *:text-text-opposite hover:bg-current/90 hover:ring-5 aria-selected:ring-5',\n\n        [`${LinkVariant.BUTTON_OUTLINED}`]:\n          'relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full border-[1.3px] border-current text-center font-medium text-text ring-0 *:text-text hover:bg-current/20 hover:ring-5 aria-selected:ring-5',\n\n        [`${LinkVariant.HOVERABLE}`]:\n          'block rounded-lg border-none bg-current/0 hover:bg-current/10 aria-[current]:bg-current/5',\n      },\n      roundedSize: {\n        [`${LinkRoundedSize.NONE}`]: 'rounded-none',\n        [`${LinkRoundedSize.SM}`]:\n          'rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl',\n        [`${LinkRoundedSize.MD}`]:\n          'rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl',\n        [`${LinkRoundedSize.LG}`]:\n          'rounded-2xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-3xl',\n        [`${LinkRoundedSize.XL}`]:\n          'rounded-3xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-4xl',\n        [`${LinkRoundedSize.TWO_XL}`]:\n          'rounded-4xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[2.5rem]',\n        [`${LinkRoundedSize.THREE_XL}`]:\n          'rounded-[2.5rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[3rem]',\n        [`${LinkRoundedSize.FULL}`]: 'rounded-full',\n      },\n      color: {\n        [`${LinkColor.PRIMARY}`]: 'text-primary',\n        [`${LinkColor.SECONDARY}`]: 'text-secondary',\n        [`${LinkColor.DESTRUCTIVE}`]: 'text-destructive',\n        [`${LinkColor.NEUTRAL}`]: 'text-neutral',\n        [`${LinkColor.LIGHT}`]: 'text-white',\n        [`${LinkColor.DARK}`]: 'text-neutral-800',\n        [`${LinkColor.TEXT}`]: 'text-text',\n        [`${LinkColor.TEXT_INVERSE}`]: 'text-text-opposite',\n        [`${LinkColor.ERROR}`]: 'text-error',\n        [`${LinkColor.SUCCESS}`]: 'text-success',\n        [`${LinkColor.CUSTOM}`]: '',\n      },\n      size: {\n        [`${LinkSize.SM}`]: 'text-sm',\n        [`${LinkSize.MD}`]: 'text-base',\n        [`${LinkSize.LG}`]: 'text-lg',\n        [`${LinkSize.XL}`]: 'text-xl',\n        [`${LinkSize.CUSTOM}`]: '',\n      },\n      underlined: {\n        [LinkUnderlined.DEFAULT]: '',\n        [LinkUnderlined.TRUE]: 'underline',\n        [LinkUnderlined.FALSE]: 'no-underline',\n      },\n    },\n    // Compound variants handle height and padding\n    compoundVariants: [\n      // ---------------------------------------------------------\n      // FIX START: Correctly Handle Contrast for TEXT_INVERSE\n      // ---------------------------------------------------------\n      {\n        // Filled Button + Inverse Color (e.g., White Button):\n        // We DO NOT override parent text color (it must remain 'text-opposite' so bg-current is white).\n        // We ONLY override children to be 'text-text' (Dark) so they show up on white.\n        variant: LinkVariant.BUTTON,\n        color: LinkColor.TEXT_INVERSE,\n        class: '*:text-text',\n      },\n      {\n        // Outlined Button + Inverse Color (e.g., White Border):\n        // Parent is 'text-opposite' (Border is white).\n        // Children must also be 'text-opposite' (White text) to show on dark background.\n        variant: LinkVariant.BUTTON_OUTLINED,\n        color: LinkColor.TEXT_INVERSE,\n        class: 'text-text-opposite *:text-text-opposite',\n      },\n\n      // Min height and padding for button variants\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        size: LinkSize.SM,\n        class: 'min-h-7 px-3 max-md:py-1',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        size: LinkSize.MD,\n        class: 'min-h-8 px-6 max-md:py-2',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        size: LinkSize.LG,\n        class: 'min-h-10 px-8 max-md:py-3',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        size: LinkSize.XL,\n        class: 'min-h-11 px-10 max-md:py-4',\n      },\n      // Ring color variants\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.PRIMARY,\n        class: 'ring-primary/20',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.SECONDARY,\n        class: 'ring-secondary/20',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.DESTRUCTIVE,\n        class: 'ring-destructive/20',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.NEUTRAL,\n        class: 'ring-neutral/20',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.LIGHT,\n        class: 'ring-white/20',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.DARK,\n        class: 'ring-neutral-800/20',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.TEXT,\n        class: 'ring-text/20',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.TEXT_INVERSE,\n        class: 'ring-text-opposite/20',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.ERROR,\n        class: 'ring-error/20',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.SUCCESS,\n        class: 'ring-success/20',\n      },\n    ],\n\n    defaultVariants: {\n      variant: LinkVariant.DEFAULT,\n      roundedSize: LinkRoundedSize.MD,\n      underlined: LinkUnderlined.DEFAULT,\n      size: LinkSize.MD,\n    },\n  }\n);\n\nexport type LinkProps = DetailedHTMLProps<\n  AnchorHTMLAttributes<HTMLAnchorElement>,\n  HTMLAnchorElement\n> &\n  VariantProps<typeof linkVariants> & {\n    label: string;\n    isExternalLink?: boolean;\n    isPageSection?: boolean;\n    isActive?: boolean;\n    locale?: LocalesValues;\n  };\n\nexport const checkIsExternalLink = ({\n  href,\n  isExternalLink: isExternalLinkProp,\n}: LinkProps): boolean => {\n  const isValidHref = typeof href === 'string' && href.trim() !== '';\n  const isExternalLink =\n    isExternalLinkProp === true ||\n    (typeof isExternalLinkProp === 'undefined' &&\n      isValidHref &&\n      /^https?:\\/\\//.test(href));\n\n  return isExternalLink;\n};\n\nexport const isTextChildren = (children: ReactNode): boolean => {\n  if (typeof children === 'string' || typeof children === 'number') {\n    return true;\n  }\n  if (Array.isArray(children)) {\n    return children.every(isTextChildren);\n  }\n  if (isValidElement(children)) {\n    return isTextChildren(\n      (children.props as { children?: ReactNode }).children\n    );\n  }\n  return false;\n};\n\nexport const Link: FC<LinkProps> = (props) => {\n  const {\n    variant = LinkVariant.DEFAULT,\n    color = LinkColor.CUSTOM,\n    roundedSize,\n    children,\n    label,\n    className,\n    isActive,\n    underlined,\n    locale,\n    size,\n    isExternalLink: isExternalLinkProp,\n    isPageSection: isPageSectionProp,\n    href: hrefProp,\n    ...otherProps\n  } = props;\n\n  const isExternalLink = isExternalLinkProp ?? checkIsExternalLink(props);\n  const isPageSection = isPageSectionProp ?? hrefProp?.startsWith('#') ?? false;\n\n  const isChildrenString = isTextChildren(children);\n  const isButton =\n    variant === LinkVariant.BUTTON || variant === LinkVariant.BUTTON_OUTLINED;\n\n  const rel = isExternalLink ? 'noopener noreferrer nofollow' : undefined;\n\n  const target = isExternalLink ? '_blank' : '_self';\n\n  const href =\n    locale && hrefProp && !isExternalLink && !isPageSection\n      ? getLocalizedUrl(hrefProp, locale)\n      : hrefProp;\n\n  return (\n    <a\n      href={href}\n      aria-label={label}\n      rel={rel}\n      target={target}\n      aria-current={isActive ? 'page' : undefined}\n      suppressHydrationWarning\n      className={cn(\n        linkVariants({\n          variant,\n          color,\n          roundedSize,\n          underlined,\n          size,\n          className,\n        })\n      )}\n      {...otherProps}\n    >\n      {isButton && isChildrenString ? <span>{children}</span> : children}\n\n      {isExternalLink && isChildrenString && (\n        <ExternalLink className=\"ml-2 inline-block size-4\" />\n      )}\n      {isPageSection && <MoveRight className=\"ml-2 inline-block size-4\" />}\n    </a>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"Link.mjs","names":[],"sources":["../../../../src/components/Link/Link.tsx"],"sourcesContent":["import { getLocalizedUrl } from '@intlayer/core/localization';\nimport type { LocalesValues } from '@intlayer/types/module_augmentation';\nimport { cn } from '@utils/cn';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { ExternalLink, MoveRight } from 'lucide-react';\nimport {\n  type AnchorHTMLAttributes,\n  type DetailedHTMLProps,\n  type FC,\n  isValidElement,\n  type ReactNode,\n} from 'react';\n\n/**\n * Visual style variants for Link component\n */\nexport enum LinkVariant {\n  DEFAULT = 'default',\n  INVISIBLE_LINK = 'invisible-link',\n  BUTTON = 'button',\n  BUTTON_OUTLINED = 'button-outlined',\n  HOVERABLE = 'hoverable',\n}\n\n/**\n * Color theme variants for Link component\n */\nexport enum LinkColor {\n  PRIMARY = 'primary',\n  SECONDARY = 'secondary',\n  DESTRUCTIVE = 'destructive',\n  NEUTRAL = 'neutral',\n  LIGHT = 'light',\n  DARK = 'dark',\n  TEXT = 'text',\n  TEXT_INVERSE = 'text-inverse',\n  ERROR = 'error',\n  SUCCESS = 'success',\n  CUSTOM = 'custom',\n}\n\nexport enum LinkRoundedSize {\n  NONE = 'none',\n  SM = 'sm',\n  MD = 'md',\n  LG = 'lg',\n  XL = 'xl',\n  TWO_XL = '2xl',\n  THREE_XL = '3xl',\n  FULL = 'full',\n}\n\nexport enum LinkSize {\n  SM = 'sm',\n  MD = 'md',\n  LG = 'lg',\n  XL = 'xl',\n  CUSTOM = 'custom',\n}\n\nexport enum LinkUnderlined {\n  DEFAULT = 'default',\n  TRUE = 'true',\n  FALSE = 'false',\n}\n\nexport const linkVariants = cva(\n  'gap-3 transition-all duration-300 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50',\n  {\n    variants: {\n      variant: {\n        [`${LinkVariant.DEFAULT}`]:\n          'h-auto justify-start border-inherit bg-current/0 px-1 font-medium decoration-[1.5] underline-offset-5 hover:bg-current/0 hover:text-current/80 hover:underline hover:underline-offset-6',\n        [`${LinkVariant.INVISIBLE_LINK}`]:\n          'h-auto justify-start border-inherit bg-current/0 px-1 underline-offset-5 hover:bg-current/0',\n\n        [`${LinkVariant.BUTTON}`]:\n          'relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full bg-current text-center font-medium text-text ring-0 *:text-text-opposite hover:bg-current/90 hover:ring-5 aria-selected:ring-5',\n\n        [`${LinkVariant.BUTTON_OUTLINED}`]:\n          'relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full border-[1.3px] border-current text-center font-medium text-text ring-0 *:text-text hover:bg-current/20 hover:ring-5 aria-selected:ring-5',\n\n        [`${LinkVariant.HOVERABLE}`]:\n          'block rounded-lg border-none bg-current/0 hover:bg-current/10 aria-[current]:bg-current/5',\n      },\n      roundedSize: {\n        [`${LinkRoundedSize.NONE}`]: 'rounded-none',\n        [`${LinkRoundedSize.SM}`]:\n          'rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl',\n        [`${LinkRoundedSize.MD}`]:\n          'rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl',\n        [`${LinkRoundedSize.LG}`]:\n          'rounded-2xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-3xl',\n        [`${LinkRoundedSize.XL}`]:\n          'rounded-3xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-4xl',\n        [`${LinkRoundedSize.TWO_XL}`]:\n          'rounded-4xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[2.5rem]',\n        [`${LinkRoundedSize.THREE_XL}`]:\n          'rounded-[2.5rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[3rem]',\n        [`${LinkRoundedSize.FULL}`]: 'rounded-full',\n      },\n      color: {\n        [`${LinkColor.PRIMARY}`]: 'text-primary',\n        [`${LinkColor.SECONDARY}`]: 'text-secondary',\n        [`${LinkColor.DESTRUCTIVE}`]: 'text-destructive',\n        [`${LinkColor.NEUTRAL}`]: 'text-neutral',\n        [`${LinkColor.LIGHT}`]: 'text-white',\n        [`${LinkColor.DARK}`]: 'text-neutral-800',\n        [`${LinkColor.TEXT}`]: 'text-text',\n        [`${LinkColor.TEXT_INVERSE}`]: 'text-text-opposite',\n        [`${LinkColor.ERROR}`]: 'text-error',\n        [`${LinkColor.SUCCESS}`]: 'text-success',\n        [`${LinkColor.CUSTOM}`]: '',\n      },\n      size: {\n        [`${LinkSize.SM}`]: 'text-sm',\n        [`${LinkSize.MD}`]: 'text-base',\n        [`${LinkSize.LG}`]: 'text-lg',\n        [`${LinkSize.XL}`]: 'text-xl',\n        [`${LinkSize.CUSTOM}`]: '',\n      },\n      underlined: {\n        [LinkUnderlined.DEFAULT]: '',\n        [LinkUnderlined.TRUE]: 'underline',\n        [LinkUnderlined.FALSE]: 'no-underline',\n      },\n    },\n    // Compound variants handle height and padding\n    compoundVariants: [\n      // ---------------------------------------------------------\n      // FIX START: Correctly Handle Contrast for TEXT_INVERSE\n      // ---------------------------------------------------------\n      {\n        // Filled Button + Inverse Color (e.g., White Button):\n        // We DO NOT override parent text color (it must remain 'text-opposite' so bg-current is white).\n        // We ONLY override children to be 'text-text' (Dark) so they show up on white.\n        variant: LinkVariant.BUTTON,\n        color: LinkColor.TEXT_INVERSE,\n        class: '*:text-text',\n      },\n      {\n        // Outlined Button + Inverse Color (e.g., White Border):\n        // Parent is 'text-opposite' (Border is white).\n        // Children must also be 'text-opposite' (White text) to show on dark background.\n        variant: LinkVariant.BUTTON_OUTLINED,\n        color: LinkColor.TEXT_INVERSE,\n        class: 'text-text-opposite *:text-text-opposite',\n      },\n\n      // Min height and padding for button variants\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        size: LinkSize.SM,\n        class: 'min-h-7 px-3 max-md:py-1',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        size: LinkSize.MD,\n        class: 'min-h-8 px-6 max-md:py-2',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        size: LinkSize.LG,\n        class: 'min-h-10 px-8 max-md:py-3',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        size: LinkSize.XL,\n        class: 'min-h-11 px-10 max-md:py-4',\n      },\n      // Ring color variants\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.PRIMARY,\n        class: 'ring-primary/20',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.SECONDARY,\n        class: 'ring-secondary/20',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.DESTRUCTIVE,\n        class: 'ring-destructive/20',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.NEUTRAL,\n        class: 'ring-neutral/20',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.LIGHT,\n        class: 'ring-white/20',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.DARK,\n        class: 'ring-neutral-800/20',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.TEXT,\n        class: 'ring-text/20',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.TEXT_INVERSE,\n        class: 'ring-text-opposite/20',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.ERROR,\n        class: 'ring-error/20',\n      },\n      {\n        variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n        color: LinkColor.SUCCESS,\n        class: 'ring-success/20',\n      },\n    ],\n\n    defaultVariants: {\n      variant: LinkVariant.DEFAULT,\n      roundedSize: LinkRoundedSize.MD,\n      underlined: LinkUnderlined.DEFAULT,\n      size: LinkSize.MD,\n    },\n  }\n);\n\nexport type LinkProps = DetailedHTMLProps<\n  AnchorHTMLAttributes<HTMLAnchorElement>,\n  HTMLAnchorElement\n> &\n  VariantProps<typeof linkVariants> & {\n    label: string;\n    isExternalLink?: boolean;\n    isPageSection?: boolean;\n    isActive?: boolean;\n    locale?: LocalesValues;\n  };\n\nexport const checkIsExternalLink = ({\n  href,\n  isExternalLink: isExternalLinkProp,\n}: LinkProps): boolean => {\n  const isValidHref = typeof href === 'string' && href.trim() !== '';\n  const isExternalLink =\n    isExternalLinkProp === true ||\n    (typeof isExternalLinkProp === 'undefined' &&\n      isValidHref &&\n      /^https?:\\/\\//.test(href));\n\n  return isExternalLink;\n};\n\nexport const isTextChildren = (children: ReactNode): boolean => {\n  if (typeof children === 'string' || typeof children === 'number') {\n    return true;\n  }\n  if (Array.isArray(children)) {\n    return children.every(isTextChildren);\n  }\n  if (isValidElement(children)) {\n    return isTextChildren(\n      (children.props as { children?: ReactNode }).children\n    );\n  }\n  return false;\n};\n\nexport const Link: FC<LinkProps> = (props) => {\n  const {\n    variant = LinkVariant.DEFAULT,\n    color = LinkColor.CUSTOM,\n    roundedSize,\n    children,\n    label,\n    className,\n    isActive,\n    underlined,\n    locale,\n    size,\n    isExternalLink: isExternalLinkProp,\n    isPageSection: isPageSectionProp,\n    href: hrefProp,\n    ...otherProps\n  } = props;\n\n  const isExternalLink = isExternalLinkProp ?? checkIsExternalLink(props);\n  const isPageSection = isPageSectionProp ?? hrefProp?.startsWith('#') ?? false;\n\n  const isChildrenString = isTextChildren(children);\n  const isButton =\n    variant === LinkVariant.BUTTON || variant === LinkVariant.BUTTON_OUTLINED;\n\n  const rel = isExternalLink ? 'noopener noreferrer nofollow' : undefined;\n\n  const target = isExternalLink ? '_blank' : '_self';\n\n  const href =\n    locale && hrefProp && !isExternalLink && !isPageSection\n      ? getLocalizedUrl(hrefProp, locale)\n      : hrefProp;\n\n  return (\n    <a\n      href={href}\n      aria-label={label}\n      rel={rel}\n      target={target}\n      aria-current={isActive ? 'page' : undefined}\n      suppressHydrationWarning\n      className={cn(\n        linkVariants({\n          variant,\n          color,\n          roundedSize,\n          underlined,\n          size,\n          className,\n        })\n      )}\n      {...otherProps}\n    >\n      {isButton && isChildrenString ? <span>{children}</span> : children}\n\n      {isExternalLink && isChildrenString && (\n        <ExternalLink className=\"ml-2 inline-block size-4\" />\n      )}\n      {isPageSection && <MoveRight className=\"ml-2 inline-block size-4\" />}\n    </a>\n  );\n};\n"],"mappings":"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"}

package/dist/esm/components/LocaleSwitcherContentDropDown/LocaleSwitcherContent.mjs

@@ -1,2 +1,2 @@
-"use client";import{Container as e}from"../Container/index.mjs";import{Button as t,ButtonColor as n,ButtonSize as r,ButtonTextAlign as i,ButtonVariant as a}from"../Button/Button.mjs";import{Input as o}from"../Input/Input.mjs";import{usePersistedStore as s}from"../../hooks/usePersistedStore.mjs";import{DropDown as c}from"../DropDown/index.mjs";import{SwitchSelector as l,SwitchSelectorColor as u,SwitchSelectorSize as d}from"../SwitchSelector/index.mjs";import{useLocaleSwitcherContent as f}from"./LocaleSwitcherContentContext.mjs";import{Check as p,Globe as m,MoveVertical as h}from"lucide-react";import{useMemo as g,useRef as _,useState as v}from"react";import{Fragment as y,jsx as b,jsxs as x}from"react/jsx-runtime";import{useIntlayer as S,useLocale as C}from"react-intlayer";import{getHTMLTextDir as w,getLocaleName as T}from"@intlayer/core/localization";import{Locales as E}from"@intlayer/types";import D from"fuse.js";const O=`locale-switcher-content`,k=({panelProps:k,isMultilingual:A=!0})=>{let{switchTo:j,searchInput:M,localeSwitcherLabel:N,languageListLabel:P,seeAllLocalesSwitch:F}=S(`locale-switcher-content`),I=_(null),{locale:L}=C(),{availableLocales:R,selectedLocales:z,setSelectedLocales:B}=f(),V=g(()=>R.map(e=>({locale:e,englishName:T(e,E.ENGLISH),currentLocaleName:T(e,L),ownLocaleName:T(e)})),[R,L]),[H,U]=v(``),[W,G]=s(`locale-content-selector-see-all-locales`,!1),K=g(()=>new D(V,{keys:[{name:`ownLocaleName`,weight:.4},{name:`englishName`,weight:.2},{name:`currentLocaleName`,weight:.2},{name:`locale`,weight:.2}],threshold:.02}),[V]),q=g(()=>H?K.search(H).map(e=>e.item):V,[H,V,K]),J=e=>{A?z.includes(e)?z.length>1&&B(t=>t.filter(t=>t!==e)):B(t=>[...t,e]):B([e])},Y=e=>{G(e),B(e?R:[L])};return b(`div`,{className:`rounded-xl border border-text text-text transition-colors`,children:x(c,{identifier:O,children:[b(c.Trigger,{identifier:O,label:N.value,className:`p-0!`,roundedSize:`3xl`,children:x(`div`,{className:`flex w-full items-center justify-between`,children:[b(`div`,{className:`px-2 py-1`,children:b(m,{size:16})}),b(h,{className:`self-center`,size:16})]})}),b(c.Panel,{identifier:O,isOverable:!0,isFocusable:!0,className:`right-0 left-auto`,...k,children:x(e,{className:`max-h-[60vh] min-w-28`,separator:`y`,role:`listbox`,transparency:`xs`,border:!0,roundedSize:`2xl`,borderColor:`text`,"aria-label":P.value,children:[A&&b(`div`,{className:`m-auto p-2`,children:b(l,{defaultValue:W,onChange:Y,color:u.TEXT,size:d.SM,className:`!w-60`,choices:[{content:F.true.value,value:!0},{content:F.false.value,value:!1}]})}),!(A&&W)&&x(y,{children:[b(`div`,{className:`p-3`,children:b(o,{type:`search`,"aria-label":M.ariaLabel.value,placeholder:M.placeholder.value,onChange:e=>U(e.target.value),ref:I})}),b(`ol`,{className:`divide-y divide-dashed divide-text/20 overflow-y-auto p-1`,children:q.map(({locale:e,currentLocaleName:o,ownLocaleName:s})=>b(`li`,{className:`px-1.5 py-1`,children:b(t,{onClick:()=>J(e),label:`${j} ${o}`,disabled:!(R??R).includes(e),isActive:z.includes(e),variant:a.HOVERABLE,color:n.TEXT,isFullWidth:!0,textAlign:i.LEFT,size:r.SM,children:x(`div`,{className:`flex flex-row items-center justify-between gap-3 px-2 py-1`,children:[A&&b(`div`,{className:`w-4`,children:z.includes(e)&&b(p,{className:`size-full`})}),x(`div`,{className:`flex flex-1 flex-row items-center justify-between gap-3 px-2 py-1`,children:[x(`div`,{className:`flex flex-col text-nowrap`,children:[b(`span`,{dir:w(e),lang:e,children:s}),b(`span`,{className:`text-neutral text-xs`,children:o})]}),b(`span`,{className:`text-neutral text-sm`,children:e.toUpperCase()})]})]})})},e))})]})]})})]})})};export{k as LocaleSwitcherContent};
+"use client";import{Container as e}from"../Container/index.mjs";import{Button as t,ButtonColor as n,ButtonSize as r,ButtonTextAlign as i,ButtonVariant as a}from"../Button/Button.mjs";import{Input as o}from"../Input/Input.mjs";import{usePersistedStore as s}from"../../hooks/usePersistedStore.mjs";import{DropDown as c}from"../DropDown/index.mjs";import{SwitchSelector as l,SwitchSelectorColor as u,SwitchSelectorSize as d}from"../SwitchSelector/index.mjs";import{useLocaleSwitcherContent as f}from"./LocaleSwitcherContentContext.mjs";import{useMemo as p,useRef as m,useState as h}from"react";import{Check as g,Globe as _,MoveVertical as v}from"lucide-react";import{Fragment as y,jsx as b,jsxs as x}from"react/jsx-runtime";import{useIntlayer as S,useLocale as C}from"react-intlayer";import{getHTMLTextDir as w,getLocaleName as T}from"@intlayer/core/localization";import*as E from"@intlayer/types/locales";import D from"fuse.js";const O=`locale-switcher-content`,k=({panelProps:k,isMultilingual:A=!0})=>{let{switchTo:j,searchInput:M,localeSwitcherLabel:N,languageListLabel:P,seeAllLocalesSwitch:F}=S(`locale-switcher-content`),I=m(null),{locale:L}=C(),{availableLocales:R,selectedLocales:z,setSelectedLocales:B}=f(),V=p(()=>R.map(e=>({locale:e,englishName:T(e,E.ENGLISH),currentLocaleName:T(e,L),ownLocaleName:T(e)})),[R,L]),[H,U]=h(``),[W,G]=s(`locale-content-selector-see-all-locales`,!1),K=p(()=>new D(V,{keys:[{name:`ownLocaleName`,weight:.4},{name:`englishName`,weight:.2},{name:`currentLocaleName`,weight:.2},{name:`locale`,weight:.2}],threshold:.02}),[V]),q=p(()=>H?K.search(H).map(e=>e.item):V,[H,V,K]),J=e=>{A?z.includes(e)?z.length>1&&B(t=>t.filter(t=>t!==e)):B(t=>[...t,e]):B([e])},Y=e=>{G(e),B(e?R:[L])};return b(`div`,{className:`rounded-xl border border-text text-text transition-colors`,children:x(c,{identifier:O,children:[b(c.Trigger,{identifier:O,label:N.value,className:`p-0!`,roundedSize:`3xl`,children:x(`div`,{className:`flex w-full items-center justify-between`,children:[b(`div`,{className:`px-2 py-1`,children:b(_,{size:16})}),b(v,{className:`self-center`,size:16})]})}),b(c.Panel,{identifier:O,isOverable:!0,isFocusable:!0,className:`right-0 left-auto`,...k,children:x(e,{className:`max-h-[60vh] min-w-28`,separator:`y`,role:`listbox`,transparency:`xs`,border:!0,roundedSize:`2xl`,borderColor:`text`,"aria-label":P.value,children:[A&&b(`div`,{className:`m-auto p-2`,children:b(l,{defaultValue:W,onChange:Y,color:u.TEXT,size:d.SM,className:`!w-60`,choices:[{content:F.true.value,value:!0},{content:F.false.value,value:!1}]})}),!(A&&W)&&x(y,{children:[b(`div`,{className:`p-3`,children:b(o,{type:`search`,"aria-label":M.ariaLabel.value,placeholder:M.placeholder.value,onChange:e=>U(e.target.value),ref:I})}),b(`ol`,{className:`divide-y divide-dashed divide-text/20 overflow-y-auto p-1`,children:q.map(({locale:e,currentLocaleName:o,ownLocaleName:s})=>b(`li`,{className:`px-1.5 py-1`,children:b(t,{onClick:()=>J(e),label:`${j} ${o}`,disabled:!(R??R).includes(e),isActive:z.includes(e),variant:a.HOVERABLE,color:n.TEXT,isFullWidth:!0,textAlign:i.LEFT,size:r.SM,children:x(`div`,{className:`flex flex-row items-center justify-between gap-3 px-2 py-1`,children:[A&&b(`div`,{className:`w-4`,children:z.includes(e)&&b(g,{className:`size-full`})}),x(`div`,{className:`flex flex-1 flex-row items-center justify-between gap-3 px-2 py-1`,children:[x(`div`,{className:`flex flex-col text-nowrap`,children:[b(`span`,{dir:w(e),lang:e,children:s}),b(`span`,{className:`text-neutral text-xs`,children:o})]}),b(`span`,{className:`text-neutral text-sm`,children:e.toUpperCase()})]})]})})},e))})]})]})})]})})};export{k as LocaleSwitcherContent};
 //# sourceMappingURL=LocaleSwitcherContent.mjs.map

package/dist/esm/components/LocaleSwitcherContentDropDown/LocaleSwitcherContent.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"LocaleSwitcherContent.mjs","names":[],"sources":["../../../../src/components/LocaleSwitcherContentDropDown/LocaleSwitcherContent.tsx"],"sourcesContent":["'use client';\n\nimport { usePersistedStore } from '@hooks/usePersistedStore';\nimport { getHTMLTextDir, getLocaleName } from '@intlayer/core/localization';\nimport { Locales, type LocalesValues } from '@intlayer/types';\nimport Fuse, { type IFuseOptions } from 'fuse.js';\nimport { Check, Globe, MoveVertical } from 'lucide-react';\nimport { type FC, useMemo, useRef, useState } from 'react';\nimport { useIntlayer, useLocale } from 'react-intlayer';\nimport {\n  Button,\n  ButtonColor,\n  ButtonSize,\n  ButtonTextAlign,\n  ButtonVariant,\n} from '../Button';\nimport { Container } from '../Container';\nimport { DropDown, type PanelProps } from '../DropDown';\nimport { Input } from '../Input';\nimport {\n  SwitchSelector,\n  SwitchSelectorColor,\n  SwitchSelectorSize,\n} from '../SwitchSelector';\nimport { useLocaleSwitcherContent } from './LocaleSwitcherContentContext';\n\nexport type LocaleSwitcherContentProps = {\n  panelProps?: Omit<PanelProps, 'identifier'>;\n  isMultilingual?: boolean;\n};\n\nconst DROPDOWN_IDENTIFIER = 'locale-switcher-content';\n\ntype MultilingualAvailableLocales = {\n  locale: LocalesValues;\n  englishName: string;\n  currentLocaleName: string;\n  ownLocaleName: string;\n};\n\nexport const LocaleSwitcherContent: FC<LocaleSwitcherContentProps> = ({\n  panelProps,\n  isMultilingual = true,\n}) => {\n  const {\n    switchTo,\n    searchInput,\n    localeSwitcherLabel,\n    languageListLabel,\n    seeAllLocalesSwitch,\n  } = useIntlayer('locale-switcher-content');\n  const inputRef = useRef<HTMLInputElement>(null);\n  const { locale } = useLocale();\n  const { availableLocales, selectedLocales, setSelectedLocales } =\n    useLocaleSwitcherContent();\n\n  // 1. Memoize the list construction so it doesn't rebuild every render\n  const multilingualAvailableLocales: MultilingualAvailableLocales[] = useMemo(\n    () =>\n      availableLocales.map((localeEl) => {\n        const englishName = getLocaleName(localeEl, Locales.ENGLISH);\n        const currentLocaleName = getLocaleName(localeEl, locale);\n        const ownLocaleName = getLocaleName(localeEl);\n        return {\n          locale: localeEl,\n          englishName,\n          currentLocaleName,\n          ownLocaleName,\n        };\n      }),\n    [availableLocales, locale]\n  );\n\n  // 2. State for Search Query only (Source of Truth)\n  const [searchQuery, setSearchQuery] = useState('');\n\n  const [seeAllLocales, setSeeAllLocales] = usePersistedStore(\n    'locale-content-selector-see-all-locales',\n    false\n  );\n\n  // 3. Memoize Fuse instance\n  const fuse = useMemo(() => {\n    const fuseOptions: IFuseOptions<MultilingualAvailableLocales> = {\n      keys: [\n        { name: 'ownLocaleName', weight: 0.4 },\n        { name: 'englishName', weight: 0.2 },\n        { name: 'currentLocaleName', weight: 0.2 },\n        { name: 'locale', weight: 0.2 },\n      ],\n      threshold: 0.02,\n    };\n    return new Fuse(multilingualAvailableLocales, fuseOptions);\n  }, [multilingualAvailableLocales]);\n\n  // 4. Derive results from Search Query\n  const results = useMemo(() => {\n    if (!searchQuery) {\n      return multilingualAvailableLocales;\n    }\n    return fuse.search(searchQuery).map((result) => result.item);\n  }, [searchQuery, multilingualAvailableLocales, fuse]);\n\n  const handleClickLocale = (localeItem: LocalesValues) => {\n    if (isMultilingual) {\n      if (selectedLocales.includes(localeItem)) {\n        if (selectedLocales.length > 1) {\n          setSelectedLocales((prev) => prev.filter((el) => el !== localeItem));\n        }\n      } else {\n        setSelectedLocales((prev) => [...prev, localeItem]);\n      }\n    } else {\n      setSelectedLocales([localeItem]);\n    }\n  };\n\n  const handleSeeAllLocales = (value: boolean) => {\n    setSeeAllLocales(value);\n\n    if (value) {\n      setSelectedLocales(availableLocales);\n    } else {\n      setSelectedLocales([locale]);\n    }\n  };\n\n  return (\n    <div className=\"rounded-xl border border-text text-text transition-colors\">\n      <DropDown identifier={DROPDOWN_IDENTIFIER}>\n        <DropDown.Trigger\n          identifier={DROPDOWN_IDENTIFIER}\n          label={localeSwitcherLabel.value}\n          className=\"p-0!\"\n          roundedSize=\"3xl\"\n        >\n          <div className=\"flex w-full items-center justify-between\">\n            <div className=\"px-2 py-1\">\n              <Globe size={16} />\n            </div>\n            <MoveVertical className=\"self-center\" size={16} />\n          </div>\n        </DropDown.Trigger>\n\n        <DropDown.Panel\n          identifier={DROPDOWN_IDENTIFIER}\n          isOverable\n          isFocusable\n          className=\"right-0 left-auto\"\n          {...panelProps}\n        >\n          <Container\n            className=\"max-h-[60vh] min-w-28\"\n            separator=\"y\"\n            role=\"listbox\"\n            transparency=\"xs\"\n            border\n            roundedSize=\"2xl\"\n            borderColor=\"text\"\n            aria-label={languageListLabel.value}\n          >\n            {isMultilingual && (\n              <div className=\"m-auto p-2\">\n                <SwitchSelector\n                  defaultValue={seeAllLocales} // Ensure this uses the persisted state\n                  onChange={handleSeeAllLocales}\n                  color={SwitchSelectorColor.TEXT}\n                  size={SwitchSelectorSize.SM}\n                  className=\"!w-60\"\n                  choices={[\n                    {\n                      content: seeAllLocalesSwitch.true.value,\n                      value: true,\n                    },\n                    {\n                      content: seeAllLocalesSwitch.false.value,\n                      value: false,\n                    },\n                  ]}\n                />\n              </div>\n            )}\n\n            {!(isMultilingual && seeAllLocales) && (\n              <>\n                <div className=\"p-3\">\n                  <Input\n                    type=\"search\"\n                    aria-label={searchInput.ariaLabel.value}\n                    placeholder={searchInput.placeholder.value}\n                    // Update search query state directly\n                    onChange={(e) => setSearchQuery(e.target.value)}\n                    ref={inputRef}\n                  />\n                </div>\n                <ol className=\"divide-y divide-dashed divide-text/20 overflow-y-auto p-1\">\n                  {results.map(\n                    ({\n                      locale: localeItem,\n                      currentLocaleName,\n                      ownLocaleName,\n                    }) => (\n                      <li className=\"px-1.5 py-1\" key={localeItem}>\n                        <Button\n                          onClick={() => handleClickLocale(localeItem)}\n                          label={`${switchTo} ${currentLocaleName}`}\n                          disabled={\n                            !(availableLocales ?? availableLocales).includes(\n                              localeItem\n                            )\n                          }\n                          isActive={selectedLocales.includes(localeItem)}\n                          variant={ButtonVariant.HOVERABLE}\n                          color={ButtonColor.TEXT}\n                          isFullWidth\n                          textAlign={ButtonTextAlign.LEFT}\n                          size={ButtonSize.SM}\n                        >\n                          <div className=\"flex flex-row items-center justify-between gap-3 px-2 py-1\">\n                            {isMultilingual && (\n                              <div className=\"w-4\">\n                                {selectedLocales.includes(localeItem) && (\n                                  <Check className=\"size-full\" />\n                                )}\n                              </div>\n                            )}\n                            <div className=\"flex flex-1 flex-row items-center justify-between gap-3 px-2 py-1\">\n                              <div className=\"flex flex-col text-nowrap\">\n                                <span\n                                  dir={getHTMLTextDir(localeItem)}\n                                  lang={localeItem}\n                                >\n                                  {ownLocaleName}\n                                </span>\n                                <span className=\"text-neutral text-xs\">\n                                  {currentLocaleName}\n                                </span>\n                              </div>\n                              <span className=\"text-neutral text-sm\">\n                                {localeItem.toUpperCase()}\n                              </span>\n                            </div>\n                          </div>\n                        </Button>\n                      </li>\n                    )\n                  )}\n                </ol>\n              </>\n            )}\n          </Container>\n        </DropDown.Panel>\n      </DropDown>\n    </div>\n  );\n};\n"],"mappings":"85BA+BA,MAAM,EAAsB,0BASf,GAAyD,CACpE,aACA,iBAAiB,MACb,CACJ,GAAM,CACJ,WACA,cACA,sBACA,oBACA,uBACE,EAAY,0BAA0B,CACpC,EAAW,EAAyB,KAAK,CACzC,CAAE,UAAW,GAAW,CACxB,CAAE,mBAAkB,kBAAiB,sBACzC,GAA0B,CAGtB,EAA+D,MAEjE,EAAiB,IAAK,IAIb,CACL,OAAQ,EACR,YALkB,EAAc,EAAU,EAAQ,QAAQ,CAM1D,kBALwB,EAAc,EAAU,EAAO,CAMvD,cALoB,EAAc,EAAS,CAM5C,EACD,CACJ,CAAC,EAAkB,EAAO,CAC3B,CAGK,CAAC,EAAa,GAAkB,EAAS,GAAG,CAE5C,CAAC,EAAe,GAAoB,EACxC,0CACA,GACD,CAGK,EAAO,MAUJ,IAAI,EAAK,EATgD,CAC9D,KAAM,CACJ,CAAE,KAAM,gBAAiB,OAAQ,GAAK,CACtC,CAAE,KAAM,cAAe,OAAQ,GAAK,CACpC,CAAE,KAAM,oBAAqB,OAAQ,GAAK,CAC1C,CAAE,KAAM,SAAU,OAAQ,GAAK,CAChC,CACD,UAAW,IACZ,CACyD,CACzD,CAAC,EAA6B,CAAC,CAG5B,EAAU,MACT,EAGE,EAAK,OAAO,EAAY,CAAC,IAAK,GAAW,EAAO,KAAK,CAFnD,EAGR,CAAC,EAAa,EAA8B,EAAK,CAAC,CAE/C,EAAqB,GAA8B,CACnD,EACE,EAAgB,SAAS,EAAW,CAClC,EAAgB,OAAS,GAC3B,EAAoB,GAAS,EAAK,OAAQ,GAAO,IAAO,EAAW,CAAC,CAGtE,EAAoB,GAAS,CAAC,GAAG,EAAM,EAAW,CAAC,CAGrD,EAAmB,CAAC,EAAW,CAAC,EAI9B,EAAuB,GAAmB,CAC9C,EAAiB,EAAM,CAGrB,EADE,EACiB,EAEA,CAAC,EAAO,CAAC,EAIhC,OACE,EAAC,MAAD,CAAK,UAAU,qEACb,EAAC,EAAD,CAAU,WAAY,WAAtB,CACE,EAAC,EAAS,QAAV,CACE,WAAY,EACZ,MAAO,EAAoB,MAC3B,UAAU,OACV,YAAY,eAEZ,EAAC,MAAD,CAAK,UAAU,oDAAf,CACE,EAAC,MAAD,CAAK,UAAU,qBACb,EAAC,EAAD,CAAO,KAAM,GAAM,CAAA,CACf,CAAA,CACN,EAAC,EAAD,CAAc,UAAU,cAAc,KAAM,GAAM,CAAA,CAC9C,GACW,CAAA,CAEnB,EAAC,EAAS,MAAV,CACE,WAAY,EACZ,WAAA,GACA,YAAA,GACA,UAAU,oBACV,GAAI,WAEJ,EAAC,EAAD,CACE,UAAU,wBACV,UAAU,IACV,KAAK,UACL,aAAa,KACb,OAAA,GACA,YAAY,MACZ,YAAY,OACZ,aAAY,EAAkB,eARhC,CAUG,GACC,EAAC,MAAD,CAAK,UAAU,sBACb,EAAC,EAAD,CACE,aAAc,EACd,SAAU,EACV,MAAO,EAAoB,KAC3B,KAAM,EAAmB,GACzB,UAAU,QACV,QAAS,CACP,CACE,QAAS,EAAoB,KAAK,MAClC,MAAO,GACR,CACD,CACE,QAAS,EAAoB,MAAM,MACnC,MAAO,GACR,CACF,CACD,CAAA,CACE,CAAA,CAGP,EAAE,GAAkB,IACnB,EAAA,EAAA,CAAA,SAAA,CACE,EAAC,MAAD,CAAK,UAAU,eACb,EAAC,EAAD,CACE,KAAK,SACL,aAAY,EAAY,UAAU,MAClC,YAAa,EAAY,YAAY,MAErC,SAAW,GAAM,EAAe,EAAE,OAAO,MAAM,CAC/C,IAAK,EACL,CAAA,CACE,CAAA,CACN,EAAC,KAAD,CAAI,UAAU,qEACX,EAAQ,KACN,CACC,OAAQ,EACR,oBACA,mBAEA,EAAC,KAAD,CAAI,UAAU,uBACZ,EAAC,EAAD,CACE,YAAe,EAAkB,EAAW,CAC5C,MAAO,GAAG,EAAS,GAAG,IACtB,SACE,EAAE,GAAoB,GAAkB,SACtC,EACD,CAEH,SAAU,EAAgB,SAAS,EAAW,CAC9C,QAAS,EAAc,UACvB,MAAO,EAAY,KACnB,YAAA,GACA,UAAW,EAAgB,KAC3B,KAAM,EAAW,YAEjB,EAAC,MAAD,CAAK,UAAU,sEAAf,CACG,GACC,EAAC,MAAD,CAAK,UAAU,eACZ,EAAgB,SAAS,EAAW,EACnC,EAAC,EAAD,CAAO,UAAU,YAAc,CAAA,CAE7B,CAAA,CAER,EAAC,MAAD,CAAK,UAAU,6EAAf,CACE,EAAC,MAAD,CAAK,UAAU,qCAAf,CACE,EAAC,OAAD,CACE,IAAK,EAAe,EAAW,CAC/B,KAAM,WAEL,EACI,CAAA,CACP,EAAC,OAAD,CAAM,UAAU,gCACb,EACI,CAAA,CACH,GACN,EAAC,OAAD,CAAM,UAAU,gCACb,EAAW,aAAa,CACpB,CAAA,CACH,GACF,GACC,CAAA,CACN,CA1C4B,EA0C5B,CAER,CACE,CAAA,CACJ,CAAA,CAAA,CAEK,GACG,CAAA,CACR,GACP,CAAA"}
+{"version":3,"file":"LocaleSwitcherContent.mjs","names":[],"sources":["../../../../src/components/LocaleSwitcherContentDropDown/LocaleSwitcherContent.tsx"],"sourcesContent":["'use client';\n\nimport { usePersistedStore } from '@hooks/usePersistedStore';\nimport { getHTMLTextDir, getLocaleName } from '@intlayer/core/localization';\nimport type { LocalesValues } from '@intlayer/types/module_augmentation';\nimport * as Locales from '@intlayer/types/locales';\nimport Fuse, { type IFuseOptions } from 'fuse.js';\nimport { Check, Globe, MoveVertical } from 'lucide-react';\nimport { type FC, useMemo, useRef, useState } from 'react';\nimport { useIntlayer, useLocale } from 'react-intlayer';\nimport {\n  Button,\n  ButtonColor,\n  ButtonSize,\n  ButtonTextAlign,\n  ButtonVariant,\n} from '../Button';\nimport { Container } from '../Container';\nimport { DropDown, type PanelProps } from '../DropDown';\nimport { Input } from '../Input';\nimport {\n  SwitchSelector,\n  SwitchSelectorColor,\n  SwitchSelectorSize,\n} from '../SwitchSelector';\nimport { useLocaleSwitcherContent } from './LocaleSwitcherContentContext';\n\nexport type LocaleSwitcherContentProps = {\n  panelProps?: Omit<PanelProps, 'identifier'>;\n  isMultilingual?: boolean;\n};\n\nconst DROPDOWN_IDENTIFIER = 'locale-switcher-content';\n\ntype MultilingualAvailableLocales = {\n  locale: LocalesValues;\n  englishName: string;\n  currentLocaleName: string;\n  ownLocaleName: string;\n};\n\nexport const LocaleSwitcherContent: FC<LocaleSwitcherContentProps> = ({\n  panelProps,\n  isMultilingual = true,\n}) => {\n  const {\n    switchTo,\n    searchInput,\n    localeSwitcherLabel,\n    languageListLabel,\n    seeAllLocalesSwitch,\n  } = useIntlayer('locale-switcher-content');\n  const inputRef = useRef<HTMLInputElement>(null);\n  const { locale } = useLocale();\n  const { availableLocales, selectedLocales, setSelectedLocales } =\n    useLocaleSwitcherContent();\n\n  // 1. Memoize the list construction so it doesn't rebuild every render\n  const multilingualAvailableLocales: MultilingualAvailableLocales[] = useMemo(\n    () =>\n      availableLocales.map((localeEl) => {\n        const englishName = getLocaleName(localeEl, Locales.ENGLISH);\n        const currentLocaleName = getLocaleName(localeEl, locale);\n        const ownLocaleName = getLocaleName(localeEl);\n        return {\n          locale: localeEl,\n          englishName,\n          currentLocaleName,\n          ownLocaleName,\n        };\n      }),\n    [availableLocales, locale]\n  );\n\n  // 2. State for Search Query only (Source of Truth)\n  const [searchQuery, setSearchQuery] = useState('');\n\n  const [seeAllLocales, setSeeAllLocales] = usePersistedStore(\n    'locale-content-selector-see-all-locales',\n    false\n  );\n\n  // 3. Memoize Fuse instance\n  const fuse = useMemo(() => {\n    const fuseOptions: IFuseOptions<MultilingualAvailableLocales> = {\n      keys: [\n        { name: 'ownLocaleName', weight: 0.4 },\n        { name: 'englishName', weight: 0.2 },\n        { name: 'currentLocaleName', weight: 0.2 },\n        { name: 'locale', weight: 0.2 },\n      ],\n      threshold: 0.02,\n    };\n    return new Fuse(multilingualAvailableLocales, fuseOptions);\n  }, [multilingualAvailableLocales]);\n\n  // 4. Derive results from Search Query\n  const results = useMemo(() => {\n    if (!searchQuery) {\n      return multilingualAvailableLocales;\n    }\n    return fuse.search(searchQuery).map((result) => result.item);\n  }, [searchQuery, multilingualAvailableLocales, fuse]);\n\n  const handleClickLocale = (localeItem: LocalesValues) => {\n    if (isMultilingual) {\n      if (selectedLocales.includes(localeItem)) {\n        if (selectedLocales.length > 1) {\n          setSelectedLocales((prev) => prev.filter((el) => el !== localeItem));\n        }\n      } else {\n        setSelectedLocales((prev) => [...prev, localeItem]);\n      }\n    } else {\n      setSelectedLocales([localeItem]);\n    }\n  };\n\n  const handleSeeAllLocales = (value: boolean) => {\n    setSeeAllLocales(value);\n\n    if (value) {\n      setSelectedLocales(availableLocales);\n    } else {\n      setSelectedLocales([locale]);\n    }\n  };\n\n  return (\n    <div className=\"rounded-xl border border-text text-text transition-colors\">\n      <DropDown identifier={DROPDOWN_IDENTIFIER}>\n        <DropDown.Trigger\n          identifier={DROPDOWN_IDENTIFIER}\n          label={localeSwitcherLabel.value}\n          className=\"p-0!\"\n          roundedSize=\"3xl\"\n        >\n          <div className=\"flex w-full items-center justify-between\">\n            <div className=\"px-2 py-1\">\n              <Globe size={16} />\n            </div>\n            <MoveVertical className=\"self-center\" size={16} />\n          </div>\n        </DropDown.Trigger>\n\n        <DropDown.Panel\n          identifier={DROPDOWN_IDENTIFIER}\n          isOverable\n          isFocusable\n          className=\"right-0 left-auto\"\n          {...panelProps}\n        >\n          <Container\n            className=\"max-h-[60vh] min-w-28\"\n            separator=\"y\"\n            role=\"listbox\"\n            transparency=\"xs\"\n            border\n            roundedSize=\"2xl\"\n            borderColor=\"text\"\n            aria-label={languageListLabel.value}\n          >\n            {isMultilingual && (\n              <div className=\"m-auto p-2\">\n                <SwitchSelector\n                  defaultValue={seeAllLocales} // Ensure this uses the persisted state\n                  onChange={handleSeeAllLocales}\n                  color={SwitchSelectorColor.TEXT}\n                  size={SwitchSelectorSize.SM}\n                  className=\"!w-60\"\n                  choices={[\n                    {\n                      content: seeAllLocalesSwitch.true.value,\n                      value: true,\n                    },\n                    {\n                      content: seeAllLocalesSwitch.false.value,\n                      value: false,\n                    },\n                  ]}\n                />\n              </div>\n            )}\n\n            {!(isMultilingual && seeAllLocales) && (\n              <>\n                <div className=\"p-3\">\n                  <Input\n                    type=\"search\"\n                    aria-label={searchInput.ariaLabel.value}\n                    placeholder={searchInput.placeholder.value}\n                    // Update search query state directly\n                    onChange={(e) => setSearchQuery(e.target.value)}\n                    ref={inputRef}\n                  />\n                </div>\n                <ol className=\"divide-y divide-dashed divide-text/20 overflow-y-auto p-1\">\n                  {results.map(\n                    ({\n                      locale: localeItem,\n                      currentLocaleName,\n                      ownLocaleName,\n                    }) => (\n                      <li className=\"px-1.5 py-1\" key={localeItem}>\n                        <Button\n                          onClick={() => handleClickLocale(localeItem)}\n                          label={`${switchTo} ${currentLocaleName}`}\n                          disabled={\n                            !(availableLocales ?? availableLocales).includes(\n                              localeItem\n                            )\n                          }\n                          isActive={selectedLocales.includes(localeItem)}\n                          variant={ButtonVariant.HOVERABLE}\n                          color={ButtonColor.TEXT}\n                          isFullWidth\n                          textAlign={ButtonTextAlign.LEFT}\n                          size={ButtonSize.SM}\n                        >\n                          <div className=\"flex flex-row items-center justify-between gap-3 px-2 py-1\">\n                            {isMultilingual && (\n                              <div className=\"w-4\">\n                                {selectedLocales.includes(localeItem) && (\n                                  <Check className=\"size-full\" />\n                                )}\n                              </div>\n                            )}\n                            <div className=\"flex flex-1 flex-row items-center justify-between gap-3 px-2 py-1\">\n                              <div className=\"flex flex-col text-nowrap\">\n                                <span\n                                  dir={getHTMLTextDir(localeItem)}\n                                  lang={localeItem}\n                                >\n                                  {ownLocaleName}\n                                </span>\n                                <span className=\"text-neutral text-xs\">\n                                  {currentLocaleName}\n                                </span>\n                              </div>\n                              <span className=\"text-neutral text-sm\">\n                                {localeItem.toUpperCase()}\n                              </span>\n                            </div>\n                          </div>\n                        </Button>\n                      </li>\n                    )\n                  )}\n                </ol>\n              </>\n            )}\n          </Container>\n        </DropDown.Panel>\n      </DropDown>\n    </div>\n  );\n};\n"],"mappings":"85BAgCA,MAAM,EAAsB,0BASf,GAAyD,CACpE,aACA,iBAAiB,MACb,CACJ,GAAM,CACJ,WACA,cACA,sBACA,oBACA,uBACE,EAAY,0BAA0B,CACpC,EAAW,EAAyB,KAAK,CACzC,CAAE,UAAW,GAAW,CACxB,CAAE,mBAAkB,kBAAiB,sBACzC,GAA0B,CAGtB,EAA+D,MAEjE,EAAiB,IAAK,IAIb,CACL,OAAQ,EACR,YALkB,EAAc,EAAU,EAAQ,QAAQ,CAM1D,kBALwB,EAAc,EAAU,EAAO,CAMvD,cALoB,EAAc,EAAS,CAM5C,EACD,CACJ,CAAC,EAAkB,EAAO,CAC3B,CAGK,CAAC,EAAa,GAAkB,EAAS,GAAG,CAE5C,CAAC,EAAe,GAAoB,EACxC,0CACA,GACD,CAGK,EAAO,MAUJ,IAAI,EAAK,EATgD,CAC9D,KAAM,CACJ,CAAE,KAAM,gBAAiB,OAAQ,GAAK,CACtC,CAAE,KAAM,cAAe,OAAQ,GAAK,CACpC,CAAE,KAAM,oBAAqB,OAAQ,GAAK,CAC1C,CAAE,KAAM,SAAU,OAAQ,GAAK,CAChC,CACD,UAAW,IACZ,CACyD,CACzD,CAAC,EAA6B,CAAC,CAG5B,EAAU,MACT,EAGE,EAAK,OAAO,EAAY,CAAC,IAAK,GAAW,EAAO,KAAK,CAFnD,EAGR,CAAC,EAAa,EAA8B,EAAK,CAAC,CAE/C,EAAqB,GAA8B,CACnD,EACE,EAAgB,SAAS,EAAW,CAClC,EAAgB,OAAS,GAC3B,EAAoB,GAAS,EAAK,OAAQ,GAAO,IAAO,EAAW,CAAC,CAGtE,EAAoB,GAAS,CAAC,GAAG,EAAM,EAAW,CAAC,CAGrD,EAAmB,CAAC,EAAW,CAAC,EAI9B,EAAuB,GAAmB,CAC9C,EAAiB,EAAM,CAGrB,EADE,EACiB,EAEA,CAAC,EAAO,CAAC,EAIhC,OACE,EAAC,MAAD,CAAK,UAAU,qEACb,EAAC,EAAD,CAAU,WAAY,WAAtB,CACE,EAAC,EAAS,QAAV,CACE,WAAY,EACZ,MAAO,EAAoB,MAC3B,UAAU,OACV,YAAY,eAEZ,EAAC,MAAD,CAAK,UAAU,oDAAf,CACE,EAAC,MAAD,CAAK,UAAU,qBACb,EAAC,EAAD,CAAO,KAAM,GAAM,CAAA,CACf,CAAA,CACN,EAAC,EAAD,CAAc,UAAU,cAAc,KAAM,GAAM,CAAA,CAC9C,GACW,CAAA,CAEnB,EAAC,EAAS,MAAV,CACE,WAAY,EACZ,WAAA,GACA,YAAA,GACA,UAAU,oBACV,GAAI,WAEJ,EAAC,EAAD,CACE,UAAU,wBACV,UAAU,IACV,KAAK,UACL,aAAa,KACb,OAAA,GACA,YAAY,MACZ,YAAY,OACZ,aAAY,EAAkB,eARhC,CAUG,GACC,EAAC,MAAD,CAAK,UAAU,sBACb,EAAC,EAAD,CACE,aAAc,EACd,SAAU,EACV,MAAO,EAAoB,KAC3B,KAAM,EAAmB,GACzB,UAAU,QACV,QAAS,CACP,CACE,QAAS,EAAoB,KAAK,MAClC,MAAO,GACR,CACD,CACE,QAAS,EAAoB,MAAM,MACnC,MAAO,GACR,CACF,CACD,CAAA,CACE,CAAA,CAGP,EAAE,GAAkB,IACnB,EAAA,EAAA,CAAA,SAAA,CACE,EAAC,MAAD,CAAK,UAAU,eACb,EAAC,EAAD,CACE,KAAK,SACL,aAAY,EAAY,UAAU,MAClC,YAAa,EAAY,YAAY,MAErC,SAAW,GAAM,EAAe,EAAE,OAAO,MAAM,CAC/C,IAAK,EACL,CAAA,CACE,CAAA,CACN,EAAC,KAAD,CAAI,UAAU,qEACX,EAAQ,KACN,CACC,OAAQ,EACR,oBACA,mBAEA,EAAC,KAAD,CAAI,UAAU,uBACZ,EAAC,EAAD,CACE,YAAe,EAAkB,EAAW,CAC5C,MAAO,GAAG,EAAS,GAAG,IACtB,SACE,EAAE,GAAoB,GAAkB,SACtC,EACD,CAEH,SAAU,EAAgB,SAAS,EAAW,CAC9C,QAAS,EAAc,UACvB,MAAO,EAAY,KACnB,YAAA,GACA,UAAW,EAAgB,KAC3B,KAAM,EAAW,YAEjB,EAAC,MAAD,CAAK,UAAU,sEAAf,CACG,GACC,EAAC,MAAD,CAAK,UAAU,eACZ,EAAgB,SAAS,EAAW,EACnC,EAAC,EAAD,CAAO,UAAU,YAAc,CAAA,CAE7B,CAAA,CAER,EAAC,MAAD,CAAK,UAAU,6EAAf,CACE,EAAC,MAAD,CAAK,UAAU,qCAAf,CACE,EAAC,OAAD,CACE,IAAK,EAAe,EAAW,CAC/B,KAAM,WAEL,EACI,CAAA,CACP,EAAC,OAAD,CAAM,UAAU,gCACb,EACI,CAAA,CACH,GACN,EAAC,OAAD,CAAM,UAAU,gCACb,EAAW,aAAa,CACpB,CAAA,CACH,GACF,GACC,CAAA,CACN,CA1C4B,EA0C5B,CAER,CACE,CAAA,CACJ,CAAA,CAAA,CAEK,GACG,CAAA,CACR,GACP,CAAA"}

package/dist/esm/components/LocaleSwitcherDropDown/LocaleSwitcher.mjs

@@ -1,2 +1,2 @@
-"use client";import{Container as e}from"../Container/index.mjs";import{Button as t,ButtonColor as n,ButtonTextAlign as r,ButtonVariant as i}from"../Button/Button.mjs";import{Input as a}from"../Input/Input.mjs";import{DropDown as o}from"../DropDown/index.mjs";import{MoveVertical as s}from"lucide-react";import{useCallback as c,useMemo as l,useRef as u,useState as d}from"react";import{jsx as f,jsxs as p}from"react/jsx-runtime";import{useIntlayer as m}from"react-intlayer";import{getHTMLTextDir as h,getLocaleName as g}from"@intlayer/core/localization";import{Locales as _}from"@intlayer/types";import v from"fuse.js";const y=`locale-switcher`,b=({locale:b,localeList:x,availableLocales:S,fullLocaleName:C=!0,setLocale:w,panelProps:T})=>{let E=`Select a locale`,{switchTo:D,searchInput:O,languageListLabel:k,localeSwitcherLabel:A}=m(`locale-switcher`),j=u(null),M=l(()=>x.map(e=>({locale:e,englishName:g(e,_.ENGLISH),currentLocaleName:g(e,b),ownLocaleName:g(e)})),[x,b]),[N,P]=d(M),F=l(()=>new v(M,{keys:[{name:`ownLocaleName`,weight:.4},{name:`englishName`,weight:.2},{name:`currentLocaleName`,weight:.2},{name:`locale`,weight:.2}],threshold:.02}),[M]),I=c(e=>{P(e?F.search(e).map(e=>e.item):M)},[F,M]);return b&&(E=C?g(b):b.toUpperCase()),f(`nav`,{className:`rounded-xl border border-text text-text transition-colors`,"aria-label":A.value,children:p(o,{identifier:y,children:[f(o.Trigger,{identifier:y,children:p(`div`,{className:`flex w-full items-center justify-between`,children:[f(`div`,{className:`text-nowrap px-2`,children:E}),f(s,{className:`w-5 self-center`})]})}),f(o.Panel,{identifier:y,isOverable:!0,isFocusable:!0,...T,children:p(e,{className:`max-h-[80vh] min-w-28`,separator:`y`,role:`listbox`,transparency:`xs`,"aria-label":k.value,children:[f(`div`,{className:`p-3`,children:f(a,{type:`search`,"aria-label":O.ariaLabel.value,placeholder:O.placeholder.value,onChange:e=>I(e.target.value),ref:j})}),f(`ol`,{className:`divide-y divide-dashed divide-text/20 overflow-y-auto p-1`,children:N.map(({locale:e,currentLocaleName:a,ownLocaleName:o})=>f(`li`,{className:`px-1.5 py-1`,children:f(t,{onClick:()=>w(e),label:`${D} ${a}`,disabled:!(S??x).includes(e),isActive:b===e,variant:i.HOVERABLE,color:n.TEXT,isFullWidth:!0,textAlign:r.LEFT,children:p(`div`,{className:`flex flex-row items-center justify-between gap-3 px-2 py-1`,children:[p(`div`,{className:`flex flex-col text-nowrap`,children:[f(`span`,{dir:h(e),lang:e,suppressHydrationWarning:!0,children:o}),f(`span`,{className:`text-neutral text-xs`,suppressHydrationWarning:!0,children:a})]}),f(`span`,{className:`text-neutral text-sm`,children:e.toUpperCase()})]})})},e))})]})})]})})};export{b as LocaleSwitcher};
+"use client";import{Container as e}from"../Container/index.mjs";import{Button as t,ButtonColor as n,ButtonTextAlign as r,ButtonVariant as i}from"../Button/Button.mjs";import{Input as a}from"../Input/Input.mjs";import{DropDown as o}from"../DropDown/index.mjs";import{useCallback as s,useMemo as c,useRef as l,useState as u}from"react";import{MoveVertical as d}from"lucide-react";import{jsx as f,jsxs as p}from"react/jsx-runtime";import{useIntlayer as m}from"react-intlayer";import{getHTMLTextDir as h,getLocaleName as g}from"@intlayer/core/localization";import*as _ from"@intlayer/types/locales";import v from"fuse.js";const y=`locale-switcher`,b=({locale:b,localeList:x,availableLocales:S,fullLocaleName:C=!0,setLocale:w,panelProps:T})=>{let E=`Select a locale`,{switchTo:D,searchInput:O,languageListLabel:k,localeSwitcherLabel:A}=m(`locale-switcher`),j=l(null),M=c(()=>x.map(e=>({locale:e,englishName:g(e,_.ENGLISH),currentLocaleName:g(e,b),ownLocaleName:g(e)})),[x,b]),[N,P]=u(M),F=c(()=>new v(M,{keys:[{name:`ownLocaleName`,weight:.4},{name:`englishName`,weight:.2},{name:`currentLocaleName`,weight:.2},{name:`locale`,weight:.2}],threshold:.02}),[M]),I=s(e=>{P(e?F.search(e).map(e=>e.item):M)},[F,M]);return b&&(E=C?g(b):b.toUpperCase()),f(`nav`,{className:`rounded-xl border border-text text-text transition-colors`,"aria-label":A.value,children:p(o,{identifier:y,children:[f(o.Trigger,{identifier:y,children:p(`div`,{className:`flex w-full items-center justify-between`,children:[f(`div`,{className:`text-nowrap px-2`,children:E}),f(d,{className:`w-5 self-center`})]})}),f(o.Panel,{identifier:y,isOverable:!0,isFocusable:!0,...T,children:p(e,{className:`max-h-[80vh] min-w-28`,separator:`y`,role:`listbox`,transparency:`xs`,"aria-label":k.value,children:[f(`div`,{className:`p-3`,children:f(a,{type:`search`,"aria-label":O.ariaLabel.value,placeholder:O.placeholder.value,onChange:e=>I(e.target.value),ref:j})}),f(`ol`,{className:`divide-y divide-dashed divide-text/20 overflow-y-auto p-1`,children:N.map(({locale:e,currentLocaleName:a,ownLocaleName:o})=>f(`li`,{className:`px-1.5 py-1`,children:f(t,{onClick:()=>w(e),label:`${D} ${a}`,disabled:!(S??x).includes(e),isActive:b===e,variant:i.HOVERABLE,color:n.TEXT,isFullWidth:!0,textAlign:r.LEFT,children:p(`div`,{className:`flex flex-row items-center justify-between gap-3 px-2 py-1`,children:[p(`div`,{className:`flex flex-col text-nowrap`,children:[f(`span`,{dir:h(e),lang:e,suppressHydrationWarning:!0,children:o}),f(`span`,{className:`text-neutral text-xs`,suppressHydrationWarning:!0,children:a})]}),f(`span`,{className:`text-neutral text-sm`,children:e.toUpperCase()})]})})},e))})]})})]})})};export{b as LocaleSwitcher};
 //# sourceMappingURL=LocaleSwitcher.mjs.map

package/dist/esm/components/LocaleSwitcherDropDown/LocaleSwitcher.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"LocaleSwitcher.mjs","names":[],"sources":["../../../../src/components/LocaleSwitcherDropDown/LocaleSwitcher.tsx"],"sourcesContent":["'use client';\n\nimport { getHTMLTextDir, getLocaleName } from '@intlayer/core/localization';\nimport { type Locale, Locales } from '@intlayer/types';\nimport Fuse, { type IFuseOptions } from 'fuse.js';\nimport { MoveVertical } from 'lucide-react';\nimport { type FC, useCallback, useMemo, useRef, useState } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Button, ButtonColor, ButtonTextAlign, ButtonVariant } from '../Button';\nimport { Container } from '../Container';\nimport { DropDown, type PanelProps } from '../DropDown';\nimport { Input } from '../Input';\n\nexport type LocaleSwitcherProps = {\n  locale?: Locale;\n  localeList: Locale[];\n  availableLocales?: Locale[];\n  fullLocaleName?: boolean;\n  setLocale: (locale: Locale) => void;\n  panelProps?: Omit<PanelProps, 'identifier'>;\n};\n\nconst DROPDOWN_IDENTIFIER = 'locale-switcher';\n\ntype MultilingualAvailableLocales = {\n  locale: Locale;\n  englishName: string;\n  currentLocaleName: string;\n  ownLocaleName: string;\n};\n\nexport const LocaleSwitcher: FC<LocaleSwitcherProps> = ({\n  locale,\n  localeList,\n  availableLocales,\n  fullLocaleName = true,\n  setLocale,\n  panelProps,\n}) => {\n  let localeName = 'Select a locale';\n  const { switchTo, searchInput, languageListLabel, localeSwitcherLabel } =\n    useIntlayer('locale-switcher');\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const multilingualAvailableLocales: MultilingualAvailableLocales[] = useMemo(\n    () =>\n      localeList.map((localeEl) => {\n        const englishName = getLocaleName(localeEl, Locales.ENGLISH);\n        const currentLocaleName = getLocaleName(localeEl, locale);\n        const ownLocaleName = getLocaleName(localeEl);\n        return {\n          locale: localeEl,\n          englishName,\n          currentLocaleName,\n          ownLocaleName,\n        };\n      }),\n    [localeList, locale]\n  );\n\n  const [results, setResults] = useState<MultilingualAvailableLocales[]>(\n    multilingualAvailableLocales\n  );\n\n  // Create a new Fuse instance with the options and documentation data\n  const fuse = useMemo(() => {\n    const fuseOptions: IFuseOptions<MultilingualAvailableLocales> = {\n      keys: [\n        { name: 'ownLocaleName', weight: 0.4 },\n        { name: 'englishName', weight: 0.2 },\n        { name: 'currentLocaleName', weight: 0.2 },\n        { name: 'locale', weight: 0.2 },\n      ],\n      threshold: 0.02, // Defines how fuzzy the matching should be (lower is more strict)\n    };\n\n    return new Fuse(multilingualAvailableLocales, fuseOptions);\n  }, [multilingualAvailableLocales]);\n\n  const handleSearch = useCallback(\n    (searchQuery: string) => {\n      if (searchQuery) {\n        // Perform search on every input change\n        const searchResults = fuse\n          .search(searchQuery)\n          .map((result) => result.item);\n        setResults(searchResults);\n      } else {\n        setResults(multilingualAvailableLocales);\n      }\n    },\n    [fuse, multilingualAvailableLocales]\n  );\n\n  if (locale) {\n    localeName = fullLocaleName ? getLocaleName(locale) : locale.toUpperCase();\n  }\n\n  return (\n    <nav\n      className=\"rounded-xl border border-text text-text transition-colors\"\n      aria-label={localeSwitcherLabel.value}\n    >\n      <DropDown identifier={DROPDOWN_IDENTIFIER}>\n        <DropDown.Trigger identifier={DROPDOWN_IDENTIFIER}>\n          <div className=\"flex w-full items-center justify-between\">\n            <div className=\"text-nowrap px-2\">{localeName}</div>\n            <MoveVertical className=\"w-5 self-center\" />\n          </div>\n        </DropDown.Trigger>\n\n        <DropDown.Panel\n          identifier={DROPDOWN_IDENTIFIER}\n          isOverable\n          isFocusable\n          {...panelProps}\n        >\n          <Container\n            className=\"max-h-[80vh] min-w-28\"\n            separator=\"y\"\n            role=\"listbox\"\n            transparency=\"xs\"\n            aria-label={languageListLabel.value}\n          >\n            <div className=\"p-3\">\n              <Input\n                type=\"search\"\n                aria-label={searchInput.ariaLabel.value}\n                placeholder={searchInput.placeholder.value}\n                onChange={(e) => handleSearch(e.target.value)}\n                ref={inputRef}\n              />\n            </div>\n            <ol className=\"divide-y divide-dashed divide-text/20 overflow-y-auto p-1\">\n              {results.map(\n                ({ locale: localeItem, currentLocaleName, ownLocaleName }) => (\n                  <li className=\"px-1.5 py-1\" key={localeItem}>\n                    <Button\n                      onClick={() => setLocale(localeItem)}\n                      label={`${switchTo} ${currentLocaleName}`}\n                      disabled={\n                        !(availableLocales ?? localeList).includes(localeItem)\n                      }\n                      isActive={locale === localeItem}\n                      variant={ButtonVariant.HOVERABLE}\n                      color={ButtonColor.TEXT}\n                      isFullWidth\n                      textAlign={ButtonTextAlign.LEFT}\n                    >\n                      <div className=\"flex flex-row items-center justify-between gap-3 px-2 py-1\">\n                        <div className=\"flex flex-col text-nowrap\">\n                          <span\n                            dir={getHTMLTextDir(localeItem)}\n                            lang={localeItem}\n                            suppressHydrationWarning\n                          >\n                            {ownLocaleName}\n                          </span>\n                          <span\n                            className=\"text-neutral text-xs\"\n                            suppressHydrationWarning\n                          >\n                            {currentLocaleName}\n                          </span>\n                        </div>\n                        <span className=\"text-neutral text-sm\">\n                          {localeItem.toUpperCase()}\n                        </span>\n                      </div>\n                    </Button>\n                  </li>\n                )\n              )}\n            </ol>\n          </Container>\n        </DropDown.Panel>\n      </DropDown>\n    </nav>\n  );\n};\n"],"mappings":"0mBAsBA,MAAM,EAAsB,kBASf,GAA2C,CACtD,SACA,aACA,mBACA,iBAAiB,GACjB,YACA,gBACI,CACJ,IAAI,EAAa,kBACX,CAAE,WAAU,cAAa,oBAAmB,uBAChD,EAAY,kBAAkB,CAC1B,EAAW,EAAyB,KAAK,CAEzC,EAA+D,MAEjE,EAAW,IAAK,IAIP,CACL,OAAQ,EACR,YALkB,EAAc,EAAU,EAAQ,QAAQ,CAM1D,kBALwB,EAAc,EAAU,EAAO,CAMvD,cALoB,EAAc,EAAS,CAM5C,EACD,CACJ,CAAC,EAAY,EAAO,CACrB,CAEK,CAAC,EAAS,GAAc,EAC5B,EACD,CAGK,EAAO,MAWJ,IAAI,EAAK,EAVgD,CAC9D,KAAM,CACJ,CAAE,KAAM,gBAAiB,OAAQ,GAAK,CACtC,CAAE,KAAM,cAAe,OAAQ,GAAK,CACpC,CAAE,KAAM,oBAAqB,OAAQ,GAAK,CAC1C,CAAE,KAAM,SAAU,OAAQ,GAAK,CAChC,CACD,UAAW,IACZ,CAEyD,CACzD,CAAC,EAA6B,CAAC,CAE5B,EAAe,EAClB,GAAwB,CAMrB,EALE,EAEoB,EACnB,OAAO,EAAY,CACnB,IAAK,GAAW,EAAO,KAAK,CAGpB,EAA6B,EAG5C,CAAC,EAAM,EAA6B,CACrC,CAMD,OAJI,IACF,EAAa,EAAiB,EAAc,EAAO,CAAG,EAAO,aAAa,EAI1E,EAAC,MAAD,CACE,UAAU,4DACV,aAAY,EAAoB,eAEhC,EAAC,EAAD,CAAU,WAAY,WAAtB,CACE,EAAC,EAAS,QAAV,CAAkB,WAAY,WAC5B,EAAC,MAAD,CAAK,UAAU,oDAAf,CACE,EAAC,MAAD,CAAK,UAAU,4BAAoB,EAAiB,CAAA,CACpD,EAAC,EAAD,CAAc,UAAU,kBAAoB,CAAA,CACxC,GACW,CAAA,CAEnB,EAAC,EAAS,MAAV,CACE,WAAY,EACZ,WAAA,GACA,YAAA,GACA,GAAI,WAEJ,EAAC,EAAD,CACE,UAAU,wBACV,UAAU,IACV,KAAK,UACL,aAAa,KACb,aAAY,EAAkB,eALhC,CAOE,EAAC,MAAD,CAAK,UAAU,eACb,EAAC,EAAD,CACE,KAAK,SACL,aAAY,EAAY,UAAU,MAClC,YAAa,EAAY,YAAY,MACrC,SAAW,GAAM,EAAa,EAAE,OAAO,MAAM,CAC7C,IAAK,EACL,CAAA,CACE,CAAA,CACN,EAAC,KAAD,CAAI,UAAU,qEACX,EAAQ,KACN,CAAE,OAAQ,EAAY,oBAAmB,mBACxC,EAAC,KAAD,CAAI,UAAU,uBACZ,EAAC,EAAD,CACE,YAAe,EAAU,EAAW,CACpC,MAAO,GAAG,EAAS,GAAG,IACtB,SACE,EAAE,GAAoB,GAAY,SAAS,EAAW,CAExD,SAAU,IAAW,EACrB,QAAS,EAAc,UACvB,MAAO,EAAY,KACnB,YAAA,GACA,UAAW,EAAgB,cAE3B,EAAC,MAAD,CAAK,UAAU,sEAAf,CACE,EAAC,MAAD,CAAK,UAAU,qCAAf,CACE,EAAC,OAAD,CACE,IAAK,EAAe,EAAW,CAC/B,KAAM,EACN,yBAAA,YAEC,EACI,CAAA,CACP,EAAC,OAAD,CACE,UAAU,uBACV,yBAAA,YAEC,EACI,CAAA,CACH,GACN,EAAC,OAAD,CAAM,UAAU,gCACb,EAAW,aAAa,CACpB,CAAA,CACH,GACC,CAAA,CACN,CAlC4B,EAkC5B,CAER,CACE,CAAA,CACK,GACG,CAAA,CACR,GACP,CAAA"}
+{"version":3,"file":"LocaleSwitcher.mjs","names":[],"sources":["../../../../src/components/LocaleSwitcherDropDown/LocaleSwitcher.tsx"],"sourcesContent":["'use client';\n\nimport { getHTMLTextDir, getLocaleName } from '@intlayer/core/localization';\nimport type { Locale } from '@intlayer/types/allLocales';\nimport * as Locales from '@intlayer/types/locales';\nimport Fuse, { type IFuseOptions } from 'fuse.js';\nimport { MoveVertical } from 'lucide-react';\nimport { type FC, useCallback, useMemo, useRef, useState } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Button, ButtonColor, ButtonTextAlign, ButtonVariant } from '../Button';\nimport { Container } from '../Container';\nimport { DropDown, type PanelProps } from '../DropDown';\nimport { Input } from '../Input';\n\nexport type LocaleSwitcherProps = {\n  locale?: Locale;\n  localeList: Locale[];\n  availableLocales?: Locale[];\n  fullLocaleName?: boolean;\n  setLocale: (locale: Locale) => void;\n  panelProps?: Omit<PanelProps, 'identifier'>;\n};\n\nconst DROPDOWN_IDENTIFIER = 'locale-switcher';\n\ntype MultilingualAvailableLocales = {\n  locale: Locale;\n  englishName: string;\n  currentLocaleName: string;\n  ownLocaleName: string;\n};\n\nexport const LocaleSwitcher: FC<LocaleSwitcherProps> = ({\n  locale,\n  localeList,\n  availableLocales,\n  fullLocaleName = true,\n  setLocale,\n  panelProps,\n}) => {\n  let localeName = 'Select a locale';\n  const { switchTo, searchInput, languageListLabel, localeSwitcherLabel } =\n    useIntlayer('locale-switcher');\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const multilingualAvailableLocales: MultilingualAvailableLocales[] = useMemo(\n    () =>\n      localeList.map((localeEl) => {\n        const englishName = getLocaleName(localeEl, Locales.ENGLISH);\n        const currentLocaleName = getLocaleName(localeEl, locale);\n        const ownLocaleName = getLocaleName(localeEl);\n        return {\n          locale: localeEl,\n          englishName,\n          currentLocaleName,\n          ownLocaleName,\n        };\n      }),\n    [localeList, locale]\n  );\n\n  const [results, setResults] = useState<MultilingualAvailableLocales[]>(\n    multilingualAvailableLocales\n  );\n\n  // Create a new Fuse instance with the options and documentation data\n  const fuse = useMemo(() => {\n    const fuseOptions: IFuseOptions<MultilingualAvailableLocales> = {\n      keys: [\n        { name: 'ownLocaleName', weight: 0.4 },\n        { name: 'englishName', weight: 0.2 },\n        { name: 'currentLocaleName', weight: 0.2 },\n        { name: 'locale', weight: 0.2 },\n      ],\n      threshold: 0.02, // Defines how fuzzy the matching should be (lower is more strict)\n    };\n\n    return new Fuse(multilingualAvailableLocales, fuseOptions);\n  }, [multilingualAvailableLocales]);\n\n  const handleSearch = useCallback(\n    (searchQuery: string) => {\n      if (searchQuery) {\n        // Perform search on every input change\n        const searchResults = fuse\n          .search(searchQuery)\n          .map((result) => result.item);\n        setResults(searchResults);\n      } else {\n        setResults(multilingualAvailableLocales);\n      }\n    },\n    [fuse, multilingualAvailableLocales]\n  );\n\n  if (locale) {\n    localeName = fullLocaleName ? getLocaleName(locale) : locale.toUpperCase();\n  }\n\n  return (\n    <nav\n      className=\"rounded-xl border border-text text-text transition-colors\"\n      aria-label={localeSwitcherLabel.value}\n    >\n      <DropDown identifier={DROPDOWN_IDENTIFIER}>\n        <DropDown.Trigger identifier={DROPDOWN_IDENTIFIER}>\n          <div className=\"flex w-full items-center justify-between\">\n            <div className=\"text-nowrap px-2\">{localeName}</div>\n            <MoveVertical className=\"w-5 self-center\" />\n          </div>\n        </DropDown.Trigger>\n\n        <DropDown.Panel\n          identifier={DROPDOWN_IDENTIFIER}\n          isOverable\n          isFocusable\n          {...panelProps}\n        >\n          <Container\n            className=\"max-h-[80vh] min-w-28\"\n            separator=\"y\"\n            role=\"listbox\"\n            transparency=\"xs\"\n            aria-label={languageListLabel.value}\n          >\n            <div className=\"p-3\">\n              <Input\n                type=\"search\"\n                aria-label={searchInput.ariaLabel.value}\n                placeholder={searchInput.placeholder.value}\n                onChange={(e) => handleSearch(e.target.value)}\n                ref={inputRef}\n              />\n            </div>\n            <ol className=\"divide-y divide-dashed divide-text/20 overflow-y-auto p-1\">\n              {results.map(\n                ({ locale: localeItem, currentLocaleName, ownLocaleName }) => (\n                  <li className=\"px-1.5 py-1\" key={localeItem}>\n                    <Button\n                      onClick={() => setLocale(localeItem)}\n                      label={`${switchTo} ${currentLocaleName}`}\n                      disabled={\n                        !(availableLocales ?? localeList).includes(localeItem)\n                      }\n                      isActive={locale === localeItem}\n                      variant={ButtonVariant.HOVERABLE}\n                      color={ButtonColor.TEXT}\n                      isFullWidth\n                      textAlign={ButtonTextAlign.LEFT}\n                    >\n                      <div className=\"flex flex-row items-center justify-between gap-3 px-2 py-1\">\n                        <div className=\"flex flex-col text-nowrap\">\n                          <span\n                            dir={getHTMLTextDir(localeItem)}\n                            lang={localeItem}\n                            suppressHydrationWarning\n                          >\n                            {ownLocaleName}\n                          </span>\n                          <span\n                            className=\"text-neutral text-xs\"\n                            suppressHydrationWarning\n                          >\n                            {currentLocaleName}\n                          </span>\n                        </div>\n                        <span className=\"text-neutral text-sm\">\n                          {localeItem.toUpperCase()}\n                        </span>\n                      </div>\n                    </Button>\n                  </li>\n                )\n              )}\n            </ol>\n          </Container>\n        </DropDown.Panel>\n      </DropDown>\n    </nav>\n  );\n};\n"],"mappings":"0mBAuBA,MAAM,EAAsB,kBASf,GAA2C,CACtD,SACA,aACA,mBACA,iBAAiB,GACjB,YACA,gBACI,CACJ,IAAI,EAAa,kBACX,CAAE,WAAU,cAAa,oBAAmB,uBAChD,EAAY,kBAAkB,CAC1B,EAAW,EAAyB,KAAK,CAEzC,EAA+D,MAEjE,EAAW,IAAK,IAIP,CACL,OAAQ,EACR,YALkB,EAAc,EAAU,EAAQ,QAAQ,CAM1D,kBALwB,EAAc,EAAU,EAAO,CAMvD,cALoB,EAAc,EAAS,CAM5C,EACD,CACJ,CAAC,EAAY,EAAO,CACrB,CAEK,CAAC,EAAS,GAAc,EAC5B,EACD,CAGK,EAAO,MAWJ,IAAI,EAAK,EAVgD,CAC9D,KAAM,CACJ,CAAE,KAAM,gBAAiB,OAAQ,GAAK,CACtC,CAAE,KAAM,cAAe,OAAQ,GAAK,CACpC,CAAE,KAAM,oBAAqB,OAAQ,GAAK,CAC1C,CAAE,KAAM,SAAU,OAAQ,GAAK,CAChC,CACD,UAAW,IACZ,CAEyD,CACzD,CAAC,EAA6B,CAAC,CAE5B,EAAe,EAClB,GAAwB,CAMrB,EALE,EAEoB,EACnB,OAAO,EAAY,CACnB,IAAK,GAAW,EAAO,KAAK,CAGpB,EAA6B,EAG5C,CAAC,EAAM,EAA6B,CACrC,CAMD,OAJI,IACF,EAAa,EAAiB,EAAc,EAAO,CAAG,EAAO,aAAa,EAI1E,EAAC,MAAD,CACE,UAAU,4DACV,aAAY,EAAoB,eAEhC,EAAC,EAAD,CAAU,WAAY,WAAtB,CACE,EAAC,EAAS,QAAV,CAAkB,WAAY,WAC5B,EAAC,MAAD,CAAK,UAAU,oDAAf,CACE,EAAC,MAAD,CAAK,UAAU,4BAAoB,EAAiB,CAAA,CACpD,EAAC,EAAD,CAAc,UAAU,kBAAoB,CAAA,CACxC,GACW,CAAA,CAEnB,EAAC,EAAS,MAAV,CACE,WAAY,EACZ,WAAA,GACA,YAAA,GACA,GAAI,WAEJ,EAAC,EAAD,CACE,UAAU,wBACV,UAAU,IACV,KAAK,UACL,aAAa,KACb,aAAY,EAAkB,eALhC,CAOE,EAAC,MAAD,CAAK,UAAU,eACb,EAAC,EAAD,CACE,KAAK,SACL,aAAY,EAAY,UAAU,MAClC,YAAa,EAAY,YAAY,MACrC,SAAW,GAAM,EAAa,EAAE,OAAO,MAAM,CAC7C,IAAK,EACL,CAAA,CACE,CAAA,CACN,EAAC,KAAD,CAAI,UAAU,qEACX,EAAQ,KACN,CAAE,OAAQ,EAAY,oBAAmB,mBACxC,EAAC,KAAD,CAAI,UAAU,uBACZ,EAAC,EAAD,CACE,YAAe,EAAU,EAAW,CACpC,MAAO,GAAG,EAAS,GAAG,IACtB,SACE,EAAE,GAAoB,GAAY,SAAS,EAAW,CAExD,SAAU,IAAW,EACrB,QAAS,EAAc,UACvB,MAAO,EAAY,KACnB,YAAA,GACA,UAAW,EAAgB,cAE3B,EAAC,MAAD,CAAK,UAAU,sEAAf,CACE,EAAC,MAAD,CAAK,UAAU,qCAAf,CACE,EAAC,OAAD,CACE,IAAK,EAAe,EAAW,CAC/B,KAAM,EACN,yBAAA,YAEC,EACI,CAAA,CACP,EAAC,OAAD,CACE,UAAU,uBACV,yBAAA,YAEC,EACI,CAAA,CACH,GACN,EAAC,OAAD,CAAM,UAAU,gCACb,EAAW,aAAa,CACpB,CAAA,CACH,GACC,CAAA,CACN,CAlC4B,EAkC5B,CAER,CACE,CAAA,CACK,GACG,CAAA,CACR,GACP,CAAA"}

package/dist/esm/components/MarkDownRender/MarkDownRender.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"MarkDownRender.mjs","names":[],"sources":["../../../../src/components/MarkDownRender/MarkDownRender.tsx"],"sourcesContent":["import type { LocalesValues } from '@intlayer/types';\nimport { cn } from '@utils/cn';\nimport {\n  type ComponentProps,\n  type ComponentPropsWithoutRef,\n  createContext,\n  type FC,\n  useContext,\n} from 'react';\nimport {\n  type MarkdownRenderer as MarkdownRendererIntlayer,\n  renderMarkdown,\n} from 'react-intlayer';\nimport type { BundledLanguage } from 'shiki/bundle/web';\nimport { H1, H2, H3, H4, H5, H6 } from '../Headers';\nimport { Code } from '../IDE/Code';\nimport { CodeProvider } from '../IDE/CodeContext';\nimport { Link } from '../Link';\nimport { Tab } from '../Tab';\nimport { TabProvider } from '../Tab/TabContext';\nimport { Table } from '../Table';\n\n// Context to pass dynamic variables to static components without re-creating them\ninterface MarkdownContextType {\n  isDarkMode?: boolean;\n  locale?: LocalesValues;\n}\nconst MarkdownContext = createContext<MarkdownContextType>({});\n\n// Extracted, stable component renderers\nconst H1Renderer = (props: ComponentProps<'h1'>) => (\n  <H1 isClickable className=\"text-text\" {...props} />\n);\nconst H2Renderer = (props: ComponentProps<'h2'>) => (\n  <H2 isClickable className=\"mt-16 text-text\" {...props} />\n);\nconst H3Renderer = (props: ComponentProps<'h3'>) => (\n  <H3 isClickable className=\"mt-5 text-text\" {...props} />\n);\nconst H4Renderer = (props: ComponentProps<'h4'>) => (\n  <H4 isClickable className=\"mt-3 text-text\" {...props} />\n);\nconst H5Renderer = (props: ComponentProps<'h5'>) => (\n  <H5 isClickable className=\"mt-3 text-text\" {...props} />\n);\nconst H6Renderer = (props: ComponentProps<'h6'>) => (\n  <H6 isClickable className=\"mt-3 text-text\" {...props} />\n);\nconst StrongRenderer = (props: ComponentProps<'strong'>) => (\n  <strong className=\"text-text\" {...props} />\n);\n\nconst CodeRenderer = ({\n  className,\n  children,\n  ...rest\n}: ComponentProps<'code'>) => {\n  const { isDarkMode } = useContext(MarkdownContext);\n  const content = String(children ?? '').replace(/\\n$/, '');\n  const isBlock = !!className;\n\n  if (!isBlock) {\n    return (\n      <code className=\"rounded-md border border-neutral/30 bg-card/60 box-decoration-clone px-1.5 py-0.5 font-mono text-sm\">\n        {content}\n      </code>\n    );\n  }\n\n  const language = (className?.replace(/lang(?:uage)?-/, '') ||\n    'plaintext') as BundledLanguage;\n\n  return (\n    <Code {...rest} language={language} showHeader isDarkMode={isDarkMode}>\n      {content}\n    </Code>\n  );\n};\n\nconst BlockquoteRenderer = ({\n  className,\n  ...props\n}: ComponentProps<'blockquote'>) => (\n  <blockquote\n    className={cn(\n      'mt-5 gap-3 border-card border-l-4 pl-5 text-neutral [&_strong]:text-neutral',\n      className\n    )}\n    {...props}\n  />\n);\n\nconst UlRenderer = ({ className, ...props }: ComponentProps<'ul'>) => (\n  <ul\n    className={cn(\n      'mt-5 flex list-disc flex-col gap-3 pl-5 marker:text-neutral/80',\n      className\n    )}\n    {...props}\n  />\n);\n\nconst OlRenderer = ({ className, ...props }: ComponentProps<'ol'>) => (\n  <ol\n    className={cn(\n      'mt-5 flex list-decimal flex-col gap-3 pl-5 marker:text-neutral/80',\n      className\n    )}\n    {...props}\n  />\n);\n\nconst ImgRenderer = ({\n  className,\n  alt,\n  src,\n  ...props\n}: ComponentProps<'img'>) => (\n  <img\n    {...props}\n    alt={alt ?? ''}\n    loading=\"lazy\"\n    className={cn('max-h-[80vh] max-w-full rounded-md', className)}\n    src={`${src}?raw=true`}\n  />\n);\n\nconst LinkRenderer = (props: ComponentProps<'a'>) => {\n  const { locale } = useContext(MarkdownContext);\n  return (\n    <Link\n      isExternalLink={props.href?.startsWith('http')}\n      underlined\n      locale={locale}\n      label=\"\"\n      color=\"text\"\n      {...(props as any)}\n    />\n  );\n};\n\nconst PreRenderer = (props: ComponentProps<'pre'>) => <>{props.children}</>;\nconst TableRenderer = (props: ComponentProps<typeof Table>) => (\n  <Table isRollable {...props} />\n);\nconst ThRenderer = ({ className, ...props }: ComponentProps<'th'>) => (\n  <th\n    className={cn('border-neutral border-b bg-neutral/10 p-4', className)}\n    {...props}\n  />\n);\nconst TrRenderer = ({ className, ...props }: ComponentProps<'tr'>) => (\n  <tr className={cn('hover:/10 hover:bg-neutral/10', className)} {...props} />\n);\nconst TdRenderer = ({ className, ...props }: ComponentProps<'td'>) => (\n  <td\n    className={cn('border-neutral-500/50 border-b p-4', className)}\n    {...props}\n  />\n);\nconst HrRenderer = ({ className, ...props }: ComponentProps<'hr'>) => (\n  <hr className={cn('mx-6 mt-16 text-neutral', className)} {...props} />\n);\n\nconst TabsRenderer = (props: ComponentProps<typeof Tab>) => (\n  <Tab\n    {...props}\n    className=\"rounded-xl border border-card\"\n    headerClassName=\"sticky rounded-xl top-24 z-5 bg-background/70 backdrop-blur overflow-x-auto\"\n  />\n);\nconst ColumnsRenderer = ({\n  className,\n  ...props\n}: ComponentPropsWithoutRef<'div'>) => (\n  <div className={cn('flex gap-4 max-md:flex-col', className)} {...props} />\n);\nconst ColumnRenderer = ({\n  className,\n  ...props\n}: ComponentPropsWithoutRef<'div'>) => (\n  <div className={cn('flex-1', className)} {...props} />\n);\n\n// Static configuration object\nexport const baseMarkdownComponents = {\n  h1: H1Renderer,\n  h2: H2Renderer,\n  h3: H3Renderer,\n  h4: H4Renderer,\n  h5: H5Renderer,\n  h6: H6Renderer,\n  strong: StrongRenderer,\n  code: CodeRenderer,\n  blockquote: BlockquoteRenderer,\n  ul: UlRenderer,\n  ol: OlRenderer,\n  img: ImgRenderer,\n  a: LinkRenderer,\n  pre: PreRenderer,\n  table: TableRenderer,\n  th: ThRenderer,\n  tr: TrRenderer,\n  td: TdRenderer,\n  hr: HrRenderer,\n  Tabs: TabsRenderer,\n  Tab: Tab.Item,\n  Columns: ColumnsRenderer,\n  Column: ColumnRenderer,\n};\n\ntype MarkdownRendererProps = {\n  children: string;\n  isDarkMode?: boolean;\n  locale?: LocalesValues;\n  forceBlock?: boolean;\n  preserveFrontmatter?: boolean;\n  tagfilter?: boolean;\n  components?: ComponentProps<typeof MarkdownRendererIntlayer>['components'];\n  wrapper?: ComponentProps<typeof MarkdownRendererIntlayer>['wrapper'];\n};\n\nexport const getIntlayerMarkdownOptions = (isDarkMode?: boolean) => ({\n  components: baseMarkdownComponents,\n});\n\nexport const MarkdownRenderer: FC<MarkdownRendererProps> = ({\n  children,\n  isDarkMode = false,\n  locale,\n  forceBlock,\n  preserveFrontmatter,\n  tagfilter,\n  components: componentsProp,\n  wrapper,\n}) => {\n  // `renderMarkdown` now receives stable object references.\n  const markdownContent = renderMarkdown(children, {\n    components: {\n      ...baseMarkdownComponents,\n      ...componentsProp,\n    },\n    wrapper,\n    forceBlock,\n    preserveFrontmatter,\n    tagfilter,\n  });\n\n  return (\n    <MarkdownContext.Provider value={{ isDarkMode, locale }}>\n      <CodeProvider>\n        <TabProvider>{markdownContent}</TabProvider>\n      </CodeProvider>\n    </MarkdownContext.Provider>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"MarkDownRender.mjs","names":[],"sources":["../../../../src/components/MarkDownRender/MarkDownRender.tsx"],"sourcesContent":["import type { LocalesValues } from '@intlayer/types/module_augmentation';\nimport { cn } from '@utils/cn';\nimport {\n  type ComponentProps,\n  type ComponentPropsWithoutRef,\n  createContext,\n  type FC,\n  useContext,\n} from 'react';\nimport {\n  type MarkdownRenderer as MarkdownRendererIntlayer,\n  renderMarkdown,\n} from 'react-intlayer';\nimport type { BundledLanguage } from 'shiki/bundle/web';\nimport { H1, H2, H3, H4, H5, H6 } from '../Headers';\nimport { Code } from '../IDE/Code';\nimport { CodeProvider } from '../IDE/CodeContext';\nimport { Link } from '../Link';\nimport { Tab } from '../Tab';\nimport { TabProvider } from '../Tab/TabContext';\nimport { Table } from '../Table';\n\n// Context to pass dynamic variables to static components without re-creating them\ninterface MarkdownContextType {\n  isDarkMode?: boolean;\n  locale?: LocalesValues;\n}\nconst MarkdownContext = createContext<MarkdownContextType>({});\n\n// Extracted, stable component renderers\nconst H1Renderer = (props: ComponentProps<'h1'>) => (\n  <H1 isClickable className=\"text-text\" {...props} />\n);\nconst H2Renderer = (props: ComponentProps<'h2'>) => (\n  <H2 isClickable className=\"mt-16 text-text\" {...props} />\n);\nconst H3Renderer = (props: ComponentProps<'h3'>) => (\n  <H3 isClickable className=\"mt-5 text-text\" {...props} />\n);\nconst H4Renderer = (props: ComponentProps<'h4'>) => (\n  <H4 isClickable className=\"mt-3 text-text\" {...props} />\n);\nconst H5Renderer = (props: ComponentProps<'h5'>) => (\n  <H5 isClickable className=\"mt-3 text-text\" {...props} />\n);\nconst H6Renderer = (props: ComponentProps<'h6'>) => (\n  <H6 isClickable className=\"mt-3 text-text\" {...props} />\n);\nconst StrongRenderer = (props: ComponentProps<'strong'>) => (\n  <strong className=\"text-text\" {...props} />\n);\n\nconst CodeRenderer = ({\n  className,\n  children,\n  ...rest\n}: ComponentProps<'code'>) => {\n  const { isDarkMode } = useContext(MarkdownContext);\n  const content = String(children ?? '').replace(/\\n$/, '');\n  const isBlock = !!className;\n\n  if (!isBlock) {\n    return (\n      <code className=\"rounded-md border border-neutral/30 bg-card/60 box-decoration-clone px-1.5 py-0.5 font-mono text-sm\">\n        {content}\n      </code>\n    );\n  }\n\n  const language = (className?.replace(/lang(?:uage)?-/, '') ||\n    'plaintext') as BundledLanguage;\n\n  return (\n    <Code {...rest} language={language} showHeader isDarkMode={isDarkMode}>\n      {content}\n    </Code>\n  );\n};\n\nconst BlockquoteRenderer = ({\n  className,\n  ...props\n}: ComponentProps<'blockquote'>) => (\n  <blockquote\n    className={cn(\n      'mt-5 gap-3 border-card border-l-4 pl-5 text-neutral [&_strong]:text-neutral',\n      className\n    )}\n    {...props}\n  />\n);\n\nconst UlRenderer = ({ className, ...props }: ComponentProps<'ul'>) => (\n  <ul\n    className={cn(\n      'mt-5 flex list-disc flex-col gap-3 pl-5 marker:text-neutral/80',\n      className\n    )}\n    {...props}\n  />\n);\n\nconst OlRenderer = ({ className, ...props }: ComponentProps<'ol'>) => (\n  <ol\n    className={cn(\n      'mt-5 flex list-decimal flex-col gap-3 pl-5 marker:text-neutral/80',\n      className\n    )}\n    {...props}\n  />\n);\n\nconst ImgRenderer = ({\n  className,\n  alt,\n  src,\n  ...props\n}: ComponentProps<'img'>) => (\n  <img\n    {...props}\n    alt={alt ?? ''}\n    loading=\"lazy\"\n    className={cn('max-h-[80vh] max-w-full rounded-md', className)}\n    src={`${src}?raw=true`}\n  />\n);\n\nconst LinkRenderer = (props: ComponentProps<'a'>) => {\n  const { locale } = useContext(MarkdownContext);\n  return (\n    <Link\n      isExternalLink={props.href?.startsWith('http')}\n      underlined\n      locale={locale}\n      label=\"\"\n      color=\"text\"\n      {...(props as any)}\n    />\n  );\n};\n\nconst PreRenderer = (props: ComponentProps<'pre'>) => <>{props.children}</>;\nconst TableRenderer = (props: ComponentProps<typeof Table>) => (\n  <Table isRollable {...props} />\n);\nconst ThRenderer = ({ className, ...props }: ComponentProps<'th'>) => (\n  <th\n    className={cn('border-neutral border-b bg-neutral/10 p-4', className)}\n    {...props}\n  />\n);\nconst TrRenderer = ({ className, ...props }: ComponentProps<'tr'>) => (\n  <tr className={cn('hover:/10 hover:bg-neutral/10', className)} {...props} />\n);\nconst TdRenderer = ({ className, ...props }: ComponentProps<'td'>) => (\n  <td\n    className={cn('border-neutral-500/50 border-b p-4', className)}\n    {...props}\n  />\n);\nconst HrRenderer = ({ className, ...props }: ComponentProps<'hr'>) => (\n  <hr className={cn('mx-6 mt-16 text-neutral', className)} {...props} />\n);\n\nconst TabsRenderer = (props: ComponentProps<typeof Tab>) => (\n  <Tab\n    {...props}\n    className=\"rounded-xl border border-card\"\n    headerClassName=\"sticky rounded-xl top-24 z-5 bg-background/70 backdrop-blur overflow-x-auto\"\n  />\n);\nconst ColumnsRenderer = ({\n  className,\n  ...props\n}: ComponentPropsWithoutRef<'div'>) => (\n  <div className={cn('flex gap-4 max-md:flex-col', className)} {...props} />\n);\nconst ColumnRenderer = ({\n  className,\n  ...props\n}: ComponentPropsWithoutRef<'div'>) => (\n  <div className={cn('flex-1', className)} {...props} />\n);\n\n// Static configuration object\nexport const baseMarkdownComponents = {\n  h1: H1Renderer,\n  h2: H2Renderer,\n  h3: H3Renderer,\n  h4: H4Renderer,\n  h5: H5Renderer,\n  h6: H6Renderer,\n  strong: StrongRenderer,\n  code: CodeRenderer,\n  blockquote: BlockquoteRenderer,\n  ul: UlRenderer,\n  ol: OlRenderer,\n  img: ImgRenderer,\n  a: LinkRenderer,\n  pre: PreRenderer,\n  table: TableRenderer,\n  th: ThRenderer,\n  tr: TrRenderer,\n  td: TdRenderer,\n  hr: HrRenderer,\n  Tabs: TabsRenderer,\n  Tab: Tab.Item,\n  Columns: ColumnsRenderer,\n  Column: ColumnRenderer,\n};\n\ntype MarkdownRendererProps = {\n  children: string;\n  isDarkMode?: boolean;\n  locale?: LocalesValues;\n  forceBlock?: boolean;\n  preserveFrontmatter?: boolean;\n  tagfilter?: boolean;\n  components?: ComponentProps<typeof MarkdownRendererIntlayer>['components'];\n  wrapper?: ComponentProps<typeof MarkdownRendererIntlayer>['wrapper'];\n};\n\nexport const getIntlayerMarkdownOptions = (_isDarkMode?: boolean) => ({\n  components: baseMarkdownComponents,\n});\n\nexport const MarkdownRenderer: FC<MarkdownRendererProps> = ({\n  children,\n  isDarkMode = false,\n  locale,\n  forceBlock,\n  preserveFrontmatter,\n  tagfilter,\n  components: componentsProp,\n  wrapper,\n}) => {\n  // `renderMarkdown` now receives stable object references.\n  const markdownContent = renderMarkdown(children, {\n    components: {\n      ...baseMarkdownComponents,\n      ...componentsProp,\n    },\n    wrapper,\n    forceBlock,\n    preserveFrontmatter,\n    tagfilter,\n  });\n\n  return (\n    <MarkdownContext.Provider value={{ isDarkMode, locale }}>\n      <CodeProvider>\n        <TabProvider>{markdownContent}</TabProvider>\n      </CodeProvider>\n    </MarkdownContext.Provider>\n  );\n};\n"],"mappings":"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"}

package/dist/esm/components/MaxHeightSmoother/index.mjs

@@ -1,2 +1,2 @@
-import{cn as e}from"../../utils/cn.mjs";import{jsx as t}from"react/jsx-runtime";const n=({children:n,isHidden:r,className:i=``,isOverable:a=!1,isFocusable:o=!1,minHeight:s=0,...c})=>t(`div`,{"aria-hidden":o?r:void 0,tabIndex:o?0:void 0,role:o?`button`:`none`,className:e(`group/height-smoother relative grid w-full grid-rows-[0fr] overflow-hidden transition-all duration-700 ease-in-out`,r!==void 0&&!r&&`grid-rows-[1fr] overflow-x-auto`,a&&`hover:grid-rows-[1fr] hover:overflow-x-auto`,o&&`focus-within:grid-rows-[1fr] focus-within:overflow-x-auto focus:grid-rows-[1fr] focus:overflow-x-auto`,i),...c,children:t(`div`,{style:{minHeight:`${s}px`},className:e(a&&`group-hover/height-smoother:visible`,o&&`group-focus/height-smoother:visible`,i),children:n})});export{n as MaxHeightSmoother};
+import{cn as e}from"../../utils/cn.mjs";import{jsx as t}from"react/jsx-runtime";const n=({children:n,isHidden:r,className:i=``,isOverable:a=!1,isFocusable:o=!1,minHeight:s=0,...c})=>t(`div`,{"aria-hidden":o?r:void 0,tabIndex:o?0:void 0,role:o?`button`:`none`,className:e(`group/height-smoother relative grid w-full grid-rows-[0fr] overflow-hidden transition-[grid-template-rows] duration-500 ease-in-out`,r!==void 0&&!r&&`grid-rows-[1fr] overflow-x-auto`,a&&`hover:grid-rows-[1fr] hover:overflow-x-auto`,o&&`focus-within:grid-rows-[1fr] focus-within:overflow-x-auto focus:grid-rows-[1fr] focus:overflow-x-auto`,i),...c,children:t(`div`,{style:{minHeight:`${s}px`},className:`min-h-0 overflow-hidden`,children:n})});export{n as MaxHeightSmoother};
 //# sourceMappingURL=index.mjs.map

package/dist/esm/components/MaxHeightSmoother/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/MaxHeightSmoother/index.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport type { FC, HTMLAttributes, ReactNode } from 'react';\n\n/**\n * Props for the MaxHeightSmoother component\n */\ninterface MaxHeightSmootherProps extends HTMLAttributes<HTMLDivElement> {\n  /** Content to render within the smoother container */\n  children: ReactNode;\n  /** Controls collapse state. When true, content is collapsed; when false, expanded; when undefined, relies on hover/focus behavior */\n  isHidden?: boolean;\n  /** Enable expand-on-hover behavior */\n  isOverable?: boolean;\n  /** Enable expand-on-focus behavior for accessibility and keyboard navigation */\n  isFocusable?: boolean;\n  /** Minimum height in pixels for the collapsed state */\n  minHeight?: number;\n}\n\n/**\n * MaxHeightSmoother Component\n *\n * A sophisticated container component that provides smooth height transitions\n * for collapsible content. Uses CSS Grid's fractional rows to create fluid\n * animations without JavaScript height calculations, making it performant\n * and smooth across all devices and screen sizes.\n *\n * @component\n * @example\n * Basic controlled usage:\n * ```tsx\n * const [isCollapsed, setIsCollapsed] = useState(true);\n *\n * <MaxHeightSmoother isHidden={isCollapsed}>\n *   <div>Your collapsible content here</div>\n * </MaxHeightSmoother>\n * ```\n *\n * @example\n * Hover-triggered expansion:\n * ```tsx\n * <MaxHeightSmoother isOverable={true}>\n *   <div>\n *     <p>This content expands when you hover over the container.</p>\n *     <p>Perfect for preview cards or tooltips.</p>\n *   </div>\n * </MaxHeightSmoother>\n * ```\n *\n * @example\n * Accessible focus-triggered expansion:\n * ```tsx\n * <MaxHeightSmoother isFocusable={true}>\n *   <div>\n *     <h3>Expandable Section</h3>\n *     <p>Tab to focus this container to expand the content.</p>\n *     <p>Great for accessible progressive disclosure.</p>\n *   </div>\n * </MaxHeightSmoother>\n * ```\n *\n * @example\n * With minimum height for preview:\n * ```tsx\n * <MaxHeightSmoother\n *   isOverable={true}\n *   minHeight={100}\n *   className=\"border rounded-lg p-4\"\n * >\n *   <div>\n *     <h3>Article Preview</h3>\n *     <p>This article preview shows the first few lines...</p>\n *     <p>Hover to see the full content with smooth expansion.</p>\n *     <p>The minHeight ensures some content is always visible.</p>\n *   </div>\n * </MaxHeightSmoother>\n * ```\n *\n * @example\n * Combined hover and focus behavior:\n * ```tsx\n * <MaxHeightSmoother\n *   isOverable={true}\n *   isFocusable={true}\n *   minHeight={80}\n * >\n *   <div>\n *     <h4>Interactive Card</h4>\n *     <p>Expands on both hover and keyboard focus.</p>\n *     <p>Accessible to both mouse and keyboard users.</p>\n *   </div>\n * </MaxHeightSmoother>\n * ```\n *\n * Features:\n * - Smooth CSS Grid-based height transitions (700ms duration)\n * - Three interaction modes: controlled, hover, and focus\n * - Configurable minimum height for collapsed state\n * - Accessible keyboard navigation support\n * - Overflow handling with smooth scrolling\n * - ARIA attributes for screen reader compatibility\n * - Performance-optimized with CSS-only animations\n * - Responsive design that works on all screen sizes\n *\n * Animation Technique:\n * Uses CSS Grid `grid-rows-[0fr]` to `grid-rows-[1fr]` transitions\n * instead of height animations, which provides:\n * - Smooth animations without knowing content height\n * - Better performance (no layout recalculations)\n * - More reliable across different content types\n * - Automatic adaptation to dynamic content changes\n *\n * Interaction Modes:\n * 1. **Controlled**: Use `isHidden` prop for external state control\n * 2. **Hover**: Set `isOverable={true}` for mouse hover expansion\n * 3. **Focus**: Set `isFocusable={true}` for keyboard focus expansion\n * 4. **Combined**: Use both `isOverable` and `isFocusable` together\n *\n * Accessibility Features:\n * - `role=\"button\"` when focusable for proper screen reader context\n * - `tabIndex={0}` for keyboard navigation when focusable\n * - `aria-hidden` attribute for screen reader control\n * - Semantic focus management with focus-within pseudo-class\n * - High contrast focus indicators\n * - Respects prefers-reduced-motion settings\n *\n * Use Cases:\n * - FAQ accordions and expandable sections\n * - Article previews and read-more functionality\n * - Card hover effects and content previews\n * - Progressive disclosure for complex forms\n * - Tooltip and popover content containers\n * - Mobile-friendly collapsible navigation\n * - Dashboard widget expansion\n * - Email preview in mail clients\n *\n * Performance Considerations:\n * - Pure CSS animations (no JavaScript timer overhead)\n * - GPU acceleration through transform-based animations\n * - Minimal repaints and layout shifts\n * - Efficient event handling with CSS pseudo-classes\n * - No DOM measurements or calculations required\n *\n * @param props - Component props extending HTML div attributes\n * @param props.children - Content to render within the container\n * @param props.isHidden - Controlled collapse state (true=collapsed, false=expanded)\n * @param props.isOverable - Enable hover-to-expand behavior\n * @param props.isFocusable - Enable focus-to-expand behavior with keyboard navigation\n * @param props.minHeight - Minimum height in pixels for collapsed state (default: 0)\n * @param props.className - Additional CSS classes for styling\n * @param props.style - Inline styles (note: minHeight style will be applied)\n * @param props.role - ARIA role (automatically set to \"button\" when focusable)\n * @param props.tabIndex - Tab index (automatically set to 0 when focusable)\n * @param props.aria-hidden - ARIA hidden state (controlled by isHidden when focusable)\n * @param props.onClick - Click event handler\n * @param props.onMouseEnter - Mouse enter event handler\n * @param props.onMouseLeave - Mouse leave event handler\n * @param props.onFocus - Focus event handler\n * @param props.onBlur - Blur event handler\n * @param props...rest - All other standard HTML div attributes\n *\n * @returns A smooth height-transitioning container with configurable interaction modes\n */\nexport const MaxHeightSmoother: FC<MaxHeightSmootherProps> = ({\n  children,\n  isHidden,\n  className = '',\n  isOverable = false,\n  isFocusable = false,\n  minHeight = 0,\n  ...props\n}) => (\n  <div\n    aria-hidden={isFocusable ? isHidden : undefined}\n    tabIndex={isFocusable ? 0 : undefined}\n    role={isFocusable ? 'button' : 'none'}\n    className={cn(\n      'group/height-smoother relative grid w-full grid-rows-[0fr] overflow-hidden transition-all duration-700 ease-in-out',\n      typeof isHidden !== 'undefined' &&\n        !isHidden &&\n        'grid-rows-[1fr] overflow-x-auto',\n      isOverable && 'hover:grid-rows-[1fr] hover:overflow-x-auto',\n      isFocusable &&\n        'focus-within:grid-rows-[1fr] focus-within:overflow-x-auto focus:grid-rows-[1fr] focus:overflow-x-auto',\n      className\n    )}\n    {...props}\n  >\n    <div\n      style={{\n        minHeight: `${minHeight}px`,\n      }}\n      className={cn(\n        isOverable && 'group-hover/height-smoother:visible',\n        isFocusable && 'group-focus/height-smoother:visible',\n        className\n      )}\n    >\n      {children}\n    </div>\n  </div>\n);\n"],"mappings":"gFAmKA,MAAa,GAAiD,CAC5D,WACA,WACA,YAAY,GACZ,aAAa,GACb,cAAc,GACd,YAAY,EACZ,GAAG,KAEH,EAAC,MAAD,CACE,cAAa,EAAc,EAAW,IAAA,GACtC,SAAU,EAAc,EAAI,IAAA,GAC5B,KAAM,EAAc,SAAW,OAC/B,UAAW,EACT,qHACO,IAAa,QAClB,CAAC,GACD,kCACF,GAAc,8CACd,GACE,wGACF,EACD,CACD,GAAI,WAEJ,EAAC,MAAD,CACE,MAAO,CACL,UAAW,GAAG,EAAU,IACzB,CACD,UAAW,EACT,GAAc,sCACd,GAAe,sCACf,EACD,CAEA,WACG,CAAA,CACF,CAAA"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/MaxHeightSmoother/index.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport type { FC, HTMLAttributes, ReactNode } from 'react';\n\n/**\n * Props for the MaxHeightSmoother component\n */\ninterface MaxHeightSmootherProps extends HTMLAttributes<HTMLDivElement> {\n  /** Content to render within the smoother container */\n  children: ReactNode;\n  /** Controls collapse state. When true, content is collapsed; when false, expanded; when undefined, relies on hover/focus behavior */\n  isHidden?: boolean;\n  /** Enable expand-on-hover behavior */\n  isOverable?: boolean;\n  /** Enable expand-on-focus behavior for accessibility and keyboard navigation */\n  isFocusable?: boolean;\n  /** Minimum height in pixels for the collapsed state */\n  minHeight?: number;\n}\n\n/**\n * MaxHeightSmoother Component\n *\n * A sophisticated container component that provides smooth height transitions\n * for collapsible content. Uses CSS Grid's fractional rows to create fluid\n * animations without JavaScript height calculations, making it performant\n * and smooth across all devices and screen sizes.\n *\n * @component\n * @example\n * Basic controlled usage:\n * ```tsx\n * const [isCollapsed, setIsCollapsed] = useState(true);\n *\n * <MaxHeightSmoother isHidden={isCollapsed}>\n *   <div>Your collapsible content here</div>\n * </MaxHeightSmoother>\n * ```\n *\n * @example\n * Hover-triggered expansion:\n * ```tsx\n * <MaxHeightSmoother isOverable={true}>\n *   <div>\n *     <p>This content expands when you hover over the container.</p>\n *     <p>Perfect for preview cards or tooltips.</p>\n *   </div>\n * </MaxHeightSmoother>\n * ```\n *\n * @example\n * Accessible focus-triggered expansion:\n * ```tsx\n * <MaxHeightSmoother isFocusable={true}>\n *   <div>\n *     <h3>Expandable Section</h3>\n *     <p>Tab to focus this container to expand the content.</p>\n *     <p>Great for accessible progressive disclosure.</p>\n *   </div>\n * </MaxHeightSmoother>\n * ```\n *\n * @example\n * With minimum height for preview:\n * ```tsx\n * <MaxHeightSmoother\n *   isOverable={true}\n *   minHeight={100}\n *   className=\"border rounded-lg p-4\"\n * >\n *   <div>\n *     <h3>Article Preview</h3>\n *     <p>This article preview shows the first few lines...</p>\n *     <p>Hover to see the full content with smooth expansion.</p>\n *     <p>The minHeight ensures some content is always visible.</p>\n *   </div>\n * </MaxHeightSmoother>\n * ```\n *\n * @example\n * Combined hover and focus behavior:\n * ```tsx\n * <MaxHeightSmoother\n *   isOverable={true}\n *   isFocusable={true}\n *   minHeight={80}\n * >\n *   <div>\n *     <h4>Interactive Card</h4>\n *     <p>Expands on both hover and keyboard focus.</p>\n *     <p>Accessible to both mouse and keyboard users.</p>\n *   </div>\n * </MaxHeightSmoother>\n * ```\n *\n * Features:\n * - Smooth CSS Grid-based height transitions (700ms duration)\n * - Three interaction modes: controlled, hover, and focus\n * - Configurable minimum height for collapsed state\n * - Accessible keyboard navigation support\n * - Overflow handling with smooth scrolling\n * - ARIA attributes for screen reader compatibility\n * - Performance-optimized with CSS-only animations\n * - Responsive design that works on all screen sizes\n *\n * Animation Technique:\n * Uses CSS Grid `grid-rows-[0fr]` to `grid-rows-[1fr]` transitions\n * instead of height animations, which provides:\n * - Smooth animations without knowing content height\n * - Better performance (no layout recalculations)\n * - More reliable across different content types\n * - Automatic adaptation to dynamic content changes\n *\n * Interaction Modes:\n * 1. **Controlled**: Use `isHidden` prop for external state control\n * 2. **Hover**: Set `isOverable={true}` for mouse hover expansion\n * 3. **Focus**: Set `isFocusable={true}` for keyboard focus expansion\n * 4. **Combined**: Use both `isOverable` and `isFocusable` together\n *\n * Accessibility Features:\n * - `role=\"button\"` when focusable for proper screen reader context\n * - `tabIndex={0}` for keyboard navigation when focusable\n * - `aria-hidden` attribute for screen reader control\n * - Semantic focus management with focus-within pseudo-class\n * - High contrast focus indicators\n * - Respects prefers-reduced-motion settings\n *\n * Use Cases:\n * - FAQ accordions and expandable sections\n * - Article previews and read-more functionality\n * - Card hover effects and content previews\n * - Progressive disclosure for complex forms\n * - Tooltip and popover content containers\n * - Mobile-friendly collapsible navigation\n * - Dashboard widget expansion\n * - Email preview in mail clients\n *\n * Performance Considerations:\n * - Pure CSS animations (no JavaScript timer overhead)\n * - GPU acceleration through transform-based animations\n * - Minimal repaints and layout shifts\n * - Efficient event handling with CSS pseudo-classes\n * - No DOM measurements or calculations required\n *\n * @param props - Component props extending HTML div attributes\n * @param props.children - Content to render within the container\n * @param props.isHidden - Controlled collapse state (true=collapsed, false=expanded)\n * @param props.isOverable - Enable hover-to-expand behavior\n * @param props.isFocusable - Enable focus-to-expand behavior with keyboard navigation\n * @param props.minHeight - Minimum height in pixels for collapsed state (default: 0)\n * @param props.className - Additional CSS classes for styling\n * @param props.style - Inline styles (note: minHeight style will be applied)\n * @param props.role - ARIA role (automatically set to \"button\" when focusable)\n * @param props.tabIndex - Tab index (automatically set to 0 when focusable)\n * @param props.aria-hidden - ARIA hidden state (controlled by isHidden when focusable)\n * @param props.onClick - Click event handler\n * @param props.onMouseEnter - Mouse enter event handler\n * @param props.onMouseLeave - Mouse leave event handler\n * @param props.onFocus - Focus event handler\n * @param props.onBlur - Blur event handler\n * @param props...rest - All other standard HTML div attributes\n *\n * @returns A smooth height-transitioning container with configurable interaction modes\n */\nexport const MaxHeightSmoother: FC<MaxHeightSmootherProps> = ({\n  children,\n  isHidden,\n  className = '',\n  isOverable = false,\n  isFocusable = false,\n  minHeight = 0,\n  ...props\n}) => (\n  <div\n    aria-hidden={isFocusable ? isHidden : undefined}\n    tabIndex={isFocusable ? 0 : undefined}\n    role={isFocusable ? 'button' : 'none'}\n    className={cn(\n      'group/height-smoother relative grid w-full grid-rows-[0fr] overflow-hidden transition-[grid-template-rows] duration-500 ease-in-out',\n      typeof isHidden !== 'undefined' &&\n        !isHidden &&\n        'grid-rows-[1fr] overflow-x-auto',\n      isOverable && 'hover:grid-rows-[1fr] hover:overflow-x-auto',\n      isFocusable &&\n        'focus-within:grid-rows-[1fr] focus-within:overflow-x-auto focus:grid-rows-[1fr] focus:overflow-x-auto',\n      className\n    )}\n    {...props}\n  >\n    <div\n      style={{\n        minHeight: `${minHeight}px`,\n      }}\n      className=\"min-h-0 overflow-hidden\"\n    >\n      {children}\n    </div>\n  </div>\n);\n"],"mappings":"gFAmKA,MAAa,GAAiD,CAC5D,WACA,WACA,YAAY,GACZ,aAAa,GACb,cAAc,GACd,YAAY,EACZ,GAAG,KAEH,EAAC,MAAD,CACE,cAAa,EAAc,EAAW,IAAA,GACtC,SAAU,EAAc,EAAI,IAAA,GAC5B,KAAM,EAAc,SAAW,OAC/B,UAAW,EACT,sIACO,IAAa,QAClB,CAAC,GACD,kCACF,GAAc,8CACd,GACE,wGACF,EACD,CACD,GAAI,WAEJ,EAAC,MAAD,CACE,MAAO,CACL,UAAW,GAAG,EAAU,IACzB,CACD,UAAU,0BAET,WACG,CAAA,CACF,CAAA"}

package/dist/esm/components/Modal/Modal.mjs

@@ -1,2 +1,2 @@
-"use client";import{cn as e}from"../../utils/cn.mjs";import{Container as t}from"../Container/index.mjs";import{Button as n,ButtonColor as r,ButtonSize as i,ButtonVariant as a}from"../Button/Button.mjs";import{H3 as o}from"../Headers/index.mjs";import{useGetElementOrWindow as s}from"../../hooks/useGetElementOrWindow.mjs";import{useScrollBlockage as c}from"../../hooks/useScrollBlockage/index.mjs";import{X as l}from"lucide-react";import{useEffect as u}from"react";import{cva as d}from"class-variance-authority";import{Fragment as f,jsx as p,jsxs as m}from"react/jsx-runtime";import{motion as h}from"framer-motion";import{createPortal as g}from"react-dom";let _=function(e){return e.SM=`sm`,e.MD=`md`,e.LG=`lg`,e.XL=`xl`,e.UNSET=`unset`,e}({});const v=d(`flex cursor-default flex-col overflow-hidden shadow-sm`,{variants:{size:{sm:`h-auto max-h-[30vh] w-[95vw] max-w-xl`,md:`h-auto max-h-[50vh] w-[95vw] max-w-xl`,lg:`h-auto max-h-[70vh] w-[95vw] max-w-4xl`,xl:`h-auto max-h-[95vh] w-[95vw] max-w-6xl`,unset:`h-auto max-h-[95vh] w-[95vw]`}},defaultVariants:{size:`unset`}}),y={none:`p-0`,sm:`px-2 py-4`,md:`px-4 py-6`,lg:`px-6 py-8`,xl:`px-8 py-10`,"2xl":`px-10 py-12`},b=h.create(t),x=({children:t,isOpen:d,container:x,onClose:S,hasCloseButton:C=!1,title:w,size:T=_.MD,className:E,isScrollable:D=!1,disableScroll:O=!0,padding:k=`none`,...A})=>{let j=s(x);if(c({key:`modal`,disableScroll:d&&O}),u(()=>{let e=e=>{e.key===`Escape`&&d&&S&&S()};return document.addEventListener(`keydown`,e),()=>{document.removeEventListener(`keydown`,e)}},[d,S]),!j)return p(f,{});let M=!!w,N=y[k||`none`];return g(p(h.div,{className:`invisible fixed top-0 left-0 z-50 flex size-full cursor-pointer items-center justify-center overflow-hidden bg-background/40 backdrop-blur`,animate:d?`visible`:`invisible`,variants:{visible:{opacity:1,visibility:`visible`,transition:{duration:.1,when:`beforeChildren`}},invisible:{opacity:0,visibility:`hidden`,transition:{duration:.1,when:`afterChildren`}}},onClick:e=>{e.stopPropagation(),S?.()},"aria-hidden":!d,children:m(b,{onClick:e=>e.stopPropagation(),initial:{scale:d?.5:1},animate:{scale:d?1:.5},transition:{duration:.3},className:v({size:T,className:E}),role:`dialog`,"aria-modal":!0,roundedSize:`4xl`,padding:`none`,...A,children:[m(`div`,{className:e(`relative flex-none px-4 pt-4`,C&&M?`flex items-start`:C?`flex justify-end`:M?`items-center`:`hidden`),children:[M&&p(o,{className:`mb-2 ml-1 flex items-center justify-center font-bold text-lg`,children:w}),C&&p(n,{variant:a.HOVERABLE,color:r.TEXT,label:`Close modal`,className:`ml-auto`,onClick:e=>{e.stopPropagation(),S?.()},Icon:l,size:i.ICON_MD})]}),p(`div`,{className:e(`flex min-h-0 w-full flex-1 flex-col`,D===!0&&`overflow-auto`,D===`y`&&`overflow-y-auto overflow-x-hidden`,D===`x`&&`overflow-x-auto overflow-y-hidden`,!D&&`overflow-visible`),children:p(`div`,{className:e(`flex h-full w-full flex-1 flex-col`,N),children:t})})]})}),j)};export{x as Modal,_ as ModalSize};
+"use client";import{cn as e}from"../../utils/cn.mjs";import{Container as t}from"../Container/index.mjs";import{Button as n,ButtonColor as r,ButtonSize as i,ButtonVariant as a}from"../Button/Button.mjs";import{H3 as o}from"../Headers/index.mjs";import{useGetElementOrWindow as s}from"../../hooks/useGetElementOrWindow.mjs";import{useScrollBlockage as c}from"../../hooks/useScrollBlockage/index.mjs";import{useEffect as l}from"react";import{cva as u}from"class-variance-authority";import{X as d}from"lucide-react";import{Fragment as f,jsx as p,jsxs as m}from"react/jsx-runtime";import{motion as h}from"framer-motion";import{createPortal as g}from"react-dom";let _=function(e){return e.SM=`sm`,e.MD=`md`,e.LG=`lg`,e.XL=`xl`,e.UNSET=`unset`,e}({});const v=u(`flex cursor-default flex-col overflow-hidden shadow-sm`,{variants:{size:{sm:`h-auto max-h-[30vh] w-[95vw] max-w-xl`,md:`h-auto max-h-[50vh] w-[95vw] max-w-xl`,lg:`h-auto max-h-[70vh] w-[95vw] max-w-4xl`,xl:`h-auto max-h-[95vh] w-[95vw] max-w-6xl`,unset:`h-auto max-h-[95vh] w-[95vw]`}},defaultVariants:{size:`unset`}}),y={none:`p-0`,sm:`px-2 py-4`,md:`px-4 py-6`,lg:`px-6 py-8`,xl:`px-8 py-10`,"2xl":`px-10 py-12`},b=h.create(t),x=({children:t,isOpen:u,container:x,onClose:S,hasCloseButton:C=!1,title:w,size:T=_.MD,className:E,isScrollable:D=!1,disableScroll:O=!0,padding:k=`none`,...A})=>{let j=s(x);if(c({key:`modal`,disableScroll:u&&O}),l(()=>{let e=e=>{e.key===`Escape`&&u&&S&&S()};return document.addEventListener(`keydown`,e),()=>{document.removeEventListener(`keydown`,e)}},[u,S]),!j)return p(f,{});let M=!!w,N=y[k||`none`];return g(p(h.div,{className:`invisible fixed top-0 left-0 z-50 flex size-full cursor-pointer items-center justify-center overflow-hidden bg-background/40 backdrop-blur`,animate:u?`visible`:`invisible`,variants:{visible:{opacity:1,visibility:`visible`,transition:{duration:.1,when:`beforeChildren`}},invisible:{opacity:0,visibility:`hidden`,transition:{duration:.1,when:`afterChildren`}}},onClick:e=>{e.stopPropagation(),S?.()},"aria-hidden":!u,children:m(b,{onClick:e=>e.stopPropagation(),initial:{scale:u?.5:1},animate:{scale:u?1:.5},transition:{duration:.3},className:v({size:T,className:E}),role:`dialog`,"aria-modal":!0,roundedSize:`4xl`,padding:`none`,...A,children:[m(`div`,{className:e(`relative flex-none px-4 pt-4`,C&&M?`flex items-start`:C?`flex justify-end`:M?`items-center`:`hidden`),children:[M&&p(o,{className:`mb-2 ml-1 flex items-center justify-center font-bold text-lg`,children:w}),C&&p(n,{variant:a.HOVERABLE,color:r.TEXT,label:`Close modal`,className:`ml-auto`,onClick:e=>{e.stopPropagation(),S?.()},Icon:d,size:i.ICON_MD})]}),p(`div`,{className:e(`flex min-h-0 w-full flex-1 flex-col`,D===!0&&`overflow-auto`,D===`y`&&`overflow-y-auto overflow-x-hidden`,D===`x`&&`overflow-x-auto overflow-y-hidden`,!D&&`overflow-visible`),children:p(`div`,{className:e(`flex h-full w-full flex-1 flex-col`,N),children:t})})]})}),j)};export{x as Modal,_ as ModalSize};
 //# sourceMappingURL=Modal.mjs.map

package/dist/esm/components/Pagination/Pagination.mjs

@@ -1,2 +1,2 @@
-"use client";import{cn as e}from"../../utils/cn.mjs";import{Button as t,ButtonColor as n,ButtonSize as r,ButtonVariant as i}from"../Button/Button.mjs";import{useItemSelector as a}from"../../hooks/useItemSelector.mjs";import{ChevronLeft as o,ChevronRight as s,MoreHorizontal as c}from"lucide-react";import{useEffect as l,useRef as u}from"react";import{cva as d}from"class-variance-authority";import{jsx as f,jsxs as p}from"react/jsx-runtime";const m=d(`flex items-center justify-center gap-1`,{variants:{size:{sm:`gap-1`,md:`gap-2`,lg:`gap-3`},color:{text:`background-text`,primary:`background-primary`,secondary:`background-secondary`,neutral:`background-neutral`,destructive:`background-destructive`},variant:{default:``,bordered:`rounded-lg border border-border p-2`,ghost:`bg-transparent`}},defaultVariants:{size:`md`,variant:`default`}});let h=function(e){return e.SM=`sm`,e.MD=`md`,e.LG=`lg`,e}({}),g=function(e){return e.DEFAULT=`default`,e.BORDERED=`bordered`,e.GHOST=`ghost`,e}({});const _=(e,t,n)=>{if(t<=n)return Array.from({length:t},(e,t)=>t+1);let r=[],i=Math.floor(n/2);if(r.push(1),e<=i+2){for(let e=2;e<=Math.min(n-1,t-1);e++)r.push(e);t>n&&r.push(`ellipsis`),t>1&&r.push(t)}else if(e>=t-i-1){t>n&&r.push(`ellipsis`);for(let e=Math.max(2,t-n+2);e<=t;e++)r.push(e)}else{r.push(`ellipsis`);let n=e-i,a=e+i;for(let e=n;e<=a;e++)r.push(e);r.push(`ellipsis`),r.push(t)}return r},v=e=>e?.getAttribute(`aria-current`)===`true`,y=e=>e===h.SM?r.ICON_SM:e===h.LG?r.ICON_LG:r.ICON_MD,b=e=>f(`div`,{className:`absolute top-0 z-0 h-full w-auto rounded-xl bg-text/20 ring-4 ring-text/10 transition-[left,width] duration-300 ease-in-out [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl motion-reduce:transition-none`,...e}),x=({currentPage:r,totalPages:d,onPageChange:x,showFirstLast:S=!1,showPrevNext:C=!0,maxVisiblePages:w=5,disabled:T=!1,size:E=h.MD,variant:D=g.DEFAULT,color:O=n.TEXT,className:k,...A})=>{let j=_(r,d,w),M=y(E),N=r===1,P=r===d,F=u([]),I=u(null),{choiceIndicatorPosition:L,calculatePosition:R}=a(F,{selector:v,isHoverable:!0});if(l(()=>{let e=setTimeout(()=>{R()},300);return()=>clearTimeout(e)},[r,R]),d<=1)return null;let z=e=>{!T&&e>=1&&e<=d&&e!==r&&x(e)};return f(`div`,{className:e(m({size:E,variant:D}),k),...A,children:p(`div`,{className:`relative flex items-center gap-1`,children:[L&&f(b,{style:L,ref:I}),C&&f(t,{variant:i.OUTLINE,size:M,color:n.TEXT,onClick:()=>z(r-1),disabled:T||N,label:`Go to previous page`,Icon:o,ref:e=>{e&&(F.current[0]=e)},className:`min-w-0 px-2`}),f(`div`,{className:`flex items-center gap-1 max-md:gap-0.5`,children:j.map((a,o)=>{if(a===`ellipsis`)return f(`div`,{className:`flex h-8 min-w-8 items-center justify-center px-1`,children:f(c,{className:`h-4 w-4 text-muted-foreground`})},`ellipsis-${a}-${o}`);let s=a===r,l=(C?1:0)+j.slice(0,o).filter(e=>e!==`ellipsis`).length;return f(t,{variant:s?i.DEFAULT:i.OUTLINE,size:M,color:n.TEXT,onClick:()=>z(a),disabled:T,label:`Go to page ${a}`,"aria-current":s?`true`:`false`,ref:e=>{e&&(F.current[l]=e)},className:e(`flex aspect-square h-8 w-8 min-w-0 items-center justify-center p-0 text-sm`,E===`sm`&&`h-6 w-6 text-xs`,E===`lg`&&`h-10 w-10 text-base`,s&&`font-semibold`),children:a},a)})}),C&&f(t,{variant:i.OUTLINE,size:M,color:n.TEXT,onClick:()=>z(r+1),disabled:T||P,label:`Go to next page`,Icon:s,ref:e=>{let t=(C?1:0)+j.filter(e=>e!==`ellipsis`).length;e&&(F.current[t]=e)},className:`min-w-0 px-2`})]})})};export{x as Pagination,h as PaginationSize,g as PaginationVariant,m as paginationVariants};
+"use client";import{cn as e}from"../../utils/cn.mjs";import{Button as t,ButtonColor as n,ButtonSize as r,ButtonVariant as i}from"../Button/Button.mjs";import{useItemSelector as a}from"../../hooks/useItemSelector.mjs";import{useEffect as o,useRef as s}from"react";import{cva as c}from"class-variance-authority";import{ChevronLeft as l,ChevronRight as u,MoreHorizontal as d}from"lucide-react";import{jsx as f,jsxs as p}from"react/jsx-runtime";const m=c(`flex items-center justify-center gap-1`,{variants:{size:{sm:`gap-1`,md:`gap-2`,lg:`gap-3`},color:{text:`background-text`,primary:`background-primary`,secondary:`background-secondary`,neutral:`background-neutral`,destructive:`background-destructive`},variant:{default:``,bordered:`rounded-lg border border-border p-2`,ghost:`bg-transparent`}},defaultVariants:{size:`md`,variant:`default`}});let h=function(e){return e.SM=`sm`,e.MD=`md`,e.LG=`lg`,e}({}),g=function(e){return e.DEFAULT=`default`,e.BORDERED=`bordered`,e.GHOST=`ghost`,e}({});const _=(e,t,n)=>{if(t<=n)return Array.from({length:t},(e,t)=>t+1);let r=[],i=Math.floor(n/2);if(r.push(1),e<=i+2){for(let e=2;e<=Math.min(n-1,t-1);e++)r.push(e);t>n&&r.push(`ellipsis`),t>1&&r.push(t)}else if(e>=t-i-1){t>n&&r.push(`ellipsis`);for(let e=Math.max(2,t-n+2);e<=t;e++)r.push(e)}else{r.push(`ellipsis`);let n=e-i,a=e+i;for(let e=n;e<=a;e++)r.push(e);r.push(`ellipsis`),r.push(t)}return r},v=e=>e?.getAttribute(`aria-current`)===`true`,y=e=>e===h.SM?r.ICON_SM:e===h.LG?r.ICON_LG:r.ICON_MD,b=e=>f(`div`,{className:`absolute top-0 z-0 h-full w-auto rounded-xl bg-text/20 ring-4 ring-text/10 transition-[left,width] duration-300 ease-in-out [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl motion-reduce:transition-none`,...e}),x=({currentPage:r,totalPages:c,onPageChange:x,showFirstLast:S=!1,showPrevNext:C=!0,maxVisiblePages:w=5,disabled:T=!1,size:E=h.MD,variant:D=g.DEFAULT,color:O=n.TEXT,className:k,...A})=>{let j=_(r,c,w),M=y(E),N=r===1,P=r===c,F=s([]),I=s(null),{choiceIndicatorPosition:L,calculatePosition:R}=a(F,{selector:v,isHoverable:!0});if(o(()=>{let e=setTimeout(()=>{R()},300);return()=>clearTimeout(e)},[r,R]),c<=1)return null;let z=e=>{!T&&e>=1&&e<=c&&e!==r&&x(e)};return f(`div`,{className:e(m({size:E,variant:D}),k),...A,children:p(`div`,{className:`relative flex items-center gap-1`,children:[L&&f(b,{style:L,ref:I}),C&&f(t,{variant:i.OUTLINE,size:M,color:n.TEXT,onClick:()=>z(r-1),disabled:T||N,label:`Go to previous page`,Icon:l,ref:e=>{e&&(F.current[0]=e)},className:`min-w-0 px-2`}),f(`div`,{className:`flex items-center gap-1 max-md:gap-0.5`,children:j.map((a,o)=>{if(a===`ellipsis`)return f(`div`,{className:`flex h-8 min-w-8 items-center justify-center px-1`,children:f(d,{className:`h-4 w-4 text-muted-foreground`})},`ellipsis-${a}-${o}`);let s=a===r,c=(C?1:0)+j.slice(0,o).filter(e=>e!==`ellipsis`).length;return f(t,{variant:s?i.DEFAULT:i.OUTLINE,size:M,color:n.TEXT,onClick:()=>z(a),disabled:T,label:`Go to page ${a}`,"aria-current":s?`true`:`false`,ref:e=>{e&&(F.current[c]=e)},className:e(`flex aspect-square h-8 w-8 min-w-0 items-center justify-center p-0 text-sm`,E===`sm`&&`h-6 w-6 text-xs`,E===`lg`&&`h-10 w-10 text-base`,s&&`font-semibold`),children:a},a)})}),C&&f(t,{variant:i.OUTLINE,size:M,color:n.TEXT,onClick:()=>z(r+1),disabled:T||P,label:`Go to next page`,Icon:u,ref:e=>{let t=(C?1:0)+j.filter(e=>e!==`ellipsis`).length;e&&(F.current[t]=e)},className:`min-w-0 px-2`})]})})};export{x as Pagination,h as PaginationSize,g as PaginationVariant,m as paginationVariants};
 //# sourceMappingURL=Pagination.mjs.map

package/dist/esm/components/RightDrawer/RightDrawer.mjs

@@ -1,2 +1,2 @@
-"use client";import{Container as e}from"../Container/index.mjs";import{Button as t,ButtonColor as n,ButtonSize as r,ButtonVariant as i}from"../Button/Button.mjs";import{useDevice as a}from"../../hooks/useDevice.mjs";import{KeyboardShortcut as o}from"../KeyboardShortcut/KeyboardShortcut.mjs";import{Popover as s}from"../Popover/dynamic.mjs";import{useGetElementOrWindow as c}from"../../hooks/useGetElementOrWindow.mjs";import{useScrollBlockage as l}from"../../hooks/useScrollBlockage/index.mjs";import{MaxWidthSmoother as u}from"../MaxWidthSmoother/index.mjs";import{isElementAtTopAndNotCovered as d}from"./isElementAtTopAndNotCovered.mjs";import{useRightDrawer as f}from"./useRightDrawer.mjs";import{ChevronLeft as p,X as m}from"lucide-react";import{useEffect as h,useRef as g}from"react";import{Fragment as _,jsx as v,jsxs as y}from"react/jsx-runtime";import{useIntlayer as b}from"react-intlayer";import{createPortal as x}from"react-dom";const S=({title:S,identifier:C,children:w,header:T,footer:E,closeOnOutsideClick:D=!0,backButton:O,isOpen:k,onClose:A,container:j})=>{let M=b(`right-drawer`),{isMobile:N}=a(`md`),P=g(null),F=g(null),I=c(j),{open:L,close:R,isOpen:z}=f(),B=z(C),V=B;l({disableScroll:V,key:C?`right_drawer_${C}`:`right_drawer`}),h(()=>{let e=e=>{try{if(!P.current)return;let t=V&&D,n=e.target&&!P.current.contains(e.target),r=d(P.current);(t&&n&&r||!e.target)&&(R(C),A?.())}catch{R(C),A?.()}};return window.addEventListener(`mousedown`,e),()=>window.removeEventListener(`mousedown`,e)},[V,R,A,D,C]);let H=g(A);return h(()=>{H.current=A},[A]),h(()=>{k!==void 0&&k!==B&&(k?L(C):(R(C),H.current?.()))},[k,B,C,L,R]),I?x(v(`div`,{className:`fixed top-0 right-0 z-50 flex h-full justify-end`,children:v(u,{isHidden:!V,align:`right`,children:y(e,{className:`relative flex h-screen w-screen flex-col text-text md:w-[400px]`,ref:P,roundedSize:`none`,children:[y(`div`,{className:`flex shrink-0 flex-col gap-3 px-6 pt-6`,children:[y(`div`,{className:`flex justify-between gap-3`,children:[v(`div`,{children:O&&v(t,{variant:i.HOVERABLE,color:n.TEXT,label:O.text??M.goBack.value,onClick:O.onBack,Icon:p,children:O?.text})}),v(`div`,{children:y(s,{identifier:`close-drawer`,children:[v(t,{variant:i.HOVERABLE,color:n.TEXT,label:`Close`,className:`ml-auto`,onClick:()=>{R(C),A?.()},Icon:m,size:r.ICON_MD}),v(s.Detail,{identifier:`close-drawer`,children:y(`div`,{className:`flex items-center gap-2 p-2`,children:[v(`span`,{className:`whitespace-nowrap text-neutral text-xs`,children:M.closeDrawer}),v(o,{shortcut:`Escape`,size:`sm`,onTriggered:()=>{R(C),A?.()}})]})})]})})]}),S&&v(`h2`,{className:`flex items-center justify-center font-bold text-lg`,children:S}),T]}),v(`div`,{className:`flex min-h-0 flex-1 flex-col overflow-y-auto p-2`,children:v(`div`,{className:`flex flex-1 flex-col outline-none`,onClick:e=>{e.target===e.currentTarget&&N&&(R(C),A?.())},onKeyDown:e=>{e.target===e.currentTarget&&(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),N&&(R(C),A?.()))},ref:F,role:`button`,tabIndex:0,children:w})}),E&&v(`div`,{className:`shrink-0`,children:E})]})})}),I):v(_,{})};export{S as RightDrawer};
+"use client";import{Container as e}from"../Container/index.mjs";import{Button as t,ButtonColor as n,ButtonSize as r,ButtonVariant as i}from"../Button/Button.mjs";import{useDevice as a}from"../../hooks/useDevice.mjs";import{KeyboardShortcut as o}from"../KeyboardShortcut/KeyboardShortcut.mjs";import{Popover as s}from"../Popover/dynamic.mjs";import{useGetElementOrWindow as c}from"../../hooks/useGetElementOrWindow.mjs";import{useScrollBlockage as l}from"../../hooks/useScrollBlockage/index.mjs";import{MaxWidthSmoother as u}from"../MaxWidthSmoother/index.mjs";import{isElementAtTopAndNotCovered as d}from"./isElementAtTopAndNotCovered.mjs";import{useRightDrawer as f}from"./useRightDrawer.mjs";import{useEffect as p,useRef as m}from"react";import{ChevronLeft as h,X as g}from"lucide-react";import{Fragment as _,jsx as v,jsxs as y}from"react/jsx-runtime";import{useIntlayer as b}from"react-intlayer";import{createPortal as x}from"react-dom";const S=({title:S,identifier:C,children:w,header:T,footer:E,closeOnOutsideClick:D=!0,backButton:O,isOpen:k,onClose:A,container:j})=>{let M=b(`right-drawer`),{isMobile:N}=a(`md`),P=m(null),F=m(null),I=c(j),{open:L,close:R,isOpen:z}=f(),B=z(C),V=B;l({disableScroll:V,key:C?`right_drawer_${C}`:`right_drawer`}),p(()=>{let e=e=>{try{if(!P.current)return;let t=V&&D,n=e.target&&!P.current.contains(e.target),r=d(P.current);(t&&n&&r||!e.target)&&(R(C),A?.())}catch{R(C),A?.()}};return window.addEventListener(`mousedown`,e),()=>window.removeEventListener(`mousedown`,e)},[V,R,A,D,C]);let H=m(A);return p(()=>{H.current=A},[A]),p(()=>{k!==void 0&&k!==B&&(k?L(C):(R(C),H.current?.()))},[k,B,C,L,R]),I?x(v(`div`,{className:`fixed top-0 right-0 z-50 flex h-full justify-end`,children:v(u,{isHidden:!V,align:`right`,children:y(e,{className:`relative flex h-screen w-screen flex-col text-text md:w-[400px]`,ref:P,roundedSize:`none`,children:[y(`div`,{className:`flex shrink-0 flex-col gap-3 px-6 pt-6`,children:[y(`div`,{className:`flex justify-between gap-3`,children:[v(`div`,{children:O&&v(t,{variant:i.HOVERABLE,color:n.TEXT,label:O.text??M.goBack.value,onClick:O.onBack,Icon:h,children:O?.text})}),v(`div`,{children:y(s,{identifier:`close-drawer`,children:[v(t,{variant:i.HOVERABLE,color:n.TEXT,label:`Close`,className:`ml-auto`,onClick:()=>{R(C),A?.()},Icon:g,size:r.ICON_MD}),v(s.Detail,{identifier:`close-drawer`,children:y(`div`,{className:`flex items-center gap-2 p-2`,children:[v(`span`,{className:`whitespace-nowrap text-neutral text-xs`,children:M.closeDrawer}),v(o,{shortcut:`Escape`,size:`sm`,onTriggered:()=>{R(C),A?.()}})]})})]})})]}),S&&v(`h2`,{className:`flex items-center justify-center font-bold text-lg`,children:S}),T]}),v(`div`,{className:`flex min-h-0 flex-1 flex-col overflow-y-auto p-2`,children:v(`div`,{className:`flex flex-1 flex-col outline-none`,onClick:e=>{e.target===e.currentTarget&&N&&(R(C),A?.())},onKeyDown:e=>{e.target===e.currentTarget&&(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),N&&(R(C),A?.()))},ref:F,role:`button`,tabIndex:0,children:w})}),E&&v(`div`,{className:`shrink-0`,children:E})]})})}),I):v(_,{})};export{S as RightDrawer};
 //# sourceMappingURL=RightDrawer.mjs.map

package/dist/esm/components/Select/Multiselect.mjs

@@ -1,2 +1,2 @@
-"use client";import{cn as e}from"../../utils/cn.mjs";import{Badge as t,BadgeColor as n}from"../Badge/index.mjs";import{Command as r,CommandRoot as i}from"../Command/index.mjs";import{Check as a,X as o}from"lucide-react";import{createContext as s,useCallback as c,useContext as l,useEffect as u,useMemo as d,useRef as f,useState as p}from"react";import{jsx as m,jsxs as h}from"react/jsx-runtime";const g=s(null),_=()=>{let e=l(g);if(!e)throw Error(`useMultiSelect must be used within MultiSelectProvider`);return e},v=({values:t,defaultValues:n,onValueChange:r,loop:a=!1,className:o,children:s,dir:l,...h})=>{let[_,v]=p(n??[]),[y,b]=p(``),[x,S]=p(!1),[C,w]=p(-1),T=f(null),[E,D]=p(!1),[O,k]=p(``);u(()=>{t&&v(t)},[t]);let A=c(e=>{if(_.includes(e)){let t=_.filter(t=>t!==e);v(t),r?.(t)}else{let t=[..._,e];v(t),r?.(t)}},[_]),j=c(e=>{e.preventDefault();let t=e.currentTarget,n=t.value.substring(t.selectionStart??0,t.selectionEnd??0);k(n),D(n===y)},[y]),M=c(e=>{e.stopPropagation();let t=T.current;if(!t)return;let n=()=>{let e=C+1;w(e>_.length-1?a?0:-1:e)},r=()=>{let e=C-1;w(e<0?_.length-1:e)},i=()=>{w(C-1<=0?_.length-1==0?-1:0:C-1)};switch(e.key){case`ArrowLeft`:l===`rtl`?_.length>0&&(C!==-1||a)&&n():_.length>0&&t.selectionStart===0&&r();break;case`ArrowRight`:l===`rtl`?_.length>0&&t.selectionStart===0&&r():_.length>0&&(C!==-1||a)&&n();break;case`Backspace`:case`Delete`:_.length>0&&(C!==-1&&C<_.length?(A(_[C]),i()):(t.selectionStart===0&&O===y||E)&&A(_[_.length-1]));break;case`Enter`:S(!0);break;case`Escape`:C===-1?x&&S(!1):w(-1);break}},[_,y,C,a]);return m(g,{value:d(()=>({value:_,onValueChange:A,open:x,setOpen:S,inputValue:y,setInputValue:b,activeIndex:C,setActiveIndex:w,ref:T,handleSelect:j}),[_,A,x,S,y,b,C,w,T,j]),children:m(i,{onKeyDown:M,className:e(`flex w-full flex-col gap-2 overflow-visible bg-transparent`,o),dir:l,...h,children:s})})},y=({className:r,getBadgeValue:i=e=>e,validationStyleEnabled:a=!1,children:s,...l})=>{let{value:u,onValueChange:d,activeIndex:f}=_(),p=c(e=>{e.preventDefault(),e.stopPropagation()},[]);return h(`div`,{className:e(`flex w-full flex-col gap-3`,`cursor-pointer select-text text-base shadow-none outline-none md:text-sm`,`rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl`,`px-2 py-3 md:py-2`,`bg-neutral-50 dark:bg-neutral-950`,`text-text`,`ring-0`,`focus-within:outline-none`,`focus-within:ring-3`,`focus-within:ring-neutral-200`,`dark:focus-within:ring-neutral-500`,`focus-within:ring-offset-white`,`dark:focus-within:ring-offset-neutral-500`,`[box-shadow:none]`,`disabled:cursor-not-allowed disabled:opacity-50`,`aria-invalid:border-error`,a&&`valid:border-success invalid:border-error`,r),...l,children:[u.length>0&&m(`div`,{className:`flex w-full flex-wrap gap-1`,children:u.map((r,a)=>h(t,{className:e(`flex items-center gap-1 rounded-xl px-1`,f===a&&`ring-2 ring-muted-foreground`),color:n.TEXT,children:[m(`span`,{className:`text-xs`,children:i(r)}),h(`button`,{"aria-label":`Remove ${r} option`,"aria-roledescription":`button to remove option`,onMouseDown:p,onClick:()=>d(r),children:[h(`span`,{className:`sr-only`,children:[`Remove `,r,` option`]}),m(o,{className:`size-4 cursor-pointer`})]})]},r))}),s]})},b=({className:t,...n})=>{let{setOpen:i,inputValue:a,setInputValue:o,activeIndex:s,setActiveIndex:c,handleSelect:l,ref:u}=_();return m(r.Input,{...n,tabIndex:0,ref:u,value:a,onValueChange:s===-1?o:void 0,onSelect:l,onBlur:()=>i(!1),onFocus:()=>i(!0),onClick:()=>c(-1),className:e(`ml-2 flex-1 cursor-pointer outline-hidden`,t,s!==-1&&`caret-transparent`)})},x=({children:e})=>{let{open:t}=_();return m(`div`,{className:`relative`,children:t&&e})},S=({className:t,children:n})=>h(r.List,{className:e(`absolute top-0 z-10 flex w-full flex-col gap-2`,`rounded-xl p-2 shadow-md`,`bg-white dark:bg-neutral-950`,`text-text`,`border border-neutral-200 dark:border-neutral-800`,`transition-colors`,t),children:[n,m(r.Empty,{children:m(`span`,{className:`text-muted-foreground`,children:`No results found`})})]}),C=({className:t,value:n,children:i,...o})=>{let{value:s,onValueChange:l,setInputValue:u}=_(),d=c(e=>{e.preventDefault(),e.stopPropagation()},[]),f=s.includes(n);return h(r.Item,{...o,onSelect:()=>{l(n),u(``)},className:e(`flex cursor-pointer justify-between`,`rounded-lg px-2 py-1`,`transition-colors`,`hover:bg-neutral/10`,f&&`opacity-50`,o.disabled&&`cursor-not-allowed opacity-50`,t),onMouseDown:d,children:[i,f&&m(a,{className:`size-4`})]})},w=v;w.Trigger=y,w.Input=b,w.Content=x,w.List=S,w.Item=C;export{w as MultiSelect};
+"use client";import{cn as e}from"../../utils/cn.mjs";import{Badge as t,BadgeColor as n}from"../Badge/index.mjs";import{Command as r,CommandRoot as i}from"../Command/index.mjs";import{createContext as a,useCallback as o,useContext as s,useEffect as c,useMemo as l,useRef as u,useState as d}from"react";import{Check as f,X as p}from"lucide-react";import{jsx as m,jsxs as h}from"react/jsx-runtime";const g=a(null),_=()=>{let e=s(g);if(!e)throw Error(`useMultiSelect must be used within MultiSelectProvider`);return e},v=({values:t,defaultValues:n,onValueChange:r,loop:a=!1,className:s,children:f,dir:p,...h})=>{let[_,v]=d(n??[]),[y,b]=d(``),[x,S]=d(!1),[C,w]=d(-1),T=u(null),[E,D]=d(!1),[O,k]=d(``);c(()=>{t&&v(t)},[t]);let A=o(e=>{if(_.includes(e)){let t=_.filter(t=>t!==e);v(t),r?.(t)}else{let t=[..._,e];v(t),r?.(t)}},[_]),j=o(e=>{e.preventDefault();let t=e.currentTarget,n=t.value.substring(t.selectionStart??0,t.selectionEnd??0);k(n),D(n===y)},[y]),M=o(e=>{e.stopPropagation();let t=T.current;if(!t)return;let n=()=>{let e=C+1;w(e>_.length-1?a?0:-1:e)},r=()=>{let e=C-1;w(e<0?_.length-1:e)},i=()=>{w(C-1<=0?_.length-1==0?-1:0:C-1)};switch(e.key){case`ArrowLeft`:p===`rtl`?_.length>0&&(C!==-1||a)&&n():_.length>0&&t.selectionStart===0&&r();break;case`ArrowRight`:p===`rtl`?_.length>0&&t.selectionStart===0&&r():_.length>0&&(C!==-1||a)&&n();break;case`Backspace`:case`Delete`:_.length>0&&(C!==-1&&C<_.length?(A(_[C]),i()):(t.selectionStart===0&&O===y||E)&&A(_[_.length-1]));break;case`Enter`:S(!0);break;case`Escape`:C===-1?x&&S(!1):w(-1);break}},[_,y,C,a]);return m(g,{value:l(()=>({value:_,onValueChange:A,open:x,setOpen:S,inputValue:y,setInputValue:b,activeIndex:C,setActiveIndex:w,ref:T,handleSelect:j}),[_,A,x,S,y,b,C,w,T,j]),children:m(i,{onKeyDown:M,className:e(`flex w-full flex-col gap-2 overflow-visible bg-transparent`,s),dir:p,...h,children:f})})},y=({className:r,getBadgeValue:i=e=>e,validationStyleEnabled:a=!1,children:s,...c})=>{let{value:l,onValueChange:u,activeIndex:d}=_(),f=o(e=>{e.preventDefault(),e.stopPropagation()},[]);return h(`div`,{className:e(`flex w-full flex-col gap-3`,`cursor-pointer select-text text-base shadow-none outline-none md:text-sm`,`rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl`,`px-2 py-3 md:py-2`,`bg-neutral-50 dark:bg-neutral-950`,`text-text`,`ring-0`,`focus-within:outline-none`,`focus-within:ring-3`,`focus-within:ring-neutral-200`,`dark:focus-within:ring-neutral-500`,`focus-within:ring-offset-white`,`dark:focus-within:ring-offset-neutral-500`,`[box-shadow:none]`,`disabled:cursor-not-allowed disabled:opacity-50`,`aria-invalid:border-error`,a&&`valid:border-success invalid:border-error`,r),...c,children:[l.length>0&&m(`div`,{className:`flex w-full flex-wrap gap-1`,children:l.map((r,a)=>h(t,{className:e(`flex items-center gap-1 rounded-xl px-1`,d===a&&`ring-2 ring-muted-foreground`),color:n.TEXT,children:[m(`span`,{className:`text-xs`,children:i(r)}),h(`button`,{"aria-label":`Remove ${r} option`,"aria-roledescription":`button to remove option`,onMouseDown:f,onClick:()=>u(r),children:[h(`span`,{className:`sr-only`,children:[`Remove `,r,` option`]}),m(p,{className:`size-4 cursor-pointer`})]})]},r))}),s]})},b=({className:t,...n})=>{let{setOpen:i,inputValue:a,setInputValue:o,activeIndex:s,setActiveIndex:c,handleSelect:l,ref:u}=_();return m(r.Input,{...n,tabIndex:0,ref:u,value:a,onValueChange:s===-1?o:void 0,onSelect:l,onBlur:()=>i(!1),onFocus:()=>i(!0),onClick:()=>c(-1),className:e(`ml-2 flex-1 cursor-pointer outline-hidden`,t,s!==-1&&`caret-transparent`)})},x=({children:e})=>{let{open:t}=_();return m(`div`,{className:`relative`,children:t&&e})},S=({className:t,children:n})=>h(r.List,{className:e(`absolute top-0 z-10 flex w-full flex-col gap-2`,`rounded-xl p-2 shadow-md`,`bg-white dark:bg-neutral-950`,`text-text`,`border border-neutral-200 dark:border-neutral-800`,`transition-colors`,t),children:[n,m(r.Empty,{children:m(`span`,{className:`text-muted-foreground`,children:`No results found`})})]}),C=({className:t,value:n,children:i,...a})=>{let{value:s,onValueChange:c,setInputValue:l}=_(),u=o(e=>{e.preventDefault(),e.stopPropagation()},[]),d=s.includes(n);return h(r.Item,{...a,onSelect:()=>{c(n),l(``)},className:e(`flex cursor-pointer justify-between`,`rounded-lg px-2 py-1`,`transition-colors`,`hover:bg-neutral/10`,d&&`opacity-50`,a.disabled&&`cursor-not-allowed opacity-50`,t),onMouseDown:u,children:[i,d&&m(f,{className:`size-4`})]})},w=v;w.Trigger=y,w.Input=b,w.Content=x,w.List=S,w.Item=C;export{w as MultiSelect};
 //# sourceMappingURL=Multiselect.mjs.map