@navecss/base-ui 0.0.0-stage → 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Nave 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,188 @@
-# Temporary Holding Version
+# @navecss/base-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.
+NaveCSS styles Base UI's components with Nave's tokens: the same parts, the same props, pre-styled.
+
+This package is not affiliated with, endorsed by or sponsored by MUI or the Base UI project.
+
+`@base-ui/react` is a separately installed peer, built and maintained by its own maintainers; this package does not include it. You change `@base-ui/react/<component>` to `@navecss/base-ui/<component>` in your imports, add one stylesheet, and every part keeps Base UI's props, types, refs and behaviour while gaining Nave's styling. The styling is zero-runtime styling: static classes and one static stylesheet, with all behaviour still Base UI's.
+
+On this page: [Install](#install) · [Use it](#use-it) · [The stylesheet](#the-stylesheet) · [Variants](#variants) · [Overriding](#overriding) · [What is styled](#what-is-styled) · [Things to know](#things-to-know) · [License](#license)
+
+## Install
+
+```bash
+pnpm add @navecss/base-ui @navecss/tokens @base-ui/react react react-dom
+```
+
+```bash
+npm install @navecss/base-ui @navecss/tokens @base-ui/react react react-dom
+```
+
+It needs `@base-ui/react` 1.3 or later in the 1.x line, React 18 or 19, and `@navecss/tokens`. It does not need `@navecss/core`.
+
+## Use it
+
+Change the prefix of an import, and nothing else:
+
+```ts
+import { Dialog } from '@base-ui/react/dialog'
+```
+
+```tsx
+import { Dialog } from '@navecss/base-ui/dialog'
+
+export default function RenameDialog() {
+  return (
+    <Dialog.Root>
+      <Dialog.Trigger>Rename</Dialog.Trigger>
+      <Dialog.Portal>
+        <Dialog.Backdrop />
+        <Dialog.Popup>
+          <Dialog.Title>Rename file</Dialog.Title>
+          <Dialog.Description>Choose a new name for this file.</Dialog.Description>
+          <Dialog.Close>Done</Dialog.Close>
+        </Dialog.Popup>
+      </Dialog.Portal>
+    </Dialog.Root>
+  )
+}
+```
+
+Every subpath of Base UI that this package wraps is listed under [What is styled](#what-is-styled). Each one also re-exports every type Base UI exports there, so type imports change the same way. The package root, `@navecss/base-ui`, re-exports the same components.
+
+## The stylesheet
+
+Import Nave's tokens, then this package's stylesheet, before any stylesheet of yours that declares a `@layer`:
+
+```css
+/* app.css */
+@import url('@navecss/tokens/css');
+@import url('@navecss/base-ui/styles.css');
+```
+
+Both files begin with Nave's `@layer` order statement, and the order holds only if that statement is the first `@layer` declaration your page sees. The stylesheet is already built: nothing in your build needs to know about Nave, so it takes no plugin and no directive. Every rule in it sits in `@layer components.nave`, it declares no custom property and sets no `z-index`.
+
+Nave's colours need Chrome or Edge 125, Firefox 128 or Safari 18, and your CSS build has to target the same floor, or it rewrites the colours into a form that does not follow the page's colour scheme. In Vite:
+
+```text
+  build: { cssTarget: ['chrome125', 'edge125', 'firefox128', 'safari18', 'ios18'] },
+```
+
+[Why that floor](https://github.com/navecss/navecss/blob/main/docs/04-adr/0005-browser-floor.md).
+
+Tokens are CSS custom properties. If you scope a token yourself, set it on the part's own class or on `:root`, never on an ancestor of a part Base UI portals: a portalled popup renders outside that ancestor, so the token never reaches it.
+
+## Variants
+
+The Button family takes two optional props.
+
+| Prop      | Values                     | Default       |
+| --------- | -------------------------- | ------------- |
+| `variant` | `'secondary'`, `'primary'` | `'secondary'` |
+| `size`    | `'md'`, `'sm'`             | `'md'`        |
+
+They are accepted by `Button`, `Toolbar.Button`, and the trigger and close parts of Dialog and Popover, `Menu.Trigger` and `Tooltip.Trigger`. `Toggle` takes `size` only. Both are typed as those unions and neither reaches the DOM as a prop.
+
+```tsx
+import { Button } from '@navecss/base-ui/button'
+
+export default function SaveButton() {
+  return (
+    <Button variant="primary" size="sm">
+      Save
+    </Button>
+  )
+}
+```
+
+## Overriding
+
+There are three steps, from the lightest:
+
+1. **Tokens.** Re-theme with Nave's tokens and every part follows. Nothing else is needed for a different palette, radius or spacing.
+2. **`className`.** Pass a class to any part, as a string or as Base UI's function of the part's state. Put its rules in `@layer components.consumer`: that layer comes after Nave's, so your class wins in every state, whatever the specificity of Nave's rule. It also means that restyling a property restyles it in every state: set `background-color` on a Button and your colour replaces the `primary` variant's hover and active colours and a disabled button's too, so write the states you want yourself.
+3. **The raw Base UI part.** Import the part from `@base-ui/react/<component>` and style it from scratch. It mixes freely with wrapped parts.
+
+```css
+/* menu.module.css */
+@layer components.consumer {
+  .popup {
+    border-radius: var(--nave-radius-control);
+  }
+}
+```
+
+```tsx
+import { Menu } from '@navecss/base-ui/menu'
+
+export default function ActionsMenu() {
+  return (
+    <Menu.Root>
+      <Menu.Trigger>Actions</Menu.Trigger>
+      <Menu.Portal>
+        <Menu.Positioner>
+          <Menu.Popup className="popup">
+            <Menu.Item>Rename</Menu.Item>
+            <Menu.Item>Delete</Menu.Item>
+          </Menu.Popup>
+        </Menu.Positioner>
+      </Menu.Portal>
+    </Menu.Root>
+  )
+}
+```
+
+Behaviour is Base UI's. Parts Nave does not style, such as `Portal`, `Positioner`, `Provider` and `Form`, are Base UI's own parts, passed through unchanged.
+
+## What is styled
+
+| Group      | Subpaths                                                                                                                                                                                                                                                                                                                                                                                                                                     |
+| ---------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| Overlays   | `@navecss/base-ui/dialog`, `@navecss/base-ui/popover`, `@navecss/base-ui/menu`, `@navecss/base-ui/select`, `@navecss/base-ui/tooltip`                                                                                                                                                                                                                                                                                                        |
+| Disclosure | `@navecss/base-ui/accordion`, `@navecss/base-ui/collapsible`, `@navecss/base-ui/tabs`                                                                                                                                                                                                                                                                                                                                                        |
+| Controls   | `@navecss/base-ui/button`, `@navecss/base-ui/input`, `@navecss/base-ui/number-field`, `@navecss/base-ui/field`, `@navecss/base-ui/fieldset`, `@navecss/base-ui/form`, `@navecss/base-ui/checkbox`, `@navecss/base-ui/checkbox-group`, `@navecss/base-ui/radio`, `@navecss/base-ui/radio-group`, `@navecss/base-ui/switch`, `@navecss/base-ui/slider`, `@navecss/base-ui/toggle`, `@navecss/base-ui/toggle-group`, `@navecss/base-ui/toolbar` |
+
+Version 1 does not paint everything. It has no highlight on the hovered or arrowed item of a menu or select, no scrim colour behind a dialog (its backdrop has no paint, and this package recommends no value for one), no motion on popups, tooltips or the tab indicator, an arrow that sits on physical sides only (top, bottom, left and right, not the logical start and end), and no fill on a slider's range. Button comes in `secondary` and `primary`, in sizes `md` and `sm`, and no other. What it leaves out you can add with a class of your own, as above.
+
+## Things to know
+
+When a disclosure trigger's last child is an `svg`, that icon turns when the panel opens. A lone icon counts as the last child, so put a decorative leading icon inside an element of its own:
+
+```tsx
+import { Accordion } from '@navecss/base-ui/accordion'
+
+export default function ShippingAccordion() {
+  return (
+    <Accordion.Root>
+      <Accordion.Item value="shipping">
+        <Accordion.Header>
+          <Accordion.Trigger>
+            <span>
+              <svg viewBox="0 0 16 16" width="16" height="16" aria-hidden="true">
+                <circle cx="8" cy="8" r="6" />
+              </svg>
+            </span>
+            Shipping
+            <svg viewBox="0 0 16 16" width="16" height="16" aria-hidden="true">
+              <path d="M3 6l5 5 5-5" />
+            </svg>
+          </Accordion.Trigger>
+        </Accordion.Header>
+        <Accordion.Panel>Orders ship within two working days.</Accordion.Panel>
+      </Accordion.Item>
+    </Accordion.Root>
+  )
+}
+```
+
+The Accordion and Collapsible panels set `overflow: hidden` so their height can animate, which also clips anything drawn outside the panel's box, focus rings included. Each panel insets its content by enough for Nave's focus ring: at both sides, above its first element and below its last. That inset reaches elements only, so a panel that starts or ends with bare text gets none there, and your own margins on those elements replace it. Keep at least the width plus the offset of your focus ring clear around any focusable element at the panel's edge.
+
+When nothing inside a popup can take focus, Base UI focuses the popup itself and the browser draws its focus ring around the panel. This package leaves that ring alone. Removing it with `outline: 0`, as Base UI's own demos do, leaves a keyboard user with no visible sign of where focus is.
+
+In Base UI 1.8.0, `Menu.LinkItem` has no disabled state: a `disabled` prop reaches the `<a>` as a plain attribute, the link still activates, and it does not take the disabled colour Nave gives the other menu items.
+
+When the reader's system asks for reduced motion, this package turns off the motion of Accordion and Collapsible panels opening and closing, the turn of the icon in their triggers and the switch's slide, even if you have changed Nave's motion tokens. Motion you add or restyle yourself is yours to switch off.
+
+## License
+
+MIT. See [LICENSE](https://github.com/navecss/navecss/blob/main/packages/base-ui/LICENSE).

package/dist/accordion/index.d.ts

@@ -0,0 +1,2 @@
+export * as Accordion from './parts.generated.ts';
+export type * from '@base-ui/react/accordion';

package/dist/accordion/index.js

@@ -0,0 +1,2 @@
+'use client';
+export * as Accordion from "./parts.generated.js";

package/dist/accordion/parts.generated.d.ts

@@ -0,0 +1,31 @@
+import { Accordion as Base } from '@base-ui/react/accordion';
+export declare const Root: typeof Base.Root;
+export declare namespace Root {
+    type Value<TValue = any> = Base.Root.Value<TValue>;
+    type State<TValue = any> = Base.Root.State<TValue>;
+    type Props<TValue = any> = Base.Root.Props<TValue>;
+    type ChangeEventReason = Base.Root.ChangeEventReason;
+    type ChangeEventDetails = Base.Root.ChangeEventDetails;
+}
+export declare const Item: typeof Base.Item;
+export declare namespace Item {
+    type State = Base.Item.State;
+    type Props = Base.Item.Props;
+    type ChangeEventReason = Base.Item.ChangeEventReason;
+    type ChangeEventDetails = Base.Item.ChangeEventDetails;
+}
+export declare const Header: typeof Base.Header;
+export declare namespace Header {
+    type State = Base.Header.State;
+    type Props = Base.Header.Props;
+}
+export declare const Trigger: typeof Base.Trigger;
+export declare namespace Trigger {
+    type State = Base.Trigger.State;
+    type Props = Base.Trigger.Props;
+}
+export declare const Panel: typeof Base.Panel;
+export declare namespace Panel {
+    type State = Base.Panel.State;
+    type Props = Base.Panel.Props;
+}

package/dist/accordion/parts.generated.js

@@ -0,0 +1,9 @@
+'use client';
+// Generated by scripts/generate-wrappers.ts: change the roster or the generator, not this file.
+import { Accordion as Base } from '@base-ui/react/accordion';
+import { wrapPart } from "../part.js";
+export const Root = /*#__PURE__*/ (() => Base.Root)();
+export const Item = /*#__PURE__*/ (() => wrapPart(Base.Item, 'nave-base-ui-accordion-item'))();
+export const Header = /*#__PURE__*/ (() => wrapPart(Base.Header, 'nave-base-ui-accordion-header'))();
+export const Trigger = /*#__PURE__*/ (() => wrapPart(Base.Trigger, 'nave-base-ui-disclosure-trigger nave-base-ui-disclosure-icon'))();
+export const Panel = /*#__PURE__*/ (() => wrapPart(Base.Panel, 'nave-base-ui-accordion-panel'))();

package/dist/button/index.d.ts

@@ -0,0 +1,2 @@
+export { Button } from './parts.generated.ts';
+export type * from '@base-ui/react/button';

package/dist/button/index.js

@@ -0,0 +1,3 @@
+'use client';
+/* eslint-disable import-x/export -- the named export wins over the star re-export, as TypeScript has it */
+export { Button } from "./parts.generated.js";

package/dist/button/parts.generated.d.ts

@@ -0,0 +1,8 @@
+import type { ReactElement, RefAttributes } from 'react';
+import { Button as Base } from '@base-ui/react/button';
+import { type VariantProps } from '../part.ts';
+export declare const Button: (props: Omit<Base.Props, 'ref'> & RefAttributes<HTMLElement> & VariantProps) => ReactElement;
+export declare namespace Button {
+    type State = Base.State;
+    type Props = Base.Props & VariantProps;
+}

package/dist/button/parts.generated.js

@@ -0,0 +1,4 @@
+'use client';
+import { Button as Base } from '@base-ui/react/button';
+import { wrapVariantPart } from "../part.js";
+export const Button = /*#__PURE__*/ (() => wrapVariantPart(Base, 'nave-base-ui-button'))();

package/dist/checkbox/index.d.ts

@@ -0,0 +1,2 @@
+export * as Checkbox from './parts.generated.ts';
+export type * from '@base-ui/react/checkbox';

package/dist/checkbox/index.js

@@ -0,0 +1,2 @@
+'use client';
+export * as Checkbox from "./parts.generated.js";

package/dist/checkbox/parts.generated.d.ts

@@ -0,0 +1,13 @@
+import { Checkbox as Base } from '@base-ui/react/checkbox';
+export declare const Root: typeof Base.Root;
+export declare namespace Root {
+    type State = Base.Root.State;
+    type Props = Base.Root.Props;
+    type ChangeEventReason = Base.Root.ChangeEventReason;
+    type ChangeEventDetails = Base.Root.ChangeEventDetails;
+}
+export declare const Indicator: typeof Base.Indicator;
+export declare namespace Indicator {
+    type State = Base.Indicator.State;
+    type Props = Base.Indicator.Props;
+}

package/dist/checkbox/parts.generated.js

@@ -0,0 +1,6 @@
+'use client';
+// Generated by scripts/generate-wrappers.ts: change the roster or the generator, not this file.
+import { Checkbox as Base } from '@base-ui/react/checkbox';
+import { wrapPart } from "../part.js";
+export const Root = /*#__PURE__*/ (() => wrapPart(Base.Root, 'nave-base-ui-checkbox'))();
+export const Indicator = /*#__PURE__*/ (() => wrapPart(Base.Indicator, 'nave-base-ui-checkbox-indicator'))();

package/dist/checkbox-group/index.d.ts

@@ -0,0 +1,2 @@
+export { CheckboxGroup } from './parts.generated.ts';
+export type * from '@base-ui/react/checkbox-group';

package/dist/checkbox-group/index.js

@@ -0,0 +1,3 @@
+'use client';
+/* eslint-disable import-x/export -- the named export wins over the star re-export, as TypeScript has it */
+export { CheckboxGroup } from "./parts.generated.js";

package/dist/checkbox-group/parts.generated.d.ts

@@ -0,0 +1,8 @@
+import { CheckboxGroup as Base } from '@base-ui/react/checkbox-group';
+export declare const CheckboxGroup: typeof Base;
+export declare namespace CheckboxGroup {
+    type State = Base.State;
+    type Props = Base.Props;
+    type ChangeEventReason = Base.ChangeEventReason;
+    type ChangeEventDetails = Base.ChangeEventDetails;
+}

package/dist/checkbox-group/parts.generated.js

@@ -0,0 +1,5 @@
+'use client';
+// Generated by scripts/generate-wrappers.ts: change the roster or the generator, not this file.
+import { CheckboxGroup as Base } from '@base-ui/react/checkbox-group';
+import { wrapPart } from "../part.js";
+export const CheckboxGroup = /*#__PURE__*/ (() => wrapPart(Base, 'nave-base-ui-choice-group'))();

package/dist/collapsible/index.d.ts

@@ -0,0 +1,2 @@
+export * as Collapsible from './parts.generated.ts';
+export type * from '@base-ui/react/collapsible';

package/dist/collapsible/index.js

@@ -0,0 +1,2 @@
+'use client';
+export * as Collapsible from "./parts.generated.js";

package/dist/collapsible/parts.generated.d.ts

@@ -0,0 +1,18 @@
+import { Collapsible as Base } from '@base-ui/react/collapsible';
+export declare const Root: typeof Base.Root;
+export declare namespace Root {
+    type State = Base.Root.State;
+    type Props = Base.Root.Props;
+    type ChangeEventReason = Base.Root.ChangeEventReason;
+    type ChangeEventDetails = Base.Root.ChangeEventDetails;
+}
+export declare const Trigger: typeof Base.Trigger;
+export declare namespace Trigger {
+    type State = Base.Trigger.State;
+    type Props = Base.Trigger.Props;
+}
+export declare const Panel: typeof Base.Panel;
+export declare namespace Panel {
+    type State = Base.Panel.State;
+    type Props = Base.Panel.Props;
+}

package/dist/collapsible/parts.generated.js

@@ -0,0 +1,7 @@
+'use client';
+// Generated by scripts/generate-wrappers.ts: change the roster or the generator, not this file.
+import { Collapsible as Base } from '@base-ui/react/collapsible';
+import { wrapPart } from "../part.js";
+export const Root = /*#__PURE__*/ (() => Base.Root)();
+export const Trigger = /*#__PURE__*/ (() => wrapPart(Base.Trigger, 'nave-base-ui-disclosure-trigger nave-base-ui-disclosure-icon'))();
+export const Panel = /*#__PURE__*/ (() => wrapPart(Base.Panel, 'nave-base-ui-collapsible-panel'))();

package/dist/dialog/index.d.ts

@@ -0,0 +1,2 @@
+export * as Dialog from './parts.generated.ts';
+export type * from '@base-ui/react/dialog';

package/dist/dialog/index.js

@@ -0,0 +1,2 @@
+'use client';
+export * as Dialog from "./parts.generated.js";

package/dist/dialog/parts.generated.d.ts

@@ -0,0 +1,54 @@
+import type { ReactElement, RefAttributes } from 'react';
+import { Dialog as Base } from '@base-ui/react/dialog';
+import { type VariantProps } from '../part.ts';
+export declare const Backdrop: typeof Base.Backdrop;
+export declare namespace Backdrop {
+    type Props = Base.Backdrop.Props;
+    type State = Base.Backdrop.State;
+}
+export declare const Close: (props: Omit<Base.Close.Props, 'ref'> & RefAttributes<HTMLButtonElement> & VariantProps) => ReactElement;
+export declare namespace Close {
+    type Props = Base.Close.Props & VariantProps;
+    type State = Base.Close.State;
+}
+export declare const Description: typeof Base.Description;
+export declare namespace Description {
+    type Props = Base.Description.Props;
+    type State = Base.Description.State;
+}
+export declare const Popup: typeof Base.Popup;
+export declare namespace Popup {
+    type Props = Base.Popup.Props;
+    type State = Base.Popup.State;
+}
+export declare const Portal: typeof Base.Portal;
+export declare namespace Portal {
+    type State = Base.Portal.State;
+    type Props = Base.Portal.Props;
+}
+export declare const Root: typeof Base.Root;
+export declare namespace Root {
+    type State = Base.Root.State;
+    type Props<Payload = unknown> = Base.Root.Props<Payload>;
+    type Actions = Base.Root.Actions;
+    type ChangeEventReason = Base.Root.ChangeEventReason;
+    type ChangeEventDetails = Base.Root.ChangeEventDetails;
+}
+export declare const Viewport: typeof Base.Viewport;
+export declare namespace Viewport {
+    type State = Base.Viewport.State;
+    type Props = Base.Viewport.Props;
+}
+export declare const Title: typeof Base.Title;
+export declare namespace Title {
+    type Props = Base.Title.Props;
+    type State = Base.Title.State;
+}
+export declare const Trigger: <Payload>(props: Omit<Base.Trigger.Props<Payload>, 'ref'> & RefAttributes<HTMLElement> & VariantProps) => ReactElement;
+export declare namespace Trigger {
+    type Props<Payload = unknown> = Base.Trigger.Props<Payload> & VariantProps;
+    type State = Base.Trigger.State;
+}
+export declare const createHandle: typeof Base.createHandle;
+export declare const Handle: typeof Base.Handle;
+export type Handle<Payload> = Base.Handle<Payload>;

package/dist/dialog/parts.generated.js

@@ -0,0 +1,14 @@
+'use client';
+import { Dialog as Base } from '@base-ui/react/dialog';
+import { wrapPart, wrapVariantPart } from "../part.js";
+export const Backdrop = /*#__PURE__*/ (() => Base.Backdrop)();
+export const Close = /*#__PURE__*/ (() => wrapVariantPart(Base.Close, 'nave-base-ui-button'))();
+export const Description = /*#__PURE__*/ (() => wrapPart(Base.Description, 'nave-base-ui-description'))();
+export const Popup = /*#__PURE__*/ (() => wrapPart(Base.Popup, 'nave-base-ui-dialog-popup'))();
+export const Portal = /*#__PURE__*/ (() => Base.Portal)();
+export const Root = /*#__PURE__*/ (() => Base.Root)();
+export const Viewport = /*#__PURE__*/ (() => Base.Viewport)();
+export const Title = /*#__PURE__*/ (() => wrapPart(Base.Title, 'nave-base-ui-title'))();
+export const Trigger = /*#__PURE__*/ (() => wrapVariantPart(Base.Trigger, 'nave-base-ui-button'))();
+export const createHandle = /*#__PURE__*/ (() => Base.createHandle)();
+export const Handle = /*#__PURE__*/ (() => Base.Handle)();

package/dist/field/index.d.ts

@@ -0,0 +1,2 @@
+export * as Field from './parts.generated.ts';
+export type * from '@base-ui/react/field';

package/dist/field/index.js

@@ -0,0 +1,2 @@
+'use client';
+export * as Field from "./parts.generated.js";

package/dist/field/parts.generated.d.ts

@@ -0,0 +1,40 @@
+import { Field as Base } from '@base-ui/react/field';
+export declare const Root: typeof Base.Root;
+export declare namespace Root {
+    type State = Base.Root.State;
+    type Props = Base.Root.Props;
+    type Actions = Base.Root.Actions;
+}
+export declare const Label: typeof Base.Label;
+export declare namespace Label {
+    type State = Base.Label.State;
+    type Props = Base.Label.Props;
+}
+declare const FieldError: typeof Base.Error;
+declare namespace FieldError {
+    type State = Base.Error.State;
+    type Props = Base.Error.Props;
+}
+export { FieldError as Error };
+export declare const Description: typeof Base.Description;
+export declare namespace Description {
+    type State = Base.Description.State;
+    type Props = Base.Description.Props;
+}
+export declare const Control: typeof Base.Control;
+export declare namespace Control {
+    type State = Base.Control.State;
+    type Props = Base.Control.Props;
+    type ChangeEventReason = Base.Control.ChangeEventReason;
+    type ChangeEventDetails = Base.Control.ChangeEventDetails;
+}
+export declare const Validity: typeof Base.Validity;
+export declare namespace Validity {
+    type State = Base.Validity.State;
+    type Props = Base.Validity.Props;
+}
+export declare const Item: typeof Base.Item;
+export declare namespace Item {
+    type State = Base.Item.State;
+    type Props = Base.Item.Props;
+}

package/dist/field/parts.generated.js

@@ -0,0 +1,12 @@
+'use client';
+// Generated by scripts/generate-wrappers.ts: change the roster or the generator, not this file.
+import { Field as Base } from '@base-ui/react/field';
+import { wrapPart } from "../part.js";
+export const Root = /*#__PURE__*/ (() => wrapPart(Base.Root, 'nave-base-ui-field'))();
+export const Label = /*#__PURE__*/ (() => wrapPart(Base.Label, 'nave-base-ui-label'))();
+const FieldError = /*#__PURE__*/ (() => wrapPart(Base.Error, 'nave-base-ui-field-error'))();
+export { FieldError as Error };
+export const Description = /*#__PURE__*/ (() => wrapPart(Base.Description, 'nave-base-ui-field-description'))();
+export const Control = /*#__PURE__*/ (() => wrapPart(Base.Control, 'nave-base-ui-input'))();
+export const Validity = /*#__PURE__*/ (() => Base.Validity)();
+export const Item = /*#__PURE__*/ (() => Base.Item)();

package/dist/fieldset/index.d.ts

@@ -0,0 +1,2 @@
+export * as Fieldset from './parts.generated.ts';
+export type * from '@base-ui/react/fieldset';

package/dist/fieldset/index.js

@@ -0,0 +1,2 @@
+'use client';
+export * as Fieldset from "./parts.generated.js";

package/dist/fieldset/parts.generated.d.ts

@@ -0,0 +1,11 @@
+import { Fieldset as Base } from '@base-ui/react/fieldset';
+export declare const Root: typeof Base.Root;
+export declare namespace Root {
+    type State = Base.Root.State;
+    type Props = Base.Root.Props;
+}
+export declare const Legend: typeof Base.Legend;
+export declare namespace Legend {
+    type State = Base.Legend.State;
+    type Props = Base.Legend.Props;
+}

package/dist/fieldset/parts.generated.js

@@ -0,0 +1,6 @@
+'use client';
+// Generated by scripts/generate-wrappers.ts: change the roster or the generator, not this file.
+import { Fieldset as Base } from '@base-ui/react/fieldset';
+import { wrapPart } from "../part.js";
+export const Root = /*#__PURE__*/ (() => wrapPart(Base.Root, 'nave-base-ui-fieldset'))();
+export const Legend = /*#__PURE__*/ (() => wrapPart(Base.Legend, 'nave-base-ui-legend'))();

package/dist/form/index.d.ts

@@ -0,0 +1,2 @@
+export { Form } from './parts.generated.ts';
+export type * from '@base-ui/react/form';

package/dist/form/index.js

@@ -0,0 +1,3 @@
+'use client';
+/* eslint-disable import-x/export -- the named export wins over the star re-export, as TypeScript has it */
+export { Form } from "./parts.generated.js";

package/dist/form/parts.generated.d.ts

@@ -0,0 +1,11 @@
+import { Form as Base } from '@base-ui/react/form';
+export declare const Form: typeof Base;
+export declare namespace Form {
+    type Props<FormValues extends Record<string, any> = Record<string, any>> = Base.Props<FormValues>;
+    type State = Base.State;
+    type Actions = Base.Actions;
+    type ValidationMode = Base.ValidationMode;
+    type SubmitEventReason = Base.SubmitEventReason;
+    type SubmitEventDetails = Base.SubmitEventDetails;
+    type Values<FormValues extends Record<string, any> = Record<string, any>> = Base.Values<FormValues>;
+}

package/dist/form/parts.generated.js

@@ -0,0 +1,4 @@
+'use client';
+// Generated by scripts/generate-wrappers.ts: change the roster or the generator, not this file.
+import { Form as Base } from '@base-ui/react/form';
+export const Form = /*#__PURE__*/ (() => Base)();

package/dist/index.d.ts

@@ -0,0 +1,23 @@
+export * from './accordion/index.ts';
+export * from './button/index.ts';
+export * from './checkbox-group/index.ts';
+export * from './checkbox/index.ts';
+export * from './collapsible/index.ts';
+export * from './dialog/index.ts';
+export * from './field/index.ts';
+export * from './fieldset/index.ts';
+export * from './form/index.ts';
+export * from './input/index.ts';
+export * from './menu/index.ts';
+export * from './number-field/index.ts';
+export * from './popover/index.ts';
+export * from './radio-group/index.ts';
+export * from './radio/index.ts';
+export * from './select/index.ts';
+export * from './slider/index.ts';
+export * from './switch/index.ts';
+export * from './tabs/index.ts';
+export * from './toggle-group/index.ts';
+export * from './toggle/index.ts';
+export * from './toolbar/index.ts';
+export * from './tooltip/index.ts';

package/dist/index.js

@@ -0,0 +1,24 @@
+'use client';
+export * from "./accordion/index.js";
+export * from "./button/index.js";
+export * from "./checkbox-group/index.js";
+export * from "./checkbox/index.js";
+export * from "./collapsible/index.js";
+export * from "./dialog/index.js";
+export * from "./field/index.js";
+export * from "./fieldset/index.js";
+export * from "./form/index.js";
+export * from "./input/index.js";
+export * from "./menu/index.js";
+export * from "./number-field/index.js";
+export * from "./popover/index.js";
+export * from "./radio-group/index.js";
+export * from "./radio/index.js";
+export * from "./select/index.js";
+export * from "./slider/index.js";
+export * from "./switch/index.js";
+export * from "./tabs/index.js";
+export * from "./toggle-group/index.js";
+export * from "./toggle/index.js";
+export * from "./toolbar/index.js";
+export * from "./tooltip/index.js";