@tamagui/web 1.74.15 → 1.74.17
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/cjs/createComponent.js.map +1 -1
- package/dist/cjs/createComponent.native.js.map +1 -1
- package/dist/cjs/helpers/ThemeManager.js +43 -61
- package/dist/cjs/helpers/ThemeManager.js.map +2 -2
- package/dist/cjs/helpers/ThemeManager.native.js +43 -61
- package/dist/cjs/helpers/ThemeManager.native.js.map +2 -2
- package/dist/cjs/helpers/createShallowSetState.js +7 -2
- package/dist/cjs/helpers/createShallowSetState.js.map +1 -1
- package/dist/cjs/helpers/createShallowSetState.native.js +7 -2
- package/dist/cjs/helpers/createShallowSetState.native.js.map +1 -1
- package/dist/cjs/helpers/scheme.js +1 -0
- package/dist/cjs/helpers/scheme.js.map +6 -0
- package/dist/cjs/helpers/scheme.native.js +2 -0
- package/dist/cjs/helpers/scheme.native.js.map +6 -0
- package/dist/cjs/helpers/themeable.js +1 -1
- package/dist/cjs/helpers/themeable.js.map +1 -1
- package/dist/cjs/helpers/themeable.native.js +1 -1
- package/dist/cjs/helpers/themeable.native.js.map +1 -1
- package/dist/cjs/hooks/useTheme.js +19 -12
- package/dist/cjs/hooks/useTheme.js.map +2 -2
- package/dist/cjs/hooks/useTheme.native.js +44 -27
- package/dist/cjs/hooks/useTheme.native.js.map +2 -2
- package/dist/cjs/setupReactNative.js.map +1 -1
- package/dist/cjs/setupReactNative.native.js.map +1 -1
- package/dist/cjs/views/Theme.js +17 -29
- package/dist/cjs/views/Theme.js.map +1 -1
- package/dist/cjs/views/Theme.native.js +17 -29
- package/dist/cjs/views/Theme.native.js.map +1 -1
- package/dist/esm/createComponent.js.map +1 -1
- package/dist/esm/createComponent.native.js.map +1 -1
- package/dist/esm/helpers/ThemeManager.js +41 -58
- package/dist/esm/helpers/ThemeManager.js.map +2 -2
- package/dist/esm/helpers/ThemeManager.native.js +41 -58
- package/dist/esm/helpers/ThemeManager.native.js.map +2 -2
- package/dist/esm/helpers/createShallowSetState.js +6 -2
- package/dist/esm/helpers/createShallowSetState.js.map +1 -1
- package/dist/esm/helpers/createShallowSetState.native.js +6 -2
- package/dist/esm/helpers/createShallowSetState.native.js.map +1 -1
- package/dist/esm/helpers/scheme.js +1 -0
- package/dist/esm/helpers/scheme.js.map +6 -0
- package/dist/esm/helpers/scheme.native.js +1 -0
- package/dist/esm/helpers/scheme.native.js.map +6 -0
- package/dist/esm/helpers/themeable.js +1 -1
- package/dist/esm/helpers/themeable.js.map +1 -1
- package/dist/esm/helpers/themeable.native.js +1 -1
- package/dist/esm/helpers/themeable.native.js.map +1 -1
- package/dist/esm/hooks/useTheme.js +27 -11
- package/dist/esm/hooks/useTheme.js.map +2 -2
- package/dist/esm/hooks/useTheme.native.js +52 -26
- package/dist/esm/hooks/useTheme.native.js.map +2 -2
- package/dist/esm/setupReactNative.js.map +1 -1
- package/dist/esm/setupReactNative.native.js.map +1 -1
- package/dist/esm/views/Theme.js +14 -24
- package/dist/esm/views/Theme.js.map +1 -1
- package/dist/esm/views/Theme.native.js +14 -24
- package/dist/esm/views/Theme.native.js.map +1 -1
- package/package.json +9 -9
- package/src/createComponent.tsx +1 -2
- package/src/helpers/ThemeManager.tsx +91 -97
- package/src/helpers/createShallowSetState.tsx +7 -5
- package/src/helpers/themeable.tsx +1 -1
- package/src/hooks/useTheme.tsx +66 -18
- package/src/setupReactNative.ts +3 -0
- package/src/types.tsx +2 -0
- package/src/views/Theme.tsx +33 -29
- package/types/createComponent.d.ts.map +1 -1
- package/types/helpers/ThemeManager.d.ts +7 -8
- package/types/helpers/ThemeManager.d.ts.map +1 -1
- package/types/helpers/createShallowSetState.d.ts +1 -0
- package/types/helpers/createShallowSetState.d.ts.map +1 -1
- package/types/helpers/scheme.d.ts.map +1 -0
- package/types/hooks/useTheme.d.ts +2 -1
- package/types/hooks/useTheme.d.ts.map +1 -1
- package/types/setupReactNative.d.ts.map +1 -1
- package/types/types.d.ts +1 -0
- package/types/types.d.ts.map +1 -1
- package/types/views/Theme.d.ts +0 -12
- package/types/views/Theme.d.ts.map +1 -1
|
@@ -7,25 +7,23 @@ function getHasThemeUpdatingProps(props) {
|
|
|
7
7
|
}
|
|
8
8
|
let uid = 0;
|
|
9
9
|
class ThemeManager {
|
|
10
|
-
constructor(props = {},
|
|
10
|
+
constructor(props = {}, parentManager) {
|
|
11
11
|
this.props = props;
|
|
12
12
|
this.id = uid++;
|
|
13
|
-
this.isComponent = !1;
|
|
14
13
|
this.themeListeners = /* @__PURE__ */ new Set();
|
|
15
14
|
this.parentManager = null;
|
|
16
15
|
this.state = emptyState;
|
|
17
|
-
this.scheme = null;
|
|
18
16
|
this._allKeys = null;
|
|
19
|
-
if (
|
|
17
|
+
if (parentManager === "root") {
|
|
20
18
|
this.updateStateFromProps(props, !1);
|
|
21
19
|
return;
|
|
22
20
|
}
|
|
23
|
-
if (!
|
|
21
|
+
if (!parentManager)
|
|
24
22
|
throw process.env.NODE_ENV !== "production" ? new Error(
|
|
25
23
|
"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."
|
|
26
24
|
) : "\u274C 0";
|
|
27
|
-
if (this.parentManager =
|
|
28
|
-
return
|
|
25
|
+
if (this.parentManager = parentManager, !this.updateStateFromProps(props, !1))
|
|
26
|
+
return parentManager;
|
|
29
27
|
}
|
|
30
28
|
updateStateFromProps(props = this.props || {}, shouldNotify = !0) {
|
|
31
29
|
if (this.props = props, props.forceTheme)
|
|
@@ -35,9 +33,7 @@ class ThemeManager {
|
|
|
35
33
|
return this.updateState(nextState, shouldNotify), nextState;
|
|
36
34
|
}
|
|
37
35
|
updateState(nextState, shouldNotify = !0) {
|
|
38
|
-
this.state = nextState
|
|
39
|
-
const names = this.state.name.split("_"), lastName = names[names.length - 1][0];
|
|
40
|
-
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(() => {
|
|
36
|
+
this.state = nextState, this._allKeys = null, process.env.NODE_ENV !== "production" && (this._numChangeEventsSent ??= 0, this._numChangeEventsSent++), shouldNotify && queueMicrotask(() => {
|
|
41
37
|
this.notify();
|
|
42
38
|
});
|
|
43
39
|
}
|
|
@@ -64,51 +60,38 @@ class ThemeManager {
|
|
|
64
60
|
this.themeListeners.forEach((cb) => cb(this.state.name, this, forced));
|
|
65
61
|
}
|
|
66
62
|
onChangeTheme(cb, debugId) {
|
|
67
|
-
return process.env.NODE_ENV
|
|
63
|
+
return process.env.NODE_ENV !== "production" && debugId && (this._listeningIds ??= /* @__PURE__ */ new Set(), this._listeningIds.add(debugId)), this.themeListeners.add(cb), () => {
|
|
68
64
|
this.themeListeners.delete(cb);
|
|
69
65
|
};
|
|
70
66
|
}
|
|
71
67
|
}
|
|
72
|
-
function
|
|
73
|
-
return `t_sub_theme ${THEME_CLASSNAME_PREFIX}${name}`.replace("light_", "").replace("dark_", "");
|
|
74
|
-
}
|
|
75
|
-
function getState(props, parentManager) {
|
|
76
|
-
const validManagerAndAllComponentThemes = getNonComponentParentManager(parentManager);
|
|
77
|
-
parentManager = validManagerAndAllComponentThemes[0];
|
|
78
|
-
const allComponentThemes = validManagerAndAllComponentThemes[1], themes = getThemes(), isDirectParentAComponentTheme = allComponentThemes.length > 0;
|
|
68
|
+
function getState(props, manager) {
|
|
79
69
|
if (props.name && props.reset)
|
|
80
|
-
throw new Error(
|
|
81
|
-
|
|
70
|
+
throw new Error(
|
|
71
|
+
process.env.NODE_ENV === "production" ? "\u274C004" : "Cannot reset and set a new name at the same time."
|
|
72
|
+
);
|
|
73
|
+
if (!getHasThemeUpdatingProps(props))
|
|
82
74
|
return null;
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
props.reset
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
process.env.NODE_ENV === "development" && typeof props.debug == "string" && (console.groupCollapsed("ThemeManager.getState()"), console.info({
|
|
95
|
-
props,
|
|
96
|
-
parentName,
|
|
97
|
-
parentBaseTheme,
|
|
98
|
-
base,
|
|
99
|
-
min,
|
|
100
|
-
max,
|
|
101
|
-
isParentComponentTheme
|
|
102
|
-
}));
|
|
75
|
+
const themes = getThemes(), [allManagers, componentManagers] = getManagers(manager), isDirectParentAComponentTheme = !!manager?.state.isComponent, startIndex = props.reset && !isDirectParentAComponentTheme ? 1 : 0;
|
|
76
|
+
let baseManager = allManagers[startIndex], parentManager = allManagers[startIndex + 1];
|
|
77
|
+
if (!baseManager && props.reset)
|
|
78
|
+
return process.env.NODE_ENV !== "production" && console.warn("Cannot reset, no parent theme exists"), null;
|
|
79
|
+
const { componentName } = props;
|
|
80
|
+
let result = null, baseName = baseManager?.state.name || "";
|
|
81
|
+
baseManager?.state.isComponent && (baseName = baseName.replace(/_[A-Z][a-z]+/, ""));
|
|
82
|
+
const nextName = props.reset ? baseName : props.name || "", allComponentThemes = componentManagers.map((x) => x?.state.name || "");
|
|
83
|
+
isDirectParentAComponentTheme && allComponentThemes.shift();
|
|
84
|
+
const base = baseName.split(THEME_NAME_SEPARATOR), max = base.length, min = props.componentName && !nextName ? max : 0;
|
|
85
|
+
process.env.NODE_ENV !== "production" && typeof props.debug == "string" && (console.groupCollapsed("ThemeManager.getState()"), console.info({ props, baseName, base, min, max }));
|
|
103
86
|
for (let i = max; i >= min; i--) {
|
|
104
87
|
let prefix = base.slice(0, i).join(THEME_NAME_SEPARATOR);
|
|
105
88
|
props.inverse && (prefix = inverseThemeName(prefix));
|
|
106
89
|
let potentials = [];
|
|
107
|
-
if (prefix && prefix !==
|
|
108
|
-
const
|
|
109
|
-
|
|
90
|
+
if (prefix && prefix !== baseName && potentials.push(prefix), nextName && potentials.unshift(prefix ? `${prefix}_${nextName}` : nextName), i === 1) {
|
|
91
|
+
const lastSegment = potentials.findIndex((x) => !x.includes("_"));
|
|
92
|
+
lastSegment > 0 && potentials.splice(lastSegment, 0, nextName);
|
|
110
93
|
}
|
|
111
|
-
if (componentName) {
|
|
94
|
+
if (componentName && !props.reset) {
|
|
112
95
|
let componentPotentials = [];
|
|
113
96
|
if (nextName) {
|
|
114
97
|
const beforeSeparator = prefix.slice(0, prefix.indexOf(THEME_NAME_SEPARATOR));
|
|
@@ -126,32 +109,32 @@ function getState(props, parentManager) {
|
|
|
126
109
|
potentials = [...componentPotentials, ...potentials, ...allComponentThemes];
|
|
127
110
|
}
|
|
128
111
|
const found = potentials.find((t) => t in themes);
|
|
129
|
-
if (process.env.NODE_ENV
|
|
112
|
+
if (process.env.NODE_ENV !== "production" && typeof props.debug == "string" && console.info(" - ", { found, potentials, baseManager, nextName, baseName, prefix }), found) {
|
|
113
|
+
const 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 = THEME_CLASSNAME_PREFIX, className = isWeb ? `${pre}sub_theme ${pre}${!scheme || !restNames.length ? firstName : restNames.join("_")}` : "", parentName = (baseManager || parentManager)?.state?.name;
|
|
130
114
|
result = {
|
|
131
115
|
name: found,
|
|
132
|
-
theme: themes[found],
|
|
133
|
-
className: isWeb ? getNextThemeClassName(found) : "",
|
|
134
116
|
parentName,
|
|
135
|
-
|
|
136
|
-
|
|
117
|
+
theme: themes[found],
|
|
118
|
+
className,
|
|
119
|
+
isComponent,
|
|
120
|
+
scheme
|
|
137
121
|
};
|
|
138
122
|
break;
|
|
139
123
|
}
|
|
140
124
|
}
|
|
141
|
-
return process.env.NODE_ENV
|
|
142
|
-
result
|
|
143
|
-
}), console.trace(), console.groupEnd()), result;
|
|
125
|
+
return process.env.NODE_ENV !== "production" && typeof props.debug == "string" && typeof window < "u" && (console.warn("ThemeManager.getState():", { result }), console.trace(), console.groupEnd()), result;
|
|
144
126
|
}
|
|
145
127
|
const inverseThemeName = (themeName) => themeName.startsWith("light") ? themeName.replace(/^light/, "dark") : themeName.replace(/^dark/, "light");
|
|
146
|
-
function
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
128
|
+
function getManagers(themeManager) {
|
|
129
|
+
const comp = [], all = [];
|
|
130
|
+
let cur = themeManager;
|
|
131
|
+
for (; cur; )
|
|
132
|
+
all.push(cur), cur.state.isComponent && comp.push(cur), cur = cur.parentManager;
|
|
133
|
+
return [all, comp];
|
|
151
134
|
}
|
|
152
135
|
export {
|
|
153
136
|
ThemeManager,
|
|
154
137
|
getHasThemeUpdatingProps,
|
|
155
|
-
|
|
138
|
+
getManagers
|
|
156
139
|
};
|
|
157
140
|
//# sourceMappingURL=ThemeManager.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/ThemeManager.tsx"],
|
|
4
|
-
"mappings": "AAAA,SAAS,aAAa;AAEtB,SAAS,iBAAiB;AAC1B,SAAS,wBAAwB,4BAA4B;AA0B7D,MAAM,aAAgC,EAAE,MAAM,GAAG;AAE1C,SAAS,yBAAyB,OAAmB;AAC1D,SAAO,MAAM,QAAQ,MAAM,iBAAiB,MAAM,WAAW,MAAM;AACrE;AAEA,IAAI,MAAM;AAEH,MAAM,aAAa;AAAA,
|
|
5
|
-
"names": [
|
|
4
|
+
"mappings": "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",
|
|
5
|
+
"names": []
|
|
6
6
|
}
|
|
@@ -2,13 +2,17 @@ function createShallowSetState(setter) {
|
|
|
2
2
|
return (next) => setter((prev) => mergeIfNotShallowEqual(prev, next));
|
|
3
3
|
}
|
|
4
4
|
function mergeIfNotShallowEqual(prev, next) {
|
|
5
|
+
return isEqualShallow(prev, next) ? prev : { ...prev, ...next };
|
|
6
|
+
}
|
|
7
|
+
function isEqualShallow(prev, next) {
|
|
5
8
|
for (const key in next)
|
|
6
9
|
if (prev[key] !== next[key])
|
|
7
|
-
return
|
|
8
|
-
return
|
|
10
|
+
return !1;
|
|
11
|
+
return !0;
|
|
9
12
|
}
|
|
10
13
|
export {
|
|
11
14
|
createShallowSetState,
|
|
15
|
+
isEqualShallow,
|
|
12
16
|
mergeIfNotShallowEqual
|
|
13
17
|
};
|
|
14
18
|
//# sourceMappingURL=createShallowSetState.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/createShallowSetState.tsx"],
|
|
4
|
-
"mappings": "
|
|
4
|
+
"mappings": "AAEO,SAAS,sBACd,QACA;AACA,SAAO,CAAC,SAAyB,OAAO,CAAC,SAAS,uBAAuB,MAAM,IAAI,CAAC;AACtF;AAEO,SAAS,uBAAuB,MAAW,MAAW;AAC3D,SAAO,eAAe,MAAM,IAAI,IAAI,OAAO,EAAE,GAAG,MAAM,GAAG,KAAK;AAChE;AAEO,SAAS,eAAe,MAAM,MAAM;AACzC,aAAW,OAAO;AAChB,QAAI,KAAK,GAAG,MAAM,KAAK,GAAG;AACxB,aAAO;AAGX,SAAO;AACT;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
|
@@ -2,13 +2,17 @@ function createShallowSetState(setter) {
|
|
|
2
2
|
return (next) => setter((prev) => mergeIfNotShallowEqual(prev, next));
|
|
3
3
|
}
|
|
4
4
|
function mergeIfNotShallowEqual(prev, next) {
|
|
5
|
+
return isEqualShallow(prev, next) ? prev : { ...prev, ...next };
|
|
6
|
+
}
|
|
7
|
+
function isEqualShallow(prev, next) {
|
|
5
8
|
for (const key in next)
|
|
6
9
|
if (prev[key] !== next[key])
|
|
7
|
-
return
|
|
8
|
-
return
|
|
10
|
+
return !1;
|
|
11
|
+
return !0;
|
|
9
12
|
}
|
|
10
13
|
export {
|
|
11
14
|
createShallowSetState,
|
|
15
|
+
isEqualShallow,
|
|
12
16
|
mergeIfNotShallowEqual
|
|
13
17
|
};
|
|
14
18
|
//# sourceMappingURL=createShallowSetState.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/createShallowSetState.tsx"],
|
|
4
|
-
"mappings": "
|
|
4
|
+
"mappings": "AAEO,SAAS,sBACd,QACA;AACA,SAAO,CAAC,SAAyB,OAAO,CAAC,SAAS,uBAAuB,MAAM,IAAI,CAAC;AACtF;AAEO,SAAS,uBAAuB,MAAW,MAAW;AAC3D,SAAO,eAAe,MAAM,IAAI,IAAI,OAAO,EAAE,GAAG,MAAM,GAAG,KAAK;AAChE;AAEO,SAAS,eAAe,MAAM,MAAM;AACzC,aAAW,OAAO;AAChB,QAAI,KAAK,GAAG,MAAM,KAAK,GAAG;AACxB,aAAO;AAGX,SAAO;AACT;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
//# sourceMappingURL=scheme.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
//# sourceMappingURL=scheme.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/themeable.tsx"],
|
|
4
|
-
"mappings": "AAAA,SAAgB,kBAAkB;AAGlC,SAAS,aAAa;AAUF;AARb,SAAS,UACd,WACA,cACA;AAuBA,QAAM,YAtBqB,WAAW,SAAmB,OAAuB,KAAK;AACnF,UAAM,EAAE,cAAc,OAAO,eAAe,YAAY,GAAG,KAAK,IAAI,OAG9D,UAAU,oBAAC,aAAU,KAAW,GAAG,MAAM,sBAAkB,IAAC;AAelE,WAZE;AAAA,MAAC;AAAA;AAAA,QACC,eAAe,iBAAiB,cAAc;AAAA,QAC9C,MAAM
|
|
4
|
+
"mappings": "AAAA,SAAgB,kBAAkB;AAGlC,SAAS,aAAa;AAUF;AARb,SAAS,UACd,WACA,cACA;AAuBA,QAAM,YAtBqB,WAAW,SAAmB,OAAuB,KAAK;AACnF,UAAM,EAAE,cAAc,OAAO,eAAe,YAAY,GAAG,KAAK,IAAI,OAG9D,UAAU,oBAAC,aAAU,KAAW,GAAG,MAAM,sBAAkB,IAAC;AAelE,WAZE;AAAA,MAAC;AAAA;AAAA,QACC,eAAe,iBAAiB,cAAc;AAAA,QAC9C,MAAM;AAAA,QACN,uBAAmB;AAAA,QACnB,OAAO,MAAM;AAAA,QACb,SAAS;AAAA,QACT,OAAO;AAAA,QAEN;AAAA;AAAA,IACH;AAAA,EAIJ,CAAC;AAGD,mBAAU,cAAc,UACrB,WAAmB,eAAgB,WAAmB,QAAQ,WACjE,KAEO;AAGT;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/themeable.tsx"],
|
|
4
|
-
"mappings": "AAAA,SAAgB,kBAAkB;AAGlC,SAAS,aAAa;AAUF;AARb,SAAS,UACd,WACA,cACA;AAuBA,QAAM,YAtBqB,WAAW,SAAmB,OAAuB,KAAK;AACnF,UAAM,EAAE,cAAc,OAAO,eAAe,YAAY,GAAG,KAAK,IAAI,OAG9D,UAAU,oBAAC,aAAU,KAAW,GAAG,MAAM,sBAAkB,IAAC;AAelE,WAZE;AAAA,MAAC;AAAA;AAAA,QACC,eAAe,iBAAiB,cAAc;AAAA,QAC9C,MAAM
|
|
4
|
+
"mappings": "AAAA,SAAgB,kBAAkB;AAGlC,SAAS,aAAa;AAUF;AARb,SAAS,UACd,WACA,cACA;AAuBA,QAAM,YAtBqB,WAAW,SAAmB,OAAuB,KAAK;AACnF,UAAM,EAAE,cAAc,OAAO,eAAe,YAAY,GAAG,KAAK,IAAI,OAG9D,UAAU,oBAAC,aAAU,KAAW,GAAG,MAAM,sBAAkB,IAAC;AAelE,WAZE;AAAA,MAAC;AAAA;AAAA,QACC,eAAe,iBAAiB,cAAc;AAAA,QAC9C,MAAM;AAAA,QACN,uBAAmB;AAAA,QACnB,OAAO,MAAM;AAAA,QACb,SAAS;AAAA,QACT,OAAO;AAAA,QAEN;AAAA;AAAA,IACH;AAAA,EAIJ,CAAC;AAGD,mBAAU,cAAc,UACrB,WAAmB,eAAgB,WAAmB,QAAQ,WACjE,KAEO;AAGT;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
|
@@ -1,8 +1,16 @@
|
|
|
1
1
|
import { isClient, isServer } from "@tamagui/constants";
|
|
2
|
-
import {
|
|
2
|
+
import {
|
|
3
|
+
useContext,
|
|
4
|
+
useEffect,
|
|
5
|
+
useLayoutEffect,
|
|
6
|
+
useMemo,
|
|
7
|
+
useRef,
|
|
8
|
+
useState
|
|
9
|
+
} from "react";
|
|
3
10
|
import { getConfig } from "../config";
|
|
4
11
|
import { getVariable } from "../createVariable";
|
|
5
12
|
import { createProxy } from "../helpers/createProxy";
|
|
13
|
+
import { isEqualShallow } from "../helpers/createShallowSetState";
|
|
6
14
|
import {
|
|
7
15
|
ThemeManager,
|
|
8
16
|
getHasThemeUpdatingProps
|
|
@@ -43,7 +51,7 @@ If this is intended and you are using Tamagui without any themes, you can disabl
|
|
|
43
51
|
const themeProxied = useMemo(() => !themeManager || !state?.theme ? {} : getThemeProxied(state, props.deopt, themeManager, keys.current, props.debug), [state, themeManager, props.deopt, props.debug]);
|
|
44
52
|
return process.env.NODE_ENV === "development" && props.debug === "verbose" && (console.groupCollapsed(" \u{1F539} useTheme =>", state?.name), console.info("returning state", changedThemeState, "from props", props), console.groupEnd()), [changedThemeState, themeProxied];
|
|
45
53
|
};
|
|
46
|
-
function getThemeProxied({ theme, name }, deopt = !1, themeManager, keys, debug) {
|
|
54
|
+
function getThemeProxied({ theme, name, scheme }, deopt = !1, themeManager, keys, debug) {
|
|
47
55
|
if (!theme)
|
|
48
56
|
return {};
|
|
49
57
|
const config = getConfig();
|
|
@@ -91,7 +99,7 @@ const activeThemeManagers = /* @__PURE__ */ new Set(), useChangeThemeEffect = (p
|
|
|
91
99
|
state: parentManager?.state,
|
|
92
100
|
themeManager: parentManager
|
|
93
101
|
};
|
|
94
|
-
const [themeState, setThemeState] = useState(createState), { state, mounted, isNewTheme, themeManager } = themeState, isInversingOnMount = !!(!themeState.mounted && props.inverse);
|
|
102
|
+
const [themeState, setThemeState] = useState(createState), { state, mounted, isNewTheme, themeManager, inversed } = themeState, isInversingOnMount = !!(!themeState.mounted && props.inverse);
|
|
95
103
|
function getShouldUpdateTheme(manager = themeManager, nextState, prevState = state, forceShouldChange = !1) {
|
|
96
104
|
const forceUpdate = shouldUpdate?.();
|
|
97
105
|
if (!manager || !forceShouldChange && forceUpdate === !1)
|
|
@@ -106,7 +114,10 @@ const activeThemeManagers = /* @__PURE__ */ new Set(), useChangeThemeEffect = (p
|
|
|
106
114
|
if (!themeManager)
|
|
107
115
|
return;
|
|
108
116
|
if (props.inverse && !mounted) {
|
|
109
|
-
setThemeState(
|
|
117
|
+
setThemeState((prev) => createState({
|
|
118
|
+
...prev,
|
|
119
|
+
mounted: !0
|
|
120
|
+
}));
|
|
110
121
|
return;
|
|
111
122
|
}
|
|
112
123
|
isNewTheme && themeManager && activeThemeManagers.add(themeManager), (isNewTheme || getShouldUpdateTheme(themeManager)) && setThemeState(createState);
|
|
@@ -140,6 +151,7 @@ const activeThemeManagers = /* @__PURE__ */ new Set(), useChangeThemeEffect = (p
|
|
|
140
151
|
}), [themeManager])), isInversingOnMount)
|
|
141
152
|
return {
|
|
142
153
|
isNewTheme: !1,
|
|
154
|
+
inversed: !1,
|
|
143
155
|
themeManager: parentManager,
|
|
144
156
|
state: {
|
|
145
157
|
name: "",
|
|
@@ -150,6 +162,7 @@ const activeThemeManagers = /* @__PURE__ */ new Set(), useChangeThemeEffect = (p
|
|
|
150
162
|
return {
|
|
151
163
|
state,
|
|
152
164
|
isNewTheme,
|
|
165
|
+
inversed,
|
|
153
166
|
themeManager
|
|
154
167
|
};
|
|
155
168
|
function createState(prev, force = !1) {
|
|
@@ -171,15 +184,18 @@ const activeThemeManagers = /* @__PURE__ */ new Set(), useChangeThemeEffect = (p
|
|
|
171
184
|
themeManager2 = getNewThemeManager(), state2 = { ...themeManager2.state };
|
|
172
185
|
}
|
|
173
186
|
const isNewTheme2 = !!(themeManager2 !== parentManager || props.inverse), mounted2 = props.inverse ? isRoot || prev?.mounted : !0;
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
const response = {
|
|
177
|
-
state: state2,
|
|
187
|
+
state2 || (isNewTheme2 ? state2 = themeManager2.state : (state2 = parentManager.state, themeManager2 = parentManager));
|
|
188
|
+
const wasInversed = prev?.inversed, inversed2 = isNewTheme2 && state2.scheme !== parentManager?.state.scheme ? !0 : wasInversed ? !1 : null, response = {
|
|
178
189
|
themeManager: themeManager2,
|
|
179
190
|
isNewTheme: isNewTheme2,
|
|
180
|
-
mounted: mounted2
|
|
181
|
-
|
|
182
|
-
|
|
191
|
+
mounted: mounted2,
|
|
192
|
+
inversed: inversed2
|
|
193
|
+
}, shouldReturnPrev = !force && prev && // isEqualShallow uses the second arg as the keys so this should compare without state first...
|
|
194
|
+
isEqualShallow(prev, response) && // ... and then compare just the state, because we make a new state obj but is likely the same
|
|
195
|
+
isEqualShallow(prev.state, state2);
|
|
196
|
+
if (prev && shouldReturnPrev)
|
|
197
|
+
return prev;
|
|
198
|
+
if (response.state = state2, process.env.NODE_ENV === "development" && props.debug && isClient) {
|
|
183
199
|
console.groupCollapsed(` \u{1F537} ${themeManager2.id} useChangeThemeEffect createState`);
|
|
184
200
|
const parentState = { ...parentManager?.state }, parentId = parentManager?.id, themeManagerState = { ...themeManager2.state };
|
|
185
201
|
console.info({
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hooks/useTheme.tsx"],
|
|
4
|
-
"mappings": "AAAA,SAAS,UAAiB,gBAAgB;AAC1C,
|
|
5
|
-
"names": ["_", "themeManager", "state", "isNewTheme", "mounted"]
|
|
4
|
+
"mappings": "AAAA,SAAS,UAAiB,gBAAgB;AAC1C;AAAA,EACE;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,iBAAiB;AAC1B,SAAmB,mBAAmB;AACtC,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAC/B;AAAA,EACE;AAAA,EAEA;AAAA,OACK;AACP,SAAS,2BAA2B;AASpC,SAAS,yBAAyB;AAYlC,MAAM,aAAa,EAAE,MAAM,KAAK;AAEhC,IAAI;AACJ,SAAS,yBAAyB;AAChC,MAAI;AAAQ,WAAO;AACnB,QAAM,SAAS,UAAU,GACnB,OAAO,OAAO,OAAO,QAAQ,UAAU,OAAO,KAAK,OAAO,MAAM,EAAE,CAAC,GACnE,eAAe,OAAO,OAAO,IAAI;AACvC,kBAAS,gBAAgB,EAAE,OAAO,cAAc,KAAK,CAAC,GAC/C;AACT;AA8BO,MAAM,WAAW,CAAC,QAAoB,eAAe;AAC1D,QAAM,CAAC,GAAG,KAAK,IAAI,kBAAkB,KAAK;AAE1C,SADY,SAAS,uBAAuB;AAE9C,GAEa,oBAAoB,CAC/B,UACwC;AACxC,QAAM,OAAO,OAAiB,CAAC,CAAC,GAE1B,oBAAoB;AAAA,IACxB;AAAA,IACA;AAAA,IACA,KAAK;AAAA,IACJ,WAiBG,SAhBA,MAAM;AACJ,YAAM,OACJ,MAAM,eAAe,MAAM,KAAK,QAAQ,SAAS,IAAI,KAAO;AAE9D,aACE,QAAQ,IAAI,aAAa,iBACzB,MAAM,SACN,MAAM,UAAU,aAEhB,QAAQ,KAAK,wCAAiC,MAAM;AAAA,QAClD,kBAAkB,MAAM,eAAe;AAAA,QACvC,MAAM,CAAC,GAAG,KAAK,OAAO;AAAA,MACxB,CAAC,GAEI;AAAA,IACT;AAAA,EAEN,GAEM,EAAE,cAAc,MAAM,IAAI;AAEhC,EAAK,OAAO,SACN,QAAQ,IAAI,aAAa,iBACvB,QAAQ,IAAI,qCAAqC,OACnD,QAAQ;AAAA,IACN,2FAA2F,KAAK;AAAA,MAC9F;AAAA,IACF,CAAC;AAAA;AAAA;AAAA,EACH;AAKN,QAAM,eAAe,QAAQ,MACvB,CAAC,gBAAgB,CAAC,OAAO,QACpB,CAAC,IAEH,gBAAgB,OAAO,MAAM,OAAO,cAAc,KAAK,SAAS,MAAM,KAAK,GACjF,CAAC,OAAO,cAAc,MAAM,OAAO,MAAM,KAAK,CAAC;AAElD,SAAI,QAAQ,IAAI,aAAa,iBAAiB,MAAM,UAAU,cAC5D,QAAQ,eAAe,2BAAoB,OAAO,IAAI,GACtD,QAAQ,KAAK,mBAAmB,mBAAmB,cAAc,KAAK,GACtE,QAAQ,SAAS,IAGZ,CAAC,mBAAmB,YAAY;AACzC;AAEO,SAAS,gBACd,EAAE,OAAO,MAAM,OAAO,GACtB,QAAQ,IACR,cACA,MACA,OACgB;AAChB,MAAI,CAAC;AAAO,WAAO,CAAC;AAEpB,QAAM,SAAS,UAAU;AAEzB,WAAS,MAAM,KAAa;AAC1B,IAAI,QAAQ,CAAC,KAAK,SAAS,GAAG,MAC5B,KAAK,KAAK,GAAG,GACT,QAAQ,IAAI,aAAa,iBAAiB,SAC5C,QAAQ,KAAK,2CAAoC,GAAG,EAAE;AAAA,EAG5D;AAEA,SAAO,YAAY,OAAO;AAAA,IACxB,IAAI,GAAG,KAAK;AACV,UAAI,QAAQ,IAAI,OAAO,GAAG;AACxB,eAAO;AAET,UAAI,OAAO,OAAQ;AACjB,eAAI,IAAI,CAAC,MAAM,QAAK,MAAM,IAAI,MAAM,CAAC,IAC9B,cAAc,QAAQ,IAAI,GAAG;AAAA,IAExC;AAAA,IACA,IAAI,GAAG,KAAK;AACV,UAAI,QAAQ;AACV,eAAO;AAGT;AAAA;AAAA;AAAA,QAGE,QAAQ,eACR,OAAO,OAAQ;AAAA,QACf;AAEA,cAAM,YAAY,IAAI,CAAC,MAAM,MAAM,IAAI,MAAM,CAAC,IAAI,KAC5C,MAAM,MAAM,SAAS;AAE3B,YAAI,OAAO,OAAO,OAAQ;AAGxB,iBAAO,IAAI,MAAM,KAAY;AAAA;AAAA;AAAA,YAG3B,IAAIA,IAAG,QAAQ;AACb,kBAAI,WAAW;AAEb,sBAAM,SAAS;AAAA,uBACN,WAAW;AACpB,uBAAO,CAAC,aACS,YAAY,GAAG;AAuClC,qBAAO,QAAQ,IAAI,KAAY,MAAM;AAAA,YACvC;AAAA,UACF,CAAC;AAAA,MAEL;AAEA,aAAO,QAAQ,IAAI,GAAG,GAAG;AAAA,IAC3B;AAAA,EACF,CAAC;AACH;AAeO,MAAM,sBAAsB,oBAAI,IAAkB,GAE5C,uBAAuB,CAClC,OACA,SAAS,IACT,MACA,iBACyB;AACzB,QAAM,EAAE,QAAQ,IAAI,OAEd,gBAAgB,WAAW,mBAAmB;AAEpD,MAAK,CAAC,UAAU,CAAC,iBAAkB;AACjC,WAAO;AAAA,MACL,YAAY;AAAA,MACZ,OAAO,eAAe;AAAA,MACtB,cAAc;AAAA,IAChB;AAgBF,QAAM,CAAC,YAAY,aAAa,IAAI,SAA+B,WAAW,GAExE,EAAE,OAAO,SAAS,YAAY,cAAc,SAAS,IAAI,YACzD,qBAAqB,GAAQ,CAAC,WAAW,WAAW,MAAM;AAEhE,WAAS,qBACP,UAAU,cACV,WACA,YAA2C,OAC3C,oBAAoB,IACpB;AACA,UAAM,cAAc,eAAe;AACnC,QAAI,CAAC,WAAY,CAAC,qBAAqB,gBAAgB;AAAQ;AAC/D,UAAM,OAAO,aAAa,QAAQ,SAAS,OAAO,aAAa;AAC/D,QAAI;AAAmB,aAAO;AAC9B,QAAK,QACD,kBAAgB,MAAQ,CAAC,QAAQ,qBAAqB,MAAM,SAAS;AAIzE,aAAO;AAAA,EACT;AAyFA,MAvFK,aAEH,gBAAgB,MAAM;AACpB,QAAI,CAAC;AAAc;AAKnB,QAAI,MAAM,WAAW,CAAC,SAAS;AAC7B,oBAAc,CAAC,SACN,YAAY;AAAA,QACjB,GAAG;AAAA,QACH,SAAS;AAAA,MACX,CAAC,CACF;AACD;AAAA,IACF;AAEA,IAAI,cAAc,gBAChB,oBAAoB,IAAI,YAAY,IAGlC,cAAc,qBAAqB,YAAY,MACjD,cAAc,WAAW;AAI3B,UAAM,sBAAsB,aAAa,cAAc,CAAC,IAAI,IAAI,WAAW;AACzE,MAAI,UACF,cAAc,CAAC,SAAS,YAAY,MAAM,EAAI,CAAC;AAAA,IAEnD,CAAC,GAEK,wBAAwB,eAAe,cAAc,CAAC,MAAM,YAAY;AAC5E,YAAM,QACJ,eAAe,KACf,MAAM,SAIF,QAEA,kBAAkB,SAAS,GAAQ,MAAM,UAAU;AAEzD,MAAI,QAAQ,IAAI,aAAa,iBAAiB,MAAM,SAClD,QAAQ,KAAK,uBAAgB,aAAa,IAAI;AAAA,QAC5C;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC,GAGC,mBACF,cAAc,WAAW;AAAA,IAE7B,GAAG,aAAa,EAAE;AAElB,WAAO,MAAM;AACX,0BAAoB,GACpB,wBAAwB,GACxB,oBAAoB,OAAO,YAAY;AAAA,IACzC;AAAA,EACF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA,MAAM;AAAA,IACN,MAAM;AAAA,IACN,MAAM;AAAA,IACN,MAAM;AAAA,IACN;AAAA,EACF,CAAC,GAEG,QAAQ,IAAI,aAAa,iBAAiB,MAAM,UAAU,aAC5D,UAAU,OACR,WAAW,yBAA4B,oBAAI,IAAI,GAC/C,WAAW,qBAAwB,IAAI,YAAY,GAC5C,MAAM;AACX,eAAW,qBAAwB,OAAO,YAAY;AAAA,EACxD,IACC,CAAC,YAAY,CAAC,IAIjB;AACF,WAAO;AAAA,MACL,YAAY;AAAA,MACZ,UAAU;AAAA,MACV,cAAc;AAAA,MACd,OAAO;AAAA,QACL,MAAM;AAAA,QACN,GAAG,eAAe;AAAA,QAClB,WAAW;AAAA,MACb;AAAA,IACF;AAGF,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,WAAS,YAAY,MAA6B,QAAQ,IAA6B;AACrF,QAAI,QAAQ,eAAe,MAAM;AAC/B,aAAO;AAIT,QAAIC,gBAA6B,eAC7BC;AAGJ,QAF8B,yBAAyB,KAAK,GAEjC;AACzB,YAAM,qBAAqB,MAClB,IAAI,aAAa,OAAO,SAAS,SAAS,aAAa;AAGhE,UAAI,MAAM,cAAc;AACtB,QAAAD,gBAAe,KAAK;AAQpB,cAAM,cAAc,EAAQ,MAAM,QAC5B,OAAOA,cAAa,SAAS,OAAO,aAAa,GACjD,YAAY;AAAA,UAChBA;AAAA,UACA;AAAA,UACA,KAAK;AAAA,UACL;AAAA,QACF;AAEA,QAAI,aACFC,SAAQ,WAEH,KAAK,aAGRD,cAAa,YAAY,SAAS,IAFlCA,gBAAe,mBAAmB,KAKhC,KAAK,cAEH,iBAAiB,CAAC,SACpBA,gBAAe;AAAA,MAIvB;AACE,QAAAA,gBAAe,mBAAmB,GAClCC,SAAQ,EAAE,GAAGD,cAAa,MAAM;AAAA,IAEpC;AAEA,UAAME,cAAa,GAAQF,kBAAiB,iBAAiB,MAAM,UAG7DG,WAAW,MAAM,UAAiB,UAAU,MAAM,UAAvB;AAEjC,IAAKF,WACCC,cACFD,SAAQD,cAAa,SAErBC,SAAQ,cAAe,OACvBD,gBAAe;AAInB,UAAM,cAAc,MAAM,UAEpBI,YADeF,eAAcD,OAAM,WAAW,eAAe,MAAM,SACzC,KAAO,cAAc,KAAQ,MAEvD,WAAiC;AAAA,MACrC,cAAAD;AAAA,MACA,YAAAE;AAAA,MACA,SAAAC;AAAA,MACA,UAAAC;AAAA,IACF,GAEM,mBACJ,CAAC,SACD;AAAA,IAEA,eAAe,MAAM,QAAQ;AAAA,IAE7B,eAAe,KAAK,OAAOH,MAAK;AAElC,QAAI,QAAQ;AACV,aAAO;AAMT,QAFA,SAAS,QAAQA,QAEb,QAAQ,IAAI,aAAa,iBAAiB,MAAM,SAAY,UAAU;AACxE,cAAQ,eAAe,cAAOD,cAAa,EAAE,mCAAmC;AAChF,YAAM,cAAc,EAAE,GAAG,eAAe,MAAM,GACxC,WAAW,eAAe,IAC1B,oBAAoB,EAAE,GAAGA,cAAa,MAAM;AAClD,cAAQ,KAAK;AAAA,QACX;AAAA,QACA;AAAA,QACA;AAAA,QACA,cAAAA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC,GACD,QAAQ,SAAS;AAAA,IACnB;AAEA,WAAO;AAAA,EACT;AACF;",
|
|
5
|
+
"names": ["_", "themeManager", "state", "isNewTheme", "mounted", "inversed"]
|
|
6
6
|
}
|
|
@@ -1,8 +1,16 @@
|
|
|
1
1
|
import { isClient, isIos, isServer } from "@tamagui/constants";
|
|
2
|
-
import {
|
|
2
|
+
import {
|
|
3
|
+
useContext,
|
|
4
|
+
useEffect,
|
|
5
|
+
useLayoutEffect,
|
|
6
|
+
useMemo,
|
|
7
|
+
useRef,
|
|
8
|
+
useState
|
|
9
|
+
} from "react";
|
|
3
10
|
import { getConfig } from "../config";
|
|
4
11
|
import { getVariable } from "../createVariable";
|
|
5
12
|
import { createProxy } from "../helpers/createProxy";
|
|
13
|
+
import { isEqualShallow } from "../helpers/createShallowSetState";
|
|
6
14
|
import {
|
|
7
15
|
ThemeManager,
|
|
8
16
|
getHasThemeUpdatingProps
|
|
@@ -43,7 +51,7 @@ If this is intended and you are using Tamagui without any themes, you can disabl
|
|
|
43
51
|
const themeProxied = useMemo(() => !themeManager || !state?.theme ? {} : getThemeProxied(state, props.deopt, themeManager, keys.current, props.debug), [state, themeManager, props.deopt, props.debug]);
|
|
44
52
|
return process.env.NODE_ENV === "development" && props.debug === "verbose" && (console.groupCollapsed(" \u{1F539} useTheme =>", state?.name), console.info("returning state", changedThemeState, "from props", props), console.groupEnd()), [changedThemeState, themeProxied];
|
|
45
53
|
};
|
|
46
|
-
function getThemeProxied({ theme, name }, deopt = !1, themeManager, keys, debug) {
|
|
54
|
+
function getThemeProxied({ theme, name, scheme }, deopt = !1, themeManager, keys, debug) {
|
|
47
55
|
if (!theme)
|
|
48
56
|
return {};
|
|
49
57
|
const config = getConfig();
|
|
@@ -76,21 +84,18 @@ function getThemeProxied({ theme, name }, deopt = !1, themeManager, keys, debug)
|
|
|
76
84
|
else if (subkey === "get")
|
|
77
85
|
return (platform) => {
|
|
78
86
|
const outVal = getVariable(val);
|
|
79
|
-
if (platform !== "web" && isIos && !deopt && config.settings.fastSchemeChange) {
|
|
80
|
-
const
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
}
|
|
92
|
-
};
|
|
93
|
-
}
|
|
87
|
+
if (platform !== "web" && isIos && !deopt && config.settings.fastSchemeChange && !someParentIsInversed(themeManager) && scheme) {
|
|
88
|
+
const oppositeThemeName = name.replace(
|
|
89
|
+
scheme === "dark" ? "dark" : "light",
|
|
90
|
+
scheme === "dark" ? "light" : "dark"
|
|
91
|
+
), oppositeTheme = config.themes[oppositeThemeName], oppositeVal = getVariable(oppositeTheme?.[keyString]);
|
|
92
|
+
if (oppositeVal)
|
|
93
|
+
return {
|
|
94
|
+
dynamic: {
|
|
95
|
+
dark: scheme === "dark" ? outVal : oppositeVal,
|
|
96
|
+
light: scheme === "light" ? outVal : oppositeVal
|
|
97
|
+
}
|
|
98
|
+
};
|
|
94
99
|
}
|
|
95
100
|
return track(keyString), outVal;
|
|
96
101
|
};
|
|
@@ -102,6 +107,19 @@ function getThemeProxied({ theme, name }, deopt = !1, themeManager, keys, debug)
|
|
|
102
107
|
}
|
|
103
108
|
});
|
|
104
109
|
}
|
|
110
|
+
function someParentIsInversed(manager) {
|
|
111
|
+
{
|
|
112
|
+
let cur = manager;
|
|
113
|
+
for (; cur; ) {
|
|
114
|
+
if (!cur.parentManager)
|
|
115
|
+
return !0;
|
|
116
|
+
if (cur.parentManager.state.scheme !== cur.state.scheme)
|
|
117
|
+
return !1;
|
|
118
|
+
cur = cur.parentManager;
|
|
119
|
+
}
|
|
120
|
+
}
|
|
121
|
+
return !1;
|
|
122
|
+
}
|
|
105
123
|
const activeThemeManagers = /* @__PURE__ */ new Set(), useChangeThemeEffect = (props, isRoot = !1, keys, shouldUpdate) => {
|
|
106
124
|
const { disable } = props, parentManager = useContext(ThemeManagerContext);
|
|
107
125
|
if (!isRoot && !parentManager || disable)
|
|
@@ -110,7 +128,7 @@ const activeThemeManagers = /* @__PURE__ */ new Set(), useChangeThemeEffect = (p
|
|
|
110
128
|
state: parentManager?.state,
|
|
111
129
|
themeManager: parentManager
|
|
112
130
|
};
|
|
113
|
-
const [themeState, setThemeState] = useState(createState), { state, mounted, isNewTheme, themeManager } = themeState, isInversingOnMount = !!(!themeState.mounted && props.inverse);
|
|
131
|
+
const [themeState, setThemeState] = useState(createState), { state, mounted, isNewTheme, themeManager, inversed } = themeState, isInversingOnMount = !!(!themeState.mounted && props.inverse);
|
|
114
132
|
function getShouldUpdateTheme(manager = themeManager, nextState, prevState = state, forceShouldChange = !1) {
|
|
115
133
|
const forceUpdate = shouldUpdate?.();
|
|
116
134
|
if (!manager || !forceShouldChange && forceUpdate === !1)
|
|
@@ -125,7 +143,10 @@ const activeThemeManagers = /* @__PURE__ */ new Set(), useChangeThemeEffect = (p
|
|
|
125
143
|
if (!themeManager)
|
|
126
144
|
return;
|
|
127
145
|
if (props.inverse && !mounted) {
|
|
128
|
-
setThemeState(
|
|
146
|
+
setThemeState((prev) => createState({
|
|
147
|
+
...prev,
|
|
148
|
+
mounted: !0
|
|
149
|
+
}));
|
|
129
150
|
return;
|
|
130
151
|
}
|
|
131
152
|
isNewTheme && themeManager && activeThemeManagers.add(themeManager), (isNewTheme || getShouldUpdateTheme(themeManager)) && setThemeState(createState);
|
|
@@ -159,6 +180,7 @@ const activeThemeManagers = /* @__PURE__ */ new Set(), useChangeThemeEffect = (p
|
|
|
159
180
|
}), [themeManager])), isInversingOnMount)
|
|
160
181
|
return {
|
|
161
182
|
isNewTheme: !1,
|
|
183
|
+
inversed: !1,
|
|
162
184
|
themeManager: parentManager,
|
|
163
185
|
state: {
|
|
164
186
|
name: "",
|
|
@@ -169,6 +191,7 @@ const activeThemeManagers = /* @__PURE__ */ new Set(), useChangeThemeEffect = (p
|
|
|
169
191
|
return {
|
|
170
192
|
state,
|
|
171
193
|
isNewTheme,
|
|
194
|
+
inversed,
|
|
172
195
|
themeManager
|
|
173
196
|
};
|
|
174
197
|
function createState(prev, force = !1) {
|
|
@@ -190,15 +213,18 @@ const activeThemeManagers = /* @__PURE__ */ new Set(), useChangeThemeEffect = (p
|
|
|
190
213
|
themeManager2 = getNewThemeManager(), state2 = { ...themeManager2.state };
|
|
191
214
|
}
|
|
192
215
|
const isNewTheme2 = !!(themeManager2 !== parentManager || props.inverse), mounted2 = props.inverse ? isRoot || prev?.mounted : !0;
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
const response = {
|
|
196
|
-
state: state2,
|
|
216
|
+
state2 || (isNewTheme2 ? state2 = themeManager2.state : (state2 = parentManager.state, themeManager2 = parentManager));
|
|
217
|
+
const wasInversed = prev?.inversed, inversed2 = isNewTheme2 && state2.scheme !== parentManager?.state.scheme ? !0 : wasInversed ? !1 : null, response = {
|
|
197
218
|
themeManager: themeManager2,
|
|
198
219
|
isNewTheme: isNewTheme2,
|
|
199
|
-
mounted: mounted2
|
|
200
|
-
|
|
201
|
-
|
|
220
|
+
mounted: mounted2,
|
|
221
|
+
inversed: inversed2
|
|
222
|
+
}, shouldReturnPrev = !force && prev && // isEqualShallow uses the second arg as the keys so this should compare without state first...
|
|
223
|
+
isEqualShallow(prev, response) && // ... and then compare just the state, because we make a new state obj but is likely the same
|
|
224
|
+
isEqualShallow(prev.state, state2);
|
|
225
|
+
if (prev && shouldReturnPrev)
|
|
226
|
+
return prev;
|
|
227
|
+
if (response.state = state2, process.env.NODE_ENV === "development" && props.debug && isClient) {
|
|
202
228
|
console.groupCollapsed(` \u{1F537} ${themeManager2.id} useChangeThemeEffect createState`);
|
|
203
229
|
const parentState = { ...parentManager?.state }, parentId = parentManager?.id, themeManagerState = { ...themeManager2.state };
|
|
204
230
|
console.info({
|