@wire-ui/solid 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Jerald Austero
+
+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

@@ -0,0 +1,341 @@
+<p align="center">
+  <img src="https://raw.githubusercontent.com/wire-ui/wire-ui/main/apps/docs/public/images/logo/wire-ui-logo.svg" alt="Wire UI" height="52" />
+</p>
+
+<h3 align="center">Wire UI — SolidJS</h3>
+
+<p align="center">
+  AI-native unstyled primitives framework. Headless, compound components with zero CSS.
+</p>
+
+<p align="center">
+  <a href="https://www.npmjs.com/package/@wire-ui/solid"><img src="https://img.shields.io/npm/v/@wire-ui/solid?style=flat-square&colorA=0a0a0a&colorB=0a0a0a" alt="npm version" /></a>
+  <a href="https://www.npmjs.com/package/@wire-ui/solid"><img src="https://img.shields.io/npm/dm/@wire-ui/solid?style=flat-square&colorA=0a0a0a&colorB=0a0a0a" alt="npm downloads" /></a>
+  <img src="https://img.shields.io/badge/solid--js-%3E%3D1.9.0-blue?style=flat-square&colorA=0a0a0a&colorB=0a0a0a" alt="solid-js >= 1.9" />
+  <a href="https://github.com/wire-ui/wire-ui/blob/main/packages/solid/LICENSE"><img src="https://img.shields.io/badge/license-MIT-blue?style=flat-square&colorA=0a0a0a&colorB=0a0a0a" alt="MIT license" /></a>
+</p>
+
+---
+
+## What is Wire UI?
+
+Wire UI is an AI-native, headless component library. Every component ships with **zero CSS** — style everything using your own classes by targeting `data-*` attributes that reflect interactive state. AI-integrated docs with `llms.txt` and machine-readable API references make it built for AI-assisted workflows.
+
+- **AI-native.** AI-integrated docs with `llms.txt`, machine-readable API references, and MCP server support. Built for AI-assisted development.
+- **Unstyled primitives.** No colors, spacing, or fonts baked in. You own every pixel of your design.
+- **Compound components.** Complex widgets follow the `Component.Part` pattern, giving you full control over markup structure and element nesting.
+- **State via `data-*` attributes.** Hover, focus, pressed, disabled, open — all exposed as `data-hover`, `data-focus-visible`, `data-active`, etc.
+- **`asChild` polymorphism.** Merge all behaviour onto your own element — perfect for router links, icon buttons, and custom wrappers.
+- **Consumer-owned validation.** Form components expose `invalidType` and `errorMessage` but never validate internally. Your logic, your rules.
+
+> **Solid edition.** This is the SolidJS port of `@wire-ui/react`, targeting **Solid 1.9**. Behaviour and data-attribute APIs match the React package exactly. See the [Solid-specific notes](#solid-specific-notes) below for the small idiomatic differences.
+
+## Documentation
+
+Full documentation with live examples is at **[wire-ui.com](https://wire-ui.com)**.
+
+---
+
+## Installation
+
+```bash
+npm install @wire-ui/solid
+```
+
+**Peer requirement**
+
+```json
+{
+  "solid-js": ">=1.9.0"
+}
+```
+
+---
+
+## Quick start
+
+```tsx
+import { Button } from '@wire-ui/solid'
+
+export default function App() {
+  return (
+    <Button
+      class="
+        px-4 py-2 rounded-lg bg-indigo-600 text-white font-medium
+        [data-hover]:bg-indigo-700
+        [data-active]:scale-95
+        [data-focus-visible]:ring-2 [data-focus-visible]:ring-indigo-500
+        [data-disabled]:opacity-40 [data-disabled]:cursor-not-allowed
+      "
+    >
+      Save changes
+    </Button>
+  )
+}
+```
+
+---
+
+## Components
+
+### Form inputs
+
+| Component | Description |
+|---|---|
+| `Input` | Text input with label, error, and success states |
+| `Textarea` | Multi-line input with the same compound API as Input |
+| `Password` | Input with a built-in show/hide toggle |
+| `Checkbox` | Group and individual checkbox items |
+| `Radio` | Single-selection radio group |
+| `Switch` | Toggle on/off with a thumb element |
+| `OTP` | One-time password input with individual slots |
+| `Select` | Accessible select menu with groups and separators |
+| `Search` | Search input with keyboard-navigable results list |
+
+### Overlay & dialog
+
+| Component | Description |
+|---|---|
+| `Modal` | Dialog with portal rendering, overlay click-to-close, and Escape key |
+| `Drawer` | Side-panel dialog — same structure as Modal |
+| `Dropdown` | Trigger + floating menu with click-outside support |
+| `Tooltip` | Hover/focus tooltip with configurable delay and side |
+
+### Layout & navigation
+
+| Component | Description |
+|---|---|
+| `Accordion` | Collapsible sections — `single` or `multiple` open mode |
+| `Divider` | Horizontal or vertical separator |
+
+### Display
+
+| Component | Description |
+|---|---|
+| `Alert` | Dismissible alert with optional auto-dismiss |
+| `Avatar` | Image with a text/initial fallback |
+| `Badge` | Numeric count badge, capped at 9+ |
+| `Card` | Container with optional color and size variants |
+| `Icon` | SVG renderer from a consumer-supplied icon map |
+| `Image` | Image with a loading placeholder |
+| `List` | Ordered/unordered list with optional dividers and striping |
+| `ProgressBar` | Accessible progress indicator |
+| `Rating` | Interactive or read-only star rating |
+| `Timeago` | Relative or formatted timestamp that updates live |
+
+---
+
+## Key concepts
+
+### Data attributes
+
+Attributes are present as an **empty string** when active, and **absent** when not — never `"true"` or `"false"`.
+
+| Attribute | When present |
+|---|---|
+| `data-hover` | Mouse is over the element |
+| `data-focus-visible` | Keyboard focus (mirrors `:focus-visible`) |
+| `data-active` | Element is being pressed |
+| `data-disabled` | Element is disabled |
+| `data-state` | Open/closed, checked/unchecked — varies per component |
+| `data-invalid` | Consumer-controlled via `invalidType` |
+| `data-success` | Consumer-controlled via `isSuccess` |
+
+Style them in Tailwind:
+
+```tsx
+<Button class="[data-hover]:bg-blue-700 [data-active]:scale-95 [data-disabled]:opacity-50">
+```
+
+Or in plain CSS:
+
+```css
+button[data-hover]  { background: #1d4ed8; }
+button[data-active] { transform: scale(0.95); }
+```
+
+### Compound components
+
+Complex widgets follow the `Component.Part` pattern so you control the structure:
+
+```tsx
+import { createSignal } from 'solid-js'
+import { Input } from '@wire-ui/solid'
+
+function EmailField() {
+  const [email, setEmail] = createSignal('')
+  const [error, setError] = createSignal('')
+
+  return (
+    <Input.Root value={email()} onChange={setEmail} invalidType={error()}>
+      <Input.Label>Email</Input.Label>
+      <Input.Field type="email" placeholder="you@example.com" />
+      <Input.Error />
+    </Input.Root>
+  )
+}
+```
+
+### `asChild` polymorphism
+
+Pass `asChild` to merge behaviour onto your own element. The component evaluates the child to a DOM node and applies its `data-*` attributes and event listeners imperatively, so the child element renders as-is:
+
+```tsx
+// Renders as <a> but with all Button data attributes
+<Button asChild>
+  <a href="/dashboard">Go to dashboard</a>
+</Button>
+```
+
+### Consumer-owned validation
+
+Set `invalidType` to a key and the component renders the matching error message — no internal validation ever runs:
+
+```tsx
+<Input.Root
+  invalidType={error()}            // e.g. "required" or "email"
+  errorMessage={{
+    required: 'Email is required',
+    email: 'Enter a valid email address',
+  }}
+>
+  <Input.Field type="email" />
+  <Input.Error />   {/* renders the matching message */}
+</Input.Root>
+```
+
+---
+
+## Primitives
+
+### `createInteractiveState`
+
+The same primitive used internally by `Button`, `Accordion.Trigger`, `Modal.Close`, and the rest — exported for building your own interactive elements. Pass an options object with a `disabled` getter to keep the value reactive:
+
+```tsx
+import { createInteractiveState } from '@wire-ui/solid'
+
+function MyCard(props: { disabled?: boolean }) {
+  const state = createInteractiveState({
+    get disabled() { return !!props.disabled },
+  })
+
+  return (
+    <div
+      {...state.handlers}
+      {...state.dataAttributes}
+      class="[data-hover]:bg-gray-100 [data-active]:scale-95"
+    >
+      Card content
+    </div>
+  )
+}
+```
+
+### `createClickOutside`
+
+Fires a callback when the user clicks outside a referenced element. Pass a getter accessor so the listener picks up ref changes:
+
+```tsx
+import { createSignal } from 'solid-js'
+import { createClickOutside } from '@wire-ui/solid'
+
+function Popover() {
+  const [, setOpen] = createSignal(true)
+  let rootEl: HTMLDivElement | undefined
+
+  createClickOutside(() => rootEl, () => setOpen(false))
+
+  return <div ref={rootEl}>Popover content</div>
+}
+```
+
+---
+
+## Solid-specific notes
+
+`@wire-ui/solid` mirrors the React package's behaviour and data-attribute API exactly. The differences are idiomatic to Solid:
+
+- **`class`, not `className`.** Solid uses the native HTML `class` attribute throughout.
+- **`createSignal` over `useState`.** Same controlled/uncontrolled pattern, just with accessors.
+- **Primitives instead of hooks.** `useInteractiveState` → `createInteractiveState`, `useClickOutside` → `createClickOutside`.
+- **No `forwardRef`.** Refs are passed as plain props or callbacks in Solid 1.x.
+- **`Show` / `For` instead of conditional / array rendering.** Necessary because Solid components run once at setup time.
+- **`Portal` from `solid-js/web`.** Used internally by Modal and Drawer in place of `react-dom`'s `createPortal`.
+- **Reactive options.** Where React passes plain values (e.g. `useInteractiveState({ disabled })`), the Solid equivalent expects either a static value or an object with a `get disabled()` getter so reactivity is preserved.
+
+Targets **Solid 1.9** — Solid 2.0 is in beta as of March 2026; this package will track the 1.x line until 2.0 stabilises and a 2.x release lands.
+
+---
+
+## TypeScript
+
+All component props and utility types are exported:
+
+```ts
+import type {
+  ButtonProps,
+  InputRootProps,
+  TextareaRootProps,
+  PasswordRootProps,
+  ModalRootProps,
+  AccordionRootProps,
+  SearchOption,
+  IconName,
+  IconSize,
+  Size,
+  Status,
+  InteractiveStateOptions,
+  InteractiveStateResult,
+} from '@wire-ui/solid'
+```
+
+---
+
+## Development
+
+```bash
+# Install dependencies (from monorepo root)
+npm install
+
+# Run Storybook
+npm run storybook
+
+# Unit tests (watch mode)
+npm test
+
+# Unit tests (single run)
+npm run test:run
+
+# Unit tests with coverage
+npm run test:coverage
+
+# Type check + build
+npm run build
+
+# Lint
+npm run lint
+
+# Format
+npm run format
+```
+
+---
+
+## Community
+
+- Follow on X: [@wireuijs](https://x.com/wireuijs)
+
+## Authors
+
+- Jerald Austero ([@jaoaustero](https://github.com/jaoaustero))
+
+---
+
+## Contributing
+
+See the [contributing guide](../../CONTRIBUTING.md) for local development instructions and pull request guidelines.
+
+## License
+
+MIT License © 2026 Wire UI. See [LICENSE](./LICENSE) for details.

package/dist/components/accordion/Accordion.d.ts

@@ -0,0 +1,13 @@
+import { JSX } from 'solid-js';
+import { AccordionContentProps, AccordionItemProps, AccordionRootProps, AccordionTriggerProps } from './Accordion.types';
+declare function Root(props: AccordionRootProps): JSX.Element;
+declare function Item(props: AccordionItemProps): JSX.Element;
+declare function Trigger(props: AccordionTriggerProps): JSX.Element;
+declare function Content(props: AccordionContentProps): JSX.Element;
+export declare const Accordion: {
+    Root: typeof Root;
+    Item: typeof Item;
+    Trigger: typeof Trigger;
+    Content: typeof Content;
+};
+export {};

package/dist/components/accordion/Accordion.types.d.ts

@@ -0,0 +1,48 @@
+import { JSX } from 'solid-js';
+export interface AccordionContextValue {
+    isOpen: (value: string) => boolean;
+    toggle: (value: string) => void;
+    readonly disabled: boolean;
+}
+export interface AccordionItemContextValue {
+    value: string;
+    readonly isOpen: boolean;
+    readonly disabled: boolean;
+}
+interface AccordionRootBase extends Omit<JSX.HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    /** Disables all items */
+    disabled?: boolean;
+}
+export interface AccordionRootSingleProps extends AccordionRootBase {
+    type: 'single';
+    /** Controlled open value */
+    value?: string;
+    /** Initial open value (uncontrolled) */
+    defaultValue?: string;
+    /** Called when the open item changes */
+    onChange?: (value: string) => void;
+    /** Allow closing the open item by clicking it again (default: false) */
+    collapsible?: boolean;
+}
+export interface AccordionRootMultipleProps extends AccordionRootBase {
+    type: 'multiple';
+    /** Controlled open values */
+    value?: string[];
+    /** Initial open values (uncontrolled) */
+    defaultValue?: string[];
+    /** Called when open items change */
+    onChange?: (value: string[]) => void;
+}
+export type AccordionRootProps = AccordionRootSingleProps | AccordionRootMultipleProps;
+export interface AccordionItemProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    /** Unique identifier — must match the value used in Root */
+    value: string;
+    /** Disables this item only */
+    disabled?: boolean;
+}
+export type AccordionTriggerProps = JSX.ButtonHTMLAttributes<HTMLButtonElement>;
+export interface AccordionContentProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    /** Keep content mounted in the DOM even when closed (useful for CSS animations) */
+    forceMount?: boolean;
+}
+export {};

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

@@ -0,0 +1,2 @@
+export { Accordion } from './Accordion';
+export type { AccordionRootProps, AccordionRootSingleProps, AccordionRootMultipleProps, AccordionItemProps, AccordionTriggerProps, AccordionContentProps, } from './Accordion.types';

package/dist/components/alert/Alert.d.ts

@@ -0,0 +1,30 @@
+import { JSX } from 'solid-js';
+import { AlertDescriptionProps, AlertDismissProps, AlertRootProps, AlertTitleProps } from './Alert.types';
+/**
+ * The container for the Alert. Manages dismissal state and exposes:
+ * - `data-status` — for styling by status ('success', 'warning', 'danger', etc.)
+ *
+ * Renders nothing once dismissed.
+ *
+ * @example
+ * <Alert.Root status="success" isAutoDismissable onDismiss={() => console.log('dismissed')}>
+ *   <Alert.Title>Success!</Alert.Title>
+ *   <Alert.Description>Your changes were saved.</Alert.Description>
+ *   <Alert.Dismiss aria-label="Close" />
+ * </Alert.Root>
+ */
+declare function Root(props: AlertRootProps): JSX.Element;
+declare function Title(props: AlertTitleProps): JSX.Element;
+declare function Description(props: AlertDescriptionProps): JSX.Element;
+/**
+ * The dismiss button. Fires the Root's dismiss handler when clicked.
+ * Tracks hover/focus-visible/active state via data attributes.
+ */
+declare function Dismiss(props: AlertDismissProps): JSX.Element;
+export declare const Alert: {
+    Root: typeof Root;
+    Title: typeof Title;
+    Description: typeof Description;
+    Dismiss: typeof Dismiss;
+};
+export {};

package/dist/components/alert/Alert.types.d.ts

@@ -0,0 +1,25 @@
+import { JSX } from 'solid-js';
+/**
+ * Alert Component Types
+ */
+export type AlertContextValue = {
+    readonly status?: string;
+    dismiss: () => void;
+};
+/** Props for Alert.Root — the container. */
+export interface AlertRootProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    /** Status data attribute for styling: 'success' | 'warning' | 'danger' or any string */
+    status?: string;
+    /** Auto-dismiss after timeout */
+    isAutoDismissable?: boolean;
+    /** Milliseconds before auto-dismiss (default: 3000) */
+    dismissCountdown?: number;
+    /** Fired when the alert is dismissed */
+    onDismiss?: () => void;
+}
+/** Props for Alert.Title */
+export type AlertTitleProps = JSX.HTMLAttributes<HTMLParagraphElement>;
+/** Props for Alert.Description */
+export type AlertDescriptionProps = JSX.HTMLAttributes<HTMLParagraphElement>;
+/** Props for Alert.Dismiss — the close button */
+export type AlertDismissProps = JSX.ButtonHTMLAttributes<HTMLButtonElement>;

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

@@ -0,0 +1,2 @@
+export { Alert } from './Alert';
+export type { AlertRootProps, AlertTitleProps, AlertDescriptionProps, AlertDismissProps } from './Alert.types';

package/dist/components/avatar/Avatar.d.ts

@@ -0,0 +1,35 @@
+import { JSX } from 'solid-js';
+import { AvatarFallbackProps, AvatarImageProps, AvatarRootProps } from './Avatar.types';
+/**
+ * The container for the Avatar. Exposes `data-status` reflecting the current
+ * image load state: `"loading"`, `"loaded"`, or `"error"`.
+ *
+ * @example
+ * <Avatar.Root class="...">
+ *   <Avatar.Image src="..." alt="Jane Doe" />
+ *   <Avatar.Fallback>JD</Avatar.Fallback>
+ * </Avatar.Root>
+ */
+declare function Root(props: AvatarRootProps): JSX.Element;
+/**
+ * The avatar image. Automatically reports its load state back to `Avatar.Root`
+ * via context — the Root's `data-status` updates to `"loaded"` or `"error"`.
+ *
+ * Hidden (not rendered) when `src` is empty/undefined so the Fallback shows
+ * immediately without a broken-image icon.
+ */
+declare function AvatarImage(props: AvatarImageProps): JSX.Element;
+/**
+ * Rendered when the image is still loading or has failed.
+ * Supply `delayMs` to avoid a flash of the fallback during fast loads.
+ *
+ * @example
+ * <Avatar.Fallback delayMs={300}>JD</Avatar.Fallback>
+ */
+declare function Fallback(props: AvatarFallbackProps): JSX.Element;
+export declare const Avatar: typeof Root & {
+    Root: typeof Root;
+    Image: typeof AvatarImage;
+    Fallback: typeof Fallback;
+};
+export {};

package/dist/components/avatar/Avatar.types.d.ts

@@ -0,0 +1,29 @@
+import { JSX } from 'solid-js';
+/**
+ * Avatar Component Types
+ */
+/**
+ * Image load status shared via context between Avatar sub-components.
+ */
+export type AvatarImageStatus = 'loading' | 'loaded' | 'error';
+/**
+ * Props for Avatar.Root — the wrapping container element.
+ * Exposes `data-status` reflecting the current image load state.
+ */
+export type AvatarRootProps = JSX.HTMLAttributes<HTMLDivElement>;
+/**
+ * Props for Avatar.Image — the actual `<img>` element.
+ * Automatically tracks load/error state and updates the Root's `data-status`.
+ */
+export type AvatarImageProps = JSX.ImgHTMLAttributes<HTMLImageElement>;
+/**
+ * Props for Avatar.Fallback — rendered when the image is loading or failed.
+ */
+export interface AvatarFallbackProps extends JSX.HTMLAttributes<HTMLSpanElement> {
+    /**
+     * Delay in milliseconds before the fallback becomes visible.
+     * Useful to avoid a flash of the fallback during fast image loads.
+     * @default 0
+     */
+    delayMs?: number;
+}

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

@@ -0,0 +1,2 @@
+export { Avatar } from './Avatar';
+export type { AvatarRootProps, AvatarImageProps, AvatarFallbackProps, AvatarImageStatus } from './Avatar.types';

package/dist/components/badge/Badge.d.ts

@@ -0,0 +1,3 @@
+import { BadgeProps } from './Badge.types';
+declare function Badge(props: BadgeProps): import("solid-js").JSX.Element;
+export { Badge };

package/dist/components/badge/Badge.types.d.ts

@@ -0,0 +1,14 @@
+import { JSX } from 'solid-js';
+/**
+ * Badge Component Types
+ *
+ * Type definitions for the Badge component including props
+ * and related types.
+ */
+/**
+ * Props interface for Badge component
+ */
+export interface BadgeProps extends JSX.HTMLAttributes<HTMLSpanElement> {
+    /** Count of notifications. Displays "9+" when count exceeds 9. */
+    count?: number;
+}

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

@@ -0,0 +1,2 @@
+export { Badge } from './Badge';
+export type { BadgeProps } from './Badge.types';

package/dist/components/button/Button.d.ts

@@ -0,0 +1,4 @@
+import { JSX } from 'solid-js';
+import { ButtonProps } from './Button.types';
+declare function Button(props: ButtonProps): JSX.Element;
+export { Button };

package/dist/components/button/Button.types.d.ts

@@ -0,0 +1,26 @@
+import { JSX } from 'solid-js';
+/**
+ * Button Component Types
+ */
+/**
+ * Props for the Button component.
+ *
+ * When `asChild` is true, the component renders the child element as-is and
+ * applies its data-attributes / event listeners imperatively — useful for
+ * rendering as a router link, anchor, etc. The child must be a single element.
+ *
+ * When `asChild` is false (default), renders a native `<button>` element.
+ */
+export interface ButtonProps extends JSX.ButtonHTMLAttributes<HTMLButtonElement> {
+    /**
+     * When true, renders the child element directly instead of a `<button>`,
+     * applying data-state attributes and interactive-state event listeners to
+     * that element. The child must be a single element.
+     *
+     * @example
+     * <Button asChild>
+     *   <a href="/about">About</a>
+     * </Button>
+     */
+    asChild?: boolean;
+}

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

@@ -0,0 +1,2 @@
+export { Button } from './Button';
+export type { ButtonProps } from './Button.types';

package/dist/components/card/Card.d.ts

@@ -0,0 +1,3 @@
+import { CardProps } from './Card.types';
+declare function Card(props: CardProps): import("solid-js").JSX.Element;
+export { Card };

package/dist/components/card/Card.types.d.ts

@@ -0,0 +1,18 @@
+import { JSX } from 'solid-js';
+/**
+ * Card Component Types
+ *
+ * Type definitions for the Card component including props
+ * and related types.
+ */
+/**
+ * Props interface for Card component
+ */
+export interface CardProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    /** Color modifier for the card */
+    color?: string;
+    /** Size modifier that controls padding around the card */
+    size?: string;
+    /** Card content */
+    children?: JSX.Element;
+}

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

@@ -0,0 +1,2 @@
+export { Card } from './Card';
+export type { CardProps } from './Card.types';

package/dist/components/checkbox/Checkbox.d.ts

@@ -0,0 +1,13 @@
+import { JSX } from 'solid-js';
+import { CheckboxIndicatorProps, CheckboxItemProps, CheckboxLabelProps, CheckboxRootProps } from './Checkbox.types';
+declare function Root(props: CheckboxRootProps): JSX.Element;
+declare function Item(props: CheckboxItemProps): JSX.Element;
+declare function Indicator(props: CheckboxIndicatorProps): JSX.Element;
+declare function Label(props: CheckboxLabelProps): JSX.Element;
+export declare const Checkbox: {
+    Root: typeof Root;
+    Item: typeof Item;
+    Indicator: typeof Indicator;
+    Label: typeof Label;
+};
+export {};