@cladd-ui/react 0.9.0 → 0.11.0

package/components/TabPanel.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useComponentDefaults } from '../hooks/use-component-defaults.js';
+import { cn } from '../shared/cn.js';
+import { tabId, tabPanelId, useTabsContext } from './TabsContext.js';
+/**
+ * The content area for a tab. Renders a single unstyled element carrying the
+ * `tabpanel` role and the aria wiring back to its `Tab`; all extra props pass
+ * through to it so it can be styled. Mounts its children only when its `value`
+ * is selected (or always, when `keepMounted`).
+ */
+export const TabPanel = (props) => {
+    const { value: selectedValue, baseId } = useTabsContext();
+    const { children, className = '', value, keepMounted = false, as: Component = 'div', ref, ...rest } = useComponentDefaults('TabPanel', props);
+    const selected = selectedValue === value;
+    if (!selected && !keepMounted)
+        return null;
+    return (_jsx(Component, { role: "tabpanel", id: tabPanelId(baseId, value), "aria-labelledby": tabId(baseId, value), hidden: !selected || undefined, tabIndex: 0, "data-selected": selected || undefined, className: cn('cladd-tab-panel', className), ref: ref, ...rest, children: children }));
+};
+//# sourceMappingURL=TabPanel.js.map

package/components/TabPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabPanel.js","sourceRoot":"","sources":["../../../src/components/TabPanel.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AA6BlE;;;;;GAKG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,CACtB,KAAuB,EACvB,EAAE;IACF,MAAM,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,EAAE,GAAG,cAAc,EAAE,CAAC;IAC1D,MAAM,EACJ,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,KAAK,EACL,WAAW,GAAG,KAAK,EACnB,EAAE,EAAE,SAAS,GAAG,KAAyB,EACzC,GAAG,EACH,GAAG,IAAI,EACR,GAAG,oBAAoB,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;IAE5C,MAAM,QAAQ,GAAG,aAAa,KAAK,KAAK,CAAC;IACzC,IAAI,CAAC,QAAQ,IAAI,CAAC,WAAW;QAAE,OAAO,IAAI,CAAC;IAE3C,OAAO,CACL,KAAC,SAAS,IACR,IAAI,EAAC,UAAU,EACf,EAAE,EAAE,UAAU,CAAC,MAAM,EAAE,KAAK,CAAC,qBACZ,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,EACrC,MAAM,EAAE,CAAC,QAAQ,IAAI,SAAS,EAC9B,QAAQ,EAAE,CAAC,mBACI,QAAQ,IAAI,SAAS,EACpC,SAAS,EAAE,EAAE,CAAC,iBAAiB,EAAE,SAAS,CAAC,EAC3C,GAAG,EAAE,GAAG,KACJ,IAAI,YAEP,QAAQ,GACC,CACb,CAAC;AACJ,CAAC,CAAC"}

package/components/Tabs.d.ts

@@ -0,0 +1,33 @@
+import { ReactNode } from 'react';
+interface TabsOwnProps {
+    /** The tab strip (`TabsList` with `Tab`s) and the `TabPanel`s. */
+    children?: ReactNode;
+    /** Controlled selected tab value. When provided, internal state is bypassed. */
+    value?: string;
+    /** Initially selected tab value (uncontrolled). Ignored when `value` is provided. */
+    defaultValue?: string;
+    /** Fires whenever the selected tab changes (click or keyboard). */
+    onValueChange?: (value: string) => void;
+}
+export type TabsProps = TabsOwnProps;
+/** Shape of `Tabs` defaults that can be supplied via `CladdProvider`'s `defaults` prop. */
+export type TabsDefaultProps = Partial<Omit<TabsOwnProps, 'children' | 'value' | 'defaultValue' | 'onValueChange'>>;
+/**
+ * Stateful, non-visual root for a set of tabs. Owns the selected value
+ * (controlled via `value`/`onValueChange` or uncontrolled via `defaultValue`)
+ * and publishes it to `TabsList`/`Tab`/`TabPanel` through context - it renders
+ * no DOM of its own.
+ *
+ * @example
+ * <Tabs defaultValue="overview">
+ *   <TabsList>
+ *     <Tab value="overview">Overview</Tab>
+ *     <Tab value="activity">Activity</Tab>
+ *   </TabsList>
+ *   <TabPanel value="overview">…</TabPanel>
+ *   <TabPanel value="activity">…</TabPanel>
+ * </Tabs>
+ */
+export declare const Tabs: (props: TabsProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Tabs.d.ts.map

package/components/Tabs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAmB,MAAM,OAAO,CAAC;AAKnD,UAAU,YAAY;IACpB,kEAAkE;IAClE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,gFAAgF;IAChF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qFAAqF;IACrF,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mEAAmE;IACnE,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED,MAAM,MAAM,SAAS,GAAG,YAAY,CAAC;AAErC,2FAA2F;AAC3F,MAAM,MAAM,gBAAgB,GAAG,OAAO,CACpC,IAAI,CAAC,YAAY,EAAE,UAAU,GAAG,OAAO,GAAG,cAAc,GAAG,eAAe,CAAC,CAC5E,CAAC;AAEF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,IAAI,GAAI,OAAO,SAAS,4CAwBpC,CAAC"}

package/components/Tabs.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useId, useState } from 'react';
+import { useComponentDefaults } from '../hooks/use-component-defaults.js';
+import { TabsContextProvider } from './TabsContext.js';
+/**
+ * Stateful, non-visual root for a set of tabs. Owns the selected value
+ * (controlled via `value`/`onValueChange` or uncontrolled via `defaultValue`)
+ * and publishes it to `TabsList`/`Tab`/`TabPanel` through context - it renders
+ * no DOM of its own.
+ *
+ * @example
+ * <Tabs defaultValue="overview">
+ *   <TabsList>
+ *     <Tab value="overview">Overview</Tab>
+ *     <Tab value="activity">Activity</Tab>
+ *   </TabsList>
+ *   <TabPanel value="overview">…</TabPanel>
+ *   <TabPanel value="activity">…</TabPanel>
+ * </Tabs>
+ */
+export const Tabs = (props) => {
+    const baseId = useId();
+    const { children, value: valueProp, defaultValue, onValueChange, } = useComponentDefaults('Tabs', props);
+    const [internalValue, setInternalValue] = useState(defaultValue);
+    const isControlled = valueProp !== undefined;
+    const value = isControlled ? valueProp : internalValue;
+    const setValue = (next) => {
+        if (next === value)
+            return;
+        if (!isControlled)
+            setInternalValue(next);
+        onValueChange?.(next);
+    };
+    return (_jsx(TabsContextProvider, { value: { value, setValue, baseId }, children: children }));
+};
+//# sourceMappingURL=Tabs.js.map

package/components/Tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../src/components/Tabs.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAa,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAC;AAoBpD;;;;;;;;;;;;;;;GAeG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,KAAgB,EAAE,EAAE;IACvC,MAAM,MAAM,GAAG,KAAK,EAAE,CAAC;IACvB,MAAM,EACJ,QAAQ,EACR,KAAK,EAAE,SAAS,EAChB,YAAY,EACZ,aAAa,GACd,GAAG,oBAAoB,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;IAExC,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;IACjE,MAAM,YAAY,GAAG,SAAS,KAAK,SAAS,CAAC;IAC7C,MAAM,KAAK,GAAG,YAAY,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,aAAa,CAAC;IAEvD,MAAM,QAAQ,GAAG,CAAC,IAAY,EAAE,EAAE;QAChC,IAAI,IAAI,KAAK,KAAK;YAAE,OAAO;QAC3B,IAAI,CAAC,YAAY;YAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;QAC1C,aAAa,EAAE,CAAC,IAAI,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,mBAAmB,IAAC,KAAK,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,YACpD,QAAQ,GACW,CACvB,CAAC;AACJ,CAAC,CAAC"}

package/components/TabsContext.d.ts

@@ -0,0 +1,25 @@
+import { ReactNode } from 'react';
+/**
+ * Selection state published by `Tabs` to its descendant `TabsList`, `Tab`, and `TabPanel`.
+ *
+ * Each reads it via `useTabsContext()` - `Tab` to derive its `active` state and wire selection, `TabPanel` to decide whether to mount.
+ */
+interface TabsContextValue {
+    /** Currently selected tab value (`undefined` when nothing is selected). */
+    value: string | undefined;
+    /** Select a tab by its `value`. No-ops when the value is already selected. */
+    setValue: (value: string) => void;
+    /** Stable id used to wire `aria-controls`/`aria-labelledby` between tabs and panels. */
+    baseId: string;
+}
+export declare function useTabsContext(): TabsContextValue;
+export declare function TabsContextProvider(props: {
+    value: TabsContextValue;
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+/** Id of the `Tab` button for a given value, within a `Tabs` instance. */
+export declare const tabId: (baseId: string, value: string) => string;
+/** Id of the `TabPanel` for a given value, within a `Tabs` instance. */
+export declare const tabPanelId: (baseId: string, value: string) => string;
+export {};
+//# sourceMappingURL=TabsContext.d.ts.map

package/components/TabsContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabsContext.d.ts","sourceRoot":"","sources":["../../../src/components/TabsContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA6B,SAAS,EAAE,MAAM,OAAO,CAAC;AAE7D;;;;GAIG;AACH,UAAU,gBAAgB;IACxB,2EAA2E;IAC3E,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,8EAA8E;IAC9E,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,wFAAwF;IACxF,MAAM,EAAE,MAAM,CAAC;CAChB;AAID,wBAAgB,cAAc,IAAI,gBAAgB,CAQjD;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE;IACzC,KAAK,EAAE,gBAAgB,CAAC;IACxB,QAAQ,EAAE,SAAS,CAAC;CACrB,2CAMA;AAED,0EAA0E;AAC1E,eAAO,MAAM,KAAK,GAAI,QAAQ,MAAM,EAAE,OAAO,MAAM,WACzB,CAAC;AAE3B,wEAAwE;AACxE,eAAO,MAAM,UAAU,GAAI,QAAQ,MAAM,EAAE,OAAO,MAAM,WAC5B,CAAC"}

package/components/TabsContext.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext } from 'react';
+const TabsContext = createContext(null);
+export function useTabsContext() {
+    const ctx = useContext(TabsContext);
+    if (!ctx) {
+        throw new Error('Cladd: `TabsList`, `Tab` and `TabPanel` must be rendered inside a `Tabs` root.');
+    }
+    return ctx;
+}
+export function TabsContextProvider(props) {
+    return (_jsx(TabsContext.Provider, { value: props.value, children: props.children }));
+}
+/** Id of the `Tab` button for a given value, within a `Tabs` instance. */
+export const tabId = (baseId, value) => `${baseId}-tab-${value}`;
+/** Id of the `TabPanel` for a given value, within a `Tabs` instance. */
+export const tabPanelId = (baseId, value) => `${baseId}-panel-${value}`;
+//# sourceMappingURL=TabsContext.js.map

package/components/TabsContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabsContext.js","sourceRoot":"","sources":["../../../src/components/TabsContext.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAa,MAAM,OAAO,CAAC;AAgB7D,MAAM,WAAW,GAAG,aAAa,CAA0B,IAAI,CAAC,CAAC;AAEjE,MAAM,UAAU,cAAc;IAC5B,MAAM,GAAG,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IACpC,IAAI,CAAC,GAAG,EAAE,CAAC;QACT,MAAM,IAAI,KAAK,CACb,gFAAgF,CACjF,CAAC;IACJ,CAAC;IACD,OAAO,GAAG,CAAC;AACb,CAAC;AAED,MAAM,UAAU,mBAAmB,CAAC,KAGnC;IACC,OAAO,CACL,KAAC,WAAW,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,CAAC,KAAK,YACrC,KAAK,CAAC,QAAQ,GACM,CACxB,CAAC;AACJ,CAAC;AAED,0EAA0E;AAC1E,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,MAAc,EAAE,KAAa,EAAE,EAAE,CACrD,GAAG,MAAM,QAAQ,KAAK,EAAE,CAAC;AAE3B,wEAAwE;AACxE,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,MAAc,EAAE,KAAa,EAAE,EAAE,CAC1D,GAAG,MAAM,UAAU,KAAK,EAAE,CAAC"}

package/components/TabsList.d.ts

@@ -0,0 +1,12 @@
+import { ElementType } from 'react';
+import { SegmentedProps } from './Segmented.js';
+export type TabsListProps<C extends ElementType = 'div'> = SegmentedProps<C>;
+/** Shape of `TabsList` defaults that can be supplied via `CladdProvider`'s `defaults` prop. */
+export type TabsListDefaultProps = Partial<Omit<SegmentedProps, 'as' | 'ref' | 'children'>>;
+/**
+ * The tab strip. Renders a `Segmented` (so it inherits the full segmented look
+ * and all its `color`/`variant`/`active*` knobs) and layers on `role="tablist"`
+ * plus arrow-key navigation. Children are `Tab`s.
+ */
+export declare const TabsList: <C extends ElementType = "div">(props: TabsListProps<C>) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=TabsList.d.ts.map

package/components/TabsList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabsList.d.ts","sourceRoot":"","sources":["../../../src/components/TabsList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAqB,MAAM,OAAO,CAAC;AAGvD,OAAO,EAAa,cAAc,EAAE,MAAM,aAAa,CAAC;AAGxD,MAAM,MAAM,aAAa,CAAC,CAAC,SAAS,WAAW,GAAG,KAAK,IAAI,cAAc,CAAC,CAAC,CAAC,CAAC;AAE7E,+FAA+F;AAC/F,MAAM,MAAM,oBAAoB,GAAG,OAAO,CACxC,IAAI,CAAC,cAAc,EAAE,IAAI,GAAG,KAAK,GAAG,UAAU,CAAC,CAChD,CAAC;AA0CF;;;;GAIG;AACH,eAAO,MAAM,QAAQ,GAAI,CAAC,SAAS,WAAW,GAAG,KAAK,EACpD,OAAO,aAAa,CAAC,CAAC,CAAC,4CAoBxB,CAAC"}

package/components/TabsList.js

@@ -0,0 +1,52 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useComponentDefaults } from '../hooks/use-component-defaults.js';
+import { Segmented } from './Segmented.js';
+import { useTabsContext } from './TabsContext.js';
+/**
+ * Moves focus and selection between tabs with the arrow / Home / End keys
+ * (automatic activation). Skips disabled tabs and wraps around the ends.
+ */
+function onTabsKeyDown(e, setValue) {
+    if (!['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(e.key))
+        return;
+    const container = e.currentTarget;
+    const tabs = Array.from(container.querySelectorAll('[role="tab"]')).filter((tab) => tab.getAttribute('data-disabled') == null);
+    if (tabs.length === 0)
+        return;
+    const active = container.ownerDocument.activeElement;
+    const currentIndex = active ? tabs.indexOf(active) : -1;
+    let nextIndex;
+    switch (e.key) {
+        case 'ArrowRight':
+            nextIndex = (currentIndex + 1 + tabs.length) % tabs.length;
+            break;
+        case 'ArrowLeft':
+            nextIndex = (currentIndex - 1 + tabs.length) % tabs.length;
+            break;
+        case 'Home':
+            nextIndex = 0;
+            break;
+        default:
+            nextIndex = tabs.length - 1;
+    }
+    e.preventDefault();
+    const next = tabs[nextIndex];
+    if (next.dataset.value != null)
+        setValue(next.dataset.value);
+    next.focus();
+}
+/**
+ * The tab strip. Renders a `Segmented` (so it inherits the full segmented look
+ * and all its `color`/`variant`/`active*` knobs) and layers on `role="tablist"`
+ * plus arrow-key navigation. Children are `Tab`s.
+ */
+export const TabsList = (props) => {
+    const { setValue } = useTabsContext();
+    const { onKeyDown, ...rest } = useComponentDefaults('TabsList', props);
+    const SegmentedEl = Segmented;
+    return (_jsx(SegmentedEl, { ...rest, role: "tablist", "aria-orientation": "horizontal", onKeyDown: (e) => {
+            onKeyDown?.(e);
+            onTabsKeyDown(e, setValue);
+        } }));
+};
+//# sourceMappingURL=TabsList.js.map

package/components/TabsList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabsList.js","sourceRoot":"","sources":["../../../src/components/TabsList.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,SAAS,EAAkB,MAAM,aAAa,CAAC;AACxD,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAS/C;;;GAGG;AACH,SAAS,aAAa,CACpB,CAA6B,EAC7B,QAAiC;IAEjC,IAAI,CAAC,CAAC,WAAW,EAAE,YAAY,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC;QAAE,OAAO;IAExE,MAAM,SAAS,GAAG,CAAC,CAAC,aAAa,CAAC;IAClC,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,CACrB,SAAS,CAAC,gBAAgB,CAAc,cAAc,CAAC,CACxD,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,YAAY,CAAC,eAAe,CAAC,IAAI,IAAI,CAAC,CAAC;IAC7D,IAAI,IAAI,CAAC,MAAM,KAAK,CAAC;QAAE,OAAO;IAE9B,MAAM,MAAM,GAAG,SAAS,CAAC,aAAa,CAAC,aAAmC,CAAC;IAC3E,MAAM,YAAY,GAAG,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAExD,IAAI,SAAiB,CAAC;IACtB,QAAQ,CAAC,CAAC,GAAG,EAAE,CAAC;QACd,KAAK,YAAY;YACf,SAAS,GAAG,CAAC,YAAY,GAAG,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC;YAC3D,MAAM;QACR,KAAK,WAAW;YACd,SAAS,GAAG,CAAC,YAAY,GAAG,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC;YAC3D,MAAM;QACR,KAAK,MAAM;YACT,SAAS,GAAG,CAAC,CAAC;YACd,MAAM;QACR;YACE,SAAS,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC;IAChC,CAAC;IAED,CAAC,CAAC,cAAc,EAAE,CAAC;IACnB,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC;IAC7B,IAAI,IAAI,CAAC,OAAO,CAAC,KAAK,IAAI,IAAI;QAAE,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAC7D,IAAI,CAAC,KAAK,EAAE,CAAC;AACf,CAAC;AAED;;;;GAIG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,CACtB,KAAuB,EACvB,EAAE;IACF,MAAM,EAAE,QAAQ,EAAE,GAAG,cAAc,EAAE,CAAC;IACtC,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,GAAG,oBAAoB,CACjD,UAAU,EACV,KAAK,CACY,CAAC;IACpB,MAAM,WAAW,GAAG,SAA+B,CAAC;IAEpD,OAAO,CACL,KAAC,WAAW,OACN,IAAI,EACR,IAAI,EAAC,SAAS,sBACG,YAAY,EAC7B,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE;YACf,SAAS,EAAE,CAAC,CAAC,CAAC,CAAC;YACf,aAAa,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC;QAC7B,CAAC,GACD,CACH,CAAC;AACJ,CAAC,CAAC"}

package/components/Textarea.d.ts

@@ -57,6 +57,8 @@ interface TextareaOwnProps<C extends ElementType = 'div'> {
     errorMessage?: ReactNode;
     /** Icon node rendered absolutely positioned on the left. */
     icon?: ReactNode;
+    /** Extra classes for the icon wrapper. */
+    iconClassName?: string;
     /** Reserved - currently not applied in the rendered output. */
     inputPadding?: string;
 }

package/components/Textarea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea.tsx"],"names":[],"mappings":"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"}

package/components/Textarea.js

@@ -5,11 +5,11 @@ import { useComponentDefaults } from '../hooks/use-component-defaults.js';
 import { cn } from '../shared/cn.js';
 import { roundedClasses } from '../shared/rounded-classes.js';
 import { rootSizeClasses } from '../shared/size-utls.js';
-import { FocusableLayer } from './FocusableLayer.js';
+import { FocusRing } from './FocusRing.js';
 import { SurfaceCut } from './SurfaceCut.js';
 export const Textarea = (props) => {
     const accentColor = useAccentColor();
-    const { as: asProp = 'div', ref: externalRef, value, placeholder, disabled = false, readOnly, rounded = false, size = 'lg', onChange = () => { }, onKeyDown = () => { }, onFocus = () => { }, onBlur = () => { }, color = accentColor, prefix, suffix, updateContentOnChange = true, className, contentClassName, inputClassName, placeholderClassName = '', valid = true, infoMessage, errorMessage, icon, ...rest } = useComponentDefaults('Textarea', props);
+    const { as: asProp = 'div', ref: externalRef, value, placeholder, disabled = false, readOnly, rounded = false, size = 'lg', onChange = () => { }, onKeyDown = () => { }, onFocus = () => { }, onBlur = () => { }, color = accentColor, prefix, suffix, updateContentOnChange = true, className, contentClassName, inputClassName, placeholderClassName = '', valid = true, infoMessage, errorMessage, icon, iconClassName = '', ...rest } = useComponentDefaults('Textarea', props);
     const fontSizes = {
         sm: 'text-cladd-xs',
         md: 'text-cladd-xs',
@@ -71,6 +71,6 @@ export const Textarea = (props) => {
         }
     }, [value]);
     const SurfaceCutComponent = SurfaceCut;
-    return (_jsxs(SurfaceCutComponent, { ...rest, as: asProp, ref: externalRef, "data-disabled": disabled || undefined, "data-readonly": readOnly || undefined, "data-invalid": valid === false || undefined, hoverable: !disabled && !readOnly, wrapContent: false, className: cn('cladd-textarea group/cladd-textarea relative', disabled && 'opacity-50', itemRoundedClasses, className), children: [!readOnly && !disabled && (_jsx(FocusableLayer, { className: cn(focusRoundedClasses), force: valid === false, color: valid === false ? 'red' : color, group: "textarea" })), _jsxs("div", { "data-part": "wrapper", onContextMenuCapture: (e) => e.preventDefault(), className: cn('relative flex items-center', contentClassName), children: [prefix, icon && (_jsx("div", { "data-part": "icon", className: cn('pointer-events-none absolute', iconWrapClasses[size]), children: icon })), _jsxs("div", { className: "relative flex w-full", children: [_jsx("div", { "data-part": "control", contentEditable: !disabled && !readOnly, ref: inputElRef, className: cn(inputPadding, height, itemRoundedClasses, fontSizes[size], 'w-full appearance-none border-none bg-transparent font-medium shadow-none outline-none', disabled && 'text-cladd-fg-softer', inputClassName), onPaste: onPaste, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, onInput: onInput }), !text && placeholder && (_jsx("div", { "data-part": "placeholder", className: cn('pointer-events-none absolute top-0 left-0 h-full w-full text-cladd-fg-softer select-none', fontSizes[size], inputPadding, placeholderClassName), children: placeholder }))] }), suffix] }), infoMessage && valid !== false && !readOnly && (_jsx("div", { "data-part": "info", className: cn(`cladd-color-${color}`, 'pointer-events-none absolute -top-1.5 left-2 z-10 translate-y-1 rounded-cladd-sm bg-cladd-primary px-2 py-1.5 text-cladd-2xs leading-none font-semibold text-cladd-on-primary opacity-0 duration-200 group-has-[[contenteditable]:focus]/cladd-textarea:-translate-y-1/2 group-has-[[contenteditable]:focus]/cladd-textarea:opacity-100'), children: infoMessage })), errorMessage && valid === false && (_jsx("div", { "data-part": "error", className: cn('cladd-color-red pointer-events-none absolute -top-1.5 left-2 z-10 -translate-y-1/2 rounded-cladd-sm bg-cladd-primary px-1 py-0.5 text-cladd-2xs leading-none font-semibold text-cladd-on-primary opacity-100 duration-200'), children: errorMessage }))] }));
+    return (_jsxs(SurfaceCutComponent, { ...rest, as: asProp, ref: externalRef, "data-disabled": disabled || undefined, "data-readonly": readOnly || undefined, "data-invalid": valid === false || undefined, hoverable: !disabled && !readOnly, wrapContent: false, className: cn('cladd-textarea group/cladd-textarea relative', disabled && 'opacity-50', itemRoundedClasses, className), children: [!readOnly && !disabled && (_jsx(FocusRing, { className: cn(focusRoundedClasses), force: valid === false, color: valid === false ? 'red' : color, group: "textarea" })), _jsxs("div", { "data-part": "wrapper", onContextMenuCapture: (e) => e.preventDefault(), className: cn('relative flex items-center', contentClassName), children: [prefix, icon && (_jsx("div", { "data-part": "icon", className: cn('pointer-events-none absolute', iconWrapClasses[size], iconClassName), children: icon })), _jsxs("div", { className: "relative flex w-full", children: [_jsx("div", { "data-part": "control", contentEditable: !disabled && !readOnly, ref: inputElRef, className: cn(inputPadding, height, itemRoundedClasses, fontSizes[size], 'w-full appearance-none border-none bg-transparent font-medium shadow-none outline-none', disabled && 'text-cladd-fg-softer', inputClassName), onPaste: onPaste, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, onInput: onInput }), !text && placeholder && (_jsx("div", { "data-part": "placeholder", className: cn('pointer-events-none absolute top-0 left-0 h-full w-full text-cladd-fg-softer select-none', fontSizes[size], inputPadding, placeholderClassName), children: placeholder }))] }), suffix] }), infoMessage && valid !== false && !readOnly && (_jsx("div", { "data-part": "info", className: cn(`cladd-color-${color}`, 'pointer-events-none absolute -top-1.5 left-2 z-10 translate-y-1 rounded-cladd-sm bg-cladd-primary px-2 py-1.5 text-cladd-2xs leading-none font-semibold text-cladd-on-primary opacity-0 duration-200 group-has-[[contenteditable]:focus]/cladd-textarea:-translate-y-1/2 group-has-[[contenteditable]:focus]/cladd-textarea:opacity-100'), children: infoMessage })), errorMessage && valid === false && (_jsx("div", { "data-part": "error", className: cn('cladd-color-red pointer-events-none absolute -top-1.5 left-2 z-10 -translate-y-1/2 rounded-cladd-sm bg-cladd-primary px-1 py-0.5 text-cladd-2xs leading-none font-semibold text-cladd-on-primary opacity-100 duration-200'), children: errorMessage }))] }));
 };
 //# sourceMappingURL=Textarea.js.map

package/components/Textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.js","sourceRoot":"","sources":["../../../src/components/Textarea.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Textarea.js","sourceRoot":"","sources":["../../../src/components/Textarea.tsx"],"names":[],"mappings":"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"}

package/components/ThemeContext.d.ts

@@ -1,9 +1,16 @@
 import { ReactNode } from 'react';
 import { Color } from '../types.js';
+import type { AccordionItemDefaultProps } from './AccordionItem.js';
+import type { AccordionRootDefaultProps } from './AccordionRoot.js';
 import type { BackdropDefaultProps } from './Backdrop.js';
 import type { ButtonDefaultProps } from './Button.js';
 import type { CheckboxDefaultProps } from './Checkbox.js';
 import type { ChipDefaultProps } from './Chip.js';
+import type { CollapsibleIndicatorDefaultProps } from './CollapsibleIndicator.js';
+import type { CollapsiblePanelDefaultProps } from './CollapsiblePanel.js';
+import type { CollapsibleRootDefaultProps } from './CollapsibleRoot.js';
+import type { ColorEditorDefaultProps } from './ColorEditor.js';
+import type { ColorPickerDefaultProps } from './ColorPicker.js';
 import type { DialogDefaultProps } from './Dialog.js';
 import type { InputDefaultProps } from './Input.js';
 import type { LinkDefaultProps } from './Link.js';
@@ -34,8 +41,14 @@ import type { SurfaceContentDefaultProps } from './SurfaceContent.js';
 import type { SurfaceCutDefaultProps } from './SurfaceCut.js';
 import type { SurfaceCutContentDefaultProps } from './SurfaceCutContent.js';
 import type { SwitchDefaultProps } from './Switch.js';
+import type { TabDefaultProps } from './Tab.js';
+import type { TabPanelDefaultProps } from './TabPanel.js';
+import type { TabsDefaultProps } from './Tabs.js';
+import type { TabsListDefaultProps } from './TabsList.js';
 import type { TextareaDefaultProps } from './Textarea.js';
 import type { ToastDefaultProps } from './Toast.js';
+import type { ToggleButtonDefaultProps } from './ToggleButton.js';
+import type { ToggleGroupDefaultProps } from './ToggleGroup.js';
 import type { ToolbarDefaultProps } from './Toolbar.js';
 import type { ToolbarButtonDefaultProps } from './ToolbarButton.js';
 import type { ToolbarSeparatorDefaultProps } from './ToolbarSeparator.js';
@@ -51,10 +64,17 @@ import type { TooltipPrimitiveDefaultProps } from './TooltipPrimitive.js';
  * Add new entries here as additional components opt into context defaults.
  */
 export interface ComponentDefaults {
+    AccordionRoot?: AccordionRootDefaultProps;
+    AccordionItem?: AccordionItemDefaultProps;
     Backdrop?: BackdropDefaultProps;
     Button?: ButtonDefaultProps;
     Checkbox?: CheckboxDefaultProps;
     Chip?: ChipDefaultProps;
+    ColorEditor?: ColorEditorDefaultProps;
+    ColorPicker?: ColorPickerDefaultProps;
+    CollapsibleRoot?: CollapsibleRootDefaultProps;
+    CollapsiblePanel?: CollapsiblePanelDefaultProps;
+    CollapsibleIndicator?: CollapsibleIndicatorDefaultProps;
     Dialog?: DialogDefaultProps;
     Input?: InputDefaultProps;
     Link?: LinkDefaultProps;
@@ -85,8 +105,14 @@ export interface ComponentDefaults {
     SurfaceCut?: SurfaceCutDefaultProps;
     SurfaceCutContent?: SurfaceCutContentDefaultProps;
     Switch?: SwitchDefaultProps;
+    Tabs?: TabsDefaultProps;
+    TabsList?: TabsListDefaultProps;
+    Tab?: TabDefaultProps;
+    TabPanel?: TabPanelDefaultProps;
     Textarea?: TextareaDefaultProps;
     Toast?: ToastDefaultProps;
+    ToggleGroup?: ToggleGroupDefaultProps;
+    ToggleButton?: ToggleButtonDefaultProps;
     Toolbar?: ToolbarDefaultProps;
     ToolbarButton?: ToolbarButtonDefaultProps;
     ToolbarSeparator?: ToolbarSeparatorDefaultProps;

package/components/ThemeContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeContext.d.ts","sourceRoot":"","sources":["../../../src/components/ThemeContext.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"ThemeContext.d.ts","sourceRoot":"","sources":["../../../src/components/ThemeContext.tsx"],"names":[],"mappings":"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"}

package/components/ThemeContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeContext.js","sourceRoot":"","sources":["../../../src/components/ThemeContext.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAa,MAAM,OAAO,CAAC;AAwGjD,MAAM,CAAC,MAAM,YAAY,GAAG,aAAa,CAAoB;IAC3D,KAAK,EAAE,MAAM;IACb,WAAW,EAAE,OAAO;IACpB,YAAY,EAAE,sBAAsB;IACpC,QAAQ,EAAE,EAAE;CACb,CAAC,CAAC;AAEH;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAC5B,QAAQ,EACR,KAAK,EACL,WAAW,EACX,YAAY,EACZ,QAAQ,GAYT,EAAE,EAAE;IACH,OAAO,CACL,KAAC,YAAY,CAAC,QAAQ,IACpB,KAAK,EAAE;YACL,KAAK;YACL,WAAW;YACX,YAAY,EAAE,YAAY,IAAI,sBAAsB;YACpD,QAAQ,EAAE,QAAQ,IAAI,EAAE;SACzB,YAEA,QAAQ,GACa,CACzB,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"ThemeContext.js","sourceRoot":"","sources":["../../../src/components/ThemeContext.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAa,MAAM,OAAO,CAAC;AAkIjD,MAAM,CAAC,MAAM,YAAY,GAAG,aAAa,CAAoB;IAC3D,KAAK,EAAE,MAAM;IACb,WAAW,EAAE,OAAO;IACpB,YAAY,EAAE,sBAAsB;IACpC,QAAQ,EAAE,EAAE;CACb,CAAC,CAAC;AAEH;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAC5B,QAAQ,EACR,KAAK,EACL,WAAW,EACX,YAAY,EACZ,QAAQ,GAYT,EAAE,EAAE;IACH,OAAO,CACL,KAAC,YAAY,CAAC,QAAQ,IACpB,KAAK,EAAE;YACL,KAAK;YACL,WAAW;YACX,YAAY,EAAE,YAAY,IAAI,sBAAsB;YACpD,QAAQ,EAAE,QAAQ,IAAI,EAAE;SACzB,YAEA,QAAQ,GACa,CACzB,CAAC;AACJ,CAAC,CAAC"}

package/components/ToggleButton.d.ts

@@ -0,0 +1,44 @@
+import { ElementType, MouseEvent } from 'react';
+import { Color } from '../types.js';
+import { SegmentedButtonProps } from './SegmentedButton.js';
+import { SurfaceVariant } from './Surface.js';
+interface ToggleButtonOwnProps {
+    /**
+     * Identifies this button inside a `ToggleGroup` - matched against the group's selection.
+     *
+     * Omit when using the button standalone.
+     */
+    value?: string;
+    /** Controlled pressed state for **standalone** use. Ignored inside a `ToggleGroup`. */
+    selected?: boolean;
+    /** Initial pressed state for **standalone** use (uncontrolled). Ignored inside a `ToggleGroup`. */
+    defaultSelected?: boolean;
+    /**
+     * Fires with the next pressed state on click. Standalone only - inside a `ToggleGroup` use the group's `onValueChange` instead.
+     */
+    onChange?: (selected: boolean, event: MouseEvent) => void;
+    /** Accent color applied while **pressed**. Default: theme accent (or the group's `activeColor`). */
+    activeColor?: Color;
+    /** `Surface` variant applied while **pressed**. Default `'gradient'`. */
+    activeVariant?: SurfaceVariant;
+    /** Outline ring while **pressed**. Default `true`. */
+    activeOutline?: boolean;
+}
+export type ToggleButtonProps<C extends ElementType = 'button'> = ToggleButtonOwnProps & Omit<SegmentedButtonProps<C>, 'active' | keyof ToggleButtonOwnProps>;
+/** Shape of `ToggleButton` defaults that can be supplied via `CladdProvider`'s `defaults` prop. */
+export type ToggleButtonDefaultProps = Partial<Omit<ToggleButtonProps, 'as' | 'ref' | 'children' | 'value' | 'selected' | 'defaultSelected'>>;
+/**
+ * A two-state (pressed / not) button. Looks like a single `SegmentedButton` -
+ * transparent when idle, accent gradient when pressed - and exposes
+ * `aria-pressed`.
+ *
+ * Works both ways:
+ * - **Inside a `ToggleGroup`**: identify it with `value`; the group owns the
+ *   selection and the button derives its pressed state and styling from it.
+ * - **Standalone**: owns its own state (controlled via `selected`/`onChange` or
+ *   uncontrolled via `defaultSelected`) - handy for toolbar controls like
+ *   bold/italic/pin.
+ */
+export declare const ToggleButton: <C extends ElementType = "button">(props: ToggleButtonProps<C>) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=ToggleButton.d.ts.map

package/components/ToggleButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToggleButton.d.ts","sourceRoot":"","sources":["../../../src/components/ToggleButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAM,UAAU,EAAY,MAAM,OAAO,CAAC;AAI9D,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AACjC,OAAO,EAAmB,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAK1E,OAAO,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAI3C,UAAU,oBAAoB;IAC5B;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uFAAuF;IACvF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mGAAmG;IACnG,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,KAAK,IAAI,CAAC;IAC1D,oGAAoG;IACpG,WAAW,CAAC,EAAE,KAAK,CAAC;IACpB,yEAAyE;IACzE,aAAa,CAAC,EAAE,cAAc,CAAC;IAC/B,sDAAsD;IACtD,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,MAAM,MAAM,iBAAiB,CAAC,CAAC,SAAS,WAAW,GAAG,QAAQ,IAC5D,oBAAoB,GAClB,IAAI,CAAC,oBAAoB,CAAC,CAAC,CAAC,EAAE,QAAQ,GAAG,MAAM,oBAAoB,CAAC,CAAC;AAEzE,mGAAmG;AACnG,MAAM,MAAM,wBAAwB,GAAG,OAAO,CAC5C,IAAI,CACF,iBAAiB,EACjB,IAAI,GAAG,KAAK,GAAG,UAAU,GAAG,OAAO,GAAG,UAAU,GAAG,iBAAiB,CACrE,CACF,CAAC;AAEF;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,YAAY,GAAI,CAAC,SAAS,WAAW,GAAG,QAAQ,EAC3D,OAAO,iBAAiB,CAAC,CAAC,CAAC,4CAyE5B,CAAC"}

package/components/ToggleButton.js

@@ -0,0 +1,66 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState } from 'react';
+import { useAccentColor } from '../hooks/use-accent-color.js';
+import { useComponentDefaults } from '../hooks/use-component-defaults.js';
+import { SegmentedButton } from './SegmentedButton.js';
+import { SegmentedContextProvider, useSegmentedContext, } from './SegmentedContext.js';
+import { useToggleGroupContext } from './ToggleGroupContext.js';
+import { useToolbarContext } from './ToolbarContext.js';
+/**
+ * A two-state (pressed / not) button. Looks like a single `SegmentedButton` -
+ * transparent when idle, accent gradient when pressed - and exposes
+ * `aria-pressed`.
+ *
+ * Works both ways:
+ * - **Inside a `ToggleGroup`**: identify it with `value`; the group owns the
+ *   selection and the button derives its pressed state and styling from it.
+ * - **Standalone**: owns its own state (controlled via `selected`/`onChange` or
+ *   uncontrolled via `defaultSelected`) - handy for toolbar controls like
+ *   bold/italic/pin.
+ */
+export const ToggleButton = (props) => {
+    const accentColor = useAccentColor();
+    const { size: toolbarSize, rounded: toolbarRounded } = useToolbarContext();
+    const group = useToggleGroupContext();
+    const seg = useSegmentedContext();
+    const { value, selected: selectedProp, defaultSelected = false, onChange, activeColor, activeVariant, activeOutline, color, variant, outline, size, rounded, onClick, ...rest } = useComponentDefaults('ToggleButton', props);
+    const [internalSelected, setInternalSelected] = useState(defaultSelected);
+    const selected = group
+        ? group.multiple
+            ? Array.isArray(group.value) &&
+                value != null &&
+                group.value.includes(value)
+            : group.value === value
+        : selectedProp !== undefined
+            ? selectedProp
+            : internalSelected;
+    // Resolve styling from this button's props, then the surrounding `Segmented`
+    // (set up by `ToggleGroup`), then toggle defaults. Routed through context -
+    // not passed to `SegmentedButton` directly - so its active/inactive switch
+    // keeps working (props passed to it would override the context-derived look).
+    const styling = {
+        size: size ?? seg.size ?? toolbarSize ?? 'md',
+        rounded: rounded ?? seg.rounded ?? toolbarRounded ?? true,
+        color: color ?? seg.color ?? '',
+        variant: variant ?? seg.variant ?? 'transparent',
+        outline: outline ?? seg.outline ?? false,
+        activeColor: activeColor ?? seg.activeColor ?? accentColor,
+        activeVariant: activeVariant ?? seg.activeVariant ?? 'gradient',
+        activeOutline: activeOutline ?? seg.activeOutline ?? true,
+    };
+    const SegmentedButtonEl = SegmentedButton;
+    return (_jsx(SegmentedContextProvider, { value: styling, children: _jsx(SegmentedButtonEl, { ...rest, active: selected, readOnly: false, "aria-pressed": selected, "data-value": value, onClick: (e) => {
+                onClick?.(e);
+                if (group) {
+                    if (value != null)
+                        group.toggleValue(value);
+                }
+                else {
+                    const next = !selected;
+                    if (selectedProp === undefined)
+                        setInternalSelected(next);
+                    onChange?.(next, e);
+                }
+            } }) }));
+};
+//# sourceMappingURL=ToggleButton.js.map

package/components/ToggleButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToggleButton.js","sourceRoot":"","sources":["../../../src/components/ToggleButton.tsx"],"names":[],"mappings":"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"}

package/components/ToggleGroup.d.ts

@@ -0,0 +1,50 @@
+import { ElementType } from 'react';
+import { SegmentedProps } from './Segmented.js';
+interface ToggleGroupOwnProps {
+    /**
+     * Controlled selection. A single value in single-select mode, an array when `multiple`.
+     *
+     * When provided, internal state is bypassed.
+     */
+    value?: string | string[];
+    /** Initial selection (uncontrolled). Ignored when `value` is provided. */
+    defaultValue?: string | string[];
+    /**
+     * Fires whenever the selection changes.
+     *
+     * Receives a single value (or `undefined` when nothing is selected) in single-select mode, or the full array in `multiple` mode.
+     */
+    onValueChange?: (value: string | string[] | undefined) => void;
+    /**
+     * Allow more than one selected value. Selection becomes an array and every `ToggleButton` toggles independently. Default `false`.
+     */
+    multiple?: boolean;
+}
+export type ToggleGroupProps<C extends ElementType = 'div'> = ToggleGroupOwnProps & Omit<SegmentedProps<C>, keyof ToggleGroupOwnProps>;
+/** Shape of `ToggleGroup` defaults that can be supplied via `CladdProvider`'s `defaults` prop. */
+export type ToggleGroupDefaultProps = Partial<Omit<ToggleGroupProps, 'as' | 'ref' | 'children' | 'value' | 'defaultValue' | 'onValueChange'>>;
+/**
+ * A group of `ToggleButton`s that owns the selected value(s) - the
+ * self-managing counterpart to wiring `Segmented`/`SegmentedButton` by hand.
+ * Renders a `Segmented` (so it inherits the full segmented look and all its
+ * `color`/`variant`/`active*` knobs) and publishes the selection to its
+ * children through context.
+ *
+ * Unlike `Segmented`, the active button stays pressable: clicking it deselects
+ * (single mode collapses to no selection, `multiple` removes it from the set).
+ *
+ * @example
+ * <ToggleGroup defaultValue="grid" activeColor="neutral">
+ *   <ToggleButton value="grid">Grid</ToggleButton>
+ *   <ToggleButton value="list">List</ToggleButton>
+ * </ToggleGroup>
+ *
+ * @example
+ * <ToggleGroup multiple defaultValue={['bold']}>
+ *   <ToggleButton value="bold">Bold</ToggleButton>
+ *   <ToggleButton value="italic">Italic</ToggleButton>
+ * </ToggleGroup>
+ */
+export declare const ToggleGroup: <C extends ElementType = "div">(props: ToggleGroupProps<C>) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=ToggleGroup.d.ts.map

package/components/ToggleGroup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToggleGroup.d.ts","sourceRoot":"","sources":["../../../src/components/ToggleGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAgB,MAAM,OAAO,CAAC;AAGlD,OAAO,EAAa,cAAc,EAAE,MAAM,aAAa,CAAC;AAGxD,UAAU,mBAAmB;IAC3B;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC1B,0EAA0E;IAC1E,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACjC;;;;OAIG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,SAAS,KAAK,IAAI,CAAC;IAC/D;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,MAAM,gBAAgB,CAAC,CAAC,SAAS,WAAW,GAAG,KAAK,IACxD,mBAAmB,GAAG,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,MAAM,mBAAmB,CAAC,CAAC;AAE3E,kGAAkG;AAClG,MAAM,MAAM,uBAAuB,GAAG,OAAO,CAC3C,IAAI,CACF,gBAAgB,EAChB,IAAI,GAAG,KAAK,GAAG,UAAU,GAAG,OAAO,GAAG,cAAc,GAAG,eAAe,CACvE,CACF,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,WAAW,GAAI,CAAC,SAAS,WAAW,GAAG,KAAK,EACvD,OAAO,gBAAgB,CAAC,CAAC,CAAC,4CA+C3B,CAAC"}