@remotion/rough-notation 4.0.527 → 4.0.529

package/dist/Annotation.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { type InteractiveBaseProps, type InteractivitySchema } from 'remotion';
+import { type InteractiveBaseProps, type InteractivePremountProps, type InteractivitySchema } from 'remotion';
 import type { BoxConfig, BracketAnnotationConfig, CircleConfig, CrossedOffConfig, CurveAnnotationOptions, HighlightConfig, SharedRoughAnnotationOptions, StrikeThroughConfig, UnderlineConfig } from './types';
 type SharedAnnotationComponentProps = Readonly<{
     readonly children: React.ReactNode;
@@ -8,7 +8,7 @@ type SharedAnnotationComponentProps = Readonly<{
     readonly disabled?: boolean;
     readonly style?: React.CSSProperties;
 } & SharedRoughAnnotationOptions>;
-type AnnotationInteractiveProps<Config> = SharedAnnotationComponentProps & Readonly<Config> & InteractiveBaseProps;
+type AnnotationInteractiveProps<Config> = SharedAnnotationComponentProps & Readonly<Config> & InteractiveBaseProps & InteractivePremountProps;
 export type HighlightProps = AnnotationInteractiveProps<HighlightConfig>;
 export type UnderlineProps = AnnotationInteractiveProps<UnderlineConfig>;
 export type StrikeThroughProps = AnnotationInteractiveProps<StrikeThroughConfig>;

package/dist/esm/index.mjs

@@ -2,7 +2,9 @@
 import React2, { useMemo as useMemo3 } from "react";
 import {
   Interactive,
-  Sequence
+  Freeze,
+  Sequence,
+  Internals
 } from "remotion";
 
 // src/create-annotation.tsx
@@ -98,6 +100,9 @@ var useElementSize = (ref) => {
 };
 
 // ../paths/dist/esm/index.mjs
+import {
+  interpolate
+} from "remotion/no-react";
 var tValues = [
   [],
   [],
@@ -1087,9 +1092,31 @@ var makeInstructions = (arr, instruction, cb) => {
 };
 var segmentRegExp = /([astvzqmhlc])([^astvzqmhlc]*)/gi;
 var numberRegExp = /-?[0-9]*\.?[0-9]+(?:e[-+]?\d+)?/gi;
+var arcNumberRegExp = /[\s,]*([-+]?(?:[0-9]+\.?[0-9]*|\.[0-9]+)(?:e[-+]?\d+)?)/iy;
+var arcFlagRegExp = /[\s,]*([01])/y;
 var parseValues = (args, instructionType) => {
-  const numbers = args.match(numberRegExp);
-  if (!numbers) {
+  let numbers;
+  if (instructionType === "A" || instructionType === "a") {
+    numbers = [];
+    let match;
+    let lastIndex = 0;
+    do {
+      const regExp = numbers.length % 7 === 3 || numbers.length % 7 === 4 ? arcFlagRegExp : arcNumberRegExp;
+      regExp.lastIndex = lastIndex;
+      match = regExp.exec(args);
+      if (match) {
+        numbers.push(match[1]);
+        lastIndex = regExp.lastIndex;
+      }
+    } while (match);
+    const rest = args.slice(lastIndex);
+    if (!/^[\s,]*$/.test(rest)) {
+      throw new Error(`Malformed path data: ${instructionType} has an invalid value at "${rest.trim()}"`);
+    }
+  } else {
+    numbers = args.match(numberRegExp);
+  }
+  if (!numbers || numbers.length === 0) {
     if (instructionType === "Z" || instructionType === "z") {
       return [];
     }
@@ -2651,6 +2678,7 @@ var iterationsSchema = (defaultValue) => ({
     type: "number",
     min: 1,
     step: 1,
+    integer: true,
     default: defaultValue,
     description: "Iterations",
     hiddenFromList: false
@@ -2719,6 +2747,7 @@ var curveControlsSchema = {
     type: "number",
     min: 1,
     step: 1,
+    integer: true,
     default: 9,
     description: "Curve Step Count",
     hiddenFromList: false
@@ -2767,6 +2796,7 @@ var textContentSchema = {
 };
 var sharedSchema = (defaultRoughness) => ({
   ...Interactive.baseSchema,
+  ...Interactive.premountSchema,
   progress: {
     type: "number",
     min: 0,
@@ -2880,7 +2910,12 @@ var makeAnnotationComponent = ({
     children,
     durationInFrames,
     from,
+    premountFor,
+    postmountFor,
+    styleWhilePremounted,
+    styleWhilePostmounted,
     trimBefore,
+    playbackRate,
     freeze,
     hidden,
     name,
@@ -2918,30 +2953,61 @@ var makeAnnotationComponent = ({
       disableMultiStroke,
       preserveVertices
     });
-    return /* @__PURE__ */ jsx3(Sequence, {
-      layout: "none",
+    const {
+      effectivePremountFor,
+      effectivePostmountFor,
+      freezeFrame,
+      isPremountingOrPostmounting,
+      premountingActive,
+      postmountingActive,
+      premountingStyle
+    } = Internals.usePremounting({
       from: from ?? 0,
-      trimBefore,
       durationInFrames: durationInFrames ?? Infinity,
-      freeze,
-      hidden,
-      name: name ?? `<${componentName}>`,
-      showInTimeline: showInTimeline ?? true,
-      controls,
-      _remotionInternalDocumentationLink: `https://www.remotion.dev/docs/rough-notation/${documentationSlug}`,
-      outlineRef,
-      children: /* @__PURE__ */ jsx3("span", {
-        ref: outlineRef,
-        style: { display: "inline-block", position: "relative" },
-        children: /* @__PURE__ */ jsxs(annotation.Container, {
-          children: [
-            layer === "behind" ? annotationElement : null,
-            /* @__PURE__ */ jsx3(annotation.Tracker, {
-              style,
-              children
-            }),
-            layer === "on-top" ? annotationElement : null
-          ]
+      premountFor: premountFor ?? null,
+      postmountFor: postmountFor ?? null,
+      style: null,
+      styleWhilePremounted: styleWhilePremounted ?? null,
+      styleWhilePostmounted: styleWhilePostmounted ?? null,
+      hideWhilePremounted: "opacity"
+    });
+    return /* @__PURE__ */ jsx3(Freeze, {
+      frame: freezeFrame,
+      active: isPremountingOrPostmounting,
+      children: /* @__PURE__ */ jsx3(Sequence, {
+        layout: "none",
+        from: from ?? 0,
+        trimBefore,
+        playbackRate,
+        durationInFrames: durationInFrames ?? Infinity,
+        freeze,
+        hidden,
+        name: name ?? `<${componentName}>`,
+        showInTimeline: showInTimeline ?? true,
+        controls,
+        _remotionInternalDocumentationLink: `https://www.remotion.dev/docs/rough-notation/${documentationSlug}`,
+        outlineRef,
+        _remotionInternalPremountDisplay: effectivePremountFor || null,
+        _remotionInternalPostmountDisplay: effectivePostmountFor || null,
+        _remotionInternalIsPremounting: premountingActive,
+        _remotionInternalIsPostmounting: postmountingActive,
+        children: /* @__PURE__ */ jsx3("span", {
+          ref: outlineRef,
+          style: {
+            display: "inline-block",
+            position: "relative",
+            ...premountingStyle
+          },
+          children: /* @__PURE__ */ jsxs(annotation.Container, {
+            children: [
+              layer === "behind" ? annotationElement : null,
+              /* @__PURE__ */ jsx3(annotation.Tracker, {
+                style,
+                children
+              }),
+              layer === "on-top" ? annotationElement : null
+            ]
+          })
         })
       })
     });

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@remotion/rough-notation",
-	"version": "4.0.527",
+	"version": "4.0.529",
 	"description": "Rough annotation primitives for Remotion",
 	"main": "dist/index.js",
 	"types": "dist/index.d.ts",
@@ -26,8 +26,8 @@
 		"url": "https://github.com/remotion-dev/remotion/issues"
 	},
 	"dependencies": {
-		"@remotion/paths": "4.0.527",
-		"remotion": "4.0.527",
+		"@remotion/paths": "4.0.529",
+		"remotion": "4.0.529",
 		"roughjs": "4.6.6"
 	},
 	"peerDependencies": {
@@ -45,7 +45,7 @@
 	"devDependencies": {
 		"react": "19.2.3",
 		"react-dom": "19.2.3",
-		"@remotion/eslint-config-internal": "4.0.527",
+		"@remotion/eslint-config-internal": "4.0.529",
 		"eslint": "9.19.0",
 		"@typescript/native-preview": "7.0.0-dev.20260217.1"
 	},