@skdx/react 0.27.0 → 0.29.0

package/dist/checkbox/types.d.ts

@@ -1,7 +1,13 @@
+import type * as React from 'react';
+import type { FormValidityHandle } from '../utils/formControl.js';
 import type { PrimitivePropsWithRef } from '../utils/primitive.js';
 /** A checkbox's tri-state value: checked, unchecked, or indeterminate (partially checked). */
 export type CheckedState = boolean | 'indeterminate';
-/** @internal Shared state distributed from {@link Checkbox} to its {@link CheckboxIndicator} via context. Not part of the public API. */
+/**
+ * The `Checkbox` root `<button>` plus its constraint-validation methods, assigned onto the same node so existing `HTMLButtonElement` ref usage keeps working.
+ */
+export type CheckboxHandle = HTMLButtonElement & FormValidityHandle;
+/** @internal Shared state distributed from {@link Checkbox} to its {@link CheckboxIndicator} via context. */
 export interface CheckboxContextValue {
     checked: CheckedState;
     disabled: boolean;
@@ -12,37 +18,62 @@ export interface CheckboxProps extends Omit<PrimitivePropsWithRef<'button'>, 'de
      * Checked state, for controlled usage. Pair with `onCheckedChange`.
      * @default undefined — uncontrolled, tracks its own checked state internally.
      */
-    checked?: CheckedState;
+    checked?: CheckedState | undefined;
     /**
      * Initial checked state, for uncontrolled usage.
      * @default false
      */
-    defaultChecked?: CheckedState;
+    defaultChecked?: CheckedState | undefined;
     /**
      * Fires with the new checked state whenever it changes, controlled or not.
      * @default undefined — no-op if omitted.
      */
-    onCheckedChange?: (checked: CheckedState) => void;
+    onCheckedChange?: ((checked: CheckedState) => void) | undefined;
     /**
      * Marks the underlying hidden input as required for native form validation.
      * @default false
      */
-    required?: boolean;
+    required?: boolean | undefined;
     /**
-     * Name for native form participation via a hidden input. Omitted: no hidden input is rendered.
+     * Name for native form participation via a hidden input.
      * @default undefined — no hidden input rendered.
      */
-    name?: string;
+    name?: string | undefined;
     /**
      * Value submitted with the hidden input when checked.
      * @default 'on'
      */
-    value?: string;
+    value?: string | undefined;
+    /**
+     * Id of the `<form>` that owns this checkbox when it renders outside it, forwarded to the hidden input's `form` attribute.
+     * @default undefined — the checkbox belongs to its nearest ancestor `<form>`, if any.
+     */
+    form?: string | undefined;
+    /**
+     * Freezes the checked state without freezing the control: keeps focus and `aria-readonly`/`data-readonly`, and ignores click and Space.
+     * @default false
+     */
+    readOnly?: boolean | undefined;
     /**
      * Marks the checkbox as invalid, exposed as `aria-invalid`/`data-invalid`.
      * @default false
      */
-    invalid?: boolean;
+    invalid?: boolean | undefined;
+    /**
+     * Disables the checkbox and excludes it from the tab order.
+     * @default false
+     */
+    disabled?: boolean | undefined;
+    /**
+     * Renders a derived `CheckboxIndicator` holding this content in place of the default check glyph, ignored when `children` is given.
+     * @default undefined — the default check/dash glyph.
+     */
+    indicator?: React.ReactNode | undefined;
+    /**
+     * Size rung the skin scales the box by, mirrored to `data-size` on the root.
+     * @default undefined — the skin's own default size.
+     */
+    size?: 'sm' | 'md' | 'lg' | (string & {}) | undefined;
 }
 /** Props for the {@link CheckboxIndicator}, the visual mark shown when checked or indeterminate. */
 export interface CheckboxIndicatorProps extends PrimitivePropsWithRef<'span'> {
@@ -50,5 +81,5 @@ export interface CheckboxIndicatorProps extends PrimitivePropsWithRef<'span'> {
      * Keep mounted regardless of state (for exit animations).
      * @default false
      */
-    forceMount?: boolean;
+    forceMount?: boolean | undefined;
 }

package/dist/checkbox-card/CheckboxCard.cjs

@@ -1 +1,2 @@
-"use strict";var j=Object.create;var l=Object.defineProperty;var ee=Object.getOwnPropertyDescriptor;var oe=Object.getOwnPropertyNames;var re=Object.getPrototypeOf,ae=Object.prototype.hasOwnProperty;var te=(o,r)=>{for(var e in r)l(o,e,{get:r[e],enumerable:!0})},H=(o,r,e,a)=>{if(r&&typeof r=="object"||typeof r=="function")for(let d of oe(r))!ae.call(o,d)&&d!==e&&l(o,d,{get:()=>r[d],enumerable:!(a=ee(r,d))||a.enumerable});return o};var n=(o,r,e)=>(e=o!=null?j(re(o)):{},H(r||!o||!o.__esModule?l(e,"default",{value:o,enumerable:!0}):e,o)),ce=o=>H(l({},"__esModule",{value:!0}),o);var de={};te(de,{CheckboxCard:()=>w,CheckboxCardControl:()=>x,CheckboxCardDescription:()=>P,CheckboxCardIndicator:()=>k,CheckboxCardLabel:()=>u,CheckboxCardProvider:()=>S,useCheckboxCardContext:()=>c});module.exports=ce(de);var t=n(require("react"),1),I=require("../utils/createContext.cjs"),N=require("../utils/part.cjs"),s=require("../utils/primitive.cjs"),E=require("../utils/useControllableState.cjs"),h=require("react/jsx-runtime"),[S,c]=(0,I.createSafeContext)("CheckboxCard"),w=t.forwardRef(({checked:o,defaultChecked:r=!1,onCheckedChange:e,name:a,value:d="on",required:O=!1,disabled:R=!1,invalid:y=!1,...i},Q)=>{let[L=!1,U]=(0,E.useControllableState)({prop:o,defaultProp:r,onChange:e}),v=t.useId(),[W,X]=t.useState(!1),[Y,Z]=t.useState(!1),[_,D]=t.useState(!1),C=t.useRef(!1);return(0,h.jsx)(S,{checked:L,disabled:R,required:O,invalid:y,name:a,value:d,labelId:`${v}-label`,descriptionId:`${v}-description`,hasLabel:W,hasDescription:Y,setHasLabel:X,setHasDescription:Z,onCheckedChange:U,children:(0,h.jsx)(s.Primitive.label,{"data-state":L?"checked":"unchecked","data-disabled":R?"":void 0,"data-invalid":y?"":void 0,"data-focus-visible":_?"":void 0,...i,...(0,N.skdxPart)("checkbox-card","root",i.className),ref:Q,onPointerDown:(0,s.composeEventHandlers)(i.onPointerDown,()=>{C.current=!0}),onFocus:(0,s.composeEventHandlers)(i.onFocus,()=>{D(!C.current),C.current=!1}),onBlur:(0,s.composeEventHandlers)(i.onBlur,()=>{D(!1),C.current=!1})})})});w.displayName="CheckboxCard";var g=n(require("react"),1),T=require("../utils/part.cjs"),b=require("../utils/primitive.cjs"),V=require("../utils/visuallyHidden.cjs");var m=require("react/jsx-runtime"),x=g.forwardRef((o,r)=>{let e=c("CheckboxCardControl");return(0,m.jsx)(V.VisuallyHidden,{asChild:!0,children:(0,m.jsx)(b.Primitive.input,{type:"checkbox",name:e.name,value:e.value,checked:e.checked,required:e.required,disabled:e.disabled,"aria-invalid":e.invalid?!0:void 0,"aria-labelledby":e.hasLabel?e.labelId:void 0,"aria-describedby":e.hasDescription?e.descriptionId:void 0,"data-state":e.checked?"checked":"unchecked",...o,...(0,T.skdxPart)("checkbox-card","control",o.className),ref:r,onChange:(0,b.composeEventHandlers)(o.onChange,a=>{e.onCheckedChange(a.currentTarget.checked)})})})});x.displayName="CheckboxCardControl";var M=n(require("react"),1),q=require("../utils/part.cjs"),F=require("../utils/primitive.cjs");var B=require("react/jsx-runtime"),k=M.forwardRef((o,r)=>{let e=c("CheckboxCardIndicator");return(0,B.jsx)(F.Primitive.span,{"aria-hidden":!0,"data-state":e.checked?"checked":"unchecked","data-disabled":e.disabled?"":void 0,...o,...(0,q.skdxPart)("checkbox-card","indicator",o.className),ref:r})});k.displayName="CheckboxCardIndicator";var p=n(require("react"),1),$=require("../utils/part.cjs"),z=require("../utils/primitive.cjs");var A=require("react/jsx-runtime"),u=p.forwardRef((o,r)=>{let e=c("CheckboxCardLabel"),{setHasLabel:a}=e;return p.useEffect(()=>(a(!0),()=>a(!1)),[a]),(0,A.jsx)(z.Primitive.span,{id:e.labelId,"data-disabled":e.disabled?"":void 0,...o,...(0,$.skdxPart)("checkbox-card","label",o.className),ref:r})});u.displayName="CheckboxCardLabel";var f=n(require("react"),1),G=require("../utils/part.cjs"),J=require("../utils/primitive.cjs");var K=require("react/jsx-runtime"),P=f.forwardRef((o,r)=>{let e=c("CheckboxCardDescription"),{setHasDescription:a}=e;return f.useEffect(()=>(a(!0),()=>a(!1)),[a]),(0,K.jsx)(J.Primitive.span,{id:e.descriptionId,"data-disabled":e.disabled?"":void 0,...o,...(0,G.skdxPart)("checkbox-card","description",o.className),ref:r})});P.displayName="CheckboxCardDescription";0&&(module.exports={CheckboxCard,CheckboxCardControl,CheckboxCardDescription,CheckboxCardIndicator,CheckboxCardLabel,CheckboxCardProvider,useCheckboxCardContext});
+'use client';
+"use strict";var le=Object.create;var m=Object.defineProperty;var Ce=Object.getOwnPropertyDescriptor;var me=Object.getOwnPropertyNames;var fe=Object.getPrototypeOf,be=Object.prototype.hasOwnProperty;var pe=(r,o)=>{for(var e in o)m(r,e,{get:o[e],enumerable:!0})},T=(r,o,e,t)=>{if(o&&typeof o=="object"||typeof o=="function")for(let a of me(o))!be.call(r,a)&&a!==e&&m(r,a,{get:()=>o[a],enumerable:!(t=Ce(o,a))||t.enumerable});return r};var R=(r,o,e)=>(e=r!=null?le(fe(r)):{},T(o||!r||!r.__esModule?m(e,"default",{value:r,enumerable:!0}):e,r)),he=r=>T(m({},"__esModule",{value:!0}),r);var ke={};pe(ke,{CheckboxCard:()=>N,CheckboxCardControl:()=>b,CheckboxCardDescription:()=>p,CheckboxCardIndicator:()=>h,CheckboxCardLabel:()=>x,CheckboxCardProvider:()=>Z,CheckboxCardRoot:()=>L,useCheckboxCardContext:()=>d});module.exports=he(ke);var n=R(require("react"),1),G=require("../utils/appearance.cjs"),K=require("../utils/cardNesting.cjs"),Q=require("../utils/createContext.cjs"),P=require("../utils/declaredChildren.cjs"),u=require("../utils/formControl.cjs"),U=require("../utils/part.cjs"),s=require("../utils/primitive.cjs"),Y=require("../utils/useControllableState.cjs");var F=require("../utils/part.cjs"),f=require("../utils/primitive.cjs"),S=require("../utils/visuallyHidden.cjs");var y=require("react/jsx-runtime"),b=({ref:r,...o})=>{let e=d("CheckboxCardControl");return(0,y.jsx)(S.VisuallyHidden,{asChild:!0,children:(0,y.jsx)(f.Primitive.input,{type:"checkbox",name:e.name,value:e.value,form:e.form,checked:e.checked,required:e.required,disabled:e.disabled,"aria-readonly":e.readOnly||void 0,"aria-invalid":e.invalid?!0:void 0,"aria-labelledby":e.hasLabel?e.labelId:void 0,"aria-describedby":e.hasDescription?e.descriptionId:void 0,"data-state":e.checked?"checked":"unchecked",...o,...(0,F.skdxPart)("checkbox-card","control",o.className),ref:r,onChange:(0,f.composeEventHandlers)(o.onChange,t=>{if(e.readOnly){t.currentTarget.checked=e.checked;return}e.onCheckedChange(t.currentTarget.checked)})})})};b.displayName="CheckboxCardControl";var O=R(require("react"),1),q=require("../utils/part.cjs"),M=require("../utils/primitive.cjs");var A=require("react/jsx-runtime"),p=({ref:r,...o})=>{let e=d("CheckboxCardDescription"),{setHasDescription:t}=e;return O.useEffect(()=>(t(!0),()=>t(!1)),[t]),(0,A.jsx)(M.Primitive.span,{id:e.descriptionId,"data-disabled":e.disabled?"":void 0,...o,...(0,q.skdxPart)("checkbox-card","description",o.className),ref:r})};p.displayName="CheckboxCardDescription";var w=require("../utils/part.cjs"),B=require("../utils/primitive.cjs");var $=require("react/jsx-runtime"),h=({ref:r,...o})=>{let e=d("CheckboxCardIndicator");return(0,$.jsx)(B.Primitive.span,{"aria-hidden":!0,"data-state":e.checked?"checked":"unchecked","data-disabled":e.disabled?"":void 0,...o,...(0,w.skdxPart)("checkbox-card","indicator",o.className),ref:r})};h.displayName="CheckboxCardIndicator";var J=R(require("react"),1),W=require("../utils/part.cjs"),X=require("../utils/primitive.cjs");var _=require("react/jsx-runtime"),x=({ref:r,...o})=>{let e=d("CheckboxCardLabel"),{setHasLabel:t}=e;return J.useEffect(()=>(t(!0),()=>t(!1)),[t]),(0,_.jsx)(X.Primitive.span,{id:e.labelId,"data-disabled":e.disabled?"":void 0,...o,...(0,W.skdxPart)("checkbox-card","label",o.className),ref:r})};x.displayName="CheckboxCardLabel";var c=require("react/jsx-runtime"),z=({label:r,description:o})=>(0,c.jsxs)(c.Fragment,{children:[(0,c.jsx)(b,{}),(0,c.jsx)(h,{}),r===void 0?null:(0,c.jsx)(x,{children:r}),o===void 0?null:(0,c.jsx)(p,{children:o})]});var k=require("react/jsx-runtime"),xe='input[type="checkbox"]',[Z,d]=(0,Q.createSafeContext)("CheckboxCard"),L=({checked:r,defaultChecked:o=!1,onCheckedChange:e,name:t,value:a="on",form:j,required:ee=!1,disabled:H=!1,readOnly:v=!1,invalid:D=!1,ref:oe,size:re,...i})=>{let[I=!1,g]=(0,Y.useControllableState)({prop:r,defaultProp:o,onChange:e}),E=n.useId(),[te,ae]=n.useState(!1),[de,ce]=n.useState(!1),ne=te||(0,P.hasDeclaredChild)(i.children,"CheckboxCardLabel"),ie=de||(0,P.hasDeclaredChild)(i.children,"CheckboxCardDescription"),[se,V]=n.useState(!1),C=n.useRef(!1),l=n.useRef(null);return(0,u.useFormValidityHandle)(oe,l,{get current(){return l.current?.querySelector(xe)??null}}),(0,K.useCardNestingWarning)("CheckboxCard",l),(0,u.useFormReset)(l,()=>g(o)),(0,k.jsx)(Z,{checked:I,disabled:H,readOnly:v,required:ee,invalid:D,name:t,value:a,form:j,labelId:`${E}-label`,descriptionId:`${E}-description`,hasLabel:ne,hasDescription:ie,setHasLabel:ae,setHasDescription:ce,onCheckedChange:g,children:(0,k.jsx)(s.Primitive.label,{"data-state":I?"checked":"unchecked","data-disabled":H?"":void 0,"data-readonly":v?"":void 0,"data-invalid":D?"":void 0,"data-focus-visible":se?"":void 0,...i,...(0,G.appearanceAttrs)({size:re},i),...(0,U.skdxPart)("checkbox-card","root",i.className),ref:l,onPointerDown:(0,s.useComposedEventHandlers)(i.onPointerDown,()=>{C.current=!0}),onFocus:(0,s.useComposedEventHandlers)(i.onFocus,()=>{V(!C.current),C.current=!1}),onBlur:(0,s.useComposedEventHandlers)(i.onBlur,()=>{V(!1),C.current=!1})})})};L.displayName="CheckboxCardRoot";var N=({label:r,description:o,children:e,ref:t,...a})=>(0,k.jsx)(L,{...a,ref:t,children:e??z({label:r,description:o})});N.displayName="CheckboxCard";0&&(module.exports={CheckboxCard,CheckboxCardControl,CheckboxCardDescription,CheckboxCardIndicator,CheckboxCardLabel,CheckboxCardProvider,CheckboxCardRoot,useCheckboxCardContext});

package/dist/checkbox-card/CheckboxCard.d.cts

@@ -1,39 +1,46 @@
 import * as React from 'react';
-import type { CheckboxCardContextValue, CheckboxCardProps } from './types.cjs';
-export declare const CheckboxCardProvider: {
-    (props: CheckboxCardContextValue & {
-        children: React.ReactNode;
-    }): React.JSX.Element;
-    displayName: string;
-}, useCheckboxCardContext: (consumerName: string) => CheckboxCardContextValue;
+import { type FormValidityHandle } from '../utils/formControl.cjs';
+import type { CheckboxCardContextValue, CheckboxCardProps, CheckboxCardRootProps } from './types.cjs';
+export declare const CheckboxCardProvider: React.FC<CheckboxCardContextValue & {
+    children: React.ReactNode;
+}>, useCheckboxCardContext: (consumerName: string) => CheckboxCardContextValue;
 /**
- * Root of a selectable card backed by a checkbox: a `<label>` wrapping a real,
- * visually hidden `<input type="checkbox">` ({@link CheckboxCardControl}), so
- * the **entire card surface** is the hit target with no click handler, no
- * `onKeyDown` and no `role` of its own — native label activation does it.
- *
- * Emits `data-state="checked" | "unchecked"`, `data-disabled`, `data-invalid`
- * and `data-focus-visible` on the root, which is the whole styling contract:
- * the card paints its selected, disabled, error and keyboard-focus rings from
- * the input's state without the input ever being visible.
- *
- * Works controlled (`checked` + `onCheckedChange`) or uncontrolled
- * (`defaultChecked`), and participates in native form submission when `name`
- * is set.
- *
- * **Nothing interactive may be nested inside the card.** The root is a
- * `<label>`, so a link or button in there is both an HTML content-model
- * violation and a real usability bug — clicking the inner control would also
- * toggle the card. Put actions beside the card, never inside it.
+ * Root of a selectable card backed by a checkbox: a `<label>` wrapping a visually-hidden `<input type="checkbox">` ({@link CheckboxCardControl}) so the entire card surface is the hit target.
  *
  * @example
  * ```tsx
- * <CheckboxCard defaultChecked name="addons" value="backups">
+ * import { CheckboxCardControl, CheckboxCardDescription, CheckboxCardIndicator, CheckboxCardLabel, CheckboxCardRoot } from '@skdx/react/primitives/checkbox-card';
+ *
+ * <CheckboxCardRoot defaultChecked name="addons" value="backups">
  *   <CheckboxCardControl />
  *   <CheckboxCardIndicator />
  *   <CheckboxCardLabel>Automated backups</CheckboxCardLabel>
  *   <CheckboxCardDescription>Nightly snapshots, kept for 30 days.</CheckboxCardDescription>
- * </CheckboxCard>
+ * </CheckboxCardRoot>
  * ```
  */
-export declare const CheckboxCard: React.ForwardRefExoticComponent<Omit<CheckboxCardProps, "ref"> & React.RefAttributes<HTMLLabelElement>>;
+export declare const CheckboxCardRoot: {
+    ({ checked: checkedProp, defaultChecked, onCheckedChange, name, value, form, required, disabled, readOnly, invalid, ref: forwardedRef, size, ...props }: Omit<CheckboxCardRootProps, "ref"> & {
+        ref?: React.Ref<HTMLLabelElement & FormValidityHandle> | undefined;
+    }): React.ReactNode;
+    displayName: string;
+};
+/**
+ * A selectable card backed by a checkbox that draws its label and description from `label`/`description`, or renders `children` verbatim.
+ *
+ * @example
+ * ```tsx
+ * <CheckboxCard
+ *   name="addons"
+ *   value="backups"
+ *   label="Automated backups"
+ *   description="Nightly snapshots, kept for 30 days."
+ * />
+ * ```
+ */
+export declare const CheckboxCard: {
+    ({ label, description, children, ref: forwardedRef, ...rest }: Omit<CheckboxCardProps, "ref"> & {
+        ref?: React.Ref<HTMLLabelElement & FormValidityHandle> | undefined;
+    }): React.ReactNode;
+    displayName: string;
+};

package/dist/checkbox-card/CheckboxCard.d.ts

@@ -1,39 +1,46 @@
 import * as React from 'react';
-import type { CheckboxCardContextValue, CheckboxCardProps } from './types.js';
-export declare const CheckboxCardProvider: {
-    (props: CheckboxCardContextValue & {
-        children: React.ReactNode;
-    }): React.JSX.Element;
-    displayName: string;
-}, useCheckboxCardContext: (consumerName: string) => CheckboxCardContextValue;
+import { type FormValidityHandle } from '../utils/formControl.js';
+import type { CheckboxCardContextValue, CheckboxCardProps, CheckboxCardRootProps } from './types.js';
+export declare const CheckboxCardProvider: React.FC<CheckboxCardContextValue & {
+    children: React.ReactNode;
+}>, useCheckboxCardContext: (consumerName: string) => CheckboxCardContextValue;
 /**
- * Root of a selectable card backed by a checkbox: a `<label>` wrapping a real,
- * visually hidden `<input type="checkbox">` ({@link CheckboxCardControl}), so
- * the **entire card surface** is the hit target with no click handler, no
- * `onKeyDown` and no `role` of its own — native label activation does it.
- *
- * Emits `data-state="checked" | "unchecked"`, `data-disabled`, `data-invalid`
- * and `data-focus-visible` on the root, which is the whole styling contract:
- * the card paints its selected, disabled, error and keyboard-focus rings from
- * the input's state without the input ever being visible.
- *
- * Works controlled (`checked` + `onCheckedChange`) or uncontrolled
- * (`defaultChecked`), and participates in native form submission when `name`
- * is set.
- *
- * **Nothing interactive may be nested inside the card.** The root is a
- * `<label>`, so a link or button in there is both an HTML content-model
- * violation and a real usability bug — clicking the inner control would also
- * toggle the card. Put actions beside the card, never inside it.
+ * Root of a selectable card backed by a checkbox: a `<label>` wrapping a visually-hidden `<input type="checkbox">` ({@link CheckboxCardControl}) so the entire card surface is the hit target.
  *
  * @example
  * ```tsx
- * <CheckboxCard defaultChecked name="addons" value="backups">
+ * import { CheckboxCardControl, CheckboxCardDescription, CheckboxCardIndicator, CheckboxCardLabel, CheckboxCardRoot } from '@skdx/react/primitives/checkbox-card';
+ *
+ * <CheckboxCardRoot defaultChecked name="addons" value="backups">
  *   <CheckboxCardControl />
  *   <CheckboxCardIndicator />
  *   <CheckboxCardLabel>Automated backups</CheckboxCardLabel>
  *   <CheckboxCardDescription>Nightly snapshots, kept for 30 days.</CheckboxCardDescription>
- * </CheckboxCard>
+ * </CheckboxCardRoot>
  * ```
  */
-export declare const CheckboxCard: React.ForwardRefExoticComponent<Omit<CheckboxCardProps, "ref"> & React.RefAttributes<HTMLLabelElement>>;
+export declare const CheckboxCardRoot: {
+    ({ checked: checkedProp, defaultChecked, onCheckedChange, name, value, form, required, disabled, readOnly, invalid, ref: forwardedRef, size, ...props }: Omit<CheckboxCardRootProps, "ref"> & {
+        ref?: React.Ref<HTMLLabelElement & FormValidityHandle> | undefined;
+    }): React.ReactNode;
+    displayName: string;
+};
+/**
+ * A selectable card backed by a checkbox that draws its label and description from `label`/`description`, or renders `children` verbatim.
+ *
+ * @example
+ * ```tsx
+ * <CheckboxCard
+ *   name="addons"
+ *   value="backups"
+ *   label="Automated backups"
+ *   description="Nightly snapshots, kept for 30 days."
+ * />
+ * ```
+ */
+export declare const CheckboxCard: {
+    ({ label, description, children, ref: forwardedRef, ...rest }: Omit<CheckboxCardProps, "ref"> & {
+        ref?: React.Ref<HTMLLabelElement & FormValidityHandle> | undefined;
+    }): React.ReactNode;
+    displayName: string;
+};

package/dist/checkbox-card/CheckboxCard.js

@@ -1 +1,2 @@
-import*as a from"react";import{createSafeContext as T}from"../utils/createContext.js";import{skdxPart as V}from"../utils/part.js";import{composeEventHandlers as C,Primitive as M}from"../utils/primitive.js";import{useControllableState as q}from"../utils/useControllableState.js";import{jsx as m}from"react/jsx-runtime";var[F,c]=T("CheckboxCard"),B=a.forwardRef(({checked:o,defaultChecked:t=!1,onCheckedChange:e,name:r,value:v="on",required:D=!1,disabled:l=!1,invalid:b=!1,...d},H)=>{let[p=!1,I]=q({prop:o,defaultProp:t,onChange:e}),f=a.useId(),[N,E]=a.useState(!1),[S,w]=a.useState(!1),[g,h]=a.useState(!1),s=a.useRef(!1);return m(F,{checked:p,disabled:l,required:D,invalid:b,name:r,value:v,labelId:`${f}-label`,descriptionId:`${f}-description`,hasLabel:N,hasDescription:S,setHasLabel:E,setHasDescription:w,onCheckedChange:I,children:m(M.label,{"data-state":p?"checked":"unchecked","data-disabled":l?"":void 0,"data-invalid":b?"":void 0,"data-focus-visible":g?"":void 0,...d,...V("checkbox-card","root",d.className),ref:H,onPointerDown:C(d.onPointerDown,()=>{s.current=!0}),onFocus:C(d.onFocus,()=>{h(!s.current),s.current=!1}),onBlur:C(d.onBlur,()=>{h(!1),s.current=!1})})})});B.displayName="CheckboxCard";import*as k from"react";import{skdxPart as $}from"../utils/part.js";import{composeEventHandlers as z,Primitive as A}from"../utils/primitive.js";import{VisuallyHidden as G}from"../utils/visuallyHidden.js";import{jsx as x}from"react/jsx-runtime";var u=k.forwardRef((o,t)=>{let e=c("CheckboxCardControl");return x(G,{asChild:!0,children:x(A.input,{type:"checkbox",name:e.name,value:e.value,checked:e.checked,required:e.required,disabled:e.disabled,"aria-invalid":e.invalid?!0:void 0,"aria-labelledby":e.hasLabel?e.labelId:void 0,"aria-describedby":e.hasDescription?e.descriptionId:void 0,"data-state":e.checked?"checked":"unchecked",...o,...$("checkbox-card","control",o.className),ref:t,onChange:z(o.onChange,r=>{e.onCheckedChange(r.currentTarget.checked)})})})});u.displayName="CheckboxCardControl";import*as P from"react";import{skdxPart as J}from"../utils/part.js";import{Primitive as K}from"../utils/primitive.js";import{jsx as O}from"react/jsx-runtime";var R=P.forwardRef((o,t)=>{let e=c("CheckboxCardIndicator");return O(K.span,{"aria-hidden":!0,"data-state":e.checked?"checked":"unchecked","data-disabled":e.disabled?"":void 0,...o,...J("checkbox-card","indicator",o.className),ref:t})});R.displayName="CheckboxCardIndicator";import*as i from"react";import{skdxPart as Q}from"../utils/part.js";import{Primitive as U}from"../utils/primitive.js";import{jsx as W}from"react/jsx-runtime";var y=i.forwardRef((o,t)=>{let e=c("CheckboxCardLabel"),{setHasLabel:r}=e;return i.useEffect(()=>(r(!0),()=>r(!1)),[r]),W(U.span,{id:e.labelId,"data-disabled":e.disabled?"":void 0,...o,...Q("checkbox-card","label",o.className),ref:t})});y.displayName="CheckboxCardLabel";import*as n from"react";import{skdxPart as X}from"../utils/part.js";import{Primitive as Y}from"../utils/primitive.js";import{jsx as Z}from"react/jsx-runtime";var L=n.forwardRef((o,t)=>{let e=c("CheckboxCardDescription"),{setHasDescription:r}=e;return n.useEffect(()=>(r(!0),()=>r(!1)),[r]),Z(Y.span,{id:e.descriptionId,"data-disabled":e.disabled?"":void 0,...o,...X("checkbox-card","description",o.className),ref:t})});L.displayName="CheckboxCardDescription";export{B as CheckboxCard,u as CheckboxCardControl,L as CheckboxCardDescription,R as CheckboxCardIndicator,y as CheckboxCardLabel,F as CheckboxCardProvider,c as useCheckboxCardContext};
+'use client';
+import*as a from"react";import{appearanceAttrs as te}from"../utils/appearance.js";import{useCardNestingWarning as ae}from"../utils/cardNesting.js";import{createSafeContext as de}from"../utils/createContext.js";import{hasDeclaredChild as I}from"../utils/declaredChildren.js";import{useFormReset as ce,useFormValidityHandle as ne}from"../utils/formControl.js";import{skdxPart as ie}from"../utils/part.js";import{Primitive as se,useComposedEventHandlers as p}from"../utils/primitive.js";import{useControllableState as le}from"../utils/useControllableState.js";import{skdxPart as J}from"../utils/part.js";import{composeEventHandlers as W,Primitive as X}from"../utils/primitive.js";import{VisuallyHidden as _}from"../utils/visuallyHidden.js";import{jsx as N}from"react/jsx-runtime";var C=({ref:r,...o})=>{let e=c("CheckboxCardControl");return N(_,{asChild:!0,children:N(X.input,{type:"checkbox",name:e.name,value:e.value,form:e.form,checked:e.checked,required:e.required,disabled:e.disabled,"aria-readonly":e.readOnly||void 0,"aria-invalid":e.invalid?!0:void 0,"aria-labelledby":e.hasLabel?e.labelId:void 0,"aria-describedby":e.hasDescription?e.descriptionId:void 0,"data-state":e.checked?"checked":"unchecked",...o,...J("checkbox-card","control",o.className),ref:r,onChange:W(o.onChange,t=>{if(e.readOnly){t.currentTarget.checked=e.checked;return}e.onCheckedChange(t.currentTarget.checked)})})})};C.displayName="CheckboxCardControl";import*as H from"react";import{skdxPart as z}from"../utils/part.js";import{Primitive as G}from"../utils/primitive.js";import{jsx as K}from"react/jsx-runtime";var m=({ref:r,...o})=>{let e=c("CheckboxCardDescription"),{setHasDescription:t}=e;return H.useEffect(()=>(t(!0),()=>t(!1)),[t]),K(G.span,{id:e.descriptionId,"data-disabled":e.disabled?"":void 0,...o,...z("checkbox-card","description",o.className),ref:r})};m.displayName="CheckboxCardDescription";import{skdxPart as Q}from"../utils/part.js";import{Primitive as U}from"../utils/primitive.js";import{jsx as Y}from"react/jsx-runtime";var f=({ref:r,...o})=>{let e=c("CheckboxCardIndicator");return Y(U.span,{"aria-hidden":!0,"data-state":e.checked?"checked":"unchecked","data-disabled":e.disabled?"":void 0,...o,...Q("checkbox-card","indicator",o.className),ref:r})};f.displayName="CheckboxCardIndicator";import*as v from"react";import{skdxPart as Z}from"../utils/part.js";import{Primitive as j}from"../utils/primitive.js";import{jsx as ee}from"react/jsx-runtime";var b=({ref:r,...o})=>{let e=c("CheckboxCardLabel"),{setHasLabel:t}=e;return v.useEffect(()=>(t(!0),()=>t(!1)),[t]),ee(j.span,{id:e.labelId,"data-disabled":e.disabled?"":void 0,...o,...Z("checkbox-card","label",o.className),ref:r})};b.displayName="CheckboxCardLabel";import{Fragment as oe,jsx as s,jsxs as re}from"react/jsx-runtime";var D=({label:r,description:o})=>re(oe,{children:[s(C,{}),s(f,{}),r===void 0?null:s(b,{children:r}),o===void 0?null:s(m,{children:o})]});import{jsx as h}from"react/jsx-runtime";var Ce='input[type="checkbox"]',[me,c]=de("CheckboxCard"),g=({checked:r,defaultChecked:o=!1,onCheckedChange:e,name:t,value:l="on",form:V,required:T=!1,disabled:x=!1,readOnly:k=!1,invalid:u=!1,ref:F,size:S,...d})=>{let[R=!1,y]=le({prop:r,defaultProp:o,onChange:e}),P=a.useId(),[O,q]=a.useState(!1),[M,A]=a.useState(!1),w=O||I(d.children,"CheckboxCardLabel"),B=M||I(d.children,"CheckboxCardDescription"),[$,L]=a.useState(!1),i=a.useRef(!1),n=a.useRef(null);return ne(F,n,{get current(){return n.current?.querySelector(Ce)??null}}),ae("CheckboxCard",n),ce(n,()=>y(o)),h(me,{checked:R,disabled:x,readOnly:k,required:T,invalid:u,name:t,value:l,form:V,labelId:`${P}-label`,descriptionId:`${P}-description`,hasLabel:w,hasDescription:B,setHasLabel:q,setHasDescription:A,onCheckedChange:y,children:h(se.label,{"data-state":R?"checked":"unchecked","data-disabled":x?"":void 0,"data-readonly":k?"":void 0,"data-invalid":u?"":void 0,"data-focus-visible":$?"":void 0,...d,...te({size:S},d),...ie("checkbox-card","root",d.className),ref:n,onPointerDown:p(d.onPointerDown,()=>{i.current=!0}),onFocus:p(d.onFocus,()=>{L(!i.current),i.current=!1}),onBlur:p(d.onBlur,()=>{L(!1),i.current=!1})})})};g.displayName="CheckboxCardRoot";var E=({label:r,description:o,children:e,ref:t,...l})=>h(g,{...l,ref:t,children:e??D({label:r,description:o})});E.displayName="CheckboxCard";export{E as CheckboxCard,C as CheckboxCardControl,m as CheckboxCardDescription,f as CheckboxCardIndicator,b as CheckboxCardLabel,me as CheckboxCardProvider,g as CheckboxCardRoot,c as useCheckboxCardContext};

package/dist/checkbox-card/CheckboxCardAnatomy.d.cts

@@ -0,0 +1,6 @@
+import type * as React from 'react';
+/** @internal Anatomy a {@link CheckboxCard} draws from `label`/`description`. */
+export declare const CheckboxCardAnatomy: ({ label, description, }: {
+    label?: React.ReactNode | undefined;
+    description?: React.ReactNode | undefined;
+}) => React.JSX.Element;

package/dist/checkbox-card/CheckboxCardAnatomy.d.ts

@@ -0,0 +1,6 @@
+import type * as React from 'react';
+/** @internal Anatomy a {@link CheckboxCard} draws from `label`/`description`. */
+export declare const CheckboxCardAnatomy: ({ label, description, }: {
+    label?: React.ReactNode | undefined;
+    description?: React.ReactNode | undefined;
+}) => React.JSX.Element;

package/dist/checkbox-card/CheckboxCardControl.d.cts

@@ -1,27 +1,19 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { CheckboxCardControlProps } from './types.cjs';
 /**
- * The real `<input type="checkbox">` behind a {@link CheckboxCard}. Rendered
- * through {@link VisuallyHidden}, **not** `display: none` or `hidden` — a
- * removed input is out of the accessibility tree and out of the tab order,
- * which would leave the card unusable by keyboard and silent to a screen
- * reader. Clipped to 1×1 it stays focusable, announceable and submittable.
- *
- * Takes `name`, `value`, `required`, `disabled` and the checked state from the
- * card root, and wires `aria-labelledby`/`aria-describedby` to the
- * {@link CheckboxCardLabel} / {@link CheckboxCardDescription} automatically —
- * only when those parts are actually mounted, so the control never points at
- * an id that does not exist.
- *
- * Exactly one of these belongs in a card, and it must be a descendant of the
- * root `<label>` — that ancestry is what makes the whole card clickable.
+ * Real `<input type="checkbox">` behind {@link CheckboxCard}, rendered through {@link VisuallyHidden} to stay focusable, announceable, and submittable.
  *
  * @example
  * ```tsx
- * <CheckboxCard name="addons" value="backups">
+ * import { CheckboxCardControl, CheckboxCardLabel, CheckboxCardRoot } from '@skdx/react/primitives/checkbox-card';
+ *
+ * <CheckboxCardRoot name="addons" value="backups">
  *   <CheckboxCardControl />
  *   <CheckboxCardLabel>Automated backups</CheckboxCardLabel>
- * </CheckboxCard>
+ * </CheckboxCardRoot>
  * ```
  */
-export declare const CheckboxCardControl: React.ForwardRefExoticComponent<Omit<CheckboxCardControlProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+export declare const CheckboxCardControl: {
+    ({ ref: forwardedRef, ...props }: CheckboxCardControlProps): React.ReactNode;
+    displayName: string;
+};

package/dist/checkbox-card/CheckboxCardControl.d.ts

@@ -1,27 +1,19 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { CheckboxCardControlProps } from './types.js';
 /**
- * The real `<input type="checkbox">` behind a {@link CheckboxCard}. Rendered
- * through {@link VisuallyHidden}, **not** `display: none` or `hidden` — a
- * removed input is out of the accessibility tree and out of the tab order,
- * which would leave the card unusable by keyboard and silent to a screen
- * reader. Clipped to 1×1 it stays focusable, announceable and submittable.
- *
- * Takes `name`, `value`, `required`, `disabled` and the checked state from the
- * card root, and wires `aria-labelledby`/`aria-describedby` to the
- * {@link CheckboxCardLabel} / {@link CheckboxCardDescription} automatically —
- * only when those parts are actually mounted, so the control never points at
- * an id that does not exist.
- *
- * Exactly one of these belongs in a card, and it must be a descendant of the
- * root `<label>` — that ancestry is what makes the whole card clickable.
+ * Real `<input type="checkbox">` behind {@link CheckboxCard}, rendered through {@link VisuallyHidden} to stay focusable, announceable, and submittable.
  *
  * @example
  * ```tsx
- * <CheckboxCard name="addons" value="backups">
+ * import { CheckboxCardControl, CheckboxCardLabel, CheckboxCardRoot } from '@skdx/react/primitives/checkbox-card';
+ *
+ * <CheckboxCardRoot name="addons" value="backups">
  *   <CheckboxCardControl />
  *   <CheckboxCardLabel>Automated backups</CheckboxCardLabel>
- * </CheckboxCard>
+ * </CheckboxCardRoot>
  * ```
  */
-export declare const CheckboxCardControl: React.ForwardRefExoticComponent<Omit<CheckboxCardControlProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+export declare const CheckboxCardControl: {
+    ({ ref: forwardedRef, ...props }: CheckboxCardControlProps): React.ReactNode;
+    displayName: string;
+};

package/dist/checkbox-card/CheckboxCardDescription.d.cts

@@ -1,21 +1,20 @@
 import * as React from 'react';
 import type { CheckboxCardDescriptionProps } from './types.cjs';
 /**
- * Supporting copy under a {@link CheckboxCardLabel} — price, quota, caveat.
- * Registers itself with the card root on mount, which is what wires the
- * control's `aria-describedby` here, so the description is announced after the
- * name instead of being swallowed into it.
- *
- * Purely additive: leave it out and the control simply has no
- * `aria-describedby`.
+ * Supporting copy under a {@link CheckboxCardLabel} that registers on mount to wire the control's `aria-describedby`.
  *
  * @example
  * ```tsx
- * <CheckboxCard>
+ * import { CheckboxCardControl, CheckboxCardDescription, CheckboxCardLabel, CheckboxCardRoot } from '@skdx/react/primitives/checkbox-card';
+ *
+ * <CheckboxCardRoot>
  *   <CheckboxCardControl />
  *   <CheckboxCardLabel>Automated backups</CheckboxCardLabel>
  *   <CheckboxCardDescription>Nightly snapshots, kept for 30 days.</CheckboxCardDescription>
- * </CheckboxCard>
+ * </CheckboxCardRoot>
  * ```
  */
-export declare const CheckboxCardDescription: React.ForwardRefExoticComponent<Omit<CheckboxCardDescriptionProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export declare const CheckboxCardDescription: {
+    ({ ref: forwardedRef, ...props }: CheckboxCardDescriptionProps): React.ReactNode;
+    displayName: string;
+};

package/dist/checkbox-card/CheckboxCardDescription.d.ts

@@ -1,21 +1,20 @@
 import * as React from 'react';
 import type { CheckboxCardDescriptionProps } from './types.js';
 /**
- * Supporting copy under a {@link CheckboxCardLabel} — price, quota, caveat.
- * Registers itself with the card root on mount, which is what wires the
- * control's `aria-describedby` here, so the description is announced after the
- * name instead of being swallowed into it.
- *
- * Purely additive: leave it out and the control simply has no
- * `aria-describedby`.
+ * Supporting copy under a {@link CheckboxCardLabel} that registers on mount to wire the control's `aria-describedby`.
  *
  * @example
  * ```tsx
- * <CheckboxCard>
+ * import { CheckboxCardControl, CheckboxCardDescription, CheckboxCardLabel, CheckboxCardRoot } from '@skdx/react/primitives/checkbox-card';
+ *
+ * <CheckboxCardRoot>
  *   <CheckboxCardControl />
  *   <CheckboxCardLabel>Automated backups</CheckboxCardLabel>
  *   <CheckboxCardDescription>Nightly snapshots, kept for 30 days.</CheckboxCardDescription>
- * </CheckboxCard>
+ * </CheckboxCardRoot>
  * ```
  */
-export declare const CheckboxCardDescription: React.ForwardRefExoticComponent<Omit<CheckboxCardDescriptionProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export declare const CheckboxCardDescription: {
+    ({ ref: forwardedRef, ...props }: CheckboxCardDescriptionProps): React.ReactNode;
+    displayName: string;
+};

package/dist/checkbox-card/CheckboxCardIndicator.d.cts

@@ -1,22 +1,20 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { CheckboxCardIndicatorProps } from './types.cjs';
 /**
- * The decorative check mark (or empty box) drawn on a {@link CheckboxCard}.
- * Mirrors the card's `data-state` and `data-disabled`.
- *
- * Unlike `CheckboxIndicator` this stays mounted when unchecked, because on a
- * card the indicator is the *box*, not just the tick — unmounting it would
- * collapse the card's layout on every deselect. It is `aria-hidden`: the real
- * `<input>` already announces the checked state, and a second copy would make
- * a screen reader say it twice.
+ * Decorative check mark on {@link CheckboxCard} — stays mounted when unchecked (indicator is the box, not just tick). `aria-hidden` (real input announces state).
  *
  * @example
  * ```tsx
- * <CheckboxCard defaultChecked>
+ * import { CheckboxCardRoot, CheckboxCardControl, CheckboxCardIndicator, CheckboxCardLabel } from '@skdx/react/primitives/checkbox-card';
+ *
+ * <CheckboxCardRoot defaultChecked>
  *   <CheckboxCardControl />
  *   <CheckboxCardIndicator>✓</CheckboxCardIndicator>
  *   <CheckboxCardLabel>Automated backups</CheckboxCardLabel>
- * </CheckboxCard>
+ * </CheckboxCardRoot>
  * ```
  */
-export declare const CheckboxCardIndicator: React.ForwardRefExoticComponent<Omit<CheckboxCardIndicatorProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export declare const CheckboxCardIndicator: {
+    ({ ref: forwardedRef, ...props }: CheckboxCardIndicatorProps): React.ReactNode;
+    displayName: string;
+};

package/dist/checkbox-card/CheckboxCardIndicator.d.ts

@@ -1,22 +1,20 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { CheckboxCardIndicatorProps } from './types.js';
 /**
- * The decorative check mark (or empty box) drawn on a {@link CheckboxCard}.
- * Mirrors the card's `data-state` and `data-disabled`.
- *
- * Unlike `CheckboxIndicator` this stays mounted when unchecked, because on a
- * card the indicator is the *box*, not just the tick — unmounting it would
- * collapse the card's layout on every deselect. It is `aria-hidden`: the real
- * `<input>` already announces the checked state, and a second copy would make
- * a screen reader say it twice.
+ * Decorative check mark on {@link CheckboxCard} — stays mounted when unchecked (indicator is the box, not just tick). `aria-hidden` (real input announces state).
  *
  * @example
  * ```tsx
- * <CheckboxCard defaultChecked>
+ * import { CheckboxCardRoot, CheckboxCardControl, CheckboxCardIndicator, CheckboxCardLabel } from '@skdx/react/primitives/checkbox-card';
+ *
+ * <CheckboxCardRoot defaultChecked>
  *   <CheckboxCardControl />
  *   <CheckboxCardIndicator>✓</CheckboxCardIndicator>
  *   <CheckboxCardLabel>Automated backups</CheckboxCardLabel>
- * </CheckboxCard>
+ * </CheckboxCardRoot>
  * ```
  */
-export declare const CheckboxCardIndicator: React.ForwardRefExoticComponent<Omit<CheckboxCardIndicatorProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export declare const CheckboxCardIndicator: {
+    ({ ref: forwardedRef, ...props }: CheckboxCardIndicatorProps): React.ReactNode;
+    displayName: string;
+};

package/dist/checkbox-card/CheckboxCardLabel.d.cts

@@ -1,21 +1,19 @@
 import * as React from 'react';
 import type { CheckboxCardLabelProps } from './types.cjs';
 /**
- * The card's title line, and the control's accessible name via
- * `aria-labelledby`.
- *
- * Renders a `<span>`, not a `<label>`: the card root is already the label, and
- * nesting a second one is invalid HTML. It registers itself with the root on
- * mount so the control only points `aria-labelledby` here while this part
- * exists — omit it and the control falls back to the native implicit label,
- * naming itself from the card's whole text content (description included).
+ * The card's title line, rendered as a `<span>` that registers on mount to wire the control's `aria-labelledby`.
  *
  * @example
  * ```tsx
- * <CheckboxCard>
+ * import { CheckboxCardControl, CheckboxCardLabel, CheckboxCardRoot } from '@skdx/react/primitives/checkbox-card';
+ *
+ * <CheckboxCardRoot>
  *   <CheckboxCardControl />
  *   <CheckboxCardLabel>Automated backups</CheckboxCardLabel>
- * </CheckboxCard>
+ * </CheckboxCardRoot>
  * ```
  */
-export declare const CheckboxCardLabel: React.ForwardRefExoticComponent<Omit<CheckboxCardLabelProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export declare const CheckboxCardLabel: {
+    ({ ref: forwardedRef, ...props }: CheckboxCardLabelProps): React.ReactNode;
+    displayName: string;
+};

package/dist/checkbox-card/CheckboxCardLabel.d.ts

@@ -1,21 +1,19 @@
 import * as React from 'react';
 import type { CheckboxCardLabelProps } from './types.js';
 /**
- * The card's title line, and the control's accessible name via
- * `aria-labelledby`.
- *
- * Renders a `<span>`, not a `<label>`: the card root is already the label, and
- * nesting a second one is invalid HTML. It registers itself with the root on
- * mount so the control only points `aria-labelledby` here while this part
- * exists — omit it and the control falls back to the native implicit label,
- * naming itself from the card's whole text content (description included).
+ * The card's title line, rendered as a `<span>` that registers on mount to wire the control's `aria-labelledby`.
  *
  * @example
  * ```tsx
- * <CheckboxCard>
+ * import { CheckboxCardControl, CheckboxCardLabel, CheckboxCardRoot } from '@skdx/react/primitives/checkbox-card';
+ *
+ * <CheckboxCardRoot>
  *   <CheckboxCardControl />
  *   <CheckboxCardLabel>Automated backups</CheckboxCardLabel>
- * </CheckboxCard>
+ * </CheckboxCardRoot>
  * ```
  */
-export declare const CheckboxCardLabel: React.ForwardRefExoticComponent<Omit<CheckboxCardLabelProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export declare const CheckboxCardLabel: {
+    ({ ref: forwardedRef, ...props }: CheckboxCardLabelProps): React.ReactNode;
+    displayName: string;
+};

package/dist/checkbox-card/index.d.cts

@@ -1,6 +1,2 @@
-export * from './CheckboxCard.cjs';
-export { CheckboxCardControl } from './CheckboxCardControl.cjs';
-export { CheckboxCardIndicator } from './CheckboxCardIndicator.cjs';
-export { CheckboxCardLabel } from './CheckboxCardLabel.cjs';
-export { CheckboxCardDescription } from './CheckboxCardDescription.cjs';
-export type { CheckboxCardProps, CheckboxCardControlProps, CheckboxCardIndicatorProps, CheckboxCardLabelProps, CheckboxCardDescriptionProps, } from './types.cjs';
+export { CheckboxCard } from './CheckboxCard.cjs';
+export type { CheckboxCardProps, CheckboxCardHandle } from './types.cjs';

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

@@ -1,6 +1,2 @@
-export * from './CheckboxCard.js';
-export { CheckboxCardControl } from './CheckboxCardControl.js';
-export { CheckboxCardIndicator } from './CheckboxCardIndicator.js';
-export { CheckboxCardLabel } from './CheckboxCardLabel.js';
-export { CheckboxCardDescription } from './CheckboxCardDescription.js';
-export type { CheckboxCardProps, CheckboxCardControlProps, CheckboxCardIndicatorProps, CheckboxCardLabelProps, CheckboxCardDescriptionProps, } from './types.js';
+export { CheckboxCard } from './CheckboxCard.js';
+export type { CheckboxCardProps, CheckboxCardHandle } from './types.js';

package/dist/checkbox-card/primitives.d.cts

@@ -0,0 +1,22 @@
+/**
+ * Primitives for `CheckboxCard` — manual composition escape hatch.
+ *
+ * @example
+ * ```tsx
+ * import { CheckboxCardRoot, CheckboxCardControl, CheckboxCardIndicator, CheckboxCardLabel, CheckboxCardDescription } from '@skdx/react/primitives/checkbox-card';
+ *
+ * <CheckboxCardRoot name="addons" value="backups">
+ *   <CheckboxCardControl />
+ *   <img src="/backups.svg" alt="" />
+ *   <CheckboxCardIndicator>✓</CheckboxCardIndicator>
+ *   <CheckboxCardLabel>Automated backups</CheckboxCardLabel>
+ *   <CheckboxCardDescription>Nightly snapshots, kept for 30 days.</CheckboxCardDescription>
+ * </CheckboxCardRoot>
+ * ```
+ */
+export { CheckboxCardRoot } from './CheckboxCard.cjs';
+export { CheckboxCardControl } from './CheckboxCardControl.cjs';
+export { CheckboxCardIndicator } from './CheckboxCardIndicator.cjs';
+export { CheckboxCardLabel } from './CheckboxCardLabel.cjs';
+export { CheckboxCardDescription } from './CheckboxCardDescription.cjs';
+export type { CheckboxCardRootProps, CheckboxCardControlProps, CheckboxCardIndicatorProps, CheckboxCardLabelProps, CheckboxCardDescriptionProps, } from './types.cjs';