@bridge-ui/vue 0.7.0 → 0.8.0

package/docs/components/BridgeUIProvider.md

@@ -81,7 +81,7 @@ app.use(
 
 Set `global.formDefaults` to apply shared `size` / `rounded` to form controls (TextField, Select, Checkbox, Slider, OtpField, …). Does not affect Button, Progress, Modal, etc.
 
-Merge order: instance props → `components.{Name}.defaultProps` → `formDefaults` → library defaults.
+Merge order: instance props → `components.{Name}.defaultProps` → chrome (`FormField` / `FormControl` / `BaseField` / `TimePanel`) → `formDefaults` → library defaults.
 
 Radio and Switch receive `size` only — their `rounded` stays shape-driven (`full`) unless overridden per component.
 
@@ -97,19 +97,26 @@ app.use(
 );
 ```
 
-### Nested chrome tokens
+### Shared chrome
 
-Building blocks (`FormField`, `FormControl`, `BaseField`) are not registry keys. Theme chrome under the public parent. Dropdown tokens live on `components.Listbox`:
+`FormField`, `FormControl`, `BaseField`, and `TimePanel` are registry keys. Set them once to theme a family; a public entry still overrides `defaultProps`. Chrome tokens live on the shared key (`components.FormField.tokens`, `components.BaseField.tokens`). Dropdown tokens live on `components.Listbox`.
 
 ```ts
 app.use(
   createBridgeUI({
     components: {
-      Slider: {
+      FormField: {
+        defaultProps: {
+          variant: "filled",
+          color: "secondary",
+        },
+      },
+      TextField: {
+        defaultProps: { variant: "outline" },
+      },
+      BaseField: {
         tokens: {
-          baseField: {
-            size: { md: { text: "text-base", group: "gap-3" } },
-          },
+          size: { md: { text: "text-base", group: "gap-3" } },
         },
       },
       Checkbox: {

package/docs/components/FormControl.md

@@ -1,6 +1,6 @@
 # FormControl
 
-> Building block for toggle-row chrome. Prefer `Checkbox`, `Radio`, and `Switch` in apps; FormControl remains exported for advanced composition. Not a registry key — theme chrome via `tokens.formControl` on the public parent (e.g. `components.Checkbox.tokens.formControl`).
+> Building block for toggle-row chrome. Prefer `Checkbox`, `Radio`, and `Switch` in apps; FormControl remains exported for advanced composition. Theme shared chrome via `components.FormControl`; override per public control (`components.Checkbox`, …).
 
 Low-level form control chrome (labels, description, error) for Checkbox, Radio, and Switch.
 

package/docs/components/FormField.md

@@ -1,6 +1,6 @@
 # FormField
 
-> Building block for field chrome. Prefer public fields (`TextField`, `Select`, …) in apps; FormField remains exported for advanced composition. Not a `BridgeUIComponentsConfig` key — theme via the public parent (`components.TextField`, `components.Select`, …).
+> Building block for field chrome. Prefer public fields (`TextField`, `Select`, …) in apps; FormField remains exported for advanced composition. Theme all fields via `components.FormField`; override per public field (`components.TextField`, …).
 
 Form field chrome (label, adornments, error) used by TextField, Select, and other inputs.
 
@@ -39,32 +39,33 @@ import { FormField } from "@bridge-ui/vue";
 
 ## Props
 
-| Prop               | Type                   | Default     | Description                                                                                                                                             |
-| ------------------ | ---------------------- | ----------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `classes`          | `FormFieldClasses`     | —           | Classes for the field chrome and the control (includes label, container, adornments).                                                                   |
-| `color`            | `FormFieldColor`       | "primary"   | The color to apply to the field control.                                                                                                                |
-| `controlId`        | `string`               | —           | Associates labels and helper text with a form control. When omitted, an id is generated automatically.                                                  |
-| `corner`           | `string`               | —           | Secondary label text at the inline end of the header row.                                                                                               |
-| `customProps`      | `FormFieldCustomProps` | —           | Extra props for internal parts (`header`, `label`, `input`, `container`, …).                                                                            |
-| `description`      | `string`               | —           | Helper text below the control (hidden when the field is invalid).                                                                                       |
-| `disabled`         | `boolean`              | `false`     | Whether the control is disabled.                                                                                                                        |
-| `end`              | `string`               | —           | Inline-end text inside the field (suffix), e.g. `@mail.com`.                                                                                            |
-| `endIcon`          | `LucideIcon`           | —           | Icon at the **inline end** (physical right in `ltr`, physical left in `rtl`).                                                                           |
-| `error`            | `boolean`              | `false`     | When `true`, applies invalid styling on the label and hides description.                                                                                |
-| `errorIcon`        | `LucideIcon`           | CircleAlert | Icon used when `showErrorIcon` is enabled and the field is invalid.                                                                                     |
-| `errorMessage`     | `string`               | —           | Error message below the control. Shown only when set (or via `#errorMessage` slot).                                                                     |
-| `field`            | `UseFormFieldReturn`   | —           | Pre-composed field API from a parent composable (e.g. `useTextField`). Used by `<FormField :field="…" />`; not set on field wrappers such as TextField. |
-| `hideErrorMessage` | `boolean`              | `false`     | When `true`, does not reserve space below the control for error messages.                                                                               |
-| `label`            | `string`               | —           | The primary label text above the control.                                                                                                               |
-| `readonly`         | `boolean`              | `false`     | Whether the control is read-only.                                                                                                                       |
-| `required`         | `boolean`              | `false`     | Shows a red asterisk on the label.                                                                                                                      |
-| `rounded`          | `FormFieldRounded`     | "md"        | The roundedness of the field control.                                                                                                                   |
-| `showErrorIcon`    | `boolean`              | `true`      | When `true` and the field is invalid, shows an error icon at the inline end when no `endIcon` or `end` slot is present.                                 |
-| `size`             | `FormFieldSize`        | "md"        | Typography scale for label, corner, description, and error message, and control sizing (input, container, icons).                                       |
-| `slots`            | `FormFieldSlots`       | —           | Chrome slots (`label`, `description`, `errorMessage`, …) via `#slot` or prop; inline adornments use `#start` / `#end`.                                  |
-| `start`            | `string`               | —           | Inline-start text inside the field (prefix), e.g. `https://`.                                                                                           |
-| `startIcon`        | `LucideIcon`           | —           | Icon at the **inline start** (physical left in `ltr`, physical right in `rtl`).                                                                         |
-| `variant`          | `FormFieldVariant`     | "outline"   | The visual variant of the field shell and control.                                                                                                      |
+| Prop                     | Type                   | Default     | Description                                                                                                                                             |
+| ------------------------ | ---------------------- | ----------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `classes`                | `FormFieldClasses`     | —           | Classes for the field chrome and the control (includes label, container, adornments).                                                                   |
+| `color`                  | `FormFieldColor`       | "primary"   | The color to apply to the field control.                                                                                                                |
+| `controlId`              | `string`               | —           | Associates labels and helper text with a form control. When omitted, an id is generated automatically.                                                  |
+| `corner`                 | `string`               | —           | Secondary label text at the inline end of the header row.                                                                                               |
+| `customProps`            | `FormFieldCustomProps` | —           | Extra props for internal parts (`header`, `label`, `input`, `container`, …).                                                                            |
+| `description`            | `string`               | —           | Helper text below the control. Hidden when `error` and an error message are set, unless `showDescriptionOnError`.                                       |
+| `disabled`               | `boolean`              | `false`     | Whether the control is disabled.                                                                                                                        |
+| `end`                    | `string`               | —           | Inline-end text inside the field (suffix), e.g. `@mail.com`.                                                                                            |
+| `endIcon`                | `LucideIcon`           | —           | Icon at the **inline end** (physical right in `ltr`, physical left in `rtl`).                                                                           |
+| `error`                  | `boolean`              | `false`     | When `true`, applies invalid styling on the label. Hides description when an error message is shown, unless `showDescriptionOnError`.                   |
+| `errorIcon`              | `LucideIcon`           | CircleAlert | Icon used when `showErrorIcon` is enabled and the field is invalid.                                                                                     |
+| `errorMessage`           | `string`               | —           | Error message below the control. Shown only when set (or via `#errorMessage` slot).                                                                     |
+| `field`                  | `UseFormFieldReturn`   | —           | Pre-composed field API from a parent composable (e.g. `useTextField`). Used by `<FormField :field="…" />`; not set on field wrappers such as TextField. |
+| `hideErrorMessage`       | `boolean`              | `false`     | When `true`, does not reserve the error row. That row is also omitted while a description is shown.                                                     |
+| `label`                  | `string`               | —           | The primary label text above the control.                                                                                                               |
+| `readonly`               | `boolean`              | `false`     | Whether the control is read-only.                                                                                                                       |
+| `required`               | `boolean`              | `false`     | Shows a red asterisk on the label.                                                                                                                      |
+| `rounded`                | `FormFieldRounded`     | "md"        | The roundedness of the field control.                                                                                                                   |
+| `showDescriptionOnError` | `boolean`              | `false`     | When `true`, keeps the description visible while the field is invalid.                                                                                  |
+| `showErrorIcon`          | `boolean`              | `true`      | When `true` and the field is invalid, shows an error icon at the inline end when no `endIcon` or `end` slot is present.                                 |
+| `size`                   | `FormFieldSize`        | "md"        | Typography scale for label, corner, description, and error message, and control sizing (input, container, icons).                                       |
+| `slots`                  | `FormFieldSlots`       | —           | Chrome slots (`label`, `description`, `errorMessage`, …) via `#slot` or prop; inline adornments use `#start` / `#end`.                                  |
+| `start`                  | `string`               | —           | Inline-start text inside the field (prefix), e.g. `https://`.                                                                                           |
+| `startIcon`              | `LucideIcon`           | —           | Icon at the **inline start** (physical left in `ltr`, physical right in `rtl`).                                                                         |
+| `variant`                | `FormFieldVariant`     | "outline"   | The visual variant of the field shell and control.                                                                                                      |
 
 ## Related components
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "type": "module",
   "license": "MIT",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "author": "BridgeUI",
   "sideEffects": false,
   "name": "@bridge-ui/vue",
@@ -89,7 +89,7 @@
     }
   },
   "dependencies": {
-    "@bridge-ui/core": "^0.7.0",
+    "@bridge-ui/core": "^0.8.0",
     "clsx": "^2.1.1",
     "es-toolkit": "^1.50.0",
     "tailwind-merge": "^3.6.0"