react-native-laminar 1.4.2 → 1.4.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (51) hide show
  1. package/lib/commonjs/hooks/use-inline-auto-width.js +105 -18
  2. package/lib/commonjs/hooks/use-inline-auto-width.js.map +1 -1
  3. package/lib/commonjs/hooks/use-text-glyphs.js +24 -21
  4. package/lib/commonjs/hooks/use-text-glyphs.js.map +1 -1
  5. package/lib/commonjs/index.js +6 -1
  6. package/lib/commonjs/index.js.map +1 -1
  7. package/lib/commonjs/view/glyph-run.js +38 -19
  8. package/lib/commonjs/view/glyph-run.js.map +1 -1
  9. package/lib/commonjs/view/morph-viewport.js +2 -0
  10. package/lib/commonjs/view/morph-viewport.js.map +1 -1
  11. package/lib/commonjs/view/text-run.js +34 -12
  12. package/lib/commonjs/view/text-run.js.map +1 -1
  13. package/lib/module/hooks/use-inline-auto-width.js +106 -19
  14. package/lib/module/hooks/use-inline-auto-width.js.map +1 -1
  15. package/lib/module/hooks/use-text-glyphs.js +24 -21
  16. package/lib/module/hooks/use-text-glyphs.js.map +1 -1
  17. package/lib/module/index.js +6 -1
  18. package/lib/module/index.js.map +1 -1
  19. package/lib/module/view/glyph-run.js +39 -20
  20. package/lib/module/view/glyph-run.js.map +1 -1
  21. package/lib/module/view/morph-viewport.js +2 -0
  22. package/lib/module/view/morph-viewport.js.map +1 -1
  23. package/lib/module/view/text-run.js +34 -12
  24. package/lib/module/view/text-run.js.map +1 -1
  25. package/lib/typescript/commonjs/hooks/use-inline-auto-width.d.ts +2 -0
  26. package/lib/typescript/commonjs/hooks/use-inline-auto-width.d.ts.map +1 -1
  27. package/lib/typescript/commonjs/hooks/use-text-glyphs.d.ts.map +1 -1
  28. package/lib/typescript/commonjs/index.d.ts.map +1 -1
  29. package/lib/typescript/commonjs/view/glyph-run.d.ts +3 -1
  30. package/lib/typescript/commonjs/view/glyph-run.d.ts.map +1 -1
  31. package/lib/typescript/commonjs/view/morph-viewport.d.ts +3 -2
  32. package/lib/typescript/commonjs/view/morph-viewport.d.ts.map +1 -1
  33. package/lib/typescript/commonjs/view/text-run.d.ts +3 -1
  34. package/lib/typescript/commonjs/view/text-run.d.ts.map +1 -1
  35. package/lib/typescript/module/hooks/use-inline-auto-width.d.ts +2 -0
  36. package/lib/typescript/module/hooks/use-inline-auto-width.d.ts.map +1 -1
  37. package/lib/typescript/module/hooks/use-text-glyphs.d.ts.map +1 -1
  38. package/lib/typescript/module/index.d.ts.map +1 -1
  39. package/lib/typescript/module/view/glyph-run.d.ts +3 -1
  40. package/lib/typescript/module/view/glyph-run.d.ts.map +1 -1
  41. package/lib/typescript/module/view/morph-viewport.d.ts +3 -2
  42. package/lib/typescript/module/view/morph-viewport.d.ts.map +1 -1
  43. package/lib/typescript/module/view/text-run.d.ts +3 -1
  44. package/lib/typescript/module/view/text-run.d.ts.map +1 -1
  45. package/package.json +1 -1
  46. package/src/hooks/use-inline-auto-width.ts +160 -18
  47. package/src/hooks/use-text-glyphs.ts +35 -28
  48. package/src/index.tsx +11 -1
  49. package/src/view/glyph-run.tsx +62 -33
  50. package/src/view/morph-viewport.tsx +7 -2
  51. package/src/view/text-run.tsx +59 -15
@@ -1 +1 @@
1
- {"version":3,"names":["_react","_interopRequireWildcard","require","_reactNativeReanimated","_useTextGlyphs","_entryExitBuilders","_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","leadingKey","leadingGap","textStyle","className","scopeId","useId","lastValueRef","useRef","lastLeadingPresenceRef","Boolean","lastLeadingKeyRef","hasAnimatedRef","isLeadingSwap","current","leadingSwapProgress","useSharedValue","useLayoutEffect","glyphs","useTextGlyphs","elementEnterTransition","useMemo","createLeadingEnterTransition","durationMs","easing","elementExitTransition","createLeadingExitTransition","scale","hasAnimated","jsx","GlyphRun","layoutTransition","undefined","enterTransition","exitTransition","displayName"],"sourceRoot":"../../../src","sources":["view/text-run.tsx"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["_react","_interopRequireWildcard","require","_reactNativeReanimated","_useTextGlyphs","_entryExitBuilders","_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","lastLeadingPresenceRef","Boolean","lastLeadingKeyRef","hasAnimatedRef","isLeadingSwap","isLeadingChange","leadingSwapProgress","useSharedValue","useLayoutEffect","glyphs","useTextGlyphs","elementEnterTransition","useMemo","createLeadingEnterTransition","durationMs","easing","elementExitTransition","createLeadingExitTransition","scale","hasAnimated","jsx","GlyphRun","layoutTransition","undefined","leadingLayoutTransition","enterTransition","exitTransition","displayName"],"sourceRoot":"../../../src","sources":["view/text-run.tsx"],"mappings":"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","ignoreList":[]}
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
 
3
- import { useCallback, useEffect, useRef, useState } from "react";
3
+ import { useCallback, useEffect, useLayoutEffect, useRef, useState } from "react";
4
4
  import { useAnimatedStyle, useSharedValue } from "react-native-reanimated";
5
5
  const WIDTH_CACHE_LIMIT = 64;
6
6
 
@@ -11,10 +11,19 @@ export const useInlineAutoWidth = ({
11
11
  measurementKey
12
12
  }) => {
13
13
  const widthValue = useSharedValue(0);
14
+ const hasBootstrappedWidth = useSharedValue(false);
14
15
  const measuredWidthRef = useRef(null);
15
16
  const bootstrappedRef = useRef(false);
16
17
  const widthCacheRef = useRef(new Map());
17
- const [hasBootstrappedWidth, setHasBootstrappedWidth] = useState(false);
18
+ const hasCapturedVisibleLayoutRef = useRef(false);
19
+ const initialMeasurementKeyRef = useRef(null);
20
+ const firstProbeRef = useRef(null);
21
+ const latestProbeRef = useRef(null);
22
+ const bootstrapTimerRef = useRef(null);
23
+ const [readyMeasurementKey, setReadyMeasurementKey] = useState(null);
24
+ const markMeasurementReady = useCallback(key => {
25
+ setReadyMeasurementKey(currentKey => currentKey === key ? currentKey : key);
26
+ }, []);
18
27
 
19
28
  // the first measurement establishes the shell without animating from zero
20
29
  const applyWidth = useCallback(nextWidth => {
@@ -25,11 +34,62 @@ export const useInlineAutoWidth = ({
25
34
  if (!bootstrappedRef.current) {
26
35
  bootstrappedRef.current = true;
27
36
  widthValue.value = nextWidth;
28
- setHasBootstrappedWidth(true);
37
+ hasBootstrappedWidth.value = true;
29
38
  return;
30
39
  }
31
40
  widthValue.value = driveToWidth(nextWidth);
32
41
  }, [driveToWidth, widthValue]);
42
+ const bootstrapFromProbe = useCallback(() => {
43
+ bootstrapTimerRef.current = null;
44
+ if (hasCapturedVisibleLayoutRef.current) {
45
+ return;
46
+ }
47
+ const firstProbe = firstProbeRef.current;
48
+ if (!firstProbe) {
49
+ return;
50
+ }
51
+
52
+ // The visible layout did not arrive in time, so use the first probe as a
53
+ // safe fallback. A later probe can still animate from this baseline.
54
+ hasCapturedVisibleLayoutRef.current = true;
55
+ initialMeasurementKeyRef.current = firstProbe.key;
56
+ applyWidth(firstProbe.width);
57
+ const latestProbe = latestProbeRef.current;
58
+ if (latestProbe && latestProbe.key !== firstProbe.key) {
59
+ // The target width is already cached. Defer its animation until the
60
+ // ready render so the shell and the new glyph row start together.
61
+ markMeasurementReady(latestProbe.key);
62
+ } else {
63
+ markMeasurementReady(firstProbe.key);
64
+ }
65
+ }, [applyWidth, markMeasurementReady]);
66
+ const captureVisibleLayout = useCallback(event => {
67
+ if (!enabled || hasCapturedVisibleLayoutRef.current) {
68
+ return;
69
+ }
70
+ if (bootstrapTimerRef.current !== null) {
71
+ clearTimeout(bootstrapTimerRef.current);
72
+ bootstrapTimerRef.current = null;
73
+ }
74
+ hasCapturedVisibleLayoutRef.current = true;
75
+ // bootstrap from the visible tree so the first explicit width matches
76
+ // the geometry that was already painted to the user
77
+ const nextWidth = Math.max(0, event.nativeEvent.layout.width);
78
+ // retain the visible width for the initial key so a later cache hit does
79
+ // not reintroduce the probe-to-visible mismatch
80
+ widthCacheRef.current.delete(measurementKey);
81
+ widthCacheRef.current.set(measurementKey, nextWidth);
82
+ const firstProbe = firstProbeRef.current;
83
+ if (firstProbe && firstProbe.key !== measurementKey) {
84
+ initialMeasurementKeyRef.current = firstProbe.key;
85
+ applyWidth(firstProbe.width);
86
+ markMeasurementReady(measurementKey);
87
+ return;
88
+ }
89
+ initialMeasurementKeyRef.current = measurementKey;
90
+ applyWidth(nextWidth);
91
+ markMeasurementReady(measurementKey);
92
+ }, [applyWidth, enabled, markMeasurementReady, measurementKey]);
33
93
  const captureLayout = useCallback(event => {
34
94
  if (!enabled) {
35
95
  return;
@@ -37,36 +97,63 @@ export const useInlineAutoWidth = ({
37
97
 
38
98
  // round up so fractional native measurements cannot clip the final glyph
39
99
  const nextWidth = Math.max(0, Math.ceil(event.nativeEvent.layout.width));
40
-
41
- // delete before setting so a repeated key moves to the most recent position
42
- widthCacheRef.current.delete(measurementKey);
43
- if (widthCacheRef.current.size >= WIDTH_CACHE_LIMIT) {
44
- // map insertion order gives the lru entry at the front
45
- const oldestKey = widthCacheRef.current.keys().next().value;
46
- if (oldestKey !== undefined) {
47
- widthCacheRef.current.delete(oldestKey);
100
+ const isInitialMeasurement = initialMeasurementKeyRef.current === measurementKey;
101
+ if (!isInitialMeasurement) {
102
+ // delete before setting so a repeated key moves to the most recent position
103
+ widthCacheRef.current.delete(measurementKey);
104
+ if (widthCacheRef.current.size >= WIDTH_CACHE_LIMIT) {
105
+ // map insertion order gives the lru entry at the front
106
+ const oldestKey = widthCacheRef.current.keys().next().value;
107
+ if (oldestKey !== undefined) {
108
+ widthCacheRef.current.delete(oldestKey);
109
+ }
48
110
  }
111
+ widthCacheRef.current.set(measurementKey, nextWidth);
49
112
  }
50
- widthCacheRef.current.set(measurementKey, nextWidth);
51
- applyWidth(nextWidth);
52
- }, [applyWidth, enabled, measurementKey]);
113
+ const probe = {
114
+ key: measurementKey,
115
+ width: nextWidth
116
+ };
117
+ if (!firstProbeRef.current) {
118
+ firstProbeRef.current = probe;
119
+ }
120
+ latestProbeRef.current = probe;
121
+ if (!hasCapturedVisibleLayoutRef.current && bootstrapTimerRef.current === null) {
122
+ bootstrapTimerRef.current = setTimeout(bootstrapFromProbe, 0);
123
+ }
124
+
125
+ // Do not let the initial probe override the visible first frame.
126
+ if (hasCapturedVisibleLayoutRef.current && !isInitialMeasurement) {
127
+ // captureLayout only records the target. The cache effect applies the
128
+ // animation during the render that releases the new glyph row.
129
+ markMeasurementReady(measurementKey);
130
+ }
131
+ }, [applyWidth, bootstrapFromProbe, enabled, markMeasurementReady, measurementKey]);
53
132
  const cachedWidth = widthCacheRef.current.get(measurementKey);
54
133
 
55
134
  // a cached width can restore the shell before the hidden probe renders again
56
- useEffect(() => {
57
- if (enabled && cachedWidth !== undefined) {
135
+ useLayoutEffect(() => {
136
+ if (enabled && cachedWidth !== undefined && hasCapturedVisibleLayoutRef.current) {
58
137
  // promote cache hits so active states stay available longer
59
138
  widthCacheRef.current.delete(measurementKey);
60
139
  widthCacheRef.current.set(measurementKey, cachedWidth);
61
140
  applyWidth(cachedWidth);
141
+ markMeasurementReady(measurementKey);
142
+ }
143
+ }, [applyWidth, cachedWidth, enabled, markMeasurementReady, measurementKey]);
144
+ useEffect(() => () => {
145
+ if (bootstrapTimerRef.current !== null) {
146
+ clearTimeout(bootstrapTimerRef.current);
62
147
  }
63
- }, [applyWidth, cachedWidth, enabled, measurementKey]);
64
- const animatedWidthStyle = useAnimatedStyle(() => enabled && hasBootstrappedWidth ? {
148
+ }, []);
149
+ const animatedWidthStyle = useAnimatedStyle(() => enabled && hasBootstrappedWidth.value ? {
65
150
  width: widthValue.value
66
- } : {}, [enabled, hasBootstrappedWidth]);
151
+ } : {}, [enabled]);
67
152
  return {
68
153
  captureLayout,
154
+ captureVisibleLayout,
69
155
  animatedWidthStyle,
156
+ isReady: !enabled || cachedWidth !== undefined || readyMeasurementKey === measurementKey,
70
157
  shouldMeasure: enabled && cachedWidth === undefined
71
158
  };
72
159
  };
@@ -1 +1 @@
1
- {"version":3,"names":["useCallback","useEffect","useRef","useState","useAnimatedStyle","useSharedValue","WIDTH_CACHE_LIMIT","useInlineAutoWidth","enabled","driveToWidth","measurementKey","widthValue","measuredWidthRef","bootstrappedRef","widthCacheRef","Map","hasBootstrappedWidth","setHasBootstrappedWidth","applyWidth","nextWidth","current","value","captureLayout","event","Math","max","ceil","nativeEvent","layout","width","delete","size","oldestKey","keys","next","undefined","set","cachedWidth","get","animatedWidthStyle","shouldMeasure"],"sourceRoot":"../../../src","sources":["hooks/use-inline-auto-width.ts"],"mappings":"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","ignoreList":[]}
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","current","value","bootstrapFromProbe","firstProbe","width","latestProbe","captureVisibleLayout","event","clearTimeout","Math","max","nativeEvent","layout","delete","set","captureLayout","ceil","isInitialMeasurement","size","oldestKey","keys","next","undefined","probe","setTimeout","cachedWidth","get","animatedWidthStyle","isReady","shouldMeasure"],"sourceRoot":"../../../src","sources":["hooks/use-inline-auto-width.ts"],"mappings":"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","ignoreList":[]}
@@ -3,25 +3,21 @@
3
3
  import { useMemo, useRef } from "react";
4
4
  import { normalizeDisplayUnit, splitDisplayUnits } from "../model/display-units.js";
5
5
  import { reconcileTextGlyphKeys } from "../model/text-keys.js";
6
- // build the inline token stream that lets text and leading content share one ledger
6
+ // build text glyphs independently, then prepend a separately keyed leading token
7
7
  export const useTextGlyphs = (value, namespace, leading, leadingKey) => {
8
- const units = useMemo(() => [
9
- // the map key becomes the identity when leading content is state keyed
10
- ...(leading ? [{
11
- kind: "element",
12
- signature: `leading:${String(leadingKey ?? "default")}`,
13
- element: leading
14
- }] : []), ...splitDisplayUnits(value).map(unit => ({
8
+ // Reconcile text independently so inserting/removing a leading token cannot
9
+ // change which repeated text glyphs the LCS ledger preserves.
10
+ const textUnits = useMemo(() => [...splitDisplayUnits(value).map(unit => ({
15
11
  kind: "text",
16
12
  signature: `text:${unit}`,
17
13
  value: unit
18
- }))], [leading, leadingKey, value]);
19
- const signatures = units.map(unit => unit.signature);
14
+ }))], [value]);
15
+ const signatures = textUnits.map(unit => unit.signature);
20
16
  const ledgerRef = useRef({
21
17
  previousValue: value,
22
18
  previousSignatures: signatures,
23
- glyphKeys: units.map((_, index) => `${namespace}:c${index}`),
24
- nextSeed: units.length
19
+ glyphKeys: textUnits.map((_, index) => `${namespace}:c${index}`),
20
+ nextSeed: textUnits.length
25
21
  });
26
22
 
27
23
  // reconcile only when a token signature changes so stable glyphs keep their views
@@ -37,15 +33,22 @@ export const useTextGlyphs = (value, namespace, leading, leadingKey) => {
37
33
  }
38
34
  const glyphKeys = ledgerRef.current.glyphKeys;
39
35
 
40
- // normalize spaces at the edge where tokens become renderable glyphs
41
- return useMemo(() => units.map((unit, index) => ({
42
- id: glyphKeys[index],
43
- kind: unit.kind,
44
- ...(unit.kind === "text" ? {
36
+ // normalize spaces at the edge where tokens become renderable glyphs, then
37
+ // prepend the leading token with an identity that is independent of text
38
+ return useMemo(() => {
39
+ const textGlyphs = textUnits.map((unit, index) => ({
40
+ id: glyphKeys[index],
41
+ kind: "text",
45
42
  value: normalizeDisplayUnit(unit.value)
46
- } : {
47
- element: unit.element
48
- })
49
- })), [glyphKeys, units]);
43
+ }));
44
+ if (!leading) {
45
+ return textGlyphs;
46
+ }
47
+ return [{
48
+ id: `${namespace}:leading:${String(leadingKey ?? "default")}`,
49
+ kind: "element",
50
+ element: leading
51
+ }, ...textGlyphs];
52
+ }, [glyphKeys, leading, leadingKey, namespace, textUnits]);
50
53
  };
51
54
  //# sourceMappingURL=use-text-glyphs.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["useMemo","useRef","normalizeDisplayUnit","splitDisplayUnits","reconcileTextGlyphKeys","useTextGlyphs","value","namespace","leading","leadingKey","units","kind","signature","String","element","map","unit","signatures","ledgerRef","previousValue","previousSignatures","glyphKeys","_","index","nextSeed","length","current","some","nextLedger","id"],"sourceRoot":"../../../src","sources":["hooks/use-text-glyphs.ts"],"mappings":";;AAAA,SAASA,OAAO,EAAEC,MAAM,QAAwB,OAAO;AACvD,SACEC,oBAAoB,EACpBC,iBAAiB,QACZ,2BAAwB;AAC/B,SAASC,sBAAsB,QAAQ,uBAAoB;AAc3D;AACA,OAAO,MAAMC,aAAa,GAAGA,CAC3BC,KAAa,EACbC,SAAiB,EACjBC,OAAmB,EACnBC,UAA4B,KACF;EAC1B,MAAMC,KAAK,GAAGV,OAAO,CACnB,MAAM;EACJ;EACA,IAAIQ,OAAO,GACP,CACE;IACEG,IAAI,EAAE,SAAS;IACfC,SAAS,EAAE,WAAWC,MAAM,CAACJ,UAAU,IAAI,SAAS,CAAC,EAAE;IACvDK,OAAO,EAAEN;EACX,CAAC,CACF,GACD,EAAE,CAAC,EACP,GAAGL,iBAAiB,CAACG,KAAK,CAAC,CAACS,GAAG,CAAEC,IAAI,KAAM;IACzCL,IAAI,EAAE,MAAe;IACrBC,SAAS,EAAE,QAAQI,IAAI,EAAE;IACzBV,KAAK,EAAEU;EACT,CAAC,CAAC,CAAC,CACJ,EACD,CAACR,OAAO,EAAEC,UAAU,EAAEH,KAAK,CAC7B,CAAC;EACD,MAAMW,UAAU,GAAGP,KAAK,CAACK,GAAG,CAAEC,IAAI,IAAKA,IAAI,CAACJ,SAAS,CAAC;EACtD,MAAMM,SAAS,GAAGjB,MAAM,CAAkB;IACxCkB,aAAa,EAAEb,KAAK;IACpBc,kBAAkB,EAAEH,UAAU;IAC9BI,SAAS,EAAEX,KAAK,CAACK,GAAG,CAAC,CAACO,CAAC,EAAEC,KAAK,KAAK,GAAGhB,SAAS,KAAKgB,KAAK,EAAE,CAAC;IAC5DC,QAAQ,EAAEd,KAAK,CAACe;EAClB,CAAC,CAAC;;EAEF;EACA,IACEnB,KAAK,KAAKY,SAAS,CAACQ,OAAO,CAACP,aAAa,IACzCF,UAAU,CAACQ,MAAM,KAAKP,SAAS,CAACQ,OAAO,CAACN,kBAAkB,CAACK,MAAM,IACjER,UAAU,CAACU,IAAI,CACb,CAACf,SAAS,EAAEW,KAAK,KAAKX,SAAS,KAAKM,SAAS,CAACQ,OAAO,CAACN,kBAAkB,CAACG,KAAK,CAChF,CAAC,EACD;IACA;IACA,MAAMK,UAAU,GAAGxB,sBAAsB,CACvCc,SAAS,CAACQ,OAAO,CAACN,kBAAkB,EACpCH,UAAU,EACVC,SAAS,CAACQ,OAAO,CAACL,SAAS,EAC3BH,SAAS,CAACQ,OAAO,CAACF,QAAQ,EAC1BjB,SACF,CAAC;IAEDW,SAAS,CAACQ,OAAO,GAAG;MAClBP,aAAa,EAAEb,KAAK;MACpBc,kBAAkB,EAAEH,UAAU;MAC9BI,SAAS,EAAEO,UAAU,CAACP,SAAS;MAC/BG,QAAQ,EAAEI,UAAU,CAACJ;IACvB,CAAC;EACH;EAEA,MAAMH,SAAS,GAAGH,SAAS,CAACQ,OAAO,CAACL,SAAS;;EAE7C;EACA,OAAOrB,OAAO,CACZ,MACEU,KAAK,CAACK,GAAG,CAAC,CAACC,IAAI,EAAEO,KAAK,MAAM;IAC1BM,EAAE,EAAER,SAAS,CAACE,KAAK,CAAC;IACpBZ,IAAI,EAAEK,IAAI,CAACL,IAAI;IACf,IAAIK,IAAI,CAACL,IAAI,KAAK,MAAM,GACpB;MAAEL,KAAK,EAAEJ,oBAAoB,CAACc,IAAI,CAACV,KAAK;IAAE,CAAC,GAC3C;MAAEQ,OAAO,EAAEE,IAAI,CAACF;IAAQ,CAAC;EAC/B,CAAC,CAAC,CAAC,EACL,CAACO,SAAS,EAAEX,KAAK,CACnB,CAAC;AACH,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["useMemo","useRef","normalizeDisplayUnit","splitDisplayUnits","reconcileTextGlyphKeys","useTextGlyphs","value","namespace","leading","leadingKey","textUnits","map","unit","kind","signature","signatures","ledgerRef","previousValue","previousSignatures","glyphKeys","_","index","nextSeed","length","current","some","nextLedger","textGlyphs","id","String","element"],"sourceRoot":"../../../src","sources":["hooks/use-text-glyphs.ts"],"mappings":";;AAAA,SAASA,OAAO,EAAEC,MAAM,QAAwB,OAAO;AACvD,SACEC,oBAAoB,EACpBC,iBAAiB,QACZ,2BAAwB;AAC/B,SAASC,sBAAsB,QAAQ,uBAAoB;AAgB3D;AACA,OAAO,MAAMC,aAAa,GAAGA,CAC3BC,KAAa,EACbC,SAAiB,EACjBC,OAAmB,EACnBC,UAA4B,KACF;EAC1B;EACA;EACA,MAAMC,SAAS,GAAGV,OAAO,CACvB,MAAM,CACJ,GAAGG,iBAAiB,CAACG,KAAK,CAAC,CAACK,GAAG,CAAEC,IAAI,KAAM;IACzCC,IAAI,EAAE,MAAe;IACrBC,SAAS,EAAE,QAAQF,IAAI,EAAE;IACzBN,KAAK,EAAEM;EACT,CAAC,CAAC,CAAC,CACJ,EACD,CAACN,KAAK,CACR,CAAC;EACD,MAAMS,UAAU,GAAGL,SAAS,CAACC,GAAG,CAAEC,IAAI,IAAKA,IAAI,CAACE,SAAS,CAAC;EAC1D,MAAME,SAAS,GAAGf,MAAM,CAAkB;IACxCgB,aAAa,EAAEX,KAAK;IACpBY,kBAAkB,EAAEH,UAAU;IAC9BI,SAAS,EAAET,SAAS,CAACC,GAAG,CAAC,CAACS,CAAC,EAAEC,KAAK,KAAK,GAAGd,SAAS,KAAKc,KAAK,EAAE,CAAC;IAChEC,QAAQ,EAAEZ,SAAS,CAACa;EACtB,CAAC,CAAC;;EAEF;EACA,IACEjB,KAAK,KAAKU,SAAS,CAACQ,OAAO,CAACP,aAAa,IACzCF,UAAU,CAACQ,MAAM,KAAKP,SAAS,CAACQ,OAAO,CAACN,kBAAkB,CAACK,MAAM,IACjER,UAAU,CAACU,IAAI,CACb,CAACX,SAAS,EAAEO,KAAK,KAAKP,SAAS,KAAKE,SAAS,CAACQ,OAAO,CAACN,kBAAkB,CAACG,KAAK,CAChF,CAAC,EACD;IACA;IACA,MAAMK,UAAU,GAAGtB,sBAAsB,CACvCY,SAAS,CAACQ,OAAO,CAACN,kBAAkB,EACpCH,UAAU,EACVC,SAAS,CAACQ,OAAO,CAACL,SAAS,EAC3BH,SAAS,CAACQ,OAAO,CAACF,QAAQ,EAC1Bf,SACF,CAAC;IAEDS,SAAS,CAACQ,OAAO,GAAG;MAClBP,aAAa,EAAEX,KAAK;MACpBY,kBAAkB,EAAEH,UAAU;MAC9BI,SAAS,EAAEO,UAAU,CAACP,SAAS;MAC/BG,QAAQ,EAAEI,UAAU,CAACJ;IACvB,CAAC;EACH;EAEA,MAAMH,SAAS,GAAGH,SAAS,CAACQ,OAAO,CAACL,SAAS;;EAE7C;EACA;EACA,OAAOnB,OAAO,CACZ,MAAM;IACJ,MAAM2B,UAAU,GAAGjB,SAAS,CAACC,GAAG,CAAC,CAACC,IAAI,EAAES,KAAK,MAAM;MACjDO,EAAE,EAAET,SAAS,CAACE,KAAK,CAAC;MACpBR,IAAI,EAAE,MAAe;MACrBP,KAAK,EAAEJ,oBAAoB,CAACU,IAAI,CAACN,KAAK;IACxC,CAAC,CAAC,CAAC;IAEH,IAAI,CAACE,OAAO,EAAE;MACZ,OAAOmB,UAAU;IACnB;IAEA,OAAO,CACL;MACEC,EAAE,EAAE,GAAGrB,SAAS,YAAYsB,MAAM,CAACpB,UAAU,IAAI,SAAS,CAAC,EAAE;MAC7DI,IAAI,EAAE,SAAkB;MACxBiB,OAAO,EAAEtB;IACX,CAAC,EACD,GAAGmB,UAAU,CACd;EACH,CAAC,EACD,CAACR,SAAS,EAAEX,OAAO,EAAEC,UAAU,EAAEF,SAAS,EAAEG,SAAS,CACvD,CAAC;AACH,CAAC","ignoreList":[]}
@@ -62,7 +62,9 @@ export const Laminar = /*#__PURE__*/React.memo(function Laminar({
62
62
  }, [leadingGap, resolvedLeading, resolvedLeadingKey, resolvedValue, textStyle, variant]);
63
63
  const {
64
64
  captureLayout,
65
+ captureVisibleLayout,
65
66
  animatedWidthStyle,
67
+ isReady: isAutoSizeReady,
66
68
  shouldMeasure
67
69
  } = useInlineAutoWidth({
68
70
  enabled: autoSize,
@@ -82,6 +84,7 @@ export const Laminar = /*#__PURE__*/React.memo(function Laminar({
82
84
  align: align,
83
85
  containerStyle: containerStyle,
84
86
  animatedWidthStyle: animatedWidthStyle,
87
+ onVisibleLayout: autoSize ? captureVisibleLayout : undefined,
85
88
  measurement: shouldMeasure ? /*#__PURE__*/_jsxs(View, {
86
89
  onLayout: captureLayout,
87
90
  style: {
@@ -99,7 +102,7 @@ export const Laminar = /*#__PURE__*/React.memo(function Laminar({
99
102
  style: textStyle,
100
103
  children: normalizeDisplayUnit(unit)
101
104
  }, `${unit}-${index}`))]
102
- }) : undefined,
105
+ }, measurementKey) : undefined,
103
106
  children: variant === "slots" ? /*#__PURE__*/_jsx(SlotsRun, {
104
107
  value: resolvedValue,
105
108
  motionRecipe: motionRecipe,
@@ -121,8 +124,10 @@ export const Laminar = /*#__PURE__*/React.memo(function Laminar({
121
124
  motionRecipe: motionRecipe,
122
125
  align: align,
123
126
  leading: resolvedLeading,
127
+ leadingLayoutGroup: Boolean(leading),
124
128
  leadingKey: resolvedLeadingKey,
125
129
  leadingGap: leadingGap,
130
+ ready: !autoSize || isAutoSizeReady,
126
131
  textStyle: textStyle,
127
132
  className: className
128
133
  })
@@ -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","animatedWidthStyle","shouldMeasure","enabled","driveToWidth","driveNumber","measuredValue","map","join","measurement","onLayout","flexDirection","alignSelf","children","alignItems","justifyContent","marginRight","unit","index","value","isValidElement","Array","isArray"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":"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","ignoreList":[]}
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","leadingLayoutGroup","ready","isValidElement","Array","isArray"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":"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","ignoreList":[]}
@@ -3,12 +3,17 @@
3
3
  import React from "react";
4
4
  import { View } from "react-native";
5
5
  import Animated from "react-native-reanimated";
6
- import { jsx as _jsx } from "react/jsx-runtime";
6
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
7
7
  const rowStyle = {
8
8
  flexDirection: "row",
9
9
  alignItems: "center",
10
10
  alignSelf: "flex-start"
11
11
  };
12
+ const textRowStyle = {
13
+ flexDirection: "row",
14
+ alignItems: "center",
15
+ alignSelf: "flex-start"
16
+ };
12
17
  const rowAlignStyles = {
13
18
  left: {
14
19
  alignSelf: "flex-start"
@@ -25,6 +30,8 @@ const rowAlignStyles = {
25
30
  export const GlyphRun = /*#__PURE__*/React.memo(({
26
31
  glyphs,
27
32
  layoutTransition,
33
+ leadingLayoutTransition,
34
+ leadingLayoutGroup = false,
28
35
  enterTransition,
29
36
  elementEnterTransition,
30
37
  exitTransition,
@@ -33,30 +40,42 @@ export const GlyphRun = /*#__PURE__*/React.memo(({
33
40
  align,
34
41
  textStyle,
35
42
  className
36
- }) =>
37
- /*#__PURE__*/
38
- // each token keeps its own view so reanimated can animate only changed content
39
- _jsx(View, {
40
- style: [rowStyle, rowAlignStyles[align]],
41
- children: glyphs.map((glyph, glyphIndex) => glyph.kind === "element" ? /*#__PURE__*/_jsx(Animated.View, {
42
- layout: layoutTransition,
43
- entering: elementEnterTransition ?? enterTransition,
44
- exiting: elementExitTransition ?? exitTransition,
45
- style: [{
46
- alignItems: "center",
47
- justifyContent: "center"
48
- }, glyphIndex === 0 && (leadingGap ?? 0) > 0 ? {
49
- marginRight: leadingGap
50
- } : undefined],
51
- children: glyph.element
52
- }, glyph.id) : /*#__PURE__*/_jsx(Animated.Text, {
43
+ }) => {
44
+ // The leading token is always first. Keep it outside the text row so its
45
+ // appearance moves the text as one unit instead of reflowing every glyph.
46
+ const leadingGlyph = glyphs[0]?.kind === "element" ? glyphs[0] : undefined;
47
+ const textGlyphs = leadingGlyph ? glyphs.slice(1) : glyphs;
48
+ const shouldGroupText = Boolean(leadingGlyph) || Boolean(leadingLayoutTransition) || leadingLayoutGroup;
49
+ const renderTextGlyph = glyph => glyph.kind === "text" ? /*#__PURE__*/_jsx(Animated.Text, {
53
50
  layout: layoutTransition,
54
51
  entering: enterTransition,
55
52
  exiting: exitTransition,
56
53
  style: textStyle,
57
54
  className: className,
58
55
  children: glyph.value
59
- }, glyph.id))
60
- }));
56
+ }, glyph.id) : null;
57
+ const textRow = /*#__PURE__*/_jsx(Animated.View, {
58
+ layout: leadingLayoutTransition,
59
+ style: textRowStyle,
60
+ children: textGlyphs.map(renderTextGlyph)
61
+ }, "text-row");
62
+ return /*#__PURE__*/_jsxs(View, {
63
+ style: [rowStyle, rowAlignStyles[align]],
64
+ children: [leadingGlyph ? /*#__PURE__*/_jsx(Animated.View, {
65
+ // leading elements own their enter/exit geometry; generic layout
66
+ // motion here would compete with those transitions
67
+ layout: undefined,
68
+ entering: elementEnterTransition ?? enterTransition,
69
+ exiting: elementExitTransition ?? exitTransition,
70
+ style: [{
71
+ alignItems: "center",
72
+ justifyContent: "center"
73
+ }, (leadingGap ?? 0) > 0 ? {
74
+ marginRight: leadingGap
75
+ } : undefined],
76
+ children: leadingGlyph.element
77
+ }, leadingGlyph.id) : null, shouldGroupText ? textRow : textGlyphs.map(renderTextGlyph)]
78
+ });
79
+ });
61
80
  GlyphRun.displayName = "GlyphRun";
62
81
  //# sourceMappingURL=glyph-run.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React","View","Animated","jsx","_jsx","rowStyle","flexDirection","alignItems","alignSelf","rowAlignStyles","left","center","right","GlyphRun","memo","glyphs","layoutTransition","enterTransition","elementEnterTransition","exitTransition","elementExitTransition","leadingGap","align","textStyle","className","style","children","map","glyph","glyphIndex","kind","layout","entering","exiting","justifyContent","marginRight","undefined","element","id","Text","value","displayName"],"sourceRoot":"../../../src","sources":["view/glyph-run.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAAyCC,IAAI,QAAQ,cAAc;AACnE,OAAOC,QAAQ,MAAM,yBAAyB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAO/C,MAAMC,QAAQ,GAAG;EACfC,aAAa,EAAE,KAAK;EACpBC,UAAU,EAAE,QAAQ;EACpBC,SAAS,EAAE;AACb,CAAU;AAEV,MAAMC,cAAc,GAAG;EACrBC,IAAI,EAAE;IAAEF,SAAS,EAAE;EAAa,CAAC;EACjCG,MAAM,EAAE;IAAEH,SAAS,EAAE;EAAS,CAAC;EAC/BI,KAAK,EAAE;IAAEJ,SAAS,EAAE;EAAW;AACjC,CAAU;;AAEV;AACA,OAAO,MAAMK,QAAQ,gBAAGb,KAAK,CAACc,IAAI,CAChC,CAAC;EACCC,MAAM;EACNC,gBAAgB;EAChBC,eAAe;EACfC,sBAAsB;EACtBC,cAAc;EACdC,qBAAqB;EACrBC,UAAU;EACVC,KAAK;EACLC,SAAS;EACTC;AAYD,CAAC;AAAA;AACA;AACEpB,IAAA,CAACH,IAAI;EAACwB,KAAK,EAAE,CAACpB,QAAQ,EAAEI,cAAc,CAACa,KAAK,CAAC,CAAE;EAAAI,QAAA,EAE5CX,MAAM,CAACY,GAAG,CAAC,CAACC,KAAK,EAAEC,UAAU,KAC5BD,KAAK,CAACE,IAAI,KAAK,SAAS,gBACtB1B,IAAA,CAACF,QAAQ,CAACD,IAAI;IAEZ8B,MAAM,EAAEf,gBAAiB;IACzBgB,QAAQ,EAAEd,sBAAsB,IAAID,eAAgB;IACpDgB,OAAO,EAAEb,qBAAqB,IAAID,cAAe;IACjDM,KAAK,EAAE,CACL;MAAElB,UAAU,EAAE,QAAQ;MAAE2B,cAAc,EAAE;IAAS,CAAC,EAClDL,UAAU,KAAK,CAAC,IAAI,CAACR,UAAU,IAAI,CAAC,IAAI,CAAC,GACrC;MAAEc,WAAW,EAAEd;IAAW,CAAC,GAC3Be,SAAS,CACb;IAAAV,QAAA,EAEDE,KAAK,CAACS;EAAO,GAXTT,KAAK,CAACU,EAYE,CAAC,gBAEhBlC,IAAA,CAACF,QAAQ,CAACqC,IAAI;IAEZR,MAAM,EAAEf,gBAAiB;IACzBgB,QAAQ,EAAEf,eAAgB;IAC1BgB,OAAO,EAAEd,cAAe;IACxBM,KAAK,EAAEF,SAAU;IACjBC,SAAS,EAAEA,SAAU;IAAAE,QAAA,EAEpBE,KAAK,CAACY;EAAK,GAPPZ,KAAK,CAACU,EAQE,CAEnB;AAAC,CACG,CAEZ,CAAC;AAEDzB,QAAQ,CAAC4B,WAAW,GAAG,UAAU","ignoreList":[]}
1
+ {"version":3,"names":["React","View","Animated","jsx","_jsx","jsxs","_jsxs","rowStyle","flexDirection","alignItems","alignSelf","textRowStyle","rowAlignStyles","left","center","right","GlyphRun","memo","glyphs","layoutTransition","leadingLayoutTransition","leadingLayoutGroup","enterTransition","elementEnterTransition","exitTransition","elementExitTransition","leadingGap","align","textStyle","className","leadingGlyph","kind","undefined","textGlyphs","slice","shouldGroupText","Boolean","renderTextGlyph","glyph","Text","layout","entering","exiting","style","children","value","id","textRow","map","justifyContent","marginRight","element","displayName"],"sourceRoot":"../../../src","sources":["view/glyph-run.tsx"],"mappings":"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","ignoreList":[]}
@@ -57,6 +57,7 @@ export const MorphViewport = /*#__PURE__*/React.memo(({
57
57
  align,
58
58
  containerStyle,
59
59
  animatedWidthStyle,
60
+ onVisibleLayout,
60
61
  measurement,
61
62
  children
62
63
  }) => {
@@ -75,6 +76,7 @@ export const MorphViewport = /*#__PURE__*/React.memo(({
75
76
  style: measuredContentStyle,
76
77
  children: measurement
77
78
  }), /*#__PURE__*/_jsx(Animated.View, {
79
+ onLayout: onVisibleLayout,
78
80
  style: [resolvedViewportStyle, animatedWidthStyle],
79
81
  children: children
80
82
  })]
@@ -1 +1 @@
1
- {"version":3,"names":["React","useMemo","View","Animated","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","shellStyle","position","alignSelf","viewportStyle","measuredContentStyle","left","top","opacity","flexShrink","clippedViewportStyle","overflow","unclippedViewportStyle","fullWidthViewportStyle","width","shellAlignStyles","center","right","viewportAlignStyles","alignItems","MorphViewport","memo","autoSize","clipToBounds","align","containerStyle","animatedWidthStyle","measurement","children","resolvedViewportStyle","style","accessibilityElementsHidden","collapsable","importantForAccessibility","pointerEvents","displayName"],"sourceRoot":"../../../src","sources":["view/morph-viewport.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AAEtC,SAASC,IAAI,QAAQ,cAAc;AACnC,OAAOC,QAAQ,MAAM,yBAAyB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,QAAA,IAAAC,SAAA,EAAAC,IAAA,IAAAC,KAAA;AAG/C,MAAMC,UAAU,GAAG;EACjBC,QAAQ,EAAE,UAAU;EACpBC,SAAS,EAAE;AACb,CAAU;AAEV,MAAMC,aAAa,GAAG;EACpBD,SAAS,EAAE;AACb,CAAU;AAEV,MAAME,oBAA+B,GAAG;EACtCH,QAAQ,EAAE,UAAU;EACpBI,IAAI,EAAE,CAAC;EACPC,GAAG,EAAE,CAAC;EACNC,OAAO,EAAE,CAAC;EACVL,SAAS,EAAE,YAAY;EACvBM,UAAU,EAAE;AACd,CAAC;AAED,MAAMC,oBAA+B,GAAG;EACtCC,QAAQ,EAAE;AACZ,CAAC;AAED,MAAMC,sBAAiC,GAAG;EACxCD,QAAQ,EAAE;AACZ,CAAC;AAED,MAAME,sBAAiC,GAAG;EACxCC,KAAK,EAAE;AACT,CAAC;AAED,MAAMC,gBAAiD,GAAG;EACxDT,IAAI,EAAE;IAAEH,SAAS,EAAE;EAAa,CAAC;EACjCa,MAAM,EAAE;IAAEb,SAAS,EAAE;EAAS,CAAC;EAC/Bc,KAAK,EAAE;IAAEd,SAAS,EAAE;EAAW;AACjC,CAAC;AAED,MAAMe,mBAAoD,GAAG;EAC3DZ,IAAI,EAAE;IAAEa,UAAU,EAAE;EAAa,CAAC;EAClCH,MAAM,EAAE;IAAEG,UAAU,EAAE;EAAS,CAAC;EAChCF,KAAK,EAAE;IAAEE,UAAU,EAAE;EAAW;AAClC,CAAC;AAYD;AACA,OAAO,MAAMC,aAAa,gBAAG7B,KAAK,CAAC8B,IAAI,CACrC,CAAC;EACCC,QAAQ;EACRC,YAAY;EACZC,KAAK;EACLC,cAAc;EACdC,kBAAkB;EAClBC,WAAW;EACXC;AACkB,CAAC,KAAK;EACxB;EACA,MAAMC,qBAAqB,GAAGrC,OAAO,CACnC,MAAM,CACJY,aAAa,EACbc,mBAAmB,CAACM,KAAK,CAAC,EAC1BD,YAAY,GAAGb,oBAAoB,GAAGE,sBAAsB,CAC7D,EACD,CAACY,KAAK,EAAED,YAAY,CACtB,CAAC;;EAED;EACA,oBACE3B,IAAA,CAACH,IAAI;IAACqC,KAAK,EAAE,CAAC7B,UAAU,EAAEc,gBAAgB,CAACS,KAAK,CAAC,EAAEC,cAAc,CAAE;IAAAG,QAAA,EAChEN,QAAQ,gBACPtB,KAAA,CAAAF,SAAA;MAAA8B,QAAA,gBACEhC,IAAA,CAACH,IAAI;QACHsC,2BAA2B;QAC3BC,WAAW,EAAE,KAAM;QACnBC,yBAAyB,EAAC,qBAAqB;QAC/CC,aAAa,EAAC,MAAM;QACpBJ,KAAK,EAAEzB,oBAAqB;QAAAuB,QAAA,EAE3BD;MAAW,CACR,CAAC,eACP/B,IAAA,CAACF,QAAQ,CAACD,IAAI;QAACqC,KAAK,EAAE,CAACD,qBAAqB,EAAEH,kBAAkB,CAAE;QAAAE,QAAA,EAC/DA;MAAQ,CACI,CAAC;IAAA,CAChB,CAAC,gBAEHhC,IAAA,CAACH,IAAI;MAACqC,KAAK,EAAE,CAACD,qBAAqB,EAAEhB,sBAAsB,CAAE;MAAAe,QAAA,EAC1DA;IAAQ,CACL;EACP,CACG,CAAC;AAEX,CACF,CAAC;AAEDR,aAAa,CAACe,WAAW,GAAG,eAAe","ignoreList":[]}
1
+ {"version":3,"names":["React","useMemo","View","Animated","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","shellStyle","position","alignSelf","viewportStyle","measuredContentStyle","left","top","opacity","flexShrink","clippedViewportStyle","overflow","unclippedViewportStyle","fullWidthViewportStyle","width","shellAlignStyles","center","right","viewportAlignStyles","alignItems","MorphViewport","memo","autoSize","clipToBounds","align","containerStyle","animatedWidthStyle","onVisibleLayout","measurement","children","resolvedViewportStyle","style","accessibilityElementsHidden","collapsable","importantForAccessibility","pointerEvents","onLayout","displayName"],"sourceRoot":"../../../src","sources":["view/morph-viewport.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AAEtC,SAASC,IAAI,QAAQ,cAAc;AACnC,OAAOC,QAAQ,MAAM,yBAAyB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,QAAA,IAAAC,SAAA,EAAAC,IAAA,IAAAC,KAAA;AAG/C,MAAMC,UAAU,GAAG;EACjBC,QAAQ,EAAE,UAAU;EACpBC,SAAS,EAAE;AACb,CAAU;AAEV,MAAMC,aAAa,GAAG;EACpBD,SAAS,EAAE;AACb,CAAU;AAEV,MAAME,oBAA+B,GAAG;EACtCH,QAAQ,EAAE,UAAU;EACpBI,IAAI,EAAE,CAAC;EACPC,GAAG,EAAE,CAAC;EACNC,OAAO,EAAE,CAAC;EACVL,SAAS,EAAE,YAAY;EACvBM,UAAU,EAAE;AACd,CAAC;AAED,MAAMC,oBAA+B,GAAG;EACtCC,QAAQ,EAAE;AACZ,CAAC;AAED,MAAMC,sBAAiC,GAAG;EACxCD,QAAQ,EAAE;AACZ,CAAC;AAED,MAAME,sBAAiC,GAAG;EACxCC,KAAK,EAAE;AACT,CAAC;AAED,MAAMC,gBAAiD,GAAG;EACxDT,IAAI,EAAE;IAAEH,SAAS,EAAE;EAAa,CAAC;EACjCa,MAAM,EAAE;IAAEb,SAAS,EAAE;EAAS,CAAC;EAC/Bc,KAAK,EAAE;IAAEd,SAAS,EAAE;EAAW;AACjC,CAAC;AAED,MAAMe,mBAAoD,GAAG;EAC3DZ,IAAI,EAAE;IAAEa,UAAU,EAAE;EAAa,CAAC;EAClCH,MAAM,EAAE;IAAEG,UAAU,EAAE;EAAS,CAAC;EAChCF,KAAK,EAAE;IAAEE,UAAU,EAAE;EAAW;AAClC,CAAC;AAaD;AACA,OAAO,MAAMC,aAAa,gBAAG7B,KAAK,CAAC8B,IAAI,CACrC,CAAC;EACCC,QAAQ;EACRC,YAAY;EACZC,KAAK;EACLC,cAAc;EACdC,kBAAkB;EAClBC,eAAe;EACfC,WAAW;EACXC;AACkB,CAAC,KAAK;EACxB;EACA,MAAMC,qBAAqB,GAAGtC,OAAO,CACnC,MAAM,CACJY,aAAa,EACbc,mBAAmB,CAACM,KAAK,CAAC,EAC1BD,YAAY,GAAGb,oBAAoB,GAAGE,sBAAsB,CAC7D,EACD,CAACY,KAAK,EAAED,YAAY,CACtB,CAAC;;EAED;EACA,oBACE3B,IAAA,CAACH,IAAI;IAACsC,KAAK,EAAE,CAAC9B,UAAU,EAAEc,gBAAgB,CAACS,KAAK,CAAC,EAAEC,cAAc,CAAE;IAAAI,QAAA,EAChEP,QAAQ,gBACPtB,KAAA,CAAAF,SAAA;MAAA+B,QAAA,gBACEjC,IAAA,CAACH,IAAI;QACHuC,2BAA2B;QAC3BC,WAAW,EAAE,KAAM;QACnBC,yBAAyB,EAAC,qBAAqB;QAC/CC,aAAa,EAAC,MAAM;QACpBJ,KAAK,EAAE1B,oBAAqB;QAAAwB,QAAA,EAE3BD;MAAW,CACR,CAAC,eACPhC,IAAA,CAACF,QAAQ,CAACD,IAAI;QACZ2C,QAAQ,EAAET,eAAgB;QAC1BI,KAAK,EAAE,CAACD,qBAAqB,EAAEJ,kBAAkB,CAAE;QAAAG,QAAA,EAElDA;MAAQ,CACI,CAAC;IAAA,CAChB,CAAC,gBAEHjC,IAAA,CAACH,IAAI;MAACsC,KAAK,EAAE,CAACD,qBAAqB,EAAEjB,sBAAsB,CAAE;MAAAgB,QAAA,EAC1DA;IAAQ,CACL;EACP,CACG,CAAC;AAEX,CACF,CAAC;AAEDT,aAAa,CAACiB,WAAW,GAAG,eAAe","ignoreList":[]}
@@ -12,24 +12,44 @@ export const TextRun = /*#__PURE__*/React.memo(({
12
12
  motionRecipe,
13
13
  align,
14
14
  leading,
15
+ leadingLayoutGroup = false,
15
16
  leadingKey,
16
17
  leadingGap = 0,
18
+ ready = true,
17
19
  textStyle,
18
20
  className
19
21
  }) => {
20
22
  // namespace ids per instance so repeated strings do not collide
21
23
  const scopeId = useId();
22
- const lastValueRef = useRef(value);
23
- const lastLeadingPresenceRef = useRef(Boolean(leading));
24
- const lastLeadingKeyRef = useRef(leadingKey);
24
+ const hasDisplayedRef = useRef(false);
25
+ const displayedValueRef = useRef(value);
26
+ const displayedLeadingRef = useRef(leading);
27
+ const displayedLeadingKeyRef = useRef(leadingKey);
28
+ const displayedLeadingGapRef = useRef(leadingGap);
29
+ const shouldDisplayTarget = ready || !hasDisplayedRef.current;
30
+ const visibleValue = shouldDisplayTarget ? value : displayedValueRef.current;
31
+ const visibleLeading = shouldDisplayTarget ? leading : displayedLeadingRef.current;
32
+ const visibleLeadingKey = shouldDisplayTarget ? leadingKey : displayedLeadingKeyRef.current;
33
+ const visibleLeadingGap = shouldDisplayTarget ? leadingGap : displayedLeadingGapRef.current;
34
+ if (shouldDisplayTarget) {
35
+ hasDisplayedRef.current = true;
36
+ displayedValueRef.current = value;
37
+ displayedLeadingRef.current = leading;
38
+ displayedLeadingKeyRef.current = leadingKey;
39
+ displayedLeadingGapRef.current = leadingGap;
40
+ }
41
+ const lastValueRef = useRef(visibleValue);
42
+ const lastLeadingPresenceRef = useRef(Boolean(visibleLeading));
43
+ const lastLeadingKeyRef = useRef(visibleLeadingKey);
25
44
  const hasAnimatedRef = useRef(false);
26
- const isLeadingSwap = Boolean(leading) && lastLeadingPresenceRef.current && leadingKey !== lastLeadingKeyRef.current;
45
+ const isLeadingSwap = Boolean(visibleLeading) && lastLeadingPresenceRef.current && visibleLeadingKey !== lastLeadingKeyRef.current;
46
+ const isLeadingChange = Boolean(visibleLeading) !== lastLeadingPresenceRef.current || Boolean(visibleLeading) && visibleLeadingKey !== lastLeadingKeyRef.current;
27
47
  // update the worklet flag after commit so render never writes a shared value
28
48
  const leadingSwapProgress = useSharedValue(0);
29
49
  useLayoutEffect(() => {
30
50
  leadingSwapProgress.value = isLeadingSwap ? 1 : 0;
31
51
  }, [isLeadingSwap, leadingSwapProgress]);
32
- const glyphs = useTextGlyphs(value, scopeId, leading, leadingKey);
52
+ const glyphs = useTextGlyphs(visibleValue, scopeId, visibleLeading, visibleLeadingKey);
33
53
  const elementEnterTransition = useMemo(() => createLeadingEnterTransition({
34
54
  durationMs: motionRecipe.durationMs,
35
55
  easing: motionRecipe.easing
@@ -37,26 +57,28 @@ export const TextRun = /*#__PURE__*/React.memo(({
37
57
  const elementExitTransition = useMemo(() => createLeadingExitTransition({
38
58
  durationMs: motionRecipe.durationMs,
39
59
  easing: motionRecipe.easing,
40
- leadingGap,
60
+ leadingGap: visibleLeadingGap,
41
61
  scale: leadingSwapProgress
42
- }), [leadingGap, leadingSwapProgress, motionRecipe.durationMs, motionRecipe.easing]);
62
+ }), [visibleLeadingGap, leadingSwapProgress, motionRecipe.durationMs, motionRecipe.easing]);
43
63
 
44
64
  // mark the first value as settled and later changes as eligible for motion
45
- if (value !== lastValueRef.current || Boolean(leading) !== lastLeadingPresenceRef.current || leadingKey !== lastLeadingKeyRef.current) {
65
+ if (visibleValue !== lastValueRef.current || Boolean(visibleLeading) !== lastLeadingPresenceRef.current || visibleLeadingKey !== lastLeadingKeyRef.current) {
46
66
  hasAnimatedRef.current = true;
47
- lastValueRef.current = value;
48
- lastLeadingPresenceRef.current = Boolean(leading);
49
- lastLeadingKeyRef.current = leadingKey;
67
+ lastValueRef.current = visibleValue;
68
+ lastLeadingPresenceRef.current = Boolean(visibleLeading);
69
+ lastLeadingKeyRef.current = visibleLeadingKey;
50
70
  }
51
71
  const hasAnimated = hasAnimatedRef.current;
52
72
  return /*#__PURE__*/_jsx(GlyphRun, {
53
73
  glyphs: glyphs,
54
74
  layoutTransition: hasAnimated ? motionRecipe.layoutTransition : undefined,
75
+ leadingLayoutTransition: isLeadingChange ? motionRecipe.layoutTransition : undefined,
76
+ leadingLayoutGroup: leadingLayoutGroup,
55
77
  enterTransition: hasAnimatedRef.current ? motionRecipe.enterTransition : undefined,
56
78
  elementEnterTransition: isLeadingSwap ? elementEnterTransition : undefined,
57
79
  exitTransition: motionRecipe.exitTransition,
58
80
  elementExitTransition: elementExitTransition,
59
- leadingGap: leadingGap,
81
+ leadingGap: visibleLeadingGap,
60
82
  align: align,
61
83
  textStyle: textStyle,
62
84
  className: className