@customafk/lunas-ui 0.2.9 → 0.2.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (169) hide show
  1. package/dist/{alert-D3OOxNtK.d.mts → alert-C1YY0oUh.d.mts} +5 -5
  2. package/dist/{alert-W_Q1Gsld.d.cts → alert-CI3ANQHC.d.cts} +7 -7
  3. package/dist/{badge-YFen8D8o.d.mts → badge-DXeJVvRU.d.mts} +6 -6
  4. package/dist/{badge-Dm1IEgtT.d.cts → badge-PKOZAtox.d.cts} +6 -6
  5. package/dist/{button-Ckjev2AT.d.cts → button-BuQ09ya9.d.mts} +5 -5
  6. package/dist/{button-BnbtzQAN.d.mts → button-BwvdZSJE.d.cts} +5 -5
  7. package/dist/data-display/statistic.d.cts +2 -2
  8. package/dist/data-display/statistic.d.mts +4 -4
  9. package/dist/{dialog-DW1Axqio.d.cts → dialog-CRVNgVZU.d.cts} +12 -12
  10. package/dist/{dialog-DTtlGouy.d.mts → dialog-CiCeXhAu.d.mts} +12 -12
  11. package/dist/dialogs/detail-dialog/components/sidebar.cjs +1 -1
  12. package/dist/dialogs/detail-dialog/components/sidebar.d.cts +24 -24
  13. package/dist/dialogs/detail-dialog/components/sidebar.d.mts +26 -26
  14. package/dist/dialogs/detail-dialog/components/sidebar.mjs +1 -1
  15. package/dist/dialogs/detail-dialog/index.cjs +1 -1
  16. package/dist/dialogs/detail-dialog/index.cjs.map +1 -1
  17. package/dist/dialogs/detail-dialog/index.mjs +1 -1
  18. package/dist/dialogs/detail-dialog/index.mjs.map +1 -1
  19. package/dist/features/descriptions/index.cjs +1 -1
  20. package/dist/features/descriptions/index.cjs.map +1 -1
  21. package/dist/features/descriptions/index.d.cts +34 -2
  22. package/dist/features/descriptions/index.d.mts +40 -8
  23. package/dist/features/descriptions/index.mjs +1 -1
  24. package/dist/features/descriptions/index.mjs.map +1 -1
  25. package/dist/features/search-modal/index.d.cts +2 -2
  26. package/dist/features/search-modal/index.d.mts +2 -2
  27. package/dist/features/tables/index.cjs +1 -1
  28. package/dist/features/tables/index.d.cts +45 -28
  29. package/dist/features/tables/index.d.mts +45 -28
  30. package/dist/features/tables/index.mjs +1 -1
  31. package/dist/features/tanstack-form/index.d.cts +1 -1
  32. package/dist/features/tanstack-form/index.d.mts +1 -1
  33. package/dist/{index-BIT9bkka.d.mts → index-C3SKVvaI.d.cts} +22 -22
  34. package/dist/{index-CO4_ENw7.d.cts → index-Dm0lp7bT.d.mts} +258 -258
  35. package/dist/index.cjs +1 -1
  36. package/dist/index.d.cts +8 -8
  37. package/dist/index.d.mts +8 -8
  38. package/dist/index.mjs +1 -1
  39. package/dist/{input-CigimPoX.d.cts → input-BpZ_mAuD.d.cts} +2 -2
  40. package/dist/{input-BrM6EExy.d.mts → input-CoHHwUwI.d.mts} +4 -4
  41. package/dist/layouts/flex.d.cts +4 -4
  42. package/dist/layouts/flex.d.mts +2 -2
  43. package/dist/pages/FeatureDeveloping.d.cts +2 -2
  44. package/dist/pages/FeatureDeveloping.d.mts +2 -2
  45. package/dist/pages/FeatureFixing.d.cts +2 -2
  46. package/dist/pages/FeatureFixing.d.mts +2 -2
  47. package/dist/pages/NotAuthorized.d.cts +2 -2
  48. package/dist/pages/NotAuthorized.d.mts +2 -2
  49. package/dist/pages/NotFound.d.cts +2 -2
  50. package/dist/pages/NotFound.d.mts +2 -2
  51. package/dist/{sidebar-C27_pwLR.cjs → sidebar-CcJCnqLb.cjs} +2 -2
  52. package/dist/{sidebar-C27_pwLR.cjs.map → sidebar-CcJCnqLb.cjs.map} +1 -1
  53. package/dist/{sidebar-meLttL0V.mjs → sidebar-QmCQFs8h.mjs} +2 -2
  54. package/dist/{sidebar-meLttL0V.mjs.map → sidebar-QmCQFs8h.mjs.map} +1 -1
  55. package/dist/tables-Chn2pQSc.cjs +4 -0
  56. package/dist/tables-Chn2pQSc.cjs.map +1 -0
  57. package/dist/tables-eLIhswqW.mjs +4 -0
  58. package/dist/tables-eLIhswqW.mjs.map +1 -0
  59. package/dist/typography/paragraph.d.cts +4 -4
  60. package/dist/typography/paragraph.d.mts +4 -4
  61. package/dist/typography/title.d.cts +2 -2
  62. package/dist/typography/title.d.mts +2 -2
  63. package/dist/ui/alert-dialog.d.cts +12 -12
  64. package/dist/ui/alert-dialog.d.mts +12 -12
  65. package/dist/ui/alert.d.cts +1 -1
  66. package/dist/ui/alert.d.mts +1 -1
  67. package/dist/ui/aspect-ratio.d.cts +2 -2
  68. package/dist/ui/aspect-ratio.d.mts +2 -2
  69. package/dist/ui/avatar.d.cts +4 -4
  70. package/dist/ui/avatar.d.mts +4 -4
  71. package/dist/ui/badge.d.cts +1 -1
  72. package/dist/ui/badge.d.mts +1 -1
  73. package/dist/ui/breadcrumb.d.cts +8 -8
  74. package/dist/ui/breadcrumb.d.mts +8 -8
  75. package/dist/ui/button-group.d.cts +6 -6
  76. package/dist/ui/button-group.d.mts +6 -6
  77. package/dist/ui/button.d.cts +1 -1
  78. package/dist/ui/button.d.mts +1 -1
  79. package/dist/ui/calendar.d.cts +4 -4
  80. package/dist/ui/calendar.d.mts +4 -4
  81. package/dist/ui/card.d.cts +8 -8
  82. package/dist/ui/card.d.mts +8 -8
  83. package/dist/ui/carousel.d.cts +7 -7
  84. package/dist/ui/carousel.d.mts +7 -7
  85. package/dist/ui/checkbox.d.cts +2 -2
  86. package/dist/ui/checkbox.d.mts +2 -2
  87. package/dist/ui/collapsible.d.cts +4 -4
  88. package/dist/ui/collapsible.d.mts +4 -4
  89. package/dist/ui/command.d.cts +11 -11
  90. package/dist/ui/command.d.mts +11 -11
  91. package/dist/ui/context-menu.d.cts +16 -16
  92. package/dist/ui/context-menu.d.mts +16 -16
  93. package/dist/ui/dialog.d.cts +1 -1
  94. package/dist/ui/dialog.d.mts +1 -1
  95. package/dist/ui/drawer.d.cts +11 -11
  96. package/dist/ui/drawer.d.mts +11 -11
  97. package/dist/ui/dropdown-menu.d.cts +16 -16
  98. package/dist/ui/dropdown-menu.d.mts +16 -16
  99. package/dist/ui/empty.d.cts +9 -9
  100. package/dist/ui/empty.d.mts +9 -9
  101. package/dist/ui/field.d.cts +24 -24
  102. package/dist/ui/field.d.mts +24 -24
  103. package/dist/ui/file-uploader.d.cts +2 -2
  104. package/dist/ui/file-uploader.d.mts +2 -2
  105. package/dist/ui/form.d.cts +11 -11
  106. package/dist/ui/form.d.mts +11 -11
  107. package/dist/ui/hover-card.d.cts +4 -4
  108. package/dist/ui/hover-card.d.mts +4 -4
  109. package/dist/ui/input-otp.d.cts +5 -5
  110. package/dist/ui/input-otp.d.mts +5 -5
  111. package/dist/ui/input.d.cts +1 -1
  112. package/dist/ui/input.d.mts +1 -1
  113. package/dist/ui/inputs/search-input.d.cts +3 -3
  114. package/dist/ui/inputs/search-input.d.mts +3 -3
  115. package/dist/ui/item.d.mts +14 -14
  116. package/dist/ui/label.d.cts +2 -2
  117. package/dist/ui/menubar.d.cts +17 -17
  118. package/dist/ui/menubar.d.mts +17 -17
  119. package/dist/ui/multi-select.d.cts +2 -2
  120. package/dist/ui/multi-select.d.mts +3 -3
  121. package/dist/ui/navigation-menu.d.cts +11 -11
  122. package/dist/ui/navigation-menu.d.mts +9 -9
  123. package/dist/ui/pagination.d.cts +9 -9
  124. package/dist/ui/pagination.d.mts +9 -9
  125. package/dist/ui/popover.d.cts +6 -6
  126. package/dist/ui/popover.d.mts +6 -6
  127. package/dist/ui/progress.d.cts +2 -2
  128. package/dist/ui/progress.d.mts +2 -2
  129. package/dist/ui/radio-group.d.cts +3 -3
  130. package/dist/ui/radio-group.d.mts +3 -3
  131. package/dist/ui/resizable.d.cts +9 -9
  132. package/dist/ui/resizable.d.mts +9 -9
  133. package/dist/ui/scroll-area.d.cts +6 -6
  134. package/dist/ui/scroll-area.d.mts +6 -6
  135. package/dist/ui/select.d.cts +9 -9
  136. package/dist/ui/select.d.mts +9 -9
  137. package/dist/ui/separator.d.cts +2 -2
  138. package/dist/ui/separator.d.mts +2 -2
  139. package/dist/ui/sheet.d.cts +9 -9
  140. package/dist/ui/sheet.d.mts +9 -9
  141. package/dist/ui/sidebar.d.cts +26 -26
  142. package/dist/ui/sidebar.d.mts +26 -26
  143. package/dist/ui/skeleton.d.cts +2 -2
  144. package/dist/ui/skeleton.d.mts +2 -2
  145. package/dist/ui/slider.d.cts +2 -2
  146. package/dist/ui/slider.d.mts +2 -2
  147. package/dist/ui/sonner.d.cts +2 -2
  148. package/dist/ui/sonner.d.mts +2 -2
  149. package/dist/ui/spinner.d.cts +2 -2
  150. package/dist/ui/spinner.d.mts +2 -2
  151. package/dist/ui/switch.d.cts +2 -2
  152. package/dist/ui/switch.d.mts +2 -2
  153. package/dist/ui/table.d.cts +18 -18
  154. package/dist/ui/table.d.mts +18 -18
  155. package/dist/ui/tabs.d.cts +5 -5
  156. package/dist/ui/tabs.d.mts +5 -5
  157. package/dist/ui/textarea.d.cts +2 -2
  158. package/dist/ui/textarea.d.mts +2 -2
  159. package/dist/ui/toggle-group.d.cts +3 -3
  160. package/dist/ui/toggle-group.d.mts +3 -3
  161. package/dist/ui/toggle.d.cts +2 -2
  162. package/dist/ui/toggle.d.mts +4 -4
  163. package/dist/ui/tooltip.d.cts +5 -5
  164. package/dist/ui/tooltip.d.mts +5 -5
  165. package/package.json +1 -1
  166. package/dist/tables-D1JyNmcV.cjs +0 -2
  167. package/dist/tables-D1JyNmcV.cjs.map +0 -1
  168. package/dist/tables-DTazQIyy.mjs +0 -2
  169. package/dist/tables-DTazQIyy.mjs.map +0 -1
@@ -1,9 +1,9 @@
1
- import { t as Button } from "../../../button-BnbtzQAN.mjs";
1
+ import { t as Button } from "../../../button-BuQ09ya9.mjs";
2
2
  import { Separator } from "../../../ui/separator.mjs";
3
3
  import { TooltipContent } from "../../../ui/tooltip.mjs";
4
- import * as react_jsx_runtime11 from "react/jsx-runtime";
4
+ import * as react_jsx_runtime7 from "react/jsx-runtime";
5
5
  import { VariantProps } from "class-variance-authority";
6
- import * as class_variance_authority_types1 from "class-variance-authority/types";
6
+ import * as class_variance_authority_types2 from "class-variance-authority/types";
7
7
 
8
8
  //#region packages/components/dialogs/detail-dialog/components/sidebar.d.ts
9
9
  type SidebarContextProps = {
@@ -50,7 +50,7 @@ declare function SidebarProvider({
50
50
  open?: boolean;
51
51
  /** Callback fired when the open state changes in controlled mode. */
52
52
  onOpenChange?: (open: boolean) => void;
53
- }): react_jsx_runtime11.JSX.Element;
53
+ }): react_jsx_runtime7.JSX.Element;
54
54
  /**
55
55
  * Responsive sidebar container that supports desktop icon-collapse and a mobile Sheet overlay.
56
56
  *
@@ -77,7 +77,7 @@ declare function Sidebar({
77
77
  variant?: 'sidebar' | 'floating' | 'inset';
78
78
  /** Collapse behaviour — slides off-canvas, shrinks to icon strip, or stays fixed. Defaults to `'offcanvas'`. */
79
79
  collapsible?: 'offcanvas' | 'icon' | 'none';
80
- }): react_jsx_runtime11.JSX.Element;
80
+ }): react_jsx_runtime7.JSX.Element;
81
81
  /**
82
82
  * Icon button that toggles the detail-dialog sidebar open or collapsed.
83
83
  *
@@ -92,66 +92,66 @@ declare function DetailDialogSidebarTrigger({
92
92
  className,
93
93
  onClick,
94
94
  ...props
95
- }: React.ComponentProps<typeof Button>): react_jsx_runtime11.JSX.Element;
95
+ }: React.ComponentProps<typeof Button>): react_jsx_runtime7.JSX.Element;
96
96
  declare function DetailDialogSidebarRail({
97
97
  className,
98
98
  ...props
99
- }: React.ComponentProps<'button'>): react_jsx_runtime11.JSX.Element;
99
+ }: React.ComponentProps<'button'>): react_jsx_runtime7.JSX.Element;
100
100
  declare function SidebarInset({
101
101
  className,
102
102
  ...props
103
- }: React.ComponentProps<'main'>): react_jsx_runtime11.JSX.Element;
103
+ }: React.ComponentProps<'main'>): react_jsx_runtime7.JSX.Element;
104
104
  declare function DetailDialogSidebarHeader({
105
105
  className,
106
106
  ...props
107
- }: React.ComponentProps<'div'>): react_jsx_runtime11.JSX.Element;
107
+ }: React.ComponentProps<'div'>): react_jsx_runtime7.JSX.Element;
108
108
  declare function DetailDialogSidebarFooter({
109
109
  className,
110
110
  children,
111
111
  ...props
112
- }: React.ComponentProps<'div'>): react_jsx_runtime11.JSX.Element;
112
+ }: React.ComponentProps<'div'>): react_jsx_runtime7.JSX.Element;
113
113
  declare function DetailDialogSidebarSeparator({
114
114
  className,
115
115
  ...props
116
- }: React.ComponentProps<typeof Separator>): react_jsx_runtime11.JSX.Element;
116
+ }: React.ComponentProps<typeof Separator>): react_jsx_runtime7.JSX.Element;
117
117
  declare function DetailDialogSidebarContent({
118
118
  className,
119
119
  ...props
120
- }: React.ComponentProps<'div'>): react_jsx_runtime11.JSX.Element;
120
+ }: React.ComponentProps<'div'>): react_jsx_runtime7.JSX.Element;
121
121
  declare function DetailDialogSidebarGroup({
122
122
  className,
123
123
  ...props
124
- }: React.ComponentProps<'div'>): react_jsx_runtime11.JSX.Element;
124
+ }: React.ComponentProps<'div'>): react_jsx_runtime7.JSX.Element;
125
125
  declare function DetailDialogSidebarGroupLabel({
126
126
  className,
127
127
  asChild,
128
128
  ...props
129
129
  }: React.ComponentProps<'div'> & {
130
130
  asChild?: boolean;
131
- }): react_jsx_runtime11.JSX.Element;
131
+ }): react_jsx_runtime7.JSX.Element;
132
132
  declare function DetailDialogSidebarGroupAction({
133
133
  className,
134
134
  asChild,
135
135
  ...props
136
136
  }: React.ComponentProps<'button'> & {
137
137
  asChild?: boolean;
138
- }): react_jsx_runtime11.JSX.Element;
138
+ }): react_jsx_runtime7.JSX.Element;
139
139
  declare function DetailDialogSidebarGroupContent({
140
140
  className,
141
141
  ...props
142
- }: React.ComponentProps<'div'>): react_jsx_runtime11.JSX.Element;
142
+ }: React.ComponentProps<'div'>): react_jsx_runtime7.JSX.Element;
143
143
  declare function DetailDialogSidebarMenu({
144
144
  className,
145
145
  ...props
146
- }: React.ComponentProps<'ul'>): react_jsx_runtime11.JSX.Element;
146
+ }: React.ComponentProps<'ul'>): react_jsx_runtime7.JSX.Element;
147
147
  declare function DetailDialogSidebarMenuItem({
148
148
  className,
149
149
  ...props
150
- }: React.ComponentProps<'li'>): react_jsx_runtime11.JSX.Element;
150
+ }: React.ComponentProps<'li'>): react_jsx_runtime7.JSX.Element;
151
151
  declare const sidebarMenuButtonVariants: (props?: ({
152
152
  variant?: "default" | "outline" | null | undefined;
153
153
  size?: "sm" | "lg" | "default" | null | undefined;
154
- } & class_variance_authority_types1.ClassProp) | undefined) => string;
154
+ } & class_variance_authority_types2.ClassProp) | undefined) => string;
155
155
  declare function DetailDialogSidebarMenuButton({
156
156
  asChild,
157
157
  isActive,
@@ -164,7 +164,7 @@ declare function DetailDialogSidebarMenuButton({
164
164
  asChild?: boolean;
165
165
  isActive?: boolean;
166
166
  tooltip?: string | React.ComponentProps<typeof TooltipContent>;
167
- } & VariantProps<typeof sidebarMenuButtonVariants>): react_jsx_runtime11.JSX.Element;
167
+ } & VariantProps<typeof sidebarMenuButtonVariants>): react_jsx_runtime7.JSX.Element;
168
168
  declare function DetailDialogSidebarMenuAction({
169
169
  className,
170
170
  asChild,
@@ -173,26 +173,26 @@ declare function DetailDialogSidebarMenuAction({
173
173
  }: React.ComponentProps<'button'> & {
174
174
  asChild?: boolean;
175
175
  showOnHover?: boolean;
176
- }): react_jsx_runtime11.JSX.Element;
176
+ }): react_jsx_runtime7.JSX.Element;
177
177
  declare function DetailDialogSidebarMenuBadge({
178
178
  className,
179
179
  ...props
180
- }: React.ComponentProps<'div'>): react_jsx_runtime11.JSX.Element;
180
+ }: React.ComponentProps<'div'>): react_jsx_runtime7.JSX.Element;
181
181
  declare function DetailDialogSidebarMenuSkeleton({
182
182
  className,
183
183
  showIcon,
184
184
  ...props
185
185
  }: React.ComponentProps<'div'> & {
186
186
  showIcon?: boolean;
187
- }): react_jsx_runtime11.JSX.Element;
187
+ }): react_jsx_runtime7.JSX.Element;
188
188
  declare function DetailDialogSidebarMenuSub({
189
189
  className,
190
190
  ...props
191
- }: React.ComponentProps<'ul'>): react_jsx_runtime11.JSX.Element;
191
+ }: React.ComponentProps<'ul'>): react_jsx_runtime7.JSX.Element;
192
192
  declare function DetailDialogSidebarMenuSubItem({
193
193
  className,
194
194
  ...props
195
- }: React.ComponentProps<'li'>): react_jsx_runtime11.JSX.Element;
195
+ }: React.ComponentProps<'li'>): react_jsx_runtime7.JSX.Element;
196
196
  declare function DetailDialogSidebarMenuSubButton({
197
197
  asChild,
198
198
  size,
@@ -203,7 +203,7 @@ declare function DetailDialogSidebarMenuSubButton({
203
203
  asChild?: boolean;
204
204
  size?: 'sm' | 'md';
205
205
  isActive?: boolean;
206
- }): react_jsx_runtime11.JSX.Element;
206
+ }): react_jsx_runtime7.JSX.Element;
207
207
  //#endregion
208
208
  export { DetailDialogSidebarContent, DetailDialogSidebarFooter, DetailDialogSidebarGroup, DetailDialogSidebarGroupAction, DetailDialogSidebarGroupContent, DetailDialogSidebarGroupLabel, DetailDialogSidebarHeader, DetailDialogSidebarMenu, DetailDialogSidebarMenuAction, DetailDialogSidebarMenuBadge, DetailDialogSidebarMenuButton, DetailDialogSidebarMenuItem, DetailDialogSidebarMenuSkeleton, DetailDialogSidebarMenuSub, DetailDialogSidebarMenuSubButton, DetailDialogSidebarMenuSubItem, DetailDialogSidebarRail, DetailDialogSidebarSeparator, DetailDialogSidebarTrigger, Sidebar, SidebarInset, SidebarProvider, useSidebar };
209
209
  //# sourceMappingURL=sidebar.d.mts.map
@@ -1 +1 @@
1
- "use client";import"../../../button.variants-DeCyas1F.mjs";import"../../../button-C6ybzxxj.mjs";import"../../../skeleton-BPxcW2yu.mjs";import"../../../tooltip-Bj0iOG4s.mjs";import"../../../separator-BMsbHAVt.mjs";import"../../../sheet-DMIqn1iv.mjs";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-meLttL0V.mjs";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};
1
+ "use client";import"../../../button.variants-DeCyas1F.mjs";import"../../../button-C6ybzxxj.mjs";import"../../../skeleton-BPxcW2yu.mjs";import"../../../tooltip-Bj0iOG4s.mjs";import"../../../separator-BMsbHAVt.mjs";import"../../../sheet-DMIqn1iv.mjs";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-QmCQFs8h.mjs";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};
@@ -1,2 +1,2 @@
1
- "use client";const e=require(`../../chunk-Bmb41Sf3.cjs`);require(`../../button.variants-tnhb123u.cjs`),require(`../../button-CwDT3m4m.cjs`),require(`../../skeleton-BfMCjXYM.cjs`);const t=require(`../../flex-BbbogTsZ.cjs`),n=require(`../../date-a3RI5Pwo.cjs`);require(`../../tooltip-itUmYz9k.cjs`);const r=require(`../../typography/title.cjs`);require(`../../separator-BwZb12bh.cjs`),require(`../../sheet-CaDXTx7n.cjs`);const i=require(`../../sidebar-C27_pwLR.cjs`);let a=require(`lucide-react`),o=require(`react`),s=require(`react/jsx-runtime`),c=require(`@customafk/react-toolkit/utils`),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,s.jsx)(l.Dialog.Root,{"data-slot":`detail-dialog`,open:e,onOpenChange:p,children:(0,s.jsxs)(l.Dialog.Portal,{"data-slot":`detail-dialog-portal`,children:[(0,s.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,s.jsx)(`div`,{className:`fixed inset-0 z-50 flex items-center justify-center`,children:(0,s.jsxs)(l.Dialog.Content,{"data-slot":`dialog-content`,className:(0,c.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,s.jsxs)(i.S,{children:[(0,s.jsxs)(i.b,{collapsible:`icon`,children:[(0,s.jsx)(i.s,{children:(0,s.jsx)(i.c,{children:(0,s.jsx)(i.f,{children:(0,s.jsxs)(i.d,{size:`lg`,tabIndex:-1,children:[(0,s.jsx)(`div`,{className:`flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground`,children:(0,s.jsx)(a.CatIcon,{size:16})}),(0,s.jsxs)(`div`,{className:`grid flex-1 text-left text-sm leading-tight`,children:[(0,s.jsx)(`span`,{className:`truncate font-medium`,children:m?.title||`Detail Dialog`}),(0,s.jsx)(`span`,{className:`truncate text-xs`,children:`Lunas Enterprise`})]})]})})})}),(0,s.jsx)(i.t,{children:g}),(0,s.jsx)(i.n,{children:_})]}),(0,s.jsx)(`main`,{"data-slot":`detail-dialog-main`,className:`relative h-full flex-1`,children:(0,s.jsxs)(t.t,{padding:`none`,gap:`none`,vertical:!0,align:`stretch`,className:`absolute inset-0 size-full`,children:[(0,s.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,s.jsx)(i.y,{}),(0,s.jsxs)(t.t,{vertical:!0,align:`start`,padding:`none`,width:`null`,wrap:!1,className:`flex-1 gap-0`,children:[(0,s.jsx)(r.Title,{level:5,className:`line-clamp-1 truncate text-wrap`,children:d||`Detail Dialog`}),!!f&&(0,s.jsxs)(t.t,{padding:`none`,className:`relative items-center text-text-positive-weak`,children:[(0,s.jsx)(a.CalendarIcon,{size:12}),(0,s.jsx)(n.t,{showTime:!0,showHoliday:!0,date:f,format:`full`})]})]})]}),u?(0,s.jsx)(t.t,{justify:`center`,className:`inset-shadow-sm w-full flex-1 bg-muted-muted`,children:(0,s.jsx)(`div`,{className:`loader`})}):(0,s.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-muted-bg-subtle`,children:h})]})})]}),(0,s.jsx)(l.Dialog.Close,{"data-slot":`dialog-close`,tabIndex:-1,asChild:!0,className:`absolute top-3 right-3`,children:(0,s.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,s.jsx)(a.XIcon,{size:24})})})]})})]})})};exports.DetailDialog=u;
1
+ "use client";const e=require(`../../chunk-Bmb41Sf3.cjs`);require(`../../button.variants-tnhb123u.cjs`),require(`../../button-CwDT3m4m.cjs`),require(`../../skeleton-BfMCjXYM.cjs`);const t=require(`../../flex-BbbogTsZ.cjs`),n=require(`../../date-a3RI5Pwo.cjs`);require(`../../tooltip-itUmYz9k.cjs`);const r=require(`../../typography/title.cjs`);require(`../../separator-BwZb12bh.cjs`),require(`../../sheet-CaDXTx7n.cjs`);const i=require(`../../sidebar-CcJCnqLb.cjs`);let a=require(`lucide-react`),o=require(`react`),s=require(`react/jsx-runtime`),c=require(`@customafk/react-toolkit/utils`),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,s.jsx)(l.Dialog.Root,{"data-slot":`detail-dialog`,open:e,onOpenChange:p,children:(0,s.jsxs)(l.Dialog.Portal,{"data-slot":`detail-dialog-portal`,children:[(0,s.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,s.jsx)(`div`,{className:`fixed inset-0 z-50 flex items-center justify-center`,children:(0,s.jsxs)(l.Dialog.Content,{"data-slot":`dialog-content`,className:(0,c.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,s.jsxs)(i.S,{children:[(0,s.jsxs)(i.b,{collapsible:`icon`,children:[(0,s.jsx)(i.s,{children:(0,s.jsx)(i.c,{children:(0,s.jsx)(i.f,{children:(0,s.jsxs)(i.d,{size:`lg`,tabIndex:-1,children:[(0,s.jsx)(`div`,{className:`flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground`,children:(0,s.jsx)(a.CatIcon,{size:16})}),(0,s.jsxs)(`div`,{className:`grid flex-1 text-left text-sm leading-tight`,children:[(0,s.jsx)(`span`,{className:`truncate font-medium`,children:m?.title||`Detail Dialog`}),(0,s.jsx)(`span`,{className:`truncate text-xs`,children:`Lunas Enterprise`})]})]})})})}),(0,s.jsx)(i.t,{children:g}),(0,s.jsx)(i.n,{children:_})]}),(0,s.jsx)(`main`,{"data-slot":`detail-dialog-main`,className:`relative h-full flex-1`,children:(0,s.jsxs)(t.t,{padding:`none`,gap:`none`,vertical:!0,align:`stretch`,className:`absolute inset-0 size-full`,children:[(0,s.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,s.jsx)(i.y,{}),(0,s.jsxs)(t.t,{vertical:!0,align:`start`,padding:`none`,width:`null`,wrap:!1,className:`flex-1 gap-0`,children:[(0,s.jsx)(r.Title,{level:5,className:`line-clamp-1 truncate text-wrap`,children:d||`Detail Dialog`}),!!f&&(0,s.jsxs)(t.t,{padding:`none`,className:`relative items-center text-text-positive-weak`,children:[(0,s.jsx)(a.CalendarIcon,{size:12}),(0,s.jsx)(n.t,{showTime:!0,showHoliday:!0,date:f,format:`full`})]})]})]}),u?(0,s.jsx)(t.t,{justify:`center`,className:`inset-shadow-sm w-full flex-1 bg-muted-muted`,children:(0,s.jsx)(`div`,{className:`loader`})}):(0,s.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,s.jsx)(l.Dialog.Close,{"data-slot":`dialog-close`,tabIndex:-1,asChild:!0,className:`absolute top-3 right-3`,children:(0,s.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,s.jsx)(a.XIcon,{size:24})})})]})})]})})};exports.DetailDialog=u;
2
2
  //# sourceMappingURL=index.cjs.map
@@ -1 +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\n data-slot=\"detail-dialog-body\"\n className=\"relative inset-shadow-sm flex flex-1 snap-y flex-col gap-0 overflow-y-auto bg-muted-bg-subtle\"\n >\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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"}
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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"}
@@ -1,2 +1,2 @@
1
- "use client";import"../../button.variants-DeCyas1F.mjs";import"../../button-C6ybzxxj.mjs";import"../../skeleton-BPxcW2yu.mjs";import{t as e}from"../../flex-BLMTj7Ev.mjs";import{t}from"../../date-CVz9xdCg.mjs";import"../../tooltip-Bj0iOG4s.mjs";import{Title as n}from"../../typography/title.mjs";import"../../separator-BMsbHAVt.mjs";import"../../sheet-DMIqn1iv.mjs";import{S as r,b as i,c as a,d as o,f as s,n as c,s as l,t as u,y as d}from"../../sidebar-meLttL0V.mjs";import{CalendarIcon as f,CatIcon as p,XIcon as m}from"lucide-react";import{useCallback as h}from"react";import{jsx as g,jsxs as _}from"react/jsx-runtime";import{cn as v}from"@customafk/react-toolkit/utils";import{Dialog as y}from"radix-ui";const b=({open:b,isLoading:x,title:S,createdAt:C,onOpenChange:w,sidebar:T,children:E})=>{let{content:D,footer:O}=T||{},k=h(e=>{e.preventDefault(),e.stopPropagation()},[]);return g(y.Root,{"data-slot":`detail-dialog`,open:b,onOpenChange:w,children:_(y.Portal,{"data-slot":`detail-dialog-portal`,children:[g(y.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`}),g(`div`,{className:`fixed inset-0 z-50 flex items-center justify-center`,children:_(y.Content,{"data-slot":`dialog-content`,className:v(`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:k,children:[_(r,{children:[_(i,{collapsible:`icon`,children:[g(l,{children:g(a,{children:g(s,{children:_(o,{size:`lg`,tabIndex:-1,children:[g(`div`,{className:`flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground`,children:g(p,{size:16})}),_(`div`,{className:`grid flex-1 text-left text-sm leading-tight`,children:[g(`span`,{className:`truncate font-medium`,children:T?.title||`Detail Dialog`}),g(`span`,{className:`truncate text-xs`,children:`Lunas Enterprise`})]})]})})})}),g(u,{children:D}),g(c,{children:O})]}),g(`main`,{"data-slot":`detail-dialog-main`,className:`relative h-full flex-1`,children:_(e,{padding:`none`,gap:`none`,vertical:!0,align:`stretch`,className:`absolute inset-0 size-full`,children:[_(`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:[g(d,{}),_(e,{vertical:!0,align:`start`,padding:`none`,width:`null`,wrap:!1,className:`flex-1 gap-0`,children:[g(n,{level:5,className:`line-clamp-1 truncate text-wrap`,children:S||`Detail Dialog`}),!!C&&_(e,{padding:`none`,className:`relative items-center text-text-positive-weak`,children:[g(f,{size:12}),g(t,{showTime:!0,showHoliday:!0,date:C,format:`full`})]})]})]}),x?g(e,{justify:`center`,className:`inset-shadow-sm w-full flex-1 bg-muted-muted`,children:g(`div`,{className:`loader`})}):g(`section`,{"data-slot":`detail-dialog-body`,className:`relative inset-shadow-sm flex flex-1 snap-y flex-col gap-0 overflow-y-auto bg-muted-bg-subtle`,children:E})]})})]}),g(y.Close,{"data-slot":`dialog-close`,tabIndex:-1,asChild:!0,className:`absolute top-3 right-3`,children:g(`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:g(m,{size:24})})})]})})]})})};export{b as DetailDialog};
1
+ "use client";import"../../button.variants-DeCyas1F.mjs";import"../../button-C6ybzxxj.mjs";import"../../skeleton-BPxcW2yu.mjs";import{t as e}from"../../flex-BLMTj7Ev.mjs";import{t}from"../../date-CVz9xdCg.mjs";import"../../tooltip-Bj0iOG4s.mjs";import{Title as n}from"../../typography/title.mjs";import"../../separator-BMsbHAVt.mjs";import"../../sheet-DMIqn1iv.mjs";import{S as r,b as i,c as a,d as o,f as s,n as c,s as l,t as u,y as d}from"../../sidebar-QmCQFs8h.mjs";import{CalendarIcon as f,CatIcon as p,XIcon as m}from"lucide-react";import{useCallback as h}from"react";import{jsx as g,jsxs as _}from"react/jsx-runtime";import{cn as v}from"@customafk/react-toolkit/utils";import{Dialog as y}from"radix-ui";const b=({open:b,isLoading:x,title:S,createdAt:C,onOpenChange:w,sidebar:T,children:E})=>{let{content:D,footer:O}=T||{},k=h(e=>{e.preventDefault(),e.stopPropagation()},[]);return g(y.Root,{"data-slot":`detail-dialog`,open:b,onOpenChange:w,children:_(y.Portal,{"data-slot":`detail-dialog-portal`,children:[g(y.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`}),g(`div`,{className:`fixed inset-0 z-50 flex items-center justify-center`,children:_(y.Content,{"data-slot":`dialog-content`,className:v(`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:k,children:[_(r,{children:[_(i,{collapsible:`icon`,children:[g(l,{children:g(a,{children:g(s,{children:_(o,{size:`lg`,tabIndex:-1,children:[g(`div`,{className:`flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground`,children:g(p,{size:16})}),_(`div`,{className:`grid flex-1 text-left text-sm leading-tight`,children:[g(`span`,{className:`truncate font-medium`,children:T?.title||`Detail Dialog`}),g(`span`,{className:`truncate text-xs`,children:`Lunas Enterprise`})]})]})})})}),g(u,{children:D}),g(c,{children:O})]}),g(`main`,{"data-slot":`detail-dialog-main`,className:`relative h-full flex-1`,children:_(e,{padding:`none`,gap:`none`,vertical:!0,align:`stretch`,className:`absolute inset-0 size-full`,children:[_(`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:[g(d,{}),_(e,{vertical:!0,align:`start`,padding:`none`,width:`null`,wrap:!1,className:`flex-1 gap-0`,children:[g(n,{level:5,className:`line-clamp-1 truncate text-wrap`,children:S||`Detail Dialog`}),!!C&&_(e,{padding:`none`,className:`relative items-center text-text-positive-weak`,children:[g(f,{size:12}),g(t,{showTime:!0,showHoliday:!0,date:C,format:`full`})]})]})]}),x?g(e,{justify:`center`,className:`inset-shadow-sm w-full flex-1 bg-muted-muted`,children:g(`div`,{className:`loader`})}):g(`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:E})]})})]}),g(y.Close,{"data-slot":`dialog-close`,tabIndex:-1,asChild:!0,className:`absolute top-3 right-3`,children:g(`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:g(m,{size:24})})})]})})]})})};export{b as DetailDialog};
2
2
  //# sourceMappingURL=index.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","names":["DetailDialog: React.FC<React.PropsWithChildren<DetailDialogProps>>","DialogPrimitive"],"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\n data-slot=\"detail-dialog-body\"\n className=\"relative inset-shadow-sm flex flex-1 snap-y flex-col gap-0 overflow-y-auto bg-muted-bg-subtle\"\n >\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":"osBAmEA,MAAaA,GAAsE,CAAE,OAAM,YAAW,QAAO,YAAW,eAAc,UAAS,cAAe,CAC5J,GAAM,CAAE,QAAS,EAAgB,OAAQ,GAAkB,GAAW,EAAE,CAElE,EAAwB,EAAoG,GAAS,CACzI,EAAM,gBAAgB,CACtB,EAAM,iBAAiB,EACtB,EAAE,CAAC,CAEN,OACE,EAACC,EAAgB,KAAA,CAAK,YAAU,gBAAsB,OAAoB,wBACxE,EAACA,EAAgB,OAAA,CAAO,YAAU,iCAChC,EAACA,EAAgB,QAAA,CACf,YAAU,wBACV,UAAU,0JACV,CACF,EAAC,MAAA,CAAI,UAAU,+DACb,EAACA,EAAgB,QAAA,CACf,YAAU,iBACV,UAAW,EACT,+DACA,6DACA,+DACA,qBACA,2GACA,oCACA,gBACA,cACA,+BACA,+BACD,CACD,kBAAmB,YAEnB,EAAC,EAAA,CAAA,SAAA,CACC,EAAC,EAAA,CAAQ,YAAY,iBACnB,EAAC,EAAA,CAAA,SACC,EAAC,EAAA,CAAA,SACC,EAAC,EAAA,CAAA,SACC,EAAC,EAAA,CAA8B,KAAK,KAAK,SAAU,aACjD,EAAC,MAAA,CAAI,UAAU,+HACb,EAAC,EAAA,CAAQ,KAAM,GAAA,CAAM,EACjB,CACN,EAAC,MAAA,CAAI,UAAU,wDACb,EAAC,OAAA,CAAK,UAAU,gCAAwB,GAAS,OAAS,iBAAuB,CACjF,EAAC,OAAA,CAAK,UAAU,4BAAmB,oBAAuB,CAAA,EACtD,CAAA,EACwB,CAAA,CACJ,CAAA,CACN,CAAA,CACA,CAC5B,EAAC,EAAA,CAAA,SAA4B,EAAA,CAA4C,CACzE,EAAC,EAAA,CAAA,SAA2B,EAAA,CAA0C,GAC9D,CAEV,EAAC,OAAA,CAAK,YAAU,qBAAqB,UAAU,kCAC7C,EAAC,EAAA,CAAK,QAAQ,OAAO,IAAI,OAAO,SAAA,GAAS,MAAM,UAAU,UAAU,uCACjE,EAAC,SAAA,CAAO,UAAU,2GAChB,EAAC,EAAA,EAAA,CAA6B,CAC9B,EAAC,EAAA,CAAK,SAAA,GAAS,MAAM,QAAQ,QAAQ,OAAO,MAAM,OAAO,KAAM,GAAO,UAAU,yBAC9E,EAAC,EAAA,CAAM,MAAO,EAAG,UAAU,2CACxB,GAAS,iBACJ,CACP,CAAC,CAAC,GACD,EAAC,EAAA,CAAK,QAAQ,OAAO,UAAU,0DAC7B,EAAC,EAAA,CAAa,KAAM,GAAA,CAAM,CAC1B,EAAC,EAAA,CAAY,SAAA,GAAS,YAAA,GAAY,KAAM,EAAW,OAAO,QAAS,CAAA,EAC9D,CAAA,EAEJ,CAAA,EACA,CACR,EACC,EAAC,EAAA,CAAK,QAAQ,SAAS,UAAU,wDAC/B,EAAC,MAAA,CAAI,UAAU,SAAA,CAAW,EACrB,CAEP,EAAC,UAAA,CACC,YAAU,qBACV,UAAU,gGAET,YACO,CAAA,EAEP,EACF,CAAA,CAAA,CACS,CAElB,EAACA,EAAgB,MAAA,CAAM,YAAU,eAAe,SAAU,GAAI,QAAA,GAAQ,UAAU,kCAC9E,EAAC,SAAA,CAAO,UAAU,2QAChB,EAAC,EAAA,CAAM,KAAM,GAAA,CAAM,EACZ,EACa,CAAA,EACA,EACtB,CAAA,EACiB,EACJ"}
1
+ {"version":3,"file":"index.mjs","names":["DetailDialog: React.FC<React.PropsWithChildren<DetailDialogProps>>","DialogPrimitive"],"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":"osBAmEA,MAAaA,GAAsE,CAAE,OAAM,YAAW,QAAO,YAAW,eAAc,UAAS,cAAe,CAC5J,GAAM,CAAE,QAAS,EAAgB,OAAQ,GAAkB,GAAW,EAAE,CAElE,EAAwB,EAAoG,GAAS,CACzI,EAAM,gBAAgB,CACtB,EAAM,iBAAiB,EACtB,EAAE,CAAC,CAEN,OACE,EAACC,EAAgB,KAAA,CAAK,YAAU,gBAAsB,OAAoB,wBACxE,EAACA,EAAgB,OAAA,CAAO,YAAU,iCAChC,EAACA,EAAgB,QAAA,CACf,YAAU,wBACV,UAAU,0JACV,CACF,EAAC,MAAA,CAAI,UAAU,+DACb,EAACA,EAAgB,QAAA,CACf,YAAU,iBACV,UAAW,EACT,+DACA,6DACA,+DACA,qBACA,2GACA,oCACA,gBACA,cACA,+BACA,+BACD,CACD,kBAAmB,YAEnB,EAAC,EAAA,CAAA,SAAA,CACC,EAAC,EAAA,CAAQ,YAAY,iBACnB,EAAC,EAAA,CAAA,SACC,EAAC,EAAA,CAAA,SACC,EAAC,EAAA,CAAA,SACC,EAAC,EAAA,CAA8B,KAAK,KAAK,SAAU,aACjD,EAAC,MAAA,CAAI,UAAU,+HACb,EAAC,EAAA,CAAQ,KAAM,GAAA,CAAM,EACjB,CACN,EAAC,MAAA,CAAI,UAAU,wDACb,EAAC,OAAA,CAAK,UAAU,gCAAwB,GAAS,OAAS,iBAAuB,CACjF,EAAC,OAAA,CAAK,UAAU,4BAAmB,oBAAuB,CAAA,EACtD,CAAA,EACwB,CAAA,CACJ,CAAA,CACN,CAAA,CACA,CAC5B,EAAC,EAAA,CAAA,SAA4B,EAAA,CAA4C,CACzE,EAAC,EAAA,CAAA,SAA2B,EAAA,CAA0C,GAC9D,CAEV,EAAC,OAAA,CAAK,YAAU,qBAAqB,UAAU,kCAC7C,EAAC,EAAA,CAAK,QAAQ,OAAO,IAAI,OAAO,SAAA,GAAS,MAAM,UAAU,UAAU,uCACjE,EAAC,SAAA,CAAO,UAAU,2GAChB,EAAC,EAAA,EAAA,CAA6B,CAC9B,EAAC,EAAA,CAAK,SAAA,GAAS,MAAM,QAAQ,QAAQ,OAAO,MAAM,OAAO,KAAM,GAAO,UAAU,yBAC9E,EAAC,EAAA,CAAM,MAAO,EAAG,UAAU,2CACxB,GAAS,iBACJ,CACP,CAAC,CAAC,GACD,EAAC,EAAA,CAAK,QAAQ,OAAO,UAAU,0DAC7B,EAAC,EAAA,CAAa,KAAM,GAAA,CAAM,CAC1B,EAAC,EAAA,CAAY,SAAA,GAAS,YAAA,GAAY,KAAM,EAAW,OAAO,QAAS,CAAA,EAC9D,CAAA,EAEJ,CAAA,EACA,CACR,EACC,EAAC,EAAA,CAAK,QAAQ,SAAS,UAAU,wDAC/B,EAAC,MAAA,CAAI,UAAU,SAAA,CAAW,EACrB,CAEP,EAAC,UAAA,CAAQ,YAAU,qBAAqB,UAAU,sFAC/C,YACO,CAAA,EAEP,EACF,CAAA,CAAA,CACS,CAElB,EAACA,EAAgB,MAAA,CAAM,YAAU,eAAe,SAAU,GAAI,QAAA,GAAQ,UAAU,kCAC9E,EAAC,SAAA,CAAO,UAAU,2QAChB,EAAC,EAAA,CAAM,KAAM,GAAA,CAAM,EACZ,EACa,CAAA,EACA,EACtB,CAAA,EACiB,EACJ"}
@@ -1,2 +1,2 @@
1
- "use client";const e=require(`../../chunk-Bmb41Sf3.cjs`),t=require(`../../paragraph-DN85Huc4.cjs`);require(`../../skeleton-BfMCjXYM.cjs`);const n=require(`../../image-B1Dm5LWk.cjs`);require(`../../flex-BbbogTsZ.cjs`);const r=require(`../../date-a3RI5Pwo.cjs`),i=require(`../../badge-uQ0pIZbQ.cjs`),a=require(`../../tooltip-itUmYz9k.cjs`);require(`../../avatar-CTS9-raY.cjs`);const o=require(`../../user-BEyYLDNK.cjs`);let s=require(`lucide-react`),c=require(`react`),l=require(`react/jsx-runtime`),u=require(`@customafk/react-toolkit/utils`),d=require(`class-variance-authority`);const f=()=>(0,l.jsx)(`span`,{"data-slot":`description-empty`,"aria-label":`Empty value`,className:`select-none font-medium text-sm text-text-positive-muted`,children:`—`}),p=({label:e,color:t=`secondary`,variant:n=`soft`,size:r=`sm`})=>e?(0,l.jsx)(i.t,{"data-slot":`description-badge`,color:t,variant:n,size:r,children:e}):(0,l.jsx)(f,{}),m=({value:e,trueLabel:t=`Yes`,falseLabel:n=`No`})=>e==null?(0,l.jsx)(f,{}):(0,l.jsx)(i.t,{"data-slot":`description-boolean`,variant:`soft`,color:e?`success`:`danger`,size:`sm`,children:e?t:n}),h=({value:e,truncate:t=!0})=>{let[n,r]=(0,c.useState)(!1),i=(0,c.useCallback)(async()=>{e&&(await navigator.clipboard.writeText(e),r(!0),setTimeout(()=>r(!1),1500))},[e]);return e?(0,l.jsxs)(`button`,{type:`button`,"data-slot":`description-copy`,onClick:i,className:(0,u.cn)(`group inline-flex max-w-full cursor-pointer items-center gap-1.5 rounded-sm border border-border-weak bg-secondary-muted px-2 py-0.5 font-mono text-xs text-text-positive-weak transition-[border-color,color,box-shadow] hover:border-border hover:text-text-positive hover:shadow-xs`,t&&`min-w-0`),children:[(0,l.jsx)(`span`,{className:(0,u.cn)(`tabular-nums`,t&&`truncate`),children:e}),n?(0,l.jsx)(s.CheckIcon,{size:12,className:`shrink-0 text-success`}):(0,l.jsx)(s.CopyIcon,{size:12,className:`shrink-0 opacity-50 group-hover:opacity-100`})]}):(0,l.jsx)(f,{})},g=({date:e})=>e==null?(0,l.jsx)(f,{}):(0,l.jsx)(a.r,{children:(0,l.jsxs)(a.t,{children:[(0,l.jsx)(a.i,{asChild:!0,children:(0,l.jsx)(r.t,{"data-slot":`description-date`,date:e,format:`medium`,className:`cursor-help underline decoration-dashed decoration-border-strong underline-offset-2`})}),(0,l.jsx)(a.n,{children:(0,l.jsx)(r.t,{date:e,format:`full`,showTime:!0,className:`text-xs font-medium`})})]})}),_=({images:e})=>{if(!e?.length)return(0,l.jsx)(f,{});let t=e.length===1;return(0,l.jsx)(`div`,{"data-slot":`description-images`,className:`flex flex-wrap gap-4`,children:e.map(e=>(0,l.jsx)(`div`,{className:t?`group relative size-42 overflow-hidden rounded-sm border border-border shadow-xs transition-shadow hover:shadow-card`:`group relative size-16 overflow-hidden rounded-lg border border-border shadow-xs transition-shadow hover:shadow-card`,children:(0,l.jsx)(n.t,{src:e.src,alt:e.alt,width:`100%`,height:`100%`,className:`transition-transform duration-200 group-hover:scale-105`})},e.id))})},v=({href:e,label:t,external:n=!0,className:r})=>e?(0,l.jsxs)(`a`,{"data-slot":`description-link`,href:e,target:n?`_blank`:void 0,rel:n?`noopener noreferrer`:void 0,className:(0,u.cn)(`inline-flex max-w-full items-center gap-1 text-sm text-primary underline decoration-dashed underline-offset-2 transition-colors hover:text-primary-strong hover:decoration-solid`,r),children:[!n&&(0,l.jsx)(s.LinkIcon,{size:12,className:`shrink-0 opacity-70`}),(0,l.jsx)(`span`,{className:`truncate`,children:t??e}),n&&(0,l.jsx)(s.ExternalLinkIcon,{size:12,className:`shrink-0 opacity-70`})]}):(0,l.jsx)(f,{}),y=({content:e})=>e==null?(0,l.jsx)(f,{}):(0,l.jsxs)(a.t,{children:[(0,l.jsx)(a.i,{asChild:!0,children:(0,l.jsx)(t.t,{"data-slot":`description-longtext`,variant:`sm`,className:`line-clamp-2 cursor-pointer whitespace-pre-line break-all text-start text-sm underline decoration-dashed decoration-border-strong underline-offset-2`,children:e})}),(0,l.jsx)(a.n,{align:`start`,className:`h-fit min-w-48 max-w-80 pt-4`,children:(0,l.jsxs)(`div`,{className:`flex flex-col gap-y-2`,children:[(0,l.jsx)(`p`,{className:`whitespace-pre-line text-wrap break-keep`,children:e}),(0,l.jsxs)(`p`,{className:`w-full text-end text-text-positive-subtle`,children:[e.toString().length,` chars`]})]})})]}),b=({name:e})=>e?(0,l.jsxs)(a.t,{children:[(0,l.jsx)(a.i,{asChild:!0,children:(0,l.jsx)(t.t,{"data-slot":`description-name`,variant:`sm`,className:`line-clamp-2 w-full cursor-pointer truncate underline decoration-dashed decoration-border-strong underline-offset-2`,children:e})}),(0,l.jsx)(a.n,{align:`start`,className:`h-fit min-w-48 max-w-80 pt-4`,children:(0,l.jsxs)(`div`,{className:`flex flex-col gap-y-2`,children:[(0,l.jsx)(`p`,{className:`whitespace-pre-line text-wrap break-keep`,children:e}),(0,l.jsxs)(`p`,{className:`w-full text-end text-text-positive-subtle`,children:[e.length,` chars`]})]})})]}):(0,l.jsx)(f,{}),x=({value:e})=>(0,l.jsxs)(a.t,{children:[(0,l.jsx)(a.i,{"data-slot":`description-phone`,children:(0,l.jsx)(t.t,{variant:`sm`,className:`tabular-nums transition-colors`,children:e.replace(/(\d{3})(\d{3})(\d{4})/,`($1) $2-$3`)})}),(0,l.jsx)(a.n,{align:`start`,children:(0,l.jsx)(`p`,{className:`tabular-nums`,children:e.slice(1).replace(/(\d{2})(\d{3})(\d{4})/,`(00) (+84) ($1) $2-$3`)})})]}),S=(e,t,n)=>{let r=10**t;switch(n){case`floor`:return Math.floor(e*r)/r;case`ceil`:return Math.ceil(e*r)/r;default:return Math.round(e*r)/r}},C=(0,d.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`,up:`text-success`,down:`text-danger`}},defaultVariants:{size:`sm`,trend:`neutral`}}),w=(0,c.memo)(({decimalSeparator:e=`.`,groupSeparator:t=`,`,prefix:n,suffix:r,precision:i,roundingMode:a=`round`,showTrailingZeros:o=!1,size:s=`sm`,trend:d=`neutral`,value:p=0,className:m})=>{let h=(0,c.useMemo)(()=>{let e={};return typeof i==`number`&&i>=0&&(o&&(e.minimumFractionDigits=i),e.maximumFractionDigits=i),e},[i,o]),g=(0,c.useCallback)(e=>{let t=e;return typeof i==`number`&&i>=0&&(t=S(e,i,a)),t.toLocaleString(`en-US`,h)},[a,h,i]),_=(0,c.useMemo)(()=>{if(typeof p==`number`)return Number.isNaN(p)||!Number.isFinite(p)?`N/A`:g(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`:g(t)}return`N/A`},[p,g]),v=(0,c.useMemo)(()=>e===`.`&&t===`,`?_:_.replace(/,/g,t).replace(/\./g,e),[_,e,t]);return v===`0`||v===`N/A`||!v?(0,l.jsx)(f,{}):(0,l.jsxs)(`div`,{"data-slot":`description-statistic`,className:(0,u.cn)(C({size:s,trend:d}),m),children:[n&&(0,l.jsx)(`span`,{"data-slot":`description-statistic-prefix`,children:n}),(0,l.jsx)(`p`,{"data-slot":`description-statistic-value`,children:v}),r&&(0,l.jsx)(`span`,{"data-slot":`description-statistic-suffix`,children:r})]})});w.displayName=`DescriptionStatistic`;const T={primary:`bg-primary`,secondary:`bg-secondary`,muted:`bg-muted`,accent:`bg-accent`,info:`bg-info`,success:`bg-success`,warning:`bg-warning`,danger:`bg-danger`},E=({label:e,color:t=`info`,dot:n=!0})=>e?(0,l.jsxs)(i.t,{"data-slot":`description-status`,variant:`soft`,color:t,size:`sm`,className:`gap-1.5`,children:[n&&(0,l.jsx)(`span`,{className:(0,u.cn)(`inline-block size-1.5 shrink-0 rounded-full`,T[t])}),e]}):(0,l.jsx)(f,{}),D=({tags:e,max:t=5,color:n=`secondary`,variant:r=`soft`})=>{if(!e?.length)return(0,l.jsx)(f,{});let a=e.slice(0,t),o=e.length-a.length;return(0,l.jsxs)(`div`,{"data-slot":`description-tag-list`,className:`flex flex-wrap gap-1`,children:[a.map((e,t)=>(0,l.jsx)(i.t,{variant:r,color:n,size:`sm`,children:e},t)),o>0&&(0,l.jsxs)(i.t,{variant:`outline`,color:`muted`,size:`sm`,children:[`+`,o]})]})},O=({uuid:e,username:t,email:n})=>!e||!t||!n?(0,l.jsx)(f,{}):(0,l.jsx)(o.t,{uuid:e,username:t,email:n}),k=({label:e,labelColSpan:t=3,orientation:n=`horizontal`,action:r,children:i})=>n===`vertical`?(0,l.jsxs)(`div`,{"data-slot":`description-item`,className:`flex flex-col border-b border-b-border last:border-b-0`,children:[(0,l.jsxs)(`div`,{"data-slot":`description-item-label`,className:`flex items-center justify-between border-b border-b-border bg-secondary-muted py-2 pr-2 pl-4 text-sm font-medium text-text-positive-weak`,children:[(0,l.jsx)(`span`,{children:e}),r&&(0,l.jsx)(`div`,{className:`shrink-0`,children:r})]}),(0,l.jsx)(`div`,{"data-slot":`description-item-value`,className:`flex flex-wrap items-center gap-2 py-3 pr-2 pl-4 text-sm text-text-positive`,children:i})]}):(0,l.jsxs)(`div`,{"data-slot":`description-item`,style:{display:`grid`,gridTemplateColumns:`repeat(12, minmax(0, 1fr))`},className:`grid border-b border-b-border last:border-b-0`,children:[(0,l.jsxs)(`div`,{"data-slot":`description-item-label`,style:{gridColumn:`span ${t} / span ${t}`},className:`flex min-w-full items-center justify-between overflow-x-hidden text-wrap break-all border-r border-r-border bg-secondary-muted py-3 pr-2 pl-4 text-sm font-medium text-text-positive-weak tabular-nums`,children:[(0,l.jsx)(`span`,{children:e}),r&&(0,l.jsx)(`div`,{className:`shrink-0 pr-1`,children:r})]}),(0,l.jsx)(`div`,{"data-slot":`description-item-value`,style:{gridColumn:`span ${12-t} / span ${12-t}`},className:`flex flex-wrap items-center gap-2 py-3 pr-2 pl-4 text-sm text-text-positive`,children:i})]}),A=({title:e,description:t,extra:n,className:r})=>(0,l.jsxs)(`div`,{"data-slot":`description-header`,className:(0,u.cn)(`flex items-start justify-between gap-4 border-b border-b-border px-4 py-3`,r),children:[(0,l.jsxs)(`div`,{className:`flex flex-col gap-0.5`,children:[(0,l.jsx)(`p`,{className:`text-sm font-semibold text-text-positive`,children:e}),t&&(0,l.jsx)(`p`,{className:`text-xs text-text-positive-weak`,children:t})]}),n&&(0,l.jsx)(`div`,{className:`shrink-0`,children:n})]}),j=({title:e,className:t})=>(0,l.jsxs)(`div`,{"data-slot":`description-section`,className:(0,u.cn)(`flex items-center gap-3 border-b border-b-border bg-secondary-muted px-4 py-2`,t),children:[e&&(0,l.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-wide text-text-positive-muted`,children:e}),(0,l.jsx)(`div`,{className:`h-px flex-1 bg-border-weak`})]}),M=({children:e,className:t})=>(0,l.jsx)(`div`,{"data-slot":`description`,className:(0,u.cn)(`relative flex size-full flex-col overflow-hidden rounded-lg border border-border bg-card shadow-card ring-1 ring-border-weak`,t),children:e});exports.Description=M,exports.DescriptionBadge=p,exports.DescriptionBoolean=m,exports.DescriptionCopy=h,exports.DescriptionDate=g,exports.DescriptionEmpty=f,exports.DescriptionHeader=A,exports.DescriptionImages=_,exports.DescriptionItem=k,exports.DescriptionLink=v,exports.DescriptionLongText=y,exports.DescriptionName=b,exports.DescriptionNumberPhone=x,exports.DescriptionSection=j,exports.DescriptionStatistic=w,exports.DescriptionStatus=E,exports.DescriptionTagList=D,exports.DescriptionUser=O;
1
+ "use client";const e=require(`../../chunk-Bmb41Sf3.cjs`),t=require(`../../paragraph-DN85Huc4.cjs`);require(`../../skeleton-BfMCjXYM.cjs`);const n=require(`../../image-B1Dm5LWk.cjs`);require(`../../flex-BbbogTsZ.cjs`);const r=require(`../../date-a3RI5Pwo.cjs`),i=require(`../../badge-uQ0pIZbQ.cjs`),a=require(`../../tooltip-itUmYz9k.cjs`);require(`../../avatar-CTS9-raY.cjs`);const o=require(`../../user-BEyYLDNK.cjs`);let s=require(`lucide-react`),c=require(`react`),l=require(`react/jsx-runtime`),u=require(`@customafk/react-toolkit/utils`),d=require(`class-variance-authority`);const f=()=>(0,l.jsx)(`span`,{"data-slot":`description-empty`,"aria-label":`Empty value`,className:`select-none font-medium text-sm text-text-positive-muted`,children:`—`}),p=({label:e,color:t=`secondary`,variant:n=`soft`,size:r=`sm`})=>e?(0,l.jsx)(i.t,{"data-slot":`description-badge`,color:t,variant:n,size:r,children:e}):(0,l.jsx)(f,{}),m=({value:e,trueLabel:t=`Yes`,falseLabel:n=`No`})=>e==null?(0,l.jsx)(f,{}):(0,l.jsx)(i.t,{"data-slot":`description-boolean`,variant:`soft`,color:e?`success`:`danger`,size:`sm`,children:e?t:n}),h=({value:e,truncate:t=!0})=>{let[n,r]=(0,c.useState)(!1),i=(0,c.useCallback)(async()=>{e&&(await navigator.clipboard.writeText(e),r(!0),setTimeout(()=>r(!1),1500))},[e]);return e?(0,l.jsxs)(`button`,{type:`button`,"data-slot":`description-copy`,onClick:i,className:(0,u.cn)(`group inline-flex max-w-full cursor-pointer items-center gap-1.5 rounded-sm border border-border-weak bg-secondary-muted px-2 py-0.5 font-mono text-xs text-text-positive-weak transition-[border-color,color,box-shadow] hover:border-border hover:text-text-positive hover:shadow-xs`,t&&`min-w-0`),children:[(0,l.jsx)(`span`,{className:(0,u.cn)(`tabular-nums`,t&&`truncate`),children:e}),n?(0,l.jsx)(s.CheckIcon,{size:12,className:`shrink-0 text-success`}):(0,l.jsx)(s.CopyIcon,{size:12,className:`shrink-0 opacity-50 group-hover:opacity-100`})]}):(0,l.jsx)(f,{})},g=({date:e})=>e==null?(0,l.jsx)(f,{}):(0,l.jsx)(a.r,{children:(0,l.jsxs)(a.t,{children:[(0,l.jsx)(a.i,{asChild:!0,children:(0,l.jsx)(r.t,{"data-slot":`description-date`,date:e,format:`medium`,className:`cursor-help underline decoration-dashed decoration-border-strong underline-offset-2`})}),(0,l.jsx)(a.n,{children:(0,l.jsx)(r.t,{date:e,format:`full`,showTime:!0,className:`text-xs font-medium`})})]})}),_=({images:e})=>{if(!e?.length)return(0,l.jsx)(f,{});let t=e.length===1;return(0,l.jsx)(`div`,{"data-slot":`description-images`,className:`flex flex-wrap gap-4`,children:e.map(e=>(0,l.jsx)(`div`,{className:t?`group relative size-42 overflow-hidden rounded-sm border border-border shadow-xs transition-shadow hover:shadow-card`:`group relative size-16 overflow-hidden rounded-lg border border-border shadow-xs transition-shadow hover:shadow-card`,children:(0,l.jsx)(n.t,{src:e.src,alt:e.alt,width:`100%`,height:`100%`,className:`transition-transform duration-200 group-hover:scale-105`})},e.id))})},v=({href:e,label:t,external:n=!0,className:r})=>e?(0,l.jsxs)(`a`,{"data-slot":`description-link`,href:e,target:n?`_blank`:void 0,rel:n?`noopener noreferrer`:void 0,className:(0,u.cn)(`inline-flex max-w-full items-center gap-1 text-sm text-primary underline decoration-dashed underline-offset-2 transition-colors hover:text-primary-strong hover:decoration-solid`,r),children:[!n&&(0,l.jsx)(s.LinkIcon,{size:12,className:`shrink-0 opacity-70`}),(0,l.jsx)(`span`,{className:`truncate`,children:t??e}),n&&(0,l.jsx)(s.ExternalLinkIcon,{size:12,className:`shrink-0 opacity-70`})]}):(0,l.jsx)(f,{}),y=({content:e})=>e==null?(0,l.jsx)(f,{}):(0,l.jsxs)(a.t,{children:[(0,l.jsx)(a.i,{asChild:!0,children:(0,l.jsx)(t.t,{"data-slot":`description-longtext`,variant:`sm`,className:`line-clamp-2 cursor-pointer whitespace-pre-line break-all text-start text-sm underline decoration-dashed decoration-border-strong underline-offset-2`,children:e})}),(0,l.jsx)(a.n,{align:`start`,className:`h-fit min-w-48 max-w-80 pt-4`,children:(0,l.jsxs)(`div`,{className:`flex flex-col gap-y-2`,children:[(0,l.jsx)(`p`,{className:`whitespace-pre-line text-wrap break-keep`,children:e}),(0,l.jsxs)(`p`,{className:`w-full text-end text-text-positive-subtle`,children:[e.toString().length,` chars`]})]})})]}),b=({name:e})=>e?(0,l.jsxs)(a.t,{children:[(0,l.jsx)(a.i,{asChild:!0,children:(0,l.jsx)(t.t,{"data-slot":`description-name`,variant:`sm`,className:`line-clamp-2 w-full cursor-pointer truncate underline decoration-dashed decoration-border-strong underline-offset-2`,children:e})}),(0,l.jsx)(a.n,{align:`start`,className:`h-fit min-w-48 max-w-80 pt-4`,children:(0,l.jsxs)(`div`,{className:`flex flex-col gap-y-2`,children:[(0,l.jsx)(`p`,{className:`whitespace-pre-line text-wrap break-keep`,children:e}),(0,l.jsxs)(`p`,{className:`w-full text-end text-text-positive-subtle`,children:[e.length,` chars`]})]})})]}):(0,l.jsx)(f,{}),x=({value:e})=>(0,l.jsxs)(a.t,{children:[(0,l.jsx)(a.i,{"data-slot":`description-phone`,children:(0,l.jsx)(t.t,{variant:`sm`,className:`tabular-nums transition-colors`,children:e.replace(/(\d{3})(\d{3})(\d{4})/,`($1) $2-$3`)})}),(0,l.jsx)(a.n,{align:`start`,children:(0,l.jsx)(`p`,{className:`tabular-nums`,children:e.slice(1).replace(/(\d{2})(\d{3})(\d{4})/,`(00) (+84) ($1) $2-$3`)})})]}),S=(e,t,n)=>{let r=10**t;switch(n){case`floor`:return Math.floor(e*r)/r;case`ceil`:return Math.ceil(e*r)/r;default:return Math.round(e*r)/r}},C=(0,d.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`,up:`text-success`,down:`text-danger`}},defaultVariants:{size:`sm`,trend:`neutral`}}),w=(0,c.memo)(({decimalSeparator:e=`.`,groupSeparator:t=`,`,prefix:n,suffix:r,precision:i,roundingMode:a=`round`,showTrailingZeros:o=!1,size:s=`sm`,trend:d=`neutral`,value:p=0,className:m})=>{let h=(0,c.useMemo)(()=>{let e={};return typeof i==`number`&&i>=0&&(o&&(e.minimumFractionDigits=i),e.maximumFractionDigits=i),e},[i,o]),g=(0,c.useCallback)(e=>{let t=e;return typeof i==`number`&&i>=0&&(t=S(e,i,a)),t.toLocaleString(`en-US`,h)},[a,h,i]),_=(0,c.useMemo)(()=>{if(typeof p==`number`)return Number.isNaN(p)||!Number.isFinite(p)?`N/A`:g(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`:g(t)}return`N/A`},[p,g]),v=(0,c.useMemo)(()=>e===`.`&&t===`,`?_:_.replace(/,/g,t).replace(/\./g,e),[_,e,t]);return v===`0`||v===`N/A`||!v?(0,l.jsx)(f,{}):(0,l.jsxs)(`div`,{"data-slot":`description-statistic`,className:(0,u.cn)(C({size:s,trend:d}),m),children:[n&&(0,l.jsx)(`span`,{"data-slot":`description-statistic-prefix`,children:n}),(0,l.jsx)(`p`,{"data-slot":`description-statistic-value`,children:v}),r&&(0,l.jsx)(`span`,{"data-slot":`description-statistic-suffix`,children:r})]})});w.displayName=`DescriptionStatistic`;const T={primary:`bg-primary`,secondary:`bg-secondary`,muted:`bg-muted`,accent:`bg-accent`,info:`bg-info`,success:`bg-success`,warning:`bg-warning`,danger:`bg-danger`},E=({label:e,color:t=`info`,dot:n=!0})=>e?(0,l.jsxs)(i.t,{"data-slot":`description-status`,variant:`soft`,color:t,size:`sm`,className:`gap-1.5`,children:[n&&(0,l.jsx)(`span`,{className:(0,u.cn)(`inline-block size-1.5 shrink-0 rounded-full`,T[t])}),e]}):(0,l.jsx)(f,{}),D=({tags:e,max:t=5,color:n=`secondary`,variant:r=`soft`})=>{if(!e?.length)return(0,l.jsx)(f,{});let a=e.slice(0,t),o=e.length-a.length;return(0,l.jsxs)(`div`,{"data-slot":`description-tag-list`,className:`flex flex-wrap gap-1`,children:[a.map((e,t)=>(0,l.jsx)(i.t,{variant:r,color:n,size:`sm`,children:e},t)),o>0&&(0,l.jsxs)(i.t,{variant:`outline`,color:`muted`,size:`sm`,children:[`+`,o]})]})},O=({uuid:e,username:t,email:n})=>!e||!t||!n?(0,l.jsx)(f,{}):(0,l.jsx)(o.t,{uuid:e,username:t,email:n}),k=(0,c.createContext)(!1),A=({label:e,labelColSpan:t=3,orientation:n=`horizontal`,action:r,children:i})=>n===`vertical`?(0,l.jsxs)(`div`,{"data-slot":`description-item`,className:`flex flex-col border-b border-b-border last:border-b-0`,children:[(0,l.jsxs)(`div`,{"data-slot":`description-item-label`,className:`flex items-center justify-between border-b border-b-border bg-secondary-muted py-2 pr-2 pl-4 text-sm font-medium text-text-positive-weak`,children:[(0,l.jsx)(`span`,{children:e}),r&&(0,l.jsx)(`div`,{className:`shrink-0`,children:r})]}),(0,l.jsx)(`div`,{"data-slot":`description-item-value`,className:`flex flex-wrap items-center gap-2 py-3 pr-2 pl-4 text-sm text-text-positive`,children:i})]}):(0,l.jsxs)(`div`,{"data-slot":`description-item`,style:{display:`grid`,gridTemplateColumns:`repeat(12, minmax(0, 1fr))`},className:`grid border-b border-b-border last:border-b-0`,children:[(0,l.jsxs)(`div`,{"data-slot":`description-item-label`,style:{gridColumn:`span ${t} / span ${t}`},className:`flex min-w-full items-center justify-between overflow-x-hidden text-wrap break-all border-r border-r-border bg-secondary-muted py-3 pr-2 pl-4 text-sm font-medium text-text-positive-weak tabular-nums`,children:[(0,l.jsx)(`span`,{children:e}),r&&(0,l.jsx)(`div`,{className:`shrink-0 pr-1`,children:r})]}),(0,l.jsx)(`div`,{"data-slot":`description-item-value`,style:{gridColumn:`span ${12-t} / span ${12-t}`},className:`flex flex-wrap items-center gap-2 py-3 pr-2 pl-4 text-sm text-text-positive`,children:i})]}),j=({title:e,description:t,extra:n,className:r})=>(0,l.jsxs)(`div`,{"data-slot":`description-header`,className:(0,u.cn)(`sticky top-0 z-10 flex items-start justify-between gap-4 border-b border-b-border bg-card px-4 py-3`,r),children:[(0,l.jsxs)(`div`,{className:`flex flex-col gap-0.5`,children:[(0,l.jsx)(`p`,{className:`text-sm font-semibold text-text-positive`,children:e}),t&&(0,l.jsx)(`p`,{className:`text-xs text-text-positive-weak`,children:t})]}),n&&(0,l.jsx)(`div`,{className:`shrink-0`,children:n})]}),M=({title:e,className:t})=>(0,l.jsxs)(`div`,{"data-slot":`description-section`,className:(0,u.cn)(`flex items-center gap-3 border-b border-b-border bg-secondary-muted px-4 py-2`,t),children:[e&&(0,l.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-wide text-text-positive-muted`,children:e}),(0,l.jsx)(`div`,{className:`h-px flex-1 bg-border-weak`})]}),N=({rows:e})=>(0,l.jsxs)(`div`,{"data-slot":`description-loading`,className:`animate-pulse`,children:[(0,l.jsxs)(`div`,{className:`flex items-center justify-between border-b border-b-border px-4 py-3`,children:[(0,l.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[(0,l.jsx)(`div`,{className:`h-3.5 w-36 rounded bg-border`}),(0,l.jsx)(`div`,{className:`h-2.5 w-24 rounded bg-border-weak`})]}),(0,l.jsx)(`div`,{className:`h-5 w-16 rounded bg-border-weak`})]}),Array.from({length:e}).map((e,t)=>(0,l.jsxs)(`div`,{style:{display:`grid`,gridTemplateColumns:`repeat(12, minmax(0, 1fr))`},className:`grid border-b border-b-border last:border-b-0`,children:[(0,l.jsx)(`div`,{style:{gridColumn:`span 3 / span 3`},className:`flex items-center border-r border-r-border bg-secondary-muted py-3 pl-4 pr-2`,children:(0,l.jsx)(`div`,{className:`h-3 w-20 rounded bg-border`})}),(0,l.jsx)(`div`,{style:{gridColumn:`span 9 / span 9`},className:`flex items-center py-3 pl-4 pr-2`,children:(0,l.jsx)(`div`,{className:`h-3 w-28 rounded bg-border-weak`})})]},t))]}),P=({children:e,className:t,nested:n=!1,loading:r=!1,loadingRows:i=4})=>{let a=(0,c.useContext)(k);return(0,l.jsx)(`div`,{"data-slot":`description`,className:(0,u.cn)(`relative flex flex-col bg-card`,a?`border-b border-b-border last:border-b-0`:n?`w-full overflow-hidden rounded-md border border-border`:`size-full overflow-y-auto rounded-lg border border-border shadow-card ring-1 ring-border-weak`,t),children:r?(0,l.jsx)(N,{rows:i}):e})},F=({children:e,className:t})=>(0,l.jsx)(k.Provider,{value:!0,children:(0,l.jsx)(`div`,{"data-slot":`description-group`,className:(0,u.cn)(`relative size-full overflow-y-auto rounded-lg border border-border bg-card shadow-card ring-1 ring-border-weak`,t),children:e})});exports.Description=P,exports.DescriptionBadge=p,exports.DescriptionBoolean=m,exports.DescriptionCopy=h,exports.DescriptionDate=g,exports.DescriptionEmpty=f,exports.DescriptionGroup=F,exports.DescriptionHeader=j,exports.DescriptionImages=_,exports.DescriptionItem=A,exports.DescriptionLink=v,exports.DescriptionLongText=y,exports.DescriptionName=b,exports.DescriptionNumberPhone=x,exports.DescriptionSection=M,exports.DescriptionStatistic=w,exports.DescriptionStatus=E,exports.DescriptionTagList=D,exports.DescriptionUser=O;
2
2
  //# sourceMappingURL=index.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","names":["DescriptionEmpty: React.FC","DescriptionBadge: React.FC<DescriptionBadgeProps>","Badge","DescriptionBoolean: React.FC<DescriptionBooleanProps>","Badge","DescriptionCopy: React.FC<DescriptionCopyProps>","CheckIcon","CopyIcon","DescriptionDate: React.FC<DescriptionDateProps>","TooltipProvider","Tooltip","TooltipTrigger","DateDisplay","TooltipContent","DescriptionImages: React.FC<{\n images?: Array<ImageItem> | null | undefined;\n}>","Image","DescriptionLink: React.FC<DescriptionLinkProps>","LinkIcon","ExternalLinkIcon","DescriptionLongText: React.FC<{ content: string | null | undefined | number }>","Tooltip","TooltipTrigger","Paragraph","TooltipContent","DescriptionName: React.FC<{\n name?: string | null | undefined;\n}>","Tooltip","TooltipTrigger","Paragraph","TooltipContent","DescriptionNumberPhone: React.FC<{ value: string }>","Tooltip","TooltipTrigger","Paragraph","TooltipContent","options: Intl.NumberFormatOptions","dotColorMap: Record<StatusColor, string>","DescriptionStatus: React.FC<DescriptionStatusProps>","Badge","DescriptionTagList: React.FC<DescriptionTagListProps>","Badge","DescriptionUser: React.FC<DescriptionUserProps>","UserDataDisplay","DescriptionItem: React.FC<\n React.PropsWithChildren<{\n /** Text displayed in the label column. */\n label: string;\n /**\n * Number of grid columns (out of 12) allocated to the label in horizontal orientation.\n * @default 3\n */\n labelColSpan?: number;\n /**\n * Layout direction of the label/value pair.\n * - `'horizontal'` — label and value are side by side.\n * - `'vertical'` — label sits above the value.\n * @default 'horizontal'\n */\n orientation?: 'horizontal' | 'vertical';\n /** Optional node rendered in the top-right corner of the label area (e.g. an edit action). */\n action?: React.ReactNode;\n }>\n>","DescriptionHeader: React.FC<{\n /** Primary heading text. */\n title: string;\n /** Optional secondary text rendered below the title in a smaller, muted style. */\n description?: string;\n /** Optional node rendered on the right side of the header (e.g. action buttons). */\n extra?: React.ReactNode;\n /** Additional CSS class names applied to the header wrapper. */\n className?: string;\n}>","DescriptionSection: React.FC<{\n /** Optional section label rendered as uppercase small-caps text beside the divider line. */\n title?: string;\n /** Additional CSS class names applied to the section wrapper. */\n className?: string;\n}>","Description: React.FC<\n React.PropsWithChildren<{\n /** Additional CSS class names applied to the root wrapper element. */\n className?: string;\n }>\n>"],"sources":["../../../packages/components/features/descriptions/components/empty.tsx","../../../packages/components/features/descriptions/components/badge.tsx","../../../packages/components/features/descriptions/components/boolean.tsx","../../../packages/components/features/descriptions/components/copy.tsx","../../../packages/components/features/descriptions/components/date.tsx","../../../packages/components/features/descriptions/components/images.tsx","../../../packages/components/features/descriptions/components/link.tsx","../../../packages/components/features/descriptions/components/longtext.tsx","../../../packages/components/features/descriptions/components/name.tsx","../../../packages/components/features/descriptions/components/number-phone.tsx","../../../packages/components/features/descriptions/components/statistic.tsx","../../../packages/components/features/descriptions/components/status.tsx","../../../packages/components/features/descriptions/components/tag-list.tsx","../../../packages/components/features/descriptions/components/user.tsx","../../../packages/components/features/descriptions/index.tsx"],"sourcesContent":["'use client';\n\nexport const DescriptionEmpty: React.FC = () => {\n return (\n <span data-slot=\"description-empty\" aria-label=\"Empty value\" className=\"select-none font-medium text-sm text-text-positive-muted\">\n —\n </span>\n );\n};\n","'use client';\n\nimport { Badge } from '@/components/ui/badge';\nimport type { BadgeProps } from '@/components/ui/badge';\n\nimport { DescriptionEmpty } from './empty';\n\ntype DescriptionBadgeProps = {\n label: string | number | null | undefined;\n color?: BadgeProps['color'];\n variant?: BadgeProps['variant'];\n size?: BadgeProps['size'];\n};\n\nexport const DescriptionBadge: React.FC<DescriptionBadgeProps> = ({ label, color = 'secondary', variant = 'soft', size = 'sm' }) => {\n if (!label) return <DescriptionEmpty />;\n return (\n <Badge data-slot=\"description-badge\" color={color} variant={variant} size={size}>\n {label}\n </Badge>\n );\n};\n","'use client';\n\nimport { Badge } from '@/components/ui/badge';\n\nimport { DescriptionEmpty } from './empty';\n\ntype DescriptionBooleanProps = {\n value: boolean | null | undefined;\n trueLabel?: string;\n falseLabel?: string;\n};\n\nexport const DescriptionBoolean: React.FC<DescriptionBooleanProps> = ({ value, trueLabel = 'Yes', falseLabel = 'No' }) => {\n if (value == null) return <DescriptionEmpty />;\n return (\n <Badge data-slot=\"description-boolean\" variant=\"soft\" color={value ? 'success' : 'danger'} size=\"sm\">\n {value ? trueLabel : falseLabel}\n </Badge>\n );\n};\n","'use client';\n\nimport { useCallback, useState } from 'react';\nimport { CheckIcon, CopyIcon } from 'lucide-react';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { DescriptionEmpty } from './empty';\n\ntype DescriptionCopyProps = {\n value: string | null | undefined;\n truncate?: boolean;\n};\n\nexport const DescriptionCopy: React.FC<DescriptionCopyProps> = ({ value, truncate = true }) => {\n const [copied, setCopied] = useState(false);\n\n const handleCopy = useCallback(async () => {\n if (!value) return;\n await navigator.clipboard.writeText(value);\n setCopied(true);\n setTimeout(() => setCopied(false), 1500);\n }, [value]);\n\n if (!value) return <DescriptionEmpty />;\n\n return (\n <button\n type=\"button\"\n data-slot=\"description-copy\"\n onClick={handleCopy}\n className={cn(\n 'group inline-flex max-w-full cursor-pointer items-center gap-1.5 rounded-sm border border-border-weak bg-secondary-muted px-2 py-0.5 font-mono text-xs text-text-positive-weak transition-[border-color,color,box-shadow] hover:border-border hover:text-text-positive hover:shadow-xs',\n truncate && 'min-w-0'\n )}\n >\n <span className={cn('tabular-nums', truncate && 'truncate')}>{value}</span>\n {copied ? <CheckIcon size={12} className=\"shrink-0 text-success\" /> : <CopyIcon size={12} className=\"shrink-0 opacity-50 group-hover:opacity-100\" />}\n </button>\n );\n};\n","'use client';\n\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';\nimport { DateDisplay } from '@/components/data-display/date';\n\nimport { DescriptionEmpty } from './empty';\n\ntype DescriptionDateProps = {\n date: Date | string | number | null | undefined;\n};\n\nexport const DescriptionDate: React.FC<DescriptionDateProps> = ({ date }) => {\n if (date == null) return <DescriptionEmpty />;\n return (\n <TooltipProvider>\n <Tooltip>\n <TooltipTrigger asChild>\n <DateDisplay\n data-slot=\"description-date\"\n date={date}\n format=\"medium\"\n className=\"cursor-help underline decoration-dashed decoration-border-strong underline-offset-2\"\n />\n </TooltipTrigger>\n <TooltipContent>\n <DateDisplay date={date} format=\"full\" showTime className=\"text-xs font-medium\" />\n </TooltipContent>\n </Tooltip>\n </TooltipProvider>\n );\n};\n","'use client';\n\nimport { Image } from '@/components/ui/image';\n\nimport { DescriptionEmpty } from './empty';\n\ntype ImageItem = { id: string; src: string; alt: string };\n\nexport const DescriptionImages: React.FC<{\n images?: Array<ImageItem> | null | undefined;\n}> = ({ images }) => {\n if (!images?.length) return <DescriptionEmpty />;\n\n const isSingle = images.length === 1;\n\n return (\n <div data-slot=\"description-images\" className=\"flex flex-wrap gap-4\">\n {images.map(image => (\n <div\n key={image.id}\n className={\n isSingle\n ? 'group relative size-42 overflow-hidden rounded-sm border border-border shadow-xs transition-shadow hover:shadow-card'\n : 'group relative size-16 overflow-hidden rounded-lg border border-border shadow-xs transition-shadow hover:shadow-card'\n }\n >\n <Image src={image.src} alt={image.alt} width=\"100%\" height=\"100%\" className=\"transition-transform duration-200 group-hover:scale-105\" />\n </div>\n ))}\n </div>\n );\n};\n","'use client';\n\nimport { ExternalLinkIcon, LinkIcon } from 'lucide-react';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { DescriptionEmpty } from './empty';\n\ntype DescriptionLinkProps = {\n href: string | null | undefined;\n label?: string;\n external?: boolean;\n className?: string;\n};\n\nexport const DescriptionLink: React.FC<DescriptionLinkProps> = ({ href, label, external = true, className }) => {\n if (!href) return <DescriptionEmpty />;\n\n return (\n <a\n data-slot=\"description-link\"\n href={href}\n target={external ? '_blank' : undefined}\n rel={external ? 'noopener noreferrer' : undefined}\n className={cn(\n 'inline-flex max-w-full items-center gap-1 text-sm text-primary underline decoration-dashed underline-offset-2 transition-colors hover:text-primary-strong hover:decoration-solid',\n className\n )}\n >\n {!external && <LinkIcon size={12} className=\"shrink-0 opacity-70\" />}\n <span className=\"truncate\">{label ?? href}</span>\n {external && <ExternalLinkIcon size={12} className=\"shrink-0 opacity-70\" />}\n </a>\n );\n};\n","'use client';\n\nimport { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';\nimport { Paragraph } from '@/components/typography/paragraph';\n\nimport { DescriptionEmpty } from './empty';\n\nexport const DescriptionLongText: React.FC<{ content: string | null | undefined | number }> = ({ content }) => {\n if (content == null) return <DescriptionEmpty />;\n return (\n <Tooltip>\n <TooltipTrigger asChild>\n <Paragraph\n data-slot=\"description-longtext\"\n variant=\"sm\"\n className=\"line-clamp-2 cursor-pointer whitespace-pre-line break-all text-start text-sm underline decoration-dashed decoration-border-strong underline-offset-2\"\n >\n {content}\n </Paragraph>\n </TooltipTrigger>\n <TooltipContent align=\"start\" className=\"h-fit min-w-48 max-w-80 pt-4\">\n <div className=\"flex flex-col gap-y-2\">\n <p className=\"whitespace-pre-line text-wrap break-keep\">{content}</p>\n <p className=\"w-full text-end text-text-positive-subtle\">{content.toString().length} chars</p>\n </div>\n </TooltipContent>\n </Tooltip>\n );\n};\n","'use client';\n\nimport { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';\nimport { Paragraph } from '@/components/typography/paragraph';\n\nimport { DescriptionEmpty } from './empty';\n\nexport const DescriptionName: React.FC<{\n name?: string | null | undefined;\n}> = ({ name }) => {\n if (!name) return <DescriptionEmpty />;\n return (\n <Tooltip>\n <TooltipTrigger asChild>\n <Paragraph\n data-slot=\"description-name\"\n variant=\"sm\"\n className=\"line-clamp-2 w-full cursor-pointer truncate underline decoration-dashed decoration-border-strong underline-offset-2\"\n >\n {name}\n </Paragraph>\n </TooltipTrigger>\n <TooltipContent align=\"start\" className=\"h-fit min-w-48 max-w-80 pt-4\">\n <div className=\"flex flex-col gap-y-2\">\n <p className=\"whitespace-pre-line text-wrap break-keep\">{name}</p>\n <p className=\"w-full text-end text-text-positive-subtle\">{name.length} chars</p>\n </div>\n </TooltipContent>\n </Tooltip>\n );\n};\n","'use client';\n\nimport { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';\nimport { Paragraph } from '@/components/typography/paragraph';\n\nexport const DescriptionNumberPhone: React.FC<{ value: string }> = ({ value }) => {\n return (\n <Tooltip>\n <TooltipTrigger data-slot=\"description-phone\">\n <Paragraph variant=\"sm\" className=\"tabular-nums transition-colors\">\n {value.replace(/(\\d{3})(\\d{3})(\\d{4})/, '($1) $2-$3')}\n </Paragraph>\n </TooltipTrigger>\n <TooltipContent align=\"start\">\n <p className=\"tabular-nums\">{value.slice(1).replace(/(\\d{2})(\\d{3})(\\d{4})/, '(00) (+84) ($1) $2-$3')}</p>\n </TooltipContent>\n </Tooltip>\n );\n};\n","'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\nimport { DescriptionEmpty } from './empty';\n\nconst applyRounding = (num: number, precisionValue: number, roundingMode?: 'round' | 'floor' | 'ceil') => {\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\nconst descriptionStatisticVariants = 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',\n up: 'text-success',\n down: 'text-danger',\n },\n },\n defaultVariants: {\n size: 'sm',\n trend: 'neutral',\n },\n});\n\nexport type DescriptionStatisticProps = VariantProps<typeof descriptionStatisticVariants> & {\n decimalSeparator?: string;\n groupSeparator?: string;\n prefix?: React.ReactNode;\n suffix?: React.ReactNode;\n precision?: number;\n roundingMode?: 'round' | 'floor' | 'ceil';\n showTrailingZeros?: boolean;\n value: number | string | null | undefined;\n className?: string;\n};\n\nexport const DescriptionStatistic = memo(\n ({\n decimalSeparator = '.',\n groupSeparator = ',',\n prefix: Prefix,\n suffix: Suffix,\n precision,\n roundingMode = 'round',\n showTrailingZeros = false,\n size = 'sm',\n trend = 'neutral',\n value = 0,\n className,\n }: DescriptionStatisticProps) => {\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, roundingMode);\n }\n return processedNum.toLocaleString('en-US', formatOptions);\n },\n [roundingMode, 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 if (finalFormattedValue === '0' || finalFormattedValue === 'N/A' || !finalFormattedValue) {\n return <DescriptionEmpty />;\n }\n\n return (\n <div data-slot=\"description-statistic\" className={cn(descriptionStatisticVariants({ size, trend }), className)}>\n {Prefix && <span data-slot=\"description-statistic-prefix\">{Prefix}</span>}\n <p data-slot=\"description-statistic-value\">{finalFormattedValue}</p>\n {Suffix && <span data-slot=\"description-statistic-suffix\">{Suffix}</span>}\n </div>\n );\n }\n);\nDescriptionStatistic.displayName = 'DescriptionStatistic';\n","'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Badge } from '@/components/ui/badge';\nimport type { BadgeProps } from '@/components/ui/badge';\n\nimport { DescriptionEmpty } from './empty';\n\ntype StatusColor = NonNullable<BadgeProps['color']>;\n\nconst dotColorMap: Record<StatusColor, string> = {\n primary: 'bg-primary',\n secondary: 'bg-secondary',\n muted: 'bg-muted',\n accent: 'bg-accent',\n info: 'bg-info',\n success: 'bg-success',\n warning: 'bg-warning',\n danger: 'bg-danger',\n};\n\ntype DescriptionStatusProps = {\n label: string | null | undefined;\n color?: StatusColor;\n dot?: boolean;\n};\n\nexport const DescriptionStatus: React.FC<DescriptionStatusProps> = ({ label, color = 'info', dot = true }) => {\n if (!label) return <DescriptionEmpty />;\n return (\n <Badge data-slot=\"description-status\" variant=\"soft\" color={color} size=\"sm\" className=\"gap-1.5\">\n {dot && <span className={cn('inline-block size-1.5 shrink-0 rounded-full', dotColorMap[color])} />}\n {label}\n </Badge>\n );\n};\n","'use client';\n\nimport { Badge } from '@/components/ui/badge';\nimport type { BadgeProps } from '@/components/ui/badge';\n\nimport { DescriptionEmpty } from './empty';\n\ntype DescriptionTagListProps = {\n tags: Array<string | number> | null | undefined;\n max?: number;\n color?: BadgeProps['color'];\n variant?: BadgeProps['variant'];\n};\n\nexport const DescriptionTagList: React.FC<DescriptionTagListProps> = ({ tags, max = 5, color = 'secondary', variant = 'soft' }) => {\n if (!tags?.length) return <DescriptionEmpty />;\n\n const visible = tags.slice(0, max);\n const overflow = tags.length - visible.length;\n\n return (\n <div data-slot=\"description-tag-list\" className=\"flex flex-wrap gap-1\">\n {visible.map((tag, i) => (\n // biome-ignore lint/suspicious/noArrayIndexKey: static display list\n <Badge key={i} variant={variant} color={color} size=\"sm\">\n {tag}\n </Badge>\n ))}\n {overflow > 0 && (\n <Badge variant=\"outline\" color=\"muted\" size=\"sm\">\n +{overflow}\n </Badge>\n )}\n </div>\n );\n};\n","'use client';\n\nimport { UserDataDisplay } from '@/components/data-display/user';\n\nimport { DescriptionEmpty } from './empty';\n\ntype DescriptionUserProps = {\n uuid?: string | null;\n username?: string | null;\n email?: string | null;\n};\n\nexport const DescriptionUser: React.FC<DescriptionUserProps> = ({ uuid, username, email }) => {\n if (!uuid || !username || !email) return <DescriptionEmpty />;\n return <UserDataDisplay uuid={uuid} username={username} email={email} />;\n};\n","'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nexport * from './components';\n\n/**\n * A single labeled row within a {@link Description} container, supporting both horizontal (side-by-side label/value) and vertical (stacked) layouts.\n *\n * @example\n * import { Description, DescriptionItem } from '@customafk/lunas-ui/features/descriptions';\n *\n * <Description>\n * <DescriptionItem label=\"Full name\">John Doe</DescriptionItem>\n * <DescriptionItem label=\"Email\" orientation=\"vertical\">john@example.com</DescriptionItem>\n * </Description>\n */\nexport const DescriptionItem: React.FC<\n React.PropsWithChildren<{\n /** Text displayed in the label column. */\n label: string;\n /**\n * Number of grid columns (out of 12) allocated to the label in horizontal orientation.\n * @default 3\n */\n labelColSpan?: number;\n /**\n * Layout direction of the label/value pair.\n * - `'horizontal'` — label and value are side by side.\n * - `'vertical'` — label sits above the value.\n * @default 'horizontal'\n */\n orientation?: 'horizontal' | 'vertical';\n /** Optional node rendered in the top-right corner of the label area (e.g. an edit action). */\n action?: React.ReactNode;\n }>\n> = ({ label, labelColSpan = 3, orientation = 'horizontal', action, children }) => {\n if (orientation === 'vertical') {\n return (\n <div data-slot=\"description-item\" className=\"flex flex-col border-b border-b-border last:border-b-0\">\n <div\n data-slot=\"description-item-label\"\n className=\"flex items-center justify-between border-b border-b-border bg-secondary-muted py-2 pr-2 pl-4 text-sm font-medium text-text-positive-weak\"\n >\n <span>{label}</span>\n {action && <div className=\"shrink-0\">{action}</div>}\n </div>\n <div data-slot=\"description-item-value\" className=\"flex flex-wrap items-center gap-2 py-3 pr-2 pl-4 text-sm text-text-positive\">\n {children}\n </div>\n </div>\n );\n }\n\n return (\n <div\n data-slot=\"description-item\"\n style={{ display: 'grid', gridTemplateColumns: 'repeat(12, minmax(0, 1fr))' }}\n className=\"grid border-b border-b-border last:border-b-0\"\n >\n <div\n data-slot=\"description-item-label\"\n style={{ gridColumn: `span ${labelColSpan} / span ${labelColSpan}` }}\n className=\"flex min-w-full items-center justify-between overflow-x-hidden text-wrap break-all border-r border-r-border bg-secondary-muted py-3 pr-2 pl-4 text-sm font-medium text-text-positive-weak tabular-nums\"\n >\n <span>{label}</span>\n {action && <div className=\"shrink-0 pr-1\">{action}</div>}\n </div>\n <div\n data-slot=\"description-item-value\"\n style={{ gridColumn: `span ${12 - labelColSpan} / span ${12 - labelColSpan}` }}\n className=\"flex flex-wrap items-center gap-2 py-3 pr-2 pl-4 text-sm text-text-positive\"\n >\n {children}\n </div>\n </div>\n );\n};\n\n/**\n * A header bar for a {@link Description} block, showing a title, an optional subtitle, and an optional trailing action area.\n *\n * @example\n * import { Description, DescriptionHeader } from '@customafk/lunas-ui/features/descriptions';\n *\n * <Description>\n * <DescriptionHeader title=\"User details\" description=\"Read-only overview\" extra={<EditBtn />} />\n * </Description>\n */\nexport const DescriptionHeader: React.FC<{\n /** Primary heading text. */\n title: string;\n /** Optional secondary text rendered below the title in a smaller, muted style. */\n description?: string;\n /** Optional node rendered on the right side of the header (e.g. action buttons). */\n extra?: React.ReactNode;\n /** Additional CSS class names applied to the header wrapper. */\n className?: string;\n}> = ({ title, description, extra, className }) => {\n return (\n <div data-slot=\"description-header\" className={cn('flex items-start justify-between gap-4 border-b border-b-border px-4 py-3', className)}>\n <div className=\"flex flex-col gap-0.5\">\n <p className=\"text-sm font-semibold text-text-positive\">{title}</p>\n {description && <p className=\"text-xs text-text-positive-weak\">{description}</p>}\n </div>\n {extra && <div className=\"shrink-0\">{extra}</div>}\n </div>\n );\n};\n\n/**\n * A visual section divider inside a {@link Description} container that optionally displays a section title with a decorative horizontal rule.\n *\n * @example\n * import { Description, DescriptionSection, DescriptionItem } from '@customafk/lunas-ui/features/descriptions';\n *\n * <Description>\n * <DescriptionSection title=\"Contact\" />\n * <DescriptionItem label=\"Email\">john@example.com</DescriptionItem>\n * </Description>\n */\nexport const DescriptionSection: React.FC<{\n /** Optional section label rendered as uppercase small-caps text beside the divider line. */\n title?: string;\n /** Additional CSS class names applied to the section wrapper. */\n className?: string;\n}> = ({ title, className }) => {\n return (\n <div data-slot=\"description-section\" className={cn('flex items-center gap-3 border-b border-b-border bg-secondary-muted px-4 py-2', className)}>\n {title && <p className=\"text-xs font-semibold uppercase tracking-wide text-text-positive-muted\">{title}</p>}\n <div className=\"h-px flex-1 bg-border-weak\" />\n </div>\n );\n};\n\n/**\n * Root container for a description block — a bordered, rounded card that groups {@link DescriptionHeader}, {@link DescriptionSection}, and {@link DescriptionItem} elements.\n *\n * @example\n * import { Description, DescriptionHeader, DescriptionItem } from '@customafk/lunas-ui/features/descriptions';\n *\n * <Description>\n * <DescriptionHeader title=\"Order #1234\" />\n * <DescriptionItem label=\"Status\">Shipped</DescriptionItem>\n * <DescriptionItem label=\"Total\">$99.00</DescriptionItem>\n * </Description>\n */\nexport const Description: React.FC<\n React.PropsWithChildren<{\n /** Additional CSS class names applied to the root wrapper element. */\n className?: string;\n }>\n> = ({ children, className }) => {\n return (\n <div\n data-slot=\"description\"\n className={cn('relative flex size-full flex-col overflow-hidden rounded-lg border border-border bg-card shadow-card ring-1 ring-border-weak', className)}\n >\n {children}\n </div>\n );\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"index.cjs","names":["DescriptionEmpty: React.FC","DescriptionBadge: React.FC<DescriptionBadgeProps>","Badge","DescriptionBoolean: React.FC<DescriptionBooleanProps>","Badge","DescriptionCopy: React.FC<DescriptionCopyProps>","CheckIcon","CopyIcon","DescriptionDate: React.FC<DescriptionDateProps>","TooltipProvider","Tooltip","TooltipTrigger","DateDisplay","TooltipContent","DescriptionImages: React.FC<{\n images?: Array<ImageItem> | null | undefined;\n}>","Image","DescriptionLink: React.FC<DescriptionLinkProps>","LinkIcon","ExternalLinkIcon","DescriptionLongText: React.FC<{ content: string | null | undefined | number }>","Tooltip","TooltipTrigger","Paragraph","TooltipContent","DescriptionName: React.FC<{\n name?: string | null | undefined;\n}>","Tooltip","TooltipTrigger","Paragraph","TooltipContent","DescriptionNumberPhone: React.FC<{ value: string }>","Tooltip","TooltipTrigger","Paragraph","TooltipContent","options: Intl.NumberFormatOptions","dotColorMap: Record<StatusColor, string>","DescriptionStatus: React.FC<DescriptionStatusProps>","Badge","DescriptionTagList: React.FC<DescriptionTagListProps>","Badge","DescriptionUser: React.FC<DescriptionUserProps>","UserDataDisplay","DescriptionItem: React.FC<\n React.PropsWithChildren<{\n /** Text displayed in the label column. */\n label: string;\n /**\n * Number of grid columns (out of 12) allocated to the label in horizontal orientation.\n * @default 3\n */\n labelColSpan?: number;\n /**\n * Layout direction of the label/value pair.\n * - `'horizontal'` — label and value are side by side.\n * - `'vertical'` — label sits above the value.\n * @default 'horizontal'\n */\n orientation?: 'horizontal' | 'vertical';\n /** Optional node rendered in the top-right corner of the label area (e.g. an edit action). */\n action?: React.ReactNode;\n }>\n>","DescriptionHeader: React.FC<{\n /** Primary heading text. */\n title: string;\n /** Optional secondary text rendered below the title in a smaller, muted style. */\n description?: string;\n /** Optional node rendered on the right side of the header (e.g. action buttons). */\n extra?: React.ReactNode;\n /** Additional CSS class names applied to the header wrapper. */\n className?: string;\n}>","DescriptionSection: React.FC<{\n /** Optional section label rendered as uppercase small-caps text beside the divider line. */\n title?: string;\n /** Additional CSS class names applied to the section wrapper. */\n className?: string;\n}>","DescriptionLoadingSkeleton: React.FC<{ rows: number }>","Description: React.FC<\n React.PropsWithChildren<{\n /** Additional CSS class names applied to the root wrapper element. */\n className?: string;\n /** Strips the outer card shadow/ring and adapts sizing for embedding inside another Description. */\n nested?: boolean;\n /** Replaces children with animated skeleton rows while data is loading. */\n loading?: boolean;\n /** Number of skeleton rows shown when `loading` is true. @default 4 */\n loadingRows?: number;\n }>\n>","DescriptionGroup: React.FC<\n React.PropsWithChildren<{\n /** Additional CSS class names applied to the group wrapper. */\n className?: string;\n }>\n>"],"sources":["../../../packages/components/features/descriptions/components/empty.tsx","../../../packages/components/features/descriptions/components/badge.tsx","../../../packages/components/features/descriptions/components/boolean.tsx","../../../packages/components/features/descriptions/components/copy.tsx","../../../packages/components/features/descriptions/components/date.tsx","../../../packages/components/features/descriptions/components/images.tsx","../../../packages/components/features/descriptions/components/link.tsx","../../../packages/components/features/descriptions/components/longtext.tsx","../../../packages/components/features/descriptions/components/name.tsx","../../../packages/components/features/descriptions/components/number-phone.tsx","../../../packages/components/features/descriptions/components/statistic.tsx","../../../packages/components/features/descriptions/components/status.tsx","../../../packages/components/features/descriptions/components/tag-list.tsx","../../../packages/components/features/descriptions/components/user.tsx","../../../packages/components/features/descriptions/index.tsx"],"sourcesContent":["'use client';\n\nexport const DescriptionEmpty: React.FC = () => {\n return (\n <span data-slot=\"description-empty\" aria-label=\"Empty value\" className=\"select-none font-medium text-sm text-text-positive-muted\">\n —\n </span>\n );\n};\n","'use client';\n\nimport { Badge } from '@/components/ui/badge';\nimport type { BadgeProps } from '@/components/ui/badge';\n\nimport { DescriptionEmpty } from './empty';\n\ntype DescriptionBadgeProps = {\n label: string | number | null | undefined;\n color?: BadgeProps['color'];\n variant?: BadgeProps['variant'];\n size?: BadgeProps['size'];\n};\n\nexport const DescriptionBadge: React.FC<DescriptionBadgeProps> = ({ label, color = 'secondary', variant = 'soft', size = 'sm' }) => {\n if (!label) return <DescriptionEmpty />;\n return (\n <Badge data-slot=\"description-badge\" color={color} variant={variant} size={size}>\n {label}\n </Badge>\n );\n};\n","'use client';\n\nimport { Badge } from '@/components/ui/badge';\n\nimport { DescriptionEmpty } from './empty';\n\ntype DescriptionBooleanProps = {\n value: boolean | null | undefined;\n trueLabel?: string;\n falseLabel?: string;\n};\n\nexport const DescriptionBoolean: React.FC<DescriptionBooleanProps> = ({ value, trueLabel = 'Yes', falseLabel = 'No' }) => {\n if (value == null) return <DescriptionEmpty />;\n return (\n <Badge data-slot=\"description-boolean\" variant=\"soft\" color={value ? 'success' : 'danger'} size=\"sm\">\n {value ? trueLabel : falseLabel}\n </Badge>\n );\n};\n","'use client';\n\nimport { useCallback, useState } from 'react';\nimport { CheckIcon, CopyIcon } from 'lucide-react';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { DescriptionEmpty } from './empty';\n\ntype DescriptionCopyProps = {\n value: string | null | undefined;\n truncate?: boolean;\n};\n\nexport const DescriptionCopy: React.FC<DescriptionCopyProps> = ({ value, truncate = true }) => {\n const [copied, setCopied] = useState(false);\n\n const handleCopy = useCallback(async () => {\n if (!value) return;\n await navigator.clipboard.writeText(value);\n setCopied(true);\n setTimeout(() => setCopied(false), 1500);\n }, [value]);\n\n if (!value) return <DescriptionEmpty />;\n\n return (\n <button\n type=\"button\"\n data-slot=\"description-copy\"\n onClick={handleCopy}\n className={cn(\n 'group inline-flex max-w-full cursor-pointer items-center gap-1.5 rounded-sm border border-border-weak bg-secondary-muted px-2 py-0.5 font-mono text-xs text-text-positive-weak transition-[border-color,color,box-shadow] hover:border-border hover:text-text-positive hover:shadow-xs',\n truncate && 'min-w-0'\n )}\n >\n <span className={cn('tabular-nums', truncate && 'truncate')}>{value}</span>\n {copied ? <CheckIcon size={12} className=\"shrink-0 text-success\" /> : <CopyIcon size={12} className=\"shrink-0 opacity-50 group-hover:opacity-100\" />}\n </button>\n );\n};\n","'use client';\n\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';\nimport { DateDisplay } from '@/components/data-display/date';\n\nimport { DescriptionEmpty } from './empty';\n\ntype DescriptionDateProps = {\n date: Date | string | number | null | undefined;\n};\n\nexport const DescriptionDate: React.FC<DescriptionDateProps> = ({ date }) => {\n if (date == null) return <DescriptionEmpty />;\n return (\n <TooltipProvider>\n <Tooltip>\n <TooltipTrigger asChild>\n <DateDisplay\n data-slot=\"description-date\"\n date={date}\n format=\"medium\"\n className=\"cursor-help underline decoration-dashed decoration-border-strong underline-offset-2\"\n />\n </TooltipTrigger>\n <TooltipContent>\n <DateDisplay date={date} format=\"full\" showTime className=\"text-xs font-medium\" />\n </TooltipContent>\n </Tooltip>\n </TooltipProvider>\n );\n};\n","'use client';\n\nimport { Image } from '@/components/ui/image';\n\nimport { DescriptionEmpty } from './empty';\n\ntype ImageItem = { id: string; src: string; alt: string };\n\nexport const DescriptionImages: React.FC<{\n images?: Array<ImageItem> | null | undefined;\n}> = ({ images }) => {\n if (!images?.length) return <DescriptionEmpty />;\n\n const isSingle = images.length === 1;\n\n return (\n <div data-slot=\"description-images\" className=\"flex flex-wrap gap-4\">\n {images.map(image => (\n <div\n key={image.id}\n className={\n isSingle\n ? 'group relative size-42 overflow-hidden rounded-sm border border-border shadow-xs transition-shadow hover:shadow-card'\n : 'group relative size-16 overflow-hidden rounded-lg border border-border shadow-xs transition-shadow hover:shadow-card'\n }\n >\n <Image src={image.src} alt={image.alt} width=\"100%\" height=\"100%\" className=\"transition-transform duration-200 group-hover:scale-105\" />\n </div>\n ))}\n </div>\n );\n};\n","'use client';\n\nimport { ExternalLinkIcon, LinkIcon } from 'lucide-react';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { DescriptionEmpty } from './empty';\n\ntype DescriptionLinkProps = {\n href: string | null | undefined;\n label?: string;\n external?: boolean;\n className?: string;\n};\n\nexport const DescriptionLink: React.FC<DescriptionLinkProps> = ({ href, label, external = true, className }) => {\n if (!href) return <DescriptionEmpty />;\n\n return (\n <a\n data-slot=\"description-link\"\n href={href}\n target={external ? '_blank' : undefined}\n rel={external ? 'noopener noreferrer' : undefined}\n className={cn(\n 'inline-flex max-w-full items-center gap-1 text-sm text-primary underline decoration-dashed underline-offset-2 transition-colors hover:text-primary-strong hover:decoration-solid',\n className\n )}\n >\n {!external && <LinkIcon size={12} className=\"shrink-0 opacity-70\" />}\n <span className=\"truncate\">{label ?? href}</span>\n {external && <ExternalLinkIcon size={12} className=\"shrink-0 opacity-70\" />}\n </a>\n );\n};\n","'use client';\n\nimport { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';\nimport { Paragraph } from '@/components/typography/paragraph';\n\nimport { DescriptionEmpty } from './empty';\n\nexport const DescriptionLongText: React.FC<{ content: string | null | undefined | number }> = ({ content }) => {\n if (content == null) return <DescriptionEmpty />;\n return (\n <Tooltip>\n <TooltipTrigger asChild>\n <Paragraph\n data-slot=\"description-longtext\"\n variant=\"sm\"\n className=\"line-clamp-2 cursor-pointer whitespace-pre-line break-all text-start text-sm underline decoration-dashed decoration-border-strong underline-offset-2\"\n >\n {content}\n </Paragraph>\n </TooltipTrigger>\n <TooltipContent align=\"start\" className=\"h-fit min-w-48 max-w-80 pt-4\">\n <div className=\"flex flex-col gap-y-2\">\n <p className=\"whitespace-pre-line text-wrap break-keep\">{content}</p>\n <p className=\"w-full text-end text-text-positive-subtle\">{content.toString().length} chars</p>\n </div>\n </TooltipContent>\n </Tooltip>\n );\n};\n","'use client';\n\nimport { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';\nimport { Paragraph } from '@/components/typography/paragraph';\n\nimport { DescriptionEmpty } from './empty';\n\nexport const DescriptionName: React.FC<{\n name?: string | null | undefined;\n}> = ({ name }) => {\n if (!name) return <DescriptionEmpty />;\n return (\n <Tooltip>\n <TooltipTrigger asChild>\n <Paragraph\n data-slot=\"description-name\"\n variant=\"sm\"\n className=\"line-clamp-2 w-full cursor-pointer truncate underline decoration-dashed decoration-border-strong underline-offset-2\"\n >\n {name}\n </Paragraph>\n </TooltipTrigger>\n <TooltipContent align=\"start\" className=\"h-fit min-w-48 max-w-80 pt-4\">\n <div className=\"flex flex-col gap-y-2\">\n <p className=\"whitespace-pre-line text-wrap break-keep\">{name}</p>\n <p className=\"w-full text-end text-text-positive-subtle\">{name.length} chars</p>\n </div>\n </TooltipContent>\n </Tooltip>\n );\n};\n","'use client';\n\nimport { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';\nimport { Paragraph } from '@/components/typography/paragraph';\n\nexport const DescriptionNumberPhone: React.FC<{ value: string }> = ({ value }) => {\n return (\n <Tooltip>\n <TooltipTrigger data-slot=\"description-phone\">\n <Paragraph variant=\"sm\" className=\"tabular-nums transition-colors\">\n {value.replace(/(\\d{3})(\\d{3})(\\d{4})/, '($1) $2-$3')}\n </Paragraph>\n </TooltipTrigger>\n <TooltipContent align=\"start\">\n <p className=\"tabular-nums\">{value.slice(1).replace(/(\\d{2})(\\d{3})(\\d{4})/, '(00) (+84) ($1) $2-$3')}</p>\n </TooltipContent>\n </Tooltip>\n );\n};\n","'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\nimport { DescriptionEmpty } from './empty';\n\nconst applyRounding = (num: number, precisionValue: number, roundingMode?: 'round' | 'floor' | 'ceil') => {\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\nconst descriptionStatisticVariants = 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',\n up: 'text-success',\n down: 'text-danger',\n },\n },\n defaultVariants: {\n size: 'sm',\n trend: 'neutral',\n },\n});\n\nexport type DescriptionStatisticProps = VariantProps<typeof descriptionStatisticVariants> & {\n decimalSeparator?: string;\n groupSeparator?: string;\n prefix?: React.ReactNode;\n suffix?: React.ReactNode;\n precision?: number;\n roundingMode?: 'round' | 'floor' | 'ceil';\n showTrailingZeros?: boolean;\n value: number | string | null | undefined;\n className?: string;\n};\n\nexport const DescriptionStatistic = memo(\n ({\n decimalSeparator = '.',\n groupSeparator = ',',\n prefix: Prefix,\n suffix: Suffix,\n precision,\n roundingMode = 'round',\n showTrailingZeros = false,\n size = 'sm',\n trend = 'neutral',\n value = 0,\n className,\n }: DescriptionStatisticProps) => {\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, roundingMode);\n }\n return processedNum.toLocaleString('en-US', formatOptions);\n },\n [roundingMode, 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 if (finalFormattedValue === '0' || finalFormattedValue === 'N/A' || !finalFormattedValue) {\n return <DescriptionEmpty />;\n }\n\n return (\n <div data-slot=\"description-statistic\" className={cn(descriptionStatisticVariants({ size, trend }), className)}>\n {Prefix && <span data-slot=\"description-statistic-prefix\">{Prefix}</span>}\n <p data-slot=\"description-statistic-value\">{finalFormattedValue}</p>\n {Suffix && <span data-slot=\"description-statistic-suffix\">{Suffix}</span>}\n </div>\n );\n }\n);\nDescriptionStatistic.displayName = 'DescriptionStatistic';\n","'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Badge } from '@/components/ui/badge';\nimport type { BadgeProps } from '@/components/ui/badge';\n\nimport { DescriptionEmpty } from './empty';\n\ntype StatusColor = NonNullable<BadgeProps['color']>;\n\nconst dotColorMap: Record<StatusColor, string> = {\n primary: 'bg-primary',\n secondary: 'bg-secondary',\n muted: 'bg-muted',\n accent: 'bg-accent',\n info: 'bg-info',\n success: 'bg-success',\n warning: 'bg-warning',\n danger: 'bg-danger',\n};\n\ntype DescriptionStatusProps = {\n label: string | null | undefined;\n color?: StatusColor;\n dot?: boolean;\n};\n\nexport const DescriptionStatus: React.FC<DescriptionStatusProps> = ({ label, color = 'info', dot = true }) => {\n if (!label) return <DescriptionEmpty />;\n return (\n <Badge data-slot=\"description-status\" variant=\"soft\" color={color} size=\"sm\" className=\"gap-1.5\">\n {dot && <span className={cn('inline-block size-1.5 shrink-0 rounded-full', dotColorMap[color])} />}\n {label}\n </Badge>\n );\n};\n","'use client';\n\nimport { Badge } from '@/components/ui/badge';\nimport type { BadgeProps } from '@/components/ui/badge';\n\nimport { DescriptionEmpty } from './empty';\n\ntype DescriptionTagListProps = {\n tags: Array<string | number> | null | undefined;\n max?: number;\n color?: BadgeProps['color'];\n variant?: BadgeProps['variant'];\n};\n\nexport const DescriptionTagList: React.FC<DescriptionTagListProps> = ({ tags, max = 5, color = 'secondary', variant = 'soft' }) => {\n if (!tags?.length) return <DescriptionEmpty />;\n\n const visible = tags.slice(0, max);\n const overflow = tags.length - visible.length;\n\n return (\n <div data-slot=\"description-tag-list\" className=\"flex flex-wrap gap-1\">\n {visible.map((tag, i) => (\n // biome-ignore lint/suspicious/noArrayIndexKey: static display list\n <Badge key={i} variant={variant} color={color} size=\"sm\">\n {tag}\n </Badge>\n ))}\n {overflow > 0 && (\n <Badge variant=\"outline\" color=\"muted\" size=\"sm\">\n +{overflow}\n </Badge>\n )}\n </div>\n );\n};\n","'use client';\n\nimport { UserDataDisplay } from '@/components/data-display/user';\n\nimport { DescriptionEmpty } from './empty';\n\ntype DescriptionUserProps = {\n uuid?: string | null;\n username?: string | null;\n email?: string | null;\n};\n\nexport const DescriptionUser: React.FC<DescriptionUserProps> = ({ uuid, username, email }) => {\n if (!uuid || !username || !email) return <DescriptionEmpty />;\n return <UserDataDisplay uuid={uuid} username={username} email={email} />;\n};\n","'use client';\n\nimport { createContext, useContext } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nexport * from './components';\n\nconst DescriptionGroupContext = createContext(false);\n\n/**\n * A single labeled row within a {@link Description} container, supporting both horizontal (side-by-side label/value) and vertical (stacked) layouts.\n *\n * @example\n * import { Description, DescriptionItem } from '@customafk/lunas-ui/features/descriptions';\n *\n * <Description>\n * <DescriptionItem label=\"Full name\">John Doe</DescriptionItem>\n * <DescriptionItem label=\"Email\" orientation=\"vertical\">john@example.com</DescriptionItem>\n * </Description>\n */\nexport const DescriptionItem: React.FC<\n React.PropsWithChildren<{\n /** Text displayed in the label column. */\n label: string;\n /**\n * Number of grid columns (out of 12) allocated to the label in horizontal orientation.\n * @default 3\n */\n labelColSpan?: number;\n /**\n * Layout direction of the label/value pair.\n * - `'horizontal'` — label and value are side by side.\n * - `'vertical'` — label sits above the value.\n * @default 'horizontal'\n */\n orientation?: 'horizontal' | 'vertical';\n /** Optional node rendered in the top-right corner of the label area (e.g. an edit action). */\n action?: React.ReactNode;\n }>\n> = ({ label, labelColSpan = 3, orientation = 'horizontal', action, children }) => {\n if (orientation === 'vertical') {\n return (\n <div data-slot=\"description-item\" className=\"flex flex-col border-b border-b-border last:border-b-0\">\n <div\n data-slot=\"description-item-label\"\n className=\"flex items-center justify-between border-b border-b-border bg-secondary-muted py-2 pr-2 pl-4 text-sm font-medium text-text-positive-weak\"\n >\n <span>{label}</span>\n {action && <div className=\"shrink-0\">{action}</div>}\n </div>\n <div data-slot=\"description-item-value\" className=\"flex flex-wrap items-center gap-2 py-3 pr-2 pl-4 text-sm text-text-positive\">\n {children}\n </div>\n </div>\n );\n }\n\n return (\n <div\n data-slot=\"description-item\"\n style={{ display: 'grid', gridTemplateColumns: 'repeat(12, minmax(0, 1fr))' }}\n className=\"grid border-b border-b-border last:border-b-0\"\n >\n <div\n data-slot=\"description-item-label\"\n style={{ gridColumn: `span ${labelColSpan} / span ${labelColSpan}` }}\n className=\"flex min-w-full items-center justify-between overflow-x-hidden text-wrap break-all border-r border-r-border bg-secondary-muted py-3 pr-2 pl-4 text-sm font-medium text-text-positive-weak tabular-nums\"\n >\n <span>{label}</span>\n {action && <div className=\"shrink-0 pr-1\">{action}</div>}\n </div>\n <div\n data-slot=\"description-item-value\"\n style={{ gridColumn: `span ${12 - labelColSpan} / span ${12 - labelColSpan}` }}\n className=\"flex flex-wrap items-center gap-2 py-3 pr-2 pl-4 text-sm text-text-positive\"\n >\n {children}\n </div>\n </div>\n );\n};\n\n/**\n * A header bar for a {@link Description} block, showing a title, an optional subtitle, and an optional trailing action area.\n *\n * @example\n * import { Description, DescriptionHeader } from '@customafk/lunas-ui/features/descriptions';\n *\n * <Description>\n * <DescriptionHeader title=\"User details\" description=\"Read-only overview\" extra={<EditBtn />} />\n * </Description>\n */\nexport const DescriptionHeader: React.FC<{\n /** Primary heading text. */\n title: string;\n /** Optional secondary text rendered below the title in a smaller, muted style. */\n description?: string;\n /** Optional node rendered on the right side of the header (e.g. action buttons). */\n extra?: React.ReactNode;\n /** Additional CSS class names applied to the header wrapper. */\n className?: string;\n}> = ({ title, description, extra, className }) => {\n return (\n <div\n data-slot=\"description-header\"\n className={cn('sticky top-0 z-10 flex items-start justify-between gap-4 border-b border-b-border bg-card px-4 py-3', className)}\n >\n <div className=\"flex flex-col gap-0.5\">\n <p className=\"text-sm font-semibold text-text-positive\">{title}</p>\n {description && <p className=\"text-xs text-text-positive-weak\">{description}</p>}\n </div>\n {extra && <div className=\"shrink-0\">{extra}</div>}\n </div>\n );\n};\n\n/**\n * A visual section divider inside a {@link Description} container that optionally displays a section title with a decorative horizontal rule.\n *\n * @example\n * import { Description, DescriptionSection, DescriptionItem } from '@customafk/lunas-ui/features/descriptions';\n *\n * <Description>\n * <DescriptionSection title=\"Contact\" />\n * <DescriptionItem label=\"Email\">john@example.com</DescriptionItem>\n * </Description>\n */\nexport const DescriptionSection: React.FC<{\n /** Optional section label rendered as uppercase small-caps text beside the divider line. */\n title?: string;\n /** Additional CSS class names applied to the section wrapper. */\n className?: string;\n}> = ({ title, className }) => {\n return (\n <div data-slot=\"description-section\" className={cn('flex items-center gap-3 border-b border-b-border bg-secondary-muted px-4 py-2', className)}>\n {title && <p className=\"text-xs font-semibold uppercase tracking-wide text-text-positive-muted\">{title}</p>}\n <div className=\"h-px flex-1 bg-border-weak\" />\n </div>\n );\n};\n\nconst DescriptionLoadingSkeleton: React.FC<{ rows: number }> = ({ rows }) => (\n <div data-slot=\"description-loading\" className=\"animate-pulse\">\n <div className=\"flex items-center justify-between border-b border-b-border px-4 py-3\">\n <div className=\"flex flex-col gap-1.5\">\n <div className=\"h-3.5 w-36 rounded bg-border\" />\n <div className=\"h-2.5 w-24 rounded bg-border-weak\" />\n </div>\n <div className=\"h-5 w-16 rounded bg-border-weak\" />\n </div>\n {Array.from({ length: rows }).map((_, i) => (\n <div key={i} style={{ display: 'grid', gridTemplateColumns: 'repeat(12, minmax(0, 1fr))' }} className=\"grid border-b border-b-border last:border-b-0\">\n <div style={{ gridColumn: 'span 3 / span 3' }} className=\"flex items-center border-r border-r-border bg-secondary-muted py-3 pl-4 pr-2\">\n <div className=\"h-3 w-20 rounded bg-border\" />\n </div>\n <div style={{ gridColumn: 'span 9 / span 9' }} className=\"flex items-center py-3 pl-4 pr-2\">\n <div className=\"h-3 w-28 rounded bg-border-weak\" />\n </div>\n </div>\n ))}\n </div>\n);\n\n/**\n * Root container for a description block — a bordered, rounded card that groups {@link DescriptionHeader}, {@link DescriptionSection}, and {@link DescriptionItem} elements.\n *\n * Set `nested` when embedding one `Description` inside another (removes the outer card shadow/ring and constrains sizing).\n * Set `loading` to replace content with animated skeleton rows while data is being fetched.\n *\n * @example\n * import { Description, DescriptionHeader, DescriptionItem } from '@customafk/lunas-ui/features/descriptions';\n *\n * <Description>\n * <DescriptionHeader title=\"Order #1234\" />\n * <DescriptionItem label=\"Status\">Shipped</DescriptionItem>\n * <DescriptionItem label=\"Total\">$99.00</DescriptionItem>\n * </Description>\n */\nexport const Description: React.FC<\n React.PropsWithChildren<{\n /** Additional CSS class names applied to the root wrapper element. */\n className?: string;\n /** Strips the outer card shadow/ring and adapts sizing for embedding inside another Description. */\n nested?: boolean;\n /** Replaces children with animated skeleton rows while data is loading. */\n loading?: boolean;\n /** Number of skeleton rows shown when `loading` is true. @default 4 */\n loadingRows?: number;\n }>\n> = ({ children, className, nested = false, loading = false, loadingRows = 4 }) => {\n const inGroup = useContext(DescriptionGroupContext);\n\n return (\n <div\n data-slot=\"description\"\n className={cn(\n 'relative flex flex-col bg-card',\n inGroup\n ? 'border-b border-b-border last:border-b-0'\n : nested\n ? 'w-full overflow-hidden rounded-md border border-border'\n : 'size-full overflow-y-auto rounded-lg border border-border shadow-card ring-1 ring-border-weak',\n className\n )}\n >\n {loading ? <DescriptionLoadingSkeleton rows={loadingRows} /> : children}\n </div>\n );\n};\n\n/**\n * A scrollable container that groups multiple {@link Description} blocks and makes each\n * {@link DescriptionHeader} sticky. As you scroll, the next section header stacks above\n * (pushes out) the previous one — standard CSS sticky behaviour within a single scroll context.\n *\n * @example\n * import { DescriptionGroup, Description, DescriptionHeader, DescriptionItem } from '@customafk/lunas-ui/features/descriptions';\n *\n * <DescriptionGroup>\n * <Description>\n * <DescriptionHeader title=\"Personal info\" />\n * <DescriptionItem label=\"Name\">John Doe</DescriptionItem>\n * </Description>\n * <Description>\n * <DescriptionHeader title=\"Contact\" />\n * <DescriptionItem label=\"Email\">john@example.com</DescriptionItem>\n * </Description>\n * </DescriptionGroup>\n */\nexport const DescriptionGroup: React.FC<\n React.PropsWithChildren<{\n /** Additional CSS class names applied to the group wrapper. */\n className?: string;\n }>\n> = ({ children, className }) => {\n return (\n <DescriptionGroupContext.Provider value={true}>\n <div\n data-slot=\"description-group\"\n className={cn('relative size-full overflow-y-auto rounded-lg border border-border bg-card shadow-card ring-1 ring-border-weak', className)}\n >\n {children}\n </div>\n </DescriptionGroupContext.Provider>\n );\n};\n"],"mappings":"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"}