@customafk/lunas-ui 0.2.40 → 0.2.41

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

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

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"role-badge.js","names":["ROLE_COLORS: Record<ERole, React.ComponentProps<typeof Badge>['color']>","ROLE_LABELS: Record<ERole, string>","RoleBadge: React.FC<RoleBadgeProps>"],"sources":["../../packages/components/data-display/role-badge.tsx"],"sourcesContent":["'use client';\n\nimport { ERole } from '@/types';\n\nimport { Badge } from '../ui/badge';\n\nconst ROLE_COLORS: Record<ERole, React.ComponentProps<typeof Badge>['color']> = {\n  [ERole.ADMIN]: 'primary',\n  [ERole.SUPER_ADMIN]: 'danger',\n  [ERole.MODERATOR]: 'info',\n  [ERole.STAFF]: 'accent',\n  [ERole.USER]: 'muted',\n};\n\nconst ROLE_LABELS: Record<ERole, string> = {\n  [ERole.SUPER_ADMIN]: 'Super Admin',\n  [ERole.ADMIN]: 'Admin',\n  [ERole.MODERATOR]: 'Moderator',\n  [ERole.STAFF]: 'Staff',\n  [ERole.USER]: 'User',\n};\n\ntype RoleBadgeProps = {\n  /** The user role enum value that determines the badge label and colour. */\n  status: ERole;\n};\n\n/**\n * Renders a colour-coded badge for a user role (e.g. Admin, Staff, User).\n *\n * @example\n * ```tsx\n * import { RoleBadge } from '@customafk/lunas-ui/data-display/role-badge';\n * import { ERole } from '@customafk/lunas-ui/types';\n *\n * <RoleBadge status={ERole.ADMIN} />\n * ```\n */\nexport const RoleBadge: React.FC<RoleBadgeProps> = ({ status }) => {\n  return (\n    <Badge data-slot=\"role-badge\" color={ROLE_COLORS[status]} className=\"min-w-24 justify-center\">\n      {ROLE_LABELS[status]}\n    </Badge>\n  );\n};\n"],"mappings":"kIAMA,MAAMA,EAA0E,EAC7E,EAAM,OAAQ,WACd,EAAM,aAAc,UACpB,EAAM,WAAY,QAClB,EAAM,OAAQ,UACd,EAAM,MAAO,QACf,CAEKC,EAAqC,EACxC,EAAM,aAAc,eACpB,EAAM,OAAQ,SACd,EAAM,WAAY,aAClB,EAAM,OAAQ,SACd,EAAM,MAAO,OACf,CAkBYC,GAAuC,CAAE,YAElD,EAAC,EAAA,CAAM,YAAU,aAAa,MAAO,EAAY,GAAS,UAAU,mCACjE,EAAY,IACP"}
+{"version":3,"file":"role-badge.js","names":["ROLE_COLORS: Record<ERole, React.ComponentProps<typeof Badge>['color']>","ROLE_LABELS: Record<ERole, string>","RoleBadge: React.FC<RoleBadgeProps>"],"sources":["../../packages/components/data-display/role-badge.tsx"],"sourcesContent":["'use client';\n\nimport { ERole } from '@/types';\n\nimport { Badge } from '../ui/badge';\n\nconst ROLE_COLORS: Record<ERole, React.ComponentProps<typeof Badge>['color']> = {\n  [ERole.ADMIN]: 'primary',\n  [ERole.SUPER_ADMIN]: 'danger',\n  [ERole.MODERATOR]: 'info',\n  [ERole.STAFF]: 'accent',\n  [ERole.USER]: 'muted',\n};\n\nconst ROLE_LABELS: Record<ERole, string> = {\n  [ERole.SUPER_ADMIN]: 'Super Admin',\n  [ERole.ADMIN]: 'Admin',\n  [ERole.MODERATOR]: 'Moderator',\n  [ERole.STAFF]: 'Staff',\n  [ERole.USER]: 'User',\n};\n\ntype RoleBadgeProps = {\n  /** The user role enum value that determines the badge label and colour. */\n  status: ERole;\n};\n\n/**\n * Renders a colour-coded badge for a user role (e.g. Admin, Staff, User).\n *\n * @example\n * ```tsx\n * import { RoleBadge } from '@customafk/lunas-ui/data-display/role-badge';\n * import { ERole } from '@customafk/lunas-ui/types';\n *\n * <RoleBadge status={ERole.ADMIN} />\n * ```\n */\nexport const RoleBadge: React.FC<RoleBadgeProps> = ({ status }) => {\n  return (\n    <Badge data-slot=\"role-badge\" color={ROLE_COLORS[status]} className=\"min-w-24 justify-center\">\n      {ROLE_LABELS[status]}\n    </Badge>\n  );\n};\n"],"mappings":"4HAMA,MAAMA,EAA0E,EAC7E,EAAM,OAAQ,WACd,EAAM,aAAc,UACpB,EAAM,WAAY,QAClB,EAAM,OAAQ,UACd,EAAM,MAAO,QACf,CAEKC,EAAqC,EACxC,EAAM,aAAc,eACpB,EAAM,OAAQ,SACd,EAAM,WAAY,aAClB,EAAM,OAAQ,SACd,EAAM,MAAO,OACf,CAkBYC,GAAuC,CAAE,YAElD,EAAC,EAAA,CAAM,YAAU,aAAa,MAAO,EAAY,GAAS,UAAU,mCACjE,EAAY,IACP"}

package/dist/data-display/statistic.cjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"statistic.cjs","names":["options: Intl.NumberFormatOptions"],"sources":["../../packages/components/data-display/statistic.tsx"],"sourcesContent":["'use client';\n\nimport { memo, useCallback, useMemo } from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nconst statisticVariants = cva('inline-flex items-center gap-1 font-number tabular-nums transition-colors', {\n  variants: {\n    size: {\n      xs: 'text-xs',\n      sm: 'text-sm',\n      md: 'text-base',\n      lg: 'text-lg',\n      xl: 'text-xl',\n    },\n    trend: {\n      neutral: 'text-text-positive-strong',\n      up: 'text-success',\n      down: 'text-danger',\n    },\n  },\n  defaultVariants: {\n    size: 'lg',\n    trend: 'neutral',\n  },\n});\n\nexport type StatisticProps = VariantProps<typeof statisticVariants> & {\n  /** Character used to separate the decimal part. Defaults to `'.'`. */\n  decimalSeparator?: string;\n  /** Character used to separate thousands groups. Defaults to `','`. */\n  groupSeparator?: string;\n  /** Optional node rendered before the numeric value (e.g. a currency symbol). */\n  prefix?: React.ReactNode;\n  /** Optional node rendered after the numeric value (e.g. a unit label). */\n  suffix?: React.ReactNode;\n  /** Number of decimal digits to display; omit to show all significant digits. */\n  precision?: number;\n  /** Rounding strategy applied before formatting. Defaults to `'round'`. */\n  roundingMode?: 'round' | 'floor' | 'ceil';\n  /** When `true`, pads the decimal part with trailing zeros up to `precision`. Defaults to `false`. */\n  showTrailingZeros?: boolean;\n  /** The numeric (or numeric-string) value to format and display. */\n  value: number | string;\n  /** Additional CSS classes applied to the wrapper element. */\n  className?: string;\n  /** Colour trend indicator: `'neutral'` (default), `'up'` (green), or `'down'` (red). */\n  trend?: 'neutral' | 'up' | 'down';\n};\n\n/**\n * A memoised numeric display component with locale-aware formatting, optional prefix/suffix, trend colouring, and configurable rounding.\n *\n * @example\n * ```tsx\n * import { Statistic } from '@customafk/lunas-ui/data-display/statistic';\n *\n * <Statistic value={1234567.89} precision={2} prefix=\"$\" trend=\"up\" size=\"lg\" />\n * ```\n */\nexport const Statistic = memo(\n  ({\n    decimalSeparator = '.',\n    groupSeparator = ',',\n    prefix: Prefix,\n    suffix: Suffix,\n    precision,\n    roundingMode = 'round',\n    showTrailingZeros = false,\n    size = 'lg',\n    trend = 'neutral',\n    value,\n    className,\n  }: StatisticProps) => {\n    const applyRounding = useCallback(\n      (num: number, precisionValue: number): number => {\n        const multiplier = 10 ** precisionValue;\n        switch (roundingMode) {\n          case 'floor':\n            return Math.floor(num * multiplier) / multiplier;\n          case 'ceil':\n            return Math.ceil(num * multiplier) / multiplier;\n          default:\n            return Math.round(num * multiplier) / multiplier;\n        }\n      },\n      [roundingMode]\n    );\n\n    const formatOptions = useMemo((): Intl.NumberFormatOptions => {\n      const options: Intl.NumberFormatOptions = {};\n      if (typeof precision === 'number' && precision >= 0) {\n        if (showTrailingZeros) {\n          options.minimumFractionDigits = precision;\n          options.maximumFractionDigits = precision;\n        } else {\n          options.maximumFractionDigits = precision;\n        }\n      }\n      return options;\n    }, [precision, showTrailingZeros]);\n\n    const formatNumber = useCallback(\n      (num: number): string => {\n        let processedNum = num;\n        if (typeof precision === 'number' && precision >= 0) {\n          processedNum = applyRounding(num, precision);\n        }\n        return processedNum.toLocaleString('en-US', formatOptions);\n      },\n      [applyRounding, formatOptions, precision]\n    );\n\n    const processedValue = useMemo((): string => {\n      if (typeof value === 'number') {\n        if (Number.isNaN(value) || !Number.isFinite(value)) return 'N/A';\n        return formatNumber(value);\n      }\n      if (typeof value === 'string') {\n        const trimmedValue = value.trim();\n        if (!trimmedValue) return 'N/A';\n        const numValue = Number(trimmedValue);\n        if (Number.isNaN(numValue) || !Number.isFinite(numValue)) return 'N/A';\n        return formatNumber(numValue);\n      }\n      return 'N/A';\n    }, [value, formatNumber]);\n\n    const finalFormattedValue = useMemo((): string => {\n      if (decimalSeparator === '.' && groupSeparator === ',') return processedValue;\n      return processedValue.replace(/,/g, groupSeparator).replace(/\\./g, decimalSeparator);\n    }, [processedValue, decimalSeparator, groupSeparator]);\n\n    return (\n      <div data-slot=\"statistic\" className={cn(statisticVariants({ size, trend }), className)}>\n        {Prefix && <span data-slot=\"statistic-prefix\">{Prefix}</span>}\n        <p data-slot=\"statistic-value\">{finalFormattedValue}</p>\n        {Suffix && <span data-slot=\"statistic-suffix\">{Suffix}</span>}\n      </div>\n    );\n  }\n);\nStatistic.displayName = 'Statistic';\n"],"mappings":"8LAMA,MAAM,GAAA,EAAA,EAAA,KAAwB,4EAA6E,CACzG,SAAU,CACR,KAAM,CACJ,GAAI,UACJ,GAAI,UACJ,GAAI,YACJ,GAAI,UACJ,GAAI,UACL,CACD,MAAO,CACL,QAAS,4BACT,GAAI,eACJ,KAAM,cACP,CACF,CACD,gBAAiB,CACf,KAAM,KACN,MAAO,UACR,CACF,CAAC,CAmCW,GAAA,EAAA,EAAA,OACV,CACC,mBAAmB,IACnB,iBAAiB,IACjB,OAAQ,EACR,OAAQ,EACR,YACA,eAAe,QACf,oBAAoB,GACpB,OAAO,KACP,QAAQ,UACR,QACA,eACoB,CACpB,IAAM,GAAA,EAAA,EAAA,cACH,EAAa,IAAmC,CAC/C,IAAM,EAAa,IAAM,EACzB,OAAQ,EAAR,CACE,IAAK,QACH,OAAO,KAAK,MAAM,EAAM,EAAW,CAAG,EACxC,IAAK,OACH,OAAO,KAAK,KAAK,EAAM,EAAW,CAAG,EACvC,QACE,OAAO,KAAK,MAAM,EAAM,EAAW,CAAG,IAG5C,CAAC,EAAa,CACf,CAEK,GAAA,EAAA,EAAA,aAAwD,CAC5D,IAAMA,EAAoC,EAAE,CAS5C,OARI,OAAO,GAAc,UAAY,GAAa,IAC5C,IACF,EAAQ,sBAAwB,GAGhC,EAAQ,sBAAwB,GAG7B,GACN,CAAC,EAAW,EAAkB,CAAC,CAE5B,GAAA,EAAA,EAAA,aACH,GAAwB,CACvB,IAAI,EAAe,EAInB,OAHI,OAAO,GAAc,UAAY,GAAa,IAChD,EAAe,EAAc,EAAK,EAAU,EAEvC,EAAa,eAAe,QAAS,EAAc,EAE5D,CAAC,EAAe,EAAe,EAAU,CAC1C,CAEK,GAAA,EAAA,EAAA,aAAuC,CAC3C,GAAI,OAAO,GAAU,SAEnB,OADI,OAAO,MAAM,EAAM,EAAI,CAAC,OAAO,SAAS,EAAM,CAAS,MACpD,EAAa,EAAM,CAE5B,GAAI,OAAO,GAAU,SAAU,CAC7B,IAAM,EAAe,EAAM,MAAM,CACjC,GAAI,CAAC,EAAc,MAAO,MAC1B,IAAM,EAAW,OAAO,EAAa,CAErC,OADI,OAAO,MAAM,EAAS,EAAI,CAAC,OAAO,SAAS,EAAS,CAAS,MAC1D,EAAa,EAAS,CAE/B,MAAO,OACN,CAAC,EAAO,EAAa,CAAC,CAEnB,GAAA,EAAA,EAAA,aACA,IAAqB,KAAO,IAAmB,IAAY,EACxD,EAAe,QAAQ,KAAM,EAAe,CAAC,QAAQ,MAAO,EAAiB,CACnF,CAAC,EAAgB,EAAkB,EAAe,CAAC,CAEtD,OACE,EAAA,EAAA,MAAC,MAAA,CAAI,YAAU,YAAY,WAAA,EAAA,EAAA,IAAc,EAAkB,CAAE,OAAM,QAAO,CAAC,CAAE,EAAU,WACpF,IAAU,EAAA,EAAA,KAAC,OAAA,CAAK,YAAU,4BAAoB,GAAc,EAC7D,EAAA,EAAA,KAAC,IAAA,CAAE,YAAU,2BAAmB,GAAwB,CACvD,IAAU,EAAA,EAAA,KAAC,OAAA,CAAK,YAAU,4BAAoB,GAAc,GACzD,EAGX,CACD,EAAU,YAAc"}

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

@@ -1,4 +1,4 @@
-import * as react0 from "react";
+import * as react1 from "react";
 import * as class_variance_authority_types0 from "class-variance-authority/types";
 import { VariantProps } from "class-variance-authority";
 
@@ -39,7 +39,7 @@ type StatisticProps = VariantProps<typeof statisticVariants> & {
  * <Statistic value={1234567.89} precision={2} prefix="$" trend="up" size="lg" />
  * ```
  */
-declare const Statistic: react0.MemoExoticComponent<({
+declare const Statistic: react1.MemoExoticComponent<({
   decimalSeparator,
   groupSeparator,
   prefix: Prefix,
@@ -51,7 +51,7 @@ declare const Statistic: react0.MemoExoticComponent<({
   trend,
   value,
   className
-}: StatisticProps) => react0.JSX.Element>;
+}: StatisticProps) => react1.JSX.Element>;
 //#endregion
 export { Statistic, StatisticProps };
 //# sourceMappingURL=statistic.d.cts.map

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

@@ -1,5 +1,5 @@
-import * as react0 from "react";
 import { VariantProps } from "class-variance-authority";
+import * as react4 from "react";
 import * as class_variance_authority_types0 from "class-variance-authority/types";
 
 //#region packages/components/data-display/statistic.d.ts
@@ -39,7 +39,7 @@ type StatisticProps = VariantProps<typeof statisticVariants> & {
  * <Statistic value={1234567.89} precision={2} prefix="$" trend="up" size="lg" />
  * ```
  */
-declare const Statistic: react0.MemoExoticComponent<({
+declare const Statistic: react4.MemoExoticComponent<({
   decimalSeparator,
   groupSeparator,
   prefix: Prefix,
@@ -51,7 +51,7 @@ declare const Statistic: react0.MemoExoticComponent<({
   trend,
   value,
   className
-}: StatisticProps) => react0.JSX.Element>;
+}: StatisticProps) => react4.JSX.Element>;
 //#endregion
 export { Statistic, StatisticProps };
 //# sourceMappingURL=statistic.d.ts.map

package/dist/data-display/statistic.js

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

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

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

package/dist/data-display/user.cjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"user.cjs","names":["UserDataDisplay: React.FC<UserDataDisplayProps>","Flex","Avatar","AvatarFallback","colorHashLight","UserRoundIcon","Paragraph"],"sources":["../../packages/components/data-display/user.tsx"],"sourcesContent":["'use client';\n\nimport { UserRoundIcon } from 'lucide-react';\n\nimport { colorHashLight } from '@customafk/react-toolkit/color-hash';\n\nimport { Flex } from '../layouts/flex';\nimport { Paragraph } from '../typography/paragraph';\nimport { Avatar, AvatarFallback } from '../ui/avatar';\n\ntype UserDataDisplayProps = {\n  /** Unique identifier used to deterministically generate the avatar background colour. */\n  uuid: string;\n  /** Display name rendered as the primary line of the user card. */\n  username: string;\n  /** Email address rendered as the secondary, muted line below the username. */\n  email: string;\n};\n\n/**\n * Displays a user identity card with a colour-hashed avatar, username, and email address.\n *\n * @example\n * ```tsx\n * import { UserDataDisplay } from '@customafk/lunas-ui/data-display/user';\n *\n * <UserDataDisplay uuid=\"abc-123\" username=\"Nguyễn Văn An\" email=\"an@example.com\" />\n * ```\n */\nexport const UserDataDisplay: React.FC<UserDataDisplayProps> = ({ uuid, username, email }) => {\n  return (\n    <Flex data-slot=\"user-display\" wrap={false} gap=\"sm\" padding=\"none\">\n      <Avatar className=\"size-10 shadow-card\">\n        <AvatarFallback style={{ backgroundColor: colorHashLight.hex(uuid) }}>\n          <UserRoundIcon size={28} className=\"text-white\" />\n        </AvatarFallback>\n      </Avatar>\n      <Flex vertical padding=\"none\" gap=\"none\" align=\"start\">\n        <Paragraph className=\"text-sm font-medium text-text-positive\">{username}</Paragraph>\n        <Paragraph variant=\"sm\" className=\"mt-0! text-xs text-text-positive-weak\">\n          {email}\n        </Paragraph>\n      </Flex>\n    </Flex>\n  );\n};\n"],"mappings":"2QA6BA,MAAaA,GAAmD,CAAE,OAAM,WAAU,YAE9E,EAAA,EAAA,MAACC,EAAAA,EAAAA,CAAK,YAAU,eAAe,KAAM,GAAO,IAAI,KAAK,QAAQ,kBAC3D,EAAA,EAAA,KAACC,EAAAA,OAAAA,CAAO,UAAU,gCAChB,EAAA,EAAA,KAACC,EAAAA,eAAAA,CAAe,MAAO,CAAE,gBAAiBC,EAAAA,eAAe,IAAI,EAAK,CAAE,WAClE,EAAA,EAAA,KAACC,EAAAA,cAAAA,CAAc,KAAM,GAAI,UAAU,cAAe,EACnC,EACV,EACT,EAAA,EAAA,MAACJ,EAAAA,EAAAA,CAAK,SAAA,GAAS,QAAQ,OAAO,IAAI,OAAO,MAAM,mBAC7C,EAAA,EAAA,KAACK,EAAAA,EAAAA,CAAU,UAAU,kDAA0C,GAAqB,EACpF,EAAA,EAAA,KAACA,EAAAA,EAAAA,CAAU,QAAQ,KAAK,UAAU,iDAC/B,GACS,CAAA,EACP,CAAA,EACF"}

package/dist/data-display/user.js

@@ -1 +1,2 @@
-"use client";import"../paragraph-Cc13ZI4d.js";import"../flex-CinRrgEy.js";import"../avatar-Hpj8lmux.js";import{t as e}from"../user-BSpgswEC.js";export{e as UserDataDisplay};
+"use client";import{t as e}from"../paragraph-ESjXXqHU.js";import{t}from"../flex-D_XtSjf4.js";import{Avatar as n,AvatarFallback as r}from"../ui/avatar.js";import{UserRoundIcon as i}from"lucide-react";import{jsx as a,jsxs as o}from"react/jsx-runtime";import{colorHashLight as s}from"@customafk/react-toolkit/color-hash";const c=({uuid:c,username:l,email:u})=>o(t,{"data-slot":`user-display`,wrap:!1,gap:`sm`,padding:`none`,children:[a(n,{className:`size-10 shadow-card`,children:a(r,{style:{backgroundColor:s.hex(c)},children:a(i,{size:28,className:`text-white`})})}),o(t,{vertical:!0,padding:`none`,gap:`none`,align:`start`,children:[a(e,{className:`text-sm font-medium text-text-positive`,children:l}),a(e,{variant:`sm`,className:`mt-0! text-xs text-text-positive-weak`,children:u})]})]});export{c as UserDataDisplay};
+//# sourceMappingURL=user.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"user.js","names":["UserDataDisplay: React.FC<UserDataDisplayProps>"],"sources":["../../packages/components/data-display/user.tsx"],"sourcesContent":["'use client';\n\nimport { UserRoundIcon } from 'lucide-react';\n\nimport { colorHashLight } from '@customafk/react-toolkit/color-hash';\n\nimport { Flex } from '../layouts/flex';\nimport { Paragraph } from '../typography/paragraph';\nimport { Avatar, AvatarFallback } from '../ui/avatar';\n\ntype UserDataDisplayProps = {\n  /** Unique identifier used to deterministically generate the avatar background colour. */\n  uuid: string;\n  /** Display name rendered as the primary line of the user card. */\n  username: string;\n  /** Email address rendered as the secondary, muted line below the username. */\n  email: string;\n};\n\n/**\n * Displays a user identity card with a colour-hashed avatar, username, and email address.\n *\n * @example\n * ```tsx\n * import { UserDataDisplay } from '@customafk/lunas-ui/data-display/user';\n *\n * <UserDataDisplay uuid=\"abc-123\" username=\"Nguyễn Văn An\" email=\"an@example.com\" />\n * ```\n */\nexport const UserDataDisplay: React.FC<UserDataDisplayProps> = ({ uuid, username, email }) => {\n  return (\n    <Flex data-slot=\"user-display\" wrap={false} gap=\"sm\" padding=\"none\">\n      <Avatar className=\"size-10 shadow-card\">\n        <AvatarFallback style={{ backgroundColor: colorHashLight.hex(uuid) }}>\n          <UserRoundIcon size={28} className=\"text-white\" />\n        </AvatarFallback>\n      </Avatar>\n      <Flex vertical padding=\"none\" gap=\"none\" align=\"start\">\n        <Paragraph className=\"text-sm font-medium text-text-positive\">{username}</Paragraph>\n        <Paragraph variant=\"sm\" className=\"mt-0! text-xs text-text-positive-weak\">\n          {email}\n        </Paragraph>\n      </Flex>\n    </Flex>\n  );\n};\n"],"mappings":"8TA6BA,MAAaA,GAAmD,CAAE,OAAM,WAAU,WAE9E,EAAC,EAAA,CAAK,YAAU,eAAe,KAAM,GAAO,IAAI,KAAK,QAAQ,iBAC3D,EAAC,EAAA,CAAO,UAAU,+BAChB,EAAC,EAAA,CAAe,MAAO,CAAE,gBAAiB,EAAe,IAAI,EAAK,CAAE,UAClE,EAAC,EAAA,CAAc,KAAM,GAAI,UAAU,cAAe,EACnC,EACV,CACT,EAAC,EAAA,CAAK,SAAA,GAAS,QAAQ,OAAO,IAAI,OAAO,MAAM,kBAC7C,EAAC,EAAA,CAAU,UAAU,kDAA0C,GAAqB,CACpF,EAAC,EAAA,CAAU,QAAQ,KAAK,UAAU,iDAC/B,GACS,CAAA,EACP,CAAA,EACF"}

package/dist/dialogs/confirm-dialog.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require(`../chunk-350yNsax.cjs`);require(`../button.variants-4kw6plrv.cjs`),require(`../heading-tGTqk3pA.cjs`),require(`../paragraph-DvTZvbzw.cjs`);const t=require(`../ui/alert-dialog.cjs`);let n=require(`lucide-react`),r=require(`react`),i=require(`react/jsx-runtime`);const a=({open:e,isLoading:a=!1,title:o,description:s,cancelText:c=`Cancel`,submitText:l=`Confirm`,descriptionClassName:u,onOpenChange:d,onConfirm:f})=>{let p=(0,r.useCallback)(e=>{e.preventDefault(),e.stopPropagation(),f?.()},[f]);return(0,i.jsx)(t.AlertDialog,{open:e,onOpenChange:d,children:(0,i.jsxs)(t.AlertDialogContent,{className:`p-4 pb-5`,children:[(0,i.jsxs)(t.AlertDialogHeader,{className:`gap-2`,children:[(0,i.jsxs)(t.AlertDialogTitle,{className:`inline-flex items-center gap-x-1`,children:[(0,i.jsx)(n.TriangleAlert,{size:20}),(0,i.jsx)(`p`,{children:o})]}),(0,i.jsx)(t.AlertDialogDescription,{className:u,children:s})]}),(0,i.jsxs)(t.AlertDialogFooter,{children:[(0,i.jsx)(t.AlertDialogCancel,{children:c}),(0,i.jsx)(t.AlertDialogAction,{type:`button`,className:`min-h-9 w-full md:w-24`,onClick:p,children:a?(0,i.jsx)(`div`,{className:`absolute inset-0 flex items-center justify-center`,children:(0,i.jsx)(`div`,{className:`loader-spinner text-text-positive-weak`})}):l})]})]})})};exports.ConfirmDialog=a;
+"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);require(`../button.variants-DgVFNsVc.cjs`),require(`../heading-BX7ZVnVg.cjs`),require(`../paragraph-D0x3Jc6W.cjs`);const t=require(`../ui/alert-dialog.cjs`);let n=require(`lucide-react`),r=require(`react/jsx-runtime`),i=require(`react`);const a=({open:e,isLoading:a=!1,title:o,description:s,cancelText:c=`Cancel`,submitText:l=`Confirm`,descriptionClassName:u,onOpenChange:d,onConfirm:f})=>{let p=(0,i.useCallback)(e=>{e.preventDefault(),e.stopPropagation(),f?.()},[f]);return(0,r.jsx)(t.AlertDialog,{open:e,onOpenChange:d,children:(0,r.jsxs)(t.AlertDialogContent,{className:`p-4 pb-5`,children:[(0,r.jsxs)(t.AlertDialogHeader,{className:`gap-2`,children:[(0,r.jsxs)(t.AlertDialogTitle,{className:`inline-flex items-center gap-x-1`,children:[(0,r.jsx)(n.TriangleAlert,{size:20}),(0,r.jsx)(`p`,{children:o})]}),(0,r.jsx)(t.AlertDialogDescription,{className:u,children:s})]}),(0,r.jsxs)(t.AlertDialogFooter,{children:[(0,r.jsx)(t.AlertDialogCancel,{children:c}),(0,r.jsx)(t.AlertDialogAction,{type:`button`,className:`min-h-9 w-full md:w-24`,onClick:p,children:a?(0,r.jsx)(`div`,{className:`absolute inset-0 flex items-center justify-center`,children:(0,r.jsx)(`div`,{className:`loader-spinner text-text-positive-weak`})}):l})]})]})})};exports.ConfirmDialog=a;
 //# sourceMappingURL=confirm-dialog.cjs.map

package/dist/dialogs/confirm-dialog.js

@@ -1,2 +1,2 @@
-"use client";import"../button.variants-CoSpd71B.js";import"../heading-Bz-hSatD.js";import"../paragraph-Cc13ZI4d.js";import{AlertDialog as e,AlertDialogAction as t,AlertDialogCancel as n,AlertDialogContent as r,AlertDialogDescription as i,AlertDialogFooter as a,AlertDialogHeader as o,AlertDialogTitle as s}from"../ui/alert-dialog.js";import{TriangleAlert as c}from"lucide-react";import{useCallback as l}from"react";import{jsx as u,jsxs as d}from"react/jsx-runtime";const f=({open:f,isLoading:p=!1,title:m,description:h,cancelText:g=`Cancel`,submitText:_=`Confirm`,descriptionClassName:v,onOpenChange:y,onConfirm:b})=>{let x=l(e=>{e.preventDefault(),e.stopPropagation(),b?.()},[b]);return u(e,{open:f,onOpenChange:y,children:d(r,{className:`p-4 pb-5`,children:[d(o,{className:`gap-2`,children:[d(s,{className:`inline-flex items-center gap-x-1`,children:[u(c,{size:20}),u(`p`,{children:m})]}),u(i,{className:v,children:h})]}),d(a,{children:[u(n,{children:g}),u(t,{type:`button`,className:`min-h-9 w-full md:w-24`,onClick:x,children:p?u(`div`,{className:`absolute inset-0 flex items-center justify-center`,children:u(`div`,{className:`loader-spinner text-text-positive-weak`})}):_})]})]})})};export{f as ConfirmDialog};
+"use client";import"../button.variants-BruXd4VM.js";import"../heading-Bw3eo6IT.js";import"../paragraph-ESjXXqHU.js";import{AlertDialog as e,AlertDialogAction as t,AlertDialogCancel as n,AlertDialogContent as r,AlertDialogDescription as i,AlertDialogFooter as a,AlertDialogHeader as o,AlertDialogTitle as s}from"../ui/alert-dialog.js";import{TriangleAlert as c}from"lucide-react";import{jsx as l,jsxs as u}from"react/jsx-runtime";import{useCallback as d}from"react";const f=({open:f,isLoading:p=!1,title:m,description:h,cancelText:g=`Cancel`,submitText:_=`Confirm`,descriptionClassName:v,onOpenChange:y,onConfirm:b})=>{let x=d(e=>{e.preventDefault(),e.stopPropagation(),b?.()},[b]);return l(e,{open:f,onOpenChange:y,children:u(r,{className:`p-4 pb-5`,children:[u(o,{className:`gap-2`,children:[u(s,{className:`inline-flex items-center gap-x-1`,children:[l(c,{size:20}),l(`p`,{children:m})]}),l(i,{className:v,children:h})]}),u(a,{children:[l(n,{children:g}),l(t,{type:`button`,className:`min-h-9 w-full md:w-24`,onClick:x,children:p?l(`div`,{className:`absolute inset-0 flex items-center justify-center`,children:l(`div`,{className:`loader-spinner text-text-positive-weak`})}):_})]})]})})};export{f as ConfirmDialog};
 //# sourceMappingURL=confirm-dialog.js.map

package/dist/dialogs/detail-dialog/components/sidebar.cjs

@@ -1 +1 @@
-"use client";require(`../../../button.variants-4kw6plrv.cjs`),require(`../../../button-C--DAN1D.cjs`),require(`../../../skeleton-CX1USu1w.cjs`),require(`../../../tooltip-CBdoIzoM.cjs`),require(`../../../separator-KuymG9g0.cjs`),require(`../../../sheet-CvKSi0UC.cjs`);const e=require(`../../../sidebar-D5J2gcTw.cjs`);exports.DetailDialogSidebarContent=e.t,exports.DetailDialogSidebarFooter=e.n,exports.DetailDialogSidebarGroup=e.r,exports.DetailDialogSidebarGroupAction=e.i,exports.DetailDialogSidebarGroupContent=e.a,exports.DetailDialogSidebarGroupLabel=e.o,exports.DetailDialogSidebarHeader=e.s,exports.DetailDialogSidebarMenu=e.c,exports.DetailDialogSidebarMenuAction=e.l,exports.DetailDialogSidebarMenuBadge=e.u,exports.DetailDialogSidebarMenuButton=e.d,exports.DetailDialogSidebarMenuItem=e.f,exports.DetailDialogSidebarMenuSkeleton=e.p,exports.DetailDialogSidebarMenuSub=e.m,exports.DetailDialogSidebarMenuSubButton=e.h,exports.DetailDialogSidebarMenuSubItem=e.g,exports.DetailDialogSidebarRail=e._,exports.DetailDialogSidebarSeparator=e.v,exports.DetailDialogSidebarTrigger=e.y,exports.Sidebar=e.b,exports.SidebarInset=e.x,exports.SidebarProvider=e.S,exports.useSidebar=e.C;
+"use client";const e=require(`../../../sidebar-CQZlWCK4.cjs`);exports.DetailDialogSidebarContent=e.t,exports.DetailDialogSidebarFooter=e.n,exports.DetailDialogSidebarGroup=e.r,exports.DetailDialogSidebarGroupAction=e.i,exports.DetailDialogSidebarGroupContent=e.a,exports.DetailDialogSidebarGroupLabel=e.o,exports.DetailDialogSidebarHeader=e.s,exports.DetailDialogSidebarMenu=e.c,exports.DetailDialogSidebarMenuAction=e.l,exports.DetailDialogSidebarMenuBadge=e.u,exports.DetailDialogSidebarMenuButton=e.d,exports.DetailDialogSidebarMenuItem=e.f,exports.DetailDialogSidebarMenuSkeleton=e.p,exports.DetailDialogSidebarMenuSub=e.m,exports.DetailDialogSidebarMenuSubButton=e.h,exports.DetailDialogSidebarMenuSubItem=e.g,exports.DetailDialogSidebarRail=e._,exports.DetailDialogSidebarSeparator=e.v,exports.DetailDialogSidebarTrigger=e.y,exports.Sidebar=e.b,exports.SidebarInset=e.x,exports.SidebarProvider=e.S,exports.useSidebar=e.C;

package/dist/dialogs/detail-dialog/components/sidebar.d.cts

@@ -1,9 +1,9 @@
-import { t as Button } from "../../../button-CRSezlCi.cjs";
-import { Separator } from "../../../ui/separator.cjs";
-import { TooltipContent } from "../../../ui/tooltip.cjs";
-import * as react2 from "react";
+import * as react4 from "react";
 import * as class_variance_authority_types0 from "class-variance-authority/types";
 import { VariantProps } from "class-variance-authority";
+import { Button } from "@/components/ui/button";
+import { Separator } from "@/components/ui/separator";
+import { TooltipContent } from "@/components/ui/tooltip";
 
 //#region packages/components/dialogs/detail-dialog/components/sidebar.d.ts
 type SidebarContextProps = {
@@ -50,7 +50,7 @@ declare function SidebarProvider({
   open?: boolean;
   /** Callback fired when the open state changes in controlled mode. */
   onOpenChange?: (open: boolean) => void;
-}): react2.JSX.Element;
+}): react4.JSX.Element;
 /**
  * Responsive sidebar container that supports desktop icon-collapse and a mobile Sheet overlay.
  *
@@ -77,7 +77,7 @@ declare function Sidebar({
   variant?: 'sidebar' | 'floating' | 'inset';
   /** Collapse behaviour — slides off-canvas, shrinks to icon strip, or stays fixed. Defaults to `'offcanvas'`. */
   collapsible?: 'offcanvas' | 'icon' | 'none';
-}): react2.JSX.Element;
+}): react4.JSX.Element;
 /**
  * Icon button that toggles the detail-dialog sidebar open or collapsed.
  *
@@ -92,62 +92,62 @@ declare function DetailDialogSidebarTrigger({
   className,
   onClick,
   ...props
-}: React.ComponentProps<typeof Button>): react2.JSX.Element;
+}: React.ComponentProps<typeof Button>): react4.JSX.Element;
 declare function DetailDialogSidebarRail({
   className,
   ...props
-}: React.ComponentProps<'button'>): react2.JSX.Element;
+}: React.ComponentProps<'button'>): react4.JSX.Element;
 declare function SidebarInset({
   className,
   ...props
-}: React.ComponentProps<'main'>): react2.JSX.Element;
+}: React.ComponentProps<'main'>): react4.JSX.Element;
 declare function DetailDialogSidebarHeader({
   className,
   ...props
-}: React.ComponentProps<'div'>): react2.JSX.Element;
+}: React.ComponentProps<'div'>): react4.JSX.Element;
 declare function DetailDialogSidebarFooter({
   className,
   children,
   ...props
-}: React.ComponentProps<'div'>): react2.JSX.Element;
+}: React.ComponentProps<'div'>): react4.JSX.Element;
 declare function DetailDialogSidebarSeparator({
   className,
   ...props
-}: React.ComponentProps<typeof Separator>): react2.JSX.Element;
+}: React.ComponentProps<typeof Separator>): react4.JSX.Element;
 declare function DetailDialogSidebarContent({
   className,
   ...props
-}: React.ComponentProps<'div'>): react2.JSX.Element;
+}: React.ComponentProps<'div'>): react4.JSX.Element;
 declare function DetailDialogSidebarGroup({
   className,
   ...props
-}: React.ComponentProps<'div'>): react2.JSX.Element;
+}: React.ComponentProps<'div'>): react4.JSX.Element;
 declare function DetailDialogSidebarGroupLabel({
   className,
   asChild,
   ...props
 }: React.ComponentProps<'div'> & {
   asChild?: boolean;
-}): react2.JSX.Element;
+}): react4.JSX.Element;
 declare function DetailDialogSidebarGroupAction({
   className,
   asChild,
   ...props
 }: React.ComponentProps<'button'> & {
   asChild?: boolean;
-}): react2.JSX.Element;
+}): react4.JSX.Element;
 declare function DetailDialogSidebarGroupContent({
   className,
   ...props
-}: React.ComponentProps<'div'>): react2.JSX.Element;
+}: React.ComponentProps<'div'>): react4.JSX.Element;
 declare function DetailDialogSidebarMenu({
   className,
   ...props
-}: React.ComponentProps<'ul'>): react2.JSX.Element;
+}: React.ComponentProps<'ul'>): react4.JSX.Element;
 declare function DetailDialogSidebarMenuItem({
   className,
   ...props
-}: React.ComponentProps<'li'>): react2.JSX.Element;
+}: React.ComponentProps<'li'>): react4.JSX.Element;
 declare const sidebarMenuButtonVariants: (props?: ({
   variant?: "default" | "outline" | null | undefined;
   size?: "sm" | "lg" | "default" | null | undefined;
@@ -164,7 +164,7 @@ declare function DetailDialogSidebarMenuButton({
   asChild?: boolean;
   isActive?: boolean;
   tooltip?: string | React.ComponentProps<typeof TooltipContent>;
-} & VariantProps<typeof sidebarMenuButtonVariants>): react2.JSX.Element;
+} & VariantProps<typeof sidebarMenuButtonVariants>): react4.JSX.Element;
 declare function DetailDialogSidebarMenuAction({
   className,
   asChild,
@@ -173,26 +173,26 @@ declare function DetailDialogSidebarMenuAction({
 }: React.ComponentProps<'button'> & {
   asChild?: boolean;
   showOnHover?: boolean;
-}): react2.JSX.Element;
+}): react4.JSX.Element;
 declare function DetailDialogSidebarMenuBadge({
   className,
   ...props
-}: React.ComponentProps<'div'>): react2.JSX.Element;
+}: React.ComponentProps<'div'>): react4.JSX.Element;
 declare function DetailDialogSidebarMenuSkeleton({
   className,
   showIcon,
   ...props
 }: React.ComponentProps<'div'> & {
   showIcon?: boolean;
-}): react2.JSX.Element;
+}): react4.JSX.Element;
 declare function DetailDialogSidebarMenuSub({
   className,
   ...props
-}: React.ComponentProps<'ul'>): react2.JSX.Element;
+}: React.ComponentProps<'ul'>): react4.JSX.Element;
 declare function DetailDialogSidebarMenuSubItem({
   className,
   ...props
-}: React.ComponentProps<'li'>): react2.JSX.Element;
+}: React.ComponentProps<'li'>): react4.JSX.Element;
 declare function DetailDialogSidebarMenuSubButton({
   asChild,
   size,
@@ -203,7 +203,7 @@ declare function DetailDialogSidebarMenuSubButton({
   asChild?: boolean;
   size?: 'sm' | 'md';
   isActive?: boolean;
-}): react2.JSX.Element;
+}): react4.JSX.Element;
 //#endregion
 export { DetailDialogSidebarContent, DetailDialogSidebarFooter, DetailDialogSidebarGroup, DetailDialogSidebarGroupAction, DetailDialogSidebarGroupContent, DetailDialogSidebarGroupLabel, DetailDialogSidebarHeader, DetailDialogSidebarMenu, DetailDialogSidebarMenuAction, DetailDialogSidebarMenuBadge, DetailDialogSidebarMenuButton, DetailDialogSidebarMenuItem, DetailDialogSidebarMenuSkeleton, DetailDialogSidebarMenuSub, DetailDialogSidebarMenuSubButton, DetailDialogSidebarMenuSubItem, DetailDialogSidebarRail, DetailDialogSidebarSeparator, DetailDialogSidebarTrigger, Sidebar, SidebarInset, SidebarProvider, useSidebar };
 //# sourceMappingURL=sidebar.d.cts.map

package/dist/dialogs/detail-dialog/components/sidebar.d.ts

@@ -1,8 +1,8 @@
-import { t as Button } from "../../../button-DloFFxkz.js";
-import { Separator } from "../../../ui/separator.js";
-import { TooltipContent } from "../../../ui/tooltip.js";
-import * as react3 from "react";
 import { VariantProps } from "class-variance-authority";
+import * as react6 from "react";
+import { TooltipContent } from "@/components/ui/tooltip";
+import { Button } from "@/components/ui/button";
+import { Separator } from "@/components/ui/separator";
 import * as class_variance_authority_types0 from "class-variance-authority/types";
 
 //#region packages/components/dialogs/detail-dialog/components/sidebar.d.ts
@@ -50,7 +50,7 @@ declare function SidebarProvider({
   open?: boolean;
   /** Callback fired when the open state changes in controlled mode. */
   onOpenChange?: (open: boolean) => void;
-}): react3.JSX.Element;
+}): react6.JSX.Element;
 /**
  * Responsive sidebar container that supports desktop icon-collapse and a mobile Sheet overlay.
  *
@@ -77,7 +77,7 @@ declare function Sidebar({
   variant?: 'sidebar' | 'floating' | 'inset';
   /** Collapse behaviour — slides off-canvas, shrinks to icon strip, or stays fixed. Defaults to `'offcanvas'`. */
   collapsible?: 'offcanvas' | 'icon' | 'none';
-}): react3.JSX.Element;
+}): react6.JSX.Element;
 /**
  * Icon button that toggles the detail-dialog sidebar open or collapsed.
  *
@@ -92,62 +92,62 @@ declare function DetailDialogSidebarTrigger({
   className,
   onClick,
   ...props
-}: React.ComponentProps<typeof Button>): react3.JSX.Element;
+}: React.ComponentProps<typeof Button>): react6.JSX.Element;
 declare function DetailDialogSidebarRail({
   className,
   ...props
-}: React.ComponentProps<'button'>): react3.JSX.Element;
+}: React.ComponentProps<'button'>): react6.JSX.Element;
 declare function SidebarInset({
   className,
   ...props
-}: React.ComponentProps<'main'>): react3.JSX.Element;
+}: React.ComponentProps<'main'>): react6.JSX.Element;
 declare function DetailDialogSidebarHeader({
   className,
   ...props
-}: React.ComponentProps<'div'>): react3.JSX.Element;
+}: React.ComponentProps<'div'>): react6.JSX.Element;
 declare function DetailDialogSidebarFooter({
   className,
   children,
   ...props
-}: React.ComponentProps<'div'>): react3.JSX.Element;
+}: React.ComponentProps<'div'>): react6.JSX.Element;
 declare function DetailDialogSidebarSeparator({
   className,
   ...props
-}: React.ComponentProps<typeof Separator>): react3.JSX.Element;
+}: React.ComponentProps<typeof Separator>): react6.JSX.Element;
 declare function DetailDialogSidebarContent({
   className,
   ...props
-}: React.ComponentProps<'div'>): react3.JSX.Element;
+}: React.ComponentProps<'div'>): react6.JSX.Element;
 declare function DetailDialogSidebarGroup({
   className,
   ...props
-}: React.ComponentProps<'div'>): react3.JSX.Element;
+}: React.ComponentProps<'div'>): react6.JSX.Element;
 declare function DetailDialogSidebarGroupLabel({
   className,
   asChild,
   ...props
 }: React.ComponentProps<'div'> & {
   asChild?: boolean;
-}): react3.JSX.Element;
+}): react6.JSX.Element;
 declare function DetailDialogSidebarGroupAction({
   className,
   asChild,
   ...props
 }: React.ComponentProps<'button'> & {
   asChild?: boolean;
-}): react3.JSX.Element;
+}): react6.JSX.Element;
 declare function DetailDialogSidebarGroupContent({
   className,
   ...props
-}: React.ComponentProps<'div'>): react3.JSX.Element;
+}: React.ComponentProps<'div'>): react6.JSX.Element;
 declare function DetailDialogSidebarMenu({
   className,
   ...props
-}: React.ComponentProps<'ul'>): react3.JSX.Element;
+}: React.ComponentProps<'ul'>): react6.JSX.Element;
 declare function DetailDialogSidebarMenuItem({
   className,
   ...props
-}: React.ComponentProps<'li'>): react3.JSX.Element;
+}: React.ComponentProps<'li'>): react6.JSX.Element;
 declare const sidebarMenuButtonVariants: (props?: ({
   variant?: "default" | "outline" | null | undefined;
   size?: "sm" | "lg" | "default" | null | undefined;
@@ -164,7 +164,7 @@ declare function DetailDialogSidebarMenuButton({
   asChild?: boolean;
   isActive?: boolean;
   tooltip?: string | React.ComponentProps<typeof TooltipContent>;
-} & VariantProps<typeof sidebarMenuButtonVariants>): react3.JSX.Element;
+} & VariantProps<typeof sidebarMenuButtonVariants>): react6.JSX.Element;
 declare function DetailDialogSidebarMenuAction({
   className,
   asChild,
@@ -173,26 +173,26 @@ declare function DetailDialogSidebarMenuAction({
 }: React.ComponentProps<'button'> & {
   asChild?: boolean;
   showOnHover?: boolean;
-}): react3.JSX.Element;
+}): react6.JSX.Element;
 declare function DetailDialogSidebarMenuBadge({
   className,
   ...props
-}: React.ComponentProps<'div'>): react3.JSX.Element;
+}: React.ComponentProps<'div'>): react6.JSX.Element;
 declare function DetailDialogSidebarMenuSkeleton({
   className,
   showIcon,
   ...props
 }: React.ComponentProps<'div'> & {
   showIcon?: boolean;
-}): react3.JSX.Element;
+}): react6.JSX.Element;
 declare function DetailDialogSidebarMenuSub({
   className,
   ...props
-}: React.ComponentProps<'ul'>): react3.JSX.Element;
+}: React.ComponentProps<'ul'>): react6.JSX.Element;
 declare function DetailDialogSidebarMenuSubItem({
   className,
   ...props
-}: React.ComponentProps<'li'>): react3.JSX.Element;
+}: React.ComponentProps<'li'>): react6.JSX.Element;
 declare function DetailDialogSidebarMenuSubButton({
   asChild,
   size,
@@ -203,7 +203,7 @@ declare function DetailDialogSidebarMenuSubButton({
   asChild?: boolean;
   size?: 'sm' | 'md';
   isActive?: boolean;
-}): react3.JSX.Element;
+}): react6.JSX.Element;
 //#endregion
 export { DetailDialogSidebarContent, DetailDialogSidebarFooter, DetailDialogSidebarGroup, DetailDialogSidebarGroupAction, DetailDialogSidebarGroupContent, DetailDialogSidebarGroupLabel, DetailDialogSidebarHeader, DetailDialogSidebarMenu, DetailDialogSidebarMenuAction, DetailDialogSidebarMenuBadge, DetailDialogSidebarMenuButton, DetailDialogSidebarMenuItem, DetailDialogSidebarMenuSkeleton, DetailDialogSidebarMenuSub, DetailDialogSidebarMenuSubButton, DetailDialogSidebarMenuSubItem, DetailDialogSidebarRail, DetailDialogSidebarSeparator, DetailDialogSidebarTrigger, Sidebar, SidebarInset, SidebarProvider, useSidebar };
 //# sourceMappingURL=sidebar.d.ts.map

package/dist/dialogs/detail-dialog/components/sidebar.js

@@ -1 +1 @@
-"use client";import"../../../button.variants-CoSpd71B.js";import"../../../button-LMMbL-uH.js";import"../../../skeleton-DlRDNM97.js";import"../../../tooltip-CVIl6Hln.js";import"../../../separator-BM8hA4DP.js";import"../../../sheet-DGXXYgWB.js";import{C as e,S as t,_ as n,a as r,b as i,c as a,d as o,f as s,g as c,h as l,i as u,l as d,m as f,n as p,o as m,p as h,r as g,s as _,t as v,u as y,v as b,x,y as S}from"../../../sidebar-BDrsbzo5.js";export{v as DetailDialogSidebarContent,p as DetailDialogSidebarFooter,g as DetailDialogSidebarGroup,u as DetailDialogSidebarGroupAction,r as DetailDialogSidebarGroupContent,m as DetailDialogSidebarGroupLabel,_ as DetailDialogSidebarHeader,a as DetailDialogSidebarMenu,d as DetailDialogSidebarMenuAction,y as DetailDialogSidebarMenuBadge,o as DetailDialogSidebarMenuButton,s as DetailDialogSidebarMenuItem,h as DetailDialogSidebarMenuSkeleton,f as DetailDialogSidebarMenuSub,l as DetailDialogSidebarMenuSubButton,c as DetailDialogSidebarMenuSubItem,n as DetailDialogSidebarRail,b as DetailDialogSidebarSeparator,S as DetailDialogSidebarTrigger,i as Sidebar,x as SidebarInset,t as SidebarProvider,e as useSidebar};
+"use client";import{C as e,S as t,_ as n,a as r,b as i,c as a,d as o,f as s,g as c,h as l,i as u,l as d,m as f,n as p,o as m,p as h,r as g,s as _,t as v,u as y,v as b,x,y as S}from"../../../sidebar-BCuXtop_.js";export{v as DetailDialogSidebarContent,p as DetailDialogSidebarFooter,g as DetailDialogSidebarGroup,u as DetailDialogSidebarGroupAction,r as DetailDialogSidebarGroupContent,m as DetailDialogSidebarGroupLabel,_ as DetailDialogSidebarHeader,a as DetailDialogSidebarMenu,d as DetailDialogSidebarMenuAction,y as DetailDialogSidebarMenuBadge,o as DetailDialogSidebarMenuButton,s as DetailDialogSidebarMenuItem,h as DetailDialogSidebarMenuSkeleton,f as DetailDialogSidebarMenuSub,l as DetailDialogSidebarMenuSubButton,c as DetailDialogSidebarMenuSubItem,n as DetailDialogSidebarRail,b as DetailDialogSidebarSeparator,S as DetailDialogSidebarTrigger,i as Sidebar,x as SidebarInset,t as SidebarProvider,e as useSidebar};

package/dist/dialogs/detail-dialog/index.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require(`../../chunk-350yNsax.cjs`);require(`../../button.variants-4kw6plrv.cjs`),require(`../../button-C--DAN1D.cjs`),require(`../../skeleton-CX1USu1w.cjs`);const t=require(`../../flex-DmWmOBn5.cjs`),n=require(`../../date-D4NVl6C9.cjs`);require(`../../tooltip-CBdoIzoM.cjs`);const r=require(`../../typography/title.cjs`);require(`../../separator-KuymG9g0.cjs`),require(`../../sheet-CvKSi0UC.cjs`);const i=require(`../../sidebar-D5J2gcTw.cjs`);let a=require(`lucide-react`),o=require(`react`),s=require(`@customafk/react-toolkit/utils`),c=require(`react/jsx-runtime`),l=require(`radix-ui`);const u=({open:e,isLoading:u,title:d,createdAt:f,onOpenChange:p,sidebar:m,children:h})=>{let{content:g,footer:_}=m||{},v=(0,o.useCallback)(e=>{e.preventDefault(),e.stopPropagation()},[]);return(0,c.jsx)(l.Dialog.Root,{"data-slot":`detail-dialog`,open:e,onOpenChange:p,children:(0,c.jsxs)(l.Dialog.Portal,{"data-slot":`detail-dialog-portal`,children:[(0,c.jsx)(l.Dialog.Overlay,{"data-slot":`detail-dialog-overlay`,className:`fixed inset-0 z-50 bg-black/50 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0`}),(0,c.jsx)(`div`,{className:`fixed inset-0 z-50 flex items-center justify-center`,children:(0,c.jsxs)(l.Dialog.Content,{"data-slot":`dialog-content`,className:(0,s.cn)(`data-[state=open]:animate-in data-[state=closed]:animate-out`,`data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0`,`data-[state=closed]:zoom-out-80 data-[state=open]:zoom-in-80`,`relative z-50 grid`,`gap-4 overflow-hidden rounded-none border-none bg-background p-0 shadow-dialog outline-none duration-200`,`h-full max-h-dvh w-full max-w-svw`,`sm:rounded-lg`,`sm:max-w-lg`,`md:max-h-[calc(100dvh-2rem)]`,`md:max-w-[calc(100svw-2rem)]`),onInteractOutside:v,children:[(0,c.jsxs)(i.S,{children:[(0,c.jsxs)(i.b,{collapsible:`icon`,children:[(0,c.jsx)(i.s,{children:(0,c.jsx)(i.c,{children:(0,c.jsx)(i.f,{children:(0,c.jsxs)(i.d,{size:`lg`,tabIndex:-1,children:[(0,c.jsx)(`div`,{className:`flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground`,children:(0,c.jsx)(a.CatIcon,{size:16})}),(0,c.jsxs)(`div`,{className:`grid flex-1 text-left text-sm leading-tight`,children:[(0,c.jsx)(`span`,{className:`truncate font-medium`,children:m?.title||`Detail Dialog`}),(0,c.jsx)(`span`,{className:`truncate text-xs`,children:`Lunas Enterprise`})]})]})})})}),(0,c.jsx)(i.t,{children:g}),(0,c.jsx)(i.n,{children:_})]}),(0,c.jsx)(`main`,{"data-slot":`detail-dialog-main`,className:`relative h-full flex-1`,children:(0,c.jsxs)(t.t,{padding:`none`,gap:`none`,vertical:!0,align:`stretch`,className:`absolute inset-0 size-full`,children:[(0,c.jsxs)(`header`,{className:`flex w-full flex-0 items-start gap-x-2.5 border-b border-border-weak bg-card py-2.5 pr-12 pl-2`,children:[(0,c.jsx)(i.y,{}),(0,c.jsxs)(t.t,{vertical:!0,align:`start`,padding:`none`,width:`null`,wrap:!1,className:`flex-1 gap-0`,children:[(0,c.jsx)(r.Title,{level:5,className:`line-clamp-1 truncate text-wrap`,children:d||`Detail Dialog`}),!!f&&(0,c.jsxs)(t.t,{padding:`none`,className:`relative items-center text-text-positive-weak`,children:[(0,c.jsx)(a.CalendarIcon,{size:12}),(0,c.jsx)(n.t,{showTime:!0,showHoliday:!0,date:f,format:`full`})]})]})]}),u?(0,c.jsx)(t.t,{justify:`center`,className:`inset-shadow-sm w-full flex-1 bg-muted-muted`,children:(0,c.jsx)(`div`,{className:`loader`})}):(0,c.jsx)(`section`,{"data-slot":`detail-dialog-body`,className:`relative inset-shadow-sm flex flex-1 snap-y flex-col gap-0 overflow-y-auto bg-white`,children:h})]})})]}),(0,c.jsx)(l.Dialog.Close,{"data-slot":`dialog-close`,tabIndex:-1,asChild:!0,className:`absolute top-3 right-3`,children:(0,c.jsx)(`button`,{className:`flex cursor-pointer items-center justify-center rounded-full p-2 text-text-positive-weak transition-colors hover:bg-muted-muted hover:text-text-positive active:bg-muted-weak active:text-text-positive-strong disabled:pointer-events-none disabled:opacity-60`,children:(0,c.jsx)(a.XIcon,{size:24})})})]})})]})})};exports.DetailDialog=u;
+"use client";const e=require(`../../chunk-Bmb41Sf3.cjs`),t=require(`../../sidebar-CQZlWCK4.cjs`);let n=require(`lucide-react`),r=require(`@customafk/react-toolkit/utils`),i=require(`react/jsx-runtime`),a=require(`react`),o=require(`radix-ui`),s=require(`@/components/data-display/date`),c=require(`@/components/layouts/flex`),l=require(`@/components/typography/title`);const u=({open:e,isLoading:u,title:d,createdAt:f,onOpenChange:p,sidebar:m,children:h})=>{let{content:g,footer:_}=m||{},v=(0,a.useCallback)(e=>{e.preventDefault(),e.stopPropagation()},[]);return(0,i.jsx)(o.Dialog.Root,{"data-slot":`detail-dialog`,open:e,onOpenChange:p,children:(0,i.jsxs)(o.Dialog.Portal,{"data-slot":`detail-dialog-portal`,children:[(0,i.jsx)(o.Dialog.Overlay,{"data-slot":`detail-dialog-overlay`,className:`fixed inset-0 z-50 bg-black/50 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0`}),(0,i.jsx)(`div`,{className:`fixed inset-0 z-50 flex items-center justify-center`,children:(0,i.jsxs)(o.Dialog.Content,{"data-slot":`dialog-content`,className:(0,r.cn)(`data-[state=open]:animate-in data-[state=closed]:animate-out`,`data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0`,`data-[state=closed]:zoom-out-80 data-[state=open]:zoom-in-80`,`relative z-50 grid`,`gap-4 overflow-hidden rounded-none border-none bg-background p-0 shadow-dialog outline-none duration-200`,`h-full max-h-dvh w-full max-w-svw`,`sm:rounded-lg`,`sm:max-w-lg`,`md:max-h-[calc(100dvh-2rem)]`,`md:max-w-[calc(100svw-2rem)]`),onInteractOutside:v,children:[(0,i.jsxs)(t.S,{children:[(0,i.jsxs)(t.b,{collapsible:`icon`,children:[(0,i.jsx)(t.s,{children:(0,i.jsx)(t.c,{children:(0,i.jsx)(t.f,{children:(0,i.jsxs)(t.d,{size:`lg`,tabIndex:-1,children:[(0,i.jsx)(`div`,{className:`flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground`,children:(0,i.jsx)(n.CatIcon,{size:16})}),(0,i.jsxs)(`div`,{className:`grid flex-1 text-left text-sm leading-tight`,children:[(0,i.jsx)(`span`,{className:`truncate font-medium`,children:m?.title||`Detail Dialog`}),(0,i.jsx)(`span`,{className:`truncate text-xs`,children:`Lunas Enterprise`})]})]})})})}),(0,i.jsx)(t.t,{children:g}),(0,i.jsx)(t.n,{children:_})]}),(0,i.jsx)(`main`,{"data-slot":`detail-dialog-main`,className:`relative h-full flex-1`,children:(0,i.jsxs)(c.Flex,{padding:`none`,gap:`none`,vertical:!0,align:`stretch`,className:`absolute inset-0 size-full`,children:[(0,i.jsxs)(`header`,{className:`flex w-full flex-0 items-start gap-x-2.5 border-b border-border-weak bg-card py-2.5 pr-12 pl-2`,children:[(0,i.jsx)(t.y,{}),(0,i.jsxs)(c.Flex,{vertical:!0,align:`start`,padding:`none`,width:`null`,wrap:!1,className:`flex-1 gap-0`,children:[(0,i.jsx)(l.Title,{level:5,className:`line-clamp-1 truncate text-wrap`,children:d||`Detail Dialog`}),!!f&&(0,i.jsxs)(c.Flex,{padding:`none`,className:`relative items-center text-text-positive-weak`,children:[(0,i.jsx)(n.CalendarIcon,{size:12}),(0,i.jsx)(s.DateDisplay,{showTime:!0,showHoliday:!0,date:f,format:`full`})]})]})]}),u?(0,i.jsx)(c.Flex,{justify:`center`,className:`inset-shadow-sm w-full flex-1 bg-muted-muted`,children:(0,i.jsx)(`div`,{className:`loader`})}):(0,i.jsx)(`section`,{"data-slot":`detail-dialog-body`,className:`relative inset-shadow-sm flex flex-1 snap-y flex-col gap-0 overflow-y-auto bg-white`,children:h})]})})]}),(0,i.jsx)(o.Dialog.Close,{"data-slot":`dialog-close`,tabIndex:-1,asChild:!0,className:`absolute top-3 right-3`,children:(0,i.jsx)(`button`,{className:`flex cursor-pointer items-center justify-center rounded-full p-2 text-text-positive-weak transition-colors hover:bg-muted-muted hover:text-text-positive active:bg-muted-weak active:text-text-positive-strong disabled:pointer-events-none disabled:opacity-60`,children:(0,i.jsx)(n.XIcon,{size:24})})})]})})]})})};exports.DetailDialog=u;
 //# sourceMappingURL=index.cjs.map

package/dist/dialogs/detail-dialog/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["DetailDialog: React.FC<React.PropsWithChildren<DetailDialogProps>>","DialogPrimitive","SidebarProvider","Sidebar","DetailDialogSidebarHeader","DetailDialogSidebarMenu","DetailDialogSidebarMenuItem","DetailDialogSidebarMenuButton","CatIcon","DetailDialogSidebarContent","DetailDialogSidebarFooter","Flex","DetailDialogSidebarTrigger","Title","CalendarIcon","DateDisplay","XIcon"],"sources":["../../../packages/components/dialogs/detail-dialog/index.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback } from 'react';\n\nimport { CalendarIcon, CatIcon, XIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\nimport { Dialog as DialogPrimitive } from 'radix-ui';\n\nimport { DateDisplay } from '@/components/data-display/date';\nimport { Flex } from '@/components/layouts/flex';\nimport { Title } from '@/components/typography/title';\n\nimport {\n  DetailDialogSidebarContent,\n  DetailDialogSidebarFooter,\n  DetailDialogSidebarHeader,\n  DetailDialogSidebarMenu,\n  DetailDialogSidebarMenuButton,\n  DetailDialogSidebarMenuItem,\n  DetailDialogSidebarTrigger,\n  Sidebar,\n  SidebarProvider,\n} from './components/sidebar';\n\ntype DetailDialogSidebar = {\n  /** Title shown in the collapsible sidebar header. Defaults to `'Detail Dialog'`. */\n  title?: string;\n  /** Arbitrary content rendered inside the sidebar scrollable area. */\n  content?: React.ReactNode;\n  /** Arbitrary content rendered at the bottom of the sidebar footer. */\n  footer?: React.ReactNode;\n};\n\nexport type DetailDialogProps = {\n  /** Controls whether the dialog is open. */\n  open?: boolean;\n  /** When `true`, replaces the main content area with a centered loading spinner. */\n  isLoading?: boolean;\n  /** Primary title displayed in the dialog header. */\n  title: string;\n  /** ISO string, `Date` object, or Unix timestamp shown as a formatted creation date below the title. */\n  createdAt?: string | Date | number | null;\n  /** Optional sidebar configuration — title, body content, and footer content. */\n  sidebar?: DetailDialogSidebar;\n  /** Callback invoked when the dialog open state changes. */\n  onOpenChange?: (open: boolean) => void;\n};\n\n/**\n * Full-screen detail dialog with a collapsible sidebar, a header with creation date, and a scrollable content area.\n *\n * @example\n * ```tsx\n * import { DetailDialog } from '@customafk/lunas-ui/dialogs/detail-dialog';\n *\n * <DetailDialog\n *   open={open}\n *   title=\"Order #1234\"\n *   createdAt=\"2024-01-15T09:00:00Z\"\n *   sidebar={{ title: 'Navigation', content: <nav>...</nav> }}\n *   onOpenChange={setOpen}\n * >\n *   <p>Detail content goes here.</p>\n * </DetailDialog>\n * ```\n */\nexport const DetailDialog: React.FC<React.PropsWithChildren<DetailDialogProps>> = ({ open, isLoading, title, createdAt, onOpenChange, sidebar, children }) => {\n  const { content: SidebarContent, footer: SidebarFooter } = sidebar || {};\n\n  const handleInteractOutside = useCallback<NonNullable<React.ComponentProps<typeof DialogPrimitive.Content>['onInteractOutside']>>(event => {\n    event.preventDefault();\n    event.stopPropagation();\n  }, []);\n\n  return (\n    <DialogPrimitive.Root data-slot=\"detail-dialog\" open={open} onOpenChange={onOpenChange}>\n      <DialogPrimitive.Portal data-slot=\"detail-dialog-portal\">\n        <DialogPrimitive.Overlay\n          data-slot=\"detail-dialog-overlay\"\n          className=\"fixed inset-0 z-50 bg-black/50 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\"\n        />\n        <div className=\"fixed inset-0 z-50 flex items-center justify-center\">\n          <DialogPrimitive.Content\n            data-slot=\"dialog-content\"\n            className={cn(\n              'data-[state=open]:animate-in data-[state=closed]:animate-out',\n              'data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n              'data-[state=closed]:zoom-out-80 data-[state=open]:zoom-in-80',\n              'relative z-50 grid',\n              'gap-4 overflow-hidden rounded-none border-none bg-background p-0 shadow-dialog outline-none duration-200',\n              'h-full max-h-dvh w-full max-w-svw',\n              'sm:rounded-lg',\n              'sm:max-w-lg',\n              'md:max-h-[calc(100dvh-2rem)]',\n              'md:max-w-[calc(100svw-2rem)]'\n            )}\n            onInteractOutside={handleInteractOutside}\n          >\n            <SidebarProvider>\n              <Sidebar collapsible=\"icon\">\n                <DetailDialogSidebarHeader>\n                  <DetailDialogSidebarMenu>\n                    <DetailDialogSidebarMenuItem>\n                      <DetailDialogSidebarMenuButton size=\"lg\" tabIndex={-1}>\n                        <div className=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n                          <CatIcon size={16} />\n                        </div>\n                        <div className=\"grid flex-1 text-left text-sm leading-tight\">\n                          <span className=\"truncate font-medium\">{sidebar?.title || 'Detail Dialog'}</span>\n                          <span className=\"truncate text-xs\">Lunas Enterprise</span>\n                        </div>\n                      </DetailDialogSidebarMenuButton>\n                    </DetailDialogSidebarMenuItem>\n                  </DetailDialogSidebarMenu>\n                </DetailDialogSidebarHeader>\n                <DetailDialogSidebarContent>{SidebarContent}</DetailDialogSidebarContent>\n                <DetailDialogSidebarFooter>{SidebarFooter}</DetailDialogSidebarFooter>\n              </Sidebar>\n\n              <main data-slot=\"detail-dialog-main\" className=\"relative h-full flex-1\">\n                <Flex padding=\"none\" gap=\"none\" vertical align=\"stretch\" className=\"absolute inset-0 size-full\">\n                  <header className=\"flex w-full flex-0 items-start gap-x-2.5 border-b border-border-weak bg-card py-2.5 pr-12 pl-2\">\n                    <DetailDialogSidebarTrigger />\n                    <Flex vertical align=\"start\" padding=\"none\" width=\"null\" wrap={false} className=\"flex-1 gap-0\">\n                      <Title level={5} className=\"line-clamp-1 truncate text-wrap\">\n                        {title || 'Detail Dialog'}\n                      </Title>\n                      {!!createdAt && (\n                        <Flex padding=\"none\" className=\"relative items-center text-text-positive-weak\">\n                          <CalendarIcon size={12} />\n                          <DateDisplay showTime showHoliday date={createdAt} format=\"full\" />\n                        </Flex>\n                      )}\n                    </Flex>\n                  </header>\n                  {isLoading ? (\n                    <Flex justify=\"center\" className=\"inset-shadow-sm w-full flex-1 bg-muted-muted\">\n                      <div className=\"loader\" />\n                    </Flex>\n                  ) : (\n                    <section data-slot=\"detail-dialog-body\" className=\"relative inset-shadow-sm flex flex-1 snap-y flex-col gap-0 overflow-y-auto bg-white\">\n                      {children}\n                    </section>\n                  )}\n                </Flex>\n              </main>\n            </SidebarProvider>\n\n            <DialogPrimitive.Close data-slot=\"dialog-close\" tabIndex={-1} asChild className=\"absolute top-3 right-3\">\n              <button className=\"flex cursor-pointer items-center justify-center rounded-full p-2 text-text-positive-weak transition-colors hover:bg-muted-muted hover:text-text-positive active:bg-muted-weak active:text-text-positive-strong disabled:pointer-events-none disabled:opacity-60\">\n                <XIcon size={24} />\n              </button>\n            </DialogPrimitive.Close>\n          </DialogPrimitive.Content>\n        </div>\n      </DialogPrimitive.Portal>\n    </DialogPrimitive.Root>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"index.cjs","names":["DetailDialog: React.FC<React.PropsWithChildren<DetailDialogProps>>","DialogPrimitive","SidebarProvider","Sidebar","DetailDialogSidebarHeader","DetailDialogSidebarMenu","DetailDialogSidebarMenuItem","DetailDialogSidebarMenuButton","CatIcon","DetailDialogSidebarContent","DetailDialogSidebarFooter","Flex","DetailDialogSidebarTrigger","Title","CalendarIcon","DateDisplay","XIcon"],"sources":["../../../packages/components/dialogs/detail-dialog/index.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback } from 'react';\n\nimport { CalendarIcon, CatIcon, XIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\nimport { Dialog as DialogPrimitive } from 'radix-ui';\n\nimport { DateDisplay } from '@/components/data-display/date';\nimport { Flex } from '@/components/layouts/flex';\nimport { Title } from '@/components/typography/title';\n\nimport {\n  DetailDialogSidebarContent,\n  DetailDialogSidebarFooter,\n  DetailDialogSidebarHeader,\n  DetailDialogSidebarMenu,\n  DetailDialogSidebarMenuButton,\n  DetailDialogSidebarMenuItem,\n  DetailDialogSidebarTrigger,\n  Sidebar,\n  SidebarProvider,\n} from './components/sidebar';\n\ntype DetailDialogSidebar = {\n  /** Title shown in the collapsible sidebar header. Defaults to `'Detail Dialog'`. */\n  title?: string;\n  /** Arbitrary content rendered inside the sidebar scrollable area. */\n  content?: React.ReactNode;\n  /** Arbitrary content rendered at the bottom of the sidebar footer. */\n  footer?: React.ReactNode;\n};\n\nexport type DetailDialogProps = {\n  /** Controls whether the dialog is open. */\n  open?: boolean;\n  /** When `true`, replaces the main content area with a centered loading spinner. */\n  isLoading?: boolean;\n  /** Primary title displayed in the dialog header. */\n  title: string;\n  /** ISO string, `Date` object, or Unix timestamp shown as a formatted creation date below the title. */\n  createdAt?: string | Date | number | null;\n  /** Optional sidebar configuration — title, body content, and footer content. */\n  sidebar?: DetailDialogSidebar;\n  /** Callback invoked when the dialog open state changes. */\n  onOpenChange?: (open: boolean) => void;\n};\n\n/**\n * Full-screen detail dialog with a collapsible sidebar, a header with creation date, and a scrollable content area.\n *\n * @example\n * ```tsx\n * import { DetailDialog } from '@customafk/lunas-ui/dialogs/detail-dialog';\n *\n * <DetailDialog\n *   open={open}\n *   title=\"Order #1234\"\n *   createdAt=\"2024-01-15T09:00:00Z\"\n *   sidebar={{ title: 'Navigation', content: <nav>...</nav> }}\n *   onOpenChange={setOpen}\n * >\n *   <p>Detail content goes here.</p>\n * </DetailDialog>\n * ```\n */\nexport const DetailDialog: React.FC<React.PropsWithChildren<DetailDialogProps>> = ({ open, isLoading, title, createdAt, onOpenChange, sidebar, children }) => {\n  const { content: SidebarContent, footer: SidebarFooter } = sidebar || {};\n\n  const handleInteractOutside = useCallback<NonNullable<React.ComponentProps<typeof DialogPrimitive.Content>['onInteractOutside']>>(event => {\n    event.preventDefault();\n    event.stopPropagation();\n  }, []);\n\n  return (\n    <DialogPrimitive.Root data-slot=\"detail-dialog\" open={open} onOpenChange={onOpenChange}>\n      <DialogPrimitive.Portal data-slot=\"detail-dialog-portal\">\n        <DialogPrimitive.Overlay\n          data-slot=\"detail-dialog-overlay\"\n          className=\"fixed inset-0 z-50 bg-black/50 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\"\n        />\n        <div className=\"fixed inset-0 z-50 flex items-center justify-center\">\n          <DialogPrimitive.Content\n            data-slot=\"dialog-content\"\n            className={cn(\n              'data-[state=open]:animate-in data-[state=closed]:animate-out',\n              'data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n              'data-[state=closed]:zoom-out-80 data-[state=open]:zoom-in-80',\n              'relative z-50 grid',\n              'gap-4 overflow-hidden rounded-none border-none bg-background p-0 shadow-dialog outline-none duration-200',\n              'h-full max-h-dvh w-full max-w-svw',\n              'sm:rounded-lg',\n              'sm:max-w-lg',\n              'md:max-h-[calc(100dvh-2rem)]',\n              'md:max-w-[calc(100svw-2rem)]'\n            )}\n            onInteractOutside={handleInteractOutside}\n          >\n            <SidebarProvider>\n              <Sidebar collapsible=\"icon\">\n                <DetailDialogSidebarHeader>\n                  <DetailDialogSidebarMenu>\n                    <DetailDialogSidebarMenuItem>\n                      <DetailDialogSidebarMenuButton size=\"lg\" tabIndex={-1}>\n                        <div className=\"flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground\">\n                          <CatIcon size={16} />\n                        </div>\n                        <div className=\"grid flex-1 text-left text-sm leading-tight\">\n                          <span className=\"truncate font-medium\">{sidebar?.title || 'Detail Dialog'}</span>\n                          <span className=\"truncate text-xs\">Lunas Enterprise</span>\n                        </div>\n                      </DetailDialogSidebarMenuButton>\n                    </DetailDialogSidebarMenuItem>\n                  </DetailDialogSidebarMenu>\n                </DetailDialogSidebarHeader>\n                <DetailDialogSidebarContent>{SidebarContent}</DetailDialogSidebarContent>\n                <DetailDialogSidebarFooter>{SidebarFooter}</DetailDialogSidebarFooter>\n              </Sidebar>\n\n              <main data-slot=\"detail-dialog-main\" className=\"relative h-full flex-1\">\n                <Flex padding=\"none\" gap=\"none\" vertical align=\"stretch\" className=\"absolute inset-0 size-full\">\n                  <header className=\"flex w-full flex-0 items-start gap-x-2.5 border-b border-border-weak bg-card py-2.5 pr-12 pl-2\">\n                    <DetailDialogSidebarTrigger />\n                    <Flex vertical align=\"start\" padding=\"none\" width=\"null\" wrap={false} className=\"flex-1 gap-0\">\n                      <Title level={5} className=\"line-clamp-1 truncate text-wrap\">\n                        {title || 'Detail Dialog'}\n                      </Title>\n                      {!!createdAt && (\n                        <Flex padding=\"none\" className=\"relative items-center text-text-positive-weak\">\n                          <CalendarIcon size={12} />\n                          <DateDisplay showTime showHoliday date={createdAt} format=\"full\" />\n                        </Flex>\n                      )}\n                    </Flex>\n                  </header>\n                  {isLoading ? (\n                    <Flex justify=\"center\" className=\"inset-shadow-sm w-full flex-1 bg-muted-muted\">\n                      <div className=\"loader\" />\n                    </Flex>\n                  ) : (\n                    <section data-slot=\"detail-dialog-body\" className=\"relative inset-shadow-sm flex flex-1 snap-y flex-col gap-0 overflow-y-auto bg-white\">\n                      {children}\n                    </section>\n                  )}\n                </Flex>\n              </main>\n            </SidebarProvider>\n\n            <DialogPrimitive.Close data-slot=\"dialog-close\" tabIndex={-1} asChild className=\"absolute top-3 right-3\">\n              <button className=\"flex cursor-pointer items-center justify-center rounded-full p-2 text-text-positive-weak transition-colors hover:bg-muted-muted hover:text-text-positive active:bg-muted-weak active:text-text-positive-strong disabled:pointer-events-none disabled:opacity-60\">\n                <XIcon size={24} />\n              </button>\n            </DialogPrimitive.Close>\n          </DialogPrimitive.Content>\n        </div>\n      </DialogPrimitive.Portal>\n    </DialogPrimitive.Root>\n  );\n};\n"],"mappings":"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"}