@godxjp/ui 6.12.0 → 7.0.0

package/dist/index.js

@@ -1,39 +1,40 @@
 export { FormFieldControl, FormRoot, useZodForm } from './chunk-7WRZG2IG.js';
 import './chunk-LDSLS6HE.js';
 export { DataState, InfiniteQueryState, MutationFeedback, PrefetchLink, QueryRefetchButton, flattenItemPages } from './chunk-2QG3OVAD.js';
-export { FilterBar, FilterGroup, PageHeader } from './chunk-T2S3IGZG.js';
-export { Pagination } from './chunk-JBEIL3VD.js';
+export { FilterBar, FilterGroup, PageHeader } from './chunk-6TSU4IHV.js';
+export { Pagination } from './chunk-FBHN6OO4.js';
 export { Steps } from './chunk-L6J44O74.js';
-export { TabsItems } from './chunk-BPSKQUL2.js';
-export { Tabs, TabsContent, TabsList, TabsTrigger } from './chunk-XG7XDYIM.js';
+export { Tabs, TabsContent, TabsList, TabsTrigger } from './chunk-V3N266PT.js';
 export { TreeSelect } from './chunk-JJCGMCTL.js';
-export { Upload, collectUploadCommitActions, createUploadItem, useUploadDraft } from './chunk-K27I23OA.js';
-import './chunk-EE3B3TEQ.js';
+export { Upload, collectUploadCommitActions, createUploadItem, useUploadDraft } from './chunk-NTUHJ37K.js';
+import './chunk-ARDVPIF4.js';
 import './chunk-CRERCLIZ.js';
-export { SearchInput, Transfer, useDebouncedValue, useTimeoutFlag } from './chunk-YVBZ37ZE.js';
+export { SearchInput, Transfer, useDebouncedValue, useTimeoutFlag } from './chunk-ZR2TIBPG.js';
 export { Cascader } from './chunk-RVY4F7LK.js';
 import './chunk-SMLKNECP.js';
 import './chunk-E76QIYSY.js';
 import './chunk-CQBADMFG.js';
-export { SkeletonCard, SkeletonDetail, SkeletonRows, SkeletonTable, toast, useToast } from './chunk-M64MVRLS.js';
-export { Alert, AlertActions, AlertContent, AlertDescription, AlertQueryError, AlertTitle } from './chunk-6UFKWOEW.js';
-export { formatBytes, formatCurrency, formatDateLong, formatDateTime, formatRelative, humanError, shortId } from './chunk-4R7QL3MW.js';
-export { Dialog, DialogConfirm, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from './chunk-2HLWHQJA.js';
+export { toast, useToast } from './chunk-B3WX53JQ.js';
+export { SkeletonCard, SkeletonDetail, SkeletonRows, SkeletonTable } from './chunk-HKQITNB3.js';
 export { Toaster } from './chunk-TO7URV7U.js';
-export { PageContainer, Stack } from './chunk-T4UT3B3K.js';
+export { PageContainer, Stack } from './chunk-EQRQM6RF.js';
+import './chunk-FRU44GA2.js';
 import './chunk-TO33OY4L.js';
 import './chunk-32WO3YLB.js';
-import './chunk-Y7AV7QJO.js';
+import './chunk-OXKY5QMK.js';
 import './chunk-V6UWJKZF.js';
-import './chunk-VOHTRR5X.js';
-export { DataTable, EmptyState, KeyValueGrid, StatusBadge } from './chunk-TW4IRRAX.js';
+export { DataTable, Descriptions, EmptyState } from './chunk-VXXKR5U4.js';
 import './chunk-DV52WNXO.js';
-export { Inline } from './chunk-S66TJXJU.js';
-import './chunk-PIIRNAXA.js';
+export { Badge } from './chunk-7AMHT5Z5.js';
 import './chunk-DY5C44UP.js';
 import './chunk-3KPEZ5CF.js';
 import './chunk-ZS6DTAM2.js';
 import './chunk-ICM6XBST.js';
+export { Alert, AlertActions, AlertContent, AlertDescription, AlertQueryError, AlertTitle } from './chunk-6UFKWOEW.js';
+export { formatBytes, formatCurrency, formatDateLong, formatDateTime, formatRelative, humanError, shortId } from './chunk-4R7QL3MW.js';
+export { Inline } from './chunk-S66TJXJU.js';
+export { Dialog, DialogConfirm, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from './chunk-2HLWHQJA.js';
+import './chunk-VOHTRR5X.js';
 import './chunk-HJEBRCXL.js';
 export { FormField } from './chunk-F7PG4OEV.js';
 import './chunk-7PWBC4BY.js';

package/dist/{navigation.prop-Ck5_gSfs.d.ts → navigation.prop-DAH4ysXj.d.ts}

@@ -57,15 +57,14 @@ type StepsProp = {
 };
 /** Tab pane — Ant Design `items` entry. */
 type TabItemProp = {
-    key: string;
+    value: string;
     label: React.ReactNode;
-    children: React.ReactNode;
+    content: React.ReactNode;
     disabled?: boolean;
-    icon?: React.ReactNode;
 };
-/** @see TabsItems — high-level tabs with `items` array. */
-type TabsItemsProp = {
-    items: TabItemProp[];
+/** @see Tabs — high-level tabs with optional `items` array. */
+type TabsProp = {
+    items?: TabItemProp[];
     value?: string;
     defaultValue?: string;
     onValueChange?: (key: string) => void;
@@ -75,4 +74,4 @@ type TabsItemsProp = {
     contentClassName?: ClassNameProp;
 };
 
-export type { FilterBarProp as F, PaginationProp as P, StepItemProp as S, TabItemProp as T, FilterGroupProp as a, StepStatusProp as b, StepsProp as c, TabsItemsProp as d };
+export type { FilterBarProp as F, PaginationProp as P, StepItemProp as S, TabItemProp as T, FilterGroupProp as a, StepStatusProp as b, StepsProp as c, TabsProp as d };

package/dist/props/components/index.d.ts

@@ -1,10 +1,10 @@
 export { A as AppShellProp, I as InlineProp, P as PageContainerProp, a as PageHeaderProp, b as PageInsetProp, S as SidebarItemProp, c as SidebarProductProp, d as SidebarProp, e as SidebarSectionProp, f as StackProp, T as TopbarProductProp, g as TopbarProjectProp, h as TopbarProp } from '../../layout.prop-MwHm4-Zl.js';
 export { B as ButtonProp } from '../../general.prop-D7brMPNL.js';
-export { A as AutocompleteOptionProp, a as AutocompleteProp, C as CalendarProp, b as CascaderProp, c as CheckboxGroupProp, d as CheckboxProp, e as ChoiceOptionProp, f as ColorPickerProp, D as DatePickerProp, j as DateRangePickerProp, F as FormFieldProp, I as InputProp, R as RadioGroupProp, k as RadioProp, S as SearchInputProp, q as ShowCheckedStrategyProp, r as SliderProp, t as SwitchProp, T as TextareaProp, u as TimePickerProp, v as TransferItemProp, w as TransferProp, x as TreeFieldNamesProp, y as TreeOptionProp, z as TreeSelectProp, E as UploadFileItemProp, G as UploadProp, J as UploadVariantProp } from '../../data-entry.prop-Cjidhei7.js';
-export { B as BadgeProp, D as DataTableProp, E as EmptyStateProp, K as KeyValueGridItemProp, a as KeyValueGridProp, S as StatusBadgeProp } from '../../data-display.prop-i0iaSwMV.js';
+export { A as AutocompleteOptionProp, a as AutocompleteProp, C as CalendarProp, b as CascaderProp, c as CheckboxGroupProp, d as CheckboxProp, e as ChoiceOptionProp, f as ColorPickerProp, D as DatePickerProp, j as DateRangePickerProp, F as FormFieldProp, I as InputProp, R as RadioGroupProp, k as RadioProp, S as SearchInputProp, q as ShowCheckedStrategyProp, r as SliderProp, s as SwitchProp, T as TextareaProp, t as TimePickerProp, u as TransferItemProp, v as TransferProp, w as TreeFieldNamesProp, x as TreeOptionProp, y as TreeSelectProp, B as UploadFileItemProp, E as UploadProp, H as UploadVariantProp } from '../../data-entry.prop-CpSx5dX6.js';
+export { B as BadgeProp, D as DataTableProp, a as DescriptionsItemProp, b as DescriptionsProp, E as EmptyStateProp } from '../../data-display.prop-CXP9Jfdn.js';
 export { A as AlertActionsProp, a as AlertContentProp, b as AlertDescriptionProp, c as AlertProp, d as AlertQueryErrorProp, e as AlertTitleProp, D as DialogConfirmProp, S as SkeletonRowsProp } from '../../feedback.prop-BnBpUzNK.js';
 export { D as DataStateProp, I as InfiniteQueryHelpers, a as InfiniteQueryStateProp, M as MutationFeedbackProp, P as PrefetchLinkProp, Q as QueryRefetchButtonProp } from '../../query.prop-hIPrk2zI.js';
-export { F as FilterBarProp, a as FilterGroupProp, P as PaginationProp, S as StepItemProp, b as StepStatusProp, c as StepsProp, T as TabItemProp, d as TabsItemsProp } from '../../navigation.prop-Ck5_gSfs.js';
+export { F as FilterBarProp, a as FilterGroupProp, P as PaginationProp, S as StepItemProp, b as StepStatusProp, c as StepsProp, T as TabItemProp, d as TabsProp } from '../../navigation.prop-DAH4ysXj.js';
 export { A as AppContextValue, a as AppProviderProp, D as DateFormatPickerProp, L as LocalePickerProp, T as TimeFormatPickerProp, b as TimezonePickerProp } from '../../app.prop-IobwLwaM.js';
 export { F as FieldErrorMessageProp, a as FormFieldControlProp, b as FormRootProp, U as UseZodFormOptionsProp, c as UseZodFormReturnProp, Z as ZodSchemaProp } from '../../form.prop-BHgpuFFm.js';
 import 'react';

package/dist/props/index.d.ts

@@ -6,11 +6,11 @@ export { B as BreadcrumbItem, B as BreadcrumbItemProp, a as BreadcrumbProp, P as
 export { C as ColumnDef, C as ColumnDefProp, G as GetRowIdProp, H as HasActiveFiltersProp, O as OnClearFiltersProp, a as OnRowClickProp, b as OnSearchChangeProp, c as OnSelectChangeProp, d as OnSortChangeProp, e as OnTableDensityChangeProp, S as SelectedIdsProp } from '../data.prop-BmLaGLb7.js';
 export { A as AppShellProp, I as InlineProp, I as InlineProps, P as PageContainerProp, P as PageContainerProps, a as PageHeaderProp, b as PageInsetProp, S as SidebarItemProp, c as SidebarProductProp, d as SidebarProp, e as SidebarSectionProp, f as StackProp, f as StackProps, T as TopbarProductProp, g as TopbarProjectProp, h as TopbarProp } from '../layout.prop-MwHm4-Zl.js';
 export { B as ButtonProp, B as ButtonProps } from '../general.prop-D7brMPNL.js';
-export { A as AutocompleteOptionProp, a as AutocompleteProp, C as CalendarProp, b as CascaderProp, c as CheckboxGroupProp, d as CheckboxProp, e as ChoiceOptionProp, f as ColorPickerProp, D as DatePickerProp, j as DateRangePickerProp, F as FormFieldProp, I as InputProp, R as RadioGroupProp, k as RadioProp, S as SearchInputProp, q as ShowCheckedStrategyProp, r as SliderProp, t as SwitchProp, T as TextareaProp, u as TimePickerProp, v as TransferItemProp, w as TransferProp, x as TreeFieldNamesProp, y as TreeOptionProp, z as TreeSelectProp, E as UploadFileItemProp, G as UploadProp, J as UploadVariantProp } from '../data-entry.prop-Cjidhei7.js';
-export { B as BadgeProp, D as DataTableProp, E as EmptyStateProp, K as KeyValueGridItemProp, a as KeyValueGridProp, S as StatusBadgeProp } from '../data-display.prop-i0iaSwMV.js';
+export { A as AutocompleteOptionProp, a as AutocompleteProp, C as CalendarProp, b as CascaderProp, c as CheckboxGroupProp, d as CheckboxProp, e as ChoiceOptionProp, f as ColorPickerProp, D as DatePickerProp, j as DateRangePickerProp, F as FormFieldProp, I as InputProp, R as RadioGroupProp, k as RadioProp, S as SearchInputProp, q as ShowCheckedStrategyProp, r as SliderProp, s as SwitchProp, T as TextareaProp, t as TimePickerProp, u as TransferItemProp, v as TransferProp, w as TreeFieldNamesProp, x as TreeOptionProp, y as TreeSelectProp, B as UploadFileItemProp, E as UploadProp, H as UploadVariantProp } from '../data-entry.prop-CpSx5dX6.js';
+export { B as BadgeProp, D as DataTableProp, a as DescriptionsItemProp, b as DescriptionsProp, E as EmptyStateProp } from '../data-display.prop-CXP9Jfdn.js';
 export { A as AlertActionsProp, a as AlertContentProp, b as AlertDescriptionProp, c as AlertProp, d as AlertQueryErrorProp, e as AlertTitleProp, D as DialogConfirmProp, S as SkeletonRowsProp } from '../feedback.prop-BnBpUzNK.js';
 export { D as DataStateProp, I as InfiniteQueryHelpers, a as InfiniteQueryStateProp, M as MutationFeedbackProp, P as PrefetchLinkProp, Q as QueryRefetchButtonProp } from '../query.prop-hIPrk2zI.js';
-export { F as FilterBarProp, a as FilterGroupProp, P as PaginationProp, S as StepItemProp, b as StepStatusProp, c as StepsProp, T as TabItemProp, d as TabsItemsProp } from '../navigation.prop-Ck5_gSfs.js';
+export { F as FilterBarProp, a as FilterGroupProp, P as PaginationProp, S as StepItemProp, b as StepStatusProp, c as StepsProp, T as TabItemProp, d as TabsProp } from '../navigation.prop-DAH4ysXj.js';
 export { A as AppContextValue, a as AppProviderProp, D as DateFormatPickerProp, L as LocalePickerProp, T as TimeFormatPickerProp, b as TimezonePickerProp } from '../app.prop-IobwLwaM.js';
 export { F as FieldErrorMessageProp, a as FormFieldControlProp, b as FormRootProp, U as UseZodFormOptionsProp, c as UseZodFormReturnProp, Z as ZodSchemaProp } from '../form.prop-BHgpuFFm.js';
 export { COMPONENT_PROP_REGISTRY, ComponentPropName, PROP_ALIASES_FORBIDDEN, VOCABULARY_REGISTRY, VocabularyPropName } from './registry.js';

package/dist/props/index.js

@@ -1,3 +1,3 @@
 import '../chunk-B775Y6BE.js';
 import '../chunk-ZT5UEUBO.js';
-export { COMPONENT_PROP_REGISTRY, PROP_ALIASES_FORBIDDEN, VOCABULARY_REGISTRY } from '../chunk-BM5LIDCS.js';
+export { COMPONENT_PROP_REGISTRY, PROP_ALIASES_FORBIDDEN, VOCABULARY_REGISTRY } from '../chunk-OGFWIXRO.js';

package/dist/props/registry.d.ts

@@ -192,7 +192,7 @@ declare const VOCABULARY_REGISTRY: {
     readonly StatusToneProp: {
         readonly file: "vocabulary/interaction.prop.ts";
         readonly category: "interaction";
-        readonly description: "StatusBadge color tone";
+        readonly description: "Badge color tone";
     };
     readonly AlertVariantProp: {
         readonly file: "vocabulary/interaction.prop.ts";
@@ -403,10 +403,10 @@ declare const COMPONENT_PROP_REGISTRY: {
         readonly file: "components/data-entry.prop.ts";
         readonly vocabulary: readonly ["DisabledProp"];
     };
-    readonly SwitchFieldProp: {
+    readonly ChoiceFieldProp: {
         readonly group: "data-entry";
         readonly file: "components/data-entry.prop.ts";
-        readonly vocabulary: readonly ["IdProp", "LabelProp", "RequiredProp", "HelperProp", "ErrorProp", "DisabledProp", "ClassNameProp"];
+        readonly vocabulary: readonly ["IdProp", "LabelProp", "ClassNameProp"];
     };
     readonly SliderProp: {
         readonly group: "data-entry";
@@ -526,26 +526,21 @@ declare const COMPONENT_PROP_REGISTRY: {
         readonly file: "components/data-display.prop.ts";
         readonly vocabulary: readonly ["IconProp", "TitleProp", "DescriptionProp", "ActionProp"];
     };
-    readonly KeyValueGridProp: {
+    readonly DescriptionsProp: {
         readonly group: "data-display";
         readonly file: "components/data-display.prop.ts";
         readonly vocabulary: readonly [];
     };
-    readonly StatusBadgeProp: {
+    readonly BadgeProp: {
         readonly group: "data-display";
         readonly file: "components/data-display.prop.ts";
-        readonly vocabulary: readonly ["StatusToneProp"];
+        readonly vocabulary: readonly ["ChildrenProp", "ClassNameProp"];
     };
     readonly DataTableProp: {
         readonly group: "data-display";
         readonly file: "components/data-display.prop.ts";
         readonly vocabulary: readonly ["ColumnDefProp", "TableDensityProp", "SortStateProp", "SelectedIdsProp"];
     };
-    readonly BadgeProp: {
-        readonly group: "data-display";
-        readonly file: "components/data-display.prop.ts";
-        readonly vocabulary: readonly [];
-    };
     readonly DialogConfirmProp: {
         readonly group: "feedback";
         readonly file: "components/feedback.prop.ts";
@@ -641,7 +636,7 @@ declare const COMPONENT_PROP_REGISTRY: {
         readonly file: "components/navigation.prop.ts";
         readonly vocabulary: readonly [];
     };
-    readonly TabsItemsProp: {
+    readonly TabsProp: {
         readonly group: "navigation";
         readonly file: "components/navigation.prop.ts";
         readonly vocabulary: readonly ["ClassNameProp"];

package/dist/props/registry.js

@@ -1 +1 @@
-export { COMPONENT_PROP_REGISTRY, PROP_ALIASES_FORBIDDEN, VOCABULARY_REGISTRY } from '../chunk-BM5LIDCS.js';
+export { COMPONENT_PROP_REGISTRY, PROP_ALIASES_FORBIDDEN, VOCABULARY_REGISTRY } from '../chunk-OGFWIXRO.js';

package/dist/{search-input-mAZy3Den.d.ts → search-input-rR2XDrjv.d.ts}

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { F as FormFieldProp } from './data-entry.prop-Cjidhei7.js';
+import { F as FormFieldProp } from './data-entry.prop-CpSx5dX6.js';
 import * as React from 'react';
 
 declare function FormField({ id, label, required, helper, error, labelAddon, className, children, }: FormFieldProp): react_jsx_runtime.JSX.Element;

package/dist/skeleton-CqFO4dRc.d.ts

@@ -0,0 +1,20 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+
+type SkeletonProps = React.HTMLAttributes<HTMLDivElement>;
+declare function Skeleton({ className, ...props }: SkeletonProps): react_jsx_runtime.JSX.Element;
+interface SkeletonRowsProps {
+    rows?: number;
+    columns?: number;
+    className?: string;
+}
+/** Skeleton for a flat list of rows (use inside a Card or section). */
+declare function SkeletonRows({ rows, columns, className }: SkeletonRowsProps): react_jsx_runtime.JSX.Element;
+/** Skeleton matching the DataTable layout — header row + N body rows. */
+declare function SkeletonTable({ rows, columns }: SkeletonRowsProps): react_jsx_runtime.JSX.Element;
+/** Skeleton matching a Card detail layout — title + 6 metadata rows. */
+declare function SkeletonDetail(): react_jsx_runtime.JSX.Element;
+/** Skeleton matching a stat card / dashboard tile. */
+declare function SkeletonCard(): react_jsx_runtime.JSX.Element;
+
+export { Skeleton as S, SkeletonCard as a, SkeletonDetail as b, type SkeletonProps as c, SkeletonRows as d, SkeletonTable as e };

package/dist/styles/badge-layout.css

@@ -3,7 +3,7 @@
  */
 
 @layer components {
-  [data-slot="status-badge"] {
+  [data-slot="badge"] {
     display: inline-flex;
     align-items: center;
     gap: var(--space-badge-gap);
@@ -17,7 +17,7 @@
     white-space: nowrap;
   }
 
-  [data-slot="status-badge-icon"] {
+  [data-slot="badge-icon"] {
     width: 0.75rem;
     height: 0.75rem;
     flex-shrink: 0;

package/dist/styles/card-layout.css

@@ -301,7 +301,7 @@
   padding-block: var(--card-space-footer-y);
 }
 
-/* ── CardStat — KPI tile aligned to dashboard design ─────────────── */
+/* ── StatCard — KPI tile aligned to dashboard design ─────────────── */
 [data-slot="card"][data-stat-card] {
   padding: var(--card-space-header-y) var(--card-space-inset);
 }
@@ -313,51 +313,51 @@
   column-gap: var(--space-inline-md);
 }
 
-[data-slot="card-stat-body"] {
+[data-slot="stat-card-body"] {
   min-width: 0;
 }
 
-[data-slot="card-stat-label"] {
+[data-slot="stat-card-label"] {
   display: flex;
   align-items: center;
   gap: var(--space-inline-xs);
   color: hsl(var(--muted-foreground));
-  font-size: var(--card-stat-label-font-size);
-  font-weight: var(--card-stat-label-font-weight);
-  letter-spacing: var(--card-stat-label-letter-spacing);
+  font-size: var(--stat-card-label-font-size);
+  font-weight: var(--stat-card-label-font-weight);
+  letter-spacing: var(--stat-card-label-letter-spacing);
   line-height: var(--line-height-normal);
   text-transform: uppercase;
 }
 
-[data-slot="card-stat-label"] svg {
+[data-slot="stat-card-label"] svg {
   width: 0.875rem;
   height: 0.875rem;
   flex-shrink: 0;
   stroke-width: 1.6;
 }
 
-[data-slot="card-stat-value-row"] {
+[data-slot="stat-card-value-row"] {
   display: flex;
   align-items: baseline;
   gap: var(--space-inline-sm);
-  margin-top: var(--card-stat-gap);
+  margin-top: var(--stat-card-gap);
 }
 
-[data-slot="card"][data-stat-align="end"] [data-slot="card-stat-value-row"],
-[data-slot="card"][data-stat-layout="inline"] [data-slot="card-stat-value-row"] {
+[data-slot="card"][data-stat-align="end"] [data-slot="stat-card-value-row"],
+[data-slot="card"][data-stat-layout="inline"] [data-slot="stat-card-value-row"] {
   justify-content: flex-end;
   text-align: right;
 }
 
-[data-slot="card-stat-value"] {
-  font-size: var(--card-stat-value-font-size);
-  font-weight: var(--card-stat-value-font-weight);
+[data-slot="stat-card-value"] {
+  font-size: var(--stat-card-value-font-size);
+  font-weight: var(--stat-card-value-font-weight);
   letter-spacing: var(--letter-spacing-tight);
-  line-height: var(--card-stat-value-line-height);
+  line-height: var(--stat-card-value-line-height);
   font-variant-numeric: tabular-nums;
 }
 
-[data-slot="card-stat-delta"] {
+[data-slot="stat-card-delta"] {
   color: hsl(var(--muted-foreground));
   font-size: var(--font-size-xs);
   font-weight: var(--font-weight-medium);
@@ -365,9 +365,9 @@
   font-variant-numeric: tabular-nums;
 }
 
-[data-slot="card-stat-hint"] {
-  margin-top: var(--card-stat-gap);
+[data-slot="stat-card-hint"] {
+  margin-top: var(--stat-card-gap);
   color: hsl(var(--muted-foreground));
-  font-size: var(--card-stat-hint-font-size);
+  font-size: var(--stat-card-hint-font-size);
   line-height: var(--line-height-normal);
 }

package/dist/styles/control.css

@@ -3,6 +3,74 @@
  */
 
 @layer components {
+  .ui-toggle {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: var(--space-inline-xs);
+    border-radius: var(--radius-md);
+    color: hsl(var(--foreground));
+    font-size: var(--font-size-sm);
+    font-weight: var(--font-weight-medium);
+    transition:
+      background-color 150ms ease,
+      border-color 150ms ease,
+      color 150ms ease,
+      box-shadow 150ms ease;
+  }
+
+  .ui-toggle-default {
+    border: 1px solid transparent;
+  }
+
+  .ui-toggle-outline {
+    border: 1px solid hsl(var(--border));
+    background: hsl(var(--background));
+  }
+
+  .ui-toggle-default-size {
+    min-height: var(--control-height);
+    padding-inline: var(--space-3);
+  }
+
+  .ui-toggle-sm {
+    min-height: var(--control-height-sm);
+    padding-inline: var(--space-2);
+    font-size: var(--font-size-xs);
+  }
+
+  .ui-toggle-lg {
+    min-height: var(--control-height-lg);
+    padding-inline: var(--space-4);
+  }
+
+  .ui-toggle:hover {
+    background: hsl(var(--accent));
+    color: hsl(var(--accent-foreground));
+  }
+
+  .ui-toggle[data-state="on"] {
+    background: hsl(var(--primary));
+    color: hsl(var(--primary-foreground));
+  }
+
+  .ui-toggle:focus-visible {
+    outline: none;
+    box-shadow: 0 0 0 3px hsl(var(--ring) / 0.35);
+  }
+
+  .ui-toggle:disabled,
+  .ui-toggle[data-disabled] {
+    cursor: not-allowed;
+    opacity: var(--disabled-opacity);
+  }
+
+  .ui-toggle-group {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--space-1);
+  }
+
   .ui-button {
     display: inline-flex;
     align-items: center;

package/dist/styles/data-display-layout.css

@@ -1,67 +1,36 @@
 @layer components {
-  .ui-code-badge {
+  .ui-avatar {
+    position: relative;
     display: inline-flex;
-    max-width: 100%;
-    min-height: var(--code-badge-height);
+    width: var(--control-height);
+    height: var(--control-height);
+    flex-shrink: 0;
     align-items: center;
-    gap: var(--code-badge-gap);
-    padding-inline: var(--code-badge-padding-x);
-    border: 1px solid hsl(var(--code-badge-hsl) / var(--code-badge-border-alpha));
-    border-radius: var(--radius);
-    background: hsl(var(--code-badge-hsl) / var(--code-badge-bg-alpha));
-    color: hsl(var(--code-badge-hsl));
-    font-size: var(--font-size-xs);
+    justify-content: center;
+    overflow: hidden;
+    border-radius: 9999px;
+    background: hsl(var(--muted));
+    color: hsl(var(--muted-foreground));
+    font-size: var(--font-size-sm);
     font-weight: var(--font-weight-medium);
-    font-variant-numeric: tabular-nums;
-  }
-
-  .ui-code-badge[data-kind="internal"] {
-    --code-badge-hsl: var(--tracking-internal);
-  }
-
-  .ui-code-badge[data-kind="seller"] {
-    --code-badge-hsl: var(--tracking-seller);
   }
 
-  .ui-code-badge[data-kind="yamato"] {
-    --code-badge-hsl: var(--tracking-yamato);
-  }
-
-  .ui-code-badge svg {
-    width: 0.875rem;
-    height: 0.875rem;
-    flex-shrink: 0;
-    opacity: 0.82;
+  .ui-avatar-image {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
   }
 
-  .ui-code-badge-label {
-    display: inline-flex;
-    flex-shrink: 0;
+  .ui-avatar-fallback {
+    display: flex;
+    width: 100%;
+    height: 100%;
     align-items: center;
-    gap: var(--code-badge-gap);
-    color: hsl(var(--code-badge-hsl));
-    font-size: 0.625rem;
-    font-weight: var(--font-weight-semibold);
-    letter-spacing: 0;
-    line-height: 1rem;
-    text-align: center;
+    justify-content: center;
+    background: hsl(var(--muted));
   }
 
-  .ui-code-badge-label::after {
-    width: 1px;
-    height: 0.875rem;
-    background: hsl(var(--code-badge-hsl) / var(--code-badge-separator-alpha));
-    content: "";
-  }
-
-  .ui-code-badge-value {
-    min-width: 0;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-
-  .ui-progress-meter {
+  .ui-progress {
     display: flex;
     flex-direction: column;
     gap: var(--space-2);
@@ -80,7 +49,7 @@
     background: hsl(var(--success));
   }
 
-  .ui-progress-meter[data-tone="warning"] .ui-progress-bar {
+  .ui-progress[data-tone="warning"] .ui-progress-bar {
     background: hsl(var(--warning));
   }
 
@@ -216,31 +185,4 @@
     font-size: var(--font-size-sm);
   }
 
-  .ui-scan-panel {
-    display: grid;
-    aspect-ratio: 1 / 1;
-    place-items: center;
-    border: 2px dashed hsl(var(--primary) / 0.3);
-    border-radius: calc(var(--radius) + 0.25rem);
-    background: hsl(var(--primary) / 0.05);
-    text-align: center;
-  }
-
-  .ui-scan-panel svg {
-    width: 4rem;
-    height: 4rem;
-    margin-inline: auto;
-    color: hsl(var(--primary));
-  }
-
-  .ui-scan-title {
-    margin-top: var(--space-3);
-    font-size: var(--font-size-lg);
-    font-weight: var(--font-weight-semibold);
-  }
-
-  .ui-scan-description {
-    color: hsl(var(--muted-foreground));
-    font-size: var(--font-size-sm);
-  }
 }

package/dist/styles/layout.css

@@ -4,6 +4,25 @@
  */
 
 @layer components {
+  .ui-separator {
+    flex-shrink: 0;
+    background: hsl(var(--border));
+  }
+
+  .ui-separator[data-orientation="horizontal"] {
+    width: 100%;
+    height: 1px;
+  }
+
+  .ui-separator[data-orientation="vertical"] {
+    width: 1px;
+    height: 100%;
+  }
+
+  .ui-aspect-ratio {
+    overflow: hidden;
+  }
+
   .ui-stack-xs {
     display: flex;
     flex-direction: column;
@@ -281,77 +300,6 @@
     color: hsl(var(--foreground));
   }
 
-  .ui-mobile-stage {
-    min-height: 100vh;
-    padding: var(--space-section-active);
-    background: hsl(var(--secondary));
-  }
-
-  .ui-mobile-frame {
-    display: flex;
-    flex-direction: column;
-    width: min(100%, 23.5rem);
-    min-height: 50.75rem;
-    margin-inline: auto;
-    overflow: hidden;
-    border: 1px solid hsl(var(--border));
-    border-radius: 1.75rem;
-    background: hsl(var(--background));
-    box-shadow: var(--shadow-xl, 0 20px 25px -5px rgb(0 0 0 / 0.1));
-  }
-
-  .ui-mobile-header {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: var(--space-inline-sm);
-    padding: var(--space-3) var(--space-4);
-    background: hsl(var(--primary));
-    color: hsl(var(--primary-foreground));
-  }
-
-  .ui-mobile-title {
-    font-size: var(--font-size-sm);
-    font-weight: var(--font-weight-semibold);
-  }
-
-  .ui-mobile-subtitle {
-    color: hsl(0 0% 100% / 0.6);
-    font-size: var(--font-size-xs);
-  }
-
-  .ui-mobile-main {
-    flex: 1;
-    padding: var(--space-4);
-  }
-
-  .ui-mobile-nav {
-    display: grid;
-    grid-template-columns: repeat(4, minmax(0, 1fr));
-    border-top: 1px solid hsl(var(--border));
-    background: hsl(var(--card));
-  }
-
-  .ui-mobile-nav-item {
-    display: flex;
-    height: 4rem;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    gap: var(--space-1);
-    color: hsl(var(--muted-foreground));
-    font-size: var(--font-size-xs);
-  }
-
-  .ui-mobile-nav-item[data-active="true"] {
-    color: hsl(var(--primary));
-  }
-
-  .ui-mobile-nav-item svg {
-    width: 1.25rem;
-    height: 1.25rem;
-  }
-
   .ui-empty-state {
     display: flex;
     flex-direction: column;