@tamagui/core 1.5.13 → 1.5.14
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/config.js +2 -2
- package/dist/cjs/config.js.map +2 -2
- package/dist/cjs/createComponent.js +1 -1
- package/dist/cjs/createComponent.js.map +2 -2
- package/dist/cjs/createFont.web.test.js +125 -0
- package/dist/cjs/createFont.web.test.js.map +7 -0
- package/dist/cjs/createTamagui.js +1 -3
- package/dist/cjs/createTamagui.js.map +2 -2
- package/dist/cjs/createTokens.web.test.js +28 -0
- package/dist/cjs/createTokens.web.test.js.map +7 -0
- package/dist/cjs/createVariable.js.map +1 -1
- package/dist/cjs/createVariable.web.test.js +7 -0
- package/dist/cjs/createVariable.web.test.js.map +7 -0
- package/dist/cjs/helpers/ThemeManager.test.js +465 -0
- package/dist/cjs/helpers/ThemeManager.test.js.map +7 -0
- package/dist/cjs/helpers/expandStyles.js +12 -2
- package/dist/cjs/helpers/expandStyles.js.map +3 -3
- package/dist/cjs/helpers/getSplitStyles.js +15 -20
- package/dist/cjs/helpers/getSplitStyles.js.map +2 -2
- package/dist/cjs/helpers/getStylesAtomic.native.js +5 -8
- package/dist/cjs/helpers/getStylesAtomic.native.js.map +2 -2
- package/dist/cjs/helpers/normalizeColor.js +5 -5
- package/dist/cjs/helpers/normalizeColor.js.map +3 -3
- package/dist/cjs/helpers/useShallowSetState.js +14 -15
- package/dist/cjs/helpers/useShallowSetState.js.map +2 -2
- package/dist/cjs/hooks/useMedia.js +12 -13
- package/dist/cjs/hooks/useMedia.js.map +2 -2
- package/dist/cjs/hooks/useTheme.js +21 -17
- package/dist/cjs/hooks/useTheme.js.map +2 -2
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/setupReactNative.js +8 -9
- package/dist/cjs/setupReactNative.js.map +2 -2
- package/dist/cjs/styled.js.map +2 -2
- package/dist/cjs/types.js.map +1 -1
- package/dist/cjs/views/Stack.web.test.js +22 -0
- package/dist/cjs/views/Stack.web.test.js.map +7 -0
- package/dist/esm/config.js +2 -2
- package/dist/esm/config.js.map +2 -2
- package/dist/esm/config.mjs +2 -2
- package/dist/esm/config.mjs.map +2 -2
- package/dist/esm/createComponent.js +1 -1
- package/dist/esm/createComponent.js.map +2 -2
- package/dist/esm/createComponent.mjs +1 -1
- package/dist/esm/createComponent.mjs.map +2 -2
- package/dist/esm/createFont.web.test.js +124 -0
- package/dist/esm/createFont.web.test.js.map +7 -0
- package/dist/esm/createFont.web.test.mjs +124 -0
- package/dist/esm/createFont.web.test.mjs.map +7 -0
- package/dist/esm/createTamagui.js +1 -3
- package/dist/esm/createTamagui.js.map +2 -2
- package/dist/esm/createTamagui.mjs +1 -3
- package/dist/esm/createTamagui.mjs.map +2 -2
- package/dist/esm/createTokens.web.test.js +27 -0
- package/dist/esm/createTokens.web.test.js.map +7 -0
- package/dist/esm/createTokens.web.test.mjs +27 -0
- package/dist/esm/createTokens.web.test.mjs.map +7 -0
- package/dist/esm/createVariable.js.map +1 -1
- package/dist/esm/createVariable.mjs.map +1 -1
- package/dist/esm/createVariable.web.test.js +6 -0
- package/dist/esm/createVariable.web.test.js.map +7 -0
- package/dist/esm/createVariable.web.test.mjs +6 -0
- package/dist/esm/createVariable.web.test.mjs.map +7 -0
- package/dist/esm/helpers/ThemeManager.test.js +464 -0
- package/dist/esm/helpers/ThemeManager.test.js.map +7 -0
- package/dist/esm/helpers/ThemeManager.test.mjs +464 -0
- package/dist/esm/helpers/ThemeManager.test.mjs.map +7 -0
- package/dist/esm/helpers/expandStyles.js +1 -1
- package/dist/esm/helpers/expandStyles.js.map +2 -2
- package/dist/esm/helpers/expandStyles.mjs +1 -1
- package/dist/esm/helpers/expandStyles.mjs.map +2 -2
- package/dist/esm/helpers/getSplitStyles.js +15 -20
- package/dist/esm/helpers/getSplitStyles.js.map +2 -2
- package/dist/esm/helpers/getSplitStyles.mjs +15 -20
- package/dist/esm/helpers/getSplitStyles.mjs.map +2 -2
- package/dist/esm/helpers/getStylesAtomic.native.js +4 -6
- package/dist/esm/helpers/getStylesAtomic.native.js.map +2 -2
- package/dist/esm/helpers/getStylesAtomic.native.mjs +4 -6
- package/dist/esm/helpers/getStylesAtomic.native.mjs.map +2 -2
- package/dist/esm/helpers/normalizeColor.js +4 -4
- package/dist/esm/helpers/normalizeColor.js.map +3 -3
- package/dist/esm/helpers/normalizeColor.mjs +4 -4
- package/dist/esm/helpers/normalizeColor.mjs.map +3 -3
- package/dist/esm/helpers/useShallowSetState.js +14 -15
- package/dist/esm/helpers/useShallowSetState.js.map +2 -2
- package/dist/esm/helpers/useShallowSetState.mjs +14 -15
- package/dist/esm/helpers/useShallowSetState.mjs.map +2 -2
- package/dist/esm/hooks/useMedia.js +12 -13
- package/dist/esm/hooks/useMedia.js.map +2 -2
- package/dist/esm/hooks/useMedia.mjs +12 -13
- package/dist/esm/hooks/useMedia.mjs.map +2 -2
- package/dist/esm/hooks/useTheme.js +21 -17
- package/dist/esm/hooks/useTheme.js.map +2 -2
- package/dist/esm/hooks/useTheme.mjs +21 -17
- package/dist/esm/hooks/useTheme.mjs.map +2 -2
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/index.mjs.map +2 -2
- package/dist/esm/setupReactNative.js +8 -9
- package/dist/esm/setupReactNative.js.map +2 -2
- package/dist/esm/setupReactNative.mjs +8 -9
- package/dist/esm/setupReactNative.mjs.map +2 -2
- package/dist/esm/styled.js.map +2 -2
- package/dist/esm/styled.mjs.map +2 -2
- package/dist/esm/views/Stack.web.test.js +21 -0
- package/dist/esm/views/Stack.web.test.js.map +7 -0
- package/dist/esm/views/Stack.web.test.mjs +21 -0
- package/dist/esm/views/Stack.web.test.mjs.map +7 -0
- package/package.json +5 -5
- package/src/index.ts +0 -1
- package/types/config.d.ts.map +1 -1
- package/types/createFont.web.test.d.ts.map +1 -0
- package/types/createTamagui.d.ts.map +1 -1
- package/types/createTokens.web.test.d.ts.map +1 -0
- package/types/createVariable.d.ts.map +1 -1
- package/types/createVariable.web.test.d.ts.map +1 -0
- package/types/helpers/ThemeManager.test.d.ts.map +1 -0
- package/types/helpers/getSplitStyles.d.ts.map +1 -1
- package/types/helpers/getStylesAtomic.native.d.ts.map +1 -1
- package/types/helpers/normalizeColor.d.ts.map +1 -1
- package/types/helpers/useShallowSetState.d.ts.map +1 -1
- package/types/hooks/useMedia.d.ts.map +1 -1
- package/types/hooks/useTheme.d.ts.map +1 -1
- package/types/index.d.ts.map +1 -1
- package/types/setupReactNative.d.ts.map +1 -1
- package/types/styled.d.ts.map +1 -1
- package/types/types.d.ts.map +1 -1
- package/types/views/Stack.web.test.d.ts.map +1 -0
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hooks/useTheme.tsx"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable no-console */\nimport { isClient, isRSC, isServer, isWeb } from '@tamagui/constants'\nimport { useContext, useEffect, useMemo, useState } from 'react'\n\nimport { getConfig } from '../config'\nimport { isDevTools } from '../constants/isDevTools'\nimport { createProxy } from '../helpers/createProxy'\nimport {\n ThemeManager,\n ThemeManagerState,\n hasNoThemeUpdatingProps,\n} from '../helpers/ThemeManager'\nimport { ThemeManagerContext } from '../helpers/ThemeManagerContext'\nimport { ThemeParsed, ThemeProps } from '../types'\nimport { GetThemeUnwrapped } from './getThemeUnwrapped'\nimport { useServerRef } from './useServerHooks'\n\nexport type ChangedThemeResponse = {\n themeManager: ThemeManager | null\n name: string\n isNewTheme?: boolean\n theme?: ThemeParsed | null\n className?: string\n}\n\nconst emptyProps = { name: null }\n\nfunction getDefaultThemeProxied() {\n const config = getConfig()\n const name = Object.keys(config.themes)[0]\n return getThemeProxied({\n theme: config.themes[name],\n name,\n })\n}\n\nexport const useTheme = (props: ThemeProps = emptyProps): ThemeParsed => {\n return (isRSC ? null : useThemeWithState(props)?.theme) || getDefaultThemeProxied()\n}\n\nexport const useThemeWithState = (props: ThemeProps) => {\n const
|
|
5
|
-
"mappings": "AACA,SAAS,UAAU,OAAO,UAAU,aAAa;AACjD,SAAS,YAAY,WAAW,SAAS,gBAAgB;AAEzD,SAAS,iBAAiB;AAC1B,SAAS,kBAAkB;AAC3B,SAAS,mBAAmB;AAC5B;AAAA,EACE;AAAA,EAEA;AAAA,OACK;AACP,SAAS,2BAA2B;AAEpC,SAAS,yBAAyB;AAClC,SAAS,oBAAoB;AAU7B,MAAM,aAAa,EAAE,MAAM,KAAK;AAEhC,SAAS,yBAAyB;AAChC,QAAM,SAAS,UAAU;AACzB,QAAM,OAAO,OAAO,KAAK,OAAO,MAAM,EAAE,CAAC;AACzC,SAAO,gBAAgB;AAAA,IACrB,OAAO,OAAO,OAAO,IAAI;AAAA,IACzB;AAAA,EACF,CAAC;AACH;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable no-console */\nimport { isClient, isRSC, isServer, isWeb } from '@tamagui/constants'\nimport { useContext, useEffect, useMemo, useState } from 'react'\n\nimport { getConfig } from '../config'\nimport { isDevTools } from '../constants/isDevTools'\nimport { createProxy } from '../helpers/createProxy'\nimport {\n ThemeManager,\n ThemeManagerState,\n hasNoThemeUpdatingProps,\n} from '../helpers/ThemeManager'\nimport { ThemeManagerContext } from '../helpers/ThemeManagerContext'\nimport { ThemeParsed, ThemeProps } from '../types'\nimport { GetThemeUnwrapped } from './getThemeUnwrapped'\nimport { useServerRef } from './useServerHooks'\n\nexport type ChangedThemeResponse = {\n themeManager: ThemeManager | null\n name: string\n isNewTheme?: boolean\n theme?: ThemeParsed | null\n className?: string\n}\n\nconst emptyProps = { name: null }\n\nfunction getDefaultThemeProxied() {\n const config = getConfig()\n const name = Object.keys(config.themes)[0]\n return getThemeProxied({\n theme: config.themes[name],\n name,\n })\n}\n\ninterface UseThemeState {\n keys: Set<string>\n}\n\nexport const useTheme = (props: ThemeProps = emptyProps): ThemeParsed => {\n return (isRSC ? null : useThemeWithState(props)?.theme) || getDefaultThemeProxied()\n}\n\nexport const useThemeWithState = (props: ThemeProps) => {\n const state = useServerRef() as React.MutableRefObject<UseThemeState>\n if (isClient && !state.current) {\n state.current = {\n keys: new Set(),\n }\n }\n\n // clear at start of every render to track usages\n state.current?.keys.clear()\n\n const changedTheme = useChangeThemeEffect(\n props,\n false,\n isClient\n ? () => {\n return props.shouldUpdate?.() ?? state.current.keys.size === 0\n }\n : undefined\n )\n\n const { themeManager, isNewTheme, theme, name, className } = changedTheme\n\n if (process.env.NODE_ENV === 'development') {\n // ensure we aren't creating too many ThemeManagers\n // prettier-ignore\n if (isWeb && isNewTheme && className === themeManager?.parentManager?.state.className) {\n console.error('Should always change, duplicating ThemeMananger bug', themeManager)\n }\n if (props.debug === 'verbose') {\n console.groupCollapsed(' \uD83D\uDD39 useTheme =>', name)\n const logs = { ...props, name, className, ...(isDevTools && { theme }) }\n for (const key in logs) {\n console.log(' ', key, logs[key])\n }\n console.groupEnd()\n }\n }\n\n if (!changedTheme.theme) {\n if (process.env.NODE_ENV === 'development') {\n console.warn('No theme found', name, props, themeManager)\n }\n return null\n }\n\n const proxiedTheme = useMemo(() => {\n return getThemeProxied(changedTheme as any)\n }, [theme, isNewTheme, name, className, themeManager])\n\n return {\n ...changedTheme,\n theme: proxiedTheme,\n }\n}\n\nexport function getThemeProxied({\n theme,\n themeManager,\n state,\n}: Partial<ChangedThemeResponse> & {\n theme: ThemeParsed\n state?: React.RefObject<UseThemeState>\n}) {\n return createProxy(theme, {\n has(_, key) {\n if (typeof key === 'string') {\n if (key[0] === '$') key = key.slice(1)\n return themeManager?.allKeys.has(key)\n }\n return Reflect.has(theme, key)\n },\n get(_, key) {\n if (key === GetThemeUnwrapped) {\n return theme\n }\n if (\n key === 'undefined' ||\n key === '__proto__' ||\n key === '$typeof' ||\n typeof key !== 'string' ||\n !themeManager\n ) {\n return Reflect.get(_, key)\n }\n // auto convert variables to plain\n if (key[0] === '$') {\n key = key.slice(1)\n }\n const val = themeManager.getValue(key)\n if (val && state) {\n if (isClient) {\n return new Proxy(val as any, {\n get(_, subkey) {\n if (subkey === 'val') {\n state.current!.keys.add(key as any)\n }\n return Reflect.get(val as any, subkey)\n },\n })\n }\n }\n return val\n },\n })\n}\n\nexport const activeThemeManagers = new Set<ThemeManager>()\n\nexport const useChangeThemeEffect = (\n props: ThemeProps,\n root = false,\n disableUpdate?: () => boolean\n): ChangedThemeResponse => {\n if (isRSC) {\n // we need context working for this to work well\n return {\n ...createState().state,\n themeManager: null,\n }\n }\n const parentManager = useContext(ThemeManagerContext)\n\n const {\n debug,\n // @ts-expect-error internal use only\n disable,\n } = props\n\n if (disable) {\n if (!parentManager) throw `\u274C`\n return {\n ...parentManager.state,\n isNewTheme: false,\n themeManager: parentManager,\n }\n }\n\n type State = {\n isNewTheme: boolean\n state: ThemeManagerState\n themeManager: ThemeManager\n mounted?: boolean\n }\n\n const [themeState, setThemeState] = useState<State>(createState)\n const { isNewTheme, state, themeManager, mounted } = themeState\n\n if (!isServer) {\n useEffect(() => {\n if (disable) return\n // SSR safe inverse (because server can't know prefers scheme)\n // could be done through fancy selectors like how we do prefers-media\n // but may be a bit of explosion of selectors\n if (props.inverse && !mounted) {\n setThemeState({ ...themeState, mounted: true })\n return\n }\n activeThemeManagers.add(themeManager)\n // const disposeChangeListener = parentManager?.onChangeTheme((name, manager) => {\n // // console.log('hi', props, state, name, manager)\n // if (state.theme !== manager.state.theme) {\n // console.warn('now update to', manager.state.name)\n // updateState(manager)\n // }\n // })\n return () => {\n activeThemeManagers.delete(themeManager)\n // disposeChangeListener?.()\n }\n }, [disable, state, isNewTheme, debug])\n }\n\n const isInversingOnMount = Boolean(!themeState.mounted && props.inverse)\n const shouldReturnParentState = hasNoThemeUpdatingProps(props) || isInversingOnMount\n\n if (shouldReturnParentState) {\n if (!parentManager) throw 'impossible'\n // prettier-ignore\n if (process.env.NODE_ENV === 'development' && props.debug === 'verbose') console.log('useTheme hasNoThemeUpdatingProps', parentManager.state.name, 'isInversingOnMount', isInversingOnMount)\n return {\n ...parentManager.state,\n className: isInversingOnMount ? '' : parentManager.state.className,\n themeManager: parentManager,\n isNewTheme: false,\n }\n }\n\n // run inline in render\n updateState()\n\n return {\n ...state,\n isNewTheme,\n themeManager,\n }\n\n function createState(prev?: State) {\n if (prev && disableUpdate?.()) {\n return prev\n }\n // returns previous theme manager if no change\n const _ = new ThemeManager(props, root ? 'root' : parentManager)\n const isNewTheme = _ !== parentManager\n // prettier-ignore\n\n // if (prev?.isNewTheme && _.state.theme !== parentManager?.state.theme) {\n // console.warn('notify')\n // _.notify()\n // }\n\n // only inverse relies on this for ssr\n const mounted = !props.inverse ? true : root || prev?.mounted\n return {\n // ThemeManager returns parentManager if no change\n isNewTheme,\n state: { ..._.state },\n themeManager: _,\n mounted,\n }\n }\n\n function updateState(updatingManager?: ThemeManager) {\n if (disableUpdate?.()) {\n return\n }\n const manager = updatingManager ?? themeManager\n const next = manager.getState(props, parentManager)\n const shouldChange = manager.getStateShouldChange(next, isNewTheme ? state : null)\n // console.log(`got it`, next, isNewTheme, shouldChange, { ...updatingManager?.state })\n if (shouldChange) {\n setThemeState(createState)\n } else {\n if (!next && parentManager?.state.name !== state.name) {\n // were changing back to parent state\n setThemeState(createState)\n }\n }\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["_a", "_", "isNewTheme", "mounted"]
|
|
7
7
|
}
|
|
@@ -24,19 +24,25 @@ const useTheme = (props = emptyProps) => {
|
|
|
24
24
|
return (isRSC ? null : (_a = useThemeWithState(props)) == null ? void 0 : _a.theme) || getDefaultThemeProxied();
|
|
25
25
|
};
|
|
26
26
|
const useThemeWithState = (props) => {
|
|
27
|
-
var _a;
|
|
28
|
-
const
|
|
27
|
+
var _a, _b;
|
|
28
|
+
const state = useServerRef();
|
|
29
|
+
if (isClient && !state.current) {
|
|
30
|
+
state.current = {
|
|
31
|
+
keys: /* @__PURE__ */ new Set()
|
|
32
|
+
};
|
|
33
|
+
}
|
|
34
|
+
(_a = state.current) == null ? void 0 : _a.keys.clear();
|
|
29
35
|
const changedTheme = useChangeThemeEffect(
|
|
30
36
|
props,
|
|
31
37
|
false,
|
|
32
38
|
isClient ? () => {
|
|
33
39
|
var _a2;
|
|
34
|
-
return ((_a2 = props.shouldUpdate) == null ? void 0 : _a2.call(props)) ??
|
|
40
|
+
return ((_a2 = props.shouldUpdate) == null ? void 0 : _a2.call(props)) ?? state.current.keys.size === 0;
|
|
35
41
|
} : void 0
|
|
36
42
|
);
|
|
37
43
|
const { themeManager, isNewTheme, theme, name, className } = changedTheme;
|
|
38
44
|
if (process.env.NODE_ENV === "development") {
|
|
39
|
-
if (isWeb && isNewTheme && className === ((
|
|
45
|
+
if (isWeb && isNewTheme && className === ((_b = themeManager == null ? void 0 : themeManager.parentManager) == null ? void 0 : _b.state.className)) {
|
|
40
46
|
console.error("Should always change, duplicating ThemeMananger bug", themeManager);
|
|
41
47
|
}
|
|
42
48
|
if (props.debug === "verbose") {
|
|
@@ -65,7 +71,7 @@ const useThemeWithState = (props) => {
|
|
|
65
71
|
function getThemeProxied({
|
|
66
72
|
theme,
|
|
67
73
|
themeManager,
|
|
68
|
-
|
|
74
|
+
state
|
|
69
75
|
}) {
|
|
70
76
|
return createProxy(theme, {
|
|
71
77
|
has(_, key) {
|
|
@@ -83,23 +89,21 @@ function getThemeProxied({
|
|
|
83
89
|
if (key === "undefined" || key === "__proto__" || key === "$typeof" || typeof key !== "string" || !themeManager) {
|
|
84
90
|
return Reflect.get(_, key);
|
|
85
91
|
}
|
|
86
|
-
const keyString = key;
|
|
87
92
|
if (key[0] === "$") {
|
|
88
93
|
key = key.slice(1);
|
|
89
94
|
}
|
|
90
95
|
const val = themeManager.getValue(key);
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
96
|
+
if (val && state) {
|
|
97
|
+
if (isClient) {
|
|
98
|
+
return new Proxy(val, {
|
|
99
|
+
get(_2, subkey) {
|
|
100
|
+
if (subkey === "val") {
|
|
101
|
+
state.current.keys.add(key);
|
|
102
|
+
}
|
|
103
|
+
return Reflect.get(val, subkey);
|
|
99
104
|
}
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
});
|
|
105
|
+
});
|
|
106
|
+
}
|
|
103
107
|
}
|
|
104
108
|
return val;
|
|
105
109
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hooks/useTheme.tsx"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable no-console */\nimport { isClient, isRSC, isServer, isWeb } from '@tamagui/constants'\nimport { useContext, useEffect, useMemo, useState } from 'react'\n\nimport { getConfig } from '../config'\nimport { isDevTools } from '../constants/isDevTools'\nimport { createProxy } from '../helpers/createProxy'\nimport {\n ThemeManager,\n ThemeManagerState,\n hasNoThemeUpdatingProps,\n} from '../helpers/ThemeManager'\nimport { ThemeManagerContext } from '../helpers/ThemeManagerContext'\nimport { ThemeParsed, ThemeProps } from '../types'\nimport { GetThemeUnwrapped } from './getThemeUnwrapped'\nimport { useServerRef } from './useServerHooks'\n\nexport type ChangedThemeResponse = {\n themeManager: ThemeManager | null\n name: string\n isNewTheme?: boolean\n theme?: ThemeParsed | null\n className?: string\n}\n\nconst emptyProps = { name: null }\n\nfunction getDefaultThemeProxied() {\n const config = getConfig()\n const name = Object.keys(config.themes)[0]\n return getThemeProxied({\n theme: config.themes[name],\n name,\n })\n}\n\nexport const useTheme = (props: ThemeProps = emptyProps): ThemeParsed => {\n return (isRSC ? null : useThemeWithState(props)?.theme) || getDefaultThemeProxied()\n}\n\nexport const useThemeWithState = (props: ThemeProps) => {\n const
|
|
5
|
-
"mappings": "AACA,SAAS,UAAU,OAAO,UAAU,aAAa;AACjD,SAAS,YAAY,WAAW,SAAS,gBAAgB;AAEzD,SAAS,iBAAiB;AAC1B,SAAS,kBAAkB;AAC3B,SAAS,mBAAmB;AAC5B;AAAA,EACE;AAAA,EAEA;AAAA,OACK;AACP,SAAS,2BAA2B;AAEpC,SAAS,yBAAyB;AAClC,SAAS,oBAAoB;AAU7B,MAAM,aAAa,EAAE,MAAM,KAAK;AAEhC,SAAS,yBAAyB;AAChC,QAAM,SAAS,UAAU;AACzB,QAAM,OAAO,OAAO,KAAK,OAAO,MAAM,EAAE,CAAC;AACzC,SAAO,gBAAgB;AAAA,IACrB,OAAO,OAAO,OAAO,IAAI;AAAA,IACzB;AAAA,EACF,CAAC;AACH;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable no-console */\nimport { isClient, isRSC, isServer, isWeb } from '@tamagui/constants'\nimport { useContext, useEffect, useMemo, useState } from 'react'\n\nimport { getConfig } from '../config'\nimport { isDevTools } from '../constants/isDevTools'\nimport { createProxy } from '../helpers/createProxy'\nimport {\n ThemeManager,\n ThemeManagerState,\n hasNoThemeUpdatingProps,\n} from '../helpers/ThemeManager'\nimport { ThemeManagerContext } from '../helpers/ThemeManagerContext'\nimport { ThemeParsed, ThemeProps } from '../types'\nimport { GetThemeUnwrapped } from './getThemeUnwrapped'\nimport { useServerRef } from './useServerHooks'\n\nexport type ChangedThemeResponse = {\n themeManager: ThemeManager | null\n name: string\n isNewTheme?: boolean\n theme?: ThemeParsed | null\n className?: string\n}\n\nconst emptyProps = { name: null }\n\nfunction getDefaultThemeProxied() {\n const config = getConfig()\n const name = Object.keys(config.themes)[0]\n return getThemeProxied({\n theme: config.themes[name],\n name,\n })\n}\n\ninterface UseThemeState {\n keys: Set<string>\n}\n\nexport const useTheme = (props: ThemeProps = emptyProps): ThemeParsed => {\n return (isRSC ? null : useThemeWithState(props)?.theme) || getDefaultThemeProxied()\n}\n\nexport const useThemeWithState = (props: ThemeProps) => {\n const state = useServerRef() as React.MutableRefObject<UseThemeState>\n if (isClient && !state.current) {\n state.current = {\n keys: new Set(),\n }\n }\n\n // clear at start of every render to track usages\n state.current?.keys.clear()\n\n const changedTheme = useChangeThemeEffect(\n props,\n false,\n isClient\n ? () => {\n return props.shouldUpdate?.() ?? state.current.keys.size === 0\n }\n : undefined\n )\n\n const { themeManager, isNewTheme, theme, name, className } = changedTheme\n\n if (process.env.NODE_ENV === 'development') {\n // ensure we aren't creating too many ThemeManagers\n // prettier-ignore\n if (isWeb && isNewTheme && className === themeManager?.parentManager?.state.className) {\n console.error('Should always change, duplicating ThemeMananger bug', themeManager)\n }\n if (props.debug === 'verbose') {\n console.groupCollapsed(' \uD83D\uDD39 useTheme =>', name)\n const logs = { ...props, name, className, ...(isDevTools && { theme }) }\n for (const key in logs) {\n console.log(' ', key, logs[key])\n }\n console.groupEnd()\n }\n }\n\n if (!changedTheme.theme) {\n if (process.env.NODE_ENV === 'development') {\n console.warn('No theme found', name, props, themeManager)\n }\n return null\n }\n\n const proxiedTheme = useMemo(() => {\n return getThemeProxied(changedTheme as any)\n }, [theme, isNewTheme, name, className, themeManager])\n\n return {\n ...changedTheme,\n theme: proxiedTheme,\n }\n}\n\nexport function getThemeProxied({\n theme,\n themeManager,\n state,\n}: Partial<ChangedThemeResponse> & {\n theme: ThemeParsed\n state?: React.RefObject<UseThemeState>\n}) {\n return createProxy(theme, {\n has(_, key) {\n if (typeof key === 'string') {\n if (key[0] === '$') key = key.slice(1)\n return themeManager?.allKeys.has(key)\n }\n return Reflect.has(theme, key)\n },\n get(_, key) {\n if (key === GetThemeUnwrapped) {\n return theme\n }\n if (\n key === 'undefined' ||\n key === '__proto__' ||\n key === '$typeof' ||\n typeof key !== 'string' ||\n !themeManager\n ) {\n return Reflect.get(_, key)\n }\n // auto convert variables to plain\n if (key[0] === '$') {\n key = key.slice(1)\n }\n const val = themeManager.getValue(key)\n if (val && state) {\n if (isClient) {\n return new Proxy(val as any, {\n get(_, subkey) {\n if (subkey === 'val') {\n state.current!.keys.add(key as any)\n }\n return Reflect.get(val as any, subkey)\n },\n })\n }\n }\n return val\n },\n })\n}\n\nexport const activeThemeManagers = new Set<ThemeManager>()\n\nexport const useChangeThemeEffect = (\n props: ThemeProps,\n root = false,\n disableUpdate?: () => boolean\n): ChangedThemeResponse => {\n if (isRSC) {\n // we need context working for this to work well\n return {\n ...createState().state,\n themeManager: null,\n }\n }\n const parentManager = useContext(ThemeManagerContext)\n\n const {\n debug,\n // @ts-expect-error internal use only\n disable,\n } = props\n\n if (disable) {\n if (!parentManager) throw `\u274C`\n return {\n ...parentManager.state,\n isNewTheme: false,\n themeManager: parentManager,\n }\n }\n\n type State = {\n isNewTheme: boolean\n state: ThemeManagerState\n themeManager: ThemeManager\n mounted?: boolean\n }\n\n const [themeState, setThemeState] = useState<State>(createState)\n const { isNewTheme, state, themeManager, mounted } = themeState\n\n if (!isServer) {\n useEffect(() => {\n if (disable) return\n // SSR safe inverse (because server can't know prefers scheme)\n // could be done through fancy selectors like how we do prefers-media\n // but may be a bit of explosion of selectors\n if (props.inverse && !mounted) {\n setThemeState({ ...themeState, mounted: true })\n return\n }\n activeThemeManagers.add(themeManager)\n // const disposeChangeListener = parentManager?.onChangeTheme((name, manager) => {\n // // console.log('hi', props, state, name, manager)\n // if (state.theme !== manager.state.theme) {\n // console.warn('now update to', manager.state.name)\n // updateState(manager)\n // }\n // })\n return () => {\n activeThemeManagers.delete(themeManager)\n // disposeChangeListener?.()\n }\n }, [disable, state, isNewTheme, debug])\n }\n\n const isInversingOnMount = Boolean(!themeState.mounted && props.inverse)\n const shouldReturnParentState = hasNoThemeUpdatingProps(props) || isInversingOnMount\n\n if (shouldReturnParentState) {\n if (!parentManager) throw 'impossible'\n // prettier-ignore\n if (process.env.NODE_ENV === 'development' && props.debug === 'verbose') console.log('useTheme hasNoThemeUpdatingProps', parentManager.state.name, 'isInversingOnMount', isInversingOnMount)\n return {\n ...parentManager.state,\n className: isInversingOnMount ? '' : parentManager.state.className,\n themeManager: parentManager,\n isNewTheme: false,\n }\n }\n\n // run inline in render\n updateState()\n\n return {\n ...state,\n isNewTheme,\n themeManager,\n }\n\n function createState(prev?: State) {\n if (prev && disableUpdate?.()) {\n return prev\n }\n // returns previous theme manager if no change\n const _ = new ThemeManager(props, root ? 'root' : parentManager)\n const isNewTheme = _ !== parentManager\n // prettier-ignore\n\n // if (prev?.isNewTheme && _.state.theme !== parentManager?.state.theme) {\n // console.warn('notify')\n // _.notify()\n // }\n\n // only inverse relies on this for ssr\n const mounted = !props.inverse ? true : root || prev?.mounted\n return {\n // ThemeManager returns parentManager if no change\n isNewTheme,\n state: { ..._.state },\n themeManager: _,\n mounted,\n }\n }\n\n function updateState(updatingManager?: ThemeManager) {\n if (disableUpdate?.()) {\n return\n }\n const manager = updatingManager ?? themeManager\n const next = manager.getState(props, parentManager)\n const shouldChange = manager.getStateShouldChange(next, isNewTheme ? state : null)\n // console.log(`got it`, next, isNewTheme, shouldChange, { ...updatingManager?.state })\n if (shouldChange) {\n setThemeState(createState)\n } else {\n if (!next && parentManager?.state.name !== state.name) {\n // were changing back to parent state\n setThemeState(createState)\n }\n }\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["_a", "_", "isNewTheme", "mounted"]
|
|
7
7
|
}
|
package/dist/esm/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/index.ts"],
|
|
4
|
-
"sourcesContent": ["import { useResponderEvents } from '@tamagui/react-native-use-responder-events'\nimport {\n StackProps,\n StackPropsBase,\n TamaguiComponent,\n TextProps,\n TextPropsBase,\n Stack as WebStack,\n Text as WebText,\n composeEventHandlers,\n isRSC,\n mergeEvent,\n setupHooks,\n
|
|
5
|
-
"mappings": "AAAA,SAAS,0BAA0B;AACnC;AAAA,EAME,SAAS;AAAA,EACT,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,
|
|
4
|
+
"sourcesContent": ["import { useResponderEvents } from '@tamagui/react-native-use-responder-events'\nimport {\n StackProps,\n StackPropsBase,\n TamaguiComponent,\n TextProps,\n TextPropsBase,\n Stack as WebStack,\n Text as WebText,\n composeEventHandlers,\n isRSC,\n mergeEvent,\n setupHooks,\n} from '@tamagui/web'\nimport { RefObject } from 'react'\nimport type { Text as RNText, View as RNView } from 'react-native'\n\nimport { useElementLayout } from './hooks/useElementLayout'\nimport { usePlatformMethods } from './hooks/usePlatformMethods'\nimport type { RNTextProps, RNViewProps } from './reactNativeTypes'\nimport { usePressability } from './vendor/Pressability'\n\n// re-exports all of @tamagui/web just adds hooks\nexport * from '@tamagui/web'\n\n// adds extra types to Stack/Text:\n\nexport const Stack = WebStack as TamaguiComponent<\n StackProps & RNViewProps,\n RNView,\n StackPropsBase & RNViewProps\n>\n\nexport const Text = WebText as TamaguiComponent<\n TextProps & RNTextProps,\n RNText,\n TextPropsBase & RNTextProps\n>\n\n// setup internal hooks:\n\nsetupHooks({\n getBaseViews() {\n const native = require('react-native')\n return {\n View: native.View || native.default.View,\n Text: native.Text || native.default.Text,\n }\n },\n\n usePropsTransform(elementType, propsIn, hostRef) {\n // otherwise replicate react-native-web functionality\n const {\n // event props\n onMoveShouldSetResponder,\n onMoveShouldSetResponderCapture,\n onResponderEnd,\n onResponderGrant,\n onResponderMove,\n onResponderReject,\n onResponderRelease,\n onResponderStart,\n onResponderTerminate,\n onResponderTerminationRequest,\n onScrollShouldSetResponder,\n onScrollShouldSetResponderCapture,\n onSelectionChangeShouldSetResponder,\n onSelectionChangeShouldSetResponderCapture,\n onStartShouldSetResponder,\n onStartShouldSetResponderCapture,\n\n // android\n collapsable,\n focusable,\n\n // deprecated,\n accessible,\n accessibilityDisabled,\n\n onLayout,\n hrefAttrs,\n\n ...viewProps\n } = propsIn\n\n if (!isRSC) {\n usePlatformMethods(hostRef as RefObject<Element>)\n useElementLayout(hostRef as RefObject<Element>, onLayout as any)\n useResponderEvents(hostRef, {\n onMoveShouldSetResponder,\n onMoveShouldSetResponderCapture,\n onResponderEnd,\n onResponderGrant,\n onResponderMove,\n onResponderReject,\n onResponderRelease,\n onResponderStart,\n onResponderTerminate,\n onResponderTerminationRequest,\n onScrollShouldSetResponder,\n onScrollShouldSetResponderCapture,\n onSelectionChangeShouldSetResponder,\n onSelectionChangeShouldSetResponderCapture,\n onStartShouldSetResponder,\n onStartShouldSetResponderCapture,\n } as any)\n }\n\n // TODO move into getSplitStyles inital `if (process.env.TAMAGUI_TARGET === 'web')` block\n\n if (viewProps.href !== undefined && hrefAttrs !== undefined) {\n const { download, rel, target } = hrefAttrs\n if (download != null) {\n viewProps.download = download\n }\n if (rel != null) {\n viewProps.rel = rel\n }\n if (typeof target === 'string') {\n viewProps.target = target.charAt(0) !== '_' ? `_${target}` : target\n }\n }\n\n // FOCUS\n // \"focusable\" indicates that an element may be a keyboard tab-stop.\n // ported from RNW: TODO move into getSplitStyles\n if (!viewProps.tabIndex) {\n const _focusable = focusable !== undefined ? focusable : accessible\n const role = viewProps.role\n if (_focusable === false) {\n viewProps.tabIndex = '-1'\n }\n if (\n // These native elements are focusable by default\n elementType === 'a' ||\n elementType === 'button' ||\n elementType === 'input' ||\n elementType === 'select' ||\n elementType === 'textarea'\n ) {\n if (_focusable === false || accessibilityDisabled === true) {\n viewProps.tabIndex = '-1'\n }\n } else if (\n // These roles are made focusable by default\n role === 'button' ||\n role === 'checkbox' ||\n role === 'link' ||\n role === 'radio' ||\n role === 'textbox' ||\n role === 'switch'\n ) {\n if (_focusable !== false) {\n viewProps.tabIndex = '0'\n }\n }\n // Everything else must explicitly set the prop\n if (_focusable === true) {\n viewProps.tabIndex = '0'\n }\n }\n\n return viewProps\n },\n\n useEvents(viewProps, events, { pseudos }, setStateShallow) {\n if (process.env.TAMAGUI_TARGET === 'native') {\n const attachFocus = !!pseudos?.focusStyle\n if (attachFocus) {\n viewProps.onFocus = mergeEvent(viewProps.onFocus, () => {\n setStateShallow({ focus: true })\n })\n viewProps.onBlur = mergeEvent(viewProps.onBlur, () => {\n setStateShallow({ focus: false })\n })\n }\n\n // use Pressability to get smooth unPress when you press + hold + move out\n // only ever create once, use .configure() to update later\n const pressability = usePressability(\n events ? { ...events, hitSlop: viewProps.hitSlop } : {}\n )\n if (events?.onPress) {\n for (const key in pressability) {\n const og = viewProps[key]\n const val = pressability[key]\n viewProps[key] =\n og && !dontComposePressabilityKeys[key] ? composeEventHandlers(og, val) : val\n }\n }\n }\n },\n})\n\nconst dontComposePressabilityKeys = {\n onClick: true,\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/index.mjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/index.ts"],
|
|
4
|
-
"sourcesContent": ["import { useResponderEvents } from '@tamagui/react-native-use-responder-events'\nimport {\n StackProps,\n StackPropsBase,\n TamaguiComponent,\n TextProps,\n TextPropsBase,\n Stack as WebStack,\n Text as WebText,\n composeEventHandlers,\n isRSC,\n mergeEvent,\n setupHooks,\n
|
|
5
|
-
"mappings": "AAAA,SAAS,0BAA0B;AACnC;AAAA,EAME,SAAS;AAAA,EACT,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,
|
|
4
|
+
"sourcesContent": ["import { useResponderEvents } from '@tamagui/react-native-use-responder-events'\nimport {\n StackProps,\n StackPropsBase,\n TamaguiComponent,\n TextProps,\n TextPropsBase,\n Stack as WebStack,\n Text as WebText,\n composeEventHandlers,\n isRSC,\n mergeEvent,\n setupHooks,\n} from '@tamagui/web'\nimport { RefObject } from 'react'\nimport type { Text as RNText, View as RNView } from 'react-native'\n\nimport { useElementLayout } from './hooks/useElementLayout'\nimport { usePlatformMethods } from './hooks/usePlatformMethods'\nimport type { RNTextProps, RNViewProps } from './reactNativeTypes'\nimport { usePressability } from './vendor/Pressability'\n\n// re-exports all of @tamagui/web just adds hooks\nexport * from '@tamagui/web'\n\n// adds extra types to Stack/Text:\n\nexport const Stack = WebStack as TamaguiComponent<\n StackProps & RNViewProps,\n RNView,\n StackPropsBase & RNViewProps\n>\n\nexport const Text = WebText as TamaguiComponent<\n TextProps & RNTextProps,\n RNText,\n TextPropsBase & RNTextProps\n>\n\n// setup internal hooks:\n\nsetupHooks({\n getBaseViews() {\n const native = require('react-native')\n return {\n View: native.View || native.default.View,\n Text: native.Text || native.default.Text,\n }\n },\n\n usePropsTransform(elementType, propsIn, hostRef) {\n // otherwise replicate react-native-web functionality\n const {\n // event props\n onMoveShouldSetResponder,\n onMoveShouldSetResponderCapture,\n onResponderEnd,\n onResponderGrant,\n onResponderMove,\n onResponderReject,\n onResponderRelease,\n onResponderStart,\n onResponderTerminate,\n onResponderTerminationRequest,\n onScrollShouldSetResponder,\n onScrollShouldSetResponderCapture,\n onSelectionChangeShouldSetResponder,\n onSelectionChangeShouldSetResponderCapture,\n onStartShouldSetResponder,\n onStartShouldSetResponderCapture,\n\n // android\n collapsable,\n focusable,\n\n // deprecated,\n accessible,\n accessibilityDisabled,\n\n onLayout,\n hrefAttrs,\n\n ...viewProps\n } = propsIn\n\n if (!isRSC) {\n usePlatformMethods(hostRef as RefObject<Element>)\n useElementLayout(hostRef as RefObject<Element>, onLayout as any)\n useResponderEvents(hostRef, {\n onMoveShouldSetResponder,\n onMoveShouldSetResponderCapture,\n onResponderEnd,\n onResponderGrant,\n onResponderMove,\n onResponderReject,\n onResponderRelease,\n onResponderStart,\n onResponderTerminate,\n onResponderTerminationRequest,\n onScrollShouldSetResponder,\n onScrollShouldSetResponderCapture,\n onSelectionChangeShouldSetResponder,\n onSelectionChangeShouldSetResponderCapture,\n onStartShouldSetResponder,\n onStartShouldSetResponderCapture,\n } as any)\n }\n\n // TODO move into getSplitStyles inital `if (process.env.TAMAGUI_TARGET === 'web')` block\n\n if (viewProps.href !== undefined && hrefAttrs !== undefined) {\n const { download, rel, target } = hrefAttrs\n if (download != null) {\n viewProps.download = download\n }\n if (rel != null) {\n viewProps.rel = rel\n }\n if (typeof target === 'string') {\n viewProps.target = target.charAt(0) !== '_' ? `_${target}` : target\n }\n }\n\n // FOCUS\n // \"focusable\" indicates that an element may be a keyboard tab-stop.\n // ported from RNW: TODO move into getSplitStyles\n if (!viewProps.tabIndex) {\n const _focusable = focusable !== undefined ? focusable : accessible\n const role = viewProps.role\n if (_focusable === false) {\n viewProps.tabIndex = '-1'\n }\n if (\n // These native elements are focusable by default\n elementType === 'a' ||\n elementType === 'button' ||\n elementType === 'input' ||\n elementType === 'select' ||\n elementType === 'textarea'\n ) {\n if (_focusable === false || accessibilityDisabled === true) {\n viewProps.tabIndex = '-1'\n }\n } else if (\n // These roles are made focusable by default\n role === 'button' ||\n role === 'checkbox' ||\n role === 'link' ||\n role === 'radio' ||\n role === 'textbox' ||\n role === 'switch'\n ) {\n if (_focusable !== false) {\n viewProps.tabIndex = '0'\n }\n }\n // Everything else must explicitly set the prop\n if (_focusable === true) {\n viewProps.tabIndex = '0'\n }\n }\n\n return viewProps\n },\n\n useEvents(viewProps, events, { pseudos }, setStateShallow) {\n if (process.env.TAMAGUI_TARGET === 'native') {\n const attachFocus = !!pseudos?.focusStyle\n if (attachFocus) {\n viewProps.onFocus = mergeEvent(viewProps.onFocus, () => {\n setStateShallow({ focus: true })\n })\n viewProps.onBlur = mergeEvent(viewProps.onBlur, () => {\n setStateShallow({ focus: false })\n })\n }\n\n // use Pressability to get smooth unPress when you press + hold + move out\n // only ever create once, use .configure() to update later\n const pressability = usePressability(\n events ? { ...events, hitSlop: viewProps.hitSlop } : {}\n )\n if (events?.onPress) {\n for (const key in pressability) {\n const og = viewProps[key]\n const val = pressability[key]\n viewProps[key] =\n og && !dontComposePressabilityKeys[key] ? composeEventHandlers(og, val) : val\n }\n }\n }\n },\n})\n\nconst dontComposePressabilityKeys = {\n onClick: true,\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -6,15 +6,14 @@ function setupReactNative(rnExports) {
|
|
|
6
6
|
for (const key in rnExports) {
|
|
7
7
|
if (key[0].toLowerCase() === key[0])
|
|
8
8
|
continue;
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
}
|
|
9
|
+
if (!rnExports[key])
|
|
10
|
+
continue;
|
|
11
|
+
ReactNativeStaticConfigs.set(rnExports[key], {
|
|
12
|
+
isReactNative: true,
|
|
13
|
+
isText: key === "Text" || key === "TextInput",
|
|
14
|
+
isInput: key === "TextInput",
|
|
15
|
+
inlineProps: key === "Image" ? /* @__PURE__ */ new Set(["src", "width", "height"]) : void 0
|
|
16
|
+
});
|
|
18
17
|
}
|
|
19
18
|
}
|
|
20
19
|
export {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/setupReactNative.ts"],
|
|
4
|
-
"sourcesContent": ["import { StaticConfig } from './types'\n\nexport const ReactNativeStaticConfigs = new WeakMap<any, Partial<StaticConfig> | null>()\n\nexport function getReactNativeConfig(Component: any) {\n return ReactNativeStaticConfigs.get(Component)\n}\n\nexport function setupReactNative(rnExports: Record<string, any>) {\n for (const key in rnExports) {\n if (key[0].toLowerCase() === key[0]) continue\n
|
|
5
|
-
"mappings": "AAEO,MAAM,2BAA2B,oBAAI,QAA2C;AAEhF,SAAS,qBAAqB,WAAgB;AACnD,SAAO,yBAAyB,IAAI,SAAS;AAC/C;AAEO,SAAS,iBAAiB,WAAgC;AAC/D,aAAW,OAAO,WAAW;AAC3B,QAAI,IAAI,CAAC,EAAE,YAAY,MAAM,IAAI,CAAC;AAAG;AACrC,
|
|
4
|
+
"sourcesContent": ["import { StaticConfig } from './types'\n\nexport const ReactNativeStaticConfigs = new WeakMap<any, Partial<StaticConfig> | null>()\n\nexport function getReactNativeConfig(Component: any) {\n return ReactNativeStaticConfigs.get(Component)\n}\n\nexport function setupReactNative(rnExports: Record<string, any>) {\n for (const key in rnExports) {\n if (key[0].toLowerCase() === key[0]) continue\n if (!rnExports[key]) continue\n ReactNativeStaticConfigs.set(rnExports[key], {\n isReactNative: true,\n isText: key === 'Text' || key === 'TextInput',\n isInput: key === 'TextInput',\n inlineProps: key === 'Image' ? new Set(['src', 'width', 'height']) : undefined,\n })\n }\n}\n"],
|
|
5
|
+
"mappings": "AAEO,MAAM,2BAA2B,oBAAI,QAA2C;AAEhF,SAAS,qBAAqB,WAAgB;AACnD,SAAO,yBAAyB,IAAI,SAAS;AAC/C;AAEO,SAAS,iBAAiB,WAAgC;AAC/D,aAAW,OAAO,WAAW;AAC3B,QAAI,IAAI,CAAC,EAAE,YAAY,MAAM,IAAI,CAAC;AAAG;AACrC,QAAI,CAAC,UAAU,GAAG;AAAG;AACrB,6BAAyB,IAAI,UAAU,GAAG,GAAG;AAAA,MAC3C,eAAe;AAAA,MACf,QAAQ,QAAQ,UAAU,QAAQ;AAAA,MAClC,SAAS,QAAQ;AAAA,MACjB,aAAa,QAAQ,UAAU,oBAAI,IAAI,CAAC,OAAO,SAAS,QAAQ,CAAC,IAAI;AAAA,IACvE,CAAC;AAAA,EACH;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -6,15 +6,14 @@ function setupReactNative(rnExports) {
|
|
|
6
6
|
for (const key in rnExports) {
|
|
7
7
|
if (key[0].toLowerCase() === key[0])
|
|
8
8
|
continue;
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
}
|
|
9
|
+
if (!rnExports[key])
|
|
10
|
+
continue;
|
|
11
|
+
ReactNativeStaticConfigs.set(rnExports[key], {
|
|
12
|
+
isReactNative: true,
|
|
13
|
+
isText: key === "Text" || key === "TextInput",
|
|
14
|
+
isInput: key === "TextInput",
|
|
15
|
+
inlineProps: key === "Image" ? /* @__PURE__ */ new Set(["src", "width", "height"]) : void 0
|
|
16
|
+
});
|
|
18
17
|
}
|
|
19
18
|
}
|
|
20
19
|
export {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/setupReactNative.ts"],
|
|
4
|
-
"sourcesContent": ["import { StaticConfig } from './types'\n\nexport const ReactNativeStaticConfigs = new WeakMap<any, Partial<StaticConfig> | null>()\n\nexport function getReactNativeConfig(Component: any) {\n return ReactNativeStaticConfigs.get(Component)\n}\n\nexport function setupReactNative(rnExports: Record<string, any>) {\n for (const key in rnExports) {\n if (key[0].toLowerCase() === key[0]) continue\n
|
|
5
|
-
"mappings": "AAEO,MAAM,2BAA2B,oBAAI,QAA2C;AAEhF,SAAS,qBAAqB,WAAgB;AACnD,SAAO,yBAAyB,IAAI,SAAS;AAC/C;AAEO,SAAS,iBAAiB,WAAgC;AAC/D,aAAW,OAAO,WAAW;AAC3B,QAAI,IAAI,CAAC,EAAE,YAAY,MAAM,IAAI,CAAC;AAAG;AACrC,
|
|
4
|
+
"sourcesContent": ["import { StaticConfig } from './types'\n\nexport const ReactNativeStaticConfigs = new WeakMap<any, Partial<StaticConfig> | null>()\n\nexport function getReactNativeConfig(Component: any) {\n return ReactNativeStaticConfigs.get(Component)\n}\n\nexport function setupReactNative(rnExports: Record<string, any>) {\n for (const key in rnExports) {\n if (key[0].toLowerCase() === key[0]) continue\n if (!rnExports[key]) continue\n ReactNativeStaticConfigs.set(rnExports[key], {\n isReactNative: true,\n isText: key === 'Text' || key === 'TextInput',\n isInput: key === 'TextInput',\n inlineProps: key === 'Image' ? new Set(['src', 'width', 'height']) : undefined,\n })\n }\n}\n"],
|
|
5
|
+
"mappings": "AAEO,MAAM,2BAA2B,oBAAI,QAA2C;AAEhF,SAAS,qBAAqB,WAAgB;AACnD,SAAO,yBAAyB,IAAI,SAAS;AAC/C;AAEO,SAAS,iBAAiB,WAAgC;AAC/D,aAAW,OAAO,WAAW;AAC3B,QAAI,IAAI,CAAC,EAAE,YAAY,MAAM,IAAI,CAAC;AAAG;AACrC,QAAI,CAAC,UAAU,GAAG;AAAG;AACrB,6BAAyB,IAAI,UAAU,GAAG,GAAG;AAAA,MAC3C,eAAe;AAAA,MACf,QAAQ,QAAQ,UAAU,QAAQ;AAAA,MAClC,SAAS,QAAQ;AAAA,MACjB,aAAa,QAAQ,UAAU,oBAAI,IAAI,CAAC,OAAO,SAAS,QAAQ,CAAC,IAAI;AAAA,IACvE,CAAC;AAAA,EACH;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/styled.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/styled.tsx"],
|
|
4
|
-
"sourcesContent": ["import { stylePropsAll } from '@tamagui/helpers'\n\nimport { createComponent } from './createComponent'\nimport { ReactNativeStaticConfigs } from './setupReactNative'\nimport {\n GetProps,\n GetVariantValues,\n MediaProps,\n PseudoProps,\n StaticConfig,\n StylableComponent,\n TamaguiComponent,\n TamaguiElement,\n VariantDefinitions,\n VariantSpreadFunction,\n} from './types'\n\n// TODO may be able to use this in the options?: arg below directly\nexport type StyledOptions<ParentComponent extends StylableComponent> =\n GetProps<ParentComponent> & {\n name?: string\n variants?: VariantDefinitions<ParentComponent> | undefined\n defaultVariants?: { [key: string]: any }\n }\n\ntype GetBaseProps<A extends StylableComponent>
|
|
5
|
-
"mappings": "AAAA,SAAS,qBAAqB;AAE9B,SAAS,uBAAuB;AAChC,SAAS,gCAAgC;
|
|
4
|
+
"sourcesContent": ["import { stylePropsAll } from '@tamagui/helpers'\n\nimport { createComponent } from './createComponent'\nimport { ReactNativeStaticConfigs } from './setupReactNative'\nimport {\n GetProps,\n GetVariantValues,\n MediaProps,\n PseudoProps,\n StaticConfig,\n StylableComponent,\n TamaguiComponent,\n TamaguiElement,\n VariantDefinitions,\n VariantSpreadFunction,\n} from './types'\n\n// TODO may be able to use this in the options?: arg below directly\nexport type StyledOptions<ParentComponent extends StylableComponent> =\n GetProps<ParentComponent> & {\n name?: string\n variants?: VariantDefinitions<ParentComponent> | undefined\n defaultVariants?: { [key: string]: any }\n }\n\n// can't infer from styled(<YStack />) which would be nice\n// * excessively deep type instantiation\n\ntype GetBaseProps<A extends StylableComponent> =\n // A extends TamaguiReactElement\n // ? GetBaseProps<A['type']> :\n A extends TamaguiComponent<any, any, infer P> ? P : GetProps<A>\n\ntype GetVariantProps<A extends StylableComponent> =\n // A extends TamaguiReactElement\n // ? GetVariantProps<A['type']>\n // :\n A extends TamaguiComponent<any, any, any, infer V> ? V : {}\n\nexport function styled<\n ParentComponent extends StylableComponent,\n Variants extends VariantDefinitions<ParentComponent> | void = VariantDefinitions<ParentComponent> | void\n>(\n Component: ParentComponent,\n // this should be Partial<GetProps<ParentComponent>> but causes excessively deep type issues\n options?: GetProps<ParentComponent> & {\n name?: string\n variants?: Variants | undefined\n // thought i had this typed, but can't get it linked\n defaultVariants?: { [key: string]: any }\n acceptsClassName?: boolean\n },\n staticExtractionOptions?: Partial<StaticConfig>\n) {\n // allows passing styled(<H1 bc=\"red\" />)\n // but to get types right would be tricky\n // if (isValidElement(Component) && isTamaguiComponent(Component.type)) {\n // const props = Component.props\n // if (props && typeof props === 'object') {\n // Component = Component.type as any\n // options = options ? ({ ...props, ...options } as any) : props\n // }\n // }\n\n // validate not using a variant over an existing valid style\n if (process.env.NODE_ENV !== 'production') {\n if (!Component) {\n throw new Error(`No component given to styled()`)\n }\n if (options?.variants) {\n for (const key in options.variants) {\n if (key in stylePropsAll) {\n console.error(\n `Invalid variant key overlaps with style key: ${key}. Tamagui prevents defining variants that use valid style keys to reduce implementation complexity.`\n )\n }\n }\n }\n }\n\n const staticConfigProps = (() => {\n const parentStaticConfig =\n 'staticConfig' in Component ? (Component.staticConfig as StaticConfig) : null\n\n if (options) {\n const {\n variants,\n name,\n defaultVariants,\n acceptsClassName: acceptsClassNameProp,\n ...defaultProps\n } = options\n if (defaultVariants) {\n Object.assign(defaultProps, defaultVariants)\n }\n const isReactNative = Boolean(\n ReactNativeStaticConfigs.has(Component) ||\n ReactNativeStaticConfigs.has(parentStaticConfig?.Component) ||\n parentStaticConfig?.isReactNative ||\n staticExtractionOptions?.isReactNative\n )\n const isTamagui = !isReactNative && !!parentStaticConfig\n\n const Comp = isReactNative\n ? parentStaticConfig?.Component || Component\n : (Component as any)\n const nativeConf = (isReactNative && ReactNativeStaticConfigs.get(Comp)) || null\n\n const isText = Boolean(\n staticExtractionOptions?.isText || parentStaticConfig?.isText\n )\n const acceptsClassName = acceptsClassNameProp ?? (isTamagui || isReactNative)\n\n const conf: Partial<StaticConfig> = {\n ...staticExtractionOptions,\n ...(!isTamagui && {\n Component: Comp,\n }),\n // this type gets messed up by options?: Partial<GetProps<ParentComponent>> above\n // take away the Partial<> and it's fine\n variants,\n defaultProps,\n defaultVariants,\n componentName: name,\n isReactNative,\n isText,\n acceptsClassName,\n ...nativeConf,\n }\n\n // bail on non className views as well\n if (defaultProps.children || !acceptsClassName) {\n conf.neverFlatten = true\n }\n\n return conf\n }\n return {}\n })()\n\n const component = createComponent(staticConfigProps, Component)\n\n // get parent props without pseudos and medias so we can rebuild both with new variants\n // get parent props without pseudos and medias so we can rebuild both with new variants\n type ParentPropsBase = GetBaseProps<ParentComponent>\n type ParentVariants = GetVariantProps<ParentComponent>\n\n type OurVariants = Variants extends void\n ? {}\n : {\n [Key in keyof Variants]?: Variants[Key] extends VariantSpreadFunction<\n any,\n infer Val\n >\n ? Val\n : GetVariantValues<keyof Variants[Key]>\n }\n\n type VariantProps = Omit<ParentVariants, keyof OurVariants> & OurVariants\n type OurPropsBase = ParentPropsBase & VariantProps\n\n type Props = Variants extends void\n ? GetProps<ParentComponent>\n : // start with base props\n OurPropsBase &\n // add in media (+ pseudos nested)\n MediaProps<Partial<OurPropsBase>> &\n // add in pseudos\n PseudoProps<Partial<OurPropsBase>>\n\n type StyledComponent = TamaguiComponent<\n Props,\n TamaguiElement,\n ParentPropsBase,\n ParentVariants & OurVariants\n >\n\n return component as StyledComponent\n}\n\n// sanity check types\n// import { Stack } from './views/Stack'\n// const X = styled(Stack, {\n// variants: {\n// size: {\n// '...size': (val) => {\n// return {\n// pointerEvents: 'auto'\n// }\n// }\n// },\n// disabled: {\n// true: {\n// alignContent: 'center',\n// opacity: 0.5,\n// pointerEvents: 'none',\n// },\n// },\n// } as const\n// })\n// // type variants = GetStyledVariants<typeof X>\n// const y = <X disabled size=\"$10\" />\n"],
|
|
5
|
+
"mappings": "AAAA,SAAS,qBAAqB;AAE9B,SAAS,uBAAuB;AAChC,SAAS,gCAAgC;AAoClC,SAAS,OAId,WAEA,SAOA,yBACA;AAYA,MAAI,QAAQ,IAAI,aAAa,cAAc;AACzC,QAAI,CAAC,WAAW;AACd,YAAM,IAAI,MAAM,gCAAgC;AAAA,IAClD;AACA,QAAI,mCAAS,UAAU;AACrB,iBAAW,OAAO,QAAQ,UAAU;AAClC,YAAI,OAAO,eAAe;AACxB,kBAAQ;AAAA,YACN,gDAAgD;AAAA,UAClD;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEA,QAAM,qBAAqB,MAAM;AAC/B,UAAM,qBACJ,kBAAkB,YAAa,UAAU,eAAgC;AAE3E,QAAI,SAAS;AACX,YAAM;AAAA,QACJ;AAAA,QACA;AAAA,QACA;AAAA,QACA,kBAAkB;AAAA,QAClB,GAAG;AAAA,MACL,IAAI;AACJ,UAAI,iBAAiB;AACnB,eAAO,OAAO,cAAc,eAAe;AAAA,MAC7C;AACA,YAAM,gBAAgB;AAAA,QACpB,yBAAyB,IAAI,SAAS,KACpC,yBAAyB,IAAI,yDAAoB,SAAS,MAC1D,yDAAoB,mBACpB,mEAAyB;AAAA,MAC7B;AACA,YAAM,YAAY,CAAC,iBAAiB,CAAC,CAAC;AAEtC,YAAM,OAAO,iBACT,yDAAoB,cAAa,YAChC;AACL,YAAM,aAAc,iBAAiB,yBAAyB,IAAI,IAAI,KAAM;AAE5E,YAAM,SAAS;AAAA,SACb,mEAAyB,YAAU,yDAAoB;AAAA,MACzD;AACA,YAAM,mBAAmB,yBAAyB,aAAa;AAE/D,YAAM,OAA8B;AAAA,QAClC,GAAG;AAAA,QACH,GAAI,CAAC,aAAa;AAAA,UAChB,WAAW;AAAA,QACb;AAAA;AAAA;AAAA,QAGA;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAe;AAAA,QACf;AAAA,QACA;AAAA,QACA;AAAA,QACA,GAAG;AAAA,MACL;AAGA,UAAI,aAAa,YAAY,CAAC,kBAAkB;AAC9C,aAAK,eAAe;AAAA,MACtB;AAEA,aAAO;AAAA,IACT;AACA,WAAO,CAAC;AAAA,EACV,GAAG;AAEH,QAAM,YAAY,gBAAgB,mBAAmB,SAAS;AAqC9D,SAAO;AACT;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/styled.mjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/styled.tsx"],
|
|
4
|
-
"sourcesContent": ["import { stylePropsAll } from '@tamagui/helpers'\n\nimport { createComponent } from './createComponent'\nimport { ReactNativeStaticConfigs } from './setupReactNative'\nimport {\n GetProps,\n GetVariantValues,\n MediaProps,\n PseudoProps,\n StaticConfig,\n StylableComponent,\n TamaguiComponent,\n TamaguiElement,\n VariantDefinitions,\n VariantSpreadFunction,\n} from './types'\n\n// TODO may be able to use this in the options?: arg below directly\nexport type StyledOptions<ParentComponent extends StylableComponent> =\n GetProps<ParentComponent> & {\n name?: string\n variants?: VariantDefinitions<ParentComponent> | undefined\n defaultVariants?: { [key: string]: any }\n }\n\ntype GetBaseProps<A extends StylableComponent>
|
|
5
|
-
"mappings": "AAAA,SAAS,qBAAqB;AAE9B,SAAS,uBAAuB;AAChC,SAAS,gCAAgC;
|
|
4
|
+
"sourcesContent": ["import { stylePropsAll } from '@tamagui/helpers'\n\nimport { createComponent } from './createComponent'\nimport { ReactNativeStaticConfigs } from './setupReactNative'\nimport {\n GetProps,\n GetVariantValues,\n MediaProps,\n PseudoProps,\n StaticConfig,\n StylableComponent,\n TamaguiComponent,\n TamaguiElement,\n VariantDefinitions,\n VariantSpreadFunction,\n} from './types'\n\n// TODO may be able to use this in the options?: arg below directly\nexport type StyledOptions<ParentComponent extends StylableComponent> =\n GetProps<ParentComponent> & {\n name?: string\n variants?: VariantDefinitions<ParentComponent> | undefined\n defaultVariants?: { [key: string]: any }\n }\n\n// can't infer from styled(<YStack />) which would be nice\n// * excessively deep type instantiation\n\ntype GetBaseProps<A extends StylableComponent> =\n // A extends TamaguiReactElement\n // ? GetBaseProps<A['type']> :\n A extends TamaguiComponent<any, any, infer P> ? P : GetProps<A>\n\ntype GetVariantProps<A extends StylableComponent> =\n // A extends TamaguiReactElement\n // ? GetVariantProps<A['type']>\n // :\n A extends TamaguiComponent<any, any, any, infer V> ? V : {}\n\nexport function styled<\n ParentComponent extends StylableComponent,\n Variants extends VariantDefinitions<ParentComponent> | void = VariantDefinitions<ParentComponent> | void\n>(\n Component: ParentComponent,\n // this should be Partial<GetProps<ParentComponent>> but causes excessively deep type issues\n options?: GetProps<ParentComponent> & {\n name?: string\n variants?: Variants | undefined\n // thought i had this typed, but can't get it linked\n defaultVariants?: { [key: string]: any }\n acceptsClassName?: boolean\n },\n staticExtractionOptions?: Partial<StaticConfig>\n) {\n // allows passing styled(<H1 bc=\"red\" />)\n // but to get types right would be tricky\n // if (isValidElement(Component) && isTamaguiComponent(Component.type)) {\n // const props = Component.props\n // if (props && typeof props === 'object') {\n // Component = Component.type as any\n // options = options ? ({ ...props, ...options } as any) : props\n // }\n // }\n\n // validate not using a variant over an existing valid style\n if (process.env.NODE_ENV !== 'production') {\n if (!Component) {\n throw new Error(`No component given to styled()`)\n }\n if (options?.variants) {\n for (const key in options.variants) {\n if (key in stylePropsAll) {\n console.error(\n `Invalid variant key overlaps with style key: ${key}. Tamagui prevents defining variants that use valid style keys to reduce implementation complexity.`\n )\n }\n }\n }\n }\n\n const staticConfigProps = (() => {\n const parentStaticConfig =\n 'staticConfig' in Component ? (Component.staticConfig as StaticConfig) : null\n\n if (options) {\n const {\n variants,\n name,\n defaultVariants,\n acceptsClassName: acceptsClassNameProp,\n ...defaultProps\n } = options\n if (defaultVariants) {\n Object.assign(defaultProps, defaultVariants)\n }\n const isReactNative = Boolean(\n ReactNativeStaticConfigs.has(Component) ||\n ReactNativeStaticConfigs.has(parentStaticConfig?.Component) ||\n parentStaticConfig?.isReactNative ||\n staticExtractionOptions?.isReactNative\n )\n const isTamagui = !isReactNative && !!parentStaticConfig\n\n const Comp = isReactNative\n ? parentStaticConfig?.Component || Component\n : (Component as any)\n const nativeConf = (isReactNative && ReactNativeStaticConfigs.get(Comp)) || null\n\n const isText = Boolean(\n staticExtractionOptions?.isText || parentStaticConfig?.isText\n )\n const acceptsClassName = acceptsClassNameProp ?? (isTamagui || isReactNative)\n\n const conf: Partial<StaticConfig> = {\n ...staticExtractionOptions,\n ...(!isTamagui && {\n Component: Comp,\n }),\n // this type gets messed up by options?: Partial<GetProps<ParentComponent>> above\n // take away the Partial<> and it's fine\n variants,\n defaultProps,\n defaultVariants,\n componentName: name,\n isReactNative,\n isText,\n acceptsClassName,\n ...nativeConf,\n }\n\n // bail on non className views as well\n if (defaultProps.children || !acceptsClassName) {\n conf.neverFlatten = true\n }\n\n return conf\n }\n return {}\n })()\n\n const component = createComponent(staticConfigProps, Component)\n\n // get parent props without pseudos and medias so we can rebuild both with new variants\n // get parent props without pseudos and medias so we can rebuild both with new variants\n type ParentPropsBase = GetBaseProps<ParentComponent>\n type ParentVariants = GetVariantProps<ParentComponent>\n\n type OurVariants = Variants extends void\n ? {}\n : {\n [Key in keyof Variants]?: Variants[Key] extends VariantSpreadFunction<\n any,\n infer Val\n >\n ? Val\n : GetVariantValues<keyof Variants[Key]>\n }\n\n type VariantProps = Omit<ParentVariants, keyof OurVariants> & OurVariants\n type OurPropsBase = ParentPropsBase & VariantProps\n\n type Props = Variants extends void\n ? GetProps<ParentComponent>\n : // start with base props\n OurPropsBase &\n // add in media (+ pseudos nested)\n MediaProps<Partial<OurPropsBase>> &\n // add in pseudos\n PseudoProps<Partial<OurPropsBase>>\n\n type StyledComponent = TamaguiComponent<\n Props,\n TamaguiElement,\n ParentPropsBase,\n ParentVariants & OurVariants\n >\n\n return component as StyledComponent\n}\n\n// sanity check types\n// import { Stack } from './views/Stack'\n// const X = styled(Stack, {\n// variants: {\n// size: {\n// '...size': (val) => {\n// return {\n// pointerEvents: 'auto'\n// }\n// }\n// },\n// disabled: {\n// true: {\n// alignContent: 'center',\n// opacity: 0.5,\n// pointerEvents: 'none',\n// },\n// },\n// } as const\n// })\n// // type variants = GetStyledVariants<typeof X>\n// const y = <X disabled size=\"$10\" />\n"],
|
|
5
|
+
"mappings": "AAAA,SAAS,qBAAqB;AAE9B,SAAS,uBAAuB;AAChC,SAAS,gCAAgC;AAoClC,SAAS,OAId,WAEA,SAOA,yBACA;AAYA,MAAI,QAAQ,IAAI,aAAa,cAAc;AACzC,QAAI,CAAC,WAAW;AACd,YAAM,IAAI,MAAM,gCAAgC;AAAA,IAClD;AACA,QAAI,mCAAS,UAAU;AACrB,iBAAW,OAAO,QAAQ,UAAU;AAClC,YAAI,OAAO,eAAe;AACxB,kBAAQ;AAAA,YACN,gDAAgD;AAAA,UAClD;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEA,QAAM,qBAAqB,MAAM;AAC/B,UAAM,qBACJ,kBAAkB,YAAa,UAAU,eAAgC;AAE3E,QAAI,SAAS;AACX,YAAM;AAAA,QACJ;AAAA,QACA;AAAA,QACA;AAAA,QACA,kBAAkB;AAAA,QAClB,GAAG;AAAA,MACL,IAAI;AACJ,UAAI,iBAAiB;AACnB,eAAO,OAAO,cAAc,eAAe;AAAA,MAC7C;AACA,YAAM,gBAAgB;AAAA,QACpB,yBAAyB,IAAI,SAAS,KACpC,yBAAyB,IAAI,yDAAoB,SAAS,MAC1D,yDAAoB,mBACpB,mEAAyB;AAAA,MAC7B;AACA,YAAM,YAAY,CAAC,iBAAiB,CAAC,CAAC;AAEtC,YAAM,OAAO,iBACT,yDAAoB,cAAa,YAChC;AACL,YAAM,aAAc,iBAAiB,yBAAyB,IAAI,IAAI,KAAM;AAE5E,YAAM,SAAS;AAAA,SACb,mEAAyB,YAAU,yDAAoB;AAAA,MACzD;AACA,YAAM,mBAAmB,yBAAyB,aAAa;AAE/D,YAAM,OAA8B;AAAA,QAClC,GAAG;AAAA,QACH,GAAI,CAAC,aAAa;AAAA,UAChB,WAAW;AAAA,QACb;AAAA;AAAA;AAAA,QAGA;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAe;AAAA,QACf;AAAA,QACA;AAAA,QACA;AAAA,QACA,GAAG;AAAA,MACL;AAGA,UAAI,aAAa,YAAY,CAAC,kBAAkB;AAC9C,aAAK,eAAe;AAAA,MACtB;AAEA,aAAO;AAAA,IACT;AACA,WAAO,CAAC;AAAA,EACV,GAAG;AAEH,QAAM,YAAY,gBAAgB,mBAAmB,SAAS;AAqC9D,SAAO;AACT;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
process.env.TAMAGUI_TARGET = "web";
|
|
3
|
+
import { getDefaultTamaguiConfig } from "@tamagui/config-default-node";
|
|
4
|
+
import { render } from "@testing-library/react";
|
|
5
|
+
import { describe, expect, test } from "vitest";
|
|
6
|
+
import { Stack, TamaguiProvider, createTamagui } from "..";
|
|
7
|
+
const conf = createTamagui(getDefaultTamaguiConfig());
|
|
8
|
+
const TestStackRenders = ({
|
|
9
|
+
renderCount,
|
|
10
|
+
...props
|
|
11
|
+
}) => {
|
|
12
|
+
return /* @__PURE__ */ jsx(TamaguiProvider, { config: conf, defaultTheme: "light", children: /* @__PURE__ */ jsx(Stack, { "data-test-renders": renderCount, ...props }) });
|
|
13
|
+
};
|
|
14
|
+
describe("Stack", () => {
|
|
15
|
+
test("renders once", async () => {
|
|
16
|
+
const renderCount = { current: 0 };
|
|
17
|
+
render(/* @__PURE__ */ jsx(TestStackRenders, { renderCount }));
|
|
18
|
+
expect(renderCount.current).toBe(1);
|
|
19
|
+
});
|
|
20
|
+
});
|
|
21
|
+
//# sourceMappingURL=Stack.web.test.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/views/Stack.web.test.tsx"],
|
|
4
|
+
"sourcesContent": ["process.env.TAMAGUI_TARGET = 'web'\n\nimport { getDefaultTamaguiConfig } from '@tamagui/config-default-node'\nimport { render } from '@testing-library/react'\nimport { describe, expect, test } from 'vitest'\n\nimport { Stack, StackProps, TamaguiProvider, createTamagui } from '..'\n\nconst conf = createTamagui(getDefaultTamaguiConfig())\n\nconst TestStackRenders = ({\n renderCount,\n ...props\n}: StackProps & { renderCount: { current: number } }) => {\n return (\n <TamaguiProvider config={conf} defaultTheme=\"light\">\n <Stack data-test-renders={renderCount} {...props} />\n </TamaguiProvider>\n )\n}\n\ndescribe('Stack', () => {\n test('renders once', async () => {\n const renderCount = { current: 0 }\n render(<TestStackRenders renderCount={renderCount} />)\n expect(renderCount.current).toBe(1)\n })\n\n // test(`doesn't re-render on media query change if CSS`, async () => {\n // const renderCount = { current: 0 }\n\n // render(\n // <TestStackRenders\n // renderCount={renderCount}\n // backgroundColor=\"blue\"\n // $sm={{ backgroundColor: 'red' }}\n // />\n // )\n\n // expect(renderCount.current).toBe(1)\n\n // // re-configuring re-runs the media queries...\n // configureMedia(conf)\n\n // expect(renderCount.current).toBe(1)\n // })\n\n // test(`does re-render on media query change if not CSS`, async () => {\n // const renderCount = { current: 0 }\n\n // render(\n // <TestStackRenders\n // renderCount={renderCount}\n // backgroundColor=\"blue\"\n // // @ts-ignore\n // $sm={{ space: '$2' }}\n // />\n // )\n\n // expect(renderCount.current).toBe(1)\n\n // // re-configuring re-runs the media queries...\n // // configureMedia({\n // // ...conf,\n // // media: {\n // // def\n // // },\n // // })\n // // expect(renderCount.current).toBe(2)\n // })\n})\n"],
|
|
5
|
+
"mappings": "AAgBM;AAhBN,QAAQ,IAAI,iBAAiB;AAE7B,SAAS,+BAA+B;AACxC,SAAS,cAAc;AACvB,SAAS,UAAU,QAAQ,YAAY;AAEvC,SAAS,OAAmB,iBAAiB,qBAAqB;AAElE,MAAM,OAAO,cAAc,wBAAwB,CAAC;AAEpD,MAAM,mBAAmB,CAAC;AAAA,EACxB;AAAA,EACA,GAAG;AACL,MAAyD;AACvD,SACE,oBAAC,mBAAgB,QAAQ,MAAM,cAAa,SAC1C,8BAAC,SAAM,qBAAmB,aAAc,GAAG,OAAO,GACpD;AAEJ;AAEA,SAAS,SAAS,MAAM;AACtB,OAAK,gBAAgB,YAAY;AAC/B,UAAM,cAAc,EAAE,SAAS,EAAE;AACjC,WAAO,oBAAC,oBAAiB,aAA0B,CAAE;AACrD,WAAO,YAAY,OAAO,EAAE,KAAK,CAAC;AAAA,EACpC,CAAC;AA4CH,CAAC;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
process.env.TAMAGUI_TARGET = "web";
|
|
3
|
+
import { getDefaultTamaguiConfig } from "@tamagui/config-default-node";
|
|
4
|
+
import { render } from "@testing-library/react";
|
|
5
|
+
import { describe, expect, test } from "vitest";
|
|
6
|
+
import { Stack, TamaguiProvider, createTamagui } from "..";
|
|
7
|
+
const conf = createTamagui(getDefaultTamaguiConfig());
|
|
8
|
+
const TestStackRenders = ({
|
|
9
|
+
renderCount,
|
|
10
|
+
...props
|
|
11
|
+
}) => {
|
|
12
|
+
return /* @__PURE__ */ jsx(TamaguiProvider, { config: conf, defaultTheme: "light", children: /* @__PURE__ */ jsx(Stack, { "data-test-renders": renderCount, ...props }) });
|
|
13
|
+
};
|
|
14
|
+
describe("Stack", () => {
|
|
15
|
+
test("renders once", async () => {
|
|
16
|
+
const renderCount = { current: 0 };
|
|
17
|
+
render(/* @__PURE__ */ jsx(TestStackRenders, { renderCount }));
|
|
18
|
+
expect(renderCount.current).toBe(1);
|
|
19
|
+
});
|
|
20
|
+
});
|
|
21
|
+
//# sourceMappingURL=Stack.web.test.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/views/Stack.web.test.tsx"],
|
|
4
|
+
"sourcesContent": ["process.env.TAMAGUI_TARGET = 'web'\n\nimport { getDefaultTamaguiConfig } from '@tamagui/config-default-node'\nimport { render } from '@testing-library/react'\nimport { describe, expect, test } from 'vitest'\n\nimport { Stack, StackProps, TamaguiProvider, createTamagui } from '..'\n\nconst conf = createTamagui(getDefaultTamaguiConfig())\n\nconst TestStackRenders = ({\n renderCount,\n ...props\n}: StackProps & { renderCount: { current: number } }) => {\n return (\n <TamaguiProvider config={conf} defaultTheme=\"light\">\n <Stack data-test-renders={renderCount} {...props} />\n </TamaguiProvider>\n )\n}\n\ndescribe('Stack', () => {\n test('renders once', async () => {\n const renderCount = { current: 0 }\n render(<TestStackRenders renderCount={renderCount} />)\n expect(renderCount.current).toBe(1)\n })\n\n // test(`doesn't re-render on media query change if CSS`, async () => {\n // const renderCount = { current: 0 }\n\n // render(\n // <TestStackRenders\n // renderCount={renderCount}\n // backgroundColor=\"blue\"\n // $sm={{ backgroundColor: 'red' }}\n // />\n // )\n\n // expect(renderCount.current).toBe(1)\n\n // // re-configuring re-runs the media queries...\n // configureMedia(conf)\n\n // expect(renderCount.current).toBe(1)\n // })\n\n // test(`does re-render on media query change if not CSS`, async () => {\n // const renderCount = { current: 0 }\n\n // render(\n // <TestStackRenders\n // renderCount={renderCount}\n // backgroundColor=\"blue\"\n // // @ts-ignore\n // $sm={{ space: '$2' }}\n // />\n // )\n\n // expect(renderCount.current).toBe(1)\n\n // // re-configuring re-runs the media queries...\n // // configureMedia({\n // // ...conf,\n // // media: {\n // // def\n // // },\n // // })\n // // expect(renderCount.current).toBe(2)\n // })\n})\n"],
|
|
5
|
+
"mappings": "AAgBM;AAhBN,QAAQ,IAAI,iBAAiB;AAE7B,SAAS,+BAA+B;AACxC,SAAS,cAAc;AACvB,SAAS,UAAU,QAAQ,YAAY;AAEvC,SAAS,OAAmB,iBAAiB,qBAAqB;AAElE,MAAM,OAAO,cAAc,wBAAwB,CAAC;AAEpD,MAAM,mBAAmB,CAAC;AAAA,EACxB;AAAA,EACA,GAAG;AACL,MAAyD;AACvD,SACE,oBAAC,mBAAgB,QAAQ,MAAM,cAAa,SAC1C,8BAAC,SAAM,qBAAmB,aAAc,GAAG,OAAO,GACpD;AAEJ;AAEA,SAAS,SAAS,MAAM;AACtB,OAAK,gBAAgB,YAAY;AAC/B,UAAM,cAAc,EAAE,SAAS,EAAE;AACjC,WAAO,oBAAC,oBAAiB,aAA0B,CAAE;AACrD,WAAO,YAAY,OAAO,EAAE,KAAK,CAAC;AAAA,EACpC,CAAC;AA4CH,CAAC;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/core",
|
|
3
|
-
"version": "1.5.
|
|
3
|
+
"version": "1.5.14",
|
|
4
4
|
"source": "src/index.ts",
|
|
5
5
|
"main": "dist/cjs",
|
|
6
6
|
"module": "dist/esm",
|
|
@@ -28,16 +28,16 @@
|
|
|
28
28
|
"reset.css"
|
|
29
29
|
],
|
|
30
30
|
"dependencies": {
|
|
31
|
-
"@tamagui/react-native-use-pressable": "^1.5.
|
|
32
|
-
"@tamagui/react-native-use-responder-events": "^1.5.
|
|
33
|
-
"@tamagui/web": "^1.5.
|
|
31
|
+
"@tamagui/react-native-use-pressable": "^1.5.14",
|
|
32
|
+
"@tamagui/react-native-use-responder-events": "^1.5.14",
|
|
33
|
+
"@tamagui/web": "^1.5.14"
|
|
34
34
|
},
|
|
35
35
|
"peerDependencies": {
|
|
36
36
|
"react": "*",
|
|
37
37
|
"react-dom": "*"
|
|
38
38
|
},
|
|
39
39
|
"devDependencies": {
|
|
40
|
-
"@tamagui/build": "^1.5.
|
|
40
|
+
"@tamagui/build": "^1.5.14",
|
|
41
41
|
"@testing-library/react": "^13.4.0",
|
|
42
42
|
"csstype": "^3.0.10",
|
|
43
43
|
"react": "^18.2.0",
|