@customafk/lunas-ui 0.2.83 → 0.2.84

package/dist/ui/dropdown-menu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-menu.mjs","names":["DropdownMenuPrimitive"],"sources":["../../packages/components/ui/dropdown-menu.tsx"],"sourcesContent":["'use client';\n\nimport { CheckIcon, ChevronRightIcon, CircleIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { DropdownMenu as DropdownMenuPrimitive } from 'radix-ui';\n\n/**\n * Root provider for the DropdownMenu — wraps all sub-components and controls open state.\n *\n * @example\n * ```tsx\n * import {\n *   DropdownMenu, DropdownMenuTrigger, DropdownMenuContent,\n *   DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator,\n * } from '@customafk/lunas-ui/ui/dropdown-menu';\n *\n * <DropdownMenu>\n *   <DropdownMenuTrigger>Options</DropdownMenuTrigger>\n *   <DropdownMenuContent>\n *     <DropdownMenuLabel>My Account</DropdownMenuLabel>\n *     <DropdownMenuSeparator />\n *     <DropdownMenuItem>Profile</DropdownMenuItem>\n *     <DropdownMenuItem variant=\"destructive\">Delete</DropdownMenuItem>\n *   </DropdownMenuContent>\n * </DropdownMenu>\n * ```\n */\nfunction DropdownMenu({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Root>) {\n  return <DropdownMenuPrimitive.Root data-slot=\"dropdown-menu\" {...props} />;\n}\n\n/** Portals DropdownMenu content outside the current DOM hierarchy. */\nfunction DropdownMenuPortal({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Portal>) {\n  return <DropdownMenuPrimitive.Portal data-slot=\"dropdown-menu-portal\" {...props} />;\n}\n\n/** Element that opens the DropdownMenu when activated. */\nfunction DropdownMenuTrigger({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Trigger>) {\n  return <DropdownMenuPrimitive.Trigger data-slot=\"dropdown-menu-trigger\" {...props} />;\n}\n\n/** Animated floating panel that contains the dropdown items. */\nfunction DropdownMenuContent({ className, sideOffset = 4, align = 'start', ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Content>) {\n  return (\n    <DropdownMenuPrimitive.Portal>\n      <DropdownMenuPrimitive.Content\n        data-slot=\"dropdown-menu-content\"\n        sideOffset={sideOffset}\n        align={align}\n        className={cn(\n          'bg-popover text-text-positive',\n          'z-50 min-w-32',\n          'overflow-y-auto overflow-x-hidden',\n          'rounded-md p-1.5 shadow-dropdown',\n          'max-h-(--radix-dropdown-menu-content-available-height)',\n          'origin-(--radix-dropdown-menu-content-transform-origin)',\n          'data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95',\n          'data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95',\n          'data-[side=bottom]:slide-in-from-top-2',\n          'data-[side=left]:slide-in-from-right-2',\n          'data-[side=right]:slide-in-from-left-2',\n          'data-[side=top]:slide-in-from-bottom-2',\n          className\n        )}\n        {...props}\n      />\n    </DropdownMenuPrimitive.Portal>\n  );\n}\n\n/** Groups related DropdownMenuItems under a shared logical section. */\nfunction DropdownMenuGroup({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Group>) {\n  return <DropdownMenuPrimitive.Group data-slot=\"dropdown-menu-group\" {...props} />;\n}\n\n/**\n * A single clickable row inside a DropdownMenuContent.\n *\n * @param inset - When true, adds left padding to align with items that have icons.\n * @param variant - Visual style: `'default'` or `'destructive'`.\n */\nfunction DropdownMenuItem({\n  className,\n  inset,\n  variant = 'default',\n  ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {\n  inset?: boolean;\n  variant?: 'default' | 'destructive';\n}) {\n  return (\n    <DropdownMenuPrimitive.Item\n      data-slot=\"dropdown-menu-item\"\n      data-inset={inset}\n      data-variant={variant}\n      className={cn(\n        'relative flex cursor-pointer select-none items-center gap-2 rounded-md px-2 py-2.5 text-sm outline-hidden transition-colors',\n        'focus:bg-muted-muted focus:text-text-positive-strong',\n        'data-inset:pl-8',\n        'data-disabled:pointer-events-none data-disabled:opacity-50',\n        'data-[variant=destructive]:text-danger',\n        'data-[variant=destructive]:focus:bg-danger-muted data-[variant=destructive]:focus:text-danger-strong',\n        'data-[variant=destructive]:*:[svg]:text-danger!',\n        '[&_svg]:pointer-events-none [&_svg]:shrink-0',\n        \"[&_svg:not([class*='size-'])]:size-4\",\n        \"[&_svg:not([class*='text-'])]:text-text-positive-weak\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\n/** A checkable menu item that displays a checkmark when selected. */\nfunction DropdownMenuCheckboxItem({ className, children, checked, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem>) {\n  return (\n    <DropdownMenuPrimitive.CheckboxItem\n      data-slot=\"dropdown-menu-checkbox-item\"\n      className={cn(\n        'relative flex cursor-pointer select-none items-center gap-2 rounded-md py-2.5 pr-2 pl-8 text-sm outline-hidden transition-colors',\n        'focus:bg-muted-muted focus:text-text-positive-strong',\n        'data-disabled:pointer-events-none data-disabled:opacity-50',\n        '[&_svg]:pointer-events-none [&_svg]:shrink-0',\n        \"[&_svg:not([class*='size-'])]:size-4\",\n        className\n      )}\n      checked={checked}\n      {...props}\n    >\n      <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n        <DropdownMenuPrimitive.ItemIndicator>\n          <CheckIcon size={16} />\n        </DropdownMenuPrimitive.ItemIndicator>\n      </span>\n      {children}\n    </DropdownMenuPrimitive.CheckboxItem>\n  );\n}\n\n/** Groups DropdownMenuRadioItems so only one can be selected at a time. */\nfunction DropdownMenuRadioGroup({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>) {\n  return <DropdownMenuPrimitive.RadioGroup data-slot=\"dropdown-menu-radio-group\" {...props} />;\n}\n\n/** A radio-button menu item; shows a filled circle when selected. */\nfunction DropdownMenuRadioItem({ className, children, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.RadioItem>) {\n  return (\n    <DropdownMenuPrimitive.RadioItem\n      data-slot=\"dropdown-menu-radio-item\"\n      className={cn(\n        'relative flex cursor-pointer select-none items-center gap-2 rounded-md py-2.5 pr-2 pl-8 text-sm outline-hidden transition-colors',\n        'focus:bg-muted-muted focus:text-text-positive-strong',\n        'data-disabled:pointer-events-none data-disabled:opacity-50',\n        '[&_svg]:pointer-events-none [&_svg]:shrink-0',\n        \"[&_svg:not([class*='size-'])]:size-4\",\n        className\n      )}\n      {...props}\n    >\n      <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n        <DropdownMenuPrimitive.ItemIndicator>\n          <CircleIcon className=\"size-2 fill-current\" />\n        </DropdownMenuPrimitive.ItemIndicator>\n      </span>\n      {children}\n    </DropdownMenuPrimitive.RadioItem>\n  );\n}\n\n/**\n * Non-interactive label used to describe a group of items.\n *\n * @param inset - When true, adds left padding to align with inset items.\n */\nfunction DropdownMenuLabel({\n  className,\n  inset,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Label> & {\n  inset?: boolean;\n}) {\n  return (\n    <DropdownMenuPrimitive.Label\n      data-slot=\"dropdown-menu-label\"\n      data-inset={inset}\n      className={cn('px-2 py-1.5 font-medium text-sm text-text-positive-weak data-inset:pl-8', className)}\n      {...props}\n    />\n  );\n}\n\n/** Horizontal dividing line between groups of dropdown items. */\nfunction DropdownMenuSeparator({ className, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Separator>) {\n  return <DropdownMenuPrimitive.Separator data-slot=\"dropdown-menu-separator\" className={cn('-mx-1 my-1 h-px bg-border-weak', className)} {...props} />;\n}\n\n/** Displays a keyboard shortcut hint aligned to the right of a menu item. */\nfunction DropdownMenuShortcut({ className, ...props }: React.ComponentProps<'span'>) {\n  return <span data-slot=\"dropdown-menu-shortcut\" className={cn('ml-auto text-xs text-text-positive-muted tracking-widest', className)} {...props} />;\n}\n\n/** Root container for a nested sub-menu inside a DropdownMenu. */\nfunction DropdownMenuSub({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Sub>) {\n  return <DropdownMenuPrimitive.Sub data-slot=\"dropdown-menu-sub\" {...props} />;\n}\n\n/**\n * Menu item that reveals a nested DropdownMenuSubContent on hover or activation.\n *\n * @param inset - When true, adds left padding to align with inset items.\n */\nfunction DropdownMenuSubTrigger({\n  className,\n  inset,\n  children,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {\n  inset?: boolean;\n}) {\n  return (\n    <DropdownMenuPrimitive.SubTrigger\n      data-slot=\"dropdown-menu-sub-trigger\"\n      data-inset={inset}\n      className={cn(\n        'flex cursor-pointer select-none items-center gap-2 rounded-md px-2 py-2.5 text-sm outline-hidden transition-colors',\n        'focus:bg-muted-muted focus:text-text-positive-strong',\n        'data-[state=open]:bg-muted-muted data-[state=open]:text-text-positive-strong',\n        'data-inset:pl-8',\n        '[&_svg]:pointer-events-none [&_svg]:shrink-0',\n        \"[&_svg:not([class*='size-'])]:size-4\",\n        className\n      )}\n      {...props}\n    >\n      {children}\n      <ChevronRightIcon className=\"ml-auto size-4\" />\n    </DropdownMenuPrimitive.SubTrigger>\n  );\n}\n\n/** Floating panel that contains the items of a nested sub-menu. */\nfunction DropdownMenuSubContent({ className, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.SubContent>) {\n  return (\n    <DropdownMenuPrimitive.SubContent\n      data-slot=\"dropdown-menu-sub-content\"\n      className={cn(\n        'bg-popover text-text-positive',\n        'z-50 min-w-32',\n        'overflow-y-auto overflow-x-hidden',\n        'origin-(--radix-dropdown-menu-content-transform-origin) rounded-md p-1.5 shadow-dropdown',\n        'data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95',\n        'data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95',\n        'data-[side=bottom]:slide-in-from-top-2',\n        'data-[side=left]:slide-in-from-right-2',\n        'data-[side=right]:slide-in-from-left-2',\n        'data-[side=top]:slide-in-from-bottom-2',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nexport {\n  DropdownMenu,\n  DropdownMenuCheckboxItem,\n  DropdownMenuContent,\n  DropdownMenuGroup,\n  DropdownMenuItem,\n  DropdownMenuLabel,\n  DropdownMenuPortal,\n  DropdownMenuRadioGroup,\n  DropdownMenuRadioItem,\n  DropdownMenuSeparator,\n  DropdownMenuShortcut,\n  DropdownMenuSub,\n  DropdownMenuSubContent,\n  DropdownMenuSubTrigger,\n  DropdownMenuTrigger,\n};\n"],"mappings":"0OA6BA,SAAS,EAAa,CAAE,GAAG,GAAkE,CAC3F,OAAO,EAACA,EAAsB,KAAvB,CAA4B,YAAU,gBAAgB,GAAI,CAAQ,CAAA,CAC3E,CAGA,SAAS,EAAmB,CAAE,GAAG,GAAoE,CACnG,OAAO,EAACA,EAAsB,OAAvB,CAA8B,YAAU,uBAAuB,GAAI,CAAQ,CAAA,CACpF,CAGA,SAAS,EAAoB,CAAE,GAAG,GAAqE,CACrG,OAAO,EAACA,EAAsB,QAAvB,CAA+B,YAAU,wBAAwB,GAAI,CAAQ,CAAA,CACtF,CAGA,SAAS,EAAoB,CAAE,YAAW,aAAa,EAAG,QAAQ,QAAS,GAAG,GAAqE,CACjJ,OACE,EAACA,EAAsB,OAAvB,CAAA,SACE,EAACA,EAAsB,QAAvB,CACE,YAAU,wBACE,aACL,QACP,UAAW,EACT,gCACA,gBACA,oCACA,mCACA,yDACA,0DACA,wFACA,iGACA,yCACA,yCACA,yCACA,yCACA,CACF,EACA,GAAI,CACL,CAAA,CAC2B,CAAA,CAElC,CAGA,SAAS,EAAkB,CAAE,GAAG,GAAmE,CACjG,OAAO,EAACA,EAAsB,MAAvB,CAA6B,YAAU,sBAAsB,GAAI,CAAQ,CAAA,CAClF,CAQA,SAAS,EAAiB,CACxB,YACA,QACA,UAAU,UACV,GAAG,GAIF,CACD,OACE,EAACA,EAAsB,KAAvB,CACE,YAAU,qBACV,aAAY,EACZ,eAAc,EACd,UAAW,EACT,8HACA,uDACA,kBACA,6DACA,yCACA,uGACA,kDACA,+CACA,uCACA,wDACA,CACF,EACA,GAAI,CACL,CAAA,CAEL,CAGA,SAAS,EAAyB,CAAE,YAAW,WAAU,UAAS,GAAG,GAA0E,CAC7I,OACE,EAACA,EAAsB,aAAvB,CACE,YAAU,8BACV,UAAW,EACT,mIACA,uDACA,6DACA,+CACA,uCACA,CACF,EACS,UACT,GAAI,EAXN,SAAA,CAaE,EAAC,OAAD,CAAM,UAAU,gFACd,SAAA,EAACA,EAAsB,cAAvB,CAAA,SACE,EAAC,EAAD,CAAW,KAAM,EAAK,CAAA,CACa,CAAA,CACjC,CAAA,EACL,CACiC,GAExC,CAGA,SAAS,EAAuB,CAAE,GAAG,GAAwE,CAC3G,OAAO,EAACA,EAAsB,WAAvB,CAAkC,YAAU,4BAA4B,GAAI,CAAQ,CAAA,CAC7F,CAGA,SAAS,EAAsB,CAAE,YAAW,WAAU,GAAG,GAAuE,CAC9H,OACE,EAACA,EAAsB,UAAvB,CACE,YAAU,2BACV,UAAW,EACT,mIACA,uDACA,6DACA,+CACA,uCACA,CACF,EACA,GAAI,EAVN,SAAA,CAYE,EAAC,OAAD,CAAM,UAAU,gFACd,SAAA,EAACA,EAAsB,cAAvB,CAAA,SACE,EAAC,EAAD,CAAY,UAAU,qBAAuB,CAAA,CACV,CAAA,CACjC,CAAA,EACL,CAC8B,GAErC,CAOA,SAAS,EAAkB,CACzB,YACA,QACA,GAAG,GAGF,CACD,OACE,EAACA,EAAsB,MAAvB,CACE,YAAU,sBACV,aAAY,EACZ,UAAW,EAAG,0EAA2E,CAAS,EAClG,GAAI,CACL,CAAA,CAEL,CAGA,SAAS,EAAsB,CAAE,YAAW,GAAG,GAAuE,CACpH,OAAO,EAACA,EAAsB,UAAvB,CAAiC,YAAU,0BAA0B,UAAW,EAAG,iCAAkC,CAAS,EAAG,GAAI,CAAQ,CAAA,CACtJ,CAGA,SAAS,EAAqB,CAAE,YAAW,GAAG,GAAuC,CACnF,OAAO,EAAC,OAAD,CAAM,YAAU,yBAAyB,UAAW,EAAG,2DAA4D,CAAS,EAAG,GAAI,CAAQ,CAAA,CACpJ,CAGA,SAAS,EAAgB,CAAE,GAAG,GAAiE,CAC7F,OAAO,EAACA,EAAsB,IAAvB,CAA2B,YAAU,oBAAoB,GAAI,CAAQ,CAAA,CAC9E,CAOA,SAAS,EAAuB,CAC9B,YACA,QACA,WACA,GAAG,GAGF,CACD,OACE,EAACA,EAAsB,WAAvB,CACE,YAAU,4BACV,aAAY,EACZ,UAAW,EACT,qHACA,uDACA,+EACA,kBACA,+CACA,uCACA,CACF,EACA,GAAI,EAZN,SAAA,CAcG,EACD,EAAC,EAAD,CAAkB,UAAU,gBAAkB,CAAA,CACd,GAEtC,CAGA,SAAS,EAAuB,CAAE,YAAW,GAAG,GAAwE,CACtH,OACE,EAACA,EAAsB,WAAvB,CACE,YAAU,4BACV,UAAW,EACT,gCACA,gBACA,oCACA,2FACA,wFACA,iGACA,yCACA,yCACA,yCACA,yCACA,CACF,EACA,GAAI,CACL,CAAA,CAEL"}
+{"version":3,"file":"dropdown-menu.mjs","names":["DropdownMenuPrimitive"],"sources":["../../packages/components/ui/dropdown-menu.tsx"],"sourcesContent":["'use client';\n\nimport { CheckIcon, ChevronRightIcon, CircleIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { DropdownMenu as DropdownMenuPrimitive } from 'radix-ui';\n\n/**\n * Root provider for the DropdownMenu — wraps all sub-components and controls open state.\n *\n * @example\n * ```tsx\n * import {\n *   DropdownMenu, DropdownMenuTrigger, DropdownMenuContent,\n *   DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator,\n * } from '@customafk/lunas-ui/ui/dropdown-menu';\n *\n * <DropdownMenu>\n *   <DropdownMenuTrigger>Options</DropdownMenuTrigger>\n *   <DropdownMenuContent>\n *     <DropdownMenuLabel>My Account</DropdownMenuLabel>\n *     <DropdownMenuSeparator />\n *     <DropdownMenuItem>Profile</DropdownMenuItem>\n *     <DropdownMenuItem variant=\"destructive\">Delete</DropdownMenuItem>\n *   </DropdownMenuContent>\n * </DropdownMenu>\n * ```\n */\nfunction DropdownMenu({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Root>) {\n  return <DropdownMenuPrimitive.Root data-slot=\"dropdown-menu\" {...props} />;\n}\n\n/** Portals DropdownMenu content outside the current DOM hierarchy. */\nfunction DropdownMenuPortal({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Portal>) {\n  return <DropdownMenuPrimitive.Portal data-slot=\"dropdown-menu-portal\" {...props} />;\n}\n\n/** Element that opens the DropdownMenu when activated. */\nfunction DropdownMenuTrigger({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Trigger>) {\n  return <DropdownMenuPrimitive.Trigger data-slot=\"dropdown-menu-trigger\" {...props} />;\n}\n\n/** Animated floating panel that contains the dropdown items. */\nfunction DropdownMenuContent({ className, sideOffset = 4, align = 'start', ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Content>) {\n  return (\n    <DropdownMenuPrimitive.Portal>\n      <DropdownMenuPrimitive.Content\n        data-slot=\"dropdown-menu-content\"\n        sideOffset={sideOffset}\n        align={align}\n        className={cn(\n          'bg-popover text-text-positive',\n          'z-50 min-w-32',\n          'overflow-y-auto overflow-x-hidden',\n          'rounded py-1.5 px-0.5 shadow-dropdown',\n          'max-h-(--radix-dropdown-menu-content-available-height)',\n          'origin-(--radix-dropdown-menu-content-transform-origin)',\n          'data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95',\n          'data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95',\n          'data-[side=bottom]:slide-in-from-top-2',\n          'data-[side=left]:slide-in-from-right-2',\n          'data-[side=right]:slide-in-from-left-2',\n          'data-[side=top]:slide-in-from-bottom-2',\n          className\n        )}\n        {...props}\n      />\n    </DropdownMenuPrimitive.Portal>\n  );\n}\n\n/** Groups related DropdownMenuItems under a shared logical section. */\nfunction DropdownMenuGroup({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Group>) {\n  return <DropdownMenuPrimitive.Group data-slot=\"dropdown-menu-group\" {...props} />;\n}\n\n/**\n * A single clickable row inside a DropdownMenuContent.\n *\n * @param inset - When true, adds left padding to align with items that have icons.\n * @param variant - Visual style: `'default'` or `'destructive'`.\n */\nfunction DropdownMenuItem({\n  className,\n  inset,\n  variant = 'default',\n  ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {\n  inset?: boolean;\n  variant?: 'default' | 'destructive';\n}) {\n  return (\n    <DropdownMenuPrimitive.Item\n      data-slot=\"dropdown-menu-item\"\n      data-inset={inset}\n      data-variant={variant}\n      className={cn(\n        'relative flex cursor-pointer select-none items-center gap-2 rounded px-2 py-2.5 text-sm outline-hidden transition-colors',\n        'focus:bg-muted-weak/30 focus:text-text-positive-strong',\n        'data-inset:pl-8',\n        'data-disabled:pointer-events-none data-disabled:opacity-50',\n        'data-[variant=destructive]:text-danger',\n        'data-[variant=destructive]:focus:bg-danger-muted data-[variant=destructive]:focus:text-danger-strong',\n        'data-[variant=destructive]:*:[svg]:text-danger!',\n        '[&_svg]:pointer-events-none [&_svg]:shrink-0',\n        \"[&_svg:not([class*='size-'])]:size-4\",\n        \"[&_svg:not([class*='text-'])]:text-text-positive-weak\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\n/** A checkable menu item that displays a checkmark when selected. */\nfunction DropdownMenuCheckboxItem({ className, children, checked, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem>) {\n  return (\n    <DropdownMenuPrimitive.CheckboxItem\n      data-slot=\"dropdown-menu-checkbox-item\"\n      className={cn(\n        'relative flex cursor-pointer select-none items-center gap-2 rounded-md py-2.5 pr-2 pl-8 text-sm outline-hidden transition-colors',\n        'focus:bg-muted-muted focus:text-text-positive-strong',\n        'data-disabled:pointer-events-none data-disabled:opacity-50',\n        '[&_svg]:pointer-events-none [&_svg]:shrink-0',\n        \"[&_svg:not([class*='size-'])]:size-4\",\n        className\n      )}\n      checked={checked}\n      {...props}\n    >\n      <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n        <DropdownMenuPrimitive.ItemIndicator>\n          <CheckIcon size={16} />\n        </DropdownMenuPrimitive.ItemIndicator>\n      </span>\n      {children}\n    </DropdownMenuPrimitive.CheckboxItem>\n  );\n}\n\n/** Groups DropdownMenuRadioItems so only one can be selected at a time. */\nfunction DropdownMenuRadioGroup({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>) {\n  return <DropdownMenuPrimitive.RadioGroup data-slot=\"dropdown-menu-radio-group\" {...props} />;\n}\n\n/** A radio-button menu item; shows a filled circle when selected. */\nfunction DropdownMenuRadioItem({ className, children, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.RadioItem>) {\n  return (\n    <DropdownMenuPrimitive.RadioItem\n      data-slot=\"dropdown-menu-radio-item\"\n      className={cn(\n        'relative flex cursor-pointer select-none items-center gap-2 rounded-md py-2.5 pr-2 pl-8 text-sm outline-hidden transition-colors',\n        'focus:bg-muted-muted focus:text-text-positive-strong',\n        'data-disabled:pointer-events-none data-disabled:opacity-50',\n        '[&_svg]:pointer-events-none [&_svg]:shrink-0',\n        \"[&_svg:not([class*='size-'])]:size-4\",\n        className\n      )}\n      {...props}\n    >\n      <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n        <DropdownMenuPrimitive.ItemIndicator>\n          <CircleIcon className=\"size-2 fill-current\" />\n        </DropdownMenuPrimitive.ItemIndicator>\n      </span>\n      {children}\n    </DropdownMenuPrimitive.RadioItem>\n  );\n}\n\n/**\n * Non-interactive label used to describe a group of items.\n *\n * @param inset - When true, adds left padding to align with inset items.\n */\nfunction DropdownMenuLabel({\n  className,\n  inset,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Label> & {\n  inset?: boolean;\n}) {\n  return (\n    <DropdownMenuPrimitive.Label\n      data-slot=\"dropdown-menu-label\"\n      data-inset={inset}\n      className={cn('px-2 py-1.5 font-medium text-sm text-text-positive-weak data-inset:pl-8', className)}\n      {...props}\n    />\n  );\n}\n\n/** Horizontal dividing line between groups of dropdown items. */\nfunction DropdownMenuSeparator({ className, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Separator>) {\n  return <DropdownMenuPrimitive.Separator data-slot=\"dropdown-menu-separator\" className={cn('-mx-1 my-1 h-px bg-border-weak', className)} {...props} />;\n}\n\n/** Displays a keyboard shortcut hint aligned to the right of a menu item. */\nfunction DropdownMenuShortcut({ className, ...props }: React.ComponentProps<'span'>) {\n  return <span data-slot=\"dropdown-menu-shortcut\" className={cn('ml-auto text-xs text-text-positive-muted tracking-widest', className)} {...props} />;\n}\n\n/** Root container for a nested sub-menu inside a DropdownMenu. */\nfunction DropdownMenuSub({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Sub>) {\n  return <DropdownMenuPrimitive.Sub data-slot=\"dropdown-menu-sub\" {...props} />;\n}\n\n/**\n * Menu item that reveals a nested DropdownMenuSubContent on hover or activation.\n *\n * @param inset - When true, adds left padding to align with inset items.\n */\nfunction DropdownMenuSubTrigger({\n  className,\n  inset,\n  children,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {\n  inset?: boolean;\n}) {\n  return (\n    <DropdownMenuPrimitive.SubTrigger\n      data-slot=\"dropdown-menu-sub-trigger\"\n      data-inset={inset}\n      className={cn(\n        'flex cursor-pointer select-none items-center gap-2 rounded-md px-2 py-2.5 text-sm outline-hidden transition-colors',\n        'focus:bg-muted-muted focus:text-text-positive-strong',\n        'data-[state=open]:bg-muted-muted data-[state=open]:text-text-positive-strong',\n        'data-inset:pl-8',\n        '[&_svg]:pointer-events-none [&_svg]:shrink-0',\n        \"[&_svg:not([class*='size-'])]:size-4\",\n        className\n      )}\n      {...props}\n    >\n      {children}\n      <ChevronRightIcon className=\"ml-auto size-4\" />\n    </DropdownMenuPrimitive.SubTrigger>\n  );\n}\n\n/** Floating panel that contains the items of a nested sub-menu. */\nfunction DropdownMenuSubContent({ className, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.SubContent>) {\n  return (\n    <DropdownMenuPrimitive.SubContent\n      data-slot=\"dropdown-menu-sub-content\"\n      className={cn(\n        'bg-popover text-text-positive',\n        'z-50 min-w-32',\n        'overflow-y-auto overflow-x-hidden',\n        'origin-(--radix-dropdown-menu-content-transform-origin) rounded-md p-1.5 shadow-dropdown',\n        'data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95',\n        'data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95',\n        'data-[side=bottom]:slide-in-from-top-2',\n        'data-[side=left]:slide-in-from-right-2',\n        'data-[side=right]:slide-in-from-left-2',\n        'data-[side=top]:slide-in-from-bottom-2',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nexport {\n  DropdownMenu,\n  DropdownMenuCheckboxItem,\n  DropdownMenuContent,\n  DropdownMenuGroup,\n  DropdownMenuItem,\n  DropdownMenuLabel,\n  DropdownMenuPortal,\n  DropdownMenuRadioGroup,\n  DropdownMenuRadioItem,\n  DropdownMenuSeparator,\n  DropdownMenuShortcut,\n  DropdownMenuSub,\n  DropdownMenuSubContent,\n  DropdownMenuSubTrigger,\n  DropdownMenuTrigger,\n};\n"],"mappings":"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"}

package/dist/ui/file-uploader.cjs

@@ -1,3 +1,3 @@
-"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../rolldown-runtime-CMqjfN_6.cjs"),t=require("./button.cjs"),n=require("./progress.cjs"),r=require("../features/file-icons/index.cjs");let i=require("lucide-react"),a=require("react"),o=require("@customafk/react-toolkit/utils"),s=require("react/jsx-runtime"),c=require("sonner"),l=require("@customafk/react-toolkit/hooks/useControllableState"),u=require("react-dropzone");u=e.t(u,1);function d(e){let{value:t,onValueChange:n,onUpload:r,progresses:d,accept:m={"image/*":[]},maxSize:h=1024*1024*2,maxFileCount:g=1,multiple:_=!1,disabled:v=!1,showText:y=!0,iconSize:b,className:x,...S}=e,[C,w]=(0,l.useControllableState)({prop:t,onChange:n}),T=(0,a.useCallback)((e,t)=>{if(!_&&g===1&&e.length>1){c.toast.error(`Cannot upload more than 1 file at a time`);return}if((C?.length??0)+e.length>g){c.toast.error(`Cannot upload more than ${g} files`);return}let n=e.map(e=>Object.assign(e,{preview:URL.createObjectURL(e)})),i=C?[...C,...n]:n;if(w(i),t.length>0&&t.forEach(({file:e})=>{c.toast.error(`File ${e.name} was rejected`)}),r&&i.length>0&&i.length<=g){let e=i.length>0?`${i.length} files`:`file`;r(i).then(()=>{w([]),(0,c.toast)(`${e} uploaded`)})}},[C,g,_,r,w]);function E(e){if(!C)return;p(C[e])&&URL.revokeObjectURL(C[e].preview);let t=C.filter((t,n)=>n!==e);w(t),n?.(t)}(0,a.useEffect)(()=>()=>{C&&C.forEach(e=>{p(e)&&URL.revokeObjectURL(e.preview)})},[]);let D=v||(C?.length??0)>=g;return(0,s.jsxs)(`div`,{className:`relative flex w-full flex-col gap-6`,children:[(0,s.jsx)(u.default,{onDrop:T,accept:m,maxSize:h,maxFiles:g,multiple:g>1||_,disabled:D,children:({getRootProps:e,getInputProps:t,isDragActive:n})=>(0,s.jsxs)(`div`,{...e(),className:(0,o.cn)(`group`,`border-border-weak`,`hover:bg-border-weak/20`,`relative grid h-52 w-full cursor-pointer place-items-center rounded-lg border-2 border-dashed px-5 py-2.5 text-center transition`,`ring-offset-background`,`focus-visible:ring-primary-weak`,`focus-visible:ring-2`,`focus-visible:ring-offset-2`,`focus-visible:outline-hidden`,n&&`border-border-primary-strong bg-border-weak/40`,D&&`pointer-events-none opacity-60`,x),...S,children:[(0,s.jsx)(`input`,{...t()}),n?(0,s.jsxs)(`div`,{className:`flex flex-col items-center justify-center gap-4 sm:px-5`,children:[(0,s.jsx)(`div`,{className:`rounded-full border border-dashed p-3`,children:(0,s.jsx)(i.Upload,{className:`size-7 text-text-positive-muted`,"aria-hidden":`true`})}),(0,s.jsx)(`p`,{className:`font-medium text-text-positive-muted`,children:`Drop the files here`})]}):(0,s.jsxs)(`div`,{className:`flex flex-col items-center justify-center gap-4 sm:px-5`,children:[(0,s.jsx)(`div`,{className:`rounded-full border border-dashed p-3`,children:(0,s.jsx)(i.Upload,{size:b||24,className:`text-muted-foreground`,"aria-hidden":`true`})}),!!y&&(0,s.jsxs)(`div`,{className:`flex flex-col gap-px`,children:[(0,s.jsxs)(`p`,{className:`font-medium text-text-positive-weak text-xs`,children:[`Drag `,`'n'`,` drop files here, or click to select files`]}),(0,s.jsxs)(`p`,{className:`text-text-positive-muted text-xs`,children:[`You can upload`,g>1?` ${g===1/0?`multiple`:g}
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../rolldown-runtime-DWNI8pZO.cjs"),t=require("./button.cjs"),n=require("./progress.cjs"),r=require("../features/file-icons/index.cjs");let i=require("lucide-react"),a=require("react"),o=require("@customafk/react-toolkit/utils"),s=require("react/jsx-runtime"),c=require("sonner"),l=require("@customafk/react-toolkit/hooks/useControllableState"),u=require("react-dropzone");u=e.n(u,1);function d(e){let{value:t,onValueChange:n,onUpload:r,progresses:d,accept:m={"image/*":[]},maxSize:h=1024*1024*2,maxFileCount:g=1,multiple:_=!1,disabled:v=!1,showText:y=!0,iconSize:b,className:x,...S}=e,[C,w]=(0,l.useControllableState)({prop:t,onChange:n}),T=(0,a.useCallback)((e,t)=>{if(!_&&g===1&&e.length>1){c.toast.error(`Cannot upload more than 1 file at a time`);return}if((C?.length??0)+e.length>g){c.toast.error(`Cannot upload more than ${g} files`);return}let n=e.map(e=>Object.assign(e,{preview:URL.createObjectURL(e)})),i=C?[...C,...n]:n;if(w(i),t.length>0&&t.forEach(({file:e})=>{c.toast.error(`File ${e.name} was rejected`)}),r&&i.length>0&&i.length<=g){let e=i.length>0?`${i.length} files`:`file`;r(i).then(()=>{w([]),(0,c.toast)(`${e} uploaded`)})}},[C,g,_,r,w]);function E(e){if(!C)return;p(C[e])&&URL.revokeObjectURL(C[e].preview);let t=C.filter((t,n)=>n!==e);w(t),n?.(t)}(0,a.useEffect)(()=>()=>{C&&C.forEach(e=>{p(e)&&URL.revokeObjectURL(e.preview)})},[]);let D=v||(C?.length??0)>=g;return(0,s.jsxs)(`div`,{className:`relative flex w-full flex-col gap-6`,children:[(0,s.jsx)(u.default,{onDrop:T,accept:m,maxSize:h,maxFiles:g,multiple:g>1||_,disabled:D,children:({getRootProps:e,getInputProps:t,isDragActive:n})=>(0,s.jsxs)(`div`,{...e(),className:(0,o.cn)(`group`,`border-border-weak`,`hover:bg-border-weak/20`,`relative grid h-52 w-full cursor-pointer place-items-center rounded-lg border-2 border-dashed px-5 py-2.5 text-center transition`,`ring-offset-background`,`focus-visible:ring-primary-weak`,`focus-visible:ring-2`,`focus-visible:ring-offset-2`,`focus-visible:outline-hidden`,n&&`border-border-primary-strong bg-border-weak/40`,D&&`pointer-events-none opacity-60`,x),...S,children:[(0,s.jsx)(`input`,{...t()}),n?(0,s.jsxs)(`div`,{className:`flex flex-col items-center justify-center gap-4 sm:px-5`,children:[(0,s.jsx)(`div`,{className:`rounded-full border border-dashed p-3`,children:(0,s.jsx)(i.Upload,{className:`size-7 text-text-positive-muted`,"aria-hidden":`true`})}),(0,s.jsx)(`p`,{className:`font-medium text-text-positive-muted`,children:`Drop the files here`})]}):(0,s.jsxs)(`div`,{className:`flex flex-col items-center justify-center gap-4 sm:px-5`,children:[(0,s.jsx)(`div`,{className:`rounded-full border border-dashed p-3`,children:(0,s.jsx)(i.Upload,{size:b||24,className:`text-muted-foreground`,"aria-hidden":`true`})}),!!y&&(0,s.jsxs)(`div`,{className:`flex flex-col gap-px`,children:[(0,s.jsxs)(`p`,{className:`font-medium text-text-positive-weak text-xs`,children:[`Drag `,`'n'`,` drop files here, or click to select files`]}),(0,s.jsxs)(`p`,{className:`text-text-positive-muted text-xs`,children:[`You can upload`,g>1?` ${g===1/0?`multiple`:g}
                       files (up to ${(0,o.formatBytes)(h)} each)`:` a file with ${(0,o.formatBytes)(h)}`]})]})]})]})}),C?.length?(0,s.jsxs)(`div`,{className:`h-fit w-full overflow-y-auto`,children:[(0,s.jsxs)(`div`,{className:`flex items-center justify-between px-3 py-2.5`,children:[(0,s.jsxs)(`div`,{className:`flex items-center gap-1 text-text-positive-weak`,children:[(0,s.jsx)(i.Image,{size:16,"aria-hidden":`true`}),(0,s.jsxs)(`p`,{className:`text-sm`,children:[`Ảnh đã tải lên (`,C.length,`)`]})]}),(0,s.jsxs)(`button`,{className:`flex cursor-pointer items-center gap-1 text-text-positive-muted transition-colors duration-200 hover:text-text-positive`,onClick:()=>{C&&(C.forEach(e=>{p(e)&&URL.revokeObjectURL(e.preview)}),w([]),n?.([]))},children:[(0,s.jsx)(i.Trash2,{size:16,"aria-hidden":`true`}),(0,s.jsx)(`p`,{className:`text-sm`,children:`Xóa tất cả`})]})]}),(0,s.jsx)(`div`,{className:`flex flex-col gap-2.5`,children:C?.map((e,t)=>(0,s.jsx)(f,{file:e,onRemove:()=>E(t),progress:d?.[e.name]},`${t.toString()}`))})]}):null]})}function f({file:e,progress:r,onRemove:a}){return(0,s.jsxs)(`div`,{className:`relative flex items-center gap-4 rounded border border-border-weak py-2 pr-3 pl-2 shadow-xs transition-colors hover:border-border`,children:[(0,s.jsxs)(`div`,{className:`flex flex-1 gap-2.5`,children:[p(e)?(0,s.jsx)(h,{file:e}):null,(0,s.jsxs)(`div`,{className:`flex w-full flex-col gap-2`,children:[(0,s.jsxs)(`div`,{className:`flex flex-col gap-y-0.5`,children:[(0,s.jsx)(`p`,{className:`line-clamp-1 text-sm text-text-positive`,children:e.name}),(0,s.jsx)(`p`,{className:`text-text-positive-muted text-xs`,children:(0,o.formatBytes)(e.size)})]}),r?(0,s.jsx)(n.Progress,{value:r}):null]})]}),(0,s.jsx)(`div`,{className:`flex items-center gap-2`,children:(0,s.jsxs)(t.Button,{type:`button`,variant:`ghost`,color:`danger`,size:`icon`,className:`size-7`,onClick:a,children:[(0,s.jsx)(i.Trash2,{size:16,"aria-hidden":`true`}),(0,s.jsx)(`span`,{className:`sr-only`,children:`Remove file`})]})})]})}function p(e){return`preview`in e&&typeof e.preview==`string`}const m={"application/pdf":r.PdfFileIcon,"text/csv":r.CsvFileIcon,"application/msword":r.WordFileIcon,"application/vnd.openxmlformats-officedocument.wordprocessingml.document":r.WordFileIcon,"application/vnd.ms-excel":r.ExcelFileIcon,"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet":r.ExcelFileIcon,"application/zip":r.ZipFileIcon,"application/x-zip-compressed":r.ZipFileIcon};function h({file:e}){return e.type.startsWith(`image/`)?(0,s.jsx)(`img`,{src:e.preview,className:`aspect-square size-10 shrink-0 rounded border border-border object-cover object-top shadow-sm`}):e.type.startsWith(`audio/`)?(0,s.jsx)(r.AudioFileIcon,{size:40,className:`size-10 shrink-0`,"aria-hidden":`true`}):e.type.startsWith(`video/`)?(0,s.jsx)(r.VideoFileIcon,{size:40,className:`size-10 shrink-0`,"aria-hidden":`true`}):(0,s.jsx)(m[e.type]??r.UnknownFileIcon,{size:40,className:`size-10 shrink-0`,"aria-hidden":`true`})}exports.FileUploader=d;
 //# sourceMappingURL=file-uploader.cjs.map

package/dist/ui/input.d.cts

@@ -1,2 +1,2 @@
-import { n as InputVariantProps, r as inputVariants, t as Input } from "../input-DxNK7Wo6.cjs";
+import { n as InputVariantProps, r as inputVariants, t as Input } from "../input-D73TrUof.cjs";
 export { Input, InputVariantProps, inputVariants };

package/dist/ui/input.d.mts

@@ -1,2 +1,2 @@
-import { n as InputVariantProps, r as inputVariants, t as Input } from "../input-DxNK7Wo6.mjs";
+import { n as InputVariantProps, r as inputVariants, t as Input } from "../input-D73TrUof.mjs";
 export { Input, InputVariantProps, inputVariants };

package/dist/ui/inputs/search-input.d.cts

@@ -1,2 +1,2 @@
-import { t as SearchInput } from "../../search-input-C8feOKe2.cjs";
+import { t as SearchInput } from "../../search-input-h_3MoMqK.cjs";
 export { SearchInput };

package/dist/ui/inputs/search-input.d.mts

@@ -1,2 +1,2 @@
-import { t as SearchInput } from "../../search-input-CoqwakbI.mjs";
+import { t as SearchInput } from "../../search-input-DEvYI6Rm.mjs";
 export { SearchInput };

package/dist/ui/item.cjs

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../dist-DzA--RwW.cjs"),t=require("./separator.cjs");let n=require("@customafk/react-toolkit/utils"),r=require("class-variance-authority"),i=require("react/jsx-runtime");function a({className:e,...t}){return(0,i.jsx)(`div`,{role:`list`,"data-slot":`item-group`,className:(0,n.cn)(`group/item-group flex flex-col`,e),...t})}function o({className:e,...r}){return(0,i.jsx)(t.Separator,{"data-slot":`item-separator`,orientation:`horizontal`,className:(0,n.cn)(`my-0`,e),...r})}const s=(0,r.cva)(`group/item flex items-center border border-transparent text-sm rounded-md transition-colors [a]:hover:bg-accent/50 [a]:transition-colors duration-100 flex-wrap outline-none focus-visible:border-primary-strong focus-visible:ring-primary-weak focus-visible:ring-[3px]`,{variants:{variant:{default:`bg-transparent`,outline:`border-border`,muted:`bg-muted-weak`},size:{default:`p-4 gap-4 `,sm:`py-3 px-4 gap-2.5`}},defaultVariants:{variant:`default`,size:`default`}});function c({className:t,variant:r=`default`,size:a=`default`,asChild:o=!1,...c}){return(0,i.jsx)(o?e.t:`div`,{"data-slot":`item`,"data-variant":r,"data-size":a,className:(0,n.cn)(s({variant:r,size:a,className:t})),...c})}const l=(0,r.cva)(`flex shrink-0 items-center justify-center gap-2 group-has-[[data-slot=item-description]]/item:self-start [&_svg]:pointer-events-none group-has-[[data-slot=item-description]]/item:translate-y-0.5`,{variants:{variant:{default:`bg-transparent`,icon:`size-8 border rounded-sm bg-muted [&_svg:not([class*='size-'])]:size-4`,image:`size-10 rounded-sm overflow-hidden [&_img]:size-full [&_img]:object-cover`}},defaultVariants:{variant:`default`}});function u({className:e,variant:t=`default`,...r}){return(0,i.jsx)(`div`,{"data-slot":`item-media`,"data-variant":t,className:(0,n.cn)(l({variant:t,className:e})),...r})}function d({className:e,...t}){return(0,i.jsx)(`div`,{"data-slot":`item-content`,className:(0,n.cn)(`flex flex-1 flex-col gap-1 [&+[data-slot=item-content]]:flex-none`,e),...t})}function f({className:e,...t}){return(0,i.jsx)(`div`,{"data-slot":`item-title`,className:(0,n.cn)(`flex w-fit items-center gap-2 text-sm leading-snug font-medium`,e),...t})}function p({className:e,...t}){return(0,i.jsx)(`p`,{"data-slot":`item-description`,className:(0,n.cn)(`text-muted-foreground line-clamp-2 text-sm leading-normal font-normal text-balance`,`[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4`,e),...t})}function m({className:e,...t}){return(0,i.jsx)(`div`,{"data-slot":`item-actions`,className:(0,n.cn)(`flex items-center gap-2`,e),...t})}function h({className:e,...t}){return(0,i.jsx)(`div`,{"data-slot":`item-header`,className:(0,n.cn)(`flex basis-full items-center justify-between gap-2`,e),...t})}function g({className:e,...t}){return(0,i.jsx)(`div`,{"data-slot":`item-footer`,className:(0,n.cn)(`flex basis-full items-center justify-between gap-2`,e),...t})}exports.Item=c,exports.ItemActions=m,exports.ItemContent=d,exports.ItemDescription=p,exports.ItemFooter=g,exports.ItemGroup=a,exports.ItemHeader=h,exports.ItemMedia=u,exports.ItemSeparator=o,exports.ItemTitle=f;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../dist-CIdWHwhj.cjs"),t=require("./separator.cjs");let n=require("@customafk/react-toolkit/utils"),r=require("class-variance-authority"),i=require("react/jsx-runtime");function a({className:e,...t}){return(0,i.jsx)(`div`,{role:`list`,"data-slot":`item-group`,className:(0,n.cn)(`group/item-group flex flex-col`,e),...t})}function o({className:e,...r}){return(0,i.jsx)(t.Separator,{"data-slot":`item-separator`,orientation:`horizontal`,className:(0,n.cn)(`my-0`,e),...r})}const s=(0,r.cva)(`group/item flex items-center border border-transparent text-sm rounded-md transition-colors [a]:hover:bg-accent/50 [a]:transition-colors duration-100 flex-wrap outline-none focus-visible:border-primary-strong focus-visible:ring-primary-weak focus-visible:ring-[3px]`,{variants:{variant:{default:`bg-transparent`,outline:`border-border`,muted:`bg-muted-weak`},size:{default:`p-4 gap-4 `,sm:`py-3 px-4 gap-2.5`}},defaultVariants:{variant:`default`,size:`default`}});function c({className:t,variant:r=`default`,size:a=`default`,asChild:o=!1,...c}){return(0,i.jsx)(o?e.t:`div`,{"data-slot":`item`,"data-variant":r,"data-size":a,className:(0,n.cn)(s({variant:r,size:a,className:t})),...c})}const l=(0,r.cva)(`flex shrink-0 items-center justify-center gap-2 group-has-[[data-slot=item-description]]/item:self-start [&_svg]:pointer-events-none group-has-[[data-slot=item-description]]/item:translate-y-0.5`,{variants:{variant:{default:`bg-transparent`,icon:`size-8 border rounded-sm bg-muted [&_svg:not([class*='size-'])]:size-4`,image:`size-10 rounded-sm overflow-hidden [&_img]:size-full [&_img]:object-cover`}},defaultVariants:{variant:`default`}});function u({className:e,variant:t=`default`,...r}){return(0,i.jsx)(`div`,{"data-slot":`item-media`,"data-variant":t,className:(0,n.cn)(l({variant:t,className:e})),...r})}function d({className:e,...t}){return(0,i.jsx)(`div`,{"data-slot":`item-content`,className:(0,n.cn)(`flex flex-1 flex-col gap-1 [&+[data-slot=item-content]]:flex-none`,e),...t})}function f({className:e,...t}){return(0,i.jsx)(`div`,{"data-slot":`item-title`,className:(0,n.cn)(`flex w-fit items-center gap-2 text-sm leading-snug font-medium`,e),...t})}function p({className:e,...t}){return(0,i.jsx)(`p`,{"data-slot":`item-description`,className:(0,n.cn)(`text-muted-foreground line-clamp-2 text-sm leading-normal font-normal text-balance`,`[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4`,e),...t})}function m({className:e,...t}){return(0,i.jsx)(`div`,{"data-slot":`item-actions`,className:(0,n.cn)(`flex items-center gap-2`,e),...t})}function h({className:e,...t}){return(0,i.jsx)(`div`,{"data-slot":`item-header`,className:(0,n.cn)(`flex basis-full items-center justify-between gap-2`,e),...t})}function g({className:e,...t}){return(0,i.jsx)(`div`,{"data-slot":`item-footer`,className:(0,n.cn)(`flex basis-full items-center justify-between gap-2`,e),...t})}exports.Item=c,exports.ItemActions=m,exports.ItemContent=d,exports.ItemDescription=p,exports.ItemFooter=g,exports.ItemGroup=a,exports.ItemHeader=h,exports.ItemMedia=u,exports.ItemSeparator=o,exports.ItemTitle=f;
 //# sourceMappingURL=item.cjs.map

package/dist/ui/pagination.d.cts

@@ -1,2 +1,2 @@
-import { a as PaginationLink, i as PaginationItem, n as PaginationContent, o as PaginationNext, r as PaginationEllipsis, s as PaginationPrevious, t as Pagination } from "../pagination-BRw-yZBY.cjs";
+import { a as PaginationLink, i as PaginationItem, n as PaginationContent, o as PaginationNext, r as PaginationEllipsis, s as PaginationPrevious, t as Pagination } from "../pagination-DDcO-TPf.cjs";
 export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious };

package/dist/ui/pagination.d.mts

@@ -1,2 +1,2 @@
-import { a as PaginationLink, i as PaginationItem, n as PaginationContent, o as PaginationNext, r as PaginationEllipsis, s as PaginationPrevious, t as Pagination } from "../pagination-BlLiOvY9.mjs";
+import { a as PaginationLink, i as PaginationItem, n as PaginationContent, o as PaginationNext, r as PaginationEllipsis, s as PaginationPrevious, t as Pagination } from "../pagination-DWg3Xv34.mjs";
 export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious };

package/dist/ui/resizable.cjs

@@ -1,2 +1,2 @@
-"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../rolldown-runtime-CMqjfN_6.cjs");let t=require("lucide-react"),n=require("react"),r=require("@customafk/react-toolkit/utils"),i=require("react/jsx-runtime"),a=require("react-resizable-panels");a=e.t(a,1);const o=(0,n.memo)(({className:e,...t})=>(0,i.jsx)(a.PanelGroup,{"data-slot":`resizable-panel-group`,className:(0,r.cn)(`flex h-full w-full data-[panel-group-direction=vertical]:flex-col`,e),...t}));o.displayName=`ResizablePanelGroup`;const s=(0,n.memo)(({...e})=>(0,i.jsx)(a.Panel,{"data-slot":`resizable-panel`,...e}));s.displayName=`ResizablePanel`;const c=(0,n.memo)(({withHandle:e,className:n,...o})=>(0,i.jsx)(a.PanelResizeHandle,{"data-slot":`resizable-handle`,className:(0,r.cn)(`relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90`,n),...o,children:e&&(0,i.jsx)(`div`,{className:`z-10 flex h-4 w-3 items-center justify-center rounded-xs border bg-border`,children:(0,i.jsx)(t.GripVerticalIcon,{className:`size-2.5`})})}));c.displayName=`ResizableHandle`,exports.ResizableHandle=c,exports.ResizablePanel=s,exports.ResizablePanelGroup=o;
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../rolldown-runtime-DWNI8pZO.cjs");let t=require("lucide-react"),n=require("react"),r=require("@customafk/react-toolkit/utils"),i=require("react/jsx-runtime"),a=require("react-resizable-panels");a=e.n(a,1);const o=(0,n.memo)(({className:e,...t})=>(0,i.jsx)(a.PanelGroup,{"data-slot":`resizable-panel-group`,className:(0,r.cn)(`flex h-full w-full data-[panel-group-direction=vertical]:flex-col`,e),...t}));o.displayName=`ResizablePanelGroup`;const s=(0,n.memo)(({...e})=>(0,i.jsx)(a.Panel,{"data-slot":`resizable-panel`,...e}));s.displayName=`ResizablePanel`;const c=(0,n.memo)(({withHandle:e,className:n,...o})=>(0,i.jsx)(a.PanelResizeHandle,{"data-slot":`resizable-handle`,className:(0,r.cn)(`relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90`,n),...o,children:e&&(0,i.jsx)(`div`,{className:`z-10 flex h-4 w-3 items-center justify-center rounded-xs border bg-border`,children:(0,i.jsx)(t.GripVerticalIcon,{className:`size-2.5`})})}));c.displayName=`ResizableHandle`,exports.ResizableHandle=c,exports.ResizablePanel=s,exports.ResizablePanelGroup=o;
 //# sourceMappingURL=resizable.cjs.map

package/dist/ui/resizable.d.cts

@@ -1,2 +1,2 @@
-import { n as ResizablePanel, r as ResizablePanelGroup, t as ResizableHandle } from "../resizable-CNqPu4Ck.cjs";
+import { n as ResizablePanel, r as ResizablePanelGroup, t as ResizableHandle } from "../resizable-C6JLqxF3.cjs";
 export { ResizableHandle, ResizablePanel, ResizablePanelGroup };

package/dist/ui/resizable.d.mts

@@ -1,2 +1,2 @@
-import { n as ResizablePanel, r as ResizablePanelGroup, t as ResizableHandle } from "../resizable-CNqPu4Ck.mjs";
+import { n as ResizablePanel, r as ResizablePanelGroup, t as ResizableHandle } from "../resizable-C6JLqxF3.mjs";
 export { ResizableHandle, ResizablePanel, ResizablePanelGroup };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@customafk/lunas-ui",
-  "version": "0.2.83",
+  "version": "0.2.84",
   "description": "UI library for Lunas Enterprise",
   "type": "module",
   "author": {
@@ -470,12 +470,14 @@
     "@tanstack/react-virtual": "^3.13.12",
     "@tiptap/extension-bubble-menu": "^3.26.0",
     "@tiptap/extension-character-count": "^3.26.0",
+    "@tiptap/extension-code-block-lowlight": "^3.26.0",
     "@tiptap/extension-color": "^3.26.0",
-    "@tiptap/extension-floating-menu": "^3.26.0",
     "@tiptap/extension-highlight": "^3.26.0",
+    "@tiptap/extension-image": "^3.26.0",
     "@tiptap/extension-link": "^3.26.0",
     "@tiptap/extension-list-keymap": "^3.26.0",
     "@tiptap/extension-placeholder": "^3.26.0",
+    "@tiptap/extension-table": "^3.26.0",
     "@tiptap/extension-task-item": "^3.26.0",
     "@tiptap/extension-task-list": "^3.26.0",
     "@tiptap/extension-text-align": "^3.26.0",
@@ -483,10 +485,13 @@
     "@tiptap/extension-underline": "^3.26.0",
     "@tiptap/react": "^3.26.0",
     "@tiptap/starter-kit": "^3.26.0",
+    "@tiptap/suggestion": "^3.26.0",
     "class-variance-authority": "^0.7.0",
     "cmdk": "^1.1.0",
+    "dompurify": "^3.4.13",
     "embla-carousel-react": "^8.6.0",
     "input-otp": "^1.4.0",
+    "lowlight": "^3.3.0",
     "lucide-react": "^0.545.0",
     "nanoid": "^5.1.6",
     "next-themes": "^0.4.6",

package/styles/text-editor.css

@@ -1,10 +1,19 @@
-/* ProseMirror editor content styles */
+/* ProseMirror editor content styles
+   Font sizes/margins below use `em` (not `rem`) so the whole type scale — headings,
+   paragraphs, lists — scales together with the `size` variant (sm/md/lg sets the
+   component's own font-size; `rem` would ignore that and always read the page root). */
 .lunas-text-editor .ProseMirror {
   outline: none;
   min-height: 8rem;
   padding: 0.5rem 0.75rem;
 }
 
+/* First block shouldn't carry its normal top margin — avoids a lopsided gap before the
+   very first heading/paragraph in the document. */
+.lunas-text-editor .ProseMirror > :first-child {
+  margin-top: 0 !important;
+}
+
 /* Placeholder */
 .lunas-text-editor .ProseMirror p.is-editor-empty:first-child::before {
   color: var(--text-positive-muted);
@@ -14,46 +23,58 @@
   pointer-events: none;
 }
 
-/* Headings */
+/* Headings — tighter line-height and slight negative tracking at large sizes reads as
+   more "designed", the way editorial/essay typography usually looks; generous margin-top
+   separates sections while margin-bottom stays tight so a heading visually "owns" the
+   paragraph that follows it. */
 .lunas-text-editor .ProseMirror h1 {
-  font-size: 1.875rem;
-  font-weight: 700;
-  line-height: 2.25rem;
+  font-size: 2em;
+  font-weight: 800;
+  line-height: 1.25;
+  letter-spacing: -0.02em;
   color: var(--text-positive-strong);
-  margin-top: 1.25rem;
-  margin-bottom: 0.5rem;
+  margin-top: 1.6em;
+  margin-bottom: 0.6em;
+  text-wrap: pretty;
 }
 
 .lunas-text-editor .ProseMirror h2 {
-  font-size: 1.5rem;
-  font-weight: 600;
-  line-height: 2rem;
+  font-size: 1.5em;
+  font-weight: 700;
+  line-height: 1.3;
+  letter-spacing: -0.015em;
   color: var(--text-positive-strong);
-  margin-top: 1rem;
-  margin-bottom: 0.5rem;
+  margin-top: 1.5em;
+  margin-bottom: 0.6em;
+  text-wrap: pretty;
 }
 
 .lunas-text-editor .ProseMirror h3 {
-  font-size: 1.25rem;
+  font-size: 1.25em;
   font-weight: 600;
-  line-height: 1.75rem;
+  line-height: 1.4;
   color: var(--text-positive-strong);
-  margin-top: 0.875rem;
-  margin-bottom: 0.375rem;
+  margin-top: 1.3em;
+  margin-bottom: 0.5em;
+  text-wrap: pretty;
 }
 
-/* Paragraph */
+/* Paragraph — 1.75 line-height and bottom-only margin is the standard "comfortable long-form
+   reading" combination (matches what most editorial/blog typesetting uses); `text-wrap: pretty`
+   avoids single short words getting orphaned onto their own line. */
 .lunas-text-editor .ProseMirror p {
-  margin: 0.25rem 0;
+  font-size: 1em;
+  margin: 0 0 1.15em;
   color: var(--text-positive);
-  line-height: 1.625;
+  line-height: 1.75;
+  text-wrap: pretty;
 }
 
 /* Lists */
 .lunas-text-editor .ProseMirror ul,
 .lunas-text-editor .ProseMirror ol {
-  padding-left: 1.5rem;
-  margin: 0.5rem 0;
+  padding-left: 1.5em;
+  margin: 0 0 1.15em;
   color: var(--text-positive);
 }
 
@@ -61,24 +82,67 @@
   list-style-type: disc;
 }
 
+.lunas-text-editor .ProseMirror ul ul {
+  list-style-type: circle;
+}
+
+.lunas-text-editor .ProseMirror ul ul ul {
+  list-style-type: square;
+}
+
+/* Nested lists sit inside a parent `<li>` — reset that inherited bottom margin so the
+   nested block hugs its parent item instead of adding extra gap before the next sibling. */
+.lunas-text-editor .ProseMirror li > ul,
+.lunas-text-editor .ProseMirror li > ol {
+  margin: 0.4em 0 0;
+}
+
+/* Ordered lists use CSS counters (not `list-style-type`) so nested levels chain the
+   parent's number — 1, 2 → 1.1, 1.2 → 1.1.1, 1.1.2 — instead of restarting at a/b/c. */
 .lunas-text-editor .ProseMirror ol {
-  list-style-type: decimal;
+  list-style: none;
+  counter-reset: list-item;
+  padding-left: 2.25em;
+}
+
+.lunas-text-editor .ProseMirror ol > li {
+  counter-increment: list-item;
+  position: relative;
+}
+
+.lunas-text-editor .ProseMirror ol > li::before {
+  /* `right: 100%` anchors the marker's right edge to the left edge of `li` (its
+     containing block) — the box then auto-sizes to content, so it works at any nesting
+     depth without a fixed width. Non-breaking spaces (regular trailing spaces get
+     trimmed by normal CSS whitespace rules) guarantee a real gap before the item text. */
+  content: counters(list-item, '.') '.\00a0\00a0';
+  position: absolute;
+  right: 100%;
+  color: var(--text-positive-weak);
+  font-variant-numeric: tabular-nums;
+  white-space: nowrap;
 }
 
 .lunas-text-editor .ProseMirror li {
-  margin: 0.125rem 0;
-  line-height: 1.625;
+  margin: 0.35em 0;
+  line-height: 1.75;
 }
 
 /* Blockquote */
 .lunas-text-editor .ProseMirror blockquote {
   border-left: 3px solid var(--primary-weak);
-  padding-left: 1rem;
-  margin: 0.75rem 0;
+  padding-left: 1.1em;
+  margin: 1.3em 0;
   color: var(--text-positive-weak);
+  font-size: 1.05em;
+  line-height: 1.7;
   font-style: italic;
 }
 
+.lunas-text-editor .ProseMirror blockquote p {
+  margin: 0;
+}
+
 /* Inline code */
 .lunas-text-editor .ProseMirror code {
   font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
@@ -95,10 +159,11 @@
   background-color: var(--muted-intense);
   color: var(--text-negative);
   font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
-  font-size: 0.875rem;
+  font-size: 0.9em;
+  line-height: 1.6;
   border-radius: 0.375rem;
-  padding: 0.75rem 1rem;
-  margin: 0.75rem 0;
+  padding: 0.9em 1.1em;
+  margin: 1.15em 0;
   overflow-x: auto;
 }
 
@@ -114,12 +179,12 @@
 .lunas-text-editor .ProseMirror hr {
   border: none;
   border-top: 1px solid var(--border);
-  margin: 1rem 0;
+  margin: 2em 0;
 }
 
 /* Strong / Bold */
 .lunas-text-editor .ProseMirror strong {
-  font-weight: 600;
+  font-weight: 700;
   color: var(--text-positive-strong);
 }
 
@@ -161,36 +226,138 @@
 .lunas-text-editor .ProseMirror ul[data-type='taskList'] {
   list-style: none;
   padding-left: 0;
-  margin: 0.5rem 0;
+  margin: 0 0 1.15em;
 }
 
 .lunas-text-editor .ProseMirror ul[data-type='taskList'] li {
   display: flex;
   align-items: flex-start;
-  gap: 0.5rem;
-  padding: 0.125rem 0;
+  gap: 0.5em;
+  padding: 0.2em 0;
   margin: 0;
 }
 
 .lunas-text-editor .ProseMirror ul[data-type='taskList'] li > label {
   flex: 0 0 auto;
   user-select: none;
-  margin-top: 0.2rem;
+  margin-top: 0.25em;
 }
 
 .lunas-text-editor .ProseMirror ul[data-type='taskList'] li > label input[type='checkbox'] {
   cursor: pointer;
   accent-color: var(--primary);
-  width: 0.875rem;
-  height: 0.875rem;
+  width: 0.875em;
+  height: 0.875em;
 }
 
 .lunas-text-editor .ProseMirror ul[data-type='taskList'] li > div {
   flex: 1;
-  line-height: 1.625;
+  line-height: 1.75;
 }
 
 .lunas-text-editor .ProseMirror ul[data-type='taskList'] li[data-checked='true'] > div {
   color: var(--text-positive-weak);
   text-decoration: line-through;
 }
+
+/* Image — centering, spacing, selected-state, and the caption link are all handled by
+   `ImageNodeView` (Tailwind classes) since the image is rendered via a React node view,
+   not plain HTML. Nothing to style here. */
+
+/* Table */
+.lunas-text-editor .ProseMirror table {
+  border-collapse: collapse;
+  table-layout: fixed;
+  width: 100%;
+  margin: 1.3em 0;
+  font-size: 0.95em;
+  overflow: hidden;
+}
+
+.lunas-text-editor .ProseMirror th,
+.lunas-text-editor .ProseMirror td {
+  border: 1px solid var(--border);
+  padding: 0.6em 0.75em;
+  line-height: 1.5;
+  vertical-align: top;
+  color: var(--text-positive);
+  position: relative;
+}
+
+.lunas-text-editor .ProseMirror th {
+  background-color: var(--muted-muted);
+  color: var(--text-positive-strong);
+  font-weight: 600;
+  text-align: left;
+}
+
+.lunas-text-editor .ProseMirror .selectedCell::after {
+  content: '';
+  position: absolute;
+  inset: 0;
+  background-color: var(--primary-muted);
+  opacity: 0.5;
+  pointer-events: none;
+}
+
+.lunas-text-editor .ProseMirror .column-resize-handle {
+  position: absolute;
+  top: 0;
+  bottom: -2px;
+  right: -2px;
+  width: 4px;
+  background-color: var(--primary);
+  pointer-events: none;
+}
+
+/* Code block syntax highlighting (lowlight/highlight.js token classes) */
+.lunas-text-editor .ProseMirror pre .hljs-comment,
+.lunas-text-editor .ProseMirror pre .hljs-quote {
+  color: #5c6370;
+  font-style: italic;
+}
+
+.lunas-text-editor .ProseMirror pre .hljs-keyword,
+.lunas-text-editor .ProseMirror pre .hljs-selector-tag,
+.lunas-text-editor .ProseMirror pre .hljs-tag {
+  color: #c678dd;
+}
+
+.lunas-text-editor .ProseMirror pre .hljs-string,
+.lunas-text-editor .ProseMirror pre .hljs-symbol,
+.lunas-text-editor .ProseMirror pre .hljs-bullet,
+.lunas-text-editor .ProseMirror pre .hljs-addition {
+  color: #98c379;
+}
+
+.lunas-text-editor .ProseMirror pre .hljs-number,
+.lunas-text-editor .ProseMirror pre .hljs-literal {
+  color: #d19a66;
+}
+
+.lunas-text-editor .ProseMirror pre .hljs-title,
+.lunas-text-editor .ProseMirror pre .hljs-title.function_,
+.lunas-text-editor .ProseMirror pre .hljs-built_in {
+  color: #61afef;
+}
+
+.lunas-text-editor .ProseMirror pre .hljs-attr,
+.lunas-text-editor .ProseMirror pre .hljs-attribute,
+.lunas-text-editor .ProseMirror pre .hljs-variable,
+.lunas-text-editor .ProseMirror pre .hljs-params,
+.lunas-text-editor .ProseMirror pre .hljs-name,
+.lunas-text-editor .ProseMirror pre .hljs-deletion {
+  color: #e06c75;
+}
+
+.lunas-text-editor .ProseMirror pre .hljs-meta {
+  color: #56b6c2;
+}
+
+.lunas-text-editor .ProseMirror pre .hljs-emphasis {
+  font-style: italic;
+}
+
+.lunas-text-editor .ProseMirror pre .hljs-strong {
+  font-weight: 700;
+}

package/dist/action-submit-B9vHpLoN.cjs

@@ -1,2 +0,0 @@
-const e=require("./ui/button.cjs"),t=require("./tanstack-form-C0ab8EEl.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-B9vHpLoN.cjs.map

package/dist/action-submit-BQdkz4mS.mjs

@@ -1,2 +0,0 @@
-import{Button as e}from"./ui/button.mjs";import{K as t}from"./tanstack-form-fkaBh9RO.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-BQdkz4mS.mjs.map

package/dist/actions-form-D4n1W3-X.mjs

@@ -1,2 +0,0 @@
-import{Button as e}from"./ui/button.mjs";import{K as t}from"./tanstack-form-fkaBh9RO.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-D4n1W3-X.mjs.map

package/dist/actions-form-DF2eYxGQ.cjs

@@ -1,2 +0,0 @@
-const e=require("./ui/button.cjs"),t=require("./tanstack-form-C0ab8EEl.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-DF2eYxGQ.cjs.map

package/dist/checkbox-field-BRGTLOjq.mjs

@@ -1,2 +0,0 @@
-import{Checkbox as e}from"./ui/checkbox.mjs";import{G as t}from"./tanstack-form-fkaBh9RO.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-BRGTLOjq.mjs.map

package/dist/checkbox-field-ldZRSCca.cjs

@@ -1,2 +0,0 @@
-const e=require("./ui/checkbox.cjs"),t=require("./tanstack-form-C0ab8EEl.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-ldZRSCca.cjs.map

package/dist/combobox-field-CvkdZkQE.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-fkaBh9RO.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-CvkdZkQE.mjs.map

package/dist/combobox-field-ZYr7636s.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-C0ab8EEl.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-ZYr7636s.cjs.map