@customafk/lunas-ui 0.2.82 → 0.2.84

package/ai-docs.md

@@ -1,419 +0,0 @@
-# @customafk/lunas-ui — AI Reference Documentation
-
-> Optimized for AI agents (Claude, GitHub Copilot, Cursor, etc.).
-> Add a reference to this file in your project's CLAUDE.md or AI context config
-> so the assistant always has accurate import paths, prop types, and usage patterns.
-
-## Package Identity
-
-- **Package name:** `@customafk/lunas-ui`
-- **Framework:** React 19+ · TypeScript 5+
-- **Styling:** TailwindCSS v4 (CSS custom properties — stylesheet import is required)
-- **Radix UI:** primitives are wrapped — always import from `@customafk/lunas-ui/*`, never from `@radix-ui/*`
-
----
-
-## CRITICAL: Required Stylesheet Imports
-
-Import these in your root layout **before** any component renders.
-Without them all color tokens and base styles will be absent.
-
-```tsx
-import '@customafk/lunas-ui/styles/base';
-import '@customafk/lunas-ui/styles/theme';
-// Optional: enhanced typographic defaults
-import '@customafk/lunas-ui/styles/typography';
-```
-
----
-
-## Import Rules (STRICT)
-
-### Rule 1 — Named imports only; never default imports
-
-```tsx
-// ✅ CORRECT
-import { Button } from '@customafk/lunas-ui/ui/button';
-import type { ButtonProps } from '@customafk/lunas-ui/ui/button';
-
-// ❌ WRONG — no default export exists
-import Button from '@customafk/lunas-ui/ui/button';
-```
-
-### Rule 2 — Use the exact published export paths
-
-Each component has its own path that matches the `package.json` exports map exactly.
-
-```tsx
-// ✅ CORRECT
-import { Button } from '@customafk/lunas-ui/ui/button';
-import { ConfirmDialog } from '@customafk/lunas-ui/dialogs/confirm-dialog';
-import { Flex } from '@customafk/lunas-ui/layouts/flex';
-import { UserDataDisplay } from '@customafk/lunas-ui/data-display/user';
-import { Description } from '@customafk/lunas-ui/features/descriptions';
-
-// ❌ WRONG — internal source path, not shipped
-import { Button } from '@customafk/lunas-ui/packages/components/ui/button';
-
-// ❌ WRONG — missing category prefix
-import { Button } from '@customafk/lunas-ui/button';
-```
-
-### Rule 3 — Never import Radix UI primitives directly
-
-```tsx
-// ❌ WRONG
-import { AlertDialog } from '@radix-ui/react-alert-dialog';
-
-// ✅ CORRECT — use the lunas-ui wrapper
-import { AlertDialog } from '@customafk/lunas-ui/ui/alert-dialog';
-```
-
-### Rule 4 — Separate type and value imports
-
-```tsx
-import { Statistic } from '@customafk/lunas-ui/data-display/statistic';
-import type { StatisticProps } from '@customafk/lunas-ui/data-display/statistic';
-```
-
----
-
-## Component Catalog
-
-### UI Primitives — `@customafk/lunas-ui/ui/*`
-
-| Component(s) | Full import path | Key props |
-|---|---|---|
-| `Button` | `.../ui/button` | `variant`, `color`, `size`, `isLoading`, `asChild` |
-| `Input` | `.../ui/input` | All native `<input>` props |
-| `Textarea` | `.../ui/textarea` | All native `<textarea>` props |
-| `Label` | `.../ui/label` | `htmlFor` |
-| `Checkbox` | `.../ui/checkbox` | `checked`, `onCheckedChange` |
-| `Switch` | `.../ui/switch` | `checked`, `onCheckedChange` |
-| `RadioGroup` + `RadioGroupItem` | `.../ui/radio-group` | `value`, `onValueChange` |
-| `Select` + `SelectTrigger` + `SelectContent` + `SelectItem` + `SelectValue` | `.../ui/select` | Radix composition |
-| `MultiSelect` | `.../ui/multi-select` | Multi-value select |
-| `Dialog` + sub-components | `.../ui/dialog` | `open`, `onOpenChange` |
-| `AlertDialog` + sub-components | `.../ui/alert-dialog` | `open`, `onOpenChange` |
-| `Sheet` + `SheetContent` | `.../ui/sheet` | `side`: `left`\|`right`\|`top`\|`bottom` |
-| `Drawer` + `DrawerContent` | `.../ui/drawer` | Mobile-first sheet |
-| `Popover` + `PopoverContent` + `PopoverTrigger` | `.../ui/popover` | `open`, `onOpenChange` |
-| `Tooltip` + `TooltipContent` + `TooltipTrigger` + `TooltipProvider` | `.../ui/tooltip` | Wrap app with `TooltipProvider` |
-| `Badge` | `.../ui/badge` | `variant`, `color` |
-| `Card` + `CardHeader` + `CardContent` + `CardFooter` + `CardTitle` + `CardDescription` + `CardAction` | `.../ui/card` | Composition |
-| `Avatar` + `AvatarImage` + `AvatarFallback` | `.../ui/avatar` | — |
-| `Tabs` + `TabsList` + `TabsTrigger` + `TabsContent` | `.../ui/tabs` | `defaultValue`, `value`, `onValueChange` |
-| `Table` + `TableHeader` + `TableBody` + `TableRow` + `TableHead` + `TableCell` | `.../ui/table` | Semantic HTML table |
-| `Calendar` | `.../ui/calendar` | `mode`, `selected`, `onSelect` |
-| `Command` + sub-components | `.../ui/command` | Command palette |
-| `Separator` | `.../ui/separator` | `orientation`: `horizontal`\|`vertical` |
-| `ScrollArea` | `.../ui/scroll-area` | `className` for fixed height |
-| `Skeleton` | `.../ui/skeleton` | `className` for shape |
-| `Spinner` | `.../ui/spinner` | `size`, `className` |
-| `Progress` | `.../ui/progress` | `value` (0–100) |
-| `Slider` | `.../ui/slider` | `value`, `min`, `max`, `step` |
-| `Sonner` | `.../ui/sonner` | Toast — use `toast()` from `sonner` package |
-| `Pagination` | `.../ui/pagination` | Page navigation |
-| `FileUploader` | `.../ui/file-uploader` | `onUpload`, `accept`, `maxSize` |
-| `ButtonGroup` | `.../ui/button-group` | Groups buttons |
-| `DropdownMenu` + sub-components | `.../ui/dropdown-menu` | — |
-| `ContextMenu` | `.../ui/context-menu` | Right-click menu |
-| `HoverCard` + sub-components | `.../ui/hover-card` | — |
-| `Collapsible` + sub-components | `.../ui/collapsible` | — |
-| `Breadcrumb` | `.../ui/breadcrumb` | — |
-| `Carousel` + sub-components | `.../ui/carousel` | — |
-| `Toggle` | `.../ui/toggle` | — |
-| `ToggleGroup` + `ToggleGroupItem` | `.../ui/toggle-group` | — |
-| `Resizable` + sub-components | `.../ui/resizable` | — |
-| `InputOTP` | `.../ui/input-otp` | OTP / PIN input |
-| `Sidebar` | `.../ui/sidebar` | App sidebar shell |
-
-#### Button — Complete Prop Reference
-
-```tsx
-interface ButtonProps extends Omit<React.ComponentProps<'button'>, 'color'> {
-  variant?:        'default' | 'outline' | 'ghost' | 'link' | 'icon' | 'destructive'; // default: 'default'
-  color?:          'primary' | 'success' | 'danger' | 'warning' | 'muted';            // default: 'primary'
-  size?:           'sm' | 'default' | 'lg' | 'icon';                                  // default: 'default'
-  isLoading?:      boolean;    // Shows spinner + auto-disables. default: false
-  asChild?:        boolean;    // Renders child via Radix Slot.  default: false
-  innerClassName?: string;     // Classes on inner flex wrapper
-}
-```
-
----
-
-### Specialized UI Buttons — `@customafk/lunas-ui/ui/buttons/*`
-
-| Component | Full import path | Purpose |
-|---|---|---|
-| `AddNewButton` | `.../ui/buttons/add-new` | Standard "+ Add new" CTA |
-| `EditButton` | `.../ui/buttons/edit` | Edit / pencil icon |
-| `RefreshButton` | `.../ui/buttons/refresh` | Reload action |
-| `TrashButton` | `.../ui/buttons/trash` | Delete action |
-| `UploadImageButton` | `.../ui/buttons/upload-image` | Image upload trigger |
-| `SearchInput` | `.../ui/inputs/search-input` | Search field with icon |
-
----
-
-### Layout Components
-
-| Component | Full import path | Key Props |
-|---|---|---|
-| `Flex` | `.../layouts/flex` | `vertical`, `wrap`, `gap`, `justify`, `align`, `padding`, `margin`, `width` |
-| `Grid` | `.../layouts/grid` | Children grid container |
-| `CmsLayout` | `.../layouts/cms-layout` | App shell with sidebar + header |
-| `PaymentLayout` | `.../layouts/payment-layout` | Checkout page layout |
-
-#### Flex — Complete Prop Reference
-
-```tsx
-type FlexProps = {
-  vertical?: boolean;          // flex-col when true | flex-row when false (default: false)
-  wrap?:     boolean;          // flex-wrap vs flex-nowrap (default: true)
-  gap?:      'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';                          // default: 'xs'
-  justify?:  'start' | 'center' | 'end' | 'between' | 'around' | 'evenly' | 'stretch'; // default: 'start'
-  align?:    'start' | 'center' | 'end' | 'baseline' | 'stretch';                 // default: 'center'
-  padding?:  'none' | 'sm' | 'md' | 'lg' | 'xl';                                 // default: 'sm'
-  margin?:   'none' | 'sm' | 'md' | 'lg' | 'xl';                                 // default: 'none'
-  width?:    'full' | 'auto' | 'fit' | 'screen' | 'min' | 'max' | null;          // default: 'fit'
-  className?: string;
-};
-```
-
----
-
-### Typography
-
-| Component | Full import path | Key Props |
-|---|---|---|
-| `Title` | `.../typography/title` | `level` (1–6) → `<h1>`–`<h6>` |
-| `Paragraph` | `.../typography/paragraph` | `variant`, all `<p>` attrs |
-
----
-
-### Data Display — `@customafk/lunas-ui/data-display/*`
-
-Read-only components for formatted entity fields.
-
-| Component | Full import path | Key Props |
-|---|---|---|
-| `UserDataDisplay` | `.../data-display/user` | `uuid`, `username`, `email` |
-| `DateDisplay` | `.../data-display/date` | `date` (ISO string or `Date`), `format?`, `showTime?` |
-| `DateTooltip` | `.../data-display/date-tooltip` | `date` — relative label + full date on hover |
-| `NameDisplay` | `.../data-display/name` | `name` |
-| `PhoneNumberDisplay` | `.../data-display/phone-number` | `value` |
-| `CountryDisplay` | `.../data-display/country` | `country` (ISO 3166-1 alpha-2) |
-| `RoleBadge` | `.../data-display/role-badge` | `status` (role / status string) |
-| `Statistic` | `.../data-display/statistic` | `label`, `value`, `trend?` |
-| `EmptyDisplay` | `.../data-display/empty` | `label?` |
-| `DataList` + `DataListItem` | `.../data-display/data-list` | `DataListItem`: `label` + `value` |
-
----
-
-### Dialogs — `@customafk/lunas-ui/dialogs/*`
-
-All dialogs are **controlled** — manage `open` state in the parent.
-
-| Component | Full import path | Key Props |
-|---|---|---|
-| `ConfirmDialog` | `.../dialogs/confirm-dialog` | `open`, `title`, `description`, `onConfirm`, `isLoading`, `submitText`, `cancelText` |
-| `LoadingDialog` | `.../dialogs/loading-dialog` | `open`, `onOpenChange` |
-| `ErrorDialog` | `.../dialogs/error-dialog` | `open`, `title`, `onOpenChange`, `children` |
-| `DetailDialog` | `.../dialogs/detail-dialog` | `open`, `title`, `isLoading?`, `createdAt?`, `sidebar?`, `onOpenChange` |
-
-#### ConfirmDialog — Complete Prop Reference
-
-```tsx
-type ConfirmDialogProps = {
-  open?:                 boolean;
-  isLoading?:            boolean;                    // default: false
-  title:                 string;                     // required
-  description:           string;                     // required
-  cancelText?:           string;                     // default: 'Cancel'
-  submitText?:           string;                     // default: 'Confirm'
-  descriptionClassName?: string;
-  onOpenChange?:         (open: boolean) => void;
-  onConfirm?:            () => Promise<void> | void; // async-safe
-};
-```
-
----
-
-### Feature Components
-
-#### Descriptions — `@customafk/lunas-ui/features/descriptions`
-
-```tsx
-import {
-  Description,        // Outer container (border, shadow, rounded)
-  DescriptionHeader,  // title, description?, extra?, className?
-  DescriptionSection, // title? — labeled horizontal divider
-  DescriptionItem,    // label, labelColSpan? (default 3/12),
-                      // orientation? ('horizontal'|'vertical'), action?
-} from '@customafk/lunas-ui/features/descriptions';
-```
-
-Also exports typed value cells:
-`DescriptionBadge`, `DescriptionDate`, `DescriptionName`, `DescriptionEmpty`,
-`DescriptionStatistic`, `DescriptionNumberPhone`, `DescriptionImages`, `DescriptionLongtext`.
-
-#### Tables — `@customafk/lunas-ui/features/tables`
-
-TanStack React Table v8 wrapper with column helpers, filter components, and table context provider.
-
-#### TanStack Form — `@customafk/lunas-ui/features/tanstack-form`
-
-```tsx
-import {
-  useTanStackForm,        // Form factory hook — call once per form definition
-  withTanStackForm,       // HOC: connect a component to the form context
-  withTanStackFieldGroup, // HOC: wrap a group of related fields
-} from '@customafk/lunas-ui/features/tanstack-form';
-// Field components (TextField, ComboboxField, etc.) are registered in the
-// factory — use them via the form's .AppField slot, not as direct imports.
-```
-
-#### Search Modal — `@customafk/lunas-ui/features/search-modal`
-
-```tsx
-import { SearchModal } from '@customafk/lunas-ui/features/search-modal';
-// Self-contained command-palette dialog — no props required.
-```
-
----
-
-### Cards
-
-| Component | Full import path | Key Props |
-|---|---|---|
-| `SimpleCard` | `.../cards/simple-card` | `title`, `description?`, `action?`, `footer?` |
-| `ProductCard` | `.../cards/product-card` | `id`, `name`, `thumbnail`, `price` |
-| `GridProductCard` | `.../cards/grid-product-card` | `id`, `name`, `thumbnail`, `price` |
-
-### Page Components
-
-| Component | Full import path | Purpose |
-|---|---|---|
-| `NotFound` | `.../pages/NotFound` | 404 page |
-| `NotAuthorized` | `.../pages/NotAuthorized` | 403 / access denied |
-| `FeatureDeveloping` | `.../pages/FeatureDeveloping` | Coming-soon placeholder |
-| `FeatureFixing` | `.../pages/FeatureFixing` | Maintenance-mode page |
-
----
-
-## Usage Patterns (RAG Examples)
-
-### Pattern 1 — Confirm dialog before a destructive mutation
-
-```tsx
-import { useState } from 'react';
-import { Button } from '@customafk/lunas-ui/ui/button';
-import { ConfirmDialog } from '@customafk/lunas-ui/dialogs/confirm-dialog';
-
-export function DeleteUserButton({ userId, onDeleted }: {
-  userId: string;
-  onDeleted: () => void;
-}) {
-  const [open, setOpen] = useState(false);
-  const [isPending, setIsPending] = useState(false);
-
-  const handleConfirm = async () => {
-    setIsPending(true);
-    try {
-      await deleteUser(userId);
-      setOpen(false);
-      onDeleted();
-    } finally {
-      setIsPending(false);
-    }
-  };
-
-  return (
-    <>
-      <Button variant="outline" color="danger" onClick={() => setOpen(true)}>
-        Delete user
-      </Button>
-      <ConfirmDialog
-        open={open}
-        title="Delete user?"
-        description="This action is permanent and cannot be undone."
-        submitText="Yes, delete"
-        isLoading={isPending}
-        onOpenChange={setOpen}
-        onConfirm={handleConfirm}
-      />
-    </>
-  );
-}
-```
-
-### Pattern 2 — Entity detail panel with Description + Data Display
-
-```tsx
-import {
-  Description,
-  DescriptionHeader,
-  DescriptionItem,
-  DescriptionSection,
-} from '@customafk/lunas-ui/features/descriptions';
-import { UserDataDisplay } from '@customafk/lunas-ui/data-display/user';
-import { DateDisplay } from '@customafk/lunas-ui/data-display/date';
-import { RoleBadge } from '@customafk/lunas-ui/data-display/role-badge';
-import { Statistic } from '@customafk/lunas-ui/data-display/statistic';
-
-export function OrderDetailPanel({ order }: { order: Order }) {
-  return (
-    <Description>
-      <DescriptionHeader title="Order Details" description={`#${order.id}`} />
-      <DescriptionSection title="Customer" />
-      <DescriptionItem label="Account">
-        <UserDataDisplay uuid={order.customer.id} username={order.customer.name} email={order.customer.email} />
-      </DescriptionItem>
-      <DescriptionItem label="Created at">
-        <DateDisplay date={order.createdAt} showTime />
-      </DescriptionItem>
-      <DescriptionSection title="Order" />
-      <DescriptionItem label="Status">
-        <RoleBadge status={order.status} />
-      </DescriptionItem>
-      <DescriptionItem label="Total">
-        <Statistic label="VND" value={order.total} />
-      </DescriptionItem>
-    </Description>
-  );
-}
-```
-
----
-
-## Semantic Color Tokens (TailwindCSS)
-
-| Token | Usage |
-|---|---|
-| `text-text-positive` | Primary body text |
-| `text-text-positive-weak` | Secondary / muted text |
-| `text-text-positive-strong` | Emphasis / heading text |
-| `text-text-positive-muted` | Placeholder / disabled text |
-| `bg-primary` | Primary brand fill |
-| `bg-secondary-muted` | Light gray surface (table headers, label columns) |
-| `bg-card` | Card / panel background |
-| `border-border` | Default border |
-| `border-border-weak` | Subtle border / divider |
-| `text-success` | Positive / success value |
-| `text-danger` | Error / destructive value |
-| `text-warning` | Cautionary value |
-
----
-
-## Anti-patterns to Avoid
-
-| ❌ Don't | ✅ Do instead |
-|---|---|
-| `import Button from '…/ui/button'` | `import { Button } from '…/ui/button'` |
-| `import { Button } from '…/button'` | Include category: `'…/ui/button'` |
-| Import from `@radix-ui/*` directly | Use the lunas-ui wrapper |
-| Skip stylesheet imports | Always import `styles/base` + `styles/theme` |
-| `window.confirm()` for destructive actions | Use `<ConfirmDialog>` |
-| `<div className="flex gap-2">` | Use `<Flex gap="sm">` |
-| Add `disabled` manually during loading | Use `isLoading` on `<Button>` |

package/dist/action-submit-DVNxnW4-.mjs

@@ -1,2 +0,0 @@
-import{Button as e}from"./ui/button.mjs";import{K as t}from"./tanstack-form-q9hDCc0Y.mjs";import{useCallback as n}from"react";import{cn as r}from"@customafk/react-toolkit/utils";import{jsx as i}from"react/jsx-runtime";const a=({label:a,className:o})=>{let s=t(),c=n(async()=>{await s.handleSubmit({submitAction:`submit`}),s.state.isSubmitSuccessful&&s.reset()},[s]);return i(s.Subscribe,{selector:e=>({disabled:e.isPristine||!e.isValid||e.isValidating||e.isSubmitting||!e.canSubmit||e.isDefaultValue,isSubmitting:e.isSubmitting}),children:({disabled:t,isSubmitting:n})=>i(e,{type:`button`,size:`md`,disabled:t,isLoading:n,className:r(`min-h-8 min-w-32`,o),onClick:c,children:a??`Xác nhận`})})};export{a as TanStackActionSubmit};
-//# sourceMappingURL=action-submit-DVNxnW4-.mjs.map

package/dist/action-submit-kYjq-iPD.cjs

@@ -1,2 +0,0 @@
-const e=require("./ui/button.cjs"),t=require("./tanstack-form-BxqS40rB.cjs");let n=require("react"),r=require("@customafk/react-toolkit/utils"),i=require("react/jsx-runtime");const a=({label:a,className:o})=>{let s=t.K(),c=(0,n.useCallback)(async()=>{await s.handleSubmit({submitAction:`submit`}),s.state.isSubmitSuccessful&&s.reset()},[s]);return(0,i.jsx)(s.Subscribe,{selector:e=>({disabled:e.isPristine||!e.isValid||e.isValidating||e.isSubmitting||!e.canSubmit||e.isDefaultValue,isSubmitting:e.isSubmitting}),children:({disabled:t,isSubmitting:n})=>(0,i.jsx)(e.Button,{type:`button`,size:`md`,disabled:t,isLoading:n,className:(0,r.cn)(`min-h-8 min-w-32`,o),onClick:c,children:a??`Xác nhận`})})};exports.TanStackActionSubmit=a;
-//# sourceMappingURL=action-submit-kYjq-iPD.cjs.map

package/dist/actions-form-CwicJU89.cjs

@@ -1,2 +0,0 @@
-const e=require("./ui/button.cjs"),t=require("./tanstack-form-BxqS40rB.cjs");let n=require("lucide-react"),r=require("react/jsx-runtime");const i=({type:i=`create`})=>{let a=t.K();return(0,r.jsxs)(`div`,{className:`flex h-8 items-center justify-between`,children:[(0,r.jsx)(a.Subscribe,{selector:e=>({disabled:e.isPristine||e.isSubmitting}),children:({disabled:t})=>(0,r.jsx)(e.Button,{color:`muted`,variant:`outline`,type:`button`,size:`md`,disabled:t,className:`h-full min-w-32`,onClick:()=>a.reset(),children:`Hủy bỏ`})}),i===`create`&&(0,r.jsx)(a.Subscribe,{selector:e=>({disabled:e.isPristine||!e.isValid||e.isValidating||e.isSubmitting||!e.canSubmit||e.isDefaultValue,isSubmitting:e.isSubmitting}),children:({disabled:t,isSubmitting:i})=>(0,r.jsxs)(e.Button,{type:`submit`,size:`md`,disabled:t,isLoading:i,className:`h-full min-w-32`,onClick:async()=>{await a.handleSubmit({submitAction:`create`}),a.state.isSubmitSuccessful&&a.reset()},children:[(0,r.jsx)(n.PlusIcon,{}),`Thêm mới`]})}),i===`update`&&(0,r.jsx)(a.Subscribe,{selector:e=>({disabled:e.isPristine||!e.isValid||e.isValidating||e.isSubmitting||!e.canSubmit||e.isDefaultValue,isSubmitting:e.isSubmitting}),children:({disabled:t,isSubmitting:i})=>(0,r.jsxs)(e.Button,{type:`submit`,size:`md`,disabled:t,isLoading:i,className:`h-full min-w-32`,onClick:async()=>{await a.handleSubmit({submitAction:`update`}),a.state.isSubmitSuccessful&&a.reset()},children:[(0,r.jsx)(n.ArrowDownToLine,{}),`Cập nhật`]})})]})};exports.TanStackActionsForm=i;
-//# sourceMappingURL=actions-form-CwicJU89.cjs.map

package/dist/actions-form-DRrkiGzh.mjs

@@ -1,2 +0,0 @@
-import{Button as e}from"./ui/button.mjs";import{K as t}from"./tanstack-form-q9hDCc0Y.mjs";import{ArrowDownToLine as n,PlusIcon as r}from"lucide-react";import{jsx as i,jsxs as a}from"react/jsx-runtime";const o=({type:o=`create`})=>{let s=t();return a(`div`,{className:`flex h-8 items-center justify-between`,children:[i(s.Subscribe,{selector:e=>({disabled:e.isPristine||e.isSubmitting}),children:({disabled:t})=>i(e,{color:`muted`,variant:`outline`,type:`button`,size:`md`,disabled:t,className:`h-full min-w-32`,onClick:()=>s.reset(),children:`Hủy bỏ`})}),o===`create`&&i(s.Subscribe,{selector:e=>({disabled:e.isPristine||!e.isValid||e.isValidating||e.isSubmitting||!e.canSubmit||e.isDefaultValue,isSubmitting:e.isSubmitting}),children:({disabled:t,isSubmitting:n})=>a(e,{type:`submit`,size:`md`,disabled:t,isLoading:n,className:`h-full min-w-32`,onClick:async()=>{await s.handleSubmit({submitAction:`create`}),s.state.isSubmitSuccessful&&s.reset()},children:[i(r,{}),`Thêm mới`]})}),o===`update`&&i(s.Subscribe,{selector:e=>({disabled:e.isPristine||!e.isValid||e.isValidating||e.isSubmitting||!e.canSubmit||e.isDefaultValue,isSubmitting:e.isSubmitting}),children:({disabled:t,isSubmitting:r})=>a(e,{type:`submit`,size:`md`,disabled:t,isLoading:r,className:`h-full min-w-32`,onClick:async()=>{await s.handleSubmit({submitAction:`update`}),s.state.isSubmitSuccessful&&s.reset()},children:[i(n,{}),`Cập nhật`]})})]})};export{o as TanStackActionsForm};
-//# sourceMappingURL=actions-form-DRrkiGzh.mjs.map

package/dist/checkbox-field-BN3Vd9qq.mjs

@@ -1,2 +0,0 @@
-import{Checkbox as e}from"./ui/checkbox.mjs";import{G as t}from"./tanstack-form-q9hDCc0Y.mjs";import{Field as n,FieldContent as r,FieldContentMain as i,FieldDescription as a,FieldGroup as o,FieldLabel as s,FieldNote as c,FieldSeparator as l,FieldTooltip as u}from"./field-V2DoD8qL.mjs";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{useStore as p}from"@tanstack/react-form";const m=({label:m,description:h,options:g,tooltip:_,helperText:v,orientation:y})=>{let b=t(),x=p(b.form.store,({isSubmitting:e})=>e);return f(o,{className:`gap-y-4 px-4`,children:[f(n,{orientation:y,children:[f(r,{children:[f(s,{children:[m,_&&d(u,{tooltip:_})]}),d(a,{children:h}),d(c,{isShow:!!v,children:v})]}),d(i,{children:d(o,{className:`flex flex-col gap-y-2`,children:g.map(t=>f(n,{orientation:`horizontal`,children:[d(e,{id:`${b.name}-${t.value}`,name:b.name,checked:b.state.value?.includes(t.value)??!1,disabled:x,onCheckedChange:e=>{if(e&&b.state.value!==null)b.pushValue(t.value);else if(e&&b.state.value===null)b.setValue([t.value]);else if(!e&&b.state.value!==null){let e=b.state.value.indexOf(t.value);e>-1&&b.removeValue(e)}else b.setValue(null)}}),d(s,{htmlFor:`${b.name}-${t.value}`,className:`text-text-positive`,children:t.label})]},t.value))})})]}),d(l,{})]})};export{m as CheckboxField};
-//# sourceMappingURL=checkbox-field-BN3Vd9qq.mjs.map

package/dist/checkbox-field-DBUjQC_4.cjs

@@ -1,2 +0,0 @@
-const e=require("./ui/checkbox.cjs"),t=require("./tanstack-form-BxqS40rB.cjs"),n=require("./field-BSLi-P0Q.cjs");let r=require("react/jsx-runtime"),i=require("@tanstack/react-form");const a=({label:a,description:o,options:s,tooltip:c,helperText:l,orientation:u})=>{let d=t.G(),f=(0,i.useStore)(d.form.store,({isSubmitting:e})=>e);return(0,r.jsxs)(n.FieldGroup,{className:`gap-y-4 px-4`,children:[(0,r.jsxs)(n.Field,{orientation:u,children:[(0,r.jsxs)(n.FieldContent,{children:[(0,r.jsxs)(n.FieldLabel,{children:[a,c&&(0,r.jsx)(n.FieldTooltip,{tooltip:c})]}),(0,r.jsx)(n.FieldDescription,{children:o}),(0,r.jsx)(n.FieldNote,{isShow:!!l,children:l})]}),(0,r.jsx)(n.FieldContentMain,{children:(0,r.jsx)(n.FieldGroup,{className:`flex flex-col gap-y-2`,children:s.map(t=>(0,r.jsxs)(n.Field,{orientation:`horizontal`,children:[(0,r.jsx)(e.Checkbox,{id:`${d.name}-${t.value}`,name:d.name,checked:d.state.value?.includes(t.value)??!1,disabled:f,onCheckedChange:e=>{if(e&&d.state.value!==null)d.pushValue(t.value);else if(e&&d.state.value===null)d.setValue([t.value]);else if(!e&&d.state.value!==null){let e=d.state.value.indexOf(t.value);e>-1&&d.removeValue(e)}else d.setValue(null)}}),(0,r.jsx)(n.FieldLabel,{htmlFor:`${d.name}-${t.value}`,className:`text-text-positive`,children:t.label})]},t.value))})})]}),(0,r.jsx)(n.FieldSeparator,{})]})};exports.CheckboxField=a;
-//# sourceMappingURL=checkbox-field-DBUjQC_4.cjs.map

package/dist/combobox-C64Rvd7n.mjs

@@ -1,2 +0,0 @@
-import{Button as e}from"./ui/button.mjs";import{Badge as t}from"./ui/badge.mjs";import{Command as n,CommandGroup as r,CommandItem as i,CommandList as ee}from"./ui/command.mjs";import{Spinner as te}from"./ui/spinner.mjs";import{Popover as ne,PopoverContent as re,PopoverTrigger as ie}from"./ui/popover.mjs";import{inputVariants as ae}from"./ui/input.mjs";import{CheckIcon as oe,ChevronDownIcon as se,PlusIcon as ce,XIcon as a}from"lucide-react";import{forwardRef as o,useCallback as s,useEffect as c,useImperativeHandle as le,useMemo as l,useRef as u,useState as d}from"react";import{cn as f}from"@customafk/react-toolkit/utils";import{cva as ue}from"class-variance-authority";import{Fragment as p,jsx as m,jsxs as h}from"react/jsx-runtime";import{Command as de,useCommandState as g}from"cmdk";const fe=ue([`relative flex flex-wrap items-center gap-1 rounded border bg-transparent text-sm transition-shadow`,`outline-hidden`,`aria-disabled:cursor-not-allowed aria-disabled:bg-muted-muted aria-disabled:text-text-positive-weak`],{variants:{color:{normal:[`border-border-weak`,`focus-visible:border-primary focus-visible:ring-4 focus-visible:ring-primary-weak`,`data-[state=open]:border-primary data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`].join(` `),danger:[`border-danger bg-danger-bg-subtle`,`focus-visible:border-danger focus-visible:ring-4 focus-visible:ring-danger-weak`,`data-[state=open]:border-danger data-[state=open]:ring-4 data-[state=open]:ring-danger-weak`].join(` `)},size:{sm:`min-h-8 text-xs`,md:`min-h-9 text-sm`,lg:`min-h-10 text-base`}},defaultVariants:{color:`normal`,size:`md`}});function _(e){e.preventDefault(),e.stopPropagation()}function pe(e,t){let[n,r]=d(e);return c(()=>{let n=setTimeout(()=>r(e),t??500);return()=>clearTimeout(n)},[e,t]),n}function v(e,t){if(e.length===0)return{};if(!t)return{"":e};let n={};return e.forEach(e=>{let r=e[t]||``;n[r]||(n[r]=[]),n[r].push(e)}),n}function me(e,t){let n={};for(let[r,i]of Object.entries(e))n[r]=i.filter(e=>!t.has(e.value));return n}function he(e,t){return e.length===t.length&&e.every((e,n)=>e.value===t[n]?.value)}const y=o(({className:e,...t},n)=>g(e=>e.filtered.count===0)?m(`div`,{ref:n,className:f(`p-2.5 pt-1 text-center text-xs`,e),"cmdk-empty":``,role:`presentation`,...t}):null);y.displayName=`ComboboxCommandEmpty`;const b=o(({value:o,defaultValue:ue=[],onChange:g,options:b,defaultOptions:ge=[],onSearch:x,delay:_e,triggerSearchOnFocus:S=!1,groupBy:C,placeholder:w,disabled:T,color:E,size:D=`md`,loadingIndicator:ve,loadingText:ye,emptyIndicator:be,creatable:O=!1,createHint:k,createLabel:A,onCreateOption:j,maxSelected:M=2**53-1,onMaxSelected:N,hideSelectedFromList:P=!1,hideClearAllButton:xe=!1,onClearAll:Se,hideClearQueryButton:Ce=!1,onClearQuery:we,className:Te,badgeClassName:Ee,contentClassName:De,commandProps:F,inputProps:I},Oe)=>{let L=u(null),R=u(0),z=u(!0),[B,V]=d(!1),[H,ke]=d(!1),[Ae,je]=d(ue),[U,Me]=d(v(ge,C)),[W,G]=d(``),K=o??Ae,q=W.trim(),J=pe(W,_e??500),Y=s(e=>{o===void 0&&je(e),g?.(e)},[g,o]);le(Oe,()=>({selectedValue:[...K],input:L.current,focus:()=>{V(!0),L.current?.focus()},reset:()=>Y([]),clearQuery:()=>G(``)}),[K,Y]),c(()=>(z.current=!0,()=>{z.current=!1}),[]),c(()=>{B||G(``)},[B]);let X=l(()=>new Set(K.map(e=>e.value)),[K]),Z=s(e=>{Y(K.filter(t=>t.value!==e.value))},[K,Y]),Ne=s(e=>{if(X.has(e.value)){e.fixed||Z(e);return}if(K.length>=M){N?.(M);return}G(``),Y([...K,e])},[Z,M,N,K,X,Y]);c(()=>{!b||x||Me(e=>he(b,Object.values(e).flat())?e:v(b,C))},[b,C,x]),c(()=>{(async()=>{if(!x||!B||!S&&!J)return;let e=++R.current;ke(!0);let t=await x(J);!z.current||e!==R.current||(Me(v(t,C)),ke(!1))})()},[J,C,B,S,x]);let Pe=l(()=>P?me(U,X):U,[P,U,X]),Q=l(()=>{if(!O||!q||H)return!1;let e=q.toLowerCase(),t=Object.values(U).some(t=>t.some(t=>t.label.toLowerCase()===e)),n=K.some(t=>t.label.toLowerCase()===e);return!t&&!n},[O,q,H,U,K]),Fe=typeof A==`function`?A(q):A??`Create "${q}"`,Ie=typeof k==`function`?k(q):k,$=s(()=>{if(K.length>=M){N?.(M);return}let e=q;G(``),Y([...K,{value:e,label:e}]),j?.(e),V(!1)},[q,M,j,N,K,Y]),Le=s(e=>{let t=L.current;if(t){if((e.key===`Delete`||e.key===`Backspace`)&&t.value===``&&K.length>0){let e=K[K.length-1];e.fixed||Z(e)}e.key===`Enter`&&Q&&(e.preventDefault(),$())}},[$,Z,K,Q]),Re=K.some(e=>!e.fixed);return h(ne,{open:B,onOpenChange:e=>!T&&V(e),children:[m(ie,{asChild:!0,children:h(`div`,{"data-slot":`combobox-trigger`,role:`combobox`,"aria-expanded":B,"aria-haspopup":`listbox`,"aria-disabled":T||void 0,tabIndex:T?-1:0,className:f(fe({color:E,size:D}),K.length!==0&&`p-1`,!T&&`cursor-pointer`,T&&`pointer-events-none`,Te),onKeyDown:e=>{T||(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),V(e=>!e))},children:[K.length===0&&m(`span`,{className:`flex-1 truncate px-3 py-2 text-text-positive-muted`,children:w}),K.map(e=>h(t,{"data-slot":`combobox-chip`,"data-fixed":e.fixed||void 0,variant:`soft`,color:E===`danger`?`danger`:`secondary`,size:D,pill:!1,className:f(`gap-1 text-xs bg-muted-muted font-normal`,T&&`opacity-50`,Ee),children:[e.label,!e.fixed&&!T&&m(`button`,{type:`button`,"data-slot":`combobox-chip-remove`,"aria-label":`Remove ${e.label}`,onMouseDown:_,onClick:t=>{t.stopPropagation(),Z(e)},className:`ms-0.5 -me-0.5 rounded-sm outline-hidden hover:text-text-positive text-text-positive-muted`,children:m(a,{size:12,strokeWidth:2,"aria-hidden":`true`})})]},e.value)),m(se,{size:16,"aria-hidden":`true`,className:f(`ms-auto me-2 shrink-0 text-text-positive-muted transition-transform`,B&&`rotate-180`)})]})}),m(re,{align:`start`,"data-slot":`combobox-content`,className:f(`w-(--radix-popover-trigger-width) p-0`,De),children:h(n,{...F,onKeyDown:e=>{Le(e),F?.onKeyDown?.(e)},"data-slot":`combobox`,className:f(`overflow-visible bg-white`,F?.className),shouldFilter:F?.shouldFilter??!x,children:[!xe&&Re&&h(e,{type:`button`,"data-slot":`combobox-clear-all`,tabIndex:-1,size:`xs`,variant:`ghost`,color:`muted`,className:`w-fit mt-1 font-normal hover:text-text-positive`,onMouseDown:_,onClick:()=>{let e=K.filter(e=>e.fixed);Y(e),Se?.()},children:[m(a,{size:10,strokeWidth:2,"aria-hidden":`true`,className:`size-3!`}),`Clear Selected Input`]}),h(`div`,{"data-slot":`combobox-search`,className:`relative px-2.5 pt-2.5 pb-1 border-t border-t-border`,children:[m(de.Input,{...I,ref:L,"data-slot":`combobox-input`,value:W,onValueChange:e=>{G(e),I?.onValueChange?.(e)},placeholder:w,className:f(ae({size:`sm`}),`pe-8`,I?.className)}),!Ce&&W.length>0&&m(`button`,{type:`button`,"data-slot":`combobox-clear-query`,"aria-label":`Clear search`,onMouseDown:_,onClick:()=>{G(``),we?.(),L.current?.focus()},className:`absolute inset-y-6 inset-e-4 flex items-center justify-center text-text-positive-muted transition-colors hover:text-text-positive`,children:m(a,{size:14,strokeWidth:2,"aria-hidden":`true`})})]}),m(ee,{"data-slot":`combobox-list`,className:`shadow-lg outline-hidden`,onMouseDown:e=>e.preventDefault(),children:H?m(`div`,{"data-slot":`combobox-loading`,className:`flex items-center justify-center gap-2 px-2 py-6 text-sm text-text-positive-muted`,children:ve??h(p,{children:[m(te,{className:`size-4`}),ye]})}):Q?h(`div`,{"data-slot":`combobox-create`,className:`flex flex-col gap-2 p-3`,children:[Ie&&m(`p`,{className:`pe-10 text-text-positive-weak text-xs`,children:Ie}),m(`div`,{className:`flex justify-end`,children:h(e,{type:`button`,"data-slot":`combobox-create-confirm`,"aria-label":Fe,size:`xs`,variant:`outline`,color:`muted`,onMouseDown:_,onClick:$,children:[m(ce,{}),`Thêm mới`]})})]}):h(p,{children:[m(y,{"data-slot":`combobox-empty`,children:m(`div`,{className:`bg-muted-muted size-full min-h-14 flex items-center justify-center`,children:be??`No results found.`})}),m(i,{value:`__combobox-first-item-guard__`,className:`hidden`,"aria-hidden":`true`}),Object.entries(Pe).map(([e,t])=>m(r,{heading:e||void 0,value:e||`__combobox-options__`,children:t.map(e=>{let t=X.has(e.value);return h(i,{value:e.value,keywords:[e.label],disabled:e.disable,"data-picked":t||void 0,onMouseDown:_,onSelect:()=>Ne(e),className:f(`cursor-pointer justify-between`,e.disable&&`cursor-not-allowed opacity-50`,t&&`bg-primary-bg-subtle! text-primary!`),children:[e.label,t&&h(p,{children:[m(oe,{size:14,className:`ms-auto text-primary`,"aria-hidden":`true`}),m(`span`,{className:`sr-only`,children:`, selected`})]})]},e.value)})},e))]})})]})})]})});b.displayName=`Combobox`;export{b as t};
-//# sourceMappingURL=combobox-C64Rvd7n.mjs.map

package/dist/combobox-field-BE9miJ3D.cjs

@@ -1,2 +0,0 @@
-const e=require("./ui/button.cjs"),t=require("./ui/dialog.cjs"),n=require("./ui/command.cjs"),r=require("./tanstack-form-BxqS40rB.cjs"),i=require("./ui/popover.cjs"),a=require("./field-BSLi-P0Q.cjs");let o=require("lucide-react"),s=require("react"),c=require("@customafk/react-toolkit/utils"),l=require("react/jsx-runtime"),u=require("radix-ui"),d=require("@tanstack/react-form"),f=require("@customafk/react-toolkit/hooks/useMobile");const p=(0,s.memo)(({label:p,description:m,placeholder:h,tooltip:g,helperText:_,orientation:v=`responsive`,options:y,required:b=!1,disabled:x=!1,clearable:S=!1,showErrorMessage:C=!0,modal:w})=>{let T=(0,s.useId)(),E=r.G(),D=(0,f.useIsMobile)(),[O,k]=(0,s.useState)(!1),[A,j]=(0,s.useState)(!1),M=(0,d.useStore)(E.form.store,({isSubmitting:e})=>e),N=x||M,P=E.state.meta.isDirty||E.state.meta.isTouched,F=P&&!E.state.meta.isValid,I=b&&E.state.value===null,L=S&&!!E.state.value&&!N,R=E.state.meta.errors.length>0,z=y.find(({value:e})=>e===E.state.value)?.label,B=()=>{E.handleChange(null),E.handleBlur()},V=t=>(0,l.jsx)(e.Button,{variant:`outline`,color:`muted`,size:`lg`,disabled:N,"aria-invalid":F?!0:void 0,"aria-describedby":T,className:(0,c.cn)(`flex w-full items-center justify-start rounded outline-border`,`hover:bg-transparent`,`focus-visible:outline-1 focus-visible:outline-primary-strong focus-visible:ring-4 focus-visible:ring-primary-weak`,`data-[state=open]:text-text-positive-muted data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`,L&&`pr-8`,!E.state.value&&`text-text-positive-muted`,F&&`outline-danger bg-danger-bg-subtle ring-4 ring-danger-weak`),onClick:t,children:z?(0,l.jsx)(`p`,{className:`flex min-w-0 flex-1 items-center gap-2 truncate text-start`,children:z}):(0,l.jsx)(`p`,{className:`flex-1 text-start text-text-positive-muted`,children:h})}),H=e=>(0,l.jsxs)(n.Command,{className:`border-none`,children:[(0,l.jsx)(n.CommandInput,{placeholder:h??`Tìm kiếm…`}),(0,l.jsxs)(n.CommandList,{children:[(0,l.jsx)(n.CommandEmpty,{className:`flex min-h-30 items-center justify-center text-sm text-text-positive-weak`,children:`Không tìm thấy kết quả nào phù hợp.`}),(0,l.jsx)(n.CommandGroup,{className:`max-h-60 overflow-y-auto`,children:y.map(({value:t,label:r})=>(0,l.jsx)(n.CommandItem,{value:r,onSelect:()=>e(t),children:r},t))})]})]});return(0,l.jsxs)(a.FieldGroup,{className:`gap-y-4 px-4`,children:[(0,l.jsxs)(a.Field,{orientation:v,"data-invalid":F,children:[(0,l.jsxs)(a.FieldContent,{children:[(0,l.jsxs)(a.FieldLabel,{"aria-required":I,htmlFor:E.name,children:[p,g&&(0,l.jsx)(a.FieldTooltip,{tooltip:g})]}),(0,l.jsx)(a.FieldDescription,{children:m})]}),(0,l.jsx)(a.FieldContentMain,{className:`flex justify-end`,children:(0,l.jsxs)(`div`,{className:`flex w-full flex-col`,children:[(0,l.jsxs)(`div`,{className:`relative`,children:[D?(0,l.jsxs)(l.Fragment,{children:[V(()=>k(!0)),(0,l.jsx)(t.Dialog,{open:O,onOpenChange:e=>{k(e),e||E.handleBlur()},children:(0,l.jsxs)(t.DialogPortal,{children:[(0,l.jsx)(t.DialogOverlay,{}),(0,l.jsxs)(u.Dialog.Content,{onOpenAutoFocus:e=>e.preventDefault(),className:(0,c.cn)(`fixed inset-x-0 bottom-0 z-50`,`flex flex-col bg-background rounded-t-2xl outline-none`,`max-h-[80dvh] shadow-[0_-4px_24px_rgba(0,0,0,0.08)]`,`data-[state=open]:animate-in data-[state=open]:slide-in-from-bottom data-[state=open]:fade-in-0`,`data-[state=closed]:animate-out data-[state=closed]:slide-out-to-bottom data-[state=closed]:fade-out-0`,`duration-300`),children:[(0,l.jsxs)(`div`,{className:`flex items-center justify-between px-4 py-3 border-b border-border shrink-0`,children:[(0,l.jsx)(`span`,{className:`font-semibold text-sm text-text-positive`,children:p}),(0,l.jsx)(t.DialogClose,{asChild:!0,children:(0,l.jsx)(`button`,{type:`button`,"aria-label":`Đóng`,className:`flex size-7 items-center justify-center rounded-md text-text-positive-weak transition-colors hover:bg-muted-muted hover:text-text-positive`,children:(0,l.jsx)(o.XIcon,{size:16})})})]}),(0,l.jsxs)(`div`,{className:`flex flex-col overflow-y-auto`,children:[L&&(0,l.jsx)(t.DialogClose,{asChild:!0,children:(0,l.jsxs)(`button`,{type:`button`,className:`flex w-full items-center gap-x-2 px-4 py-3 text-left text-sm text-danger-strong transition-colors hover:bg-danger-bg-subtle`,onClick:B,children:[(0,l.jsx)(o.XIcon,{size:14}),`Xóa lựa chọn`]})}),H(e=>{E.handleChange(e),k(!1),E.handleBlur()})]}),(0,l.jsx)(`div`,{className:`shrink-0 h-safe-bottom`})]})]})})]}):(0,l.jsxs)(i.Popover,{open:A,modal:w,onOpenChange:e=>{j(e),e||E.handleBlur()},children:[(0,l.jsx)(i.PopoverTrigger,{asChild:!0,children:V()}),(0,l.jsx)(i.PopoverContent,{align:`end`,side:`bottom`,className:`flex w-fit rounded p-0`,children:H(e=>{E.handleChange(e),j(!1),E.handleBlur()})})]}),L&&(0,l.jsx)(`button`,{type:`button`,"aria-label":`Xóa lựa chọn`,className:`absolute right-2 top-1/2 -translate-y-1/2 flex size-4 cursor-pointer items-center justify-center rounded-md text-text-positive-weak outline-none transition-[color,transform] hover:text-text-positive focus-visible:text-primary-strong focus-visible:[&>svg]:scale-125 [&>svg]:size-3.5 [&>svg]:transition-transform`,onClick:B,children:(0,l.jsx)(o.XIcon,{"aria-hidden":`true`})})]}),P&&C&&R&&(0,l.jsx)(a.FieldError,{id:T,className:`mt-1`,errors:E.state.meta.errors}),(0,l.jsx)(a.FieldNote,{isShow:!!_,children:_})]})})]}),(0,l.jsx)(a.FieldSeparator,{})]})});p.displayName=`ComboboxField`,exports.ComboboxField=p;
-//# sourceMappingURL=combobox-field-BE9miJ3D.cjs.map

package/dist/combobox-field-Bug1qI5B.mjs

@@ -1,2 +0,0 @@
-import{Button as e}from"./ui/button.mjs";import{Dialog as t,DialogClose as n,DialogOverlay as ee,DialogPortal as te}from"./ui/dialog.mjs";import{Command as r,CommandEmpty as i,CommandGroup as a,CommandInput as o,CommandItem as s,CommandList as ne}from"./ui/command.mjs";import{G as re}from"./tanstack-form-q9hDCc0Y.mjs";import{Popover as ie,PopoverContent as c,PopoverTrigger as l}from"./ui/popover.mjs";import{Field as u,FieldContent as d,FieldContentMain as f,FieldDescription as p,FieldError as m,FieldGroup as h,FieldLabel as g,FieldNote as ae,FieldSeparator as oe,FieldTooltip as se}from"./field-V2DoD8qL.mjs";import{XIcon as _}from"lucide-react";import{memo as v,useId as y,useState as b}from"react";import{cn as x}from"@customafk/react-toolkit/utils";import{Fragment as S,jsx as C,jsxs as w}from"react/jsx-runtime";import{Dialog as T}from"radix-ui";import{useStore as E}from"@tanstack/react-form";import{useIsMobile as D}from"@customafk/react-toolkit/hooks/useMobile";const O=v(({label:v,description:O,placeholder:k,tooltip:A,helperText:j,orientation:M=`responsive`,options:N,required:P=!1,disabled:ce=!1,clearable:F=!1,showErrorMessage:I=!0,modal:L})=>{let R=y(),z=re(),B=D(),[V,H]=b(!1),[U,W]=b(!1),G=E(z.form.store,({isSubmitting:e})=>e),K=ce||G,q=z.state.meta.isDirty||z.state.meta.isTouched,J=q&&!z.state.meta.isValid,le=P&&z.state.value===null,Y=F&&!!z.state.value&&!K,ue=z.state.meta.errors.length>0,X=N.find(({value:e})=>e===z.state.value)?.label,Z=()=>{z.handleChange(null),z.handleBlur()},Q=t=>C(e,{variant:`outline`,color:`muted`,size:`lg`,disabled:K,"aria-invalid":J?!0:void 0,"aria-describedby":R,className:x(`flex w-full items-center justify-start rounded outline-border`,`hover:bg-transparent`,`focus-visible:outline-1 focus-visible:outline-primary-strong focus-visible:ring-4 focus-visible:ring-primary-weak`,`data-[state=open]:text-text-positive-muted data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`,Y&&`pr-8`,!z.state.value&&`text-text-positive-muted`,J&&`outline-danger bg-danger-bg-subtle ring-4 ring-danger-weak`),onClick:t,children:X?C(`p`,{className:`flex min-w-0 flex-1 items-center gap-2 truncate text-start`,children:X}):C(`p`,{className:`flex-1 text-start text-text-positive-muted`,children:k})}),$=e=>w(r,{className:`border-none`,children:[C(o,{placeholder:k??`Tìm kiếm…`}),w(ne,{children:[C(i,{className:`flex min-h-30 items-center justify-center text-sm text-text-positive-weak`,children:`Không tìm thấy kết quả nào phù hợp.`}),C(a,{className:`max-h-60 overflow-y-auto`,children:N.map(({value:t,label:n})=>C(s,{value:n,onSelect:()=>e(t),children:n},t))})]})]});return w(h,{className:`gap-y-4 px-4`,children:[w(u,{orientation:M,"data-invalid":J,children:[w(d,{children:[w(g,{"aria-required":le,htmlFor:z.name,children:[v,A&&C(se,{tooltip:A})]}),C(p,{children:O})]}),C(f,{className:`flex justify-end`,children:w(`div`,{className:`flex w-full flex-col`,children:[w(`div`,{className:`relative`,children:[B?w(S,{children:[Q(()=>H(!0)),C(t,{open:V,onOpenChange:e=>{H(e),e||z.handleBlur()},children:w(te,{children:[C(ee,{}),w(T.Content,{onOpenAutoFocus:e=>e.preventDefault(),className:x(`fixed inset-x-0 bottom-0 z-50`,`flex flex-col bg-background rounded-t-2xl outline-none`,`max-h-[80dvh] shadow-[0_-4px_24px_rgba(0,0,0,0.08)]`,`data-[state=open]:animate-in data-[state=open]:slide-in-from-bottom data-[state=open]:fade-in-0`,`data-[state=closed]:animate-out data-[state=closed]:slide-out-to-bottom data-[state=closed]:fade-out-0`,`duration-300`),children:[w(`div`,{className:`flex items-center justify-between px-4 py-3 border-b border-border shrink-0`,children:[C(`span`,{className:`font-semibold text-sm text-text-positive`,children:v}),C(n,{asChild:!0,children:C(`button`,{type:`button`,"aria-label":`Đóng`,className:`flex size-7 items-center justify-center rounded-md text-text-positive-weak transition-colors hover:bg-muted-muted hover:text-text-positive`,children:C(_,{size:16})})})]}),w(`div`,{className:`flex flex-col overflow-y-auto`,children:[Y&&C(n,{asChild:!0,children:w(`button`,{type:`button`,className:`flex w-full items-center gap-x-2 px-4 py-3 text-left text-sm text-danger-strong transition-colors hover:bg-danger-bg-subtle`,onClick:Z,children:[C(_,{size:14}),`Xóa lựa chọn`]})}),$(e=>{z.handleChange(e),H(!1),z.handleBlur()})]}),C(`div`,{className:`shrink-0 h-safe-bottom`})]})]})})]}):w(ie,{open:U,modal:L,onOpenChange:e=>{W(e),e||z.handleBlur()},children:[C(l,{asChild:!0,children:Q()}),C(c,{align:`end`,side:`bottom`,className:`flex w-fit rounded p-0`,children:$(e=>{z.handleChange(e),W(!1),z.handleBlur()})})]}),Y&&C(`button`,{type:`button`,"aria-label":`Xóa lựa chọn`,className:`absolute right-2 top-1/2 -translate-y-1/2 flex size-4 cursor-pointer items-center justify-center rounded-md text-text-positive-weak outline-none transition-[color,transform] hover:text-text-positive focus-visible:text-primary-strong focus-visible:[&>svg]:scale-125 [&>svg]:size-3.5 [&>svg]:transition-transform`,onClick:Z,children:C(_,{"aria-hidden":`true`})})]}),q&&I&&ue&&C(m,{id:R,className:`mt-1`,errors:z.state.meta.errors}),C(ae,{isShow:!!j,children:j})]})})]}),C(oe,{})]})});O.displayName=`ComboboxField`;export{O as ComboboxField};
-//# sourceMappingURL=combobox-field-Bug1qI5B.mjs.map

package/dist/combobox-kp_kPY8o.cjs

@@ -1,2 +0,0 @@
-const e=require("./ui/button.cjs"),t=require("./ui/badge.cjs"),n=require("./ui/command.cjs"),r=require("./ui/spinner.cjs"),i=require("./ui/popover.cjs"),ee=require("./ui/input.cjs");let a=require("lucide-react"),o=require("react"),s=require("@customafk/react-toolkit/utils"),c=require("class-variance-authority"),l=require("react/jsx-runtime"),u=require("cmdk");const te=(0,c.cva)([`relative flex flex-wrap items-center gap-1 rounded border bg-transparent text-sm transition-shadow`,`outline-hidden`,`aria-disabled:cursor-not-allowed aria-disabled:bg-muted-muted aria-disabled:text-text-positive-weak`],{variants:{color:{normal:[`border-border-weak`,`focus-visible:border-primary focus-visible:ring-4 focus-visible:ring-primary-weak`,`data-[state=open]:border-primary data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`].join(` `),danger:[`border-danger bg-danger-bg-subtle`,`focus-visible:border-danger focus-visible:ring-4 focus-visible:ring-danger-weak`,`data-[state=open]:border-danger data-[state=open]:ring-4 data-[state=open]:ring-danger-weak`].join(` `)},size:{sm:`min-h-8 text-xs`,md:`min-h-9 text-sm`,lg:`min-h-10 text-base`}},defaultVariants:{color:`normal`,size:`md`}});function d(e){e.preventDefault(),e.stopPropagation()}function ne(e,t){let[n,r]=(0,o.useState)(e);return(0,o.useEffect)(()=>{let n=setTimeout(()=>r(e),t??500);return()=>clearTimeout(n)},[e,t]),n}function f(e,t){if(e.length===0)return{};if(!t)return{"":e};let n={};return e.forEach(e=>{let r=e[t]||``;n[r]||(n[r]=[]),n[r].push(e)}),n}function re(e,t){let n={};for(let[r,i]of Object.entries(e))n[r]=i.filter(e=>!t.has(e.value));return n}function p(e,t){return e.length===t.length&&e.every((e,n)=>e.value===t[n]?.value)}const m=(0,o.forwardRef)(({className:e,...t},n)=>(0,u.useCommandState)(e=>e.filtered.count===0)?(0,l.jsx)(`div`,{ref:n,className:(0,s.cn)(`p-2.5 pt-1 text-center text-xs`,e),"cmdk-empty":``,role:`presentation`,...t}):null);m.displayName=`ComboboxCommandEmpty`;const h=(0,o.forwardRef)(({value:c,defaultValue:h=[],onChange:g,options:_,defaultOptions:ie=[],onSearch:v,delay:ae,triggerSearchOnFocus:y=!1,groupBy:b,placeholder:x,disabled:S,color:C,size:w=`md`,loadingIndicator:oe,loadingText:se,emptyIndicator:ce,creatable:T=!1,createHint:E,createLabel:D,onCreateOption:O,maxSelected:k=2**53-1,onMaxSelected:A,hideSelectedFromList:j=!1,hideClearAllButton:le=!1,onClearAll:ue,hideClearQueryButton:de=!1,onClearQuery:fe,className:pe,badgeClassName:me,contentClassName:he,commandProps:M,inputProps:N},ge)=>{let P=(0,o.useRef)(null),F=(0,o.useRef)(0),I=(0,o.useRef)(!0),[L,R]=(0,o.useState)(!1),[z,B]=(0,o.useState)(!1),[_e,ve]=(0,o.useState)(h),[V,H]=(0,o.useState)(f(ie,b)),[U,W]=(0,o.useState)(``),G=c??_e,K=U.trim(),q=ne(U,ae??500),J=(0,o.useCallback)(e=>{c===void 0&&ve(e),g?.(e)},[g,c]);(0,o.useImperativeHandle)(ge,()=>({selectedValue:[...G],input:P.current,focus:()=>{R(!0),P.current?.focus()},reset:()=>J([]),clearQuery:()=>W(``)}),[G,J]),(0,o.useEffect)(()=>(I.current=!0,()=>{I.current=!1}),[]),(0,o.useEffect)(()=>{L||W(``)},[L]);let Y=(0,o.useMemo)(()=>new Set(G.map(e=>e.value)),[G]),X=(0,o.useCallback)(e=>{J(G.filter(t=>t.value!==e.value))},[G,J]),ye=(0,o.useCallback)(e=>{if(Y.has(e.value)){e.fixed||X(e);return}if(G.length>=k){A?.(k);return}W(``),J([...G,e])},[X,k,A,G,Y,J]);(0,o.useEffect)(()=>{!_||v||H(e=>p(_,Object.values(e).flat())?e:f(_,b))},[_,b,v]),(0,o.useEffect)(()=>{(async()=>{if(!v||!L||!y&&!q)return;let e=++F.current;B(!0);let t=await v(q);!I.current||e!==F.current||(H(f(t,b)),B(!1))})()},[q,b,L,y,v]);let be=(0,o.useMemo)(()=>j?re(V,Y):V,[j,V,Y]),Z=(0,o.useMemo)(()=>{if(!T||!K||z)return!1;let e=K.toLowerCase(),t=Object.values(V).some(t=>t.some(t=>t.label.toLowerCase()===e)),n=G.some(t=>t.label.toLowerCase()===e);return!t&&!n},[T,K,z,V,G]),xe=typeof D==`function`?D(K):D??`Create "${K}"`,Q=typeof E==`function`?E(K):E,$=(0,o.useCallback)(()=>{if(G.length>=k){A?.(k);return}let e=K;W(``),J([...G,{value:e,label:e}]),O?.(e),R(!1)},[K,k,O,A,G,J]),Se=(0,o.useCallback)(e=>{let t=P.current;if(t){if((e.key===`Delete`||e.key===`Backspace`)&&t.value===``&&G.length>0){let e=G[G.length-1];e.fixed||X(e)}e.key===`Enter`&&Z&&(e.preventDefault(),$())}},[$,X,G,Z]),Ce=G.some(e=>!e.fixed);return(0,l.jsxs)(i.Popover,{open:L,onOpenChange:e=>!S&&R(e),children:[(0,l.jsx)(i.PopoverTrigger,{asChild:!0,children:(0,l.jsxs)(`div`,{"data-slot":`combobox-trigger`,role:`combobox`,"aria-expanded":L,"aria-haspopup":`listbox`,"aria-disabled":S||void 0,tabIndex:S?-1:0,className:(0,s.cn)(te({color:C,size:w}),G.length!==0&&`p-1`,!S&&`cursor-pointer`,S&&`pointer-events-none`,pe),onKeyDown:e=>{S||(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),R(e=>!e))},children:[G.length===0&&(0,l.jsx)(`span`,{className:`flex-1 truncate px-3 py-2 text-text-positive-muted`,children:x}),G.map(e=>(0,l.jsxs)(t.Badge,{"data-slot":`combobox-chip`,"data-fixed":e.fixed||void 0,variant:`soft`,color:C===`danger`?`danger`:`secondary`,size:w,pill:!1,className:(0,s.cn)(`gap-1 text-xs bg-muted-muted font-normal`,S&&`opacity-50`,me),children:[e.label,!e.fixed&&!S&&(0,l.jsx)(`button`,{type:`button`,"data-slot":`combobox-chip-remove`,"aria-label":`Remove ${e.label}`,onMouseDown:d,onClick:t=>{t.stopPropagation(),X(e)},className:`ms-0.5 -me-0.5 rounded-sm outline-hidden hover:text-text-positive text-text-positive-muted`,children:(0,l.jsx)(a.XIcon,{size:12,strokeWidth:2,"aria-hidden":`true`})})]},e.value)),(0,l.jsx)(a.ChevronDownIcon,{size:16,"aria-hidden":`true`,className:(0,s.cn)(`ms-auto me-2 shrink-0 text-text-positive-muted transition-transform`,L&&`rotate-180`)})]})}),(0,l.jsx)(i.PopoverContent,{align:`start`,"data-slot":`combobox-content`,className:(0,s.cn)(`w-(--radix-popover-trigger-width) p-0`,he),children:(0,l.jsxs)(n.Command,{...M,onKeyDown:e=>{Se(e),M?.onKeyDown?.(e)},"data-slot":`combobox`,className:(0,s.cn)(`overflow-visible bg-white`,M?.className),shouldFilter:M?.shouldFilter??!v,children:[!le&&Ce&&(0,l.jsxs)(e.Button,{type:`button`,"data-slot":`combobox-clear-all`,tabIndex:-1,size:`xs`,variant:`ghost`,color:`muted`,className:`w-fit mt-1 font-normal hover:text-text-positive`,onMouseDown:d,onClick:()=>{let e=G.filter(e=>e.fixed);J(e),ue?.()},children:[(0,l.jsx)(a.XIcon,{size:10,strokeWidth:2,"aria-hidden":`true`,className:`size-3!`}),`Clear Selected Input`]}),(0,l.jsxs)(`div`,{"data-slot":`combobox-search`,className:`relative px-2.5 pt-2.5 pb-1 border-t border-t-border`,children:[(0,l.jsx)(u.Command.Input,{...N,ref:P,"data-slot":`combobox-input`,value:U,onValueChange:e=>{W(e),N?.onValueChange?.(e)},placeholder:x,className:(0,s.cn)(ee.inputVariants({size:`sm`}),`pe-8`,N?.className)}),!de&&U.length>0&&(0,l.jsx)(`button`,{type:`button`,"data-slot":`combobox-clear-query`,"aria-label":`Clear search`,onMouseDown:d,onClick:()=>{W(``),fe?.(),P.current?.focus()},className:`absolute inset-y-6 inset-e-4 flex items-center justify-center text-text-positive-muted transition-colors hover:text-text-positive`,children:(0,l.jsx)(a.XIcon,{size:14,strokeWidth:2,"aria-hidden":`true`})})]}),(0,l.jsx)(n.CommandList,{"data-slot":`combobox-list`,className:`shadow-lg outline-hidden`,onMouseDown:e=>e.preventDefault(),children:z?(0,l.jsx)(`div`,{"data-slot":`combobox-loading`,className:`flex items-center justify-center gap-2 px-2 py-6 text-sm text-text-positive-muted`,children:oe??(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(r.Spinner,{className:`size-4`}),se]})}):Z?(0,l.jsxs)(`div`,{"data-slot":`combobox-create`,className:`flex flex-col gap-2 p-3`,children:[Q&&(0,l.jsx)(`p`,{className:`pe-10 text-text-positive-weak text-xs`,children:Q}),(0,l.jsx)(`div`,{className:`flex justify-end`,children:(0,l.jsxs)(e.Button,{type:`button`,"data-slot":`combobox-create-confirm`,"aria-label":xe,size:`xs`,variant:`outline`,color:`muted`,onMouseDown:d,onClick:$,children:[(0,l.jsx)(a.PlusIcon,{}),`Thêm mới`]})})]}):(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(m,{"data-slot":`combobox-empty`,children:(0,l.jsx)(`div`,{className:`bg-muted-muted size-full min-h-14 flex items-center justify-center`,children:ce??`No results found.`})}),(0,l.jsx)(n.CommandItem,{value:`__combobox-first-item-guard__`,className:`hidden`,"aria-hidden":`true`}),Object.entries(be).map(([e,t])=>(0,l.jsx)(n.CommandGroup,{heading:e||void 0,value:e||`__combobox-options__`,children:t.map(e=>{let t=Y.has(e.value);return(0,l.jsxs)(n.CommandItem,{value:e.value,keywords:[e.label],disabled:e.disable,"data-picked":t||void 0,onMouseDown:d,onSelect:()=>ye(e),className:(0,s.cn)(`cursor-pointer justify-between`,e.disable&&`cursor-not-allowed opacity-50`,t&&`bg-primary-bg-subtle! text-primary!`),children:[e.label,t&&(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(a.CheckIcon,{size:14,className:`ms-auto text-primary`,"aria-hidden":`true`}),(0,l.jsx)(`span`,{className:`sr-only`,children:`, selected`})]})]},e.value)})},e))]})})]})})]})});h.displayName=`Combobox`,Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return h}});
-//# sourceMappingURL=combobox-kp_kPY8o.cjs.map

package/dist/date-field-CYoPe74G.cjs

@@ -1,2 +0,0 @@
-const e=require("./ui/button.cjs"),t=require("./tanstack-form-BxqS40rB.cjs"),n=require("./ui/popover.cjs"),r=require("./ui/calendar.cjs"),i=require("./field-BSLi-P0Q.cjs");let a=require("lucide-react"),o=require("react"),s=require("@customafk/react-toolkit/utils"),c=require("react/jsx-runtime"),l=require("@customafk/react-toolkit/date-fns"),u=require("@tanstack/react-form");const d=(0,o.memo)(({label:d,description:f,placeholder:p,orientation:m=`responsive`,tooltip:h,helperText:g,showErrorMessage:_=!0,required:v=!1,disabled:y=!1,minDate:b,maxDate:x})=>{let S=(0,o.useId)(),C=t.G(),[w,T]=(0,o.useState)(!1),E=(0,u.useStore)(C.form.store,({isSubmitting:e})=>e),D=y||E,O=C.state.meta.isDirty||C.state.meta.isTouched,k=O&&!C.state.meta.isValid,A=v&&C.state.value===null,j=O&&C.state.meta.errors.length>0,M=e=>{C.handleChange(e),T(!1)};return(0,c.jsxs)(i.FieldGroup,{className:`px-4`,children:[(0,c.jsxs)(i.Field,{orientation:m,"data-invalid":k,children:[(0,c.jsxs)(i.FieldContent,{children:[(0,c.jsxs)(i.FieldLabel,{htmlFor:C.name,"aria-required":A,children:[d,h&&(0,c.jsx)(i.FieldTooltip,{tooltip:h})]}),(0,c.jsx)(i.FieldDescription,{children:f})]}),(0,c.jsx)(i.FieldContentMain,{className:`flex flex-col space-y-1`,children:(0,c.jsxs)(`div`,{className:`flex w-full flex-col`,children:[(0,c.jsxs)(n.Popover,{open:w,onOpenChange:e=>{T(e),e||C.handleBlur()},children:[(0,c.jsx)(n.PopoverTrigger,{asChild:!0,children:(0,c.jsxs)(e.Button,{variant:`outline`,color:`muted`,size:`lg`,disabled:D,"aria-invalid":k?!0:void 0,"aria-describedby":S,className:(0,s.cn)(`flex items-center justify-between rounded font-normal outline-border`,`hover:bg-transparent`,`focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak`,`data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`,C.state.value===null&&`text-text-positive-muted`,k&&`outline-danger bg-danger-bg-subtle ring-4 ring-danger-weak`),children:[(0,c.jsx)(`p`,{children:C.state.value===null?p??`Select date`:(0,l.format)(C.state.value,`PPPP`)}),(0,c.jsx)(a.CalendarDaysIcon,{strokeWidth:1})]})}),(0,c.jsxs)(n.PopoverContent,{align:`start`,side:`bottom`,className:`flex w-fit min-w-0 overflow-y-auto rounded p-0`,children:[(0,c.jsxs)(`div`,{className:`flex h-full flex-col space-y-2 border-r border-r-border p-2 [&>button]:justify-start [&>button]:text-sm`,children:[(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.endOfToday)()),children:`Hôm nay`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.endOfTomorrow)()),children:`Ngày mai`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.endOfYesterday)()),children:`Hôm qua`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.subDays)((0,l.endOfToday)(),3)),children:`3 ngày qua`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.subDays)((0,l.endOfToday)(),7)),children:`7 ngày qua`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.subDays)((0,l.endOfToday)(),30)),children:`30 ngày qua`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.startOfMonth)((0,l.endOfToday)())),children:`Tháng này`}),(0,c.jsx)(e.Button,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>M((0,l.lastDayOfMonth)((0,l.endOfToday)())),children:`Tháng trước`})]}),(0,c.jsx)(`div`,{className:`flex flex-1 flex-col`,children:(0,c.jsx)(`div`,{className:`min-w-73 border-b border-b-border p-2`,children:(0,c.jsx)(r.Calendar,{mode:`single`,selected:C.state.value??void 0,hidden:{before:b??new Date(1900,0,1),after:x??new Date(2100,11,31)},onSelect:e=>{e&&M(e)}})})})]})]}),O&&_&&j&&(0,c.jsx)(i.FieldError,{id:S,className:`mt-1`,errors:C.state.meta.errors}),(0,c.jsx)(i.FieldNote,{isShow:!!g,children:g})]})})]}),(0,c.jsx)(i.FieldSeparator,{})]})});d.displayName=`DateField`,exports.DateField=d;
-//# sourceMappingURL=date-field-CYoPe74G.cjs.map

package/dist/date-field-D_qpBb-t.mjs

@@ -1,2 +0,0 @@
-import{Button as e}from"./ui/button.mjs";import{G as t}from"./tanstack-form-q9hDCc0Y.mjs";import{Popover as n,PopoverContent as r,PopoverTrigger as i}from"./ui/popover.mjs";import{Calendar as a}from"./ui/calendar.mjs";import{Field as o,FieldContent as s,FieldContentMain as c,FieldDescription as l,FieldError as u,FieldGroup as d,FieldLabel as f,FieldNote as p,FieldSeparator as m,FieldTooltip as h}from"./field-V2DoD8qL.mjs";import{CalendarDaysIcon as g}from"lucide-react";import{memo as _,useId as v,useState as y}from"react";import{cn as b}from"@customafk/react-toolkit/utils";import{jsx as x,jsxs as S}from"react/jsx-runtime";import{endOfToday as C,endOfTomorrow as w,endOfYesterday as T,format as E,lastDayOfMonth as D,startOfMonth as O,subDays as k}from"@customafk/react-toolkit/date-fns";import{useStore as A}from"@tanstack/react-form";const j=_(({label:_,description:j,placeholder:M,orientation:N=`responsive`,tooltip:P,helperText:F,showErrorMessage:I=!0,required:L=!1,disabled:R=!1,minDate:z,maxDate:B})=>{let V=v(),H=t(),[U,W]=y(!1),G=A(H.form.store,({isSubmitting:e})=>e),K=R||G,q=H.state.meta.isDirty||H.state.meta.isTouched,J=q&&!H.state.meta.isValid,Y=L&&H.state.value===null,X=q&&H.state.meta.errors.length>0,Z=e=>{H.handleChange(e),W(!1)};return S(d,{className:`px-4`,children:[S(o,{orientation:N,"data-invalid":J,children:[S(s,{children:[S(f,{htmlFor:H.name,"aria-required":Y,children:[_,P&&x(h,{tooltip:P})]}),x(l,{children:j})]}),x(c,{className:`flex flex-col space-y-1`,children:S(`div`,{className:`flex w-full flex-col`,children:[S(n,{open:U,onOpenChange:e=>{W(e),e||H.handleBlur()},children:[x(i,{asChild:!0,children:S(e,{variant:`outline`,color:`muted`,size:`lg`,disabled:K,"aria-invalid":J?!0:void 0,"aria-describedby":V,className:b(`flex items-center justify-between rounded font-normal outline-border`,`hover:bg-transparent`,`focus:outline-1 focus:outline-primary-strong focus:ring-4 focus:ring-primary-weak`,`data-[state=open]:outline-1 data-[state=open]:outline-primary-strong data-[state=open]:ring-4 data-[state=open]:ring-primary-weak`,H.state.value===null&&`text-text-positive-muted`,J&&`outline-danger bg-danger-bg-subtle ring-4 ring-danger-weak`),children:[x(`p`,{children:H.state.value===null?M??`Select date`:E(H.state.value,`PPPP`)}),x(g,{strokeWidth:1})]})}),S(r,{align:`start`,side:`bottom`,className:`flex w-fit min-w-0 overflow-y-auto rounded p-0`,children:[S(`div`,{className:`flex h-full flex-col space-y-2 border-r border-r-border p-2 [&>button]:justify-start [&>button]:text-sm`,children:[x(e,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>Z(C()),children:`Hôm nay`}),x(e,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>Z(w()),children:`Ngày mai`}),x(e,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>Z(T()),children:`Hôm qua`}),x(e,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>Z(k(C(),3)),children:`3 ngày qua`}),x(e,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>Z(k(C(),7)),children:`7 ngày qua`}),x(e,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>Z(k(C(),30)),children:`30 ngày qua`}),x(e,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>Z(O(C())),children:`Tháng này`}),x(e,{variant:`ghost`,color:`muted`,className:`w-32`,onClick:()=>Z(D(C())),children:`Tháng trước`})]}),x(`div`,{className:`flex flex-1 flex-col`,children:x(`div`,{className:`min-w-73 border-b border-b-border p-2`,children:x(a,{mode:`single`,selected:H.state.value??void 0,hidden:{before:z??new Date(1900,0,1),after:B??new Date(2100,11,31)},onSelect:e=>{e&&Z(e)}})})})]})]}),q&&I&&X&&x(u,{id:V,className:`mt-1`,errors:H.state.meta.errors}),x(p,{isShow:!!F,children:F})]})})]}),x(m,{})]})});j.displayName=`DateField`;export{j as DateField};
-//# sourceMappingURL=date-field-D_qpBb-t.mjs.map

package/dist/dialog-form-BTZZwz3T.cjs

@@ -1,2 +0,0 @@
-const e=require("./ui/dialog.cjs"),t=require("./tanstack-form-BxqS40rB.cjs"),n=require("./ui/separator.cjs"),r=require("./submit-button-CvINfld5.cjs");let i=require("react"),a=require("@customafk/react-toolkit/utils"),o=require("react/jsx-runtime");const s=({title:s,submitText:c,width:l,maxWidth:u,className:d,open:f,onOpenChange:p,children:m})=>{let h=t.K(),g=(0,i.useCallback)(e=>{e||h.reset(),p?.(e)},[h.reset,p]);return(0,o.jsx)(e.Dialog,{open:f,onOpenChange:g,children:(0,o.jsxs)(e.DialogPortal,{"data-slot":`dialog-portal`,children:[(0,o.jsx)(e.DialogOverlay,{}),(0,o.jsxs)(e.DialogContent,{style:{"--width":l,"--max-width":u},className:(0,a.cn)(`flex size-full max-h-dvh max-w-dvw flex-col gap-0 overflow-y-auto rounded-none p-0 shadow-dialog sm:h-auto sm:max-h-[85dvh] sm:max-w-5xl sm:rounded-md`,l&&`sm:w-(--width)`,u&&`sm:max-w-(--max-width)`,d),onOpenAutoFocus:e=>{e.preventDefault()},onInteractOutside:e=>{e.preventDefault()},children:[(0,o.jsx)(`div`,{"data-slot":`dialog-header`,className:`flex items-center justify-center gap-2 px-6 py-5 text-center sm:text-left`,children:(0,o.jsx)(e.DialogTitle,{"data-slot":`dialog-title`,className:`font-semibold text-lg tracking-tight`,children:s})}),(0,o.jsx)(n.Separator,{}),(0,o.jsx)(`div`,{"data-slot":`dialog-content`,className:`relative flex flex-col overflow-y-auto p-0 pt-4 max-sm:flex-1 sm:p-4`,children:m}),(0,o.jsx)(n.Separator,{}),(0,o.jsxs)(`div`,{"data-slot":`dialog-footer`,className:`flex flex-col-reverse items-center justify-end gap-2 px-6 py-4 sm:flex-row max-sm:[&>button]:w-full`,children:[(0,o.jsx)(h.Subscribe,{selector:e=>({disabled:e.isSubmitting}),children:({disabled:e})=>(0,o.jsx)(r.n,{disabled:e,onClick:()=>{h.reset(),g(!1)}})}),(0,o.jsx)(h.Subscribe,{selector:e=>({isSubmitting:e.isSubmitting,disabled:e.isPristine||!e.isValid||e.isValidating||e.isSubmitting||!e.canSubmit}),children:({isSubmitting:e,disabled:t})=>(0,o.jsx)(r.t,{isSubmitting:e,disabled:t,submitText:c,onClick:()=>h.handleSubmit()})})]})]})]})})};exports.TanStackDialogForm=s;
-//# sourceMappingURL=dialog-form-BTZZwz3T.cjs.map

package/dist/dialog-form-CCIcht28.mjs

@@ -1,2 +0,0 @@
-import{Dialog as e,DialogContent as t,DialogOverlay as n,DialogPortal as r,DialogTitle as i}from"./ui/dialog.mjs";import{K as a}from"./tanstack-form-q9hDCc0Y.mjs";import{Separator as o}from"./ui/separator.mjs";import{n as s,t as c}from"./submit-button-CGBaPzE9.mjs";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";const p=({title:p,submitText:m,width:h,maxWidth:g,className:_,open:v,onOpenChange:y,children:b})=>{let x=a(),S=l(e=>{e||x.reset(),y?.(e)},[x.reset,y]);return d(e,{open:v,onOpenChange:S,children:f(r,{"data-slot":`dialog-portal`,children:[d(n,{}),f(t,{style:{"--width":h,"--max-width":g},className:u(`flex size-full max-h-dvh max-w-dvw flex-col gap-0 overflow-y-auto rounded-none p-0 shadow-dialog sm:h-auto sm:max-h-[85dvh] sm:max-w-5xl sm:rounded-md`,h&&`sm:w-(--width)`,g&&`sm:max-w-(--max-width)`,_),onOpenAutoFocus:e=>{e.preventDefault()},onInteractOutside:e=>{e.preventDefault()},children:[d(`div`,{"data-slot":`dialog-header`,className:`flex items-center justify-center gap-2 px-6 py-5 text-center sm:text-left`,children:d(i,{"data-slot":`dialog-title`,className:`font-semibold text-lg tracking-tight`,children:p})}),d(o,{}),d(`div`,{"data-slot":`dialog-content`,className:`relative flex flex-col overflow-y-auto p-0 pt-4 max-sm:flex-1 sm:p-4`,children:b}),d(o,{}),f(`div`,{"data-slot":`dialog-footer`,className:`flex flex-col-reverse items-center justify-end gap-2 px-6 py-4 sm:flex-row max-sm:[&>button]:w-full`,children:[d(x.Subscribe,{selector:e=>({disabled:e.isSubmitting}),children:({disabled:e})=>d(s,{disabled:e,onClick:()=>{x.reset(),S(!1)}})}),d(x.Subscribe,{selector:e=>({isSubmitting:e.isSubmitting,disabled:e.isPristine||!e.isValid||e.isValidating||e.isSubmitting||!e.canSubmit}),children:({isSubmitting:e,disabled:t})=>d(c,{isSubmitting:e,disabled:t,submitText:m,onClick:()=>x.handleSubmit()})})]})]})]})})};export{p as TanStackDialogForm};
-//# sourceMappingURL=dialog-form-CCIcht28.mjs.map

package/dist/email-field-DJa7iASY.cjs

@@ -1,2 +0,0 @@
-const e=require("./tanstack-form-BxqS40rB.cjs"),t=require("./ui/input.cjs"),n=require("./field-BSLi-P0Q.cjs");let r=require("lucide-react"),i=require("react"),a=require("@customafk/react-toolkit/utils"),o=require("react/jsx-runtime"),s=require("@tanstack/react-form");const c=({label:c,description:l,placeholder:u,tooltip:d,helperText:f,orientation:p=`responsive`,showErrorMessage:m=!0,required:h=!1,maxLength:g})=>{let{form:_,name:v,state:y,handleBlur:b,handleChange:x}=e.G(),S=(0,s.useStore)(_.store,({isSubmitting:e})=>e),C=y.meta.isDirty&&y.meta.isTouched&&!y.meta.isValid,w=h&&y.value===null,T=!S&&!!y.value,E=(0,i.useCallback)(({target:{value:e}})=>{S||g&&e.length>g||x(e||null)},[S,g,x]),D=(0,i.useCallback)(()=>{S||x(null)},[S,x]);return(0,o.jsxs)(n.FieldGroup,{className:`gap-y-4 px-4`,children:[(0,o.jsxs)(n.Field,{"data-invalid":C,orientation:p,children:[(0,o.jsxs)(n.FieldContent,{children:[(0,o.jsxs)(n.FieldLabel,{htmlFor:v,"aria-required":w,children:[c,d&&(0,o.jsx)(n.FieldTooltip,{tooltip:d})]}),(0,o.jsx)(n.FieldDescription,{children:l})]}),(0,o.jsxs)(n.FieldContentMain,{children:[(0,o.jsx)(t.Input,{id:v,name:v,value:y.value===null?``:y.value,"aria-invalid":C,autoComplete:`email`,placeholder:u,className:(0,a.cn)(`pl-9`,T&&`pr-9`,S&&`pointer-events-none bg-muted-muted opacity-60`),onBlur:b,onChange:E}),(0,o.jsx)(`div`,{className:`absolute top-0 left-0 flex size-9 items-center justify-center text-muted`,children:(0,o.jsx)(r.AtSignIcon,{size:14})}),T&&(0,o.jsx)(`button`,{type:`button`,"aria-label":`Xóa`,className:`absolute inset-e-0 inset-y-0 top-3 flex h-fit w-8 cursor-pointer items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:text-text-positive-strong`,onClick:D,children:(0,o.jsx)(r.XIcon,{size:14,"aria-hidden":`true`})}),(0,o.jsx)(`div`,{className:`mt-1 flex w-full items-start justify-start`,children:m&&y.meta.isDirty&&(0,o.jsx)(n.FieldError,{errors:y.meta.errors})}),(0,o.jsx)(n.FieldNote,{isShow:!!f,children:f})]})]}),(0,o.jsx)(n.FieldSeparator,{})]})};exports.EmailField=c;
-//# sourceMappingURL=email-field-DJa7iASY.cjs.map

package/dist/email-field-DxSNJ6tf.mjs

@@ -1,2 +0,0 @@
-import{G as e}from"./tanstack-form-q9hDCc0Y.mjs";import{Input as t}from"./ui/input.mjs";import{Field as n,FieldContent as r,FieldContentMain as i,FieldDescription as a,FieldError as o,FieldGroup as s,FieldLabel as c,FieldNote as l,FieldSeparator as u,FieldTooltip as d}from"./field-V2DoD8qL.mjs";import{AtSignIcon as f,XIcon as p}from"lucide-react";import{useCallback as m}from"react";import{cn as h}from"@customafk/react-toolkit/utils";import{jsx as g,jsxs as _}from"react/jsx-runtime";import{useStore as v}from"@tanstack/react-form";const y=({label:y,description:b,placeholder:x,tooltip:S,helperText:C,orientation:w=`responsive`,showErrorMessage:T=!0,required:E=!1,maxLength:D})=>{let{form:O,name:k,state:A,handleBlur:j,handleChange:M}=e(),N=v(O.store,({isSubmitting:e})=>e),P=A.meta.isDirty&&A.meta.isTouched&&!A.meta.isValid,F=E&&A.value===null,I=!N&&!!A.value,L=m(({target:{value:e}})=>{N||D&&e.length>D||M(e||null)},[N,D,M]),R=m(()=>{N||M(null)},[N,M]);return _(s,{className:`gap-y-4 px-4`,children:[_(n,{"data-invalid":P,orientation:w,children:[_(r,{children:[_(c,{htmlFor:k,"aria-required":F,children:[y,S&&g(d,{tooltip:S})]}),g(a,{children:b})]}),_(i,{children:[g(t,{id:k,name:k,value:A.value===null?``:A.value,"aria-invalid":P,autoComplete:`email`,placeholder:x,className:h(`pl-9`,I&&`pr-9`,N&&`pointer-events-none bg-muted-muted opacity-60`),onBlur:j,onChange:L}),g(`div`,{className:`absolute top-0 left-0 flex size-9 items-center justify-center text-muted`,children:g(f,{size:14})}),I&&g(`button`,{type:`button`,"aria-label":`Xóa`,className:`absolute inset-e-0 inset-y-0 top-3 flex h-fit w-8 cursor-pointer items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:text-text-positive-strong`,onClick:R,children:g(p,{size:14,"aria-hidden":`true`})}),g(`div`,{className:`mt-1 flex w-full items-start justify-start`,children:T&&A.meta.isDirty&&g(o,{errors:A.meta.errors})}),g(l,{isShow:!!C,children:C})]})]}),g(u,{})]})};export{y as EmailField};
-//# sourceMappingURL=email-field-DxSNJ6tf.mjs.map