@customafk/lunas-ui 0.2.42 → 0.2.43

package/dist/ui/table.mjs

@@ -0,0 +1,2 @@
+"use client";import{memo as e}from"react";import{cn as t}from"@customafk/react-toolkit/utils";import{jsx as n}from"react/jsx-runtime";const r=e(({className:e,...r})=>n(`table`,{"data-slot":`table`,className:t(`w-full caption-bottom text-sm`,e),...r}));r.displayName=`Table`;const i=e(({className:e,...r})=>n(`thead`,{"data-slot":`table-header`,className:t(`[&_tr:not(:last-child)_td]:border-b`,e),...r}));i.displayName=`TableHeader`;const a=e(({className:e,...r})=>n(`tbody`,{"data-slot":`table-body`,className:t(`[&_tr:last-child]:border-0`,`[&_tr]:hover:bg-muted-muted/50`,`[&_tr]:active:bg-muted-muted`,`[&_tr]:data-[state=selected]:bg-muted`,`[&_tr]:border-border-weak`,`[&_tr]:border-b`,`[&_tr]:transition-colors`,e),...r}));a.displayName=`TableBody`;const o=e(({className:e,...r})=>n(`tfoot`,{"data-slot":`table-footer`,className:t(`border-border-weak border-t font-medium [&>tr]:last:border-b-0`,e),...r}));o.displayName=`TableFooter`;const s=e(({className:e,...t})=>n(`tr`,{"data-slot":`table-row`,className:e,...t}));s.displayName=`TableRow`;const c=e(({className:e,...r})=>n(`th`,{"data-slot":`table-head`,className:t(`text-text-positive-weak`,`h-10 whitespace-nowrap px-2 text-left align-middle font-medium`,`[&:has([role=checkbox])]:pr-0`,`[&>[role=checkbox]]:translate-y-0.5`,e),...r}));c.displayName=`TableHead`;const l=e(({className:e,...t})=>n(`td`,{"data-slot":`table-cell`,className:e,...t}));l.displayName=`TableCell`;const u=e(({className:e,...r})=>n(`caption`,{"data-slot":`table-caption`,className:t(`text-text-positive-muted mt-4 text-sm`,e),...r}));u.displayName=`TableCaption`;export{r as Table,a as TableBody,u as TableCaption,l as TableCell,o as TableFooter,c as TableHead,i as TableHeader,s as TableRow};
+//# sourceMappingURL=table.mjs.map

package/dist/ui/table.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"table.mjs","names":[],"sources":["../../packages/components/ui/table.tsx"],"sourcesContent":["'use client';\n\nimport { memo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\n/**\n * Full-width semantic table with caption-bottom layout, intended to be composed with TableHeader, TableBody, and related sub-components.\n *\n * @example\n * ```tsx\n * import {\n *   Table, TableHeader, TableBody, TableRow,\n *   TableHead, TableCell, TableCaption,\n * } from '@customafk/lunas-ui/ui/table';\n *\n * <Table>\n *   <TableCaption>Invoice list</TableCaption>\n *   <TableHeader>\n *     <TableRow>\n *       <TableHead>Name</TableHead>\n *       <TableHead>Amount</TableHead>\n *     </TableRow>\n *   </TableHeader>\n *   <TableBody>\n *     <TableRow>\n *       <TableCell>Acme Corp</TableCell>\n *       <TableCell>$1,200</TableCell>\n *     </TableRow>\n *   </TableBody>\n * </Table>\n * ```\n */\nconst Table = memo(({ className, ...props }: React.ComponentProps<'table'>) => {\n  return <table data-slot=\"table\" className={cn('w-full caption-bottom text-sm', className)} {...props} />;\n});\nTable.displayName = 'Table';\n\n/** The `<thead>` element containing one or more header rows. */\nconst TableHeader = memo(({ className, ...props }: React.ComponentProps<'thead'>) => {\n  return <thead data-slot=\"table-header\" className={cn('[&_tr:not(:last-child)_td]:border-b', className)} {...props} />;\n});\nTableHeader.displayName = 'TableHeader';\n\n/** The `<tbody>` element containing data rows with hover and selection styling. */\nconst TableBody = memo(({ className, ...props }: React.ComponentProps<'tbody'>) => {\n  return (\n    <tbody\n      data-slot=\"table-body\"\n      className={cn(\n        '[&_tr:last-child]:border-0',\n        '[&_tr]:hover:bg-muted-muted/50',\n        '[&_tr]:active:bg-muted-muted',\n        '[&_tr]:data-[state=selected]:bg-muted',\n        '[&_tr]:border-border-weak',\n        '[&_tr]:border-b',\n        '[&_tr]:transition-colors',\n        className\n      )}\n      {...props}\n    />\n  );\n});\nTableBody.displayName = 'TableBody';\n\n/** The `<tfoot>` element for summary or aggregate rows at the bottom of the table. */\nconst TableFooter = memo(({ className, ...props }: React.ComponentProps<'tfoot'>) => {\n  return <tfoot data-slot=\"table-footer\" className={cn('border-border-weak border-t font-medium [&>tr]:last:border-b-0', className)} {...props} />;\n});\nTableFooter.displayName = 'TableFooter';\n\n/** A single `<tr>` row used inside TableHeader, TableBody, or TableFooter. */\nconst TableRow = memo(({ className, ...props }: React.ComponentProps<'tr'>) => {\n  return <tr data-slot=\"table-row\" className={className} {...props} />;\n});\nTableRow.displayName = 'TableRow';\n\n/** A `<th>` column header cell with medium-weight text and left alignment. */\nconst TableHead = memo(({ className, ...props }: React.ComponentProps<'th'>) => {\n  return (\n    <th\n      data-slot=\"table-head\"\n      className={cn(\n        'text-text-positive-weak',\n        'h-10 whitespace-nowrap px-2 text-left align-middle font-medium',\n        '[&:has([role=checkbox])]:pr-0',\n        '[&>[role=checkbox]]:translate-y-0.5',\n        className\n      )}\n      {...props}\n    />\n  );\n});\nTableHead.displayName = 'TableHead';\n\n/** A standard `<td>` data cell used inside a TableRow. */\nconst TableCell = memo(({ className, ...props }: React.ComponentProps<'td'>) => {\n  return <td data-slot=\"table-cell\" className={className} {...props} />;\n});\nTableCell.displayName = 'TableCell';\n\n/** An accessible `<caption>` element displayed below the table. */\nconst TableCaption = memo(({ className, ...props }: React.ComponentProps<'caption'>) => {\n  return <caption data-slot=\"table-caption\" className={cn('text-text-positive-muted mt-4 text-sm', className)} {...props} />;\n});\nTableCaption.displayName = 'TableCaption';\n\nexport { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow };\n"],"mappings":"sIAiCA,MAAM,EAAQ,GAAM,CAAE,YAAW,GAAG,KAC3B,EAAC,QAAA,CAAM,YAAU,QAAQ,UAAW,EAAG,gCAAiC,EAAU,CAAE,GAAI,GAAS,CACxG,CACF,EAAM,YAAc,QAGpB,MAAM,EAAc,GAAM,CAAE,YAAW,GAAG,KACjC,EAAC,QAAA,CAAM,YAAU,eAAe,UAAW,EAAG,sCAAuC,EAAU,CAAE,GAAI,GAAS,CACrH,CACF,EAAY,YAAc,cAG1B,MAAM,EAAY,GAAM,CAAE,YAAW,GAAG,KAEpC,EAAC,QAAA,CACC,YAAU,aACV,UAAW,EACT,6BACA,iCACA,+BACA,wCACA,4BACA,kBACA,2BACA,EACD,CACD,GAAI,GACJ,CAEJ,CACF,EAAU,YAAc,YAGxB,MAAM,EAAc,GAAM,CAAE,YAAW,GAAG,KACjC,EAAC,QAAA,CAAM,YAAU,eAAe,UAAW,EAAG,iEAAkE,EAAU,CAAE,GAAI,GAAS,CAChJ,CACF,EAAY,YAAc,cAG1B,MAAM,EAAW,GAAM,CAAE,YAAW,GAAG,KAC9B,EAAC,KAAA,CAAG,YAAU,YAAuB,YAAW,GAAI,GAAS,CACpE,CACF,EAAS,YAAc,WAGvB,MAAM,EAAY,GAAM,CAAE,YAAW,GAAG,KAEpC,EAAC,KAAA,CACC,YAAU,aACV,UAAW,EACT,0BACA,iEACA,gCACA,sCACA,EACD,CACD,GAAI,GACJ,CAEJ,CACF,EAAU,YAAc,YAGxB,MAAM,EAAY,GAAM,CAAE,YAAW,GAAG,KAC/B,EAAC,KAAA,CAAG,YAAU,aAAwB,YAAW,GAAI,GAAS,CACrE,CACF,EAAU,YAAc,YAGxB,MAAM,EAAe,GAAM,CAAE,YAAW,GAAG,KAClC,EAAC,UAAA,CAAQ,YAAU,gBAAgB,UAAW,EAAG,wCAAyC,EAAU,CAAE,GAAI,GAAS,CAC1H,CACF,EAAa,YAAc"}

package/dist/ui/tabs.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);let t=require(`@customafk/react-toolkit/utils`),n=require(`react/jsx-runtime`),r=require(`radix-ui`);function i({className:e,...i}){return(0,n.jsx)(r.Tabs.Root,{"data-slot":`tabs`,className:(0,t.cn)(`flex flex-col gap-2`,e),...i})}function a({className:e,...i}){return(0,n.jsx)(r.Tabs.List,{"data-slot":`tabs-list`,className:(0,t.cn)(`inline-flex h-9 w-fit items-center justify-center gap-x-1 rounded-sm bg-muted-muted p-1`,e),...i})}function o({className:e,...i}){return(0,n.jsx)(r.Tabs.Trigger,{"data-slot":`tabs-trigger`,className:(0,t.cn)(`text-text-positive-weak`,`inline-flex h-[calc(100%-1px)] min-w-32 flex-1 cursor-pointer items-center justify-center gap-1.5`,`rounded-sm`,`whitespace-nowrap border border-transparent px-2 py-1 font-medium text-sm transition`,`data-[state=active]:shadow-card`,`data-[state=active]:bg-background`,`disabled:opacity-50`,`disabled:pointer-events-none`,`focus-visible:border-primary`,`focus-visible:ring-4`,`focus-visible:ring-primary-weak`,`focus-visible:outline-1`,`focus-visible:outline-primary`,`[&_svg]:pointer-events-none`,`[&_svg]:shrink-0`,`[&_svg:not([class*='size-'])]:size-4`,e),...i})}function s({className:e,...i}){return(0,n.jsx)(r.Tabs.Content,{"data-slot":`tabs-content`,className:(0,t.cn)(`flex-1 outline-none`,e),...i})}exports.Tabs=i,exports.TabsContent=s,exports.TabsList=a,exports.TabsTrigger=o;
+"use client";const e=require(`../chunk-350yNsax.cjs`);let t=require(`@customafk/react-toolkit/utils`),n=require(`react/jsx-runtime`),r=require(`radix-ui`);function i({className:e,...i}){return(0,n.jsx)(r.Tabs.Root,{"data-slot":`tabs`,className:(0,t.cn)(`flex flex-col gap-2`,e),...i})}function a({className:e,...i}){return(0,n.jsx)(r.Tabs.List,{"data-slot":`tabs-list`,className:(0,t.cn)(`inline-flex h-9 w-fit items-center justify-center gap-x-1 rounded-sm bg-muted-muted p-1`,e),...i})}function o({className:e,...i}){return(0,n.jsx)(r.Tabs.Trigger,{"data-slot":`tabs-trigger`,className:(0,t.cn)(`text-text-positive-weak`,`inline-flex h-[calc(100%-1px)] min-w-32 flex-1 cursor-pointer items-center justify-center gap-1.5`,`rounded-sm`,`whitespace-nowrap border border-transparent px-2 py-1 font-medium text-sm transition`,`data-[state=active]:shadow-card`,`data-[state=active]:bg-background`,`disabled:opacity-50`,`disabled:pointer-events-none`,`focus-visible:border-primary`,`focus-visible:ring-4`,`focus-visible:ring-primary-weak`,`focus-visible:outline-1`,`focus-visible:outline-primary`,`[&_svg]:pointer-events-none`,`[&_svg]:shrink-0`,`[&_svg:not([class*='size-'])]:size-4`,e),...i})}function s({className:e,...i}){return(0,n.jsx)(r.Tabs.Content,{"data-slot":`tabs-content`,className:(0,t.cn)(`flex-1 outline-none`,e),...i})}exports.Tabs=i,exports.TabsContent=s,exports.TabsList=a,exports.TabsTrigger=o;
 //# sourceMappingURL=tabs.cjs.map

package/dist/ui/tabs.d.cts

@@ -1,4 +1,4 @@
-import * as react287 from "react";
+import * as react295 from "react";
 import { Tabs as Tabs$1 } from "radix-ui";
 
 //#region packages/components/ui/tabs.d.ts
@@ -23,22 +23,22 @@ import { Tabs as Tabs$1 } from "radix-ui";
 declare function Tabs({
   className,
   ...props
-}: React.ComponentProps<typeof Tabs$1.Root>): react287.JSX.Element;
+}: React.ComponentProps<typeof Tabs$1.Root>): react295.JSX.Element;
 /** Container that holds the row of `TabsTrigger` buttons with a muted background pill style. */
 declare function TabsList({
   className,
   ...props
-}: React.ComponentProps<typeof Tabs$1.List>): react287.JSX.Element;
+}: React.ComponentProps<typeof Tabs$1.List>): react295.JSX.Element;
 /** Individual tab button that activates its associated `TabsContent` panel when clicked. */
 declare function TabsTrigger({
   className,
   ...props
-}: React.ComponentProps<typeof Tabs$1.Trigger>): react287.JSX.Element;
+}: React.ComponentProps<typeof Tabs$1.Trigger>): react295.JSX.Element;
 /** Panel whose visibility is controlled by the active `TabsTrigger`; each panel must have a matching `value`. */
 declare function TabsContent({
   className,
   ...props
-}: React.ComponentProps<typeof Tabs$1.Content>): react287.JSX.Element;
+}: React.ComponentProps<typeof Tabs$1.Content>): react295.JSX.Element;
 //#endregion
 export { Tabs, TabsContent, TabsList, TabsTrigger };
 //# sourceMappingURL=tabs.d.cts.map

package/dist/ui/tabs.d.mts

@@ -0,0 +1,44 @@
+import * as react293 from "react";
+import { Tabs as Tabs$1 } from "radix-ui";
+
+//#region packages/components/ui/tabs.d.ts
+
+/**
+ * Keyboard-accessible tabbed panel built on Radix UI's Tabs primitives, composed from `Tabs`, `TabsList`, `TabsTrigger`, and `TabsContent`.
+ *
+ * @example
+ * ```tsx
+ * import { Tabs, TabsList, TabsTrigger, TabsContent } from '@customafk/lunas-ui/ui/tabs';
+ *
+ * <Tabs defaultValue="overview">
+ *   <TabsList>
+ *     <TabsTrigger value="overview">Overview</TabsTrigger>
+ *     <TabsTrigger value="settings">Settings</TabsTrigger>
+ *   </TabsList>
+ *   <TabsContent value="overview">Overview content here.</TabsContent>
+ *   <TabsContent value="settings">Settings content here.</TabsContent>
+ * </Tabs>
+ * ```
+ */
+declare function Tabs({
+  className,
+  ...props
+}: React.ComponentProps<typeof Tabs$1.Root>): react293.JSX.Element;
+/** Container that holds the row of `TabsTrigger` buttons with a muted background pill style. */
+declare function TabsList({
+  className,
+  ...props
+}: React.ComponentProps<typeof Tabs$1.List>): react293.JSX.Element;
+/** Individual tab button that activates its associated `TabsContent` panel when clicked. */
+declare function TabsTrigger({
+  className,
+  ...props
+}: React.ComponentProps<typeof Tabs$1.Trigger>): react293.JSX.Element;
+/** Panel whose visibility is controlled by the active `TabsTrigger`; each panel must have a matching `value`. */
+declare function TabsContent({
+  className,
+  ...props
+}: React.ComponentProps<typeof Tabs$1.Content>): react293.JSX.Element;
+//#endregion
+export { Tabs, TabsContent, TabsList, TabsTrigger };
+//# sourceMappingURL=tabs.d.mts.map

package/dist/ui/tabs.mjs

@@ -0,0 +1,2 @@
+"use client";import{cn as e}from"@customafk/react-toolkit/utils";import{jsx as t}from"react/jsx-runtime";import{Tabs as n}from"radix-ui";function r({className:r,...i}){return t(n.Root,{"data-slot":`tabs`,className:e(`flex flex-col gap-2`,r),...i})}function i({className:r,...i}){return t(n.List,{"data-slot":`tabs-list`,className:e(`inline-flex h-9 w-fit items-center justify-center gap-x-1 rounded-sm bg-muted-muted p-1`,r),...i})}function a({className:r,...i}){return t(n.Trigger,{"data-slot":`tabs-trigger`,className:e(`text-text-positive-weak`,`inline-flex h-[calc(100%-1px)] min-w-32 flex-1 cursor-pointer items-center justify-center gap-1.5`,`rounded-sm`,`whitespace-nowrap border border-transparent px-2 py-1 font-medium text-sm transition`,`data-[state=active]:shadow-card`,`data-[state=active]:bg-background`,`disabled:opacity-50`,`disabled:pointer-events-none`,`focus-visible:border-primary`,`focus-visible:ring-4`,`focus-visible:ring-primary-weak`,`focus-visible:outline-1`,`focus-visible:outline-primary`,`[&_svg]:pointer-events-none`,`[&_svg]:shrink-0`,`[&_svg:not([class*='size-'])]:size-4`,r),...i})}function o({className:r,...i}){return t(n.Content,{"data-slot":`tabs-content`,className:e(`flex-1 outline-none`,r),...i})}export{r as Tabs,o as TabsContent,i as TabsList,a as TabsTrigger};
+//# sourceMappingURL=tabs.mjs.map

package/dist/ui/tabs.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabs.mjs","names":["TabsPrimitive"],"sources":["../../packages/components/ui/tabs.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Tabs as TabsPrimitive } from 'radix-ui';\n\n/**\n * Keyboard-accessible tabbed panel built on Radix UI's Tabs primitives, composed from `Tabs`, `TabsList`, `TabsTrigger`, and `TabsContent`.\n *\n * @example\n * ```tsx\n * import { Tabs, TabsList, TabsTrigger, TabsContent } from '@customafk/lunas-ui/ui/tabs';\n *\n * <Tabs defaultValue=\"overview\">\n *   <TabsList>\n *     <TabsTrigger value=\"overview\">Overview</TabsTrigger>\n *     <TabsTrigger value=\"settings\">Settings</TabsTrigger>\n *   </TabsList>\n *   <TabsContent value=\"overview\">Overview content here.</TabsContent>\n *   <TabsContent value=\"settings\">Settings content here.</TabsContent>\n * </Tabs>\n * ```\n */\nfunction Tabs({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Root>) {\n  return <TabsPrimitive.Root data-slot=\"tabs\" className={cn('flex flex-col gap-2', className)} {...props} />;\n}\n\n/** Container that holds the row of `TabsTrigger` buttons with a muted background pill style. */\nfunction TabsList({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.List>) {\n  return (\n    <TabsPrimitive.List\n      data-slot=\"tabs-list\"\n      className={cn('inline-flex h-9 w-fit items-center justify-center gap-x-1 rounded-sm bg-muted-muted p-1', className)}\n      {...props}\n    />\n  );\n}\n\n/** Individual tab button that activates its associated `TabsContent` panel when clicked. */\nfunction TabsTrigger({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Trigger>) {\n  return (\n    <TabsPrimitive.Trigger\n      data-slot=\"tabs-trigger\"\n      className={cn(\n        'text-text-positive-weak',\n        'inline-flex h-[calc(100%-1px)] min-w-32 flex-1 cursor-pointer items-center justify-center gap-1.5',\n        'rounded-sm',\n        'whitespace-nowrap border border-transparent px-2 py-1 font-medium text-sm transition',\n        // 'hover:bg-muted-muted/60',\n        'data-[state=active]:shadow-card',\n        'data-[state=active]:bg-background',\n        'disabled:opacity-50',\n        'disabled:pointer-events-none',\n        'focus-visible:border-primary',\n        'focus-visible:ring-4',\n        'focus-visible:ring-primary-weak',\n        'focus-visible:outline-1',\n        'focus-visible:outline-primary',\n        '[&_svg]:pointer-events-none',\n        '[&_svg]:shrink-0',\n        \"[&_svg:not([class*='size-'])]:size-4\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Panel whose visibility is controlled by the active `TabsTrigger`; each panel must have a matching `value`. */\nfunction TabsContent({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Content>) {\n  return <TabsPrimitive.Content data-slot=\"tabs-content\" className={cn('flex-1 outline-none', className)} {...props} />;\n}\n\nexport { Tabs, TabsContent, TabsList, TabsTrigger };\n"],"mappings":"yIAuBA,SAAS,EAAK,CAAE,YAAW,GAAG,GAA0D,CACtF,OAAO,EAACA,EAAc,KAAA,CAAK,YAAU,OAAO,UAAW,EAAG,sBAAuB,EAAU,CAAE,GAAI,GAAS,CAI5G,SAAS,EAAS,CAAE,YAAW,GAAG,GAA0D,CAC1F,OACE,EAACA,EAAc,KAAA,CACb,YAAU,YACV,UAAW,EAAG,0FAA2F,EAAU,CACnH,GAAI,GACJ,CAKN,SAAS,EAAY,CAAE,YAAW,GAAG,GAA6D,CAChG,OACE,EAACA,EAAc,QAAA,CACb,YAAU,eACV,UAAW,EACT,0BACA,oGACA,aACA,uFAEA,kCACA,oCACA,sBACA,+BACA,+BACA,uBACA,kCACA,0BACA,gCACA,8BACA,mBACA,uCACA,EACD,CACD,GAAI,GACJ,CAKN,SAAS,EAAY,CAAE,YAAW,GAAG,GAA6D,CAChG,OAAO,EAACA,EAAc,QAAA,CAAQ,YAAU,eAAe,UAAW,EAAG,sBAAuB,EAAU,CAAE,GAAI,GAAS"}

package/dist/ui/textarea.cjs

@@ -1,2 +1 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);let t=require(`@customafk/react-toolkit/utils`),n=require(`react/jsx-runtime`),r=require(`react`);function i({className:e,onChange:i,onValueChange:a,...o}){let s=(0,r.useCallback)(e=>{i?.(e),a?.(e.target.value)},[i,a]);return(0,n.jsx)(`textarea`,{"data-slot":`textarea`,className:(0,t.cn)(`flex min-h-24 w-full bg-transparent px-3 py-2`,`rounded shadow-input transition-[color,box-shadow] duration-200`,`resize-y text-sm text-text-positive-weak tabular-nums caret-primary`,`-outline-offset-1 outline-1 outline-border`,`placeholder:text-text-positive-muted`,`focus:text-text-positive focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak`,`read-only:pointer-events-none read-only:bg-muted-muted read-only:placeholder:text-text-positive-weak`,`aria-invalid:bg-danger-bg-subtle`,`aria-invalid:outline-danger`,`aria-invalid:ring-danger-weak`,`aria-invalid:focus:outline-danger-strong`,`aria-invalid:focus:ring-4`,`aria-invalid:placeholder:text-text-positive-weak`,`disabled:cursor-not-allowed disabled:opacity-50`,`disabled:pointer-events-none`,`disabled:border-border-weak/50 disabled:bg-secondary-muted/10`,e),...o,onChange:s})}exports.Textarea=i;
-//# sourceMappingURL=textarea.cjs.map
+"use client";const e=require(`../textarea-Cc9CF8wD.cjs`);exports.Textarea=e.t;

package/dist/ui/textarea.d.cts

@@ -1,4 +1,4 @@
-import * as react185 from "react";
+import * as react291 from "react";
 
 //#region packages/components/ui/textarea.d.ts
 
@@ -24,7 +24,7 @@ declare function Textarea({
 }: React.ComponentProps<'textarea'> & {
   /** Convenience callback that receives the raw string value on every change, bypassing the synthetic event. */
   onValueChange?: (value: string) => void;
-}): react185.JSX.Element;
+}): react291.JSX.Element;
 //#endregion
 export { Textarea };
 //# sourceMappingURL=textarea.d.cts.map

package/dist/ui/textarea.d.mts

@@ -0,0 +1,30 @@
+import * as react292 from "react";
+
+//#region packages/components/ui/textarea.d.ts
+
+/**
+ * Styled multi-line text area built on the native `<textarea>` element with resize, focus, and validation state styles.
+ *
+ * @example
+ * ```tsx
+ * import { Textarea } from '@customafk/lunas-ui/ui/textarea';
+ *
+ * <Textarea
+ *   placeholder="Write a description…"
+ *   rows={4}
+ *   onValueChange={(value) => console.log(value)}
+ * />
+ * ```
+ */
+declare function Textarea({
+  className,
+  onChange,
+  onValueChange,
+  ...props
+}: React.ComponentProps<'textarea'> & {
+  /** Convenience callback that receives the raw string value on every change, bypassing the synthetic event. */
+  onValueChange?: (value: string) => void;
+}): react292.JSX.Element;
+//#endregion
+export { Textarea };
+//# sourceMappingURL=textarea.d.mts.map

package/dist/ui/textarea.mjs

@@ -0,0 +1 @@
+"use client";import{t as e}from"../textarea-7HDXcaK9.mjs";export{e as Textarea};

package/dist/ui/toggle-group.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);let t=require(`@customafk/react-toolkit/utils`),n=require(`react/jsx-runtime`),r=require(`react`),i=require(`radix-ui`),a=require(`@/components/ui/toggle`);const o=(0,r.createContext)({size:`default`,variant:`default`});function s({className:e,variant:r,size:a,children:s,...c}){return(0,n.jsx)(i.ToggleGroup.Root,{"data-slot":`toggle-group`,"data-variant":r,"data-size":a,className:(0,t.cn)(`group/toggle-group flex w-fit items-center rounded-md data-[variant=outline]:shadow-xs`,e),...c,children:(0,n.jsx)(o.Provider,{value:{variant:r,size:a},children:s})})}function c({className:e,children:s,variant:c,size:l,...u}){let d=(0,r.use)(o);return(0,n.jsx)(i.ToggleGroup.Item,{"data-slot":`toggle-group-item`,"data-variant":d.variant||c,"data-size":d.size||l,className:(0,t.cn)((0,a.toggleVariants)({variant:d.variant||c,size:d.size||l}),`min-w-0 flex-1 shrink-0 rounded-none shadow-none first:rounded-l-md last:rounded-r-md focus:z-10 focus-visible:z-10 data-[variant=outline]:border-l-0 data-[variant=outline]:first:border-l`,e),...u,children:s})}exports.ToggleGroup=s,exports.ToggleGroupItem=c;
+"use client";const e=require(`../chunk-350yNsax.cjs`),t=require(`./toggle.cjs`);let n=require(`react`),r=require(`@customafk/react-toolkit/utils`),i=require(`react/jsx-runtime`),a=require(`radix-ui`);const o=(0,n.createContext)({size:`default`,variant:`default`});function s({className:e,variant:t,size:n,children:s,...c}){return(0,i.jsx)(a.ToggleGroup.Root,{"data-slot":`toggle-group`,"data-variant":t,"data-size":n,className:(0,r.cn)(`group/toggle-group flex w-fit items-center rounded-md data-[variant=outline]:shadow-xs`,e),...c,children:(0,i.jsx)(o.Provider,{value:{variant:t,size:n},children:s})})}function c({className:e,children:s,variant:c,size:l,...u}){let d=(0,n.use)(o);return(0,i.jsx)(a.ToggleGroup.Item,{"data-slot":`toggle-group-item`,"data-variant":d.variant||c,"data-size":d.size||l,className:(0,r.cn)(t.toggleVariants({variant:d.variant||c,size:d.size||l}),`min-w-0 flex-1 shrink-0 rounded-none shadow-none first:rounded-l-md last:rounded-r-md focus:z-10 focus-visible:z-10 data-[variant=outline]:border-l-0 data-[variant=outline]:first:border-l`,e),...u,children:s})}exports.ToggleGroup=s,exports.ToggleGroupItem=c;
 //# sourceMappingURL=toggle-group.cjs.map

package/dist/ui/toggle-group.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"toggle-group.cjs","names":["ToggleGroupPrimitive"],"sources":["../../packages/components/ui/toggle-group.tsx"],"sourcesContent":["'use client';\nimport { createContext, use } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport type { VariantProps } from 'class-variance-authority';\nimport { ToggleGroup as ToggleGroupPrimitive } from 'radix-ui';\nimport { toggleVariants } from '@/components/ui/toggle';\n\nconst ToggleGroupContext = createContext<VariantProps<typeof toggleVariants>>({\n  size: 'default',\n  variant: 'default',\n});\n\n/**\n * A group of connected Toggle buttons where one or multiple items can be active at a time.\n *\n * @example\n * ```tsx\n * import { ToggleGroup, ToggleGroupItem } from '@customafk/lunas-ui/ui/toggle-group';\n *\n * <ToggleGroup type=\"single\" variant=\"outline\">\n *   <ToggleGroupItem value=\"left\">Left</ToggleGroupItem>\n *   <ToggleGroupItem value=\"center\">Center</ToggleGroupItem>\n *   <ToggleGroupItem value=\"right\">Right</ToggleGroupItem>\n * </ToggleGroup>\n * ```\n */\nfunction ToggleGroup({\n  className,\n  variant,\n  size,\n  children,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Root> & VariantProps<typeof toggleVariants>) {\n  return (\n    <ToggleGroupPrimitive.Root\n      data-slot=\"toggle-group\"\n      data-variant={variant}\n      data-size={size}\n      className={cn('group/toggle-group flex w-fit items-center rounded-md data-[variant=outline]:shadow-xs', className)}\n      {...props}\n    >\n      <ToggleGroupContext.Provider value={{ variant, size }}>{children}</ToggleGroupContext.Provider>\n    </ToggleGroupPrimitive.Root>\n  );\n}\n\n/** A single item/button within a ToggleGroup that inherits the group's variant and size. */\nfunction ToggleGroupItem({\n  className,\n  children,\n  variant,\n  size,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Item> & VariantProps<typeof toggleVariants>) {\n  const context = use(ToggleGroupContext);\n\n  return (\n    <ToggleGroupPrimitive.Item\n      data-slot=\"toggle-group-item\"\n      data-variant={context.variant || variant}\n      data-size={context.size || size}\n      className={cn(\n        toggleVariants({\n          variant: context.variant || variant,\n          size: context.size || size,\n        }),\n        'min-w-0 flex-1 shrink-0 rounded-none shadow-none first:rounded-l-md last:rounded-r-md focus:z-10 focus-visible:z-10 data-[variant=outline]:border-l-0 data-[variant=outline]:first:border-l',\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </ToggleGroupPrimitive.Item>\n  );\n}\n\nexport { ToggleGroup, ToggleGroupItem };\n"],"mappings":"kNASA,MAAM,GAAA,EAAA,EAAA,eAAwE,CAC5E,KAAM,UACN,QAAS,UACV,CAAC,CAgBF,SAAS,EAAY,CACnB,YACA,UACA,OACA,WACA,GAAG,GAC4F,CAC/F,OACE,EAAA,EAAA,KAACA,EAAAA,YAAqB,KAAA,CACpB,YAAU,eACV,eAAc,EACd,YAAW,EACX,WAAA,EAAA,EAAA,IAAc,yFAA0F,EAAU,CAClH,GAAI,YAEJ,EAAA,EAAA,KAAC,EAAmB,SAAA,CAAS,MAAO,CAAE,UAAS,OAAM,CAAG,YAAuC,EACrE,CAKhC,SAAS,EAAgB,CACvB,YACA,WACA,UACA,OACA,GAAG,GAC4F,CAC/F,IAAM,GAAA,EAAA,EAAA,KAAc,EAAmB,CAEvC,OACE,EAAA,EAAA,KAACA,EAAAA,YAAqB,KAAA,CACpB,YAAU,oBACV,eAAc,EAAQ,SAAW,EACjC,YAAW,EAAQ,MAAQ,EAC3B,WAAA,EAAA,EAAA,KAAA,EAAA,EAAA,gBACiB,CACb,QAAS,EAAQ,SAAW,EAC5B,KAAM,EAAQ,MAAQ,EACvB,CAAC,CACF,8LACA,EACD,CACD,GAAI,EAEH,YACyB"}
+{"version":3,"file":"toggle-group.cjs","names":["ToggleGroupPrimitive","toggleVariants"],"sources":["../../packages/components/ui/toggle-group.tsx"],"sourcesContent":["'use client';\nimport { createContext, use } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport type { VariantProps } from 'class-variance-authority';\nimport { ToggleGroup as ToggleGroupPrimitive } from 'radix-ui';\nimport { toggleVariants } from '@/components/ui/toggle';\n\nconst ToggleGroupContext = createContext<VariantProps<typeof toggleVariants>>({\n  size: 'default',\n  variant: 'default',\n});\n\n/**\n * A group of connected Toggle buttons where one or multiple items can be active at a time.\n *\n * @example\n * ```tsx\n * import { ToggleGroup, ToggleGroupItem } from '@customafk/lunas-ui/ui/toggle-group';\n *\n * <ToggleGroup type=\"single\" variant=\"outline\">\n *   <ToggleGroupItem value=\"left\">Left</ToggleGroupItem>\n *   <ToggleGroupItem value=\"center\">Center</ToggleGroupItem>\n *   <ToggleGroupItem value=\"right\">Right</ToggleGroupItem>\n * </ToggleGroup>\n * ```\n */\nfunction ToggleGroup({\n  className,\n  variant,\n  size,\n  children,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Root> & VariantProps<typeof toggleVariants>) {\n  return (\n    <ToggleGroupPrimitive.Root\n      data-slot=\"toggle-group\"\n      data-variant={variant}\n      data-size={size}\n      className={cn('group/toggle-group flex w-fit items-center rounded-md data-[variant=outline]:shadow-xs', className)}\n      {...props}\n    >\n      <ToggleGroupContext.Provider value={{ variant, size }}>{children}</ToggleGroupContext.Provider>\n    </ToggleGroupPrimitive.Root>\n  );\n}\n\n/** A single item/button within a ToggleGroup that inherits the group's variant and size. */\nfunction ToggleGroupItem({\n  className,\n  children,\n  variant,\n  size,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Item> & VariantProps<typeof toggleVariants>) {\n  const context = use(ToggleGroupContext);\n\n  return (\n    <ToggleGroupPrimitive.Item\n      data-slot=\"toggle-group-item\"\n      data-variant={context.variant || variant}\n      data-size={context.size || size}\n      className={cn(\n        toggleVariants({\n          variant: context.variant || variant,\n          size: context.size || size,\n        }),\n        'min-w-0 flex-1 shrink-0 rounded-none shadow-none first:rounded-l-md last:rounded-r-md focus:z-10 focus-visible:z-10 data-[variant=outline]:border-l-0 data-[variant=outline]:first:border-l',\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </ToggleGroupPrimitive.Item>\n  );\n}\n\nexport { ToggleGroup, ToggleGroupItem };\n"],"mappings":"wMASA,MAAM,GAAA,EAAA,EAAA,eAAwE,CAC5E,KAAM,UACN,QAAS,UACV,CAAC,CAgBF,SAAS,EAAY,CACnB,YACA,UACA,OACA,WACA,GAAG,GAC4F,CAC/F,OACE,EAAA,EAAA,KAACA,EAAAA,YAAqB,KAAA,CACpB,YAAU,eACV,eAAc,EACd,YAAW,EACX,WAAA,EAAA,EAAA,IAAc,yFAA0F,EAAU,CAClH,GAAI,YAEJ,EAAA,EAAA,KAAC,EAAmB,SAAA,CAAS,MAAO,CAAE,UAAS,OAAM,CAAG,YAAuC,EACrE,CAKhC,SAAS,EAAgB,CACvB,YACA,WACA,UACA,OACA,GAAG,GAC4F,CAC/F,IAAM,GAAA,EAAA,EAAA,KAAc,EAAmB,CAEvC,OACE,EAAA,EAAA,KAACA,EAAAA,YAAqB,KAAA,CACpB,YAAU,oBACV,eAAc,EAAQ,SAAW,EACjC,YAAW,EAAQ,MAAQ,EAC3B,WAAA,EAAA,EAAA,IACEC,EAAAA,eAAe,CACb,QAAS,EAAQ,SAAW,EAC5B,KAAM,EAAQ,MAAQ,EACvB,CAAC,CACF,8LACA,EACD,CACD,GAAI,EAEH,YACyB"}

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

@@ -1,7 +1,7 @@
-import * as react224 from "react";
+import { toggleVariants } from "./toggle.cjs";
+import * as react292 from "react";
 import { VariantProps } from "class-variance-authority";
 import { ToggleGroup as ToggleGroup$1 } from "radix-ui";
-import { toggleVariants } from "@/components/ui/toggle";
 
 //#region packages/components/ui/toggle-group.d.ts
 
@@ -25,7 +25,7 @@ declare function ToggleGroup({
   size,
   children,
   ...props
-}: React.ComponentProps<typeof ToggleGroup$1.Root> & VariantProps<typeof toggleVariants>): react224.JSX.Element;
+}: React.ComponentProps<typeof ToggleGroup$1.Root> & VariantProps<typeof toggleVariants>): react292.JSX.Element;
 /** A single item/button within a ToggleGroup that inherits the group's variant and size. */
 declare function ToggleGroupItem({
   className,
@@ -33,7 +33,7 @@ declare function ToggleGroupItem({
   variant,
   size,
   ...props
-}: React.ComponentProps<typeof ToggleGroup$1.Item> & VariantProps<typeof toggleVariants>): react224.JSX.Element;
+}: React.ComponentProps<typeof ToggleGroup$1.Item> & VariantProps<typeof toggleVariants>): react292.JSX.Element;
 //#endregion
 export { ToggleGroup, ToggleGroupItem };
 //# sourceMappingURL=toggle-group.d.cts.map

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

@@ -0,0 +1,39 @@
+import { toggleVariants } from "./toggle.mjs";
+import * as react297 from "react";
+import { VariantProps } from "class-variance-authority";
+import { ToggleGroup as ToggleGroup$1 } 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({
+  className,
+  variant,
+  size,
+  children,
+  ...props
+}: React.ComponentProps<typeof ToggleGroup$1.Root> & VariantProps<typeof toggleVariants>): react297.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$1.Item> & VariantProps<typeof toggleVariants>): react297.JSX.Element;
+//#endregion
+export { ToggleGroup, ToggleGroupItem };
+//# sourceMappingURL=toggle-group.d.mts.map

package/dist/ui/toggle-group.mjs

@@ -0,0 +1,2 @@
+"use client";import{toggleVariants as e}from"./toggle.mjs";import{createContext as t,use as n}from"react";import{cn as r}from"@customafk/react-toolkit/utils";import{jsx as i}from"react/jsx-runtime";import{ToggleGroup as a}from"radix-ui";const o=t({size:`default`,variant:`default`});function s({className:e,variant:t,size:n,children:s,...c}){return i(a.Root,{"data-slot":`toggle-group`,"data-variant":t,"data-size":n,className:r(`group/toggle-group flex w-fit items-center rounded-md data-[variant=outline]:shadow-xs`,e),...c,children:i(o.Provider,{value:{variant:t,size:n},children:s})})}function c({className:t,children:s,variant:c,size:l,...u}){let d=n(o);return i(a.Item,{"data-slot":`toggle-group-item`,"data-variant":d.variant||c,"data-size":d.size||l,className:r(e({variant:d.variant||c,size:d.size||l}),`min-w-0 flex-1 shrink-0 rounded-none shadow-none first:rounded-l-md last:rounded-r-md focus:z-10 focus-visible:z-10 data-[variant=outline]:border-l-0 data-[variant=outline]:first:border-l`,t),...u,children:s})}export{s as ToggleGroup,c as ToggleGroupItem};
+//# sourceMappingURL=toggle-group.mjs.map

package/dist/ui/toggle-group.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"toggle-group.mjs","names":["ToggleGroupPrimitive"],"sources":["../../packages/components/ui/toggle-group.tsx"],"sourcesContent":["'use client';\nimport { createContext, use } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport type { VariantProps } from 'class-variance-authority';\nimport { ToggleGroup as ToggleGroupPrimitive } from 'radix-ui';\nimport { toggleVariants } from '@/components/ui/toggle';\n\nconst ToggleGroupContext = createContext<VariantProps<typeof toggleVariants>>({\n  size: 'default',\n  variant: 'default',\n});\n\n/**\n * A group of connected Toggle buttons where one or multiple items can be active at a time.\n *\n * @example\n * ```tsx\n * import { ToggleGroup, ToggleGroupItem } from '@customafk/lunas-ui/ui/toggle-group';\n *\n * <ToggleGroup type=\"single\" variant=\"outline\">\n *   <ToggleGroupItem value=\"left\">Left</ToggleGroupItem>\n *   <ToggleGroupItem value=\"center\">Center</ToggleGroupItem>\n *   <ToggleGroupItem value=\"right\">Right</ToggleGroupItem>\n * </ToggleGroup>\n * ```\n */\nfunction ToggleGroup({\n  className,\n  variant,\n  size,\n  children,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Root> & VariantProps<typeof toggleVariants>) {\n  return (\n    <ToggleGroupPrimitive.Root\n      data-slot=\"toggle-group\"\n      data-variant={variant}\n      data-size={size}\n      className={cn('group/toggle-group flex w-fit items-center rounded-md data-[variant=outline]:shadow-xs', className)}\n      {...props}\n    >\n      <ToggleGroupContext.Provider value={{ variant, size }}>{children}</ToggleGroupContext.Provider>\n    </ToggleGroupPrimitive.Root>\n  );\n}\n\n/** A single item/button within a ToggleGroup that inherits the group's variant and size. */\nfunction ToggleGroupItem({\n  className,\n  children,\n  variant,\n  size,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Item> & VariantProps<typeof toggleVariants>) {\n  const context = use(ToggleGroupContext);\n\n  return (\n    <ToggleGroupPrimitive.Item\n      data-slot=\"toggle-group-item\"\n      data-variant={context.variant || variant}\n      data-size={context.size || size}\n      className={cn(\n        toggleVariants({\n          variant: context.variant || variant,\n          size: context.size || size,\n        }),\n        'min-w-0 flex-1 shrink-0 rounded-none shadow-none first:rounded-l-md last:rounded-r-md focus:z-10 focus-visible:z-10 data-[variant=outline]:border-l-0 data-[variant=outline]:first:border-l',\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </ToggleGroupPrimitive.Item>\n  );\n}\n\nexport { ToggleGroup, ToggleGroupItem };\n"],"mappings":"6OASA,MAAM,EAAqB,EAAmD,CAC5E,KAAM,UACN,QAAS,UACV,CAAC,CAgBF,SAAS,EAAY,CACnB,YACA,UACA,OACA,WACA,GAAG,GAC4F,CAC/F,OACE,EAACA,EAAqB,KAAA,CACpB,YAAU,eACV,eAAc,EACd,YAAW,EACX,UAAW,EAAG,yFAA0F,EAAU,CAClH,GAAI,WAEJ,EAAC,EAAmB,SAAA,CAAS,MAAO,CAAE,UAAS,OAAM,CAAG,YAAuC,EACrE,CAKhC,SAAS,EAAgB,CACvB,YACA,WACA,UACA,OACA,GAAG,GAC4F,CAC/F,IAAM,EAAU,EAAI,EAAmB,CAEvC,OACE,EAACA,EAAqB,KAAA,CACpB,YAAU,oBACV,eAAc,EAAQ,SAAW,EACjC,YAAW,EAAQ,MAAQ,EAC3B,UAAW,EACT,EAAe,CACb,QAAS,EAAQ,SAAW,EAC5B,KAAM,EAAQ,MAAQ,EACvB,CAAC,CACF,8LACA,EACD,CACD,GAAI,EAEH,YACyB"}

package/dist/ui/toggle.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);let t=require(`@customafk/react-toolkit/utils`),n=require(`class-variance-authority`),r=require(`react/jsx-runtime`),i=require(`radix-ui`);const a=(0,n.cva)(`inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium hover:bg-muted hover:text-muted-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive whitespace-nowrap`,{variants:{variant:{default:`bg-transparent`,outline:`border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground`},size:{default:`h-9 px-2 min-w-9`,sm:`h-8 px-1.5 min-w-8`,lg:`h-10 px-2.5 min-w-10`}},defaultVariants:{variant:`default`,size:`default`}});function o({className:e,variant:n,size:o,...s}){return(0,r.jsx)(i.Toggle.Root,{"data-slot":`toggle`,className:(0,t.cn)(a({variant:n,size:o,className:e})),...s})}exports.Toggle=o,exports.toggleVariants=a;
+"use client";const e=require(`../chunk-350yNsax.cjs`);let t=require(`@customafk/react-toolkit/utils`),n=require(`class-variance-authority`),r=require(`react/jsx-runtime`),i=require(`radix-ui`);const a=(0,n.cva)(`inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium hover:bg-muted hover:text-muted-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive whitespace-nowrap`,{variants:{variant:{default:`bg-transparent`,outline:`border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground`},size:{default:`h-9 px-2 min-w-9`,sm:`h-8 px-1.5 min-w-8`,lg:`h-10 px-2.5 min-w-10`}},defaultVariants:{variant:`default`,size:`default`}});function o({className:e,variant:n,size:o,...s}){return(0,r.jsx)(i.Toggle.Root,{"data-slot":`toggle`,className:(0,t.cn)(a({variant:n,size:o,className:e})),...s})}exports.Toggle=o,exports.toggleVariants=a;
 //# sourceMappingURL=toggle.cjs.map

package/dist/ui/toggle.d.cts

@@ -1,5 +1,5 @@
-import * as react222 from "react";
-import * as class_variance_authority_types8 from "class-variance-authority/types";
+import * as react294 from "react";
+import * as class_variance_authority_types11 from "class-variance-authority/types";
 import { VariantProps } from "class-variance-authority";
 import { Toggle as Toggle$1 } from "radix-ui";
 
@@ -7,7 +7,7 @@ import { Toggle as Toggle$1 } from "radix-ui";
 declare const toggleVariants: (props?: ({
   variant?: "default" | "outline" | null | undefined;
   size?: "sm" | "lg" | "default" | null | undefined;
-} & class_variance_authority_types8.ClassProp) | undefined) => string;
+} & class_variance_authority_types11.ClassProp) | undefined) => string;
 /**
  * A two-state button that switches between pressed (`on`) and unpressed (`off`).
  *
@@ -26,7 +26,7 @@ declare function Toggle({
   variant,
   size,
   ...props
-}: React.ComponentProps<typeof Toggle$1.Root> & VariantProps<typeof toggleVariants>): react222.JSX.Element;
+}: React.ComponentProps<typeof Toggle$1.Root> & VariantProps<typeof toggleVariants>): react294.JSX.Element;
 //#endregion
 export { Toggle, toggleVariants };
 //# sourceMappingURL=toggle.d.cts.map

package/dist/ui/toggle.d.mts

@@ -0,0 +1,32 @@
+import * as react291 from "react";
+import { VariantProps } from "class-variance-authority";
+import { Toggle as Toggle$1 } from "radix-ui";
+import * as class_variance_authority_types11 from "class-variance-authority/types";
+
+//#region packages/components/ui/toggle.d.ts
+declare const toggleVariants: (props?: ({
+  variant?: "default" | "outline" | null | undefined;
+  size?: "sm" | "lg" | "default" | null | undefined;
+} & class_variance_authority_types11.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({
+  className,
+  variant,
+  size,
+  ...props
+}: React.ComponentProps<typeof Toggle$1.Root> & VariantProps<typeof toggleVariants>): react291.JSX.Element;
+//#endregion
+export { Toggle, toggleVariants };
+//# sourceMappingURL=toggle.d.mts.map

package/dist/ui/toggle.mjs

@@ -0,0 +1,2 @@
+"use client";import{cn as e}from"@customafk/react-toolkit/utils";import{cva as t}from"class-variance-authority";import{jsx as n}from"react/jsx-runtime";import{Toggle as r}from"radix-ui";const i=t(`inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium hover:bg-muted hover:text-muted-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive whitespace-nowrap`,{variants:{variant:{default:`bg-transparent`,outline:`border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground`},size:{default:`h-9 px-2 min-w-9`,sm:`h-8 px-1.5 min-w-8`,lg:`h-10 px-2.5 min-w-10`}},defaultVariants:{variant:`default`,size:`default`}});function a({className:t,variant:a,size:o,...s}){return n(r.Root,{"data-slot":`toggle`,className:e(i({variant:a,size:o,className:t})),...s})}export{a as Toggle,i as toggleVariants};
+//# sourceMappingURL=toggle.mjs.map

package/dist/ui/toggle.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"toggle.mjs","names":["TogglePrimitive"],"sources":["../../packages/components/ui/toggle.tsx"],"sourcesContent":["'use client';\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { Toggle as TogglePrimitive } from 'radix-ui';\n\nconst toggleVariants = cva(\n  \"inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium hover:bg-muted hover:text-muted-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive whitespace-nowrap\",\n  {\n    variants: {\n      variant: {\n        default: 'bg-transparent',\n        outline: 'border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground',\n      },\n      size: {\n        default: 'h-9 px-2 min-w-9',\n        sm: 'h-8 px-1.5 min-w-8',\n        lg: 'h-10 px-2.5 min-w-10',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n    },\n  }\n);\n\n/**\n * A two-state button that switches between pressed (`on`) and unpressed (`off`).\n *\n * @example\n * ```tsx\n * import { Toggle } from '@customafk/lunas-ui/ui/toggle';\n * import { Bold } from 'lucide-react';\n *\n * <Toggle aria-label=\"Toggle bold\" variant=\"outline\">\n *   <Bold />\n * </Toggle>\n * ```\n */\nfunction Toggle({ className, variant, size, ...props }: React.ComponentProps<typeof TogglePrimitive.Root> & VariantProps<typeof toggleVariants>) {\n  return <TogglePrimitive.Root data-slot=\"toggle\" className={cn(toggleVariants({ variant, size, className }))} {...props} />;\n}\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport { Toggle, toggleVariants };\n"],"mappings":"0LAMA,MAAM,EAAiB,EACrB,gjBACA,CACE,SAAU,CACR,QAAS,CACP,QAAS,iBACT,QAAS,4FACV,CACD,KAAM,CACJ,QAAS,mBACT,GAAI,qBACJ,GAAI,uBACL,CACF,CACD,gBAAiB,CACf,QAAS,UACT,KAAM,UACP,CACF,CACF,CAeD,SAAS,EAAO,CAAE,YAAW,UAAS,OAAM,GAAG,GAAkG,CAC/I,OAAO,EAACA,EAAgB,KAAA,CAAK,YAAU,SAAS,UAAW,EAAG,EAAe,CAAE,UAAS,OAAM,YAAW,CAAC,CAAC,CAAE,GAAI,GAAS"}

package/dist/ui/tooltip.cjs

@@ -1,2 +1 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);let t=require(`@customafk/react-toolkit/utils`),n=require(`react/jsx-runtime`),r=require(`radix-ui`);function i({delayDuration:e=0,...t}){return(0,n.jsx)(r.Tooltip.Provider,{"data-slot":`tooltip-provider`,delayDuration:e,...t})}function a({...e}){return(0,n.jsx)(i,{children:(0,n.jsx)(r.Tooltip.Root,{"data-slot":`tooltip`,...e})})}function o({...e}){return(0,n.jsx)(r.Tooltip.Trigger,{"data-slot":`tooltip-trigger`,...e})}function s({className:e,sideOffset:i=0,children:a,...o}){return(0,n.jsx)(r.Tooltip.Portal,{children:(0,n.jsxs)(r.Tooltip.Content,{"data-slot":`tooltip-content`,sideOffset:i,className:(0,t.cn)(`bg-secondary-strong text-text-negative-weak shadow-dropdown outline-none`,`fade-in-0 zoom-in-95 animate-in`,`data-[state=closed]:animate-out`,`data-[state=closed]:fade-out-0`,`data-[state=closed]:zoom-out-95`,`data-[side=bottom]:slide-in-from-top-2`,`data-[side=left]:slide-in-from-right-2`,`data-[side=right]:slide-in-from-left-2`,`data-[side=top]:slide-in-from-bottom-2`,`z-50 w-fit`,`origin-(--radix-tooltip-content-transform-origin)`,`text-balance rounded-sm px-3 py-1.5 text-xs`,e),...o,children:[a,(0,n.jsx)(r.Tooltip.Arrow,{className:`z-50 size-2.5 translate-y-[calc(-50%-2px)] rotate-45 rounded-[2px] bg-secondary-strong fill-secondary-strong`})]})})}exports.Tooltip=a,exports.TooltipContent=s,exports.TooltipProvider=i,exports.TooltipTrigger=o;
-//# sourceMappingURL=tooltip.cjs.map
+"use client";const e=require(`../tooltip-CBdoIzoM.cjs`);exports.Tooltip=e.t,exports.TooltipContent=e.n,exports.TooltipProvider=e.r,exports.TooltipTrigger=e.i;

package/dist/ui/tooltip.d.cts

@@ -1,4 +1,4 @@
-import * as react218 from "react";
+import * as react299 from "react";
 import { Tooltip as Tooltip$1 } from "radix-ui";
 
 //#region packages/components/ui/tooltip.d.ts
@@ -19,7 +19,7 @@ import { Tooltip as Tooltip$1 } from "radix-ui";
 declare function TooltipProvider({
   delayDuration,
   ...props
-}: React.ComponentProps<typeof Tooltip$1.Provider>): react218.JSX.Element;
+}: React.ComponentProps<typeof Tooltip$1.Provider>): react299.JSX.Element;
 /**
  * Floating label that reveals supplementary text when the user hovers or focuses its trigger element.
  *
@@ -38,18 +38,18 @@ declare function TooltipProvider({
  */
 declare function Tooltip({
   ...props
-}: React.ComponentProps<typeof Tooltip$1.Root>): react218.JSX.Element;
+}: React.ComponentProps<typeof Tooltip$1.Root>): react299.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$1.Trigger>): react218.JSX.Element;
+}: React.ComponentProps<typeof Tooltip$1.Trigger>): react299.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$1.Content>): react218.JSX.Element;
+}: React.ComponentProps<typeof Tooltip$1.Content>): react299.JSX.Element;
 //#endregion
 export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };
 //# sourceMappingURL=tooltip.d.cts.map

package/dist/ui/tooltip.d.mts

@@ -0,0 +1,55 @@
+import * as react299 from "react";
+import { Tooltip as Tooltip$1 } 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$1.Provider>): react299.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({
+  ...props
+}: React.ComponentProps<typeof Tooltip$1.Root>): react299.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$1.Trigger>): react299.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$1.Content>): react299.JSX.Element;
+//#endregion
+export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };
+//# sourceMappingURL=tooltip.d.mts.map

package/dist/ui/tooltip.mjs

@@ -0,0 +1 @@
+"use client";import{i as e,n as t,r as n,t as r}from"../tooltip-Dxl5Wa8i.mjs";export{r as Tooltip,t as TooltipContent,n as TooltipProvider,e as TooltipTrigger};

package/dist/user-DtZy4P9d.mjs

@@ -0,0 +1,2 @@
+import{t as e}from"./paragraph-DYLaQtTV.mjs";import{t}from"./flex-B6YSJzGe.mjs";import{n,t as r}from"./avatar-fltdRVsJ.mjs";import{UserRoundIcon as i}from"lucide-react";import{jsx as a,jsxs as o}from"react/jsx-runtime";import{colorHashLight as s}from"@customafk/react-toolkit/color-hash";const c=({uuid:c,username:l,email:u})=>o(t,{"data-slot":`user-display`,wrap:!1,gap:`sm`,padding:`none`,children:[a(r,{className:`size-10 shadow-card`,children:a(n,{style:{backgroundColor:s.hex(c)},children:a(i,{size:28,className:`text-white`})})}),o(t,{vertical:!0,padding:`none`,gap:`none`,align:`start`,children:[a(e,{className:`text-sm font-medium text-text-positive`,children:l}),a(e,{variant:`sm`,className:`mt-0! text-xs text-text-positive-weak`,children:u})]})]});export{c as t};
+//# sourceMappingURL=user-DtZy4P9d.mjs.map

package/dist/user-DtZy4P9d.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"user-DtZy4P9d.mjs","names":["UserDataDisplay: React.FC<UserDataDisplayProps>"],"sources":["../packages/components/data-display/user.tsx"],"sourcesContent":["'use client';\n\nimport { UserRoundIcon } from 'lucide-react';\n\nimport { colorHashLight } from '@customafk/react-toolkit/color-hash';\n\nimport { Flex } from '../layouts/flex';\nimport { Paragraph } from '../typography/paragraph';\nimport { Avatar, AvatarFallback } from '../ui/avatar';\n\ntype UserDataDisplayProps = {\n  /** Unique identifier used to deterministically generate the avatar background colour. */\n  uuid: string;\n  /** Display name rendered as the primary line of the user card. */\n  username: string;\n  /** Email address rendered as the secondary, muted line below the username. */\n  email: string;\n};\n\n/**\n * Displays a user identity card with a colour-hashed avatar, username, and email address.\n *\n * @example\n * ```tsx\n * import { UserDataDisplay } from '@customafk/lunas-ui/data-display/user';\n *\n * <UserDataDisplay uuid=\"abc-123\" username=\"Nguyễn Văn An\" email=\"an@example.com\" />\n * ```\n */\nexport const UserDataDisplay: React.FC<UserDataDisplayProps> = ({ uuid, username, email }) => {\n  return (\n    <Flex data-slot=\"user-display\" wrap={false} gap=\"sm\" padding=\"none\">\n      <Avatar className=\"size-10 shadow-card\">\n        <AvatarFallback style={{ backgroundColor: colorHashLight.hex(uuid) }}>\n          <UserRoundIcon size={28} className=\"text-white\" />\n        </AvatarFallback>\n      </Avatar>\n      <Flex vertical padding=\"none\" gap=\"none\" align=\"start\">\n        <Paragraph className=\"text-sm font-medium text-text-positive\">{username}</Paragraph>\n        <Paragraph variant=\"sm\" className=\"mt-0! text-xs text-text-positive-weak\">\n          {email}\n        </Paragraph>\n      </Flex>\n    </Flex>\n  );\n};\n"],"mappings":"gSA6BA,MAAaA,GAAmD,CAAE,OAAM,WAAU,WAE9E,EAAC,EAAA,CAAK,YAAU,eAAe,KAAM,GAAO,IAAI,KAAK,QAAQ,iBAC3D,EAAC,EAAA,CAAO,UAAU,+BAChB,EAAC,EAAA,CAAe,MAAO,CAAE,gBAAiB,EAAe,IAAI,EAAK,CAAE,UAClE,EAAC,EAAA,CAAc,KAAM,GAAI,UAAU,cAAe,EACnC,EACV,CACT,EAAC,EAAA,CAAK,SAAA,GAAS,QAAQ,OAAO,IAAI,OAAO,MAAM,kBAC7C,EAAC,EAAA,CAAU,UAAU,kDAA0C,GAAqB,CACpF,EAAC,EAAA,CAAU,QAAQ,KAAK,UAAU,iDAC/B,GACS,CAAA,EACP,CAAA,EACF"}

package/dist/user-ii4FBhO1.cjs

@@ -0,0 +1,2 @@
+const e=require(`./chunk-350yNsax.cjs`),t=require(`./paragraph-DvTZvbzw.cjs`),n=require(`./flex-DmWmOBn5.cjs`),r=require(`./avatar-TyOphzGo.cjs`);let i=require(`lucide-react`),a=require(`react/jsx-runtime`),o=require(`@customafk/react-toolkit/color-hash`);const s=({uuid:e,username:s,email:c})=>(0,a.jsxs)(n.t,{"data-slot":`user-display`,wrap:!1,gap:`sm`,padding:`none`,children:[(0,a.jsx)(r.t,{className:`size-10 shadow-card`,children:(0,a.jsx)(r.n,{style:{backgroundColor:o.colorHashLight.hex(e)},children:(0,a.jsx)(i.UserRoundIcon,{size:28,className:`text-white`})})}),(0,a.jsxs)(n.t,{vertical:!0,padding:`none`,gap:`none`,align:`start`,children:[(0,a.jsx)(t.t,{className:`text-sm font-medium text-text-positive`,children:s}),(0,a.jsx)(t.t,{variant:`sm`,className:`mt-0! text-xs text-text-positive-weak`,children:c})]})]});Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return s}});
+//# sourceMappingURL=user-ii4FBhO1.cjs.map

package/dist/user-ii4FBhO1.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"user-ii4FBhO1.cjs","names":["UserDataDisplay: React.FC<UserDataDisplayProps>","Flex","Avatar","AvatarFallback","colorHashLight","UserRoundIcon","Paragraph"],"sources":["../packages/components/data-display/user.tsx"],"sourcesContent":["'use client';\n\nimport { UserRoundIcon } from 'lucide-react';\n\nimport { colorHashLight } from '@customafk/react-toolkit/color-hash';\n\nimport { Flex } from '../layouts/flex';\nimport { Paragraph } from '../typography/paragraph';\nimport { Avatar, AvatarFallback } from '../ui/avatar';\n\ntype UserDataDisplayProps = {\n  /** Unique identifier used to deterministically generate the avatar background colour. */\n  uuid: string;\n  /** Display name rendered as the primary line of the user card. */\n  username: string;\n  /** Email address rendered as the secondary, muted line below the username. */\n  email: string;\n};\n\n/**\n * Displays a user identity card with a colour-hashed avatar, username, and email address.\n *\n * @example\n * ```tsx\n * import { UserDataDisplay } from '@customafk/lunas-ui/data-display/user';\n *\n * <UserDataDisplay uuid=\"abc-123\" username=\"Nguyễn Văn An\" email=\"an@example.com\" />\n * ```\n */\nexport const UserDataDisplay: React.FC<UserDataDisplayProps> = ({ uuid, username, email }) => {\n  return (\n    <Flex data-slot=\"user-display\" wrap={false} gap=\"sm\" padding=\"none\">\n      <Avatar className=\"size-10 shadow-card\">\n        <AvatarFallback style={{ backgroundColor: colorHashLight.hex(uuid) }}>\n          <UserRoundIcon size={28} className=\"text-white\" />\n        </AvatarFallback>\n      </Avatar>\n      <Flex vertical padding=\"none\" gap=\"none\" align=\"start\">\n        <Paragraph className=\"text-sm font-medium text-text-positive\">{username}</Paragraph>\n        <Paragraph variant=\"sm\" className=\"mt-0! text-xs text-text-positive-weak\">\n          {email}\n        </Paragraph>\n      </Flex>\n    </Flex>\n  );\n};\n"],"mappings":"gQA6BA,MAAaA,GAAmD,CAAE,OAAM,WAAU,YAE9E,EAAA,EAAA,MAACC,EAAAA,EAAAA,CAAK,YAAU,eAAe,KAAM,GAAO,IAAI,KAAK,QAAQ,kBAC3D,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAO,UAAU,gCAChB,EAAA,EAAA,KAACC,EAAAA,EAAAA,CAAe,MAAO,CAAE,gBAAiBC,EAAAA,eAAe,IAAI,EAAK,CAAE,WAClE,EAAA,EAAA,KAACC,EAAAA,cAAAA,CAAc,KAAM,GAAI,UAAU,cAAe,EACnC,EACV,EACT,EAAA,EAAA,MAACJ,EAAAA,EAAAA,CAAK,SAAA,GAAS,QAAQ,OAAO,IAAI,OAAO,MAAM,mBAC7C,EAAA,EAAA,KAACK,EAAAA,EAAAA,CAAU,UAAU,kDAA0C,GAAqB,EACpF,EAAA,EAAA,KAACA,EAAAA,EAAAA,CAAU,QAAQ,KAAK,UAAU,iDAC/B,GACS,CAAA,EACP,CAAA,EACF"}