@customafk/lunas-ui 0.2.42 → 0.2.44

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

@@ -1,2 +1,2 @@
-import { n as CMSLayoutProps, r as CMSLayoutUser, t as CMSLayout } from "../../index-rNI5ia8r.cjs";
+import { n as CMSLayoutProps, r as CMSLayoutUser, t as CMSLayout } from "../../index-KO98y6L0.cjs";
 export { CMSLayout, CMSLayoutProps, CMSLayoutUser };

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

@@ -0,0 +1,2 @@
+import { n as CMSLayoutProps, r as CMSLayoutUser, t as CMSLayout } from "../../index-Cm62M0Ft.mjs";
+export { CMSLayout, CMSLayoutProps, CMSLayoutUser };

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

@@ -0,0 +1 @@
+"use client";import"../../button.variants-DkMqWB8G.mjs";import"../../button-CCVJTHBI.mjs";import"../../skeleton-C51IdOfK.mjs";import"../../tooltip-Dxl5Wa8i.mjs";import"../../avatar-fltdRVsJ.mjs";import"../../separator-D3Gmkxzq.mjs";import"../../sheet-BFlIfNaA.mjs";import"../../dropdown-menu-BWhiVsEf.mjs";import"../../input-NJP2wQOm.mjs";import{t as e}from"../../cms-layout-DkCR1AfG.mjs";export{e as CMSLayout};

package/dist/layouts/flex.cjs

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

package/dist/layouts/flex.d.cts

@@ -1,5 +1,5 @@
-import * as react149 from "react";
-import * as class_variance_authority_types5 from "class-variance-authority/types";
+import * as react3 from "react";
+import * as class_variance_authority_types0 from "class-variance-authority/types";
 import { VariantProps } from "class-variance-authority";
 
 //#region packages/components/layouts/flex.d.ts
@@ -9,10 +9,10 @@ declare const flexVariants: (props?: ({
   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;
+  gap?: "sm" | "md" | "lg" | "xl" | "none" | "xs" | null | undefined;
   justify?: "start" | "center" | "end" | "between" | "around" | "evenly" | "stretch" | null | undefined;
   align?: "start" | "center" | "end" | "stretch" | "baseline" | null | undefined;
-} & class_variance_authority_types5.ClassProp) | undefined) => string;
+} & class_variance_authority_types0.ClassProp) | undefined) => string;
 type Props = {
   /** Additional Tailwind classes merged on top of the variant-generated classes. */
   className?: string;
@@ -100,7 +100,7 @@ type Props = {
  * </Flex>
  * ```
  */
-declare const Flex: react149.MemoExoticComponent<({
+declare const Flex: react3.MemoExoticComponent<({
   vertical,
   wrap,
   width,
@@ -111,7 +111,7 @@ declare const Flex: react149.MemoExoticComponent<({
   align,
   className,
   children
-}: React.PropsWithChildren<Props>) => react149.JSX.Element>;
+}: React.PropsWithChildren<Props>) => react3.JSX.Element>;
 //#endregion
 export { Flex };
 //# sourceMappingURL=flex.d.cts.map

package/dist/layouts/flex.d.mts

@@ -0,0 +1,117 @@
+import * as react1 from "react";
+import { VariantProps } from "class-variance-authority";
+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?: "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?: "sm" | "md" | "lg" | "xl" | "none" | "xs" | null | undefined;
+  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>;
+/**
+ * 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: react1.MemoExoticComponent<({
+  vertical,
+  wrap,
+  width,
+  margin,
+  padding,
+  gap,
+  justify,
+  align,
+  className,
+  children
+}: React.PropsWithChildren<Props>) => react1.JSX.Element>;
+//#endregion
+export { Flex };
+//# sourceMappingURL=flex.d.mts.map

package/dist/layouts/flex.mjs

@@ -0,0 +1 @@
+"use client";import{t as e}from"../flex-B6YSJzGe.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-350yNsax.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;
 //# sourceMappingURL=grid.cjs.map

package/dist/layouts/grid.d.mts

@@ -0,0 +1,19 @@
+//#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 };
+//# sourceMappingURL=grid.d.mts.map

package/dist/layouts/grid.mjs

@@ -0,0 +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};
+//# sourceMappingURL=grid.mjs.map

package/dist/layouts/grid.mjs.map

@@ -0,0 +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\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 +1 @@
-require(`../../flex-BAfCk_in.cjs`);const e=require(`../../payment-layout-O7TNw2Cr.cjs`);exports.PaymentLayout=e.t;
+require(`../../button.variants-4kw6plrv.cjs`),require(`../../button-C--DAN1D.cjs`),require(`../../paragraph-DvTZvbzw.cjs`),require(`../../skeleton-CX1USu1w.cjs`),require(`../../flex-DmWmOBn5.cjs`),require(`../../tooltip-CBdoIzoM.cjs`),require(`../../avatar-TyOphzGo.cjs`),require(`../../separator-KuymG9g0.cjs`),require(`../../sheet-CvKSi0UC.cjs`),require(`../../dropdown-menu-CVh520yG.cjs`),require(`../../input-WJ0DLHTR.cjs`);const e=require(`../../payment-layout-DyILfyVG.cjs`);exports.PaymentLayout=e.t;

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

@@ -0,0 +1,74 @@
+//#region packages/components/layouts/payment-layout/index.d.ts
+type PaymentLayoutUser = {
+  uuid?: string;
+  /** Display name shown in the header and dropdown. */
+  fullname: string;
+  /** Email address shown in the user dropdown. */
+  email: string;
+  /** Optional avatar image URL; falls back to initials when omitted. */
+  avatar?: string;
+};
+/**
+ * Full-page payment application shell with a collapsible inset sidebar and a fixed header.
+ * On mobile, the sidebar is replaced by a bottom navigation bar (up to 5 items).
+ *
+ * @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') },
+ *         ],
+ *       },
+ *     ],
+ *   }}
+ *   user={{ fullname: 'Nguyen Van A', email: 'a@example.com' }}
+ *   onLogin={() => setLoginOpen(true)}
+ *   onLogout={() => authService.logout()}
+ * >
+ *   <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;
+      }[];
+    }[];
+  };
+  /** Authenticated user; when provided the header shows user info and a logout option, otherwise a login button. */
+  user?: PaymentLayoutUser | null;
+  /** When false the sidebar and bottom nav are hidden entirely (e.g. unauthenticated state). Defaults to true. */
+  isLogin?: boolean;
+  /** Called when the login button in the header is clicked (only shown when `user` is absent). */
+  onLogin?: () => void;
+  /** Called when the logout item in the user dropdown is clicked. */
+  onLogout?: () => void;
+}>>;
+//#endregion
+export { PaymentLayout, PaymentLayoutUser };
+//# sourceMappingURL=index.d.mts.map

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

@@ -0,0 +1 @@
+import"../../button.variants-DkMqWB8G.mjs";import"../../button-CCVJTHBI.mjs";import"../../paragraph-DYLaQtTV.mjs";import"../../skeleton-C51IdOfK.mjs";import"../../flex-B6YSJzGe.mjs";import"../../tooltip-Dxl5Wa8i.mjs";import"../../avatar-fltdRVsJ.mjs";import"../../separator-D3Gmkxzq.mjs";import"../../sheet-BFlIfNaA.mjs";import"../../dropdown-menu-BWhiVsEf.mjs";import"../../input-NJP2wQOm.mjs";import{t as e}from"../../payment-layout-DrQ0kZPX.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-DgVFNsVc.cjs`);const t=require(`../ui/button.cjs`);let n=require(`lucide-react`),r=require(`@customafk/react-toolkit/utils`),i=require(`react/jsx-runtime`);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,i.jsxs)(`div`,{className:(0,r.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,i.jsxs)(`div`,{className:`flex flex-col items-center gap-2`,children:[(0,i.jsx)(n.Construction,{className:(0,r.cn)(`size-16 sm:size-24 text-yellow-500`,l)}),(0,i.jsx)(`div`,{className:`text-3xl sm:text-5xl font-bold text-yellow-500`})]}),(0,i.jsx)(`h1`,{className:`text-xl sm:text-2xl font-semibold mt-2`,children:e}),(0,i.jsx)(`p`,{className:`text-muted-foreground max-w-md text-sm sm:text-base`,children:a}),(0,i.jsx)(t.Button,{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-350yNsax.cjs`);require(`../button.variants-4kw6plrv.cjs`);const t=require(`../button-C--DAN1D.cjs`);let n=require(`lucide-react`),r=require(`@customafk/react-toolkit/utils`),i=require(`react/jsx-runtime`);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,i.jsxs)(`div`,{className:(0,r.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,i.jsxs)(`div`,{className:`flex flex-col items-center gap-2`,children:[(0,i.jsx)(n.Construction,{className:(0,r.cn)(`size-16 sm:size-24 text-yellow-500`,l)}),(0,i.jsx)(`div`,{className:`text-3xl sm:text-5xl font-bold text-yellow-500`})]}),(0,i.jsx)(`h1`,{className:`text-xl sm:text-2xl font-semibold mt-2`,children:e}),(0,i.jsx)(`p`,{className:`text-muted-foreground max-w-md text-sm sm:text-base`,children:a}),(0,i.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

package/dist/pages/FeatureDeveloping.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"FeatureDeveloping.cjs","names":["Construction","Button"],"sources":["../../packages/components/pages/FeatureDeveloping.tsx"],"sourcesContent":["import { Construction } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Button } from '../ui/button';\n\nexport interface FeatureDevelopingProps {\n  /** Main heading shown beneath the construction icon. Defaults to `'Tính năng đang phát triển'`. */\n  title?: string;\n  /** Supporting text shown below the title. Defaults to a Vietnamese message asking the user to check back later. */\n  subtitle?: string;\n  /** Label for the action button. Defaults to `'Quay lại'`. */\n  buttonText?: string;\n  /** Handler called when the action button is clicked. Defaults to `window.history.back()`. */\n  onButtonClick?: () => void;\n  /** Additional class names applied to the root container element. */\n  className?: string;\n  /** Additional class names applied to the `Construction` icon. */\n  iconClassName?: string;\n}\n\n/**\n * Full-page placeholder displayed when a feature is still under active development.\n *\n * @example\n * ```tsx\n * import { FeatureDeveloping } from '@customafk/lunas-ui/pages/FeatureDeveloping';\n *\n * <FeatureDeveloping\n *   title=\"Coming Soon\"\n *   subtitle=\"This feature is not ready yet.\"\n *   buttonText=\"Go Back\"\n *   onButtonClick={() => router.back()}\n * />\n * ```\n */\nexport const FeatureDeveloping = ({\n  title = 'Tính năng đang phát triển',\n  subtitle = 'Chúng tôi đang phát triển tính năng này. Vui lòng quay lại sau.',\n  buttonText = 'Quay lại',\n  onButtonClick = () => window.history.back(),\n  className,\n  iconClassName,\n}: FeatureDevelopingProps) => {\n  return (\n    <div className={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', className)}>\n      <div className=\"flex flex-col items-center gap-2\">\n        <Construction className={cn('size-16 sm:size-24 text-yellow-500', iconClassName)} />\n        <div className=\"text-3xl sm:text-5xl font-bold text-yellow-500\">{/* This text shows the feature is in development */}</div>\n      </div>\n\n      <h1 className=\"text-xl sm:text-2xl font-semibold mt-2\">{title}</h1>\n\n      <p className=\"text-muted-foreground max-w-md text-sm sm:text-base\">{subtitle}</p>\n\n      <Button onClick={onButtonClick} variant=\"default\" className=\"mt-2\" size=\"sm\">\n        {buttonText}\n      </Button>\n    </div>\n  );\n};\n\nexport default FeatureDeveloping;\n"],"mappings":"wRAoCA,MAAa,GAAqB,CAChC,QAAQ,4BACR,WAAW,kEACX,aAAa,WACb,oBAAsB,OAAO,QAAQ,MAAM,CAC3C,YACA,oBAGE,EAAA,EAAA,MAAC,MAAA,CAAI,WAAA,EAAA,EAAA,IAAc,8GAA+G,EAAU,YAC1I,EAAA,EAAA,MAAC,MAAA,CAAI,UAAU,8CACb,EAAA,EAAA,KAACA,EAAAA,aAAAA,CAAa,WAAA,EAAA,EAAA,IAAc,qCAAsC,EAAc,CAAA,CAAI,EACpF,EAAA,EAAA,KAAC,MAAA,CAAI,UAAU,iDAAA,CAA4G,CAAA,EACvH,EAEN,EAAA,EAAA,KAAC,KAAA,CAAG,UAAU,kDAA0C,GAAW,EAEnE,EAAA,EAAA,KAAC,IAAA,CAAE,UAAU,+DAAuD,GAAa,EAEjF,EAAA,EAAA,KAACC,EAAAA,OAAAA,CAAO,QAAS,EAAe,QAAQ,UAAU,UAAU,OAAO,KAAK,cACrE,GACM,GACL,CAIV,IAAA,EAAe"}
+{"version":3,"file":"FeatureDeveloping.cjs","names":["Construction","Button"],"sources":["../../packages/components/pages/FeatureDeveloping.tsx"],"sourcesContent":["import { Construction } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Button } from '../ui/button';\n\nexport interface FeatureDevelopingProps {\n  /** Main heading shown beneath the construction icon. Defaults to `'Tính năng đang phát triển'`. */\n  title?: string;\n  /** Supporting text shown below the title. Defaults to a Vietnamese message asking the user to check back later. */\n  subtitle?: string;\n  /** Label for the action button. Defaults to `'Quay lại'`. */\n  buttonText?: string;\n  /** Handler called when the action button is clicked. Defaults to `window.history.back()`. */\n  onButtonClick?: () => void;\n  /** Additional class names applied to the root container element. */\n  className?: string;\n  /** Additional class names applied to the `Construction` icon. */\n  iconClassName?: string;\n}\n\n/**\n * Full-page placeholder displayed when a feature is still under active development.\n *\n * @example\n * ```tsx\n * import { FeatureDeveloping } from '@customafk/lunas-ui/pages/FeatureDeveloping';\n *\n * <FeatureDeveloping\n *   title=\"Coming Soon\"\n *   subtitle=\"This feature is not ready yet.\"\n *   buttonText=\"Go Back\"\n *   onButtonClick={() => router.back()}\n * />\n * ```\n */\nexport const FeatureDeveloping = ({\n  title = 'Tính năng đang phát triển',\n  subtitle = 'Chúng tôi đang phát triển tính năng này. Vui lòng quay lại sau.',\n  buttonText = 'Quay lại',\n  onButtonClick = () => window.history.back(),\n  className,\n  iconClassName,\n}: FeatureDevelopingProps) => {\n  return (\n    <div className={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', className)}>\n      <div className=\"flex flex-col items-center gap-2\">\n        <Construction className={cn('size-16 sm:size-24 text-yellow-500', iconClassName)} />\n        <div className=\"text-3xl sm:text-5xl font-bold text-yellow-500\">{/* This text shows the feature is in development */}</div>\n      </div>\n\n      <h1 className=\"text-xl sm:text-2xl font-semibold mt-2\">{title}</h1>\n\n      <p className=\"text-muted-foreground max-w-md text-sm sm:text-base\">{subtitle}</p>\n\n      <Button onClick={onButtonClick} variant=\"default\" className=\"mt-2\" size=\"sm\">\n        {buttonText}\n      </Button>\n    </div>\n  );\n};\n\nexport default FeatureDeveloping;\n"],"mappings":"8RAoCA,MAAa,GAAqB,CAChC,QAAQ,4BACR,WAAW,kEACX,aAAa,WACb,oBAAsB,OAAO,QAAQ,MAAM,CAC3C,YACA,oBAGE,EAAA,EAAA,MAAC,MAAA,CAAI,WAAA,EAAA,EAAA,IAAc,8GAA+G,EAAU,YAC1I,EAAA,EAAA,MAAC,MAAA,CAAI,UAAU,8CACb,EAAA,EAAA,KAACA,EAAAA,aAAAA,CAAa,WAAA,EAAA,EAAA,IAAc,qCAAsC,EAAc,CAAA,CAAI,EACpF,EAAA,EAAA,KAAC,MAAA,CAAI,UAAU,iDAAA,CAA4G,CAAA,EACvH,EAEN,EAAA,EAAA,KAAC,KAAA,CAAG,UAAU,kDAA0C,GAAW,EAEnE,EAAA,EAAA,KAAC,IAAA,CAAE,UAAU,+DAAuD,GAAa,EAEjF,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAO,QAAS,EAAe,QAAQ,UAAU,UAAU,OAAO,KAAK,cACrE,GACM,GACL,CAIV,IAAA,EAAe"}

package/dist/pages/FeatureDeveloping.d.cts

@@ -1,4 +1,4 @@
-import * as react30 from "react";
+import * as react24 from "react";
 
 //#region packages/components/pages/FeatureDeveloping.d.ts
 interface FeatureDevelopingProps {
@@ -37,7 +37,7 @@ declare const FeatureDeveloping: ({
   onButtonClick,
   className,
   iconClassName
-}: FeatureDevelopingProps) => react30.JSX.Element;
+}: FeatureDevelopingProps) => react24.JSX.Element;
 //#endregion
 export { FeatureDeveloping, FeatureDeveloping as default, FeatureDevelopingProps };
 //# sourceMappingURL=FeatureDeveloping.d.cts.map

package/dist/pages/FeatureDeveloping.d.mts

@@ -0,0 +1,43 @@
+import * as react4 from "react";
+
+//#region packages/components/pages/FeatureDeveloping.d.ts
+interface FeatureDevelopingProps {
+  /** Main heading shown beneath the construction icon. Defaults to `'Tính năng đang phát triển'`. */
+  title?: string;
+  /** Supporting text shown below the title. Defaults to a Vietnamese message asking the user to check back later. */
+  subtitle?: string;
+  /** Label for the action button. Defaults to `'Quay lại'`. */
+  buttonText?: string;
+  /** Handler called when the action button is clicked. Defaults to `window.history.back()`. */
+  onButtonClick?: () => void;
+  /** Additional class names applied to the root container element. */
+  className?: string;
+  /** Additional class names applied to the `Construction` icon. */
+  iconClassName?: string;
+}
+/**
+ * Full-page placeholder displayed when a feature is still under active development.
+ *
+ * @example
+ * ```tsx
+ * import { FeatureDeveloping } from '@customafk/lunas-ui/pages/FeatureDeveloping';
+ *
+ * <FeatureDeveloping
+ *   title="Coming Soon"
+ *   subtitle="This feature is not ready yet."
+ *   buttonText="Go Back"
+ *   onButtonClick={() => router.back()}
+ * />
+ * ```
+ */
+declare const FeatureDeveloping: ({
+  title,
+  subtitle,
+  buttonText,
+  onButtonClick,
+  className,
+  iconClassName
+}: FeatureDevelopingProps) => react4.JSX.Element;
+//#endregion
+export { FeatureDeveloping, FeatureDeveloping as default, FeatureDevelopingProps };
+//# sourceMappingURL=FeatureDeveloping.d.mts.map

package/dist/pages/FeatureDeveloping.mjs

@@ -0,0 +1,2 @@
+import"../button.variants-DkMqWB8G.mjs";import{t as e}from"../button-CCVJTHBI.mjs";import{Construction as t}from"lucide-react";import{cn as n}from"@customafk/react-toolkit/utils";import{jsx as r,jsxs as i}from"react/jsx-runtime";const a=({title:a=`Tính năng đang phát triển`,subtitle:o=`Chúng tôi đang phát triển tính năng này. Vui lòng quay lại sau.`,buttonText:s=`Quay lại`,onButtonClick:c=()=>window.history.back(),className:l,iconClassName:u})=>i(`div`,{className:n(`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`,l),children:[i(`div`,{className:`flex flex-col items-center gap-2`,children:[r(t,{className:n(`size-16 sm:size-24 text-yellow-500`,u)}),r(`div`,{className:`text-3xl sm:text-5xl font-bold text-yellow-500`})]}),r(`h1`,{className:`text-xl sm:text-2xl font-semibold mt-2`,children:a}),r(`p`,{className:`text-muted-foreground max-w-md text-sm sm:text-base`,children:o}),r(e,{onClick:c,variant:`default`,className:`mt-2`,size:`sm`,children:s})]});var o=a;export{a as FeatureDeveloping,o as default};
+//# sourceMappingURL=FeatureDeveloping.mjs.map

package/dist/pages/FeatureDeveloping.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FeatureDeveloping.mjs","names":[],"sources":["../../packages/components/pages/FeatureDeveloping.tsx"],"sourcesContent":["import { Construction } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Button } from '../ui/button';\n\nexport interface FeatureDevelopingProps {\n  /** Main heading shown beneath the construction icon. Defaults to `'Tính năng đang phát triển'`. */\n  title?: string;\n  /** Supporting text shown below the title. Defaults to a Vietnamese message asking the user to check back later. */\n  subtitle?: string;\n  /** Label for the action button. Defaults to `'Quay lại'`. */\n  buttonText?: string;\n  /** Handler called when the action button is clicked. Defaults to `window.history.back()`. */\n  onButtonClick?: () => void;\n  /** Additional class names applied to the root container element. */\n  className?: string;\n  /** Additional class names applied to the `Construction` icon. */\n  iconClassName?: string;\n}\n\n/**\n * Full-page placeholder displayed when a feature is still under active development.\n *\n * @example\n * ```tsx\n * import { FeatureDeveloping } from '@customafk/lunas-ui/pages/FeatureDeveloping';\n *\n * <FeatureDeveloping\n *   title=\"Coming Soon\"\n *   subtitle=\"This feature is not ready yet.\"\n *   buttonText=\"Go Back\"\n *   onButtonClick={() => router.back()}\n * />\n * ```\n */\nexport const FeatureDeveloping = ({\n  title = 'Tính năng đang phát triển',\n  subtitle = 'Chúng tôi đang phát triển tính năng này. Vui lòng quay lại sau.',\n  buttonText = 'Quay lại',\n  onButtonClick = () => window.history.back(),\n  className,\n  iconClassName,\n}: FeatureDevelopingProps) => {\n  return (\n    <div className={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', className)}>\n      <div className=\"flex flex-col items-center gap-2\">\n        <Construction className={cn('size-16 sm:size-24 text-yellow-500', iconClassName)} />\n        <div className=\"text-3xl sm:text-5xl font-bold text-yellow-500\">{/* This text shows the feature is in development */}</div>\n      </div>\n\n      <h1 className=\"text-xl sm:text-2xl font-semibold mt-2\">{title}</h1>\n\n      <p className=\"text-muted-foreground max-w-md text-sm sm:text-base\">{subtitle}</p>\n\n      <Button onClick={onButtonClick} variant=\"default\" className=\"mt-2\" size=\"sm\">\n        {buttonText}\n      </Button>\n    </div>\n  );\n};\n\nexport default FeatureDeveloping;\n"],"mappings":"qOAoCA,MAAa,GAAqB,CAChC,QAAQ,4BACR,WAAW,kEACX,aAAa,WACb,oBAAsB,OAAO,QAAQ,MAAM,CAC3C,YACA,mBAGE,EAAC,MAAA,CAAI,UAAW,EAAG,8GAA+G,EAAU,WAC1I,EAAC,MAAA,CAAI,UAAU,6CACb,EAAC,EAAA,CAAa,UAAW,EAAG,qCAAsC,EAAc,CAAA,CAAI,CACpF,EAAC,MAAA,CAAI,UAAU,iDAAA,CAA4G,CAAA,EACvH,CAEN,EAAC,KAAA,CAAG,UAAU,kDAA0C,GAAW,CAEnE,EAAC,IAAA,CAAE,UAAU,+DAAuD,GAAa,CAEjF,EAAC,EAAA,CAAO,QAAS,EAAe,QAAQ,UAAU,UAAU,OAAO,KAAK,cACrE,GACM,GACL,CAIV,IAAA,EAAe"}

package/dist/pages/FeatureFixing.cjs

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,`__esModule`,{value:!0});const e=require(`../chunk-Bmb41Sf3.cjs`);require(`../button.variants-DgVFNsVc.cjs`);const t=require(`../ui/button.cjs`);let n=require(`lucide-react`),r=require(`@customafk/react-toolkit/utils`),i=require(`react/jsx-runtime`);const a=({title:e=`Tính năng đang bảo trì`,subtitle:a=`Chúng tôi đang khắc phục vấn đề với 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,i.jsxs)(`div`,{className:(0,r.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,i.jsxs)(`div`,{className:`flex flex-col items-center gap-2`,children:[(0,i.jsx)(n.Wrench,{className:(0,r.cn)(`size-16 sm:size-24 text-orange-500`,l)}),(0,i.jsx)(`div`,{className:`text-3xl sm:text-5xl font-bold text-orange-500`})]}),(0,i.jsx)(`h1`,{className:`text-xl sm:text-2xl font-semibold mt-2`,children:e}),(0,i.jsx)(`p`,{className:`text-muted-foreground max-w-md text-sm sm:text-base`,children:a}),(0,i.jsx)(t.Button,{onClick:s,variant:`default`,className:`mt-2`,size:`sm`,children:o})]});var o=a;exports.FeatureFixing=a,exports.default=o;
+Object.defineProperty(exports,`__esModule`,{value:!0});const e=require(`../chunk-350yNsax.cjs`);require(`../button.variants-4kw6plrv.cjs`);const t=require(`../button-C--DAN1D.cjs`);let n=require(`lucide-react`),r=require(`@customafk/react-toolkit/utils`),i=require(`react/jsx-runtime`);const a=({title:e=`Tính năng đang bảo trì`,subtitle:a=`Chúng tôi đang khắc phục vấn đề với 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,i.jsxs)(`div`,{className:(0,r.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,i.jsxs)(`div`,{className:`flex flex-col items-center gap-2`,children:[(0,i.jsx)(n.Wrench,{className:(0,r.cn)(`size-16 sm:size-24 text-orange-500`,l)}),(0,i.jsx)(`div`,{className:`text-3xl sm:text-5xl font-bold text-orange-500`})]}),(0,i.jsx)(`h1`,{className:`text-xl sm:text-2xl font-semibold mt-2`,children:e}),(0,i.jsx)(`p`,{className:`text-muted-foreground max-w-md text-sm sm:text-base`,children:a}),(0,i.jsx)(t.t,{onClick:s,variant:`default`,className:`mt-2`,size:`sm`,children:o})]});var o=a;exports.FeatureFixing=a,exports.default=o;
 //# sourceMappingURL=FeatureFixing.cjs.map

package/dist/pages/FeatureFixing.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"FeatureFixing.cjs","names":["Wrench","Button"],"sources":["../../packages/components/pages/FeatureFixing.tsx"],"sourcesContent":["import { Button } from '../ui/button';\nimport { cn } from '@customafk/react-toolkit/utils';\nimport { Wrench } from 'lucide-react';\n\nexport interface FeatureFixingProps {\n  /** Main heading shown beneath the wrench icon. Defaults to `'Tính năng đang bảo trì'`. */\n  title?: string;\n  /** Supporting text shown below the title. Defaults to a Vietnamese maintenance message. */\n  subtitle?: string;\n  /** Label for the action button. Defaults to `'Quay lại'`. */\n  buttonText?: string;\n  /** Handler called when the action button is clicked. Defaults to `window.history.back()`. */\n  onButtonClick?: () => void;\n  /** Additional class names applied to the root container element. */\n  className?: string;\n  /** Additional class names applied to the `Wrench` icon. */\n  iconClassName?: string;\n}\n\n/**\n * Full-page placeholder displayed when a feature is temporarily unavailable due to maintenance or bug fixes.\n *\n * @example\n * ```tsx\n * import { FeatureFixing } from '@customafk/lunas-ui/pages/FeatureFixing';\n *\n * <FeatureFixing\n *   title=\"Under Maintenance\"\n *   subtitle=\"We are fixing an issue. Please check back later.\"\n *   buttonText=\"Go Back\"\n *   onButtonClick={() => router.back()}\n * />\n * ```\n */\nexport const FeatureFixing = ({\n  title = 'Tính năng đang bảo trì',\n  subtitle = 'Chúng tôi đang khắc phục vấn đề với tính năng này. Vui lòng quay lại sau.',\n  buttonText = 'Quay lại',\n  onButtonClick = () => window.history.back(),\n  className,\n  iconClassName,\n}: FeatureFixingProps) => {\n  return (\n    <div className={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', className)}>\n      <div className=\"flex flex-col items-center gap-2\">\n        <Wrench className={cn('size-16 sm:size-24 text-orange-500', iconClassName)} />\n        <div className=\"text-3xl sm:text-5xl font-bold text-orange-500\">{/* This text indicates the feature is being fixed */}</div>\n      </div>\n\n      <h1 className=\"text-xl sm:text-2xl font-semibold mt-2\">{title}</h1>\n\n      <p className=\"text-muted-foreground max-w-md text-sm sm:text-base\">{subtitle}</p>\n\n      <Button onClick={onButtonClick} variant=\"default\" className=\"mt-2\" size=\"sm\">\n        {buttonText}\n      </Button>\n    </div>\n  );\n};\n\nexport default FeatureFixing;\n"],"mappings":"wRAkCA,MAAa,GAAiB,CAC5B,QAAQ,yBACR,WAAW,4EACX,aAAa,WACb,oBAAsB,OAAO,QAAQ,MAAM,CAC3C,YACA,oBAGE,EAAA,EAAA,MAAC,MAAA,CAAI,WAAA,EAAA,EAAA,IAAc,8GAA+G,EAAU,YAC1I,EAAA,EAAA,MAAC,MAAA,CAAI,UAAU,8CACb,EAAA,EAAA,KAACA,EAAAA,OAAAA,CAAO,WAAA,EAAA,EAAA,IAAc,qCAAsC,EAAc,CAAA,CAAI,EAC9E,EAAA,EAAA,KAAC,MAAA,CAAI,UAAU,iDAAA,CAA6G,CAAA,EACxH,EAEN,EAAA,EAAA,KAAC,KAAA,CAAG,UAAU,kDAA0C,GAAW,EAEnE,EAAA,EAAA,KAAC,IAAA,CAAE,UAAU,+DAAuD,GAAa,EAEjF,EAAA,EAAA,KAACC,EAAAA,OAAAA,CAAO,QAAS,EAAe,QAAQ,UAAU,UAAU,OAAO,KAAK,cACrE,GACM,GACL,CAIV,IAAA,EAAe"}
+{"version":3,"file":"FeatureFixing.cjs","names":["Wrench","Button"],"sources":["../../packages/components/pages/FeatureFixing.tsx"],"sourcesContent":["import { Button } from '../ui/button';\nimport { cn } from '@customafk/react-toolkit/utils';\nimport { Wrench } from 'lucide-react';\n\nexport interface FeatureFixingProps {\n  /** Main heading shown beneath the wrench icon. Defaults to `'Tính năng đang bảo trì'`. */\n  title?: string;\n  /** Supporting text shown below the title. Defaults to a Vietnamese maintenance message. */\n  subtitle?: string;\n  /** Label for the action button. Defaults to `'Quay lại'`. */\n  buttonText?: string;\n  /** Handler called when the action button is clicked. Defaults to `window.history.back()`. */\n  onButtonClick?: () => void;\n  /** Additional class names applied to the root container element. */\n  className?: string;\n  /** Additional class names applied to the `Wrench` icon. */\n  iconClassName?: string;\n}\n\n/**\n * Full-page placeholder displayed when a feature is temporarily unavailable due to maintenance or bug fixes.\n *\n * @example\n * ```tsx\n * import { FeatureFixing } from '@customafk/lunas-ui/pages/FeatureFixing';\n *\n * <FeatureFixing\n *   title=\"Under Maintenance\"\n *   subtitle=\"We are fixing an issue. Please check back later.\"\n *   buttonText=\"Go Back\"\n *   onButtonClick={() => router.back()}\n * />\n * ```\n */\nexport const FeatureFixing = ({\n  title = 'Tính năng đang bảo trì',\n  subtitle = 'Chúng tôi đang khắc phục vấn đề với tính năng này. Vui lòng quay lại sau.',\n  buttonText = 'Quay lại',\n  onButtonClick = () => window.history.back(),\n  className,\n  iconClassName,\n}: FeatureFixingProps) => {\n  return (\n    <div className={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', className)}>\n      <div className=\"flex flex-col items-center gap-2\">\n        <Wrench className={cn('size-16 sm:size-24 text-orange-500', iconClassName)} />\n        <div className=\"text-3xl sm:text-5xl font-bold text-orange-500\">{/* This text indicates the feature is being fixed */}</div>\n      </div>\n\n      <h1 className=\"text-xl sm:text-2xl font-semibold mt-2\">{title}</h1>\n\n      <p className=\"text-muted-foreground max-w-md text-sm sm:text-base\">{subtitle}</p>\n\n      <Button onClick={onButtonClick} variant=\"default\" className=\"mt-2\" size=\"sm\">\n        {buttonText}\n      </Button>\n    </div>\n  );\n};\n\nexport default FeatureFixing;\n"],"mappings":"8RAkCA,MAAa,GAAiB,CAC5B,QAAQ,yBACR,WAAW,4EACX,aAAa,WACb,oBAAsB,OAAO,QAAQ,MAAM,CAC3C,YACA,oBAGE,EAAA,EAAA,MAAC,MAAA,CAAI,WAAA,EAAA,EAAA,IAAc,8GAA+G,EAAU,YAC1I,EAAA,EAAA,MAAC,MAAA,CAAI,UAAU,8CACb,EAAA,EAAA,KAACA,EAAAA,OAAAA,CAAO,WAAA,EAAA,EAAA,IAAc,qCAAsC,EAAc,CAAA,CAAI,EAC9E,EAAA,EAAA,KAAC,MAAA,CAAI,UAAU,iDAAA,CAA6G,CAAA,EACxH,EAEN,EAAA,EAAA,KAAC,KAAA,CAAG,UAAU,kDAA0C,GAAW,EAEnE,EAAA,EAAA,KAAC,IAAA,CAAE,UAAU,+DAAuD,GAAa,EAEjF,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAO,QAAS,EAAe,QAAQ,UAAU,UAAU,OAAO,KAAK,cACrE,GACM,GACL,CAIV,IAAA,EAAe"}

package/dist/pages/FeatureFixing.d.cts

@@ -1,4 +1,4 @@
-import * as react31 from "react";
+import * as react26 from "react";
 
 //#region packages/components/pages/FeatureFixing.d.ts
 interface FeatureFixingProps {
@@ -37,7 +37,7 @@ declare const FeatureFixing: ({
   onButtonClick,
   className,
   iconClassName
-}: FeatureFixingProps) => react31.JSX.Element;
+}: FeatureFixingProps) => react26.JSX.Element;
 //#endregion
 export { FeatureFixing, FeatureFixing as default, FeatureFixingProps };
 //# sourceMappingURL=FeatureFixing.d.cts.map

package/dist/pages/FeatureFixing.d.mts

@@ -0,0 +1,43 @@
+import * as react3 from "react";
+
+//#region packages/components/pages/FeatureFixing.d.ts
+interface FeatureFixingProps {
+  /** Main heading shown beneath the wrench icon. Defaults to `'Tính năng đang bảo trì'`. */
+  title?: string;
+  /** Supporting text shown below the title. Defaults to a Vietnamese maintenance message. */
+  subtitle?: string;
+  /** Label for the action button. Defaults to `'Quay lại'`. */
+  buttonText?: string;
+  /** Handler called when the action button is clicked. Defaults to `window.history.back()`. */
+  onButtonClick?: () => void;
+  /** Additional class names applied to the root container element. */
+  className?: string;
+  /** Additional class names applied to the `Wrench` icon. */
+  iconClassName?: string;
+}
+/**
+ * Full-page placeholder displayed when a feature is temporarily unavailable due to maintenance or bug fixes.
+ *
+ * @example
+ * ```tsx
+ * import { FeatureFixing } from '@customafk/lunas-ui/pages/FeatureFixing';
+ *
+ * <FeatureFixing
+ *   title="Under Maintenance"
+ *   subtitle="We are fixing an issue. Please check back later."
+ *   buttonText="Go Back"
+ *   onButtonClick={() => router.back()}
+ * />
+ * ```
+ */
+declare const FeatureFixing: ({
+  title,
+  subtitle,
+  buttonText,
+  onButtonClick,
+  className,
+  iconClassName
+}: FeatureFixingProps) => react3.JSX.Element;
+//#endregion
+export { FeatureFixing, FeatureFixing as default, FeatureFixingProps };
+//# sourceMappingURL=FeatureFixing.d.mts.map

package/dist/pages/FeatureFixing.mjs

@@ -0,0 +1,2 @@
+import"../button.variants-DkMqWB8G.mjs";import{t as e}from"../button-CCVJTHBI.mjs";import{Wrench as t}from"lucide-react";import{cn as n}from"@customafk/react-toolkit/utils";import{jsx as r,jsxs as i}from"react/jsx-runtime";const a=({title:a=`Tính năng đang bảo trì`,subtitle:o=`Chúng tôi đang khắc phục vấn đề với tính năng này. Vui lòng quay lại sau.`,buttonText:s=`Quay lại`,onButtonClick:c=()=>window.history.back(),className:l,iconClassName:u})=>i(`div`,{className:n(`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`,l),children:[i(`div`,{className:`flex flex-col items-center gap-2`,children:[r(t,{className:n(`size-16 sm:size-24 text-orange-500`,u)}),r(`div`,{className:`text-3xl sm:text-5xl font-bold text-orange-500`})]}),r(`h1`,{className:`text-xl sm:text-2xl font-semibold mt-2`,children:a}),r(`p`,{className:`text-muted-foreground max-w-md text-sm sm:text-base`,children:o}),r(e,{onClick:c,variant:`default`,className:`mt-2`,size:`sm`,children:s})]});var o=a;export{a as FeatureFixing,o as default};
+//# sourceMappingURL=FeatureFixing.mjs.map

package/dist/pages/FeatureFixing.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FeatureFixing.mjs","names":[],"sources":["../../packages/components/pages/FeatureFixing.tsx"],"sourcesContent":["import { Button } from '../ui/button';\nimport { cn } from '@customafk/react-toolkit/utils';\nimport { Wrench } from 'lucide-react';\n\nexport interface FeatureFixingProps {\n  /** Main heading shown beneath the wrench icon. Defaults to `'Tính năng đang bảo trì'`. */\n  title?: string;\n  /** Supporting text shown below the title. Defaults to a Vietnamese maintenance message. */\n  subtitle?: string;\n  /** Label for the action button. Defaults to `'Quay lại'`. */\n  buttonText?: string;\n  /** Handler called when the action button is clicked. Defaults to `window.history.back()`. */\n  onButtonClick?: () => void;\n  /** Additional class names applied to the root container element. */\n  className?: string;\n  /** Additional class names applied to the `Wrench` icon. */\n  iconClassName?: string;\n}\n\n/**\n * Full-page placeholder displayed when a feature is temporarily unavailable due to maintenance or bug fixes.\n *\n * @example\n * ```tsx\n * import { FeatureFixing } from '@customafk/lunas-ui/pages/FeatureFixing';\n *\n * <FeatureFixing\n *   title=\"Under Maintenance\"\n *   subtitle=\"We are fixing an issue. Please check back later.\"\n *   buttonText=\"Go Back\"\n *   onButtonClick={() => router.back()}\n * />\n * ```\n */\nexport const FeatureFixing = ({\n  title = 'Tính năng đang bảo trì',\n  subtitle = 'Chúng tôi đang khắc phục vấn đề với tính năng này. Vui lòng quay lại sau.',\n  buttonText = 'Quay lại',\n  onButtonClick = () => window.history.back(),\n  className,\n  iconClassName,\n}: FeatureFixingProps) => {\n  return (\n    <div className={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', className)}>\n      <div className=\"flex flex-col items-center gap-2\">\n        <Wrench className={cn('size-16 sm:size-24 text-orange-500', iconClassName)} />\n        <div className=\"text-3xl sm:text-5xl font-bold text-orange-500\">{/* This text indicates the feature is being fixed */}</div>\n      </div>\n\n      <h1 className=\"text-xl sm:text-2xl font-semibold mt-2\">{title}</h1>\n\n      <p className=\"text-muted-foreground max-w-md text-sm sm:text-base\">{subtitle}</p>\n\n      <Button onClick={onButtonClick} variant=\"default\" className=\"mt-2\" size=\"sm\">\n        {buttonText}\n      </Button>\n    </div>\n  );\n};\n\nexport default FeatureFixing;\n"],"mappings":"+NAkCA,MAAa,GAAiB,CAC5B,QAAQ,yBACR,WAAW,4EACX,aAAa,WACb,oBAAsB,OAAO,QAAQ,MAAM,CAC3C,YACA,mBAGE,EAAC,MAAA,CAAI,UAAW,EAAG,8GAA+G,EAAU,WAC1I,EAAC,MAAA,CAAI,UAAU,6CACb,EAAC,EAAA,CAAO,UAAW,EAAG,qCAAsC,EAAc,CAAA,CAAI,CAC9E,EAAC,MAAA,CAAI,UAAU,iDAAA,CAA6G,CAAA,EACxH,CAEN,EAAC,KAAA,CAAG,UAAU,kDAA0C,GAAW,CAEnE,EAAC,IAAA,CAAE,UAAU,+DAAuD,GAAa,CAEjF,EAAC,EAAA,CAAO,QAAS,EAAe,QAAQ,UAAU,UAAU,OAAO,KAAK,cACrE,GACM,GACL,CAIV,IAAA,EAAe"}

package/dist/pages/LoginPage.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);require(`../button.variants-DgVFNsVc.cjs`);const t=require(`../ui/button.cjs`);require(`../heading-BX7ZVnVg.cjs`),require(`../paragraph-D0x3Jc6W.cjs`),require(`../close-Dflkky9q.cjs`);const n=require(`../ui/dialog.cjs`),r=require(`../alert-JwECRZfz.cjs`),i=require(`../ui/input.cjs`),a=require(`../ui/label.cjs`);let o=require(`lucide-react`),s=require(`react/jsx-runtime`),c=require(`react`),l=require(`zod`);const u=l.z.object({email:l.z.string().min(1,`Vui lòng nhập email`).email(`Email không hợp lệ`),password:l.z.string().min(1,`Vui lòng nhập mật khẩu`)}),d=({open:e,onOpenChange:l,onLogin:d,onForgotPassword:f,onRegister:p,isLoading:m=!1,errorMessage:h,title:g=`Đăng nhập`,subtitle:_=`Nhập thông tin để tiếp tục`})=>{let v=(0,c.useId)(),y=(0,c.useId)(),[b,x]=(0,c.useState)(``),[S,C]=(0,c.useState)(``),[w,T]=(0,c.useState)(!1),[E,D]=(0,c.useState)({});return(0,s.jsx)(n.Dialog,{open:e,onOpenChange:l,children:(0,s.jsxs)(n.DialogContent,{className:`max-sm:data-[state=open]:slide-in-from-bottom max-sm:data-[state=open]:zoom-in-100 max-sm:data-[state=closed]:slide-out-to-bottom max-sm:data-[state=closed]:zoom-out-100 max-sm:top-auto max-sm:right-0 max-sm:bottom-0 max-sm:left-0 max-sm:max-w-full max-sm:translate-x-0 max-sm:translate-y-0 max-sm:rounded-b-none sm:max-w-sm`,children:[(0,s.jsxs)(n.DialogHeader,{children:[(0,s.jsx)(n.DialogTitle,{children:g}),(0,s.jsx)(n.DialogDescription,{children:_})]}),(0,s.jsxs)(`form`,{onSubmit:async e=>{e.preventDefault();let t=u.safeParse({email:b,password:S});if(!t.success){let e=t.error.flatten().fieldErrors;D({email:e.email?.[0],password:e.password?.[0]});return}D({}),await d(b,S)},noValidate:!0,className:`flex flex-col gap-4`,children:[h&&(0,s.jsx)(r.t,{variant:`destructive`,children:(0,s.jsx)(r.n,{children:h})}),(0,s.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[(0,s.jsx)(a.Label,{htmlFor:v,children:`Email`}),(0,s.jsx)(i.Input,{id:v,type:`email`,autoComplete:`email`,placeholder:`you@example.com`,value:b,onChange:e=>x(e.target.value),"aria-invalid":!!E.email,disabled:m}),E.email&&(0,s.jsx)(`p`,{className:`text-destructive text-xs`,children:E.email})]}),(0,s.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[(0,s.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,s.jsx)(a.Label,{htmlFor:y,children:`Mật khẩu`}),f&&(0,s.jsx)(t.Button,{type:`button`,variant:`link`,size:`sm`,className:`h-auto p-0 text-xs`,onClick:f,children:`Quên mật khẩu?`})]}),(0,s.jsxs)(`div`,{className:`relative`,children:[(0,s.jsx)(i.Input,{id:y,type:w?`text`:`password`,autoComplete:`current-password`,placeholder:`••••••••`,value:S,onChange:e=>C(e.target.value),"aria-invalid":!!E.password,disabled:m,className:`pr-10`}),(0,s.jsx)(`button`,{type:`button`,className:`absolute inset-y-0 right-0 flex items-center px-3 text-muted-foreground hover:text-foreground`,onMouseDown:e=>{e.preventDefault(),T(e=>!e)},"aria-label":w?`Ẩn mật khẩu`:`Hiện mật khẩu`,children:w?(0,s.jsx)(o.EyeOff,{size:16}):(0,s.jsx)(o.Eye,{size:16})})]}),E.password&&(0,s.jsx)(`p`,{className:`text-destructive text-xs`,children:E.password})]}),(0,s.jsx)(t.Button,{type:`submit`,isLoading:m,className:`w-full`,children:`Đăng nhập`}),(0,s.jsx)(t.Button,{type:`button`,variant:`outline`,className:`w-full`,disabled:m,onClick:()=>l(!1),children:`Đóng hộp thoại`})]}),p&&(0,s.jsxs)(`div`,{className:`flex justify-center gap-1 text-muted-foreground text-sm`,children:[(0,s.jsx)(`span`,{children:`Chưa có tài khoản?`}),(0,s.jsx)(t.Button,{variant:`link`,size:`sm`,className:`h-auto p-0`,onClick:p,children:`Đăng ký`})]})]})})};exports.LoginPage=d;
+"use client";const e=require(`../chunk-350yNsax.cjs`);require(`../button.variants-4kw6plrv.cjs`);const t=require(`../button-C--DAN1D.cjs`);require(`../heading-tGTqk3pA.cjs`),require(`../paragraph-DvTZvbzw.cjs`),require(`../close-Dlo1bI8x.cjs`);const n=require(`../dialog-BigPrWIj.cjs`),r=require(`../input-WJ0DLHTR.cjs`),i=require(`../label-CC6fXVbC.cjs`),a=require(`../alert-B2PaDJp6.cjs`);let o=require(`lucide-react`),s=require(`react`),c=require(`react/jsx-runtime`),l=require(`zod`);const u=l.z.object({email:l.z.string().min(1,`Vui lòng nhập email`).email(`Email không hợp lệ`),password:l.z.string().min(1,`Vui lòng nhập mật khẩu`)}),d=({open:e,onOpenChange:l,onLogin:d,onForgotPassword:f,onRegister:p,isLoading:m=!1,errorMessage:h,title:g=`Đăng nhập`,subtitle:_=`Nhập thông tin để tiếp tục`})=>{let v=(0,s.useId)(),y=(0,s.useId)(),[b,x]=(0,s.useState)(``),[S,C]=(0,s.useState)(``),[w,T]=(0,s.useState)(!1),[E,D]=(0,s.useState)({});return(0,c.jsx)(n.t,{open:e,onOpenChange:l,children:(0,c.jsxs)(n.r,{className:`max-sm:data-[state=open]:slide-in-from-bottom max-sm:data-[state=open]:zoom-in-100 max-sm:data-[state=closed]:slide-out-to-bottom max-sm:data-[state=closed]:zoom-out-100 max-sm:top-auto max-sm:right-0 max-sm:bottom-0 max-sm:left-0 max-sm:max-w-full max-sm:translate-x-0 max-sm:translate-y-0 max-sm:rounded-b-none sm:max-w-sm`,children:[(0,c.jsxs)(n.o,{children:[(0,c.jsx)(n.l,{children:g}),(0,c.jsx)(n.i,{children:_})]}),(0,c.jsxs)(`form`,{onSubmit:async e=>{e.preventDefault();let t=u.safeParse({email:b,password:S});if(!t.success){let e=t.error.flatten().fieldErrors;D({email:e.email?.[0],password:e.password?.[0]});return}D({}),await d(b,S)},noValidate:!0,className:`flex flex-col gap-4`,children:[h&&(0,c.jsx)(a.t,{variant:`destructive`,children:(0,c.jsx)(a.n,{children:h})}),(0,c.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[(0,c.jsx)(i.t,{htmlFor:v,children:`Email`}),(0,c.jsx)(r.t,{id:v,type:`email`,autoComplete:`email`,placeholder:`you@example.com`,value:b,onChange:e=>x(e.target.value),"aria-invalid":!!E.email,disabled:m}),E.email&&(0,c.jsx)(`p`,{className:`text-destructive text-xs`,children:E.email})]}),(0,c.jsxs)(`div`,{className:`flex flex-col gap-1.5`,children:[(0,c.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,c.jsx)(i.t,{htmlFor:y,children:`Mật khẩu`}),f&&(0,c.jsx)(t.t,{type:`button`,variant:`link`,size:`sm`,className:`h-auto p-0 text-xs`,onClick:f,children:`Quên mật khẩu?`})]}),(0,c.jsxs)(`div`,{className:`relative`,children:[(0,c.jsx)(r.t,{id:y,type:w?`text`:`password`,autoComplete:`current-password`,placeholder:`••••••••`,value:S,onChange:e=>C(e.target.value),"aria-invalid":!!E.password,disabled:m,className:`pr-10`}),(0,c.jsx)(`button`,{type:`button`,className:`absolute inset-y-0 right-0 flex items-center px-3 text-muted-foreground hover:text-foreground`,onMouseDown:e=>{e.preventDefault(),T(e=>!e)},"aria-label":w?`Ẩn mật khẩu`:`Hiện mật khẩu`,children:w?(0,c.jsx)(o.EyeOff,{size:16}):(0,c.jsx)(o.Eye,{size:16})})]}),E.password&&(0,c.jsx)(`p`,{className:`text-destructive text-xs`,children:E.password})]}),(0,c.jsx)(t.t,{type:`submit`,isLoading:m,className:`w-full`,children:`Đăng nhập`}),(0,c.jsx)(t.t,{type:`button`,variant:`outline`,className:`w-full`,disabled:m,onClick:()=>l(!1),children:`Đóng hộp thoại`})]}),p&&(0,c.jsxs)(`div`,{className:`flex justify-center gap-1 text-muted-foreground text-sm`,children:[(0,c.jsx)(`span`,{children:`Chưa có tài khoản?`}),(0,c.jsx)(t.t,{variant:`link`,size:`sm`,className:`h-auto p-0`,onClick:p,children:`Đăng ký`})]})]})})};exports.LoginPage=d;
 //# sourceMappingURL=LoginPage.cjs.map

package/dist/pages/LoginPage.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"LoginPage.cjs","names":["z","Dialog","DialogContent","DialogHeader","DialogTitle","DialogDescription","Alert","AlertDescription","Label","Input","Button","EyeOff","Eye"],"sources":["../../packages/components/pages/LoginPage.tsx"],"sourcesContent":["'use client';\n\nimport { useId, useState } from 'react';\n\nimport { Eye, EyeOff } from 'lucide-react';\nimport { z } from 'zod';\n\nimport { Alert, AlertDescription } from '../ui/alert';\nimport { Button } from '../ui/button';\nimport { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from '../ui/dialog';\nimport { Input } from '../ui/input';\nimport { Label } from '../ui/label';\n\nexport interface LoginPageProps {\n  /** Controls whether the dialog is open */\n  open: boolean;\n  /** Called when the dialog open state changes */\n  onOpenChange: (open: boolean) => void;\n  /** Called when the user submits login credentials */\n  onLogin: (email: string, password: string) => Promise<void> | void;\n  /** Called when the \"Quên mật khẩu?\" link is clicked */\n  onForgotPassword?: () => void;\n  /** Called when the \"Đăng ký\" link is clicked */\n  onRegister?: () => void;\n  /** Disables the form and shows a spinner on the submit button */\n  isLoading?: boolean;\n  /** Server-side error message rendered in a destructive Alert */\n  errorMessage?: string;\n  /** Dialog heading. Default: \"Đăng nhập\" */\n  title?: string;\n  /** Dialog subheading. Default: \"Nhập thông tin để tiếp tục\" */\n  subtitle?: string;\n}\n\nconst loginSchema = z.object({\n  email: z.string().min(1, 'Vui lòng nhập email').email('Email không hợp lệ'),\n  password: z.string().min(1, 'Vui lòng nhập mật khẩu'),\n});\n\n/**\n * Modal login dialog for the client authentication flow.\n *\n * @example\n * ```tsx\n * import { LoginPage } from '@customafk/lunas-ui/pages/LoginPage';\n *\n * <LoginPage\n *   open={open}\n *   onOpenChange={setOpen}\n *   onLogin={async (email, password) => {\n *     await authService.login(email, password);\n *     setOpen(false);\n *   }}\n *   onRegister={() => { setOpen(false); setRegisterOpen(true); }}\n * />\n * ```\n */\nexport const LoginPage = ({\n  open,\n  onOpenChange,\n  onLogin,\n  onForgotPassword,\n  onRegister,\n  isLoading = false,\n  errorMessage,\n  title = 'Đăng nhập',\n  subtitle = 'Nhập thông tin để tiếp tục',\n}: LoginPageProps) => {\n  const emailId = useId();\n  const passwordId = useId();\n  const [email, setEmail] = useState('');\n  const [password, setPassword] = useState('');\n  const [showPassword, setShowPassword] = useState(false);\n  const [fieldErrors, setFieldErrors] = useState<{ email?: string; password?: string }>({});\n\n  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {\n    e.preventDefault();\n    const result = loginSchema.safeParse({ email, password });\n    if (!result.success) {\n      const errors = result.error.flatten().fieldErrors;\n      setFieldErrors({ email: errors.email?.[0], password: errors.password?.[0] });\n      return;\n    }\n    setFieldErrors({});\n    await onLogin(email, password);\n  };\n\n  return (\n    <Dialog open={open} onOpenChange={onOpenChange}>\n      <DialogContent className=\"max-sm:data-[state=open]:slide-in-from-bottom max-sm:data-[state=open]:zoom-in-100 max-sm:data-[state=closed]:slide-out-to-bottom max-sm:data-[state=closed]:zoom-out-100 max-sm:top-auto max-sm:right-0 max-sm:bottom-0 max-sm:left-0 max-sm:max-w-full max-sm:translate-x-0 max-sm:translate-y-0 max-sm:rounded-b-none sm:max-w-sm\">\n        <DialogHeader>\n          <DialogTitle>{title}</DialogTitle>\n          <DialogDescription>{subtitle}</DialogDescription>\n        </DialogHeader>\n\n        <form onSubmit={handleSubmit} noValidate className=\"flex flex-col gap-4\">\n          {errorMessage && (\n            <Alert variant=\"destructive\">\n              <AlertDescription>{errorMessage}</AlertDescription>\n            </Alert>\n          )}\n\n          <div className=\"flex flex-col gap-1.5\">\n            <Label htmlFor={emailId}>Email</Label>\n            <Input\n              id={emailId}\n              type=\"email\"\n              autoComplete=\"email\"\n              placeholder=\"you@example.com\"\n              value={email}\n              onChange={e => setEmail(e.target.value)}\n              aria-invalid={!!fieldErrors.email}\n              disabled={isLoading}\n            />\n            {fieldErrors.email && <p className=\"text-destructive text-xs\">{fieldErrors.email}</p>}\n          </div>\n\n          <div className=\"flex flex-col gap-1.5\">\n            <div className=\"flex items-center justify-between\">\n              <Label htmlFor={passwordId}>Mật khẩu</Label>\n              {onForgotPassword && (\n                <Button type=\"button\" variant=\"link\" size=\"sm\" className=\"h-auto p-0 text-xs\" onClick={onForgotPassword}>\n                  Quên mật khẩu?\n                </Button>\n              )}\n            </div>\n            <div className=\"relative\">\n              <Input\n                id={passwordId}\n                type={showPassword ? 'text' : 'password'}\n                autoComplete=\"current-password\"\n                placeholder=\"••••••••\"\n                value={password}\n                onChange={e => setPassword(e.target.value)}\n                aria-invalid={!!fieldErrors.password}\n                disabled={isLoading}\n                className=\"pr-10\"\n              />\n              <button\n                type=\"button\"\n                className=\"absolute inset-y-0 right-0 flex items-center px-3 text-muted-foreground hover:text-foreground\"\n                onMouseDown={e => {\n                  e.preventDefault();\n                  setShowPassword(v => !v);\n                }}\n                aria-label={showPassword ? 'Ẩn mật khẩu' : 'Hiện mật khẩu'}\n              >\n                {showPassword ? <EyeOff size={16} /> : <Eye size={16} />}\n              </button>\n            </div>\n            {fieldErrors.password && <p className=\"text-destructive text-xs\">{fieldErrors.password}</p>}\n          </div>\n\n          <Button type=\"submit\" isLoading={isLoading} className=\"w-full\">\n            Đăng nhập\n          </Button>\n          <Button type=\"button\" variant=\"outline\" className=\"w-full\" disabled={isLoading} onClick={() => onOpenChange(false)}>\n            Đóng hộp thoại\n          </Button>\n        </form>\n\n        {onRegister && (\n          <div className=\"flex justify-center gap-1 text-muted-foreground text-sm\">\n            <span>Chưa có tài khoản?</span>\n            <Button variant=\"link\" size=\"sm\" className=\"h-auto p-0\" onClick={onRegister}>\n              Đăng ký\n            </Button>\n          </div>\n        )}\n      </DialogContent>\n    </Dialog>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"LoginPage.cjs","names":["z","Dialog","DialogContent","DialogHeader","DialogTitle","DialogDescription","Alert","AlertDescription","Label","Input","Button","EyeOff","Eye"],"sources":["../../packages/components/pages/LoginPage.tsx"],"sourcesContent":["'use client';\n\nimport { useId, useState } from 'react';\n\nimport { Eye, EyeOff } from 'lucide-react';\nimport { z } from 'zod';\n\nimport { Alert, AlertDescription } from '../ui/alert';\nimport { Button } from '../ui/button';\nimport { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from '../ui/dialog';\nimport { Input } from '../ui/input';\nimport { Label } from '../ui/label';\n\nexport interface LoginPageProps {\n  /** Controls whether the dialog is open */\n  open: boolean;\n  /** Called when the dialog open state changes */\n  onOpenChange: (open: boolean) => void;\n  /** Called when the user submits login credentials */\n  onLogin: (email: string, password: string) => Promise<void> | void;\n  /** Called when the \"Quên mật khẩu?\" link is clicked */\n  onForgotPassword?: () => void;\n  /** Called when the \"Đăng ký\" link is clicked */\n  onRegister?: () => void;\n  /** Disables the form and shows a spinner on the submit button */\n  isLoading?: boolean;\n  /** Server-side error message rendered in a destructive Alert */\n  errorMessage?: string;\n  /** Dialog heading. Default: \"Đăng nhập\" */\n  title?: string;\n  /** Dialog subheading. Default: \"Nhập thông tin để tiếp tục\" */\n  subtitle?: string;\n}\n\nconst loginSchema = z.object({\n  email: z.string().min(1, 'Vui lòng nhập email').email('Email không hợp lệ'),\n  password: z.string().min(1, 'Vui lòng nhập mật khẩu'),\n});\n\n/**\n * Modal login dialog for the client authentication flow.\n *\n * @example\n * ```tsx\n * import { LoginPage } from '@customafk/lunas-ui/pages/LoginPage';\n *\n * <LoginPage\n *   open={open}\n *   onOpenChange={setOpen}\n *   onLogin={async (email, password) => {\n *     await authService.login(email, password);\n *     setOpen(false);\n *   }}\n *   onRegister={() => { setOpen(false); setRegisterOpen(true); }}\n * />\n * ```\n */\nexport const LoginPage = ({\n  open,\n  onOpenChange,\n  onLogin,\n  onForgotPassword,\n  onRegister,\n  isLoading = false,\n  errorMessage,\n  title = 'Đăng nhập',\n  subtitle = 'Nhập thông tin để tiếp tục',\n}: LoginPageProps) => {\n  const emailId = useId();\n  const passwordId = useId();\n  const [email, setEmail] = useState('');\n  const [password, setPassword] = useState('');\n  const [showPassword, setShowPassword] = useState(false);\n  const [fieldErrors, setFieldErrors] = useState<{ email?: string; password?: string }>({});\n\n  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {\n    e.preventDefault();\n    const result = loginSchema.safeParse({ email, password });\n    if (!result.success) {\n      const errors = result.error.flatten().fieldErrors;\n      setFieldErrors({ email: errors.email?.[0], password: errors.password?.[0] });\n      return;\n    }\n    setFieldErrors({});\n    await onLogin(email, password);\n  };\n\n  return (\n    <Dialog open={open} onOpenChange={onOpenChange}>\n      <DialogContent className=\"max-sm:data-[state=open]:slide-in-from-bottom max-sm:data-[state=open]:zoom-in-100 max-sm:data-[state=closed]:slide-out-to-bottom max-sm:data-[state=closed]:zoom-out-100 max-sm:top-auto max-sm:right-0 max-sm:bottom-0 max-sm:left-0 max-sm:max-w-full max-sm:translate-x-0 max-sm:translate-y-0 max-sm:rounded-b-none sm:max-w-sm\">\n        <DialogHeader>\n          <DialogTitle>{title}</DialogTitle>\n          <DialogDescription>{subtitle}</DialogDescription>\n        </DialogHeader>\n\n        <form onSubmit={handleSubmit} noValidate className=\"flex flex-col gap-4\">\n          {errorMessage && (\n            <Alert variant=\"destructive\">\n              <AlertDescription>{errorMessage}</AlertDescription>\n            </Alert>\n          )}\n\n          <div className=\"flex flex-col gap-1.5\">\n            <Label htmlFor={emailId}>Email</Label>\n            <Input\n              id={emailId}\n              type=\"email\"\n              autoComplete=\"email\"\n              placeholder=\"you@example.com\"\n              value={email}\n              onChange={e => setEmail(e.target.value)}\n              aria-invalid={!!fieldErrors.email}\n              disabled={isLoading}\n            />\n            {fieldErrors.email && <p className=\"text-destructive text-xs\">{fieldErrors.email}</p>}\n          </div>\n\n          <div className=\"flex flex-col gap-1.5\">\n            <div className=\"flex items-center justify-between\">\n              <Label htmlFor={passwordId}>Mật khẩu</Label>\n              {onForgotPassword && (\n                <Button type=\"button\" variant=\"link\" size=\"sm\" className=\"h-auto p-0 text-xs\" onClick={onForgotPassword}>\n                  Quên mật khẩu?\n                </Button>\n              )}\n            </div>\n            <div className=\"relative\">\n              <Input\n                id={passwordId}\n                type={showPassword ? 'text' : 'password'}\n                autoComplete=\"current-password\"\n                placeholder=\"••••••••\"\n                value={password}\n                onChange={e => setPassword(e.target.value)}\n                aria-invalid={!!fieldErrors.password}\n                disabled={isLoading}\n                className=\"pr-10\"\n              />\n              <button\n                type=\"button\"\n                className=\"absolute inset-y-0 right-0 flex items-center px-3 text-muted-foreground hover:text-foreground\"\n                onMouseDown={e => {\n                  e.preventDefault();\n                  setShowPassword(v => !v);\n                }}\n                aria-label={showPassword ? 'Ẩn mật khẩu' : 'Hiện mật khẩu'}\n              >\n                {showPassword ? <EyeOff size={16} /> : <Eye size={16} />}\n              </button>\n            </div>\n            {fieldErrors.password && <p className=\"text-destructive text-xs\">{fieldErrors.password}</p>}\n          </div>\n\n          <Button type=\"submit\" isLoading={isLoading} className=\"w-full\">\n            Đăng nhập\n          </Button>\n          <Button type=\"button\" variant=\"outline\" className=\"w-full\" disabled={isLoading} onClick={() => onOpenChange(false)}>\n            Đóng hộp thoại\n          </Button>\n        </form>\n\n        {onRegister && (\n          <div className=\"flex justify-center gap-1 text-muted-foreground text-sm\">\n            <span>Chưa có tài khoản?</span>\n            <Button variant=\"link\" size=\"sm\" className=\"h-auto p-0\" onClick={onRegister}>\n              Đăng ký\n            </Button>\n          </div>\n        )}\n      </DialogContent>\n    </Dialog>\n  );\n};\n"],"mappings":"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"}

package/dist/pages/LoginPage.d.cts

@@ -1,4 +1,4 @@
-import * as react3 from "react";
+import * as react28 from "react";
 
 //#region packages/components/pages/LoginPage.d.ts
 interface LoginPageProps {
@@ -49,7 +49,7 @@ declare const LoginPage: ({
   errorMessage,
   title,
   subtitle
-}: LoginPageProps) => react3.JSX.Element;
+}: LoginPageProps) => react28.JSX.Element;
 //#endregion
 export { LoginPage, LoginPageProps };
 //# sourceMappingURL=LoginPage.d.cts.map