@customafk/lunas-ui 0.2.74 → 0.2.76

package/dist/permalink-CUIKG9VA.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"permalink-CUIKG9VA.cjs","names":["UITableEmpty","ExternalLinkIcon"],"sources":["../packages/components/features/tables/components/atoms/permalink.tsx"],"sourcesContent":["import { ExternalLinkIcon } from 'lucide-react';\n\nimport { UITableEmpty } from './empty';\n\n/**\n * Renders an external-link anchor with an icon for use in table cells, opening\n * the target URL in a new tab with safe `rel` attributes. Renders\n * {@link UITableEmpty} when `href` is absent.\n *\n * @example\n * import { UITablePermalink } from '@customafk/lunas-ui/features/tables';\n *\n * <UITablePermalink href=\"https://example.com/records/42\" label=\"View record\" />\n */\nexport const UITablePermalink: React.FC<{\n  /** The destination URL the anchor navigates to; `null`/`undefined`/empty renders an empty state. */\n  href: string | null | undefined;\n  /** Optional display text; falls back to the raw `href` when omitted. */\n  label?: string;\n}> = ({ href, label }) => {\n  if (!href) return <UITableEmpty />;\n\n  return (\n    <a href={href} target=\"_blank\" className=\"inline-flex items-center gap-1 truncate text-primary text-sm underline\" rel=\"noopener noreferrer\">\n      <span>{label || href}</span>\n      <ExternalLinkIcon size={14} />\n    </a>\n  );\n};\n"],"mappings":"sGAcA,MAAa,GAKP,CAAE,OAAM,WACP,GAGH,EAAA,EAAA,KAAA,CAAC,IAAD,CAAS,OAAM,OAAO,SAAS,UAAU,yEAAyE,IAAI,+BAAtH,EACE,EAAA,EAAA,IAAA,CAAC,OAAD,CAAA,SAAO,GAAS,CAAW,CAAA,GAC3B,EAAA,EAAA,IAAA,CAACC,EAAAA,iBAAD,CAAkB,KAAM,EAAK,CAAA,CAC5B,KANa,EAAA,EAAA,IAAA,CAACD,EAAAA,EAAD,CAAe,CAAA"}
+{"version":3,"file":"permalink-CUIKG9VA.cjs","names":["UITableEmpty","ExternalLinkIcon"],"sources":["../packages/components/features/tables/components/atoms/permalink.tsx"],"sourcesContent":["import { ExternalLinkIcon } from 'lucide-react';\n\nimport { UITableEmpty } from './empty';\n\n/**\n * Renders an external-link anchor with an icon for use in table cells, opening\n * the target URL in a new tab with safe `rel` attributes. Renders\n * {@link UITableEmpty} when `href` is absent.\n *\n * @example\n * import { UITablePermalink } from '@customafk/lunas-ui/features/tables';\n *\n * <UITablePermalink href=\"https://example.com/records/42\" label=\"View record\" />\n */\nexport const UITablePermalink: React.FC<{\n  /** The destination URL the anchor navigates to; `null`/`undefined`/empty renders an empty state. */\n  href: string | null | undefined;\n  /** Optional display text; falls back to the raw `href` when omitted. */\n  label?: string;\n}> = ({ href, label }) => {\n  if (!href) return <UITableEmpty />;\n\n  return (\n    <a href={href} target=\"_blank\" className=\"inline-flex items-center gap-1 truncate text-primary text-sm underline\" rel=\"noopener noreferrer\">\n      <span>{label || href}</span>\n      <ExternalLinkIcon size={14} />\n    </a>\n  );\n};\n"],"mappings":"sGAcA,MAAa,GAKP,CAAE,OAAM,WACP,GAGH,EAAA,EAAA,KAAA,CAAC,IAAD,CAAS,OAAM,OAAO,SAAS,UAAU,yEAAyE,IAAI,sBAAtH,SAAA,EACE,EAAA,EAAA,IAAA,CAAC,OAAD,CAAA,SAAO,GAAS,CAAW,CAAA,GAC3B,EAAA,EAAA,IAAA,CAACC,EAAAA,iBAAD,CAAkB,KAAM,EAAK,CAAA,CAC5B,KANa,EAAA,EAAA,IAAA,CAACD,EAAAA,EAAD,CAAe,CAAA"}

package/dist/permalink-I-INEarM.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"permalink-I-INEarM.mjs","names":[],"sources":["../packages/components/features/tables/components/atoms/permalink.tsx"],"sourcesContent":["import { ExternalLinkIcon } from 'lucide-react';\n\nimport { UITableEmpty } from './empty';\n\n/**\n * Renders an external-link anchor with an icon for use in table cells, opening\n * the target URL in a new tab with safe `rel` attributes. Renders\n * {@link UITableEmpty} when `href` is absent.\n *\n * @example\n * import { UITablePermalink } from '@customafk/lunas-ui/features/tables';\n *\n * <UITablePermalink href=\"https://example.com/records/42\" label=\"View record\" />\n */\nexport const UITablePermalink: React.FC<{\n  /** The destination URL the anchor navigates to; `null`/`undefined`/empty renders an empty state. */\n  href: string | null | undefined;\n  /** Optional display text; falls back to the raw `href` when omitted. */\n  label?: string;\n}> = ({ href, label }) => {\n  if (!href) return <UITableEmpty />;\n\n  return (\n    <a href={href} target=\"_blank\" className=\"inline-flex items-center gap-1 truncate text-primary text-sm underline\" rel=\"noopener noreferrer\">\n      <span>{label || href}</span>\n      <ExternalLinkIcon size={14} />\n    </a>\n  );\n};\n"],"mappings":"4IAcA,MAAa,GAKP,CAAE,OAAM,WACP,EAGH,EAAC,IAAD,CAAS,OAAM,OAAO,SAAS,UAAU,yEAAyE,IAAI,+BAAtH,CACE,EAAC,OAAD,CAAA,SAAO,GAAS,CAAW,CAAA,EAC3B,EAAC,EAAD,CAAkB,KAAM,EAAK,CAAA,CAC5B,IANa,EAAC,EAAD,CAAe,CAAA"}
+{"version":3,"file":"permalink-I-INEarM.mjs","names":[],"sources":["../packages/components/features/tables/components/atoms/permalink.tsx"],"sourcesContent":["import { ExternalLinkIcon } from 'lucide-react';\n\nimport { UITableEmpty } from './empty';\n\n/**\n * Renders an external-link anchor with an icon for use in table cells, opening\n * the target URL in a new tab with safe `rel` attributes. Renders\n * {@link UITableEmpty} when `href` is absent.\n *\n * @example\n * import { UITablePermalink } from '@customafk/lunas-ui/features/tables';\n *\n * <UITablePermalink href=\"https://example.com/records/42\" label=\"View record\" />\n */\nexport const UITablePermalink: React.FC<{\n  /** The destination URL the anchor navigates to; `null`/`undefined`/empty renders an empty state. */\n  href: string | null | undefined;\n  /** Optional display text; falls back to the raw `href` when omitted. */\n  label?: string;\n}> = ({ href, label }) => {\n  if (!href) return <UITableEmpty />;\n\n  return (\n    <a href={href} target=\"_blank\" className=\"inline-flex items-center gap-1 truncate text-primary text-sm underline\" rel=\"noopener noreferrer\">\n      <span>{label || href}</span>\n      <ExternalLinkIcon size={14} />\n    </a>\n  );\n};\n"],"mappings":"4IAcA,MAAa,GAKP,CAAE,OAAM,WACP,EAGH,EAAC,IAAD,CAAS,OAAM,OAAO,SAAS,UAAU,yEAAyE,IAAI,sBAAtH,SAAA,CACE,EAAC,OAAD,CAAA,SAAO,GAAS,CAAW,CAAA,EAC3B,EAAC,EAAD,CAAkB,KAAM,EAAK,CAAA,CAC5B,IANa,EAAC,EAAD,CAAe,CAAA"}

package/dist/phone-number-Cu7Mnl6J.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"phone-number-Cu7Mnl6J.mjs","names":[],"sources":["../packages/components/features/tables/components/atoms/phone-number.tsx"],"sourcesContent":["import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';\n\nimport { UITableEmpty } from './empty';\n\n/**\n * Formats and displays a phone number string in a table cell using the\n * `(NXX) NXX-XXXX` pattern, with a tooltip that shows the full international\n * dialling representation. Renders {@link UITableEmpty} when `value` is absent.\n *\n * @example\n * import { UITablePhoneNumberDisplay } from '@customafk/lunas-ui/features/tables';\n *\n * <UITablePhoneNumberDisplay value=\"0843456789\" />\n */\nexport const UITablePhoneNumberDisplay: React.FC<{\n  /** The raw phone number string to format and display; `null`/`undefined`/empty renders an empty state. */\n  value: string | null | undefined;\n}> = ({ value }) => {\n  if (!value) return <UITableEmpty />;\n\n  return (\n    <Tooltip>\n      <TooltipTrigger asChild>\n        <p className=\"font-number text-text-positive text-sm tabular-nums\">{value.replace(/(\\d{3})(\\d{3})(\\d{4})/, '($1) $2-$3')}</p>\n      </TooltipTrigger>\n      <TooltipContent align=\"start\">\n        <p className=\"tabular-nums\">{value.slice(1).replace(/(\\d{2})(\\d{3})(\\d{4})/, '+84 $1 $2 $3')}</p>\n      </TooltipContent>\n    </Tooltip>\n  );\n};\n"],"mappings":"+KAcA,MAAa,GAGP,CAAE,WACD,EAGH,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAgB,QAAA,YACd,EAAC,IAAD,CAAG,UAAU,+DAAuD,EAAM,QAAQ,wBAAyB,YAAY,CAAK,CAAA,CAC9G,CAAA,EAChB,EAAC,EAAD,CAAgB,MAAM,iBACpB,EAAC,IAAD,CAAG,UAAU,wBAAgB,EAAM,MAAM,CAAC,CAAC,CAAC,QAAQ,wBAAyB,cAAc,CAAK,CAAA,CAClF,CAAA,CACT,CAAA,CAAA,EAVQ,EAAC,EAAD,CAAe,CAAA"}
+{"version":3,"file":"phone-number-Cu7Mnl6J.mjs","names":[],"sources":["../packages/components/features/tables/components/atoms/phone-number.tsx"],"sourcesContent":["import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';\n\nimport { UITableEmpty } from './empty';\n\n/**\n * Formats and displays a phone number string in a table cell using the\n * `(NXX) NXX-XXXX` pattern, with a tooltip that shows the full international\n * dialling representation. Renders {@link UITableEmpty} when `value` is absent.\n *\n * @example\n * import { UITablePhoneNumberDisplay } from '@customafk/lunas-ui/features/tables';\n *\n * <UITablePhoneNumberDisplay value=\"0843456789\" />\n */\nexport const UITablePhoneNumberDisplay: React.FC<{\n  /** The raw phone number string to format and display; `null`/`undefined`/empty renders an empty state. */\n  value: string | null | undefined;\n}> = ({ value }) => {\n  if (!value) return <UITableEmpty />;\n\n  return (\n    <Tooltip>\n      <TooltipTrigger asChild>\n        <p className=\"font-number text-text-positive text-sm tabular-nums\">{value.replace(/(\\d{3})(\\d{3})(\\d{4})/, '($1) $2-$3')}</p>\n      </TooltipTrigger>\n      <TooltipContent align=\"start\">\n        <p className=\"tabular-nums\">{value.slice(1).replace(/(\\d{2})(\\d{3})(\\d{4})/, '+84 $1 $2 $3')}</p>\n      </TooltipContent>\n    </Tooltip>\n  );\n};\n"],"mappings":"+KAcA,MAAa,GAGP,CAAE,WACD,EAGH,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAgB,QAAA,GACd,SAAA,EAAC,IAAD,CAAG,UAAU,sDAAuD,SAAA,EAAM,QAAQ,wBAAyB,YAAY,CAAK,CAAA,CAC9G,CAAA,EAChB,EAAC,EAAD,CAAgB,MAAM,QACpB,SAAA,EAAC,IAAD,CAAG,UAAU,eAAgB,SAAA,EAAM,MAAM,CAAC,CAAC,CAAC,QAAQ,wBAAyB,cAAc,CAAK,CAAA,CAClF,CAAA,CACT,CAAA,CAAA,EAVQ,EAAC,EAAD,CAAe,CAAA"}

package/dist/{phone-number-6b_pkGI1.d.cts → phone-number-D9j5xYDW.d.cts}

@@ -1,6 +1,7 @@
 //#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;
+  /** 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.
@@ -15,4 +16,4 @@ type PhoneNumberDisplayProps = {
 declare const PhoneNumberDisplay: React.FC<PhoneNumberDisplayProps>;
 //#endregion
 export { PhoneNumberDisplay as t };
-//# sourceMappingURL=phone-number-6b_pkGI1.d.cts.map
+//# sourceMappingURL=phone-number-D9j5xYDW.d.cts.map

package/dist/{phone-number-6b_pkGI1.d.mts → phone-number-D9j5xYDW.d.mts}

@@ -1,6 +1,7 @@
 //#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;
+  /** 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.
@@ -15,4 +16,4 @@ type PhoneNumberDisplayProps = {
 declare const PhoneNumberDisplay: React.FC<PhoneNumberDisplayProps>;
 //#endregion
 export { PhoneNumberDisplay as t };
-//# sourceMappingURL=phone-number-6b_pkGI1.d.mts.map
+//# sourceMappingURL=phone-number-D9j5xYDW.d.mts.map

package/dist/phone-number-DJvfJg1b.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"phone-number-DJvfJg1b.cjs","names":["UITableEmpty","Tooltip","TooltipTrigger","TooltipContent"],"sources":["../packages/components/features/tables/components/atoms/phone-number.tsx"],"sourcesContent":["import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';\n\nimport { UITableEmpty } from './empty';\n\n/**\n * Formats and displays a phone number string in a table cell using the\n * `(NXX) NXX-XXXX` pattern, with a tooltip that shows the full international\n * dialling representation. Renders {@link UITableEmpty} when `value` is absent.\n *\n * @example\n * import { UITablePhoneNumberDisplay } from '@customafk/lunas-ui/features/tables';\n *\n * <UITablePhoneNumberDisplay value=\"0843456789\" />\n */\nexport const UITablePhoneNumberDisplay: React.FC<{\n  /** The raw phone number string to format and display; `null`/`undefined`/empty renders an empty state. */\n  value: string | null | undefined;\n}> = ({ value }) => {\n  if (!value) return <UITableEmpty />;\n\n  return (\n    <Tooltip>\n      <TooltipTrigger asChild>\n        <p className=\"font-number text-text-positive text-sm tabular-nums\">{value.replace(/(\\d{3})(\\d{3})(\\d{4})/, '($1) $2-$3')}</p>\n      </TooltipTrigger>\n      <TooltipContent align=\"start\">\n        <p className=\"tabular-nums\">{value.slice(1).replace(/(\\d{2})(\\d{3})(\\d{4})/, '+84 $1 $2 $3')}</p>\n      </TooltipContent>\n    </Tooltip>\n  );\n};\n"],"mappings":"0GAcA,MAAa,GAGP,CAAE,WACD,GAGH,EAAA,EAAA,KAAA,CAACC,EAAAA,QAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,QAAA,aACd,EAAA,EAAA,IAAA,CAAC,IAAD,CAAG,UAAU,+DAAuD,EAAM,QAAQ,wBAAyB,YAAY,CAAK,CAAA,CAC9G,CAAA,GAChB,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,MAAM,kBACpB,EAAA,EAAA,IAAA,CAAC,IAAD,CAAG,UAAU,wBAAgB,EAAM,MAAM,CAAC,CAAC,CAAC,QAAQ,wBAAyB,cAAc,CAAK,CAAA,CAClF,CAAA,CACT,CAAA,CAAA,GAVQ,EAAA,EAAA,IAAA,CAACH,EAAAA,EAAD,CAAe,CAAA"}
+{"version":3,"file":"phone-number-DJvfJg1b.cjs","names":["UITableEmpty","Tooltip","TooltipTrigger","TooltipContent"],"sources":["../packages/components/features/tables/components/atoms/phone-number.tsx"],"sourcesContent":["import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';\n\nimport { UITableEmpty } from './empty';\n\n/**\n * Formats and displays a phone number string in a table cell using the\n * `(NXX) NXX-XXXX` pattern, with a tooltip that shows the full international\n * dialling representation. Renders {@link UITableEmpty} when `value` is absent.\n *\n * @example\n * import { UITablePhoneNumberDisplay } from '@customafk/lunas-ui/features/tables';\n *\n * <UITablePhoneNumberDisplay value=\"0843456789\" />\n */\nexport const UITablePhoneNumberDisplay: React.FC<{\n  /** The raw phone number string to format and display; `null`/`undefined`/empty renders an empty state. */\n  value: string | null | undefined;\n}> = ({ value }) => {\n  if (!value) return <UITableEmpty />;\n\n  return (\n    <Tooltip>\n      <TooltipTrigger asChild>\n        <p className=\"font-number text-text-positive text-sm tabular-nums\">{value.replace(/(\\d{3})(\\d{3})(\\d{4})/, '($1) $2-$3')}</p>\n      </TooltipTrigger>\n      <TooltipContent align=\"start\">\n        <p className=\"tabular-nums\">{value.slice(1).replace(/(\\d{2})(\\d{3})(\\d{4})/, '+84 $1 $2 $3')}</p>\n      </TooltipContent>\n    </Tooltip>\n  );\n};\n"],"mappings":"0GAcA,MAAa,GAGP,CAAE,WACD,GAGH,EAAA,EAAA,KAAA,CAACC,EAAAA,QAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,QAAA,GACd,UAAA,EAAA,EAAA,IAAA,CAAC,IAAD,CAAG,UAAU,sDAAuD,SAAA,EAAM,QAAQ,wBAAyB,YAAY,CAAK,CAAA,CAC9G,CAAA,GAChB,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,MAAM,QACpB,UAAA,EAAA,EAAA,IAAA,CAAC,IAAD,CAAG,UAAU,eAAgB,SAAA,EAAM,MAAM,CAAC,CAAC,CAAC,QAAQ,wBAAyB,cAAc,CAAK,CAAA,CAClF,CAAA,CACT,CAAA,CAAA,GAVQ,EAAA,EAAA,IAAA,CAACH,EAAAA,EAAD,CAAe,CAAA"}

package/dist/{popover-form-CLr6xIl5.cjs → popover-form-Bq2GcuZu.cjs}

@@ -1,2 +1,2 @@
-const e=require("./close-BYHgEZvZ.cjs"),t=require("./tanstack-form-Bae0TOEr.cjs"),n=require("./submit-button-CvINfld5.cjs");let r=require("@customafk/react-toolkit/utils"),i=require("react/jsx-runtime"),a=require("radix-ui");const o=({title:o,open:s,contentClassName:c,onOpenChange:l,children:u})=>{let d=t.K();return(0,i.jsx)(a.Dialog.Root,{"data-slot":`dialog`,open:s,onOpenChange:l,children:(0,i.jsxs)(a.Dialog.Portal,{"data-slot":`dialog-portal`,children:[(0,i.jsx)(a.Dialog.Overlay,{"data-slot":`dialog-overlay`,className:(0,r.cn)(`fixed inset-0 z-40 bg-black/40 backdrop-blur-sm`,`data-[state=open]:animate-in data-[state=open]:fade-in`,`data-[state=closed]:animate-out data-[state=closed]:fade-out`)}),(0,i.jsx)(a.Dialog.Content,{"data-slot":`dialog-content`,className:(0,r.cn)(`fixed top-4 right-4 z-50 h-[calc(100dvh-2rem)] min-w-sm max-w-xl rounded-md bg-background shadow-lg ring-1 ring-border`,`duration-300`,`data-[state=open]:animate-in data-[state=open]:slide-in-from-right data-[state=open]:fade-in`,`data-[state=closed]:animate-out data-[state=closed]:slide-out-to-right data-[state=closed]:fade-out`),children:(0,i.jsxs)(`section`,{className:`relative flex size-full flex-col`,children:[(0,i.jsx)(`header`,{className:`flex h-14 shrink-0 items-center border-b border-border px-5`,children:(0,i.jsx)(`h2`,{className:`font-semibold text-base tracking-tight text-text-positive`,children:o})}),(0,i.jsx)(`div`,{className:(0,r.cn)(`flex flex-1 flex-col overflow-y-auto py-4`,c),children:u}),(0,i.jsxs)(`div`,{className:`flex shrink-0 flex-col gap-2 border-t border-border px-4 py-3`,children:[(0,i.jsx)(d.Subscribe,{selector:e=>({isSubmitting:e.isSubmitting,disabled:e.isPristine||!e.isValid||e.isValidating||e.isSubmitting||!e.canSubmit}),children:({isSubmitting:e,disabled:t})=>(0,i.jsx)(n.t,{isSubmitting:e,disabled:t,className:`w-full`,onClick:()=>d.handleSubmit()})}),(0,i.jsx)(d.Subscribe,{selector:e=>({disabled:e.isPristine||e.isSubmitting}),children:({disabled:e})=>(0,i.jsx)(n.n,{disabled:e,className:`w-full`,onClick:()=>{d.reset(),l?.(!1)}})})]}),(0,i.jsx)(a.Dialog.Close,{asChild:!0,children:(0,i.jsx)(e.t,{className:`absolute top-2.5 right-3`})})]})})]})})};exports.TanStackPopoverForm=o;
-//# sourceMappingURL=popover-form-CLr6xIl5.cjs.map
+const e=require("./close-BYHgEZvZ.cjs"),t=require("./tanstack-form-BxqS40rB.cjs"),n=require("./submit-button-CvINfld5.cjs");let r=require("@customafk/react-toolkit/utils"),i=require("react/jsx-runtime"),a=require("radix-ui");const o=({title:o,open:s,contentClassName:c,onOpenChange:l,children:u})=>{let d=t.K();return(0,i.jsx)(a.Dialog.Root,{"data-slot":`dialog`,open:s,onOpenChange:l,children:(0,i.jsxs)(a.Dialog.Portal,{"data-slot":`dialog-portal`,children:[(0,i.jsx)(a.Dialog.Overlay,{"data-slot":`dialog-overlay`,className:(0,r.cn)(`fixed inset-0 z-40 bg-black/40 backdrop-blur-sm`,`data-[state=open]:animate-in data-[state=open]:fade-in`,`data-[state=closed]:animate-out data-[state=closed]:fade-out`)}),(0,i.jsx)(a.Dialog.Content,{"data-slot":`dialog-content`,className:(0,r.cn)(`fixed top-4 right-4 z-50 h-[calc(100dvh-2rem)] min-w-sm max-w-xl rounded-md bg-background shadow-lg ring-1 ring-border`,`duration-300`,`data-[state=open]:animate-in data-[state=open]:slide-in-from-right data-[state=open]:fade-in`,`data-[state=closed]:animate-out data-[state=closed]:slide-out-to-right data-[state=closed]:fade-out`),children:(0,i.jsxs)(`section`,{className:`relative flex size-full flex-col`,children:[(0,i.jsx)(`header`,{className:`flex h-14 shrink-0 items-center border-b border-border px-5`,children:(0,i.jsx)(`h2`,{className:`font-semibold text-base tracking-tight text-text-positive`,children:o})}),(0,i.jsx)(`div`,{className:(0,r.cn)(`flex flex-1 flex-col overflow-y-auto py-4`,c),children:u}),(0,i.jsxs)(`div`,{className:`flex shrink-0 flex-col gap-2 border-t border-border px-4 py-3`,children:[(0,i.jsx)(d.Subscribe,{selector:e=>({isSubmitting:e.isSubmitting,disabled:e.isPristine||!e.isValid||e.isValidating||e.isSubmitting||!e.canSubmit}),children:({isSubmitting:e,disabled:t})=>(0,i.jsx)(n.t,{isSubmitting:e,disabled:t,className:`w-full`,onClick:()=>d.handleSubmit()})}),(0,i.jsx)(d.Subscribe,{selector:e=>({disabled:e.isPristine||e.isSubmitting}),children:({disabled:e})=>(0,i.jsx)(n.n,{disabled:e,className:`w-full`,onClick:()=>{d.reset(),l?.(!1)}})})]}),(0,i.jsx)(a.Dialog.Close,{asChild:!0,children:(0,i.jsx)(e.t,{className:`absolute top-2.5 right-3`})})]})})]})})};exports.TanStackPopoverForm=o;
+//# sourceMappingURL=popover-form-Bq2GcuZu.cjs.map

package/dist/{popover-form-CLr6xIl5.cjs.map → popover-form-Bq2GcuZu.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"popover-form-CLr6xIl5.cjs","names":["useTanStackFormContext","DialogPrimitive","SubmitButton","CancelButton","CloseButton"],"sources":["../packages/components/features/tanstack-form/components/forms/popover-form.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { CloseButton } from '@/components/ui/buttons/close';\n\nimport { Dialog as DialogPrimitive } from 'radix-ui';\nimport { useTanStackFormContext } from '../form-context';\nimport { CancelButton } from '../ui/cancel-button';\nimport { SubmitButton } from '../ui/submit-button';\n\n/**\n * Renders a slide-in side-panel dialog that wraps a TanStack form with built-in submit and cancel actions.\n *\n * @example\n * import { TanStackPopoverForm } from '@customafk/lunas-ui/features/tanstack-form';\n *\n * <TanStackPopoverForm\n *   title=\"Edit Profile\"\n *   open={isOpen}\n *   onOpenChange={setIsOpen}\n * >\n *   <EmailField />\n * </TanStackPopoverForm>\n */\nexport const TanStackPopoverForm: React.FC<\n  React.PropsWithChildren<{\n    /** Heading text displayed in the panel header. */\n    title: string;\n    /** Controlled open state of the popover dialog. */\n    open?: boolean;\n    /** Additional CSS class names applied to the scrollable content area. */\n    contentClassName?: string;\n    /** Callback fired when the open state changes. */\n    onOpenChange?: (open: boolean) => void;\n  }>\n> = ({ title, open, contentClassName, onOpenChange, children }) => {\n  const form = useTanStackFormContext();\n\n  return (\n    <DialogPrimitive.Root data-slot=\"dialog\" open={open} onOpenChange={onOpenChange}>\n      <DialogPrimitive.Portal data-slot=\"dialog-portal\">\n        <DialogPrimitive.Overlay\n          data-slot=\"dialog-overlay\"\n          className={cn(\n            'fixed inset-0 z-40 bg-black/40 backdrop-blur-sm',\n            'data-[state=open]:animate-in data-[state=open]:fade-in',\n            'data-[state=closed]:animate-out data-[state=closed]:fade-out'\n          )}\n        />\n        <DialogPrimitive.Content\n          data-slot=\"dialog-content\"\n          className={cn(\n            'fixed top-4 right-4 z-50 h-[calc(100dvh-2rem)] min-w-sm max-w-xl rounded-md bg-background shadow-lg ring-1 ring-border',\n            'duration-300',\n            'data-[state=open]:animate-in data-[state=open]:slide-in-from-right data-[state=open]:fade-in',\n            'data-[state=closed]:animate-out data-[state=closed]:slide-out-to-right data-[state=closed]:fade-out'\n          )}\n        >\n          <section className=\"relative flex size-full flex-col\">\n            <header className=\"flex h-14 shrink-0 items-center border-b border-border px-5\">\n              <h2 className=\"font-semibold text-base tracking-tight text-text-positive\">{title}</h2>\n            </header>\n\n            <div className={cn('flex flex-1 flex-col overflow-y-auto py-4', contentClassName)}>{children}</div>\n\n            <div className=\"flex shrink-0 flex-col gap-2 border-t border-border px-4 py-3\">\n              <form.Subscribe\n                selector={state => ({\n                  isSubmitting: state.isSubmitting,\n                  disabled: state.isPristine || !state.isValid || state.isValidating || state.isSubmitting || !state.canSubmit,\n                })}\n                children={({ isSubmitting, disabled }) => (\n                  <SubmitButton isSubmitting={isSubmitting} disabled={disabled} className=\"w-full\" onClick={() => form.handleSubmit()} />\n                )}\n              />\n              <form.Subscribe\n                selector={state => ({ disabled: state.isPristine || state.isSubmitting })}\n                children={({ disabled }) => (\n                  <CancelButton\n                    disabled={disabled}\n                    className=\"w-full\"\n                    onClick={() => {\n                      form.reset();\n                      onOpenChange?.(false);\n                    }}\n                  />\n                )}\n              />\n            </div>\n\n            <DialogPrimitive.Close asChild>\n              <CloseButton className=\"absolute top-2.5 right-3\" />\n            </DialogPrimitive.Close>\n          </section>\n        </DialogPrimitive.Content>\n      </DialogPrimitive.Portal>\n    </DialogPrimitive.Root>\n  );\n};\n"],"mappings":"iOAyBA,MAAa,GAWR,CAAE,QAAO,OAAM,mBAAkB,eAAc,cAAe,CACjE,IAAM,EAAOA,EAAAA,EAAuB,EAEpC,OACE,EAAA,EAAA,IAAA,CAACC,EAAAA,OAAgB,KAAjB,CAAsB,YAAU,SAAe,OAAoB,yBACjE,EAAA,EAAA,KAAA,CAACA,EAAAA,OAAgB,OAAjB,CAAwB,YAAU,yBAAlC,EACE,EAAA,EAAA,IAAA,CAACA,EAAAA,OAAgB,QAAjB,CACE,YAAU,iBACV,WAAA,EAAA,EAAA,GAAA,CACE,kDACA,yDACA,8DACF,CACD,CAAA,GACD,EAAA,EAAA,IAAA,CAACA,EAAAA,OAAgB,QAAjB,CACE,YAAU,iBACV,WAAA,EAAA,EAAA,GAAA,CACE,yHACA,eACA,+FACA,qGACF,YAEA,EAAA,EAAA,KAAA,CAAC,UAAD,CAAS,UAAU,4CAAnB,EACE,EAAA,EAAA,IAAA,CAAC,SAAD,CAAQ,UAAU,wEAChB,EAAA,EAAA,IAAA,CAAC,KAAD,CAAI,UAAU,qEAA6D,CAAU,CAAA,CAC/E,CAAA,GAER,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,WAAA,EAAA,EAAA,GAAA,CAAc,4CAA6C,CAAgB,EAAI,UAAc,CAAA,GAElG,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,yEAAf,EACE,EAAA,EAAA,IAAA,CAAC,EAAK,UAAN,CACE,SAAU,IAAU,CAClB,aAAc,EAAM,aACpB,SAAU,EAAM,YAAc,CAAC,EAAM,SAAW,EAAM,cAAgB,EAAM,cAAgB,CAAC,EAAM,SACrG,GACA,UAAW,CAAE,eAAc,eACzB,EAAA,EAAA,IAAA,CAACC,EAAAA,EAAD,CAA4B,eAAwB,WAAU,UAAU,SAAS,YAAe,EAAK,aAAa,CAAI,CAAA,CAEzH,CAAA,GACD,EAAA,EAAA,IAAA,CAAC,EAAK,UAAN,CACE,SAAU,IAAU,CAAE,SAAU,EAAM,YAAc,EAAM,YAAa,GACvE,UAAW,CAAE,eACX,EAAA,EAAA,IAAA,CAACC,EAAAA,EAAD,CACY,WACV,UAAU,SACV,YAAe,CACb,EAAK,MAAM,EACX,IAAe,EAAK,CACtB,CACD,CAAA,CAEJ,CAAA,CACE,KAEL,EAAA,EAAA,IAAA,CAACF,EAAAA,OAAgB,MAAjB,CAAuB,QAAA,aACrB,EAAA,EAAA,IAAA,CAACG,EAAAA,EAAD,CAAa,UAAU,0BAA4B,CAAA,CAC9B,CAAA,CAChB,GACc,CAAA,CACH,GACJ,CAAA,CAE1B"}
+{"version":3,"file":"popover-form-Bq2GcuZu.cjs","names":["useTanStackFormContext","DialogPrimitive","SubmitButton","CancelButton","CloseButton"],"sources":["../packages/components/features/tanstack-form/components/forms/popover-form.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { CloseButton } from '@/components/ui/buttons/close';\n\nimport { Dialog as DialogPrimitive } from 'radix-ui';\nimport { useTanStackFormContext } from '../form-context';\nimport { CancelButton } from '../ui/cancel-button';\nimport { SubmitButton } from '../ui/submit-button';\n\n/**\n * Renders a slide-in side-panel dialog that wraps a TanStack form with built-in submit and cancel actions.\n *\n * @example\n * import { TanStackPopoverForm } from '@customafk/lunas-ui/features/tanstack-form';\n *\n * <TanStackPopoverForm\n *   title=\"Edit Profile\"\n *   open={isOpen}\n *   onOpenChange={setIsOpen}\n * >\n *   <EmailField />\n * </TanStackPopoverForm>\n */\nexport const TanStackPopoverForm: React.FC<\n  React.PropsWithChildren<{\n    /** Heading text displayed in the panel header. */\n    title: string;\n    /** Controlled open state of the popover dialog. */\n    open?: boolean;\n    /** Additional CSS class names applied to the scrollable content area. */\n    contentClassName?: string;\n    /** Callback fired when the open state changes. */\n    onOpenChange?: (open: boolean) => void;\n  }>\n> = ({ title, open, contentClassName, onOpenChange, children }) => {\n  const form = useTanStackFormContext();\n\n  return (\n    <DialogPrimitive.Root data-slot=\"dialog\" open={open} onOpenChange={onOpenChange}>\n      <DialogPrimitive.Portal data-slot=\"dialog-portal\">\n        <DialogPrimitive.Overlay\n          data-slot=\"dialog-overlay\"\n          className={cn(\n            'fixed inset-0 z-40 bg-black/40 backdrop-blur-sm',\n            'data-[state=open]:animate-in data-[state=open]:fade-in',\n            'data-[state=closed]:animate-out data-[state=closed]:fade-out'\n          )}\n        />\n        <DialogPrimitive.Content\n          data-slot=\"dialog-content\"\n          className={cn(\n            'fixed top-4 right-4 z-50 h-[calc(100dvh-2rem)] min-w-sm max-w-xl rounded-md bg-background shadow-lg ring-1 ring-border',\n            'duration-300',\n            'data-[state=open]:animate-in data-[state=open]:slide-in-from-right data-[state=open]:fade-in',\n            'data-[state=closed]:animate-out data-[state=closed]:slide-out-to-right data-[state=closed]:fade-out'\n          )}\n        >\n          <section className=\"relative flex size-full flex-col\">\n            <header className=\"flex h-14 shrink-0 items-center border-b border-border px-5\">\n              <h2 className=\"font-semibold text-base tracking-tight text-text-positive\">{title}</h2>\n            </header>\n\n            <div className={cn('flex flex-1 flex-col overflow-y-auto py-4', contentClassName)}>{children}</div>\n\n            <div className=\"flex shrink-0 flex-col gap-2 border-t border-border px-4 py-3\">\n              <form.Subscribe\n                selector={state => ({\n                  isSubmitting: state.isSubmitting,\n                  disabled: state.isPristine || !state.isValid || state.isValidating || state.isSubmitting || !state.canSubmit,\n                })}\n                children={({ isSubmitting, disabled }) => (\n                  <SubmitButton isSubmitting={isSubmitting} disabled={disabled} className=\"w-full\" onClick={() => form.handleSubmit()} />\n                )}\n              />\n              <form.Subscribe\n                selector={state => ({ disabled: state.isPristine || state.isSubmitting })}\n                children={({ disabled }) => (\n                  <CancelButton\n                    disabled={disabled}\n                    className=\"w-full\"\n                    onClick={() => {\n                      form.reset();\n                      onOpenChange?.(false);\n                    }}\n                  />\n                )}\n              />\n            </div>\n\n            <DialogPrimitive.Close asChild>\n              <CloseButton className=\"absolute top-2.5 right-3\" />\n            </DialogPrimitive.Close>\n          </section>\n        </DialogPrimitive.Content>\n      </DialogPrimitive.Portal>\n    </DialogPrimitive.Root>\n  );\n};\n"],"mappings":"iOAyBA,MAAa,GAWR,CAAE,QAAO,OAAM,mBAAkB,eAAc,cAAe,CACjE,IAAM,EAAOA,EAAAA,EAAuB,EAEpC,OACE,EAAA,EAAA,IAAA,CAACC,EAAAA,OAAgB,KAAjB,CAAsB,YAAU,SAAe,OAAoB,eACjE,UAAA,EAAA,EAAA,KAAA,CAACA,EAAAA,OAAgB,OAAjB,CAAwB,YAAU,gBAAlC,SAAA,EACE,EAAA,EAAA,IAAA,CAACA,EAAAA,OAAgB,QAAjB,CACE,YAAU,iBACV,WAAA,EAAA,EAAA,GAAA,CACE,kDACA,yDACA,8DACF,CACD,CAAA,GACD,EAAA,EAAA,IAAA,CAACA,EAAAA,OAAgB,QAAjB,CACE,YAAU,iBACV,WAAA,EAAA,EAAA,GAAA,CACE,yHACA,eACA,+FACA,qGACF,EAEA,UAAA,EAAA,EAAA,KAAA,CAAC,UAAD,CAAS,UAAU,mCAAnB,SAAA,EACE,EAAA,EAAA,IAAA,CAAC,SAAD,CAAQ,UAAU,8DAChB,UAAA,EAAA,EAAA,IAAA,CAAC,KAAD,CAAI,UAAU,4DAA6D,SAAA,CAAU,CAAA,CAC/E,CAAA,GAER,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,WAAA,EAAA,EAAA,GAAA,CAAc,4CAA6C,CAAgB,EAAI,UAAc,CAAA,GAElG,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,gEAAf,SAAA,EACE,EAAA,EAAA,IAAA,CAAC,EAAK,UAAN,CACE,SAAU,IAAU,CAClB,aAAc,EAAM,aACpB,SAAU,EAAM,YAAc,CAAC,EAAM,SAAW,EAAM,cAAgB,EAAM,cAAgB,CAAC,EAAM,SACrG,GACA,UAAW,CAAE,eAAc,eACzB,EAAA,EAAA,IAAA,CAACC,EAAAA,EAAD,CAA4B,eAAwB,WAAU,UAAU,SAAS,YAAe,EAAK,aAAa,CAAI,CAAA,CAEzH,CAAA,GACD,EAAA,EAAA,IAAA,CAAC,EAAK,UAAN,CACE,SAAU,IAAU,CAAE,SAAU,EAAM,YAAc,EAAM,YAAa,GACvE,UAAW,CAAE,eACX,EAAA,EAAA,IAAA,CAACC,EAAAA,EAAD,CACY,WACV,UAAU,SACV,YAAe,CACb,EAAK,MAAM,EACX,IAAe,EAAK,CACtB,CACD,CAAA,CAEJ,CAAA,CACE,KAEL,EAAA,EAAA,IAAA,CAACF,EAAAA,OAAgB,MAAjB,CAAuB,QAAA,GACrB,UAAA,EAAA,EAAA,IAAA,CAACG,EAAAA,EAAD,CAAa,UAAU,0BAA4B,CAAA,CAC9B,CAAA,CAChB,GACc,CAAA,CACH,GACJ,CAAA,CAE1B"}

package/dist/{popover-form-BmOqFjQM.mjs → popover-form-BsapHJck.mjs}

@@ -1,2 +1,2 @@
-import{t as e}from"./close-DYJZ8fkh.mjs";import{K as t}from"./tanstack-form-AGwPfwiM.mjs";import{n,t as r}from"./submit-button-CGBaPzE9.mjs";import{cn as i}from"@customafk/react-toolkit/utils";import{jsx as a,jsxs as o}from"react/jsx-runtime";import{Dialog as s}from"radix-ui";const c=({title:c,open:l,contentClassName:u,onOpenChange:d,children:f})=>{let p=t();return a(s.Root,{"data-slot":`dialog`,open:l,onOpenChange:d,children:o(s.Portal,{"data-slot":`dialog-portal`,children:[a(s.Overlay,{"data-slot":`dialog-overlay`,className:i(`fixed inset-0 z-40 bg-black/40 backdrop-blur-sm`,`data-[state=open]:animate-in data-[state=open]:fade-in`,`data-[state=closed]:animate-out data-[state=closed]:fade-out`)}),a(s.Content,{"data-slot":`dialog-content`,className:i(`fixed top-4 right-4 z-50 h-[calc(100dvh-2rem)] min-w-sm max-w-xl rounded-md bg-background shadow-lg ring-1 ring-border`,`duration-300`,`data-[state=open]:animate-in data-[state=open]:slide-in-from-right data-[state=open]:fade-in`,`data-[state=closed]:animate-out data-[state=closed]:slide-out-to-right data-[state=closed]:fade-out`),children:o(`section`,{className:`relative flex size-full flex-col`,children:[a(`header`,{className:`flex h-14 shrink-0 items-center border-b border-border px-5`,children:a(`h2`,{className:`font-semibold text-base tracking-tight text-text-positive`,children:c})}),a(`div`,{className:i(`flex flex-1 flex-col overflow-y-auto py-4`,u),children:f}),o(`div`,{className:`flex shrink-0 flex-col gap-2 border-t border-border px-4 py-3`,children:[a(p.Subscribe,{selector:e=>({isSubmitting:e.isSubmitting,disabled:e.isPristine||!e.isValid||e.isValidating||e.isSubmitting||!e.canSubmit}),children:({isSubmitting:e,disabled:t})=>a(r,{isSubmitting:e,disabled:t,className:`w-full`,onClick:()=>p.handleSubmit()})}),a(p.Subscribe,{selector:e=>({disabled:e.isPristine||e.isSubmitting}),children:({disabled:e})=>a(n,{disabled:e,className:`w-full`,onClick:()=>{p.reset(),d?.(!1)}})})]}),a(s.Close,{asChild:!0,children:a(e,{className:`absolute top-2.5 right-3`})})]})})]})})};export{c as TanStackPopoverForm};
-//# sourceMappingURL=popover-form-BmOqFjQM.mjs.map
+import{t as e}from"./close-DYJZ8fkh.mjs";import{K as t}from"./tanstack-form-q9hDCc0Y.mjs";import{n,t as r}from"./submit-button-CGBaPzE9.mjs";import{cn as i}from"@customafk/react-toolkit/utils";import{jsx as a,jsxs as o}from"react/jsx-runtime";import{Dialog as s}from"radix-ui";const c=({title:c,open:l,contentClassName:u,onOpenChange:d,children:f})=>{let p=t();return a(s.Root,{"data-slot":`dialog`,open:l,onOpenChange:d,children:o(s.Portal,{"data-slot":`dialog-portal`,children:[a(s.Overlay,{"data-slot":`dialog-overlay`,className:i(`fixed inset-0 z-40 bg-black/40 backdrop-blur-sm`,`data-[state=open]:animate-in data-[state=open]:fade-in`,`data-[state=closed]:animate-out data-[state=closed]:fade-out`)}),a(s.Content,{"data-slot":`dialog-content`,className:i(`fixed top-4 right-4 z-50 h-[calc(100dvh-2rem)] min-w-sm max-w-xl rounded-md bg-background shadow-lg ring-1 ring-border`,`duration-300`,`data-[state=open]:animate-in data-[state=open]:slide-in-from-right data-[state=open]:fade-in`,`data-[state=closed]:animate-out data-[state=closed]:slide-out-to-right data-[state=closed]:fade-out`),children:o(`section`,{className:`relative flex size-full flex-col`,children:[a(`header`,{className:`flex h-14 shrink-0 items-center border-b border-border px-5`,children:a(`h2`,{className:`font-semibold text-base tracking-tight text-text-positive`,children:c})}),a(`div`,{className:i(`flex flex-1 flex-col overflow-y-auto py-4`,u),children:f}),o(`div`,{className:`flex shrink-0 flex-col gap-2 border-t border-border px-4 py-3`,children:[a(p.Subscribe,{selector:e=>({isSubmitting:e.isSubmitting,disabled:e.isPristine||!e.isValid||e.isValidating||e.isSubmitting||!e.canSubmit}),children:({isSubmitting:e,disabled:t})=>a(r,{isSubmitting:e,disabled:t,className:`w-full`,onClick:()=>p.handleSubmit()})}),a(p.Subscribe,{selector:e=>({disabled:e.isPristine||e.isSubmitting}),children:({disabled:e})=>a(n,{disabled:e,className:`w-full`,onClick:()=>{p.reset(),d?.(!1)}})})]}),a(s.Close,{asChild:!0,children:a(e,{className:`absolute top-2.5 right-3`})})]})})]})})};export{c as TanStackPopoverForm};
+//# sourceMappingURL=popover-form-BsapHJck.mjs.map

package/dist/{popover-form-BmOqFjQM.mjs.map → popover-form-BsapHJck.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"popover-form-BmOqFjQM.mjs","names":["DialogPrimitive"],"sources":["../packages/components/features/tanstack-form/components/forms/popover-form.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { CloseButton } from '@/components/ui/buttons/close';\n\nimport { Dialog as DialogPrimitive } from 'radix-ui';\nimport { useTanStackFormContext } from '../form-context';\nimport { CancelButton } from '../ui/cancel-button';\nimport { SubmitButton } from '../ui/submit-button';\n\n/**\n * Renders a slide-in side-panel dialog that wraps a TanStack form with built-in submit and cancel actions.\n *\n * @example\n * import { TanStackPopoverForm } from '@customafk/lunas-ui/features/tanstack-form';\n *\n * <TanStackPopoverForm\n *   title=\"Edit Profile\"\n *   open={isOpen}\n *   onOpenChange={setIsOpen}\n * >\n *   <EmailField />\n * </TanStackPopoverForm>\n */\nexport const TanStackPopoverForm: React.FC<\n  React.PropsWithChildren<{\n    /** Heading text displayed in the panel header. */\n    title: string;\n    /** Controlled open state of the popover dialog. */\n    open?: boolean;\n    /** Additional CSS class names applied to the scrollable content area. */\n    contentClassName?: string;\n    /** Callback fired when the open state changes. */\n    onOpenChange?: (open: boolean) => void;\n  }>\n> = ({ title, open, contentClassName, onOpenChange, children }) => {\n  const form = useTanStackFormContext();\n\n  return (\n    <DialogPrimitive.Root data-slot=\"dialog\" open={open} onOpenChange={onOpenChange}>\n      <DialogPrimitive.Portal data-slot=\"dialog-portal\">\n        <DialogPrimitive.Overlay\n          data-slot=\"dialog-overlay\"\n          className={cn(\n            'fixed inset-0 z-40 bg-black/40 backdrop-blur-sm',\n            'data-[state=open]:animate-in data-[state=open]:fade-in',\n            'data-[state=closed]:animate-out data-[state=closed]:fade-out'\n          )}\n        />\n        <DialogPrimitive.Content\n          data-slot=\"dialog-content\"\n          className={cn(\n            'fixed top-4 right-4 z-50 h-[calc(100dvh-2rem)] min-w-sm max-w-xl rounded-md bg-background shadow-lg ring-1 ring-border',\n            'duration-300',\n            'data-[state=open]:animate-in data-[state=open]:slide-in-from-right data-[state=open]:fade-in',\n            'data-[state=closed]:animate-out data-[state=closed]:slide-out-to-right data-[state=closed]:fade-out'\n          )}\n        >\n          <section className=\"relative flex size-full flex-col\">\n            <header className=\"flex h-14 shrink-0 items-center border-b border-border px-5\">\n              <h2 className=\"font-semibold text-base tracking-tight text-text-positive\">{title}</h2>\n            </header>\n\n            <div className={cn('flex flex-1 flex-col overflow-y-auto py-4', contentClassName)}>{children}</div>\n\n            <div className=\"flex shrink-0 flex-col gap-2 border-t border-border px-4 py-3\">\n              <form.Subscribe\n                selector={state => ({\n                  isSubmitting: state.isSubmitting,\n                  disabled: state.isPristine || !state.isValid || state.isValidating || state.isSubmitting || !state.canSubmit,\n                })}\n                children={({ isSubmitting, disabled }) => (\n                  <SubmitButton isSubmitting={isSubmitting} disabled={disabled} className=\"w-full\" onClick={() => form.handleSubmit()} />\n                )}\n              />\n              <form.Subscribe\n                selector={state => ({ disabled: state.isPristine || state.isSubmitting })}\n                children={({ disabled }) => (\n                  <CancelButton\n                    disabled={disabled}\n                    className=\"w-full\"\n                    onClick={() => {\n                      form.reset();\n                      onOpenChange?.(false);\n                    }}\n                  />\n                )}\n              />\n            </div>\n\n            <DialogPrimitive.Close asChild>\n              <CloseButton className=\"absolute top-2.5 right-3\" />\n            </DialogPrimitive.Close>\n          </section>\n        </DialogPrimitive.Content>\n      </DialogPrimitive.Portal>\n    </DialogPrimitive.Root>\n  );\n};\n"],"mappings":"qRAyBA,MAAa,GAWR,CAAE,QAAO,OAAM,mBAAkB,eAAc,cAAe,CACjE,IAAM,EAAO,EAAuB,EAEpC,OACE,EAACA,EAAgB,KAAjB,CAAsB,YAAU,SAAe,OAAoB,wBACjE,EAACA,EAAgB,OAAjB,CAAwB,YAAU,yBAAlC,CACE,EAACA,EAAgB,QAAjB,CACE,YAAU,iBACV,UAAW,EACT,kDACA,yDACA,8DACF,CACD,CAAA,EACD,EAACA,EAAgB,QAAjB,CACE,YAAU,iBACV,UAAW,EACT,yHACA,eACA,+FACA,qGACF,WAEA,EAAC,UAAD,CAAS,UAAU,4CAAnB,CACE,EAAC,SAAD,CAAQ,UAAU,uEAChB,EAAC,KAAD,CAAI,UAAU,qEAA6D,CAAU,CAAA,CAC/E,CAAA,EAER,EAAC,MAAD,CAAK,UAAW,EAAG,4CAA6C,CAAgB,EAAI,UAAc,CAAA,EAElG,EAAC,MAAD,CAAK,UAAU,yEAAf,CACE,EAAC,EAAK,UAAN,CACE,SAAU,IAAU,CAClB,aAAc,EAAM,aACpB,SAAU,EAAM,YAAc,CAAC,EAAM,SAAW,EAAM,cAAgB,EAAM,cAAgB,CAAC,EAAM,SACrG,GACA,UAAW,CAAE,eAAc,cACzB,EAAC,EAAD,CAA4B,eAAwB,WAAU,UAAU,SAAS,YAAe,EAAK,aAAa,CAAI,CAAA,CAEzH,CAAA,EACD,EAAC,EAAK,UAAN,CACE,SAAU,IAAU,CAAE,SAAU,EAAM,YAAc,EAAM,YAAa,GACvE,UAAW,CAAE,cACX,EAAC,EAAD,CACY,WACV,UAAU,SACV,YAAe,CACb,EAAK,MAAM,EACX,IAAe,EAAK,CACtB,CACD,CAAA,CAEJ,CAAA,CACE,IAEL,EAACA,EAAgB,MAAjB,CAAuB,QAAA,YACrB,EAAC,EAAD,CAAa,UAAU,0BAA4B,CAAA,CAC9B,CAAA,CAChB,GACc,CAAA,CACH,GACJ,CAAA,CAE1B"}
+{"version":3,"file":"popover-form-BsapHJck.mjs","names":["DialogPrimitive"],"sources":["../packages/components/features/tanstack-form/components/forms/popover-form.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { CloseButton } from '@/components/ui/buttons/close';\n\nimport { Dialog as DialogPrimitive } from 'radix-ui';\nimport { useTanStackFormContext } from '../form-context';\nimport { CancelButton } from '../ui/cancel-button';\nimport { SubmitButton } from '../ui/submit-button';\n\n/**\n * Renders a slide-in side-panel dialog that wraps a TanStack form with built-in submit and cancel actions.\n *\n * @example\n * import { TanStackPopoverForm } from '@customafk/lunas-ui/features/tanstack-form';\n *\n * <TanStackPopoverForm\n *   title=\"Edit Profile\"\n *   open={isOpen}\n *   onOpenChange={setIsOpen}\n * >\n *   <EmailField />\n * </TanStackPopoverForm>\n */\nexport const TanStackPopoverForm: React.FC<\n  React.PropsWithChildren<{\n    /** Heading text displayed in the panel header. */\n    title: string;\n    /** Controlled open state of the popover dialog. */\n    open?: boolean;\n    /** Additional CSS class names applied to the scrollable content area. */\n    contentClassName?: string;\n    /** Callback fired when the open state changes. */\n    onOpenChange?: (open: boolean) => void;\n  }>\n> = ({ title, open, contentClassName, onOpenChange, children }) => {\n  const form = useTanStackFormContext();\n\n  return (\n    <DialogPrimitive.Root data-slot=\"dialog\" open={open} onOpenChange={onOpenChange}>\n      <DialogPrimitive.Portal data-slot=\"dialog-portal\">\n        <DialogPrimitive.Overlay\n          data-slot=\"dialog-overlay\"\n          className={cn(\n            'fixed inset-0 z-40 bg-black/40 backdrop-blur-sm',\n            'data-[state=open]:animate-in data-[state=open]:fade-in',\n            'data-[state=closed]:animate-out data-[state=closed]:fade-out'\n          )}\n        />\n        <DialogPrimitive.Content\n          data-slot=\"dialog-content\"\n          className={cn(\n            'fixed top-4 right-4 z-50 h-[calc(100dvh-2rem)] min-w-sm max-w-xl rounded-md bg-background shadow-lg ring-1 ring-border',\n            'duration-300',\n            'data-[state=open]:animate-in data-[state=open]:slide-in-from-right data-[state=open]:fade-in',\n            'data-[state=closed]:animate-out data-[state=closed]:slide-out-to-right data-[state=closed]:fade-out'\n          )}\n        >\n          <section className=\"relative flex size-full flex-col\">\n            <header className=\"flex h-14 shrink-0 items-center border-b border-border px-5\">\n              <h2 className=\"font-semibold text-base tracking-tight text-text-positive\">{title}</h2>\n            </header>\n\n            <div className={cn('flex flex-1 flex-col overflow-y-auto py-4', contentClassName)}>{children}</div>\n\n            <div className=\"flex shrink-0 flex-col gap-2 border-t border-border px-4 py-3\">\n              <form.Subscribe\n                selector={state => ({\n                  isSubmitting: state.isSubmitting,\n                  disabled: state.isPristine || !state.isValid || state.isValidating || state.isSubmitting || !state.canSubmit,\n                })}\n                children={({ isSubmitting, disabled }) => (\n                  <SubmitButton isSubmitting={isSubmitting} disabled={disabled} className=\"w-full\" onClick={() => form.handleSubmit()} />\n                )}\n              />\n              <form.Subscribe\n                selector={state => ({ disabled: state.isPristine || state.isSubmitting })}\n                children={({ disabled }) => (\n                  <CancelButton\n                    disabled={disabled}\n                    className=\"w-full\"\n                    onClick={() => {\n                      form.reset();\n                      onOpenChange?.(false);\n                    }}\n                  />\n                )}\n              />\n            </div>\n\n            <DialogPrimitive.Close asChild>\n              <CloseButton className=\"absolute top-2.5 right-3\" />\n            </DialogPrimitive.Close>\n          </section>\n        </DialogPrimitive.Content>\n      </DialogPrimitive.Portal>\n    </DialogPrimitive.Root>\n  );\n};\n"],"mappings":"qRAyBA,MAAa,GAWR,CAAE,QAAO,OAAM,mBAAkB,eAAc,cAAe,CACjE,IAAM,EAAO,EAAuB,EAEpC,OACE,EAACA,EAAgB,KAAjB,CAAsB,YAAU,SAAe,OAAoB,eACjE,SAAA,EAACA,EAAgB,OAAjB,CAAwB,YAAU,gBAAlC,SAAA,CACE,EAACA,EAAgB,QAAjB,CACE,YAAU,iBACV,UAAW,EACT,kDACA,yDACA,8DACF,CACD,CAAA,EACD,EAACA,EAAgB,QAAjB,CACE,YAAU,iBACV,UAAW,EACT,yHACA,eACA,+FACA,qGACF,EAEA,SAAA,EAAC,UAAD,CAAS,UAAU,mCAAnB,SAAA,CACE,EAAC,SAAD,CAAQ,UAAU,8DAChB,SAAA,EAAC,KAAD,CAAI,UAAU,4DAA6D,SAAA,CAAU,CAAA,CAC/E,CAAA,EAER,EAAC,MAAD,CAAK,UAAW,EAAG,4CAA6C,CAAgB,EAAI,UAAc,CAAA,EAElG,EAAC,MAAD,CAAK,UAAU,gEAAf,SAAA,CACE,EAAC,EAAK,UAAN,CACE,SAAU,IAAU,CAClB,aAAc,EAAM,aACpB,SAAU,EAAM,YAAc,CAAC,EAAM,SAAW,EAAM,cAAgB,EAAM,cAAgB,CAAC,EAAM,SACrG,GACA,UAAW,CAAE,eAAc,cACzB,EAAC,EAAD,CAA4B,eAAwB,WAAU,UAAU,SAAS,YAAe,EAAK,aAAa,CAAI,CAAA,CAEzH,CAAA,EACD,EAAC,EAAK,UAAN,CACE,SAAU,IAAU,CAAE,SAAU,EAAM,YAAc,EAAM,YAAa,GACvE,UAAW,CAAE,cACX,EAAC,EAAD,CACY,WACV,UAAU,SACV,YAAe,CACb,EAAK,MAAM,EACX,IAAe,EAAK,CACtB,CACD,CAAA,CAEJ,CAAA,CACE,IAEL,EAACA,EAAgB,MAAjB,CAAuB,QAAA,GACrB,SAAA,EAAC,EAAD,CAAa,UAAU,0BAA4B,CAAA,CAC9B,CAAA,CAChB,GACc,CAAA,CACH,GACJ,CAAA,CAE1B"}

package/dist/{popover-CdOCi0xg.d.cts → popover-qfF3o0zL.d.cts}

@@ -1,5 +1,4 @@
 import { Popover } from "radix-ui";
-
 //#region packages/components/ui/popover.d.ts
 /**
  * Floating panel built on Radix UI's Popover primitives, anchored to a trigger element with animated open/close transitions.
@@ -22,29 +21,15 @@ import { Popover } from "radix-ui";
  * </Popover>
  * ```
  */
-declare function Popover$1({
-  ...props
-}: React.ComponentProps<typeof Popover.Root>): import("react").JSX.Element;
+declare function Popover$1({ ...props }: React.ComponentProps<typeof Popover.Root>): import("react").JSX.Element;
 /** Element that opens or closes the popover on click; use `asChild` to render a custom trigger element. */
-declare function PopoverTrigger({
-  ...props
-}: React.ComponentProps<typeof Popover.Trigger>): import("react").JSX.Element;
+declare function PopoverTrigger({ ...props }: React.ComponentProps<typeof Popover.Trigger>): import("react").JSX.Element;
 /** Floating content panel rendered in a portal, matching the trigger width and animated on open/close. */
-declare function PopoverContent({
-  className,
-  align,
-  sideOffset,
-  ...props
-}: React.ComponentProps<typeof Popover.Content>): import("react").JSX.Element;
+declare function PopoverContent({ className, align, sideOffset, ...props }: React.ComponentProps<typeof Popover.Content>): import("react").JSX.Element;
 /** Optional anchor element that overrides the trigger as the popover's positioning reference point. */
-declare function PopoverAnchor({
-  ...props
-}: React.ComponentProps<typeof Popover.Anchor>): import("react").JSX.Element;
+declare function PopoverAnchor({ ...props }: React.ComponentProps<typeof Popover.Anchor>): import("react").JSX.Element;
 /** Close button pre-positioned at the top-right corner of `PopoverContent` using the shared `CloseButton` primitive. */
-declare function PopoverClose({
-  className,
-  ...props
-}: React.ComponentProps<typeof Popover.Close>): import("react").JSX.Element;
+declare function PopoverClose({ className, ...props }: React.ComponentProps<typeof Popover.Close>): import("react").JSX.Element;
 //#endregion
 export { PopoverTrigger as a, PopoverContent as i, PopoverAnchor as n, PopoverClose as r, Popover$1 as t };
-//# sourceMappingURL=popover-CdOCi0xg.d.cts.map
+//# sourceMappingURL=popover-qfF3o0zL.d.cts.map

package/dist/{popover-CdOCi0xg.d.mts → popover-qfF3o0zL.d.mts}

@@ -1,5 +1,4 @@
 import { Popover } from "radix-ui";
-
 //#region packages/components/ui/popover.d.ts
 /**
  * Floating panel built on Radix UI's Popover primitives, anchored to a trigger element with animated open/close transitions.
@@ -22,29 +21,15 @@ import { Popover } from "radix-ui";
  * </Popover>
  * ```
  */
-declare function Popover$1({
-  ...props
-}: React.ComponentProps<typeof Popover.Root>): import("react").JSX.Element;
+declare function Popover$1({ ...props }: React.ComponentProps<typeof Popover.Root>): import("react").JSX.Element;
 /** Element that opens or closes the popover on click; use `asChild` to render a custom trigger element. */
-declare function PopoverTrigger({
-  ...props
-}: React.ComponentProps<typeof Popover.Trigger>): import("react").JSX.Element;
+declare function PopoverTrigger({ ...props }: React.ComponentProps<typeof Popover.Trigger>): import("react").JSX.Element;
 /** Floating content panel rendered in a portal, matching the trigger width and animated on open/close. */
-declare function PopoverContent({
-  className,
-  align,
-  sideOffset,
-  ...props
-}: React.ComponentProps<typeof Popover.Content>): import("react").JSX.Element;
+declare function PopoverContent({ className, align, sideOffset, ...props }: React.ComponentProps<typeof Popover.Content>): import("react").JSX.Element;
 /** Optional anchor element that overrides the trigger as the popover's positioning reference point. */
-declare function PopoverAnchor({
-  ...props
-}: React.ComponentProps<typeof Popover.Anchor>): import("react").JSX.Element;
+declare function PopoverAnchor({ ...props }: React.ComponentProps<typeof Popover.Anchor>): import("react").JSX.Element;
 /** Close button pre-positioned at the top-right corner of `PopoverContent` using the shared `CloseButton` primitive. */
-declare function PopoverClose({
-  className,
-  ...props
-}: React.ComponentProps<typeof Popover.Close>): import("react").JSX.Element;
+declare function PopoverClose({ className, ...props }: React.ComponentProps<typeof Popover.Close>): import("react").JSX.Element;
 //#endregion
 export { PopoverTrigger as a, PopoverContent as i, PopoverAnchor as n, PopoverClose as r, Popover$1 as t };
-//# sourceMappingURL=popover-CdOCi0xg.d.mts.map
+//# sourceMappingURL=popover-qfF3o0zL.d.mts.map

package/dist/portfolio-allocation-treemap-Bn0X4wb6.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"portfolio-allocation-treemap-Bn0X4wb6.cjs","names":["formatCompactNumber","getChartColor","ChartContainer","Treemap","ChartTooltip","ChartTooltipContent"],"sources":["../packages/components/features/charts/components/portfolio-allocation-treemap.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { type ChartConfig, ChartContainer, ChartTooltip, ChartTooltipContent } from '@/components/ui/chart';\n\nimport type { TreemapNode } from 'recharts';\nimport { Treemap } from 'recharts';\nimport type { BaseChartProps, PortfolioHolding } from '../types';\nimport { formatCompactNumber, getChartColor } from '../utils';\n\nexport type PortfolioAllocationTreemapProps = BaseChartProps & {\n  data: PortfolioHolding[];\n  valueFormatter?: (value: number) => string;\n  /** Shows the holding name and formatted value inside each rect when it fits. Defaults to `true`. */\n  showLabels?: boolean;\n};\n\nconst toKey = (holding: PortfolioHolding): string => holding.key || holding.name.toLowerCase().replace(/[^a-z0-9]+/g, '-');\n\n/**\n * A treemap for portfolio holdings / asset allocation, sized by weight — clearer than a donut\n * once there are more than a handful of positions.\n *\n * @example\n * ```tsx\n * import { PortfolioAllocationTreemap } from '@customafk/lunas-ui/features/charts';\n *\n * <PortfolioAllocationTreemap\n *   data={[\n *     { name: 'AAPL', value: 24000 },\n *     { name: 'MSFT', value: 18500 },\n *     { name: 'Bonds', value: 12000 },\n *   ]}\n * />\n * ```\n */\nexport const PortfolioAllocationTreemap = ({\n  data,\n  valueFormatter = formatCompactNumber,\n  showLabels = true,\n  className,\n  animate = true,\n  height,\n}: PortfolioAllocationTreemapProps) => {\n  const { chartData, config } = useMemo(() => {\n    const entries = data.map((holding, index) => ({\n      ...holding,\n      key: toKey(holding),\n      fill: holding.color || getChartColor(index),\n    }));\n    const chartConfig: ChartConfig = Object.fromEntries(entries.map(entry => [entry.key, { label: entry.name, color: entry.fill }]));\n    return { chartData: entries, config: chartConfig };\n  }, [data]);\n\n  const renderContent = (node: TreemapNode) => {\n    if (node.depth !== 1) return <g />;\n    const holding = chartData.find(entry => entry.key === node.name);\n    const fitsLabel = showLabels && node.width >= 36 && node.height >= 24;\n\n    return (\n      <g>\n        <rect x={node.x} y={node.y} width={node.width} height={node.height} fill={holding?.fill} stroke=\"var(--background)\" />\n        {fitsLabel && (\n          <text x={node.x + 6} y={node.y + 16} className=\"fill-white font-medium text-xs\">\n            {holding?.name}\n          </text>\n        )}\n        {fitsLabel && node.height > 40 && (\n          <text x={node.x + 6} y={node.y + 32} className=\"fill-white/80 font-number text-[11px]\">\n            {valueFormatter(node.value)}\n          </text>\n        )}\n      </g>\n    );\n  };\n\n  return (\n    <ChartContainer\n      data-slot=\"portfolio-allocation-treemap\"\n      config={config}\n      className={cn('w-full', className)}\n      style={height !== undefined ? { height, aspectRatio: 'auto' } : undefined}\n    >\n      <Treemap data={chartData} dataKey=\"value\" nameKey=\"key\" isAnimationActive={animate} content={renderContent}>\n        <ChartTooltip content={<ChartTooltipContent nameKey=\"key\" hideLabel formatter={value => valueFormatter(Number(value))} />} />\n      </Treemap>\n    </ChartContainer>\n  );\n};\n"],"mappings":"mMAoBA,MAAM,EAAS,GAAsC,EAAQ,KAAO,EAAQ,KAAK,YAAY,CAAC,CAAC,QAAQ,cAAe,GAAG,EAmB5G,GAA8B,CACzC,OACA,iBAAiBA,EAAAA,oBACjB,aAAa,GACb,YACA,UAAU,GACV,YACqC,CACrC,GAAM,CAAE,YAAW,WAAA,EAAA,EAAA,QAAA,KAAyB,CAC1C,IAAM,EAAU,EAAK,KAAK,EAAS,KAAW,CAC5C,GAAG,EACH,IAAK,EAAM,CAAO,EAClB,KAAM,EAAQ,OAASC,EAAAA,cAAc,CAAK,CAC5C,EAAE,EAEF,MAAO,CAAE,UAAW,EAAS,OADI,OAAO,YAAY,EAAQ,IAAI,GAAS,CAAC,EAAM,IAAK,CAAE,MAAO,EAAM,KAAM,MAAO,EAAM,IAAK,CAAC,CAAC,CAC/E,CAAE,CACnD,EAAG,CAAC,CAAI,CAAC,EAwBT,OACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CACE,YAAU,+BACF,SACR,WAAA,EAAA,EAAA,GAAA,CAAc,SAAU,CAAS,EACjC,MAAO,IAAW,IAAA,GAA8C,IAAA,GAAlC,CAAE,SAAQ,YAAa,MAAO,YAE5D,EAAA,EAAA,IAAA,CAACC,EAAAA,QAAD,CAAS,KAAM,EAAW,QAAQ,QAAQ,QAAQ,MAAM,kBAAmB,EAAS,QA7BjE,GAAsB,CAC3C,GAAI,EAAK,QAAU,EAAG,OAAO,EAAA,EAAA,IAAA,CAAC,IAAD,CAAI,CAAA,EACjC,IAAM,EAAU,EAAU,KAAK,GAAS,EAAM,MAAQ,EAAK,IAAI,EACzD,EAAY,GAAc,EAAK,OAAS,IAAM,EAAK,QAAU,GAEnE,OACE,EAAA,EAAA,KAAA,CAAC,IAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,EAAG,EAAK,EAAG,EAAG,EAAK,EAAG,MAAO,EAAK,MAAO,OAAQ,EAAK,OAAQ,KAAM,GAAS,KAAM,OAAO,mBAAqB,CAAA,EACpH,IACC,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,EAAG,EAAK,EAAI,EAAG,EAAG,EAAK,EAAI,GAAI,UAAU,0CAC5C,GAAS,IACN,CAAA,EAEP,GAAa,EAAK,OAAS,KAC1B,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,EAAG,EAAK,EAAI,EAAG,EAAG,EAAK,EAAI,GAAI,UAAU,iDAC5C,EAAe,EAAK,KAAK,CACtB,CAAA,CAEP,CAAA,CAAA,CAEP,YAUM,EAAA,EAAA,IAAA,CAACC,EAAAA,aAAD,CAAc,SAAS,EAAA,EAAA,IAAA,CAACC,EAAAA,oBAAD,CAAqB,QAAQ,MAAM,UAAA,GAAU,UAAW,GAAS,EAAe,OAAO,CAAK,CAAC,CAAI,CAAA,CAAI,CAAA,CACrH,CAAA,CACK,CAAA,CAEpB"}
+{"version":3,"file":"portfolio-allocation-treemap-Bn0X4wb6.cjs","names":["formatCompactNumber","getChartColor","ChartContainer","Treemap","ChartTooltip","ChartTooltipContent"],"sources":["../packages/components/features/charts/components/portfolio-allocation-treemap.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { type ChartConfig, ChartContainer, ChartTooltip, ChartTooltipContent } from '@/components/ui/chart';\n\nimport type { TreemapNode } from 'recharts';\nimport { Treemap } from 'recharts';\nimport type { BaseChartProps, PortfolioHolding } from '../types';\nimport { formatCompactNumber, getChartColor } from '../utils';\n\nexport type PortfolioAllocationTreemapProps = BaseChartProps & {\n  data: PortfolioHolding[];\n  valueFormatter?: (value: number) => string;\n  /** Shows the holding name and formatted value inside each rect when it fits. Defaults to `true`. */\n  showLabels?: boolean;\n};\n\nconst toKey = (holding: PortfolioHolding): string => holding.key || holding.name.toLowerCase().replace(/[^a-z0-9]+/g, '-');\n\n/**\n * A treemap for portfolio holdings / asset allocation, sized by weight — clearer than a donut\n * once there are more than a handful of positions.\n *\n * @example\n * ```tsx\n * import { PortfolioAllocationTreemap } from '@customafk/lunas-ui/features/charts';\n *\n * <PortfolioAllocationTreemap\n *   data={[\n *     { name: 'AAPL', value: 24000 },\n *     { name: 'MSFT', value: 18500 },\n *     { name: 'Bonds', value: 12000 },\n *   ]}\n * />\n * ```\n */\nexport const PortfolioAllocationTreemap = ({\n  data,\n  valueFormatter = formatCompactNumber,\n  showLabels = true,\n  className,\n  animate = true,\n  height,\n}: PortfolioAllocationTreemapProps) => {\n  const { chartData, config } = useMemo(() => {\n    const entries = data.map((holding, index) => ({\n      ...holding,\n      key: toKey(holding),\n      fill: holding.color || getChartColor(index),\n    }));\n    const chartConfig: ChartConfig = Object.fromEntries(entries.map(entry => [entry.key, { label: entry.name, color: entry.fill }]));\n    return { chartData: entries, config: chartConfig };\n  }, [data]);\n\n  const renderContent = (node: TreemapNode) => {\n    if (node.depth !== 1) return <g />;\n    const holding = chartData.find(entry => entry.key === node.name);\n    const fitsLabel = showLabels && node.width >= 36 && node.height >= 24;\n\n    return (\n      <g>\n        <rect x={node.x} y={node.y} width={node.width} height={node.height} fill={holding?.fill} stroke=\"var(--background)\" />\n        {fitsLabel && (\n          <text x={node.x + 6} y={node.y + 16} className=\"fill-white font-medium text-xs\">\n            {holding?.name}\n          </text>\n        )}\n        {fitsLabel && node.height > 40 && (\n          <text x={node.x + 6} y={node.y + 32} className=\"fill-white/80 font-number text-[11px]\">\n            {valueFormatter(node.value)}\n          </text>\n        )}\n      </g>\n    );\n  };\n\n  return (\n    <ChartContainer\n      data-slot=\"portfolio-allocation-treemap\"\n      config={config}\n      className={cn('w-full', className)}\n      style={height !== undefined ? { height, aspectRatio: 'auto' } : undefined}\n    >\n      <Treemap data={chartData} dataKey=\"value\" nameKey=\"key\" isAnimationActive={animate} content={renderContent}>\n        <ChartTooltip content={<ChartTooltipContent nameKey=\"key\" hideLabel formatter={value => valueFormatter(Number(value))} />} />\n      </Treemap>\n    </ChartContainer>\n  );\n};\n"],"mappings":"mMAoBA,MAAM,EAAS,GAAsC,EAAQ,KAAO,EAAQ,KAAK,YAAY,CAAC,CAAC,QAAQ,cAAe,GAAG,EAmB5G,GAA8B,CACzC,OACA,iBAAiBA,EAAAA,oBACjB,aAAa,GACb,YACA,UAAU,GACV,YACqC,CACrC,GAAM,CAAE,YAAW,WAAA,EAAA,EAAA,QAAA,KAAyB,CAC1C,IAAM,EAAU,EAAK,KAAK,EAAS,KAAW,CAC5C,GAAG,EACH,IAAK,EAAM,CAAO,EAClB,KAAM,EAAQ,OAASC,EAAAA,cAAc,CAAK,CAC5C,EAAE,EAEF,MAAO,CAAE,UAAW,EAAS,OADI,OAAO,YAAY,EAAQ,IAAI,GAAS,CAAC,EAAM,IAAK,CAAE,MAAO,EAAM,KAAM,MAAO,EAAM,IAAK,CAAC,CAAC,CAC/E,CAAE,CACnD,EAAG,CAAC,CAAI,CAAC,EAwBT,OACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CACE,YAAU,+BACF,SACR,WAAA,EAAA,EAAA,GAAA,CAAc,SAAU,CAAS,EACjC,MAAO,IAAW,IAAA,GAA8C,IAAA,GAAlC,CAAE,SAAQ,YAAa,MAAO,EAE5D,UAAA,EAAA,EAAA,IAAA,CAACC,EAAAA,QAAD,CAAS,KAAM,EAAW,QAAQ,QAAQ,QAAQ,MAAM,kBAAmB,EAAS,QA7BjE,GAAsB,CAC3C,GAAI,EAAK,QAAU,EAAG,OAAO,EAAA,EAAA,IAAA,CAAC,IAAD,CAAI,CAAA,EACjC,IAAM,EAAU,EAAU,KAAK,GAAS,EAAM,MAAQ,EAAK,IAAI,EACzD,EAAY,GAAc,EAAK,OAAS,IAAM,EAAK,QAAU,GAEnE,OACE,EAAA,EAAA,KAAA,CAAC,IAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,EAAG,EAAK,EAAG,EAAG,EAAK,EAAG,MAAO,EAAK,MAAO,OAAQ,EAAK,OAAQ,KAAM,GAAS,KAAM,OAAO,mBAAqB,CAAA,EACpH,IACC,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,EAAG,EAAK,EAAI,EAAG,EAAG,EAAK,EAAI,GAAI,UAAU,iCAC5C,SAAA,GAAS,IACN,CAAA,EAEP,GAAa,EAAK,OAAS,KAC1B,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,EAAG,EAAK,EAAI,EAAG,EAAG,EAAK,EAAI,GAAI,UAAU,wCAC5C,SAAA,EAAe,EAAK,KAAK,CACtB,CAAA,CAEP,CAAA,CAAA,CAEP,EAUM,UAAA,EAAA,EAAA,IAAA,CAACC,EAAAA,aAAD,CAAc,SAAS,EAAA,EAAA,IAAA,CAACC,EAAAA,oBAAD,CAAqB,QAAQ,MAAM,UAAA,GAAU,UAAW,GAAS,EAAe,OAAO,CAAK,CAAC,CAAI,CAAA,CAAI,CAAA,CACrH,CAAA,CACK,CAAA,CAEpB"}

package/dist/portfolio-allocation-treemap-Cb9Kidrl.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"portfolio-allocation-treemap-Cb9Kidrl.mjs","names":[],"sources":["../packages/components/features/charts/components/portfolio-allocation-treemap.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { type ChartConfig, ChartContainer, ChartTooltip, ChartTooltipContent } from '@/components/ui/chart';\n\nimport type { TreemapNode } from 'recharts';\nimport { Treemap } from 'recharts';\nimport type { BaseChartProps, PortfolioHolding } from '../types';\nimport { formatCompactNumber, getChartColor } from '../utils';\n\nexport type PortfolioAllocationTreemapProps = BaseChartProps & {\n  data: PortfolioHolding[];\n  valueFormatter?: (value: number) => string;\n  /** Shows the holding name and formatted value inside each rect when it fits. Defaults to `true`. */\n  showLabels?: boolean;\n};\n\nconst toKey = (holding: PortfolioHolding): string => holding.key || holding.name.toLowerCase().replace(/[^a-z0-9]+/g, '-');\n\n/**\n * A treemap for portfolio holdings / asset allocation, sized by weight — clearer than a donut\n * once there are more than a handful of positions.\n *\n * @example\n * ```tsx\n * import { PortfolioAllocationTreemap } from '@customafk/lunas-ui/features/charts';\n *\n * <PortfolioAllocationTreemap\n *   data={[\n *     { name: 'AAPL', value: 24000 },\n *     { name: 'MSFT', value: 18500 },\n *     { name: 'Bonds', value: 12000 },\n *   ]}\n * />\n * ```\n */\nexport const PortfolioAllocationTreemap = ({\n  data,\n  valueFormatter = formatCompactNumber,\n  showLabels = true,\n  className,\n  animate = true,\n  height,\n}: PortfolioAllocationTreemapProps) => {\n  const { chartData, config } = useMemo(() => {\n    const entries = data.map((holding, index) => ({\n      ...holding,\n      key: toKey(holding),\n      fill: holding.color || getChartColor(index),\n    }));\n    const chartConfig: ChartConfig = Object.fromEntries(entries.map(entry => [entry.key, { label: entry.name, color: entry.fill }]));\n    return { chartData: entries, config: chartConfig };\n  }, [data]);\n\n  const renderContent = (node: TreemapNode) => {\n    if (node.depth !== 1) return <g />;\n    const holding = chartData.find(entry => entry.key === node.name);\n    const fitsLabel = showLabels && node.width >= 36 && node.height >= 24;\n\n    return (\n      <g>\n        <rect x={node.x} y={node.y} width={node.width} height={node.height} fill={holding?.fill} stroke=\"var(--background)\" />\n        {fitsLabel && (\n          <text x={node.x + 6} y={node.y + 16} className=\"fill-white font-medium text-xs\">\n            {holding?.name}\n          </text>\n        )}\n        {fitsLabel && node.height > 40 && (\n          <text x={node.x + 6} y={node.y + 32} className=\"fill-white/80 font-number text-[11px]\">\n            {valueFormatter(node.value)}\n          </text>\n        )}\n      </g>\n    );\n  };\n\n  return (\n    <ChartContainer\n      data-slot=\"portfolio-allocation-treemap\"\n      config={config}\n      className={cn('w-full', className)}\n      style={height !== undefined ? { height, aspectRatio: 'auto' } : undefined}\n    >\n      <Treemap data={chartData} dataKey=\"value\" nameKey=\"key\" isAnimationActive={animate} content={renderContent}>\n        <ChartTooltip content={<ChartTooltipContent nameKey=\"key\" hideLabel formatter={value => valueFormatter(Number(value))} />} />\n      </Treemap>\n    </ChartContainer>\n  );\n};\n"],"mappings":"yVAoBA,MAAM,EAAS,GAAsC,EAAQ,KAAO,EAAQ,KAAK,YAAY,CAAC,CAAC,QAAQ,cAAe,GAAG,EAmB5G,GAA8B,CACzC,OACA,iBAAiB,EACjB,aAAa,GACb,YACA,UAAU,GACV,YACqC,CACrC,GAAM,CAAE,YAAW,UAAW,MAAc,CAC1C,IAAM,EAAU,EAAK,KAAK,EAAS,KAAW,CAC5C,GAAG,EACH,IAAK,EAAM,CAAO,EAClB,KAAM,EAAQ,OAAS,EAAc,CAAK,CAC5C,EAAE,EAEF,MAAO,CAAE,UAAW,EAAS,OADI,OAAO,YAAY,EAAQ,IAAI,GAAS,CAAC,EAAM,IAAK,CAAE,MAAO,EAAM,KAAM,MAAO,EAAM,IAAK,CAAC,CAAC,CAC/E,CAAE,CACnD,EAAG,CAAC,CAAI,CAAC,EAwBT,OACE,EAAC,EAAD,CACE,YAAU,+BACF,SACR,UAAW,EAAG,SAAU,CAAS,EACjC,MAAO,IAAW,IAAA,GAA8C,IAAA,GAAlC,CAAE,SAAQ,YAAa,MAAO,WAE5D,EAAC,EAAD,CAAS,KAAM,EAAW,QAAQ,QAAQ,QAAQ,MAAM,kBAAmB,EAAS,QA7BjE,GAAsB,CAC3C,GAAI,EAAK,QAAU,EAAG,OAAO,EAAC,IAAD,CAAI,CAAA,EACjC,IAAM,EAAU,EAAU,KAAK,GAAS,EAAM,MAAQ,EAAK,IAAI,EACzD,EAAY,GAAc,EAAK,OAAS,IAAM,EAAK,QAAU,GAEnE,OACE,EAAC,IAAD,CAAA,SAAA,CACE,EAAC,OAAD,CAAM,EAAG,EAAK,EAAG,EAAG,EAAK,EAAG,MAAO,EAAK,MAAO,OAAQ,EAAK,OAAQ,KAAM,GAAS,KAAM,OAAO,mBAAqB,CAAA,EACpH,GACC,EAAC,OAAD,CAAM,EAAG,EAAK,EAAI,EAAG,EAAG,EAAK,EAAI,GAAI,UAAU,0CAC5C,GAAS,IACN,CAAA,EAEP,GAAa,EAAK,OAAS,IAC1B,EAAC,OAAD,CAAM,EAAG,EAAK,EAAI,EAAG,EAAG,EAAK,EAAI,GAAI,UAAU,iDAC5C,EAAe,EAAK,KAAK,CACtB,CAAA,CAEP,CAAA,CAAA,CAEP,WAUM,EAAC,EAAD,CAAc,QAAS,EAAC,EAAD,CAAqB,QAAQ,MAAM,UAAA,GAAU,UAAW,GAAS,EAAe,OAAO,CAAK,CAAC,CAAI,CAAA,CAAI,CAAA,CACrH,CAAA,CACK,CAAA,CAEpB"}
+{"version":3,"file":"portfolio-allocation-treemap-Cb9Kidrl.mjs","names":[],"sources":["../packages/components/features/charts/components/portfolio-allocation-treemap.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { type ChartConfig, ChartContainer, ChartTooltip, ChartTooltipContent } from '@/components/ui/chart';\n\nimport type { TreemapNode } from 'recharts';\nimport { Treemap } from 'recharts';\nimport type { BaseChartProps, PortfolioHolding } from '../types';\nimport { formatCompactNumber, getChartColor } from '../utils';\n\nexport type PortfolioAllocationTreemapProps = BaseChartProps & {\n  data: PortfolioHolding[];\n  valueFormatter?: (value: number) => string;\n  /** Shows the holding name and formatted value inside each rect when it fits. Defaults to `true`. */\n  showLabels?: boolean;\n};\n\nconst toKey = (holding: PortfolioHolding): string => holding.key || holding.name.toLowerCase().replace(/[^a-z0-9]+/g, '-');\n\n/**\n * A treemap for portfolio holdings / asset allocation, sized by weight — clearer than a donut\n * once there are more than a handful of positions.\n *\n * @example\n * ```tsx\n * import { PortfolioAllocationTreemap } from '@customafk/lunas-ui/features/charts';\n *\n * <PortfolioAllocationTreemap\n *   data={[\n *     { name: 'AAPL', value: 24000 },\n *     { name: 'MSFT', value: 18500 },\n *     { name: 'Bonds', value: 12000 },\n *   ]}\n * />\n * ```\n */\nexport const PortfolioAllocationTreemap = ({\n  data,\n  valueFormatter = formatCompactNumber,\n  showLabels = true,\n  className,\n  animate = true,\n  height,\n}: PortfolioAllocationTreemapProps) => {\n  const { chartData, config } = useMemo(() => {\n    const entries = data.map((holding, index) => ({\n      ...holding,\n      key: toKey(holding),\n      fill: holding.color || getChartColor(index),\n    }));\n    const chartConfig: ChartConfig = Object.fromEntries(entries.map(entry => [entry.key, { label: entry.name, color: entry.fill }]));\n    return { chartData: entries, config: chartConfig };\n  }, [data]);\n\n  const renderContent = (node: TreemapNode) => {\n    if (node.depth !== 1) return <g />;\n    const holding = chartData.find(entry => entry.key === node.name);\n    const fitsLabel = showLabels && node.width >= 36 && node.height >= 24;\n\n    return (\n      <g>\n        <rect x={node.x} y={node.y} width={node.width} height={node.height} fill={holding?.fill} stroke=\"var(--background)\" />\n        {fitsLabel && (\n          <text x={node.x + 6} y={node.y + 16} className=\"fill-white font-medium text-xs\">\n            {holding?.name}\n          </text>\n        )}\n        {fitsLabel && node.height > 40 && (\n          <text x={node.x + 6} y={node.y + 32} className=\"fill-white/80 font-number text-[11px]\">\n            {valueFormatter(node.value)}\n          </text>\n        )}\n      </g>\n    );\n  };\n\n  return (\n    <ChartContainer\n      data-slot=\"portfolio-allocation-treemap\"\n      config={config}\n      className={cn('w-full', className)}\n      style={height !== undefined ? { height, aspectRatio: 'auto' } : undefined}\n    >\n      <Treemap data={chartData} dataKey=\"value\" nameKey=\"key\" isAnimationActive={animate} content={renderContent}>\n        <ChartTooltip content={<ChartTooltipContent nameKey=\"key\" hideLabel formatter={value => valueFormatter(Number(value))} />} />\n      </Treemap>\n    </ChartContainer>\n  );\n};\n"],"mappings":"yVAoBA,MAAM,EAAS,GAAsC,EAAQ,KAAO,EAAQ,KAAK,YAAY,CAAC,CAAC,QAAQ,cAAe,GAAG,EAmB5G,GAA8B,CACzC,OACA,iBAAiB,EACjB,aAAa,GACb,YACA,UAAU,GACV,YACqC,CACrC,GAAM,CAAE,YAAW,UAAW,MAAc,CAC1C,IAAM,EAAU,EAAK,KAAK,EAAS,KAAW,CAC5C,GAAG,EACH,IAAK,EAAM,CAAO,EAClB,KAAM,EAAQ,OAAS,EAAc,CAAK,CAC5C,EAAE,EAEF,MAAO,CAAE,UAAW,EAAS,OADI,OAAO,YAAY,EAAQ,IAAI,GAAS,CAAC,EAAM,IAAK,CAAE,MAAO,EAAM,KAAM,MAAO,EAAM,IAAK,CAAC,CAAC,CAC/E,CAAE,CACnD,EAAG,CAAC,CAAI,CAAC,EAwBT,OACE,EAAC,EAAD,CACE,YAAU,+BACF,SACR,UAAW,EAAG,SAAU,CAAS,EACjC,MAAO,IAAW,IAAA,GAA8C,IAAA,GAAlC,CAAE,SAAQ,YAAa,MAAO,EAE5D,SAAA,EAAC,EAAD,CAAS,KAAM,EAAW,QAAQ,QAAQ,QAAQ,MAAM,kBAAmB,EAAS,QA7BjE,GAAsB,CAC3C,GAAI,EAAK,QAAU,EAAG,OAAO,EAAC,IAAD,CAAI,CAAA,EACjC,IAAM,EAAU,EAAU,KAAK,GAAS,EAAM,MAAQ,EAAK,IAAI,EACzD,EAAY,GAAc,EAAK,OAAS,IAAM,EAAK,QAAU,GAEnE,OACE,EAAC,IAAD,CAAA,SAAA,CACE,EAAC,OAAD,CAAM,EAAG,EAAK,EAAG,EAAG,EAAK,EAAG,MAAO,EAAK,MAAO,OAAQ,EAAK,OAAQ,KAAM,GAAS,KAAM,OAAO,mBAAqB,CAAA,EACpH,GACC,EAAC,OAAD,CAAM,EAAG,EAAK,EAAI,EAAG,EAAG,EAAK,EAAI,GAAI,UAAU,iCAC5C,SAAA,GAAS,IACN,CAAA,EAEP,GAAa,EAAK,OAAS,IAC1B,EAAC,OAAD,CAAM,EAAG,EAAK,EAAI,EAAG,EAAG,EAAK,EAAI,GAAI,UAAU,wCAC5C,SAAA,EAAe,EAAK,KAAK,CACtB,CAAA,CAEP,CAAA,CAAA,CAEP,EAUM,SAAA,EAAC,EAAD,CAAc,QAAS,EAAC,EAAD,CAAqB,QAAQ,MAAM,UAAA,GAAU,UAAW,GAAS,EAAe,OAAO,CAAK,CAAC,CAAI,CAAA,CAAI,CAAA,CACrH,CAAA,CACK,CAAA,CAEpB"}

package/dist/price-range-area-chart-BW6RQb_9.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"price-range-area-chart-BW6RQb_9.cjs","names":["toDateLabel","ChartContainer","ComposedChart","CartesianGrid","XAxis","YAxis","ChartTooltip","ChartTooltipContent","Area","Line"],"sources":["../packages/components/features/charts/components/price-range-area-chart.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { type ChartConfig, ChartContainer, ChartTooltip, ChartTooltipContent } from '@/components/ui/chart';\n\nimport { Area, CartesianGrid, ComposedChart, Line, XAxis, YAxis } from 'recharts';\nimport type { BaseChartProps, OHLCPoint } from '../types';\nimport { toDateLabel } from '../utils';\n\nexport type PriceRangeAreaChartProps = BaseChartProps & {\n  /** Only `date`, `high`, `low`, and `close` are used; pass the same rows given to `CandlestickChart`. */\n  data: Array<Pick<OHLCPoint, 'date' | 'high' | 'low' | 'close'>>;\n  /** Close-price series label. Defaults to `'Close'`. */\n  label?: string;\n  /** High-low band label. Defaults to `'Range'`. */\n  rangeLabel?: string;\n  color?: string;\n  valueFormatter?: (value: number) => string;\n  dateFormatter?: (date: string | Date) => string;\n  showGrid?: boolean;\n};\n\n/**\n * A shaded high-low trading-range band with the close price drawn on top — the daily range is\n * visible at a glance alongside the closing trend.\n *\n * @example\n * ```tsx\n * import { PriceRangeAreaChart } from '@customafk/lunas-ui/features/charts';\n *\n * <PriceRangeAreaChart\n *   data={[{ date: '2026-06-01', high: 146.2, low: 141.8, close: 144.9 }]}\n * />\n * ```\n */\nexport const PriceRangeAreaChart = ({\n  data,\n  label = 'Close',\n  rangeLabel = 'Range',\n  color = 'var(--chart-1)',\n  valueFormatter = value => value.toLocaleString('en-US'),\n  dateFormatter = toDateLabel,\n  showGrid = true,\n  className,\n  animate = true,\n  height,\n}: PriceRangeAreaChartProps) => {\n  const config = useMemo<ChartConfig>(() => ({ close: { label, color }, rangeSpan: { label: rangeLabel, color } }), [label, color, rangeLabel]);\n\n  const chartData = useMemo(() => data.map(point => ({ ...point, rangeSpan: point.high - point.low })), [data]);\n\n  return (\n    <ChartContainer\n      data-slot=\"price-range-area-chart\"\n      config={config}\n      className={cn('w-full', className)}\n      style={height !== undefined ? { height, aspectRatio: 'auto' } : undefined}\n    >\n      <ComposedChart data={chartData} margin={{ top: 8, right: 12, bottom: 0, left: 12 }}>\n        {showGrid && <CartesianGrid vertical={false} />}\n        <XAxis dataKey=\"date\" tickLine={false} axisLine={false} tickMargin={8} tickFormatter={dateFormatter} />\n        <YAxis domain={['auto', 'auto']} tickLine={false} axisLine={false} tickMargin={8} width={64} tickFormatter={valueFormatter} />\n        <ChartTooltip\n          cursor={false}\n          content={\n            <ChartTooltipContent\n              labelFormatter={(_, payload) => {\n                const date = payload?.[0]?.payload?.date;\n                return date ? dateFormatter(date) : null;\n              }}\n              formatter={(value, name, item) => {\n                if (name !== 'close') return null;\n                const point = item.payload as { high: number; low: number };\n                return (\n                  <div className=\"grid gap-0.5\">\n                    <span className=\"text-muted\">\n                      {config.close?.label} <span className=\"font-medium font-number text-text-positive-strong\">{valueFormatter(Number(value))}</span>\n                    </span>\n                    <span className=\"text-[11px] text-muted\">\n                      {valueFormatter(point.low)} – {valueFormatter(point.high)}\n                    </span>\n                  </div>\n                );\n              }}\n            />\n          }\n        />\n        <Area dataKey=\"low\" stackId=\"range\" stroke=\"none\" fill=\"transparent\" isAnimationActive={animate} />\n        <Area dataKey=\"rangeSpan\" stackId=\"range\" stroke=\"none\" fill={color} fillOpacity={0.15} isAnimationActive={animate} />\n        <Line type=\"natural\" dataKey=\"close\" stroke={color} strokeWidth={2} dot={false} isAnimationActive={animate} />\n      </ComposedChart>\n    </ChartContainer>\n  );\n};\n"],"mappings":"mMAsCA,MAAa,GAAuB,CAClC,OACA,QAAQ,QACR,aAAa,QACb,QAAQ,iBACR,iBAAiB,GAAS,EAAM,eAAe,OAAO,EACtD,gBAAgBA,EAAAA,YAChB,WAAW,GACX,YACA,UAAU,GACV,YAC8B,CAC9B,IAAM,GAAA,EAAA,EAAA,QAAA,MAAqC,CAAE,MAAO,CAAE,QAAO,OAAM,EAAG,UAAW,CAAE,MAAO,EAAY,OAAM,CAAE,GAAI,CAAC,EAAO,EAAO,CAAU,CAAC,EAEtI,GAAA,EAAA,EAAA,QAAA,KAA0B,EAAK,IAAI,IAAU,CAAE,GAAG,EAAO,UAAW,EAAM,KAAO,EAAM,GAAI,EAAE,EAAG,CAAC,CAAI,CAAC,EAE5G,OACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CACE,YAAU,yBACF,SACR,WAAA,EAAA,EAAA,GAAA,CAAc,SAAU,CAAS,EACjC,MAAO,IAAW,IAAA,GAA8C,IAAA,GAAlC,CAAE,SAAQ,YAAa,MAAO,YAE5D,EAAA,EAAA,KAAA,CAACC,EAAAA,cAAD,CAAe,KAAM,EAAW,OAAQ,CAAE,IAAK,EAAG,MAAO,GAAI,OAAQ,EAAG,KAAM,EAAG,WAAjF,CACG,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,cAAD,CAAe,SAAU,EAAQ,CAAA,GAC9C,EAAA,EAAA,IAAA,CAACC,EAAAA,MAAD,CAAO,QAAQ,OAAO,SAAU,GAAO,SAAU,GAAO,WAAY,EAAG,cAAe,CAAgB,CAAA,GACtG,EAAA,EAAA,IAAA,CAACC,EAAAA,MAAD,CAAO,OAAQ,CAAC,OAAQ,MAAM,EAAG,SAAU,GAAO,SAAU,GAAO,WAAY,EAAG,MAAO,GAAI,cAAe,CAAiB,CAAA,GAC7H,EAAA,EAAA,IAAA,CAACC,EAAAA,aAAD,CACE,OAAQ,GACR,SACE,EAAA,EAAA,IAAA,CAACC,EAAAA,oBAAD,CACE,gBAAiB,EAAG,IAAY,CAC9B,IAAM,EAAO,IAAU,EAAE,EAAE,SAAS,KACpC,OAAO,EAAO,EAAc,CAAI,EAAI,IACtC,EACA,WAAY,EAAO,EAAM,IAAS,CAChC,GAAI,IAAS,QAAS,OAAO,KAC7B,IAAM,EAAQ,EAAK,QACnB,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,wBAAf,EACE,EAAA,EAAA,KAAA,CAAC,OAAD,CAAM,UAAU,sBAAhB,CACG,EAAO,OAAO,MAAM,KAAC,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,6DAAqD,EAAe,OAAO,CAAK,CAAC,CAAQ,CAAA,CAC3H,KACN,EAAA,EAAA,KAAA,CAAC,OAAD,CAAM,UAAU,kCAAhB,CACG,EAAe,EAAM,GAAG,EAAE,MAAI,EAAe,EAAM,IAAI,CACpD,GACH,GAET,CACD,CAAA,CAEJ,CAAA,GACD,EAAA,EAAA,IAAA,CAACC,EAAAA,KAAD,CAAM,QAAQ,MAAM,QAAQ,QAAQ,OAAO,OAAO,KAAK,cAAc,kBAAmB,CAAU,CAAA,GAClG,EAAA,EAAA,IAAA,CAACA,EAAAA,KAAD,CAAM,QAAQ,YAAY,QAAQ,QAAQ,OAAO,OAAO,KAAM,EAAO,YAAa,IAAM,kBAAmB,CAAU,CAAA,GACrH,EAAA,EAAA,IAAA,CAACC,EAAAA,KAAD,CAAM,KAAK,UAAU,QAAQ,QAAQ,OAAQ,EAAO,YAAa,EAAG,IAAK,GAAO,kBAAmB,CAAU,CAAA,CAChG,GACD,CAAA,CAEpB"}
+{"version":3,"file":"price-range-area-chart-BW6RQb_9.cjs","names":["toDateLabel","ChartContainer","ComposedChart","CartesianGrid","XAxis","YAxis","ChartTooltip","ChartTooltipContent","Area","Line"],"sources":["../packages/components/features/charts/components/price-range-area-chart.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { type ChartConfig, ChartContainer, ChartTooltip, ChartTooltipContent } from '@/components/ui/chart';\n\nimport { Area, CartesianGrid, ComposedChart, Line, XAxis, YAxis } from 'recharts';\nimport type { BaseChartProps, OHLCPoint } from '../types';\nimport { toDateLabel } from '../utils';\n\nexport type PriceRangeAreaChartProps = BaseChartProps & {\n  /** Only `date`, `high`, `low`, and `close` are used; pass the same rows given to `CandlestickChart`. */\n  data: Array<Pick<OHLCPoint, 'date' | 'high' | 'low' | 'close'>>;\n  /** Close-price series label. Defaults to `'Close'`. */\n  label?: string;\n  /** High-low band label. Defaults to `'Range'`. */\n  rangeLabel?: string;\n  color?: string;\n  valueFormatter?: (value: number) => string;\n  dateFormatter?: (date: string | Date) => string;\n  showGrid?: boolean;\n};\n\n/**\n * A shaded high-low trading-range band with the close price drawn on top — the daily range is\n * visible at a glance alongside the closing trend.\n *\n * @example\n * ```tsx\n * import { PriceRangeAreaChart } from '@customafk/lunas-ui/features/charts';\n *\n * <PriceRangeAreaChart\n *   data={[{ date: '2026-06-01', high: 146.2, low: 141.8, close: 144.9 }]}\n * />\n * ```\n */\nexport const PriceRangeAreaChart = ({\n  data,\n  label = 'Close',\n  rangeLabel = 'Range',\n  color = 'var(--chart-1)',\n  valueFormatter = value => value.toLocaleString('en-US'),\n  dateFormatter = toDateLabel,\n  showGrid = true,\n  className,\n  animate = true,\n  height,\n}: PriceRangeAreaChartProps) => {\n  const config = useMemo<ChartConfig>(() => ({ close: { label, color }, rangeSpan: { label: rangeLabel, color } }), [label, color, rangeLabel]);\n\n  const chartData = useMemo(() => data.map(point => ({ ...point, rangeSpan: point.high - point.low })), [data]);\n\n  return (\n    <ChartContainer\n      data-slot=\"price-range-area-chart\"\n      config={config}\n      className={cn('w-full', className)}\n      style={height !== undefined ? { height, aspectRatio: 'auto' } : undefined}\n    >\n      <ComposedChart data={chartData} margin={{ top: 8, right: 12, bottom: 0, left: 12 }}>\n        {showGrid && <CartesianGrid vertical={false} />}\n        <XAxis dataKey=\"date\" tickLine={false} axisLine={false} tickMargin={8} tickFormatter={dateFormatter} />\n        <YAxis domain={['auto', 'auto']} tickLine={false} axisLine={false} tickMargin={8} width={64} tickFormatter={valueFormatter} />\n        <ChartTooltip\n          cursor={false}\n          content={\n            <ChartTooltipContent\n              labelFormatter={(_, payload) => {\n                const date = payload?.[0]?.payload?.date;\n                return date ? dateFormatter(date) : null;\n              }}\n              formatter={(value, name, item) => {\n                if (name !== 'close') return null;\n                const point = item.payload as { high: number; low: number };\n                return (\n                  <div className=\"grid gap-0.5\">\n                    <span className=\"text-muted\">\n                      {config.close?.label} <span className=\"font-medium font-number text-text-positive-strong\">{valueFormatter(Number(value))}</span>\n                    </span>\n                    <span className=\"text-[11px] text-muted\">\n                      {valueFormatter(point.low)} – {valueFormatter(point.high)}\n                    </span>\n                  </div>\n                );\n              }}\n            />\n          }\n        />\n        <Area dataKey=\"low\" stackId=\"range\" stroke=\"none\" fill=\"transparent\" isAnimationActive={animate} />\n        <Area dataKey=\"rangeSpan\" stackId=\"range\" stroke=\"none\" fill={color} fillOpacity={0.15} isAnimationActive={animate} />\n        <Line type=\"natural\" dataKey=\"close\" stroke={color} strokeWidth={2} dot={false} isAnimationActive={animate} />\n      </ComposedChart>\n    </ChartContainer>\n  );\n};\n"],"mappings":"mMAsCA,MAAa,GAAuB,CAClC,OACA,QAAQ,QACR,aAAa,QACb,QAAQ,iBACR,iBAAiB,GAAS,EAAM,eAAe,OAAO,EACtD,gBAAgBA,EAAAA,YAChB,WAAW,GACX,YACA,UAAU,GACV,YAC8B,CAC9B,IAAM,GAAA,EAAA,EAAA,QAAA,MAAqC,CAAE,MAAO,CAAE,QAAO,OAAM,EAAG,UAAW,CAAE,MAAO,EAAY,OAAM,CAAE,GAAI,CAAC,EAAO,EAAO,CAAU,CAAC,EAEtI,GAAA,EAAA,EAAA,QAAA,KAA0B,EAAK,IAAI,IAAU,CAAE,GAAG,EAAO,UAAW,EAAM,KAAO,EAAM,GAAI,EAAE,EAAG,CAAC,CAAI,CAAC,EAE5G,OACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CACE,YAAU,yBACF,SACR,WAAA,EAAA,EAAA,GAAA,CAAc,SAAU,CAAS,EACjC,MAAO,IAAW,IAAA,GAA8C,IAAA,GAAlC,CAAE,SAAQ,YAAa,MAAO,EAE5D,UAAA,EAAA,EAAA,KAAA,CAACC,EAAAA,cAAD,CAAe,KAAM,EAAW,OAAQ,CAAE,IAAK,EAAG,MAAO,GAAI,OAAQ,EAAG,KAAM,EAAG,EAAjF,SAAA,CACG,IAAY,EAAA,EAAA,IAAA,CAACC,EAAAA,cAAD,CAAe,SAAU,EAAQ,CAAA,GAC9C,EAAA,EAAA,IAAA,CAACC,EAAAA,MAAD,CAAO,QAAQ,OAAO,SAAU,GAAO,SAAU,GAAO,WAAY,EAAG,cAAe,CAAgB,CAAA,GACtG,EAAA,EAAA,IAAA,CAACC,EAAAA,MAAD,CAAO,OAAQ,CAAC,OAAQ,MAAM,EAAG,SAAU,GAAO,SAAU,GAAO,WAAY,EAAG,MAAO,GAAI,cAAe,CAAiB,CAAA,GAC7H,EAAA,EAAA,IAAA,CAACC,EAAAA,aAAD,CACE,OAAQ,GACR,SACE,EAAA,EAAA,IAAA,CAACC,EAAAA,oBAAD,CACE,gBAAiB,EAAG,IAAY,CAC9B,IAAM,EAAO,IAAU,EAAE,EAAE,SAAS,KACpC,OAAO,EAAO,EAAc,CAAI,EAAI,IACtC,EACA,WAAY,EAAO,EAAM,IAAS,CAChC,GAAI,IAAS,QAAS,OAAO,KAC7B,IAAM,EAAQ,EAAK,QACnB,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,eAAf,SAAA,EACE,EAAA,EAAA,KAAA,CAAC,OAAD,CAAM,UAAU,aAAhB,SAAA,CACG,EAAO,OAAO,MAAM,KAAC,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAU,oDAAqD,SAAA,EAAe,OAAO,CAAK,CAAC,CAAQ,CAAA,CAC3H,CACN,CAAA,GAAA,EAAA,EAAA,KAAA,CAAC,OAAD,CAAM,UAAU,yBAAhB,SAAA,CACG,EAAe,EAAM,GAAG,EAAE,MAAI,EAAe,EAAM,IAAI,CACpD,CACH,CAAA,CAAA,GAET,CACD,CAAA,CAEJ,CAAA,GACD,EAAA,EAAA,IAAA,CAACC,EAAAA,KAAD,CAAM,QAAQ,MAAM,QAAQ,QAAQ,OAAO,OAAO,KAAK,cAAc,kBAAmB,CAAU,CAAA,GAClG,EAAA,EAAA,IAAA,CAACA,EAAAA,KAAD,CAAM,QAAQ,YAAY,QAAQ,QAAQ,OAAO,OAAO,KAAM,EAAO,YAAa,IAAM,kBAAmB,CAAU,CAAA,GACrH,EAAA,EAAA,IAAA,CAACC,EAAAA,KAAD,CAAM,KAAK,UAAU,QAAQ,QAAQ,OAAQ,EAAO,YAAa,EAAG,IAAK,GAAO,kBAAmB,CAAU,CAAA,CAChG,GACD,CAAA,CAEpB"}

package/dist/price-range-area-chart-Dy01mhWJ.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"price-range-area-chart-Dy01mhWJ.mjs","names":[],"sources":["../packages/components/features/charts/components/price-range-area-chart.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { type ChartConfig, ChartContainer, ChartTooltip, ChartTooltipContent } from '@/components/ui/chart';\n\nimport { Area, CartesianGrid, ComposedChart, Line, XAxis, YAxis } from 'recharts';\nimport type { BaseChartProps, OHLCPoint } from '../types';\nimport { toDateLabel } from '../utils';\n\nexport type PriceRangeAreaChartProps = BaseChartProps & {\n  /** Only `date`, `high`, `low`, and `close` are used; pass the same rows given to `CandlestickChart`. */\n  data: Array<Pick<OHLCPoint, 'date' | 'high' | 'low' | 'close'>>;\n  /** Close-price series label. Defaults to `'Close'`. */\n  label?: string;\n  /** High-low band label. Defaults to `'Range'`. */\n  rangeLabel?: string;\n  color?: string;\n  valueFormatter?: (value: number) => string;\n  dateFormatter?: (date: string | Date) => string;\n  showGrid?: boolean;\n};\n\n/**\n * A shaded high-low trading-range band with the close price drawn on top — the daily range is\n * visible at a glance alongside the closing trend.\n *\n * @example\n * ```tsx\n * import { PriceRangeAreaChart } from '@customafk/lunas-ui/features/charts';\n *\n * <PriceRangeAreaChart\n *   data={[{ date: '2026-06-01', high: 146.2, low: 141.8, close: 144.9 }]}\n * />\n * ```\n */\nexport const PriceRangeAreaChart = ({\n  data,\n  label = 'Close',\n  rangeLabel = 'Range',\n  color = 'var(--chart-1)',\n  valueFormatter = value => value.toLocaleString('en-US'),\n  dateFormatter = toDateLabel,\n  showGrid = true,\n  className,\n  animate = true,\n  height,\n}: PriceRangeAreaChartProps) => {\n  const config = useMemo<ChartConfig>(() => ({ close: { label, color }, rangeSpan: { label: rangeLabel, color } }), [label, color, rangeLabel]);\n\n  const chartData = useMemo(() => data.map(point => ({ ...point, rangeSpan: point.high - point.low })), [data]);\n\n  return (\n    <ChartContainer\n      data-slot=\"price-range-area-chart\"\n      config={config}\n      className={cn('w-full', className)}\n      style={height !== undefined ? { height, aspectRatio: 'auto' } : undefined}\n    >\n      <ComposedChart data={chartData} margin={{ top: 8, right: 12, bottom: 0, left: 12 }}>\n        {showGrid && <CartesianGrid vertical={false} />}\n        <XAxis dataKey=\"date\" tickLine={false} axisLine={false} tickMargin={8} tickFormatter={dateFormatter} />\n        <YAxis domain={['auto', 'auto']} tickLine={false} axisLine={false} tickMargin={8} width={64} tickFormatter={valueFormatter} />\n        <ChartTooltip\n          cursor={false}\n          content={\n            <ChartTooltipContent\n              labelFormatter={(_, payload) => {\n                const date = payload?.[0]?.payload?.date;\n                return date ? dateFormatter(date) : null;\n              }}\n              formatter={(value, name, item) => {\n                if (name !== 'close') return null;\n                const point = item.payload as { high: number; low: number };\n                return (\n                  <div className=\"grid gap-0.5\">\n                    <span className=\"text-muted\">\n                      {config.close?.label} <span className=\"font-medium font-number text-text-positive-strong\">{valueFormatter(Number(value))}</span>\n                    </span>\n                    <span className=\"text-[11px] text-muted\">\n                      {valueFormatter(point.low)} – {valueFormatter(point.high)}\n                    </span>\n                  </div>\n                );\n              }}\n            />\n          }\n        />\n        <Area dataKey=\"low\" stackId=\"range\" stroke=\"none\" fill=\"transparent\" isAnimationActive={animate} />\n        <Area dataKey=\"rangeSpan\" stackId=\"range\" stroke=\"none\" fill={color} fillOpacity={0.15} isAnimationActive={animate} />\n        <Line type=\"natural\" dataKey=\"close\" stroke={color} strokeWidth={2} dot={false} isAnimationActive={animate} />\n      </ComposedChart>\n    </ChartContainer>\n  );\n};\n"],"mappings":"iYAsCA,MAAa,GAAuB,CAClC,OACA,QAAQ,QACR,aAAa,QACb,QAAQ,iBACR,iBAAiB,GAAS,EAAM,eAAe,OAAO,EACtD,gBAAgB,EAChB,WAAW,GACX,YACA,UAAU,GACV,YAC8B,CAC9B,IAAM,EAAS,OAA4B,CAAE,MAAO,CAAE,QAAO,OAAM,EAAG,UAAW,CAAE,MAAO,EAAY,OAAM,CAAE,GAAI,CAAC,EAAO,EAAO,CAAU,CAAC,EAEtI,EAAY,MAAc,EAAK,IAAI,IAAU,CAAE,GAAG,EAAO,UAAW,EAAM,KAAO,EAAM,GAAI,EAAE,EAAG,CAAC,CAAI,CAAC,EAE5G,OACE,EAAC,EAAD,CACE,YAAU,yBACF,SACR,UAAW,EAAG,SAAU,CAAS,EACjC,MAAO,IAAW,IAAA,GAA8C,IAAA,GAAlC,CAAE,SAAQ,YAAa,MAAO,WAE5D,EAAC,EAAD,CAAe,KAAM,EAAW,OAAQ,CAAE,IAAK,EAAG,MAAO,GAAI,OAAQ,EAAG,KAAM,EAAG,WAAjF,CACG,GAAY,EAAC,EAAD,CAAe,SAAU,EAAQ,CAAA,EAC9C,EAAC,EAAD,CAAO,QAAQ,OAAO,SAAU,GAAO,SAAU,GAAO,WAAY,EAAG,cAAe,CAAgB,CAAA,EACtG,EAAC,EAAD,CAAO,OAAQ,CAAC,OAAQ,MAAM,EAAG,SAAU,GAAO,SAAU,GAAO,WAAY,EAAG,MAAO,GAAI,cAAe,CAAiB,CAAA,EAC7H,EAAC,EAAD,CACE,OAAQ,GACR,QACE,EAAC,EAAD,CACE,gBAAiB,EAAG,IAAY,CAC9B,IAAM,EAAO,IAAU,EAAE,EAAE,SAAS,KACpC,OAAO,EAAO,EAAc,CAAI,EAAI,IACtC,EACA,WAAY,EAAO,EAAM,IAAS,CAChC,GAAI,IAAS,QAAS,OAAO,KAC7B,IAAM,EAAQ,EAAK,QACnB,OACE,EAAC,MAAD,CAAK,UAAU,wBAAf,CACE,EAAC,OAAD,CAAM,UAAU,sBAAhB,CACG,EAAO,OAAO,MAAM,IAAC,EAAC,OAAD,CAAM,UAAU,6DAAqD,EAAe,OAAO,CAAK,CAAC,CAAQ,CAAA,CAC3H,IACN,EAAC,OAAD,CAAM,UAAU,kCAAhB,CACG,EAAe,EAAM,GAAG,EAAE,MAAI,EAAe,EAAM,IAAI,CACpD,GACH,GAET,CACD,CAAA,CAEJ,CAAA,EACD,EAAC,EAAD,CAAM,QAAQ,MAAM,QAAQ,QAAQ,OAAO,OAAO,KAAK,cAAc,kBAAmB,CAAU,CAAA,EAClG,EAAC,EAAD,CAAM,QAAQ,YAAY,QAAQ,QAAQ,OAAO,OAAO,KAAM,EAAO,YAAa,IAAM,kBAAmB,CAAU,CAAA,EACrH,EAAC,EAAD,CAAM,KAAK,UAAU,QAAQ,QAAQ,OAAQ,EAAO,YAAa,EAAG,IAAK,GAAO,kBAAmB,CAAU,CAAA,CAChG,GACD,CAAA,CAEpB"}
+{"version":3,"file":"price-range-area-chart-Dy01mhWJ.mjs","names":[],"sources":["../packages/components/features/charts/components/price-range-area-chart.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { type ChartConfig, ChartContainer, ChartTooltip, ChartTooltipContent } from '@/components/ui/chart';\n\nimport { Area, CartesianGrid, ComposedChart, Line, XAxis, YAxis } from 'recharts';\nimport type { BaseChartProps, OHLCPoint } from '../types';\nimport { toDateLabel } from '../utils';\n\nexport type PriceRangeAreaChartProps = BaseChartProps & {\n  /** Only `date`, `high`, `low`, and `close` are used; pass the same rows given to `CandlestickChart`. */\n  data: Array<Pick<OHLCPoint, 'date' | 'high' | 'low' | 'close'>>;\n  /** Close-price series label. Defaults to `'Close'`. */\n  label?: string;\n  /** High-low band label. Defaults to `'Range'`. */\n  rangeLabel?: string;\n  color?: string;\n  valueFormatter?: (value: number) => string;\n  dateFormatter?: (date: string | Date) => string;\n  showGrid?: boolean;\n};\n\n/**\n * A shaded high-low trading-range band with the close price drawn on top — the daily range is\n * visible at a glance alongside the closing trend.\n *\n * @example\n * ```tsx\n * import { PriceRangeAreaChart } from '@customafk/lunas-ui/features/charts';\n *\n * <PriceRangeAreaChart\n *   data={[{ date: '2026-06-01', high: 146.2, low: 141.8, close: 144.9 }]}\n * />\n * ```\n */\nexport const PriceRangeAreaChart = ({\n  data,\n  label = 'Close',\n  rangeLabel = 'Range',\n  color = 'var(--chart-1)',\n  valueFormatter = value => value.toLocaleString('en-US'),\n  dateFormatter = toDateLabel,\n  showGrid = true,\n  className,\n  animate = true,\n  height,\n}: PriceRangeAreaChartProps) => {\n  const config = useMemo<ChartConfig>(() => ({ close: { label, color }, rangeSpan: { label: rangeLabel, color } }), [label, color, rangeLabel]);\n\n  const chartData = useMemo(() => data.map(point => ({ ...point, rangeSpan: point.high - point.low })), [data]);\n\n  return (\n    <ChartContainer\n      data-slot=\"price-range-area-chart\"\n      config={config}\n      className={cn('w-full', className)}\n      style={height !== undefined ? { height, aspectRatio: 'auto' } : undefined}\n    >\n      <ComposedChart data={chartData} margin={{ top: 8, right: 12, bottom: 0, left: 12 }}>\n        {showGrid && <CartesianGrid vertical={false} />}\n        <XAxis dataKey=\"date\" tickLine={false} axisLine={false} tickMargin={8} tickFormatter={dateFormatter} />\n        <YAxis domain={['auto', 'auto']} tickLine={false} axisLine={false} tickMargin={8} width={64} tickFormatter={valueFormatter} />\n        <ChartTooltip\n          cursor={false}\n          content={\n            <ChartTooltipContent\n              labelFormatter={(_, payload) => {\n                const date = payload?.[0]?.payload?.date;\n                return date ? dateFormatter(date) : null;\n              }}\n              formatter={(value, name, item) => {\n                if (name !== 'close') return null;\n                const point = item.payload as { high: number; low: number };\n                return (\n                  <div className=\"grid gap-0.5\">\n                    <span className=\"text-muted\">\n                      {config.close?.label} <span className=\"font-medium font-number text-text-positive-strong\">{valueFormatter(Number(value))}</span>\n                    </span>\n                    <span className=\"text-[11px] text-muted\">\n                      {valueFormatter(point.low)} – {valueFormatter(point.high)}\n                    </span>\n                  </div>\n                );\n              }}\n            />\n          }\n        />\n        <Area dataKey=\"low\" stackId=\"range\" stroke=\"none\" fill=\"transparent\" isAnimationActive={animate} />\n        <Area dataKey=\"rangeSpan\" stackId=\"range\" stroke=\"none\" fill={color} fillOpacity={0.15} isAnimationActive={animate} />\n        <Line type=\"natural\" dataKey=\"close\" stroke={color} strokeWidth={2} dot={false} isAnimationActive={animate} />\n      </ComposedChart>\n    </ChartContainer>\n  );\n};\n"],"mappings":"iYAsCA,MAAa,GAAuB,CAClC,OACA,QAAQ,QACR,aAAa,QACb,QAAQ,iBACR,iBAAiB,GAAS,EAAM,eAAe,OAAO,EACtD,gBAAgB,EAChB,WAAW,GACX,YACA,UAAU,GACV,YAC8B,CAC9B,IAAM,EAAS,OAA4B,CAAE,MAAO,CAAE,QAAO,OAAM,EAAG,UAAW,CAAE,MAAO,EAAY,OAAM,CAAE,GAAI,CAAC,EAAO,EAAO,CAAU,CAAC,EAEtI,EAAY,MAAc,EAAK,IAAI,IAAU,CAAE,GAAG,EAAO,UAAW,EAAM,KAAO,EAAM,GAAI,EAAE,EAAG,CAAC,CAAI,CAAC,EAE5G,OACE,EAAC,EAAD,CACE,YAAU,yBACF,SACR,UAAW,EAAG,SAAU,CAAS,EACjC,MAAO,IAAW,IAAA,GAA8C,IAAA,GAAlC,CAAE,SAAQ,YAAa,MAAO,EAE5D,SAAA,EAAC,EAAD,CAAe,KAAM,EAAW,OAAQ,CAAE,IAAK,EAAG,MAAO,GAAI,OAAQ,EAAG,KAAM,EAAG,EAAjF,SAAA,CACG,GAAY,EAAC,EAAD,CAAe,SAAU,EAAQ,CAAA,EAC9C,EAAC,EAAD,CAAO,QAAQ,OAAO,SAAU,GAAO,SAAU,GAAO,WAAY,EAAG,cAAe,CAAgB,CAAA,EACtG,EAAC,EAAD,CAAO,OAAQ,CAAC,OAAQ,MAAM,EAAG,SAAU,GAAO,SAAU,GAAO,WAAY,EAAG,MAAO,GAAI,cAAe,CAAiB,CAAA,EAC7H,EAAC,EAAD,CACE,OAAQ,GACR,QACE,EAAC,EAAD,CACE,gBAAiB,EAAG,IAAY,CAC9B,IAAM,EAAO,IAAU,EAAE,EAAE,SAAS,KACpC,OAAO,EAAO,EAAc,CAAI,EAAI,IACtC,EACA,WAAY,EAAO,EAAM,IAAS,CAChC,GAAI,IAAS,QAAS,OAAO,KAC7B,IAAM,EAAQ,EAAK,QACnB,OACE,EAAC,MAAD,CAAK,UAAU,eAAf,SAAA,CACE,EAAC,OAAD,CAAM,UAAU,aAAhB,SAAA,CACG,EAAO,OAAO,MAAM,IAAC,EAAC,OAAD,CAAM,UAAU,oDAAqD,SAAA,EAAe,OAAO,CAAK,CAAC,CAAQ,CAAA,CAC3H,CACN,CAAA,EAAA,EAAC,OAAD,CAAM,UAAU,yBAAhB,SAAA,CACG,EAAe,EAAM,GAAG,EAAE,MAAI,EAAe,EAAM,IAAI,CACpD,CACH,CAAA,CAAA,GAET,CACD,CAAA,CAEJ,CAAA,EACD,EAAC,EAAD,CAAM,QAAQ,MAAM,QAAQ,QAAQ,OAAO,OAAO,KAAK,cAAc,kBAAmB,CAAU,CAAA,EAClG,EAAC,EAAD,CAAM,QAAQ,YAAY,QAAQ,QAAQ,OAAO,OAAO,KAAM,EAAO,YAAa,IAAM,kBAAmB,CAAU,CAAA,EACrH,EAAC,EAAD,CAAM,KAAK,UAAU,QAAQ,QAAQ,OAAQ,EAAO,YAAa,EAAG,IAAK,GAAO,kBAAmB,CAAU,CAAA,CAChG,GACD,CAAA,CAEpB"}

package/dist/{product-card-CvXLXbpV.d.cts → product-card-CYNh0CT5.d.cts}

@@ -1,11 +1,18 @@
 //#region packages/components/cards/product-card.d.ts
 type Props = {
-  /** Unique identifier for the product. */id: string; /** URL-friendly slug for the product. */
-  slug: string; /** Display name of the product shown on the card. */
-  name: string; /** URL of the product's thumbnail image. */
-  thumbnail: string; /** Regular price of the product in VND. */
-  price: number; /** Optional sale / discounted price in VND. */
-  salePrice?: number; /** Optional sale discount percentage (0–100). */
+  /** Unique identifier for the product. */
+  id: string;
+  /** URL-friendly slug for the product. */
+  slug: string;
+  /** Display name of the product shown on the card. */
+  name: string;
+  /** URL of the product's thumbnail image. */
+  thumbnail: string;
+  /** Regular price of the product in VND. */
+  price: number;
+  /** Optional sale / discounted price in VND. */
+  salePrice?: number;
+  /** Optional sale discount percentage (0–100). */
   salePercentage?: number;
 };
 /**
@@ -27,4 +34,4 @@ type Props = {
 declare const ProductCard: React.FC<Props>;
 //#endregion
 export { ProductCard as t };
-//# sourceMappingURL=product-card-CvXLXbpV.d.cts.map
+//# sourceMappingURL=product-card-CYNh0CT5.d.cts.map

package/dist/{product-card-CvXLXbpV.d.mts → product-card-CYNh0CT5.d.mts}

@@ -1,11 +1,18 @@
 //#region packages/components/cards/product-card.d.ts
 type Props = {
-  /** Unique identifier for the product. */id: string; /** URL-friendly slug for the product. */
-  slug: string; /** Display name of the product shown on the card. */
-  name: string; /** URL of the product's thumbnail image. */
-  thumbnail: string; /** Regular price of the product in VND. */
-  price: number; /** Optional sale / discounted price in VND. */
-  salePrice?: number; /** Optional sale discount percentage (0–100). */
+  /** Unique identifier for the product. */
+  id: string;
+  /** URL-friendly slug for the product. */
+  slug: string;
+  /** Display name of the product shown on the card. */
+  name: string;
+  /** URL of the product's thumbnail image. */
+  thumbnail: string;
+  /** Regular price of the product in VND. */
+  price: number;
+  /** Optional sale / discounted price in VND. */
+  salePrice?: number;
+  /** Optional sale discount percentage (0–100). */
   salePercentage?: number;
 };
 /**
@@ -27,4 +34,4 @@ type Props = {
 declare const ProductCard: React.FC<Props>;
 //#endregion
 export { ProductCard as t };
-//# sourceMappingURL=product-card-CvXLXbpV.d.mts.map
+//# sourceMappingURL=product-card-CYNh0CT5.d.mts.map

package/dist/{progress-Bp-5keO8.d.cts → progress-BpWaSlPG.d.cts}

@@ -1,5 +1,4 @@
 import { Progress } from "radix-ui";
-
 //#region packages/components/ui/progress.d.ts
 /**
  * A horizontal progress bar that visually represents a completion percentage.
@@ -11,11 +10,7 @@ import { Progress } from "radix-ui";
  * <Progress value={65} />
  * ```
  */
-declare function Progress$1({
-  className,
-  value,
-  ...props
-}: React.ComponentProps<typeof Progress.Root>): import("react").JSX.Element;
+declare function Progress$1({ className, value, ...props }: React.ComponentProps<typeof Progress.Root>): import("react").JSX.Element;
 //#endregion
 export { Progress$1 as t };
-//# sourceMappingURL=progress-Bp-5keO8.d.cts.map
+//# sourceMappingURL=progress-BpWaSlPG.d.cts.map

package/dist/{progress-Bp-5keO8.d.mts → progress-BpWaSlPG.d.mts}

@@ -1,5 +1,4 @@
 import { Progress } from "radix-ui";
-
 //#region packages/components/ui/progress.d.ts
 /**
  * A horizontal progress bar that visually represents a completion percentage.
@@ -11,11 +10,7 @@ import { Progress } from "radix-ui";
  * <Progress value={65} />
  * ```
  */
-declare function Progress$1({
-  className,
-  value,
-  ...props
-}: React.ComponentProps<typeof Progress.Root>): import("react").JSX.Element;
+declare function Progress$1({ className, value, ...props }: React.ComponentProps<typeof Progress.Root>): import("react").JSX.Element;
 //#endregion
 export { Progress$1 as t };
-//# sourceMappingURL=progress-Bp-5keO8.d.mts.map
+//# sourceMappingURL=progress-BpWaSlPG.d.mts.map

package/dist/progress-display-DbfN7U8m.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"progress-display-DbfN7U8m.cjs","names":["UITableEmpty","Progress"],"sources":["../packages/components/features/tables/components/atoms/progress-display.tsx"],"sourcesContent":["'use client';\n\nimport { memo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Progress } from '@/components/ui/progress';\nimport { UITableEmpty } from './empty';\n\n/** Props for the {@link UITableProgressDisplay} component. */\ntype Props = {\n  /** Percentage value between 0 and 100; `null`/`undefined` renders an empty state. */\n  value: number | null | undefined;\n  /** When `true`, shows the numeric percentage next to the bar (default: `true`). */\n  showLabel?: boolean;\n  /**\n   * Color thresholds applied to the progress indicator.\n   * - `≥ successThreshold` → green\n   * - `≥ warningThreshold` → yellow\n   * - otherwise → red\n   *\n   * Defaults: `successThreshold = 70`, `warningThreshold = 40`.\n   */\n  successThreshold?: number;\n  warningThreshold?: number;\n};\n\n/**\n * Renders a horizontal progress bar with an optional percentage label for a\n * table cell.  The bar color shifts from red → yellow → green based on\n * configurable thresholds.  Renders {@link UITableEmpty} when `value` is absent.\n *\n * @example\n * import { UITableProgressDisplay } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableProgressDisplay value={75} />\n */\nexport const UITableProgressDisplay = memo(({ value, showLabel = true, successThreshold = 70, warningThreshold = 40 }: Props) => {\n  if (value === null || value === undefined) return <UITableEmpty />;\n\n  const clamped = Math.min(100, Math.max(0, value));\n\n  const indicatorClass =\n    clamped >= successThreshold\n      ? '[&>[data-slot=progress-indicator]]:bg-success'\n      : clamped >= warningThreshold\n        ? '[&>[data-slot=progress-indicator]]:bg-warning'\n        : '[&>[data-slot=progress-indicator]]:bg-danger';\n\n  return (\n    <div className=\"flex w-full min-w-24 items-center gap-x-2\">\n      <Progress value={clamped} className={cn('flex-1', indicatorClass)} />\n      {showLabel && <span className=\"w-9 shrink-0 text-right font-number text-text-positive-weak text-xs tabular-nums\">{clamped}%</span>}\n    </div>\n  );\n});\nUITableProgressDisplay.displayName = 'UITableProgressDisplay';\n"],"mappings":"0KAqCA,MAAa,GAAA,EAAA,EAAA,KAAA,EAA+B,CAAE,QAAO,YAAY,GAAM,mBAAmB,GAAI,mBAAmB,MAAgB,CAC/H,GAAI,GAAU,KAA6B,OAAO,EAAA,EAAA,IAAA,CAACA,EAAAA,EAAD,CAAe,CAAA,EAEjE,IAAM,EAAU,KAAK,IAAI,IAAK,KAAK,IAAI,EAAG,CAAK,CAAC,EAShD,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,qDAAf,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,SAAD,CAAU,MAAO,EAAS,WAAA,EAAA,EAAA,GAAA,CAAc,SAR1C,GAAW,EACP,gDACA,GAAW,EACT,gDACA,8CAI4D,CAAI,CAAA,EACnE,IAAa,EAAA,EAAA,KAAA,CAAC,OAAD,CAAM,UAAU,4FAAhB,CAAoG,EAAQ,GAAO,GAC9H,GAET,CAAC,EACD,EAAuB,YAAc"}
+{"version":3,"file":"progress-display-DbfN7U8m.cjs","names":["UITableEmpty","Progress"],"sources":["../packages/components/features/tables/components/atoms/progress-display.tsx"],"sourcesContent":["'use client';\n\nimport { memo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Progress } from '@/components/ui/progress';\nimport { UITableEmpty } from './empty';\n\n/** Props for the {@link UITableProgressDisplay} component. */\ntype Props = {\n  /** Percentage value between 0 and 100; `null`/`undefined` renders an empty state. */\n  value: number | null | undefined;\n  /** When `true`, shows the numeric percentage next to the bar (default: `true`). */\n  showLabel?: boolean;\n  /**\n   * Color thresholds applied to the progress indicator.\n   * - `≥ successThreshold` → green\n   * - `≥ warningThreshold` → yellow\n   * - otherwise → red\n   *\n   * Defaults: `successThreshold = 70`, `warningThreshold = 40`.\n   */\n  successThreshold?: number;\n  warningThreshold?: number;\n};\n\n/**\n * Renders a horizontal progress bar with an optional percentage label for a\n * table cell.  The bar color shifts from red → yellow → green based on\n * configurable thresholds.  Renders {@link UITableEmpty} when `value` is absent.\n *\n * @example\n * import { UITableProgressDisplay } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableProgressDisplay value={75} />\n */\nexport const UITableProgressDisplay = memo(({ value, showLabel = true, successThreshold = 70, warningThreshold = 40 }: Props) => {\n  if (value === null || value === undefined) return <UITableEmpty />;\n\n  const clamped = Math.min(100, Math.max(0, value));\n\n  const indicatorClass =\n    clamped >= successThreshold\n      ? '[&>[data-slot=progress-indicator]]:bg-success'\n      : clamped >= warningThreshold\n        ? '[&>[data-slot=progress-indicator]]:bg-warning'\n        : '[&>[data-slot=progress-indicator]]:bg-danger';\n\n  return (\n    <div className=\"flex w-full min-w-24 items-center gap-x-2\">\n      <Progress value={clamped} className={cn('flex-1', indicatorClass)} />\n      {showLabel && <span className=\"w-9 shrink-0 text-right font-number text-text-positive-weak text-xs tabular-nums\">{clamped}%</span>}\n    </div>\n  );\n});\nUITableProgressDisplay.displayName = 'UITableProgressDisplay';\n"],"mappings":"0KAqCA,MAAa,GAAA,EAAA,EAAA,KAAA,EAA+B,CAAE,QAAO,YAAY,GAAM,mBAAmB,GAAI,mBAAmB,MAAgB,CAC/H,GAAI,GAAU,KAA6B,OAAO,EAAA,EAAA,IAAA,CAACA,EAAAA,EAAD,CAAe,CAAA,EAEjE,IAAM,EAAU,KAAK,IAAI,IAAK,KAAK,IAAI,EAAG,CAAK,CAAC,EAShD,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,4CAAf,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,SAAD,CAAU,MAAO,EAAS,WAAA,EAAA,EAAA,GAAA,CAAc,SAR1C,GAAW,EACP,gDACA,GAAW,EACT,gDACA,8CAI4D,CAAI,CAAA,EACnE,IAAa,EAAA,EAAA,KAAA,CAAC,OAAD,CAAM,UAAU,mFAAhB,SAAA,CAAoG,EAAQ,GAAO,CAC9H,CAAA,CAAA,GAET,CAAC,EACD,EAAuB,YAAc"}

package/dist/progress-display-qgvclwy9.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"progress-display-qgvclwy9.mjs","names":[],"sources":["../packages/components/features/tables/components/atoms/progress-display.tsx"],"sourcesContent":["'use client';\n\nimport { memo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Progress } from '@/components/ui/progress';\nimport { UITableEmpty } from './empty';\n\n/** Props for the {@link UITableProgressDisplay} component. */\ntype Props = {\n  /** Percentage value between 0 and 100; `null`/`undefined` renders an empty state. */\n  value: number | null | undefined;\n  /** When `true`, shows the numeric percentage next to the bar (default: `true`). */\n  showLabel?: boolean;\n  /**\n   * Color thresholds applied to the progress indicator.\n   * - `≥ successThreshold` → green\n   * - `≥ warningThreshold` → yellow\n   * - otherwise → red\n   *\n   * Defaults: `successThreshold = 70`, `warningThreshold = 40`.\n   */\n  successThreshold?: number;\n  warningThreshold?: number;\n};\n\n/**\n * Renders a horizontal progress bar with an optional percentage label for a\n * table cell.  The bar color shifts from red → yellow → green based on\n * configurable thresholds.  Renders {@link UITableEmpty} when `value` is absent.\n *\n * @example\n * import { UITableProgressDisplay } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableProgressDisplay value={75} />\n */\nexport const UITableProgressDisplay = memo(({ value, showLabel = true, successThreshold = 70, warningThreshold = 40 }: Props) => {\n  if (value === null || value === undefined) return <UITableEmpty />;\n\n  const clamped = Math.min(100, Math.max(0, value));\n\n  const indicatorClass =\n    clamped >= successThreshold\n      ? '[&>[data-slot=progress-indicator]]:bg-success'\n      : clamped >= warningThreshold\n        ? '[&>[data-slot=progress-indicator]]:bg-warning'\n        : '[&>[data-slot=progress-indicator]]:bg-danger';\n\n  return (\n    <div className=\"flex w-full min-w-24 items-center gap-x-2\">\n      <Progress value={clamped} className={cn('flex-1', indicatorClass)} />\n      {showLabel && <span className=\"w-9 shrink-0 text-right font-number text-text-positive-weak text-xs tabular-nums\">{clamped}%</span>}\n    </div>\n  );\n});\nUITableProgressDisplay.displayName = 'UITableProgressDisplay';\n"],"mappings":"0NAqCA,MAAa,EAAyB,GAAM,CAAE,QAAO,YAAY,GAAM,mBAAmB,GAAI,mBAAmB,MAAgB,CAC/H,GAAI,GAAU,KAA6B,OAAO,EAAC,EAAD,CAAe,CAAA,EAEjE,IAAM,EAAU,KAAK,IAAI,IAAK,KAAK,IAAI,EAAG,CAAK,CAAC,EAShD,OACE,EAAC,MAAD,CAAK,UAAU,qDAAf,CACE,EAAC,EAAD,CAAU,MAAO,EAAS,UAAW,EAAG,SAR1C,GAAW,EACP,gDACA,GAAW,EACT,gDACA,8CAI4D,CAAI,CAAA,EACnE,GAAa,EAAC,OAAD,CAAM,UAAU,4FAAhB,CAAoG,EAAQ,GAAO,GAC9H,GAET,CAAC,EACD,EAAuB,YAAc"}
+{"version":3,"file":"progress-display-qgvclwy9.mjs","names":[],"sources":["../packages/components/features/tables/components/atoms/progress-display.tsx"],"sourcesContent":["'use client';\n\nimport { memo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Progress } from '@/components/ui/progress';\nimport { UITableEmpty } from './empty';\n\n/** Props for the {@link UITableProgressDisplay} component. */\ntype Props = {\n  /** Percentage value between 0 and 100; `null`/`undefined` renders an empty state. */\n  value: number | null | undefined;\n  /** When `true`, shows the numeric percentage next to the bar (default: `true`). */\n  showLabel?: boolean;\n  /**\n   * Color thresholds applied to the progress indicator.\n   * - `≥ successThreshold` → green\n   * - `≥ warningThreshold` → yellow\n   * - otherwise → red\n   *\n   * Defaults: `successThreshold = 70`, `warningThreshold = 40`.\n   */\n  successThreshold?: number;\n  warningThreshold?: number;\n};\n\n/**\n * Renders a horizontal progress bar with an optional percentage label for a\n * table cell.  The bar color shifts from red → yellow → green based on\n * configurable thresholds.  Renders {@link UITableEmpty} when `value` is absent.\n *\n * @example\n * import { UITableProgressDisplay } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableProgressDisplay value={75} />\n */\nexport const UITableProgressDisplay = memo(({ value, showLabel = true, successThreshold = 70, warningThreshold = 40 }: Props) => {\n  if (value === null || value === undefined) return <UITableEmpty />;\n\n  const clamped = Math.min(100, Math.max(0, value));\n\n  const indicatorClass =\n    clamped >= successThreshold\n      ? '[&>[data-slot=progress-indicator]]:bg-success'\n      : clamped >= warningThreshold\n        ? '[&>[data-slot=progress-indicator]]:bg-warning'\n        : '[&>[data-slot=progress-indicator]]:bg-danger';\n\n  return (\n    <div className=\"flex w-full min-w-24 items-center gap-x-2\">\n      <Progress value={clamped} className={cn('flex-1', indicatorClass)} />\n      {showLabel && <span className=\"w-9 shrink-0 text-right font-number text-text-positive-weak text-xs tabular-nums\">{clamped}%</span>}\n    </div>\n  );\n});\nUITableProgressDisplay.displayName = 'UITableProgressDisplay';\n"],"mappings":"0NAqCA,MAAa,EAAyB,GAAM,CAAE,QAAO,YAAY,GAAM,mBAAmB,GAAI,mBAAmB,MAAgB,CAC/H,GAAI,GAAU,KAA6B,OAAO,EAAC,EAAD,CAAe,CAAA,EAEjE,IAAM,EAAU,KAAK,IAAI,IAAK,KAAK,IAAI,EAAG,CAAK,CAAC,EAShD,OACE,EAAC,MAAD,CAAK,UAAU,4CAAf,SAAA,CACE,EAAC,EAAD,CAAU,MAAO,EAAS,UAAW,EAAG,SAR1C,GAAW,EACP,gDACA,GAAW,EACT,gDACA,8CAI4D,CAAI,CAAA,EACnE,GAAa,EAAC,OAAD,CAAM,UAAU,mFAAhB,SAAA,CAAoG,EAAQ,GAAO,CAC9H,CAAA,CAAA,GAET,CAAC,EACD,EAAuB,YAAc"}

package/dist/{radio-group-ycQQrPGn.d.cts → radio-group-D_ssq0Q2.d.cts}

@@ -1,5 +1,4 @@
 import { RadioGroup } from "radix-ui";
-
 //#region packages/components/ui/radio-group.d.ts
 /**
  * Accessible radio button group built on Radix UI's RadioGroup primitive, where only one option can be selected at a time.
@@ -21,15 +20,9 @@ import { RadioGroup } from "radix-ui";
  * </RadioGroup>
  * ```
  */
-declare function RadioGroup$1({
-  className,
-  ...props
-}: React.ComponentProps<typeof RadioGroup.Root>): import("react").JSX.Element;
+declare function RadioGroup$1({ className, ...props }: React.ComponentProps<typeof RadioGroup.Root>): import("react").JSX.Element;
 /** Individual radio button within a `RadioGroup`; shows a filled circle indicator when selected. */
-declare function RadioGroupItem({
-  className,
-  ...props
-}: React.ComponentProps<typeof RadioGroup.Item>): import("react").JSX.Element;
+declare function RadioGroupItem({ className, ...props }: React.ComponentProps<typeof RadioGroup.Item>): import("react").JSX.Element;
 //#endregion
 export { RadioGroupItem as n, RadioGroup$1 as t };
-//# sourceMappingURL=radio-group-ycQQrPGn.d.cts.map
+//# sourceMappingURL=radio-group-D_ssq0Q2.d.cts.map

package/dist/{radio-group-ycQQrPGn.d.mts → radio-group-D_ssq0Q2.d.mts}

@@ -1,5 +1,4 @@
 import { RadioGroup } from "radix-ui";
-
 //#region packages/components/ui/radio-group.d.ts
 /**
  * Accessible radio button group built on Radix UI's RadioGroup primitive, where only one option can be selected at a time.
@@ -21,15 +20,9 @@ import { RadioGroup } from "radix-ui";
  * </RadioGroup>
  * ```
  */
-declare function RadioGroup$1({
-  className,
-  ...props
-}: React.ComponentProps<typeof RadioGroup.Root>): import("react").JSX.Element;
+declare function RadioGroup$1({ className, ...props }: React.ComponentProps<typeof RadioGroup.Root>): import("react").JSX.Element;
 /** Individual radio button within a `RadioGroup`; shows a filled circle indicator when selected. */
-declare function RadioGroupItem({
-  className,
-  ...props
-}: React.ComponentProps<typeof RadioGroup.Item>): import("react").JSX.Element;
+declare function RadioGroupItem({ className, ...props }: React.ComponentProps<typeof RadioGroup.Item>): import("react").JSX.Element;
 //#endregion
 export { RadioGroupItem as n, RadioGroup$1 as t };
-//# sourceMappingURL=radio-group-ycQQrPGn.d.mts.map
+//# sourceMappingURL=radio-group-D_ssq0Q2.d.mts.map

package/dist/{radio-group-field-DsUi8uCy.mjs → radio-group-field-DOJ4jVSr.mjs}

@@ -1,2 +1,2 @@
-import{G as e}from"./tanstack-form-AGwPfwiM.mjs";import{RadioGroup as t,RadioGroupItem as n}from"./ui/radio-group.mjs";import{Field as r,FieldContent as i,FieldContentMain as a,FieldDescription as o,FieldGroup as s,FieldLabel as c,FieldNote as l,FieldSeparator as u,FieldTitle as d,FieldTooltip as f}from"./field-V2DoD8qL.mjs";import{cn as p}from"@customafk/react-toolkit/utils";import{jsx as m,jsxs as h}from"react/jsx-runtime";import{useStore as g}from"@tanstack/react-form";const _=({label:_,description:v,orientation:y,options:b,tooltip:x,helperText:S})=>{let C=e(),w=g(C.form.store,({isSubmitting:e})=>e);return h(s,{className:`px-4`,children:[h(r,{orientation:y,className:`flex-col gap-2`,children:[h(i,{children:[h(c,{children:[_,x&&m(f,{tooltip:x})]}),m(o,{children:v}),m(l,{isShow:!!S,children:S})]}),m(a,{children:m(t,{value:C.state.value??``,className:`w-full`,onValueChange:C.handleChange,children:b.map(e=>m(c,{className:p(`h-fit`,C.state.value===e.value&&`border-primary-weak! bg-primary-bg-subtle`,w&&`pointer-events-none bg-muted-muted opacity-60`,C.state.value===e.value&&w&&`border-border-strong!`),children:h(r,{orientation:`horizontal`,className:`items-start gap-3 rounded p-2!`,children:[m(n,{value:e.value,className:`mt-0.5 shrink-0`}),h(i,{className:`gap-0.5!`,children:[m(d,{children:e.label}),m(o,{className:`text-xs`,children:e.description})]})]})},e.value))})})]}),m(u,{})]})};export{_ as RadioGroupField};
-//# sourceMappingURL=radio-group-field-DsUi8uCy.mjs.map
+import{G as e}from"./tanstack-form-q9hDCc0Y.mjs";import{RadioGroup as t,RadioGroupItem as n}from"./ui/radio-group.mjs";import{Field as r,FieldContent as i,FieldContentMain as a,FieldDescription as o,FieldGroup as s,FieldLabel as c,FieldNote as l,FieldSeparator as u,FieldTitle as d,FieldTooltip as f}from"./field-V2DoD8qL.mjs";import{cn as p}from"@customafk/react-toolkit/utils";import{jsx as m,jsxs as h}from"react/jsx-runtime";import{useStore as g}from"@tanstack/react-form";const _=({label:_,description:v,orientation:y,options:b,tooltip:x,helperText:S})=>{let C=e(),w=g(C.form.store,({isSubmitting:e})=>e);return h(s,{className:`px-4`,children:[h(r,{orientation:y,className:`flex-col gap-2`,children:[h(i,{children:[h(c,{children:[_,x&&m(f,{tooltip:x})]}),m(o,{children:v}),m(l,{isShow:!!S,children:S})]}),m(a,{children:m(t,{value:C.state.value??``,className:`w-full`,onValueChange:C.handleChange,children:b.map(e=>m(c,{className:p(`h-fit`,C.state.value===e.value&&`border-primary-weak! bg-primary-bg-subtle`,w&&`pointer-events-none bg-muted-muted opacity-60`,C.state.value===e.value&&w&&`border-border-strong!`),children:h(r,{orientation:`horizontal`,className:`items-start gap-3 rounded p-2!`,children:[m(n,{value:e.value,className:`mt-0.5 shrink-0`}),h(i,{className:`gap-0.5!`,children:[m(d,{children:e.label}),m(o,{className:`text-xs`,children:e.description})]})]})},e.value))})})]}),m(u,{})]})};export{_ as RadioGroupField};
+//# sourceMappingURL=radio-group-field-DOJ4jVSr.mjs.map