@customafk/lunas-ui 0.2.42 → 0.2.44

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

@@ -0,0 +1 @@
+{"version":3,"file":"country.mjs","names":["COUNTRY_CODES: Record<ECountry, string>","COUNTRY_LABELS: Record<ECountry, string>","CountryDisplay: React.FC<CountryDisplayProps>"],"sources":["../../packages/components/data-display/country.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\nimport ReactCountryFlag from 'react-country-flag';\n\nimport { ECountry } from '@/types';\n\nimport { Flex } from '../layouts/flex';\nimport { Paragraph } from '../typography/paragraph';\n\nconst COUNTRY_CODES: Record<ECountry, string> = {\n  [ECountry.VIETNAM]: 'VN',\n  [ECountry.USA]: 'US',\n  [ECountry.JAPAN]: 'JP',\n  [ECountry.CHINA]: 'CN',\n  [ECountry.KOREA]: 'KR',\n  [ECountry.SINGAPORE]: 'SG',\n  [ECountry.MALAYSIA]: 'MY',\n  [ECountry.INDONESIA]: 'ID',\n  [ECountry.TAIWAN]: 'TW',\n  [ECountry.THAILAND]: 'TH',\n};\n\nconst COUNTRY_LABELS: Record<ECountry, string> = {\n  [ECountry.VIETNAM]: 'Vietnam',\n  [ECountry.USA]: 'America',\n  [ECountry.JAPAN]: 'Japan',\n  [ECountry.CHINA]: 'China',\n  [ECountry.KOREA]: 'Korea',\n  [ECountry.SINGAPORE]: 'Singapore',\n  [ECountry.MALAYSIA]: 'Malaysia',\n  [ECountry.INDONESIA]: 'Indonesia',\n  [ECountry.TAIWAN]: 'Taiwan',\n  [ECountry.THAILAND]: 'Thailand',\n};\n\ntype CountryDisplayProps = {\n  /** The country enum value to display; renders \"No country\" when `null` or `undefined`. */\n  country?: ECountry | null;\n};\n\n/**\n * Displays a country flag (SVG) alongside the country's English name, or a muted \"No country\" label when the value is absent.\n *\n * @example\n * ```tsx\n * import { CountryDisplay } from '@customafk/lunas-ui/data-display/country';\n * import { ECountry } from '@customafk/lunas-ui/types';\n *\n * <CountryDisplay country={ECountry.VIETNAM} />\n * ```\n */\nexport const CountryDisplay: React.FC<CountryDisplayProps> = ({ country }) => {\n  const code = useMemo(() => (country ? COUNTRY_CODES[country] : 'VN'), [country]);\n\n  if (!country) {\n    return (\n      <Flex data-slot=\"country-display\" padding=\"none\" className=\"px-1\">\n        <Paragraph variant=\"muted\" className=\"line-clamp-1 text-xs\">\n          No country\n        </Paragraph>\n      </Flex>\n    );\n  }\n\n  return (\n    <Flex data-slot=\"country-display\" padding=\"none\" className=\"px-1\">\n      <ReactCountryFlag svg countryCode={code} className=\"emojiFlag border\" />\n      <Paragraph variant=\"sm\">{COUNTRY_LABELS[country]}</Paragraph>\n    </Flex>\n  );\n};\n"],"mappings":"6PAUA,MAAMA,EAA0C,EAC7C,EAAS,SAAU,MACnB,EAAS,KAAM,MACf,EAAS,OAAQ,MACjB,EAAS,OAAQ,MACjB,EAAS,OAAQ,MACjB,EAAS,WAAY,MACrB,EAAS,UAAW,MACpB,EAAS,WAAY,MACrB,EAAS,QAAS,MAClB,EAAS,UAAW,KACtB,CAEKC,EAA2C,EAC9C,EAAS,SAAU,WACnB,EAAS,KAAM,WACf,EAAS,OAAQ,SACjB,EAAS,OAAQ,SACjB,EAAS,OAAQ,SACjB,EAAS,WAAY,aACrB,EAAS,UAAW,YACpB,EAAS,WAAY,aACrB,EAAS,QAAS,UAClB,EAAS,UAAW,WACtB,CAkBYC,GAAiD,CAAE,aAAc,CAC5E,IAAM,EAAO,MAAe,EAAU,EAAc,GAAW,KAAO,CAAC,EAAQ,CAAC,CAYhF,OAVK,EAWH,EAAC,EAAA,CAAK,YAAU,kBAAkB,QAAQ,OAAO,UAAU,iBACzD,EAAC,EAAA,CAAiB,IAAA,GAAI,YAAa,EAAM,UAAU,oBAAqB,CACxE,EAAC,EAAA,CAAU,QAAQ,cAAM,EAAe,IAAqB,CAAA,EACxD,CAZL,EAAC,EAAA,CAAK,YAAU,kBAAkB,QAAQ,OAAO,UAAU,gBACzD,EAAC,EAAA,CAAU,QAAQ,QAAQ,UAAU,gCAAuB,cAEhD,EACP"}

package/dist/data-display/data-list.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);let t=require(`@customafk/react-toolkit/utils`),n=require(`react/jsx-runtime`);const r=({children:e,className:r})=>(0,n.jsx)(`div`,{"data-slot":`data-list`,className:(0,t.cn)(`flex w-full flex-col gap-4`,r),children:e}),i=({label:e,value:r,minLabelWidth:i=`120px`,className:a})=>(0,n.jsxs)(`div`,{"data-slot":`data-list-item`,className:(0,t.cn)(`flex w-full flex-col items-start gap-1 md:flex-row md:items-center md:gap-4`,a),children:[(0,n.jsx)(`span`,{"data-slot":`data-list-label`,style:{minWidth:i},className:`text-sm text-text-positive-weak`,children:e}),(0,n.jsx)(`span`,{"data-slot":`data-list-value`,className:`text-sm text-text-positive`,children:r})]});exports.DataList=r,exports.DataListItem=i;
+"use client";const e=require(`../chunk-350yNsax.cjs`);let t=require(`@customafk/react-toolkit/utils`),n=require(`react/jsx-runtime`);const r=({children:e,className:r})=>(0,n.jsx)(`div`,{"data-slot":`data-list`,className:(0,t.cn)(`flex w-full flex-col gap-4`,r),children:e}),i=({label:e,value:r,minLabelWidth:i=`120px`,className:a})=>(0,n.jsxs)(`div`,{"data-slot":`data-list-item`,className:(0,t.cn)(`flex w-full flex-col items-start gap-1 md:flex-row md:items-center md:gap-4`,a),children:[(0,n.jsx)(`span`,{"data-slot":`data-list-label`,style:{minWidth:i},className:`text-sm text-text-positive-weak`,children:e}),(0,n.jsx)(`span`,{"data-slot":`data-list-value`,className:`text-sm text-text-positive`,children:r})]});exports.DataList=r,exports.DataListItem=i;
 //# sourceMappingURL=data-list.cjs.map

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

@@ -0,0 +1,43 @@
+//#region packages/components/data-display/data-list.d.ts
+type DataListProps = {
+  /** Additional CSS classes applied to the wrapping container. */
+  className?: string;
+};
+/**
+ * A vertical container that stacks `DataListItem` rows with consistent spacing.
+ *
+ * @example
+ * ```tsx
+ * import { DataList, DataListItem } from '@customafk/lunas-ui/data-display/data-list';
+ *
+ * <DataList>
+ *   <DataListItem label="Status" value="Active" />
+ *   <DataListItem label="Created" value="2024-01-15" />
+ * </DataList>
+ * ```
+ */
+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. */
+  className?: string;
+};
+/**
+ * A single label–value row inside a `DataList`, responsive to mobile (stacks vertically) and desktop (inline) layouts.
+ *
+ * @example
+ * ```tsx
+ * import { DataListItem } from '@customafk/lunas-ui/data-display/data-list';
+ *
+ * <DataListItem label="Email" value="user@example.com" />
+ * ```
+ */
+declare const DataListItem: React.FC<DataListItemProps>;
+//#endregion
+export { DataList, DataListItem };
+//# sourceMappingURL=data-list.d.mts.map

package/dist/data-display/data-list.mjs

@@ -0,0 +1,2 @@
+"use client";import{cn as e}from"@customafk/react-toolkit/utils";import{jsx as t,jsxs as n}from"react/jsx-runtime";const r=({children:n,className:r})=>t(`div`,{"data-slot":`data-list`,className:e(`flex w-full flex-col gap-4`,r),children:n}),i=({label:r,value:i,minLabelWidth:a=`120px`,className:o})=>n(`div`,{"data-slot":`data-list-item`,className:e(`flex w-full flex-col items-start gap-1 md:flex-row md:items-center md:gap-4`,o),children:[t(`span`,{"data-slot":`data-list-label`,style:{minWidth:a},className:`text-sm text-text-positive-weak`,children:r}),t(`span`,{"data-slot":`data-list-value`,className:`text-sm text-text-positive`,children:i})]});export{r as DataList,i as DataListItem};
+//# sourceMappingURL=data-list.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"data-list.mjs","names":["DataList: React.FC<React.PropsWithChildren<DataListProps>>","DataListItem: React.FC<DataListItemProps>"],"sources":["../../packages/components/data-display/data-list.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\ntype DataListProps = {\n  /** Additional CSS classes applied to the wrapping container. */\n  className?: string;\n};\n\n/**\n * A vertical container that stacks `DataListItem` rows with consistent spacing.\n *\n * @example\n * ```tsx\n * import { DataList, DataListItem } from '@customafk/lunas-ui/data-display/data-list';\n *\n * <DataList>\n *   <DataListItem label=\"Status\" value=\"Active\" />\n *   <DataListItem label=\"Created\" value=\"2024-01-15\" />\n * </DataList>\n * ```\n */\nexport const DataList: React.FC<React.PropsWithChildren<DataListProps>> = ({ children, className }) => {\n  return (\n    <div data-slot=\"data-list\" className={cn('flex w-full flex-col gap-4', className)}>\n      {children}\n    </div>\n  );\n};\n\ntype DataListItemProps = {\n  /** Descriptive label shown to the left of (or above, on mobile) the value. */\n  label: string;\n  /** The value to display; accepts strings, numbers, or arbitrary React nodes. */\n  value: string | number | React.ReactNode;\n  /** Minimum width applied to the label column. Defaults to `'120px'`. */\n  minLabelWidth?: string;\n  /** Additional CSS classes applied to the row container. */\n  className?: string;\n};\n\n/**\n * A single label–value row inside a `DataList`, responsive to mobile (stacks vertically) and desktop (inline) layouts.\n *\n * @example\n * ```tsx\n * import { DataListItem } from '@customafk/lunas-ui/data-display/data-list';\n *\n * <DataListItem label=\"Email\" value=\"user@example.com\" />\n * ```\n */\nexport const DataListItem: React.FC<DataListItemProps> = ({ label, value, minLabelWidth = '120px', className }) => {\n  return (\n    <div data-slot=\"data-list-item\" className={cn('flex w-full flex-col items-start gap-1 md:flex-row md:items-center md:gap-4', className)}>\n      <span data-slot=\"data-list-label\" style={{ minWidth: minLabelWidth }} className=\"text-sm text-text-positive-weak\">\n        {label}\n      </span>\n      <span data-slot=\"data-list-value\" className=\"text-sm text-text-positive\">\n        {value}\n      </span>\n    </div>\n  );\n};\n"],"mappings":"mHAsBA,MAAaA,GAA8D,CAAE,WAAU,eAEnF,EAAC,MAAA,CAAI,YAAU,YAAY,UAAW,EAAG,6BAA8B,EAAU,CAC9E,YACG,CAyBGC,GAA6C,CAAE,QAAO,QAAO,gBAAgB,QAAS,eAE/F,EAAC,MAAA,CAAI,YAAU,iBAAiB,UAAW,EAAG,8EAA+E,EAAU,WACrI,EAAC,OAAA,CAAK,YAAU,kBAAkB,MAAO,CAAE,SAAU,EAAe,CAAE,UAAU,2CAC7E,GACI,CACP,EAAC,OAAA,CAAK,YAAU,kBAAkB,UAAU,sCACzC,GACI,CAAA,EACH"}

package/dist/data-display/date-tooltip.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`),t=require(`./date.cjs`);let n=require(`react/jsx-runtime`),r=require(`@/components/ui/badge`),i=require(`@/components/ui/tooltip`);const a=({date:e})=>(0,n.jsx)(i.TooltipProvider,{children:(0,n.jsxs)(i.Tooltip,{children:[(0,n.jsx)(i.TooltipTrigger,{asChild:!0,children:(0,n.jsx)(r.Badge,{"data-slot":`date-tooltip-trigger`,className:`h-fit`,children:(0,n.jsx)(t.DateDisplay,{date:e,format:`medium`,className:`text-xs font-normal text-text-negative`})})}),(0,n.jsx)(i.TooltipContent,{"data-slot":`date-tooltip-content`,children:(0,n.jsx)(t.DateDisplay,{date:e,format:`full`,showTime:!0,className:`font-[Inter]! font-medium`})})]})});exports.DateTooltip=a;
+"use client";const e=require(`../chunk-350yNsax.cjs`),t=require(`../date-D4NVl6C9.cjs`),n=require(`../badge-KW7xu5Ca.cjs`),r=require(`../tooltip-CBdoIzoM.cjs`);let i=require(`react/jsx-runtime`);const a=({date:e})=>(0,i.jsx)(r.r,{children:(0,i.jsxs)(r.t,{children:[(0,i.jsx)(r.i,{asChild:!0,children:(0,i.jsx)(n.t,{"data-slot":`date-tooltip-trigger`,className:`h-fit`,children:(0,i.jsx)(t.t,{date:e,format:`medium`,className:`text-xs font-normal text-text-negative`})})}),(0,i.jsx)(r.n,{"data-slot":`date-tooltip-content`,children:(0,i.jsx)(t.t,{date:e,format:`full`,showTime:!0,className:`font-[Inter]! font-medium`})})]})});exports.DateTooltip=a;
 //# sourceMappingURL=date-tooltip.cjs.map

package/dist/data-display/date-tooltip.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"date-tooltip.cjs","names":["DateTooltip: React.FC<DateTooltipProps>","TooltipProvider","Tooltip","TooltipTrigger","Badge","DateDisplay","TooltipContent"],"sources":["../../packages/components/data-display/date-tooltip.tsx"],"sourcesContent":["'use client';\n\nimport { Badge } from '@/components/ui/badge';\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';\n\nimport { DateDisplay } from './date';\n\ntype DateTooltipProps = {\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\n/**\n * Displays a date as a badge; hovering reveals a tooltip with the full Vietnamese weekday and time.\n *\n * @example\n * ```tsx\n * import { DateTooltip } from '@customafk/lunas-ui/data-display/date-tooltip';\n *\n * <DateTooltip date=\"2024-03-15T14:30:00Z\" />\n * ```\n */\nexport const DateTooltip: React.FC<DateTooltipProps> = ({ date }) => {\n  return (\n    <TooltipProvider>\n      <Tooltip>\n        <TooltipTrigger asChild>\n          <Badge data-slot=\"date-tooltip-trigger\" className=\"h-fit\">\n            <DateDisplay date={date} format=\"medium\" className=\"text-xs font-normal text-text-negative\" />\n          </Badge>\n        </TooltipTrigger>\n        <TooltipContent data-slot=\"date-tooltip-content\">\n          <DateDisplay date={date} format=\"full\" showTime className=\"font-[Inter]! font-medium\" />\n        </TooltipContent>\n      </Tooltip>\n    </TooltipProvider>\n  );\n};\n"],"mappings":"yLAsBA,MAAaA,GAA2C,CAAE,WAEtD,EAAA,EAAA,KAACC,EAAAA,gBAAAA,CAAAA,UACC,EAAA,EAAA,MAACC,EAAAA,QAAAA,CAAAA,SAAAA,EACC,EAAA,EAAA,KAACC,EAAAA,eAAAA,CAAe,QAAA,aACd,EAAA,EAAA,KAACC,EAAAA,MAAAA,CAAM,YAAU,uBAAuB,UAAU,kBAChD,EAAA,EAAA,KAACC,EAAAA,YAAAA,CAAkB,OAAM,OAAO,SAAS,UAAU,0CAA2C,EACxF,EACO,EACjB,EAAA,EAAA,KAACC,EAAAA,eAAAA,CAAe,YAAU,iCACxB,EAAA,EAAA,KAACD,EAAAA,YAAAA,CAAkB,OAAM,OAAO,OAAO,SAAA,GAAS,UAAU,6BAA8B,EACzE,CAAA,CAAA,CACT,CAAA,CACM"}
+{"version":3,"file":"date-tooltip.cjs","names":["DateTooltip: React.FC<DateTooltipProps>","TooltipProvider","Tooltip","TooltipTrigger","Badge","DateDisplay","TooltipContent"],"sources":["../../packages/components/data-display/date-tooltip.tsx"],"sourcesContent":["'use client';\n\nimport { Badge } from '@/components/ui/badge';\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';\n\nimport { DateDisplay } from './date';\n\ntype DateTooltipProps = {\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\n/**\n * Displays a date as a badge; hovering reveals a tooltip with the full Vietnamese weekday and time.\n *\n * @example\n * ```tsx\n * import { DateTooltip } from '@customafk/lunas-ui/data-display/date-tooltip';\n *\n * <DateTooltip date=\"2024-03-15T14:30:00Z\" />\n * ```\n */\nexport const DateTooltip: React.FC<DateTooltipProps> = ({ date }) => {\n  return (\n    <TooltipProvider>\n      <Tooltip>\n        <TooltipTrigger asChild>\n          <Badge data-slot=\"date-tooltip-trigger\" className=\"h-fit\">\n            <DateDisplay date={date} format=\"medium\" className=\"text-xs font-normal text-text-negative\" />\n          </Badge>\n        </TooltipTrigger>\n        <TooltipContent data-slot=\"date-tooltip-content\">\n          <DateDisplay date={date} format=\"full\" showTime className=\"font-[Inter]! font-medium\" />\n        </TooltipContent>\n      </Tooltip>\n    </TooltipProvider>\n  );\n};\n"],"mappings":"mMAsBA,MAAaA,GAA2C,CAAE,WAEtD,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAAA,UACC,EAAA,EAAA,MAACC,EAAAA,EAAAA,CAAAA,SAAAA,EACC,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAe,QAAA,aACd,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAM,YAAU,uBAAuB,UAAU,kBAChD,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAkB,OAAM,OAAO,SAAS,UAAU,0CAA2C,EACxF,EACO,EACjB,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAe,YAAU,iCACxB,EAAA,EAAA,KAACD,EAAAA,EAAAA,CAAkB,OAAM,OAAO,OAAO,SAAA,GAAS,UAAU,6BAA8B,EACzE,CAAA,CAAA,CACT,CAAA,CACM"}

package/dist/data-display/date-tooltip.d.mts

@@ -0,0 +1,19 @@
+//#region packages/components/data-display/date-tooltip.d.ts
+type DateTooltipProps = {
+  /** The date value to display; accepts a `Date` object, an ISO string, or a Unix timestamp (ms). */
+  date: Date | string | number;
+};
+/**
+ * Displays a date as a badge; hovering reveals a tooltip with the full Vietnamese weekday and time.
+ *
+ * @example
+ * ```tsx
+ * import { DateTooltip } from '@customafk/lunas-ui/data-display/date-tooltip';
+ *
+ * <DateTooltip date="2024-03-15T14:30:00Z" />
+ * ```
+ */
+declare const DateTooltip: React.FC<DateTooltipProps>;
+//#endregion
+export { DateTooltip };
+//# sourceMappingURL=date-tooltip.d.mts.map

package/dist/data-display/date-tooltip.mjs

@@ -0,0 +1,2 @@
+"use client";import{t as e}from"../date-fY3sUcLp.mjs";import{t}from"../badge-CDGBGq8X.mjs";import{i as n,n as r,r as i,t as a}from"../tooltip-Dxl5Wa8i.mjs";import{jsx as o,jsxs as s}from"react/jsx-runtime";const c=({date:c})=>o(i,{children:s(a,{children:[o(n,{asChild:!0,children:o(t,{"data-slot":`date-tooltip-trigger`,className:`h-fit`,children:o(e,{date:c,format:`medium`,className:`text-xs font-normal text-text-negative`})})}),o(r,{"data-slot":`date-tooltip-content`,children:o(e,{date:c,format:`full`,showTime:!0,className:`font-[Inter]! font-medium`})})]})});export{c as DateTooltip};
+//# sourceMappingURL=date-tooltip.mjs.map

package/dist/data-display/date-tooltip.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-tooltip.mjs","names":["DateTooltip: React.FC<DateTooltipProps>"],"sources":["../../packages/components/data-display/date-tooltip.tsx"],"sourcesContent":["'use client';\n\nimport { Badge } from '@/components/ui/badge';\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';\n\nimport { DateDisplay } from './date';\n\ntype DateTooltipProps = {\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\n/**\n * Displays a date as a badge; hovering reveals a tooltip with the full Vietnamese weekday and time.\n *\n * @example\n * ```tsx\n * import { DateTooltip } from '@customafk/lunas-ui/data-display/date-tooltip';\n *\n * <DateTooltip date=\"2024-03-15T14:30:00Z\" />\n * ```\n */\nexport const DateTooltip: React.FC<DateTooltipProps> = ({ date }) => {\n  return (\n    <TooltipProvider>\n      <Tooltip>\n        <TooltipTrigger asChild>\n          <Badge data-slot=\"date-tooltip-trigger\" className=\"h-fit\">\n            <DateDisplay date={date} format=\"medium\" className=\"text-xs font-normal text-text-negative\" />\n          </Badge>\n        </TooltipTrigger>\n        <TooltipContent data-slot=\"date-tooltip-content\">\n          <DateDisplay date={date} format=\"full\" showTime className=\"font-[Inter]! font-medium\" />\n        </TooltipContent>\n      </Tooltip>\n    </TooltipProvider>\n  );\n};\n"],"mappings":"8MAsBA,MAAaA,GAA2C,CAAE,UAEtD,EAAC,EAAA,CAAA,SACC,EAAC,EAAA,CAAA,SAAA,CACC,EAAC,EAAA,CAAe,QAAA,YACd,EAAC,EAAA,CAAM,YAAU,uBAAuB,UAAU,iBAChD,EAAC,EAAA,CAAkB,OAAM,OAAO,SAAS,UAAU,0CAA2C,EACxF,EACO,CACjB,EAAC,EAAA,CAAe,YAAU,gCACxB,EAAC,EAAA,CAAkB,OAAM,OAAO,OAAO,SAAA,GAAS,UAAU,6BAA8B,EACzE,CAAA,CAAA,CACT,CAAA,CACM"}

package/dist/data-display/date.cjs

@@ -1,2 +1 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);let t=require(`@customafk/react-toolkit/utils`),n=require(`react/jsx-runtime`),r=require(`react`),i=require(`@customafk/react-toolkit/date-fns`),a=require(`@/constants`);const o=({date:e,format:o=`medium`,showHoliday:s=!1,showTime:c=!1,className:l=``,title:u})=>{let d=(0,r.useMemo)(()=>{try{if(e instanceof Date)return(0,i.isValid)(e)?e:null;if(typeof e==`string`){let t=(0,i.parseISO)(e);return(0,i.isValid)(t)?t:new Date(e)}if(typeof e==`number`){let t=new Date(e);return(0,i.isValid)(t)?t:null}return null}catch{return null}},[e]),f=(0,r.useCallback)(e=>{let t=Math.floor((Date.now()-e.getTime())/1e3);return t<60?`Vừa xong`:t<3600?`${Math.floor(t/a.TIME_IN_SECONDS.MINUTE)} phút trước`:t<86400?`${Math.floor(t/a.TIME_IN_SECONDS.HOUR)} giờ trước`:t<604800?`${Math.floor(t/a.TIME_IN_SECONDS.DAY)} ngày trước`:t<2592e3?`${Math.floor(t/a.TIME_IN_SECONDS.WEEK)} tuần trước`:t<31536e3?`${Math.floor(t/a.TIME_IN_SECONDS.MONTH)} tháng trước`:`${Math.floor(t/a.TIME_IN_SECONDS.YEAR)} năm trước`},[]),p=(0,r.useCallback)((e,t=!1)=>t?a.vietnameseLocale.weekdaysShort[e.getDay()]:a.vietnameseLocale.weekdays[e.getDay()],[]),m=(0,r.useCallback)((e,t=!1)=>t?a.vietnameseLocale.monthsShort[e.getMonth()]:a.vietnameseLocale.months[e.getMonth()],[]),h=(0,r.useCallback)(e=>a.vietnameseHolidays[(0,i.format)(e,`MM-dd`)]||null,[]),g=(0,r.useCallback)(e=>{if((0,i.isToday)(e))return c?`Hôm nay ${(0,i.format)(e,`HH:mm`)}`:`Hôm nay`;if((0,i.isYesterday)(e))return c?`Hôm qua ${(0,i.format)(e,`HH:mm`)}`:`Hôm qua`;if((0,i.isTomorrow)(e))return c?`Ngày mai ${(0,i.format)(e,`HH:mm`)}`:`Ngày mai`;if((0,i.isThisWeek)(e)){let t=p(e);return c?`${t} ${(0,i.format)(e,`HH:mm`)}`:t}if((0,i.isThisMonth)(e)){let t=(0,i.format)(e,`d`);return c?`${t}/${(0,i.format)(e,`M`)} ${(0,i.format)(e,`HH:mm`)}`:`${t}/${(0,i.format)(e,`M`)}`}return(0,i.isThisYear)(e)?c?(0,i.format)(e,`d/M HH:mm`):(0,i.format)(e,`d/M`):c?(0,i.format)(e,`d/M/yyyy HH:mm`):(0,i.format)(e,`d/M/yyyy`)},[p,c]),_=(0,r.useCallback)((e,t)=>{let n=c?(0,i.format)(e,`, HH:mm:ss`):``;switch(t){case`short`:return(0,i.format)(e,`d/M/yy`)+n;case`medium`:return(0,i.format)(e,`dd/MM/yyyy`)+n;case`long`:return`${(0,i.format)(e,`d`)} ${m(e)} ${(0,i.format)(e,`yyyy`)}`+n;case`full`:return`${p(e)}, ngày ${(0,i.format)(e,`d`)} ${m(e)} năm ${(0,i.format)(e,`yyyy`)}`+n;case`relative`:return f(e);case`datetime`:return(0,i.format)(e,`d/M/yyyy HH:mm`);case`time`:return(0,i.format)(e,`HH:mm`);case`smart`:return g(e);default:return(0,i.format)(e,`d/M/yyyy`)+n}},[g,m,p,f,c]);if(!d)return(0,n.jsx)(`span`,{className:(0,t.cn)(`text-sm text-text-positive-subtle`,l),children:`--/--/----`});let v=_(d,o),y=s?h(d):null,b=y?`${v} (${y})`:v,x=u||(0,i.format)(d,`EEEE, d MMMM yyyy HH:mm:ss`);return(0,n.jsx)(`time`,{"data-slot":`date-display`,dateTime:d.toISOString(),className:(0,t.cn)(`tabular-nums text-xs text-text-positive-weak transition-colors`,l),title:x,children:b})};exports.DateDisplay=o;
-//# sourceMappingURL=date.cjs.map
+"use client";const e=require(`../date-D4NVl6C9.cjs`);exports.DateDisplay=e.t;

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

@@ -0,0 +1,39 @@
+//#region packages/components/data-display/date.d.ts
+interface DateDisplayProps {
+  /** The date value to display; accepts a `Date` object, an ISO string, or a Unix timestamp (ms). */
+  date: Date | string | number;
+  /**
+   * Controls how the date is formatted.
+   * - `'short'`    — `15/03/24`
+   * - `'medium'`   — `15/03/2024` (default)
+   * - `'long'`     — `15 tháng 3, 2024`
+   * - `'full'`     — `Thứ Sáu, ngày 15 tháng 3 năm 2024`
+   * - `'relative'` — `2 giờ trước`
+   * - `'datetime'` — `15/03/2024 14:30`
+   * - `'time'`     — `14:30`
+   * - `'smart'`    — auto-selects the most human-readable format based on recency
+   */
+  format?: 'short' | 'medium' | 'long' | 'full' | 'relative' | 'datetime' | 'time' | 'smart';
+  /** When `true`, appends any recognised Vietnamese public holiday name to the formatted date. Defaults to `false`. */
+  showHoliday?: boolean;
+  /** When `true`, appends the time component to the formatted output. Defaults to `false`. */
+  showTime?: boolean;
+  /** Additional CSS classes applied to the `<time>` element. */
+  className?: string;
+  /** Custom HTML `title` attribute; defaults to the full ISO datetime string. */
+  title?: string;
+}
+/**
+ * Renders a formatted date using Vietnamese locale conventions inside a semantic `<time>` element.
+ *
+ * @example
+ * ```tsx
+ * import { DateDisplay } from '@customafk/lunas-ui/data-display/date';
+ *
+ * <DateDisplay date="2024-03-15T14:30:00Z" format="medium" showTime />
+ * ```
+ */
+declare const DateDisplay: React.FC<DateDisplayProps>;
+//#endregion
+export { DateDisplay };
+//# sourceMappingURL=date.d.mts.map

package/dist/data-display/date.mjs

@@ -0,0 +1 @@
+"use client";import{t as e}from"../date-fY3sUcLp.mjs";export{e as DateDisplay};

package/dist/data-display/empty.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);let t=require(`lucide-react`),n=require(`@customafk/react-toolkit/utils`),r=require(`react/jsx-runtime`);const i=({label:e=`No data to display.`,className:i})=>(0,r.jsxs)(`div`,{"data-slot":`empty-display`,className:(0,n.cn)(`flex size-full flex-col items-center justify-center gap-2 text-text-positive-muted`,i),children:[(0,r.jsx)(t.PackageOpenIcon,{size:52,strokeWidth:1}),(0,r.jsx)(`p`,{className:`text-sm`,children:e})]});exports.EmptyDisplay=i;
+"use client";const e=require(`../chunk-350yNsax.cjs`);let t=require(`lucide-react`),n=require(`@customafk/react-toolkit/utils`),r=require(`react/jsx-runtime`);const i=({label:e=`No data to display.`,className:i})=>(0,r.jsxs)(`div`,{"data-slot":`empty-display`,className:(0,n.cn)(`flex size-full flex-col items-center justify-center gap-2 text-text-positive-muted`,i),children:[(0,r.jsx)(t.PackageOpenIcon,{size:52,strokeWidth:1}),(0,r.jsx)(`p`,{className:`text-sm`,children:e})]});exports.EmptyDisplay=i;
 //# sourceMappingURL=empty.cjs.map

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

@@ -0,0 +1,21 @@
+//#region packages/components/data-display/empty.d.ts
+type EmptyDisplayProps = {
+  /** Message shown below the empty-state icon. Defaults to `'No data to display.'`. */
+  label?: string;
+  /** Additional CSS classes applied to the wrapping container. */
+  className?: string;
+};
+/**
+ * A full-area empty-state placeholder with a package icon and a configurable message.
+ *
+ * @example
+ * ```tsx
+ * import { EmptyDisplay } from '@customafk/lunas-ui/data-display/empty';
+ *
+ * <EmptyDisplay label="No results found." />
+ * ```
+ */
+declare const EmptyDisplay: React.FC<EmptyDisplayProps>;
+//#endregion
+export { EmptyDisplay };
+//# sourceMappingURL=empty.d.mts.map

package/dist/data-display/empty.mjs

@@ -0,0 +1,2 @@
+"use client";import{PackageOpenIcon as e}from"lucide-react";import{cn as t}from"@customafk/react-toolkit/utils";import{jsx as n,jsxs as r}from"react/jsx-runtime";const i=({label:i=`No data to display.`,className:a})=>r(`div`,{"data-slot":`empty-display`,className:t(`flex size-full flex-col items-center justify-center gap-2 text-text-positive-muted`,a),children:[n(e,{size:52,strokeWidth:1}),n(`p`,{className:`text-sm`,children:i})]});export{i as EmptyDisplay};
+//# sourceMappingURL=empty.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"empty.mjs","names":["EmptyDisplay: React.FC<EmptyDisplayProps>"],"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,MAAaA,GAA6C,CAAE,QAAQ,sBAAuB,eAEvF,EAAC,MAAA,CAAI,YAAU,gBAAgB,UAAW,EAAG,qFAAsF,EAAU,WAC3I,EAAC,EAAA,CAAgB,KAAM,GAAI,YAAa,GAAK,CAC7C,EAAC,IAAA,CAAE,UAAU,mBAAW,GAAU,CAAA,EAC9B"}

package/dist/data-display/name.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`),t=require(`../paragraph-D0x3Jc6W.cjs`),n=require(`../ui/tooltip.cjs`);let r=require(`react/jsx-runtime`);const i=({name:e})=>(0,r.jsxs)(n.Tooltip,{children:[(0,r.jsx)(n.TooltipTrigger,{"data-slot":`name-display`,children:(0,r.jsx)(t.t,{variant:`sm`,className:`line-clamp-2 w-full truncate text-wrap pb-px text-start`,children:e})}),(0,r.jsx)(n.TooltipContent,{align:`start`,className:`max-w-80 whitespace-pre-line text-wrap break-keep`,children:e})]});exports.NameDisplay=i;
+"use client";const e=require(`../chunk-350yNsax.cjs`),t=require(`../paragraph-DvTZvbzw.cjs`),n=require(`../tooltip-CBdoIzoM.cjs`);let r=require(`react/jsx-runtime`);const i=({name:e})=>(0,r.jsxs)(n.t,{children:[(0,r.jsx)(n.i,{"data-slot":`name-display`,children:(0,r.jsx)(t.t,{variant:`sm`,className:`line-clamp-2 w-full truncate text-wrap pb-px text-start`,children:e})}),(0,r.jsx)(n.n,{align:`start`,className:`max-w-80 whitespace-pre-line text-wrap break-keep`,children:e})]});exports.NameDisplay=i;
 //# sourceMappingURL=name.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"name.cjs","names":["NameDisplay: React.FC<NameDisplayProps>","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":"+JAoBA,MAAaA,GAA2C,CAAE,WAEtD,EAAA,EAAA,MAACC,EAAAA,QAAAA,CAAAA,SAAAA,EACC,EAAA,EAAA,KAACC,EAAAA,eAAAA,CAAe,YAAU,yBACxB,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAU,QAAQ,KAAK,UAAU,mEAC/B,GACS,EACG,EACjB,EAAA,EAAA,KAACC,EAAAA,eAAAA,CAAe,MAAM,QAAQ,UAAU,6DACrC,GACc,CAAA,CAAA,CACT"}
+{"version":3,"file":"name.cjs","names":["NameDisplay: React.FC<NameDisplayProps>","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":"qKAoBA,MAAaA,GAA2C,CAAE,WAEtD,EAAA,EAAA,MAACC,EAAAA,EAAAA,CAAAA,SAAAA,EACC,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAe,YAAU,yBACxB,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAU,QAAQ,KAAK,UAAU,mEAC/B,GACS,EACG,EACjB,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAe,MAAM,QAAQ,UAAU,6DACrC,GACc,CAAA,CAAA,CACT"}

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

@@ -0,0 +1,19 @@
+//#region packages/components/data-display/name.d.ts
+type NameDisplayProps = {
+  /** The full name string to display; shown truncated inline and in full via tooltip. */
+  name: string;
+};
+/**
+ * Renders a clamped, truncated name with a tooltip that reveals the complete text on hover.
+ *
+ * @example
+ * ```tsx
+ * import { NameDisplay } from '@customafk/lunas-ui/data-display/name';
+ *
+ * <NameDisplay name="Nguyễn Văn An" />
+ * ```
+ */
+declare const NameDisplay: React.FC<NameDisplayProps>;
+//#endregion
+export { NameDisplay };
+//# sourceMappingURL=name.d.mts.map

package/dist/data-display/name.mjs

@@ -0,0 +1,2 @@
+"use client";import{t as e}from"../paragraph-DYLaQtTV.mjs";import{i as t,n,t as r}from"../tooltip-Dxl5Wa8i.mjs";import{jsx as i,jsxs as a}from"react/jsx-runtime";const o=({name:o})=>a(r,{children:[i(t,{"data-slot":`name-display`,children:i(e,{variant:`sm`,className:`line-clamp-2 w-full truncate text-wrap pb-px text-start`,children:o})}),i(n,{align:`start`,className:`max-w-80 whitespace-pre-line text-wrap break-keep`,children:o})]});export{o as NameDisplay};
+//# sourceMappingURL=name.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"name.mjs","names":["NameDisplay: React.FC<NameDisplayProps>"],"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":"kKAoBA,MAAaA,GAA2C,CAAE,UAEtD,EAAC,EAAA,CAAA,SAAA,CACC,EAAC,EAAA,CAAe,YAAU,wBACxB,EAAC,EAAA,CAAU,QAAQ,KAAK,UAAU,mEAC/B,GACS,EACG,CACjB,EAAC,EAAA,CAAe,MAAM,QAAQ,UAAU,6DACrC,GACc,CAAA,CAAA,CACT"}

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

@@ -1,2 +1,2 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`),t=require(`../ui/tooltip.cjs`);let n=require(`react/jsx-runtime`);const r=({value:e})=>(0,n.jsxs)(t.Tooltip,{children:[(0,n.jsx)(t.TooltipTrigger,{asChild:!0,children:(0,n.jsx)(`p`,{"data-slot":`phone-number-display`,className:`cursor-default font-number text-sm text-text-positive tabular-nums transition-colors`,children:e.replace(/(\d{3})(\d{3})(\d{4})/,`($1) $2-$3`)})}),(0,n.jsx)(t.TooltipContent,{align:`start`,children:(0,n.jsx)(`p`,{children:e.slice(1).replace(/(\d{2})(\d{3})(\d{4})/,`(00) (+84) ($1) $2-$3`)})})]});exports.PhoneNumberDisplay=r;
+"use client";const e=require(`../chunk-350yNsax.cjs`),t=require(`../tooltip-CBdoIzoM.cjs`);let n=require(`react/jsx-runtime`);const r=({value:e})=>(0,n.jsxs)(t.t,{children:[(0,n.jsx)(t.i,{asChild:!0,children:(0,n.jsx)(`p`,{"data-slot":`phone-number-display`,className:`cursor-default font-number text-sm text-text-positive tabular-nums transition-colors`,children:e.replace(/(\d{3})(\d{3})(\d{4})/,`($1) $2-$3`)})}),(0,n.jsx)(t.n,{align:`start`,children:(0,n.jsx)(`p`,{children:e.slice(1).replace(/(\d{2})(\d{3})(\d{4})/,`(00) (+84) ($1) $2-$3`)})})]});exports.PhoneNumberDisplay=r;
 //# sourceMappingURL=phone-number.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"phone-number.cjs","names":["PhoneNumberDisplay: React.FC<PhoneNumberDisplayProps>","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":"wHAmBA,MAAaA,GAAyD,CAAE,YAEpE,EAAA,EAAA,MAACC,EAAAA,QAAAA,CAAAA,SAAAA,EACC,EAAA,EAAA,KAACC,EAAAA,eAAAA,CAAe,QAAA,aACd,EAAA,EAAA,KAAC,IAAA,CAAE,YAAU,uBAAuB,UAAU,gGAC3C,EAAM,QAAQ,wBAAyB,aAAa,EACnD,EACW,EACjB,EAAA,EAAA,KAACC,EAAAA,eAAAA,CAAe,MAAM,kBACpB,EAAA,EAAA,KAAC,IAAA,CAAA,SAAG,EAAM,MAAM,EAAE,CAAC,QAAQ,wBAAyB,wBAAwB,CAAA,CAAK,EAClE,CAAA,CAAA,CACT"}
+{"version":3,"file":"phone-number.cjs","names":["PhoneNumberDisplay: React.FC<PhoneNumberDisplayProps>","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":"8HAmBA,MAAaA,GAAyD,CAAE,YAEpE,EAAA,EAAA,MAACC,EAAAA,EAAAA,CAAAA,SAAAA,EACC,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAe,QAAA,aACd,EAAA,EAAA,KAAC,IAAA,CAAE,YAAU,uBAAuB,UAAU,gGAC3C,EAAM,QAAQ,wBAAyB,aAAa,EACnD,EACW,EACjB,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAe,MAAM,kBACpB,EAAA,EAAA,KAAC,IAAA,CAAA,SAAG,EAAM,MAAM,EAAE,CAAC,QAAQ,wBAAyB,wBAAwB,CAAA,CAAK,EAClE,CAAA,CAAA,CACT"}

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

@@ -0,0 +1,19 @@
+//#region packages/components/data-display/phone-number.d.ts
+type PhoneNumberDisplayProps = {
+  /** The raw phone number string (e.g. `'0901234567'`); automatically formatted as `(090) 123-4567` with a +84 tooltip. */
+  value: string;
+};
+/**
+ * Formats and displays a Vietnamese phone number with a tooltip showing the international dialling format.
+ *
+ * @example
+ * ```tsx
+ * import { PhoneNumberDisplay } from '@customafk/lunas-ui/data-display/phone-number';
+ *
+ * <PhoneNumberDisplay value="0901234567" />
+ * ```
+ */
+declare const PhoneNumberDisplay: React.FC<PhoneNumberDisplayProps>;
+//#endregion
+export { PhoneNumberDisplay };
+//# sourceMappingURL=phone-number.d.mts.map

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

@@ -0,0 +1,2 @@
+"use client";import{i as e,n as t,t as n}from"../tooltip-Dxl5Wa8i.mjs";import{jsx as r,jsxs as i}from"react/jsx-runtime";const a=({value:a})=>i(n,{children:[r(e,{asChild:!0,children:r(`p`,{"data-slot":`phone-number-display`,className:`cursor-default font-number text-sm text-text-positive tabular-nums transition-colors`,children:a.replace(/(\d{3})(\d{3})(\d{4})/,`($1) $2-$3`)})}),r(t,{align:`start`,children:r(`p`,{children:a.slice(1).replace(/(\d{2})(\d{3})(\d{4})/,`(00) (+84) ($1) $2-$3`)})})]});export{a as PhoneNumberDisplay};
+//# sourceMappingURL=phone-number.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"phone-number.mjs","names":["PhoneNumberDisplay: React.FC<PhoneNumberDisplayProps>"],"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":"yHAmBA,MAAaA,GAAyD,CAAE,WAEpE,EAAC,EAAA,CAAA,SAAA,CACC,EAAC,EAAA,CAAe,QAAA,YACd,EAAC,IAAA,CAAE,YAAU,uBAAuB,UAAU,gGAC3C,EAAM,QAAQ,wBAAyB,aAAa,EACnD,EACW,CACjB,EAAC,EAAA,CAAe,MAAM,iBACpB,EAAC,IAAA,CAAA,SAAG,EAAM,MAAM,EAAE,CAAC,QAAQ,wBAAyB,wBAAwB,CAAA,CAAK,EAClE,CAAA,CAAA,CACT"}

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

@@ -1,2 +1,2 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`),t=require(`../ui/badge.cjs`);let n=require(`react/jsx-runtime`),r=require(`@/types`);const i={[r.ERole.ADMIN]:`primary`,[r.ERole.SUPER_ADMIN]:`danger`,[r.ERole.MODERATOR]:`info`,[r.ERole.STAFF]:`accent`,[r.ERole.USER]:`muted`},a={[r.ERole.SUPER_ADMIN]:`Super Admin`,[r.ERole.ADMIN]:`Admin`,[r.ERole.MODERATOR]:`Moderator`,[r.ERole.STAFF]:`Staff`,[r.ERole.USER]:`User`},o=({status:e})=>(0,n.jsx)(t.Badge,{"data-slot":`role-badge`,color:i[e],className:`min-w-24 justify-center`,children:a[e]});exports.RoleBadge=o;
+"use client";const e=require(`../chunk-350yNsax.cjs`),t=require(`../types-BD1t0Bj8.cjs`),n=require(`../badge-KW7xu5Ca.cjs`);let r=require(`react/jsx-runtime`);const i={[t.n.ADMIN]:`primary`,[t.n.SUPER_ADMIN]:`danger`,[t.n.MODERATOR]:`info`,[t.n.STAFF]:`accent`,[t.n.USER]:`muted`},a={[t.n.SUPER_ADMIN]:`Super Admin`,[t.n.ADMIN]:`Admin`,[t.n.MODERATOR]:`Moderator`,[t.n.STAFF]:`Staff`,[t.n.USER]:`User`},o=({status:e})=>(0,r.jsx)(n.t,{"data-slot":`role-badge`,color:i[e],className:`min-w-24 justify-center`,children:a[e]});exports.RoleBadge=o;
 //# sourceMappingURL=role-badge.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"role-badge.cjs","names":["ROLE_COLORS: Record<ERole, React.ComponentProps<typeof Badge>['color']>","ERole","ROLE_LABELS: Record<ERole, string>","RoleBadge: React.FC<RoleBadgeProps>","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":"2IAMA,MAAMA,EAA0E,EAC7EC,EAAAA,MAAM,OAAQ,WACdA,EAAAA,MAAM,aAAc,UACpBA,EAAAA,MAAM,WAAY,QAClBA,EAAAA,MAAM,OAAQ,UACdA,EAAAA,MAAM,MAAO,QACf,CAEKC,EAAqC,EACxCD,EAAAA,MAAM,aAAc,eACpBA,EAAAA,MAAM,OAAQ,SACdA,EAAAA,MAAM,WAAY,aAClBA,EAAAA,MAAM,OAAQ,SACdA,EAAAA,MAAM,MAAO,OACf,CAkBYE,GAAuC,CAAE,aAElD,EAAA,EAAA,KAACC,EAAAA,MAAAA,CAAM,YAAU,aAAa,MAAO,EAAY,GAAS,UAAU,mCACjE,EAAY,IACP"}
+{"version":3,"file":"role-badge.cjs","names":["ROLE_COLORS: Record<ERole, React.ComponentProps<typeof Badge>['color']>","ERole","ROLE_LABELS: Record<ERole, string>","RoleBadge: React.FC<RoleBadgeProps>","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":"+JAMA,MAAMA,EAA0E,EAC7EC,EAAAA,EAAM,OAAQ,WACdA,EAAAA,EAAM,aAAc,UACpBA,EAAAA,EAAM,WAAY,QAClBA,EAAAA,EAAM,OAAQ,UACdA,EAAAA,EAAM,MAAO,QACf,CAEKC,EAAqC,EACxCD,EAAAA,EAAM,aAAc,eACpBA,EAAAA,EAAM,OAAQ,SACdA,EAAAA,EAAM,WAAY,aAClBA,EAAAA,EAAM,OAAQ,SACdA,EAAAA,EAAM,MAAO,OACf,CAkBYE,GAAuC,CAAE,aAElD,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAM,YAAU,aAAa,MAAO,EAAY,GAAS,UAAU,mCACjE,EAAY,IACP"}

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

@@ -1,4 +1,4 @@
-import { ERole } from "@/types";
+import { r as ERole } from "../types-Cc_mLRAn.cjs";
 
 //#region packages/components/data-display/role-badge.d.ts
 type RoleBadgeProps = {

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

@@ -0,0 +1,22 @@
+import { r as ERole } from "../types-YLu40dXY.mjs";
+
+//#region packages/components/data-display/role-badge.d.ts
+type RoleBadgeProps = {
+  /** The user role enum value that determines the badge label and colour. */
+  status: ERole;
+};
+/**
+ * Renders a colour-coded badge for a user role (e.g. Admin, Staff, User).
+ *
+ * @example
+ * ```tsx
+ * import { RoleBadge } from '@customafk/lunas-ui/data-display/role-badge';
+ * import { ERole } from '@customafk/lunas-ui/types';
+ *
+ * <RoleBadge status={ERole.ADMIN} />
+ * ```
+ */
+declare const RoleBadge: React.FC<RoleBadgeProps>;
+//#endregion
+export { RoleBadge };
+//# sourceMappingURL=role-badge.d.mts.map

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

@@ -0,0 +1,2 @@
+"use client";import{n as e}from"../types-B5nyTWtO.mjs";import{t}from"../badge-CDGBGq8X.mjs";import{jsx as n}from"react/jsx-runtime";const r={[e.ADMIN]:`primary`,[e.SUPER_ADMIN]:`danger`,[e.MODERATOR]:`info`,[e.STAFF]:`accent`,[e.USER]:`muted`},i={[e.SUPER_ADMIN]:`Super Admin`,[e.ADMIN]:`Admin`,[e.MODERATOR]:`Moderator`,[e.STAFF]:`Staff`,[e.USER]:`User`},a=({status:e})=>n(t,{"data-slot":`role-badge`,color:r[e],className:`min-w-24 justify-center`,children:i[e]});export{a as RoleBadge};
+//# sourceMappingURL=role-badge.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"role-badge.mjs","names":["ROLE_COLORS: Record<ERole, React.ComponentProps<typeof Badge>['color']>","ROLE_LABELS: Record<ERole, string>","RoleBadge: React.FC<RoleBadgeProps>"],"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":"oIAMA,MAAMA,EAA0E,EAC7E,EAAM,OAAQ,WACd,EAAM,aAAc,UACpB,EAAM,WAAY,QAClB,EAAM,OAAQ,UACd,EAAM,MAAO,QACf,CAEKC,EAAqC,EACxC,EAAM,aAAc,eACpB,EAAM,OAAQ,SACd,EAAM,WAAY,aAClB,EAAM,OAAQ,SACd,EAAM,MAAO,OACf,CAkBYC,GAAuC,CAAE,YAElD,EAAC,EAAA,CAAM,YAAU,aAAa,MAAO,EAAY,GAAS,UAAU,mCACjE,EAAY,IACP"}

package/dist/data-display/statistic.cjs

@@ -1,2 +1 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);let t=require(`@customafk/react-toolkit/utils`),n=require(`class-variance-authority`),r=require(`react/jsx-runtime`),i=require(`react`);const a=(0,n.cva)(`inline-flex items-center gap-1 font-number tabular-nums transition-colors`,{variants:{size:{xs:`text-xs`,sm:`text-sm`,md:`text-base`,lg:`text-lg`,xl:`text-xl`},trend:{neutral:`text-text-positive-strong`,up:`text-success`,down:`text-danger`}},defaultVariants:{size:`lg`,trend:`neutral`}}),o=(0,i.memo)(({decimalSeparator:e=`.`,groupSeparator:n=`,`,prefix:o,suffix:s,precision:c,roundingMode:l=`round`,showTrailingZeros:u=!1,size:d=`lg`,trend:f=`neutral`,value:p,className:m})=>{let h=(0,i.useCallback)((e,t)=>{let n=10**t;switch(l){case`floor`:return Math.floor(e*n)/n;case`ceil`:return Math.ceil(e*n)/n;default:return Math.round(e*n)/n}},[l]),g=(0,i.useMemo)(()=>{let e={};return typeof c==`number`&&c>=0&&(u&&(e.minimumFractionDigits=c),e.maximumFractionDigits=c),e},[c,u]),_=(0,i.useCallback)(e=>{let t=e;return typeof c==`number`&&c>=0&&(t=h(e,c)),t.toLocaleString(`en-US`,g)},[h,g,c]),v=(0,i.useMemo)(()=>{if(typeof p==`number`)return Number.isNaN(p)||!Number.isFinite(p)?`N/A`:_(p);if(typeof p==`string`){let e=p.trim();if(!e)return`N/A`;let t=Number(e);return Number.isNaN(t)||!Number.isFinite(t)?`N/A`:_(t)}return`N/A`},[p,_]),y=(0,i.useMemo)(()=>e===`.`&&n===`,`?v:v.replace(/,/g,n).replace(/\./g,e),[v,e,n]);return(0,r.jsxs)(`div`,{"data-slot":`statistic`,className:(0,t.cn)(a({size:d,trend:f}),m),children:[o&&(0,r.jsx)(`span`,{"data-slot":`statistic-prefix`,children:o}),(0,r.jsx)(`p`,{"data-slot":`statistic-value`,children:y}),s&&(0,r.jsx)(`span`,{"data-slot":`statistic-suffix`,children:s})]})});o.displayName=`Statistic`,exports.Statistic=o;
-//# sourceMappingURL=statistic.cjs.map
+"use client";const e=require(`../statistic-DDXilD7q.cjs`);exports.Statistic=e.t;

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

@@ -1,10 +1,10 @@
-import * as react1 from "react";
+import * as react0 from "react";
 import * as class_variance_authority_types0 from "class-variance-authority/types";
 import { VariantProps } from "class-variance-authority";
 
 //#region packages/components/data-display/statistic.d.ts
 declare const statisticVariants: (props?: ({
-  size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
+  size?: "sm" | "md" | "lg" | "xl" | "xs" | null | undefined;
   trend?: "neutral" | "up" | "down" | null | undefined;
 } & class_variance_authority_types0.ClassProp) | undefined) => string;
 type StatisticProps = VariantProps<typeof statisticVariants> & {
@@ -39,7 +39,7 @@ type StatisticProps = VariantProps<typeof statisticVariants> & {
  * <Statistic value={1234567.89} precision={2} prefix="$" trend="up" size="lg" />
  * ```
  */
-declare const Statistic: react1.MemoExoticComponent<({
+declare const Statistic: react0.MemoExoticComponent<({
   decimalSeparator,
   groupSeparator,
   prefix: Prefix,
@@ -51,7 +51,7 @@ declare const Statistic: react1.MemoExoticComponent<({
   trend,
   value,
   className
-}: StatisticProps) => react1.JSX.Element>;
+}: StatisticProps) => react0.JSX.Element>;
 //#endregion
 export { Statistic, StatisticProps };
 //# sourceMappingURL=statistic.d.cts.map

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

@@ -0,0 +1,57 @@
+import * as react89 from "react";
+import { VariantProps } from "class-variance-authority";
+import * as class_variance_authority_types2 from "class-variance-authority/types";
+
+//#region packages/components/data-display/statistic.d.ts
+declare const statisticVariants: (props?: ({
+  size?: "sm" | "md" | "lg" | "xl" | "xs" | null | undefined;
+  trend?: "neutral" | "up" | "down" | null | undefined;
+} & class_variance_authority_types2.ClassProp) | undefined) => string;
+type StatisticProps = VariantProps<typeof statisticVariants> & {
+  /** Character used to separate the decimal part. Defaults to `'.'`. */
+  decimalSeparator?: string;
+  /** Character used to separate thousands groups. Defaults to `','`. */
+  groupSeparator?: string;
+  /** Optional node rendered before the numeric value (e.g. a currency symbol). */
+  prefix?: React.ReactNode;
+  /** Optional node rendered after the numeric value (e.g. a unit label). */
+  suffix?: React.ReactNode;
+  /** Number of decimal digits to display; omit to show all significant digits. */
+  precision?: number;
+  /** Rounding strategy applied before formatting. Defaults to `'round'`. */
+  roundingMode?: 'round' | 'floor' | 'ceil';
+  /** When `true`, pads the decimal part with trailing zeros up to `precision`. Defaults to `false`. */
+  showTrailingZeros?: boolean;
+  /** The numeric (or numeric-string) value to format and display. */
+  value: number | string;
+  /** Additional CSS classes applied to the wrapper element. */
+  className?: string;
+  /** Colour trend indicator: `'neutral'` (default), `'up'` (green), or `'down'` (red). */
+  trend?: 'neutral' | 'up' | 'down';
+};
+/**
+ * A memoised numeric display component with locale-aware formatting, optional prefix/suffix, trend colouring, and configurable rounding.
+ *
+ * @example
+ * ```tsx
+ * import { Statistic } from '@customafk/lunas-ui/data-display/statistic';
+ *
+ * <Statistic value={1234567.89} precision={2} prefix="$" trend="up" size="lg" />
+ * ```
+ */
+declare const Statistic: react89.MemoExoticComponent<({
+  decimalSeparator,
+  groupSeparator,
+  prefix: Prefix,
+  suffix: Suffix,
+  precision,
+  roundingMode,
+  showTrailingZeros,
+  size,
+  trend,
+  value,
+  className
+}: StatisticProps) => react89.JSX.Element>;
+//#endregion
+export { Statistic, StatisticProps };
+//# sourceMappingURL=statistic.d.mts.map

package/dist/data-display/statistic.mjs

@@ -0,0 +1 @@
+"use client";import{t as e}from"../statistic-cwLwcukn.mjs";export{e as Statistic};

package/dist/data-display/user.cjs

@@ -1,2 +1 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`),t=require(`../paragraph-D0x3Jc6W.cjs`),n=require(`../flex-BAfCk_in.cjs`),r=require(`../ui/avatar.cjs`);let i=require(`lucide-react`),a=require(`react/jsx-runtime`),o=require(`@customafk/react-toolkit/color-hash`);const s=({uuid:e,username:s,email:c})=>(0,a.jsxs)(n.t,{"data-slot":`user-display`,wrap:!1,gap:`sm`,padding:`none`,children:[(0,a.jsx)(r.Avatar,{className:`size-10 shadow-card`,children:(0,a.jsx)(r.AvatarFallback,{style:{backgroundColor:o.colorHashLight.hex(e)},children:(0,a.jsx)(i.UserRoundIcon,{size:28,className:`text-white`})})}),(0,a.jsxs)(n.t,{vertical:!0,padding:`none`,gap:`none`,align:`start`,children:[(0,a.jsx)(t.t,{className:`text-sm font-medium text-text-positive`,children:s}),(0,a.jsx)(t.t,{variant:`sm`,className:`mt-0! text-xs text-text-positive-weak`,children:c})]})]});exports.UserDataDisplay=s;
-//# sourceMappingURL=user.cjs.map
+"use client";require(`../paragraph-DvTZvbzw.cjs`),require(`../flex-DmWmOBn5.cjs`),require(`../avatar-TyOphzGo.cjs`);const e=require(`../user-ii4FBhO1.cjs`);exports.UserDataDisplay=e.t;

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

@@ -0,0 +1,23 @@
+//#region packages/components/data-display/user.d.ts
+type UserDataDisplayProps = {
+  /** Unique identifier used to deterministically generate the avatar background colour. */
+  uuid: string;
+  /** Display name rendered as the primary line of the user card. */
+  username: string;
+  /** Email address rendered as the secondary, muted line below the username. */
+  email: string;
+};
+/**
+ * Displays a user identity card with a colour-hashed avatar, username, and email address.
+ *
+ * @example
+ * ```tsx
+ * import { UserDataDisplay } from '@customafk/lunas-ui/data-display/user';
+ *
+ * <UserDataDisplay uuid="abc-123" username="Nguyễn Văn An" email="an@example.com" />
+ * ```
+ */
+declare const UserDataDisplay: React.FC<UserDataDisplayProps>;
+//#endregion
+export { UserDataDisplay };
+//# sourceMappingURL=user.d.mts.map

package/dist/data-display/user.mjs

@@ -0,0 +1 @@
+"use client";import"../paragraph-DYLaQtTV.mjs";import"../flex-B6YSJzGe.mjs";import"../avatar-fltdRVsJ.mjs";import{t as e}from"../user-DtZy4P9d.mjs";export{e as UserDataDisplay};

package/dist/date-D4NVl6C9.cjs

@@ -0,0 +1,2 @@
+const e=require(`./chunk-350yNsax.cjs`);let t=require(`react`),n=require(`@customafk/react-toolkit/utils`),r=require(`react/jsx-runtime`),i=require(`@customafk/react-toolkit/date-fns`);const a={weekdays:[`Chủ Nhật`,`Thứ Hai`,`Thứ Ba`,`Thứ Tư`,`Thứ Năm`,`Thứ Sáu`,`Thứ Bảy`],weekdaysShort:[`CN`,`T2`,`T3`,`T4`,`T5`,`T6`,`T7`],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`],monthsShort:[`T1`,`T2`,`T3`,`T4`,`T5`,`T6`,`T7`,`T8`,`T9`,`T10`,`T11`,`T12`]},o={"01-01":`Tết Dương lịch`,"03-08":`Quốc tế Phụ nữ`,"04-30":`Ngày Giải phóng miền Nam`,"05-01":`Quốc tế Lao động`,"09-02":`Quốc khánh`,"10-20":`Ngày Phụ nữ Việt Nam`,"11-20":`Ngày Nhà giáo Việt Nam`},s=Object.freeze({SECOND:1e3,MINUTE:60*1e3,HOUR:3600*1e3,DAY:1440*60*1e3,WEEK:10080*60*1e3,MONTH:720*60*60*1e3,YEAR:365*24*60*60*1e3}),c=Object.freeze({MINUTE:60,HOUR:3600,DAY:1440*60,WEEK:10080*60,MONTH:720*60*60,YEAR:365*24*60*60}),l=Object.freeze({HOUR:60,DAY:1440,WEEK:10080,MONTH:720*60}),u=({date:e,format:s=`medium`,showHoliday:l=!1,showTime:u=!1,className:d=``,title:f})=>{let p=(0,t.useMemo)(()=>{try{if(e instanceof Date)return(0,i.isValid)(e)?e:null;if(typeof e==`string`){let t=(0,i.parseISO)(e);return(0,i.isValid)(t)?t:new Date(e)}if(typeof e==`number`){let t=new Date(e);return(0,i.isValid)(t)?t:null}return null}catch{return null}},[e]),m=(0,t.useCallback)(e=>{let t=Math.floor((Date.now()-e.getTime())/1e3);return t<60?`Vừa xong`:t<3600?`${Math.floor(t/c.MINUTE)} phút trước`:t<86400?`${Math.floor(t/c.HOUR)} giờ trước`:t<604800?`${Math.floor(t/c.DAY)} ngày trước`:t<2592e3?`${Math.floor(t/c.WEEK)} tuần trước`:t<31536e3?`${Math.floor(t/c.MONTH)} tháng trước`:`${Math.floor(t/c.YEAR)} năm trước`},[]),h=(0,t.useCallback)((e,t=!1)=>t?a.weekdaysShort[e.getDay()]:a.weekdays[e.getDay()],[]),g=(0,t.useCallback)((e,t=!1)=>t?a.monthsShort[e.getMonth()]:a.months[e.getMonth()],[]),_=(0,t.useCallback)(e=>o[(0,i.format)(e,`MM-dd`)]||null,[]),v=(0,t.useCallback)(e=>{if((0,i.isToday)(e))return u?`Hôm nay ${(0,i.format)(e,`HH:mm`)}`:`Hôm nay`;if((0,i.isYesterday)(e))return u?`Hôm qua ${(0,i.format)(e,`HH:mm`)}`:`Hôm qua`;if((0,i.isTomorrow)(e))return u?`Ngày mai ${(0,i.format)(e,`HH:mm`)}`:`Ngày mai`;if((0,i.isThisWeek)(e)){let t=h(e);return u?`${t} ${(0,i.format)(e,`HH:mm`)}`:t}if((0,i.isThisMonth)(e)){let t=(0,i.format)(e,`d`);return u?`${t}/${(0,i.format)(e,`M`)} ${(0,i.format)(e,`HH:mm`)}`:`${t}/${(0,i.format)(e,`M`)}`}return(0,i.isThisYear)(e)?u?(0,i.format)(e,`d/M HH:mm`):(0,i.format)(e,`d/M`):u?(0,i.format)(e,`d/M/yyyy HH:mm`):(0,i.format)(e,`d/M/yyyy`)},[h,u]),y=(0,t.useCallback)((e,t)=>{let n=u?(0,i.format)(e,`, HH:mm:ss`):``;switch(t){case`short`:return(0,i.format)(e,`d/M/yy`)+n;case`medium`:return(0,i.format)(e,`dd/MM/yyyy`)+n;case`long`:return`${(0,i.format)(e,`d`)} ${g(e)} ${(0,i.format)(e,`yyyy`)}`+n;case`full`:return`${h(e)}, ngày ${(0,i.format)(e,`d`)} ${g(e)} năm ${(0,i.format)(e,`yyyy`)}`+n;case`relative`:return m(e);case`datetime`:return(0,i.format)(e,`d/M/yyyy HH:mm`);case`time`:return(0,i.format)(e,`HH:mm`);case`smart`:return v(e);default:return(0,i.format)(e,`d/M/yyyy`)+n}},[v,g,h,m,u]);if(!p)return(0,r.jsx)(`span`,{className:(0,n.cn)(`text-sm text-text-positive-subtle`,d),children:`--/--/----`});let b=y(p,s),x=l?_(p):null,S=x?`${b} (${x})`:b,C=f||(0,i.format)(p,`EEEE, d MMMM yyyy HH:mm:ss`);return(0,r.jsx)(`time`,{"data-slot":`date-display`,dateTime:p.toISOString(),className:(0,n.cn)(`tabular-nums text-xs text-text-positive-weak transition-colors`,d),title:C,children:S})};Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return u}});
+//# sourceMappingURL=date-D4NVl6C9.cjs.map

package/dist/date-D4NVl6C9.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-D4NVl6C9.cjs","names":["DateDisplay: React.FC<DateDisplayProps>"],"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-fY3sUcLp.mjs

@@ -0,0 +1,2 @@
+import{useCallback as e,useMemo as t}from"react";import{cn as n}from"@customafk/react-toolkit/utils";import{jsx as r}from"react/jsx-runtime";import{format as i,isThisMonth as a,isThisWeek as o,isThisYear as s,isToday as c,isTomorrow as l,isValid as u,isYesterday as d,parseISO as f}from"@customafk/react-toolkit/date-fns";const p={weekdays:[`Chủ Nhật`,`Thứ Hai`,`Thứ Ba`,`Thứ Tư`,`Thứ Năm`,`Thứ Sáu`,`Thứ Bảy`],weekdaysShort:[`CN`,`T2`,`T3`,`T4`,`T5`,`T6`,`T7`],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`],monthsShort:[`T1`,`T2`,`T3`,`T4`,`T5`,`T6`,`T7`,`T8`,`T9`,`T10`,`T11`,`T12`]},m={"01-01":`Tết Dương lịch`,"03-08":`Quốc tế Phụ nữ`,"04-30":`Ngày Giải phóng miền Nam`,"05-01":`Quốc tế Lao động`,"09-02":`Quốc khánh`,"10-20":`Ngày Phụ nữ Việt Nam`,"11-20":`Ngày Nhà giáo Việt Nam`};Object.freeze({SECOND:1e3,MINUTE:60*1e3,HOUR:3600*1e3,DAY:1440*60*1e3,WEEK:10080*60*1e3,MONTH:720*60*60*1e3,YEAR:365*24*60*60*1e3});const h=Object.freeze({MINUTE:60,HOUR:3600,DAY:1440*60,WEEK:10080*60,MONTH:720*60*60,YEAR:365*24*60*60});Object.freeze({HOUR:60,DAY:1440,WEEK:10080,MONTH:720*60});const g=({date:g,format:_=`medium`,showHoliday:v=!1,showTime:y=!1,className:b=``,title:x})=>{let S=t(()=>{try{if(g instanceof Date)return u(g)?g:null;if(typeof g==`string`){let e=f(g);return u(e)?e:new Date(g)}if(typeof g==`number`){let e=new Date(g);return u(e)?e:null}return null}catch{return null}},[g]),C=e(e=>{let t=Math.floor((Date.now()-e.getTime())/1e3);return t<60?`Vừa xong`:t<3600?`${Math.floor(t/h.MINUTE)} phút trước`:t<86400?`${Math.floor(t/h.HOUR)} giờ trước`:t<604800?`${Math.floor(t/h.DAY)} ngày trước`:t<2592e3?`${Math.floor(t/h.WEEK)} tuần trước`:t<31536e3?`${Math.floor(t/h.MONTH)} tháng trước`:`${Math.floor(t/h.YEAR)} năm trước`},[]),w=e((e,t=!1)=>t?p.weekdaysShort[e.getDay()]:p.weekdays[e.getDay()],[]),T=e((e,t=!1)=>t?p.monthsShort[e.getMonth()]:p.months[e.getMonth()],[]),E=e(e=>m[i(e,`MM-dd`)]||null,[]),D=e(e=>{if(c(e))return y?`Hôm nay ${i(e,`HH:mm`)}`:`Hôm nay`;if(d(e))return y?`Hôm qua ${i(e,`HH:mm`)}`:`Hôm qua`;if(l(e))return y?`Ngày mai ${i(e,`HH:mm`)}`:`Ngày mai`;if(o(e)){let t=w(e);return y?`${t} ${i(e,`HH:mm`)}`:t}if(a(e)){let t=i(e,`d`);return y?`${t}/${i(e,`M`)} ${i(e,`HH:mm`)}`:`${t}/${i(e,`M`)}`}return s(e)?y?i(e,`d/M HH:mm`):i(e,`d/M`):y?i(e,`d/M/yyyy HH:mm`):i(e,`d/M/yyyy`)},[w,y]),O=e((e,t)=>{let n=y?i(e,`, HH:mm:ss`):``;switch(t){case`short`:return i(e,`d/M/yy`)+n;case`medium`:return i(e,`dd/MM/yyyy`)+n;case`long`:return`${i(e,`d`)} ${T(e)} ${i(e,`yyyy`)}`+n;case`full`:return`${w(e)}, ngày ${i(e,`d`)} ${T(e)} năm ${i(e,`yyyy`)}`+n;case`relative`:return C(e);case`datetime`:return i(e,`d/M/yyyy HH:mm`);case`time`:return i(e,`HH:mm`);case`smart`:return D(e);default:return i(e,`d/M/yyyy`)+n}},[D,T,w,C,y]);if(!S)return r(`span`,{className:n(`text-sm text-text-positive-subtle`,b),children:`--/--/----`});let k=O(S,_),A=v?E(S):null,j=A?`${k} (${A})`:k,M=x||i(S,`EEEE, d MMMM yyyy HH:mm:ss`);return r(`time`,{"data-slot":`date-display`,dateTime:S.toISOString(),className:n(`tabular-nums text-xs text-text-positive-weak transition-colors`,b),title:M,children:j})};export{g as t};
+//# sourceMappingURL=date-fY3sUcLp.mjs.map