@godxjp/ui 9.1.0 → 10.0.0

package/dist/props/registry.d.ts

@@ -322,22 +322,7 @@ declare const COMPONENT_PROP_REGISTRY: {
         readonly file: "components/app.prop.ts";
         readonly vocabulary: readonly ["ChildrenProp"];
     };
-    readonly LocalePickerProp: {
-        readonly group: "app";
-        readonly file: "components/app.prop.ts";
-        readonly vocabulary: readonly ["ValueProp", "OnValueChangeProp", "DisabledProp", "IdProp", "ClassNameProp"];
-    };
-    readonly TimezonePickerProp: {
-        readonly group: "app";
-        readonly file: "components/app.prop.ts";
-        readonly vocabulary: readonly ["ValueProp", "OnValueChangeProp", "DisabledProp", "IdProp", "ClassNameProp"];
-    };
-    readonly TimeFormatPickerProp: {
-        readonly group: "app";
-        readonly file: "components/app.prop.ts";
-        readonly vocabulary: readonly ["ValueProp", "OnValueChangeProp", "DisabledProp", "IdProp", "ClassNameProp"];
-    };
-    readonly DateFormatPickerProp: {
+    readonly AppSettingPickerProp: {
         readonly group: "app";
         readonly file: "components/app.prop.ts";
         readonly vocabulary: readonly ["ValueProp", "OnValueChangeProp", "DisabledProp", "IdProp", "ClassNameProp"];
@@ -509,26 +494,6 @@ declare const COMPONENT_PROP_REGISTRY: {
         readonly file: "components/data-entry.prop.ts";
         readonly vocabulary: readonly ["IdProp", "LabelProp", "DescriptionProp", "ClassNameProp", "ChildrenProp"];
     };
-    readonly ChoiceFieldProp: {
-        readonly group: "data-entry";
-        readonly file: "components/data-entry.prop.ts";
-        readonly vocabulary: readonly ["IdProp", "LabelProp", "ClassNameProp"];
-    };
-    readonly CountryOptionProp: {
-        readonly group: "data-entry";
-        readonly file: "components/data-entry.prop.ts";
-        readonly vocabulary: readonly ["LabelProp", "ValueProp"];
-    };
-    readonly CountryOptionLabelProp: {
-        readonly group: "data-entry";
-        readonly file: "components/data-entry.prop.ts";
-        readonly vocabulary: readonly ["ClassNameProp"];
-    };
-    readonly CountrySelectProp: {
-        readonly group: "data-entry";
-        readonly file: "components/data-entry.prop.ts";
-        readonly vocabulary: readonly ["IdProp", "NameProp", "DefaultValueProp", "RequiredProp", "PlaceholderProp"];
-    };
     readonly SliderProp: {
         readonly group: "data-entry";
         readonly file: "components/data-entry.prop.ts";
@@ -794,17 +759,17 @@ declare const COMPONENT_PROP_REGISTRY: {
     readonly PaginationProp: {
         readonly group: "navigation";
         readonly file: "components/navigation.prop.ts";
-        readonly vocabulary: readonly ["DisabledProp", "ClassNameProp"];
+        readonly vocabulary: readonly ["ValueProp", "OnValueChangeProp", "DisabledProp", "ClassNameProp"];
     };
     readonly StepsProp: {
         readonly group: "navigation";
         readonly file: "components/navigation.prop.ts";
-        readonly vocabulary: readonly ["SizeProp", "OnValueChangeProp", "ClassNameProp"];
+        readonly vocabulary: readonly ["ValueProp", "DefaultValueProp", "SizeProp", "OnValueChangeProp", "ClassNameProp"];
     };
     readonly StepItemProp: {
         readonly group: "navigation";
         readonly file: "components/navigation.prop.ts";
-        readonly vocabulary: readonly ["TitleProp", "DescriptionProp", "IconProp", "DisabledProp"];
+        readonly vocabulary: readonly ["TitleProp", "SubtitleProp", "DescriptionProp", "IconProp", "DisabledProp"];
     };
     readonly StepStatusProp: {
         readonly group: "navigation";
@@ -851,6 +816,86 @@ declare const COMPONENT_PROP_REGISTRY: {
         readonly file: "components/form.prop.ts";
         readonly vocabulary: readonly ["ZodSchemaProp"];
     };
+    readonly ToggleProp: {
+        readonly group: "data-entry";
+        readonly file: "components/ui/toggle.tsx";
+        readonly vocabulary: readonly ["SizeProp", "ClassNameProp"];
+    };
+    readonly RatingProp: {
+        readonly group: "data-entry";
+        readonly file: "components/ui/rating.tsx";
+        readonly vocabulary: readonly ["ValueProp", "OnValueChangeProp", "DisabledProp", "ClassNameProp"];
+    };
+    readonly TagInputProp: {
+        readonly group: "data-entry";
+        readonly file: "components/ui/tag-input.tsx";
+        readonly vocabulary: readonly ["ValueProp", "OnValueChangeProp", "PlaceholderProp", "IdProp", "ClassNameProp"];
+    };
+    readonly PasswordInputProp: {
+        readonly group: "data-entry";
+        readonly file: "components/ui/password-input.tsx";
+        readonly vocabulary: readonly ["ClassNameProp"];
+    };
+    readonly PasswordStrengthProp: {
+        readonly group: "data-entry";
+        readonly file: "components/data-entry/password-strength.tsx";
+        readonly vocabulary: readonly ["ValueProp", "ClassNameProp"];
+    };
+    readonly ProgressProp: {
+        readonly group: "data-display";
+        readonly file: "components/data-display/progress.tsx";
+        readonly vocabulary: readonly ["ValueProp", "LabelProp", "ClassNameProp"];
+    };
+    readonly TimelineProp: {
+        readonly group: "data-display";
+        readonly file: "components/data-display/timeline.tsx";
+        readonly vocabulary: readonly ["ClassNameProp"];
+    };
+    readonly TreeListProp: {
+        readonly group: "data-display";
+        readonly file: "components/data-display/tree-list.tsx";
+        readonly vocabulary: readonly ["ClassNameProp"];
+    };
+    readonly CardProp: {
+        readonly group: "data-display";
+        readonly file: "components/data-display/card.tsx";
+        readonly vocabulary: readonly ["ToneProp", "ClassNameProp", "ChildrenProp"];
+    };
+    readonly CardCoverProp: {
+        readonly group: "data-display";
+        readonly file: "components/data-display/card.tsx";
+        readonly vocabulary: readonly ["ClassNameProp", "ChildrenProp"];
+    };
+    readonly CardHeaderProp: {
+        readonly group: "data-display";
+        readonly file: "components/data-display/card.tsx";
+        readonly vocabulary: readonly ["TitleProp", "DescriptionProp", "ClassNameProp", "ChildrenProp"];
+    };
+    readonly CardContentProp: {
+        readonly group: "data-display";
+        readonly file: "components/data-display/card.tsx";
+        readonly vocabulary: readonly ["ClassNameProp", "ChildrenProp"];
+    };
+    readonly CardFooterProp: {
+        readonly group: "data-display";
+        readonly file: "components/data-display/card.tsx";
+        readonly vocabulary: readonly ["ClassNameProp", "ChildrenProp"];
+    };
+    readonly StatCardProp: {
+        readonly group: "data-display";
+        readonly file: "components/data-display/card.tsx";
+        readonly vocabulary: readonly ["TitleProp", "ToneProp", "ClassNameProp"];
+    };
+    readonly ResponsiveGridProp: {
+        readonly group: "layout";
+        readonly file: "components/layout/responsive-grid.tsx";
+        readonly vocabulary: readonly ["GapProp", "ClassNameProp", "ChildrenProp"];
+    };
+    readonly SplitPaneProp: {
+        readonly group: "layout";
+        readonly file: "components/layout/split-pane.tsx";
+        readonly vocabulary: readonly ["ClassNameProp", "ChildrenProp"];
+    };
 };
 type ComponentPropName = keyof typeof COMPONENT_PROP_REGISTRY;
 /** Forbidden duplicate concepts — use the canonical name on the left. */

package/dist/props/registry.js

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

package/dist/{search-input-cezAxpgb.d.ts → search-input-DpqDMXcn.d.ts}

@@ -1,13 +1,11 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { l as FormFieldProp, F as FieldProp } from './data-entry.prop-CDkOajPj.js';
+import { h as FormFieldProp, F as FieldProp } from './data-entry.prop-BR4vNA1j.js';
 import * as React from 'react';
 
 declare function FormField({ id, label, required, helper, error, labelAddon, className, children, }: FormFieldProp): react_jsx_runtime.JSX.Element;
 
 /** Label + optional description beside a checkbox/radio/switch control. */
 declare function Field({ id, label, description, className, children }: FieldProp): react_jsx_runtime.JSX.Element;
-/** @deprecated Use Field. */
-declare const ChoiceField: typeof Field;
 
 interface SearchInputProps {
     value?: string;
@@ -24,4 +22,4 @@ interface SearchInputProps {
 }
 declare function SearchInput({ value: controlledValue, defaultValue, placeholder, debounce, onSearch, label, ariaLabel, className, inputClassName, id, disabled, }: SearchInputProps): react_jsx_runtime.JSX.Element;
 
-export { ChoiceField as C, Field as F, SearchInput as S, FormField as a };
+export { Field as F, SearchInput as S, FormField as a };

package/dist/{skeleton-uWAjSacg.d.ts → skeleton-cj9kh5wo.d.ts}

@@ -16,7 +16,5 @@ declare function SkeletonTable({ rows, columns }: SkeletonRowsProps): react_jsx_
 declare function SkeletonDetail(): react_jsx_runtime.JSX.Element;
 /** Skeleton matching a stat card / dashboard tile. */
 declare function SkeletonStat(): react_jsx_runtime.JSX.Element;
-/** @deprecated Use SkeletonStat. */
-declare const SkeletonCard: typeof SkeletonStat;
 
-export { Skeleton as S, SkeletonCard as a, SkeletonDetail as b, type SkeletonProps as c, SkeletonRows as d, SkeletonStat as e, SkeletonTable as f };
+export { Skeleton as S, SkeletonDetail as a, type SkeletonProps as b, SkeletonRows as c, SkeletonStat as d, SkeletonTable as e };

package/dist/styles/control.css

@@ -572,59 +572,194 @@
 }
 
 /* PasswordInput */
-.ui-password-input { position: relative; display: block; }
-.ui-password-input-field { padding-right: 2.5rem; }
+.ui-password-input {
+  position: relative;
+  display: block;
+}
+.ui-password-input-field {
+  padding-right: 2.5rem;
+}
 .ui-password-input-toggle {
-  position: absolute; inset-block: 0; inset-inline-end: 0; display: inline-flex;
-  align-items: center; justify-content: center; width: 2.5rem;
-  color: hsl(var(--muted-foreground)); background: transparent; border: 0; cursor: pointer;
+  position: absolute;
+  inset-block: 0;
+  inset-inline-end: 0;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 2.5rem;
+  color: hsl(var(--muted-foreground));
+  background: transparent;
+  border: 0;
+  cursor: pointer;
+}
+.ui-password-input-toggle:hover {
+  color: hsl(var(--foreground));
+}
+.ui-password-input-toggle svg {
+  width: 1rem;
+  height: 1rem;
 }
-.ui-password-input-toggle:hover { color: hsl(var(--foreground)); }
-.ui-password-input-toggle svg { width: 1rem; height: 1rem; }
 
 /* InputOTP */
-.ui-otp-container { display: flex; align-items: center; gap: var(--space-2); }
-.ui-otp-input:disabled { cursor: not-allowed; }
-.ui-otp-group { display: flex; align-items: center; }
+.ui-otp-container {
+  display: flex;
+  align-items: center;
+  gap: var(--space-2);
+}
+.ui-otp-input:disabled {
+  cursor: not-allowed;
+}
+.ui-otp-group {
+  display: flex;
+  align-items: center;
+}
 .ui-otp-slot {
-  position: relative; display: flex; width: 2.25rem; height: 2.25rem;
-  align-items: center; justify-content: center; font-size: 0.875rem;
-  border: 1px solid hsl(var(--border)); border-inline-start-width: 0;
-  background: hsl(var(--background)); transition: box-shadow 0.15s ease;
+  position: relative;
+  display: flex;
+  width: 2.25rem;
+  height: 2.25rem;
+  align-items: center;
+  justify-content: center;
+  font-size: 0.875rem;
+  border: 1px solid hsl(var(--border));
+  border-inline-start-width: 0;
+  background: hsl(var(--background));
+  transition: box-shadow 0.15s ease;
 }
 .ui-otp-group .ui-otp-slot:first-child {
-  border-inline-start-width: 1px; border-start-start-radius: var(--radius-md); border-end-start-radius: var(--radius-md);
+  border-inline-start-width: 1px;
+  border-start-start-radius: var(--radius-md);
+  border-end-start-radius: var(--radius-md);
+}
+.ui-otp-group .ui-otp-slot:last-child {
+  border-start-end-radius: var(--radius-md);
+  border-end-end-radius: var(--radius-md);
+}
+.ui-otp-slot[data-active="true"] {
+  z-index: 1;
+  box-shadow: 0 0 0 2px hsl(var(--ring));
+}
+.ui-otp-caret-wrapper {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.ui-otp-caret {
+  width: 1px;
+  height: 1rem;
+  background: hsl(var(--foreground));
+  animation: ui-otp-blink 1s step-end infinite;
+}
+@keyframes ui-otp-blink {
+  50% {
+    opacity: 0;
+  }
+}
+.ui-otp-separator-icon {
+  width: 1rem;
+  height: 1rem;
+  color: hsl(var(--muted-foreground));
 }
-.ui-otp-group .ui-otp-slot:last-child { border-start-end-radius: var(--radius-md); border-end-end-radius: var(--radius-md); }
-.ui-otp-slot[data-active="true"] { z-index: 1; box-shadow: 0 0 0 2px hsl(var(--ring)); }
-.ui-otp-caret-wrapper { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
-.ui-otp-caret { width: 1px; height: 1rem; background: hsl(var(--foreground)); animation: ui-otp-blink 1s step-end infinite; }
-@keyframes ui-otp-blink { 50% { opacity: 0; } }
-.ui-otp-separator-icon { width: 1rem; height: 1rem; color: hsl(var(--muted-foreground)); }
 
 /* Rating */
-.ui-rating { display: inline-flex; align-items: center; gap: var(--space-1); }
-.ui-rating-star { background: transparent; border: 0; padding: 0; cursor: pointer; color: hsl(var(--muted-foreground) / 0.45); line-height: 0; }
-.ui-rating-star:disabled { cursor: default; }
-.ui-rating-star svg { width: 1.25rem; height: 1.25rem; }
-.ui-rating-star-filled { color: hsl(var(--warning)); }
-.ui-rating-star-filled svg { fill: currentColor; }
-.ui-rating-star:focus-visible { outline: 2px solid hsl(var(--ring)); outline-offset: 2px; border-radius: var(--radius-sm); }
+.ui-rating {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--space-1);
+}
+.ui-rating-star {
+  /* ≥24px hit area (WCAG 2.5.8) around the 20px glyph */
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 1.5rem;
+  min-height: 1.5rem;
+  background: transparent;
+  border: 0;
+  padding: 0;
+  cursor: pointer;
+  color: hsl(var(--muted-foreground) / 0.45);
+  line-height: 0;
+}
+.ui-rating-star:disabled {
+  cursor: default;
+}
+.ui-rating-star svg {
+  width: 1.25rem;
+  height: 1.25rem;
+}
+.ui-rating-star-filled {
+  color: hsl(var(--warning));
+}
+.ui-rating-star-filled svg {
+  fill: currentColor;
+}
+.ui-rating-star:focus-visible {
+  outline: 2px solid hsl(var(--ring));
+  outline-offset: 2px;
+  border-radius: var(--radius-sm);
+}
 
 /* TagInput */
 .ui-tag-input {
-  display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1);
-  min-height: 2.25rem; padding: var(--space-1) var(--space-2);
-  border: 1px solid hsl(var(--input)); border-radius: var(--radius-md); background: hsl(var(--background));
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: var(--space-1);
+  min-height: 2.25rem;
+  padding: var(--space-1) var(--space-2);
+  border: 1px solid hsl(var(--input));
+  border-radius: var(--radius-md);
+  background: hsl(var(--background));
+}
+.ui-tag-input:focus-within {
+  box-shadow: 0 0 0 2px hsl(var(--ring));
+  border-color: hsl(var(--ring));
+}
+.ui-tag-input-disabled {
+  opacity: 0.6;
+  cursor: not-allowed;
 }
-.ui-tag-input:focus-within { box-shadow: 0 0 0 2px hsl(var(--ring)); border-color: hsl(var(--ring)); }
-.ui-tag-input-disabled { opacity: 0.6; cursor: not-allowed; }
 .ui-tag-input-chip {
-  display: inline-flex; align-items: center; gap: var(--space-1); font-size: 0.8125rem;
-  padding: 0.0625rem var(--space-2); border-radius: var(--radius-sm);
-  background: hsl(var(--secondary)); color: hsl(var(--secondary-foreground));
-}
-.ui-tag-input-remove { display: inline-flex; background: transparent; border: 0; padding: 0; cursor: pointer; color: inherit; opacity: 0.7; }
-.ui-tag-input-remove:hover { opacity: 1; }
-.ui-tag-input-remove svg { width: 0.75rem; height: 0.75rem; }
-.ui-tag-input-field { flex: 1; min-width: 6rem; border: 0; outline: none; background: transparent; font-size: 0.875rem; color: inherit; }
+  display: inline-flex;
+  align-items: center;
+  gap: var(--space-1);
+  font-size: 0.8125rem;
+  padding: 0.0625rem var(--space-2);
+  border-radius: var(--radius-sm);
+  background: hsl(var(--secondary));
+  color: hsl(var(--secondary-foreground));
+}
+.ui-tag-input-remove {
+  /* ≥24px hit area (WCAG 2.5.8) around the 12px glyph; negative inline margin keeps the chip tight */
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 1.5rem;
+  min-height: 1.5rem;
+  margin-inline-end: -0.25rem;
+  background: transparent;
+  border: 0;
+  padding: 0;
+  cursor: pointer;
+  color: inherit;
+  opacity: 0.7;
+}
+.ui-tag-input-remove:hover {
+  opacity: 1;
+}
+.ui-tag-input-remove svg {
+  width: 0.75rem;
+  height: 0.75rem;
+}
+.ui-tag-input-field {
+  flex: 1;
+  min-width: 6rem;
+  border: 0;
+  outline: none;
+  background: transparent;
+  font-size: 0.875rem;
+  color: inherit;
+}

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

@@ -184,32 +184,58 @@
     margin-top: var(--space-1);
     font-size: var(--font-size-sm);
   }
-
 }
 
 /* Accordion */
-.ui-accordion-item { border-bottom: 1px solid hsl(var(--border)); }
-.ui-accordion-header { display: flex; }
+.ui-accordion-item {
+  border-bottom: 1px solid hsl(var(--border));
+}
+.ui-accordion-header {
+  display: flex;
+}
 .ui-accordion-trigger {
-  display: flex; flex: 1; align-items: center; justify-content: space-between;
-  gap: var(--space-2); padding-block: var(--space-4); font-weight: 500; text-align: left;
+  display: flex;
+  flex: 1;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--space-2);
+  padding-block: var(--space-4);
+  font-weight: 500;
+  text-align: left;
   transition: color 0.15s ease;
 }
-.ui-accordion-trigger:hover { text-decoration: underline; }
+.ui-accordion-trigger:hover {
+  text-decoration: underline;
+}
 .ui-accordion-chevron {
-  width: 1rem; height: 1rem; color: hsl(var(--muted-foreground));
-  transition: transform 0.2s ease; flex-shrink: 0;
+  width: 1rem;
+  height: 1rem;
+  color: hsl(var(--muted-foreground));
+  transition: transform 0.2s ease;
+  flex-shrink: 0;
+}
+.ui-accordion-trigger[data-state="open"] .ui-accordion-chevron {
+  transform: rotate(180deg);
+}
+.ui-accordion-content {
+  overflow: hidden;
+  font-size: 0.875rem;
+}
+.ui-accordion-content-inner {
+  padding-bottom: var(--space-4);
 }
-.ui-accordion-trigger[data-state="open"] .ui-accordion-chevron { transform: rotate(180deg); }
-.ui-accordion-content { overflow: hidden; font-size: 0.875rem; }
-.ui-accordion-content-inner { padding-bottom: var(--space-4); }
 
 /* HoverCard */
 .ui-hover-card-content {
-  z-index: 50; width: 16rem; border-radius: var(--radius-md);
-  border: 1px solid hsl(var(--border)); background: hsl(var(--popover));
-  color: hsl(var(--popover-foreground)); padding: var(--space-4);
-  box-shadow: var(--shadow-md); outline: none;
+  z-index: 50;
+  width: 16rem;
+  border-radius: var(--radius-md);
+  border: 1px solid hsl(var(--border));
+  background: hsl(var(--popover));
+  color: hsl(var(--popover-foreground));
+  padding: var(--space-4);
+  box-shadow: var(--shadow-md);
+  outline: none;
 }
 
 .ui-carousel {

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

@@ -90,4 +90,75 @@
   .ui-time-input[aria-invalid="true"] {
     border-color: hsl(var(--destructive));
   }
+
+  .ui-password-strength {
+    display: grid;
+    gap: var(--space-1);
+  }
+
+  .ui-password-strength-track {
+    display: grid;
+    grid-template-columns: repeat(5, minmax(0, 1fr));
+    gap: var(--space-1);
+  }
+
+  .ui-password-strength-segment {
+    height: 0.5rem;
+    border-radius: var(--radius-sm);
+    background: hsl(var(--muted));
+  }
+
+  .ui-password-strength-segment[data-tone="destructive"] {
+    background: hsl(var(--destructive));
+  }
+
+  .ui-password-strength-segment[data-tone="warning"] {
+    background: hsl(var(--warning));
+  }
+
+  .ui-password-strength-segment[data-tone="success"] {
+    background: hsl(var(--success));
+  }
+
+  .ui-password-strength-meta {
+    display: flex;
+    justify-content: space-between;
+    align-items: baseline;
+    gap: var(--space-2);
+  }
+
+  .ui-password-strength-label {
+    color: hsl(var(--foreground));
+    font-size: var(--font-size-sm);
+    font-weight: var(--font-weight-medium);
+  }
+
+  .ui-password-strength-score {
+    color: hsl(var(--muted-foreground));
+    font-size: var(--font-size-xs);
+  }
+
+  .ui-password-strength-checklist {
+    margin: 0;
+    display: grid;
+    gap: var(--space-1);
+    padding-inline: 0;
+    list-style: none;
+    color: hsl(var(--muted-foreground));
+    font-size: var(--font-size-xs);
+  }
+
+  .ui-password-strength-checklist-item {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--space-2);
+  }
+
+  .ui-password-strength-checklist-item[data-state="passed"] svg {
+    color: hsl(var(--success));
+  }
+
+  .ui-password-strength-checklist-item[data-state="failed"] svg {
+    color: hsl(var(--destructive));
+  }
 }

package/dist/styles/feedback-layout.css

@@ -1,17 +1,49 @@
-
 /* Drawer (bottom-sheet, vaul) */
-.ui-drawer-overlay { position: fixed; inset: 0; z-index: 50; background: hsl(var(--overlay, 0 0% 0% / 0.4)); }
+.ui-drawer-overlay {
+  position: fixed;
+  inset: 0;
+  z-index: 50;
+  background: hsl(var(--overlay, 0 0% 0% / 0.4));
+}
 .ui-drawer-content {
-  position: fixed; inset-inline: 0; inset-block-end: 0; z-index: 50;
-  display: flex; flex-direction: column; max-height: 82vh;
-  border-start-start-radius: var(--radius-lg); border-start-end-radius: var(--radius-lg);
-  border: 1px solid hsl(var(--border)); background: hsl(var(--background));
+  position: fixed;
+  inset-inline: 0;
+  inset-block-end: 0;
+  z-index: 50;
+  display: flex;
+  flex-direction: column;
+  max-height: 82vh;
+  border-start-start-radius: var(--radius-lg);
+  border-start-end-radius: var(--radius-lg);
+  border: 1px solid hsl(var(--border));
+  background: hsl(var(--background));
 }
 .ui-drawer-handle {
-  margin: var(--space-3) auto; height: 0.375rem; width: 6rem; flex-shrink: 0;
-  border-radius: 9999px; background: hsl(var(--muted));
+  margin: var(--space-3) auto;
+  height: 0.375rem;
+  width: 6rem;
+  flex-shrink: 0;
+  border-radius: 9999px;
+  background: hsl(var(--muted));
+}
+.ui-drawer-header {
+  display: grid;
+  gap: var(--space-1);
+  padding: var(--space-4);
+  text-align: center;
+}
+.ui-drawer-footer {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-2);
+  margin-top: auto;
+  padding: var(--space-4);
+}
+.ui-drawer-title {
+  font-weight: var(--font-weight-medium);
+  line-height: 1.2;
+}
+.ui-drawer-description {
+  font-size: 0.875rem;
+  color: hsl(var(--muted-foreground));
 }
-.ui-drawer-header { display: grid; gap: var(--space-1); padding: var(--space-4); text-align: center; }
-.ui-drawer-footer { display: flex; flex-direction: column; gap: var(--space-2); margin-top: auto; padding: var(--space-4); }
-.ui-drawer-title { font-weight: 600; line-height: 1.2; }
-.ui-drawer-description { font-size: 0.875rem; color: hsl(var(--muted-foreground)); }