tamagui 1.124.3 → 1.124.5

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
@@ -2012,13 +2012,11 @@ var require_useControllableState_native = __commonJS({
2012
2012
  };
2013
2013
  function useControllableState(param) {
2014
2014
  var { prop, defaultProp, onChange, strategy = "prop-wins", preventUpdate, transition } = param, [state, setState] = React4.useState(prop ?? defaultProp), previous = React4.useRef(state), propWins = strategy === "prop-wins" && prop !== void 0, value = propWins ? prop : state, onChangeCb = (0, import_use_event.useEvent)(onChange || idFn), transitionFn = transition ? import_start_transition.startTransition : emptyCallbackFn;
2015
- React4.useEffect(function() {
2016
- prop !== void 0 && (previous.current = prop, transitionFn(function() {
2017
- setState(prop);
2018
- }));
2019
- }, [
2020
- prop
2021
- ]), React4.useEffect(function() {
2015
+ prop !== state && transitionFn(function() {
2016
+ setState(function(prev) {
2017
+ if (prev !== prop) return previous.current = prop, prop;
2018
+ });
2019
+ }), React4.useEffect(function() {
2022
2020
  propWins || state !== previous.current && (previous.current = state, onChangeCb(state));
2023
2021
  }, [
2024
2022
  onChangeCb,
@@ -5876,12 +5874,10 @@ var require_webPropsToSkip_native = __commonJS({
5876
5874
  contain: 1,
5877
5875
  boxSizing: 1,
5878
5876
  touchAction: 1,
5879
- boxShadow: 1,
5880
5877
  outlineStyle: 1,
5881
5878
  outlineOffset: 1,
5882
5879
  outlineWidth: 1,
5883
5880
  outlineColor: 1,
5884
- filter: 1,
5885
5881
  backdropFilter: 1,
5886
5882
  backgroundImage: 1,
5887
5883
  mixBlendMode: 1,
@@ -7310,20 +7306,23 @@ var require_useThemeState_native = __commonJS({
7310
7306
  hasThemeUpdatingProps: function() {
7311
7307
  return hasThemeUpdatingProps;
7312
7308
  },
7309
+ keysToId: function() {
7310
+ return keysToId;
7311
+ },
7313
7312
  useThemeState: function() {
7314
7313
  return useThemeState;
7315
7314
  }
7316
7315
  });
7317
7316
  module2.exports = __toCommonJS2(useThemeState_exports);
7318
- var import_constants4 = require_index_native6(), import_react3 = require("react"), import_config = require_config_native(), ThemeStateContext = (0, import_react3.createContext)(""), allListeners = /* @__PURE__ */ new Map(), listenersByParent = {}, states = /* @__PURE__ */ new Map(), forceUpdateThemes2 = function() {
7319
- allListeners.forEach(function(cb) {
7317
+ var import_constants4 = require_index_native6(), import_react3 = require("react"), import_config = require_config_native(), ThemeStateContext = (0, import_react3.createContext)(""), keysToId = /* @__PURE__ */ new WeakMap(), allListeners = /* @__PURE__ */ new Map(), listenersByParent = {}, hasRenderedOnce = /* @__PURE__ */ new WeakMap(), pendingUpdate = /* @__PURE__ */ new Map(), states = /* @__PURE__ */ new Map(), shouldForce = !1, forceUpdateThemes2 = function() {
7318
+ cacheVersion++, shouldForce = !0, allListeners.forEach(function(cb) {
7320
7319
  return cb();
7321
7320
  });
7322
7321
  }, getThemeState = function(id) {
7323
7322
  return states.get(id);
7324
- }, rootThemeState = null, getRootThemeState = function() {
7323
+ }, cache = /* @__PURE__ */ new Map(), cacheVersion = 0, themes = null, rootThemeState = null, getRootThemeState = function() {
7325
7324
  return rootThemeState;
7326
- }, HasRenderedOnce = /* @__PURE__ */ new WeakMap(), useThemeState = function(props) {
7325
+ }, useThemeState = function(props) {
7327
7326
  var isRoot = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !1, keys = arguments.length > 2 ? arguments[2] : void 0, { disable } = props, parentId = (0, import_react3.useContext)(ThemeStateContext);
7328
7327
  if (disable) return states.get(parentId) || {
7329
7328
  id: "",
@@ -7333,24 +7332,28 @@ var require_useThemeState_native = __commonJS({
7333
7332
  };
7334
7333
  var id = (0, import_react3.useId)(), subscribe = (0, import_react3.useCallback)(function(cb) {
7335
7334
  var _listenersByParent, _parentId;
7336
- return (_listenersByParent = listenersByParent)[_parentId = parentId] || (_listenersByParent[_parentId] = /* @__PURE__ */ new Set()), listenersByParent[parentId].add(id), allListeners.set(id, cb), function() {
7335
+ return (_listenersByParent = listenersByParent)[_parentId = parentId] || (_listenersByParent[_parentId] = /* @__PURE__ */ new Set()), listenersByParent[parentId].add(id), allListeners.set(id, function() {
7336
+ pendingUpdate.set(id, shouldForce ? "force" : !0), cb();
7337
+ }), function() {
7337
7338
  allListeners.delete(id), listenersByParent[parentId].delete(id);
7338
7339
  };
7339
7340
  }, [
7340
7341
  id,
7341
- parentId,
7342
- keys
7342
+ parentId
7343
7343
  ]), propsKey = getPropsKey(props), getSnapshot = function() {
7344
- return getSnapshotFrom(props, propsKey, isRoot, id, parentId, keys);
7344
+ var _keys_current, _props_needsUpdate, last = states.get(id), needsUpdate = props.name === "light" || props.name === "dark" ? !0 : hasRenderedOnce.get(keys) ? !(keys == null || (_keys_current = keys.current) === null || _keys_current === void 0) && _keys_current.size ? !0 : (_props_needsUpdate = props.needsUpdate) === null || _props_needsUpdate === void 0 ? void 0 : _props_needsUpdate.call(props) : !0, parentState = states.get(parentId), cacheKey = `${cacheVersion}${id}${propsKey}${(parentState == null ? void 0 : parentState.name) || ""}${isRoot}`;
7345
+ if (!needsUpdate && cache.has(cacheKey)) return cache.get(cacheKey);
7346
+ var next = getSnapshotFrom(last, props, propsKey, isRoot, id, parentId, needsUpdate, pendingUpdate.get(id));
7347
+ return last !== next && (pendingUpdate.delete(id), states.set(id, next), cache.set(id, next), process.env.NODE_ENV === "development" && props.debug && props.debug !== "profile" && console.warn(` \xB7 useTheme(${id}) UPDATE from`, last, "to", next)), next;
7345
7348
  };
7346
7349
  process.env.NODE_ENV === "development" && globalThis.time && globalThis.time`theme-prep-uses`;
7347
7350
  var state = (0, import_react3.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
7348
7351
  return (0, import_constants4.useIsomorphicLayoutEffect)(function() {
7352
+ if (!hasRenderedOnce.get(keys)) {
7353
+ hasRenderedOnce.set(keys, !0);
7354
+ return;
7355
+ }
7349
7356
  if (propsKey) {
7350
- if (!HasRenderedOnce.has(keys)) {
7351
- HasRenderedOnce.set(keys, !0);
7352
- return;
7353
- }
7354
7357
  if (process.env.NODE_ENV === "development" && props.debug && props.debug !== "profile") {
7355
7358
  var _states_get;
7356
7359
  console.warn(` \xB7 useTheme(${id}) scheduleUpdate`, propsKey, (_states_get = states.get(id)) === null || _states_get === void 0 ? void 0 : _states_get.name);
@@ -7360,29 +7363,30 @@ var require_useThemeState_native = __commonJS({
7360
7363
  }, [
7361
7364
  keys,
7362
7365
  propsKey
7363
- ]), process.env.NODE_ENV === "development" && props.debug && (console.groupCollapsed(` \xB7 useTheme(${id}) =>`, state.name, id === state.id ? "\u{1F389}" : "\u23ED\uFE0F"), console.info({
7364
- state,
7365
- parentId,
7366
- props,
7367
- propsKey,
7368
- id,
7369
- parentState: states.get(parentId)
7370
- }), console.groupEnd()), state.id === id ? {
7366
+ ]), state.id === id ? {
7371
7367
  ...state,
7372
7368
  isNew: !0
7373
7369
  } : state;
7374
- }, themes = null, getSnapshotFrom = function(props, propsKey) {
7375
- var isRoot = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : !1, id = arguments.length > 3 ? arguments[3] : void 0, parentId = arguments.length > 4 ? arguments[4] : void 0, keys = arguments.length > 5 ? arguments[5] : void 0, _keys_current, _props_needsUpdate, needsUpdate = (keys == null || (_keys_current = keys.current) === null || _keys_current === void 0 ? void 0 : _keys_current.size) || ((_props_needsUpdate = props.needsUpdate) === null || _props_needsUpdate === void 0 ? void 0 : _props_needsUpdate.call(props)), parentState = states.get(parentId);
7370
+ }, getSnapshotFrom = function(lastState, props, propsKey) {
7371
+ var isRoot = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : !1, id = arguments.length > 4 ? arguments[4] : void 0, parentId = arguments.length > 5 ? arguments[5] : void 0, needsUpdate = arguments.length > 6 ? arguments[6] : void 0, pendingUpdate2 = arguments.length > 7 ? arguments[7] : void 0, parentState = states.get(parentId);
7376
7372
  themes || (themes = (0, import_config.getConfig)().themes);
7377
- var lastState = states.get(id), name = propsKey ? getNewThemeName(parentState == null ? void 0 : parentState.name, props, !!needsUpdate) : null;
7373
+ var name = !propsKey && pendingUpdate2 !== "force" ? null : getNewThemeName(parentState == null ? void 0 : parentState.name, props, pendingUpdate2 === "force" ? !0 : !!needsUpdate), isSameAsParent = !!(!name && propsKey);
7378
7374
  if (process.env.NODE_ENV === "development" && props.debug && props.debug !== "profile") {
7379
7375
  var message = ` \xB7 useTheme(${id}) snapshot ${name}, parent ${parentState == null ? void 0 : parentState.id} needsUpdate ${needsUpdate}`;
7380
7376
  console.info(message);
7381
7377
  }
7382
- var isSameAsParent = !name && propsKey;
7383
7378
  if (parentState && isSameAsParent) return parentState;
7384
- if (!name) return lastState && !needsUpdate ? lastState : (states.set(id, parentState), parentState);
7385
- if (lastState && lastState.name === name) return lastState;
7379
+ if (!name) {
7380
+ var next = lastState ?? parentState;
7381
+ if (needsUpdate && pendingUpdate2) {
7382
+ var updated = {
7383
+ ...parentState || lastState
7384
+ };
7385
+ return updated;
7386
+ }
7387
+ return next;
7388
+ }
7389
+ if (pendingUpdate2 !== "force" && lastState && lastState.name === name) return lastState;
7386
7390
  var scheme = getScheme(name), _parentState_inverses, parentInverses = (_parentState_inverses = parentState == null ? void 0 : parentState.inverses) !== null && _parentState_inverses !== void 0 ? _parentState_inverses : 0, isInverse = parentState && scheme !== parentState.scheme, inverses = parentInverses + (isInverse ? 1 : 0), nextState = {
7387
7391
  id,
7388
7392
  name,
@@ -7393,7 +7397,7 @@ var require_useThemeState_native = __commonJS({
7393
7397
  inverses,
7394
7398
  isInverse
7395
7399
  };
7396
- return process.env.NODE_ENV === "development" && props.debug && props.debug !== "profile" && (console.groupCollapsed(` \xB7 useTheme(${id}) \u23ED\uFE0F ${name}`), console.info("state", nextState), console.groupEnd()), states.set(id, nextState), isRoot && (rootThemeState = nextState), nextState;
7400
+ return process.env.NODE_ENV === "development" && props.debug && props.debug !== "profile" && (console.groupCollapsed(` \xB7 useTheme(${id}) \u23ED\uFE0F2 ${name}`), console.info("state", nextState), console.groupEnd()), isRoot && (rootThemeState = nextState), pendingUpdate2 !== "force" && lastState && !needsUpdate ? (Object.assign(lastState, nextState), lastState) : nextState;
7397
7401
  };
7398
7402
  function scheduleUpdate(id) {
7399
7403
  for (var queue = [
@@ -7431,7 +7435,7 @@ var require_useThemeState_native = __commonJS({
7431
7435
  return validSchemes[name.split("_")[0]];
7432
7436
  }
7433
7437
  function getNewThemeName() {
7434
- var parentName = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "", { name, reset, componentName, inverse } = arguments.length > 1 ? arguments[1] : void 0, forceUpdate = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : !1;
7438
+ var parentName = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "", { name, reset, componentName, inverse, debug } = arguments.length > 1 ? arguments[1] : void 0, forceUpdate = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : !1;
7435
7439
  if (name && reset) throw new Error(process.env.NODE_ENV === "production" ? "\u274C004" : "Cannot reset and set a new name at the same time.");
7436
7440
  if (reset) {
7437
7441
  if (!parentName) throw new Error("\u203C\uFE0F");
@@ -7465,7 +7469,8 @@ var require_useThemeState_native = __commonJS({
7465
7469
  }
7466
7470
  if (found) break;
7467
7471
  }
7468
- if (found && inverse) {
7472
+ if (inverse) {
7473
+ found || (found = parentName);
7469
7474
  var scheme = found.split("_")[0];
7470
7475
  found = found.replace(new RegExp(`^${scheme}`), scheme === "light" ? "dark" : "light");
7471
7476
  }
@@ -7576,41 +7581,45 @@ var require_getThemeProxied_native = __commonJS({
7576
7581
  }
7577
7582
  });
7578
7583
  module2.exports = __toCommonJS2(getThemeProxied_exports);
7579
- var import_constants4 = require_index_native6(), import_config = require_config_native(), import_createVariable = require_createVariable_native(), import_doesRootSchemeMatchSystem = require_doesRootSchemeMatchSystem_native(), cache = /* @__PURE__ */ new Map(), curKeys, curProps, emptyObject = {};
7580
- function getThemeProxied(_props, state, _keys) {
7581
- var theme = state == null ? void 0 : state.theme;
7582
- if (!theme) return emptyObject;
7583
- if (curKeys = _keys, curProps = _props, cache.has(theme)) {
7584
- var proxied = cache.get(theme);
7584
+ var import_constants4 = require_index_native6(), import_config = require_config_native(), import_createVariable = require_createVariable_native(), import_doesRootSchemeMatchSystem = require_doesRootSchemeMatchSystem_native(), import_useThemeState = require_useThemeState_native(), cache = /* @__PURE__ */ new Map(), curKeys, curProps, curState, emptyObject = {};
7585
+ function getThemeProxied(_props, _state, _keys) {
7586
+ if (!(_state != null && _state.theme)) return emptyObject;
7587
+ if (curKeys = _keys, curProps = _props, curState = _state, cache.has(curState.theme)) {
7588
+ var proxied = cache.get(curState.theme);
7585
7589
  return proxied;
7586
7590
  }
7587
- var { name, scheme } = state, config = (0, import_config.getConfig)();
7591
+ var config = (0, import_config.getConfig)();
7588
7592
  function track(key) {
7589
- curKeys && (curKeys.current || (curKeys.current = /* @__PURE__ */ new Set()), curKeys.current.add(key), process.env.NODE_ENV === "development" && curProps.debug && console.info(` \u{1F3A8} useTheme() tracking new key: ${key}`));
7593
+ if (curKeys && (curKeys.current || (curKeys.current = /* @__PURE__ */ new Set()), curKeys.current.add(key), process.env.NODE_ENV === "development" && curProps.debug)) {
7594
+ var _globalThis_states, realId = import_useThemeState.keysToId.get(curKeys);
7595
+ console.info(` \u{1F3A8} useTheme(${realId}) tracking new key: ${key}`, curKeys, (_globalThis_states = globalThis.states) === null || _globalThis_states === void 0 ? void 0 : _globalThis_states.get(realId + 1));
7596
+ }
7590
7597
  }
7591
- var proxied1 = Object.fromEntries(Object.entries(theme).flatMap(function(param) {
7598
+ var proxied1 = Object.fromEntries(Object.entries(_state.theme).flatMap(function(param) {
7592
7599
  var [key, value] = param, proxied2 = {
7593
7600
  ...value,
7594
7601
  get val() {
7595
7602
  return globalThis.tamaguiAvoidTracking || track(key), value.val;
7596
7603
  },
7597
7604
  get(platform2) {
7598
- var outVal = (0, import_createVariable.getVariable)(value), shouldOptimize = scheme && platform2 !== "web" && import_constants4.isIos && !curProps.deopt && (0, import_config.getSetting)("fastSchemeChange") && state.inverses === 0 && (0, import_doesRootSchemeMatchSystem.doesRootSchemeMatchSystem)();
7599
- if (shouldOptimize) {
7600
- var _config_themes_name, _config_themes_oppositeName, oppositeScheme = scheme === "dark" ? "light" : "dark", oppositeName = name.replace(scheme, oppositeScheme), color = (0, import_createVariable.getVariable)((_config_themes_name = config.themes[name]) === null || _config_themes_name === void 0 ? void 0 : _config_themes_name[key]), oppositeColor = (0, import_createVariable.getVariable)((_config_themes_oppositeName = config.themes[oppositeName]) === null || _config_themes_oppositeName === void 0 ? void 0 : _config_themes_oppositeName[key]), dynamicVal = {
7601
- dynamic: {
7602
- [scheme]: color,
7603
- [oppositeScheme]: oppositeColor
7604
- }
7605
- };
7606
- return dynamicVal;
7607
- }
7608
- return process.env.NODE_ENV === "development" && curProps.debug && console.info(` \u{1F3A8} useTheme() tracking new key because of:
7605
+ if (curState) {
7606
+ var outVal = (0, import_createVariable.getVariable)(value), { name, scheme, inverses } = curState, shouldOptimize = scheme && platform2 !== "web" && import_constants4.isIos && !curProps.deopt && (0, import_config.getSetting)("fastSchemeChange") && inverses === 0 && (0, import_doesRootSchemeMatchSystem.doesRootSchemeMatchSystem)();
7607
+ if (shouldOptimize) {
7608
+ var _config_themes_name, _config_themes_oppositeName, oppositeScheme = scheme === "dark" ? "light" : "dark", oppositeName = name.replace(scheme, oppositeScheme), color = (0, import_createVariable.getVariable)((_config_themes_name = config.themes[name]) === null || _config_themes_name === void 0 ? void 0 : _config_themes_name[key]), oppositeColor = (0, import_createVariable.getVariable)((_config_themes_oppositeName = config.themes[oppositeName]) === null || _config_themes_oppositeName === void 0 ? void 0 : _config_themes_oppositeName[key]), dynamicVal = {
7609
+ dynamic: {
7610
+ [scheme]: color,
7611
+ [oppositeScheme]: oppositeColor
7612
+ }
7613
+ };
7614
+ return dynamicVal;
7615
+ }
7616
+ return process.env.NODE_ENV === "development" && curProps.debug && console.info(` \u{1F3A8} useTheme() tracking new key because of:
7609
7617
  not web: ${platform2 !== "web"}
7610
7618
  isIOS: ${import_constants4.isIos}
7611
7619
  deopt: ${curProps.deopt}
7612
7620
  fastScheme: ${(0, import_config.getSetting)("fastSchemeChange")}
7613
7621
  `), track(key), outVal;
7622
+ }
7614
7623
  }
7615
7624
  };
7616
7625
  return [
@@ -7624,7 +7633,7 @@ var require_getThemeProxied_native = __commonJS({
7624
7633
  ]
7625
7634
  ];
7626
7635
  }));
7627
- return cache.set(theme, proxied1), proxied1;
7636
+ return cache.set(_state.theme, proxied1), proxied1;
7628
7637
  }
7629
7638
  }
7630
7639
  });
@@ -29786,6 +29795,9 @@ var require_Tabs_native = __commonJS({
29786
29795
  ...!props.unstyled && {
29787
29796
  size: context.size
29788
29797
  },
29798
+ ...isSelected && {
29799
+ forceStyle: "focus"
29800
+ },
29789
29801
  ...groupItemProps,
29790
29802
  ...triggerProps,
29791
29803
  ref: (0, import_compose_refs.composeRefs)(forwardedRef, triggerRef),
@@ -30001,8 +30013,9 @@ var require_mutateTheme_native = __commonJS({
30001
30013
  return (0, import_start_transition.startTransition)(function() {
30002
30014
  for (var themeName in allThemesProxied) {
30003
30015
  var theme2 = allThemesProxied[themeName];
30004
- updateThemeConfig(themeName, theme2), updateThemeStates(themeName, theme2);
30016
+ updateThemeConfig(themeName, theme2);
30005
30017
  }
30018
+ updateThemeStates();
30006
30019
  }), {
30007
30020
  themes: allThemesProxied,
30008
30021
  themesRaw: allThemesRaw,
@@ -30032,13 +30045,13 @@ var require_mutateTheme_native = __commonJS({
30032
30045
  };
30033
30046
  return props.avoidUpdate || (insertCSS && (response.cssRules = insertThemeCSS({
30034
30047
  [themeName]: theme1
30035
- })), updateThemeConfig(themeName, themeProxied), updateThemeStates(themeName, themeProxied)), response;
30048
+ })), updateThemeConfig(themeName, themeProxied), updateThemeStates()), response;
30036
30049
  }
30037
30050
  function updateThemeConfig(themeName, theme) {
30038
30051
  var config = (0, import_web.getConfig)();
30039
30052
  config.themes[themeName] = theme, (0, import_web.updateConfig)("themes", config.themes);
30040
30053
  }
30041
- function updateThemeStates(themeName, theme) {
30054
+ function updateThemeStates() {
30042
30055
  (0, import_web.forceUpdateThemes)();
30043
30056
  }
30044
30057
  function insertThemeCSS(themes) {