svelte-origin 1.0.0-next.17 → 1.0.0-next.19

package/dist/cli.js

@@ -2065,7 +2065,32 @@ function transformOriginBody(content, parents = [], attrDetails = [], propName =
 ` + `})`);
     }
   } else {
-    propsLines.push("const __props = __inputAttrs");
+    propsLines.push("let __props = $state({ ...__inputAttrs })", "const __syncState = new Map()", `$effect.pre(() => {
+` + `			// Bidirectional sync between __inputAttrs and __props
+` + `			for (const key of Object.keys(__inputAttrs)) {
+` + `				const parentVal = __inputAttrs[key]
+` + `				const localVal = __props[key]
+` + `				const state = __syncState.get(key) ?? { parent: parentVal, local: localVal }
+` + `				__syncState.set(key, state)
+
+` + `				// Parent changed -> update local
+` + `				if (parentVal !== state.parent) {
+` + `					state.parent = parentVal
+` + `					if (localVal !== parentVal) {
+` + `						__props[key] = parentVal
+` + `						state.local = parentVal
+` + `					}
+` + `					continue
+` + `				}
+
+` + `				// Local changed -> update parent (for bindable props)
+` + `				if (localVal !== state.local) {
+` + `					state.local = localVal
+` + `					try { __inputAttrs[key] = localVal } catch {}
+` + `					state.parent = __inputAttrs[key]
+` + `				}
+` + `			}
+` + `		})`);
   }
   const propsObjectCode = "\t\t" + propsLines.join(`
 		`);
@@ -2945,6 +2970,9 @@ async function transformScriptContent(source, options) {
 var EXTENSIONS = [".svelte", ".svelte.ts", ".svelte.js", ".js", ".ts"];
 function cleanupForLibrary(code, schemaCache) {
   let result = code;
+  result = result.replace(/(?:var|const|let)\s+\$\w+\s*=\s*globalThis\.\$\w+(?:\s*,\s*\$\w+\s*=\s*globalThis\.\$\w+)*\s*;?\n?/g, "");
+  result = result.replace(/(?:var|const|let)\s*\{\s*\$origin\s*(?:,\s*\$\w+\s*)*\}\s*=\s*globalThis\s*;?\n?/g, "");
+  result = result.replace(/\/\/\s*@ts-ignore\s*-?\s*macros are transformed at build time\n?/g, "");
   result = result.replace(/\ntype \$\$Props = \$attrs\.Of<[^>]+>\n/g, `
 `);
   const attrsOfPattern = /(\}\s*:\s*)\$attrs\.Of<typeof (\w+)>(\s*=\s*\$props\(\))/g;
@@ -3075,10 +3103,12 @@ async function postProcess(options) {
         isComponent,
         schemaResolver
       });
-      if (transformed.changed) {
+      let finalCode = cleanupForLibrary(transformed.changed ? transformed.code : source, schemaCache);
+      const sourceToCompare = transformed.changed ? transformed.code : source;
+      const cleanupChanged = finalCode !== sourceToCompare;
+      if (transformed.changed || cleanupChanged) {
         result.filesProcessed++;
         result.files.push(filePath);
-        let finalCode = cleanupForLibrary(transformed.code, schemaCache);
         if (!dryRun) {
           fs.writeFileSync(filePath, finalCode, "utf-8");
         }

package/dist/index.js

@@ -6153,7 +6153,32 @@ function transformOriginBody(content, parents = [], attrDetails = [], propName =
 ` + `})`);
     }
   } else {
-    propsLines.push("const __props = __inputAttrs");
+    propsLines.push("let __props = $state({ ...__inputAttrs })", "const __syncState = new Map()", `$effect.pre(() => {
+` + `			// Bidirectional sync between __inputAttrs and __props
+` + `			for (const key of Object.keys(__inputAttrs)) {
+` + `				const parentVal = __inputAttrs[key]
+` + `				const localVal = __props[key]
+` + `				const state = __syncState.get(key) ?? { parent: parentVal, local: localVal }
+` + `				__syncState.set(key, state)
+
+` + `				// Parent changed -> update local
+` + `				if (parentVal !== state.parent) {
+` + `					state.parent = parentVal
+` + `					if (localVal !== parentVal) {
+` + `						__props[key] = parentVal
+` + `						state.local = parentVal
+` + `					}
+` + `					continue
+` + `				}
+
+` + `				// Local changed -> update parent (for bindable props)
+` + `				if (localVal !== state.local) {
+` + `					state.local = localVal
+` + `					try { __inputAttrs[key] = localVal } catch {}
+` + `					state.parent = __inputAttrs[key]
+` + `				}
+` + `			}
+` + `		})`);
   }
   const propsObjectCode = "\t\t" + propsLines.join(`
 		`);

package/dist/plugin.js

@@ -2059,7 +2059,32 @@ function transformOriginBody(content, parents = [], attrDetails = [], propName =
 ` + `})`);
     }
   } else {
-    propsLines.push("const __props = __inputAttrs");
+    propsLines.push("let __props = $state({ ...__inputAttrs })", "const __syncState = new Map()", `$effect.pre(() => {
+` + `			// Bidirectional sync between __inputAttrs and __props
+` + `			for (const key of Object.keys(__inputAttrs)) {
+` + `				const parentVal = __inputAttrs[key]
+` + `				const localVal = __props[key]
+` + `				const state = __syncState.get(key) ?? { parent: parentVal, local: localVal }
+` + `				__syncState.set(key, state)
+
+` + `				// Parent changed -> update local
+` + `				if (parentVal !== state.parent) {
+` + `					state.parent = parentVal
+` + `					if (localVal !== parentVal) {
+` + `						__props[key] = parentVal
+` + `						state.local = parentVal
+` + `					}
+` + `					continue
+` + `				}
+
+` + `				// Local changed -> update parent (for bindable props)
+` + `				if (localVal !== state.local) {
+` + `					state.local = localVal
+` + `					try { __inputAttrs[key] = localVal } catch {}
+` + `					state.parent = __inputAttrs[key]
+` + `				}
+` + `			}
+` + `		})`);
   }
   const propsObjectCode = "\t\t" + propsLines.join(`
 		`);

package/dist/post-process.js

@@ -2063,7 +2063,32 @@ function transformOriginBody(content, parents = [], attrDetails = [], propName =
 ` + `})`);
     }
   } else {
-    propsLines.push("const __props = __inputAttrs");
+    propsLines.push("let __props = $state({ ...__inputAttrs })", "const __syncState = new Map()", `$effect.pre(() => {
+` + `			// Bidirectional sync between __inputAttrs and __props
+` + `			for (const key of Object.keys(__inputAttrs)) {
+` + `				const parentVal = __inputAttrs[key]
+` + `				const localVal = __props[key]
+` + `				const state = __syncState.get(key) ?? { parent: parentVal, local: localVal }
+` + `				__syncState.set(key, state)
+
+` + `				// Parent changed -> update local
+` + `				if (parentVal !== state.parent) {
+` + `					state.parent = parentVal
+` + `					if (localVal !== parentVal) {
+` + `						__props[key] = parentVal
+` + `						state.local = parentVal
+` + `					}
+` + `					continue
+` + `				}
+
+` + `				// Local changed -> update parent (for bindable props)
+` + `				if (localVal !== state.local) {
+` + `					state.local = localVal
+` + `					try { __inputAttrs[key] = localVal } catch {}
+` + `					state.parent = __inputAttrs[key]
+` + `				}
+` + `			}
+` + `		})`);
   }
   const propsObjectCode = "\t\t" + propsLines.join(`
 		`);
@@ -2943,6 +2968,9 @@ async function transformScriptContent(source, options) {
 var EXTENSIONS = [".svelte", ".svelte.ts", ".svelte.js", ".js", ".ts"];
 function cleanupForLibrary(code, schemaCache) {
   let result = code;
+  result = result.replace(/(?:var|const|let)\s+\$\w+\s*=\s*globalThis\.\$\w+(?:\s*,\s*\$\w+\s*=\s*globalThis\.\$\w+)*\s*;?\n?/g, "");
+  result = result.replace(/(?:var|const|let)\s*\{\s*\$origin\s*(?:,\s*\$\w+\s*)*\}\s*=\s*globalThis\s*;?\n?/g, "");
+  result = result.replace(/\/\/\s*@ts-ignore\s*-?\s*macros are transformed at build time\n?/g, "");
   result = result.replace(/\ntype \$\$Props = \$attrs\.Of<[^>]+>\n/g, `
 `);
   const attrsOfPattern = /(\}\s*:\s*)\$attrs\.Of<typeof (\w+)>(\s*=\s*\$props\(\))/g;
@@ -3073,10 +3101,12 @@ async function postProcess(options) {
         isComponent,
         schemaResolver
       });
-      if (transformed.changed) {
+      let finalCode = cleanupForLibrary(transformed.changed ? transformed.code : source, schemaCache);
+      const sourceToCompare = transformed.changed ? transformed.code : source;
+      const cleanupChanged = finalCode !== sourceToCompare;
+      if (transformed.changed || cleanupChanged) {
         result.filesProcessed++;
         result.files.push(filePath);
-        let finalCode = cleanupForLibrary(transformed.code, schemaCache);
         if (!dryRun) {
           fs.writeFileSync(filePath, finalCode, "utf-8");
         }

package/dist/preprocess.js

@@ -2059,7 +2059,32 @@ function transformOriginBody(content, parents = [], attrDetails = [], propName =
 ` + `})`);
     }
   } else {
-    propsLines.push("const __props = __inputAttrs");
+    propsLines.push("let __props = $state({ ...__inputAttrs })", "const __syncState = new Map()", `$effect.pre(() => {
+` + `			// Bidirectional sync between __inputAttrs and __props
+` + `			for (const key of Object.keys(__inputAttrs)) {
+` + `				const parentVal = __inputAttrs[key]
+` + `				const localVal = __props[key]
+` + `				const state = __syncState.get(key) ?? { parent: parentVal, local: localVal }
+` + `				__syncState.set(key, state)
+
+` + `				// Parent changed -> update local
+` + `				if (parentVal !== state.parent) {
+` + `					state.parent = parentVal
+` + `					if (localVal !== parentVal) {
+` + `						__props[key] = parentVal
+` + `						state.local = parentVal
+` + `					}
+` + `					continue
+` + `				}
+
+` + `				// Local changed -> update parent (for bindable props)
+` + `				if (localVal !== state.local) {
+` + `					state.local = localVal
+` + `					try { __inputAttrs[key] = localVal } catch {}
+` + `					state.parent = __inputAttrs[key]
+` + `				}
+` + `			}
+` + `		})`);
   }
   const propsObjectCode = "\t\t" + propsLines.join(`
 		`);

package/dist/runtime/types.d.ts

@@ -75,7 +75,7 @@ export type UnwrapBindable<T> = T extends Bindable<infer U> ? U : T;
  */
 export interface OriginFactory<TInstance = unknown, TAttrs = Record<string, any>> {
     /** Create an instance with the given reactive attrs and optional init args */
-    (attrs?: TAttrs | null, ...initArgs: any[]): TInstance;
+    (attrs?: TAttrs | null, ...initArgs: any[]): TInstance & OriginInstanceExtras;
     /** Marker to identify origin factories */
     readonly __origin: true;
     /** The attr schema extracted from the definition */
@@ -113,13 +113,33 @@ export interface AttrsFactory<_TAttrs = Record<string, any>> {
     /** Parent attr factories (for inheritance) */
     readonly __parents: AttrsFactory<any>[];
 }
+/**
+ * Attachment registry returned by $attachments getter.
+ * Maps Symbol keys to attachment functions.
+ */
+export type AttachmentRegistry = Record<symbol, (element: Element) => void | (() => void)>;
+/**
+ * Properties added to all origin instances at runtime.
+ * These are injected by __createOrigin after __create returns.
+ */
+export interface OriginInstanceExtras {
+    /**
+     * Attachment functions that can be spread onto elements.
+     * Returns an object with Symbol keys mapping to attachment functions.
+     *
+     * @example
+     * <div {...instance.$attachments}>
+     */
+    readonly $attachments: AttachmentRegistry;
+}
 /**
  * The origin instance has:
  * - attrs: reactive attrs object (passed in)
  * - super: parent instance (if extending)
+ * - $attachments: attachment registry (injected by runtime)
  * - All other members from the definition (state, getters, methods)
  */
-export interface OriginInstance<TAttrs = Record<string, any>> {
+export interface OriginInstance<TAttrs = Record<string, any>> extends OriginInstanceExtras {
     /** Reactive attrs object */
     readonly attrs: TAttrs;
     /** Parent instance (if extending) */

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "svelte-origin",
-	"version": "1.0.0-next.17",
+	"version": "1.0.0-next.19",
 	"description": "Compiler-assisted state and prop ergonomics for Svelte 5",
 	"main": "dist/index.js",
 	"types": "dist/index.d.ts",