useblocks 1.1.71 → 1.1.81

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 (61) hide show
  1. package/CHANGELOG.md +426 -0
  2. package/README.md +38 -0
  3. package/iframe/js/amp.Da_6yDxX.js +1 -0
  4. package/iframe/js/iframe-eblock.js +1 -1
  5. package/iframe/js/iframe.js +1 -1
  6. package/iframe/js/rules.4N5s3OV-.js +1 -1
  7. package/package.json +30 -9
  8. package/static/core/1ab52017.js +2134 -0
  9. package/static/core/4296ff4b.js +3280 -0
  10. package/static/core/{63206e112.js → 496a28e52.js} +2682 -2421
  11. package/static/core/{9ab1c444.js → 5cc21a00.js} +2302 -2432
  12. package/static/core/{b9b92e01.js → 6a3ea43c.js} +15 -15
  13. package/static/core/{e02024fb2.js → 6fc5508e2.js} +69 -69
  14. package/static/core/{ea6c5c93.js → 7cff1d56.js} +3327 -2997
  15. package/static/core/87de8255.js +1098 -0
  16. package/static/core/{3f22a9d32.js → 909c874d2.js} +1196 -1123
  17. package/static/core/{c3b45fb6.js → ace7c2d1.js} +7 -7
  18. package/static/core/{5e082e16.js → c287f8b6.js} +38 -38
  19. package/static/core/{585259872.js → cc4c61c42.js} +108 -108
  20. package/static/core/{222d29d9.js → d2293148.js} +272 -248
  21. package/static/core/{e4d01015.js → d70b5c31.js} +22367 -19437
  22. package/static/core/{68ec11c8.js → dfbad00e.js} +4 -4
  23. package/static/core/{ce9be2ec2.js → f2b0c97b2.js} +2138 -2086
  24. package/static/core/{d3bbb05e.js → f7e3905a.js} +3 -3
  25. package/static/core/{513594a8.js → fc514220.js} +34 -34
  26. package/static/umd-runtime/ui-kit.js +1171 -1103
  27. package/ui-kit/index.js +1541 -1469
  28. package/{useblocks-core.77131b3d.js → useblocks-core.0a682f7d.js} +6 -6
  29. package/useblocks-esm.js +4 -4
  30. package/{useblocks-po.77131b3d.js → useblocks-po.0a682f7d.js} +1 -1
  31. package/useblocks.d.ts +66 -0
  32. package/useblocks.js +3 -3
  33. package/favicon-b.ico +0 -0
  34. package/favicon.ico +0 -0
  35. package/fonts/SegoeUI-Bold.woff2 +0 -0
  36. package/fonts/SegoeUI-Semibold.woff2 +0 -0
  37. package/fonts/SegoeUI.woff2 +0 -0
  38. package/iframe/js/amp.DllX-Im0.js +0 -1
  39. package/js/amplitude.min.js +0 -10859
  40. package/js/sourcebuster.min.js +0 -672
  41. package/manifest.json +0 -17
  42. package/npm-publish.manifest.json +0 -51
  43. package/static/core/23546a64.js +0 -925
  44. package/static/core/35ad3ae5.js +0 -3150
  45. package/static/core/36bf6931.js +0 -2119
  46. package/static/media/image-editor/images/samples/large_sample.jpg +0 -0
  47. package/static/media/image-editor/images/samples/sample1.jpg +0 -0
  48. package/static/media/image-editor/images/samples/sample1_thumbnail.jpg +0 -0
  49. package/static/media/image-editor/images/samples/sample2.jpg +0 -0
  50. package/static/media/image-editor/images/samples/sample2_thumbnail.jpg +0 -0
  51. package/static/media/image-editor/images/samples/sample3.jpg +0 -0
  52. package/static/media/image-editor/images/samples/sample3_thumbnail.jpg +0 -0
  53. package/static/media/image-editor/images/samples/sample4.json +0 -871
  54. package/static/media/image-editor/images/samples/sample4_preview.jpg +0 -0
  55. package/test-font.otf +0 -0
  56. package/test-font.ttf +0 -0
  57. package/test-font.woff2 +0 -0
  58. package/tsconfig.json +0 -14
  59. package/two_step_headless_plugin.html +0 -558
  60. /package/iframe/{iframe-eblock.77131b3d.html → iframe-eblock.0a682f7d.html} +0 -0
  61. /package/iframe/{iframe.77131b3d.html → iframe.0a682f7d.html} +0 -0
@@ -0,0 +1,2134 @@
1
+ (function(){try{if(typeof document<"u"){var o=document.createElement("style");o.setAttribute("data-useblocks","true"),o.appendChild(document.createTextNode(".blocks-app .image-preview{text-align:center;min-height:100px;position:relative}.blocks-app .image-preview .image-editor-modal{border:1px solid red}.blocks-app .image-preview__edit-button{position:absolute;bottom:10px;left:50%;transform:translate(-50%)}.blocks-app .image-preview img{border:1px solid var(--ub-colorBorder);border-radius:6px;max-width:100%;max-height:500px}.blocks-app .image-editor-modal .ant-modal-container{flex-direction:column;min-height:100vh;display:flex;border-radius:0!important}.blocks-app .image-editor-modal .ant-modal-body{flex-grow:1;display:flex}.blocks-app .image-editor-modal .ant-modal-body #pixie-editor{flex-grow:1;height:calc(100vh - 70px);min-height:calc(100vh - 70px);overflow:hidden}.blocks-app .image-editor-modal .pi .text-on-primary{background:var(--ub-colorPrimary);border-color:var(--ub-colorPrimary)}.blocks-app .image-editor-modal .pi .text-on-primary:hover{background:var(--ub-colorPrimaryHover);border-color:var(--ub-colorPrimaryHover)}.blocks-app .image-editor-modal .pi .text-on-primary.rounded-full{border-radius:calc(var(--ub-borderRadius) * 1px)}.blocks-app .image-editor-modal .pi .shadow-xl{box-shadow:none}.blocks-app .image-editor-modal .w-\\[4ch\\].text-sm.text-center{width:5ch}.blocks-app .image-editor-modal .pi .border-white{border-color:var(--ub-colorPrimary)}.blocks-app .image-editor-modal .pi .bg-white\\/50{background-color:var(--ub-colorPrimary)}.blocks-app .image-editor-modal .pi .text-on-primary{color:var(--ub-colorWhite)}.blocks-app .serach-results .ant-row{align-items:center}.blocks-app .serach-results .blocks-search__divider-wrapper{margin-top:12px;position:relative}.blocks-app .serach-results .blocks-search__divider-wrapper .ant-divider-horizontal{border-top:1px solid var(--ub-colorBorderSecondary);background:0 0;width:100%;height:1px;min-height:0;margin:0;position:static}.blocks-app .slideshow-container{width:524px;height:350px;margin:auto;position:relative;overflow:hidden}.blocks-app .slideshow-image{opacity:0;width:100%;height:100%;position:absolute;top:0;left:0}.blocks-app .image-ai .slideshow-image{width:auto;height:auto}.blocks-app .image-ai__image-item{text-align:center;border-radius:6px;justify-content:center;align-items:center;min-height:100px;display:flex;position:relative}.blocks-app .image-ai__image-item .buttons{justify-content:space-between;display:flex;position:absolute;bottom:10px;left:50%;transform:translate(-50%)}.blocks-app .image-ai .text-area-input-hybrid{border:none;outline:none;min-height:0;padding:0 0 0 1px}.blocks-app .image-ai .text-area-input-hybrid textarea{height:32px;min-height:32px;padding:3px 11px;line-height:26px}.blocks-app .image-ai__loading{justify-content:center;align-items:center;min-height:150px;display:flex}.blocks-app .image-ai__loading .spin{flex-direction:column;justify-content:center;align-items:center;height:150px;display:flex}.blocks-app .image-ai__loading .status{margin:3px 0 0}.blocks-app .image-ai__preview{border-radius:6px;margin-top:24px;overflow:hidden}.blocks-app .image-ai__preview .image-ai__image-item img{border-radius:calc(var(--ub-borderRadius) * 1px);object-fit:contain;max-height:100%;transition:height 1s;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)}.blocks-app .image-ai .small{width:302px;height:202px}.blocks-app .image-ai .large{width:524px;height:350px}.blocks-app .image-ai .image-ai__row{padding:0 2px}.blocks-app .image-ai .image-ai__input-affix-wrapper{border-style:solid;border-width:calc(var(--ub-borderWidth) * 1px);border-color:var(--ub-colorFillSecondaryDarken);border-radius:calc(var(--ub-borderRadius) * 1px);width:100%;padding-left:0;display:inline-flex}.blocks-app .image-ai .image-ai__input-affix-wrapper:hover{border-color:var(--ub-borderColorHover)}.blocks-app .image-ai .image-ai__input-affix-wrapper.ant-input-affix-wrapper-focused{border-color:var(--ub-colorPrimaryBorder)}.blocks-app .image-ai .image-ai__textarea{font-size:16px}.blocks-app .image-ai .image-ai__input-icon{font-size:16px;top:0;right:0}.dark .blocks-app .image-ai .image-ai__preview .image-ai__image-item img{background:#2b2b2b;border:1px solid #434343}.dark .blocks-app .image-ai .ant-btn{background:#1f1f1f}.dark .blocks-app .image-ai .ant-btn:hover{color:var(--ub-colorPrimary)}.blocks-app .stock-tab img{border-radius:0;max-width:none;max-height:none}.blocks-app .stock-tab .stock-search-input{padding:0 2px}.blocks-app .stock-tab .my-masonry-grid{text-align:center;width:auto;display:flex}.blocks-app .stock-tab .my-masonry-grid_column{background-clip:padding-box}.blocks-app .stock-tab .list-item{cursor:pointer;background:#f0f2f5;border:1px solid #f0f2f5;border-radius:6px;min-height:100px;max-height:100px;margin-bottom:20px;transition:all .3s;display:inline-block;position:relative;overflow:hidden}.blocks-app .stock-tab .list-item .overlay-image{opacity:0;background-size:cover;width:110px;height:40px;transition:opacity .5s;position:absolute;bottom:10px;right:10px}.blocks-app .stock-tab .list-item .ant-spin{color:#f0f2f5;font-size:20px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.blocks-app .stock-tab .list-item img{object-fit:cover;opacity:0;border-radius:6px;height:auto;transition:opacity .5s ease-in-out;display:block}.blocks-app .stock-tab .list-item.loaded{border:1px solid #d9d9d9;max-height:1000px}.blocks-app .stock-tab .list-item.loaded img{opacity:1;height:100%}.blocks-app .stock-tab .list-item.loaded .loaded-image{opacity:.5}.blocks-app .stock-tab .list-item:hover{box-shadow:0 1px 2px -2px #00000029,0 3px 6px #0000001f,0 5px 12px 4px #00000017}.blocks-app .stock-tab .list-item:hover p.creator-info,.blocks-app .stock-tab .list-item:hover .overlay-image{opacity:1}.blocks-app .stock-tab .list-item p.creator-info{color:#fff;opacity:0;background-color:#00000080;border-radius:0 0 6px;margin:0;padding:5px;font-size:10px;line-height:1.2;position:absolute;bottom:0;right:0}.blocks-app .stock-tab .list-item p.creator-info:hover a{color:#fff;text-decoration:underline}.blocks-app .stock-tab .list-item p.creator-info a{color:#fff;text-decoration:none}.blocks-app .stock-color-filter{display:flex}.blocks-app .stock-color-filter label{border-width:1px;width:24px;height:24px;margin:4px;padding:0;font-size:0;border-radius:6px!important}.blocks-app .stock-color-filter label.all-colors{background-image:linear-gradient(135deg,red,#ff7f00,#ff0,#0f0,#00f,#8b00ff)}.blocks-app .stock-color-filter label.black-color{background:#222}.blocks-app .stock-color-filter label.bw-color{background-image:linear-gradient(135deg,#222 50%,#fff 50%)}.blocks-app .stock-color-filter label.white-color{background:#fff}.blocks-app .stock-color-filter label.orange-color{background:#fa8c16}.blocks-app .stock-color-filter label.red-color{background:#f5222d}.blocks-app .stock-color-filter label.purple-color{background:#722ed1}.blocks-app .stock-color-filter label.magenta-color{background:#eb2f96}.blocks-app .stock-color-filter label.green-color{background:#52c41a}.blocks-app .stock-color-filter label.teal-color{background:#43c3c3}.blocks-app .stock-color-filter label.blue-color{background:#1677ff}.blocks-app .stock-color-filter .ant-radio-button-wrapper:not(:first-child):before{display:none}.blocks-app .serach-results{padding-top:6px}.blocks-app .serach-results .stock-search-input{width:322px;padding:0 2px}.blocks-app .serach-results .blocks-search__divider-wrapper{width:calc(100% + 48px);margin-top:12px;margin-left:-24px;margin-right:-24px;position:relative}.blocks-app .serach-results .blocks-search__divider-wrapper .ant-divider-horizontal{pointer-events:none;border-top:1px solid var(--ub-colorBorderSecondary);background:linear-gradient(180deg, var(--ub-colorBgContainerDisabled), transparent 40%);border-bottom:none;width:100%;height:20px;min-height:20px;margin:0;position:relative;bottom:auto;left:auto;right:auto}.dark .blocks-app .image-center .stock-tab .serach-results .blocks-search__divider-wrapper .ant-divider-horizontal{background:linear-gradient(180deg, var(--ub-colorBgBase), transparent 40%)}.dark .blocks-app .stock-tab .list-item{background:#2b2b2b;border:1px solid #2b2b2b}.dark .blocks-app .stock-tab .list-item.loaded{border:1px solid #434343}.blocks-app .image-center .image-center-image-preview{justify-content:center;align-items:center;display:flex}.blocks-app .image-center .ant-divider-horizontal{pointer-events:none;z-index:1;background:linear-gradient(180deg, var(--ub-colorBgContainerDisabled), transparent 40%);width:calc(100% + 48px);height:20px;margin:24px -24px 0;position:absolute;bottom:-19px}.dark .blocks-app .image-center .ant-divider-horizontal{background:linear-gradient(180deg, var(--ub-colorBgBase), transparent 40%)}.blocks-app .image-center .ant-divider-horizontal.ant-divider-with-text{background:0 0;width:calc(100% + 38px);margin:0 -24px 20px;position:relative;top:0}.blocks-app .image-center img{border-radius:4px;max-width:524px;max-height:352px}.blocks-app .image-center .image-size{justify-content:center;margin-top:6px;font-size:14px;line-height:22px;display:flex}.blocks-app .image-center .ant-upload.ant-upload-drag{border-radius:6px}.blocks-app .image-center .ant-modal-body .stock-search-input{margin-bottom:0}.blocks-app .image-center .ant-modal-body .serach-results .stock-search-input{margin-bottom:10px}.blocks-app .image-center .ant-modal-body .ant-form:not(.serach-results) .ant-form-item:last-child{margin-bottom:0}.blocks-app .image-center .ant-modal-body .ant-tabs{transition:all .7s cubic-bezier(.075,.82,.165,1)}.blocks-app .image-center .ant-modal-body .ant-tabs .ant-tabs-content-holder{overflow-y:clip}.blocks-app .ant-modal{transition:width .7s ease-in-out}")),document.head.appendChild(o)}}catch(a){console.error("vite-plugin-css-injected-by-js",a)}})();
2
+ __useblocks__.define("static/core/1ab52017.js", [
3
+ "require",
4
+ "exports",
5
+ "module",
6
+ "static/core/df237243.js",
7
+ "static/core/7cff1d56.js",
8
+ "static/core/87de8255.js",
9
+ "static/core/4296ff4b.js",
10
+ "static/core/909c874d2.js",
11
+ "static/core/496a28e52.js",
12
+ "static/core/cf655a1a.js",
13
+ "static/core/6e2a0152.js",
14
+ "react",
15
+ "react/jsx-runtime"
16
+ ], function(ue, bt, hn) {
17
+ const Xe = ue("./df237243.js"), d = ue("./7cff1d56.js"), ee = ue("./87de8255.js"), te = ue("./4296ff4b.js"), f = ue("./909c874d2.js"), R = ue("./496a28e52.js"), wt = ue("./cf655a1a.js"), Je = ue("./6e2a0152.js");
18
+ let n = ue("react");
19
+ n = Xe.__toESM(n);
20
+ let r = ue("react/jsx-runtime");
21
+ var At = Xe.__toESM(te.require_prop_types());
22
+ function It(t, e) {
23
+ return { [t]: {
24
+ Filter: e("Filter"),
25
+ filter: e("filter"),
26
+ Resize: e("Resize"),
27
+ resize: e("resize"),
28
+ Crop: e("Crop"),
29
+ Width: e("Width"),
30
+ width: e("width"),
31
+ Height: e("Height"),
32
+ height: e("height"),
33
+ "Background color": e("Background color"),
34
+ Cancel: e("Cancel"),
35
+ Create: e("Create"),
36
+ Objects: e("Objects"),
37
+ Quality: e("Quality"),
38
+ Save: e("Save"),
39
+ "Loading Canvas": e("Loading Canvas"),
40
+ "Loading Image": e("Loading Image"),
41
+ "Loading State": e("Loading State"),
42
+ "Processing Image": e("Processing Image"),
43
+ Close: e("Close"),
44
+ Apply: e("Apply"),
45
+ Font: e("Font"),
46
+ Color: e("Color"),
47
+ Background: e("Background"),
48
+ Image: e("Image"),
49
+ Opacity: e("Opacity"),
50
+ Outline: e("Outline"),
51
+ Shadow: e("Shadow"),
52
+ Gradient: e("Gradient"),
53
+ Texture: e("Texture"),
54
+ "Replace Image": e("Replace Image"),
55
+ "Outline Color": e("Outline Color"),
56
+ "Shadow Color": e("Shadow Color"),
57
+ "Font Size": e("Font Size"),
58
+ Radius: e("Radius"),
59
+ "Brush Color": e("Brush Color"),
60
+ "Brush Type": e("Brush Type"),
61
+ "Brush Size": e("Brush Size"),
62
+ History: e("History"),
63
+ "Maintain aspect ratio": e("Maintain aspect ratio"),
64
+ "New Text": e("New Text"),
65
+ Size: e("Size"),
66
+ Draw: e("Draw"),
67
+ Text: e("Text"),
68
+ Stickers: e("Stickers"),
69
+ Frame: e("Frame"),
70
+ Shapes: e("Shapes"),
71
+ Corners: e("Corners"),
72
+ corners: e("corners"),
73
+ Done: e("Done"),
74
+ "Applied Filters": e("Applied Filters"),
75
+ "Resized Image": e("Resized Image"),
76
+ "Cropped Image": e("Cropped Image"),
77
+ "Added Drawing": e("Added Drawing"),
78
+ "Added Text": e("Added Text"),
79
+ "Added Shape": e("Added Shape"),
80
+ "Added Sticker": e("Added Sticker"),
81
+ "Added Frame": e("Added Frame"),
82
+ "Merged Objects": e("Merged Objects"),
83
+ "Rounded Corner": e("Rounded Corner"),
84
+ "Replaced Background Image": e("Replaced Background Image"),
85
+ "Added Image": e("Added Image"),
86
+ Initial: e("Initial"),
87
+ "Loaded State": e("Loaded State"),
88
+ "Changed Style": e("Changed Style"),
89
+ "Deleted object": e("Deleted object"),
90
+ Merge: e("Merge"),
91
+ Emoticons: e("Emoticons"),
92
+ Doodles: e("Doodles"),
93
+ Landmarks: e("Landmarks"),
94
+ Bubbles: e("Bubbles"),
95
+ Transportation: e("Transportation"),
96
+ Beach: e("Beach"),
97
+ PencilBrush: e("PencilBrush"),
98
+ SprayBrush: e("SprayBrush"),
99
+ CircleBrush: e("CircleBrush"),
100
+ DiamondBrush: e("DiamondBrush"),
101
+ VLineBrush: e("VLineBrush"),
102
+ HLineBrush: e("HLineBrush"),
103
+ SquareBrush: e("SquareBrush"),
104
+ Square: e("Square"),
105
+ square: e("square")
106
+ } };
107
+ }
108
+ function $e(t, e = "application/octet-stream") {
109
+ let s = t.trim(), i = e?.trim() || "application/octet-stream";
110
+ const o = s.indexOf(",");
111
+ if (s.startsWith("data:") && o >= 0) {
112
+ const g = s.slice(5, o).split(";")[0]?.trim();
113
+ g && (i = g), s = s.slice(o + 1);
114
+ }
115
+ const l = s.replace(/\s/g, ""), m = atob(l), p = new Uint8Array(m.length);
116
+ for (let g = 0; g < m.length; g++) p[g] = m.charCodeAt(g);
117
+ return new Blob([p], { type: i });
118
+ }
119
+ var xt = "static/media/image-editor", St = { text: {
120
+ replaceDefaultItems: !0,
121
+ defaultText: "Handwriting",
122
+ items: [
123
+ {
124
+ family: "Inter",
125
+ src: "fonts/inter-v20-cyrillic_latin-regular.woff2"
126
+ },
127
+ {
128
+ family: "Commissioner",
129
+ src: "fonts/commissioner-v24-cyrillic_latin-regular.woff2"
130
+ },
131
+ {
132
+ family: "Montserrat Light",
133
+ src: "fonts/Montserrat-Light.woff2"
134
+ },
135
+ {
136
+ family: "Montserrat Regular",
137
+ src: "fonts/Montserrat-Regular.woff2"
138
+ },
139
+ {
140
+ family: "Montserrat Bold",
141
+ src: "fonts/Montserrat-Bold.woff2"
142
+ },
143
+ {
144
+ family: "Montserrat Black",
145
+ src: "fonts/Montserrat-Black.woff2"
146
+ },
147
+ {
148
+ family: "Roboto Light",
149
+ src: "fonts/Roboto-Light.woff2"
150
+ },
151
+ {
152
+ family: "Roboto Regular",
153
+ src: "fonts/Roboto-Regular.woff2"
154
+ },
155
+ {
156
+ family: "Roboto Bold",
157
+ src: "fonts/Roboto-Bold.woff2"
158
+ },
159
+ {
160
+ family: "Roboto Black",
161
+ src: "fonts/Roboto-Black.woff2"
162
+ },
163
+ {
164
+ family: "Lato Light",
165
+ src: "fonts/Lato-Light.woff2"
166
+ },
167
+ {
168
+ family: "Lato Regular",
169
+ src: "fonts/Lato-Regular.woff2"
170
+ },
171
+ {
172
+ family: "Lato Bold",
173
+ src: "fonts/Lato-Bold.woff2"
174
+ },
175
+ {
176
+ family: "Lato Black",
177
+ src: "fonts/Lato-Black.woff2"
178
+ },
179
+ {
180
+ family: "Rubik Light",
181
+ src: "fonts/Rubik-Light.woff2"
182
+ },
183
+ {
184
+ family: "Rubik Regular",
185
+ src: "fonts/Rubik-Regular.woff2"
186
+ },
187
+ {
188
+ family: "Rubik Bold",
189
+ src: "fonts/Rubik-Bold.woff2"
190
+ },
191
+ {
192
+ family: "Rubik Black",
193
+ src: "fonts/Rubik-Black.woff2"
194
+ },
195
+ {
196
+ family: "Bebas Neue Light",
197
+ src: "fonts/BebasNeueLight.woff2"
198
+ },
199
+ {
200
+ family: "Bebas Neue Regular",
201
+ src: "fonts/BebasNeueRegular.woff2"
202
+ },
203
+ {
204
+ family: "Bebas Neue Book",
205
+ src: "fonts/BebasNeueBook.woff2"
206
+ },
207
+ {
208
+ family: "Bebas Neue Bold",
209
+ src: "fonts/BebasNeueBold.woff2"
210
+ },
211
+ {
212
+ family: "Fira Sans",
213
+ src: "fonts/fira-sans-v11-latin-ext_latin_cyrillic-regular.woff2"
214
+ },
215
+ {
216
+ family: "Lobster",
217
+ src: "fonts/Lobster.woff2"
218
+ },
219
+ {
220
+ family: "Pacifico",
221
+ src: "fonts/pacifico-v23-cyrillic_latin-regular.woff2"
222
+ },
223
+ {
224
+ family: "Playfair Display",
225
+ src: "fonts/playfair-display-v40-cyrillic_latin-regular.woff2"
226
+ },
227
+ {
228
+ family: "Oswald",
229
+ src: "fonts/oswald-v57-cyrillic_latin-regular.woff2"
230
+ },
231
+ {
232
+ family: "Caveat",
233
+ src: "fonts/caveat-v23-cyrillic_latin-regular.woff2"
234
+ }
235
+ ]
236
+ } };
237
+ function kt(t, e, s, i) {
238
+ if (e.type === "linear") {
239
+ const o = t.createLinearGradient(s + e.coords.x1, i + e.coords.y1, s + e.coords.x2, i + e.coords.y2);
240
+ return e.colorStops.forEach((l) => o.addColorStop(l.offset, l.color)), o;
241
+ }
242
+ if (e.type === "radial") {
243
+ const o = t.createRadialGradient(s + e.coords.x1, i + e.coords.y1, e.coords.r1 ?? 0, s + e.coords.x2, i + e.coords.y2, e.coords.r2 ?? 0);
244
+ return e.colorStops.forEach((l) => o.addColorStop(l.offset, l.color)), o;
245
+ }
246
+ throw new Error("Unknown gradient type");
247
+ }
248
+ function Et(t) {
249
+ if (!this.backgroundColor) return;
250
+ const e = this._getNonTransformedDimensions(), s = -e.x / 2, i = -e.y / 2, o = e.x, l = e.y, m = this.backgroundColor;
251
+ if (typeof m == "string" || m instanceof CanvasGradient || m instanceof CanvasPattern) t.fillStyle = m, t.fillRect(s, i, o, l);
252
+ else if (typeof m == "object" && "type" in m && (m.type === "linear" || m.type === "radial")) t.fillStyle = kt(t, m, s, i), t.fillRect(s, i, o, l);
253
+ else if ("source" in m && (m.source instanceof HTMLImageElement || m.source instanceof HTMLCanvasElement)) if (m.repeat) {
254
+ const p = t.createPattern(m.source, m.repeat);
255
+ p && (t.fillStyle = p, t.fillRect(s, i, o, l));
256
+ } else t.drawImage(m.source, s, i, o, l);
257
+ this._removeShadow(t);
258
+ }
259
+ function Rt(t) {
260
+ t?.fabric && t.fabric.on("object:added", (e) => {
261
+ const s = e.target;
262
+ s && s.name === "text" && (s._renderBackground = Et);
263
+ });
264
+ }
265
+ function jt(t, e) {
266
+ if (t === "json") return new Blob([e], { type: "application/json" });
267
+ if (t === "svg") return new Blob([e], { type: "image/svg+xml" });
268
+ const s = `image/${t}`;
269
+ return $e(e.replace(/data:image\/([a-z]*)?;base64,/, ""), s);
270
+ }
271
+ var Lt = ({ currentImageLink: t, prefetchedBlob: e, resolveImageBlob: s, onSave: i, uploadImageResultIsLoading: o }) => {
272
+ const l = R.useCookieManager(), [m, p] = (0, n.useState)(), [g, x] = (0, n.useState)(), { __: h } = f.useI18n();
273
+ let v = d.useDispatch();
274
+ const I = d.useStore(), E = d.useAppConfig(), b = d.useSelector(d.selectedCurrentUser), O = d.useSelector(ee.selectSecondModal), w = d.useSelector(d.selectProject), U = (0, n.useMemo)(() => {
275
+ if (!E?.icons) return;
276
+ const j = {};
277
+ for (const [z, L] of Object.entries(E.icons)) typeof L == "string" && (j[z] = R.sanitizeHtml(L));
278
+ return Object.keys(j).length > 0 ? j : void 0;
279
+ }, [E?.icons]), D = (0, n.useRef)(!1), [B, V] = (0, n.useState)(), M = d.useEventEmitter(d.events.FILE_PROXY_EVENT_ID);
280
+ (0, n.useEffect)(() => {
281
+ let j = !1;
282
+ return (async () => {
283
+ const L = t;
284
+ if (!L && !e) return;
285
+ let S = e;
286
+ if (!S && L) try {
287
+ typeof s == "function" ? S = await s(L) : S = await (await fetch(L)).blob();
288
+ } catch {
289
+ if (j) return;
290
+ if (S = await M.fire({
291
+ url: L,
292
+ project: w
293
+ }).filter((N) => N instanceof Blob)[0], !S) {
294
+ const N = l.get(d.APP_COOKIES.em_token) || await d.di.getInstance(I, ee.TOKEN_ID);
295
+ S = await (await fetch(`https://app.useblocks.io/api/wp-json/cors-proxy/v1/get?url=${encodeURIComponent(L)}`, { headers: { authorization: `Bearer ${N}` } })).blob();
296
+ }
297
+ }
298
+ if (j || !S) return;
299
+ const A = new FileReader();
300
+ A.onload = () => {
301
+ if (j) return;
302
+ const N = A.result;
303
+ typeof N == "string" && (p(N), x(S.type), B?.tools.import.openBackgroundImage(N));
304
+ }, A.onerror = () => {}, A.readAsDataURL(S);
305
+ })().catch((L) => {}), () => {
306
+ j = !0;
307
+ };
308
+ }, [
309
+ t,
310
+ e,
311
+ s,
312
+ l,
313
+ B,
314
+ M,
315
+ w,
316
+ I
317
+ ]);
318
+ const T = (0, n.useCallback)(() => {
319
+ p(null), x(null), v(ee.closeSecondModal()), v(ee.closeModal(d.MODALS.UPLOAD_IMAGE_MODAL));
320
+ }, [v]), Z = (0, n.useRef)();
321
+ Z.current = async function(j, z, L) {
322
+ try {
323
+ const S = jt(L, j);
324
+ i && await i(new File([S], z, {
325
+ lastModified: Date.now(),
326
+ type: S.type
327
+ }));
328
+ } catch (S) {
329
+ throw S;
330
+ }
331
+ };
332
+ const q = (0, n.useCallback)((j) => {
333
+ if (j && !(D.current && B)) {
334
+ D.current = !0;
335
+ const z = b.locale ? b.locale.replace("_", "-") : "en-US", L = b.theme === "system" ? matchMedia("(prefers-color-scheme: dark)").matches ? d.DARK : d.LIGHT : b.theme;
336
+ wt.Tf.init({
337
+ selector: "#pixie-editor",
338
+ baseUrl: f.getBundledHostAssetUrl(xt),
339
+ image: m,
340
+ activeLanguage: z,
341
+ languages: It(z, h),
342
+ tools: St,
343
+ ui: {
344
+ menubar: {
345
+ replaceDefaultItems: !0,
346
+ items: [
347
+ {
348
+ type: "undoWidget",
349
+ align: "left"
350
+ },
351
+ {
352
+ type: "zoomWidget",
353
+ align: "center",
354
+ desktopOnly: !0
355
+ },
356
+ {
357
+ type: "button",
358
+ icon: (0, r.jsx)(f.EmIcons, {
359
+ icon: "HistoryOutlined",
360
+ configIcons: U,
361
+ style: { fontSize: 20 }
362
+ }),
363
+ align: "right",
364
+ desktopOnly: !0,
365
+ action: (S) => {
366
+ S.togglePanel("history");
367
+ }
368
+ },
369
+ {
370
+ type: "button",
371
+ icon: (0, r.jsx)(f.EmIcons, {
372
+ icon: "CloseOutlined",
373
+ configIcons: U,
374
+ style: { fontSize: 20 }
375
+ }),
376
+ align: "right",
377
+ desktopOnly: !0,
378
+ action: () => T()
379
+ }
380
+ ]
381
+ },
382
+ nav: { position: "top" },
383
+ activeTheme: L,
384
+ mode: "inline",
385
+ forceOverlayModeOnMobile: !1
386
+ },
387
+ onSave: async function(S, A, N) {
388
+ try {
389
+ await Z.current(S, A, N);
390
+ } catch {}
391
+ }
392
+ }).then((S) => {
393
+ Rt(S), V(S);
394
+ }).catch((S) => {});
395
+ }
396
+ }, [
397
+ b.theme,
398
+ m,
399
+ B,
400
+ V,
401
+ b.locale,
402
+ h,
403
+ T,
404
+ U
405
+ ]), Q = (0, n.useCallback)(() => {
406
+ B?.tools.export.save(t?.split("/").pop().split(".")[0], g?.split("/")[1]);
407
+ }, [
408
+ B,
409
+ t,
410
+ g
411
+ ]);
412
+ return (0, r.jsxs)(f.Modal, {
413
+ afterOpenChange: q,
414
+ width: "100%",
415
+ style: {
416
+ maxWidth: "100%",
417
+ minHeight: "100vh"
418
+ },
419
+ className: "image-editor-modal",
420
+ centered: !0,
421
+ closable: !1,
422
+ zIndex: 1100,
423
+ mask: !1,
424
+ open: O,
425
+ footer: [(0, r.jsx)(f.Button, {
426
+ className: "em-analytics__profile-cancel",
427
+ onClick: T,
428
+ children: h("Cancel")
429
+ }, "Cancel"), (0, r.jsx)(f.Button, {
430
+ className: "em-analytics__profile-updapixiete",
431
+ id: "save",
432
+ type: "primary",
433
+ onClick: Q,
434
+ children: h("Update")
435
+ }, "Ok")],
436
+ children: [o && (0, r.jsx)("div", {
437
+ style: {
438
+ position: "absolute",
439
+ height: "100%",
440
+ width: "100%",
441
+ display: "flex",
442
+ alignItems: "center",
443
+ justifyContent: "center",
444
+ background: Je.emCssVar("colorBgLayout"),
445
+ zIndex: 10,
446
+ opacity: .7
447
+ },
448
+ children: (0, r.jsx)(f.Spin, { size: "large" })
449
+ }), (0, r.jsx)("div", { id: "pixie-editor" })]
450
+ });
451
+ }, Ot = ({ currentImageLink: t, newLink: e, previewDisplayUrl: s, resolvedPreviewObjectUrl: i, resolvedPreviewBlob: o, resolveImageBlob: l, onSave: m, uploadImageResultIsLoading: p }) => {
452
+ const g = s || i;
453
+ return (0, r.jsxs)(r.Fragment, { children: [(0, r.jsx)("div", { children: (0, r.jsxs)("div", {
454
+ className: "image-preview",
455
+ children: [p && (0, r.jsx)("div", {
456
+ style: {
457
+ position: "absolute",
458
+ height: "100%",
459
+ width: "100%",
460
+ display: "flex",
461
+ alignItems: "center",
462
+ justifyContent: "center",
463
+ background: Je.emCssVar("colorBgLayout"),
464
+ zIndex: 10,
465
+ opacity: .7
466
+ },
467
+ children: (0, r.jsx)(f.Spin, { size: "large" })
468
+ }), g && (0, r.jsx)("img", {
469
+ alt: "uploadedImage",
470
+ src: g
471
+ })]
472
+ }) }), (0, r.jsx)(Lt, {
473
+ currentImageLink: t,
474
+ prefetchedBlob: o,
475
+ resolveImageBlob: l,
476
+ newLink: e,
477
+ onSave: m,
478
+ uploadImageResultIsLoading: p
479
+ })] });
480
+ }, Se = {
481
+ Pixel: "Pixel",
482
+ Percent: "Percent"
483
+ }, et = {
484
+ unit: Se.Percent,
485
+ value: 80
486
+ };
487
+ function Dt(t) {
488
+ return typeof t == "number" ? {
489
+ unit: Se.Percent,
490
+ value: t * 100
491
+ } : typeof t == "string" ? /^(\d*(\.\d+)?)px$/.exec(t) ? {
492
+ unit: Se.Pixel,
493
+ value: parseFloat(t)
494
+ } : /^(\d*(\.\d+)?)%$/.exec(t) ? {
495
+ unit: Se.Percent,
496
+ value: parseFloat(t)
497
+ } : et : et;
498
+ }
499
+ function Pt(t, e) {
500
+ const s = Dt(t);
501
+ let i;
502
+ return s.unit === Se.Pixel ? i = `${s.value}px` : i = `${100 - s.value}%`, e ? `${i} 0px 0px 0px` : `0px 0px ${i} 0px`;
503
+ }
504
+ function tt({ next: t, hasMore: e, children: s, loader: i, scrollThreshold: o = .8, endMessage: l, style: m, height: p, scrollableTarget: g, hasChildren: x, inverse: h = !1, pullDownToRefresh: v = !1, pullDownToRefreshContent: I, releaseToRefreshContent: E, pullDownToRefreshThreshold: b = 100, refreshFunction: O, onScroll: w, dataLength: U, initialScrollY: D, className: B = "", role: V, tabIndex: M, id: T, ...Z }) {
505
+ const [q, Q] = (0, n.useState)(!1), [j, z] = (0, n.useState)(!1), [L, S] = (0, n.useState)(0), A = (0, n.useRef)(null), N = (0, n.useRef)(null), X = (0, n.useRef)(null), K = (0, n.useRef)(t);
506
+ K.current = t;
507
+ const a = (0, n.useRef)(O);
508
+ a.current = O;
509
+ const y = (0, n.useRef)(b);
510
+ y.current = b;
511
+ const W = (0, n.useRef)(!1), ie = (0, n.useRef)(!1), $ = (0, n.useRef)(0), F = (0, n.useRef)(0), le = (0, n.useRef)(0), P = (0, n.useCallback)(() => g instanceof HTMLElement ? g : typeof g == "string" ? document.getElementById(g) : null, [g]);
512
+ (0, n.useEffect)(() => {
513
+ if (typeof U > "u") throw new Error("mandatory prop \"dataLength\" is missing. The prop is needed when loading more content. Check README.md for usage");
514
+ if (v && typeof O != "function") throw new Error(`Mandatory prop "refreshFunction" missing.
515
+ Pull Down To Refresh functionality will not work
516
+ as expected. Check README.md for usage'`);
517
+ if (typeof D == "number") {
518
+ const J = p ? A.current : P();
519
+ J && J.scrollHeight > D && J.scrollTo(0, D);
520
+ }
521
+ }, []), (0, n.useEffect)(() => {
522
+ W.current = !1, Q(!1);
523
+ }, [U]), (0, n.useEffect)(() => {
524
+ if (!e || typeof IntersectionObserver > "u") return;
525
+ const J = N.current;
526
+ if (!J) return;
527
+ const ne = p ? A.current : P(), G = new IntersectionObserver(([ae]) => {
528
+ !ae.isIntersecting || W.current || (W.current = !0, Q(!0), K.current());
529
+ }, {
530
+ root: ne,
531
+ rootMargin: Pt(o, h),
532
+ threshold: 0
533
+ });
534
+ return G.observe(J), () => G.disconnect();
535
+ }, [
536
+ e,
537
+ o,
538
+ h,
539
+ p,
540
+ P
541
+ ]), (0, n.useEffect)(() => {
542
+ var J;
543
+ if (!w) return;
544
+ const ne = (J = p ? A.current : P()) !== null && J !== void 0 ? J : typeof window < "u" ? window : null;
545
+ if (!ne) return;
546
+ const G = (ae) => {
547
+ setTimeout(() => w(ae), 0);
548
+ };
549
+ return ne.addEventListener("scroll", G), () => ne.removeEventListener("scroll", G);
550
+ }, [
551
+ w,
552
+ p,
553
+ P
554
+ ]), (0, n.useEffect)(() => {
555
+ var J, ne;
556
+ if (!v) return;
557
+ const G = (J = p ? A.current : P()) !== null && J !== void 0 ? J : typeof window < "u" ? window : null;
558
+ if (!G) return;
559
+ if (!((ne = X.current) === null || ne === void 0) && ne.firstChild) {
560
+ const Y = X.current.firstChild.getBoundingClientRect().height;
561
+ le.current = Y, S(Y);
562
+ }
563
+ const ae = (Y) => {
564
+ (G instanceof HTMLElement ? G.scrollTop : document.documentElement.scrollTop) > 0 || (ie.current = !0, Y instanceof MouseEvent ? $.current = Y.pageY : Y instanceof TouchEvent && ($.current = Y.touches[0].pageY), F.current = $.current, A.current && (A.current.style.willChange = "transform", A.current.style.transition = "transform 0.2s cubic-bezier(0,0,0.31,1)"));
565
+ }, C = (Y) => {
566
+ if (!ie.current || (Y instanceof MouseEvent ? F.current = Y.pageY : Y instanceof TouchEvent && (F.current = Y.touches[0].pageY), F.current < $.current)) return;
567
+ const me = F.current - $.current;
568
+ me >= y.current && z(!0), !(me > le.current * 1.5) && A.current && (A.current.style.overflow = "visible", A.current.style.transform = `translate3d(0px, ${me}px, 0px)`);
569
+ }, _ = () => {
570
+ $.current = 0, F.current = 0, ie.current = !1, z((Y) => {
571
+ var me;
572
+ return Y && ((me = a.current) === null || me === void 0 || me.call(a)), !1;
573
+ }), requestAnimationFrame(() => {
574
+ A.current && (A.current.style.overflow = "auto", A.current.style.transform = "none", A.current.style.willChange = "unset");
575
+ });
576
+ };
577
+ return G.addEventListener("touchstart", ae), G.addEventListener("touchmove", C), G.addEventListener("touchend", _), G.addEventListener("mousedown", ae), G.addEventListener("mousemove", C), G.addEventListener("mouseup", _), () => {
578
+ G.removeEventListener("touchstart", ae), G.removeEventListener("touchmove", C), G.removeEventListener("touchend", _), G.removeEventListener("mousedown", ae), G.removeEventListener("mousemove", C), G.removeEventListener("mouseup", _);
579
+ };
580
+ }, [
581
+ v,
582
+ p,
583
+ P
584
+ ]);
585
+ const he = {
586
+ height: p ?? "auto",
587
+ overflow: "auto",
588
+ WebkitOverflowScrolling: "touch",
589
+ ...m
590
+ }, ye = x || !!(s && s instanceof Array && s.length), oe = v && p ? { overflow: "auto" } : {}, ve = e ? (0, r.jsx)("div", {
591
+ ref: N,
592
+ style: { height: 1 }
593
+ }) : null;
594
+ return (0, r.jsx)("div", {
595
+ style: oe,
596
+ className: "infinite-scroll-component__outerdiv",
597
+ children: (0, r.jsxs)("div", {
598
+ ...Z,
599
+ role: V,
600
+ tabIndex: M,
601
+ id: T,
602
+ className: ["infinite-scroll-component", B].filter(Boolean).join(" "),
603
+ ref: A,
604
+ style: he,
605
+ children: [
606
+ v && (0, r.jsx)("div", {
607
+ style: { position: "relative" },
608
+ ref: X,
609
+ children: (0, r.jsx)("div", {
610
+ style: {
611
+ position: "absolute",
612
+ left: 0,
613
+ right: 0,
614
+ top: -1 * L
615
+ },
616
+ children: j ? E : I
617
+ })
618
+ }),
619
+ s,
620
+ !q && !ye && e && i,
621
+ q && e && i,
622
+ ve,
623
+ !e && l
624
+ ]
625
+ })
626
+ });
627
+ }
628
+ function Ut(t, e) {
629
+ if (t == null) return {};
630
+ var s = Bt(t, e), i, o;
631
+ if (Object.getOwnPropertySymbols) {
632
+ var l = Object.getOwnPropertySymbols(t);
633
+ for (o = 0; o < l.length; o++) i = l[o], !(e.indexOf(i) >= 0) && Object.prototype.propertyIsEnumerable.call(t, i) && (s[i] = t[i]);
634
+ }
635
+ return s;
636
+ }
637
+ function Bt(t, e) {
638
+ if (t == null) return {};
639
+ var s = {}, i = Object.keys(t), o, l;
640
+ for (l = 0; l < i.length; l++) o = i[l], !(e.indexOf(o) >= 0) && (s[o] = t[o]);
641
+ return s;
642
+ }
643
+ function Pe() {
644
+ return Pe = Object.assign || function(t) {
645
+ for (var e = 1; e < arguments.length; e++) {
646
+ var s = arguments[e];
647
+ for (var i in s) Object.prototype.hasOwnProperty.call(s, i) && (t[i] = s[i]);
648
+ }
649
+ return t;
650
+ }, Pe.apply(this, arguments);
651
+ }
652
+ function nt(t, e) {
653
+ var s = Object.keys(t);
654
+ if (Object.getOwnPropertySymbols) {
655
+ var i = Object.getOwnPropertySymbols(t);
656
+ e && (i = i.filter(function(o) {
657
+ return Object.getOwnPropertyDescriptor(t, o).enumerable;
658
+ })), s.push.apply(s, i);
659
+ }
660
+ return s;
661
+ }
662
+ function ke(t) {
663
+ for (var e = 1; e < arguments.length; e++) {
664
+ var s = arguments[e] != null ? arguments[e] : {};
665
+ e % 2 ? nt(Object(s), !0).forEach(function(i) {
666
+ Mt(t, i, s[i]);
667
+ }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(t, Object.getOwnPropertyDescriptors(s)) : nt(Object(s)).forEach(function(i) {
668
+ Object.defineProperty(t, i, Object.getOwnPropertyDescriptor(s, i));
669
+ });
670
+ }
671
+ return t;
672
+ }
673
+ function Mt(t, e, s) {
674
+ return e in t ? Object.defineProperty(t, e, {
675
+ value: s,
676
+ enumerable: !0,
677
+ configurable: !0,
678
+ writable: !0
679
+ }) : t[e] = s, t;
680
+ }
681
+ var Tt = {
682
+ breakpointCols: void 0,
683
+ className: void 0,
684
+ columnClassName: void 0,
685
+ children: void 0,
686
+ columnAttrs: void 0,
687
+ column: void 0
688
+ }, Te = 2, Ne = class extends n.default.Component {
689
+ constructor(t) {
690
+ super(t), this.reCalculateColumnCount = this.reCalculateColumnCount.bind(this), this.reCalculateColumnCountDebounce = this.reCalculateColumnCountDebounce.bind(this);
691
+ let e;
692
+ this.props.breakpointCols && this.props.breakpointCols.default ? e = this.props.breakpointCols.default : e = parseInt(this.props.breakpointCols) || Te, this.state = { columnCount: e };
693
+ }
694
+ componentDidMount() {
695
+ this.reCalculateColumnCount(), window && window.addEventListener("resize", this.reCalculateColumnCountDebounce);
696
+ }
697
+ componentDidUpdate() {
698
+ this.reCalculateColumnCount();
699
+ }
700
+ componentWillUnmount() {
701
+ window && window.removeEventListener("resize", this.reCalculateColumnCountDebounce);
702
+ }
703
+ reCalculateColumnCountDebounce() {
704
+ if (!window || !window.requestAnimationFrame) {
705
+ this.reCalculateColumnCount();
706
+ return;
707
+ }
708
+ window.cancelAnimationFrame && window.cancelAnimationFrame(this._lastRecalculateAnimationFrame), this._lastRecalculateAnimationFrame = window.requestAnimationFrame(() => {
709
+ this.reCalculateColumnCount();
710
+ });
711
+ }
712
+ reCalculateColumnCount() {
713
+ const t = window && window.innerWidth || Infinity;
714
+ let e = this.props.breakpointCols;
715
+ typeof e != "object" && (e = { default: parseInt(e) || Te });
716
+ let s = Infinity, i = e.default || Te;
717
+ for (let o in e) {
718
+ const l = parseInt(o);
719
+ l > 0 && t <= l && l < s && (s = l, i = e[o]);
720
+ }
721
+ i = Math.max(1, parseInt(i) || 1), this.state.columnCount !== i && this.setState({ columnCount: i });
722
+ }
723
+ itemsInColumns() {
724
+ const t = this.state.columnCount, e = new Array(t), s = n.default.Children.toArray(this.props.children);
725
+ for (let i = 0; i < s.length; i++) {
726
+ const o = i % t;
727
+ e[o] || (e[o] = []), e[o].push(s[i]);
728
+ }
729
+ return e;
730
+ }
731
+ renderColumns() {
732
+ const { column: t, columnAttrs: e = {}, columnClassName: s } = this.props, i = this.itemsInColumns(), o = `${100 / i.length}%`;
733
+ let l = s;
734
+ l && typeof l != "string" && (this.logDeprecated("The property \"columnClassName\" requires a string"), typeof l > "u" && (l = "my-masonry-grid_column"));
735
+ const m = ke(ke(ke({}, t), e), {}, {
736
+ style: ke(ke({}, e.style), {}, { width: o }),
737
+ className: l
738
+ });
739
+ return i.map((p, g) => n.default.createElement("div", Pe({}, m, { key: g }), p));
740
+ }
741
+ logDeprecated(t) {}
742
+ render() {
743
+ const t = this.props, { children: e, breakpointCols: s, columnClassName: i, columnAttrs: o, column: l, className: m } = t, p = Ut(t, [
744
+ "children",
745
+ "breakpointCols",
746
+ "columnClassName",
747
+ "columnAttrs",
748
+ "column",
749
+ "className"
750
+ ]);
751
+ let g = m;
752
+ return typeof m != "string" && (this.logDeprecated("The property \"className\" requires a string"), typeof m > "u" && (g = "my-masonry-grid")), n.default.createElement("div", Pe({}, p, { className: g }), this.renderColumns());
753
+ }
754
+ };
755
+ Ne.defaultProps = Tt;
756
+ function Ge(t, e) {
757
+ return t ? t.exhausted ? {
758
+ ...t,
759
+ src: null
760
+ } : {
761
+ ...t,
762
+ src: t.src || e || null
763
+ } : null;
764
+ }
765
+ function rt({ items: t, getItemId: e, getRequestUrl: s, createController: i }) {
766
+ const [o, l] = (0, n.useState)({}), m = (0, n.useRef)(new Map()), p = (0, n.useCallback)((g) => {
767
+ const x = e(g), h = s(g), v = `${x}:${h}`;
768
+ if (m.current.has(v)) return {
769
+ itemId: x,
770
+ requestUrl: h,
771
+ cacheKey: v,
772
+ controller: m.current.get(v)
773
+ };
774
+ const I = i(h);
775
+ return m.current.set(v, I), {
776
+ itemId: x,
777
+ requestUrl: h,
778
+ cacheKey: v,
779
+ controller: I
780
+ };
781
+ }, [
782
+ i,
783
+ e,
784
+ s
785
+ ]);
786
+ return (0, n.useEffect)(() => {
787
+ const g = new Set(), x = {}, h = t.map((v) => {
788
+ const { itemId: I, cacheKey: E, controller: b } = p(v);
789
+ g.add(E), x[I] = b.src;
790
+ const O = Ge(b.handleChangeSrc?.(), b.src);
791
+ return O?.changed && O.src && (x[I] = O.src), b.subscribeToSrcChange?.((w) => {
792
+ const U = Ge(w, b.src);
793
+ !U?.changed || !U.src || l((D) => D[I] === U.src ? D : {
794
+ ...D,
795
+ [I]: U.src
796
+ });
797
+ });
798
+ }).filter(Boolean);
799
+ return m.current.forEach((v, I) => {
800
+ g.has(I) || m.current.delete(I);
801
+ }), l(x), () => {
802
+ h.forEach((v) => v?.());
803
+ };
804
+ }, [p, t]), {
805
+ getDisplaySrc: (0, n.useCallback)((g) => {
806
+ const { itemId: x, requestUrl: h, controller: v } = p(g);
807
+ return o[x] || v.src || h;
808
+ }, [o, p]),
809
+ handleLoad: (0, n.useCallback)((g) => {
810
+ p(g).controller.handleSuccess();
811
+ }, [p]),
812
+ handleError: (0, n.useCallback)((g) => {
813
+ const { itemId: x, controller: h } = p(g), v = Ge(h.handleError(), h.src);
814
+ v?.changed && v.src && l((I) => ({
815
+ ...I,
816
+ [x]: v.src
817
+ }));
818
+ }, [p])
819
+ };
820
+ }
821
+ var at = "blocks", Nt = ({ setCurrentImageLink: t, setModalHeight: e, setModalWidth: s, setImageStockList: i, imageStockList: o, currentReq: l, setCurrentReq: m, inputRef: p, setStockLink: g, customRequest: x }) => {
822
+ const h = d.useAppConfig(), v = d.useIsStandalone(), [I, E] = (0, n.useState)(!1), [b, O] = (0, n.useState)(2), { __: w } = f.useI18n(), U = f.useNotification(), [D] = ee.useLazyGetUnsplashImageQuery(), [B] = ee.useLazyGetSearchImageQuery(), V = (0, n.useCallback)((a) => a instanceof Error || typeof a?.message == "string" && a.message ? a.message : typeof a?.error?.message == "string" && a.error.message ? a.error.message : w("Failed to load stock images through the configured proxy chain."), [w]), M = (0, n.useCallback)((a) => {
823
+ U.error({
824
+ id: "STOCK_IMAGES_SEARCH_FAILED",
825
+ title: w("Failed to load stock images"),
826
+ description: V(a)
827
+ });
828
+ }, [
829
+ w,
830
+ V,
831
+ U
832
+ ]), T = async () => {
833
+ I || (E(!0), B({
834
+ query: l,
835
+ page: b
836
+ }).then((a) => {
837
+ if (a?.error) {
838
+ M(a.error), E(!1);
839
+ return;
840
+ }
841
+ const y = a?.data?.results || [];
842
+ i((W) => [...W, ...y]), E(!1), O((W) => W + 1);
843
+ }).catch(() => {
844
+ E(!1);
845
+ }));
846
+ };
847
+ (0, n.useEffect)(() => {
848
+ l.keywords !== "" && Z();
849
+ }, [l.color, l.orientation]);
850
+ const Z = async () => {
851
+ const a = await B({
852
+ query: l,
853
+ page: 1
854
+ });
855
+ if (a?.error) {
856
+ M(a.error), i([]);
857
+ return;
858
+ }
859
+ const y = a?.data?.results || [];
860
+ y.length > 0 ? (i(y), setTimeout(() => {
861
+ s(1060), e("84vh");
862
+ }, 0)) : i([]);
863
+ }, [q, Q] = (0, n.useState)(null), j = (0, n.useCallback)((a, y, W) => `${a}${a.includes("?") ? "&" : "?"}w=${y}&q=${W}`, []), z = (0, n.useCallback)((a) => d.getProxiedUrl(a, {
864
+ config: h,
865
+ standalone: v,
866
+ resourceType: "stockImages",
867
+ intent: "display"
868
+ }), [h, v]), { getDisplaySrc: L, handleLoad: S, handleError: A } = rt({
869
+ items: o,
870
+ getItemId: (0, n.useCallback)((a) => a.id, []),
871
+ getRequestUrl: (0, n.useCallback)((a) => j(a.urls.raw, 644, 96), [j]),
872
+ createController: z
873
+ }), N = (a) => (y) => {
874
+ S(a), y.target.parentNode.classList.add("loaded");
875
+ }, X = (a) => () => {
876
+ A(a);
877
+ }, K = (a, y, W) => {
878
+ D(y.download_location), Q(W), setTimeout(() => Q(null), 2e3), g(`${a.raw}&w=1200&q=96`), t(`${a.raw}&w=1200&q=96`), x(`${a.raw}&w=1200&q=96`);
879
+ };
880
+ return (0, r.jsxs)("div", {
881
+ className: "stock-tab",
882
+ children: [(0, r.jsxs)(f.Form, {
883
+ onValuesChange: Z,
884
+ className: o.length > 0 ? "serach-results" : "",
885
+ children: [(0, r.jsxs)(f.Row, {
886
+ gutter: 24,
887
+ children: [(0, r.jsx)(f.Col, {
888
+ span: o.length > 0 ? "" : 24,
889
+ children: (0, r.jsx)(f.Form.Item, {
890
+ className: "stock-search-input",
891
+ children: (0, r.jsx)(f.SearchInput, {
892
+ onSearch: Z,
893
+ allowClear: !0,
894
+ size: o.length > 0 ? "medium" : "large",
895
+ placeholder: w("Search image"),
896
+ value: l.keywords,
897
+ onChange: (a) => m((y) => ({
898
+ ...y,
899
+ keywords: a.target.value
900
+ })),
901
+ ref: p,
902
+ spellCheck: "false",
903
+ enterButton: !1
904
+ })
905
+ })
906
+ }), o.length > 0 && (0, r.jsxs)(r.Fragment, { children: [(0, r.jsx)(f.Col, { children: (0, r.jsxs)(f.Radio.Group, {
907
+ defaultValue: "",
908
+ onChange: (a) => m((y) => ({
909
+ ...y,
910
+ orientation: a.target.value
911
+ })),
912
+ children: [
913
+ (0, r.jsx)(f.Tooltip, {
914
+ title: w("All"),
915
+ placement: "top",
916
+ children: (0, r.jsx)(f.Radio.Button, {
917
+ value: "",
918
+ children: (0, r.jsx)(R.EmIcons, { icon: "MixedView" })
919
+ })
920
+ }),
921
+ (0, r.jsx)(f.Tooltip, {
922
+ title: w("Landscape"),
923
+ placement: "top",
924
+ children: (0, r.jsx)(f.Radio.Button, {
925
+ value: "landscape",
926
+ children: (0, r.jsx)(R.EmIcons, { icon: "LandscapeView" })
927
+ })
928
+ }),
929
+ (0, r.jsx)(f.Tooltip, {
930
+ title: w("Portrait"),
931
+ placement: "top",
932
+ children: (0, r.jsx)(f.Radio.Button, {
933
+ value: "portrait",
934
+ children: (0, r.jsx)(R.EmIcons, { icon: "PortraitView" })
935
+ })
936
+ }),
937
+ (0, r.jsx)(f.Tooltip, {
938
+ title: w("Squarish"),
939
+ placement: "top",
940
+ children: (0, r.jsx)(f.Radio.Button, {
941
+ value: "squarish",
942
+ children: (0, r.jsx)(R.EmIcons, { icon: "SquareView" })
943
+ })
944
+ })
945
+ ]
946
+ }) }), (0, r.jsx)(f.Col, { children: (0, r.jsx)(f.RadioColorFilter, {
947
+ defaultValue: "",
948
+ onChange: (a) => m((y) => ({
949
+ ...y,
950
+ color: a.target.value
951
+ })),
952
+ options: [
953
+ {
954
+ value: "",
955
+ colorClass: "all-colors",
956
+ label: w("All")
957
+ },
958
+ {
959
+ value: "black",
960
+ colorClass: "black-color",
961
+ label: w("Black")
962
+ },
963
+ {
964
+ value: "black_and_white",
965
+ colorClass: "bw-color",
966
+ label: w("Black and White")
967
+ },
968
+ {
969
+ value: "white",
970
+ colorClass: "white-color",
971
+ label: w("White")
972
+ },
973
+ {
974
+ value: "orange",
975
+ colorClass: "orange-color",
976
+ label: w("Orange")
977
+ },
978
+ {
979
+ value: "red",
980
+ colorClass: "red-color",
981
+ label: w("Red")
982
+ },
983
+ {
984
+ value: "purple",
985
+ colorClass: "purple-color",
986
+ label: w("Purple")
987
+ },
988
+ {
989
+ value: "magenta",
990
+ colorClass: "magenta-color",
991
+ label: w("Magenta")
992
+ },
993
+ {
994
+ value: "green",
995
+ colorClass: "green-color",
996
+ label: w("Green")
997
+ },
998
+ {
999
+ value: "teal",
1000
+ colorClass: "teal-color",
1001
+ label: w("Teal")
1002
+ },
1003
+ {
1004
+ value: "blue",
1005
+ colorClass: "blue-color",
1006
+ label: w("Blue")
1007
+ }
1008
+ ],
1009
+ tooltipPlacement: "top"
1010
+ }) })] })]
1011
+ }), o.length > 0 && (0, r.jsx)("div", {
1012
+ className: "blocks-search__divider-wrapper",
1013
+ children: (0, r.jsx)("div", {
1014
+ className: "ant-divider ant-divider-horizontal",
1015
+ role: "separator"
1016
+ })
1017
+ })]
1018
+ }), (0, r.jsx)("div", {
1019
+ className: "serach-output-wrapper",
1020
+ style: { marginRight: -10 },
1021
+ children: o.length > 0 && (0, r.jsx)("div", {
1022
+ id: "scrollableDiv",
1023
+ style: {
1024
+ width: "100%",
1025
+ height: "calc(84vh - 148px)",
1026
+ overflow: "auto",
1027
+ paddingTop: 24,
1028
+ paddingRight: 14,
1029
+ paddingLeft: 24,
1030
+ marginLeft: -24,
1031
+ lineHeight: "0",
1032
+ boxSizing: "unset"
1033
+ },
1034
+ children: (0, r.jsx)(tt, {
1035
+ dataLength: o && o.length,
1036
+ next: T,
1037
+ hasMore: o,
1038
+ endMessage: (0, r.jsxs)(f.Divider, {
1039
+ plain: !0,
1040
+ children: [w("That`s all we could find."), " 🤐"]
1041
+ }),
1042
+ scrollableTarget: "scrollableDiv",
1043
+ style: { overflow: "visible" },
1044
+ loader: null,
1045
+ children: (0, r.jsx)(Ne, {
1046
+ breakpointCols: { default: 3 },
1047
+ className: "my-masonry-grid",
1048
+ columnClassName: "my-masonry-grid_column",
1049
+ children: o.map((a) => (0, r.jsxs)("div", {
1050
+ className: "list-item",
1051
+ onClick: () => K(a.urls, a.links, a.id),
1052
+ children: [
1053
+ (0, r.jsx)("img", {
1054
+ className: q === a.id ? "loaded-image" : "",
1055
+ width: "322px",
1056
+ src: L(a),
1057
+ alt: a.description,
1058
+ onLoad: N(a),
1059
+ onError: X(a)
1060
+ }),
1061
+ (0, r.jsxs)("p", {
1062
+ className: "creator-info",
1063
+ onClick: (y) => y.stopPropagation(),
1064
+ children: [
1065
+ "Photo by",
1066
+ " ",
1067
+ (0, r.jsx)("a", {
1068
+ target: "_blank",
1069
+ href: `${a.user.links.html}?utm_source=${at}&utm_medium=referral`,
1070
+ rel: "noreferrer",
1071
+ children: a.user.name
1072
+ }),
1073
+ " ",
1074
+ "on",
1075
+ " ",
1076
+ (0, r.jsx)("a", {
1077
+ target: "_blank",
1078
+ href: `https://unsplash.com/?utm_source=${at}&utm_medium=referral`,
1079
+ rel: "noreferrer",
1080
+ children: "Unsplash"
1081
+ })
1082
+ ]
1083
+ }),
1084
+ q === a.id && (0, r.jsx)(f.Spin, {
1085
+ className: "ant-spin",
1086
+ size: "small"
1087
+ })
1088
+ ]
1089
+ }, a.id))
1090
+ })
1091
+ })
1092
+ })
1093
+ })]
1094
+ });
1095
+ };
1096
+ function st(t) {
1097
+ return /^(https?:)?\/\//i.test(t.trim());
1098
+ }
1099
+ function Gt(t) {
1100
+ const e = t.trim();
1101
+ return st(e) || /^data:/i.test(e) ? e : `data:image/jpeg;base64, ${t}`;
1102
+ }
1103
+ var Ft = ({ images: t, transitionDuration: e = 1e3 }) => {
1104
+ const [s, i] = (0, n.useState)([]);
1105
+ return (0, n.useEffect)(() => {
1106
+ if (t.length > 0) {
1107
+ const o = t[t.length - 1];
1108
+ i((l) => [...l, {
1109
+ src: o,
1110
+ opacity: 0
1111
+ }]), setTimeout(() => {
1112
+ i((l) => l.map((m, p) => p === l.length - 1 ? {
1113
+ ...m,
1114
+ opacity: 1
1115
+ } : m));
1116
+ }, 1e3);
1117
+ }
1118
+ }, [t]), (0, r.jsx)("div", {
1119
+ className: "slideshow-container",
1120
+ children: s.map((o, l) => (0, r.jsx)("img", {
1121
+ src: Gt(o.src),
1122
+ alt: `Slide ${l + 1}`,
1123
+ className: "slideshow-image",
1124
+ style: {
1125
+ opacity: o.opacity,
1126
+ transition: `opacity ${e}ms linear`
1127
+ }
1128
+ }, l))
1129
+ });
1130
+ };
1131
+ function zt({ setModalHeight: t, customRequest: e, aiTabRef: s, isImageUploaded: i, setIsImageUploaded: o, aiImageRequest: l, imageAiList: m, setImageAiList: p, isLoadingAi: g, setIsLoadingAi: x, onPluginAiImageLimitExceeded: h, onImageGenerateLimitExceeded: v }) {
1132
+ const { __: I } = f.useI18n(), E = d.useAppConfig(), b = f.useNotification(), O = d.usePushToDataLayer(), { blockId: w, projectId: U } = d.useParams(), D = R.useRouteEmailId(), [B] = ee.useLazySendAiImageRequestQuery(), [V, { data: M = [] }] = ee.useLazyGetAiImageSSEQuery(), T = te.useProjectPlanLimitPreflight(), Z = E?.sendAIImageRequest || B, q = E?.trigger || V, Q = E?.handleLimitUsageEmitter || d.useEventEmitter(d.events.ON_LIMIT_ID), [j, z] = (0, n.useState)(0), [L, S] = (0, n.useState)(null), [A, N] = (0, n.useState)(!1), [X, K] = (0, n.useState)(I("Evaluating the task")), [a, y] = (0, n.useState)(!1), W = D || w, { limits: ie } = E?.limits ? E : { limits: { ai_img_limit: 0 } }, { ai_img_limit: $ } = ie, F = !!(E.limits && E.counters) && d.PLUGIN.isPlugin, le = d.useEventEmitter(d.events.AI_IMAGE_REQUEST_ID).hasListeners(), P = te.shouldCountAiUsage({
1133
+ limitsInPlugin: F,
1134
+ hostedAiActive: le
1135
+ }), he = !le && $ > 0 && j >= $, ye = (0, n.useCallback)(() => {
1136
+ Q.fire({
1137
+ name: "AiImgCount",
1138
+ count: j + 1
1139
+ });
1140
+ }, [Q, j]), oe = (0, n.useMemo)(() => !he && (!P || $ === 0 || j < $), [
1141
+ he,
1142
+ P,
1143
+ j,
1144
+ $
1145
+ ]), ve = (0, n.useCallback)(async () => {
1146
+ K(I("Evaluating the task")), l !== "" && !g && (x(!0), y(!0), p([]), O({
1147
+ event: "submit_form",
1148
+ action: "ai_image_generation",
1149
+ entity_id: D,
1150
+ project_id: U
1151
+ }), Z({ body: {
1152
+ project_id: U,
1153
+ request: "create-image",
1154
+ connection: "midjourney",
1155
+ message: l
1156
+ } }).then(({ data: C, error: _ }) => {
1157
+ if (_) throw _;
1158
+ if (C.data.status === 401) throw new Error(d.ERROR);
1159
+ if (C?.data?._eventResult) {
1160
+ p(C.data.task.images), x(!1), y(!1), K(I("Evaluating the task"));
1161
+ return;
1162
+ }
1163
+ C?.data.status === 200 ? (C?.data.task.id && (K(C.data.task.message), S(C.data.task.id)), C.message && b.success({
1164
+ id: "AI_IMAGE_SEND_SUCCESS",
1165
+ title: C.message,
1166
+ placement: "bottomRight",
1167
+ data: l
1168
+ }), q({
1169
+ task_id: C?.data.task.id,
1170
+ entity_id: W
1171
+ })) : (x(!1), y(!1), b.error({
1172
+ id: "AI_IMAGE_SEND_ERROR",
1173
+ title: C?.message || I("Something went wrong, please try again"),
1174
+ placement: "bottomRight",
1175
+ data: l,
1176
+ innerException: C
1177
+ }));
1178
+ }).catch((C) => {
1179
+ x(!1), y(!1), (C?.error || C?.data) && b.fromError("AI_IMAGE_SEND_ERROR", l, C.error || C);
1180
+ }));
1181
+ }, [
1182
+ l,
1183
+ g,
1184
+ x,
1185
+ y,
1186
+ p,
1187
+ O,
1188
+ D,
1189
+ U,
1190
+ Z,
1191
+ b,
1192
+ q,
1193
+ W,
1194
+ I
1195
+ ]), J = (0, n.useCallback)(async () => {
1196
+ if (oe) {
1197
+ if (!d.PLUGIN.isPlugin && !le) {
1198
+ const C = R.resolveLimitActionPreflightExceededForType("image_generate", await T("image_generate"));
1199
+ if (C) {
1200
+ v?.(C);
1201
+ return;
1202
+ }
1203
+ }
1204
+ P && (z((C) => C + 1), ye()), ve();
1205
+ } else F && (h ? h() : b.error({
1206
+ title: I("The usage limit has been exceeded"),
1207
+ description: I(`The maximum number of requests for the current subscription period has been reached.
1208
+ Select the appropriate plan to fulfil more requests`),
1209
+ placement: "bottomRight"
1210
+ }));
1211
+ }, [
1212
+ oe,
1213
+ F,
1214
+ le,
1215
+ P,
1216
+ T,
1217
+ v,
1218
+ z,
1219
+ ye,
1220
+ ve,
1221
+ b,
1222
+ I,
1223
+ h
1224
+ ]);
1225
+ (0, n.useEffect)(() => {
1226
+ F && z(E?.counters?.ai_img_counter || 0);
1227
+ }, [E, F]);
1228
+ const ne = d.useEventEmitter(d.events.AI_IMAGE_PROGRESS_ID);
1229
+ (0, n.useEffect)(() => {
1230
+ const C = ne.event(({ progress: _, status: Y }) => {
1231
+ K(Y || `${Math.round(_)}%`);
1232
+ });
1233
+ return () => C.dispose();
1234
+ }, [ne]);
1235
+ const G = (0, n.useCallback)(async (C) => {
1236
+ if (!i) {
1237
+ o(!0);
1238
+ try {
1239
+ const _ = st(C) ? await (await fetch(C)).blob() : $e(C);
1240
+ e({ file: new File([_], "image.jpeg", { type: _.type || "image/jpeg" }) });
1241
+ } catch {
1242
+ o(!1);
1243
+ }
1244
+ }
1245
+ }, [
1246
+ i,
1247
+ o,
1248
+ e
1249
+ ]), ae = (0, n.useCallback)((C) => {
1250
+ C.status !== "error" && C.status !== "Canceled" ? C.images ? (K(C.status), C.progress === 100 && (p(C.images), K(I("Evaluating the task")), S(null), y(!1))) : (p([C.data]), x(!1)) : (x(!1), y(!1), b.error({
1251
+ id: "AI_IMAGE_GET_ERROR",
1252
+ title: I("Something went wrong, please try again"),
1253
+ placement: "bottomRight",
1254
+ data: L
1255
+ }));
1256
+ }, [
1257
+ p,
1258
+ K,
1259
+ I,
1260
+ x,
1261
+ t,
1262
+ L,
1263
+ b,
1264
+ y
1265
+ ]);
1266
+ return (0, n.useEffect)(() => {
1267
+ M.length > 1 && ae(M[M.length - 1]);
1268
+ }, [M, ae]), (0, n.useEffect)(() => {
1269
+ (g || m.length > 0) && setTimeout(() => {
1270
+ let C = 550;
1271
+ s.current && (C = s.current.offsetHeight + 68), t(C);
1272
+ }, 0);
1273
+ }, [
1274
+ s,
1275
+ M,
1276
+ m.length,
1277
+ g,
1278
+ t
1279
+ ]), {
1280
+ aiImageCounter: j,
1281
+ setAiImageCounter: z,
1282
+ currentAiImgLimits: $,
1283
+ isFieldsDisabled: he,
1284
+ canGenerateImage: oe,
1285
+ aiImageRequest: l,
1286
+ imageAiList: m,
1287
+ setImageAiList: p,
1288
+ isLoadingAi: g,
1289
+ setIsLoadingAi: x,
1290
+ loadingDuringGeneration: a,
1291
+ setLoadingDuringGeneration: y,
1292
+ requestStatus: X,
1293
+ setRequestStatus: K,
1294
+ handleGenerate: J,
1295
+ handleLimitAiImgCount: ye,
1296
+ convertBase64ToFile: G,
1297
+ isShiftPressed: A,
1298
+ setIsShiftPressed: N,
1299
+ currentReqId: L,
1300
+ setCurrentReqId: S,
1301
+ limitsInPlugin: F
1302
+ };
1303
+ }
1304
+ var Kt = ({ setModalHeight: t, customRequest: e, aiTabRef: s, inputAiRef: i, isImageUploaded: o, setIsImageUploaded: l, aiImageRequest: m, setAiImageRequest: p, imageAiList: g, setImageAiList: x, isLoadingAi: h, setIsLoadingAi: v }) => {
1305
+ const I = d.useNavigate();
1306
+ d.useDispatch();
1307
+ const E = R.useOpenPlanCatalog(), { __: b, _n: O } = f.useI18n(), w = d.useAppConfig(), [U, D] = (0, n.useState)(!1), [B, V] = (0, n.useState)(null), { aiImageCounter: M, currentAiImgLimits: T, loadingDuringGeneration: Z, requestStatus: q, handleGenerate: Q, convertBase64ToFile: j, isShiftPressed: z, setIsShiftPressed: L, limitsInPlugin: S } = zt({
1308
+ setModalHeight: t,
1309
+ customRequest: e,
1310
+ aiTabRef: s,
1311
+ isImageUploaded: o,
1312
+ setIsImageUploaded: l,
1313
+ aiImageRequest: m,
1314
+ imageAiList: g,
1315
+ setImageAiList: x,
1316
+ isLoadingAi: h,
1317
+ setIsLoadingAi: v,
1318
+ onPluginAiImageLimitExceeded: () => D(!0),
1319
+ onImageGenerateLimitExceeded: V
1320
+ }), A = U && T > 0 ? te.getAiTariffUpgradeStep(T) : null, N = A ? R.getLimitUpgradePresetDefinition(A.presetId) : null, X = B ? R.getLimitUpgradePresetDefinition(B.presetId) : null, [K, a] = (0, n.useState)(!1), y = (0, n.useCallback)(() => a(!0), []), W = (0, n.useCallback)(() => a(!1), []), ie = (0, n.useCallback)((P) => p(P.target.value), [p]), $ = (0, n.useCallback)((P) => {
1321
+ P.key === "Shift" ? L(!0) : P.key === "Enter" && !z && (P.preventDefault(), Q());
1322
+ }, [
1323
+ z,
1324
+ Q,
1325
+ L
1326
+ ]), F = (0, n.useCallback)((P) => {
1327
+ P.key === "Shift" && L(!1);
1328
+ }, [L]), le = g[g.length - 1];
1329
+ return (0, r.jsxs)("div", {
1330
+ className: "image-ai",
1331
+ children: [
1332
+ N && A ? (0, r.jsx)(R.LimitUpgradeModal, {
1333
+ open: !0,
1334
+ onClose: () => D(!1),
1335
+ title: b(N.titleKey),
1336
+ subtitle: b(N.subtitleKey),
1337
+ usageResource: N.usageResource,
1338
+ previousDisplay: R.presetLimitDisplay(A.previousLimit),
1339
+ nextDisplay: R.presetLimitDisplay(A.nextLimit),
1340
+ onChangePlan: () => {
1341
+ D(!1), E();
1342
+ }
1343
+ }) : null,
1344
+ X && B ? (0, r.jsx)(R.LimitUpgradeModal, {
1345
+ open: !0,
1346
+ onClose: () => V(null),
1347
+ title: b(X.titleKey),
1348
+ subtitle: b(X.subtitleKey),
1349
+ usageResource: X.usageResource,
1350
+ previousDisplay: R.presetLimitDisplay(B.previousLimit),
1351
+ nextDisplay: R.presetLimitDisplay(B.nextLimit),
1352
+ onChangePlan: () => {
1353
+ V(null), E();
1354
+ }
1355
+ }) : null,
1356
+ S && (0, r.jsx)(f.LimitsCounter, {
1357
+ text: `${M} ${b("of")} ${T > 0 ? T : "∞"} images ${O("was used", "were used", M)}`,
1358
+ exceeded: T > 0 && M >= T,
1359
+ style: { marginTop: -25 },
1360
+ extra: (0, r.jsx)("span", {
1361
+ style: {
1362
+ textDecoration: "underline",
1363
+ cursor: "pointer"
1364
+ },
1365
+ onClick: () => I(w.billingPageUrl || d.APP_ROUTES.billing),
1366
+ children: b("Need more?")
1367
+ })
1368
+ }),
1369
+ (0, r.jsx)(f.Row, {
1370
+ gutter: 24,
1371
+ className: "image-ai__row",
1372
+ children: (0, r.jsx)(f.Col, {
1373
+ span: 24,
1374
+ children: (0, r.jsx)(f.Form.Item, {
1375
+ style: { margin: 0 },
1376
+ children: (0, r.jsxs)("span", {
1377
+ className: `ant-input-affix-wrapper ant-input-affix-wrapper-lg image-ai__input-affix-wrapper${K ? " ant-input-affix-wrapper-focused" : ""}`,
1378
+ children: [(0, r.jsx)(f.TextArea, {
1379
+ ref: i,
1380
+ onKeyDown: $,
1381
+ onKeyUp: F,
1382
+ onFocus: y,
1383
+ onBlur: W,
1384
+ autoSize: !0,
1385
+ allowClear: !0,
1386
+ className: "text-area-input-hybrid image-ai__textarea",
1387
+ placeholder: b("Generate image"),
1388
+ value: m,
1389
+ onChange: ie,
1390
+ spellCheck: "false"
1391
+ }), (0, r.jsx)("span", {
1392
+ className: "ant-input-suffix image-ai__input-suffix",
1393
+ children: h || Z ? (0, r.jsx)(R.EmIcons, {
1394
+ icon: "LoadingOutlined",
1395
+ className: "input-icon image-ai__input-icon",
1396
+ spin: !0
1397
+ }) : (0, r.jsx)(R.EmIcons, {
1398
+ icon: "AI",
1399
+ className: "input-icon image-ai__input-icon",
1400
+ onClick: Q
1401
+ })
1402
+ })]
1403
+ })
1404
+ })
1405
+ })
1406
+ }),
1407
+ (h || g.length > 0) && (0, r.jsxs)("div", {
1408
+ className: "image-ai__preview",
1409
+ children: [h && g.length === 0 && (0, r.jsx)("div", {
1410
+ className: "image-ai__loading",
1411
+ children: (0, r.jsxs)("div", {
1412
+ className: "spin",
1413
+ children: [(0, r.jsx)(R.EmIcons, {
1414
+ icon: "LoadingOutlined",
1415
+ style: { fontSize: 48 },
1416
+ spin: !0
1417
+ }), (0, r.jsx)("p", {
1418
+ className: "status",
1419
+ children: q
1420
+ })]
1421
+ })
1422
+ }), g.length > 0 && (0, r.jsxs)("div", {
1423
+ className: "image-ai__image-item",
1424
+ children: [(0, r.jsx)(Ft, { images: g }), (0, r.jsx)("div", {
1425
+ className: "buttons",
1426
+ children: (0, r.jsx)(f.Button, {
1427
+ onClick: () => j(le),
1428
+ icon: (0, r.jsx)(R.EmIcons, { icon: "CheckOutlined" }),
1429
+ children: b("Use this one")
1430
+ })
1431
+ })]
1432
+ })]
1433
+ })
1434
+ ]
1435
+ });
1436
+ }, Wt = ({ setNewLink: t, setCurrentImageLink: e, setModalHeight: s, setModalWidth: i, setImageGifList: o, imageGifList: l, currentReqGif: m, setCurrentReqGif: p, inputRef: g, setStockLink: x, customRequest: h }) => {
1437
+ const { __: v } = f.useI18n(), I = d.useAppConfig(), E = d.useIsStandalone(), b = f.useNotification(), [O, w] = (0, n.useState)(null), [U, D] = (0, n.useState)(!1), [B, V] = (0, n.useState)(25), [M] = ee.useLazyGetSearchGifQuery(), T = (0, n.useCallback)((a) => a instanceof Error || typeof a?.message == "string" && a.message ? a.message : typeof a?.error?.message == "string" && a.error.message ? a.error.message : v("Failed to load GIFs through the configured proxy chain."), [v]), Z = (0, n.useCallback)((a) => {
1438
+ b.error({
1439
+ id: "STOCK_GIFS_SEARCH_FAILED",
1440
+ title: v("Failed to load GIFs"),
1441
+ description: T(a)
1442
+ });
1443
+ }, [
1444
+ v,
1445
+ T,
1446
+ b
1447
+ ]), q = async () => {
1448
+ U || (D(!0), M({
1449
+ query: m,
1450
+ page: B
1451
+ }).then((a) => {
1452
+ if (a?.error) {
1453
+ Z(a.error), D(!1);
1454
+ return;
1455
+ }
1456
+ o((y) => [...y, ...a.data.data]), D(!1), V((y) => y + 25);
1457
+ }).catch(() => {
1458
+ D(!1);
1459
+ }));
1460
+ }, Q = async () => {
1461
+ const a = await M({
1462
+ query: m,
1463
+ page: 0
1464
+ });
1465
+ if (a?.error) {
1466
+ Z(a.error), o([]);
1467
+ return;
1468
+ }
1469
+ a?.data?.data?.length > 0 && (o(a.data.data), setTimeout(() => {
1470
+ s("84vh"), i(1060);
1471
+ }, 0));
1472
+ }, j = (a, y) => {
1473
+ w(y), setTimeout(() => {
1474
+ w(null);
1475
+ }, 2e3), x(`${a}`), e(`${a}`), h(`${a}`);
1476
+ }, z = { default: 3 }, L = (0, n.useCallback)((a) => d.getProxiedUrl(a, {
1477
+ config: I,
1478
+ standalone: E,
1479
+ resourceType: "generic",
1480
+ intent: "display"
1481
+ }), [I, E]), { getDisplaySrc: S, handleLoad: A, handleError: N } = rt({
1482
+ items: l,
1483
+ getItemId: (0, n.useCallback)((a) => a.id, []),
1484
+ getRequestUrl: (0, n.useCallback)((a) => a.images.downsized.url, []),
1485
+ createController: L
1486
+ }), X = (a) => (y) => {
1487
+ A(a), y.target.parentNode.classList.add("loaded");
1488
+ }, K = (a) => () => {
1489
+ N(a);
1490
+ };
1491
+ return (0, r.jsxs)("div", {
1492
+ className: "stock-tab",
1493
+ children: [(0, r.jsxs)(f.Form, {
1494
+ onValuesChange: Q,
1495
+ className: l.length > 0 ? "serach-results" : "",
1496
+ children: [(0, r.jsx)(f.Row, {
1497
+ gutter: 24,
1498
+ children: (0, r.jsx)(f.Col, {
1499
+ span: l.length > 0 ? "" : 24,
1500
+ children: (0, r.jsx)(f.Form.Item, {
1501
+ className: "stock-search-input",
1502
+ children: (0, r.jsx)(f.SearchInput, {
1503
+ onSearch: Q,
1504
+ allowClear: !0,
1505
+ size: l.length > 0 ? "medium" : "large",
1506
+ placeholder: v("Search GIFs"),
1507
+ value: m.keywords,
1508
+ onChange: (a) => p((y) => ({
1509
+ ...y,
1510
+ keywords: a.target.value
1511
+ })),
1512
+ ref: g,
1513
+ spellCheck: "false",
1514
+ enterButton: !1
1515
+ })
1516
+ })
1517
+ })
1518
+ }), l.length > 0 && (0, r.jsx)("div", {
1519
+ className: "blocks-search__divider-wrapper",
1520
+ children: (0, r.jsx)("div", {
1521
+ className: "ant-divider ant-divider-horizontal",
1522
+ role: "separator"
1523
+ })
1524
+ })]
1525
+ }), (0, r.jsx)("div", {
1526
+ className: "serach-output-wrapper",
1527
+ style: { marginRight: -10 },
1528
+ children: l.length > 0 && (0, r.jsx)("div", {
1529
+ id: "scrollableDiv",
1530
+ style: {
1531
+ width: "100%",
1532
+ height: "calc(84vh - 148px)",
1533
+ overflow: "auto",
1534
+ paddingTop: 24,
1535
+ paddingRight: 14,
1536
+ paddingLeft: 24,
1537
+ marginLeft: -24,
1538
+ lineHeight: "0",
1539
+ boxSizing: "unset"
1540
+ },
1541
+ children: (0, r.jsx)(tt, {
1542
+ dataLength: l && l.length,
1543
+ next: q,
1544
+ hasMore: l,
1545
+ endMessage: (0, r.jsxs)(f.Divider, {
1546
+ plain: !0,
1547
+ children: [v("That`s all we could find."), " 🤐"]
1548
+ }),
1549
+ scrollableTarget: "scrollableDiv",
1550
+ style: { overflow: "visible" },
1551
+ loader: (0, r.jsx)(f.Spin, { size: "small" }),
1552
+ children: (0, r.jsx)(Ne, {
1553
+ breakpointCols: z,
1554
+ className: "my-masonry-grid",
1555
+ columnClassName: "my-masonry-grid_column",
1556
+ children: l.map((a, y) => (0, r.jsxs)("div", {
1557
+ className: "list-item",
1558
+ onClick: () => j(a.images.downsized.url, a.id),
1559
+ children: [
1560
+ (0, r.jsx)("img", {
1561
+ className: O === a.id ? "loaded-image" : "",
1562
+ width: "322px",
1563
+ src: S(a),
1564
+ alt: a.title,
1565
+ onLoad: X(a),
1566
+ onError: K(a)
1567
+ }),
1568
+ (0, r.jsx)("a", {
1569
+ rel: "noreferrer",
1570
+ href: "https://giphy.com/",
1571
+ target: "_blank",
1572
+ onClick: (W) => W.stopPropagation(),
1573
+ children: (0, r.jsx)("div", {
1574
+ className: "overlay-image",
1575
+ style: { backgroundImage: "url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAAAkCAYAAAB/up84AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAABSBJREFUeNrsWjFv2zoQVoMW8BZ18xaN3qLRW9QtW9OtW92to98vaPoP3K1b1S1b3c2jvWlUNm3lw1s8Mpu3PAo4Iocr70jKlp0COuCQlpKPx/t43x1pv3h8fEwGeT5yNoTgeclLZvza6NgxXoNaGRktjE6MpjC2NVqh92bwt4HxBI1ro0s0dgN2tvD5a8a/9vkq0M+xYKdG81A7Gp6pyBjZddrnO6N36Hkbqyn8u4L3vYC0hjLHeAbPVhC4TwAK/ewNvLsEhyxgFXLK2l/D4tvnOVrUiPEh1k/JjvLYyWENdeTcKazBBr6AdY4AqBTmbkIzhO4gvMumYLxAYKzgPTvhBBajYNwCksHYhOyYiow1KONaKYlfO8bPEWyGEfi5Iu+Vjizg7EzB3xvwWTMxWkHG4mDnMF6BnSnYncLzHWGG4BqiwZkKQMC7I0cOVTCJhvRUKNgNCmCOxhNmrBEWzwGi0Y6rIihbsnOH/JgE2hshKrLZv4Px9yhj1twafRlid/UIGWvlFdlVLirIkIM12nETGLeO2tTPECBUZuT/a7JBMpSxUybYLjulUCN2iEpHQoyuGWZJUCa8R/VGSZvGB0iOdjAO9n8EtC2zUxICSIoW0ICTmA53DCDKQzWZg89XAXZ2B2iMavBnjDKpBX6B1tnAM5aqQgGhnU2D6GmHuqw7AkaOPmP/bsHpFC1kTLqVhglS6fFNgX1MCXUHO1zR1h5AFOoSc1jjmKx/An/1PoBQasBSoZZ3hpyaOrg0IW2sRkG8JsU8CaCaLckAhfi6AG0cmeuzkyMQMtL+SiySkY3oA/EgGeICK0UOZYQKVsQpDAjm2BpsaAGQLMKnMdok3yLtpKS70yT7OUBcm7UTHb5grk5y1Csrj40MqUbUpgW7NXo+RunckODkQvdXM37iwm7b1VA7lAaVB4jUUZOUIzNxfOougAwy3GUN0qWG2IJJ09V2NcvIFE8c54nQelEHFM6C6chUhI+WZjjffDQkrenPhqmlrAC9Naof/aLhXZeNNfMZOk+MtPOVRjNmTpfcCut0+biGZ3PBj1ywWTOfqV3v+yjLFuDPRs8Ddu05vLtmsuHQ0s73wehvR0t7aGkPevfCM5fcGr0MbOW9NSSFwF52cP5KcLIv+X4EUGbCemcOqpoz73/haE4CZNkRjAR20vwENXHRc2bWEMyQuUuGVe4hc6K6rBmg7pKN0XdGX7dts9E3Rr8afUATFl1PqgLAG6T3AoX1nSVtMP9l5r5FVyiu+D14/YssRHOheGVQYNMeinrhsMcV2WVPRR1rIRT4QmiA5r4G6oxp0y6ZzFh4LvhmB84MHz1xta9vWQMrcFR/3iF+7DmEu2YoyTshRbuMvGE9hnwGPQR1tdR04aCueKrqAIgiu/AqcCf1JXPhfuoYosGHn4Hgqa6AnCK4IfSkCa1eCJRxLGnn+mX0rfDOJok4AsQAUpwQlND2++HIgNiOVO1LVRIgtXDPs0bpunEU08vktHLMpoJS1/d9qEo6h6gAzq7RRaPV+QmBeICzUUh2fIHzk0s3HedXwkEy2ReQmjn4XDzDjqkN4D/J04/y/np5KbSrrtbwAyx+kTxdf9tfpvSZIW9O3FScHJAF8PEFc5F2lQzSi5wJheoG3U/t0xYOcgBAcOHuAkr7mY9ditoAiCz2q8uvEcD8gJpSDuGNl5hfnaTJ0/fpheMUr4CitHCO6fqdesj359xh1tWiqggfdUCmcz9ZivZ7+BnQM5P/BRgABx8sJWqTxoYAAAAASUVORK5CYII=)" }
1576
+ })
1577
+ }),
1578
+ O === a.id && (0, r.jsx)(f.Spin, {
1579
+ className: "ant-spin",
1580
+ size: "small"
1581
+ })
1582
+ ]
1583
+ }, a.id + y))
1584
+ })
1585
+ })
1586
+ })
1587
+ })]
1588
+ });
1589
+ };
1590
+ function Ht(t) {
1591
+ if (!(t == null || t === "")) return t;
1592
+ }
1593
+ async function Vt(t, e) {
1594
+ if (t) {
1595
+ if (t.url) return t.url;
1596
+ if (typeof e.getFileById == "function" && t.id) {
1597
+ const s = await e.getFileById(t.id);
1598
+ if (s?.url) return s.url;
1599
+ if (s?.thumbnailUrl) return s.thumbnailUrl;
1600
+ if (s?.thumbnail) return s.thumbnail;
1601
+ }
1602
+ if (typeof e.getFileUrl == "function" && t.folderId !== void 0 && t.name) {
1603
+ const s = await e.getFileUrl(t.folderId || "", t.name);
1604
+ if (s) return s;
1605
+ }
1606
+ if (typeof e.getUrl == "function" && t.name) {
1607
+ const s = await e.getUrl(t);
1608
+ if (s) return s;
1609
+ }
1610
+ return t.thumbnail || t.thumbnailUrl;
1611
+ }
1612
+ }
1613
+ function _t(t) {
1614
+ if (!(!t?.success || !Array.isArray(t.detailed))) return t.detailed.find((e) => e?.success && e.data)?.data;
1615
+ }
1616
+ function qt(t, e, s) {
1617
+ if (t) return {
1618
+ id: t.id,
1619
+ name: t.name || e.name,
1620
+ size: t.size ?? e.size,
1621
+ type: t.type || e.type,
1622
+ folderId: t.folderId ?? s ?? "",
1623
+ url: t.url,
1624
+ thumbnail: t.thumbnail,
1625
+ thumbnailUrl: t.thumbnailUrl,
1626
+ date: t.date,
1627
+ dimensions: t.dimensions,
1628
+ aspectRatio: t.aspectRatio,
1629
+ extension: t.extension,
1630
+ selected: t.selected,
1631
+ isFolder: t.isFolder,
1632
+ lastEdited: t.lastEdited,
1633
+ childrenCount: t.childrenCount
1634
+ };
1635
+ }
1636
+ async function Qt(t, e, s) {
1637
+ if (!e) return;
1638
+ const i = Ht(s ?? e.rootId);
1639
+ let o;
1640
+ typeof e.uploadFiles == "function" ? o = _t(await e.uploadFiles({
1641
+ folderId: i,
1642
+ items: [{
1643
+ name: t.name,
1644
+ size: t.size,
1645
+ type: t.type,
1646
+ folderId: i,
1647
+ data: t
1648
+ }]
1649
+ })) : typeof e.uploadFile == "function" && (o = qt(await e.uploadFile({
1650
+ name: t.name,
1651
+ size: t.size,
1652
+ type: t.type,
1653
+ folderId: i,
1654
+ data: t
1655
+ }), t, i));
1656
+ const l = await Vt(o, e);
1657
+ return l ? {
1658
+ item: o,
1659
+ url: l
1660
+ } : void 0;
1661
+ }
1662
+ var ot = "IMG", it = "BACKGROUND", Yt = "GALLERY", Ae = "EDITOR", fe = "UPLOAD", Fe = "STOCK", ze = "GIF", Ke = "AI", Zt = { mode: "select" }, Xt = { mode: "save" }, { Dragger: Jt } = f.Upload, $t = (t, e = "image") => ee.decodeFileNameFromUrl(t) ?? e, Ee = te.normalizeImageFormatForDisplay, en = (t, e) => {
1663
+ const s = Ee(e);
1664
+ return !s || t.includes(".") ? t : `${t}.${s}`;
1665
+ }, tn = (t, e) => new File([t], en($t(e), t.type), { type: t.type || "application/octet-stream" }), lt = ({ dataProvider: t, usesBuiltInStorage: e }) => {
1666
+ const s = d.useAppConfig(), i = d.useIsStandalone(), { __: o } = f.useI18n(), l = d.useDispatch(), { projectId: m } = d.useParams(), [p] = ee.useLazyGetImageInfoQuery(), { modal: g } = f.App.useApp(), x = f.useNotification(), h = d.useSelector(ee.selectActiveModal), { request: v, resolveImagePicker: I } = R.useImagePicker(), [E, b] = (0, n.useState)(""), [O, w] = (0, n.useState)(""), [U, D] = (0, n.useState)(""), [B, V] = (0, n.useState)(""), [M, T] = (0, n.useState)(fe), [Z, q] = (0, n.useState)({
1667
+ width: "",
1668
+ height: "",
1669
+ size: "",
1670
+ format: ""
1671
+ }), [Q, j] = (0, n.useState)("success"), [z, L] = (0, n.useState)(!1), S = n.default.useRef(null), A = n.default.useRef(null), N = n.default.useRef(null), X = n.default.useRef(null), K = n.default.useRef(null), a = n.default.useRef(null), y = n.default.useRef(null), W = n.default.useRef(null), ie = n.default.useRef(null), [$, F] = (0, n.useState)("auto"), [le, P] = (0, n.useState)(572), [he, ye] = (0, n.useState)(!1), [oe, ve] = (0, n.useState)({
1672
+ keywords: "",
1673
+ color: "",
1674
+ orientation: ""
1675
+ }), [J, ne] = (0, n.useState)({ keywords: "" }), [G, ae] = (0, n.useState)([]), [C, _] = (0, n.useState)([]), [Y, me] = (0, n.useState)([]), [ct, ut] = (0, n.useState)(!1), [dt, We] = (0, n.useState)(""), [nn, Re] = (0, n.useState)(!1), [rn, Ue] = (0, n.useState)(0), ft = d.useSelector(d.selectProject), mt = ft?.id !== void 0 ? String(ft.id) : m || "", pt = d.useEventEmitter(d.events.UPLOAD_EVENT_ID), pe = te.useImageBlobResolver(), je = n.default.useRef(""), be = n.default.useRef(0), Ie = n.default.useRef(""), [an, gt] = (0, n.useState)(""), [sn, ht] = (0, n.useState)(null), [on, He] = (0, n.useState)(""), Be = (0, n.useCallback)((c) => {
1676
+ if (!(c instanceof Blob)) return;
1677
+ Ie.current && URL.revokeObjectURL(Ie.current);
1678
+ const u = URL.createObjectURL(c);
1679
+ Ie.current = u, gt(u), ht(c);
1680
+ }, []), ge = (0, n.useCallback)(() => {
1681
+ Ie.current && (URL.revokeObjectURL(Ie.current), Ie.current = ""), gt(""), ht(null);
1682
+ }, []), ce = (0, n.useCallback)(() => {
1683
+ He("");
1684
+ }, []), Ve = R.usePlanFeatureGate("element_ai_image"), _e = R.usePlanFeatureGate("stock_photo"), qe = R.usePlanFeatureGate("stock_gif"), yt = R.usePlanFeatureGate("image_editor"), ln = (c) => {
1685
+ w(c.target.value);
1686
+ }, Le = (0, n.useCallback)((c, u, k = o("The image could not be uploaded.")) => {
1687
+ const H = u instanceof Error ? u.message : k;
1688
+ x.error({
1689
+ id: "IMAGE_UPLOAD_ERROR",
1690
+ data: c,
1691
+ title: o("Upload failed"),
1692
+ description: H
1693
+ });
1694
+ }, [o, x]), cn = (0, n.useCallback)((c) => R.fireUploadImageEvent(pt, {
1695
+ file: c,
1696
+ project: mt
1697
+ }), [mt, pt]), we = te.useImageBlobFetch(), un = (0, n.useCallback)((c) => pe.resolve(te.canonicalImageUrlKey(c), void 0, we), [we, pe]), Me = async (c) => {
1698
+ if (c) try {
1699
+ const u = await dn(c);
1700
+ u && Ye(u) ? await Oe({ file: u }) : u || Le({ url: c }, null, o("Failed to download image from URL."));
1701
+ } catch (u) {
1702
+ Le({ url: c }, u, o("Failed to process image URL."));
1703
+ }
1704
+ }, vt = n.default.useRef(Me);
1705
+ vt.current = Me, n.default.useEffect(() => {
1706
+ if (M !== fe || !B) return;
1707
+ const c = O.trim();
1708
+ if (!c || !c.toLowerCase().startsWith("http")) return;
1709
+ const u = setTimeout(() => {
1710
+ vt.current(c);
1711
+ }, 1e3);
1712
+ return () => {
1713
+ clearTimeout(u);
1714
+ };
1715
+ }, [
1716
+ O,
1717
+ M,
1718
+ B
1719
+ ]);
1720
+ const dn = async (c) => {
1721
+ try {
1722
+ const u = te.canonicalImageUrlKey(c);
1723
+ return tn(await pe.resolve(u, void 0, we), u);
1724
+ } catch {}
1725
+ };
1726
+ document.onpaste = function(c) {
1727
+ const u = c.clipboardData?.items?.[0];
1728
+ if (M === fe && B) {
1729
+ if (u?.type?.indexOf("image") === 0 && s.imageCenterLocalUploadEnabled !== !1) {
1730
+ const H = u.getAsFile();
1731
+ Ye(H);
1732
+ const se = { file: H };
1733
+ w(""), Oe(se);
1734
+ return;
1735
+ }
1736
+ const k = c.clipboardData?.getData("text/plain");
1737
+ if (k && k.trim().toLowerCase().startsWith("http")) {
1738
+ c.preventDefault(), c.stopPropagation(), w(k.trim());
1739
+ return;
1740
+ }
1741
+ u?.type?.indexOf("text") === 0 && u.getAsString((H) => {
1742
+ if (H.trim().toLowerCase().startsWith("http")) w(H.trim());
1743
+ else if (H.toString().slice(1, 5) === "meta") {
1744
+ const se = H.toString().split("\"")[1];
1745
+ se && w(se);
1746
+ }
1747
+ });
1748
+ }
1749
+ }, (0, n.useEffect)(() => {
1750
+ const c = (u) => {
1751
+ let k = null;
1752
+ v?.kind === "background" ? (k = it, V(it)) : v?.kind === "img" && (V(ot), k = ot), v?.currentUrl && k && (b(v.currentUrl), T(u));
1753
+ };
1754
+ h === d.MODALS.UPLOAD_IMAGE_MODAL || h === d.MODALS.UPLOAD_BACKGROUND_MODAL ? c(Ae) : h === d.MODALS.UPLOAD_IMAGE_MODAL_AI || h === d.MODALS.UPLOAD_BACKGROUND_MODAL_AI ? (Ve.isLocked ? (Re(!0), Ue(R.FEATURE_UPSELL_SLIDE.element_ai_image)) : c(Ke), setTimeout(() => ie.current?.focus({ cursor: "start" }), 100)) : h === d.MODALS.UPLOAD_IMAGE_MODAL_UPLOAD || h === d.MODALS.UPLOAD_BACKGROUND_MODAL_UPLOAD ? (c(fe), setTimeout(() => a.current?.focus({ cursor: "start" }), 100)) : h === d.MODALS.UPLOAD_IMAGE_MODAL_STOCK || h === d.MODALS.UPLOAD_BACKGROUND_MODAL_STOCK ? (_e.isLocked ? (Re(!0), Ue(R.FEATURE_UPSELL_SLIDE.stock_photo)) : c(Fe), setTimeout(() => W.current?.focus({ cursor: "start" }), 100)) : h === d.MODALS.UPLOAD_IMAGE_MODAL_GIF || h === d.MODALS.UPLOAD_BACKGROUND_MODAL_GIF ? (qe.isLocked ? (Re(!0), Ue(R.FEATURE_UPSELL_SLIDE.stock_gif)) : c(ze), setTimeout(() => y.current?.focus({ cursor: "start" }), 100)) : h === d.MODALS.UPLOAD_IMAGE_MODAL_EDIT || h === d.MODALS.UPLOAD_BACKGROUND_MODAL_EDIT ? (yt.isLocked ? (Re(!0), Ue(R.FEATURE_UPSELL_SLIDE.image_editor)) : c(Ae), l(ee.openSecondModal(d.MODALS.IMAGE_EDITOR_MODAL))) : V("");
1755
+ }, [
1756
+ h,
1757
+ l,
1758
+ Ve.isLocked,
1759
+ _e.isLocked,
1760
+ qe.isLocked,
1761
+ yt.isLocked,
1762
+ v
1763
+ ]);
1764
+ const Qe = (0, n.useCallback)(({ url: c = E || "", meta: u = Zt }) => {
1765
+ b(c), I({
1766
+ url: c,
1767
+ meta: u
1768
+ }), setTimeout(() => {
1769
+ ce(), ge(), ve({
1770
+ keywords: "",
1771
+ color: "",
1772
+ orientation: ""
1773
+ }), ne({ keywords: "" }), _([]), ae([]), V(""), We(""), ut(!1), D(""), w(""), T(fe);
1774
+ }, 200), l(ee.closeModal()), l(ee.closeSecondModal());
1775
+ }, [
1776
+ E,
1777
+ ce,
1778
+ l,
1779
+ I,
1780
+ ge
1781
+ ]), Ct = (0, n.useCallback)((c, u) => (F("auto"), L(!1), Qe({
1782
+ url: c,
1783
+ meta: Xt
1784
+ }), x.success({
1785
+ id: "IMAGE_UPLOAD_SUCCESS",
1786
+ data: u,
1787
+ title: o("The image was successfully uploaded.")
1788
+ }), c), [
1789
+ o,
1790
+ Qe,
1791
+ x
1792
+ ]);
1793
+ (0, n.useEffect)(() => {
1794
+ const c = O || U, u = te.canonicalImageUrlKey(c);
1795
+ if (!c || !u) {
1796
+ j(""), je.current && pe.abandonKey(je.current), je.current = "", ce(), ge();
1797
+ return;
1798
+ }
1799
+ const k = je.current;
1800
+ k && k !== u && (pe.abandonKey(k), ce(), ge()), je.current = u;
1801
+ const H = new AbortController(), se = O ? 800 : 0, re = ++be.current, Ze = setTimeout(async () => {
1802
+ try {
1803
+ const xe = async () => {
1804
+ const de = await pe.resolve(u, H.signal, we);
1805
+ if (re !== be.current) return;
1806
+ const { width: Ce, height: gn } = await te.getImageDimensionsFromBlob(de);
1807
+ re === be.current && (q({
1808
+ width: Ce,
1809
+ height: gn,
1810
+ size: (de.size / 1024).toFixed(2),
1811
+ format: Ee(de.type)
1812
+ }), ce(), Be(de));
1813
+ };
1814
+ if (i) await xe();
1815
+ else {
1816
+ const de = await te.resolveDataProviderPreview(t, u);
1817
+ if (de?.previewUrl && re === be.current) {
1818
+ He(de.previewUrl), ge();
1819
+ try {
1820
+ const { data: Ce } = await p(u);
1821
+ if (re !== be.current) return;
1822
+ Ce ? q({
1823
+ width: Ce?.width,
1824
+ height: Ce?.height,
1825
+ size: Ce?.fileSize != null ? (Ce.fileSize / 1024).toFixed(2) : "",
1826
+ format: Ee(Ce?.format)
1827
+ }) : await xe();
1828
+ } catch {
1829
+ await xe();
1830
+ }
1831
+ } else await xe();
1832
+ }
1833
+ if (re !== be.current) return;
1834
+ j("success"), b(c), P(572), setTimeout(() => {
1835
+ let de = 0;
1836
+ A.current && (de = A.current.offsetHeight + 62), F(de);
1837
+ }, 0);
1838
+ } catch (xe) {
1839
+ if (xe?.name === "AbortError" || H.signal.aborted || re !== be.current) return;
1840
+ ce(), ge(), j("error");
1841
+ }
1842
+ }, se);
1843
+ return () => {
1844
+ clearTimeout(Ze), H.abort();
1845
+ };
1846
+ }, [
1847
+ O,
1848
+ U,
1849
+ i,
1850
+ ce,
1851
+ we,
1852
+ p,
1853
+ pe,
1854
+ ge,
1855
+ t,
1856
+ Be
1857
+ ]), (0, n.useEffect)(() => {
1858
+ if (!E || O || U || !h) return;
1859
+ const c = te.canonicalImageUrlKey(E), u = new AbortController();
1860
+ let k = !1;
1861
+ const H = async () => {
1862
+ const se = await pe.resolve(c, u.signal, we);
1863
+ if (k) return;
1864
+ const { width: re, height: Ze } = await te.getImageDimensionsFromBlob(se);
1865
+ k || (ce(), Be(se), q({
1866
+ width: re,
1867
+ height: Ze,
1868
+ size: (se.size / 1024).toFixed(2),
1869
+ format: Ee(se.type)
1870
+ }));
1871
+ };
1872
+ return (async () => {
1873
+ try {
1874
+ if (!i) {
1875
+ const se = await te.resolveDataProviderPreview(t, c);
1876
+ if (se?.previewUrl && !k) {
1877
+ He(se.previewUrl), ge();
1878
+ try {
1879
+ const { data: re } = await p(c);
1880
+ if (k) return;
1881
+ re ? q({
1882
+ width: re?.width,
1883
+ height: re?.height,
1884
+ size: re?.fileSize != null ? (re.fileSize / 1024).toFixed(2) : "",
1885
+ format: Ee(re?.format)
1886
+ }) : await H();
1887
+ return;
1888
+ } catch {
1889
+ await H();
1890
+ }
1891
+ }
1892
+ }
1893
+ await H();
1894
+ } catch {
1895
+ k || ce();
1896
+ }
1897
+ })(), () => {
1898
+ k = !0, u.abort();
1899
+ };
1900
+ }, [
1901
+ i,
1902
+ h,
1903
+ ce,
1904
+ E,
1905
+ we,
1906
+ p,
1907
+ pe,
1908
+ t,
1909
+ O,
1910
+ U,
1911
+ Be
1912
+ ]);
1913
+ const fn = () => {
1914
+ l(ee.closeModal()), setTimeout(() => {
1915
+ ce(), ge(), b(""), w(""), _([]), _([]), ve({
1916
+ keywords: "",
1917
+ color: "",
1918
+ orientation: ""
1919
+ }), ne({ keywords: "" }), F("auto"), !ct && We(""), P(572), T(fe);
1920
+ }, 200);
1921
+ }, mn = (c) => {
1922
+ c === Yt ? g.success({
1923
+ mask: { closable: !0 },
1924
+ centered: !0,
1925
+ title: o("Coming soon"),
1926
+ content: o("The feature is under development."),
1927
+ okText: o("Ok. I'll be waiting"),
1928
+ onOk: () => {}
1929
+ }) : c === Ae && E === "" ? g.warning({
1930
+ mask: { closable: !0 },
1931
+ centered: !0,
1932
+ title: o(""),
1933
+ content: o("To preview and edit the uploaded image"),
1934
+ okText: o("Upload Image"),
1935
+ onOk: () => {
1936
+ T(fe);
1937
+ }
1938
+ }) : (setTimeout(() => {
1939
+ let u = 0, k = 0;
1940
+ c === fe && S.current ? (oe.keywords === "" && a.current?.focus({ cursor: "start" }), u = 300, k = 572) : c === Ae && A.current ? (u = A.current.offsetHeight + 62, k = 572) : c === Fe && N.current ? (oe.keywords === "" && W.current?.focus({ cursor: "start" }), u = 130, k = 572, C.length > 0 && (k = 1060, u = "84vh")) : c === ze && X.current ? (oe.keywords === "" && y.current?.focus({ cursor: "start" }), u = 130, k = 572, G.length > 0 && (k = 1060, u = "84vh")) : c === Ke && K.current && (dt === "" && Y.length === 0 ? (ie.current?.focus({ cursor: "start" }), u = 130) : u = K.current.offsetHeight + 82, k = 572), F(u), P(k);
1941
+ }, 0), T(c));
1942
+ };
1943
+ (0, n.useEffect)(() => {
1944
+ oe.keywords === "" && (a?.current?.focus({ cursor: "start" }), _([]), setTimeout(() => {
1945
+ F("auto"), P(572);
1946
+ }, 0));
1947
+ }, [
1948
+ oe,
1949
+ _,
1950
+ F,
1951
+ P
1952
+ ]);
1953
+ const Ye = (c) => {
1954
+ const u = c.type === "image/jpeg" || c.type === "image/png" || c.type === "image/jpg" || c.type === "image/webp" || c.type === "image/gif" || c.type === "image/svg+xml";
1955
+ return u || x.error({
1956
+ id: "IMAGE_UPLOAD_WRONG_FORMAT",
1957
+ data: c,
1958
+ title: "Upload",
1959
+ description: "You can only upload JPG/JPEG/PNG/WEBP/GIF/SVG file!"
1960
+ }), u;
1961
+ }, Oe = async ({ file: c }) => {
1962
+ try {
1963
+ ye(!0);
1964
+ const u = await te.prepareImageForEditorUpload(c, s), k = await cn(u);
1965
+ if (k.url) return Ct(k.url, u), k.url;
1966
+ if (!R.shouldFallbackToBuiltInUpload(k, {
1967
+ isStandalone: i,
1968
+ targetIsOurBackend: !!e
1969
+ })) {
1970
+ Le(u, R.toUploadImageError(k));
1971
+ return;
1972
+ }
1973
+ const H = await Qt(u, t);
1974
+ if (H?.url) return Ct(H.url, u), H.url;
1975
+ Le(u, null);
1976
+ return;
1977
+ } catch (u) {
1978
+ Le(c, u);
1979
+ return;
1980
+ } finally {
1981
+ ye(!1);
1982
+ }
1983
+ }, pn = (c) => Oe({ file: c });
1984
+ let De = [{
1985
+ label: o("Upload"),
1986
+ key: fe,
1987
+ children: (0, r.jsxs)("div", {
1988
+ ref: S,
1989
+ style: { paddingBottom: 24 },
1990
+ children: [s.imageCenterLocalUploadEnabled !== !1 && (0, r.jsxs)(Jt, {
1991
+ showUploadList: !1,
1992
+ name: "Image",
1993
+ beforeUpload: Ye,
1994
+ customRequest: Oe,
1995
+ style: { marginBottom: 10 },
1996
+ multiple: !1,
1997
+ accept: "image/png, image/jpeg, image/jpg, image/webp, image/gif, image/svg+xml",
1998
+ children: [
1999
+ (0, r.jsx)("p", {
2000
+ className: "ant-upload-drag-icon",
2001
+ children: (0, r.jsx)(R.EmIcons, { icon: "InboxOutlined" })
2002
+ }),
2003
+ (0, r.jsx)("p", {
2004
+ className: "ant-upload-text",
2005
+ children: o("Click to select, paste from the clipboard, or drag and drop")
2006
+ }),
2007
+ (0, r.jsx)("p", {
2008
+ className: "ant-upload-hint",
2009
+ children: o("Accepted formats: PNG, JPG, WEBP, SVG or GIF.")
2010
+ })
2011
+ ]
2012
+ }), (0, r.jsx)(f.Form, {
2013
+ style: { padding: "0 2px 0 2px" },
2014
+ children: (0, r.jsx)(f.Form.Item, {
2015
+ validateStatus: Q,
2016
+ children: (0, r.jsx)(f.Input, {
2017
+ ref: a,
2018
+ allowClear: !0,
2019
+ size: "large",
2020
+ placeholder: o("Paste image URL here"),
2021
+ value: O,
2022
+ onChange: ln,
2023
+ spellCheck: "false"
2024
+ })
2025
+ })
2026
+ })]
2027
+ })
2028
+ }];
2029
+ return s.imageCenterStockEnabled && !_e.isLocked && De.push({
2030
+ label: o("Stock"),
2031
+ key: Fe,
2032
+ children: (0, r.jsx)("div", {
2033
+ ref: N,
2034
+ style: { paddingBottom: 24 },
2035
+ children: (0, r.jsx)(Nt, {
2036
+ currentReq: oe,
2037
+ setCurrentReq: ve,
2038
+ imageStockList: C,
2039
+ setImageStockList: _,
2040
+ setModalWidth: P,
2041
+ setModalHeight: F,
2042
+ setStockLink: D,
2043
+ setCurrentImageLink: b,
2044
+ inputRef: W,
2045
+ customRequest: Me
2046
+ })
2047
+ })
2048
+ }), s.imageCenterGifEnabled && !qe.isLocked && De.push({
2049
+ label: o("GIF"),
2050
+ key: ze,
2051
+ children: (0, r.jsx)("div", {
2052
+ ref: X,
2053
+ style: { paddingBottom: 24 },
2054
+ children: (0, r.jsx)(Wt, {
2055
+ currentReqGif: J,
2056
+ setCurrentReqGif: ne,
2057
+ imageGifList: G,
2058
+ setImageGifList: ae,
2059
+ setModalWidth: P,
2060
+ setModalHeight: F,
2061
+ setStockLink: D,
2062
+ setCurrentImageLink: b,
2063
+ inputRef: y,
2064
+ customRequest: Me
2065
+ })
2066
+ })
2067
+ }), s.elementAIimageEnabled && !Ve.isLocked && De.push({
2068
+ label: o("AI"),
2069
+ key: Ke,
2070
+ children: (0, r.jsx)("div", {
2071
+ ref: K,
2072
+ style: { paddingBottom: 24 },
2073
+ children: (0, r.jsx)(Kt, {
2074
+ setModalHeight: F,
2075
+ customRequest: Oe,
2076
+ aiImageRequest: dt,
2077
+ setAiImageRequest: We,
2078
+ imageAiList: Y,
2079
+ setImageAiList: me,
2080
+ isLoadingAi: ct,
2081
+ setIsLoadingAi: ut,
2082
+ aiTabRef: K,
2083
+ inputAiRef: ie,
2084
+ isImageUploaded: z,
2085
+ setIsImageUploaded: L
2086
+ })
2087
+ })
2088
+ }), s.imageCenterEditorEnabled && De.push({
2089
+ label: "",
2090
+ key: Ae,
2091
+ children: (0, r.jsx)("div", {
2092
+ ref: A,
2093
+ children: (0, r.jsx)(Ot, {
2094
+ currentImageLink: E,
2095
+ newLink: O,
2096
+ previewDisplayUrl: on,
2097
+ resolvedPreviewObjectUrl: an,
2098
+ resolvedPreviewBlob: sn,
2099
+ resolveImageBlob: un,
2100
+ imageSize: Z,
2101
+ onSave: pn,
2102
+ uploadImageResultIsLoading: he || !1
2103
+ })
2104
+ })
2105
+ }), (0, r.jsxs)(r.Fragment, { children: [(0, r.jsx)(f.Modal, {
2106
+ width: le,
2107
+ className: "image-center",
2108
+ title: o("Image Center"),
2109
+ style: { minHeight: 390 },
2110
+ open: !!B,
2111
+ onOk: Qe,
2112
+ onCancel: fn,
2113
+ footer: M === Ae ? (0, r.jsx)(r.Fragment, {}) : null,
2114
+ children: (0, r.jsx)(f.Spin, {
2115
+ spinning: he,
2116
+ children: (0, r.jsx)(f.Tabs, {
2117
+ activeKey: M,
2118
+ onChange: mn,
2119
+ items: De,
2120
+ className: "modal-tabs",
2121
+ style: {
2122
+ height: $,
2123
+ minHeight: 130
2124
+ }
2125
+ })
2126
+ })
2127
+ }), (0, r.jsx)(R.PlanUpgradePrompt, {
2128
+ open: nn,
2129
+ onCancel: () => Re(!1),
2130
+ initialSlide: rn
2131
+ })] });
2132
+ };
2133
+ lt.propTypes = { dataProvider: At.default.object }, bt.default = lt;
2134
+ });