@tamagui/web 1.2.13 → 1.2.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/helpers/getStylesAtomic.js +4 -3
- package/dist/cjs/helpers/getStylesAtomic.js.map +2 -2
- package/dist/cjs/helpers/normalizeValueWithProperty.js +5 -5
- package/dist/cjs/helpers/normalizeValueWithProperty.js.map +2 -2
- package/dist/esm/helpers/getStylesAtomic.js +4 -3
- package/dist/esm/helpers/getStylesAtomic.js.map +2 -2
- package/dist/esm/helpers/getStylesAtomic.mjs +4 -3
- package/dist/esm/helpers/getStylesAtomic.mjs.map +2 -2
- package/dist/esm/helpers/normalizeValueWithProperty.js +5 -5
- package/dist/esm/helpers/normalizeValueWithProperty.js.map +2 -2
- package/dist/esm/helpers/normalizeValueWithProperty.mjs +5 -5
- package/dist/esm/helpers/normalizeValueWithProperty.mjs.map +2 -2
- package/package.json +9 -9
- package/src/helpers/getStylesAtomic.ts +4 -4
- package/src/helpers/normalizeValueWithProperty.ts +6 -5
- package/types/helpers/getStylesAtomic.d.ts.map +1 -1
- package/types/helpers/normalizeValueWithProperty.d.ts.map +1 -1
|
@@ -89,7 +89,7 @@ const generateAtomicStyles = (styleIn, pseudo) => {
|
|
|
89
89
|
styleToCSS(style);
|
|
90
90
|
const out = [];
|
|
91
91
|
for (const key in style) {
|
|
92
|
-
const value = style[key];
|
|
92
|
+
const value = (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(style[key], key);
|
|
93
93
|
if (value == null || value == void 0)
|
|
94
94
|
continue;
|
|
95
95
|
const hash = presetHashes[value] ? value : typeof value === "string" ? (0, import_helpers.simpleHash)(value) : `${value}`.replace(".", "dot");
|
|
@@ -111,12 +111,13 @@ const generateAtomicStyles = (styleIn, pseudo) => {
|
|
|
111
111
|
const presetHashes = {
|
|
112
112
|
none: true
|
|
113
113
|
};
|
|
114
|
-
const n = import_normalizeValueWithProperty.normalizeValueWithProperty;
|
|
115
114
|
function styleToCSS(style) {
|
|
116
115
|
const { shadowOffset, shadowRadius, shadowColor } = style;
|
|
117
116
|
if (style.shadowRadius !== void 0) {
|
|
118
117
|
const offset = shadowOffset || import_expandStyles.defaultOffset;
|
|
119
|
-
const shadow = `${
|
|
118
|
+
const shadow = `${(0, import_normalizeValueWithProperty.normalizeValueWithProperty)(
|
|
119
|
+
offset.width
|
|
120
|
+
)} ${(0, import_normalizeValueWithProperty.normalizeValueWithProperty)(offset.height)} ${(0, import_normalizeValueWithProperty.normalizeValueWithProperty)(
|
|
120
121
|
shadowRadius
|
|
121
122
|
)} ${shadowColor}`;
|
|
122
123
|
style.boxShadow = style.boxShadow ? `${style.boxShadow}, ${shadow}` : shadow;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/getStylesAtomic.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * Some parts adapted from react-native-web\n * Copyright (c) Nicolas Gallagher licensed under the MIT license.\n */\n\nimport { StyleObject, simpleHash } from '@tamagui/helpers'\nimport type { TextStyle, ViewStyle } from 'react-native'\n\nimport { getConfig } from '../config'\nimport { TamaguiInternalConfig } from '../types'\nimport { defaultOffset } from './expandStyles'\nimport { normalizeValueWithProperty } from './normalizeValueWithProperty.js'\nimport { PseudoDescriptor, pseudoDescriptors } from './pseudoDescriptors'\n\n// refactor this file away next...\n\ntype ViewOrTextStyle = ViewStyle | TextStyle\n\nexport type ViewStyleWithPseudos = ViewOrTextStyle & {\n hoverStyle?: ViewOrTextStyle\n pressStyle?: ViewOrTextStyle\n focusStyle?: ViewOrTextStyle\n}\n\n// matching order of the below *0\nconst pseudosOrdered = [\n pseudoDescriptors.hoverStyle,\n pseudoDescriptors.pressStyle,\n pseudoDescriptors.focusStyle,\n]\n\nexport function getStylesAtomic(stylesIn: ViewStyleWithPseudos) {\n // performance optimization\n if (!(stylesIn.hoverStyle || stylesIn.pressStyle || stylesIn.focusStyle)) {\n return getAtomicStyle(stylesIn)\n }\n\n // only for pseudos\n const { hoverStyle, pressStyle, focusStyle, ...base } = stylesIn\n let res: StyleObject[] = []\n // *1 order matched to *0\n for (const [index, style] of [hoverStyle, pressStyle, focusStyle, base].entries()) {\n if (!style) continue\n const pseudo = pseudosOrdered[index]\n res = [...res, ...getAtomicStyle(style, pseudo)]\n }\n return res\n}\n\nconst cache = new Map()\n\nexport function getAtomicStyle(\n style: ViewOrTextStyle,\n pseudo?: PseudoDescriptor\n): StyleObject[] {\n if (!style) return []\n const key = JSON.stringify(style) + (pseudo ? JSON.stringify(pseudo) : '')\n if (cache.has(key)) {\n return cache.get(key)\n }\n if (cache.size > 800) {\n cache.clear()\n }\n if (process.env.NODE_ENV === 'development') {\n if (!style || typeof style !== 'object') {\n throw new Error(`Wrong style type: \"${typeof style}\": ${style}`)\n }\n }\n const out = generateAtomicStyles(style, pseudo)\n cache.set(key, out)\n return out\n}\n\nlet conf: TamaguiInternalConfig\n\nconst generateAtomicStyles = (\n styleIn: ViewStyle & TextStyle,\n pseudo?: PseudoDescriptor\n): StyleObject[] => {\n conf = conf || getConfig()\n\n // were converting to css styles\n const style = styleIn as Record<string, string | null | undefined>\n\n // transform\n if (style.transform && Array.isArray(style.transform)) {\n style.transform = style.transform\n .map(\n // { scale: 2 } => 'scale(2)'\n // { translateX: 20 } => 'translateX(20px)'\n // { matrix: [1,2,3,4,5,6] } => 'matrix(1,2,3,4,5,6)'\n (transform) => {\n const type = Object.keys(transform)[0]\n const value = transform[type]\n if (type === 'matrix' || type === 'matrix3d') {\n return `${type}(${value.join(',')})`\n }\n return `${type}(${normalizeValueWithProperty(value, type)})`\n }\n )\n .join(' ')\n }\n\n styleToCSS(style)\n\n const out: StyleObject[] = []\n for (const key in style) {\n const value = style[key]\n if (value == null || value == undefined) continue\n const hash = presetHashes[value]\n ? value\n : typeof value === 'string'\n ? simpleHash(value)\n : `${value}`.replace('.', 'dot')\n\n const pseudoPrefix = pseudo ? `0${pseudo.name}-` : ''\n const shortProp = conf.inverseShorthands[key] || key\n const identifier = `_${shortProp}-${pseudoPrefix}${hash}`\n const rules = createAtomicRules(identifier, key, value, pseudo)\n const styleObject: StyleObject = {\n property: key,\n pseudo: pseudo?.name as any,\n value,\n identifier,\n rules,\n }\n out.push(styleObject)\n }\n\n return out\n}\n\nconst presetHashes = {\n none: true,\n}\n\
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA,qBAAwC;AAGxC,oBAA0B;AAE1B,0BAA8B;AAC9B,wCAA2C;AAC3C,+BAAoD;AAapD,MAAM,iBAAiB;AAAA,EACrB,2CAAkB;AAAA,EAClB,2CAAkB;AAAA,EAClB,2CAAkB;AACpB;AAEO,SAAS,gBAAgB,UAAgC;AAE9D,MAAI,EAAE,SAAS,cAAc,SAAS,cAAc,SAAS,aAAa;AACxE,WAAO,eAAe,QAAQ;AAAA,EAChC;AAGA,QAAM,EAAE,YAAY,YAAY,YAAY,GAAG,KAAK,IAAI;AACxD,MAAI,MAAqB,CAAC;AAE1B,aAAW,CAAC,OAAO,KAAK,KAAK,CAAC,YAAY,YAAY,YAAY,IAAI,EAAE,QAAQ,GAAG;AACjF,QAAI,CAAC;AAAO;AACZ,UAAM,SAAS,eAAe,KAAK;AACnC,UAAM,CAAC,GAAG,KAAK,GAAG,eAAe,OAAO,MAAM,CAAC;AAAA,EACjD;AACA,SAAO;AACT;AAEA,MAAM,QAAQ,oBAAI,IAAI;AAEf,SAAS,eACd,OACA,QACe;AACf,MAAI,CAAC;AAAO,WAAO,CAAC;AACpB,QAAM,MAAM,KAAK,UAAU,KAAK,KAAK,SAAS,KAAK,UAAU,MAAM,IAAI;AACvE,MAAI,MAAM,IAAI,GAAG,GAAG;AAClB,WAAO,MAAM,IAAI,GAAG;AAAA,EACtB;AACA,MAAI,MAAM,OAAO,KAAK;AACpB,UAAM,MAAM;AAAA,EACd;AACA,MAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,QAAI,CAAC,SAAS,OAAO,UAAU,UAAU;AACvC,YAAM,IAAI,MAAM,sBAAsB,OAAO,WAAW,OAAO;AAAA,IACjE;AAAA,EACF;AACA,QAAM,MAAM,qBAAqB,OAAO,MAAM;AAC9C,QAAM,IAAI,KAAK,GAAG;AAClB,SAAO;AACT;AAEA,IAAI;AAEJ,MAAM,uBAAuB,CAC3B,SACA,WACkB;AAClB,SAAO,YAAQ,yBAAU;AAGzB,QAAM,QAAQ;AAGd,MAAI,MAAM,aAAa,MAAM,QAAQ,MAAM,SAAS,GAAG;AACrD,UAAM,YAAY,MAAM,UACrB;AAAA;AAAA;AAAA;AAAA,MAIC,CAAC,cAAc;AACb,cAAM,OAAO,OAAO,KAAK,SAAS,EAAE,CAAC;AACrC,cAAM,QAAQ,UAAU,IAAI;AAC5B,YAAI,SAAS,YAAY,SAAS,YAAY;AAC5C,iBAAO,GAAG,QAAQ,MAAM,KAAK,GAAG;AAAA,QAClC;AACA,eAAO,GAAG,YAAQ,8DAA2B,OAAO,IAAI;AAAA,MAC1D;AAAA,IACF,EACC,KAAK,GAAG;AAAA,EACb;AAEA,aAAW,KAAK;AAEhB,QAAM,MAAqB,CAAC;AAC5B,aAAW,OAAO,OAAO;AACvB,UAAM,
|
|
4
|
+
"sourcesContent": ["/**\n * Some parts adapted from react-native-web\n * Copyright (c) Nicolas Gallagher licensed under the MIT license.\n */\n\nimport { StyleObject, simpleHash } from '@tamagui/helpers'\nimport type { TextStyle, ViewStyle } from 'react-native'\n\nimport { getConfig } from '../config'\nimport { TamaguiInternalConfig } from '../types'\nimport { defaultOffset } from './expandStyles'\nimport { normalizeValueWithProperty } from './normalizeValueWithProperty.js'\nimport { PseudoDescriptor, pseudoDescriptors } from './pseudoDescriptors'\n\n// refactor this file away next...\n\ntype ViewOrTextStyle = ViewStyle | TextStyle\n\nexport type ViewStyleWithPseudos = ViewOrTextStyle & {\n hoverStyle?: ViewOrTextStyle\n pressStyle?: ViewOrTextStyle\n focusStyle?: ViewOrTextStyle\n}\n\n// matching order of the below *0\nconst pseudosOrdered = [\n pseudoDescriptors.hoverStyle,\n pseudoDescriptors.pressStyle,\n pseudoDescriptors.focusStyle,\n]\n\nexport function getStylesAtomic(stylesIn: ViewStyleWithPseudos) {\n // performance optimization\n if (!(stylesIn.hoverStyle || stylesIn.pressStyle || stylesIn.focusStyle)) {\n return getAtomicStyle(stylesIn)\n }\n\n // only for pseudos\n const { hoverStyle, pressStyle, focusStyle, ...base } = stylesIn\n let res: StyleObject[] = []\n // *1 order matched to *0\n for (const [index, style] of [hoverStyle, pressStyle, focusStyle, base].entries()) {\n if (!style) continue\n const pseudo = pseudosOrdered[index]\n res = [...res, ...getAtomicStyle(style, pseudo)]\n }\n return res\n}\n\nconst cache = new Map()\n\nexport function getAtomicStyle(\n style: ViewOrTextStyle,\n pseudo?: PseudoDescriptor\n): StyleObject[] {\n if (!style) return []\n const key = JSON.stringify(style) + (pseudo ? JSON.stringify(pseudo) : '')\n if (cache.has(key)) {\n return cache.get(key)\n }\n if (cache.size > 800) {\n cache.clear()\n }\n if (process.env.NODE_ENV === 'development') {\n if (!style || typeof style !== 'object') {\n throw new Error(`Wrong style type: \"${typeof style}\": ${style}`)\n }\n }\n const out = generateAtomicStyles(style, pseudo)\n cache.set(key, out)\n return out\n}\n\nlet conf: TamaguiInternalConfig\n\nconst generateAtomicStyles = (\n styleIn: ViewStyle & TextStyle,\n pseudo?: PseudoDescriptor\n): StyleObject[] => {\n conf = conf || getConfig()\n\n // were converting to css styles\n const style = styleIn as Record<string, string | null | undefined>\n\n // transform\n if (style.transform && Array.isArray(style.transform)) {\n style.transform = style.transform\n .map(\n // { scale: 2 } => 'scale(2)'\n // { translateX: 20 } => 'translateX(20px)'\n // { matrix: [1,2,3,4,5,6] } => 'matrix(1,2,3,4,5,6)'\n (transform) => {\n const type = Object.keys(transform)[0]\n const value = transform[type]\n if (type === 'matrix' || type === 'matrix3d') {\n return `${type}(${value.join(',')})`\n }\n return `${type}(${normalizeValueWithProperty(value, type)})`\n }\n )\n .join(' ')\n }\n\n styleToCSS(style)\n\n const out: StyleObject[] = []\n for (const key in style) {\n const value = normalizeValueWithProperty(style[key], key)\n if (value == null || value == undefined) continue\n const hash = presetHashes[value]\n ? value\n : typeof value === 'string'\n ? simpleHash(value)\n : `${value}`.replace('.', 'dot')\n\n const pseudoPrefix = pseudo ? `0${pseudo.name}-` : ''\n const shortProp = conf.inverseShorthands[key] || key\n const identifier = `_${shortProp}-${pseudoPrefix}${hash}`\n const rules = createAtomicRules(identifier, key, value, pseudo)\n const styleObject: StyleObject = {\n property: key,\n pseudo: pseudo?.name as any,\n value,\n identifier,\n rules,\n }\n out.push(styleObject)\n }\n\n return out\n}\n\nconst presetHashes = {\n none: true,\n}\n\nexport function styleToCSS(style: Record<string, any>) {\n // box-shadow\n const { shadowOffset, shadowRadius, shadowColor } = style\n if (style.shadowRadius !== undefined) {\n const offset = shadowOffset || defaultOffset\n const shadow = `${normalizeValueWithProperty(\n offset.width\n )} ${normalizeValueWithProperty(offset.height)} ${normalizeValueWithProperty(\n shadowRadius\n )} ${shadowColor}`\n style.boxShadow = style.boxShadow ? `${style.boxShadow}, ${shadow}` : shadow\n style.shadowOffset = undefined\n style.shadowRadius = undefined\n style.shadowColor = undefined\n }\n\n // text-shadow\n const { textShadowColor, textShadowOffset, textShadowRadius } = style\n if (textShadowColor || textShadowOffset || textShadowRadius) {\n const { height, width } = textShadowOffset || defaultOffset\n const radius = textShadowRadius || 0\n const color = normalizeValueWithProperty(textShadowColor, 'textShadowColor')\n if (color && (height !== 0 || width !== 0 || radius !== 0)) {\n const blurRadius = normalizeValueWithProperty(radius)\n const offsetX = normalizeValueWithProperty(width)\n const offsetY = normalizeValueWithProperty(height)\n style.textShadow = `${offsetX} ${offsetY} ${blurRadius} ${color}`\n }\n style.textShadowColor = undefined\n style.textShadowOffset = undefined\n style.textShadowRadius = undefined\n }\n}\n\nfunction createDeclarationBlock(style: Record<string, any>, important = false) {\n let next = ''\n for (const key in style) {\n const prop = hyphenateStyleName(key)\n const value = style[key]\n next += `${prop}:${value}${important ? ' !important' : ''};`\n }\n return `{${next}}`\n}\n\nconst hcache = {}\nconst toHyphenLower = (match: string) => `-${match.toLowerCase()}`\nconst hyphenateStyleName = (key: string) => {\n let val = hcache[key]\n if (val) return val\n hcache[key] = val = key.replace(/[A-Z]/g, toHyphenLower)\n return val\n}\n\nconst pseudoSelectorPrefixes = (() => {\n const res: Record<string, string> = {}\n for (const key in pseudoDescriptors) {\n const pseudo = pseudoDescriptors[key]\n res[pseudo.name] = `${[...Array(pseudo.priority)].map(() => ':root').join('')} `\n }\n return res\n})()\n\nfunction createAtomicRules(\n identifier: string,\n property: string,\n value: any,\n pseudo?: PseudoDescriptor\n): string[] {\n const selector = pseudo\n ? `${pseudoSelectorPrefixes[pseudo.name]} .${identifier}:${pseudo.name}`\n : `.${identifier}`\n const important = !!pseudo\n\n let rules: string[] = []\n\n // Handle non-standard properties and object values that require multiple\n // CSS rules to be created.\n switch (property) {\n // Equivalent to using '::placeholder'\n case 'placeholderTextColor': {\n const block = createDeclarationBlock({ color: value, opacity: 1 }, important)\n rules.push(`${selector}::placeholder${block}`)\n break\n }\n\n // all webkit prefixed rules\n case 'backgroundClip':\n case 'userSelect': {\n const propertyCapitalized = `${property[0].toUpperCase()}${property.slice(1)}`\n const webkitProperty = `Webkit${propertyCapitalized}`\n const block = createDeclarationBlock(\n { [property]: value, [webkitProperty]: value },\n important\n )\n rules.push(`${selector}${block}`)\n break\n }\n\n // Polyfill for additional 'pointer-events' values\n case 'pointerEvents': {\n let finalValue = value\n if (value === 'auto' || value === 'box-only') {\n finalValue = 'auto'\n if (value === 'box-only') {\n rules.push(`${selector}>*${boxOnly}`)\n }\n } else if (value === 'none' || value === 'box-none') {\n finalValue = 'none'\n if (value === 'box-none') {\n rules.push(`${selector}>*${boxNone}`)\n }\n }\n const block = createDeclarationBlock({ pointerEvents: finalValue }, true)\n rules.push(`${selector}${block}`)\n break\n }\n\n default: {\n const block = createDeclarationBlock({ [property]: value }, important)\n rules.push(`${selector}${block}`)\n break\n }\n }\n\n // hover styles need to be conditional\n // perhaps this can be generalized but for now lets just shortcut\n // and hardcode for hover styles, if we need to later we can\n // WEIRD SYNTAX, SEE:\n // https://stackoverflow.com/questions/40532204/media-query-for-devices-supporting-hover\n if (pseudo && pseudo.name === 'hover') {\n rules = rules.map((r) => `@media not all and (hover: none) { ${r} }`)\n }\n\n return rules\n}\n\nconst boxNone = createDeclarationBlock({ pointerEvents: 'auto' }, true)\nconst boxOnly = createDeclarationBlock({ pointerEvents: 'none' }, true)\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -25,9 +25,9 @@ module.exports = __toCommonJS(normalizeValueWithProperty_exports);
|
|
|
25
25
|
var import_constants = require("@tamagui/constants");
|
|
26
26
|
var import_insertStyleRule = require("./insertStyleRule");
|
|
27
27
|
var import_normalizeColor = require("./normalizeColor");
|
|
28
|
-
const
|
|
28
|
+
const colorCache = {};
|
|
29
29
|
function normalizeValueWithProperty(value, property) {
|
|
30
|
-
const cached =
|
|
30
|
+
const cached = colorCache[value];
|
|
31
31
|
if (cached !== void 0) {
|
|
32
32
|
return cached;
|
|
33
33
|
}
|
|
@@ -35,13 +35,13 @@ function normalizeValueWithProperty(value, property) {
|
|
|
35
35
|
return value;
|
|
36
36
|
}
|
|
37
37
|
let res = value;
|
|
38
|
-
if (process.env.TAMAGUI_TARGET === "web" && typeof value === "number" && (property === void 0 || !(
|
|
38
|
+
if (process.env.TAMAGUI_TARGET === "web" && typeof value === "number" && (property === void 0 || !(property in unitlessNumbers || property in stringNumbers))) {
|
|
39
39
|
res = `${value}px`;
|
|
40
|
-
} else if (import_constants.isWeb && property !== void 0 && stringNumbers
|
|
40
|
+
} else if (import_constants.isWeb && property !== void 0 && property in stringNumbers) {
|
|
41
41
|
res = `${res}`;
|
|
42
42
|
} else if (property && property in colorProps) {
|
|
43
43
|
res = (0, import_normalizeColor.normalizeColor)(value);
|
|
44
|
-
|
|
44
|
+
colorCache[value] = res;
|
|
45
45
|
}
|
|
46
46
|
return res;
|
|
47
47
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/normalizeValueWithProperty.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * Some parts adapted from react-native-web\n * Copyright (c) Nicolas Gallagher licensed under the MIT license.\n */\n\nimport { isWeb } from '@tamagui/constants'\n\nimport { getAllSelectors } from './insertStyleRule'\nimport { normalizeColor } from './normalizeColor'\n\nconst
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA,uBAAsB;AAEtB,6BAAgC;AAChC,4BAA+B;AAE/B,MAAM,
|
|
4
|
+
"sourcesContent": ["/**\n * Some parts adapted from react-native-web\n * Copyright (c) Nicolas Gallagher licensed under the MIT license.\n */\n\nimport { isWeb } from '@tamagui/constants'\n\nimport { getAllSelectors } from './insertStyleRule'\nimport { normalizeColor } from './normalizeColor'\n\nconst colorCache = {}\n\nexport function normalizeValueWithProperty(value: any, property?: string): any {\n const cached = colorCache[value]\n if (cached !== undefined) {\n return cached\n }\n if (property && property in unitlessNumbers) {\n return value\n }\n let res = value\n if (\n process.env.TAMAGUI_TARGET === 'web' &&\n typeof value === 'number' &&\n (property === undefined ||\n !(property in unitlessNumbers || property in stringNumbers))\n ) {\n res = `${value}px`\n } else if (isWeb && property !== undefined && property in stringNumbers) {\n res = `${res}`\n } else if (property && property in colorProps) {\n res = normalizeColor(value)\n colorCache[value] = res\n }\n return res\n}\n\n// TODO react-native-web-lite\n\nconst colorProps = {\n backgroundColor: true,\n borderColor: true,\n borderTopColor: true,\n borderRightColor: true,\n borderBottomColor: true,\n borderLeftColor: true,\n color: true,\n shadowColor: true,\n textDecorationColor: true,\n textShadowColor: true,\n}\n\nconst stringNumbers = {\n zIndex: true,\n}\n\nconst unitlessNumbers = {\n WebkitLineClamp: true,\n animationIterationCount: true,\n aspectRatio: true,\n borderImageOutset: true,\n borderImageSlice: true,\n borderImageWidth: true,\n columnCount: true,\n flex: true,\n flexGrow: true,\n flexOrder: true,\n flexPositive: true,\n flexShrink: true,\n flexNegative: true,\n fontWeight: true,\n gridRow: true,\n gridRowEnd: true,\n gridRowGap: true,\n gridRowStart: true,\n gridColumn: true,\n gridColumnEnd: true,\n gridColumnGap: true,\n gridColumnStart: true,\n lineClamp: true,\n opacity: true,\n order: true,\n orphans: true,\n tabSize: true,\n widows: true,\n zoom: true,\n scale: true,\n scaleX: true,\n scaleY: true,\n scaleZ: true,\n shadowOpacity: true,\n}\n\n// getting real values for colors for animations (reverse mapped from CSS)\n// this isn't beautiful, but will do relatively fine performance for now\nconst rcache = {}\nexport function reverseMapClassNameToValue(key: string, className: string) {\n const selectors = getAllSelectors()\n const cssRule = selectors[className]\n if (rcache[cssRule]) return rcache[cssRule]\n if (!cssRule) {\n return\n }\n const cssVal = cssRule.replace(/.*:/, '').replace(/;.*/, '').trim()\n let res: any\n if (cssVal.startsWith('var(')) {\n res = cssVal\n } else if (unitlessNumbers[key]) {\n res = +cssVal\n } else if (cssVal.endsWith('px')) {\n res = +cssVal.replace('px', '')\n } else {\n res = cssVal\n }\n rcache[cssRule] = res\n if (process.env.NODE_ENV === 'development') {\n // ensure we are parsing properly\n if (typeof res === 'number' && isNaN(res)) {\n // eslint-disable-next-line no-console\n console.log('Tamagui invalid parsed value, NaN:', {\n res,\n cssVal,\n cssRule,\n key,\n className,\n })\n }\n }\n return res\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA,uBAAsB;AAEtB,6BAAgC;AAChC,4BAA+B;AAE/B,MAAM,aAAa,CAAC;AAEb,SAAS,2BAA2B,OAAY,UAAwB;AAC7E,QAAM,SAAS,WAAW,KAAK;AAC/B,MAAI,WAAW,QAAW;AACxB,WAAO;AAAA,EACT;AACA,MAAI,YAAY,YAAY,iBAAiB;AAC3C,WAAO;AAAA,EACT;AACA,MAAI,MAAM;AACV,MACE,QAAQ,IAAI,mBAAmB,SAC/B,OAAO,UAAU,aAChB,aAAa,UACZ,EAAE,YAAY,mBAAmB,YAAY,iBAC/C;AACA,UAAM,GAAG;AAAA,EACX,WAAW,0BAAS,aAAa,UAAa,YAAY,eAAe;AACvE,UAAM,GAAG;AAAA,EACX,WAAW,YAAY,YAAY,YAAY;AAC7C,cAAM,sCAAe,KAAK;AAC1B,eAAW,KAAK,IAAI;AAAA,EACtB;AACA,SAAO;AACT;AAIA,MAAM,aAAa;AAAA,EACjB,iBAAiB;AAAA,EACjB,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,kBAAkB;AAAA,EAClB,mBAAmB;AAAA,EACnB,iBAAiB;AAAA,EACjB,OAAO;AAAA,EACP,aAAa;AAAA,EACb,qBAAqB;AAAA,EACrB,iBAAiB;AACnB;AAEA,MAAM,gBAAgB;AAAA,EACpB,QAAQ;AACV;AAEA,MAAM,kBAAkB;AAAA,EACtB,iBAAiB;AAAA,EACjB,yBAAyB;AAAA,EACzB,aAAa;AAAA,EACb,mBAAmB;AAAA,EACnB,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,aAAa;AAAA,EACb,MAAM;AAAA,EACN,UAAU;AAAA,EACV,WAAW;AAAA,EACX,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,eAAe;AAAA,EACf,iBAAiB;AAAA,EACjB,WAAW;AAAA,EACX,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,eAAe;AACjB;AAIA,MAAM,SAAS,CAAC;AACT,SAAS,2BAA2B,KAAa,WAAmB;AACzE,QAAM,gBAAY,wCAAgB;AAClC,QAAM,UAAU,UAAU,SAAS;AACnC,MAAI,OAAO,OAAO;AAAG,WAAO,OAAO,OAAO;AAC1C,MAAI,CAAC,SAAS;AACZ;AAAA,EACF;AACA,QAAM,SAAS,QAAQ,QAAQ,OAAO,EAAE,EAAE,QAAQ,OAAO,EAAE,EAAE,KAAK;AAClE,MAAI;AACJ,MAAI,OAAO,WAAW,MAAM,GAAG;AAC7B,UAAM;AAAA,EACR,WAAW,gBAAgB,GAAG,GAAG;AAC/B,UAAM,CAAC;AAAA,EACT,WAAW,OAAO,SAAS,IAAI,GAAG;AAChC,UAAM,CAAC,OAAO,QAAQ,MAAM,EAAE;AAAA,EAChC,OAAO;AACL,UAAM;AAAA,EACR;AACA,SAAO,OAAO,IAAI;AAClB,MAAI,QAAQ,IAAI,aAAa,eAAe;AAE1C,QAAI,OAAO,QAAQ,YAAY,MAAM,GAAG,GAAG;AAEzC,cAAQ,IAAI,sCAAsC;AAAA,QAChD;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF;AACA,SAAO;AACT;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -64,7 +64,7 @@ const generateAtomicStyles = (styleIn, pseudo) => {
|
|
|
64
64
|
styleToCSS(style);
|
|
65
65
|
const out = [];
|
|
66
66
|
for (const key in style) {
|
|
67
|
-
const value = style[key];
|
|
67
|
+
const value = normalizeValueWithProperty(style[key], key);
|
|
68
68
|
if (value == null || value == void 0)
|
|
69
69
|
continue;
|
|
70
70
|
const hash = presetHashes[value] ? value : typeof value === "string" ? simpleHash(value) : `${value}`.replace(".", "dot");
|
|
@@ -86,12 +86,13 @@ const generateAtomicStyles = (styleIn, pseudo) => {
|
|
|
86
86
|
const presetHashes = {
|
|
87
87
|
none: true
|
|
88
88
|
};
|
|
89
|
-
const n = normalizeValueWithProperty;
|
|
90
89
|
function styleToCSS(style) {
|
|
91
90
|
const { shadowOffset, shadowRadius, shadowColor } = style;
|
|
92
91
|
if (style.shadowRadius !== void 0) {
|
|
93
92
|
const offset = shadowOffset || defaultOffset;
|
|
94
|
-
const shadow = `${
|
|
93
|
+
const shadow = `${normalizeValueWithProperty(
|
|
94
|
+
offset.width
|
|
95
|
+
)} ${normalizeValueWithProperty(offset.height)} ${normalizeValueWithProperty(
|
|
95
96
|
shadowRadius
|
|
96
97
|
)} ${shadowColor}`;
|
|
97
98
|
style.boxShadow = style.boxShadow ? `${style.boxShadow}, ${shadow}` : shadow;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/getStylesAtomic.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * Some parts adapted from react-native-web\n * Copyright (c) Nicolas Gallagher licensed under the MIT license.\n */\n\nimport { StyleObject, simpleHash } from '@tamagui/helpers'\nimport type { TextStyle, ViewStyle } from 'react-native'\n\nimport { getConfig } from '../config'\nimport { TamaguiInternalConfig } from '../types'\nimport { defaultOffset } from './expandStyles'\nimport { normalizeValueWithProperty } from './normalizeValueWithProperty.js'\nimport { PseudoDescriptor, pseudoDescriptors } from './pseudoDescriptors'\n\n// refactor this file away next...\n\ntype ViewOrTextStyle = ViewStyle | TextStyle\n\nexport type ViewStyleWithPseudos = ViewOrTextStyle & {\n hoverStyle?: ViewOrTextStyle\n pressStyle?: ViewOrTextStyle\n focusStyle?: ViewOrTextStyle\n}\n\n// matching order of the below *0\nconst pseudosOrdered = [\n pseudoDescriptors.hoverStyle,\n pseudoDescriptors.pressStyle,\n pseudoDescriptors.focusStyle,\n]\n\nexport function getStylesAtomic(stylesIn: ViewStyleWithPseudos) {\n // performance optimization\n if (!(stylesIn.hoverStyle || stylesIn.pressStyle || stylesIn.focusStyle)) {\n return getAtomicStyle(stylesIn)\n }\n\n // only for pseudos\n const { hoverStyle, pressStyle, focusStyle, ...base } = stylesIn\n let res: StyleObject[] = []\n // *1 order matched to *0\n for (const [index, style] of [hoverStyle, pressStyle, focusStyle, base].entries()) {\n if (!style) continue\n const pseudo = pseudosOrdered[index]\n res = [...res, ...getAtomicStyle(style, pseudo)]\n }\n return res\n}\n\nconst cache = new Map()\n\nexport function getAtomicStyle(\n style: ViewOrTextStyle,\n pseudo?: PseudoDescriptor\n): StyleObject[] {\n if (!style) return []\n const key = JSON.stringify(style) + (pseudo ? JSON.stringify(pseudo) : '')\n if (cache.has(key)) {\n return cache.get(key)\n }\n if (cache.size > 800) {\n cache.clear()\n }\n if (process.env.NODE_ENV === 'development') {\n if (!style || typeof style !== 'object') {\n throw new Error(`Wrong style type: \"${typeof style}\": ${style}`)\n }\n }\n const out = generateAtomicStyles(style, pseudo)\n cache.set(key, out)\n return out\n}\n\nlet conf: TamaguiInternalConfig\n\nconst generateAtomicStyles = (\n styleIn: ViewStyle & TextStyle,\n pseudo?: PseudoDescriptor\n): StyleObject[] => {\n conf = conf || getConfig()\n\n // were converting to css styles\n const style = styleIn as Record<string, string | null | undefined>\n\n // transform\n if (style.transform && Array.isArray(style.transform)) {\n style.transform = style.transform\n .map(\n // { scale: 2 } => 'scale(2)'\n // { translateX: 20 } => 'translateX(20px)'\n // { matrix: [1,2,3,4,5,6] } => 'matrix(1,2,3,4,5,6)'\n (transform) => {\n const type = Object.keys(transform)[0]\n const value = transform[type]\n if (type === 'matrix' || type === 'matrix3d') {\n return `${type}(${value.join(',')})`\n }\n return `${type}(${normalizeValueWithProperty(value, type)})`\n }\n )\n .join(' ')\n }\n\n styleToCSS(style)\n\n const out: StyleObject[] = []\n for (const key in style) {\n const value = style[key]\n if (value == null || value == undefined) continue\n const hash = presetHashes[value]\n ? value\n : typeof value === 'string'\n ? simpleHash(value)\n : `${value}`.replace('.', 'dot')\n\n const pseudoPrefix = pseudo ? `0${pseudo.name}-` : ''\n const shortProp = conf.inverseShorthands[key] || key\n const identifier = `_${shortProp}-${pseudoPrefix}${hash}`\n const rules = createAtomicRules(identifier, key, value, pseudo)\n const styleObject: StyleObject = {\n property: key,\n pseudo: pseudo?.name as any,\n value,\n identifier,\n rules,\n }\n out.push(styleObject)\n }\n\n return out\n}\n\nconst presetHashes = {\n none: true,\n}\n\
|
|
5
|
-
"mappings": "AAKA,SAAsB,kBAAkB;AAGxC,SAAS,iBAAiB;AAE1B,SAAS,qBAAqB;AAC9B,SAAS,kCAAkC;AAC3C,SAA2B,yBAAyB;AAapD,MAAM,iBAAiB;AAAA,EACrB,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,kBAAkB;AACpB;AAEO,SAAS,gBAAgB,UAAgC;AAE9D,MAAI,EAAE,SAAS,cAAc,SAAS,cAAc,SAAS,aAAa;AACxE,WAAO,eAAe,QAAQ;AAAA,EAChC;AAGA,QAAM,EAAE,YAAY,YAAY,YAAY,GAAG,KAAK,IAAI;AACxD,MAAI,MAAqB,CAAC;AAE1B,aAAW,CAAC,OAAO,KAAK,KAAK,CAAC,YAAY,YAAY,YAAY,IAAI,EAAE,QAAQ,GAAG;AACjF,QAAI,CAAC;AAAO;AACZ,UAAM,SAAS,eAAe,KAAK;AACnC,UAAM,CAAC,GAAG,KAAK,GAAG,eAAe,OAAO,MAAM,CAAC;AAAA,EACjD;AACA,SAAO;AACT;AAEA,MAAM,QAAQ,oBAAI,IAAI;AAEf,SAAS,eACd,OACA,QACe;AACf,MAAI,CAAC;AAAO,WAAO,CAAC;AACpB,QAAM,MAAM,KAAK,UAAU,KAAK,KAAK,SAAS,KAAK,UAAU,MAAM,IAAI;AACvE,MAAI,MAAM,IAAI,GAAG,GAAG;AAClB,WAAO,MAAM,IAAI,GAAG;AAAA,EACtB;AACA,MAAI,MAAM,OAAO,KAAK;AACpB,UAAM,MAAM;AAAA,EACd;AACA,MAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,QAAI,CAAC,SAAS,OAAO,UAAU,UAAU;AACvC,YAAM,IAAI,MAAM,sBAAsB,OAAO,WAAW,OAAO;AAAA,IACjE;AAAA,EACF;AACA,QAAM,MAAM,qBAAqB,OAAO,MAAM;AAC9C,QAAM,IAAI,KAAK,GAAG;AAClB,SAAO;AACT;AAEA,IAAI;AAEJ,MAAM,uBAAuB,CAC3B,SACA,WACkB;AAClB,SAAO,QAAQ,UAAU;AAGzB,QAAM,QAAQ;AAGd,MAAI,MAAM,aAAa,MAAM,QAAQ,MAAM,SAAS,GAAG;AACrD,UAAM,YAAY,MAAM,UACrB;AAAA;AAAA;AAAA;AAAA,MAIC,CAAC,cAAc;AACb,cAAM,OAAO,OAAO,KAAK,SAAS,EAAE,CAAC;AACrC,cAAM,QAAQ,UAAU,IAAI;AAC5B,YAAI,SAAS,YAAY,SAAS,YAAY;AAC5C,iBAAO,GAAG,QAAQ,MAAM,KAAK,GAAG;AAAA,QAClC;AACA,eAAO,GAAG,QAAQ,2BAA2B,OAAO,IAAI;AAAA,MAC1D;AAAA,IACF,EACC,KAAK,GAAG;AAAA,EACb;AAEA,aAAW,KAAK;AAEhB,QAAM,MAAqB,CAAC;AAC5B,aAAW,OAAO,OAAO;AACvB,UAAM,QAAQ,MAAM,GAAG;
|
|
4
|
+
"sourcesContent": ["/**\n * Some parts adapted from react-native-web\n * Copyright (c) Nicolas Gallagher licensed under the MIT license.\n */\n\nimport { StyleObject, simpleHash } from '@tamagui/helpers'\nimport type { TextStyle, ViewStyle } from 'react-native'\n\nimport { getConfig } from '../config'\nimport { TamaguiInternalConfig } from '../types'\nimport { defaultOffset } from './expandStyles'\nimport { normalizeValueWithProperty } from './normalizeValueWithProperty.js'\nimport { PseudoDescriptor, pseudoDescriptors } from './pseudoDescriptors'\n\n// refactor this file away next...\n\ntype ViewOrTextStyle = ViewStyle | TextStyle\n\nexport type ViewStyleWithPseudos = ViewOrTextStyle & {\n hoverStyle?: ViewOrTextStyle\n pressStyle?: ViewOrTextStyle\n focusStyle?: ViewOrTextStyle\n}\n\n// matching order of the below *0\nconst pseudosOrdered = [\n pseudoDescriptors.hoverStyle,\n pseudoDescriptors.pressStyle,\n pseudoDescriptors.focusStyle,\n]\n\nexport function getStylesAtomic(stylesIn: ViewStyleWithPseudos) {\n // performance optimization\n if (!(stylesIn.hoverStyle || stylesIn.pressStyle || stylesIn.focusStyle)) {\n return getAtomicStyle(stylesIn)\n }\n\n // only for pseudos\n const { hoverStyle, pressStyle, focusStyle, ...base } = stylesIn\n let res: StyleObject[] = []\n // *1 order matched to *0\n for (const [index, style] of [hoverStyle, pressStyle, focusStyle, base].entries()) {\n if (!style) continue\n const pseudo = pseudosOrdered[index]\n res = [...res, ...getAtomicStyle(style, pseudo)]\n }\n return res\n}\n\nconst cache = new Map()\n\nexport function getAtomicStyle(\n style: ViewOrTextStyle,\n pseudo?: PseudoDescriptor\n): StyleObject[] {\n if (!style) return []\n const key = JSON.stringify(style) + (pseudo ? JSON.stringify(pseudo) : '')\n if (cache.has(key)) {\n return cache.get(key)\n }\n if (cache.size > 800) {\n cache.clear()\n }\n if (process.env.NODE_ENV === 'development') {\n if (!style || typeof style !== 'object') {\n throw new Error(`Wrong style type: \"${typeof style}\": ${style}`)\n }\n }\n const out = generateAtomicStyles(style, pseudo)\n cache.set(key, out)\n return out\n}\n\nlet conf: TamaguiInternalConfig\n\nconst generateAtomicStyles = (\n styleIn: ViewStyle & TextStyle,\n pseudo?: PseudoDescriptor\n): StyleObject[] => {\n conf = conf || getConfig()\n\n // were converting to css styles\n const style = styleIn as Record<string, string | null | undefined>\n\n // transform\n if (style.transform && Array.isArray(style.transform)) {\n style.transform = style.transform\n .map(\n // { scale: 2 } => 'scale(2)'\n // { translateX: 20 } => 'translateX(20px)'\n // { matrix: [1,2,3,4,5,6] } => 'matrix(1,2,3,4,5,6)'\n (transform) => {\n const type = Object.keys(transform)[0]\n const value = transform[type]\n if (type === 'matrix' || type === 'matrix3d') {\n return `${type}(${value.join(',')})`\n }\n return `${type}(${normalizeValueWithProperty(value, type)})`\n }\n )\n .join(' ')\n }\n\n styleToCSS(style)\n\n const out: StyleObject[] = []\n for (const key in style) {\n const value = normalizeValueWithProperty(style[key], key)\n if (value == null || value == undefined) continue\n const hash = presetHashes[value]\n ? value\n : typeof value === 'string'\n ? simpleHash(value)\n : `${value}`.replace('.', 'dot')\n\n const pseudoPrefix = pseudo ? `0${pseudo.name}-` : ''\n const shortProp = conf.inverseShorthands[key] || key\n const identifier = `_${shortProp}-${pseudoPrefix}${hash}`\n const rules = createAtomicRules(identifier, key, value, pseudo)\n const styleObject: StyleObject = {\n property: key,\n pseudo: pseudo?.name as any,\n value,\n identifier,\n rules,\n }\n out.push(styleObject)\n }\n\n return out\n}\n\nconst presetHashes = {\n none: true,\n}\n\nexport function styleToCSS(style: Record<string, any>) {\n // box-shadow\n const { shadowOffset, shadowRadius, shadowColor } = style\n if (style.shadowRadius !== undefined) {\n const offset = shadowOffset || defaultOffset\n const shadow = `${normalizeValueWithProperty(\n offset.width\n )} ${normalizeValueWithProperty(offset.height)} ${normalizeValueWithProperty(\n shadowRadius\n )} ${shadowColor}`\n style.boxShadow = style.boxShadow ? `${style.boxShadow}, ${shadow}` : shadow\n style.shadowOffset = undefined\n style.shadowRadius = undefined\n style.shadowColor = undefined\n }\n\n // text-shadow\n const { textShadowColor, textShadowOffset, textShadowRadius } = style\n if (textShadowColor || textShadowOffset || textShadowRadius) {\n const { height, width } = textShadowOffset || defaultOffset\n const radius = textShadowRadius || 0\n const color = normalizeValueWithProperty(textShadowColor, 'textShadowColor')\n if (color && (height !== 0 || width !== 0 || radius !== 0)) {\n const blurRadius = normalizeValueWithProperty(radius)\n const offsetX = normalizeValueWithProperty(width)\n const offsetY = normalizeValueWithProperty(height)\n style.textShadow = `${offsetX} ${offsetY} ${blurRadius} ${color}`\n }\n style.textShadowColor = undefined\n style.textShadowOffset = undefined\n style.textShadowRadius = undefined\n }\n}\n\nfunction createDeclarationBlock(style: Record<string, any>, important = false) {\n let next = ''\n for (const key in style) {\n const prop = hyphenateStyleName(key)\n const value = style[key]\n next += `${prop}:${value}${important ? ' !important' : ''};`\n }\n return `{${next}}`\n}\n\nconst hcache = {}\nconst toHyphenLower = (match: string) => `-${match.toLowerCase()}`\nconst hyphenateStyleName = (key: string) => {\n let val = hcache[key]\n if (val) return val\n hcache[key] = val = key.replace(/[A-Z]/g, toHyphenLower)\n return val\n}\n\nconst pseudoSelectorPrefixes = (() => {\n const res: Record<string, string> = {}\n for (const key in pseudoDescriptors) {\n const pseudo = pseudoDescriptors[key]\n res[pseudo.name] = `${[...Array(pseudo.priority)].map(() => ':root').join('')} `\n }\n return res\n})()\n\nfunction createAtomicRules(\n identifier: string,\n property: string,\n value: any,\n pseudo?: PseudoDescriptor\n): string[] {\n const selector = pseudo\n ? `${pseudoSelectorPrefixes[pseudo.name]} .${identifier}:${pseudo.name}`\n : `.${identifier}`\n const important = !!pseudo\n\n let rules: string[] = []\n\n // Handle non-standard properties and object values that require multiple\n // CSS rules to be created.\n switch (property) {\n // Equivalent to using '::placeholder'\n case 'placeholderTextColor': {\n const block = createDeclarationBlock({ color: value, opacity: 1 }, important)\n rules.push(`${selector}::placeholder${block}`)\n break\n }\n\n // all webkit prefixed rules\n case 'backgroundClip':\n case 'userSelect': {\n const propertyCapitalized = `${property[0].toUpperCase()}${property.slice(1)}`\n const webkitProperty = `Webkit${propertyCapitalized}`\n const block = createDeclarationBlock(\n { [property]: value, [webkitProperty]: value },\n important\n )\n rules.push(`${selector}${block}`)\n break\n }\n\n // Polyfill for additional 'pointer-events' values\n case 'pointerEvents': {\n let finalValue = value\n if (value === 'auto' || value === 'box-only') {\n finalValue = 'auto'\n if (value === 'box-only') {\n rules.push(`${selector}>*${boxOnly}`)\n }\n } else if (value === 'none' || value === 'box-none') {\n finalValue = 'none'\n if (value === 'box-none') {\n rules.push(`${selector}>*${boxNone}`)\n }\n }\n const block = createDeclarationBlock({ pointerEvents: finalValue }, true)\n rules.push(`${selector}${block}`)\n break\n }\n\n default: {\n const block = createDeclarationBlock({ [property]: value }, important)\n rules.push(`${selector}${block}`)\n break\n }\n }\n\n // hover styles need to be conditional\n // perhaps this can be generalized but for now lets just shortcut\n // and hardcode for hover styles, if we need to later we can\n // WEIRD SYNTAX, SEE:\n // https://stackoverflow.com/questions/40532204/media-query-for-devices-supporting-hover\n if (pseudo && pseudo.name === 'hover') {\n rules = rules.map((r) => `@media not all and (hover: none) { ${r} }`)\n }\n\n return rules\n}\n\nconst boxNone = createDeclarationBlock({ pointerEvents: 'auto' }, true)\nconst boxOnly = createDeclarationBlock({ pointerEvents: 'none' }, true)\n"],
|
|
5
|
+
"mappings": "AAKA,SAAsB,kBAAkB;AAGxC,SAAS,iBAAiB;AAE1B,SAAS,qBAAqB;AAC9B,SAAS,kCAAkC;AAC3C,SAA2B,yBAAyB;AAapD,MAAM,iBAAiB;AAAA,EACrB,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,kBAAkB;AACpB;AAEO,SAAS,gBAAgB,UAAgC;AAE9D,MAAI,EAAE,SAAS,cAAc,SAAS,cAAc,SAAS,aAAa;AACxE,WAAO,eAAe,QAAQ;AAAA,EAChC;AAGA,QAAM,EAAE,YAAY,YAAY,YAAY,GAAG,KAAK,IAAI;AACxD,MAAI,MAAqB,CAAC;AAE1B,aAAW,CAAC,OAAO,KAAK,KAAK,CAAC,YAAY,YAAY,YAAY,IAAI,EAAE,QAAQ,GAAG;AACjF,QAAI,CAAC;AAAO;AACZ,UAAM,SAAS,eAAe,KAAK;AACnC,UAAM,CAAC,GAAG,KAAK,GAAG,eAAe,OAAO,MAAM,CAAC;AAAA,EACjD;AACA,SAAO;AACT;AAEA,MAAM,QAAQ,oBAAI,IAAI;AAEf,SAAS,eACd,OACA,QACe;AACf,MAAI,CAAC;AAAO,WAAO,CAAC;AACpB,QAAM,MAAM,KAAK,UAAU,KAAK,KAAK,SAAS,KAAK,UAAU,MAAM,IAAI;AACvE,MAAI,MAAM,IAAI,GAAG,GAAG;AAClB,WAAO,MAAM,IAAI,GAAG;AAAA,EACtB;AACA,MAAI,MAAM,OAAO,KAAK;AACpB,UAAM,MAAM;AAAA,EACd;AACA,MAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,QAAI,CAAC,SAAS,OAAO,UAAU,UAAU;AACvC,YAAM,IAAI,MAAM,sBAAsB,OAAO,WAAW,OAAO;AAAA,IACjE;AAAA,EACF;AACA,QAAM,MAAM,qBAAqB,OAAO,MAAM;AAC9C,QAAM,IAAI,KAAK,GAAG;AAClB,SAAO;AACT;AAEA,IAAI;AAEJ,MAAM,uBAAuB,CAC3B,SACA,WACkB;AAClB,SAAO,QAAQ,UAAU;AAGzB,QAAM,QAAQ;AAGd,MAAI,MAAM,aAAa,MAAM,QAAQ,MAAM,SAAS,GAAG;AACrD,UAAM,YAAY,MAAM,UACrB;AAAA;AAAA;AAAA;AAAA,MAIC,CAAC,cAAc;AACb,cAAM,OAAO,OAAO,KAAK,SAAS,EAAE,CAAC;AACrC,cAAM,QAAQ,UAAU,IAAI;AAC5B,YAAI,SAAS,YAAY,SAAS,YAAY;AAC5C,iBAAO,GAAG,QAAQ,MAAM,KAAK,GAAG;AAAA,QAClC;AACA,eAAO,GAAG,QAAQ,2BAA2B,OAAO,IAAI;AAAA,MAC1D;AAAA,IACF,EACC,KAAK,GAAG;AAAA,EACb;AAEA,aAAW,KAAK;AAEhB,QAAM,MAAqB,CAAC;AAC5B,aAAW,OAAO,OAAO;AACvB,UAAM,QAAQ,2BAA2B,MAAM,GAAG,GAAG,GAAG;AACxD,QAAI,SAAS,QAAQ,SAAS;AAAW;AACzC,UAAM,OAAO,aAAa,KAAK,IAC3B,QACA,OAAO,UAAU,WACjB,WAAW,KAAK,IAChB,GAAG,QAAQ,QAAQ,KAAK,KAAK;AAEjC,UAAM,eAAe,SAAS,IAAI,OAAO,UAAU;AACnD,UAAM,YAAY,KAAK,kBAAkB,GAAG,KAAK;AACjD,UAAM,aAAa,IAAI,aAAa,eAAe;AACnD,UAAM,QAAQ,kBAAkB,YAAY,KAAK,OAAO,MAAM;AAC9D,UAAM,cAA2B;AAAA,MAC/B,UAAU;AAAA,MACV,QAAQ,iCAAQ;AAAA,MAChB;AAAA,MACA;AAAA,MACA;AAAA,IACF;AACA,QAAI,KAAK,WAAW;AAAA,EACtB;AAEA,SAAO;AACT;AAEA,MAAM,eAAe;AAAA,EACnB,MAAM;AACR;AAEO,SAAS,WAAW,OAA4B;AAErD,QAAM,EAAE,cAAc,cAAc,YAAY,IAAI;AACpD,MAAI,MAAM,iBAAiB,QAAW;AACpC,UAAM,SAAS,gBAAgB;AAC/B,UAAM,SAAS,GAAG;AAAA,MAChB,OAAO;AAAA,IACT,KAAK,2BAA2B,OAAO,MAAM,KAAK;AAAA,MAChD;AAAA,IACF,KAAK;AACL,UAAM,YAAY,MAAM,YAAY,GAAG,MAAM,cAAc,WAAW;AACtE,UAAM,eAAe;AACrB,UAAM,eAAe;AACrB,UAAM,cAAc;AAAA,EACtB;AAGA,QAAM,EAAE,iBAAiB,kBAAkB,iBAAiB,IAAI;AAChE,MAAI,mBAAmB,oBAAoB,kBAAkB;AAC3D,UAAM,EAAE,QAAQ,MAAM,IAAI,oBAAoB;AAC9C,UAAM,SAAS,oBAAoB;AACnC,UAAM,QAAQ,2BAA2B,iBAAiB,iBAAiB;AAC3E,QAAI,UAAU,WAAW,KAAK,UAAU,KAAK,WAAW,IAAI;AAC1D,YAAM,aAAa,2BAA2B,MAAM;AACpD,YAAM,UAAU,2BAA2B,KAAK;AAChD,YAAM,UAAU,2BAA2B,MAAM;AACjD,YAAM,aAAa,GAAG,WAAW,WAAW,cAAc;AAAA,IAC5D;AACA,UAAM,kBAAkB;AACxB,UAAM,mBAAmB;AACzB,UAAM,mBAAmB;AAAA,EAC3B;AACF;AAEA,SAAS,uBAAuB,OAA4B,YAAY,OAAO;AAC7E,MAAI,OAAO;AACX,aAAW,OAAO,OAAO;AACvB,UAAM,OAAO,mBAAmB,GAAG;AACnC,UAAM,QAAQ,MAAM,GAAG;AACvB,YAAQ,GAAG,QAAQ,QAAQ,YAAY,gBAAgB;AAAA,EACzD;AACA,SAAO,IAAI;AACb;AAEA,MAAM,SAAS,CAAC;AAChB,MAAM,gBAAgB,CAAC,UAAkB,IAAI,MAAM,YAAY;AAC/D,MAAM,qBAAqB,CAAC,QAAgB;AAC1C,MAAI,MAAM,OAAO,GAAG;AACpB,MAAI;AAAK,WAAO;AAChB,SAAO,GAAG,IAAI,MAAM,IAAI,QAAQ,UAAU,aAAa;AACvD,SAAO;AACT;AAEA,MAAM,0BAA0B,MAAM;AACpC,QAAM,MAA8B,CAAC;AACrC,aAAW,OAAO,mBAAmB;AACnC,UAAM,SAAS,kBAAkB,GAAG;AACpC,QAAI,OAAO,IAAI,IAAI,GAAG,CAAC,GAAG,MAAM,OAAO,QAAQ,CAAC,EAAE,IAAI,MAAM,OAAO,EAAE,KAAK,EAAE;AAAA,EAC9E;AACA,SAAO;AACT,GAAG;AAEH,SAAS,kBACP,YACA,UACA,OACA,QACU;AACV,QAAM,WAAW,SACb,GAAG,uBAAuB,OAAO,IAAI,MAAM,cAAc,OAAO,SAChE,IAAI;AACR,QAAM,YAAY,CAAC,CAAC;AAEpB,MAAI,QAAkB,CAAC;AAIvB,UAAQ,UAAU;AAAA,IAEhB,KAAK,wBAAwB;AAC3B,YAAM,QAAQ,uBAAuB,EAAE,OAAO,OAAO,SAAS,EAAE,GAAG,SAAS;AAC5E,YAAM,KAAK,GAAG,wBAAwB,OAAO;AAC7C;AAAA,IACF;AAAA,IAGA,KAAK;AAAA,IACL,KAAK,cAAc;AACjB,YAAM,sBAAsB,GAAG,SAAS,CAAC,EAAE,YAAY,IAAI,SAAS,MAAM,CAAC;AAC3E,YAAM,iBAAiB,SAAS;AAChC,YAAM,QAAQ;AAAA,QACZ,EAAE,CAAC,QAAQ,GAAG,OAAO,CAAC,cAAc,GAAG,MAAM;AAAA,QAC7C;AAAA,MACF;AACA,YAAM,KAAK,GAAG,WAAW,OAAO;AAChC;AAAA,IACF;AAAA,IAGA,KAAK,iBAAiB;AACpB,UAAI,aAAa;AACjB,UAAI,UAAU,UAAU,UAAU,YAAY;AAC5C,qBAAa;AACb,YAAI,UAAU,YAAY;AACxB,gBAAM,KAAK,GAAG,aAAa,SAAS;AAAA,QACtC;AAAA,MACF,WAAW,UAAU,UAAU,UAAU,YAAY;AACnD,qBAAa;AACb,YAAI,UAAU,YAAY;AACxB,gBAAM,KAAK,GAAG,aAAa,SAAS;AAAA,QACtC;AAAA,MACF;AACA,YAAM,QAAQ,uBAAuB,EAAE,eAAe,WAAW,GAAG,IAAI;AACxE,YAAM,KAAK,GAAG,WAAW,OAAO;AAChC;AAAA,IACF;AAAA,IAEA,SAAS;AACP,YAAM,QAAQ,uBAAuB,EAAE,CAAC,QAAQ,GAAG,MAAM,GAAG,SAAS;AACrE,YAAM,KAAK,GAAG,WAAW,OAAO;AAChC;AAAA,IACF;AAAA,EACF;AAOA,MAAI,UAAU,OAAO,SAAS,SAAS;AACrC,YAAQ,MAAM,IAAI,CAAC,MAAM,sCAAsC,KAAK;AAAA,EACtE;AAEA,SAAO;AACT;AAEA,MAAM,UAAU,uBAAuB,EAAE,eAAe,OAAO,GAAG,IAAI;AACtE,MAAM,UAAU,uBAAuB,EAAE,eAAe,OAAO,GAAG,IAAI;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -64,7 +64,7 @@ const generateAtomicStyles = (styleIn, pseudo) => {
|
|
|
64
64
|
styleToCSS(style);
|
|
65
65
|
const out = [];
|
|
66
66
|
for (const key in style) {
|
|
67
|
-
const value = style[key];
|
|
67
|
+
const value = normalizeValueWithProperty(style[key], key);
|
|
68
68
|
if (value == null || value == void 0)
|
|
69
69
|
continue;
|
|
70
70
|
const hash = presetHashes[value] ? value : typeof value === "string" ? simpleHash(value) : `${value}`.replace(".", "dot");
|
|
@@ -86,12 +86,13 @@ const generateAtomicStyles = (styleIn, pseudo) => {
|
|
|
86
86
|
const presetHashes = {
|
|
87
87
|
none: true
|
|
88
88
|
};
|
|
89
|
-
const n = normalizeValueWithProperty;
|
|
90
89
|
function styleToCSS(style) {
|
|
91
90
|
const { shadowOffset, shadowRadius, shadowColor } = style;
|
|
92
91
|
if (style.shadowRadius !== void 0) {
|
|
93
92
|
const offset = shadowOffset || defaultOffset;
|
|
94
|
-
const shadow = `${
|
|
93
|
+
const shadow = `${normalizeValueWithProperty(
|
|
94
|
+
offset.width
|
|
95
|
+
)} ${normalizeValueWithProperty(offset.height)} ${normalizeValueWithProperty(
|
|
95
96
|
shadowRadius
|
|
96
97
|
)} ${shadowColor}`;
|
|
97
98
|
style.boxShadow = style.boxShadow ? `${style.boxShadow}, ${shadow}` : shadow;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/getStylesAtomic.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * Some parts adapted from react-native-web\n * Copyright (c) Nicolas Gallagher licensed under the MIT license.\n */\n\nimport { StyleObject, simpleHash } from '@tamagui/helpers'\nimport type { TextStyle, ViewStyle } from 'react-native'\n\nimport { getConfig } from '../config'\nimport { TamaguiInternalConfig } from '../types'\nimport { defaultOffset } from './expandStyles'\nimport { normalizeValueWithProperty } from './normalizeValueWithProperty.js'\nimport { PseudoDescriptor, pseudoDescriptors } from './pseudoDescriptors'\n\n// refactor this file away next...\n\ntype ViewOrTextStyle = ViewStyle | TextStyle\n\nexport type ViewStyleWithPseudos = ViewOrTextStyle & {\n hoverStyle?: ViewOrTextStyle\n pressStyle?: ViewOrTextStyle\n focusStyle?: ViewOrTextStyle\n}\n\n// matching order of the below *0\nconst pseudosOrdered = [\n pseudoDescriptors.hoverStyle,\n pseudoDescriptors.pressStyle,\n pseudoDescriptors.focusStyle,\n]\n\nexport function getStylesAtomic(stylesIn: ViewStyleWithPseudos) {\n // performance optimization\n if (!(stylesIn.hoverStyle || stylesIn.pressStyle || stylesIn.focusStyle)) {\n return getAtomicStyle(stylesIn)\n }\n\n // only for pseudos\n const { hoverStyle, pressStyle, focusStyle, ...base } = stylesIn\n let res: StyleObject[] = []\n // *1 order matched to *0\n for (const [index, style] of [hoverStyle, pressStyle, focusStyle, base].entries()) {\n if (!style) continue\n const pseudo = pseudosOrdered[index]\n res = [...res, ...getAtomicStyle(style, pseudo)]\n }\n return res\n}\n\nconst cache = new Map()\n\nexport function getAtomicStyle(\n style: ViewOrTextStyle,\n pseudo?: PseudoDescriptor\n): StyleObject[] {\n if (!style) return []\n const key = JSON.stringify(style) + (pseudo ? JSON.stringify(pseudo) : '')\n if (cache.has(key)) {\n return cache.get(key)\n }\n if (cache.size > 800) {\n cache.clear()\n }\n if (process.env.NODE_ENV === 'development') {\n if (!style || typeof style !== 'object') {\n throw new Error(`Wrong style type: \"${typeof style}\": ${style}`)\n }\n }\n const out = generateAtomicStyles(style, pseudo)\n cache.set(key, out)\n return out\n}\n\nlet conf: TamaguiInternalConfig\n\nconst generateAtomicStyles = (\n styleIn: ViewStyle & TextStyle,\n pseudo?: PseudoDescriptor\n): StyleObject[] => {\n conf = conf || getConfig()\n\n // were converting to css styles\n const style = styleIn as Record<string, string | null | undefined>\n\n // transform\n if (style.transform && Array.isArray(style.transform)) {\n style.transform = style.transform\n .map(\n // { scale: 2 } => 'scale(2)'\n // { translateX: 20 } => 'translateX(20px)'\n // { matrix: [1,2,3,4,5,6] } => 'matrix(1,2,3,4,5,6)'\n (transform) => {\n const type = Object.keys(transform)[0]\n const value = transform[type]\n if (type === 'matrix' || type === 'matrix3d') {\n return `${type}(${value.join(',')})`\n }\n return `${type}(${normalizeValueWithProperty(value, type)})`\n }\n )\n .join(' ')\n }\n\n styleToCSS(style)\n\n const out: StyleObject[] = []\n for (const key in style) {\n const value = style[key]\n if (value == null || value == undefined) continue\n const hash = presetHashes[value]\n ? value\n : typeof value === 'string'\n ? simpleHash(value)\n : `${value}`.replace('.', 'dot')\n\n const pseudoPrefix = pseudo ? `0${pseudo.name}-` : ''\n const shortProp = conf.inverseShorthands[key] || key\n const identifier = `_${shortProp}-${pseudoPrefix}${hash}`\n const rules = createAtomicRules(identifier, key, value, pseudo)\n const styleObject: StyleObject = {\n property: key,\n pseudo: pseudo?.name as any,\n value,\n identifier,\n rules,\n }\n out.push(styleObject)\n }\n\n return out\n}\n\nconst presetHashes = {\n none: true,\n}\n\
|
|
5
|
-
"mappings": "AAKA,SAAsB,kBAAkB;AAGxC,SAAS,iBAAiB;AAE1B,SAAS,qBAAqB;AAC9B,SAAS,kCAAkC;AAC3C,SAA2B,yBAAyB;AAapD,MAAM,iBAAiB;AAAA,EACrB,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,kBAAkB;AACpB;AAEO,SAAS,gBAAgB,UAAgC;AAE9D,MAAI,EAAE,SAAS,cAAc,SAAS,cAAc,SAAS,aAAa;AACxE,WAAO,eAAe,QAAQ;AAAA,EAChC;AAGA,QAAM,EAAE,YAAY,YAAY,YAAY,GAAG,KAAK,IAAI;AACxD,MAAI,MAAqB,CAAC;AAE1B,aAAW,CAAC,OAAO,KAAK,KAAK,CAAC,YAAY,YAAY,YAAY,IAAI,EAAE,QAAQ,GAAG;AACjF,QAAI,CAAC;AAAO;AACZ,UAAM,SAAS,eAAe,KAAK;AACnC,UAAM,CAAC,GAAG,KAAK,GAAG,eAAe,OAAO,MAAM,CAAC;AAAA,EACjD;AACA,SAAO;AACT;AAEA,MAAM,QAAQ,oBAAI,IAAI;AAEf,SAAS,eACd,OACA,QACe;AACf,MAAI,CAAC;AAAO,WAAO,CAAC;AACpB,QAAM,MAAM,KAAK,UAAU,KAAK,KAAK,SAAS,KAAK,UAAU,MAAM,IAAI;AACvE,MAAI,MAAM,IAAI,GAAG,GAAG;AAClB,WAAO,MAAM,IAAI,GAAG;AAAA,EACtB;AACA,MAAI,MAAM,OAAO,KAAK;AACpB,UAAM,MAAM;AAAA,EACd;AACA,MAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,QAAI,CAAC,SAAS,OAAO,UAAU,UAAU;AACvC,YAAM,IAAI,MAAM,sBAAsB,OAAO,WAAW,OAAO;AAAA,IACjE;AAAA,EACF;AACA,QAAM,MAAM,qBAAqB,OAAO,MAAM;AAC9C,QAAM,IAAI,KAAK,GAAG;AAClB,SAAO;AACT;AAEA,IAAI;AAEJ,MAAM,uBAAuB,CAC3B,SACA,WACkB;AAClB,SAAO,QAAQ,UAAU;AAGzB,QAAM,QAAQ;AAGd,MAAI,MAAM,aAAa,MAAM,QAAQ,MAAM,SAAS,GAAG;AACrD,UAAM,YAAY,MAAM,UACrB;AAAA;AAAA;AAAA;AAAA,MAIC,CAAC,cAAc;AACb,cAAM,OAAO,OAAO,KAAK,SAAS,EAAE,CAAC;AACrC,cAAM,QAAQ,UAAU,IAAI;AAC5B,YAAI,SAAS,YAAY,SAAS,YAAY;AAC5C,iBAAO,GAAG,QAAQ,MAAM,KAAK,GAAG;AAAA,QAClC;AACA,eAAO,GAAG,QAAQ,2BAA2B,OAAO,IAAI;AAAA,MAC1D;AAAA,IACF,EACC,KAAK,GAAG;AAAA,EACb;AAEA,aAAW,KAAK;AAEhB,QAAM,MAAqB,CAAC;AAC5B,aAAW,OAAO,OAAO;AACvB,UAAM,QAAQ,MAAM,GAAG;
|
|
4
|
+
"sourcesContent": ["/**\n * Some parts adapted from react-native-web\n * Copyright (c) Nicolas Gallagher licensed under the MIT license.\n */\n\nimport { StyleObject, simpleHash } from '@tamagui/helpers'\nimport type { TextStyle, ViewStyle } from 'react-native'\n\nimport { getConfig } from '../config'\nimport { TamaguiInternalConfig } from '../types'\nimport { defaultOffset } from './expandStyles'\nimport { normalizeValueWithProperty } from './normalizeValueWithProperty.js'\nimport { PseudoDescriptor, pseudoDescriptors } from './pseudoDescriptors'\n\n// refactor this file away next...\n\ntype ViewOrTextStyle = ViewStyle | TextStyle\n\nexport type ViewStyleWithPseudos = ViewOrTextStyle & {\n hoverStyle?: ViewOrTextStyle\n pressStyle?: ViewOrTextStyle\n focusStyle?: ViewOrTextStyle\n}\n\n// matching order of the below *0\nconst pseudosOrdered = [\n pseudoDescriptors.hoverStyle,\n pseudoDescriptors.pressStyle,\n pseudoDescriptors.focusStyle,\n]\n\nexport function getStylesAtomic(stylesIn: ViewStyleWithPseudos) {\n // performance optimization\n if (!(stylesIn.hoverStyle || stylesIn.pressStyle || stylesIn.focusStyle)) {\n return getAtomicStyle(stylesIn)\n }\n\n // only for pseudos\n const { hoverStyle, pressStyle, focusStyle, ...base } = stylesIn\n let res: StyleObject[] = []\n // *1 order matched to *0\n for (const [index, style] of [hoverStyle, pressStyle, focusStyle, base].entries()) {\n if (!style) continue\n const pseudo = pseudosOrdered[index]\n res = [...res, ...getAtomicStyle(style, pseudo)]\n }\n return res\n}\n\nconst cache = new Map()\n\nexport function getAtomicStyle(\n style: ViewOrTextStyle,\n pseudo?: PseudoDescriptor\n): StyleObject[] {\n if (!style) return []\n const key = JSON.stringify(style) + (pseudo ? JSON.stringify(pseudo) : '')\n if (cache.has(key)) {\n return cache.get(key)\n }\n if (cache.size > 800) {\n cache.clear()\n }\n if (process.env.NODE_ENV === 'development') {\n if (!style || typeof style !== 'object') {\n throw new Error(`Wrong style type: \"${typeof style}\": ${style}`)\n }\n }\n const out = generateAtomicStyles(style, pseudo)\n cache.set(key, out)\n return out\n}\n\nlet conf: TamaguiInternalConfig\n\nconst generateAtomicStyles = (\n styleIn: ViewStyle & TextStyle,\n pseudo?: PseudoDescriptor\n): StyleObject[] => {\n conf = conf || getConfig()\n\n // were converting to css styles\n const style = styleIn as Record<string, string | null | undefined>\n\n // transform\n if (style.transform && Array.isArray(style.transform)) {\n style.transform = style.transform\n .map(\n // { scale: 2 } => 'scale(2)'\n // { translateX: 20 } => 'translateX(20px)'\n // { matrix: [1,2,3,4,5,6] } => 'matrix(1,2,3,4,5,6)'\n (transform) => {\n const type = Object.keys(transform)[0]\n const value = transform[type]\n if (type === 'matrix' || type === 'matrix3d') {\n return `${type}(${value.join(',')})`\n }\n return `${type}(${normalizeValueWithProperty(value, type)})`\n }\n )\n .join(' ')\n }\n\n styleToCSS(style)\n\n const out: StyleObject[] = []\n for (const key in style) {\n const value = normalizeValueWithProperty(style[key], key)\n if (value == null || value == undefined) continue\n const hash = presetHashes[value]\n ? value\n : typeof value === 'string'\n ? simpleHash(value)\n : `${value}`.replace('.', 'dot')\n\n const pseudoPrefix = pseudo ? `0${pseudo.name}-` : ''\n const shortProp = conf.inverseShorthands[key] || key\n const identifier = `_${shortProp}-${pseudoPrefix}${hash}`\n const rules = createAtomicRules(identifier, key, value, pseudo)\n const styleObject: StyleObject = {\n property: key,\n pseudo: pseudo?.name as any,\n value,\n identifier,\n rules,\n }\n out.push(styleObject)\n }\n\n return out\n}\n\nconst presetHashes = {\n none: true,\n}\n\nexport function styleToCSS(style: Record<string, any>) {\n // box-shadow\n const { shadowOffset, shadowRadius, shadowColor } = style\n if (style.shadowRadius !== undefined) {\n const offset = shadowOffset || defaultOffset\n const shadow = `${normalizeValueWithProperty(\n offset.width\n )} ${normalizeValueWithProperty(offset.height)} ${normalizeValueWithProperty(\n shadowRadius\n )} ${shadowColor}`\n style.boxShadow = style.boxShadow ? `${style.boxShadow}, ${shadow}` : shadow\n style.shadowOffset = undefined\n style.shadowRadius = undefined\n style.shadowColor = undefined\n }\n\n // text-shadow\n const { textShadowColor, textShadowOffset, textShadowRadius } = style\n if (textShadowColor || textShadowOffset || textShadowRadius) {\n const { height, width } = textShadowOffset || defaultOffset\n const radius = textShadowRadius || 0\n const color = normalizeValueWithProperty(textShadowColor, 'textShadowColor')\n if (color && (height !== 0 || width !== 0 || radius !== 0)) {\n const blurRadius = normalizeValueWithProperty(radius)\n const offsetX = normalizeValueWithProperty(width)\n const offsetY = normalizeValueWithProperty(height)\n style.textShadow = `${offsetX} ${offsetY} ${blurRadius} ${color}`\n }\n style.textShadowColor = undefined\n style.textShadowOffset = undefined\n style.textShadowRadius = undefined\n }\n}\n\nfunction createDeclarationBlock(style: Record<string, any>, important = false) {\n let next = ''\n for (const key in style) {\n const prop = hyphenateStyleName(key)\n const value = style[key]\n next += `${prop}:${value}${important ? ' !important' : ''};`\n }\n return `{${next}}`\n}\n\nconst hcache = {}\nconst toHyphenLower = (match: string) => `-${match.toLowerCase()}`\nconst hyphenateStyleName = (key: string) => {\n let val = hcache[key]\n if (val) return val\n hcache[key] = val = key.replace(/[A-Z]/g, toHyphenLower)\n return val\n}\n\nconst pseudoSelectorPrefixes = (() => {\n const res: Record<string, string> = {}\n for (const key in pseudoDescriptors) {\n const pseudo = pseudoDescriptors[key]\n res[pseudo.name] = `${[...Array(pseudo.priority)].map(() => ':root').join('')} `\n }\n return res\n})()\n\nfunction createAtomicRules(\n identifier: string,\n property: string,\n value: any,\n pseudo?: PseudoDescriptor\n): string[] {\n const selector = pseudo\n ? `${pseudoSelectorPrefixes[pseudo.name]} .${identifier}:${pseudo.name}`\n : `.${identifier}`\n const important = !!pseudo\n\n let rules: string[] = []\n\n // Handle non-standard properties and object values that require multiple\n // CSS rules to be created.\n switch (property) {\n // Equivalent to using '::placeholder'\n case 'placeholderTextColor': {\n const block = createDeclarationBlock({ color: value, opacity: 1 }, important)\n rules.push(`${selector}::placeholder${block}`)\n break\n }\n\n // all webkit prefixed rules\n case 'backgroundClip':\n case 'userSelect': {\n const propertyCapitalized = `${property[0].toUpperCase()}${property.slice(1)}`\n const webkitProperty = `Webkit${propertyCapitalized}`\n const block = createDeclarationBlock(\n { [property]: value, [webkitProperty]: value },\n important\n )\n rules.push(`${selector}${block}`)\n break\n }\n\n // Polyfill for additional 'pointer-events' values\n case 'pointerEvents': {\n let finalValue = value\n if (value === 'auto' || value === 'box-only') {\n finalValue = 'auto'\n if (value === 'box-only') {\n rules.push(`${selector}>*${boxOnly}`)\n }\n } else if (value === 'none' || value === 'box-none') {\n finalValue = 'none'\n if (value === 'box-none') {\n rules.push(`${selector}>*${boxNone}`)\n }\n }\n const block = createDeclarationBlock({ pointerEvents: finalValue }, true)\n rules.push(`${selector}${block}`)\n break\n }\n\n default: {\n const block = createDeclarationBlock({ [property]: value }, important)\n rules.push(`${selector}${block}`)\n break\n }\n }\n\n // hover styles need to be conditional\n // perhaps this can be generalized but for now lets just shortcut\n // and hardcode for hover styles, if we need to later we can\n // WEIRD SYNTAX, SEE:\n // https://stackoverflow.com/questions/40532204/media-query-for-devices-supporting-hover\n if (pseudo && pseudo.name === 'hover') {\n rules = rules.map((r) => `@media not all and (hover: none) { ${r} }`)\n }\n\n return rules\n}\n\nconst boxNone = createDeclarationBlock({ pointerEvents: 'auto' }, true)\nconst boxOnly = createDeclarationBlock({ pointerEvents: 'none' }, true)\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { isWeb } from "@tamagui/constants";
|
|
2
2
|
import { getAllSelectors } from "./insertStyleRule";
|
|
3
3
|
import { normalizeColor } from "./normalizeColor";
|
|
4
|
-
const
|
|
4
|
+
const colorCache = {};
|
|
5
5
|
function normalizeValueWithProperty(value, property) {
|
|
6
|
-
const cached =
|
|
6
|
+
const cached = colorCache[value];
|
|
7
7
|
if (cached !== void 0) {
|
|
8
8
|
return cached;
|
|
9
9
|
}
|
|
@@ -11,13 +11,13 @@ function normalizeValueWithProperty(value, property) {
|
|
|
11
11
|
return value;
|
|
12
12
|
}
|
|
13
13
|
let res = value;
|
|
14
|
-
if (process.env.TAMAGUI_TARGET === "web" && typeof value === "number" && (property === void 0 || !(
|
|
14
|
+
if (process.env.TAMAGUI_TARGET === "web" && typeof value === "number" && (property === void 0 || !(property in unitlessNumbers || property in stringNumbers))) {
|
|
15
15
|
res = `${value}px`;
|
|
16
|
-
} else if (isWeb && property !== void 0 && stringNumbers
|
|
16
|
+
} else if (isWeb && property !== void 0 && property in stringNumbers) {
|
|
17
17
|
res = `${res}`;
|
|
18
18
|
} else if (property && property in colorProps) {
|
|
19
19
|
res = normalizeColor(value);
|
|
20
|
-
|
|
20
|
+
colorCache[value] = res;
|
|
21
21
|
}
|
|
22
22
|
return res;
|
|
23
23
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/normalizeValueWithProperty.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * Some parts adapted from react-native-web\n * Copyright (c) Nicolas Gallagher licensed under the MIT license.\n */\n\nimport { isWeb } from '@tamagui/constants'\n\nimport { getAllSelectors } from './insertStyleRule'\nimport { normalizeColor } from './normalizeColor'\n\nconst
|
|
5
|
-
"mappings": "AAKA,SAAS,aAAa;AAEtB,SAAS,uBAAuB;AAChC,SAAS,sBAAsB;AAE/B,MAAM,
|
|
4
|
+
"sourcesContent": ["/**\n * Some parts adapted from react-native-web\n * Copyright (c) Nicolas Gallagher licensed under the MIT license.\n */\n\nimport { isWeb } from '@tamagui/constants'\n\nimport { getAllSelectors } from './insertStyleRule'\nimport { normalizeColor } from './normalizeColor'\n\nconst colorCache = {}\n\nexport function normalizeValueWithProperty(value: any, property?: string): any {\n const cached = colorCache[value]\n if (cached !== undefined) {\n return cached\n }\n if (property && property in unitlessNumbers) {\n return value\n }\n let res = value\n if (\n process.env.TAMAGUI_TARGET === 'web' &&\n typeof value === 'number' &&\n (property === undefined ||\n !(property in unitlessNumbers || property in stringNumbers))\n ) {\n res = `${value}px`\n } else if (isWeb && property !== undefined && property in stringNumbers) {\n res = `${res}`\n } else if (property && property in colorProps) {\n res = normalizeColor(value)\n colorCache[value] = res\n }\n return res\n}\n\n// TODO react-native-web-lite\n\nconst colorProps = {\n backgroundColor: true,\n borderColor: true,\n borderTopColor: true,\n borderRightColor: true,\n borderBottomColor: true,\n borderLeftColor: true,\n color: true,\n shadowColor: true,\n textDecorationColor: true,\n textShadowColor: true,\n}\n\nconst stringNumbers = {\n zIndex: true,\n}\n\nconst unitlessNumbers = {\n WebkitLineClamp: true,\n animationIterationCount: true,\n aspectRatio: true,\n borderImageOutset: true,\n borderImageSlice: true,\n borderImageWidth: true,\n columnCount: true,\n flex: true,\n flexGrow: true,\n flexOrder: true,\n flexPositive: true,\n flexShrink: true,\n flexNegative: true,\n fontWeight: true,\n gridRow: true,\n gridRowEnd: true,\n gridRowGap: true,\n gridRowStart: true,\n gridColumn: true,\n gridColumnEnd: true,\n gridColumnGap: true,\n gridColumnStart: true,\n lineClamp: true,\n opacity: true,\n order: true,\n orphans: true,\n tabSize: true,\n widows: true,\n zoom: true,\n scale: true,\n scaleX: true,\n scaleY: true,\n scaleZ: true,\n shadowOpacity: true,\n}\n\n// getting real values for colors for animations (reverse mapped from CSS)\n// this isn't beautiful, but will do relatively fine performance for now\nconst rcache = {}\nexport function reverseMapClassNameToValue(key: string, className: string) {\n const selectors = getAllSelectors()\n const cssRule = selectors[className]\n if (rcache[cssRule]) return rcache[cssRule]\n if (!cssRule) {\n return\n }\n const cssVal = cssRule.replace(/.*:/, '').replace(/;.*/, '').trim()\n let res: any\n if (cssVal.startsWith('var(')) {\n res = cssVal\n } else if (unitlessNumbers[key]) {\n res = +cssVal\n } else if (cssVal.endsWith('px')) {\n res = +cssVal.replace('px', '')\n } else {\n res = cssVal\n }\n rcache[cssRule] = res\n if (process.env.NODE_ENV === 'development') {\n // ensure we are parsing properly\n if (typeof res === 'number' && isNaN(res)) {\n // eslint-disable-next-line no-console\n console.log('Tamagui invalid parsed value, NaN:', {\n res,\n cssVal,\n cssRule,\n key,\n className,\n })\n }\n }\n return res\n}\n"],
|
|
5
|
+
"mappings": "AAKA,SAAS,aAAa;AAEtB,SAAS,uBAAuB;AAChC,SAAS,sBAAsB;AAE/B,MAAM,aAAa,CAAC;AAEb,SAAS,2BAA2B,OAAY,UAAwB;AAC7E,QAAM,SAAS,WAAW,KAAK;AAC/B,MAAI,WAAW,QAAW;AACxB,WAAO;AAAA,EACT;AACA,MAAI,YAAY,YAAY,iBAAiB;AAC3C,WAAO;AAAA,EACT;AACA,MAAI,MAAM;AACV,MACE,QAAQ,IAAI,mBAAmB,SAC/B,OAAO,UAAU,aAChB,aAAa,UACZ,EAAE,YAAY,mBAAmB,YAAY,iBAC/C;AACA,UAAM,GAAG;AAAA,EACX,WAAW,SAAS,aAAa,UAAa,YAAY,eAAe;AACvE,UAAM,GAAG;AAAA,EACX,WAAW,YAAY,YAAY,YAAY;AAC7C,UAAM,eAAe,KAAK;AAC1B,eAAW,KAAK,IAAI;AAAA,EACtB;AACA,SAAO;AACT;AAIA,MAAM,aAAa;AAAA,EACjB,iBAAiB;AAAA,EACjB,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,kBAAkB;AAAA,EAClB,mBAAmB;AAAA,EACnB,iBAAiB;AAAA,EACjB,OAAO;AAAA,EACP,aAAa;AAAA,EACb,qBAAqB;AAAA,EACrB,iBAAiB;AACnB;AAEA,MAAM,gBAAgB;AAAA,EACpB,QAAQ;AACV;AAEA,MAAM,kBAAkB;AAAA,EACtB,iBAAiB;AAAA,EACjB,yBAAyB;AAAA,EACzB,aAAa;AAAA,EACb,mBAAmB;AAAA,EACnB,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,aAAa;AAAA,EACb,MAAM;AAAA,EACN,UAAU;AAAA,EACV,WAAW;AAAA,EACX,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,eAAe;AAAA,EACf,iBAAiB;AAAA,EACjB,WAAW;AAAA,EACX,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,eAAe;AACjB;AAIA,MAAM,SAAS,CAAC;AACT,SAAS,2BAA2B,KAAa,WAAmB;AACzE,QAAM,YAAY,gBAAgB;AAClC,QAAM,UAAU,UAAU,SAAS;AACnC,MAAI,OAAO,OAAO;AAAG,WAAO,OAAO,OAAO;AAC1C,MAAI,CAAC,SAAS;AACZ;AAAA,EACF;AACA,QAAM,SAAS,QAAQ,QAAQ,OAAO,EAAE,EAAE,QAAQ,OAAO,EAAE,EAAE,KAAK;AAClE,MAAI;AACJ,MAAI,OAAO,WAAW,MAAM,GAAG;AAC7B,UAAM;AAAA,EACR,WAAW,gBAAgB,GAAG,GAAG;AAC/B,UAAM,CAAC;AAAA,EACT,WAAW,OAAO,SAAS,IAAI,GAAG;AAChC,UAAM,CAAC,OAAO,QAAQ,MAAM,EAAE;AAAA,EAChC,OAAO;AACL,UAAM;AAAA,EACR;AACA,SAAO,OAAO,IAAI;AAClB,MAAI,QAAQ,IAAI,aAAa,eAAe;AAE1C,QAAI,OAAO,QAAQ,YAAY,MAAM,GAAG,GAAG;AAEzC,cAAQ,IAAI,sCAAsC;AAAA,QAChD;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF;AACA,SAAO;AACT;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { isWeb } from "@tamagui/constants";
|
|
2
2
|
import { getAllSelectors } from "./insertStyleRule";
|
|
3
3
|
import { normalizeColor } from "./normalizeColor";
|
|
4
|
-
const
|
|
4
|
+
const colorCache = {};
|
|
5
5
|
function normalizeValueWithProperty(value, property) {
|
|
6
|
-
const cached =
|
|
6
|
+
const cached = colorCache[value];
|
|
7
7
|
if (cached !== void 0) {
|
|
8
8
|
return cached;
|
|
9
9
|
}
|
|
@@ -11,13 +11,13 @@ function normalizeValueWithProperty(value, property) {
|
|
|
11
11
|
return value;
|
|
12
12
|
}
|
|
13
13
|
let res = value;
|
|
14
|
-
if (process.env.TAMAGUI_TARGET === "web" && typeof value === "number" && (property === void 0 || !(
|
|
14
|
+
if (process.env.TAMAGUI_TARGET === "web" && typeof value === "number" && (property === void 0 || !(property in unitlessNumbers || property in stringNumbers))) {
|
|
15
15
|
res = `${value}px`;
|
|
16
|
-
} else if (isWeb && property !== void 0 && stringNumbers
|
|
16
|
+
} else if (isWeb && property !== void 0 && property in stringNumbers) {
|
|
17
17
|
res = `${res}`;
|
|
18
18
|
} else if (property && property in colorProps) {
|
|
19
19
|
res = normalizeColor(value);
|
|
20
|
-
|
|
20
|
+
colorCache[value] = res;
|
|
21
21
|
}
|
|
22
22
|
return res;
|
|
23
23
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/normalizeValueWithProperty.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * Some parts adapted from react-native-web\n * Copyright (c) Nicolas Gallagher licensed under the MIT license.\n */\n\nimport { isWeb } from '@tamagui/constants'\n\nimport { getAllSelectors } from './insertStyleRule'\nimport { normalizeColor } from './normalizeColor'\n\nconst
|
|
5
|
-
"mappings": "AAKA,SAAS,aAAa;AAEtB,SAAS,uBAAuB;AAChC,SAAS,sBAAsB;AAE/B,MAAM,
|
|
4
|
+
"sourcesContent": ["/**\n * Some parts adapted from react-native-web\n * Copyright (c) Nicolas Gallagher licensed under the MIT license.\n */\n\nimport { isWeb } from '@tamagui/constants'\n\nimport { getAllSelectors } from './insertStyleRule'\nimport { normalizeColor } from './normalizeColor'\n\nconst colorCache = {}\n\nexport function normalizeValueWithProperty(value: any, property?: string): any {\n const cached = colorCache[value]\n if (cached !== undefined) {\n return cached\n }\n if (property && property in unitlessNumbers) {\n return value\n }\n let res = value\n if (\n process.env.TAMAGUI_TARGET === 'web' &&\n typeof value === 'number' &&\n (property === undefined ||\n !(property in unitlessNumbers || property in stringNumbers))\n ) {\n res = `${value}px`\n } else if (isWeb && property !== undefined && property in stringNumbers) {\n res = `${res}`\n } else if (property && property in colorProps) {\n res = normalizeColor(value)\n colorCache[value] = res\n }\n return res\n}\n\n// TODO react-native-web-lite\n\nconst colorProps = {\n backgroundColor: true,\n borderColor: true,\n borderTopColor: true,\n borderRightColor: true,\n borderBottomColor: true,\n borderLeftColor: true,\n color: true,\n shadowColor: true,\n textDecorationColor: true,\n textShadowColor: true,\n}\n\nconst stringNumbers = {\n zIndex: true,\n}\n\nconst unitlessNumbers = {\n WebkitLineClamp: true,\n animationIterationCount: true,\n aspectRatio: true,\n borderImageOutset: true,\n borderImageSlice: true,\n borderImageWidth: true,\n columnCount: true,\n flex: true,\n flexGrow: true,\n flexOrder: true,\n flexPositive: true,\n flexShrink: true,\n flexNegative: true,\n fontWeight: true,\n gridRow: true,\n gridRowEnd: true,\n gridRowGap: true,\n gridRowStart: true,\n gridColumn: true,\n gridColumnEnd: true,\n gridColumnGap: true,\n gridColumnStart: true,\n lineClamp: true,\n opacity: true,\n order: true,\n orphans: true,\n tabSize: true,\n widows: true,\n zoom: true,\n scale: true,\n scaleX: true,\n scaleY: true,\n scaleZ: true,\n shadowOpacity: true,\n}\n\n// getting real values for colors for animations (reverse mapped from CSS)\n// this isn't beautiful, but will do relatively fine performance for now\nconst rcache = {}\nexport function reverseMapClassNameToValue(key: string, className: string) {\n const selectors = getAllSelectors()\n const cssRule = selectors[className]\n if (rcache[cssRule]) return rcache[cssRule]\n if (!cssRule) {\n return\n }\n const cssVal = cssRule.replace(/.*:/, '').replace(/;.*/, '').trim()\n let res: any\n if (cssVal.startsWith('var(')) {\n res = cssVal\n } else if (unitlessNumbers[key]) {\n res = +cssVal\n } else if (cssVal.endsWith('px')) {\n res = +cssVal.replace('px', '')\n } else {\n res = cssVal\n }\n rcache[cssRule] = res\n if (process.env.NODE_ENV === 'development') {\n // ensure we are parsing properly\n if (typeof res === 'number' && isNaN(res)) {\n // eslint-disable-next-line no-console\n console.log('Tamagui invalid parsed value, NaN:', {\n res,\n cssVal,\n cssRule,\n key,\n className,\n })\n }\n }\n return res\n}\n"],
|
|
5
|
+
"mappings": "AAKA,SAAS,aAAa;AAEtB,SAAS,uBAAuB;AAChC,SAAS,sBAAsB;AAE/B,MAAM,aAAa,CAAC;AAEb,SAAS,2BAA2B,OAAY,UAAwB;AAC7E,QAAM,SAAS,WAAW,KAAK;AAC/B,MAAI,WAAW,QAAW;AACxB,WAAO;AAAA,EACT;AACA,MAAI,YAAY,YAAY,iBAAiB;AAC3C,WAAO;AAAA,EACT;AACA,MAAI,MAAM;AACV,MACE,QAAQ,IAAI,mBAAmB,SAC/B,OAAO,UAAU,aAChB,aAAa,UACZ,EAAE,YAAY,mBAAmB,YAAY,iBAC/C;AACA,UAAM,GAAG;AAAA,EACX,WAAW,SAAS,aAAa,UAAa,YAAY,eAAe;AACvE,UAAM,GAAG;AAAA,EACX,WAAW,YAAY,YAAY,YAAY;AAC7C,UAAM,eAAe,KAAK;AAC1B,eAAW,KAAK,IAAI;AAAA,EACtB;AACA,SAAO;AACT;AAIA,MAAM,aAAa;AAAA,EACjB,iBAAiB;AAAA,EACjB,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,kBAAkB;AAAA,EAClB,mBAAmB;AAAA,EACnB,iBAAiB;AAAA,EACjB,OAAO;AAAA,EACP,aAAa;AAAA,EACb,qBAAqB;AAAA,EACrB,iBAAiB;AACnB;AAEA,MAAM,gBAAgB;AAAA,EACpB,QAAQ;AACV;AAEA,MAAM,kBAAkB;AAAA,EACtB,iBAAiB;AAAA,EACjB,yBAAyB;AAAA,EACzB,aAAa;AAAA,EACb,mBAAmB;AAAA,EACnB,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,aAAa;AAAA,EACb,MAAM;AAAA,EACN,UAAU;AAAA,EACV,WAAW;AAAA,EACX,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,eAAe;AAAA,EACf,iBAAiB;AAAA,EACjB,WAAW;AAAA,EACX,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,eAAe;AACjB;AAIA,MAAM,SAAS,CAAC;AACT,SAAS,2BAA2B,KAAa,WAAmB;AACzE,QAAM,YAAY,gBAAgB;AAClC,QAAM,UAAU,UAAU,SAAS;AACnC,MAAI,OAAO,OAAO;AAAG,WAAO,OAAO,OAAO;AAC1C,MAAI,CAAC,SAAS;AACZ;AAAA,EACF;AACA,QAAM,SAAS,QAAQ,QAAQ,OAAO,EAAE,EAAE,QAAQ,OAAO,EAAE,EAAE,KAAK;AAClE,MAAI;AACJ,MAAI,OAAO,WAAW,MAAM,GAAG;AAC7B,UAAM;AAAA,EACR,WAAW,gBAAgB,GAAG,GAAG;AAC/B,UAAM,CAAC;AAAA,EACT,WAAW,OAAO,SAAS,IAAI,GAAG;AAChC,UAAM,CAAC,OAAO,QAAQ,MAAM,EAAE;AAAA,EAChC,OAAO;AACL,UAAM;AAAA,EACR;AACA,SAAO,OAAO,IAAI;AAClB,MAAI,QAAQ,IAAI,aAAa,eAAe;AAE1C,QAAI,OAAO,QAAQ,YAAY,MAAM,GAAG,GAAG;AAEzC,cAAQ,IAAI,sCAAsC;AAAA,QAChD;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF;AACA,SAAO;AACT;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/web",
|
|
3
|
-
"version": "1.2.
|
|
3
|
+
"version": "1.2.14",
|
|
4
4
|
"source": "src/index.ts",
|
|
5
5
|
"main": "dist/cjs",
|
|
6
6
|
"module": "dist/esm",
|
|
@@ -27,20 +27,20 @@
|
|
|
27
27
|
"reset.css"
|
|
28
28
|
],
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@tamagui/compose-refs": "^1.2.
|
|
31
|
-
"@tamagui/constants": "^1.2.
|
|
32
|
-
"@tamagui/helpers": "^1.2.
|
|
33
|
-
"@tamagui/normalize-css-color": "^1.2.
|
|
34
|
-
"@tamagui/use-did-finish-ssr": "^1.2.
|
|
35
|
-
"@tamagui/use-event": "^1.2.
|
|
36
|
-
"@tamagui/use-force-update": "^1.2.
|
|
30
|
+
"@tamagui/compose-refs": "^1.2.14",
|
|
31
|
+
"@tamagui/constants": "^1.2.14",
|
|
32
|
+
"@tamagui/helpers": "^1.2.14",
|
|
33
|
+
"@tamagui/normalize-css-color": "^1.2.14",
|
|
34
|
+
"@tamagui/use-did-finish-ssr": "^1.2.14",
|
|
35
|
+
"@tamagui/use-event": "^1.2.14",
|
|
36
|
+
"@tamagui/use-force-update": "^1.2.14"
|
|
37
37
|
},
|
|
38
38
|
"peerDependencies": {
|
|
39
39
|
"react": "*",
|
|
40
40
|
"react-dom": "*"
|
|
41
41
|
},
|
|
42
42
|
"devDependencies": {
|
|
43
|
-
"@tamagui/build": "^1.2.
|
|
43
|
+
"@tamagui/build": "^1.2.14",
|
|
44
44
|
"@testing-library/react": "^13.4.0",
|
|
45
45
|
"csstype": "^3.0.10",
|
|
46
46
|
"react": "^18.2.0",
|
|
@@ -105,7 +105,7 @@ const generateAtomicStyles = (
|
|
|
105
105
|
|
|
106
106
|
const out: StyleObject[] = []
|
|
107
107
|
for (const key in style) {
|
|
108
|
-
const value = style[key]
|
|
108
|
+
const value = normalizeValueWithProperty(style[key], key)
|
|
109
109
|
if (value == null || value == undefined) continue
|
|
110
110
|
const hash = presetHashes[value]
|
|
111
111
|
? value
|
|
@@ -134,14 +134,14 @@ const presetHashes = {
|
|
|
134
134
|
none: true,
|
|
135
135
|
}
|
|
136
136
|
|
|
137
|
-
const n = normalizeValueWithProperty
|
|
138
|
-
|
|
139
137
|
export function styleToCSS(style: Record<string, any>) {
|
|
140
138
|
// box-shadow
|
|
141
139
|
const { shadowOffset, shadowRadius, shadowColor } = style
|
|
142
140
|
if (style.shadowRadius !== undefined) {
|
|
143
141
|
const offset = shadowOffset || defaultOffset
|
|
144
|
-
const shadow = `${
|
|
142
|
+
const shadow = `${normalizeValueWithProperty(
|
|
143
|
+
offset.width
|
|
144
|
+
)} ${normalizeValueWithProperty(offset.height)} ${normalizeValueWithProperty(
|
|
145
145
|
shadowRadius
|
|
146
146
|
)} ${shadowColor}`
|
|
147
147
|
style.boxShadow = style.boxShadow ? `${style.boxShadow}, ${shadow}` : shadow
|
|
@@ -8,10 +8,10 @@ import { isWeb } from '@tamagui/constants'
|
|
|
8
8
|
import { getAllSelectors } from './insertStyleRule'
|
|
9
9
|
import { normalizeColor } from './normalizeColor'
|
|
10
10
|
|
|
11
|
-
const
|
|
11
|
+
const colorCache = {}
|
|
12
12
|
|
|
13
13
|
export function normalizeValueWithProperty(value: any, property?: string): any {
|
|
14
|
-
const cached =
|
|
14
|
+
const cached = colorCache[value]
|
|
15
15
|
if (cached !== undefined) {
|
|
16
16
|
return cached
|
|
17
17
|
}
|
|
@@ -22,14 +22,15 @@ export function normalizeValueWithProperty(value: any, property?: string): any {
|
|
|
22
22
|
if (
|
|
23
23
|
process.env.TAMAGUI_TARGET === 'web' &&
|
|
24
24
|
typeof value === 'number' &&
|
|
25
|
-
(property === undefined ||
|
|
25
|
+
(property === undefined ||
|
|
26
|
+
!(property in unitlessNumbers || property in stringNumbers))
|
|
26
27
|
) {
|
|
27
28
|
res = `${value}px`
|
|
28
|
-
} else if (isWeb && property !== undefined && stringNumbers
|
|
29
|
+
} else if (isWeb && property !== undefined && property in stringNumbers) {
|
|
29
30
|
res = `${res}`
|
|
30
31
|
} else if (property && property in colorProps) {
|
|
31
32
|
res = normalizeColor(value)
|
|
32
|
-
|
|
33
|
+
colorCache[value] = res
|
|
33
34
|
}
|
|
34
35
|
return res
|
|
35
36
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getStylesAtomic.d.ts","sourceRoot":"","sources":["../../src/helpers/getStylesAtomic.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,WAAW,EAAc,MAAM,kBAAkB,CAAA;AAC1D,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAMxD,OAAO,EAAE,gBAAgB,EAAqB,MAAM,qBAAqB,CAAA;AAIzE,KAAK,eAAe,GAAG,SAAS,GAAG,SAAS,CAAA;AAE5C,MAAM,MAAM,oBAAoB,GAAG,eAAe,GAAG;IACnD,UAAU,CAAC,EAAE,eAAe,CAAA;IAC5B,UAAU,CAAC,EAAE,eAAe,CAAA;IAC5B,UAAU,CAAC,EAAE,eAAe,CAAA;CAC7B,CAAA;AASD,wBAAgB,eAAe,CAAC,QAAQ,EAAE,oBAAoB,iBAgB7D;AAID,wBAAgB,cAAc,CAC5B,KAAK,EAAE,eAAe,EACtB,MAAM,CAAC,EAAE,gBAAgB,GACxB,WAAW,EAAE,CAiBf;
|
|
1
|
+
{"version":3,"file":"getStylesAtomic.d.ts","sourceRoot":"","sources":["../../src/helpers/getStylesAtomic.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,WAAW,EAAc,MAAM,kBAAkB,CAAA;AAC1D,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAMxD,OAAO,EAAE,gBAAgB,EAAqB,MAAM,qBAAqB,CAAA;AAIzE,KAAK,eAAe,GAAG,SAAS,GAAG,SAAS,CAAA;AAE5C,MAAM,MAAM,oBAAoB,GAAG,eAAe,GAAG;IACnD,UAAU,CAAC,EAAE,eAAe,CAAA;IAC5B,UAAU,CAAC,EAAE,eAAe,CAAA;IAC5B,UAAU,CAAC,EAAE,eAAe,CAAA;CAC7B,CAAA;AASD,wBAAgB,eAAe,CAAC,QAAQ,EAAE,oBAAoB,iBAgB7D;AAID,wBAAgB,cAAc,CAC5B,KAAK,EAAE,eAAe,EACtB,MAAM,CAAC,EAAE,gBAAgB,GACxB,WAAW,EAAE,CAiBf;AAiED,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAgCpD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"normalizeValueWithProperty.d.ts","sourceRoot":"","sources":["../../src/helpers/normalizeValueWithProperty.ts"],"names":[],"mappings":"AAAA;;;GAGG;AASH,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,GAAG,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,GAAG,
|
|
1
|
+
{"version":3,"file":"normalizeValueWithProperty.d.ts","sourceRoot":"","sources":["../../src/helpers/normalizeValueWithProperty.ts"],"names":[],"mappings":"AAAA;;;GAGG;AASH,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,GAAG,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,GAAG,CAuB7E;AA6DD,wBAAgB,0BAA0B,CAAC,GAAG,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,OAiCxE"}
|