@myissue/vue-website-page-builder 3.4.19 → 3.4.21

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 (89) hide show
  1. package/README.md +32 -26
  2. package/dist/vue-website-page-builder.js +1263 -1259
  3. package/dist/vue-website-page-builder.umd.cjs +46 -46
  4. package/package.json +3 -5
  5. package/src/App.vue +0 -28
  6. package/src/Components/Homepage/Footer.vue +0 -32
  7. package/src/Components/Homepage/Navbar.vue +0 -25
  8. package/src/Components/Layouts/FullWidthElement.vue +0 -34
  9. package/src/Components/Loaders/GlobalLoader.vue +0 -18
  10. package/src/Components/Modals/BuilderComponents.vue +0 -53
  11. package/src/Components/Modals/DynamicModalBuilder.vue +0 -209
  12. package/src/Components/Modals/MediaLibraryModal.vue +0 -61
  13. package/src/Components/Modals/ModalBuilder.vue +0 -117
  14. package/src/Components/PageBuilder/EditorMenu/Editables/BackgroundColorEditor.vue +0 -121
  15. package/src/Components/PageBuilder/EditorMenu/Editables/BorderRadius.vue +0 -188
  16. package/src/Components/PageBuilder/EditorMenu/Editables/Borders.vue +0 -176
  17. package/src/Components/PageBuilder/EditorMenu/Editables/ClassEditor.vue +0 -112
  18. package/src/Components/PageBuilder/EditorMenu/Editables/ComponentTopMenu.vue +0 -108
  19. package/src/Components/PageBuilder/EditorMenu/Editables/EditGetElement.vue +0 -541
  20. package/src/Components/PageBuilder/EditorMenu/Editables/HTMLEditor.vue +0 -203
  21. package/src/Components/PageBuilder/EditorMenu/Editables/ImageEditor.vue +0 -96
  22. package/src/Components/PageBuilder/EditorMenu/Editables/LinkEditor.vue +0 -315
  23. package/src/Components/PageBuilder/EditorMenu/Editables/ManageBackgroundOpacity.vue +0 -107
  24. package/src/Components/PageBuilder/EditorMenu/Editables/ManageOpacity.vue +0 -106
  25. package/src/Components/PageBuilder/EditorMenu/Editables/Margin.vue +0 -116
  26. package/src/Components/PageBuilder/EditorMenu/Editables/OpacityEditor.vue +0 -19
  27. package/src/Components/PageBuilder/EditorMenu/Editables/Padding.vue +0 -117
  28. package/src/Components/PageBuilder/EditorMenu/Editables/StyleEditor.vue +0 -123
  29. package/src/Components/PageBuilder/EditorMenu/Editables/TextColorEditor.vue +0 -123
  30. package/src/Components/PageBuilder/EditorMenu/Editables/Typography.vue +0 -237
  31. package/src/Components/PageBuilder/EditorMenu/EditorAccordion.vue +0 -46
  32. package/src/Components/PageBuilder/EditorMenu/RightSidebarEditor.vue +0 -368
  33. package/src/Components/PageBuilder/Settings/AdvancedPageBuilderSettings.vue +0 -476
  34. package/src/Components/PageBuilder/Settings/PageBuilderSettings.vue +0 -581
  35. package/src/Components/PageBuilder/ToolbarOption/ToolbarOption.vue +0 -248
  36. package/src/Components/PageBuilder/UndoRedo/UndoRedo.vue +0 -90
  37. package/src/Components/TipTap/TipTap.vue +0 -25
  38. package/src/Components/TipTap/TipTapInput.vue +0 -340
  39. package/src/PageBuilder/PageBuilder.vue +0 -1025
  40. package/src/PageBuilder/Preview.vue +0 -64
  41. package/src/composables/builderInstance.ts +0 -47
  42. package/src/composables/delay.ts +0 -5
  43. package/src/composables/extractCleanHTMLFromPageBuilder.ts +0 -59
  44. package/src/composables/preloadImage.ts +0 -8
  45. package/src/composables/useDebounce.ts +0 -8
  46. package/src/composables/usePageBuilderModal.ts +0 -25
  47. package/src/composables/useTranslations.ts +0 -28
  48. package/src/css/dev-global.css +0 -24
  49. package/src/css/style.css +0 -600
  50. package/src/helpers/isEmptyObject.ts +0 -5
  51. package/src/index.ts +0 -28
  52. package/src/locales/ar.json +0 -170
  53. package/src/locales/de.json +0 -171
  54. package/src/locales/en.json +0 -171
  55. package/src/locales/es.json +0 -171
  56. package/src/locales/fr.json +0 -171
  57. package/src/locales/hi.json +0 -172
  58. package/src/locales/ja.json +0 -171
  59. package/src/locales/pt.json +0 -171
  60. package/src/locales/ru.json +0 -171
  61. package/src/locales/zh-Hans.json +0 -171
  62. package/src/main.ts +0 -14
  63. package/src/plugin.ts +0 -16
  64. package/src/services/LocalStorageManager.ts +0 -25
  65. package/src/services/PageBuilderService.ts +0 -3191
  66. package/src/stores/page-builder-state.ts +0 -498
  67. package/src/stores/shared-store.ts +0 -13
  68. package/src/tailwind-safelist.html +0 -3
  69. package/src/tests/DefaultComponents/DefaultBuilderComponents.vue +0 -284
  70. package/src/tests/DefaultComponents/DefaultMediaLibraryComponent.vue +0 -10
  71. package/src/tests/PageBuilderTest.vue +0 -82
  72. package/src/tests/TestComponents/DemoBuilderComponentsTest.vue +0 -5
  73. package/src/tests/TestComponents/DemoMediaLibraryComponentTest.vue +0 -8
  74. package/src/tests/TestComponents/DemoUnsplash.vue +0 -389
  75. package/src/tests/componentsArray.test.json +0 -62
  76. package/src/tests/pageBuilderService.test.ts +0 -165
  77. package/src/types/global.d.ts +0 -11
  78. package/src/types/index.ts +0 -306
  79. package/src/utils/builder/html-doc-declaration-with-components.ts +0 -7
  80. package/src/utils/builder/tailwaind-colors.ts +0 -503
  81. package/src/utils/builder/tailwind-border-radius.ts +0 -67
  82. package/src/utils/builder/tailwind-border-style-width-color.ts +0 -272
  83. package/src/utils/builder/tailwind-font-sizes.ts +0 -75
  84. package/src/utils/builder/tailwind-font-styles.ts +0 -56
  85. package/src/utils/builder/tailwind-opacities.ts +0 -45
  86. package/src/utils/builder/tailwind-padding-margin.ts +0 -159
  87. package/src/utils/html-elements/component.ts +0 -485
  88. package/src/utils/html-elements/componentHelpers.ts +0 -98
  89. package/src/utils/html-elements/themes.ts +0 -85
@@ -1,581 +0,0 @@
1
- <script setup>
2
- import { ref, computed } from 'vue'
3
- import { sharedPageBuilderStore } from '../../../stores/shared-store'
4
-
5
- import { isEmptyObject } from '../../../helpers/isEmptyObject.ts'
6
- const version = __APP_VERSION__
7
-
8
- // Use shared store instance
9
- const pageBuilderStateStore = sharedPageBuilderStore
10
-
11
- const getPageBuilderConfig = computed(() => {
12
- return pageBuilderStateStore.getPageBuilderConfig
13
- })
14
- </script>
15
-
16
- <template>
17
- <div
18
- class="pbx-w-full pbx-inset-x-0 pbx-h-[90vh] pbx-bg-white pbx-overflow-x-scroll lg:pbx-pt-2 pbx-pt-2"
19
- >
20
- <!-- Advanced Settings - start -->
21
- <div
22
- class="pbx-mt-4 pbx-mb-4 pbx-py-8 pbx-px-2 pbx-border pbx-border-solid pbx-border-gray-600 pbx-rounded-xl"
23
- >
24
- <!-- Advanced Settings - start -->
25
- <div>
26
- <div class="pbx-flex pbx-items-left pbx-flex-col pbx-gap-1">
27
- <h3 class="pbx-myQuaternaryHeader">Configuration Overview</h3>
28
- <p class="pbx-myPrimaryParagraph pbx-text-xs">
29
- A summary of current user preferences, application settings, and system metadata
30
- including UI theme, language, saved components, and logo configuration.
31
- </p>
32
- </div>
33
-
34
- <!-- Version Information Table - start -->
35
- <div class="pbx-px-2">
36
- <div class="pbx-mt-8">
37
- <h4 class="pbx-myQuaternaryHeader pbx-text-sm pbx-mb-2">Version Information</h4>
38
- <div
39
- class="pbx-overflow-hidden pbx-shadow pbx-ring-1 pbx-ring-black pbx-ring-opacity-5 md:pbx-rounded-lg"
40
- >
41
- <div class="pbx-overflow-x-auto">
42
- <table class="pbx-min-w-full">
43
- <thead class="pbx-bg-gray-50">
44
- <tr>
45
- <th
46
- scope="col"
47
- class="pbx-px-6 pbx-py-3 pbx-text-left pbx-text-xs pbx-font-medium pbx-text-gray-500 pbx-uppercase pbx-tracking-wider"
48
- >
49
- App
50
- </th>
51
- <th
52
- scope="col"
53
- class="pbx-px-6 pbx-py-3 pbx-text-left pbx-text-xs pbx-font-medium pbx-text-gray-500 pbx-uppercase pbx-tracking-wider"
54
- >
55
- Version
56
- </th>
57
- </tr>
58
- </thead>
59
- <tbody class="pbx-bg-white pbx-divide-y pbx-divide-gray-200">
60
- <tr>
61
- <td
62
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-font-medium pbx-text-gray-900"
63
- >
64
- <div class="pbx-min-w-[30rem] pbx-w-max">Page Builder</div>
65
- </td>
66
- <td
67
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-text-gray-500"
68
- >
69
- <div class="pbx-min-w-[30rem] pbx-w-max">
70
- <span
71
- class="pbx-inline-flex pbx-items-center pbx-px-2.5 pbx-py-0.5 pbx-rounded-full pbx-text-xs pbx-font-medium pbx-bg-blue-100 pbx-text-blue-800"
72
- >
73
- {{ version }}
74
- </span>
75
- </div>
76
- </td>
77
- </tr>
78
- </tbody>
79
- </table>
80
- </div>
81
- </div>
82
- </div>
83
- <!-- Version Information Table - end -->
84
-
85
- <!-- Resource Data Table - start -->
86
- <div
87
- class="pbx-mt-4"
88
- v-if="
89
- getPageBuilderConfig?.resourceData &&
90
- !isEmptyObject(getPageBuilderConfig.resourceData)
91
- "
92
- >
93
- <h4 class="pbx-myQuaternaryHeader pbx-text-sm pbx-mb-2">Resource Data</h4>
94
- <div
95
- class="pbx-overflow-hidden pbx-shadow pbx-ring-1 pbx-ring-black pbx-ring-opacity-5 md:pbx-rounded-lg"
96
- >
97
- <div class="pbx-overflow-x-auto">
98
- <table class="pbx-min-w-full">
99
- <thead class="pbx-bg-gray-50">
100
- <tr>
101
- <th
102
- scope="col"
103
- class="pbx-px-6 pbx-py-3 pbx-text-left pbx-text-xs pbx-font-medium pbx-text-gray-500 pbx-uppercase pbx-tracking-wider"
104
- >
105
- Property
106
- </th>
107
- <th
108
- scope="col"
109
- class="pbx-px-6 pbx-py-3 pbx-text-left pbx-text-xs pbx-font-medium pbx-text-gray-500 pbx-uppercase pbx-tracking-wider"
110
- >
111
- Value
112
- </th>
113
- </tr>
114
- </thead>
115
- <tbody class="pbx-bg-white pbx-divide-y pbx-divide-gray-200">
116
- <tr v-if="getPageBuilderConfig?.resourceData?.title">
117
- <td
118
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-font-medium pbx-text-gray-900"
119
- >
120
- <div class="pbx-min-w-[30rem] pbx-w-max">Title</div>
121
- </td>
122
- <td
123
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-text-gray-500"
124
- >
125
- <div class="pbx-min-w-[30rem] pbx-w-max">
126
- {{ getPageBuilderConfig.resourceData.title }}
127
- </div>
128
- </td>
129
- </tr>
130
- <tr v-if="getPageBuilderConfig?.resourceData?.id">
131
- <td
132
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-font-medium pbx-text-gray-900"
133
- >
134
- <div class="pbx-min-w-[30rem] pbx-w-max">ID</div>
135
- </td>
136
- <td
137
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-text-gray-500"
138
- >
139
- <div class="pbx-min-w-[30rem] pbx-w-max">
140
- {{ getPageBuilderConfig.resourceData.id }}
141
- </div>
142
- </td>
143
- </tr>
144
- </tbody>
145
- </table>
146
- </div>
147
- </div>
148
- </div>
149
- <!-- Resource Data Table - end -->
150
-
151
- <!-- User Information Table - start -->
152
- <div
153
- class="pbx-mt-8"
154
- v-if="
155
- getPageBuilderConfig?.userForPageBuilder &&
156
- !isEmptyObject(getPageBuilderConfig.userForPageBuilder)
157
- "
158
- >
159
- <h4 class="pbx-myQuaternaryHeader pbx-text-sm pbx-mb-2">User Information</h4>
160
- <div
161
- class="pbx-overflow-hidden pbx-shadow pbx-ring-1 pbx-ring-black pbx-ring-opacity-5 md:pbx-rounded-lg"
162
- >
163
- <div class="pbx-overflow-x-auto">
164
- <table class="pbx-min-w-full">
165
- <thead class="pbx-bg-gray-50">
166
- <tr>
167
- <th
168
- scope="col"
169
- class="pbx-px-6 pbx-py-3 pbx-text-left pbx-text-xs pbx-font-medium pbx-text-gray-500 pbx-uppercase pbx-tracking-wider"
170
- >
171
- Property
172
- </th>
173
- <th
174
- scope="col"
175
- class="pbx-px-6 pbx-py-3 pbx-text-left pbx-text-xs pbx-font-medium pbx-text-gray-500 pbx-uppercase pbx-tracking-wider"
176
- >
177
- Value
178
- </th>
179
- </tr>
180
- </thead>
181
- <tbody class="pbx-bg-white pbx-divide-y pbx-divide-gray-200">
182
- <tr>
183
- <td
184
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-font-medium pbx-text-gray-900"
185
- >
186
- <div class="pbx-min-w-[30rem] pbx-w-max">User Name</div>
187
- </td>
188
- <td
189
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-text-gray-500"
190
- >
191
- <div class="pbx-min-w-[30rem] pbx-w-max">
192
- {{ getPageBuilderConfig.userForPageBuilder.name }}
193
- </div>
194
- </td>
195
- </tr>
196
- <tr>
197
- <td
198
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-font-medium pbx-text-gray-900"
199
- >
200
- <div class="pbx-min-w-[30rem] pbx-w-max">Image</div>
201
- </td>
202
- <td
203
- v-if="
204
- getPageBuilderConfig.userForPageBuilder.image &&
205
- typeof getPageBuilderConfig.userForPageBuilder.image === 'string' &&
206
- getPageBuilderConfig.userForPageBuilder.image.length > 2
207
- "
208
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-text-gray-500"
209
- >
210
- <div class="pbx-min-w-[30rem] pbx-w-max">
211
- <div class="pbx-flex pbx-items-center pbx-space-x-3">
212
- <img
213
- class="pbx-block pbx-inset-0 pbx-object-top pbx-h-10 pbx-min-h-10 pbx-max-h-10 pbx-w-10 pbx-min-w-10 pbx-max-w-10 pbx-object-cover pbx-rounded-full"
214
- :src="getPageBuilderConfig.userForPageBuilder.image"
215
- alt="image"
216
- />
217
- </div>
218
- </div>
219
- </td>
220
- </tr>
221
- <tr>
222
- <td
223
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-font-medium pbx-text-gray-900"
224
- >
225
- <div class="pbx-min-w-[30rem] pbx-w-max">Image URL</div>
226
- </td>
227
- <td
228
- v-if="
229
- getPageBuilderConfig.userForPageBuilder.image &&
230
- typeof getPageBuilderConfig.userForPageBuilder.image === 'string' &&
231
- getPageBuilderConfig.userForPageBuilder.image.length > 2
232
- "
233
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-text-gray-500"
234
- >
235
- <div class="pbx-min-w-[30rem] pbx-w-max">
236
- {{ getPageBuilderConfig.userForPageBuilder.image }}
237
- </div>
238
- </td>
239
- </tr>
240
- </tbody>
241
- </table>
242
- </div>
243
- </div>
244
- </div>
245
- <!-- User Information Table - end -->
246
-
247
- <!-- User Settings Table - start -->
248
- <div
249
- class="pbx-mt-8"
250
- v-if="
251
- getPageBuilderConfig?.userSettings &&
252
- !isEmptyObject(getPageBuilderConfig.userSettings)
253
- "
254
- >
255
- <h4 class="pbx-myQuaternaryHeader pbx-text-sm pbx-mb-2">User Settings</h4>
256
- <div
257
- class="pbx-overflow-hidden pbx-shadow pbx-ring-1 pbx-ring-black pbx-ring-opacity-5 md:pbx-rounded-lg"
258
- >
259
- <div class="pbx-overflow-x-auto">
260
- <table class="pbx-min-w-full">
261
- <thead class="pbx-bg-gray-50">
262
- <tr>
263
- <th
264
- scope="col"
265
- class="pbx-px-6 pbx-py-3 pbx-text-left pbx-text-xs pbx-font-medium pbx-text-gray-500 pbx-uppercase pbx-tracking-wider"
266
- >
267
- Setting
268
- </th>
269
- <th
270
- scope="col"
271
- class="pbx-px-6 pbx-py-3 pbx-text-left pbx-text-xs pbx-font-medium pbx-text-gray-500 pbx-uppercase pbx-tracking-wider"
272
- >
273
- Value
274
- </th>
275
- </tr>
276
- </thead>
277
- <tbody class="pbx-bg-white pbx-divide-y pbx-divide-gray-200">
278
- <tr v-if="getPageBuilderConfig?.userSettings?.theme">
279
- <td
280
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-font-medium pbx-text-gray-900"
281
- >
282
- <div class="pbx-min-w-[30rem] pbx-w-max">Theme</div>
283
- </td>
284
- <td
285
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-text-gray-500"
286
- >
287
- <div class="pbx-min-w-[30rem] pbx-w-max">
288
- {{ getPageBuilderConfig.userSettings.theme }}
289
- </div>
290
- </td>
291
- </tr>
292
- <tr v-if="getPageBuilderConfig?.userSettings?.language">
293
- <td
294
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-font-medium pbx-text-gray-900"
295
- >
296
- <div class="pbx-min-w-[30rem] pbx-w-max">Language</div>
297
- </td>
298
- <td
299
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-text-gray-500"
300
- >
301
- <div class="pbx-min-w-[30rem] pbx-w-max">
302
- {{ getPageBuilderConfig.userSettings.language }}
303
- </div>
304
- </td>
305
- </tr>
306
- <tr v-if="getPageBuilderConfig?.userSettings?.autoSave !== undefined">
307
- <td
308
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-font-medium pbx-text-gray-900"
309
- >
310
- <div class="pbx-min-w-[30rem] pbx-w-max">Auto Save</div>
311
- </td>
312
- <td
313
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-text-gray-500"
314
- >
315
- <div class="pbx-min-w-[30rem] pbx-w-max">
316
- <span
317
- class="pbx-inline-flex pbx-items-center pbx-px-2.5 pbx-py-0.5 pbx-rounded-full pbx-text-xs pbx-font-medium"
318
- :class="
319
- getPageBuilderConfig.userSettings.autoSave
320
- ? 'bg-green-100 text-green-800'
321
- : 'bg-red-100 text-red-800'
322
- "
323
- >
324
- {{
325
- getPageBuilderConfig.userSettings.autoSave ? 'Enabled' : 'Disabled'
326
- }}
327
- </span>
328
- </div>
329
- </td>
330
- </tr>
331
- <tr v-if="getPageBuilderConfig?.userSettings?.notifications !== undefined">
332
- <td
333
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-font-medium pbx-text-gray-900"
334
- >
335
- <div class="pbx-min-w-[30rem] pbx-w-max">Notifications</div>
336
- </td>
337
- <td
338
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-text-gray-500"
339
- >
340
- <div class="pbx-min-w-[30rem] pbx-w-max">
341
- <span
342
- class="pbx-inline-flex pbx-items-center pbx-px-2.5 pbx-py-0.5 pbx-rounded-full pbx-text-xs pbx-font-medium"
343
- :class="
344
- getPageBuilderConfig.userSettings.notifications
345
- ? 'bg-green-100 text-green-800'
346
- : 'bg-red-100 text-red-800'
347
- "
348
- >
349
- {{
350
- getPageBuilderConfig.userSettings.notifications
351
- ? 'Enabled'
352
- : 'Disabled'
353
- }}
354
- </span>
355
- </div>
356
- </td>
357
- </tr>
358
- </tbody>
359
- </table>
360
- </div>
361
- </div>
362
- </div>
363
- <!-- User Settings Table - end -->
364
-
365
- <!-- Page Builder Logo Table - start -->
366
- <div
367
- class="pbx-mt-8"
368
- v-if="
369
- getPageBuilderConfig &&
370
- getPageBuilderConfig.pageBuilderLogo &&
371
- !isEmptyObject(getPageBuilderConfig.pageBuilderLogo)
372
- "
373
- >
374
- <h4 class="pbx-myQuaternaryHeader pbx-text-sm pbx-mb-2">Logo Configuration</h4>
375
- <div
376
- class="pbx-overflow-hidden pbx-shadow pbx-ring-1 pbx-ring-black pbx-ring-opacity-5 md:pbx-rounded-lg"
377
- >
378
- <div class="pbx-overflow-x-auto">
379
- <table class="pbx-min-w-full">
380
- <thead class="pbx-bg-gray-50">
381
- <tr>
382
- <th
383
- scope="col"
384
- class="pbx-px-6 pbx-py-3 pbx-text-left pbx-text-xs pbx-font-medium pbx-text-gray-500 pbx-uppercase pbx-tracking-wider"
385
- >
386
- Property
387
- </th>
388
- <th
389
- scope="col"
390
- class="pbx-px-6 pbx-py-3 pbx-text-left pbx-text-xs pbx-font-medium pbx-text-gray-500 pbx-uppercase pbx-tracking-wider"
391
- >
392
- Value
393
- </th>
394
- </tr>
395
- </thead>
396
- <tbody class="pbx-bg-white pbx-divide-y pbx-divide-gray-200">
397
- <tr>
398
- <td
399
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-font-medium pbx-text-gray-900"
400
- >
401
- <div class="pbx-min-w-[30rem] pbx-w-max">Logo</div>
402
- </td>
403
- <td
404
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-text-gray-500"
405
- >
406
- <div class="pbx-min-w-[30rem] pbx-w-max">
407
- <div class="pbx-flex pbx-items-center pbx-space-x-3">
408
- <img
409
- class="pbx-h-4"
410
- :src="getPageBuilderConfig.pageBuilderLogo.src"
411
- alt="Logo"
412
- />
413
- </div>
414
- </div>
415
- </td>
416
- </tr>
417
- <tr>
418
- <td
419
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-font-medium pbx-text-gray-900"
420
- >
421
- <div class="pbx-min-w-[30rem] pbx-w-max">Logo URL</div>
422
- </td>
423
- <td
424
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-text-gray-500"
425
- >
426
- <div class="pbx-min-w-[30rem] pbx-w-max">
427
- <div class="pbx-flex pbx-items-center pbx-space-x-3">
428
- <div class="pbx-pr-6">
429
- <div class="pbx-flex pbx-items-center pbx-space-x-3">
430
- <span class="pbx-whitespace-nowrap">{{
431
- getPageBuilderConfig.pageBuilderLogo.src
432
- }}</span>
433
- </div>
434
- </div>
435
- </div>
436
- </div>
437
- </td>
438
- </tr>
439
- </tbody>
440
- </table>
441
- </div>
442
- </div>
443
- </div>
444
- <!-- Page Builder Logo Table - end -->
445
-
446
- <!-- Form Type Table - start -->
447
- <div
448
- class="pbx-mt-8"
449
- v-if="
450
- getPageBuilderConfig?.updateOrCreate &&
451
- !isEmptyObject(getPageBuilderConfig.updateOrCreate)
452
- "
453
- >
454
- <h4 class="pbx-myQuaternaryHeader pbx-text-sm pbx-mb-2">Form Type</h4>
455
- <div
456
- class="pbx-overflow-hidden pbx-shadow pbx-ring-1 pbx-ring-black pbx-ring-opacity-5 md:pbx-rounded-lg"
457
- >
458
- <div class="pbx-overflow-x-auto">
459
- <table class="pbx-w-max">
460
- <thead class="pbx-bg-gray-50">
461
- <tr>
462
- <th
463
- scope="col"
464
- class="pbx-px-6 pbx-py-3 pbx-text-left pbx-text-xs pbx-font-medium pbx-text-gray-500 pbx-uppercase pbx-tracking-wider"
465
- >
466
- Mode
467
- </th>
468
- <th
469
- scope="col"
470
- class="pbx-px-6 pbx-py-3 pbx-text-left pbx-text-xs pbx-font-medium pbx-text-gray-500 pbx-uppercase pbx-tracking-wider"
471
- >
472
- Description
473
- </th>
474
- </tr>
475
- </thead>
476
- <tbody class="pbx-bg-white pbx-divide-y pbx-divide-gray-200">
477
- <tr>
478
- <td
479
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-font-medium pbx-text-gray-900"
480
- >
481
- <div class="pbx-min-w-[30rem] pbx-w-max">Form Type</div>
482
- </td>
483
- <td
484
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-text-gray-500"
485
- >
486
- <div class="pbx-min-w-[30rem] pbx-w-max">
487
- <span
488
- class="pbx-inline-flex pbx-items-center pbx-px-2.5 pbx-py-0.5 pbx-rounded-full pbx-text-xs pbx-font-medium"
489
- :class="
490
- getPageBuilderConfig.updateOrCreate === 'create'
491
- ? 'bg-green-100 text-green-800'
492
- : 'bg-blue-100 text-blue-800'
493
- "
494
- >
495
- <span
496
- v-if="
497
- getPageBuilderConfig &&
498
- getPageBuilderConfig.updateOrCreate.formType === 'create'
499
- "
500
- >
501
- {{ getPageBuilderConfig.updateOrCreate.formType }}
502
- </span>
503
- <span
504
- v-if="
505
- getPageBuilderConfig &&
506
- getPageBuilderConfig.updateOrCreate.formType === 'update'
507
- "
508
- >
509
- {{ getPageBuilderConfig.updateOrCreate.formType }}
510
- </span>
511
- </span>
512
- </div>
513
- </td>
514
- </tr>
515
- <tr
516
- v-if="
517
- getPageBuilderConfig.updateOrCreate.formName &&
518
- getPageBuilderConfig.updateOrCreate.formName.length > 0
519
- "
520
- >
521
- <td
522
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-font-medium pbx-text-gray-900"
523
- >
524
- <div class="pbx-min-w-[30rem] pbx-w-max">Form Name</div>
525
- </td>
526
- <td
527
- class="pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-text-gray-500"
528
- >
529
- <div class="pbx-min-w-[30rem] pbx-w-max">
530
- <span
531
- class="pbx-inline-flex pbx-items-center pbx-px-2.5 pbx-py-0.5 pbx-rounded-full pbx-text-xs pbx-font-medium"
532
- >
533
- {{ getPageBuilderConfig.updateOrCreate.formName }}
534
- </span>
535
- </div>
536
- </td>
537
- </tr>
538
- </tbody>
539
- </table>
540
- </div>
541
- </div>
542
- </div>
543
- <!-- Form Type Table - end -->
544
- </div>
545
- </div>
546
- </div>
547
- <!-- Advanced Settings - end -->
548
-
549
- <!-- Congig - start -->
550
- <div
551
- class="pbx-mt-4 pbx-mb-4 pbx-py-8 pbx-px-2 pbx-border pbx-border-solid pbx-border-gray-600 pbx-rounded-xl"
552
- >
553
- <div class="pbx-flex pbx-items-left pbx-flex-col pbx-gap-1">
554
- <h3 class="pbx-myQuaternaryHeader">Complete Configuration Overview</h3>
555
- <p class="pbx-myPrimaryParagraph pbx-text-xs">
556
- Complete configuration object currently used by the Page Builder. Includes user
557
- information, branding settings, and other context-specific data needed for rendering and
558
- managing the builder environment.
559
- </p>
560
- </div>
561
-
562
- <div
563
- class="pbx-mt-4 pbx-whitespace-pre-wrap pbx-text-white pbx-overflow-hidden pbx-bg-gray-900"
564
- >
565
- <div class="pbx-flex bg-gray-800/40 pbx-ring-1 ring-white/5">
566
- <div
567
- class="pbx-mb-px pbx-flex pbx-text-xs pbx-font-medium pbx-text-myPrimaryMediumGrayColor"
568
- >
569
- <div class="pbx-px-4 pbx-py-4 pbx-text-white">Configuration</div>
570
- </div>
571
- </div>
572
- <div class="pbx-px-4 pbx-pb-8 pbx-pt-4 pbx-text-white pbx-text-xs pbx-break-all">
573
- <p class="pbx-myPrimaryParagraph pbx-text-xs pbx-text-white">
574
- config: {{ JSON.stringify(getPageBuilderConfig, null, 4) }}
575
- </p>
576
- </div>
577
- </div>
578
- </div>
579
- <!-- Config - end -->
580
- </div>
581
- </template>