@chaibuilder/sdk 1.2.26 → 1.2.28

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 (81) hide show
  1. package/dist/{AddBlocks-l1JENNvq.js → AddBlocks-0sW6gkCO.js} +5 -5
  2. package/dist/AddBlocks-YJPdSqcY.cjs +1 -0
  3. package/dist/{BrandingOptions-udtH5yJs.js → BrandingOptions--vgnQvD1.js} +8 -8
  4. package/dist/{BrandingOptions-DkpqGARR.cjs → BrandingOptions-RDn_Nhcq.cjs} +1 -1
  5. package/dist/CanvasArea-41QoxuLf.cjs +55 -0
  6. package/dist/CanvasArea-aii0PyU-.js +1179 -0
  7. package/dist/{Class-lGzsNBOK.js → Class-6Hz2KzYb.js} +1 -1
  8. package/dist/{Class-PoYusiA5.cjs → Class-Zc8hpE7f.cjs} +1 -1
  9. package/dist/{CurrentPage-tJUjXWdb.js → CurrentPage-06Iacwyp.js} +6 -6
  10. package/dist/{CurrentPage-Hl52iub_.cjs → CurrentPage-2W1pdAOG.cjs} +1 -1
  11. package/dist/ListTree-DnA8gj-7.js +314 -0
  12. package/dist/ListTree-pdQ14QJC.cjs +1 -0
  13. package/dist/MODIFIERS-YPHRtwrM.cjs +1 -0
  14. package/dist/{MODIFIERS-dytZ-osO.js → MODIFIERS-cBT31iqE.js} +3 -11
  15. package/dist/{PagesPanel-WzCocl6u.cjs → PagesPanel-PBFzPSNY.cjs} +1 -1
  16. package/dist/{PagesPanel-6rrLXEO-.js → PagesPanel-_1CDTUdE.js} +7 -7
  17. package/dist/{ProjectPanel-o7gdcwPn.cjs → ProjectPanel-755bbzEQ.cjs} +1 -1
  18. package/dist/{ProjectPanel-tz3bjdXy.js → ProjectPanel-pUMeIiUW.js} +7 -7
  19. package/dist/Settings-G9Xtqr7n.cjs +1 -0
  20. package/dist/{Settings-4s2LUVmC.js → Settings-dnO-s6x0.js} +596 -560
  21. package/dist/{SidePanels-3o6Okmvu.cjs → SidePanels-Gq2LdVuY.cjs} +1 -1
  22. package/dist/{SidePanels-bugFfInz.js → SidePanels-VxSXXkt_.js} +56 -56
  23. package/dist/{Topbar-pWzBEOed.js → Topbar-5zbOSGF6.js} +3 -3
  24. package/dist/{Topbar-CqW7G360.cjs → Topbar-J2tb4SA1.cjs} +1 -1
  25. package/dist/{UnsplashImages-qvwFbV-E.js → UnsplashImages-4WAWgA4s.js} +9 -9
  26. package/dist/{UnsplashImages-NGskB93R.cjs → UnsplashImages-XwjKheek.cjs} +1 -1
  27. package/dist/{UploadImages-9NapgXBq.js → UploadImages-PONIHtn6.js} +3 -3
  28. package/dist/{UploadImages-Oh7Glr9A.cjs → UploadImages-y7LAQVrT.cjs} +1 -1
  29. package/dist/{add-page-modal-k2Kb92HS.js → add-page-modal-4VrFvgEm.js} +7 -7
  30. package/dist/{add-page-modal--6TTBRYa.cjs → add-page-modal-jWcp0w-S.cjs} +1 -1
  31. package/dist/{confirm-alert-C4M9eF-o.cjs → confirm-alert-4OQlXZTJ.cjs} +1 -1
  32. package/dist/{confirm-alert-GUhZ_G8w.js → confirm-alert-j7b88hsW.js} +3 -3
  33. package/dist/core.cjs +1 -1
  34. package/dist/core.js +4 -4
  35. package/dist/{delete-page-modal-zONvdebd.js → delete-page-modal--xHHdRAq.js} +6 -6
  36. package/dist/{delete-page-modal-cFoL-wdo.cjs → delete-page-modal-p6b0upz4.cjs} +1 -1
  37. package/dist/email-blocks.cjs +1 -1
  38. package/dist/email-blocks.js +1 -1
  39. package/dist/email.cjs +1 -1
  40. package/dist/email.js +4 -4
  41. package/dist/{form-STUz-6nE.js → form-_GJb9YcB.js} +1 -1
  42. package/dist/{form-lBQ_76Uw.cjs → form-jQj7E-hS.cjs} +1 -1
  43. package/dist/html-to-json-LJyJsnmZ.js +228 -0
  44. package/dist/html-to-json-vP1ESB_e.cjs +1 -0
  45. package/dist/{index-SkyM3d6Q.js → index-0QJwevON.js} +2 -2
  46. package/dist/index-12HbDLon.cjs +1 -0
  47. package/dist/{index-llTXLDGE.js → index-Eb5zyh2F.js} +4 -4
  48. package/dist/{index-mbyqq81O.cjs → index-KArv7pNz.cjs} +1 -1
  49. package/dist/{index-Gk6sASBd.js → index-UHaqEdws.js} +993 -957
  50. package/dist/{index-OB199Izc.cjs → index-mlMvwv2b.cjs} +2 -2
  51. package/dist/lib.cjs +1 -1
  52. package/dist/lib.js +4 -4
  53. package/dist/{page-viewer-Pdg9F5Hv.js → page-viewer-00Xx4u8e.js} +7 -7
  54. package/dist/{page-viewer-2kwnKM6v.cjs → page-viewer-SZNm7b1n.cjs} +1 -1
  55. package/dist/{project-general-setting-CnNL98NM.cjs → project-general-setting-C_pHNuZE.cjs} +1 -1
  56. package/dist/{project-general-setting-f8Ebsn6K.js → project-general-setting-asDxlmhZ.js} +7 -7
  57. package/dist/{project-seo-setting-pX34Qsym.js → project-seo-setting-DuAaDfDR.js} +4 -4
  58. package/dist/{project-seo-setting-mlxL_e2_.cjs → project-seo-setting-q2953ybQ.cjs} +1 -1
  59. package/dist/render.cjs +1 -1
  60. package/dist/render.js +1 -1
  61. package/dist/{single-page-detail-dpe5LT0M.js → single-page-detail-UNxXvhl4.js} +14 -14
  62. package/dist/{single-page-detail-XfzrGlzA.cjs → single-page-detail-oqj6zsLU.cjs} +1 -1
  63. package/dist/studio.cjs +1 -1
  64. package/dist/studio.js +6 -6
  65. package/dist/ui.cjs +1 -1
  66. package/dist/ui.js +9 -9
  67. package/dist/useCanvasSettings-MR0Glu1b.cjs +1 -0
  68. package/dist/useCanvasSettings-R6br4J9i.js +6 -0
  69. package/dist/web-blocks.cjs +33 -6
  70. package/dist/web-blocks.js +461 -388
  71. package/package.json +1 -1
  72. package/dist/AddBlocks-zPPKkeKs.cjs +0 -1
  73. package/dist/CanvasArea-h0W-Tyha.js +0 -951
  74. package/dist/CanvasArea-zme1r3Zi.cjs +0 -55
  75. package/dist/ListTree-WvTjY5rr.cjs +0 -1
  76. package/dist/ListTree-cZ-Ihlt3.js +0 -309
  77. package/dist/MODIFIERS-0g14w5RS.cjs +0 -1
  78. package/dist/Settings-AqoKwR92.cjs +0 -1
  79. package/dist/html-to-json-efmv1pCj.cjs +0 -1
  80. package/dist/html-to-json-ngX9ef2u.js +0 -185
  81. package/dist/index-h-hd6EvN.cjs +0 -1
@@ -1,951 +0,0 @@
1
- var Re = Object.defineProperty;
2
- var $e = (e, t, n) => t in e ? Re(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
3
- var E = (e, t, n) => ($e(e, typeof t != "symbol" ? t + "" : t, n), n);
4
- import { j as o } from "./jsx-runtime-WbnYoNE9.js";
5
- import M, { createElement as se, useCallback as K, useState as I, useEffect as j, Component as me, Children as Fe, Suspense as ge, useRef as ie, useMemo as Pe } from "react";
6
- import { map as O, includes as re, toUpper as Q, round as Oe, noop as $, has as fe, throttle as xe, isEmpty as N, first as W, omit as He, pick as ze, get as y, isString as ee, memoize as Ue, each as We, find as qe, filter as ye, isNull as Ke } from "lodash-es";
7
- import { ResetIcon as ae, MobileIcon as le, LaptopIcon as Ve, DesktopIcon as Ye, DotsVerticalIcon as Je, EraserIcon as Qe, ZoomInIcon as Ze, DragHandleDots2Icon as Ge, ArrowUpIcon as Xe, CopyIcon as et, TrashIcon as tt } from "@radix-ui/react-icons";
8
- import { v as ve, B as q, V as be, aB as nt, aC as ot, aD as st, aE as it, aF as rt, N as te, ab as at, h as V, aG as lt, aH as ct, aI as dt, aJ as pt, aK as ut, aL as ht, aM as mt, r as S, ac as T, A as gt, a as ft, b as xt, c as yt, d as vt, e as bt, f as kt, g as wt, ai as jt, O as ke, aA as U, L as Ct, aN as Bt, Y as L, a5 as Dt, aO as F, E as ne, t as we, q as je, s as Ce, z as It, aP as St, aQ as Be, aR as _t, aS as Nt, F as At, aT as Et, a1 as Mt, aU as Tt, S as De } from "./index-Gk6sASBd.js";
9
- import { useTranslation as Y } from "react-i18next";
10
- import { useAtom as C } from "jotai";
11
- import ce from "react-dom";
12
- import w from "prop-types";
13
- import { Quill as Lt } from "react-quill";
14
- import { useFeature as Ie } from "flagged";
15
- import { flip as Rt } from "@floating-ui/dom";
16
- import { useFloating as $t, shift as Ft } from "@floating-ui/react-dom";
17
- import { useResizeObserver as Pt } from "@react-hookz/web";
18
- import { tailwindcssPaletteGenerator as Ot } from "@bobthered/tailwindcss-palette-generator";
19
- import Ht from "@tailwindcss/typography";
20
- import zt from "@tailwindcss/forms";
21
- import Ut from "@tailwindcss/aspect-ratio";
22
- import { Provider as Wt } from "react-wrap-balancer";
23
- import { twMerge as qt } from "tailwind-merge";
24
- import { S as de, a as Se } from "./STRINGS--j49GZJP.js";
25
- import { getBlockComponent as Kt } from "@chaibuilder/runtime";
26
- import { u as Vt, B as Yt, E as Jt } from "./index-SkyM3d6Q.js";
27
- import "./_commonjsHelpers-UyOWmZb0.js";
28
- import "./Functions-7jnEwJyw.js";
29
- import "clsx";
30
- import "./MODIFIERS-dytZ-osO.js";
31
- import "./Class-lGzsNBOK.js";
32
- import "@radix-ui/react-toggle";
33
- import "class-variance-authority";
34
- import "@radix-ui/react-switch";
35
- import "@radix-ui/react-slot";
36
- import "@radix-ui/react-accordion";
37
- import "@radix-ui/react-alert-dialog";
38
- import "@radix-ui/react-dialog";
39
- import "@radix-ui/react-label";
40
- import "@radix-ui/react-scroll-area";
41
- import "@radix-ui/react-tabs";
42
- import "@radix-ui/react-tooltip";
43
- import "@radix-ui/react-popover";
44
- import "@radix-ui/react-menubar";
45
- import "@radix-ui/react-hover-card";
46
- import "@radix-ui/react-select";
47
- import "@radix-ui/react-dropdown-menu";
48
- import "@radix-ui/react-separator";
49
- import "@radix-ui/react-toast";
50
- import "cmdk";
51
- import "@radix-ui/react-context-menu";
52
- import "react-icons-picker";
53
- import "i18next";
54
- import "react-hotkeys-hook";
55
- const Qt = () => {
56
- const { hasUndo: e, hasRedo: t, undo: n, redo: r } = ve();
57
- return /* @__PURE__ */ o.jsxs("div", { className: "flex items-center", children: [
58
- /* @__PURE__ */ o.jsx(q, { disabled: !e(), size: "sm", onClick: n, className: "rounded-full", variant: "ghost", children: /* @__PURE__ */ o.jsx(ae, {}) }),
59
- /* @__PURE__ */ o.jsx(q, { disabled: !t(), onClick: r, size: "sm", className: "rounded-full", variant: "ghost", children: /* @__PURE__ */ o.jsx(ae, { className: "rotate-180 scale-y-[-1] transform" }) })
60
- ] });
61
- };
62
- function Zt() {
63
- const [e, t] = be(), { t: n } = Y();
64
- return /* @__PURE__ */ o.jsxs("div", { className: "flex items-center", children: [
65
- /* @__PURE__ */ o.jsx(nt, { htmlFor: "dark-mode-switch", children: n("dark_mode") }),
66
- /* @__PURE__ */ o.jsxs(
67
- ot,
68
- {
69
- id: "dark-mode-switch",
70
- checked: e,
71
- onCheckedChange: () => {
72
- t(!e);
73
- },
74
- className: `${e ? "bg-violet-600" : "bg-violet-300"}
75
- relative ml-2 inline-flex h-[20px] w-[40px] shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus-visible:ring-2 focus-visible:ring-white focus-visible:ring-opacity-75`,
76
- children: [
77
- /* @__PURE__ */ o.jsx("span", { className: "sr-only", children: n("use_setting") }),
78
- /* @__PURE__ */ o.jsx(
79
- "span",
80
- {
81
- "aria-hidden": "true",
82
- className: `${e ? "translate-x-5" : "translate-x-0"}
83
- pointer-events-none -mt-px inline-block h-[18px] w-[20px] transform rounded-full bg-white shadow-lg ring-0 transition duration-200 ease-in-out`
84
- }
85
- )
86
- ]
87
- }
88
- )
89
- ] });
90
- }
91
- const pe = ({ landscape: e = !1 }) => /* @__PURE__ */ o.jsxs(
92
- "svg",
93
- {
94
- className: e ? "rotate-90" : "",
95
- xmlns: "http://www.w3.org/2000/svg",
96
- viewBox: "0 0 13 13",
97
- xmlSpace: "preserve",
98
- width: 13,
99
- height: 13,
100
- children: [
101
- /* @__PURE__ */ o.jsx("g", { strokeWidth: 0 }),
102
- /* @__PURE__ */ o.jsx("g", { strokeLinecap: "round", strokeLinejoin: "round" }),
103
- /* @__PURE__ */ o.jsx(
104
- "path",
105
- {
106
- d: "M10.65 0H2.349a.851.851 0 0 0-.851.852v11.299c0 .47.382.852.851.852h8.3a.851.851 0 0 0 .851-.852V.852A.851.851 0 0 0 10.65 0zM6.599 12.466a.367.367 0 1 1 0-.735.367.367 0 0 1 0 .735zm3.9-1.267H2.5V1h8.001v10.199z",
107
- style: {
108
- fill: "#000"
109
- }
110
- }
111
- )
112
- ]
113
- }
114
- ), Gt = [
115
- {
116
- title: "mobile_xs_title",
117
- content: "mobile_xs_content",
118
- breakpoint: "xs",
119
- icon: /* @__PURE__ */ o.jsx(le, {}),
120
- width: 400
121
- },
122
- {
123
- title: "mobile_sm_title",
124
- content: "mobile_sm_content",
125
- breakpoint: "sm",
126
- icon: /* @__PURE__ */ o.jsx(le, { className: "rotate-90" }),
127
- width: 640
128
- },
129
- {
130
- title: "tablet_md_title",
131
- content: "tablet_md_content",
132
- breakpoint: "md",
133
- icon: /* @__PURE__ */ o.jsx(pe, {}),
134
- width: 800
135
- },
136
- {
137
- title: "tablet_lg_title",
138
- content: "tablet_lg_content",
139
- breakpoint: "lg",
140
- icon: /* @__PURE__ */ o.jsx(pe, { landscape: !0 }),
141
- width: 1024
142
- },
143
- {
144
- title: "desktop_xl_title",
145
- content: "desktop_xl_content",
146
- breakpoint: "xl",
147
- icon: /* @__PURE__ */ o.jsx(Ve, {}),
148
- width: 1420
149
- },
150
- {
151
- title: "large_desktop_2xl_title",
152
- content: "large_desktop_2xl_content",
153
- breakpoint: "2xl",
154
- icon: /* @__PURE__ */ o.jsx(Ye, {}),
155
- width: 1920
156
- }
157
- ], ue = ({
158
- title: e,
159
- content: t,
160
- currentBreakpoint: n,
161
- breakpoint: r,
162
- width: a,
163
- icon: i,
164
- onClick: c
165
- }) => {
166
- const { t: s } = Y();
167
- return /* @__PURE__ */ o.jsxs(st, { children: [
168
- /* @__PURE__ */ o.jsx(it, { asChild: !0, children: /* @__PURE__ */ o.jsx(
169
- q,
170
- {
171
- onClick: () => c(a),
172
- size: "sm",
173
- variant: r === n ? "secondary" : "ghost",
174
- children: i
175
- }
176
- ) }),
177
- /* @__PURE__ */ o.jsx(rt, { className: "w-52 border-border", children: /* @__PURE__ */ o.jsx("div", { className: "flex justify-between space-x-4", children: /* @__PURE__ */ o.jsxs("div", { className: "space-y-1", children: [
178
- /* @__PURE__ */ o.jsx("h4", { className: "text-sm font-semibold", children: s(e) }),
179
- /* @__PURE__ */ o.jsx("p", { className: "text-xs", children: s(t) })
180
- ] }) }) })
181
- ] });
182
- }, Xt = () => {
183
- const [, e, t] = te(), [n, r] = at(), { t: a } = Y(), i = V("breakpoints", Gt), c = (s) => {
184
- n.includes(s) ? n.length > 2 && r(n.filter((l) => l !== s)) : r((l) => [...l, s]);
185
- };
186
- return i.length < 4 ? /* @__PURE__ */ o.jsx("div", { className: "flex items-center rounded-md", children: O(i, (s) => /* @__PURE__ */ se(ue, { ...s, onClick: t, key: s.breakpoint, currentBreakpoint: e })) }) : /* @__PURE__ */ o.jsxs("div", { className: "flex items-center rounded-md", children: [
187
- O(
188
- i.filter((s) => re(n, Q(s.breakpoint))),
189
- (s) => /* @__PURE__ */ se(ue, { ...s, onClick: t, key: s.breakpoint, currentBreakpoint: e })
190
- ),
191
- /* @__PURE__ */ o.jsxs(lt, { children: [
192
- /* @__PURE__ */ o.jsx(ct, { asChild: !0, children: /* @__PURE__ */ o.jsx("span", { className: "cursor-pointer px-2.5 hover:opacity-80", children: /* @__PURE__ */ o.jsx(Je, { className: "scale-90 transform" }) }) }),
193
- /* @__PURE__ */ o.jsxs(dt, { className: "w-56 border-border text-xs", children: [
194
- /* @__PURE__ */ o.jsx(pt, { children: a("Breakpoints") }),
195
- /* @__PURE__ */ o.jsx(ut, {}),
196
- O(i, (s) => /* @__PURE__ */ o.jsx(
197
- ht,
198
- {
199
- disabled: s.breakpoint === "xs",
200
- onCheckedChange: () => c(Q(s.breakpoint)),
201
- checked: re(n, Q(s.breakpoint)),
202
- children: a(s.title)
203
- },
204
- s.breakpoint
205
- ))
206
- ] })
207
- ] })
208
- ] });
209
- }, en = () => {
210
- const { t: e } = Y(), { setNewBlocks: t } = mt(), [, n] = S(), [, r] = T(), a = K(() => {
211
- t([]), n([]), r([]);
212
- }, [t]);
213
- return /* @__PURE__ */ o.jsx("div", { className: "flex items-center", children: /* @__PURE__ */ o.jsxs(gt, { children: [
214
- /* @__PURE__ */ o.jsx(ft, { asChild: !0, children: /* @__PURE__ */ o.jsxs(q, { size: "sm", variant: "ghost", className: "flex items-center gap-x-1", children: [
215
- /* @__PURE__ */ o.jsx(Qe, {}),
216
- " ",
217
- e("clear")
218
- ] }) }),
219
- /* @__PURE__ */ o.jsxs(xt, { className: "border-border", children: [
220
- /* @__PURE__ */ o.jsxs(yt, { children: [
221
- /* @__PURE__ */ o.jsx(vt, { children: e("clear_canvas_title") }),
222
- /* @__PURE__ */ o.jsx(bt, { children: e("clear_canvas_description") })
223
- ] }),
224
- /* @__PURE__ */ o.jsxs(kt, { children: [
225
- /* @__PURE__ */ o.jsx(wt, { children: e("cancel") }),
226
- /* @__PURE__ */ o.jsx(jt, { onClick: a, children: e("yes") })
227
- ] })
228
- ] })
229
- ] }) });
230
- }, tn = () => {
231
- const e = V("darkMode", !1), [t] = ke();
232
- return /* @__PURE__ */ o.jsxs("div", { className: "flex h-10 items-center justify-between border-b bg-background/70 px-2", children: [
233
- /* @__PURE__ */ o.jsxs("div", { className: "flex h-full space-x-2", children: [
234
- e ? /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
235
- /* @__PURE__ */ o.jsx(Zt, {}),
236
- /* @__PURE__ */ o.jsx(U, { orientation: "vertical" })
237
- ] }) : null,
238
- /* @__PURE__ */ o.jsx(Xt, {}),
239
- /* @__PURE__ */ o.jsx(U, { orientation: "vertical" }),
240
- /* @__PURE__ */ o.jsxs("div", { className: "flex w-12 items-center justify-center gap-x-1 space-x-0 font-medium", children: [
241
- /* @__PURE__ */ o.jsx(Ze, { className: "h-3.5 w-3.5 flex-shrink-0" }),
242
- " ",
243
- /* @__PURE__ */ o.jsxs("div", { className: "text-xs leading-3", children: [
244
- Oe(t, 0),
245
- "%"
246
- ] })
247
- ] }),
248
- /* @__PURE__ */ o.jsx(U, { orientation: "vertical" }),
249
- /* @__PURE__ */ o.jsx(Qt, {})
250
- ] }),
251
- /* @__PURE__ */ o.jsxs("div", { className: "flex h-full items-center space-x-2", children: [
252
- /* @__PURE__ */ o.jsx(U, { orientation: "vertical" }),
253
- /* @__PURE__ */ o.jsx(en, {})
254
- ] })
255
- ] });
256
- }, nn = `<!doctype html>
257
- <html class="scroll-smooth h-full overflow-y-auto">
258
- <head>
259
- <meta charset="UTF-8">
260
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
261
- <script src="https://cdn.tailwindcss.com?plugins=forms,typography,aspect-ratio"><\/script>
262
- <style>
263
- html { height: 100%; overflow:auto; }
264
- body { height: 100%; }
265
- .air-highlight{ outline: 1px solid #42a1fc !important; outline-offset: -1px;}
266
- .air-highlight-multi{ outline: 1px solid #29e503 !important; outline-offset: -1px;}
267
- body{ -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none;
268
- -moz-user-select: none;-ms-user-select: none; user-select: none; }
269
- html{
270
- -ms-overflow-style: none; /* IE and Edge */
271
- scrollbar-width: none; /* Firefox */
272
- }
273
- /** IMPORTANT: Make fields content editable in SAFARI */
274
- [contenteditable] {-webkit-user-select: text;user-select: text;}
275
-
276
- html::-webkit-scrollbar { width: 0 !important }
277
- .aspect-auto{aspect-ratio: auto;}
278
- .aspect-square{aspect-ratio: 1/1;}
279
- .aspect-video{aspect-ratio: 16/9;}
280
- .dragging [data-dnd="leaf"] { pointer-events: none; } .dragging [data-dnd="leaf"] * { pointer-events: none; }
281
- .dragging [data-dnd="ignore"], .dragging [data-dnd="ignore"] * { pointer-events: none; }
282
- a{ pointer-events: none !important; }
283
- [contenteditable="true"], [contenteditable="true"] * { cursor: text !important; }
284
- [contenteditable="true"] {
285
- outline: none;
286
- box-shadow: 0 0 0px 4px rgba(36, 150, 255, 0.2);
287
- -webkit-user-select: text;
288
- -moz-user-select: text;
289
- user-select: text;
290
- }
291
- .frame-root .frame-content { height: 100%; }
292
- </style>
293
- <style id="hidden-blocks"></style>
294
- <style id="selected-block"></style>
295
- <style id="selected-styling-block"></style>
296
- <style id="highlighted-block"></style>
297
- <style id="dragged-block"></style>
298
-
299
- </head>
300
- <body class="font-body antialiased h-full">
301
- <div class="frame-root h-full"></div>
302
- <script src="https://cdn.jsdelivr.net/npm/quill@2.0.0/dist/quill.js"><\/script>
303
- </body>
304
- </html>`, on = (e) => {
305
- const [t] = te(), [, n] = ke(), [r, a] = I({}), i = K(() => {
306
- const { width: c, height: s } = e;
307
- if (c < t) {
308
- const l = parseFloat((c / t).toFixed(2).toString());
309
- let d = {};
310
- const p = s * l;
311
- s && (d = {
312
- // Eureka! This is the formula to calculate the height of the scaled element. Thank you ChatGPT 4
313
- height: 100 + (s - p) / p * 100 + "%"
314
- }), a({
315
- position: "relative",
316
- top: 0,
317
- transform: `scale(${l})`,
318
- transformOrigin: "top left",
319
- ...d,
320
- maxWidth: "none"
321
- }), n(l * 100);
322
- } else
323
- a({}), n(100);
324
- }, [t, e, n]);
325
- return j(() => {
326
- i();
327
- }, [t, e, n, i]), r;
328
- };
329
- let _e, Ne;
330
- typeof document < "u" && (_e = document);
331
- typeof window < "u" && (Ne = window);
332
- const Ae = M.createContext({ document: _e, window: Ne }), J = () => M.useContext(Ae), { Provider: sn, Consumer: No } = Ae;
333
- class Ee extends me {
334
- componentDidMount() {
335
- this.props.contentDidMount();
336
- }
337
- componentDidUpdate() {
338
- this.props.contentDidUpdate();
339
- }
340
- render() {
341
- return Fe.only(this.props.children);
342
- }
343
- }
344
- E(Ee, "propTypes", {
345
- children: w.element.isRequired,
346
- contentDidMount: w.func.isRequired,
347
- contentDidUpdate: w.func.isRequired
348
- });
349
- class G extends me {
350
- constructor(n, r) {
351
- super(n, r);
352
- E(this, "setRef", (n) => {
353
- this.nodeRef.current = n;
354
- const { forwardedRef: r } = this.props;
355
- typeof r == "function" ? r(n) : r && (r.current = n);
356
- });
357
- E(this, "handleLoad", () => {
358
- clearInterval(this.loadCheck), this.state.iframeLoaded || this.setState({ iframeLoaded: !0 });
359
- });
360
- // In certain situations on a cold cache DOMContentLoaded never gets called
361
- // fallback to an interval to check if that's the case
362
- E(this, "loadCheck", () => setInterval(() => {
363
- this.handleLoad();
364
- }, 500));
365
- this._isMounted = !1, this.nodeRef = M.createRef(), this.state = { iframeLoaded: !1 };
366
- }
367
- componentDidMount() {
368
- this._isMounted = !0, this.getDoc() && this.nodeRef.current.contentWindow.addEventListener("DOMContentLoaded", this.handleLoad);
369
- }
370
- componentWillUnmount() {
371
- this._isMounted = !1, this.nodeRef.current.removeEventListener("DOMContentLoaded", this.handleLoad);
372
- }
373
- getDoc() {
374
- return this.nodeRef.current ? this.nodeRef.current.contentDocument : null;
375
- }
376
- getMountTarget() {
377
- const n = this.getDoc();
378
- return this.props.mountTarget ? n.querySelector(this.props.mountTarget) : n.body.children[0];
379
- }
380
- renderFrameContents() {
381
- if (!this._isMounted)
382
- return null;
383
- const n = this.getDoc();
384
- if (!n)
385
- return null;
386
- const r = this.props.contentDidMount, a = this.props.contentDidUpdate, i = n.defaultView || n.parentView, c = /* @__PURE__ */ o.jsx(Ee, { contentDidMount: r, contentDidUpdate: a, children: /* @__PURE__ */ o.jsx(sn, { value: { document: n, window: i }, children: /* @__PURE__ */ o.jsx("div", { className: "frame-content", children: this.props.children }) }) }), s = this.getMountTarget();
387
- return [ce.createPortal(this.props.head, this.getDoc().head), ce.createPortal(c, s)];
388
- }
389
- render() {
390
- const n = {
391
- ...this.props,
392
- srcDoc: this.props.initialContent,
393
- children: void 0
394
- // The iframe isn't ready so we drop children from props here. #12, #17
395
- };
396
- return delete n.head, delete n.initialContent, delete n.mountTarget, delete n.contentDidMount, delete n.contentDidUpdate, delete n.forwardedRef, /* @__PURE__ */ o.jsx("iframe", { ...n, ref: this.setRef, onLoad: this.handleLoad, children: this.state.iframeLoaded && this.renderFrameContents() });
397
- }
398
- }
399
- // React warns when you render directly into the body since browser extensions
400
- // also inject into the body and can mess up React. For this reason
401
- // initialContent is expected to have a div inside of the body
402
- // element that we render react into.
403
- E(G, "propTypes", {
404
- style: w.object,
405
- // eslint-disable-line
406
- head: w.node,
407
- initialContent: w.string,
408
- mountTarget: w.string,
409
- contentDidMount: w.func,
410
- contentDidUpdate: w.func,
411
- children: w.oneOfType([w.element, w.arrayOf(w.element)])
412
- }), E(G, "defaultProps", {
413
- style: {},
414
- head: null,
415
- children: void 0,
416
- mountTarget: void 0,
417
- contentDidMount: () => {
418
- },
419
- contentDidUpdate: () => {
420
- },
421
- initialContent: '<!DOCTYPE html><html><head></head><body><div class="frame-root"></div></body></html>'
422
- });
423
- const rn = M.forwardRef((e, t) => /* @__PURE__ */ o.jsx(G, { ...e, forwardedRef: t })), an = () => {
424
- const { addCoreBlock: e } = Ct(), t = V("getExternalPredefinedBlock", $);
425
- return K(
426
- async (n) => {
427
- const { block: r, dropTargetId: a, relativeIndex: i } = n;
428
- if (fe(r, "format")) {
429
- const c = await t(r);
430
- return e({ blocks: c }, a === 0 ? null : a, i);
431
- }
432
- return e(r, a === 0 ? null : a, i);
433
- },
434
- [e]
435
- );
436
- };
437
- let _ = null, H = [], P = null, Me = null;
438
- function ln(e) {
439
- const t = window.getComputedStyle(e), n = parseInt(t.paddingLeft, 10), r = parseInt(t.paddingTop, 10), a = parseInt(t.paddingRight, 10), i = parseInt(t.paddingBottom, 10);
440
- return { paddingLeft: n, paddingTop: r, paddingRight: a, paddingBottom: i };
441
- }
442
- const he = (e, t, n) => {
443
- if (!_)
444
- return;
445
- const r = e.getBoundingClientRect(), a = _ == null ? void 0 : _.getElementById("placeholder"), { paddingLeft: i, paddingTop: c, paddingRight: s, paddingBottom: l } = ln(e);
446
- a.style.width = t === "vertical" ? r.width - i - s + "px" : "2px", a.style.height = t === "vertical" ? "2px" : r.height - c - l + "px", a.style.display = "block";
447
- const d = H.reduce(
448
- (p, m) => Math.abs(m - n) < Math.abs(p - n) ? m : p
449
- );
450
- Me = H.indexOf(d), t === "vertical" ? (a.style.top = e.offsetTop + d + "px", a.style.left = e.offsetLeft + i + "px") : (a.style.top = e.offsetTop + c + "px", a.style.left = e.offsetLeft + d + "px");
451
- }, cn = (e) => {
452
- const t = Te(e), n = window.getComputedStyle(e), r = t === "horizontal", a = parseInt(n.paddingLeft), i = parseInt(n.paddingTop);
453
- let c = r ? a : i;
454
- H = [c], Array.from(e.children).forEach((s) => {
455
- const l = window.getComputedStyle(s), d = parseInt(
456
- r ? l.marginLeft + l.marginRight : l.marginTop + l.marginBottom
457
- ), p = r ? s.offsetWidth : s.offsetHeight;
458
- H.push(c + p + d), c += p + d;
459
- });
460
- };
461
- function Te(e) {
462
- const t = window.getComputedStyle(e).display, n = window.getComputedStyle(e).flexDirection;
463
- if (t === "flex")
464
- return n === "column" || n === "column-reverse" ? "vertical" : "horizontal";
465
- if (t === "grid") {
466
- const r = window.getComputedStyle(e).gridTemplateRows, a = window.getComputedStyle(e).gridTemplateColumns;
467
- if (r.includes("auto"))
468
- return "vertical";
469
- if (a.includes("auto"))
470
- return "horizontal";
471
- }
472
- return t === "block" ? "vertical" : "horizontal";
473
- }
474
- const dn = xe((e) => {
475
- const t = e.target, n = Te(t);
476
- if (n === "vertical") {
477
- const r = e.clientY - t.offsetTop;
478
- he(t, n, r);
479
- } else {
480
- const r = e.clientX - t.offsetLeft;
481
- he(t, n, r);
482
- }
483
- }, 200), pn = (e) => {
484
- e.preventDefault(), e.stopPropagation(), dn(e);
485
- };
486
- function Z() {
487
- const e = _ == null ? void 0 : _.getElementById("placeholder");
488
- e.style.display = "none";
489
- }
490
- const un = () => {
491
- const { document: e } = J(), [t, n] = C(Bt), r = an(), a = Ie("dnd"), [, i] = L(), [, c] = S();
492
- return _ = e, {
493
- isDragging: t,
494
- "data-dnd": "branch",
495
- onDragOver: a ? pn : $,
496
- onDrop: a ? (s) => {
497
- P == null || P.classList.remove("outline", "outline-green-300", "outline-2", "-outline-offset-2");
498
- const l = JSON.parse(s.dataTransfer.getData("text/plain"));
499
- let d = s.target.getAttribute("data-block-id");
500
- d === null && (d = s.target.parentElement.getAttribute("data-block-id")), r({ block: l, dropTargetId: d || null, relativeIndex: Me }), n(!1), Z(), setTimeout(() => {
501
- Z();
502
- }, 300);
503
- } : $,
504
- onDragEnter: a ? (s) => {
505
- const l = s;
506
- P = l.target, l.stopPropagation(), l.preventDefault(), H = [];
507
- const d = l.target;
508
- cn(d), d.classList.add("outline", "outline-green-300", "outline-2", "-outline-offset-2"), n(!0), i(""), c([]);
509
- } : $,
510
- onDragLeave: a ? (s) => {
511
- const l = s;
512
- P = null, l.stopPropagation(), l.preventDefault(), l.target.classList.remove("outline", "outline-green-300", "outline-2", "-outline-offset-2");
513
- } : $,
514
- onMouseOut: a ? () => {
515
- n(!1), Z();
516
- } : $
517
- };
518
- };
519
- function oe(e) {
520
- return e.getAttribute("data-block-id") ? e : e.closest("[data-block-id]");
521
- }
522
- function hn(e) {
523
- e.container.innerHTML = "", e.container.parentNode.removeChild(e.container);
524
- var t = document.querySelector(".ql-toolbar");
525
- t && t.parentNode.removeChild(t), e = null;
526
- }
527
- const mn = () => {
528
- const e = ["Heading", "Paragraph", "Text", "Link", "Span", "Button"], t = Dt(), [, n] = L(), [r, a] = C(F);
529
- return (i) => {
530
- var m;
531
- if (r)
532
- return;
533
- const c = oe(i.target), s = c.getAttribute("data-block-type");
534
- if (!s || !e.includes(s))
535
- return;
536
- const l = c.cloneNode(!0);
537
- c.style.display = "none", Array.from(l.attributes).forEach((g) => {
538
- g.name !== "class" && l.removeAttribute(g.name);
539
- }), s === "Text" && (l.style.display = "inline-block"), c.parentNode.insertBefore(l, c.nextSibling);
540
- const d = new Lt(l, { placeholder: "Type here..." });
541
- function p() {
542
- const g = d.getText(0, d.getLength());
543
- t([c.getAttribute("data-block-id")], { content: g }), c.removeAttribute("style"), l.removeEventListener("blur", p, !0), hn(d), a(""), n("");
544
- }
545
- l.addEventListener("blur", p, !0), d.focus(), (m = l.querySelector(".ql-clipboard")) == null || m.remove(), a(c.getAttribute("data-block-id"));
546
- };
547
- }, gn = () => {
548
- const [, e] = T(), [, t] = S(), [, n] = L(), [r] = C(F);
549
- return (a) => {
550
- if (r)
551
- return;
552
- a.stopPropagation();
553
- const i = oe(a.target);
554
- if (i != null && i.getAttribute("data-block-id") && (i == null ? void 0 : i.getAttribute("data-block-id")) === "container") {
555
- t([]), e([]), n("");
556
- return;
557
- }
558
- if (i != null && i.getAttribute("data-block-parent")) {
559
- const c = i.getAttribute("data-style-prop"), s = i.getAttribute("data-style-id"), l = i.getAttribute("data-block-parent");
560
- e([{ id: s, prop: c, blockId: l }]), t([l]);
561
- } else
562
- i != null && i.getAttribute("data-block-id") && t([i.getAttribute("data-block-id")]);
563
- n("");
564
- };
565
- }, fn = xe((e, t) => {
566
- const n = oe(e.target);
567
- n != null && n.getAttribute("data-style-id") && t(n.getAttribute("data-style-id"));
568
- }, 100), xn = () => {
569
- const [, e] = L(), [t] = C(F);
570
- return (n) => {
571
- t || fn(n, e);
572
- };
573
- }, yn = ({ children: e }) => {
574
- const { document: t } = J(), [n] = S(), [r, a] = T();
575
- j(() => {
576
- setTimeout(() => {
577
- if (!N(r))
578
- return;
579
- const d = Le(t, W(n));
580
- if (d) {
581
- const p = d.getAttribute("data-style-prop");
582
- if (p) {
583
- const m = d.getAttribute("data-style-id"), g = d.getAttribute("data-block-parent");
584
- a([{ id: m, prop: p, blockId: g }]);
585
- }
586
- }
587
- }, 100);
588
- }, [t, n, a, r]);
589
- const i = mn(), c = gn(), s = xn(), l = un();
590
- return /* @__PURE__ */ o.jsx(
591
- "div",
592
- {
593
- "data-block-id": "container",
594
- id: "canvas",
595
- onClick: c,
596
- onDoubleClick: i,
597
- onMouseMove: s,
598
- ...He(l, "isDragging"),
599
- className: "relative mb-5 h-full max-w-full " + (l.isDragging ? "dragging" : ""),
600
- children: e
601
- }
602
- );
603
- }, Le = (e, t) => e.querySelector(`[data-block-id="${t}"]`), vn = () => {
604
- const { window: e } = J(), [t, n] = S(), [r] = ne(), [, a] = T(), { undo: i, redo: c } = ve(), s = we(), [, l] = je(), d = Ce(), { savePage: p } = It(), [m] = C(F), [, g] = C(St), k = (f) => {
605
- f.key === "Enter" && (f.preventDefault(), t.length === 1 && g(W(t)));
606
- }, B = (f) => {
607
- const h = r.find((b) => b._id === f);
608
- return h ? h._parent : null;
609
- };
610
- return j(() => {
611
- const f = (h) => {
612
- if (h.key === "Escape") {
613
- n([]), a([]);
614
- return;
615
- }
616
- if (k(h), !m && (h.key === "Delete" || h.key === "Backspace") && (h.preventDefault(), d(t)), h.ctrlKey || h.metaKey) {
617
- if (h.key === "ArrowUp") {
618
- h.preventDefault();
619
- const b = t.length > 0 ? B(t[0]) : null;
620
- b && n([b]);
621
- }
622
- if (["z", "y", "d", "x", "c", "p", "s", "v"].includes(h.key)) {
623
- if (m && ["x", "z", "v"].includes(h.key))
624
- return !0;
625
- h.preventDefault();
626
- }
627
- h.key === "s" && (h.stopPropagation(), h.preventDefault(), p()), h.key === "z" && i(), h.key === "y" && c(), h.key === "d" && s(t);
628
- }
629
- };
630
- return e.removeEventListener("keydown", f), e.addEventListener("keydown", f), () => {
631
- e.removeEventListener("keydown", f);
632
- };
633
- }, [t, n, i, d, l, c, s, m, p, e]), null;
634
- }, bn = ({ block: e, label: t }) => {
635
- const [, n] = S(), [, r] = L(), [, a] = C(Be), i = Ie("dnd");
636
- return /* @__PURE__ */ o.jsxs(
637
- "div",
638
- {
639
- className: "mr-10 flex cursor-grab items-center space-x-1 px-1",
640
- draggable: i ? "true" : "false",
641
- onDragStart: (c) => {
642
- c.dataTransfer.setData("text/plain", JSON.stringify(ze(e, ["_id", "_type"]))), a(e._id), setTimeout(() => {
643
- n([]), r(null);
644
- }, 200);
645
- },
646
- children: [
647
- /* @__PURE__ */ o.jsx(Ge, {}),
648
- t
649
- ]
650
- }
651
- );
652
- }, kn = ({ selectedBlockElement: e, block: t }) => {
653
- const n = Ce(), r = we(), [, a] = S(), [, i] = T(), [c] = C(F), { floatingStyles: s, refs: l, update: d } = $t({
654
- placement: "top-start",
655
- middleware: [Ft(), Rt()],
656
- elements: {
657
- reference: e
658
- }
659
- });
660
- Pt(e, () => d(), e !== null);
661
- const p = y(t, "_parent", null), m = N(y(t, "_name", "")) ? y(t, "_type", "") : y(t, "_name", "");
662
- return !e || !t || c ? null : /* @__PURE__ */ o.jsxs(
663
- "div",
664
- {
665
- role: "button",
666
- tabIndex: 0,
667
- ref: l.setFloating,
668
- style: s,
669
- onClick: (g) => {
670
- g.stopPropagation(), g.preventDefault();
671
- },
672
- onKeyDown: (g) => g.stopPropagation(),
673
- className: "z-[99999] flex h-6 items-center bg-blue-500 py-2 text-xs text-white",
674
- children: [
675
- /* @__PURE__ */ o.jsx(bn, { label: m, block: t }),
676
- /* @__PURE__ */ o.jsxs("div", { className: "flex gap-2 px-1", children: [
677
- p && /* @__PURE__ */ o.jsx(
678
- Xe,
679
- {
680
- className: "hover:scale-105",
681
- onClick: () => {
682
- i([]), a([p]);
683
- }
684
- }
685
- ),
686
- _t(y(t, "_type", "")) ? /* @__PURE__ */ o.jsx(et, { className: "hover:scale-105", onClick: () => r([t == null ? void 0 : t._id]) }) : null,
687
- Nt(y(t, "_type", "")) ? /* @__PURE__ */ o.jsx(tt, { className: "hover:scale-105", onClick: () => n([t == null ? void 0 : t._id]) }) : null
688
- ] })
689
- ]
690
- }
691
- );
692
- }, wn = ({ model: e }) => {
693
- const [t] = At(), [n] = S(), [r] = be(), [a] = L(), [i] = T(), [c] = C(Be), { document: s, window: l } = J(), [d] = I(s == null ? void 0 : s.getElementById("highlighted-block")), [p] = I(
694
- s == null ? void 0 : s.getElementById("selected-block")
695
- ), [m] = I(
696
- s == null ? void 0 : s.getElementById("selected-styling-block")
697
- ), [g] = I(s == null ? void 0 : s.getElementById("dragged-block"));
698
- j(() => {
699
- r ? s == null || s.documentElement.classList.add("dark") : s == null || s.documentElement.classList.remove("dark");
700
- }, [r, s]);
701
- const k = y(t, "headingFont", "DM Sans"), B = y(t, "bodyFont", "DM Sans");
702
- return j(() => {
703
- const f = y(t, "primaryColor", "#000"), h = y(t, "secondaryColor", "#FFF"), b = Ot({
704
- colors: [f, h],
705
- names: ["primary", "secondary"]
706
- });
707
- b.primary.DEFAULT = f, b.secondary.DEFAULT = h;
708
- const R = y(t, "roundedCorners", "0");
709
- !l || !l.tailwind || (l.tailwind.config = {
710
- darkMode: "class",
711
- theme: {
712
- fontFamily: {
713
- heading: [k],
714
- body: [B]
715
- },
716
- extend: {
717
- borderRadius: {
718
- global: `${R || "0"}px`
719
- },
720
- colors: b
721
- }
722
- },
723
- plugins: [
724
- Ht,
725
- zt,
726
- Ut,
727
- l.tailwind.plugin.withOptions(() => ({ addVariant: z, e: D }) => {
728
- z("hs-accordion-active", [
729
- ({ modifySelectors: v, separator: u }) => {
730
- v(({ className: x }) => `.hs-accordion.active.${D(`hs-accordion-active${u}${x}`)}`);
731
- },
732
- ({ modifySelectors: v, separator: u }) => {
733
- v(({ className: x }) => `.hs-accordion.active > .${D(`hs-accordion-active${u}${x}`)}`);
734
- },
735
- ({ modifySelectors: v, separator: u }) => {
736
- v(({ className: x }) => `.hs-accordion.active > .hs-accordion-toggle .${D(
737
- `hs-accordion-active${u}${x}`
738
- )}`);
739
- },
740
- ({ modifySelectors: v, separator: u }) => {
741
- v(({ className: x }) => `.hs-accordion.active > .hs-accordion-heading > .hs-accordion-toggle .${D(
742
- `hs-accordion-active${u}${x}`
743
- )}`);
744
- },
745
- ({ modifySelectors: v, separator: u }) => {
746
- v(({ className: x }) => `.hs-accordion.active > .hs-accordion-toggle.${D(
747
- `hs-accordion-active${u}${x}`
748
- )}`);
749
- },
750
- ({ modifySelectors: v, separator: u }) => {
751
- v(({ className: x }) => `.hs-accordion.active > .hs-accordion-heading > .hs-accordion-toggle.${D(
752
- `hs-accordion-active${u}${x}`
753
- )}`);
754
- }
755
- ]), z("hs-accordion-selected", ({ modifySelectors: v, separator: u }) => {
756
- v(({ className: x }) => `.hs-accordion .selected.${D(`hs-accordion-selected${u}${x}`)}`);
757
- });
758
- })
759
- ]
760
- });
761
- }, [t, l, k, B]), j(() => {
762
- p && (p.textContent = `${O(n, (f) => `[data-block-id="${f}"]`).join(",")}{
763
- outline: 1px solid ${n.length === 1 ? "#42a1fc" : "orange"} !important; outline-offset: -1px;
764
- }`);
765
- }, [n, p]), j(() => {
766
- if (!c) {
767
- g.textContent = "";
768
- return;
769
- }
770
- g.textContent = `[data-block-id="${c}"]{ pointer-events: none !important; opacity: 0.2 !important}`;
771
- }, [c]), j(() => {
772
- d && (d.textContent = a ? `[data-style-id="${a}"]{ outline: 1px solid #42a1fc !important; outline-offset: -1px;}` : "");
773
- }, [a, n, d]), j(() => {
774
- m && (m.textContent = `${O(i, ({ id: f }) => `[data-style-id="${f}"]`).join(",")}{
775
- outline: 1px solid #42a1fc !important; outline-offset: -1px;
776
- }`);
777
- }, [i, m]), j(() => {
778
- const f = y(t, "bodyTextLightColor", "#64748b"), h = y(t, "bodyTextDarkColor", "#94a3b8"), b = y(t, "bodyBgLightColor", "#FFFFFF"), R = y(t, "bodyBgDarkColor", "#0f172a");
779
- s.body.className = `font-body antialiased text-[${f}] bg-[${b}] dark:text-[${h}] dark:bg-[${R}]`;
780
- }, [t, s, e]), e === "page" ? /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
781
- k && /* @__PURE__ */ o.jsx(
782
- "link",
783
- {
784
- id: "heading-font",
785
- rel: "stylesheet",
786
- type: "text/css",
787
- href: `https://fonts.googleapis.com/css2?family=${k.replace(
788
- / /g,
789
- "+"
790
- )}:wght@300;400;500;600;700;800;900&display=swap`,
791
- media: "all"
792
- }
793
- ),
794
- B && k !== B && /* @__PURE__ */ o.jsx(
795
- "link",
796
- {
797
- id: "body-font",
798
- rel: "stylesheet",
799
- type: "text/css",
800
- href: `https://fonts.googleapis.com/css2?family=${B.replace(
801
- / /g,
802
- "+"
803
- )}:wght@300;400;500;600;700;800;900&display=swap`,
804
- media: "all"
805
- }
806
- ),
807
- k && /* @__PURE__ */ o.jsx("style", { children: `h1,h2,h3,h4,h5,h6{font-family: "${k}",ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";}` })
808
- ] }) : null;
809
- }, jn = (e) => {
810
- const t = {};
811
- return Object.keys(e).forEach((n) => {
812
- ee(e[n]) && e[n].startsWith(de) && (t[n] = e[n].replace(de, "").split(","));
813
- }), t;
814
- }, Cn = Ue((e) => {
815
- const t = e.replace(Se, "").split(",");
816
- return qt(t[0], t[1]);
817
- });
818
- function Bn(e, t) {
819
- return y(e, `${t}_attrs`, {});
820
- }
821
- function Dn(e) {
822
- const t = {};
823
- return Object.keys(e).forEach((n) => {
824
- if (ee(e[n]) && e[n].startsWith(Se)) {
825
- const r = Cn(e[n]);
826
- t[n] = {
827
- className: r,
828
- "data-style-prop": n,
829
- "data-block-parent": e._id,
830
- "data-style-id": `${n}-${e._id}`,
831
- ...Bn(e, n)
832
- };
833
- }
834
- }), t;
835
- }
836
- function In(e, t) {
837
- const n = y(e, "_bindings", {});
838
- return N(n) ? { ...e } : (We(n, (r, a) => {
839
- ee(r) && y(t, r, null) && (e[a] = y(t, r, null));
840
- }), e);
841
- }
842
- function X({ blocks: e }) {
843
- const [t] = ne(), n = K((i) => Dn(i), []), [r] = Vt(), [a] = C(F);
844
- return /* @__PURE__ */ o.jsx(o.Fragment, { children: M.Children.toArray(
845
- e.map((i, c) => {
846
- if (a === i._id)
847
- return null;
848
- const s = jn(i), l = {};
849
- N(s) || Object.keys(s).forEach((g) => {
850
- l[g] = M.Children.toArray(
851
- s[g].map((k) => /* @__PURE__ */ o.jsx(X, { blocks: [qe(t, { _id: k })] }))
852
- );
853
- });
854
- const d = ye(t, { _parent: i._id });
855
- l.children = d.length ? /* @__PURE__ */ o.jsx(X, { blocks: d }) : null;
856
- const p = Kt(i._type), m = y(p, "builderComponent", y(p, "component", null));
857
- return Ke(m) ? /* @__PURE__ */ o.jsx("noscript", { children: `<!-- ${i == null ? void 0 : i._type} not registered -->` }) : /* @__PURE__ */ o.jsx(ge, { children: M.createElement(m, {
858
- blockProps: {
859
- "data-block-id": i._id,
860
- "data-block-type": i._type,
861
- "data-dnd": fe(p, "canAcceptBlock") ? "branch" : "leaf"
862
- },
863
- inBuilder: !0,
864
- index: c,
865
- ...In(i, r),
866
- ...n(i),
867
- ...l
868
- }) });
869
- })
870
- ) });
871
- }
872
- const Sn = () => {
873
- const [e] = ne(), t = N(e) ? null : /* @__PURE__ */ o.jsx(Yt, { children: /* @__PURE__ */ o.jsx(X, { blocks: ye(e, (n) => N(n._parent)) }) });
874
- return /* @__PURE__ */ o.jsx(Wt, { children: t });
875
- }, _n = (e, t) => e.querySelector(`[data-style-id="${t}"]`), Nn = () => {
876
- const [e] = C(Et), [t] = je(), [n] = te(), [, r] = S(), a = Mt(), [, i] = L(), c = ie(null), s = ie(null), [l, d] = I({ width: 0, height: 0 }), p = on(l), [m, g] = I(0), [k, B] = I([]), [, f] = I([]), [, h] = C(Tt), [b, R] = T(), z = V("loading", !1);
877
- j(() => {
878
- const { clientWidth: u, clientHeight: x } = s.current;
879
- d({ width: u, height: x }), m === 0 && g(u);
880
- }, [s, n, m]);
881
- const D = (u, x = 0) => {
882
- const { top: A } = u.getBoundingClientRect();
883
- return A + x >= 0 && A - x <= window.innerHeight;
884
- };
885
- j(() => {
886
- var u, x;
887
- if (a && a.type !== "Multiple" && c.current) {
888
- const A = Le(c.current.contentDocument, a._id);
889
- A && (D(A) || (x = (u = c.current) == null ? void 0 : u.contentWindow) == null || x.scrollTo({ top: A.offsetTop, behavior: "smooth" }), B([A]));
890
- }
891
- }, [a]), j(() => {
892
- if (!N(b) && c.current) {
893
- const u = _n(
894
- c.current.contentDocument,
895
- W(b).id
896
- );
897
- f(u ? [u] : [null]);
898
- } else
899
- f([null]);
900
- }, [b]);
901
- const v = Pe(() => {
902
- let u = nn;
903
- return e === "offline" && (u = u.replace(
904
- "https://old.chaibuilder.com/offline/tailwind.cdn.js",
905
- "/offline/tailwind.cdn.js"
906
- ), u = u.replace("https://unpkg.com/aos@next/dist/aos.css", "/offline/aos.css"), u = u.replace("https://unpkg.com/aos@next/dist/aos.js", "/offline/aos.js")), u;
907
- }, [e]);
908
- return /* @__PURE__ */ o.jsx(
909
- "div",
910
- {
911
- onClick: () => {
912
- r([]), R([]);
913
- },
914
- onMouseLeave: () => setTimeout(() => i(""), 300),
915
- className: "relative mx-auto h-full w-full overflow-hidden",
916
- style: m > 0 && !N(p) ? { width: t ? "100%" : m } : {},
917
- ref: s,
918
- children: /* @__PURE__ */ o.jsxs(
919
- rn,
920
- {
921
- contentDidMount: () => h(c.current),
922
- ref: c,
923
- id: "canvas-iframe",
924
- style: { width: `${n}px`, ...p },
925
- className: "relative mx-auto box-content h-full max-w-full shadow-lg transition-all duration-300 ease-linear",
926
- initialContent: v,
927
- children: [
928
- /* @__PURE__ */ o.jsx(vn, {}),
929
- /* @__PURE__ */ o.jsx(
930
- kn,
931
- {
932
- block: a,
933
- selectedBlockElement: W(k)
934
- }
935
- ),
936
- /* @__PURE__ */ o.jsx(wn, { model: "page" }),
937
- /* @__PURE__ */ o.jsx(yn, { children: z ? /* @__PURE__ */ o.jsx("div", { className: "h-full p-4", children: /* @__PURE__ */ o.jsx(De, { className: "h-full" }) }) : /* @__PURE__ */ o.jsx(Sn, {}) }),
938
- /* @__PURE__ */ o.jsx("br", {}),
939
- /* @__PURE__ */ o.jsx("div", { id: "placeholder", className: "absolute z-[99999] max-w-full bg-green-500 transition-transform" })
940
- ]
941
- }
942
- )
943
- }
944
- );
945
- }, Ao = () => /* @__PURE__ */ o.jsxs("div", { className: "flex h-full w-full flex-col", children: [
946
- /* @__PURE__ */ o.jsx(tn, {}),
947
- /* @__PURE__ */ o.jsx("div", { className: "relative h-full overflow-hidden bg-slate-800/90 bg-[linear-gradient(to_right,#222_0.5px,transparent_0.5px),linear-gradient(to_bottom,#222_0.5px,transparent_0.5px)] bg-[size:12px_12px] px-2", children: /* @__PURE__ */ o.jsx(ge, { fallback: /* @__PURE__ */ o.jsx(De, { className: "h-full" }), children: /* @__PURE__ */ o.jsx(Jt, { children: /* @__PURE__ */ o.jsx(Nn, {}) }) }) })
948
- ] });
949
- export {
950
- Ao as default
951
- };