4f:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 50:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 51:Tf31,'use client'; import { Checkbox as CheckboxPrimitive, useCheckbox, useCheckboxContext, useCheckboxGroup, useCheckboxGroupContext, } from '@ark-ui/react/checkbox'; import { clsx } from 'clsx'; import type { ComponentProps, ComponentRef } from 'react'; import { forwardRef } from 'react'; import { CheckIcon, IndeterminateIcon } from '@/lib/moduix/icons/ui'; import styles from './Checkbox.module.css'; type CheckboxSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl'; type RootProps = ComponentProps & { size?: CheckboxSize }; type RootProviderProps = ComponentProps & { size?: CheckboxSize; }; const CheckboxRoot = forwardRef, RootProps>( function CheckboxRoot({ className, size = 'md', ...props }, ref) { return ( ); }, ); const CheckboxRootProvider = forwardRef< ComponentRef, RootProviderProps >(function CheckboxRootProvider({ className, size = 'md', ...props }, ref) { return ( ); }); const CheckboxIndicator = forwardRef< ComponentRef, ComponentProps >(function CheckboxIndicator({ className, children, indeterminate, ...props }, ref) { const slot = indeterminate ? 'checkbox-indicator-indeterminate-icon' : 'checkbox-indicator-checked-icon'; return ( {children ?? ( )} ); }); const CheckboxControl = forwardRef< ComponentRef, ComponentProps >(function CheckboxControl({ children, className, ...props }, ref) { return ( {children ?? ( <> )} ); }); const CheckboxLabel = forwardRef< ComponentRef, ComponentProps >(function CheckboxLabel({ className, ...props }, ref) { return ( ); }); const CheckboxGroup = forwardRef< ComponentRef, ComponentProps >(function CheckboxGroup({ className, ...props }, ref) { return ( ); }); const Checkbox = Object.assign(CheckboxRoot, { Root: CheckboxRoot, RootProvider: CheckboxRootProvider, Context: CheckboxPrimitive.Context, HiddenInput: CheckboxPrimitive.HiddenInput, Control: CheckboxControl, Indicator: CheckboxIndicator, Label: CheckboxLabel, Group: CheckboxGroup, }); export { Checkbox, useCheckbox, useCheckboxContext, useCheckboxGroup, useCheckboxGroupContext };52:T1689,@layer moduix.components { .root { display: inline-flex; align-items: center; gap: var(--moduix-checkbox-gap, var(--moduix-spacing-2)); vertical-align: middle; color: var( --moduix-checkbox-label-color, var(--moduix-checkbox-group-color, var(--moduix-color-foreground)) ); cursor: pointer; &[data-disabled], &[data-readonly] { cursor: default; } &[data-disabled] { opacity: var(--moduix-checkbox-disabled-opacity, var(--moduix-opacity-disabled)); } } .control { box-sizing: border-box; display: inline-flex; flex: none; align-items: center; justify-content: center; width: var(--_checkbox-size, 1.25rem); height: var(--_checkbox-size, 1.25rem); margin: 0; border: var(--moduix-checkbox-border-width, var(--moduix-border-width-sm)) solid var(--moduix-checkbox-border-color, var(--moduix-color-border)); border-radius: var(--moduix-checkbox-radius, var(--moduix-radius-xs)); padding: 0; background-color: var(--moduix-checkbox-bg, var(--moduix-color-background)); color: var(--moduix-checkbox-color, var(--moduix-color-primary-foreground)); line-height: 0; user-select: none; transition: background-color var(--moduix-checkbox-transition, var(--moduix-transition-default)), border-color var(--moduix-checkbox-transition, var(--moduix-transition-default)), color var(--moduix-checkbox-transition, var(--moduix-transition-default)), opacity var(--moduix-checkbox-transition, var(--moduix-transition-default)); &[data-state='checked'], &[data-state='indeterminate'] { border-color: var(--moduix-checkbox-border-color-checked, var(--moduix-color-primary)); background-color: var(--moduix-checkbox-bg-checked, var(--moduix-color-primary)); } &[data-focus-visible] { outline: var( --moduix-checkbox-focus-ring-width, var(--moduix-focus-ring-inset-width, var(--moduix-border-width-sm)) ) solid var(--moduix-checkbox-focus-ring-color, var(--moduix-color-ring)); outline-offset: var(--moduix-checkbox-focus-ring-offset, var(--moduix-border-width-sm)); } &[data-invalid] { border-color: var(--moduix-checkbox-border-color-invalid, var(--moduix-color-destructive)); color: var(--moduix-checkbox-color-invalid, var(--moduix-color-destructive-foreground)); &[data-state='checked'], &[data-state='indeterminate'] { border-color: var(--moduix-checkbox-border-color-invalid, var(--moduix-color-destructive)); background-color: var(--moduix-checkbox-bg-invalid, var(--moduix-color-destructive)); } &[data-focus-visible] { outline-color: var( --moduix-checkbox-focus-ring-color-invalid, var(--moduix-checkbox-border-color-invalid, var(--moduix-color-destructive)) ); } } @media (hover: hover) { &[data-state='unchecked'][data-hover]:not([data-readonly], [data-disabled]) { background-color: var(--moduix-checkbox-bg-hover, var(--moduix-color-accent)); } &:is([data-state='checked'], [data-state='indeterminate'])[data-hover]:not( [data-readonly], [data-disabled] ) { background-color: var( --moduix-checkbox-bg-checked-hover, var(--moduix-checkbox-bg-checked, var(--moduix-color-primary)) ); &[data-invalid] { background-color: var( --moduix-checkbox-bg-invalid-hover, var(--moduix-checkbox-bg-invalid, var(--moduix-color-destructive)) ); } } } } .root[data-size='xs'] .control { --_checkbox-size: var(--moduix-checkbox-size-xs, var(--moduix-spacing-3-5)); --_checkbox-icon-size: var(--moduix-checkbox-icon-size-xs, var(--moduix-spacing-2)); } .root[data-size='sm'] .control { --_checkbox-size: var(--moduix-checkbox-size-sm, var(--moduix-spacing-4)); --_checkbox-icon-size: var(--moduix-checkbox-icon-size-sm, var(--moduix-spacing-2-5)); } .root[data-size='md'] .control { --_checkbox-size: var(--moduix-checkbox-size-md, var(--moduix-spacing-5)); --_checkbox-icon-size: var(--moduix-checkbox-icon-size-md, var(--moduix-spacing-3)); } .root[data-size='lg'] .control { --_checkbox-size: var(--moduix-checkbox-size-lg, var(--moduix-size-xs)); --_checkbox-icon-size: var(--moduix-checkbox-icon-size-lg, var(--moduix-spacing-3-5)); } .root[data-size='xl'] .control { --_checkbox-size: var(--moduix-checkbox-size-xl, var(--moduix-spacing-7)); --_checkbox-icon-size: var(--moduix-checkbox-icon-size-xl, var(--moduix-spacing-4)); } .indicator { display: inline-flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: inherit; } .icon { display: inline-flex; align-items: center; justify-content: center; width: var(--_checkbox-icon-size, 0.75rem); height: var(--_checkbox-icon-size, 0.75rem); color: inherit; line-height: 0; & > svg { width: 100%; height: 100%; } } .label { color: var( --moduix-checkbox-label-color, var(--moduix-checkbox-group-color, var(--moduix-color-foreground)) ); font-size: var(--moduix-checkbox-label-font-size, var(--moduix-text-sm)); font-weight: var(--moduix-checkbox-label-font-weight, var(--moduix-weight-medium)); line-height: var(--moduix-checkbox-label-line-height, var(--moduix-line-height-text-sm)); } .group { display: flex; flex-direction: column; gap: var(--moduix-checkbox-group-gap, var(--moduix-spacing-2)); color: var(--moduix-checkbox-group-color, var(--moduix-color-foreground)); } }4e:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","@ark-ui/react",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/%40ark-ui%2Freact","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"@ark-ui/react"}]]}]}],["$","li","clsx",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/clsx","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"clsx"}]]}]}]]}],["$","$L4f",null,{"namespace":"@moduix-react","registryDependencies":["@moduix-react/foundation","@moduix-react/icons"]}]]}],null]}],["$","$L50",null,{"files":[{"path":"src/components/checkbox/Checkbox.tsx","content":"$51","type":"registry:component","target":"@components/ui/checkbox/Checkbox.tsx"},{"path":"src/components/checkbox/Checkbox.module.css","content":"$52","type":"registry:file","target":"@components/ui/checkbox/Checkbox.module.css"},{"path":"src/components/checkbox/index.ts","content":"export * from './Checkbox.js';","type":"registry:component","target":"@components/ui/checkbox/index.ts"}],"className":"h-[70svh] min-h-80"}]]}]