react-native-laminar 1.4.4 → 1.5.0
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/README.md +36 -6
- package/lib/commonjs/hooks/use-inline-auto-width.js +24 -1
- package/lib/commonjs/hooks/use-inline-auto-width.js.map +1 -1
- package/lib/commonjs/hooks/use-leading-animation.js +49 -0
- package/lib/commonjs/hooks/use-leading-animation.js.map +1 -0
- package/lib/commonjs/hooks/use-morph-motion.js +3 -1
- package/lib/commonjs/hooks/use-morph-motion.js.map +1 -1
- package/lib/commonjs/index.js +35 -6
- package/lib/commonjs/index.js.map +1 -1
- package/lib/commonjs/motion/preset-map.js +5 -0
- package/lib/commonjs/motion/preset-map.js.map +1 -1
- package/lib/commonjs/view/leading-element.js +37 -0
- package/lib/commonjs/view/leading-element.js.map +1 -0
- package/lib/commonjs/view/morph-viewport.js +26 -0
- package/lib/commonjs/view/morph-viewport.js.map +1 -1
- package/lib/commonjs/view/number-run.js +70 -22
- package/lib/commonjs/view/number-run.js.map +1 -1
- package/lib/commonjs/view/slot-shadow.js +77 -0
- package/lib/commonjs/view/slot-shadow.js.map +1 -0
- package/lib/commonjs/view/slots-run.js +111 -42
- package/lib/commonjs/view/slots-run.js.map +1 -1
- package/lib/commonjs/view/text-run.js +13 -24
- package/lib/commonjs/view/text-run.js.map +1 -1
- package/lib/commonjs/view/ticker-run.js +127 -0
- package/lib/commonjs/view/ticker-run.js.map +1 -0
- package/lib/module/hooks/use-inline-auto-width.js +24 -1
- package/lib/module/hooks/use-inline-auto-width.js.map +1 -1
- package/lib/module/hooks/use-leading-animation.js +44 -0
- package/lib/module/hooks/use-leading-animation.js.map +1 -0
- package/lib/module/hooks/use-morph-motion.js +3 -1
- package/lib/module/hooks/use-morph-motion.js.map +1 -1
- package/lib/module/index.js +35 -6
- package/lib/module/index.js.map +1 -1
- package/lib/module/motion/preset-map.js +5 -0
- package/lib/module/motion/preset-map.js.map +1 -1
- package/lib/module/view/leading-element.js +32 -0
- package/lib/module/view/leading-element.js.map +1 -0
- package/lib/module/view/morph-viewport.js +28 -2
- package/lib/module/view/morph-viewport.js.map +1 -1
- package/lib/module/view/number-run.js +70 -23
- package/lib/module/view/number-run.js.map +1 -1
- package/lib/module/view/slot-shadow.js +72 -0
- package/lib/module/view/slot-shadow.js.map +1 -0
- package/lib/module/view/slots-run.js +111 -42
- package/lib/module/view/slots-run.js.map +1 -1
- package/lib/module/view/text-run.js +14 -25
- package/lib/module/view/text-run.js.map +1 -1
- package/lib/module/view/ticker-run.js +121 -0
- package/lib/module/view/ticker-run.js.map +1 -0
- package/lib/typescript/commonjs/hooks/use-inline-auto-width.d.ts.map +1 -1
- package/lib/typescript/commonjs/hooks/use-leading-animation.d.ts +16 -0
- package/lib/typescript/commonjs/hooks/use-leading-animation.d.ts.map +1 -0
- package/lib/typescript/commonjs/hooks/use-morph-motion.d.ts +3 -2
- package/lib/typescript/commonjs/hooks/use-morph-motion.d.ts.map +1 -1
- package/lib/typescript/commonjs/index.d.ts +1 -1
- package/lib/typescript/commonjs/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/motion/preset-map.d.ts.map +1 -1
- package/lib/typescript/commonjs/types.d.ts +14 -2
- package/lib/typescript/commonjs/types.d.ts.map +1 -1
- package/lib/typescript/commonjs/view/leading-element.d.ts +14 -0
- package/lib/typescript/commonjs/view/leading-element.d.ts.map +1 -0
- package/lib/typescript/commonjs/view/morph-viewport.d.ts +4 -1
- package/lib/typescript/commonjs/view/morph-viewport.d.ts.map +1 -1
- package/lib/typescript/commonjs/view/number-run.d.ts +6 -2
- package/lib/typescript/commonjs/view/number-run.d.ts.map +1 -1
- package/lib/typescript/commonjs/view/slot-shadow.d.ts +11 -0
- package/lib/typescript/commonjs/view/slot-shadow.d.ts.map +1 -0
- package/lib/typescript/commonjs/view/slots-run.d.ts +8 -3
- package/lib/typescript/commonjs/view/slots-run.d.ts.map +1 -1
- package/lib/typescript/commonjs/view/text-run.d.ts.map +1 -1
- package/lib/typescript/commonjs/view/ticker-run.d.ts +21 -0
- package/lib/typescript/commonjs/view/ticker-run.d.ts.map +1 -0
- package/lib/typescript/module/hooks/use-inline-auto-width.d.ts.map +1 -1
- package/lib/typescript/module/hooks/use-leading-animation.d.ts +16 -0
- package/lib/typescript/module/hooks/use-leading-animation.d.ts.map +1 -0
- package/lib/typescript/module/hooks/use-morph-motion.d.ts +3 -2
- package/lib/typescript/module/hooks/use-morph-motion.d.ts.map +1 -1
- package/lib/typescript/module/index.d.ts +1 -1
- package/lib/typescript/module/index.d.ts.map +1 -1
- package/lib/typescript/module/motion/preset-map.d.ts.map +1 -1
- package/lib/typescript/module/types.d.ts +14 -2
- package/lib/typescript/module/types.d.ts.map +1 -1
- package/lib/typescript/module/view/leading-element.d.ts +14 -0
- package/lib/typescript/module/view/leading-element.d.ts.map +1 -0
- package/lib/typescript/module/view/morph-viewport.d.ts +4 -1
- package/lib/typescript/module/view/morph-viewport.d.ts.map +1 -1
- package/lib/typescript/module/view/number-run.d.ts +6 -2
- package/lib/typescript/module/view/number-run.d.ts.map +1 -1
- package/lib/typescript/module/view/slot-shadow.d.ts +11 -0
- package/lib/typescript/module/view/slot-shadow.d.ts.map +1 -0
- package/lib/typescript/module/view/slots-run.d.ts +8 -3
- package/lib/typescript/module/view/slots-run.d.ts.map +1 -1
- package/lib/typescript/module/view/text-run.d.ts.map +1 -1
- package/lib/typescript/module/view/ticker-run.d.ts +21 -0
- package/lib/typescript/module/view/ticker-run.d.ts.map +1 -0
- package/package.json +3 -1
- package/src/hooks/use-inline-auto-width.ts +33 -1
- package/src/hooks/use-leading-animation.ts +74 -0
- package/src/hooks/use-morph-motion.ts +10 -1
- package/src/index.tsx +44 -6
- package/src/motion/preset-map.ts +5 -0
- package/src/types.ts +17 -2
- package/src/view/leading-element.tsx +45 -0
- package/src/view/morph-viewport.tsx +39 -1
- package/src/view/number-run.tsx +94 -26
- package/src/view/slot-shadow.tsx +99 -0
- package/src/view/slots-run.tsx +163 -58
- package/src/view/text-run.tsx +14 -51
- package/src/view/ticker-run.tsx +167 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireWildcard","require","
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_useTextGlyphs","_useLeadingAnimation","_glyphRun","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","TextRun","exports","React","memo","value","motionRecipe","align","leading","leadingLayoutGroup","leadingKey","leadingGap","ready","textStyle","className","scopeId","useId","hasDisplayedRef","useRef","displayedValueRef","displayedLeadingRef","displayedLeadingKeyRef","displayedLeadingGapRef","shouldDisplayTarget","current","visibleValue","visibleLeading","visibleLeadingKey","visibleLeadingGap","lastValueRef","hasAnimatedRef","elementEnterTransition","elementExitTransition","isLeadingChange","isLeadingSwap","useLeadingAnimation","glyphs","useTextGlyphs","hasAnimated","jsx","GlyphRun","layoutTransition","undefined","leadingLayoutTransition","enterTransition","exitTransition","displayName"],"sourceRoot":"../../../src","sources":["view/text-run.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,127 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.TickerRun = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
var _reactNativeReanimated = _interopRequireDefault(require("react-native-reanimated"));
|
|
10
|
+
var _useLeadingAnimation = require("../hooks/use-leading-animation");
|
|
11
|
+
var _useNumericLanes = require("../hooks/use-numeric-lanes");
|
|
12
|
+
var _displayUnits = require("../model/display-units");
|
|
13
|
+
var _leadingElement = require("./leading-element");
|
|
14
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
15
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
16
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
17
|
+
const rowStyle = {
|
|
18
|
+
flexDirection: "row",
|
|
19
|
+
alignItems: "center",
|
|
20
|
+
alignSelf: "flex-start"
|
|
21
|
+
};
|
|
22
|
+
|
|
23
|
+
// The wrapper owns the changing layout box. Keeping the Text itself out of
|
|
24
|
+
// the layout transition prevents a newly rendered glyph from being clipped by
|
|
25
|
+
// the previous glyph's narrower bounds.
|
|
26
|
+
const glyphSlotStyle = {
|
|
27
|
+
alignSelf: "flex-start"
|
|
28
|
+
};
|
|
29
|
+
const rowAlignStyles = {
|
|
30
|
+
left: {
|
|
31
|
+
alignSelf: "flex-start"
|
|
32
|
+
},
|
|
33
|
+
center: {
|
|
34
|
+
alignSelf: "center"
|
|
35
|
+
},
|
|
36
|
+
right: {
|
|
37
|
+
alignSelf: "flex-end"
|
|
38
|
+
}
|
|
39
|
+
};
|
|
40
|
+
// Render the data-ticker behavior from the reference: stable inline lanes and
|
|
41
|
+
// crisp in-place replacements. There is deliberately no reel, vertical travel,
|
|
42
|
+
// opacity fade, or viewport mask in this renderer.
|
|
43
|
+
const TickerRun = exports.TickerRun = /*#__PURE__*/_react.default.memo(({
|
|
44
|
+
value,
|
|
45
|
+
motionRecipe,
|
|
46
|
+
align,
|
|
47
|
+
textStyle,
|
|
48
|
+
className,
|
|
49
|
+
leading,
|
|
50
|
+
leadingKey,
|
|
51
|
+
leadingGap = 0,
|
|
52
|
+
ready = true
|
|
53
|
+
}) => {
|
|
54
|
+
const hasDisplayedRef = (0, _react.useRef)(false);
|
|
55
|
+
const displayedValueRef = (0, _react.useRef)(value);
|
|
56
|
+
const displayedLeadingRef = (0, _react.useRef)(leading);
|
|
57
|
+
const displayedLeadingKeyRef = (0, _react.useRef)(leadingKey);
|
|
58
|
+
const displayedLeadingGapRef = (0, _react.useRef)(leadingGap);
|
|
59
|
+
const shouldDisplayTarget = ready || !hasDisplayedRef.current;
|
|
60
|
+
const visibleValue = shouldDisplayTarget ? value : displayedValueRef.current;
|
|
61
|
+
const visibleLeading = shouldDisplayTarget ? leading : displayedLeadingRef.current;
|
|
62
|
+
const visibleLeadingKey = shouldDisplayTarget ? leadingKey : displayedLeadingKeyRef.current;
|
|
63
|
+
const visibleLeadingGap = shouldDisplayTarget ? leadingGap : displayedLeadingGapRef.current;
|
|
64
|
+
if (shouldDisplayTarget) {
|
|
65
|
+
hasDisplayedRef.current = true;
|
|
66
|
+
displayedValueRef.current = value;
|
|
67
|
+
displayedLeadingRef.current = leading;
|
|
68
|
+
displayedLeadingKeyRef.current = leadingKey;
|
|
69
|
+
displayedLeadingGapRef.current = leadingGap;
|
|
70
|
+
}
|
|
71
|
+
const {
|
|
72
|
+
elementEnterTransition,
|
|
73
|
+
elementExitTransition,
|
|
74
|
+
isLeadingChange,
|
|
75
|
+
isLeadingSwap
|
|
76
|
+
} = (0, _useLeadingAnimation.useLeadingAnimation)({
|
|
77
|
+
leading: visibleLeading,
|
|
78
|
+
leadingKey: visibleLeadingKey,
|
|
79
|
+
leadingGap: visibleLeadingGap,
|
|
80
|
+
motionRecipe
|
|
81
|
+
});
|
|
82
|
+
const {
|
|
83
|
+
units,
|
|
84
|
+
leadLength
|
|
85
|
+
} = (0, _useNumericLanes.useNumericLanes)(visibleValue);
|
|
86
|
+
const lastValueRef = (0, _react.useRef)(visibleValue);
|
|
87
|
+
const hasAnimatedRef = (0, _react.useRef)(false);
|
|
88
|
+
if (visibleValue !== lastValueRef.current || isLeadingChange) {
|
|
89
|
+
hasAnimatedRef.current = true;
|
|
90
|
+
lastValueRef.current = visibleValue;
|
|
91
|
+
}
|
|
92
|
+
const hasAnimated = hasAnimatedRef.current;
|
|
93
|
+
const bodyLength = Math.max(units.length - leadLength, 0);
|
|
94
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
|
|
95
|
+
style: [rowStyle, rowAlignStyles[align]],
|
|
96
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_leadingElement.LeadingElement, {
|
|
97
|
+
leading: visibleLeading,
|
|
98
|
+
leadingKey: visibleLeadingKey,
|
|
99
|
+
leadingGap: visibleLeadingGap,
|
|
100
|
+
enterTransition: hasAnimated ? motionRecipe.enterTransition : undefined,
|
|
101
|
+
elementEnterTransition: isLeadingSwap ? elementEnterTransition : undefined,
|
|
102
|
+
exitTransition: motionRecipe.exitTransition,
|
|
103
|
+
elementExitTransition: elementExitTransition
|
|
104
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
|
|
105
|
+
layout: isLeadingChange ? motionRecipe.layoutTransition : undefined,
|
|
106
|
+
style: rowStyle,
|
|
107
|
+
children: units.map((unit, index) => {
|
|
108
|
+
const inLead = index < leadLength;
|
|
109
|
+
const bodyIndex = index - leadLength;
|
|
110
|
+
const isDigit = !inLead && (0, _displayUnits.isAsciiDigit)(unit);
|
|
111
|
+
const laneKey = inLead ? `flow:lead:${index}` : `flow:${bodyLength - 1 - bodyIndex}`;
|
|
112
|
+
const unitKey = isDigit ? laneKey : `${laneKey}:${unit}`;
|
|
113
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
|
|
114
|
+
layout: hasAnimated ? motionRecipe.layoutTransition : undefined,
|
|
115
|
+
style: glyphSlotStyle,
|
|
116
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.Text, {
|
|
117
|
+
style: textStyle,
|
|
118
|
+
className: className,
|
|
119
|
+
children: unit
|
|
120
|
+
})
|
|
121
|
+
}, unitKey);
|
|
122
|
+
})
|
|
123
|
+
})]
|
|
124
|
+
});
|
|
125
|
+
});
|
|
126
|
+
TickerRun.displayName = "TickerRun";
|
|
127
|
+
//# sourceMappingURL=ticker-run.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeReanimated","_interopRequireDefault","_useLeadingAnimation","_useNumericLanes","_displayUnits","_leadingElement","_jsxRuntime","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","rowStyle","flexDirection","alignItems","alignSelf","glyphSlotStyle","rowAlignStyles","left","center","right","TickerRun","exports","React","memo","value","motionRecipe","align","textStyle","className","leading","leadingKey","leadingGap","ready","hasDisplayedRef","useRef","displayedValueRef","displayedLeadingRef","displayedLeadingKeyRef","displayedLeadingGapRef","shouldDisplayTarget","current","visibleValue","visibleLeading","visibleLeadingKey","visibleLeadingGap","elementEnterTransition","elementExitTransition","isLeadingChange","isLeadingSwap","useLeadingAnimation","units","leadLength","useNumericLanes","lastValueRef","hasAnimatedRef","hasAnimated","bodyLength","Math","max","length","jsxs","View","style","children","jsx","LeadingElement","enterTransition","undefined","exitTransition","layout","layoutTransition","map","unit","index","inLead","bodyIndex","isDigit","isAsciiDigit","laneKey","unitKey","Text","displayName"],"sourceRoot":"../../../src","sources":["view/ticker-run.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -15,12 +15,18 @@ export const useInlineAutoWidth = ({
|
|
|
15
15
|
const measuredWidthRef = useRef(null);
|
|
16
16
|
const bootstrappedRef = useRef(false);
|
|
17
17
|
const widthCacheRef = useRef(new Map());
|
|
18
|
+
const firstEnabledMeasurementKeyRef = useRef(null);
|
|
18
19
|
const hasCapturedVisibleLayoutRef = useRef(false);
|
|
19
20
|
const initialMeasurementKeyRef = useRef(null);
|
|
20
21
|
const firstProbeRef = useRef(null);
|
|
21
22
|
const latestProbeRef = useRef(null);
|
|
22
23
|
const bootstrapTimerRef = useRef(null);
|
|
23
24
|
const [readyMeasurementKey, setReadyMeasurementKey] = useState(null);
|
|
25
|
+
|
|
26
|
+
// latch the first enabled key so a pending visible layout cannot use a later key
|
|
27
|
+
if (enabled && firstEnabledMeasurementKeyRef.current === null) {
|
|
28
|
+
firstEnabledMeasurementKeyRef.current = measurementKey;
|
|
29
|
+
}
|
|
24
30
|
const markMeasurementReady = useCallback(key => {
|
|
25
31
|
setReadyMeasurementKey(currentKey => currentKey === key ? currentKey : key);
|
|
26
32
|
}, []);
|
|
@@ -75,11 +81,28 @@ export const useInlineAutoWidth = ({
|
|
|
75
81
|
// bootstrap from the visible tree so the first explicit width matches
|
|
76
82
|
// the geometry that was already painted to the user
|
|
77
83
|
const nextWidth = Math.max(0, event.nativeEvent.layout.width);
|
|
84
|
+
const firstEnabledMeasurementKey = firstEnabledMeasurementKeyRef.current;
|
|
85
|
+
const visibleKeyMatchesInitialKey = firstEnabledMeasurementKey === null || firstEnabledMeasurementKey === measurementKey;
|
|
86
|
+
const firstProbe = firstProbeRef.current;
|
|
87
|
+
if (!visibleKeyMatchesInitialKey) {
|
|
88
|
+
// ignore a visible layout from the initial row when the key has changed
|
|
89
|
+
const currentProbeWidth = firstProbe?.key === measurementKey ? firstProbe.width : widthCacheRef.current.get(measurementKey);
|
|
90
|
+
if (currentProbeWidth !== undefined) {
|
|
91
|
+
initialMeasurementKeyRef.current = measurementKey;
|
|
92
|
+
applyWidth(currentProbeWidth);
|
|
93
|
+
markMeasurementReady(measurementKey);
|
|
94
|
+
} else if (firstProbe) {
|
|
95
|
+
// use the old probe as the shell baseline until the current key is measured
|
|
96
|
+
initialMeasurementKeyRef.current = firstProbe.key;
|
|
97
|
+
applyWidth(firstProbe.width);
|
|
98
|
+
}
|
|
99
|
+
return;
|
|
100
|
+
}
|
|
101
|
+
|
|
78
102
|
// retain the visible width for the initial key so a later cache hit does
|
|
79
103
|
// not reintroduce the probe-to-visible mismatch
|
|
80
104
|
widthCacheRef.current.delete(measurementKey);
|
|
81
105
|
widthCacheRef.current.set(measurementKey, nextWidth);
|
|
82
|
-
const firstProbe = firstProbeRef.current;
|
|
83
106
|
if (firstProbe && firstProbe.key !== measurementKey) {
|
|
84
107
|
initialMeasurementKeyRef.current = firstProbe.key;
|
|
85
108
|
applyWidth(firstProbe.width);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useCallback","useEffect","useLayoutEffect","useRef","useState","useAnimatedStyle","useSharedValue","WIDTH_CACHE_LIMIT","useInlineAutoWidth","enabled","driveToWidth","measurementKey","widthValue","hasBootstrappedWidth","measuredWidthRef","bootstrappedRef","widthCacheRef","Map","hasCapturedVisibleLayoutRef","initialMeasurementKeyRef","firstProbeRef","latestProbeRef","bootstrapTimerRef","readyMeasurementKey","setReadyMeasurementKey","markMeasurementReady","key","currentKey","applyWidth","nextWidth","
|
|
1
|
+
{"version":3,"names":["useCallback","useEffect","useLayoutEffect","useRef","useState","useAnimatedStyle","useSharedValue","WIDTH_CACHE_LIMIT","useInlineAutoWidth","enabled","driveToWidth","measurementKey","widthValue","hasBootstrappedWidth","measuredWidthRef","bootstrappedRef","widthCacheRef","Map","firstEnabledMeasurementKeyRef","hasCapturedVisibleLayoutRef","initialMeasurementKeyRef","firstProbeRef","latestProbeRef","bootstrapTimerRef","readyMeasurementKey","setReadyMeasurementKey","current","markMeasurementReady","key","currentKey","applyWidth","nextWidth","value","bootstrapFromProbe","firstProbe","width","latestProbe","captureVisibleLayout","event","clearTimeout","Math","max","nativeEvent","layout","firstEnabledMeasurementKey","visibleKeyMatchesInitialKey","currentProbeWidth","get","undefined","delete","set","captureLayout","ceil","isInitialMeasurement","size","oldestKey","keys","next","probe","setTimeout","cachedWidth","animatedWidthStyle","isReady","shouldMeasure"],"sourceRoot":"../../../src","sources":["hooks/use-inline-auto-width.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useLayoutEffect, useMemo, useRef } from "react";
|
|
4
|
+
import { useSharedValue } from "react-native-reanimated";
|
|
5
|
+
import { createLeadingEnterTransition, createLeadingExitTransition } from "../motion/entry-exit-builders.js";
|
|
6
|
+
// keep leading presence and replacement motion consistent across every content variant
|
|
7
|
+
export const useLeadingAnimation = ({
|
|
8
|
+
leading,
|
|
9
|
+
leadingKey,
|
|
10
|
+
leadingGap,
|
|
11
|
+
motionRecipe
|
|
12
|
+
}) => {
|
|
13
|
+
const lastLeadingPresenceRef = useRef(Boolean(leading));
|
|
14
|
+
const lastLeadingKeyRef = useRef(leadingKey);
|
|
15
|
+
const isLeadingSwap = Boolean(leading) && lastLeadingPresenceRef.current && leadingKey !== lastLeadingKeyRef.current;
|
|
16
|
+
const isLeadingChange = Boolean(leading) !== lastLeadingPresenceRef.current || Boolean(leading) && leadingKey !== lastLeadingKeyRef.current;
|
|
17
|
+
const leadingSwapProgress = useSharedValue(0);
|
|
18
|
+
|
|
19
|
+
// update the worklet flag after commit so render never writes a shared value
|
|
20
|
+
useLayoutEffect(() => {
|
|
21
|
+
leadingSwapProgress.value = isLeadingSwap ? 1 : 0;
|
|
22
|
+
}, [isLeadingSwap, leadingSwapProgress]);
|
|
23
|
+
const elementEnterTransition = useMemo(() => createLeadingEnterTransition({
|
|
24
|
+
durationMs: motionRecipe.durationMs,
|
|
25
|
+
easing: motionRecipe.easing
|
|
26
|
+
}), [motionRecipe.durationMs, motionRecipe.easing]);
|
|
27
|
+
const elementExitTransition = useMemo(() => createLeadingExitTransition({
|
|
28
|
+
durationMs: motionRecipe.durationMs,
|
|
29
|
+
easing: motionRecipe.easing,
|
|
30
|
+
leadingGap,
|
|
31
|
+
scale: leadingSwapProgress
|
|
32
|
+
}), [leadingGap, leadingSwapProgress, motionRecipe.durationMs, motionRecipe.easing]);
|
|
33
|
+
if (isLeadingChange) {
|
|
34
|
+
lastLeadingPresenceRef.current = Boolean(leading);
|
|
35
|
+
lastLeadingKeyRef.current = leadingKey;
|
|
36
|
+
}
|
|
37
|
+
return {
|
|
38
|
+
elementEnterTransition,
|
|
39
|
+
elementExitTransition,
|
|
40
|
+
isLeadingChange,
|
|
41
|
+
isLeadingSwap
|
|
42
|
+
};
|
|
43
|
+
};
|
|
44
|
+
//# sourceMappingURL=use-leading-animation.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useLayoutEffect","useMemo","useRef","useSharedValue","createLeadingEnterTransition","createLeadingExitTransition","useLeadingAnimation","leading","leadingKey","leadingGap","motionRecipe","lastLeadingPresenceRef","Boolean","lastLeadingKeyRef","isLeadingSwap","current","isLeadingChange","leadingSwapProgress","value","elementEnterTransition","durationMs","easing","elementExitTransition","scale"],"sourceRoot":"../../../src","sources":["hooks/use-leading-animation.ts"],"mappings":";;AAAA,SAASA,eAAe,EAAEC,OAAO,EAAEC,MAAM,QAAwB,OAAO;AACxE,SAASC,cAAc,QAAQ,yBAAyB;AACxD,SACEC,4BAA4B,EAC5BC,2BAA2B,QACtB,kCAA+B;AAUtC;AACA,OAAO,MAAMC,mBAAmB,GAAGA,CAAC;EAClCC,OAAO;EACPC,UAAU;EACVC,UAAU;EACVC;AACyB,CAAC,KAAK;EAC/B,MAAMC,sBAAsB,GAAGT,MAAM,CAACU,OAAO,CAACL,OAAO,CAAC,CAAC;EACvD,MAAMM,iBAAiB,GAAGX,MAAM,CAACM,UAAU,CAAC;EAC5C,MAAMM,aAAa,GACjBF,OAAO,CAACL,OAAO,CAAC,IAChBI,sBAAsB,CAACI,OAAO,IAC9BP,UAAU,KAAKK,iBAAiB,CAACE,OAAO;EAC1C,MAAMC,eAAe,GACnBJ,OAAO,CAACL,OAAO,CAAC,KAAKI,sBAAsB,CAACI,OAAO,IAClDH,OAAO,CAACL,OAAO,CAAC,IAAIC,UAAU,KAAKK,iBAAiB,CAACE,OAAQ;EAChE,MAAME,mBAAmB,GAAGd,cAAc,CAAC,CAAC,CAAC;;EAE7C;EACAH,eAAe,CAAC,MAAM;IACpBiB,mBAAmB,CAACC,KAAK,GAAGJ,aAAa,GAAG,CAAC,GAAG,CAAC;EACnD,CAAC,EAAE,CAACA,aAAa,EAAEG,mBAAmB,CAAC,CAAC;EAExC,MAAME,sBAAsB,GAAGlB,OAAO,CACpC,MACEG,4BAA4B,CAAC;IAC3BgB,UAAU,EAAEV,YAAY,CAACU,UAAU;IACnCC,MAAM,EAAEX,YAAY,CAACW;EACvB,CAAC,CAAC,EACJ,CAACX,YAAY,CAACU,UAAU,EAAEV,YAAY,CAACW,MAAM,CAC/C,CAAC;EACD,MAAMC,qBAAqB,GAAGrB,OAAO,CACnC,MACEI,2BAA2B,CAAC;IAC1Be,UAAU,EAAEV,YAAY,CAACU,UAAU;IACnCC,MAAM,EAAEX,YAAY,CAACW,MAAM;IAC3BZ,UAAU;IACVc,KAAK,EAAEN;EACT,CAAC,CAAC,EACJ,CACER,UAAU,EACVQ,mBAAmB,EACnBP,YAAY,CAACU,UAAU,EACvBV,YAAY,CAACW,MAAM,CAEvB,CAAC;EAED,IAAIL,eAAe,EAAE;IACnBL,sBAAsB,CAACI,OAAO,GAAGH,OAAO,CAACL,OAAO,CAAC;IACjDM,iBAAiB,CAACE,OAAO,GAAGP,UAAU;EACxC;EAEA,OAAO;IACLW,sBAAsB;IACtBG,qBAAqB;IACrBN,eAAe;IACfF;EACF,CAAC;AACH,CAAC","ignoreList":[]}
|
|
@@ -5,12 +5,14 @@ import { resolveMotionRecipe } from "../motion/preset-map.js";
|
|
|
5
5
|
// resolve one motion recipe and one shared stagger unit for a render tree
|
|
6
6
|
export const useMorphMotion = ({
|
|
7
7
|
variant,
|
|
8
|
+
numberMode,
|
|
8
9
|
animationPreset,
|
|
9
10
|
animationDuration,
|
|
10
11
|
stagger
|
|
11
12
|
}) => {
|
|
13
|
+
const isTicker = variant === "number" && numberMode === "ticker";
|
|
12
14
|
// numeric variants need a quicker default because their lanes update often
|
|
13
|
-
const resolvedPreset = animationPreset ?? (variant === "text" ? "default" : "snappy");
|
|
15
|
+
const resolvedPreset = animationPreset ?? (isTicker ? "ticker" : variant === "text" ? "default" : "snappy");
|
|
14
16
|
const motionRecipe = useMemo(() => resolveMotionRecipe(resolvedPreset, animationDuration), [animationDuration, resolvedPreset]);
|
|
15
17
|
return {
|
|
16
18
|
motionRecipe,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useMemo","resolveMotionRecipe","useMorphMotion","variant","animationPreset","animationDuration","stagger","resolvedPreset","motionRecipe","staggerMs","Math","round"],"sourceRoot":"../../../src","sources":["hooks/use-morph-motion.ts"],"mappings":";;AAAA,SAASA,OAAO,QAAQ,OAAO;AAC/B,SAASC,mBAAmB,QAAQ,yBAAsB;
|
|
1
|
+
{"version":3,"names":["useMemo","resolveMotionRecipe","useMorphMotion","variant","numberMode","animationPreset","animationDuration","stagger","isTicker","resolvedPreset","motionRecipe","staggerMs","Math","round"],"sourceRoot":"../../../src","sources":["hooks/use-morph-motion.ts"],"mappings":";;AAAA,SAASA,OAAO,QAAQ,OAAO;AAC/B,SAASC,mBAAmB,QAAQ,yBAAsB;AAqB1D;AACA,OAAO,MAAMC,cAAc,GAAGA,CAAC;EAC7BC,OAAO;EACPC,UAAU;EACVC,eAAe;EACfC,iBAAiB;EACjBC;AACM,CAAC,KAAkB;EACzB,MAAMC,QAAQ,GAAGL,OAAO,KAAK,QAAQ,IAAIC,UAAU,KAAK,QAAQ;EAChE;EACA,MAAMK,cAAc,GAClBJ,eAAe,KACdG,QAAQ,GACL,QAAQ,GACRL,OAAO,KAAK,MAAM,GAChB,SAAS,GACT,QAAQ,CAAC;EAEjB,MAAMO,YAAY,GAAGV,OAAO,CAC1B,MAAMC,mBAAmB,CAACQ,cAAc,EAAEH,iBAAiB,CAAC,EAC5D,CAACA,iBAAiB,EAAEG,cAAc,CACpC,CAAC;EAED,OAAO;IACLC,YAAY;IACZC,SAAS,EAAEC,IAAI,CAACC,KAAK,CAACN,OAAO,GAAG,IAAI;EACtC,CAAC;AACH,CAAC","ignoreList":[]}
|
package/lib/module/index.js
CHANGED
|
@@ -9,6 +9,7 @@ import { normalizeDisplayUnit, splitDisplayUnits } from "./model/display-units.j
|
|
|
9
9
|
import { MorphViewport } from "./view/morph-viewport.js";
|
|
10
10
|
import { NumberRun } from "./view/number-run.js";
|
|
11
11
|
import { SlotsRun } from "./view/slots-run.js";
|
|
12
|
+
import { TickerRun } from "./view/ticker-run.js";
|
|
12
13
|
import { TextRun } from "./view/text-run.js";
|
|
13
14
|
|
|
14
15
|
// choose the content variant and connect it to the shared viewport and measurement flow
|
|
@@ -23,12 +24,14 @@ export const Laminar = /*#__PURE__*/React.memo(function Laminar({
|
|
|
23
24
|
leading,
|
|
24
25
|
leadingKey,
|
|
25
26
|
leadingGap = 0,
|
|
27
|
+
numberMode = "morph",
|
|
28
|
+
shadow = false,
|
|
26
29
|
style,
|
|
27
30
|
containerStyle,
|
|
28
31
|
fontStyle,
|
|
29
32
|
animationDuration,
|
|
30
33
|
animationPreset,
|
|
31
|
-
stagger
|
|
34
|
+
stagger,
|
|
32
35
|
autoSize = true,
|
|
33
36
|
clipToBounds = false
|
|
34
37
|
}) {
|
|
@@ -37,14 +40,17 @@ export const Laminar = /*#__PURE__*/React.memo(function Laminar({
|
|
|
37
40
|
const leadingMap = isLeadingMap(leading) ? leading : undefined;
|
|
38
41
|
const resolvedLeading = leadingMap ? leadingMap[resolvedValue] : leading;
|
|
39
42
|
const resolvedLeadingKey = leadingMap ? resolvedValue : leadingKey;
|
|
43
|
+
const resolvedStagger = stagger ?? (variant === "number" && numberMode === "ticker" ? 0 : 0.02);
|
|
44
|
+
const useLayoutAutoSize = autoSize && variant === "number" && numberMode === "ticker";
|
|
40
45
|
const {
|
|
41
46
|
motionRecipe,
|
|
42
47
|
staggerMs
|
|
43
48
|
} = useMorphMotion({
|
|
44
49
|
variant,
|
|
50
|
+
numberMode,
|
|
45
51
|
animationPreset,
|
|
46
52
|
animationDuration,
|
|
47
|
-
stagger
|
|
53
|
+
stagger: resolvedStagger
|
|
48
54
|
});
|
|
49
55
|
const {
|
|
50
56
|
textStyle
|
|
@@ -58,7 +64,7 @@ export const Laminar = /*#__PURE__*/React.memo(function Laminar({
|
|
|
58
64
|
// invalidate the probe when text style, leading content, or leading spacing changes
|
|
59
65
|
const measurementKey = React.useMemo(() => {
|
|
60
66
|
const flattenedStyle = StyleSheet.flatten(textStyle);
|
|
61
|
-
return JSON.stringify([resolvedValue, flattenedStyle?.fontFamily, flattenedStyle?.fontSize, flattenedStyle?.fontStyle, flattenedStyle?.fontWeight, flattenedStyle?.fontVariant, flattenedStyle?.letterSpacing, flattenedStyle?.lineHeight, flattenedStyle?.textTransform,
|
|
67
|
+
return JSON.stringify([resolvedValue, flattenedStyle?.fontFamily, flattenedStyle?.fontSize, flattenedStyle?.fontStyle, flattenedStyle?.fontWeight, flattenedStyle?.fontVariant, flattenedStyle?.letterSpacing, flattenedStyle?.lineHeight, flattenedStyle?.textTransform, Boolean(resolvedLeading), resolvedLeadingKey, leadingGap]);
|
|
62
68
|
}, [leadingGap, resolvedLeading, resolvedLeadingKey, resolvedValue, textStyle, variant]);
|
|
63
69
|
const {
|
|
64
70
|
captureLayout,
|
|
@@ -84,6 +90,7 @@ export const Laminar = /*#__PURE__*/React.memo(function Laminar({
|
|
|
84
90
|
align: align,
|
|
85
91
|
containerStyle: containerStyle,
|
|
86
92
|
animatedWidthStyle: animatedWidthStyle,
|
|
93
|
+
autoSizeLayoutTransition: useLayoutAutoSize ? motionRecipe.layoutTransition : undefined,
|
|
87
94
|
onVisibleLayout: autoSize ? captureVisibleLayout : undefined,
|
|
88
95
|
measurement: shouldMeasure ? /*#__PURE__*/_jsxs(View, {
|
|
89
96
|
onLayout: captureLayout,
|
|
@@ -91,7 +98,7 @@ export const Laminar = /*#__PURE__*/React.memo(function Laminar({
|
|
|
91
98
|
flexDirection: "row",
|
|
92
99
|
alignSelf: "flex-start"
|
|
93
100
|
},
|
|
94
|
-
children: [
|
|
101
|
+
children: [resolvedLeading ? /*#__PURE__*/_jsx(View, {
|
|
95
102
|
style: {
|
|
96
103
|
alignItems: "center",
|
|
97
104
|
justifyContent: "center",
|
|
@@ -110,7 +117,25 @@ export const Laminar = /*#__PURE__*/React.memo(function Laminar({
|
|
|
110
117
|
fontSize: fontSize,
|
|
111
118
|
textStyle: textStyle,
|
|
112
119
|
staggerMs: staggerMs,
|
|
113
|
-
className: className
|
|
120
|
+
className: className,
|
|
121
|
+
leading: resolvedLeading,
|
|
122
|
+
leadingKey: resolvedLeadingKey,
|
|
123
|
+
leadingGap: leadingGap,
|
|
124
|
+
ready: !autoSize || isAutoSizeReady,
|
|
125
|
+
shadow: shadow
|
|
126
|
+
}) : variant === "number" && numberMode === "ticker" ? /*#__PURE__*/_jsx(TickerRun, {
|
|
127
|
+
value: resolvedValue,
|
|
128
|
+
motionRecipe: motionRecipe,
|
|
129
|
+
align: align,
|
|
130
|
+
fontSize: fontSize,
|
|
131
|
+
textStyle: textStyle,
|
|
132
|
+
staggerMs: staggerMs,
|
|
133
|
+
className: className,
|
|
134
|
+
leading: resolvedLeading,
|
|
135
|
+
leadingKey: resolvedLeadingKey,
|
|
136
|
+
leadingGap: leadingGap,
|
|
137
|
+
ready: !autoSize || isAutoSizeReady,
|
|
138
|
+
shadow: shadow
|
|
114
139
|
}) : variant === "number" ? /*#__PURE__*/_jsx(NumberRun, {
|
|
115
140
|
value: resolvedValue,
|
|
116
141
|
motionRecipe: motionRecipe,
|
|
@@ -118,7 +143,11 @@ export const Laminar = /*#__PURE__*/React.memo(function Laminar({
|
|
|
118
143
|
fontSize: fontSize,
|
|
119
144
|
textStyle: textStyle,
|
|
120
145
|
staggerMs: staggerMs,
|
|
121
|
-
className: className
|
|
146
|
+
className: className,
|
|
147
|
+
leading: resolvedLeading,
|
|
148
|
+
leadingKey: resolvedLeadingKey,
|
|
149
|
+
leadingGap: leadingGap,
|
|
150
|
+
ready: !autoSize || isAutoSizeReady
|
|
122
151
|
}) : /*#__PURE__*/_jsx(TextRun, {
|
|
123
152
|
value: resolvedValue,
|
|
124
153
|
motionRecipe: motionRecipe,
|
package/lib/module/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","StyleSheet","Text","View","useInlineAutoWidth","useMorphMotion","useMorphTextStyle","normalizeDisplayUnit","splitDisplayUnits","MorphViewport","NumberRun","SlotsRun","TextRun","jsx","_jsx","jsxs","_jsxs","Laminar","memo","text","variant","fontSize","color","align","className","leading","leadingKey","leadingGap","style","containerStyle","fontStyle","animationDuration","animationPreset","stagger","autoSize","clipToBounds","resolvedValue","String","leadingMap","isLeadingMap","undefined","resolvedLeading","resolvedLeadingKey","motionRecipe","staggerMs","textStyle","measurementKey","useMemo","flattenedStyle","flatten","JSON","stringify","fontFamily","fontWeight","fontVariant","letterSpacing","lineHeight","textTransform","Boolean","captureLayout","captureVisibleLayout","animatedWidthStyle","isReady","isAutoSizeReady","shouldMeasure","enabled","driveToWidth","driveNumber","measuredValue","map","join","onVisibleLayout","measurement","onLayout","flexDirection","alignSelf","children","alignItems","justifyContent","marginRight","unit","index","value","
|
|
1
|
+
{"version":3,"names":["React","StyleSheet","Text","View","useInlineAutoWidth","useMorphMotion","useMorphTextStyle","normalizeDisplayUnit","splitDisplayUnits","MorphViewport","NumberRun","SlotsRun","TickerRun","TextRun","jsx","_jsx","jsxs","_jsxs","Laminar","memo","text","variant","fontSize","color","align","className","leading","leadingKey","leadingGap","numberMode","shadow","style","containerStyle","fontStyle","animationDuration","animationPreset","stagger","autoSize","clipToBounds","resolvedValue","String","leadingMap","isLeadingMap","undefined","resolvedLeading","resolvedLeadingKey","resolvedStagger","useLayoutAutoSize","motionRecipe","staggerMs","textStyle","measurementKey","useMemo","flattenedStyle","flatten","JSON","stringify","fontFamily","fontWeight","fontVariant","letterSpacing","lineHeight","textTransform","Boolean","captureLayout","captureVisibleLayout","animatedWidthStyle","isReady","isAutoSizeReady","shouldMeasure","enabled","driveToWidth","driveNumber","measuredValue","map","join","autoSizeLayoutTransition","layoutTransition","onVisibleLayout","measurement","onLayout","flexDirection","alignSelf","children","alignItems","justifyContent","marginRight","unit","index","value","ready","leadingLayoutGroup","isValidElement","Array","isArray"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
import { Easing, LinearTransition, withDelay, withSpring, withTiming } from "react-native-reanimated";
|
|
4
4
|
// keep all presets on one curve family so layout and glyph motion agree
|
|
5
5
|
const DEFAULT_CURVE = [0.19, 1, 0.22, 1];
|
|
6
|
+
const TICKER_CURVE = [0.33, 1, 0.68, 1];
|
|
6
7
|
export const MOTION_PRESETS = {
|
|
7
8
|
default: {
|
|
8
9
|
duration: 0.38,
|
|
@@ -22,6 +23,10 @@ export const MOTION_PRESETS = {
|
|
|
22
23
|
type: "spring",
|
|
23
24
|
duration: 0.5,
|
|
24
25
|
bounce: 0.3
|
|
26
|
+
},
|
|
27
|
+
ticker: {
|
|
28
|
+
duration: 0.3,
|
|
29
|
+
ease: TICKER_CURVE
|
|
25
30
|
}
|
|
26
31
|
};
|
|
27
32
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Easing","LinearTransition","withDelay","withSpring","withTiming","DEFAULT_CURVE","MOTION_PRESETS","default","duration","ease","smooth","type","bounce","snappy","bouncy","toMilliseconds","seconds","Math","round","toDampingRatio","max","min","createOpacityTransition","fromOpacity","toOpacity","durationMs","easing","initialValues","opacity","animations","resolveMotionRecipe","presetName","durationOverride","preset","dampingRatio","bezier","layoutTransition","factory","enterTransition","exitTransition","driveNumber","toValue","delayMs","animation","overshootClamping","timingPreset","x1","y1","x2","y2"],"sourceRoot":"../../../src","sources":["motion/preset-map.ts"],"mappings":";;AAAA,SACEA,MAAM,EACNC,gBAAgB,EAGhBC,SAAS,EACTC,UAAU,EACVC,UAAU,QACL,yBAAyB;AAOhC;AACA,MAAMC,aAAa,GAAG,CAAC,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,CAAU;
|
|
1
|
+
{"version":3,"names":["Easing","LinearTransition","withDelay","withSpring","withTiming","DEFAULT_CURVE","TICKER_CURVE","MOTION_PRESETS","default","duration","ease","smooth","type","bounce","snappy","bouncy","ticker","toMilliseconds","seconds","Math","round","toDampingRatio","max","min","createOpacityTransition","fromOpacity","toOpacity","durationMs","easing","initialValues","opacity","animations","resolveMotionRecipe","presetName","durationOverride","preset","dampingRatio","bezier","layoutTransition","factory","enterTransition","exitTransition","driveNumber","toValue","delayMs","animation","overshootClamping","timingPreset","x1","y1","x2","y2"],"sourceRoot":"../../../src","sources":["motion/preset-map.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import React from "react";
|
|
4
|
+
import Animated from "react-native-reanimated";
|
|
5
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
6
|
+
// render an inline element independently so it can enter, exit, and swap beside any run
|
|
7
|
+
export const LeadingElement = /*#__PURE__*/React.memo(function LeadingElement({
|
|
8
|
+
leading,
|
|
9
|
+
leadingKey,
|
|
10
|
+
leadingGap,
|
|
11
|
+
enterTransition,
|
|
12
|
+
elementEnterTransition,
|
|
13
|
+
exitTransition,
|
|
14
|
+
elementExitTransition
|
|
15
|
+
}) {
|
|
16
|
+
if (!leading) {
|
|
17
|
+
return null;
|
|
18
|
+
}
|
|
19
|
+
return /*#__PURE__*/_jsx(Animated.View, {
|
|
20
|
+
entering: elementEnterTransition ?? enterTransition,
|
|
21
|
+
exiting: elementExitTransition ?? exitTransition,
|
|
22
|
+
style: [{
|
|
23
|
+
alignItems: "center",
|
|
24
|
+
justifyContent: "center"
|
|
25
|
+
}, leadingGap > 0 ? {
|
|
26
|
+
marginRight: leadingGap
|
|
27
|
+
} : undefined],
|
|
28
|
+
children: leading
|
|
29
|
+
}, `leading:${String(leadingKey ?? "default")}`);
|
|
30
|
+
});
|
|
31
|
+
LeadingElement.displayName = "LeadingElement";
|
|
32
|
+
//# sourceMappingURL=leading-element.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","Animated","jsx","_jsx","LeadingElement","memo","leading","leadingKey","leadingGap","enterTransition","elementEnterTransition","exitTransition","elementExitTransition","View","entering","exiting","style","alignItems","justifyContent","marginRight","undefined","children","String","displayName"],"sourceRoot":"../../../src","sources":["view/leading-element.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAA0B,OAAO;AAC7C,OAAOC,QAAQ,MAER,yBAAyB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAYjC;AACA,OAAO,MAAMC,cAAc,gBAAGJ,KAAK,CAACK,IAAI,CAAC,SAASD,cAAcA,CAAC;EAC/DE,OAAO;EACPC,UAAU;EACVC,UAAU;EACVC,eAAe;EACfC,sBAAsB;EACtBC,cAAc;EACdC;AACmB,CAAC,EAAE;EACtB,IAAI,CAACN,OAAO,EAAE;IACZ,OAAO,IAAI;EACb;EAEA,oBACEH,IAAA,CAACF,QAAQ,CAACY,IAAI;IAEZC,QAAQ,EAAEJ,sBAAsB,IAAID,eAAgB;IACpDM,OAAO,EAAEH,qBAAqB,IAAID,cAAe;IACjDK,KAAK,EAAE,CACL;MAAEC,UAAU,EAAE,QAAQ;MAAEC,cAAc,EAAE;IAAS,CAAC,EAClDV,UAAU,GAAG,CAAC,GAAG;MAAEW,WAAW,EAAEX;IAAW,CAAC,GAAGY,SAAS,CACxD;IAAAC,QAAA,EAEDf;EAAO,GARH,WAAWgB,MAAM,CAACf,UAAU,IAAI,SAAS,CAAC,EASlC,CAAC;AAEpB,CAAC,CAAC;AAEFH,cAAc,CAACmB,WAAW,GAAG,gBAAgB","ignoreList":[]}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
import React, { useMemo } from "react";
|
|
3
|
+
import React, { useMemo, useRef } from "react";
|
|
4
4
|
import { View } from "react-native";
|
|
5
5
|
import Animated from "react-native-reanimated";
|
|
6
|
-
import { jsx as _jsx,
|
|
6
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
7
7
|
const shellStyle = {
|
|
8
8
|
position: "relative",
|
|
9
9
|
alignSelf: "flex-start"
|
|
@@ -57,14 +57,40 @@ export const MorphViewport = /*#__PURE__*/React.memo(({
|
|
|
57
57
|
align,
|
|
58
58
|
containerStyle,
|
|
59
59
|
animatedWidthStyle,
|
|
60
|
+
autoSizeLayoutTransition,
|
|
60
61
|
onVisibleLayout,
|
|
61
62
|
measurement,
|
|
62
63
|
children
|
|
63
64
|
}) => {
|
|
65
|
+
const hasRenderedRef = useRef(false);
|
|
66
|
+
const shouldAnimateAutoSizeLayout = autoSizeLayoutTransition !== undefined && hasRenderedRef.current;
|
|
67
|
+
hasRenderedRef.current = true;
|
|
68
|
+
|
|
64
69
|
// compute alignment once so the animated shell and its child share one layout contract
|
|
65
70
|
const resolvedViewportStyle = useMemo(() => [viewportStyle, viewportAlignStyles[align], clipToBounds ? clippedViewportStyle : unclippedViewportStyle], [align, clipToBounds]);
|
|
66
71
|
|
|
67
72
|
// keep measurement outside the visible viewport so it cannot affect accessibility or layout
|
|
73
|
+
if (autoSizeLayoutTransition) {
|
|
74
|
+
// Layout animation owns both width and the shell's aligned x-position.
|
|
75
|
+
// This is important for center/right auto-size: animating only a child
|
|
76
|
+
// width leaves the parent anchor at its old position.
|
|
77
|
+
return /*#__PURE__*/_jsxs(Animated.View, {
|
|
78
|
+
layout: shouldAnimateAutoSizeLayout ? autoSizeLayoutTransition : undefined,
|
|
79
|
+
style: [shellStyle, shellAlignStyles[align], containerStyle],
|
|
80
|
+
children: [/*#__PURE__*/_jsx(View, {
|
|
81
|
+
accessibilityElementsHidden: true,
|
|
82
|
+
collapsable: false,
|
|
83
|
+
importantForAccessibility: "no-hide-descendants",
|
|
84
|
+
pointerEvents: "none",
|
|
85
|
+
style: measuredContentStyle,
|
|
86
|
+
children: measurement
|
|
87
|
+
}), /*#__PURE__*/_jsx(Animated.View, {
|
|
88
|
+
onLayout: onVisibleLayout,
|
|
89
|
+
style: resolvedViewportStyle,
|
|
90
|
+
children: children
|
|
91
|
+
})]
|
|
92
|
+
});
|
|
93
|
+
}
|
|
68
94
|
return /*#__PURE__*/_jsx(View, {
|
|
69
95
|
style: [shellStyle, shellAlignStyles[align], containerStyle],
|
|
70
96
|
children: autoSize ? /*#__PURE__*/_jsxs(_Fragment, {
|