@customafk/lunas-ui 0.2.4 → 0.2.6

package/dist/layouts/cms-layout/index.d.mts

@@ -1,23 +1,76 @@
 //#region packages/components/layouts/cms-layout/index.d.ts
-declare const CMSLayout: React.FC<React.PropsWithChildren<{
+type NavItem = {
+  /** Unique identifier for the nav item, used as React key and for active-state comparison. */
+  id: string;
+  /** Human-readable label rendered inside the sidebar button. */
+  label: string;
+  /** Optional icon element rendered to the left of the label. */
+  icon?: React.ReactNode;
+  /** Callback fired when the sidebar button is clicked. */
+  onClick?: () => void;
+};
+type NavGroup = {
+  /** Unique identifier for the group, used as React key. */
+  id: string;
+  /** Optional section heading rendered above the group's items. */
+  label?: string;
+  /** Navigation items that belong to this group. */
+  items: NavItem[];
+};
+type CMSLayoutProps = {
+  /** Text label used by the header for language-toggle or i18n display. */
   i18nText?: string;
+  /** ID of the currently active navigation item; matched against `NavItem.id` to highlight the active button. */
   activeNavItemId?: string;
+  /** Sidebar navigation definition; omitting this prop renders an empty sidebar. */
   sidebar?: {
-    groupcontent: {
-      id: string;
-      label?: string;
-      items: {
-        id: string;
-        label: string;
-        icon?: React.ReactNode;
-        onClick?: () => void;
-      }[];
-    }[];
+    groupcontent: NavGroup[];
   };
+  /** Callback fired when the logout button is clicked. */
   onLogout?: () => void;
+  /** Callback fired when the user switches the UI locale to English. */
   onChangeToEnLocale?: () => void;
+  /** Callback fired when the user switches the UI locale to Vietnamese. */
   onChangeToViLocale?: () => void;
-}>>;
+  /**
+   * Label displayed on the logout button.
+   * @default 'Log out'
+   */
+  logoutLabel?: string;
+  /**
+   * Copyright string shown at the bottom of the sidebar.
+   * @default `Copyright © <current year>, Lunas.`
+   */
+  copyright?: string;
+};
+/**
+ * Full-page CMS application shell with a collapsible inset sidebar, header, and main content area.
+ *
+ * @example
+ * ```tsx
+ * import { CMSLayout } from '@customafk/lunas-ui/layouts/cms-layout';
+ * import { LayoutDashboardIcon } from 'lucide-react';
+ *
+ * <CMSLayout
+ *   activeNavItemId="dashboard"
+ *   sidebar={{
+ *     groupcontent: [
+ *       {
+ *         id: 'main',
+ *         label: 'Main',
+ *         items: [
+ *           { id: 'dashboard', label: 'Dashboard', icon: <LayoutDashboardIcon />, onClick: () => router.push('/') },
+ *         ],
+ *       },
+ *     ],
+ *   }}
+ *   onLogout={() => signOut()}
+ * >
+ *   <DashboardPage />
+ * </CMSLayout>
+ * ```
+ */
+declare const CMSLayout: React.FC<React.PropsWithChildren<CMSLayoutProps>>;
 //#endregion
-export { CMSLayout };
+export { CMSLayout, CMSLayoutProps };
 //# sourceMappingURL=index.d.mts.map

package/dist/layouts/cms-layout/index.mjs

@@ -1,2 +1 @@
-import{t as e}from"../../dist-CvmzZ_6C.mjs";import"../../button.variants-DRWf66hR.mjs";import{t}from"../../button-BQTNG97Y.mjs";import"../../skeleton-Ba6koCVf.mjs";import{i as n,n as r,r as i,t as a}from"../../tooltip-B3dTcgcc.mjs";import{t as o}from"../../separator-Bf0gymN4.mjs";import{i as s,o as c,r as l,s as u,t as d}from"../../sheet-oadGRiie.mjs";import{a as f,h as p,i as m,r as h,t as g}from"../../dropdown-menu-B8GUTfTp.mjs";import{t as _}from"../../input-DBtIgQB6.mjs";import{cn as v}from"@customafk/react-toolkit/utils";import{cva as y}from"class-variance-authority";import{createContext as b,memo as x,useCallback as S,useContext as C,useEffect as w,useMemo as T,useState as E}from"react";import{jsx as D,jsxs as O}from"react/jsx-runtime";import{EarthIcon as k,LogOutIcon as A,MenuIcon as j,ShoppingCartIcon as M}from"lucide-react";import{useIsMobile as N}from"@customafk/react-toolkit/hooks/useMobile";const P=b(null);function F(){let e=C(P);if(!e)throw Error(`useSidebar must be used within a SidebarProvider.`);return e}function I({defaultOpen:e=!0,open:t,onOpenChange:n,className:r,style:a,children:o,...s}){let c=N(),[l,u]=E(!1),[d,f]=E(e),p=t??d,m=S(e=>{let t=typeof e==`function`?e(p):e;n?n(t):f(t),document.cookie=`sidebar_state=${t}; path=/; max-age=604800`},[n,p]),h=S(()=>c?u(e=>!e):m(e=>!e),[c,m]);w(()=>{let e=e=>{e.key===`b`&&(e.metaKey||e.ctrlKey)&&(e.preventDefault(),h())};return window.addEventListener(`keydown`,e),()=>window.removeEventListener(`keydown`,e)},[h]);let g=p?`expanded`:`collapsed`,_=T(()=>({state:g,open:p,setOpen:m,isMobile:c,openMobile:l,setOpenMobile:u,toggleSidebar:h}),[g,p,m,c,l,h]);return D(P.Provider,{value:_,children:D(i,{delayDuration:0,children:D(`section`,{"data-slot":`layout-wrapper`,style:{"--sidebar-width":`16rem`,"--sidebar-width-icon":`3rem`,...a},className:`relative group/sidebar-wrapper flex h-dvh bg-sidebar`,...s,children:o})})})}const L=x(({side:e=`left`,variant:n=`sidebar`,collapsible:r=`offcanvas`,className:i,children:a,...o})=>{let{isMobile:f,state:p,openMobile:m,setOpenMobile:h,toggleSidebar:g}=F(),_=S(e=>{g(),e.preventDefault(),e.stopPropagation()},[g]);return r===`none`?D(`aside`,{"data-slot":`sidebar`,className:v(`flex w-(--sidebar-width) flex-col bg-sidebar text-sidebar-foreground`,i),...o,children:a}):f?D(d,{open:m,onOpenChange:h,...o,children:O(l,{"data-sidebar":`sidebar`,"data-slot":`sidebar`,"data-mobile":`true`,style:{"--sidebar-width":`18rem`},side:e,className:`w-(--sidebar-width) bg-sidebar p-0 text-sidebar-foreground sm:max-w-3xs [&>button]:hidden`,children:[O(c,{className:`sr-only`,children:[D(u,{children:`Sidebar`}),D(s,{children:`Displays the mobile sidebar.`})]}),O(`div`,{className:`flex size-full flex-col`,children:[O(`div`,{className:`flex flex-0 items-center gap-x-2 border-border-weak border-b p-2 pr-4`,children:[O(t,{"data-sidebar":`trigger`,"data-slot":`sidebar-trigger`,variant:`ghost`,color:`muted`,size:`icon`,className:v(`size-10 rounded-full`,i),onClick:_,children:[D(j,{className:`size-6!`}),D(`span`,{className:`sr-only`,children:`Toggle Sidebar`})]}),D(`div`,{className:`ml-2 flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground`,children:D(M,{size:20})}),O(`div`,{className:`grid flex-1 text-left text-sm leading-tight`,children:[D(`span`,{className:`truncate font-medium`,children:`Lunas Store`}),D(`span`,{className:`truncate text-xs`,children:`Established 2023`})]})]}),D(`div`,{className:`flex flex-1 flex-col p-2`,children:a})]})]})}):O(`aside`,{className:`group peer hidden bg-card text-sidebar-foreground md:block`,"data-state":p,"data-collapsible":p===`collapsed`?r:``,"data-variant":n,"data-side":e,"data-slot":`sidebar`,children:[D(`div`,{"data-slot":`sidebar-gap`,className:v(`bg-transparent`,`transition-[width] duration-200 ease-linear`,`h-(--header-height) sm:h-[calc(var(--header-height)+0.5rem)]`,`w-(--sidebar-width)`,`group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]`)}),D(`div`,{"data-slot":`sidebar-container`,className:v(`hidden md:flex shadow-nav`,`fixed left-0 inset-y-0 p-2`,`top-[calc(var(--header-height)+0.5rem)] z-10`,`w-(--sidebar-width)`,`transition-all duration-200 ease-linear`,`group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]`,i),...o,children:D(`div`,{"data-sidebar":`sidebar`,"data-slot":`sidebar-inner`,className:`relative flex size-full flex-col`,children:a})})]})});L.displayName=`CMSLayoutSidebar`;const R=x(({className:e,children:t,...n})=>O(`main`,{"data-slot":`sidebar-inset`,className:v(`relative flex w-full flex-1 flex-col`,e),...n,children:[D(`section`,{className:`h-(--header-height) sm:h-[calc(var(--header-height)+0.5rem)]`}),D(`section`,{className:`flex-1 relative size-full overflow-auto`,children:t})]}));R.displayName=`CMSLayoutMain`;const z=x(({className:e,...t})=>D(_,{"data-slot":`sidebar-input`,"data-sidebar":`input`,className:v(`h-8 w-full bg-background shadow-none`,e),...t}));z.displayName=`SidebarInput`;const B=x(({className:e,...t})=>D(`div`,{"data-slot":`sidebar-header`,"data-sidebar":`header`,className:v(`flex flex-col gap-2 p-2`,e),...t}));B.displayName=`SidebarHeader`;const V=x(({className:e,...t})=>D(`div`,{"data-slot":`sidebar-footer`,"data-sidebar":`footer`,className:v(`flex flex-col gap-2`,e),...t}));V.displayName=`SidebarFooter`;const H=x(({className:e,...t})=>D(o,{"data-slot":`sidebar-separator`,"data-sidebar":`separator`,className:v(`mx-2 w-auto bg-sidebar-border`,e),...t}));H.displayName=`SidebarSeparator`;const U=x(({className:e,...t})=>D(`div`,{"data-slot":`sidebar-content`,"data-sidebar":`content`,className:v(`flex flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden`,e),...t}));U.displayName=`SidebarContent`;const W=x(({className:e,...t})=>D(`div`,{"data-slot":`sidebar-group`,"data-sidebar":`group`,className:v(`relative flex w-full flex-col`,e),...t}));W.displayName=`SidebarGroup`;const G=x(({className:t,asChild:n=!1,...r})=>D(n?e:`div`,{"data-slot":`sidebar-group-label`,"data-sidebar":`group-label`,className:v(`flex h-8 shrink-0 items-center rounded-md px-2 font-medium text-sidebar-foreground/70 text-xs outline-hidden ring-sidebar-ring transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0`,`group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0`,t),...r}));G.displayName=`SidebarGroupLabel`;const K=x(({className:e,...t})=>D(`div`,{"data-slot":`sidebar-group-content`,"data-sidebar":`group-content`,className:v(`w-full text-sm`,e),...t}));K.displayName=`SidebarGroupContent`;const q=x(({className:e,...t})=>D(`ul`,{"data-slot":`sidebar-menu`,"data-sidebar":`menu`,className:v(`flex w-full min-w-0 flex-col gap-1`,e),...t}));q.displayName=`SidebarMenu`;const J=x(({className:e,...t})=>D(`li`,{"data-slot":`sidebar-menu-item`,"data-sidebar":`menu-item`,className:v(`group/menu-item relative`,e),...t}));J.displayName=`SidebarMenuItem`;const Y=y([`peer/menu-button`,`cursor-pointer`,`flex w-full items-center gap-2`,`overflow-hidden rounded-md p-2 outline-hidden`,`truncate text-left font-normal`,`transition-[color,width,height,padding]`,`hover:bg-sidebar-accent`,`hover:text-sidebar-accent-foreground`,`active:bg-sidebar-accent`,`active:text-sidebar-accent-foreground`,`disabled:pointer-events-none`,`disabled:opacity-50`,`group-has-data-[sidebar=menu-action]/menu-item:pr-8`,`aria-disabled:pointer-events-none`,`aria-disabled:opacity-50`,`data-[active=true]:bg-sidebar-primary-muted`,`data-[active=true]:text-sidebar-primary`,`data-[state=open]:hover:bg-sidebar-accent`,`data-[state=open]:hover:text-sidebar-accent-foreground`,`group-data-[collapsible=icon]:size-12!`,`group-data-[collapsible=icon]:p-3!`,`group-data-[collapsible=icon]:gap-3!`,`[&>svg]:size-6`,`[&>svg]:shrink-0`,`[&>span:last-child]:truncate`],{variants:{variant:{default:`hover:bg-sidebar-accent/60 hover:text-sidebar-accent-foreground/80`,outline:`bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]`},size:{default:`h-10 text-sm`,sm:`h-7 text-xs`,lg:`h-12 text-sm group-data-[collapsible=icon]:p-0!`}},defaultVariants:{variant:`default`,size:`default`}}),X=x(({asChild:t=!1,isActive:i=!1,variant:o=`default`,size:s=`default`,tooltip:c,className:l,...u})=>{let d=t?e:`button`,{isMobile:f,state:p}=F(),m=S(e=>{u.onClick?.(),e.preventDefault(),e.stopPropagation()},[u]),h=D(d,{"data-slot":`sidebar-menu-button`,"data-sidebar":`menu-button`,"data-size":s,"data-active":i,className:v(Y({variant:o,size:s}),l),onClick:m,...u});return c?(typeof c==`string`&&(c={children:c}),O(a,{children:[D(n,{asChild:!0,children:h}),D(r,{side:`right`,align:`center`,hidden:p!==`collapsed`||f,...c})]})):h});X.displayName=`SidebarMenuButton`;const Z=({i18nText:e,onChangeToEnLocale:n,onChangeToViLocale:r})=>{let{toggleSidebar:i}=F();return O(`header`,{"data-slot":`cms-layout-header`,className:v(`bg-card`,`h-(--header-height)`,`sm:h-[calc(var(--header-height)+0.5rem)] sm:px-4 sm:pr-6`,`absolute inset-x-0 top-0 z-20 gap-2 px-2 pr-4.5`,`flex items-center shadow-nav`,`transition-[width,height] ease-linear`),children:[O(t,{"data-sidebar":`trigger`,"data-slot":`sidebar-trigger`,variant:`ghost`,color:`muted`,size:`icon`,className:`size-10 rounded-full transition-all hover:text-text-positive`,onClick:e=>{e.preventDefault(),e.stopPropagation(),i()},children:[D(j,{className:`size-6!`}),D(`span`,{className:`sr-only`,children:`Toggle Sidebar`})]}),O(`div`,{className:`flex flex-1 gap-x-2 sm:ml-2.5`,children:[D(`div`,{className:`flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground`,children:D(M,{size:20})}),O(`div`,{className:`grid flex-1 text-left text-sm leading-tight`,children:[D(`span`,{className:`truncate font-medium`,children:`Lunas Enterprise`}),D(`span`,{className:`truncate text-xs`,children:`Established 2025`})]})]}),O(g,{children:[D(p,{asChild:!0,children:O(t,{"data-sidebar":`trigger`,"data-slot":`sidebar-trigger`,variant:`ghost`,color:`muted`,className:`gap-x-1 rounded-full transition-all hover:text-text-positive`,children:[D(k,{className:`size-6!`}),e]})}),D(h,{align:`end`,children:O(m,{children:[D(f,{onClick:e=>{n?.(),e.preventDefault(),e.stopPropagation()},children:`EN - English`}),D(f,{onClick:e=>{r?.(),e.preventDefault(),e.stopPropagation()},children:`VI - Vietnamese`})]})})]})]})},Q=x(({id:e,label:t,icon:n,activeNavItemId:r,onClick:i})=>D(J,{children:O(X,{isActive:e===r,onClick:i,children:[n,t]})},e));Q.displayName=`SidebarContentGroupItem`;const $=x(({id:e,label:t,children:n})=>O(W,{children:[D(G,{children:t}),D(K,{children:D(q,{children:n})})]},e));$.displayName=`SidebarContentGroup`;const ee=({i18nText:e,activeNavItemId:t,sidebar:n,children:r,onChangeToEnLocale:i,onChangeToViLocale:a,onLogout:o})=>{let s=T(()=>n?.groupcontent||[],[n]);return O(I,{children:[D(Z,{i18nText:e,onChangeToEnLocale:i,onChangeToViLocale:a}),O(L,{variant:`inset`,collapsible:`icon`,children:[D(U,{children:s.map(e=>D($,{id:e.id,label:e.label,children:e.items.map(e=>D(Q,{activeNavItemId:t,id:e.id,label:e.label,icon:e.icon,onClick:e.onClick},e.id))},e.id))}),D(V,{children:O(q,{children:[D(J,{children:O(X,{className:`border border-border`,onClick:o,children:[D(A,{className:`text-text-positive-weak`}),`Đăng xuất`]})}),D(J,{className:`mt-2 border-t border-t-border`,children:D(`p`,{className:`pt-2 text-center text-muted-foreground text-xs`,children:`Copyright © 2025, Lunas.`})})]})})]}),D(R,{children:r})]})};export{ee as CMSLayout};
-//# sourceMappingURL=index.mjs.map
+"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"../../dropdown-menu-DWSfXhHo.mjs";import"../../input-Cd0G5y-9.mjs";import{t as e}from"../../cms-layout-HfnOQS16.mjs";export{e as CMSLayout};

package/dist/layouts/flex.cjs

@@ -1 +1 @@
-"use client";const e=require(`../flex-twCgWyx1.cjs`);exports.Flex=e.t;
+"use client";const e=require(`../flex-BbbogTsZ.cjs`);exports.Flex=e.t;

package/dist/layouts/flex.d.cts

@@ -1,22 +1,106 @@
-import * as react_jsx_runtime54 from "react/jsx-runtime";
-import * as react0 from "react";
+import * as react_jsx_runtime25 from "react/jsx-runtime";
 import * as class_variance_authority_types1 from "class-variance-authority/types";
+import * as react0 from "react";
 import { VariantProps } from "class-variance-authority";
 
 //#region packages/components/layouts/flex.d.ts
 declare const flexVariants: (props?: ({
   vertical?: boolean | null | undefined;
-  width?: "max" | "min" | "full" | "auto" | "fit" | "screen" | "null" | null | undefined;
+  width?: "full" | "auto" | "fit" | "screen" | "min" | "max" | "null" | null | undefined;
   wrap?: boolean | null | undefined;
   margin?: "sm" | "md" | "lg" | "xl" | "none" | null | undefined;
   padding?: "sm" | "md" | "lg" | "xl" | "none" | null | undefined;
   gap?: "xs" | "sm" | "md" | "lg" | "xl" | "none" | null | undefined;
-  justify?: "center" | "start" | "end" | "between" | "around" | "evenly" | "stretch" | null | undefined;
-  align?: "center" | "start" | "end" | "stretch" | "baseline" | null | undefined;
+  justify?: "start" | "center" | "end" | "between" | "around" | "evenly" | "stretch" | null | undefined;
+  align?: "start" | "center" | "end" | "stretch" | "baseline" | null | undefined;
 } & class_variance_authority_types1.ClassProp) | undefined) => string;
 type Props = {
+  /** Additional Tailwind classes merged on top of the variant-generated classes. */
   className?: string;
+  /**
+   * Stacks children vertically (`flex-col`) when `true`, horizontally (`flex-row`) when `false`.
+   * @default false
+   */
+  vertical?: boolean;
+  /**
+   * Controls the width of the flex container.
+   * - `'full'` — `w-full`
+   * - `'auto'` — `w-auto`
+   * - `'fit'`  — `w-fit` (default)
+   * - `'screen'` — `w-screen`
+   * - `'min'` — `w-min`
+   * - `'max'` — `w-max`
+   * - `'null'` — no width utility applied
+   * @default 'fit'
+   */
+  width?: 'full' | 'auto' | 'fit' | 'screen' | 'min' | 'max' | 'null';
+  /**
+   * Allows children to wrap onto multiple lines when `true`.
+   * @default true
+   */
+  wrap?: boolean;
+  /**
+   * Uniform margin applied to the container.
+   * - `'none'` — `m-0` (default)
+   * - `'sm'` — `m-2`
+   * - `'md'` — `m-4`
+   * - `'lg'` — `m-6`
+   * - `'xl'` — `m-8`
+   * @default 'none'
+   */
+  margin?: 'sm' | 'md' | 'lg' | 'xl' | 'none';
+  /**
+   * Uniform padding applied to the container.
+   * - `'none'` — `p-0`
+   * - `'sm'`  — `p-2` (default)
+   * - `'md'`  — `p-4`
+   * - `'lg'`  — `p-6`
+   * - `'xl'`  — `p-8`
+   * @default 'sm'
+   */
+  padding?: 'sm' | 'md' | 'lg' | 'xl' | 'none';
+  /**
+   * Gap between child elements.
+   * - `'none'` — `gap-0`
+   * - `'xs'`  — `gap-1` (default)
+   * - `'sm'`  — `gap-2`
+   * - `'md'`  — `gap-4`
+   * - `'lg'`  — `gap-6`
+   * - `'xl'`  — `gap-8`
+   * @default 'xs'
+   */
+  gap?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'none';
+  /**
+   * Justification of children along the main axis (`justify-content`).
+   * @default 'start'
+   */
+  justify?: 'start' | 'center' | 'end' | 'between' | 'around' | 'evenly' | 'stretch';
+  /**
+   * Alignment of children along the cross axis (`align-items`).
+   * @default 'center'
+   */
+  align?: 'start' | 'center' | 'end' | 'baseline' | 'stretch';
 } & VariantProps<typeof flexVariants>;
+/**
+ * A flexible, variant-driven flex container built on CVA and TailwindCSS.
+ *
+ * @example
+ * ```tsx
+ * import { Flex } from '@customafk/lunas-ui/layouts/flex';
+ *
+ * // Horizontal row with centered children and a medium gap
+ * <Flex gap="md" justify="between" align="center">
+ *   <span>Left</span>
+ *   <span>Right</span>
+ * </Flex>
+ *
+ * // Vertical stack that fills parent width
+ * <Flex vertical width="full" gap="sm" padding="md">
+ *   <p>First item</p>
+ *   <p>Second item</p>
+ * </Flex>
+ * ```
+ */
 declare const Flex: react0.MemoExoticComponent<({
   vertical,
   wrap,
@@ -28,7 +112,7 @@ declare const Flex: react0.MemoExoticComponent<({
   align,
   className,
   children
-}: React.PropsWithChildren<Props>) => react_jsx_runtime54.JSX.Element>;
+}: React.PropsWithChildren<Props>) => react_jsx_runtime25.JSX.Element>;
 //#endregion
 export { Flex };
 //# sourceMappingURL=flex.d.cts.map

package/dist/layouts/flex.d.mts

@@ -1,23 +1,107 @@
+import * as react0 from "react";
+import * as react_jsx_runtime37 from "react/jsx-runtime";
 import { VariantProps } from "class-variance-authority";
-import * as react7 from "react";
-import * as react_jsx_runtime192 from "react/jsx-runtime";
-import * as class_variance_authority_types7 from "class-variance-authority/types";
+import * as class_variance_authority_types0 from "class-variance-authority/types";
 
 //#region packages/components/layouts/flex.d.ts
 declare const flexVariants: (props?: ({
   vertical?: boolean | null | undefined;
-  width?: "max" | "min" | "full" | "auto" | "fit" | "screen" | "null" | null | undefined;
+  width?: "full" | "auto" | "fit" | "screen" | "min" | "max" | "null" | null | undefined;
   wrap?: boolean | null | undefined;
   margin?: "sm" | "md" | "lg" | "xl" | "none" | null | undefined;
   padding?: "sm" | "md" | "lg" | "xl" | "none" | null | undefined;
   gap?: "xs" | "sm" | "md" | "lg" | "xl" | "none" | null | undefined;
-  justify?: "center" | "start" | "end" | "between" | "around" | "evenly" | "stretch" | null | undefined;
-  align?: "center" | "start" | "end" | "stretch" | "baseline" | null | undefined;
-} & class_variance_authority_types7.ClassProp) | undefined) => string;
+  justify?: "start" | "center" | "end" | "between" | "around" | "evenly" | "stretch" | null | undefined;
+  align?: "start" | "center" | "end" | "stretch" | "baseline" | null | undefined;
+} & class_variance_authority_types0.ClassProp) | undefined) => string;
 type Props = {
+  /** Additional Tailwind classes merged on top of the variant-generated classes. */
   className?: string;
+  /**
+   * Stacks children vertically (`flex-col`) when `true`, horizontally (`flex-row`) when `false`.
+   * @default false
+   */
+  vertical?: boolean;
+  /**
+   * Controls the width of the flex container.
+   * - `'full'` — `w-full`
+   * - `'auto'` — `w-auto`
+   * - `'fit'`  — `w-fit` (default)
+   * - `'screen'` — `w-screen`
+   * - `'min'` — `w-min`
+   * - `'max'` — `w-max`
+   * - `'null'` — no width utility applied
+   * @default 'fit'
+   */
+  width?: 'full' | 'auto' | 'fit' | 'screen' | 'min' | 'max' | 'null';
+  /**
+   * Allows children to wrap onto multiple lines when `true`.
+   * @default true
+   */
+  wrap?: boolean;
+  /**
+   * Uniform margin applied to the container.
+   * - `'none'` — `m-0` (default)
+   * - `'sm'` — `m-2`
+   * - `'md'` — `m-4`
+   * - `'lg'` — `m-6`
+   * - `'xl'` — `m-8`
+   * @default 'none'
+   */
+  margin?: 'sm' | 'md' | 'lg' | 'xl' | 'none';
+  /**
+   * Uniform padding applied to the container.
+   * - `'none'` — `p-0`
+   * - `'sm'`  — `p-2` (default)
+   * - `'md'`  — `p-4`
+   * - `'lg'`  — `p-6`
+   * - `'xl'`  — `p-8`
+   * @default 'sm'
+   */
+  padding?: 'sm' | 'md' | 'lg' | 'xl' | 'none';
+  /**
+   * Gap between child elements.
+   * - `'none'` — `gap-0`
+   * - `'xs'`  — `gap-1` (default)
+   * - `'sm'`  — `gap-2`
+   * - `'md'`  — `gap-4`
+   * - `'lg'`  — `gap-6`
+   * - `'xl'`  — `gap-8`
+   * @default 'xs'
+   */
+  gap?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'none';
+  /**
+   * Justification of children along the main axis (`justify-content`).
+   * @default 'start'
+   */
+  justify?: 'start' | 'center' | 'end' | 'between' | 'around' | 'evenly' | 'stretch';
+  /**
+   * Alignment of children along the cross axis (`align-items`).
+   * @default 'center'
+   */
+  align?: 'start' | 'center' | 'end' | 'baseline' | 'stretch';
 } & VariantProps<typeof flexVariants>;
-declare const Flex: react7.MemoExoticComponent<({
+/**
+ * A flexible, variant-driven flex container built on CVA and TailwindCSS.
+ *
+ * @example
+ * ```tsx
+ * import { Flex } from '@customafk/lunas-ui/layouts/flex';
+ *
+ * // Horizontal row with centered children and a medium gap
+ * <Flex gap="md" justify="between" align="center">
+ *   <span>Left</span>
+ *   <span>Right</span>
+ * </Flex>
+ *
+ * // Vertical stack that fills parent width
+ * <Flex vertical width="full" gap="sm" padding="md">
+ *   <p>First item</p>
+ *   <p>Second item</p>
+ * </Flex>
+ * ```
+ */
+declare const Flex: react0.MemoExoticComponent<({
   vertical,
   wrap,
   width,
@@ -28,7 +112,7 @@ declare const Flex: react7.MemoExoticComponent<({
   align,
   className,
   children
-}: React.PropsWithChildren<Props>) => react_jsx_runtime192.JSX.Element>;
+}: React.PropsWithChildren<Props>) => react_jsx_runtime37.JSX.Element>;
 //#endregion
 export { Flex };
 //# sourceMappingURL=flex.d.mts.map

package/dist/layouts/flex.mjs

@@ -1 +1 @@
-"use client";import{t as e}from"../flex-BP8sTi70.mjs";export{e as Flex};
+"use client";import{t as e}from"../flex-BLMTj7Ev.mjs";export{e as Flex};

package/dist/layouts/grid.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);let t=require(`@customafk/react-toolkit/utils`),n=require(`react/jsx-runtime`);const r=({children:e})=>(0,n.jsx)(`div`,{className:`@container size-full`,children:(0,n.jsx)(`div`,{className:(0,t.cn)(`grid grid-cols-1 gap-4`,`@3xs:grid-cols-1`,`@2xs:grid-cols-1`,`@xs:grid-cols-1`,`@sm:grid-cols-1`,`@md:grid-cols-2`,`@lg:grid-cols-2`,`@xl:grid-cols-2`,`@2xl:grid-cols-2`,`@3xl:grid-cols-3`,`@4xl:grid-cols-3`,`@5xl:grid-cols-4`,`@6xl:grid-cols-4`,`@7xl:grid-cols-5`,`@8xl:grid-cols-6`,`@9xl:grid-cols-7`,`@10xl:grid-cols-8`),children:e})});exports.Grid=r;
+"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);let t=require(`react/jsx-runtime`),n=require(`@customafk/react-toolkit/utils`);const r=({children:e})=>(0,t.jsx)(`div`,{className:`@container size-full`,children:(0,t.jsx)(`div`,{className:(0,n.cn)(`grid grid-cols-1 gap-4`,`@3xs:grid-cols-1`,`@2xs:grid-cols-1`,`@xs:grid-cols-1`,`@sm:grid-cols-1`,`@md:grid-cols-2`,`@lg:grid-cols-2`,`@xl:grid-cols-2`,`@2xl:grid-cols-2`,`@3xl:grid-cols-3`,`@4xl:grid-cols-3`,`@5xl:grid-cols-4`,`@6xl:grid-cols-4`,`@7xl:grid-cols-5`,`@8xl:grid-cols-6`,`@9xl:grid-cols-7`,`@10xl:grid-cols-8`),children:e})});exports.Grid=r;
 //# sourceMappingURL=grid.cjs.map

package/dist/layouts/grid.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"grid.cjs","names":["Grid: React.FC<React.PropsWithChildren>"],"sources":["../../packages/components/layouts/grid.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nexport const Grid: React.FC<React.PropsWithChildren> = ({ children }) => {\n  return (\n    <div className=\"@container size-full\">\n      <div\n        className={cn(\n          'grid grid-cols-1 gap-4',\n          '@3xs:grid-cols-1',\n          '@2xs:grid-cols-1',\n          '@xs:grid-cols-1',\n          '@sm:grid-cols-1',\n          '@md:grid-cols-2',\n          '@lg:grid-cols-2',\n          '@xl:grid-cols-2',\n          '@2xl:grid-cols-2',\n          '@3xl:grid-cols-3',\n          '@4xl:grid-cols-3',\n          '@5xl:grid-cols-4',\n          '@6xl:grid-cols-4',\n          '@7xl:grid-cols-5',\n          '@8xl:grid-cols-6',\n          '@9xl:grid-cols-7',\n          '@10xl:grid-cols-8'\n        )}\n      >\n        {children}\n      </div>\n    </div>\n  );\n};\n"],"mappings":"qIAIA,MAAaA,GAA2C,CAAE,eAEtD,EAAA,EAAA,KAAC,MAAA,CAAI,UAAU,iCACb,EAAA,EAAA,KAAC,MAAA,CACC,WAAA,EAAA,EAAA,IACE,yBACA,mBACA,mBACA,kBACA,kBACA,kBACA,kBACA,kBACA,mBACA,mBACA,mBACA,mBACA,mBACA,mBACA,mBACA,mBACA,oBACD,CAEA,YACG,EACF"}
+{"version":3,"file":"grid.cjs","names":["Grid: React.FC<React.PropsWithChildren>"],"sources":["../../packages/components/layouts/grid.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\n/**\n * A responsive, container-query-driven grid that automatically adjusts column count based on available width.\n *\n * @example\n * ```tsx\n * import { Grid } from '@customafk/lunas-ui/layouts/grid';\n *\n * <Grid>\n *   <Card />\n *   <Card />\n *   <Card />\n * </Grid>\n * ```\n */\nexport const Grid: React.FC<React.PropsWithChildren> = ({ children }) => {\n  return (\n    <div className=\"@container size-full\">\n      <div\n        className={cn(\n          'grid grid-cols-1 gap-4',\n          '@3xs:grid-cols-1',\n          '@2xs:grid-cols-1',\n          '@xs:grid-cols-1',\n          '@sm:grid-cols-1',\n          '@md:grid-cols-2',\n          '@lg:grid-cols-2',\n          '@xl:grid-cols-2',\n          '@2xl:grid-cols-2',\n          '@3xl:grid-cols-3',\n          '@4xl:grid-cols-3',\n          '@5xl:grid-cols-4',\n          '@6xl:grid-cols-4',\n          '@7xl:grid-cols-5',\n          '@8xl:grid-cols-6',\n          '@9xl:grid-cols-7',\n          '@10xl:grid-cols-8'\n        )}\n      >\n        {children}\n      </div>\n    </div>\n  );\n};\n"],"mappings":"qIAkBA,MAAaA,GAA2C,CAAE,eAEtD,EAAA,EAAA,KAAC,MAAA,CAAI,UAAU,iCACb,EAAA,EAAA,KAAC,MAAA,CACC,WAAA,EAAA,EAAA,IACE,yBACA,mBACA,mBACA,kBACA,kBACA,kBACA,kBACA,kBACA,mBACA,mBACA,mBACA,mBACA,mBACA,mBACA,mBACA,mBACA,oBACD,CAEA,YACG,EACF"}

package/dist/layouts/grid.d.cts

@@ -1,4 +1,18 @@
 //#region packages/components/layouts/grid.d.ts
+/**
+ * A responsive, container-query-driven grid that automatically adjusts column count based on available width.
+ *
+ * @example
+ * ```tsx
+ * import { Grid } from '@customafk/lunas-ui/layouts/grid';
+ *
+ * <Grid>
+ *   <Card />
+ *   <Card />
+ *   <Card />
+ * </Grid>
+ * ```
+ */
 declare const Grid: React.FC<React.PropsWithChildren>;
 //#endregion
 export { Grid };

package/dist/layouts/grid.d.mts

@@ -1,4 +1,18 @@
 //#region packages/components/layouts/grid.d.ts
+/**
+ * A responsive, container-query-driven grid that automatically adjusts column count based on available width.
+ *
+ * @example
+ * ```tsx
+ * import { Grid } from '@customafk/lunas-ui/layouts/grid';
+ *
+ * <Grid>
+ *   <Card />
+ *   <Card />
+ *   <Card />
+ * </Grid>
+ * ```
+ */
 declare const Grid: React.FC<React.PropsWithChildren>;
 //#endregion
 export { Grid };

package/dist/layouts/grid.mjs

@@ -1,2 +1,2 @@
-"use client";import{cn as e}from"@customafk/react-toolkit/utils";import{jsx as t}from"react/jsx-runtime";const n=({children:n})=>t(`div`,{className:`@container size-full`,children:t(`div`,{className:e(`grid grid-cols-1 gap-4`,`@3xs:grid-cols-1`,`@2xs:grid-cols-1`,`@xs:grid-cols-1`,`@sm:grid-cols-1`,`@md:grid-cols-2`,`@lg:grid-cols-2`,`@xl:grid-cols-2`,`@2xl:grid-cols-2`,`@3xl:grid-cols-3`,`@4xl:grid-cols-3`,`@5xl:grid-cols-4`,`@6xl:grid-cols-4`,`@7xl:grid-cols-5`,`@8xl:grid-cols-6`,`@9xl:grid-cols-7`,`@10xl:grid-cols-8`),children:n})});export{n as Grid};
+"use client";import{jsx as e}from"react/jsx-runtime";import{cn as t}from"@customafk/react-toolkit/utils";const n=({children:n})=>e(`div`,{className:`@container size-full`,children:e(`div`,{className:t(`grid grid-cols-1 gap-4`,`@3xs:grid-cols-1`,`@2xs:grid-cols-1`,`@xs:grid-cols-1`,`@sm:grid-cols-1`,`@md:grid-cols-2`,`@lg:grid-cols-2`,`@xl:grid-cols-2`,`@2xl:grid-cols-2`,`@3xl:grid-cols-3`,`@4xl:grid-cols-3`,`@5xl:grid-cols-4`,`@6xl:grid-cols-4`,`@7xl:grid-cols-5`,`@8xl:grid-cols-6`,`@9xl:grid-cols-7`,`@10xl:grid-cols-8`),children:n})});export{n as Grid};
 //# sourceMappingURL=grid.mjs.map

package/dist/layouts/grid.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"grid.mjs","names":["Grid: React.FC<React.PropsWithChildren>"],"sources":["../../packages/components/layouts/grid.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nexport const Grid: React.FC<React.PropsWithChildren> = ({ children }) => {\n  return (\n    <div className=\"@container size-full\">\n      <div\n        className={cn(\n          'grid grid-cols-1 gap-4',\n          '@3xs:grid-cols-1',\n          '@2xs:grid-cols-1',\n          '@xs:grid-cols-1',\n          '@sm:grid-cols-1',\n          '@md:grid-cols-2',\n          '@lg:grid-cols-2',\n          '@xl:grid-cols-2',\n          '@2xl:grid-cols-2',\n          '@3xl:grid-cols-3',\n          '@4xl:grid-cols-3',\n          '@5xl:grid-cols-4',\n          '@6xl:grid-cols-4',\n          '@7xl:grid-cols-5',\n          '@8xl:grid-cols-6',\n          '@9xl:grid-cols-7',\n          '@10xl:grid-cols-8'\n        )}\n      >\n        {children}\n      </div>\n    </div>\n  );\n};\n"],"mappings":"yGAIA,MAAaA,GAA2C,CAAE,cAEtD,EAAC,MAAA,CAAI,UAAU,gCACb,EAAC,MAAA,CACC,UAAW,EACT,yBACA,mBACA,mBACA,kBACA,kBACA,kBACA,kBACA,kBACA,mBACA,mBACA,mBACA,mBACA,mBACA,mBACA,mBACA,mBACA,oBACD,CAEA,YACG,EACF"}
+{"version":3,"file":"grid.mjs","names":["Grid: React.FC<React.PropsWithChildren>"],"sources":["../../packages/components/layouts/grid.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\n/**\n * A responsive, container-query-driven grid that automatically adjusts column count based on available width.\n *\n * @example\n * ```tsx\n * import { Grid } from '@customafk/lunas-ui/layouts/grid';\n *\n * <Grid>\n *   <Card />\n *   <Card />\n *   <Card />\n * </Grid>\n * ```\n */\nexport const Grid: React.FC<React.PropsWithChildren> = ({ children }) => {\n  return (\n    <div className=\"@container size-full\">\n      <div\n        className={cn(\n          'grid grid-cols-1 gap-4',\n          '@3xs:grid-cols-1',\n          '@2xs:grid-cols-1',\n          '@xs:grid-cols-1',\n          '@sm:grid-cols-1',\n          '@md:grid-cols-2',\n          '@lg:grid-cols-2',\n          '@xl:grid-cols-2',\n          '@2xl:grid-cols-2',\n          '@3xl:grid-cols-3',\n          '@4xl:grid-cols-3',\n          '@5xl:grid-cols-4',\n          '@6xl:grid-cols-4',\n          '@7xl:grid-cols-5',\n          '@8xl:grid-cols-6',\n          '@9xl:grid-cols-7',\n          '@10xl:grid-cols-8'\n        )}\n      >\n        {children}\n      </div>\n    </div>\n  );\n};\n"],"mappings":"yGAkBA,MAAaA,GAA2C,CAAE,cAEtD,EAAC,MAAA,CAAI,UAAU,gCACb,EAAC,MAAA,CACC,UAAW,EACT,yBACA,mBACA,mBACA,kBACA,kBACA,kBACA,kBACA,kBACA,mBACA,mBACA,mBACA,mBACA,mBACA,mBACA,mBACA,mBACA,oBACD,CAEA,YACG,EACF"}

package/dist/layouts/payment-layout/index.cjs

@@ -1,2 +1 @@
-const e=require(`../../chunk-Bmb41Sf3.cjs`),t=require(`../../dist-BudM04oj.cjs`);require(`../../button.variants-CS-Cmarr.cjs`);const n=require(`../../button-BFcXpjqF.cjs`);require(`../../skeleton-CHympz8k.cjs`);const r=require(`../../tooltip-DC6i1A25.cjs`);require(`../../separator-C3ip6sbh.cjs`);const i=require(`../../sheet-5MJRtrfG.cjs`);require(`../../input-BFWWaN-v.cjs`);let a=require(`@customafk/react-toolkit/utils`),o=require(`class-variance-authority`),s=require(`react`),c=require(`react/jsx-runtime`),l=require(`lucide-react`),u=require(`@customafk/react-toolkit/hooks/useMobile`);const d=`sidebar_state`,f=3600*24*7,p=`16rem`,m=`18rem`,h=`3rem`,g=`b`,_=(0,s.createContext)(null);function v(){let e=(0,s.useContext)(_);if(!e)throw Error(`useSidebar must be used within a SidebarProvider.`);return e}function y({defaultOpen:e=!0,open:t,onOpenChange:n,className:i,style:o,children:l,...d}){let f=(0,u.useIsMobile)(),[p,m]=(0,s.useState)(!1),[h,g]=(0,s.useState)(e),v=t??h,y=(0,s.useCallback)(e=>{let t=typeof e==`function`?e(v):e;n?n(t):g(t),document.cookie=`sidebar_state=${t}; path=/; max-age=604800`},[n,v]),b=(0,s.useCallback)(()=>f?m(e=>!e):y(e=>!e),[f,y]);(0,s.useEffect)(()=>{let e=e=>{e.key===`b`&&(e.metaKey||e.ctrlKey)&&(e.preventDefault(),b())};return window.addEventListener(`keydown`,e),()=>window.removeEventListener(`keydown`,e)},[b]);let x=v?`expanded`:`collapsed`,S=(0,s.useMemo)(()=>({state:x,open:v,setOpen:y,isMobile:f,openMobile:p,setOpenMobile:m,toggleSidebar:b}),[x,v,y,f,p,b]);return(0,c.jsx)(_.Provider,{value:S,children:(0,c.jsx)(r.r,{delayDuration:0,children:(0,c.jsx)(`div`,{"data-slot":`sidebar-wrapper`,style:{"--sidebar-width":`16rem`,"--sidebar-width-icon":`3rem`,...o},className:(0,a.cn)(`group/sidebar-wrapper flex h-dvh w-full`,i),...d,children:l})})})}function b({side:e=`left`,variant:t=`sidebar`,collapsible:r=`offcanvas`,className:o,children:s,...u}){let{isMobile:d,state:f,openMobile:p,setOpenMobile:m,toggleSidebar:h}=v();return r===`none`?(0,c.jsx)(`aside`,{"data-slot":`sidebar`,className:(0,a.cn)(`flex h-full w-(--sidebar-width) flex-col bg-sidebar text-sidebar-foreground`,o),...u,children:s}):d?(0,c.jsx)(i.t,{open:p,onOpenChange:m,...u,children:(0,c.jsxs)(i.r,{"data-sidebar":`sidebar`,"data-slot":`sidebar`,"data-mobile":`true`,className:`w-(--sidebar-width) bg-sidebar p-0 text-sidebar-foreground sm:max-w-3xs [&>button]:hidden`,style:{"--sidebar-width":`18rem`},side:e,children:[(0,c.jsxs)(i.o,{className:`sr-only`,children:[(0,c.jsx)(i.s,{children:`Sidebar`}),(0,c.jsx)(i.i,{children:`Displays the mobile sidebar.`})]}),(0,c.jsxs)(`div`,{className:`flex size-full flex-col`,children:[(0,c.jsxs)(`div`,{className:`flex flex-0 items-center gap-x-2 border-border-weak border-b p-2 pr-4`,children:[(0,c.jsxs)(n.t,{"data-sidebar":`trigger`,"data-slot":`sidebar-trigger`,variant:`ghost`,color:`muted`,size:`icon`,className:(0,a.cn)(`size-10 rounded-full`,o),onClick:e=>{h(),e.preventDefault(),e.stopPropagation()},children:[(0,c.jsx)(l.MenuIcon,{className:`size-6!`}),(0,c.jsx)(`span`,{className:`sr-only`,children:`Toggle Sidebar`})]}),(0,c.jsx)(`div`,{className:`ml-2 flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground`,children:(0,c.jsx)(l.ShoppingCartIcon,{size:20})}),(0,c.jsxs)(`div`,{className:`grid flex-1 text-left text-sm leading-tight`,children:[(0,c.jsx)(`span`,{className:`truncate font-medium`,children:`Lunas Store`}),(0,c.jsx)(`span`,{className:`truncate text-xs`,children:`Established 2023`})]})]}),(0,c.jsx)(`div`,{className:`flex flex-1 flex-col p-2`,children:s})]})]})}):(0,c.jsxs)(`aside`,{className:`group peer hidden bg-card text-sidebar-foreground md:block`,"data-state":f,"data-collapsible":f===`collapsed`?r:``,"data-variant":t,"data-side":e,"data-slot":`sidebar`,children:[(0,c.jsx)(`div`,{"data-slot":`sidebar-gap`,className:(0,a.cn)(`relative`,`bg-transparent`,`transition-[width] duration-200 ease-linear`,`h-(--header-height) w-(--sidebar-width)`,`sm:h-[calc(var(--header-height)+0.5rem)]`,`group-data-[collapsible=offcanvas]:w-0`,`group-data-[side=right]:rotate-180`,t===`floating`||t===`inset`?`group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]`:`group-data-[collapsible=icon]:w-(--sidebar-width-icon)`)}),(0,c.jsx)(`div`,{"data-slot":`sidebar-container`,className:(0,a.cn)(`hidden md:flex`,`fixed inset-y-0 top-14 z-10 shadow-nav`,`h-[calc(100dvh-3.5rem)] w-(--sidebar-width)`,`transition-[left,right,width] duration-200 ease-linear`,e===`left`&&`left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]`,e===`right`&&`right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]`,t===`floating`||t===`inset`?`p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]`:`group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l`,o),...u,children:(0,c.jsx)(`div`,{"data-sidebar":`sidebar`,"data-slot":`sidebar-inner`,className:(0,a.cn)(`flex size-full flex-col`,`group-data-[variant=floating]:rounded-lg`,`group-data-[variant=floating]:border`,`group-data-[variant=floating]:border-sidebar-border`,`group-data-[variant=floating]:shadow-sm`),children:s})})]})}function x({className:e,children:t,...n}){return(0,c.jsxs)(`main`,{"data-slot":`sidebar-inset`,className:(0,a.cn)(`relative flex w-full flex-1 flex-col`,e),...n,children:[(0,c.jsx)(`div`,{className:`h-(--header-height) w-full sm:h-[calc(var(--header-height)+0.5rem)]`}),(0,c.jsx)(`div`,{className:`inset-shadow-sm flex-1`,children:t})]})}function S({className:e,...t}){return(0,c.jsx)(`div`,{"data-slot":`sidebar-footer`,"data-sidebar":`footer`,className:(0,a.cn)(`flex flex-col gap-2 p-2`,e),...t})}function C({className:e,...t}){return(0,c.jsx)(`div`,{"data-slot":`sidebar-content`,"data-sidebar":`content`,className:(0,a.cn)(`flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden`,e),...t})}function w({className:e,...t}){return(0,c.jsx)(`div`,{"data-slot":`sidebar-group`,"data-sidebar":`group`,className:(0,a.cn)(`relative flex w-full min-w-0 flex-col`,e),...t})}function T({className:e,asChild:n=!1,...r}){return(0,c.jsx)(n?t.t:`div`,{"data-slot":`sidebar-group-label`,"data-sidebar":`group-label`,className:(0,a.cn)(`flex h-8 shrink-0 items-center rounded-md px-2 font-medium text-sidebar-foreground/70 text-xs outline-hidden ring-sidebar-ring transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0`,`group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0`,e),...r})}function E({className:e,...t}){return(0,c.jsx)(`div`,{"data-slot":`sidebar-group-content`,"data-sidebar":`group-content`,className:(0,a.cn)(`w-full text-sm`,e),...t})}function D({className:e,...t}){return(0,c.jsx)(`ul`,{"data-slot":`sidebar-menu`,"data-sidebar":`menu`,className:(0,a.cn)(`flex w-full min-w-0 flex-col gap-1`,e),...t})}function O({className:e,...t}){return(0,c.jsx)(`li`,{"data-slot":`sidebar-menu-item`,"data-sidebar":`menu-item`,className:(0,a.cn)(`group/menu-item relative`,e),...t})}const k=(0,o.cva)([`peer/menu-button`,`cursor-pointer`,`flex w-full items-center gap-2`,`overflow-hidden rounded-md p-2 outline-hidden`,`truncate text-left font-normal`,`transition-[color,width,height,padding]`,`hover:bg-sidebar-accent`,`hover:text-sidebar-accent-foreground`,`active:bg-sidebar-accent`,`active:text-sidebar-accent-foreground`,`disabled:pointer-events-none`,`disabled:opacity-50`,`group-has-data-[sidebar=menu-action]/menu-item:pr-8`,`aria-disabled:pointer-events-none`,`aria-disabled:opacity-50`,`data-[active=true]:bg-sidebar-primary-muted`,`data-[active=true]:text-sidebar-primary`,`data-[state=open]:hover:bg-sidebar-accent`,`data-[state=open]:hover:text-sidebar-accent-foreground`,`group-data-[collapsible=icon]:size-12!`,`group-data-[collapsible=icon]:p-3!`,`group-data-[collapsible=icon]:gap-3!`,`[&>svg]:size-6`,`[&>svg]:shrink-0`,`[&>span:last-child]:truncate`],{variants:{variant:{default:`hover:bg-sidebar-accent/60 hover:text-sidebar-accent-foreground/80`,outline:`bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]`},size:{default:`h-10 text-sm`,sm:`h-7 text-xs`,lg:`h-12 text-sm group-data-[collapsible=icon]:p-0!`}},defaultVariants:{variant:`default`,size:`default`}});function A({asChild:e=!1,isActive:n=!1,variant:i=`default`,size:o=`default`,tooltip:s,className:l,...u}){let d=e?t.t:`button`,{isMobile:f,state:p}=v(),m=(0,c.jsx)(d,{"data-slot":`sidebar-menu-button`,"data-sidebar":`menu-button`,"data-size":o,"data-active":n,className:(0,a.cn)(k({variant:i,size:o}),l),...u});return s?(typeof s==`string`&&(s={children:s}),(0,c.jsxs)(r.t,{children:[(0,c.jsx)(r.i,{asChild:!0,children:m}),(0,c.jsx)(r.n,{side:`right`,align:`center`,hidden:p!==`collapsed`||f,...s})]})):m}const j=()=>{let{toggleSidebar:e}=v();return(0,c.jsxs)(`header`,{"data-slot":`payment-layout-header`,className:(0,a.cn)(`bg-card`,`h-(--header-height)`,`sm:h-[calc(var(--header-height)+0.5rem)] sm:px-4 sm:pr-6`,`absolute inset-x-0 top-0 z-20 gap-2 px-2 pr-4.5`,`flex items-center shadow-nav`,`transition-[width,height] ease-linear`),children:[(0,c.jsxs)(n.t,{"data-sidebar":`trigger`,"data-slot":`sidebar-trigger`,variant:`ghost`,color:`muted`,size:`icon`,className:`size-10 rounded-full transition-all hover:text-text-positive`,onClick:t=>{t.preventDefault(),t.stopPropagation(),e()},children:[(0,c.jsx)(l.MenuIcon,{className:`size-6!`}),(0,c.jsx)(`span`,{className:`sr-only`,children:`Toggle Sidebar`})]}),(0,c.jsxs)(`div`,{className:`flex gap-x-2 sm:ml-2.5`,children:[(0,c.jsx)(`div`,{className:`flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground`,children:(0,c.jsx)(l.ShoppingCartIcon,{size:20})}),(0,c.jsxs)(`div`,{className:`grid flex-1 text-left text-sm leading-tight`,children:[(0,c.jsx)(`span`,{className:`truncate font-medium`,children:`Lunas Enterprise`}),(0,c.jsx)(`span`,{className:`truncate text-xs`,children:`Established 2025`})]})]})]})},M=({activeNavItemId:e,sidebar:t,children:n})=>{let r=(0,s.useMemo)(()=>t?.groupcontent||[],[t]);return(0,c.jsxs)(y,{children:[(0,c.jsx)(j,{}),(0,c.jsxs)(b,{variant:`inset`,collapsible:`icon`,children:[(0,c.jsx)(C,{children:r.map(t=>(0,c.jsxs)(w,{children:[(0,c.jsx)(T,{children:t.label}),(0,c.jsx)(E,{children:(0,c.jsx)(D,{children:t.items.map(t=>(0,c.jsx)(O,{children:(0,c.jsxs)(A,{isActive:t.id===e,onClick:e=>{t.onClick?.(),e.preventDefault(),e.stopPropagation()},children:[t.icon,t.label]})},t.id))})})]},t.id))}),(0,c.jsx)(S,{children:(0,c.jsx)(D,{children:(0,c.jsx)(O,{className:`mt-2 border-t border-t-border`,children:(0,c.jsx)(`p`,{className:`pt-2 text-center text-muted-foreground text-xs`,children:`Copyright © 2025, Lunas.`})})})})]}),(0,c.jsx)(x,{children:(0,c.jsx)(`section`,{className:`relative size-full`,children:(0,c.jsx)(`div`,{className:`absolute inset-0`,children:n})})})]})};exports.PaymentLayout=M;
-//# sourceMappingURL=index.cjs.map
+require(`../../button.variants-tnhb123u.cjs`),require(`../../button-CwDT3m4m.cjs`),require(`../../skeleton-BfMCjXYM.cjs`),require(`../../tooltip-itUmYz9k.cjs`),require(`../../separator-BwZb12bh.cjs`),require(`../../sheet-CaDXTx7n.cjs`),require(`../../input-Cl5VkKQh.cjs`);const e=require(`../../payment-layout-Da29dHJe.cjs`);exports.PaymentLayout=e.t;

package/dist/layouts/payment-layout/index.d.cts

@@ -1,18 +1,53 @@
 //#region packages/components/layouts/payment-layout/index.d.ts
+/**
+ * Full-page payment application shell with a collapsible inset sidebar and a fixed header.
+ *
+ * @example
+ * ```tsx
+ * import { PaymentLayout } from '@customafk/lunas-ui/layouts/payment-layout';
+ * import { CreditCardIcon } from 'lucide-react';
+ *
+ * <PaymentLayout
+ *   activeNavItemId="transactions"
+ *   sidebar={{
+ *     groupcontent: [
+ *       {
+ *         id: 'payment',
+ *         label: 'Payment',
+ *         items: [
+ *           { id: 'transactions', label: 'Transactions', icon: <CreditCardIcon />, onClick: () => router.push('/transactions') },
+ *         ],
+ *       },
+ *     ],
+ *   }}
+ * >
+ *   <TransactionsPage />
+ * </PaymentLayout>
+ * ```
+ */
 declare const PaymentLayout: React.FC<React.PropsWithChildren<{
+  /** ID of the currently active navigation item; matched against each item's `id` to apply the active style. */
   activeNavItemId?: string;
+  /** Sidebar navigation definition; omitting this prop renders an empty sidebar. */
   sidebar?: {
     groupcontent: {
+      /** Unique identifier for the group, used as React key. */
       id: string;
+      /** Optional section heading rendered above the group's items. */
       label?: string;
       items: {
+        /** Unique identifier for the nav item, used as React key and for active-state comparison. */
         id: string;
+        /** Human-readable label rendered inside the sidebar button. */
         label: string;
+        /** Optional icon element rendered to the left of the label. */
         icon?: React.ReactNode;
+        /** Callback fired when the sidebar button is clicked. */
         onClick?: () => void;
       }[];
     }[];
   };
+  /** Reserved for a future logout action (currently unused in the rendered output). */
   onLogout?: () => void;
 }>>;
 //#endregion

package/dist/layouts/payment-layout/index.d.mts

@@ -1,18 +1,53 @@
 //#region packages/components/layouts/payment-layout/index.d.ts
+/**
+ * Full-page payment application shell with a collapsible inset sidebar and a fixed header.
+ *
+ * @example
+ * ```tsx
+ * import { PaymentLayout } from '@customafk/lunas-ui/layouts/payment-layout';
+ * import { CreditCardIcon } from 'lucide-react';
+ *
+ * <PaymentLayout
+ *   activeNavItemId="transactions"
+ *   sidebar={{
+ *     groupcontent: [
+ *       {
+ *         id: 'payment',
+ *         label: 'Payment',
+ *         items: [
+ *           { id: 'transactions', label: 'Transactions', icon: <CreditCardIcon />, onClick: () => router.push('/transactions') },
+ *         ],
+ *       },
+ *     ],
+ *   }}
+ * >
+ *   <TransactionsPage />
+ * </PaymentLayout>
+ * ```
+ */
 declare const PaymentLayout: React.FC<React.PropsWithChildren<{
+  /** ID of the currently active navigation item; matched against each item's `id` to apply the active style. */
   activeNavItemId?: string;
+  /** Sidebar navigation definition; omitting this prop renders an empty sidebar. */
   sidebar?: {
     groupcontent: {
+      /** Unique identifier for the group, used as React key. */
       id: string;
+      /** Optional section heading rendered above the group's items. */
       label?: string;
       items: {
+        /** Unique identifier for the nav item, used as React key and for active-state comparison. */
         id: string;
+        /** Human-readable label rendered inside the sidebar button. */
         label: string;
+        /** Optional icon element rendered to the left of the label. */
         icon?: React.ReactNode;
+        /** Callback fired when the sidebar button is clicked. */
         onClick?: () => void;
       }[];
     }[];
   };
+  /** Reserved for a future logout action (currently unused in the rendered output). */
   onLogout?: () => void;
 }>>;
 //#endregion

package/dist/layouts/payment-layout/index.mjs

@@ -1,2 +1 @@
-import{t as e}from"../../dist-CvmzZ_6C.mjs";import"../../button.variants-DRWf66hR.mjs";import{t}from"../../button-BQTNG97Y.mjs";import"../../skeleton-Ba6koCVf.mjs";import{i as n,n as r,r as i,t as a}from"../../tooltip-B3dTcgcc.mjs";import"../../separator-Bf0gymN4.mjs";import{i as o,o as s,r as c,s as l,t as u}from"../../sheet-oadGRiie.mjs";import"../../input-DBtIgQB6.mjs";import{cn as d}from"@customafk/react-toolkit/utils";import{cva as f}from"class-variance-authority";import{createContext as p,useCallback as m,useContext as h,useEffect as g,useMemo as _,useState as v}from"react";import{jsx as y,jsxs as b}from"react/jsx-runtime";import{MenuIcon as x,ShoppingCartIcon as S}from"lucide-react";import{useIsMobile as C}from"@customafk/react-toolkit/hooks/useMobile";const w=p(null);function T(){let e=h(w);if(!e)throw Error(`useSidebar must be used within a SidebarProvider.`);return e}function E({defaultOpen:e=!0,open:t,onOpenChange:n,className:r,style:a,children:o,...s}){let c=C(),[l,u]=v(!1),[f,p]=v(e),h=t??f,b=m(e=>{let t=typeof e==`function`?e(h):e;n?n(t):p(t),document.cookie=`sidebar_state=${t}; path=/; max-age=604800`},[n,h]),x=m(()=>c?u(e=>!e):b(e=>!e),[c,b]);g(()=>{let e=e=>{e.key===`b`&&(e.metaKey||e.ctrlKey)&&(e.preventDefault(),x())};return window.addEventListener(`keydown`,e),()=>window.removeEventListener(`keydown`,e)},[x]);let S=h?`expanded`:`collapsed`,T=_(()=>({state:S,open:h,setOpen:b,isMobile:c,openMobile:l,setOpenMobile:u,toggleSidebar:x}),[S,h,b,c,l,x]);return y(w.Provider,{value:T,children:y(i,{delayDuration:0,children:y(`div`,{"data-slot":`sidebar-wrapper`,style:{"--sidebar-width":`16rem`,"--sidebar-width-icon":`3rem`,...a},className:d(`group/sidebar-wrapper flex h-dvh w-full`,r),...s,children:o})})})}function D({side:e=`left`,variant:n=`sidebar`,collapsible:r=`offcanvas`,className:i,children:a,...f}){let{isMobile:p,state:m,openMobile:h,setOpenMobile:g,toggleSidebar:_}=T();return r===`none`?y(`aside`,{"data-slot":`sidebar`,className:d(`flex h-full w-(--sidebar-width) flex-col bg-sidebar text-sidebar-foreground`,i),...f,children:a}):p?y(u,{open:h,onOpenChange:g,...f,children:b(c,{"data-sidebar":`sidebar`,"data-slot":`sidebar`,"data-mobile":`true`,className:`w-(--sidebar-width) bg-sidebar p-0 text-sidebar-foreground sm:max-w-3xs [&>button]:hidden`,style:{"--sidebar-width":`18rem`},side:e,children:[b(s,{className:`sr-only`,children:[y(l,{children:`Sidebar`}),y(o,{children:`Displays the mobile sidebar.`})]}),b(`div`,{className:`flex size-full flex-col`,children:[b(`div`,{className:`flex flex-0 items-center gap-x-2 border-border-weak border-b p-2 pr-4`,children:[b(t,{"data-sidebar":`trigger`,"data-slot":`sidebar-trigger`,variant:`ghost`,color:`muted`,size:`icon`,className:d(`size-10 rounded-full`,i),onClick:e=>{_(),e.preventDefault(),e.stopPropagation()},children:[y(x,{className:`size-6!`}),y(`span`,{className:`sr-only`,children:`Toggle Sidebar`})]}),y(`div`,{className:`ml-2 flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground`,children:y(S,{size:20})}),b(`div`,{className:`grid flex-1 text-left text-sm leading-tight`,children:[y(`span`,{className:`truncate font-medium`,children:`Lunas Store`}),y(`span`,{className:`truncate text-xs`,children:`Established 2023`})]})]}),y(`div`,{className:`flex flex-1 flex-col p-2`,children:a})]})]})}):b(`aside`,{className:`group peer hidden bg-card text-sidebar-foreground md:block`,"data-state":m,"data-collapsible":m===`collapsed`?r:``,"data-variant":n,"data-side":e,"data-slot":`sidebar`,children:[y(`div`,{"data-slot":`sidebar-gap`,className:d(`relative`,`bg-transparent`,`transition-[width] duration-200 ease-linear`,`h-(--header-height) w-(--sidebar-width)`,`sm:h-[calc(var(--header-height)+0.5rem)]`,`group-data-[collapsible=offcanvas]:w-0`,`group-data-[side=right]:rotate-180`,n===`floating`||n===`inset`?`group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]`:`group-data-[collapsible=icon]:w-(--sidebar-width-icon)`)}),y(`div`,{"data-slot":`sidebar-container`,className:d(`hidden md:flex`,`fixed inset-y-0 top-14 z-10 shadow-nav`,`h-[calc(100dvh-3.5rem)] w-(--sidebar-width)`,`transition-[left,right,width] duration-200 ease-linear`,e===`left`&&`left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]`,e===`right`&&`right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]`,n===`floating`||n===`inset`?`p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]`:`group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l`,i),...f,children:y(`div`,{"data-sidebar":`sidebar`,"data-slot":`sidebar-inner`,className:d(`flex size-full flex-col`,`group-data-[variant=floating]:rounded-lg`,`group-data-[variant=floating]:border`,`group-data-[variant=floating]:border-sidebar-border`,`group-data-[variant=floating]:shadow-sm`),children:a})})]})}function O({className:e,children:t,...n}){return b(`main`,{"data-slot":`sidebar-inset`,className:d(`relative flex w-full flex-1 flex-col`,e),...n,children:[y(`div`,{className:`h-(--header-height) w-full sm:h-[calc(var(--header-height)+0.5rem)]`}),y(`div`,{className:`inset-shadow-sm flex-1`,children:t})]})}function k({className:e,...t}){return y(`div`,{"data-slot":`sidebar-footer`,"data-sidebar":`footer`,className:d(`flex flex-col gap-2 p-2`,e),...t})}function A({className:e,...t}){return y(`div`,{"data-slot":`sidebar-content`,"data-sidebar":`content`,className:d(`flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden`,e),...t})}function j({className:e,...t}){return y(`div`,{"data-slot":`sidebar-group`,"data-sidebar":`group`,className:d(`relative flex w-full min-w-0 flex-col`,e),...t})}function M({className:t,asChild:n=!1,...r}){return y(n?e:`div`,{"data-slot":`sidebar-group-label`,"data-sidebar":`group-label`,className:d(`flex h-8 shrink-0 items-center rounded-md px-2 font-medium text-sidebar-foreground/70 text-xs outline-hidden ring-sidebar-ring transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0`,`group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0`,t),...r})}function N({className:e,...t}){return y(`div`,{"data-slot":`sidebar-group-content`,"data-sidebar":`group-content`,className:d(`w-full text-sm`,e),...t})}function P({className:e,...t}){return y(`ul`,{"data-slot":`sidebar-menu`,"data-sidebar":`menu`,className:d(`flex w-full min-w-0 flex-col gap-1`,e),...t})}function F({className:e,...t}){return y(`li`,{"data-slot":`sidebar-menu-item`,"data-sidebar":`menu-item`,className:d(`group/menu-item relative`,e),...t})}const I=f([`peer/menu-button`,`cursor-pointer`,`flex w-full items-center gap-2`,`overflow-hidden rounded-md p-2 outline-hidden`,`truncate text-left font-normal`,`transition-[color,width,height,padding]`,`hover:bg-sidebar-accent`,`hover:text-sidebar-accent-foreground`,`active:bg-sidebar-accent`,`active:text-sidebar-accent-foreground`,`disabled:pointer-events-none`,`disabled:opacity-50`,`group-has-data-[sidebar=menu-action]/menu-item:pr-8`,`aria-disabled:pointer-events-none`,`aria-disabled:opacity-50`,`data-[active=true]:bg-sidebar-primary-muted`,`data-[active=true]:text-sidebar-primary`,`data-[state=open]:hover:bg-sidebar-accent`,`data-[state=open]:hover:text-sidebar-accent-foreground`,`group-data-[collapsible=icon]:size-12!`,`group-data-[collapsible=icon]:p-3!`,`group-data-[collapsible=icon]:gap-3!`,`[&>svg]:size-6`,`[&>svg]:shrink-0`,`[&>span:last-child]:truncate`],{variants:{variant:{default:`hover:bg-sidebar-accent/60 hover:text-sidebar-accent-foreground/80`,outline:`bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]`},size:{default:`h-10 text-sm`,sm:`h-7 text-xs`,lg:`h-12 text-sm group-data-[collapsible=icon]:p-0!`}},defaultVariants:{variant:`default`,size:`default`}});function L({asChild:t=!1,isActive:i=!1,variant:o=`default`,size:s=`default`,tooltip:c,className:l,...u}){let f=t?e:`button`,{isMobile:p,state:m}=T(),h=y(f,{"data-slot":`sidebar-menu-button`,"data-sidebar":`menu-button`,"data-size":s,"data-active":i,className:d(I({variant:o,size:s}),l),...u});return c?(typeof c==`string`&&(c={children:c}),b(a,{children:[y(n,{asChild:!0,children:h}),y(r,{side:`right`,align:`center`,hidden:m!==`collapsed`||p,...c})]})):h}const R=()=>{let{toggleSidebar:e}=T();return b(`header`,{"data-slot":`payment-layout-header`,className:d(`bg-card`,`h-(--header-height)`,`sm:h-[calc(var(--header-height)+0.5rem)] sm:px-4 sm:pr-6`,`absolute inset-x-0 top-0 z-20 gap-2 px-2 pr-4.5`,`flex items-center shadow-nav`,`transition-[width,height] ease-linear`),children:[b(t,{"data-sidebar":`trigger`,"data-slot":`sidebar-trigger`,variant:`ghost`,color:`muted`,size:`icon`,className:`size-10 rounded-full transition-all hover:text-text-positive`,onClick:t=>{t.preventDefault(),t.stopPropagation(),e()},children:[y(x,{className:`size-6!`}),y(`span`,{className:`sr-only`,children:`Toggle Sidebar`})]}),b(`div`,{className:`flex gap-x-2 sm:ml-2.5`,children:[y(`div`,{className:`flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground`,children:y(S,{size:20})}),b(`div`,{className:`grid flex-1 text-left text-sm leading-tight`,children:[y(`span`,{className:`truncate font-medium`,children:`Lunas Enterprise`}),y(`span`,{className:`truncate text-xs`,children:`Established 2025`})]})]})]})},z=({activeNavItemId:e,sidebar:t,children:n})=>{let r=_(()=>t?.groupcontent||[],[t]);return b(E,{children:[y(R,{}),b(D,{variant:`inset`,collapsible:`icon`,children:[y(A,{children:r.map(t=>b(j,{children:[y(M,{children:t.label}),y(N,{children:y(P,{children:t.items.map(t=>y(F,{children:b(L,{isActive:t.id===e,onClick:e=>{t.onClick?.(),e.preventDefault(),e.stopPropagation()},children:[t.icon,t.label]})},t.id))})})]},t.id))}),y(k,{children:y(P,{children:y(F,{className:`mt-2 border-t border-t-border`,children:y(`p`,{className:`pt-2 text-center text-muted-foreground text-xs`,children:`Copyright © 2025, Lunas.`})})})})]}),y(O,{children:y(`section`,{className:`relative size-full`,children:y(`div`,{className:`absolute inset-0`,children:n})})})]})};export{z as PaymentLayout};
-//# sourceMappingURL=index.mjs.map
+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"../../input-Cd0G5y-9.mjs";import{t as e}from"../../payment-layout-wN5c7MCM.mjs";export{e as PaymentLayout};

package/dist/pages/FeatureDeveloping.cjs

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,`__esModule`,{value:!0});const e=require(`../chunk-Bmb41Sf3.cjs`);require(`../button.variants-CS-Cmarr.cjs`);const t=require(`../button-BFcXpjqF.cjs`);let n=require(`@customafk/react-toolkit/utils`),r=require(`react/jsx-runtime`),i=require(`lucide-react`);const a=({title:e=`Tính năng đang phát triển`,subtitle:a=`Chúng tôi đang phát triển tính năng này. Vui lòng quay lại sau.`,buttonText:o=`Quay lại`,onButtonClick:s=()=>window.history.back(),className:c,iconClassName:l})=>(0,r.jsxs)(`div`,{className:(0,n.cn)(`flex flex-col items-center justify-center min-h-[50vh] gap-4 sm:gap-6 py-8 sm:py-10 px-4 text-center w-full`,c),children:[(0,r.jsxs)(`div`,{className:`flex flex-col items-center gap-2`,children:[(0,r.jsx)(i.Construction,{className:(0,n.cn)(`size-16 sm:size-24 text-yellow-500`,l)}),(0,r.jsx)(`div`,{className:`text-3xl sm:text-5xl font-bold text-yellow-500`})]}),(0,r.jsx)(`h1`,{className:`text-xl sm:text-2xl font-semibold mt-2`,children:e}),(0,r.jsx)(`p`,{className:`text-muted-foreground max-w-md text-sm sm:text-base`,children:a}),(0,r.jsx)(t.t,{onClick:s,variant:`default`,className:`mt-2`,size:`sm`,children:o})]});var o=a;exports.FeatureDeveloping=a,exports.default=o;
+Object.defineProperty(exports,`__esModule`,{value:!0});const e=require(`../chunk-Bmb41Sf3.cjs`);require(`../button.variants-tnhb123u.cjs`);const t=require(`../button-CwDT3m4m.cjs`);let n=require(`lucide-react`),r=require(`react/jsx-runtime`),i=require(`@customafk/react-toolkit/utils`);const a=({title:e=`Tính năng đang phát triển`,subtitle:a=`Chúng tôi đang phát triển tính năng này. Vui lòng quay lại sau.`,buttonText:o=`Quay lại`,onButtonClick:s=()=>window.history.back(),className:c,iconClassName:l})=>(0,r.jsxs)(`div`,{className:(0,i.cn)(`flex flex-col items-center justify-center min-h-[50vh] gap-4 sm:gap-6 py-8 sm:py-10 px-4 text-center w-full`,c),children:[(0,r.jsxs)(`div`,{className:`flex flex-col items-center gap-2`,children:[(0,r.jsx)(n.Construction,{className:(0,i.cn)(`size-16 sm:size-24 text-yellow-500`,l)}),(0,r.jsx)(`div`,{className:`text-3xl sm:text-5xl font-bold text-yellow-500`})]}),(0,r.jsx)(`h1`,{className:`text-xl sm:text-2xl font-semibold mt-2`,children:e}),(0,r.jsx)(`p`,{className:`text-muted-foreground max-w-md text-sm sm:text-base`,children:a}),(0,r.jsx)(t.t,{onClick:s,variant:`default`,className:`mt-2`,size:`sm`,children:o})]});var o=a;exports.FeatureDeveloping=a,exports.default=o;
 //# sourceMappingURL=FeatureDeveloping.cjs.map