@01.software/ui 0.0.0-stage → 0.2.0

package/CHANGELOG.md

@@ -0,0 +1,18 @@
+# @01.software/ui
+
+## 0.2.0
+
+### Minor Changes
+
+- ecd1cae: Expose the existing basic controls and menus through component subpaths with precompiled theme and motion styles, and improve radio spacing, field layouts and tab variants.
+
+  Refine compact macOS control geometry, segmented tabs, raised dark popup surfaces, and visible keyboard focus.
+
+- 3175bfd: Allow applications to customize the built-in Dialog close button label with
+  `closeLabel`, preserving the existing Korean default and dismissal behavior.
+
+## 0.1.0
+
+### Minor Changes
+
+- ae2631d: Register the six existing React 19 component subpaths and precompiled stylesheet for trusted public distribution. The unprefixed theme tokens are a pre-1.0 compatibility surface; no root barrel, reset, font loader, or additional component is introduced.

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 01 SOFTWARE contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,155 @@
-# Temporary Holding Version
+# @01.software/ui
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+Compact React 19 controls, built from the existing Web shadcn/Radix primitives.
+Web and the package catalogue use the same implementation. Import individual
+component subpaths and one precompiled stylesheet; there is no root barrel or
+framework adapter.
+
+```tsx
+import { Button } from '@01.software/ui/button'
+import { Checkbox } from '@01.software/ui/checkbox'
+import { Label } from '@01.software/ui/label'
+import {
+  Dialog,
+  DialogTrigger,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+  DialogDescription,
+} from '@01.software/ui/dialog'
+import '@01.software/ui/styles.css'
+```
+
+## Components
+
+| Subpath        | Public components and helpers                                                                                                                                                                                                                                          |
+| -------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `button`       | Button, buttonVariants                                                                                                                                                                                                                                                 |
+| `input`        | Input                                                                                                                                                                                                                                                                  |
+| `field`        | Field, FieldSet, FieldLegend, FieldGroup, FieldContent, FieldLabel, FieldTitle, FieldDescription, FieldSeparator, FieldError                                                                                                                                           |
+| `select`       | Select, SelectTrigger, SelectValue, SelectContent, SelectItem, SelectGroup, SelectLabel, SelectSeparator, SelectScrollUpButton, SelectScrollDownButton                                                                                                                 |
+| `radio-group`  | RadioGroup, RadioGroupItem                                                                                                                                                                                                                                             |
+| `tabs`         | Tabs, TabsList, TabsTrigger, TabsContent, tabsListVariants                                                                                                                                                                                                             |
+| `accordion`    | Accordion, AccordionItem, AccordionTrigger, AccordionContent                                                                                                                                                                                                           |
+| `alert`        | Alert, AlertTitle, AlertDescription                                                                                                                                                                                                                                    |
+| `badge`        | Badge, badgeVariants                                                                                                                                                                                                                                                   |
+| `checkbox`     | Checkbox                                                                                                                                                                                                                                                               |
+| `dialog`       | Dialog, DialogTrigger, DialogClose, DialogPortal, DialogOverlay, DialogContent, DialogHeader, DialogFooter, DialogTitle, DialogDescription                                                                                                                             |
+| `label`        | Label                                                                                                                                                                                                                                                                  |
+| `popover`      | Popover, PopoverTrigger, PopoverAnchor, PopoverClose, PopoverContent, PopoverHeader, PopoverTitle, PopoverDescription                                                                                                                                                  |
+| `progress`     | Progress                                                                                                                                                                                                                                                               |
+| `separator`    | Separator                                                                                                                                                                                                                                                              |
+| `skeleton`     | Skeleton                                                                                                                                                                                                                                                               |
+| `slider`       | Slider                                                                                                                                                                                                                                                                 |
+| `switch`       | Switch                                                                                                                                                                                                                                                                 |
+| `textarea`     | Textarea                                                                                                                                                                                                                                                               |
+| `tooltip`      | TooltipProvider, Tooltip, TooltipTrigger, TooltipContent                                                                                                                                                                                                               |
+| `command-menu` | CommandMenuRoot, CommandMenuTrigger, CommandMenuContent, CommandMenuItem, CommandMenuCheckboxItem, CommandMenuRadioItem, CommandMenuRadioGroup, CommandMenuGroup, CommandMenuLabel, CommandMenuSeparator, CommandMenuSub, CommandMenuSubTrigger, CommandMenuSubContent |
+| `menubar`      | Menubar, MenubarMenu, MenubarGroup, MenubarLabel, MenubarRadioGroup, MenubarRadioItem, MenubarSub, MenubarSubTrigger, MenubarSubContent, MenubarShortcut, MenubarTrigger, MenubarContent, MenubarItem, MenubarCheckboxItem, MenubarSeparator                           |
+
+React and React DOM are peers restricted to major 19. File-by-file TypeScript
+emit preserves client boundaries. Button, Input, Alert, Badge, Skeleton and
+Textarea can render in a server page; interactive families are client
+boundaries. Modules do not import Next, Payload, SDK, private contracts or Web
+aliases. React is not bundled.
+
+The components supply presentation and Radix interaction, not form state,
+validation or authentication. Associate labels with `htmlFor`, and supporting
+copy/errors with `aria-describedby` and `aria-invalid`. FieldError deduplicates
+messages and announces them with `role="alert"`; it does not wire those IDs.
+Field supports vertical, horizontal and responsive composition. Tabs supports
+horizontal/vertical orientation, the default segmented tray, the line variant
+and the existing `visual="compact"` trigger style.
+
+Checkbox supports checked, unchecked and indeterminate states. Slider accepts
+`thumbLabels` for distinct range-thumb names; shared labels remain associated
+with each thumb. Progress clamps finite values and treats absent/non-finite
+values as indeterminate. Skeleton is decorative. Select is a Radix single
+select, and CommandMenu exposes dropdown/context menus rather than a searchable
+command palette. Dialog/Popover/Tooltip retain Radix focus and dismissal
+behavior. Use their triggers with an accessible name; icon-only controls need
+an explicit label. `DialogContent` accepts `closeLabel` for the built-in close
+button (default `닫기`); `showCloseButton={false}` omits that button while
+preserving Escape dismissal. Button has no `asChild` or built-in loading state.
+
+## Dashboard and SaaS composition
+
+Start with `Getting started` and `Recipes` in the package catalogue on port 6008. Copy the desired AppShell, DataList or SettingsForm source and
+`recipes.css` from [`apps/design-system/recipes`](../../../apps/design-system/recipes/README.md)
+into your application. These are copyable compositions, not additional package
+exports. They use React, public UI subpaths and explicit CSS, without Next,
+Web aliases, Tailwind generation, authentication or a data-provider framework.
+The application supplies navigation, data and async persistence.
+
+Web's `Pages` / `Proposals` folders on port 6007 retain the broader local
+settings, list/detail, account and plan explorations. They are Web examples;
+use the 6008 recipes as the portable starting point.
+
+Keep visible labels and connect descriptions/errors with `htmlFor`,
+`aria-describedby` and `aria-invalid`. `Field` supplies layout, not form state
+or validation. Supporting text has no automatic relationship to a control.
+The copyable recipe stylesheet explicitly adds field/content spacing; the
+catalogue's private presentation helper is not part of the package. Use `RadioGroup` for a single choice, `Checkbox` for independent
+choices, and `Switch` for an immediate on/off setting. Default Input, Select
+and Button heights align at 32px; compact Button/Select sizes are 28px. Let
+long labels wrap and use responsive Field layout where labels need more room.
+
+Tabs use a compact segmented tray by default; `variant="line"` and vertical
+orientation support denser settings/navigation. All interactive primitives keep
+visible keyboard focus. Typography remains inherited from the consumer.
+
+## Styles, themes and overrides
+
+Import `@01.software/ui/styles.css` once from your application stylesheet or
+layout. No Tailwind setup, package-source scan, global reset or font download
+is required. The application owns document typography and root size. Set
+`data-theme="dark"` on the document root for dark mode so portalled surfaces
+inherit it. A theme only on a subtree does not reach body portals.
+
+The stylesheet supplies the implementations' utility classes, scoped control
+and heading defaults, and Radix enter/exit motion. Reduced motion removes
+scale/height travel while preserving opacity feedback. The `--ui-surface` token gives portalled menus and dialogs a raised neutral
+surface in dark mode; consumers can override it alongside the existing palette.
+Public theme tokens are
+`--foreground`, `--background`, `--muted-foreground`, `--border`,
+`--destructive`, `--paper`, `--ink` and `--ink-muted`. Token names and default
+states are subject to semver.
+
+This is a global stylesheet with unprefixed utility/token names; coexistence
+with another system defining the same names is outside the support boundary.
+Its layer order is `theme`, `base`, `components`, `utilities` (Tailwind may also
+emit a `properties` initialization layer). Web loads the distribution CSS
+before its own utilities and excludes package source from its Tailwind scan.
+
+`className` uses clsx and tailwind-merge. Classes absent from the implementations
+need consumer-owned CSS; an arbitrary new Tailwind class string does not
+produce a utility. State-selector conflicts are governed by the CSS cascade.
+Load overrides later in the same layer, in a later declared layer, or use
+unlayered CSS targeting the component data-slot/state. The catalogue builds
+its example-only layout utilities separately from the shipped stylesheet.
+
+## Verification and publication
+
+`corepack pnpm --filter @01.software/ui test` builds JS, declarations and CSS,
+checks all subpaths and import closure, client boundaries, SSR semantics and
+the reset/font/layer boundary. The catalogue at loopback port 6008 adds state,
+responsive, theme and keyboard examples. These checks do not establish full
+accessibility, authenticated workflows or publication.
+
+A packed external Next consumer without Tailwind/global reset verifies the
+actual distribution, including portal styles and interaction. Evidence is
+bound to its tarball and source inputs; supported peers do not claim a broader
+framework/browser matrix.
+
+Consult `package.json` for the repository package version and `.changeset/` for
+pending release intent. Prepare production versions through the ordinary
+Changesets process. Registration, preparation and registry availability are
+separate states; repository metadata alone does not establish npm publication. The
+final trusted Actions artifact needs its own fresh consumer check before
+publication, as required by the [release guide](../../../docs/packages/release.md).
+Historical `0.0.0` extraction evidence does not replace that gate.
+
+LICENSE and THIRD_PARTY_NOTICES.md contain the existing MIT distribution and
+shadcn/Tailwind attribution. Consumer-installed peers/dependencies retain their
+licenses. Web fonts are not distributed. Source/tag evidence is not an npm
+provenance attestation for this private repository.

package/THIRD_PARTY_NOTICES.md

@@ -0,0 +1,89 @@
+# Third-party notices
+
+The six primitives were extracted without source/API/CSS changes from the Web
+implementation in #4419. The Field family and Radix wrapper/data-slot patterns
+retain adaptations of shadcn/ui; its upstream notice is preserved below.
+Web-specific classes and behavior are retained. This attribution does not
+claim the current upstream main revision was the original imported revision.
+
+The precompiled stylesheet includes selected Tailwind CSS utilities and
+custom-property initialization. Tailwind's MIT notice is preserved below.
+No Web fonts, reset or page layout is distributed.
+
+## Source and compiled CSS notices
+
+### shadcn-ui
+
+Official license: https://raw.githubusercontent.com/shadcn-ui/ui/main/LICENSE.md
+
+```text
+MIT License
+
+Copyright (c) 2023 shadcn
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+```
+
+### tailwindcss
+
+Official license: https://raw.githubusercontent.com/tailwindlabs/tailwindcss/v4.3.0/LICENSE
+
+```text
+MIT License
+
+Copyright (c) Tailwind Labs, Inc.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+```
+
+## External runtime dependencies
+
+These packages are imported, not bundled into the UI emitted modules. Their
+installed distributions retain their own license files and notices. Versions
+below are the lockfile-backed verification inputs, not a promise to pin
+consumer resolution beyond the public dependency ranges.
+
+| Dependency               | Verified version | License    | Official source                                                |
+| ------------------------ | ---------------- | ---------- | -------------------------------------------------------------- |
+| class-variance-authority | 0.7.1            | Apache-2.0 | https://github.com/joe-bell/cva/blob/main/LICENSE              |
+| clsx                     | 2.1.1            | MIT        | https://github.com/lukeed/clsx/blob/v2.1.1/license             |
+| lucide-react             | 1.14.0           | ISC        | https://github.com/lucide-icons/lucide/blob/main/LICENSE       |
+| radix-ui                 | 1.4.3            | MIT        | https://github.com/radix-ui/primitives/blob/main/LICENSE       |
+| tailwind-merge           | 3.5.0            | MIT        | https://github.com/dcastil/tailwind-merge/blob/main/LICENSE.md |
+
+Lucide's distribution also preserves the Feather-derived icon notices
+(MIT, Copyright (c) 2013-present Cole Bemis) alongside its ISC license.
+The used icons remain imports from lucide-react, with no copied SVG artwork.
+React and React DOM are external peers, not bundled UI code.

package/dist/accordion.d.ts

@@ -0,0 +1,7 @@
+import type { ComponentProps } from 'react';
+import { Accordion as AccordionPrimitive } from 'radix-ui';
+declare const Accordion: import("react").ForwardRefExoticComponent<(AccordionPrimitive.AccordionSingleProps | AccordionPrimitive.AccordionMultipleProps) & import("react").RefAttributes<HTMLDivElement>>;
+declare function AccordionItem({ className, ...props }: ComponentProps<typeof AccordionPrimitive.Item>): import("react/jsx-runtime").JSX.Element;
+declare function AccordionTrigger({ className, children, ...props }: ComponentProps<typeof AccordionPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
+declare function AccordionContent({ className, children, ...props }: ComponentProps<typeof AccordionPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };

package/dist/accordion.js

@@ -0,0 +1,16 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Accordion as AccordionPrimitive } from 'radix-ui';
+import { ChevronDown } from 'lucide-react';
+import { cn } from './internal/cn.js';
+const Accordion = AccordionPrimitive.Root;
+function AccordionItem({ className, ...props }) {
+    return (_jsx(AccordionPrimitive.Item, { "data-slot": "accordion-item", className: cn('rounded-sm', className), ...props }));
+}
+function AccordionTrigger({ className, children, ...props }) {
+    return (_jsx(AccordionPrimitive.Header, { "data-slot": "accordion-header", className: "flex", children: _jsxs(AccordionPrimitive.Trigger, { "data-slot": "accordion-trigger", className: cn('group hover:bg-foreground/5 flex min-h-8 flex-1 items-center justify-between gap-3 rounded-sm px-2 py-2 text-left text-xs font-medium hover:no-underline focus-visible:outline-2 focus-visible:outline-offset-[-2px] focus-visible:outline-[var(--ink)] focus-visible:outline-solid disabled:pointer-events-none disabled:opacity-50', className), ...props, children: [children, _jsx(ChevronDown, { "aria-hidden": "true", className: "text-muted-foreground size-3 shrink-0 transition-transform group-data-[state=open]:rotate-180 motion-reduce:transition-none" })] }) }));
+}
+function AccordionContent({ className, children, ...props }) {
+    return (_jsx(AccordionPrimitive.Content, { "data-slot": "accordion-content", className: "motion-collapse", ...props, children: _jsx("div", { className: cn('text-muted-foreground px-2 pt-1 pb-3 text-xs leading-relaxed', className), children: children }) }));
+}
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };

package/dist/alert.d.ts

@@ -0,0 +1,9 @@
+import type { ComponentProps } from 'react';
+import { type VariantProps } from 'class-variance-authority';
+declare const alertVariants: (props?: ({
+    variant?: "default" | "destructive" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function Alert({ className, variant, role, ...props }: ComponentProps<'div'> & VariantProps<typeof alertVariants>): import("react/jsx-runtime").JSX.Element;
+declare function AlertTitle({ className, ...props }: ComponentProps<'h3'>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDescription({ className, ...props }: ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+export { Alert, AlertTitle, AlertDescription };

package/dist/alert.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cva } from 'class-variance-authority';
+import { cn } from './internal/cn.js';
+const alertVariants = cva('relative grid gap-1 rounded-md p-3 text-xs [&>svg]:absolute [&>svg]:top-3 [&>svg]:left-3 [&>svg]:size-4 [&:has(>svg)]:pl-10', {
+    variants: {
+        variant: {
+            default: 'bg-foreground/5 text-foreground',
+            destructive: 'bg-destructive/10 text-destructive',
+        },
+    },
+    defaultVariants: { variant: 'default' },
+});
+function Alert({ className, variant = 'default', role, ...props }) {
+    return (_jsx("div", { "data-slot": "alert", role: role ?? (variant === 'destructive' ? 'alert' : 'status'), className: cn(alertVariants({ variant }), className), ...props }));
+}
+function AlertTitle({ className, ...props }) {
+    return (_jsx("h3", { "data-slot": "alert-title", className: cn('leading-relaxed font-medium', className), ...props }));
+}
+function AlertDescription({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "alert-description", className: cn('leading-relaxed [&_p]:not-last:mb-2', className), ...props }));
+}
+export { Alert, AlertTitle, AlertDescription };

package/dist/badge.d.ts

@@ -0,0 +1,9 @@
+import type { ComponentProps } from 'react';
+import { type VariantProps } from 'class-variance-authority';
+declare const badgeVariants: (props?: ({
+    variant?: "default" | "destructive" | "secondary" | "outline" | "ghost" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function Badge({ className, variant, asChild, ...props }: ComponentProps<'span'> & VariantProps<typeof badgeVariants> & {
+    asChild?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+export { Badge, badgeVariants };

package/dist/badge.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Slot } from 'radix-ui';
+import { cva } from 'class-variance-authority';
+import { cn } from './internal/cn.js';
+const badgeVariants = cva('inline-flex min-h-5 w-fit shrink-0 items-center justify-center gap-1 rounded-sm px-1.5 py-0.5 text-[0.6875rem] leading-none font-medium whitespace-nowrap [&_svg]:size-3 [&_svg]:shrink-0 focus-visible:outline-2 focus-visible:outline-solid focus-visible:outline-offset-2 focus-visible:outline-[var(--ink)]', {
+    variants: {
+        variant: {
+            default: 'bg-foreground/10 text-foreground',
+            secondary: 'bg-foreground/5 text-muted-foreground',
+            outline: 'border border-foreground/10 text-foreground',
+            ghost: 'text-muted-foreground',
+            destructive: 'bg-destructive/10 text-destructive',
+        },
+    },
+    defaultVariants: { variant: 'default' },
+});
+function Badge({ className, variant, asChild = false, ...props }) {
+    const Comp = asChild ? Slot.Root : 'span';
+    return (_jsx(Comp, { "data-slot": "badge", "data-variant": variant ?? 'default', className: cn(badgeVariants({ variant }), className), ...props }));
+}
+export { Badge, badgeVariants };

package/dist/button.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { type VariantProps } from 'class-variance-authority';
+declare const buttonVariants: (props?: ({
+    variant?: "default" | "secondary" | "ghost" | null | undefined;
+    size?: "default" | "sm" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function Button({ className, variant, size, type, ...props }: React.ComponentProps<'button'> & VariantProps<typeof buttonVariants>): import("react/jsx-runtime").JSX.Element;
+export { Button, buttonVariants };

package/dist/button.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cva } from 'class-variance-authority';
+import { cn } from './internal/cn.js';
+const buttonVariants = cva("no-underline hover:no-underline inline-flex items-center justify-center gap-1 rounded-sm text-xs leading-none whitespace-nowrap transition-colors active:opacity-100 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-3.5 focus-visible:outline-2 focus-visible:outline-solid focus-visible:outline-offset-2 focus-visible:outline-[var(--ink)] disabled:pointer-events-none disabled:opacity-50", {
+    variants: {
+        variant: {
+            default: 'bg-[color-mix(in_oklab,var(--ink)_14%,transparent)] font-medium text-[var(--ink)] hover:bg-[color-mix(in_oklab,var(--ink)_18%,transparent)]',
+            secondary: 'bg-[color-mix(in_oklab,var(--ink)_8%,transparent)] text-muted-foreground hover:bg-[color-mix(in_oklab,var(--ink)_11%,transparent)] hover:text-foreground',
+            ghost: 'text-muted-foreground hover:bg-[color-mix(in_oklab,var(--ink)_8%,transparent)] hover:text-foreground',
+        },
+        size: {
+            default: 'h-8 px-3',
+            sm: 'h-7 px-2.5',
+        },
+    },
+    defaultVariants: {
+        variant: 'default',
+        size: 'default',
+    },
+});
+function Button({ className, variant, size, type = 'button', ...props }) {
+    return (_jsx("button", { type: type, "data-slot": "button", "data-variant": variant, "data-size": size, className: cn(buttonVariants({ variant, size, className })), ...props }));
+}
+export { Button, buttonVariants };

package/dist/checkbox.d.ts

@@ -0,0 +1,4 @@
+import type { ComponentProps } from 'react';
+import { Checkbox as CheckboxPrimitive } from 'radix-ui';
+declare function Checkbox({ className, ...props }: ComponentProps<typeof CheckboxPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+export { Checkbox };

package/dist/checkbox.js

@@ -0,0 +1,9 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Checkbox as CheckboxPrimitive } from 'radix-ui';
+import { Check, Minus } from 'lucide-react';
+import { cn } from './internal/cn.js';
+function Checkbox({ className, ...props }) {
+    return (_jsx(CheckboxPrimitive.Root, { "data-slot": "checkbox", className: cn("peer border-foreground/50 text-background aria-invalid:border-destructive aria-invalid:data-[state=checked]:border-destructive aria-invalid:data-[state=indeterminate]:border-destructive data-[state=checked]:border-foreground data-[state=checked]:bg-foreground data-[state=indeterminate]:border-foreground data-[state=indeterminate]:bg-foreground relative grid size-4 shrink-0 place-items-center rounded-sm border bg-[var(--paper)] shadow-xs transition-colors outline-none before:absolute before:-inset-1 before:content-[''] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ink)] focus-visible:outline-solid disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:focus-visible:outline-[var(--destructive)] motion-reduce:transition-none", className), ...props, children: _jsxs(CheckboxPrimitive.Indicator, { "data-slot": "checkbox-indicator", className: "group/indicator grid place-items-center", children: [_jsx(Check, { "aria-hidden": "true", className: "size-3 group-data-[state=indeterminate]/indicator:hidden" }), _jsx(Minus, { "aria-hidden": "true", className: "size-3 group-data-[state=checked]/indicator:hidden" })] }) }));
+}
+export { Checkbox };

package/dist/command-menu.d.ts

@@ -0,0 +1,28 @@
+import { type ComponentProps, type ReactNode } from 'react';
+import { DropdownMenu, ContextMenu } from 'radix-ui';
+type Mode = 'dropdown' | 'context';
+/** One style/selection contract, two native Radix interaction models. */
+export declare function CommandMenuRoot({ mode, children, }: {
+    mode?: Mode;
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function CommandMenuTrigger(props: ComponentProps<typeof DropdownMenu.Trigger>): import("react/jsx-runtime").JSX.Element;
+export declare function CommandMenuContent({ className, children, ...props }: ComponentProps<typeof ContextMenu.Content>): import("react/jsx-runtime").JSX.Element;
+export declare function CommandMenuItem({ className, inset, variant, ...props }: ComponentProps<typeof DropdownMenu.Item> & {
+    inset?: boolean;
+    variant?: 'default' | 'destructive';
+}): import("react/jsx-runtime").JSX.Element;
+export declare function CommandMenuCheckboxItem({ className, children, ...props }: ComponentProps<typeof DropdownMenu.CheckboxItem>): import("react/jsx-runtime").JSX.Element;
+export declare function CommandMenuRadioItem({ className, children, ...props }: ComponentProps<typeof DropdownMenu.RadioItem>): import("react/jsx-runtime").JSX.Element;
+export declare function CommandMenuRadioGroup(props: ComponentProps<typeof DropdownMenu.RadioGroup>): import("react/jsx-runtime").JSX.Element;
+export declare function CommandMenuGroup(props: ComponentProps<typeof DropdownMenu.Group>): import("react/jsx-runtime").JSX.Element;
+export declare function CommandMenuLabel({ className, inset, ...props }: ComponentProps<typeof DropdownMenu.Label> & {
+    inset?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function CommandMenuSeparator({ className, ...props }: ComponentProps<typeof DropdownMenu.Separator>): import("react/jsx-runtime").JSX.Element;
+export declare function CommandMenuSub(props: ComponentProps<typeof DropdownMenu.Sub>): import("react/jsx-runtime").JSX.Element;
+export declare function CommandMenuSubTrigger({ children, className, inset, ...props }: ComponentProps<typeof DropdownMenu.SubTrigger> & {
+    inset?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function CommandMenuSubContent({ className, ...props }: ComponentProps<typeof DropdownMenu.SubContent>): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/command-menu.js

@@ -0,0 +1,69 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { createContext, useContext, } from 'react';
+import { DropdownMenu, ContextMenu } from 'radix-ui';
+import { Check, ChevronRight } from 'lucide-react';
+import { cn } from './internal/cn.js';
+import { menuItemClassName, menuContentClassName, } from './internal/menu-styles.js';
+const ModeContext = createContext('dropdown');
+const useParts = () => useContext(ModeContext) === 'context' ? ContextMenu : DropdownMenu;
+/** One style/selection contract, two native Radix interaction models. */
+export function CommandMenuRoot({ mode = 'dropdown', children, }) {
+    const Root = mode === 'context' ? ContextMenu.Root : DropdownMenu.Root;
+    return (_jsx(ModeContext.Provider, { value: mode, children: _jsx(Root, { children: children }) }));
+}
+export function CommandMenuTrigger(props) {
+    const P = useParts();
+    return _jsx(P.Trigger, { "data-slot": "command-menu-trigger", ...props });
+}
+export function CommandMenuContent({ className, children, ...props }) {
+    const mode = useContext(ModeContext);
+    const P = useParts();
+    const contentClass = cn(menuContentClassName, mode === 'context'
+        ? 'max-h-(--radix-context-menu-content-available-height)'
+        : 'max-h-(--radix-dropdown-menu-content-available-height)', className);
+    return (_jsx(P.Portal, { children: mode === 'dropdown' ? (_jsx(DropdownMenu.Content, { "data-slot": "dropdown-menu-content", align: "end", sideOffset: 4, collisionPadding: 16, className: contentClass, ...props, children: children })) : (_jsx(ContextMenu.Content, { "data-slot": "context-menu-content", collisionPadding: 16, className: contentClass, ...props, children: children })) }));
+}
+export function CommandMenuItem({ className, inset = false, variant = 'default', ...props }) {
+    const P = useParts();
+    return (_jsx(P.Item, { "data-slot": "command-menu-item", className: cn(menuItemClassName, inset && 'pl-7', variant === 'destructive' && 'text-destructive', className), ...props }));
+}
+export function CommandMenuCheckboxItem({ className, children, ...props }) {
+    const P = useParts();
+    return (_jsxs(P.CheckboxItem, { "data-slot": "command-menu-checkbox-item", className: cn(menuItemClassName, 'pl-7', className), ...props, children: [_jsx("span", { className: "absolute left-2 grid size-3.5 place-items-center", children: _jsx(P.ItemIndicator, { children: _jsx(Check, { "aria-hidden": "true", className: "size-3" }) }) }), children] }));
+}
+export function CommandMenuRadioItem({ className, children, ...props }) {
+    const P = useParts();
+    return (_jsxs(P.RadioItem, { "data-slot": "command-menu-radio-item", className: cn(menuItemClassName, 'pl-7', className), ...props, children: [_jsx("span", { className: "absolute left-2 grid size-3.5 place-items-center", children: _jsx(P.ItemIndicator, { children: _jsx(Check, { "aria-hidden": "true", className: "size-3" }) }) }), children] }));
+}
+export function CommandMenuRadioGroup(props) {
+    const P = useParts();
+    return _jsx(P.RadioGroup, { ...props });
+}
+export function CommandMenuGroup(props) {
+    const P = useParts();
+    return _jsx(P.Group, { ...props });
+}
+export function CommandMenuLabel({ className, inset, ...props }) {
+    const P = useParts();
+    return (_jsx(P.Label, { "data-slot": "command-menu-label", className: cn('text-muted-foreground px-2 py-1 text-xs', inset && 'pl-7', className), ...props }));
+}
+export function CommandMenuSeparator({ className, ...props }) {
+    const P = useParts();
+    return (_jsx(P.Separator, { "data-slot": "command-menu-separator", className: cn('bg-foreground/[0.06] mx-1 my-1 h-px', className), ...props }));
+}
+export function CommandMenuSub(props) {
+    const P = useParts();
+    return _jsx(P.Sub, { ...props });
+}
+export function CommandMenuSubTrigger({ children, className, inset, ...props }) {
+    const P = useParts();
+    return (_jsxs(P.SubTrigger, { "data-slot": "command-menu-sub-trigger", className: cn(menuItemClassName, 'data-[state=open]:bg-foreground/[0.08]', inset && 'pl-7', className), ...props, children: [children, _jsx(ChevronRight, { "aria-hidden": "true", className: "ml-auto size-3 shrink-0" })] }));
+}
+export function CommandMenuSubContent({ className, ...props }) {
+    const mode = useContext(ModeContext);
+    const P = useParts();
+    return (_jsx(P.Portal, { children: _jsx(P.SubContent, { "data-slot": "command-menu-sub-content", collisionPadding: 16, sideOffset: 4, className: cn(menuContentClassName, mode === 'context'
+                ? 'max-h-(--radix-context-menu-content-available-height)'
+                : 'max-h-(--radix-dropdown-menu-content-available-height)', className), ...props }) }));
+}

package/dist/dialog.d.ts

@@ -0,0 +1,16 @@
+import type { ComponentProps } from 'react';
+import { Dialog as DialogPrimitive } from 'radix-ui';
+declare const Dialog: import("react").FC<DialogPrimitive.DialogProps>;
+declare const DialogTrigger: import("react").ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
+declare const DialogClose: import("react").ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
+declare const DialogPortal: import("react").FC<DialogPrimitive.DialogPortalProps>;
+declare function DialogOverlay({ className, ...props }: ComponentProps<typeof DialogPrimitive.Overlay>): import("react/jsx-runtime").JSX.Element;
+declare function DialogContent({ className, children, showCloseButton, closeLabel, ...props }: ComponentProps<typeof DialogPrimitive.Content> & {
+    showCloseButton?: boolean;
+    closeLabel?: string;
+}): import("react/jsx-runtime").JSX.Element;
+declare function DialogHeader({ className, ...props }: ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function DialogFooter({ className, ...props }: ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function DialogTitle({ className, ...props }: ComponentProps<typeof DialogPrimitive.Title>): import("react/jsx-runtime").JSX.Element;
+declare function DialogDescription({ className, ...props }: ComponentProps<typeof DialogPrimitive.Description>): import("react/jsx-runtime").JSX.Element;
+export { Dialog, DialogTrigger, DialogClose, DialogPortal, DialogOverlay, DialogContent, DialogHeader, DialogFooter, DialogTitle, DialogDescription, };

package/dist/dialog.js

@@ -0,0 +1,28 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Dialog as DialogPrimitive } from 'radix-ui';
+import { X } from 'lucide-react';
+import { cn } from './internal/cn.js';
+const Dialog = DialogPrimitive.Root;
+const DialogTrigger = DialogPrimitive.Trigger;
+const DialogClose = DialogPrimitive.Close;
+const DialogPortal = DialogPrimitive.Portal;
+function DialogOverlay({ className, ...props }) {
+    return (_jsx(DialogPrimitive.Overlay, { "data-slot": "dialog-overlay", className: cn('motion-fade fixed inset-0 z-50 bg-black/40', className), ...props }));
+}
+function DialogContent({ className, children, showCloseButton = true, closeLabel = '닫기', ...props }) {
+    return (_jsxs(DialogPortal, { children: [_jsx(DialogOverlay, {}), _jsxs(DialogPrimitive.Content, { "data-slot": "dialog-content", className: cn('motion-modal border-foreground/10 fixed top-1/2 left-1/2 z-50 grid max-h-[calc(100dvh-2rem)] w-[calc(100%-2rem)] max-w-md -translate-x-1/2 -translate-y-1/2 gap-4 overflow-y-auto rounded-lg border bg-[var(--ui-surface,var(--paper))] p-5 text-xs [overflow-wrap:anywhere] shadow-xl outline-none', className), ...props, children: [children, showCloseButton && (_jsx(DialogPrimitive.Close, { "data-slot": "dialog-close", type: "button", "aria-label": closeLabel, className: "text-muted-foreground hover:bg-foreground/5 hover:text-foreground absolute top-3 right-3 grid size-7 place-items-center rounded-sm hover:no-underline focus-visible:outline-2 focus-visible:outline-offset-[-2px] focus-visible:outline-[var(--ink)] focus-visible:outline-solid", children: _jsx(X, { "aria-hidden": "true", className: "size-3.5" }) }))] })] }));
+}
+function DialogHeader({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "dialog-header", className: cn('grid gap-1.5 pr-6', className), ...props }));
+}
+function DialogFooter({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "dialog-footer", className: cn('flex flex-wrap justify-end gap-2', className), ...props }));
+}
+function DialogTitle({ className, ...props }) {
+    return (_jsx(DialogPrimitive.Title, { "data-slot": "dialog-title", className: cn('text-sm font-semibold', className), ...props }));
+}
+function DialogDescription({ className, ...props }) {
+    return (_jsx(DialogPrimitive.Description, { "data-slot": "dialog-description", className: cn('text-muted-foreground leading-relaxed', className), ...props }));
+}
+export { Dialog, DialogTrigger, DialogClose, DialogPortal, DialogOverlay, DialogContent, DialogHeader, DialogFooter, DialogTitle, DialogDescription, };

package/dist/field.d.ts

@@ -0,0 +1,24 @@
+import { type VariantProps } from 'class-variance-authority';
+import { Label } from './internal/label.js';
+declare function FieldSet({ className, ...props }: React.ComponentProps<'fieldset'>): import("react/jsx-runtime").JSX.Element;
+declare function FieldLegend({ className, variant, ...props }: React.ComponentProps<'legend'> & {
+    variant?: 'legend' | 'label';
+}): import("react/jsx-runtime").JSX.Element;
+declare function FieldGroup({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare const fieldVariants: (props?: ({
+    orientation?: "horizontal" | "vertical" | "responsive" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function Field({ className, orientation, ...props }: React.ComponentProps<'div'> & VariantProps<typeof fieldVariants>): import("react/jsx-runtime").JSX.Element;
+declare function FieldContent({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function FieldLabel({ className, ...props }: React.ComponentProps<typeof Label>): import("react/jsx-runtime").JSX.Element;
+declare function FieldTitle({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function FieldDescription({ className, ...props }: React.ComponentProps<'p'>): import("react/jsx-runtime").JSX.Element;
+declare function FieldSeparator({ children, className, ...props }: React.ComponentProps<'div'> & {
+    children?: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+declare function FieldError({ className, children, errors, ...props }: React.ComponentProps<'div'> & {
+    errors?: Array<{
+        message?: string;
+    } | undefined>;
+}): import("react/jsx-runtime").JSX.Element | null;
+export { Field, FieldLabel, FieldDescription, FieldError, FieldGroup, FieldLegend, FieldSeparator, FieldSet, FieldContent, FieldTitle, };