@olundot/ui 0.14.0 → 0.15.0

package/CHANGELOG.md

@@ -1,5 +1,32 @@
 # @olundot/ui
 
+## 0.15.0
+
+### Minor Changes
+
+- 7ea00f3: bg 재설계 Step 0 — 오버레이 surface 통일 · checkbox/radio option row 신모델 · EmptyState frameless 기본(PR #64) · 상태 토큰 위생(PR #63).
+- dcb5f68: bg 재설계 Step 0 — 값 변경 전 선행 정리 (PR #64)
+
+  - **오버레이 surface 통일**: dialog · sheet · select · popover · dropdown-menu · toast · confirm/form/info-modal이 제각기 쓰던 `--bg-base` / `--bg-raised` / `bg-background` / `bg-canvas`를 패널 층 `--bg-surface` 하나로 모았다. Tailwind 브리지(`popover` / `--color-popover`)도 같은 층을 가리킨다. `--bg-raised`는 값 변경 없이 남아 elevated card · 표 헤더 등 보조 강조 면을 계속 담당한다.
+  - **scrim/shadow 토큰화**: dialog · sheet의 하드코딩 backdrop(`--bg-base/65`, `bg-black/50`)을 `--scrim`으로, `shadow-lg`/`shadow-md`를 `shadow-[var(--shadow-4)]`로 교체했다.
+  - **checkbox/radio option row 신모델**: 카드형 option row가 `--bg-surface` 위에 얹히고, hover는 배경만 바꾼다(`border-strong`은 checked 전용 신호로 보존).
+  - **EmptyState frameless 기본**: `bordered` 기본값이 `true` → `false`로 뒤집혔다. 독립 패널로 세우려면 `bordered`를 명시한다. 아이콘 웰은 `--bg-raised` → `--bg-inset`.
+  - **popover arrow 가시성**: light에서 near-white on near-white로 사라지던 arrow에 `--border` stroke + `vector-effect: non-scaling-stroke`를 추가했다.
+
+  **Breaking**: `EmptyState`의 `bordered` 기본값이 `false`다. 테두리·배경이 있는 기존 렌더를 유지하려면 `bordered`를 명시적으로 넘겨야 한다.
+
+### Patch Changes
+
+- Updated dependencies [7ea00f3]
+- Updated dependencies [dcb5f68]
+  - @olundot/tokens@0.15.0
+
+## 0.14.1
+
+### Patch Changes
+
+- Republish of 0.14.0: the 0.14.0 tarball was published with `npm publish`, which leaked the raw `"@olundot/tokens": "workspace:^"` protocol into the published `dependencies`, making the package uninstallable outside this workspace. No code changes — publish with `pnpm publish` so the workspace protocol resolves to a real version range. Do not use 0.14.0.
+
 ## 0.14.0
 
 ### Minor Changes

package/README.md

@@ -1,24 +1,29 @@
 # @olundot/ui
 
-Shared OLUN React UI components.
+OLUN 토큰을 사용하는 React UI 컴포넌트 패키지입니다. 현재 버전은 `0.15.0`입니다.
+
+## 설치
 
 ```bash
-pnpm add @olundot/ui @olundot/tokens
+pnpm add @olundot/ui
 ```
 
+React와 React DOM 18 이상이 peer dependency입니다. Tailwind CSS 4 이상은 optional peer dependency입니다.
+
+## Tailwind v4 설정
+
 ```css
 @layer theme, base, components, utilities;
 @import "tailwindcss/theme.css" layer(theme);
 @import "tailwindcss/preflight.css" layer(base);
 @import "tailwindcss/utilities.css" layer(utilities);
 
-/* 컴포넌트 utility 생성을 위해 ui dist 스캔 — 빠지면 컴포넌트가 무스타일.
-   경로는 프로젝트 node_modules 위치에 맞게 조정. */
 @source "../node_modules/@olundot/ui/dist";
-
 @import "@olundot/ui/tokens.css";
 ```
 
+`@source` 경로는 소비자 프로젝트의 CSS 파일과 `node_modules` 위치에 맞게 조정합니다. `@olundot/ui/tokens.css`는 core tokens, Tailwind v4 매핑과 UI keyframes를 불러옵니다.
+
 ```tsx
 import { Button, Card, Input } from "@olundot/ui";
 
@@ -32,8 +37,48 @@ export function Example() {
 }
 ```
 
-This beta package is extracted from the OLUN CBT/LMS shared UI implementation. API names are usable, but still considered beta until the consumer integration cycle is complete.
+## 0.15.0 표면 계약
+
+Dialog, Sheet, Popover, DropdownMenu, Select와 Toast의 비-error variant는 panel에 `--bg-surface`를 사용합니다. Toast error variant만 `--error-bg`를 사용하며, `--bg-raised`와 `--bg-overlay`는 overlay panel 용도로 사용하지 않습니다. Dialog와 Sheet backdrop은 `--scrim`을 사용하며, Dialog panel은 `--shadow-8`, Sheet panel은 `--shadow-4`를 사용합니다.
+
+Checkbox/Radio의 card option row는 다음 상태를 사용합니다.
+
+| 상태 | fill과 border |
+|---|---|
+| unchecked | 별도 상태 fill 없음; `--bg-surface` + `--border-subtle` |
+| hover | `--action-hover`; border는 그대로 유지 |
+| checked | `--action-selected` + `--border-strong` |
+| disabled | `--action-disabled-bg` + `--border-subtle` |
+
+## Breaking: EmptyState
+
+`EmptyState`의 `bordered` 기본값은 `false`입니다. 기본 렌더에는 frame과 자체 surface가 없습니다.
+
+```tsx
+// 0.14.x와 같은 framed surface가 필요한 경우
+<EmptyState bordered title="결과가 없습니다" />
+```
+
+아이콘 well은 `--bg-inset`을 사용합니다.
+
+## FileUploadZone 상태
+
+| 상태 | surface와 border |
+|---|---|
+| default | `--bg-surface` + dashed `--border` |
+| hover | `--action-hover` + `--border-strong` |
+| dragging | `--action-active` + `--border-strong` |
+| has-file | `--bg-inset` + solid `--border-strong` |
+| disabled | `--action-disabled-bg` + dashed `--border-subtle` |
+
+Disabled는 has-file과 dragging 상태보다 우선합니다. Error가 함께 있으면 enabled 상태에서 `--error` border를 사용합니다.
+
+## Accent 계약
+
+Primary/default button은 `--primary`와 `--primary-fg`를 사용합니다. Brand와 opt-in accent fill은 `--accent-pop`과 `--accent-on-fill`을 사용합니다. Deprecated alias인 `--accent-solid`, `--accent-on-solid`은 신규 컴포넌트 소스에서 사용하지 않습니다.
+
+전체 변경은 [CHANGELOG](https://github.com/olundot/olun-design-system/blob/main/packages/ui/CHANGELOG.md)에 있습니다.
 
-## Accent Contract
+## 라이선스
 
-Primary and default buttons are monochrome: pair `--primary` for the background and border with `--primary-fg` for text and icons. Brand and opt-in accent fills use the canonical `--accent-pop` + `--accent-on-fill` pair. The pre-v0.14 names `--accent-solid` and `--accent-on-solid` remain deprecated compatibility aliases and must not be used in new component source.
+MIT

package/dist/index.js

@@ -595,12 +595,15 @@ var fileUploadZoneVariants = cva3(
     "group/file-upload relative flex w-full cursor-pointer flex-col items-center justify-center text-center",
     "border-2 border-dashed border-[var(--border)]",
     "transition-[background-color,border-color,color,box-shadow] motion-reduce:transition-none",
-    "hover:border-[var(--border-strong)] hover:bg-[var(--action-selected)]",
-    "focus-within:border-[var(--focus-ring)] focus-within:bg-[var(--action-selected)] focus-within:shadow-[0_0_0_1px_var(--focus-ring)]",
-    "data-[has-file=true]:border-[var(--border-strong)] data-[has-file=true]:bg-[var(--action-selected)]",
-    "data-[dragging=true]:border-[var(--border-strong)] data-[dragging=true]:bg-[var(--action-selected)]",
+    "hover:border-[var(--border-strong)] hover:bg-[var(--action-hover)]",
+    "focus-within:border-[var(--focus-ring)] focus-within:shadow-[0_0_0_1px_var(--focus-ring)]",
+    "data-[has-file=true]:border-solid data-[has-file=true]:border-[var(--border-strong)] data-[has-file=true]:bg-[var(--bg-inset)]",
+    "data-[dragging=true]:border-[var(--border-strong)] data-[dragging=true]:bg-[var(--action-active)]",
     "data-[error=true]:border-[var(--error)]",
-    "data-[disabled=true]:cursor-not-allowed data-[disabled=true]:border-[var(--border-subtle)] data-[disabled=true]:bg-[var(--bg-raised)]",
+    "data-[disabled=true]:cursor-not-allowed data-[disabled=true]:border-[var(--border-subtle)] data-[disabled=true]:bg-[var(--action-disabled-bg)]",
+    "data-[error=true]:data-[has-file=true]:border-[var(--error)] data-[error=true]:data-[dragging=true]:border-[var(--error)]",
+    "data-[disabled=true]:data-[has-file=true]:border-dashed data-[disabled=true]:data-[has-file=true]:border-[var(--border-subtle)] data-[disabled=true]:data-[has-file=true]:bg-[var(--action-disabled-bg)]",
+    "data-[disabled=true]:data-[dragging=true]:border-[var(--border-subtle)] data-[disabled=true]:data-[dragging=true]:bg-[var(--action-disabled-bg)]",
     "data-[disabled=true]:text-text-disabled"
   ].join(" "),
   {
@@ -620,7 +623,7 @@ var fileUploadZoneVariants = cva3(
 var fileUploadIconVariants = cva3(
   [
     "inline-flex items-center justify-center rounded-[var(--radius-full)]",
-    "border border-[var(--border)] bg-[var(--bg-raised)] text-text-secondary",
+    "border border-[var(--border)] bg-[var(--bg-inset)] text-text-secondary",
     "transition-[border-color,color,background-color] motion-reduce:transition-none",
     "group-hover/file-upload:border-[var(--border-strong)] group-hover/file-upload:text-foreground",
     "group-data-[has-file=true]/file-upload:border-[var(--border-strong)] group-data-[has-file=true]/file-upload:text-foreground",
@@ -1528,13 +1531,13 @@ var Select = React7.forwardRef(
         "data-slot": "select-content",
         position: "popper",
         sideOffset: 4,
-        className: "z-[var(--z-popover)] max-h-[var(--radix-select-content-available-height)] min-w-[var(--radix-select-trigger-width)] overflow-hidden rounded-[var(--radius-md)] border border-[var(--border)] bg-[var(--bg-raised)] text-foreground shadow-md",
+        className: "z-[var(--z-popover)] max-h-[var(--radix-select-content-available-height)] min-w-[var(--radix-select-trigger-width)] overflow-hidden rounded-[var(--radius-md)] border border-[var(--border)] bg-[var(--bg-surface)] text-foreground shadow-[var(--shadow-4)]",
         children: [
           /* @__PURE__ */ jsx7(
             SelectPrimitive.ScrollUpButton,
             {
               "data-slot": "select-scroll-up",
-              className: "flex items-center justify-center border-b border-[var(--border)] bg-[var(--bg-raised)] py-[var(--space-1)] text-text-tertiary",
+              className: "flex items-center justify-center border-b border-[var(--border)] bg-[var(--bg-surface)] py-[var(--space-1)] text-text-tertiary",
               children: /* @__PURE__ */ jsx7(ChevronUp, { "aria-hidden": "true", className: "size-[16px]" })
             }
           ),
@@ -1558,7 +1561,7 @@ var Select = React7.forwardRef(
             SelectPrimitive.ScrollDownButton,
             {
               "data-slot": "select-scroll-down",
-              className: "flex items-center justify-center border-t border-[var(--border)] bg-[var(--bg-raised)] py-[var(--space-1)] text-text-tertiary",
+              className: "flex items-center justify-center border-t border-[var(--border)] bg-[var(--bg-surface)] py-[var(--space-1)] text-text-tertiary",
               children: /* @__PURE__ */ jsx7(ChevronDown, { "aria-hidden": "true", className: "size-[16px]" })
             }
           )
@@ -3434,7 +3437,7 @@ var DialogOverlay = React20.forwardRef(({ className, ...props }, ref) => /* @__P
     className: cn(
       "fixed inset-0 z-[var(--z-modal)]",
       // 2026: 글래스모피즘 블러 제거 — 단정한 scrim 딤만(FE-skill anti-slop).
-      "bg-[var(--bg-base)]/65",
+      "bg-[var(--scrim)]",
       "data-[state=open]:animate-in data-[state=closed]:animate-out",
       "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
       "motion-reduce:animate-none",
@@ -3454,9 +3457,10 @@ var DialogContent = React20.forwardRef(({ className, children, showCloseButton =
         "fixed left-1/2 top-1/2 z-[var(--z-modal)]",
         "-translate-x-1/2 -translate-y-1/2",
         "grid w-full max-w-lg gap-4 p-[var(--space-8)]",
-        // modal은 dim overlay 위 — 가장 밝은 DS surface(--bg-base #F1F3F5·여전히 tinted·순백 아님)로 깨끗하게.
+        // modal은 dim overlay 위 — panel surface 토큰(--bg-surface)으로 깨끗하게.
+        // (page 배경 --bg-base가 아니라 카드/섹션과 같은 surface 층을 쓴다.)
         // arbitrary var 사용: 소비 site/app이 dist를 content-scan 안 해 `bg-base` 유틸이 purge될 수 있어 안전하게 var로.
-        "bg-[var(--bg-base)] text-foreground",
+        "bg-[var(--bg-surface)] text-foreground",
         // 2026: generic 무거운 그림자 대신 floating shadow-8 + 또렷한 중립 grey border(--border·16%) + radius-lg.
         // (border-subtle=8%는 너무 흐려 가장자리가 안 보였음 → border-border로 grey 또렷하게.)
         "border border-border rounded-[var(--radius-lg)] shadow-8",
@@ -3567,8 +3571,8 @@ var formModalContentClassName = cn(
   "w-[calc(100vw-2rem)]",
   "max-w-[560px]",
   "gap-0 p-[var(--space-6)]",
-  "bg-[var(--bg-raised)]",
-  "border-[var(--border-subtle)]",
+  "bg-[var(--bg-surface)]",
+  "border-[var(--border)]",
   "rounded-[var(--radius-lg)]",
   "shadow-[var(--shadow-4)]",
   "text-foreground"
@@ -3680,8 +3684,8 @@ var infoModalContentClassName = cn(
   "w-[calc(100vw-2rem)]",
   "max-w-[420px]",
   "gap-0 p-[var(--space-6)]",
-  "bg-[var(--bg-raised)]",
-  "border border-[var(--border-subtle)]",
+  "bg-[var(--bg-surface)]",
+  "border border-[var(--border)]",
   "rounded-[var(--radius-lg)]",
   "shadow-[var(--shadow-4)]",
   "text-foreground"
@@ -3913,8 +3917,8 @@ var checkboxGroupItemVariants = cva9(
         plain: "inline-flex items-start gap-[var(--space-3)] rounded-[var(--radius-sm)] px-pad-compact-x py-pad-compact-y",
         card: [
           "flex min-h-[calc(var(--space-12)+var(--space-2))] items-start gap-[var(--space-3)]",
-          "rounded-[var(--radius-md)] border border-[var(--border-subtle)] bg-[var(--bg-base)]",
-          "hover:border-[var(--border-strong)] hover:bg-[var(--action-hover)]",
+          "rounded-[var(--radius-md)] border border-[var(--border-subtle)] bg-[var(--bg-surface)]",
+          "hover:bg-[var(--action-hover)]",
           "data-[state=checked]:border-[var(--border-strong)] data-[state=checked]:bg-[var(--action-selected)]",
           "disabled:border-[var(--border-subtle)] disabled:bg-[var(--action-disabled-bg)]",
           "disabled:data-[state=checked]:border-[var(--border-subtle)] disabled:data-[state=checked]:bg-[var(--action-disabled-bg)]"
@@ -4798,7 +4802,7 @@ function DropdownMenuContent({
       className: cn(
         "z-[var(--z-popover)] max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem]",
         "origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto",
-        "rounded-sm border border-[var(--border)] bg-canvas p-[var(--space-1)] text-text-primary shadow-2",
+        "rounded-sm border border-[var(--border)] bg-[var(--bg-surface)] p-[var(--space-1)] text-text-primary shadow-2",
         "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2",
         "data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
         "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
@@ -4997,7 +5001,7 @@ function DropdownMenuSubContent({
       "data-slot": "dropdown-menu-sub-content",
       className: cn(
         "z-[var(--z-popover)] min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden",
-        "rounded-sm border border-[var(--border)] bg-canvas p-[var(--space-1)] text-text-primary shadow-2",
+        "rounded-sm border border-[var(--border)] bg-[var(--bg-surface)] p-[var(--space-1)] text-text-primary shadow-2",
         "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2",
         "data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
         "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
@@ -5223,7 +5227,7 @@ var confirmDialogContentClassName = cn(
   "-translate-x-1/2 -translate-y-1/2",
   "w-[calc(100vw-2rem)] max-w-[420px]",
   "flex flex-col gap-[var(--space-6)]",
-  "bg-[var(--bg-raised)] border border-[var(--border-subtle)]",
+  "bg-[var(--bg-surface)] border border-[var(--border)]",
   "rounded-[var(--radius-lg)] p-[var(--space-6)] shadow-[var(--shadow-4)]",
   "text-foreground"
 );
@@ -5477,7 +5481,7 @@ function SheetOverlay({
     {
       "data-slot": "sheet-overlay",
       className: cn(
-        "fixed inset-0 z-[var(--z-overlay)] bg-black/50",
+        "fixed inset-0 z-[var(--z-overlay)] bg-[var(--scrim)]",
         motionConfig && cn(
           "transition-opacity motion-reduce:transition-none",
           "duration-[var(--sheet-motion-duration)]",
@@ -5512,7 +5516,7 @@ function SheetContent({
       {
         "data-slot": "sheet-content",
         className: cn(
-          "fixed z-[var(--z-modal)] flex flex-col gap-4 border-[var(--border)] bg-background shadow-lg",
+          "fixed z-[var(--z-modal)] flex flex-col gap-4 border-[var(--border)] bg-[var(--bg-surface)] shadow-[var(--shadow-4)]",
           motionConfig && cn(
             "motion-reduce:animate-none",
             motionConfig.type === "fade" && "data-[state=open]:animate-[olun-sheet-fade-in_var(--sheet-motion-duration)_var(--sheet-motion-easing)_both] data-[state=closed]:animate-[olun-sheet-fade-out_var(--sheet-motion-duration)_var(--sheet-motion-easing)_both]"
@@ -5789,6 +5793,7 @@ import { jsx as jsx35, jsxs as jsxs32 } from "react/jsx-runtime";
 function Popover({ modal = false, ...props }) {
   return /* @__PURE__ */ jsx35(PopoverPrimitive.Root, { modal, ...props });
 }
+var popoverArrowClassName = "fill-[var(--bg-surface)] stroke-[var(--border)] [&>polygon]:[vector-effect:non-scaling-stroke]";
 var PopoverTrigger = PopoverPrimitive.Trigger;
 var PopoverAnchor = PopoverPrimitive.Anchor;
 var PopoverClose = PopoverPrimitive.Close;
@@ -5803,7 +5808,7 @@ var PopoverContent = React26.forwardRef(({ className, align = "center", sideOffs
     className: cn(
       "z-[var(--z-popover)] w-[260px] outline-none",
       "rounded-[var(--radius-md)] border border-[var(--border)]",
-      "bg-[var(--bg-raised)] p-[var(--space-4)] text-foreground",
+      "bg-[var(--bg-surface)] p-[var(--space-4)] text-foreground",
       "shadow-[var(--shadow-4)]",
       "data-[state=open]:animate-in data-[state=closed]:animate-out",
       "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
@@ -5820,7 +5825,7 @@ var PopoverContent = React26.forwardRef(({ className, align = "center", sideOffs
         PopoverPrimitive.Arrow,
         {
           "data-slot": "popover-arrow",
-          className: "fill-[var(--bg-raised)]",
+          className: popoverArrowClassName,
           width: 11,
           height: 5
         }
@@ -5834,7 +5839,7 @@ var PopoverArrow = React26.forwardRef(({ className, ...props }, ref) => /* @__PU
   {
     ref,
     "data-slot": "popover-arrow",
-    className: cn("fill-[var(--bg-raised)]", className),
+    className: cn(popoverArrowClassName, className),
     width: 11,
     height: 5,
     ...props
@@ -6150,7 +6155,7 @@ var chipVariants = cva12(
       },
       tone: {
         neutral: "border-[var(--border-subtle)] bg-[var(--bg-surface)] text-text-secondary hover:bg-[var(--action-hover)]",
-        accent: "border-[var(--border-accent)] bg-transparent text-[var(--accent)] hover:bg-[var(--action-accent-hover)]",
+        accent: "border-[var(--border-accent)] bg-transparent text-[var(--accent)] hover:bg-[var(--accent-bg-strong)]",
         success: "border-transparent bg-[var(--success-bg)] text-[var(--success)] hover:bg-[var(--action-hover)]",
         warning: "border-transparent bg-[var(--warning-bg)] text-[var(--warning)] hover:bg-[var(--action-hover)]",
         danger: "border-transparent bg-[var(--error-bg)] text-[var(--error)] hover:bg-[var(--action-hover)]",
@@ -6338,7 +6343,7 @@ var emptyStateBaseVariants = cva13(
     },
     defaultVariants: {
       size: "md",
-      bordered: true
+      bordered: false
     }
   }
 );
@@ -6357,7 +6362,7 @@ function emptyStateVariants({
   size,
   tone = "neutral",
   surface,
-  bordered = true,
+  bordered = false,
   className
 } = {}) {
   const hasBorder = bordered !== false;
@@ -6370,7 +6375,7 @@ function emptyStateVariants({
 var emptyStateIconVariants = cva13(
   [
     "inline-flex items-center justify-center rounded-[var(--radius-full)]",
-    "border border-[var(--border-subtle)] bg-[var(--bg-raised)] text-text-tertiary"
+    "border border-[var(--border-subtle)] bg-[var(--bg-inset)] text-text-tertiary"
   ].join(" "),
   {
     variants: {
@@ -6401,7 +6406,7 @@ var EmptyState = React32.forwardRef(
     description,
     hint,
     action,
-    bordered = true,
+    bordered = false,
     ...props
   }, ref) => {
     const resolvedSize = size ?? "md";
@@ -7367,11 +7372,11 @@ var toastVariants = cva20(
   {
     variants: {
       variant: {
-        default: "bg-[var(--bg-raised)]",
-        success: "bg-[var(--bg-raised)]",
+        default: "bg-[var(--bg-surface)]",
+        success: "bg-[var(--bg-surface)]",
         error: "bg-[var(--error-bg)]",
-        warning: "bg-[var(--bg-raised)]",
-        info: "bg-[var(--bg-raised)]"
+        warning: "bg-[var(--bg-surface)]",
+        info: "bg-[var(--bg-surface)]"
       }
     },
     defaultVariants: { variant: "default" }
@@ -8269,8 +8274,8 @@ var radioVariants = cva24(
         plain: "inline-flex items-start gap-[var(--space-3)] rounded-[var(--radius-sm)] px-pad-compact-x py-pad-compact-y",
         card: [
           "flex min-h-[calc(var(--space-12)+var(--space-2))] items-start gap-[var(--space-3)]",
-          "rounded-[var(--radius-md)] border border-[var(--border-subtle)] bg-[var(--bg-base)]",
-          "hover:border-[var(--border-strong)] hover:bg-[var(--action-hover)]",
+          "rounded-[var(--radius-md)] border border-[var(--border-subtle)] bg-[var(--bg-surface)]",
+          "hover:bg-[var(--action-hover)]",
           "data-[state=checked]:border-[var(--border-strong)] data-[state=checked]:bg-[var(--action-selected)]",
           "disabled:border-[var(--border-subtle)] disabled:bg-[var(--action-disabled-bg)]",
           "disabled:data-[state=checked]:border-[var(--border-subtle)] disabled:data-[state=checked]:bg-[var(--action-disabled-bg)]"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@olundot/ui",
-  "version": "0.14.0",
+  "version": "0.15.0",
   "description": "OLUN. shared React UI components built on OLUN design tokens",
   "license": "MIT",
   "keywords": [
@@ -38,21 +38,13 @@
       "import": "./dist/tailwind.preset.js"
     }
   },
-  "scripts": {
-    "build": "tsup",
-    "lint": "node scripts/verify-source-imports.mjs",
-    "test": "sh -c 'set -e; if [ \"$#\" -gt 0 ]; then for test_file in \"$@\"; do node --import tsx \"$test_file\"; done; else for test_file in src/components/ui/*.test.tsx; do node --import tsx \"$test_file\"; done; fi' --",
-    "test:accent-contracts": "node scripts/verify-accent-contracts.mjs",
-    "type-check": "tsc --noEmit",
-    "prepublishOnly": "pnpm build && pnpm test && pnpm test:accent-contracts && pnpm type-check && pnpm lint"
-  },
   "dependencies": {
-    "@olundot/tokens": "workspace:^",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "lucide-react": "^1.8.0",
     "radix-ui": "^1.4.3",
-    "tailwind-merge": "^3.5.0"
+    "tailwind-merge": "^3.5.0",
+    "@olundot/tokens": "^0.15.0"
   },
   "peerDependencies": {
     "react": ">=18",
@@ -77,5 +69,12 @@
   },
   "publishConfig": {
     "access": "public"
+  },
+  "scripts": {
+    "build": "tsup",
+    "lint": "node scripts/verify-source-imports.mjs",
+    "test": "sh -c 'set -e; if [ \"$#\" -gt 0 ]; then for test_file in \"$@\"; do node --import tsx \"$test_file\"; done; else for test_file in src/components/ui/*.test.tsx; do node --import tsx \"$test_file\"; done; fi' --",
+    "test:accent-contracts": "node scripts/verify-accent-contracts.mjs",
+    "type-check": "tsc --noEmit"
   }
-}
+}