tamagui 1.74.15 → 1.74.16

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
@@ -3387,7 +3387,7 @@ var require_ThemeManager_native = __commonJS({
3387
3387
  __export2(ThemeManager_exports, {
3388
3388
  ThemeManager: () => ThemeManager,
3389
3389
  getHasThemeUpdatingProps: () => getHasThemeUpdatingProps,
3390
- getNonComponentParentManager: () => getNonComponentParentManager
3390
+ getManagers: () => getManagers
3391
3391
  });
3392
3392
  module2.exports = __toCommonJS2(ThemeManager_exports);
3393
3393
  var import_constants = require_index_native2(), import_config = require_config_native(), import_constants2 = require_constants_native2(), emptyState = { name: "" };
@@ -3395,17 +3395,17 @@ var require_ThemeManager_native = __commonJS({
3395
3395
  return props.name || props.componentName || props.inverse || props.reset;
3396
3396
  }
3397
3397
  var uid = 0, ThemeManager = class {
3398
- constructor(props = {}, parentManagerIn) {
3399
- if (this.props = props, this.id = uid++, this.isComponent = !1, this.themeListeners = /* @__PURE__ */ new Set(), this.parentManager = null, this.state = emptyState, this.scheme = null, this._allKeys = null, parentManagerIn === "root") {
3398
+ constructor(props = {}, parentManager) {
3399
+ if (this.props = props, this.id = uid++, this.themeListeners = /* @__PURE__ */ new Set(), this.parentManager = null, this.state = emptyState, this._allKeys = null, parentManager === "root") {
3400
3400
  this.updateStateFromProps(props, !1);
3401
3401
  return;
3402
3402
  }
3403
- if (!parentManagerIn)
3403
+ if (!parentManager)
3404
3404
  throw process.env.NODE_ENV !== "production" ? new Error(
3405
3405
  "No parent manager given, this is likely due to duplicated Tamagui dependencies. Check your lockfile for mis-matched versions. It could also be from an error somewhere else in your stack causing Tamagui to recieve undefined context, you can try putting some ErrorBoundary components around other areas of your app, or a Suspense boundary."
3406
3406
  ) : "\u274C 0";
3407
- if (this.parentManager = parentManagerIn, !this.updateStateFromProps(props, !1))
3408
- return parentManagerIn || this;
3407
+ if (this.parentManager = parentManager, !this.updateStateFromProps(props, !1))
3408
+ return parentManager;
3409
3409
  }
3410
3410
  updateStateFromProps(props = this.props || {}, shouldNotify = !0) {
3411
3411
  if (this.props = props, props.forceTheme)
@@ -3415,9 +3415,7 @@ var require_ThemeManager_native = __commonJS({
3415
3415
  return this.updateState(nextState, shouldNotify), nextState;
3416
3416
  }
3417
3417
  updateState(nextState, shouldNotify = !0) {
3418
- this.state = nextState;
3419
- let names = this.state.name.split("_"), lastName = names[names.length - 1][0];
3420
- this.isComponent = lastName[0] === lastName[0].toUpperCase(), this._allKeys = null, this.scheme = names[0] === "light" ? "light" : names[0] === "dark" ? "dark" : null, process.env.NODE_ENV === "development" && (this._numChangeEventsSent ??= 0, this._numChangeEventsSent++), shouldNotify && queueMicrotask(() => {
3418
+ this.state = nextState, this._allKeys = null, process.env.NODE_ENV === "development" && (this._numChangeEventsSent ??= 0, this._numChangeEventsSent++), shouldNotify && queueMicrotask(() => {
3421
3419
  this.notify();
3422
3420
  });
3423
3421
  }
@@ -3450,86 +3448,68 @@ var require_ThemeManager_native = __commonJS({
3450
3448
  };
3451
3449
  }
3452
3450
  };
3453
- function getNextThemeClassName(name) {
3454
- return `t_sub_theme ${import_constants2.THEME_CLASSNAME_PREFIX}${name}`.replace("light_", "").replace("dark_", "");
3455
- }
3456
- function getState(props, parentManager) {
3457
- var _a, _b, _c, _d, _e, _f;
3458
- let validManagerAndAllComponentThemes = getNonComponentParentManager(parentManager);
3459
- parentManager = validManagerAndAllComponentThemes[0];
3460
- let allComponentThemes = validManagerAndAllComponentThemes[1], themes = (0, import_config.getThemes)(), isDirectParentAComponentTheme = allComponentThemes.length > 0;
3451
+ function getState(props, manager) {
3461
3452
  if (props.name && props.reset)
3462
- throw new Error("Cannot reset + set new name");
3463
- if (!props.name && !props.inverse && !props.reset && !props.componentName)
3453
+ throw new Error(
3454
+ process.env.NODE_ENV === "production" ? "\u274C004" : "Cannot reset and set a new name at the same time."
3455
+ );
3456
+ if (!getHasThemeUpdatingProps(props))
3464
3457
  return null;
3465
- if (props.reset && !isDirectParentAComponentTheme && !(parentManager != null && parentManager.parentManager))
3466
- return process.env.NODE_ENV === "development" && console.warn("Cannot reset no grandparent exists"), null;
3467
- let result = null, nextName = props.reset ? isDirectParentAComponentTheme ? ((_a = parentManager == null ? void 0 : parentManager.state) == null ? void 0 : _a.name) || "" : ((_c = (_b = parentManager == null ? void 0 : parentManager.parentManager) == null ? void 0 : _b.state) == null ? void 0 : _c.name) || "" : props.name || "", { componentName } = props, parentName = props.reset ? isDirectParentAComponentTheme ? (
3468
- // here because parentManager already skipped componentTheme so we have to only go up once
3469
- ((_d = parentManager == null ? void 0 : parentManager.parentManager) == null ? void 0 : _d.state.name) || ""
3470
- ) : ((_f = (_e = parentManager == null ? void 0 : parentManager.parentManager) == null ? void 0 : _e.parentManager) == null ? void 0 : _f.state.name) || "" : isDirectParentAComponentTheme ? allComponentThemes[0] || "" : (parentManager == null ? void 0 : parentManager.state.name) || "";
3458
+ let themes = (0, import_config.getThemes)(), [allManagers, componentManagers] = getManagers(manager), isDirectParentAComponentTheme = !!(manager != null && manager.state.isComponent), startIndex = allManagers.findIndex((x) => !(x != null && x.state.isComponent)) + (props.reset && !isDirectParentAComponentTheme ? 1 : 0), baseManager = allManagers[startIndex], parentManager = allManagers[startIndex + 1];
3459
+ if (!baseManager && props.reset)
3460
+ return process.env.NODE_ENV !== "production" && console.warn("Cannot reset, no parent theme exists"), null;
3461
+ let result = null, baseName = (baseManager == null ? void 0 : baseManager.state.name) || "", nextName = props.reset ? baseName : props.name || "", allComponentThemes = componentManagers.map((x) => (x == null ? void 0 : x.state.name) || "");
3471
3462
  props.reset && isDirectParentAComponentTheme && allComponentThemes.shift();
3472
- let base = parentName.split(import_constants2.THEME_NAME_SEPARATOR), lastSegment = base[base.length - 1], isParentComponentTheme = parentName && lastSegment[0].toUpperCase() === lastSegment[0];
3473
- isParentComponentTheme && base.pop();
3474
- let parentBaseTheme = isParentComponentTheme ? base.slice(0, base.length).join(import_constants2.THEME_NAME_SEPARATOR) : parentName, max2 = base.length, min2 = componentName && !nextName ? max2 : 0;
3475
- process.env.NODE_ENV === "development" && typeof props.debug == "string" && (console.groupCollapsed("ThemeManager.getState()"), console.info({
3476
- props,
3477
- parentName,
3478
- parentBaseTheme,
3479
- base,
3480
- min: min2,
3481
- max: max2,
3482
- isParentComponentTheme
3483
- }));
3463
+ let base = baseName.split(import_constants2.THEME_NAME_SEPARATOR), max2 = base.length, min2 = props.componentName && !nextName ? max2 : 0;
3464
+ process.env.NODE_ENV === "development" && typeof props.debug == "string" && (console.groupCollapsed("ThemeManager.getState()"), console.info({ props, baseName, base, min: min2, max: max2 }));
3484
3465
  for (let i = max2; i >= min2; i--) {
3485
3466
  let prefix = base.slice(0, i).join(import_constants2.THEME_NAME_SEPARATOR);
3486
3467
  props.inverse && (prefix = inverseThemeName(prefix));
3487
3468
  let potentials = [];
3488
- if (prefix && prefix !== parentBaseTheme && potentials.push(prefix), nextName && potentials.unshift(prefix ? `${prefix}_${nextName}` : nextName), i === 1) {
3489
- let lastSegment2 = potentials.findIndex((x) => !x.includes("_"));
3490
- lastSegment2 > 0 && potentials.splice(lastSegment2, 0, nextName);
3469
+ if (prefix && prefix !== baseName && potentials.push(prefix), nextName && potentials.unshift(prefix ? `${prefix}_${nextName}` : nextName), i === 1) {
3470
+ let lastSegment = potentials.findIndex((x) => !x.includes("_"));
3471
+ lastSegment > 0 && potentials.splice(lastSegment, 0, nextName);
3491
3472
  }
3492
- if (componentName) {
3473
+ if (props.componentName) {
3493
3474
  let componentPotentials = [];
3494
3475
  if (nextName) {
3495
3476
  let beforeSeparator = prefix.slice(0, prefix.indexOf(import_constants2.THEME_NAME_SEPARATOR));
3496
- componentPotentials.push(`${beforeSeparator}_${nextName}_${componentName}`);
3477
+ componentPotentials.push(`${beforeSeparator}_${nextName}_${props.componentName}`);
3497
3478
  }
3498
- if (componentPotentials.push(`${prefix}_${componentName}`), nextName) {
3479
+ if (componentPotentials.push(`${prefix}_${props.componentName}`), nextName) {
3499
3480
  let prefixLessOne = base.slice(0, i - 1).join(import_constants2.THEME_NAME_SEPARATOR);
3500
3481
  if (prefixLessOne) {
3501
- let lessSpecific = `${prefixLessOne}_${nextName}_${componentName}`;
3482
+ let lessSpecific = `${prefixLessOne}_${nextName}_${props.componentName}`;
3502
3483
  componentPotentials.unshift(lessSpecific);
3503
3484
  }
3504
- let moreSpecific = `${prefix}_${nextName}_${componentName}`;
3485
+ let moreSpecific = `${prefix}_${nextName}_${props.componentName}`;
3505
3486
  componentPotentials.unshift(moreSpecific);
3506
3487
  }
3507
3488
  potentials = [...componentPotentials, ...potentials, ...allComponentThemes];
3508
3489
  }
3509
3490
  let found = potentials.find((t) => t in themes);
3510
- if (process.env.NODE_ENV === "development" && typeof props.debug == "string" && console.info(" - ", { found, potentials, parentManager }), found) {
3491
+ if (process.env.NODE_ENV === "development" && typeof props.debug == "string" && console.info(" - ", { found, potentials, baseManager }), found) {
3492
+ let names = found.split("_"), [firstName, ...restNames] = names, lastName = names[names.length - 1], isComponent = lastName[0] === lastName[0].toUpperCase(), scheme = firstName === "light" ? "light" : firstName === "dark" ? "dark" : void 0, pre = import_constants2.THEME_CLASSNAME_PREFIX, className = import_constants.isWeb ? `${pre}sub_theme ${pre}${!scheme || !restNames.length ? firstName : restNames.join("_")}` : "", parentState = baseManager == null ? void 0 : baseManager.state, parentScheme = parentState == null ? void 0 : parentState.scheme, parentName = parentState == null ? void 0 : parentState.name, inverse = parentScheme && scheme !== parentScheme;
3511
3493
  result = {
3512
3494
  name: found,
3513
- theme: themes[found],
3514
- className: import_constants.isWeb ? getNextThemeClassName(found) : "",
3515
3495
  parentName,
3516
- componentName,
3517
- inverse: props.inverse
3496
+ theme: themes[found],
3497
+ className,
3498
+ inverse,
3499
+ isComponent,
3500
+ scheme
3518
3501
  };
3519
3502
  break;
3520
3503
  }
3521
3504
  }
3522
- return process.env.NODE_ENV === "development" && typeof props.debug == "string" && typeof window < "u" && (console.warn("ThemeManager.getState():", {
3523
- result
3524
- }), console.trace(), console.groupEnd()), result;
3505
+ return process.env.NODE_ENV === "development" && typeof props.debug == "string" && typeof window < "u" && (console.warn("ThemeManager.getState():", { result }), console.trace(), console.groupEnd()), result;
3525
3506
  }
3526
3507
  var inverseThemeName = (themeName) => themeName.startsWith("light") ? themeName.replace(/^light/, "dark") : themeName.replace(/^dark/, "light");
3527
- function getNonComponentParentManager(themeManager) {
3528
- var _a;
3529
- let res = themeManager, componentThemeNames = [];
3530
- for (; res && res != null && res.isComponent; )
3531
- componentThemeNames.push((_a = res == null ? void 0 : res.state) == null ? void 0 : _a.name), res = res.parentManager;
3532
- return [res || null, componentThemeNames];
3508
+ function getManagers(themeManager) {
3509
+ let comp = [], all = [], cur = themeManager;
3510
+ for (; cur; )
3511
+ all.push(cur), cur.state.isComponent && comp.push(cur), cur = cur.parentManager;
3512
+ return [all, comp];
3533
3513
  }
3534
3514
  }
3535
3515
  });
@@ -3611,7 +3591,7 @@ If this is intended and you are using Tamagui without any themes, you can disabl
3611
3591
  let themeProxied = (0, import_react2.useMemo)(() => !themeManager || !(state != null && state.theme) ? {} : getThemeProxied(state, props.deopt, themeManager, keys.current, props.debug), [state, themeManager, props.deopt, props.debug]);
3612
3592
  return process.env.NODE_ENV === "development" && props.debug === "verbose" && (console.groupCollapsed(" \u{1F539} useTheme =>", state == null ? void 0 : state.name), console.info("returning state", changedThemeState, "from props", props), console.groupEnd()), [changedThemeState, themeProxied];
3613
3593
  };
3614
- function getThemeProxied({ theme, name }, deopt = !1, themeManager, keys, debug) {
3594
+ function getThemeProxied({ theme, name, scheme }, deopt = !1, themeManager, keys, debug) {
3615
3595
  if (!theme)
3616
3596
  return {};
3617
3597
  let config = (0, import_config.getConfig)();
@@ -3644,21 +3624,18 @@ If this is intended and you are using Tamagui without any themes, you can disabl
3644
3624
  else if (subkey === "get")
3645
3625
  return (platform) => {
3646
3626
  let outVal = (0, import_createVariable.getVariable)(val);
3647
- if (platform !== "web" && import_constants.isIos && !deopt && config.settings.fastSchemeChange) {
3648
- let isDark = name.startsWith("dark"), isLight = !isDark && name.startsWith("light");
3649
- if (isDark || isLight) {
3650
- let oppositeThemeName = name.replace(
3651
- isDark ? "dark" : "light",
3652
- isDark ? "light" : "dark"
3653
- ), oppositeTheme = config.themes[oppositeThemeName], oppositeVal = (0, import_createVariable.getVariable)(oppositeTheme == null ? void 0 : oppositeTheme[keyString]);
3654
- if (oppositeVal)
3655
- return {
3656
- dynamic: {
3657
- dark: isDark ? outVal : oppositeVal,
3658
- light: isLight ? outVal : oppositeVal
3659
- }
3660
- };
3661
- }
3627
+ if (platform !== "web" && import_constants.isIos && !deopt && config.settings.fastSchemeChange && !someParentIsInversed(themeManager) && scheme) {
3628
+ let oppositeThemeName = name.replace(
3629
+ scheme === "dark" ? "dark" : "light",
3630
+ scheme === "dark" ? "light" : "dark"
3631
+ ), oppositeTheme = config.themes[oppositeThemeName], oppositeVal = (0, import_createVariable.getVariable)(oppositeTheme == null ? void 0 : oppositeTheme[keyString]);
3632
+ if (oppositeVal)
3633
+ return {
3634
+ dynamic: {
3635
+ dark: scheme === "dark" ? outVal : oppositeVal,
3636
+ light: scheme === "light" ? outVal : oppositeVal
3637
+ }
3638
+ };
3662
3639
  }
3663
3640
  return track(keyString), outVal;
3664
3641
  };
@@ -3670,6 +3647,17 @@ If this is intended and you are using Tamagui without any themes, you can disabl
3670
3647
  }
3671
3648
  });
3672
3649
  }
3650
+ function someParentIsInversed(manager) {
3651
+ {
3652
+ let cur = manager;
3653
+ for (; cur; ) {
3654
+ if (cur.state.inverse)
3655
+ return !0;
3656
+ cur = cur.parentManager;
3657
+ }
3658
+ }
3659
+ return !1;
3660
+ }
3673
3661
  var activeThemeManagers = /* @__PURE__ */ new Set(), useChangeThemeEffect = (props, isRoot = !1, keys, shouldUpdate) => {
3674
3662
  let { disable } = props, parentManager = (0, import_react2.useContext)(import_ThemeManagerContext.ThemeManagerContext);
3675
3663
  if (!isRoot && !parentManager || disable)
@@ -14993,12 +14981,12 @@ var require_Popper_native = __commonJS({
14993
14981
  left: "right"
14994
14982
  }, PopperArrow = PopperArrowFrame.styleable(function(propsIn, forwardedRef) {
14995
14983
  var _a, _b;
14996
- let { __scopePopper, ...rest } = propsIn, props = (0, import_core13.useProps)(rest), { offset: offset2, size: sizeProp, borderWidth = 0, ...arrowProps } = props, context = usePopperContext(__scopePopper), sizeVal = sizeProp ?? context.size, size2 = +(0, import_core13.getVariableValue)(
14984
+ let { __scopePopper, ...rest } = propsIn, props = (0, import_core13.useProps)(rest), { offset: offset2, size: sizeProp, borderWidth = 0, ...arrowProps } = props, context = usePopperContext(__scopePopper), sizeVal = sizeProp ?? context.size, sizeValResolved = (0, import_core13.getVariableValue)(
14997
14985
  (0, import_get_token2.getSpace)(sizeVal, {
14998
14986
  shift: -2,
14999
14987
  bounds: [2]
15000
14988
  })
15001
- ), { placement } = context, refs = (0, import_compose_refs.useComposedRefs)(context.arrowRef, forwardedRef), x = ((_a = context.arrowStyle) == null ? void 0 : _a.x) || 0, y = ((_b = context.arrowStyle) == null ? void 0 : _b.y) || 0, primaryPlacement = placement ? placement.split("-")[0] : "top", arrowStyle = { x, y, width: size2, height: size2 }, innerArrowStyle = {}, isVertical = primaryPlacement === "bottom" || primaryPlacement === "top";
14989
+ ), size2 = Math.max(0, +sizeValResolved), { placement } = context, refs = (0, import_compose_refs.useComposedRefs)(context.arrowRef, forwardedRef), x = ((_a = context.arrowStyle) == null ? void 0 : _a.x) || 0, y = ((_b = context.arrowStyle) == null ? void 0 : _b.y) || 0, primaryPlacement = placement ? placement.split("-")[0] : "top", arrowStyle = { x, y, width: size2, height: size2 }, innerArrowStyle = {}, isVertical = primaryPlacement === "bottom" || primaryPlacement === "top";
15002
14990
  if (primaryPlacement) {
15003
14991
  arrowStyle[isVertical ? "width" : "height"] = size2 * 2;
15004
14992
  let oppSide = opposites[primaryPlacement];
@@ -18471,9 +18459,7 @@ var require_ToggleGroup_native = __commonJS({
18471
18459
  width: void 0,
18472
18460
  height: void 0,
18473
18461
  padding: (0, import_web.getVariableValue)(size2) * 0.6
18474
- };
18475
- props.unstyled || (props.orientation === "horizontal" ? sizeProps.height = (0, import_web.getVariableValue)(size2) * 2.4 : sizeProps.width = (0, import_web.getVariableValue)(size2) * 2.4);
18476
- let iconSize = (typeof size2 == "number" ? size2 * 0.7 : (0, import_font_size.getFontSize)(size2)) * 1.2, theme = (0, import_web.useTheme)(), getThemedIcon = (0, import_helpers_tamagui.useGetThemedIcon)({ size: iconSize, color: theme.color }), children = import_react2.default.Children.toArray(props.children).map((child) => props.disablePassStyles || !import_react2.default.isValidElement(child) ? child : getThemedIcon(child)), commonProps = { pressed, disabled, ...sizeProps, ...props, children };
18462
+ }, iconSize = (typeof size2 == "number" ? size2 * 0.7 : (0, import_font_size.getFontSize)(size2)) * 1.2, theme = (0, import_web.useTheme)(), getThemedIcon = (0, import_helpers_tamagui.useGetThemedIcon)({ size: iconSize, color: theme.color }), children = import_react2.default.Children.toArray(props.children).map((child) => props.disablePassStyles || !import_react2.default.isValidElement(child) ? child : getThemedIcon(child)), commonProps = { pressed, disabled, ...sizeProps, ...props, children };
18477
18463
  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ToggleGroupItemProvider, { scope: __scopeToggleGroup, children: context.rovingFocus ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
18478
18464
  import_roving_focus.RovingFocusGroup.Item,
18479
18465
  {