@jbpark/live-editor 3.2.0 → 4.0.0

package/dist/{document-C6bNHl7l.js → extract-abHYmNsu.js}

@@ -1,3 +1,4 @@
+import { z } from "zod";
 //#region \0rolldown/runtime.js
 var __create = Object.create;
 var __defProp = Object.defineProperty;
@@ -84,20 +85,26 @@ const DRAGGABLE_ITEMS = [
             {
               label: 'Background Style',
               property: 'style',
+              type: 'object',
+              // Types the keys inside the object value; a leaf takes the same
+              // fields as a top-level binding.
+              render: {
+                backgroundColor: { type: 'color', label: 'Background Color' },
+              },
+              // Not a library field, so it arrives as meta.group.
+              group: 'layout',
             },
             {
               label: 'Content Spacing',
               property: 'size',
               type: 'number',
-              widget: 'slider',
+              // Constraints the library validates with or without a widget.
               min: 0,
               max: 40,
-              // step/unit aren't fields this library knows about — they
-              // survive parsing under binding.meta instead of being
-              // stripped, so a custom panel can read its own
-              // per-field configuration back out. See #234.
-              step: 4,
-              unit: 'px',
+              // Presentation only: the built-in panel ignores it and shows a
+              // number input; a custom panel can switch on widget.type.
+              widget: { type: 'slider', step: 4, unit: 'px' },
+              group: 'layout',
             },
           ]}
           style={{
@@ -117,6 +124,8 @@ const DRAGGABLE_ITEMS = [
               {
                 label: 'Title',
                 property: 'innerText',
+                type: 'string',
+                required: true,
               },
             ]}
             className={cn(
@@ -148,39 +157,31 @@ const DRAGGABLE_ITEMS = [
                 label: 'Button Text',
                 property: 'innerText',
               },
+              {
+                label: 'Button Icon',
+                property: 'icon',
+                type: 'jsx',
+              },
               {
                 label: 'Button Size',
                 property: 'size',
                 options: [
-                  {
-                    label: 'small',
-                    value: 'small',
-                  },
-                  {
-                    label: 'middle',
-                    value: 'middle',
-                  },
-                  {
-                    label: 'large',
-                    value: 'large',
-                  },
+                  { label: 'Small', value: 'small' },
+                  { label: 'Middle', value: 'middle' },
+                  { label: 'Large', value: 'large' },
                 ],
               },
               {
                 label: 'Button Variant',
                 property: 'variant',
                 options: [
-                  {
-                    label: 'default',
-                    value: 'default',
-                  },
-                  {
-                    label: 'outlined',
-                    value: 'outlined',
-                  },
+                  { label: 'Solid', value: 'solid' },
+                  { label: 'Outlined', value: 'outlined' },
+                  { label: 'Filled', value: 'filled' },
                 ],
               },
             ]}
+            icon={<span>🚀</span>}
             size="large"
             variant="solid"
             className={cn(
@@ -925,7 +926,19 @@ const DRAGGABLE_ITEMS = [
       >
         <ui.Marquees
           data-id=""
-          data-binding={[{ label: 'Stats Items', property: 'items' }]}
+          data-binding={[
+            { label: 'Stats Items', property: 'items' },
+            {
+              label: 'Scroll Speed',
+              property: 'speed',
+              type: 'number',
+              min: 20,
+              max: 300,
+              // The bare-string form; it arrives as { type: 'slider' }.
+              widget: 'slider',
+            },
+            { label: 'Pause On Hover', property: 'pauseOnHover', type: 'boolean' },
+          ]}
           speed={100}
           pauseOnHover={true}
           autoFill={true}
@@ -1098,6 +1111,190 @@ const DRAGGABLE_ITEMS = [
           ]}
         />
       </section>
+    `
+	},
+	{
+		id: "roadmap",
+		name: "Roadmap",
+		code: `
+      <section
+        data-name="Roadmap"
+        className={cn(
+          'px-5 py-16',
+          //
+        )}
+      >
+        <div
+          className={cn(
+            'mx-auto max-w-3xl',
+            //
+          )}
+        >
+          <h2
+            data-id=""
+            data-binding={[
+              { label: 'Title', property: 'innerText', required: true },
+            ]}
+            className={cn(
+              'mb-8 text-center text-4xl font-bold text-gray-800',
+              //
+            )}
+          >
+            Roadmap
+          </h2>
+          <ui.List
+            data-id=""
+            data-binding={[
+              {
+                label: 'Milestones',
+                property: 'data',
+                type: 'array',
+                // One leaf per item key. Each leaf takes the same fields as a
+                // top-level binding, and label falls back to the key.
+                render: {
+                  title: {
+                    type: 'string',
+                    label: 'Title',
+                    required: true,
+                  },
+                  date: { type: 'date', label: 'Release Date', required: true },
+                  status: {
+                    type: 'string',
+                    label: 'Status',
+                    options: [
+                      { label: 'Planned', value: 'planned' },
+                      { label: 'In Progress', value: 'in-progress' },
+                      { label: 'Shipped', value: 'shipped' },
+                    ],
+                  },
+                  progress: {
+                    type: 'number',
+                    label: 'Progress',
+                    min: 0,
+                    max: 100,
+                    widget: { type: 'slider', step: 10, unit: '%' },
+                  },
+                  color: { type: 'color', label: 'Accent Color' },
+                  highlight: { type: 'boolean', label: 'Highlight' },
+                  // An object-valued key: its own render map types the keys
+                  // inside it, one level further down.
+                  link: {
+                    type: 'object',
+                    label: 'Link',
+                    render: {
+                      text: { type: 'string', label: 'Link Text' },
+                      href: {
+                        type: 'url',
+                        label: 'Link URL',
+                        pattern: '^https://',
+                        // Not a library field, so it arrives as meta.hint.
+                        hint: 'Must use https',
+                      },
+                    },
+                  },
+                },
+              },
+            ]}
+            data={[
+              {
+                title: 'Visual editing',
+                date: '2026-03-02',
+                status: 'shipped',
+                progress: 100,
+                color: '#22c55e',
+                highlight: false,
+                link: { text: 'Release notes', href: 'https://github.com' },
+              },
+              {
+                title: 'Custom panels',
+                date: '2026-09-26',
+                status: 'in-progress',
+                progress: 60,
+                color: '#6366f1',
+                highlight: true,
+                link: { text: 'Guide', href: 'https://github.com' },
+              },
+              {
+                title: 'Collaboration',
+                date: '2027-01-15',
+                status: 'planned',
+                progress: 0,
+                color: '#f59e0b',
+                highlight: false,
+                link: { text: 'Discussion', href: 'https://github.com' },
+              },
+            ]}
+            itemKey={item => item.title}
+            renderItem={item => (
+              <div
+                className={cn(
+                  'flex items-center gap-4 border-b border-gray-100 py-4',
+                  item.highlight && 'rounded-lg bg-indigo-50 px-4',
+                )}
+              >
+                <span
+                  className="size-3 shrink-0 rounded-full"
+                  style={{ backgroundColor: item.color }}
+                />
+                <div className="min-w-0 flex-1">
+                  <p className="font-semibold text-gray-800">{item.title}</p>
+                  <p className="text-sm text-gray-500">
+                    {item.date} · {item.status}
+                  </p>
+                  <ui.Progress value={item.progress} className="mt-2" />
+                </div>
+                <a
+                  href={item.link.href}
+                  className="text-sm text-indigo-500 hover:underline"
+                >
+                  {item.link.text}
+                </a>
+              </div>
+            )}
+          />
+          <p
+            className={cn(
+              'mt-6 text-center text-sm text-gray-500',
+              //
+            )}
+          >
+            Last updated{' '}
+            <time
+              data-id=""
+              data-binding={[
+                {
+                  label: 'Updated On',
+                  property: 'dateTime',
+                  type: 'date',
+                  required: true,
+                },
+                { label: 'Updated Text', property: 'innerText' },
+              ]}
+              dateTime="2026-09-26"
+            >
+              September 26, 2026
+            </time>
+            {' · '}
+            <a
+              data-id=""
+              data-binding={[
+                { label: 'Link Text', property: 'innerText' },
+                {
+                  label: 'Link URL',
+                  property: 'href',
+                  type: 'url',
+                  required: true,
+                  pattern: '^https://',
+                },
+              ]}
+              href="https://github.com/pjb0811/live-editor/releases"
+              className="text-indigo-500 hover:underline"
+            >
+              All releases
+            </a>
+          </p>
+        </div>
+      </section>
     `
 	},
 	{
@@ -39613,9 +39810,8 @@ var require_lib = /* @__PURE__ */ __commonJSMin(((exports) => {
 }));
 //#endregion
 //#region node_modules/.pnpm/nanoid@3.3.18/node_modules/nanoid/index.browser.js
-var import_lib = require_lib$7();
-var import_lib$2 = /* @__PURE__ */ __toESM(require_lib$4(), 1);
-var import_lib$1 = /* @__PURE__ */ __toESM(require_lib(), 1);
+var import_lib$1 = require_lib$7();
+var import_lib$3 = /* @__PURE__ */ __toESM(require_lib$4(), 1);
 let nanoid = (size = 21) => crypto.getRandomValues(new Uint8Array(size)).reduce((id, byte) => {
 	byte &= 63;
 	if (byte < 36) id += byte.toString(36);
@@ -39674,20 +39870,22 @@ const createBoundedCache = (limit, onEvict) => {
 };
 //#endregion
 //#region src/utils/ast/document.ts
-const traverse = typeof import_lib$1.default === "function" ? import_lib$1.default : import_lib$1.default.default;
+var import_lib = /* @__PURE__ */ __toESM(require_lib$3(), 1);
+var import_lib$2 = /* @__PURE__ */ __toESM(require_lib(), 1);
+const traverse = typeof import_lib$2.default === "function" ? import_lib$2.default : import_lib$2.default.default;
 const APP_CONTAINER_ID = "app-container";
 const SECTION_TAG = "section";
 const DATA_NAME_ATTR = "data-name";
-const getTagName = (element) => {
+const getTagName$1 = (element) => {
 	const name = element.openingElement.name;
-	return import_lib$2.isJSXIdentifier(name) ? name.name : "";
+	return import_lib$3.isJSXIdentifier(name) ? name.name : "";
 };
-const getAttr = (element, attrName) => element.openingElement.attributes.find((a) => import_lib$2.isJSXAttribute(a) && import_lib$2.isJSXIdentifier(a.name) && a.name.name === attrName);
+const getAttr = (element, attrName) => element.openingElement.attributes.find((a) => import_lib$3.isJSXAttribute(a) && import_lib$3.isJSXIdentifier(a.name) && a.name.name === attrName);
 const getAttrValue = (element, attrName) => {
 	const attr = getAttr(element, attrName);
-	return attr && import_lib$2.isStringLiteral(attr.value) ? attr.value.value : void 0;
+	return attr && import_lib$3.isStringLiteral(attr.value) ? attr.value.value : void 0;
 };
-const isSectionElement = (node) => import_lib$2.isJSXElement(node) && getTagName(node) === SECTION_TAG;
+const isSectionElement = (node) => import_lib$3.isJSXElement(node) && getTagName$1(node) === SECTION_TAG;
 const findContainer = (ast) => {
 	let container;
 	traverse(ast, { JSXElement(path) {
@@ -39705,14 +39903,14 @@ const findOutermostSections = (children) => {
 			sections.push(child);
 			continue;
 		}
-		if (import_lib$2.isJSXElement(child) || import_lib$2.isJSXFragment(child)) sections.push(...findOutermostSections(child.children));
+		if (import_lib$3.isJSXElement(child) || import_lib$3.isJSXFragment(child)) sections.push(...findOutermostSections(child.children));
 	}
 	return sections;
 };
 const documentCache = createBoundedCache(CONFIG.DOCUMENT_CACHE_LIMIT);
 const buildDocument = (code) => {
 	try {
-		const ast = (0, import_lib.parse)(code, {
+		const ast = (0, import_lib$1.parse)(code, {
 			sourceType: "module",
 			plugins: ["jsx", "typescript"]
 		});
@@ -39749,7 +39947,7 @@ const fillSectionIds = (code, generateId = () => nanoid(6)) => {
 	const edits = [];
 	findOutermostSections(doc.container.children).forEach((node) => {
 		const attr = getAttr(node, DATA_ATTR.ID);
-		const id = attr && import_lib$2.isStringLiteral(attr.value) ? attr.value.value : void 0;
+		const id = attr && import_lib$3.isStringLiteral(attr.value) ? attr.value.value : void 0;
 		if (id && !seen.has(id)) {
 			seen.add(id);
 			return;
@@ -39861,6 +40059,693 @@ const createSectionPreviewCache = () => {
 	return { compute };
 };
 //#endregion
-export { __toESM as C, TS_PATTERNS as S, CONFIG as _, generateSectionPreview as a, DRAGGABLE_ITEMS as b, parseDocument as c, createBoundedCache as d, nanoid as f, BINDING_PROP as g, require_lib$7 as h, generateDocumentCode as i, replaceDocumentSections as l, require_lib$4 as m, createSectionPreviewCache as n, generateSectionPreviews as o, require_lib$3 as p, fillSectionIds as r, getSections as s, clearDocumentParseCache as t, traverse as u, DATA_ATTR as v, REGEX as x, DEFAULT_TEMPLATE as y };
+//#region src/utils/ast/types.ts
+const BINDING_TYPES = [
+	"array",
+	"object",
+	"string",
+	"number",
+	"boolean",
+	"color",
+	"jsx",
+	"richtext",
+	"date",
+	"url"
+];
+//#endregion
+//#region src/utils/ast/helpers.ts
+const generate = typeof import_lib.default === "function" ? import_lib.default : import_lib.default.default;
+const wrap = (code) => {
+	return `<>${code}</>`;
+};
+const unwrap = (generated) => {
+	return generated.replace(/^<>\s*/g, "").replace(/\s*<\/>\s*;?\s*$/g, "").trim();
+};
+const attrValue = ({ value, isStringLiteral }) => {
+	if (value === null) return null;
+	if (isStringLiteral) return import_lib$3.stringLiteral(value);
+	const trimmed = value.trim();
+	if (REGEX.NUMBER.test(trimmed)) return import_lib$3.jsxExpressionContainer(import_lib$3.numericLiteral(parseFloat(trimmed)));
+	if (REGEX.BOOLEAN_OR_NULL.test(trimmed)) {
+		const expr = (0, import_lib$1.parseExpression)(trimmed, { plugins: ["jsx", "typescript"] });
+		return import_lib$3.jsxExpressionContainer(expr);
+	}
+	try {
+		const expr = (0, import_lib$1.parseExpression)(trimmed, { plugins: ["jsx", "typescript"] });
+		return import_lib$3.jsxExpressionContainer(expr);
+	} catch {
+		return import_lib$3.stringLiteral(trimmed);
+	}
+};
+const generateCode = (node) => {
+	return generate(node, { jsescOption: { minimal: true } }).code;
+};
+//#endregion
+//#region src/utils/ast/value.ts
+const dedent = (str) => {
+	const lines = str.replace(/^\n/, "").replace(/\n\s*$/, "").split("\n");
+	const indent = lines.reduce((min, line) => {
+		if (!line.trim()) return min;
+		const match = line.match(/^(\s*)/);
+		return Math.min(min, match?.[1]?.length ?? 0);
+	}, Infinity);
+	return indent === Infinity ? str.trim() : lines.map((line) => line.slice(indent)).join("\n");
+};
+const unwrapExpression = (node) => {
+	let current = node;
+	while (import_lib$3.isTSAsExpression(current) || import_lib$3.isTSSatisfiesExpression(current) || import_lib$3.isTSNonNullExpression(current) || import_lib$3.isTSTypeAssertion(current) || import_lib$3.isParenthesizedExpression(current)) current = current.expression;
+	return current;
+};
+const isLosslesslyEvaluable = (node) => {
+	const value = unwrapExpression(node);
+	if (import_lib$3.isStringLiteral(value) || import_lib$3.isNumericLiteral(value) || import_lib$3.isBooleanLiteral(value) || import_lib$3.isNullLiteral(value)) return true;
+	if (import_lib$3.isUnaryExpression(value) && value.operator === "-" && import_lib$3.isNumericLiteral(value.argument)) return true;
+	if (import_lib$3.isTemplateLiteral(value)) return value.expressions.length === 0;
+	if (import_lib$3.isArrayExpression(value)) return value.elements.every((element) => element !== null && isLosslesslyEvaluable(element));
+	if (import_lib$3.isObjectExpression(value)) return value.properties.every((property) => import_lib$3.isObjectProperty(property) && !property.computed && (import_lib$3.isIdentifier(property.key) || import_lib$3.isStringLiteral(property.key) || import_lib$3.isNumericLiteral(property.key)) && isLosslesslyEvaluable(property.value));
+	return false;
+};
+const canLosslesslyEvaluateSource = (source) => {
+	try {
+		return isLosslesslyEvaluable((0, import_lib$1.parseExpression)(source, { plugins: ["jsx", "typescript"] }));
+	} catch {
+		return false;
+	}
+};
+const evaluateLiteral = (rawNode) => {
+	const node = unwrapExpression(rawNode);
+	if (import_lib$3.isStringLiteral(node)) return node.value;
+	if (import_lib$3.isNumericLiteral(node)) return node.value;
+	if (import_lib$3.isBooleanLiteral(node)) return node.value;
+	if (import_lib$3.isNullLiteral(node)) return null;
+	if (import_lib$3.isIdentifier(node) && node.name === "undefined") return;
+	if (import_lib$3.isUnaryExpression(node) && node.operator === "-" && import_lib$3.isNumericLiteral(node.argument)) return -node.argument.value;
+	if (import_lib$3.isTemplateLiteral(node) && node.expressions.length === 0) return node.quasis[0]?.value.cooked ?? node.quasis[0]?.value.raw ?? "";
+	if (import_lib$3.isJSXElement(node) || import_lib$3.isJSXFragment(node)) return generateCode(node);
+	if (import_lib$3.isArrayExpression(node)) return node.elements.map((element) => element ? evaluateLiteral(element) : null);
+	if (import_lib$3.isObjectExpression(node)) {
+		const result = {};
+		for (const prop of node.properties) {
+			if (!import_lib$3.isObjectProperty(prop)) continue;
+			let key = null;
+			if (import_lib$3.isIdentifier(prop.key)) key = prop.key.name;
+			else if (import_lib$3.isStringLiteral(prop.key)) key = prop.key.value;
+			else if (import_lib$3.isNumericLiteral(prop.key)) key = String(prop.key.value);
+			if (key === null) continue;
+			result[key] = evaluateLiteral(prop.value);
+		}
+		return result;
+	}
+};
+const parseValue = (value) => {
+	if (typeof value !== "string") return value;
+	const trimmed = value.trim();
+	if (!trimmed) return value;
+	if (REGEX.NUMBER.test(trimmed)) return parseFloat(trimmed);
+	if (REGEX.BOOLEAN_OR_NULL.test(trimmed)) {
+		if (trimmed === "true") return true;
+		if (trimmed === "false") return false;
+		if (trimmed === "null") return null;
+		if (trimmed === "undefined") return;
+	}
+	if (trimmed.startsWith("{") && trimmed.endsWith("}") || trimmed.startsWith("[") && trimmed.endsWith("]")) {
+		try {
+			const ast = (0, import_lib$1.parseExpression)(trimmed, { plugins: ["jsx", "typescript"] });
+			if (import_lib$3.isObjectExpression(ast) || import_lib$3.isArrayExpression(ast)) return evaluateLiteral(ast);
+		} catch {}
+		return value;
+	}
+	return value;
+};
+const MAX_FLATTEN_DEPTH = 20;
+const isEditablePrimitive = (value) => typeof value === "string" || typeof value === "number" || typeof value === "boolean";
+const flattenEditableValue = (value) => {
+	const parsed = parseValue(value);
+	if (typeof parsed !== "object" || parsed === null || Object.keys(parsed).length === 0) return null;
+	const entries = [];
+	const walk = (node, path, depth) => {
+		if (depth > MAX_FLATTEN_DEPTH) return;
+		if (isEditablePrimitive(node)) {
+			entries.push({
+				path,
+				value: node
+			});
+			return;
+		}
+		if (Array.isArray(node)) {
+			node.forEach((item, index) => walk(item, [...path, index], depth + 1));
+			return;
+		}
+		if (typeof node === "object" && node !== null) Object.entries(node).forEach(([key, item]) => walk(item, [...path, key], depth + 1));
+	};
+	walk(parsed, [], 0);
+	return entries.length ? entries : null;
+};
+const setEditableValue = (value, path, next) => {
+	if (!path.length) return value;
+	const parsed = parseValue(value);
+	if (typeof parsed !== "object" || parsed === null) return value;
+	const root = Array.isArray(parsed) ? [...parsed] : { ...parsed };
+	let cursor = root;
+	for (let i = 0; i < path.length - 1; i++) {
+		const key = path[i];
+		const child = cursor[key];
+		if (typeof child !== "object" || child === null) return value;
+		const clonedChild = Array.isArray(child) ? [...child] : { ...child };
+		cursor[key] = clonedChild;
+		cursor = clonedChild;
+	}
+	const lastKey = path[path.length - 1];
+	if (!(lastKey in cursor)) return value;
+	cursor[lastKey] = next;
+	return JSON.stringify(root);
+};
+const extractNodeValue = (node) => {
+	if (import_lib$3.isBooleanLiteral(node)) return {
+		type: "boolean",
+		value: node.value
+	};
+	if (import_lib$3.isNumericLiteral(node)) return {
+		type: "number",
+		value: node.value
+	};
+	if (import_lib$3.isUnaryExpression(node) && node.operator === "-" && import_lib$3.isNumericLiteral(node.argument)) return {
+		type: "number",
+		value: -node.argument.value
+	};
+	if (import_lib$3.isStringLiteral(node)) return {
+		type: "string",
+		value: node.value
+	};
+	if (import_lib$3.isTemplateLiteral(node)) {
+		if (node.expressions.length === 0 && node.quasis.length === 1) return {
+			type: "string",
+			value: dedent(node.quasis[0].value.cooked ?? node.quasis[0].value.raw)
+		};
+		return {
+			type: "string",
+			value: generateCode(node)
+		};
+	}
+	if (import_lib$3.isNullLiteral(node)) return {
+		type: "null",
+		value: null
+	};
+	if (import_lib$3.isArrayExpression(node)) return {
+		type: "array",
+		value: generateCode(node)
+	};
+	if (import_lib$3.isObjectExpression(node)) return {
+		type: "object",
+		value: generateCode(node)
+	};
+	if (import_lib$3.isJSXElement(node) || import_lib$3.isJSXFragment(node)) return {
+		type: "string",
+		value: generateCode(node)
+	};
+	return {
+		type: "unknown",
+		value: null
+	};
+};
+const createNodeFromValue = (type, value) => {
+	switch (type) {
+		case "boolean": return import_lib$3.booleanLiteral(value === true);
+		case "number": return import_lib$3.numericLiteral(Number(value));
+		case "string": return import_lib$3.stringLiteral(String(value));
+		case "null": return import_lib$3.nullLiteral();
+		case "array":
+		case "object":
+		case "unknown": return null;
+		default: return null;
+	}
+};
+const valueToExpression = (value) => {
+	if (typeof value === "string") return import_lib$3.stringLiteral(value);
+	if (typeof value === "number") return value < 0 ? import_lib$3.unaryExpression("-", import_lib$3.numericLiteral(-value)) : import_lib$3.numericLiteral(value);
+	if (typeof value === "boolean") return import_lib$3.booleanLiteral(value);
+	if (value === null) return import_lib$3.nullLiteral();
+	if (Array.isArray(value)) return import_lib$3.arrayExpression(value.map((item) => valueToExpression(item) ?? import_lib$3.nullLiteral()));
+	if (typeof value === "object") {
+		const properties = [];
+		for (const [key, item] of Object.entries(value)) {
+			const expr = valueToExpression(item);
+			if (expr === null) continue;
+			properties.push(import_lib$3.objectProperty(import_lib$3.stringLiteral(key), expr));
+		}
+		return import_lib$3.objectExpression(properties);
+	}
+	return null;
+};
+const parseArrayExpression = (value) => {
+	try {
+		const ast = unwrapExpression((0, import_lib$1.parseExpression)(value, { plugins: ["jsx", "typescript"] }));
+		if (!import_lib$3.isArrayExpression(ast)) return null;
+		return ast;
+	} catch (error) {
+		console.error("❌ Array parsing error:", error);
+		return null;
+	}
+};
+const extractObjectProperties = (element) => {
+	const properties = {};
+	element.properties.forEach((prop) => {
+		if (import_lib$3.isObjectProperty(prop) && import_lib$3.isIdentifier(prop.key)) {
+			const key = prop.key.name;
+			if (key === "children" || import_lib$3.isJSXElement(prop.value) || import_lib$3.isJSXFragment(prop.value)) return;
+			const extracted = extractNodeValue(prop.value);
+			properties[key] = {
+				...extracted,
+				astNode: prop.value
+			};
+		}
+	});
+	return properties;
+};
+const arrayExpressionToCode = (elements) => {
+	const nextAst = import_lib$3.arrayExpression(elements);
+	return generateCode(nextAst);
+};
+//#endregion
+//#region src/utils/ast/binding.ts
+const bindingTypeSchema = z.enum(BINDING_TYPES);
+const bindingOptionSchema = z.object({
+	label: z.string(),
+	value: z.string()
+});
+const bindingWidgetSchema = z.object({
+	type: z.string().min(1),
+	step: z.number().optional(),
+	unit: z.string().optional()
+}).passthrough();
+const pick = (schema, value) => {
+	const parsed = schema.safeParse(value);
+	return parsed.success ? parsed.data : void 0;
+};
+const sanitizeWidget = (value) => {
+	if (typeof value === "string") return value ? { type: value } : void 0;
+	return pick(bindingWidgetSchema, value);
+};
+const sanitizeOptions = (value) => {
+	if (!Array.isArray(value)) return;
+	const options = value.flatMap((option) => {
+		const parsed = pick(bindingOptionSchema, option);
+		return parsed ? [parsed] : [];
+	});
+	return options.length > 0 ? options : void 0;
+};
+const KNOWN_BINDING_KEYS = /* @__PURE__ */ new Set([
+	"label",
+	"property",
+	"type",
+	"widget",
+	"options",
+	"render",
+	"min",
+	"max",
+	"pattern",
+	"required"
+]);
+const isPlainObject = (value) => {
+	return typeof value === "object" && value !== null && !Array.isArray(value);
+};
+const sanitizeField = (raw) => {
+	const metaEntries = Object.entries(raw).filter(([key]) => !KNOWN_BINDING_KEYS.has(key));
+	const field = {
+		label: pick(z.string(), raw.label),
+		property: pick(z.string(), raw.property),
+		type: pick(bindingTypeSchema, raw.type),
+		widget: sanitizeWidget(raw.widget),
+		options: sanitizeOptions(raw.options),
+		render: sanitizeRenderMap(raw.render),
+		min: pick(z.number(), raw.min),
+		max: pick(z.number(), raw.max),
+		pattern: pick(z.string(), raw.pattern),
+		required: pick(z.boolean(), raw.required),
+		meta: metaEntries.length > 0 ? Object.fromEntries(metaEntries) : void 0
+	};
+	return Object.fromEntries(Object.entries(field).filter(([, value]) => value !== void 0));
+};
+function sanitizeRenderMap(value) {
+	if (!isPlainObject(value)) return;
+	const map = {};
+	for (const [key, raw] of Object.entries(value)) {
+		if (!isPlainObject(raw)) continue;
+		if ("type" in raw) {
+			map[key] = {
+				type: void 0,
+				...sanitizeField(raw)
+			};
+			continue;
+		}
+		const nested = sanitizeRenderMap(raw);
+		if (nested) map[key] = nested;
+	}
+	return Object.keys(map).length > 0 ? map : void 0;
+}
+const buildBindingItems = (raw) => {
+	if (!Array.isArray(raw)) return [];
+	return raw.flatMap((rawItem) => {
+		if (!isPlainObject(rawItem)) return [];
+		const { label, property, ...field } = sanitizeField(rawItem);
+		if (label === void 0) return [];
+		if (property === void 0 && field.type !== "richtext") return [];
+		return [{
+			label,
+			property: property ?? BINDING_PROP.INNER_HTML,
+			...field
+		}];
+	});
+};
+const parseBinding = (bindingValue) => {
+	if (!bindingValue) return [];
+	const ast = parseArrayExpression(bindingValue);
+	if (!ast) return [];
+	return buildBindingItems(evaluateLiteral(ast));
+};
+const parseBindingExpression = (expression) => buildBindingItems(evaluateLiteral(expression));
+const getCurrentValue = (node, property) => {
+	switch (property) {
+		case BINDING_PROP.INNER_TEXT: return node.textContent || "";
+		case BINDING_PROP.INNER_HTML: {
+			const dsiAttr = node.attributes.find((a) => a.name === "dangerouslySetInnerHTML");
+			if (dsiAttr?.value) try {
+				const expr = (0, import_lib$1.parseExpression)(dsiAttr.value, { plugins: ["jsx", "typescript"] });
+				if (import_lib$3.isObjectExpression(expr)) {
+					const htmlProp = expr.properties.find((p) => import_lib$3.isObjectProperty(p) && import_lib$3.isIdentifier(p.key) && p.key.name === "__html");
+					if (htmlProp) {
+						if (import_lib$3.isStringLiteral(htmlProp.value)) return htmlProp.value.value;
+						if (import_lib$3.isTemplateLiteral(htmlProp.value) && htmlProp.value.expressions.length === 0) return htmlProp.value.quasis[0]?.value.cooked ?? htmlProp.value.quasis[0]?.value.raw ?? "";
+					}
+				}
+			} catch {}
+			return node.rawChildren || node.textContent || "";
+		}
+		case BINDING_PROP.CHILDREN: return JSON.stringify(node?.children || []);
+		default: return node.attributes.find((attr) => attr.name === property)?.value || "";
+	}
+};
+const STRING_VALUED_TYPES = /* @__PURE__ */ new Set([
+	"string",
+	"url",
+	"date",
+	"color",
+	"jsx",
+	"richtext"
+]);
+const getStructuredValue = (node, property, type) => {
+	switch (property) {
+		case BINDING_PROP.INNER_TEXT:
+		case BINDING_PROP.INNER_HTML: return getCurrentValue(node, property);
+		case BINDING_PROP.CHILDREN: return node.children ?? [];
+		default: {
+			const raw = getCurrentValue(node, property);
+			if (node.attributes.find((a) => a.name === property)?.isStringLiteral || type && STRING_VALUED_TYPES.has(type)) return raw;
+			return parseValue(raw);
+		}
+	}
+};
+const hasEditableBindings = (node) => {
+	const bindingAttr = node.dataAttributes.find((attr) => attr.name === DATA_ATTR.BINDING);
+	if (!bindingAttr?.value) return false;
+	return (node.bindings || parseBinding(bindingAttr.value)).length > 0;
+};
+const findEditableChildren = (node) => {
+	const editableChildren = [];
+	const traverse = (children) => {
+		if (!children) return;
+		for (const child of children) {
+			if (hasEditableBindings(child)) editableChildren.push(child);
+			traverse(child.children);
+		}
+	};
+	traverse(node.children);
+	return editableChildren;
+};
+//#endregion
+//#region src/utils/ast/extract.ts
+const collectText = (children) => {
+	return children.filter((c) => import_lib$3.isJSXText(c)).map((c) => c.value.trim()).filter((v) => v.length).join(" ");
+};
+const getTagName = (opening) => {
+	if (import_lib$3.isJSXIdentifier(opening.name)) return opening.name.name;
+	if (import_lib$3.isJSXMemberExpression(opening.name)) return resolveMemberName(opening.name);
+	return "";
+};
+const resolveMemberName = (expr) => {
+	const parts = [];
+	const collectMemberParts = (node) => {
+		if (import_lib$3.isJSXIdentifier(node)) parts.push(node.name);
+		else if (import_lib$3.isJSXMemberExpression(node)) {
+			collectMemberParts(node.object);
+			if (import_lib$3.isJSXIdentifier(node.property)) parts.push(node.property.name);
+		}
+	};
+	collectMemberParts(expr.object);
+	if (import_lib$3.isJSXIdentifier(expr.property)) parts.push(expr.property.name);
+	return parts.join(".");
+};
+const parseJSXName = (tagName) => {
+	const parts = tagName.split(".");
+	if (parts.length === 1) return import_lib$3.jsxIdentifier(parts[0]);
+	let expr = import_lib$3.jsxIdentifier(parts[0]);
+	for (let i = 1; i < parts.length; i++) expr = import_lib$3.jsxMemberExpression(expr, import_lib$3.jsxIdentifier(parts[i]));
+	return expr;
+};
+const extractCache = createBoundedCache(CONFIG.CACHE_LIMIT);
+const extractAttributes = (attributes, source) => {
+	const allAttrs = [];
+	const dataAttrs = [];
+	for (const attr of attributes) {
+		if (!import_lib$3.isJSXAttribute(attr) || !import_lib$3.isJSXIdentifier(attr.name)) continue;
+		const name = attr.name.name;
+		let value = null;
+		let isStringLiteral = false;
+		if (attr.value) {
+			if (import_lib$3.isStringLiteral(attr.value)) {
+				value = attr.value.value;
+				isStringLiteral = true;
+			} else if (import_lib$3.isJSXExpressionContainer(attr.value)) try {
+				const expression = attr.value.expression;
+				const structural = import_lib$3.isArrayExpression(unwrapExpression(expression)) || import_lib$3.isObjectExpression(unwrapExpression(expression));
+				value = source && structural && expression.start != null && expression.end != null ? source.slice(expression.start, expression.end) : generateCode(expression);
+				isStringLiteral = false;
+			} catch {
+				value = null;
+			}
+		}
+		const entry = {
+			name,
+			value,
+			isStringLiteral
+		};
+		allAttrs.push(entry);
+		if (name.startsWith("data-")) dataAttrs.push(entry);
+	}
+	return {
+		allAttrs,
+		dataAttrs
+	};
+};
+const buildChildElements = (node) => {
+	const childElements = [];
+	if (node.textContent) childElements.push(import_lib$3.jsxText(node.textContent));
+	node.children?.forEach((child) => {
+		const childJSX = nodeToJSX(child);
+		if (childJSX) childElements.push(childJSX);
+	});
+	return childElements;
+};
+const nodeToJSX = (node) => {
+	try {
+		if (node.isFragment) {
+			const childElements = buildChildElements(node);
+			return import_lib$3.jsxFragment(import_lib$3.jsxOpeningFragment(), import_lib$3.jsxClosingFragment(), childElements);
+		}
+		if (node.tagName === "div" && node.dataAttributes.some((attr) => attr.name === "data-item")) {
+			if (node.children) return nodeToJSX(node.children[0]);
+			return null;
+		}
+		const attributes = node.attributes.map((attr) => {
+			const attrName = import_lib$3.jsxIdentifier(attr.name);
+			if (!attr.value) return import_lib$3.jsxAttribute(attrName, null);
+			return import_lib$3.jsxAttribute(attrName, attrValue(attr));
+		});
+		const elementName = parseJSXName(node.tagName);
+		const openingElement = import_lib$3.jsxOpeningElement(elementName, attributes);
+		const closingElement = import_lib$3.jsxClosingElement(elementName);
+		const children = buildChildElements(node);
+		return import_lib$3.jsxElement(openingElement, closingElement, children, false);
+	} catch (error) {
+		console.error("❌ DataAttrNode to JSX conversion error:", error);
+		return null;
+	}
+};
+const createWrapperNode = (textContent, children) => ({
+	tagName: "div",
+	id: nanoid(6),
+	attributes: [{
+		name: DATA_ATTR.ITEM,
+		value: "true"
+	}],
+	dataAttributes: [{
+		name: DATA_ATTR.ITEM,
+		value: "true"
+	}],
+	textContent,
+	children
+});
+const createFragmentNode = (textContent, children) => ({
+	tagName: "",
+	id: nanoid(6),
+	attributes: [],
+	dataAttributes: [],
+	textContent,
+	children,
+	isFragment: true
+});
+const processChildrenBinding = (jsxElement, processedNodes, shouldWrap = true, source) => {
+	const jsxChildren = jsxElement.children.filter((child) => import_lib$3.isJSXElement(child) || import_lib$3.isJSXFragment(child));
+	if (!jsxChildren.length) return;
+	const childrenNodes = [];
+	jsxChildren.forEach((child) => {
+		if (import_lib$3.isJSXElement(child)) {
+			const childResults = extractFromNode(child, processedNodes, source);
+			if (shouldWrap) {
+				const wrapperNode = createWrapperNode(collectText(child.children), childResults);
+				wrapperNode.source = source?.slice(child.start, child.end);
+				const dataId = childResults[0]?.dataAttributes.find((attr) => attr.name === DATA_ATTR.ID)?.value;
+				if (dataId) wrapperNode.id = `child:${dataId}`;
+				childrenNodes.push(wrapperNode);
+			} else childrenNodes.push(...childResults);
+		} else if (import_lib$3.isJSXFragment(child)) {
+			processedNodes?.add(child);
+			const fragmentChildren = [];
+			child.children.forEach((fragmentChild) => {
+				if (import_lib$3.isJSXElement(fragmentChild)) {
+					const childResults = extractFromNode(fragmentChild, processedNodes, source);
+					fragmentChildren.push(...childResults);
+				}
+			});
+			if (fragmentChildren.length) {
+				const fragmentNode = createFragmentNode(collectText(child.children), fragmentChildren);
+				fragmentNode.source = source?.slice(child.start, child.end);
+				childrenNodes.push(fragmentNode);
+			}
+		}
+	});
+	return childrenNodes.length ? childrenNodes : void 0;
+};
+const skipItemsChildren = (jsxElement, processedNodes, propertyName = "items") => {
+	const itemsAttr = jsxElement.openingElement.attributes.find((attr) => import_lib$3.isJSXAttribute(attr) && import_lib$3.isJSXIdentifier(attr.name) && attr.name.name === propertyName);
+	if (!itemsAttr || !import_lib$3.isJSXAttribute(itemsAttr)) return;
+	if (itemsAttr.value && import_lib$3.isJSXExpressionContainer(itemsAttr.value) && import_lib$3.isArrayExpression(itemsAttr.value.expression)) itemsAttr.value.expression.elements.forEach((element) => {
+		if (import_lib$3.isObjectExpression(element)) element.properties.forEach((prop) => {
+			if (import_lib$3.isObjectProperty(prop) && import_lib$3.isIdentifier(prop.key) && import_lib$3.isJSXElement(prop.value)) markProcessedJSX(prop.value, processedNodes);
+		});
+	});
+};
+const markProcessedJSX = (node, processedNodes) => {
+	if (import_lib$3.isJSXElement(node) || import_lib$3.isJSXFragment(node)) {
+		processedNodes.add(node);
+		node.children.forEach((child) => markProcessedJSX(child, processedNodes));
+		return;
+	}
+	if (import_lib$3.isJSXExpressionContainer(node) || import_lib$3.isParenthesizedExpression(node)) markProcessedJSX(node.expression, processedNodes);
+};
+const getBindingExpression = (opening) => {
+	for (const attr of opening.attributes) if (import_lib$3.isJSXAttribute(attr) && import_lib$3.isJSXIdentifier(attr.name) && attr.name.name === DATA_ATTR.BINDING && attr.value && import_lib$3.isJSXExpressionContainer(attr.value)) {
+		const expression = unwrapExpression(attr.value.expression);
+		if (import_lib$3.isArrayExpression(expression)) return expression;
+	}
+	return null;
+};
+const readNodeBindingInfo = (node, source) => {
+	const opening = node.openingElement;
+	const tagName = getTagName(opening);
+	const { allAttrs, dataAttrs } = extractAttributes(opening.attributes, source);
+	const bindingAttr = dataAttrs.find((attr) => attr.name === DATA_ATTR.BINDING);
+	const bindingExpr = getBindingExpression(opening);
+	const bindings = bindingExpr ? parseBindingExpression(bindingExpr) : bindingAttr?.value ? parseBinding(bindingAttr.value) : [];
+	const childrenBinding = bindings.find((b) => b.property === BINDING_PROP.CHILDREN);
+	const arrayBindings = bindings.filter((b) => b.property === BINDING_PROP.ITEMS || b.type === "array");
+	const innerHtmlBinding = bindings.find((b) => b.property === BINDING_PROP.INNER_HTML);
+	let rawChildren;
+	if (innerHtmlBinding && node.children.length > 0) rawChildren = node.children.map((child) => generateCode(child)).join("").trim();
+	return {
+		tagName,
+		allAttrs,
+		dataAttrs,
+		bindings,
+		childrenBinding,
+		arrayBindings,
+		rawChildren
+	};
+};
+const parseToNodes = (raw) => {
+	const wrapped = wrap(raw);
+	const ast = (0, import_lib$1.parse)(wrapped, {
+		sourceType: "module",
+		plugins: ["jsx", "typescript"],
+		errorRecovery: true
+	});
+	const results = [];
+	const processedNodes = /* @__PURE__ */ new WeakSet();
+	traverse(ast, { JSXElement(path) {
+		if (processedNodes.has(path.node)) return;
+		const { tagName, allAttrs, dataAttrs, bindings, childrenBinding, arrayBindings, rawChildren } = readNodeBindingInfo(path.node, wrapped);
+		if (!tagName || !dataAttrs.length) return;
+		let childrenNodes;
+		if (childrenBinding) childrenNodes = processChildrenBinding(path.node, processedNodes, true, wrapped);
+		for (const arrayBinding of arrayBindings) skipItemsChildren(path.node, processedNodes, arrayBinding.property);
+		results.push({
+			tagName,
+			attributes: allAttrs,
+			dataAttributes: dataAttrs,
+			textContent: collectText(path.node.children),
+			rawChildren,
+			children: childrenNodes,
+			bindings,
+			loc: path.node.loc ? {
+				start: {
+					line: path.node.loc.start.line,
+					column: path.node.loc.start.column
+				},
+				end: {
+					line: path.node.loc.end.line,
+					column: path.node.loc.end.column
+				}
+			} : void 0
+		});
+	} });
+	return results;
+};
+function extract(raw) {
+	if (extractCache.has(raw)) return extractCache.get(raw);
+	const results = parseToNodes(raw);
+	extractCache.set(raw, results);
+	return results;
+}
+function extractFromNode(node, processedNodes, source) {
+	processedNodes?.add(node);
+	const { tagName, allAttrs, dataAttrs, bindings, childrenBinding, rawChildren } = readNodeBindingInfo(node, source);
+	let childrenNodes;
+	if (childrenBinding) childrenNodes = processChildrenBinding(node, processedNodes, true, source);
+	if (!childrenNodes) childrenNodes = processChildrenBinding(node, processedNodes, false, source);
+	return [{
+		tagName,
+		attributes: allAttrs,
+		dataAttributes: dataAttrs,
+		textContent: collectText(node.children),
+		rawChildren,
+		children: childrenNodes,
+		bindings
+	}];
+}
+function clearExtractCache() {
+	extractCache.clear();
+}
+//#endregion
+export { generateSectionPreviews as A, CONFIG as B, unwrap as C, fillSectionIds as D, createSectionPreviewCache as E, createBoundedCache as F, TS_PATTERNS as G, DEFAULT_TEMPLATE as H, nanoid as I, __toESM as K, require_lib$4 as L, parseDocument as M, replaceDocumentSections as N, generateDocumentCode as O, traverse as P, require_lib$7 as R, generateCode as S, clearDocumentParseCache as T, DRAGGABLE_ITEMS as U, DATA_ATTR as V, REGEX as W, parseArrayExpression as _, findEditableChildren as a, unwrapExpression as b, parseBinding as c, canLosslesslyEvaluateSource as d, createNodeFromValue as f, isLosslesslyEvaluable as g, flattenEditableValue as h, STRING_VALUED_TYPES as i, getSections as j, generateSectionPreview as k, parseBindingExpression as l, extractObjectProperties as m, extract as n, getCurrentValue as o, extractNodeValue as p, nodeToJSX as r, getStructuredValue as s, clearExtractCache as t, arrayExpressionToCode as u, parseValue as v, wrap as w, valueToExpression as x, setEditableValue as y, BINDING_PROP as z };
 
-//# sourceMappingURL=document-C6bNHl7l.js.map
+//# sourceMappingURL=extract-abHYmNsu.js.map