puckeditor-plugin-ai 0.6.1 → 0.6.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.mts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { PuckAction, Data, Config, Plugin } from '@puckeditor/core';
2
+ import { PuckAction, Data, Config, Plugin } from 'puckeditor-core';
3
3
  import { CreateUIMessage, UIMessage, LanguageModelUsage, DataUIPart, ChatStatus } from 'ai';
4
4
 
5
5
  interface AttachedImage {
@@ -196,7 +196,7 @@ type AiPluginProps = {
196
196
  scrollTracking?: boolean;
197
197
  prepareRequest?: (opts: RequestOptions) => RequestOptions | Promise<RequestOptions>;
198
198
  };
199
- declare module "@puckeditor/core" {
199
+ declare module "puckeditor-core" {
200
200
  interface ComponentMetadata {
201
201
  ai?: ComponentAiParams;
202
202
  }
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { PuckAction, Data, Config, Plugin } from '@puckeditor/core';
2
+ import { PuckAction, Data, Config, Plugin } from 'puckeditor-core';
3
3
  import { CreateUIMessage, UIMessage, LanguageModelUsage, DataUIPart, ChatStatus } from 'ai';
4
4
 
5
5
  interface AttachedImage {
@@ -196,7 +196,7 @@ type AiPluginProps = {
196
196
  scrollTracking?: boolean;
197
197
  prepareRequest?: (opts: RequestOptions) => RequestOptions | Promise<RequestOptions>;
198
198
  };
199
- declare module "@puckeditor/core" {
199
+ declare module "puckeditor-core" {
200
200
  interface ComponentMetadata {
201
201
  ai?: ComponentAiParams;
202
202
  }
package/dist/index.js CHANGED
@@ -91,7 +91,7 @@ var import_react = __toESM(require("react"));
91
91
 
92
92
  // index.tsx
93
93
  var import_react4 = require("react");
94
- var import_core = require("@puckeditor/core");
94
+ var import_puckeditor_core = require("puckeditor-core");
95
95
  var import_react5 = require("@ai-sdk/react");
96
96
  var import_ai = require("ai");
97
97
  var import_react_markdown = __toESM(require("react-markdown"));
@@ -274,25 +274,31 @@ var applyArrayDefaults = (oldProps, newProps, fields) => {
274
274
  if (field.type === "array") {
275
275
  const arrayField = field;
276
276
  const arrayFields = arrayField.arrayFields;
277
- updatedProps[fieldName] = (updatedProps[fieldName] || []).map((item, index) => {
278
- var _a, _b, _c, _d, _e;
279
- const newItem = {};
280
- const defaultValue = typeof arrayField.defaultItemProps === "function" ? arrayField.defaultItemProps(index) : arrayField.defaultItemProps;
281
- for (const arrayFieldName in arrayFields) {
282
- const subField = arrayFields[arrayFieldName];
283
- if (subField.type === "slot") {
284
- 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];
285
- } else {
286
- newItem[arrayFieldName] = (_e = item[arrayFieldName]) != null ? _e : defaultValue == null ? void 0 : defaultValue[arrayFieldName];
277
+ updatedProps[fieldName] = (updatedProps[fieldName] || []).map(
278
+ (item, index) => {
279
+ var _a, _b, _c, _d, _e;
280
+ const newItem = {};
281
+ const defaultValue = typeof arrayField.defaultItemProps === "function" ? arrayField.defaultItemProps(index) : arrayField.defaultItemProps;
282
+ for (const arrayFieldName in arrayFields) {
283
+ const subField = arrayFields[arrayFieldName];
284
+ if (subField.type === "slot") {
285
+ 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];
286
+ } else {
287
+ newItem[arrayFieldName] = (_e = item[arrayFieldName]) != null ? _e : defaultValue == null ? void 0 : defaultValue[arrayFieldName];
288
+ }
287
289
  }
290
+ return newItem;
288
291
  }
289
- return newItem;
290
- });
292
+ );
291
293
  }
292
294
  }
293
295
  return updatedProps;
294
296
  };
295
- var dispatchOp = (operation, { getState, dispatchAction, config }) => {
297
+ var dispatchOp = (operation, {
298
+ getState,
299
+ dispatchAction,
300
+ config
301
+ }) => {
296
302
  var _a, _b, _c, _d, _e, _f, _g, _h, _i;
297
303
  const state = getState();
298
304
  try {
@@ -308,7 +314,9 @@ var dispatchOp = (operation, { getState, dispatchAction, config }) => {
308
314
  });
309
315
  const existing = getItemById(getState(), operation.id);
310
316
  if (!existing) {
311
- throw new Error(`Tried to update an item that doesn't exist: ${operation.id}`);
317
+ throw new Error(
318
+ `Tried to update an item that doesn't exist: ${operation.id}`
319
+ );
312
320
  }
313
321
  const newData = __spreadProps(__spreadValues({}, existing), {
314
322
  props: applyArrayDefaults(
@@ -329,7 +337,9 @@ var dispatchOp = (operation, { getState, dispatchAction, config }) => {
329
337
  const selector = getSelectorForId(state, operation.id);
330
338
  const existing = getItemById(state, operation.id);
331
339
  if (!selector || !existing) {
332
- throw new Error(`Tried to update an item that doesn't exist: ${operation.id}`);
340
+ throw new Error(
341
+ `Tried to update an item that doesn't exist: ${operation.id}`
342
+ );
333
343
  }
334
344
  const newData = __spreadProps(__spreadValues({}, existing), {
335
345
  props: applyArrayDefaults(
@@ -358,7 +368,9 @@ var dispatchOp = (operation, { getState, dispatchAction, config }) => {
358
368
  } else if (operation.op === "delete") {
359
369
  const selector = getSelectorForId(state, operation.id);
360
370
  if (!selector) {
361
- throw new Error(`Tried to delete an item that doesn't exist: ${operation.id}`);
371
+ throw new Error(
372
+ `Tried to delete an item that doesn't exist: ${operation.id}`
373
+ );
362
374
  }
363
375
  dispatchAction({
364
376
  type: "remove",
@@ -369,7 +381,9 @@ var dispatchOp = (operation, { getState, dispatchAction, config }) => {
369
381
  } else if (operation.op === "duplicate") {
370
382
  const selector = getSelectorForId(state, operation.id);
371
383
  if (!selector) {
372
- throw new Error(`Tried to duplicate an item that doesn't exist: ${operation.id}`);
384
+ throw new Error(
385
+ `Tried to duplicate an item that doesn't exist: ${operation.id}`
386
+ );
373
387
  }
374
388
  dispatchAction({
375
389
  type: "duplicate",
@@ -380,7 +394,9 @@ var dispatchOp = (operation, { getState, dispatchAction, config }) => {
380
394
  } else if (operation.op === "move") {
381
395
  const selector = getSelectorForId(state, operation.id);
382
396
  if (!selector) {
383
- throw new Error(`Tried to move an item that doesn't exist: ${operation.id}`);
397
+ throw new Error(
398
+ `Tried to move an item that doesn't exist: ${operation.id}`
399
+ );
384
400
  }
385
401
  dispatchAction({
386
402
  type: "move",
@@ -466,10 +482,18 @@ function ExamplePrompt({
466
482
  onClick
467
483
  }) {
468
484
  const El = href ? "a" : "button";
469
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(El, { className: "puck-ai-chatbody-example-prompt", href, onClick, children: [
470
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: label }),
471
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "puck-ai-chatbody-example-prompt-arrow", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ArrowUp, { size: 16 }) })
472
- ] });
485
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
486
+ El,
487
+ {
488
+ className: "puck-ai-chatbody-example-prompt",
489
+ href,
490
+ onClick,
491
+ children: [
492
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: label }),
493
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "puck-ai-chatbody-example-prompt-arrow", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ArrowUp, { size: 16 }) })
494
+ ]
495
+ }
496
+ );
473
497
  }
474
498
  function PromptForm({
475
499
  handleSubmit,
@@ -499,15 +523,21 @@ function PromptForm({
499
523
  setPrompt(initialPrompt);
500
524
  }
501
525
  }, []);
502
- const addImages = (0, import_react4.useCallback)((files) => __async(null, null, function* () {
503
- const newImgs = yield filesToAttachedImages(files);
504
- if (newImgs.length > 0) {
505
- onImagesChange == null ? void 0 : onImagesChange([...images, ...newImgs]);
506
- }
507
- }), [images, onImagesChange]);
508
- const removeImage = (0, import_react4.useCallback)((id) => {
509
- onImagesChange == null ? void 0 : onImagesChange(images.filter((img) => img.id !== id));
510
- }, [images, onImagesChange]);
526
+ const addImages = (0, import_react4.useCallback)(
527
+ (files) => __async(null, null, function* () {
528
+ const newImgs = yield filesToAttachedImages(files);
529
+ if (newImgs.length > 0) {
530
+ onImagesChange == null ? void 0 : onImagesChange([...images, ...newImgs]);
531
+ }
532
+ }),
533
+ [images, onImagesChange]
534
+ );
535
+ const removeImage = (0, import_react4.useCallback)(
536
+ (id) => {
537
+ onImagesChange == null ? void 0 : onImagesChange(images.filter((img) => img.id !== id));
538
+ },
539
+ [images, onImagesChange]
540
+ );
511
541
  const sendPrompt = () => {
512
542
  if (isLoading) return;
513
543
  if (prompt.trim() || images.length > 0) {
@@ -773,7 +803,14 @@ function Placeholder({
773
803
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Bot, { size: 24 }),
774
804
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: "Use AI to build a page using the available blocks" }),
775
805
  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "puck-ai-chat-actions", children: [
776
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "puck-ai-chat-action", onClick: handleEnterPromptClick, children: "Enter prompt" }),
806
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
807
+ "button",
808
+ {
809
+ className: "puck-ai-chat-action",
810
+ onClick: handleEnterPromptClick,
811
+ children: "Enter prompt"
812
+ }
813
+ ),
777
814
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
778
815
  "button",
779
816
  {
@@ -807,7 +844,9 @@ function scrollIntoViewLocal(el, win, behavior = "smooth") {
807
844
  function useFrameMutationObserver(callback) {
808
845
  return (0, import_react4.useCallback)(() => {
809
846
  var _a;
810
- const frame = document == null ? void 0 : document.getElementById("preview-frame");
847
+ const frame = document == null ? void 0 : document.getElementById(
848
+ "preview-frame"
849
+ );
811
850
  if (!frame) return;
812
851
  let observer = null;
813
852
  const win = frame.contentWindow;
@@ -860,7 +899,7 @@ function ScrollTracking({ children }) {
860
899
  }, [follow]);
861
900
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children });
862
901
  }
863
- var usePuck = (0, import_core.createUsePuck)();
902
+ var usePuck = (0, import_puckeditor_core.createUsePuck)();
864
903
  function Chat({
865
904
  chat,
866
905
  host = "/api/puck/chat",
@@ -868,7 +907,7 @@ function Chat({
868
907
  }) {
869
908
  const { examplePrompts } = chat != null ? chat : {};
870
909
  const puckDispatch = usePuck((s) => s.dispatch);
871
- const getPuck = (0, import_core.useGetPuck)();
910
+ const getPuck = (0, import_puckeditor_core.useGetPuck)();
872
911
  const localChatId = (0, import_react4.useRef)("");
873
912
  const inputRef = (0, import_react4.useRef)(null);
874
913
  const pluginRef = (0, import_react4.useRef)(null);
@@ -966,7 +1005,9 @@ function Chat({
966
1005
  var _a, _b, _c, _d;
967
1006
  const puck = getPuck();
968
1007
  const config = (_a = puck == null ? void 0 : puck.config) != null ? _a : { components: {} };
969
- const appState = (_b = puck == null ? void 0 : puck.appState) != null ? _b : { data: { root: { props: {} }, content: [], zones: {} } };
1008
+ const appState = (_b = puck == null ? void 0 : puck.appState) != null ? _b : {
1009
+ data: { root: { props: {} }, content: [], zones: {} }
1010
+ };
970
1011
  const root = (_c = config.root) != null ? _c : {
971
1012
  fields: {
972
1013
  title: {
@@ -1015,7 +1056,11 @@ function Chat({
1015
1056
  onFinish: () => {
1016
1057
  const puck = getPuck();
1017
1058
  if (puck == null ? void 0 : puck.appState) {
1018
- puckDispatch({ type: "set", state: puck.appState, recordHistory: true });
1059
+ puckDispatch({
1060
+ type: "set",
1061
+ state: puck.appState,
1062
+ recordHistory: true
1063
+ });
1019
1064
  }
1020
1065
  }
1021
1066
  });
@@ -1084,7 +1129,15 @@ function Chat({
1084
1129
  handleSubmit,
1085
1130
  inputRef,
1086
1131
  status: resolvedStatus,
1087
- examplePrompts: examplePrompts == null ? void 0 : examplePrompts.map(({ label, href, onClick }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ExamplePrompt, { label, href, onClick }, label)),
1132
+ examplePrompts: examplePrompts == null ? void 0 : examplePrompts.map(({ label, href, onClick }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
1133
+ ExamplePrompt,
1134
+ {
1135
+ label,
1136
+ href,
1137
+ onClick
1138
+ },
1139
+ label
1140
+ )),
1088
1141
  error,
1089
1142
  handleRetry: () => {
1090
1143
  setError("");
@@ -1095,7 +1148,14 @@ function Chat({
1095
1148
  onClearTarget: () => setTargetComponent(null),
1096
1149
  images: attachedImages,
1097
1150
  onImagesChange: setAttachedImages,
1098
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Placeholder, { dispatch: puckDispatch, inputRef, pluginRef })
1151
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
1152
+ Placeholder,
1153
+ {
1154
+ dispatch: puckDispatch,
1155
+ inputRef,
1156
+ pluginRef
1157
+ }
1158
+ )
1099
1159
  }
1100
1160
  ) })
1101
1161
  ] });