@grahlnn/comps 0.1.5 → 0.1.6

package/dist/index.js

@@ -3692,18 +3692,6 @@ function getMeasurementLayerStyle(layoutContext, useContentInlineSize = false) {
 function resolveFlowText(committedMeasurement, stateMeasurement, text) {
   return committedMeasurement?.snapshot.text ?? stateMeasurement?.snapshot.text ?? text;
 }
-function resolveVisibleFlowText(pendingBootstrapText, committedMeasurement, stateMeasurement, text) {
-  return pendingBootstrapText ?? resolveFlowText(committedMeasurement, stateMeasurement, text);
-}
-function resolveActivationBootstrapText(isActivated, previousText, nextText) {
-  if (!isActivated && nextText !== previousText) {
-    return previousText;
-  }
-  return null;
-}
-function shouldDeferTargetMeasurement(committedMeasurement, pendingBootstrapText, text) {
-  return committedMeasurement === null && pendingBootstrapText !== null && pendingBootstrapText !== text;
-}
 function getOverlayStyle(plan) {
   return {
     ...OVERLAY_STYLE,
@@ -3791,55 +3779,29 @@ function MeasurementLayer({
     }, segment.key, false, undefined, this))
   }, undefined, false, undefined, this);
 }
-function useMorphTransition(text, className, bootstrapText = null) {
+function useMorphTransition(text, className) {
   const { ref, layoutContext } = useObservedLayoutContext([className]);
   const measurementLayerRef = useRef(null);
-  const bootstrapMeasurementLayerRef = useRef(null);
   const completedDomMeasurementKeyRef = useRef(null);
   const domMeasurementSnapshotCacheRef = useRef(new Map);
-  const pendingBootstrapTextRef = useRef(bootstrapText);
   const sessionRef = useRef({ ...EMPTY_SESSION });
   const timelineRef = useRef({ ...EMPTY_TIMELINE });
   const [domMeasurementRequestKey, setDomMeasurementRequestKey] = useState(null);
   const [state, setState] = useState(EMPTY_STATE);
-  if (pendingBootstrapTextRef.current === null && bootstrapText !== null && bootstrapText !== text && sessionRef.current.committed === null) {
-    pendingBootstrapTextRef.current = bootstrapText;
-  }
   let measurementHint = sessionRef.current.committed;
   if (sessionRef.current.animating) {
     measurementHint = sessionRef.current.target ?? sessionRef.current.committed;
   }
-  let pendingBootstrapText = null;
-  if (sessionRef.current.committed === null) {
-    pendingBootstrapText = pendingBootstrapTextRef.current;
-  }
-  const isBootstrapping = shouldDeferTargetMeasurement(sessionRef.current.committed, pendingBootstrapText, text);
-  const measurementRequest = useMemo(() => {
-    if (isBootstrapping) {
-      return null;
-    }
-    return createMorphMeasurementRequest({
-      text,
-      layoutContext,
-      layoutHint: measurementHint
-    });
-  }, [text, layoutContext, measurementHint, isBootstrapping]);
-  const bootstrapMeasurementRequest = useMemo(() => {
-    if (!isBootstrapping || pendingBootstrapText === null) {
-      return null;
-    }
-    return createMorphMeasurementRequest({
-      text: pendingBootstrapText,
-      layoutContext,
-      layoutHint: null
-    });
-  }, [pendingBootstrapText, layoutContext, isBootstrapping]);
+  const measurementRequest = useMemo(() => createMorphMeasurementRequest({
+    text,
+    layoutContext,
+    layoutHint: measurementHint
+  }), [text, layoutContext, measurementHint]);
   const renderText = measurementRequest?.renderText ?? text;
   const useContentInlineSize = measurementRequest?.useContentInlineSize ?? false;
   const measurementBackend = measurementRequest?.measurementBackend ?? null;
   const segments = measurementRequest?.segments ?? EMPTY_SEGMENTS;
   const domMeasurementKey = measurementRequest?.domMeasurementKey ?? null;
-  const shouldRenderBootstrapSourceMeasurementLayer = bootstrapMeasurementRequest?.domMeasurementKey !== null;
   useLayoutEffect(() => {
     if (ref.current === null || layoutContext === null) {
       completedDomMeasurementKeyRef.current = null;
@@ -3861,36 +3823,6 @@ function useMorphTransition(text, className, bootstrapText = null) {
       });
       return;
     }
-    if (isBootstrapping && bootstrapMeasurementRequest !== null) {
-      let bootstrapDomSnapshot = null;
-      if (bootstrapMeasurementRequest.domMeasurementKey !== null && canCacheMeasurementLayerSnapshot(bootstrapMeasurementRequest.measurementBackend)) {
-        bootstrapDomSnapshot = readCachedMorphSnapshot(domMeasurementSnapshotCacheRef.current, bootstrapMeasurementRequest.domMeasurementKey);
-      }
-      if (bootstrapMeasurementRequest.domMeasurementKey !== null && bootstrapDomSnapshot === null && bootstrapMeasurementLayerRef.current === null) {
-        return;
-      }
-      const bootstrapMeasurement = measureFromNodes({
-        root: ref.current,
-        layoutContext,
-        layoutHint: null,
-        layer: bootstrapMeasurementLayerRef.current,
-        measurementBackend: bootstrapMeasurementRequest.measurementBackend,
-        snapshotOverride: bootstrapDomSnapshot,
-        text: bootstrapMeasurementRequest.text,
-        renderText: bootstrapMeasurementRequest.renderText,
-        segments: bootstrapMeasurementRequest.segments
-      });
-      if (bootstrapMeasurementRequest.domMeasurementKey !== null && bootstrapDomSnapshot === null && canCacheMeasurementLayerSnapshot(bootstrapMeasurementRequest.measurementBackend)) {
-        rememberCachedMorphSnapshot(domMeasurementSnapshotCacheRef.current, bootstrapMeasurementRequest.domMeasurementKey, bootstrapMeasurement.snapshot);
-      }
-      completedDomMeasurementKeyRef.current = null;
-      pendingBootstrapTextRef.current = null;
-      if (domMeasurementRequestKey !== null) {
-        setDomMeasurementRequestKey(null);
-      }
-      commitStaticMeasurement(sessionRef.current, bootstrapMeasurement, setState);
-      return;
-    }
     if (domMeasurementKey !== null) {
       let cachedSnapshot = null;
       if (canCacheMeasurementLayerSnapshot(measurementBackend)) {
@@ -3977,9 +3909,6 @@ function useMorphTransition(text, className, bootstrapText = null) {
     layoutContext,
     measurementBackend,
     measurementRequest,
-    isBootstrapping,
-    pendingBootstrapText,
-    bootstrapMeasurementRequest,
     domMeasurementKey,
     domMeasurementRequestKey
   ]);
@@ -4000,70 +3929,33 @@ function useMorphTransition(text, className, bootstrapText = null) {
     committedMeasurement: sessionRef.current.committed,
     domMeasurementRequestKey,
     ref,
-    bootstrapMeasurementLayerRef,
-    measurementBackend,
     measurementLayerRef,
     renderText,
     segments,
     layoutContext,
     state,
-    pendingBootstrapText,
-    shouldRenderBootstrapSourceMeasurementLayer,
-    bootstrapMeasurementRequest,
     useContentInlineSize
   };
 }
-function StaticTorph({ text, className }) {
-  return /* @__PURE__ */ jsxDEV("div", {
-    className,
-    children: [
-      /* @__PURE__ */ jsxDEV("span", {
-        style: SCREEN_READER_ONLY_STYLE,
-        children: text
-      }, undefined, false, undefined, this),
-      /* @__PURE__ */ jsxDEV("span", {
-        "aria-hidden": "true",
-        style: FALLBACK_TEXT_STYLE,
-        children: text
-      }, undefined, false, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
-}
 function ActiveTorph({
   text,
-  className,
-  bootstrapText
+  className
 }) {
   const {
     committedMeasurement,
     domMeasurementRequestKey,
     ref,
-    bootstrapMeasurementLayerRef,
-    measurementBackend,
     measurementLayerRef,
     renderText,
     segments,
     layoutContext,
     state,
-    pendingBootstrapText,
-    shouldRenderBootstrapSourceMeasurementLayer,
-    bootstrapMeasurementRequest,
     useContentInlineSize
-  } = useMorphTransition(text, className, bootstrapText);
+  } = useMorphTransition(text, className);
   const plan = state.plan;
   const shouldRenderOverlay = state.stage !== "idle" && plan !== null;
   const shouldRenderMeasurementLayer = domMeasurementRequestKey !== null;
-  const flowText = resolveVisibleFlowText(pendingBootstrapText, committedMeasurement, state.measurement, text);
-  let bootstrapMeasurementLayer = null;
-  if (shouldRenderBootstrapSourceMeasurementLayer && bootstrapMeasurementRequest !== null) {
-    bootstrapMeasurementLayer = /* @__PURE__ */ jsxDEV(MeasurementLayer, {
-      layerRef: bootstrapMeasurementLayerRef,
-      layoutContext,
-      text: bootstrapMeasurementRequest.renderText,
-      segments: bootstrapMeasurementRequest.segments,
-      useContentInlineSize: bootstrapMeasurementRequest.useContentInlineSize
-    }, undefined, false, undefined, this);
-  }
+  const flowText = resolveFlowText(committedMeasurement, state.measurement, text);
   let measurementLayer = null;
   if (shouldRenderMeasurementLayer) {
     measurementLayer = /* @__PURE__ */ jsxDEV(MeasurementLayer, {
@@ -4095,7 +3987,6 @@ function ActiveTorph({
         style: getFallbackTextStyle(shouldRenderOverlay),
         children: flowText
       }, undefined, false, undefined, this),
-      bootstrapMeasurementLayer,
       measurementLayer,
       overlay
     ]
@@ -4105,37 +3996,15 @@ function Torph({
   text,
   className
 }) {
-  const [isActivated, setIsActivated] = useState(false);
-  const previousTextRef = useRef(text);
-  const bootstrapText = resolveActivationBootstrapText(isActivated, previousTextRef.current, text);
-  const shouldActivate = isActivated || bootstrapText !== null;
-  useLayoutEffect(() => {
-    if (!isActivated && text !== previousTextRef.current) {
-      previousTextRef.current = text;
-      setIsActivated(true);
-      return;
-    }
-    previousTextRef.current = text;
-  }, [isActivated, text]);
-  if (shouldActivate) {
-    return /* @__PURE__ */ jsxDEV(ActiveTorph, {
-      text,
-      className,
-      bootstrapText
-    }, undefined, false, undefined, this);
-  }
-  return /* @__PURE__ */ jsxDEV(StaticTorph, {
+  return /* @__PURE__ */ jsxDEV(ActiveTorph, {
     text,
     className
   }, undefined, false, undefined, this);
 }
 export {
   supportsIntrinsicWidthLock,
-  shouldDeferTargetMeasurement,
-  resolveVisibleFlowText,
   resolveMorphFrameBounds,
   resolveFlowText,
-  resolveActivationBootstrapText,
   pairMorphCharacters,
   needsMeasurementLayer,
   measureMorphSnapshotFromLayer,

package/dist/torph/src/components/Torph.d.ts

@@ -95,9 +95,6 @@ export declare function getRootDisplay(layoutContext: LayoutContext | null): "gr
 export declare function getRootStyle(stage: MorphStage, plan: MorphRenderPlan | null, measurement: MorphMeasurement | null, layoutContext: LayoutContext | null): CSSProperties;
 export declare function getMeasurementLayerStyle(layoutContext: LayoutContext | null, useContentInlineSize?: boolean): CSSProperties;
 export declare function resolveFlowText(committedMeasurement: MorphMeasurement | null, stateMeasurement: MorphMeasurement | null, text: string): string;
-export declare function resolveVisibleFlowText(pendingBootstrapText: string | null, committedMeasurement: MorphMeasurement | null, stateMeasurement: MorphMeasurement | null, text: string): string;
-export declare function resolveActivationBootstrapText(isActivated: boolean, previousText: string, nextText: string): string | null;
-export declare function shouldDeferTargetMeasurement(committedMeasurement: MorphMeasurement | null, pendingBootstrapText: string | null, text: string): boolean;
 export declare function Torph({ text, className, }: {
     text: string;
     className?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grahlnn/comps",
-  "version": "0.1.5",
+  "version": "0.1.6",
   "description": "React components from grahlnn/comps.",
   "main": "./dist/index.js",
   "module": "./dist/index.js",