pika-plugin-ai 0.6.8

package/dist/index.mjs

@@ -0,0 +1,1846 @@
+"use client";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+
+// ../tsup-config/react-import.js
+import React from "react";
+
+// index.tsx
+import {
+  useState,
+  useCallback,
+  useEffect,
+  useRef,
+  useContext,
+  createContext,
+  useMemo
+} from "react";
+import { useGetPuck, createUsePuck } from "pika-editor-core";
+import { useChat } from "@ai-sdk/react";
+import {
+  DefaultChatTransport,
+  getToolName,
+  isDataUIPart,
+  isFileUIPart,
+  isReasoningUIPart,
+  isTextUIPart,
+  isToolUIPart
+} from "ai";
+import ReactMarkdown from "react-markdown";
+import TextareaAutosize from "react-textarea-autosize";
+import { useStickToBottom } from "use-stick-to-bottom";
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/createLucideIcon.js
+import { forwardRef as forwardRef2, createElement as createElement2 } from "react";
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/shared/src/utils.js
+var toKebabCase = (string) => string.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+var mergeClasses = (...classes) => classes.filter((className, index, array) => {
+  return Boolean(className) && array.indexOf(className) === index;
+}).join(" ");
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/Icon.js
+import { forwardRef, createElement } from "react";
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/defaultAttributes.js
+var defaultAttributes = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: 24,
+  height: 24,
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: 2,
+  strokeLinecap: "round",
+  strokeLinejoin: "round"
+};
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/Icon.js
+var Icon = forwardRef(
+  (_a, ref) => {
+    var _b = _a, {
+      color = "currentColor",
+      size = 24,
+      strokeWidth = 2,
+      absoluteStrokeWidth,
+      className = "",
+      children,
+      iconNode
+    } = _b, rest = __objRest(_b, [
+      "color",
+      "size",
+      "strokeWidth",
+      "absoluteStrokeWidth",
+      "className",
+      "children",
+      "iconNode"
+    ]);
+    return createElement(
+      "svg",
+      __spreadValues(__spreadProps(__spreadValues({
+        ref
+      }, defaultAttributes), {
+        width: size,
+        height: size,
+        stroke: color,
+        strokeWidth: absoluteStrokeWidth ? Number(strokeWidth) * 24 / Number(size) : strokeWidth,
+        className: mergeClasses("lucide", className)
+      }), rest),
+      [
+        ...iconNode.map(([tag, attrs]) => createElement(tag, attrs)),
+        ...Array.isArray(children) ? children : [children]
+      ]
+    );
+  }
+);
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/createLucideIcon.js
+var createLucideIcon = (iconName, iconNode) => {
+  const Component = forwardRef2(
+    (_a, ref) => {
+      var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+      return createElement2(Icon, __spreadValues({
+        ref,
+        iconNode,
+        className: mergeClasses(`lucide-${toKebabCase(iconName)}`, className)
+      }, props));
+    }
+  );
+  Component.displayName = `${iconName}`;
+  return Component;
+};
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/icons/arrow-left.js
+var ArrowLeft = createLucideIcon("ArrowLeft", [
+  ["path", { d: "m12 19-7-7 7-7", key: "1l729n" }],
+  ["path", { d: "M19 12H5", key: "x3x0zl" }]
+]);
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/icons/arrow-up.js
+var ArrowUp = createLucideIcon("ArrowUp", [
+  ["path", { d: "m5 12 7-7 7 7", key: "hav0vg" }],
+  ["path", { d: "M12 19V5", key: "x0mq9r" }]
+]);
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/icons/bot.js
+var Bot = createLucideIcon("Bot", [
+  ["path", { d: "M12 8V4H8", key: "hb8ula" }],
+  ["rect", { width: "16", height: "12", x: "4", y: "8", rx: "2", key: "enze0r" }],
+  ["path", { d: "M2 14h2", key: "vft8re" }],
+  ["path", { d: "M20 14h2", key: "4cs60a" }],
+  ["path", { d: "M15 13v2", key: "1xurst" }],
+  ["path", { d: "M9 13v2", key: "rq6x2g" }]
+]);
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/icons/check.js
+var Check = createLucideIcon("Check", [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]]);
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/icons/eye-off.js
+var EyeOff = createLucideIcon("EyeOff", [
+  [
+    "path",
+    {
+      d: "M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49",
+      key: "ct8e1f"
+    }
+  ],
+  ["path", { d: "M14.084 14.158a3 3 0 0 1-4.242-4.242", key: "151rxh" }],
+  [
+    "path",
+    {
+      d: "M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143",
+      key: "13bj9a"
+    }
+  ],
+  ["path", { d: "m2 2 20 20", key: "1ooewy" }]
+]);
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/icons/eye.js
+var Eye = createLucideIcon("Eye", [
+  [
+    "path",
+    {
+      d: "M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0",
+      key: "1nclc0"
+    }
+  ],
+  ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
+]);
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/icons/image.js
+var Image = createLucideIcon("Image", [
+  ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", ry: "2", key: "1m3agn" }],
+  ["circle", { cx: "9", cy: "9", r: "2", key: "af1f0g" }],
+  ["path", { d: "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21", key: "1xmnt7" }]
+]);
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/icons/rotate-ccw.js
+var RotateCcw = createLucideIcon("RotateCcw", [
+  ["path", { d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8", key: "1357e3" }],
+  ["path", { d: "M3 3v5h5", key: "1xhq8a" }]
+]);
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/icons/settings.js
+var Settings = createLucideIcon("Settings", [
+  [
+    "path",
+    {
+      d: "M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z",
+      key: "1qme2f"
+    }
+  ],
+  ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
+]);
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/icons/trash-2.js
+var Trash2 = createLucideIcon("Trash2", [
+  ["path", { d: "M3 6h18", key: "d0wm0j" }],
+  ["path", { d: "M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6", key: "4alrt4" }],
+  ["path", { d: "M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2", key: "v07s0e" }],
+  ["line", { x1: "10", x2: "10", y1: "11", y2: "17", key: "1uufr5" }],
+  ["line", { x1: "14", x2: "14", y1: "11", y2: "17", key: "xtxkd" }]
+]);
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/icons/triangle-alert.js
+var TriangleAlert = createLucideIcon("TriangleAlert", [
+  [
+    "path",
+    {
+      d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3",
+      key: "wmoenq"
+    }
+  ],
+  ["path", { d: "M12 9v4", key: "juzpu7" }],
+  ["path", { d: "M12 17h.01", key: "p32p05" }]
+]);
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/icons/wrench.js
+var Wrench = createLucideIcon("Wrench", [
+  [
+    "path",
+    {
+      d: "M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z",
+      key: "cbrjhi"
+    }
+  ]
+]);
+
+// ../../node_modules/.pnpm/lucide-react@0.452.0_react@19.2.4/node_modules/lucide-react/dist/esm/icons/x.js
+var X = createLucideIcon("X", [
+  ["path", { d: "M18 6 6 18", key: "1bl5f8" }],
+  ["path", { d: "m6 6 12 12", key: "d8bk6v" }]
+]);
+
+// index.tsx
+import qler from "qler";
+import { ulid } from "ulid";
+import html2canvas from "html2canvas-pro";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function readFileAsDataURL(file) {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.onload = () => resolve(reader.result);
+    reader.onerror = reject;
+    reader.readAsDataURL(file);
+  });
+}
+function filesToAttachedImages(files) {
+  return __async(this, null, function* () {
+    const results = [];
+    for (const file of Array.from(files)) {
+      if (!file.type.startsWith("image/")) continue;
+      const dataUrl = yield readFileAsDataURL(file);
+      results.push({ id: prefixedUlid("img"), dataUrl, name: file.name });
+    }
+    return results;
+  });
+}
+function mediaTypeFromDataUrl(dataUrl) {
+  if (!dataUrl.startsWith("data:")) return "application/octet-stream";
+  const rest = dataUrl.slice(5);
+  const semi = rest.indexOf(";");
+  const comma = rest.indexOf(",");
+  const end = semi === -1 ? comma : semi;
+  if (end <= 0) return "application/octet-stream";
+  return rest.slice(0, end) || "application/octet-stream";
+}
+function attachedImageToFileUIPart(img) {
+  return {
+    type: "file",
+    mediaType: mediaTypeFromDataUrl(img.dataUrl),
+    url: img.dataUrl,
+    filename: img.name
+  };
+}
+var DEFAULT_AI_SETTINGS = {
+  thinkingLevel: "none",
+  urlContext: false,
+  googleSearch: false,
+  enterpriseWebSearch: false,
+  browserCapture: false,
+  pageMigrationIr: false,
+  figmaToken: ""
+};
+var AI_SETTINGS_STORAGE_KEY = "puck-ai-settings";
+function useAiSettings(storageKey = AI_SETTINGS_STORAGE_KEY) {
+  const [settings, setSettingsState] = useState(() => {
+    try {
+      if (typeof window !== "undefined") {
+        const stored = localStorage.getItem(storageKey);
+        if (stored) return __spreadValues(__spreadValues({}, DEFAULT_AI_SETTINGS), JSON.parse(stored));
+      }
+    } catch (e) {
+    }
+    return __spreadValues({}, DEFAULT_AI_SETTINGS);
+  });
+  const setSettings = useCallback(
+    (update) => {
+      setSettingsState((prev) => {
+        const next = __spreadValues(__spreadValues({}, prev), update);
+        try {
+          localStorage.setItem(storageKey, JSON.stringify(next));
+        } catch (e) {
+        }
+        return next;
+      });
+    },
+    [storageKey]
+  );
+  return [settings, setSettings];
+}
+var prefixedUlid = (prefix = "") => `${prefix ? `${prefix}_` : ""}${ulid()}`;
+var q = qler();
+var getSelectorForId = (state, id) => {
+  var _a, _b, _c, _d;
+  const node = (_b = (_a = state == null ? void 0 : state.indexes) == null ? void 0 : _a.nodes) == null ? void 0 : _b[id];
+  if (!node) return void 0;
+  const zoneCompound = `${node.parentId}:${node.zone}`;
+  const index = (_d = (_c = state.indexes.zones[zoneCompound]) == null ? void 0 : _c.contentIds) == null ? void 0 : _d.indexOf(id);
+  return { zone: zoneCompound, index };
+};
+var getItemById = (state, id) => {
+  var _a, _b, _c;
+  return (_c = (_b = (_a = state == null ? void 0 : state.indexes) == null ? void 0 : _a.nodes) == null ? void 0 : _b[id]) == null ? void 0 : _c.data;
+};
+var applyArrayDefaults = (oldProps, newProps, fields) => {
+  const updatedProps = __spreadValues(__spreadValues({}, oldProps), newProps);
+  for (const fieldName in fields) {
+    const field = fields[fieldName];
+    if (field.type === "array") {
+      const arrayField = field;
+      const arrayFields = arrayField.arrayFields;
+      updatedProps[fieldName] = (updatedProps[fieldName] || []).map(
+        (item, index) => {
+          var _a, _b, _c, _d, _e;
+          const newItem = {};
+          const defaultValue = typeof arrayField.defaultItemProps === "function" ? arrayField.defaultItemProps(index) : arrayField.defaultItemProps;
+          for (const arrayFieldName in arrayFields) {
+            const subField = arrayFields[arrayFieldName];
+            if (subField.type === "slot") {
+              newItem[arrayFieldName] = (_d = (_c = item[arrayFieldName]) != null ? _c : (_b = (_a = oldProps[fieldName]) == null ? void 0 : _a[index]) == null ? void 0 : _b[arrayFieldName]) != null ? _d : defaultValue == null ? void 0 : defaultValue[arrayFieldName];
+            } else {
+              newItem[arrayFieldName] = (_e = item[arrayFieldName]) != null ? _e : defaultValue == null ? void 0 : defaultValue[arrayFieldName];
+            }
+          }
+          return newItem;
+        }
+      );
+    }
+  }
+  return updatedProps;
+};
+var scheduleReplacePropsAfterAddInsert = (operation, {
+  getState,
+  dispatchAction,
+  config
+}) => {
+  const maxAttempts = 8;
+  const tryApply = (attempt) => {
+    var _a, _b, _c, _d, _e;
+    const existing = getItemById(getState(), operation.id);
+    if (existing) {
+      const newData = __spreadProps(__spreadValues({}, existing), {
+        props: applyArrayDefaults(
+          existing.props,
+          operation.props,
+          (_b = (_a = config.components[existing.type]) == null ? void 0 : _a.fields) != null ? _b : {}
+        )
+      });
+      dispatchAction({
+        type: "replace",
+        destinationIndex: operation.index,
+        destinationZone: operation.zone,
+        data: newData,
+        recordHistory: false
+      });
+      return;
+    }
+    if (attempt >= maxAttempts) {
+      const zoneOk = Boolean((_e = (_d = (_c = getState()) == null ? void 0 : _c.indexes) == null ? void 0 : _d.zones) == null ? void 0 : _e[operation.zone]);
+      console.error(
+        "Puck AI: could not find inserted item after add.",
+        zoneOk ? "State may not have synced yet." : `Target zone may be invalid or not yet in the tree: ${operation.zone}`,
+        operation
+      );
+      return;
+    }
+    const delay = attempt === 0 ? 0 : attempt === 1 ? 0 : attempt === 2 ? 10 : attempt === 3 ? 50 : attempt === 4 ? 100 : 200;
+    setTimeout(() => tryApply(attempt + 1), delay);
+  };
+  queueMicrotask(() => tryApply(0));
+};
+var dispatchOp = (operation, {
+  getState,
+  dispatchAction,
+  config
+}) => {
+  var _a, _b, _c, _d, _e, _f, _g;
+  const state = getState();
+  try {
+    if (operation.op === "add") {
+      if (operation.zone) {
+        dispatchAction({
+          type: "insert",
+          destinationIndex: operation.index,
+          destinationZone: operation.zone,
+          componentType: operation.type,
+          id: operation.id,
+          recordHistory: false
+        });
+        scheduleReplacePropsAfterAddInsert(operation, {
+          getState,
+          dispatchAction,
+          config
+        });
+      }
+    } else if (operation.op === "update") {
+      const selector = getSelectorForId(state, operation.id);
+      const existing = getItemById(state, operation.id);
+      if (!selector || !existing) {
+        throw new Error(
+          `Tried to update an item that doesn't exist: ${operation.id}`
+        );
+      }
+      const newData = __spreadProps(__spreadValues({}, existing), {
+        props: applyArrayDefaults(
+          existing.props,
+          operation.props,
+          (_b = (_a = config.components[existing.type]) == null ? void 0 : _a.fields) != null ? _b : {}
+        )
+      });
+      dispatchAction({
+        type: "replace",
+        destinationIndex: selector.index,
+        destinationZone: selector.zone,
+        data: newData,
+        recordHistory: false
+      });
+    } else if (operation.op === "updateRoot") {
+      const existing = (_c = state == null ? void 0 : state.data) == null ? void 0 : _c.root;
+      const defaultProps = (_e = (_d = config.root) == null ? void 0 : _d.defaultProps) != null ? _e : {};
+      dispatchAction({
+        type: "replaceRoot",
+        root: __spreadProps(__spreadValues({}, existing), {
+          props: __spreadValues(__spreadValues(__spreadValues({}, defaultProps), existing == null ? void 0 : existing.props), operation.props)
+        }),
+        recordHistory: false
+      });
+    } else if (operation.op === "delete") {
+      const selector = getSelectorForId(state, operation.id);
+      if (!selector) {
+        throw new Error(
+          `Tried to delete an item that doesn't exist: ${operation.id}`
+        );
+      }
+      dispatchAction({
+        type: "remove",
+        zone: selector.zone,
+        index: selector.index,
+        recordHistory: false
+      });
+    } else if (operation.op === "duplicate") {
+      const selector = getSelectorForId(state, operation.id);
+      if (!selector) {
+        throw new Error(
+          `Tried to duplicate an item that doesn't exist: ${operation.id}`
+        );
+      }
+      dispatchAction({
+        type: "duplicate",
+        sourceZone: selector.zone,
+        sourceIndex: selector.index,
+        recordHistory: false
+      });
+    } else if (operation.op === "move") {
+      const selector = getSelectorForId(state, operation.id);
+      if (!selector) {
+        throw new Error(
+          `Tried to move an item that doesn't exist: ${operation.id}`
+        );
+      }
+      dispatchAction({
+        type: "move",
+        sourceZone: selector.zone,
+        sourceIndex: selector.index,
+        destinationIndex: operation.index,
+        destinationZone: operation.zone,
+        recordHistory: false
+      });
+    } else if (operation.op === "reset") {
+      const defaultRootProps = (_g = (_f = config.root) == null ? void 0 : _f.defaultProps) != null ? _g : {};
+      dispatchAction({
+        type: "setData",
+        data: { content: [], root: defaultRootProps },
+        recordHistory: false
+      });
+    } else {
+      throw new Error(`Unknown operation: ${operation.op}`);
+    }
+  } catch (e) {
+    console.error("Error applying operation, skipping...", operation, e);
+  }
+};
+var toolStatusContext = createContext({});
+var ToolStatusProvider = toolStatusContext.Provider;
+function Loader({ size = 16 }) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: "puck-ai-loader",
+      style: { width: size, height: size },
+      "aria-label": "loading"
+    }
+  );
+}
+function ToolStatusDisplay({ status }) {
+  return /* @__PURE__ */ jsx("div", { className: "puck-ai-chat-message-data", children: /* @__PURE__ */ jsxs("div", { className: "puck-ai-chat-message-data-inner", children: [
+    /* @__PURE__ */ jsx("div", { className: "puck-ai-chat-message-data-icon", children: status.error ? /* @__PURE__ */ jsx(TriangleAlert, { size: 18 }) : status.loading ? /* @__PURE__ */ jsx(Loader, { size: 16 }) : /* @__PURE__ */ jsx(Check, { size: 18 }) }),
+    /* @__PURE__ */ jsx("div", { children: status.label })
+  ] }) });
+}
+function PuckTool({
+  toolCallId,
+  output,
+  status: mergedStatus,
+  defaultLabel = "Thinking..."
+}) {
+  const toolStatusMap = useContext(toolStatusContext);
+  const contextStatus = toolStatusMap[toolCallId];
+  const outputObj = output;
+  const status = mergedStatus != null ? mergedStatus : outputObj && "status" in outputObj ? outputObj.status : contextStatus != null ? contextStatus : { loading: true, label: defaultLabel };
+  return /* @__PURE__ */ jsx(ToolStatusDisplay, { status });
+}
+function safeJsonPreview(value, maxLen = 4e3) {
+  try {
+    const s = JSON.stringify(value, null, 2);
+    if (s.length <= maxLen) return s;
+    return `${s.slice(0, maxLen)}
+\u2026`;
+  } catch (e) {
+    return String(value);
+  }
+}
+function FileMessagePart({
+  part,
+  role
+}) {
+  var _a, _b;
+  const isImage = part.mediaType.startsWith("image/");
+  if (isImage) {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: `puck-ai-chat-message-file${role === "user" ? " puck-ai-chat-message-file--user" : ""}`,
+        children: [
+          /* @__PURE__ */ jsx(
+            "img",
+            {
+              src: part.url,
+              alt: (_a = part.filename) != null ? _a : "Attached image",
+              className: "puck-ai-chat-message-file-image"
+            }
+          ),
+          part.filename ? /* @__PURE__ */ jsx("span", { className: "puck-ai-chat-message-file-caption", children: part.filename }) : null
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx("div", { className: "puck-ai-chat-message-file puck-ai-chat-message-file--document", children: /* @__PURE__ */ jsx(
+    "a",
+    {
+      href: part.url,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      download: part.filename,
+      children: (_b = part.filename) != null ? _b : part.mediaType
+    }
+  ) });
+}
+function ReasoningMessagePart({
+  part
+}) {
+  const streaming = part.state === "streaming";
+  return /* @__PURE__ */ jsxs("details", { className: "puck-ai-chat-message-reasoning", open: streaming, children: [
+    /* @__PURE__ */ jsxs("summary", { className: "puck-ai-chat-message-reasoning-summary", children: [
+      "Reasoning",
+      streaming ? /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: "puck-ai-chat-message-reasoning-streaming",
+          "aria-live": "polite",
+          children: /* @__PURE__ */ jsx(Loader, { size: 12 })
+        }
+      ) : null
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "puck-ai-chat-message-reasoning-body", children: /* @__PURE__ */ jsx(ReactMarkdown, { children: part.text }) })
+  ] });
+}
+function SdkToolInvocation({ part }) {
+  const name = getToolName(part);
+  const state = part.state;
+  let stateLabel;
+  if (state === "input-streaming") stateLabel = "Preparing\u2026";
+  else if (state === "input-available") stateLabel = "Running\u2026";
+  else if (state === "output-available") stateLabel = "Done";
+  else if (state === "output-error") stateLabel = "Error";
+  else if (state === "approval-requested") stateLabel = "Awaiting approval";
+  else if (state === "approval-responded") stateLabel = "Approval recorded";
+  else if (state === "output-denied") stateLabel = "Denied";
+  else stateLabel = state;
+  const loading = state === "input-streaming" || state === "input-available" || state === "approval-requested";
+  const input = "input" in part ? part.input : void 0;
+  const output = "output" in part ? part.output : void 0;
+  const errorText = "errorText" in part ? part.errorText : void 0;
+  return /* @__PURE__ */ jsxs("div", { className: "puck-ai-chat-message-tool", children: [
+    /* @__PURE__ */ jsxs("div", { className: "puck-ai-chat-message-tool-header", children: [
+      /* @__PURE__ */ jsx("span", { className: "puck-ai-chat-message-tool-icon", "aria-hidden": true, children: /* @__PURE__ */ jsx(Wrench, { size: 14 }) }),
+      /* @__PURE__ */ jsx("span", { className: "puck-ai-chat-message-tool-name", children: name }),
+      /* @__PURE__ */ jsxs("span", { className: "puck-ai-chat-message-tool-state", children: [
+        loading ? /* @__PURE__ */ jsx(Loader, { size: 12 }) : null,
+        stateLabel
+      ] })
+    ] }),
+    state === "output-error" && errorText ? /* @__PURE__ */ jsx("div", { className: "puck-ai-chat-message-tool-error", children: errorText }) : null,
+    /* @__PURE__ */ jsxs("details", { className: "puck-ai-chat-message-tool-details", children: [
+      /* @__PURE__ */ jsx("summary", { children: "Input / output" }),
+      input !== void 0 ? /* @__PURE__ */ jsx("pre", { className: "puck-ai-chat-message-tool-pre", children: safeJsonPreview(input) }) : null,
+      state === "output-available" && output !== void 0 ? /* @__PURE__ */ jsx("pre", { className: "puck-ai-chat-message-tool-pre", children: safeJsonPreview(output) }) : null
+    ] })
+  ] });
+}
+function DataMessagePart({ part }) {
+  var _a, _b, _c, _d;
+  if (part.type === "data-puck-actions") {
+    const actions = part.data;
+    return /* @__PURE__ */ jsxs("div", { className: "puck-ai-chat-message-data-summary", children: [
+      "Applied ",
+      actions.length,
+      " editor action",
+      actions.length === 1 ? "" : "s"
+    ] });
+  }
+  if (part.type === "data-build-op") {
+    const op = part.data;
+    return /* @__PURE__ */ jsxs("div", { className: "puck-ai-chat-message-data-summary", children: [
+      "Build operation: ",
+      /* @__PURE__ */ jsx("code", { children: op.op })
+    ] });
+  }
+  if (part.type === "data-finish") {
+    const d = part.data;
+    return /* @__PURE__ */ jsxs("div", { className: "puck-ai-chat-message-data-summary", children: [
+      "Tokens: in ",
+      (_b = (_a = d.tokenUsage) == null ? void 0 : _a.inputTokens) != null ? _b : "\u2014",
+      " \xB7 out",
+      " ",
+      (_d = (_c = d.tokenUsage) == null ? void 0 : _c.outputTokens) != null ? _d : "\u2014",
+      d.totalCost !== void 0 ? ` \xB7 cost ${d.totalCost}` : ""
+    ] });
+  }
+  if (part.type === "data-page") {
+    return /* @__PURE__ */ jsx("div", { className: "puck-ai-chat-message-data-summary", children: "Page snapshot attached" });
+  }
+  if (part.type === "data-new-chat-created" || part.type === "data-tool-status" || part.type === "data-send-screenshot") {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs("details", { className: "puck-ai-chat-message-data-raw", children: [
+    /* @__PURE__ */ jsx("summary", { children: part.type.replace(/^data-/, "") }),
+    /* @__PURE__ */ jsx("pre", { className: "puck-ai-chat-message-tool-pre", children: safeJsonPreview(part.data) })
+  ] });
+}
+function ChatMessagePart({ part, role }) {
+  var _a;
+  if (isTextUIPart(part)) {
+    return /* @__PURE__ */ jsx("div", { className: "puck-ai-chat-message-text", children: role === "assistant" || role === "user" ? /* @__PURE__ */ jsx(ReactMarkdown, { children: part.text }) : /* @__PURE__ */ jsx("span", { children: part.text }) });
+  }
+  if (isReasoningUIPart(part)) {
+    return /* @__PURE__ */ jsx(ReasoningMessagePart, { part });
+  }
+  if (isFileUIPart(part)) {
+    return /* @__PURE__ */ jsx(FileMessagePart, { part, role });
+  }
+  if (part.type === "source-url") {
+    return /* @__PURE__ */ jsx("div", { className: "puck-ai-chat-message-source", children: /* @__PURE__ */ jsx("a", { href: part.url, target: "_blank", rel: "noopener noreferrer", children: (_a = part.title) != null ? _a : part.url }) });
+  }
+  if (part.type === "source-document") {
+    return /* @__PURE__ */ jsxs("div", { className: "puck-ai-chat-message-source", children: [
+      /* @__PURE__ */ jsx("span", { title: part.filename, children: part.title }),
+      /* @__PURE__ */ jsx("span", { className: "puck-ai-chat-message-source-meta", children: part.mediaType })
+    ] });
+  }
+  if (part.type === "step-start") {
+    return /* @__PURE__ */ jsx("div", { className: "puck-ai-chat-message-step", "aria-hidden": true });
+  }
+  if (isToolUIPart(part)) {
+    if (part.type === "tool-createPage" || part.type === "tool-updatePage" || part.type === "tool-userTool") {
+      return /* @__PURE__ */ jsx(PuckTool, __spreadValues({}, part));
+    }
+    return /* @__PURE__ */ jsx(SdkToolInvocation, { part });
+  }
+  if (isDataUIPart(part)) {
+    return /* @__PURE__ */ jsx(DataMessagePart, { part });
+  }
+  return null;
+}
+function ChatMessage({ message }) {
+  const { role, parts } = message;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: `puck-ai-chat-message${role === "user" ? " puck-ai-chat-message--user-role" : ""}`,
+      "data-message-id": message.id,
+      children: parts.map((part, i) => /* @__PURE__ */ jsx(
+        ChatMessagePart,
+        {
+          part,
+          role
+        },
+        `${message.id}-${part.type}-${i}`
+      ))
+    }
+  );
+}
+function ExamplePrompt({
+  label,
+  href,
+  onClick
+}) {
+  const El = href ? "a" : "button";
+  return /* @__PURE__ */ jsxs(
+    El,
+    {
+      className: "puck-ai-chatbody-example-prompt",
+      href,
+      onClick,
+      children: [
+        /* @__PURE__ */ jsx("div", { children: label }),
+        /* @__PURE__ */ jsx("div", { className: "puck-ai-chatbody-example-prompt-arrow", children: /* @__PURE__ */ jsx(ArrowUp, { size: 16 }) })
+      ]
+    }
+  );
+}
+function PromptForm({
+  handleSubmit,
+  inputRef,
+  isLoading,
+  glow,
+  placeholder = "What do you want to build?",
+  minRows = 2,
+  maxRows = 5,
+  value = "",
+  images = [],
+  onImagesChange
+}) {
+  const [prompt, setPrompt] = useState(value);
+  const [isDragOver, setIsDragOver] = useState(false);
+  const hasSetInitialPrompt = useRef(false);
+  const internalRef = useRef(null);
+  const fileInputRef = useRef(null);
+  useEffect(() => {
+    setPrompt(value);
+  }, [value]);
+  useEffect(() => {
+    const currentUrl = new URL(location.href);
+    const initialPrompt = currentUrl.searchParams.get("initialPrompt");
+    if (!hasSetInitialPrompt.current && initialPrompt && prompt === "") {
+      hasSetInitialPrompt.current = true;
+      setPrompt(initialPrompt);
+    }
+  }, []);
+  const addImages = useCallback(
+    (files) => __async(null, null, function* () {
+      const newImgs = yield filesToAttachedImages(files);
+      if (newImgs.length > 0) {
+        onImagesChange == null ? void 0 : onImagesChange([...images, ...newImgs]);
+      }
+    }),
+    [images, onImagesChange]
+  );
+  const removeImage = useCallback(
+    (id) => {
+      onImagesChange == null ? void 0 : onImagesChange(images.filter((img) => img.id !== id));
+    },
+    [images, onImagesChange]
+  );
+  const sendPrompt = () => {
+    if (isLoading) return;
+    if (prompt.trim() || images.length > 0) {
+      handleSubmit(prompt);
+    }
+    setPrompt("");
+  };
+  const handleDragOver = (e) => {
+    e.preventDefault();
+    if (e.dataTransfer.types.some((t) => t === "Files")) {
+      setIsDragOver(true);
+    }
+  };
+  const handleDragLeave = (e) => {
+    if (!e.currentTarget.contains(e.relatedTarget)) {
+      setIsDragOver(false);
+    }
+  };
+  const handleDrop = (e) => __async(null, null, function* () {
+    e.preventDefault();
+    setIsDragOver(false);
+    if (e.dataTransfer.files.length > 0) {
+      yield addImages(e.dataTransfer.files);
+    }
+  });
+  const handlePaste = (e) => __async(null, null, function* () {
+    const items = Array.from(e.clipboardData.items);
+    const imageFiles = items.filter((item) => item.kind === "file" && item.type.startsWith("image/")).map((item) => item.getAsFile()).filter((file) => file !== null);
+    if (imageFiles.length > 0) {
+      yield addImages(imageFiles);
+    }
+  });
+  const classNames = [
+    "puck-ai-prompt-form",
+    glow ? "puck-ai-prompt-form--glow" : "",
+    isLoading ? "puck-ai-prompt-form--is-loading" : "",
+    isDragOver ? "puck-ai-prompt-form--drag-over" : ""
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: classNames,
+      onDragOver: handleDragOver,
+      onDragEnter: handleDragOver,
+      onDragLeave: handleDragLeave,
+      onDrop: handleDrop,
+      children: /* @__PURE__ */ jsxs("div", { className: "puck-ai-prompt-form-inner", children: [
+        /* @__PURE__ */ jsx("span", { className: "puck-ai-prompt-form-glow" }),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            ref: fileInputRef,
+            type: "file",
+            accept: "image/*",
+            multiple: true,
+            style: { display: "none" },
+            onChange: (e) => __async(null, null, function* () {
+              if (e.target.files) {
+                yield addImages(e.target.files);
+                e.target.value = "";
+              }
+            })
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "form",
+          {
+            onSubmit: (e) => {
+              e.preventDefault();
+              sendPrompt();
+            },
+            children: [
+              images.length > 0 && /* @__PURE__ */ jsx("div", { className: "puck-ai-image-thumbnails", children: images.map((img) => /* @__PURE__ */ jsxs("div", { className: "puck-ai-image-thumbnail", children: [
+                /* @__PURE__ */ jsx("img", { src: img.dataUrl, alt: img.name }),
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    className: "puck-ai-image-thumbnail-remove",
+                    onClick: () => removeImage(img.id),
+                    title: "Remove image",
+                    children: /* @__PURE__ */ jsx(X, { size: 10 })
+                  }
+                )
+              ] }, img.id)) }),
+              /* @__PURE__ */ jsxs("div", { className: "puck-ai-prompt-form-form-inner", children: [
+                /* @__PURE__ */ jsx(
+                  TextareaAutosize,
+                  {
+                    className: "puck-ai-prompt-form-input",
+                    name: "prompt",
+                    minRows,
+                    maxRows,
+                    placeholder: isDragOver ? "Drop images here\u2026" : placeholder,
+                    disabled: isLoading,
+                    value: prompt,
+                    ref: (node) => {
+                      if (inputRef) {
+                        inputRef.current = node;
+                      }
+                      internalRef.current = node;
+                    },
+                    onChange: (e) => setPrompt(e.target.value),
+                    onPaste: handlePaste,
+                    onKeyDown: (e) => {
+                      if (!e.shiftKey && e.key === "Enter") {
+                        e.preventDefault();
+                      }
+                    },
+                    onKeyUp: (e) => {
+                      if (!e.shiftKey && e.key === "Enter") {
+                        e.preventDefault();
+                        sendPrompt();
+                      }
+                    }
+                  }
+                ),
+                /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    className: "puck-ai-prompt-form-actions",
+                    onClick: () => {
+                      var _a;
+                      return (_a = internalRef.current) == null ? void 0 : _a.focus();
+                    },
+                    children: [
+                      /* @__PURE__ */ jsx(
+                        "div",
+                        {
+                          className: "puck-ai-prompt-form-actions-left",
+                          onClick: (e) => e.stopPropagation(),
+                          children: /* @__PURE__ */ jsx(
+                            "button",
+                            {
+                              type: "button",
+                              className: "puck-ai-image-attach-btn",
+                              title: "Attach image",
+                              onClick: () => {
+                                var _a;
+                                return (_a = fileInputRef.current) == null ? void 0 : _a.click();
+                              },
+                              disabled: isLoading,
+                              children: /* @__PURE__ */ jsx(Image, { size: 15 })
+                            }
+                          )
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        "div",
+                        {
+                          className: "puck-ai-prompt-form-actions-right",
+                          onClick: (e) => e.stopPropagation(),
+                          children: /* @__PURE__ */ jsx(
+                            "button",
+                            {
+                              className: "puck-ai-prompt-form-action-submit",
+                              type: "submit",
+                              disabled: isLoading,
+                              children: /* @__PURE__ */ jsx(ArrowUp, { size: 24 })
+                            }
+                          )
+                        }
+                      )
+                    ]
+                  }
+                )
+              ] })
+            ]
+          }
+        )
+      ] })
+    }
+  );
+}
+function ChatBody({
+  children,
+  examplePrompts,
+  handleSubmit,
+  hideInput,
+  inputRef,
+  messages = [],
+  status,
+  error,
+  handleRetry,
+  promptValue,
+  targetComponent,
+  onClearTarget,
+  images,
+  onImagesChange
+}) {
+  const { scrollRef, contentRef } = useStickToBottom();
+  const hasMessages = messages && messages.length > 0;
+  const classNames = [
+    "puck-ai-chatbody",
+    hasMessages ? "puck-ai-chatbody--has-messages" : "",
+    children ? "puck-ai-chatbody--has-children" : "",
+    hideInput ? "puck-ai-chatbody--hide-input" : ""
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs("div", { className: classNames, children: [
+    children ? /* @__PURE__ */ jsx("div", { className: "puck-ai-chatbody-default", children }) : null,
+    /* @__PURE__ */ jsxs("div", { className: "puck-ai-chatbody-inner", ref: scrollRef, children: [
+      /* @__PURE__ */ jsx("div", { className: "puck-ai-chatbody-messages", ref: contentRef, children: [...messages].reverse().map((message) => /* @__PURE__ */ jsx(ChatMessage, { message }, message.id)) }),
+      status === "submitted" && /* @__PURE__ */ jsx("div", { className: "puck-ai-chatbody-loader", children: /* @__PURE__ */ jsx(Loader, { size: 14 }) }),
+      error && /* @__PURE__ */ jsxs("div", { className: "puck-ai-chatbody-error", children: [
+        /* @__PURE__ */ jsx("div", { className: "puck-ai-chatbody-error-label", children: "Something went wrong." }),
+        handleRetry && /* @__PURE__ */ jsx("div", { className: "puck-ai-chatbody-error-action", children: /* @__PURE__ */ jsx(
+          "button",
+          {
+            className: "puck-ai-icon-button",
+            title: "Retry",
+            onClick: handleRetry,
+            children: /* @__PURE__ */ jsx(RotateCcw, { size: 14 })
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "puck-ai-chatbody-form", children: [
+        targetComponent && /* @__PURE__ */ jsxs("div", { className: "puck-ai-target-banner", children: [
+          /* @__PURE__ */ jsx("span", { className: "puck-ai-target-banner-label", children: "Targeting:" }),
+          /* @__PURE__ */ jsx("span", { className: "puck-ai-target-banner-name", children: targetComponent.label || targetComponent.type }),
+          /* @__PURE__ */ jsx("code", { className: "puck-ai-target-banner-id", children: targetComponent.id }),
+          onClearTarget && /* @__PURE__ */ jsx(
+            "button",
+            {
+              className: "puck-ai-target-banner-clear",
+              onClick: onClearTarget,
+              title: "Clear target",
+              type: "button",
+              children: "\xD7"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx(
+          PromptForm,
+          {
+            glow: !hasMessages && !targetComponent,
+            handleSubmit,
+            inputRef,
+            isLoading: status === "submitted" || status === "streaming",
+            placeholder: targetComponent ? `What should I do with the ${targetComponent.label || targetComponent.type}?` : "What do you want to build?",
+            value: promptValue,
+            images,
+            onImagesChange
+          }
+        ),
+        examplePrompts ? /* @__PURE__ */ jsx("div", { className: "puck-ai-chatbody-example-prompts", children: examplePrompts }) : null
+      ] })
+    ] })
+  ] });
+}
+function isScrolledIntoView(el) {
+  const rect = el.getBoundingClientRect();
+  return rect.top >= 0 && rect.bottom <= window.innerHeight;
+}
+function Placeholder({
+  dispatch,
+  inputRef,
+  pluginRef
+}) {
+  const handleEnterPromptClick = () => {
+    var _a;
+    (_a = inputRef.current) == null ? void 0 : _a.focus({ preventScroll: true });
+    setTimeout(() => {
+      if (pluginRef.current && inputRef.current && !isScrolledIntoView(inputRef.current)) {
+        const box = pluginRef.current.getBoundingClientRect();
+        const top = box.top - (window.innerHeight - box.height) / 2;
+        window.scrollTo({ behavior: "smooth", top });
+      }
+    }, 10);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "puck-ai-chat-placeholder", children: [
+    /* @__PURE__ */ jsx(Bot, { size: 24 }),
+    /* @__PURE__ */ jsx("div", { children: "Use AI to build a page using the available blocks" }),
+    /* @__PURE__ */ jsxs("div", { className: "puck-ai-chat-actions", children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: "puck-ai-chat-action",
+          onClick: handleEnterPromptClick,
+          children: "Enter prompt"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: "puck-ai-chat-action-outlined",
+          onClick: () => {
+            dispatch({ type: "setUi", ui: { plugin: { current: "blocks" } } });
+          },
+          children: "Build manually"
+        }
+      )
+    ] })
+  ] });
+}
+function scrollIntoViewLocal(el, win, behavior = "smooth") {
+  var _a, _b;
+  const scroller = ((_a = el.ownerDocument) == null ? void 0 : _a.scrollingElement) || ((_b = el.ownerDocument) == null ? void 0 : _b.documentElement);
+  const rect = el.getBoundingClientRect();
+  const vpH = win.innerHeight;
+  const current = scroller.scrollTop;
+  const offset = win.innerHeight / 2;
+  let targetTop = current;
+  if (rect.top < 0) {
+    targetTop = current + rect.top;
+  } else if (rect.bottom > vpH) {
+    targetTop = current + (rect.bottom - vpH);
+  }
+  if (targetTop !== current) {
+    scroller.scrollTo({ top: targetTop + offset, behavior });
+  }
+}
+function useFrameMutationObserver(callback) {
+  return useCallback(() => {
+    var _a;
+    const frame = document == null ? void 0 : document.getElementById(
+      "preview-frame"
+    );
+    if (!frame) return;
+    let observer = null;
+    const win = frame.contentWindow;
+    let enabled = true;
+    const disable = () => {
+      enabled = false;
+    };
+    const attachObserver = () => {
+      const win2 = frame.contentWindow;
+      const doc = frame.contentDocument || (win2 == null ? void 0 : win2.document);
+      if (!win2 || !doc) return;
+      const target = doc.querySelector("#frame-root > div");
+      if (!target) return;
+      observer = new MutationObserver((entries) => {
+        if (enabled) callback(entries, win2);
+      });
+      observer.observe(target, { childList: true, subtree: true });
+      win2.addEventListener("pointerdown", disable);
+      win2.addEventListener("wheel", disable);
+    };
+    if (((_a = frame.contentDocument) == null ? void 0 : _a.readyState) === "complete") {
+      attachObserver();
+    } else {
+      frame.addEventListener("load", attachObserver, { once: true });
+    }
+    return () => {
+      frame.removeEventListener("load", attachObserver);
+      win == null ? void 0 : win.removeEventListener("pointerdown", disable);
+      win == null ? void 0 : win.removeEventListener("wheel", disable);
+      observer == null ? void 0 : observer.disconnect();
+    };
+  }, [callback]);
+}
+function ScrollTracking({ children }) {
+  const followedRefs = useRef([]);
+  const follow = useFrameMutationObserver((records, win) => {
+    if (records.length > 0) {
+      const lastRecord = records[records.length - 1];
+      if (followedRefs.current.includes(lastRecord.target)) return;
+      followedRefs.current.push(lastRecord.target);
+      requestAnimationFrame(() => {
+        const el = lastRecord.target;
+        scrollIntoViewLocal(el, win);
+      });
+    }
+  });
+  useEffect(() => {
+    const cleanup = follow();
+    return cleanup;
+  }, [follow]);
+  return /* @__PURE__ */ jsx(Fragment, { children });
+}
+function Toggle({
+  checked,
+  onChange,
+  id,
+  disabled
+}) {
+  return /* @__PURE__ */ jsxs(
+    "label",
+    {
+      className: `puck-ai-toggle${disabled ? " puck-ai-toggle--disabled" : ""}`,
+      htmlFor: id,
+      children: [
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "checkbox",
+            id,
+            checked,
+            disabled,
+            onChange: (e) => onChange(e.target.checked),
+            className: "puck-ai-toggle-input"
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: "puck-ai-toggle-slider" })
+      ]
+    }
+  );
+}
+function SettingsPanel({
+  settings,
+  onChange,
+  onClearChatHistory,
+  hasChatMessages
+}) {
+  const [showToken, setShowToken] = useState(false);
+  return /* @__PURE__ */ jsx("div", { className: "puck-ai-settings-scroll", children: /* @__PURE__ */ jsxs("div", { className: "puck-ai-settings", children: [
+    /* @__PURE__ */ jsxs("div", { className: "puck-ai-settings-section", children: [
+      /* @__PURE__ */ jsx("div", { className: "puck-ai-settings-section-title", children: "Model settings" }),
+      /* @__PURE__ */ jsxs("div", { className: "puck-ai-settings-row", children: [
+        /* @__PURE__ */ jsxs(
+          "label",
+          {
+            className: "puck-ai-settings-label",
+            htmlFor: "puck-ai-thinking-level",
+            children: [
+              "Thinking level",
+              /* @__PURE__ */ jsx("span", { className: "puck-ai-settings-hint", children: "Extended reasoning budget" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "select",
+          {
+            id: "puck-ai-thinking-level",
+            className: "puck-ai-settings-select",
+            value: settings.thinkingLevel,
+            onChange: (e) => onChange({ thinkingLevel: e.target.value }),
+            children: [
+              /* @__PURE__ */ jsx("option", { value: "none", children: "Off" }),
+              /* @__PURE__ */ jsx("option", { value: "low", children: "Low" }),
+              /* @__PURE__ */ jsx("option", { value: "medium", children: "Medium" }),
+              /* @__PURE__ */ jsx("option", { value: "high", children: "High" })
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "puck-ai-settings-row", children: [
+        /* @__PURE__ */ jsxs(
+          "label",
+          {
+            className: "puck-ai-settings-label",
+            htmlFor: "puck-ai-url-context",
+            children: [
+              "URL context",
+              /* @__PURE__ */ jsx("span", { className: "puck-ai-settings-hint", children: "Fetch linked URLs during generation" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Toggle,
+          {
+            id: "puck-ai-url-context",
+            checked: settings.urlContext,
+            onChange: (v) => onChange({ urlContext: v })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "puck-ai-settings-row", children: [
+        /* @__PURE__ */ jsxs(
+          "label",
+          {
+            className: "puck-ai-settings-label",
+            htmlFor: "puck-ai-browser-capture",
+            children: [
+              "Browser capture",
+              /* @__PURE__ */ jsx("span", { className: "puck-ai-settings-hint", children: "Run server-side browser migration (screenshot + DOM bundle) when a migration URL is in the prompt. Turn off to use URL context only without Worker/Puppeteer." })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Toggle,
+          {
+            id: "puck-ai-browser-capture",
+            checked: settings.browserCapture,
+            onChange: (v) => onChange(__spreadValues({
+              browserCapture: v
+            }, v ? {} : { pageMigrationIr: false }))
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "puck-ai-settings-row", children: [
+        /* @__PURE__ */ jsxs(
+          "label",
+          {
+            className: "puck-ai-settings-label",
+            htmlFor: "puck-ai-page-migration-ir",
+            children: [
+              "Page migration IR",
+              /* @__PURE__ */ jsx("span", { className: "puck-ai-settings-hint", children: "Full DOM bundle + structured plan when a source URL is captured (slower; screenshot-only when off). Requires Browser capture." })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Toggle,
+          {
+            id: "puck-ai-page-migration-ir",
+            disabled: !settings.browserCapture,
+            checked: settings.pageMigrationIr,
+            onChange: (v) => onChange({ pageMigrationIr: v })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "puck-ai-settings-row", children: [
+        /* @__PURE__ */ jsxs(
+          "label",
+          {
+            className: "puck-ai-settings-label",
+            htmlFor: "puck-ai-google-search",
+            children: [
+              "Google Search",
+              /* @__PURE__ */ jsx("span", { className: "puck-ai-settings-hint", children: "Ground responses with live search" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Toggle,
+          {
+            id: "puck-ai-google-search",
+            checked: settings.googleSearch,
+            onChange: (v) => onChange({ googleSearch: v })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "puck-ai-settings-row", children: [
+        /* @__PURE__ */ jsxs(
+          "label",
+          {
+            className: "puck-ai-settings-label",
+            htmlFor: "puck-ai-enterprise-search",
+            children: [
+              "Enterprise web search",
+              /* @__PURE__ */ jsx("span", { className: "puck-ai-settings-hint", children: "Advanced grounding via Vertex AI" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Toggle,
+          {
+            id: "puck-ai-enterprise-search",
+            checked: settings.enterpriseWebSearch,
+            onChange: (v) => onChange({ enterpriseWebSearch: v })
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "puck-ai-settings-section", children: [
+      /* @__PURE__ */ jsx("div", { className: "puck-ai-settings-section-title", children: "Figma integration" }),
+      /* @__PURE__ */ jsxs("div", { className: "puck-ai-settings-row puck-ai-settings-row--column", children: [
+        /* @__PURE__ */ jsx(
+          "label",
+          {
+            className: "puck-ai-settings-label",
+            htmlFor: "puck-ai-figma-token",
+            children: "Personal access token"
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "puck-ai-settings-input-wrap", children: [
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              id: "puck-ai-figma-token",
+              type: showToken ? "text" : "password",
+              className: "puck-ai-settings-input",
+              placeholder: "figd_xxxxxxxxxxxx",
+              value: settings.figmaToken,
+              onChange: (e) => onChange({ figmaToken: e.target.value }),
+              autoComplete: "off",
+              spellCheck: false
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              className: "puck-ai-settings-input-action",
+              onClick: () => setShowToken((v) => !v),
+              title: showToken ? "Hide token" : "Show token",
+              children: showToken ? /* @__PURE__ */ jsx(EyeOff, { size: 14 }) : /* @__PURE__ */ jsx(Eye, { size: 14 })
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx(
+          "a",
+          {
+            href: "https://www.figma.com/settings",
+            target: "_blank",
+            rel: "noopener noreferrer",
+            className: "puck-ai-settings-link",
+            children: "Get your Figma access token \u2192"
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: "puck-ai-settings-hint", style: { marginTop: 4 }, children: "Paste a Figma URL in chat to generate from your design. Token overrides server config." })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "puck-ai-settings-section", children: [
+      /* @__PURE__ */ jsx("div", { className: "puck-ai-settings-section-title", children: "Chat" }),
+      /* @__PURE__ */ jsxs("div", { className: "puck-ai-settings-row puck-ai-settings-row--column", children: [
+        /* @__PURE__ */ jsxs(
+          "label",
+          {
+            className: "puck-ai-settings-label",
+            htmlFor: "puck-ai-clear-chat",
+            children: [
+              "Clear chat history",
+              /* @__PURE__ */ jsx("span", { className: "puck-ai-settings-hint", children: "Remove all messages and reset the conversation context for this session." })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            id: "puck-ai-clear-chat",
+            type: "button",
+            className: "puck-ai-settings-clear-chat",
+            disabled: !hasChatMessages,
+            onClick: onClearChatHistory,
+            children: [
+              /* @__PURE__ */ jsx(Trash2, { size: 14, "aria-hidden": true }),
+              "Clear messages"
+            ]
+          }
+        )
+      ] })
+    ] })
+  ] }) });
+}
+var usePuck = createUsePuck();
+function Chat({
+  chat,
+  host = "/api/puck/chat",
+  prepareRequest,
+  settings
+}) {
+  const { examplePrompts } = chat != null ? chat : {};
+  const puckDispatch = usePuck((s) => s.dispatch);
+  const getPuck = useGetPuck();
+  const localChatId = useRef("");
+  const inputRef = useRef(null);
+  const pluginRef = useRef(null);
+  const [error, setError] = useState();
+  const [toolStatus, setToolStatus] = useState({});
+  const [showSettings, setShowSettings] = useState(false);
+  const [aiSettings, setAiSettings] = useAiSettings(settings == null ? void 0 : settings.storageKey);
+  const aiSettingsRef = useRef(aiSettings);
+  useEffect(() => {
+    aiSettingsRef.current = aiSettings;
+  }, [aiSettings]);
+  const uploadScreenshot = useCallback(
+    (width, bucketUrl) => __async(null, null, function* () {
+      var _a, _b, _c;
+      const iframeDocument = (_c = (_b = (_a = document == null ? void 0 : document.getElementById("preview-frame")) == null ? void 0 : _a.contentDocument) == null ? void 0 : _b.documentElement) != null ? _c : null;
+      if (!iframeDocument) return;
+      const canvas = yield html2canvas(iframeDocument, {
+        scale: 2,
+        backgroundColor: "#ffffff",
+        width,
+        windowWidth: width,
+        foreignObjectRendering: false,
+        imageTimeout: 3e4,
+        logging: false,
+        allowTaint: false,
+        useCORS: true,
+        scrollY: 0,
+        ignoreElements: (el) => Array.from(el.classList).some(
+          (c) => c.startsWith("_DraggableComponent--hover") || c.startsWith("_ActionBar")
+        )
+      });
+      const image = canvas.toDataURL("image/webp", 0.8);
+      const blob = yield (yield fetch(image)).blob();
+      yield fetch(bucketUrl, { method: "PUT", body: blob });
+    }),
+    []
+  );
+  const processData = useCallback(
+    (dataPart) => {
+      switch (dataPart.type) {
+        case "data-new-chat-created": {
+          localChatId.current = dataPart.data.chatId;
+          return;
+        }
+        case "data-puck-actions": {
+          dataPart.data.forEach((action) => {
+            try {
+              puckDispatch(action);
+            } catch (e) {
+              console.error("Bad action: ", action);
+              console.error(e);
+            }
+          });
+          return;
+        }
+        case "data-build-op": {
+          const data = dataPart.data;
+          q.queue(() => {
+            const puck = getPuck();
+            if (!puck) return;
+            dispatchOp(data, {
+              getState: () => {
+                var _a;
+                return (_a = puck.__private) == null ? void 0 : _a.appState;
+              },
+              dispatchAction: puck.dispatch,
+              config: puck.config
+            });
+          });
+          return;
+        }
+        case "data-tool-status": {
+          const { toolCallId, status: toolSt } = dataPart.data;
+          setToolStatus((s) => __spreadProps(__spreadValues({}, s), { [toolCallId]: toolSt }));
+          return;
+        }
+        case "data-send-screenshot": {
+          const { urls } = dataPart.data;
+          urls.forEach((obj) => {
+            const entries = Object.entries(obj);
+            if (entries.length === 0) return;
+            const [key, value] = entries[0];
+            const breakpoint = Number(key);
+            uploadScreenshot(breakpoint, value);
+          });
+          return;
+        }
+        default:
+          console.warn("dataPart without case:", dataPart);
+          return;
+      }
+    },
+    [getPuck, puckDispatch, uploadScreenshot]
+  );
+  const { messages, status, sendMessage, regenerate, setMessages } = useChat({
+    generateId: () => prefixedUlid("msg"),
+    messages: [],
+    transport: new DefaultChatTransport({
+      api: host,
+      prepareSendMessagesRequest: (opts) => __async(null, null, function* () {
+        var _a, _b, _c, _d;
+        const puck = getPuck();
+        const config = (_a = puck == null ? void 0 : puck.config) != null ? _a : { components: {} };
+        const appState = (_b = puck == null ? void 0 : puck.appState) != null ? _b : {
+          data: { root: { props: {} }, content: [], zones: {} }
+        };
+        const root = (_c = config.root) != null ? _c : {
+          fields: {
+            title: {
+              type: "text",
+              ai: { instructions: "The title for the page" }
+            }
+          }
+        };
+        const configWithRoot = __spreadProps(__spreadValues({}, config), { root });
+        const currentSettings = aiSettingsRef.current;
+        const geminiConfig = {};
+        if (currentSettings.thinkingLevel !== "none")
+          geminiConfig.thinkingLevel = currentSettings.thinkingLevel;
+        if (currentSettings.urlContext) geminiConfig.urlContext = true;
+        if (currentSettings.browserCapture) {
+          geminiConfig.browserCapture = true;
+          if (currentSettings.pageMigrationIr)
+            geminiConfig.pageMigrationIr = true;
+        }
+        if (currentSettings.googleSearch) geminiConfig.googleSearch = true;
+        if (currentSettings.enterpriseWebSearch)
+          geminiConfig.enterpriseWebSearch = true;
+        if (currentSettings.figmaToken)
+          geminiConfig.figmaToken = currentSettings.figmaToken;
+        const defaultBody = __spreadValues(__spreadValues(__spreadValues(__spreadProps(__spreadValues({}, opts.body), {
+          chatId: localChatId.current,
+          trigger: opts.trigger,
+          messages: opts.messages,
+          pageData: appState.data,
+          config: configWithRoot
+        }), Object.keys(geminiConfig).length > 0 ? { geminiConfig } : {}), targetComponentRef.current ? { selectedComponentId: targetComponentRef.current.id } : {}), pendingSendImagesRef.current.length > 0 ? (() => {
+          const imgs = pendingSendImagesRef.current;
+          pendingSendImagesRef.current = [];
+          return { images: imgs };
+        })() : {});
+        const defaultOptions = {
+          headers: opts.headers,
+          credentials: opts.credentials,
+          body: defaultBody
+        };
+        if (prepareRequest) {
+          const userOptions = yield prepareRequest(defaultOptions);
+          return {
+            headers: __spreadValues(__spreadValues({}, defaultOptions.headers), userOptions.headers),
+            credentials: (_d = userOptions.credentials) != null ? _d : defaultOptions.credentials,
+            body: __spreadValues(__spreadValues({}, defaultBody), userOptions.body)
+          };
+        }
+        return {
+          headers: defaultOptions.headers,
+          credentials: defaultOptions.credentials,
+          body: defaultBody
+        };
+      })
+    }),
+    onData: processData,
+    onError: (e) => {
+      console.error(e);
+      setError(e.message);
+    },
+    onFinish: () => {
+      const puck = getPuck();
+      if (puck == null ? void 0 : puck.appState) {
+        puckDispatch({
+          type: "set",
+          state: puck.appState,
+          recordHistory: true
+        });
+      }
+    }
+  });
+  const [forcedStatus, setForcedStatus] = useState();
+  const resolvedStatus = useMemo(
+    () => forcedStatus != null ? forcedStatus : status,
+    [status, forcedStatus]
+  );
+  const [promptValue, setPromptValue] = useState("");
+  const [attachedImages, setAttachedImages] = useState([]);
+  const pendingSendImagesRef = useRef([]);
+  const [targetComponent, setTargetComponent] = useState(null);
+  const targetComponentRef = useRef(null);
+  useEffect(() => {
+    targetComponentRef.current = targetComponent;
+  }, [targetComponent]);
+  useEffect(() => {
+    window.__PUCK_AI = {
+      processData,
+      setMessages,
+      setStatus: setForcedStatus,
+      sendMessage,
+      setPrompt: (value) => {
+        var _a;
+        setPromptValue(value);
+        (_a = inputRef.current) == null ? void 0 : _a.focus();
+      },
+      setTargetComponent: (target) => {
+        var _a;
+        setTargetComponent(target);
+        (_a = inputRef.current) == null ? void 0 : _a.focus();
+      }
+    };
+  }, [processData, setMessages, sendMessage]);
+  const handleSubmit = (prompt) => {
+    const text = prompt.trim();
+    if (chat == null ? void 0 : chat.onSubmit) {
+      chat.onSubmit(text);
+      return;
+    }
+    if (!text && attachedImages.length === 0) return;
+    setError("");
+    setPromptValue("");
+    pendingSendImagesRef.current = attachedImages.map((img) => img.dataUrl);
+    const fileParts = attachedImages.map(attachedImageToFileUIPart);
+    setAttachedImages([]);
+    const sendPayload = {};
+    if (text) sendPayload.text = text;
+    if (fileParts.length > 0) sendPayload.files = fileParts;
+    sendMessage(sendPayload).catch((e) => {
+      console.error(e);
+    });
+  };
+  const messagesWithStatuses = useMemo(() => {
+    return messages.map((msg) => __spreadProps(__spreadValues({}, msg), {
+      parts: msg.parts.map((part) => {
+        if ("toolCallId" in part) {
+          return __spreadProps(__spreadValues({}, part), { status: toolStatus[part.toolCallId] });
+        }
+        return part;
+      })
+    }));
+  }, [messages, toolStatus]);
+  const handleClearChatHistory = useCallback(() => {
+    if (!window.confirm("Clear all messages in this chat?")) return;
+    setMessages([]);
+    setToolStatus({});
+    setError(void 0);
+    localChatId.current = "";
+    setPromptValue("");
+    setAttachedImages([]);
+    pendingSendImagesRef.current = [];
+    setForcedStatus(void 0);
+  }, [setMessages]);
+  return /* @__PURE__ */ jsxs("div", { className: "puck-ai-chat", ref: pluginRef, children: [
+    /* @__PURE__ */ jsxs("div", { className: "puck-ai-chat-header", children: [
+      showSettings && /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: "puck-ai-icon-button",
+          onClick: () => setShowSettings(false),
+          title: "Back to chat",
+          type: "button",
+          children: /* @__PURE__ */ jsx(ArrowLeft, { size: 16 })
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: "puck-ai-chat-header-title", children: showSettings ? "Settings" : "AI page builder" }),
+      !showSettings && /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: "puck-ai-icon-button",
+          onClick: () => setShowSettings(true),
+          title: "Settings",
+          type: "button",
+          children: /* @__PURE__ */ jsx(Settings, { size: 16 })
+        }
+      )
+    ] }),
+    showSettings ? /* @__PURE__ */ jsx(
+      SettingsPanel,
+      {
+        settings: aiSettings,
+        onChange: setAiSettings,
+        onClearChatHistory: handleClearChatHistory,
+        hasChatMessages: messages.length > 0
+      }
+    ) : /* @__PURE__ */ jsx(ToolStatusProvider, { value: toolStatus, children: /* @__PURE__ */ jsx(
+      ChatBody,
+      {
+        messages: messagesWithStatuses,
+        handleSubmit,
+        inputRef,
+        status: resolvedStatus,
+        examplePrompts: examplePrompts == null ? void 0 : examplePrompts.map(({ label, href, onClick }) => /* @__PURE__ */ jsx(
+          ExamplePrompt,
+          {
+            label,
+            href,
+            onClick
+          },
+          label
+        )),
+        error,
+        handleRetry: () => {
+          setError("");
+          regenerate();
+        },
+        promptValue,
+        targetComponent,
+        onClearTarget: () => setTargetComponent(null),
+        images: attachedImages,
+        onImagesChange: setAttachedImages,
+        children: /* @__PURE__ */ jsx(
+          Placeholder,
+          {
+            dispatch: puckDispatch,
+            inputRef,
+            pluginRef
+          }
+        )
+      }
+    ) })
+  ] });
+}
+function createAiPlugin(opts = {}) {
+  const { scrollTracking = true, host, chat, prepareRequest, settings } = opts;
+  return {
+    label: "AI",
+    name: "ai",
+    icon: /* @__PURE__ */ jsx(Bot, {}),
+    mobilePanelHeight: "min-content",
+    render: () => /* @__PURE__ */ jsx(
+      Chat,
+      {
+        host,
+        chat,
+        prepareRequest,
+        settings
+      }
+    ),
+    overrides: {
+      preview: ({ children }) => {
+        if (scrollTracking) {
+          return /* @__PURE__ */ jsx(ScrollTracking, { children });
+        }
+        return /* @__PURE__ */ jsx(Fragment, { children });
+      }
+    }
+  };
+}
+var index_default = createAiPlugin;
+export {
+  Chat,
+  createAiPlugin,
+  index_default as default
+};
+/*! Bundled license information:
+
+lucide-react/dist/esm/shared/src/utils.js:
+lucide-react/dist/esm/defaultAttributes.js:
+lucide-react/dist/esm/Icon.js:
+lucide-react/dist/esm/createLucideIcon.js:
+lucide-react/dist/esm/icons/arrow-left.js:
+lucide-react/dist/esm/icons/arrow-up.js:
+lucide-react/dist/esm/icons/bot.js:
+lucide-react/dist/esm/icons/check.js:
+lucide-react/dist/esm/icons/eye-off.js:
+lucide-react/dist/esm/icons/eye.js:
+lucide-react/dist/esm/icons/image.js:
+lucide-react/dist/esm/icons/rotate-ccw.js:
+lucide-react/dist/esm/icons/settings.js:
+lucide-react/dist/esm/icons/trash-2.js:
+lucide-react/dist/esm/icons/triangle-alert.js:
+lucide-react/dist/esm/icons/wrench.js:
+lucide-react/dist/esm/icons/x.js:
+lucide-react/dist/esm/lucide-react.js:
+  (**
+   * @license lucide-react v0.452.0 - ISC
+   *
+   * This source code is licensed under the ISC license.
+   * See the LICENSE file in the root directory of this source tree.
+   *)
+*/
+//# sourceMappingURL=index.mjs.map