tamagui 1.123.9 → 1.123.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/native.js CHANGED
@@ -6810,7 +6810,7 @@ var require_propMapper_native = __commonJS({
6810
6810
  return;
6811
6811
  }
6812
6812
  }
6813
- if (styleProps.disableExpandShorthands || key in conf.shorthands && (key = conf.shorthands[key]), value != null && (value[0] === "$" ? value = getTokenForKey(key, value, styleProps.resolveValues, styleState) : (0, import_createVariable.isVariable)(value) && (value = resolveVariableValue(key, value, styleProps.resolveValues))), value != null) {
6813
+ if (styleProps.disableExpandShorthands || key in conf.shorthands && (key = conf.shorthands[key]), value != null && (value[0] === "$" ? value = getTokenForKey(key, value, styleProps, styleState) : (0, import_createVariable.isVariable)(value) && (value = resolveVariableValue(key, value, styleProps.resolveValues))), value != null) {
6814
6814
  key === "fontFamily" && lastFontFamilyToken && (styleState.fontFamily = lastFontFamilyToken);
6815
6815
  var expanded = styleProps.noExpand ? null : (0, import_expandStyle.expandStyle)(key, value);
6816
6816
  if (expanded) for (var max2 = expanded.length, i = 0; i < max2; i++) {
@@ -6872,7 +6872,7 @@ var require_propMapper_native = __commonJS({
6872
6872
  if (styleProps.noExpand) res[subKey] = val;
6873
6873
  else if (variants && subKey in variants) {
6874
6874
  if (parentVariantKey && parentVariantKey === key) res[subKey] = // SYNC WITH *1
6875
- val[0] === "$" ? getTokenForKey(subKey, val, styleProps.resolveValues, styleState) : val;
6875
+ val[0] === "$" ? getTokenForKey(subKey, val, styleProps, styleState) : val;
6876
6876
  else {
6877
6877
  var variantOut = resolveVariants(subKey, val, styleProps, styleState, key);
6878
6878
  if (variantOut) {
@@ -6905,7 +6905,7 @@ var require_propMapper_native = __commonJS({
6905
6905
  if (typeof val == "string") {
6906
6906
  var fVal = (
6907
6907
  // SYNC WITH *1
6908
- val[0] === "$" ? getTokenForKey(subKey, val, styleProps.resolveValues, styleState) : val
6908
+ val[0] === "$" ? getTokenForKey(subKey, val, styleProps, styleState) : val
6909
6909
  );
6910
6910
  res[subKey] = fVal;
6911
6911
  continue;
@@ -6965,16 +6965,18 @@ var require_propMapper_native = __commonJS({
6965
6965
  var fontShorthand = {
6966
6966
  fontSize: "size",
6967
6967
  fontWeight: "weight"
6968
- }, lastFontFamilyToken = null, getTokenForKey = function(key, value) {
6969
- var resolveAs = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : "none", styleState = arguments.length > 3 ? arguments[3] : void 0, _staticConfig_accept;
6968
+ }, lastFontFamilyToken = null, getTokenForKey = function(key, value, styleProps, styleState) {
6969
+ var _staticConfig_accept, resolveAs = styleProps.resolveValues || "none";
6970
6970
  if (resolveAs === "none") return value;
6971
6971
  var { theme, conf = (0, import_config.getConfig)(), context, fontFamily, staticConfig } = styleState, tokensParsed = conf.tokensParsed, valOrVar, hasSet = !1, customTokenAccept = staticConfig == null || (_staticConfig_accept = staticConfig.accept) === null || _staticConfig_accept === void 0 ? void 0 : _staticConfig_accept[key];
6972
6972
  if (customTokenAccept) {
6973
6973
  var _theme_value, val = (_theme_value = theme == null ? void 0 : theme[value]) !== null && _theme_value !== void 0 ? _theme_value : tokensParsed[customTokenAccept][value];
6974
6974
  val != null && (resolveAs = "value", valOrVar = val, hasSet = !0);
6975
6975
  }
6976
- if (theme && value in theme) valOrVar = theme[value], process.env.NODE_ENV === "development" && styleState.debug === "verbose" && (globalThis.tamaguiAvoidTracking = !0, console.info(` - resolving ${key} to theme value ${value} resolveAs ${resolveAs}`, valOrVar), globalThis.tamaguiAvoidTracking = !1), hasSet = !0;
6977
- else {
6976
+ if (theme && value in theme) {
6977
+ if (resolveAs === "except-theme") return value;
6978
+ valOrVar = theme[value], process.env.NODE_ENV === "development" && styleState.debug === "verbose" && (globalThis.tamaguiAvoidTracking = !0, console.info(` - resolving ${key} to theme value ${value} resolveAs ${resolveAs}`, valOrVar), globalThis.tamaguiAvoidTracking = !1), hasSet = !0;
6979
+ } else {
6978
6980
  if (value in conf.specificTokens) hasSet = !0, valOrVar = conf.specificTokens[value];
6979
6981
  else {
6980
6982
  switch (key) {
@@ -7480,7 +7482,7 @@ var require_getSplitStyles_native = __commonJS({
7480
7482
  console.groupEnd();
7481
7483
  }
7482
7484
  };
7483
- props.reddish && (debug = "verbose"), conf = conf || (0, import_config.getConfig)(), import_constants4.isWeb && styleProps.isAnimated && conf.animations.isReactNative && !styleProps.noNormalize && (styleProps.noNormalize = "values");
7485
+ conf = conf || (0, import_config.getConfig)(), import_constants4.isWeb && styleProps.isAnimated && conf.animations.isReactNative && !styleProps.noNormalize && (styleProps.noNormalize = "values");
7484
7486
  var { shorthands } = conf, { isHOC, isText, isInput, variants, isReactNative, inlineProps, inlineWhenUnflattened, parentStaticConfig, acceptsClassName } = staticConfig, viewProps = {}, mediaState3 = styleProps.mediaState || import_useMedia.mediaState, usedKeys = {}, shouldDoClasses = acceptsClassName && import_constants4.isWeb && !styleProps.noClass, rulesToInsert = void 0, classNames = {}, transforms = {}, pseudos = null, space = props.space, hasMedia = !1, dynamicThemeAccess, pseudoGroups, mediaGroups, className = props.className || "", mediaStylesSeen = 0, validStyles = staticConfig.validStyles || (staticConfig.isText || staticConfig.isInput ? import_helpers.stylePropsText : import_helpers.validStyles);
7485
7487
  process.env.NODE_ENV === "development" && debug === "profile" && time`split-styles-setup`;
7486
7488
  var styleState = {
@@ -8172,7 +8174,7 @@ var require_themeable_native = __commonJS({
8172
8174
  module2.exports = __toCommonJS2(themeable_exports);
8173
8175
  var import_jsx_runtime6 = require("react/jsx-runtime"), import_react3 = __toESM2(require("react")), import_Theme = require_Theme_native();
8174
8176
  function themeable3(Component, staticConfig) {
8175
- var withThemeComponent = /* @__PURE__ */ import_react3.default.forwardRef(function(props, ref) {
8177
+ var optimize = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : !1, withThemeComponent = function(props, ref) {
8176
8178
  var { themeInverse, theme, componentName, themeReset, ...rest } = props, overriddenContextProps, context = staticConfig == null ? void 0 : staticConfig.context;
8177
8179
  if (context) for (var key in context.props) {
8178
8180
  var val = props[key];
@@ -8185,10 +8187,8 @@ var require_themeable_native = __commonJS({
8185
8187
  ...rest,
8186
8188
  "data-disable-theme": !0
8187
8189
  })
8188
- ), filteredProps = {
8189
- componentName: componentName || (staticConfig == null ? void 0 : staticConfig.componentName)
8190
- };
8191
- "debug" in props && (filteredProps.debug = props.debug), "theme" in props && (filteredProps.name = props.theme), "themeInverse" in props && (filteredProps.inverse = props.themeInverse), "themeReset" in props && (filteredProps.reset = themeReset);
8190
+ ), filteredProps = null, compName = componentName || (staticConfig == null ? void 0 : staticConfig.componentName);
8191
+ if (compName && (filteredProps || (filteredProps = {}), filteredProps.componentName = compName), "debug" in props && (filteredProps || (filteredProps = {}), filteredProps.debug = props.debug), "theme" in props && (filteredProps || (filteredProps = {}), filteredProps.name = props.theme), "themeInverse" in props && (filteredProps || (filteredProps = {}), filteredProps.inverse = props.themeInverse), "themeReset" in props && (filteredProps || (filteredProps = {}), filteredProps.reset = themeReset), optimize && !filteredProps) return element;
8192
8192
  var contents = /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_Theme.Theme, {
8193
8193
  "disable-child-theme": !0,
8194
8194
  ...filteredProps,
@@ -8203,8 +8203,8 @@ var require_themeable_native = __commonJS({
8203
8203
  });
8204
8204
  }
8205
8205
  return contents;
8206
- }), withTheme = withThemeComponent;
8207
- return withTheme.displayName = `Themed(${(Component == null ? void 0 : Component.displayName) || (Component == null ? void 0 : Component.name) || "Anonymous"})`, withTheme;
8206
+ }, withTheme = withThemeComponent;
8207
+ return withTheme.displayName = `Themed(${(Component == null ? void 0 : Component.displayName) || (Component == null ? void 0 : Component.name) || "Anonymous"})`, optimize ? withTheme : /* @__PURE__ */ import_react3.default.forwardRef(withTheme);
8208
8208
  }
8209
8209
  }
8210
8210
  });
@@ -9138,7 +9138,7 @@ If you meant to do this, you can disable this warning - either change untilMeasu
9138
9138
  }
9139
9139
  function styleable(Component2, options) {
9140
9140
  var _Component_render, isForwardedRefAlready = ((_Component_render = Component2.render) === null || _Component_render === void 0 ? void 0 : _Component_render.length) === 2, out = isForwardedRefAlready ? Component2 : /* @__PURE__ */ import_react3.default.forwardRef(Component2), extendedConfig = extendStyledConfig(options == null ? void 0 : options.staticConfig);
9141
- return out = options != null && options.disableTheme ? out : (0, import_themeable.themeable)(out, extendedConfig), process.env.TAMAGUI_MEMOIZE_STYLEABLE && (out = /* @__PURE__ */ import_react3.default.memo(out)), out.staticConfig = extendedConfig, out.styleable = styleable, out;
9141
+ return out = options != null && options.disableTheme ? out : (0, import_themeable.themeable)(out, extendedConfig, !0), process.env.TAMAGUI_MEMOIZE_STYLEABLE && (out = /* @__PURE__ */ import_react3.default.memo(out)), out.staticConfig = extendedConfig, out.styleable = styleable, out;
9142
9142
  }
9143
9143
  return res.extractable = extractable, res.styleable = styleable, res;
9144
9144
  }
@@ -29384,80 +29384,20 @@ var require_useSwitch_native = __commonJS({
29384
29384
  });
29385
29385
  module2.exports = __toCommonJS2(useSwitch_exports);
29386
29386
  var import_jsx_runtime6 = require("react/jsx-runtime"), import_compose_refs = require_index_native12(), import_constants4 = require_index_native6(), import_helpers = require_index_native7(), import_label = require_index_native46(), import_use_previous = require_index_native47(), React4 = __toESM2(require("react"));
29387
- function getState(checked) {
29388
- return checked ? "checked" : "unchecked";
29389
- }
29390
- var BubbleInput = function(props) {
29391
- var { control, checked, bubbles = !0, ...inputProps } = props, ref = React4.useRef(null), prevChecked = (0, import_use_previous.usePrevious)(checked);
29392
- return React4.useEffect(function() {
29393
- var input = ref.current, inputProto = window.HTMLInputElement.prototype, descriptor = Object.getOwnPropertyDescriptor(inputProto, "checked"), setChecked = descriptor.set;
29394
- if (prevChecked !== checked && setChecked) {
29395
- var event = new Event("click", {
29396
- bubbles
29397
- });
29398
- setChecked.call(input, checked), input.dispatchEvent(event);
29399
- }
29400
- }, [
29401
- prevChecked,
29402
- checked,
29403
- bubbles
29404
- ]), // @ts-ignore
29405
- /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("input", {
29406
- type: "checkbox",
29407
- "aria-hidden": !0,
29408
- defaultChecked: checked,
29409
- ...inputProps,
29410
- tabIndex: -1,
29411
- ref,
29412
- style: {
29413
- ...props.style,
29414
- position: "absolute",
29415
- pointerEvents: "none",
29416
- opacity: 0,
29417
- margin: 0
29418
- }
29419
- });
29420
- };
29421
29387
  function useSwitch(props, param, ref) {
29422
- var [checked, setChecked] = param, { disabled, name, value, required } = props, hasConsumerStoppedPropagationRef = React4.useRef(!1), [button, setButton] = React4.useState(null), composedRefs = (0, import_compose_refs.useComposedRefs)(ref, setButton), isFormControl = import_constants4.isWeb ? button ? !!button.closest("form") : !0 : !1, labelId = (0, import_label.useLabelContext)(button), ariaLabelledBy = props["aria-labelledby"] || props.labeledBy || labelId;
29388
+ var [checked, setChecked] = param;
29423
29389
  return {
29424
29390
  switchProps: {
29425
- role: "switch",
29426
- "aria-checked": checked,
29427
- ...import_constants4.isWeb ? {
29428
- tabIndex: disabled ? void 0 : 0,
29429
- "data-state": getState(checked),
29430
- "data-disabled": disabled ? "" : void 0,
29431
- disabled
29432
- } : {},
29433
- ...props,
29434
- "aria-labelledby": ariaLabelledBy,
29435
- onPress: (0, import_helpers.composeEventHandlers)(props.onPress, function(event) {
29391
+ onPress() {
29436
29392
  setChecked(function(prevChecked) {
29437
29393
  return !prevChecked;
29438
- }), import_constants4.isWeb && isFormControl && (hasConsumerStoppedPropagationRef.current = event.isPropagationStopped(), hasConsumerStoppedPropagationRef.current || event.stopPropagation());
29439
- })
29440
- },
29441
- switchRef: composedRefs,
29442
- /**
29443
- * insert as a sibling of your switch (should not be inside the switch)
29444
- */
29445
- bubbleInput: import_constants4.isWeb && isFormControl ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(BubbleInput, {
29446
- control: button,
29447
- bubbles: !hasConsumerStoppedPropagationRef.current,
29448
- name,
29449
- value,
29450
- checked,
29451
- required,
29452
- disabled,
29453
- // We transform because the input is absolutely positioned but we have
29454
- // rendered it **after** the button. This pulls it back to sit on top
29455
- // of the button.
29456
- style: {
29457
- transform: "translateX(-100%)"
29394
+ });
29458
29395
  }
29459
- }) : null
29396
+ },
29397
+ switchRef: ref,
29398
+ bubbleInput: null
29460
29399
  };
29400
+ var disabled, name, value, required, hasConsumerStoppedPropagationRef, button, setButton, composedRefs, isFormControl, labelId, ariaLabelledBy;
29461
29401
  }
29462
29402
  }
29463
29403
  });
@@ -29745,7 +29685,6 @@ var require_createSwitch_native = __commonJS({
29745
29685
  },
29746
29686
  alignSelf: initialChecked ? "flex-end" : "flex-start",
29747
29687
  x,
29748
- // TODO: remove ViewProps cast
29749
29688
  onLayout: (0, import_core12.composeEventHandlers)(props.onLayout, function(e) {
29750
29689
  return setThumbWidth(e.nativeEvent.layout.width);
29751
29690
  }),
@@ -29760,17 +29699,9 @@ var require_createSwitch_native = __commonJS({
29760
29699
  defaultProp: defaultChecked || !1,
29761
29700
  onChange: onCheckedChange,
29762
29701
  transition: !0
29763
- }), styledContext = React4.useContext(import_StyledContext.SwitchStyledContext.context), [frameWidth, setFrameWidth] = React4.useState(0), propsActive = (0, import_core12.useProps)(props, {
29764
- noNormalize: !0,
29765
- noExpand: !0,
29766
- resolveValues: "none",
29767
- forComponent: Frame
29768
- }), _styledContext_size, _ref, _styledContext_unstyled, _ref1, { switchProps, bubbleInput, switchRef } = (0, import_switch_headless.useSwitch)(
29702
+ }), styledContext = React4.useContext(import_StyledContext.SwitchStyledContext.context), [frameWidth, setFrameWidth] = React4.useState(0), { switchProps, bubbleInput, switchRef } = (0, import_switch_headless.useSwitch)(
29769
29703
  // @ts-ignore
29770
- Object.assign({
29771
- size: (_ref = (_styledContext_size = styledContext.size) !== null && _styledContext_size !== void 0 ? _styledContext_size : props.size) !== null && _ref !== void 0 ? _ref : "$true",
29772
- unstyled: (_ref1 = (_styledContext_unstyled = styledContext.unstyled) !== null && _styledContext_unstyled !== void 0 ? _styledContext_unstyled : props.unstyled) !== null && _ref1 !== void 0 ? _ref1 : !1
29773
- }, propsActive),
29704
+ props,
29774
29705
  [
29775
29706
  checked,
29776
29707
  setChecked
@@ -29780,8 +29711,8 @@ var require_createSwitch_native = __commonJS({
29780
29711
  React4.useEffect(function() {
29781
29712
  if (props.id && !props.disabled) return (0, import_focusable2.registerFocusable)(props.id, {
29782
29713
  focusAndSelect: function() {
29783
- setChecked == null || setChecked(function(value) {
29784
- return !value;
29714
+ setChecked == null || setChecked(function(value2) {
29715
+ return !value2;
29785
29716
  });
29786
29717
  },
29787
29718
  focus: function() {
@@ -29792,16 +29723,28 @@ var require_createSwitch_native = __commonJS({
29792
29723
  props.disabled
29793
29724
  ]);
29794
29725
  var renderNative = (0, import_core12.shouldRenderNativePlatform)(native);
29795
- return renderNative === "android" || renderNative === "ios" ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_native4.Switch, {
29726
+ if (renderNative === "android" || renderNative === "ios") return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_native4.Switch, {
29796
29727
  value: checked,
29797
29728
  onValueChange: setChecked,
29798
29729
  ...nativeProps
29799
- }) : /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(SwitchContext.Provider, {
29800
- value: {
29730
+ });
29731
+ var disabled = props.disabled, value = React4.useMemo(function() {
29732
+ return {
29801
29733
  checked,
29802
- disabled: switchProps.disabled,
29734
+ disabled,
29803
29735
  frameWidth
29804
- },
29736
+ };
29737
+ }, [
29738
+ checked,
29739
+ disabled,
29740
+ frameWidth
29741
+ ]), handleLayout = React4.useCallback(function(e) {
29742
+ setFrameWidth(e.nativeEvent.layout.width);
29743
+ }, [
29744
+ setFrameWidth
29745
+ ]), _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;
29746
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(SwitchContext.Provider, {
29747
+ value,
29805
29748
  children: [
29806
29749
  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Frame, {
29807
29750
  ref: switchRef,
@@ -29809,6 +29752,11 @@ var require_createSwitch_native = __commonJS({
29809
29752
  ...import_core12.isWeb && {
29810
29753
  type: "button"
29811
29754
  },
29755
+ ...!unstyled && {
29756
+ size: (_ref1 = (_styledContext_size = styledContext.size) !== null && _styledContext_size !== void 0 ? _styledContext_size : props.size) !== null && _ref1 !== void 0 ? _ref1 : "$true"
29757
+ },
29758
+ unstyled,
29759
+ ...props,
29812
29760
  ...switchProps,
29813
29761
  ...!disableActiveTheme && !props.unstyled && {
29814
29762
  theme: checked ? "active" : null,
@@ -29816,14 +29764,11 @@ var require_createSwitch_native = __commonJS({
29816
29764
  },
29817
29765
  // expected variants
29818
29766
  checked,
29819
- disabled: switchProps.disabled,
29820
- children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core12.Stack, {
29821
- alignSelf: "stretch",
29822
- flex: 1,
29823
- onLayout: function(e) {
29824
- setFrameWidth(e.nativeEvent.layout.width);
29825
- },
29826
- children: switchProps.children
29767
+ disabled,
29768
+ children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_native4.View, {
29769
+ style: measureContainerStyle,
29770
+ onLayout: handleLayout,
29771
+ children: props.children
29827
29772
  })
29828
29773
  }),
29829
29774
  bubbleInput
@@ -29836,6 +29781,10 @@ var require_createSwitch_native = __commonJS({
29836
29781
  Thumb: SwitchThumbComponent
29837
29782
  });
29838
29783
  }
29784
+ var measureContainerStyle = {
29785
+ alignSelf: "stretch",
29786
+ flex: 1
29787
+ };
29839
29788
  }
29840
29789
  });
29841
29790