@tamagui/web 1.13.2 → 1.13.4
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/Tamagui.js +1 -76
- package/dist/cjs/Tamagui.js.map +2 -2
- package/dist/cjs/addTheme.js +2 -77
- package/dist/cjs/addTheme.js.map +2 -2
- package/dist/cjs/config.js +1 -122
- package/dist/cjs/config.js.map +2 -2
- package/dist/cjs/constants/constants.js +1 -48
- package/dist/cjs/constants/constants.js.map +2 -2
- package/dist/cjs/constants/isDevTools.js +1 -36
- package/dist/cjs/constants/isDevTools.js.map +2 -2
- package/dist/cjs/contexts/AnimationDriverContext.js +1 -29
- package/dist/cjs/contexts/AnimationDriverContext.js.map +2 -2
- package/dist/cjs/contexts/ButtonNestingContext.js +1 -29
- package/dist/cjs/contexts/ButtonNestingContext.js.map +2 -2
- package/dist/cjs/contexts/FontLanguageContext.js +1 -29
- package/dist/cjs/contexts/FontLanguageContext.js.map +2 -2
- package/dist/cjs/contexts/TextAncestorContext.js +1 -29
- package/dist/cjs/contexts/TextAncestorContext.js.map +2 -2
- package/dist/cjs/createComponent.js +2 -874
- package/dist/cjs/createComponent.js.map +2 -2
- package/dist/cjs/createFont.js +1 -68
- package/dist/cjs/createFont.js.map +2 -2
- package/dist/cjs/createShorthands.js +1 -30
- package/dist/cjs/createShorthands.js.map +2 -2
- package/dist/cjs/createTamagui.js +5 -202
- package/dist/cjs/createTamagui.js.map +2 -2
- package/dist/cjs/createTheme.js +1 -30
- package/dist/cjs/createTheme.js.map +2 -2
- package/dist/cjs/createTokens.js +1 -38
- package/dist/cjs/createTokens.js.map +2 -2
- package/dist/cjs/createVariable.js +1 -110
- package/dist/cjs/createVariable.js.map +2 -2
- package/dist/cjs/createVariables.js +1 -59
- package/dist/cjs/createVariables.js.map +2 -2
- package/dist/cjs/helpers/ThemeManager.js +1 -236
- package/dist/cjs/helpers/ThemeManager.js.map +2 -2
- package/dist/cjs/helpers/ThemeManagerContext.js +1 -29
- package/dist/cjs/helpers/ThemeManagerContext.js.map +2 -2
- package/dist/cjs/helpers/createMediaStyle.js +1 -66
- package/dist/cjs/helpers/createMediaStyle.js.map +2 -2
- package/dist/cjs/helpers/createPropMapper.js +2 -431
- package/dist/cjs/helpers/createPropMapper.js.map +2 -2
- package/dist/cjs/helpers/createProxy.js +2 -41
- package/dist/cjs/helpers/createProxy.js.map +2 -2
- package/dist/cjs/helpers/defaultOffset.js +1 -28
- package/dist/cjs/helpers/defaultOffset.js.map +2 -2
- package/dist/cjs/helpers/expandStyle.js +1 -85
- package/dist/cjs/helpers/expandStyle.js.map +2 -2
- package/dist/cjs/helpers/expandStyles.js +1 -76
- package/dist/cjs/helpers/expandStyles.js.map +2 -2
- package/dist/cjs/helpers/extendStaticConfig.js +1 -91
- package/dist/cjs/helpers/extendStaticConfig.js.map +2 -2
- package/dist/cjs/helpers/getAnimationDriver.js +1 -31
- package/dist/cjs/helpers/getAnimationDriver.js.map +2 -2
- package/dist/cjs/helpers/getExpandedShorthands.js +1 -38
- package/dist/cjs/helpers/getExpandedShorthands.js.map +2 -2
- package/dist/cjs/helpers/getFontLanguage.js +1 -28
- package/dist/cjs/helpers/getFontLanguage.js.map +2 -2
- package/dist/cjs/helpers/getSplitStyles.js +3 -865
- package/dist/cjs/helpers/getSplitStyles.js.map +2 -2
- package/dist/cjs/helpers/getStylesAtomic.js +1 -226
- package/dist/cjs/helpers/getStylesAtomic.js.map +2 -2
- package/dist/cjs/helpers/getStylesAtomic.native.js +1 -37
- package/dist/cjs/helpers/getStylesAtomic.native.js.map +2 -2
- package/dist/cjs/helpers/getThemeCSSRules.js +4 -126
- package/dist/cjs/helpers/getThemeCSSRules.js.map +2 -2
- package/dist/cjs/helpers/getThemeCSSRules.native.js +1 -30
- package/dist/cjs/helpers/getThemeCSSRules.native.js.map +2 -2
- package/dist/cjs/helpers/getVariantExtras.js +1 -91
- package/dist/cjs/helpers/getVariantExtras.js.map +2 -2
- package/dist/cjs/helpers/insertStyleRule.js +2 -222
- package/dist/cjs/helpers/insertStyleRule.js.map +2 -2
- package/dist/cjs/helpers/isObj.js +1 -28
- package/dist/cjs/helpers/isObj.js.map +2 -2
- package/dist/cjs/helpers/isTamaguiComponent.js +1 -31
- package/dist/cjs/helpers/isTamaguiComponent.js.map +2 -2
- package/dist/cjs/helpers/isTamaguiElement.js +1 -32
- package/dist/cjs/helpers/isTamaguiElement.js.map +2 -2
- package/dist/cjs/helpers/matchMedia.js +1 -41
- package/dist/cjs/helpers/matchMedia.js.map +2 -2
- package/dist/cjs/helpers/matchMedia.native.js +1 -47
- package/dist/cjs/helpers/matchMedia.native.js.map +2 -2
- package/dist/cjs/helpers/mergeProps.js +1 -53
- package/dist/cjs/helpers/mergeProps.js.map +2 -2
- package/dist/cjs/helpers/normalizeColor.js +1 -66
- package/dist/cjs/helpers/normalizeColor.js.map +2 -2
- package/dist/cjs/helpers/normalizeShadow.js +1 -46
- package/dist/cjs/helpers/normalizeShadow.js.map +2 -2
- package/dist/cjs/helpers/normalizeShadow.native.js +1 -54
- package/dist/cjs/helpers/normalizeShadow.native.js.map +2 -2
- package/dist/cjs/helpers/normalizeStylePropKeys.js +1 -28
- package/dist/cjs/helpers/normalizeStylePropKeys.js.map +2 -2
- package/dist/cjs/helpers/normalizeStylePropKeys.native.js +1 -39
- package/dist/cjs/helpers/normalizeStylePropKeys.native.js.map +2 -2
- package/dist/cjs/helpers/normalizeValueWithProperty.js +1 -125
- package/dist/cjs/helpers/normalizeValueWithProperty.js.map +2 -2
- package/dist/cjs/helpers/proxyThemeVariables.js +1 -39
- package/dist/cjs/helpers/proxyThemeVariables.js.map +2 -2
- package/dist/cjs/helpers/pseudoDescriptors.js +1 -52
- package/dist/cjs/helpers/pseudoDescriptors.js.map +2 -2
- package/dist/cjs/helpers/registerCSSVariable.js +1 -39
- package/dist/cjs/helpers/registerCSSVariable.js.map +2 -2
- package/dist/cjs/helpers/themeable.js +1 -61
- package/dist/cjs/helpers/themeable.js.map +2 -2
- package/dist/cjs/helpers/themes.js +1 -75
- package/dist/cjs/helpers/themes.js.map +2 -2
- package/dist/cjs/helpers/timer.js +1 -34
- package/dist/cjs/helpers/timer.js.map +2 -2
- package/dist/cjs/helpers/useShallowSetState.js +1 -58
- package/dist/cjs/helpers/useShallowSetState.js.map +2 -2
- package/dist/cjs/helpers/warnOnce.js +1 -37
- package/dist/cjs/helpers/warnOnce.js.map +2 -2
- package/dist/cjs/helpers/withStaticProperties.js +1 -32
- package/dist/cjs/helpers/withStaticProperties.js.map +2 -2
- package/dist/cjs/hooks/getThemeUnwrapped.js +1 -33
- package/dist/cjs/hooks/getThemeUnwrapped.js.map +2 -2
- package/dist/cjs/hooks/useAnimationDriver.js +1 -33
- package/dist/cjs/hooks/useAnimationDriver.js.map +2 -2
- package/dist/cjs/hooks/useId.js +1 -28
- package/dist/cjs/hooks/useId.js.map +2 -2
- package/dist/cjs/hooks/useIsTouchDevice.js +1 -32
- package/dist/cjs/hooks/useIsTouchDevice.js.map +2 -2
- package/dist/cjs/hooks/useMedia.js +1 -264
- package/dist/cjs/hooks/useMedia.js.map +2 -2
- package/dist/cjs/hooks/useSafeRef.js +1 -58
- package/dist/cjs/hooks/useSafeRef.js.map +2 -2
- package/dist/cjs/hooks/useServerHooks.js +1 -35
- package/dist/cjs/hooks/useServerHooks.js.map +2 -2
- package/dist/cjs/hooks/useStyle.js +1 -60
- package/dist/cjs/hooks/useStyle.js.map +2 -2
- package/dist/cjs/hooks/useTheme.js +1 -229
- package/dist/cjs/hooks/useTheme.js.map +2 -2
- package/dist/cjs/hooks/useThemeName.js +1 -51
- package/dist/cjs/hooks/useThemeName.js.map +2 -2
- package/dist/cjs/index.js +1 -110
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/inject-styles.js +1 -39
- package/dist/cjs/inject-styles.js.map +2 -2
- package/dist/cjs/insertFont.js +1 -92
- package/dist/cjs/insertFont.js.map +2 -2
- package/dist/cjs/setupHooks.js +1 -33
- package/dist/cjs/setupHooks.js.map +2 -2
- package/dist/cjs/setupReactNative.js +1 -50
- package/dist/cjs/setupReactNative.js.map +2 -2
- package/dist/cjs/styled.js +1 -93
- package/dist/cjs/styled.js.map +2 -2
- package/dist/cjs/types.js +1 -16
- package/dist/cjs/types.js.map +2 -2
- package/dist/cjs/updateTheme.js +1 -46
- package/dist/cjs/updateTheme.js.map +2 -2
- package/dist/cjs/views/AnimationDriverProvider.js +1 -32
- package/dist/cjs/views/AnimationDriverProvider.js.map +2 -2
- package/dist/cjs/views/FontLanguage.js +1 -40
- package/dist/cjs/views/FontLanguage.js.map +2 -2
- package/dist/cjs/views/FontLanguage.native.js +1 -34
- package/dist/cjs/views/FontLanguage.native.js.map +2 -2
- package/dist/cjs/views/FontLanguage.types.js +1 -16
- package/dist/cjs/views/FontLanguage.types.js.map +2 -2
- package/dist/cjs/views/Slot.js +1 -91
- package/dist/cjs/views/Slot.js.map +2 -2
- package/dist/cjs/views/Stack.js +1 -37
- package/dist/cjs/views/Stack.js.map +2 -2
- package/dist/cjs/views/TamaguiProvider.js +1 -90
- package/dist/cjs/views/TamaguiProvider.js.map +2 -2
- package/dist/cjs/views/Text.js +1 -95
- package/dist/cjs/views/Text.js.map +2 -2
- package/dist/cjs/views/Theme.js +1 -80
- package/dist/cjs/views/Theme.js.map +2 -2
- package/dist/cjs/views/ThemeProvider.js +1 -69
- package/dist/cjs/views/ThemeProvider.js.map +2 -2
- package/dist/esm/Tamagui.js +1 -44
- package/dist/esm/Tamagui.js.map +2 -2
- package/dist/esm/Tamagui.mjs +1 -44
- package/dist/esm/Tamagui.mjs.map +2 -2
- package/dist/esm/addTheme.js +2 -53
- package/dist/esm/addTheme.js.map +2 -2
- package/dist/esm/addTheme.mjs +2 -53
- package/dist/esm/addTheme.mjs.map +2 -2
- package/dist/esm/config.js +1 -89
- package/dist/esm/config.js.map +2 -2
- package/dist/esm/config.mjs +1 -89
- package/dist/esm/config.mjs.map +2 -2
- package/dist/esm/constants/constants.js +1 -21
- package/dist/esm/constants/constants.js.map +2 -2
- package/dist/esm/constants/constants.mjs +1 -21
- package/dist/esm/constants/constants.mjs.map +2 -2
- package/dist/esm/constants/isDevTools.js +1 -12
- package/dist/esm/constants/isDevTools.js.map +2 -2
- package/dist/esm/constants/isDevTools.mjs +1 -12
- package/dist/esm/constants/isDevTools.mjs.map +2 -2
- package/dist/esm/contexts/AnimationDriverContext.js +1 -5
- package/dist/esm/contexts/AnimationDriverContext.js.map +2 -2
- package/dist/esm/contexts/AnimationDriverContext.mjs +1 -5
- package/dist/esm/contexts/AnimationDriverContext.mjs.map +2 -2
- package/dist/esm/contexts/ButtonNestingContext.js +1 -5
- package/dist/esm/contexts/ButtonNestingContext.js.map +2 -2
- package/dist/esm/contexts/ButtonNestingContext.mjs +1 -5
- package/dist/esm/contexts/ButtonNestingContext.mjs.map +2 -2
- package/dist/esm/contexts/FontLanguageContext.js +1 -5
- package/dist/esm/contexts/FontLanguageContext.js.map +2 -2
- package/dist/esm/contexts/FontLanguageContext.mjs +1 -5
- package/dist/esm/contexts/FontLanguageContext.mjs.map +2 -2
- package/dist/esm/contexts/TextAncestorContext.js +1 -5
- package/dist/esm/contexts/TextAncestorContext.js.map +2 -2
- package/dist/esm/contexts/TextAncestorContext.mjs +1 -5
- package/dist/esm/contexts/TextAncestorContext.mjs.map +2 -2
- package/dist/esm/createComponent.js +2 -846
- package/dist/esm/createComponent.js.map +2 -2
- package/dist/esm/createComponent.mjs +2 -846
- package/dist/esm/createComponent.mjs.map +2 -2
- package/dist/esm/createFont.js +1 -44
- package/dist/esm/createFont.js.map +2 -2
- package/dist/esm/createFont.mjs +1 -44
- package/dist/esm/createFont.mjs.map +2 -2
- package/dist/esm/createShorthands.js +1 -6
- package/dist/esm/createShorthands.js.map +2 -2
- package/dist/esm/createShorthands.mjs +1 -6
- package/dist/esm/createShorthands.mjs.map +2 -2
- package/dist/esm/createTamagui.js +5 -186
- package/dist/esm/createTamagui.js.map +2 -2
- package/dist/esm/createTamagui.mjs +5 -186
- package/dist/esm/createTamagui.mjs.map +2 -2
- package/dist/esm/createTheme.js +1 -6
- package/dist/esm/createTheme.js.map +2 -2
- package/dist/esm/createTheme.mjs +1 -6
- package/dist/esm/createTheme.mjs.map +2 -2
- package/dist/esm/createTokens.js +1 -14
- package/dist/esm/createTokens.js.map +2 -2
- package/dist/esm/createTokens.mjs +1 -14
- package/dist/esm/createTokens.mjs.map +2 -2
- package/dist/esm/createVariable.js +1 -77
- package/dist/esm/createVariable.js.map +2 -2
- package/dist/esm/createVariable.mjs +1 -77
- package/dist/esm/createVariable.mjs.map +2 -2
- package/dist/esm/createVariables.js +1 -34
- package/dist/esm/createVariables.js.map +2 -2
- package/dist/esm/createVariables.mjs +1 -34
- package/dist/esm/createVariables.mjs.map +2 -2
- package/dist/esm/helpers/ThemeManager.js +1 -211
- package/dist/esm/helpers/ThemeManager.js.map +2 -2
- package/dist/esm/helpers/ThemeManager.mjs +1 -211
- package/dist/esm/helpers/ThemeManager.mjs.map +2 -2
- package/dist/esm/helpers/ThemeManagerContext.js +1 -5
- package/dist/esm/helpers/ThemeManagerContext.js.map +2 -2
- package/dist/esm/helpers/ThemeManagerContext.mjs +1 -5
- package/dist/esm/helpers/ThemeManagerContext.mjs.map +2 -2
- package/dist/esm/helpers/createMediaStyle.js +1 -41
- package/dist/esm/helpers/createMediaStyle.js.map +2 -2
- package/dist/esm/helpers/createMediaStyle.mjs +1 -41
- package/dist/esm/helpers/createMediaStyle.mjs.map +2 -2
- package/dist/esm/helpers/createPropMapper.js +2 -404
- package/dist/esm/helpers/createPropMapper.js.map +2 -2
- package/dist/esm/helpers/createPropMapper.mjs +2 -404
- package/dist/esm/helpers/createPropMapper.mjs.map +2 -2
- package/dist/esm/helpers/createProxy.js +2 -17
- package/dist/esm/helpers/createProxy.js.map +2 -2
- package/dist/esm/helpers/createProxy.mjs +2 -17
- package/dist/esm/helpers/createProxy.mjs.map +2 -2
- package/dist/esm/helpers/defaultOffset.js +1 -4
- package/dist/esm/helpers/defaultOffset.js.map +2 -2
- package/dist/esm/helpers/defaultOffset.mjs +1 -4
- package/dist/esm/helpers/defaultOffset.mjs.map +2 -2
- package/dist/esm/helpers/expandStyle.js +1 -61
- package/dist/esm/helpers/expandStyle.js.map +2 -2
- package/dist/esm/helpers/expandStyle.mjs +1 -61
- package/dist/esm/helpers/expandStyle.mjs.map +2 -2
- package/dist/esm/helpers/expandStyles.js +1 -51
- package/dist/esm/helpers/expandStyles.js.map +2 -2
- package/dist/esm/helpers/expandStyles.mjs +1 -51
- package/dist/esm/helpers/expandStyles.mjs.map +2 -2
- package/dist/esm/helpers/extendStaticConfig.js +1 -66
- package/dist/esm/helpers/extendStaticConfig.js.map +2 -2
- package/dist/esm/helpers/extendStaticConfig.mjs +1 -66
- package/dist/esm/helpers/extendStaticConfig.mjs.map +2 -2
- package/dist/esm/helpers/getAnimationDriver.js +1 -7
- package/dist/esm/helpers/getAnimationDriver.js.map +2 -2
- package/dist/esm/helpers/getAnimationDriver.mjs +1 -7
- package/dist/esm/helpers/getAnimationDriver.mjs.map +2 -2
- package/dist/esm/helpers/getExpandedShorthands.js +1 -14
- package/dist/esm/helpers/getExpandedShorthands.js.map +2 -2
- package/dist/esm/helpers/getExpandedShorthands.mjs +1 -14
- package/dist/esm/helpers/getExpandedShorthands.mjs.map +2 -2
- package/dist/esm/helpers/getFontLanguage.js +1 -4
- package/dist/esm/helpers/getFontLanguage.js.map +2 -2
- package/dist/esm/helpers/getFontLanguage.mjs +1 -4
- package/dist/esm/helpers/getFontLanguage.mjs.map +2 -2
- package/dist/esm/helpers/getSplitStyles.js +3 -866
- package/dist/esm/helpers/getSplitStyles.js.map +2 -2
- package/dist/esm/helpers/getSplitStyles.mjs +3 -866
- package/dist/esm/helpers/getSplitStyles.mjs.map +2 -2
- package/dist/esm/helpers/getStylesAtomic.js +1 -200
- package/dist/esm/helpers/getStylesAtomic.js.map +2 -2
- package/dist/esm/helpers/getStylesAtomic.mjs +1 -200
- package/dist/esm/helpers/getStylesAtomic.mjs.map +2 -2
- package/dist/esm/helpers/getStylesAtomic.native.js +1 -11
- package/dist/esm/helpers/getStylesAtomic.native.js.map +2 -2
- package/dist/esm/helpers/getStylesAtomic.native.mjs +1 -11
- package/dist/esm/helpers/getStylesAtomic.native.mjs.map +2 -2
- package/dist/esm/helpers/getThemeCSSRules.js +4 -102
- package/dist/esm/helpers/getThemeCSSRules.js.map +2 -2
- package/dist/esm/helpers/getThemeCSSRules.mjs +4 -102
- package/dist/esm/helpers/getThemeCSSRules.mjs.map +2 -2
- package/dist/esm/helpers/getThemeCSSRules.native.js +1 -6
- package/dist/esm/helpers/getThemeCSSRules.native.js.map +2 -2
- package/dist/esm/helpers/getThemeCSSRules.native.mjs +1 -6
- package/dist/esm/helpers/getThemeCSSRules.native.mjs.map +2 -2
- package/dist/esm/helpers/getVariantExtras.js +1 -66
- package/dist/esm/helpers/getVariantExtras.js.map +2 -2
- package/dist/esm/helpers/getVariantExtras.mjs +1 -66
- package/dist/esm/helpers/getVariantExtras.mjs.map +2 -2
- package/dist/esm/helpers/insertStyleRule.js +2 -190
- package/dist/esm/helpers/insertStyleRule.js.map +2 -2
- package/dist/esm/helpers/insertStyleRule.mjs +2 -190
- package/dist/esm/helpers/insertStyleRule.mjs.map +2 -2
- package/dist/esm/helpers/isObj.js +1 -4
- package/dist/esm/helpers/isObj.js.map +2 -2
- package/dist/esm/helpers/isObj.mjs +1 -4
- package/dist/esm/helpers/isObj.mjs.map +2 -2
- package/dist/esm/helpers/isTamaguiComponent.js +1 -7
- package/dist/esm/helpers/isTamaguiComponent.js.map +2 -2
- package/dist/esm/helpers/isTamaguiComponent.mjs +1 -7
- package/dist/esm/helpers/isTamaguiComponent.mjs.map +2 -2
- package/dist/esm/helpers/isTamaguiElement.js +1 -8
- package/dist/esm/helpers/isTamaguiElement.js.map +2 -2
- package/dist/esm/helpers/isTamaguiElement.mjs +1 -8
- package/dist/esm/helpers/isTamaguiElement.mjs.map +2 -2
- package/dist/esm/helpers/matchMedia.js +1 -16
- package/dist/esm/helpers/matchMedia.js.map +2 -2
- package/dist/esm/helpers/matchMedia.mjs +1 -16
- package/dist/esm/helpers/matchMedia.mjs.map +2 -2
- package/dist/esm/helpers/matchMedia.native.js +1 -22
- package/dist/esm/helpers/matchMedia.native.js.map +2 -2
- package/dist/esm/helpers/matchMedia.native.mjs +1 -22
- package/dist/esm/helpers/matchMedia.native.mjs.map +2 -2
- package/dist/esm/helpers/mergeProps.js +1 -29
- package/dist/esm/helpers/mergeProps.js.map +2 -2
- package/dist/esm/helpers/mergeProps.mjs +1 -29
- package/dist/esm/helpers/mergeProps.mjs.map +2 -2
- package/dist/esm/helpers/normalizeColor.js +1 -30
- package/dist/esm/helpers/normalizeColor.js.map +2 -2
- package/dist/esm/helpers/normalizeColor.mjs +1 -30
- package/dist/esm/helpers/normalizeColor.mjs.map +2 -2
- package/dist/esm/helpers/normalizeShadow.js +1 -22
- package/dist/esm/helpers/normalizeShadow.js.map +2 -2
- package/dist/esm/helpers/normalizeShadow.mjs +1 -22
- package/dist/esm/helpers/normalizeShadow.mjs.map +2 -2
- package/dist/esm/helpers/normalizeShadow.native.js +1 -30
- package/dist/esm/helpers/normalizeShadow.native.js.map +2 -2
- package/dist/esm/helpers/normalizeShadow.native.mjs +1 -30
- package/dist/esm/helpers/normalizeShadow.native.mjs.map +2 -2
- package/dist/esm/helpers/normalizeStylePropKeys.js +1 -4
- package/dist/esm/helpers/normalizeStylePropKeys.js.map +2 -2
- package/dist/esm/helpers/normalizeStylePropKeys.mjs +1 -4
- package/dist/esm/helpers/normalizeStylePropKeys.mjs.map +2 -2
- package/dist/esm/helpers/normalizeStylePropKeys.native.js +1 -15
- package/dist/esm/helpers/normalizeStylePropKeys.native.js.map +2 -2
- package/dist/esm/helpers/normalizeStylePropKeys.native.mjs +1 -15
- package/dist/esm/helpers/normalizeStylePropKeys.native.mjs.map +2 -2
- package/dist/esm/helpers/normalizeValueWithProperty.js +1 -100
- package/dist/esm/helpers/normalizeValueWithProperty.js.map +2 -2
- package/dist/esm/helpers/normalizeValueWithProperty.mjs +1 -100
- package/dist/esm/helpers/normalizeValueWithProperty.mjs.map +2 -2
- package/dist/esm/helpers/proxyThemeVariables.js +1 -15
- package/dist/esm/helpers/proxyThemeVariables.js.map +2 -2
- package/dist/esm/helpers/proxyThemeVariables.mjs +1 -15
- package/dist/esm/helpers/proxyThemeVariables.mjs.map +2 -2
- package/dist/esm/helpers/pseudoDescriptors.js +1 -28
- package/dist/esm/helpers/pseudoDescriptors.js.map +2 -2
- package/dist/esm/helpers/pseudoDescriptors.mjs +1 -28
- package/dist/esm/helpers/pseudoDescriptors.mjs.map +2 -2
- package/dist/esm/helpers/registerCSSVariable.js +1 -13
- package/dist/esm/helpers/registerCSSVariable.js.map +2 -2
- package/dist/esm/helpers/registerCSSVariable.mjs +1 -13
- package/dist/esm/helpers/registerCSSVariable.mjs.map +2 -2
- package/dist/esm/helpers/themeable.js +1 -27
- package/dist/esm/helpers/themeable.js.map +2 -2
- package/dist/esm/helpers/themeable.mjs +1 -27
- package/dist/esm/helpers/themeable.mjs.map +2 -2
- package/dist/esm/helpers/themes.js +1 -50
- package/dist/esm/helpers/themes.js.map +2 -2
- package/dist/esm/helpers/themes.mjs +1 -50
- package/dist/esm/helpers/themes.mjs.map +2 -2
- package/dist/esm/helpers/timer.js +1 -10
- package/dist/esm/helpers/timer.js.map +2 -2
- package/dist/esm/helpers/timer.mjs +1 -10
- package/dist/esm/helpers/timer.mjs.map +2 -2
- package/dist/esm/helpers/useShallowSetState.js +1 -34
- package/dist/esm/helpers/useShallowSetState.js.map +2 -2
- package/dist/esm/helpers/useShallowSetState.mjs +1 -34
- package/dist/esm/helpers/useShallowSetState.mjs.map +2 -2
- package/dist/esm/helpers/warnOnce.js +1 -13
- package/dist/esm/helpers/warnOnce.js.map +2 -2
- package/dist/esm/helpers/warnOnce.mjs +1 -13
- package/dist/esm/helpers/warnOnce.mjs.map +2 -2
- package/dist/esm/helpers/withStaticProperties.js +1 -8
- package/dist/esm/helpers/withStaticProperties.js.map +2 -2
- package/dist/esm/helpers/withStaticProperties.mjs +1 -8
- package/dist/esm/helpers/withStaticProperties.mjs.map +2 -2
- package/dist/esm/hooks/getThemeUnwrapped.js +1 -8
- package/dist/esm/hooks/getThemeUnwrapped.js.map +2 -2
- package/dist/esm/hooks/getThemeUnwrapped.mjs +1 -8
- package/dist/esm/hooks/getThemeUnwrapped.mjs.map +2 -2
- package/dist/esm/hooks/useAnimationDriver.js +1 -9
- package/dist/esm/hooks/useAnimationDriver.js.map +2 -2
- package/dist/esm/hooks/useAnimationDriver.mjs +1 -9
- package/dist/esm/hooks/useAnimationDriver.mjs.map +2 -2
- package/dist/esm/hooks/useId.js +1 -4
- package/dist/esm/hooks/useId.js.map +2 -2
- package/dist/esm/hooks/useId.mjs +1 -4
- package/dist/esm/hooks/useId.mjs.map +2 -2
- package/dist/esm/hooks/useIsTouchDevice.js +1 -8
- package/dist/esm/hooks/useIsTouchDevice.js.map +2 -2
- package/dist/esm/hooks/useIsTouchDevice.mjs +1 -8
- package/dist/esm/hooks/useIsTouchDevice.mjs.map +2 -2
- package/dist/esm/hooks/useMedia.js +1 -225
- package/dist/esm/hooks/useMedia.js.map +2 -2
- package/dist/esm/hooks/useMedia.mjs +1 -225
- package/dist/esm/hooks/useMedia.mjs.map +2 -2
- package/dist/esm/hooks/useSafeRef.js +1 -34
- package/dist/esm/hooks/useSafeRef.js.map +2 -2
- package/dist/esm/hooks/useSafeRef.mjs +1 -34
- package/dist/esm/hooks/useSafeRef.mjs.map +2 -2
- package/dist/esm/hooks/useServerHooks.js +1 -10
- package/dist/esm/hooks/useServerHooks.js.map +2 -2
- package/dist/esm/hooks/useServerHooks.mjs +1 -10
- package/dist/esm/hooks/useServerHooks.mjs.map +2 -2
- package/dist/esm/hooks/useStyle.js +1 -36
- package/dist/esm/hooks/useStyle.js.map +2 -2
- package/dist/esm/hooks/useStyle.mjs +1 -36
- package/dist/esm/hooks/useStyle.mjs.map +2 -2
- package/dist/esm/hooks/useTheme.js +1 -204
- package/dist/esm/hooks/useTheme.js.map +2 -2
- package/dist/esm/hooks/useTheme.mjs +1 -204
- package/dist/esm/hooks/useTheme.mjs.map +2 -2
- package/dist/esm/hooks/useThemeName.js +1 -27
- package/dist/esm/hooks/useThemeName.js.map +2 -2
- package/dist/esm/hooks/useThemeName.mjs +1 -27
- package/dist/esm/hooks/useThemeName.mjs.map +2 -2
- package/dist/esm/index.js +1 -88
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/index.mjs +1 -88
- package/dist/esm/index.mjs.map +2 -2
- package/dist/esm/inject-styles.js +1 -15
- package/dist/esm/inject-styles.js.map +2 -2
- package/dist/esm/inject-styles.mjs +1 -15
- package/dist/esm/inject-styles.mjs.map +2 -2
- package/dist/esm/insertFont.js +1 -66
- package/dist/esm/insertFont.js.map +2 -2
- package/dist/esm/insertFont.mjs +1 -66
- package/dist/esm/insertFont.mjs.map +2 -2
- package/dist/esm/setupHooks.js +1 -8
- package/dist/esm/setupHooks.js.map +2 -2
- package/dist/esm/setupHooks.mjs +1 -8
- package/dist/esm/setupHooks.mjs.map +2 -2
- package/dist/esm/setupReactNative.js +1 -24
- package/dist/esm/setupReactNative.js.map +2 -2
- package/dist/esm/setupReactNative.mjs +1 -24
- package/dist/esm/setupReactNative.mjs.map +2 -2
- package/dist/esm/styled.js +1 -69
- package/dist/esm/styled.js.map +2 -2
- package/dist/esm/styled.mjs +1 -69
- package/dist/esm/styled.mjs.map +2 -2
- package/dist/esm/updateTheme.js +1 -22
- package/dist/esm/updateTheme.js.map +2 -2
- package/dist/esm/updateTheme.mjs +1 -22
- package/dist/esm/updateTheme.mjs.map +2 -2
- package/dist/esm/views/AnimationDriverProvider.js +1 -8
- package/dist/esm/views/AnimationDriverProvider.js.map +2 -2
- package/dist/esm/views/AnimationDriverProvider.mjs +1 -8
- package/dist/esm/views/AnimationDriverProvider.mjs.map +2 -2
- package/dist/esm/views/FontLanguage.js +1 -16
- package/dist/esm/views/FontLanguage.js.map +2 -2
- package/dist/esm/views/FontLanguage.mjs +1 -16
- package/dist/esm/views/FontLanguage.mjs.map +2 -2
- package/dist/esm/views/FontLanguage.native.js +1 -10
- package/dist/esm/views/FontLanguage.native.js.map +2 -2
- package/dist/esm/views/FontLanguage.native.mjs +1 -10
- package/dist/esm/views/FontLanguage.native.mjs.map +2 -2
- package/dist/esm/views/Slot.js +1 -65
- package/dist/esm/views/Slot.js.map +2 -2
- package/dist/esm/views/Slot.mjs +1 -65
- package/dist/esm/views/Slot.mjs.map +2 -2
- package/dist/esm/views/Stack.js +1 -13
- package/dist/esm/views/Stack.js.map +2 -2
- package/dist/esm/views/Stack.mjs +1 -13
- package/dist/esm/views/Stack.mjs.map +2 -2
- package/dist/esm/views/TamaguiProvider.js +1 -56
- package/dist/esm/views/TamaguiProvider.js.map +2 -2
- package/dist/esm/views/TamaguiProvider.mjs +1 -56
- package/dist/esm/views/TamaguiProvider.mjs.map +2 -2
- package/dist/esm/views/Text.js +1 -71
- package/dist/esm/views/Text.js.map +2 -2
- package/dist/esm/views/Text.mjs +1 -71
- package/dist/esm/views/Text.mjs.map +2 -2
- package/dist/esm/views/Theme.js +1 -55
- package/dist/esm/views/Theme.js.map +2 -2
- package/dist/esm/views/Theme.mjs +1 -55
- package/dist/esm/views/Theme.mjs.map +2 -2
- package/dist/esm/views/ThemeProvider.js +1 -44
- package/dist/esm/views/ThemeProvider.js.map +2 -2
- package/dist/esm/views/ThemeProvider.mjs +1 -44
- package/dist/esm/views/ThemeProvider.mjs.map +2 -2
- package/package.json +9 -9
|
@@ -1,201 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { getConfig } from "../config.js";
|
|
3
|
-
import { defaultOffset } from "./defaultOffset.js";
|
|
4
|
-
import { normalizeValueWithProperty } from "./normalizeValueWithProperty.js";
|
|
5
|
-
import { pseudoDescriptors } from "./pseudoDescriptors.js";
|
|
6
|
-
const pseudosOrdered = [
|
|
7
|
-
pseudoDescriptors.hoverStyle,
|
|
8
|
-
pseudoDescriptors.pressStyle,
|
|
9
|
-
pseudoDescriptors.focusStyle
|
|
10
|
-
];
|
|
11
|
-
function getStylesAtomic(stylesIn) {
|
|
12
|
-
if (!(stylesIn.hoverStyle || stylesIn.pressStyle || stylesIn.focusStyle)) {
|
|
13
|
-
return getAtomicStyle(stylesIn);
|
|
14
|
-
}
|
|
15
|
-
const { hoverStyle, pressStyle, focusStyle, ...base } = stylesIn;
|
|
16
|
-
let res = [];
|
|
17
|
-
for (const [index, style] of [hoverStyle, pressStyle, focusStyle, base].entries()) {
|
|
18
|
-
if (!style)
|
|
19
|
-
continue;
|
|
20
|
-
const pseudo = pseudosOrdered[index];
|
|
21
|
-
res = [...res, ...getAtomicStyle(style, pseudo)];
|
|
22
|
-
}
|
|
23
|
-
return res;
|
|
24
|
-
}
|
|
25
|
-
function getAtomicStyle(style, pseudo) {
|
|
26
|
-
if (!style)
|
|
27
|
-
return [];
|
|
28
|
-
if (process.env.NODE_ENV === "development") {
|
|
29
|
-
if (!style || typeof style !== "object") {
|
|
30
|
-
throw new Error(`Wrong style type: "${typeof style}": ${style}`);
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
return generateAtomicStyles(style, pseudo);
|
|
34
|
-
}
|
|
35
|
-
let conf;
|
|
36
|
-
const generateAtomicStyles = (styleIn, pseudo) => {
|
|
37
|
-
conf = conf || getConfig();
|
|
38
|
-
const style = styleIn;
|
|
39
|
-
if (style.transform && Array.isArray(style.transform)) {
|
|
40
|
-
style.transform = style.transform.map(
|
|
41
|
-
// { scale: 2 } => 'scale(2)'
|
|
42
|
-
// { translateX: 20 } => 'translateX(20px)'
|
|
43
|
-
// { matrix: [1,2,3,4,5,6] } => 'matrix(1,2,3,4,5,6)'
|
|
44
|
-
(transform) => {
|
|
45
|
-
const type = Object.keys(transform)[0];
|
|
46
|
-
const value = transform[type];
|
|
47
|
-
if (type === "matrix" || type === "matrix3d") {
|
|
48
|
-
return `${type}(${value.join(",")})`;
|
|
49
|
-
}
|
|
50
|
-
return `${type}(${normalizeValueWithProperty(value, type)})`;
|
|
51
|
-
}
|
|
52
|
-
).join(" ");
|
|
53
|
-
}
|
|
54
|
-
styleToCSS(style);
|
|
55
|
-
const out = [];
|
|
56
|
-
for (const key in style) {
|
|
57
|
-
const value = normalizeValueWithProperty(style[key], key);
|
|
58
|
-
if (value == null || value == void 0)
|
|
59
|
-
continue;
|
|
60
|
-
let hash;
|
|
61
|
-
if (presetHashes[value]) {
|
|
62
|
-
hash = value;
|
|
63
|
-
} else {
|
|
64
|
-
hash = simpleHash(`${value}`);
|
|
65
|
-
}
|
|
66
|
-
const pseudoPrefix = pseudo ? `0${pseudo.name}-` : "";
|
|
67
|
-
const shortProp = conf.inverseShorthands[key] || key;
|
|
68
|
-
const identifier = `_${shortProp}-${pseudoPrefix}${hash}`;
|
|
69
|
-
const rules = createAtomicRules(identifier, key, value, pseudo);
|
|
70
|
-
const styleObject = {
|
|
71
|
-
property: key,
|
|
72
|
-
pseudo: pseudo == null ? void 0 : pseudo.name,
|
|
73
|
-
value,
|
|
74
|
-
identifier,
|
|
75
|
-
rules
|
|
76
|
-
};
|
|
77
|
-
out.push(styleObject);
|
|
78
|
-
}
|
|
79
|
-
if (process.env.NODE_ENV === "development" && process.env.TAMAGUI_DEBUG) {
|
|
80
|
-
if (out.find((x) => x.property === "transform" && x.value.includes(`[object Object]`))) {
|
|
81
|
-
debugger;
|
|
82
|
-
}
|
|
83
|
-
}
|
|
84
|
-
return out;
|
|
85
|
-
};
|
|
86
|
-
const presetHashes = {
|
|
87
|
-
none: true
|
|
88
|
-
};
|
|
89
|
-
function styleToCSS(style) {
|
|
90
|
-
const { shadowOffset, shadowRadius, shadowColor } = style;
|
|
91
|
-
if (style.shadowRadius !== void 0) {
|
|
92
|
-
const offset = shadowOffset || defaultOffset;
|
|
93
|
-
const shadow = `${normalizeValueWithProperty(
|
|
94
|
-
offset.width
|
|
95
|
-
)} ${normalizeValueWithProperty(offset.height)} ${normalizeValueWithProperty(
|
|
96
|
-
shadowRadius
|
|
97
|
-
)} ${shadowColor}`;
|
|
98
|
-
style.boxShadow = style.boxShadow ? `${style.boxShadow}, ${shadow}` : shadow;
|
|
99
|
-
style.shadowOffset = void 0;
|
|
100
|
-
style.shadowRadius = void 0;
|
|
101
|
-
style.shadowColor = void 0;
|
|
102
|
-
}
|
|
103
|
-
const { textShadowColor, textShadowOffset, textShadowRadius } = style;
|
|
104
|
-
if (textShadowColor || textShadowOffset || textShadowRadius) {
|
|
105
|
-
const { height, width } = textShadowOffset || defaultOffset;
|
|
106
|
-
const radius = textShadowRadius || 0;
|
|
107
|
-
const color = normalizeValueWithProperty(textShadowColor, "textShadowColor");
|
|
108
|
-
if (color && (height !== 0 || width !== 0 || radius !== 0)) {
|
|
109
|
-
const blurRadius = normalizeValueWithProperty(radius);
|
|
110
|
-
const offsetX = normalizeValueWithProperty(width);
|
|
111
|
-
const offsetY = normalizeValueWithProperty(height);
|
|
112
|
-
style.textShadow = `${offsetX} ${offsetY} ${blurRadius} ${color}`;
|
|
113
|
-
}
|
|
114
|
-
style.textShadowColor = void 0;
|
|
115
|
-
style.textShadowOffset = void 0;
|
|
116
|
-
style.textShadowRadius = void 0;
|
|
117
|
-
}
|
|
118
|
-
}
|
|
119
|
-
function createDeclarationBlock(style, important = false) {
|
|
120
|
-
let next = "";
|
|
121
|
-
for (const key in style) {
|
|
122
|
-
const prop = hyphenateStyleName(key);
|
|
123
|
-
const value = style[key];
|
|
124
|
-
next += `${prop}:${value}${important ? " !important" : ""};`;
|
|
125
|
-
}
|
|
126
|
-
return `{${next}}`;
|
|
127
|
-
}
|
|
128
|
-
const hcache = {};
|
|
129
|
-
const toHyphenLower = (match) => `-${match.toLowerCase()}`;
|
|
130
|
-
const hyphenateStyleName = (key) => {
|
|
131
|
-
let val = hcache[key];
|
|
132
|
-
if (val)
|
|
133
|
-
return val;
|
|
134
|
-
hcache[key] = val = key.replace(/[A-Z]/g, toHyphenLower);
|
|
135
|
-
return val;
|
|
136
|
-
};
|
|
137
|
-
const pseudoSelectorPrefixes = (() => {
|
|
138
|
-
const res = {};
|
|
139
|
-
for (const key in pseudoDescriptors) {
|
|
140
|
-
const pseudo = pseudoDescriptors[key];
|
|
141
|
-
res[pseudo.name] = `${[...Array(pseudo.priority)].map(() => ":root").join("")} `;
|
|
142
|
-
}
|
|
143
|
-
return res;
|
|
144
|
-
})();
|
|
145
|
-
function createAtomicRules(identifier, property, value, pseudo) {
|
|
146
|
-
const selector = pseudo ? `${pseudoSelectorPrefixes[pseudo.name]} .${identifier}:${pseudo.name}` : `.${identifier}`;
|
|
147
|
-
const important = !!pseudo;
|
|
148
|
-
let rules = [];
|
|
149
|
-
switch (property) {
|
|
150
|
-
case "placeholderTextColor": {
|
|
151
|
-
const block = createDeclarationBlock({ color: value, opacity: 1 }, important);
|
|
152
|
-
rules.push(`${selector}::placeholder${block}`);
|
|
153
|
-
break;
|
|
154
|
-
}
|
|
155
|
-
case "backgroundClip":
|
|
156
|
-
case "userSelect": {
|
|
157
|
-
const propertyCapitalized = `${property[0].toUpperCase()}${property.slice(1)}`;
|
|
158
|
-
const webkitProperty = `Webkit${propertyCapitalized}`;
|
|
159
|
-
const block = createDeclarationBlock(
|
|
160
|
-
{ [property]: value, [webkitProperty]: value },
|
|
161
|
-
important
|
|
162
|
-
);
|
|
163
|
-
rules.push(`${selector}${block}`);
|
|
164
|
-
break;
|
|
165
|
-
}
|
|
166
|
-
case "pointerEvents": {
|
|
167
|
-
let finalValue = value;
|
|
168
|
-
if (value === "auto" || value === "box-only") {
|
|
169
|
-
finalValue = "auto";
|
|
170
|
-
if (value === "box-only") {
|
|
171
|
-
rules.push(`${selector}>*${boxOnly}`);
|
|
172
|
-
}
|
|
173
|
-
} else if (value === "none" || value === "box-none") {
|
|
174
|
-
finalValue = "none";
|
|
175
|
-
if (value === "box-none") {
|
|
176
|
-
rules.push(`${selector}>*${boxNone}`);
|
|
177
|
-
}
|
|
178
|
-
}
|
|
179
|
-
const block = createDeclarationBlock({ pointerEvents: finalValue }, true);
|
|
180
|
-
rules.push(`${selector}${block}`);
|
|
181
|
-
break;
|
|
182
|
-
}
|
|
183
|
-
default: {
|
|
184
|
-
const block = createDeclarationBlock({ [property]: value }, important);
|
|
185
|
-
rules.push(`${selector}${block}`);
|
|
186
|
-
break;
|
|
187
|
-
}
|
|
188
|
-
}
|
|
189
|
-
if (pseudo && pseudo.name === "hover") {
|
|
190
|
-
rules = rules.map((r) => `@media not all and (hover: none) { ${r} }`);
|
|
191
|
-
}
|
|
192
|
-
return rules;
|
|
193
|
-
}
|
|
194
|
-
const boxNone = createDeclarationBlock({ pointerEvents: "auto" }, true);
|
|
195
|
-
const boxOnly = createDeclarationBlock({ pointerEvents: "none" }, true);
|
|
196
|
-
export {
|
|
197
|
-
getAtomicStyle,
|
|
198
|
-
getStylesAtomic,
|
|
199
|
-
styleToCSS
|
|
200
|
-
};
|
|
1
|
+
import{simpleHash as y}from"@tamagui/helpers";import{getConfig as x}from"../config.js";import{defaultOffset as m}from"./defaultOffset.js";import{normalizeValueWithProperty as f}from"./normalizeValueWithProperty.js";import{pseudoDescriptors as l}from"./pseudoDescriptors.js";const O=[l.hoverStyle,l.pressStyle,l.focusStyle];function U(e){if(!(e.hoverStyle||e.pressStyle||e.focusStyle))return S(e);const{hoverStyle:o,pressStyle:t,focusStyle:c,...r}=e;let n=[];for(const[s,i]of[o,t,c,r].entries()){if(!i)continue;const a=O[s];n=[...n,...S(i,a)]}return n}function S(e,o){if(!e)return[];if(process.env.NODE_ENV==="development"&&(!e||typeof e!="object"))throw new Error(`Wrong style type: "${typeof e}": ${e}`);return j(e,o)}let $;const j=(e,o)=>{$=$||x();const t=e;t.transform&&Array.isArray(t.transform)&&(t.transform=t.transform.map(r=>{const n=Object.keys(r)[0],s=r[n];return n==="matrix"||n==="matrix3d"?`${n}(${s.join(",")})`:`${n}(${f(s,n)})`}).join(" ")),k(t);const c=[];for(const r in t){const n=f(t[r],r);if(n==null||n==null)continue;let s;C[n]?s=n:s=y(`${n}`);const i=o?`0${o.name}-`:"",d=`_${$.inverseShorthands[r]||r}-${i}${s}`,h=A(d,r,n,o),p={property:r,pseudo:o==null?void 0:o.name,value:n,identifier:d,rules:h};c.push(p)}if(process.env.NODE_ENV==="development"&&process.env.TAMAGUI_DEBUG&&c.find(r=>r.property==="transform"&&r.value.includes("[object Object]")))debugger;return c},C={none:!0};function k(e){const{shadowOffset:o,shadowRadius:t,shadowColor:c}=e;if(e.shadowRadius!==void 0){const i=o||m,a=`${f(i.width)} ${f(i.height)} ${f(t)} ${c}`;e.boxShadow=e.boxShadow?`${e.boxShadow}, ${a}`:a,e.shadowOffset=void 0,e.shadowRadius=void 0,e.shadowColor=void 0}const{textShadowColor:r,textShadowOffset:n,textShadowRadius:s}=e;if(r||n||s){const{height:i,width:a}=n||m,d=s||0,h=f(r,"textShadowColor");if(h&&(i!==0||a!==0||d!==0)){const p=f(d),w=f(a),g=f(i);e.textShadow=`${w} ${g} ${p} ${h}`}e.textShadowColor=void 0,e.textShadowOffset=void 0,e.textShadowRadius=void 0}}function u(e,o=!1){let t="";for(const c in e){const r=R(c),n=e[c];t+=`${r}:${n}${o?" !important":""};`}return`{${t}}`}const b={},P=e=>`-${e.toLowerCase()}`,R=e=>{let o=b[e];return o||(b[e]=o=e.replace(/[A-Z]/g,P),o)},v=(()=>{const e={};for(const o in l){const t=l[o];e[t.name]=`${[...Array(t.priority)].map(()=>":root").join("")} `}return e})();function A(e,o,t,c){const r=c?`${v[c.name]} .${e}:${c.name}`:`.${e}`,n=!!c;let s=[];switch(o){case"placeholderTextColor":{const i=u({color:t,opacity:1},n);s.push(`${r}::placeholder${i}`);break}case"backgroundClip":case"userSelect":{const a=`Webkit${`${o[0].toUpperCase()}${o.slice(1)}`}`,d=u({[o]:t,[a]:t},n);s.push(`${r}${d}`);break}case"pointerEvents":{let i=t;t==="auto"||t==="box-only"?(i="auto",t==="box-only"&&s.push(`${r}>*${D}`)):(t==="none"||t==="box-none")&&(i="none",t==="box-none"&&s.push(`${r}>*${E}`));const a=u({pointerEvents:i},!0);s.push(`${r}${a}`);break}default:{const i=u({[o]:t},n);s.push(`${r}${i}`);break}}return c&&c.name==="hover"&&(s=s.map(i=>`@media not all and (hover: none) { ${i} }`)),s}const E=u({pointerEvents:"auto"},!0),D=u({pointerEvents:"none"},!0);export{S as getAtomicStyle,U as getStylesAtomic,k as styleToCSS};
|
|
201
2
|
//# sourceMappingURL=getStylesAtomic.mjs.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/getStylesAtomic.ts"],
|
|
4
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'\n\nimport { getConfig } from '../config.js'\nimport type { TamaguiInternalConfig, ViewStyleWithPseudos } from '../types.js'\nimport { defaultOffset } from './defaultOffset.js'\nimport { normalizeValueWithProperty } from './normalizeValueWithProperty.js'\nimport { PseudoDescriptor, pseudoDescriptors } from './pseudoDescriptors.js'\n\n// refactor this file away next...\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\nexport function getAtomicStyle(\n style: ViewStyleWithPseudos,\n pseudo?: PseudoDescriptor\n): StyleObject[] {\n if (!style) return []\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 return generateAtomicStyles(style, pseudo)\n}\n\nlet conf: TamaguiInternalConfig\n\nconst generateAtomicStyles = (\n styleIn: ViewStyleWithPseudos,\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\n let hash: string\n if (presetHashes[value]) {\n hash = value as string\n } else {\n hash = simpleHash(`${value}`)\n }\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 if (process.env.NODE_ENV === 'development' && process.env.TAMAGUI_DEBUG) {\n // when Animated.Value gets passed into Tamagui problems are caused this helps debug\n if (\n out.find((x) => x.property === 'transform' && x.value.includes(`[object Object]`))\n ) {\n // rome-ignore lint/suspicious/noDebugger: only dev\n debugger\n }\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,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["simpleHash", "getConfig", "defaultOffset", "normalizeValueWithProperty", "pseudoDescriptors", "pseudosOrdered", "getStylesAtomic", "stylesIn", "getAtomicStyle", "hoverStyle", "pressStyle", "focusStyle", "base", "res", "index", "style", "pseudo", "generateAtomicStyles", "conf", "styleIn", "transform", "type", "value", "styleToCSS", "out", "key", "hash", "presetHashes", "pseudoPrefix", "identifier", "rules", "createAtomicRules", "styleObject", "x", "shadowOffset", "shadowRadius", "shadowColor", "offset", "shadow", "textShadowColor", "textShadowOffset", "textShadowRadius", "height", "width", "radius", "color", "blurRadius", "offsetX", "offsetY", "createDeclarationBlock", "important", "next", "prop", "hyphenateStyleName", "hcache", "toHyphenLower", "match", "val", "pseudoSelectorPrefixes", "property", "selector", "block", "webkitProperty", "finalValue", "boxOnly", "boxNone", "r"]
|
|
7
7
|
}
|
|
@@ -1,12 +1,2 @@
|
|
|
1
|
-
const
|
|
2
|
-
console.warn("no-op native");
|
|
3
|
-
};
|
|
4
|
-
const getStylesAtomic = empty;
|
|
5
|
-
const getAtomicStyle = empty;
|
|
6
|
-
const styleToCSS = empty;
|
|
7
|
-
export {
|
|
8
|
-
getAtomicStyle,
|
|
9
|
-
getStylesAtomic,
|
|
10
|
-
styleToCSS
|
|
11
|
-
};
|
|
1
|
+
const t=()=>{console.warn("no-op native")},o=t,e=t,n=t;export{e as getAtomicStyle,o as getStylesAtomic,n as styleToCSS};
|
|
12
2
|
//# sourceMappingURL=getStylesAtomic.native.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/getStylesAtomic.native.ts"],
|
|
4
4
|
"sourcesContent": ["const empty = () => {\n // eslint-disable-next-line no-console\n console.warn('no-op native')\n}\n\nexport const getStylesAtomic = empty\nexport const getAtomicStyle = empty\nexport const styleToCSS = empty\n"],
|
|
5
|
-
"mappings": "AAAA,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,MAAMA,EAAQ,IAAM,CAElB,QAAQ,KAAK,cAAc,CAC7B,EAEaC,EAAkBD,EAClBE,EAAiBF,EACjBG,EAAaH",
|
|
6
|
+
"names": ["empty", "getStylesAtomic", "getAtomicStyle", "styleToCSS"]
|
|
7
7
|
}
|
|
@@ -1,12 +1,2 @@
|
|
|
1
|
-
const
|
|
2
|
-
console.warn("no-op native");
|
|
3
|
-
};
|
|
4
|
-
const getStylesAtomic = empty;
|
|
5
|
-
const getAtomicStyle = empty;
|
|
6
|
-
const styleToCSS = empty;
|
|
7
|
-
export {
|
|
8
|
-
getAtomicStyle,
|
|
9
|
-
getStylesAtomic,
|
|
10
|
-
styleToCSS
|
|
11
|
-
};
|
|
1
|
+
const t=()=>{console.warn("no-op native")},o=t,e=t,n=t;export{e as getAtomicStyle,o as getStylesAtomic,n as styleToCSS};
|
|
12
2
|
//# sourceMappingURL=getStylesAtomic.native.mjs.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/getStylesAtomic.native.ts"],
|
|
4
4
|
"sourcesContent": ["const empty = () => {\n // eslint-disable-next-line no-console\n console.warn('no-op native')\n}\n\nexport const getStylesAtomic = empty\nexport const getAtomicStyle = empty\nexport const styleToCSS = empty\n"],
|
|
5
|
-
"mappings": "AAAA,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,MAAMA,EAAQ,IAAM,CAElB,QAAQ,KAAK,cAAc,CAC7B,EAEaC,EAAkBD,EAClBE,EAAiBF,EACjBG,EAAaH",
|
|
6
|
+
"names": ["empty", "getStylesAtomic", "getAtomicStyle", "styleToCSS"]
|
|
7
7
|
}
|
|
@@ -1,103 +1,5 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
function getThemeCSSRules({
|
|
6
|
-
config,
|
|
7
|
-
themeName,
|
|
8
|
-
theme,
|
|
9
|
-
names
|
|
10
|
-
}) {
|
|
11
|
-
const cssRuleSets = [];
|
|
12
|
-
const hasDarkLight = "light" in config.themes && "dark" in config.themes;
|
|
13
|
-
const CNP = `.${THEME_CLASSNAME_PREFIX}`;
|
|
14
|
-
let vars = "";
|
|
15
|
-
for (const themeKey in theme) {
|
|
16
|
-
const variable = theme[themeKey];
|
|
17
|
-
let value = null;
|
|
18
|
-
if (!tokensValueToVariable.has(variable.val)) {
|
|
19
|
-
value = variable.val;
|
|
20
|
-
} else {
|
|
21
|
-
value = tokensValueToVariable.get(variable.val).variable;
|
|
22
|
-
}
|
|
23
|
-
vars += `--${simpleHash(themeKey, 40)}:${value};`;
|
|
24
|
-
}
|
|
25
|
-
const isDarkOrLightBase = themeName === "dark" || themeName === "light";
|
|
26
|
-
const selectorsSet = new Set(
|
|
27
|
-
names.map((name) => {
|
|
28
|
-
return `${CNP}${name}`;
|
|
29
|
-
})
|
|
30
|
-
);
|
|
31
|
-
if (hasDarkLight) {
|
|
32
|
-
for (const subName of names) {
|
|
33
|
-
const isDark = themeName === "dark" || subName.startsWith("dark_");
|
|
34
|
-
const maxDepth = config.maxDarkLightNesting ?? 3;
|
|
35
|
-
if (!(isDark || subName.startsWith("light_"))) {
|
|
36
|
-
selectorsSet.add(`:root:root ${CNP}${subName}`);
|
|
37
|
-
continue;
|
|
38
|
-
}
|
|
39
|
-
const childSelector = `${CNP}${subName.replace(isDark ? "dark_" : "light_", "")}`;
|
|
40
|
-
const [altLightDark, altSubTheme] = [
|
|
41
|
-
isDark ? ["dark", "light"] : ["light", "dark"],
|
|
42
|
-
isDark ? ["dark", "sub_theme"] : ["light", "sub_theme"]
|
|
43
|
-
];
|
|
44
|
-
for (const order of [altLightDark, altSubTheme]) {
|
|
45
|
-
if (isDarkOrLightBase) {
|
|
46
|
-
order.reverse();
|
|
47
|
-
}
|
|
48
|
-
const [stronger, weaker] = order;
|
|
49
|
-
const numSelectors = Math.round(maxDepth * 1.5);
|
|
50
|
-
for (let depth = 0; depth < numSelectors; depth++) {
|
|
51
|
-
const isOdd = depth % 2 === 1;
|
|
52
|
-
if (isOdd && depth < 3) {
|
|
53
|
-
continue;
|
|
54
|
-
}
|
|
55
|
-
const parents = new Array(depth + 1).fill(0).map((_, psi) => {
|
|
56
|
-
return `${CNP}${psi % 2 === 0 ? stronger : weaker}`;
|
|
57
|
-
});
|
|
58
|
-
let parentSelectors = parents.length > 1 ? parents.slice(1) : parents;
|
|
59
|
-
if (isOdd) {
|
|
60
|
-
const [_first, second, ...rest] = parentSelectors;
|
|
61
|
-
parentSelectors = [second, ...rest, second];
|
|
62
|
-
}
|
|
63
|
-
const lastParentSelector = parentSelectors[parentSelectors.length - 1];
|
|
64
|
-
const nextChildSelector = childSelector === lastParentSelector ? "" : childSelector;
|
|
65
|
-
selectorsSet.add(`${parentSelectors.join(" ")} ${nextChildSelector}`.trim());
|
|
66
|
-
}
|
|
67
|
-
}
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
const selectors = [...selectorsSet];
|
|
71
|
-
const selectorsString = selectors.map((x) => {
|
|
72
|
-
const rootSep = isBaseTheme(x) && config.themeClassNameOnRoot ? "" : " ";
|
|
73
|
-
return `:root${rootSep}${x}`;
|
|
74
|
-
}).join(", ");
|
|
75
|
-
const css = `${selectorsString} {${vars}}`;
|
|
76
|
-
cssRuleSets.push(css);
|
|
77
|
-
if (config.shouldAddPrefersColorThemes) {
|
|
78
|
-
const bgString = variableToString(theme.background);
|
|
79
|
-
const fgString = variableToString(theme.color);
|
|
80
|
-
const bodyRules = `body{background:${bgString};color:${fgString};}`;
|
|
81
|
-
const isDark = themeName.startsWith("dark");
|
|
82
|
-
const baseName = isDark ? "dark" : "light";
|
|
83
|
-
const lessSpecificSelectors = selectors.map((x) => {
|
|
84
|
-
if (x == darkSelector || x === lightSelector)
|
|
85
|
-
return `:root`;
|
|
86
|
-
return x.replace(/^\.t_(dark|light) /, "").trim();
|
|
87
|
-
}).filter(Boolean).join(", ");
|
|
88
|
-
const themeRules = `${lessSpecificSelectors} {${vars}}`;
|
|
89
|
-
const prefersMediaSelectors = `@media(prefers-color-scheme:${baseName}){
|
|
90
|
-
${bodyRules}
|
|
91
|
-
${themeRules}
|
|
92
|
-
}`;
|
|
93
|
-
cssRuleSets.push(prefersMediaSelectors);
|
|
94
|
-
}
|
|
95
|
-
return cssRuleSets;
|
|
96
|
-
}
|
|
97
|
-
const darkSelector = ".t_dark";
|
|
98
|
-
const lightSelector = ".t_light";
|
|
99
|
-
const isBaseTheme = (x) => x === darkSelector || x === lightSelector || x.startsWith(".t_dark ") || x.startsWith(".t_light ");
|
|
100
|
-
export {
|
|
101
|
-
getThemeCSSRules
|
|
102
|
-
};
|
|
1
|
+
import{simpleHash as N}from"@tamagui/helpers";import{THEME_CLASSNAME_PREFIX as V}from"../constants/constants.js";import{variableToString as v}from"../createVariable.js";import{tokensValueToVariable as C}from"./registerCSSVariable.js";function X({config:r,themeName:n,theme:l,names:$}){const g=[],y="light"in r.themes&&"dark"in r.themes,c=`.${V}`;let m="";for(const t in l){const e=l[t];let s=null;C.has(e.val)?s=C.get(e.val).variable:s=e.val,m+=`--${N(t,40)}:${s};`}const R=n==="dark"||n==="light",p=new Set($.map(t=>`${c}${t}`));if(y)for(const t of $){const e=n==="dark"||t.startsWith("dark_"),s=r.maxDarkLightNesting??3;if(!(e||t.startsWith("light_"))){p.add(`:root:root ${c}${t}`);continue}const u=`${c}${t.replace(e?"dark_":"light_","")}`,[S,_]=[e?["dark","light"]:["light","dark"],e?["dark","sub_theme"]:["light","sub_theme"]];for(const h of[S,_]){R&&h.reverse();const[f,o]=h,W=Math.round(s*1.5);for(let a=0;a<W;a++){const T=a%2===1;if(T&&a<3)continue;const k=new Array(a+1).fill(0).map((E,d)=>`${c}${d%2===0?f:o}`);let i=k.length>1?k.slice(1):k;if(T){const[E,d,...M]=i;i=[d,...M,d]}const j=i[i.length-1],A=u===j?"":u;p.add(`${i.join(" ")} ${A}`.trim())}}}const b=[...p],L=`${b.map(t=>`:root${w(t)&&r.themeClassNameOnRoot?"":" "}${t}`).join(", ")} {${m}}`;if(g.push(L),r.shouldAddPrefersColorThemes){const t=v(l.background),e=v(l.color),s=`body{background:${t};color:${e};}`,S=n.startsWith("dark")?"dark":"light",h=`${b.map(o=>o==D||o===P?":root":o.replace(/^\.t_(dark|light) /,"").trim()).filter(Boolean).join(", ")} {${m}}`,f=`@media(prefers-color-scheme:${S}){
|
|
2
|
+
${s}
|
|
3
|
+
${h}
|
|
4
|
+
}`;g.push(f)}return g}const D=".t_dark",P=".t_light",w=r=>r===D||r===P||r.startsWith(".t_dark ")||r.startsWith(".t_light ");export{X as getThemeCSSRules};
|
|
103
5
|
//# sourceMappingURL=getThemeCSSRules.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/getThemeCSSRules.ts"],
|
|
4
4
|
"sourcesContent": ["import { simpleHash } from '@tamagui/helpers'\n\nimport { THEME_CLASSNAME_PREFIX } from '../constants/constants.js'\nimport { Variable, variableToString } from '../createVariable.js'\nimport type { CreateTamaguiProps, ThemeParsed } from '../types.js'\nimport { tokensValueToVariable } from './registerCSSVariable.js'\n\nexport function getThemeCSSRules({\n config,\n themeName,\n theme,\n names,\n}: {\n config: CreateTamaguiProps\n themeName: string\n theme: ThemeParsed\n names: string[]\n}) {\n const cssRuleSets: string[] = []\n\n // special case for SSR\n const hasDarkLight = 'light' in config.themes && 'dark' in config.themes\n const CNP = `.${THEME_CLASSNAME_PREFIX}`\n let vars = ''\n\n // themeToVariableToValueMap.set(theme, {})\n // const varToValMap = themeToVariableToValueMap.get(theme)\n for (const themeKey in theme) {\n const variable = theme[themeKey] as Variable\n let value: any = null\n // if (varToValMap) {\n // varToValMap[variable.variable] = variable.val\n // }\n if (!tokensValueToVariable.has(variable.val)) {\n value = variable.val\n } else {\n value = tokensValueToVariable.get(variable.val)!.variable\n }\n // Hash themeKey in case it has invalid chars too\n vars += `--${simpleHash(themeKey, 40)}:${value};`\n }\n\n const isDarkOrLightBase = themeName === 'dark' || themeName === 'light'\n const selectorsSet = new Set(\n names.map((name) => {\n return `${CNP}${name}`\n })\n )\n\n // since we dont specify dark/light in classnames we have to do an awkward specificity war\n // use config.maxDarkLightNesting to determine how deep you can nest until it breaks\n if (hasDarkLight) {\n for (const subName of names) {\n const isDark = themeName === 'dark' || subName.startsWith('dark_')\n const maxDepth = config.maxDarkLightNesting ?? 3\n\n if (!(isDark || subName.startsWith('light_'))) {\n // neither light nor dark subtheme, just generate one selector with :root:root which\n // will override all :root light/dark selectors generated below\n selectorsSet.add(`:root:root ${CNP}${subName}`)\n continue\n }\n\n const childSelector = `${CNP}${subName.replace(isDark ? 'dark_' : 'light_', '')}`\n\n const [altLightDark, altSubTheme] = [\n isDark ? ['dark', 'light'] : ['light', 'dark'],\n isDark ? ['dark', 'sub_theme'] : ['light', 'sub_theme'],\n ]\n\n for (const order of [altLightDark, altSubTheme]) {\n if (isDarkOrLightBase) {\n order.reverse()\n }\n const [stronger, weaker] = order\n const numSelectors = Math.round(maxDepth * 1.5)\n\n for (let depth = 0; depth < numSelectors; depth++) {\n const isOdd = depth % 2 === 1\n\n // wtf is this continue:\n if (isOdd && depth < 3) {\n continue\n }\n\n const parents = new Array(depth + 1).fill(0).map((_, psi) => {\n return `${CNP}${psi % 2 === 0 ? stronger : weaker}`\n })\n\n let parentSelectors = parents.length > 1 ? parents.slice(1) : parents\n\n if (isOdd) {\n const [_first, second, ...rest] = parentSelectors\n parentSelectors = [second, ...rest, second]\n }\n\n const lastParentSelector = parentSelectors[parentSelectors.length - 1]\n const nextChildSelector =\n childSelector === lastParentSelector ? '' : childSelector\n\n // for light/dark/light:\n selectorsSet.add(`${parentSelectors.join(' ')} ${nextChildSelector}`.trim())\n }\n }\n }\n }\n\n const selectors = [...selectorsSet]\n\n // only do our :root attach if it's not light/dark - not support sub themes on root saves a lot of effort/size\n // this isBaseTheme logic could probably be done more efficiently above\n const selectorsString = selectors\n .map((x) => {\n const rootSep = isBaseTheme(x) && config.themeClassNameOnRoot ? '' : ' '\n return `:root${rootSep}${x}`\n })\n .join(', ')\n\n const css = `${selectorsString} {${vars}}`\n cssRuleSets.push(css)\n\n if (config.shouldAddPrefersColorThemes) {\n const bgString = variableToString(theme.background)\n const fgString = variableToString(theme.color)\n const bodyRules = `body{background:${bgString};color:${fgString};}`\n const isDark = themeName.startsWith('dark')\n const baseName = isDark ? 'dark' : 'light'\n const lessSpecificSelectors = selectors\n .map((x) => {\n if (x == darkSelector || x === lightSelector) return `:root`\n return x.replace(/^\\.t_(dark|light) /, '').trim()\n })\n .filter(Boolean)\n .join(', ')\n const themeRules = `${lessSpecificSelectors} {${vars}}`\n const prefersMediaSelectors = `@media(prefers-color-scheme:${baseName}){\n ${bodyRules}\n ${themeRules}\n}`\n cssRuleSets.push(prefersMediaSelectors)\n }\n\n return cssRuleSets\n}\n\nconst darkSelector = '.t_dark'\nconst lightSelector = '.t_light'\nconst isBaseTheme = (x: string) =>\n x === darkSelector ||\n x === lightSelector ||\n x.startsWith('.t_dark ') ||\n x.startsWith('.t_light ')\n"],
|
|
5
|
-
"mappings": "AAAA,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,OAAS,cAAAA,MAAkB,mBAE3B,OAAS,0BAAAC,MAA8B,4BACvC,OAAmB,oBAAAC,MAAwB,uBAE3C,OAAS,yBAAAC,MAA6B,2BAE/B,SAASC,EAAiB,CAC/B,OAAAC,EACA,UAAAC,EACA,MAAAC,EACA,MAAAC,CACF,EAKG,CACD,MAAMC,EAAwB,CAAC,EAGzBC,EAAe,UAAWL,EAAO,QAAU,SAAUA,EAAO,OAC5DM,EAAM,IAAIV,IAChB,IAAIW,EAAO,GAIX,UAAWC,KAAYN,EAAO,CAC5B,MAAMO,EAAWP,EAAMM,CAAQ,EAC/B,IAAIE,EAAa,KAIZZ,EAAsB,IAAIW,EAAS,GAAG,EAGzCC,EAAQZ,EAAsB,IAAIW,EAAS,GAAG,EAAG,SAFjDC,EAAQD,EAAS,IAKnBF,GAAQ,KAAKZ,EAAWa,EAAU,EAAE,KAAKE,IAC3C,CAEA,MAAMC,EAAoBV,IAAc,QAAUA,IAAc,QAC1DW,EAAe,IAAI,IACvBT,EAAM,IAAKU,GACF,GAAGP,IAAMO,GACjB,CACH,EAIA,GAAIR,EACF,UAAWS,KAAWX,EAAO,CAC3B,MAAMY,EAASd,IAAc,QAAUa,EAAQ,WAAW,OAAO,EAC3DE,EAAWhB,EAAO,qBAAuB,EAE/C,GAAI,EAAEe,GAAUD,EAAQ,WAAW,QAAQ,GAAI,CAG7CF,EAAa,IAAI,cAAcN,IAAMQ,GAAS,EAC9C,QACF,CAEA,MAAMG,EAAgB,GAAGX,IAAMQ,EAAQ,QAAQC,EAAS,QAAU,SAAU,EAAE,IAExE,CAACG,EAAcC,CAAW,EAAI,CAClCJ,EAAS,CAAC,OAAQ,OAAO,EAAI,CAAC,QAAS,MAAM,EAC7CA,EAAS,CAAC,OAAQ,WAAW,EAAI,CAAC,QAAS,WAAW,CACxD,EAEA,UAAWK,IAAS,CAACF,EAAcC,CAAW,EAAG,CAC3CR,GACFS,EAAM,QAAQ,EAEhB,KAAM,CAACC,EAAUC,CAAM,EAAIF,EACrBG,EAAe,KAAK,MAAMP,EAAW,GAAG,EAE9C,QAASQ,EAAQ,EAAGA,EAAQD,EAAcC,IAAS,CACjD,MAAMC,EAAQD,EAAQ,IAAM,EAG5B,GAAIC,GAASD,EAAQ,EACnB,SAGF,MAAME,EAAU,IAAI,MAAMF,EAAQ,CAAC,EAAE,KAAK,CAAC,EAAE,IAAI,CAACG,EAAGC,IAC5C,GAAGtB,IAAMsB,EAAM,IAAM,EAAIP,EAAWC,GAC5C,EAED,IAAIO,EAAkBH,EAAQ,OAAS,EAAIA,EAAQ,MAAM,CAAC,EAAIA,EAE9D,GAAID,EAAO,CACT,KAAM,CAACK,EAAQC,EAAQ,GAAGC,CAAI,EAAIH,EAClCA,EAAkB,CAACE,EAAQ,GAAGC,EAAMD,CAAM,CAC5C,CAEA,MAAME,EAAqBJ,EAAgBA,EAAgB,OAAS,CAAC,EAC/DK,EACJjB,IAAkBgB,EAAqB,GAAKhB,EAG9CL,EAAa,IAAI,GAAGiB,EAAgB,KAAK,GAAG,KAAKK,IAAoB,KAAK,CAAC,CAC7E,CACF,CACF,CAGF,MAAMC,EAAY,CAAC,GAAGvB,CAAY,EAW5BwB,EAAM,GAPYD,EACrB,IAAKE,GAEG,QADSC,EAAYD,CAAC,GAAKrC,EAAO,qBAAuB,GAAK,MAC5CqC,GAC1B,EACA,KAAK,IAAI,MAEuB9B,KAGnC,GAFAH,EAAY,KAAKgC,CAAG,EAEhBpC,EAAO,4BAA6B,CACtC,MAAMuC,EAAW1C,EAAiBK,EAAM,UAAU,EAC5CsC,EAAW3C,EAAiBK,EAAM,KAAK,EACvCuC,EAAY,mBAAmBF,WAAkBC,MAEjDE,EADSzC,EAAU,WAAW,MAAM,EAChB,OAAS,QAQ7B0C,EAAa,GAPWR,EAC3B,IAAKE,GACAA,GAAKO,GAAgBP,IAAMQ,EAAsB,QAC9CR,EAAE,QAAQ,qBAAsB,EAAE,EAAE,KAAK,CACjD,EACA,OAAO,OAAO,EACd,KAAK,IAAI,MACoC9B,KAC1CuC,EAAwB,+BAA+BJ;AAAA,IAC7DD;AAAA,IACAE;AAAA,GAEAvC,EAAY,KAAK0C,CAAqB,CACxC,CAEA,OAAO1C,CACT,CAEA,MAAMwC,EAAe,UACfC,EAAgB,WAChBP,EAAeD,GACnBA,IAAMO,GACNP,IAAMQ,GACNR,EAAE,WAAW,UAAU,GACvBA,EAAE,WAAW,WAAW",
|
|
6
|
+
"names": ["simpleHash", "THEME_CLASSNAME_PREFIX", "variableToString", "tokensValueToVariable", "getThemeCSSRules", "config", "themeName", "theme", "names", "cssRuleSets", "hasDarkLight", "CNP", "vars", "themeKey", "variable", "value", "isDarkOrLightBase", "selectorsSet", "name", "subName", "isDark", "maxDepth", "childSelector", "altLightDark", "altSubTheme", "order", "stronger", "weaker", "numSelectors", "depth", "isOdd", "parents", "_", "psi", "parentSelectors", "_first", "second", "rest", "lastParentSelector", "nextChildSelector", "selectors", "css", "x", "isBaseTheme", "bgString", "fgString", "bodyRules", "baseName", "themeRules", "darkSelector", "lightSelector", "prefersMediaSelectors"]
|
|
7
7
|
}
|
|
@@ -1,103 +1,5 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
function getThemeCSSRules({
|
|
6
|
-
config,
|
|
7
|
-
themeName,
|
|
8
|
-
theme,
|
|
9
|
-
names
|
|
10
|
-
}) {
|
|
11
|
-
const cssRuleSets = [];
|
|
12
|
-
const hasDarkLight = "light" in config.themes && "dark" in config.themes;
|
|
13
|
-
const CNP = `.${THEME_CLASSNAME_PREFIX}`;
|
|
14
|
-
let vars = "";
|
|
15
|
-
for (const themeKey in theme) {
|
|
16
|
-
const variable = theme[themeKey];
|
|
17
|
-
let value = null;
|
|
18
|
-
if (!tokensValueToVariable.has(variable.val)) {
|
|
19
|
-
value = variable.val;
|
|
20
|
-
} else {
|
|
21
|
-
value = tokensValueToVariable.get(variable.val).variable;
|
|
22
|
-
}
|
|
23
|
-
vars += `--${simpleHash(themeKey, 40)}:${value};`;
|
|
24
|
-
}
|
|
25
|
-
const isDarkOrLightBase = themeName === "dark" || themeName === "light";
|
|
26
|
-
const selectorsSet = new Set(
|
|
27
|
-
names.map((name) => {
|
|
28
|
-
return `${CNP}${name}`;
|
|
29
|
-
})
|
|
30
|
-
);
|
|
31
|
-
if (hasDarkLight) {
|
|
32
|
-
for (const subName of names) {
|
|
33
|
-
const isDark = themeName === "dark" || subName.startsWith("dark_");
|
|
34
|
-
const maxDepth = config.maxDarkLightNesting ?? 3;
|
|
35
|
-
if (!(isDark || subName.startsWith("light_"))) {
|
|
36
|
-
selectorsSet.add(`:root:root ${CNP}${subName}`);
|
|
37
|
-
continue;
|
|
38
|
-
}
|
|
39
|
-
const childSelector = `${CNP}${subName.replace(isDark ? "dark_" : "light_", "")}`;
|
|
40
|
-
const [altLightDark, altSubTheme] = [
|
|
41
|
-
isDark ? ["dark", "light"] : ["light", "dark"],
|
|
42
|
-
isDark ? ["dark", "sub_theme"] : ["light", "sub_theme"]
|
|
43
|
-
];
|
|
44
|
-
for (const order of [altLightDark, altSubTheme]) {
|
|
45
|
-
if (isDarkOrLightBase) {
|
|
46
|
-
order.reverse();
|
|
47
|
-
}
|
|
48
|
-
const [stronger, weaker] = order;
|
|
49
|
-
const numSelectors = Math.round(maxDepth * 1.5);
|
|
50
|
-
for (let depth = 0; depth < numSelectors; depth++) {
|
|
51
|
-
const isOdd = depth % 2 === 1;
|
|
52
|
-
if (isOdd && depth < 3) {
|
|
53
|
-
continue;
|
|
54
|
-
}
|
|
55
|
-
const parents = new Array(depth + 1).fill(0).map((_, psi) => {
|
|
56
|
-
return `${CNP}${psi % 2 === 0 ? stronger : weaker}`;
|
|
57
|
-
});
|
|
58
|
-
let parentSelectors = parents.length > 1 ? parents.slice(1) : parents;
|
|
59
|
-
if (isOdd) {
|
|
60
|
-
const [_first, second, ...rest] = parentSelectors;
|
|
61
|
-
parentSelectors = [second, ...rest, second];
|
|
62
|
-
}
|
|
63
|
-
const lastParentSelector = parentSelectors[parentSelectors.length - 1];
|
|
64
|
-
const nextChildSelector = childSelector === lastParentSelector ? "" : childSelector;
|
|
65
|
-
selectorsSet.add(`${parentSelectors.join(" ")} ${nextChildSelector}`.trim());
|
|
66
|
-
}
|
|
67
|
-
}
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
const selectors = [...selectorsSet];
|
|
71
|
-
const selectorsString = selectors.map((x) => {
|
|
72
|
-
const rootSep = isBaseTheme(x) && config.themeClassNameOnRoot ? "" : " ";
|
|
73
|
-
return `:root${rootSep}${x}`;
|
|
74
|
-
}).join(", ");
|
|
75
|
-
const css = `${selectorsString} {${vars}}`;
|
|
76
|
-
cssRuleSets.push(css);
|
|
77
|
-
if (config.shouldAddPrefersColorThemes) {
|
|
78
|
-
const bgString = variableToString(theme.background);
|
|
79
|
-
const fgString = variableToString(theme.color);
|
|
80
|
-
const bodyRules = `body{background:${bgString};color:${fgString};}`;
|
|
81
|
-
const isDark = themeName.startsWith("dark");
|
|
82
|
-
const baseName = isDark ? "dark" : "light";
|
|
83
|
-
const lessSpecificSelectors = selectors.map((x) => {
|
|
84
|
-
if (x == darkSelector || x === lightSelector)
|
|
85
|
-
return `:root`;
|
|
86
|
-
return x.replace(/^\.t_(dark|light) /, "").trim();
|
|
87
|
-
}).filter(Boolean).join(", ");
|
|
88
|
-
const themeRules = `${lessSpecificSelectors} {${vars}}`;
|
|
89
|
-
const prefersMediaSelectors = `@media(prefers-color-scheme:${baseName}){
|
|
90
|
-
${bodyRules}
|
|
91
|
-
${themeRules}
|
|
92
|
-
}`;
|
|
93
|
-
cssRuleSets.push(prefersMediaSelectors);
|
|
94
|
-
}
|
|
95
|
-
return cssRuleSets;
|
|
96
|
-
}
|
|
97
|
-
const darkSelector = ".t_dark";
|
|
98
|
-
const lightSelector = ".t_light";
|
|
99
|
-
const isBaseTheme = (x) => x === darkSelector || x === lightSelector || x.startsWith(".t_dark ") || x.startsWith(".t_light ");
|
|
100
|
-
export {
|
|
101
|
-
getThemeCSSRules
|
|
102
|
-
};
|
|
1
|
+
import{simpleHash as N}from"@tamagui/helpers";import{THEME_CLASSNAME_PREFIX as V}from"../constants/constants.js";import{variableToString as v}from"../createVariable.js";import{tokensValueToVariable as C}from"./registerCSSVariable.js";function X({config:r,themeName:n,theme:l,names:$}){const g=[],y="light"in r.themes&&"dark"in r.themes,c=`.${V}`;let m="";for(const t in l){const e=l[t];let s=null;C.has(e.val)?s=C.get(e.val).variable:s=e.val,m+=`--${N(t,40)}:${s};`}const R=n==="dark"||n==="light",p=new Set($.map(t=>`${c}${t}`));if(y)for(const t of $){const e=n==="dark"||t.startsWith("dark_"),s=r.maxDarkLightNesting??3;if(!(e||t.startsWith("light_"))){p.add(`:root:root ${c}${t}`);continue}const u=`${c}${t.replace(e?"dark_":"light_","")}`,[S,_]=[e?["dark","light"]:["light","dark"],e?["dark","sub_theme"]:["light","sub_theme"]];for(const h of[S,_]){R&&h.reverse();const[f,o]=h,W=Math.round(s*1.5);for(let a=0;a<W;a++){const T=a%2===1;if(T&&a<3)continue;const k=new Array(a+1).fill(0).map((E,d)=>`${c}${d%2===0?f:o}`);let i=k.length>1?k.slice(1):k;if(T){const[E,d,...M]=i;i=[d,...M,d]}const j=i[i.length-1],A=u===j?"":u;p.add(`${i.join(" ")} ${A}`.trim())}}}const b=[...p],L=`${b.map(t=>`:root${w(t)&&r.themeClassNameOnRoot?"":" "}${t}`).join(", ")} {${m}}`;if(g.push(L),r.shouldAddPrefersColorThemes){const t=v(l.background),e=v(l.color),s=`body{background:${t};color:${e};}`,S=n.startsWith("dark")?"dark":"light",h=`${b.map(o=>o==D||o===P?":root":o.replace(/^\.t_(dark|light) /,"").trim()).filter(Boolean).join(", ")} {${m}}`,f=`@media(prefers-color-scheme:${S}){
|
|
2
|
+
${s}
|
|
3
|
+
${h}
|
|
4
|
+
}`;g.push(f)}return g}const D=".t_dark",P=".t_light",w=r=>r===D||r===P||r.startsWith(".t_dark ")||r.startsWith(".t_light ");export{X as getThemeCSSRules};
|
|
103
5
|
//# sourceMappingURL=getThemeCSSRules.mjs.map
|