@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
|
@@ -13,16 +13,16 @@ import React, {
|
|
|
13
13
|
useRef,
|
|
14
14
|
useState
|
|
15
15
|
} from "react";
|
|
16
|
-
import { StyleSheet, Text, View } from "react-native";
|
|
16
|
+
import { Pressable, StyleSheet, Text, View } from "react-native";
|
|
17
17
|
import { onConfiguredOnce } from "./conf";
|
|
18
18
|
import { stackDefaultStyles } from "./constants/constants";
|
|
19
19
|
import { isAndroid, isWeb, useIsomorphicLayoutEffect } from "./constants/platform";
|
|
20
20
|
import { rnw } from "./constants/rnw";
|
|
21
|
-
import { isVariable } from "./createVariable";
|
|
22
21
|
import { createShallowUpdate } from "./helpers/createShallowUpdate";
|
|
23
22
|
import { extendStaticConfig, parseStaticConfig } from "./helpers/extendStaticConfig";
|
|
24
23
|
import { insertSplitStyles, useSplitStyles } from "./helpers/getSplitStyles";
|
|
25
24
|
import { getAllSelectors } from "./helpers/insertStyleRule";
|
|
25
|
+
import { BaseButton } from "./helpers/nativeGestureHandler";
|
|
26
26
|
import { proxyThemeVariables } from "./helpers/proxyThemeVariables";
|
|
27
27
|
import { wrapThemeManagerContext } from "./helpers/wrapThemeManagerContext";
|
|
28
28
|
import { useFeatures } from "./hooks/useFeatures";
|
|
@@ -83,13 +83,13 @@ function createComponent(configIn, ParentComponent) {
|
|
|
83
83
|
function addPseudoToStyles(styles, name, pseudos) {
|
|
84
84
|
const pseudoStyle = pseudos[name];
|
|
85
85
|
const shouldNestObject = isWeb && name !== "enterStyle" && name !== "exitStyle";
|
|
86
|
-
if (pseudoStyle) {
|
|
87
|
-
styles.push(shouldNestObject ? { [name]: pseudoStyle } : pseudoStyle);
|
|
88
|
-
}
|
|
89
86
|
const defaultPseudoStyle = initialSplitStyles.pseudos[name];
|
|
90
87
|
if (defaultPseudoStyle) {
|
|
91
88
|
styles.push(shouldNestObject ? { [name]: defaultPseudoStyle } : defaultPseudoStyle);
|
|
92
89
|
}
|
|
90
|
+
if (pseudoStyle) {
|
|
91
|
+
styles.push(shouldNestObject ? { [name]: pseudoStyle } : pseudoStyle);
|
|
92
|
+
}
|
|
93
93
|
}
|
|
94
94
|
__name(addPseudoToStyles, "addPseudoToStyles");
|
|
95
95
|
const component = forwardRef((props, forwardedRef) => {
|
|
@@ -98,7 +98,7 @@ function createComponent(configIn, ParentComponent) {
|
|
|
98
98
|
const { Component, componentName, isText, isZStack } = staticConfig;
|
|
99
99
|
if (process.env.NODE_ENV === "development") {
|
|
100
100
|
if (props["debug"]) {
|
|
101
|
-
console.
|
|
101
|
+
console.log("\u26A0\uFE0F", staticConfig.componentName || (Component == null ? void 0 : Component.displayName) || (Component == null ? void 0 : Component.name) || "[Unnamed Component]", "debug on");
|
|
102
102
|
console.log("props in:", props, Object.keys(props));
|
|
103
103
|
if (props["debug"] === "break")
|
|
104
104
|
debugger;
|
|
@@ -319,7 +319,10 @@ function createComponent(configIn, ParentComponent) {
|
|
|
319
319
|
const isTouch = useIsTouchDevice();
|
|
320
320
|
const isHoverable = isWeb && !isTouch;
|
|
321
321
|
const attachHover = isHoverable && !!(pseudos && pseudos.hoverStyle || onHoverIn || onHoverOut || onMouseEnter || onMouseLeave);
|
|
322
|
-
const
|
|
322
|
+
const handlesPressEvents = !isStringElement && !asChild;
|
|
323
|
+
const pressKey = handlesPressEvents ? "onPress" : "onClick";
|
|
324
|
+
const pressInKey = handlesPressEvents ? "onPressIn" : "onMouseDown";
|
|
325
|
+
const pressOutKey = handlesPressEvents ? "onPressOut" : "onMouseUp";
|
|
323
326
|
const shouldAttach = !asChild && (attachPress || attachHover || "pressStyle" in props || "onPress" in props || "onPressIn" in props || "onPressOut" in props || isWeb && ("hoverStyle" in props || "onHoverIn" in props || "onHoverOut" in props || "onMouseEnter" in props || "onMouseLeave" in props));
|
|
324
327
|
const unPress = useCallback(() => {
|
|
325
328
|
if (!internal.current.isMounted)
|
|
@@ -330,12 +333,10 @@ function createComponent(configIn, ParentComponent) {
|
|
|
330
333
|
});
|
|
331
334
|
}, []);
|
|
332
335
|
const events = shouldAttach ? {
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
}
|
|
338
|
-
},
|
|
336
|
+
[pressOutKey]: attachPress ? (e) => {
|
|
337
|
+
unPress();
|
|
338
|
+
onPressOut == null ? void 0 : onPressOut(e);
|
|
339
|
+
} : void 0,
|
|
339
340
|
...isHoverable && {
|
|
340
341
|
onMouseEnter: attachHover ? (e) => {
|
|
341
342
|
let next = {};
|
|
@@ -368,7 +369,7 @@ function createComponent(configIn, ParentComponent) {
|
|
|
368
369
|
onMouseLeave == null ? void 0 : onMouseLeave(e);
|
|
369
370
|
} : void 0
|
|
370
371
|
},
|
|
371
|
-
|
|
372
|
+
[pressInKey]: attachPress ? (e) => {
|
|
372
373
|
setStateShallow({
|
|
373
374
|
press: true,
|
|
374
375
|
pressIn: true
|
|
@@ -379,11 +380,10 @@ function createComponent(configIn, ParentComponent) {
|
|
|
379
380
|
mouseUps.add(unPress);
|
|
380
381
|
}
|
|
381
382
|
} : null,
|
|
382
|
-
[
|
|
383
|
+
[pressKey]: attachPress ? (e) => {
|
|
384
|
+
unPress();
|
|
383
385
|
onClick == null ? void 0 : onClick(e);
|
|
384
386
|
onPress == null ? void 0 : onPress(e);
|
|
385
|
-
unPress();
|
|
386
|
-
onPressOut == null ? void 0 : onPressOut(e);
|
|
387
387
|
} : null
|
|
388
388
|
} : null;
|
|
389
389
|
const childEls = !children || asChild ? children : wrapThemeManagerContext(spacedChildren({
|
|
@@ -392,17 +392,6 @@ function createComponent(configIn, ParentComponent) {
|
|
|
392
392
|
flexDirection: props.flexDirection || ((_b = staticConfig.defaultProps) == null ? void 0 : _b.flexDirection),
|
|
393
393
|
isZStack
|
|
394
394
|
}), getThemeManagerIfChanged(theme));
|
|
395
|
-
const [pressProps] = usePressable(events ? {
|
|
396
|
-
disabled,
|
|
397
|
-
...hitSlop && {
|
|
398
|
-
hitSlop
|
|
399
|
-
},
|
|
400
|
-
onPressIn: events.onMouseDown,
|
|
401
|
-
onPressOut: events.onPressOut,
|
|
402
|
-
onPress: events[pressEventKey]
|
|
403
|
-
} : {
|
|
404
|
-
disabled: true
|
|
405
|
-
});
|
|
406
395
|
let content;
|
|
407
396
|
if (isWeb) {
|
|
408
397
|
if (staticConfig.isReactNativeWeb) {
|
|
@@ -419,19 +408,41 @@ function createComponent(configIn, ParentComponent) {
|
|
|
419
408
|
}
|
|
420
409
|
}
|
|
421
410
|
}
|
|
422
|
-
if (events) {
|
|
423
|
-
if (!isStringElement) {
|
|
424
|
-
Object.assign(viewProps, pressProps);
|
|
425
|
-
} else {
|
|
426
|
-
Object.assign(viewProps, events);
|
|
427
|
-
}
|
|
428
|
-
}
|
|
429
411
|
if (asChild) {
|
|
430
412
|
ViewComponent = Slot;
|
|
431
413
|
const onlyChild = React.Children.only(children);
|
|
432
414
|
Object.assign(viewProps, onlyChild.props);
|
|
433
415
|
}
|
|
416
|
+
if (isWeb) {
|
|
417
|
+
const [pressableProps] = usePressable(events ? {
|
|
418
|
+
disabled,
|
|
419
|
+
...hitSlop && {
|
|
420
|
+
hitSlop
|
|
421
|
+
},
|
|
422
|
+
onPressOut: events[pressOutKey],
|
|
423
|
+
onPressIn: events[pressInKey],
|
|
424
|
+
onPress: events[pressKey]
|
|
425
|
+
} : {
|
|
426
|
+
disabled: true
|
|
427
|
+
});
|
|
428
|
+
if (events) {
|
|
429
|
+
if (handlesPressEvents) {
|
|
430
|
+
Object.assign(viewProps, pressableProps);
|
|
431
|
+
} else {
|
|
432
|
+
Object.assign(viewProps, events);
|
|
433
|
+
}
|
|
434
|
+
}
|
|
435
|
+
}
|
|
434
436
|
content = createElement(ViewComponent, viewProps, childEls);
|
|
437
|
+
if (!isWeb) {
|
|
438
|
+
if (attachPress && events) {
|
|
439
|
+
content = <Pressable onPressIn={events[pressInKey]} onPress={events[pressKey]}><BaseButton onActiveStateChange={(isActive) => {
|
|
440
|
+
if (!isActive) {
|
|
441
|
+
unPress();
|
|
442
|
+
}
|
|
443
|
+
}}>{content}</BaseButton></Pressable>;
|
|
444
|
+
}
|
|
445
|
+
}
|
|
435
446
|
if (isWeb && events && attachHover) {
|
|
436
447
|
content = <span className="tui_Hoverable" style={{
|
|
437
448
|
display: "contents"
|
|
@@ -439,8 +450,7 @@ function createComponent(configIn, ParentComponent) {
|
|
|
439
450
|
}
|
|
440
451
|
if (process.env.NODE_ENV === "development") {
|
|
441
452
|
if (props["debug"]) {
|
|
442
|
-
viewProps
|
|
443
|
-
console.log(" \xBB ", { propsIn: { ...props }, propsOut: { ...viewProps }, state, splitStyles, animationStyles, isStringElement, classNamesIn: (_c = props.className) == null ? void 0 : _c.split(" "), classNamesOut: (_d = viewProps.className) == null ? void 0 : _d.split(" "), pressProps, events, shouldAttach, ViewComponent, viewProps, styles, pseudos, content, childEls, shouldAvoidClasses, avoidClasses, animation: props.animation, style, defaultNativeStyle, initialSplitStyles, ...typeof window !== "undefined" ? { theme, themeState: theme.__state, themeClassName: theme.className, staticConfig, tamaguiConfig } : null });
|
|
453
|
+
console.log(" \xBB ", { propsIn: { ...props }, propsOut: { ...viewProps }, state, splitStyles, animationStyles, isStringElement, classNamesIn: (_c = props.className) == null ? void 0 : _c.split(" "), classNamesOut: (_d = viewProps.className) == null ? void 0 : _d.split(" "), events, shouldAttach, ViewComponent, viewProps, styles, pseudos, content, childEls, shouldAvoidClasses, avoidClasses, animation: props.animation, style, defaultNativeStyle, initialSplitStyles, ...typeof window !== "undefined" ? { theme, themeState: theme.__state, themeClassName: theme.className, staticConfig, tamaguiConfig } : null });
|
|
444
454
|
}
|
|
445
455
|
}
|
|
446
456
|
if (features.length) {
|
|
@@ -472,19 +482,23 @@ function createComponent(configIn, ParentComponent) {
|
|
|
472
482
|
resolveVariablesAs: "both",
|
|
473
483
|
keepVariantsAsProps: true
|
|
474
484
|
});
|
|
475
|
-
const
|
|
485
|
+
const defaults = {
|
|
486
|
+
...component.defaultProps,
|
|
487
|
+
...initialSplitStyles.viewProps
|
|
488
|
+
};
|
|
476
489
|
defaultNativeStyle = {};
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
490
|
+
const validStyles = staticConfig.validStyles || stylePropsView;
|
|
491
|
+
for (const key in staticConfig.defaultProps) {
|
|
492
|
+
const val = staticConfig.defaultProps[key];
|
|
493
|
+
if (typeof val === "string" && val[0] === "$" || !validStyles[key]) {
|
|
494
|
+
defaults[key] = val;
|
|
495
|
+
} else {
|
|
496
|
+
defaultNativeStyle[key] = val;
|
|
497
|
+
}
|
|
480
498
|
}
|
|
481
499
|
defaultNativeStyleSheet = StyleSheet.create({
|
|
482
500
|
base: defaultNativeStyle
|
|
483
501
|
});
|
|
484
|
-
const defaults = {
|
|
485
|
-
...viewProps,
|
|
486
|
-
...component.defaultProps
|
|
487
|
-
};
|
|
488
502
|
if (Object.keys(defaults).length) {
|
|
489
503
|
tamaguiDefaultProps = defaults;
|
|
490
504
|
}
|
|
@@ -492,7 +506,10 @@ function createComponent(configIn, ParentComponent) {
|
|
|
492
506
|
if (process.env.IS_STATIC !== "is_static") {
|
|
493
507
|
console.log(`\u{1F41B} [${staticConfig.componentName || "Component"}]`, {
|
|
494
508
|
staticConfig,
|
|
495
|
-
initialSplitStyles
|
|
509
|
+
initialSplitStyles,
|
|
510
|
+
tamaguiDefaultProps,
|
|
511
|
+
defaultNativeStyle,
|
|
512
|
+
defaults
|
|
496
513
|
});
|
|
497
514
|
}
|
|
498
515
|
}
|
|
@@ -559,6 +576,9 @@ const Spacer = createComponent({
|
|
|
559
576
|
minWidth: 0
|
|
560
577
|
}
|
|
561
578
|
}
|
|
579
|
+
},
|
|
580
|
+
defaultVariants: {
|
|
581
|
+
direction: "horizontal"
|
|
562
582
|
}
|
|
563
583
|
});
|
|
564
584
|
function spacedChildren({
|
|
@@ -569,33 +589,32 @@ function spacedChildren({
|
|
|
569
589
|
spaceFlex
|
|
570
590
|
}) {
|
|
571
591
|
var _a;
|
|
572
|
-
const childrenList = Children.toArray(children);
|
|
592
|
+
const childrenList = Array.isArray(children) ? children : Children.toArray(children);
|
|
573
593
|
const len = childrenList.length;
|
|
574
|
-
if (len
|
|
594
|
+
if (len <= 1) {
|
|
575
595
|
return childrenList;
|
|
576
596
|
}
|
|
577
|
-
const
|
|
597
|
+
const final = [];
|
|
578
598
|
for (const [index, child] of childrenList.entries()) {
|
|
579
|
-
if (child === null || child === void 0) {
|
|
599
|
+
if (child === null || child === void 0 || child === false || Array.isArray(child) && child.length === 0) {
|
|
580
600
|
continue;
|
|
581
601
|
}
|
|
582
602
|
if (!child || child["key"] && !isZStack) {
|
|
583
|
-
|
|
603
|
+
final.push(child);
|
|
584
604
|
} else {
|
|
585
|
-
|
|
605
|
+
final.push(<Fragment key={index}>{isZStack ? <AbsoluteFill>{child}</AbsoluteFill> : child}</Fragment>);
|
|
586
606
|
}
|
|
587
607
|
if ((_a = child["type"]) == null ? void 0 : _a["isVisuallyHidden"]) {
|
|
588
608
|
continue;
|
|
589
609
|
}
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
}
|
|
610
|
+
const next = childrenList[index + 1];
|
|
611
|
+
if (next && space) {
|
|
612
|
+
final.push(<Spacer key={`_${index}_spacer`} direction={flexDirection === "row" || flexDirection === "row-reverse" ? "horizontal" : "vertical"} size={space} {...spaceFlex && {
|
|
613
|
+
flex: spaceFlex
|
|
614
|
+
}} />);
|
|
596
615
|
}
|
|
597
616
|
}
|
|
598
|
-
return
|
|
617
|
+
return final;
|
|
599
618
|
}
|
|
600
619
|
__name(spacedChildren, "spacedChildren");
|
|
601
620
|
function AbsoluteFill(props) {
|
|
@@ -1,37 +1,28 @@
|
|
|
1
1
|
var __defProp = Object.defineProperty;
|
|
2
2
|
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
3
3
|
const matchRgbaHsla = /(rgba|hsla)\(\s*([\d\.]{1,}%?)\s*,\s*([\d\.]{1,}%?)\s*,\s*([\d\.]{1,}%?)\s*,\s*([\d\.]{1,})\s*\)$/;
|
|
4
|
-
function fixNativeShadow(
|
|
5
|
-
|
|
4
|
+
function fixNativeShadow(props) {
|
|
5
|
+
var _a, _b;
|
|
6
|
+
if (!props.shadowColor || props.shadowColor === "transparent") {
|
|
6
7
|
return;
|
|
7
8
|
}
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
styles.push([
|
|
14
|
-
"shadowOffset",
|
|
15
|
-
{
|
|
16
|
-
width: 0,
|
|
17
|
-
height: 0
|
|
18
|
-
}
|
|
19
|
-
]);
|
|
20
|
-
}
|
|
21
|
-
if (styles.find((x) => x[0] === "shadowOpacity")) {
|
|
22
|
-
return;
|
|
9
|
+
if (!props.shadowOffset) {
|
|
10
|
+
props.shadowOffset = {
|
|
11
|
+
width: 0,
|
|
12
|
+
height: 0
|
|
13
|
+
};
|
|
23
14
|
}
|
|
24
|
-
const c =
|
|
15
|
+
const c = String(props.shadowColor);
|
|
25
16
|
if ((c[0] === "r" || c[0] === "h") && c[3] === "a") {
|
|
26
17
|
const [_, type, _1, _2, _3, a] = c.match(matchRgbaHsla) || [];
|
|
27
18
|
if (typeof a !== "string") {
|
|
28
19
|
console.trace("invalid", c, type);
|
|
29
20
|
throw new Error(`invalid style`);
|
|
30
21
|
}
|
|
31
|
-
|
|
32
|
-
|
|
22
|
+
props.shadowColor = `${type.replace("a", "")}(${_1},${_2},${_3})`;
|
|
23
|
+
props.shadowOpacity = (_a = props.shadowOpacity) != null ? _a : +a;
|
|
33
24
|
} else {
|
|
34
|
-
|
|
25
|
+
props.shadowOpacity = (_b = props.shadowOpacity) != null ? _b : 1;
|
|
35
26
|
}
|
|
36
27
|
}
|
|
37
28
|
__name(fixNativeShadow, "fixNativeShadow");
|
|
@@ -23,7 +23,21 @@ import {
|
|
|
23
23
|
const skipProps = {
|
|
24
24
|
animation: true,
|
|
25
25
|
animateOnly: true,
|
|
26
|
-
debug: true
|
|
26
|
+
debug: true,
|
|
27
|
+
...!isWeb && {
|
|
28
|
+
tag: true,
|
|
29
|
+
whiteSpace: true,
|
|
30
|
+
wordWrap: true,
|
|
31
|
+
textOverflow: true,
|
|
32
|
+
textDecorationDistance: true,
|
|
33
|
+
userSelect: true,
|
|
34
|
+
selectable: true,
|
|
35
|
+
cursor: true,
|
|
36
|
+
contain: true,
|
|
37
|
+
pointerEvents: true,
|
|
38
|
+
boxSizing: true,
|
|
39
|
+
boxShadow: true
|
|
40
|
+
}
|
|
27
41
|
};
|
|
28
42
|
let conf;
|
|
29
43
|
const getSplitStyles = /* @__PURE__ */ __name((props, staticConfig, theme, state, defaultClassNames) => {
|
|
@@ -110,6 +124,9 @@ const getSplitStyles = /* @__PURE__ */ __name((props, staticConfig, theme, state
|
|
|
110
124
|
}
|
|
111
125
|
if (!isWeb || state.noClassNames || state.resolveVariablesAs === "value" || state.resolveVariablesAs === "both") {
|
|
112
126
|
for (const key in cur) {
|
|
127
|
+
if (skipProps[key]) {
|
|
128
|
+
continue;
|
|
129
|
+
}
|
|
113
130
|
if (key in stylePropsTransform) {
|
|
114
131
|
mergeTransform(style, key, cur[key]);
|
|
115
132
|
} else {
|
|
@@ -124,6 +141,9 @@ const getSplitStyles = /* @__PURE__ */ __name((props, staticConfig, theme, state
|
|
|
124
141
|
if (skipProps[keyInit]) {
|
|
125
142
|
continue;
|
|
126
143
|
}
|
|
144
|
+
if (!isWeb && keyInit.startsWith("data-")) {
|
|
145
|
+
continue;
|
|
146
|
+
}
|
|
127
147
|
const valInit = props[keyInit];
|
|
128
148
|
if (keyInit === "style" || keyInit.startsWith("_style")) {
|
|
129
149
|
push();
|
|
@@ -220,7 +240,7 @@ const getSplitStyles = /* @__PURE__ */ __name((props, staticConfig, theme, state
|
|
|
220
240
|
continue;
|
|
221
241
|
}
|
|
222
242
|
if (!staticConfig.variants || !(key in staticConfig.variants)) {
|
|
223
|
-
if (key
|
|
243
|
+
if (!skipProps[key]) {
|
|
224
244
|
push();
|
|
225
245
|
viewProps[key] = val;
|
|
226
246
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "react-native-gesture-handler";
|
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "react-native-gesture-handler";
|
package/dist/jsx/styled.js
CHANGED
package/dist/jsx/views/Slot.js
CHANGED
|
@@ -16,7 +16,7 @@ const SlotClone = React.forwardRef((props, forwardedRef) => {
|
|
|
16
16
|
const { children, ...slotProps } = props;
|
|
17
17
|
if (React.isValidElement(children)) {
|
|
18
18
|
return React.cloneElement(children, {
|
|
19
|
-
...mergeProps(
|
|
19
|
+
...mergeProps(children, slotProps),
|
|
20
20
|
ref: composeRefs(forwardedRef, children.ref)
|
|
21
21
|
});
|
|
22
22
|
}
|
|
@@ -30,11 +30,30 @@ function isSlottable(child) {
|
|
|
30
30
|
return React.isValidElement(child);
|
|
31
31
|
}
|
|
32
32
|
__name(isSlottable, "isSlottable");
|
|
33
|
-
|
|
33
|
+
const pressMap = {
|
|
34
|
+
onPress: "onClick",
|
|
35
|
+
onPressOut: "onMouseOut",
|
|
36
|
+
onPressIn: "onMouseIn"
|
|
37
|
+
};
|
|
38
|
+
function mergeProps(child, slotProps) {
|
|
39
|
+
const childProps = child.props;
|
|
34
40
|
const overrideProps = { ...childProps };
|
|
35
|
-
|
|
41
|
+
const isHTMLChild = typeof child.type === "string";
|
|
42
|
+
if (isHTMLChild) {
|
|
43
|
+
for (const key in pressMap) {
|
|
44
|
+
if (key in slotProps) {
|
|
45
|
+
slotProps[pressMap[key]] = slotProps[key];
|
|
46
|
+
delete slotProps[key];
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
for (let propName in childProps) {
|
|
36
51
|
const slotPropValue = slotProps[propName];
|
|
37
52
|
const childPropValue = childProps[propName];
|
|
53
|
+
if (isHTMLChild && pressMap[propName]) {
|
|
54
|
+
propName = pressMap[propName];
|
|
55
|
+
delete overrideProps[propName];
|
|
56
|
+
}
|
|
38
57
|
const isHandler = /^on[A-Z]/.test(propName);
|
|
39
58
|
if (isHandler) {
|
|
40
59
|
overrideProps[propName] = (...args) => {
|
package/dist/jsx/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,5 +1,7 @@
|
|
|
1
1
|
var __defProp = Object.defineProperty;
|
|
2
2
|
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
3
|
+
import { useState } from "react";
|
|
4
|
+
import { useIsomorphicLayoutEffect } from "../constants/platform";
|
|
3
5
|
import { useDefaultThemeName, useThemeName } from "../hooks/useTheme";
|
|
4
6
|
import { Theme } from "./Theme";
|
|
5
7
|
let inversions = {
|
|
@@ -13,7 +15,10 @@ __name(setThemeInversions, "setThemeInversions");
|
|
|
13
15
|
const ThemeInverse = /* @__PURE__ */ __name((props) => {
|
|
14
16
|
const themeName = useThemeName();
|
|
15
17
|
const defaultTheme = useDefaultThemeName();
|
|
16
|
-
const name
|
|
18
|
+
const [name, setName] = useState(null);
|
|
19
|
+
useIsomorphicLayoutEffect(() => {
|
|
20
|
+
setName(inversions[themeName] || inversions[defaultTheme || ""] || null);
|
|
21
|
+
}, [defaultTheme, themeName]);
|
|
17
22
|
return <Theme name={name}>{props.children}</Theme>;
|
|
18
23
|
}, "ThemeInverse");
|
|
19
24
|
export {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/core",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.1-beta.18",
|
|
4
4
|
"source": "src/index.ts",
|
|
5
5
|
"main": "dist/cjs",
|
|
6
6
|
"module": "dist/esm",
|
|
@@ -19,10 +19,12 @@
|
|
|
19
19
|
"dist"
|
|
20
20
|
],
|
|
21
21
|
"dependencies": {
|
|
22
|
-
"@
|
|
22
|
+
"@expo/match-media": "^0.3.0",
|
|
23
|
+
"@tamagui/helpers": "^1.0.1-beta.18",
|
|
23
24
|
"@tamagui/ow": "^0.28.1",
|
|
24
|
-
"@tamagui/use-debounce": "^1.0.
|
|
25
|
-
"@tamagui/use-force-update": "^1.0.
|
|
25
|
+
"@tamagui/use-debounce": "^1.0.1-beta.18",
|
|
26
|
+
"@tamagui/use-force-update": "^1.0.1-beta.18",
|
|
27
|
+
"expo-screen-orientation": "^4.2.0",
|
|
26
28
|
"react": "*",
|
|
27
29
|
"react-dom": "*"
|
|
28
30
|
},
|
|
@@ -30,7 +32,7 @@
|
|
|
30
32
|
"react-native-web": "*"
|
|
31
33
|
},
|
|
32
34
|
"devDependencies": {
|
|
33
|
-
"@tamagui/build": "^1.0.
|
|
35
|
+
"@tamagui/build": "^1.0.1-beta.18",
|
|
34
36
|
"@types/react": "^17.0.35",
|
|
35
37
|
"csstype": "^3.0.10",
|
|
36
38
|
"esbuild": "^0.14.36",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"createComponent.d.ts","sourceRoot":"","sources":["../src/createComponent.tsx"],"names":[],"mappings":";AAaA,OAAO,
|
|
1
|
+
{"version":3,"file":"createComponent.d.ts","sourceRoot":"","sources":["../src/createComponent.tsx"],"names":[],"mappings":";AAaA,OAAO,EAA+B,IAAI,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAiB3E,OAAO,EACL,WAAW,EACX,UAAU,EACV,YAAY,EACZ,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,EAKjB,MAAM,SAAS,CAAA;AAgBhB,eAAO,MAAM,QAAQ,eAAsB,CAAA;AA0B3C,wBAAgB,eAAe,CAC7B,kBAAkB,SAAS,MAAM,GAAG,EAAE,EACtC,GAAG,GAAG,IAAI,EACV,SAAS,GAAG,KAAK,EACjB,QAAQ,EAAE,OAAO,CAAC,YAAY,CAAC,GAAG,kBAAkB,EAAE,eAAe,CAAC,EAAE,iBAAiB,4DAuqB1F;AAKD,eAAO,MAAM,MAAM;;;;mBAgDjB,CAAA;AAEF,wBAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,aAAa,EACb,SAAS,GACV,EAAE;IACD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,EAAE,GAAG,CAAA;IACb,KAAK,CAAC,EAAE,GAAG,CAAA;IACX,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;IAC5B,aAAa,CAAC,EAAE,SAAS,CAAC,eAAe,CAAC,CAAA;CAC3C,SAiDA;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,GAAG,eAkBtC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fixNativeShadow.native.d.ts","sourceRoot":"","sources":["../../src/helpers/fixNativeShadow.native.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"fixNativeShadow.native.d.ts","sourceRoot":"","sources":["../../src/helpers/fixNativeShadow.native.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAKxC,wBAAgB,eAAe,CAAC,KAAK,EAAE,SAAS,QAwB/C"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getSplitStyles.d.ts","sourceRoot":"","sources":["../../src/helpers/getSplitStyles.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAKxC,OAAO,EACL,SAAS,EAET,YAAY,EAEZ,eAAe,EACf,UAAU,EACV,kBAAkB,EAElB,WAAW,EACZ,MAAM,UAAU,CAAA;AAWjB,oBAAY,WAAW,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAA;AAC3D,oBAAY,gBAAgB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;AACrD,oBAAY,gBAAgB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"getSplitStyles.d.ts","sourceRoot":"","sources":["../../src/helpers/getSplitStyles.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAKxC,OAAO,EACL,SAAS,EAET,YAAY,EAEZ,eAAe,EACf,UAAU,EACV,kBAAkB,EAElB,WAAW,EACZ,MAAM,UAAU,CAAA;AAWjB,oBAAY,WAAW,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAA;AAC3D,oBAAY,gBAAgB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;AACrD,oBAAY,gBAAgB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAA;AA6BhE,aAAK,aAAa,GAAG,CACnB,KAAK,EAAE;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,EAC7B,YAAY,EAAE,kBAAkB,EAChC,KAAK,EAAE,WAAW,EAClB,KAAK,EAAE,eAAe,GAAG;IACvB,mBAAmB,CAAC,EAAE,OAAO,CAAA;CAC9B,EACD,iBAAiB,CAAC,EAAE,GAAG,KACpB;IACH,OAAO,EAAE,YAAY,CAAA;IACrB,MAAM,EAAE,MAAM,CAAC,SAAS,EAAE,SAAS,CAAC,CAAA;IACpC,KAAK,EAAE,SAAS,CAAA;IAChB,UAAU,EAAE,gBAAgB,CAAA;IAC5B,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,CAAA;IACjC,SAAS,EAAE,UAAU,CAAA;CACtB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,aAiU5B,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,aAM/B,CAAA;AAGD,eAAO,MAAM,cAAc,EAAE,aAQ5B,CAAA;AAED,eAAO,MAAM,WAAW,YACb,MAAM,gBACD,kBAAkB,SACzB,WAAW,SACX,GAAG,SACH,eAAe,8CAErB,SAuBF,CAAA;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,GAAG,QAI9C"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"nativeGestureHandler.d.ts","sourceRoot":"","sources":["../../src/helpers/nativeGestureHandler.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU,UAAW,GAAG,QAAmB,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"nativeGestureHandler.native.d.ts","sourceRoot":"","sources":["../../src/helpers/nativeGestureHandler.native.ts"],"names":[],"mappings":"AAAA,cAAc,8BAA8B,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
//# sourceMappingURL=usePrevious.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"usePrevious.d.ts","sourceRoot":"","sources":["../../src/hooks/usePrevious.tsx"],"names":[],"mappings":""}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"nativeGestureHandler.native.d.ts","sourceRoot":"","sources":["../src/nativeGestureHandler.native.ts"],"names":[],"mappings":"AAAA,cAAc,8BAA8B,CAAA"}
|
package/types/styled.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../src/styled.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,QAAQ,EACR,gBAAgB,EAChB,UAAU,EACV,WAAW,EACX,YAAY,EACZ,iBAAiB,EACjB,gBAAgB,EAChB,kBAAkB,EAClB,qBAAqB,EACtB,MAAM,SAAS,CAAA;AAGhB,oBAAY,aAAa,CAAC,eAAe,SAAS,iBAAiB,IAAI,QAAQ,CAAC,eAAe,CAAC,GAAG;IACjG,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,kBAAkB,CAAC,eAAe,CAAC,GAAG,SAAS,CAAA;IAC1D,eAAe,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAA;CACzC,CAAA;AAED,wBAAgB,MAAM,CACpB,eAAe,SAAS,iBAAiB,EACzC,QAAQ,SAAS,kBAAkB,CAAC,eAAe,CAAC,GAAG,MAAM,GACzD,kBAAkB,CAAC,eAAe,CAAC,GACnC,MAAM,EAEV,SAAS,EAAE,eAAe,EAE1B,OAAO,CAAC,EAAE,QAAQ,CAAC,eAAe,CAAC,GAAG;IACpC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAA;IAE/B,eAAe,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAA;CACzC,EACD,uBAAuB,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,
|
|
1
|
+
{"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../src/styled.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,QAAQ,EACR,gBAAgB,EAChB,UAAU,EACV,WAAW,EACX,YAAY,EACZ,iBAAiB,EACjB,gBAAgB,EAChB,kBAAkB,EAClB,qBAAqB,EACtB,MAAM,SAAS,CAAA;AAGhB,oBAAY,aAAa,CAAC,eAAe,SAAS,iBAAiB,IAAI,QAAQ,CAAC,eAAe,CAAC,GAAG;IACjG,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,kBAAkB,CAAC,eAAe,CAAC,GAAG,SAAS,CAAA;IAC1D,eAAe,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAA;CACzC,CAAA;AAED,wBAAgB,MAAM,CACpB,eAAe,SAAS,iBAAiB,EACzC,QAAQ,SAAS,kBAAkB,CAAC,eAAe,CAAC,GAAG,MAAM,GACzD,kBAAkB,CAAC,eAAe,CAAC,GACnC,MAAM,EAEV,SAAS,EAAE,eAAe,EAE1B,OAAO,CAAC,EAAE,QAAQ,CAAC,eAAe,CAAC,GAAG;IACpC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAA;IAE/B,eAAe,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAA;CACzC,EACD,uBAAuB,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,qnEAgFhD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../src/views/Text.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,IAAI,QAAQ,EAAE,MAAM,cAAc,CAAA;AAI/C,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,UAAU,CAAA;AASnD,eAAO,MAAM,IAAI,
|
|
1
|
+
{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../src/views/Text.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,IAAI,QAAQ,EAAE,MAAM,cAAc,CAAA;AAI/C,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,UAAU,CAAA;AASnD,eAAO,MAAM,IAAI,6EA0Df,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemeInverse.d.ts","sourceRoot":"","sources":["../../src/views/ThemeInverse.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"ThemeInverse.d.ts","sourceRoot":"","sources":["../../src/views/ThemeInverse.tsx"],"names":[],"mappings":";AAMA,aAAK,YAAY,GAAG;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,CAAA;AAO7C,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,YAAY,QAEpD;AAED,eAAO,MAAM,YAAY,UAAW;IAAE,QAAQ,EAAE,GAAG,CAAA;CAAE,gBAWpD,CAAA"}
|