@customafk/lunas-ui 0.2.64 → 0.2.66

package/dist/title-BT9guhSU.d.cts

@@ -0,0 +1,41 @@
+import { JSX, ReactNode } from "react";
+
+//#region packages/components/typography/title.d.ts
+type TitleProps = {
+  /**
+   * Heading level that maps to the rendered HTML tag (`h1`–`h6`) and the corresponding
+   * typographic scale variant.
+   * - `1` — `text-3xl / md:text-4xl`, bold (default)
+   * - `2` — `text-2xl / md:text-3xl`, semibold
+   * - `3` — `text-xl / md:text-2xl`, semibold
+   * - `4` — `text-lg / md:text-xl`, semibold
+   * - `5` — `text-base / md:text-lg`, semibold
+   * - `6` — `text-sm / md:text-base`, semibold
+   * @default 1
+   */
+  level?: 1 | 2 | 3 | 4 | 5 | 6; /** Additional Tailwind classes merged with the variant classes. */
+  className?: string; /** Content rendered inside the heading element. */
+  children?: ReactNode;
+};
+/**
+ * A semantic heading component that renders the correct `h1`–`h6` element and applies a matched typographic scale.
+ *
+ * @example
+ * ```tsx
+ * import { Title } from '@customafk/lunas-ui/typography/title';
+ *
+ * // Page-level heading (renders <h1>)
+ * <Title level={1}>Welcome to Lunas</Title>
+ *
+ * // Section sub-heading (renders <h3>)
+ * <Title level={3}>Account Settings</Title>
+ * ```
+ */
+declare const Title: ({
+  level,
+  className,
+  children
+}: TitleProps) => JSX.Element;
+//#endregion
+export { TitleProps as n, Title as t };
+//# sourceMappingURL=title-BT9guhSU.d.cts.map

package/dist/title-BT9guhSU.d.mts

@@ -0,0 +1,41 @@
+import { JSX, ReactNode } from "react";
+
+//#region packages/components/typography/title.d.ts
+type TitleProps = {
+  /**
+   * Heading level that maps to the rendered HTML tag (`h1`–`h6`) and the corresponding
+   * typographic scale variant.
+   * - `1` — `text-3xl / md:text-4xl`, bold (default)
+   * - `2` — `text-2xl / md:text-3xl`, semibold
+   * - `3` — `text-xl / md:text-2xl`, semibold
+   * - `4` — `text-lg / md:text-xl`, semibold
+   * - `5` — `text-base / md:text-lg`, semibold
+   * - `6` — `text-sm / md:text-base`, semibold
+   * @default 1
+   */
+  level?: 1 | 2 | 3 | 4 | 5 | 6; /** Additional Tailwind classes merged with the variant classes. */
+  className?: string; /** Content rendered inside the heading element. */
+  children?: ReactNode;
+};
+/**
+ * A semantic heading component that renders the correct `h1`–`h6` element and applies a matched typographic scale.
+ *
+ * @example
+ * ```tsx
+ * import { Title } from '@customafk/lunas-ui/typography/title';
+ *
+ * // Page-level heading (renders <h1>)
+ * <Title level={1}>Welcome to Lunas</Title>
+ *
+ * // Section sub-heading (renders <h3>)
+ * <Title level={3}>Account Settings</Title>
+ * ```
+ */
+declare const Title: ({
+  level,
+  className,
+  children
+}: TitleProps) => JSX.Element;
+//#endregion
+export { TitleProps as n, Title as t };
+//# sourceMappingURL=title-BT9guhSU.d.mts.map

package/dist/title-field-84EnHPvl.mjs

@@ -0,0 +1,2 @@
+import{Field as e,FieldContent as t,FieldDescription as n,FieldGroup as r,FieldLegend as i,FieldNote as a,FieldSeparator as o}from"./field-BKyUqvzh.mjs";import{jsx as s,jsxs as c}from"react/jsx-runtime";const l=({title:l,description:u,helperText:d})=>c(r,{className:`gap-y-4 px-4`,children:[c(e,{className:`gap-0`,children:[c(t,{children:[s(i,{className:`mb-1`,children:l}),s(n,{children:u})]}),s(a,{isShow:!!d,children:d})]}),s(o,{})]});export{l as TanStackTitleField};
+//# sourceMappingURL=title-field-84EnHPvl.mjs.map

package/dist/title-field-84EnHPvl.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"title-field-84EnHPvl.mjs","names":[],"sources":["../packages/components/features/tanstack-form/components/forms/title-field.tsx"],"sourcesContent":["import { Field, FieldContent, FieldDescription, FieldGroup, FieldLegend, FieldNote, FieldSeparator } from '../ui/field';\n\n/**\n * Renders a standalone section title with an optional description and helper note, followed by a separator.\n *\n * @example\n * import { TanStackTitleField } from '@customafk/lunas-ui/features/tanstack-form';\n *\n * <TanStackTitleField\n *   title=\"Billing Address\"\n *   description=\"Provide the address associated with your payment method.\"\n *   helperText=\"Must match your bank records.\"\n * />\n */\nexport const TanStackTitleField: React.FC<{\n  /** The heading text rendered as a legend element. */\n  title: string;\n  /** Optional supplementary text displayed beneath the title. */\n  description?: string;\n  /** Optional helper note shown below the description area. */\n  helperText?: string;\n}> = ({ title, description, helperText }) => {\n  return (\n    <FieldGroup className=\"gap-y-4 px-4\">\n      <Field className=\"gap-0\">\n        <FieldContent>\n          <FieldLegend className=\"mb-1\">{title}</FieldLegend>\n          <FieldDescription>{description}</FieldDescription>\n        </FieldContent>\n        <FieldNote isShow={!!helperText}>{helperText}</FieldNote>\n      </Field>\n      <FieldSeparator />\n    </FieldGroup>\n  );\n};\n"],"mappings":"2MAcA,MAAa,GAOP,CAAE,QAAO,cAAa,gBAExB,EAAC,EAAD,CAAY,UAAU,wBAAtB,CACE,EAAC,EAAD,CAAO,UAAU,iBAAjB,CACE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAa,UAAU,gBAAQ,CAAmB,CAAA,EAClD,EAAC,EAAD,CAAA,SAAmB,CAA8B,CAAA,CACrC,CAAA,CAAA,EACd,EAAC,EAAD,CAAW,OAAQ,CAAC,CAAC,WAAa,CAAsB,CAAA,CACnD,IACP,EAAC,EAAD,CAAiB,CAAA,CACP"}

package/dist/title-field-CKxwzMOM.cjs

@@ -0,0 +1,2 @@
+const e=require("./field-BV5twmKA.cjs");let t=require("react/jsx-runtime");const n=({title:n,description:r,helperText:i})=>(0,t.jsxs)(e.FieldGroup,{className:`gap-y-4 px-4`,children:[(0,t.jsxs)(e.Field,{className:`gap-0`,children:[(0,t.jsxs)(e.FieldContent,{children:[(0,t.jsx)(e.FieldLegend,{className:`mb-1`,children:n}),(0,t.jsx)(e.FieldDescription,{children:r})]}),(0,t.jsx)(e.FieldNote,{isShow:!!i,children:i})]}),(0,t.jsx)(e.FieldSeparator,{})]});exports.TanStackTitleField=n;
+//# sourceMappingURL=title-field-CKxwzMOM.cjs.map

package/dist/title-field-CKxwzMOM.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"title-field-CKxwzMOM.cjs","names":["FieldGroup","Field","FieldContent","FieldLegend","FieldDescription","FieldNote","FieldSeparator"],"sources":["../packages/components/features/tanstack-form/components/forms/title-field.tsx"],"sourcesContent":["import { Field, FieldContent, FieldDescription, FieldGroup, FieldLegend, FieldNote, FieldSeparator } from '../ui/field';\n\n/**\n * Renders a standalone section title with an optional description and helper note, followed by a separator.\n *\n * @example\n * import { TanStackTitleField } from '@customafk/lunas-ui/features/tanstack-form';\n *\n * <TanStackTitleField\n *   title=\"Billing Address\"\n *   description=\"Provide the address associated with your payment method.\"\n *   helperText=\"Must match your bank records.\"\n * />\n */\nexport const TanStackTitleField: React.FC<{\n  /** The heading text rendered as a legend element. */\n  title: string;\n  /** Optional supplementary text displayed beneath the title. */\n  description?: string;\n  /** Optional helper note shown below the description area. */\n  helperText?: string;\n}> = ({ title, description, helperText }) => {\n  return (\n    <FieldGroup className=\"gap-y-4 px-4\">\n      <Field className=\"gap-0\">\n        <FieldContent>\n          <FieldLegend className=\"mb-1\">{title}</FieldLegend>\n          <FieldDescription>{description}</FieldDescription>\n        </FieldContent>\n        <FieldNote isShow={!!helperText}>{helperText}</FieldNote>\n      </Field>\n      <FieldSeparator />\n    </FieldGroup>\n  );\n};\n"],"mappings":"2EAcA,MAAa,GAOP,CAAE,QAAO,cAAa,iBAExB,EAAA,EAAA,KAAA,CAACA,EAAAA,WAAD,CAAY,UAAU,wBAAtB,EACE,EAAA,EAAA,KAAA,CAACC,EAAAA,MAAD,CAAO,UAAU,iBAAjB,EACE,EAAA,EAAA,KAAA,CAACC,EAAAA,aAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,YAAD,CAAa,UAAU,gBAAQ,CAAmB,CAAA,GAClD,EAAA,EAAA,IAAA,CAACC,EAAAA,iBAAD,CAAA,SAAmB,CAA8B,CAAA,CACrC,CAAA,CAAA,GACd,EAAA,EAAA,IAAA,CAACC,EAAAA,UAAD,CAAW,OAAQ,CAAC,CAAC,WAAa,CAAsB,CAAA,CACnD,KACP,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAiB,CAAA,CACP"}

package/dist/toggle-Bh4EazxT.d.cts

@@ -0,0 +1,30 @@
+import { VariantProps } from "class-variance-authority";
+import { Toggle } from "radix-ui";
+
+//#region packages/components/ui/toggle.d.ts
+declare const toggleVariants: (props?: ({
+  variant?: "default" | "outline" | null | undefined;
+  size?: "sm" | "lg" | "default" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+/**
+ * A two-state button that switches between pressed (`on`) and unpressed (`off`).
+ *
+ * @example
+ * ```tsx
+ * import { Toggle } from '@customafk/lunas-ui/ui/toggle';
+ * import { Bold } from 'lucide-react';
+ *
+ * <Toggle aria-label="Toggle bold" variant="outline">
+ *   <Bold />
+ * </Toggle>
+ * ```
+ */
+declare function Toggle$1({
+  className,
+  variant,
+  size,
+  ...props
+}: React.ComponentProps<typeof Toggle.Root> & VariantProps<typeof toggleVariants>): import("react").JSX.Element;
+//#endregion
+export { toggleVariants as n, Toggle$1 as t };
+//# sourceMappingURL=toggle-Bh4EazxT.d.cts.map

package/dist/toggle-Bh4EazxT.d.mts

@@ -0,0 +1,30 @@
+import { VariantProps } from "class-variance-authority";
+import { Toggle } from "radix-ui";
+
+//#region packages/components/ui/toggle.d.ts
+declare const toggleVariants: (props?: ({
+  variant?: "default" | "outline" | null | undefined;
+  size?: "sm" | "lg" | "default" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+/**
+ * A two-state button that switches between pressed (`on`) and unpressed (`off`).
+ *
+ * @example
+ * ```tsx
+ * import { Toggle } from '@customafk/lunas-ui/ui/toggle';
+ * import { Bold } from 'lucide-react';
+ *
+ * <Toggle aria-label="Toggle bold" variant="outline">
+ *   <Bold />
+ * </Toggle>
+ * ```
+ */
+declare function Toggle$1({
+  className,
+  variant,
+  size,
+  ...props
+}: React.ComponentProps<typeof Toggle.Root> & VariantProps<typeof toggleVariants>): import("react").JSX.Element;
+//#endregion
+export { toggleVariants as n, Toggle$1 as t };
+//# sourceMappingURL=toggle-Bh4EazxT.d.mts.map

package/dist/toggle-button-DNLtfjJC.mjs

@@ -0,0 +1,2 @@
+import{Tooltip as e,TooltipContent as t,TooltipTrigger as n}from"./ui/tooltip.mjs";import{Switch as r}from"./ui/switch.mjs";import{useCallback as i}from"react";import{jsx as a,jsxs as o}from"react/jsx-runtime";const s=({checked:s,titleOn:c,titleOff:l,disabled:u,onCheckedChange:d})=>{let f=i(async e=>{await d?.(e)},[d]);return o(e,{children:[a(n,{asChild:!0,children:a(`span`,{onClick:i(e=>{e.stopPropagation()},[]),children:a(r,{checked:s,disabled:u,onCheckedChange:f})})}),a(t,{children:a(`p`,{children:s?c||`Turn off`:l||`Turn on`})})]})};export{s as UITableToggleButton};
+//# sourceMappingURL=toggle-button-DNLtfjJC.mjs.map

package/dist/toggle-button-DNLtfjJC.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"toggle-button-DNLtfjJC.mjs","names":[],"sources":["../packages/components/features/tables/components/atoms/toggle-button.tsx"],"sourcesContent":["'use client';\nimport { useCallback } from 'react';\n\nimport { Switch } from '@/components/ui/switch';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';\n\n/**\n * An on/off toggle switch for table row action columns.\n * Wraps the `Switch` primitive with a tooltip and stops row-click propagation.\n *\n * @example\n * import { UITableToggleButton } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableToggleButton\n *   checked={row.isActive}\n *   titleOn=\"Deactivate account\"\n *   titleOff=\"Activate account\"\n *   onCheckedChange={(checked) => updateStatus(rowId, checked)}\n * />\n */\nexport const UITableToggleButton: React.FC<{\n  /** Current on/off state of the switch. */\n  checked?: boolean;\n  /** Tooltip shown when the switch is currently ON (describes the toggle-off action). */\n  titleOn?: string;\n  /** Tooltip shown when the switch is currently OFF (describes the toggle-on action). */\n  titleOff?: string;\n  /** Whether the switch is disabled. */\n  disabled?: boolean;\n  /** Called with the new boolean value after the user flips the switch. */\n  onCheckedChange?: (checked: boolean) => void | Promise<void>;\n}> = ({ checked, titleOn, titleOff, disabled, onCheckedChange }) => {\n  const handleCheckedChange = useCallback(\n    async (value: boolean) => {\n      await onCheckedChange?.(value);\n    },\n    [onCheckedChange]\n  );\n\n  const handleClick = useCallback<React.MouseEventHandler<HTMLButtonElement>>(e => {\n    e.stopPropagation();\n  }, []);\n\n  const tooltip = checked ? titleOn || 'Turn off' : titleOff || 'Turn on';\n\n  return (\n    <Tooltip>\n      <TooltipTrigger asChild>\n        <span onClick={handleClick}>\n          <Switch checked={checked} disabled={disabled} onCheckedChange={handleCheckedChange} />\n        </span>\n      </TooltipTrigger>\n      <TooltipContent>\n        <p>{tooltip}</p>\n      </TooltipContent>\n    </Tooltip>\n  );\n};\n"],"mappings":"kNAoBA,MAAa,GAWP,CAAE,UAAS,UAAS,WAAU,WAAU,qBAAsB,CAClE,IAAM,EAAsB,EAC1B,KAAO,IAAmB,CACxB,MAAM,IAAkB,CAAK,CAC/B,EACA,CAAC,CAAe,CAClB,EAQA,OACE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAgB,QAAA,YACd,EAAC,OAAD,CAAM,QATQ,EAAwD,GAAK,CAC/E,EAAE,gBAAgB,CACpB,EAAG,CAAC,CAO2B,WACvB,EAAC,EAAD,CAAiB,UAAmB,WAAU,gBAAiB,CAAsB,CAAA,CACjF,CAAA,CACQ,CAAA,EAChB,EAAC,EAAD,CAAA,SACE,EAAC,IAAD,CAAA,SAVU,EAAU,GAAW,WAAa,GAAY,SAUzC,CAAA,CACD,CAAA,CACT,CAAA,CAAA,CAEb"}

package/dist/toggle-button-Dq78v8cH.cjs

@@ -0,0 +1,2 @@
+const e=require("./ui/tooltip.cjs"),t=require("./ui/switch.cjs");let n=require("react"),r=require("react/jsx-runtime");const i=({checked:i,titleOn:a,titleOff:o,disabled:s,onCheckedChange:c})=>{let l=(0,n.useCallback)(async e=>{await c?.(e)},[c]);return(0,r.jsxs)(e.Tooltip,{children:[(0,r.jsx)(e.TooltipTrigger,{asChild:!0,children:(0,r.jsx)(`span`,{onClick:(0,n.useCallback)(e=>{e.stopPropagation()},[]),children:(0,r.jsx)(t.Switch,{checked:i,disabled:s,onCheckedChange:l})})}),(0,r.jsx)(e.TooltipContent,{children:(0,r.jsx)(`p`,{children:i?a||`Turn off`:o||`Turn on`})})]})};exports.UITableToggleButton=i;
+//# sourceMappingURL=toggle-button-Dq78v8cH.cjs.map

package/dist/toggle-button-Dq78v8cH.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"toggle-button-Dq78v8cH.cjs","names":["Tooltip","TooltipTrigger","Switch","TooltipContent"],"sources":["../packages/components/features/tables/components/atoms/toggle-button.tsx"],"sourcesContent":["'use client';\nimport { useCallback } from 'react';\n\nimport { Switch } from '@/components/ui/switch';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';\n\n/**\n * An on/off toggle switch for table row action columns.\n * Wraps the `Switch` primitive with a tooltip and stops row-click propagation.\n *\n * @example\n * import { UITableToggleButton } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableToggleButton\n *   checked={row.isActive}\n *   titleOn=\"Deactivate account\"\n *   titleOff=\"Activate account\"\n *   onCheckedChange={(checked) => updateStatus(rowId, checked)}\n * />\n */\nexport const UITableToggleButton: React.FC<{\n  /** Current on/off state of the switch. */\n  checked?: boolean;\n  /** Tooltip shown when the switch is currently ON (describes the toggle-off action). */\n  titleOn?: string;\n  /** Tooltip shown when the switch is currently OFF (describes the toggle-on action). */\n  titleOff?: string;\n  /** Whether the switch is disabled. */\n  disabled?: boolean;\n  /** Called with the new boolean value after the user flips the switch. */\n  onCheckedChange?: (checked: boolean) => void | Promise<void>;\n}> = ({ checked, titleOn, titleOff, disabled, onCheckedChange }) => {\n  const handleCheckedChange = useCallback(\n    async (value: boolean) => {\n      await onCheckedChange?.(value);\n    },\n    [onCheckedChange]\n  );\n\n  const handleClick = useCallback<React.MouseEventHandler<HTMLButtonElement>>(e => {\n    e.stopPropagation();\n  }, []);\n\n  const tooltip = checked ? titleOn || 'Turn off' : titleOff || 'Turn on';\n\n  return (\n    <Tooltip>\n      <TooltipTrigger asChild>\n        <span onClick={handleClick}>\n          <Switch checked={checked} disabled={disabled} onCheckedChange={handleCheckedChange} />\n        </span>\n      </TooltipTrigger>\n      <TooltipContent>\n        <p>{tooltip}</p>\n      </TooltipContent>\n    </Tooltip>\n  );\n};\n"],"mappings":"uHAoBA,MAAa,GAWP,CAAE,UAAS,UAAS,WAAU,WAAU,qBAAsB,CAClE,IAAM,GAAA,EAAA,EAAA,YAAA,CACJ,KAAO,IAAmB,CACxB,MAAM,IAAkB,CAAK,CAC/B,EACA,CAAC,CAAe,CAClB,EAQA,OACE,EAAA,EAAA,KAAA,CAACA,EAAAA,QAAD,CAAA,SAAA,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAgB,QAAA,aACd,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,SAAA,EAAA,EAAA,YAAA,CATgE,GAAK,CAC/E,EAAE,gBAAgB,CACpB,EAAG,CAAC,CAO2B,YACvB,EAAA,EAAA,IAAA,CAACC,EAAAA,OAAD,CAAiB,UAAmB,WAAU,gBAAiB,CAAsB,CAAA,CACjF,CAAA,CACQ,CAAA,GAChB,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CAAA,UACE,EAAA,EAAA,IAAA,CAAC,IAAD,CAAA,SAVU,EAAU,GAAW,WAAa,GAAY,SAUzC,CAAA,CACD,CAAA,CACT,CAAA,CAAA,CAEb"}

package/dist/toggle-group-BpqkL1ds.d.cts

@@ -0,0 +1,37 @@
+import { n as toggleVariants } from "./toggle-Bh4EazxT.cjs";
+import { VariantProps } from "class-variance-authority";
+import { ToggleGroup } from "radix-ui";
+
+//#region packages/components/ui/toggle-group.d.ts
+/**
+ * A group of connected Toggle buttons where one or multiple items can be active at a time.
+ *
+ * @example
+ * ```tsx
+ * import { ToggleGroup, ToggleGroupItem } from '@customafk/lunas-ui/ui/toggle-group';
+ *
+ * <ToggleGroup type="single" variant="outline">
+ *   <ToggleGroupItem value="left">Left</ToggleGroupItem>
+ *   <ToggleGroupItem value="center">Center</ToggleGroupItem>
+ *   <ToggleGroupItem value="right">Right</ToggleGroupItem>
+ * </ToggleGroup>
+ * ```
+ */
+declare function ToggleGroup$1({
+  className,
+  variant,
+  size,
+  children,
+  ...props
+}: React.ComponentProps<typeof ToggleGroup.Root> & VariantProps<typeof toggleVariants>): import("react").JSX.Element;
+/** A single item/button within a ToggleGroup that inherits the group's variant and size. */
+declare function ToggleGroupItem({
+  className,
+  children,
+  variant,
+  size,
+  ...props
+}: React.ComponentProps<typeof ToggleGroup.Item> & VariantProps<typeof toggleVariants>): import("react").JSX.Element;
+//#endregion
+export { ToggleGroupItem as n, ToggleGroup$1 as t };
+//# sourceMappingURL=toggle-group-BpqkL1ds.d.cts.map

package/dist/toggle-group-DzNE38v5.d.mts

@@ -0,0 +1,37 @@
+import { n as toggleVariants } from "./toggle-Bh4EazxT.mjs";
+import { VariantProps } from "class-variance-authority";
+import { ToggleGroup } from "radix-ui";
+
+//#region packages/components/ui/toggle-group.d.ts
+/**
+ * A group of connected Toggle buttons where one or multiple items can be active at a time.
+ *
+ * @example
+ * ```tsx
+ * import { ToggleGroup, ToggleGroupItem } from '@customafk/lunas-ui/ui/toggle-group';
+ *
+ * <ToggleGroup type="single" variant="outline">
+ *   <ToggleGroupItem value="left">Left</ToggleGroupItem>
+ *   <ToggleGroupItem value="center">Center</ToggleGroupItem>
+ *   <ToggleGroupItem value="right">Right</ToggleGroupItem>
+ * </ToggleGroup>
+ * ```
+ */
+declare function ToggleGroup$1({
+  className,
+  variant,
+  size,
+  children,
+  ...props
+}: React.ComponentProps<typeof ToggleGroup.Root> & VariantProps<typeof toggleVariants>): import("react").JSX.Element;
+/** A single item/button within a ToggleGroup that inherits the group's variant and size. */
+declare function ToggleGroupItem({
+  className,
+  children,
+  variant,
+  size,
+  ...props
+}: React.ComponentProps<typeof ToggleGroup.Item> & VariantProps<typeof toggleVariants>): import("react").JSX.Element;
+//#endregion
+export { ToggleGroupItem as n, ToggleGroup$1 as t };
+//# sourceMappingURL=toggle-group-DzNE38v5.d.mts.map

package/dist/tooltip-B-yLj6pe.mjs

@@ -0,0 +1,4 @@
+import{G as e,q as t}from"./tables-UikqnT9q.mjs";import{Input as n}from"./ui/input.mjs";import{ArrowRightIcon as r,BarChart2Icon as i,CirclePlus as a,DownloadIcon as o,RefreshCwIcon as s,SearchIcon as c}from"lucide-react";import{useCallback as l}from"react";import{cn as u}from"@customafk/react-toolkit/utils";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{useDebounceCallback as p}from"@customafk/react-toolkit/hooks/useDebounceCallback";function m(e){if(e==null)return``;if(typeof e==`number`)return String(e);if(typeof e==`boolean`)return e?`true`:`false`;let t=String(e);return t.includes(`,`)||t.includes(`"`)||t.includes(`
+`)||t.includes(`\r`)?`"${t.replace(/"/g,`""`)}"`:t}function h(e){if(e.length===0)return``;let t=e[0].map(e=>m(e.label)),n=e.map(e=>e.map(e=>m(e.value)).join(`,`));return[t.join(`,`),...n].join(`
+`)}function g(e,t){let n=h(e);if(!n)return;let r=new Blob([n],{type:`text/csv;charset=utf-8;`}),i=URL.createObjectURL(r),a=document.createElement(`a`);a.href=i,a.download=`${t}.csv`,a.click(),URL.revokeObjectURL(i)}const _=({onSearch:e,onChange:t,...i})=>{let a=p(t=>{e?.(t)},500);return f(`div`,{className:`relative w-full max-w-80 flex-1`,children:[d(n,{...i,size:`lg`,type:`search`,placeholder:`Tìm kiếm...`,className:`flex-1 ps-9 pe-9`,onChange:e=>{t?.(e),a(e.target.value??``)}}),d(`div`,{className:`pointer-events-none absolute inset-y-0 inset-s-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50`,children:d(c,{size:16})}),d(`button`,{className:`absolute inset-y-0 inset-e-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50`,"aria-label":`Submit search`,type:`submit`,children:d(r,{size:16,"aria-hidden":`true`})})]})},v=({children:e,disabled:t,onClick:n,className:r,...i})=>d(`button`,{type:`button`,disabled:t,className:u(`flex cursor-pointer items-center gap-x-1 rounded-sm border border-border bg-background p-2.5 text-sm text-text-positive-weak outline-none transition-all hover:shadow-card focus:border-border-emphasis focus:bg-muted-muted active:border-border-emphasis active:bg-muted-muted active:text-text-positive disabled:pointer-events-none disabled:cursor-default disabled:opacity-60 [&_svg]:size-3.5`,r),onClick:n,...i,children:e}),y=({onCreate:n,onDownload:r,onRefresh:c})=>{let{table:u,csvData:p,csvFileName:m,title:h,showAnalysisPanel:_}=t(),{isOpen:y,toggle:b}=e(),x=l(()=>{if(r){r();return}if(!p||p.length===0)return;let e=u.getSelectedRowModel().flatRows;g(e.length>0?e.map(e=>p[e.index]).filter(Boolean):p,m||h)},[r,p,m,u,h]),S=!!(r||p&&p.length>0);return f(`div`,{className:`flex [&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none`,children:[d(v,{disabled:!n,onClick:e=>{n?.(),e.stopPropagation(),e.preventDefault()},children:d(a,{})}),d(v,{disabled:!c,onClick:e=>{c?.(),e.stopPropagation(),e.preventDefault()},children:d(s,{})}),d(v,{disabled:!S,onClick:e=>{x(),e.stopPropagation(),e.preventDefault()},children:d(o,{})}),_&&d(v,{onClick:e=>{b(),e.stopPropagation(),e.preventDefault()},"aria-pressed":y,className:y?`bg-muted-muted text-text-positive`:void 0,children:d(i,{})})]})},b=({children:e})=>{let{title:n,description:r,headerActions:i}=t();return f(`div`,{"data-slot":`table-tooltip`,className:`relative flex w-full flex-col gap-2 px-2 py-0 text-sm`,children:[f(`div`,{className:`flex w-full items-start justify-between gap-4`,children:[f(`div`,{className:`flex flex-col gap-0.5`,children:[d(`h3`,{className:`font-semibold text-base text-text-positive`,children:n}),r&&d(`p`,{className:`text-sm text-muted-foreground`,children:r})]}),i&&d(`div`,{className:`flex items-center gap-2 shrink-0`,children:i})]}),d(`div`,{className:`flex w-full flex-1 justify-between gap-x-2`,children:e})]})};b.displayName=`TableTooltip`;export{b as UITableTooltip,y as UITableTooltipActions,_ as UITableTooltipFilter};
+//# sourceMappingURL=tooltip-B-yLj6pe.mjs.map

package/dist/tooltip-B-yLj6pe.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip-B-yLj6pe.mjs","names":[],"sources":["../packages/components/features/tables/utils/csv.ts","../packages/components/features/tables/components/table/tooltip.tsx"],"sourcesContent":["'use client';\n\nimport type { CsvCell } from '../types';\n\nfunction formatCell(value: CsvCell['value']): string {\n  if (value === null || value === undefined) return '';\n  if (typeof value === 'number') return String(value);\n  if (typeof value === 'boolean') return value ? 'true' : 'false';\n  const str = String(value);\n  if (str.includes(',') || str.includes('\"') || str.includes('\\n') || str.includes('\\r')) {\n    return `\"${str.replace(/\"/g, '\"\"')}\"`;\n  }\n  return str;\n}\n\nexport function buildCsvContent(rows: CsvCell[][]): string {\n  if (rows.length === 0) return '';\n  const headers = rows[0].map(cell => formatCell(cell.label));\n  const dataRows = rows.map(row => row.map(cell => formatCell(cell.value)).join(','));\n  return [headers.join(','), ...dataRows].join('\\n');\n}\n\nexport function downloadCsv(rows: CsvCell[][], fileName: string): void {\n  const content = buildCsvContent(rows);\n  if (!content) return;\n  const blob = new Blob([content], { type: 'text/csv;charset=utf-8;' });\n  const url = URL.createObjectURL(blob);\n  const link = document.createElement('a');\n  link.href = url;\n  link.download = `${fileName}.csv`;\n  link.click();\n  URL.revokeObjectURL(url);\n}\n","/**\n * @file tooltip.tsx\n * Toolbar components rendered above the table: a debounced search input,\n * an action button group (create / refresh / download), and the outer\n * toolbar shell that displays the table title.\n */\nimport { useCallback } from 'react';\n\nimport { ArrowRightIcon, BarChart2Icon, CirclePlus, DownloadIcon, RefreshCwIcon, SearchIcon } from 'lucide-react';\n\nimport { useDebounceCallback } from '@customafk/react-toolkit/hooks/useDebounceCallback';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Input } from '@/components/ui/input';\n\nimport { useUITableAnalysisContext, useUITableContext } from '../../hooks/use-context';\nimport { downloadCsv } from '../../utils/csv';\n\n/**\n * Debounced search input rendered inside the table toolbar.\n *\n * Fires `onSearch` 500 ms after the user stops typing and delegates all other\n * native input events via the spread `props`.\n *\n * @example\n * ```tsx\n * import { UITableTooltipFilter } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableTooltipFilter\n *   placeholder=\"Search users…\"\n *   onSearch={value => setQuery(value)}\n * />\n * ```\n */\nexport const UITableTooltipFilter: React.FC<\n  Omit<React.ComponentProps<typeof Input>, 'className'> & {\n    onSearch?: (value: string) => void;\n  }\n> = ({ onSearch, onChange, ...props }) => {\n  const debouncedSearch = useDebounceCallback((value: string) => {\n    onSearch?.(value);\n  }, 500);\n  return (\n    <div className=\"relative w-full max-w-80 flex-1\">\n      <Input\n        {...props}\n        size=\"lg\"\n        type=\"search\"\n        placeholder=\"Tìm kiếm...\"\n        className=\"flex-1 ps-9 pe-9\"\n        onChange={e => {\n          onChange?.(e);\n          debouncedSearch(e.target.value ?? '');\n        }}\n      />\n      <div className=\"pointer-events-none absolute inset-y-0 inset-s-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50\">\n        <SearchIcon size={16} />\n      </div>\n      <button\n        className=\"absolute inset-y-0 inset-e-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50\"\n        aria-label=\"Submit search\"\n        type=\"submit\"\n      >\n        <ArrowRightIcon size={16} aria-hidden=\"true\" />\n      </button>\n    </div>\n  );\n};\n\nconst ActionButton: React.FC<React.PropsWithChildren<React.ComponentProps<'button'>>> = ({ children, disabled, onClick, className, ...props }) => {\n  return (\n    <button\n      type=\"button\"\n      disabled={disabled}\n      className={cn(\n        'flex cursor-pointer items-center gap-x-1 rounded-sm border border-border bg-background p-2.5 text-sm text-text-positive-weak outline-none transition-all hover:shadow-card focus:border-border-emphasis focus:bg-muted-muted active:border-border-emphasis active:bg-muted-muted active:text-text-positive disabled:pointer-events-none disabled:cursor-default disabled:opacity-60 [&_svg]:size-3.5',\n        className\n      )}\n      onClick={onClick}\n      {...props}\n    >\n      {children}\n    </button>\n  );\n};\n\n/**\n * Grouped action buttons (create, refresh, download) displayed in the table\n * toolbar.\n *\n * Each button is disabled automatically when the corresponding handler prop is\n * omitted, so only the actions relevant to a given table need to be provided.\n *\n * @example\n * ```tsx\n * import { UITableTooltipActions } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableTooltipActions\n *   onCreate={() => setOpenCreate(true)}\n *   onRefresh={() => refetch()}\n * />\n * ```\n */\nexport const UITableTooltipActions: React.FC<{\n  onCreate?: () => void;\n  onRefresh?: () => void;\n  onDownload?: () => void;\n}> = ({ onCreate, onDownload, onRefresh }) => {\n  const { table, csvData, csvFileName, title, showAnalysisPanel } = useUITableContext();\n  const { isOpen: isAnalysisOpen, toggle: toggleAnalysis } = useUITableAnalysisContext();\n\n  const handleDownload = useCallback(() => {\n    if (onDownload) {\n      onDownload();\n      return;\n    }\n    if (!csvData || csvData.length === 0) return;\n    const selectedRows = table.getSelectedRowModel().flatRows;\n    const rows = selectedRows.length > 0 ? selectedRows.map(row => csvData[row.index]).filter(Boolean) : csvData;\n    downloadCsv(rows, csvFileName || title);\n  }, [onDownload, csvData, csvFileName, table, title]);\n\n  const isDownloadEnabled = !!(onDownload || (csvData && csvData.length > 0));\n\n  return (\n    <div className=\"flex [&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none\">\n      <ActionButton\n        disabled={!onCreate}\n        onClick={e => {\n          onCreate?.();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <CirclePlus />\n      </ActionButton>\n      <ActionButton\n        disabled={!onRefresh}\n        onClick={e => {\n          onRefresh?.();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <RefreshCwIcon />\n      </ActionButton>\n      <ActionButton\n        disabled={!isDownloadEnabled}\n        onClick={e => {\n          handleDownload();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <DownloadIcon />\n      </ActionButton>\n      {showAnalysisPanel && (\n        <ActionButton\n          onClick={e => {\n            toggleAnalysis();\n            e.stopPropagation();\n            e.preventDefault();\n          }}\n          aria-pressed={isAnalysisOpen}\n          className={isAnalysisOpen ? 'bg-muted-muted text-text-positive' : undefined}\n        >\n          <BarChart2Icon />\n        </ActionButton>\n      )}\n    </div>\n  );\n};\n\n/**\n * Outer toolbar shell for the UITable component.\n *\n * Reads the table `title` from `UITableContext` and renders it as a heading\n * above the `children` slot, which typically contains a\n * `UITableTooltipFilter` and/or `UITableTooltipActions`.\n *\n * @example\n * ```tsx\n * import {\n *   UITableTooltip,\n *   UITableTooltipFilter,\n *   UITableTooltipActions,\n * } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableTooltip>\n *   <UITableTooltipFilter onSearch={setQuery} />\n *   <UITableTooltipActions onCreate={handleCreate} onRefresh={refetch} />\n * </UITableTooltip>\n * ```\n */\nexport const UITableTooltip: React.FC<React.PropsWithChildren> = ({ children }) => {\n  const { title, description, headerActions } = useUITableContext();\n  return (\n    <div data-slot=\"table-tooltip\" className=\"relative flex w-full flex-col gap-2 px-2 py-0 text-sm\">\n      <div className=\"flex w-full items-start justify-between gap-4\">\n        <div className=\"flex flex-col gap-0.5\">\n          <h3 className=\"font-semibold text-base text-text-positive\">{title}</h3>\n          {description && <p className=\"text-sm text-muted-foreground\">{description}</p>}\n        </div>\n        {headerActions && <div className=\"flex items-center gap-2 shrink-0\">{headerActions}</div>}\n      </div>\n      <div className=\"flex w-full flex-1 justify-between gap-x-2\">{children}</div>\n    </div>\n  );\n};\nUITableTooltip.displayName = 'TableTooltip';\n"],"mappings":"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"}

package/dist/tooltip-D4U-RhIu.d.cts

@@ -0,0 +1,53 @@
+import { Tooltip } from "radix-ui";
+
+//#region packages/components/ui/tooltip.d.ts
+/**
+ * Context provider that controls the open delay for all child `Tooltip` components; defaults to `0` ms for instant display.
+ *
+ * @example
+ * ```tsx
+ * import { TooltipProvider } from '@customafk/lunas-ui/ui/tooltip';
+ *
+ * // Wrap at the app root to apply a shared delay:
+ * <TooltipProvider delayDuration={300}>
+ *   <App />
+ * </TooltipProvider>
+ * ```
+ */
+declare function TooltipProvider({
+  delayDuration,
+  ...props
+}: React.ComponentProps<typeof Tooltip.Provider>): import("react").JSX.Element;
+/**
+ * Floating label that reveals supplementary text when the user hovers or focuses its trigger element.
+ *
+ * @example
+ * ```tsx
+ * import { Tooltip, TooltipTrigger, TooltipContent } from '@customafk/lunas-ui/ui/tooltip';
+ * import { Button } from '@customafk/lunas-ui/ui/button';
+ *
+ * <Tooltip>
+ *   <TooltipTrigger asChild>
+ *     <Button variant="ghost" size="icon" aria-label="Settings">⚙</Button>
+ *   </TooltipTrigger>
+ *   <TooltipContent>Open settings</TooltipContent>
+ * </Tooltip>
+ * ```
+ */
+declare function Tooltip$1({
+  ...props
+}: React.ComponentProps<typeof Tooltip.Root>): import("react").JSX.Element;
+/** Element that opens the tooltip on hover/focus; use `asChild` to forward props to a custom child element. */
+declare function TooltipTrigger({
+  ...props
+}: React.ComponentProps<typeof Tooltip.Trigger>): import("react").JSX.Element;
+/** Floating panel rendered in a portal that displays the tooltip text with a directional arrow. */
+declare function TooltipContent({
+  className,
+  sideOffset,
+  children,
+  ...props
+}: React.ComponentProps<typeof Tooltip.Content>): import("react").JSX.Element;
+//#endregion
+export { TooltipTrigger as i, TooltipContent as n, TooltipProvider as r, Tooltip$1 as t };
+//# sourceMappingURL=tooltip-D4U-RhIu.d.cts.map

package/dist/tooltip-D4U-RhIu.d.mts

@@ -0,0 +1,53 @@
+import { Tooltip } from "radix-ui";
+
+//#region packages/components/ui/tooltip.d.ts
+/**
+ * Context provider that controls the open delay for all child `Tooltip` components; defaults to `0` ms for instant display.
+ *
+ * @example
+ * ```tsx
+ * import { TooltipProvider } from '@customafk/lunas-ui/ui/tooltip';
+ *
+ * // Wrap at the app root to apply a shared delay:
+ * <TooltipProvider delayDuration={300}>
+ *   <App />
+ * </TooltipProvider>
+ * ```
+ */
+declare function TooltipProvider({
+  delayDuration,
+  ...props
+}: React.ComponentProps<typeof Tooltip.Provider>): import("react").JSX.Element;
+/**
+ * Floating label that reveals supplementary text when the user hovers or focuses its trigger element.
+ *
+ * @example
+ * ```tsx
+ * import { Tooltip, TooltipTrigger, TooltipContent } from '@customafk/lunas-ui/ui/tooltip';
+ * import { Button } from '@customafk/lunas-ui/ui/button';
+ *
+ * <Tooltip>
+ *   <TooltipTrigger asChild>
+ *     <Button variant="ghost" size="icon" aria-label="Settings">⚙</Button>
+ *   </TooltipTrigger>
+ *   <TooltipContent>Open settings</TooltipContent>
+ * </Tooltip>
+ * ```
+ */
+declare function Tooltip$1({
+  ...props
+}: React.ComponentProps<typeof Tooltip.Root>): import("react").JSX.Element;
+/** Element that opens the tooltip on hover/focus; use `asChild` to forward props to a custom child element. */
+declare function TooltipTrigger({
+  ...props
+}: React.ComponentProps<typeof Tooltip.Trigger>): import("react").JSX.Element;
+/** Floating panel rendered in a portal that displays the tooltip text with a directional arrow. */
+declare function TooltipContent({
+  className,
+  sideOffset,
+  children,
+  ...props
+}: React.ComponentProps<typeof Tooltip.Content>): import("react").JSX.Element;
+//#endregion
+export { TooltipTrigger as i, TooltipContent as n, TooltipProvider as r, Tooltip$1 as t };
+//# sourceMappingURL=tooltip-D4U-RhIu.d.mts.map

package/dist/tooltip-octglTPf.cjs

@@ -0,0 +1,4 @@
+const e=require("./tables-7aC9WFs9.cjs"),t=require("./ui/input.cjs");let n=require("lucide-react"),r=require("react"),i=require("@customafk/react-toolkit/utils"),a=require("react/jsx-runtime"),o=require("@customafk/react-toolkit/hooks/useDebounceCallback");function s(e){if(e==null)return``;if(typeof e==`number`)return String(e);if(typeof e==`boolean`)return e?`true`:`false`;let t=String(e);return t.includes(`,`)||t.includes(`"`)||t.includes(`
+`)||t.includes(`\r`)?`"${t.replace(/"/g,`""`)}"`:t}function c(e){if(e.length===0)return``;let t=e[0].map(e=>s(e.label)),n=e.map(e=>e.map(e=>s(e.value)).join(`,`));return[t.join(`,`),...n].join(`
+`)}function l(e,t){let n=c(e);if(!n)return;let r=new Blob([n],{type:`text/csv;charset=utf-8;`}),i=URL.createObjectURL(r),a=document.createElement(`a`);a.href=i,a.download=`${t}.csv`,a.click(),URL.revokeObjectURL(i)}const u=({onSearch:e,onChange:r,...i})=>{let s=(0,o.useDebounceCallback)(t=>{e?.(t)},500);return(0,a.jsxs)(`div`,{className:`relative w-full max-w-80 flex-1`,children:[(0,a.jsx)(t.Input,{...i,size:`lg`,type:`search`,placeholder:`Tìm kiếm...`,className:`flex-1 ps-9 pe-9`,onChange:e=>{r?.(e),s(e.target.value??``)}}),(0,a.jsx)(`div`,{className:`pointer-events-none absolute inset-y-0 inset-s-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50`,children:(0,a.jsx)(n.SearchIcon,{size:16})}),(0,a.jsx)(`button`,{className:`absolute inset-y-0 inset-e-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50`,"aria-label":`Submit search`,type:`submit`,children:(0,a.jsx)(n.ArrowRightIcon,{size:16,"aria-hidden":`true`})})]})},d=({children:e,disabled:t,onClick:n,className:r,...o})=>(0,a.jsx)(`button`,{type:`button`,disabled:t,className:(0,i.cn)(`flex cursor-pointer items-center gap-x-1 rounded-sm border border-border bg-background p-2.5 text-sm text-text-positive-weak outline-none transition-all hover:shadow-card focus:border-border-emphasis focus:bg-muted-muted active:border-border-emphasis active:bg-muted-muted active:text-text-positive disabled:pointer-events-none disabled:cursor-default disabled:opacity-60 [&_svg]:size-3.5`,r),onClick:n,...o,children:e}),f=({onCreate:t,onDownload:i,onRefresh:o})=>{let{table:s,csvData:c,csvFileName:u,title:f,showAnalysisPanel:p}=e.q(),{isOpen:m,toggle:h}=e.G(),g=(0,r.useCallback)(()=>{if(i){i();return}if(!c||c.length===0)return;let e=s.getSelectedRowModel().flatRows;l(e.length>0?e.map(e=>c[e.index]).filter(Boolean):c,u||f)},[i,c,u,s,f]),_=!!(i||c&&c.length>0);return(0,a.jsxs)(`div`,{className:`flex [&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none`,children:[(0,a.jsx)(d,{disabled:!t,onClick:e=>{t?.(),e.stopPropagation(),e.preventDefault()},children:(0,a.jsx)(n.CirclePlus,{})}),(0,a.jsx)(d,{disabled:!o,onClick:e=>{o?.(),e.stopPropagation(),e.preventDefault()},children:(0,a.jsx)(n.RefreshCwIcon,{})}),(0,a.jsx)(d,{disabled:!_,onClick:e=>{g(),e.stopPropagation(),e.preventDefault()},children:(0,a.jsx)(n.DownloadIcon,{})}),p&&(0,a.jsx)(d,{onClick:e=>{h(),e.stopPropagation(),e.preventDefault()},"aria-pressed":m,className:m?`bg-muted-muted text-text-positive`:void 0,children:(0,a.jsx)(n.BarChart2Icon,{})})]})},p=({children:t})=>{let{title:n,description:r,headerActions:i}=e.q();return(0,a.jsxs)(`div`,{"data-slot":`table-tooltip`,className:`relative flex w-full flex-col gap-2 px-2 py-0 text-sm`,children:[(0,a.jsxs)(`div`,{className:`flex w-full items-start justify-between gap-4`,children:[(0,a.jsxs)(`div`,{className:`flex flex-col gap-0.5`,children:[(0,a.jsx)(`h3`,{className:`font-semibold text-base text-text-positive`,children:n}),r&&(0,a.jsx)(`p`,{className:`text-sm text-muted-foreground`,children:r})]}),i&&(0,a.jsx)(`div`,{className:`flex items-center gap-2 shrink-0`,children:i})]}),(0,a.jsx)(`div`,{className:`flex w-full flex-1 justify-between gap-x-2`,children:t})]})};p.displayName=`TableTooltip`,exports.UITableTooltip=p,exports.UITableTooltipActions=f,exports.UITableTooltipFilter=u;
+//# sourceMappingURL=tooltip-octglTPf.cjs.map

package/dist/tooltip-octglTPf.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip-octglTPf.cjs","names":["Input","SearchIcon","ArrowRightIcon","useUITableContext","useUITableAnalysisContext","CirclePlus","RefreshCwIcon","DownloadIcon","BarChart2Icon"],"sources":["../packages/components/features/tables/utils/csv.ts","../packages/components/features/tables/components/table/tooltip.tsx"],"sourcesContent":["'use client';\n\nimport type { CsvCell } from '../types';\n\nfunction formatCell(value: CsvCell['value']): string {\n  if (value === null || value === undefined) return '';\n  if (typeof value === 'number') return String(value);\n  if (typeof value === 'boolean') return value ? 'true' : 'false';\n  const str = String(value);\n  if (str.includes(',') || str.includes('\"') || str.includes('\\n') || str.includes('\\r')) {\n    return `\"${str.replace(/\"/g, '\"\"')}\"`;\n  }\n  return str;\n}\n\nexport function buildCsvContent(rows: CsvCell[][]): string {\n  if (rows.length === 0) return '';\n  const headers = rows[0].map(cell => formatCell(cell.label));\n  const dataRows = rows.map(row => row.map(cell => formatCell(cell.value)).join(','));\n  return [headers.join(','), ...dataRows].join('\\n');\n}\n\nexport function downloadCsv(rows: CsvCell[][], fileName: string): void {\n  const content = buildCsvContent(rows);\n  if (!content) return;\n  const blob = new Blob([content], { type: 'text/csv;charset=utf-8;' });\n  const url = URL.createObjectURL(blob);\n  const link = document.createElement('a');\n  link.href = url;\n  link.download = `${fileName}.csv`;\n  link.click();\n  URL.revokeObjectURL(url);\n}\n","/**\n * @file tooltip.tsx\n * Toolbar components rendered above the table: a debounced search input,\n * an action button group (create / refresh / download), and the outer\n * toolbar shell that displays the table title.\n */\nimport { useCallback } from 'react';\n\nimport { ArrowRightIcon, BarChart2Icon, CirclePlus, DownloadIcon, RefreshCwIcon, SearchIcon } from 'lucide-react';\n\nimport { useDebounceCallback } from '@customafk/react-toolkit/hooks/useDebounceCallback';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Input } from '@/components/ui/input';\n\nimport { useUITableAnalysisContext, useUITableContext } from '../../hooks/use-context';\nimport { downloadCsv } from '../../utils/csv';\n\n/**\n * Debounced search input rendered inside the table toolbar.\n *\n * Fires `onSearch` 500 ms after the user stops typing and delegates all other\n * native input events via the spread `props`.\n *\n * @example\n * ```tsx\n * import { UITableTooltipFilter } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableTooltipFilter\n *   placeholder=\"Search users…\"\n *   onSearch={value => setQuery(value)}\n * />\n * ```\n */\nexport const UITableTooltipFilter: React.FC<\n  Omit<React.ComponentProps<typeof Input>, 'className'> & {\n    onSearch?: (value: string) => void;\n  }\n> = ({ onSearch, onChange, ...props }) => {\n  const debouncedSearch = useDebounceCallback((value: string) => {\n    onSearch?.(value);\n  }, 500);\n  return (\n    <div className=\"relative w-full max-w-80 flex-1\">\n      <Input\n        {...props}\n        size=\"lg\"\n        type=\"search\"\n        placeholder=\"Tìm kiếm...\"\n        className=\"flex-1 ps-9 pe-9\"\n        onChange={e => {\n          onChange?.(e);\n          debouncedSearch(e.target.value ?? '');\n        }}\n      />\n      <div className=\"pointer-events-none absolute inset-y-0 inset-s-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50\">\n        <SearchIcon size={16} />\n      </div>\n      <button\n        className=\"absolute inset-y-0 inset-e-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50\"\n        aria-label=\"Submit search\"\n        type=\"submit\"\n      >\n        <ArrowRightIcon size={16} aria-hidden=\"true\" />\n      </button>\n    </div>\n  );\n};\n\nconst ActionButton: React.FC<React.PropsWithChildren<React.ComponentProps<'button'>>> = ({ children, disabled, onClick, className, ...props }) => {\n  return (\n    <button\n      type=\"button\"\n      disabled={disabled}\n      className={cn(\n        'flex cursor-pointer items-center gap-x-1 rounded-sm border border-border bg-background p-2.5 text-sm text-text-positive-weak outline-none transition-all hover:shadow-card focus:border-border-emphasis focus:bg-muted-muted active:border-border-emphasis active:bg-muted-muted active:text-text-positive disabled:pointer-events-none disabled:cursor-default disabled:opacity-60 [&_svg]:size-3.5',\n        className\n      )}\n      onClick={onClick}\n      {...props}\n    >\n      {children}\n    </button>\n  );\n};\n\n/**\n * Grouped action buttons (create, refresh, download) displayed in the table\n * toolbar.\n *\n * Each button is disabled automatically when the corresponding handler prop is\n * omitted, so only the actions relevant to a given table need to be provided.\n *\n * @example\n * ```tsx\n * import { UITableTooltipActions } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableTooltipActions\n *   onCreate={() => setOpenCreate(true)}\n *   onRefresh={() => refetch()}\n * />\n * ```\n */\nexport const UITableTooltipActions: React.FC<{\n  onCreate?: () => void;\n  onRefresh?: () => void;\n  onDownload?: () => void;\n}> = ({ onCreate, onDownload, onRefresh }) => {\n  const { table, csvData, csvFileName, title, showAnalysisPanel } = useUITableContext();\n  const { isOpen: isAnalysisOpen, toggle: toggleAnalysis } = useUITableAnalysisContext();\n\n  const handleDownload = useCallback(() => {\n    if (onDownload) {\n      onDownload();\n      return;\n    }\n    if (!csvData || csvData.length === 0) return;\n    const selectedRows = table.getSelectedRowModel().flatRows;\n    const rows = selectedRows.length > 0 ? selectedRows.map(row => csvData[row.index]).filter(Boolean) : csvData;\n    downloadCsv(rows, csvFileName || title);\n  }, [onDownload, csvData, csvFileName, table, title]);\n\n  const isDownloadEnabled = !!(onDownload || (csvData && csvData.length > 0));\n\n  return (\n    <div className=\"flex [&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none\">\n      <ActionButton\n        disabled={!onCreate}\n        onClick={e => {\n          onCreate?.();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <CirclePlus />\n      </ActionButton>\n      <ActionButton\n        disabled={!onRefresh}\n        onClick={e => {\n          onRefresh?.();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <RefreshCwIcon />\n      </ActionButton>\n      <ActionButton\n        disabled={!isDownloadEnabled}\n        onClick={e => {\n          handleDownload();\n          e.stopPropagation();\n          e.preventDefault();\n        }}\n      >\n        <DownloadIcon />\n      </ActionButton>\n      {showAnalysisPanel && (\n        <ActionButton\n          onClick={e => {\n            toggleAnalysis();\n            e.stopPropagation();\n            e.preventDefault();\n          }}\n          aria-pressed={isAnalysisOpen}\n          className={isAnalysisOpen ? 'bg-muted-muted text-text-positive' : undefined}\n        >\n          <BarChart2Icon />\n        </ActionButton>\n      )}\n    </div>\n  );\n};\n\n/**\n * Outer toolbar shell for the UITable component.\n *\n * Reads the table `title` from `UITableContext` and renders it as a heading\n * above the `children` slot, which typically contains a\n * `UITableTooltipFilter` and/or `UITableTooltipActions`.\n *\n * @example\n * ```tsx\n * import {\n *   UITableTooltip,\n *   UITableTooltipFilter,\n *   UITableTooltipActions,\n * } from '@customafk/lunas-ui/features/tables';\n *\n * <UITableTooltip>\n *   <UITableTooltipFilter onSearch={setQuery} />\n *   <UITableTooltipActions onCreate={handleCreate} onRefresh={refetch} />\n * </UITableTooltip>\n * ```\n */\nexport const UITableTooltip: React.FC<React.PropsWithChildren> = ({ children }) => {\n  const { title, description, headerActions } = useUITableContext();\n  return (\n    <div data-slot=\"table-tooltip\" className=\"relative flex w-full flex-col gap-2 px-2 py-0 text-sm\">\n      <div className=\"flex w-full items-start justify-between gap-4\">\n        <div className=\"flex flex-col gap-0.5\">\n          <h3 className=\"font-semibold text-base text-text-positive\">{title}</h3>\n          {description && <p className=\"text-sm text-muted-foreground\">{description}</p>}\n        </div>\n        {headerActions && <div className=\"flex items-center gap-2 shrink-0\">{headerActions}</div>}\n      </div>\n      <div className=\"flex w-full flex-1 justify-between gap-x-2\">{children}</div>\n    </div>\n  );\n};\nUITableTooltip.displayName = 'TableTooltip';\n"],"mappings":"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"}

package/dist/top-products-bar-chart-5EJFSkeo.cjs

@@ -0,0 +1,2 @@
+const e=require("./features/charts/index.cjs"),t=require("./ui/chart.cjs");let n=require("react"),r=require("@customafk/react-toolkit/utils"),i=require("react/jsx-runtime"),a=require("recharts");const o=({data:o,label:s=`Sales`,maxItems:c=8,color:l=`var(--chart-1)`,valueFormatter:u=e.formatCompactNumber,showValueLabels:d=!0,className:f,animate:p=!0,height:m})=>{let h=(0,n.useMemo)(()=>[...o].sort((e,t)=>t.value-e.value).slice(0,c),[o,c]);return(0,i.jsx)(t.ChartContainer,{"data-slot":`top-products-bar-chart`,config:(0,n.useMemo)(()=>({value:{label:s,color:l}}),[s,l]),className:(0,r.cn)(`w-full`,f),style:m===void 0?void 0:{height:m,aspectRatio:`auto`},children:(0,i.jsxs)(a.BarChart,{data:h,layout:`vertical`,margin:{top:0,right:d?48:12,bottom:0,left:12},children:[(0,i.jsx)(a.XAxis,{type:`number`,dataKey:`value`,hide:!0}),(0,i.jsx)(a.YAxis,{type:`category`,dataKey:`name`,tickLine:!1,axisLine:!1,tickMargin:8,width:120}),(0,i.jsx)(t.ChartTooltip,{cursor:!1,content:(0,i.jsx)(t.ChartTooltipContent,{hideLabel:!0})}),(0,i.jsx)(a.Bar,{dataKey:`value`,fill:l,radius:4,isAnimationActive:p,children:d&&(0,i.jsx)(a.LabelList,{dataKey:`value`,position:`right`,offset:8,className:`fill-muted-strong`,fontSize:12,formatter:e=>u(Number(e))})})]})})};exports.TopProductsBarChart=o;
+//# sourceMappingURL=top-products-bar-chart-5EJFSkeo.cjs.map

package/dist/top-products-bar-chart-5EJFSkeo.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"top-products-bar-chart-5EJFSkeo.cjs","names":["formatCompactNumber","ChartContainer","BarChart","XAxis","YAxis","ChartTooltip","ChartTooltipContent","Bar","LabelList"],"sources":["../packages/components/features/charts/components/top-products-bar-chart.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { type ChartConfig, ChartContainer, ChartTooltip, ChartTooltipContent } from '@/components/ui/chart';\n\nimport { Bar, BarChart, LabelList, XAxis, YAxis } from 'recharts';\nimport type { BaseChartProps, NamedValue } from '../types';\nimport { formatCompactNumber } from '../utils';\n\nexport type TopProductsBarChartProps = BaseChartProps & {\n  data: NamedValue[];\n  /** Series label. Defaults to `'Sales'`. */\n  label?: string;\n  /** Number of items shown after sorting descending. Defaults to `8`. */\n  maxItems?: number;\n  color?: string;\n  valueFormatter?: (value: number) => string;\n  /** Value labels at the end of each bar. Defaults to `true`. */\n  showValueLabels?: boolean;\n};\n\n/**\n * A horizontal bar ranking chart — top products, best categories, top customers.\n *\n * @example\n * ```tsx\n * import { TopProductsBarChart } from '@customafk/lunas-ui/features/charts';\n *\n * <TopProductsBarChart\n *   data={[\n *     { name: 'Wireless Earbuds', value: 1245 },\n *     { name: 'Smart Watch', value: 986 },\n *   ]}\n * />\n * ```\n */\nexport const TopProductsBarChart = ({\n  data,\n  label = 'Sales',\n  maxItems = 8,\n  color = 'var(--chart-1)',\n  valueFormatter = formatCompactNumber,\n  showValueLabels = true,\n  className,\n  animate = true,\n  height,\n}: TopProductsBarChartProps) => {\n  const chartData = useMemo(() => [...data].sort((a, b) => b.value - a.value).slice(0, maxItems), [data, maxItems]);\n\n  const config = useMemo<ChartConfig>(() => ({ value: { label, color } }), [label, color]);\n\n  return (\n    <ChartContainer\n      data-slot=\"top-products-bar-chart\"\n      config={config}\n      className={cn('w-full', className)}\n      style={height !== undefined ? { height, aspectRatio: 'auto' } : undefined}\n    >\n      <BarChart data={chartData} layout=\"vertical\" margin={{ top: 0, right: showValueLabels ? 48 : 12, bottom: 0, left: 12 }}>\n        <XAxis type=\"number\" dataKey=\"value\" hide />\n        <YAxis type=\"category\" dataKey=\"name\" tickLine={false} axisLine={false} tickMargin={8} width={120} />\n        <ChartTooltip cursor={false} content={<ChartTooltipContent hideLabel />} />\n        <Bar dataKey=\"value\" fill={color} radius={4} isAnimationActive={animate}>\n          {showValueLabels && (\n            <LabelList\n              dataKey=\"value\"\n              position=\"right\"\n              offset={8}\n              className=\"fill-muted-strong\"\n              fontSize={12}\n              formatter={(value: React.ReactNode) => valueFormatter(Number(value))}\n            />\n          )}\n        </Bar>\n      </BarChart>\n    </ChartContainer>\n  );\n};\n"],"mappings":"mMAuCA,MAAa,GAAuB,CAClC,OACA,QAAQ,QACR,WAAW,EACX,QAAQ,iBACR,iBAAiBA,EAAAA,oBACjB,kBAAkB,GAClB,YACA,UAAU,GACV,YAC8B,CAC9B,IAAM,GAAA,EAAA,EAAA,QAAA,KAA0B,CAAC,GAAG,CAAI,CAAC,CAAC,MAAM,EAAG,IAAM,EAAE,MAAQ,EAAE,KAAK,CAAC,CAAC,MAAM,EAAG,CAAQ,EAAG,CAAC,EAAM,CAAQ,CAAC,EAIhH,OACE,EAAA,EAAA,IAAA,CAACC,EAAAA,eAAD,CACE,YAAU,yBACV,QAAA,EAAA,EAAA,QAAA,MALuC,CAAE,MAAO,CAAE,QAAO,OAAM,CAAE,GAAI,CAAC,EAAO,CAAK,CAKrE,EACb,WAAA,EAAA,EAAA,GAAA,CAAc,SAAU,CAAS,EACjC,MAAO,IAAW,IAAA,GAA8C,IAAA,GAAlC,CAAE,SAAQ,YAAa,MAAO,YAE5D,EAAA,EAAA,KAAA,CAACC,EAAAA,SAAD,CAAU,KAAM,EAAW,OAAO,WAAW,OAAQ,CAAE,IAAK,EAAG,MAAO,EAAkB,GAAK,GAAI,OAAQ,EAAG,KAAM,EAAG,WAArH,EACE,EAAA,EAAA,IAAA,CAACC,EAAAA,MAAD,CAAO,KAAK,SAAS,QAAQ,QAAQ,KAAA,EAAM,CAAA,GAC3C,EAAA,EAAA,IAAA,CAACC,EAAAA,MAAD,CAAO,KAAK,WAAW,QAAQ,OAAO,SAAU,GAAO,SAAU,GAAO,WAAY,EAAG,MAAO,GAAM,CAAA,GACpG,EAAA,EAAA,IAAA,CAACC,EAAAA,aAAD,CAAc,OAAQ,GAAO,SAAS,EAAA,EAAA,IAAA,CAACC,EAAAA,oBAAD,CAAqB,UAAA,EAAW,CAAA,CAAI,CAAA,GAC1E,EAAA,EAAA,IAAA,CAACC,EAAAA,IAAD,CAAK,QAAQ,QAAQ,KAAM,EAAO,OAAQ,EAAG,kBAAmB,WAC7D,IACC,EAAA,EAAA,IAAA,CAACC,EAAAA,UAAD,CACE,QAAQ,QACR,SAAS,QACT,OAAQ,EACR,UAAU,oBACV,SAAU,GACV,UAAY,GAA2B,EAAe,OAAO,CAAK,CAAC,CACpE,CAAA,CAEA,CAAA,CACG,GACI,CAAA,CAEpB"}

package/dist/top-products-bar-chart-CKYaOGWT.mjs

@@ -0,0 +1,2 @@
+import{formatCompactNumber as e}from"./features/charts/index.mjs";import{ChartContainer as t,ChartTooltip as n,ChartTooltipContent as r}from"./ui/chart.mjs";import{useMemo as i}from"react";import{cn as a}from"@customafk/react-toolkit/utils";import{jsx as o,jsxs as s}from"react/jsx-runtime";import{Bar as c,BarChart as l,LabelList as u,XAxis as d,YAxis as f}from"recharts";const p=({data:p,label:m=`Sales`,maxItems:h=8,color:g=`var(--chart-1)`,valueFormatter:_=e,showValueLabels:v=!0,className:y,animate:b=!0,height:x})=>{let S=i(()=>[...p].sort((e,t)=>t.value-e.value).slice(0,h),[p,h]);return o(t,{"data-slot":`top-products-bar-chart`,config:i(()=>({value:{label:m,color:g}}),[m,g]),className:a(`w-full`,y),style:x===void 0?void 0:{height:x,aspectRatio:`auto`},children:s(l,{data:S,layout:`vertical`,margin:{top:0,right:v?48:12,bottom:0,left:12},children:[o(d,{type:`number`,dataKey:`value`,hide:!0}),o(f,{type:`category`,dataKey:`name`,tickLine:!1,axisLine:!1,tickMargin:8,width:120}),o(n,{cursor:!1,content:o(r,{hideLabel:!0})}),o(c,{dataKey:`value`,fill:g,radius:4,isAnimationActive:b,children:v&&o(u,{dataKey:`value`,position:`right`,offset:8,className:`fill-muted-strong`,fontSize:12,formatter:e=>_(Number(e))})})]})})};export{p as TopProductsBarChart};
+//# sourceMappingURL=top-products-bar-chart-CKYaOGWT.mjs.map

package/dist/top-products-bar-chart-CKYaOGWT.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"top-products-bar-chart-CKYaOGWT.mjs","names":[],"sources":["../packages/components/features/charts/components/top-products-bar-chart.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { type ChartConfig, ChartContainer, ChartTooltip, ChartTooltipContent } from '@/components/ui/chart';\n\nimport { Bar, BarChart, LabelList, XAxis, YAxis } from 'recharts';\nimport type { BaseChartProps, NamedValue } from '../types';\nimport { formatCompactNumber } from '../utils';\n\nexport type TopProductsBarChartProps = BaseChartProps & {\n  data: NamedValue[];\n  /** Series label. Defaults to `'Sales'`. */\n  label?: string;\n  /** Number of items shown after sorting descending. Defaults to `8`. */\n  maxItems?: number;\n  color?: string;\n  valueFormatter?: (value: number) => string;\n  /** Value labels at the end of each bar. Defaults to `true`. */\n  showValueLabels?: boolean;\n};\n\n/**\n * A horizontal bar ranking chart — top products, best categories, top customers.\n *\n * @example\n * ```tsx\n * import { TopProductsBarChart } from '@customafk/lunas-ui/features/charts';\n *\n * <TopProductsBarChart\n *   data={[\n *     { name: 'Wireless Earbuds', value: 1245 },\n *     { name: 'Smart Watch', value: 986 },\n *   ]}\n * />\n * ```\n */\nexport const TopProductsBarChart = ({\n  data,\n  label = 'Sales',\n  maxItems = 8,\n  color = 'var(--chart-1)',\n  valueFormatter = formatCompactNumber,\n  showValueLabels = true,\n  className,\n  animate = true,\n  height,\n}: TopProductsBarChartProps) => {\n  const chartData = useMemo(() => [...data].sort((a, b) => b.value - a.value).slice(0, maxItems), [data, maxItems]);\n\n  const config = useMemo<ChartConfig>(() => ({ value: { label, color } }), [label, color]);\n\n  return (\n    <ChartContainer\n      data-slot=\"top-products-bar-chart\"\n      config={config}\n      className={cn('w-full', className)}\n      style={height !== undefined ? { height, aspectRatio: 'auto' } : undefined}\n    >\n      <BarChart data={chartData} layout=\"vertical\" margin={{ top: 0, right: showValueLabels ? 48 : 12, bottom: 0, left: 12 }}>\n        <XAxis type=\"number\" dataKey=\"value\" hide />\n        <YAxis type=\"category\" dataKey=\"name\" tickLine={false} axisLine={false} tickMargin={8} width={120} />\n        <ChartTooltip cursor={false} content={<ChartTooltipContent hideLabel />} />\n        <Bar dataKey=\"value\" fill={color} radius={4} isAnimationActive={animate}>\n          {showValueLabels && (\n            <LabelList\n              dataKey=\"value\"\n              position=\"right\"\n              offset={8}\n              className=\"fill-muted-strong\"\n              fontSize={12}\n              formatter={(value: React.ReactNode) => valueFormatter(Number(value))}\n            />\n          )}\n        </Bar>\n      </BarChart>\n    </ChartContainer>\n  );\n};\n"],"mappings":"qXAuCA,MAAa,GAAuB,CAClC,OACA,QAAQ,QACR,WAAW,EACX,QAAQ,iBACR,iBAAiB,EACjB,kBAAkB,GAClB,YACA,UAAU,GACV,YAC8B,CAC9B,IAAM,EAAY,MAAc,CAAC,GAAG,CAAI,CAAC,CAAC,MAAM,EAAG,IAAM,EAAE,MAAQ,EAAE,KAAK,CAAC,CAAC,MAAM,EAAG,CAAQ,EAAG,CAAC,EAAM,CAAQ,CAAC,EAIhH,OACE,EAAC,EAAD,CACE,YAAU,yBACV,OALW,OAA4B,CAAE,MAAO,CAAE,QAAO,OAAM,CAAE,GAAI,CAAC,EAAO,CAAK,CAKrE,EACb,UAAW,EAAG,SAAU,CAAS,EACjC,MAAO,IAAW,IAAA,GAA8C,IAAA,GAAlC,CAAE,SAAQ,YAAa,MAAO,WAE5D,EAAC,EAAD,CAAU,KAAM,EAAW,OAAO,WAAW,OAAQ,CAAE,IAAK,EAAG,MAAO,EAAkB,GAAK,GAAI,OAAQ,EAAG,KAAM,EAAG,WAArH,CACE,EAAC,EAAD,CAAO,KAAK,SAAS,QAAQ,QAAQ,KAAA,EAAM,CAAA,EAC3C,EAAC,EAAD,CAAO,KAAK,WAAW,QAAQ,OAAO,SAAU,GAAO,SAAU,GAAO,WAAY,EAAG,MAAO,GAAM,CAAA,EACpG,EAAC,EAAD,CAAc,OAAQ,GAAO,QAAS,EAAC,EAAD,CAAqB,UAAA,EAAW,CAAA,CAAI,CAAA,EAC1E,EAAC,EAAD,CAAK,QAAQ,QAAQ,KAAM,EAAO,OAAQ,EAAG,kBAAmB,WAC7D,GACC,EAAC,EAAD,CACE,QAAQ,QACR,SAAS,QACT,OAAQ,EACR,UAAU,oBACV,SAAU,GACV,UAAY,GAA2B,EAAe,OAAO,CAAK,CAAC,CACpE,CAAA,CAEA,CAAA,CACG,GACI,CAAA,CAEpB"}

package/dist/trash-BfWSqlL4.d.cts

@@ -0,0 +1,16 @@
+//#region packages/components/ui/buttons/trash.d.ts
+type Props = {
+  /** Callback invoked when the button is clicked. */onClick?: () => void;
+};
+/**
+ * An icon-only ghost button that triggers a delete action, rendered with a trash-can icon.
+ *
+ * @example
+ * import { TrashBtn } from '@customafk/lunas-ui/ui/buttons/trash';
+ *
+ * <TrashBtn onClick={() => deleteRecord(record.id)} />
+ */
+declare const TrashBtn: React.FC<Props>;
+//#endregion
+export { TrashBtn as t };
+//# sourceMappingURL=trash-BfWSqlL4.d.cts.map

package/dist/trash-BfWSqlL4.d.mts

@@ -0,0 +1,16 @@
+//#region packages/components/ui/buttons/trash.d.ts
+type Props = {
+  /** Callback invoked when the button is clicked. */onClick?: () => void;
+};
+/**
+ * An icon-only ghost button that triggers a delete action, rendered with a trash-can icon.
+ *
+ * @example
+ * import { TrashBtn } from '@customafk/lunas-ui/ui/buttons/trash';
+ *
+ * <TrashBtn onClick={() => deleteRecord(record.id)} />
+ */
+declare const TrashBtn: React.FC<Props>;
+//#endregion
+export { TrashBtn as t };
+//# sourceMappingURL=trash-BfWSqlL4.d.mts.map

package/dist/typography/paragraph.d.cts

@@ -1,46 +1,2 @@
-import { VariantProps } from "class-variance-authority";
-import { ComponentPropsWithoutRef } from "react";
-
-//#region packages/components/typography/paragraph.d.ts
-declare const paragraphVariants: (props?: ({
-  variant?: "xs" | "sm" | "lg" | "lead" | "p" | "muted" | null | undefined;
-} & import("class-variance-authority/types").ClassProp) | undefined) => string;
-/**
- * Props for the {@link Paragraph} component.
- *
- * Extends all native `<p>` HTML attributes plus the CVA variant.
- *
- * @property variant - Visual style variant.
- *   - `'lead'` — large, medium-weight introductory text (default size `text-base` / `md:text-lg`)
- *   - `'lg'`  — large normal-weight text
- *   - `'p'`   — standard body text (default)
- *   - `'sm'`  — small normal-weight text with tighter leading
- *   - `'muted'` — subdued colour, standard body size
- *   - `'xs'`  — extra-small text in a muted colour
- */
-type ParagraphProps = ComponentPropsWithoutRef<'p'> & VariantProps<typeof paragraphVariants>;
-/**
- * A styled `<p>` element with semantic size and weight variants for body text.
- *
- * @example
- * ```tsx
- * import { Paragraph } from '@customafk/lunas-ui/typography/paragraph';
- *
- * // Default body paragraph
- * <Paragraph>This is body text.</Paragraph>
- *
- * // Lead paragraph with larger, medium-weight text
- * <Paragraph variant="lead">Introducing our new feature.</Paragraph>
- *
- * // Muted helper text
- * <Paragraph variant="muted">Last updated 3 days ago.</Paragraph>
- * ```
- */
-declare const Paragraph: ({
-  variant,
-  className,
-  ...props
-}: ParagraphProps) => import("react").JSX.Element;
-//#endregion
-export { Paragraph, ParagraphProps, paragraphVariants };
-//# sourceMappingURL=paragraph.d.cts.map
+import { n as ParagraphProps, r as paragraphVariants, t as Paragraph } from "../paragraph-DbYYv0A0.cjs";
+export { Paragraph, ParagraphProps, paragraphVariants };