@tamagui/checkbox 1.28.0 → 1.28.2

package/dist/cjs/Checkbox.js

@@ -29,8 +29,9 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var Checkbox_exports = {};
 __export(Checkbox_exports, {
   BubbleInput: () => BubbleInput,
-  Checkbox: () => Checkbox,
+  Checkbox: () => Checkbox2,
   CheckboxFrame: () => CheckboxFrame,
+  CheckboxStyledContext: () => CheckboxStyledContext,
   createCheckboxScope: () => createCheckboxScope,
   getState: () => getState,
   isIndeterminate: () => isIndeterminate
@@ -48,6 +49,10 @@ var import_label = require("@tamagui/label");
 var import_stacks = require("@tamagui/stacks");
 var import_use_controllable_state = require("@tamagui/use-controllable-state");
 var React = __toESM(require("react"));
+const CheckboxStyledContext = (0, import_core.createStyledContext)({
+  size: "$true",
+  scaleIcon: 1
+});
 function isIndeterminate(checked) {
   return checked === "indeterminate";
 }
@@ -101,7 +106,8 @@ const BubbleInput = (props) => {
 const INDICATOR_NAME = "CheckboxIndicator";
 const CheckboxIndicatorFrame = (0, import_core.styled)(import_stacks.ThemeableStack, {
   // use Checkbox for easier themes
-  name: INDICATOR_NAME
+  name: INDICATOR_NAME,
+  context: CheckboxStyledContext
 });
 const CheckboxIndicator = CheckboxIndicatorFrame.extractable(
   React.forwardRef(
@@ -114,7 +120,8 @@ const CheckboxIndicator = CheckboxIndicatorFrame.extractable(
         ...indicatorProps
       } = props;
       const context = useCheckboxContext(INDICATOR_NAME, __scopeCheckbox);
-      const iconSize = (typeof context.size === "number" ? context.size * 0.65 : (0, import_font_size.getFontSize)(context.size)) * context.scaleIcon;
+      const styledContext = React.useContext(CheckboxStyledContext);
+      const iconSize = (typeof styledContext.size === "number" ? styledContext.size * 0.65 : (0, import_font_size.getFontSize)(styledContext.size)) * styledContext.scaleIcon;
       const theme = (0, import_core.useTheme)();
       const getThemedIcon = (0, import_helpers_tamagui.useGetThemedIcon)({ size: iconSize, color: theme.color });
       const childrens = React.Children.toArray(childrenProp);
@@ -145,6 +152,7 @@ const CHECKBOX_NAME = "Checkbox";
 const CheckboxFrame = (0, import_core.styled)(import_stacks.ThemeableStack, {
   name: CHECKBOX_NAME,
   tag: "button",
+  context: CheckboxStyledContext,
   variants: {
     unstyled: {
       false: {
@@ -179,142 +187,140 @@ const CheckboxFrame = (0, import_core.styled)(import_stacks.ThemeableStack, {
 });
 const [createCheckboxContext, createCheckboxScope] = (0, import_create_context.createContextScope)(CHECKBOX_NAME);
 const [CheckboxProvider, useCheckboxContext] = createCheckboxContext(CHECKBOX_NAME);
-const Checkbox = (0, import_core.withStaticProperties)(
-  CheckboxFrame.extractable(
-    React.forwardRef(function Checkbox2(props, forwardedRef) {
-      const {
-        __scopeCheckbox,
-        labelledBy: ariaLabelledby,
+const CheckboxComponent = CheckboxFrame.extractable(
+  React.forwardRef(function Checkbox(props, forwardedRef) {
+    const {
+      __scopeCheckbox,
+      labelledBy: ariaLabelledby,
+      name,
+      checked: checkedProp,
+      defaultChecked,
+      required,
+      scaleSize = 0.45,
+      sizeAdjust = 0,
+      disabled,
+      value = "on",
+      onCheckedChange,
+      native,
+      ...checkboxProps
+    } = props;
+    const [button, setButton] = React.useState(null);
+    const composedRefs = (0, import_core.useComposedRefs)(forwardedRef, (node) => setButton(node));
+    const hasConsumerStoppedPropagationRef = React.useRef(false);
+    const propsActive = (0, import_core.useProps)(props);
+    const isFormControl = import_core.isWeb ? button ? Boolean(button.closest("form")) : true : false;
+    const [checked = false, setChecked] = (0, import_use_controllable_state.useControllableState)({
+      prop: checkedProp,
+      defaultProp: defaultChecked,
+      onChange: onCheckedChange
+    });
+    const styledContext = React.useContext(CheckboxStyledContext);
+    const adjustedSize = (0, import_core.getVariableValue)(
+      (0, import_get_token.getSize)(propsActive.size ?? (styledContext == null ? void 0 : styledContext.size) ?? "$true", {
+        shift: sizeAdjust
+      })
+    );
+    const size = scaleSize ? Math.round(adjustedSize * scaleSize) : adjustedSize;
+    const labelId = (0, import_label.useLabelContext)(button);
+    const labelledBy = ariaLabelledby || labelId;
+    if (process.env.TAMAGUI_TARGET === "native") {
+      React.useEffect(() => {
+        if (!props.id)
+          return;
+        return (0, import_focusable.registerFocusable)(props.id, {
+          focusAndSelect: () => {
+            setChecked((x) => !x);
+          },
+          focus: () => {
+          }
+        });
+      }, [props.id, setChecked]);
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckboxProvider, { scope: __scopeCheckbox, state: checked, disabled, children: import_core.isWeb && native ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      BubbleInput,
+      {
+        control: button,
+        bubbles: !hasConsumerStoppedPropagationRef.current,
         name,
-        checked: checkedProp,
-        defaultChecked,
+        value,
+        checked,
         required,
-        scaleIcon = 1,
-        scaleSize = 0.45,
-        sizeAdjust = 0,
         disabled,
-        value = "on",
-        onCheckedChange,
-        native,
-        ...checkboxProps
-      } = props;
-      const [button, setButton] = React.useState(null);
-      const composedRefs = (0, import_core.useComposedRefs)(forwardedRef, (node) => setButton(node));
-      const hasConsumerStoppedPropagationRef = React.useRef(false);
-      const propsActive = (0, import_core.useProps)(props);
-      const isFormControl = import_core.isWeb ? button ? Boolean(button.closest("form")) : true : false;
-      const [checked = false, setChecked] = (0, import_use_controllable_state.useControllableState)({
-        prop: checkedProp,
-        defaultProp: defaultChecked,
-        onChange: onCheckedChange
-      });
-      const adjustedSize = (0, import_core.getVariableValue)(
-        (0, import_get_token.getSize)(propsActive.size, {
-          shift: sizeAdjust
-        })
-      );
-      const size = scaleSize ? Math.round(adjustedSize * scaleSize) : adjustedSize;
-      const labelId = (0, import_label.useLabelContext)(button);
-      const labelledBy = ariaLabelledby || labelId;
-      if (process.env.TAMAGUI_TARGET === "native") {
-        React.useEffect(() => {
-          if (!props.id)
-            return;
-          return (0, import_focusable.registerFocusable)(props.id, {
-            focusAndSelect: () => {
-              setChecked((x) => !x);
-            },
-            focus: () => {
-            }
-          });
-        }, [props.id, setChecked]);
+        id: props.id
       }
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        CheckboxProvider,
+    ) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        CheckboxFrame,
         {
-          scope: __scopeCheckbox,
-          state: checked,
+          width: size,
+          height: size,
+          tag: "button",
+          role: "checkbox",
+          "aria-labelledby": labelledBy,
+          "aria-checked": isIndeterminate(checked) ? "mixed" : checked,
+          "aria-required": required,
+          "data-state": getState(checked),
+          "data-disabled": disabled ? "" : void 0,
           disabled,
-          size,
-          scaleIcon,
-          children: import_core.isWeb && native ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-            BubbleInput,
+          ...checkboxProps,
+          ref: composedRefs,
+          ...import_core.isWeb && {
+            type: "button",
+            value,
+            onKeyDown: (0, import_core.composeEventHandlers)(
+              props.onKeyDown,
+              (event) => {
+                if (event.key === "Enter")
+                  event.preventDefault();
+              }
+            )
+          },
+          onPress: (0, import_core.composeEventHandlers)(props.onPress, (event) => {
+            setChecked(
+              (prevChecked) => isIndeterminate(prevChecked) ? true : !prevChecked
+            );
+            if (isFormControl) {
+              hasConsumerStoppedPropagationRef.current = event.isPropagationStopped();
+              if (!hasConsumerStoppedPropagationRef.current)
+                event.stopPropagation();
+            }
+          }),
+          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            CheckboxStyledContext.Provider,
             {
-              control: button,
-              bubbles: !hasConsumerStoppedPropagationRef.current,
-              name,
-              value,
-              checked,
-              required,
-              disabled,
-              id: props.id
+              size: propsActive.size ?? (styledContext == null ? void 0 : styledContext.size) ?? "$true",
+              scaleIcon: props.scaleIcon ?? (styledContext == null ? void 0 : styledContext.scaleIcon) ?? 1,
+              children: propsActive.children
             }
-          ) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-              CheckboxFrame,
-              {
-                width: size,
-                height: size,
-                tag: "button",
-                role: "checkbox",
-                "aria-labelledby": labelledBy,
-                "aria-checked": isIndeterminate(checked) ? "mixed" : checked,
-                "aria-required": required,
-                "data-state": getState(checked),
-                "data-disabled": disabled ? "" : void 0,
-                disabled,
-                ...checkboxProps,
-                ref: composedRefs,
-                ...import_core.isWeb && {
-                  type: "button",
-                  value,
-                  onKeyDown: (0, import_core.composeEventHandlers)(
-                    props.onKeyDown,
-                    (event) => {
-                      if (event.key === "Enter")
-                        event.preventDefault();
-                    }
-                  )
-                },
-                onPress: (0, import_core.composeEventHandlers)(props.onPress, (event) => {
-                  setChecked(
-                    (prevChecked) => isIndeterminate(prevChecked) ? true : !prevChecked
-                  );
-                  if (isFormControl) {
-                    hasConsumerStoppedPropagationRef.current = event.isPropagationStopped();
-                    if (!hasConsumerStoppedPropagationRef.current)
-                      event.stopPropagation();
-                  }
-                })
-              }
-            ),
-            import_core.isWeb && isFormControl ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-              BubbleInput,
-              {
-                isHidden: true,
-                control: button,
-                bubbles: !hasConsumerStoppedPropagationRef.current,
-                name,
-                value,
-                checked,
-                required,
-                disabled
-              }
-            ) : null
-          ] })
+          )
         }
-      );
-    })
-  ),
-  {
-    Indicator: CheckboxIndicator
-  }
+      ),
+      import_core.isWeb && isFormControl ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        BubbleInput,
+        {
+          isHidden: true,
+          control: button,
+          bubbles: !hasConsumerStoppedPropagationRef.current,
+          name,
+          value,
+          checked,
+          required,
+          disabled
+        }
+      ) : null
+    ] }) });
+  })
 );
+const Checkbox2 = (0, import_core.withStaticProperties)(CheckboxComponent, {
+  Indicator: CheckboxIndicator,
+  Props: CheckboxStyledContext.Provider
+});
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   BubbleInput,
   Checkbox,
   CheckboxFrame,
+  CheckboxStyledContext,
   createCheckboxScope,
   getState,
   isIndeterminate

package/dist/cjs/Checkbox.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/Checkbox.tsx"],
-  "mappings": "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",
+  "mappings": "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",
   "names": ["Checkbox"]
 }

package/dist/esm/Checkbox.js

@@ -2,6 +2,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { usePrevious } from "@radix-ui/react-use-previous";
 import {
   composeEventHandlers,
+  createStyledContext,
   getVariableValue,
   isWeb,
   styled,
@@ -19,6 +20,10 @@ import { useLabelContext } from "@tamagui/label";
 import { ThemeableStack } from "@tamagui/stacks";
 import { useControllableState } from "@tamagui/use-controllable-state";
 import * as React from "react";
+const CheckboxStyledContext = createStyledContext({
+  size: "$true",
+  scaleIcon: 1
+});
 function isIndeterminate(checked) {
   return checked === "indeterminate";
 }
@@ -72,7 +77,8 @@ const BubbleInput = (props) => {
 const INDICATOR_NAME = "CheckboxIndicator";
 const CheckboxIndicatorFrame = styled(ThemeableStack, {
   // use Checkbox for easier themes
-  name: INDICATOR_NAME
+  name: INDICATOR_NAME,
+  context: CheckboxStyledContext
 });
 const CheckboxIndicator = CheckboxIndicatorFrame.extractable(
   React.forwardRef(
@@ -85,7 +91,8 @@ const CheckboxIndicator = CheckboxIndicatorFrame.extractable(
         ...indicatorProps
       } = props;
       const context = useCheckboxContext(INDICATOR_NAME, __scopeCheckbox);
-      const iconSize = (typeof context.size === "number" ? context.size * 0.65 : getFontSize(context.size)) * context.scaleIcon;
+      const styledContext = React.useContext(CheckboxStyledContext);
+      const iconSize = (typeof styledContext.size === "number" ? styledContext.size * 0.65 : getFontSize(styledContext.size)) * styledContext.scaleIcon;
       const theme = useTheme();
       const getThemedIcon = useGetThemedIcon({ size: iconSize, color: theme.color });
       const childrens = React.Children.toArray(childrenProp);
@@ -116,6 +123,7 @@ const CHECKBOX_NAME = "Checkbox";
 const CheckboxFrame = styled(ThemeableStack, {
   name: CHECKBOX_NAME,
   tag: "button",
+  context: CheckboxStyledContext,
   variants: {
     unstyled: {
       false: {
@@ -150,141 +158,139 @@ const CheckboxFrame = styled(ThemeableStack, {
 });
 const [createCheckboxContext, createCheckboxScope] = createContextScope(CHECKBOX_NAME);
 const [CheckboxProvider, useCheckboxContext] = createCheckboxContext(CHECKBOX_NAME);
-const Checkbox = withStaticProperties(
-  CheckboxFrame.extractable(
-    React.forwardRef(function Checkbox2(props, forwardedRef) {
-      const {
-        __scopeCheckbox,
-        labelledBy: ariaLabelledby,
+const CheckboxComponent = CheckboxFrame.extractable(
+  React.forwardRef(function Checkbox(props, forwardedRef) {
+    const {
+      __scopeCheckbox,
+      labelledBy: ariaLabelledby,
+      name,
+      checked: checkedProp,
+      defaultChecked,
+      required,
+      scaleSize = 0.45,
+      sizeAdjust = 0,
+      disabled,
+      value = "on",
+      onCheckedChange,
+      native,
+      ...checkboxProps
+    } = props;
+    const [button, setButton] = React.useState(null);
+    const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node));
+    const hasConsumerStoppedPropagationRef = React.useRef(false);
+    const propsActive = useProps(props);
+    const isFormControl = isWeb ? button ? Boolean(button.closest("form")) : true : false;
+    const [checked = false, setChecked] = useControllableState({
+      prop: checkedProp,
+      defaultProp: defaultChecked,
+      onChange: onCheckedChange
+    });
+    const styledContext = React.useContext(CheckboxStyledContext);
+    const adjustedSize = getVariableValue(
+      getSize(propsActive.size ?? (styledContext == null ? void 0 : styledContext.size) ?? "$true", {
+        shift: sizeAdjust
+      })
+    );
+    const size = scaleSize ? Math.round(adjustedSize * scaleSize) : adjustedSize;
+    const labelId = useLabelContext(button);
+    const labelledBy = ariaLabelledby || labelId;
+    if (process.env.TAMAGUI_TARGET === "native") {
+      React.useEffect(() => {
+        if (!props.id)
+          return;
+        return registerFocusable(props.id, {
+          focusAndSelect: () => {
+            setChecked((x) => !x);
+          },
+          focus: () => {
+          }
+        });
+      }, [props.id, setChecked]);
+    }
+    return /* @__PURE__ */ jsx(CheckboxProvider, { scope: __scopeCheckbox, state: checked, disabled, children: isWeb && native ? /* @__PURE__ */ jsx(
+      BubbleInput,
+      {
+        control: button,
+        bubbles: !hasConsumerStoppedPropagationRef.current,
         name,
-        checked: checkedProp,
-        defaultChecked,
+        value,
+        checked,
         required,
-        scaleIcon = 1,
-        scaleSize = 0.45,
-        sizeAdjust = 0,
         disabled,
-        value = "on",
-        onCheckedChange,
-        native,
-        ...checkboxProps
-      } = props;
-      const [button, setButton] = React.useState(null);
-      const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node));
-      const hasConsumerStoppedPropagationRef = React.useRef(false);
-      const propsActive = useProps(props);
-      const isFormControl = isWeb ? button ? Boolean(button.closest("form")) : true : false;
-      const [checked = false, setChecked] = useControllableState({
-        prop: checkedProp,
-        defaultProp: defaultChecked,
-        onChange: onCheckedChange
-      });
-      const adjustedSize = getVariableValue(
-        getSize(propsActive.size, {
-          shift: sizeAdjust
-        })
-      );
-      const size = scaleSize ? Math.round(adjustedSize * scaleSize) : adjustedSize;
-      const labelId = useLabelContext(button);
-      const labelledBy = ariaLabelledby || labelId;
-      if (process.env.TAMAGUI_TARGET === "native") {
-        React.useEffect(() => {
-          if (!props.id)
-            return;
-          return registerFocusable(props.id, {
-            focusAndSelect: () => {
-              setChecked((x) => !x);
-            },
-            focus: () => {
-            }
-          });
-        }, [props.id, setChecked]);
+        id: props.id
       }
-      return /* @__PURE__ */ jsx(
-        CheckboxProvider,
+    ) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        CheckboxFrame,
         {
-          scope: __scopeCheckbox,
-          state: checked,
+          width: size,
+          height: size,
+          tag: "button",
+          role: "checkbox",
+          "aria-labelledby": labelledBy,
+          "aria-checked": isIndeterminate(checked) ? "mixed" : checked,
+          "aria-required": required,
+          "data-state": getState(checked),
+          "data-disabled": disabled ? "" : void 0,
           disabled,
-          size,
-          scaleIcon,
-          children: isWeb && native ? /* @__PURE__ */ jsx(
-            BubbleInput,
+          ...checkboxProps,
+          ref: composedRefs,
+          ...isWeb && {
+            type: "button",
+            value,
+            onKeyDown: composeEventHandlers(
+              props.onKeyDown,
+              (event) => {
+                if (event.key === "Enter")
+                  event.preventDefault();
+              }
+            )
+          },
+          onPress: composeEventHandlers(props.onPress, (event) => {
+            setChecked(
+              (prevChecked) => isIndeterminate(prevChecked) ? true : !prevChecked
+            );
+            if (isFormControl) {
+              hasConsumerStoppedPropagationRef.current = event.isPropagationStopped();
+              if (!hasConsumerStoppedPropagationRef.current)
+                event.stopPropagation();
+            }
+          }),
+          children: /* @__PURE__ */ jsx(
+            CheckboxStyledContext.Provider,
             {
-              control: button,
-              bubbles: !hasConsumerStoppedPropagationRef.current,
-              name,
-              value,
-              checked,
-              required,
-              disabled,
-              id: props.id
+              size: propsActive.size ?? (styledContext == null ? void 0 : styledContext.size) ?? "$true",
+              scaleIcon: props.scaleIcon ?? (styledContext == null ? void 0 : styledContext.scaleIcon) ?? 1,
+              children: propsActive.children
             }
-          ) : /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx(
-              CheckboxFrame,
-              {
-                width: size,
-                height: size,
-                tag: "button",
-                role: "checkbox",
-                "aria-labelledby": labelledBy,
-                "aria-checked": isIndeterminate(checked) ? "mixed" : checked,
-                "aria-required": required,
-                "data-state": getState(checked),
-                "data-disabled": disabled ? "" : void 0,
-                disabled,
-                ...checkboxProps,
-                ref: composedRefs,
-                ...isWeb && {
-                  type: "button",
-                  value,
-                  onKeyDown: composeEventHandlers(
-                    props.onKeyDown,
-                    (event) => {
-                      if (event.key === "Enter")
-                        event.preventDefault();
-                    }
-                  )
-                },
-                onPress: composeEventHandlers(props.onPress, (event) => {
-                  setChecked(
-                    (prevChecked) => isIndeterminate(prevChecked) ? true : !prevChecked
-                  );
-                  if (isFormControl) {
-                    hasConsumerStoppedPropagationRef.current = event.isPropagationStopped();
-                    if (!hasConsumerStoppedPropagationRef.current)
-                      event.stopPropagation();
-                  }
-                })
-              }
-            ),
-            isWeb && isFormControl ? /* @__PURE__ */ jsx(
-              BubbleInput,
-              {
-                isHidden: true,
-                control: button,
-                bubbles: !hasConsumerStoppedPropagationRef.current,
-                name,
-                value,
-                checked,
-                required,
-                disabled
-              }
-            ) : null
-          ] })
+          )
         }
-      );
-    })
-  ),
-  {
-    Indicator: CheckboxIndicator
-  }
+      ),
+      isWeb && isFormControl ? /* @__PURE__ */ jsx(
+        BubbleInput,
+        {
+          isHidden: true,
+          control: button,
+          bubbles: !hasConsumerStoppedPropagationRef.current,
+          name,
+          value,
+          checked,
+          required,
+          disabled
+        }
+      ) : null
+    ] }) });
+  })
 );
+const Checkbox2 = withStaticProperties(CheckboxComponent, {
+  Indicator: CheckboxIndicator,
+  Props: CheckboxStyledContext.Provider
+});
 export {
   BubbleInput,
-  Checkbox,
+  Checkbox2 as Checkbox,
   CheckboxFrame,
+  CheckboxStyledContext,
   createCheckboxScope,
   getState,
   isIndeterminate