@central-ui/react 0.0.0-stage → 0.1.0

package/dist/components/passwordinput/index.js

@@ -0,0 +1,251 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Root as RadixRoot, Input as RadixInput, Toggle as RadixToggle, Slot as RadixSlot, } from '@radix-ui/react-password-toggle-field';
+import { Input as BaseInput } from '@base-ui/react/input';
+import { Eye, EyeOff, LoaderCircle } from 'lucide-react';
+import { useRef } from 'react';
+import { useForwardClickToInput } from "../../utils/useForwardClickToInput.js";
+import { cloneElement, createContext, forwardRef, useContext, useEffect, useId, useState, } from 'react';
+import { twMerge } from 'tailwind-merge';
+import { ToneProvider, useToneContext } from "../../utils/Tone.js";
+/**
+ * Configure the password on Root and use Input inside InputGroup. AddonVisibilityButton toggles visibility automatically; its visible/hidden icons follow that state. Do not maintain a second visibility state.
+ *
+ * @example Complete composition
+ * import { PasswordInput } from '@central-ui/react'
+ *
+ * function Example() {
+ *   return (
+ *     <PasswordInput.Root defaultValue="correct-horse" name="password">
+ *       <PasswordInput.Container>
+ *         <PasswordInput.Label>Password</PasswordInput.Label>
+ *         <PasswordInput.InputGroup>
+ *           <PasswordInput.Input
+ *             autoComplete="current-password"
+ *             placeholder="Enter password"
+ *           />
+ *           <PasswordInput.Addon>
+ *             <PasswordInput.AddonVisibilityButton>
+ *               <PasswordInput.AddonVisibleIcon></PasswordInput.AddonVisibleIcon>
+ *               <PasswordInput.AddonHiddenIcon></PasswordInput.AddonHiddenIcon>
+ *             </PasswordInput.AddonVisibilityButton>
+ *           </PasswordInput.Addon>
+ *         </PasswordInput.InputGroup>
+ *         <PasswordInput.Description>Use your account password.</PasswordInput.Description>
+ *       </PasswordInput.Container>
+ *     </PasswordInput.Root>
+ *   )
+ * }
+ *
+ * @example Start with the password visible
+ * // Visibility belongs to Root; the same icons and visibility button keep working.
+ * ;<PasswordInput.Root defaultVisible>
+ *   {
+ *     // Rest of components here
+ *   }
+ * </PasswordInput.Root>
+ */
+export function Root({ children, id, tone = 'neutral', value, defaultValue, onValueChange, disabled = false, readOnly = false, required = false, name, form, ...props }) {
+    const generatedId = useId();
+    const inputId = id ?? generatedId;
+    const [valueInternalState, setValueInternalState] = useState(defaultValue ?? '');
+    const [connections, setConnections] = useState({
+        descriptionIds: [],
+    });
+    return (_jsx(RadixRoot, { ...props, id: inputId, children: _jsx(InputContext.Provider, { value: {
+                inputId,
+                disabled,
+                readOnly,
+                required,
+                value: value ?? valueInternalState,
+                defaultValue,
+                controlled: value !== undefined,
+                setValueInternalState,
+                onValueChange,
+                coreProps: { name, form },
+                connections,
+                setConnections,
+            }, children: _jsx(ToneProvider, { value: tone, children: children }) }) }));
+}
+export const Input = forwardRef(function Input({ disableStyle, className, 'aria-describedby': describedBy, ...props }, ref) {
+    const context = useInputContext();
+    const tone = useToneContext();
+    const inputRef = useRef(null);
+    useEffect(() => {
+        const form = inputRef.current?.form;
+        if (!form || context.controlled)
+            return;
+        const reset = (event) => {
+            queueMicrotask(() => {
+                if (!event.defaultPrevented)
+                    context.setValueInternalState(context.defaultValue ?? '');
+            });
+        };
+        form.addEventListener('reset', reset);
+        return () => form.removeEventListener('reset', reset);
+    }, [
+        context.controlled,
+        context.defaultValue,
+        context.setValueInternalState,
+        context.coreProps.form,
+    ]);
+    return (_jsx(RadixInput, { asChild: true, id: context.inputId, children: _jsx(BaseInput, { ...context.coreProps, ...props, id: context.inputId, disabled: context.disabled, readOnly: context.readOnly, required: context.required, value: context.value, "data-tone": tone, "aria-invalid": tone === 'invalid' || props['aria-invalid'] || undefined, "aria-describedby": [describedBy, ...context.connections.descriptionIds]
+                .filter(Boolean)
+                .join(' ') || undefined, ref: (element) => {
+                inputRef.current = element;
+                if (typeof ref === 'function')
+                    ref(inputRef.current);
+                else if (ref)
+                    ref.current = inputRef.current;
+            }, onValueChange: (nextValue, details) => {
+                context.onValueChange?.(nextValue, details);
+                if (!details.isCanceled && !context.controlled)
+                    context.setValueInternalState(nextValue);
+            }, "data-component": "passwordinput-input", "data-style-disabled": disableStyle ? '' : undefined, className: className }) }));
+});
+export const InputGroup = forwardRef(function InputGroup({ disableStyle, className, onClick, ...props }, ref) {
+    const attributes = usePartAttributes();
+    const forwardClick = useForwardClickToInput('input:not([type="hidden"])', onClick);
+    return (_jsx("div", { ...attributes, ...props, ref: ref, onClick: forwardClick, "data-component": "passwordinput-inputgroup", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+export const Container = forwardRef(function Container({ disableStyle, className, ...props }, ref) {
+    const attributes = usePartAttributes();
+    return (_jsx("div", { ...attributes, ...props, ref: ref, "data-component": "passwordinput-container", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+/** Labels the associated control automatically. Supply the visible text; do not wire a second label association. */
+export const Label = forwardRef(function Label({ disableStyle, className, id, ...props }, ref) {
+    const context = useInputContext();
+    const labelId = id ?? context.inputId + '-label';
+    const attributes = usePartAttributes();
+    useEffect(() => {
+        context.setConnections((current) => ({ ...current, labelId }));
+        return () => context.setConnections((current) => ({
+            ...current,
+            labelId: current.labelId === labelId ? undefined : current.labelId,
+        }));
+    }, [labelId, context.setConnections]);
+    return (_jsx("label", { ...attributes, ...props, id: labelId, ref: ref, htmlFor: context.inputId, "data-component": "passwordinput-label", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+export const Description = forwardRef(function Description({ disableStyle, className, id, ...props }, ref) {
+    const messageId = useMessageId(id);
+    const attributes = usePartAttributes();
+    return (_jsx("div", { ...attributes, ...props, id: messageId, ref: ref, "data-component": "passwordinput-description", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+/** You decide when to show this feedback. Changing tone does not validate data or render the message for you. */
+export const Error = forwardRef(function Error({ disableStyle, className, id, ...props }, ref) {
+    const messageId = useMessageId(id);
+    const attributes = usePartAttributes();
+    return (_jsx("div", { role: "alert", "aria-atomic": "true", ...attributes, ...props, id: messageId, ref: ref, "data-component": "passwordinput-error", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+/** You decide when to show this feedback. Changing tone does not validate data or render the message for you. */
+export const Success = forwardRef(function Success({ disableStyle, className, id, ...props }, ref) {
+    const messageId = useMessageId(id);
+    const attributes = usePartAttributes();
+    return (_jsx("div", { role: "status", "aria-atomic": "true", ...attributes, ...props, id: messageId, ref: ref, "data-component": "passwordinput-success", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+export const Addon = forwardRef(function Addon({ disableStyle, className, variant = 'normal', ...props }, ref) {
+    const attributes = usePartAttributes();
+    return (_jsx("div", { ...attributes, ...props, ref: ref, "data-variant": variant, "data-component": "passwordinput-addon", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+export const AddonText = forwardRef(function AddonText({ disableStyle, className, ...props }, ref) {
+    const attributes = usePartAttributes();
+    return (_jsx("span", { ...attributes, ...props, ref: ref, "data-component": "passwordinput-addontext", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+/** Supply the decorative icon as a child. Its classes are preserved; interaction belongs to the surrounding control. */
+export function AddonIcon({ disableStyle, children, className, ...props }) {
+    const attributes = usePartAttributes();
+    return cloneElement(children, {
+        ...attributes,
+        ...props,
+        'aria-hidden': true,
+        strokeWidth: props.strokeWidth ?? children.props.strokeWidth ?? 1.5,
+        ...{
+            'data-component': 'passwordinput-addonicon',
+            'data-style-disabled': disableStyle ? '' : undefined,
+        },
+        className: twMerge(children.props.className, className),
+    });
+}
+export const AddonButton = forwardRef(function AddonButton({ disableStyle, className, disabled, type = 'button', ...props }, ref) {
+    const context = useInputContext();
+    const attributes = usePartAttributes();
+    return (_jsx("button", { ...attributes, ...props, ref: ref, type: type, disabled: disabled || context.disabled || context.readOnly, "data-component": "passwordinput-addonbutton", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+/** Built-in icon; no children needed. Use it inside its matching control. */
+export const AddonLoadingIcon = forwardRef(function AddonLoadingIcon({ disableStyle, className, strokeWidth = 1.5, ...props }, ref) {
+    const attributes = usePartAttributes();
+    return (_jsx(LoaderCircle, { ...attributes, "aria-hidden": true, ...props, ref: ref, strokeWidth: strokeWidth, "data-component": "passwordinput-addonloadingicon", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+/** Toggles password visibility automatically; do not maintain another visibility state. */
+export const AddonVisibilityButton = forwardRef(function AddonVisibilityButton({ disableStyle, className, disabled, id, ...props }, ref) {
+    const context = useInputContext();
+    const attributes = usePartAttributes();
+    return (_jsx(RadixToggle, { ...attributes, ...props, id: id ?? context.inputId + '-toggle', ref: ref, disabled: disabled || context.disabled || context.readOnly, "data-component": "passwordinput-addonvisibilitybutton", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+/** A default icon is supplied. Omit children for the usual case; pass an icon only to replace that visual. */
+export function AddonVisibleIcon({ disableStyle, children = _jsx(EyeOff, {}), className, ...props }) {
+    const attributes = usePartAttributes();
+    const icon = cloneElement(children, {
+        ...attributes,
+        ...props,
+        ...{ 'data-visible': '' },
+        'aria-hidden': true,
+        strokeWidth: props.strokeWidth ?? children.props.strokeWidth ?? 1.5,
+        ...{
+            'data-component': 'passwordinput-addonvisibleicon',
+            'data-style-disabled': disableStyle ? '' : undefined,
+        },
+        className: twMerge(children.props.className, className),
+    });
+    return _jsx(RadixSlot, { visible: icon, hidden: null });
+}
+/** A default icon is supplied. Omit children for the usual case; pass an icon only to replace that visual. */
+export function AddonHiddenIcon({ disableStyle, children = _jsx(Eye, {}), className, ...props }) {
+    const attributes = usePartAttributes();
+    const icon = cloneElement(children, {
+        ...attributes,
+        ...props,
+        ...{ 'data-visible': undefined },
+        'aria-hidden': true,
+        strokeWidth: props.strokeWidth ?? children.props.strokeWidth ?? 1.5,
+        ...{
+            'data-component': 'passwordinput-addonhiddenicon',
+            'data-style-disabled': disableStyle ? '' : undefined,
+        },
+        className: twMerge(children.props.className, className),
+    });
+    return _jsx(RadixSlot, { visible: null, hidden: icon });
+}
+const InputContext = createContext(null);
+function useInputContext() {
+    const context = useContext(InputContext);
+    if (!context)
+        throw new globalThis.Error('Parts must be inside Root');
+    return context;
+}
+function usePartAttributes() {
+    const context = useInputContext();
+    const tone = useToneContext();
+    return {
+        'data-disabled': context.disabled ? '' : undefined,
+        'data-readonly': context.readOnly ? '' : undefined,
+        'data-required': context.required ? '' : undefined,
+        'data-tone': tone,
+    };
+}
+function useMessageId(id) {
+    const generatedId = useId();
+    const messageId = id ?? generatedId;
+    const context = useInputContext();
+    useEffect(() => {
+        context.setConnections((current) => ({
+            ...current,
+            descriptionIds: [...current.descriptionIds, messageId],
+        }));
+        return () => context.setConnections((current) => ({
+            ...current,
+            descriptionIds: current.descriptionIds.filter((id) => id !== messageId),
+        }));
+    }, [messageId, context.setConnections]);
+    return messageId;
+}
+//# sourceMappingURL=index.js.map

package/dist/components/passwordinput/index.js.map

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

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

@@ -0,0 +1,67 @@
+import type { StyleProps } from '../../types/Style.ts';
+import { Popover as BasePopover } from '@base-ui/react/popover';
+import type { ComponentPropsWithRef, ReactElement } from 'react';
+/**
+ * OpenHandler and CloseHandler add behavior to their button children. Popup already includes its portal and positioner. Use Header/Body/Footer as needed; an Arrow is optional.
+ *
+ * @example Complete composition
+ * import { Button, Popover } from '@central-ui/react'
+ *
+ * function Example() {
+ *   return (
+ *     <Popover.Root>
+ *       <Popover.OpenHandler>
+ *         <Button.default variant="secondary">Account</Button.default>
+ *       </Popover.OpenHandler>
+ *       <Popover.Popup>
+ *         <Popover.Header>
+ *           <Popover.Title>Account</Popover.Title>
+ *           <Popover.Description>Manage your account preferences.</Popover.Description>
+ *         </Popover.Header>
+ *         <Popover.Body>Account settings go here.</Popover.Body>
+ *         <Popover.Footer>
+ *           <Popover.CloseHandler>
+ *             <Button.default variant="primary">Done</Button.default>
+ *           </Popover.CloseHandler>
+ *         </Popover.Footer>
+ *       </Popover.Popup>
+ *     </Popover.Root>
+ *   )
+ * }
+ *
+ * @example Prefer a different side and show an arrow
+ * // Replace only Popup's configuration, keeping the same content sections.
+ * ;<Popover.Popup side="right" align="center">
+ *   <Popover.Arrow />
+ *   Details
+ * </Popover.Popup>
+ */
+export declare const Root: typeof BasePopover.Root;
+/** Behavior only: give your child control this action. Style the child itself; this wrapper has no preset appearance or disableStyle prop. */
+export declare const OpenHandler: import("react").ForwardRefExoticComponent<Omit<Omit<BasePopover.Trigger.Props<unknown>, "children" | "className" | "render"> & {
+    className?: string;
+    /** Supply your own accessible control. It receives the behavior; its own className owns the appearance. */
+    children: ReactElement;
+}, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+export type PopupProps = Omit<ComponentPropsWithRef<typeof BasePopover.Popup>, 'className'> & {
+    className?: string;
+} & Pick<BasePopover.Portal.Props, 'container' | 'keepMounted'> & Pick<BasePopover.Positioner.Props, 'anchor' | 'positionMethod' | 'side' | 'sideOffset' | 'align' | 'alignOffset' | 'collisionBoundary' | 'collisionPadding' | 'sticky' | 'arrowPadding' | 'disableAnchorTracking' | 'collisionAvoidance'> & StyleProps;
+/** Already includes the portal and positioner. Keep it in the matching Root and let the native open state control visibility. */
+export declare function Popup({ disableStyle, container, keepMounted, anchor, positionMethod, side, sideOffset, align, alignOffset, collisionBoundary, collisionPadding, sticky, arrowPadding, disableAnchorTracking, collisionAvoidance, className, style, ...props }: PopupProps & StyleProps): import("react").JSX.Element;
+export declare const Arrow: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").SVGProps<SVGSVGElement>, "children" | "dangerouslySetInnerHTML"> & StyleProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
+/** Behavior only: give your child control this action. Style the child itself; this wrapper has no preset appearance or disableStyle prop. */
+export declare const CloseHandler: import("react").ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").PopoverCloseProps, "children" | "className" | "render"> & {
+    className?: string;
+    /** Supply your own accessible control. It receives the behavior; its own className owns the appearance. */
+    children: ReactElement;
+}, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+export declare const Header: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & StyleProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const Body: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & StyleProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const Footer: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & StyleProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const Title: import("react").ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").PopoverTitleProps, "className"> & {
+    className?: string;
+} & StyleProps, "ref"> & import("react").RefAttributes<HTMLHeadingElement>>;
+export declare const Description: import("react").ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").PopoverDescriptionProps, "className"> & {
+    className?: string;
+} & StyleProps, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/popover/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/popover/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAA;AACtD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,wBAAwB,CAAA;AAE/D,OAAO,KAAK,EAAkB,qBAAqB,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAGhF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,eAAO,MAAM,IAAI,yBAAmB,CAAA;AACpC,8IAA8I;AAC9I,eAAO,MAAM,WAAW;gBAGR,MAAM;IAClB,2GAA2G;cACjG,YAAY;6DAIxB,CAAA;AAEF,MAAM,MAAM,UAAU,GAAG,IAAI,CAC3B,qBAAqB,CAAC,OAAO,WAAW,CAAC,KAAK,CAAC,EAC/C,WAAW,CACZ,GAAG;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,IAAI,CAC7B,WAAW,CAAC,MAAM,CAAC,KAAK,EACxB,WAAW,GAAG,aAAa,CAC5B,GACD,IAAI,CACF,WAAW,CAAC,UAAU,CAAC,KAAK,EAC1B,QAAQ,GACR,gBAAgB,GAChB,MAAM,GACN,YAAY,GACZ,OAAO,GACP,aAAa,GACb,mBAAmB,GACnB,kBAAkB,GAClB,QAAQ,GACR,cAAc,GACd,uBAAuB,GACvB,oBAAoB,CACvB,GACD,UAAU,CAAA;AAEZ,iIAAiI;AACjI,wBAAgB,KAAK,CAAC,EACpB,YAAY,EACZ,SAAS,EACT,WAAW,EACX,MAAM,EACN,cAAc,EACd,IAAe,EACf,UAAc,EACd,KAAe,EACf,WAAW,EACX,iBAAiB,EACjB,gBAAgB,EAChB,MAAM,EACN,YAAY,EACZ,qBAAqB,EACrB,kBAAkB,EAClB,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,UAAU,GAAG,UAAU,+BAoCzB;AAED,eAAO,MAAM,KAAK,2MAoChB,CAAA;AAEF,8IAA8I;AAC9I,eAAO,MAAM,YAAY;gBAGT,MAAM;IAClB,2GAA2G;cACjG,YAAY;6DAIxB,CAAA;AAEF,eAAO,MAAM,MAAM,uNAajB,CAAA;AAEF,eAAO,MAAM,IAAI,uNAaf,CAAA;AAEF,eAAO,MAAM,MAAM,uNAajB,CAAA;AAEF,eAAO,MAAM,KAAK;gBAE4C,MAAM;2EAYlE,CAAA;AAEF,eAAO,MAAM,WAAW;gBAE4C,MAAM;6EAYxE,CAAA"}

package/dist/components/popover/index.js

@@ -0,0 +1,76 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Popover as BasePopover } from '@base-ui/react/popover';
+import { forwardRef } from 'react';
+/**
+ * OpenHandler and CloseHandler add behavior to their button children. Popup already includes its portal and positioner. Use Header/Body/Footer as needed; an Arrow is optional.
+ *
+ * @example Complete composition
+ * import { Button, Popover } from '@central-ui/react'
+ *
+ * function Example() {
+ *   return (
+ *     <Popover.Root>
+ *       <Popover.OpenHandler>
+ *         <Button.default variant="secondary">Account</Button.default>
+ *       </Popover.OpenHandler>
+ *       <Popover.Popup>
+ *         <Popover.Header>
+ *           <Popover.Title>Account</Popover.Title>
+ *           <Popover.Description>Manage your account preferences.</Popover.Description>
+ *         </Popover.Header>
+ *         <Popover.Body>Account settings go here.</Popover.Body>
+ *         <Popover.Footer>
+ *           <Popover.CloseHandler>
+ *             <Button.default variant="primary">Done</Button.default>
+ *           </Popover.CloseHandler>
+ *         </Popover.Footer>
+ *       </Popover.Popup>
+ *     </Popover.Root>
+ *   )
+ * }
+ *
+ * @example Prefer a different side and show an arrow
+ * // Replace only Popup's configuration, keeping the same content sections.
+ * ;<Popover.Popup side="right" align="center">
+ *   <Popover.Arrow />
+ *   Details
+ * </Popover.Popup>
+ */
+export const Root = BasePopover.Root;
+/** Behavior only: give your child control this action. Style the child itself; this wrapper has no preset appearance or disableStyle prop. */
+export const OpenHandler = forwardRef(function OpenHandler({ children, ...props }, ref) {
+    return _jsx(BasePopover.Trigger, { ...props, ref: ref, render: children });
+});
+/** Already includes the portal and positioner. Keep it in the matching Root and let the native open state control visibility. */
+export function Popup({ disableStyle, container, keepMounted, anchor, positionMethod, side = 'bottom', sideOffset = 5, align = 'start', alignOffset, collisionBoundary, collisionPadding, sticky, arrowPadding, disableAnchorTracking, collisionAvoidance, className, style, ...props }) {
+    const baseStyle = {
+        maxHeight: 'var(--available-height)',
+        maxWidth: 'var(--available-width)',
+    };
+    return (_jsx(BasePopover.Portal, { container: container, keepMounted: keepMounted, children: _jsx(BasePopover.Positioner, { anchor: anchor, positionMethod: positionMethod, side: side, sideOffset: sideOffset, align: align, alignOffset: alignOffset, collisionBoundary: collisionBoundary, collisionPadding: collisionPadding, sticky: sticky, arrowPadding: arrowPadding, disableAnchorTracking: disableAnchorTracking, collisionAvoidance: collisionAvoidance, style: { zIndex: 80, maxWidth: 'var(--available-width)' }, children: _jsx(BasePopover.Popup, { ...props, "data-component": "popover-popup", "data-style-disabled": disableStyle ? '' : undefined, className: className, style: typeof style === 'function'
+                    ? (state) => ({ ...baseStyle, ...style(state) })
+                    : { ...baseStyle, ...style } }) }) }));
+}
+export const Arrow = forwardRef(function Arrow({ disableStyle, className, style, ...props }, ref) {
+    return (_jsxs(BasePopover.Arrow, { style: style, render: _jsx("svg", { ...props, ref: ref, "aria-hidden": true, width: "20", height: "10", viewBox: "0 0 20 10" }), "data-component": "popover-arrow", "data-style-disabled": disableStyle ? '' : undefined, className: className, children: [_jsx("path", { d: "M9.66437 2.60207L4.80758 6.97318C4.07308 7.63423 3.11989 8 2.13172 8H0V10H20V8H18.5349C17.5468 8 16.5936 7.63423 15.8591 6.97318L11.0023 2.60207C10.622 2.2598 10.0447 2.25979 9.66437 2.60207Z", "data-component": "popover-arrow-1" }), _jsx("path", { d: "M8.99542 1.85876C9.75604 1.17425 10.9106 1.17422 11.6713 1.85878L16.5281 6.22989C17.0789 6.72568 17.7938 7.00001 18.5349 7.00001L15.89 7L11.0023 2.60207C10.622 2.2598 10.0447 2.2598 9.66436 2.60207L4.77734 7L2.13171 7.00001C2.87284 7.00001 3.58774 6.72568 4.13861 6.22989L8.99542 1.85876Z", "data-component": "popover-arrow-2" }), _jsx("path", { d: "M10.3333 3.34539L5.47654 7.71648C4.55842 8.54279 3.36693 9 2.13172 9H0V8H2.13172C3.11989 8 4.07308 7.63423 4.80758 6.97318L9.66437 2.60207C10.0447 2.25979 10.622 2.2598 11.0023 2.60207L15.8591 6.97318C16.5936 7.63423 17.5468 8 18.5349 8H20V9H18.5349C17.2998 9 16.1083 8.54278 15.1901 7.71648L10.3333 3.34539Z", "data-component": "popover-arrow-3" })] }));
+});
+/** Behavior only: give your child control this action. Style the child itself; this wrapper has no preset appearance or disableStyle prop. */
+export const CloseHandler = forwardRef(function CloseHandler({ children, ...props }, ref) {
+    return _jsx(BasePopover.Close, { ...props, ref: ref, render: children });
+});
+export const Header = forwardRef(function Header({ disableStyle, className, ...props }, ref) {
+    return (_jsx("div", { ...props, ref: ref, "data-component": "popover-header", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+export const Body = forwardRef(function Body({ disableStyle, className, ...props }, ref) {
+    return (_jsx("div", { ...props, ref: ref, "data-component": "popover-body", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+export const Footer = forwardRef(function Footer({ disableStyle, className, ...props }, ref) {
+    return (_jsx("div", { ...props, ref: ref, "data-component": "popover-footer", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+export const Title = forwardRef(function Title({ disableStyle, className, ...props }, ref) {
+    return (_jsx(BasePopover.Title, { ...props, ref: ref, "data-component": "popover-title", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+export const Description = forwardRef(function Description({ disableStyle, className, ...props }, ref) {
+    return (_jsx(BasePopover.Description, { ...props, ref: ref, "data-component": "popover-description", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+//# sourceMappingURL=index.js.map

package/dist/components/popover/index.js.map

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

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

@@ -0,0 +1,90 @@
+import type { StyleProps } from '../../types/Style.ts';
+import { RadioGroup as BaseRadioGroup } from '@base-ui/react/radio-group';
+import { Radio as BaseRadio } from '@base-ui/react/radio';
+import type { ComponentProps, ReactNode } from 'react';
+export type RootProps<Value = string> = Omit<BaseRadioGroup.Props<Value>, 'render' | 'className'> & {
+    /** Choose the visual tone. This does not validate data or show/hide feedback messages. */
+    tone?: 'neutral' | 'valid' | 'invalid';
+};
+/**
+ * Root owns the chosen value. For each choice keep Item, ItemButton, ItemIndicator, and ItemLabel together. The indicator follows selection automatically; do not manage a separate checked state for each item.
+ *
+ * @example Complete composition
+ * import { Radio } from '@central-ui/react'
+ *
+ * const plans = [
+ *   {
+ *     value: 'basic',
+ *     label: 'Basic',
+ *     description: 'For personal use.',
+ *     disabled: false,
+ *   },
+ *   {
+ *     value: 'team',
+ *     label: 'Team',
+ *     description: 'For shared work.',
+ *     disabled: false,
+ *   },
+ *   {
+ *     value: 'enterprise',
+ *     label: 'Enterprise',
+ *     description: 'Unavailable right now.',
+ *     disabled: true,
+ *   },
+ * ]
+ * function Example() {
+ *   return (
+ *     <Radio.Root name="plan" defaultValue="basic">
+ *       <Radio.Container>
+ *         <Radio.Label>Plan</Radio.Label>
+ *         <Radio.List>
+ *           {plans.map((plan) => (
+ *             <Radio.Item key={plan.value} value={plan.value} disabled={plan.disabled}>
+ *               <Radio.ItemButton>
+ *                 <Radio.ItemIndicator />
+ *               </Radio.ItemButton>
+ *               <Radio.ItemLabel>{plan.label}</Radio.ItemLabel>
+ *               <Radio.ItemDescription>{plan.description}</Radio.ItemDescription>
+ *             </Radio.Item>
+ *           ))}
+ *         </Radio.List>
+ *         <Radio.Description>Choose one plan.</Radio.Description>
+ *       </Radio.Container>
+ *     </Radio.Root>
+ *   )
+ * }
+ *
+ * @example Choose the initial plan
+ * // Keep the same Item compositions; each Item still supplies its own value.
+ * ;<Radio.Root defaultValue="pro" name="plan">
+ *   {
+ *     // Rest of components here
+ *   }
+ * </Radio.Root>
+ */
+export declare function Root<Value>({ children, tone, ...props }: RootProps<Value>): import("react").JSX.Element;
+export declare const Container: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & StyleProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const List: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & StyleProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+/** Labels the associated control automatically. Supply the visible text; do not wire a second label association. */
+export declare const Label: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & StyleProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+type ItemCoreKeys = 'value' | 'disabled' | 'readOnly' | 'required' | 'inputRef';
+export type ItemProps<Value = string> = Omit<ComponentProps<'div'>, 'children'> & Pick<BaseRadio.Root.Props<Value>, ItemCoreKeys> & {
+    children: ReactNode;
+} & StyleProps;
+export declare function Item<Value>({ disableStyle, children, value, disabled, readOnly, required, inputRef, id, className, ...props }: ItemProps<Value> & StyleProps): import("react").JSX.Element;
+export declare const ItemButton: import("react").ForwardRefExoticComponent<Omit<Omit<BaseRadio.Root.Props<any>, "className" | "id" | "disabled" | "value" | "render" | "nativeButton" | "required" | "readOnly" | "inputRef"> & {
+    className?: string;
+} & StyleProps, "ref"> & import("react").RefAttributes<HTMLElement>>;
+/** Tracks the surrounding item state automatically. Keep it mounted; do not add your own visibility condition. Use the supplied default visual unless customization is needed. */
+export declare const ItemIndicator: import("react").ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").RadioIndicatorProps, "className"> & {
+    className?: string;
+} & StyleProps, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+export declare const ItemLabel: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "htmlFor"> & StyleProps, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
+export declare const ItemDescription: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement> & StyleProps, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+export declare const Description: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & StyleProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+/** You decide when to show this feedback. Changing tone does not validate data or render the message for you. */
+export declare const Error: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & StyleProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+/** You decide when to show this feedback. Changing tone does not validate data or render the message for you. */
+export declare const Success: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & StyleProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/components/radio/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/radio/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAA;AACtD,OAAO,EAAE,UAAU,IAAI,cAAc,EAAE,MAAM,4BAA4B,CAAA;AACzE,OAAO,EAAE,KAAK,IAAI,SAAS,EAAE,MAAM,sBAAsB,CAAA;AAUzD,OAAO,KAAK,EACV,cAAc,EACd,SAAS,EAIV,MAAM,OAAO,CAAA;AAId,MAAM,MAAM,SAAS,CAAC,KAAK,GAAG,MAAM,IAAI,IAAI,CAC1C,cAAc,CAAC,KAAK,CAAC,KAAK,CAAC,EAC3B,QAAQ,GAAG,WAAW,CACvB,GAAG;IACF,0FAA0F;IAC1F,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,SAAS,CAAA;CACvC,CAAA;AACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuDG;AACH,wBAAgB,IAAI,CAAC,KAAK,EAAE,EAC1B,QAAQ,EACR,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,SAAS,CAAC,KAAK,CAAC,+BAsClB;AACD,eAAO,MAAM,SAAS,uNAapB,CAAA;AAEF,eAAO,MAAM,IAAI,uNAgBf,CAAA;AACF,oHAAoH;AACpH,eAAO,MAAM,KAAK,uNAyBhB,CAAA;AACF,KAAK,YAAY,GAAG,OAAO,GAAG,UAAU,GAAG,UAAU,GAAG,UAAU,GAAG,UAAU,CAAA;AAC/E,MAAM,MAAM,SAAS,CAAC,KAAK,GAAG,MAAM,IAAI,IAAI,CAC1C,cAAc,CAAC,KAAK,CAAC,EACrB,UAAU,CACX,GACC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,YAAY,CAAC,GAAG;IAChD,QAAQ,EAAE,SAAS,CAAA;CACpB,GAAG,UAAU,CAAA;AAChB,wBAAgB,IAAI,CAAC,KAAK,EAAE,EAC1B,YAAY,EACZ,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,EAAE,EACF,SAAS,EACT,GAAG,KAAK,EACT,EAAE,SAAS,CAAC,KAAK,CAAC,GAAG,UAAU,+BAqC/B;AACD,eAAO,MAAM,UAAU;gBAaH,MAAM;oEA8BxB,CAAA;AACF,kLAAkL;AAClL,eAAO,MAAM,aAAa;gBAEsC,MAAM;wEAcpE,CAAA;AACF,eAAO,MAAM,SAAS,oPAgBpB,CAAA;AACF,eAAO,MAAM,eAAe,0NA0B1B,CAAA;AACF,eAAO,MAAM,WAAW,uNAiBtB,CAAA;AACF,iHAAiH;AACjH,eAAO,MAAM,KAAK,uNAmBhB,CAAA;AACF,iHAAiH;AACjH,eAAO,MAAM,OAAO,uNAmBlB,CAAA"}