@customafk/lunas-ui 0.2.82 → 0.2.83

package/dist/{textarea-field-B38SnNv4.cjs → textarea-field-BhqX29CS.cjs}

@@ -1,2 +1,2 @@
-const e=require("./tanstack-form-BxqS40rB.cjs"),t=require("./ui/textarea.cjs"),n=require("./field-BSLi-P0Q.cjs");let r=require("lucide-react"),i=require("react"),a=require("@customafk/react-toolkit/utils"),o=require("react/jsx-runtime"),s=require("@tanstack/react-form");const c=(0,i.memo)(({label:c,description:l,placeholder:u,tooltip:d,helperText:f,counter:p=!1,orientation:m=`responsive`,showErrorMessage:h=!0,required:g=!1,disabled:_=!1,maxLength:v})=>{let y=(0,i.useId)(),b=(0,i.useId)(),[x,S]=(0,i.useState)(!1),C=(0,i.useRef)(null),{form:w,state:T,name:E,handleBlur:D,handleChange:O}=e.G(),k=(0,s.useStore)(w.store,({isSubmitting:e})=>e),A=_||k,j=T.value?.length??0,M=(0,i.useMemo)(()=>p?v?`${j} / ${v} ký tự`:`${j} ký tự`:``,[j,p,v]),N=!!v&&j>=v*.8,P=!!v&&j>=v,F=T.meta.isDirty||T.meta.isTouched,I=F&&!T.meta.isValid,L=g&&T.value===null,R=!!T.meta.errors.length,z=!!T.value&&!A,B=(0,i.useMemo)(()=>(0,a.cn)(`h-4 flex-0 text-nowrap text-end text-xs tabular-nums transition-colors`,P?`font-medium text-danger-strong`:N?`text-warning-strong`:`text-text-positive-weak`),[P,N]),V=(0,i.useCallback)(({target:{value:e}})=>{A||p&&v&&e.length>v||O(e||null)},[A,p,v,O]),H=(0,i.useCallback)(async()=>{T.value&&(await navigator.clipboard.writeText(T.value),C.current!==null&&window.clearTimeout(C.current),S(!0),C.current=window.setTimeout(()=>S(!1),1500))},[T.value]);return(0,i.useEffect)(()=>()=>{C.current!==null&&window.clearTimeout(C.current)},[]),(0,o.jsxs)(n.FieldGroup,{className:`gap-y-4 px-4`,children:[(0,o.jsxs)(n.Field,{orientation:m,"data-invalid":I,children:[(0,o.jsxs)(n.FieldContent,{children:[(0,o.jsxs)(n.FieldLabel,{"aria-required":L,htmlFor:y,children:[c,d&&(0,o.jsx)(n.FieldTooltip,{tooltip:d})]}),(0,o.jsx)(n.FieldDescription,{children:l})]}),(0,o.jsxs)(n.FieldContentMain,{children:[(0,o.jsx)(t.Textarea,{id:y,name:E,value:T.value??``,"aria-invalid":I,"aria-describedby":b,autoCapitalize:`none`,autoComplete:`off`,autoCorrect:`off`,placeholder:u,disabled:A,className:(0,a.cn)(A&&`pointer-events-none bg-muted-muted opacity-60`),onChange:V,onBlur:D}),z&&(0,o.jsx)(`button`,{type:`button`,"aria-label":`Sao chép`,className:`absolute inset-e-1 top-2 flex size-4 cursor-pointer items-center justify-center rounded-md outline-none transition-[color,transform] focus-visible:[&>svg]:scale-125 [&>svg]:size-3.5 [&>svg]:transition-transform`,onClick:H,children:x?(0,o.jsx)(r.CheckIcon,{"aria-hidden":`true`,className:`text-success-strong`}):(0,o.jsx)(r.CopyIcon,{"aria-hidden":`true`,className:`text-text-positive-weak transition-colors hover:text-text-positive focus-visible:text-primary-strong`})}),k&&(0,o.jsx)(`div`,{className:`absolute inset-e-2 inset-y-0 top-2.5 text-muted-weak`,children:(0,o.jsx)(r.Loader2Icon,{size:14,className:`animate-spin text-primary-strong`})}),!z&&F&&h&&R&&(0,o.jsx)(`div`,{className:`absolute inset-e-2 inset-y-0 top-2.5 text-danger-strong`,children:(0,o.jsx)(r.BanIcon,{size:14})}),(0,o.jsxs)(`div`,{className:`my-1 flex w-full items-start justify-between gap-x-2`,children:[F&&h?(0,o.jsx)(n.FieldError,{id:b,className:`flex-1`,errors:T.meta.errors}):(0,o.jsx)(`div`,{}),!!p&&(0,o.jsx)(`p`,{className:B,children:M})]}),(0,o.jsx)(n.FieldNote,{isShow:!!f,children:f})]})]}),(0,o.jsx)(n.FieldSeparator,{})]})});c.displayName=`TextareaField`,exports.TextareaField=c;
-//# sourceMappingURL=textarea-field-B38SnNv4.cjs.map
+const e=require("./tanstack-form-C0ab8EEl.cjs"),t=require("./ui/textarea.cjs"),n=require("./field-BSLi-P0Q.cjs");let r=require("lucide-react"),i=require("react"),a=require("@customafk/react-toolkit/utils"),o=require("react/jsx-runtime"),s=require("@tanstack/react-form");const c=(0,i.memo)(({label:c,description:l,placeholder:u,tooltip:d,helperText:f,counter:p=!1,orientation:m=`responsive`,showErrorMessage:h=!0,required:g=!1,disabled:_=!1,maxLength:v})=>{let y=(0,i.useId)(),b=(0,i.useId)(),[x,S]=(0,i.useState)(!1),C=(0,i.useRef)(null),{form:w,state:T,name:E,handleBlur:D,handleChange:O}=e.G(),k=(0,s.useStore)(w.store,({isSubmitting:e})=>e),A=_||k,j=T.value?.length??0,M=(0,i.useMemo)(()=>p?v?`${j} / ${v} ký tự`:`${j} ký tự`:``,[j,p,v]),N=!!v&&j>=v*.8,P=!!v&&j>=v,F=T.meta.isDirty||T.meta.isTouched,I=F&&!T.meta.isValid,L=g&&T.value===null,R=!!T.meta.errors.length,z=!!T.value&&!A,B=(0,i.useMemo)(()=>(0,a.cn)(`h-4 flex-0 text-nowrap text-end text-xs tabular-nums transition-colors`,P?`font-medium text-danger-strong`:N?`text-warning-strong`:`text-text-positive-weak`),[P,N]),V=(0,i.useCallback)(({target:{value:e}})=>{A||p&&v&&e.length>v||O(e||null)},[A,p,v,O]),H=(0,i.useCallback)(async()=>{T.value&&(await navigator.clipboard.writeText(T.value),C.current!==null&&window.clearTimeout(C.current),S(!0),C.current=window.setTimeout(()=>S(!1),1500))},[T.value]);return(0,i.useEffect)(()=>()=>{C.current!==null&&window.clearTimeout(C.current)},[]),(0,o.jsxs)(n.FieldGroup,{className:`gap-y-4 px-4`,children:[(0,o.jsxs)(n.Field,{orientation:m,"data-invalid":I,children:[(0,o.jsxs)(n.FieldContent,{children:[(0,o.jsxs)(n.FieldLabel,{"aria-required":L,htmlFor:y,children:[c,d&&(0,o.jsx)(n.FieldTooltip,{tooltip:d})]}),(0,o.jsx)(n.FieldDescription,{children:l})]}),(0,o.jsxs)(n.FieldContentMain,{children:[(0,o.jsx)(t.Textarea,{id:y,name:E,value:T.value??``,"aria-invalid":I,"aria-describedby":b,autoCapitalize:`none`,autoComplete:`off`,autoCorrect:`off`,placeholder:u,disabled:A,className:(0,a.cn)(A&&`pointer-events-none bg-muted-muted opacity-60`),onChange:V,onBlur:D}),z&&(0,o.jsx)(`button`,{type:`button`,"aria-label":`Sao chép`,className:`absolute inset-e-1 top-2 flex size-4 cursor-pointer items-center justify-center rounded-md outline-none transition-[color,transform] focus-visible:[&>svg]:scale-125 [&>svg]:size-3.5 [&>svg]:transition-transform`,onClick:H,children:x?(0,o.jsx)(r.CheckIcon,{"aria-hidden":`true`,className:`text-success-strong`}):(0,o.jsx)(r.CopyIcon,{"aria-hidden":`true`,className:`text-text-positive-weak transition-colors hover:text-text-positive focus-visible:text-primary-strong`})}),k&&(0,o.jsx)(`div`,{className:`absolute inset-e-2 inset-y-0 top-2.5 text-muted-weak`,children:(0,o.jsx)(r.Loader2Icon,{size:14,className:`animate-spin text-primary-strong`})}),!z&&F&&h&&R&&(0,o.jsx)(`div`,{className:`absolute inset-e-2 inset-y-0 top-2.5 text-danger-strong`,children:(0,o.jsx)(r.BanIcon,{size:14})}),(0,o.jsxs)(`div`,{className:`my-1 flex w-full items-start justify-between gap-x-2`,children:[F&&h?(0,o.jsx)(n.FieldError,{id:b,className:`flex-1`,errors:T.meta.errors}):(0,o.jsx)(`div`,{}),!!p&&(0,o.jsx)(`p`,{className:B,children:M})]}),(0,o.jsx)(n.FieldNote,{isShow:!!f,children:f})]})]}),(0,o.jsx)(n.FieldSeparator,{})]})});c.displayName=`TextareaField`,exports.TextareaField=c;
+//# sourceMappingURL=textarea-field-BhqX29CS.cjs.map

package/dist/{textarea-field-B38SnNv4.cjs.map → textarea-field-BhqX29CS.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"textarea-field-B38SnNv4.cjs","names":["useTanStackFieldContext","FieldGroup","Field","FieldContent","FieldLabel","FieldTooltip","FieldDescription","FieldContentMain","Textarea","CheckIcon","CopyIcon","Loader2Icon","BanIcon","FieldError","FieldNote","FieldSeparator"],"sources":["../packages/components/features/tanstack-form/components/fields/textarea-field.tsx"],"sourcesContent":["'use client';\n\nimport { memo, useCallback, useEffect, useId, useMemo, useRef, useState } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { BanIcon, CheckIcon, CopyIcon, Loader2Icon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Textarea } from '@/components/ui/textarea';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport {\n  Field,\n  FieldContent,\n  FieldContentMain,\n  FieldDescription,\n  FieldError,\n  FieldGroup,\n  FieldLabel,\n  FieldNote,\n  FieldSeparator,\n  FieldTooltip,\n} from '../ui/field';\n\nimport type { TextareaFieldProps as Props } from '../../types';\n\nexport const TextareaField = memo<Props>(\n  ({\n    label,\n    description,\n    placeholder,\n\n    tooltip,\n    helperText,\n    counter = false,\n    orientation = 'responsive',\n    showErrorMessage = true,\n\n    required = false,\n    disabled = false,\n    maxLength,\n  }) => {\n    const id = useId();\n    const errorId = useId();\n    const [copied, setCopied] = useState(false);\n    const copyTimeoutRef = useRef<number | null>(null);\n\n    const { form, state, name, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n    const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n    const isDisabled = disabled || isSubmitting;\n\n    const _count = state.value?.length ?? 0;\n\n    const _countText = useMemo(() => {\n      if (!counter) return '';\n      return maxLength ? `${_count} / ${maxLength} ký tự` : `${_count} ký tự`;\n    }, [_count, counter, maxLength]);\n\n    const _isNearLimit = !!maxLength && _count >= maxLength * 0.8;\n    const _isAtLimit = !!maxLength && _count >= maxLength;\n\n    const _touched = state.meta.isDirty || state.meta.isTouched;\n    const _invalid = _touched && !state.meta.isValid;\n    const _isEmpty = required && state.value === null;\n    const _hasErrors = !!state.meta.errors.length;\n    const _showCopy = !!state.value && !isDisabled;\n\n    const _counterClass = useMemo(\n      () =>\n        cn(\n          'h-4 flex-0 text-nowrap text-end text-xs tabular-nums transition-colors',\n          _isAtLimit ? 'font-medium text-danger-strong' : _isNearLimit ? 'text-warning-strong' : 'text-text-positive-weak'\n        ),\n      [_isAtLimit, _isNearLimit]\n    );\n\n    const onChange = useCallback<React.ChangeEventHandler<HTMLTextAreaElement>>(\n      ({ target: { value } }) => {\n        if (isDisabled) return;\n        if (counter && maxLength && value.length > maxLength) return;\n        handleChange(value || null);\n      },\n      [isDisabled, counter, maxLength, handleChange]\n    );\n\n    const onCopy = useCallback(async () => {\n      if (!state.value) return;\n      await navigator.clipboard.writeText(state.value);\n      if (copyTimeoutRef.current !== null) window.clearTimeout(copyTimeoutRef.current);\n      setCopied(true);\n      copyTimeoutRef.current = window.setTimeout(() => setCopied(false), 1500);\n    }, [state.value]);\n\n    useEffect(() => {\n      return () => {\n        if (copyTimeoutRef.current !== null) window.clearTimeout(copyTimeoutRef.current);\n      };\n    }, []);\n\n    return (\n      <FieldGroup className=\"gap-y-4 px-4\">\n        <Field orientation={orientation} data-invalid={_invalid}>\n          <FieldContent>\n            <FieldLabel aria-required={_isEmpty} htmlFor={id}>\n              {label}\n              {tooltip && <FieldTooltip tooltip={tooltip} />}\n            </FieldLabel>\n            <FieldDescription>{description}</FieldDescription>\n          </FieldContent>\n          <FieldContentMain>\n            <Textarea\n              id={id}\n              name={name}\n              value={state.value ?? ''}\n              aria-invalid={_invalid}\n              aria-describedby={errorId}\n              autoCapitalize=\"none\"\n              autoComplete=\"off\"\n              autoCorrect=\"off\"\n              placeholder={placeholder}\n              disabled={isDisabled}\n              className={cn(isDisabled && 'pointer-events-none bg-muted-muted opacity-60')}\n              onChange={onChange}\n              onBlur={handleBlur}\n            />\n            {_showCopy && (\n              <button\n                type=\"button\"\n                aria-label=\"Sao chép\"\n                className=\"absolute inset-e-1 top-2 flex size-4 cursor-pointer items-center justify-center rounded-md outline-none transition-[color,transform] focus-visible:[&>svg]:scale-125 [&>svg]:size-3.5 [&>svg]:transition-transform\"\n                onClick={onCopy}\n              >\n                {copied ? (\n                  <CheckIcon aria-hidden=\"true\" className=\"text-success-strong\" />\n                ) : (\n                  <CopyIcon\n                    aria-hidden=\"true\"\n                    className=\"text-text-positive-weak transition-colors hover:text-text-positive focus-visible:text-primary-strong\"\n                  />\n                )}\n              </button>\n            )}\n            {isSubmitting && (\n              <div className=\"absolute inset-e-2 inset-y-0 top-2.5 text-muted-weak\">\n                <Loader2Icon size={14} className=\"animate-spin text-primary-strong\" />\n              </div>\n            )}\n            {!_showCopy && _touched && showErrorMessage && _hasErrors && (\n              <div className=\"absolute inset-e-2 inset-y-0 top-2.5 text-danger-strong\">\n                <BanIcon size={14} />\n              </div>\n            )}\n            <div className=\"my-1 flex w-full items-start justify-between gap-x-2\">\n              {_touched && showErrorMessage ? <FieldError id={errorId} className=\"flex-1\" errors={state.meta.errors} /> : <div />}\n              {!!counter && <p className={_counterClass}>{_countText}</p>}\n            </div>\n            <FieldNote isShow={!!helperText}>{helperText}</FieldNote>\n          </FieldContentMain>\n        </Field>\n        <FieldSeparator />\n      </FieldGroup>\n    );\n  }\n);\n\nTextareaField.displayName = 'TextareaField';\n"],"mappings":"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"}
+{"version":3,"file":"textarea-field-BhqX29CS.cjs","names":["useTanStackFieldContext","FieldGroup","Field","FieldContent","FieldLabel","FieldTooltip","FieldDescription","FieldContentMain","Textarea","CheckIcon","CopyIcon","Loader2Icon","BanIcon","FieldError","FieldNote","FieldSeparator"],"sources":["../packages/components/features/tanstack-form/components/fields/textarea-field.tsx"],"sourcesContent":["'use client';\n\nimport { memo, useCallback, useEffect, useId, useMemo, useRef, useState } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { BanIcon, CheckIcon, CopyIcon, Loader2Icon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Textarea } from '@/components/ui/textarea';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport {\n  Field,\n  FieldContent,\n  FieldContentMain,\n  FieldDescription,\n  FieldError,\n  FieldGroup,\n  FieldLabel,\n  FieldNote,\n  FieldSeparator,\n  FieldTooltip,\n} from '../ui/field';\n\nimport type { TextareaFieldProps as Props } from '../../types';\n\nexport const TextareaField = memo<Props>(\n  ({\n    label,\n    description,\n    placeholder,\n\n    tooltip,\n    helperText,\n    counter = false,\n    orientation = 'responsive',\n    showErrorMessage = true,\n\n    required = false,\n    disabled = false,\n    maxLength,\n  }) => {\n    const id = useId();\n    const errorId = useId();\n    const [copied, setCopied] = useState(false);\n    const copyTimeoutRef = useRef<number | null>(null);\n\n    const { form, state, name, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n    const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n    const isDisabled = disabled || isSubmitting;\n\n    const _count = state.value?.length ?? 0;\n\n    const _countText = useMemo(() => {\n      if (!counter) return '';\n      return maxLength ? `${_count} / ${maxLength} ký tự` : `${_count} ký tự`;\n    }, [_count, counter, maxLength]);\n\n    const _isNearLimit = !!maxLength && _count >= maxLength * 0.8;\n    const _isAtLimit = !!maxLength && _count >= maxLength;\n\n    const _touched = state.meta.isDirty || state.meta.isTouched;\n    const _invalid = _touched && !state.meta.isValid;\n    const _isEmpty = required && state.value === null;\n    const _hasErrors = !!state.meta.errors.length;\n    const _showCopy = !!state.value && !isDisabled;\n\n    const _counterClass = useMemo(\n      () =>\n        cn(\n          'h-4 flex-0 text-nowrap text-end text-xs tabular-nums transition-colors',\n          _isAtLimit ? 'font-medium text-danger-strong' : _isNearLimit ? 'text-warning-strong' : 'text-text-positive-weak'\n        ),\n      [_isAtLimit, _isNearLimit]\n    );\n\n    const onChange = useCallback<React.ChangeEventHandler<HTMLTextAreaElement>>(\n      ({ target: { value } }) => {\n        if (isDisabled) return;\n        if (counter && maxLength && value.length > maxLength) return;\n        handleChange(value || null);\n      },\n      [isDisabled, counter, maxLength, handleChange]\n    );\n\n    const onCopy = useCallback(async () => {\n      if (!state.value) return;\n      await navigator.clipboard.writeText(state.value);\n      if (copyTimeoutRef.current !== null) window.clearTimeout(copyTimeoutRef.current);\n      setCopied(true);\n      copyTimeoutRef.current = window.setTimeout(() => setCopied(false), 1500);\n    }, [state.value]);\n\n    useEffect(() => {\n      return () => {\n        if (copyTimeoutRef.current !== null) window.clearTimeout(copyTimeoutRef.current);\n      };\n    }, []);\n\n    return (\n      <FieldGroup className=\"gap-y-4 px-4\">\n        <Field orientation={orientation} data-invalid={_invalid}>\n          <FieldContent>\n            <FieldLabel aria-required={_isEmpty} htmlFor={id}>\n              {label}\n              {tooltip && <FieldTooltip tooltip={tooltip} />}\n            </FieldLabel>\n            <FieldDescription>{description}</FieldDescription>\n          </FieldContent>\n          <FieldContentMain>\n            <Textarea\n              id={id}\n              name={name}\n              value={state.value ?? ''}\n              aria-invalid={_invalid}\n              aria-describedby={errorId}\n              autoCapitalize=\"none\"\n              autoComplete=\"off\"\n              autoCorrect=\"off\"\n              placeholder={placeholder}\n              disabled={isDisabled}\n              className={cn(isDisabled && 'pointer-events-none bg-muted-muted opacity-60')}\n              onChange={onChange}\n              onBlur={handleBlur}\n            />\n            {_showCopy && (\n              <button\n                type=\"button\"\n                aria-label=\"Sao chép\"\n                className=\"absolute inset-e-1 top-2 flex size-4 cursor-pointer items-center justify-center rounded-md outline-none transition-[color,transform] focus-visible:[&>svg]:scale-125 [&>svg]:size-3.5 [&>svg]:transition-transform\"\n                onClick={onCopy}\n              >\n                {copied ? (\n                  <CheckIcon aria-hidden=\"true\" className=\"text-success-strong\" />\n                ) : (\n                  <CopyIcon\n                    aria-hidden=\"true\"\n                    className=\"text-text-positive-weak transition-colors hover:text-text-positive focus-visible:text-primary-strong\"\n                  />\n                )}\n              </button>\n            )}\n            {isSubmitting && (\n              <div className=\"absolute inset-e-2 inset-y-0 top-2.5 text-muted-weak\">\n                <Loader2Icon size={14} className=\"animate-spin text-primary-strong\" />\n              </div>\n            )}\n            {!_showCopy && _touched && showErrorMessage && _hasErrors && (\n              <div className=\"absolute inset-e-2 inset-y-0 top-2.5 text-danger-strong\">\n                <BanIcon size={14} />\n              </div>\n            )}\n            <div className=\"my-1 flex w-full items-start justify-between gap-x-2\">\n              {_touched && showErrorMessage ? <FieldError id={errorId} className=\"flex-1\" errors={state.meta.errors} /> : <div />}\n              {!!counter && <p className={_counterClass}>{_countText}</p>}\n            </div>\n            <FieldNote isShow={!!helperText}>{helperText}</FieldNote>\n          </FieldContentMain>\n        </Field>\n        <FieldSeparator />\n      </FieldGroup>\n    );\n  }\n);\n\nTextareaField.displayName = 'TextareaField';\n"],"mappings":"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"}

package/dist/{textarea-field-u2UUwtr_.mjs → textarea-field-DNLyrRH7.mjs}

@@ -1,2 +1,2 @@
-import{G as e}from"./tanstack-form-q9hDCc0Y.mjs";import{Textarea as t}from"./ui/textarea.mjs";import{Field as n,FieldContent as r,FieldContentMain as i,FieldDescription as a,FieldError as o,FieldGroup as s,FieldLabel as c,FieldNote as l,FieldSeparator as u,FieldTooltip as d}from"./field-V2DoD8qL.mjs";import{BanIcon as f,CheckIcon as p,CopyIcon as ee,Loader2Icon as m}from"lucide-react";import{memo as h,useCallback as g,useEffect as _,useId as v,useMemo as y,useRef as b,useState as x}from"react";import{cn as S}from"@customafk/react-toolkit/utils";import{jsx as C,jsxs as w}from"react/jsx-runtime";import{useStore as T}from"@tanstack/react-form";const E=h(({label:h,description:E,placeholder:te,tooltip:D,helperText:O,counter:k=!1,orientation:A=`responsive`,showErrorMessage:j=!0,required:M=!1,disabled:N=!1,maxLength:P})=>{let F=v(),I=v(),[L,R]=x(!1),z=b(null),{form:B,state:V,name:H,handleBlur:U,handleChange:W}=e(),G=T(B.store,({isSubmitting:e})=>e),K=N||G,q=V.value?.length??0,J=y(()=>k?P?`${q} / ${P} ký tự`:`${q} ký tự`:``,[q,k,P]),Y=!!P&&q>=P*.8,X=!!P&&q>=P,Z=V.meta.isDirty||V.meta.isTouched,Q=Z&&!V.meta.isValid,ne=M&&V.value===null,re=!!V.meta.errors.length,$=!!V.value&&!K,ie=y(()=>S(`h-4 flex-0 text-nowrap text-end text-xs tabular-nums transition-colors`,X?`font-medium text-danger-strong`:Y?`text-warning-strong`:`text-text-positive-weak`),[X,Y]),ae=g(({target:{value:e}})=>{K||k&&P&&e.length>P||W(e||null)},[K,k,P,W]),oe=g(async()=>{V.value&&(await navigator.clipboard.writeText(V.value),z.current!==null&&window.clearTimeout(z.current),R(!0),z.current=window.setTimeout(()=>R(!1),1500))},[V.value]);return _(()=>()=>{z.current!==null&&window.clearTimeout(z.current)},[]),w(s,{className:`gap-y-4 px-4`,children:[w(n,{orientation:A,"data-invalid":Q,children:[w(r,{children:[w(c,{"aria-required":ne,htmlFor:F,children:[h,D&&C(d,{tooltip:D})]}),C(a,{children:E})]}),w(i,{children:[C(t,{id:F,name:H,value:V.value??``,"aria-invalid":Q,"aria-describedby":I,autoCapitalize:`none`,autoComplete:`off`,autoCorrect:`off`,placeholder:te,disabled:K,className:S(K&&`pointer-events-none bg-muted-muted opacity-60`),onChange:ae,onBlur:U}),$&&C(`button`,{type:`button`,"aria-label":`Sao chép`,className:`absolute inset-e-1 top-2 flex size-4 cursor-pointer items-center justify-center rounded-md outline-none transition-[color,transform] focus-visible:[&>svg]:scale-125 [&>svg]:size-3.5 [&>svg]:transition-transform`,onClick:oe,children:L?C(p,{"aria-hidden":`true`,className:`text-success-strong`}):C(ee,{"aria-hidden":`true`,className:`text-text-positive-weak transition-colors hover:text-text-positive focus-visible:text-primary-strong`})}),G&&C(`div`,{className:`absolute inset-e-2 inset-y-0 top-2.5 text-muted-weak`,children:C(m,{size:14,className:`animate-spin text-primary-strong`})}),!$&&Z&&j&&re&&C(`div`,{className:`absolute inset-e-2 inset-y-0 top-2.5 text-danger-strong`,children:C(f,{size:14})}),w(`div`,{className:`my-1 flex w-full items-start justify-between gap-x-2`,children:[Z&&j?C(o,{id:I,className:`flex-1`,errors:V.meta.errors}):C(`div`,{}),!!k&&C(`p`,{className:ie,children:J})]}),C(l,{isShow:!!O,children:O})]})]}),C(u,{})]})});E.displayName=`TextareaField`;export{E as TextareaField};
-//# sourceMappingURL=textarea-field-u2UUwtr_.mjs.map
+import{G as e}from"./tanstack-form-fkaBh9RO.mjs";import{Textarea as t}from"./ui/textarea.mjs";import{Field as n,FieldContent as r,FieldContentMain as i,FieldDescription as a,FieldError as o,FieldGroup as s,FieldLabel as c,FieldNote as l,FieldSeparator as u,FieldTooltip as d}from"./field-V2DoD8qL.mjs";import{BanIcon as f,CheckIcon as p,CopyIcon as ee,Loader2Icon as m}from"lucide-react";import{memo as h,useCallback as g,useEffect as _,useId as v,useMemo as y,useRef as b,useState as x}from"react";import{cn as S}from"@customafk/react-toolkit/utils";import{jsx as C,jsxs as w}from"react/jsx-runtime";import{useStore as T}from"@tanstack/react-form";const E=h(({label:h,description:E,placeholder:te,tooltip:D,helperText:O,counter:k=!1,orientation:A=`responsive`,showErrorMessage:j=!0,required:M=!1,disabled:N=!1,maxLength:P})=>{let F=v(),I=v(),[L,R]=x(!1),z=b(null),{form:B,state:V,name:H,handleBlur:U,handleChange:W}=e(),G=T(B.store,({isSubmitting:e})=>e),K=N||G,q=V.value?.length??0,J=y(()=>k?P?`${q} / ${P} ký tự`:`${q} ký tự`:``,[q,k,P]),Y=!!P&&q>=P*.8,X=!!P&&q>=P,Z=V.meta.isDirty||V.meta.isTouched,Q=Z&&!V.meta.isValid,ne=M&&V.value===null,re=!!V.meta.errors.length,$=!!V.value&&!K,ie=y(()=>S(`h-4 flex-0 text-nowrap text-end text-xs tabular-nums transition-colors`,X?`font-medium text-danger-strong`:Y?`text-warning-strong`:`text-text-positive-weak`),[X,Y]),ae=g(({target:{value:e}})=>{K||k&&P&&e.length>P||W(e||null)},[K,k,P,W]),oe=g(async()=>{V.value&&(await navigator.clipboard.writeText(V.value),z.current!==null&&window.clearTimeout(z.current),R(!0),z.current=window.setTimeout(()=>R(!1),1500))},[V.value]);return _(()=>()=>{z.current!==null&&window.clearTimeout(z.current)},[]),w(s,{className:`gap-y-4 px-4`,children:[w(n,{orientation:A,"data-invalid":Q,children:[w(r,{children:[w(c,{"aria-required":ne,htmlFor:F,children:[h,D&&C(d,{tooltip:D})]}),C(a,{children:E})]}),w(i,{children:[C(t,{id:F,name:H,value:V.value??``,"aria-invalid":Q,"aria-describedby":I,autoCapitalize:`none`,autoComplete:`off`,autoCorrect:`off`,placeholder:te,disabled:K,className:S(K&&`pointer-events-none bg-muted-muted opacity-60`),onChange:ae,onBlur:U}),$&&C(`button`,{type:`button`,"aria-label":`Sao chép`,className:`absolute inset-e-1 top-2 flex size-4 cursor-pointer items-center justify-center rounded-md outline-none transition-[color,transform] focus-visible:[&>svg]:scale-125 [&>svg]:size-3.5 [&>svg]:transition-transform`,onClick:oe,children:L?C(p,{"aria-hidden":`true`,className:`text-success-strong`}):C(ee,{"aria-hidden":`true`,className:`text-text-positive-weak transition-colors hover:text-text-positive focus-visible:text-primary-strong`})}),G&&C(`div`,{className:`absolute inset-e-2 inset-y-0 top-2.5 text-muted-weak`,children:C(m,{size:14,className:`animate-spin text-primary-strong`})}),!$&&Z&&j&&re&&C(`div`,{className:`absolute inset-e-2 inset-y-0 top-2.5 text-danger-strong`,children:C(f,{size:14})}),w(`div`,{className:`my-1 flex w-full items-start justify-between gap-x-2`,children:[Z&&j?C(o,{id:I,className:`flex-1`,errors:V.meta.errors}):C(`div`,{}),!!k&&C(`p`,{className:ie,children:J})]}),C(l,{isShow:!!O,children:O})]})]}),C(u,{})]})});E.displayName=`TextareaField`;export{E as TextareaField};
+//# sourceMappingURL=textarea-field-DNLyrRH7.mjs.map

package/dist/{textarea-field-u2UUwtr_.mjs.map → textarea-field-DNLyrRH7.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"textarea-field-u2UUwtr_.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/fields/textarea-field.tsx"],"sourcesContent":["'use client';\n\nimport { memo, useCallback, useEffect, useId, useMemo, useRef, useState } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { BanIcon, CheckIcon, CopyIcon, Loader2Icon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Textarea } from '@/components/ui/textarea';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport {\n  Field,\n  FieldContent,\n  FieldContentMain,\n  FieldDescription,\n  FieldError,\n  FieldGroup,\n  FieldLabel,\n  FieldNote,\n  FieldSeparator,\n  FieldTooltip,\n} from '../ui/field';\n\nimport type { TextareaFieldProps as Props } from '../../types';\n\nexport const TextareaField = memo<Props>(\n  ({\n    label,\n    description,\n    placeholder,\n\n    tooltip,\n    helperText,\n    counter = false,\n    orientation = 'responsive',\n    showErrorMessage = true,\n\n    required = false,\n    disabled = false,\n    maxLength,\n  }) => {\n    const id = useId();\n    const errorId = useId();\n    const [copied, setCopied] = useState(false);\n    const copyTimeoutRef = useRef<number | null>(null);\n\n    const { form, state, name, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n    const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n    const isDisabled = disabled || isSubmitting;\n\n    const _count = state.value?.length ?? 0;\n\n    const _countText = useMemo(() => {\n      if (!counter) return '';\n      return maxLength ? `${_count} / ${maxLength} ký tự` : `${_count} ký tự`;\n    }, [_count, counter, maxLength]);\n\n    const _isNearLimit = !!maxLength && _count >= maxLength * 0.8;\n    const _isAtLimit = !!maxLength && _count >= maxLength;\n\n    const _touched = state.meta.isDirty || state.meta.isTouched;\n    const _invalid = _touched && !state.meta.isValid;\n    const _isEmpty = required && state.value === null;\n    const _hasErrors = !!state.meta.errors.length;\n    const _showCopy = !!state.value && !isDisabled;\n\n    const _counterClass = useMemo(\n      () =>\n        cn(\n          'h-4 flex-0 text-nowrap text-end text-xs tabular-nums transition-colors',\n          _isAtLimit ? 'font-medium text-danger-strong' : _isNearLimit ? 'text-warning-strong' : 'text-text-positive-weak'\n        ),\n      [_isAtLimit, _isNearLimit]\n    );\n\n    const onChange = useCallback<React.ChangeEventHandler<HTMLTextAreaElement>>(\n      ({ target: { value } }) => {\n        if (isDisabled) return;\n        if (counter && maxLength && value.length > maxLength) return;\n        handleChange(value || null);\n      },\n      [isDisabled, counter, maxLength, handleChange]\n    );\n\n    const onCopy = useCallback(async () => {\n      if (!state.value) return;\n      await navigator.clipboard.writeText(state.value);\n      if (copyTimeoutRef.current !== null) window.clearTimeout(copyTimeoutRef.current);\n      setCopied(true);\n      copyTimeoutRef.current = window.setTimeout(() => setCopied(false), 1500);\n    }, [state.value]);\n\n    useEffect(() => {\n      return () => {\n        if (copyTimeoutRef.current !== null) window.clearTimeout(copyTimeoutRef.current);\n      };\n    }, []);\n\n    return (\n      <FieldGroup className=\"gap-y-4 px-4\">\n        <Field orientation={orientation} data-invalid={_invalid}>\n          <FieldContent>\n            <FieldLabel aria-required={_isEmpty} htmlFor={id}>\n              {label}\n              {tooltip && <FieldTooltip tooltip={tooltip} />}\n            </FieldLabel>\n            <FieldDescription>{description}</FieldDescription>\n          </FieldContent>\n          <FieldContentMain>\n            <Textarea\n              id={id}\n              name={name}\n              value={state.value ?? ''}\n              aria-invalid={_invalid}\n              aria-describedby={errorId}\n              autoCapitalize=\"none\"\n              autoComplete=\"off\"\n              autoCorrect=\"off\"\n              placeholder={placeholder}\n              disabled={isDisabled}\n              className={cn(isDisabled && 'pointer-events-none bg-muted-muted opacity-60')}\n              onChange={onChange}\n              onBlur={handleBlur}\n            />\n            {_showCopy && (\n              <button\n                type=\"button\"\n                aria-label=\"Sao chép\"\n                className=\"absolute inset-e-1 top-2 flex size-4 cursor-pointer items-center justify-center rounded-md outline-none transition-[color,transform] focus-visible:[&>svg]:scale-125 [&>svg]:size-3.5 [&>svg]:transition-transform\"\n                onClick={onCopy}\n              >\n                {copied ? (\n                  <CheckIcon aria-hidden=\"true\" className=\"text-success-strong\" />\n                ) : (\n                  <CopyIcon\n                    aria-hidden=\"true\"\n                    className=\"text-text-positive-weak transition-colors hover:text-text-positive focus-visible:text-primary-strong\"\n                  />\n                )}\n              </button>\n            )}\n            {isSubmitting && (\n              <div className=\"absolute inset-e-2 inset-y-0 top-2.5 text-muted-weak\">\n                <Loader2Icon size={14} className=\"animate-spin text-primary-strong\" />\n              </div>\n            )}\n            {!_showCopy && _touched && showErrorMessage && _hasErrors && (\n              <div className=\"absolute inset-e-2 inset-y-0 top-2.5 text-danger-strong\">\n                <BanIcon size={14} />\n              </div>\n            )}\n            <div className=\"my-1 flex w-full items-start justify-between gap-x-2\">\n              {_touched && showErrorMessage ? <FieldError id={errorId} className=\"flex-1\" errors={state.meta.errors} /> : <div />}\n              {!!counter && <p className={_counterClass}>{_countText}</p>}\n            </div>\n            <FieldNote isShow={!!helperText}>{helperText}</FieldNote>\n          </FieldContentMain>\n        </Field>\n        <FieldSeparator />\n      </FieldGroup>\n    );\n  }\n);\n\nTextareaField.displayName = 'TextareaField';\n"],"mappings":"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"}
+{"version":3,"file":"textarea-field-DNLyrRH7.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/fields/textarea-field.tsx"],"sourcesContent":["'use client';\n\nimport { memo, useCallback, useEffect, useId, useMemo, useRef, useState } from 'react';\n\nimport { useStore } from '@tanstack/react-form';\n\nimport { BanIcon, CheckIcon, CopyIcon, Loader2Icon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Textarea } from '@/components/ui/textarea';\n\nimport { useTanStackFieldContext } from '../form-context';\nimport {\n  Field,\n  FieldContent,\n  FieldContentMain,\n  FieldDescription,\n  FieldError,\n  FieldGroup,\n  FieldLabel,\n  FieldNote,\n  FieldSeparator,\n  FieldTooltip,\n} from '../ui/field';\n\nimport type { TextareaFieldProps as Props } from '../../types';\n\nexport const TextareaField = memo<Props>(\n  ({\n    label,\n    description,\n    placeholder,\n\n    tooltip,\n    helperText,\n    counter = false,\n    orientation = 'responsive',\n    showErrorMessage = true,\n\n    required = false,\n    disabled = false,\n    maxLength,\n  }) => {\n    const id = useId();\n    const errorId = useId();\n    const [copied, setCopied] = useState(false);\n    const copyTimeoutRef = useRef<number | null>(null);\n\n    const { form, state, name, handleBlur, handleChange } = useTanStackFieldContext<string | null>();\n\n    const isSubmitting = useStore(form.store, ({ isSubmitting }) => isSubmitting);\n    const isDisabled = disabled || isSubmitting;\n\n    const _count = state.value?.length ?? 0;\n\n    const _countText = useMemo(() => {\n      if (!counter) return '';\n      return maxLength ? `${_count} / ${maxLength} ký tự` : `${_count} ký tự`;\n    }, [_count, counter, maxLength]);\n\n    const _isNearLimit = !!maxLength && _count >= maxLength * 0.8;\n    const _isAtLimit = !!maxLength && _count >= maxLength;\n\n    const _touched = state.meta.isDirty || state.meta.isTouched;\n    const _invalid = _touched && !state.meta.isValid;\n    const _isEmpty = required && state.value === null;\n    const _hasErrors = !!state.meta.errors.length;\n    const _showCopy = !!state.value && !isDisabled;\n\n    const _counterClass = useMemo(\n      () =>\n        cn(\n          'h-4 flex-0 text-nowrap text-end text-xs tabular-nums transition-colors',\n          _isAtLimit ? 'font-medium text-danger-strong' : _isNearLimit ? 'text-warning-strong' : 'text-text-positive-weak'\n        ),\n      [_isAtLimit, _isNearLimit]\n    );\n\n    const onChange = useCallback<React.ChangeEventHandler<HTMLTextAreaElement>>(\n      ({ target: { value } }) => {\n        if (isDisabled) return;\n        if (counter && maxLength && value.length > maxLength) return;\n        handleChange(value || null);\n      },\n      [isDisabled, counter, maxLength, handleChange]\n    );\n\n    const onCopy = useCallback(async () => {\n      if (!state.value) return;\n      await navigator.clipboard.writeText(state.value);\n      if (copyTimeoutRef.current !== null) window.clearTimeout(copyTimeoutRef.current);\n      setCopied(true);\n      copyTimeoutRef.current = window.setTimeout(() => setCopied(false), 1500);\n    }, [state.value]);\n\n    useEffect(() => {\n      return () => {\n        if (copyTimeoutRef.current !== null) window.clearTimeout(copyTimeoutRef.current);\n      };\n    }, []);\n\n    return (\n      <FieldGroup className=\"gap-y-4 px-4\">\n        <Field orientation={orientation} data-invalid={_invalid}>\n          <FieldContent>\n            <FieldLabel aria-required={_isEmpty} htmlFor={id}>\n              {label}\n              {tooltip && <FieldTooltip tooltip={tooltip} />}\n            </FieldLabel>\n            <FieldDescription>{description}</FieldDescription>\n          </FieldContent>\n          <FieldContentMain>\n            <Textarea\n              id={id}\n              name={name}\n              value={state.value ?? ''}\n              aria-invalid={_invalid}\n              aria-describedby={errorId}\n              autoCapitalize=\"none\"\n              autoComplete=\"off\"\n              autoCorrect=\"off\"\n              placeholder={placeholder}\n              disabled={isDisabled}\n              className={cn(isDisabled && 'pointer-events-none bg-muted-muted opacity-60')}\n              onChange={onChange}\n              onBlur={handleBlur}\n            />\n            {_showCopy && (\n              <button\n                type=\"button\"\n                aria-label=\"Sao chép\"\n                className=\"absolute inset-e-1 top-2 flex size-4 cursor-pointer items-center justify-center rounded-md outline-none transition-[color,transform] focus-visible:[&>svg]:scale-125 [&>svg]:size-3.5 [&>svg]:transition-transform\"\n                onClick={onCopy}\n              >\n                {copied ? (\n                  <CheckIcon aria-hidden=\"true\" className=\"text-success-strong\" />\n                ) : (\n                  <CopyIcon\n                    aria-hidden=\"true\"\n                    className=\"text-text-positive-weak transition-colors hover:text-text-positive focus-visible:text-primary-strong\"\n                  />\n                )}\n              </button>\n            )}\n            {isSubmitting && (\n              <div className=\"absolute inset-e-2 inset-y-0 top-2.5 text-muted-weak\">\n                <Loader2Icon size={14} className=\"animate-spin text-primary-strong\" />\n              </div>\n            )}\n            {!_showCopy && _touched && showErrorMessage && _hasErrors && (\n              <div className=\"absolute inset-e-2 inset-y-0 top-2.5 text-danger-strong\">\n                <BanIcon size={14} />\n              </div>\n            )}\n            <div className=\"my-1 flex w-full items-start justify-between gap-x-2\">\n              {_touched && showErrorMessage ? <FieldError id={errorId} className=\"flex-1\" errors={state.meta.errors} /> : <div />}\n              {!!counter && <p className={_counterClass}>{_countText}</p>}\n            </div>\n            <FieldNote isShow={!!helperText}>{helperText}</FieldNote>\n          </FieldContentMain>\n        </Field>\n        <FieldSeparator />\n      </FieldGroup>\n    );\n  }\n);\n\nTextareaField.displayName = 'TextareaField';\n"],"mappings":"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"}

package/dist/{tooltip-BVzKgxrZ.cjs → tooltip-CUyGXE9e.cjs}

@@ -1,4 +1,4 @@
-const e=require("./tables-BqZ4Zs6e.cjs"),t=require("./ui/input.cjs");let n=require("lucide-react"),r=require("react"),i=require("@customafk/react-toolkit/utils"),a=require("react/jsx-runtime"),o=require("@customafk/react-toolkit/hooks/useDebounceCallback");function s(e){if(e==null)return``;if(typeof e==`number`)return String(e);if(typeof e==`boolean`)return e?`true`:`false`;let t=String(e);return t.includes(`,`)||t.includes(`"`)||t.includes(`
+const e=require("./ui/input.cjs"),t=require("./tables-DdLEj1dI.cjs");let n=require("lucide-react"),r=require("react"),i=require("@customafk/react-toolkit/utils"),a=require("react/jsx-runtime"),o=require("@customafk/react-toolkit/hooks/useDebounceCallback");function s(e){if(e==null)return``;if(typeof e==`number`)return String(e);if(typeof e==`boolean`)return e?`true`:`false`;let t=String(e);return t.includes(`,`)||t.includes(`"`)||t.includes(`
 `)||t.includes(`\r`)?`"${t.replace(/"/g,`""`)}"`:t}function c(e){if(e.length===0)return``;let t=e[0].map(e=>s(e.label)),n=e.map(e=>e.map(e=>s(e.value)).join(`,`));return[t.join(`,`),...n].join(`
-`)}function l(e,t){let n=c(e);if(!n)return;let r=new Blob([n],{type:`text/csv;charset=utf-8;`}),i=URL.createObjectURL(r),a=document.createElement(`a`);a.href=i,a.download=`${t}.csv`,a.click(),URL.revokeObjectURL(i)}const u=({onSearch:e,onChange:r,...i})=>{let s=(0,o.useDebounceCallback)(t=>{e?.(t)},500);return(0,a.jsxs)(`div`,{className:`relative w-full max-w-80 flex-1`,children:[(0,a.jsx)(t.Input,{...i,size:`lg`,type:`search`,placeholder:`Tìm kiếm...`,className:`flex-1 ps-9 pe-9`,onChange:e=>{r?.(e),s(e.target.value??``)}}),(0,a.jsx)(`div`,{className:`pointer-events-none absolute inset-y-0 inset-s-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50`,children:(0,a.jsx)(n.SearchIcon,{size:16})}),(0,a.jsx)(`button`,{className:`absolute inset-y-0 inset-e-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50`,"aria-label":`Submit search`,type:`submit`,children:(0,a.jsx)(n.ArrowRightIcon,{size:16,"aria-hidden":`true`})})]})},d=({children:e,disabled:t,onClick:n,className:r,...o})=>(0,a.jsx)(`button`,{type:`button`,disabled:t,className:(0,i.cn)(`flex cursor-pointer items-center gap-x-1 rounded-sm border border-border bg-background p-2.5 text-sm text-text-positive-weak outline-none transition-all hover:shadow-card focus:border-border-emphasis focus:bg-muted-muted active:border-border-emphasis active:bg-muted-muted active:text-text-positive disabled:pointer-events-none disabled:cursor-default disabled:opacity-60 [&_svg]:size-3.5`,r),onClick:n,...o,children:e}),f=({onCreate:t,onCreateMultiple:i,onDownload:o,onRefresh:s})=>{let{table:c,csvData:u,csvFileName:f,title:p,showAnalysisPanel:m,summary:h}=e.Y(),{isOpen:g,toggle:_}=e.q(),{isOpen:v,toggle:y}=e.Z(),b=(0,r.useCallback)(()=>{if(o){o();return}if(!u||u.length===0)return;let e=c.getSelectedRowModel().flatRows;l(e.length>0?e.map(e=>u[e.index]).filter(Boolean):u,f||p)},[o,u,f,c,p]),x=!!(o||u&&u.length>0);return(0,a.jsxs)(`div`,{className:`flex [&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none`,children:[(0,a.jsx)(d,{disabled:!t,"aria-label":`Tạo mới`,onClick:e=>{t?.(),e.stopPropagation(),e.preventDefault()},children:(0,a.jsx)(n.CirclePlus,{})}),(0,a.jsx)(d,{disabled:!i,"aria-label":`Tạo nhiều`,onClick:e=>{i?.(),e.stopPropagation(),e.preventDefault()},children:(0,a.jsx)(n.CopyPlusIcon,{})}),(0,a.jsx)(d,{disabled:!s,"aria-label":`Làm mới`,onClick:e=>{s?.(),e.stopPropagation(),e.preventDefault()},children:(0,a.jsx)(n.RefreshCwIcon,{})}),(0,a.jsx)(d,{disabled:!x,"aria-label":`Tải xuống`,onClick:e=>{b(),e.stopPropagation(),e.preventDefault()},children:(0,a.jsx)(n.DownloadIcon,{})}),h&&h.length>0&&(0,a.jsx)(d,{onClick:e=>{y(),e.stopPropagation(),e.preventDefault()},"aria-pressed":v,"aria-label":v?`Ẩn tổng quan`:`Hiện tổng quan`,className:v?`bg-muted-muted text-text-positive`:void 0,children:(0,a.jsx)(n.LayoutDashboardIcon,{})}),m&&(0,a.jsx)(d,{onClick:e=>{_(),e.stopPropagation(),e.preventDefault()},"aria-pressed":g,className:g?`bg-muted-muted text-text-positive`:void 0,children:(0,a.jsx)(n.BarChart2Icon,{})})]})},p=({children:t})=>{let{title:n,description:r,headerActions:i}=e.Y();return(0,a.jsxs)(`div`,{"data-slot":`table-tooltip`,className:`relative grid w-full grid-cols-1 gap-2 px-2 py-0 text-sm`,children:[(0,a.jsxs)(`div`,{className:`grid w-full grid-cols-[1fr_auto] items-start gap-4`,children:[(0,a.jsxs)(`div`,{className:`grid grid-cols-1 gap-0.5`,children:[(0,a.jsx)(`h3`,{className:`font-semibold text-base text-text-positive`,children:n}),!!r&&(0,a.jsx)(`p`,{className:`text-muted-foreground text-sm`,children:r})]}),!!i&&(0,a.jsx)(`div`,{className:`flex shrink-0 items-center gap-2`,children:i})]}),(0,a.jsx)(`div`,{className:`grid w-full grid-cols-[1fr_auto] gap-x-2`,children:t})]})};p.displayName=`UITableTooltip`,exports.UITableTooltip=p,exports.UITableTooltipActions=f,exports.UITableTooltipFilter=u;
-//# sourceMappingURL=tooltip-BVzKgxrZ.cjs.map
+`)}function l(e,t){let n=c(e);if(!n)return;let r=new Blob([n],{type:`text/csv;charset=utf-8;`}),i=URL.createObjectURL(r),a=document.createElement(`a`);a.href=i,a.download=`${t}.csv`,a.click(),URL.revokeObjectURL(i)}const u=({onSearch:t,onChange:r,...i})=>{let s=(0,o.useDebounceCallback)(e=>{t?.(e)},500);return(0,a.jsxs)(`div`,{className:`relative w-full max-w-80 flex-1`,children:[(0,a.jsx)(e.Input,{...i,size:`lg`,type:`search`,placeholder:`Tìm kiếm...`,className:`flex-1 ps-9 pe-9`,onChange:e=>{r?.(e),s(e.target.value??``)}}),(0,a.jsx)(`div`,{className:`pointer-events-none absolute inset-y-0 inset-s-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50`,children:(0,a.jsx)(n.SearchIcon,{size:16})}),(0,a.jsx)(`button`,{className:`absolute inset-y-0 inset-e-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50`,"aria-label":`Submit search`,type:`submit`,children:(0,a.jsx)(n.ArrowRightIcon,{size:16,"aria-hidden":`true`})})]})},d=({children:e,disabled:t,onClick:n,className:r,...o})=>(0,a.jsx)(`button`,{type:`button`,disabled:t,className:(0,i.cn)(`flex cursor-pointer items-center gap-x-1 rounded-sm border border-border bg-background p-2.5 text-sm text-text-positive-weak outline-none transition-all hover:shadow-card focus:border-border-emphasis focus:bg-muted-muted active:border-border-emphasis active:bg-muted-muted active:text-text-positive disabled:pointer-events-none disabled:cursor-default disabled:opacity-60 [&_svg]:size-3.5`,r),onClick:n,...o,children:e}),f=({onCreate:e,onCreateMultiple:i,onDownload:o,onRefresh:s})=>{let{table:c,csvData:u,csvFileName:f,title:p,showAnalysisPanel:m,summary:h}=t.Y(),{isOpen:g,toggle:_}=t.q(),{isOpen:v,toggle:y}=t.Z(),b=(0,r.useCallback)(()=>{if(o){o();return}if(!u||u.length===0)return;let e=c.getSelectedRowModel().flatRows;l(e.length>0?e.map(e=>u[e.index]).filter(Boolean):u,f||p)},[o,u,f,c,p]),x=!!(o||u&&u.length>0);return(0,a.jsxs)(`div`,{className:`flex [&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none`,children:[(0,a.jsx)(d,{disabled:!e,"aria-label":`Tạo mới`,onClick:t=>{e?.(),t.stopPropagation(),t.preventDefault()},children:(0,a.jsx)(n.CirclePlus,{})}),(0,a.jsx)(d,{disabled:!i,"aria-label":`Tạo nhiều`,onClick:e=>{i?.(),e.stopPropagation(),e.preventDefault()},children:(0,a.jsx)(n.CopyPlusIcon,{})}),(0,a.jsx)(d,{disabled:!s,"aria-label":`Làm mới`,onClick:e=>{s?.(),e.stopPropagation(),e.preventDefault()},children:(0,a.jsx)(n.RefreshCwIcon,{})}),(0,a.jsx)(d,{disabled:!x,"aria-label":`Tải xuống`,onClick:e=>{b(),e.stopPropagation(),e.preventDefault()},children:(0,a.jsx)(n.DownloadIcon,{})}),h&&h.length>0&&(0,a.jsx)(d,{onClick:e=>{y(),e.stopPropagation(),e.preventDefault()},"aria-pressed":v,"aria-label":v?`Ẩn tổng quan`:`Hiện tổng quan`,className:v?`bg-muted-muted text-text-positive`:void 0,children:(0,a.jsx)(n.LayoutDashboardIcon,{})}),m&&(0,a.jsx)(d,{onClick:e=>{_(),e.stopPropagation(),e.preventDefault()},"aria-pressed":g,className:g?`bg-muted-muted text-text-positive`:void 0,children:(0,a.jsx)(n.BarChart2Icon,{})})]})},p=({children:e})=>{let{title:n,description:r,headerActions:i}=t.Y();return(0,a.jsxs)(`div`,{"data-slot":`table-tooltip`,className:`relative grid w-full grid-cols-1 gap-2 px-2 py-0 text-sm`,children:[(0,a.jsxs)(`div`,{className:`grid w-full grid-cols-[1fr_auto] items-start gap-4`,children:[(0,a.jsxs)(`div`,{className:`grid grid-cols-1 gap-0.5`,children:[(0,a.jsx)(`h3`,{className:`font-semibold text-base text-text-positive`,children:n}),!!r&&(0,a.jsx)(`p`,{className:`text-muted-foreground text-sm`,children:r})]}),!!i&&(0,a.jsx)(`div`,{className:`flex shrink-0 items-center gap-2`,children:i})]}),(0,a.jsx)(`div`,{className:`grid w-full grid-cols-[1fr_auto] gap-x-2`,children:e})]})};p.displayName=`UITableTooltip`,exports.UITableTooltip=p,exports.UITableTooltipActions=f,exports.UITableTooltipFilter=u;
+//# sourceMappingURL=tooltip-CUyGXE9e.cjs.map

package/dist/{tooltip-BVzKgxrZ.cjs.map → tooltip-CUyGXE9e.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"tooltip-BVzKgxrZ.cjs","names":["Input","SearchIcon","ArrowRightIcon","useUITableContext","useUITableAnalysisContext","useUITableSummaryContext","CirclePlus","CopyPlusIcon","RefreshCwIcon","DownloadIcon","LayoutDashboardIcon","BarChart2Icon"],"sources":["../packages/components/features/tables/utils/csv.ts","../packages/components/features/tables/components/table/tooltip.tsx"],"sourcesContent":["'use client';\n\nimport type { CsvCell } from '../types';\n\nfunction formatCell(value: CsvCell['value']): string {\n  if (value === null || value === undefined) return '';\n  if (typeof value === 'number') return String(value);\n  if (typeof value === 'boolean') return value ? 'true' : 'false';\n  const str = String(value);\n  if (str.includes(',') || str.includes('\"') || str.includes('\\n') || str.includes('\\r')) {\n    return `\"${str.replace(/\"/g, '\"\"')}\"`;\n  }\n  return str;\n}\n\nexport function buildCsvContent(rows: CsvCell[][]): string {\n  if (rows.length === 0) return '';\n  const headers = rows[0].map(cell => formatCell(cell.label));\n  const dataRows = rows.map(row => row.map(cell => formatCell(cell.value)).join(','));\n  return [headers.join(','), ...dataRows].join('\\n');\n}\n\nexport function downloadCsv(rows: CsvCell[][], fileName: string): void {\n  const content = buildCsvContent(rows);\n  if (!content) return;\n  const blob = new Blob([content], { type: 'text/csv;charset=utf-8;' });\n  const url = URL.createObjectURL(blob);\n  const link = document.createElement('a');\n  link.href = url;\n  link.download = `${fileName}.csv`;\n  link.click();\n  URL.revokeObjectURL(url);\n}\n","/**\n * @file tooltip.tsx\n * Toolbar components rendered above the table: a debounced search input,\n * an action button group (create / refresh / download), and the outer\n * toolbar shell that displays the table title.\n */\nimport { useCallback } from 'react';\n\nimport { ArrowRightIcon, BarChart2Icon, CirclePlus, CopyPlusIcon, DownloadIcon, LayoutDashboardIcon, RefreshCwIcon, SearchIcon } from 'lucide-react';\n\nimport { useDebounceCallback } from '@customafk/react-toolkit/hooks/useDebounceCallback';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Input } from '@/components/ui/input';\n\nimport { useUITableAnalysisContext, useUITableContext, useUITableSummaryContext } from '../../hooks/use-context';\nimport { downloadCsv } from '../../utils/csv';\n\n/**\n * Debounced search input rendered inside the table toolbar.\n *\n * Fires `onSearch` 500 ms after the user stops typing and delegates all other\n * native input events via the spread `props`.\n *\n * @example\n * ```tsx\n * import { UITableTooltipFilter } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableTooltipFilter\n *   placeholder=\"Search users…\"\n *   onSearch={value => setQuery(value)}\n * />\n * ```\n */\nexport const UITableTooltipFilter: React.FC<\n  Omit<React.ComponentProps<typeof Input>, 'className'> & {\n    onSearch?: (value: string) => void;\n  }\n> = ({ onSearch, onChange, ...props }) => {\n  const debouncedSearch = useDebounceCallback((value: string) => {\n    onSearch?.(value);\n  }, 500);\n  return (\n    <div className=\"relative w-full max-w-80 flex-1\">\n      <Input\n        {...props}\n        size=\"lg\"\n        type=\"search\"\n        placeholder=\"Tìm kiếm...\"\n        className=\"flex-1 ps-9 pe-9\"\n        onChange={e => {\n          onChange?.(e);\n          debouncedSearch(e.target.value ?? '');\n        }}\n      />\n      <div className=\"pointer-events-none absolute inset-y-0 inset-s-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50\">\n        <SearchIcon size={16} />\n      </div>\n      <button\n        className=\"absolute inset-y-0 inset-e-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50\"\n        aria-label=\"Submit search\"\n        type=\"submit\"\n      >\n        <ArrowRightIcon size={16} aria-hidden=\"true\" />\n      </button>\n    </div>\n  );\n};\n\nconst ActionButton: React.FC<React.PropsWithChildren<React.ComponentProps<'button'>>> = ({ children, disabled, onClick, className, ...props }) => {\n  return (\n    <button\n      type=\"button\"\n      disabled={disabled}\n      className={cn(\n        'flex cursor-pointer items-center gap-x-1 rounded-sm border border-border bg-background p-2.5 text-sm text-text-positive-weak outline-none transition-all hover:shadow-card focus:border-border-emphasis focus:bg-muted-muted active:border-border-emphasis active:bg-muted-muted active:text-text-positive disabled:pointer-events-none disabled:cursor-default disabled:opacity-60 [&_svg]:size-3.5',\n        className\n      )}\n      onClick={onClick}\n      {...props}\n    >\n      {children}\n    </button>\n  );\n};\n\n/**\n * Grouped action buttons (create, refresh, download) displayed in the table\n * toolbar.\n *\n * Each button is disabled automatically when the corresponding handler prop is\n * omitted, so only the actions relevant to a given table need to be provided.\n * A toggle for `UITableSummaryBar` appears automatically when `summary` is\n * non-empty, and a toggle for `UITableAnalysisPanel` appears when\n * `showAnalysisPanel` is `true` (both set on `UITableProvider`).\n * `onCreateMultiple` renders a separate \"bulk create\" button next to the\n * single-item create button; omit it to hide the button entirely.\n *\n * @example\n * ```tsx\n * import { UITableTooltipActions } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableTooltipActions\n *   onCreate={() => setOpenCreate(true)}\n *   onCreateMultiple={() => setOpenBulkCreate(true)}\n *   onRefresh={() => refetch()}\n * />\n * ```\n */\nexport const UITableTooltipActions: React.FC<{\n  onCreate?: () => void;\n  onCreateMultiple?: () => void;\n  onRefresh?: () => void;\n  onDownload?: () => void;\n}> = ({ onCreate, onCreateMultiple, onDownload, onRefresh }) => {\n  const { table, csvData, csvFileName, title, showAnalysisPanel, summary } = useUITableContext();\n  const { isOpen: isAnalysisOpen, toggle: toggleAnalysis } = useUITableAnalysisContext();\n  const { isOpen: isSummaryOpen, toggle: toggleSummary } = useUITableSummaryContext();\n\n  const handleDownload = useCallback(() => {\n    if (onDownload) {\n      onDownload();\n      return;\n    }\n    if (!csvData || csvData.length === 0) return;\n    const selectedRows = table.getSelectedRowModel().flatRows;\n    const rows = selectedRows.length > 0 ? selectedRows.map(row => csvData[row.index]).filter(Boolean) : csvData;\n    downloadCsv(rows, csvFileName || title);\n  }, [onDownload, csvData, csvFileName, table, title]);\n\n  const isDownloadEnabled = !!(onDownload || (csvData && csvData.length > 0));\n\n  return (\n    <div className=\"flex [&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none\">\n      <ActionButton\n        disabled={!onCreate}\n        aria-label=\"Tạo mới\"\n        onClick={e => {\n          onCreate?.();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <CirclePlus />\n      </ActionButton>\n      <ActionButton\n        disabled={!onCreateMultiple}\n        aria-label=\"Tạo nhiều\"\n        onClick={e => {\n          onCreateMultiple?.();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <CopyPlusIcon />\n      </ActionButton>\n      <ActionButton\n        disabled={!onRefresh}\n        aria-label=\"Làm mới\"\n        onClick={e => {\n          onRefresh?.();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <RefreshCwIcon />\n      </ActionButton>\n      <ActionButton\n        disabled={!isDownloadEnabled}\n        aria-label=\"Tải xuống\"\n        onClick={e => {\n          handleDownload();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <DownloadIcon />\n      </ActionButton>\n      {summary && summary.length > 0 && (\n        <ActionButton\n          onClick={e => {\n            toggleSummary();\n            e.stopPropagation();\n            e.preventDefault();\n          }}\n          aria-pressed={isSummaryOpen}\n          aria-label={isSummaryOpen ? 'Ẩn tổng quan' : 'Hiện tổng quan'}\n          className={isSummaryOpen ? 'bg-muted-muted text-text-positive' : undefined}\n        >\n          <LayoutDashboardIcon />\n        </ActionButton>\n      )}\n      {showAnalysisPanel && (\n        <ActionButton\n          onClick={e => {\n            toggleAnalysis();\n            e.stopPropagation();\n            e.preventDefault();\n          }}\n          aria-pressed={isAnalysisOpen}\n          className={isAnalysisOpen ? 'bg-muted-muted text-text-positive' : undefined}\n        >\n          <BarChart2Icon />\n        </ActionButton>\n      )}\n    </div>\n  );\n};\n\n/**\n * Outer toolbar shell for the UITable component.\n *\n * Reads the table `title` from `UITableContext` and renders it as a heading\n * above the `children` slot, which typically contains a\n * `UITableTooltipFilter` and/or `UITableTooltipActions`.\n *\n * @example\n * ```tsx\n * import {\n *   UITableTooltip,\n *   UITableTooltipFilter,\n *   UITableTooltipActions,\n * } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableTooltip>\n *   <UITableTooltipFilter onSearch={setQuery} />\n *   <UITableTooltipActions onCreate={handleCreate} onRefresh={refetch} />\n * </UITableTooltip>\n * ```\n */\nexport const UITableTooltip: React.FC<React.PropsWithChildren> = ({ children }) => {\n  const { title, description, headerActions } = useUITableContext();\n  return (\n    <div data-slot=\"table-tooltip\" className=\"relative grid w-full grid-cols-1 gap-2 px-2 py-0 text-sm\">\n      <div className=\"grid w-full grid-cols-[1fr_auto] items-start gap-4\">\n        <div className=\"grid grid-cols-1 gap-0.5\">\n          <h3 className=\"font-semibold text-base text-text-positive\">{title}</h3>\n          {!!description && <p className=\"text-muted-foreground text-sm\">{description}</p>}\n        </div>\n        {!!headerActions && <div className=\"flex shrink-0 items-center gap-2\">{headerActions}</div>}\n      </div>\n      <div className=\"grid w-full grid-cols-[1fr_auto] gap-x-2\">{children}</div>\n    </div>\n  );\n};\nUITableTooltip.displayName = 'UITableTooltip';\n"],"mappings":"iQAIA,SAAS,EAAW,EAAiC,CACnD,GAAI,GAAU,KAA6B,MAAO,GAClD,GAAI,OAAO,GAAU,SAAU,OAAO,OAAO,CAAK,EAClD,GAAI,OAAO,GAAU,UAAW,OAAO,EAAQ,OAAS,QACxD,IAAM,EAAM,OAAO,CAAK,EAIxB,OAHI,EAAI,SAAS,GAAG,GAAK,EAAI,SAAS,GAAG,GAAK,EAAI,SAAS;CAAI,GAAK,EAAI,SAAS,IAAI,EAC5E,IAAI,EAAI,QAAQ,KAAM,IAAI,EAAE,GAE9B,CACT,CAEA,SAAgB,EAAgB,EAA2B,CACzD,GAAI,EAAK,SAAW,EAAG,MAAO,GAC9B,IAAM,EAAU,EAAK,EAAE,CAAC,IAAI,GAAQ,EAAW,EAAK,KAAK,CAAC,EACpD,EAAW,EAAK,IAAI,GAAO,EAAI,IAAI,GAAQ,EAAW,EAAK,KAAK,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,EAClF,MAAO,CAAC,EAAQ,KAAK,GAAG,EAAG,GAAG,CAAQ,CAAC,CAAC,KAAK;CAAI,CACnD,CAEA,SAAgB,EAAY,EAAmB,EAAwB,CACrE,IAAM,EAAU,EAAgB,CAAI,EACpC,GAAI,CAAC,EAAS,OACd,IAAM,EAAO,IAAI,KAAK,CAAC,CAAO,EAAG,CAAE,KAAM,yBAA0B,CAAC,EAC9D,EAAM,IAAI,gBAAgB,CAAI,EAC9B,EAAO,SAAS,cAAc,GAAG,EACvC,EAAK,KAAO,EACZ,EAAK,SAAW,GAAG,EAAS,MAC5B,EAAK,MAAM,EACX,IAAI,gBAAgB,CAAG,CACzB,CCEA,MAAa,GAIR,CAAE,WAAU,WAAU,GAAG,KAAY,CACxC,IAAM,GAAA,EAAA,EAAA,oBAAA,CAAuC,GAAkB,CAC7D,IAAW,CAAK,CAClB,EAAG,GAAG,EACN,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,kCAAf,SAAA,EACE,EAAA,EAAA,IAAA,CAACA,EAAAA,MAAD,CACE,GAAI,EACJ,KAAK,KACL,KAAK,SACL,YAAY,cACZ,UAAU,mBACV,SAAU,GAAK,CACb,IAAW,CAAC,EACZ,EAAgB,EAAE,OAAO,OAAS,EAAE,CACtC,CACD,CAAA,GACD,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAU,0IACb,UAAA,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAY,KAAM,EAAK,CAAA,CACpB,CAAA,GACL,EAAA,EAAA,IAAA,CAAC,SAAD,CACE,UAAU,8XACV,aAAW,gBACX,KAAK,SAEL,UAAA,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,KAAM,GAAI,cAAY,MAAQ,CAAA,CACxC,CAAA,CACL,GAET,EAEM,GAAmF,CAAE,WAAU,WAAU,UAAS,YAAW,GAAG,MAElI,EAAA,EAAA,IAAA,CAAC,SAAD,CACE,KAAK,SACK,WACV,WAAA,EAAA,EAAA,GAAA,CACE,uYACA,CACF,EACS,UACT,GAAI,EAEH,UACK,CAAA,EA2BC,GAKP,CAAE,WAAU,mBAAkB,aAAY,eAAgB,CAC9D,GAAM,CAAE,QAAO,UAAS,cAAa,QAAO,oBAAmB,WAAYC,EAAAA,EAAkB,EACvF,CAAE,OAAQ,EAAgB,OAAQ,GAAmBC,EAAAA,EAA0B,EAC/E,CAAE,OAAQ,EAAe,OAAQ,GAAkBC,EAAAA,EAAyB,EAE5E,GAAA,EAAA,EAAA,YAAA,KAAmC,CACvC,GAAI,EAAY,CACd,EAAW,EACX,MACF,CACA,GAAI,CAAC,GAAW,EAAQ,SAAW,EAAG,OACtC,IAAM,EAAe,EAAM,oBAAoB,CAAC,CAAC,SAEjD,EADa,EAAa,OAAS,EAAI,EAAa,IAAI,GAAO,EAAQ,EAAI,MAAM,CAAC,CAAC,OAAO,OAAO,EAAI,EACnF,GAAe,CAAK,CACxC,EAAG,CAAC,EAAY,EAAS,EAAa,EAAO,CAAK,CAAC,EAE7C,EAAoB,CAAC,EAAE,GAAe,GAAW,EAAQ,OAAS,GAExE,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,uHAAf,SAAA,EACE,EAAA,EAAA,IAAA,CAAC,EAAD,CACE,SAAU,CAAC,EACX,aAAW,UACX,QAAS,GAAK,CACZ,IAAW,EACX,EAAE,gBAAgB,EAClB,EAAE,eAAe,CACnB,EAEA,UAAA,EAAA,EAAA,IAAA,CAACC,EAAAA,WAAD,CAAa,CAAA,CACD,CAAA,GACd,EAAA,EAAA,IAAA,CAAC,EAAD,CACE,SAAU,CAAC,EACX,aAAW,YACX,QAAS,GAAK,CACZ,IAAmB,EACnB,EAAE,gBAAgB,EAClB,EAAE,eAAe,CACnB,EAEA,UAAA,EAAA,EAAA,IAAA,CAACC,EAAAA,aAAD,CAAe,CAAA,CACH,CAAA,GACd,EAAA,EAAA,IAAA,CAAC,EAAD,CACE,SAAU,CAAC,EACX,aAAW,UACX,QAAS,GAAK,CACZ,IAAY,EACZ,EAAE,gBAAgB,EAClB,EAAE,eAAe,CACnB,EAEA,UAAA,EAAA,EAAA,IAAA,CAACC,EAAAA,cAAD,CAAgB,CAAA,CACJ,CAAA,GACd,EAAA,EAAA,IAAA,CAAC,EAAD,CACE,SAAU,CAAC,EACX,aAAW,YACX,QAAS,GAAK,CACZ,EAAe,EACf,EAAE,gBAAgB,EAClB,EAAE,eAAe,CACnB,EAEA,UAAA,EAAA,EAAA,IAAA,CAACC,EAAAA,aAAD,CAAe,CAAA,CACH,CAAA,EACb,GAAW,EAAQ,OAAS,IAC3B,EAAA,EAAA,IAAA,CAAC,EAAD,CACE,QAAS,GAAK,CACZ,EAAc,EACd,EAAE,gBAAgB,EAClB,EAAE,eAAe,CACnB,EACA,eAAc,EACd,aAAY,EAAgB,eAAiB,iBAC7C,UAAW,EAAgB,oCAAsC,IAAA,GAEjE,UAAA,EAAA,EAAA,IAAA,CAACC,EAAAA,oBAAD,CAAsB,CAAA,CACV,CAAA,EAEf,IACC,EAAA,EAAA,IAAA,CAAC,EAAD,CACE,QAAS,GAAK,CACZ,EAAe,EACf,EAAE,gBAAgB,EAClB,EAAE,eAAe,CACnB,EACA,eAAc,EACd,UAAW,EAAiB,oCAAsC,IAAA,GAElE,UAAA,EAAA,EAAA,IAAA,CAACC,EAAAA,cAAD,CAAgB,CAAA,CACJ,CAAA,CAEb,GAET,EAuBa,GAAqD,CAAE,cAAe,CACjF,GAAM,CAAE,QAAO,cAAa,iBAAkBR,EAAAA,EAAkB,EAChE,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,YAAU,gBAAgB,UAAU,2DAAzC,SAAA,EACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,qDAAf,SAAA,EACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,2BAAf,SAAA,EACE,EAAA,EAAA,IAAA,CAAC,KAAD,CAAI,UAAU,6CAA8C,SAAA,CAAU,CAAA,EACrE,CAAC,CAAC,IAAe,EAAA,EAAA,IAAA,CAAC,IAAD,CAAG,UAAU,gCAAiC,SAAA,CAAe,CAAA,CAC5E,CACJ,CAAA,EAAA,CAAC,CAAC,IAAiB,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAU,mCAAoC,SAAA,CAAmB,CAAA,CACvF,CACL,CAAA,GAAA,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAU,2CAA4C,UAAc,CAAA,CACtE,GAET,EACA,EAAe,YAAc"}
+{"version":3,"file":"tooltip-CUyGXE9e.cjs","names":["Input","SearchIcon","ArrowRightIcon","useUITableContext","useUITableAnalysisContext","useUITableSummaryContext","CirclePlus","CopyPlusIcon","RefreshCwIcon","DownloadIcon","LayoutDashboardIcon","BarChart2Icon"],"sources":["../packages/components/features/tables/utils/csv.ts","../packages/components/features/tables/components/table/tooltip.tsx"],"sourcesContent":["'use client';\n\nimport type { CsvCell } from '../types';\n\nfunction formatCell(value: CsvCell['value']): string {\n  if (value === null || value === undefined) return '';\n  if (typeof value === 'number') return String(value);\n  if (typeof value === 'boolean') return value ? 'true' : 'false';\n  const str = String(value);\n  if (str.includes(',') || str.includes('\"') || str.includes('\\n') || str.includes('\\r')) {\n    return `\"${str.replace(/\"/g, '\"\"')}\"`;\n  }\n  return str;\n}\n\nexport function buildCsvContent(rows: CsvCell[][]): string {\n  if (rows.length === 0) return '';\n  const headers = rows[0].map(cell => formatCell(cell.label));\n  const dataRows = rows.map(row => row.map(cell => formatCell(cell.value)).join(','));\n  return [headers.join(','), ...dataRows].join('\\n');\n}\n\nexport function downloadCsv(rows: CsvCell[][], fileName: string): void {\n  const content = buildCsvContent(rows);\n  if (!content) return;\n  const blob = new Blob([content], { type: 'text/csv;charset=utf-8;' });\n  const url = URL.createObjectURL(blob);\n  const link = document.createElement('a');\n  link.href = url;\n  link.download = `${fileName}.csv`;\n  link.click();\n  URL.revokeObjectURL(url);\n}\n","/**\n * @file tooltip.tsx\n * Toolbar components rendered above the table: a debounced search input,\n * an action button group (create / refresh / download), and the outer\n * toolbar shell that displays the table title.\n */\nimport { useCallback } from 'react';\n\nimport { ArrowRightIcon, BarChart2Icon, CirclePlus, CopyPlusIcon, DownloadIcon, LayoutDashboardIcon, RefreshCwIcon, SearchIcon } from 'lucide-react';\n\nimport { useDebounceCallback } from '@customafk/react-toolkit/hooks/useDebounceCallback';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Input } from '@/components/ui/input';\n\nimport { useUITableAnalysisContext, useUITableContext, useUITableSummaryContext } from '../../hooks/use-context';\nimport { downloadCsv } from '../../utils/csv';\n\n/**\n * Debounced search input rendered inside the table toolbar.\n *\n * Fires `onSearch` 500 ms after the user stops typing and delegates all other\n * native input events via the spread `props`.\n *\n * @example\n * ```tsx\n * import { UITableTooltipFilter } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableTooltipFilter\n *   placeholder=\"Search users…\"\n *   onSearch={value => setQuery(value)}\n * />\n * ```\n */\nexport const UITableTooltipFilter: React.FC<\n  Omit<React.ComponentProps<typeof Input>, 'className'> & {\n    onSearch?: (value: string) => void;\n  }\n> = ({ onSearch, onChange, ...props }) => {\n  const debouncedSearch = useDebounceCallback((value: string) => {\n    onSearch?.(value);\n  }, 500);\n  return (\n    <div className=\"relative w-full max-w-80 flex-1\">\n      <Input\n        {...props}\n        size=\"lg\"\n        type=\"search\"\n        placeholder=\"Tìm kiếm...\"\n        className=\"flex-1 ps-9 pe-9\"\n        onChange={e => {\n          onChange?.(e);\n          debouncedSearch(e.target.value ?? '');\n        }}\n      />\n      <div className=\"pointer-events-none absolute inset-y-0 inset-s-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50\">\n        <SearchIcon size={16} />\n      </div>\n      <button\n        className=\"absolute inset-y-0 inset-e-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50\"\n        aria-label=\"Submit search\"\n        type=\"submit\"\n      >\n        <ArrowRightIcon size={16} aria-hidden=\"true\" />\n      </button>\n    </div>\n  );\n};\n\nconst ActionButton: React.FC<React.PropsWithChildren<React.ComponentProps<'button'>>> = ({ children, disabled, onClick, className, ...props }) => {\n  return (\n    <button\n      type=\"button\"\n      disabled={disabled}\n      className={cn(\n        'flex cursor-pointer items-center gap-x-1 rounded-sm border border-border bg-background p-2.5 text-sm text-text-positive-weak outline-none transition-all hover:shadow-card focus:border-border-emphasis focus:bg-muted-muted active:border-border-emphasis active:bg-muted-muted active:text-text-positive disabled:pointer-events-none disabled:cursor-default disabled:opacity-60 [&_svg]:size-3.5',\n        className\n      )}\n      onClick={onClick}\n      {...props}\n    >\n      {children}\n    </button>\n  );\n};\n\n/**\n * Grouped action buttons (create, refresh, download) displayed in the table\n * toolbar.\n *\n * Each button is disabled automatically when the corresponding handler prop is\n * omitted, so only the actions relevant to a given table need to be provided.\n * A toggle for `UITableSummaryBar` appears automatically when `summary` is\n * non-empty, and a toggle for `UITableAnalysisPanel` appears when\n * `showAnalysisPanel` is `true` (both set on `UITableProvider`).\n * `onCreateMultiple` renders a separate \"bulk create\" button next to the\n * single-item create button; omit it to hide the button entirely.\n *\n * @example\n * ```tsx\n * import { UITableTooltipActions } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableTooltipActions\n *   onCreate={() => setOpenCreate(true)}\n *   onCreateMultiple={() => setOpenBulkCreate(true)}\n *   onRefresh={() => refetch()}\n * />\n * ```\n */\nexport const UITableTooltipActions: React.FC<{\n  onCreate?: () => void;\n  onCreateMultiple?: () => void;\n  onRefresh?: () => void;\n  onDownload?: () => void;\n}> = ({ onCreate, onCreateMultiple, onDownload, onRefresh }) => {\n  const { table, csvData, csvFileName, title, showAnalysisPanel, summary } = useUITableContext();\n  const { isOpen: isAnalysisOpen, toggle: toggleAnalysis } = useUITableAnalysisContext();\n  const { isOpen: isSummaryOpen, toggle: toggleSummary } = useUITableSummaryContext();\n\n  const handleDownload = useCallback(() => {\n    if (onDownload) {\n      onDownload();\n      return;\n    }\n    if (!csvData || csvData.length === 0) return;\n    const selectedRows = table.getSelectedRowModel().flatRows;\n    const rows = selectedRows.length > 0 ? selectedRows.map(row => csvData[row.index]).filter(Boolean) : csvData;\n    downloadCsv(rows, csvFileName || title);\n  }, [onDownload, csvData, csvFileName, table, title]);\n\n  const isDownloadEnabled = !!(onDownload || (csvData && csvData.length > 0));\n\n  return (\n    <div className=\"flex [&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none\">\n      <ActionButton\n        disabled={!onCreate}\n        aria-label=\"Tạo mới\"\n        onClick={e => {\n          onCreate?.();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <CirclePlus />\n      </ActionButton>\n      <ActionButton\n        disabled={!onCreateMultiple}\n        aria-label=\"Tạo nhiều\"\n        onClick={e => {\n          onCreateMultiple?.();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <CopyPlusIcon />\n      </ActionButton>\n      <ActionButton\n        disabled={!onRefresh}\n        aria-label=\"Làm mới\"\n        onClick={e => {\n          onRefresh?.();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <RefreshCwIcon />\n      </ActionButton>\n      <ActionButton\n        disabled={!isDownloadEnabled}\n        aria-label=\"Tải xuống\"\n        onClick={e => {\n          handleDownload();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <DownloadIcon />\n      </ActionButton>\n      {summary && summary.length > 0 && (\n        <ActionButton\n          onClick={e => {\n            toggleSummary();\n            e.stopPropagation();\n            e.preventDefault();\n          }}\n          aria-pressed={isSummaryOpen}\n          aria-label={isSummaryOpen ? 'Ẩn tổng quan' : 'Hiện tổng quan'}\n          className={isSummaryOpen ? 'bg-muted-muted text-text-positive' : undefined}\n        >\n          <LayoutDashboardIcon />\n        </ActionButton>\n      )}\n      {showAnalysisPanel && (\n        <ActionButton\n          onClick={e => {\n            toggleAnalysis();\n            e.stopPropagation();\n            e.preventDefault();\n          }}\n          aria-pressed={isAnalysisOpen}\n          className={isAnalysisOpen ? 'bg-muted-muted text-text-positive' : undefined}\n        >\n          <BarChart2Icon />\n        </ActionButton>\n      )}\n    </div>\n  );\n};\n\n/**\n * Outer toolbar shell for the UITable component.\n *\n * Reads the table `title` from `UITableContext` and renders it as a heading\n * above the `children` slot, which typically contains a\n * `UITableTooltipFilter` and/or `UITableTooltipActions`.\n *\n * @example\n * ```tsx\n * import {\n *   UITableTooltip,\n *   UITableTooltipFilter,\n *   UITableTooltipActions,\n * } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableTooltip>\n *   <UITableTooltipFilter onSearch={setQuery} />\n *   <UITableTooltipActions onCreate={handleCreate} onRefresh={refetch} />\n * </UITableTooltip>\n * ```\n */\nexport const UITableTooltip: React.FC<React.PropsWithChildren> = ({ children }) => {\n  const { title, description, headerActions } = useUITableContext();\n  return (\n    <div data-slot=\"table-tooltip\" className=\"relative grid w-full grid-cols-1 gap-2 px-2 py-0 text-sm\">\n      <div className=\"grid w-full grid-cols-[1fr_auto] items-start gap-4\">\n        <div className=\"grid grid-cols-1 gap-0.5\">\n          <h3 className=\"font-semibold text-base text-text-positive\">{title}</h3>\n          {!!description && <p className=\"text-muted-foreground text-sm\">{description}</p>}\n        </div>\n        {!!headerActions && <div className=\"flex shrink-0 items-center gap-2\">{headerActions}</div>}\n      </div>\n      <div className=\"grid w-full grid-cols-[1fr_auto] gap-x-2\">{children}</div>\n    </div>\n  );\n};\nUITableTooltip.displayName = 'UITableTooltip';\n"],"mappings":"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"}

package/dist/{tooltip-D7U_Nl5c.mjs → tooltip-DSxSeIak.mjs}

@@ -1,4 +1,4 @@
-import{Y as e,Z as t,q as n}from"./tables-Dg3KMBKA.mjs";import{Input as r}from"./ui/input.mjs";import{ArrowRightIcon as i,BarChart2Icon as a,CirclePlus as o,CopyPlusIcon as s,DownloadIcon as c,LayoutDashboardIcon as l,RefreshCwIcon as u,SearchIcon as d}from"lucide-react";import{useCallback as f}from"react";import{cn as p}from"@customafk/react-toolkit/utils";import{jsx as m,jsxs as h}from"react/jsx-runtime";import{useDebounceCallback as g}from"@customafk/react-toolkit/hooks/useDebounceCallback";function _(e){if(e==null)return``;if(typeof e==`number`)return String(e);if(typeof e==`boolean`)return e?`true`:`false`;let t=String(e);return t.includes(`,`)||t.includes(`"`)||t.includes(`
+import{Input as e}from"./ui/input.mjs";import{Y as t,Z as n,q as r}from"./tables-CuoBQNqx.mjs";import{ArrowRightIcon as i,BarChart2Icon as a,CirclePlus as o,CopyPlusIcon as s,DownloadIcon as c,LayoutDashboardIcon as l,RefreshCwIcon as u,SearchIcon as d}from"lucide-react";import{useCallback as f}from"react";import{cn as p}from"@customafk/react-toolkit/utils";import{jsx as m,jsxs as h}from"react/jsx-runtime";import{useDebounceCallback as g}from"@customafk/react-toolkit/hooks/useDebounceCallback";function _(e){if(e==null)return``;if(typeof e==`number`)return String(e);if(typeof e==`boolean`)return e?`true`:`false`;let t=String(e);return t.includes(`,`)||t.includes(`"`)||t.includes(`
 `)||t.includes(`\r`)?`"${t.replace(/"/g,`""`)}"`:t}function v(e){if(e.length===0)return``;let t=e[0].map(e=>_(e.label)),n=e.map(e=>e.map(e=>_(e.value)).join(`,`));return[t.join(`,`),...n].join(`
-`)}function y(e,t){let n=v(e);if(!n)return;let r=new Blob([n],{type:`text/csv;charset=utf-8;`}),i=URL.createObjectURL(r),a=document.createElement(`a`);a.href=i,a.download=`${t}.csv`,a.click(),URL.revokeObjectURL(i)}const b=({onSearch:e,onChange:t,...n})=>{let a=g(t=>{e?.(t)},500);return h(`div`,{className:`relative w-full max-w-80 flex-1`,children:[m(r,{...n,size:`lg`,type:`search`,placeholder:`Tìm kiếm...`,className:`flex-1 ps-9 pe-9`,onChange:e=>{t?.(e),a(e.target.value??``)}}),m(`div`,{className:`pointer-events-none absolute inset-y-0 inset-s-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50`,children:m(d,{size:16})}),m(`button`,{className:`absolute inset-y-0 inset-e-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50`,"aria-label":`Submit search`,type:`submit`,children:m(i,{size:16,"aria-hidden":`true`})})]})},x=({children:e,disabled:t,onClick:n,className:r,...i})=>m(`button`,{type:`button`,disabled:t,className:p(`flex cursor-pointer items-center gap-x-1 rounded-sm border border-border bg-background p-2.5 text-sm text-text-positive-weak outline-none transition-all hover:shadow-card focus:border-border-emphasis focus:bg-muted-muted active:border-border-emphasis active:bg-muted-muted active:text-text-positive disabled:pointer-events-none disabled:cursor-default disabled:opacity-60 [&_svg]:size-3.5`,r),onClick:n,...i,children:e}),S=({onCreate:r,onCreateMultiple:i,onDownload:d,onRefresh:p})=>{let{table:g,csvData:_,csvFileName:v,title:b,showAnalysisPanel:S,summary:C}=e(),{isOpen:w,toggle:T}=n(),{isOpen:E,toggle:D}=t(),O=f(()=>{if(d){d();return}if(!_||_.length===0)return;let e=g.getSelectedRowModel().flatRows;y(e.length>0?e.map(e=>_[e.index]).filter(Boolean):_,v||b)},[d,_,v,g,b]),k=!!(d||_&&_.length>0);return h(`div`,{className:`flex [&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none`,children:[m(x,{disabled:!r,"aria-label":`Tạo mới`,onClick:e=>{r?.(),e.stopPropagation(),e.preventDefault()},children:m(o,{})}),m(x,{disabled:!i,"aria-label":`Tạo nhiều`,onClick:e=>{i?.(),e.stopPropagation(),e.preventDefault()},children:m(s,{})}),m(x,{disabled:!p,"aria-label":`Làm mới`,onClick:e=>{p?.(),e.stopPropagation(),e.preventDefault()},children:m(u,{})}),m(x,{disabled:!k,"aria-label":`Tải xuống`,onClick:e=>{O(),e.stopPropagation(),e.preventDefault()},children:m(c,{})}),C&&C.length>0&&m(x,{onClick:e=>{D(),e.stopPropagation(),e.preventDefault()},"aria-pressed":E,"aria-label":E?`Ẩn tổng quan`:`Hiện tổng quan`,className:E?`bg-muted-muted text-text-positive`:void 0,children:m(l,{})}),S&&m(x,{onClick:e=>{T(),e.stopPropagation(),e.preventDefault()},"aria-pressed":w,className:w?`bg-muted-muted text-text-positive`:void 0,children:m(a,{})})]})},C=({children:t})=>{let{title:n,description:r,headerActions:i}=e();return h(`div`,{"data-slot":`table-tooltip`,className:`relative grid w-full grid-cols-1 gap-2 px-2 py-0 text-sm`,children:[h(`div`,{className:`grid w-full grid-cols-[1fr_auto] items-start gap-4`,children:[h(`div`,{className:`grid grid-cols-1 gap-0.5`,children:[m(`h3`,{className:`font-semibold text-base text-text-positive`,children:n}),!!r&&m(`p`,{className:`text-muted-foreground text-sm`,children:r})]}),!!i&&m(`div`,{className:`flex shrink-0 items-center gap-2`,children:i})]}),m(`div`,{className:`grid w-full grid-cols-[1fr_auto] gap-x-2`,children:t})]})};C.displayName=`UITableTooltip`;export{C as UITableTooltip,S as UITableTooltipActions,b as UITableTooltipFilter};
-//# sourceMappingURL=tooltip-D7U_Nl5c.mjs.map
+`)}function y(e,t){let n=v(e);if(!n)return;let r=new Blob([n],{type:`text/csv;charset=utf-8;`}),i=URL.createObjectURL(r),a=document.createElement(`a`);a.href=i,a.download=`${t}.csv`,a.click(),URL.revokeObjectURL(i)}const b=({onSearch:t,onChange:n,...r})=>{let a=g(e=>{t?.(e)},500);return h(`div`,{className:`relative w-full max-w-80 flex-1`,children:[m(e,{...r,size:`lg`,type:`search`,placeholder:`Tìm kiếm...`,className:`flex-1 ps-9 pe-9`,onChange:e=>{n?.(e),a(e.target.value??``)}}),m(`div`,{className:`pointer-events-none absolute inset-y-0 inset-s-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50`,children:m(d,{size:16})}),m(`button`,{className:`absolute inset-y-0 inset-e-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50`,"aria-label":`Submit search`,type:`submit`,children:m(i,{size:16,"aria-hidden":`true`})})]})},x=({children:e,disabled:t,onClick:n,className:r,...i})=>m(`button`,{type:`button`,disabled:t,className:p(`flex cursor-pointer items-center gap-x-1 rounded-sm border border-border bg-background p-2.5 text-sm text-text-positive-weak outline-none transition-all hover:shadow-card focus:border-border-emphasis focus:bg-muted-muted active:border-border-emphasis active:bg-muted-muted active:text-text-positive disabled:pointer-events-none disabled:cursor-default disabled:opacity-60 [&_svg]:size-3.5`,r),onClick:n,...i,children:e}),S=({onCreate:e,onCreateMultiple:i,onDownload:d,onRefresh:p})=>{let{table:g,csvData:_,csvFileName:v,title:b,showAnalysisPanel:S,summary:C}=t(),{isOpen:w,toggle:T}=r(),{isOpen:E,toggle:D}=n(),O=f(()=>{if(d){d();return}if(!_||_.length===0)return;let e=g.getSelectedRowModel().flatRows;y(e.length>0?e.map(e=>_[e.index]).filter(Boolean):_,v||b)},[d,_,v,g,b]),k=!!(d||_&&_.length>0);return h(`div`,{className:`flex [&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none`,children:[m(x,{disabled:!e,"aria-label":`Tạo mới`,onClick:t=>{e?.(),t.stopPropagation(),t.preventDefault()},children:m(o,{})}),m(x,{disabled:!i,"aria-label":`Tạo nhiều`,onClick:e=>{i?.(),e.stopPropagation(),e.preventDefault()},children:m(s,{})}),m(x,{disabled:!p,"aria-label":`Làm mới`,onClick:e=>{p?.(),e.stopPropagation(),e.preventDefault()},children:m(u,{})}),m(x,{disabled:!k,"aria-label":`Tải xuống`,onClick:e=>{O(),e.stopPropagation(),e.preventDefault()},children:m(c,{})}),C&&C.length>0&&m(x,{onClick:e=>{D(),e.stopPropagation(),e.preventDefault()},"aria-pressed":E,"aria-label":E?`Ẩn tổng quan`:`Hiện tổng quan`,className:E?`bg-muted-muted text-text-positive`:void 0,children:m(l,{})}),S&&m(x,{onClick:e=>{T(),e.stopPropagation(),e.preventDefault()},"aria-pressed":w,className:w?`bg-muted-muted text-text-positive`:void 0,children:m(a,{})})]})},C=({children:e})=>{let{title:n,description:r,headerActions:i}=t();return h(`div`,{"data-slot":`table-tooltip`,className:`relative grid w-full grid-cols-1 gap-2 px-2 py-0 text-sm`,children:[h(`div`,{className:`grid w-full grid-cols-[1fr_auto] items-start gap-4`,children:[h(`div`,{className:`grid grid-cols-1 gap-0.5`,children:[m(`h3`,{className:`font-semibold text-base text-text-positive`,children:n}),!!r&&m(`p`,{className:`text-muted-foreground text-sm`,children:r})]}),!!i&&m(`div`,{className:`flex shrink-0 items-center gap-2`,children:i})]}),m(`div`,{className:`grid w-full grid-cols-[1fr_auto] gap-x-2`,children:e})]})};C.displayName=`UITableTooltip`;export{C as UITableTooltip,S as UITableTooltipActions,b as UITableTooltipFilter};
+//# sourceMappingURL=tooltip-DSxSeIak.mjs.map

package/dist/{tooltip-D7U_Nl5c.mjs.map → tooltip-DSxSeIak.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"tooltip-D7U_Nl5c.mjs","names":[],"sources":["../packages/components/features/tables/utils/csv.ts","../packages/components/features/tables/components/table/tooltip.tsx"],"sourcesContent":["'use client';\n\nimport type { CsvCell } from '../types';\n\nfunction formatCell(value: CsvCell['value']): string {\n  if (value === null || value === undefined) return '';\n  if (typeof value === 'number') return String(value);\n  if (typeof value === 'boolean') return value ? 'true' : 'false';\n  const str = String(value);\n  if (str.includes(',') || str.includes('\"') || str.includes('\\n') || str.includes('\\r')) {\n    return `\"${str.replace(/\"/g, '\"\"')}\"`;\n  }\n  return str;\n}\n\nexport function buildCsvContent(rows: CsvCell[][]): string {\n  if (rows.length === 0) return '';\n  const headers = rows[0].map(cell => formatCell(cell.label));\n  const dataRows = rows.map(row => row.map(cell => formatCell(cell.value)).join(','));\n  return [headers.join(','), ...dataRows].join('\\n');\n}\n\nexport function downloadCsv(rows: CsvCell[][], fileName: string): void {\n  const content = buildCsvContent(rows);\n  if (!content) return;\n  const blob = new Blob([content], { type: 'text/csv;charset=utf-8;' });\n  const url = URL.createObjectURL(blob);\n  const link = document.createElement('a');\n  link.href = url;\n  link.download = `${fileName}.csv`;\n  link.click();\n  URL.revokeObjectURL(url);\n}\n","/**\n * @file tooltip.tsx\n * Toolbar components rendered above the table: a debounced search input,\n * an action button group (create / refresh / download), and the outer\n * toolbar shell that displays the table title.\n */\nimport { useCallback } from 'react';\n\nimport { ArrowRightIcon, BarChart2Icon, CirclePlus, CopyPlusIcon, DownloadIcon, LayoutDashboardIcon, RefreshCwIcon, SearchIcon } from 'lucide-react';\n\nimport { useDebounceCallback } from '@customafk/react-toolkit/hooks/useDebounceCallback';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Input } from '@/components/ui/input';\n\nimport { useUITableAnalysisContext, useUITableContext, useUITableSummaryContext } from '../../hooks/use-context';\nimport { downloadCsv } from '../../utils/csv';\n\n/**\n * Debounced search input rendered inside the table toolbar.\n *\n * Fires `onSearch` 500 ms after the user stops typing and delegates all other\n * native input events via the spread `props`.\n *\n * @example\n * ```tsx\n * import { UITableTooltipFilter } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableTooltipFilter\n *   placeholder=\"Search users…\"\n *   onSearch={value => setQuery(value)}\n * />\n * ```\n */\nexport const UITableTooltipFilter: React.FC<\n  Omit<React.ComponentProps<typeof Input>, 'className'> & {\n    onSearch?: (value: string) => void;\n  }\n> = ({ onSearch, onChange, ...props }) => {\n  const debouncedSearch = useDebounceCallback((value: string) => {\n    onSearch?.(value);\n  }, 500);\n  return (\n    <div className=\"relative w-full max-w-80 flex-1\">\n      <Input\n        {...props}\n        size=\"lg\"\n        type=\"search\"\n        placeholder=\"Tìm kiếm...\"\n        className=\"flex-1 ps-9 pe-9\"\n        onChange={e => {\n          onChange?.(e);\n          debouncedSearch(e.target.value ?? '');\n        }}\n      />\n      <div className=\"pointer-events-none absolute inset-y-0 inset-s-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50\">\n        <SearchIcon size={16} />\n      </div>\n      <button\n        className=\"absolute inset-y-0 inset-e-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50\"\n        aria-label=\"Submit search\"\n        type=\"submit\"\n      >\n        <ArrowRightIcon size={16} aria-hidden=\"true\" />\n      </button>\n    </div>\n  );\n};\n\nconst ActionButton: React.FC<React.PropsWithChildren<React.ComponentProps<'button'>>> = ({ children, disabled, onClick, className, ...props }) => {\n  return (\n    <button\n      type=\"button\"\n      disabled={disabled}\n      className={cn(\n        'flex cursor-pointer items-center gap-x-1 rounded-sm border border-border bg-background p-2.5 text-sm text-text-positive-weak outline-none transition-all hover:shadow-card focus:border-border-emphasis focus:bg-muted-muted active:border-border-emphasis active:bg-muted-muted active:text-text-positive disabled:pointer-events-none disabled:cursor-default disabled:opacity-60 [&_svg]:size-3.5',\n        className\n      )}\n      onClick={onClick}\n      {...props}\n    >\n      {children}\n    </button>\n  );\n};\n\n/**\n * Grouped action buttons (create, refresh, download) displayed in the table\n * toolbar.\n *\n * Each button is disabled automatically when the corresponding handler prop is\n * omitted, so only the actions relevant to a given table need to be provided.\n * A toggle for `UITableSummaryBar` appears automatically when `summary` is\n * non-empty, and a toggle for `UITableAnalysisPanel` appears when\n * `showAnalysisPanel` is `true` (both set on `UITableProvider`).\n * `onCreateMultiple` renders a separate \"bulk create\" button next to the\n * single-item create button; omit it to hide the button entirely.\n *\n * @example\n * ```tsx\n * import { UITableTooltipActions } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableTooltipActions\n *   onCreate={() => setOpenCreate(true)}\n *   onCreateMultiple={() => setOpenBulkCreate(true)}\n *   onRefresh={() => refetch()}\n * />\n * ```\n */\nexport const UITableTooltipActions: React.FC<{\n  onCreate?: () => void;\n  onCreateMultiple?: () => void;\n  onRefresh?: () => void;\n  onDownload?: () => void;\n}> = ({ onCreate, onCreateMultiple, onDownload, onRefresh }) => {\n  const { table, csvData, csvFileName, title, showAnalysisPanel, summary } = useUITableContext();\n  const { isOpen: isAnalysisOpen, toggle: toggleAnalysis } = useUITableAnalysisContext();\n  const { isOpen: isSummaryOpen, toggle: toggleSummary } = useUITableSummaryContext();\n\n  const handleDownload = useCallback(() => {\n    if (onDownload) {\n      onDownload();\n      return;\n    }\n    if (!csvData || csvData.length === 0) return;\n    const selectedRows = table.getSelectedRowModel().flatRows;\n    const rows = selectedRows.length > 0 ? selectedRows.map(row => csvData[row.index]).filter(Boolean) : csvData;\n    downloadCsv(rows, csvFileName || title);\n  }, [onDownload, csvData, csvFileName, table, title]);\n\n  const isDownloadEnabled = !!(onDownload || (csvData && csvData.length > 0));\n\n  return (\n    <div className=\"flex [&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none\">\n      <ActionButton\n        disabled={!onCreate}\n        aria-label=\"Tạo mới\"\n        onClick={e => {\n          onCreate?.();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <CirclePlus />\n      </ActionButton>\n      <ActionButton\n        disabled={!onCreateMultiple}\n        aria-label=\"Tạo nhiều\"\n        onClick={e => {\n          onCreateMultiple?.();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <CopyPlusIcon />\n      </ActionButton>\n      <ActionButton\n        disabled={!onRefresh}\n        aria-label=\"Làm mới\"\n        onClick={e => {\n          onRefresh?.();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <RefreshCwIcon />\n      </ActionButton>\n      <ActionButton\n        disabled={!isDownloadEnabled}\n        aria-label=\"Tải xuống\"\n        onClick={e => {\n          handleDownload();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <DownloadIcon />\n      </ActionButton>\n      {summary && summary.length > 0 && (\n        <ActionButton\n          onClick={e => {\n            toggleSummary();\n            e.stopPropagation();\n            e.preventDefault();\n          }}\n          aria-pressed={isSummaryOpen}\n          aria-label={isSummaryOpen ? 'Ẩn tổng quan' : 'Hiện tổng quan'}\n          className={isSummaryOpen ? 'bg-muted-muted text-text-positive' : undefined}\n        >\n          <LayoutDashboardIcon />\n        </ActionButton>\n      )}\n      {showAnalysisPanel && (\n        <ActionButton\n          onClick={e => {\n            toggleAnalysis();\n            e.stopPropagation();\n            e.preventDefault();\n          }}\n          aria-pressed={isAnalysisOpen}\n          className={isAnalysisOpen ? 'bg-muted-muted text-text-positive' : undefined}\n        >\n          <BarChart2Icon />\n        </ActionButton>\n      )}\n    </div>\n  );\n};\n\n/**\n * Outer toolbar shell for the UITable component.\n *\n * Reads the table `title` from `UITableContext` and renders it as a heading\n * above the `children` slot, which typically contains a\n * `UITableTooltipFilter` and/or `UITableTooltipActions`.\n *\n * @example\n * ```tsx\n * import {\n *   UITableTooltip,\n *   UITableTooltipFilter,\n *   UITableTooltipActions,\n * } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableTooltip>\n *   <UITableTooltipFilter onSearch={setQuery} />\n *   <UITableTooltipActions onCreate={handleCreate} onRefresh={refetch} />\n * </UITableTooltip>\n * ```\n */\nexport const UITableTooltip: React.FC<React.PropsWithChildren> = ({ children }) => {\n  const { title, description, headerActions } = useUITableContext();\n  return (\n    <div data-slot=\"table-tooltip\" className=\"relative grid w-full grid-cols-1 gap-2 px-2 py-0 text-sm\">\n      <div className=\"grid w-full grid-cols-[1fr_auto] items-start gap-4\">\n        <div className=\"grid grid-cols-1 gap-0.5\">\n          <h3 className=\"font-semibold text-base text-text-positive\">{title}</h3>\n          {!!description && <p className=\"text-muted-foreground text-sm\">{description}</p>}\n        </div>\n        {!!headerActions && <div className=\"flex shrink-0 items-center gap-2\">{headerActions}</div>}\n      </div>\n      <div className=\"grid w-full grid-cols-[1fr_auto] gap-x-2\">{children}</div>\n    </div>\n  );\n};\nUITableTooltip.displayName = 'UITableTooltip';\n"],"mappings":"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"}
+{"version":3,"file":"tooltip-DSxSeIak.mjs","names":[],"sources":["../packages/components/features/tables/utils/csv.ts","../packages/components/features/tables/components/table/tooltip.tsx"],"sourcesContent":["'use client';\n\nimport type { CsvCell } from '../types';\n\nfunction formatCell(value: CsvCell['value']): string {\n  if (value === null || value === undefined) return '';\n  if (typeof value === 'number') return String(value);\n  if (typeof value === 'boolean') return value ? 'true' : 'false';\n  const str = String(value);\n  if (str.includes(',') || str.includes('\"') || str.includes('\\n') || str.includes('\\r')) {\n    return `\"${str.replace(/\"/g, '\"\"')}\"`;\n  }\n  return str;\n}\n\nexport function buildCsvContent(rows: CsvCell[][]): string {\n  if (rows.length === 0) return '';\n  const headers = rows[0].map(cell => formatCell(cell.label));\n  const dataRows = rows.map(row => row.map(cell => formatCell(cell.value)).join(','));\n  return [headers.join(','), ...dataRows].join('\\n');\n}\n\nexport function downloadCsv(rows: CsvCell[][], fileName: string): void {\n  const content = buildCsvContent(rows);\n  if (!content) return;\n  const blob = new Blob([content], { type: 'text/csv;charset=utf-8;' });\n  const url = URL.createObjectURL(blob);\n  const link = document.createElement('a');\n  link.href = url;\n  link.download = `${fileName}.csv`;\n  link.click();\n  URL.revokeObjectURL(url);\n}\n","/**\n * @file tooltip.tsx\n * Toolbar components rendered above the table: a debounced search input,\n * an action button group (create / refresh / download), and the outer\n * toolbar shell that displays the table title.\n */\nimport { useCallback } from 'react';\n\nimport { ArrowRightIcon, BarChart2Icon, CirclePlus, CopyPlusIcon, DownloadIcon, LayoutDashboardIcon, RefreshCwIcon, SearchIcon } from 'lucide-react';\n\nimport { useDebounceCallback } from '@customafk/react-toolkit/hooks/useDebounceCallback';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Input } from '@/components/ui/input';\n\nimport { useUITableAnalysisContext, useUITableContext, useUITableSummaryContext } from '../../hooks/use-context';\nimport { downloadCsv } from '../../utils/csv';\n\n/**\n * Debounced search input rendered inside the table toolbar.\n *\n * Fires `onSearch` 500 ms after the user stops typing and delegates all other\n * native input events via the spread `props`.\n *\n * @example\n * ```tsx\n * import { UITableTooltipFilter } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableTooltipFilter\n *   placeholder=\"Search users…\"\n *   onSearch={value => setQuery(value)}\n * />\n * ```\n */\nexport const UITableTooltipFilter: React.FC<\n  Omit<React.ComponentProps<typeof Input>, 'className'> & {\n    onSearch?: (value: string) => void;\n  }\n> = ({ onSearch, onChange, ...props }) => {\n  const debouncedSearch = useDebounceCallback((value: string) => {\n    onSearch?.(value);\n  }, 500);\n  return (\n    <div className=\"relative w-full max-w-80 flex-1\">\n      <Input\n        {...props}\n        size=\"lg\"\n        type=\"search\"\n        placeholder=\"Tìm kiếm...\"\n        className=\"flex-1 ps-9 pe-9\"\n        onChange={e => {\n          onChange?.(e);\n          debouncedSearch(e.target.value ?? '');\n        }}\n      />\n      <div className=\"pointer-events-none absolute inset-y-0 inset-s-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50\">\n        <SearchIcon size={16} />\n      </div>\n      <button\n        className=\"absolute inset-y-0 inset-e-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50\"\n        aria-label=\"Submit search\"\n        type=\"submit\"\n      >\n        <ArrowRightIcon size={16} aria-hidden=\"true\" />\n      </button>\n    </div>\n  );\n};\n\nconst ActionButton: React.FC<React.PropsWithChildren<React.ComponentProps<'button'>>> = ({ children, disabled, onClick, className, ...props }) => {\n  return (\n    <button\n      type=\"button\"\n      disabled={disabled}\n      className={cn(\n        'flex cursor-pointer items-center gap-x-1 rounded-sm border border-border bg-background p-2.5 text-sm text-text-positive-weak outline-none transition-all hover:shadow-card focus:border-border-emphasis focus:bg-muted-muted active:border-border-emphasis active:bg-muted-muted active:text-text-positive disabled:pointer-events-none disabled:cursor-default disabled:opacity-60 [&_svg]:size-3.5',\n        className\n      )}\n      onClick={onClick}\n      {...props}\n    >\n      {children}\n    </button>\n  );\n};\n\n/**\n * Grouped action buttons (create, refresh, download) displayed in the table\n * toolbar.\n *\n * Each button is disabled automatically when the corresponding handler prop is\n * omitted, so only the actions relevant to a given table need to be provided.\n * A toggle for `UITableSummaryBar` appears automatically when `summary` is\n * non-empty, and a toggle for `UITableAnalysisPanel` appears when\n * `showAnalysisPanel` is `true` (both set on `UITableProvider`).\n * `onCreateMultiple` renders a separate \"bulk create\" button next to the\n * single-item create button; omit it to hide the button entirely.\n *\n * @example\n * ```tsx\n * import { UITableTooltipActions } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableTooltipActions\n *   onCreate={() => setOpenCreate(true)}\n *   onCreateMultiple={() => setOpenBulkCreate(true)}\n *   onRefresh={() => refetch()}\n * />\n * ```\n */\nexport const UITableTooltipActions: React.FC<{\n  onCreate?: () => void;\n  onCreateMultiple?: () => void;\n  onRefresh?: () => void;\n  onDownload?: () => void;\n}> = ({ onCreate, onCreateMultiple, onDownload, onRefresh }) => {\n  const { table, csvData, csvFileName, title, showAnalysisPanel, summary } = useUITableContext();\n  const { isOpen: isAnalysisOpen, toggle: toggleAnalysis } = useUITableAnalysisContext();\n  const { isOpen: isSummaryOpen, toggle: toggleSummary } = useUITableSummaryContext();\n\n  const handleDownload = useCallback(() => {\n    if (onDownload) {\n      onDownload();\n      return;\n    }\n    if (!csvData || csvData.length === 0) return;\n    const selectedRows = table.getSelectedRowModel().flatRows;\n    const rows = selectedRows.length > 0 ? selectedRows.map(row => csvData[row.index]).filter(Boolean) : csvData;\n    downloadCsv(rows, csvFileName || title);\n  }, [onDownload, csvData, csvFileName, table, title]);\n\n  const isDownloadEnabled = !!(onDownload || (csvData && csvData.length > 0));\n\n  return (\n    <div className=\"flex [&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none\">\n      <ActionButton\n        disabled={!onCreate}\n        aria-label=\"Tạo mới\"\n        onClick={e => {\n          onCreate?.();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <CirclePlus />\n      </ActionButton>\n      <ActionButton\n        disabled={!onCreateMultiple}\n        aria-label=\"Tạo nhiều\"\n        onClick={e => {\n          onCreateMultiple?.();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <CopyPlusIcon />\n      </ActionButton>\n      <ActionButton\n        disabled={!onRefresh}\n        aria-label=\"Làm mới\"\n        onClick={e => {\n          onRefresh?.();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <RefreshCwIcon />\n      </ActionButton>\n      <ActionButton\n        disabled={!isDownloadEnabled}\n        aria-label=\"Tải xuống\"\n        onClick={e => {\n          handleDownload();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <DownloadIcon />\n      </ActionButton>\n      {summary && summary.length > 0 && (\n        <ActionButton\n          onClick={e => {\n            toggleSummary();\n            e.stopPropagation();\n            e.preventDefault();\n          }}\n          aria-pressed={isSummaryOpen}\n          aria-label={isSummaryOpen ? 'Ẩn tổng quan' : 'Hiện tổng quan'}\n          className={isSummaryOpen ? 'bg-muted-muted text-text-positive' : undefined}\n        >\n          <LayoutDashboardIcon />\n        </ActionButton>\n      )}\n      {showAnalysisPanel && (\n        <ActionButton\n          onClick={e => {\n            toggleAnalysis();\n            e.stopPropagation();\n            e.preventDefault();\n          }}\n          aria-pressed={isAnalysisOpen}\n          className={isAnalysisOpen ? 'bg-muted-muted text-text-positive' : undefined}\n        >\n          <BarChart2Icon />\n        </ActionButton>\n      )}\n    </div>\n  );\n};\n\n/**\n * Outer toolbar shell for the UITable component.\n *\n * Reads the table `title` from `UITableContext` and renders it as a heading\n * above the `children` slot, which typically contains a\n * `UITableTooltipFilter` and/or `UITableTooltipActions`.\n *\n * @example\n * ```tsx\n * import {\n *   UITableTooltip,\n *   UITableTooltipFilter,\n *   UITableTooltipActions,\n * } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableTooltip>\n *   <UITableTooltipFilter onSearch={setQuery} />\n *   <UITableTooltipActions onCreate={handleCreate} onRefresh={refetch} />\n * </UITableTooltip>\n * ```\n */\nexport const UITableTooltip: React.FC<React.PropsWithChildren> = ({ children }) => {\n  const { title, description, headerActions } = useUITableContext();\n  return (\n    <div data-slot=\"table-tooltip\" className=\"relative grid w-full grid-cols-1 gap-2 px-2 py-0 text-sm\">\n      <div className=\"grid w-full grid-cols-[1fr_auto] items-start gap-4\">\n        <div className=\"grid grid-cols-1 gap-0.5\">\n          <h3 className=\"font-semibold text-base text-text-positive\">{title}</h3>\n          {!!description && <p className=\"text-muted-foreground text-sm\">{description}</p>}\n        </div>\n        {!!headerActions && <div className=\"flex shrink-0 items-center gap-2\">{headerActions}</div>}\n      </div>\n      <div className=\"grid w-full grid-cols-[1fr_auto] gap-x-2\">{children}</div>\n    </div>\n  );\n};\nUITableTooltip.displayName = 'UITableTooltip';\n"],"mappings":"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"}

package/dist/ui/badge.cjs

@@ -1,2 +1,2 @@
-"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("@customafk/react-toolkit/utils"),t=require("class-variance-authority"),n=require("react/jsx-runtime");const r=(0,t.cva)(`inline-flex items-center justify-center font-medium transition-colors duration-150 focus:ring-2 focus:ring-offset-2 focus:outline-hidden focus:ring-ring forced-colors:outline`,{variants:{variant:{solid:`shadow-btn`,soft:``,outline:`bg-transparent border`},color:{primary:``,secondary:``,muted:``,accent:``,info:``,success:``,warning:``,danger:``},size:{xs:`text-[10px]/3 px-1.5 py-0.5 gap-1`,sm:`text-xs px-2 py-0.5 gap-1`,md:`text-sm px-2.5 py-0.5 gap-1.5`,lg:`text-base px-3 py-1 gap-1.5`,xl:`text-lg px-3.5 py-1 gap-1.5`},pill:{true:`rounded-full`,false:`rounded`}},defaultVariants:{variant:`solid`,color:`primary`,size:`md`,pill:!0},compoundVariants:[{variant:`solid`,color:`primary`,className:`bg-primary text-primary-foreground`},{variant:`solid`,color:`secondary`,className:`bg-secondary text-secondary-foreground`},{variant:`solid`,color:`muted`,className:`bg-muted text-text-negative`},{variant:`solid`,color:`accent`,className:`bg-accent text-text-negative`},{variant:`solid`,color:`info`,className:`bg-info text-info-foreground`},{variant:`solid`,color:`success`,className:`bg-success text-success-foreground`},{variant:`solid`,color:`warning`,className:`bg-warning text-text-negative`},{variant:`solid`,color:`danger`,className:`bg-danger text-danger-foreground`},{variant:`soft`,color:`primary`,className:`bg-primary-bg-subtle text-primary-intense`},{variant:`soft`,color:`secondary`,className:`bg-secondary-bg-subtle text-secondary-intense`},{variant:`soft`,color:`muted`,className:`bg-muted-bg-subtle text-muted-intense`},{variant:`soft`,color:`accent`,className:`bg-accent-bg-subtle text-accent-intense`},{variant:`soft`,color:`info`,className:`bg-info-bg-subtle text-info-intense`},{variant:`soft`,color:`success`,className:`bg-success-bg-subtle text-success-intense`},{variant:`soft`,color:`warning`,className:`bg-warning-bg-subtle text-warning-intense`},{variant:`soft`,color:`danger`,className:`bg-danger-bg-subtle text-danger-intense`},{variant:`outline`,color:`primary`,className:`border-primary text-primary`},{variant:`outline`,color:`secondary`,className:`border-secondary text-secondary`},{variant:`outline`,color:`muted`,className:`border-muted text-muted`},{variant:`outline`,color:`accent`,className:`border-accent text-accent`},{variant:`outline`,color:`info`,className:`border-info text-info`},{variant:`outline`,color:`success`,className:`border-success text-success`},{variant:`outline`,color:`warning`,className:`border-warning text-warning`},{variant:`outline`,color:`danger`,className:`border-danger text-danger`}]});function i({className:t,variant:i,color:a,size:o,pill:s,...c}){return(0,n.jsx)(`span`,{className:(0,e.cn)(r({variant:i,color:a,pill:s,size:o}),t),...c})}exports.Badge=i,exports.badgeVariants=r;
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("@customafk/react-toolkit/utils"),t=require("class-variance-authority"),n=require("react/jsx-runtime");const r=(0,t.cva)(`inline-flex items-center justify-center font-medium transition-colors duration-150 focus:ring-2 focus:ring-offset-2 focus:outline-hidden focus:ring-ring forced-colors:outline`,{variants:{variant:{solid:`shadow-btn`,soft:``,outline:`bg-transparent border`},color:{primary:``,secondary:``,muted:``,accent:``,info:``,success:``,warning:``,danger:``},size:{xs:`text-[10px]/3 px-1.5 py-0.5 gap-1`,sm:`text-xs px-2 py-0.5 gap-1`,md:`text-sm px-2.5 py-0.5 gap-1.5`,lg:`text-base px-3 py-1 gap-1.5`,xl:`text-lg px-3.5 py-1 gap-1.5`},pill:{true:`rounded-full`,false:`rounded`}},defaultVariants:{variant:`solid`,color:`primary`,size:`md`,pill:!0},compoundVariants:[{variant:`solid`,color:`primary`,className:`bg-primary text-primary-foreground`},{variant:`solid`,color:`secondary`,className:`bg-secondary text-secondary-foreground`},{variant:`solid`,color:`muted`,className:`bg-muted text-text-negative`},{variant:`solid`,color:`accent`,className:`bg-accent text-text-negative`},{variant:`solid`,color:`info`,className:`bg-info text-info-foreground`},{variant:`solid`,color:`success`,className:`bg-success text-success-foreground`},{variant:`solid`,color:`warning`,className:`bg-warning text-text-negative`},{variant:`solid`,color:`danger`,className:`bg-danger text-danger-foreground`},{variant:`soft`,color:`primary`,className:`bg-primary-bg-subtle text-primary-intense`},{variant:`soft`,color:`secondary`,className:`bg-secondary-bg-subtle text-secondary-intense`},{variant:`soft`,color:`muted`,className:`bg-muted-bg-subtle text-muted-intense`},{variant:`soft`,color:`accent`,className:`bg-accent-bg-subtle text-accent-intense`},{variant:`soft`,color:`info`,className:`bg-info-bg-subtle text-info-intense`},{variant:`soft`,color:`success`,className:`bg-success-bg-subtle text-success-intense`},{variant:`soft`,color:`warning`,className:`bg-warning-bg-subtle text-warning-intense`},{variant:`soft`,color:`danger`,className:`bg-danger-bg-subtle text-danger-intense`},{variant:`outline`,color:`primary`,className:`border-primary text-primary`},{variant:`outline`,color:`secondary`,className:`border-secondary text-secondary`},{variant:`outline`,color:`muted`,className:`border-muted text-muted`},{variant:`outline`,color:`accent`,className:`border-accent text-accent`},{variant:`outline`,color:`info`,className:`border-info text-info`},{variant:`outline`,color:`success`,className:`border-success text-success`},{variant:`outline`,color:`warning`,className:`border-warning text-warning`},{variant:`outline`,color:`danger`,className:`border-danger text-danger`}]});function i({className:t,variant:i,color:a,size:o,pill:s,...c}){return(0,n.jsx)(`span`,{className:(0,e.cn)(r({variant:i,color:a,pill:s,size:o}),t),...c})}const a=(0,t.cva)(`inline-block size-1.5 shrink-0 rounded-full`,{variants:{color:{primary:`bg-primary`,secondary:`bg-secondary`,muted:`bg-muted`,accent:`bg-accent`,info:`bg-info`,success:`bg-success`,warning:`bg-warning`,danger:`bg-danger`}},defaultVariants:{color:`primary`}});exports.Badge=i,exports.badgeDotVariants=a,exports.badgeVariants=r;
 //# sourceMappingURL=badge.cjs.map

package/dist/ui/badge.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"badge.cjs","names":[],"sources":["../../packages/components/ui/badge.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nconst badgeVariants = cva(\n  'inline-flex items-center justify-center font-medium transition-colors duration-150 focus:ring-2 focus:ring-offset-2 focus:outline-hidden focus:ring-ring forced-colors:outline',\n  {\n    variants: {\n      variant: {\n        solid: 'shadow-btn',\n        soft: '',\n        outline: 'bg-transparent border',\n      },\n      color: {\n        primary: '',\n        secondary: '',\n        muted: '',\n        accent: '',\n        info: '',\n        success: '',\n        warning: '',\n        danger: '',\n      },\n      size: {\n        xs: 'text-[10px]/3 px-1.5 py-0.5 gap-1',\n        sm: 'text-xs px-2 py-0.5 gap-1',\n        md: 'text-sm px-2.5 py-0.5 gap-1.5',\n        lg: 'text-base px-3 py-1 gap-1.5',\n        xl: 'text-lg px-3.5 py-1 gap-1.5',\n      },\n      pill: {\n        true: 'rounded-full',\n        false: 'rounded',\n      },\n    },\n    defaultVariants: {\n      variant: 'solid',\n      color: 'primary',\n      size: 'md',\n      pill: true,\n    },\n    compoundVariants: [\n      // solid\n      { variant: 'solid', color: 'primary', className: 'bg-primary text-primary-foreground' },\n      { variant: 'solid', color: 'secondary', className: 'bg-secondary text-secondary-foreground' },\n      { variant: 'solid', color: 'muted', className: 'bg-muted text-text-negative' },\n      { variant: 'solid', color: 'accent', className: 'bg-accent text-text-negative' },\n      { variant: 'solid', color: 'info', className: 'bg-info text-info-foreground' },\n      { variant: 'solid', color: 'success', className: 'bg-success text-success-foreground' },\n      { variant: 'solid', color: 'warning', className: 'bg-warning text-text-negative' },\n      { variant: 'solid', color: 'danger', className: 'bg-danger text-danger-foreground' },\n      // soft\n      { variant: 'soft', color: 'primary', className: 'bg-primary-bg-subtle text-primary-intense' },\n      { variant: 'soft', color: 'secondary', className: 'bg-secondary-bg-subtle text-secondary-intense' },\n      { variant: 'soft', color: 'muted', className: 'bg-muted-bg-subtle text-muted-intense' },\n      { variant: 'soft', color: 'accent', className: 'bg-accent-bg-subtle text-accent-intense' },\n      { variant: 'soft', color: 'info', className: 'bg-info-bg-subtle text-info-intense' },\n      { variant: 'soft', color: 'success', className: 'bg-success-bg-subtle text-success-intense' },\n      { variant: 'soft', color: 'warning', className: 'bg-warning-bg-subtle text-warning-intense' },\n      { variant: 'soft', color: 'danger', className: 'bg-danger-bg-subtle text-danger-intense' },\n      // outline\n      { variant: 'outline', color: 'primary', className: 'border-primary text-primary' },\n      { variant: 'outline', color: 'secondary', className: 'border-secondary text-secondary' },\n      { variant: 'outline', color: 'muted', className: 'border-muted text-muted' },\n      { variant: 'outline', color: 'accent', className: 'border-accent text-accent' },\n      { variant: 'outline', color: 'info', className: 'border-info text-info' },\n      { variant: 'outline', color: 'success', className: 'border-success text-success' },\n      { variant: 'outline', color: 'warning', className: 'border-warning text-warning' },\n      { variant: 'outline', color: 'danger', className: 'border-danger text-danger' },\n    ],\n  }\n);\n\n/**\n * Props for the `Badge` component.\n *\n * @property variant - Visual fill style — `'solid'` (filled, default), `'soft'` (tinted background), or `'outline'` (border only).\n * @property color - Semantic color token — `'primary'` | `'secondary'` | `'muted'` | `'accent'` | `'info'` | `'success'` | `'warning'` | `'danger'`. Defaults to `'primary'`.\n * @property size - Badge size — `'xs'` | `'sm'` | `'md'` (default) | `'lg'` | `'xl'`.\n * @property pill - When `true` (default), renders with fully rounded corners (`rounded-full`); when `false`, uses `rounded-sm`.\n */\nexport type BadgeProps = VariantProps<typeof badgeVariants> & React.ComponentPropsWithoutRef<'span'>;\n\n/**\n * Inline status label rendered as a `<span>` with CVA-driven variant, color, size, and shape options.\n *\n * @example\n * ```tsx\n * import { Badge } from '@customafk/lunas-ui/ui/badge';\n *\n * <Badge variant=\"soft\" color=\"success\" size=\"sm\">Active</Badge>\n * <Badge variant=\"outline\" color=\"danger\">Overdue</Badge>\n * ```\n */\nfunction Badge({ className, variant, color, size, pill, ...props }: BadgeProps) {\n  return <span className={cn(badgeVariants({ variant, color, pill, size }), className)} {...props} />;\n}\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport { Badge, badgeVariants };\n"],"mappings":"qMAMA,MAAM,GAAA,EAAA,EAAA,IAAA,CACJ,iLACA,CACE,SAAU,CACR,QAAS,CACP,MAAO,aACP,KAAM,GACN,QAAS,uBACX,EACA,MAAO,CACL,QAAS,GACT,UAAW,GACX,MAAO,GACP,OAAQ,GACR,KAAM,GACN,QAAS,GACT,QAAS,GACT,OAAQ,EACV,EACA,KAAM,CACJ,GAAI,oCACJ,GAAI,4BACJ,GAAI,gCACJ,GAAI,8BACJ,GAAI,6BACN,EACA,KAAM,CACJ,KAAM,eACN,MAAO,SACT,CACF,EACA,gBAAiB,CACf,QAAS,QACT,MAAO,UACP,KAAM,KACN,KAAM,EACR,EACA,iBAAkB,CAEhB,CAAE,QAAS,QAAS,MAAO,UAAW,UAAW,oCAAqC,EACtF,CAAE,QAAS,QAAS,MAAO,YAAa,UAAW,wCAAyC,EAC5F,CAAE,QAAS,QAAS,MAAO,QAAS,UAAW,6BAA8B,EAC7E,CAAE,QAAS,QAAS,MAAO,SAAU,UAAW,8BAA+B,EAC/E,CAAE,QAAS,QAAS,MAAO,OAAQ,UAAW,8BAA+B,EAC7E,CAAE,QAAS,QAAS,MAAO,UAAW,UAAW,oCAAqC,EACtF,CAAE,QAAS,QAAS,MAAO,UAAW,UAAW,+BAAgC,EACjF,CAAE,QAAS,QAAS,MAAO,SAAU,UAAW,kCAAmC,EAEnF,CAAE,QAAS,OAAQ,MAAO,UAAW,UAAW,2CAA4C,EAC5F,CAAE,QAAS,OAAQ,MAAO,YAAa,UAAW,+CAAgD,EAClG,CAAE,QAAS,OAAQ,MAAO,QAAS,UAAW,uCAAwC,EACtF,CAAE,QAAS,OAAQ,MAAO,SAAU,UAAW,yCAA0C,EACzF,CAAE,QAAS,OAAQ,MAAO,OAAQ,UAAW,qCAAsC,EACnF,CAAE,QAAS,OAAQ,MAAO,UAAW,UAAW,2CAA4C,EAC5F,CAAE,QAAS,OAAQ,MAAO,UAAW,UAAW,2CAA4C,EAC5F,CAAE,QAAS,OAAQ,MAAO,SAAU,UAAW,yCAA0C,EAEzF,CAAE,QAAS,UAAW,MAAO,UAAW,UAAW,6BAA8B,EACjF,CAAE,QAAS,UAAW,MAAO,YAAa,UAAW,iCAAkC,EACvF,CAAE,QAAS,UAAW,MAAO,QAAS,UAAW,yBAA0B,EAC3E,CAAE,QAAS,UAAW,MAAO,SAAU,UAAW,2BAA4B,EAC9E,CAAE,QAAS,UAAW,MAAO,OAAQ,UAAW,uBAAwB,EACxE,CAAE,QAAS,UAAW,MAAO,UAAW,UAAW,6BAA8B,EACjF,CAAE,QAAS,UAAW,MAAO,UAAW,UAAW,6BAA8B,EACjF,CAAE,QAAS,UAAW,MAAO,SAAU,UAAW,2BAA4B,CAChF,CACF,CACF,EAuBA,SAAS,EAAM,CAAE,YAAW,UAAS,QAAO,OAAM,OAAM,GAAG,GAAqB,CAC9E,OAAO,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,WAAA,EAAA,EAAA,GAAA,CAAc,EAAc,CAAE,UAAS,QAAO,OAAM,MAAK,CAAC,EAAG,CAAS,EAAG,GAAI,CAAQ,CAAA,CACpG"}
+{"version":3,"file":"badge.cjs","names":[],"sources":["../../packages/components/ui/badge.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nconst badgeVariants = cva(\n  'inline-flex items-center justify-center font-medium transition-colors duration-150 focus:ring-2 focus:ring-offset-2 focus:outline-hidden focus:ring-ring forced-colors:outline',\n  {\n    variants: {\n      variant: {\n        solid: 'shadow-btn',\n        soft: '',\n        outline: 'bg-transparent border',\n      },\n      color: {\n        primary: '',\n        secondary: '',\n        muted: '',\n        accent: '',\n        info: '',\n        success: '',\n        warning: '',\n        danger: '',\n      },\n      size: {\n        xs: 'text-[10px]/3 px-1.5 py-0.5 gap-1',\n        sm: 'text-xs px-2 py-0.5 gap-1',\n        md: 'text-sm px-2.5 py-0.5 gap-1.5',\n        lg: 'text-base px-3 py-1 gap-1.5',\n        xl: 'text-lg px-3.5 py-1 gap-1.5',\n      },\n      pill: {\n        true: 'rounded-full',\n        false: 'rounded',\n      },\n    },\n    defaultVariants: {\n      variant: 'solid',\n      color: 'primary',\n      size: 'md',\n      pill: true,\n    },\n    compoundVariants: [\n      // solid\n      { variant: 'solid', color: 'primary', className: 'bg-primary text-primary-foreground' },\n      { variant: 'solid', color: 'secondary', className: 'bg-secondary text-secondary-foreground' },\n      { variant: 'solid', color: 'muted', className: 'bg-muted text-text-negative' },\n      { variant: 'solid', color: 'accent', className: 'bg-accent text-text-negative' },\n      { variant: 'solid', color: 'info', className: 'bg-info text-info-foreground' },\n      { variant: 'solid', color: 'success', className: 'bg-success text-success-foreground' },\n      { variant: 'solid', color: 'warning', className: 'bg-warning text-text-negative' },\n      { variant: 'solid', color: 'danger', className: 'bg-danger text-danger-foreground' },\n      // soft\n      { variant: 'soft', color: 'primary', className: 'bg-primary-bg-subtle text-primary-intense' },\n      { variant: 'soft', color: 'secondary', className: 'bg-secondary-bg-subtle text-secondary-intense' },\n      { variant: 'soft', color: 'muted', className: 'bg-muted-bg-subtle text-muted-intense' },\n      { variant: 'soft', color: 'accent', className: 'bg-accent-bg-subtle text-accent-intense' },\n      { variant: 'soft', color: 'info', className: 'bg-info-bg-subtle text-info-intense' },\n      { variant: 'soft', color: 'success', className: 'bg-success-bg-subtle text-success-intense' },\n      { variant: 'soft', color: 'warning', className: 'bg-warning-bg-subtle text-warning-intense' },\n      { variant: 'soft', color: 'danger', className: 'bg-danger-bg-subtle text-danger-intense' },\n      // outline\n      { variant: 'outline', color: 'primary', className: 'border-primary text-primary' },\n      { variant: 'outline', color: 'secondary', className: 'border-secondary text-secondary' },\n      { variant: 'outline', color: 'muted', className: 'border-muted text-muted' },\n      { variant: 'outline', color: 'accent', className: 'border-accent text-accent' },\n      { variant: 'outline', color: 'info', className: 'border-info text-info' },\n      { variant: 'outline', color: 'success', className: 'border-success text-success' },\n      { variant: 'outline', color: 'warning', className: 'border-warning text-warning' },\n      { variant: 'outline', color: 'danger', className: 'border-danger text-danger' },\n    ],\n  }\n);\n\n/**\n * Props for the `Badge` component.\n *\n * @property variant - Visual fill style — `'solid'` (filled, default), `'soft'` (tinted background), or `'outline'` (border only).\n * @property color - Semantic color token — `'primary'` | `'secondary'` | `'muted'` | `'accent'` | `'info'` | `'success'` | `'warning'` | `'danger'`. Defaults to `'primary'`.\n * @property size - Badge size — `'xs'` | `'sm'` | `'md'` (default) | `'lg'` | `'xl'`.\n * @property pill - When `true` (default), renders with fully rounded corners (`rounded-full`); when `false`, uses `rounded-sm`.\n */\nexport type BadgeProps = VariantProps<typeof badgeVariants> & React.ComponentPropsWithoutRef<'span'>;\n\n/**\n * Inline status label rendered as a `<span>` with CVA-driven variant, color, size, and shape options.\n *\n * @example\n * ```tsx\n * import { Badge } from '@customafk/lunas-ui/ui/badge';\n *\n * <Badge variant=\"soft\" color=\"success\" size=\"sm\">Active</Badge>\n * <Badge variant=\"outline\" color=\"danger\">Overdue</Badge>\n * ```\n */\nfunction Badge({ className, variant, color, size, pill, ...props }: BadgeProps) {\n  return <span className={cn(badgeVariants({ variant, color, pill, size }), className)} {...props} />;\n}\n\n/**\n * Dot indicator fill color, keyed by the same `color` union as `badgeVariants`, so the palette\n * has a single home instead of being re-declared by each consumer that pairs a status dot with a Badge.\n */\nexport const badgeDotVariants = cva('inline-block size-1.5 shrink-0 rounded-full', {\n  variants: {\n    color: {\n      primary: 'bg-primary',\n      secondary: 'bg-secondary',\n      muted: 'bg-muted',\n      accent: 'bg-accent',\n      info: 'bg-info',\n      success: 'bg-success',\n      warning: 'bg-warning',\n      danger: 'bg-danger',\n    },\n  },\n  defaultVariants: {\n    color: 'primary',\n  },\n});\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport { Badge, badgeVariants };\n"],"mappings":"qMAMA,MAAM,GAAA,EAAA,EAAA,IAAA,CACJ,iLACA,CACE,SAAU,CACR,QAAS,CACP,MAAO,aACP,KAAM,GACN,QAAS,uBACX,EACA,MAAO,CACL,QAAS,GACT,UAAW,GACX,MAAO,GACP,OAAQ,GACR,KAAM,GACN,QAAS,GACT,QAAS,GACT,OAAQ,EACV,EACA,KAAM,CACJ,GAAI,oCACJ,GAAI,4BACJ,GAAI,gCACJ,GAAI,8BACJ,GAAI,6BACN,EACA,KAAM,CACJ,KAAM,eACN,MAAO,SACT,CACF,EACA,gBAAiB,CACf,QAAS,QACT,MAAO,UACP,KAAM,KACN,KAAM,EACR,EACA,iBAAkB,CAEhB,CAAE,QAAS,QAAS,MAAO,UAAW,UAAW,oCAAqC,EACtF,CAAE,QAAS,QAAS,MAAO,YAAa,UAAW,wCAAyC,EAC5F,CAAE,QAAS,QAAS,MAAO,QAAS,UAAW,6BAA8B,EAC7E,CAAE,QAAS,QAAS,MAAO,SAAU,UAAW,8BAA+B,EAC/E,CAAE,QAAS,QAAS,MAAO,OAAQ,UAAW,8BAA+B,EAC7E,CAAE,QAAS,QAAS,MAAO,UAAW,UAAW,oCAAqC,EACtF,CAAE,QAAS,QAAS,MAAO,UAAW,UAAW,+BAAgC,EACjF,CAAE,QAAS,QAAS,MAAO,SAAU,UAAW,kCAAmC,EAEnF,CAAE,QAAS,OAAQ,MAAO,UAAW,UAAW,2CAA4C,EAC5F,CAAE,QAAS,OAAQ,MAAO,YAAa,UAAW,+CAAgD,EAClG,CAAE,QAAS,OAAQ,MAAO,QAAS,UAAW,uCAAwC,EACtF,CAAE,QAAS,OAAQ,MAAO,SAAU,UAAW,yCAA0C,EACzF,CAAE,QAAS,OAAQ,MAAO,OAAQ,UAAW,qCAAsC,EACnF,CAAE,QAAS,OAAQ,MAAO,UAAW,UAAW,2CAA4C,EAC5F,CAAE,QAAS,OAAQ,MAAO,UAAW,UAAW,2CAA4C,EAC5F,CAAE,QAAS,OAAQ,MAAO,SAAU,UAAW,yCAA0C,EAEzF,CAAE,QAAS,UAAW,MAAO,UAAW,UAAW,6BAA8B,EACjF,CAAE,QAAS,UAAW,MAAO,YAAa,UAAW,iCAAkC,EACvF,CAAE,QAAS,UAAW,MAAO,QAAS,UAAW,yBAA0B,EAC3E,CAAE,QAAS,UAAW,MAAO,SAAU,UAAW,2BAA4B,EAC9E,CAAE,QAAS,UAAW,MAAO,OAAQ,UAAW,uBAAwB,EACxE,CAAE,QAAS,UAAW,MAAO,UAAW,UAAW,6BAA8B,EACjF,CAAE,QAAS,UAAW,MAAO,UAAW,UAAW,6BAA8B,EACjF,CAAE,QAAS,UAAW,MAAO,SAAU,UAAW,2BAA4B,CAChF,CACF,CACF,EAuBA,SAAS,EAAM,CAAE,YAAW,UAAS,QAAO,OAAM,OAAM,GAAG,GAAqB,CAC9E,OAAO,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,WAAA,EAAA,EAAA,GAAA,CAAc,EAAc,CAAE,UAAS,QAAO,OAAM,MAAK,CAAC,EAAG,CAAS,EAAG,GAAI,CAAQ,CAAA,CACpG,CAMA,MAAa,GAAA,EAAA,EAAA,IAAA,CAAuB,8CAA+C,CACjF,SAAU,CACR,MAAO,CACL,QAAS,aACT,UAAW,eACX,MAAO,WACP,OAAQ,YACR,KAAM,UACN,QAAS,aACT,QAAS,aACT,OAAQ,WACV,CACF,EACA,gBAAiB,CACf,MAAO,SACT,CACF,CAAC"}

package/dist/ui/badge.d.cts

@@ -1,2 +1,2 @@
-import { n as BadgeProps, r as badgeVariants, t as Badge } from "../badge-BPiU1Ss2.cjs";
-export { Badge, BadgeProps, badgeVariants };
+import { i as badgeVariants, n as BadgeProps, r as badgeDotVariants, t as Badge } from "../badge-C_NPjGXe.cjs";
+export { Badge, BadgeProps, badgeDotVariants, badgeVariants };

package/dist/ui/badge.d.mts

@@ -1,2 +1,2 @@
-import { n as BadgeProps, r as badgeVariants, t as Badge } from "../badge-BPiU1Ss2.mjs";
-export { Badge, BadgeProps, badgeVariants };
+import { i as badgeVariants, n as BadgeProps, r as badgeDotVariants, t as Badge } from "../badge-C_NPjGXe.mjs";
+export { Badge, BadgeProps, badgeDotVariants, badgeVariants };

package/dist/ui/badge.mjs

@@ -1,2 +1,2 @@
-"use client";import{cn as e}from"@customafk/react-toolkit/utils";import{cva as t}from"class-variance-authority";import{jsx as n}from"react/jsx-runtime";const r=t(`inline-flex items-center justify-center font-medium transition-colors duration-150 focus:ring-2 focus:ring-offset-2 focus:outline-hidden focus:ring-ring forced-colors:outline`,{variants:{variant:{solid:`shadow-btn`,soft:``,outline:`bg-transparent border`},color:{primary:``,secondary:``,muted:``,accent:``,info:``,success:``,warning:``,danger:``},size:{xs:`text-[10px]/3 px-1.5 py-0.5 gap-1`,sm:`text-xs px-2 py-0.5 gap-1`,md:`text-sm px-2.5 py-0.5 gap-1.5`,lg:`text-base px-3 py-1 gap-1.5`,xl:`text-lg px-3.5 py-1 gap-1.5`},pill:{true:`rounded-full`,false:`rounded`}},defaultVariants:{variant:`solid`,color:`primary`,size:`md`,pill:!0},compoundVariants:[{variant:`solid`,color:`primary`,className:`bg-primary text-primary-foreground`},{variant:`solid`,color:`secondary`,className:`bg-secondary text-secondary-foreground`},{variant:`solid`,color:`muted`,className:`bg-muted text-text-negative`},{variant:`solid`,color:`accent`,className:`bg-accent text-text-negative`},{variant:`solid`,color:`info`,className:`bg-info text-info-foreground`},{variant:`solid`,color:`success`,className:`bg-success text-success-foreground`},{variant:`solid`,color:`warning`,className:`bg-warning text-text-negative`},{variant:`solid`,color:`danger`,className:`bg-danger text-danger-foreground`},{variant:`soft`,color:`primary`,className:`bg-primary-bg-subtle text-primary-intense`},{variant:`soft`,color:`secondary`,className:`bg-secondary-bg-subtle text-secondary-intense`},{variant:`soft`,color:`muted`,className:`bg-muted-bg-subtle text-muted-intense`},{variant:`soft`,color:`accent`,className:`bg-accent-bg-subtle text-accent-intense`},{variant:`soft`,color:`info`,className:`bg-info-bg-subtle text-info-intense`},{variant:`soft`,color:`success`,className:`bg-success-bg-subtle text-success-intense`},{variant:`soft`,color:`warning`,className:`bg-warning-bg-subtle text-warning-intense`},{variant:`soft`,color:`danger`,className:`bg-danger-bg-subtle text-danger-intense`},{variant:`outline`,color:`primary`,className:`border-primary text-primary`},{variant:`outline`,color:`secondary`,className:`border-secondary text-secondary`},{variant:`outline`,color:`muted`,className:`border-muted text-muted`},{variant:`outline`,color:`accent`,className:`border-accent text-accent`},{variant:`outline`,color:`info`,className:`border-info text-info`},{variant:`outline`,color:`success`,className:`border-success text-success`},{variant:`outline`,color:`warning`,className:`border-warning text-warning`},{variant:`outline`,color:`danger`,className:`border-danger text-danger`}]});function i({className:t,variant:i,color:a,size:o,pill:s,...c}){return n(`span`,{className:e(r({variant:i,color:a,pill:s,size:o}),t),...c})}export{i as Badge,r as badgeVariants};
+"use client";import{cn as e}from"@customafk/react-toolkit/utils";import{cva as t}from"class-variance-authority";import{jsx as n}from"react/jsx-runtime";const r=t(`inline-flex items-center justify-center font-medium transition-colors duration-150 focus:ring-2 focus:ring-offset-2 focus:outline-hidden focus:ring-ring forced-colors:outline`,{variants:{variant:{solid:`shadow-btn`,soft:``,outline:`bg-transparent border`},color:{primary:``,secondary:``,muted:``,accent:``,info:``,success:``,warning:``,danger:``},size:{xs:`text-[10px]/3 px-1.5 py-0.5 gap-1`,sm:`text-xs px-2 py-0.5 gap-1`,md:`text-sm px-2.5 py-0.5 gap-1.5`,lg:`text-base px-3 py-1 gap-1.5`,xl:`text-lg px-3.5 py-1 gap-1.5`},pill:{true:`rounded-full`,false:`rounded`}},defaultVariants:{variant:`solid`,color:`primary`,size:`md`,pill:!0},compoundVariants:[{variant:`solid`,color:`primary`,className:`bg-primary text-primary-foreground`},{variant:`solid`,color:`secondary`,className:`bg-secondary text-secondary-foreground`},{variant:`solid`,color:`muted`,className:`bg-muted text-text-negative`},{variant:`solid`,color:`accent`,className:`bg-accent text-text-negative`},{variant:`solid`,color:`info`,className:`bg-info text-info-foreground`},{variant:`solid`,color:`success`,className:`bg-success text-success-foreground`},{variant:`solid`,color:`warning`,className:`bg-warning text-text-negative`},{variant:`solid`,color:`danger`,className:`bg-danger text-danger-foreground`},{variant:`soft`,color:`primary`,className:`bg-primary-bg-subtle text-primary-intense`},{variant:`soft`,color:`secondary`,className:`bg-secondary-bg-subtle text-secondary-intense`},{variant:`soft`,color:`muted`,className:`bg-muted-bg-subtle text-muted-intense`},{variant:`soft`,color:`accent`,className:`bg-accent-bg-subtle text-accent-intense`},{variant:`soft`,color:`info`,className:`bg-info-bg-subtle text-info-intense`},{variant:`soft`,color:`success`,className:`bg-success-bg-subtle text-success-intense`},{variant:`soft`,color:`warning`,className:`bg-warning-bg-subtle text-warning-intense`},{variant:`soft`,color:`danger`,className:`bg-danger-bg-subtle text-danger-intense`},{variant:`outline`,color:`primary`,className:`border-primary text-primary`},{variant:`outline`,color:`secondary`,className:`border-secondary text-secondary`},{variant:`outline`,color:`muted`,className:`border-muted text-muted`},{variant:`outline`,color:`accent`,className:`border-accent text-accent`},{variant:`outline`,color:`info`,className:`border-info text-info`},{variant:`outline`,color:`success`,className:`border-success text-success`},{variant:`outline`,color:`warning`,className:`border-warning text-warning`},{variant:`outline`,color:`danger`,className:`border-danger text-danger`}]});function i({className:t,variant:i,color:a,size:o,pill:s,...c}){return n(`span`,{className:e(r({variant:i,color:a,pill:s,size:o}),t),...c})}const a=t(`inline-block size-1.5 shrink-0 rounded-full`,{variants:{color:{primary:`bg-primary`,secondary:`bg-secondary`,muted:`bg-muted`,accent:`bg-accent`,info:`bg-info`,success:`bg-success`,warning:`bg-warning`,danger:`bg-danger`}},defaultVariants:{color:`primary`}});export{i as Badge,a as badgeDotVariants,r as badgeVariants};
 //# sourceMappingURL=badge.mjs.map

package/dist/ui/badge.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"badge.mjs","names":[],"sources":["../../packages/components/ui/badge.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nconst badgeVariants = cva(\n  'inline-flex items-center justify-center font-medium transition-colors duration-150 focus:ring-2 focus:ring-offset-2 focus:outline-hidden focus:ring-ring forced-colors:outline',\n  {\n    variants: {\n      variant: {\n        solid: 'shadow-btn',\n        soft: '',\n        outline: 'bg-transparent border',\n      },\n      color: {\n        primary: '',\n        secondary: '',\n        muted: '',\n        accent: '',\n        info: '',\n        success: '',\n        warning: '',\n        danger: '',\n      },\n      size: {\n        xs: 'text-[10px]/3 px-1.5 py-0.5 gap-1',\n        sm: 'text-xs px-2 py-0.5 gap-1',\n        md: 'text-sm px-2.5 py-0.5 gap-1.5',\n        lg: 'text-base px-3 py-1 gap-1.5',\n        xl: 'text-lg px-3.5 py-1 gap-1.5',\n      },\n      pill: {\n        true: 'rounded-full',\n        false: 'rounded',\n      },\n    },\n    defaultVariants: {\n      variant: 'solid',\n      color: 'primary',\n      size: 'md',\n      pill: true,\n    },\n    compoundVariants: [\n      // solid\n      { variant: 'solid', color: 'primary', className: 'bg-primary text-primary-foreground' },\n      { variant: 'solid', color: 'secondary', className: 'bg-secondary text-secondary-foreground' },\n      { variant: 'solid', color: 'muted', className: 'bg-muted text-text-negative' },\n      { variant: 'solid', color: 'accent', className: 'bg-accent text-text-negative' },\n      { variant: 'solid', color: 'info', className: 'bg-info text-info-foreground' },\n      { variant: 'solid', color: 'success', className: 'bg-success text-success-foreground' },\n      { variant: 'solid', color: 'warning', className: 'bg-warning text-text-negative' },\n      { variant: 'solid', color: 'danger', className: 'bg-danger text-danger-foreground' },\n      // soft\n      { variant: 'soft', color: 'primary', className: 'bg-primary-bg-subtle text-primary-intense' },\n      { variant: 'soft', color: 'secondary', className: 'bg-secondary-bg-subtle text-secondary-intense' },\n      { variant: 'soft', color: 'muted', className: 'bg-muted-bg-subtle text-muted-intense' },\n      { variant: 'soft', color: 'accent', className: 'bg-accent-bg-subtle text-accent-intense' },\n      { variant: 'soft', color: 'info', className: 'bg-info-bg-subtle text-info-intense' },\n      { variant: 'soft', color: 'success', className: 'bg-success-bg-subtle text-success-intense' },\n      { variant: 'soft', color: 'warning', className: 'bg-warning-bg-subtle text-warning-intense' },\n      { variant: 'soft', color: 'danger', className: 'bg-danger-bg-subtle text-danger-intense' },\n      // outline\n      { variant: 'outline', color: 'primary', className: 'border-primary text-primary' },\n      { variant: 'outline', color: 'secondary', className: 'border-secondary text-secondary' },\n      { variant: 'outline', color: 'muted', className: 'border-muted text-muted' },\n      { variant: 'outline', color: 'accent', className: 'border-accent text-accent' },\n      { variant: 'outline', color: 'info', className: 'border-info text-info' },\n      { variant: 'outline', color: 'success', className: 'border-success text-success' },\n      { variant: 'outline', color: 'warning', className: 'border-warning text-warning' },\n      { variant: 'outline', color: 'danger', className: 'border-danger text-danger' },\n    ],\n  }\n);\n\n/**\n * Props for the `Badge` component.\n *\n * @property variant - Visual fill style — `'solid'` (filled, default), `'soft'` (tinted background), or `'outline'` (border only).\n * @property color - Semantic color token — `'primary'` | `'secondary'` | `'muted'` | `'accent'` | `'info'` | `'success'` | `'warning'` | `'danger'`. Defaults to `'primary'`.\n * @property size - Badge size — `'xs'` | `'sm'` | `'md'` (default) | `'lg'` | `'xl'`.\n * @property pill - When `true` (default), renders with fully rounded corners (`rounded-full`); when `false`, uses `rounded-sm`.\n */\nexport type BadgeProps = VariantProps<typeof badgeVariants> & React.ComponentPropsWithoutRef<'span'>;\n\n/**\n * Inline status label rendered as a `<span>` with CVA-driven variant, color, size, and shape options.\n *\n * @example\n * ```tsx\n * import { Badge } from '@customafk/lunas-ui/ui/badge';\n *\n * <Badge variant=\"soft\" color=\"success\" size=\"sm\">Active</Badge>\n * <Badge variant=\"outline\" color=\"danger\">Overdue</Badge>\n * ```\n */\nfunction Badge({ className, variant, color, size, pill, ...props }: BadgeProps) {\n  return <span className={cn(badgeVariants({ variant, color, pill, size }), className)} {...props} />;\n}\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport { Badge, badgeVariants };\n"],"mappings":"wJAMA,MAAM,EAAgB,EACpB,iLACA,CACE,SAAU,CACR,QAAS,CACP,MAAO,aACP,KAAM,GACN,QAAS,uBACX,EACA,MAAO,CACL,QAAS,GACT,UAAW,GACX,MAAO,GACP,OAAQ,GACR,KAAM,GACN,QAAS,GACT,QAAS,GACT,OAAQ,EACV,EACA,KAAM,CACJ,GAAI,oCACJ,GAAI,4BACJ,GAAI,gCACJ,GAAI,8BACJ,GAAI,6BACN,EACA,KAAM,CACJ,KAAM,eACN,MAAO,SACT,CACF,EACA,gBAAiB,CACf,QAAS,QACT,MAAO,UACP,KAAM,KACN,KAAM,EACR,EACA,iBAAkB,CAEhB,CAAE,QAAS,QAAS,MAAO,UAAW,UAAW,oCAAqC,EACtF,CAAE,QAAS,QAAS,MAAO,YAAa,UAAW,wCAAyC,EAC5F,CAAE,QAAS,QAAS,MAAO,QAAS,UAAW,6BAA8B,EAC7E,CAAE,QAAS,QAAS,MAAO,SAAU,UAAW,8BAA+B,EAC/E,CAAE,QAAS,QAAS,MAAO,OAAQ,UAAW,8BAA+B,EAC7E,CAAE,QAAS,QAAS,MAAO,UAAW,UAAW,oCAAqC,EACtF,CAAE,QAAS,QAAS,MAAO,UAAW,UAAW,+BAAgC,EACjF,CAAE,QAAS,QAAS,MAAO,SAAU,UAAW,kCAAmC,EAEnF,CAAE,QAAS,OAAQ,MAAO,UAAW,UAAW,2CAA4C,EAC5F,CAAE,QAAS,OAAQ,MAAO,YAAa,UAAW,+CAAgD,EAClG,CAAE,QAAS,OAAQ,MAAO,QAAS,UAAW,uCAAwC,EACtF,CAAE,QAAS,OAAQ,MAAO,SAAU,UAAW,yCAA0C,EACzF,CAAE,QAAS,OAAQ,MAAO,OAAQ,UAAW,qCAAsC,EACnF,CAAE,QAAS,OAAQ,MAAO,UAAW,UAAW,2CAA4C,EAC5F,CAAE,QAAS,OAAQ,MAAO,UAAW,UAAW,2CAA4C,EAC5F,CAAE,QAAS,OAAQ,MAAO,SAAU,UAAW,yCAA0C,EAEzF,CAAE,QAAS,UAAW,MAAO,UAAW,UAAW,6BAA8B,EACjF,CAAE,QAAS,UAAW,MAAO,YAAa,UAAW,iCAAkC,EACvF,CAAE,QAAS,UAAW,MAAO,QAAS,UAAW,yBAA0B,EAC3E,CAAE,QAAS,UAAW,MAAO,SAAU,UAAW,2BAA4B,EAC9E,CAAE,QAAS,UAAW,MAAO,OAAQ,UAAW,uBAAwB,EACxE,CAAE,QAAS,UAAW,MAAO,UAAW,UAAW,6BAA8B,EACjF,CAAE,QAAS,UAAW,MAAO,UAAW,UAAW,6BAA8B,EACjF,CAAE,QAAS,UAAW,MAAO,SAAU,UAAW,2BAA4B,CAChF,CACF,CACF,EAuBA,SAAS,EAAM,CAAE,YAAW,UAAS,QAAO,OAAM,OAAM,GAAG,GAAqB,CAC9E,OAAO,EAAC,OAAD,CAAM,UAAW,EAAG,EAAc,CAAE,UAAS,QAAO,OAAM,MAAK,CAAC,EAAG,CAAS,EAAG,GAAI,CAAQ,CAAA,CACpG"}
+{"version":3,"file":"badge.mjs","names":[],"sources":["../../packages/components/ui/badge.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nconst badgeVariants = cva(\n  'inline-flex items-center justify-center font-medium transition-colors duration-150 focus:ring-2 focus:ring-offset-2 focus:outline-hidden focus:ring-ring forced-colors:outline',\n  {\n    variants: {\n      variant: {\n        solid: 'shadow-btn',\n        soft: '',\n        outline: 'bg-transparent border',\n      },\n      color: {\n        primary: '',\n        secondary: '',\n        muted: '',\n        accent: '',\n        info: '',\n        success: '',\n        warning: '',\n        danger: '',\n      },\n      size: {\n        xs: 'text-[10px]/3 px-1.5 py-0.5 gap-1',\n        sm: 'text-xs px-2 py-0.5 gap-1',\n        md: 'text-sm px-2.5 py-0.5 gap-1.5',\n        lg: 'text-base px-3 py-1 gap-1.5',\n        xl: 'text-lg px-3.5 py-1 gap-1.5',\n      },\n      pill: {\n        true: 'rounded-full',\n        false: 'rounded',\n      },\n    },\n    defaultVariants: {\n      variant: 'solid',\n      color: 'primary',\n      size: 'md',\n      pill: true,\n    },\n    compoundVariants: [\n      // solid\n      { variant: 'solid', color: 'primary', className: 'bg-primary text-primary-foreground' },\n      { variant: 'solid', color: 'secondary', className: 'bg-secondary text-secondary-foreground' },\n      { variant: 'solid', color: 'muted', className: 'bg-muted text-text-negative' },\n      { variant: 'solid', color: 'accent', className: 'bg-accent text-text-negative' },\n      { variant: 'solid', color: 'info', className: 'bg-info text-info-foreground' },\n      { variant: 'solid', color: 'success', className: 'bg-success text-success-foreground' },\n      { variant: 'solid', color: 'warning', className: 'bg-warning text-text-negative' },\n      { variant: 'solid', color: 'danger', className: 'bg-danger text-danger-foreground' },\n      // soft\n      { variant: 'soft', color: 'primary', className: 'bg-primary-bg-subtle text-primary-intense' },\n      { variant: 'soft', color: 'secondary', className: 'bg-secondary-bg-subtle text-secondary-intense' },\n      { variant: 'soft', color: 'muted', className: 'bg-muted-bg-subtle text-muted-intense' },\n      { variant: 'soft', color: 'accent', className: 'bg-accent-bg-subtle text-accent-intense' },\n      { variant: 'soft', color: 'info', className: 'bg-info-bg-subtle text-info-intense' },\n      { variant: 'soft', color: 'success', className: 'bg-success-bg-subtle text-success-intense' },\n      { variant: 'soft', color: 'warning', className: 'bg-warning-bg-subtle text-warning-intense' },\n      { variant: 'soft', color: 'danger', className: 'bg-danger-bg-subtle text-danger-intense' },\n      // outline\n      { variant: 'outline', color: 'primary', className: 'border-primary text-primary' },\n      { variant: 'outline', color: 'secondary', className: 'border-secondary text-secondary' },\n      { variant: 'outline', color: 'muted', className: 'border-muted text-muted' },\n      { variant: 'outline', color: 'accent', className: 'border-accent text-accent' },\n      { variant: 'outline', color: 'info', className: 'border-info text-info' },\n      { variant: 'outline', color: 'success', className: 'border-success text-success' },\n      { variant: 'outline', color: 'warning', className: 'border-warning text-warning' },\n      { variant: 'outline', color: 'danger', className: 'border-danger text-danger' },\n    ],\n  }\n);\n\n/**\n * Props for the `Badge` component.\n *\n * @property variant - Visual fill style — `'solid'` (filled, default), `'soft'` (tinted background), or `'outline'` (border only).\n * @property color - Semantic color token — `'primary'` | `'secondary'` | `'muted'` | `'accent'` | `'info'` | `'success'` | `'warning'` | `'danger'`. Defaults to `'primary'`.\n * @property size - Badge size — `'xs'` | `'sm'` | `'md'` (default) | `'lg'` | `'xl'`.\n * @property pill - When `true` (default), renders with fully rounded corners (`rounded-full`); when `false`, uses `rounded-sm`.\n */\nexport type BadgeProps = VariantProps<typeof badgeVariants> & React.ComponentPropsWithoutRef<'span'>;\n\n/**\n * Inline status label rendered as a `<span>` with CVA-driven variant, color, size, and shape options.\n *\n * @example\n * ```tsx\n * import { Badge } from '@customafk/lunas-ui/ui/badge';\n *\n * <Badge variant=\"soft\" color=\"success\" size=\"sm\">Active</Badge>\n * <Badge variant=\"outline\" color=\"danger\">Overdue</Badge>\n * ```\n */\nfunction Badge({ className, variant, color, size, pill, ...props }: BadgeProps) {\n  return <span className={cn(badgeVariants({ variant, color, pill, size }), className)} {...props} />;\n}\n\n/**\n * Dot indicator fill color, keyed by the same `color` union as `badgeVariants`, so the palette\n * has a single home instead of being re-declared by each consumer that pairs a status dot with a Badge.\n */\nexport const badgeDotVariants = cva('inline-block size-1.5 shrink-0 rounded-full', {\n  variants: {\n    color: {\n      primary: 'bg-primary',\n      secondary: 'bg-secondary',\n      muted: 'bg-muted',\n      accent: 'bg-accent',\n      info: 'bg-info',\n      success: 'bg-success',\n      warning: 'bg-warning',\n      danger: 'bg-danger',\n    },\n  },\n  defaultVariants: {\n    color: 'primary',\n  },\n});\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport { Badge, badgeVariants };\n"],"mappings":"wJAMA,MAAM,EAAgB,EACpB,iLACA,CACE,SAAU,CACR,QAAS,CACP,MAAO,aACP,KAAM,GACN,QAAS,uBACX,EACA,MAAO,CACL,QAAS,GACT,UAAW,GACX,MAAO,GACP,OAAQ,GACR,KAAM,GACN,QAAS,GACT,QAAS,GACT,OAAQ,EACV,EACA,KAAM,CACJ,GAAI,oCACJ,GAAI,4BACJ,GAAI,gCACJ,GAAI,8BACJ,GAAI,6BACN,EACA,KAAM,CACJ,KAAM,eACN,MAAO,SACT,CACF,EACA,gBAAiB,CACf,QAAS,QACT,MAAO,UACP,KAAM,KACN,KAAM,EACR,EACA,iBAAkB,CAEhB,CAAE,QAAS,QAAS,MAAO,UAAW,UAAW,oCAAqC,EACtF,CAAE,QAAS,QAAS,MAAO,YAAa,UAAW,wCAAyC,EAC5F,CAAE,QAAS,QAAS,MAAO,QAAS,UAAW,6BAA8B,EAC7E,CAAE,QAAS,QAAS,MAAO,SAAU,UAAW,8BAA+B,EAC/E,CAAE,QAAS,QAAS,MAAO,OAAQ,UAAW,8BAA+B,EAC7E,CAAE,QAAS,QAAS,MAAO,UAAW,UAAW,oCAAqC,EACtF,CAAE,QAAS,QAAS,MAAO,UAAW,UAAW,+BAAgC,EACjF,CAAE,QAAS,QAAS,MAAO,SAAU,UAAW,kCAAmC,EAEnF,CAAE,QAAS,OAAQ,MAAO,UAAW,UAAW,2CAA4C,EAC5F,CAAE,QAAS,OAAQ,MAAO,YAAa,UAAW,+CAAgD,EAClG,CAAE,QAAS,OAAQ,MAAO,QAAS,UAAW,uCAAwC,EACtF,CAAE,QAAS,OAAQ,MAAO,SAAU,UAAW,yCAA0C,EACzF,CAAE,QAAS,OAAQ,MAAO,OAAQ,UAAW,qCAAsC,EACnF,CAAE,QAAS,OAAQ,MAAO,UAAW,UAAW,2CAA4C,EAC5F,CAAE,QAAS,OAAQ,MAAO,UAAW,UAAW,2CAA4C,EAC5F,CAAE,QAAS,OAAQ,MAAO,SAAU,UAAW,yCAA0C,EAEzF,CAAE,QAAS,UAAW,MAAO,UAAW,UAAW,6BAA8B,EACjF,CAAE,QAAS,UAAW,MAAO,YAAa,UAAW,iCAAkC,EACvF,CAAE,QAAS,UAAW,MAAO,QAAS,UAAW,yBAA0B,EAC3E,CAAE,QAAS,UAAW,MAAO,SAAU,UAAW,2BAA4B,EAC9E,CAAE,QAAS,UAAW,MAAO,OAAQ,UAAW,uBAAwB,EACxE,CAAE,QAAS,UAAW,MAAO,UAAW,UAAW,6BAA8B,EACjF,CAAE,QAAS,UAAW,MAAO,UAAW,UAAW,6BAA8B,EACjF,CAAE,QAAS,UAAW,MAAO,SAAU,UAAW,2BAA4B,CAChF,CACF,CACF,EAuBA,SAAS,EAAM,CAAE,YAAW,UAAS,QAAO,OAAM,OAAM,GAAG,GAAqB,CAC9E,OAAO,EAAC,OAAD,CAAM,UAAW,EAAG,EAAc,CAAE,UAAS,QAAO,OAAM,MAAK,CAAC,EAAG,CAAS,EAAG,GAAI,CAAQ,CAAA,CACpG,CAMA,MAAa,EAAmB,EAAI,8CAA+C,CACjF,SAAU,CACR,MAAO,CACL,QAAS,aACT,UAAW,eACX,MAAO,WACP,OAAQ,YACR,KAAM,UACN,QAAS,aACT,QAAS,aACT,OAAQ,WACV,CACF,EACA,gBAAiB,CACf,MAAO,SACT,CACF,CAAC"}

package/dist/ui/combobox.cjs

@@ -1 +1 @@
-"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../combobox-kp_kPY8o.cjs");exports.Combobox=e.t;
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../combobox-Bhgo112r.cjs");exports.Combobox=e.t;

package/dist/ui/combobox.mjs

@@ -1 +1 @@
-"use client";import{t as e}from"../combobox-C64Rvd7n.mjs";export{e as Combobox};
+"use client";import{t as e}from"../combobox-C0nno01T.mjs";export{e as Combobox};

package/dist/ui/resizable.d.cts

@@ -1,2 +1,2 @@
-import { n as ResizablePanel, r as ResizablePanelGroup, t as ResizableHandle } from "../resizable-C3uADYIg.cjs";
+import { n as ResizablePanel, r as ResizablePanelGroup, t as ResizableHandle } from "../resizable-CNqPu4Ck.cjs";
 export { ResizableHandle, ResizablePanel, ResizablePanelGroup };

package/dist/ui/resizable.d.mts

@@ -1,2 +1,2 @@
-import { n as ResizablePanel, r as ResizablePanelGroup, t as ResizableHandle } from "../resizable-C3uADYIg.mjs";
+import { n as ResizablePanel, r as ResizablePanelGroup, t as ResizableHandle } from "../resizable-CNqPu4Ck.mjs";
 export { ResizableHandle, ResizablePanel, ResizablePanelGroup };

package/dist/{ui-grid-CzL5J7cm.d.cts → ui-grid-D1-Ponqs.d.cts}

@@ -57,7 +57,7 @@ type UIGridProps = React.PropsWithChildren<{
    * @default 'md'
    */
   gap?: keyof typeof GAP_CLASS;
-}>;
+}> & Omit<React.ComponentPropsWithoutRef<'div'>, 'className'>;
 /**
  * A 12-column CSS Grid container with a named `@container` context, so both its
  * own column count and its `UIGridItem` children's `span` can vary based on the
@@ -73,7 +73,7 @@ type UIGridProps = React.PropsWithChildren<{
  * </UIGrid>
  * ```
  */
-declare const UIGrid: import("react").MemoExoticComponent<({ cols, gap, className, children }: UIGridProps) => import("react").JSX.Element>;
+declare const UIGrid: import("react").MemoExoticComponent<({ cols, gap, className, children, ...rest }: UIGridProps) => import("react").JSX.Element>;
 type TUIGridSpan = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
 type TUIGridItemSpan = TUIGridSpan | Partial<Record<TUIGridBreakpoint, TUIGridSpan>>;
 type UIGridItemProps = React.PropsWithChildren<{
@@ -106,7 +106,7 @@ type UIGridItemProps = React.PropsWithChildren<{
    * @default null
    */
   fallback?: React.ReactNode;
-}>;
+}> & Omit<React.ComponentPropsWithoutRef<'div'>, 'className'>;
 /**
  * A single cell inside a `UIGrid`. Spans `12` of the grid's columns by default
  * (a full-width row) and can vary its span per container-query breakpoint.
@@ -122,7 +122,7 @@ type UIGridItemProps = React.PropsWithChildren<{
  * </UIGrid>
  * ```
  */
-declare const UIGridItem: import("react").MemoExoticComponent<({ span, className, children, suspense, fallback }: UIGridItemProps) => import("react").JSX.Element>;
+declare const UIGridItem: import("react").MemoExoticComponent<({ span, className, children, suspense, fallback, ...rest }: UIGridItemProps) => import("react").JSX.Element>;
 //#endregion
 export { TUIGridSpan as a, TUIGridItemSpan as i, TUIGridCols as n, UIGrid as o, TUIGridColsConfig as r, UIGridItem as s, TUIGridBreakpoint as t };
-//# sourceMappingURL=ui-grid-CzL5J7cm.d.cts.map
+//# sourceMappingURL=ui-grid-D1-Ponqs.d.cts.map

package/dist/{ui-grid-CzL5J7cm.d.mts → ui-grid-D1-Ponqs.d.mts}

@@ -57,7 +57,7 @@ type UIGridProps = React.PropsWithChildren<{
    * @default 'md'
    */
   gap?: keyof typeof GAP_CLASS;
-}>;
+}> & Omit<React.ComponentPropsWithoutRef<'div'>, 'className'>;
 /**
  * A 12-column CSS Grid container with a named `@container` context, so both its
  * own column count and its `UIGridItem` children's `span` can vary based on the
@@ -73,7 +73,7 @@ type UIGridProps = React.PropsWithChildren<{
  * </UIGrid>
  * ```
  */
-declare const UIGrid: import("react").MemoExoticComponent<({ cols, gap, className, children }: UIGridProps) => import("react").JSX.Element>;
+declare const UIGrid: import("react").MemoExoticComponent<({ cols, gap, className, children, ...rest }: UIGridProps) => import("react").JSX.Element>;
 type TUIGridSpan = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
 type TUIGridItemSpan = TUIGridSpan | Partial<Record<TUIGridBreakpoint, TUIGridSpan>>;
 type UIGridItemProps = React.PropsWithChildren<{
@@ -106,7 +106,7 @@ type UIGridItemProps = React.PropsWithChildren<{
    * @default null
    */
   fallback?: React.ReactNode;
-}>;
+}> & Omit<React.ComponentPropsWithoutRef<'div'>, 'className'>;
 /**
  * A single cell inside a `UIGrid`. Spans `12` of the grid's columns by default
  * (a full-width row) and can vary its span per container-query breakpoint.
@@ -122,7 +122,7 @@ type UIGridItemProps = React.PropsWithChildren<{
  * </UIGrid>
  * ```
  */
-declare const UIGridItem: import("react").MemoExoticComponent<({ span, className, children, suspense, fallback }: UIGridItemProps) => import("react").JSX.Element>;
+declare const UIGridItem: import("react").MemoExoticComponent<({ span, className, children, suspense, fallback, ...rest }: UIGridItemProps) => import("react").JSX.Element>;
 //#endregion
 export { TUIGridSpan as a, TUIGridItemSpan as i, TUIGridCols as n, UIGrid as o, TUIGridColsConfig as r, UIGridItem as s, TUIGridBreakpoint as t };
-//# sourceMappingURL=ui-grid-CzL5J7cm.d.mts.map
+//# sourceMappingURL=ui-grid-D1-Ponqs.d.mts.map