react-native-laminar 1.0.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 +11 -0
- package/lib/commonjs/hooks/use-display-units.js +13 -0
- package/lib/commonjs/hooks/use-display-units.js.map +1 -0
- package/lib/commonjs/hooks/use-inline-auto-width.js +45 -0
- package/lib/commonjs/hooks/use-inline-auto-width.js.map +1 -0
- package/lib/commonjs/hooks/use-morph-motion.js +24 -0
- package/lib/commonjs/hooks/use-morph-motion.js.map +1 -0
- package/lib/commonjs/hooks/use-morph-text-style.js +32 -0
- package/lib/commonjs/hooks/use-morph-text-style.js.map +1 -0
- package/lib/commonjs/hooks/use-numeric-lanes.js +37 -0
- package/lib/commonjs/hooks/use-numeric-lanes.js.map +1 -0
- package/lib/commonjs/hooks/use-text-glyphs.js +35 -0
- package/lib/commonjs/hooks/use-text-glyphs.js.map +1 -0
- package/lib/commonjs/index.js +89 -0
- package/lib/commonjs/index.js.map +1 -0
- package/lib/commonjs/model/display-units.js +29 -0
- package/lib/commonjs/model/display-units.js.map +1 -0
- package/lib/commonjs/model/numeric-lanes.js +45 -0
- package/lib/commonjs/model/numeric-lanes.js.map +1 -0
- package/lib/commonjs/model/text-keys.js +80 -0
- package/lib/commonjs/model/text-keys.js.map +1 -0
- package/lib/commonjs/motion/entry-exit-builders.js +57 -0
- package/lib/commonjs/motion/entry-exit-builders.js.map +1 -0
- package/lib/commonjs/motion/preset-map.js +91 -0
- package/lib/commonjs/motion/preset-map.js.map +1 -0
- package/lib/commonjs/package.json +1 -0
- package/lib/commonjs/types.js +6 -0
- package/lib/commonjs/types.js.map +1 -0
- package/lib/commonjs/view/glyph-run.js +34 -0
- package/lib/commonjs/view/glyph-run.js.map +1 -0
- package/lib/commonjs/view/morph-viewport.js +64 -0
- package/lib/commonjs/view/morph-viewport.js.map +1 -0
- package/lib/commonjs/view/number-lane.js +85 -0
- package/lib/commonjs/view/number-lane.js.map +1 -0
- package/lib/commonjs/view/number-run.js +61 -0
- package/lib/commonjs/view/number-run.js.map +1 -0
- package/lib/commonjs/view/text-run.js +35 -0
- package/lib/commonjs/view/text-run.js.map +1 -0
- package/lib/module/hooks/use-display-units.js +8 -0
- package/lib/module/hooks/use-display-units.js.map +1 -0
- package/lib/module/hooks/use-inline-auto-width.js +40 -0
- package/lib/module/hooks/use-inline-auto-width.js.map +1 -0
- package/lib/module/hooks/use-morph-motion.js +19 -0
- package/lib/module/hooks/use-morph-motion.js.map +1 -0
- package/lib/module/hooks/use-morph-text-style.js +27 -0
- package/lib/module/hooks/use-morph-text-style.js.map +1 -0
- package/lib/module/hooks/use-numeric-lanes.js +32 -0
- package/lib/module/hooks/use-numeric-lanes.js.map +1 -0
- package/lib/module/hooks/use-text-glyphs.js +30 -0
- package/lib/module/hooks/use-text-glyphs.js.map +1 -0
- package/lib/module/index.js +84 -0
- package/lib/module/index.js.map +1 -0
- package/lib/module/model/display-units.js +21 -0
- package/lib/module/model/display-units.js.map +1 -0
- package/lib/module/model/numeric-lanes.js +40 -0
- package/lib/module/model/numeric-lanes.js.map +1 -0
- package/lib/module/model/text-keys.js +75 -0
- package/lib/module/model/text-keys.js.map +1 -0
- package/lib/module/motion/entry-exit-builders.js +52 -0
- package/lib/module/motion/entry-exit-builders.js.map +1 -0
- package/lib/module/motion/preset-map.js +86 -0
- package/lib/module/motion/preset-map.js.map +1 -0
- package/lib/module/package.json +1 -0
- package/lib/module/types.js +4 -0
- package/lib/module/types.js.map +1 -0
- package/lib/module/view/glyph-run.js +29 -0
- package/lib/module/view/glyph-run.js.map +1 -0
- package/lib/module/view/morph-viewport.js +58 -0
- package/lib/module/view/morph-viewport.js.map +1 -0
- package/lib/module/view/number-lane.js +79 -0
- package/lib/module/view/number-lane.js.map +1 -0
- package/lib/module/view/number-run.js +56 -0
- package/lib/module/view/number-run.js.map +1 -0
- package/lib/module/view/text-run.js +30 -0
- package/lib/module/view/text-run.js.map +1 -0
- package/lib/typescript/commonjs/hooks/use-display-units.d.ts +2 -0
- package/lib/typescript/commonjs/hooks/use-display-units.d.ts.map +1 -0
- package/lib/typescript/commonjs/hooks/use-inline-auto-width.d.ts +15 -0
- package/lib/typescript/commonjs/hooks/use-inline-auto-width.d.ts.map +1 -0
- package/lib/typescript/commonjs/hooks/use-morph-motion.d.ts +14 -0
- package/lib/typescript/commonjs/hooks/use-morph-motion.d.ts.map +1 -0
- package/lib/typescript/commonjs/hooks/use-morph-text-style.d.ts +13 -0
- package/lib/typescript/commonjs/hooks/use-morph-text-style.d.ts.map +1 -0
- package/lib/typescript/commonjs/hooks/use-numeric-lanes.d.ts +10 -0
- package/lib/typescript/commonjs/hooks/use-numeric-lanes.d.ts.map +1 -0
- package/lib/typescript/commonjs/hooks/use-text-glyphs.d.ts +3 -0
- package/lib/typescript/commonjs/hooks/use-text-glyphs.d.ts.map +1 -0
- package/lib/typescript/commonjs/index.d.ts +7 -0
- package/lib/typescript/commonjs/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/model/display-units.d.ts +5 -0
- package/lib/typescript/commonjs/model/display-units.d.ts.map +1 -0
- package/lib/typescript/commonjs/model/numeric-lanes.d.ts +9 -0
- package/lib/typescript/commonjs/model/numeric-lanes.d.ts.map +1 -0
- package/lib/typescript/commonjs/model/text-keys.d.ts +7 -0
- package/lib/typescript/commonjs/model/text-keys.d.ts.map +1 -0
- package/lib/typescript/commonjs/motion/entry-exit-builders.d.ts +15 -0
- package/lib/typescript/commonjs/motion/entry-exit-builders.d.ts.map +1 -0
- package/lib/typescript/commonjs/motion/preset-map.d.ts +4 -0
- package/lib/typescript/commonjs/motion/preset-map.d.ts.map +1 -0
- package/lib/typescript/commonjs/package.json +1 -0
- package/lib/typescript/commonjs/types.d.ts +43 -0
- package/lib/typescript/commonjs/types.d.ts.map +1 -0
- package/lib/typescript/commonjs/view/glyph-run.d.ts +12 -0
- package/lib/typescript/commonjs/view/glyph-run.d.ts.map +1 -0
- package/lib/typescript/commonjs/view/morph-viewport.d.ts +14 -0
- package/lib/typescript/commonjs/view/morph-viewport.d.ts.map +1 -0
- package/lib/typescript/commonjs/view/number-lane.d.ts +17 -0
- package/lib/typescript/commonjs/view/number-lane.d.ts.map +1 -0
- package/lib/typescript/commonjs/view/number-run.d.ts +13 -0
- package/lib/typescript/commonjs/view/number-run.d.ts.map +1 -0
- package/lib/typescript/commonjs/view/text-run.d.ts +11 -0
- package/lib/typescript/commonjs/view/text-run.d.ts.map +1 -0
- package/lib/typescript/module/hooks/use-display-units.d.ts +2 -0
- package/lib/typescript/module/hooks/use-display-units.d.ts.map +1 -0
- package/lib/typescript/module/hooks/use-inline-auto-width.d.ts +15 -0
- package/lib/typescript/module/hooks/use-inline-auto-width.d.ts.map +1 -0
- package/lib/typescript/module/hooks/use-morph-motion.d.ts +14 -0
- package/lib/typescript/module/hooks/use-morph-motion.d.ts.map +1 -0
- package/lib/typescript/module/hooks/use-morph-text-style.d.ts +13 -0
- package/lib/typescript/module/hooks/use-morph-text-style.d.ts.map +1 -0
- package/lib/typescript/module/hooks/use-numeric-lanes.d.ts +10 -0
- package/lib/typescript/module/hooks/use-numeric-lanes.d.ts.map +1 -0
- package/lib/typescript/module/hooks/use-text-glyphs.d.ts +3 -0
- package/lib/typescript/module/hooks/use-text-glyphs.d.ts.map +1 -0
- package/lib/typescript/module/index.d.ts +7 -0
- package/lib/typescript/module/index.d.ts.map +1 -0
- package/lib/typescript/module/model/display-units.d.ts +5 -0
- package/lib/typescript/module/model/display-units.d.ts.map +1 -0
- package/lib/typescript/module/model/numeric-lanes.d.ts +9 -0
- package/lib/typescript/module/model/numeric-lanes.d.ts.map +1 -0
- package/lib/typescript/module/model/text-keys.d.ts +7 -0
- package/lib/typescript/module/model/text-keys.d.ts.map +1 -0
- package/lib/typescript/module/motion/entry-exit-builders.d.ts +15 -0
- package/lib/typescript/module/motion/entry-exit-builders.d.ts.map +1 -0
- package/lib/typescript/module/motion/preset-map.d.ts +4 -0
- package/lib/typescript/module/motion/preset-map.d.ts.map +1 -0
- package/lib/typescript/module/package.json +1 -0
- package/lib/typescript/module/types.d.ts +43 -0
- package/lib/typescript/module/types.d.ts.map +1 -0
- package/lib/typescript/module/view/glyph-run.d.ts +12 -0
- package/lib/typescript/module/view/glyph-run.d.ts.map +1 -0
- package/lib/typescript/module/view/morph-viewport.d.ts +14 -0
- package/lib/typescript/module/view/morph-viewport.d.ts.map +1 -0
- package/lib/typescript/module/view/number-lane.d.ts +17 -0
- package/lib/typescript/module/view/number-lane.d.ts.map +1 -0
- package/lib/typescript/module/view/number-run.d.ts +13 -0
- package/lib/typescript/module/view/number-run.d.ts.map +1 -0
- package/lib/typescript/module/view/text-run.d.ts +11 -0
- package/lib/typescript/module/view/text-run.d.ts.map +1 -0
- package/package.json +61 -0
- package/src/hooks/use-display-units.ts +18 -0
- package/src/hooks/use-inline-auto-width.ts +57 -0
- package/src/hooks/use-morph-motion.ts +40 -0
- package/src/hooks/use-morph-text-style.ts +45 -0
- package/src/hooks/use-numeric-lanes.ts +55 -0
- package/src/hooks/use-text-glyphs.ts +56 -0
- package/src/index.tsx +98 -0
- package/src/model/display-units.ts +28 -0
- package/src/model/numeric-lanes.ts +80 -0
- package/src/model/text-keys.ts +123 -0
- package/src/motion/entry-exit-builders.ts +74 -0
- package/src/motion/preset-map.ts +127 -0
- package/src/types.ts +60 -0
- package/src/view/glyph-run.tsx +47 -0
- package/src/view/morph-viewport.tsx +83 -0
- package/src/view/number-lane.tsx +128 -0
- package/src/view/number-run.tsx +73 -0
- package/src/view/text-run.tsx +40 -0
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.resolveMotionRecipe = exports.MOTION_PRESETS = void 0;
|
|
7
|
+
var _reactNativeReanimated = require("react-native-reanimated");
|
|
8
|
+
const DEFAULT_CURVE = [0.19, 1, 0.22, 1];
|
|
9
|
+
const MOTION_PRESETS = exports.MOTION_PRESETS = {
|
|
10
|
+
default: {
|
|
11
|
+
duration: 0.38,
|
|
12
|
+
ease: DEFAULT_CURVE
|
|
13
|
+
},
|
|
14
|
+
smooth: {
|
|
15
|
+
type: "spring",
|
|
16
|
+
duration: 0.4,
|
|
17
|
+
bounce: 0
|
|
18
|
+
},
|
|
19
|
+
snappy: {
|
|
20
|
+
type: "spring",
|
|
21
|
+
duration: 0.35,
|
|
22
|
+
bounce: 0.15
|
|
23
|
+
},
|
|
24
|
+
bouncy: {
|
|
25
|
+
type: "spring",
|
|
26
|
+
duration: 0.5,
|
|
27
|
+
bounce: 0.3
|
|
28
|
+
}
|
|
29
|
+
};
|
|
30
|
+
const toMilliseconds = seconds => Math.round(seconds * 1000);
|
|
31
|
+
const toDampingRatio = bounce => Math.max(0.55, Math.min(1, 1 - bounce));
|
|
32
|
+
const createOpacityTransition = (fromOpacity, toOpacity, durationMs, easing) => {
|
|
33
|
+
return () => {
|
|
34
|
+
"worklet";
|
|
35
|
+
|
|
36
|
+
return {
|
|
37
|
+
initialValues: {
|
|
38
|
+
opacity: fromOpacity
|
|
39
|
+
},
|
|
40
|
+
animations: {
|
|
41
|
+
opacity: (0, _reactNativeReanimated.withTiming)(toOpacity, {
|
|
42
|
+
duration: durationMs,
|
|
43
|
+
easing
|
|
44
|
+
})
|
|
45
|
+
}
|
|
46
|
+
};
|
|
47
|
+
};
|
|
48
|
+
};
|
|
49
|
+
const resolveMotionRecipe = (presetName = "default", durationOverride) => {
|
|
50
|
+
const preset = MOTION_PRESETS[presetName];
|
|
51
|
+
const durationMs = durationOverride ?? toMilliseconds(preset.duration);
|
|
52
|
+
if ("type" in preset && preset.type === "spring") {
|
|
53
|
+
const dampingRatio = toDampingRatio(preset.bounce);
|
|
54
|
+
const easing = _reactNativeReanimated.Easing.bezier(...DEFAULT_CURVE);
|
|
55
|
+
return {
|
|
56
|
+
durationMs,
|
|
57
|
+
easing,
|
|
58
|
+
// keep layout on timing so width and reflow stay predictable
|
|
59
|
+
layoutTransition: _reactNativeReanimated.LinearTransition.duration(durationMs).easing(easing.factory()),
|
|
60
|
+
enterTransition: createOpacityTransition(0, 1, durationMs, easing),
|
|
61
|
+
exitTransition: createOpacityTransition(1, 0, durationMs, easing),
|
|
62
|
+
driveNumber: (toValue, delayMs = 0) => {
|
|
63
|
+
const animation = (0, _reactNativeReanimated.withSpring)(toValue, {
|
|
64
|
+
duration: durationMs,
|
|
65
|
+
dampingRatio,
|
|
66
|
+
overshootClamping: preset.bounce === 0
|
|
67
|
+
});
|
|
68
|
+
return delayMs > 0 ? (0, _reactNativeReanimated.withDelay)(delayMs, animation) : animation;
|
|
69
|
+
}
|
|
70
|
+
};
|
|
71
|
+
}
|
|
72
|
+
const timingPreset = preset;
|
|
73
|
+
const [x1, y1, x2, y2] = timingPreset.ease;
|
|
74
|
+
const easing = _reactNativeReanimated.Easing.bezier(x1, y1, x2, y2);
|
|
75
|
+
return {
|
|
76
|
+
durationMs,
|
|
77
|
+
easing,
|
|
78
|
+
layoutTransition: _reactNativeReanimated.LinearTransition.duration(durationMs).easing(easing.factory()),
|
|
79
|
+
enterTransition: createOpacityTransition(0, 1, durationMs, easing),
|
|
80
|
+
exitTransition: createOpacityTransition(1, 0, durationMs, easing),
|
|
81
|
+
driveNumber: (toValue, delayMs = 0) => {
|
|
82
|
+
const animation = (0, _reactNativeReanimated.withTiming)(toValue, {
|
|
83
|
+
duration: durationMs,
|
|
84
|
+
easing
|
|
85
|
+
});
|
|
86
|
+
return delayMs > 0 ? (0, _reactNativeReanimated.withDelay)(delayMs, animation) : animation;
|
|
87
|
+
}
|
|
88
|
+
};
|
|
89
|
+
};
|
|
90
|
+
exports.resolveMotionRecipe = resolveMotionRecipe;
|
|
91
|
+
//# sourceMappingURL=preset-map.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_reactNativeReanimated","require","DEFAULT_CURVE","MOTION_PRESETS","exports","default","duration","ease","smooth","type","bounce","snappy","bouncy","toMilliseconds","seconds","Math","round","toDampingRatio","max","min","createOpacityTransition","fromOpacity","toOpacity","durationMs","easing","initialValues","opacity","animations","withTiming","resolveMotionRecipe","presetName","durationOverride","preset","dampingRatio","Easing","bezier","layoutTransition","LinearTransition","factory","enterTransition","exitTransition","driveNumber","toValue","delayMs","animation","withSpring","overshootClamping","withDelay","timingPreset","x1","y1","x2","y2"],"sourceRoot":"../../../src","sources":["motion/preset-map.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"type":"commonjs"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":[],"sourceRoot":"../../src","sources":["types.ts"],"mappings":"","ignoreList":[]}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.GlyphRun = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
var _reactNativeReanimated = _interopRequireDefault(require("react-native-reanimated"));
|
|
10
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
12
|
+
const rowStyle = {
|
|
13
|
+
flexDirection: "row",
|
|
14
|
+
alignItems: "center",
|
|
15
|
+
alignSelf: "flex-start"
|
|
16
|
+
};
|
|
17
|
+
const GlyphRun = exports.GlyphRun = /*#__PURE__*/_react.default.memo(({
|
|
18
|
+
glyphs,
|
|
19
|
+
layoutTransition,
|
|
20
|
+
enterTransition,
|
|
21
|
+
exitTransition,
|
|
22
|
+
textStyle
|
|
23
|
+
}) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
24
|
+
style: rowStyle,
|
|
25
|
+
children: glyphs.map(glyph => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.Text, {
|
|
26
|
+
layout: layoutTransition,
|
|
27
|
+
entering: enterTransition,
|
|
28
|
+
exiting: exitTransition,
|
|
29
|
+
style: textStyle,
|
|
30
|
+
children: glyph.value
|
|
31
|
+
}, glyph.id))
|
|
32
|
+
}));
|
|
33
|
+
GlyphRun.displayName = "GlyphRun";
|
|
34
|
+
//# sourceMappingURL=glyph-run.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_reactNativeReanimated","_jsxRuntime","e","__esModule","default","rowStyle","flexDirection","alignItems","alignSelf","GlyphRun","exports","React","memo","glyphs","layoutTransition","enterTransition","exitTransition","textStyle","jsx","View","style","children","map","glyph","Text","layout","entering","exiting","value","id","displayName"],"sourceRoot":"../../../src","sources":["view/glyph-run.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,sBAAA,GAAAH,sBAAA,CAAAC,OAAA;AAA+C,IAAAG,WAAA,GAAAH,OAAA;AAAA,SAAAD,uBAAAK,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAO/C,MAAMG,QAAQ,GAAG;EACfC,aAAa,EAAE,KAAK;EACpBC,UAAU,EAAE,QAAQ;EACpBC,SAAS,EAAE;AACb,CAAU;AAEH,MAAMC,QAAQ,GAAAC,OAAA,CAAAD,QAAA,gBAAGE,cAAK,CAACC,IAAI,CAChC,CAAC;EACCC,MAAM;EACNC,gBAAgB;EAChBC,eAAe;EACfC,cAAc;EACdC;AAOD,CAAC,kBACE,IAAAhB,WAAA,CAAAiB,GAAA,EAACnB,YAAA,CAAAoB,IAAI;EAACC,KAAK,EAAEf,QAAS;EAAAgB,QAAA,EAEnBR,MAAM,CAACS,GAAG,CAAEC,KAAK,iBAChB,IAAAtB,WAAA,CAAAiB,GAAA,EAAClB,sBAAA,CAAAI,OAAQ,CAACoB,IAAI;IAEZC,MAAM,EAAEX,gBAAiB;IACzBY,QAAQ,EAAEX,eAAgB;IAC1BY,OAAO,EAAEX,cAAe;IACxBI,KAAK,EAAEH,SAAU;IAAAI,QAAA,EAEhBE,KAAK,CAACK;EAAK,GANPL,KAAK,CAACM,EAOE,CAChB;AAAC,CACE,CAEZ,CAAC;AAEDpB,QAAQ,CAACqB,WAAW,GAAG,UAAU","ignoreList":[]}
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.MorphViewport = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
var _reactNativeReanimated = _interopRequireDefault(require("react-native-reanimated"));
|
|
10
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
12
|
+
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); }
|
|
13
|
+
const shellStyle = {
|
|
14
|
+
position: "relative",
|
|
15
|
+
alignSelf: "flex-start"
|
|
16
|
+
};
|
|
17
|
+
const viewportStyle = {
|
|
18
|
+
alignSelf: "flex-start"
|
|
19
|
+
};
|
|
20
|
+
const measuredContentStyle = {
|
|
21
|
+
position: "absolute",
|
|
22
|
+
left: 0,
|
|
23
|
+
top: 0,
|
|
24
|
+
opacity: 0,
|
|
25
|
+
alignSelf: "flex-start",
|
|
26
|
+
flexShrink: 0
|
|
27
|
+
};
|
|
28
|
+
const clippedViewportStyle = {
|
|
29
|
+
overflow: "hidden"
|
|
30
|
+
};
|
|
31
|
+
const unclippedViewportStyle = {
|
|
32
|
+
overflow: "visible"
|
|
33
|
+
};
|
|
34
|
+
const MorphViewport = exports.MorphViewport = /*#__PURE__*/_react.default.memo(({
|
|
35
|
+
autoSize,
|
|
36
|
+
clipToBounds,
|
|
37
|
+
containerStyle,
|
|
38
|
+
animatedWidthStyle,
|
|
39
|
+
measurement,
|
|
40
|
+
children
|
|
41
|
+
}) => {
|
|
42
|
+
const resolvedViewportStyle = (0, _react.useMemo)(() => [viewportStyle, clipToBounds ? clippedViewportStyle : unclippedViewportStyle], [clipToBounds]);
|
|
43
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
44
|
+
style: [shellStyle, containerStyle],
|
|
45
|
+
children: autoSize ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
46
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
47
|
+
accessibilityElementsHidden: true,
|
|
48
|
+
collapsable: false,
|
|
49
|
+
importantForAccessibility: "no-hide-descendants",
|
|
50
|
+
pointerEvents: "none",
|
|
51
|
+
style: measuredContentStyle,
|
|
52
|
+
children: measurement
|
|
53
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
|
|
54
|
+
style: [resolvedViewportStyle, animatedWidthStyle],
|
|
55
|
+
children: children
|
|
56
|
+
})]
|
|
57
|
+
}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
58
|
+
style: resolvedViewportStyle,
|
|
59
|
+
children: children
|
|
60
|
+
})
|
|
61
|
+
});
|
|
62
|
+
});
|
|
63
|
+
MorphViewport.displayName = "MorphViewport";
|
|
64
|
+
//# sourceMappingURL=morph-viewport.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeReanimated","_interopRequireDefault","_jsxRuntime","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","shellStyle","position","alignSelf","viewportStyle","measuredContentStyle","left","top","opacity","flexShrink","clippedViewportStyle","overflow","unclippedViewportStyle","MorphViewport","exports","React","memo","autoSize","clipToBounds","containerStyle","animatedWidthStyle","measurement","children","resolvedViewportStyle","useMemo","jsx","View","style","jsxs","Fragment","accessibilityElementsHidden","collapsable","importantForAccessibility","pointerEvents","displayName"],"sourceRoot":"../../../src","sources":["view/morph-viewport.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.NumberLane = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
var _reactNativeReanimated = _interopRequireDefault(require("react-native-reanimated"));
|
|
10
|
+
var _displayUnits = require("../model/display-units");
|
|
11
|
+
var _entryExitBuilders = require("../motion/entry-exit-builders");
|
|
12
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
13
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
14
|
+
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); }
|
|
15
|
+
const laneStyle = {
|
|
16
|
+
position: "relative",
|
|
17
|
+
alignSelf: "flex-start"
|
|
18
|
+
};
|
|
19
|
+
const laneProbeStyle = {
|
|
20
|
+
opacity: 0
|
|
21
|
+
};
|
|
22
|
+
const laneTokenStyle = {
|
|
23
|
+
position: "absolute",
|
|
24
|
+
top: 0,
|
|
25
|
+
left: 0
|
|
26
|
+
};
|
|
27
|
+
const NumberLane = exports.NumberLane = /*#__PURE__*/_react.default.memo(({
|
|
28
|
+
unit,
|
|
29
|
+
tokenKey,
|
|
30
|
+
isLead,
|
|
31
|
+
hasAnimated,
|
|
32
|
+
delayMs,
|
|
33
|
+
direction,
|
|
34
|
+
travelDistance,
|
|
35
|
+
motionRecipe,
|
|
36
|
+
textStyle
|
|
37
|
+
}) => {
|
|
38
|
+
const usesDigitTravel = (0, _displayUnits.isAsciiDigit)(unit);
|
|
39
|
+
const verticalOffset = direction > 0 ? travelDistance : direction < 0 ? -travelDistance : 0;
|
|
40
|
+
const enterTransition = (0, _react.useMemo)(() => (0, _entryExitBuilders.createShiftTransition)({
|
|
41
|
+
delayMs,
|
|
42
|
+
durationMs: motionRecipe.durationMs,
|
|
43
|
+
easing: motionRecipe.easing,
|
|
44
|
+
fromOpacity: 0,
|
|
45
|
+
toOpacity: 1,
|
|
46
|
+
fromTranslateY: usesDigitTravel ? verticalOffset : 0,
|
|
47
|
+
toTranslateY: 0,
|
|
48
|
+
fromScale: 0.6,
|
|
49
|
+
toScale: 1
|
|
50
|
+
}), [delayMs, motionRecipe.durationMs, motionRecipe.easing, usesDigitTravel, verticalOffset]);
|
|
51
|
+
const exitTransition = (0, _react.useMemo)(() => (0, _entryExitBuilders.createShiftTransition)({
|
|
52
|
+
delayMs,
|
|
53
|
+
durationMs: motionRecipe.durationMs,
|
|
54
|
+
easing: motionRecipe.easing,
|
|
55
|
+
fromOpacity: 1,
|
|
56
|
+
toOpacity: 0,
|
|
57
|
+
fromTranslateY: 0,
|
|
58
|
+
toTranslateY: usesDigitTravel ? -verticalOffset : 0,
|
|
59
|
+
fromScale: 1,
|
|
60
|
+
toScale: 0.6
|
|
61
|
+
}), [delayMs, motionRecipe.durationMs, motionRecipe.easing, usesDigitTravel, verticalOffset]);
|
|
62
|
+
if (isLead) {
|
|
63
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
|
|
64
|
+
style: textStyle,
|
|
65
|
+
children: unit
|
|
66
|
+
});
|
|
67
|
+
}
|
|
68
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeReanimated.default.View, {
|
|
69
|
+
layout: motionRecipe.layoutTransition,
|
|
70
|
+
entering: hasAnimated ? motionRecipe.enterTransition : undefined,
|
|
71
|
+
exiting: motionRecipe.exitTransition,
|
|
72
|
+
style: laneStyle,
|
|
73
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
|
|
74
|
+
style: [textStyle, laneProbeStyle],
|
|
75
|
+
children: unit
|
|
76
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.Text, {
|
|
77
|
+
entering: hasAnimated ? enterTransition : undefined,
|
|
78
|
+
exiting: exitTransition,
|
|
79
|
+
style: [textStyle, laneTokenStyle],
|
|
80
|
+
children: unit
|
|
81
|
+
}, `token:${tokenKey}`)]
|
|
82
|
+
});
|
|
83
|
+
});
|
|
84
|
+
NumberLane.displayName = "NumberLane";
|
|
85
|
+
//# sourceMappingURL=number-lane.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeReanimated","_interopRequireDefault","_displayUnits","_entryExitBuilders","_jsxRuntime","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","laneStyle","position","alignSelf","laneProbeStyle","opacity","laneTokenStyle","top","left","NumberLane","exports","React","memo","unit","tokenKey","isLead","hasAnimated","delayMs","direction","travelDistance","motionRecipe","textStyle","usesDigitTravel","isAsciiDigit","verticalOffset","enterTransition","useMemo","createShiftTransition","durationMs","easing","fromOpacity","toOpacity","fromTranslateY","toTranslateY","fromScale","toScale","exitTransition","jsx","Text","style","children","jsxs","View","layout","layoutTransition","entering","undefined","exiting","displayName"],"sourceRoot":"../../../src","sources":["view/number-lane.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.NumberRun = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
var _useNumericLanes = require("../hooks/use-numeric-lanes");
|
|
10
|
+
var _numberLane = require("./number-lane");
|
|
11
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
|
+
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); }
|
|
13
|
+
const rowStyle = {
|
|
14
|
+
flexDirection: "row",
|
|
15
|
+
alignItems: "center",
|
|
16
|
+
alignSelf: "flex-start"
|
|
17
|
+
};
|
|
18
|
+
const NumberRun = exports.NumberRun = /*#__PURE__*/_react.default.memo(({
|
|
19
|
+
value,
|
|
20
|
+
motionRecipe,
|
|
21
|
+
fontSize,
|
|
22
|
+
textStyle,
|
|
23
|
+
staggerMs
|
|
24
|
+
}) => {
|
|
25
|
+
const {
|
|
26
|
+
units,
|
|
27
|
+
laneKeys,
|
|
28
|
+
direction,
|
|
29
|
+
leadLength
|
|
30
|
+
} = (0, _useNumericLanes.useNumericLanes)(value);
|
|
31
|
+
const lastValueRef = (0, _react.useRef)(value);
|
|
32
|
+
const hasAnimatedRef = (0, _react.useRef)(false);
|
|
33
|
+
|
|
34
|
+
// skip enter animations on first paint so the number feels settled
|
|
35
|
+
if (value !== lastValueRef.current) {
|
|
36
|
+
hasAnimatedRef.current = true;
|
|
37
|
+
lastValueRef.current = value;
|
|
38
|
+
}
|
|
39
|
+
const travelDistance = (0, _react.useMemo)(() => Math.max(8, Math.round((fontSize ?? 16) * 0.4)), [fontSize]);
|
|
40
|
+
const hasAnimated = hasAnimatedRef.current;
|
|
41
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
42
|
+
style: rowStyle,
|
|
43
|
+
children: units.map((unit, index) => {
|
|
44
|
+
const inLead = index < leadLength;
|
|
45
|
+
const laneKey = inLead ? `lead:${index}` : `lane:${units.length - 1 - index}`;
|
|
46
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_numberLane.NumberLane, {
|
|
47
|
+
unit: unit,
|
|
48
|
+
tokenKey: laneKeys[index],
|
|
49
|
+
isLead: inLead,
|
|
50
|
+
hasAnimated: hasAnimated,
|
|
51
|
+
delayMs: index * staggerMs,
|
|
52
|
+
direction: direction,
|
|
53
|
+
travelDistance: travelDistance,
|
|
54
|
+
motionRecipe: motionRecipe,
|
|
55
|
+
textStyle: textStyle
|
|
56
|
+
}, laneKey);
|
|
57
|
+
})
|
|
58
|
+
});
|
|
59
|
+
});
|
|
60
|
+
NumberRun.displayName = "NumberRun";
|
|
61
|
+
//# sourceMappingURL=number-run.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_useNumericLanes","_numberLane","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","rowStyle","flexDirection","alignItems","alignSelf","NumberRun","exports","React","memo","value","motionRecipe","fontSize","textStyle","staggerMs","units","laneKeys","direction","leadLength","useNumericLanes","lastValueRef","useRef","hasAnimatedRef","current","travelDistance","useMemo","Math","max","round","hasAnimated","jsx","View","style","children","map","unit","index","inLead","laneKey","length","NumberLane","tokenKey","isLead","delayMs","displayName"],"sourceRoot":"../../../src","sources":["view/number-run.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.TextRun = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _useTextGlyphs = require("../hooks/use-text-glyphs");
|
|
9
|
+
var _glyphRun = require("./glyph-run");
|
|
10
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
+
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); }
|
|
12
|
+
const TextRun = exports.TextRun = /*#__PURE__*/_react.default.memo(({
|
|
13
|
+
value,
|
|
14
|
+
motionRecipe,
|
|
15
|
+
textStyle
|
|
16
|
+
}) => {
|
|
17
|
+
// namespace ids per instance so repeated strings do not collide
|
|
18
|
+
const scopeId = (0, _react.useId)();
|
|
19
|
+
const glyphs = (0, _useTextGlyphs.useTextGlyphs)(value, scopeId);
|
|
20
|
+
const lastValueRef = (0, _react.useRef)(value);
|
|
21
|
+
const hasAnimatedRef = (0, _react.useRef)(false);
|
|
22
|
+
if (value !== lastValueRef.current) {
|
|
23
|
+
hasAnimatedRef.current = true;
|
|
24
|
+
lastValueRef.current = value;
|
|
25
|
+
}
|
|
26
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_glyphRun.GlyphRun, {
|
|
27
|
+
glyphs: glyphs,
|
|
28
|
+
layoutTransition: motionRecipe.layoutTransition,
|
|
29
|
+
enterTransition: hasAnimatedRef.current ? motionRecipe.enterTransition : undefined,
|
|
30
|
+
exitTransition: motionRecipe.exitTransition,
|
|
31
|
+
textStyle: textStyle
|
|
32
|
+
});
|
|
33
|
+
});
|
|
34
|
+
TextRun.displayName = "TextRun";
|
|
35
|
+
//# sourceMappingURL=text-run.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_useTextGlyphs","_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","textStyle","scopeId","useId","glyphs","useTextGlyphs","lastValueRef","useRef","hasAnimatedRef","current","jsx","GlyphRun","layoutTransition","enterTransition","undefined","exitTransition","displayName"],"sourceRoot":"../../../src","sources":["view/text-run.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AAEA,IAAAC,cAAA,GAAAD,OAAA;AAEA,IAAAE,SAAA,GAAAF,OAAA;AAAuC,IAAAG,WAAA,GAAAH,OAAA;AAAA,SAAAD,wBAAAK,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAP,uBAAA,YAAAA,CAAAK,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAQhC,MAAMkB,OAAO,GAAAC,OAAA,CAAAD,OAAA,gBAAGE,cAAK,CAACC,IAAI,CAC/B,CAAC;EAAEC,KAAK;EAAEC,YAAY;EAAEC;AAAwB,CAAC,KAAK;EACpD;EACA,MAAMC,OAAO,GAAG,IAAAC,YAAK,EAAC,CAAC;EACvB,MAAMC,MAAM,GAAG,IAAAC,4BAAa,EAACN,KAAK,EAAEG,OAAO,CAAC;EAC5C,MAAMI,YAAY,GAAG,IAAAC,aAAM,EAACR,KAAK,CAAC;EAClC,MAAMS,cAAc,GAAG,IAAAD,aAAM,EAAC,KAAK,CAAC;EAEpC,IAAIR,KAAK,KAAKO,YAAY,CAACG,OAAO,EAAE;IAClCD,cAAc,CAACC,OAAO,GAAG,IAAI;IAC7BH,YAAY,CAACG,OAAO,GAAGV,KAAK;EAC9B;EAEA,oBACE,IAAAxB,WAAA,CAAAmC,GAAA,EAACpC,SAAA,CAAAqC,QAAQ;IACPP,MAAM,EAAEA,MAAO;IACfQ,gBAAgB,EAAEZ,YAAY,CAACY,gBAAiB;IAChDC,eAAe,EACbL,cAAc,CAACC,OAAO,GAAGT,YAAY,CAACa,eAAe,GAAGC,SACzD;IACDC,cAAc,EAAEf,YAAY,CAACe,cAAe;IAC5Cd,SAAS,EAAEA;EAAU,CACtB,CAAC;AAEN,CACF,CAAC;AAEDN,OAAO,CAACqB,WAAW,GAAG,SAAS","ignoreList":[]}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useMemo } from "react";
|
|
4
|
+
import { normalizeDisplayUnit, splitDisplayUnits } from "../model/display-units.js";
|
|
5
|
+
export const useDisplayUnits = (value, enabled = true) => useMemo(() =>
|
|
6
|
+
// skip unit work when auto size is off
|
|
7
|
+
enabled ? splitDisplayUnits(value).map(normalizeDisplayUnit) : [], [enabled, value]);
|
|
8
|
+
//# sourceMappingURL=use-display-units.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useMemo","normalizeDisplayUnit","splitDisplayUnits","useDisplayUnits","value","enabled","map"],"sourceRoot":"../../../src","sources":["hooks/use-display-units.ts"],"mappings":";;AAAA,SAASA,OAAO,QAAQ,OAAO;AAC/B,SACEC,oBAAoB,EACpBC,iBAAiB,QACZ,2BAAwB;AAE/B,OAAO,MAAMC,eAAe,GAAGA,CAC7BC,KAAa,EACbC,OAAO,GAAG,IAAI,KAEdL,OAAO,CACL;AACE;AACAK,OAAO,GACHH,iBAAiB,CAACE,KAAK,CAAC,CAACE,GAAG,CAACL,oBAAoB,CAAC,GAClD,EAAE,EACR,CAACI,OAAO,EAAED,KAAK,CACjB,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useCallback, useRef, useState } from "react";
|
|
4
|
+
import { useAnimatedStyle, useSharedValue } from "react-native-reanimated";
|
|
5
|
+
export const useInlineAutoWidth = ({
|
|
6
|
+
enabled,
|
|
7
|
+
driveToWidth
|
|
8
|
+
}) => {
|
|
9
|
+
const widthValue = useSharedValue(0);
|
|
10
|
+
const measuredWidthRef = useRef(null);
|
|
11
|
+
const bootstrappedRef = useRef(false);
|
|
12
|
+
const [hasBootstrappedWidth, setHasBootstrappedWidth] = useState(false);
|
|
13
|
+
const captureLayout = useCallback(event => {
|
|
14
|
+
if (!enabled) {
|
|
15
|
+
return;
|
|
16
|
+
}
|
|
17
|
+
const nextWidth = Math.max(0, Math.ceil(event.nativeEvent.layout.width));
|
|
18
|
+
if (measuredWidthRef.current === nextWidth) {
|
|
19
|
+
return;
|
|
20
|
+
}
|
|
21
|
+
measuredWidthRef.current = nextWidth;
|
|
22
|
+
|
|
23
|
+
// snap the first width so mount does not animate from zero
|
|
24
|
+
if (!bootstrappedRef.current) {
|
|
25
|
+
bootstrappedRef.current = true;
|
|
26
|
+
widthValue.value = nextWidth;
|
|
27
|
+
setHasBootstrappedWidth(true);
|
|
28
|
+
return;
|
|
29
|
+
}
|
|
30
|
+
widthValue.value = driveToWidth(nextWidth);
|
|
31
|
+
}, [driveToWidth, enabled, widthValue]);
|
|
32
|
+
const animatedWidthStyle = useAnimatedStyle(() => enabled && hasBootstrappedWidth ? {
|
|
33
|
+
width: widthValue.value
|
|
34
|
+
} : {}, [enabled, hasBootstrappedWidth]);
|
|
35
|
+
return {
|
|
36
|
+
captureLayout,
|
|
37
|
+
animatedWidthStyle
|
|
38
|
+
};
|
|
39
|
+
};
|
|
40
|
+
//# sourceMappingURL=use-inline-auto-width.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useCallback","useRef","useState","useAnimatedStyle","useSharedValue","useInlineAutoWidth","enabled","driveToWidth","widthValue","measuredWidthRef","bootstrappedRef","hasBootstrappedWidth","setHasBootstrappedWidth","captureLayout","event","nextWidth","Math","max","ceil","nativeEvent","layout","width","current","value","animatedWidthStyle"],"sourceRoot":"../../../src","sources":["hooks/use-inline-auto-width.ts"],"mappings":";;AAAA,SAASA,WAAW,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AAErD,SAASC,gBAAgB,EAAEC,cAAc,QAAQ,yBAAyB;AAO1E,OAAO,MAAMC,kBAAkB,GAAGA,CAAC;EAAEC,OAAO;EAAEC;AAAqB,CAAC,KAAK;EACvE,MAAMC,UAAU,GAAGJ,cAAc,CAAC,CAAC,CAAC;EACpC,MAAMK,gBAAgB,GAAGR,MAAM,CAAgB,IAAI,CAAC;EACpD,MAAMS,eAAe,GAAGT,MAAM,CAAC,KAAK,CAAC;EACrC,MAAM,CAACU,oBAAoB,EAAEC,uBAAuB,CAAC,GAAGV,QAAQ,CAAC,KAAK,CAAC;EAEvE,MAAMW,aAAa,GAAGb,WAAW,CAC9Bc,KAAwB,IAAK;IAC5B,IAAI,CAACR,OAAO,EAAE;MACZ;IACF;IAEA,MAAMS,SAAS,GAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAED,IAAI,CAACE,IAAI,CAACJ,KAAK,CAACK,WAAW,CAACC,MAAM,CAACC,KAAK,CAAC,CAAC;IAExE,IAAIZ,gBAAgB,CAACa,OAAO,KAAKP,SAAS,EAAE;MAC1C;IACF;IAEAN,gBAAgB,CAACa,OAAO,GAAGP,SAAS;;IAEpC;IACA,IAAI,CAACL,eAAe,CAACY,OAAO,EAAE;MAC5BZ,eAAe,CAACY,OAAO,GAAG,IAAI;MAC9Bd,UAAU,CAACe,KAAK,GAAGR,SAAS;MAC5BH,uBAAuB,CAAC,IAAI,CAAC;MAC7B;IACF;IAEAJ,UAAU,CAACe,KAAK,GAAGhB,YAAY,CAACQ,SAAS,CAAC;EAC5C,CAAC,EACD,CAACR,YAAY,EAAED,OAAO,EAAEE,UAAU,CACpC,CAAC;EAED,MAAMgB,kBAAkB,GAAGrB,gBAAgB,CACzC,MACEG,OAAO,IAAIK,oBAAoB,GAC3B;IACEU,KAAK,EAAEb,UAAU,CAACe;EACpB,CAAC,GACD,CAAC,CAAC,EACR,CAACjB,OAAO,EAAEK,oBAAoB,CAChC,CAAC;EAED,OAAO;IACLE,aAAa;IACbW;EACF,CAAC;AACH,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useMemo } from "react";
|
|
4
|
+
import { resolveMotionRecipe } from "../motion/preset-map.js";
|
|
5
|
+
export const useMorphMotion = ({
|
|
6
|
+
variant,
|
|
7
|
+
animationPreset,
|
|
8
|
+
animationDuration,
|
|
9
|
+
stagger
|
|
10
|
+
}) => {
|
|
11
|
+
// numbers feel better with snappy unless you pick something else
|
|
12
|
+
const resolvedPreset = animationPreset ?? (variant === "text" ? "default" : "snappy");
|
|
13
|
+
const motionRecipe = useMemo(() => resolveMotionRecipe(resolvedPreset, animationDuration), [animationDuration, resolvedPreset]);
|
|
14
|
+
return {
|
|
15
|
+
motionRecipe,
|
|
16
|
+
staggerMs: Math.round(stagger * 1000)
|
|
17
|
+
};
|
|
18
|
+
};
|
|
19
|
+
//# sourceMappingURL=use-morph-motion.js.map
|
|
@@ -0,0 +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;AAmB1D,OAAO,MAAMC,cAAc,GAAGA,CAAC;EAC7BC,OAAO;EACPC,eAAe;EACfC,iBAAiB;EACjBC;AACM,CAAC,KAAkB;EACzB;EACA,MAAMC,cAAc,GAClBH,eAAe,KAAKD,OAAO,KAAK,MAAM,GAAG,SAAS,GAAG,QAAQ,CAAC;EAEhE,MAAMK,YAAY,GAAGR,OAAO,CAC1B,MAAMC,mBAAmB,CAACM,cAAc,EAAEF,iBAAiB,CAAC,EAC5D,CAACA,iBAAiB,EAAEE,cAAc,CACpC,CAAC;EAED,OAAO;IACLC,YAAY;IACZC,SAAS,EAAEC,IAAI,CAACC,KAAK,CAACL,OAAO,GAAG,IAAI;EACtC,CAAC;AACH,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useMemo } from "react";
|
|
4
|
+
export const useMorphTextStyle = ({
|
|
5
|
+
fontSize,
|
|
6
|
+
color,
|
|
7
|
+
fontStyle,
|
|
8
|
+
style
|
|
9
|
+
}) => {
|
|
10
|
+
const baseTextStyle = useMemo(() => {
|
|
11
|
+
const nextStyle = {
|
|
12
|
+
includeFontPadding: false
|
|
13
|
+
};
|
|
14
|
+
if (fontSize !== undefined) {
|
|
15
|
+
nextStyle.fontSize = fontSize;
|
|
16
|
+
}
|
|
17
|
+
if (color !== undefined) {
|
|
18
|
+
nextStyle.color = color;
|
|
19
|
+
}
|
|
20
|
+
return nextStyle;
|
|
21
|
+
}, [color, fontSize]);
|
|
22
|
+
const textStyle = useMemo(() => [baseTextStyle, fontStyle, style], [baseTextStyle, fontStyle, style]);
|
|
23
|
+
return {
|
|
24
|
+
textStyle
|
|
25
|
+
};
|
|
26
|
+
};
|
|
27
|
+
//# sourceMappingURL=use-morph-text-style.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useMemo","useMorphTextStyle","fontSize","color","fontStyle","style","baseTextStyle","nextStyle","includeFontPadding","undefined","textStyle"],"sourceRoot":"../../../src","sources":["hooks/use-morph-text-style.ts"],"mappings":";;AAAA,SAASA,OAAO,QAAQ,OAAO;AAc/B,OAAO,MAAMC,iBAAiB,GAAGA,CAAC;EAChCC,QAAQ;EACRC,KAAK;EACLC,SAAS;EACTC;AACM,CAAC,KAAqB;EAC5B,MAAMC,aAAa,GAAGN,OAAO,CAAC,MAAM;IAClC,MAAMO,SAAoB,GAAG;MAC3BC,kBAAkB,EAAE;IACtB,CAAC;IAED,IAAIN,QAAQ,KAAKO,SAAS,EAAE;MAC1BF,SAAS,CAACL,QAAQ,GAAGA,QAAQ;IAC/B;IAEA,IAAIC,KAAK,KAAKM,SAAS,EAAE;MACvBF,SAAS,CAACJ,KAAK,GAAGA,KAAK;IACzB;IAEA,OAAOI,SAAS;EAClB,CAAC,EAAE,CAACJ,KAAK,EAAED,QAAQ,CAAC,CAAC;EAErB,MAAMQ,SAAS,GAAGV,OAAO,CACvB,MAAM,CAACM,aAAa,EAAEF,SAAS,EAAEC,KAAK,CAAC,EACvC,CAACC,aAAa,EAAEF,SAAS,EAAEC,KAAK,CAClC,CAAC;EAED,OAAO;IACLK;EACF,CAAC;AACH,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useMemo, useRef } from "react";
|
|
4
|
+
import { findNumericLeadLength, splitDisplayUnits } from "../model/display-units.js";
|
|
5
|
+
import { reconcileNumericLanes } from "../model/numeric-lanes.js";
|
|
6
|
+
export const useNumericLanes = value => {
|
|
7
|
+
const units = useMemo(() => splitDisplayUnits(value), [value]);
|
|
8
|
+
const ledgerRef = useRef({
|
|
9
|
+
previousValue: value,
|
|
10
|
+
laneKeys: units.map((_, index) => index),
|
|
11
|
+
nextSeed: units.length,
|
|
12
|
+
direction: 0
|
|
13
|
+
});
|
|
14
|
+
|
|
15
|
+
// keep lane ids in a ref so the number can reflow without remounting everything
|
|
16
|
+
if (value !== ledgerRef.current.previousValue) {
|
|
17
|
+
const nextLedger = reconcileNumericLanes(ledgerRef.current.previousValue, value, ledgerRef.current.laneKeys, ledgerRef.current.nextSeed);
|
|
18
|
+
ledgerRef.current = {
|
|
19
|
+
previousValue: value,
|
|
20
|
+
laneKeys: nextLedger.laneKeys,
|
|
21
|
+
nextSeed: nextLedger.nextSeed,
|
|
22
|
+
direction: nextLedger.direction
|
|
23
|
+
};
|
|
24
|
+
}
|
|
25
|
+
return {
|
|
26
|
+
units,
|
|
27
|
+
laneKeys: ledgerRef.current.laneKeys,
|
|
28
|
+
direction: ledgerRef.current.direction,
|
|
29
|
+
leadLength: findNumericLeadLength(units)
|
|
30
|
+
};
|
|
31
|
+
};
|
|
32
|
+
//# sourceMappingURL=use-numeric-lanes.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useMemo","useRef","findNumericLeadLength","splitDisplayUnits","reconcileNumericLanes","useNumericLanes","value","units","ledgerRef","previousValue","laneKeys","map","_","index","nextSeed","length","direction","current","nextLedger","leadLength"],"sourceRoot":"../../../src","sources":["hooks/use-numeric-lanes.ts"],"mappings":";;AAAA,SAASA,OAAO,EAAEC,MAAM,QAAQ,OAAO;AAEvC,SACEC,qBAAqB,EACrBC,iBAAiB,QACZ,2BAAwB;AAC/B,SAASC,qBAAqB,QAAQ,2BAAwB;AAgB9D,OAAO,MAAMC,eAAe,GAAIC,KAAa,IAA0B;EACrE,MAAMC,KAAK,GAAGP,OAAO,CAAC,MAAMG,iBAAiB,CAACG,KAAK,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAC9D,MAAME,SAAS,GAAGP,MAAM,CAAgB;IACtCQ,aAAa,EAAEH,KAAK;IACpBI,QAAQ,EAAEH,KAAK,CAACI,GAAG,CAAC,CAACC,CAAC,EAAEC,KAAK,KAAKA,KAAK,CAAC;IACxCC,QAAQ,EAAEP,KAAK,CAACQ,MAAM;IACtBC,SAAS,EAAE;EACb,CAAC,CAAC;;EAEF;EACA,IAAIV,KAAK,KAAKE,SAAS,CAACS,OAAO,CAACR,aAAa,EAAE;IAC7C,MAAMS,UAAU,GAAGd,qBAAqB,CACtCI,SAAS,CAACS,OAAO,CAACR,aAAa,EAC/BH,KAAK,EACLE,SAAS,CAACS,OAAO,CAACP,QAAQ,EAC1BF,SAAS,CAACS,OAAO,CAACH,QACpB,CAAC;IAEDN,SAAS,CAACS,OAAO,GAAG;MAClBR,aAAa,EAAEH,KAAK;MACpBI,QAAQ,EAAEQ,UAAU,CAACR,QAAQ;MAC7BI,QAAQ,EAAEI,UAAU,CAACJ,QAAQ;MAC7BE,SAAS,EAAEE,UAAU,CAACF;IACxB,CAAC;EACH;EAEA,OAAO;IACLT,KAAK;IACLG,QAAQ,EAAEF,SAAS,CAACS,OAAO,CAACP,QAAQ;IACpCM,SAAS,EAAER,SAAS,CAACS,OAAO,CAACD,SAAS;IACtCG,UAAU,EAAEjB,qBAAqB,CAACK,KAAK;EACzC,CAAC;AACH,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useMemo, useRef } from "react";
|
|
4
|
+
import { normalizeDisplayUnit, splitDisplayUnits } from "../model/display-units.js";
|
|
5
|
+
import { reconcileTextGlyphKeys } from "../model/text-keys.js";
|
|
6
|
+
export const useTextGlyphs = (value, namespace) => {
|
|
7
|
+
const units = useMemo(() => splitDisplayUnits(value), [value]);
|
|
8
|
+
const ledgerRef = useRef({
|
|
9
|
+
previousValue: value,
|
|
10
|
+
previousUnits: units,
|
|
11
|
+
glyphKeys: units.map((_, index) => `${namespace}:c${index}`),
|
|
12
|
+
nextSeed: units.length
|
|
13
|
+
});
|
|
14
|
+
if (value !== ledgerRef.current.previousValue) {
|
|
15
|
+
// keep ids stable so unchanged glyphs stay mounted between updates
|
|
16
|
+
const nextLedger = reconcileTextGlyphKeys(ledgerRef.current.previousUnits, units, ledgerRef.current.glyphKeys, ledgerRef.current.nextSeed, namespace);
|
|
17
|
+
ledgerRef.current = {
|
|
18
|
+
previousValue: value,
|
|
19
|
+
previousUnits: units,
|
|
20
|
+
glyphKeys: nextLedger.glyphKeys,
|
|
21
|
+
nextSeed: nextLedger.nextSeed
|
|
22
|
+
};
|
|
23
|
+
}
|
|
24
|
+
const glyphKeys = ledgerRef.current.glyphKeys;
|
|
25
|
+
return useMemo(() => units.map((unit, index) => ({
|
|
26
|
+
id: glyphKeys[index],
|
|
27
|
+
value: normalizeDisplayUnit(unit)
|
|
28
|
+
})), [glyphKeys, units]);
|
|
29
|
+
};
|
|
30
|
+
//# sourceMappingURL=use-text-glyphs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useMemo","useRef","normalizeDisplayUnit","splitDisplayUnits","reconcileTextGlyphKeys","useTextGlyphs","value","namespace","units","ledgerRef","previousValue","previousUnits","glyphKeys","map","_","index","nextSeed","length","current","nextLedger","unit","id"],"sourceRoot":"../../../src","sources":["hooks/use-text-glyphs.ts"],"mappings":";;AAAA,SAASA,OAAO,EAAEC,MAAM,QAAQ,OAAO;AACvC,SACEC,oBAAoB,EACpBC,iBAAiB,QACZ,2BAAwB;AAC/B,SAASC,sBAAsB,QAAQ,uBAAoB;AAU3D,OAAO,MAAMC,aAAa,GAAGA,CAC3BC,KAAa,EACbC,SAAiB,KACS;EAC1B,MAAMC,KAAK,GAAGR,OAAO,CAAC,MAAMG,iBAAiB,CAACG,KAAK,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAC9D,MAAMG,SAAS,GAAGR,MAAM,CAAkB;IACxCS,aAAa,EAAEJ,KAAK;IACpBK,aAAa,EAAEH,KAAK;IACpBI,SAAS,EAAEJ,KAAK,CAACK,GAAG,CAAC,CAACC,CAAC,EAAEC,KAAK,KAAK,GAAGR,SAAS,KAAKQ,KAAK,EAAE,CAAC;IAC5DC,QAAQ,EAAER,KAAK,CAACS;EAClB,CAAC,CAAC;EAEF,IAAIX,KAAK,KAAKG,SAAS,CAACS,OAAO,CAACR,aAAa,EAAE;IAC7C;IACA,MAAMS,UAAU,GAAGf,sBAAsB,CACvCK,SAAS,CAACS,OAAO,CAACP,aAAa,EAC/BH,KAAK,EACLC,SAAS,CAACS,OAAO,CAACN,SAAS,EAC3BH,SAAS,CAACS,OAAO,CAACF,QAAQ,EAC1BT,SACF,CAAC;IAEDE,SAAS,CAACS,OAAO,GAAG;MAClBR,aAAa,EAAEJ,KAAK;MACpBK,aAAa,EAAEH,KAAK;MACpBI,SAAS,EAAEO,UAAU,CAACP,SAAS;MAC/BI,QAAQ,EAAEG,UAAU,CAACH;IACvB,CAAC;EACH;EAEA,MAAMJ,SAAS,GAAGH,SAAS,CAACS,OAAO,CAACN,SAAS;EAE7C,OAAOZ,OAAO,CACZ,MACEQ,KAAK,CAACK,GAAG,CAAC,CAACO,IAAI,EAAEL,KAAK,MAAM;IAC1BM,EAAE,EAAET,SAAS,CAACG,KAAK,CAAC;IACpBT,KAAK,EAAEJ,oBAAoB,CAACkB,IAAI;EAClC,CAAC,CAAC,CAAC,EACL,CAACR,SAAS,EAAEJ,KAAK,CACnB,CAAC;AACH,CAAC","ignoreList":[]}
|