@central-ui/react 0.0.0-stage → 0.1.0

package/dist/components/checkbox/index.js

@@ -0,0 +1,146 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Checkbox as BaseCheckbox } from '@base-ui/react/checkbox';
+import { CheckboxGroup as BaseCheckboxGroup } from '@base-ui/react/checkbox-group';
+import { createContext, forwardRef, useContext, useEffect, useId, useState, } from 'react';
+import { Check, Minus } from 'lucide-react';
+import { ToneProvider, useToneContext } from "../../utils/Tone.js";
+/**
+ * Keep Button and Indicator inside the same Root as Label. Indicator tracks checked and indeterminate state automatically; no conditional checkmark needed. Use CheckboxGroup only when coordinating several checkbox roots.
+ *
+ * @example Complete composition
+ * import { Checkbox } from '@central-ui/react'
+ *
+ * function Example() {
+ *   return (
+ *     <Checkbox.Root name="terms" value="accepted">
+ *       <Checkbox.Container>
+ *         <Checkbox.Button>
+ *           <Checkbox.Indicator />
+ *         </Checkbox.Button>
+ *         <Checkbox.Label>Accept the terms</Checkbox.Label>
+ *         <Checkbox.Description>Required to continue.</Checkbox.Description>
+ *       </Checkbox.Container>
+ *     </Checkbox.Root>
+ *   )
+ * }
+ *
+ * @example Control acceptance in application state
+ * import { useState } from 'react'
+ * function ControlledExample() {
+ *   const [checked, setChecked] = useState(false)
+ *   return (
+ *     <Checkbox.Root checked={checked} onCheckedChange={setChecked}>
+ *       <Checkbox.Container>
+ *         {
+ *           // Rest of components here
+ *         }
+ *       </Checkbox.Container>
+ *     </Checkbox.Root>
+ *   )
+ * }
+ */
+export function Root({ children, id, tone = 'neutral', ...coreProps }) {
+    const generatedId = useId();
+    const [messageIds, setMessageIds] = useState([]);
+    const [state, setState] = useState({
+        checked: coreProps.checked ?? coreProps.defaultChecked ?? false,
+        indeterminate: coreProps.indeterminate ?? false,
+        disabled: coreProps.disabled ?? false,
+        readOnly: coreProps.readOnly ?? false,
+        required: coreProps.required ?? false,
+    });
+    return (_jsx(CheckboxContext.Provider, { value: {
+            coreProps: { ...coreProps, id: id ?? generatedId },
+            state,
+            setState,
+            messageIds,
+            setMessageIds,
+        }, children: _jsx(ToneProvider, { value: tone, children: children }) }));
+}
+/** Optional: controls multiple checkboxes as a native array of checked values. Put individual Roots inside and give each child a value. For a select-all checkbox, use parent on its Root and provide allValues on this controlled group; Base UI derives checked and indeterminate automatically. */
+export const CheckboxGroup = forwardRef(function CheckboxGroup({ disableStyle, className, ...props }, ref) {
+    return (_jsx(BaseCheckboxGroup, { ...props, ref: ref, "data-component": "checkbox-checkboxgroup", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+export const Container = forwardRef(function Container({ disableStyle, className, ...props }, ref) {
+    return (_jsx("div", { ...props, ref: ref, "data-component": "checkbox-container", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+export const Button = forwardRef(function Button({ disableStyle, className, ...props }, ref) {
+    const context = useCheckboxContext();
+    const tone = useToneContext();
+    return (_jsx(BaseCheckbox.Root, { ...props, ...context.coreProps, ref: ref, "data-tone": tone, "aria-invalid": tone === 'invalid' || props['aria-invalid'] || undefined, "aria-describedby": [props['aria-describedby'], ...context.messageIds]
+            .filter(Boolean)
+            .join(' ') || undefined, "data-component": "checkbox-button", "data-style-disabled": disableStyle ? '' : undefined, className: className, render: (buttonProps, state) => (_jsx(CheckboxButtonSurface, { ...buttonProps, state: state })) }));
+});
+/** 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 const Indicator = forwardRef(function Indicator({ disableStyle, className, ...props }, ref) {
+    return (_jsx(BaseCheckbox.Indicator, { ...props, ref: ref, "data-component": "checkbox-indicator", "data-style-disabled": disableStyle ? '' : undefined, className: className, render: (indicatorProps, state) => (_jsx("span", { ...indicatorProps, children: state.indeterminate ? (_jsx(Minus, { "aria-hidden": true, strokeWidth: 3.5, "data-component": "checkbox-indicator-1" })) : state.checked ? (_jsx(Check, { "aria-hidden": true, strokeWidth: 3.5, "data-component": "checkbox-indicator-2" })) : null })) }));
+});
+/** Labels the associated control automatically. Supply the visible text; do not wire a second label association. */
+export const Label = forwardRef(function Label({ disableStyle, className, ...props }, ref) {
+    const context = useCheckboxContext();
+    return (_jsx("label", { ...usePartAttributes(), ...props, ref: ref, htmlFor: context.coreProps.id, "data-component": "checkbox-label", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+export const Description = forwardRef(function Description({ disableStyle, className, id, ...props }, ref) {
+    const messageId = useMessageId(id);
+    return (_jsx("span", { ...usePartAttributes(), ...props, ref: ref, id: messageId, "data-component": "checkbox-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);
+    return (_jsx("span", { role: "alert", "aria-atomic": "true", ...usePartAttributes(), ...props, ref: ref, id: messageId, "data-component": "checkbox-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);
+    return (_jsx("span", { role: "status", "aria-atomic": "true", ...usePartAttributes(), ...props, ref: ref, id: messageId, "data-component": "checkbox-success", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+});
+const CheckboxContext = createContext(null);
+function useCheckboxContext() {
+    const context = useContext(CheckboxContext);
+    if (!context)
+        throw new globalThis.Error('Checkbox parts must be inside Checkbox.Root');
+    return context;
+}
+function usePartAttributes() {
+    const { state } = useCheckboxContext();
+    const tone = useToneContext();
+    return {
+        'data-checked': state.checked ? '' : undefined,
+        'data-indeterminate': state.indeterminate ? '' : undefined,
+        'data-disabled': state.disabled ? '' : undefined,
+        'data-readonly': state.readOnly ? '' : undefined,
+        'data-required': state.required ? '' : undefined,
+        'data-tone': tone,
+    };
+}
+const CheckboxButtonSurface = forwardRef(function CheckboxButtonSurface({ state, ...props }, ref) {
+    const { setState } = useCheckboxContext();
+    useEffect(() => {
+        setState({
+            checked: state.checked,
+            indeterminate: state.indeterminate,
+            disabled: state.disabled,
+            readOnly: state.readOnly,
+            required: state.required,
+        });
+    }, [
+        state.checked,
+        state.indeterminate,
+        state.disabled,
+        state.readOnly,
+        state.required,
+        setState,
+    ]);
+    return _jsx("span", { ...props, ref: ref });
+});
+function useMessageId(id) {
+    const generatedId = useId();
+    const messageId = id ?? generatedId;
+    const { setMessageIds } = useCheckboxContext();
+    useEffect(() => {
+        setMessageIds((current) => [...current, messageId]);
+        return () => setMessageIds((current) => current.filter((value) => value !== messageId));
+    }, [messageId, setMessageIds]);
+    return messageId;
+}
+//# sourceMappingURL=index.js.map

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

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

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

@@ -0,0 +1,26 @@
+import type { StyleProps } from '../../types/Style.ts';
+import type { ComponentProps, ReactElement } from 'react';
+/**
+ * Use Chip for a compact, non-interactive label. Only CloseButton has built-in interaction styling. Add CloseButton only when removal is supported; your callback decides what to remove from application data.
+ *
+ * @example Complete composition
+ * import { Chip } from '@central-ui/react'
+ *
+ * function Example() {
+ *   return (
+ *     <div className="flex flex-wrap gap-2">
+ *       <Chip.Chip>Design system</Chip.Chip>
+ *       <Chip.Chip>React</Chip.Chip>
+ *       <Chip.Chip>Accessibility</Chip.Chip>
+ *     </div>
+ *   )
+ * }
+ */
+export declare function Chip({ disableStyle, className, ...props }: ComponentProps<'div'> & StyleProps): import("react").JSX.Element;
+export declare function CloseButton({ disableStyle, type, className, ...props }: ComponentProps<'button'> & StyleProps): import("react").JSX.Element;
+/** A default icon is supplied. Omit children for the usual case; pass an icon only to replace that visual. */
+export declare function CloseButtonIcon({ disableStyle, children, className, ...props }: (Omit<ComponentProps<'svg'>, 'children'> & {
+    /** Omit for the supplied default icon; pass a child only to replace it. */
+    children?: ReactElement<ComponentProps<'svg'>>;
+}) & StyleProps): ReactElement<import("react").SVGProps<SVGSVGElement>, string | import("react").JSXElementConstructor<any>>;
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/chip/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAA;AAEtD,OAAO,KAAK,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAIzD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,IAAI,CAAC,EACnB,YAAY,EACZ,SAAS,EACT,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,KAAK,CAAC,GAAG,UAAU,+BASpC;AAED,wBAAgB,WAAW,CAAC,EAC1B,YAAY,EACZ,IAAe,EACf,SAAS,EACT,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,QAAQ,CAAC,GAAG,UAAU,+BAUvC;AAED,8GAA8G;AAC9G,wBAAgB,eAAe,CAAC,EAC9B,YAAY,EACZ,QAAgB,EAChB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,CAAC,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IAC5C,2EAA2E;IAC3E,QAAQ,CAAC,EAAE,YAAY,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAA;CAC/C,CAAC,GACA,UAAU,8GAWX"}

package/dist/components/chip/index.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { X } from 'lucide-react';
+import { cloneElement } from 'react';
+import { twMerge } from 'tailwind-merge';
+/**
+ * Use Chip for a compact, non-interactive label. Only CloseButton has built-in interaction styling. Add CloseButton only when removal is supported; your callback decides what to remove from application data.
+ *
+ * @example Complete composition
+ * import { Chip } from '@central-ui/react'
+ *
+ * function Example() {
+ *   return (
+ *     <div className="flex flex-wrap gap-2">
+ *       <Chip.Chip>Design system</Chip.Chip>
+ *       <Chip.Chip>React</Chip.Chip>
+ *       <Chip.Chip>Accessibility</Chip.Chip>
+ *     </div>
+ *   )
+ * }
+ */
+export function Chip({ disableStyle, className, ...props }) {
+    return (_jsx("div", { ...props, "data-component": "chip-chip", "data-style-disabled": disableStyle ? '' : undefined, className: className }));
+}
+export function CloseButton({ disableStyle, type = 'button', className, ...props }) {
+    return (_jsx("button", { ...props, type: type, "data-component": "chip-closebutton", "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 CloseButtonIcon({ disableStyle, children = _jsx(X, {}), className, ...props }) {
+    return cloneElement(children, {
+        ...children.props,
+        ...props,
+        ...{
+            'data-component': 'chip-closebuttonicon',
+            'data-style-disabled': disableStyle ? '' : undefined,
+        },
+        className: twMerge(children.props.className, className),
+        strokeWidth: props.strokeWidth ?? children.props.strokeWidth ?? 1.5,
+    });
+}
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/chip/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,CAAC,EAAE,MAAM,cAAc,CAAA;AAEhC,OAAO,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AACpC,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AAExC;;;;;;;;;;;;;;;GAeG;AACH,MAAM,UAAU,IAAI,CAAC,EACnB,YAAY,EACZ,SAAS,EACT,GAAG,KAAK,EAC2B;IACnC,OAAO,CACL,iBACM,KAAK,oBACM,WAAW,yBACL,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,EAClD,SAAS,EAAE,SAAS,GACpB,CACH,CAAA;AACH,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,EAC1B,YAAY,EACZ,IAAI,GAAG,QAAQ,EACf,SAAS,EACT,GAAG,KAAK,EAC8B;IACtC,OAAO,CACL,oBACM,KAAK,EACT,IAAI,EAAE,IAAI,oBACK,kBAAkB,yBACZ,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,EAClD,SAAS,EAAE,SAAS,GACpB,CACH,CAAA;AACH,CAAC;AAED,8GAA8G;AAC9G,MAAM,UAAU,eAAe,CAAC,EAC9B,YAAY,EACZ,QAAQ,GAAG,KAAC,CAAC,KAAG,EAChB,SAAS,EACT,GAAG,KAAK,EAKE;IACV,OAAO,YAAY,CAAC,QAAQ,EAAE;QAC5B,GAAG,QAAQ,CAAC,KAAK;QACjB,GAAG,KAAK;QACR,GAAG;YACD,gBAAgB,EAAE,sBAAsB;YACxC,qBAAqB,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS;SACrD;QACD,SAAS,EAAE,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,SAAS,EAAE,SAAS,CAAC;QACvD,WAAW,EAAE,KAAK,CAAC,WAAW,IAAI,QAAQ,CAAC,KAAK,CAAC,WAAW,IAAI,GAAG;KACpE,CAAC,CAAA;AACJ,CAAC"}