@customafk/lunas-ui 0.2.51 → 0.2.53

package/dist/radio-group-Ck0NoDHp.d.cts

@@ -0,0 +1,37 @@
+import * as react217 from "react";
+import { RadioGroup } from "radix-ui";
+
+//#region packages/components/ui/radio-group.d.ts
+
+/**
+ * Accessible radio button group built on Radix UI's RadioGroup primitive, where only one option can be selected at a time.
+ *
+ * @example
+ * ```tsx
+ * import { RadioGroup, RadioGroupItem } from '@customafk/lunas-ui/ui/radio-group';
+ * import { Label } from '@customafk/lunas-ui/ui/label';
+ *
+ * <RadioGroup defaultValue="monthly">
+ *   <div className="flex items-center gap-2">
+ *     <RadioGroupItem value="monthly" id="monthly" />
+ *     <Label htmlFor="monthly">Monthly</Label>
+ *   </div>
+ *   <div className="flex items-center gap-2">
+ *     <RadioGroupItem value="annually" id="annually" />
+ *     <Label htmlFor="annually">Annually</Label>
+ *   </div>
+ * </RadioGroup>
+ * ```
+ */
+declare function RadioGroup$1({
+  className,
+  ...props
+}: React.ComponentProps<typeof RadioGroup.Root>): react217.JSX.Element;
+/** Individual radio button within a `RadioGroup`; shows a filled circle indicator when selected. */
+declare function RadioGroupItem({
+  className,
+  ...props
+}: React.ComponentProps<typeof RadioGroup.Item>): react217.JSX.Element;
+//#endregion
+export { RadioGroupItem as n, RadioGroup$1 as t };
+//# sourceMappingURL=radio-group-Ck0NoDHp.d.cts.map

package/dist/radio-group-DeKN6NpB.d.mts

@@ -0,0 +1,37 @@
+import * as react157 from "react";
+import { RadioGroup } from "radix-ui";
+
+//#region packages/components/ui/radio-group.d.ts
+
+/**
+ * Accessible radio button group built on Radix UI's RadioGroup primitive, where only one option can be selected at a time.
+ *
+ * @example
+ * ```tsx
+ * import { RadioGroup, RadioGroupItem } from '@customafk/lunas-ui/ui/radio-group';
+ * import { Label } from '@customafk/lunas-ui/ui/label';
+ *
+ * <RadioGroup defaultValue="monthly">
+ *   <div className="flex items-center gap-2">
+ *     <RadioGroupItem value="monthly" id="monthly" />
+ *     <Label htmlFor="monthly">Monthly</Label>
+ *   </div>
+ *   <div className="flex items-center gap-2">
+ *     <RadioGroupItem value="annually" id="annually" />
+ *     <Label htmlFor="annually">Annually</Label>
+ *   </div>
+ * </RadioGroup>
+ * ```
+ */
+declare function RadioGroup$1({
+  className,
+  ...props
+}: React.ComponentProps<typeof RadioGroup.Root>): react157.JSX.Element;
+/** Individual radio button within a `RadioGroup`; shows a filled circle indicator when selected. */
+declare function RadioGroupItem({
+  className,
+  ...props
+}: React.ComponentProps<typeof RadioGroup.Item>): react157.JSX.Element;
+//#endregion
+export { RadioGroupItem as n, RadioGroup$1 as t };
+//# sourceMappingURL=radio-group-DeKN6NpB.d.mts.map

package/dist/refresh-BFJvyuJH.cjs

@@ -0,0 +1,2 @@
+const e=require(`./chunk-350yNsax.cjs`),t=require(`./button-C--DAN1D.cjs`),n=require(`./paragraph-DvTZvbzw.cjs`);let r=require(`lucide-react`),i=require(`react/jsx-runtime`);const a=({onClick:e=()=>{}})=>(0,i.jsxs)(t.t,{"aria-label":`Tạo mới`,variant:`outline`,color:`muted`,className:`outline-border-weak max-sm:aspect-square max-sm:size-9 max-sm:p-0`,onClick:e,children:[(0,i.jsx)(r.RefreshCwIcon,{className:`opacity-60 sm:-ms-1`,size:16,"aria-hidden":`true`}),(0,i.jsx)(n.t,{variant:`sm`,className:`max-sm:sr-only`,children:`Reset`})]});Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return a}});
+//# sourceMappingURL=refresh-BFJvyuJH.cjs.map

package/dist/refresh-BFJvyuJH.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"refresh-BFJvyuJH.cjs","names":["RefreshBtn: React.FC<React.PropsWithChildren<Props>>","Button","RefreshCwIcon","Paragraph"],"sources":["../packages/components/ui/buttons/refresh.tsx"],"sourcesContent":["import { RefreshCwIcon } from 'lucide-react';\n\nimport { Paragraph } from '@/components/typography/paragraph';\n\nimport { Button } from '../button';\n\ntype Props = {\n  /** Callback invoked when the button is clicked. Defaults to a no-op. */\n  onClick?: () => void;\n};\n\n/**\n * A toolbar button that triggers a refresh/reset action, displaying a rotating arrows icon alongside a \"Reset\" label that is hidden on small screens.\n *\n * @example\n * import { RefreshBtn } from '@customafk/lunas-ui/ui/buttons/refresh';\n *\n * <RefreshBtn onClick={() => resetFilters()} />\n */\nexport const RefreshBtn: React.FC<React.PropsWithChildren<Props>> = ({ onClick = () => {} }) => {\n  return (\n    <Button\n      aria-label=\"Tạo mới\"\n      variant=\"outline\"\n      color=\"muted\"\n      className=\"outline-border-weak max-sm:aspect-square max-sm:size-9 max-sm:p-0\"\n      onClick={onClick}\n    >\n      <RefreshCwIcon className=\"opacity-60 sm:-ms-1\" size={16} aria-hidden=\"true\" />\n      <Paragraph variant=\"sm\" className=\"max-sm:sr-only\">\n        Reset\n      </Paragraph>\n    </Button>\n  );\n};\n"],"mappings":"8KAmBA,MAAaA,GAAwD,CAAE,cAAgB,OAEnF,EAAA,EAAA,MAACC,EAAAA,EAAAA,CACC,aAAW,UACX,QAAQ,UACR,MAAM,QACN,UAAU,oEACD,qBAET,EAAA,EAAA,KAACC,EAAAA,cAAAA,CAAc,UAAU,sBAAsB,KAAM,GAAI,cAAY,QAAS,EAC9E,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAU,QAAQ,KAAK,UAAU,0BAAiB,SAEvC,CAAA,EACL"}

package/dist/refresh-BjdAiL4f.d.mts

@@ -0,0 +1,17 @@
+//#region packages/components/ui/buttons/refresh.d.ts
+type Props = {
+  /** Callback invoked when the button is clicked. Defaults to a no-op. */
+  onClick?: () => void;
+};
+/**
+ * A toolbar button that triggers a refresh/reset action, displaying a rotating arrows icon alongside a "Reset" label that is hidden on small screens.
+ *
+ * @example
+ * import { RefreshBtn } from '@customafk/lunas-ui/ui/buttons/refresh';
+ *
+ * <RefreshBtn onClick={() => resetFilters()} />
+ */
+declare const RefreshBtn: React.FC<React.PropsWithChildren<Props>>;
+//#endregion
+export { RefreshBtn as t };
+//# sourceMappingURL=refresh-BjdAiL4f.d.mts.map

package/dist/refresh-Bxm2I0Oe.mjs

@@ -0,0 +1,2 @@
+import{t as e}from"./button-CCVJTHBI.mjs";import{t}from"./paragraph-DYLaQtTV.mjs";import{RefreshCwIcon as n}from"lucide-react";import{jsx as r,jsxs as i}from"react/jsx-runtime";const a=({onClick:a=()=>{}})=>i(e,{"aria-label":`Tạo mới`,variant:`outline`,color:`muted`,className:`outline-border-weak max-sm:aspect-square max-sm:size-9 max-sm:p-0`,onClick:a,children:[r(n,{className:`opacity-60 sm:-ms-1`,size:16,"aria-hidden":`true`}),r(t,{variant:`sm`,className:`max-sm:sr-only`,children:`Reset`})]});export{a as t};
+//# sourceMappingURL=refresh-Bxm2I0Oe.mjs.map

package/dist/refresh-Bxm2I0Oe.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"refresh-Bxm2I0Oe.mjs","names":["RefreshBtn: React.FC<React.PropsWithChildren<Props>>"],"sources":["../packages/components/ui/buttons/refresh.tsx"],"sourcesContent":["import { RefreshCwIcon } from 'lucide-react';\n\nimport { Paragraph } from '@/components/typography/paragraph';\n\nimport { Button } from '../button';\n\ntype Props = {\n  /** Callback invoked when the button is clicked. Defaults to a no-op. */\n  onClick?: () => void;\n};\n\n/**\n * A toolbar button that triggers a refresh/reset action, displaying a rotating arrows icon alongside a \"Reset\" label that is hidden on small screens.\n *\n * @example\n * import { RefreshBtn } from '@customafk/lunas-ui/ui/buttons/refresh';\n *\n * <RefreshBtn onClick={() => resetFilters()} />\n */\nexport const RefreshBtn: React.FC<React.PropsWithChildren<Props>> = ({ onClick = () => {} }) => {\n  return (\n    <Button\n      aria-label=\"Tạo mới\"\n      variant=\"outline\"\n      color=\"muted\"\n      className=\"outline-border-weak max-sm:aspect-square max-sm:size-9 max-sm:p-0\"\n      onClick={onClick}\n    >\n      <RefreshCwIcon className=\"opacity-60 sm:-ms-1\" size={16} aria-hidden=\"true\" />\n      <Paragraph variant=\"sm\" className=\"max-sm:sr-only\">\n        Reset\n      </Paragraph>\n    </Button>\n  );\n};\n"],"mappings":"iLAmBA,MAAaA,GAAwD,CAAE,cAAgB,MAEnF,EAAC,EAAA,CACC,aAAW,UACX,QAAQ,UACR,MAAM,QACN,UAAU,oEACD,oBAET,EAAC,EAAA,CAAc,UAAU,sBAAsB,KAAM,GAAI,cAAY,QAAS,CAC9E,EAAC,EAAA,CAAU,QAAQ,KAAK,UAAU,0BAAiB,SAEvC,CAAA,EACL"}

package/dist/refresh-vK99pTVu.d.cts

@@ -0,0 +1,17 @@
+//#region packages/components/ui/buttons/refresh.d.ts
+type Props = {
+  /** Callback invoked when the button is clicked. Defaults to a no-op. */
+  onClick?: () => void;
+};
+/**
+ * A toolbar button that triggers a refresh/reset action, displaying a rotating arrows icon alongside a "Reset" label that is hidden on small screens.
+ *
+ * @example
+ * import { RefreshBtn } from '@customafk/lunas-ui/ui/buttons/refresh';
+ *
+ * <RefreshBtn onClick={() => resetFilters()} />
+ */
+declare const RefreshBtn: React.FC<React.PropsWithChildren<Props>>;
+//#endregion
+export { RefreshBtn as t };
+//# sourceMappingURL=refresh-vK99pTVu.d.cts.map

package/dist/resizable-BilIxAxi.d.mts

@@ -0,0 +1,63 @@
+import * as react286 from "react";
+import * as ResizablePrimitive from "react-resizable-panels";
+import * as node_modules_react_resizable_panels_dist_declarations_src_types0 from "node_modules/react-resizable-panels/dist/declarations/src/types";
+
+//#region packages/components/ui/resizable.d.ts
+type TResizableHandle = React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {
+  withHandle?: boolean;
+};
+/**
+ * Root container that manages a group of resizable panels; supports horizontal and vertical orientations.
+ *
+ * @example
+ * ```tsx
+ * import { ResizablePanelGroup, ResizablePanel, ResizableHandle } from '@customafk/lunas-ui/ui/resizable';
+ *
+ * <ResizablePanelGroup direction="horizontal">
+ *   <ResizablePanel defaultSize={50}>Left</ResizablePanel>
+ *   <ResizableHandle withHandle />
+ *   <ResizablePanel defaultSize={50}>Right</ResizablePanel>
+ * </ResizablePanelGroup>
+ * ```
+ */
+declare const ResizablePanelGroup: react286.NamedExoticComponent<Omit<react286.HTMLAttributes<keyof HTMLElementTagNameMap>, "id"> & {
+  autoSaveId?: string | null;
+  className?: string;
+  direction: node_modules_react_resizable_panels_dist_declarations_src_types0.Direction;
+  id?: string | null;
+  keyboardResizeBy?: number | null;
+  onLayout?: ResizablePrimitive.PanelGroupOnLayout | null;
+  storage?: ResizablePrimitive.PanelGroupStorage;
+  style?: react286.CSSProperties;
+  tagName?: keyof HTMLElementTagNameMap;
+  dir?: "auto" | "ltr" | "rtl" | undefined;
+} & {
+  children?: react286.ReactNode | undefined;
+} & react286.RefAttributes<ResizablePrimitive.ImperativePanelGroupHandle>>;
+/** An individual resizable panel within a ResizablePanelGroup. */
+declare const ResizablePanel: react286.NamedExoticComponent<Omit<react286.HTMLAttributes<HTMLInputElement | HTMLElement | HTMLParagraphElement | HTMLFieldSetElement | HTMLLegendElement | HTMLDivElement | HTMLLabelElement | HTMLButtonElement | HTMLObjectElement | HTMLAnchorElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLCanvasElement | HTMLTableCaptionElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDListElement | HTMLEmbedElement | HTMLFormElement | HTMLHeadingElement | HTMLHeadElement | HTMLHRElement | HTMLHtmlElement | HTMLIFrameElement | HTMLImageElement | HTMLLIElement | HTMLLinkElement | HTMLMapElement | HTMLMenuElement | HTMLMetaElement | HTMLMeterElement | HTMLOListElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLPictureElement | HTMLPreElement | HTMLProgressElement | HTMLScriptElement | HTMLSelectElement | HTMLSlotElement | HTMLSourceElement | HTMLSpanElement | HTMLStyleElement | HTMLTableElement | HTMLTableSectionElement | HTMLTableCellElement | HTMLTemplateElement | HTMLTextAreaElement | HTMLTimeElement | HTMLTitleElement | HTMLTableRowElement | HTMLTrackElement | HTMLUListElement | HTMLVideoElement>, "id" | "onResize"> & {
+  className?: string;
+  collapsedSize?: number | undefined;
+  collapsible?: boolean | undefined;
+  defaultSize?: number | undefined;
+  id?: string;
+  maxSize?: number | undefined;
+  minSize?: number | undefined;
+  onCollapse?: ResizablePrimitive.PanelOnCollapse;
+  onExpand?: ResizablePrimitive.PanelOnExpand;
+  onResize?: ResizablePrimitive.PanelOnResize;
+  order?: number;
+  style?: object;
+  tagName?: keyof HTMLElementTagNameMap | undefined;
+} & {
+  children?: react286.ReactNode | undefined;
+} & react286.RefAttributes<ResizablePrimitive.ImperativePanelHandle>>;
+/**
+ * The drag handle placed between two ResizablePanels to resize them.
+ *
+ * @param withHandle - When true, renders a visible grip icon centered on the handle.
+ */
+declare const ResizableHandle: react286.NamedExoticComponent<TResizableHandle>;
+//#endregion
+export { ResizablePanel as n, ResizablePanelGroup as r, ResizableHandle as t };
+//# sourceMappingURL=resizable-BilIxAxi.d.mts.map

package/dist/resizable-DYxHVdyf.d.cts

@@ -0,0 +1,63 @@
+import * as react223 from "react";
+import * as node_modules_react_resizable_panels_dist_declarations_src_types0 from "node_modules/react-resizable-panels/dist/declarations/src/types";
+import * as ResizablePrimitive from "react-resizable-panels";
+
+//#region packages/components/ui/resizable.d.ts
+type TResizableHandle = React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {
+  withHandle?: boolean;
+};
+/**
+ * Root container that manages a group of resizable panels; supports horizontal and vertical orientations.
+ *
+ * @example
+ * ```tsx
+ * import { ResizablePanelGroup, ResizablePanel, ResizableHandle } from '@customafk/lunas-ui/ui/resizable';
+ *
+ * <ResizablePanelGroup direction="horizontal">
+ *   <ResizablePanel defaultSize={50}>Left</ResizablePanel>
+ *   <ResizableHandle withHandle />
+ *   <ResizablePanel defaultSize={50}>Right</ResizablePanel>
+ * </ResizablePanelGroup>
+ * ```
+ */
+declare const ResizablePanelGroup: react223.NamedExoticComponent<Omit<react223.HTMLAttributes<keyof HTMLElementTagNameMap>, "id"> & {
+  autoSaveId?: string | null;
+  className?: string;
+  direction: node_modules_react_resizable_panels_dist_declarations_src_types0.Direction;
+  id?: string | null;
+  keyboardResizeBy?: number | null;
+  onLayout?: ResizablePrimitive.PanelGroupOnLayout | null;
+  storage?: ResizablePrimitive.PanelGroupStorage;
+  style?: react223.CSSProperties;
+  tagName?: keyof HTMLElementTagNameMap;
+  dir?: "auto" | "ltr" | "rtl" | undefined;
+} & {
+  children?: react223.ReactNode | undefined;
+} & react223.RefAttributes<ResizablePrimitive.ImperativePanelGroupHandle>>;
+/** An individual resizable panel within a ResizablePanelGroup. */
+declare const ResizablePanel: react223.NamedExoticComponent<Omit<react223.HTMLAttributes<HTMLInputElement | HTMLElement | HTMLParagraphElement | HTMLFieldSetElement | HTMLLegendElement | HTMLDivElement | HTMLLabelElement | HTMLButtonElement | HTMLObjectElement | HTMLAnchorElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLCanvasElement | HTMLTableCaptionElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDListElement | HTMLEmbedElement | HTMLFormElement | HTMLHeadingElement | HTMLHeadElement | HTMLHRElement | HTMLHtmlElement | HTMLIFrameElement | HTMLImageElement | HTMLLIElement | HTMLLinkElement | HTMLMapElement | HTMLMenuElement | HTMLMetaElement | HTMLMeterElement | HTMLOListElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLPictureElement | HTMLPreElement | HTMLProgressElement | HTMLScriptElement | HTMLSelectElement | HTMLSlotElement | HTMLSourceElement | HTMLSpanElement | HTMLStyleElement | HTMLTableElement | HTMLTableSectionElement | HTMLTableCellElement | HTMLTemplateElement | HTMLTextAreaElement | HTMLTimeElement | HTMLTitleElement | HTMLTableRowElement | HTMLTrackElement | HTMLUListElement | HTMLVideoElement>, "id" | "onResize"> & {
+  className?: string;
+  collapsedSize?: number | undefined;
+  collapsible?: boolean | undefined;
+  defaultSize?: number | undefined;
+  id?: string;
+  maxSize?: number | undefined;
+  minSize?: number | undefined;
+  onCollapse?: ResizablePrimitive.PanelOnCollapse;
+  onExpand?: ResizablePrimitive.PanelOnExpand;
+  onResize?: ResizablePrimitive.PanelOnResize;
+  order?: number;
+  style?: object;
+  tagName?: keyof HTMLElementTagNameMap | undefined;
+} & {
+  children?: react223.ReactNode | undefined;
+} & react223.RefAttributes<ResizablePrimitive.ImperativePanelHandle>>;
+/**
+ * The drag handle placed between two ResizablePanels to resize them.
+ *
+ * @param withHandle - When true, renders a visible grip icon centered on the handle.
+ */
+declare const ResizableHandle: react223.NamedExoticComponent<TResizableHandle>;
+//#endregion
+export { ResizablePanel as n, ResizablePanelGroup as r, ResizableHandle as t };
+//# sourceMappingURL=resizable-DYxHVdyf.d.cts.map

package/dist/resizable-p6zxjcHs.mjs

@@ -0,0 +1,2 @@
+import{GripVerticalIcon as e}from"lucide-react";import{memo as t}from"react";import{cn as n}from"@customafk/react-toolkit/utils";import{jsx as r}from"react/jsx-runtime";import*as i from"react-resizable-panels";const a=t(({className:e,...t})=>r(i.PanelGroup,{"data-slot":`resizable-panel-group`,className:n(`flex h-full w-full data-[panel-group-direction=vertical]:flex-col`,e),...t}));a.displayName=`ResizablePanelGroup`;const o=t(({...e})=>r(i.Panel,{"data-slot":`resizable-panel`,...e}));o.displayName=`ResizablePanel`;const s=t(({withHandle:t,className:a,...o})=>r(i.PanelResizeHandle,{"data-slot":`resizable-handle`,className:n(`relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90`,a),...o,children:t&&r(`div`,{className:`z-10 flex h-4 w-3 items-center justify-center rounded-xs border bg-border`,children:r(e,{className:`size-2.5`})})}));s.displayName=`ResizableHandle`;export{o as n,a as r,s as t};
+//# sourceMappingURL=resizable-p6zxjcHs.mjs.map

package/dist/resizable-p6zxjcHs.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"resizable-p6zxjcHs.mjs","names":[],"sources":["../packages/components/ui/resizable.tsx"],"sourcesContent":["'use client';\n\nimport { memo } from 'react';\n\nimport { GripVerticalIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport * as ResizablePrimitive from 'react-resizable-panels';\n\ntype TResizablePanelGroup = React.ComponentProps<typeof ResizablePrimitive.PanelGroup>;\n\ntype TResizablePanel = React.ComponentProps<typeof ResizablePrimitive.Panel>;\n\ntype TResizableHandle = React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {\n  withHandle?: boolean;\n};\n\n/**\n * Root container that manages a group of resizable panels; supports horizontal and vertical orientations.\n *\n * @example\n * ```tsx\n * import { ResizablePanelGroup, ResizablePanel, ResizableHandle } from '@customafk/lunas-ui/ui/resizable';\n *\n * <ResizablePanelGroup direction=\"horizontal\">\n *   <ResizablePanel defaultSize={50}>Left</ResizablePanel>\n *   <ResizableHandle withHandle />\n *   <ResizablePanel defaultSize={50}>Right</ResizablePanel>\n * </ResizablePanelGroup>\n * ```\n */\nconst ResizablePanelGroup = memo<TResizablePanelGroup>(({ className, ...props }) => {\n  return (\n    <ResizablePrimitive.PanelGroup\n      data-slot=\"resizable-panel-group\"\n      className={cn('flex h-full w-full data-[panel-group-direction=vertical]:flex-col', className)}\n      {...props}\n    />\n  );\n});\nResizablePanelGroup.displayName = 'ResizablePanelGroup';\n\n/** An individual resizable panel within a ResizablePanelGroup. */\nconst ResizablePanel = memo<TResizablePanel>(({ ...props }) => {\n  return <ResizablePrimitive.Panel data-slot=\"resizable-panel\" {...props} />;\n});\nResizablePanel.displayName = 'ResizablePanel';\n\n/**\n * The drag handle placed between two ResizablePanels to resize them.\n *\n * @param withHandle - When true, renders a visible grip icon centered on the handle.\n */\nconst ResizableHandle = memo<TResizableHandle>(({ withHandle, className, ...props }) => {\n  return (\n    <ResizablePrimitive.PanelResizeHandle\n      data-slot=\"resizable-handle\"\n      className={cn(\n        'relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90',\n        className\n      )}\n      {...props}\n    >\n      {withHandle && (\n        <div className=\"z-10 flex h-4 w-3 items-center justify-center rounded-xs border bg-border\">\n          <GripVerticalIcon className=\"size-2.5\" />\n        </div>\n      )}\n    </ResizablePrimitive.PanelResizeHandle>\n  );\n});\nResizableHandle.displayName = 'ResizableHandle';\n\nexport { ResizableHandle, ResizablePanel, ResizablePanelGroup };\n"],"mappings":"kNAgCA,MAAM,EAAsB,GAA4B,CAAE,YAAW,GAAG,KAEpE,EAAC,EAAmB,WAAA,CAClB,YAAU,wBACV,UAAW,EAAG,oEAAqE,EAAU,CAC7F,GAAI,GACJ,CAEJ,CACF,EAAoB,YAAc,sBAGlC,MAAM,EAAiB,GAAuB,CAAE,GAAG,KAC1C,EAAC,EAAmB,MAAA,CAAM,YAAU,kBAAkB,GAAI,GAAS,CAC1E,CACF,EAAe,YAAc,iBAO7B,MAAM,EAAkB,GAAwB,CAAE,aAAY,YAAW,GAAG,KAExE,EAAC,EAAmB,kBAAA,CAClB,YAAU,mBACV,UAAW,EACT,4oBACA,EACD,CACD,GAAI,WAEH,GACC,EAAC,MAAA,CAAI,UAAU,qFACb,EAAC,EAAA,CAAiB,UAAU,WAAA,CAAa,EACrC,EAE6B,CAEzC,CACF,EAAgB,YAAc"}

package/dist/resizable-yKKhHTqx.cjs

@@ -0,0 +1,2 @@
+const e=require(`./chunk-350yNsax.cjs`);let t=require(`lucide-react`),n=require(`react`),r=require(`@customafk/react-toolkit/utils`),i=require(`react/jsx-runtime`),a=require(`react-resizable-panels`);a=e.n(a);const o=(0,n.memo)(({className:e,...t})=>(0,i.jsx)(a.PanelGroup,{"data-slot":`resizable-panel-group`,className:(0,r.cn)(`flex h-full w-full data-[panel-group-direction=vertical]:flex-col`,e),...t}));o.displayName=`ResizablePanelGroup`;const s=(0,n.memo)(({...e})=>(0,i.jsx)(a.Panel,{"data-slot":`resizable-panel`,...e}));s.displayName=`ResizablePanel`;const c=(0,n.memo)(({withHandle:e,className:n,...o})=>(0,i.jsx)(a.PanelResizeHandle,{"data-slot":`resizable-handle`,className:(0,r.cn)(`relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90`,n),...o,children:e&&(0,i.jsx)(`div`,{className:`z-10 flex h-4 w-3 items-center justify-center rounded-xs border bg-border`,children:(0,i.jsx)(t.GripVerticalIcon,{className:`size-2.5`})})}));c.displayName=`ResizableHandle`,Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return s}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return o}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return c}});
+//# sourceMappingURL=resizable-yKKhHTqx.cjs.map

package/dist/resizable-yKKhHTqx.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"resizable-yKKhHTqx.cjs","names":["ResizablePrimitive","GripVerticalIcon"],"sources":["../packages/components/ui/resizable.tsx"],"sourcesContent":["'use client';\n\nimport { memo } from 'react';\n\nimport { GripVerticalIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport * as ResizablePrimitive from 'react-resizable-panels';\n\ntype TResizablePanelGroup = React.ComponentProps<typeof ResizablePrimitive.PanelGroup>;\n\ntype TResizablePanel = React.ComponentProps<typeof ResizablePrimitive.Panel>;\n\ntype TResizableHandle = React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {\n  withHandle?: boolean;\n};\n\n/**\n * Root container that manages a group of resizable panels; supports horizontal and vertical orientations.\n *\n * @example\n * ```tsx\n * import { ResizablePanelGroup, ResizablePanel, ResizableHandle } from '@customafk/lunas-ui/ui/resizable';\n *\n * <ResizablePanelGroup direction=\"horizontal\">\n *   <ResizablePanel defaultSize={50}>Left</ResizablePanel>\n *   <ResizableHandle withHandle />\n *   <ResizablePanel defaultSize={50}>Right</ResizablePanel>\n * </ResizablePanelGroup>\n * ```\n */\nconst ResizablePanelGroup = memo<TResizablePanelGroup>(({ className, ...props }) => {\n  return (\n    <ResizablePrimitive.PanelGroup\n      data-slot=\"resizable-panel-group\"\n      className={cn('flex h-full w-full data-[panel-group-direction=vertical]:flex-col', className)}\n      {...props}\n    />\n  );\n});\nResizablePanelGroup.displayName = 'ResizablePanelGroup';\n\n/** An individual resizable panel within a ResizablePanelGroup. */\nconst ResizablePanel = memo<TResizablePanel>(({ ...props }) => {\n  return <ResizablePrimitive.Panel data-slot=\"resizable-panel\" {...props} />;\n});\nResizablePanel.displayName = 'ResizablePanel';\n\n/**\n * The drag handle placed between two ResizablePanels to resize them.\n *\n * @param withHandle - When true, renders a visible grip icon centered on the handle.\n */\nconst ResizableHandle = memo<TResizableHandle>(({ withHandle, className, ...props }) => {\n  return (\n    <ResizablePrimitive.PanelResizeHandle\n      data-slot=\"resizable-handle\"\n      className={cn(\n        'relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90',\n        className\n      )}\n      {...props}\n    >\n      {withHandle && (\n        <div className=\"z-10 flex h-4 w-3 items-center justify-center rounded-xs border bg-border\">\n          <GripVerticalIcon className=\"size-2.5\" />\n        </div>\n      )}\n    </ResizablePrimitive.PanelResizeHandle>\n  );\n});\nResizableHandle.displayName = 'ResizableHandle';\n\nexport { ResizableHandle, ResizablePanel, ResizablePanelGroup };\n"],"mappings":"iNAgCA,MAAM,GAAA,EAAA,EAAA,OAAkD,CAAE,YAAW,GAAG,MAEpE,EAAA,EAAA,KAACA,EAAmB,WAAA,CAClB,YAAU,wBACV,WAAA,EAAA,EAAA,IAAc,oEAAqE,EAAU,CAC7F,GAAI,GACJ,CAEJ,CACF,EAAoB,YAAc,sBAGlC,MAAM,GAAA,EAAA,EAAA,OAAwC,CAAE,GAAG,MAC1C,EAAA,EAAA,KAACA,EAAmB,MAAA,CAAM,YAAU,kBAAkB,GAAI,GAAS,CAC1E,CACF,EAAe,YAAc,iBAO7B,MAAM,GAAA,EAAA,EAAA,OAA0C,CAAE,aAAY,YAAW,GAAG,MAExE,EAAA,EAAA,KAACA,EAAmB,kBAAA,CAClB,YAAU,mBACV,WAAA,EAAA,EAAA,IACE,4oBACA,EACD,CACD,GAAI,WAEH,IACC,EAAA,EAAA,KAAC,MAAA,CAAI,UAAU,sFACb,EAAA,EAAA,KAACC,EAAAA,iBAAAA,CAAiB,UAAU,WAAA,CAAa,EACrC,EAE6B,CAEzC,CACF,EAAgB,YAAc"}

package/dist/role-badge-BIgdiY5P.mjs

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

package/dist/role-badge-BIgdiY5P.mjs.map

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

package/dist/role-badge-BwOEEepo.cjs

@@ -0,0 +1,2 @@
+const e=require(`./chunk-350yNsax.cjs`),t=require(`./types-BAAJEExQ.cjs`),n=require(`./badge-7bcsD0vA.cjs`);let r=require(`react/jsx-runtime`);const i={[t.n.ADMIN]:`primary`,[t.n.SUPER_ADMIN]:`danger`,[t.n.MODERATOR]:`info`,[t.n.STAFF]:`accent`,[t.n.USER]:`muted`},a={[t.n.SUPER_ADMIN]:`Super Admin`,[t.n.ADMIN]:`Admin`,[t.n.MODERATOR]:`Moderator`,[t.n.STAFF]:`Staff`,[t.n.USER]:`User`},o=({status:e})=>(0,r.jsx)(n.t,{"data-slot":`role-badge`,color:i[e],className:`min-w-24 justify-center`,children:a[e]});Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return o}});
+//# sourceMappingURL=role-badge-BwOEEepo.cjs.map

package/dist/role-badge-BwOEEepo.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"role-badge-BwOEEepo.cjs","names":["ROLE_COLORS: Record<ERole, React.ComponentProps<typeof Badge>['color']>","ERole","ROLE_LABELS: Record<ERole, string>","RoleBadge: React.FC<RoleBadgeProps>","Badge"],"sources":["../packages/components/data-display/role-badge.tsx"],"sourcesContent":["'use client';\n\nimport { ERole } from '@/types';\n\nimport { Badge } from '../ui/badge';\n\nconst ROLE_COLORS: Record<ERole, React.ComponentProps<typeof Badge>['color']> = {\n  [ERole.ADMIN]: 'primary',\n  [ERole.SUPER_ADMIN]: 'danger',\n  [ERole.MODERATOR]: 'info',\n  [ERole.STAFF]: 'accent',\n  [ERole.USER]: 'muted',\n};\n\nconst ROLE_LABELS: Record<ERole, string> = {\n  [ERole.SUPER_ADMIN]: 'Super Admin',\n  [ERole.ADMIN]: 'Admin',\n  [ERole.MODERATOR]: 'Moderator',\n  [ERole.STAFF]: 'Staff',\n  [ERole.USER]: 'User',\n};\n\ntype RoleBadgeProps = {\n  /** The user role enum value that determines the badge label and colour. */\n  status: ERole;\n};\n\n/**\n * Renders a colour-coded badge for a user role (e.g. Admin, Staff, User).\n *\n * @example\n * ```tsx\n * import { RoleBadge } from '@customafk/lunas-ui/data-display/role-badge';\n * import { ERole } from '@customafk/lunas-ui/types';\n *\n * <RoleBadge status={ERole.ADMIN} />\n * ```\n */\nexport const RoleBadge: React.FC<RoleBadgeProps> = ({ status }) => {\n  return (\n    <Badge data-slot=\"role-badge\" color={ROLE_COLORS[status]} className=\"min-w-24 justify-center\">\n      {ROLE_LABELS[status]}\n    </Badge>\n  );\n};\n"],"mappings":"+IAMA,MAAMA,EAA0E,EAC7EC,EAAAA,EAAM,OAAQ,WACdA,EAAAA,EAAM,aAAc,UACpBA,EAAAA,EAAM,WAAY,QAClBA,EAAAA,EAAM,OAAQ,UACdA,EAAAA,EAAM,MAAO,QACf,CAEKC,EAAqC,EACxCD,EAAAA,EAAM,aAAc,eACpBA,EAAAA,EAAM,OAAQ,SACdA,EAAAA,EAAM,WAAY,aAClBA,EAAAA,EAAM,OAAQ,SACdA,EAAAA,EAAM,MAAO,OACf,CAkBYE,GAAuC,CAAE,aAElD,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAM,YAAU,aAAa,MAAO,EAAY,GAAS,UAAU,mCACjE,EAAY,IACP"}

package/dist/role-badge-CBZdPHUc.d.cts

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

package/dist/role-badge-DeofJ2ep.d.mts

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

package/dist/scroll-area-C7s40z6d.d.mts

@@ -0,0 +1,37 @@
+import * as react139 from "react";
+import { ScrollArea } from "radix-ui";
+
+//#region packages/components/ui/scroll-area.d.ts
+
+/**
+ * A scrollable container with a styled, custom scrollbar that overlays the content.
+ *
+ * @example
+ * ```tsx
+ * import { ScrollArea } from '@customafk/lunas-ui/ui/scroll-area';
+ *
+ * <ScrollArea className="h-64 w-full">
+ *   <div className="p-4">Long content goes here…</div>
+ * </ScrollArea>
+ * ```
+ */
+declare const ScrollArea$1: react139.MemoExoticComponent<({
+  className,
+  children,
+  ref,
+  onScroll,
+  ...props
+}: React.ComponentProps<typeof ScrollArea.Root>) => react139.JSX.Element>;
+/**
+ * The styled scrollbar track and thumb rendered inside a ScrollArea.
+ *
+ * @param orientation - Direction of the scrollbar: `'vertical'` (default) or `'horizontal'`.
+ */
+declare const ScrollBar: react139.MemoExoticComponent<({
+  className,
+  orientation,
+  ...props
+}: React.ComponentProps<typeof ScrollArea.ScrollAreaScrollbar>) => react139.JSX.Element>;
+//#endregion
+export { ScrollBar as n, ScrollArea$1 as t };
+//# sourceMappingURL=scroll-area-C7s40z6d.d.mts.map

package/dist/scroll-area-CKWenzXh.d.cts

@@ -0,0 +1,37 @@
+import * as react219 from "react";
+import { ScrollArea } from "radix-ui";
+
+//#region packages/components/ui/scroll-area.d.ts
+
+/**
+ * A scrollable container with a styled, custom scrollbar that overlays the content.
+ *
+ * @example
+ * ```tsx
+ * import { ScrollArea } from '@customafk/lunas-ui/ui/scroll-area';
+ *
+ * <ScrollArea className="h-64 w-full">
+ *   <div className="p-4">Long content goes here…</div>
+ * </ScrollArea>
+ * ```
+ */
+declare const ScrollArea$1: react219.MemoExoticComponent<({
+  className,
+  children,
+  ref,
+  onScroll,
+  ...props
+}: React.ComponentProps<typeof ScrollArea.Root>) => react219.JSX.Element>;
+/**
+ * The styled scrollbar track and thumb rendered inside a ScrollArea.
+ *
+ * @param orientation - Direction of the scrollbar: `'vertical'` (default) or `'horizontal'`.
+ */
+declare const ScrollBar: react219.MemoExoticComponent<({
+  className,
+  orientation,
+  ...props
+}: React.ComponentProps<typeof ScrollArea.ScrollAreaScrollbar>) => react219.JSX.Element>;
+//#endregion
+export { ScrollBar as n, ScrollArea$1 as t };
+//# sourceMappingURL=scroll-area-CKWenzXh.d.cts.map

package/dist/scroll-area-Dn3a9ZCQ.cjs

@@ -0,0 +1,2 @@
+const e=require(`./chunk-350yNsax.cjs`);let t=require(`react`),n=require(`@customafk/react-toolkit/utils`),r=require(`react/jsx-runtime`),i=require(`radix-ui`);const a=(0,t.memo)(({className:e,children:t,ref:a,onScroll:s,...c})=>(0,r.jsxs)(i.ScrollArea.Root,{"data-slot":`scroll-area`,className:(0,n.cn)(`relative overflow-hidden`,e),...c,children:[(0,r.jsx)(i.ScrollArea.Viewport,{ref:a,className:`size-full rounded-[inherit]`,onScroll:s,children:t}),(0,r.jsx)(o,{}),(0,r.jsx)(i.ScrollArea.Corner,{})]}));a.displayName=`ScrollArea`;const o=(0,t.memo)(({className:e,orientation:t=`vertical`,...a})=>(0,r.jsx)(i.ScrollArea.ScrollAreaScrollbar,{"data-slot":`scroll-area-scrollbar`,orientation:t,className:(0,n.cn)(`flex touch-none select-none border-border-weak p-px transition-colors`,t===`vertical`&&`h-full w-2.5 border-l border-l-transparent`,t===`horizontal`&&`h-2.5 flex-col border-t border-t-transparent`,e),...a,children:(0,r.jsx)(i.ScrollArea.ScrollAreaThumb,{className:`relative flex-1 rounded-full bg-border-weak`})}));o.displayName=`ScrollBar`,Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return o}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return a}});
+//# sourceMappingURL=scroll-area-Dn3a9ZCQ.cjs.map

package/dist/scroll-area-Dn3a9ZCQ.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll-area-Dn3a9ZCQ.cjs","names":["ScrollAreaPrimitive"],"sources":["../packages/components/ui/scroll-area.tsx"],"sourcesContent":["'use client';\nimport { memo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { ScrollArea as ScrollAreaPrimitive } from 'radix-ui';\n\n/**\n * A scrollable container with a styled, custom scrollbar that overlays the content.\n *\n * @example\n * ```tsx\n * import { ScrollArea } from '@customafk/lunas-ui/ui/scroll-area';\n *\n * <ScrollArea className=\"h-64 w-full\">\n *   <div className=\"p-4\">Long content goes here…</div>\n * </ScrollArea>\n * ```\n */\nconst ScrollArea = memo(({ className, children, ref, onScroll, ...props }: React.ComponentProps<typeof ScrollAreaPrimitive.Root>) => {\n  return (\n    <ScrollAreaPrimitive.Root data-slot=\"scroll-area\" className={cn('relative overflow-hidden', className)} {...props}>\n      <ScrollAreaPrimitive.Viewport ref={ref} className=\"size-full rounded-[inherit]\" onScroll={onScroll}>\n        {children}\n      </ScrollAreaPrimitive.Viewport>\n      <ScrollBar />\n      <ScrollAreaPrimitive.Corner />\n    </ScrollAreaPrimitive.Root>\n  );\n});\nScrollArea.displayName = 'ScrollArea';\n\n/**\n * The styled scrollbar track and thumb rendered inside a ScrollArea.\n *\n * @param orientation - Direction of the scrollbar: `'vertical'` (default) or `'horizontal'`.\n */\nconst ScrollBar = memo(({ className, orientation = 'vertical', ...props }: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>) => {\n  return (\n    <ScrollAreaPrimitive.ScrollAreaScrollbar\n      data-slot=\"scroll-area-scrollbar\"\n      orientation={orientation}\n      className={cn(\n        'flex touch-none select-none border-border-weak p-px transition-colors',\n        orientation === 'vertical' && 'h-full w-2.5 border-l border-l-transparent',\n        orientation === 'horizontal' && 'h-2.5 flex-col border-t border-t-transparent',\n        className\n      )}\n      {...props}\n    >\n      <ScrollAreaPrimitive.ScrollAreaThumb className=\"relative flex-1 rounded-full bg-border-weak\" />\n    </ScrollAreaPrimitive.ScrollAreaScrollbar>\n  );\n});\nScrollBar.displayName = 'ScrollBar';\n\nexport { ScrollArea, ScrollBar };\n"],"mappings":"gKAmBA,MAAM,GAAA,EAAA,EAAA,OAAmB,CAAE,YAAW,WAAU,MAAK,WAAU,GAAG,MAE9D,EAAA,EAAA,MAACA,EAAAA,WAAoB,KAAA,CAAK,YAAU,cAAc,WAAA,EAAA,EAAA,IAAc,2BAA4B,EAAU,CAAE,GAAI,aAC1G,EAAA,EAAA,KAACA,EAAAA,WAAoB,SAAA,CAAc,MAAK,UAAU,8BAAwC,WACvF,YAC4B,EAC/B,EAAA,EAAA,KAAC,EAAA,EAAA,CAAY,EACb,EAAA,EAAA,KAACA,EAAAA,WAAoB,OAAA,EAAA,CAAS,GACL,CAE7B,CACF,EAAW,YAAc,aAOzB,MAAM,GAAA,EAAA,EAAA,OAAkB,CAAE,YAAW,cAAc,WAAY,GAAG,MAE9D,EAAA,EAAA,KAACA,EAAAA,WAAoB,oBAAA,CACnB,YAAU,wBACG,cACb,WAAA,EAAA,EAAA,IACE,wEACA,IAAgB,YAAc,6CAC9B,IAAgB,cAAgB,+CAChC,EACD,CACD,GAAI,YAEJ,EAAA,EAAA,KAACA,EAAAA,WAAoB,gBAAA,CAAgB,UAAU,8CAAA,CAAgD,EACvD,CAE5C,CACF,EAAU,YAAc"}

package/dist/scroll-area-DrZOWroA.mjs

@@ -0,0 +1,2 @@
+import{memo as e}from"react";import{cn as t}from"@customafk/react-toolkit/utils";import{jsx as n,jsxs as r}from"react/jsx-runtime";import{ScrollArea as i}from"radix-ui";const a=e(({className:e,children:a,ref:s,onScroll:c,...l})=>r(i.Root,{"data-slot":`scroll-area`,className:t(`relative overflow-hidden`,e),...l,children:[n(i.Viewport,{ref:s,className:`size-full rounded-[inherit]`,onScroll:c,children:a}),n(o,{}),n(i.Corner,{})]}));a.displayName=`ScrollArea`;const o=e(({className:e,orientation:r=`vertical`,...a})=>n(i.ScrollAreaScrollbar,{"data-slot":`scroll-area-scrollbar`,orientation:r,className:t(`flex touch-none select-none border-border-weak p-px transition-colors`,r===`vertical`&&`h-full w-2.5 border-l border-l-transparent`,r===`horizontal`&&`h-2.5 flex-col border-t border-t-transparent`,e),...a,children:n(i.ScrollAreaThumb,{className:`relative flex-1 rounded-full bg-border-weak`})}));o.displayName=`ScrollBar`;export{o as n,a as t};
+//# sourceMappingURL=scroll-area-DrZOWroA.mjs.map

package/dist/scroll-area-DrZOWroA.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll-area-DrZOWroA.mjs","names":["ScrollArea","ScrollAreaPrimitive"],"sources":["../packages/components/ui/scroll-area.tsx"],"sourcesContent":["'use client';\nimport { memo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { ScrollArea as ScrollAreaPrimitive } from 'radix-ui';\n\n/**\n * A scrollable container with a styled, custom scrollbar that overlays the content.\n *\n * @example\n * ```tsx\n * import { ScrollArea } from '@customafk/lunas-ui/ui/scroll-area';\n *\n * <ScrollArea className=\"h-64 w-full\">\n *   <div className=\"p-4\">Long content goes here…</div>\n * </ScrollArea>\n * ```\n */\nconst ScrollArea = memo(({ className, children, ref, onScroll, ...props }: React.ComponentProps<typeof ScrollAreaPrimitive.Root>) => {\n  return (\n    <ScrollAreaPrimitive.Root data-slot=\"scroll-area\" className={cn('relative overflow-hidden', className)} {...props}>\n      <ScrollAreaPrimitive.Viewport ref={ref} className=\"size-full rounded-[inherit]\" onScroll={onScroll}>\n        {children}\n      </ScrollAreaPrimitive.Viewport>\n      <ScrollBar />\n      <ScrollAreaPrimitive.Corner />\n    </ScrollAreaPrimitive.Root>\n  );\n});\nScrollArea.displayName = 'ScrollArea';\n\n/**\n * The styled scrollbar track and thumb rendered inside a ScrollArea.\n *\n * @param orientation - Direction of the scrollbar: `'vertical'` (default) or `'horizontal'`.\n */\nconst ScrollBar = memo(({ className, orientation = 'vertical', ...props }: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>) => {\n  return (\n    <ScrollAreaPrimitive.ScrollAreaScrollbar\n      data-slot=\"scroll-area-scrollbar\"\n      orientation={orientation}\n      className={cn(\n        'flex touch-none select-none border-border-weak p-px transition-colors',\n        orientation === 'vertical' && 'h-full w-2.5 border-l border-l-transparent',\n        orientation === 'horizontal' && 'h-2.5 flex-col border-t border-t-transparent',\n        className\n      )}\n      {...props}\n    >\n      <ScrollAreaPrimitive.ScrollAreaThumb className=\"relative flex-1 rounded-full bg-border-weak\" />\n    </ScrollAreaPrimitive.ScrollAreaScrollbar>\n  );\n});\nScrollBar.displayName = 'ScrollBar';\n\nexport { ScrollArea, ScrollBar };\n"],"mappings":"yKAmBA,MAAMA,EAAa,GAAM,CAAE,YAAW,WAAU,MAAK,WAAU,GAAG,KAE9D,EAACC,EAAoB,KAAA,CAAK,YAAU,cAAc,UAAW,EAAG,2BAA4B,EAAU,CAAE,GAAI,YAC1G,EAACA,EAAoB,SAAA,CAAc,MAAK,UAAU,8BAAwC,WACvF,YAC4B,CAC/B,EAAC,EAAA,EAAA,CAAY,CACb,EAACA,EAAoB,OAAA,EAAA,CAAS,GACL,CAE7B,CACF,EAAW,YAAc,aAOzB,MAAM,EAAY,GAAM,CAAE,YAAW,cAAc,WAAY,GAAG,KAE9D,EAACA,EAAoB,oBAAA,CACnB,YAAU,wBACG,cACb,UAAW,EACT,wEACA,IAAgB,YAAc,6CAC9B,IAAgB,cAAgB,+CAChC,EACD,CACD,GAAI,WAEJ,EAACA,EAAoB,gBAAA,CAAgB,UAAU,8CAAA,CAAgD,EACvD,CAE5C,CACF,EAAU,YAAc"}

package/dist/search-input-7m30vApQ.d.mts

@@ -0,0 +1,29 @@
+import { t as Input } from "./input-BVTLQHpd.mjs";
+import * as react4 from "react";
+
+//#region packages/components/ui/inputs/search-input.d.ts
+
+/**
+ * Props for {@link SearchInput}. Accepts all native props of the underlying
+ * `Input` component (itself a thin wrapper around `<input>`), including
+ * `value`, `defaultValue`, `onChange`, `placeholder`, `disabled`, etc.
+ * The `type` prop is fixed to `"search"` and cannot be overridden.
+ */
+type Props = React.ComponentPropsWithoutRef<typeof Input>;
+/**
+ * A search input field with a leading search icon and a trailing arrow submit button, intended for use inside an HTML `<form>` element.
+ *
+ * @example
+ * import { SearchInput } from '@customafk/lunas-ui/ui/inputs/search-input';
+ *
+ * <form onSubmit={handleSearch}>
+ *   <SearchInput placeholder="Search…" value={query} onChange={(e) => setQuery(e.target.value)} />
+ * </form>
+ */
+declare const SearchInput: ({
+  className,
+  ...rest
+}: Props) => react4.JSX.Element;
+//#endregion
+export { SearchInput as t };
+//# sourceMappingURL=search-input-7m30vApQ.d.mts.map

package/dist/search-input-BCYwlwtk.cjs

@@ -0,0 +1,2 @@
+const e=require(`./chunk-350yNsax.cjs`),t=require(`./input-BatF2xqI.cjs`);let n=require(`lucide-react`),r=require(`@customafk/react-toolkit/utils`),i=require(`react/jsx-runtime`);const a=({className:e,...a})=>(0,i.jsxs)(`div`,{className:`relative`,children:[(0,i.jsx)(t.t,{...a,type:`search`,className:(0,r.cn)(`ps-9 pe-9`,e)}),(0,i.jsx)(`div`,{className:`pointer-events-none absolute inset-y-0 start-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50`,children:(0,i.jsx)(n.SearchIcon,{size:16})}),(0,i.jsx)(`button`,{className:`absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50`,"aria-label":`Submit search`,type:`submit`,children:(0,i.jsx)(n.ArrowRightIcon,{size:16,"aria-hidden":`true`})})]});Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return a}});
+//# sourceMappingURL=search-input-BCYwlwtk.cjs.map

package/dist/search-input-BCYwlwtk.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"search-input-BCYwlwtk.cjs","names":["Input","SearchIcon","ArrowRightIcon"],"sources":["../packages/components/ui/inputs/search-input.tsx"],"sourcesContent":["import { ArrowRightIcon, SearchIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Input } from '../input';\n\n/**\n * Props for {@link SearchInput}. Accepts all native props of the underlying\n * `Input` component (itself a thin wrapper around `<input>`), including\n * `value`, `defaultValue`, `onChange`, `placeholder`, `disabled`, etc.\n * The `type` prop is fixed to `\"search\"` and cannot be overridden.\n */\ntype Props = React.ComponentPropsWithoutRef<typeof Input>;\n\n/**\n * A search input field with a leading search icon and a trailing arrow submit button, intended for use inside an HTML `<form>` element.\n *\n * @example\n * import { SearchInput } from '@customafk/lunas-ui/ui/inputs/search-input';\n *\n * <form onSubmit={handleSearch}>\n *   <SearchInput placeholder=\"Search…\" value={query} onChange={(e) => setQuery(e.target.value)} />\n * </form>\n */\nexport const SearchInput = ({ className, ...rest }: Props) => {\n  return (\n    <div className=\"relative\">\n      <Input {...rest} type=\"search\" className={cn('ps-9 pe-9', className)} />\n      <div className=\"pointer-events-none absolute inset-y-0 start-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50\">\n        <SearchIcon size={16} />\n      </div>\n      <button\n        className=\"absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50\"\n        aria-label=\"Submit search\"\n        type=\"submit\"\n      >\n        <ArrowRightIcon size={16} aria-hidden=\"true\" />\n      </button>\n    </div>\n  );\n};\n"],"mappings":"mLAwBA,MAAa,GAAe,CAAE,YAAW,GAAG,MAExC,EAAA,EAAA,MAAC,MAAA,CAAI,UAAU,sBACb,EAAA,EAAA,KAACA,EAAAA,EAAAA,CAAM,GAAI,EAAM,KAAK,SAAS,WAAA,EAAA,EAAA,IAAc,YAAa,EAAU,EAAI,EACxE,EAAA,EAAA,KAAC,MAAA,CAAI,UAAU,kJACb,EAAA,EAAA,KAACC,EAAAA,WAAAA,CAAW,KAAM,GAAA,CAAM,EACpB,EACN,EAAA,EAAA,KAAC,SAAA,CACC,UAAU,0XACV,aAAW,gBACX,KAAK,mBAEL,EAAA,EAAA,KAACC,EAAAA,eAAAA,CAAe,KAAM,GAAI,cAAY,QAAS,EACxC,GACL"}

package/dist/search-input-DVtHPbme.d.cts

@@ -0,0 +1,29 @@
+import { t as Input } from "./input-BDCw9qBl.cjs";
+import * as react34 from "react";
+
+//#region packages/components/ui/inputs/search-input.d.ts
+
+/**
+ * Props for {@link SearchInput}. Accepts all native props of the underlying
+ * `Input` component (itself a thin wrapper around `<input>`), including
+ * `value`, `defaultValue`, `onChange`, `placeholder`, `disabled`, etc.
+ * The `type` prop is fixed to `"search"` and cannot be overridden.
+ */
+type Props = React.ComponentPropsWithoutRef<typeof Input>;
+/**
+ * A search input field with a leading search icon and a trailing arrow submit button, intended for use inside an HTML `<form>` element.
+ *
+ * @example
+ * import { SearchInput } from '@customafk/lunas-ui/ui/inputs/search-input';
+ *
+ * <form onSubmit={handleSearch}>
+ *   <SearchInput placeholder="Search…" value={query} onChange={(e) => setQuery(e.target.value)} />
+ * </form>
+ */
+declare const SearchInput: ({
+  className,
+  ...rest
+}: Props) => react34.JSX.Element;
+//#endregion
+export { SearchInput as t };
+//# sourceMappingURL=search-input-DVtHPbme.d.cts.map

package/dist/search-input-D_nJ8McN.mjs

@@ -0,0 +1,2 @@
+import{t as e}from"./input-CFsouxvo.mjs";import{ArrowRightIcon as t,SearchIcon as n}from"lucide-react";import{cn as r}from"@customafk/react-toolkit/utils";import{jsx as i,jsxs as a}from"react/jsx-runtime";const o=({className:o,...s})=>a(`div`,{className:`relative`,children:[i(e,{...s,type:`search`,className:r(`ps-9 pe-9`,o)}),i(`div`,{className:`pointer-events-none absolute inset-y-0 start-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50`,children:i(n,{size:16})}),i(`button`,{className:`absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50`,"aria-label":`Submit search`,type:`submit`,children:i(t,{size:16,"aria-hidden":`true`})})]});export{o as t};
+//# sourceMappingURL=search-input-D_nJ8McN.mjs.map

package/dist/search-input-D_nJ8McN.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"search-input-D_nJ8McN.mjs","names":[],"sources":["../packages/components/ui/inputs/search-input.tsx"],"sourcesContent":["import { ArrowRightIcon, SearchIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Input } from '../input';\n\n/**\n * Props for {@link SearchInput}. Accepts all native props of the underlying\n * `Input` component (itself a thin wrapper around `<input>`), including\n * `value`, `defaultValue`, `onChange`, `placeholder`, `disabled`, etc.\n * The `type` prop is fixed to `\"search\"` and cannot be overridden.\n */\ntype Props = React.ComponentPropsWithoutRef<typeof Input>;\n\n/**\n * A search input field with a leading search icon and a trailing arrow submit button, intended for use inside an HTML `<form>` element.\n *\n * @example\n * import { SearchInput } from '@customafk/lunas-ui/ui/inputs/search-input';\n *\n * <form onSubmit={handleSearch}>\n *   <SearchInput placeholder=\"Search…\" value={query} onChange={(e) => setQuery(e.target.value)} />\n * </form>\n */\nexport const SearchInput = ({ className, ...rest }: Props) => {\n  return (\n    <div className=\"relative\">\n      <Input {...rest} type=\"search\" className={cn('ps-9 pe-9', className)} />\n      <div className=\"pointer-events-none absolute inset-y-0 start-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50\">\n        <SearchIcon size={16} />\n      </div>\n      <button\n        className=\"absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50\"\n        aria-label=\"Submit search\"\n        type=\"submit\"\n      >\n        <ArrowRightIcon size={16} aria-hidden=\"true\" />\n      </button>\n    </div>\n  );\n};\n"],"mappings":"6MAwBA,MAAa,GAAe,CAAE,YAAW,GAAG,KAExC,EAAC,MAAA,CAAI,UAAU,qBACb,EAAC,EAAA,CAAM,GAAI,EAAM,KAAK,SAAS,UAAW,EAAG,YAAa,EAAU,EAAI,CACxE,EAAC,MAAA,CAAI,UAAU,iJACb,EAAC,EAAA,CAAW,KAAM,GAAA,CAAM,EACpB,CACN,EAAC,SAAA,CACC,UAAU,0XACV,aAAW,gBACX,KAAK,kBAEL,EAAC,EAAA,CAAe,KAAM,GAAI,cAAY,QAAS,EACxC,GACL"}

package/dist/search-modal-BJhXWOiv.cjs

@@ -0,0 +1,2 @@
+const e=require(`./chunk-350yNsax.cjs`),t=require(`./dialog-DNEUhYSv.cjs`),n=require(`./command-BQFbzzTr.cjs`);let r=require(`lucide-react`),i=require(`react/jsx-runtime`);const a=({value:e})=>(0,i.jsx)(n.o,{value:e,children:(0,i.jsxs)(`div`,{className:`size-full flex space-x-2 items-center`,children:[(0,i.jsx)(`div`,{className:`size-12 border border-border rounded-lg bg-card`}),(0,i.jsxs)(`div`,{className:`flex flex-col grow text-sm`,children:[(0,i.jsxs)(`p`,{className:`font-semibold`,children:[`Content Item for `,e]}),(0,i.jsx)(`p`,{className:`font-medium text-text-positive-weak`,children:`100.000VND`})]}),(0,i.jsx)(`button`,{className:`size-8 flex items-center justify-center grow-0`,children:(0,i.jsx)(r.ForwardIcon,{size:20,className:`text-text-positive-weak`})})]})}),o=()=>(0,i.jsxs)(n.t,{children:[(0,i.jsx)(n.a,{placeholder:`Type a command or search...`}),(0,i.jsxs)(n.s,{children:[(0,i.jsxs)(n.r,{className:`h-80 flex flex-col items-center justify-center space-y-2`,children:[(0,i.jsx)(r.Package2Icon,{strokeWidth:1,size:64,className:`text-text-positive-weak`}),(0,i.jsx)(`span`,{className:`ml-2`,children:`No results found.`})]}),(0,i.jsxs)(n.i,{heading:`Search Results`,children:[(0,i.jsx)(a,{value:`example-item-1`}),(0,i.jsx)(a,{value:`example-item-2`}),(0,i.jsx)(a,{value:`example-item-3`})]})]})]}),s=()=>(0,i.jsx)(t.t,{open:!0,children:(0,i.jsx)(t.r,{showCloseButton:!1,className:`sm:max-w-3xl`,children:(0,i.jsx)(o,{})})});Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return s}});
+//# sourceMappingURL=search-modal-BJhXWOiv.cjs.map

package/dist/search-modal-BJhXWOiv.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"search-modal-BJhXWOiv.cjs","names":["Item: React.FC<{\n  value: string;\n}>","CommandItem","ForwardIcon","Command","CommandInput","CommandList","CommandEmpty","Package2Icon","CommandGroup","Dialog","DialogContent"],"sources":["../packages/components/features/search-modal/components/command.tsx","../packages/components/features/search-modal/index.tsx"],"sourcesContent":["import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from '@/components/ui/command';\nimport { ForwardIcon, Package2Icon } from 'lucide-react';\n\nconst Item: React.FC<{\n  value: string;\n}> = ({ value }) => {\n  return (\n    <CommandItem value={value}>\n      <div className=\"size-full flex space-x-2 items-center\">\n        <div className=\"size-12 border border-border rounded-lg bg-card\" />\n        <div className=\"flex flex-col grow text-sm\">\n          <p className=\"font-semibold\">Content Item for {value}</p>\n          <p className=\"font-medium text-text-positive-weak\">100.000VND</p>\n        </div>\n        <button className=\"size-8 flex items-center justify-center grow-0\">\n          <ForwardIcon size={20} className=\"text-text-positive-weak\" />\n        </button>\n      </div>\n    </CommandItem>\n  );\n};\n\nexport const SearchCommand = () => {\n  return (\n    <Command>\n      <CommandInput placeholder=\"Type a command or search...\" />\n      <CommandList>\n        <CommandEmpty className=\"h-80 flex flex-col items-center justify-center space-y-2\">\n          <Package2Icon strokeWidth={1} size={64} className=\"text-text-positive-weak\" />\n          <span className=\"ml-2\">No results found.</span>\n        </CommandEmpty>\n        <CommandGroup heading=\"Search Results\">\n          <Item value=\"example-item-1\" />\n          <Item value=\"example-item-2\" />\n          <Item value=\"example-item-3\" />\n        </CommandGroup>\n      </CommandList>\n    </Command>\n  );\n};\n","import { Dialog, DialogContent } from '@/components/ui/dialog';\nimport { SearchCommand } from './components/command';\n\n/**\n * A full-screen command-palette modal that wraps the internal `SearchCommand` component inside an always-open dialog.\n *\n * @example\n * import { SearchModal } from '@customafk/lunas-ui/features/search-modal';\n *\n * // Render conditionally based on application state\n * {isSearchOpen && <SearchModal />}\n */\nexport const SearchModal = () => {\n  return (\n    <Dialog open>\n      <DialogContent showCloseButton={false} className=\"sm:max-w-3xl\">\n        <SearchCommand />\n      </DialogContent>\n    </Dialog>\n  );\n};\n"],"mappings":"4KAGA,MAAMA,GAEA,CAAE,YAEJ,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAmB,kBAClB,EAAA,EAAA,MAAC,MAAA,CAAI,UAAU,mDACb,EAAA,EAAA,KAAC,MAAA,CAAI,UAAU,kDAAA,CAAoD,EACnE,EAAA,EAAA,MAAC,MAAA,CAAI,UAAU,wCACb,EAAA,EAAA,MAAC,IAAA,CAAE,UAAU,0BAAgB,oBAAkB,EAAA,EAAU,EACzD,EAAA,EAAA,KAAC,IAAA,CAAE,UAAU,+CAAsC,cAAc,CAAA,EAC7D,EACN,EAAA,EAAA,KAAC,SAAA,CAAO,UAAU,2DAChB,EAAA,EAAA,KAACC,EAAAA,YAAAA,CAAY,KAAM,GAAI,UAAU,2BAA4B,EACtD,GACL,EACM,CAIL,OAET,EAAA,EAAA,MAACC,EAAAA,EAAAA,CAAAA,SAAAA,EACC,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAa,YAAY,8BAAA,CAAgC,EAC1D,EAAA,EAAA,MAACC,EAAAA,EAAAA,CAAAA,SAAAA,EACC,EAAA,EAAA,MAACC,EAAAA,EAAAA,CAAa,UAAU,sEACtB,EAAA,EAAA,KAACC,EAAAA,aAAAA,CAAa,YAAa,EAAG,KAAM,GAAI,UAAU,2BAA4B,EAC9E,EAAA,EAAA,KAAC,OAAA,CAAK,UAAU,gBAAO,qBAAwB,CAAA,EAClC,EACf,EAAA,EAAA,MAACC,EAAAA,EAAAA,CAAa,QAAQ,4BACpB,EAAA,EAAA,KAAC,EAAA,CAAK,MAAM,iBAAA,CAAmB,EAC/B,EAAA,EAAA,KAAC,EAAA,CAAK,MAAM,iBAAA,CAAmB,EAC/B,EAAA,EAAA,KAAC,EAAA,CAAK,MAAM,iBAAA,CAAmB,GAClB,CAAA,CAAA,CACH,CAAA,CAAA,CACN,CCzBD,OAET,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAO,KAAA,aACN,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAc,gBAAiB,GAAO,UAAU,yBAC/C,EAAA,EAAA,KAAC,EAAA,EAAA,CAAgB,EACH,EACT"}

package/dist/search-modal-BpHuii66.mjs

@@ -0,0 +1,2 @@
+import{r as e,t}from"./dialog--BvCecaD.mjs";import{a as n,i as r,o as i,r as a,s as o,t as s}from"./command-CQMdYoAm.mjs";import{ForwardIcon as c,Package2Icon as l}from"lucide-react";import{jsx as u,jsxs as d}from"react/jsx-runtime";const f=({value:e})=>u(i,{value:e,children:d(`div`,{className:`size-full flex space-x-2 items-center`,children:[u(`div`,{className:`size-12 border border-border rounded-lg bg-card`}),d(`div`,{className:`flex flex-col grow text-sm`,children:[d(`p`,{className:`font-semibold`,children:[`Content Item for `,e]}),u(`p`,{className:`font-medium text-text-positive-weak`,children:`100.000VND`})]}),u(`button`,{className:`size-8 flex items-center justify-center grow-0`,children:u(c,{size:20,className:`text-text-positive-weak`})})]})}),p=()=>d(s,{children:[u(n,{placeholder:`Type a command or search...`}),d(o,{children:[d(a,{className:`h-80 flex flex-col items-center justify-center space-y-2`,children:[u(l,{strokeWidth:1,size:64,className:`text-text-positive-weak`}),u(`span`,{className:`ml-2`,children:`No results found.`})]}),d(r,{heading:`Search Results`,children:[u(f,{value:`example-item-1`}),u(f,{value:`example-item-2`}),u(f,{value:`example-item-3`})]})]})]}),m=()=>u(t,{open:!0,children:u(e,{showCloseButton:!1,className:`sm:max-w-3xl`,children:u(p,{})})});export{m as t};
+//# sourceMappingURL=search-modal-BpHuii66.mjs.map

package/dist/search-modal-BpHuii66.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"search-modal-BpHuii66.mjs","names":["Item: React.FC<{\n  value: string;\n}>"],"sources":["../packages/components/features/search-modal/components/command.tsx","../packages/components/features/search-modal/index.tsx"],"sourcesContent":["import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from '@/components/ui/command';\nimport { ForwardIcon, Package2Icon } from 'lucide-react';\n\nconst Item: React.FC<{\n  value: string;\n}> = ({ value }) => {\n  return (\n    <CommandItem value={value}>\n      <div className=\"size-full flex space-x-2 items-center\">\n        <div className=\"size-12 border border-border rounded-lg bg-card\" />\n        <div className=\"flex flex-col grow text-sm\">\n          <p className=\"font-semibold\">Content Item for {value}</p>\n          <p className=\"font-medium text-text-positive-weak\">100.000VND</p>\n        </div>\n        <button className=\"size-8 flex items-center justify-center grow-0\">\n          <ForwardIcon size={20} className=\"text-text-positive-weak\" />\n        </button>\n      </div>\n    </CommandItem>\n  );\n};\n\nexport const SearchCommand = () => {\n  return (\n    <Command>\n      <CommandInput placeholder=\"Type a command or search...\" />\n      <CommandList>\n        <CommandEmpty className=\"h-80 flex flex-col items-center justify-center space-y-2\">\n          <Package2Icon strokeWidth={1} size={64} className=\"text-text-positive-weak\" />\n          <span className=\"ml-2\">No results found.</span>\n        </CommandEmpty>\n        <CommandGroup heading=\"Search Results\">\n          <Item value=\"example-item-1\" />\n          <Item value=\"example-item-2\" />\n          <Item value=\"example-item-3\" />\n        </CommandGroup>\n      </CommandList>\n    </Command>\n  );\n};\n","import { Dialog, DialogContent } from '@/components/ui/dialog';\nimport { SearchCommand } from './components/command';\n\n/**\n * A full-screen command-palette modal that wraps the internal `SearchCommand` component inside an always-open dialog.\n *\n * @example\n * import { SearchModal } from '@customafk/lunas-ui/features/search-modal';\n *\n * // Render conditionally based on application state\n * {isSearchOpen && <SearchModal />}\n */\nexport const SearchModal = () => {\n  return (\n    <Dialog open>\n      <DialogContent showCloseButton={false} className=\"sm:max-w-3xl\">\n        <SearchCommand />\n      </DialogContent>\n    </Dialog>\n  );\n};\n"],"mappings":"yOAGA,MAAMA,GAEA,CAAE,WAEJ,EAAC,EAAA,CAAmB,iBAClB,EAAC,MAAA,CAAI,UAAU,kDACb,EAAC,MAAA,CAAI,UAAU,kDAAA,CAAoD,CACnE,EAAC,MAAA,CAAI,UAAU,uCACb,EAAC,IAAA,CAAE,UAAU,0BAAgB,oBAAkB,EAAA,EAAU,CACzD,EAAC,IAAA,CAAE,UAAU,+CAAsC,cAAc,CAAA,EAC7D,CACN,EAAC,SAAA,CAAO,UAAU,0DAChB,EAAC,EAAA,CAAY,KAAM,GAAI,UAAU,2BAA4B,EACtD,GACL,EACM,CAIL,MAET,EAAC,EAAA,CAAA,SAAA,CACC,EAAC,EAAA,CAAa,YAAY,8BAAA,CAAgC,CAC1D,EAAC,EAAA,CAAA,SAAA,CACC,EAAC,EAAA,CAAa,UAAU,qEACtB,EAAC,EAAA,CAAa,YAAa,EAAG,KAAM,GAAI,UAAU,2BAA4B,CAC9E,EAAC,OAAA,CAAK,UAAU,gBAAO,qBAAwB,CAAA,EAClC,CACf,EAAC,EAAA,CAAa,QAAQ,2BACpB,EAAC,EAAA,CAAK,MAAM,iBAAA,CAAmB,CAC/B,EAAC,EAAA,CAAK,MAAM,iBAAA,CAAmB,CAC/B,EAAC,EAAA,CAAK,MAAM,iBAAA,CAAmB,GAClB,CAAA,CAAA,CACH,CAAA,CAAA,CACN,CCzBD,MAET,EAAC,EAAA,CAAO,KAAA,YACN,EAAC,EAAA,CAAc,gBAAiB,GAAO,UAAU,wBAC/C,EAAC,EAAA,EAAA,CAAgB,EACH,EACT"}