unframer 4.1.9 → 4.2.0

package/src/exporter.ts

@@ -8,8 +8,6 @@ const require = createRequire(import.meta.url)
 
 import { Sema } from 'async-sema'
 
-import { nodeModulesPolyfillPlugin } from 'esbuild-plugins-node-modules-polyfill'
-
 import { transform } from '@babel/core'
 import { exec } from 'child_process'
 import { error } from 'console'
@@ -219,7 +217,6 @@ export async function bundle({
                     missingPackages.add(pkg)
                 },
             }),
-            nodeModulesPolyfillPlugin({}),
             {
                 name: 'virtual loader',
                 setup(build) {
@@ -577,17 +574,28 @@ export async function bundle({
             ?.split('\n')
             .forEach((x) => logger.log(x))
 
+        function isChunkPath(filePath: string) {
+            return (
+                filePath.includes('/chunks/') ||
+                filePath.includes('\\chunks\\')
+            )
+        }
         const jsxFiles = buildResult.outputFiles
             .filter(
                 (x) =>
                     x.path.endsWith('.js') &&
+                    !isChunkPath(x.path) &&
                     fs.existsSync(getFilePaths(x.path, out).jsxPath),
             )
             .map((x) => getFilePaths(x.path, out).jsxPath)
         const outFiles = buildResult.outputFiles
             .map((x) => {
                 const paths = getFilePaths(x.path, out)
-                if (x.path.endsWith('.js') && fs.existsSync(paths.jsxPath)) {
+                if (
+                    x.path.endsWith('.js') &&
+                    !isChunkPath(x.path) &&
+                    fs.existsSync(paths.jsxPath)
+                ) {
                     return null // Will be handled by jsx files
                 }
                 return paths.finalJsPath
@@ -737,8 +745,17 @@ export async function bundle({
                         formatted = result.content
                     }
                 } catch (e) {
+                    spinner.warn(
+                        `Babel/Biome formatting failed for ${componentName}: ${e instanceof Error ? e.message : e}`,
+                    )
+                    logger.log(e instanceof Error ? e.stack : e)
                     notifyError(e, 'babel transform and format')
                 }
+            } else if (tooBig) {
+                const sizeMB = (file.text.length / (1024 * 1024)).toFixed(2)
+                spinner.warn(
+                    `Skipping JSX formatting for ${componentName} (${sizeMB} MB exceeds ${(tooBigSize / (1024 * 1024)).toFixed(2)} MB limit)`,
+                )
             }
 
             const prefix =
@@ -752,12 +769,24 @@ export async function bundle({
             // Always write the temp .js file for type extraction
             await fs.promises.writeFile(paths.tempJsPath, codeJs, 'utf-8')
 
-            // Only write .jsx file if it's different from existing or if formatting was done
+            // Write .jsx file if formatting succeeded, or fall back to writing
+            // unformatted .js content into the .jsx path when formatting fails
+            // (babel error, component too big, etc.) but a stale .jsx already
+            // exists on disk. Without this fallback the stale .jsx keeps old
+            // chunk imports while the old chunks are deleted, breaking the build.
             if (didFormat && codeJsx !== existing) {
                 await fs.promises.writeFile(paths.jsxPath, codeJsx, 'utf-8')
                 logger.log(`Updated JSX file for ${componentName}`)
             } else if (didFormat) {
                 logger.log(`JSX file unchanged for ${componentName}`)
+            } else if (existing && codeJs !== existing) {
+                // Formatting failed but .jsx exists with stale content (e.g.
+                // old chunk hashes). Overwrite with unformatted JS so imports
+                // stay in sync with the current build's chunks.
+                await fs.promises.writeFile(paths.jsxPath, codeJs, 'utf-8')
+                logger.log(
+                    `Updated JSX file (unformatted) for ${componentName}`,
+                )
             }
         }
         spinner.stop()
@@ -772,8 +801,12 @@ export async function bundle({
             if (file.path.endsWith('.js')) {
                 const paths = getFilePaths(file.path, out)
 
-                if (fs.existsSync(paths.jsxPath)) {
+                if (
+                    !isChunkPath(paths.tempJsPath) &&
+                    fs.existsSync(paths.jsxPath)
+                ) {
                     // Remove temp .js file if .jsx equivalent exists
+                    // (never applies to chunks which stay as .js)
                     logger.log(
                         'removing temp JS file with JSX equivalent:',
                         path.relative(out, paths.tempJsPath),

package/src/framer.d.ts

@@ -4859,4 +4859,132 @@ export declare const withVariantFX: <T extends MotionProps>(Component: React_2.C
 export { }
 export declare const combinedCSSRules: string[]
 
+export interface FramerMotionGlobalConfig {
+    useManualTiming?: boolean
+    instantAnimations?: boolean
+    skipAnimations?: boolean
+    mix?: unknown
+    WillChange?: new (value: string) => unknown
+}
+
+export interface FramerInjectedRuntimeImage {
+    src?: string
+    srcSet?: string
+}
+
+export interface FramerInjectedRuntimeRect {
+    width?: number
+    height?: number
+}
+
+export interface FramerInjectedRuntime {
+    imagePlaceholderSvg?: string
+    useImageSource?(image: FramerInjectedRuntimeImage, rect?: FramerInjectedRuntimeRect, nodeId?: string): string
+    useImageElement?(image: FramerInjectedRuntimeImage, rect?: FramerInjectedRuntimeRect, nodeId?: string): HTMLImageElement
+    canRenderOptimizedCanvasImage?(src?: string): boolean
+    isOnPageCanvas?: boolean
+}
+
+export interface FramerMotionFrameData {
+    delta: number
+    timestamp: number
+    isProcessing: boolean
+}
+
+export type FramerMotionFrameCallback = (frameData: FramerMotionFrameData) => void
+
+export interface FramerMotionFrameStep {
+    schedule(callback: FramerMotionFrameCallback, keepAlive?: boolean, immediate?: boolean): FramerMotionFrameCallback
+    cancel(callback: FramerMotionFrameCallback): void
+    process(frameData: FramerMotionFrameData): void
+}
+
+export type FramerMotionFrameStepName =
+    | 'setup'
+    | 'read'
+    | 'resolveKeyframes'
+    | 'preUpdate'
+    | 'update'
+    | 'preRender'
+    | 'render'
+    | 'postRender'
+
+export type FramerMotionFrameSteps = Record<FramerMotionFrameStepName, FramerMotionFrameStep>
+
+export interface FramerMotionTime {
+    now(): number
+    set(newTime: number): void
+}
+
+export interface FramerMotionGeneratorState<Value = unknown> {
+    value: Value
+    done?: boolean
+}
+
+export interface FramerMotionGenerator<Value = unknown> {
+    calculatedDuration?: number | null
+    next(time: number): FramerMotionGeneratorState<Value>
+    velocity?(time: number): number
+}
+
+export interface FramerMotionAnimationDriver {
+    now(): number
+    start(autoplay?: boolean): void
+    stop(): void
+}
+
+export interface FramerMotionAnimationOptions<Value = unknown> {
+    keyframes: Value[]
+    autoplay?: boolean
+    delay?: number
+    repeat?: number
+    repeatDelay?: number
+    repeatType?: 'loop' | 'reverse' | 'mirror'
+    velocity?: number
+    finalKeyframe?: Value
+    startTime?: number
+    allowFlatten?: boolean
+    motionValue?: { updatedAt?: number }
+    type?: (options: FramerMotionAnimationOptions<Value>) => FramerMotionGenerator<Value>
+    driver?: (update: (timestamp: number) => void) => FramerMotionAnimationDriver
+    onUpdate?(latest: Value): void
+    onPlay?(): void
+    onComplete?(): void
+    onCancel?(): void
+    onStop?(): void
+}
+
+export declare class JSAnimation<Value = unknown> implements PromiseLike<void> {
+    constructor(options: FramerMotionAnimationOptions<Value>)
+    options: FramerMotionAnimationOptions<Value>
+    state: 'idle' | 'running' | 'paused' | 'finished'
+    currentTime: number
+    playbackSpeed: number
+    readonly duration: number
+    readonly iterationDuration: number
+    time: number
+    speed: number
+    readonly finished: Promise<void>
+    then<TResult1 = void, TResult2 = never>(
+        onfulfilled?: ((value: void) => TResult1 | PromiseLike<TResult1>) | null,
+        onrejected?: ((reason: Error) => TResult2 | PromiseLike<TResult2>) | null,
+    ): Promise<TResult1 | TResult2>
+    play(): void
+    pause(): void
+    complete(): void
+    finish(): void
+    cancel(): void
+    stop(): void
+    tick(timestamp: number, sample?: boolean): FramerMotionGeneratorState<Value>
+    sample(sampleTime: number): FramerMotionGeneratorState<Value>
+    attachTimeline(timeline: { observe(animation: JSAnimation<Value>): VoidFunction }): VoidFunction
+}
+
+export declare const MotionGlobalConfig: FramerMotionGlobalConfig
+export declare const frameData: FramerMotionFrameData
+export declare const frameSteps: FramerMotionFrameSteps
+export declare const time: FramerMotionTime
+export declare const visualElementStore: WeakMap<object, unknown>
+export declare function _injectRuntime(injectedRuntime: FramerInjectedRuntime): void
+
 export * from 'real-framer-motion'