@chaibuilder/sdk 1.2.32 → 1.2.34

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 (103) hide show
  1. package/dist/{AddBlocks-0eVRNr1d.js → AddBlocks-RmEkZXdE.js} +37 -33
  2. package/dist/AddBlocks-XYCWUol8.cjs +1 -0
  3. package/dist/{BrandingOptions-yYAznnw2.js → BrandingOptions-TnzCIC7A.js} +37 -31
  4. package/dist/BrandingOptions-qnaKl27s.cjs +1 -0
  5. package/dist/CanvasArea-SeSRWHy0.js +1200 -0
  6. package/dist/CanvasArea-iIwERFUC.cjs +55 -0
  7. package/dist/ChaiBuilderEditor-YqEKonJ_.cjs +206 -0
  8. package/dist/{index-AJalHhkO.js → ChaiBuilderEditor-y1NxvXJ7.js} +24114 -20836
  9. package/dist/{CurrentPage-1v40uk8K.js → CurrentPage-9KDre_9q.js} +19 -19
  10. package/dist/CurrentPage-TNff16tH.cjs +1 -0
  11. package/dist/ListTree-GxCAsv2Y.cjs +1 -0
  12. package/dist/{ListTree-0ZrRreCs.js → ListTree-H2WaKwOs.js} +81 -76
  13. package/dist/PagesPanel-5DRsqV-G.cjs +1 -0
  14. package/dist/{PagesPanel-AxQX-BX2.js → PagesPanel-jHMmJEtv.js} +14 -14
  15. package/dist/ProjectPanel-CDnnGpVo.cjs +1 -0
  16. package/dist/{ProjectPanel-GYdge5v9.js → ProjectPanel-uxhq_D3j.js} +16 -16
  17. package/dist/Settings-nGnVavh4.cjs +1 -0
  18. package/dist/{Settings-9JAzGHau.js → Settings-yqZksAbO.js} +53 -53
  19. package/dist/{SidePanels-bLwsW29O.js → SidePanels-1gwirESt.js} +70 -70
  20. package/dist/SidePanels-33KNaSS3.cjs +1 -0
  21. package/dist/{Topbar-0Ql8pHVc.js → Topbar-NHF8D1di.js} +19 -14
  22. package/dist/Topbar-Wwdd9Flx.cjs +1 -0
  23. package/dist/{UnsplashImages-NYwOOgYa.js → UnsplashImages-LLu2wFeN.js} +26 -21
  24. package/dist/UnsplashImages-lnz6NfSD.cjs +1 -0
  25. package/dist/UploadImages-3nl_4mDf.cjs +1 -0
  26. package/dist/{UploadImages-vpZeW-YW.js → UploadImages-FtvaDyk9.js} +33 -27
  27. package/dist/{add-page-modal-hDyzsEU7.js → add-page-modal-V9DTBMmY.js} +22 -22
  28. package/dist/add-page-modal-sIZk552b.cjs +1 -0
  29. package/dist/confirm-alert-Uzq5XNGt.cjs +1 -0
  30. package/dist/{confirm-alert-FGQKKQJU.js → confirm-alert-sI4pItIN.js} +16 -10
  31. package/dist/{controls-OfJWSEqC.js → controls-VTdJhdSz.js} +44 -41
  32. package/dist/controls-jWJDao88.cjs +1 -0
  33. package/dist/core.cjs +1 -1
  34. package/dist/core.d.ts +9 -0
  35. package/dist/core.js +46 -45
  36. package/dist/delete-page-modal-UminFzYh.cjs +1 -0
  37. package/dist/{delete-page-modal-KxeyBri2.js → delete-page-modal-XrIpujav.js} +15 -15
  38. package/dist/email-blocks.cjs +1 -1
  39. package/dist/email-blocks.js +1 -1
  40. package/dist/email.cjs +1 -1
  41. package/dist/email.d.ts +9 -0
  42. package/dist/email.js +18 -16
  43. package/dist/{form-77dY98bF.js → form-dQQ2tTRZ.js} +7 -7
  44. package/dist/form-q7lxaK3j.cjs +1 -0
  45. package/dist/functions-ge87TVcc.js +30 -0
  46. package/dist/functions-sBiIevFh.cjs +1 -0
  47. package/dist/{index-5zkCTSAM.js → index-OsS2_gM8.js} +28 -29
  48. package/dist/index-eYwpNzUl.cjs +1 -0
  49. package/dist/lib.cjs +2 -2
  50. package/dist/lib.d.ts +2 -0
  51. package/dist/lib.js +12 -10
  52. package/dist/{page-viewer-umQaut1j.js → page-viewer-AoJ5HU6j.js} +21 -21
  53. package/dist/page-viewer-FzhqSyNO.cjs +1 -0
  54. package/dist/project-general-setting-WzJ8U1OW.cjs +1 -0
  55. package/dist/{project-general-setting-uuCemMCU.js → project-general-setting-g3YJYszB.js} +24 -24
  56. package/dist/{project-seo-setting-asvbPQiI.js → project-seo-setting-1sLmV-wv.js} +26 -20
  57. package/dist/project-seo-setting-GuObNafp.cjs +1 -0
  58. package/dist/render.cjs +1 -1
  59. package/dist/render.d.ts +2 -0
  60. package/dist/render.js +55 -53
  61. package/dist/single-page-detail-WGars7Tl.cjs +1 -0
  62. package/dist/{single-page-detail-F6pKWyq1.js → single-page-detail-sQ3BH6Rc.js} +25 -25
  63. package/dist/studio.cjs +1 -1
  64. package/dist/studio.d.ts +9 -0
  65. package/dist/studio.js +13 -13
  66. package/dist/ui.cjs +1 -1
  67. package/dist/ui.js +153 -147
  68. package/dist/useCanvasSettings-QcsmJd9b.cjs +1 -0
  69. package/dist/{useCanvasSettings-ikt217kv.js → useCanvasSettings-XwFRrknO.js} +1 -1
  70. package/dist/web-blocks.cjs +4 -4
  71. package/dist/web-blocks.js +137 -113
  72. package/package.json +9 -3
  73. package/dist/AddBlocks-t0hKDSud.cjs +0 -1
  74. package/dist/BrandingOptions-NVmCxZfD.cjs +0 -1
  75. package/dist/CanvasArea-2b4oSjRx.js +0 -1177
  76. package/dist/CanvasArea-OzyCq6UU.cjs +0 -55
  77. package/dist/CurrentPage-YBMhEBZG.cjs +0 -1
  78. package/dist/ListTree-jPwxgI6R.cjs +0 -1
  79. package/dist/PagesPanel-ivEL9tIQ.cjs +0 -1
  80. package/dist/ProjectPanel-shgvg_yT.cjs +0 -1
  81. package/dist/Settings-MMwEBADN.cjs +0 -1
  82. package/dist/SidePanels-iaaRCUeQ.cjs +0 -1
  83. package/dist/Topbar-CkUhCnSW.cjs +0 -1
  84. package/dist/UnsplashImages-juwtWvXe.cjs +0 -1
  85. package/dist/UploadImages-4_jmnoVi.cjs +0 -1
  86. package/dist/add-page-modal-2ZPjc54F.cjs +0 -1
  87. package/dist/confirm-alert-QRxOc76t.cjs +0 -1
  88. package/dist/controls-KK2oLIa8.cjs +0 -1
  89. package/dist/delete-page-modal--N1nPPIL.cjs +0 -1
  90. package/dist/form-hT5dGoJH.cjs +0 -1
  91. package/dist/functions-I6BoMqqb.js +0 -21
  92. package/dist/functions-r3ExvGGf.cjs +0 -1
  93. package/dist/index-FPBudsRF.cjs +0 -1
  94. package/dist/index-JIcsKKoG.cjs +0 -1
  95. package/dist/index-YpnaudSM.js +0 -63
  96. package/dist/index-ecnGWzh9.cjs +0 -1
  97. package/dist/index-hH5SIZ29.js +0 -3116
  98. package/dist/index-sJ9Uc9UY.cjs +0 -206
  99. package/dist/page-viewer-k-g15j8B.cjs +0 -1
  100. package/dist/project-general-setting-1leAiCJQ.cjs +0 -1
  101. package/dist/project-seo-setting-kDBSOzgX.cjs +0 -1
  102. package/dist/single-page-detail-IFtVxwl5.cjs +0 -1
  103. package/dist/useCanvasSettings-Am2o80hW.cjs +0 -1
@@ -1,1177 +0,0 @@
1
- var Le = Object.defineProperty;
2
- var Re = (n, o, e) => o in n ? Le(n, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[o] = e;
3
- var _ = (n, o, e) => (Re(n, typeof o != "symbol" ? o + "" : o, e), e);
4
- import { j as r } from "./jsx-runtime-WbnYoNE9.js";
5
- import N, { createElement as se, useCallback as P, useState as j, useEffect as b, Component as ue, Children as Fe, Suspense as he, useRef as oe, useMemo as Pe } from "react";
6
- import { map as F, includes as ne, toUpper as Y, round as Oe, noop as T, has as Q, throttle as me, isEmpty as S, first as z, omit as He, pick as ze, get as f, isString as X, memoize as Ue, each as We, find as qe, filter as ge, isNull as Ke } from "lodash-es";
7
- import { ResetIcon as re, MobileIcon as ie, LaptopIcon as Ye, DesktopIcon as Je, DotsVerticalIcon as Qe, EraserIcon as Ze, ZoomInIcon as Ge, DragHandleDots2Icon as Xe, ArrowUpIcon as Ve, CopyIcon as et, TrashIcon as tt } from "@radix-ui/react-icons";
8
- import { v as fe, B as U, V as xe, aB as st, aC as ot, aD as nt, aE as rt, aF as it, N as V, ab as at, h as W, aG as lt, aH as ct, aI as dt, aJ as pt, aK as ut, aL as ht, aM as mt, r as C, ac as A, A as gt, a as ft, b as xt, c as $t, d as vt, e as yt, f as bt, g as kt, ai as wt, O as $e, aA as H, L as jt, aN as Ct, Y as M, a5 as Bt, aO as L, aP as St, E as ee, t as ve, q as ye, s as be, z as Dt, aQ as It, aR as ke, aS as _t, aT as Nt, F as At, aU as Mt, a1 as Et, aV as Tt, S as we } from "./index-hH5SIZ29.js";
9
- import { useTranslation as q } from "react-i18next";
10
- import { useAtom as k } from "jotai";
11
- import ae from "react-dom";
12
- import y from "prop-types";
13
- import { Quill as Lt } from "react-quill";
14
- import { useFeature as je } from "flagged";
15
- import { flip as Rt } from "@floating-ui/dom";
16
- import { useFloating as Ft, shift as Pt } from "@floating-ui/react-dom";
17
- import { useResizeObserver as Ot } from "@react-hookz/web";
18
- import Ht from "@tailwindcss/typography";
19
- import zt from "@tailwindcss/forms";
20
- import Ut from "@tailwindcss/aspect-ratio";
21
- import Wt from "tailwindcss-palette-generator";
22
- import { Provider as qt } from "react-wrap-balancer";
23
- import { twMerge as Kt } from "tailwind-merge";
24
- import { S as le, a as Ce } from "./STRINGS--j49GZJP.js";
25
- import { getBlockComponent as Yt } from "@chaibuilder/runtime";
26
- import { u as Jt, B as Qt, E as Zt } from "./index-AJalHhkO.js";
27
- import { u as Gt } from "./useCanvasSettings-ikt217kv.js";
28
- import "./_commonjsHelpers-UyOWmZb0.js";
29
- import "./Functions-7jnEwJyw.js";
30
- import "clsx";
31
- import "./MODIFIERS-cBT31iqE.js";
32
- import "./Class-6Hz2KzYb.js";
33
- import "@radix-ui/react-toggle";
34
- import "class-variance-authority";
35
- import "@radix-ui/react-switch";
36
- import "@radix-ui/react-slot";
37
- import "@radix-ui/react-accordion";
38
- import "@radix-ui/react-alert-dialog";
39
- import "@radix-ui/react-dialog";
40
- import "@radix-ui/react-label";
41
- import "@radix-ui/react-scroll-area";
42
- import "@radix-ui/react-tabs";
43
- import "@radix-ui/react-tooltip";
44
- import "@radix-ui/react-popover";
45
- import "@radix-ui/react-menubar";
46
- import "@radix-ui/react-hover-card";
47
- import "@radix-ui/react-select";
48
- import "@radix-ui/react-dropdown-menu";
49
- import "@radix-ui/react-separator";
50
- import "@radix-ui/react-toast";
51
- import "cmdk";
52
- import "@radix-ui/react-context-menu";
53
- import "react-icons-picker";
54
- import "i18next";
55
- import "react-hotkeys-hook";
56
- const Xt = () => {
57
- const { hasUndo: n, hasRedo: o, undo: e, redo: t } = fe();
58
- return /* @__PURE__ */ r.jsxs("div", { className: "flex items-center", children: [
59
- /* @__PURE__ */ r.jsx(U, { disabled: !n(), size: "sm", onClick: e, className: "rounded-full", variant: "ghost", children: /* @__PURE__ */ r.jsx(re, {}) }),
60
- /* @__PURE__ */ r.jsx(U, { disabled: !o(), onClick: t, size: "sm", className: "rounded-full", variant: "ghost", children: /* @__PURE__ */ r.jsx(re, { className: "rotate-180 scale-y-[-1] transform" }) })
61
- ] });
62
- };
63
- function Vt() {
64
- const [n, o] = xe(), { t: e } = q();
65
- return /* @__PURE__ */ r.jsxs("div", { className: "flex items-center", children: [
66
- /* @__PURE__ */ r.jsx(st, { htmlFor: "dark-mode-switch", children: e("dark_mode") }),
67
- /* @__PURE__ */ r.jsxs(
68
- ot,
69
- {
70
- id: "dark-mode-switch",
71
- checked: n,
72
- onCheckedChange: () => {
73
- o(!n);
74
- },
75
- className: `${n ? "bg-violet-600" : "bg-violet-300"}
76
- 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`,
77
- children: [
78
- /* @__PURE__ */ r.jsx("span", { className: "sr-only", children: e("use_setting") }),
79
- /* @__PURE__ */ r.jsx(
80
- "span",
81
- {
82
- "aria-hidden": "true",
83
- className: `${n ? "translate-x-5" : "translate-x-0"}
84
- 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`
85
- }
86
- )
87
- ]
88
- }
89
- )
90
- ] });
91
- }
92
- const ce = ({ landscape: n = !1 }) => /* @__PURE__ */ r.jsxs(
93
- "svg",
94
- {
95
- className: n ? "rotate-90" : "",
96
- xmlns: "http://www.w3.org/2000/svg",
97
- viewBox: "0 0 13 13",
98
- xmlSpace: "preserve",
99
- width: 13,
100
- height: 13,
101
- children: [
102
- /* @__PURE__ */ r.jsx("g", { strokeWidth: 0 }),
103
- /* @__PURE__ */ r.jsx("g", { strokeLinecap: "round", strokeLinejoin: "round" }),
104
- /* @__PURE__ */ r.jsx(
105
- "path",
106
- {
107
- 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",
108
- style: {
109
- fill: "#000"
110
- }
111
- }
112
- )
113
- ]
114
- }
115
- ), es = [
116
- {
117
- title: "mobile_xs_title",
118
- content: "mobile_xs_content",
119
- breakpoint: "xs",
120
- icon: /* @__PURE__ */ r.jsx(ie, {}),
121
- width: 400
122
- },
123
- {
124
- title: "mobile_sm_title",
125
- content: "mobile_sm_content",
126
- breakpoint: "sm",
127
- icon: /* @__PURE__ */ r.jsx(ie, { className: "rotate-90" }),
128
- width: 640
129
- },
130
- {
131
- title: "tablet_md_title",
132
- content: "tablet_md_content",
133
- breakpoint: "md",
134
- icon: /* @__PURE__ */ r.jsx(ce, {}),
135
- width: 800
136
- },
137
- {
138
- title: "tablet_lg_title",
139
- content: "tablet_lg_content",
140
- breakpoint: "lg",
141
- icon: /* @__PURE__ */ r.jsx(ce, { landscape: !0 }),
142
- width: 1024
143
- },
144
- {
145
- title: "desktop_xl_title",
146
- content: "desktop_xl_content",
147
- breakpoint: "xl",
148
- icon: /* @__PURE__ */ r.jsx(Ye, {}),
149
- width: 1420
150
- },
151
- {
152
- title: "large_desktop_2xl_title",
153
- content: "large_desktop_2xl_content",
154
- breakpoint: "2xl",
155
- icon: /* @__PURE__ */ r.jsx(Je, {}),
156
- width: 1920
157
- }
158
- ], de = ({
159
- title: n,
160
- content: o,
161
- currentBreakpoint: e,
162
- breakpoint: t,
163
- width: s,
164
- icon: d,
165
- onClick: a
166
- }) => {
167
- const { t: i } = q();
168
- return /* @__PURE__ */ r.jsxs(nt, { children: [
169
- /* @__PURE__ */ r.jsx(rt, { asChild: !0, children: /* @__PURE__ */ r.jsx(
170
- U,
171
- {
172
- onClick: () => a(s),
173
- size: "sm",
174
- variant: t === e ? "secondary" : "ghost",
175
- children: d
176
- }
177
- ) }),
178
- /* @__PURE__ */ r.jsx(it, { className: "w-52 border-border", children: /* @__PURE__ */ r.jsx("div", { className: "flex justify-between space-x-4", children: /* @__PURE__ */ r.jsxs("div", { className: "space-y-1", children: [
179
- /* @__PURE__ */ r.jsx("h4", { className: "text-sm font-semibold", children: i(n) }),
180
- /* @__PURE__ */ r.jsx("p", { className: "text-xs", children: i(o) })
181
- ] }) }) })
182
- ] });
183
- }, ts = () => {
184
- const [, n, o] = V(), [e, t] = at(), { t: s } = q(), d = W("breakpoints", es), a = (i) => {
185
- e.includes(i) ? e.length > 2 && t(e.filter((l) => l !== i)) : t((l) => [...l, i]);
186
- };
187
- return d.length < 4 ? /* @__PURE__ */ r.jsx("div", { className: "flex items-center rounded-md", children: F(d, (i) => /* @__PURE__ */ se(de, { ...i, onClick: o, key: i.breakpoint, currentBreakpoint: n })) }) : /* @__PURE__ */ r.jsxs("div", { className: "flex items-center rounded-md", children: [
188
- F(
189
- d.filter((i) => ne(e, Y(i.breakpoint))),
190
- (i) => /* @__PURE__ */ se(de, { ...i, onClick: o, key: i.breakpoint, currentBreakpoint: n })
191
- ),
192
- /* @__PURE__ */ r.jsxs(lt, { children: [
193
- /* @__PURE__ */ r.jsx(ct, { asChild: !0, children: /* @__PURE__ */ r.jsx("span", { className: "cursor-pointer px-2.5 hover:opacity-80", children: /* @__PURE__ */ r.jsx(Qe, { className: "scale-90 transform" }) }) }),
194
- /* @__PURE__ */ r.jsxs(dt, { className: "w-56 border-border text-xs", children: [
195
- /* @__PURE__ */ r.jsx(pt, { children: s("Breakpoints") }),
196
- /* @__PURE__ */ r.jsx(ut, {}),
197
- F(d, (i) => /* @__PURE__ */ r.jsx(
198
- ht,
199
- {
200
- disabled: i.breakpoint === "xs",
201
- onCheckedChange: () => a(Y(i.breakpoint)),
202
- checked: ne(e, Y(i.breakpoint)),
203
- children: s(i.title)
204
- },
205
- i.breakpoint
206
- ))
207
- ] })
208
- ] })
209
- ] });
210
- }, ss = () => {
211
- const { t: n } = q(), { setNewBlocks: o } = mt(), [, e] = C(), [, t] = A(), s = P(() => {
212
- o([]), e([]), t([]);
213
- }, [o]);
214
- return /* @__PURE__ */ r.jsx("div", { className: "flex items-center", children: /* @__PURE__ */ r.jsxs(gt, { children: [
215
- /* @__PURE__ */ r.jsx(ft, { asChild: !0, children: /* @__PURE__ */ r.jsxs(U, { size: "sm", variant: "ghost", className: "flex items-center gap-x-1", children: [
216
- /* @__PURE__ */ r.jsx(Ze, {}),
217
- " ",
218
- n("clear")
219
- ] }) }),
220
- /* @__PURE__ */ r.jsxs(xt, { className: "border-border", children: [
221
- /* @__PURE__ */ r.jsxs($t, { children: [
222
- /* @__PURE__ */ r.jsx(vt, { children: n("clear_canvas_title") }),
223
- /* @__PURE__ */ r.jsx(yt, { children: n("clear_canvas_description") })
224
- ] }),
225
- /* @__PURE__ */ r.jsxs(bt, { children: [
226
- /* @__PURE__ */ r.jsx(kt, { children: n("cancel") }),
227
- /* @__PURE__ */ r.jsx(wt, { onClick: s, children: n("yes") })
228
- ] })
229
- ] })
230
- ] }) });
231
- }, os = () => {
232
- const n = W("darkMode", !1), [o] = $e();
233
- return /* @__PURE__ */ r.jsxs("div", { className: "flex h-10 items-center justify-between border-b bg-background/70 px-2", children: [
234
- /* @__PURE__ */ r.jsxs("div", { className: "flex h-full space-x-2", children: [
235
- n ? /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
236
- /* @__PURE__ */ r.jsx(Vt, {}),
237
- /* @__PURE__ */ r.jsx(H, { orientation: "vertical" })
238
- ] }) : null,
239
- /* @__PURE__ */ r.jsx(ts, {}),
240
- /* @__PURE__ */ r.jsx(H, { orientation: "vertical" }),
241
- /* @__PURE__ */ r.jsxs("div", { className: "flex w-12 items-center justify-center gap-x-1 space-x-0 font-medium", children: [
242
- /* @__PURE__ */ r.jsx(Ge, { className: "h-3.5 w-3.5 flex-shrink-0" }),
243
- " ",
244
- /* @__PURE__ */ r.jsxs("div", { className: "text-xs leading-3", children: [
245
- Oe(o, 0),
246
- "%"
247
- ] })
248
- ] }),
249
- /* @__PURE__ */ r.jsx(H, { orientation: "vertical" }),
250
- /* @__PURE__ */ r.jsx(Xt, {})
251
- ] }),
252
- /* @__PURE__ */ r.jsxs("div", { className: "flex h-full items-center space-x-2", children: [
253
- /* @__PURE__ */ r.jsx(H, { orientation: "vertical" }),
254
- /* @__PURE__ */ r.jsx(ss, {})
255
- ] })
256
- ] });
257
- }, ns = `<!doctype html>
258
- <html class="scroll-smooth h-full overflow-y-auto">
259
- <head>
260
- <meta charset="UTF-8">
261
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
262
- <script src="https://cdn.tailwindcss.com?plugins=forms,typography,aspect-ratio"><\/script>
263
- <style>
264
- html { height: 100%; overflow:auto; }
265
- body { height: 100%; }
266
- .air-highlight{ outline: 1px solid #42a1fc !important; outline-offset: -1px;}
267
- .air-highlight-multi{ outline: 1px solid #29e503 !important; outline-offset: -1px;}
268
- body{ -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none;
269
- -moz-user-select: none;-ms-user-select: none; user-select: none; }
270
- html{
271
- -ms-overflow-style: none; /* IE and Edge */
272
- scrollbar-width: none; /* Firefox */
273
- }
274
- /** IMPORTANT: Make fields content editable in SAFARI */
275
- [contenteditable] {-webkit-user-select: text;user-select: text;}
276
-
277
- html::-webkit-scrollbar { width: 0 !important }
278
- .aspect-auto{aspect-ratio: auto;}
279
- .aspect-square{aspect-ratio: 1/1;}
280
- .aspect-video{aspect-ratio: 16/9;}
281
- .dragging [data-dnd="leaf"] { pointer-events: none; } .dragging [data-dnd="leaf"] * { pointer-events: none; }
282
- .dragging [data-dnd="ignore"], .dragging [data-dnd="ignore"] * { pointer-events: none; }
283
- a{ pointer-events: none !important; }
284
- [contenteditable="true"], [contenteditable="true"] * { cursor: text !important; }
285
- [contenteditable="true"] {
286
- outline: none;
287
- box-shadow: 0 0 0px 4px rgba(36, 150, 255, 0.2);
288
- -webkit-user-select: text;
289
- -moz-user-select: text;
290
- user-select: text;
291
- }
292
- .frame-root .frame-content { height: 100%; }
293
- </style>
294
- <style id="hidden-blocks"></style>
295
- <style id="selected-block"></style>
296
- <style id="selected-styling-block"></style>
297
- <style id="highlighted-block"></style>
298
- <style id="dragged-block"></style>
299
-
300
- </head>
301
- <body class="font-body antialiased h-full">
302
- <div class="frame-root h-full"></div>
303
- <script src="https://cdn.jsdelivr.net/npm/quill@2.0.0/dist/quill.js"><\/script>
304
- </body>
305
- </html>`, rs = (n) => {
306
- const [o] = V(), [, e] = $e(), [t, s] = j({}), d = P(() => {
307
- const { width: a, height: i } = n;
308
- if (a < o) {
309
- const l = parseFloat((a / o).toFixed(2).toString());
310
- let c = {};
311
- const p = i * l;
312
- i && (c = {
313
- // Eureka! This is the formula to calculate the height of the scaled element. Thank you ChatGPT 4
314
- height: 100 + (i - p) / p * 100 + "%"
315
- }), s({
316
- position: "relative",
317
- top: 0,
318
- transform: `scale(${l})`,
319
- transformOrigin: "top left",
320
- ...c,
321
- maxWidth: "none"
322
- }), e(l * 100);
323
- } else
324
- s({}), e(100);
325
- }, [o, n, e]);
326
- return b(() => {
327
- d();
328
- }, [o, n, e, d]), t;
329
- };
330
- let Be, Se;
331
- typeof document < "u" && (Be = document);
332
- typeof window < "u" && (Se = window);
333
- const De = N.createContext({ document: Be, window: Se }), K = () => N.useContext(De), { Provider: is, Consumer: Mo } = De;
334
- class Ie extends ue {
335
- componentDidMount() {
336
- this.props.contentDidMount();
337
- }
338
- componentDidUpdate() {
339
- this.props.contentDidUpdate();
340
- }
341
- render() {
342
- return Fe.only(this.props.children);
343
- }
344
- }
345
- _(Ie, "propTypes", {
346
- children: y.element.isRequired,
347
- contentDidMount: y.func.isRequired,
348
- contentDidUpdate: y.func.isRequired
349
- });
350
- class Z extends ue {
351
- constructor(e, t) {
352
- super(e, t);
353
- _(this, "setRef", (e) => {
354
- this.nodeRef.current = e;
355
- const { forwardedRef: t } = this.props;
356
- typeof t == "function" ? t(e) : t && (t.current = e);
357
- });
358
- _(this, "handleLoad", () => {
359
- clearInterval(this.loadCheck), this.state.iframeLoaded || this.setState({ iframeLoaded: !0 });
360
- });
361
- // In certain situations on a cold cache DOMContentLoaded never gets called
362
- // fallback to an interval to check if that's the case
363
- _(this, "loadCheck", () => setInterval(() => {
364
- this.handleLoad();
365
- }, 500));
366
- this._isMounted = !1, this.nodeRef = N.createRef(), this.state = { iframeLoaded: !1 };
367
- }
368
- componentDidMount() {
369
- this._isMounted = !0, this.getDoc() && this.nodeRef.current.contentWindow.addEventListener("DOMContentLoaded", this.handleLoad);
370
- }
371
- componentWillUnmount() {
372
- this._isMounted = !1, this.nodeRef.current.removeEventListener("DOMContentLoaded", this.handleLoad);
373
- }
374
- getDoc() {
375
- return this.nodeRef.current ? this.nodeRef.current.contentDocument : null;
376
- }
377
- getMountTarget() {
378
- const e = this.getDoc();
379
- return this.props.mountTarget ? e.querySelector(this.props.mountTarget) : e.body.children[0];
380
- }
381
- renderFrameContents() {
382
- if (!this._isMounted)
383
- return null;
384
- const e = this.getDoc();
385
- if (!e)
386
- return null;
387
- const t = this.props.contentDidMount, s = this.props.contentDidUpdate, d = e.defaultView || e.parentView, a = /* @__PURE__ */ r.jsx(Ie, { contentDidMount: t, contentDidUpdate: s, children: /* @__PURE__ */ r.jsx(is, { value: { document: e, window: d }, children: /* @__PURE__ */ r.jsx("div", { className: "frame-content", children: this.props.children }) }) }), i = this.getMountTarget();
388
- return [ae.createPortal(this.props.head, this.getDoc().head), ae.createPortal(a, i)];
389
- }
390
- render() {
391
- const e = {
392
- ...this.props,
393
- srcDoc: this.props.initialContent,
394
- children: void 0
395
- // The iframe isn't ready so we drop children from props here. #12, #17
396
- };
397
- return delete e.head, delete e.initialContent, delete e.mountTarget, delete e.contentDidMount, delete e.contentDidUpdate, delete e.forwardedRef, /* @__PURE__ */ r.jsx("iframe", { ...e, ref: this.setRef, onLoad: this.handleLoad, children: this.state.iframeLoaded && this.renderFrameContents() });
398
- }
399
- }
400
- // React warns when you render directly into the body since browser extensions
401
- // also inject into the body and can mess up React. For this reason
402
- // initialContent is expected to have a div inside of the body
403
- // element that we render react into.
404
- _(Z, "propTypes", {
405
- style: y.object,
406
- // eslint-disable-line
407
- head: y.node,
408
- initialContent: y.string,
409
- mountTarget: y.string,
410
- contentDidMount: y.func,
411
- contentDidUpdate: y.func,
412
- children: y.oneOfType([y.element, y.arrayOf(y.element)])
413
- }), _(Z, "defaultProps", {
414
- style: {},
415
- head: null,
416
- children: void 0,
417
- mountTarget: void 0,
418
- contentDidMount: () => {
419
- },
420
- contentDidUpdate: () => {
421
- },
422
- initialContent: '<!DOCTYPE html><html><head></head><body><div class="frame-root"></div></body></html>'
423
- });
424
- const as = N.forwardRef((n, o) => /* @__PURE__ */ r.jsx(Z, { ...n, forwardedRef: o })), ls = () => {
425
- const { addCoreBlock: n } = jt(), o = W("getExternalPredefinedBlock", T);
426
- return P(
427
- async (e) => {
428
- const { block: t, dropTargetId: s, relativeIndex: d } = e;
429
- if (Q(t, "format")) {
430
- const a = await o(t);
431
- return n({ blocks: a }, s === 0 ? null : s, d);
432
- }
433
- return n(t, s === 0 ? null : s, d);
434
- },
435
- [n]
436
- );
437
- };
438
- let B = null, O = [], R = null, _e = null;
439
- function cs(n) {
440
- const o = window.getComputedStyle(n), e = parseInt(o.paddingLeft, 10), t = parseInt(o.paddingTop, 10), s = parseInt(o.paddingRight, 10), d = parseInt(o.paddingBottom, 10);
441
- return { paddingLeft: e, paddingTop: t, paddingRight: s, paddingBottom: d };
442
- }
443
- const pe = (n, o, e) => {
444
- if (!B)
445
- return;
446
- const t = n.getBoundingClientRect(), s = B == null ? void 0 : B.getElementById("placeholder"), { paddingLeft: d, paddingTop: a, paddingRight: i, paddingBottom: l } = cs(n);
447
- s.style.width = o === "vertical" ? t.width - d - i + "px" : "2px", s.style.height = o === "vertical" ? "2px" : t.height - a - l + "px", s.style.display = "block";
448
- const c = O.reduce(
449
- (p, m) => Math.abs(m - e) < Math.abs(p - e) ? m : p
450
- );
451
- _e = O.indexOf(c), o === "vertical" ? (s.style.top = n.offsetTop + c + "px", s.style.left = n.offsetLeft + d + "px") : (s.style.top = n.offsetTop + a + "px", s.style.left = n.offsetLeft + c + "px");
452
- }, ds = (n) => {
453
- const o = Ne(n), e = window.getComputedStyle(n), t = o === "horizontal", s = parseInt(e.paddingLeft), d = parseInt(e.paddingTop);
454
- let a = t ? s : d;
455
- O = [a], Array.from(n.children).forEach((i) => {
456
- const l = window.getComputedStyle(i), c = parseInt(
457
- t ? l.marginLeft + l.marginRight : l.marginTop + l.marginBottom
458
- ), p = t ? i.offsetWidth : i.offsetHeight;
459
- O.push(a + p + c), a += p + c;
460
- });
461
- };
462
- function Ne(n) {
463
- const o = window.getComputedStyle(n).display, e = window.getComputedStyle(n).flexDirection;
464
- if (o === "flex")
465
- return e === "column" || e === "column-reverse" ? "vertical" : "horizontal";
466
- if (o === "grid") {
467
- const t = window.getComputedStyle(n).gridTemplateRows, s = window.getComputedStyle(n).gridTemplateColumns;
468
- if (t.includes("auto"))
469
- return "vertical";
470
- if (s.includes("auto"))
471
- return "horizontal";
472
- }
473
- return o === "block" ? "vertical" : "horizontal";
474
- }
475
- const ps = me((n) => {
476
- const o = n.target, e = Ne(o);
477
- if (e === "vertical") {
478
- const t = n.clientY - o.offsetTop;
479
- pe(o, e, t);
480
- } else {
481
- const t = n.clientX - o.offsetLeft;
482
- pe(o, e, t);
483
- }
484
- }, 200), us = (n) => {
485
- n.preventDefault(), n.stopPropagation(), ps(n);
486
- };
487
- function J() {
488
- const n = B == null ? void 0 : B.getElementById("placeholder");
489
- n.style.display = "none";
490
- }
491
- const hs = () => {
492
- const { document: n } = K(), [o, e] = k(Ct), t = ls(), s = je("dnd"), [, d] = M(), [, a] = C();
493
- return B = n, {
494
- isDragging: o,
495
- "data-dnd": "branch",
496
- onDragOver: s ? us : T,
497
- onDrop: s ? (i) => {
498
- R == null || R.classList.remove("outline", "outline-green-300", "outline-2", "-outline-offset-2");
499
- const l = JSON.parse(i.dataTransfer.getData("text/plain"));
500
- let c = i.target.getAttribute("data-block-id");
501
- c === null && (c = i.target.parentElement.getAttribute("data-block-id")), t({ block: l, dropTargetId: c || null, relativeIndex: _e }), e(!1), J(), setTimeout(() => {
502
- J();
503
- }, 300);
504
- } : T,
505
- onDragEnter: s ? (i) => {
506
- const l = i;
507
- R = l.target, l.stopPropagation(), l.preventDefault(), O = [];
508
- const c = l.target;
509
- ds(c), c.classList.add("outline", "outline-green-300", "outline-2", "-outline-offset-2"), e(!0), d(""), a([]);
510
- } : T,
511
- onDragLeave: s ? (i) => {
512
- const l = i;
513
- R = null, l.stopPropagation(), l.preventDefault(), l.target.classList.remove("outline", "outline-green-300", "outline-2", "-outline-offset-2");
514
- } : T,
515
- onMouseOut: s ? () => {
516
- e(!1), J();
517
- } : T
518
- };
519
- };
520
- function te(n) {
521
- return n.getAttribute("data-block-id") ? n : n.closest("[data-block-id]");
522
- }
523
- function ms(n) {
524
- n.container.innerHTML = "", n.container.parentNode.removeChild(n.container);
525
- var o = document.querySelector(".ql-toolbar");
526
- o && o.parentNode.removeChild(o), n = null;
527
- }
528
- const gs = () => {
529
- const n = ["Heading", "Paragraph", "Text", "Link", "Span", "Button"], o = Bt(), [, e] = M(), [t, s] = k(L);
530
- return (d) => {
531
- var m;
532
- if (t)
533
- return;
534
- const a = te(d.target), i = a.getAttribute("data-block-type");
535
- if (!i || !n.includes(i))
536
- return;
537
- const l = a.cloneNode(!0);
538
- a.style.display = "none", Array.from(l.attributes).forEach((h) => {
539
- h.name !== "class" && l.removeAttribute(h.name);
540
- }), i === "Text" && (l.style.display = "inline-block"), a.parentNode.insertBefore(l, a.nextSibling);
541
- const c = new Lt(l, { placeholder: "Type here..." });
542
- function p() {
543
- const h = c.getText(0, c.getLength());
544
- o([a.getAttribute("data-block-id")], { content: h }), a.removeAttribute("style"), l.removeEventListener("blur", p, !0), ms(c), s(""), e("");
545
- }
546
- l.addEventListener("blur", p, !0), c.focus(), (m = l.querySelector(".ql-clipboard")) == null || m.remove(), s(a.getAttribute("data-block-id"));
547
- };
548
- }, fs = () => {
549
- const [, n] = A(), [, o] = C(), [, e] = M(), [t] = k(L), [s] = k(St);
550
- return (d) => {
551
- if (t)
552
- return;
553
- s.closeAll(), d.stopPropagation();
554
- const a = te(d.target);
555
- if (a != null && a.getAttribute("data-block-id") && (a == null ? void 0 : a.getAttribute("data-block-id")) === "container") {
556
- o([]), n([]), e("");
557
- return;
558
- }
559
- if (a != null && a.getAttribute("data-block-parent")) {
560
- const i = a.getAttribute("data-style-prop"), l = a.getAttribute("data-style-id"), c = a.getAttribute("data-block-parent");
561
- n([{ id: l, prop: i, blockId: c }]), o([c]);
562
- } else
563
- a != null && a.getAttribute("data-block-id") && o([a.getAttribute("data-block-id")]);
564
- e("");
565
- };
566
- }, xs = me((n, o) => {
567
- const e = te(n.target);
568
- e != null && e.getAttribute("data-style-id") && o(e.getAttribute("data-style-id"));
569
- }, 100), $s = () => {
570
- const [, n] = M(), [o] = k(L);
571
- return (e) => {
572
- o || xs(e, n);
573
- };
574
- }, vs = ({ children: n }) => {
575
- const { document: o } = K(), [e] = C(), [t, s] = A();
576
- b(() => {
577
- setTimeout(() => {
578
- if (!S(t))
579
- return;
580
- const c = Ae(o, z(e));
581
- if (c) {
582
- const p = c.getAttribute("data-style-prop");
583
- if (p) {
584
- const m = c.getAttribute("data-style-id"), h = c.getAttribute("data-block-parent");
585
- s([{ id: m, prop: p, blockId: h }]);
586
- }
587
- }
588
- }, 100);
589
- }, [o, e, s, t]);
590
- const d = gs(), a = fs(), i = $s(), l = hs();
591
- return /* @__PURE__ */ r.jsx(
592
- "div",
593
- {
594
- "data-block-id": "container",
595
- id: "canvas",
596
- onClick: a,
597
- onDoubleClick: d,
598
- onMouseMove: i,
599
- ...He(l, "isDragging"),
600
- className: "relative mb-5 h-full max-w-full " + (l.isDragging ? "dragging" : ""),
601
- children: n
602
- }
603
- );
604
- }, Ae = (n, o) => n.querySelector(`[data-block-id="${o}"]`), ys = () => {
605
- const { window: n } = K(), [o, e] = C(), [t] = ee(), [, s] = A(), { undo: d, redo: a } = fe(), i = ve(), [, l] = ye(), c = be(), { savePage: p } = Dt(), [m] = k(L), [, h] = k(It), $ = (g) => {
606
- g.key === "Enter" && (g.preventDefault(), o.length === 1 && h(z(o)));
607
- }, w = (g) => {
608
- const u = t.find((v) => v._id === g);
609
- return u ? u._parent : null;
610
- };
611
- return b(() => {
612
- const g = (u) => {
613
- if (u.key === "Escape") {
614
- e([]), s([]);
615
- return;
616
- }
617
- if ($(u), !m && (u.key === "Delete" || u.key === "Backspace") && (u.preventDefault(), c(o)), u.ctrlKey || u.metaKey) {
618
- if (u.key === "ArrowUp") {
619
- u.preventDefault();
620
- const v = o.length > 0 ? w(o[0]) : null;
621
- v && e([v]);
622
- }
623
- if (["z", "y", "d", "x", "c", "p", "s", "v"].includes(u.key)) {
624
- if (m && ["x", "z", "v"].includes(u.key))
625
- return !0;
626
- u.preventDefault();
627
- }
628
- u.key === "s" && (u.stopPropagation(), u.preventDefault(), p()), u.key === "z" && d(), u.key === "y" && a(), u.key === "d" && i(o);
629
- }
630
- };
631
- return n.removeEventListener("keydown", g), n.addEventListener("keydown", g), () => {
632
- n.removeEventListener("keydown", g);
633
- };
634
- }, [o, e, d, c, l, a, i, m, p, n]), null;
635
- }, bs = ({ block: n, label: o }) => {
636
- const [, e] = C(), [, t] = M(), [, s] = k(ke), d = je("dnd");
637
- return /* @__PURE__ */ r.jsxs(
638
- "div",
639
- {
640
- className: "mr-10 flex cursor-grab items-center space-x-1 px-1",
641
- draggable: d ? "true" : "false",
642
- onDragStart: (a) => {
643
- a.dataTransfer.setData("text/plain", JSON.stringify(ze(n, ["_id", "_type"]))), s(n._id), setTimeout(() => {
644
- e([]), t(null);
645
- }, 200);
646
- },
647
- children: [
648
- /* @__PURE__ */ r.jsx(Xe, {}),
649
- o
650
- ]
651
- }
652
- );
653
- }, ks = ({ selectedBlockElement: n, block: o }) => {
654
- const e = be(), t = ve(), [, s] = C(), [, d] = A(), [a] = k(L), { floatingStyles: i, refs: l, update: c } = Ft({
655
- placement: "top-start",
656
- middleware: [Pt(), Rt()],
657
- elements: {
658
- reference: n
659
- }
660
- });
661
- Ot(n, () => c(), n !== null);
662
- const p = f(o, "_parent", null), m = S(f(o, "_name", "")) ? f(o, "_type", "") : f(o, "_name", "");
663
- return !n || !o || a ? null : /* @__PURE__ */ r.jsxs(
664
- "div",
665
- {
666
- role: "button",
667
- tabIndex: 0,
668
- ref: l.setFloating,
669
- style: i,
670
- onClick: (h) => {
671
- h.stopPropagation(), h.preventDefault();
672
- },
673
- onKeyDown: (h) => h.stopPropagation(),
674
- className: "z-[99999] flex h-6 items-center bg-blue-500 py-2 text-xs text-white",
675
- children: [
676
- /* @__PURE__ */ r.jsx(bs, { label: m, block: o }),
677
- /* @__PURE__ */ r.jsxs("div", { className: "flex gap-2 px-1", children: [
678
- p && /* @__PURE__ */ r.jsx(
679
- Ve,
680
- {
681
- className: "hover:scale-105",
682
- onClick: () => {
683
- d([]), s([p]);
684
- }
685
- }
686
- ),
687
- _t(f(o, "_type", "")) ? /* @__PURE__ */ r.jsx(et, { className: "hover:scale-105", onClick: () => t([o == null ? void 0 : o._id]) }) : null,
688
- Nt(f(o, "_type", "")) ? /* @__PURE__ */ r.jsx(tt, { className: "hover:scale-105", onClick: () => e([o == null ? void 0 : o._id]) }) : null
689
- ] })
690
- ]
691
- }
692
- );
693
- }, ws = ({ addVariant: n, e: o }) => {
694
- n("hs-dropdown-open", [
695
- ({ modifySelectors: e, separator: t }) => {
696
- e(({ className: s }) => `.hs-dropdown.open > .${o(`hs-dropdown-open${t}${s}`)}`);
697
- },
698
- ({ modifySelectors: e, separator: t }) => {
699
- e(({ className: s }) => `.hs-dropdown.open .hs-dropdown-toggle .${o(`hs-dropdown-open${t}${s}`)}`);
700
- },
701
- ({ modifySelectors: e, separator: t }) => {
702
- e(({ className: s }) => `.hs-dropdown.open > .hs-dropdown-menu > .${o(`hs-dropdown-open${t}${s}`)}`);
703
- }
704
- ]), n("hs-removing", ({ modifySelectors: e, separator: t }) => {
705
- e(({ className: s }) => `.hs-removing.${o(`hs-removing${t}${s}`)}`);
706
- }), n("hs-tooltip-shown", ({ modifySelectors: e, separator: t }) => {
707
- e(({ className: s }) => `.hs-tooltip.show .${o(`hs-tooltip-shown${t}${s}`)}`);
708
- }), n("hs-accordion-active", [
709
- ({ modifySelectors: e, separator: t }) => {
710
- e(({ className: s }) => `.hs-accordion.active.${o(`hs-accordion-active${t}${s}`)}`);
711
- },
712
- ({ modifySelectors: e, separator: t }) => {
713
- e(({ className: s }) => `.hs-accordion.active > .${o(`hs-accordion-active${t}${s}`)}`);
714
- },
715
- ({ modifySelectors: e, separator: t }) => {
716
- e(({ className: s }) => `.hs-accordion.active > .hs-accordion-toggle .${o(`hs-accordion-active${t}${s}`)}`);
717
- },
718
- ({ modifySelectors: e, separator: t }) => {
719
- e(({ className: s }) => `.hs-accordion.active > .hs-accordion-heading > .hs-accordion-toggle .${o(
720
- `hs-accordion-active${t}${s}`
721
- )}`);
722
- },
723
- ({ modifySelectors: e, separator: t }) => {
724
- e(({ className: s }) => `.hs-accordion.active > .hs-accordion-toggle.${o(`hs-accordion-active${t}${s}`)}`);
725
- },
726
- ({ modifySelectors: e, separator: t }) => {
727
- e(({ className: s }) => `.hs-accordion.active > .hs-accordion-heading > .hs-accordion-toggle.${o(
728
- `hs-accordion-active${t}${s}`
729
- )}`);
730
- }
731
- ]), n("hs-accordion-selected", ({ modifySelectors: e, separator: t }) => {
732
- e(({ className: s }) => `.hs-accordion .selected.${o(`hs-accordion-selected${t}${s}`)}`);
733
- }), n("hs-collapse-open", [
734
- ({ modifySelectors: e, separator: t }) => {
735
- e(({ className: s }) => `.hs-collapse.open .${o(`hs-collapse-open${t}${s}`)}`);
736
- },
737
- ({ modifySelectors: e, separator: t }) => {
738
- e(({ className: s }) => `.hs-collapse.open.${o(`hs-collapse-open${t}${s}`)}`);
739
- },
740
- ({ modifySelectors: e, separator: t }) => {
741
- e(({ className: s }) => `.hs-collapse-toggle.open .${o(`hs-collapse-open${t}${s}`)}`);
742
- },
743
- ({ modifySelectors: e, separator: t }) => {
744
- e(({ className: s }) => `.hs-collapse-toggle.open.${o(`hs-collapse-open${t}${s}`)}`);
745
- }
746
- ]), n("hs-tab-active", [
747
- ({ modifySelectors: e, separator: t }) => {
748
- e(({ className: s }) => `[data-hs-tab].active.${o(`hs-tab-active${t}${s}`)}`);
749
- },
750
- ({ modifySelectors: e, separator: t }) => {
751
- e(({ className: s }) => `[data-hs-tab].active .${o(`hs-tab-active${t}${s}`)}`);
752
- }
753
- ]), n("hs-overlay-open", [
754
- ({ modifySelectors: e, separator: t }) => {
755
- e(({ className: s }) => `.open.${o(`hs-overlay-open${t}${s}`)}`);
756
- },
757
- ({ modifySelectors: e, separator: t }) => {
758
- e(({ className: s }) => `.open .${o(`hs-overlay-open${t}${s}`)}`);
759
- }
760
- ]), n("hs-overlay-layout-open", [
761
- ({ modifySelectors: e, separator: t }) => {
762
- e(({ className: s }) => `.hs-overlay-body-open.${o(`hs-overlay-layout-open${t}${s}`)}`);
763
- },
764
- ({ modifySelectors: e, separator: t }) => {
765
- e(({ className: s }) => `.hs-overlay-body-open .${o(`hs-overlay-layout-open${t}${s}`)}`);
766
- }
767
- ]), n("hs-overlay-backdrop-open", [
768
- ({ modifySelectors: e, separator: t }) => {
769
- e(({ className: s }) => `.hs-overlay-backdrop.${o(`hs-overlay-backdrop-open${t}${s}`)}`);
770
- },
771
- ({ modifySelectors: e, separator: t }) => {
772
- e(({ className: s }) => `.hs-overlay-backdrop .${o(`hs-overlay-backdrop-open${t}${s}`)}`);
773
- }
774
- ]), n("hs-scrollspy-active", ({ modifySelectors: e, separator: t }) => {
775
- e(({ className: s }) => `.active.${o(`hs-scrollspy-active${t}${s}`)}`);
776
- }), n("hs-carousel-active", [
777
- ({ modifySelectors: e, separator: t }) => {
778
- e(({ className: s }) => `.active.${o(`hs-carousel-active${t}${s}`)}`);
779
- },
780
- ({ modifySelectors: e, separator: t }) => {
781
- e(({ className: s }) => `.active .${o(`hs-carousel-active${t}${s}`)}`);
782
- }
783
- ]), n("hs-carousel-disabled", [
784
- ({ modifySelectors: e, separator: t }) => {
785
- e(({ className: s }) => `.disabled.${o(`hs-carousel${t}disabled${t}${s}`)}`);
786
- },
787
- ({ modifySelectors: e, separator: t }) => {
788
- e(({ className: s }) => `.disabled .${o(`hs-carousel${t}disabled${t}${s}`)}`);
789
- }
790
- ]), n("hs-selected", [
791
- ({ modifySelectors: e, separator: t }) => {
792
- e(({ className: s }) => `.selected.${o(`hs-selected${t}${s}`)}`);
793
- },
794
- ({ modifySelectors: e, separator: t }) => {
795
- e(({ className: s }) => `.selected .${o(`hs-selected${t}${s}`)}`);
796
- }
797
- ]), n("hs-select-disabled", [
798
- ({ modifySelectors: e, separator: t }) => {
799
- e(({ className: s }) => `.disabled.${o(`hs-select-disabled${t}${s}`)}`);
800
- },
801
- ({ modifySelectors: e, separator: t }) => {
802
- e(({ className: s }) => `.disabled .${o(`hs-select-disabled${t}${s}`)}`);
803
- }
804
- ]), n("hs-select-active", [
805
- ({ modifySelectors: e, separator: t }) => {
806
- e(({ className: s }) => `.active.${o(`hs-select-active${t}${s}`)}`);
807
- },
808
- ({ modifySelectors: e, separator: t }) => {
809
- e(({ className: s }) => `.active .${o(`hs-select-active${t}${s}`)}`);
810
- }
811
- ]), n("hs-input-number-disabled", [
812
- ({ modifySelectors: e, separator: t }) => {
813
- e(({ className: s }) => `.disabled.${o(`hs-input-number-disabled${t}${s}`)}`);
814
- },
815
- ({ modifySelectors: e, separator: t }) => {
816
- e(({ className: s }) => `.disabled .${o(`hs-input-number-disabled${t}${s}`)}`);
817
- }
818
- ]), n("hs-pin-input-active", [
819
- ({ modifySelectors: e, separator: t }) => {
820
- e(({ className: s }) => `.active.${o(`hs-pin-input-active${t}${s}`)}`);
821
- },
822
- ({ modifySelectors: e, separator: t }) => {
823
- e(({ className: s }) => `.active .${o(`hs-pin-input-active${t}${s}`)}`);
824
- }
825
- ]), n("hs-select-opened", [
826
- ({ modifySelectors: e, separator: t }) => {
827
- e(({ className: s }) => `.opened.${o(`hs-select-opened${t}${s}`)}`);
828
- }
829
- ]), n("hs-password-active", [
830
- ({ modifySelectors: e, separator: t }) => {
831
- e(({ className: s }) => `.active.${o(`hs-password-active${t}${s}`)}`);
832
- },
833
- ({ modifySelectors: e, separator: t }) => {
834
- e(({ className: s }) => `.active .${o(`hs-password-active${t}${s}`)}`);
835
- }
836
- ]), n("hs-stepper-active", [
837
- ({ modifySelectors: e, separator: t }) => {
838
- e(({ className: s }) => `.active.${o(`hs-stepper-active${t}${s}`)}`);
839
- },
840
- ({ modifySelectors: e, separator: t }) => {
841
- e(({ className: s }) => `.active .${o(`hs-stepper-active${t}${s}`)}`);
842
- }
843
- ]), n("hs-stepper-success", [
844
- ({ modifySelectors: e, separator: t }) => {
845
- e(({ className: s }) => `.success.${o(`hs-stepper-success${t}${s}`)}`);
846
- },
847
- ({ modifySelectors: e, separator: t }) => {
848
- e(({ className: s }) => `.success .${o(`hs-stepper-success${t}${s}`)}`);
849
- }
850
- ]), n("hs-stepper-completed", [
851
- ({ modifySelectors: e, separator: t }) => {
852
- e(({ className: s }) => `.completed.${o(`hs-stepper-completed${t}${s}`)}`);
853
- },
854
- ({ modifySelectors: e, separator: t }) => {
855
- e(({ className: s }) => `.completed .${o(`hs-stepper-completed${t}${s}`)}`);
856
- }
857
- ]), n("hs-stepper-error", [
858
- ({ modifySelectors: e, separator: t }) => {
859
- e(({ className: s }) => `.error.${o(`hs-stepper-error${t}${s}`)}`);
860
- },
861
- ({ modifySelectors: e, separator: t }) => {
862
- e(({ className: s }) => `.error .${o(`hs-stepper-error${t}${s}`)}`);
863
- }
864
- ]), n("hs-stepper-processed", [
865
- ({ modifySelectors: e, separator: t }) => {
866
- e(({ className: s }) => `.processed.${o(`hs-stepper-processed${t}${s}`)}`);
867
- },
868
- ({ modifySelectors: e, separator: t }) => {
869
- e(({ className: s }) => `.processed .${o(`hs-stepper-processed${t}${s}`)}`);
870
- }
871
- ]), n("hs-stepper-disabled", [
872
- ({ modifySelectors: e, separator: t }) => {
873
- e(({ className: s }) => `.disabled.${o(`hs-stepper-disabled${t}${s}`)}`);
874
- },
875
- ({ modifySelectors: e, separator: t }) => {
876
- e(({ className: s }) => `.disabled .${o(`hs-stepper-disabled${t}${s}`)}`);
877
- }
878
- ]), n("hs-stepper-skipped", [
879
- ({ modifySelectors: e, separator: t }) => {
880
- e(({ className: s }) => `.skipped.${o(`hs-stepper-skipped${t}${s}`)}`);
881
- },
882
- ({ modifySelectors: e, separator: t }) => {
883
- e(({ className: s }) => `.skipped .${o(`hs-stepper-skipped${t}${s}`)}`);
884
- }
885
- ]), n("hs-strong-password", [
886
- ({ modifySelectors: e, separator: t }) => {
887
- e(({ className: s }) => `.passed.${o(`hs-strong-password${t}${s}`)}`);
888
- },
889
- ({ modifySelectors: e, separator: t }) => {
890
- e(({ className: s }) => `.passed .${o(`hs-strong-password${t}${s}`)}`);
891
- }
892
- ]), n("hs-strong-password-accepted", [
893
- ({ modifySelectors: e, separator: t }) => {
894
- e(({ className: s }) => `.accepted.${o(`hs-strong-password-accepted${t}${s}`)}`);
895
- },
896
- ({ modifySelectors: e, separator: t }) => {
897
- e(({ className: s }) => `.accepted .${o(`hs-strong-password-accepted${t}${s}`)}`);
898
- }
899
- ]), n("hs-strong-password-active", [
900
- ({ modifySelectors: e, separator: t }) => {
901
- e(({ className: s }) => `.active.${o(`hs-strong-password-active${t}${s}`)}`);
902
- }
903
- ]), n("hs-combo-box-active", [
904
- ({ modifySelectors: e, separator: t }) => {
905
- e(({ className: s }) => `.active .${o(`hs-combo-box-active${t}${s}`)}`);
906
- },
907
- ({ modifySelectors: e, separator: t }) => {
908
- e(({ className: s }) => `.active.${o(`hs-combo-box-active${t}${s}`)}`);
909
- }
910
- ]), n("hs-combo-box-selected", [
911
- ({ modifySelectors: e, separator: t }) => {
912
- e(({ className: s }) => `.selected .${o(`hs-combo-box-selected${t}${s}`)}`);
913
- },
914
- ({ modifySelectors: e, separator: t }) => {
915
- e(({ className: s }) => `.selected.${o(`hs-combo-box-selected${t}${s}`)}`);
916
- }
917
- ]), n("hs-combo-box-tab-active", [
918
- ({ modifySelectors: e, separator: t }) => {
919
- e(({ className: s }) => `.active.${o(`hs-combo-box-tab-active${t}${s}`)}`);
920
- }
921
- ]), n("hs-apexcharts-tooltip-dark", [
922
- ({ modifySelectors: e, separator: t }) => {
923
- e(({ className: s }) => `.dark.${o(`hs-apexcharts-tooltip-dark${t}${s}`)}`);
924
- }
925
- ]), n("hs-success", [
926
- ({ modifySelectors: e, separator: t }) => {
927
- e(({ className: s }) => `.success .${o(`hs-success${t}${s}`)}`);
928
- },
929
- ({ modifySelectors: e, separator: t }) => {
930
- e(({ className: s }) => `.success.${o(`hs-success${t}${s}`)}`);
931
- }
932
- ]), n("hs-error", [
933
- ({ modifySelectors: e, separator: t }) => {
934
- e(({ className: s }) => `.error .${o(`hs-error${t}${s}`)}`);
935
- },
936
- ({ modifySelectors: e, separator: t }) => {
937
- e(({ className: s }) => `.error.${o(`hs-error${t}${s}`)}`);
938
- }
939
- ]), n("hs-default-mode-active", ({ modifySelectors: e, separator: t }) => {
940
- e(({ className: s }) => `.default .${o(`hs-default-mode-active${t}${s}`)}`);
941
- }), n("hs-dark-mode-active", ({ modifySelectors: e, separator: t }) => {
942
- e(({ className: s }) => `.dark .${o(`hs-dark-mode-active${t}${s}`)}`);
943
- }), n("hs-auto-mode-active", ({ modifySelectors: e, separator: t }) => {
944
- e(({ className: s }) => `.auto .${o(`hs-auto-mode-active${t}${s}`)}`);
945
- });
946
- }, js = ({ model: n }) => {
947
- const [o] = At(), [e] = C(), [t] = xe(), [s] = M(), [d] = A(), [a] = k(ke), { document: i, window: l } = K(), [c] = j(i == null ? void 0 : i.getElementById("highlighted-block")), [p] = j(
948
- i == null ? void 0 : i.getElementById("selected-block")
949
- ), [m] = j(
950
- i == null ? void 0 : i.getElementById("selected-styling-block")
951
- ), [h] = j(i == null ? void 0 : i.getElementById("dragged-block"));
952
- b(() => {
953
- t ? i == null || i.documentElement.classList.add("dark") : i == null || i.documentElement.classList.remove("dark");
954
- }, [t, i]);
955
- const $ = f(o, "headingFont", "DM Sans"), w = f(o, "bodyFont", "DM Sans");
956
- return b(() => {
957
- const g = f(o, "primaryColor", "#000"), u = f(o, "secondaryColor", "#FFF"), v = Wt([
958
- { color: g, name: "primary" },
959
- { color: u, name: "secondary" }
960
- ]), E = f(o, "roundedCorners", "0");
961
- !l || !l.tailwind || (l.tailwind.config = {
962
- darkMode: "class",
963
- theme: {
964
- fontFamily: {
965
- heading: [$],
966
- body: [w]
967
- },
968
- extend: {
969
- borderRadius: {
970
- global: `${E || "0"}px`
971
- },
972
- colors: v
973
- }
974
- },
975
- plugins: [Ht, zt, Ut, l.tailwind.plugin.withOptions(() => ws)]
976
- });
977
- }, [o, l, $, w]), b(() => {
978
- p && (p.textContent = `${F(e, (g) => `[data-block-id="${g}"]`).join(",")}{
979
- outline: 1px solid ${e.length === 1 ? "#42a1fc" : "orange"} !important; outline-offset: -1px;
980
- }`);
981
- }, [e, p]), b(() => {
982
- if (!a) {
983
- h.textContent = "";
984
- return;
985
- }
986
- h.textContent = `[data-block-id="${a}"]{ pointer-events: none !important; opacity: 0.2 !important}`;
987
- }, [a]), b(() => {
988
- c && (c.textContent = s ? `[data-style-id="${s}"]{ outline: 1px solid #42a1fc !important; outline-offset: -1px;}` : "");
989
- }, [s, e, c]), b(() => {
990
- m && (m.textContent = `${F(d, ({ id: g }) => `[data-style-id="${g}"]`).join(",")}{
991
- outline: 1px solid #42a1fc !important; outline-offset: -1px;
992
- }`);
993
- }, [d, m]), b(() => {
994
- const g = f(o, "bodyTextLightColor", "#64748b"), u = f(o, "bodyTextDarkColor", "#94a3b8"), v = f(o, "bodyBgLightColor", "#FFFFFF"), E = f(o, "bodyBgDarkColor", "#0f172a");
995
- i.body.className = `font-body antialiased text-[${g}] bg-[${v}] dark:text-[${u}] dark:bg-[${E}]`;
996
- }, [o, i, n]), n === "page" ? /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
997
- $ && /* @__PURE__ */ r.jsx(
998
- "link",
999
- {
1000
- id: "heading-font",
1001
- rel: "stylesheet",
1002
- type: "text/css",
1003
- href: `https://fonts.googleapis.com/css2?family=${$.replace(
1004
- / /g,
1005
- "+"
1006
- )}:wght@300;400;500;600;700;800;900&display=swap`,
1007
- media: "all"
1008
- }
1009
- ),
1010
- w && $ !== w && /* @__PURE__ */ r.jsx(
1011
- "link",
1012
- {
1013
- id: "body-font",
1014
- rel: "stylesheet",
1015
- type: "text/css",
1016
- href: `https://fonts.googleapis.com/css2?family=${w.replace(
1017
- / /g,
1018
- "+"
1019
- )}:wght@300;400;500;600;700;800;900&display=swap`,
1020
- media: "all"
1021
- }
1022
- ),
1023
- $ && /* @__PURE__ */ r.jsx("style", { children: `h1,h2,h3,h4,h5,h6{font-family: "${$}",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";}` })
1024
- ] }) : null;
1025
- }, Cs = (n) => {
1026
- const o = {};
1027
- return Object.keys(n).forEach((e) => {
1028
- X(n[e]) && n[e].startsWith(le) && (o[e] = n[e].replace(le, "").split(","));
1029
- }), o;
1030
- }, Bs = Ue((n) => {
1031
- const o = n.replace(Ce, "").split(",");
1032
- return Kt(o[0], o[1]);
1033
- });
1034
- function Ss(n, o) {
1035
- return f(n, `${o}_attrs`, {});
1036
- }
1037
- function Ds(n) {
1038
- const o = {};
1039
- return Object.keys(n).forEach((e) => {
1040
- if (X(n[e]) && n[e].startsWith(Ce)) {
1041
- const t = Bs(n[e]);
1042
- o[e] = {
1043
- className: t,
1044
- "data-style-prop": e,
1045
- "data-block-parent": n._id,
1046
- "data-style-id": `${e}-${n._id}`,
1047
- ...Ss(n, e)
1048
- };
1049
- }
1050
- }), o;
1051
- }
1052
- function Is(n, o) {
1053
- const e = f(n, "_bindings", {});
1054
- return S(e) ? { ...n } : (We(e, (t, s) => {
1055
- X(t) && f(o, t, null) && (n[s] = f(o, t, null));
1056
- }), n);
1057
- }
1058
- function G({ blocks: n }) {
1059
- const [o] = ee(), [e] = Gt(), t = P((i) => Ds(i), []), [s] = Jt(), [d] = k(L), a = P(
1060
- (i) => i.reduce((l, c) => {
1061
- const p = f(e, c, {});
1062
- return { ...l, ...p };
1063
- }, {}),
1064
- [e, o]
1065
- );
1066
- return /* @__PURE__ */ r.jsx(r.Fragment, { children: N.Children.toArray(
1067
- n.map((i, l) => {
1068
- if (d === i._id)
1069
- return null;
1070
- const c = Cs(i), p = {};
1071
- S(c) || Object.keys(c).forEach((u) => {
1072
- p[u] = N.Children.toArray(
1073
- c[u].map((v) => /* @__PURE__ */ r.jsx(G, { blocks: [qe(o, { _id: v })] }))
1074
- );
1075
- });
1076
- const m = ge(o, { _parent: i._id });
1077
- p.children = m.length ? /* @__PURE__ */ r.jsx(G, { blocks: m }) : null;
1078
- const h = Yt(i._type), $ = f(h, "builderComponent", f(h, "component", null));
1079
- if (Ke($))
1080
- return /* @__PURE__ */ r.jsx("noscript", { children: `<!-- ${i == null ? void 0 : i._type} not registered -->` });
1081
- const w = Q(h, "getBlockStateFrom") ? h == null ? void 0 : h.getBlockStateFrom(i, o) : [], g = a(w);
1082
- return /* @__PURE__ */ r.jsx(he, { children: N.createElement($, {
1083
- blockProps: {
1084
- "data-block-id": i._id,
1085
- "data-block-type": i._type,
1086
- "data-dnd": Q(h, "canAcceptBlock") ? "branch" : "leaf"
1087
- },
1088
- index: l,
1089
- ...Is(i, s),
1090
- ...t(i),
1091
- ...p,
1092
- inBuilder: !0,
1093
- blockState: g
1094
- }) });
1095
- })
1096
- ) });
1097
- }
1098
- const _s = () => {
1099
- const [n] = ee(), o = S(n) ? null : /* @__PURE__ */ r.jsx(Qt, { children: /* @__PURE__ */ r.jsx(G, { blocks: ge(n, (e) => S(e._parent)) }) });
1100
- return /* @__PURE__ */ r.jsx(qt, { children: o });
1101
- }, Ns = (n, o) => n.querySelector(`[data-style-id="${o}"]`), As = () => {
1102
- const [n] = k(Mt), [o] = ye(), [e] = V(), [, t] = C(), s = Et(), [, d] = M(), a = oe(null), i = oe(null), [l, c] = j({ width: 0, height: 0 }), p = rs(l), [m, h] = j(0), [$, w] = j([]), [, g] = j([]), [, u] = k(Tt), [v, E] = A(), Me = W("loading", !1);
1103
- b(() => {
1104
- const { clientWidth: x, clientHeight: D } = i.current;
1105
- c({ width: x, height: D }), m === 0 && h(x);
1106
- }, [i, e, m]);
1107
- const Ee = (x, D = 0) => {
1108
- const { top: I } = x.getBoundingClientRect();
1109
- return I + D >= 0 && I - D <= window.innerHeight;
1110
- };
1111
- b(() => {
1112
- var x, D;
1113
- if (s && s.type !== "Multiple" && a.current) {
1114
- const I = Ae(a.current.contentDocument, s._id);
1115
- I && (Ee(I) || (D = (x = a.current) == null ? void 0 : x.contentWindow) == null || D.scrollTo({ top: I.offsetTop, behavior: "smooth" }), w([I]));
1116
- }
1117
- }, [s]), b(() => {
1118
- if (!S(v) && a.current) {
1119
- const x = Ns(
1120
- a.current.contentDocument,
1121
- z(v).id
1122
- );
1123
- g(x ? [x] : [null]);
1124
- } else
1125
- g([null]);
1126
- }, [v]);
1127
- const Te = Pe(() => {
1128
- let x = ns;
1129
- return n === "offline" && (x = x.replace(
1130
- "https://old.chaibuilder.com/offline/tailwind.cdn.js",
1131
- "/offline/tailwind.cdn.js"
1132
- ), x = x.replace("https://unpkg.com/aos@next/dist/aos.css", "/offline/aos.css"), x = x.replace("https://unpkg.com/aos@next/dist/aos.js", "/offline/aos.js")), x;
1133
- }, [n]);
1134
- return /* @__PURE__ */ r.jsx(
1135
- "div",
1136
- {
1137
- onClick: () => {
1138
- t([]), E([]);
1139
- },
1140
- onMouseLeave: () => setTimeout(() => d(""), 300),
1141
- className: "relative mx-auto h-full w-full overflow-hidden",
1142
- style: m > 0 && !S(p) ? { width: o ? "100%" : m } : {},
1143
- ref: i,
1144
- children: /* @__PURE__ */ r.jsxs(
1145
- as,
1146
- {
1147
- contentDidMount: () => u(a.current),
1148
- ref: a,
1149
- id: "canvas-iframe",
1150
- style: { width: `${e}px`, ...p },
1151
- className: "relative mx-auto box-content h-full max-w-full shadow-lg transition-all duration-300 ease-linear",
1152
- initialContent: Te,
1153
- children: [
1154
- /* @__PURE__ */ r.jsx(ys, {}),
1155
- /* @__PURE__ */ r.jsx(
1156
- ks,
1157
- {
1158
- block: s,
1159
- selectedBlockElement: z($)
1160
- }
1161
- ),
1162
- /* @__PURE__ */ r.jsx(js, { model: "page" }),
1163
- /* @__PURE__ */ r.jsx(vs, { children: Me ? /* @__PURE__ */ r.jsx("div", { className: "h-full p-4", children: /* @__PURE__ */ r.jsx(we, { className: "h-full" }) }) : /* @__PURE__ */ r.jsx(_s, {}) }),
1164
- /* @__PURE__ */ r.jsx("br", {}),
1165
- /* @__PURE__ */ r.jsx("div", { id: "placeholder", className: "absolute z-[99999] max-w-full bg-green-500 transition-transform" })
1166
- ]
1167
- }
1168
- )
1169
- }
1170
- );
1171
- }, Eo = () => /* @__PURE__ */ r.jsxs("div", { className: "flex h-full w-full flex-col", children: [
1172
- /* @__PURE__ */ r.jsx(os, {}),
1173
- /* @__PURE__ */ r.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__ */ r.jsx(he, { fallback: /* @__PURE__ */ r.jsx(we, { className: "h-full" }), children: /* @__PURE__ */ r.jsx(Zt, { children: /* @__PURE__ */ r.jsx(As, {}) }) }) })
1174
- ] });
1175
- export {
1176
- Eo as default
1177
- };