@tamagui/core 1.0.0-alpha.8 → 1.0.0-alpha.9
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.
|
@@ -47,7 +47,7 @@ const areEqualSets = /* @__PURE__ */ __name((a, b) => {
|
|
|
47
47
|
const useThemeName = /* @__PURE__ */ __name((opts) => {
|
|
48
48
|
const parent = (0, import_react.useContext)(import_ThemeManagerContext.ThemeManagerContext);
|
|
49
49
|
const [name, setName] = (0, import_react.useState)(parent.name);
|
|
50
|
-
(0,
|
|
50
|
+
(0, import_platform.useIsomorphicLayoutEffect)(() => {
|
|
51
51
|
return parent.onChangeTheme((next, manager) => {
|
|
52
52
|
setName((opts == null ? void 0 : opts.parent) ? manager.parentName : next);
|
|
53
53
|
});
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hooks/useTheme.tsx"],
|
|
4
|
-
"sourcesContent": ["import { useForceUpdate } from '@tamagui/use-force-update'\nimport React, { useContext, useEffect,
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,8BAA+B;AAC/B,
|
|
4
|
+
"sourcesContent": ["import { useForceUpdate } from '@tamagui/use-force-update'\nimport React, { useContext, useEffect, useMemo, useRef, useState } from 'react'\n\nimport { useIsomorphicLayoutEffect } from '../constants/platform'\nimport { Variable } from '../createVariable'\nimport { ThemeName } from '../types'\nimport { ThemeContext } from '../views/ThemeContext'\nimport { ThemeManagerContext } from '../views/ThemeManagerContext'\nimport { GET_DEFAULT_THEME } from '../views/ThemeProvider'\n\ntype UseThemeState = {\n uuid: Object\n keys: Set<string>\n isRendering: boolean\n}\n\nconst areEqualSets = (a: Set<string>, b: Set<string>) => {\n if (a.size !== b.size) return false\n for (const val in a) {\n if (!b.has(val)) {\n return false\n }\n }\n return true\n}\n\nexport const useThemeName = (opts?: { parent?: true }) => {\n const parent = useContext(ThemeManagerContext)\n const [name, setName] = useState(parent.name)\n\n useIsomorphicLayoutEffect(() => {\n return parent.onChangeTheme((next, manager) => {\n setName(opts?.parent ? manager.parentName : next)\n })\n }, [parent])\n\n return name || 'light'\n}\n\nexport const useDefaultThemeName = () => {\n return useContext(ThemeContext)[GET_DEFAULT_THEME] as any as ThemeName\n}\n\nexport const useTheme = () => {\n const forceUpdate = useForceUpdate()\n const manager = useContext(ThemeManagerContext)\n const themes = useContext(ThemeContext)\n const state = useRef() as React.MutableRefObject<UseThemeState>\n if (!state.current) {\n state.current = {\n uuid: {},\n keys: new Set(),\n isRendering: true,\n }\n }\n state.current.isRendering = true\n\n // track usage\n useIsomorphicLayoutEffect(() => {\n const st = state.current\n st.isRendering = false\n const cur = manager.keys.get(st.uuid)\n if (!cur || !areEqualSets(st.keys, cur)) {\n manager.track(st.uuid, st.keys)\n }\n })\n\n useEffect(() => {\n return manager.onUpdate(state.current.uuid, forceUpdate)\n }, [])\n\n const theme = (manager.name ? themes[manager.name] : themes.light) ?? themes.light\n\n return useMemo(\n () => {\n return new Proxy(theme, {\n get(_, key: string) {\n const name = manager.name\n if (!name) {\n return Reflect.get(_, key)\n }\n let activeTheme = themes[name]\n if (!activeTheme) {\n console.error('No theme by name', name, 'only:', themes, 'keeping current theme')\n activeTheme = theme\n }\n const val = activeTheme[key]\n if (process.env.NODE_ENV === 'development') {\n if (typeof val === 'undefined') {\n throw new Error(`No theme value \"${String(key)}\" in: ${Object.keys(activeTheme)}`)\n }\n }\n if (state.current.isRendering) {\n state.current.keys.add(key)\n }\n // TODO costly, can make faster (we need name mapping to og name, but val pointing to new val)\n // console.log('returning new variable', val, key)\n return new Variable({ val: val.val, name: key })\n },\n })\n },\n [\n /* if concurrent mode wanted put manager.name here */\n ]\n )\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,8BAA+B;AAC/B,mBAAwE;AAExE,sBAA0C;AAC1C,4BAAyB;AAEzB,0BAA6B;AAC7B,iCAAoC;AACpC,2BAAkC;AAQlC,MAAM,eAAe,wBAAC,GAAgB,MAAmB;AACvD,MAAI,EAAE,SAAS,EAAE;AAAM,WAAO;AAC9B,aAAW,OAAO,GAAG;AACnB,QAAI,CAAC,EAAE,IAAI,MAAM;AACf,aAAO;AAAA;AAAA;AAGX,SAAO;AAAA,GAPY;AAUd,MAAM,eAAe,wBAAC,SAA6B;AACxD,QAAM,SAAS,6BAAW;AAC1B,QAAM,CAAC,MAAM,WAAW,2BAAS,OAAO;AAExC,iDAA0B,MAAM;AAC9B,WAAO,OAAO,cAAc,CAAC,MAAM,YAAY;AAC7C,cAAQ,8BAAM,UAAS,QAAQ,aAAa;AAAA;AAAA,KAE7C,CAAC;AAEJ,SAAO,QAAQ;AAAA,GAVW;AAarB,MAAM,sBAAsB,6BAAM;AACvC,SAAO,6BAAW,kCAAc;AAAA,GADC;AAI5B,MAAM,WAAW,6BAAM;AAC5B,QAAM,cAAc;AACpB,QAAM,UAAU,6BAAW;AAC3B,QAAM,SAAS,6BAAW;AAC1B,QAAM,QAAQ;AACd,MAAI,CAAC,MAAM,SAAS;AAClB,UAAM,UAAU;AAAA,MACd,MAAM;AAAA,MACN,MAAM,IAAI;AAAA,MACV,aAAa;AAAA;AAAA;AAGjB,QAAM,QAAQ,cAAc;AAG5B,iDAA0B,MAAM;AAC9B,UAAM,KAAK,MAAM;AACjB,OAAG,cAAc;AACjB,UAAM,MAAM,QAAQ,KAAK,IAAI,GAAG;AAChC,QAAI,CAAC,OAAO,CAAC,aAAa,GAAG,MAAM,MAAM;AACvC,cAAQ,MAAM,GAAG,MAAM,GAAG;AAAA;AAAA;AAI9B,8BAAU,MAAM;AACd,WAAO,QAAQ,SAAS,MAAM,QAAQ,MAAM;AAAA,KAC3C;AAEH,QAAM,QAAS,SAAQ,OAAO,OAAO,QAAQ,QAAQ,OAAO,UAAU,OAAO;AAE7E,SAAO,0BACL,MAAM;AACJ,WAAO,IAAI,MAAM,OAAO;AAAA,MACtB,IAAI,GAAG,KAAa;AAClB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,MAAM;AACT,iBAAO,QAAQ,IAAI,GAAG;AAAA;AAExB,YAAI,cAAc,OAAO;AACzB,YAAI,CAAC,aAAa;AAChB,kBAAQ,MAAM,oBAAoB,MAAM,SAAS,QAAQ;AACzD,wBAAc;AAAA;AAEhB,cAAM,MAAM,YAAY;AACxB,YAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,cAAI,OAAO,QAAQ,aAAa;AAC9B,kBAAM,IAAI,MAAM,mBAAmB,OAAO,aAAa,OAAO,KAAK;AAAA;AAAA;AAGvE,YAAI,MAAM,QAAQ,aAAa;AAC7B,gBAAM,QAAQ,KAAK,IAAI;AAAA;AAIzB,eAAO,IAAI,+BAAS,EAAE,KAAK,IAAI,KAAK,MAAM;AAAA;AAAA;AAAA,KAIhD;AAAA,GA1DoB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/hooks/useTheme.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
var __defProp = Object.defineProperty;
|
|
2
2
|
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
3
3
|
import { useForceUpdate } from "@tamagui/use-force-update";
|
|
4
|
-
import { useContext, useEffect,
|
|
4
|
+
import { useContext, useEffect, useMemo, useRef, useState } from "react";
|
|
5
5
|
import { useIsomorphicLayoutEffect } from "../constants/platform";
|
|
6
6
|
import { Variable } from "../createVariable";
|
|
7
7
|
import { ThemeContext } from "../views/ThemeContext";
|
|
@@ -20,7 +20,7 @@ const areEqualSets = /* @__PURE__ */ __name((a, b) => {
|
|
|
20
20
|
const useThemeName = /* @__PURE__ */ __name((opts) => {
|
|
21
21
|
const parent = useContext(ThemeManagerContext);
|
|
22
22
|
const [name, setName] = useState(parent.name);
|
|
23
|
-
|
|
23
|
+
useIsomorphicLayoutEffect(() => {
|
|
24
24
|
return parent.onChangeTheme((next, manager) => {
|
|
25
25
|
setName(opts?.parent ? manager.parentName : next);
|
|
26
26
|
});
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/hooks/useTheme.tsx"],
|
|
4
|
-
"sourcesContent": ["import { useForceUpdate } from '@tamagui/use-force-update'\nimport React, { useContext, useEffect,
|
|
5
|
-
"mappings": ";;AAAA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAQA,MAAM,eAAe,wBAAC,GAAgB,MAAmB;AACvD,MAAI,EAAE,SAAS,EAAE;AAAM,WAAO;AAC9B,aAAW,OAAO,GAAG;AACnB,QAAI,CAAC,EAAE,IAAI,MAAM;AACf,aAAO;AAAA;AAAA;AAGX,SAAO;AAAA,GAPY;AAUd,MAAM,eAAe,wBAAC,SAA6B;AACxD,QAAM,SAAS,WAAW;AAC1B,QAAM,CAAC,MAAM,WAAW,SAAS,OAAO;AAExC,
|
|
4
|
+
"sourcesContent": ["import { useForceUpdate } from '@tamagui/use-force-update'\nimport React, { useContext, useEffect, useMemo, useRef, useState } from 'react'\n\nimport { useIsomorphicLayoutEffect } from '../constants/platform'\nimport { Variable } from '../createVariable'\nimport { ThemeName } from '../types'\nimport { ThemeContext } from '../views/ThemeContext'\nimport { ThemeManagerContext } from '../views/ThemeManagerContext'\nimport { GET_DEFAULT_THEME } from '../views/ThemeProvider'\n\ntype UseThemeState = {\n uuid: Object\n keys: Set<string>\n isRendering: boolean\n}\n\nconst areEqualSets = (a: Set<string>, b: Set<string>) => {\n if (a.size !== b.size) return false\n for (const val in a) {\n if (!b.has(val)) {\n return false\n }\n }\n return true\n}\n\nexport const useThemeName = (opts?: { parent?: true }) => {\n const parent = useContext(ThemeManagerContext)\n const [name, setName] = useState(parent.name)\n\n useIsomorphicLayoutEffect(() => {\n return parent.onChangeTheme((next, manager) => {\n setName(opts?.parent ? manager.parentName : next)\n })\n }, [parent])\n\n return name || 'light'\n}\n\nexport const useDefaultThemeName = () => {\n return useContext(ThemeContext)[GET_DEFAULT_THEME] as any as ThemeName\n}\n\nexport const useTheme = () => {\n const forceUpdate = useForceUpdate()\n const manager = useContext(ThemeManagerContext)\n const themes = useContext(ThemeContext)\n const state = useRef() as React.MutableRefObject<UseThemeState>\n if (!state.current) {\n state.current = {\n uuid: {},\n keys: new Set(),\n isRendering: true,\n }\n }\n state.current.isRendering = true\n\n // track usage\n useIsomorphicLayoutEffect(() => {\n const st = state.current\n st.isRendering = false\n const cur = manager.keys.get(st.uuid)\n if (!cur || !areEqualSets(st.keys, cur)) {\n manager.track(st.uuid, st.keys)\n }\n })\n\n useEffect(() => {\n return manager.onUpdate(state.current.uuid, forceUpdate)\n }, [])\n\n const theme = (manager.name ? themes[manager.name] : themes.light) ?? themes.light\n\n return useMemo(\n () => {\n return new Proxy(theme, {\n get(_, key: string) {\n const name = manager.name\n if (!name) {\n return Reflect.get(_, key)\n }\n let activeTheme = themes[name]\n if (!activeTheme) {\n console.error('No theme by name', name, 'only:', themes, 'keeping current theme')\n activeTheme = theme\n }\n const val = activeTheme[key]\n if (process.env.NODE_ENV === 'development') {\n if (typeof val === 'undefined') {\n throw new Error(`No theme value \"${String(key)}\" in: ${Object.keys(activeTheme)}`)\n }\n }\n if (state.current.isRendering) {\n state.current.keys.add(key)\n }\n // TODO costly, can make faster (we need name mapping to og name, but val pointing to new val)\n // console.log('returning new variable', val, key)\n return new Variable({ val: val.val, name: key })\n },\n })\n },\n [\n /* if concurrent mode wanted put manager.name here */\n ]\n )\n}\n"],
|
|
5
|
+
"mappings": ";;AAAA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAQA,MAAM,eAAe,wBAAC,GAAgB,MAAmB;AACvD,MAAI,EAAE,SAAS,EAAE;AAAM,WAAO;AAC9B,aAAW,OAAO,GAAG;AACnB,QAAI,CAAC,EAAE,IAAI,MAAM;AACf,aAAO;AAAA;AAAA;AAGX,SAAO;AAAA,GAPY;AAUd,MAAM,eAAe,wBAAC,SAA6B;AACxD,QAAM,SAAS,WAAW;AAC1B,QAAM,CAAC,MAAM,WAAW,SAAS,OAAO;AAExC,4BAA0B,MAAM;AAC9B,WAAO,OAAO,cAAc,CAAC,MAAM,YAAY;AAC7C,cAAQ,MAAM,SAAS,QAAQ,aAAa;AAAA;AAAA,KAE7C,CAAC;AAEJ,SAAO,QAAQ;AAAA,GAVW;AAarB,MAAM,sBAAsB,6BAAM;AACvC,SAAO,WAAW,cAAc;AAAA,GADC;AAI5B,MAAM,WAAW,6BAAM;AAC5B,QAAM,cAAc;AACpB,QAAM,UAAU,WAAW;AAC3B,QAAM,SAAS,WAAW;AAC1B,QAAM,QAAQ;AACd,MAAI,CAAC,MAAM,SAAS;AAClB,UAAM,UAAU;AAAA,MACd,MAAM;AAAA,MACN,MAAM,IAAI;AAAA,MACV,aAAa;AAAA;AAAA;AAGjB,QAAM,QAAQ,cAAc;AAG5B,4BAA0B,MAAM;AAC9B,UAAM,KAAK,MAAM;AACjB,OAAG,cAAc;AACjB,UAAM,MAAM,QAAQ,KAAK,IAAI,GAAG;AAChC,QAAI,CAAC,OAAO,CAAC,aAAa,GAAG,MAAM,MAAM;AACvC,cAAQ,MAAM,GAAG,MAAM,GAAG;AAAA;AAAA;AAI9B,YAAU,MAAM;AACd,WAAO,QAAQ,SAAS,MAAM,QAAQ,MAAM;AAAA,KAC3C;AAEH,QAAM,QAAS,SAAQ,OAAO,OAAO,QAAQ,QAAQ,OAAO,UAAU,OAAO;AAE7E,SAAO,QACL,MAAM;AACJ,WAAO,IAAI,MAAM,OAAO;AAAA,MACtB,IAAI,GAAG,KAAa;AAClB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,MAAM;AACT,iBAAO,QAAQ,IAAI,GAAG;AAAA;AAExB,YAAI,cAAc,OAAO;AACzB,YAAI,CAAC,aAAa;AAChB,kBAAQ,MAAM,oBAAoB,MAAM,SAAS,QAAQ;AACzD,wBAAc;AAAA;AAEhB,cAAM,MAAM,YAAY;AACxB,YAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,cAAI,OAAO,QAAQ,aAAa;AAC9B,kBAAM,IAAI,MAAM,mBAAmB,OAAO,aAAa,OAAO,KAAK;AAAA;AAAA;AAGvE,YAAI,MAAM,QAAQ,aAAa;AAC7B,gBAAM,QAAQ,KAAK,IAAI;AAAA;AAIzB,eAAO,IAAI,SAAS,EAAE,KAAK,IAAI,KAAK,MAAM;AAAA;AAAA;AAAA,KAIhD;AAAA,GA1DoB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/core",
|
|
3
|
-
"version": "1.0.0-alpha.
|
|
3
|
+
"version": "1.0.0-alpha.9",
|
|
4
4
|
"source": "src/index.ts",
|
|
5
5
|
"main": "dist/cjs",
|
|
6
6
|
"module": "dist",
|
|
@@ -38,5 +38,5 @@
|
|
|
38
38
|
"engines": {
|
|
39
39
|
"node": ">=16"
|
|
40
40
|
},
|
|
41
|
-
"gitHead": "
|
|
41
|
+
"gitHead": "48ab0be0ca0b8d7e9a1470ee18d46348bc316cdd"
|
|
42
42
|
}
|
package/src/hooks/useTheme.tsx
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { useForceUpdate } from '@tamagui/use-force-update'
|
|
2
|
-
import React, { useContext, useEffect,
|
|
2
|
+
import React, { useContext, useEffect, useMemo, useRef, useState } from 'react'
|
|
3
3
|
|
|
4
4
|
import { useIsomorphicLayoutEffect } from '../constants/platform'
|
|
5
5
|
import { Variable } from '../createVariable'
|
|
@@ -28,7 +28,7 @@ export const useThemeName = (opts?: { parent?: true }) => {
|
|
|
28
28
|
const parent = useContext(ThemeManagerContext)
|
|
29
29
|
const [name, setName] = useState(parent.name)
|
|
30
30
|
|
|
31
|
-
|
|
31
|
+
useIsomorphicLayoutEffect(() => {
|
|
32
32
|
return parent.onChangeTheme((next, manager) => {
|
|
33
33
|
setName(opts?.parent ? manager.parentName : next)
|
|
34
34
|
})
|