@customafk/lunas-ui 0.2.65 → 0.2.67

package/dist/layouts/flex.d.cts

@@ -1,114 +1,2 @@
-import { VariantProps } from "class-variance-authority";
-
-//#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?: "xs" | "sm" | "md" | "lg" | "xl" | "none" | null | undefined;
-  justify?: "start" | "center" | "end" | "between" | "around" | "evenly" | "stretch" | null | undefined;
-  align?: "start" | "center" | "end" | "stretch" | "baseline" | null | undefined;
-} & import("class-variance-authority/types").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: import("react").MemoExoticComponent<({
-  vertical,
-  wrap,
-  width,
-  margin,
-  padding,
-  gap,
-  justify,
-  align,
-  className,
-  children
-}: React.PropsWithChildren<Props>) => import("react").JSX.Element>;
-//#endregion
-export { Flex };
-//# sourceMappingURL=flex.d.cts.map
+import { t as Flex } from "../flex-bw7U4hXn.cjs";
+export { Flex };

package/dist/layouts/flex.d.mts

@@ -1,114 +1,2 @@
-import { VariantProps } from "class-variance-authority";
-
-//#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?: "xs" | "sm" | "md" | "lg" | "xl" | "none" | null | undefined;
-  justify?: "start" | "center" | "end" | "between" | "around" | "evenly" | "stretch" | null | undefined;
-  align?: "start" | "center" | "end" | "stretch" | "baseline" | null | undefined;
-} & import("class-variance-authority/types").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: import("react").MemoExoticComponent<({
-  vertical,
-  wrap,
-  width,
-  margin,
-  padding,
-  gap,
-  justify,
-  align,
-  className,
-  children
-}: React.PropsWithChildren<Props>) => import("react").JSX.Element>;
-//#endregion
-export { Flex };
-//# sourceMappingURL=flex.d.mts.map
+import { t as Flex } from "../flex-bw7U4hXn.mjs";
+export { Flex };

package/dist/layouts/grid.d.cts

@@ -1,19 +1,2 @@
-//#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.cts.map
+import { t as Grid } from "../grid-i7Oz2Izf.cjs";
+export { Grid };

package/dist/layouts/grid.d.mts

@@ -1,19 +1,2 @@
-//#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
+import { t as Grid } from "../grid-i7Oz2Izf.mjs";
+export { Grid };

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

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../payment-layout-BLrXT-oc.cjs");exports.PaymentLayout=e.t;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../payment-layout-Cb-Q8KD2.cjs");exports.PaymentLayout=e.t;

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

@@ -1,59 +1,2 @@
-//#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.cts.map
+import { n as PaymentLayoutUser, t as PaymentLayout } from "../../index-DJiiPHPf.cjs";
+export { PaymentLayout, PaymentLayoutUser };

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

@@ -1,59 +1,2 @@
-//#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
+import { n as PaymentLayoutUser, t as PaymentLayout } from "../../index-DJiiPHPf.mjs";
+export { PaymentLayout, PaymentLayoutUser };

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

@@ -1 +1 @@
-import{t as e}from"../../payment-layout-Dsz6wYT1.mjs";export{e as PaymentLayout};
+import{t as e}from"../../payment-layout-DS5CEH1h.mjs";export{e as PaymentLayout};

package/dist/list-display-8Jx6G5nk.mjs

@@ -0,0 +1,2 @@
+import{Tooltip as e,TooltipContent as t,TooltipProvider as n,TooltipTrigger as r}from"./ui/tooltip.mjs";import{Y as i}from"./tables-9d53sH9E.mjs";import{jsx as a,jsxs as o}from"react/jsx-runtime";const s=({items:s,maxVisible:c=3})=>{if(!s||s.length===0)return a(i,{});let l=s.slice(0,c),u=s.slice(c);return o(`div`,{className:`flex flex-wrap gap-1`,children:[l.map((e,t)=>a(`span`,{className:`inline-flex items-center rounded-full border border-border bg-muted-weak px-2 py-0.5 text-text-positive text-xs`,children:e},t)),u.length>0&&a(n,{children:o(e,{children:[a(r,{asChild:!0,children:o(`span`,{className:`inline-flex cursor-default items-center rounded-full bg-primary-bg-subtle px-2 py-0.5 text-primary-intense text-xs`,children:[`+`,u.length,` more`]})}),a(t,{align:`start`,className:`flex max-w-64 flex-wrap gap-1 p-2`,children:u.map((e,t)=>a(`span`,{className:`inline-flex items-center rounded-full border border-border px-2 py-0.5 text-text-negative text-xs`,children:e},t))})]})})]})};export{s as UITableListDisplay};
+//# sourceMappingURL=list-display-8Jx6G5nk.mjs.map

package/dist/list-display-8Jx6G5nk.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"list-display-8Jx6G5nk.mjs","names":[],"sources":["../packages/components/features/tables/components/atoms/list-display.tsx"],"sourcesContent":["'use client';\n\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';\nimport { UITableEmpty } from './empty';\n\n/** Props for the {@link UITableListDisplay} component. */\ntype Props = {\n  /** Array of strings or numbers to render as inline pills. */\n  items: (string | number)[] | null | undefined;\n  /**\n   * Maximum number of pills shown before a `+N more` overflow badge appears\n   * (default: `3`).\n   */\n  maxVisible?: number;\n};\n\n/**\n * Renders an array of values as compact inline pills in a table cell.  When the\n * list exceeds `maxVisible`, a `+N more` badge is shown; hovering it reveals all\n * remaining items in a tooltip.  Renders {@link UITableEmpty} for empty or absent\n * arrays.\n *\n * @example\n * import { UITableListDisplay } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableListDisplay items={['React', 'TypeScript', 'TailwindCSS', 'Vite']} maxVisible={3} />\n */\nexport const UITableListDisplay: React.FC<Props> = ({ items, maxVisible = 3 }) => {\n  if (!items || items.length === 0) return <UITableEmpty />;\n\n  const visible = items.slice(0, maxVisible);\n  const overflow = items.slice(maxVisible);\n\n  return (\n    <div className=\"flex flex-wrap gap-1\">\n      {visible.map((item, i) => (\n        <span key={i} className=\"inline-flex items-center rounded-full border border-border bg-muted-weak px-2 py-0.5 text-text-positive text-xs\">\n          {item}\n        </span>\n      ))}\n\n      {overflow.length > 0 && (\n        <TooltipProvider>\n          <Tooltip>\n            <TooltipTrigger asChild>\n              <span className=\"inline-flex cursor-default items-center rounded-full bg-primary-bg-subtle px-2 py-0.5 text-primary-intense text-xs\">\n                +{overflow.length} more\n              </span>\n            </TooltipTrigger>\n            <TooltipContent align=\"start\" className=\"flex max-w-64 flex-wrap gap-1 p-2\">\n              {overflow.map((item, i) => (\n                <span key={i} className=\"inline-flex items-center rounded-full border border-border px-2 py-0.5 text-text-negative text-xs\">\n                  {item}\n                </span>\n              ))}\n            </TooltipContent>\n          </Tooltip>\n        </TooltipProvider>\n      )}\n    </div>\n  );\n};\n"],"mappings":"oMA2BA,MAAa,GAAuC,CAAE,QAAO,aAAa,KAAQ,CAChF,GAAI,CAAC,GAAS,EAAM,SAAW,EAAG,OAAO,EAAC,EAAD,CAAe,CAAA,EAExD,IAAM,EAAU,EAAM,MAAM,EAAG,CAAU,EACnC,EAAW,EAAM,MAAM,CAAU,EAEvC,OACE,EAAC,MAAD,CAAK,UAAU,gCAAf,CACG,EAAQ,KAAK,EAAM,IAClB,EAAC,OAAD,CAAc,UAAU,2HACrB,CACG,EAFK,CAEL,CACP,EAEA,EAAS,OAAS,GACjB,EAAC,EAAD,CAAA,SACE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAgB,QAAA,YACd,EAAC,OAAD,CAAM,UAAU,8HAAhB,CAAqI,IACjI,EAAS,OAAO,OACd,GACQ,CAAA,EAChB,EAAC,EAAD,CAAgB,MAAM,QAAQ,UAAU,6CACrC,EAAS,KAAK,EAAM,IACnB,EAAC,OAAD,CAAc,UAAU,6GACrB,CACG,EAFK,CAEL,CACP,CACa,CAAA,CACT,CAAA,CAAA,CACM,CAAA,CAEhB,GAET"}

package/dist/list-display-BQjNDttz.cjs

@@ -0,0 +1,2 @@
+const e=require("./ui/tooltip.cjs"),t=require("./tables-B1O9qy-m.cjs");let n=require("react/jsx-runtime");const r=({items:r,maxVisible:i=3})=>{if(!r||r.length===0)return(0,n.jsx)(t.Y,{});let a=r.slice(0,i),o=r.slice(i);return(0,n.jsxs)(`div`,{className:`flex flex-wrap gap-1`,children:[a.map((e,t)=>(0,n.jsx)(`span`,{className:`inline-flex items-center rounded-full border border-border bg-muted-weak px-2 py-0.5 text-text-positive text-xs`,children:e},t)),o.length>0&&(0,n.jsx)(e.TooltipProvider,{children:(0,n.jsxs)(e.Tooltip,{children:[(0,n.jsx)(e.TooltipTrigger,{asChild:!0,children:(0,n.jsxs)(`span`,{className:`inline-flex cursor-default items-center rounded-full bg-primary-bg-subtle px-2 py-0.5 text-primary-intense text-xs`,children:[`+`,o.length,` more`]})}),(0,n.jsx)(e.TooltipContent,{align:`start`,className:`flex max-w-64 flex-wrap gap-1 p-2`,children:o.map((e,t)=>(0,n.jsx)(`span`,{className:`inline-flex items-center rounded-full border border-border px-2 py-0.5 text-text-negative text-xs`,children:e},t))})]})})]})};exports.UITableListDisplay=r;
+//# sourceMappingURL=list-display-BQjNDttz.cjs.map

package/dist/list-display-BQjNDttz.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"list-display-BQjNDttz.cjs","names":["UITableEmpty","TooltipProvider","Tooltip","TooltipTrigger","TooltipContent"],"sources":["../packages/components/features/tables/components/atoms/list-display.tsx"],"sourcesContent":["'use client';\n\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';\nimport { UITableEmpty } from './empty';\n\n/** Props for the {@link UITableListDisplay} component. */\ntype Props = {\n  /** Array of strings or numbers to render as inline pills. */\n  items: (string | number)[] | null | undefined;\n  /**\n   * Maximum number of pills shown before a `+N more` overflow badge appears\n   * (default: `3`).\n   */\n  maxVisible?: number;\n};\n\n/**\n * Renders an array of values as compact inline pills in a table cell.  When the\n * list exceeds `maxVisible`, a `+N more` badge is shown; hovering it reveals all\n * remaining items in a tooltip.  Renders {@link UITableEmpty} for empty or absent\n * arrays.\n *\n * @example\n * import { UITableListDisplay } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableListDisplay items={['React', 'TypeScript', 'TailwindCSS', 'Vite']} maxVisible={3} />\n */\nexport const UITableListDisplay: React.FC<Props> = ({ items, maxVisible = 3 }) => {\n  if (!items || items.length === 0) return <UITableEmpty />;\n\n  const visible = items.slice(0, maxVisible);\n  const overflow = items.slice(maxVisible);\n\n  return (\n    <div className=\"flex flex-wrap gap-1\">\n      {visible.map((item, i) => (\n        <span key={i} className=\"inline-flex items-center rounded-full border border-border bg-muted-weak px-2 py-0.5 text-text-positive text-xs\">\n          {item}\n        </span>\n      ))}\n\n      {overflow.length > 0 && (\n        <TooltipProvider>\n          <Tooltip>\n            <TooltipTrigger asChild>\n              <span className=\"inline-flex cursor-default items-center rounded-full bg-primary-bg-subtle px-2 py-0.5 text-primary-intense text-xs\">\n                +{overflow.length} more\n              </span>\n            </TooltipTrigger>\n            <TooltipContent align=\"start\" className=\"flex max-w-64 flex-wrap gap-1 p-2\">\n              {overflow.map((item, i) => (\n                <span key={i} className=\"inline-flex items-center rounded-full border border-border px-2 py-0.5 text-text-negative text-xs\">\n                  {item}\n                </span>\n              ))}\n            </TooltipContent>\n          </Tooltip>\n        </TooltipProvider>\n      )}\n    </div>\n  );\n};\n"],"mappings":"0GA2BA,MAAa,GAAuC,CAAE,QAAO,aAAa,KAAQ,CAChF,GAAI,CAAC,GAAS,EAAM,SAAW,EAAG,OAAO,EAAA,EAAA,IAAA,CAACA,EAAAA,EAAD,CAAe,CAAA,EAExD,IAAM,EAAU,EAAM,MAAM,EAAG,CAAU,EACnC,EAAW,EAAM,MAAM,CAAU,EAEvC,OACE,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,gCAAf,CACG,EAAQ,KAAK,EAAM,KAClB,EAAA,EAAA,IAAA,CAAC,OAAD,CAAc,UAAU,2HACrB,CACG,EAFK,CAEL,CACP,EAEA,EAAS,OAAS,IACjB,EAAA,EAAA,IAAA,CAACC,EAAAA,gBAAD,CAAA,UACE,EAAA,EAAA,KAAA,CAACC,EAAAA,QAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,QAAA,aACd,EAAA,EAAA,KAAA,CAAC,OAAD,CAAM,UAAU,8HAAhB,CAAqI,IACjI,EAAS,OAAO,OACd,GACQ,CAAA,GAChB,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,MAAM,QAAQ,UAAU,6CACrC,EAAS,KAAK,EAAM,KACnB,EAAA,EAAA,IAAA,CAAC,OAAD,CAAc,UAAU,6GACrB,CACG,EAFK,CAEL,CACP,CACa,CAAA,CACT,CAAA,CAAA,CACM,CAAA,CAEhB,GAET"}

package/dist/loading-dialog-C73EJx9s.d.cts

@@ -0,0 +1,19 @@
+//#region packages/components/dialogs/loading-dialog.d.ts
+type LoadingDialogProps = {
+  /** Controls whether the dialog is open. */open?: boolean; /** Callback invoked when the dialog open state changes. */
+  onOpenChange?: (open: boolean) => void;
+};
+/**
+ * Displays a transparent, pointer-events-disabled modal overlay with a centered loading spinner.
+ *
+ * @example
+ * ```tsx
+ * import { LoadingDialog } from '@customafk/lunas-ui/dialogs/loading-dialog';
+ *
+ * <LoadingDialog open={isLoading} onOpenChange={setIsLoading} />
+ * ```
+ */
+declare const LoadingDialog: React.FC<LoadingDialogProps>;
+//#endregion
+export { LoadingDialogProps as n, LoadingDialog as t };
+//# sourceMappingURL=loading-dialog-C73EJx9s.d.cts.map

package/dist/loading-dialog-C73EJx9s.d.mts

@@ -0,0 +1,19 @@
+//#region packages/components/dialogs/loading-dialog.d.ts
+type LoadingDialogProps = {
+  /** Controls whether the dialog is open. */open?: boolean; /** Callback invoked when the dialog open state changes. */
+  onOpenChange?: (open: boolean) => void;
+};
+/**
+ * Displays a transparent, pointer-events-disabled modal overlay with a centered loading spinner.
+ *
+ * @example
+ * ```tsx
+ * import { LoadingDialog } from '@customafk/lunas-ui/dialogs/loading-dialog';
+ *
+ * <LoadingDialog open={isLoading} onOpenChange={setIsLoading} />
+ * ```
+ */
+declare const LoadingDialog: React.FC<LoadingDialogProps>;
+//#endregion
+export { LoadingDialogProps as n, LoadingDialog as t };
+//# sourceMappingURL=loading-dialog-C73EJx9s.d.mts.map

package/dist/menubar-CFrn3S96.d.cts

@@ -0,0 +1,133 @@
+import { Menubar } from "radix-ui";
+
+//#region packages/components/ui/menubar.d.ts
+/**
+ * A horizontal menu bar similar to a desktop application menu, composed of menus with dropdown content.
+ *
+ * @example
+ * ```tsx
+ * import {
+ *   Menubar, MenubarMenu, MenubarTrigger, MenubarContent,
+ *   MenubarItem, MenubarSeparator,
+ * } from '@customafk/lunas-ui/ui/menubar';
+ *
+ * <Menubar>
+ *   <MenubarMenu>
+ *     <MenubarTrigger>File</MenubarTrigger>
+ *     <MenubarContent>
+ *       <MenubarItem>New Window</MenubarItem>
+ *       <MenubarSeparator />
+ *       <MenubarItem>Exit</MenubarItem>
+ *     </MenubarContent>
+ *   </MenubarMenu>
+ * </Menubar>
+ * ```
+ */
+declare function Menubar$1({
+  className,
+  ...props
+}: React.ComponentProps<typeof Menubar.Root>): import("react").JSX.Element;
+/** Root container for a single drop-down menu entry within a Menubar. */
+declare function MenubarMenu({
+  ...props
+}: React.ComponentProps<typeof Menubar.Menu>): import("react").JSX.Element;
+/** Groups related MenubarItems under a shared logical section. */
+declare function MenubarGroup({
+  ...props
+}: React.ComponentProps<typeof Menubar.Group>): import("react").JSX.Element;
+/** Portals Menubar content outside the current DOM hierarchy. */
+declare function MenubarPortal({
+  ...props
+}: React.ComponentProps<typeof Menubar.Portal>): import("react").JSX.Element;
+/** Groups MenubarRadioItems so only one can be selected at a time. */
+declare function MenubarRadioGroup({
+  ...props
+}: React.ComponentProps<typeof Menubar.RadioGroup>): import("react").JSX.Element;
+/** Button in the Menubar that opens its associated MenubarContent dropdown. */
+declare function MenubarTrigger({
+  className,
+  ...props
+}: React.ComponentProps<typeof Menubar.Trigger>): import("react").JSX.Element;
+/** Animated floating panel that contains MenubarItems for a given MenubarMenu. */
+declare function MenubarContent({
+  className,
+  align,
+  alignOffset,
+  sideOffset,
+  ...props
+}: React.ComponentProps<typeof Menubar.Content>): import("react").JSX.Element;
+/**
+ * A single clickable row inside a MenubarContent.
+ *
+ * @param inset - When true, adds left padding to align with items that have icons.
+ * @param variant - Visual style: `'default'` or `'destructive'`.
+ */
+declare function MenubarItem({
+  className,
+  inset,
+  variant,
+  ...props
+}: React.ComponentProps<typeof Menubar.Item> & {
+  inset?: boolean;
+  variant?: 'default' | 'destructive';
+}): import("react").JSX.Element;
+/** A checkable menubar item that displays a checkmark when selected. */
+declare function MenubarCheckboxItem({
+  className,
+  children,
+  checked,
+  ...props
+}: React.ComponentProps<typeof Menubar.CheckboxItem>): import("react").JSX.Element;
+/** A radio-button menubar item; shows a filled circle when selected. */
+declare function MenubarRadioItem({
+  className,
+  children,
+  ...props
+}: React.ComponentProps<typeof Menubar.RadioItem>): import("react").JSX.Element;
+/**
+ * Non-interactive label used to describe a group of menubar items.
+ *
+ * @param inset - When true, adds left padding to align with inset items.
+ */
+declare function MenubarLabel({
+  className,
+  inset,
+  ...props
+}: React.ComponentProps<typeof Menubar.Label> & {
+  inset?: boolean;
+}): import("react").JSX.Element;
+/** Horizontal dividing line between groups of menubar items. */
+declare function MenubarSeparator({
+  className,
+  ...props
+}: React.ComponentProps<typeof Menubar.Separator>): import("react").JSX.Element;
+/** Displays a keyboard shortcut hint aligned to the right of a menubar item. */
+declare function MenubarShortcut({
+  className,
+  ...props
+}: React.ComponentProps<'span'>): import("react").JSX.Element;
+/** Root container for a nested sub-menu inside a Menubar dropdown. */
+declare function MenubarSub({
+  ...props
+}: React.ComponentProps<typeof Menubar.Sub>): import("react").JSX.Element;
+/**
+ * Menu item that reveals a nested MenubarSubContent on hover or activation.
+ *
+ * @param inset - When true, adds left padding to align with inset items.
+ */
+declare function MenubarSubTrigger({
+  className,
+  inset,
+  children,
+  ...props
+}: React.ComponentProps<typeof Menubar.SubTrigger> & {
+  inset?: boolean;
+}): import("react").JSX.Element;
+/** Floating panel that contains the items of a nested Menubar sub-menu. */
+declare function MenubarSubContent({
+  className,
+  ...props
+}: React.ComponentProps<typeof Menubar.SubContent>): import("react").JSX.Element;
+//#endregion
+export { MenubarItem as a, MenubarPortal as c, MenubarSeparator as d, MenubarShortcut as f, MenubarTrigger as g, MenubarSubTrigger as h, MenubarGroup as i, MenubarRadioGroup as l, MenubarSubContent as m, MenubarCheckboxItem as n, MenubarLabel as o, MenubarSub as p, MenubarContent as r, MenubarMenu as s, Menubar$1 as t, MenubarRadioItem as u };
+//# sourceMappingURL=menubar-CFrn3S96.d.cts.map