@tamagui/core 1.0.0-beta.189 → 1.0.0-beta.207
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/constants/pseudos.js +37 -0
- package/dist/cjs/constants/pseudos.js.map +7 -0
- package/dist/cjs/createComponent.js +45 -45
- package/dist/cjs/createComponent.js.map +2 -2
- package/dist/cjs/createShallowUpdate.js +1 -0
- package/dist/cjs/createShallowUpdate.js.map +7 -0
- package/dist/cjs/defaultComponentState.js +0 -30
- package/dist/cjs/defaultComponentState.js.map +3 -3
- package/dist/cjs/devtools.js +32 -0
- package/dist/cjs/devtools.js.map +7 -0
- package/dist/cjs/helpers/RNComponents.js +34 -0
- package/dist/cjs/helpers/RNComponents.js.map +7 -0
- package/dist/cjs/helpers/createMediaStyle.js +2 -0
- package/dist/cjs/helpers/createMediaStyle.js.map +2 -2
- package/dist/cjs/helpers/createPropMapper.js.map +1 -1
- package/dist/cjs/helpers/createShallowUpdate.js +51 -0
- package/dist/cjs/helpers/createShallowUpdate.js.map +7 -0
- package/dist/cjs/helpers/createTamaguiProvider.js +1 -5
- package/dist/cjs/helpers/createTamaguiProvider.js.map +2 -2
- package/dist/cjs/helpers/getSplitStyles.js +7 -7
- package/dist/cjs/helpers/getSplitStyles.js.map +2 -2
- package/dist/cjs/helpers/insertStyleRule.js +6 -5
- package/dist/cjs/helpers/insertStyleRule.js.map +2 -2
- package/dist/cjs/hooks/useFeatures.js +11 -6
- package/dist/cjs/hooks/useFeatures.js.map +2 -2
- package/dist/cjs/styled.js +2 -12
- package/dist/cjs/styled.js.map +2 -2
- package/dist/cjs/tamagui-base.css +8 -0
- package/dist/cjs/tamagui-base.css.map +7 -0
- package/dist/cjs/types-rnw.js.map +1 -1
- package/dist/cjs/types.js.map +1 -1
- package/dist/cjs/views/Stack.js.map +2 -2
- package/dist/cjs/views/Text.js.map +2 -2
- package/dist/cjs/views/Theme.js +4 -1
- package/dist/cjs/views/Theme.js.map +2 -2
- package/dist/esm/constants/pseudos.js +18 -0
- package/dist/esm/constants/pseudos.js.map +7 -0
- package/dist/esm/createComponent.js +43 -43
- package/dist/esm/createComponent.js.map +2 -2
- package/dist/esm/createShallowUpdate.js +1 -0
- package/dist/esm/createShallowUpdate.js.map +7 -0
- package/dist/esm/defaultComponentState.js +0 -11
- package/dist/esm/defaultComponentState.js.map +3 -3
- package/dist/esm/devtools.js +14 -0
- package/dist/esm/devtools.js.map +7 -0
- package/dist/esm/helpers/RNComponents.js +12 -0
- package/dist/esm/helpers/RNComponents.js.map +7 -0
- package/dist/esm/helpers/createMediaStyle.js +2 -0
- package/dist/esm/helpers/createMediaStyle.js.map +2 -2
- package/dist/esm/helpers/createPropMapper.js.map +1 -1
- package/dist/esm/helpers/createShallowUpdate.js +19 -0
- package/dist/esm/helpers/createShallowUpdate.js.map +7 -0
- package/dist/esm/helpers/createTamaguiProvider.js +1 -4
- package/dist/esm/helpers/createTamaguiProvider.js.map +2 -2
- package/dist/esm/helpers/getSplitStyles.js +7 -7
- package/dist/esm/helpers/getSplitStyles.js.map +2 -2
- package/dist/esm/helpers/insertStyleRule.js +6 -5
- package/dist/esm/helpers/insertStyleRule.js.map +2 -2
- package/dist/esm/hooks/useFeatures.js +17 -11
- package/dist/esm/hooks/useFeatures.js.map +2 -2
- package/dist/esm/styled.js +1 -8
- package/dist/esm/styled.js.map +2 -2
- package/dist/esm/tamagui-base.css +8 -0
- package/dist/esm/tamagui-base.css.map +7 -0
- package/dist/esm/views/Stack.js.map +2 -2
- package/dist/esm/views/Text.js.map +2 -2
- package/dist/esm/views/Theme.js +4 -1
- package/dist/esm/views/Theme.js.map +2 -2
- package/dist/jsx/constants/pseudos.js +17 -0
- package/dist/jsx/createComponent.js +39 -40
- package/dist/jsx/createShallowUpdate.js +0 -0
- package/dist/jsx/defaultComponentState.js +0 -11
- package/dist/jsx/devtools.js +13 -0
- package/dist/jsx/helpers/RNComponents.js +11 -0
- package/dist/jsx/helpers/createMediaStyle.js +2 -0
- package/dist/jsx/helpers/createShallowUpdate.js +18 -0
- package/dist/jsx/helpers/createTamaguiProvider.js +1 -2
- package/dist/jsx/helpers/getSplitStyles.js +7 -7
- package/dist/jsx/helpers/insertStyleRule.js +6 -5
- package/dist/jsx/hooks/useFeatures.js +17 -11
- package/dist/jsx/styled.js +1 -8
- package/dist/jsx/tamagui-base.css +7 -0
- package/dist/jsx/views/Theme.js +4 -1
- package/package.json +6 -6
- package/types/createComponent.d.ts +5 -6
- package/types/createComponent.d.ts.map +1 -1
- package/types/defaultComponentState.d.ts +0 -12
- package/types/defaultComponentState.d.ts.map +1 -1
- package/types/helpers/RNComponents.d.ts +2 -0
- package/types/helpers/RNComponents.d.ts.map +1 -0
- package/types/helpers/createMediaStyle.d.ts.map +1 -1
- package/types/helpers/createPropMapper.d.ts +1 -1
- package/types/helpers/createPropMapper.d.ts.map +1 -1
- package/types/helpers/createShallowUpdate.d.ts +4 -0
- package/types/helpers/createShallowUpdate.d.ts.map +1 -0
- package/types/helpers/createTamaguiProvider.d.ts +1 -1
- package/types/helpers/createTamaguiProvider.d.ts.map +1 -1
- package/types/helpers/getSplitStyles.d.ts +2 -3
- package/types/helpers/getSplitStyles.d.ts.map +1 -1
- package/types/helpers/insertStyleRule.d.ts.map +1 -1
- package/types/hooks/useFeatures.d.ts +3 -4
- package/types/hooks/useFeatures.d.ts.map +1 -1
- package/types/styled.d.ts +3 -7
- package/types/styled.d.ts.map +1 -1
- package/types/types-rnw.d.ts +0 -5
- package/types/types-rnw.d.ts.map +1 -1
- package/types/types.d.ts +61 -62
- package/types/types.d.ts.map +1 -1
- package/types/views/Stack.d.ts +2 -2
- package/types/views/Stack.d.ts.map +1 -1
- package/types/views/Text.d.ts +2 -2
- package/types/views/Text.d.ts.map +1 -1
- package/types/views/Theme.d.ts.map +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/createPropMapper.ts"],
|
|
4
|
-
"sourcesContent": ["import { getConfig } from '../conf'\nimport { isWeb } from '../constants/platform'\nimport { Variable, isVariable } from '../createVariable'\nimport { StaticConfig, TamaguiInternalConfig } from '../types'\nimport { isObj } from './isObj'\n\nexport type ResolveVariableTypes = 'auto' | 'value' | 'variable'\n\nexport const createPropMapper = (c: StaticConfig) => {\n const variants = c.variants || {}\n\n // goes through specificity finding best matching variant function\n function getVariantFunction(variant: any, key: string, value: any) {\n for (const cat in tokenCategories) {\n if (key in tokenCategories[cat]) {\n const spreadVariant = variant[`...${cat}`]\n if (spreadVariant) {\n return spreadVariant\n }\n }\n }\n let fn: any\n if (typeof value === 'number') {\n fn = variant[':number']\n } else if (typeof value === 'string') {\n fn = variant[':string']\n } else if (value === true || value === false) {\n fn = variant[':boolean']\n }\n fn = fn || variant[value]\n // fallback to size ultimately - could do token level detection\n return fn || variant['...'] || variant['...size']\n }\n\n const defaultProps = c.defaultProps || {}\n\n return (\n key: string,\n value: any,\n theme: any,\n props: any,\n staticConfig: StaticConfig,\n returnVariablesAs: ResolveVariableTypes = !!props.animation ? 'value' : 'auto',\n avoidDefaultProps = false\n ) => {\n const conf = getConfig()\n if (!conf) {\n console.trace('no conf! err')\n return\n }\n\n // handled here because we need to resolve this off tokens, its the only one-off like this\n let fontFamily = props.fontFamily || defaultProps.fontFamily || '$body'\n\n // expand variants\n const variant = variants && variants[key]\n\n if (variant && value !== undefined) {\n let variantValue = getVariantFunction(variant, key, value)\n\n if (!variantValue) {\n return value\n }\n\n if (typeof variantValue === 'function') {\n variantValue = variantValue(value, {\n tokens: conf.tokensParsed,\n theme,\n // we avoid passing in default props for media queries because that would confuse things like SizableText.size:\n props: avoidDefaultProps\n ? props\n : new Proxy(props, {\n get(target, key) {\n if (Reflect.has(target, key)) {\n return Reflect.get(target, key)\n }\n // these props may be extracted into classNames, but we still want to access them\n // at runtime, so we proxy back to defaultProps but don't pass them\n if (staticConfig.defaultProps) {\n return Reflect.get(staticConfig.defaultProps, key)\n }\n },\n }),\n })\n }\n\n // console.log(\n // 'GOGO',\n // variantValue,\n // 'now',\n // resolveTokens(variantValue, conf, theme, fontFamily, returnVariablesAs)\n // )\n\n if (isObj(variantValue)) {\n variantValue = resolveTokens(variantValue, conf, theme, fontFamily, returnVariablesAs)\n }\n\n return variantValue\n }\n\n let shouldReturn = false\n\n // handle shorthands\n if (conf.shorthands[key]) {\n shouldReturn = true\n key = conf.shorthands[key]\n }\n\n if (value) {\n shouldReturn = true\n if (value[0] === '$') {\n value = getToken(key, value, conf, theme, fontFamily, returnVariablesAs)\n } else if (isVariable(value)) {\n value = getVariableValue(value, returnVariablesAs)\n }\n }\n\n if (shouldReturn) {\n return {\n [key]: value,\n }\n }\n }\n}\n\nconst resolveTokens = (\n input: Object,\n conf: TamaguiInternalConfig,\n theme: any,\n fontFamily: any,\n resolveAs?: ResolveVariableTypes\n) => {\n let res = {}\n for (const rKey in input) {\n const fKey = conf.shorthands[rKey] || rKey\n const val = input[rKey]\n if (isVariable(val)) {\n res[fKey] =\n resolveAs === 'variable' ? val : !isWeb || resolveAs === 'value' ? val.val : val.variable\n } else if (typeof val === 'string') {\n const fVal = val[0] === '$' ? getToken(fKey, val, conf, theme, fontFamily, resolveAs) : val\n res[fKey] = fVal\n } else {\n if (isObj(val)) {\n // for things like shadowOffset, hoverStyle which is a sub-object\n res[fKey] = resolveTokens(val, conf, theme, fontFamily, resolveAs)\n } else {\n // nullish values cant be tokens so need no exrta parsing\n res[fKey] = input[fKey]\n }\n }\n if (process.env.NODE_ENV === 'development') {\n if (res[fKey]?.[0] === '$') {\n console.warn(`\u26A0\uFE0F Missing token in theme ${theme.name}:`, fKey, res[fKey])\n }\n }\n }\n return res\n}\n\nconst getToken = (\n key: string,\n value: string,\n { tokensParsed }: TamaguiInternalConfig,\n theme: any,\n fontFamily: string | undefined = '$body',\n resolveAs?: ResolveVariableTypes\n) => {\n let valOrVar: any\n let hasSet = false\n const valueName = value[0] === '$' ? value.slice(1) : value\n if (valueName in theme) {\n valOrVar = theme[valueName]\n hasSet = true\n } else {\n switch (key) {\n case 'fontFamily':\n valOrVar = tokensParsed.font[value]?.family || value\n hasSet = true\n break\n case 'fontSize':\n valOrVar = tokensParsed.font[fontFamily]?.size[value] || value\n hasSet = true\n break\n case 'lineHeight':\n valOrVar = tokensParsed.font[fontFamily]?.lineHeight[value] || value\n hasSet = true\n break\n case 'letterSpacing':\n valOrVar = tokensParsed.font[fontFamily]?.letterSpacing[value] || value\n hasSet = true\n break\n case 'fontWeight':\n valOrVar = tokensParsed.font[fontFamily]?.weight[value] || value\n hasSet = true\n break\n }\n for (const cat in tokenCategories) {\n if (key in tokenCategories[cat]) {\n const res = tokensParsed[cat][value]\n if (res) {\n valOrVar = res\n hasSet = true\n }\n }\n }\n if (!hasSet) {\n const spaceVar = tokensParsed.space[value]\n if (spaceVar) {\n valOrVar = spaceVar\n hasSet = true\n }\n }\n }\n if (hasSet) {\n return getVariableValue(valOrVar, resolveAs)\n }\n if (process.env.NODE_ENV === 'development') {\n if (value && value[0] === '$') {\n console.warn(`\u26A0\uFE0F Missing token in theme:`, value, theme)\n return null\n }\n }\n return value\n}\n\nfunction getVariableValue(valOrVar: Variable | any, resolveAs: ResolveVariableTypes = 'auto') {\n if (isVariable(valOrVar)) {\n if (resolveAs === 'variable') {\n return valOrVar\n }\n if (!isWeb || resolveAs === 'value') {\n return valOrVar.val\n }\n return valOrVar.variable\n }\n return valOrVar\n}\n\n// just specificy the least costly, all else go to `space` (most keys - we can exclude)\nconst tokenCategories = {\n radius: {\n borderRadius: true,\n },\n size: {\n width: true,\n height: true,\n minWidth: true,\n minHeight: true,\n maxWidth: true,\n maxHeight: true,\n },\n color: {\n color: true,\n backgroundColor: true,\n borderColor: true,\n borderBottomColor: true,\n borderTopColor: true,\n borderLeftColor: true,\n borderRightColor: true,\n },\n}\n"],
|
|
4
|
+
"sourcesContent": ["import { getConfig } from '../conf'\nimport { isWeb } from '../constants/platform'\nimport { Variable, isVariable } from '../createVariable'\nimport { StaticConfig, TamaguiInternalConfig } from '../types'\nimport { isObj } from './isObj'\n\nexport type ResolveVariableTypes = 'auto' | 'value' | 'variable' | 'both'\n\nexport const createPropMapper = (c: StaticConfig) => {\n const variants = c.variants || {}\n\n // goes through specificity finding best matching variant function\n function getVariantFunction(variant: any, key: string, value: any) {\n for (const cat in tokenCategories) {\n if (key in tokenCategories[cat]) {\n const spreadVariant = variant[`...${cat}`]\n if (spreadVariant) {\n return spreadVariant\n }\n }\n }\n let fn: any\n if (typeof value === 'number') {\n fn = variant[':number']\n } else if (typeof value === 'string') {\n fn = variant[':string']\n } else if (value === true || value === false) {\n fn = variant[':boolean']\n }\n fn = fn || variant[value]\n // fallback to size ultimately - could do token level detection\n return fn || variant['...'] || variant['...size']\n }\n\n const defaultProps = c.defaultProps || {}\n\n return (\n key: string,\n value: any,\n theme: any,\n props: any,\n staticConfig: StaticConfig,\n returnVariablesAs: ResolveVariableTypes = !!props.animation ? 'value' : 'auto',\n avoidDefaultProps = false\n ) => {\n const conf = getConfig()\n if (!conf) {\n console.trace('no conf! err')\n return\n }\n\n // handled here because we need to resolve this off tokens, its the only one-off like this\n let fontFamily = props.fontFamily || defaultProps.fontFamily || '$body'\n\n // expand variants\n const variant = variants && variants[key]\n\n if (variant && value !== undefined) {\n let variantValue = getVariantFunction(variant, key, value)\n\n if (!variantValue) {\n return value\n }\n\n if (typeof variantValue === 'function') {\n variantValue = variantValue(value, {\n tokens: conf.tokensParsed,\n theme,\n // we avoid passing in default props for media queries because that would confuse things like SizableText.size:\n props: avoidDefaultProps\n ? props\n : new Proxy(props, {\n get(target, key) {\n if (Reflect.has(target, key)) {\n return Reflect.get(target, key)\n }\n // these props may be extracted into classNames, but we still want to access them\n // at runtime, so we proxy back to defaultProps but don't pass them\n if (staticConfig.defaultProps) {\n return Reflect.get(staticConfig.defaultProps, key)\n }\n },\n }),\n })\n }\n\n // console.log(\n // 'GOGO',\n // variantValue,\n // 'now',\n // resolveTokens(variantValue, conf, theme, fontFamily, returnVariablesAs)\n // )\n\n if (isObj(variantValue)) {\n variantValue = resolveTokens(variantValue, conf, theme, fontFamily, returnVariablesAs)\n }\n\n return variantValue\n }\n\n let shouldReturn = false\n\n // handle shorthands\n if (conf.shorthands[key]) {\n shouldReturn = true\n key = conf.shorthands[key]\n }\n\n if (value) {\n shouldReturn = true\n if (value[0] === '$') {\n value = getToken(key, value, conf, theme, fontFamily, returnVariablesAs)\n } else if (isVariable(value)) {\n value = getVariableValue(value, returnVariablesAs)\n }\n }\n\n if (shouldReturn) {\n return {\n [key]: value,\n }\n }\n }\n}\n\nconst resolveTokens = (\n input: Object,\n conf: TamaguiInternalConfig,\n theme: any,\n fontFamily: any,\n resolveAs?: ResolveVariableTypes\n) => {\n let res = {}\n for (const rKey in input) {\n const fKey = conf.shorthands[rKey] || rKey\n const val = input[rKey]\n if (isVariable(val)) {\n res[fKey] =\n resolveAs === 'variable' ? val : !isWeb || resolveAs === 'value' ? val.val : val.variable\n } else if (typeof val === 'string') {\n const fVal = val[0] === '$' ? getToken(fKey, val, conf, theme, fontFamily, resolveAs) : val\n res[fKey] = fVal\n } else {\n if (isObj(val)) {\n // for things like shadowOffset, hoverStyle which is a sub-object\n res[fKey] = resolveTokens(val, conf, theme, fontFamily, resolveAs)\n } else {\n // nullish values cant be tokens so need no exrta parsing\n res[fKey] = input[fKey]\n }\n }\n if (process.env.NODE_ENV === 'development') {\n if (res[fKey]?.[0] === '$') {\n console.warn(`\u26A0\uFE0F Missing token in theme ${theme.name}:`, fKey, res[fKey])\n }\n }\n }\n return res\n}\n\nconst getToken = (\n key: string,\n value: string,\n { tokensParsed }: TamaguiInternalConfig,\n theme: any,\n fontFamily: string | undefined = '$body',\n resolveAs?: ResolveVariableTypes\n) => {\n let valOrVar: any\n let hasSet = false\n const valueName = value[0] === '$' ? value.slice(1) : value\n if (valueName in theme) {\n valOrVar = theme[valueName]\n hasSet = true\n } else {\n switch (key) {\n case 'fontFamily':\n valOrVar = tokensParsed.font[value]?.family || value\n hasSet = true\n break\n case 'fontSize':\n valOrVar = tokensParsed.font[fontFamily]?.size[value] || value\n hasSet = true\n break\n case 'lineHeight':\n valOrVar = tokensParsed.font[fontFamily]?.lineHeight[value] || value\n hasSet = true\n break\n case 'letterSpacing':\n valOrVar = tokensParsed.font[fontFamily]?.letterSpacing[value] || value\n hasSet = true\n break\n case 'fontWeight':\n valOrVar = tokensParsed.font[fontFamily]?.weight[value] || value\n hasSet = true\n break\n }\n for (const cat in tokenCategories) {\n if (key in tokenCategories[cat]) {\n const res = tokensParsed[cat][value]\n if (res) {\n valOrVar = res\n hasSet = true\n }\n }\n }\n if (!hasSet) {\n const spaceVar = tokensParsed.space[value]\n if (spaceVar) {\n valOrVar = spaceVar\n hasSet = true\n }\n }\n }\n if (hasSet) {\n return getVariableValue(valOrVar, resolveAs)\n }\n if (process.env.NODE_ENV === 'development') {\n if (value && value[0] === '$') {\n console.warn(`\u26A0\uFE0F Missing token in theme:`, value, theme)\n return null\n }\n }\n return value\n}\n\nfunction getVariableValue(valOrVar: Variable | any, resolveAs: ResolveVariableTypes = 'auto') {\n if (isVariable(valOrVar)) {\n if (resolveAs === 'variable') {\n return valOrVar\n }\n if (!isWeb || resolveAs === 'value') {\n return valOrVar.val\n }\n return valOrVar.variable\n }\n return valOrVar\n}\n\n// just specificy the least costly, all else go to `space` (most keys - we can exclude)\nconst tokenCategories = {\n radius: {\n borderRadius: true,\n },\n size: {\n width: true,\n height: true,\n minWidth: true,\n minHeight: true,\n maxWidth: true,\n maxHeight: true,\n },\n color: {\n color: true,\n backgroundColor: true,\n borderColor: true,\n borderBottomColor: true,\n borderTopColor: true,\n borderLeftColor: true,\n borderRightColor: true,\n },\n}\n"],
|
|
5
5
|
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
18
|
+
};
|
|
19
|
+
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
20
|
+
var __export = (target, all) => {
|
|
21
|
+
for (var name in all)
|
|
22
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
23
|
+
};
|
|
24
|
+
var __copyProps = (to, from, except, desc) => {
|
|
25
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
26
|
+
for (let key of __getOwnPropNames(from))
|
|
27
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
28
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
29
|
+
}
|
|
30
|
+
return to;
|
|
31
|
+
};
|
|
32
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
33
|
+
var createShallowUpdate_exports = {};
|
|
34
|
+
__export(createShallowUpdate_exports, {
|
|
35
|
+
createShallowUpdate: () => createShallowUpdate
|
|
36
|
+
});
|
|
37
|
+
module.exports = __toCommonJS(createShallowUpdate_exports);
|
|
38
|
+
function createShallowUpdate(setter) {
|
|
39
|
+
return (next) => {
|
|
40
|
+
setter((prev) => {
|
|
41
|
+
for (const key in next) {
|
|
42
|
+
if (prev[key] !== next[key]) {
|
|
43
|
+
return __spreadValues(__spreadValues({}, prev), next);
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
return prev;
|
|
47
|
+
});
|
|
48
|
+
};
|
|
49
|
+
}
|
|
50
|
+
__name(createShallowUpdate, "createShallowUpdate");
|
|
51
|
+
//# sourceMappingURL=createShallowUpdate.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/helpers/createShallowUpdate.tsx"],
|
|
4
|
+
"sourcesContent": ["import React from 'react'\n\nimport { TamaguiComponentState } from '../types'\n\nexport function createShallowUpdate(\n setter: React.Dispatch<React.SetStateAction<TamaguiComponentState>>\n) {\n return (next: Partial<TamaguiComponentState>) => {\n setter((prev) => {\n for (const key in next) {\n if (prev[key] !== next[key]) {\n return { ...prev, ...next }\n }\n }\n return prev\n })\n }\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAIO,6BACL,QACA;AACA,SAAO,CAAC,SAAyC;AAC/C,WAAO,CAAC,SAAS;AACf,iBAAW,OAAO,MAAM;AACtB,YAAI,KAAK,SAAS,KAAK,MAAM;AAC3B,iBAAO,kCAAK,OAAS;AAAA,QACvB;AAAA,MACF;AACA,aAAO;AAAA,IACT,CAAC;AAAA,EACH;AACF;AAbgB;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -63,11 +63,9 @@ function createTamaguiProvider(_a) {
|
|
|
63
63
|
return /* @__PURE__ */ __name(function TamaguiProvider(_a2) {
|
|
64
64
|
var _b2 = _a2, {
|
|
65
65
|
injectCSS,
|
|
66
|
-
fallback,
|
|
67
66
|
children
|
|
68
67
|
} = _b2, themePropsProvider = __objRest(_b2, [
|
|
69
68
|
"injectCSS",
|
|
70
|
-
"fallback",
|
|
71
69
|
"children"
|
|
72
70
|
]);
|
|
73
71
|
if (typeof document !== "undefined") {
|
|
@@ -84,9 +82,7 @@ function createTamaguiProvider(_a) {
|
|
|
84
82
|
}
|
|
85
83
|
return /* @__PURE__ */ React.createElement(import_ButtonInsideButtonContext.ButtonInsideButtonContext.Provider, {
|
|
86
84
|
value: false
|
|
87
|
-
}, /* @__PURE__ */ React.createElement(import_TextAncestorContext.TextAncestorProvider, null, /* @__PURE__ */ React.createElement(import_ThemeProvider.ThemeProvider, __spreadValues(__spreadValues({}, themeProps), themePropsProvider),
|
|
88
|
-
fallback: fallback || null
|
|
89
|
-
}, children))));
|
|
85
|
+
}, /* @__PURE__ */ React.createElement(import_TextAncestorContext.TextAncestorProvider, null, /* @__PURE__ */ React.createElement(import_ThemeProvider.ThemeProvider, __spreadValues(__spreadValues({}, themeProps), themePropsProvider), children)));
|
|
90
86
|
}, "TamaguiProvider");
|
|
91
87
|
}
|
|
92
88
|
__name(createTamaguiProvider, "createTamaguiProvider");
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/createTamaguiProvider.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react'\n\nimport { ButtonInsideButtonContext } from '../contexts/ButtonInsideButtonContext'\nimport { TamaguiProviderProps } from '../types'\nimport { TextAncestorProvider } from '../views/TextAncestorContext'\nimport { ThemeProvider, ThemeProviderProps } from '../views/ThemeProvider'\n\nexport function createTamaguiProvider({\n getCSS,\n ...themeProps\n}: ThemeProviderProps & {\n getCSS: () => string\n}) {\n return function TamaguiProvider({\n injectCSS,\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAAuB;AAEvB,uCAA0C;AAE1C,iCAAqC;AACrC,2BAAkD;AAE3C,+BAA+B,IAKnC;AALmC,eACpC;AAAA;AAAA,MADoC,IAEjC,uBAFiC,IAEjC;AAAA,IADH;AAAA;AAKA,SAAO,gDAAyB,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react'\n\nimport { ButtonInsideButtonContext } from '../contexts/ButtonInsideButtonContext'\nimport { TamaguiProviderProps } from '../types'\nimport { TextAncestorProvider } from '../views/TextAncestorContext'\nimport { ThemeProvider, ThemeProviderProps } from '../views/ThemeProvider'\n\nexport function createTamaguiProvider({\n getCSS,\n ...themeProps\n}: ThemeProviderProps & {\n getCSS: () => string\n}) {\n return function TamaguiProvider({\n injectCSS,\n children,\n ...themePropsProvider\n }: TamaguiProviderProps) {\n // inject CSS if asked to (not SSR compliant)\n if (typeof document !== 'undefined') {\n React.useLayoutEffect(() => {\n if (!injectCSS) return\n const style = document.createElement('style')\n style.appendChild(document.createTextNode(getCSS()))\n document.head.appendChild(style)\n return () => {\n document.head.removeChild(style)\n }\n }, [])\n }\n\n return (\n <ButtonInsideButtonContext.Provider value={false}>\n <TextAncestorProvider>\n <ThemeProvider {...themeProps} {...themePropsProvider}>\n {children}\n </ThemeProvider>\n </TextAncestorProvider>\n </ButtonInsideButtonContext.Provider>\n )\n }\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAAuB;AAEvB,uCAA0C;AAE1C,iCAAqC;AACrC,2BAAkD;AAE3C,+BAA+B,IAKnC;AALmC,eACpC;AAAA;AAAA,MADoC,IAEjC,uBAFiC,IAEjC;AAAA,IADH;AAAA;AAKA,SAAO,gDAAyB,KAIP;AAJO,mBAC9B;AAAA;AAAA,MACA;AAAA,QAF8B,KAG3B,+BAH2B,KAG3B;AAAA,MAFH;AAAA,MACA;AAAA;AAIA,QAAI,OAAO,aAAa,aAAa;AACnC,YAAM,gBAAgB,MAAM;AAC1B,YAAI,CAAC;AAAW;AAChB,cAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,cAAM,YAAY,SAAS,eAAe,OAAO,CAAC,CAAC;AACnD,iBAAS,KAAK,YAAY,KAAK;AAC/B,eAAO,MAAM;AACX,mBAAS,KAAK,YAAY,KAAK;AAAA,QACjC;AAAA,MACF,GAAG,CAAC,CAAC;AAAA,IACP;AAEA,WACE,oCAAC,2DAA0B,UAA1B;AAAA,MAAmC,OAAO;AAAA,OACzC,oCAAC,uDACC,oCAAC,sEAAkB,aAAgB,qBAChC,QACH,CACF,CACF;AAAA,EAEJ,GA3BO;AA4BT;AAlCgB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -62,7 +62,6 @@ function normalizeStyleObject(style) {
|
|
|
62
62
|
}
|
|
63
63
|
__name(normalizeStyleObject, "normalizeStyleObject");
|
|
64
64
|
const getSplitStyles = /* @__PURE__ */ __name((props, staticConfig, theme, state, defaultClassNames) => {
|
|
65
|
-
var _a, _b, _c;
|
|
66
65
|
const validStyleProps = staticConfig.isText ? import_helpers.stylePropsText : import_helpers.validStyles;
|
|
67
66
|
const viewProps = {};
|
|
68
67
|
const style = {};
|
|
@@ -105,7 +104,8 @@ const getSplitStyles = /* @__PURE__ */ __name((props, staticConfig, theme, state
|
|
|
105
104
|
style[atomicStyle.property] = atomicStyle.value;
|
|
106
105
|
}
|
|
107
106
|
}
|
|
108
|
-
}
|
|
107
|
+
}
|
|
108
|
+
if (state.noClassNames || state.resolveVariablesAs === "value" || state.resolveVariablesAs === "both") {
|
|
109
109
|
for (const key in cur) {
|
|
110
110
|
if (key in import_helpers.stylePropsTransform) {
|
|
111
111
|
(0, import_helpers.mergeTransform)(style, key, cur[key]);
|
|
@@ -137,6 +137,9 @@ const getSplitStyles = /* @__PURE__ */ __name((props, staticConfig, theme, state
|
|
|
137
137
|
let isPseudo = import_helpers.validPseudoKeys[keyInit];
|
|
138
138
|
const out = isMedia || isPseudo ? true : staticConfig.propMapper(keyInit, valInit, theme, props, staticConfig, state.resolveVariablesAs);
|
|
139
139
|
const expanded = out === true || !out ? [[keyInit, valInit]] : Object.entries(out);
|
|
140
|
+
if (process.env.NODE_ENV === "development" && props["debug"] === "verbose") {
|
|
141
|
+
console.log("split style", keyInit, expanded);
|
|
142
|
+
}
|
|
140
143
|
for (const [key, val] of expanded) {
|
|
141
144
|
if (val === void 0) {
|
|
142
145
|
continue;
|
|
@@ -160,9 +163,6 @@ const getSplitStyles = /* @__PURE__ */ __name((props, staticConfig, theme, state
|
|
|
160
163
|
pseudos[key] = getSubStyle(val, staticConfig, theme, props, state.resolveVariablesAs, true);
|
|
161
164
|
if (import_platform.isWeb && !state.noClassNames) {
|
|
162
165
|
const pseudoStyles = (0, import_getStylesAtomic.getStylesAtomic)({ [key]: pseudos[key] });
|
|
163
|
-
if ((_b = (_a = pseudoStyles[0]) == null ? void 0 : _a.identifier) == null ? void 0 : _b.includes("undefined")) {
|
|
164
|
-
console.warn("undefined bug?", (_c = pseudoStyles[0]) == null ? void 0 : _c.identifier);
|
|
165
|
-
}
|
|
166
166
|
for (const style2 of pseudoStyles) {
|
|
167
167
|
mergeClassName(`${style2.property}-${key}`, style2.identifier);
|
|
168
168
|
(0, import_insertStyleRule.insertStyleRule)(style2.identifier, style2.rules[0]);
|
|
@@ -173,10 +173,10 @@ const getSplitStyles = /* @__PURE__ */ __name((props, staticConfig, theme, state
|
|
|
173
173
|
if (isMedia) {
|
|
174
174
|
const mediaKey = key.slice(1);
|
|
175
175
|
if (!import_useMedia.mediaQueryConfig[mediaKey]) {
|
|
176
|
-
viewProps[key] =
|
|
176
|
+
viewProps[key] = val;
|
|
177
177
|
continue;
|
|
178
178
|
}
|
|
179
|
-
const mediaStyle = getSubStyle(
|
|
179
|
+
const mediaStyle = getSubStyle(val, staticConfig, theme, props, state.resolveVariablesAs, true);
|
|
180
180
|
if (import_platform.isWeb) {
|
|
181
181
|
const mediaStyles = (0, import_getStylesAtomic.getStylesAtomic)(mediaStyle);
|
|
182
182
|
for (const style2 of mediaStyles) {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/getSplitStyles.tsx"],
|
|
4
|
-
"sourcesContent": ["import {\n mergeTransform,\n stylePropsText,\n stylePropsTransform,\n validPseudoKeys,\n validStyles,\n} from '@tamagui/helpers'\nimport { ViewStyle } from 'react-native'\n\nimport { isWeb } from '../constants/platform'\nimport { ComponentState } from '../defaultComponentState'\nimport { mediaQueryConfig, mediaState } from '../hooks/useMedia'\nimport {\n MediaKeys,\n MediaQueryKey,\n PsuedoPropKeys,\n StackProps,\n StaticConfigParsed,\n ThemeObject,\n} from '../types'\nimport { createMediaStyle } from './createMediaStyle'\nimport { ResolveVariableTypes } from './createPropMapper'\nimport { fixNativeShadow } from './fixNativeShadow'\nimport { ViewStyleWithPseudos, getStylesAtomic } from './getStylesAtomic'\nimport { insertStyleRule, insertedTransforms, updateInserted } from './insertStyleRule'\n\nexport type SplitStyles = ReturnType<typeof getSplitStyles>\n\nconst skipKeys = {\n // could put events in here\n animation: true,\n animated: true,\n children: true,\n key: true,\n ref: true,\n}\n\nexport type PseudoStyles = {\n hoverStyle?: ViewStyle\n pressStyle?: ViewStyle\n focusStyle?: ViewStyle\n enterStyle?: ViewStyle\n exitStyle?: ViewStyle\n}\n\nexport type ClassNamesObject = Record<string, string>\n\nexport type SplitStyleResult = ReturnType<typeof getSplitStyles>\n\nfunction normalizeStyleObject(style: any) {\n // fix flex to match web\n // see spec for flex shorthand https://developer.mozilla.org/en-US/docs/Web/CSS/flex\n if (typeof style.flex === 'number') {\n const val = style.flex\n delete style.flex\n style.flexGrow = style.flexGrow ?? val\n style.flexShrink = style.flexShrink ?? 1\n }\n\n if (!isWeb) {\n fixNativeShadow(style)\n }\n}\n\ntype TransformNamespaceKey = 'transform' | PsuedoPropKeys | MediaQueryKey\n\n// TODO can make a few of these objects lazy if profiling seems slow\n\nexport const getSplitStyles = (\n props: { [key: string]: any },\n staticConfig: StaticConfigParsed,\n theme: ThemeObject,\n state: Partial<ComponentState> & {\n noClassNames?: boolean\n resolveVariablesAs?: ResolveVariableTypes\n },\n defaultClassNames?: ClassNamesObject | null\n) => {\n const validStyleProps = staticConfig.isText ? stylePropsText : validStyles\n const viewProps: StackProps = {}\n const style: ViewStyle = {}\n const classNames: ClassNamesObject = {\n ...defaultClassNames,\n }\n const pseudos: PseudoStyles = {}\n const medias: Record<MediaKeys, ViewStyle> = {}\n let cur: ViewStyleWithPseudos | null = null\n\n // we need to gather these specific to each media query / pseudo\n // value is [hash, val], so [\"-jnjad-asdnjk\", \"scaleX(1) rotate(10deg)\"]\n let transforms: Record<TransformNamespaceKey, [string, string]> = {}\n\n function mergeClassName(key: string, val: string) {\n if (!val) return\n if (val.startsWith('_transform-')) {\n const isMediaOrPseudo = key !== 'transform'\n const isMedia = isMediaOrPseudo && key[11] === '_'\n const isPsuedo = isMediaOrPseudo && !isMedia\n const namespace: TransformNamespaceKey = isMedia\n ? key.split('_')[2]\n : isPsuedo\n ? key.split('-')[1]\n : 'transform'\n if (!insertedTransforms[val]) {\n // HMR or loaded a new chunk\n updateInserted()\n }\n const transform = insertedTransforms[val]\n // if (!transform) {\n // console.error('NO TRANSFORM', key, val)\n // return\n // }\n transforms[namespace] = transforms[namespace] || ['', '']\n transforms[namespace][0] += val.replace('_transform', '')\n transforms[namespace][1] += transform\n } else {\n classNames[key] = val\n }\n }\n\n function push() {\n if (!cur) return\n normalizeStyleObject(cur)\n if (isWeb && !state.noClassNames) {\n const atomic = getStylesAtomic(cur)\n for (const atomicStyle of atomic) {\n if (!state.noClassNames) {\n mergeClassName(atomicStyle.property, atomicStyle.identifier)\n insertStyleRule(atomicStyle.identifier, atomicStyle.rules[0])\n } else {\n style[atomicStyle.property] = atomicStyle.value\n }\n }\n } else {\n for (const key in cur) {\n if (key in stylePropsTransform) {\n mergeTransform(style, key, cur[key])\n } else {\n style[key] = cur[key]\n }\n }\n }\n // reset it for next group of styles\n cur = null\n }\n\n for (const keyInit in props) {\n const valInit = props[keyInit]\n\n if (skipKeys[keyInit]) {\n viewProps[keyInit] = valInit\n continue\n }\n\n if (\n // isPropClassName\n keyInit === 'className' ||\n // isExtractedClassName\n (validStyleProps[keyInit] && valInit && valInit[0] === '_')\n ) {\n push()\n mergeClassName(keyInit, valInit)\n if (cur) {\n if (cur[keyInit]) console.warn('just want to see how used')\n delete cur[keyInit]\n }\n continue\n }\n\n let isMedia = keyInit[0] === '$'\n let isPseudo = validPseudoKeys[keyInit]\n\n const out =\n isMedia || isPseudo\n ? true\n : staticConfig.propMapper(\n keyInit,\n valInit,\n theme,\n props,\n staticConfig,\n state.resolveVariablesAs\n )\n\n const expanded = out === true || !out ? [[keyInit, valInit]] : Object.entries(out)\n\n for (const [key, val] of expanded) {\n if (val === undefined) {\n continue\n }\n\n if (val && val[0] === '_') {\n mergeClassName(key, val)\n continue\n }\n\n isMedia = key[0] === '$'\n isPseudo = validPseudoKeys[key]\n\n if (\n (staticConfig.deoptProps && staticConfig.deoptProps.has(key)) ||\n (staticConfig.inlineProps && staticConfig.inlineProps.has(key))\n ) {\n viewProps[key] = val\n }\n\n // pseudo\n if (isPseudo) {\n if (!val) continue\n if (key === 'enterStyle' && state.mounted) {\n // once mounted we can ignore enterStyle\n continue\n }\n pseudos[key] = pseudos[key] || {}\n pseudos[key] = getSubStyle(val, staticConfig, theme, props, state.resolveVariablesAs, true)\n if (isWeb && !state.noClassNames) {\n const pseudoStyles = getStylesAtomic({ [key]: pseudos[key] })\n if (pseudoStyles[0]?.identifier?.includes('undefined')) {\n console.warn('undefined bug?', pseudoStyles[0]?.identifier)\n }\n for (const style of pseudoStyles) {\n mergeClassName(`${style.property}-${key}`, style.identifier)\n insertStyleRule(style.identifier, style.rules[0])\n }\n }\n continue\n }\n\n // media\n if (isMedia) {\n const mediaKey = key.slice(1)\n\n if (!mediaQueryConfig[mediaKey]) {\n // this isn't a media key, pass through\n viewProps[key] = valInit\n continue\n }\n\n // dont check if media is active, we just apply *all* media styles\n // we combine the media props on top regular props, could proxy this\n // TODO test proxy here instead of merge\n // THIS USED TO PROXY BACK TO REGULAR PROPS BUT THAT IS THE WRONG BEHAVIOR\n // we avoid passing in default props for media queries because that would confuse things like SizableText.size:\n const mediaStyle = getSubStyle(\n valInit,\n staticConfig,\n theme,\n props,\n state.resolveVariablesAs,\n true\n )\n\n if (isWeb) {\n const mediaStyles = getStylesAtomic(mediaStyle)\n for (const style of mediaStyles) {\n const out = createMediaStyle(style, mediaKey, mediaQueryConfig)\n mergeClassName(`${out.identifier}-${mediaKey}`, out.identifier)\n insertStyleRule(out.identifier, out.styleRule)\n }\n if (mediaState[mediaKey]) {\n Object.assign(medias, mediaStyle)\n }\n } else {\n if (mediaState[mediaKey]) {\n // TODO i think media + pseudo needs handling here\n Object.assign(style, mediaStyle)\n }\n }\n continue\n }\n\n // TODO\n if (key === 'style' || key.startsWith('_style')) {\n push()\n Object.assign(style, val)\n continue\n }\n\n if (!isWeb && key === 'pointerEvents') {\n viewProps[key] = val\n continue\n }\n\n if (validStyleProps[key]) {\n cur = cur || {}\n cur[key] = val\n continue\n }\n\n // pass to view props\n if (!staticConfig.variants || !(key in staticConfig.variants)) {\n if (key !== 'animation' && key !== 'debug') {\n push()\n viewProps[key] = val\n }\n }\n }\n }\n\n push()\n\n if (transforms) {\n for (const namespace in transforms) {\n const [hash, val] = transforms[namespace]\n const identifier = `_transform${hash}`\n if (!insertedTransforms[identifier]) {\n const rule = `.${identifier} { transform: ${val}; }`\n insertStyleRule(identifier, rule)\n }\n classNames[namespace] = identifier\n }\n }\n\n return {\n viewProps,\n style,\n medias,\n pseudos,\n classNames,\n }\n}\n\nconst getSubStyle = (\n styleIn: Object,\n staticConfig: StaticConfigParsed,\n theme: ThemeObject,\n props: any,\n resolveVariablesAs?: ResolveVariableTypes,\n avoidDefaultProps?: boolean\n): ViewStyle => {\n const styleOut: ViewStyle = {}\n for (const key in styleIn) {\n const val = styleIn[key]\n const out = staticConfig.propMapper(\n key,\n val,\n theme,\n props,\n staticConfig,\n resolveVariablesAs,\n avoidDefaultProps\n )\n const expanded = out === true || !out ? [[key, val]] : Object.entries(out)\n for (const [skey, sval] of expanded) {\n if (skey in stylePropsTransform) {\n mergeTransform(styleOut, skey, sval)\n } else {\n styleOut[skey] = sval\n }\n }\n }\n normalizeStyleObject(styleOut)\n return styleOut\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAMO;AAGP,sBAAsB;
|
|
4
|
+
"sourcesContent": ["import {\n mergeTransform,\n stylePropsText,\n stylePropsTransform,\n validPseudoKeys,\n validStyles,\n} from '@tamagui/helpers'\nimport { ViewStyle } from 'react-native'\n\nimport { isWeb } from '../constants/platform'\nimport { mediaQueryConfig, mediaState } from '../hooks/useMedia'\nimport {\n MediaKeys,\n MediaQueryKey,\n PsuedoPropKeys,\n StackProps,\n StaticConfigParsed,\n TamaguiComponentState,\n ThemeObject,\n} from '../types'\nimport { createMediaStyle } from './createMediaStyle'\nimport { ResolveVariableTypes } from './createPropMapper'\nimport { fixNativeShadow } from './fixNativeShadow'\nimport { ViewStyleWithPseudos, getStylesAtomic } from './getStylesAtomic'\nimport { insertStyleRule, insertedTransforms, updateInserted } from './insertStyleRule'\n\nexport type SplitStyles = ReturnType<typeof getSplitStyles>\n\nconst skipKeys = {\n // could put events in here\n animation: true,\n animated: true,\n children: true,\n key: true,\n ref: true,\n}\n\nexport type PseudoStyles = {\n hoverStyle?: ViewStyle\n pressStyle?: ViewStyle\n focusStyle?: ViewStyle\n enterStyle?: ViewStyle\n exitStyle?: ViewStyle\n}\n\nexport type ClassNamesObject = Record<string, string>\n\nexport type SplitStyleResult = ReturnType<typeof getSplitStyles>\n\nfunction normalizeStyleObject(style: any) {\n // fix flex to match web\n // see spec for flex shorthand https://developer.mozilla.org/en-US/docs/Web/CSS/flex\n if (typeof style.flex === 'number') {\n const val = style.flex\n delete style.flex\n style.flexGrow = style.flexGrow ?? val\n style.flexShrink = style.flexShrink ?? 1\n }\n\n if (!isWeb) {\n fixNativeShadow(style)\n }\n}\n\ntype TransformNamespaceKey = 'transform' | PsuedoPropKeys | MediaQueryKey\n\n// TODO can make a few of these objects lazy if profiling seems slow\n\nexport const getSplitStyles = (\n props: { [key: string]: any },\n staticConfig: StaticConfigParsed,\n theme: ThemeObject,\n state: Partial<TamaguiComponentState> & {\n noClassNames?: boolean\n resolveVariablesAs?: ResolveVariableTypes\n },\n defaultClassNames?: ClassNamesObject | null\n) => {\n const validStyleProps = staticConfig.isText ? stylePropsText : validStyles\n const viewProps: StackProps = {}\n const style: ViewStyle = {}\n const classNames: ClassNamesObject = {\n ...defaultClassNames,\n }\n const pseudos: PseudoStyles = {}\n const medias: Record<MediaKeys, ViewStyle> = {}\n let cur: ViewStyleWithPseudos | null = null\n\n // we need to gather these specific to each media query / pseudo\n // value is [hash, val], so [\"-jnjad-asdnjk\", \"scaleX(1) rotate(10deg)\"]\n let transforms: Record<TransformNamespaceKey, [string, string]> = {}\n\n function mergeClassName(key: string, val: string) {\n if (!val) return\n if (val.startsWith('_transform-')) {\n const isMediaOrPseudo = key !== 'transform'\n const isMedia = isMediaOrPseudo && key[11] === '_'\n const isPsuedo = isMediaOrPseudo && !isMedia\n const namespace: TransformNamespaceKey = isMedia\n ? key.split('_')[2]\n : isPsuedo\n ? key.split('-')[1]\n : 'transform'\n if (!insertedTransforms[val]) {\n // HMR or loaded a new chunk\n updateInserted()\n }\n const transform = insertedTransforms[val]\n // if (!transform) {\n // console.error('NO TRANSFORM', key, val)\n // return\n // }\n transforms[namespace] = transforms[namespace] || ['', '']\n transforms[namespace][0] += val.replace('_transform', '')\n transforms[namespace][1] += transform\n } else {\n classNames[key] = val\n }\n }\n\n function push() {\n if (!cur) return\n normalizeStyleObject(cur)\n\n if (isWeb && !state.noClassNames) {\n const atomic = getStylesAtomic(cur)\n for (const atomicStyle of atomic) {\n if (!state.noClassNames) {\n mergeClassName(atomicStyle.property, atomicStyle.identifier)\n insertStyleRule(atomicStyle.identifier, atomicStyle.rules[0])\n } else {\n style[atomicStyle.property] = atomicStyle.value\n }\n }\n }\n\n if (\n state.noClassNames ||\n state.resolveVariablesAs === 'value' ||\n state.resolveVariablesAs === 'both'\n ) {\n for (const key in cur) {\n if (key in stylePropsTransform) {\n mergeTransform(style, key, cur[key])\n } else {\n style[key] = cur[key]\n }\n }\n }\n\n // reset it for next group of styles\n cur = null\n }\n\n for (const keyInit in props) {\n const valInit = props[keyInit]\n\n if (skipKeys[keyInit]) {\n viewProps[keyInit] = valInit\n continue\n }\n\n if (\n // isPropClassName\n keyInit === 'className' ||\n // isExtractedClassName\n (validStyleProps[keyInit] && valInit && valInit[0] === '_')\n ) {\n push()\n mergeClassName(keyInit, valInit)\n if (cur) {\n if (cur[keyInit]) console.warn('just want to see how used')\n delete cur[keyInit]\n }\n continue\n }\n\n let isMedia = keyInit[0] === '$'\n let isPseudo = validPseudoKeys[keyInit]\n\n const out =\n isMedia || isPseudo\n ? true\n : staticConfig.propMapper(\n keyInit,\n valInit,\n theme,\n props,\n staticConfig,\n state.resolveVariablesAs\n )\n\n const expanded = out === true || !out ? [[keyInit, valInit]] : Object.entries(out)\n\n if (process.env.NODE_ENV === 'development' && props['debug'] === 'verbose') {\n console.log('split style', keyInit, expanded)\n }\n\n for (const [key, val] of expanded) {\n if (val === undefined) {\n continue\n }\n\n if (val && val[0] === '_') {\n mergeClassName(key, val)\n continue\n }\n\n isMedia = key[0] === '$'\n isPseudo = validPseudoKeys[key]\n\n if (\n (staticConfig.deoptProps && staticConfig.deoptProps.has(key)) ||\n (staticConfig.inlineProps && staticConfig.inlineProps.has(key))\n ) {\n viewProps[key] = val\n }\n\n // pseudo\n if (isPseudo) {\n if (!val) continue\n if (key === 'enterStyle' && state.mounted) {\n // once mounted we can ignore enterStyle\n continue\n }\n pseudos[key] = pseudos[key] || {}\n pseudos[key] = getSubStyle(val, staticConfig, theme, props, state.resolveVariablesAs, true)\n if (isWeb && !state.noClassNames) {\n const pseudoStyles = getStylesAtomic({ [key]: pseudos[key] })\n for (const style of pseudoStyles) {\n mergeClassName(`${style.property}-${key}`, style.identifier)\n insertStyleRule(style.identifier, style.rules[0])\n }\n }\n continue\n }\n\n // media\n if (isMedia) {\n const mediaKey = key.slice(1)\n\n if (!mediaQueryConfig[mediaKey]) {\n // this isn't a media key, pass through\n viewProps[key] = val\n continue\n }\n\n // dont check if media is active, we just apply *all* media styles\n // we combine the media props on top regular props, could proxy this\n // TODO test proxy here instead of merge\n // THIS USED TO PROXY BACK TO REGULAR PROPS BUT THAT IS THE WRONG BEHAVIOR\n // we avoid passing in default props for media queries because that would confuse things like SizableText.size:\n const mediaStyle = getSubStyle(\n val,\n staticConfig,\n theme,\n props,\n state.resolveVariablesAs,\n true\n )\n\n if (isWeb) {\n const mediaStyles = getStylesAtomic(mediaStyle)\n for (const style of mediaStyles) {\n const out = createMediaStyle(style, mediaKey, mediaQueryConfig)\n mergeClassName(`${out.identifier}-${mediaKey}`, out.identifier)\n insertStyleRule(out.identifier, out.styleRule)\n }\n if (mediaState[mediaKey]) {\n Object.assign(medias, mediaStyle)\n }\n } else {\n if (mediaState[mediaKey]) {\n // TODO i think media + pseudo needs handling here\n Object.assign(style, mediaStyle)\n }\n }\n continue\n }\n\n // TODO\n if (key === 'style' || key.startsWith('_style')) {\n push()\n Object.assign(style, val)\n continue\n }\n\n if (!isWeb && key === 'pointerEvents') {\n viewProps[key] = val\n continue\n }\n\n if (validStyleProps[key]) {\n cur = cur || {}\n cur[key] = val\n continue\n }\n\n // pass to view props\n if (!staticConfig.variants || !(key in staticConfig.variants)) {\n if (key !== 'animation' && key !== 'debug') {\n push()\n viewProps[key] = val\n }\n }\n }\n }\n\n push()\n\n if (transforms) {\n for (const namespace in transforms) {\n const [hash, val] = transforms[namespace]\n const identifier = `_transform${hash}`\n if (!insertedTransforms[identifier]) {\n const rule = `.${identifier} { transform: ${val}; }`\n insertStyleRule(identifier, rule)\n }\n classNames[namespace] = identifier\n }\n }\n\n return {\n viewProps,\n style,\n medias,\n pseudos,\n classNames,\n }\n}\n\nconst getSubStyle = (\n styleIn: Object,\n staticConfig: StaticConfigParsed,\n theme: ThemeObject,\n props: any,\n resolveVariablesAs?: ResolveVariableTypes,\n avoidDefaultProps?: boolean\n): ViewStyle => {\n const styleOut: ViewStyle = {}\n for (const key in styleIn) {\n const val = styleIn[key]\n const out = staticConfig.propMapper(\n key,\n val,\n theme,\n props,\n staticConfig,\n resolveVariablesAs,\n avoidDefaultProps\n )\n const expanded = out === true || !out ? [[key, val]] : Object.entries(out)\n for (const [skey, sval] of expanded) {\n if (skey in stylePropsTransform) {\n mergeTransform(styleOut, skey, sval)\n } else {\n styleOut[skey] = sval\n }\n }\n }\n normalizeStyleObject(styleOut)\n return styleOut\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAMO;AAGP,sBAAsB;AACtB,sBAA6C;AAU7C,8BAAiC;AAEjC,6BAAgC;AAChC,6BAAsD;AACtD,6BAAoE;AAIpE,MAAM,WAAW;AAAA,EAEf,WAAW;AAAA,EACX,UAAU;AAAA,EACV,UAAU;AAAA,EACV,KAAK;AAAA,EACL,KAAK;AACP;AAcA,8BAA8B,OAAY;AAGxC,MAAI,OAAO,MAAM,SAAS,UAAU;AAClC,UAAM,MAAM,MAAM;AAClB,WAAO,MAAM;AACb,UAAM,WAAW,MAAM,YAAY;AACnC,UAAM,aAAa,MAAM,cAAc;AAAA,EACzC;AAEA,MAAI,CAAC,uBAAO;AACV,gDAAgB,KAAK;AAAA,EACvB;AACF;AAbS;AAmBF,MAAM,iBAAiB,wBAC5B,OACA,cACA,OACA,OAIA,sBACG;AACH,QAAM,kBAAkB,aAAa,SAAS,gCAAiB;AAC/D,QAAM,YAAwB,CAAC;AAC/B,QAAM,QAAmB,CAAC;AAC1B,QAAM,aAA+B,mBAChC;AAEL,QAAM,UAAwB,CAAC;AAC/B,QAAM,SAAuC,CAAC;AAC9C,MAAI,MAAmC;AAIvC,MAAI,aAA8D,CAAC;AAEnE,0BAAwB,KAAa,KAAa;AAChD,QAAI,CAAC;AAAK;AACV,QAAI,IAAI,WAAW,aAAa,GAAG;AACjC,YAAM,kBAAkB,QAAQ;AAChC,YAAM,UAAU,mBAAmB,IAAI,QAAQ;AAC/C,YAAM,WAAW,mBAAmB,CAAC;AACrC,YAAM,YAAmC,UACrC,IAAI,MAAM,GAAG,EAAE,KACf,WACA,IAAI,MAAM,GAAG,EAAE,KACf;AACJ,UAAI,CAAC,0CAAmB,MAAM;AAE5B,mDAAe;AAAA,MACjB;AACA,YAAM,YAAY,0CAAmB;AAKrC,iBAAW,aAAa,WAAW,cAAc,CAAC,IAAI,EAAE;AACxD,iBAAW,WAAW,MAAM,IAAI,QAAQ,cAAc,EAAE;AACxD,iBAAW,WAAW,MAAM;AAAA,IAC9B,OAAO;AACL,iBAAW,OAAO;AAAA,IACpB;AAAA,EACF;AA1BS;AA4BT,kBAAgB;AACd,QAAI,CAAC;AAAK;AACV,yBAAqB,GAAG;AAExB,QAAI,yBAAS,CAAC,MAAM,cAAc;AAChC,YAAM,SAAS,4CAAgB,GAAG;AAClC,iBAAW,eAAe,QAAQ;AAChC,YAAI,CAAC,MAAM,cAAc;AACvB,yBAAe,YAAY,UAAU,YAAY,UAAU;AAC3D,sDAAgB,YAAY,YAAY,YAAY,MAAM,EAAE;AAAA,QAC9D,OAAO;AACL,gBAAM,YAAY,YAAY,YAAY;AAAA,QAC5C;AAAA,MACF;AAAA,IACF;AAEA,QACE,MAAM,gBACN,MAAM,uBAAuB,WAC7B,MAAM,uBAAuB,QAC7B;AACA,iBAAW,OAAO,KAAK;AACrB,YAAI,OAAO,oCAAqB;AAC9B,6CAAe,OAAO,KAAK,IAAI,IAAI;AAAA,QACrC,OAAO;AACL,gBAAM,OAAO,IAAI;AAAA,QACnB;AAAA,MACF;AAAA,IACF;AAGA,UAAM;AAAA,EACR;AAhCS;AAkCT,aAAW,WAAW,OAAO;AAC3B,UAAM,UAAU,MAAM;AAEtB,QAAI,SAAS,UAAU;AACrB,gBAAU,WAAW;AACrB;AAAA,IACF;AAEA,QAEE,YAAY,eAEX,gBAAgB,YAAY,WAAW,QAAQ,OAAO,KACvD;AACA,WAAK;AACL,qBAAe,SAAS,OAAO;AAC/B,UAAI,KAAK;AACP,YAAI,IAAI;AAAU,kBAAQ,KAAK,2BAA2B;AAC1D,eAAO,IAAI;AAAA,MACb;AACA;AAAA,IACF;AAEA,QAAI,UAAU,QAAQ,OAAO;AAC7B,QAAI,WAAW,+BAAgB;AAE/B,UAAM,MACJ,WAAW,WACP,OACA,aAAa,WACX,SACA,SACA,OACA,OACA,cACA,MAAM,kBACR;AAEN,UAAM,WAAW,QAAQ,QAAQ,CAAC,MAAM,CAAC,CAAC,SAAS,OAAO,CAAC,IAAI,OAAO,QAAQ,GAAG;AAEjF,QAAI,QAAQ,IAAI,aAAa,iBAAiB,MAAM,aAAa,WAAW;AAC1E,cAAQ,IAAI,eAAe,SAAS,QAAQ;AAAA,IAC9C;AAEA,eAAW,CAAC,KAAK,QAAQ,UAAU;AACjC,UAAI,QAAQ,QAAW;AACrB;AAAA,MACF;AAEA,UAAI,OAAO,IAAI,OAAO,KAAK;AACzB,uBAAe,KAAK,GAAG;AACvB;AAAA,MACF;AAEA,gBAAU,IAAI,OAAO;AACrB,iBAAW,+BAAgB;AAE3B,UACG,aAAa,cAAc,aAAa,WAAW,IAAI,GAAG,KAC1D,aAAa,eAAe,aAAa,YAAY,IAAI,GAAG,GAC7D;AACA,kBAAU,OAAO;AAAA,MACnB;AAGA,UAAI,UAAU;AACZ,YAAI,CAAC;AAAK;AACV,YAAI,QAAQ,gBAAgB,MAAM,SAAS;AAEzC;AAAA,QACF;AACA,gBAAQ,OAAO,QAAQ,QAAQ,CAAC;AAChC,gBAAQ,OAAO,YAAY,KAAK,cAAc,OAAO,OAAO,MAAM,oBAAoB,IAAI;AAC1F,YAAI,yBAAS,CAAC,MAAM,cAAc;AAChC,gBAAM,eAAe,4CAAgB,GAAG,MAAM,QAAQ,KAAK,CAAC;AAC5D,qBAAW,UAAS,cAAc;AAChC,2BAAe,GAAG,OAAM,YAAY,OAAO,OAAM,UAAU;AAC3D,wDAAgB,OAAM,YAAY,OAAM,MAAM,EAAE;AAAA,UAClD;AAAA,QACF;AACA;AAAA,MACF;AAGA,UAAI,SAAS;AACX,cAAM,WAAW,IAAI,MAAM,CAAC;AAE5B,YAAI,CAAC,iCAAiB,WAAW;AAE/B,oBAAU,OAAO;AACjB;AAAA,QACF;AAOA,cAAM,aAAa,YACjB,KACA,cACA,OACA,OACA,MAAM,oBACN,IACF;AAEA,YAAI,uBAAO;AACT,gBAAM,cAAc,4CAAgB,UAAU;AAC9C,qBAAW,UAAS,aAAa;AAC/B,kBAAM,OAAM,8CAAiB,QAAO,UAAU,gCAAgB;AAC9D,2BAAe,GAAG,KAAI,cAAc,YAAY,KAAI,UAAU;AAC9D,wDAAgB,KAAI,YAAY,KAAI,SAAS;AAAA,UAC/C;AACA,cAAI,2BAAW,WAAW;AACxB,mBAAO,OAAO,QAAQ,UAAU;AAAA,UAClC;AAAA,QACF,OAAO;AACL,cAAI,2BAAW,WAAW;AAExB,mBAAO,OAAO,OAAO,UAAU;AAAA,UACjC;AAAA,QACF;AACA;AAAA,MACF;AAGA,UAAI,QAAQ,WAAW,IAAI,WAAW,QAAQ,GAAG;AAC/C,aAAK;AACL,eAAO,OAAO,OAAO,GAAG;AACxB;AAAA,MACF;AAEA,UAAI,CAAC,yBAAS,QAAQ,iBAAiB;AACrC,kBAAU,OAAO;AACjB;AAAA,MACF;AAEA,UAAI,gBAAgB,MAAM;AACxB,cAAM,OAAO,CAAC;AACd,YAAI,OAAO;AACX;AAAA,MACF;AAGA,UAAI,CAAC,aAAa,YAAY,CAAE,QAAO,aAAa,WAAW;AAC7D,YAAI,QAAQ,eAAe,QAAQ,SAAS;AAC1C,eAAK;AACL,oBAAU,OAAO;AAAA,QACnB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEA,OAAK;AAEL,MAAI,YAAY;AACd,eAAW,aAAa,YAAY;AAClC,YAAM,CAAC,MAAM,OAAO,WAAW;AAC/B,YAAM,aAAa,aAAa;AAChC,UAAI,CAAC,0CAAmB,aAAa;AACnC,cAAM,OAAO,IAAI,2BAA2B;AAC5C,oDAAgB,YAAY,IAAI;AAAA,MAClC;AACA,iBAAW,aAAa;AAAA,IAC1B;AAAA,EACF;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF,GArQ8B;AAuQ9B,MAAM,cAAc,wBAClB,SACA,cACA,OACA,OACA,oBACA,sBACc;AACd,QAAM,WAAsB,CAAC;AAC7B,aAAW,OAAO,SAAS;AACzB,UAAM,MAAM,QAAQ;AACpB,UAAM,MAAM,aAAa,WACvB,KACA,KACA,OACA,OACA,cACA,oBACA,iBACF;AACA,UAAM,WAAW,QAAQ,QAAQ,CAAC,MAAM,CAAC,CAAC,KAAK,GAAG,CAAC,IAAI,OAAO,QAAQ,GAAG;AACzE,eAAW,CAAC,MAAM,SAAS,UAAU;AACnC,UAAI,QAAQ,oCAAqB;AAC/B,2CAAe,UAAU,MAAM,IAAI;AAAA,MACrC,OAAO;AACL,iBAAS,QAAQ;AAAA,MACnB;AAAA,IACF;AAAA,EACF;AACA,uBAAqB,QAAQ;AAC7B,SAAO;AACT,GA/BoB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -59,17 +59,18 @@ function updateInserted() {
|
|
|
59
59
|
for (let i = 0; i < sheets.length; i++) {
|
|
60
60
|
const rules = sheets[i].cssRules;
|
|
61
61
|
const firstRule = rules[0];
|
|
62
|
-
if (!firstRule)
|
|
62
|
+
if (!(firstRule instanceof CSSStyleRule))
|
|
63
63
|
continue;
|
|
64
|
-
const firstSelector = firstRule
|
|
64
|
+
const firstSelector = firstRule.selectorText;
|
|
65
65
|
if (!firstSelector)
|
|
66
66
|
continue;
|
|
67
67
|
if (firstSelector === ":root" || firstSelector.startsWith("._")) {
|
|
68
|
-
for (
|
|
69
|
-
|
|
68
|
+
for (let i2 = 0; i2 < rules.length; i2++) {
|
|
69
|
+
const rule = rules.item(i2);
|
|
70
|
+
if (!(rule instanceof CSSStyleRule))
|
|
70
71
|
continue;
|
|
71
72
|
const identifier = rule.selectorText.slice(1);
|
|
72
|
-
allSelectors[identifier] = true;
|
|
73
|
+
allSelectors[identifier] = process.env.NODE_ENV === "development" ? rule.cssText : true;
|
|
73
74
|
if (identifier.startsWith("_transform")) {
|
|
74
75
|
addTransform(identifier, rule.cssText);
|
|
75
76
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/insertStyleRule.tsx"],
|
|
4
|
-
"sourcesContent": ["// this needs to check if its inserted already? 99% of the time it is\n// this should avoid re-inserts, but need to test the perf trade-offs\n// i tested with the site itself and the initial insert was trivial\n\nconst allSelectors = {}\nconst insertedSelectors = {}\nexport const insertedTransforms = {}\n\nexport const getAllSelectors = () => allSelectors\nexport const getInsertedRules = () => Object.values(insertedSelectors)\nexport const getAllTransforms = () => insertedTransforms\n\n// keep transforms in map for merging later\nfunction addTransform(identifier: string, rule: string) {\n const s = rule.indexOf('transform:')\n if (s === -1) {\n console.error(`not a transform ${identifier} ${rule}`)\n return\n }\n const startI = s + 'transform:'.length\n const endI = rule.indexOf(';')\n const value = rule.slice(startI, endI)\n insertedTransforms[identifier] = value\n}\n\n// gets existing ones (client side)\n// takes ~0.1ms for a fairly large page\n// used now for three things:\n// 1. debugging at dev time\n// 2. avoid duplicate insert styles at runtime\n// 3. used now for merging transforms atomically\nlet hasInsertedSinceUpdate = true\nexport function updateInserted() {\n if (typeof document === 'undefined') {\n return\n }\n if (!hasInsertedSinceUpdate) {\n console.warn('hasnt inserted since')\n return\n }\n const sheets = document.styleSheets\n if (!sheets) return\n for (let i = 0; i < sheets.length; i++) {\n const rules = sheets[i].cssRules\n const firstRule = rules[0]\n if (!firstRule) continue\n const firstSelector = firstRule
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA,MAAM,eAAe,CAAC;AACtB,MAAM,oBAAoB,CAAC;AACpB,MAAM,qBAAqB,CAAC;AAE5B,MAAM,kBAAkB,6BAAM,cAAN;AACxB,MAAM,mBAAmB,6BAAM,OAAO,OAAO,iBAAiB,GAArC;AACzB,MAAM,mBAAmB,6BAAM,oBAAN;AAGhC,sBAAsB,YAAoB,MAAc;AACtD,QAAM,IAAI,KAAK,QAAQ,YAAY;AACnC,MAAI,MAAM,IAAI;AACZ,YAAQ,MAAM,mBAAmB,cAAc,MAAM;AACrD;AAAA,EACF;AACA,QAAM,SAAS,IAAI,aAAa;AAChC,QAAM,OAAO,KAAK,QAAQ,GAAG;AAC7B,QAAM,QAAQ,KAAK,MAAM,QAAQ,IAAI;AACrC,qBAAmB,cAAc;AACnC;AAVS;AAkBT,IAAI,yBAAyB;AACtB,0BAA0B;AAC/B,MAAI,OAAO,aAAa,aAAa;AACnC;AAAA,EACF;AACA,MAAI,CAAC,wBAAwB;AAC3B,YAAQ,KAAK,sBAAsB;AACnC;AAAA,EACF;AACA,QAAM,SAAS,SAAS;AACxB,MAAI,CAAC;AAAQ;AACb,WAAS,IAAI,GAAG,IAAI,OAAO,QAAQ,KAAK;AACtC,UAAM,QAAQ,OAAO,GAAG;AACxB,UAAM,YAAY,MAAM;AACxB,QAAI,
|
|
4
|
+
"sourcesContent": ["// this needs to check if its inserted already? 99% of the time it is\n// this should avoid re-inserts, but need to test the perf trade-offs\n// i tested with the site itself and the initial insert was trivial\n\nconst allSelectors = {}\nconst insertedSelectors = {}\nexport const insertedTransforms = {}\n\nexport const getAllSelectors = () => allSelectors\nexport const getInsertedRules = () => Object.values(insertedSelectors)\nexport const getAllTransforms = () => insertedTransforms\n\n// keep transforms in map for merging later\nfunction addTransform(identifier: string, rule: string) {\n const s = rule.indexOf('transform:')\n if (s === -1) {\n console.error(`not a transform ${identifier} ${rule}`)\n return\n }\n const startI = s + 'transform:'.length\n const endI = rule.indexOf(';')\n const value = rule.slice(startI, endI)\n insertedTransforms[identifier] = value\n}\n\n// gets existing ones (client side)\n// takes ~0.1ms for a fairly large page\n// used now for three things:\n// 1. debugging at dev time\n// 2. avoid duplicate insert styles at runtime\n// 3. used now for merging transforms atomically\nlet hasInsertedSinceUpdate = true\nexport function updateInserted() {\n if (typeof document === 'undefined') {\n return\n }\n if (!hasInsertedSinceUpdate) {\n console.warn('hasnt inserted since')\n return\n }\n const sheets = document.styleSheets\n if (!sheets) return\n for (let i = 0; i < sheets.length; i++) {\n const rules = sheets[i].cssRules\n const firstRule = rules[0]\n if (!(firstRule instanceof CSSStyleRule)) continue\n const firstSelector = firstRule.selectorText\n if (!firstSelector) continue\n if (firstSelector === ':root' || firstSelector.startsWith('._')) {\n for (let i = 0; i < rules.length; i++) {\n const rule = rules.item(i)\n if (!(rule instanceof CSSStyleRule)) continue\n const identifier = rule.selectorText.slice(1)\n allSelectors[identifier] = process.env.NODE_ENV === 'development' ? rule.cssText : true\n if (identifier.startsWith('_transform')) {\n addTransform(identifier, rule.cssText)\n }\n }\n }\n }\n hasInsertedSinceUpdate = false\n}\n\nupdateInserted()\n\nconst newRulesStyleTag =\n typeof document !== 'undefined'\n ? document.head.appendChild(document.createElement('style'))\n : null\n\nexport function insertStyleRule(identifier: string, rule: string) {\n if (allSelectors[identifier]) {\n return\n }\n hasInsertedSinceUpdate = true\n insertedSelectors[identifier] = rule\n allSelectors[identifier] = process.env.NODE_ENV === 'development' ? rule : true\n if (identifier.startsWith('_transform')) {\n addTransform(identifier, rule)\n }\n if (!newRulesStyleTag) {\n return\n }\n const sheet = newRulesStyleTag.sheet!\n sheet.insertRule(rule, sheet.cssRules.length)\n return identifier\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA,MAAM,eAAe,CAAC;AACtB,MAAM,oBAAoB,CAAC;AACpB,MAAM,qBAAqB,CAAC;AAE5B,MAAM,kBAAkB,6BAAM,cAAN;AACxB,MAAM,mBAAmB,6BAAM,OAAO,OAAO,iBAAiB,GAArC;AACzB,MAAM,mBAAmB,6BAAM,oBAAN;AAGhC,sBAAsB,YAAoB,MAAc;AACtD,QAAM,IAAI,KAAK,QAAQ,YAAY;AACnC,MAAI,MAAM,IAAI;AACZ,YAAQ,MAAM,mBAAmB,cAAc,MAAM;AACrD;AAAA,EACF;AACA,QAAM,SAAS,IAAI,aAAa;AAChC,QAAM,OAAO,KAAK,QAAQ,GAAG;AAC7B,QAAM,QAAQ,KAAK,MAAM,QAAQ,IAAI;AACrC,qBAAmB,cAAc;AACnC;AAVS;AAkBT,IAAI,yBAAyB;AACtB,0BAA0B;AAC/B,MAAI,OAAO,aAAa,aAAa;AACnC;AAAA,EACF;AACA,MAAI,CAAC,wBAAwB;AAC3B,YAAQ,KAAK,sBAAsB;AACnC;AAAA,EACF;AACA,QAAM,SAAS,SAAS;AACxB,MAAI,CAAC;AAAQ;AACb,WAAS,IAAI,GAAG,IAAI,OAAO,QAAQ,KAAK;AACtC,UAAM,QAAQ,OAAO,GAAG;AACxB,UAAM,YAAY,MAAM;AACxB,QAAI,CAAE,sBAAqB;AAAe;AAC1C,UAAM,gBAAgB,UAAU;AAChC,QAAI,CAAC;AAAe;AACpB,QAAI,kBAAkB,WAAW,cAAc,WAAW,IAAI,GAAG;AAC/D,eAAS,KAAI,GAAG,KAAI,MAAM,QAAQ,MAAK;AACrC,cAAM,OAAO,MAAM,KAAK,EAAC;AACzB,YAAI,CAAE,iBAAgB;AAAe;AACrC,cAAM,aAAa,KAAK,aAAa,MAAM,CAAC;AAC5C,qBAAa,cAAc,QAAQ,IAAI,aAAa,gBAAgB,KAAK,UAAU;AACnF,YAAI,WAAW,WAAW,YAAY,GAAG;AACvC,uBAAa,YAAY,KAAK,OAAO;AAAA,QACvC;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACA,2BAAyB;AAC3B;AA7BgB;AA+BhB,eAAe;AAEf,MAAM,mBACJ,OAAO,aAAa,cAChB,SAAS,KAAK,YAAY,SAAS,cAAc,OAAO,CAAC,IACzD;AAEC,yBAAyB,YAAoB,MAAc;AAChE,MAAI,aAAa,aAAa;AAC5B;AAAA,EACF;AACA,2BAAyB;AACzB,oBAAkB,cAAc;AAChC,eAAa,cAAc,QAAQ,IAAI,aAAa,gBAAgB,OAAO;AAC3E,MAAI,WAAW,WAAW,YAAY,GAAG;AACvC,iBAAa,YAAY,IAAI;AAAA,EAC/B;AACA,MAAI,CAAC,kBAAkB;AACrB;AAAA,EACF;AACA,QAAM,QAAQ,iBAAiB;AAC/B,QAAM,WAAW,MAAM,MAAM,SAAS,MAAM;AAC5C,SAAO;AACT;AAhBgB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -98,17 +98,22 @@ function loadAnimationFeature() {
|
|
|
98
98
|
console.error("no useAnimations hook provided");
|
|
99
99
|
return null;
|
|
100
100
|
}
|
|
101
|
-
const
|
|
102
|
-
const
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
101
|
+
const propsWithAnimation = props;
|
|
102
|
+
const styleKey = JSON.stringify(style);
|
|
103
|
+
const res = useAnimations(propsWithAnimation, {
|
|
104
|
+
styleKey,
|
|
105
|
+
style: style || {},
|
|
106
|
+
state,
|
|
107
|
+
pseudos,
|
|
108
|
+
mergedStyles(props2) {
|
|
109
|
+
return __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, style), state.hover && pseudos.hoverStyle), state.focus && pseudos.focusStyle), state.press && pseudos.pressStyle), (props2 == null ? void 0 : props2.isExiting) && pseudos.exitStyle);
|
|
110
|
+
}
|
|
106
111
|
});
|
|
107
112
|
(0, import_platform.useIsomorphicLayoutEffect)(() => {
|
|
108
113
|
setStateShallow({
|
|
109
114
|
animation: res
|
|
110
115
|
});
|
|
111
|
-
}, [
|
|
116
|
+
}, [styleKey]);
|
|
112
117
|
return null;
|
|
113
118
|
},
|
|
114
119
|
propNames: ["animation"]
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hooks/useFeatures.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from 'react'\nimport { ViewStyle } from 'react-native'\n\nimport { isWeb, useIsomorphicLayoutEffect } from '../constants/platform'\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAGlB,sBAAiD;
|
|
4
|
+
"sourcesContent": ["import React from 'react'\nimport { ViewStyle } from 'react-native'\n\nimport { isWeb, useIsomorphicLayoutEffect } from '../constants/platform'\nimport { PseudoStyles } from '../static'\nimport { TamaguiComponentState, UseAnimationHook, UseAnimationProps } from '../types'\nimport { addMediaQueryListener, mediaState, removeMediaQueryListener } from './useMedia'\n\ntype FeatureDefinition = {\n isEnabled: (props: any) => boolean\n Component: any\n}\n\ntype FeatureUtils = {\n forceUpdate: Function\n state: TamaguiComponentState\n setStateShallow: (next: Partial<TamaguiComponentState>) => void\n useAnimations?: UseAnimationHook\n pseudos: PseudoStyles\n style: ViewStyle | null | undefined\n}\n\nconst createDefinition = ({\n Component,\n propNames,\n}: {\n Component: (props: { _utils: FeatureUtils; [key: string]: any }) => void\n propNames: string[]\n}): FeatureDefinition => ({\n isEnabled: (props: any) => propNames.some((name) => !!props[name]),\n Component,\n})\n\nlet featureDefinitions: Record<string, FeatureDefinition> | null = null\n\nexport const useFeatures = (props: any, utils?: FeatureUtils) => {\n if (!featureDefinitions) {\n featureDefinitions = loadFeatures()\n }\n const features: JSX.Element[] = []\n for (const name in featureDefinitions) {\n const { isEnabled, Component } = featureDefinitions[name]\n if (isEnabled(props) && Component) {\n features.push(<Component key={name} {...props} _utils={utils} />)\n }\n }\n return features\n}\n\nfunction loadFeatures(): Record<string, FeatureDefinition> {\n return {\n // loads animations and sets state with the results\n animation: loadAnimationFeature(),\n\n // will update the parent whenever media query changes\n // no need on web, media queries are inserted and run in css\n ...(!isWeb && {\n mediaQuery: loadMediaQueryFeature(),\n }),\n }\n}\n\nfunction loadAnimationFeature() {\n return createDefinition({\n Component: ({ _utils, ...props }) => {\n const { state, useAnimations, pseudos, style, setStateShallow } = _utils\n\n if (!useAnimations) {\n console.error('no useAnimations hook provided')\n return null\n }\n\n // const animatedStyleIn =\n\n // we always have .animation set\n const propsWithAnimation = props as UseAnimationProps\n const styleKey = JSON.stringify(style)\n\n const res = useAnimations(propsWithAnimation, {\n styleKey,\n style: style || {},\n state,\n pseudos,\n mergedStyles(props) {\n return {\n ...style,\n ...(state.hover && pseudos.hoverStyle),\n ...(state.focus && pseudos.focusStyle),\n ...(state.press && pseudos.pressStyle),\n ...(props?.isExiting && pseudos.exitStyle),\n }\n },\n // onDidAnimate, delay\n })\n\n useIsomorphicLayoutEffect(() => {\n setStateShallow({\n animation: res,\n })\n }, [styleKey])\n\n return null\n },\n propNames: ['animation'],\n })\n}\n\nfunction loadMediaQueryFeature() {\n const mediaPropNames = Object.keys(mediaState)\n\n return createDefinition({\n Component: (props: any) => {\n const keys = mediaPropNames.flatMap((x) => (x in props ? x.slice(1) : []))\n\n useIsomorphicLayoutEffect(() => {\n for (const key of keys) {\n addMediaQueryListener(key, props._utils.forceUpdate)\n }\n return () => {\n for (const key of keys) {\n removeMediaQueryListener(key, props._utils.forceUpdate)\n }\n }\n }, [keys.join(',')])\n\n return null\n },\n propNames: mediaPropNames,\n })\n}\n\n// TODO\n// measureLayout: createDefinition({\n// Component: (props) => {\n// console.log('measure', props)\n// return null\n// },\n// propNames: ['onLayout'],\n// }),\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAGlB,sBAAiD;AAGjD,sBAA4E;AAgB5E,MAAM,mBAAmB,wBAAC;AAAA,EACxB;AAAA,EACA;AAAA,MAIwB;AAAA,EACxB,WAAW,CAAC,UAAe,UAAU,KAAK,CAAC,SAAS,CAAC,CAAC,MAAM,KAAK;AAAA,EACjE;AACF,IATyB;AAWzB,IAAI,qBAA+D;AAE5D,MAAM,cAAc,wBAAC,OAAY,UAAyB;AAC/D,MAAI,CAAC,oBAAoB;AACvB,yBAAqB,aAAa;AAAA,EACpC;AACA,QAAM,WAA0B,CAAC;AACjC,aAAW,QAAQ,oBAAoB;AACrC,UAAM,EAAE,WAAW,cAAc,mBAAmB;AACpD,QAAI,UAAU,KAAK,KAAK,WAAW;AACjC,eAAS,KAAK,mDAAC;AAAA,QAAU,KAAK;AAAA,SAAU,QAAzB;AAAA,QAAgC,QAAQ;AAAA,QAAO,CAAE;AAAA,IAClE;AAAA,EACF;AACA,SAAO;AACT,GAZ2B;AAc3B,wBAA2D;AACzD,SAAO;AAAA,IAEL,WAAW,qBAAqB;AAAA,KAI5B,CAAC,yBAAS;AAAA,IACZ,YAAY,sBAAsB;AAAA,EACpC;AAEJ;AAXS;AAaT,gCAAgC;AAC9B,SAAO,iBAAiB;AAAA,IACtB,WAAW,CAAC,OAAyB;AAAzB,mBAAE,aAAF,IAAa,kBAAb,IAAa,CAAX;AACZ,YAAM,EAAE,OAAO,eAAe,SAAS,OAAO,oBAAoB;AAElE,UAAI,CAAC,eAAe;AAClB,gBAAQ,MAAM,gCAAgC;AAC9C,eAAO;AAAA,MACT;AAKA,YAAM,qBAAqB;AAC3B,YAAM,WAAW,KAAK,UAAU,KAAK;AAErC,YAAM,MAAM,cAAc,oBAAoB;AAAA,QAC5C;AAAA,QACA,OAAO,SAAS,CAAC;AAAA,QACjB;AAAA,QACA;AAAA,QACA,aAAa,QAAO;AAClB,iBAAO,+EACF,QACC,MAAM,SAAS,QAAQ,aACvB,MAAM,SAAS,QAAQ,aACvB,MAAM,SAAS,QAAQ,aACvB,kCAAO,cAAa,QAAQ;AAAA,QAEpC;AAAA,MAEF,CAAC;AAED,qDAA0B,MAAM;AAC9B,wBAAgB;AAAA,UACd,WAAW;AAAA,QACb,CAAC;AAAA,MACH,GAAG,CAAC,QAAQ,CAAC;AAEb,aAAO;AAAA,IACT;AAAA,IACA,WAAW,CAAC,WAAW;AAAA,EACzB,CAAC;AACH;AA3CS;AA6CT,iCAAiC;AAC/B,QAAM,iBAAiB,OAAO,KAAK,0BAAU;AAE7C,SAAO,iBAAiB;AAAA,IACtB,WAAW,CAAC,UAAe;AACzB,YAAM,OAAO,eAAe,QAAQ,CAAC,MAAO,KAAK,QAAQ,EAAE,MAAM,CAAC,IAAI,CAAC,CAAE;AAEzE,qDAA0B,MAAM;AAC9B,mBAAW,OAAO,MAAM;AACtB,qDAAsB,KAAK,MAAM,OAAO,WAAW;AAAA,QACrD;AACA,eAAO,MAAM;AACX,qBAAW,OAAO,MAAM;AACtB,0DAAyB,KAAK,MAAM,OAAO,WAAW;AAAA,UACxD;AAAA,QACF;AAAA,MACF,GAAG,CAAC,KAAK,KAAK,GAAG,CAAC,CAAC;AAEnB,aAAO;AAAA,IACT;AAAA,IACA,WAAW;AAAA,EACb,CAAC;AACH;AAtBS;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/styled.js
CHANGED
|
@@ -1,11 +1,9 @@
|
|
|
1
|
-
var __create = Object.create;
|
|
2
1
|
var __defProp = Object.defineProperty;
|
|
3
2
|
var __defProps = Object.defineProperties;
|
|
4
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
4
|
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
6
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
6
|
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
8
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
9
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
8
|
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
11
9
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
@@ -46,24 +44,16 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
46
44
|
}
|
|
47
45
|
return to;
|
|
48
46
|
};
|
|
49
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
|
|
50
47
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
51
48
|
var styled_exports = {};
|
|
52
49
|
__export(styled_exports, {
|
|
53
50
|
styled: () => styled
|
|
54
51
|
});
|
|
55
52
|
module.exports = __toCommonJS(styled_exports);
|
|
56
|
-
var ReactNative = __toESM(require("react-native"));
|
|
57
53
|
var import_react_native = require("react-native");
|
|
58
54
|
var import_createComponent = require("./createComponent");
|
|
59
55
|
var import_extendStaticConfig = require("./helpers/extendStaticConfig");
|
|
60
|
-
|
|
61
|
-
for (const key of ["Image", "TextInput", "Text", "View"]) {
|
|
62
|
-
const val = ReactNative[key];
|
|
63
|
-
if (val && typeof val === "object") {
|
|
64
|
-
RNComponents.set(val, true);
|
|
65
|
-
}
|
|
66
|
-
}
|
|
56
|
+
var import_RNComponents = require("./helpers/RNComponents");
|
|
67
57
|
function styled(Component, options, staticExtractionOptions) {
|
|
68
58
|
const staticConfigProps = (() => {
|
|
69
59
|
if (options) {
|
|
@@ -71,7 +61,7 @@ function styled(Component, options, staticExtractionOptions) {
|
|
|
71
61
|
if (defaultVariants) {
|
|
72
62
|
Object.assign(defaultProps, defaultVariants);
|
|
73
63
|
}
|
|
74
|
-
const isReactNativeWeb = RNComponents.has(Component);
|
|
64
|
+
const isReactNativeWeb = import_RNComponents.RNComponents.has(Component);
|
|
75
65
|
const isTamagui = !isReactNativeWeb && "staticConfig" in Component;
|
|
76
66
|
const Comp = Component;
|
|
77
67
|
const isImage = !!(defaultProps.isImage || (!isTamagui ? Comp === import_react_native.Image : false));
|
package/dist/cjs/styled.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/styled.tsx"],
|
|
4
|
-
"sourcesContent": ["import
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import { Image, Text, TextInput } from 'react-native'\n\nimport { createComponent } from './createComponent'\nimport { extendStaticConfig } from './helpers/extendStaticConfig'\nimport { RNComponents } from './helpers/RNComponents'\nimport {\n GetProps,\n GetVariantProps,\n GetVariantValues,\n MediaProps,\n PseudoProps,\n StaticConfig,\n StylableComponent,\n TamaguiComponent,\n VariantDefinitions,\n} from './types'\n\nexport function styled<\n ParentComponent extends StylableComponent,\n // = VariantDefinitions<GetProps<ParentComponent>> gives type inference to variants: { true: { ... } }\n // but causes \"Type instantiation is excessively deep and possibly infinite.\"...\n Variants extends VariantDefinitions<{}> = {}\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 defaultVariants?: Variants extends Object ? GetVariantProps<Variants> : never\n },\n staticExtractionOptions?: StaticConfig\n) {\n const staticConfigProps = (() => {\n if (options) {\n const { variants, name, defaultVariants, ...defaultProps } = options\n if (defaultVariants) {\n Object.assign(defaultProps, defaultVariants)\n }\n const isReactNativeWeb = RNComponents.has(Component)\n const isTamagui = !isReactNativeWeb && 'staticConfig' in Component\n const Comp = Component as any\n const isImage = !!(defaultProps.isImage || (!isTamagui ? Comp === Image : false))\n const isInput = !!(defaultProps.isInput || (!isTamagui ? Comp === TextInput : false))\n const isText = !!(defaultProps.isText || (!isTamagui ? isInput || Comp === Text : false))\n const conf: StaticConfig = {\n ...staticExtractionOptions,\n ...(!isTamagui && {\n Component: Comp,\n }),\n isTamagui,\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 componentName: name,\n isReactNativeWeb,\n isInput,\n isText,\n isImage,\n }\n return conf\n }\n return {}\n })()\n const config = extendStaticConfig(Component, staticConfigProps)\n const component = createComponent(config!) // error is good here its on init\n\n // get parent props without pseudos and medias so we can rebuild both with new variants\n type ParentPropsBase = ParentComponent extends TamaguiComponent<any, any, infer P>\n ? P\n : GetProps<ParentComponent>\n type ParentVariants = ParentComponent extends TamaguiComponent<any, any, any, infer V>\n ? V\n : Object\n\n // sprinkle in our variants\n type OurVariants = Variants extends Object\n ? {\n [Key in keyof Variants]?: GetVariantValues<keyof Variants[Key]>\n }\n : {}\n\n type VariantProps = ParentVariants & OurVariants\n type OurPropsBase = ParentPropsBase & VariantProps\n\n type Props = Variants extends void | symbol\n ? GetProps<ParentComponent>\n : // start with base props\n OurPropsBase &\n // add in media (+ pseudos nested)\n MediaProps<OurPropsBase> &\n // add in pseudos\n PseudoProps<OurPropsBase>\n\n return component as TamaguiComponent<\n Props,\n // TODO infer ref\n any,\n ParentPropsBase,\n ParentVariants & OurVariants\n >\n}\n\n// type Merge<A, B> = Omit<A, keyof B> & B\n// import { Stack } from './views/Stack'\n// export const SizableText = styled(Stack, {\n// name: 'SizableText',\n// backgroundColor: 'red',\n// variants: {\n// size: {\n// '...fontSize': (val, { props }) => {\n// return {\n// backgroundColor: '',\n// }\n// },\n// },\n// },\n// })\n// export const Paragraph = styled(SizableText, {\n// name: 'Paragraph',\n// tag: 'p',\n// // variants: {\n// // another: {\n// // true: {}\n// // }\n// // }\n// })\n// export const Paragraph2 = styled(Paragraph, {\n// name: 'Paragraph',\n// tag: 'p',\n// variants: {\n// another: {\n// true: {\n// color: 'red'\n// },\n// }\n// }\n// })\n// const a = <SizableText size=\"$10\" />\n// const y = <Paragraph2 size=\"$10\" another />\n// export const SizableText2 = styled(SizableText, {\n// })\n// const xx = <SizableText2 abc />\n// export const Paragraph = styled(SizableText, {\n// name: 'Paragraph',\n// })\n// export const Heading = styled(Paragraph, {\n// tag: 'span',\n// margin: 0,\n// })\n// export const H2 = styled(Heading, {\n// name: 'H2',\n// })\n// const x = <H2 color=\"red\" />\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAAuC;AAEvC,6BAAgC;AAChC,gCAAmC;AACnC,0BAA6B;AAatB,gBAML,WAEA,SAKA,yBACA;AACA,QAAM,oBAAqB,OAAM;AAC/B,QAAI,SAAS;AACX,YAA6D,cAArD,YAAU,MAAM,oBAAqC,IAAjB,yBAAiB,IAAjB,CAApC,YAAU,QAAM;AACxB,UAAI,iBAAiB;AACnB,eAAO,OAAO,cAAc,eAAe;AAAA,MAC7C;AACA,YAAM,mBAAmB,iCAAa,IAAI,SAAS;AACnD,YAAM,YAAY,CAAC,oBAAoB,kBAAkB;AACzD,YAAM,OAAO;AACb,YAAM,UAAU,CAAC,CAAE,cAAa,WAAY,EAAC,YAAY,SAAS,4BAAQ;AAC1E,YAAM,UAAU,CAAC,CAAE,cAAa,WAAY,EAAC,YAAY,SAAS,gCAAY;AAC9E,YAAM,SAAS,CAAC,CAAE,cAAa,UAAW,EAAC,YAAY,WAAW,SAAS,2BAAO;AAClF,YAAM,OAAqB,gDACtB,0BACC,CAAC,aAAa;AAAA,QAChB,WAAW;AAAA,MACb,IAJyB;AAAA,QAKzB;AAAA,QAGA;AAAA,QACA;AAAA,QACA,eAAe;AAAA,QACf;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AACA,aAAO;AAAA,IACT;AACA,WAAO,CAAC;AAAA,EACV,GAAG;AACH,QAAM,SAAS,kDAAmB,WAAW,iBAAiB;AAC9D,QAAM,YAAY,4CAAgB,MAAO;AA6BzC,SAAO;AAOT;AApFgB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/types-rnw.tsx"],
|
|
4
|
-
"sourcesContent": ["// The following list is sourced from:\n// - https://github.com/necolas/react-native-web/blob/0.17.5/packages/react-native-web/src/types/styles.js#L76\ntype RNWCursorValue =\n | 'alias'\n | 'all-scroll'\n | 'auto'\n | 'cell'\n | 'context-menu'\n | 'copy'\n | 'crosshair'\n | 'default'\n | 'grab'\n | 'grabbing'\n | 'help'\n | 'pointer'\n | 'progress'\n | 'wait'\n | 'text'\n | 'vertical-text'\n | 'move'\n | 'none'\n | 'no-drop'\n | 'not-allowed'\n | 'zoom-in'\n | 'zoom-out'\n | 'col-resize'\n | 'e-resize'\n | 'ew-resize'\n | 'n-resize'\n | 'ne-resize'\n | 'ns-resize'\n | 'nw-resize'\n | 'row-resize'\n | 's-resize'\n | 'se-resize'\n | 'sw-resize'\n | 'w-resize'\n | 'nesw-resize'\n | 'nwse-resize'\n\n// This list is the combination of the following two lists:\n// - https://github.com/necolas/react-native-web/blob/0.17.5/packages/react-native-web/src/modules/AccessibilityUtil/propsToAriaRole.js#L10\n// - https://github.com/necolas/react-native-web/blob/0.17.5/packages/react-native-web/src/modules/AccessibilityUtil/propsToAccessibilityComponent.js#L12\n// Plus the single hard-coded value \"label\" from here:\n// - https://github.com/necolas/react-native-web/blob/0.17.5/packages/react-native-web/src/modules/AccessibilityUtil/propsToAccessibilityComponent.js#L36\ntype RNWWebAccessibilityRole =\n | 'adjustable'\n | 'article'\n | 'banner'\n | 'blockquote'\n | 'button'\n | 'code'\n | 'complementary'\n | 'contentinfo'\n | 'deletion'\n | 'emphasis'\n | 'figure'\n | 'form'\n | 'header'\n | 'image'\n | 'imagebutton'\n | 'insertion'\n | 'keyboardkey'\n | 'label'\n | 'link'\n | 'list'\n | 'listitem'\n | 'main'\n | 'navigation'\n | 'none'\n | 'region'\n | 'search'\n | 'strong'\n | 'summary'\n | 'text'\n\ninterface PressableStateCallbackType {\n hovered?: boolean\n focused?: boolean\n}\n\nexport interface RNWViewProps {\n // our internal hack to pass className down (until styleq transition)\n dataSet?: any\n\n // TODO get proper types:\n target?: any\n rel?: any\n download?: any\n\n accessibilityRole?: RNWWebAccessibilityRole\n href?: string\n hrefAttrs?: {\n target?: '_blank' | '_self' | '_top' | 'blank' | 'self' | 'top'\n rel?: string\n download?: boolean\n }\n onMouseDown?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void\n onMouseUp?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void\n onMouseEnter?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void\n onMouseLeave?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void\n onFocus?: (event: React.FocusEvent<HTMLDivElement>) => void\n onScroll?: (event: React.UIEvent<HTMLDivElement, UIEvent>) => void\n // For compatibility with RNW internals\n onScrollShouldSetResponder?: unknown\n onScrollShouldSetResponderCapture?: unknown\n onSelectionChangeShouldSetResponder?: unknown\n onSelectionChangeShouldSetResponderCapture?: unknown\n}\n\nexport interface RNWTextProps {\n dir?: 'ltr' | 'rtl' | 'auto'\n focusable?: boolean\n accessibilityRole?: RNWWebAccessibilityRole\n accessibilityState?: {\n busy?: boolean\n checked?: boolean | 'mixed'\n disabled?: boolean\n expanded?: boolean\n grabbed?: boolean\n hidden?: boolean\n invalid?: boolean\n pressed?: boolean\n readonly?: boolean\n required?: boolean\n selected?: boolean\n }\n href?: string\n hrefAttrs?: {\n
|
|
4
|
+
"sourcesContent": ["// The following list is sourced from:\n// - https://github.com/necolas/react-native-web/blob/0.17.5/packages/react-native-web/src/types/styles.js#L76\ntype RNWCursorValue =\n | 'alias'\n | 'all-scroll'\n | 'auto'\n | 'cell'\n | 'context-menu'\n | 'copy'\n | 'crosshair'\n | 'default'\n | 'grab'\n | 'grabbing'\n | 'help'\n | 'pointer'\n | 'progress'\n | 'wait'\n | 'text'\n | 'vertical-text'\n | 'move'\n | 'none'\n | 'no-drop'\n | 'not-allowed'\n | 'zoom-in'\n | 'zoom-out'\n | 'col-resize'\n | 'e-resize'\n | 'ew-resize'\n | 'n-resize'\n | 'ne-resize'\n | 'ns-resize'\n | 'nw-resize'\n | 'row-resize'\n | 's-resize'\n | 'se-resize'\n | 'sw-resize'\n | 'w-resize'\n | 'nesw-resize'\n | 'nwse-resize'\n\n// This list is the combination of the following two lists:\n// - https://github.com/necolas/react-native-web/blob/0.17.5/packages/react-native-web/src/modules/AccessibilityUtil/propsToAriaRole.js#L10\n// - https://github.com/necolas/react-native-web/blob/0.17.5/packages/react-native-web/src/modules/AccessibilityUtil/propsToAccessibilityComponent.js#L12\n// Plus the single hard-coded value \"label\" from here:\n// - https://github.com/necolas/react-native-web/blob/0.17.5/packages/react-native-web/src/modules/AccessibilityUtil/propsToAccessibilityComponent.js#L36\ntype RNWWebAccessibilityRole =\n | 'adjustable'\n | 'article'\n | 'banner'\n | 'blockquote'\n | 'button'\n | 'code'\n | 'complementary'\n | 'contentinfo'\n | 'deletion'\n | 'emphasis'\n | 'figure'\n | 'form'\n | 'header'\n | 'image'\n | 'imagebutton'\n | 'insertion'\n | 'keyboardkey'\n | 'label'\n | 'link'\n | 'list'\n | 'listitem'\n | 'main'\n | 'navigation'\n | 'none'\n | 'region'\n | 'search'\n | 'strong'\n | 'summary'\n | 'text'\n\ninterface PressableStateCallbackType {\n hovered?: boolean\n focused?: boolean\n}\n\nexport interface RNWViewProps {\n // our internal hack to pass className down (until styleq transition)\n dataSet?: any\n\n // TODO get proper types:\n target?: any\n rel?: any\n download?: any\n\n accessibilityRole?: RNWWebAccessibilityRole\n href?: string\n hrefAttrs?: {\n target?: '_blank' | '_self' | '_top' | 'blank' | 'self' | 'top'\n rel?: string\n download?: boolean\n }\n onMouseDown?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void\n onMouseUp?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void\n onMouseEnter?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void\n onMouseLeave?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void\n onFocus?: (event: React.FocusEvent<HTMLDivElement>) => void\n onScroll?: (event: React.UIEvent<HTMLDivElement, UIEvent>) => void\n // For compatibility with RNW internals\n onScrollShouldSetResponder?: unknown\n onScrollShouldSetResponderCapture?: unknown\n onSelectionChangeShouldSetResponder?: unknown\n onSelectionChangeShouldSetResponderCapture?: unknown\n}\n\nexport interface RNWTextProps {\n dir?: 'ltr' | 'rtl' | 'auto'\n focusable?: boolean\n accessibilityRole?: RNWWebAccessibilityRole\n accessibilityState?: {\n busy?: boolean\n checked?: boolean | 'mixed'\n disabled?: boolean\n expanded?: boolean\n grabbed?: boolean\n hidden?: boolean\n invalid?: boolean\n pressed?: boolean\n readonly?: boolean\n required?: boolean\n selected?: boolean\n }\n href?: string\n // TODO hrefAttrs or come up with proper html escape hatch\n // hrefAttrs?: {\n // target?: '_blank' | '_self' | '_top' | 'blank' | 'self' | 'top'\n // rel?: string\n // download?: boolean\n // }\n onMouseEnter?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void\n onMouseLeave?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void\n onFocus?: (event: React.FocusEvent<HTMLDivElement>) => void\n // For compatibility with RNW internals\n onMoveShouldSetResponder?: unknown\n onMoveShouldSetResponderCapture?: unknown\n onResponderEnd?: unknown\n onResponderGrant?: unknown\n onResponderMove?: unknown\n onResponderReject?: unknown\n onResponderRelease?: unknown\n onResponderStart?: unknown\n onResponderTerminate?: unknown\n onResponderTerminationRequest?: unknown\n onScrollShouldSetResponder?: unknown\n onScrollShouldSetResponderCapture?: unknown\n onSelectionChangeShouldSetResponder?: unknown\n onSelectionChangeShouldSetResponderCapture?: unknown\n onStartShouldSetResponder?: unknown\n onStartShouldSetResponderCapture?: unknown\n}\n\nexport interface RNWViewStyle {\n cursor?: RNWCursorValue\n transitionProperty?: string\n display?: 'flex' | 'inline-flex' | 'none'\n}\n\nexport interface RNWTextStyle {\n // The following list is sourced from:\n // - https://github.com/necolas/react-native-web/blob/0.17.5/packages/react-native-web/src/types/styles.js#L128\n userSelect?: 'all' | 'auto' | 'contain' | 'none' | 'text'\n}\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|