svelte-origin 1.0.0-next.16 → 1.0.0-next.18

package/dist/cli.js

@@ -2027,38 +2027,48 @@ ${createFnBody}
 }`;
   return configCode;
 }
-function transformOriginBody(content, parents = [], attrDetails = [], propName = "props", svelteImports) {
+function transformOriginBody(content, parents = [], attrDetails = [], propName = "props", _svelteImports) {
   let body = content.trim();
   const hasParents = parents.length > 0;
-  const attrStateDeclarations = [];
-  const attrSyncEffects = [];
-  const attrGettersSetters = [];
-  if (attrDetails.length > 0 && svelteImports) {
-    svelteImports.add("untrack");
-  }
-  for (const attr of attrDetails) {
-    const defaultExpr = attr.hasDefault ? ` ?? ${attr.defaultValue}` : "";
-    attrStateDeclarations.push(`let __attr_${attr.key} = $state(__inputAttrs.${attr.key}${defaultExpr})`);
-    attrSyncEffects.push(`$effect(() => {
-			const __parentVal = __inputAttrs.${attr.key}
-			const __currentVal = untrack(() => __attr_${attr.key})
-			if (__parentVal !== __currentVal) {
-				__attr_${attr.key} = __parentVal${defaultExpr}
-			}
-		})`);
-    attrGettersSetters.push(`get ${attr.key}() { return __attr_${attr.key} }`);
-    attrGettersSetters.push(`set ${attr.key}(v) { __attr_${attr.key} = v; __inputAttrs.${attr.key} = v }`);
-  }
-  const attrStateSection = attrStateDeclarations.length > 0 ? attrStateDeclarations.join(`
-		`) + `
-		` : "";
-  const attrEffectSection = attrSyncEffects.length > 0 ? attrSyncEffects.join(`
-		`) + `
-		` : "";
-  const propsObjectCode = attrGettersSetters.length > 0 ? `${attrStateSection}${attrEffectSection}const __props = {
-			${attrGettersSetters.join(`,
-			`)}
-		}` : `		const __props = __inputAttrs`;
+  const propsLines = [];
+  if (attrDetails.length > 0) {
+    const initialProps = [];
+    for (const attr of attrDetails) {
+      const defaultExpr = attr.hasDefault ? ` ?? ${attr.defaultValue}` : "";
+      initialProps.push(`${attr.key}: __inputAttrs.${attr.key}${defaultExpr}`);
+    }
+    propsLines.push(`let __props = $state({ ${initialProps.join(", ")} })`);
+    for (const attr of attrDetails) {
+      const defaultExpr = attr.hasDefault ? ` ?? ${attr.defaultValue}` : "";
+      const parentLast = `__last_parent_${attr.key}`;
+      const localLast = `__last_local_${attr.key}`;
+      propsLines.push(`let ${parentLast} = __inputAttrs.${attr.key}`, `let ${localLast} = __props.${attr.key}`, `$effect(() => {
+` + `			const __parent = __inputAttrs.${attr.key}
+` + `			const __local = __props.${attr.key}
+
+` + `			// Parent -> local
+` + `			if (__parent !== ${parentLast}) {
+` + `				${parentLast} = __parent
+` + `				if (__local !== __parent) {
+` + `					__props.${attr.key} = __parent${defaultExpr}
+` + `				}
+` + `				${localLast} = __props.${attr.key}
+` + `				return
+` + `			}
+
+` + `			// Local -> parent
+` + `			if (__local !== ${localLast}) {
+` + `				${localLast} = __local
+` + (attr.bindable ? `				try { __inputAttrs.${attr.key} = __local } catch {}
+				${parentLast} = __inputAttrs.${attr.key}
+` : "") + `			}
+` + `})`);
+    }
+  } else {
+    propsLines.push("const __props = __inputAttrs");
+  }
+  const propsObjectCode = "\t\t" + propsLines.join(`
+		`);
   if (!body) {
     const baseMembers = [`get ${propName}() { return __props }`];
     if (hasParents)
@@ -2935,6 +2945,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;
@@ -3065,10 +3078,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

@@ -3475,24 +3475,39 @@ function __attrsFor(factory, rawAttrs) {
   const wrapper = {};
   const localValues = {};
   const hasLocalValue = {};
-  for (const key2 of Object.keys(schema)) {
-    Object.defineProperty(wrapper, key2, {
+  const defineExposedProp = (key2, info) => {
+    if (Object.prototype.hasOwnProperty.call(wrapper, key2))
+      return;
+    const base = {
       get() {
-        if (hasLocalValue[key2]) {
+        if (hasLocalValue[key2])
           return localValues[key2];
-        }
         return rawAttrs[key2];
       },
-      set(value) {
-        localValues[key2] = value;
-        hasLocalValue[key2] = true;
-        try {
-          rawAttrs[key2] = value;
-        } catch {}
-      },
       enumerable: true,
       configurable: true
-    });
+    };
+    if (info.bindable) {
+      Object.defineProperty(wrapper, key2, {
+        ...base,
+        set(value) {
+          localValues[key2] = value;
+          hasLocalValue[key2] = true;
+          try {
+            rawAttrs[key2] = value;
+          } catch {}
+        }
+      });
+    } else {
+      Object.defineProperty(wrapper, key2, base);
+    }
+  };
+  for (const [key2, info] of Object.entries(schema)) {
+    const parentValue = rawAttrs[key2];
+    const shouldExpose = !info.bindable || !info.hasDefault || parentValue !== undefined;
+    if (shouldExpose) {
+      defineExposedProp(key2, info);
+    }
   }
   for (const sym of Object.getOwnPropertySymbols(rawAttrs)) {
     Object.defineProperty(wrapper, sym, {
@@ -3505,34 +3520,57 @@ function __attrsFor(factory, rawAttrs) {
   }
   return new Proxy(wrapper, {
     get(target, prop2) {
-      if (prop2 in target) {
-        return target[prop2];
+      if (typeof prop2 === "string" && prop2 in schema) {
+        if (hasLocalValue[prop2])
+          return localValues[prop2];
+        return rawAttrs[prop2];
       }
+      if (prop2 in target)
+        return target[prop2];
       return rawAttrs[prop2];
     },
     set(target, prop2, value) {
+      if (typeof prop2 === "string" && prop2 in schema) {
+        localValues[prop2] = value;
+        hasLocalValue[prop2] = true;
+        if (!Object.prototype.hasOwnProperty.call(wrapper, prop2)) {
+          defineExposedProp(prop2, schema[prop2]);
+        }
+        if (schema[prop2].bindable) {
+          try {
+            rawAttrs[prop2] = value;
+          } catch {}
+        }
+        return true;
+      }
       if (prop2 in target) {
-        target[prop2] = value;
+        try {
+          target[prop2] = value;
+        } catch {}
         return true;
       }
       try {
         rawAttrs[prop2] = value;
       } catch {
-        localValues[prop2] = value;
-        hasLocalValue[prop2] = true;
+        if (typeof prop2 === "string") {
+          localValues[prop2] = value;
+          hasLocalValue[prop2] = true;
+        }
       }
       return true;
     },
     has(target, prop2) {
+      if (typeof prop2 === "string" && prop2 in schema) {
+        return prop2 in target || hasLocalValue[prop2];
+      }
       return prop2 in target || prop2 in rawAttrs;
     },
     ownKeys() {
       return [...Object.keys(wrapper), ...Object.getOwnPropertySymbols(rawAttrs)];
     },
     getOwnPropertyDescriptor(target, prop2) {
-      if (prop2 in target) {
+      if (prop2 in target)
         return Object.getOwnPropertyDescriptor(target, prop2);
-      }
       return Object.getOwnPropertyDescriptor(rawAttrs, prop2);
     }
   });
@@ -6077,38 +6115,48 @@ ${createFnBody}
 }`;
   return configCode;
 }
-function transformOriginBody(content, parents = [], attrDetails = [], propName = "props", svelteImports) {
+function transformOriginBody(content, parents = [], attrDetails = [], propName = "props", _svelteImports) {
   let body = content.trim();
   const hasParents = parents.length > 0;
-  const attrStateDeclarations = [];
-  const attrSyncEffects = [];
-  const attrGettersSetters = [];
-  if (attrDetails.length > 0 && svelteImports) {
-    svelteImports.add("untrack");
-  }
-  for (const attr2 of attrDetails) {
-    const defaultExpr = attr2.hasDefault ? ` ?? ${attr2.defaultValue}` : "";
-    attrStateDeclarations.push(`let __attr_${attr2.key} = $state(__inputAttrs.${attr2.key}${defaultExpr})`);
-    attrSyncEffects.push(`$effect(() => {
-			const __parentVal = __inputAttrs.${attr2.key}
-			const __currentVal = untrack(() => __attr_${attr2.key})
-			if (__parentVal !== __currentVal) {
-				__attr_${attr2.key} = __parentVal${defaultExpr}
-			}
-		})`);
-    attrGettersSetters.push(`get ${attr2.key}() { return __attr_${attr2.key} }`);
-    attrGettersSetters.push(`set ${attr2.key}(v) { __attr_${attr2.key} = v; __inputAttrs.${attr2.key} = v }`);
-  }
-  const attrStateSection = attrStateDeclarations.length > 0 ? attrStateDeclarations.join(`
-		`) + `
-		` : "";
-  const attrEffectSection = attrSyncEffects.length > 0 ? attrSyncEffects.join(`
-		`) + `
-		` : "";
-  const propsObjectCode = attrGettersSetters.length > 0 ? `${attrStateSection}${attrEffectSection}const __props = {
-			${attrGettersSetters.join(`,
-			`)}
-		}` : `		const __props = __inputAttrs`;
+  const propsLines = [];
+  if (attrDetails.length > 0) {
+    const initialProps = [];
+    for (const attr2 of attrDetails) {
+      const defaultExpr = attr2.hasDefault ? ` ?? ${attr2.defaultValue}` : "";
+      initialProps.push(`${attr2.key}: __inputAttrs.${attr2.key}${defaultExpr}`);
+    }
+    propsLines.push(`let __props = $state({ ${initialProps.join(", ")} })`);
+    for (const attr2 of attrDetails) {
+      const defaultExpr = attr2.hasDefault ? ` ?? ${attr2.defaultValue}` : "";
+      const parentLast = `__last_parent_${attr2.key}`;
+      const localLast = `__last_local_${attr2.key}`;
+      propsLines.push(`let ${parentLast} = __inputAttrs.${attr2.key}`, `let ${localLast} = __props.${attr2.key}`, `$effect(() => {
+` + `			const __parent = __inputAttrs.${attr2.key}
+` + `			const __local = __props.${attr2.key}
+
+` + `			// Parent -> local
+` + `			if (__parent !== ${parentLast}) {
+` + `				${parentLast} = __parent
+` + `				if (__local !== __parent) {
+` + `					__props.${attr2.key} = __parent${defaultExpr}
+` + `				}
+` + `				${localLast} = __props.${attr2.key}
+` + `				return
+` + `			}
+
+` + `			// Local -> parent
+` + `			if (__local !== ${localLast}) {
+` + `				${localLast} = __local
+` + (attr2.bindable ? `				try { __inputAttrs.${attr2.key} = __local } catch {}
+				${parentLast} = __inputAttrs.${attr2.key}
+` : "") + `			}
+` + `})`);
+    }
+  } else {
+    propsLines.push("const __props = __inputAttrs");
+  }
+  const propsObjectCode = "\t\t" + propsLines.join(`
+		`);
   if (!body) {
     const baseMembers = [`get ${propName}() { return __props }`];
     if (hasParents)

package/dist/plugin.js

@@ -2021,38 +2021,48 @@ ${createFnBody}
 }`;
   return configCode;
 }
-function transformOriginBody(content, parents = [], attrDetails = [], propName = "props", svelteImports) {
+function transformOriginBody(content, parents = [], attrDetails = [], propName = "props", _svelteImports) {
   let body = content.trim();
   const hasParents = parents.length > 0;
-  const attrStateDeclarations = [];
-  const attrSyncEffects = [];
-  const attrGettersSetters = [];
-  if (attrDetails.length > 0 && svelteImports) {
-    svelteImports.add("untrack");
-  }
-  for (const attr of attrDetails) {
-    const defaultExpr = attr.hasDefault ? ` ?? ${attr.defaultValue}` : "";
-    attrStateDeclarations.push(`let __attr_${attr.key} = $state(__inputAttrs.${attr.key}${defaultExpr})`);
-    attrSyncEffects.push(`$effect(() => {
-			const __parentVal = __inputAttrs.${attr.key}
-			const __currentVal = untrack(() => __attr_${attr.key})
-			if (__parentVal !== __currentVal) {
-				__attr_${attr.key} = __parentVal${defaultExpr}
-			}
-		})`);
-    attrGettersSetters.push(`get ${attr.key}() { return __attr_${attr.key} }`);
-    attrGettersSetters.push(`set ${attr.key}(v) { __attr_${attr.key} = v; __inputAttrs.${attr.key} = v }`);
-  }
-  const attrStateSection = attrStateDeclarations.length > 0 ? attrStateDeclarations.join(`
-		`) + `
-		` : "";
-  const attrEffectSection = attrSyncEffects.length > 0 ? attrSyncEffects.join(`
-		`) + `
-		` : "";
-  const propsObjectCode = attrGettersSetters.length > 0 ? `${attrStateSection}${attrEffectSection}const __props = {
-			${attrGettersSetters.join(`,
-			`)}
-		}` : `		const __props = __inputAttrs`;
+  const propsLines = [];
+  if (attrDetails.length > 0) {
+    const initialProps = [];
+    for (const attr of attrDetails) {
+      const defaultExpr = attr.hasDefault ? ` ?? ${attr.defaultValue}` : "";
+      initialProps.push(`${attr.key}: __inputAttrs.${attr.key}${defaultExpr}`);
+    }
+    propsLines.push(`let __props = $state({ ${initialProps.join(", ")} })`);
+    for (const attr of attrDetails) {
+      const defaultExpr = attr.hasDefault ? ` ?? ${attr.defaultValue}` : "";
+      const parentLast = `__last_parent_${attr.key}`;
+      const localLast = `__last_local_${attr.key}`;
+      propsLines.push(`let ${parentLast} = __inputAttrs.${attr.key}`, `let ${localLast} = __props.${attr.key}`, `$effect(() => {
+` + `			const __parent = __inputAttrs.${attr.key}
+` + `			const __local = __props.${attr.key}
+
+` + `			// Parent -> local
+` + `			if (__parent !== ${parentLast}) {
+` + `				${parentLast} = __parent
+` + `				if (__local !== __parent) {
+` + `					__props.${attr.key} = __parent${defaultExpr}
+` + `				}
+` + `				${localLast} = __props.${attr.key}
+` + `				return
+` + `			}
+
+` + `			// Local -> parent
+` + `			if (__local !== ${localLast}) {
+` + `				${localLast} = __local
+` + (attr.bindable ? `				try { __inputAttrs.${attr.key} = __local } catch {}
+				${parentLast} = __inputAttrs.${attr.key}
+` : "") + `			}
+` + `})`);
+    }
+  } else {
+    propsLines.push("const __props = __inputAttrs");
+  }
+  const propsObjectCode = "\t\t" + propsLines.join(`
+		`);
   if (!body) {
     const baseMembers = [`get ${propName}() { return __props }`];
     if (hasParents)

package/dist/post-process.js

@@ -2025,38 +2025,48 @@ ${createFnBody}
 }`;
   return configCode;
 }
-function transformOriginBody(content, parents = [], attrDetails = [], propName = "props", svelteImports) {
+function transformOriginBody(content, parents = [], attrDetails = [], propName = "props", _svelteImports) {
   let body = content.trim();
   const hasParents = parents.length > 0;
-  const attrStateDeclarations = [];
-  const attrSyncEffects = [];
-  const attrGettersSetters = [];
-  if (attrDetails.length > 0 && svelteImports) {
-    svelteImports.add("untrack");
-  }
-  for (const attr of attrDetails) {
-    const defaultExpr = attr.hasDefault ? ` ?? ${attr.defaultValue}` : "";
-    attrStateDeclarations.push(`let __attr_${attr.key} = $state(__inputAttrs.${attr.key}${defaultExpr})`);
-    attrSyncEffects.push(`$effect(() => {
-			const __parentVal = __inputAttrs.${attr.key}
-			const __currentVal = untrack(() => __attr_${attr.key})
-			if (__parentVal !== __currentVal) {
-				__attr_${attr.key} = __parentVal${defaultExpr}
-			}
-		})`);
-    attrGettersSetters.push(`get ${attr.key}() { return __attr_${attr.key} }`);
-    attrGettersSetters.push(`set ${attr.key}(v) { __attr_${attr.key} = v; __inputAttrs.${attr.key} = v }`);
-  }
-  const attrStateSection = attrStateDeclarations.length > 0 ? attrStateDeclarations.join(`
-		`) + `
-		` : "";
-  const attrEffectSection = attrSyncEffects.length > 0 ? attrSyncEffects.join(`
-		`) + `
-		` : "";
-  const propsObjectCode = attrGettersSetters.length > 0 ? `${attrStateSection}${attrEffectSection}const __props = {
-			${attrGettersSetters.join(`,
-			`)}
-		}` : `		const __props = __inputAttrs`;
+  const propsLines = [];
+  if (attrDetails.length > 0) {
+    const initialProps = [];
+    for (const attr of attrDetails) {
+      const defaultExpr = attr.hasDefault ? ` ?? ${attr.defaultValue}` : "";
+      initialProps.push(`${attr.key}: __inputAttrs.${attr.key}${defaultExpr}`);
+    }
+    propsLines.push(`let __props = $state({ ${initialProps.join(", ")} })`);
+    for (const attr of attrDetails) {
+      const defaultExpr = attr.hasDefault ? ` ?? ${attr.defaultValue}` : "";
+      const parentLast = `__last_parent_${attr.key}`;
+      const localLast = `__last_local_${attr.key}`;
+      propsLines.push(`let ${parentLast} = __inputAttrs.${attr.key}`, `let ${localLast} = __props.${attr.key}`, `$effect(() => {
+` + `			const __parent = __inputAttrs.${attr.key}
+` + `			const __local = __props.${attr.key}
+
+` + `			// Parent -> local
+` + `			if (__parent !== ${parentLast}) {
+` + `				${parentLast} = __parent
+` + `				if (__local !== __parent) {
+` + `					__props.${attr.key} = __parent${defaultExpr}
+` + `				}
+` + `				${localLast} = __props.${attr.key}
+` + `				return
+` + `			}
+
+` + `			// Local -> parent
+` + `			if (__local !== ${localLast}) {
+` + `				${localLast} = __local
+` + (attr.bindable ? `				try { __inputAttrs.${attr.key} = __local } catch {}
+				${parentLast} = __inputAttrs.${attr.key}
+` : "") + `			}
+` + `})`);
+    }
+  } else {
+    propsLines.push("const __props = __inputAttrs");
+  }
+  const propsObjectCode = "\t\t" + propsLines.join(`
+		`);
   if (!body) {
     const baseMembers = [`get ${propName}() { return __props }`];
     if (hasParents)
@@ -2933,6 +2943,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;
@@ -3063,10 +3076,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

@@ -2021,38 +2021,48 @@ ${createFnBody}
 }`;
   return configCode;
 }
-function transformOriginBody(content, parents = [], attrDetails = [], propName = "props", svelteImports) {
+function transformOriginBody(content, parents = [], attrDetails = [], propName = "props", _svelteImports) {
   let body = content.trim();
   const hasParents = parents.length > 0;
-  const attrStateDeclarations = [];
-  const attrSyncEffects = [];
-  const attrGettersSetters = [];
-  if (attrDetails.length > 0 && svelteImports) {
-    svelteImports.add("untrack");
-  }
-  for (const attr of attrDetails) {
-    const defaultExpr = attr.hasDefault ? ` ?? ${attr.defaultValue}` : "";
-    attrStateDeclarations.push(`let __attr_${attr.key} = $state(__inputAttrs.${attr.key}${defaultExpr})`);
-    attrSyncEffects.push(`$effect(() => {
-			const __parentVal = __inputAttrs.${attr.key}
-			const __currentVal = untrack(() => __attr_${attr.key})
-			if (__parentVal !== __currentVal) {
-				__attr_${attr.key} = __parentVal${defaultExpr}
-			}
-		})`);
-    attrGettersSetters.push(`get ${attr.key}() { return __attr_${attr.key} }`);
-    attrGettersSetters.push(`set ${attr.key}(v) { __attr_${attr.key} = v; __inputAttrs.${attr.key} = v }`);
-  }
-  const attrStateSection = attrStateDeclarations.length > 0 ? attrStateDeclarations.join(`
-		`) + `
-		` : "";
-  const attrEffectSection = attrSyncEffects.length > 0 ? attrSyncEffects.join(`
-		`) + `
-		` : "";
-  const propsObjectCode = attrGettersSetters.length > 0 ? `${attrStateSection}${attrEffectSection}const __props = {
-			${attrGettersSetters.join(`,
-			`)}
-		}` : `		const __props = __inputAttrs`;
+  const propsLines = [];
+  if (attrDetails.length > 0) {
+    const initialProps = [];
+    for (const attr of attrDetails) {
+      const defaultExpr = attr.hasDefault ? ` ?? ${attr.defaultValue}` : "";
+      initialProps.push(`${attr.key}: __inputAttrs.${attr.key}${defaultExpr}`);
+    }
+    propsLines.push(`let __props = $state({ ${initialProps.join(", ")} })`);
+    for (const attr of attrDetails) {
+      const defaultExpr = attr.hasDefault ? ` ?? ${attr.defaultValue}` : "";
+      const parentLast = `__last_parent_${attr.key}`;
+      const localLast = `__last_local_${attr.key}`;
+      propsLines.push(`let ${parentLast} = __inputAttrs.${attr.key}`, `let ${localLast} = __props.${attr.key}`, `$effect(() => {
+` + `			const __parent = __inputAttrs.${attr.key}
+` + `			const __local = __props.${attr.key}
+
+` + `			// Parent -> local
+` + `			if (__parent !== ${parentLast}) {
+` + `				${parentLast} = __parent
+` + `				if (__local !== __parent) {
+` + `					__props.${attr.key} = __parent${defaultExpr}
+` + `				}
+` + `				${localLast} = __props.${attr.key}
+` + `				return
+` + `			}
+
+` + `			// Local -> parent
+` + `			if (__local !== ${localLast}) {
+` + `				${localLast} = __local
+` + (attr.bindable ? `				try { __inputAttrs.${attr.key} = __local } catch {}
+				${parentLast} = __inputAttrs.${attr.key}
+` : "") + `			}
+` + `})`);
+    }
+  } else {
+    propsLines.push("const __props = __inputAttrs");
+  }
+  const propsObjectCode = "\t\t" + propsLines.join(`
+		`);
   if (!body) {
     const baseMembers = [`get ${propName}() { return __props }`];
     if (hasParents)

package/dist/runtime/index.js

@@ -3475,24 +3475,39 @@ function __attrsFor(factory, rawAttrs) {
   const wrapper = {};
   const localValues = {};
   const hasLocalValue = {};
-  for (const key2 of Object.keys(schema)) {
-    Object.defineProperty(wrapper, key2, {
+  const defineExposedProp = (key2, info) => {
+    if (Object.prototype.hasOwnProperty.call(wrapper, key2))
+      return;
+    const base = {
       get() {
-        if (hasLocalValue[key2]) {
+        if (hasLocalValue[key2])
           return localValues[key2];
-        }
         return rawAttrs[key2];
       },
-      set(value) {
-        localValues[key2] = value;
-        hasLocalValue[key2] = true;
-        try {
-          rawAttrs[key2] = value;
-        } catch {}
-      },
       enumerable: true,
       configurable: true
-    });
+    };
+    if (info.bindable) {
+      Object.defineProperty(wrapper, key2, {
+        ...base,
+        set(value) {
+          localValues[key2] = value;
+          hasLocalValue[key2] = true;
+          try {
+            rawAttrs[key2] = value;
+          } catch {}
+        }
+      });
+    } else {
+      Object.defineProperty(wrapper, key2, base);
+    }
+  };
+  for (const [key2, info] of Object.entries(schema)) {
+    const parentValue = rawAttrs[key2];
+    const shouldExpose = !info.bindable || !info.hasDefault || parentValue !== undefined;
+    if (shouldExpose) {
+      defineExposedProp(key2, info);
+    }
   }
   for (const sym of Object.getOwnPropertySymbols(rawAttrs)) {
     Object.defineProperty(wrapper, sym, {
@@ -3505,34 +3520,57 @@ function __attrsFor(factory, rawAttrs) {
   }
   return new Proxy(wrapper, {
     get(target, prop2) {
-      if (prop2 in target) {
-        return target[prop2];
+      if (typeof prop2 === "string" && prop2 in schema) {
+        if (hasLocalValue[prop2])
+          return localValues[prop2];
+        return rawAttrs[prop2];
       }
+      if (prop2 in target)
+        return target[prop2];
       return rawAttrs[prop2];
     },
     set(target, prop2, value) {
+      if (typeof prop2 === "string" && prop2 in schema) {
+        localValues[prop2] = value;
+        hasLocalValue[prop2] = true;
+        if (!Object.prototype.hasOwnProperty.call(wrapper, prop2)) {
+          defineExposedProp(prop2, schema[prop2]);
+        }
+        if (schema[prop2].bindable) {
+          try {
+            rawAttrs[prop2] = value;
+          } catch {}
+        }
+        return true;
+      }
       if (prop2 in target) {
-        target[prop2] = value;
+        try {
+          target[prop2] = value;
+        } catch {}
         return true;
       }
       try {
         rawAttrs[prop2] = value;
       } catch {
-        localValues[prop2] = value;
-        hasLocalValue[prop2] = true;
+        if (typeof prop2 === "string") {
+          localValues[prop2] = value;
+          hasLocalValue[prop2] = true;
+        }
       }
       return true;
     },
     has(target, prop2) {
+      if (typeof prop2 === "string" && prop2 in schema) {
+        return prop2 in target || hasLocalValue[prop2];
+      }
       return prop2 in target || prop2 in rawAttrs;
     },
     ownKeys() {
       return [...Object.keys(wrapper), ...Object.getOwnPropertySymbols(rawAttrs)];
     },
     getOwnPropertyDescriptor(target, prop2) {
-      if (prop2 in target) {
+      if (prop2 in target)
         return Object.getOwnPropertyDescriptor(target, prop2);
-      }
       return Object.getOwnPropertyDescriptor(rawAttrs, prop2);
     }
   });

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.16",
+	"version": "1.0.0-next.18",
 	"description": "Compiler-assisted state and prop ergonomics for Svelte 5",
 	"main": "dist/index.js",
 	"types": "dist/index.d.ts",