@tamagui/switch 1.123.15 → 1.123.16

package/dist/cjs/createSwitch.cjs

@@ -77,7 +77,8 @@ function createSwitch(createProps) {
         unstyled = process.env.TAMAGUI_HEADLESS === "1" ? !0 : unstyledProp ?? unstyledContext ?? !1,
         size = sizeProp ?? sizeContext ?? "$true",
         initialChecked = React.useRef(checked).current,
-        [thumbWidth, setThumbWidth] = React.useState(0),
+        initialWidth = (0, import_core.getVariableValue)(props.width, "size"),
+        [thumbWidth, setThumbWidth] = React.useState(typeof initialWidth == "number" ? initialWidth : 0),
         distance = frameWidth - thumbWidth,
         x = initialChecked ? checked ? 0 : -distance : checked ? distance : 0;
       return /* @__PURE__ */(0, import_jsx_runtime.jsx)(Thumb, {
@@ -91,7 +92,10 @@ function createSwitch(createProps) {
         }),
         alignSelf: initialChecked ? "flex-end" : "flex-start",
         x,
-        onLayout: (0, import_core.composeEventHandlers)(props.onLayout, e => setThumbWidth(e.nativeEvent.layout.width)),
+        onLayout: (0, import_core.composeEventHandlers)(props.onLayout, e => {
+          const next = e.nativeEvent.layout.width;
+          next !== thumbWidth && setThumbWidth(next);
+        }),
         checked,
         disabled,
         ...thumbProps
@@ -112,8 +116,16 @@ function createSwitch(createProps) {
           onChange: onCheckedChange,
           transition: !0
         }),
-        styledContext = React.useContext(import_StyledContext.SwitchStyledContext.context),
-        [frameWidth, setFrameWidth] = React.useState(0),
+        styledContext = React.useContext(import_StyledContext.SwitchStyledContext.context);
+      let estimatedInitialWidth = 0;
+      const estWidth = (0, import_core.getVariableValue)((0, import_core.getShorthandValue)(props, "width"), "size");
+      if (estWidth) {
+        const estPad = (0, import_core.getShorthandValue)(props, "paddingHorizontal") ?? (0, import_core.getShorthandValue)(props, "padding") ?? 0,
+          estLeftPad = (0, import_core.getShorthandValue)(props, "paddingLeft") ?? estPad ?? 0,
+          estRightPad = (0, import_core.getShorthandValue)(props, "paddingRight") ?? estPad ?? 0;
+        estimatedInitialWidth = estWidth - (estLeftPad ? (0, import_core.getVariableValue)(estLeftPad) : 0) - (estRightPad ? (0, import_core.getVariableValue)(estRightPad) : 0);
+      }
+      const [frameWidth, setFrameInnerWidth] = React.useState(estimatedInitialWidth),
         {
           switchProps,
           bubbleInput,
@@ -133,9 +145,10 @@ function createSwitch(createProps) {
           disabled,
           frameWidth
         }), [checked, disabled, frameWidth]),
-        handleLayout = React.useCallback(e => {
-          setFrameWidth(e.nativeEvent.layout.width);
-        }, [setFrameWidth]),
+        handleLayout = e => {
+          const next = e.nativeEvent.layout.width;
+          next !== frameWidth && setFrameInnerWidth(next);
+        },
         unstyled = styledContext.unstyled ?? props.unstyled ?? !1;
       return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(SwitchContext.Provider, {
         value,
@@ -160,7 +173,7 @@ function createSwitch(createProps) {
           children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.View, {
             style: measureContainerStyle,
             onLayout: handleLayout,
-            children: props.children
+            children: frameWidth ? props.children : null
           })
         }), bubbleInput]
       });

package/dist/cjs/createSwitch.js

@@ -43,7 +43,9 @@ function createSwitch(createProps) {
   ), Frame.staticConfig.context = import_StyledContext.SwitchStyledContext, Thumb.staticConfig.context = import_StyledContext.SwitchStyledContext;
   const SwitchThumbComponent = Thumb.styleable(
     function(props, forwardedRef) {
-      const { size: sizeProp, unstyled: unstyledProp, nativeID, ...thumbProps } = props, context = React.useContext(SwitchContext), { checked, disabled, frameWidth } = context, styledContext = import_StyledContext.SwitchStyledContext.useStyledContext(), { unstyled: unstyledContext, size: sizeContext } = styledContext, unstyled = process.env.TAMAGUI_HEADLESS === "1" ? !0 : unstyledProp ?? unstyledContext ?? !1, size = sizeProp ?? sizeContext ?? "$true", initialChecked = React.useRef(checked).current, [thumbWidth, setThumbWidth] = React.useState(0), distance = frameWidth - thumbWidth, x = initialChecked ? checked ? 0 : -distance : checked ? distance : 0;
+      const { size: sizeProp, unstyled: unstyledProp, nativeID, ...thumbProps } = props, context = React.useContext(SwitchContext), { checked, disabled, frameWidth } = context, styledContext = import_StyledContext.SwitchStyledContext.useStyledContext(), { unstyled: unstyledContext, size: sizeContext } = styledContext, unstyled = process.env.TAMAGUI_HEADLESS === "1" ? !0 : unstyledProp ?? unstyledContext ?? !1, size = sizeProp ?? sizeContext ?? "$true", initialChecked = React.useRef(checked).current, initialWidth = (0, import_core.getVariableValue)(props.width, "size"), [thumbWidth, setThumbWidth] = React.useState(
+        typeof initialWidth == "number" ? initialWidth : 0
+      ), distance = frameWidth - thumbWidth, x = initialChecked ? checked ? 0 : -distance : checked ? distance : 0;
       return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         Thumb,
         {
@@ -57,10 +59,10 @@ function createSwitch(createProps) {
           },
           alignSelf: initialChecked ? "flex-end" : "flex-start",
           x,
-          onLayout: (0, import_core.composeEventHandlers)(
-            props.onLayout,
-            (e) => setThumbWidth(e.nativeEvent.layout.width)
-          ),
+          onLayout: (0, import_core.composeEventHandlers)(props.onLayout, (e) => {
+            const next = e.nativeEvent.layout.width;
+            next !== thumbWidth && setThumbWidth(next);
+          }),
           checked,
           disabled,
           ...thumbProps
@@ -81,7 +83,14 @@ function createSwitch(createProps) {
         defaultProp: defaultChecked || !1,
         onChange: onCheckedChange,
         transition: !0
-      }), styledContext = React.useContext(import_StyledContext.SwitchStyledContext.context), [frameWidth, setFrameWidth] = React.useState(0), { switchProps, bubbleInput, switchRef } = (0, import_switch_headless.useSwitch)(
+      }), styledContext = React.useContext(import_StyledContext.SwitchStyledContext.context);
+      let estimatedInitialWidth = 0;
+      const estWidth = (0, import_core.getVariableValue)((0, import_core.getShorthandValue)(props, "width"), "size");
+      if (estWidth) {
+        const estPad = (0, import_core.getShorthandValue)(props, "paddingHorizontal") ?? (0, import_core.getShorthandValue)(props, "padding") ?? 0, estLeftPad = (0, import_core.getShorthandValue)(props, "paddingLeft") ?? estPad ?? 0, estRightPad = (0, import_core.getShorthandValue)(props, "paddingRight") ?? estPad ?? 0;
+        estimatedInitialWidth = estWidth - (estLeftPad ? (0, import_core.getVariableValue)(estLeftPad) : 0) - (estRightPad ? (0, import_core.getVariableValue)(estRightPad) : 0);
+      }
+      const [frameWidth, setFrameInnerWidth] = React.useState(estimatedInitialWidth), { switchProps, bubbleInput, switchRef } = (0, import_switch_headless.useSwitch)(
         // @ts-ignore
         props,
         [checked, setChecked],
@@ -92,12 +101,10 @@ function createSwitch(createProps) {
       const disabled = props.disabled, value = React.useMemo(
         () => ({ checked, disabled, frameWidth }),
         [checked, disabled, frameWidth]
-      ), handleLayout = React.useCallback(
-        (e) => {
-          setFrameWidth(e.nativeEvent.layout.width);
-        },
-        [setFrameWidth]
-      ), unstyled = styledContext.unstyled ?? props.unstyled ?? !1;
+      ), handleLayout = (e) => {
+        const next = e.nativeEvent.layout.width;
+        next !== frameWidth && setFrameInnerWidth(next);
+      }, unstyled = styledContext.unstyled ?? props.unstyled ?? !1;
       return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(SwitchContext.Provider, { value, children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           Frame,
@@ -117,7 +124,7 @@ function createSwitch(createProps) {
             },
             checked,
             disabled,
-            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.View, { style: measureContainerStyle, onLayout: handleLayout, children: props.children })
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.View, { style: measureContainerStyle, onLayout: handleLayout, children: frameWidth ? props.children : null })
           }
         ),
         bubbleInput

package/dist/cjs/createSwitch.js.map

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

package/dist/cjs/createSwitch.native.js

@@ -36,7 +36,7 @@ function createSwitch(createProps) {
   var { disableActiveTheme, Frame = import_Switch.SwitchFrame, Thumb = import_Switch.SwitchThumb } = createProps;
   process.env.NODE_ENV === "development" && (Frame !== import_Switch.SwitchFrame && Frame.staticConfig.context && Frame.staticConfig.context !== import_StyledContext.SwitchStyledContext || Thumb !== import_Switch.SwitchThumb && Thumb.staticConfig.context && Thumb.staticConfig.context !== import_StyledContext.SwitchStyledContext) && console.warn("Warning: createSwitch() needs to control context to pass checked state from Frame to Thumb, any custom context passed will be overridden."), Frame.staticConfig.context = import_StyledContext.SwitchStyledContext, Thumb.staticConfig.context = import_StyledContext.SwitchStyledContext;
   var SwitchThumbComponent = Thumb.styleable(function(props, forwardedRef) {
-    var { size: sizeProp, unstyled: unstyledProp, nativeID, ...thumbProps } = props, context = React.useContext(SwitchContext), { checked, disabled, frameWidth } = context, styledContext = import_StyledContext.SwitchStyledContext.useStyledContext(), { unstyled: unstyledContext, size: sizeContext } = styledContext, _ref, unstyled = process.env.TAMAGUI_HEADLESS === "1" ? !0 : (_ref = unstyledProp ?? unstyledContext) !== null && _ref !== void 0 ? _ref : !1, _ref1, size = (_ref1 = sizeProp ?? sizeContext) !== null && _ref1 !== void 0 ? _ref1 : "$true", initialChecked = React.useRef(checked).current, [thumbWidth, setThumbWidth] = React.useState(0), distance = frameWidth - thumbWidth, x = initialChecked ? checked ? 0 : -distance : checked ? distance : 0;
+    var { size: sizeProp, unstyled: unstyledProp, nativeID, ...thumbProps } = props, context = React.useContext(SwitchContext), { checked, disabled, frameWidth } = context, styledContext = import_StyledContext.SwitchStyledContext.useStyledContext(), { unstyled: unstyledContext, size: sizeContext } = styledContext, _ref, unstyled = process.env.TAMAGUI_HEADLESS === "1" ? !0 : (_ref = unstyledProp ?? unstyledContext) !== null && _ref !== void 0 ? _ref : !1, _ref1, size = (_ref1 = sizeProp ?? sizeContext) !== null && _ref1 !== void 0 ? _ref1 : "$true", initialChecked = React.useRef(checked).current, initialWidth = (0, import_core.getVariableValue)(props.width, "size"), [thumbWidth, setThumbWidth] = React.useState(typeof initialWidth == "number" ? initialWidth : 0), distance = frameWidth - thumbWidth, x = initialChecked ? checked ? 0 : -distance : checked ? distance : 0;
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Thumb, {
       ref: forwardedRef,
       unstyled,
@@ -49,7 +49,8 @@ function createSwitch(createProps) {
       alignSelf: initialChecked ? "flex-end" : "flex-start",
       x,
       onLayout: (0, import_core.composeEventHandlers)(props.onLayout, function(e) {
-        return setThumbWidth(e.nativeEvent.layout.width);
+        var next = e.nativeEvent.layout.width;
+        next !== thumbWidth && setThumbWidth(next);
       }),
       // expected variants
       checked,
@@ -62,7 +63,12 @@ function createSwitch(createProps) {
       defaultProp: defaultChecked || !1,
       onChange: onCheckedChange,
       transition: !0
-    }), styledContext = React.useContext(import_StyledContext.SwitchStyledContext.context), [frameWidth, setFrameWidth] = React.useState(0), { switchProps, bubbleInput, switchRef } = (0, import_switch_headless.useSwitch)(
+    }), styledContext = React.useContext(import_StyledContext.SwitchStyledContext.context), estimatedInitialWidth = 0, estWidth = (0, import_core.getVariableValue)((0, import_core.getShorthandValue)(props, "width"), "size");
+    if (estWidth) {
+      var _getShorthandValue, _ref, estPad = (_ref = (_getShorthandValue = (0, import_core.getShorthandValue)(props, "paddingHorizontal")) !== null && _getShorthandValue !== void 0 ? _getShorthandValue : (0, import_core.getShorthandValue)(props, "padding")) !== null && _ref !== void 0 ? _ref : 0, _getShorthandValue1, _ref1, estLeftPad = (_ref1 = (_getShorthandValue1 = (0, import_core.getShorthandValue)(props, "paddingLeft")) !== null && _getShorthandValue1 !== void 0 ? _getShorthandValue1 : estPad) !== null && _ref1 !== void 0 ? _ref1 : 0, _getShorthandValue2, _ref2, estRightPad = (_ref2 = (_getShorthandValue2 = (0, import_core.getShorthandValue)(props, "paddingRight")) !== null && _getShorthandValue2 !== void 0 ? _getShorthandValue2 : estPad) !== null && _ref2 !== void 0 ? _ref2 : 0;
+      estimatedInitialWidth = estWidth - (estLeftPad ? (0, import_core.getVariableValue)(estLeftPad) : 0) - (estRightPad ? (0, import_core.getVariableValue)(estRightPad) : 0);
+    }
+    var [frameWidth, setFrameInnerWidth] = React.useState(estimatedInitialWidth), { switchProps, bubbleInput, switchRef } = (0, import_switch_headless.useSwitch)(
       // @ts-ignore
       props,
       [
@@ -103,11 +109,10 @@ function createSwitch(createProps) {
       checked,
       disabled,
       frameWidth
-    ]), handleLayout = React.useCallback(function(e) {
-      setFrameWidth(e.nativeEvent.layout.width);
-    }, [
-      setFrameWidth
-    ]), _styledContext_unstyled, _ref, unstyled = (_ref = (_styledContext_unstyled = styledContext.unstyled) !== null && _styledContext_unstyled !== void 0 ? _styledContext_unstyled : props.unstyled) !== null && _ref !== void 0 ? _ref : !1, _styledContext_size, _ref1;
+    ]), handleLayout = function(e) {
+      var next = e.nativeEvent.layout.width;
+      next !== frameWidth && setFrameInnerWidth(next);
+    }, _styledContext_unstyled, _ref3, unstyled = (_ref3 = (_styledContext_unstyled = styledContext.unstyled) !== null && _styledContext_unstyled !== void 0 ? _styledContext_unstyled : props.unstyled) !== null && _ref3 !== void 0 ? _ref3 : !1, _styledContext_size, _ref4;
     return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(SwitchContext.Provider, {
       value,
       children: [
@@ -118,7 +123,7 @@ function createSwitch(createProps) {
             type: "button"
           },
           ...!unstyled && {
-            size: (_ref1 = (_styledContext_size = styledContext.size) !== null && _styledContext_size !== void 0 ? _styledContext_size : props.size) !== null && _ref1 !== void 0 ? _ref1 : "$true"
+            size: (_ref4 = (_styledContext_size = styledContext.size) !== null && _styledContext_size !== void 0 ? _styledContext_size : props.size) !== null && _ref4 !== void 0 ? _ref4 : "$true"
           },
           unstyled,
           ...props,
@@ -133,7 +138,7 @@ function createSwitch(createProps) {
           children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.View, {
             style: measureContainerStyle,
             onLayout: handleLayout,
-            children: props.children
+            children: frameWidth ? props.children : null
           })
         }),
         bubbleInput

package/dist/cjs/createSwitch.native.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/Users/n8/tamagui/code/ui/switch/src/createSwitch.tsx"],
-  "mappings": "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",
-  "names": ["SwitchContext", "React", "createContext", "checked", "disabled", "frameWidth", "createSwitch", "createProps", "disableActiveTheme", "Frame", "DefaultSwitchFrame", "Thumb", "SwitchThumb", "process", "env", "NODE_ENV", "staticConfig", "context", "SwitchStyledContext", "console", "warn", "SwitchThumbComponent", "styleable", "props", "forwardedRef", "size", "sizeProp", "unstyled", "unstyledProp", "nativeID", "thumbProps", "useContext", "styledContext", "useStyledContext", "unstyledContext", "sizeContext", "TAMAGUI_HEADLESS", "initialChecked", "useRef", "current", "thumbWidth", "setThumbWidth", "useState", "distance", "x", "_jsx", "ref", "theme", "alignSelf", "onLayout", "composeEventHandlers", "e", "nativeEvent", "layout", "width", "SwitchComponent", "_props", "native", "nativeProps", "checkedProp", "defaultChecked", "onCheckedChange", "setChecked", "useControllableState", "prop", "defaultProp", "onChange", "transition", "setFrameWidth", "switchProps", "bubbleInput", "switchRef", "useSwitch", "useEffect", "id", "registerFocusable", "focusAndSelect", "value", "focus", "renderNative", "shouldRenderNativePlatform", "NativeSwitch", "onValueChange", "useMemo", "handleLayout", "useCallback", "_jsxs", "Provider", "tag", "isWeb", "type", "themeShallow", "View", "style", "measureContainerStyle", "children", "disableTheme", "withStaticProperties", "flex"]
+  "mappings": "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",
+  "names": ["SwitchContext", "React", "createContext", "checked", "disabled", "frameWidth", "createSwitch", "createProps", "disableActiveTheme", "Frame", "DefaultSwitchFrame", "Thumb", "SwitchThumb", "process", "env", "NODE_ENV", "staticConfig", "context", "SwitchStyledContext", "console", "warn", "SwitchThumbComponent", "styleable", "props", "forwardedRef", "size", "sizeProp", "unstyled", "unstyledProp", "nativeID", "thumbProps", "useContext", "styledContext", "useStyledContext", "unstyledContext", "sizeContext", "TAMAGUI_HEADLESS", "initialChecked", "useRef", "current", "initialWidth", "getVariableValue", "width", "thumbWidth", "setThumbWidth", "useState", "distance", "x", "_jsx", "ref", "theme", "alignSelf", "onLayout", "composeEventHandlers", "e", "next", "nativeEvent", "layout", "SwitchComponent", "_props", "native", "nativeProps", "checkedProp", "defaultChecked", "onCheckedChange", "setChecked", "useControllableState", "prop", "defaultProp", "onChange", "transition", "estimatedInitialWidth", "estWidth", "getShorthandValue", "estPad", "estLeftPad", "estRightPad", "setFrameInnerWidth", "switchProps", "bubbleInput", "switchRef", "useSwitch", "useEffect", "id", "registerFocusable", "focusAndSelect", "value", "focus", "renderNative", "shouldRenderNativePlatform", "NativeSwitch", "onValueChange", "useMemo", "handleLayout", "_jsxs", "Provider", "tag", "isWeb", "type", "themeShallow", "View", "style", "measureContainerStyle", "children", "disableTheme", "withStaticProperties", "flex"]
 }

package/dist/esm/createSwitch.js

@@ -1,5 +1,7 @@
 import {
   composeEventHandlers,
+  getShorthandValue,
+  getVariableValue,
   isWeb,
   shouldRenderNativePlatform,
   withStaticProperties
@@ -28,7 +30,9 @@ function createSwitch(createProps) {
   ), Frame.staticConfig.context = SwitchStyledContext, Thumb.staticConfig.context = SwitchStyledContext;
   const SwitchThumbComponent = Thumb.styleable(
     function(props, forwardedRef) {
-      const { size: sizeProp, unstyled: unstyledProp, nativeID, ...thumbProps } = props, context = React.useContext(SwitchContext), { checked, disabled, frameWidth } = context, styledContext = SwitchStyledContext.useStyledContext(), { unstyled: unstyledContext, size: sizeContext } = styledContext, unstyled = process.env.TAMAGUI_HEADLESS === "1" ? !0 : unstyledProp ?? unstyledContext ?? !1, size = sizeProp ?? sizeContext ?? "$true", initialChecked = React.useRef(checked).current, [thumbWidth, setThumbWidth] = React.useState(0), distance = frameWidth - thumbWidth, x = initialChecked ? checked ? 0 : -distance : checked ? distance : 0;
+      const { size: sizeProp, unstyled: unstyledProp, nativeID, ...thumbProps } = props, context = React.useContext(SwitchContext), { checked, disabled, frameWidth } = context, styledContext = SwitchStyledContext.useStyledContext(), { unstyled: unstyledContext, size: sizeContext } = styledContext, unstyled = process.env.TAMAGUI_HEADLESS === "1" ? !0 : unstyledProp ?? unstyledContext ?? !1, size = sizeProp ?? sizeContext ?? "$true", initialChecked = React.useRef(checked).current, initialWidth = getVariableValue(props.width, "size"), [thumbWidth, setThumbWidth] = React.useState(
+        typeof initialWidth == "number" ? initialWidth : 0
+      ), distance = frameWidth - thumbWidth, x = initialChecked ? checked ? 0 : -distance : checked ? distance : 0;
       return /* @__PURE__ */ jsx(
         Thumb,
         {
@@ -42,10 +46,10 @@ function createSwitch(createProps) {
           },
           alignSelf: initialChecked ? "flex-end" : "flex-start",
           x,
-          onLayout: composeEventHandlers(
-            props.onLayout,
-            (e) => setThumbWidth(e.nativeEvent.layout.width)
-          ),
+          onLayout: composeEventHandlers(props.onLayout, (e) => {
+            const next = e.nativeEvent.layout.width;
+            next !== thumbWidth && setThumbWidth(next);
+          }),
           checked,
           disabled,
           ...thumbProps
@@ -66,7 +70,14 @@ function createSwitch(createProps) {
         defaultProp: defaultChecked || !1,
         onChange: onCheckedChange,
         transition: !0
-      }), styledContext = React.useContext(SwitchStyledContext.context), [frameWidth, setFrameWidth] = React.useState(0), { switchProps, bubbleInput, switchRef } = useSwitch(
+      }), styledContext = React.useContext(SwitchStyledContext.context);
+      let estimatedInitialWidth = 0;
+      const estWidth = getVariableValue(getShorthandValue(props, "width"), "size");
+      if (estWidth) {
+        const estPad = getShorthandValue(props, "paddingHorizontal") ?? getShorthandValue(props, "padding") ?? 0, estLeftPad = getShorthandValue(props, "paddingLeft") ?? estPad ?? 0, estRightPad = getShorthandValue(props, "paddingRight") ?? estPad ?? 0;
+        estimatedInitialWidth = estWidth - (estLeftPad ? getVariableValue(estLeftPad) : 0) - (estRightPad ? getVariableValue(estRightPad) : 0);
+      }
+      const [frameWidth, setFrameInnerWidth] = React.useState(estimatedInitialWidth), { switchProps, bubbleInput, switchRef } = useSwitch(
         // @ts-ignore
         props,
         [checked, setChecked],
@@ -77,12 +88,10 @@ function createSwitch(createProps) {
       const disabled = props.disabled, value = React.useMemo(
         () => ({ checked, disabled, frameWidth }),
         [checked, disabled, frameWidth]
-      ), handleLayout = React.useCallback(
-        (e) => {
-          setFrameWidth(e.nativeEvent.layout.width);
-        },
-        [setFrameWidth]
-      ), unstyled = styledContext.unstyled ?? props.unstyled ?? !1;
+      ), handleLayout = (e) => {
+        const next = e.nativeEvent.layout.width;
+        next !== frameWidth && setFrameInnerWidth(next);
+      }, unstyled = styledContext.unstyled ?? props.unstyled ?? !1;
       return /* @__PURE__ */ jsxs(SwitchContext.Provider, { value, children: [
         /* @__PURE__ */ jsx(
           Frame,
@@ -102,7 +111,7 @@ function createSwitch(createProps) {
             },
             checked,
             disabled,
-            children: /* @__PURE__ */ jsx(View, { style: measureContainerStyle, onLayout: handleLayout, children: props.children })
+            children: /* @__PURE__ */ jsx(View, { style: measureContainerStyle, onLayout: handleLayout, children: frameWidth ? props.children : null })
           }
         ),
         bubbleInput

package/dist/esm/createSwitch.js.map

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

package/dist/esm/createSwitch.mjs

@@ -1,4 +1,4 @@
-import { composeEventHandlers, isWeb, shouldRenderNativePlatform, withStaticProperties } from "@tamagui/core";
+import { composeEventHandlers, getShorthandValue, getVariableValue, isWeb, shouldRenderNativePlatform, withStaticProperties } from "@tamagui/core";
 import { useSwitch } from "@tamagui/switch-headless";
 import { useControllableState } from "@tamagui/use-controllable-state";
 import * as React from "react";
@@ -39,7 +39,8 @@ function createSwitch(createProps) {
         unstyled = process.env.TAMAGUI_HEADLESS === "1" ? !0 : unstyledProp ?? unstyledContext ?? !1,
         size = sizeProp ?? sizeContext ?? "$true",
         initialChecked = React.useRef(checked).current,
-        [thumbWidth, setThumbWidth] = React.useState(0),
+        initialWidth = getVariableValue(props.width, "size"),
+        [thumbWidth, setThumbWidth] = React.useState(typeof initialWidth == "number" ? initialWidth : 0),
         distance = frameWidth - thumbWidth,
         x = initialChecked ? checked ? 0 : -distance : checked ? distance : 0;
       return /* @__PURE__ */jsx(Thumb, {
@@ -53,7 +54,10 @@ function createSwitch(createProps) {
         }),
         alignSelf: initialChecked ? "flex-end" : "flex-start",
         x,
-        onLayout: composeEventHandlers(props.onLayout, e => setThumbWidth(e.nativeEvent.layout.width)),
+        onLayout: composeEventHandlers(props.onLayout, e => {
+          const next = e.nativeEvent.layout.width;
+          next !== thumbWidth && setThumbWidth(next);
+        }),
         checked,
         disabled,
         ...thumbProps
@@ -74,8 +78,16 @@ function createSwitch(createProps) {
           onChange: onCheckedChange,
           transition: !0
         }),
-        styledContext = React.useContext(SwitchStyledContext.context),
-        [frameWidth, setFrameWidth] = React.useState(0),
+        styledContext = React.useContext(SwitchStyledContext.context);
+      let estimatedInitialWidth = 0;
+      const estWidth = getVariableValue(getShorthandValue(props, "width"), "size");
+      if (estWidth) {
+        const estPad = getShorthandValue(props, "paddingHorizontal") ?? getShorthandValue(props, "padding") ?? 0,
+          estLeftPad = getShorthandValue(props, "paddingLeft") ?? estPad ?? 0,
+          estRightPad = getShorthandValue(props, "paddingRight") ?? estPad ?? 0;
+        estimatedInitialWidth = estWidth - (estLeftPad ? getVariableValue(estLeftPad) : 0) - (estRightPad ? getVariableValue(estRightPad) : 0);
+      }
+      const [frameWidth, setFrameInnerWidth] = React.useState(estimatedInitialWidth),
         {
           switchProps,
           bubbleInput,
@@ -95,9 +107,10 @@ function createSwitch(createProps) {
           disabled,
           frameWidth
         }), [checked, disabled, frameWidth]),
-        handleLayout = React.useCallback(e => {
-          setFrameWidth(e.nativeEvent.layout.width);
-        }, [setFrameWidth]),
+        handleLayout = e => {
+          const next = e.nativeEvent.layout.width;
+          next !== frameWidth && setFrameInnerWidth(next);
+        },
         unstyled = styledContext.unstyled ?? props.unstyled ?? !1;
       return /* @__PURE__ */jsxs(SwitchContext.Provider, {
         value,
@@ -122,7 +135,7 @@ function createSwitch(createProps) {
           children: /* @__PURE__ */jsx(View, {
             style: measureContainerStyle,
             onLayout: handleLayout,
-            children: props.children
+            children: frameWidth ? props.children : null
           })
         }), bubbleInput]
       });

package/dist/esm/createSwitch.mjs.map

@@ -1 +1 @@
-{"version":3,"names":["composeEventHandlers","isWeb","shouldRenderNativePlatform","withStaticProperties","useSwitch","useControllableState","React","Switch","NativeSwitch","View","SwitchStyledContext","SwitchFrame","DefaultSwitchFrame","SwitchThumb","jsx","jsxs","SwitchContext","createContext","checked","disabled","frameWidth","createSwitch","createProps","disableActiveTheme","Frame","Thumb","process","env","NODE_ENV","staticConfig","context","console","warn","SwitchThumbComponent","styleable","props","forwardedRef","size","sizeProp","unstyled","unstyledProp","nativeID","thumbProps","useContext","styledContext","useStyledContext","unstyledContext","sizeContext","TAMAGUI_HEADLESS","initialChecked","useRef","current","thumbWidth","setThumbWidth","useState","distance","x","ref","theme","alignSelf","onLayout","e","nativeEvent","layout","width","SwitchComponent","_props","native","nativeProps","checkedProp","defaultChecked","onCheckedChange","setChecked","prop","defaultProp","onChange","transition","setFrameWidth","switchProps","bubbleInput","switchRef","renderNative","value","onValueChange","useMemo","handleLayout","useCallback","Provider","children","tag","type","themeShallow","style","measureContainerStyle","disableTheme","flex"],"sources":["../../src/createSwitch.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["composeEventHandlers","getShorthandValue","getVariableValue","isWeb","shouldRenderNativePlatform","withStaticProperties","useSwitch","useControllableState","React","Switch","NativeSwitch","View","SwitchStyledContext","SwitchFrame","DefaultSwitchFrame","SwitchThumb","jsx","jsxs","SwitchContext","createContext","checked","disabled","frameWidth","createSwitch","createProps","disableActiveTheme","Frame","Thumb","process","env","NODE_ENV","staticConfig","context","console","warn","SwitchThumbComponent","styleable","props","forwardedRef","size","sizeProp","unstyled","unstyledProp","nativeID","thumbProps","useContext","styledContext","useStyledContext","unstyledContext","sizeContext","TAMAGUI_HEADLESS","initialChecked","useRef","current","initialWidth","width","thumbWidth","setThumbWidth","useState","distance","x","ref","theme","alignSelf","onLayout","e","next","nativeEvent","layout","SwitchComponent","_props","native","nativeProps","checkedProp","defaultChecked","onCheckedChange","setChecked","prop","defaultProp","onChange","transition","estimatedInitialWidth","estWidth","estPad","estLeftPad","estRightPad","setFrameInnerWidth","switchProps","bubbleInput","switchRef","renderNative","value","onValueChange","useMemo","handleLayout","Provider","children","tag","type","themeShallow","style","measureContainerStyle","disableTheme","flex"],"sources":["../../src/createSwitch.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/createSwitch.native.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { composeEventHandlers, isWeb, shouldRenderNativePlatform, withStaticProperties } from "@tamagui/core";
+import { composeEventHandlers, getShorthandValue, getVariableValue, isWeb, shouldRenderNativePlatform, withStaticProperties } from "@tamagui/core";
 import { registerFocusable } from "@tamagui/focusable";
 import { useSwitch } from "@tamagui/switch-headless";
 import { useControllableState } from "@tamagui/use-controllable-state";
@@ -16,7 +16,7 @@ function createSwitch(createProps) {
   var { disableActiveTheme, Frame = DefaultSwitchFrame, Thumb = SwitchThumb } = createProps;
   process.env.NODE_ENV === "development" && (Frame !== DefaultSwitchFrame && Frame.staticConfig.context && Frame.staticConfig.context !== SwitchStyledContext || Thumb !== SwitchThumb && Thumb.staticConfig.context && Thumb.staticConfig.context !== SwitchStyledContext) && console.warn("Warning: createSwitch() needs to control context to pass checked state from Frame to Thumb, any custom context passed will be overridden."), Frame.staticConfig.context = SwitchStyledContext, Thumb.staticConfig.context = SwitchStyledContext;
   var SwitchThumbComponent = Thumb.styleable(function(props, forwardedRef) {
-    var { size: sizeProp, unstyled: unstyledProp, nativeID, ...thumbProps } = props, context = React.useContext(SwitchContext), { checked, disabled, frameWidth } = context, styledContext = SwitchStyledContext.useStyledContext(), { unstyled: unstyledContext, size: sizeContext } = styledContext, _ref, unstyled = process.env.TAMAGUI_HEADLESS === "1" ? !0 : (_ref = unstyledProp ?? unstyledContext) !== null && _ref !== void 0 ? _ref : !1, _ref1, size = (_ref1 = sizeProp ?? sizeContext) !== null && _ref1 !== void 0 ? _ref1 : "$true", initialChecked = React.useRef(checked).current, [thumbWidth, setThumbWidth] = React.useState(0), distance = frameWidth - thumbWidth, x = initialChecked ? checked ? 0 : -distance : checked ? distance : 0;
+    var { size: sizeProp, unstyled: unstyledProp, nativeID, ...thumbProps } = props, context = React.useContext(SwitchContext), { checked, disabled, frameWidth } = context, styledContext = SwitchStyledContext.useStyledContext(), { unstyled: unstyledContext, size: sizeContext } = styledContext, _ref, unstyled = process.env.TAMAGUI_HEADLESS === "1" ? !0 : (_ref = unstyledProp ?? unstyledContext) !== null && _ref !== void 0 ? _ref : !1, _ref1, size = (_ref1 = sizeProp ?? sizeContext) !== null && _ref1 !== void 0 ? _ref1 : "$true", initialChecked = React.useRef(checked).current, initialWidth = getVariableValue(props.width, "size"), [thumbWidth, setThumbWidth] = React.useState(typeof initialWidth == "number" ? initialWidth : 0), distance = frameWidth - thumbWidth, x = initialChecked ? checked ? 0 : -distance : checked ? distance : 0;
     return /* @__PURE__ */ _jsx(Thumb, {
       ref: forwardedRef,
       unstyled,
@@ -29,7 +29,8 @@ function createSwitch(createProps) {
       alignSelf: initialChecked ? "flex-end" : "flex-start",
       x,
       onLayout: composeEventHandlers(props.onLayout, function(e) {
-        return setThumbWidth(e.nativeEvent.layout.width);
+        var next = e.nativeEvent.layout.width;
+        next !== thumbWidth && setThumbWidth(next);
       }),
       // expected variants
       checked,
@@ -42,7 +43,12 @@ function createSwitch(createProps) {
       defaultProp: defaultChecked || !1,
       onChange: onCheckedChange,
       transition: !0
-    }), styledContext = React.useContext(SwitchStyledContext.context), [frameWidth, setFrameWidth] = React.useState(0), { switchProps, bubbleInput, switchRef } = useSwitch(
+    }), styledContext = React.useContext(SwitchStyledContext.context), estimatedInitialWidth = 0, estWidth = getVariableValue(getShorthandValue(props, "width"), "size");
+    if (estWidth) {
+      var _getShorthandValue, _ref, estPad = (_ref = (_getShorthandValue = getShorthandValue(props, "paddingHorizontal")) !== null && _getShorthandValue !== void 0 ? _getShorthandValue : getShorthandValue(props, "padding")) !== null && _ref !== void 0 ? _ref : 0, _getShorthandValue1, _ref1, estLeftPad = (_ref1 = (_getShorthandValue1 = getShorthandValue(props, "paddingLeft")) !== null && _getShorthandValue1 !== void 0 ? _getShorthandValue1 : estPad) !== null && _ref1 !== void 0 ? _ref1 : 0, _getShorthandValue2, _ref2, estRightPad = (_ref2 = (_getShorthandValue2 = getShorthandValue(props, "paddingRight")) !== null && _getShorthandValue2 !== void 0 ? _getShorthandValue2 : estPad) !== null && _ref2 !== void 0 ? _ref2 : 0;
+      estimatedInitialWidth = estWidth - (estLeftPad ? getVariableValue(estLeftPad) : 0) - (estRightPad ? getVariableValue(estRightPad) : 0);
+    }
+    var [frameWidth, setFrameInnerWidth] = React.useState(estimatedInitialWidth), { switchProps, bubbleInput, switchRef } = useSwitch(
       // @ts-ignore
       props,
       [
@@ -83,11 +89,10 @@ function createSwitch(createProps) {
       checked,
       disabled,
       frameWidth
-    ]), handleLayout = React.useCallback(function(e) {
-      setFrameWidth(e.nativeEvent.layout.width);
-    }, [
-      setFrameWidth
-    ]), _styledContext_unstyled, _ref, unstyled = (_ref = (_styledContext_unstyled = styledContext.unstyled) !== null && _styledContext_unstyled !== void 0 ? _styledContext_unstyled : props.unstyled) !== null && _ref !== void 0 ? _ref : !1, _styledContext_size, _ref1;
+    ]), handleLayout = function(e) {
+      var next = e.nativeEvent.layout.width;
+      next !== frameWidth && setFrameInnerWidth(next);
+    }, _styledContext_unstyled, _ref3, unstyled = (_ref3 = (_styledContext_unstyled = styledContext.unstyled) !== null && _styledContext_unstyled !== void 0 ? _styledContext_unstyled : props.unstyled) !== null && _ref3 !== void 0 ? _ref3 : !1, _styledContext_size, _ref4;
     return /* @__PURE__ */ _jsxs(SwitchContext.Provider, {
       value,
       children: [
@@ -98,7 +103,7 @@ function createSwitch(createProps) {
             type: "button"
           },
           ...!unstyled && {
-            size: (_ref1 = (_styledContext_size = styledContext.size) !== null && _styledContext_size !== void 0 ? _styledContext_size : props.size) !== null && _ref1 !== void 0 ? _ref1 : "$true"
+            size: (_ref4 = (_styledContext_size = styledContext.size) !== null && _styledContext_size !== void 0 ? _styledContext_size : props.size) !== null && _ref4 !== void 0 ? _ref4 : "$true"
           },
           unstyled,
           ...props,
@@ -113,7 +118,7 @@ function createSwitch(createProps) {
           children: /* @__PURE__ */ _jsx(View, {
             style: measureContainerStyle,
             onLayout: handleLayout,
-            children: props.children
+            children: frameWidth ? props.children : null
           })
         }),
         bubbleInput

package/dist/esm/createSwitch.native.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/Users/n8/tamagui/code/ui/switch/src/createSwitch.tsx"],
-  "mappings": ";AACA,SACEA,sBACAC,OACAC,4BACAC,4BACK;AACP,SAASC,yBAAyB;AAKlC,SAASC,iBAAiB;AAC1B,SAASC,4BAA4B;AACrC,YAAYC,WAAW;AAMvB,SAASC,UAAUC,cAAcC,YAAY;AAE7C,SAASC,2BAA2B;AACpC,SAASC,eAAeC,oBAAoBC,mBAAmB;AAoBxD,IAAMC,gBAAgBR,sBAAMS,cAIhC;EACDC,SAAS;EACTC,UAAU;EACVC,YAAY;AACd,CAAA;AAKO,SAASC,aAGdC,aAAmE;AACnE,MAAM,EACJC,oBACAC,QAAQV,oBACRW,QAAQV,YAAW,IACjBO;AAMJ,EAAII,QAAQC,IAAIC,aAAa,kBAExBJ,UAAUV,sBACTU,MAAMK,aAAaC,WACnBN,MAAMK,aAAaC,YAAYlB,uBAChCa,UAAUV,eACTU,MAAMI,aAAaC,WACnBL,MAAMI,aAAaC,YAAYlB,wBAEjCmB,QAAQC,KACN,2IAA2I,GAKjJR,MAAMK,aAAaC,UAAUlB,qBAC7Ba,MAAMI,aAAaC,UAAUlB;AAE7B,MAAMqB,uBAAuBR,MAAMS,UACjC,SAAqBC,OAAOC,cAAY;AACtC,QAAM,EAAEC,MAAMC,UAAUC,UAAUC,cAAcC,UAAU,GAAGC,WAAAA,IAAeP,OACtEL,UAAUtB,MAAMmC,WAAW3B,aAAAA,GAC3B,EAAEE,SAASC,UAAUC,WAAU,IAAKU,SACpCc,gBAAgBhC,oBAAoBiC,iBAAgB,GACpD,EAAEN,UAAUO,iBAAiBT,MAAMU,YAAW,IAAKH,eAIlDJ,MAHDD,WACJb,QAAQC,IAAIqB,qBAAqB,MAC7B,MACCR,OAAAA,gBAAgBM,qBAAAA,QAAhBN,SAAAA,SAAAA,OAAmC,IAC7BF,OAAPD,QAAOC,QAAAA,YAAYS,iBAAAA,QAAZT,UAAAA,SAAAA,QAA2B,SAElCW,iBAAiBzC,MAAM0C,OAAOhC,OAAAA,EAASiC,SAEvC,CAACC,YAAYC,aAAAA,IAAiB7C,MAAM8C,SAAS,CAAA,GAC7CC,WAAWnC,aAAagC,YACxBI,IAAIP,iBAAkB/B,UAAU,IAAI,CAACqC,WAAYrC,UAAUqC,WAAW;AAC5E,WACE,qBAAC9B,OAAAA;MACCgC,KAAKrB;MACLG;MACC,GAAIA,aAAa,MAAS;QACzBF;QACA,GAAI,CAACd,sBACH,CAACgB,YAAY;UACXmB,OAAOxC,UAAU,WAAW;QAC9B;MACJ;MACAyC,WAAWV,iBAAiB,aAAa;MACzCO;MACAI,UAAU3D,qBAAqBkC,MAAMyB,UAAU,SAACC,GAAAA;eAC9CR,cAAcQ,EAAEC,YAAYC,OAAOC,KAAK;;;MAG1C9C;MACAC;MACC,GAAGuB;;EAGV,CAAA,GAGIuB,kBAAkBzC,MAAMU,UAC5B,SAAqBgC,QAAQ9B,cAAY;AACvC,QAAM,EACJ+B,QACAC,aACAlD,SAASmD,aACTC,gBACAC,iBACA,GAAGpC,MAAAA,IACD+B,QACE,CAAChD,SAASsD,UAAAA,IAAcjE,qBAAqB;MACjDkE,MAAMJ;MACNK,aAAaJ,kBAAkB;MAC/BK,UAAUJ;MACVK,YAAY;IACd,CAAA,GAEMhC,gBAAgBpC,MAAMmC,WAAW/B,oBAAoBkB,OAAO,GAE5D,CAACV,YAAYyD,aAAAA,IAAiBrE,MAAM8C,SAAS,CAAA,GAE7C,EAAEwB,aAAaC,aAAaC,UAAS,IAAK1E;;MAE9C6B;MACA;QAACjB;QAASsD;;MACVpC;IAAAA;AAIA5B,UAAMyE,UAAU,WAAA;AACd,UAAK9C,MAAM+C,MACP/C,OAAMhB;AAEV,eAAOd,kBAAkB8B,MAAM+C,IAAI;UACjCC,gBAAgB,WAAA;AACdX,YAAAA,aAAa,SAACY,QAAAA;qBAAU,CAACA;;UAC3B;UACAC,OAAO,WAAA;UAAO;QAChB,CAAA;IACF,GAAG;MAAClD,MAAM+C;MAAI/C,MAAMhB;KAAS;AAG/B,QAAMmE,eAAenF,2BAA2BgE,MAAAA;AAChD,QAAImB,iBAAiB,aAAaA,iBAAiB;AACjD,aACE,qBAAC5E,cAAAA;QAAa0E,OAAOlE;QAASqE,eAAef;QAAa,GAAGJ;;AAIjE,QAAMjD,WAAWgB,MAAMhB,UACjBiE,QAAQ5E,MAAMgF,QAClB,WAAA;aAAO;QAAEtE;QAASC;QAAUC;MAAW;OACvC;MAACF;MAASC;MAAUC;KAAW,GAG3BqE,eAAejF,MAAMkF,YACzB,SAAC7B,GAAAA;AACCgB,oBAAchB,EAAEC,YAAYC,OAAOC,KAAK;IAC1C,GACA;MAACa;KAAc,GAGAjC,yBAAAA,MAAXL,YAAWK,QAAAA,0BAAAA,cAAcL,cAAQ,QAAtBK,4BAAAA,SAAAA,0BAA0BT,MAAMI,cAAQ,QAAxCK,SAAAA,SAAAA,OAA4C,IAS/CA,qBAAAA;AAPd,WACE,sBAAC5B,cAAc2E,UAAQ;MAACP;;QACtB,qBAAC5D,OAAAA;UACCiC,KAAKuB;UACLY,KAAI;UACH,GAAI1F,SAAS;YAAE2F,MAAM;UAAS;UAC9B,GAAI,CAACtD,YAAY;YAChBF,OAAMO,SAAAA,sBAAAA,cAAcP,UAAI,QAAlBO,wBAAAA,SAAAA,sBAAsBT,MAAME,UAAI,QAAhCO,UAAAA,SAAAA,QAAoC;UAC5C;UACAL;UACC,GAAGJ;UACH,GAAI2C;UACJ,GAAI,CAACvD,sBACJ,CAACY,MAAMI,YAAY;YACjBmB,OAAOxC,UAAU,WAAW;YAC5B4E,cAAc;UAChB;;UAEF5E;UACAC;oBAEA,qBAACR,MAAAA;YAAKoF,OAAOC;YAAuBpC,UAAU6B;sBAC3CtD,MAAM8D;;;QAIVlB;;;EAGP,GACA;IACEmB,cAAc;EAChB,CAAA;AAGF,SAAO9F,qBAAqB6D,iBAAiB;IAC3CxC,OAAOQ;EACT,CAAA;AACF;AAEA,IAAM+D,wBAAwB;EAC5BrC,WAAW;EACXwC,MAAM;AACR;",
-  "names": ["composeEventHandlers", "isWeb", "shouldRenderNativePlatform", "withStaticProperties", "registerFocusable", "useSwitch", "useControllableState", "React", "Switch", "NativeSwitch", "View", "SwitchStyledContext", "SwitchFrame", "DefaultSwitchFrame", "SwitchThumb", "SwitchContext", "createContext", "checked", "disabled", "frameWidth", "createSwitch", "createProps", "disableActiveTheme", "Frame", "Thumb", "process", "env", "NODE_ENV", "staticConfig", "context", "console", "warn", "SwitchThumbComponent", "styleable", "props", "forwardedRef", "size", "sizeProp", "unstyled", "unstyledProp", "nativeID", "thumbProps", "useContext", "styledContext", "useStyledContext", "unstyledContext", "sizeContext", "TAMAGUI_HEADLESS", "initialChecked", "useRef", "current", "thumbWidth", "setThumbWidth", "useState", "distance", "x", "ref", "theme", "alignSelf", "onLayout", "e", "nativeEvent", "layout", "width", "SwitchComponent", "_props", "native", "nativeProps", "checkedProp", "defaultChecked", "onCheckedChange", "setChecked", "prop", "defaultProp", "onChange", "transition", "setFrameWidth", "switchProps", "bubbleInput", "switchRef", "useEffect", "id", "focusAndSelect", "value", "focus", "renderNative", "onValueChange", "useMemo", "handleLayout", "useCallback", "Provider", "tag", "type", "themeShallow", "style", "measureContainerStyle", "children", "disableTheme", "flex"]
+  "mappings": "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",
+  "names": ["composeEventHandlers", "getShorthandValue", "getVariableValue", "isWeb", "shouldRenderNativePlatform", "withStaticProperties", "registerFocusable", "useSwitch", "useControllableState", "React", "Switch", "NativeSwitch", "View", "SwitchStyledContext", "SwitchFrame", "DefaultSwitchFrame", "SwitchThumb", "SwitchContext", "createContext", "checked", "disabled", "frameWidth", "createSwitch", "createProps", "disableActiveTheme", "Frame", "Thumb", "process", "env", "NODE_ENV", "staticConfig", "context", "console", "warn", "SwitchThumbComponent", "styleable", "props", "forwardedRef", "size", "sizeProp", "unstyled", "unstyledProp", "nativeID", "thumbProps", "useContext", "styledContext", "useStyledContext", "unstyledContext", "sizeContext", "TAMAGUI_HEADLESS", "initialChecked", "useRef", "current", "initialWidth", "width", "thumbWidth", "setThumbWidth", "useState", "distance", "x", "ref", "theme", "alignSelf", "onLayout", "e", "next", "nativeEvent", "layout", "SwitchComponent", "_props", "native", "nativeProps", "checkedProp", "defaultChecked", "onCheckedChange", "setChecked", "prop", "defaultProp", "onChange", "transition", "estimatedInitialWidth", "estWidth", "estPad", "estLeftPad", "estRightPad", "setFrameInnerWidth", "switchProps", "bubbleInput", "switchRef", "useEffect", "id", "focusAndSelect", "value", "focus", "renderNative", "onValueChange", "useMemo", "handleLayout", "Provider", "tag", "type", "themeShallow", "style", "measureContainerStyle", "children", "disableTheme", "flex"]
 }

package/dist/jsx/createSwitch.js

@@ -1,5 +1,7 @@
 import {
   composeEventHandlers,
+  getShorthandValue,
+  getVariableValue,
   isWeb,
   shouldRenderNativePlatform,
   withStaticProperties
@@ -28,7 +30,9 @@ function createSwitch(createProps) {
   ), Frame.staticConfig.context = SwitchStyledContext, Thumb.staticConfig.context = SwitchStyledContext;
   const SwitchThumbComponent = Thumb.styleable(
     function(props, forwardedRef) {
-      const { size: sizeProp, unstyled: unstyledProp, nativeID, ...thumbProps } = props, context = React.useContext(SwitchContext), { checked, disabled, frameWidth } = context, styledContext = SwitchStyledContext.useStyledContext(), { unstyled: unstyledContext, size: sizeContext } = styledContext, unstyled = process.env.TAMAGUI_HEADLESS === "1" ? !0 : unstyledProp ?? unstyledContext ?? !1, size = sizeProp ?? sizeContext ?? "$true", initialChecked = React.useRef(checked).current, [thumbWidth, setThumbWidth] = React.useState(0), distance = frameWidth - thumbWidth, x = initialChecked ? checked ? 0 : -distance : checked ? distance : 0;
+      const { size: sizeProp, unstyled: unstyledProp, nativeID, ...thumbProps } = props, context = React.useContext(SwitchContext), { checked, disabled, frameWidth } = context, styledContext = SwitchStyledContext.useStyledContext(), { unstyled: unstyledContext, size: sizeContext } = styledContext, unstyled = process.env.TAMAGUI_HEADLESS === "1" ? !0 : unstyledProp ?? unstyledContext ?? !1, size = sizeProp ?? sizeContext ?? "$true", initialChecked = React.useRef(checked).current, initialWidth = getVariableValue(props.width, "size"), [thumbWidth, setThumbWidth] = React.useState(
+        typeof initialWidth == "number" ? initialWidth : 0
+      ), distance = frameWidth - thumbWidth, x = initialChecked ? checked ? 0 : -distance : checked ? distance : 0;
       return /* @__PURE__ */ jsx(
         Thumb,
         {
@@ -42,10 +46,10 @@ function createSwitch(createProps) {
           },
           alignSelf: initialChecked ? "flex-end" : "flex-start",
           x,
-          onLayout: composeEventHandlers(
-            props.onLayout,
-            (e) => setThumbWidth(e.nativeEvent.layout.width)
-          ),
+          onLayout: composeEventHandlers(props.onLayout, (e) => {
+            const next = e.nativeEvent.layout.width;
+            next !== thumbWidth && setThumbWidth(next);
+          }),
           checked,
           disabled,
           ...thumbProps
@@ -66,7 +70,14 @@ function createSwitch(createProps) {
         defaultProp: defaultChecked || !1,
         onChange: onCheckedChange,
         transition: !0
-      }), styledContext = React.useContext(SwitchStyledContext.context), [frameWidth, setFrameWidth] = React.useState(0), { switchProps, bubbleInput, switchRef } = useSwitch(
+      }), styledContext = React.useContext(SwitchStyledContext.context);
+      let estimatedInitialWidth = 0;
+      const estWidth = getVariableValue(getShorthandValue(props, "width"), "size");
+      if (estWidth) {
+        const estPad = getShorthandValue(props, "paddingHorizontal") ?? getShorthandValue(props, "padding") ?? 0, estLeftPad = getShorthandValue(props, "paddingLeft") ?? estPad ?? 0, estRightPad = getShorthandValue(props, "paddingRight") ?? estPad ?? 0;
+        estimatedInitialWidth = estWidth - (estLeftPad ? getVariableValue(estLeftPad) : 0) - (estRightPad ? getVariableValue(estRightPad) : 0);
+      }
+      const [frameWidth, setFrameInnerWidth] = React.useState(estimatedInitialWidth), { switchProps, bubbleInput, switchRef } = useSwitch(
         // @ts-ignore
         props,
         [checked, setChecked],
@@ -77,12 +88,10 @@ function createSwitch(createProps) {
       const disabled = props.disabled, value = React.useMemo(
         () => ({ checked, disabled, frameWidth }),
         [checked, disabled, frameWidth]
-      ), handleLayout = React.useCallback(
-        (e) => {
-          setFrameWidth(e.nativeEvent.layout.width);
-        },
-        [setFrameWidth]
-      ), unstyled = styledContext.unstyled ?? props.unstyled ?? !1;
+      ), handleLayout = (e) => {
+        const next = e.nativeEvent.layout.width;
+        next !== frameWidth && setFrameInnerWidth(next);
+      }, unstyled = styledContext.unstyled ?? props.unstyled ?? !1;
       return /* @__PURE__ */ jsxs(SwitchContext.Provider, { value, children: [
         /* @__PURE__ */ jsx(
           Frame,
@@ -102,7 +111,7 @@ function createSwitch(createProps) {
             },
             checked,
             disabled,
-            children: /* @__PURE__ */ jsx(View, { style: measureContainerStyle, onLayout: handleLayout, children: props.children })
+            children: /* @__PURE__ */ jsx(View, { style: measureContainerStyle, onLayout: handleLayout, children: frameWidth ? props.children : null })
           }
         ),
         bubbleInput

package/dist/jsx/createSwitch.js.map

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

package/dist/jsx/createSwitch.mjs

@@ -1,4 +1,4 @@
-import { composeEventHandlers, isWeb, shouldRenderNativePlatform, withStaticProperties } from "@tamagui/core";
+import { composeEventHandlers, getShorthandValue, getVariableValue, isWeb, shouldRenderNativePlatform, withStaticProperties } from "@tamagui/core";
 import { useSwitch } from "@tamagui/switch-headless";
 import { useControllableState } from "@tamagui/use-controllable-state";
 import * as React from "react";
@@ -39,7 +39,8 @@ function createSwitch(createProps) {
         unstyled = process.env.TAMAGUI_HEADLESS === "1" ? !0 : unstyledProp ?? unstyledContext ?? !1,
         size = sizeProp ?? sizeContext ?? "$true",
         initialChecked = React.useRef(checked).current,
-        [thumbWidth, setThumbWidth] = React.useState(0),
+        initialWidth = getVariableValue(props.width, "size"),
+        [thumbWidth, setThumbWidth] = React.useState(typeof initialWidth == "number" ? initialWidth : 0),
         distance = frameWidth - thumbWidth,
         x = initialChecked ? checked ? 0 : -distance : checked ? distance : 0;
       return /* @__PURE__ */jsx(Thumb, {
@@ -53,7 +54,10 @@ function createSwitch(createProps) {
         }),
         alignSelf: initialChecked ? "flex-end" : "flex-start",
         x,
-        onLayout: composeEventHandlers(props.onLayout, e => setThumbWidth(e.nativeEvent.layout.width)),
+        onLayout: composeEventHandlers(props.onLayout, e => {
+          const next = e.nativeEvent.layout.width;
+          next !== thumbWidth && setThumbWidth(next);
+        }),
         checked,
         disabled,
         ...thumbProps
@@ -74,8 +78,16 @@ function createSwitch(createProps) {
           onChange: onCheckedChange,
           transition: !0
         }),
-        styledContext = React.useContext(SwitchStyledContext.context),
-        [frameWidth, setFrameWidth] = React.useState(0),
+        styledContext = React.useContext(SwitchStyledContext.context);
+      let estimatedInitialWidth = 0;
+      const estWidth = getVariableValue(getShorthandValue(props, "width"), "size");
+      if (estWidth) {
+        const estPad = getShorthandValue(props, "paddingHorizontal") ?? getShorthandValue(props, "padding") ?? 0,
+          estLeftPad = getShorthandValue(props, "paddingLeft") ?? estPad ?? 0,
+          estRightPad = getShorthandValue(props, "paddingRight") ?? estPad ?? 0;
+        estimatedInitialWidth = estWidth - (estLeftPad ? getVariableValue(estLeftPad) : 0) - (estRightPad ? getVariableValue(estRightPad) : 0);
+      }
+      const [frameWidth, setFrameInnerWidth] = React.useState(estimatedInitialWidth),
         {
           switchProps,
           bubbleInput,
@@ -95,9 +107,10 @@ function createSwitch(createProps) {
           disabled,
           frameWidth
         }), [checked, disabled, frameWidth]),
-        handleLayout = React.useCallback(e => {
-          setFrameWidth(e.nativeEvent.layout.width);
-        }, [setFrameWidth]),
+        handleLayout = e => {
+          const next = e.nativeEvent.layout.width;
+          next !== frameWidth && setFrameInnerWidth(next);
+        },
         unstyled = styledContext.unstyled ?? props.unstyled ?? !1;
       return /* @__PURE__ */jsxs(SwitchContext.Provider, {
         value,
@@ -122,7 +135,7 @@ function createSwitch(createProps) {
           children: /* @__PURE__ */jsx(View, {
             style: measureContainerStyle,
             onLayout: handleLayout,
-            children: props.children
+            children: frameWidth ? props.children : null
           })
         }), bubbleInput]
       });

package/dist/jsx/createSwitch.mjs.map

@@ -1 +1 @@
-{"version":3,"names":["composeEventHandlers","isWeb","shouldRenderNativePlatform","withStaticProperties","useSwitch","useControllableState","React","Switch","NativeSwitch","View","SwitchStyledContext","SwitchFrame","DefaultSwitchFrame","SwitchThumb","jsx","jsxs","SwitchContext","createContext","checked","disabled","frameWidth","createSwitch","createProps","disableActiveTheme","Frame","Thumb","process","env","NODE_ENV","staticConfig","context","console","warn","SwitchThumbComponent","styleable","props","forwardedRef","size","sizeProp","unstyled","unstyledProp","nativeID","thumbProps","useContext","styledContext","useStyledContext","unstyledContext","sizeContext","TAMAGUI_HEADLESS","initialChecked","useRef","current","thumbWidth","setThumbWidth","useState","distance","x","ref","theme","alignSelf","onLayout","e","nativeEvent","layout","width","SwitchComponent","_props","native","nativeProps","checkedProp","defaultChecked","onCheckedChange","setChecked","prop","defaultProp","onChange","transition","setFrameWidth","switchProps","bubbleInput","switchRef","renderNative","value","onValueChange","useMemo","handleLayout","useCallback","Provider","children","tag","type","themeShallow","style","measureContainerStyle","disableTheme","flex"],"sources":["../../src/createSwitch.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["composeEventHandlers","getShorthandValue","getVariableValue","isWeb","shouldRenderNativePlatform","withStaticProperties","useSwitch","useControllableState","React","Switch","NativeSwitch","View","SwitchStyledContext","SwitchFrame","DefaultSwitchFrame","SwitchThumb","jsx","jsxs","SwitchContext","createContext","checked","disabled","frameWidth","createSwitch","createProps","disableActiveTheme","Frame","Thumb","process","env","NODE_ENV","staticConfig","context","console","warn","SwitchThumbComponent","styleable","props","forwardedRef","size","sizeProp","unstyled","unstyledProp","nativeID","thumbProps","useContext","styledContext","useStyledContext","unstyledContext","sizeContext","TAMAGUI_HEADLESS","initialChecked","useRef","current","initialWidth","width","thumbWidth","setThumbWidth","useState","distance","x","ref","theme","alignSelf","onLayout","e","next","nativeEvent","layout","SwitchComponent","_props","native","nativeProps","checkedProp","defaultChecked","onCheckedChange","setChecked","prop","defaultProp","onChange","transition","estimatedInitialWidth","estWidth","estPad","estLeftPad","estRightPad","setFrameInnerWidth","switchProps","bubbleInput","switchRef","renderNative","value","onValueChange","useMemo","handleLayout","Provider","children","tag","type","themeShallow","style","measureContainerStyle","disableTheme","flex"],"sources":["../../src/createSwitch.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/jsx/createSwitch.native.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { composeEventHandlers, isWeb, shouldRenderNativePlatform, withStaticProperties } from "@tamagui/core";
+import { composeEventHandlers, getShorthandValue, getVariableValue, isWeb, shouldRenderNativePlatform, withStaticProperties } from "@tamagui/core";
 import { registerFocusable } from "@tamagui/focusable";
 import { useSwitch } from "@tamagui/switch-headless";
 import { useControllableState } from "@tamagui/use-controllable-state";
@@ -16,7 +16,7 @@ function createSwitch(createProps) {
   var { disableActiveTheme, Frame = DefaultSwitchFrame, Thumb = SwitchThumb } = createProps;
   process.env.NODE_ENV === "development" && (Frame !== DefaultSwitchFrame && Frame.staticConfig.context && Frame.staticConfig.context !== SwitchStyledContext || Thumb !== SwitchThumb && Thumb.staticConfig.context && Thumb.staticConfig.context !== SwitchStyledContext) && console.warn("Warning: createSwitch() needs to control context to pass checked state from Frame to Thumb, any custom context passed will be overridden."), Frame.staticConfig.context = SwitchStyledContext, Thumb.staticConfig.context = SwitchStyledContext;
   var SwitchThumbComponent = Thumb.styleable(function(props, forwardedRef) {
-    var { size: sizeProp, unstyled: unstyledProp, nativeID, ...thumbProps } = props, context = React.useContext(SwitchContext), { checked, disabled, frameWidth } = context, styledContext = SwitchStyledContext.useStyledContext(), { unstyled: unstyledContext, size: sizeContext } = styledContext, _ref, unstyled = process.env.TAMAGUI_HEADLESS === "1" ? !0 : (_ref = unstyledProp ?? unstyledContext) !== null && _ref !== void 0 ? _ref : !1, _ref1, size = (_ref1 = sizeProp ?? sizeContext) !== null && _ref1 !== void 0 ? _ref1 : "$true", initialChecked = React.useRef(checked).current, [thumbWidth, setThumbWidth] = React.useState(0), distance = frameWidth - thumbWidth, x = initialChecked ? checked ? 0 : -distance : checked ? distance : 0;
+    var { size: sizeProp, unstyled: unstyledProp, nativeID, ...thumbProps } = props, context = React.useContext(SwitchContext), { checked, disabled, frameWidth } = context, styledContext = SwitchStyledContext.useStyledContext(), { unstyled: unstyledContext, size: sizeContext } = styledContext, _ref, unstyled = process.env.TAMAGUI_HEADLESS === "1" ? !0 : (_ref = unstyledProp ?? unstyledContext) !== null && _ref !== void 0 ? _ref : !1, _ref1, size = (_ref1 = sizeProp ?? sizeContext) !== null && _ref1 !== void 0 ? _ref1 : "$true", initialChecked = React.useRef(checked).current, initialWidth = getVariableValue(props.width, "size"), [thumbWidth, setThumbWidth] = React.useState(typeof initialWidth == "number" ? initialWidth : 0), distance = frameWidth - thumbWidth, x = initialChecked ? checked ? 0 : -distance : checked ? distance : 0;
     return /* @__PURE__ */ _jsx(Thumb, {
       ref: forwardedRef,
       unstyled,
@@ -29,7 +29,8 @@ function createSwitch(createProps) {
       alignSelf: initialChecked ? "flex-end" : "flex-start",
       x,
       onLayout: composeEventHandlers(props.onLayout, function(e) {
-        return setThumbWidth(e.nativeEvent.layout.width);
+        var next = e.nativeEvent.layout.width;
+        next !== thumbWidth && setThumbWidth(next);
       }),
       // expected variants
       checked,
@@ -42,7 +43,12 @@ function createSwitch(createProps) {
       defaultProp: defaultChecked || !1,
       onChange: onCheckedChange,
       transition: !0
-    }), styledContext = React.useContext(SwitchStyledContext.context), [frameWidth, setFrameWidth] = React.useState(0), { switchProps, bubbleInput, switchRef } = useSwitch(
+    }), styledContext = React.useContext(SwitchStyledContext.context), estimatedInitialWidth = 0, estWidth = getVariableValue(getShorthandValue(props, "width"), "size");
+    if (estWidth) {
+      var _getShorthandValue, _ref, estPad = (_ref = (_getShorthandValue = getShorthandValue(props, "paddingHorizontal")) !== null && _getShorthandValue !== void 0 ? _getShorthandValue : getShorthandValue(props, "padding")) !== null && _ref !== void 0 ? _ref : 0, _getShorthandValue1, _ref1, estLeftPad = (_ref1 = (_getShorthandValue1 = getShorthandValue(props, "paddingLeft")) !== null && _getShorthandValue1 !== void 0 ? _getShorthandValue1 : estPad) !== null && _ref1 !== void 0 ? _ref1 : 0, _getShorthandValue2, _ref2, estRightPad = (_ref2 = (_getShorthandValue2 = getShorthandValue(props, "paddingRight")) !== null && _getShorthandValue2 !== void 0 ? _getShorthandValue2 : estPad) !== null && _ref2 !== void 0 ? _ref2 : 0;
+      estimatedInitialWidth = estWidth - (estLeftPad ? getVariableValue(estLeftPad) : 0) - (estRightPad ? getVariableValue(estRightPad) : 0);
+    }
+    var [frameWidth, setFrameInnerWidth] = React.useState(estimatedInitialWidth), { switchProps, bubbleInput, switchRef } = useSwitch(
       // @ts-ignore
       props,
       [
@@ -83,11 +89,10 @@ function createSwitch(createProps) {
       checked,
       disabled,
       frameWidth
-    ]), handleLayout = React.useCallback(function(e) {
-      setFrameWidth(e.nativeEvent.layout.width);
-    }, [
-      setFrameWidth
-    ]), _styledContext_unstyled, _ref, unstyled = (_ref = (_styledContext_unstyled = styledContext.unstyled) !== null && _styledContext_unstyled !== void 0 ? _styledContext_unstyled : props.unstyled) !== null && _ref !== void 0 ? _ref : !1, _styledContext_size, _ref1;
+    ]), handleLayout = function(e) {
+      var next = e.nativeEvent.layout.width;
+      next !== frameWidth && setFrameInnerWidth(next);
+    }, _styledContext_unstyled, _ref3, unstyled = (_ref3 = (_styledContext_unstyled = styledContext.unstyled) !== null && _styledContext_unstyled !== void 0 ? _styledContext_unstyled : props.unstyled) !== null && _ref3 !== void 0 ? _ref3 : !1, _styledContext_size, _ref4;
     return /* @__PURE__ */ _jsxs(SwitchContext.Provider, {
       value,
       children: [
@@ -98,7 +103,7 @@ function createSwitch(createProps) {
             type: "button"
           },
           ...!unstyled && {
-            size: (_ref1 = (_styledContext_size = styledContext.size) !== null && _styledContext_size !== void 0 ? _styledContext_size : props.size) !== null && _ref1 !== void 0 ? _ref1 : "$true"
+            size: (_ref4 = (_styledContext_size = styledContext.size) !== null && _styledContext_size !== void 0 ? _styledContext_size : props.size) !== null && _ref4 !== void 0 ? _ref4 : "$true"
           },
           unstyled,
           ...props,
@@ -113,7 +118,7 @@ function createSwitch(createProps) {
           children: /* @__PURE__ */ _jsx(View, {
             style: measureContainerStyle,
             onLayout: handleLayout,
-            children: props.children
+            children: frameWidth ? props.children : null
           })
         }),
         bubbleInput

package/dist/jsx/createSwitch.native.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/Users/n8/tamagui/code/ui/switch/src/createSwitch.tsx"],
-  "mappings": "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",
-  "names": ["composeEventHandlers", "isWeb", "shouldRenderNativePlatform", "withStaticProperties", "registerFocusable", "useSwitch", "useControllableState", "React", "Switch", "NativeSwitch", "View", "SwitchStyledContext", "SwitchFrame", "DefaultSwitchFrame", "SwitchThumb", "SwitchContext", "createContext", "checked", "disabled", "frameWidth", "createSwitch", "createProps", "disableActiveTheme", "Frame", "Thumb", "process", "env", "NODE_ENV", "staticConfig", "context", "console", "warn", "SwitchThumbComponent", "styleable", "props", "forwardedRef", "size", "sizeProp", "unstyled", "unstyledProp", "nativeID", "thumbProps", "useContext", "styledContext", "useStyledContext", "unstyledContext", "sizeContext", "TAMAGUI_HEADLESS", "initialChecked", "useRef", "current", "thumbWidth", "setThumbWidth", "useState", "distance", "x", "ref", "theme", "alignSelf", "onLayout", "e", "nativeEvent", "layout", "width", "SwitchComponent", "_props", "native", "nativeProps", "checkedProp", "defaultChecked", "onCheckedChange", "setChecked", "prop", "defaultProp", "onChange", "transition", "setFrameWidth", "switchProps", "bubbleInput", "switchRef", "useEffect", "id", "focusAndSelect", "value", "focus", "renderNative", "onValueChange", "useMemo", "handleLayout", "useCallback", "Provider", "tag", "type", "themeShallow", "style", "measureContainerStyle", "children", "disableTheme", "flex"]
+  "mappings": "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",
+  "names": ["composeEventHandlers", "getShorthandValue", "getVariableValue", "isWeb", "shouldRenderNativePlatform", "withStaticProperties", "registerFocusable", "useSwitch", "useControllableState", "React", "Switch", "NativeSwitch", "View", "SwitchStyledContext", "SwitchFrame", "DefaultSwitchFrame", "SwitchThumb", "SwitchContext", "createContext", "checked", "disabled", "frameWidth", "createSwitch", "createProps", "disableActiveTheme", "Frame", "Thumb", "process", "env", "NODE_ENV", "staticConfig", "context", "console", "warn", "SwitchThumbComponent", "styleable", "props", "forwardedRef", "size", "sizeProp", "unstyled", "unstyledProp", "nativeID", "thumbProps", "useContext", "styledContext", "useStyledContext", "unstyledContext", "sizeContext", "TAMAGUI_HEADLESS", "initialChecked", "useRef", "current", "initialWidth", "width", "thumbWidth", "setThumbWidth", "useState", "distance", "x", "ref", "theme", "alignSelf", "onLayout", "e", "next", "nativeEvent", "layout", "SwitchComponent", "_props", "native", "nativeProps", "checkedProp", "defaultChecked", "onCheckedChange", "setChecked", "prop", "defaultProp", "onChange", "transition", "estimatedInitialWidth", "estWidth", "estPad", "estLeftPad", "estRightPad", "setFrameInnerWidth", "switchProps", "bubbleInput", "switchRef", "useEffect", "id", "focusAndSelect", "value", "focus", "renderNative", "onValueChange", "useMemo", "handleLayout", "Provider", "tag", "type", "themeShallow", "style", "measureContainerStyle", "children", "disableTheme", "flex"]
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/switch",
-  "version": "1.123.15",
+  "version": "1.123.16",
   "removeSideEffects": true,
   "sideEffects": [
     "*.css"
@@ -37,23 +37,23 @@
     }
   },
   "dependencies": {
-    "@tamagui/compose-refs": "1.123.15",
-    "@tamagui/constants": "1.123.15",
-    "@tamagui/core": "1.123.15",
-    "@tamagui/focusable": "1.123.15",
-    "@tamagui/get-token": "1.123.15",
-    "@tamagui/helpers": "1.123.15",
-    "@tamagui/label": "1.123.15",
-    "@tamagui/stacks": "1.123.15",
-    "@tamagui/switch-headless": "1.123.15",
-    "@tamagui/use-controllable-state": "1.123.15",
-    "@tamagui/use-previous": "1.123.15"
+    "@tamagui/compose-refs": "1.123.16",
+    "@tamagui/constants": "1.123.16",
+    "@tamagui/core": "1.123.16",
+    "@tamagui/focusable": "1.123.16",
+    "@tamagui/get-token": "1.123.16",
+    "@tamagui/helpers": "1.123.16",
+    "@tamagui/label": "1.123.16",
+    "@tamagui/stacks": "1.123.16",
+    "@tamagui/switch-headless": "1.123.16",
+    "@tamagui/use-controllable-state": "1.123.16",
+    "@tamagui/use-previous": "1.123.16"
   },
   "peerDependencies": {
     "react": "*"
   },
   "devDependencies": {
-    "@tamagui/build": "1.123.15",
+    "@tamagui/build": "1.123.16",
     "react": "*"
   },
   "publishConfig": {

package/src/createSwitch.tsx

@@ -1,6 +1,8 @@
 import type { NativeValue, SizeTokens, StackProps } from '@tamagui/core'
 import {
   composeEventHandlers,
+  getShorthandValue,
+  getVariableValue,
   isWeb,
   shouldRenderNativePlatform,
   withStaticProperties,
@@ -19,7 +21,6 @@ import type {
   ViewStyle,
 } from 'react-native'
 import { Switch as NativeSwitch, View } from 'react-native'
-
 import { SwitchStyledContext } from './StyledContext'
 import { SwitchFrame as DefaultSwitchFrame, SwitchThumb } from './Switch'
 
@@ -101,9 +102,13 @@ export function createSwitch<
 
       const initialChecked = React.useRef(checked).current
 
-      const [thumbWidth, setThumbWidth] = React.useState(0)
+      const initialWidth = getVariableValue(props.width, 'size')
+      const [thumbWidth, setThumbWidth] = React.useState(
+        typeof initialWidth === 'number' ? initialWidth : 0
+      )
       const distance = frameWidth - thumbWidth
       const x = initialChecked ? (checked ? 0 : -distance) : checked ? distance : 0
+
       return (
         <Thumb
           ref={forwardedRef}
@@ -117,9 +122,12 @@ export function createSwitch<
           })}
           alignSelf={initialChecked ? 'flex-end' : 'flex-start'}
           x={x}
-          onLayout={composeEventHandlers(props.onLayout, (e) =>
-            setThumbWidth(e.nativeEvent.layout.width)
-          )}
+          onLayout={composeEventHandlers(props.onLayout, (e) => {
+            const next = e.nativeEvent.layout.width
+            if (next !== thumbWidth) {
+              setThumbWidth(next)
+            }
+          })}
           // expected variants
           checked={checked}
           disabled={disabled}
@@ -148,7 +156,25 @@ export function createSwitch<
 
       const styledContext = React.useContext(SwitchStyledContext.context)
 
-      const [frameWidth, setFrameWidth] = React.useState(0)
+      let estimatedInitialWidth = 0
+
+      const estWidth = getVariableValue(getShorthandValue(props, 'width'), 'size')
+
+      if (estWidth) {
+        const estPad =
+          getShorthandValue(props, 'paddingHorizontal') ??
+          getShorthandValue(props, 'padding') ??
+          0
+        const estLeftPad = getShorthandValue(props, 'paddingLeft') ?? estPad ?? 0
+        const estRightPad = getShorthandValue(props, 'paddingRight') ?? estPad ?? 0
+        estimatedInitialWidth =
+          estWidth -
+          (estLeftPad ? getVariableValue(estLeftPad) : 0) -
+          (estRightPad ? getVariableValue(estRightPad) : 0)
+      }
+
+      // this is actually inner width
+      const [frameWidth, setFrameInnerWidth] = React.useState(estimatedInitialWidth)
 
       const { switchProps, bubbleInput, switchRef } = useSwitch(
         // @ts-ignore
@@ -184,12 +210,12 @@ export function createSwitch<
         [checked, disabled, frameWidth]
       )
 
-      const handleLayout = React.useCallback(
-        (e: LayoutChangeEvent) => {
-          setFrameWidth(e.nativeEvent.layout.width)
-        },
-        [setFrameWidth]
-      )
+      const handleLayout = (e: LayoutChangeEvent) => {
+        const next = e.nativeEvent.layout.width
+        if (next !== frameWidth) {
+          setFrameInnerWidth(next)
+        }
+      }
 
       const unstyled = styledContext.unstyled ?? props.unstyled ?? false
 
@@ -215,7 +241,7 @@ export function createSwitch<
             disabled={disabled}
           >
             <View style={measureContainerStyle} onLayout={handleLayout}>
-              {props.children}
+              {!frameWidth ? null : props.children}
             </View>
           </Frame>
 

package/types/createSwitch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createSwitch.d.ts","sourceRoot":"","sources":["../src/createSwitch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAQxE,OAAO,KAAK,EACV,gBAAgB,IAAI,wBAAwB,EAC5C,WAAW,EACZ,MAAM,0BAA0B,CAAA;AAGjC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAEV,WAAW,IAAI,iBAAiB,EAEjC,MAAM,cAAc,CAAA;AAMrB,KAAK,iBAAiB,GAAG;IACvB,IAAI,CAAC,EAAE,UAAU,GAAG,MAAM,CAAA;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,KAAK,eAAe,GAAG,UAAU,GAAG,iBAAiB,CAAA;AAErD,MAAM,MAAM,gBAAgB,GAAG,wBAAwB,GAAG;IACxD,MAAM,CAAC,EAAE,WAAW,CAAC,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC,CAAA;IAClD,WAAW,CAAC,EAAE,iBAAiB,CAAA;CAChC,CAAA;AAED,MAAM,MAAM,WAAW,GAAG,eAAe,GAAG,gBAAgB,CAAA;AAE5D,KAAK,oBAAoB,GAAG,UAAU,CAAA;AAEtC,MAAM,MAAM,gBAAgB,GAAG,oBAAoB,GAAG,iBAAiB,CAAA;AAEvE,eAAO,MAAM,aAAa;aACf,WAAW;gBACR,MAAM;eACP,OAAO;EAKlB,CAAA;AAEF,KAAK,eAAe,GAAG,CAAC,KAAK,EAAE,iBAAiB,GAAG,gBAAgB,KAAK,GAAG,CAAA;AAC3E,KAAK,oBAAoB,GAAG,CAAC,KAAK,EAAE,GAAG,KAAK,GAAG,CAAA;AAE/C,wBAAgB,YAAY,CAC1B,CAAC,SAAS,eAAe,EACzB,CAAC,SAAS,oBAAoB,EAC9B,WAAW,EAAE;IAAE,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IAAC,KAAK,CAAC,EAAE,CAAC,CAAA;CAAE;;;;;;;;;;;;;aA1B1D,WAAW,CAAC,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;kBACpC,iBAAiB;;;;;;;;;;;;;;aADtB,WAAW,CAAC,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;kBACpC,iBAAiB;;aADtB,WAAW,CAAC,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;kBACpC,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;iBADtB,WAAW,CAAC,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;sBACpC,iBAAiB;;iBADtB,WAAW,CAAC,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;sBACpC,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuMhC"}
+{"version":3,"file":"createSwitch.d.ts","sourceRoot":"","sources":["../src/createSwitch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAUxE,OAAO,KAAK,EACV,gBAAgB,IAAI,wBAAwB,EAC5C,WAAW,EACZ,MAAM,0BAA0B,CAAA;AAGjC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAEV,WAAW,IAAI,iBAAiB,EAEjC,MAAM,cAAc,CAAA;AAKrB,KAAK,iBAAiB,GAAG;IACvB,IAAI,CAAC,EAAE,UAAU,GAAG,MAAM,CAAA;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,KAAK,eAAe,GAAG,UAAU,GAAG,iBAAiB,CAAA;AAErD,MAAM,MAAM,gBAAgB,GAAG,wBAAwB,GAAG;IACxD,MAAM,CAAC,EAAE,WAAW,CAAC,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC,CAAA;IAClD,WAAW,CAAC,EAAE,iBAAiB,CAAA;CAChC,CAAA;AAED,MAAM,MAAM,WAAW,GAAG,eAAe,GAAG,gBAAgB,CAAA;AAE5D,KAAK,oBAAoB,GAAG,UAAU,CAAA;AAEtC,MAAM,MAAM,gBAAgB,GAAG,oBAAoB,GAAG,iBAAiB,CAAA;AAEvE,eAAO,MAAM,aAAa;aACf,WAAW;gBACR,MAAM;eACP,OAAO;EAKlB,CAAA;AAEF,KAAK,eAAe,GAAG,CAAC,KAAK,EAAE,iBAAiB,GAAG,gBAAgB,KAAK,GAAG,CAAA;AAC3E,KAAK,oBAAoB,GAAG,CAAC,KAAK,EAAE,GAAG,KAAK,GAAG,CAAA;AAE/C,wBAAgB,YAAY,CAC1B,CAAC,SAAS,eAAe,EACzB,CAAC,SAAS,oBAAoB,EAC9B,WAAW,EAAE;IAAE,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IAAC,KAAK,CAAC,EAAE,CAAC,CAAA;CAAE;;;;;;;;;;;;;aA1B1D,WAAW,CAAC,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;kBACpC,iBAAiB;;;;;;;;;;;;;;aADtB,WAAW,CAAC,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;kBACpC,iBAAiB;;aADtB,WAAW,CAAC,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;kBACpC,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;iBADtB,WAAW,CAAC,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;sBACpC,iBAAiB;;iBADtB,WAAW,CAAC,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;sBACpC,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgOhC"}