@customafk/lunas-ui 0.2.75 → 0.2.77

package/dist/data-display/empty.d.cts

@@ -1,2 +1,2 @@
-import { t as EmptyDisplay } from "../empty-ClQptIZH.cjs";
+import { t as EmptyDisplay } from "../empty-CHTdH5fg.cjs";
 export { EmptyDisplay };

package/dist/data-display/empty.d.mts

@@ -1,2 +1,2 @@
-import { t as EmptyDisplay } from "../empty-ClQptIZH.mjs";
+import { t as EmptyDisplay } from "../empty-CHTdH5fg.mjs";
 export { EmptyDisplay };

package/dist/data-display/empty.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"empty.mjs","names":[],"sources":["../../packages/components/data-display/empty.tsx"],"sourcesContent":["'use client';\n\nimport { PackageOpenIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\ntype EmptyDisplayProps = {\n  /** Message shown below the empty-state icon. Defaults to `'No data to display.'`. */\n  label?: string;\n  /** Additional CSS classes applied to the wrapping container. */\n  className?: string;\n};\n\n/**\n * A full-area empty-state placeholder with a package icon and a configurable message.\n *\n * @example\n * ```tsx\n * import { EmptyDisplay } from '@customafk/lunas-ui/data-display/empty';\n *\n * <EmptyDisplay label=\"No results found.\" />\n * ```\n */\nexport const EmptyDisplay: React.FC<EmptyDisplayProps> = ({ label = 'No data to display.', className }) => {\n  return (\n    <div data-slot=\"empty-display\" className={cn('flex size-full flex-col items-center justify-center gap-2 text-text-positive-muted', className)}>\n      <PackageOpenIcon size={52} strokeWidth={1} />\n      <p className=\"text-sm\">{label}</p>\n    </div>\n  );\n};\n"],"mappings":"kKAuBA,MAAa,GAA6C,CAAE,QAAQ,sBAAuB,eAEvF,EAAC,MAAD,CAAK,YAAU,gBAAgB,UAAW,EAAG,qFAAsF,CAAS,WAA5I,CACE,EAAC,EAAD,CAAiB,KAAM,GAAI,YAAa,CAAI,CAAA,EAC5C,EAAC,IAAD,CAAG,UAAU,mBAAW,CAAS,CAAA,CAC9B"}
+{"version":3,"file":"empty.mjs","names":[],"sources":["../../packages/components/data-display/empty.tsx"],"sourcesContent":["'use client';\n\nimport { PackageOpenIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\ntype EmptyDisplayProps = {\n  /** Message shown below the empty-state icon. Defaults to `'No data to display.'`. */\n  label?: string;\n  /** Additional CSS classes applied to the wrapping container. */\n  className?: string;\n};\n\n/**\n * A full-area empty-state placeholder with a package icon and a configurable message.\n *\n * @example\n * ```tsx\n * import { EmptyDisplay } from '@customafk/lunas-ui/data-display/empty';\n *\n * <EmptyDisplay label=\"No results found.\" />\n * ```\n */\nexport const EmptyDisplay: React.FC<EmptyDisplayProps> = ({ label = 'No data to display.', className }) => {\n  return (\n    <div data-slot=\"empty-display\" className={cn('flex size-full flex-col items-center justify-center gap-2 text-text-positive-muted', className)}>\n      <PackageOpenIcon size={52} strokeWidth={1} />\n      <p className=\"text-sm\">{label}</p>\n    </div>\n  );\n};\n"],"mappings":"kKAuBA,MAAa,GAA6C,CAAE,QAAQ,sBAAuB,eAEvF,EAAC,MAAD,CAAK,YAAU,gBAAgB,UAAW,EAAG,qFAAsF,CAAS,EAA5I,SAAA,CACE,EAAC,EAAD,CAAiB,KAAM,GAAI,YAAa,CAAI,CAAA,EAC5C,EAAC,IAAD,CAAG,UAAU,UAAW,SAAA,CAAS,CAAA,CAC9B"}

package/dist/data-display/name.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"name.cjs","names":["Tooltip","TooltipTrigger","Paragraph","TooltipContent"],"sources":["../../packages/components/data-display/name.tsx"],"sourcesContent":["'use client';\n\nimport { Paragraph } from '../typography/paragraph';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '../ui/tooltip';\n\ntype NameDisplayProps = {\n  /** The full name string to display; shown truncated inline and in full via tooltip. */\n  name: string;\n};\n\n/**\n * Renders a clamped, truncated name with a tooltip that reveals the complete text on hover.\n *\n * @example\n * ```tsx\n * import { NameDisplay } from '@customafk/lunas-ui/data-display/name';\n *\n * <NameDisplay name=\"Nguyễn Văn An\" />\n * ```\n */\nexport const NameDisplay: React.FC<NameDisplayProps> = ({ name }) => {\n  return (\n    <Tooltip>\n      <TooltipTrigger data-slot=\"name-display\">\n        <Paragraph variant=\"sm\" className=\"line-clamp-2 w-full truncate text-wrap pb-px text-start\">\n          {name}\n        </Paragraph>\n      </TooltipTrigger>\n      <TooltipContent align=\"start\" className=\"max-w-80 whitespace-pre-line text-wrap break-keep\">\n        {name}\n      </TooltipContent>\n    </Tooltip>\n  );\n};\n"],"mappings":"iMAoBA,MAAa,GAA2C,CAAE,WAEtD,EAAA,EAAA,KAAA,CAACA,EAAAA,QAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,YAAU,yBACxB,EAAA,EAAA,IAAA,CAACC,EAAAA,UAAD,CAAW,QAAQ,KAAK,UAAU,mEAC/B,CACQ,CAAA,CACG,CAAA,GAChB,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,MAAM,QAAQ,UAAU,6DACrC,CACa,CAAA,CACT,CAAA,CAAA"}
+{"version":3,"file":"name.cjs","names":["Tooltip","TooltipTrigger","Paragraph","TooltipContent"],"sources":["../../packages/components/data-display/name.tsx"],"sourcesContent":["'use client';\n\nimport { Paragraph } from '../typography/paragraph';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '../ui/tooltip';\n\ntype NameDisplayProps = {\n  /** The full name string to display; shown truncated inline and in full via tooltip. */\n  name: string;\n};\n\n/**\n * Renders a clamped, truncated name with a tooltip that reveals the complete text on hover.\n *\n * @example\n * ```tsx\n * import { NameDisplay } from '@customafk/lunas-ui/data-display/name';\n *\n * <NameDisplay name=\"Nguyễn Văn An\" />\n * ```\n */\nexport const NameDisplay: React.FC<NameDisplayProps> = ({ name }) => {\n  return (\n    <Tooltip>\n      <TooltipTrigger data-slot=\"name-display\">\n        <Paragraph variant=\"sm\" className=\"line-clamp-2 w-full truncate text-wrap pb-px text-start\">\n          {name}\n        </Paragraph>\n      </TooltipTrigger>\n      <TooltipContent align=\"start\" className=\"max-w-80 whitespace-pre-line text-wrap break-keep\">\n        {name}\n      </TooltipContent>\n    </Tooltip>\n  );\n};\n"],"mappings":"iMAoBA,MAAa,GAA2C,CAAE,WAEtD,EAAA,EAAA,KAAA,CAACA,EAAAA,QAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,YAAU,eACxB,UAAA,EAAA,EAAA,IAAA,CAACC,EAAAA,UAAD,CAAW,QAAQ,KAAK,UAAU,0DAC/B,SAAA,CACQ,CAAA,CACG,CAAA,GAChB,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,MAAM,QAAQ,UAAU,oDACrC,SAAA,CACa,CAAA,CACT,CAAA,CAAA"}

package/dist/data-display/name.d.cts

@@ -1,2 +1,2 @@
-import { t as NameDisplay } from "../name-7aoM5rAW.cjs";
+import { t as NameDisplay } from "../name-tnVKGZN7.cjs";
 export { NameDisplay };

package/dist/data-display/name.d.mts

@@ -1,2 +1,2 @@
-import { t as NameDisplay } from "../name-7aoM5rAW.mjs";
+import { t as NameDisplay } from "../name-tnVKGZN7.mjs";
 export { NameDisplay };

package/dist/data-display/name.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"name.mjs","names":[],"sources":["../../packages/components/data-display/name.tsx"],"sourcesContent":["'use client';\n\nimport { Paragraph } from '../typography/paragraph';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '../ui/tooltip';\n\ntype NameDisplayProps = {\n  /** The full name string to display; shown truncated inline and in full via tooltip. */\n  name: string;\n};\n\n/**\n * Renders a clamped, truncated name with a tooltip that reveals the complete text on hover.\n *\n * @example\n * ```tsx\n * import { NameDisplay } from '@customafk/lunas-ui/data-display/name';\n *\n * <NameDisplay name=\"Nguyễn Văn An\" />\n * ```\n */\nexport const NameDisplay: React.FC<NameDisplayProps> = ({ name }) => {\n  return (\n    <Tooltip>\n      <TooltipTrigger data-slot=\"name-display\">\n        <Paragraph variant=\"sm\" className=\"line-clamp-2 w-full truncate text-wrap pb-px text-start\">\n          {name}\n        </Paragraph>\n      </TooltipTrigger>\n      <TooltipContent align=\"start\" className=\"max-w-80 whitespace-pre-line text-wrap break-keep\">\n        {name}\n      </TooltipContent>\n    </Tooltip>\n  );\n};\n"],"mappings":"2MAoBA,MAAa,GAA2C,CAAE,UAEtD,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAgB,YAAU,wBACxB,EAAC,EAAD,CAAW,QAAQ,KAAK,UAAU,mEAC/B,CACQ,CAAA,CACG,CAAA,EAChB,EAAC,EAAD,CAAgB,MAAM,QAAQ,UAAU,6DACrC,CACa,CAAA,CACT,CAAA,CAAA"}
+{"version":3,"file":"name.mjs","names":[],"sources":["../../packages/components/data-display/name.tsx"],"sourcesContent":["'use client';\n\nimport { Paragraph } from '../typography/paragraph';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '../ui/tooltip';\n\ntype NameDisplayProps = {\n  /** The full name string to display; shown truncated inline and in full via tooltip. */\n  name: string;\n};\n\n/**\n * Renders a clamped, truncated name with a tooltip that reveals the complete text on hover.\n *\n * @example\n * ```tsx\n * import { NameDisplay } from '@customafk/lunas-ui/data-display/name';\n *\n * <NameDisplay name=\"Nguyễn Văn An\" />\n * ```\n */\nexport const NameDisplay: React.FC<NameDisplayProps> = ({ name }) => {\n  return (\n    <Tooltip>\n      <TooltipTrigger data-slot=\"name-display\">\n        <Paragraph variant=\"sm\" className=\"line-clamp-2 w-full truncate text-wrap pb-px text-start\">\n          {name}\n        </Paragraph>\n      </TooltipTrigger>\n      <TooltipContent align=\"start\" className=\"max-w-80 whitespace-pre-line text-wrap break-keep\">\n        {name}\n      </TooltipContent>\n    </Tooltip>\n  );\n};\n"],"mappings":"2MAoBA,MAAa,GAA2C,CAAE,UAEtD,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAgB,YAAU,eACxB,SAAA,EAAC,EAAD,CAAW,QAAQ,KAAK,UAAU,0DAC/B,SAAA,CACQ,CAAA,CACG,CAAA,EAChB,EAAC,EAAD,CAAgB,MAAM,QAAQ,UAAU,oDACrC,SAAA,CACa,CAAA,CACT,CAAA,CAAA"}

package/dist/data-display/phone-number.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"phone-number.cjs","names":["Tooltip","TooltipTrigger","TooltipContent"],"sources":["../../packages/components/data-display/phone-number.tsx"],"sourcesContent":["'use client';\n\nimport { Tooltip, TooltipContent, TooltipTrigger } from '../ui/tooltip';\n\ntype PhoneNumberDisplayProps = {\n  /** The raw phone number string (e.g. `'0901234567'`); automatically formatted as `(090) 123-4567` with a +84 tooltip. */\n  value: string;\n};\n\n/**\n * Formats and displays a Vietnamese phone number with a tooltip showing the international dialling format.\n *\n * @example\n * ```tsx\n * import { PhoneNumberDisplay } from '@customafk/lunas-ui/data-display/phone-number';\n *\n * <PhoneNumberDisplay value=\"0901234567\" />\n * ```\n */\nexport const PhoneNumberDisplay: React.FC<PhoneNumberDisplayProps> = ({ value }) => {\n  return (\n    <Tooltip>\n      <TooltipTrigger asChild>\n        <p data-slot=\"phone-number-display\" className=\"cursor-default font-number text-sm text-text-positive tabular-nums transition-colors\">\n          {value.replace(/(\\d{3})(\\d{3})(\\d{4})/, '($1) $2-$3')}\n        </p>\n      </TooltipTrigger>\n      <TooltipContent align=\"start\">\n        <p>{value.slice(1).replace(/(\\d{2})(\\d{3})(\\d{4})/, '(00) (+84) ($1) $2-$3')}</p>\n      </TooltipContent>\n    </Tooltip>\n  );\n};\n"],"mappings":"wJAmBA,MAAa,GAAyD,CAAE,YAEpE,EAAA,EAAA,KAAA,CAACA,EAAAA,QAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,QAAA,aACd,EAAA,EAAA,IAAA,CAAC,IAAD,CAAG,YAAU,uBAAuB,UAAU,gGAC3C,EAAM,QAAQ,wBAAyB,YAAY,CACnD,CAAA,CACW,CAAA,GAChB,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,MAAM,kBACpB,EAAA,EAAA,IAAA,CAAC,IAAD,CAAA,SAAI,EAAM,MAAM,CAAC,CAAC,CAAC,QAAQ,wBAAyB,uBAAuB,CAAK,CAAA,CAClE,CAAA,CACT,CAAA,CAAA"}
+{"version":3,"file":"phone-number.cjs","names":["Tooltip","TooltipTrigger","TooltipContent"],"sources":["../../packages/components/data-display/phone-number.tsx"],"sourcesContent":["'use client';\n\nimport { Tooltip, TooltipContent, TooltipTrigger } from '../ui/tooltip';\n\ntype PhoneNumberDisplayProps = {\n  /** The raw phone number string (e.g. `'0901234567'`); automatically formatted as `(090) 123-4567` with a +84 tooltip. */\n  value: string;\n};\n\n/**\n * Formats and displays a Vietnamese phone number with a tooltip showing the international dialling format.\n *\n * @example\n * ```tsx\n * import { PhoneNumberDisplay } from '@customafk/lunas-ui/data-display/phone-number';\n *\n * <PhoneNumberDisplay value=\"0901234567\" />\n * ```\n */\nexport const PhoneNumberDisplay: React.FC<PhoneNumberDisplayProps> = ({ value }) => {\n  return (\n    <Tooltip>\n      <TooltipTrigger asChild>\n        <p data-slot=\"phone-number-display\" className=\"cursor-default font-number text-sm text-text-positive tabular-nums transition-colors\">\n          {value.replace(/(\\d{3})(\\d{3})(\\d{4})/, '($1) $2-$3')}\n        </p>\n      </TooltipTrigger>\n      <TooltipContent align=\"start\">\n        <p>{value.slice(1).replace(/(\\d{2})(\\d{3})(\\d{4})/, '(00) (+84) ($1) $2-$3')}</p>\n      </TooltipContent>\n    </Tooltip>\n  );\n};\n"],"mappings":"wJAmBA,MAAa,GAAyD,CAAE,YAEpE,EAAA,EAAA,KAAA,CAACA,EAAAA,QAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,QAAA,GACd,UAAA,EAAA,EAAA,IAAA,CAAC,IAAD,CAAG,YAAU,uBAAuB,UAAU,uFAC3C,SAAA,EAAM,QAAQ,wBAAyB,YAAY,CACnD,CAAA,CACW,CAAA,GAChB,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,MAAM,QACpB,UAAA,EAAA,EAAA,IAAA,CAAC,IAAD,CAAA,SAAI,EAAM,MAAM,CAAC,CAAC,CAAC,QAAQ,wBAAyB,uBAAuB,CAAK,CAAA,CAClE,CAAA,CACT,CAAA,CAAA"}

package/dist/data-display/phone-number.d.cts

@@ -1,2 +1,2 @@
-import { t as PhoneNumberDisplay } from "../phone-number-6b_pkGI1.cjs";
+import { t as PhoneNumberDisplay } from "../phone-number-D9j5xYDW.cjs";
 export { PhoneNumberDisplay };

package/dist/data-display/phone-number.d.mts

@@ -1,2 +1,2 @@
-import { t as PhoneNumberDisplay } from "../phone-number-6b_pkGI1.mjs";
+import { t as PhoneNumberDisplay } from "../phone-number-D9j5xYDW.mjs";
 export { PhoneNumberDisplay };

package/dist/data-display/phone-number.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"phone-number.mjs","names":[],"sources":["../../packages/components/data-display/phone-number.tsx"],"sourcesContent":["'use client';\n\nimport { Tooltip, TooltipContent, TooltipTrigger } from '../ui/tooltip';\n\ntype PhoneNumberDisplayProps = {\n  /** The raw phone number string (e.g. `'0901234567'`); automatically formatted as `(090) 123-4567` with a +84 tooltip. */\n  value: string;\n};\n\n/**\n * Formats and displays a Vietnamese phone number with a tooltip showing the international dialling format.\n *\n * @example\n * ```tsx\n * import { PhoneNumberDisplay } from '@customafk/lunas-ui/data-display/phone-number';\n *\n * <PhoneNumberDisplay value=\"0901234567\" />\n * ```\n */\nexport const PhoneNumberDisplay: React.FC<PhoneNumberDisplayProps> = ({ value }) => {\n  return (\n    <Tooltip>\n      <TooltipTrigger asChild>\n        <p data-slot=\"phone-number-display\" className=\"cursor-default font-number text-sm text-text-positive tabular-nums transition-colors\">\n          {value.replace(/(\\d{3})(\\d{3})(\\d{4})/, '($1) $2-$3')}\n        </p>\n      </TooltipTrigger>\n      <TooltipContent align=\"start\">\n        <p>{value.slice(1).replace(/(\\d{2})(\\d{3})(\\d{4})/, '(00) (+84) ($1) $2-$3')}</p>\n      </TooltipContent>\n    </Tooltip>\n  );\n};\n"],"mappings":"mJAmBA,MAAa,GAAyD,CAAE,WAEpE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAgB,QAAA,YACd,EAAC,IAAD,CAAG,YAAU,uBAAuB,UAAU,gGAC3C,EAAM,QAAQ,wBAAyB,YAAY,CACnD,CAAA,CACW,CAAA,EAChB,EAAC,EAAD,CAAgB,MAAM,iBACpB,EAAC,IAAD,CAAA,SAAI,EAAM,MAAM,CAAC,CAAC,CAAC,QAAQ,wBAAyB,uBAAuB,CAAK,CAAA,CAClE,CAAA,CACT,CAAA,CAAA"}
+{"version":3,"file":"phone-number.mjs","names":[],"sources":["../../packages/components/data-display/phone-number.tsx"],"sourcesContent":["'use client';\n\nimport { Tooltip, TooltipContent, TooltipTrigger } from '../ui/tooltip';\n\ntype PhoneNumberDisplayProps = {\n  /** The raw phone number string (e.g. `'0901234567'`); automatically formatted as `(090) 123-4567` with a +84 tooltip. */\n  value: string;\n};\n\n/**\n * Formats and displays a Vietnamese phone number with a tooltip showing the international dialling format.\n *\n * @example\n * ```tsx\n * import { PhoneNumberDisplay } from '@customafk/lunas-ui/data-display/phone-number';\n *\n * <PhoneNumberDisplay value=\"0901234567\" />\n * ```\n */\nexport const PhoneNumberDisplay: React.FC<PhoneNumberDisplayProps> = ({ value }) => {\n  return (\n    <Tooltip>\n      <TooltipTrigger asChild>\n        <p data-slot=\"phone-number-display\" className=\"cursor-default font-number text-sm text-text-positive tabular-nums transition-colors\">\n          {value.replace(/(\\d{3})(\\d{3})(\\d{4})/, '($1) $2-$3')}\n        </p>\n      </TooltipTrigger>\n      <TooltipContent align=\"start\">\n        <p>{value.slice(1).replace(/(\\d{2})(\\d{3})(\\d{4})/, '(00) (+84) ($1) $2-$3')}</p>\n      </TooltipContent>\n    </Tooltip>\n  );\n};\n"],"mappings":"mJAmBA,MAAa,GAAyD,CAAE,WAEpE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAgB,QAAA,GACd,SAAA,EAAC,IAAD,CAAG,YAAU,uBAAuB,UAAU,uFAC3C,SAAA,EAAM,QAAQ,wBAAyB,YAAY,CACnD,CAAA,CACW,CAAA,EAChB,EAAC,EAAD,CAAgB,MAAM,QACpB,SAAA,EAAC,IAAD,CAAA,SAAI,EAAM,MAAM,CAAC,CAAC,CAAC,QAAQ,wBAAyB,uBAAuB,CAAK,CAAA,CAClE,CAAA,CACT,CAAA,CAAA"}

package/dist/data-display/role-badge.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"role-badge.cjs","names":["Badge"],"sources":["../../packages/components/data-display/role-badge.tsx"],"sourcesContent":["'use client';\n\nimport { ERole } from '@/types';\n\nimport { Badge } from '../ui/badge';\n\nconst ROLE_COLORS: Record<ERole, React.ComponentProps<typeof Badge>['color']> = {\n  [ERole.ADMIN]: 'primary',\n  [ERole.SUPER_ADMIN]: 'danger',\n  [ERole.MODERATOR]: 'info',\n  [ERole.STAFF]: 'accent',\n  [ERole.USER]: 'muted',\n};\n\nconst ROLE_LABELS: Record<ERole, string> = {\n  [ERole.SUPER_ADMIN]: 'Super Admin',\n  [ERole.ADMIN]: 'Admin',\n  [ERole.MODERATOR]: 'Moderator',\n  [ERole.STAFF]: 'Staff',\n  [ERole.USER]: 'User',\n};\n\ntype RoleBadgeProps = {\n  /** The user role enum value that determines the badge label and colour. */\n  status: ERole;\n};\n\n/**\n * Renders a colour-coded badge for a user role (e.g. Admin, Staff, User).\n *\n * @example\n * ```tsx\n * import { RoleBadge } from '@customafk/lunas-ui/data-display/role-badge';\n * import { ERole } from '@customafk/lunas-ui/types';\n *\n * <RoleBadge status={ERole.ADMIN} />\n * ```\n */\nexport const RoleBadge: React.FC<RoleBadgeProps> = ({ status }) => {\n  return (\n    <Badge data-slot=\"role-badge\" color={ROLE_COLORS[status]} className=\"min-w-24 justify-center\">\n      {ROLE_LABELS[status]}\n    </Badge>\n  );\n};\n"],"mappings":"sJAMA,MAAM,EAA0E,OAC/D,sBACM,mBACF,aACJ,cACD,OAChB,EAEM,EAAqC,aACpB,oBACN,kBACI,kBACJ,aACD,MAChB,EAkBa,GAAuC,CAAE,aAElD,EAAA,EAAA,IAAA,CAACA,EAAAA,MAAD,CAAO,YAAU,aAAa,MAAO,EAAY,GAAS,UAAU,mCACjE,EAAY,EACR,CAAA"}
+{"version":3,"file":"role-badge.cjs","names":["Badge"],"sources":["../../packages/components/data-display/role-badge.tsx"],"sourcesContent":["'use client';\n\nimport { ERole } from '@/types';\n\nimport { Badge } from '../ui/badge';\n\nconst ROLE_COLORS: Record<ERole, React.ComponentProps<typeof Badge>['color']> = {\n  [ERole.ADMIN]: 'primary',\n  [ERole.SUPER_ADMIN]: 'danger',\n  [ERole.MODERATOR]: 'info',\n  [ERole.STAFF]: 'accent',\n  [ERole.USER]: 'muted',\n};\n\nconst ROLE_LABELS: Record<ERole, string> = {\n  [ERole.SUPER_ADMIN]: 'Super Admin',\n  [ERole.ADMIN]: 'Admin',\n  [ERole.MODERATOR]: 'Moderator',\n  [ERole.STAFF]: 'Staff',\n  [ERole.USER]: 'User',\n};\n\ntype RoleBadgeProps = {\n  /** The user role enum value that determines the badge label and colour. */\n  status: ERole;\n};\n\n/**\n * Renders a colour-coded badge for a user role (e.g. Admin, Staff, User).\n *\n * @example\n * ```tsx\n * import { RoleBadge } from '@customafk/lunas-ui/data-display/role-badge';\n * import { ERole } from '@customafk/lunas-ui/types';\n *\n * <RoleBadge status={ERole.ADMIN} />\n * ```\n */\nexport const RoleBadge: React.FC<RoleBadgeProps> = ({ status }) => {\n  return (\n    <Badge data-slot=\"role-badge\" color={ROLE_COLORS[status]} className=\"min-w-24 justify-center\">\n      {ROLE_LABELS[status]}\n    </Badge>\n  );\n};\n"],"mappings":"sJAMA,MAAM,EAA0E,CAC/D,MAAA,UACM,YAAA,SACF,UAAA,OACJ,MAAA,SACD,KAAA,OAChB,EAEM,EAAqC,CACpB,YAAA,cACN,MAAA,QACI,UAAA,YACJ,MAAA,QACD,KAAA,MAChB,EAkBa,GAAuC,CAAE,aAElD,EAAA,EAAA,IAAA,CAACA,EAAAA,MAAD,CAAO,YAAU,aAAa,MAAO,EAAY,GAAS,UAAU,0BACjE,SAAA,EAAY,EACR,CAAA"}

package/dist/data-display/role-badge.d.cts

@@ -1,2 +1,2 @@
-import { t as RoleBadge } from "../role-badge-IdZW0tsN.cjs";
+import { t as RoleBadge } from "../role-badge-CojpT6hX.cjs";
 export { RoleBadge };

package/dist/data-display/role-badge.d.mts

@@ -1,2 +1,2 @@
-import { t as RoleBadge } from "../role-badge-Bl4Rimpk.mjs";
+import { t as RoleBadge } from "../role-badge-NTpnTz8M.mjs";
 export { RoleBadge };

package/dist/data-display/role-badge.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"role-badge.mjs","names":[],"sources":["../../packages/components/data-display/role-badge.tsx"],"sourcesContent":["'use client';\n\nimport { ERole } from '@/types';\n\nimport { Badge } from '../ui/badge';\n\nconst ROLE_COLORS: Record<ERole, React.ComponentProps<typeof Badge>['color']> = {\n  [ERole.ADMIN]: 'primary',\n  [ERole.SUPER_ADMIN]: 'danger',\n  [ERole.MODERATOR]: 'info',\n  [ERole.STAFF]: 'accent',\n  [ERole.USER]: 'muted',\n};\n\nconst ROLE_LABELS: Record<ERole, string> = {\n  [ERole.SUPER_ADMIN]: 'Super Admin',\n  [ERole.ADMIN]: 'Admin',\n  [ERole.MODERATOR]: 'Moderator',\n  [ERole.STAFF]: 'Staff',\n  [ERole.USER]: 'User',\n};\n\ntype RoleBadgeProps = {\n  /** The user role enum value that determines the badge label and colour. */\n  status: ERole;\n};\n\n/**\n * Renders a colour-coded badge for a user role (e.g. Admin, Staff, User).\n *\n * @example\n * ```tsx\n * import { RoleBadge } from '@customafk/lunas-ui/data-display/role-badge';\n * import { ERole } from '@customafk/lunas-ui/types';\n *\n * <RoleBadge status={ERole.ADMIN} />\n * ```\n */\nexport const RoleBadge: React.FC<RoleBadgeProps> = ({ status }) => {\n  return (\n    <Badge data-slot=\"role-badge\" color={ROLE_COLORS[status]} className=\"min-w-24 justify-center\">\n      {ROLE_LABELS[status]}\n    </Badge>\n  );\n};\n"],"mappings":"6FAMA,MAAM,EAA0E,OAC/D,sBACM,mBACF,aACJ,cACD,OAChB,EAEM,EAAqC,aACpB,oBACN,kBACI,kBACJ,aACD,MAChB,EAkBa,GAAuC,CAAE,YAElD,EAAC,EAAD,CAAO,YAAU,aAAa,MAAO,EAAY,GAAS,UAAU,mCACjE,EAAY,EACR,CAAA"}
+{"version":3,"file":"role-badge.mjs","names":[],"sources":["../../packages/components/data-display/role-badge.tsx"],"sourcesContent":["'use client';\n\nimport { ERole } from '@/types';\n\nimport { Badge } from '../ui/badge';\n\nconst ROLE_COLORS: Record<ERole, React.ComponentProps<typeof Badge>['color']> = {\n  [ERole.ADMIN]: 'primary',\n  [ERole.SUPER_ADMIN]: 'danger',\n  [ERole.MODERATOR]: 'info',\n  [ERole.STAFF]: 'accent',\n  [ERole.USER]: 'muted',\n};\n\nconst ROLE_LABELS: Record<ERole, string> = {\n  [ERole.SUPER_ADMIN]: 'Super Admin',\n  [ERole.ADMIN]: 'Admin',\n  [ERole.MODERATOR]: 'Moderator',\n  [ERole.STAFF]: 'Staff',\n  [ERole.USER]: 'User',\n};\n\ntype RoleBadgeProps = {\n  /** The user role enum value that determines the badge label and colour. */\n  status: ERole;\n};\n\n/**\n * Renders a colour-coded badge for a user role (e.g. Admin, Staff, User).\n *\n * @example\n * ```tsx\n * import { RoleBadge } from '@customafk/lunas-ui/data-display/role-badge';\n * import { ERole } from '@customafk/lunas-ui/types';\n *\n * <RoleBadge status={ERole.ADMIN} />\n * ```\n */\nexport const RoleBadge: React.FC<RoleBadgeProps> = ({ status }) => {\n  return (\n    <Badge data-slot=\"role-badge\" color={ROLE_COLORS[status]} className=\"min-w-24 justify-center\">\n      {ROLE_LABELS[status]}\n    </Badge>\n  );\n};\n"],"mappings":"6FAMA,MAAM,EAA0E,CAC/D,MAAA,UACM,YAAA,SACF,UAAA,OACJ,MAAA,SACD,KAAA,OAChB,EAEM,EAAqC,CACpB,YAAA,cACN,MAAA,QACI,UAAA,YACJ,MAAA,QACD,KAAA,MAChB,EAkBa,GAAuC,CAAE,YAElD,EAAC,EAAD,CAAO,YAAU,aAAa,MAAO,EAAY,GAAS,UAAU,0BACjE,SAAA,EAAY,EACR,CAAA"}

package/dist/data-display/statistic.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"statistic.cjs","names":[],"sources":["../../packages/components/data-display/statistic.tsx"],"sourcesContent":["'use client';\n\nimport { memo, useCallback, useMemo } from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nconst statisticVariants = cva('inline-flex items-center gap-1 font-number tabular-nums transition-colors', {\n  variants: {\n    size: {\n      xs: 'text-xs',\n      sm: 'text-sm',\n      md: 'text-base',\n      lg: 'text-lg',\n      xl: 'text-xl',\n    },\n    trend: {\n      neutral: 'text-text-positive-strong',\n      up: 'text-success',\n      down: 'text-danger',\n    },\n  },\n  defaultVariants: {\n    size: 'lg',\n    trend: 'neutral',\n  },\n});\n\nexport type StatisticProps = VariantProps<typeof statisticVariants> & {\n  /** Character used to separate the decimal part. Defaults to `'.'`. */\n  decimalSeparator?: string;\n  /** Character used to separate thousands groups. Defaults to `','`. */\n  groupSeparator?: string;\n  /** Optional node rendered before the numeric value (e.g. a currency symbol). */\n  prefix?: React.ReactNode;\n  /** Optional node rendered after the numeric value (e.g. a unit label). */\n  suffix?: React.ReactNode;\n  /** Number of decimal digits to display; omit to show all significant digits. */\n  precision?: number;\n  /** Rounding strategy applied before formatting. Defaults to `'round'`. */\n  roundingMode?: 'round' | 'floor' | 'ceil';\n  /** When `true`, pads the decimal part with trailing zeros up to `precision`. Defaults to `false`. */\n  showTrailingZeros?: boolean;\n  /** The numeric (or numeric-string) value to format and display. */\n  value: number | string;\n  /** Additional CSS classes applied to the wrapper element. */\n  className?: string;\n  /** Colour trend indicator: `'neutral'` (default), `'up'` (green), or `'down'` (red). */\n  trend?: 'neutral' | 'up' | 'down';\n};\n\n/**\n * A memoised numeric display component with locale-aware formatting, optional prefix/suffix, trend colouring, and configurable rounding.\n *\n * @example\n * ```tsx\n * import { Statistic } from '@customafk/lunas-ui/data-display/statistic';\n *\n * <Statistic value={1234567.89} precision={2} prefix=\"$\" trend=\"up\" size=\"lg\" />\n * ```\n */\nexport const Statistic = memo(\n  ({\n    decimalSeparator = '.',\n    groupSeparator = ',',\n    prefix: Prefix,\n    suffix: Suffix,\n    precision,\n    roundingMode = 'round',\n    showTrailingZeros = false,\n    size = 'lg',\n    trend = 'neutral',\n    value,\n    className,\n  }: StatisticProps) => {\n    const applyRounding = useCallback(\n      (num: number, precisionValue: number): number => {\n        const multiplier = 10 ** precisionValue;\n        switch (roundingMode) {\n          case 'floor':\n            return Math.floor(num * multiplier) / multiplier;\n          case 'ceil':\n            return Math.ceil(num * multiplier) / multiplier;\n          default:\n            return Math.round(num * multiplier) / multiplier;\n        }\n      },\n      [roundingMode]\n    );\n\n    const formatOptions = useMemo((): Intl.NumberFormatOptions => {\n      const options: Intl.NumberFormatOptions = {};\n      if (typeof precision === 'number' && precision >= 0) {\n        if (showTrailingZeros) {\n          options.minimumFractionDigits = precision;\n          options.maximumFractionDigits = precision;\n        } else {\n          options.maximumFractionDigits = precision;\n        }\n      }\n      return options;\n    }, [precision, showTrailingZeros]);\n\n    const formatNumber = useCallback(\n      (num: number): string => {\n        let processedNum = num;\n        if (typeof precision === 'number' && precision >= 0) {\n          processedNum = applyRounding(num, precision);\n        }\n        return processedNum.toLocaleString('en-US', formatOptions);\n      },\n      [applyRounding, formatOptions, precision]\n    );\n\n    const processedValue = useMemo((): string => {\n      if (typeof value === 'number') {\n        if (Number.isNaN(value) || !Number.isFinite(value)) return 'N/A';\n        return formatNumber(value);\n      }\n      if (typeof value === 'string') {\n        const trimmedValue = value.trim();\n        if (!trimmedValue) return 'N/A';\n        const numValue = Number(trimmedValue);\n        if (Number.isNaN(numValue) || !Number.isFinite(numValue)) return 'N/A';\n        return formatNumber(numValue);\n      }\n      return 'N/A';\n    }, [value, formatNumber]);\n\n    const finalFormattedValue = useMemo((): string => {\n      if (decimalSeparator === '.' && groupSeparator === ',') return processedValue;\n      return processedValue.replace(/,/g, groupSeparator).replace(/\\./g, decimalSeparator);\n    }, [processedValue, decimalSeparator, groupSeparator]);\n\n    return (\n      <div data-slot=\"statistic\" className={cn(statisticVariants({ size, trend }), className)}>\n        {Prefix && <span data-slot=\"statistic-prefix\">{Prefix}</span>}\n        <p data-slot=\"statistic-value\">{finalFormattedValue}</p>\n        {Suffix && <span data-slot=\"statistic-suffix\">{Suffix}</span>}\n      </div>\n    );\n  }\n);\nStatistic.displayName = 'Statistic';\n"],"mappings":"wNAMA,MAAM,GAAA,EAAA,EAAA,IAAA,CAAwB,4EAA6E,CACzG,SAAU,CACR,KAAM,CACJ,GAAI,UACJ,GAAI,UACJ,GAAI,YACJ,GAAI,UACJ,GAAI,SACN,EACA,MAAO,CACL,QAAS,4BACT,GAAI,eACJ,KAAM,aACR,CACF,EACA,gBAAiB,CACf,KAAM,KACN,MAAO,SACT,CACF,CAAC,EAmCY,GAAA,EAAA,EAAA,KAAA,EACV,CACC,mBAAmB,IACnB,iBAAiB,IACjB,OAAQ,EACR,OAAQ,EACR,YACA,eAAe,QACf,oBAAoB,GACpB,OAAO,KACP,QAAQ,UACR,QACA,eACoB,CACpB,IAAM,GAAA,EAAA,EAAA,YAAA,EACH,EAAa,IAAmC,CAC/C,IAAM,EAAa,IAAM,EACzB,OAAQ,EAAR,CACE,IAAK,QACH,OAAO,KAAK,MAAM,EAAM,CAAU,EAAI,EACxC,IAAK,OACH,OAAO,KAAK,KAAK,EAAM,CAAU,EAAI,EACvC,QACE,OAAO,KAAK,MAAM,EAAM,CAAU,EAAI,CAC1C,CACF,EACA,CAAC,CAAY,CACf,EAEM,GAAA,EAAA,EAAA,QAAA,KAAwD,CAC5D,IAAM,EAAoC,CAAC,EAS3C,OARI,OAAO,GAAc,UAAY,GAAa,IAC5C,IACF,EAAQ,sBAAwB,GAGhC,EAAQ,sBAAwB,GAG7B,CACT,EAAG,CAAC,EAAW,CAAiB,CAAC,EAE3B,GAAA,EAAA,EAAA,YAAA,CACH,GAAwB,CACvB,IAAI,EAAe,EAInB,OAHI,OAAO,GAAc,UAAY,GAAa,IAChD,EAAe,EAAc,EAAK,CAAS,GAEtC,EAAa,eAAe,QAAS,CAAa,CAC3D,EACA,CAAC,EAAe,EAAe,CAAS,CAC1C,EAEM,GAAA,EAAA,EAAA,QAAA,KAAuC,CAC3C,GAAI,OAAO,GAAU,SAEnB,OADI,OAAO,MAAM,CAAK,GAAK,CAAC,OAAO,SAAS,CAAK,EAAU,MACpD,EAAa,CAAK,EAE3B,GAAI,OAAO,GAAU,SAAU,CAC7B,IAAM,EAAe,EAAM,KAAK,EAChC,GAAI,CAAC,EAAc,MAAO,MAC1B,IAAM,EAAW,OAAO,CAAY,EAEpC,OADI,OAAO,MAAM,CAAQ,GAAK,CAAC,OAAO,SAAS,CAAQ,EAAU,MAC1D,EAAa,CAAQ,CAC9B,CACA,MAAO,KACT,EAAG,CAAC,EAAO,CAAY,CAAC,EAElB,GAAA,EAAA,EAAA,QAAA,KACA,IAAqB,KAAO,IAAmB,IAAY,EACxD,EAAe,QAAQ,KAAM,CAAc,CAAC,CAAC,QAAQ,MAAO,CAAgB,EAClF,CAAC,EAAgB,EAAkB,CAAc,CAAC,EAErD,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,YAAU,YAAY,WAAA,EAAA,EAAA,GAAA,CAAc,EAAkB,CAAE,OAAM,OAAM,CAAC,EAAG,CAAS,WAAtF,CACG,IAAU,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,YAAU,4BAAoB,CAAa,CAAA,GAC5D,EAAA,EAAA,IAAA,CAAC,IAAD,CAAG,YAAU,2BAAmB,CAAuB,CAAA,EACtD,IAAU,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,YAAU,4BAAoB,CAAa,CAAA,CACzD,GAET,CACF,EACA,EAAU,YAAc"}
+{"version":3,"file":"statistic.cjs","names":[],"sources":["../../packages/components/data-display/statistic.tsx"],"sourcesContent":["'use client';\n\nimport { memo, useCallback, useMemo } from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nconst statisticVariants = cva('inline-flex items-center gap-1 font-number tabular-nums transition-colors', {\n  variants: {\n    size: {\n      xs: 'text-xs',\n      sm: 'text-sm',\n      md: 'text-base',\n      lg: 'text-lg',\n      xl: 'text-xl',\n    },\n    trend: {\n      neutral: 'text-text-positive-strong',\n      up: 'text-success',\n      down: 'text-danger',\n    },\n  },\n  defaultVariants: {\n    size: 'lg',\n    trend: 'neutral',\n  },\n});\n\nexport type StatisticProps = VariantProps<typeof statisticVariants> & {\n  /** Character used to separate the decimal part. Defaults to `'.'`. */\n  decimalSeparator?: string;\n  /** Character used to separate thousands groups. Defaults to `','`. */\n  groupSeparator?: string;\n  /** Optional node rendered before the numeric value (e.g. a currency symbol). */\n  prefix?: React.ReactNode;\n  /** Optional node rendered after the numeric value (e.g. a unit label). */\n  suffix?: React.ReactNode;\n  /** Number of decimal digits to display; omit to show all significant digits. */\n  precision?: number;\n  /** Rounding strategy applied before formatting. Defaults to `'round'`. */\n  roundingMode?: 'round' | 'floor' | 'ceil';\n  /** When `true`, pads the decimal part with trailing zeros up to `precision`. Defaults to `false`. */\n  showTrailingZeros?: boolean;\n  /** The numeric (or numeric-string) value to format and display. */\n  value: number | string;\n  /** Additional CSS classes applied to the wrapper element. */\n  className?: string;\n  /** Colour trend indicator: `'neutral'` (default), `'up'` (green), or `'down'` (red). */\n  trend?: 'neutral' | 'up' | 'down';\n};\n\n/**\n * A memoised numeric display component with locale-aware formatting, optional prefix/suffix, trend colouring, and configurable rounding.\n *\n * @example\n * ```tsx\n * import { Statistic } from '@customafk/lunas-ui/data-display/statistic';\n *\n * <Statistic value={1234567.89} precision={2} prefix=\"$\" trend=\"up\" size=\"lg\" />\n * ```\n */\nexport const Statistic = memo(\n  ({\n    decimalSeparator = '.',\n    groupSeparator = ',',\n    prefix: Prefix,\n    suffix: Suffix,\n    precision,\n    roundingMode = 'round',\n    showTrailingZeros = false,\n    size = 'lg',\n    trend = 'neutral',\n    value,\n    className,\n  }: StatisticProps) => {\n    const applyRounding = useCallback(\n      (num: number, precisionValue: number): number => {\n        const multiplier = 10 ** precisionValue;\n        switch (roundingMode) {\n          case 'floor':\n            return Math.floor(num * multiplier) / multiplier;\n          case 'ceil':\n            return Math.ceil(num * multiplier) / multiplier;\n          default:\n            return Math.round(num * multiplier) / multiplier;\n        }\n      },\n      [roundingMode]\n    );\n\n    const formatOptions = useMemo((): Intl.NumberFormatOptions => {\n      const options: Intl.NumberFormatOptions = {};\n      if (typeof precision === 'number' && precision >= 0) {\n        if (showTrailingZeros) {\n          options.minimumFractionDigits = precision;\n          options.maximumFractionDigits = precision;\n        } else {\n          options.maximumFractionDigits = precision;\n        }\n      }\n      return options;\n    }, [precision, showTrailingZeros]);\n\n    const formatNumber = useCallback(\n      (num: number): string => {\n        let processedNum = num;\n        if (typeof precision === 'number' && precision >= 0) {\n          processedNum = applyRounding(num, precision);\n        }\n        return processedNum.toLocaleString('en-US', formatOptions);\n      },\n      [applyRounding, formatOptions, precision]\n    );\n\n    const processedValue = useMemo((): string => {\n      if (typeof value === 'number') {\n        if (Number.isNaN(value) || !Number.isFinite(value)) return 'N/A';\n        return formatNumber(value);\n      }\n      if (typeof value === 'string') {\n        const trimmedValue = value.trim();\n        if (!trimmedValue) return 'N/A';\n        const numValue = Number(trimmedValue);\n        if (Number.isNaN(numValue) || !Number.isFinite(numValue)) return 'N/A';\n        return formatNumber(numValue);\n      }\n      return 'N/A';\n    }, [value, formatNumber]);\n\n    const finalFormattedValue = useMemo((): string => {\n      if (decimalSeparator === '.' && groupSeparator === ',') return processedValue;\n      return processedValue.replace(/,/g, groupSeparator).replace(/\\./g, decimalSeparator);\n    }, [processedValue, decimalSeparator, groupSeparator]);\n\n    return (\n      <div data-slot=\"statistic\" className={cn(statisticVariants({ size, trend }), className)}>\n        {Prefix && <span data-slot=\"statistic-prefix\">{Prefix}</span>}\n        <p data-slot=\"statistic-value\">{finalFormattedValue}</p>\n        {Suffix && <span data-slot=\"statistic-suffix\">{Suffix}</span>}\n      </div>\n    );\n  }\n);\nStatistic.displayName = 'Statistic';\n"],"mappings":"wNAMA,MAAM,GAAA,EAAA,EAAA,IAAA,CAAwB,4EAA6E,CACzG,SAAU,CACR,KAAM,CACJ,GAAI,UACJ,GAAI,UACJ,GAAI,YACJ,GAAI,UACJ,GAAI,SACN,EACA,MAAO,CACL,QAAS,4BACT,GAAI,eACJ,KAAM,aACR,CACF,EACA,gBAAiB,CACf,KAAM,KACN,MAAO,SACT,CACF,CAAC,EAmCY,GAAA,EAAA,EAAA,KAAA,EACV,CACC,mBAAmB,IACnB,iBAAiB,IACjB,OAAQ,EACR,OAAQ,EACR,YACA,eAAe,QACf,oBAAoB,GACpB,OAAO,KACP,QAAQ,UACR,QACA,eACoB,CACpB,IAAM,GAAA,EAAA,EAAA,YAAA,EACH,EAAa,IAAmC,CAC/C,IAAM,EAAa,IAAM,EACzB,OAAQ,EAAR,CACE,IAAK,QACH,OAAO,KAAK,MAAM,EAAM,CAAU,EAAI,EACxC,IAAK,OACH,OAAO,KAAK,KAAK,EAAM,CAAU,EAAI,EACvC,QACE,OAAO,KAAK,MAAM,EAAM,CAAU,EAAI,CAC1C,CACF,EACA,CAAC,CAAY,CACf,EAEM,GAAA,EAAA,EAAA,QAAA,KAAwD,CAC5D,IAAM,EAAoC,CAAC,EAS3C,OARI,OAAO,GAAc,UAAY,GAAa,IAC5C,IACF,EAAQ,sBAAwB,GAGhC,EAAQ,sBAAwB,GAG7B,CACT,EAAG,CAAC,EAAW,CAAiB,CAAC,EAE3B,GAAA,EAAA,EAAA,YAAA,CACH,GAAwB,CACvB,IAAI,EAAe,EAInB,OAHI,OAAO,GAAc,UAAY,GAAa,IAChD,EAAe,EAAc,EAAK,CAAS,GAEtC,EAAa,eAAe,QAAS,CAAa,CAC3D,EACA,CAAC,EAAe,EAAe,CAAS,CAC1C,EAEM,GAAA,EAAA,EAAA,QAAA,KAAuC,CAC3C,GAAI,OAAO,GAAU,SAEnB,OADI,OAAO,MAAM,CAAK,GAAK,CAAC,OAAO,SAAS,CAAK,EAAU,MACpD,EAAa,CAAK,EAE3B,GAAI,OAAO,GAAU,SAAU,CAC7B,IAAM,EAAe,EAAM,KAAK,EAChC,GAAI,CAAC,EAAc,MAAO,MAC1B,IAAM,EAAW,OAAO,CAAY,EAEpC,OADI,OAAO,MAAM,CAAQ,GAAK,CAAC,OAAO,SAAS,CAAQ,EAAU,MAC1D,EAAa,CAAQ,CAC9B,CACA,MAAO,KACT,EAAG,CAAC,EAAO,CAAY,CAAC,EAElB,GAAA,EAAA,EAAA,QAAA,KACA,IAAqB,KAAO,IAAmB,IAAY,EACxD,EAAe,QAAQ,KAAM,CAAc,CAAC,CAAC,QAAQ,MAAO,CAAgB,EAClF,CAAC,EAAgB,EAAkB,CAAc,CAAC,EAErD,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,YAAU,YAAY,WAAA,EAAA,EAAA,GAAA,CAAc,EAAkB,CAAE,OAAM,OAAM,CAAC,EAAG,CAAS,EAAtF,SAAA,CACG,IAAU,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,YAAU,mBAAoB,SAAA,CAAa,CAAA,GAC5D,EAAA,EAAA,IAAA,CAAC,IAAD,CAAG,YAAU,kBAAmB,SAAA,CAAuB,CAAA,EACtD,IAAU,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,YAAU,mBAAoB,SAAA,CAAa,CAAA,CACzD,GAET,CACF,EACA,EAAU,YAAc"}

package/dist/data-display/statistic.d.cts

@@ -1,2 +1,2 @@
-import { n as StatisticProps, t as Statistic } from "../statistic-8zBJMdRa.cjs";
+import { n as StatisticProps, t as Statistic } from "../statistic-Bpif8p8R.cjs";
 export { Statistic, StatisticProps };

package/dist/data-display/statistic.d.mts

@@ -1,2 +1,2 @@
-import { n as StatisticProps, t as Statistic } from "../statistic-8zBJMdRa.mjs";
+import { n as StatisticProps, t as Statistic } from "../statistic-Bpif8p8R.mjs";
 export { Statistic, StatisticProps };

package/dist/data-display/statistic.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"statistic.mjs","names":[],"sources":["../../packages/components/data-display/statistic.tsx"],"sourcesContent":["'use client';\n\nimport { memo, useCallback, useMemo } from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nconst statisticVariants = cva('inline-flex items-center gap-1 font-number tabular-nums transition-colors', {\n  variants: {\n    size: {\n      xs: 'text-xs',\n      sm: 'text-sm',\n      md: 'text-base',\n      lg: 'text-lg',\n      xl: 'text-xl',\n    },\n    trend: {\n      neutral: 'text-text-positive-strong',\n      up: 'text-success',\n      down: 'text-danger',\n    },\n  },\n  defaultVariants: {\n    size: 'lg',\n    trend: 'neutral',\n  },\n});\n\nexport type StatisticProps = VariantProps<typeof statisticVariants> & {\n  /** Character used to separate the decimal part. Defaults to `'.'`. */\n  decimalSeparator?: string;\n  /** Character used to separate thousands groups. Defaults to `','`. */\n  groupSeparator?: string;\n  /** Optional node rendered before the numeric value (e.g. a currency symbol). */\n  prefix?: React.ReactNode;\n  /** Optional node rendered after the numeric value (e.g. a unit label). */\n  suffix?: React.ReactNode;\n  /** Number of decimal digits to display; omit to show all significant digits. */\n  precision?: number;\n  /** Rounding strategy applied before formatting. Defaults to `'round'`. */\n  roundingMode?: 'round' | 'floor' | 'ceil';\n  /** When `true`, pads the decimal part with trailing zeros up to `precision`. Defaults to `false`. */\n  showTrailingZeros?: boolean;\n  /** The numeric (or numeric-string) value to format and display. */\n  value: number | string;\n  /** Additional CSS classes applied to the wrapper element. */\n  className?: string;\n  /** Colour trend indicator: `'neutral'` (default), `'up'` (green), or `'down'` (red). */\n  trend?: 'neutral' | 'up' | 'down';\n};\n\n/**\n * A memoised numeric display component with locale-aware formatting, optional prefix/suffix, trend colouring, and configurable rounding.\n *\n * @example\n * ```tsx\n * import { Statistic } from '@customafk/lunas-ui/data-display/statistic';\n *\n * <Statistic value={1234567.89} precision={2} prefix=\"$\" trend=\"up\" size=\"lg\" />\n * ```\n */\nexport const Statistic = memo(\n  ({\n    decimalSeparator = '.',\n    groupSeparator = ',',\n    prefix: Prefix,\n    suffix: Suffix,\n    precision,\n    roundingMode = 'round',\n    showTrailingZeros = false,\n    size = 'lg',\n    trend = 'neutral',\n    value,\n    className,\n  }: StatisticProps) => {\n    const applyRounding = useCallback(\n      (num: number, precisionValue: number): number => {\n        const multiplier = 10 ** precisionValue;\n        switch (roundingMode) {\n          case 'floor':\n            return Math.floor(num * multiplier) / multiplier;\n          case 'ceil':\n            return Math.ceil(num * multiplier) / multiplier;\n          default:\n            return Math.round(num * multiplier) / multiplier;\n        }\n      },\n      [roundingMode]\n    );\n\n    const formatOptions = useMemo((): Intl.NumberFormatOptions => {\n      const options: Intl.NumberFormatOptions = {};\n      if (typeof precision === 'number' && precision >= 0) {\n        if (showTrailingZeros) {\n          options.minimumFractionDigits = precision;\n          options.maximumFractionDigits = precision;\n        } else {\n          options.maximumFractionDigits = precision;\n        }\n      }\n      return options;\n    }, [precision, showTrailingZeros]);\n\n    const formatNumber = useCallback(\n      (num: number): string => {\n        let processedNum = num;\n        if (typeof precision === 'number' && precision >= 0) {\n          processedNum = applyRounding(num, precision);\n        }\n        return processedNum.toLocaleString('en-US', formatOptions);\n      },\n      [applyRounding, formatOptions, precision]\n    );\n\n    const processedValue = useMemo((): string => {\n      if (typeof value === 'number') {\n        if (Number.isNaN(value) || !Number.isFinite(value)) return 'N/A';\n        return formatNumber(value);\n      }\n      if (typeof value === 'string') {\n        const trimmedValue = value.trim();\n        if (!trimmedValue) return 'N/A';\n        const numValue = Number(trimmedValue);\n        if (Number.isNaN(numValue) || !Number.isFinite(numValue)) return 'N/A';\n        return formatNumber(numValue);\n      }\n      return 'N/A';\n    }, [value, formatNumber]);\n\n    const finalFormattedValue = useMemo((): string => {\n      if (decimalSeparator === '.' && groupSeparator === ',') return processedValue;\n      return processedValue.replace(/,/g, groupSeparator).replace(/\\./g, decimalSeparator);\n    }, [processedValue, decimalSeparator, groupSeparator]);\n\n    return (\n      <div data-slot=\"statistic\" className={cn(statisticVariants({ size, trend }), className)}>\n        {Prefix && <span data-slot=\"statistic-prefix\">{Prefix}</span>}\n        <p data-slot=\"statistic-value\">{finalFormattedValue}</p>\n        {Suffix && <span data-slot=\"statistic-suffix\">{Suffix}</span>}\n      </div>\n    );\n  }\n);\nStatistic.displayName = 'Statistic';\n"],"mappings":"6NAMA,MAAM,EAAoB,EAAI,4EAA6E,CACzG,SAAU,CACR,KAAM,CACJ,GAAI,UACJ,GAAI,UACJ,GAAI,YACJ,GAAI,UACJ,GAAI,SACN,EACA,MAAO,CACL,QAAS,4BACT,GAAI,eACJ,KAAM,aACR,CACF,EACA,gBAAiB,CACf,KAAM,KACN,MAAO,SACT,CACF,CAAC,EAmCY,EAAY,GACtB,CACC,mBAAmB,IACnB,iBAAiB,IACjB,OAAQ,EACR,OAAQ,EACR,YACA,eAAe,QACf,oBAAoB,GACpB,OAAO,KACP,QAAQ,UACR,QACA,eACoB,CACpB,IAAM,EAAgB,GACnB,EAAa,IAAmC,CAC/C,IAAM,EAAa,IAAM,EACzB,OAAQ,EAAR,CACE,IAAK,QACH,OAAO,KAAK,MAAM,EAAM,CAAU,EAAI,EACxC,IAAK,OACH,OAAO,KAAK,KAAK,EAAM,CAAU,EAAI,EACvC,QACE,OAAO,KAAK,MAAM,EAAM,CAAU,EAAI,CAC1C,CACF,EACA,CAAC,CAAY,CACf,EAEM,EAAgB,MAAwC,CAC5D,IAAM,EAAoC,CAAC,EAS3C,OARI,OAAO,GAAc,UAAY,GAAa,IAC5C,IACF,EAAQ,sBAAwB,GAGhC,EAAQ,sBAAwB,GAG7B,CACT,EAAG,CAAC,EAAW,CAAiB,CAAC,EAE3B,EAAe,EAClB,GAAwB,CACvB,IAAI,EAAe,EAInB,OAHI,OAAO,GAAc,UAAY,GAAa,IAChD,EAAe,EAAc,EAAK,CAAS,GAEtC,EAAa,eAAe,QAAS,CAAa,CAC3D,EACA,CAAC,EAAe,EAAe,CAAS,CAC1C,EAEM,EAAiB,MAAsB,CAC3C,GAAI,OAAO,GAAU,SAEnB,OADI,OAAO,MAAM,CAAK,GAAK,CAAC,OAAO,SAAS,CAAK,EAAU,MACpD,EAAa,CAAK,EAE3B,GAAI,OAAO,GAAU,SAAU,CAC7B,IAAM,EAAe,EAAM,KAAK,EAChC,GAAI,CAAC,EAAc,MAAO,MAC1B,IAAM,EAAW,OAAO,CAAY,EAEpC,OADI,OAAO,MAAM,CAAQ,GAAK,CAAC,OAAO,SAAS,CAAQ,EAAU,MAC1D,EAAa,CAAQ,CAC9B,CACA,MAAO,KACT,EAAG,CAAC,EAAO,CAAY,CAAC,EAElB,EAAsB,MACtB,IAAqB,KAAO,IAAmB,IAAY,EACxD,EAAe,QAAQ,KAAM,CAAc,CAAC,CAAC,QAAQ,MAAO,CAAgB,EAClF,CAAC,EAAgB,EAAkB,CAAc,CAAC,EAErD,OACE,EAAC,MAAD,CAAK,YAAU,YAAY,UAAW,EAAG,EAAkB,CAAE,OAAM,OAAM,CAAC,EAAG,CAAS,WAAtF,CACG,GAAU,EAAC,OAAD,CAAM,YAAU,4BAAoB,CAAa,CAAA,EAC5D,EAAC,IAAD,CAAG,YAAU,2BAAmB,CAAuB,CAAA,EACtD,GAAU,EAAC,OAAD,CAAM,YAAU,4BAAoB,CAAa,CAAA,CACzD,GAET,CACF,EACA,EAAU,YAAc"}
+{"version":3,"file":"statistic.mjs","names":[],"sources":["../../packages/components/data-display/statistic.tsx"],"sourcesContent":["'use client';\n\nimport { memo, useCallback, useMemo } from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nconst statisticVariants = cva('inline-flex items-center gap-1 font-number tabular-nums transition-colors', {\n  variants: {\n    size: {\n      xs: 'text-xs',\n      sm: 'text-sm',\n      md: 'text-base',\n      lg: 'text-lg',\n      xl: 'text-xl',\n    },\n    trend: {\n      neutral: 'text-text-positive-strong',\n      up: 'text-success',\n      down: 'text-danger',\n    },\n  },\n  defaultVariants: {\n    size: 'lg',\n    trend: 'neutral',\n  },\n});\n\nexport type StatisticProps = VariantProps<typeof statisticVariants> & {\n  /** Character used to separate the decimal part. Defaults to `'.'`. */\n  decimalSeparator?: string;\n  /** Character used to separate thousands groups. Defaults to `','`. */\n  groupSeparator?: string;\n  /** Optional node rendered before the numeric value (e.g. a currency symbol). */\n  prefix?: React.ReactNode;\n  /** Optional node rendered after the numeric value (e.g. a unit label). */\n  suffix?: React.ReactNode;\n  /** Number of decimal digits to display; omit to show all significant digits. */\n  precision?: number;\n  /** Rounding strategy applied before formatting. Defaults to `'round'`. */\n  roundingMode?: 'round' | 'floor' | 'ceil';\n  /** When `true`, pads the decimal part with trailing zeros up to `precision`. Defaults to `false`. */\n  showTrailingZeros?: boolean;\n  /** The numeric (or numeric-string) value to format and display. */\n  value: number | string;\n  /** Additional CSS classes applied to the wrapper element. */\n  className?: string;\n  /** Colour trend indicator: `'neutral'` (default), `'up'` (green), or `'down'` (red). */\n  trend?: 'neutral' | 'up' | 'down';\n};\n\n/**\n * A memoised numeric display component with locale-aware formatting, optional prefix/suffix, trend colouring, and configurable rounding.\n *\n * @example\n * ```tsx\n * import { Statistic } from '@customafk/lunas-ui/data-display/statistic';\n *\n * <Statistic value={1234567.89} precision={2} prefix=\"$\" trend=\"up\" size=\"lg\" />\n * ```\n */\nexport const Statistic = memo(\n  ({\n    decimalSeparator = '.',\n    groupSeparator = ',',\n    prefix: Prefix,\n    suffix: Suffix,\n    precision,\n    roundingMode = 'round',\n    showTrailingZeros = false,\n    size = 'lg',\n    trend = 'neutral',\n    value,\n    className,\n  }: StatisticProps) => {\n    const applyRounding = useCallback(\n      (num: number, precisionValue: number): number => {\n        const multiplier = 10 ** precisionValue;\n        switch (roundingMode) {\n          case 'floor':\n            return Math.floor(num * multiplier) / multiplier;\n          case 'ceil':\n            return Math.ceil(num * multiplier) / multiplier;\n          default:\n            return Math.round(num * multiplier) / multiplier;\n        }\n      },\n      [roundingMode]\n    );\n\n    const formatOptions = useMemo((): Intl.NumberFormatOptions => {\n      const options: Intl.NumberFormatOptions = {};\n      if (typeof precision === 'number' && precision >= 0) {\n        if (showTrailingZeros) {\n          options.minimumFractionDigits = precision;\n          options.maximumFractionDigits = precision;\n        } else {\n          options.maximumFractionDigits = precision;\n        }\n      }\n      return options;\n    }, [precision, showTrailingZeros]);\n\n    const formatNumber = useCallback(\n      (num: number): string => {\n        let processedNum = num;\n        if (typeof precision === 'number' && precision >= 0) {\n          processedNum = applyRounding(num, precision);\n        }\n        return processedNum.toLocaleString('en-US', formatOptions);\n      },\n      [applyRounding, formatOptions, precision]\n    );\n\n    const processedValue = useMemo((): string => {\n      if (typeof value === 'number') {\n        if (Number.isNaN(value) || !Number.isFinite(value)) return 'N/A';\n        return formatNumber(value);\n      }\n      if (typeof value === 'string') {\n        const trimmedValue = value.trim();\n        if (!trimmedValue) return 'N/A';\n        const numValue = Number(trimmedValue);\n        if (Number.isNaN(numValue) || !Number.isFinite(numValue)) return 'N/A';\n        return formatNumber(numValue);\n      }\n      return 'N/A';\n    }, [value, formatNumber]);\n\n    const finalFormattedValue = useMemo((): string => {\n      if (decimalSeparator === '.' && groupSeparator === ',') return processedValue;\n      return processedValue.replace(/,/g, groupSeparator).replace(/\\./g, decimalSeparator);\n    }, [processedValue, decimalSeparator, groupSeparator]);\n\n    return (\n      <div data-slot=\"statistic\" className={cn(statisticVariants({ size, trend }), className)}>\n        {Prefix && <span data-slot=\"statistic-prefix\">{Prefix}</span>}\n        <p data-slot=\"statistic-value\">{finalFormattedValue}</p>\n        {Suffix && <span data-slot=\"statistic-suffix\">{Suffix}</span>}\n      </div>\n    );\n  }\n);\nStatistic.displayName = 'Statistic';\n"],"mappings":"6NAMA,MAAM,EAAoB,EAAI,4EAA6E,CACzG,SAAU,CACR,KAAM,CACJ,GAAI,UACJ,GAAI,UACJ,GAAI,YACJ,GAAI,UACJ,GAAI,SACN,EACA,MAAO,CACL,QAAS,4BACT,GAAI,eACJ,KAAM,aACR,CACF,EACA,gBAAiB,CACf,KAAM,KACN,MAAO,SACT,CACF,CAAC,EAmCY,EAAY,GACtB,CACC,mBAAmB,IACnB,iBAAiB,IACjB,OAAQ,EACR,OAAQ,EACR,YACA,eAAe,QACf,oBAAoB,GACpB,OAAO,KACP,QAAQ,UACR,QACA,eACoB,CACpB,IAAM,EAAgB,GACnB,EAAa,IAAmC,CAC/C,IAAM,EAAa,IAAM,EACzB,OAAQ,EAAR,CACE,IAAK,QACH,OAAO,KAAK,MAAM,EAAM,CAAU,EAAI,EACxC,IAAK,OACH,OAAO,KAAK,KAAK,EAAM,CAAU,EAAI,EACvC,QACE,OAAO,KAAK,MAAM,EAAM,CAAU,EAAI,CAC1C,CACF,EACA,CAAC,CAAY,CACf,EAEM,EAAgB,MAAwC,CAC5D,IAAM,EAAoC,CAAC,EAS3C,OARI,OAAO,GAAc,UAAY,GAAa,IAC5C,IACF,EAAQ,sBAAwB,GAGhC,EAAQ,sBAAwB,GAG7B,CACT,EAAG,CAAC,EAAW,CAAiB,CAAC,EAE3B,EAAe,EAClB,GAAwB,CACvB,IAAI,EAAe,EAInB,OAHI,OAAO,GAAc,UAAY,GAAa,IAChD,EAAe,EAAc,EAAK,CAAS,GAEtC,EAAa,eAAe,QAAS,CAAa,CAC3D,EACA,CAAC,EAAe,EAAe,CAAS,CAC1C,EAEM,EAAiB,MAAsB,CAC3C,GAAI,OAAO,GAAU,SAEnB,OADI,OAAO,MAAM,CAAK,GAAK,CAAC,OAAO,SAAS,CAAK,EAAU,MACpD,EAAa,CAAK,EAE3B,GAAI,OAAO,GAAU,SAAU,CAC7B,IAAM,EAAe,EAAM,KAAK,EAChC,GAAI,CAAC,EAAc,MAAO,MAC1B,IAAM,EAAW,OAAO,CAAY,EAEpC,OADI,OAAO,MAAM,CAAQ,GAAK,CAAC,OAAO,SAAS,CAAQ,EAAU,MAC1D,EAAa,CAAQ,CAC9B,CACA,MAAO,KACT,EAAG,CAAC,EAAO,CAAY,CAAC,EAElB,EAAsB,MACtB,IAAqB,KAAO,IAAmB,IAAY,EACxD,EAAe,QAAQ,KAAM,CAAc,CAAC,CAAC,QAAQ,MAAO,CAAgB,EAClF,CAAC,EAAgB,EAAkB,CAAc,CAAC,EAErD,OACE,EAAC,MAAD,CAAK,YAAU,YAAY,UAAW,EAAG,EAAkB,CAAE,OAAM,OAAM,CAAC,EAAG,CAAS,EAAtF,SAAA,CACG,GAAU,EAAC,OAAD,CAAM,YAAU,mBAAoB,SAAA,CAAa,CAAA,EAC5D,EAAC,IAAD,CAAG,YAAU,kBAAmB,SAAA,CAAuB,CAAA,EACtD,GAAU,EAAC,OAAD,CAAM,YAAU,mBAAoB,SAAA,CAAa,CAAA,CACzD,GAET,CACF,EACA,EAAU,YAAc"}

package/dist/data-display/user.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"user.cjs","names":["Flex","Avatar","AvatarFallback","colorHashLight","UserRoundIcon","Paragraph"],"sources":["../../packages/components/data-display/user.tsx"],"sourcesContent":["'use client';\n\nimport { UserRoundIcon } from 'lucide-react';\n\nimport { colorHashLight } from '@customafk/react-toolkit/color-hash';\n\nimport { Flex } from '../layouts/flex';\nimport { Paragraph } from '../typography/paragraph';\nimport { Avatar, AvatarFallback } from '../ui/avatar';\n\ntype UserDataDisplayProps = {\n  /** Unique identifier used to deterministically generate the avatar background colour. */\n  uuid: string;\n  /** Display name rendered as the primary line of the user card. */\n  username: string;\n  /** Email address rendered as the secondary, muted line below the username. */\n  email: string;\n};\n\n/**\n * Displays a user identity card with a colour-hashed avatar, username, and email address.\n *\n * @example\n * ```tsx\n * import { UserDataDisplay } from '@customafk/lunas-ui/data-display/user';\n *\n * <UserDataDisplay uuid=\"abc-123\" username=\"Nguyễn Văn An\" email=\"an@example.com\" />\n * ```\n */\nexport const UserDataDisplay: React.FC<UserDataDisplayProps> = ({ uuid, username, email }) => {\n  return (\n    <Flex data-slot=\"user-display\" wrap={false} gap=\"sm\" padding=\"none\">\n      <Avatar className=\"size-10 shadow-card\">\n        <AvatarFallback style={{ backgroundColor: colorHashLight.hex(uuid) }}>\n          <UserRoundIcon size={28} className=\"text-white\" />\n        </AvatarFallback>\n      </Avatar>\n      <Flex vertical padding=\"none\" gap=\"none\" align=\"start\">\n        <Paragraph className=\"text-sm font-medium text-text-positive\">{username}</Paragraph>\n        <Paragraph variant=\"sm\" className=\"mt-0! text-xs text-text-positive-weak\">\n          {email}\n        </Paragraph>\n      </Flex>\n    </Flex>\n  );\n};\n"],"mappings":"4SA6BA,MAAa,GAAmD,CAAE,OAAM,WAAU,YAE9E,EAAA,EAAA,KAAA,CAACA,EAAAA,KAAD,CAAM,YAAU,eAAe,KAAM,GAAO,IAAI,KAAK,QAAQ,gBAA7D,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,OAAD,CAAQ,UAAU,gCAChB,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,MAAO,CAAE,gBAAiBC,EAAAA,eAAe,IAAI,CAAI,CAAE,YACjE,EAAA,EAAA,IAAA,CAACC,EAAAA,cAAD,CAAe,KAAM,GAAI,UAAU,YAAc,CAAA,CACnC,CAAA,CACV,CAAA,GACR,EAAA,EAAA,KAAA,CAACJ,EAAAA,KAAD,CAAM,SAAA,GAAS,QAAQ,OAAO,IAAI,OAAO,MAAM,iBAA/C,EACE,EAAA,EAAA,IAAA,CAACK,EAAAA,UAAD,CAAW,UAAU,kDAA0C,CAAoB,CAAA,GACnF,EAAA,EAAA,IAAA,CAACA,EAAAA,UAAD,CAAW,QAAQ,KAAK,UAAU,iDAC/B,CACQ,CAAA,CACP,GACF"}
+{"version":3,"file":"user.cjs","names":["Flex","Avatar","AvatarFallback","colorHashLight","UserRoundIcon","Paragraph"],"sources":["../../packages/components/data-display/user.tsx"],"sourcesContent":["'use client';\n\nimport { UserRoundIcon } from 'lucide-react';\n\nimport { colorHashLight } from '@customafk/react-toolkit/color-hash';\n\nimport { Flex } from '../layouts/flex';\nimport { Paragraph } from '../typography/paragraph';\nimport { Avatar, AvatarFallback } from '../ui/avatar';\n\ntype UserDataDisplayProps = {\n  /** Unique identifier used to deterministically generate the avatar background colour. */\n  uuid: string;\n  /** Display name rendered as the primary line of the user card. */\n  username: string;\n  /** Email address rendered as the secondary, muted line below the username. */\n  email: string;\n};\n\n/**\n * Displays a user identity card with a colour-hashed avatar, username, and email address.\n *\n * @example\n * ```tsx\n * import { UserDataDisplay } from '@customafk/lunas-ui/data-display/user';\n *\n * <UserDataDisplay uuid=\"abc-123\" username=\"Nguyễn Văn An\" email=\"an@example.com\" />\n * ```\n */\nexport const UserDataDisplay: React.FC<UserDataDisplayProps> = ({ uuid, username, email }) => {\n  return (\n    <Flex data-slot=\"user-display\" wrap={false} gap=\"sm\" padding=\"none\">\n      <Avatar className=\"size-10 shadow-card\">\n        <AvatarFallback style={{ backgroundColor: colorHashLight.hex(uuid) }}>\n          <UserRoundIcon size={28} className=\"text-white\" />\n        </AvatarFallback>\n      </Avatar>\n      <Flex vertical padding=\"none\" gap=\"none\" align=\"start\">\n        <Paragraph className=\"text-sm font-medium text-text-positive\">{username}</Paragraph>\n        <Paragraph variant=\"sm\" className=\"mt-0! text-xs text-text-positive-weak\">\n          {email}\n        </Paragraph>\n      </Flex>\n    </Flex>\n  );\n};\n"],"mappings":"4SA6BA,MAAa,GAAmD,CAAE,OAAM,WAAU,YAE9E,EAAA,EAAA,KAAA,CAACA,EAAAA,KAAD,CAAM,YAAU,eAAe,KAAM,GAAO,IAAI,KAAK,QAAQ,OAA7D,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,OAAD,CAAQ,UAAU,sBAChB,UAAA,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,MAAO,CAAE,gBAAiBC,EAAAA,eAAe,IAAI,CAAI,CAAE,EACjE,UAAA,EAAA,EAAA,IAAA,CAACC,EAAAA,cAAD,CAAe,KAAM,GAAI,UAAU,YAAc,CAAA,CACnC,CAAA,CACV,CAAA,GACR,EAAA,EAAA,KAAA,CAACJ,EAAAA,KAAD,CAAM,SAAA,GAAS,QAAQ,OAAO,IAAI,OAAO,MAAM,QAA/C,SAAA,EACE,EAAA,EAAA,IAAA,CAACK,EAAAA,UAAD,CAAW,UAAU,yCAA0C,SAAA,CAAoB,CAAA,GACnF,EAAA,EAAA,IAAA,CAACA,EAAAA,UAAD,CAAW,QAAQ,KAAK,UAAU,wCAC/B,SAAA,CACQ,CAAA,CACP,CACF,CAAA,CAAA"}

package/dist/data-display/user.d.cts

@@ -1,2 +1,2 @@
-import { t as UserDataDisplay } from "../user-CvesQf42.cjs";
+import { t as UserDataDisplay } from "../user-D46H2MOh.cjs";
 export { UserDataDisplay };

package/dist/data-display/user.d.mts

@@ -1,2 +1,2 @@
-import { t as UserDataDisplay } from "../user-CvesQf42.mjs";
+import { t as UserDataDisplay } from "../user-D46H2MOh.mjs";
 export { UserDataDisplay };

package/dist/data-display/user.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"user.mjs","names":[],"sources":["../../packages/components/data-display/user.tsx"],"sourcesContent":["'use client';\n\nimport { UserRoundIcon } from 'lucide-react';\n\nimport { colorHashLight } from '@customafk/react-toolkit/color-hash';\n\nimport { Flex } from '../layouts/flex';\nimport { Paragraph } from '../typography/paragraph';\nimport { Avatar, AvatarFallback } from '../ui/avatar';\n\ntype UserDataDisplayProps = {\n  /** Unique identifier used to deterministically generate the avatar background colour. */\n  uuid: string;\n  /** Display name rendered as the primary line of the user card. */\n  username: string;\n  /** Email address rendered as the secondary, muted line below the username. */\n  email: string;\n};\n\n/**\n * Displays a user identity card with a colour-hashed avatar, username, and email address.\n *\n * @example\n * ```tsx\n * import { UserDataDisplay } from '@customafk/lunas-ui/data-display/user';\n *\n * <UserDataDisplay uuid=\"abc-123\" username=\"Nguyễn Văn An\" email=\"an@example.com\" />\n * ```\n */\nexport const UserDataDisplay: React.FC<UserDataDisplayProps> = ({ uuid, username, email }) => {\n  return (\n    <Flex data-slot=\"user-display\" wrap={false} gap=\"sm\" padding=\"none\">\n      <Avatar className=\"size-10 shadow-card\">\n        <AvatarFallback style={{ backgroundColor: colorHashLight.hex(uuid) }}>\n          <UserRoundIcon size={28} className=\"text-white\" />\n        </AvatarFallback>\n      </Avatar>\n      <Flex vertical padding=\"none\" gap=\"none\" align=\"start\">\n        <Paragraph className=\"text-sm font-medium text-text-positive\">{username}</Paragraph>\n        <Paragraph variant=\"sm\" className=\"mt-0! text-xs text-text-positive-weak\">\n          {email}\n        </Paragraph>\n      </Flex>\n    </Flex>\n  );\n};\n"],"mappings":"kVA6BA,MAAa,GAAmD,CAAE,OAAM,WAAU,WAE9E,EAAC,EAAD,CAAM,YAAU,eAAe,KAAM,GAAO,IAAI,KAAK,QAAQ,gBAA7D,CACE,EAAC,EAAD,CAAQ,UAAU,+BAChB,EAAC,EAAD,CAAgB,MAAO,CAAE,gBAAiB,EAAe,IAAI,CAAI,CAAE,WACjE,EAAC,EAAD,CAAe,KAAM,GAAI,UAAU,YAAc,CAAA,CACnC,CAAA,CACV,CAAA,EACR,EAAC,EAAD,CAAM,SAAA,GAAS,QAAQ,OAAO,IAAI,OAAO,MAAM,iBAA/C,CACE,EAAC,EAAD,CAAW,UAAU,kDAA0C,CAAoB,CAAA,EACnF,EAAC,EAAD,CAAW,QAAQ,KAAK,UAAU,iDAC/B,CACQ,CAAA,CACP,GACF"}
+{"version":3,"file":"user.mjs","names":[],"sources":["../../packages/components/data-display/user.tsx"],"sourcesContent":["'use client';\n\nimport { UserRoundIcon } from 'lucide-react';\n\nimport { colorHashLight } from '@customafk/react-toolkit/color-hash';\n\nimport { Flex } from '../layouts/flex';\nimport { Paragraph } from '../typography/paragraph';\nimport { Avatar, AvatarFallback } from '../ui/avatar';\n\ntype UserDataDisplayProps = {\n  /** Unique identifier used to deterministically generate the avatar background colour. */\n  uuid: string;\n  /** Display name rendered as the primary line of the user card. */\n  username: string;\n  /** Email address rendered as the secondary, muted line below the username. */\n  email: string;\n};\n\n/**\n * Displays a user identity card with a colour-hashed avatar, username, and email address.\n *\n * @example\n * ```tsx\n * import { UserDataDisplay } from '@customafk/lunas-ui/data-display/user';\n *\n * <UserDataDisplay uuid=\"abc-123\" username=\"Nguyễn Văn An\" email=\"an@example.com\" />\n * ```\n */\nexport const UserDataDisplay: React.FC<UserDataDisplayProps> = ({ uuid, username, email }) => {\n  return (\n    <Flex data-slot=\"user-display\" wrap={false} gap=\"sm\" padding=\"none\">\n      <Avatar className=\"size-10 shadow-card\">\n        <AvatarFallback style={{ backgroundColor: colorHashLight.hex(uuid) }}>\n          <UserRoundIcon size={28} className=\"text-white\" />\n        </AvatarFallback>\n      </Avatar>\n      <Flex vertical padding=\"none\" gap=\"none\" align=\"start\">\n        <Paragraph className=\"text-sm font-medium text-text-positive\">{username}</Paragraph>\n        <Paragraph variant=\"sm\" className=\"mt-0! text-xs text-text-positive-weak\">\n          {email}\n        </Paragraph>\n      </Flex>\n    </Flex>\n  );\n};\n"],"mappings":"kVA6BA,MAAa,GAAmD,CAAE,OAAM,WAAU,WAE9E,EAAC,EAAD,CAAM,YAAU,eAAe,KAAM,GAAO,IAAI,KAAK,QAAQ,OAA7D,SAAA,CACE,EAAC,EAAD,CAAQ,UAAU,sBAChB,SAAA,EAAC,EAAD,CAAgB,MAAO,CAAE,gBAAiB,EAAe,IAAI,CAAI,CAAE,EACjE,SAAA,EAAC,EAAD,CAAe,KAAM,GAAI,UAAU,YAAc,CAAA,CACnC,CAAA,CACV,CAAA,EACR,EAAC,EAAD,CAAM,SAAA,GAAS,QAAQ,OAAO,IAAI,OAAO,MAAM,QAA/C,SAAA,CACE,EAAC,EAAD,CAAW,UAAU,yCAA0C,SAAA,CAAoB,CAAA,EACnF,EAAC,EAAD,CAAW,QAAQ,KAAK,UAAU,wCAC/B,SAAA,CACQ,CAAA,CACP,CACF,CAAA,CAAA"}

package/dist/{data-list-Cg510z2m.d.cts → data-list-BRHjqVUT.d.cts}

@@ -1,6 +1,7 @@
 //#region packages/components/data-display/data-list.d.ts
 type DataListProps = {
-  /** Additional CSS classes applied to the wrapping container. */className?: string;
+  /** Additional CSS classes applied to the wrapping container. */
+  className?: string;
 };
 /**
  * A vertical container that stacks `DataListItem` rows with consistent spacing.
@@ -17,9 +18,13 @@ type DataListProps = {
  */
 declare const DataList: React.FC<React.PropsWithChildren<DataListProps>>;
 type DataListItemProps = {
-  /** Descriptive label shown to the left of (or above, on mobile) the value. */label: string; /** The value to display; accepts strings, numbers, or arbitrary React nodes. */
-  value: string | number | React.ReactNode; /** Minimum width applied to the label column. Defaults to `'120px'`. */
-  minLabelWidth?: string; /** Additional CSS classes applied to the row container. */
+  /** Descriptive label shown to the left of (or above, on mobile) the value. */
+  label: string;
+  /** The value to display; accepts strings, numbers, or arbitrary React nodes. */
+  value: string | number | React.ReactNode;
+  /** Minimum width applied to the label column. Defaults to `'120px'`. */
+  minLabelWidth?: string;
+  /** Additional CSS classes applied to the row container. */
   className?: string;
 };
 /**
@@ -35,4 +40,4 @@ type DataListItemProps = {
 declare const DataListItem: React.FC<DataListItemProps>;
 //#endregion
 export { DataListItem as n, DataList as t };
-//# sourceMappingURL=data-list-Cg510z2m.d.cts.map
+//# sourceMappingURL=data-list-BRHjqVUT.d.cts.map

package/dist/{data-list-Cg510z2m.d.mts → data-list-BRHjqVUT.d.mts}

@@ -1,6 +1,7 @@
 //#region packages/components/data-display/data-list.d.ts
 type DataListProps = {
-  /** Additional CSS classes applied to the wrapping container. */className?: string;
+  /** Additional CSS classes applied to the wrapping container. */
+  className?: string;
 };
 /**
  * A vertical container that stacks `DataListItem` rows with consistent spacing.
@@ -17,9 +18,13 @@ type DataListProps = {
  */
 declare const DataList: React.FC<React.PropsWithChildren<DataListProps>>;
 type DataListItemProps = {
-  /** Descriptive label shown to the left of (or above, on mobile) the value. */label: string; /** The value to display; accepts strings, numbers, or arbitrary React nodes. */
-  value: string | number | React.ReactNode; /** Minimum width applied to the label column. Defaults to `'120px'`. */
-  minLabelWidth?: string; /** Additional CSS classes applied to the row container. */
+  /** Descriptive label shown to the left of (or above, on mobile) the value. */
+  label: string;
+  /** The value to display; accepts strings, numbers, or arbitrary React nodes. */
+  value: string | number | React.ReactNode;
+  /** Minimum width applied to the label column. Defaults to `'120px'`. */
+  minLabelWidth?: string;
+  /** Additional CSS classes applied to the row container. */
   className?: string;
 };
 /**
@@ -35,4 +40,4 @@ type DataListItemProps = {
 declare const DataListItem: React.FC<DataListItemProps>;
 //#endregion
 export { DataListItem as n, DataList as t };
-//# sourceMappingURL=data-list-Cg510z2m.d.mts.map
+//# sourceMappingURL=data-list-BRHjqVUT.d.mts.map

package/dist/date-B3cozmfV.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"date-B3cozmfV.cjs","names":[],"sources":["../packages/constants.tsx","../packages/components/data-display/date.tsx"],"sourcesContent":["// Vietnamese locale configuration\nexport const vietnameseLocale = {\n  weekdays: ['Chủ Nhật', 'Thứ Hai', 'Thứ Ba', 'Thứ Tư', 'Thứ Năm', 'Thứ Sáu', 'Thứ Bảy'],\n  weekdaysShort: ['CN', 'T2', 'T3', 'T4', 'T5', 'T6', 'T7'],\n  months: ['Tháng 01', 'Tháng 02', 'Tháng 03', 'Tháng 04', 'Tháng 05', 'Tháng 06', 'Tháng 07', 'Tháng 08', 'Tháng 09', 'Tháng 10', 'Tháng 11', 'Tháng 12'],\n  monthsShort: ['T1', 'T2', 'T3', 'T4', 'T5', 'T6', 'T7', 'T8', 'T9', 'T10', 'T11', 'T12'],\n};\n\n// Vietnamese holidays\nexport const vietnameseHolidays = {\n  '01-01': 'Tết Dương lịch',\n  '03-08': 'Quốc tế Phụ nữ',\n  '04-30': 'Ngày Giải phóng miền Nam',\n  '05-01': 'Quốc tế Lao động',\n  '09-02': 'Quốc khánh',\n  '10-20': 'Ngày Phụ nữ Việt Nam',\n  '11-20': 'Ngày Nhà giáo Việt Nam',\n};\n\n// Time Constants in milliseconds, seconds, and minutes\nexport const TIME_IN_MS = Object.freeze({\n  SECOND: 1000,\n  MINUTE: 60 * 1000,\n  HOUR: 60 * 60 * 1000,\n  DAY: 24 * 60 * 60 * 1000,\n  WEEK: 7 * 24 * 60 * 60 * 1000,\n  MONTH: 30 * 24 * 60 * 60 * 1000, // Approximation for month length = 30 days\n  YEAR: 365 * 24 * 60 * 60 * 1000,\n});\n\nexport const TIME_IN_SECONDS = Object.freeze({\n  MINUTE: 60,\n  HOUR: 60 * 60,\n  DAY: 24 * 60 * 60,\n  WEEK: 7 * 24 * 60 * 60,\n  MONTH: 30 * 24 * 60 * 60,\n  YEAR: 365 * 24 * 60 * 60,\n});\n\nexport const TIME_IN_MINUTES = Object.freeze({\n  HOUR: 60,\n  DAY: 24 * 60,\n  WEEK: 7 * 24 * 60,\n  MONTH: 30 * 24 * 60,\n});\n","'use client';\n\nimport { useCallback, useMemo } from 'react';\n\nimport { format, isThisMonth, isThisWeek, isThisYear, isToday, isTomorrow, isValid, isYesterday, parseISO } from '@customafk/react-toolkit/date-fns';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { TIME_IN_SECONDS, vietnameseHolidays, vietnameseLocale } from '@/constants';\n\ninterface DateDisplayProps {\n  /** The date value to display; accepts a `Date` object, an ISO string, or a Unix timestamp (ms). */\n  date: Date | string | number;\n  /**\n   * Controls how the date is formatted.\n   * - `'short'`    — `15/03/24`\n   * - `'medium'`   — `15/03/2024` (default)\n   * - `'long'`     — `15 tháng 3, 2024`\n   * - `'full'`     — `Thứ Sáu, ngày 15 tháng 3 năm 2024`\n   * - `'relative'` — `2 giờ trước`\n   * - `'datetime'` — `15/03/2024 14:30`\n   * - `'time'`     — `14:30`\n   * - `'smart'`    — auto-selects the most human-readable format based on recency\n   */\n  format?:\n    | 'short' // 15/03/24\n    | 'medium' // 15/03/2024\n    | 'long' // 15 tháng 3, 2024\n    | 'full' // Thứ Sáu, ngày 15 tháng 3 năm 2024\n    | 'relative' // 2 giờ trước\n    | 'datetime' // 15/03/2024 14:30\n    | 'time' // 14:30\n    | 'smart'; // auto-selects format based on recency\n  /** When `true`, appends any recognised Vietnamese public holiday name to the formatted date. Defaults to `false`. */\n  showHoliday?: boolean;\n  /** When `true`, appends the time component to the formatted output. Defaults to `false`. */\n  showTime?: boolean;\n  /** Additional CSS classes applied to the `<time>` element. */\n  className?: string;\n  /** Custom HTML `title` attribute; defaults to the full ISO datetime string. */\n  title?: string;\n}\n\n/**\n * Renders a formatted date using Vietnamese locale conventions inside a semantic `<time>` element.\n *\n * @example\n * ```tsx\n * import { DateDisplay } from '@customafk/lunas-ui/data-display/date';\n *\n * <DateDisplay date=\"2024-03-15T14:30:00Z\" format=\"medium\" showTime />\n * ```\n */\nexport const DateDisplay: React.FC<DateDisplayProps> = ({\n  date,\n  format: formatType = 'medium',\n  showHoliday = false,\n  showTime = false,\n  className = '',\n  title,\n}) => {\n  const parsedDate = useMemo(() => {\n    try {\n      if (date instanceof Date) return isValid(date) ? date : null;\n      if (typeof date === 'string') {\n        const parsed = parseISO(date);\n        return isValid(parsed) ? parsed : new Date(date);\n      }\n      if (typeof date === 'number') {\n        const parsed = new Date(date);\n        return isValid(parsed) ? parsed : null;\n      }\n      return null;\n    } catch {\n      return null;\n    }\n  }, [date]);\n\n  const formatRelativeTime = useCallback((d: Date): string => {\n    const diffInSeconds = Math.floor((Date.now() - d.getTime()) / 1000);\n    if (diffInSeconds < 60) return 'Vừa xong';\n    if (diffInSeconds < 3600) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.MINUTE)} phút trước`;\n    if (diffInSeconds < 86400) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.HOUR)} giờ trước`;\n    if (diffInSeconds < 604800) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.DAY)} ngày trước`;\n    if (diffInSeconds < 2592000) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.WEEK)} tuần trước`;\n    if (diffInSeconds < 31536000) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.MONTH)} tháng trước`;\n    return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.YEAR)} năm trước`;\n  }, []);\n\n  const getVietnameseWeekday = useCallback((d: Date, short = false): string => {\n    return short ? vietnameseLocale.weekdaysShort[d.getDay()] : vietnameseLocale.weekdays[d.getDay()];\n  }, []);\n\n  const getVietnameseMonth = useCallback((d: Date, short = false): string => {\n    return short ? vietnameseLocale.monthsShort[d.getMonth()] : vietnameseLocale.months[d.getMonth()];\n  }, []);\n\n  const getHoliday = useCallback((d: Date): string | null => {\n    const monthDay = format(d, 'MM-dd') as keyof typeof vietnameseHolidays;\n    return vietnameseHolidays[monthDay] || null;\n  }, []);\n\n  const getSmartFormat = useCallback(\n    (d: Date): string => {\n      if (isToday(d)) return showTime ? `Hôm nay ${format(d, 'HH:mm')}` : 'Hôm nay';\n      if (isYesterday(d)) return showTime ? `Hôm qua ${format(d, 'HH:mm')}` : 'Hôm qua';\n      if (isTomorrow(d)) return showTime ? `Ngày mai ${format(d, 'HH:mm')}` : 'Ngày mai';\n      if (isThisWeek(d)) {\n        const weekday = getVietnameseWeekday(d);\n        return showTime ? `${weekday} ${format(d, 'HH:mm')}` : weekday;\n      }\n      if (isThisMonth(d)) {\n        const day = format(d, 'd');\n        return showTime ? `${day}/${format(d, 'M')} ${format(d, 'HH:mm')}` : `${day}/${format(d, 'M')}`;\n      }\n      if (isThisYear(d)) return showTime ? format(d, 'd/M HH:mm') : format(d, 'd/M');\n      return showTime ? format(d, 'd/M/yyyy HH:mm') : format(d, 'd/M/yyyy');\n    },\n    [getVietnameseWeekday, showTime]\n  );\n\n  const formatDate = useCallback(\n    (d: Date, type: string): string => {\n      const timeStr = showTime ? format(d, ', HH:mm:ss') : '';\n      switch (type) {\n        case 'short':\n          return format(d, 'd/M/yy') + timeStr;\n        case 'medium':\n          return format(d, 'dd/MM/yyyy') + timeStr;\n        case 'long':\n          return `${format(d, 'd')} ${getVietnameseMonth(d)} ${format(d, 'yyyy')}` + timeStr;\n        case 'full':\n          return `${getVietnameseWeekday(d)}, ngày ${format(d, 'd')} ${getVietnameseMonth(d)} năm ${format(d, 'yyyy')}` + timeStr;\n        case 'relative':\n          return formatRelativeTime(d);\n        case 'datetime':\n          return format(d, 'd/M/yyyy HH:mm');\n        case 'time':\n          return format(d, 'HH:mm');\n        case 'smart':\n          return getSmartFormat(d);\n        default:\n          return format(d, 'd/M/yyyy') + timeStr;\n      }\n    },\n    [getSmartFormat, getVietnameseMonth, getVietnameseWeekday, formatRelativeTime, showTime]\n  );\n\n  if (!parsedDate) {\n    return <span className={cn('text-sm text-text-positive-subtle', className)}>--/--/----</span>;\n  }\n\n  const formattedDate = formatDate(parsedDate, formatType);\n  const holiday = showHoliday ? getHoliday(parsedDate) : null;\n  const displayText = holiday ? `${formattedDate} (${holiday})` : formattedDate;\n  const tooltipTitle = title || format(parsedDate, 'EEEE, d MMMM yyyy HH:mm:ss');\n\n  return (\n    <time\n      data-slot=\"date-display\"\n      dateTime={parsedDate.toISOString()}\n      className={cn('tabular-nums text-xs text-text-positive-weak transition-colors', className)}\n      title={tooltipTitle}\n    >\n      {displayText}\n    </time>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"date-B3cozmfV.cjs","names":[],"sources":["../packages/constants.tsx","../packages/components/data-display/date.tsx"],"sourcesContent":["// Vietnamese locale configuration\nexport const vietnameseLocale = {\n  weekdays: ['Chủ Nhật', 'Thứ Hai', 'Thứ Ba', 'Thứ Tư', 'Thứ Năm', 'Thứ Sáu', 'Thứ Bảy'],\n  weekdaysShort: ['CN', 'T2', 'T3', 'T4', 'T5', 'T6', 'T7'],\n  months: ['Tháng 01', 'Tháng 02', 'Tháng 03', 'Tháng 04', 'Tháng 05', 'Tháng 06', 'Tháng 07', 'Tháng 08', 'Tháng 09', 'Tháng 10', 'Tháng 11', 'Tháng 12'],\n  monthsShort: ['T1', 'T2', 'T3', 'T4', 'T5', 'T6', 'T7', 'T8', 'T9', 'T10', 'T11', 'T12'],\n};\n\n// Vietnamese holidays\nexport const vietnameseHolidays = {\n  '01-01': 'Tết Dương lịch',\n  '03-08': 'Quốc tế Phụ nữ',\n  '04-30': 'Ngày Giải phóng miền Nam',\n  '05-01': 'Quốc tế Lao động',\n  '09-02': 'Quốc khánh',\n  '10-20': 'Ngày Phụ nữ Việt Nam',\n  '11-20': 'Ngày Nhà giáo Việt Nam',\n};\n\n// Time Constants in milliseconds, seconds, and minutes\nexport const TIME_IN_MS = Object.freeze({\n  SECOND: 1000,\n  MINUTE: 60 * 1000,\n  HOUR: 60 * 60 * 1000,\n  DAY: 24 * 60 * 60 * 1000,\n  WEEK: 7 * 24 * 60 * 60 * 1000,\n  MONTH: 30 * 24 * 60 * 60 * 1000, // Approximation for month length = 30 days\n  YEAR: 365 * 24 * 60 * 60 * 1000,\n});\n\nexport const TIME_IN_SECONDS = Object.freeze({\n  MINUTE: 60,\n  HOUR: 60 * 60,\n  DAY: 24 * 60 * 60,\n  WEEK: 7 * 24 * 60 * 60,\n  MONTH: 30 * 24 * 60 * 60,\n  YEAR: 365 * 24 * 60 * 60,\n});\n\nexport const TIME_IN_MINUTES = Object.freeze({\n  HOUR: 60,\n  DAY: 24 * 60,\n  WEEK: 7 * 24 * 60,\n  MONTH: 30 * 24 * 60,\n});\n","'use client';\n\nimport { useCallback, useMemo } from 'react';\n\nimport { format, isThisMonth, isThisWeek, isThisYear, isToday, isTomorrow, isValid, isYesterday, parseISO } from '@customafk/react-toolkit/date-fns';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { TIME_IN_SECONDS, vietnameseHolidays, vietnameseLocale } from '@/constants';\n\ninterface DateDisplayProps {\n  /** The date value to display; accepts a `Date` object, an ISO string, or a Unix timestamp (ms). */\n  date: Date | string | number;\n  /**\n   * Controls how the date is formatted.\n   * - `'short'`    — `15/03/24`\n   * - `'medium'`   — `15/03/2024` (default)\n   * - `'long'`     — `15 tháng 3, 2024`\n   * - `'full'`     — `Thứ Sáu, ngày 15 tháng 3 năm 2024`\n   * - `'relative'` — `2 giờ trước`\n   * - `'datetime'` — `15/03/2024 14:30`\n   * - `'time'`     — `14:30`\n   * - `'smart'`    — auto-selects the most human-readable format based on recency\n   */\n  format?:\n    | 'short' // 15/03/24\n    | 'medium' // 15/03/2024\n    | 'long' // 15 tháng 3, 2024\n    | 'full' // Thứ Sáu, ngày 15 tháng 3 năm 2024\n    | 'relative' // 2 giờ trước\n    | 'datetime' // 15/03/2024 14:30\n    | 'time' // 14:30\n    | 'smart'; // auto-selects format based on recency\n  /** When `true`, appends any recognised Vietnamese public holiday name to the formatted date. Defaults to `false`. */\n  showHoliday?: boolean;\n  /** When `true`, appends the time component to the formatted output. Defaults to `false`. */\n  showTime?: boolean;\n  /** Additional CSS classes applied to the `<time>` element. */\n  className?: string;\n  /** Custom HTML `title` attribute; defaults to the full ISO datetime string. */\n  title?: string;\n}\n\n/**\n * Renders a formatted date using Vietnamese locale conventions inside a semantic `<time>` element.\n *\n * @example\n * ```tsx\n * import { DateDisplay } from '@customafk/lunas-ui/data-display/date';\n *\n * <DateDisplay date=\"2024-03-15T14:30:00Z\" format=\"medium\" showTime />\n * ```\n */\nexport const DateDisplay: React.FC<DateDisplayProps> = ({\n  date,\n  format: formatType = 'medium',\n  showHoliday = false,\n  showTime = false,\n  className = '',\n  title,\n}) => {\n  const parsedDate = useMemo(() => {\n    try {\n      if (date instanceof Date) return isValid(date) ? date : null;\n      if (typeof date === 'string') {\n        const parsed = parseISO(date);\n        return isValid(parsed) ? parsed : new Date(date);\n      }\n      if (typeof date === 'number') {\n        const parsed = new Date(date);\n        return isValid(parsed) ? parsed : null;\n      }\n      return null;\n    } catch {\n      return null;\n    }\n  }, [date]);\n\n  const formatRelativeTime = useCallback((d: Date): string => {\n    const diffInSeconds = Math.floor((Date.now() - d.getTime()) / 1000);\n    if (diffInSeconds < 60) return 'Vừa xong';\n    if (diffInSeconds < 3600) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.MINUTE)} phút trước`;\n    if (diffInSeconds < 86400) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.HOUR)} giờ trước`;\n    if (diffInSeconds < 604800) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.DAY)} ngày trước`;\n    if (diffInSeconds < 2592000) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.WEEK)} tuần trước`;\n    if (diffInSeconds < 31536000) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.MONTH)} tháng trước`;\n    return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.YEAR)} năm trước`;\n  }, []);\n\n  const getVietnameseWeekday = useCallback((d: Date, short = false): string => {\n    return short ? vietnameseLocale.weekdaysShort[d.getDay()] : vietnameseLocale.weekdays[d.getDay()];\n  }, []);\n\n  const getVietnameseMonth = useCallback((d: Date, short = false): string => {\n    return short ? vietnameseLocale.monthsShort[d.getMonth()] : vietnameseLocale.months[d.getMonth()];\n  }, []);\n\n  const getHoliday = useCallback((d: Date): string | null => {\n    const monthDay = format(d, 'MM-dd') as keyof typeof vietnameseHolidays;\n    return vietnameseHolidays[monthDay] || null;\n  }, []);\n\n  const getSmartFormat = useCallback(\n    (d: Date): string => {\n      if (isToday(d)) return showTime ? `Hôm nay ${format(d, 'HH:mm')}` : 'Hôm nay';\n      if (isYesterday(d)) return showTime ? `Hôm qua ${format(d, 'HH:mm')}` : 'Hôm qua';\n      if (isTomorrow(d)) return showTime ? `Ngày mai ${format(d, 'HH:mm')}` : 'Ngày mai';\n      if (isThisWeek(d)) {\n        const weekday = getVietnameseWeekday(d);\n        return showTime ? `${weekday} ${format(d, 'HH:mm')}` : weekday;\n      }\n      if (isThisMonth(d)) {\n        const day = format(d, 'd');\n        return showTime ? `${day}/${format(d, 'M')} ${format(d, 'HH:mm')}` : `${day}/${format(d, 'M')}`;\n      }\n      if (isThisYear(d)) return showTime ? format(d, 'd/M HH:mm') : format(d, 'd/M');\n      return showTime ? format(d, 'd/M/yyyy HH:mm') : format(d, 'd/M/yyyy');\n    },\n    [getVietnameseWeekday, showTime]\n  );\n\n  const formatDate = useCallback(\n    (d: Date, type: string): string => {\n      const timeStr = showTime ? format(d, ', HH:mm:ss') : '';\n      switch (type) {\n        case 'short':\n          return format(d, 'd/M/yy') + timeStr;\n        case 'medium':\n          return format(d, 'dd/MM/yyyy') + timeStr;\n        case 'long':\n          return `${format(d, 'd')} ${getVietnameseMonth(d)} ${format(d, 'yyyy')}` + timeStr;\n        case 'full':\n          return `${getVietnameseWeekday(d)}, ngày ${format(d, 'd')} ${getVietnameseMonth(d)} năm ${format(d, 'yyyy')}` + timeStr;\n        case 'relative':\n          return formatRelativeTime(d);\n        case 'datetime':\n          return format(d, 'd/M/yyyy HH:mm');\n        case 'time':\n          return format(d, 'HH:mm');\n        case 'smart':\n          return getSmartFormat(d);\n        default:\n          return format(d, 'd/M/yyyy') + timeStr;\n      }\n    },\n    [getSmartFormat, getVietnameseMonth, getVietnameseWeekday, formatRelativeTime, showTime]\n  );\n\n  if (!parsedDate) {\n    return <span className={cn('text-sm text-text-positive-subtle', className)}>--/--/----</span>;\n  }\n\n  const formattedDate = formatDate(parsedDate, formatType);\n  const holiday = showHoliday ? getHoliday(parsedDate) : null;\n  const displayText = holiday ? `${formattedDate} (${holiday})` : formattedDate;\n  const tooltipTitle = title || format(parsedDate, 'EEEE, d MMMM yyyy HH:mm:ss');\n\n  return (\n    <time\n      data-slot=\"date-display\"\n      dateTime={parsedDate.toISOString()}\n      className={cn('tabular-nums text-xs text-text-positive-weak transition-colors', className)}\n      title={tooltipTitle}\n    >\n      {displayText}\n    </time>\n  );\n};\n"],"mappings":"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"}

package/dist/date-Nsz0Pewe.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"date-Nsz0Pewe.mjs","names":[],"sources":["../packages/constants.tsx","../packages/components/data-display/date.tsx"],"sourcesContent":["// Vietnamese locale configuration\nexport const vietnameseLocale = {\n  weekdays: ['Chủ Nhật', 'Thứ Hai', 'Thứ Ba', 'Thứ Tư', 'Thứ Năm', 'Thứ Sáu', 'Thứ Bảy'],\n  weekdaysShort: ['CN', 'T2', 'T3', 'T4', 'T5', 'T6', 'T7'],\n  months: ['Tháng 01', 'Tháng 02', 'Tháng 03', 'Tháng 04', 'Tháng 05', 'Tháng 06', 'Tháng 07', 'Tháng 08', 'Tháng 09', 'Tháng 10', 'Tháng 11', 'Tháng 12'],\n  monthsShort: ['T1', 'T2', 'T3', 'T4', 'T5', 'T6', 'T7', 'T8', 'T9', 'T10', 'T11', 'T12'],\n};\n\n// Vietnamese holidays\nexport const vietnameseHolidays = {\n  '01-01': 'Tết Dương lịch',\n  '03-08': 'Quốc tế Phụ nữ',\n  '04-30': 'Ngày Giải phóng miền Nam',\n  '05-01': 'Quốc tế Lao động',\n  '09-02': 'Quốc khánh',\n  '10-20': 'Ngày Phụ nữ Việt Nam',\n  '11-20': 'Ngày Nhà giáo Việt Nam',\n};\n\n// Time Constants in milliseconds, seconds, and minutes\nexport const TIME_IN_MS = Object.freeze({\n  SECOND: 1000,\n  MINUTE: 60 * 1000,\n  HOUR: 60 * 60 * 1000,\n  DAY: 24 * 60 * 60 * 1000,\n  WEEK: 7 * 24 * 60 * 60 * 1000,\n  MONTH: 30 * 24 * 60 * 60 * 1000, // Approximation for month length = 30 days\n  YEAR: 365 * 24 * 60 * 60 * 1000,\n});\n\nexport const TIME_IN_SECONDS = Object.freeze({\n  MINUTE: 60,\n  HOUR: 60 * 60,\n  DAY: 24 * 60 * 60,\n  WEEK: 7 * 24 * 60 * 60,\n  MONTH: 30 * 24 * 60 * 60,\n  YEAR: 365 * 24 * 60 * 60,\n});\n\nexport const TIME_IN_MINUTES = Object.freeze({\n  HOUR: 60,\n  DAY: 24 * 60,\n  WEEK: 7 * 24 * 60,\n  MONTH: 30 * 24 * 60,\n});\n","'use client';\n\nimport { useCallback, useMemo } from 'react';\n\nimport { format, isThisMonth, isThisWeek, isThisYear, isToday, isTomorrow, isValid, isYesterday, parseISO } from '@customafk/react-toolkit/date-fns';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { TIME_IN_SECONDS, vietnameseHolidays, vietnameseLocale } from '@/constants';\n\ninterface DateDisplayProps {\n  /** The date value to display; accepts a `Date` object, an ISO string, or a Unix timestamp (ms). */\n  date: Date | string | number;\n  /**\n   * Controls how the date is formatted.\n   * - `'short'`    — `15/03/24`\n   * - `'medium'`   — `15/03/2024` (default)\n   * - `'long'`     — `15 tháng 3, 2024`\n   * - `'full'`     — `Thứ Sáu, ngày 15 tháng 3 năm 2024`\n   * - `'relative'` — `2 giờ trước`\n   * - `'datetime'` — `15/03/2024 14:30`\n   * - `'time'`     — `14:30`\n   * - `'smart'`    — auto-selects the most human-readable format based on recency\n   */\n  format?:\n    | 'short' // 15/03/24\n    | 'medium' // 15/03/2024\n    | 'long' // 15 tháng 3, 2024\n    | 'full' // Thứ Sáu, ngày 15 tháng 3 năm 2024\n    | 'relative' // 2 giờ trước\n    | 'datetime' // 15/03/2024 14:30\n    | 'time' // 14:30\n    | 'smart'; // auto-selects format based on recency\n  /** When `true`, appends any recognised Vietnamese public holiday name to the formatted date. Defaults to `false`. */\n  showHoliday?: boolean;\n  /** When `true`, appends the time component to the formatted output. Defaults to `false`. */\n  showTime?: boolean;\n  /** Additional CSS classes applied to the `<time>` element. */\n  className?: string;\n  /** Custom HTML `title` attribute; defaults to the full ISO datetime string. */\n  title?: string;\n}\n\n/**\n * Renders a formatted date using Vietnamese locale conventions inside a semantic `<time>` element.\n *\n * @example\n * ```tsx\n * import { DateDisplay } from '@customafk/lunas-ui/data-display/date';\n *\n * <DateDisplay date=\"2024-03-15T14:30:00Z\" format=\"medium\" showTime />\n * ```\n */\nexport const DateDisplay: React.FC<DateDisplayProps> = ({\n  date,\n  format: formatType = 'medium',\n  showHoliday = false,\n  showTime = false,\n  className = '',\n  title,\n}) => {\n  const parsedDate = useMemo(() => {\n    try {\n      if (date instanceof Date) return isValid(date) ? date : null;\n      if (typeof date === 'string') {\n        const parsed = parseISO(date);\n        return isValid(parsed) ? parsed : new Date(date);\n      }\n      if (typeof date === 'number') {\n        const parsed = new Date(date);\n        return isValid(parsed) ? parsed : null;\n      }\n      return null;\n    } catch {\n      return null;\n    }\n  }, [date]);\n\n  const formatRelativeTime = useCallback((d: Date): string => {\n    const diffInSeconds = Math.floor((Date.now() - d.getTime()) / 1000);\n    if (diffInSeconds < 60) return 'Vừa xong';\n    if (diffInSeconds < 3600) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.MINUTE)} phút trước`;\n    if (diffInSeconds < 86400) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.HOUR)} giờ trước`;\n    if (diffInSeconds < 604800) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.DAY)} ngày trước`;\n    if (diffInSeconds < 2592000) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.WEEK)} tuần trước`;\n    if (diffInSeconds < 31536000) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.MONTH)} tháng trước`;\n    return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.YEAR)} năm trước`;\n  }, []);\n\n  const getVietnameseWeekday = useCallback((d: Date, short = false): string => {\n    return short ? vietnameseLocale.weekdaysShort[d.getDay()] : vietnameseLocale.weekdays[d.getDay()];\n  }, []);\n\n  const getVietnameseMonth = useCallback((d: Date, short = false): string => {\n    return short ? vietnameseLocale.monthsShort[d.getMonth()] : vietnameseLocale.months[d.getMonth()];\n  }, []);\n\n  const getHoliday = useCallback((d: Date): string | null => {\n    const monthDay = format(d, 'MM-dd') as keyof typeof vietnameseHolidays;\n    return vietnameseHolidays[monthDay] || null;\n  }, []);\n\n  const getSmartFormat = useCallback(\n    (d: Date): string => {\n      if (isToday(d)) return showTime ? `Hôm nay ${format(d, 'HH:mm')}` : 'Hôm nay';\n      if (isYesterday(d)) return showTime ? `Hôm qua ${format(d, 'HH:mm')}` : 'Hôm qua';\n      if (isTomorrow(d)) return showTime ? `Ngày mai ${format(d, 'HH:mm')}` : 'Ngày mai';\n      if (isThisWeek(d)) {\n        const weekday = getVietnameseWeekday(d);\n        return showTime ? `${weekday} ${format(d, 'HH:mm')}` : weekday;\n      }\n      if (isThisMonth(d)) {\n        const day = format(d, 'd');\n        return showTime ? `${day}/${format(d, 'M')} ${format(d, 'HH:mm')}` : `${day}/${format(d, 'M')}`;\n      }\n      if (isThisYear(d)) return showTime ? format(d, 'd/M HH:mm') : format(d, 'd/M');\n      return showTime ? format(d, 'd/M/yyyy HH:mm') : format(d, 'd/M/yyyy');\n    },\n    [getVietnameseWeekday, showTime]\n  );\n\n  const formatDate = useCallback(\n    (d: Date, type: string): string => {\n      const timeStr = showTime ? format(d, ', HH:mm:ss') : '';\n      switch (type) {\n        case 'short':\n          return format(d, 'd/M/yy') + timeStr;\n        case 'medium':\n          return format(d, 'dd/MM/yyyy') + timeStr;\n        case 'long':\n          return `${format(d, 'd')} ${getVietnameseMonth(d)} ${format(d, 'yyyy')}` + timeStr;\n        case 'full':\n          return `${getVietnameseWeekday(d)}, ngày ${format(d, 'd')} ${getVietnameseMonth(d)} năm ${format(d, 'yyyy')}` + timeStr;\n        case 'relative':\n          return formatRelativeTime(d);\n        case 'datetime':\n          return format(d, 'd/M/yyyy HH:mm');\n        case 'time':\n          return format(d, 'HH:mm');\n        case 'smart':\n          return getSmartFormat(d);\n        default:\n          return format(d, 'd/M/yyyy') + timeStr;\n      }\n    },\n    [getSmartFormat, getVietnameseMonth, getVietnameseWeekday, formatRelativeTime, showTime]\n  );\n\n  if (!parsedDate) {\n    return <span className={cn('text-sm text-text-positive-subtle', className)}>--/--/----</span>;\n  }\n\n  const formattedDate = formatDate(parsedDate, formatType);\n  const holiday = showHoliday ? getHoliday(parsedDate) : null;\n  const displayText = holiday ? `${formattedDate} (${holiday})` : formattedDate;\n  const tooltipTitle = title || format(parsedDate, 'EEEE, d MMMM yyyy HH:mm:ss');\n\n  return (\n    <time\n      data-slot=\"date-display\"\n      dateTime={parsedDate.toISOString()}\n      className={cn('tabular-nums text-xs text-text-positive-weak transition-colors', className)}\n      title={tooltipTitle}\n    >\n      {displayText}\n    </time>\n  );\n};\n"],"mappings":"kUACA,MAAa,EAAmB,CAC9B,SAAU,CAAC,WAAY,UAAW,SAAU,SAAU,UAAW,UAAW,SAAS,EACrF,cAAe,CAAC,KAAM,KAAM,KAAM,KAAM,KAAM,KAAM,IAAI,EACxD,OAAQ,CAAC,WAAY,WAAY,WAAY,WAAY,WAAY,WAAY,WAAY,WAAY,WAAY,WAAY,WAAY,UAAU,EACvJ,YAAa,CAAC,KAAM,KAAM,KAAM,KAAM,KAAM,KAAM,KAAM,KAAM,KAAM,MAAO,MAAO,KAAK,CACzF,EAGa,EAAqB,CAChC,QAAS,iBACT,QAAS,iBACT,QAAS,2BACT,QAAS,mBACT,QAAS,aACT,QAAS,uBACT,QAAS,wBACX,EAG0B,OAAO,OAAO,CACtC,OAAQ,IACR,OAAQ,GAAK,IACb,KAAM,KAAU,IAChB,IAAK,KAAU,GAAK,IACpB,KAAM,MAAc,GAAK,IACzB,MAAO,IAAU,GAAK,GAAK,IAC3B,KAAM,IAAM,GAAK,GAAK,GAAK,GAC7B,CAAC,EAED,MAAa,EAAkB,OAAO,OAAO,CAC3C,OAAQ,GACR,KAAM,KACN,IAAK,KAAU,GACf,KAAM,MAAc,GACpB,MAAO,IAAU,GAAK,GACtB,KAAM,IAAM,GAAK,GAAK,EACxB,CAAC,EAE8B,OAAO,OAAO,CAC3C,KAAM,GACN,IAAK,KACL,KAAM,MACN,MAAO,IAAU,EACnB,CAAC,ECQD,MAAa,GAA2C,CACtD,OACA,OAAQ,EAAa,SACrB,cAAc,GACd,WAAW,GACX,YAAY,GACZ,WACI,CACJ,IAAM,EAAa,MAAc,CAC/B,GAAI,CACF,GAAI,aAAgB,KAAM,OAAO,EAAQ,CAAI,EAAI,EAAO,KACxD,GAAI,OAAO,GAAS,SAAU,CAC5B,IAAM,EAAS,EAAS,CAAI,EAC5B,OAAO,EAAQ,CAAM,EAAI,EAAS,IAAI,KAAK,CAAI,CACjD,CACA,GAAI,OAAO,GAAS,SAAU,CAC5B,IAAM,EAAS,IAAI,KAAK,CAAI,EAC5B,OAAO,EAAQ,CAAM,EAAI,EAAS,IACpC,CACA,OAAO,IACT,MAAQ,CACN,OAAO,IACT,CACF,EAAG,CAAC,CAAI,CAAC,EAEH,EAAqB,EAAa,GAAoB,CAC1D,IAAM,EAAgB,KAAK,OAAO,KAAK,IAAI,EAAI,EAAE,QAAQ,GAAK,GAAI,EAOlE,OANI,EAAgB,GAAW,WAC3B,EAAgB,KAAa,GAAG,KAAK,MAAM,EAAgB,EAAgB,MAAM,EAAE,aACnF,EAAgB,MAAc,GAAG,KAAK,MAAM,EAAgB,EAAgB,IAAI,EAAE,YAClF,EAAgB,OAAe,GAAG,KAAK,MAAM,EAAgB,EAAgB,GAAG,EAAE,aAClF,EAAgB,OAAgB,GAAG,KAAK,MAAM,EAAgB,EAAgB,IAAI,EAAE,aACpF,EAAgB,QAAiB,GAAG,KAAK,MAAM,EAAgB,EAAgB,KAAK,EAAE,cACnF,GAAG,KAAK,MAAM,EAAgB,EAAgB,IAAI,EAAE,WAC7D,EAAG,CAAC,CAAC,EAEC,EAAuB,GAAa,EAAS,EAAQ,KAClD,EAAQ,EAAiB,cAAc,EAAE,OAAO,GAAK,EAAiB,SAAS,EAAE,OAAO,GAC9F,CAAC,CAAC,EAEC,EAAqB,GAAa,EAAS,EAAQ,KAChD,EAAQ,EAAiB,YAAY,EAAE,SAAS,GAAK,EAAiB,OAAO,EAAE,SAAS,GAC9F,CAAC,CAAC,EAEC,EAAa,EAAa,GAEvB,EADU,EAAO,EAAG,OACM,IAAM,KACtC,CAAC,CAAC,EAEC,EAAiB,EACpB,GAAoB,CACnB,GAAI,EAAQ,CAAC,EAAG,OAAO,EAAW,WAAW,EAAO,EAAG,OAAO,IAAM,UACpE,GAAI,EAAY,CAAC,EAAG,OAAO,EAAW,WAAW,EAAO,EAAG,OAAO,IAAM,UACxE,GAAI,EAAW,CAAC,EAAG,OAAO,EAAW,YAAY,EAAO,EAAG,OAAO,IAAM,WACxE,GAAI,EAAW,CAAC,EAAG,CACjB,IAAM,EAAU,EAAqB,CAAC,EACtC,OAAO,EAAW,GAAG,EAAQ,GAAG,EAAO,EAAG,OAAO,IAAM,CACzD,CACA,GAAI,EAAY,CAAC,EAAG,CAClB,IAAM,EAAM,EAAO,EAAG,GAAG,EACzB,OAAO,EAAW,GAAG,EAAI,GAAG,EAAO,EAAG,GAAG,EAAE,GAAG,EAAO,EAAG,OAAO,IAAM,GAAG,EAAI,GAAG,EAAO,EAAG,GAAG,GAC9F,CAEA,OADI,EAAW,CAAC,EAAU,EAAW,EAAO,EAAG,WAAW,EAAI,EAAO,EAAG,KAAK,EACtE,EAAW,EAAO,EAAG,gBAAgB,EAAI,EAAO,EAAG,UAAU,CACtE,EACA,CAAC,EAAsB,CAAQ,CACjC,EAEM,EAAa,GAChB,EAAS,IAAyB,CACjC,IAAM,EAAU,EAAW,EAAO,EAAG,YAAY,EAAI,GACrD,OAAQ,EAAR,CACE,IAAK,QACH,OAAO,EAAO,EAAG,QAAQ,EAAI,EAC/B,IAAK,SACH,OAAO,EAAO,EAAG,YAAY,EAAI,EACnC,IAAK,OACH,MAAO,GAAG,EAAO,EAAG,GAAG,EAAE,GAAG,EAAmB,CAAC,EAAE,GAAG,EAAO,EAAG,MAAM,IAAM,EAC7E,IAAK,OACH,MAAO,GAAG,EAAqB,CAAC,EAAE,SAAS,EAAO,EAAG,GAAG,EAAE,GAAG,EAAmB,CAAC,EAAE,OAAO,EAAO,EAAG,MAAM,IAAM,EAClH,IAAK,WACH,OAAO,EAAmB,CAAC,EAC7B,IAAK,WACH,OAAO,EAAO,EAAG,gBAAgB,EACnC,IAAK,OACH,OAAO,EAAO,EAAG,OAAO,EAC1B,IAAK,QACH,OAAO,EAAe,CAAC,EACzB,QACE,OAAO,EAAO,EAAG,UAAU,EAAI,CACnC,CACF,EACA,CAAC,EAAgB,EAAoB,EAAsB,EAAoB,CAAQ,CACzF,EAEA,GAAI,CAAC,EACH,OAAO,EAAC,OAAD,CAAM,UAAW,EAAG,oCAAqC,CAAS,WAAG,YAAgB,CAAA,EAG9F,IAAM,EAAgB,EAAW,EAAY,CAAU,EACjD,EAAU,EAAc,EAAW,CAAU,EAAI,KACjD,EAAc,EAAU,GAAG,EAAc,IAAI,EAAQ,GAAK,EAC1D,EAAe,GAAS,EAAO,EAAY,4BAA4B,EAE7E,OACE,EAAC,OAAD,CACE,YAAU,eACV,SAAU,EAAW,YAAY,EACjC,UAAW,EAAG,iEAAkE,CAAS,EACzF,MAAO,WAEN,CACG,CAAA,CAEV"}
+{"version":3,"file":"date-Nsz0Pewe.mjs","names":[],"sources":["../packages/constants.tsx","../packages/components/data-display/date.tsx"],"sourcesContent":["// Vietnamese locale configuration\nexport const vietnameseLocale = {\n  weekdays: ['Chủ Nhật', 'Thứ Hai', 'Thứ Ba', 'Thứ Tư', 'Thứ Năm', 'Thứ Sáu', 'Thứ Bảy'],\n  weekdaysShort: ['CN', 'T2', 'T3', 'T4', 'T5', 'T6', 'T7'],\n  months: ['Tháng 01', 'Tháng 02', 'Tháng 03', 'Tháng 04', 'Tháng 05', 'Tháng 06', 'Tháng 07', 'Tháng 08', 'Tháng 09', 'Tháng 10', 'Tháng 11', 'Tháng 12'],\n  monthsShort: ['T1', 'T2', 'T3', 'T4', 'T5', 'T6', 'T7', 'T8', 'T9', 'T10', 'T11', 'T12'],\n};\n\n// Vietnamese holidays\nexport const vietnameseHolidays = {\n  '01-01': 'Tết Dương lịch',\n  '03-08': 'Quốc tế Phụ nữ',\n  '04-30': 'Ngày Giải phóng miền Nam',\n  '05-01': 'Quốc tế Lao động',\n  '09-02': 'Quốc khánh',\n  '10-20': 'Ngày Phụ nữ Việt Nam',\n  '11-20': 'Ngày Nhà giáo Việt Nam',\n};\n\n// Time Constants in milliseconds, seconds, and minutes\nexport const TIME_IN_MS = Object.freeze({\n  SECOND: 1000,\n  MINUTE: 60 * 1000,\n  HOUR: 60 * 60 * 1000,\n  DAY: 24 * 60 * 60 * 1000,\n  WEEK: 7 * 24 * 60 * 60 * 1000,\n  MONTH: 30 * 24 * 60 * 60 * 1000, // Approximation for month length = 30 days\n  YEAR: 365 * 24 * 60 * 60 * 1000,\n});\n\nexport const TIME_IN_SECONDS = Object.freeze({\n  MINUTE: 60,\n  HOUR: 60 * 60,\n  DAY: 24 * 60 * 60,\n  WEEK: 7 * 24 * 60 * 60,\n  MONTH: 30 * 24 * 60 * 60,\n  YEAR: 365 * 24 * 60 * 60,\n});\n\nexport const TIME_IN_MINUTES = Object.freeze({\n  HOUR: 60,\n  DAY: 24 * 60,\n  WEEK: 7 * 24 * 60,\n  MONTH: 30 * 24 * 60,\n});\n","'use client';\n\nimport { useCallback, useMemo } from 'react';\n\nimport { format, isThisMonth, isThisWeek, isThisYear, isToday, isTomorrow, isValid, isYesterday, parseISO } from '@customafk/react-toolkit/date-fns';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { TIME_IN_SECONDS, vietnameseHolidays, vietnameseLocale } from '@/constants';\n\ninterface DateDisplayProps {\n  /** The date value to display; accepts a `Date` object, an ISO string, or a Unix timestamp (ms). */\n  date: Date | string | number;\n  /**\n   * Controls how the date is formatted.\n   * - `'short'`    — `15/03/24`\n   * - `'medium'`   — `15/03/2024` (default)\n   * - `'long'`     — `15 tháng 3, 2024`\n   * - `'full'`     — `Thứ Sáu, ngày 15 tháng 3 năm 2024`\n   * - `'relative'` — `2 giờ trước`\n   * - `'datetime'` — `15/03/2024 14:30`\n   * - `'time'`     — `14:30`\n   * - `'smart'`    — auto-selects the most human-readable format based on recency\n   */\n  format?:\n    | 'short' // 15/03/24\n    | 'medium' // 15/03/2024\n    | 'long' // 15 tháng 3, 2024\n    | 'full' // Thứ Sáu, ngày 15 tháng 3 năm 2024\n    | 'relative' // 2 giờ trước\n    | 'datetime' // 15/03/2024 14:30\n    | 'time' // 14:30\n    | 'smart'; // auto-selects format based on recency\n  /** When `true`, appends any recognised Vietnamese public holiday name to the formatted date. Defaults to `false`. */\n  showHoliday?: boolean;\n  /** When `true`, appends the time component to the formatted output. Defaults to `false`. */\n  showTime?: boolean;\n  /** Additional CSS classes applied to the `<time>` element. */\n  className?: string;\n  /** Custom HTML `title` attribute; defaults to the full ISO datetime string. */\n  title?: string;\n}\n\n/**\n * Renders a formatted date using Vietnamese locale conventions inside a semantic `<time>` element.\n *\n * @example\n * ```tsx\n * import { DateDisplay } from '@customafk/lunas-ui/data-display/date';\n *\n * <DateDisplay date=\"2024-03-15T14:30:00Z\" format=\"medium\" showTime />\n * ```\n */\nexport const DateDisplay: React.FC<DateDisplayProps> = ({\n  date,\n  format: formatType = 'medium',\n  showHoliday = false,\n  showTime = false,\n  className = '',\n  title,\n}) => {\n  const parsedDate = useMemo(() => {\n    try {\n      if (date instanceof Date) return isValid(date) ? date : null;\n      if (typeof date === 'string') {\n        const parsed = parseISO(date);\n        return isValid(parsed) ? parsed : new Date(date);\n      }\n      if (typeof date === 'number') {\n        const parsed = new Date(date);\n        return isValid(parsed) ? parsed : null;\n      }\n      return null;\n    } catch {\n      return null;\n    }\n  }, [date]);\n\n  const formatRelativeTime = useCallback((d: Date): string => {\n    const diffInSeconds = Math.floor((Date.now() - d.getTime()) / 1000);\n    if (diffInSeconds < 60) return 'Vừa xong';\n    if (diffInSeconds < 3600) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.MINUTE)} phút trước`;\n    if (diffInSeconds < 86400) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.HOUR)} giờ trước`;\n    if (diffInSeconds < 604800) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.DAY)} ngày trước`;\n    if (diffInSeconds < 2592000) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.WEEK)} tuần trước`;\n    if (diffInSeconds < 31536000) return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.MONTH)} tháng trước`;\n    return `${Math.floor(diffInSeconds / TIME_IN_SECONDS.YEAR)} năm trước`;\n  }, []);\n\n  const getVietnameseWeekday = useCallback((d: Date, short = false): string => {\n    return short ? vietnameseLocale.weekdaysShort[d.getDay()] : vietnameseLocale.weekdays[d.getDay()];\n  }, []);\n\n  const getVietnameseMonth = useCallback((d: Date, short = false): string => {\n    return short ? vietnameseLocale.monthsShort[d.getMonth()] : vietnameseLocale.months[d.getMonth()];\n  }, []);\n\n  const getHoliday = useCallback((d: Date): string | null => {\n    const monthDay = format(d, 'MM-dd') as keyof typeof vietnameseHolidays;\n    return vietnameseHolidays[monthDay] || null;\n  }, []);\n\n  const getSmartFormat = useCallback(\n    (d: Date): string => {\n      if (isToday(d)) return showTime ? `Hôm nay ${format(d, 'HH:mm')}` : 'Hôm nay';\n      if (isYesterday(d)) return showTime ? `Hôm qua ${format(d, 'HH:mm')}` : 'Hôm qua';\n      if (isTomorrow(d)) return showTime ? `Ngày mai ${format(d, 'HH:mm')}` : 'Ngày mai';\n      if (isThisWeek(d)) {\n        const weekday = getVietnameseWeekday(d);\n        return showTime ? `${weekday} ${format(d, 'HH:mm')}` : weekday;\n      }\n      if (isThisMonth(d)) {\n        const day = format(d, 'd');\n        return showTime ? `${day}/${format(d, 'M')} ${format(d, 'HH:mm')}` : `${day}/${format(d, 'M')}`;\n      }\n      if (isThisYear(d)) return showTime ? format(d, 'd/M HH:mm') : format(d, 'd/M');\n      return showTime ? format(d, 'd/M/yyyy HH:mm') : format(d, 'd/M/yyyy');\n    },\n    [getVietnameseWeekday, showTime]\n  );\n\n  const formatDate = useCallback(\n    (d: Date, type: string): string => {\n      const timeStr = showTime ? format(d, ', HH:mm:ss') : '';\n      switch (type) {\n        case 'short':\n          return format(d, 'd/M/yy') + timeStr;\n        case 'medium':\n          return format(d, 'dd/MM/yyyy') + timeStr;\n        case 'long':\n          return `${format(d, 'd')} ${getVietnameseMonth(d)} ${format(d, 'yyyy')}` + timeStr;\n        case 'full':\n          return `${getVietnameseWeekday(d)}, ngày ${format(d, 'd')} ${getVietnameseMonth(d)} năm ${format(d, 'yyyy')}` + timeStr;\n        case 'relative':\n          return formatRelativeTime(d);\n        case 'datetime':\n          return format(d, 'd/M/yyyy HH:mm');\n        case 'time':\n          return format(d, 'HH:mm');\n        case 'smart':\n          return getSmartFormat(d);\n        default:\n          return format(d, 'd/M/yyyy') + timeStr;\n      }\n    },\n    [getSmartFormat, getVietnameseMonth, getVietnameseWeekday, formatRelativeTime, showTime]\n  );\n\n  if (!parsedDate) {\n    return <span className={cn('text-sm text-text-positive-subtle', className)}>--/--/----</span>;\n  }\n\n  const formattedDate = formatDate(parsedDate, formatType);\n  const holiday = showHoliday ? getHoliday(parsedDate) : null;\n  const displayText = holiday ? `${formattedDate} (${holiday})` : formattedDate;\n  const tooltipTitle = title || format(parsedDate, 'EEEE, d MMMM yyyy HH:mm:ss');\n\n  return (\n    <time\n      data-slot=\"date-display\"\n      dateTime={parsedDate.toISOString()}\n      className={cn('tabular-nums text-xs text-text-positive-weak transition-colors', className)}\n      title={tooltipTitle}\n    >\n      {displayText}\n    </time>\n  );\n};\n"],"mappings":"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"}

package/dist/date-display-BgI7Wjqf.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"date-display-BgI7Wjqf.cjs","names":["UITableEmpty","TooltipProvider","Tooltip","TooltipTrigger","Badge","DateDisplay","TooltipContent"],"sources":["../packages/components/features/tables/components/atoms/date-display.tsx"],"sourcesContent":["import { Badge } from '@/components/ui/badge';\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';\n\nimport { DateDisplay } from '@/components/data-display/date';\nimport { UITableEmpty } from './empty';\n\n/** Props for the {@link UITableDateDisplay} component. */\ntype Props = {\n  /** The date value to format and display; `null`/`undefined` renders an empty state. */\n  date: Date | string | number | null | undefined;\n};\n\n/**\n * Displays a date as a compact badge in a table cell with a tooltip that shows\n * the full date and time on hover; renders {@link UITableEmpty} when `date` is\n * `null` or `undefined`.\n *\n * @example\n * import { UITableDateDisplay } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableDateDisplay date={new Date('2024-06-15T10:30:00Z')} />\n */\nexport const UITableDateDisplay: React.FC<Props> = ({ date }) => {\n  if (typeof date === 'undefined' || date === null) return <UITableEmpty />;\n  return (\n    <TooltipProvider>\n      <Tooltip>\n        <TooltipTrigger asChild>\n          <Badge className=\"h-fit\">\n            <DateDisplay date={date} format=\"medium\" className=\"font-normal text-white\" />\n          </Badge>\n        </TooltipTrigger>\n        <TooltipContent className=\"rounded px-2\">\n          <DateDisplay date={date} format=\"full\" showTime className=\"font-medium text-text-negative text-xs\" />\n        </TooltipContent>\n      </Tooltip>\n    </TooltipProvider>\n  );\n};\n"],"mappings":"uKAsBA,MAAa,GAAuC,CAAE,UACzC,GAAiC,MAAa,EAAA,EAAA,IAAA,CAACA,EAAAA,EAAD,CAAe,CAAA,GAEtE,EAAA,EAAA,IAAA,CAACC,EAAAA,gBAAD,CAAA,UACE,EAAA,EAAA,KAAA,CAACC,EAAAA,QAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,QAAA,aACd,EAAA,EAAA,IAAA,CAACC,EAAAA,MAAD,CAAO,UAAU,kBACf,EAAA,EAAA,IAAA,CAACC,EAAAA,EAAD,CAAmB,OAAM,OAAO,SAAS,UAAU,wBAA0B,CAAA,CACxE,CAAA,CACO,CAAA,GAChB,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,UAAU,yBACxB,EAAA,EAAA,IAAA,CAACD,EAAAA,EAAD,CAAmB,OAAM,OAAO,OAAO,SAAA,GAAS,UAAU,wCAA0C,CAAA,CACtF,CAAA,CACT,CAAA,CAAA,CACM,CAAA"}
+{"version":3,"file":"date-display-BgI7Wjqf.cjs","names":["UITableEmpty","TooltipProvider","Tooltip","TooltipTrigger","Badge","DateDisplay","TooltipContent"],"sources":["../packages/components/features/tables/components/atoms/date-display.tsx"],"sourcesContent":["import { Badge } from '@/components/ui/badge';\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';\n\nimport { DateDisplay } from '@/components/data-display/date';\nimport { UITableEmpty } from './empty';\n\n/** Props for the {@link UITableDateDisplay} component. */\ntype Props = {\n  /** The date value to format and display; `null`/`undefined` renders an empty state. */\n  date: Date | string | number | null | undefined;\n};\n\n/**\n * Displays a date as a compact badge in a table cell with a tooltip that shows\n * the full date and time on hover; renders {@link UITableEmpty} when `date` is\n * `null` or `undefined`.\n *\n * @example\n * import { UITableDateDisplay } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableDateDisplay date={new Date('2024-06-15T10:30:00Z')} />\n */\nexport const UITableDateDisplay: React.FC<Props> = ({ date }) => {\n  if (typeof date === 'undefined' || date === null) return <UITableEmpty />;\n  return (\n    <TooltipProvider>\n      <Tooltip>\n        <TooltipTrigger asChild>\n          <Badge className=\"h-fit\">\n            <DateDisplay date={date} format=\"medium\" className=\"font-normal text-white\" />\n          </Badge>\n        </TooltipTrigger>\n        <TooltipContent className=\"rounded px-2\">\n          <DateDisplay date={date} format=\"full\" showTime className=\"font-medium text-text-negative text-xs\" />\n        </TooltipContent>\n      </Tooltip>\n    </TooltipProvider>\n  );\n};\n"],"mappings":"uKAsBA,MAAa,GAAuC,CAAE,UACzC,GAAiC,MAAa,EAAA,EAAA,IAAA,CAACA,EAAAA,EAAD,CAAe,CAAA,GAEtE,EAAA,EAAA,IAAA,CAACC,EAAAA,gBAAD,CAAA,UACE,EAAA,EAAA,KAAA,CAACC,EAAAA,QAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,QAAA,GACd,UAAA,EAAA,EAAA,IAAA,CAACC,EAAAA,MAAD,CAAO,UAAU,QACf,UAAA,EAAA,EAAA,IAAA,CAACC,EAAAA,EAAD,CAAmB,OAAM,OAAO,SAAS,UAAU,wBAA0B,CAAA,CACxE,CAAA,CACO,CAAA,GAChB,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,UAAU,eACxB,UAAA,EAAA,EAAA,IAAA,CAACD,EAAAA,EAAD,CAAmB,OAAM,OAAO,OAAO,SAAA,GAAS,UAAU,wCAA0C,CAAA,CACtF,CAAA,CACT,CAAA,CAAA,CACM,CAAA"}

package/dist/date-display-DGfHQhpu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"date-display-DGfHQhpu.mjs","names":[],"sources":["../packages/components/features/tables/components/atoms/date-display.tsx"],"sourcesContent":["import { Badge } from '@/components/ui/badge';\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';\n\nimport { DateDisplay } from '@/components/data-display/date';\nimport { UITableEmpty } from './empty';\n\n/** Props for the {@link UITableDateDisplay} component. */\ntype Props = {\n  /** The date value to format and display; `null`/`undefined` renders an empty state. */\n  date: Date | string | number | null | undefined;\n};\n\n/**\n * Displays a date as a compact badge in a table cell with a tooltip that shows\n * the full date and time on hover; renders {@link UITableEmpty} when `date` is\n * `null` or `undefined`.\n *\n * @example\n * import { UITableDateDisplay } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableDateDisplay date={new Date('2024-06-15T10:30:00Z')} />\n */\nexport const UITableDateDisplay: React.FC<Props> = ({ date }) => {\n  if (typeof date === 'undefined' || date === null) return <UITableEmpty />;\n  return (\n    <TooltipProvider>\n      <Tooltip>\n        <TooltipTrigger asChild>\n          <Badge className=\"h-fit\">\n            <DateDisplay date={date} format=\"medium\" className=\"font-normal text-white\" />\n          </Badge>\n        </TooltipTrigger>\n        <TooltipContent className=\"rounded px-2\">\n          <DateDisplay date={date} format=\"full\" showTime className=\"font-medium text-text-negative text-xs\" />\n        </TooltipContent>\n      </Tooltip>\n    </TooltipProvider>\n  );\n};\n"],"mappings":"mRAsBA,MAAa,GAAuC,CAAE,UACzC,GAAiC,KAAa,EAAC,EAAD,CAAe,CAAA,EAEtE,EAAC,EAAD,CAAA,SACE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAgB,QAAA,YACd,EAAC,EAAD,CAAO,UAAU,iBACf,EAAC,EAAD,CAAmB,OAAM,OAAO,SAAS,UAAU,wBAA0B,CAAA,CACxE,CAAA,CACO,CAAA,EAChB,EAAC,EAAD,CAAgB,UAAU,wBACxB,EAAC,EAAD,CAAmB,OAAM,OAAO,OAAO,SAAA,GAAS,UAAU,wCAA0C,CAAA,CACtF,CAAA,CACT,CAAA,CAAA,CACM,CAAA"}
+{"version":3,"file":"date-display-DGfHQhpu.mjs","names":[],"sources":["../packages/components/features/tables/components/atoms/date-display.tsx"],"sourcesContent":["import { Badge } from '@/components/ui/badge';\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';\n\nimport { DateDisplay } from '@/components/data-display/date';\nimport { UITableEmpty } from './empty';\n\n/** Props for the {@link UITableDateDisplay} component. */\ntype Props = {\n  /** The date value to format and display; `null`/`undefined` renders an empty state. */\n  date: Date | string | number | null | undefined;\n};\n\n/**\n * Displays a date as a compact badge in a table cell with a tooltip that shows\n * the full date and time on hover; renders {@link UITableEmpty} when `date` is\n * `null` or `undefined`.\n *\n * @example\n * import { UITableDateDisplay } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableDateDisplay date={new Date('2024-06-15T10:30:00Z')} />\n */\nexport const UITableDateDisplay: React.FC<Props> = ({ date }) => {\n  if (typeof date === 'undefined' || date === null) return <UITableEmpty />;\n  return (\n    <TooltipProvider>\n      <Tooltip>\n        <TooltipTrigger asChild>\n          <Badge className=\"h-fit\">\n            <DateDisplay date={date} format=\"medium\" className=\"font-normal text-white\" />\n          </Badge>\n        </TooltipTrigger>\n        <TooltipContent className=\"rounded px-2\">\n          <DateDisplay date={date} format=\"full\" showTime className=\"font-medium text-text-negative text-xs\" />\n        </TooltipContent>\n      </Tooltip>\n    </TooltipProvider>\n  );\n};\n"],"mappings":"mRAsBA,MAAa,GAAuC,CAAE,UACzC,GAAiC,KAAa,EAAC,EAAD,CAAe,CAAA,EAEtE,EAAC,EAAD,CAAA,SACE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAgB,QAAA,GACd,SAAA,EAAC,EAAD,CAAO,UAAU,QACf,SAAA,EAAC,EAAD,CAAmB,OAAM,OAAO,SAAS,UAAU,wBAA0B,CAAA,CACxE,CAAA,CACO,CAAA,EAChB,EAAC,EAAD,CAAgB,UAAU,eACxB,SAAA,EAAC,EAAD,CAAmB,OAAM,OAAO,OAAO,SAAA,GAAS,UAAU,wCAA0C,CAAA,CACtF,CAAA,CACT,CAAA,CAAA,CACM,CAAA"}

package/dist/{date-field-Ba6O0uV3.cjs → date-field-CYoPe74G.cjs}

@@ -1,2 +1,2 @@
-const e=require("./ui/button.cjs"),t=require("./tanstack-form-Bae0TOEr.cjs"),n=require("./ui/popover.cjs"),r=require("./ui/calendar.cjs"),i=require("./field-BSLi-P0Q.cjs");let a=require("lucide-react"),o=require("react"),s=require("@customafk/react-toolkit/utils"),c=require("react/jsx-runtime"),l=require("@customafk/react-toolkit/date-fns"),u=require("@tanstack/react-form");const d=(0,o.memo)(({label:d,description:f,placeholder:p,orientation:m=`responsive`,tooltip:h,helperText:g,showErrorMessage:_=!0,required:v=!1,disabled:y=!1,minDate:b,maxDate:x})=>{let S=(0,o.useId)(),C=t.G(),[w,T]=(0,o.useState)(!1),E=(0,u.useStore)(C.form.store,({isSubmitting:e})=>e),D=y||E,O=C.state.meta.isDirty||C.state.meta.isTouched,k=O&&!C.state.meta.isValid,A=v&&C.state.value===null,j=O&&C.state.meta.errors.length>0,M=e=>{C.handleChange(e),T(!1)};return(0,c.jsxs)(i.FieldGroup,{className:`px-4`,children:[(0,c.jsxs)(i.Field,{orientation:m,"data-invalid":k,children:[(0,c.jsxs)(i.FieldContent,{children:[(0,c.jsxs)(i.FieldLabel,{htmlFor:C.name,"aria-required":A,children:[d,h&&(0,c.jsx)(i.FieldTooltip,{tooltip:h})]}),(0,c.jsx)(i.FieldDescription,{children:f})]}),(0,c.jsx)(i.FieldContentMain,{className:`flex flex-col space-y-1`,children:(0,c.jsxs)(`div`,{className:`flex w-full flex-col`,children:[(0,c.jsxs)(n.Popover,{open:w,onOpenChange:e=>{T(e),e||C.handleBlur()},children:[(0,c.jsx)(n.PopoverTrigger,{asChild:!0,children:(0,c.jsxs)(e.Button,{variant:`outline`,color:`muted`,size:`lg`,disabled:D,"aria-invalid":k?!0:void 0,"aria-describedby":S,className:(0,s.cn)(`flex items-center justify-between rounded font-normal outline-border`,`hover:bg-transparent`,`focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak`,`data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`,C.state.value===null&&`text-text-positive-muted`,k&&`outline-danger bg-danger-bg-subtle ring-4 ring-danger-weak`),children:[(0,c.jsx)(`p`,{children:C.state.value===null?p??`Select date`:(0,l.format)(C.state.value,`PPPP`)}),(0,c.jsx)(a.CalendarDaysIcon,{strokeWidth:1})]})}),(0,c.jsxs)(n.PopoverContent,{align:`start`,side:`bottom`,className:`flex w-fit min-w-0 overflow-y-auto rounded p-0`,children:[(0,c.jsxs)(`div`,{className:`flex h-full flex-col space-y-2 border-r border-r-border p-2 [&>button]:justify-start [&>button]:text-sm`,children:[(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.endOfToday)()),children:`Hôm nay`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.endOfTomorrow)()),children:`Ngày mai`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.endOfYesterday)()),children:`Hôm qua`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.subDays)((0,l.endOfToday)(),3)),children:`3 ngày qua`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.subDays)((0,l.endOfToday)(),7)),children:`7 ngày qua`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.subDays)((0,l.endOfToday)(),30)),children:`30 ngày qua`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.startOfMonth)((0,l.endOfToday)())),children:`Tháng này`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.lastDayOfMonth)((0,l.endOfToday)())),children:`Tháng trước`})]}),(0,c.jsx)(`div`,{className:`flex flex-1 flex-col`,children:(0,c.jsx)(`div`,{className:`min-w-73 border-b border-b-border p-2`,children:(0,c.jsx)(r.Calendar,{mode:`single`,selected:C.state.value??void 0,hidden:{before:b??new Date(1900,0,1),after:x??new Date(2100,11,31)},onSelect:e=>{e&&M(e)}})})})]})]}),O&&_&&j&&(0,c.jsx)(i.FieldError,{id:S,className:`mt-1`,errors:C.state.meta.errors}),(0,c.jsx)(i.FieldNote,{isShow:!!g,children:g})]})})]}),(0,c.jsx)(i.FieldSeparator,{})]})});d.displayName=`DateField`,exports.DateField=d;
-//# sourceMappingURL=date-field-Ba6O0uV3.cjs.map
+const e=require("./ui/button.cjs"),t=require("./tanstack-form-BxqS40rB.cjs"),n=require("./ui/popover.cjs"),r=require("./ui/calendar.cjs"),i=require("./field-BSLi-P0Q.cjs");let a=require("lucide-react"),o=require("react"),s=require("@customafk/react-toolkit/utils"),c=require("react/jsx-runtime"),l=require("@customafk/react-toolkit/date-fns"),u=require("@tanstack/react-form");const d=(0,o.memo)(({label:d,description:f,placeholder:p,orientation:m=`responsive`,tooltip:h,helperText:g,showErrorMessage:_=!0,required:v=!1,disabled:y=!1,minDate:b,maxDate:x})=>{let S=(0,o.useId)(),C=t.G(),[w,T]=(0,o.useState)(!1),E=(0,u.useStore)(C.form.store,({isSubmitting:e})=>e),D=y||E,O=C.state.meta.isDirty||C.state.meta.isTouched,k=O&&!C.state.meta.isValid,A=v&&C.state.value===null,j=O&&C.state.meta.errors.length>0,M=e=>{C.handleChange(e),T(!1)};return(0,c.jsxs)(i.FieldGroup,{className:`px-4`,children:[(0,c.jsxs)(i.Field,{orientation:m,"data-invalid":k,children:[(0,c.jsxs)(i.FieldContent,{children:[(0,c.jsxs)(i.FieldLabel,{htmlFor:C.name,"aria-required":A,children:[d,h&&(0,c.jsx)(i.FieldTooltip,{tooltip:h})]}),(0,c.jsx)(i.FieldDescription,{children:f})]}),(0,c.jsx)(i.FieldContentMain,{className:`flex flex-col space-y-1`,children:(0,c.jsxs)(`div`,{className:`flex w-full flex-col`,children:[(0,c.jsxs)(n.Popover,{open:w,onOpenChange:e=>{T(e),e||C.handleBlur()},children:[(0,c.jsx)(n.PopoverTrigger,{asChild:!0,children:(0,c.jsxs)(e.Button,{variant:`outline`,color:`muted`,size:`lg`,disabled:D,"aria-invalid":k?!0:void 0,"aria-describedby":S,className:(0,s.cn)(`flex items-center justify-between rounded font-normal outline-border`,`hover:bg-transparent`,`focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak`,`data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`,C.state.value===null&&`text-text-positive-muted`,k&&`outline-danger bg-danger-bg-subtle ring-4 ring-danger-weak`),children:[(0,c.jsx)(`p`,{children:C.state.value===null?p??`Select date`:(0,l.format)(C.state.value,`PPPP`)}),(0,c.jsx)(a.CalendarDaysIcon,{strokeWidth:1})]})}),(0,c.jsxs)(n.PopoverContent,{align:`start`,side:`bottom`,className:`flex w-fit min-w-0 overflow-y-auto rounded p-0`,children:[(0,c.jsxs)(`div`,{className:`flex h-full flex-col space-y-2 border-r border-r-border p-2 [&>button]:justify-start [&>button]:text-sm`,children:[(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.endOfToday)()),children:`Hôm nay`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.endOfTomorrow)()),children:`Ngày mai`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.endOfYesterday)()),children:`Hôm qua`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.subDays)((0,l.endOfToday)(),3)),children:`3 ngày qua`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.subDays)((0,l.endOfToday)(),7)),children:`7 ngày qua`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.subDays)((0,l.endOfToday)(),30)),children:`30 ngày qua`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.startOfMonth)((0,l.endOfToday)())),children:`Tháng này`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.lastDayOfMonth)((0,l.endOfToday)())),children:`Tháng trước`})]}),(0,c.jsx)(`div`,{className:`flex flex-1 flex-col`,children:(0,c.jsx)(`div`,{className:`min-w-73 border-b border-b-border p-2`,children:(0,c.jsx)(r.Calendar,{mode:`single`,selected:C.state.value??void 0,hidden:{before:b??new Date(1900,0,1),after:x??new Date(2100,11,31)},onSelect:e=>{e&&M(e)}})})})]})]}),O&&_&&j&&(0,c.jsx)(i.FieldError,{id:S,className:`mt-1`,errors:C.state.meta.errors}),(0,c.jsx)(i.FieldNote,{isShow:!!g,children:g})]})})]}),(0,c.jsx)(i.FieldSeparator,{})]})});d.displayName=`DateField`,exports.DateField=d;
+//# sourceMappingURL=date-field-CYoPe74G.cjs.map