@grapesjs/studio-sdk-plugins 1.0.36 → 1.0.37

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.
Files changed (91) hide show
  1. package/dist/accordionComponent/index.cjs.js +4 -4
  2. package/dist/accordionComponent/index.es.js +83 -70
  3. package/dist/accordionComponent/index.umd.js +4 -4
  4. package/dist/aiChat/clientToolsProcessors.d.ts +1 -2
  5. package/dist/aiChat/components/utils.d.ts +1 -0
  6. package/dist/aiChat/components/utilsTw.d.ts +11 -0
  7. package/dist/aiChat/index.cjs.js +70 -70
  8. package/dist/aiChat/index.es.js +8627 -8161
  9. package/dist/aiChat/index.js +70 -70
  10. package/dist/aiChat/index.umd.js +70 -70
  11. package/dist/aiChat/projectGeneration.d.ts +17 -0
  12. package/dist/animationComponent/index.cjs.js +3 -3
  13. package/dist/animationComponent/index.es.js +55 -42
  14. package/dist/animationComponent/index.umd.js +3 -3
  15. package/dist/canvasAbsoluteMode/index.cjs.js +1 -1
  16. package/dist/canvasAbsoluteMode/index.es.js +67 -54
  17. package/dist/canvasAbsoluteMode/index.umd.js +1 -1
  18. package/dist/canvasEmptyState/index.cjs.js +1 -1
  19. package/dist/canvasEmptyState/index.es.js +59 -46
  20. package/dist/canvasEmptyState/index.umd.js +1 -1
  21. package/dist/canvasFullSize/index.cjs.js +4 -4
  22. package/dist/canvasFullSize/index.es.js +59 -46
  23. package/dist/canvasFullSize/index.umd.js +4 -4
  24. package/dist/canvasGridMode/index.cjs.js +2 -2
  25. package/dist/canvasGridMode/index.es.js +70 -57
  26. package/dist/canvasGridMode/index.umd.js +4 -4
  27. package/dist/canvasScreenshot/index.cjs.js +1 -1
  28. package/dist/canvasScreenshot/index.es.js +37 -24
  29. package/dist/canvasScreenshot/index.umd.js +1 -1
  30. package/dist/dataSourceEjs/index.cjs.js +3 -3
  31. package/dist/dataSourceEjs/index.es.js +51 -38
  32. package/dist/dataSourceEjs/index.umd.js +3 -3
  33. package/dist/dataSourceHandlebars/index.cjs.js +2 -2
  34. package/dist/dataSourceHandlebars/index.es.js +50 -37
  35. package/dist/dataSourceHandlebars/index.umd.js +6 -6
  36. package/dist/dialogComponent/index.cjs.js +9 -9
  37. package/dist/dialogComponent/index.es.js +58 -45
  38. package/dist/dialogComponent/index.umd.js +3 -3
  39. package/dist/flexComponent/index.cjs.js +6 -6
  40. package/dist/flexComponent/index.es.js +82 -69
  41. package/dist/flexComponent/index.umd.js +6 -6
  42. package/dist/fsLightboxComponent/index.cjs.js +2 -2
  43. package/dist/fsLightboxComponent/index.es.js +70 -57
  44. package/dist/fsLightboxComponent/index.umd.js +2 -2
  45. package/dist/googleFontsAssetProvider/index.cjs.js +1 -1
  46. package/dist/googleFontsAssetProvider/index.es.js +84 -71
  47. package/dist/googleFontsAssetProvider/index.umd.js +1 -1
  48. package/dist/iconifyComponent/index.cjs.js +2 -2
  49. package/dist/iconifyComponent/index.es.js +82 -69
  50. package/dist/iconifyComponent/index.umd.js +2 -2
  51. package/dist/index.cjs.js +36 -36
  52. package/dist/index.es.js +843 -830
  53. package/dist/index.umd.js +36 -36
  54. package/dist/layoutSidebarButtons/index.cjs.js +1 -1
  55. package/dist/layoutSidebarButtons/index.es.js +81 -68
  56. package/dist/layoutSidebarButtons/index.umd.js +1 -1
  57. package/dist/lightGalleryComponent/index.cjs.js +1 -1
  58. package/dist/lightGalleryComponent/index.es.js +86 -73
  59. package/dist/lightGalleryComponent/index.umd.js +1 -1
  60. package/dist/linkImageComponent/index.cjs.js +2 -2
  61. package/dist/linkImageComponent/index.es.js +70 -57
  62. package/dist/linkImageComponent/index.umd.js +2 -2
  63. package/dist/listPagesComponent/index.cjs.js +3 -3
  64. package/dist/listPagesComponent/index.es.js +49 -36
  65. package/dist/listPagesComponent/index.umd.js +3 -3
  66. package/dist/presetPrintable/index.cjs.js +3 -3
  67. package/dist/presetPrintable/index.es.js +130 -117
  68. package/dist/presetPrintable/index.umd.js +3 -3
  69. package/dist/prosemirror/index.cjs.js +1 -1
  70. package/dist/prosemirror/index.es.js +96 -83
  71. package/dist/prosemirror/index.umd.js +1 -1
  72. package/dist/rendererReact/index.cjs.js +1 -1
  73. package/dist/rendererReact/index.es.js +143 -131
  74. package/dist/rendererReact/index.js +1 -1
  75. package/dist/rendererReact/index.umd.js +1 -1
  76. package/dist/rteTinyMce/index.cjs.js +2 -2
  77. package/dist/rteTinyMce/index.es.js +74 -61
  78. package/dist/rteTinyMce/index.umd.js +2 -2
  79. package/dist/shapeDividerComponent/index.cjs.js +3 -3
  80. package/dist/shapeDividerComponent/index.es.js +33 -20
  81. package/dist/shapeDividerComponent/index.umd.js +3 -3
  82. package/dist/swiperComponent/index.cjs.js +5 -5
  83. package/dist/swiperComponent/index.es.js +105 -92
  84. package/dist/swiperComponent/index.umd.js +5 -5
  85. package/dist/tableComponent/index.cjs.js +1 -1
  86. package/dist/tableComponent/index.es.js +163 -150
  87. package/dist/tableComponent/index.umd.js +1 -1
  88. package/dist/youtubeAssetProvider/index.cjs.js +1 -1
  89. package/dist/youtubeAssetProvider/index.es.js +36 -23
  90. package/dist/youtubeAssetProvider/index.umd.js +1 -1
  91. package/package.json +2 -2
@@ -9,21 +9,34 @@ const k = "app.grapesjs.com", D = "app-stage.grapesjs.com", B = "app2.grapesjs.c
9
9
  // For stackblitz.com demos
10
10
  ".local.webcontainer.io",
11
11
  // For stackblitz.com demos
12
- "-sandpack.codesandbox.io"
12
+ "-sandpack.codesandbox.io",
13
13
  // For Sandpack demos
14
+ ".claudemcpcontent.com",
15
+ // For Claude mcp app
16
+ ".web-sandbox.oaiusercontent.com"
17
+ // For OpenAI mcp app
14
18
  ], F = "license:check:end", C = () => typeof window < "u", W = ({
15
19
  isDev: e,
16
20
  isStage: t,
17
21
  isPlatform: o
18
- }) => `${e ? "" : `https://${t ? D : k}`}/${o ? "platform-api" : "api"}`, K = () => {
19
- const e = C() && window.location.hostname;
22
+ }) => `${e ? "" : `https://${t ? D : k}`}/${o ? "platform-api" : "api"}`, m = () => {
23
+ if (!C()) return "";
24
+ const { hostname: e } = window.location;
25
+ if (e) return e;
26
+ try {
27
+ return window.parent.location.hostname || "";
28
+ } catch {
29
+ return "";
30
+ }
31
+ }, K = () => {
32
+ const e = m();
20
33
  return !!e && (O.includes(e) || O.some((t) => e.endsWith(t)));
21
34
  };
22
35
  async function V({
23
36
  path: e,
24
37
  baseApiUrl: t,
25
38
  method: o = "GET",
26
- headers: i = {},
39
+ headers: r = {},
27
40
  params: l,
28
41
  body: g
29
42
  }) {
@@ -31,14 +44,14 @@ async function V({
31
44
  method: o,
32
45
  headers: {
33
46
  "Content-Type": "application/json",
34
- ...i
47
+ ...r
35
48
  }
36
49
  };
37
50
  g && (n.body = JSON.stringify(g));
38
- const c = l ? new URLSearchParams(l).toString() : "", p = c ? `?${c}` : "", r = await fetch(`${s}${p}`, n);
39
- if (!r.ok)
40
- throw new Error(`HTTP error! status: ${r.status}`);
41
- return r.json();
51
+ const c = l ? new URLSearchParams(l).toString() : "", p = c ? `?${c}` : "", i = await fetch(`${s}${p}`, n);
52
+ if (!i.ok)
53
+ throw new Error(`HTTP error! status: ${i.status}`);
54
+ return i.json();
42
55
  }
43
56
  var w = /* @__PURE__ */ ((e) => (e.free = "free", e.startup = "startup", e.business = "business", e.enterprise = "enterprise", e))(w || {}), _ = /* @__PURE__ */ ((e) => (e.Info = "info", e.Error = "error", e.Success = "success", e.Warning = "warning", e))(_ || {}), y = /* @__PURE__ */ ((e) => (e.toastAdd = "studio:toastAdd", e.toastRemove = "studio:toastRemove", e.dialogOpen = "studio:dialogOpen", e.dialogClose = "studio:dialogClose", e.dialogExportCode = "studio:dialogExportCode", e.dialogImportCode = "studio:dialogImportCode", e.sidebarLeftSet = "studio:sidebarLeft:set", e.sidebarLeftGet = "studio:sidebarLeft:get", e.sidebarLeftToggle = "studio:sidebarLeft:toggle", e.sidebarRightSet = "studio:sidebarRight:set", e.sidebarRightGet = "studio:sidebarRight:get", e.sidebarRightToggle = "studio:sidebarRight:toggle", e.sidebarTopSet = "studio:sidebarTop:set", e.sidebarTopGet = "studio:sidebarTop:get", e.sidebarTopToggle = "studio:sidebarTop:toggle", e.sidebarBottomSet = "studio:sidebarBottom:set", e.sidebarBottomGet = "studio:sidebarBottom:get", e.sidebarBottomToggle = "studio:sidebarBottom:toggle", e.symbolAdd = "studio:symbolAdd", e.symbolDetach = "studio:symbolDetach", e.symbolOverride = "studio:symbolOverride", e.symbolPropagateStyles = "studio:propagateStyles", e.getPagesConfig = "studio:getPagesConfig", e.setPagesConfig = "studio:setPagesConfig", e.getPageSettings = "studio:getPageSettings", e.setPageSettings = "studio:setPageSettings", e.clearPage = "studio:clearPage", e.projectFiles = "studio:projectFiles", e.validateCode = "studio:validateCode", e.canvasReload = "studio:canvasReload", e.getBlocksPanel = "studio:getBlocksPanel", e.setBlocksPanel = "studio:setBlocksPanel", e.getStateContextMenu = "studio:getStateContextMenu", e.setStateContextMenu = "studio:setStateContextMenu", e.contextMenuComponent = "studio:contextMenuComponent", e.layoutAdd = "studio:layoutAdd", e.layoutRemove = "studio:layoutRemove", e.layoutToggle = "studio:layoutToggle", e.layoutUpdate = "studio:layoutUpdate", e.layoutGet = "studio:layoutGet", e.layoutConfigGet = "studio:layoutConfigGet", e.layoutConfigSet = "studio:layoutConfigSet", e.layoutComponentAdd = "studio:layoutComponentAdd", e.layoutComponentGet = "studio:layoutComponentGet", e.layoutComponentRemove = "studio:layoutComponentRemove", e.layoutComponentRender = "studio:layoutComponentRender", e.getStateTheme = "studio:getStateTheme", e.setStateTheme = "studio:setStateTheme", e.settings = "studio:settings", e.assetProviderGet = "studio:assetProviderGet", e.assetProviderAdd = "studio:assetProviderAdd", e.assetProviderRemove = "studio:assetProviderRemove", e.fontGet = "studio:fontGet", e.fontAdd = "studio:fontAdd", e.fontRemove = "studio:fontRemove", e.fontManagerOpen = "studio:fontManagerOpen", e.menuFontLoad = "studio:menuFontLoad", e.toggleStateDataSource = "studio:toggleStateDataSource", e.getStateDataSource = "studio:getStateDataSource", e.dataSourceSetGlobalData = "studio:dataSourceSetGlobalData", e.dataSourceSetImporter = "studio:dataSourceSetImporter", e.dataSourceSetExporter = "studio:dataSourceSetExporter", e.setDragAbsolute = "studio:setDragAbsolute", e))(y || {});
44
57
  const x = {
@@ -49,24 +62,24 @@ const x = {
49
62
  };
50
63
  function Y(e) {
51
64
  const t = e;
52
- return t.init = (o) => (i) => e(i, o), t;
65
+ return t.init = (o) => (r) => e(r, o), t;
53
66
  }
54
67
  const z = (e) => /* @__PURE__ */ Y(e);
55
68
  async function q({
56
69
  editor: e,
57
70
  plan: t,
58
71
  pluginName: o,
59
- licenseKey: i,
72
+ licenseKey: r,
60
73
  onLicenseCheckResponse: l,
61
74
  cleanup: g
62
75
  }) {
63
76
  let a = "", s;
64
- const n = (r) => {
65
- console.warn("Cleanup plugin:", o, "Reason:", r), g();
66
- }, c = (r = {}) => {
77
+ const n = (i) => {
78
+ console.warn("Cleanup plugin:", o, "Reason:", i), g();
79
+ }, c = (i = {}) => {
67
80
  var b;
68
- const { error: h, sdkLicense: u } = r, d = (b = r.plan) == null ? void 0 : b.category;
69
- if (!(u || r.license) || h)
81
+ const { error: h, sdkLicense: u } = i, d = (b = i.plan) == null ? void 0 : b.category;
82
+ if (!(u || i.license) || h)
70
83
  n(h || "Invalid license");
71
84
  else if (d) {
72
85
  const f = x[t], v = x[d];
@@ -74,26 +87,26 @@ async function q({
74
87
  }
75
88
  };
76
89
  e.Commands.has(y.settings) && (s = e.runCommand(y.settings), a = (s == null ? void 0 : s.baseUrl) || "");
77
- const p = (r) => {
78
- l == null || l(r), r && c(r);
90
+ const p = (i) => {
91
+ l == null || l(i), i && c(i);
79
92
  };
80
93
  if (!s) {
81
94
  e.onReady(async () => {
82
95
  if (!K())
83
- if (i) {
84
- const r = await m({ licenseKey: i, pluginName: o, baseApiUrl: a });
85
- p(r);
96
+ if (r) {
97
+ const i = await X({ licenseKey: r, pluginName: o, baseApiUrl: a });
98
+ p(i);
86
99
  } else
87
100
  n("The `licenseKey` option not provided");
88
101
  });
89
102
  return;
90
103
  }
91
104
  if (s.licensePlan || s.licenseError) {
92
- const r = J(s);
93
- p(r);
105
+ const i = J(s);
106
+ p(i);
94
107
  return;
95
108
  }
96
- e.on(F, (r) => p(r));
109
+ e.on(F, (i) => p(i));
97
110
  }
98
111
  const J = (e) => ({
99
112
  sdkLicense: e.license,
@@ -101,11 +114,11 @@ const J = (e) => ({
101
114
  error: e.licenseError,
102
115
  plan: e.licensePlan
103
116
  });
104
- async function m(e) {
105
- const { licenseKey: t, pluginName: o, baseApiUrl: i } = e;
117
+ async function X(e) {
118
+ const { licenseKey: t, pluginName: o, baseApiUrl: r } = e;
106
119
  try {
107
120
  return (await V({
108
- baseApiUrl: i,
121
+ baseApiUrl: r,
109
122
  path: `/sdk/${t || "na"}`,
110
123
  method: "POST",
111
124
  params: {
@@ -117,32 +130,32 @@ async function m(e) {
117
130
  return console.error("Error during SDK license check:", l), !1;
118
131
  }
119
132
  }
120
- const X = (e, t) => {
133
+ const Z = (e, t) => {
121
134
  var o;
122
135
  return !!((o = e == null ? void 0 : e.hasAttribute) != null && o.call(e, t));
123
- }, Z = "iconifyComponent", Q = w.startup, S = { ratioDefault: !0, tc: !1, cl: !1, cr: !1, bc: !1 }, T = `<svg viewBox="0 0 24 24">
136
+ }, Q = "iconifyComponent", S = w.startup, ee = { ratioDefault: !0, tc: !1, cl: !1, cr: !1, bc: !1 }, T = `<svg viewBox="0 0 24 24">
124
137
  <path d="M19 0H9C7.9 0 7 .9 7 2V18C7 19.1 7.9 20 9 20H19C20.1 20 21 19.1 21 18V2C21 .9 20.1 0 19 0M19 18H9V2H19V18M3 4V22C3 23.1 3.9 24 5 24H17V22H5V4H3M14 5L11 10L14 15L17 10L14 5Z" />
125
- </svg>`, $ = "layout-icon-picker", ee = "icons-layout-", G = "icons-list-layout", M = "gs-iconify-picker", A = "__iconify_collection", te = "https://api.iconify.design", E = /* @__PURE__ */ new Map();
138
+ </svg>`, $ = "layout-icon-picker", te = "icons-layout-", G = "icons-list-layout", M = "gs-iconify-picker", A = "__iconify_collection", oe = "https://api.iconify.design", E = /* @__PURE__ */ new Map();
126
139
  let L;
127
- const oe = ({ collectionId: e }) => `https://cdn.jsdelivr.net/npm/@iconify-json/${e}@latest/icons.json`;
140
+ const ne = ({ collectionId: e }) => `https://cdn.jsdelivr.net/npm/@iconify-json/${e}@latest/icons.json`;
128
141
  async function N({ collectionId: e, editor: t }) {
129
142
  try {
130
143
  if (E.has(e)) return E.get(e);
131
- const o = await fetch(oe({ collectionId: e }));
144
+ const o = await fetch(ne({ collectionId: e }));
132
145
  if (!o.ok) throw new Error(`Failed to fetch collection: ${o.statusText}`);
133
- const i = await o.json();
134
- return E.set(e, i), i;
146
+ const r = await o.json();
147
+ return E.set(e, r), r;
135
148
  } catch (o) {
136
- console.error("Error fetching collection", o), t.runCommand(y.toastAdd, ae());
149
+ console.error("Error fetching collection", o), t.runCommand(y.toastAdd, le());
137
150
  return;
138
151
  }
139
152
  }
140
- async function ne({ collectionIds: e, editor: t }) {
153
+ async function se({ collectionIds: e, editor: t }) {
141
154
  try {
142
155
  if (L) return L;
143
- const o = e ? `?prefixes=${e.join(",")}` : "", i = await fetch(`${te}/collections${o}`);
144
- if (!i.ok) throw new Error(`Failed to fetch collections: ${i.statusText}`);
145
- return L = await i.json(), L;
156
+ const o = e ? `?prefixes=${e.join(",")}` : "", r = await fetch(`${oe}/collections${o}`);
157
+ if (!r.ok) throw new Error(`Failed to fetch collections: ${r.statusText}`);
158
+ return L = await r.json(), L;
146
159
  } catch (o) {
147
160
  console.error("Error fetching collections", o), t.runCommand(y.toastAdd, j());
148
161
  return;
@@ -160,12 +173,12 @@ function R() {
160
173
  }
161
174
  };
162
175
  }
163
- async function se({ collectionIds: e, editor: t, component: o }) {
164
- const i = await ne({ collectionIds: e, editor: t });
165
- if (!i) return;
176
+ async function re({ collectionIds: e, editor: t, component: o }) {
177
+ const r = await se({ collectionIds: e, editor: t });
178
+ if (!r) return;
166
179
  const l = ({ icon: n, collectionId: c, iconId: p }) => {
167
180
  o.components(n), o.set({ collectionId: c, iconId: p });
168
- }, g = Object.entries(i).map(([n, c]) => ({ id: n, ...c })).sort((n, c) => n.name.localeCompare(c.name)), a = o.get("collectionId") ?? g[0].id;
181
+ }, g = Object.entries(r).map(([n, c]) => ({ id: n, ...c })).sort((n, c) => n.name.localeCompare(c.name)), a = o.get("collectionId") ?? g[0].id;
169
182
  t.runCommand(y.layoutToggle, {
170
183
  id: $,
171
184
  placer: { type: "dialog", size: "l", title: "Select Icon" },
@@ -174,7 +187,7 @@ async function se({ collectionIds: e, editor: t, component: o }) {
174
187
  type: "column",
175
188
  style: { height: 500, gap: 10 },
176
189
  children: [
177
- re({
190
+ ce({
178
191
  collectionsList: g,
179
192
  collectionId: a,
180
193
  editor: t,
@@ -201,15 +214,15 @@ function ie(e) {
201
214
  function P(e) {
202
215
  const { editor: t } = e;
203
216
  t.runCommand(y.layoutUpdate, {
204
- id: ee,
205
- layout: ce(e),
217
+ id: te,
218
+ layout: ae(e),
206
219
  header: !1,
207
220
  style: { height: "100%" },
208
221
  placer: { type: "static", layoutId: G }
209
222
  });
210
223
  }
211
- function re(e) {
212
- const { collectionsList: t, collectionId: o, editor: i, handleClick: l } = e, g = t.map(({ id: a, name: s, total: n }) => ({ id: a, label: `${s} (${n})` })).sort((a, s) => a.label.localeCompare(s.label));
224
+ function ce(e) {
225
+ const { collectionsList: t, collectionId: o, editor: r, handleClick: l } = e, g = t.map(({ id: a, name: s, total: n }) => ({ id: a, label: `${s} (${n})` })).sort((a, s) => a.label.localeCompare(s.label));
213
226
  return {
214
227
  type: "column",
215
228
  style: { gap: 10 },
@@ -221,9 +234,9 @@ function re(e) {
221
234
  options: g,
222
235
  emptyState: "Select an icon collection",
223
236
  onChange: async ({ setState: a, value: s }) => {
224
- const n = await N({ collectionId: s, editor: i });
225
- n && (a({ value: s }), U({ editor: i, collection: n }), P({
226
- editor: i,
237
+ const n = await N({ collectionId: s, editor: r });
238
+ n && (a({ value: s }), U({ editor: r, collection: n }), P({
239
+ editor: r,
227
240
  collection: n,
228
241
  handleClick: l,
229
242
  collectionId: s
@@ -241,7 +254,7 @@ function re(e) {
241
254
  const c = ie(n);
242
255
  if (!c) return;
243
256
  const p = Object.fromEntries(
244
- Object.entries(c.icons).filter(([r]) => r.includes(s))
257
+ Object.entries(c.icons).filter(([i]) => i.includes(s))
245
258
  );
246
259
  a({ value: s }), P({
247
260
  editor: n,
@@ -255,12 +268,12 @@ function re(e) {
255
268
  ]
256
269
  };
257
270
  }
258
- function ce({
271
+ function ae({
259
272
  collection: e,
260
273
  collectionFiltered: t,
261
274
  handleClick: o
262
275
  }) {
263
- const { height: i = 24, width: l = 24, icons: g, prefix: a } = t || e, s = Object.entries(g).map(([n, c]) => ({ name: n, ...c }), {});
276
+ const { height: r = 24, width: l = 24, icons: g, prefix: a } = t || e, s = Object.entries(g).map(([n, c]) => ({ name: n, ...c }), {});
264
277
  return {
265
278
  type: "column",
266
279
  className: `${M}__content`,
@@ -271,9 +284,9 @@ function ce({
271
284
  itemLayout: ({ item: n }) => ({
272
285
  type: "custom",
273
286
  render: (c) => {
274
- const { editor: p, addEl: r, removeEl: h } = c, u = document.createElementNS("http://www.w3.org/2000/svg", "svg");
287
+ const { editor: p, addEl: i, removeEl: h } = c, u = document.createElementNS("http://www.w3.org/2000/svg", "svg");
275
288
  u.setAttribute("xmlns", "http://www.w3.org/2000/svg"), u.innerHTML = n.body;
276
- const d = n.width || l, I = n.height || i;
289
+ const d = n.width || l, I = n.height || r;
277
290
  u.setAttribute("viewBox", `0 0 ${d} ${I}`), u.style.cssText = "width: 48px; height: 48px; cursor: pointer; border-radius: 4px; transition: padding 0.1s ease-in-out;";
278
291
  const b = [
279
292
  [
@@ -298,7 +311,7 @@ function ce({
298
311
  }
299
312
  ]
300
313
  ];
301
- return b.forEach(([f, v]) => u.addEventListener(f, v)), r(u), () => {
314
+ return b.forEach(([f, v]) => u.addEventListener(f, v)), i(u), () => {
302
315
  b.forEach(([f, v]) => u.removeEventListener(f, v)), h(u);
303
316
  };
304
317
  }
@@ -314,21 +327,21 @@ function j() {
314
327
  variant: _.Error
315
328
  };
316
329
  }
317
- function ae() {
330
+ function le() {
318
331
  return {
319
332
  ...j(),
320
333
  id: "toast-error-getCollection",
321
334
  content: "Error fetching collection"
322
335
  };
323
336
  }
324
- const le = function(e, t = {}) {
337
+ const ue = function(e, t = {}) {
325
338
  var u;
326
- const { Components: o, Blocks: i } = e, { collections: l, extendIconComponent: g = !0, licenseKey: a, block: s = {} } = t, n = "icon", c = "iconify", p = "Iconify", r = "data-type-iconify", h = {
339
+ const { Components: o, Blocks: r } = e, { collections: l, extendIconComponent: g = !0, licenseKey: a, block: s = {} } = t, n = "icon", c = "iconify", p = "Iconify", i = "data-type-iconify", h = {
327
340
  events: () => ({
328
341
  dblclick: "onActive"
329
342
  }),
330
343
  onActive() {
331
- se({ collectionIds: l, editor: e, component: this.model });
344
+ re({ collectionIds: l, editor: e, component: this.model });
332
345
  }
333
346
  };
334
347
  if (o.addType(c, {
@@ -340,14 +353,14 @@ const le = function(e, t = {}) {
340
353
  activate: !0,
341
354
  ...s
342
355
  },
343
- isComponent: (d) => X(d, r),
356
+ isComponent: (d) => Z(d, i),
344
357
  model: {
345
358
  defaults: {
346
359
  name: p,
347
360
  icon: T,
348
361
  droppable: !1,
349
- attributes: { [r]: !0 },
350
- resizable: S,
362
+ attributes: { [i]: !0 },
363
+ resizable: ee,
351
364
  components: T,
352
365
  style: { width: "50px", height: "50px" },
353
366
  traits: [R()]
@@ -374,13 +387,13 @@ const le = function(e, t = {}) {
374
387
  q({
375
388
  editor: e,
376
389
  licenseKey: a,
377
- plan: Q,
378
- pluginName: Z,
390
+ plan: S,
391
+ pluginName: Q,
379
392
  cleanup: () => {
380
- i.remove(c), o.removeType(c);
393
+ r.remove(c), o.removeType(c);
381
394
  }
382
395
  });
383
- }, ue = z(le);
396
+ }, pe = z(ue);
384
397
  export {
385
- ue as default
398
+ pe as default
386
399
  };
@@ -1,3 +1,3 @@
1
- (function(I,w){typeof exports=="object"&&typeof module<"u"?module.exports=w():typeof define=="function"&&define.amd?define(w):(I=typeof globalThis<"u"?globalThis:I||self,I.StudioSdkPlugins_iconifyComponent=w())})(this,function(){"use strict";const I="app.grapesjs.com",w="app-stage.grapesjs.com",D=[I,"app2.grapesjs.com",w,"app-stage2.grapesjs.com","localhost","127.0.0.1",".local-credentialless.webcontainer.io",".local.webcontainer.io","-sandpack.codesandbox.io"],B="license:check:end",H=()=>typeof window<"u",F=({isDev:e,isStage:t,isPlatform:o})=>`${e?"":`https://${t?w:I}`}/${o?"platform-api":"api"}`,C=()=>{const e=H()&&window.location.hostname;return!!e&&(D.includes(e)||D.some(t=>e.endsWith(t)))};async function W({path:e,baseApiUrl:t,method:o="GET",headers:i={},params:l,body:g}){const s=`${t||F({isDev:!1,isStage:!1})}${e}`,n={method:o,headers:{"Content-Type":"application/json",...i}};g&&(n.body=JSON.stringify(g));const c=l?new URLSearchParams(l).toString():"",p=c?`?${c}`:"",r=await fetch(`${s}${p}`,n);if(!r.ok)throw new Error(`HTTP error! status: ${r.status}`);return r.json()}var T=(e=>(e.free="free",e.startup="startup",e.business="business",e.enterprise="enterprise",e))(T||{}),R=(e=>(e.Info="info",e.Error="error",e.Success="success",e.Warning="warning",e))(R||{}),y=(e=>(e.toastAdd="studio:toastAdd",e.toastRemove="studio:toastRemove",e.dialogOpen="studio:dialogOpen",e.dialogClose="studio:dialogClose",e.dialogExportCode="studio:dialogExportCode",e.dialogImportCode="studio:dialogImportCode",e.sidebarLeftSet="studio:sidebarLeft:set",e.sidebarLeftGet="studio:sidebarLeft:get",e.sidebarLeftToggle="studio:sidebarLeft:toggle",e.sidebarRightSet="studio:sidebarRight:set",e.sidebarRightGet="studio:sidebarRight:get",e.sidebarRightToggle="studio:sidebarRight:toggle",e.sidebarTopSet="studio:sidebarTop:set",e.sidebarTopGet="studio:sidebarTop:get",e.sidebarTopToggle="studio:sidebarTop:toggle",e.sidebarBottomSet="studio:sidebarBottom:set",e.sidebarBottomGet="studio:sidebarBottom:get",e.sidebarBottomToggle="studio:sidebarBottom:toggle",e.symbolAdd="studio:symbolAdd",e.symbolDetach="studio:symbolDetach",e.symbolOverride="studio:symbolOverride",e.symbolPropagateStyles="studio:propagateStyles",e.getPagesConfig="studio:getPagesConfig",e.setPagesConfig="studio:setPagesConfig",e.getPageSettings="studio:getPageSettings",e.setPageSettings="studio:setPageSettings",e.clearPage="studio:clearPage",e.projectFiles="studio:projectFiles",e.validateCode="studio:validateCode",e.canvasReload="studio:canvasReload",e.getBlocksPanel="studio:getBlocksPanel",e.setBlocksPanel="studio:setBlocksPanel",e.getStateContextMenu="studio:getStateContextMenu",e.setStateContextMenu="studio:setStateContextMenu",e.contextMenuComponent="studio:contextMenuComponent",e.layoutAdd="studio:layoutAdd",e.layoutRemove="studio:layoutRemove",e.layoutToggle="studio:layoutToggle",e.layoutUpdate="studio:layoutUpdate",e.layoutGet="studio:layoutGet",e.layoutConfigGet="studio:layoutConfigGet",e.layoutConfigSet="studio:layoutConfigSet",e.layoutComponentAdd="studio:layoutComponentAdd",e.layoutComponentGet="studio:layoutComponentGet",e.layoutComponentRemove="studio:layoutComponentRemove",e.layoutComponentRender="studio:layoutComponentRender",e.getStateTheme="studio:getStateTheme",e.setStateTheme="studio:setStateTheme",e.settings="studio:settings",e.assetProviderGet="studio:assetProviderGet",e.assetProviderAdd="studio:assetProviderAdd",e.assetProviderRemove="studio:assetProviderRemove",e.fontGet="studio:fontGet",e.fontAdd="studio:fontAdd",e.fontRemove="studio:fontRemove",e.fontManagerOpen="studio:fontManagerOpen",e.menuFontLoad="studio:menuFontLoad",e.toggleStateDataSource="studio:toggleStateDataSource",e.getStateDataSource="studio:getStateDataSource",e.dataSourceSetGlobalData="studio:dataSourceSetGlobalData",e.dataSourceSetImporter="studio:dataSourceSetImporter",e.dataSourceSetExporter="studio:dataSourceSetExporter",e.setDragAbsolute="studio:setDragAbsolute",e))(y||{});const _={[T.free]:0,[T.startup]:10,[T.business]:20,[T.enterprise]:30};function K(e){const t=e;return t.init=o=>i=>e(i,o),t}const m=e=>K(e);async function V({editor:e,plan:t,pluginName:o,licenseKey:i,onLicenseCheckResponse:l,cleanup:g}){let a="",s;const n=r=>{console.warn("Cleanup plugin:",o,"Reason:",r),g()},c=(r={})=>{var b;const{error:h,sdkLicense:u}=r,d=(b=r.plan)==null?void 0:b.category;if(!(u||r.license)||h)n(h||"Invalid license");else if(d){const f=_[t],v=_[d];f>v&&n({pluginRequiredPlan:t,licensePlan:d})}};e.Commands.has(y.settings)&&(s=e.runCommand(y.settings),a=(s==null?void 0:s.baseUrl)||"");const p=r=>{l==null||l(r),r&&c(r)};if(!s){e.onReady(async()=>{if(!C())if(i){const r=await z({licenseKey:i,pluginName:o,baseApiUrl:a});p(r)}else n("The `licenseKey` option not provided")});return}if(s.licensePlan||s.licenseError){const r=Y(s);p(r);return}e.on(B,r=>p(r))}const Y=e=>({sdkLicense:e.license,license:e.license,error:e.licenseError,plan:e.licensePlan});async function z(e){const{licenseKey:t,pluginName:o,baseApiUrl:i}=e;try{return(await W({baseApiUrl:i,path:`/sdk/${t||"na"}`,method:"POST",params:{d:window.location.hostname,pn:o}})).result||{}}catch(l){return console.error("Error during SDK license check:",l),!1}}const q=(e,t)=>{var o;return!!((o=e==null?void 0:e.hasAttribute)!=null&&o.call(e,t))},J="iconifyComponent",X=T.startup,Z={ratioDefault:!0,tc:!1,cl:!1,cr:!1,bc:!1},P=`<svg viewBox="0 0 24 24">
1
+ (function(w,I){typeof exports=="object"&&typeof module<"u"?module.exports=I():typeof define=="function"&&define.amd?define(I):(w=typeof globalThis<"u"?globalThis:w||self,w.StudioSdkPlugins_iconifyComponent=I())})(this,function(){"use strict";const w="app.grapesjs.com",I="app-stage.grapesjs.com",D=[w,"app2.grapesjs.com",I,"app-stage2.grapesjs.com","localhost","127.0.0.1",".local-credentialless.webcontainer.io",".local.webcontainer.io","-sandpack.codesandbox.io",".claudemcpcontent.com",".web-sandbox.oaiusercontent.com"],B="license:check:end",H=()=>typeof window<"u",F=({isDev:e,isStage:t,isPlatform:o})=>`${e?"":`https://${t?I:w}`}/${o?"platform-api":"api"}`,C=()=>{if(!H())return"";const{hostname:e}=window.location;if(e)return e;try{return window.parent.location.hostname||""}catch{return""}},m=()=>{const e=C();return!!e&&(D.includes(e)||D.some(t=>e.endsWith(t)))};async function W({path:e,baseApiUrl:t,method:o="GET",headers:i={},params:l,body:g}){const s=`${t||F({isDev:!1,isStage:!1})}${e}`,n={method:o,headers:{"Content-Type":"application/json",...i}};g&&(n.body=JSON.stringify(g));const c=l?new URLSearchParams(l).toString():"",p=c?`?${c}`:"",r=await fetch(`${s}${p}`,n);if(!r.ok)throw new Error(`HTTP error! status: ${r.status}`);return r.json()}var T=(e=>(e.free="free",e.startup="startup",e.business="business",e.enterprise="enterprise",e))(T||{}),R=(e=>(e.Info="info",e.Error="error",e.Success="success",e.Warning="warning",e))(R||{}),y=(e=>(e.toastAdd="studio:toastAdd",e.toastRemove="studio:toastRemove",e.dialogOpen="studio:dialogOpen",e.dialogClose="studio:dialogClose",e.dialogExportCode="studio:dialogExportCode",e.dialogImportCode="studio:dialogImportCode",e.sidebarLeftSet="studio:sidebarLeft:set",e.sidebarLeftGet="studio:sidebarLeft:get",e.sidebarLeftToggle="studio:sidebarLeft:toggle",e.sidebarRightSet="studio:sidebarRight:set",e.sidebarRightGet="studio:sidebarRight:get",e.sidebarRightToggle="studio:sidebarRight:toggle",e.sidebarTopSet="studio:sidebarTop:set",e.sidebarTopGet="studio:sidebarTop:get",e.sidebarTopToggle="studio:sidebarTop:toggle",e.sidebarBottomSet="studio:sidebarBottom:set",e.sidebarBottomGet="studio:sidebarBottom:get",e.sidebarBottomToggle="studio:sidebarBottom:toggle",e.symbolAdd="studio:symbolAdd",e.symbolDetach="studio:symbolDetach",e.symbolOverride="studio:symbolOverride",e.symbolPropagateStyles="studio:propagateStyles",e.getPagesConfig="studio:getPagesConfig",e.setPagesConfig="studio:setPagesConfig",e.getPageSettings="studio:getPageSettings",e.setPageSettings="studio:setPageSettings",e.clearPage="studio:clearPage",e.projectFiles="studio:projectFiles",e.validateCode="studio:validateCode",e.canvasReload="studio:canvasReload",e.getBlocksPanel="studio:getBlocksPanel",e.setBlocksPanel="studio:setBlocksPanel",e.getStateContextMenu="studio:getStateContextMenu",e.setStateContextMenu="studio:setStateContextMenu",e.contextMenuComponent="studio:contextMenuComponent",e.layoutAdd="studio:layoutAdd",e.layoutRemove="studio:layoutRemove",e.layoutToggle="studio:layoutToggle",e.layoutUpdate="studio:layoutUpdate",e.layoutGet="studio:layoutGet",e.layoutConfigGet="studio:layoutConfigGet",e.layoutConfigSet="studio:layoutConfigSet",e.layoutComponentAdd="studio:layoutComponentAdd",e.layoutComponentGet="studio:layoutComponentGet",e.layoutComponentRemove="studio:layoutComponentRemove",e.layoutComponentRender="studio:layoutComponentRender",e.getStateTheme="studio:getStateTheme",e.setStateTheme="studio:setStateTheme",e.settings="studio:settings",e.assetProviderGet="studio:assetProviderGet",e.assetProviderAdd="studio:assetProviderAdd",e.assetProviderRemove="studio:assetProviderRemove",e.fontGet="studio:fontGet",e.fontAdd="studio:fontAdd",e.fontRemove="studio:fontRemove",e.fontManagerOpen="studio:fontManagerOpen",e.menuFontLoad="studio:menuFontLoad",e.toggleStateDataSource="studio:toggleStateDataSource",e.getStateDataSource="studio:getStateDataSource",e.dataSourceSetGlobalData="studio:dataSourceSetGlobalData",e.dataSourceSetImporter="studio:dataSourceSetImporter",e.dataSourceSetExporter="studio:dataSourceSetExporter",e.setDragAbsolute="studio:setDragAbsolute",e))(y||{});const _={[T.free]:0,[T.startup]:10,[T.business]:20,[T.enterprise]:30};function K(e){const t=e;return t.init=o=>i=>e(i,o),t}const V=e=>K(e);async function Y({editor:e,plan:t,pluginName:o,licenseKey:i,onLicenseCheckResponse:l,cleanup:g}){let a="",s;const n=r=>{console.warn("Cleanup plugin:",o,"Reason:",r),g()},c=(r={})=>{var b;const{error:h,sdkLicense:u}=r,d=(b=r.plan)==null?void 0:b.category;if(!(u||r.license)||h)n(h||"Invalid license");else if(d){const f=_[t],v=_[d];f>v&&n({pluginRequiredPlan:t,licensePlan:d})}};e.Commands.has(y.settings)&&(s=e.runCommand(y.settings),a=(s==null?void 0:s.baseUrl)||"");const p=r=>{l==null||l(r),r&&c(r)};if(!s){e.onReady(async()=>{if(!m())if(i){const r=await q({licenseKey:i,pluginName:o,baseApiUrl:a});p(r)}else n("The `licenseKey` option not provided")});return}if(s.licensePlan||s.licenseError){const r=z(s);p(r);return}e.on(B,r=>p(r))}const z=e=>({sdkLicense:e.license,license:e.license,error:e.licenseError,plan:e.licensePlan});async function q(e){const{licenseKey:t,pluginName:o,baseApiUrl:i}=e;try{return(await W({baseApiUrl:i,path:`/sdk/${t||"na"}`,method:"POST",params:{d:window.location.hostname,pn:o}})).result||{}}catch(l){return console.error("Error during SDK license check:",l),!1}}const J=(e,t)=>{var o;return!!((o=e==null?void 0:e.hasAttribute)!=null&&o.call(e,t))},X="iconifyComponent",Z=T.startup,Q={ratioDefault:!0,tc:!1,cl:!1,cr:!1,bc:!1},P=`<svg viewBox="0 0 24 24">
2
2
  <path d="M19 0H9C7.9 0 7 .9 7 2V18C7 19.1 7.9 20 9 20H19C20.1 20 21 19.1 21 18V2C21 .9 20.1 0 19 0M19 18H9V2H19V18M3 4V22C3 23.1 3.9 24 5 24H17V22H5V4H3M14 5L11 10L14 15L17 10L14 5Z" />
3
- </svg>`,k="layout-icon-picker",Q="icons-layout-",M="icons-list-layout",$="gs-iconify-picker",A="__iconify_collection",S="https://api.iconify.design",O=new Map;let L;const ee=({collectionId:e})=>`https://cdn.jsdelivr.net/npm/@iconify-json/${e}@latest/icons.json`;async function G({collectionId:e,editor:t}){try{if(O.has(e))return O.get(e);const o=await fetch(ee({collectionId:e}));if(!o.ok)throw new Error(`Failed to fetch collection: ${o.statusText}`);const i=await o.json();return O.set(e,i),i}catch(o){console.error("Error fetching collection",o),t.runCommand(y.toastAdd,re());return}}async function te({collectionIds:e,editor:t}){try{if(L)return L;const o=e?`?prefixes=${e.join(",")}`:"",i=await fetch(`${S}/collections${o}`);if(!i.ok)throw new Error(`Failed to fetch collections: ${i.statusText}`);return L=await i.json(),L}catch(o){console.error("Error fetching collections",o),t.runCommand(y.toastAdd,j());return}}function N(){return{type:"button",label:"Open Icon Picker",name:"onActive",changeProp:!0,command(e){var t;(t=e.getSelected())==null||t.trigger("active")}}}async function oe({collectionIds:e,editor:t,component:o}){const i=await te({collectionIds:e,editor:t});if(!i)return;const l=({icon:n,collectionId:c,iconId:p})=>{o.components(n),o.set({collectionId:c,iconId:p})},g=Object.entries(i).map(([n,c])=>({id:n,...c})).sort((n,c)=>n.name.localeCompare(c.name)),a=o.get("collectionId")??g[0].id;t.runCommand(y.layoutToggle,{id:k,placer:{type:"dialog",size:"l",title:"Select Icon"},header:!1,layout:{type:"column",style:{height:500,gap:10},children:[se({collectionsList:g,collectionId:a,editor:t,handleClick:l}),{id:M,type:"column",grow:!0}]}});const s=await G({collectionId:a,editor:t});s&&(U({editor:t,collection:s}),x({editor:t,collection:s,handleClick:l,collectionId:a}))}function U({editor:e,collection:t}){e.em.set(A,t)}function ne(e){return e.em.get(A)}function x(e){const{editor:t}=e;t.runCommand(y.layoutUpdate,{id:Q,layout:ie(e),header:!1,style:{height:"100%"},placer:{type:"static",layoutId:M}})}function se(e){const{collectionsList:t,collectionId:o,editor:i,handleClick:l}=e,g=t.map(({id:a,name:s,total:n})=>({id:a,label:`${s} (${n})`})).sort((a,s)=>a.label.localeCompare(s.label));return{type:"column",style:{gap:10},className:`${$}__header`,children:[{type:"selectField",value:o,options:g,emptyState:"Select an icon collection",onChange:async({setState:a,value:s})=>{const n=await G({collectionId:s,editor:i});n&&(a({value:s}),U({editor:i,collection:n}),x({editor:i,collection:n,handleClick:l,collectionId:s}))}},{type:"inputField",value:"",placeholder:"Search icons inside collection...",editorEvents:{[`change:${A}`]:({setState:a})=>a({value:""})},onInput:({setState:a,value:s,editor:n})=>{const c=ne(n);if(!c)return;const p=Object.fromEntries(Object.entries(c.icons).filter(([r])=>r.includes(s)));a({value:s}),x({editor:n,collection:c,handleClick:l,collectionId:o,collectionFiltered:{...c,icons:p}})}}]}}function ie({collection:e,collectionFiltered:t,handleClick:o}){const{height:i=24,width:l=24,icons:g,prefix:a}=t||e,s=Object.entries(g).map(([n,c])=>({name:n,...c}),{});return{type:"column",className:`${$}__content`,style:{height:"100%"},children:{type:"virtualList",items:s,itemLayout:({item:n})=>({type:"custom",render:c=>{const{editor:p,addEl:r,removeEl:h}=c,u=document.createElementNS("http://www.w3.org/2000/svg","svg");u.setAttribute("xmlns","http://www.w3.org/2000/svg"),u.innerHTML=n.body;const d=n.width||l,E=n.height||i;u.setAttribute("viewBox",`0 0 ${d} ${E}`),u.style.cssText="width: 48px; height: 48px; cursor: pointer; border-radius: 4px; transition: padding 0.1s ease-in-out;";const b=[["click",()=>{const f=u.cloneNode(!0);f.removeAttribute("style");const v=f.outerHTML;o({icon:v,collectionId:a,iconId:n.name}),p==null||p.runCommand(y.layoutRemove,{id:k})}],["pointerover",()=>{u.style.border="2px solid currentColor",u.style.padding="4px"}],["pointerout",()=>{u.style.border="",u.style.padding=""}]];return b.forEach(([f,v])=>u.addEventListener(f,v)),r(u),()=>{b.forEach(([f,v])=>u.removeEventListener(f,v)),h(u)}}})}}}function j(){return{id:"toast-error-getCollections",header:"Error",content:"Error fetching collections",variant:R.Error}}function re(){return{...j(),id:"toast-error-getCollection",content:"Error fetching collection"}}return m(function(e,t={}){var u;const{Components:o,Blocks:i}=e,{collections:l,extendIconComponent:g=!0,licenseKey:a,block:s={}}=t,n="icon",c="iconify",p="Iconify",r="data-type-iconify",h={events:()=>({dblclick:"onActive"}),onActive(){oe({collectionIds:l,editor:e,component:this.model})}};if(o.addType(c,{block:s&&{label:p,media:P,content:{type:c},category:"Extra",activate:!0,...s},isComponent:d=>q(d,r),model:{defaults:{name:p,icon:P,droppable:!1,attributes:{[r]:!0},resizable:Z,components:P,style:{width:"50px",height:"50px"},traits:[N()]},init(){this.listenTo(this.components(),"change add",this.disableLayers),this.disableLayers()},disableLayers(){this.components().forEach(d=>d.set({layerable:!1,locked:!0}))}},view:h}),g){const d=(u=o.getType(n))==null?void 0:u.model,[E,b,...f]=d.getDefaults().traits;o.addType(n,{model:{defaults:{traits:[E,b,N(),...f]}},view:h})}V({editor:e,licenseKey:a,plan:X,pluginName:J,cleanup:()=>{i.remove(c),o.removeType(c)}})})});
3
+ </svg>`,k="layout-icon-picker",S="icons-layout-",M="icons-list-layout",$="gs-iconify-picker",A="__iconify_collection",ee="https://api.iconify.design",O=new Map;let L;const te=({collectionId:e})=>`https://cdn.jsdelivr.net/npm/@iconify-json/${e}@latest/icons.json`;async function G({collectionId:e,editor:t}){try{if(O.has(e))return O.get(e);const o=await fetch(te({collectionId:e}));if(!o.ok)throw new Error(`Failed to fetch collection: ${o.statusText}`);const i=await o.json();return O.set(e,i),i}catch(o){console.error("Error fetching collection",o),t.runCommand(y.toastAdd,ce());return}}async function oe({collectionIds:e,editor:t}){try{if(L)return L;const o=e?`?prefixes=${e.join(",")}`:"",i=await fetch(`${ee}/collections${o}`);if(!i.ok)throw new Error(`Failed to fetch collections: ${i.statusText}`);return L=await i.json(),L}catch(o){console.error("Error fetching collections",o),t.runCommand(y.toastAdd,j());return}}function N(){return{type:"button",label:"Open Icon Picker",name:"onActive",changeProp:!0,command(e){var t;(t=e.getSelected())==null||t.trigger("active")}}}async function ne({collectionIds:e,editor:t,component:o}){const i=await oe({collectionIds:e,editor:t});if(!i)return;const l=({icon:n,collectionId:c,iconId:p})=>{o.components(n),o.set({collectionId:c,iconId:p})},g=Object.entries(i).map(([n,c])=>({id:n,...c})).sort((n,c)=>n.name.localeCompare(c.name)),a=o.get("collectionId")??g[0].id;t.runCommand(y.layoutToggle,{id:k,placer:{type:"dialog",size:"l",title:"Select Icon"},header:!1,layout:{type:"column",style:{height:500,gap:10},children:[ie({collectionsList:g,collectionId:a,editor:t,handleClick:l}),{id:M,type:"column",grow:!0}]}});const s=await G({collectionId:a,editor:t});s&&(U({editor:t,collection:s}),x({editor:t,collection:s,handleClick:l,collectionId:a}))}function U({editor:e,collection:t}){e.em.set(A,t)}function se(e){return e.em.get(A)}function x(e){const{editor:t}=e;t.runCommand(y.layoutUpdate,{id:S,layout:re(e),header:!1,style:{height:"100%"},placer:{type:"static",layoutId:M}})}function ie(e){const{collectionsList:t,collectionId:o,editor:i,handleClick:l}=e,g=t.map(({id:a,name:s,total:n})=>({id:a,label:`${s} (${n})`})).sort((a,s)=>a.label.localeCompare(s.label));return{type:"column",style:{gap:10},className:`${$}__header`,children:[{type:"selectField",value:o,options:g,emptyState:"Select an icon collection",onChange:async({setState:a,value:s})=>{const n=await G({collectionId:s,editor:i});n&&(a({value:s}),U({editor:i,collection:n}),x({editor:i,collection:n,handleClick:l,collectionId:s}))}},{type:"inputField",value:"",placeholder:"Search icons inside collection...",editorEvents:{[`change:${A}`]:({setState:a})=>a({value:""})},onInput:({setState:a,value:s,editor:n})=>{const c=se(n);if(!c)return;const p=Object.fromEntries(Object.entries(c.icons).filter(([r])=>r.includes(s)));a({value:s}),x({editor:n,collection:c,handleClick:l,collectionId:o,collectionFiltered:{...c,icons:p}})}}]}}function re({collection:e,collectionFiltered:t,handleClick:o}){const{height:i=24,width:l=24,icons:g,prefix:a}=t||e,s=Object.entries(g).map(([n,c])=>({name:n,...c}),{});return{type:"column",className:`${$}__content`,style:{height:"100%"},children:{type:"virtualList",items:s,itemLayout:({item:n})=>({type:"custom",render:c=>{const{editor:p,addEl:r,removeEl:h}=c,u=document.createElementNS("http://www.w3.org/2000/svg","svg");u.setAttribute("xmlns","http://www.w3.org/2000/svg"),u.innerHTML=n.body;const d=n.width||l,E=n.height||i;u.setAttribute("viewBox",`0 0 ${d} ${E}`),u.style.cssText="width: 48px; height: 48px; cursor: pointer; border-radius: 4px; transition: padding 0.1s ease-in-out;";const b=[["click",()=>{const f=u.cloneNode(!0);f.removeAttribute("style");const v=f.outerHTML;o({icon:v,collectionId:a,iconId:n.name}),p==null||p.runCommand(y.layoutRemove,{id:k})}],["pointerover",()=>{u.style.border="2px solid currentColor",u.style.padding="4px"}],["pointerout",()=>{u.style.border="",u.style.padding=""}]];return b.forEach(([f,v])=>u.addEventListener(f,v)),r(u),()=>{b.forEach(([f,v])=>u.removeEventListener(f,v)),h(u)}}})}}}function j(){return{id:"toast-error-getCollections",header:"Error",content:"Error fetching collections",variant:R.Error}}function ce(){return{...j(),id:"toast-error-getCollection",content:"Error fetching collection"}}return V(function(e,t={}){var u;const{Components:o,Blocks:i}=e,{collections:l,extendIconComponent:g=!0,licenseKey:a,block:s={}}=t,n="icon",c="iconify",p="Iconify",r="data-type-iconify",h={events:()=>({dblclick:"onActive"}),onActive(){ne({collectionIds:l,editor:e,component:this.model})}};if(o.addType(c,{block:s&&{label:p,media:P,content:{type:c},category:"Extra",activate:!0,...s},isComponent:d=>J(d,r),model:{defaults:{name:p,icon:P,droppable:!1,attributes:{[r]:!0},resizable:Q,components:P,style:{width:"50px",height:"50px"},traits:[N()]},init(){this.listenTo(this.components(),"change add",this.disableLayers),this.disableLayers()},disableLayers(){this.components().forEach(d=>d.set({layerable:!1,locked:!0}))}},view:h}),g){const d=(u=o.getType(n))==null?void 0:u.model,[E,b,...f]=d.getDefaults().traits;o.addType(n,{model:{defaults:{traits:[E,b,N(),...f]}},view:h})}Y({editor:e,licenseKey:a,plan:Z,pluginName:X,cleanup:()=>{i.remove(c),o.removeType(c)}})})});