@tamagui/core 1.0.1-beta.202 → 1.0.1-beta.203
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/createComponent.js +8 -11
- package/dist/cjs/createComponent.js.map +2 -2
- package/dist/cjs/helpers/getSplitStyles.js +9 -2
- package/dist/cjs/helpers/getSplitStyles.js.map +2 -2
- package/dist/cjs/helpers/insertStyleRule.js +4 -0
- package/dist/cjs/helpers/insertStyleRule.js.map +2 -2
- package/dist/esm/createComponent.js +8 -11
- package/dist/esm/createComponent.js.map +2 -2
- package/dist/esm/helpers/getSplitStyles.js +9 -2
- package/dist/esm/helpers/getSplitStyles.js.map +2 -2
- package/dist/esm/helpers/insertStyleRule.js +4 -0
- package/dist/esm/helpers/insertStyleRule.js.map +2 -2
- package/package.json +12 -12
- package/src/createComponent.tsx +23 -27
- package/src/helpers/getSplitStyles.tsx +11 -5
- package/src/helpers/insertStyleRule.tsx +5 -0
|
@@ -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\nimport type { StyleObject } from '@tamagui/helpers'\n\nconst allSelectors: Record<string, string> = {}\nconst allRules: Record<string, boolean | string[]> = {}\nexport const insertedTransforms = {}\n\nexport const getAllSelectors = () => allSelectors\nexport const getAllRules = () => Object.values(allRules)\nexport const getAllTransforms = () => insertedTransforms\n\n// keep transforms in map for merging later\nfunction addTransform(identifier: string, css: string, rule?: CSSRule) {\n const s = css.indexOf('transform:')\n if (s === -1) {\n if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.groupCollapsed(`\u274C Invalid transform, likely used deg/% improperly ${identifier}`)\n // eslint-disable-next-line no-console\n console.log('rule:', rule)\n // eslint-disable-next-line no-console\n console.trace()\n // eslint-disable-next-line no-console\n console.groupEnd()\n } else {\n // missing transform\n }\n return false\n }\n const startI = s + 'transform:'.length\n const endI = css.indexOf(';')\n const value = css.slice(startI, endI)\n if (!insertedTransforms[identifier]) {\n insertedTransforms[identifier] = value\n return true\n }\n return false\n}\n\nconst isClient = typeof document !== 'undefined'\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\nconst scannedNum = new WeakMap<CSSStyleSheet, number>()\n\nexport function updateInserted() {\n if (process.env.NODE_ENV === 'test') return\n if (!isClient) return\n const sheets = document.styleSheets\n if (!sheets) return\n for (let i = 0; i < sheets.length; i++) {\n const sheet = sheets[i]\n if (!sheet) continue\n\n // avoid errors on cross origin sheets\n // https://stackoverflow.com/questions/49993633/uncaught-domexception-failed-to-read-the-cssrules-property\n let rules: CSSRuleList\n try {\n rules = sheet.cssRules\n } catch {\n continue\n }\n\n const len = rules.length\n const lastScanned = scannedNum.get(sheet) ?? 0\n if (lastScanned === len) {\n continue\n }\n for (let i = lastScanned; i < len; i++) {\n const rule = rules[i]\n const response = getTamaguiSelector(rule)\n if (!response) {\n continue\n }\n const [identifier, cssRule] = response\n if (!allSelectors[identifier]) {\n const isTransform = identifier.startsWith('_transform')\n const shouldInsert = isTransform ? addTransform(identifier, cssRule.cssText, cssRule) : true\n if (shouldInsert) {\n allSelectors[identifier] = cssRule.cssText\n }\n }\n }\n scannedNum.set(sheet, i)\n }\n}\n\nfunction getTamaguiSelector(rule: CSSRule | null): readonly [string, CSSStyleRule] | null {\n if (rule instanceof CSSStyleRule) {\n const text = rule.selectorText\n if (text.startsWith('._')) {\n return [text.slice(1), rule]\n }\n if (text.startsWith(':root') && text.includes('._')) {\n return [getIdentifierFromTamaguiSelector(text), rule]\n }\n } else if (rule instanceof CSSMediaRule) {\n // tamagui only ever inserts 1 rule per media\n if (rule.cssRules.length > 1) return null\n return getTamaguiSelector(rule.cssRules[0])\n }\n return null\n}\n\nconst getIdentifierFromTamaguiSelector = (selector: string) =>\n selector\n .replace(/(:root)+\\s+/, '')\n .replace(/:[a-z]+$/, '')\n .slice(1)\n\n// move this to probably inside createTamagui\nupdateInserted()\n\nconst sheet = isClient ? document.head.appendChild(document.createElement('style')).sheet : null\n\nexport function updateRules(identifier: string, rules: string[]) {\n if (allRules[identifier]) return false\n allRules[identifier] = rules\n if (identifier.startsWith('_transform')) {\n return addTransform(identifier, rules[0])\n }\n return true\n}\n\n// [property, identifier, rules]\nexport type PartialStyleObject = Pick<StyleObject, 'identifier' | 'property' | 'rules'>\nexport type RulesToInsert = PartialStyleObject[]\n\nexport function insertStyleRules(rulesToInsert: RulesToInsert) {\n if (isClient && !sheet) {\n if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.warn(`Missing sheet`)\n }\n return\n }\n for (const { identifier, rules } of rulesToInsert) {\n if (allSelectors[identifier]) continue\n allSelectors[identifier] = process.env.NODE_ENV === 'development' ? rules.join('\\n') : ''\n updateRules(identifier, rules)\n if (sheet) {\n for (const rule of rules) {\n sheet.insertRule(rule, sheet.cssRules.length)\n }\n }\n }\n}\n\nexport function shouldInsertStyleRules(styleObject: PartialStyleObject) {\n return !allSelectors[styleObject.identifier]\n}\n"],
|
|
5
|
-
"mappings": "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
|
|
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\nimport type { StyleObject } from '@tamagui/helpers'\n\nconst allSelectors: Record<string, string> = {}\nconst allRules: Record<string, boolean | string[]> = {}\nexport const insertedTransforms = {}\n\nexport const getAllSelectors = () => allSelectors\nexport const getAllRules = () => Object.values(allRules)\nexport const getAllTransforms = () => insertedTransforms\n\n// keep transforms in map for merging later\nfunction addTransform(identifier: string, css: string, rule?: CSSRule) {\n const s = css.indexOf('transform:')\n if (s === -1) {\n if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.groupCollapsed(`\u274C Invalid transform, likely used deg/% improperly ${identifier}`)\n // eslint-disable-next-line no-console\n console.log('rule:', rule)\n // eslint-disable-next-line no-console\n console.trace()\n // eslint-disable-next-line no-console\n console.groupEnd()\n } else {\n // missing transform\n }\n return false\n }\n const startI = s + 'transform:'.length\n const endI = css.indexOf(';')\n const value = css.slice(startI, endI)\n if (!insertedTransforms[identifier]) {\n insertedTransforms[identifier] = value\n return true\n }\n return false\n}\n\nconst isClient = typeof document !== 'undefined'\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\nconst scannedNum = new WeakMap<CSSStyleSheet, number>()\n\nexport function updateInserted() {\n if (process.env.NODE_ENV === 'test') return\n if (!isClient) return\n const sheets = document.styleSheets\n if (!sheets) return\n for (let i = 0; i < sheets.length; i++) {\n const sheet = sheets[i]\n if (!sheet) continue\n\n // avoid errors on cross origin sheets\n // https://stackoverflow.com/questions/49993633/uncaught-domexception-failed-to-read-the-cssrules-property\n let rules: CSSRuleList\n try {\n rules = sheet.cssRules\n } catch {\n continue\n }\n\n const len = rules.length\n const lastScanned = scannedNum.get(sheet) ?? 0\n if (lastScanned === len) {\n continue\n }\n for (let i = lastScanned; i < len; i++) {\n const rule = rules[i]\n const response = getTamaguiSelector(rule)\n if (!response) {\n continue\n }\n const [identifier, cssRule] = response\n if (!allSelectors[identifier]) {\n const isTransform = identifier.startsWith('_transform')\n const shouldInsert = isTransform ? addTransform(identifier, cssRule.cssText, cssRule) : true\n if (shouldInsert) {\n allSelectors[identifier] = cssRule.cssText\n }\n }\n }\n scannedNum.set(sheet, i)\n }\n}\n\nfunction getTamaguiSelector(rule: CSSRule | null): readonly [string, CSSStyleRule] | null {\n if (rule instanceof CSSStyleRule) {\n const text = rule.selectorText\n if (text.startsWith('._')) {\n return [text.slice(1), rule]\n }\n if (text.startsWith(':root') && text.includes('._')) {\n return [getIdentifierFromTamaguiSelector(text), rule]\n }\n } else if (rule instanceof CSSMediaRule) {\n // tamagui only ever inserts 1 rule per media\n if (rule.cssRules.length > 1) return null\n return getTamaguiSelector(rule.cssRules[0])\n }\n return null\n}\n\nconst getIdentifierFromTamaguiSelector = (selector: string) =>\n selector\n .replace(/(:root)+\\s+/, '')\n .replace(/:[a-z]+$/, '')\n .slice(1)\n\n// move this to probably inside createTamagui\nupdateInserted()\n\nconst sheet = isClient ? document.head.appendChild(document.createElement('style')).sheet : null\n\nexport function updateRules(identifier: string, rules: string[]) {\n if (allRules[identifier]) return false\n allRules[identifier] = rules\n if (identifier.startsWith('_transform')) {\n return addTransform(identifier, rules[0])\n }\n return true\n}\n\n// [property, identifier, rules]\nexport type PartialStyleObject = Pick<StyleObject, 'identifier' | 'property' | 'rules'>\nexport type RulesToInsert = PartialStyleObject[]\n\nexport function insertStyleRules(rulesToInsert: RulesToInsert) {\n if (isClient && !sheet) {\n if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.warn(`Missing sheet`)\n }\n return\n }\n for (const { identifier, rules } of rulesToInsert) {\n if (allSelectors[identifier]) continue\n allSelectors[identifier] = process.env.NODE_ENV === 'development' ? rules.join('\\n') : ''\n updateRules(identifier, rules)\n if (sheet) {\n for (const rule of rules) {\n sheet.insertRule(rule, sheet.cssRules.length)\n }\n }\n }\n}\n\nconst IS_STATIC = process.env.IS_STATIC === 'is_static'\n\nexport function shouldInsertStyleRules(styleObject: PartialStyleObject) {\n if (IS_STATIC) {\n return true\n }\n return !allSelectors[styleObject.identifier]\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["sheet", "i"]
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/core",
|
|
3
|
-
"version": "1.0.1-beta.
|
|
3
|
+
"version": "1.0.1-beta.203",
|
|
4
4
|
"source": "src/index.ts",
|
|
5
5
|
"main": "dist/cjs",
|
|
6
6
|
"module": "dist/esm",
|
|
@@ -28,23 +28,23 @@
|
|
|
28
28
|
],
|
|
29
29
|
"dependencies": {
|
|
30
30
|
"@expo/match-media": "^0.3.0",
|
|
31
|
-
"@tamagui/compose-refs": "^1.0.1-beta.
|
|
32
|
-
"@tamagui/constants": "^1.0.1-beta.
|
|
33
|
-
"@tamagui/helpers": "^1.0.1-beta.
|
|
34
|
-
"@tamagui/normalize-css-color-lite": "^1.0.1-beta.
|
|
35
|
-
"@tamagui/react-native-use-pressable": "^1.0.1-beta.
|
|
36
|
-
"@tamagui/react-native-use-responder-events": "^1.0.1-beta.
|
|
37
|
-
"@tamagui/types-react-native": "^1.0.1-beta.
|
|
38
|
-
"@tamagui/use-did-finish-ssr": "^1.0.1-beta.
|
|
39
|
-
"@tamagui/use-event": "^1.0.1-beta.
|
|
40
|
-
"@tamagui/use-force-update": "^1.0.1-beta.
|
|
31
|
+
"@tamagui/compose-refs": "^1.0.1-beta.203",
|
|
32
|
+
"@tamagui/constants": "^1.0.1-beta.203",
|
|
33
|
+
"@tamagui/helpers": "^1.0.1-beta.203",
|
|
34
|
+
"@tamagui/normalize-css-color-lite": "^1.0.1-beta.203",
|
|
35
|
+
"@tamagui/react-native-use-pressable": "^1.0.1-beta.203",
|
|
36
|
+
"@tamagui/react-native-use-responder-events": "^1.0.1-beta.203",
|
|
37
|
+
"@tamagui/types-react-native": "^1.0.1-beta.203",
|
|
38
|
+
"@tamagui/use-did-finish-ssr": "^1.0.1-beta.203",
|
|
39
|
+
"@tamagui/use-event": "^1.0.1-beta.203",
|
|
40
|
+
"@tamagui/use-force-update": "^1.0.1-beta.203"
|
|
41
41
|
},
|
|
42
42
|
"peerDependencies": {
|
|
43
43
|
"react": "*",
|
|
44
44
|
"react-dom": "*"
|
|
45
45
|
},
|
|
46
46
|
"devDependencies": {
|
|
47
|
-
"@tamagui/build": "^1.0.1-beta.
|
|
47
|
+
"@tamagui/build": "^1.0.1-beta.203",
|
|
48
48
|
"@types/node": "^16.11.9",
|
|
49
49
|
"@types/react": "^18.0.15",
|
|
50
50
|
"@types/react-native": "^0.69.2",
|
package/src/createComponent.tsx
CHANGED
|
@@ -702,21 +702,24 @@ export function createComponent<
|
|
|
702
702
|
|
|
703
703
|
const handlesPressEvents = !isWeb && !asChild
|
|
704
704
|
|
|
705
|
-
// check presence to prevent reparenting bugs
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
705
|
+
// check presence rather than value to prevent reparenting bugs
|
|
706
|
+
// allows for onPress={x ? function : undefined} without re-ordering dom
|
|
707
|
+
const shouldAttach = asChild
|
|
708
|
+
? false
|
|
709
|
+
: Boolean(
|
|
710
|
+
attachPress ||
|
|
711
|
+
attachHover ||
|
|
712
|
+
'pressStyle' in props ||
|
|
713
|
+
'onPress' in props ||
|
|
714
|
+
'onPressIn' in props ||
|
|
715
|
+
'onPressOut' in props ||
|
|
716
|
+
(isWeb &&
|
|
717
|
+
('hoverStyle' in props ||
|
|
718
|
+
'onHoverIn' in props ||
|
|
719
|
+
'onHoverOut' in props ||
|
|
720
|
+
'onMouseEnter' in props ||
|
|
721
|
+
'onMouseLeave' in props))
|
|
722
|
+
)
|
|
720
723
|
|
|
721
724
|
const events =
|
|
722
725
|
shouldAttach && !isRSC
|
|
@@ -904,19 +907,9 @@ export function createComponent<
|
|
|
904
907
|
</span>
|
|
905
908
|
)
|
|
906
909
|
}
|
|
907
|
-
|
|
908
|
-
// special weird case since there's a bug in RNW where we can't animate + pass style { $$css }
|
|
909
|
-
// but we need is_font classnames... need to see about RNW bug and then can remove this
|
|
910
|
-
if (isText && isAnimatedReactNativeWeb) {
|
|
911
|
-
content = (
|
|
912
|
-
<span className={fontFamilyClassName} style={styleDisplayContents}>
|
|
913
|
-
{content}
|
|
914
|
-
</span>
|
|
915
|
-
)
|
|
916
|
-
}
|
|
917
910
|
}
|
|
918
911
|
|
|
919
|
-
if (process.env.NODE_ENV === 'development') {
|
|
912
|
+
if (process.env.NODE_ENV === 'development' && process.env.DEBUG !== 'tamagui') {
|
|
920
913
|
if (debugProp) {
|
|
921
914
|
const element = typeof elementType === 'string' ? elementType : 'Component'
|
|
922
915
|
// eslint-disable-next-line no-console
|
|
@@ -1011,6 +1004,8 @@ export function createComponent<
|
|
|
1011
1004
|
defaultTag = ourProps.tag
|
|
1012
1005
|
}
|
|
1013
1006
|
|
|
1007
|
+
const noClassNames = !staticConfig.acceptsClassName
|
|
1008
|
+
|
|
1014
1009
|
initialSplitStyles = insertSplitStyles(
|
|
1015
1010
|
ourProps,
|
|
1016
1011
|
staticConfig,
|
|
@@ -1022,7 +1017,7 @@ export function createComponent<
|
|
|
1022
1017
|
pressIn: false,
|
|
1023
1018
|
focus: false,
|
|
1024
1019
|
resolveVariablesAs: 'both',
|
|
1025
|
-
noClassNames
|
|
1020
|
+
noClassNames,
|
|
1026
1021
|
keepVariantsAsProps: true,
|
|
1027
1022
|
},
|
|
1028
1023
|
undefined,
|
|
@@ -1085,6 +1080,7 @@ export function createComponent<
|
|
|
1085
1080
|
ourClassNames,
|
|
1086
1081
|
defaultsClassnames,
|
|
1087
1082
|
defaultTag,
|
|
1083
|
+
noClassNames,
|
|
1088
1084
|
})
|
|
1089
1085
|
}
|
|
1090
1086
|
}
|
|
@@ -57,6 +57,7 @@ const skipProps = {
|
|
|
57
57
|
}
|
|
58
58
|
|
|
59
59
|
const emptyObject = {}
|
|
60
|
+
const IS_STATIC = process.env.IS_STATIC === 'is_static'
|
|
60
61
|
|
|
61
62
|
// native only skips
|
|
62
63
|
if (process.env.TAMAGUI_TARGET === 'native') {
|
|
@@ -193,13 +194,12 @@ export const getSplitStyles: StyleSplitter = (
|
|
|
193
194
|
const propKeys = Object.keys(props)
|
|
194
195
|
|
|
195
196
|
const shouldDoClasses =
|
|
196
|
-
staticConfig.acceptsClassName &&
|
|
197
|
-
|
|
198
|
-
|
|
197
|
+
staticConfig.acceptsClassName && (isWeb || IS_STATIC) && !state.noClassNames
|
|
198
|
+
|
|
199
|
+
let style: ViewStyle = {}
|
|
199
200
|
|
|
200
201
|
const len = propKeys.length
|
|
201
202
|
const rulesToInsert: RulesToInsert = []
|
|
202
|
-
const style: ViewStyle = {}
|
|
203
203
|
const classNames: ClassNamesObject = {}
|
|
204
204
|
// we need to gather these specific to each media query / pseudo
|
|
205
205
|
// value is [hash, val], so ["-jnjad-asdnjk", "scaleX(1) rotate(10deg)"]
|
|
@@ -464,6 +464,10 @@ export const getSplitStyles: StyleSplitter = (
|
|
|
464
464
|
for (const [key, val] of expanded) {
|
|
465
465
|
if (val === undefined) continue
|
|
466
466
|
|
|
467
|
+
if (debug) {
|
|
468
|
+
console.log(`ok`, key, val)
|
|
469
|
+
}
|
|
470
|
+
|
|
467
471
|
isMedia = isMediaKey(key)
|
|
468
472
|
isPseudo = validPseudoKeys[key]
|
|
469
473
|
const isMediaOrPseudo = isMedia || isPseudo
|
|
@@ -643,7 +647,9 @@ export const getSplitStyles: StyleSplitter = (
|
|
|
643
647
|
addStyleToInsertRules(rulesToInsert, atomicStyle)
|
|
644
648
|
mergeClassName(transforms, classNames, key, atomicStyle.identifier)
|
|
645
649
|
}
|
|
646
|
-
|
|
650
|
+
if (!IS_STATIC) {
|
|
651
|
+
style = emptyObject
|
|
652
|
+
}
|
|
647
653
|
}
|
|
648
654
|
|
|
649
655
|
if (transforms) {
|
|
@@ -153,6 +153,11 @@ export function insertStyleRules(rulesToInsert: RulesToInsert) {
|
|
|
153
153
|
}
|
|
154
154
|
}
|
|
155
155
|
|
|
156
|
+
const IS_STATIC = process.env.IS_STATIC === 'is_static'
|
|
157
|
+
|
|
156
158
|
export function shouldInsertStyleRules(styleObject: PartialStyleObject) {
|
|
159
|
+
if (IS_STATIC) {
|
|
160
|
+
return true
|
|
161
|
+
}
|
|
157
162
|
return !allSelectors[styleObject.identifier]
|
|
158
163
|
}
|