@tamagui/core 1.0.0-beta.8 → 1.0.1-beta.18
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 +83 -57
- package/dist/cjs/createComponent.js.map +2 -2
- package/dist/cjs/helpers/fixNativeShadow.native.js +11 -21
- package/dist/cjs/helpers/fixNativeShadow.native.js.map +2 -2
- package/dist/cjs/helpers/getSplitStyles.js +22 -3
- package/dist/cjs/helpers/getSplitStyles.js.map +2 -2
- package/dist/cjs/helpers/nativeGestureHandler.js +29 -0
- package/dist/cjs/helpers/nativeGestureHandler.js.map +7 -0
- package/dist/cjs/helpers/nativeGestureHandler.native.js +18 -0
- package/dist/cjs/helpers/nativeGestureHandler.native.js.map +7 -0
- package/dist/cjs/hooks/usePrevious.js +1 -0
- package/dist/cjs/hooks/usePrevious.js.map +7 -0
- package/dist/cjs/nativeGestureHandler.native.js +18 -0
- package/dist/cjs/nativeGestureHandler.native.js.map +7 -0
- package/dist/cjs/styled.js +0 -1
- package/dist/cjs/styled.js.map +2 -2
- package/dist/cjs/views/Slot.js +22 -3
- package/dist/cjs/views/Slot.js.map +2 -2
- package/dist/cjs/views/Text.js +9 -14
- package/dist/cjs/views/Text.js.map +2 -2
- package/dist/cjs/views/ThemeInverse.js +5 -1
- package/dist/cjs/views/ThemeInverse.js.map +2 -2
- package/dist/esm/createComponent.js +88 -64
- package/dist/esm/createComponent.js.map +2 -2
- package/dist/esm/helpers/fixNativeShadow.native.js +12 -21
- package/dist/esm/helpers/fixNativeShadow.native.js.map +2 -2
- package/dist/esm/helpers/getSplitStyles.js +22 -2
- package/dist/esm/helpers/getSplitStyles.js.map +2 -2
- package/dist/esm/helpers/nativeGestureHandler.js +7 -0
- package/dist/esm/helpers/nativeGestureHandler.js.map +7 -0
- package/dist/esm/helpers/nativeGestureHandler.native.js +2 -0
- package/dist/esm/helpers/nativeGestureHandler.native.js.map +7 -0
- package/dist/esm/hooks/usePrevious.js +1 -0
- package/dist/esm/hooks/usePrevious.js.map +7 -0
- package/dist/esm/nativeGestureHandler.native.js +2 -0
- package/dist/esm/nativeGestureHandler.native.js.map +7 -0
- package/dist/esm/styled.js +0 -1
- package/dist/esm/styled.js.map +2 -2
- package/dist/esm/views/Slot.js +22 -3
- package/dist/esm/views/Slot.js.map +2 -2
- package/dist/esm/views/Text.js +9 -14
- package/dist/esm/views/Text.js.map +2 -2
- package/dist/esm/views/ThemeInverse.js +6 -2
- package/dist/esm/views/ThemeInverse.js.map +2 -2
- package/dist/jsx/createComponent.js +78 -59
- package/dist/jsx/helpers/fixNativeShadow.native.js +12 -21
- package/dist/jsx/helpers/getSplitStyles.js +22 -2
- package/dist/jsx/helpers/nativeGestureHandler.js +6 -0
- package/dist/jsx/helpers/nativeGestureHandler.native.js +1 -0
- package/dist/jsx/hooks/usePrevious.js +0 -0
- package/dist/jsx/nativeGestureHandler.native.js +1 -0
- package/dist/jsx/styled.js +0 -1
- package/dist/jsx/views/Slot.js +22 -3
- package/dist/jsx/views/Text.js +9 -14
- package/dist/jsx/views/ThemeInverse.js +6 -1
- package/package.json +7 -5
- package/types/createComponent.d.ts.map +1 -1
- package/types/helpers/fixNativeShadow.native.d.ts +2 -1
- package/types/helpers/fixNativeShadow.native.d.ts.map +1 -1
- package/types/helpers/getSplitStyles.d.ts.map +1 -1
- package/types/helpers/nativeGestureHandler.d.ts +2 -0
- package/types/helpers/nativeGestureHandler.d.ts.map +1 -0
- package/types/helpers/nativeGestureHandler.native.d.ts +2 -0
- package/types/helpers/nativeGestureHandler.native.d.ts.map +1 -0
- package/types/hooks/usePrevious.d.ts +1 -0
- package/types/hooks/usePrevious.d.ts.map +1 -0
- package/types/nativeGestureHandler.native.d.ts +2 -0
- package/types/nativeGestureHandler.native.d.ts.map +1 -0
- package/types/styled.d.ts.map +1 -1
- package/types/views/Text.d.ts.map +1 -1
- package/types/views/ThemeInverse.d.ts.map +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/getSplitStyles.tsx"],
|
|
4
|
-
"sourcesContent": ["import {\n mergeTransform,\n stylePropsText,\n stylePropsTransform,\n validPseudoKeys,\n validStyles,\n} from '@tamagui/helpers'\n// @ts-ignore\nimport { useInsertionEffect } from 'react'\nimport { ViewStyle } from 'react-native'\n\nimport { getConfig } from '../conf'\nimport { isClient, isWeb, useIsomorphicLayoutEffect } from '../constants/platform'\nimport { mediaQueryConfig, mediaState } from '../hooks/useMedia'\nimport {\n MediaKeys,\n MediaQueryKey,\n PseudoStyles,\n PsuedoPropKeys,\n SplitStyleState,\n StackProps,\n StaticConfigParsed,\n TamaguiInternalConfig,\n ThemeObject,\n} from '../types'\nimport { createMediaStyle } from './createMediaStyle'\nimport { fixNativeShadow } from './fixNativeShadow'\nimport { ViewStyleWithPseudos, getStylesAtomic } from './getStylesAtomic'\nimport {\n insertStyleRule,\n insertedTransforms,\n updateInserted,\n updateInsertedCache,\n} from './insertStyleRule'\n\nexport type SplitStyles = ReturnType<typeof getSplitStyles>\nexport type ClassNamesObject = Record<string, string>\nexport type SplitStyleResult = ReturnType<typeof getSplitStyles>\n\nconst skipProps = {\n animation: true,\n animateOnly: true,\n debug: true,\n}\n\ntype TransformNamespaceKey = 'transform' | PsuedoPropKeys | MediaQueryKey\n\n// TODO can make a few of these objects lazy if profiling seems slow\n\nlet conf: TamaguiInternalConfig\n\ntype StyleSplitter = (\n props: { [key: string]: any },\n staticConfig: StaticConfigParsed,\n theme: ThemeObject,\n state: SplitStyleState & {\n keepVariantsAsProps?: boolean\n },\n defaultClassNames?: any\n) => {\n pseudos: PseudoStyles\n medias: Record<MediaKeys, ViewStyle>\n style: ViewStyle\n classNames: ClassNamesObject\n rulesToInsert: [string, string][]\n viewProps: StackProps\n}\n\nexport const getSplitStyles: StyleSplitter = (\n props,\n staticConfig,\n theme,\n state,\n defaultClassNames\n) => {\n if (process.env.NODE_ENV === 'development' && props['debug'] === 'verbose') {\n console.log(' \u00BB getSplitStyles', { props, state, defaultClassNames })\n }\n\n conf = conf || getConfig()\n const validStyleProps = staticConfig.isText ? stylePropsText : validStyles\n const viewProps: StackProps = {}\n const style: ViewStyle = {}\n const classNames: ClassNamesObject = {\n ...defaultClassNames,\n }\n const pseudos: PseudoStyles = {}\n const medias: Record<MediaKeys, ViewStyle> = {}\n\n const rulesToInsert: [string, string][] = []\n function addStyle(prop: string, rule: string) {\n rulesToInsert.push([prop, rule])\n updateInsertedCache(prop, rule)\n }\n\n let cur: ViewStyleWithPseudos | null = null\n\n // we need to gather these specific to each media query / pseudo\n // value is [hash, val], so [\"-jnjad-asdnjk\", \"scaleX(1) rotate(10deg)\"]\n let transforms: Record<TransformNamespaceKey, [string, string]> = {}\n\n function mergeClassName(key: string, val: string) {\n if (!val) {\n // empty classnames passed by compiler sometimes\n return\n }\n if (val.startsWith('_transform-')) {\n const isMediaOrPseudo = key !== 'transform'\n const isMedia = isMediaOrPseudo && key[11] === '_'\n const isPsuedo = (isMediaOrPseudo && key[11] === '0') || key.endsWith('Style')\n const namespace: TransformNamespaceKey = isMedia\n ? key.split('_')[2]\n : isPsuedo\n ? key.split('-')[1]\n : 'transform'\n\n let transform = insertedTransforms[val]\n if (isClient) {\n if (!transform) {\n // HMR or loaded a new chunk\n updateInserted()\n transform = insertedTransforms[val]\n }\n if (!transform) {\n if (isWeb && val[0] !== '_') {\n // runtime insert\n transform = val\n } else {\n // error\n console.trace('?', key, val, cur, props, state)\n }\n }\n if (process.env.NODE_ENV === 'development' && props['debug'] === 'verbose') {\n // prettier-ignore\n console.log(' \u00BB getSplitStyles mergeClassName transform', { key, val, namespace, transform, insertedTransforms })\n }\n if (process.env.NODE_ENV === 'development') {\n if (!transform) {\n console.trace('NO TRANSFORM?', { key, val, transform })\n }\n }\n }\n transforms[namespace] = transforms[namespace] || ['', '']\n const identifier = val.replace('_transform', '')\n transforms[namespace][0] += identifier\n // ssr doesn't need to do anything just make the right classname\n if (transform) {\n transforms[namespace][1] += transform\n }\n } else {\n classNames[key] = val\n }\n }\n\n function push() {\n if (!cur) return\n normalizeStyleObject(cur)\n\n if (process.env.NODE_ENV === 'development' && props['debug'] === 'verbose') {\n console.log(' \u00BB getSplitStyles push', cur, state)\n }\n\n if (isWeb && !state.noClassNames) {\n const atomic = getStylesAtomic(cur)\n for (const atomicStyle of atomic) {\n if (!state.noClassNames) {\n addStyle(atomicStyle.identifier, atomicStyle.rules[0])\n mergeClassName(atomicStyle.property, atomicStyle.identifier)\n } else {\n style[atomicStyle.property] = atomicStyle.value\n }\n }\n }\n\n if (\n !isWeb ||\n state.noClassNames ||\n state.resolveVariablesAs === 'value' ||\n state.resolveVariablesAs === 'both'\n ) {\n for (const key in cur) {\n if (key in stylePropsTransform) {\n mergeTransform(style, key, cur[key])\n } else {\n style[key] = cur[key]\n }\n }\n }\n\n // reset it for next group of styles\n cur = null\n }\n\n for (const keyInit in props) {\n if (skipProps[keyInit]) {\n continue\n }\n\n const valInit = props[keyInit]\n\n // TODO\n if (keyInit === 'style' || keyInit.startsWith('_style')) {\n push()\n cur = valInit\n push()\n continue\n }\n\n if (keyInit === 'className' || (validStyleProps[keyInit] && valInit && valInit[0] === '_')) {\n push()\n mergeClassName(keyInit, valInit)\n continue\n }\n\n if (\n state.keepVariantsAsProps &&\n staticConfig.defaultVariants &&\n keyInit in staticConfig.defaultVariants\n ) {\n viewProps[keyInit] = valInit\n }\n\n let isMedia = keyInit[0] === '$'\n let isPseudo = validPseudoKeys[keyInit]\n\n if (\n !isMedia &&\n !isPseudo &&\n !staticConfig.variants?.[keyInit] &&\n !validStyleProps[keyInit] &&\n !conf.shorthands[keyInit]\n ) {\n viewProps[keyInit] = valInit\n continue\n }\n\n const out =\n isMedia || isPseudo\n ? true\n : staticConfig.propMapper(\n keyInit,\n valInit,\n theme,\n state.fallbackProps || props,\n state.resolveVariablesAs\n )\n\n const expanded = out === true || !out ? [[keyInit, valInit]] : Object.entries(out)\n\n if (process.env.NODE_ENV === 'development' && props['debug'] === 'verbose') {\n console.log(' \u00BB getSplitStyles', keyInit, expanded)\n }\n\n for (const [key, val] of expanded) {\n if (val === undefined) {\n continue\n }\n\n if (key !== 'target' && val && val[0] === '_') {\n mergeClassName(key, val)\n continue\n }\n\n isMedia = key[0] === '$'\n isPseudo = validPseudoKeys[key]\n\n if (\n (staticConfig.deoptProps && staticConfig.deoptProps.has(key)) ||\n (staticConfig.inlineProps && staticConfig.inlineProps.has(key))\n ) {\n viewProps[key] = val\n }\n\n // pseudo\n if (isPseudo) {\n if (!val) continue\n if (key === 'enterStyle' && state.mounted) {\n // once mounted we can ignore enterStyle\n continue\n }\n pseudos[key] = pseudos[key] || {}\n pseudos[key] = getSubStyle(val, staticConfig, theme, props, state, true)\n if (isWeb && !state.noClassNames) {\n const pseudoStyles = getStylesAtomic({ [key]: pseudos[key] })\n for (const style of pseudoStyles) {\n addStyle(style.identifier, style.rules[0])\n mergeClassName(`${style.property}-${key}`, style.identifier)\n }\n }\n continue\n }\n\n // media\n if (isMedia) {\n const mediaKey = key\n const mediaKeyShort = mediaKey.slice(1)\n\n if (!mediaQueryConfig[mediaKeyShort]) {\n // this isn't a media key, pass through\n viewProps[key] = val\n continue\n }\n\n // dont check if media is active, we just apply *all* media styles\n // we combine the media props on top regular props, could proxy this\n // TODO test proxy here instead of merge\n // THIS USED TO PROXY BACK TO REGULAR PROPS BUT THAT IS THE WRONG BEHAVIOR\n // we avoid passing in default props for media queries because that would confuse things like SizableText.size:\n const mediaStyle = getSubStyle(val, staticConfig, theme, props, state)\n\n if (process.env.NODE_ENV === 'development' && props['debug'] === 'verbose') {\n console.log(' \u00BB getSplitStyles mediaStyle', mediaKey, mediaStyle, props)\n }\n\n const shouldDoClasses = isWeb && !state.noClassNames\n if (shouldDoClasses) {\n const mediaStyles = getStylesAtomic(mediaStyle)\n for (const style of mediaStyles) {\n const out = createMediaStyle(style, mediaKeyShort, mediaQueryConfig)\n addStyle(out.identifier, out.styleRule)\n mergeClassName(`${out.identifier}-${mediaKey}`, out.identifier)\n }\n } else {\n if (mediaState[mediaKey]) {\n push()\n if (process.env.NODE_ENV === 'development' && props['debug']) {\n console.log('apply media style', mediaKey, mediaState)\n }\n Object.assign(shouldDoClasses ? medias : style, mediaStyle)\n }\n }\n continue\n }\n\n if (!isWeb && key === 'pointerEvents') {\n viewProps[key] = val\n continue\n }\n\n if (validStyleProps[key]) {\n cur = cur || {}\n cur[key] = val\n continue\n }\n\n // pass to view props\n if (!staticConfig.variants || !(key in staticConfig.variants)) {\n if (key !== 'animation' && key !== 'debug') {\n push()\n viewProps[key] = val\n }\n }\n }\n }\n\n push()\n\n if (transforms) {\n for (const namespace in transforms) {\n const [hash, val] = transforms[namespace]\n const identifier = `_transform${hash}`\n if (isClient) {\n if (!insertedTransforms[identifier]) {\n const rule = `.${identifier} { transform: ${val}; }`\n addStyle(identifier, rule)\n }\n }\n classNames[namespace] = identifier\n }\n }\n\n if (process.env.NODE_ENV === 'development' && props['debug'] === 'verbose') {\n console.log(' \u00BB getSplitStyles out', { style, pseudos, medias, classNames, viewProps, state })\n }\n\n return {\n viewProps,\n style,\n medias,\n pseudos,\n classNames,\n rulesToInsert,\n }\n}\n\nexport const insertSplitStyles: StyleSplitter = (...args) => {\n const res = getSplitStyles(...args)\n for (const [prop, rule] of res.rulesToInsert) {\n insertStyleRule(prop, rule)\n }\n return res\n}\n\nconst effect = useInsertionEffect || useIsomorphicLayoutEffect\nexport const useSplitStyles: StyleSplitter = (...args) => {\n const res = getSplitStyles(...args)\n effect(() => {\n for (const [prop, rule] of res.rulesToInsert) {\n insertStyleRule(prop, rule)\n }\n })\n return res\n}\n\nexport const getSubStyle = (\n styleIn: Object,\n staticConfig: StaticConfigParsed,\n theme: ThemeObject,\n props: any,\n state: SplitStyleState,\n avoidDefaultProps?: boolean\n): ViewStyle => {\n const styleOut: ViewStyle = {}\n for (const key in styleIn) {\n const val = styleIn[key]\n const out = staticConfig.propMapper(\n key,\n val,\n theme,\n state.fallbackProps || props,\n state.resolveVariablesAs,\n avoidDefaultProps\n )\n const expanded = out === true || !out ? [[key, val]] : Object.entries(out)\n for (const [skey, sval] of expanded) {\n if (skey in stylePropsTransform) {\n mergeTransform(styleOut, skey, sval)\n } else {\n styleOut[skey] = sval\n }\n }\n }\n normalizeStyleObject(styleOut)\n return styleOut\n}\n\nexport function normalizeStyleObject(style: any) {\n if (!isWeb) {\n fixNativeShadow(style)\n }\n}\n"],
|
|
5
|
-
"mappings": ";;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AAGA;AACA;AACA;AAYA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWA,MAAM,YAAY;AAAA,EAChB,WAAW;AAAA,EACX,aAAa;AAAA,EACb,OAAO;
|
|
4
|
+
"sourcesContent": ["import {\n mergeTransform,\n stylePropsText,\n stylePropsTransform,\n validPseudoKeys,\n validStyles,\n} from '@tamagui/helpers'\n// @ts-ignore\nimport { useInsertionEffect } from 'react'\nimport { ViewStyle } from 'react-native'\n\nimport { getConfig } from '../conf'\nimport { isClient, isWeb, useIsomorphicLayoutEffect } from '../constants/platform'\nimport { mediaQueryConfig, mediaState } from '../hooks/useMedia'\nimport {\n MediaKeys,\n MediaQueryKey,\n PseudoStyles,\n PsuedoPropKeys,\n SplitStyleState,\n StackProps,\n StaticConfigParsed,\n TamaguiInternalConfig,\n ThemeObject,\n} from '../types'\nimport { createMediaStyle } from './createMediaStyle'\nimport { fixNativeShadow } from './fixNativeShadow'\nimport { ViewStyleWithPseudos, getStylesAtomic } from './getStylesAtomic'\nimport {\n insertStyleRule,\n insertedTransforms,\n updateInserted,\n updateInsertedCache,\n} from './insertStyleRule'\n\nexport type SplitStyles = ReturnType<typeof getSplitStyles>\nexport type ClassNamesObject = Record<string, string>\nexport type SplitStyleResult = ReturnType<typeof getSplitStyles>\n\nconst skipProps = {\n animation: true,\n animateOnly: true,\n debug: true,\n\n ...(!isWeb && {\n tag: true,\n whiteSpace: true,\n wordWrap: true,\n textOverflow: true,\n textDecorationDistance: true,\n userSelect: true,\n selectable: true,\n cursor: true,\n contain: true,\n pointerEvents: true,\n boxSizing: true,\n boxShadow: true,\n }),\n}\n\ntype TransformNamespaceKey = 'transform' | PsuedoPropKeys | MediaQueryKey\n\n// TODO can make a few of these objects lazy if profiling seems slow\n\nlet conf: TamaguiInternalConfig\n\ntype StyleSplitter = (\n props: { [key: string]: any },\n staticConfig: StaticConfigParsed,\n theme: ThemeObject,\n state: SplitStyleState & {\n keepVariantsAsProps?: boolean\n },\n defaultClassNames?: any\n) => {\n pseudos: PseudoStyles\n medias: Record<MediaKeys, ViewStyle>\n style: ViewStyle\n classNames: ClassNamesObject\n rulesToInsert: [string, string][]\n viewProps: StackProps\n}\n\nexport const getSplitStyles: StyleSplitter = (\n props,\n staticConfig,\n theme,\n state,\n defaultClassNames\n) => {\n if (process.env.NODE_ENV === 'development' && props['debug'] === 'verbose') {\n console.log(' \u00BB getSplitStyles', { props, state, defaultClassNames })\n }\n\n conf = conf || getConfig()\n const validStyleProps = staticConfig.isText ? stylePropsText : validStyles\n const viewProps: StackProps = {}\n const style: ViewStyle = {}\n const classNames: ClassNamesObject = {\n ...defaultClassNames,\n }\n const pseudos: PseudoStyles = {}\n const medias: Record<MediaKeys, ViewStyle> = {}\n\n const rulesToInsert: [string, string][] = []\n function addStyle(prop: string, rule: string) {\n rulesToInsert.push([prop, rule])\n updateInsertedCache(prop, rule)\n }\n\n let cur: ViewStyleWithPseudos | null = null\n\n // we need to gather these specific to each media query / pseudo\n // value is [hash, val], so [\"-jnjad-asdnjk\", \"scaleX(1) rotate(10deg)\"]\n let transforms: Record<TransformNamespaceKey, [string, string]> = {}\n\n function mergeClassName(key: string, val: string) {\n if (!val) {\n // empty classnames passed by compiler sometimes\n return\n }\n if (val.startsWith('_transform-')) {\n const isMediaOrPseudo = key !== 'transform'\n const isMedia = isMediaOrPseudo && key[11] === '_'\n const isPsuedo = (isMediaOrPseudo && key[11] === '0') || key.endsWith('Style')\n const namespace: TransformNamespaceKey = isMedia\n ? key.split('_')[2]\n : isPsuedo\n ? key.split('-')[1]\n : 'transform'\n\n let transform = insertedTransforms[val]\n if (isClient) {\n if (!transform) {\n // HMR or loaded a new chunk\n updateInserted()\n transform = insertedTransforms[val]\n }\n if (!transform) {\n if (isWeb && val[0] !== '_') {\n // runtime insert\n transform = val\n } else {\n // error\n console.trace('?', key, val, cur, props, state)\n }\n }\n if (process.env.NODE_ENV === 'development' && props['debug'] === 'verbose') {\n // prettier-ignore\n console.log(' \u00BB getSplitStyles mergeClassName transform', { key, val, namespace, transform, insertedTransforms })\n }\n if (process.env.NODE_ENV === 'development') {\n if (!transform) {\n console.trace('NO TRANSFORM?', { key, val, transform })\n }\n }\n }\n transforms[namespace] = transforms[namespace] || ['', '']\n const identifier = val.replace('_transform', '')\n transforms[namespace][0] += identifier\n // ssr doesn't need to do anything just make the right classname\n if (transform) {\n transforms[namespace][1] += transform\n }\n } else {\n classNames[key] = val\n }\n }\n\n function push() {\n if (!cur) return\n normalizeStyleObject(cur)\n\n if (process.env.NODE_ENV === 'development' && props['debug'] === 'verbose') {\n console.log(' \u00BB getSplitStyles push', cur, state)\n }\n\n if (isWeb && !state.noClassNames) {\n const atomic = getStylesAtomic(cur)\n for (const atomicStyle of atomic) {\n if (!state.noClassNames) {\n addStyle(atomicStyle.identifier, atomicStyle.rules[0])\n mergeClassName(atomicStyle.property, atomicStyle.identifier)\n } else {\n style[atomicStyle.property] = atomicStyle.value\n }\n }\n }\n\n if (\n !isWeb ||\n state.noClassNames ||\n state.resolveVariablesAs === 'value' ||\n state.resolveVariablesAs === 'both'\n ) {\n for (const key in cur) {\n if (skipProps[key]) {\n continue\n }\n if (key in stylePropsTransform) {\n mergeTransform(style, key, cur[key])\n } else {\n style[key] = cur[key]\n }\n }\n }\n\n // reset it for next group of styles\n cur = null\n }\n\n for (const keyInit in props) {\n if (skipProps[keyInit]) {\n continue\n }\n if (!isWeb && keyInit.startsWith('data-')) {\n continue\n }\n\n const valInit = props[keyInit]\n\n // TODO\n if (keyInit === 'style' || keyInit.startsWith('_style')) {\n push()\n cur = valInit\n push()\n continue\n }\n\n if (keyInit === 'className' || (validStyleProps[keyInit] && valInit && valInit[0] === '_')) {\n push()\n mergeClassName(keyInit, valInit)\n continue\n }\n\n if (\n state.keepVariantsAsProps &&\n staticConfig.defaultVariants &&\n keyInit in staticConfig.defaultVariants\n ) {\n viewProps[keyInit] = valInit\n }\n\n let isMedia = keyInit[0] === '$'\n let isPseudo = validPseudoKeys[keyInit]\n\n if (\n !isMedia &&\n !isPseudo &&\n !staticConfig.variants?.[keyInit] &&\n !validStyleProps[keyInit] &&\n !conf.shorthands[keyInit]\n ) {\n viewProps[keyInit] = valInit\n continue\n }\n\n const out =\n isMedia || isPseudo\n ? true\n : staticConfig.propMapper(\n keyInit,\n valInit,\n theme,\n state.fallbackProps || props,\n state.resolveVariablesAs\n )\n\n const expanded = out === true || !out ? [[keyInit, valInit]] : Object.entries(out)\n\n if (process.env.NODE_ENV === 'development' && props['debug'] === 'verbose') {\n console.log(' \u00BB getSplitStyles', keyInit, expanded)\n }\n\n for (const [key, val] of expanded) {\n if (val === undefined) {\n continue\n }\n\n if (key !== 'target' && val && val[0] === '_') {\n mergeClassName(key, val)\n continue\n }\n\n isMedia = key[0] === '$'\n isPseudo = validPseudoKeys[key]\n\n if (\n (staticConfig.deoptProps && staticConfig.deoptProps.has(key)) ||\n (staticConfig.inlineProps && staticConfig.inlineProps.has(key))\n ) {\n viewProps[key] = val\n }\n\n // pseudo\n if (isPseudo) {\n if (!val) continue\n if (key === 'enterStyle' && state.mounted) {\n // once mounted we can ignore enterStyle\n continue\n }\n pseudos[key] = pseudos[key] || {}\n pseudos[key] = getSubStyle(val, staticConfig, theme, props, state, true)\n if (isWeb && !state.noClassNames) {\n const pseudoStyles = getStylesAtomic({ [key]: pseudos[key] })\n for (const style of pseudoStyles) {\n addStyle(style.identifier, style.rules[0])\n mergeClassName(`${style.property}-${key}`, style.identifier)\n }\n }\n continue\n }\n\n // media\n if (isMedia) {\n const mediaKey = key\n const mediaKeyShort = mediaKey.slice(1)\n\n if (!mediaQueryConfig[mediaKeyShort]) {\n // this isn't a media key, pass through\n viewProps[key] = val\n continue\n }\n\n // dont check if media is active, we just apply *all* media styles\n // we combine the media props on top regular props, could proxy this\n // TODO test proxy here instead of merge\n // THIS USED TO PROXY BACK TO REGULAR PROPS BUT THAT IS THE WRONG BEHAVIOR\n // we avoid passing in default props for media queries because that would confuse things like SizableText.size:\n const mediaStyle = getSubStyle(val, staticConfig, theme, props, state)\n\n if (process.env.NODE_ENV === 'development' && props['debug'] === 'verbose') {\n console.log(' \u00BB getSplitStyles mediaStyle', mediaKey, mediaStyle, props)\n }\n\n const shouldDoClasses = isWeb && !state.noClassNames\n if (shouldDoClasses) {\n const mediaStyles = getStylesAtomic(mediaStyle)\n for (const style of mediaStyles) {\n const out = createMediaStyle(style, mediaKeyShort, mediaQueryConfig)\n addStyle(out.identifier, out.styleRule)\n mergeClassName(`${out.identifier}-${mediaKey}`, out.identifier)\n }\n } else {\n if (mediaState[mediaKey]) {\n push()\n if (process.env.NODE_ENV === 'development' && props['debug']) {\n console.log('apply media style', mediaKey, mediaState)\n }\n Object.assign(shouldDoClasses ? medias : style, mediaStyle)\n }\n }\n continue\n }\n\n if (!isWeb && key === 'pointerEvents') {\n viewProps[key] = val\n continue\n }\n\n if (validStyleProps[key]) {\n cur = cur || {}\n cur[key] = val\n continue\n }\n\n // pass to view props\n if (!staticConfig.variants || !(key in staticConfig.variants)) {\n if (!skipProps[key]) {\n push()\n viewProps[key] = val\n }\n }\n }\n }\n\n push()\n\n if (transforms) {\n for (const namespace in transforms) {\n const [hash, val] = transforms[namespace]\n const identifier = `_transform${hash}`\n if (isClient) {\n if (!insertedTransforms[identifier]) {\n const rule = `.${identifier} { transform: ${val}; }`\n addStyle(identifier, rule)\n }\n }\n classNames[namespace] = identifier\n }\n }\n\n if (process.env.NODE_ENV === 'development' && props['debug'] === 'verbose') {\n console.log(' \u00BB getSplitStyles out', { style, pseudos, medias, classNames, viewProps, state })\n }\n\n return {\n viewProps,\n style,\n medias,\n pseudos,\n classNames,\n rulesToInsert,\n }\n}\n\nexport const insertSplitStyles: StyleSplitter = (...args) => {\n const res = getSplitStyles(...args)\n for (const [prop, rule] of res.rulesToInsert) {\n insertStyleRule(prop, rule)\n }\n return res\n}\n\nconst effect = useInsertionEffect || useIsomorphicLayoutEffect\nexport const useSplitStyles: StyleSplitter = (...args) => {\n const res = getSplitStyles(...args)\n effect(() => {\n for (const [prop, rule] of res.rulesToInsert) {\n insertStyleRule(prop, rule)\n }\n })\n return res\n}\n\nexport const getSubStyle = (\n styleIn: Object,\n staticConfig: StaticConfigParsed,\n theme: ThemeObject,\n props: any,\n state: SplitStyleState,\n avoidDefaultProps?: boolean\n): ViewStyle => {\n const styleOut: ViewStyle = {}\n for (const key in styleIn) {\n const val = styleIn[key]\n const out = staticConfig.propMapper(\n key,\n val,\n theme,\n state.fallbackProps || props,\n state.resolveVariablesAs,\n avoidDefaultProps\n )\n const expanded = out === true || !out ? [[key, val]] : Object.entries(out)\n for (const [skey, sval] of expanded) {\n if (skey in stylePropsTransform) {\n mergeTransform(styleOut, skey, sval)\n } else {\n styleOut[skey] = sval\n }\n }\n }\n normalizeStyleObject(styleOut)\n return styleOut\n}\n\nexport function normalizeStyleObject(style: any) {\n if (!isWeb) {\n fixNativeShadow(style)\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
3
|
+
const BaseButton = /* @__PURE__ */ __name((props) => props.children, "BaseButton");
|
|
4
|
+
export {
|
|
5
|
+
BaseButton
|
|
6
|
+
};
|
|
7
|
+
//# sourceMappingURL=nativeGestureHandler.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
//# sourceMappingURL=usePrevious.js.map
|
package/dist/esm/styled.js
CHANGED
package/dist/esm/styled.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/styled.tsx"],
|
|
4
|
-
"sourcesContent": ["import { Image, Text, TextInput } from 'react-native'\n\nimport { createComponent } from './createComponent'\nimport { RNComponents } from './helpers/RNComponents'\nimport {\n GetProps,\n GetVariantValues,\n MediaProps,\n PseudoProps,\n StaticConfig,\n StylableComponent,\n TamaguiComponent,\n VariantDefinitions,\n VariantSpreadFunction,\n} from './types'\n\n// TODO may be able to use this in the options?: arg below directly\nexport type StyledOptions<ParentComponent extends StylableComponent> = GetProps<ParentComponent> & {\n name?: string\n variants?: VariantDefinitions<ParentComponent> | undefined\n defaultVariants?: { [key: string]: any }\n}\n\nexport function styled<\n ParentComponent extends StylableComponent,\n Variants extends VariantDefinitions<ParentComponent> | symbol =\n | VariantDefinitions<ParentComponent>\n | symbol\n>(\n Component: ParentComponent,\n // this should be Partial<GetProps<ParentComponent>> but causes excessively deep type issues\n options?: GetProps<ParentComponent> & {\n name?: string\n variants?: Variants | undefined\n // thought i had this typed, but can't get it linked\n defaultVariants?: { [key: string]: any }\n },\n staticExtractionOptions?: Partial<StaticConfig>\n) {\n const staticConfigProps = (() => {\n if (options) {\n const { variants, name, defaultVariants, ...defaultProps } = options\n if (defaultVariants) {\n Object.assign(defaultProps, defaultVariants)\n }\n const isReactNativeWeb =\n 'staticConfig' in Component\n ? Component.staticConfig.isReactNativeWeb\n : RNComponents.has(Component)\n const reactNativeWebComponent = isReactNativeWeb\n ? Component['staticConfig']?.reactNativeWebComponent || Component\n : null\n const isTamagui = !isReactNativeWeb && 'staticConfig' in Component\n const Comp = reactNativeWebComponent || (Component as any)\n const isImage = !!(defaultProps.isImage || (!isTamagui ? Comp === Image : false))\n const isInput = !!(defaultProps.isInput || (!isTamagui ? Comp === TextInput : false))\n const isText = !!(defaultProps.isText || (!isTamagui ? isInput || Comp === Text : false))\n const conf: Partial<StaticConfig> = {\n ...staticExtractionOptions,\n ...(!isTamagui && {\n Component: Comp,\n }),\n isTamagui,\n // this type gets messed up by options?: Partial<GetProps<ParentComponent>> above\n // take away the Partial<> and it's fine\n variants,\n defaultProps,\n defaultVariants,\n componentName: name,\n isReactNativeWeb,\n // for nesting multiple levels of rnw styled() need keep use the OG component\n reactNativeWebComponent,\n isInput,\n isText,\n isImage,\n }\n\n
|
|
5
|
-
"mappings": ";;AAAA;AAEA;AACA;AAoBO,gBAML,WAEA,SAMA,yBACA;AACA,QAAM,oBAAqB,OAAM;AAvCnC;AAwCI,QAAI,SAAS;AACX,YAAM,EAAE,UAAU,MAAM,oBAAoB,iBAAiB;AAC7D,UAAI,iBAAiB;AACnB,eAAO,OAAO,cAAc,eAAe;AAAA,MAC7C;AACA,YAAM,mBACJ,kBAAkB,YACd,UAAU,aAAa,mBACvB,aAAa,IAAI,SAAS;AAChC,YAAM,0BAA0B,mBAC5B,iBAAU,oBAAV,mBAA2B,4BAA2B,YACtD;AACJ,YAAM,YAAY,CAAC,oBAAoB,kBAAkB;AACzD,YAAM,OAAO,2BAA4B;AACzC,YAAM,UAAU,CAAC,CAAE,cAAa,WAAY,EAAC,YAAY,SAAS,QAAQ;AAC1E,YAAM,UAAU,CAAC,CAAE,cAAa,WAAY,EAAC,YAAY,SAAS,YAAY;AAC9E,YAAM,SAAS,CAAC,CAAE,cAAa,UAAW,EAAC,YAAY,WAAW,SAAS,OAAO;AAClF,YAAM,OAA8B;AAAA,WAC/B;AAAA,WACC,CAAC,aAAa;AAAA,UAChB,WAAW;AAAA,QACb;AAAA,QACA;AAAA,QAGA;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAe;AAAA,QACf;AAAA,QAEA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAEA,
|
|
4
|
+
"sourcesContent": ["import { Image, Text, TextInput } from 'react-native'\n\nimport { createComponent } from './createComponent'\nimport { RNComponents } from './helpers/RNComponents'\nimport {\n GetProps,\n GetVariantValues,\n MediaProps,\n PseudoProps,\n StaticConfig,\n StylableComponent,\n TamaguiComponent,\n VariantDefinitions,\n VariantSpreadFunction,\n} from './types'\n\n// TODO may be able to use this in the options?: arg below directly\nexport type StyledOptions<ParentComponent extends StylableComponent> = GetProps<ParentComponent> & {\n name?: string\n variants?: VariantDefinitions<ParentComponent> | undefined\n defaultVariants?: { [key: string]: any }\n}\n\nexport function styled<\n ParentComponent extends StylableComponent,\n Variants extends VariantDefinitions<ParentComponent> | symbol =\n | VariantDefinitions<ParentComponent>\n | symbol\n>(\n Component: ParentComponent,\n // this should be Partial<GetProps<ParentComponent>> but causes excessively deep type issues\n options?: GetProps<ParentComponent> & {\n name?: string\n variants?: Variants | undefined\n // thought i had this typed, but can't get it linked\n defaultVariants?: { [key: string]: any }\n },\n staticExtractionOptions?: Partial<StaticConfig>\n) {\n const staticConfigProps = (() => {\n if (options) {\n const { variants, name, defaultVariants, ...defaultProps } = options\n if (defaultVariants) {\n Object.assign(defaultProps, defaultVariants)\n }\n const isReactNativeWeb =\n 'staticConfig' in Component\n ? Component.staticConfig.isReactNativeWeb\n : RNComponents.has(Component)\n const reactNativeWebComponent = isReactNativeWeb\n ? Component['staticConfig']?.reactNativeWebComponent || Component\n : null\n const isTamagui = !isReactNativeWeb && 'staticConfig' in Component\n const Comp = reactNativeWebComponent || (Component as any)\n const isImage = !!(defaultProps.isImage || (!isTamagui ? Comp === Image : false))\n const isInput = !!(defaultProps.isInput || (!isTamagui ? Comp === TextInput : false))\n const isText = !!(defaultProps.isText || (!isTamagui ? isInput || Comp === Text : false))\n const conf: Partial<StaticConfig> = {\n ...staticExtractionOptions,\n ...(!isTamagui && {\n Component: Comp,\n }),\n isTamagui,\n // this type gets messed up by options?: Partial<GetProps<ParentComponent>> above\n // take away the Partial<> and it's fine\n variants,\n defaultProps,\n defaultVariants,\n componentName: name,\n isReactNativeWeb,\n // for nesting multiple levels of rnw styled() need keep use the OG component\n reactNativeWebComponent,\n isInput,\n isText,\n isImage,\n }\n\n return conf\n }\n return {}\n })()\n\n const component = createComponent(staticConfigProps, Component)\n\n // get parent props without pseudos and medias so we can rebuild both with new variants\n type ParentPropsBase = ParentComponent extends TamaguiComponent<any, any, infer P>\n ? P\n : GetProps<ParentComponent>\n type ParentVariants = ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}\n\n type OurVariants = Variants extends symbol\n ? {}\n : {\n [Key in keyof Variants]?: Variants[Key] extends VariantSpreadFunction<any, infer Val>\n ? Val\n : GetVariantValues<keyof Variants[Key]>\n }\n\n type VariantProps = Omit<ParentVariants, keyof OurVariants> & OurVariants\n type OurPropsBase = ParentPropsBase & VariantProps\n\n type Props = Variants extends void | symbol\n ? GetProps<ParentComponent>\n : // start with base props\n OurPropsBase &\n // add in media (+ pseudos nested)\n MediaProps<Partial<OurPropsBase>> &\n // add in pseudos\n PseudoProps<Partial<OurPropsBase>>\n\n return component as TamaguiComponent<\n Props,\n // TODO infer ref\n any,\n ParentPropsBase,\n ParentVariants & OurVariants\n >\n}\n\n// test types:\n// // variants\n// export const XStack = styled(Stack, {\n// flexDirection: 'row',\n// name: 'XStack',\n// variants: {\n// fullscreen: {\n// true: {},\n// },\n// elevation: {\n// '...size': (val) => ({}),\n// },\n// },\n// })\n// const InBetween = styled(XStack, {})\n// type INBVariants = typeof InBetween extends TamaguiComponent<any, any, any, infer Variants> ? Variants: never\n// const SwitchFrame = styled(InBetween, {\n// name: 'Switch',\n// tag: 'button',\n// borderRadius: 100,\n// borderWidth: 0,\n// variants: {\n// name: {\n// true: {\n// backgroundColor: 'aliceblue'\n// },\n// // 1: {\n\n// // },\n// // ':number': (val) => {\n// // return {}\n// // },\n// // \"...fontSize\": (val) => {\n// // return {}\n// // },\n// // \"...color\": (val) => {\n// // return {}\n// // }\n// }\n// },\n// defaultVariants: {\n// size: '$4',\n// },\n// })\n// const x = <XStack fullscreen />\n// const y = <XStack fullscreen />\n// const z = <SwitchFrame fullscreen name />\n\n// depth:\n// export const SizableText = styled(Stack, {\n// name: 'SizableText',\n// backgroundColor: 'red',\n// variants: {\n// size: {\n// '...fontSize': (val, { props }) => {\n// return {\n// backgroundColor: '',\n// }\n// },\n// },\n// },\n// })\n// export const Heading = styled(SizableText, {\n// tag: 'span',\n// name: 'Heading',\n// accessibilityRole: 'header',\n// size: '$8',\n// margin: 0,\n// })\n// export const Paragraph = styled(SizableText, {\n// tag: 'p',\n// margin: 10,\n// variants: {\n// another: {\n// true: {},\n// },\n// },\n// })\n// export const Paragraph2 = styled(Paragraph, {\n// tag: 'p',\n// variants: {\n// another: {\n// '...color': (val) => ({\n// backgroundColor: 'red',\n// }),\n// },\n// },\n// })\n// const a = <SizableText size=\"$10\" />\n// const b = <Paragraph size=\"$10\" another />\n// const c = <Paragraph2 size=\"$10\" another=\"aliceblue\" />\n// export const SizableText2 = styled(SizableText, {\n// })\n// const xx = <SizableText2 abc />\n// export const Paragraph = styled(SizableText, {\n// name: 'Paragraph',\n// })\n// export const Heading = styled(Paragraph, {\n// tag: 'span',\n// margin: 0,\n// })\n// export const H2 = styled(Heading, {\n// name: 'H2',\n// })\n// const x = <H2 color=\"red\" />\n"],
|
|
5
|
+
"mappings": ";;AAAA;AAEA;AACA;AAoBO,gBAML,WAEA,SAMA,yBACA;AACA,QAAM,oBAAqB,OAAM;AAvCnC;AAwCI,QAAI,SAAS;AACX,YAAM,EAAE,UAAU,MAAM,oBAAoB,iBAAiB;AAC7D,UAAI,iBAAiB;AACnB,eAAO,OAAO,cAAc,eAAe;AAAA,MAC7C;AACA,YAAM,mBACJ,kBAAkB,YACd,UAAU,aAAa,mBACvB,aAAa,IAAI,SAAS;AAChC,YAAM,0BAA0B,mBAC5B,iBAAU,oBAAV,mBAA2B,4BAA2B,YACtD;AACJ,YAAM,YAAY,CAAC,oBAAoB,kBAAkB;AACzD,YAAM,OAAO,2BAA4B;AACzC,YAAM,UAAU,CAAC,CAAE,cAAa,WAAY,EAAC,YAAY,SAAS,QAAQ;AAC1E,YAAM,UAAU,CAAC,CAAE,cAAa,WAAY,EAAC,YAAY,SAAS,YAAY;AAC9E,YAAM,SAAS,CAAC,CAAE,cAAa,UAAW,EAAC,YAAY,WAAW,SAAS,OAAO;AAClF,YAAM,OAA8B;AAAA,WAC/B;AAAA,WACC,CAAC,aAAa;AAAA,UAChB,WAAW;AAAA,QACb;AAAA,QACA;AAAA,QAGA;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAe;AAAA,QACf;AAAA,QAEA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAEA,aAAO;AAAA,IACT;AACA,WAAO,CAAC;AAAA,EACV,GAAG;AAEH,QAAM,YAAY,gBAAgB,mBAAmB,SAAS;AA4B9D,SAAO;AAOT;AA9FgB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/views/Slot.js
CHANGED
|
@@ -22,7 +22,7 @@ const SlotClone = React.forwardRef((props, forwardedRef) => {
|
|
|
22
22
|
const { children, ...slotProps } = props;
|
|
23
23
|
if (React.isValidElement(children)) {
|
|
24
24
|
return React.cloneElement(children, {
|
|
25
|
-
...mergeProps(
|
|
25
|
+
...mergeProps(children, slotProps),
|
|
26
26
|
ref: composeRefs(forwardedRef, children.ref)
|
|
27
27
|
});
|
|
28
28
|
}
|
|
@@ -36,11 +36,30 @@ function isSlottable(child) {
|
|
|
36
36
|
return React.isValidElement(child);
|
|
37
37
|
}
|
|
38
38
|
__name(isSlottable, "isSlottable");
|
|
39
|
-
|
|
39
|
+
const pressMap = {
|
|
40
|
+
onPress: "onClick",
|
|
41
|
+
onPressOut: "onMouseOut",
|
|
42
|
+
onPressIn: "onMouseIn"
|
|
43
|
+
};
|
|
44
|
+
function mergeProps(child, slotProps) {
|
|
45
|
+
const childProps = child.props;
|
|
40
46
|
const overrideProps = { ...childProps };
|
|
41
|
-
|
|
47
|
+
const isHTMLChild = typeof child.type === "string";
|
|
48
|
+
if (isHTMLChild) {
|
|
49
|
+
for (const key in pressMap) {
|
|
50
|
+
if (key in slotProps) {
|
|
51
|
+
slotProps[pressMap[key]] = slotProps[key];
|
|
52
|
+
delete slotProps[key];
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
for (let propName in childProps) {
|
|
42
57
|
const slotPropValue = slotProps[propName];
|
|
43
58
|
const childPropValue = childProps[propName];
|
|
59
|
+
if (isHTMLChild && pressMap[propName]) {
|
|
60
|
+
propName = pressMap[propName];
|
|
61
|
+
delete overrideProps[propName];
|
|
62
|
+
}
|
|
44
63
|
const isHandler = /^on[A-Z]/.test(propName);
|
|
45
64
|
if (isHandler) {
|
|
46
65
|
overrideProps[propName] = (...args) => {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/views/Slot.tsx"],
|
|
4
|
-
"sourcesContent": ["// via radix\n\nimport { composeRefs } from '@tamagui/compose-refs'\nimport * as React from 'react'\n\n/* -------------------------------------------------------------------------------------------------\n * Slot\n * -----------------------------------------------------------------------------------------------*/\n\nexport type SlotProps = {\n children?: React.ReactNode\n}\n\nexport const Slot = React.forwardRef<HTMLElement, SlotProps>((props, forwardedRef) => {\n const { children, ...slotProps } = props\n\n if (React.Children.toArray(children).some(isSlottable)) {\n return (\n <>\n {React.Children.map(children, (child) => {\n return isSlottable(child) ? (\n <SlotClone {...slotProps} ref={forwardedRef}>\n {child.props.children}\n </SlotClone>\n ) : (\n child\n )\n })}\n </>\n )\n }\n\n return (\n <SlotClone {...slotProps} ref={forwardedRef}>\n {children}\n </SlotClone>\n )\n})\n\nSlot.displayName = 'Slot'\n\n/* -------------------------------------------------------------------------------------------------\n * SlotClone\n * -----------------------------------------------------------------------------------------------*/\n\ninterface SlotCloneProps {\n children: React.ReactNode\n}\n\nconst SlotClone = React.forwardRef<any, SlotCloneProps>((props, forwardedRef) => {\n const { children, ...slotProps } = props\n\n if (React.isValidElement(children)) {\n return React.cloneElement(children, {\n ...mergeProps(
|
|
5
|
-
"mappings": ";;AAEA;AACA;AAUO,MAAM,OAAO,MAAM,WAAmC,CAAC,OAAO,iBAAiB;AACpF,QAAM,EAAE,aAAa,cAAc;AAEnC,MAAI,MAAM,SAAS,QAAQ,QAAQ,EAAE,KAAK,WAAW,GAAG;AACtD,WACE,0DACG,MAAM,SAAS,IAAI,UAAU,CAAC,UAAU;AACvC,aAAO,YAAY,KAAK,IACtB,oCAAC;AAAA,WAAc;AAAA,QAAW,KAAK;AAAA,SAC5B,MAAM,MAAM,QACf,IAEA;AAAA,IAEJ,CAAC,CACH;AAAA,EAEJ;AAEA,SACE,oCAAC;AAAA,OAAc;AAAA,IAAW,KAAK;AAAA,KAC5B,QACH;AAEJ,CAAC;AAED,KAAK,cAAc;AAUnB,MAAM,YAAY,MAAM,WAAgC,CAAC,OAAO,iBAAiB;AAC/E,QAAM,EAAE,aAAa,cAAc;AAEnC,MAAI,MAAM,eAAe,QAAQ,GAAG;AAClC,WAAO,MAAM,aAAa,UAAU;AAAA,SAC/B,WAAW,
|
|
4
|
+
"sourcesContent": ["// via radix\n\nimport { composeRefs } from '@tamagui/compose-refs'\nimport * as React from 'react'\n\n/* -------------------------------------------------------------------------------------------------\n * Slot\n * -----------------------------------------------------------------------------------------------*/\n\nexport type SlotProps = {\n children?: React.ReactNode\n}\n\nexport const Slot = React.forwardRef<HTMLElement, SlotProps>((props, forwardedRef) => {\n const { children, ...slotProps } = props\n\n if (React.Children.toArray(children).some(isSlottable)) {\n return (\n <>\n {React.Children.map(children, (child) => {\n return isSlottable(child) ? (\n <SlotClone {...slotProps} ref={forwardedRef}>\n {child.props.children}\n </SlotClone>\n ) : (\n child\n )\n })}\n </>\n )\n }\n\n return (\n <SlotClone {...slotProps} ref={forwardedRef}>\n {children}\n </SlotClone>\n )\n})\n\nSlot.displayName = 'Slot'\n\n/* -------------------------------------------------------------------------------------------------\n * SlotClone\n * -----------------------------------------------------------------------------------------------*/\n\ninterface SlotCloneProps {\n children: React.ReactNode\n}\n\nconst SlotClone = React.forwardRef<any, SlotCloneProps>((props, forwardedRef) => {\n const { children, ...slotProps } = props\n\n if (React.isValidElement(children)) {\n return React.cloneElement(children, {\n ...mergeProps(children, slotProps),\n ref: composeRefs(forwardedRef, (children as any).ref),\n })\n }\n\n return React.Children.count(children) > 1 ? React.Children.only(null) : null\n})\n\nSlotClone.displayName = 'SlotClone'\n\n/* -------------------------------------------------------------------------------------------------\n * Slottable\n * -----------------------------------------------------------------------------------------------*/\n\nexport const Slottable = ({ children }: { children: React.ReactNode }) => {\n return <>{children}</>\n}\n\n/* ---------------------------------------------------------------------------------------------- */\n\ntype AnyProps = Record<string, any>\n\nfunction isSlottable(child: React.ReactNode): child is React.ReactElement {\n return React.isValidElement(child)\n}\n\nconst pressMap = {\n onPress: 'onClick',\n onPressOut: 'onMouseOut',\n onPressIn: 'onMouseIn',\n}\n\nfunction mergeProps(child: any, slotProps: AnyProps) {\n const childProps = child.props\n\n // all child props should override\n const overrideProps = { ...childProps }\n\n const isHTMLChild = typeof child.type === 'string'\n\n if (isHTMLChild) {\n for (const key in pressMap) {\n if (key in slotProps) {\n slotProps[pressMap[key]] = slotProps[key]\n delete slotProps[key]\n }\n }\n }\n\n for (let propName in childProps) {\n const slotPropValue = slotProps[propName]\n const childPropValue = childProps[propName]\n\n if (isHTMLChild && pressMap[propName]) {\n propName = pressMap[propName]\n delete overrideProps[propName]\n }\n\n const isHandler = /^on[A-Z]/.test(propName)\n // if it's a handler, modify the override by composing the base handler\n if (isHandler) {\n overrideProps[propName] = (...args: unknown[]) => {\n childPropValue?.(...args)\n slotPropValue?.(...args)\n }\n }\n // if it's `style`, we merge them\n else if (propName === 'style') {\n overrideProps[propName] = { ...slotPropValue, ...childPropValue }\n } else if (propName === 'className') {\n overrideProps[propName] = [slotPropValue, childPropValue].filter(Boolean).join(' ')\n }\n }\n\n return { ...slotProps, ...overrideProps }\n}\n"],
|
|
5
|
+
"mappings": ";;AAEA;AACA;AAUO,MAAM,OAAO,MAAM,WAAmC,CAAC,OAAO,iBAAiB;AACpF,QAAM,EAAE,aAAa,cAAc;AAEnC,MAAI,MAAM,SAAS,QAAQ,QAAQ,EAAE,KAAK,WAAW,GAAG;AACtD,WACE,0DACG,MAAM,SAAS,IAAI,UAAU,CAAC,UAAU;AACvC,aAAO,YAAY,KAAK,IACtB,oCAAC;AAAA,WAAc;AAAA,QAAW,KAAK;AAAA,SAC5B,MAAM,MAAM,QACf,IAEA;AAAA,IAEJ,CAAC,CACH;AAAA,EAEJ;AAEA,SACE,oCAAC;AAAA,OAAc;AAAA,IAAW,KAAK;AAAA,KAC5B,QACH;AAEJ,CAAC;AAED,KAAK,cAAc;AAUnB,MAAM,YAAY,MAAM,WAAgC,CAAC,OAAO,iBAAiB;AAC/E,QAAM,EAAE,aAAa,cAAc;AAEnC,MAAI,MAAM,eAAe,QAAQ,GAAG;AAClC,WAAO,MAAM,aAAa,UAAU;AAAA,SAC/B,WAAW,UAAU,SAAS;AAAA,MACjC,KAAK,YAAY,cAAe,SAAiB,GAAG;AAAA,IACtD,CAAC;AAAA,EACH;AAEA,SAAO,MAAM,SAAS,MAAM,QAAQ,IAAI,IAAI,MAAM,SAAS,KAAK,IAAI,IAAI;AAC1E,CAAC;AAED,UAAU,cAAc;AAMjB,MAAM,YAAY,wBAAC,EAAE,eAA8C;AACxE,SAAO,0DAAG,QAAS;AACrB,GAFyB;AAQzB,qBAAqB,OAAqD;AACxE,SAAO,MAAM,eAAe,KAAK;AACnC;AAFS;AAIT,MAAM,WAAW;AAAA,EACf,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,WAAW;AACb;AAEA,oBAAoB,OAAY,WAAqB;AACnD,QAAM,aAAa,MAAM;AAGzB,QAAM,gBAAgB,KAAK,WAAW;AAEtC,QAAM,cAAc,OAAO,MAAM,SAAS;AAE1C,MAAI,aAAa;AACf,eAAW,OAAO,UAAU;AAC1B,UAAI,OAAO,WAAW;AACpB,kBAAU,SAAS,QAAQ,UAAU;AACrC,eAAO,UAAU;AAAA,MACnB;AAAA,IACF;AAAA,EACF;AAEA,WAAS,YAAY,YAAY;AAC/B,UAAM,gBAAgB,UAAU;AAChC,UAAM,iBAAiB,WAAW;AAElC,QAAI,eAAe,SAAS,WAAW;AACrC,iBAAW,SAAS;AACpB,aAAO,cAAc;AAAA,IACvB;AAEA,UAAM,YAAY,WAAW,KAAK,QAAQ;AAE1C,QAAI,WAAW;AACb,oBAAc,YAAY,IAAI,SAAoB;AAChD,yDAAiB,GAAG;AACpB,uDAAgB,GAAG;AAAA,MACrB;AAAA,IACF,WAES,aAAa,SAAS;AAC7B,oBAAc,YAAY,KAAK,kBAAkB,eAAe;AAAA,IAClE,WAAW,aAAa,aAAa;AACnC,oBAAc,YAAY,CAAC,eAAe,cAAc,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,IACpF;AAAA,EACF;AAEA,SAAO,KAAK,cAAc,cAAc;AAC1C;AA3CS;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/views/Text.js
CHANGED
|
@@ -11,15 +11,18 @@ const Text = createComponent({
|
|
|
11
11
|
componentName: "Text",
|
|
12
12
|
isText: true,
|
|
13
13
|
defaultProps: {
|
|
14
|
-
display:
|
|
15
|
-
boxSizing: "border-box",
|
|
14
|
+
display: "flex",
|
|
16
15
|
fontFamily: "System",
|
|
17
|
-
|
|
16
|
+
...isWeb && {
|
|
17
|
+
display: "inline",
|
|
18
|
+
boxSizing: "border-box",
|
|
19
|
+
wordWrap: "break-word"
|
|
20
|
+
}
|
|
18
21
|
},
|
|
19
22
|
variants: {
|
|
20
23
|
numberOfLines: {
|
|
21
|
-
1: ellipseStyle,
|
|
22
|
-
":number": (
|
|
24
|
+
1: isWeb ? ellipseStyle : { numberOfLines: 1 },
|
|
25
|
+
":number": (numberOfLines) => isWeb ? numberOfLines >= 1 ? { WebkitLineClamp: numberOfLines } : null : { numberOfLines }
|
|
23
26
|
},
|
|
24
27
|
selectable: {
|
|
25
28
|
true: {
|
|
@@ -45,15 +48,7 @@ const Text = createComponent({
|
|
|
45
48
|
deoptProps: new Set(isWeb ? [] : ["ellipse"]),
|
|
46
49
|
validStyles: {
|
|
47
50
|
...validStyles,
|
|
48
|
-
...stylePropsTextOnly
|
|
49
|
-
...isWeb && {
|
|
50
|
-
userSelect: true,
|
|
51
|
-
textOverflow: true,
|
|
52
|
-
whiteSpace: true,
|
|
53
|
-
wordWrap: true,
|
|
54
|
-
selectable: true,
|
|
55
|
-
cursor: true
|
|
56
|
-
}
|
|
51
|
+
...stylePropsTextOnly
|
|
57
52
|
}
|
|
58
53
|
});
|
|
59
54
|
export {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/views/Text.tsx"],
|
|
4
|
-
"sourcesContent": ["import { stylePropsTextOnly, validStyles } from '@tamagui/helpers'\nimport { Text as TextView } from 'react-native'\n\nimport { isWeb } from '../constants/platform'\nimport { createComponent } from '../createComponent'\nimport { TextProps, TextPropsBase } from '../types'\n\nconst ellipseStyle = {\n maxWidth: '100%',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n}\n\nexport const Text = createComponent<TextProps, TextView, TextPropsBase>({\n componentName: 'Text',\n isText: true,\n defaultProps: {\n display:
|
|
5
|
-
"mappings": "AAAA;AAGA;AACA;AAGA,MAAM,eAAe;AAAA,EACnB,UAAU;AAAA,EACV,UAAU;AAAA,EACV,cAAc;AAAA,EACd,YAAY;AACd;AAEO,MAAM,OAAO,gBAAoD;AAAA,EACtE,eAAe;AAAA,EACf,QAAQ;AAAA,
|
|
4
|
+
"sourcesContent": ["import { stylePropsTextOnly, validStyles } from '@tamagui/helpers'\nimport { Text as TextView } from 'react-native'\n\nimport { isWeb } from '../constants/platform'\nimport { createComponent } from '../createComponent'\nimport { TextProps, TextPropsBase } from '../types'\n\nconst ellipseStyle = {\n maxWidth: '100%',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n}\n\nexport const Text = createComponent<TextProps, TextView, TextPropsBase>({\n componentName: 'Text',\n isText: true,\n\n defaultProps: {\n display: 'flex',\n fontFamily: 'System',\n ...(isWeb && {\n display: 'inline',\n boxSizing: 'border-box',\n wordWrap: 'break-word',\n }),\n },\n\n variants: {\n numberOfLines: {\n 1: isWeb ? ellipseStyle : { numberOfLines: 1 },\n\n ':number': (numberOfLines) =>\n isWeb\n ? numberOfLines >= 1\n ? { WebkitLineClamp: numberOfLines }\n : null\n : { numberOfLines },\n },\n\n selectable: {\n true: {\n userSelect: 'text',\n cursor: 'text',\n },\n false: {\n userSelect: 'none',\n },\n },\n\n pressable: {\n true: {\n cursor: 'pointer',\n },\n },\n\n ellipse: {\n true: isWeb\n ? ellipseStyle\n : {\n numberOfLines: 1,\n lineBreakMode: 'clip',\n },\n },\n },\n\n deoptProps: new Set(isWeb ? [] : ['ellipse']),\n\n validStyles: {\n ...validStyles,\n ...stylePropsTextOnly,\n },\n})\n"],
|
|
5
|
+
"mappings": "AAAA;AAGA;AACA;AAGA,MAAM,eAAe;AAAA,EACnB,UAAU;AAAA,EACV,UAAU;AAAA,EACV,cAAc;AAAA,EACd,YAAY;AACd;AAEO,MAAM,OAAO,gBAAoD;AAAA,EACtE,eAAe;AAAA,EACf,QAAQ;AAAA,EAER,cAAc;AAAA,IACZ,SAAS;AAAA,IACT,YAAY;AAAA,OACR,SAAS;AAAA,MACX,SAAS;AAAA,MACT,WAAW;AAAA,MACX,UAAU;AAAA,IACZ;AAAA,EACF;AAAA,EAEA,UAAU;AAAA,IACR,eAAe;AAAA,MACb,GAAG,QAAQ,eAAe,EAAE,eAAe,EAAE;AAAA,MAE7C,WAAW,CAAC,kBACV,QACI,iBAAiB,IACf,EAAE,iBAAiB,cAAc,IACjC,OACF,EAAE,cAAc;AAAA,IACxB;AAAA,IAEA,YAAY;AAAA,MACV,MAAM;AAAA,QACJ,YAAY;AAAA,QACZ,QAAQ;AAAA,MACV;AAAA,MACA,OAAO;AAAA,QACL,YAAY;AAAA,MACd;AAAA,IACF;AAAA,IAEA,WAAW;AAAA,MACT,MAAM;AAAA,QACJ,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,IAEA,SAAS;AAAA,MACP,MAAM,QACF,eACA;AAAA,QACE,eAAe;AAAA,QACf,eAAe;AAAA,MACjB;AAAA,IACN;AAAA,EACF;AAAA,EAEA,YAAY,IAAI,IAAI,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC;AAAA,EAE5C,aAAa;AAAA,OACR;AAAA,OACA;AAAA,EACL;AACF,CAAC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
var __defProp = Object.defineProperty;
|
|
2
2
|
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
3
|
-
import React from "react";
|
|
3
|
+
import React, { useState } from "react";
|
|
4
|
+
import { useIsomorphicLayoutEffect } from "../constants/platform";
|
|
4
5
|
import { useDefaultThemeName, useThemeName } from "../hooks/useTheme";
|
|
5
6
|
import { Theme } from "./Theme";
|
|
6
7
|
let inversions = {
|
|
@@ -14,7 +15,10 @@ __name(setThemeInversions, "setThemeInversions");
|
|
|
14
15
|
const ThemeInverse = /* @__PURE__ */ __name((props) => {
|
|
15
16
|
const themeName = useThemeName();
|
|
16
17
|
const defaultTheme = useDefaultThemeName();
|
|
17
|
-
const name
|
|
18
|
+
const [name, setName] = useState(null);
|
|
19
|
+
useIsomorphicLayoutEffect(() => {
|
|
20
|
+
setName(inversions[themeName] || inversions[defaultTheme || ""] || null);
|
|
21
|
+
}, [defaultTheme, themeName]);
|
|
18
22
|
return /* @__PURE__ */ React.createElement(Theme, {
|
|
19
23
|
name
|
|
20
24
|
}, props.children);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/views/ThemeInverse.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from 'react'\n\nimport { useDefaultThemeName, useThemeName } from '../hooks/useTheme'\nimport { Theme } from './Theme'\n\ntype StringRecord = { [key: string]: string }\n\nlet inversions: StringRecord = {\n light: 'dark',\n dark: 'light',\n}\n\nexport function setThemeInversions(next: StringRecord) {\n inversions = next\n}\n\nexport const ThemeInverse = (props: { children: any }) => {\n const themeName = useThemeName()\n const defaultTheme = useDefaultThemeName()\n const name = inversions[themeName] || inversions[defaultTheme || ''] || null\n return <Theme name={name}>{props.children}</Theme>\n}\n"],
|
|
5
|
-
"mappings": ";;AAAA;AAEA;AACA;AAIA,IAAI,aAA2B;AAAA,EAC7B,OAAO;AAAA,EACP,MAAM;AACR;AAEO,4BAA4B,MAAoB;AACrD,eAAa;AACf;AAFgB;AAIT,MAAM,eAAe,wBAAC,UAA6B;AACxD,QAAM,YAAY,aAAa;AAC/B,QAAM,eAAe,oBAAoB;AACzC,QAAM,
|
|
4
|
+
"sourcesContent": ["import React, { useState } from 'react'\n\nimport { useIsomorphicLayoutEffect } from '../constants/platform'\nimport { useDefaultThemeName, useThemeName } from '../hooks/useTheme'\nimport { Theme } from './Theme'\n\ntype StringRecord = { [key: string]: string }\n\nlet inversions: StringRecord = {\n light: 'dark',\n dark: 'light',\n}\n\nexport function setThemeInversions(next: StringRecord) {\n inversions = next\n}\n\nexport const ThemeInverse = (props: { children: any }) => {\n const themeName = useThemeName()\n const defaultTheme = useDefaultThemeName()\n const [name, setName] = useState<null | string>(null)\n\n // ssr\n useIsomorphicLayoutEffect(() => {\n setName(inversions[themeName] || inversions[defaultTheme || ''] || null)\n }, [defaultTheme, themeName])\n\n return <Theme name={name}>{props.children}</Theme>\n}\n"],
|
|
5
|
+
"mappings": ";;AAAA;AAEA;AACA;AACA;AAIA,IAAI,aAA2B;AAAA,EAC7B,OAAO;AAAA,EACP,MAAM;AACR;AAEO,4BAA4B,MAAoB;AACrD,eAAa;AACf;AAFgB;AAIT,MAAM,eAAe,wBAAC,UAA6B;AACxD,QAAM,YAAY,aAAa;AAC/B,QAAM,eAAe,oBAAoB;AACzC,QAAM,CAAC,MAAM,WAAW,SAAwB,IAAI;AAGpD,4BAA0B,MAAM;AAC9B,YAAQ,WAAW,cAAc,WAAW,gBAAgB,OAAO,IAAI;AAAA,EACzE,GAAG,CAAC,cAAc,SAAS,CAAC;AAE5B,SAAO,oCAAC;AAAA,IAAM;AAAA,KAAa,MAAM,QAAS;AAC5C,GAX4B;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|