@myissue/vue-website-page-builder 3.3.34 → 3.3.36
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.
- package/dist/vue-website-page-builder.js +21 -21
- package/dist/vue-website-page-builder.umd.cjs +5 -5
- package/package.json +1 -1
- package/src/Components/Modals/BuilderComponents.vue +1 -1
- package/src/Components/Modals/DynamicModalBuilder.vue +1 -1
- package/src/Components/Modals/ModalBuilder.vue +1 -1
- package/src/Components/PageBuilder/DefaultComponents/DefaultBuilderComponents.vue +1 -1
- package/src/Components/PageBuilder/EditorMenu/Editables/ClassEditor.vue +1 -1
- package/src/Components/PageBuilder/EditorMenu/Editables/ElementEditor.vue +1 -1
- package/src/Components/PageBuilder/EditorMenu/Editables/LinkEditor.vue +1 -1
- package/src/Components/PageBuilder/EditorMenu/EditorAccordion.vue +1 -1
- package/src/Components/PageBuilder/Settings/AdvancedPageBuilderSettings.vue +8 -6
- package/src/Components/PageBuilder/Settings/PageBuilderSettings.vue +3 -3
- package/src/Components/TipTap/TipTapInput.vue +3 -3
- package/src/DemoComponents/DemoUnsplash.vue +4 -4
- package/src/PageBuilder/PageBuilder.vue +4 -4
package/package.json
CHANGED
|
@@ -50,7 +50,7 @@ const firstButtonBuilder = function () {
|
|
|
50
50
|
</div>
|
|
51
51
|
</div>
|
|
52
52
|
<div
|
|
53
|
-
class="pbx-py-4 pbx-flex sm:pbx-justify-end pbx-justify-center pbx-border-t pbx-border-gray-200 pbx-mt-4"
|
|
53
|
+
class="pbx-py-4 pbx-flex sm:pbx-justify-end pbx-justify-center pbx-border-t-solid pbx-border-gray-200 pbx-mt-4"
|
|
54
54
|
>
|
|
55
55
|
<div class="sm:pbx-w-3/6 pbx-w-full pbx-px-2 pbx-my-2 pbx-flex pbx-gap-2 pbx-justify-end">
|
|
56
56
|
<button
|
|
@@ -104,7 +104,7 @@ const thirdButtonBuilder = function () {
|
|
|
104
104
|
</div>
|
|
105
105
|
|
|
106
106
|
<div
|
|
107
|
-
class="pbx-border-t pbx-border-gray-200 pbx-mt-4 pbx-flex pbx-items-center pbx-justify-end"
|
|
107
|
+
class="pbx-border-t-solid pbx-border-gray-200 pbx-mt-4 pbx-flex pbx-items-center pbx-justify-end"
|
|
108
108
|
>
|
|
109
109
|
<div
|
|
110
110
|
v-if="simpleModal !== true && !isLoading"
|
|
@@ -80,7 +80,7 @@ const maxWidthClass = computed(() => {
|
|
|
80
80
|
]"
|
|
81
81
|
>
|
|
82
82
|
<div
|
|
83
|
-
class="pbx-h-16 pbx-px-4 pbx-border-b pbx-border-gray-200 pbx-mb-2 pbx-flex pbx-items-center pbx-justify-between"
|
|
83
|
+
class="pbx-h-16 pbx-px-4 pbx-border-b-solid pbx-border-gray-200 pbx-mb-2 pbx-flex pbx-items-center pbx-justify-between"
|
|
84
84
|
:class="[
|
|
85
85
|
type === 'success' ? 'pbx-bg-white' : '',
|
|
86
86
|
type === 'warning' ? 'pbx-bg-white' : '',
|
|
@@ -78,7 +78,7 @@ const getSvgPreview = (title: string) => {
|
|
|
78
78
|
@click="handleDropComponent(convertToComponentObject(comp))"
|
|
79
79
|
>
|
|
80
80
|
<div
|
|
81
|
-
class="pbx-overflow-hidden pbx-whitespace-pre-line pbx-flex-1 pbx-h-auto pbx-border-b
|
|
81
|
+
class="pbx-overflow-hidden pbx-whitespace-pre-line pbx-flex-1 pbx-h-auto pbx-border-b-solid pbx-border-gray-200 lg:pbx-py-10 pbx-py-8 pbx-px-2"
|
|
82
82
|
>
|
|
83
83
|
<!-- Use SVG preview instead of external images -->
|
|
84
84
|
<div
|
|
@@ -70,7 +70,7 @@ const handleAddClasses = async function () {
|
|
|
70
70
|
class="pbx-myPrimaryInput pbx-border-none pbx-rounded-r-none pbx-ml-0 pbx-w-full"
|
|
71
71
|
/>
|
|
72
72
|
<div
|
|
73
|
-
class="pbx-border
|
|
73
|
+
class="pbx-border-none pbx-rounded pbx-flex pbx-items-center pbx-justify-center pbx-h-full pbx-w-8"
|
|
74
74
|
>
|
|
75
75
|
<kbd class="pbx-myPrimaryParagraph pbx-text-gray-400 pbx-border-none"> ⏎ </kbd>
|
|
76
76
|
</div>
|
|
@@ -24,7 +24,7 @@ const getRestoredElement = computed(() => {
|
|
|
24
24
|
<div class="pbx-flex pbx-flex-row pbx-flex-wrap pbx-gap-2 pbx-mt-2"></div>
|
|
25
25
|
<!-- delete & restore element # start -->
|
|
26
26
|
<template v-if="getRestoredElement">
|
|
27
|
-
<div class="
|
|
27
|
+
<div class="-border-b-solid pbx-border-gray-200 pbx-mb-4 pbx-pb-8 pbx-pt-4">
|
|
28
28
|
<p class="pbx-myPrimaryParagraph pbx-font-medium pbx-py-0">Restore</p>
|
|
29
29
|
<label class="pbx-myPrimaryInputLabel"> Restore the last deleted HTML element.</label>
|
|
30
30
|
<div class="pbx-px-2 pbx-flex pbx-items-center pbx-justify-start pbx-gap-2 pbx-w-max">
|
|
@@ -230,7 +230,7 @@ const handleToggleOpenHyperlinkInNewTab = async function () {
|
|
|
230
230
|
@keydown.enter.tab.prevent="handleHyperlink()"
|
|
231
231
|
/>
|
|
232
232
|
<div
|
|
233
|
-
class="pbx-border
|
|
233
|
+
class="pbx-border-none pbx-rounded pbx-flex pbx-items-center pbx-justify-center pbx-h-full pbx-w-8"
|
|
234
234
|
>
|
|
235
235
|
<kbd class="pbx-myPrimaryParagraph pbx-text-gray-400 pbx-border-none"> ⏎ </kbd>
|
|
236
236
|
</div>
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
:class="{ '': expanded }"
|
|
5
5
|
>
|
|
6
6
|
<div
|
|
7
|
-
class="pbx-flex pbx-flex-row pbx-justify-between pbx-items-center pbx-pl-3 pbx-pr-3 pbx-py-5 pbx-cursor-pointer pbx-duration-200 hover:pbx-bg-myPrimaryLightGrayColor pbx-border-b pbx-border-gray-200"
|
|
7
|
+
class="pbx-flex pbx-flex-row pbx-justify-between pbx-items-center pbx-pl-3 pbx-pr-3 pbx-py-5 pbx-cursor-pointer pbx-duration-200 hover:pbx-bg-myPrimaryLightGrayColor pbx-border-b-solid pbx-border-gray-200"
|
|
8
8
|
@click="expanded = !expanded"
|
|
9
9
|
>
|
|
10
10
|
<p class="pbx-myPrimaryParagraph pbx-font-medium pbx-my-0 pbx-py-0">
|
|
@@ -119,7 +119,7 @@ function prettifyHtml(html) {
|
|
|
119
119
|
v-if="getElement"
|
|
120
120
|
class="pbx-overflow-hidden pbx-border pbx-border-gray-100 pbx-mb-6"
|
|
121
121
|
>
|
|
122
|
-
<div class="pbx-bg-stone-800 pbx-pt-4 pbx-1 pbx-border-b pbx-border-gray-200">
|
|
122
|
+
<div class="pbx-bg-stone-800 pbx-pt-4 pbx-1 pbx-border-b-solid pbx-border-gray-200">
|
|
123
123
|
<div class="pbx-overflow-x-auto">
|
|
124
124
|
<table class="pbx-min-w-full">
|
|
125
125
|
<thead class="pbx-bg-stone-800">
|
|
@@ -134,7 +134,7 @@ function prettifyHtml(html) {
|
|
|
134
134
|
<tbody class="pbx-bg-stone-800 pbx-divide-y pbx-divide-gray-200">
|
|
135
135
|
<tr>
|
|
136
136
|
<td
|
|
137
|
-
class="pbx-px-6 pbx-py-3 pbx-text-left pbx-text-xs pbx-text-gray-100 pbx-font-normal pbx-border-b"
|
|
137
|
+
class="pbx-px-6 pbx-py-3 pbx-text-left pbx-text-xs pbx-text-gray-100 pbx-font-normal pbx-border-b-solid"
|
|
138
138
|
>
|
|
139
139
|
{{ getElement?.outerHTML }}
|
|
140
140
|
</td>
|
|
@@ -204,7 +204,7 @@ function prettifyHtml(html) {
|
|
|
204
204
|
v-if="getComponent"
|
|
205
205
|
class="pbx-overflow-hidden pbx-border pbx-border-gray-100 pbx-mb-6"
|
|
206
206
|
>
|
|
207
|
-
<div class="pbx-bg-stone-800 pbx-pt-4 pbx-1 pbx-border-b pbx-border-gray-200">
|
|
207
|
+
<div class="pbx-bg-stone-800 pbx-pt-4 pbx-1 pbx-border-b-solid pbx-border-gray-200">
|
|
208
208
|
<div class="pbx-overflow-x-auto">
|
|
209
209
|
<table class="pbx-min-w-full">
|
|
210
210
|
<thead class="pbx-bg-stone-800">
|
|
@@ -232,7 +232,7 @@ function prettifyHtml(html) {
|
|
|
232
232
|
<thead class="pbx-bg-stone-800">
|
|
233
233
|
<tr>
|
|
234
234
|
<th
|
|
235
|
-
class="pbx-px-6 pbx-py-3 pbx-text-left pbx-text-xs pbx-text-gray-100 pbx-font-normal pbx-border-t"
|
|
235
|
+
class="pbx-px-6 pbx-py-3 pbx-text-left pbx-text-xs pbx-text-gray-100 pbx-font-normal pbx-border-t-solid pbx-border-gray-200"
|
|
236
236
|
>
|
|
237
237
|
Title:
|
|
238
238
|
</th>
|
|
@@ -290,7 +290,9 @@ function prettifyHtml(html) {
|
|
|
290
290
|
class="pbx-overflow-hidden pbx-border pbx-border-gray-100 pbx-mb-6"
|
|
291
291
|
>
|
|
292
292
|
<!-- Id and Title above the table, styled to look connected -->
|
|
293
|
-
<div
|
|
293
|
+
<div
|
|
294
|
+
class="pbx-bg-stone-800 pbx-pt-4 pbx-1 pbx-border-b-solid pbx-border-gray-200"
|
|
295
|
+
>
|
|
294
296
|
<div class="pbx-overflow-x-auto">
|
|
295
297
|
<table class="pbx-min-w-full">
|
|
296
298
|
<thead class="pbx-bg-stone-800">
|
|
@@ -318,7 +320,7 @@ function prettifyHtml(html) {
|
|
|
318
320
|
<thead class="pbx-bg-stone-800">
|
|
319
321
|
<tr>
|
|
320
322
|
<th
|
|
321
|
-
class="pbx-px-6 pbx-py-3 pbx-text-left pbx-text-xs pbx-text-gray-100 pbx-font-normal pbx-border-t"
|
|
323
|
+
class="pbx-px-6 pbx-py-3 pbx-text-left pbx-text-xs pbx-text-gray-100 pbx-font-normal pbx-border-t-solid pbx-border-gray-200"
|
|
322
324
|
>
|
|
323
325
|
Title:
|
|
324
326
|
</th>
|
|
@@ -52,7 +52,7 @@ const handleDownloadHTML = function () {
|
|
|
52
52
|
<!-- Advanced Settings - start -->
|
|
53
53
|
<div class="pbx-flex pbx-gap-4 pbx-flex-col pbx-divide-y pbx-divide-gray-300">
|
|
54
54
|
<!-- Advanced Settings - start -->
|
|
55
|
-
<div class="pbx-mb-4 pbx-pb-8 pbx-border-b pbx-border-myPrimbryLightGrayColor">
|
|
55
|
+
<div class="pbx-mb-4 pbx-pb-8 pbx-border-b-solid pbx-border-myPrimbryLightGrayColor">
|
|
56
56
|
<div class="pbx-flex pbx-items-left pbx-flex-col pbx-gap-1">
|
|
57
57
|
<h3 class="pbx-myQuaternaryHeader">Configuration Overview</h3>
|
|
58
58
|
<p class="pbx-myPrimaryParagraph pbx-text-xs">
|
|
@@ -576,7 +576,7 @@ const handleDownloadHTML = function () {
|
|
|
576
576
|
</div>
|
|
577
577
|
<!-- Advanced Settings - end -->
|
|
578
578
|
<!-- Download Layout HTML - start -->
|
|
579
|
-
<div class="pbx-mt-4 pbx-mb-4 pbx-py-8 pbx-border-b pbx-border-myPrimbryLightGrayColor">
|
|
579
|
+
<div class="pbx-mt-4 pbx-mb-4 pbx-py-8 pbx-border-b-solid pbx-border-myPrimbryLightGrayColor">
|
|
580
580
|
<div class="pbx-flex pbx-items-left pbx-flex-col pbx-gap-1">
|
|
581
581
|
<h3 class="pbx-myQuaternaryHeader">Download Page as HTML</h3>
|
|
582
582
|
<p class="pbx-myPrimaryParagraph pbx-text-xs">Download current page layout.</p>
|
|
@@ -590,7 +590,7 @@ const handleDownloadHTML = function () {
|
|
|
590
590
|
<!-- Download Layout HTML - end -->
|
|
591
591
|
|
|
592
592
|
<!-- Congig - start -->
|
|
593
|
-
<div class="pbx-mt-4 pbx-mb-4 pbx-py-8 pbx-border-b pbx-border-myPrimbryLightGrayColor">
|
|
593
|
+
<div class="pbx-mt-4 pbx-mb-4 pbx-py-8 pbx-border-b-solid pbx-border-myPrimbryLightGrayColor">
|
|
594
594
|
<div class="pbx-flex pbx-items-left pbx-flex-col pbx-gap-1">
|
|
595
595
|
<h3 class="pbx-myQuaternaryHeader">Complete Configuration Overview</h3>
|
|
596
596
|
<p class="pbx-myPrimaryParagraph pbx-text-xs">
|
|
@@ -219,12 +219,12 @@ onMounted(() => {
|
|
|
219
219
|
<div v-if="pageBuilderService.isSelectedElementValidText() && editor">
|
|
220
220
|
<div class="pbx-relative pbx-rounded-lg">
|
|
221
221
|
<div
|
|
222
|
-
class="pbx-flex pbx-justify-between pbx-myPrimaryGap pbx-items-center pbx-py-4 pbx-px-4 pbx-overflow-x-auto pbx-border-b pbx-border-gray-200"
|
|
222
|
+
class="pbx-flex pbx-justify-between pbx-myPrimaryGap pbx-items-center pbx-py-4 pbx-px-4 pbx-overflow-x-auto pbx-border-b-solid pbx-border-gray-200"
|
|
223
223
|
>
|
|
224
224
|
<div>
|
|
225
225
|
<div>
|
|
226
226
|
<div
|
|
227
|
-
class="pbx-px-2 pbx-flex pbx-items-center pbx-justify-start pbx-gap-2 pbx-w-max pbx-p-1 pbx-rounded-full pbx-border pbx-border-gray-200 pbx-shadow-sm"
|
|
227
|
+
class="pbx-px-2 pbx-flex pbx-items-center pbx-justify-start pbx-gap-2 pbx-w-max pbx-p-1 pbx-rounded-full pbx-border pbx-border-solid pbx-border-gray-200 pbx-shadow-sm"
|
|
228
228
|
>
|
|
229
229
|
<button
|
|
230
230
|
@click="pageBuilderService.toggleTipTapModal(false)"
|
|
@@ -238,7 +238,7 @@ onMounted(() => {
|
|
|
238
238
|
</div>
|
|
239
239
|
</div>
|
|
240
240
|
<div
|
|
241
|
-
class="pbx-flex pbx-items-center pbx-p-1 pbx-rounded-full pbx-border pbx-border-gray-200 pbx-shadow-sm"
|
|
241
|
+
class="pbx-flex pbx-items-center pbx-p-1 pbx-rounded-full pbx-border pbx-border-solid pbx-border-gray-200 pbx-shadow-sm"
|
|
242
242
|
>
|
|
243
243
|
<div class="pbx-px-2 pbx-flex pbx-items-center pbx-justify-start pbx-gap-2 pbx-w-max">
|
|
244
244
|
<button
|
|
@@ -169,7 +169,7 @@ onMounted(async () => {
|
|
|
169
169
|
<div class="pbx-mt-2">
|
|
170
170
|
<div
|
|
171
171
|
v-if="getUnsplashImages && getUnsplashImages.results"
|
|
172
|
-
class="pbx-flex lg:pbx-justify-between pbx-justify-end pbx-items-center pbx-gap-2 pbx-py-2 pbx-px-2 pbx-mb-1 pbx-rounded-full pbx-border pbx-border-gray-200 pbx-shadow-sm"
|
|
172
|
+
class="pbx-flex lg:pbx-justify-between pbx-justify-end pbx-items-center pbx-gap-2 pbx-py-2 pbx-px-2 pbx-mb-1 pbx-rounded-full pbx-border pbx-border-solid pbx-border-gray-200 pbx-shadow-sm"
|
|
173
173
|
>
|
|
174
174
|
<div class="lg:pbx-flex pbx-hidden pbx-justify-left pbx-items-center pbx-gap-2">
|
|
175
175
|
<button
|
|
@@ -292,7 +292,7 @@ onMounted(async () => {
|
|
|
292
292
|
v-for="image in getUnsplashImages.results"
|
|
293
293
|
:key="image.id"
|
|
294
294
|
@click="handleImageClick({ url: image.urls.regular, user: image.user.name })"
|
|
295
|
-
class="pbx-border pbx-border-gray-200 pbx-my-2 pbx-px-2 pbx-p-2 pbx-cursor-pointer"
|
|
295
|
+
class="pbx-border pbx-border-solid pbx-border-gray-200 pbx-my-2 pbx-px-2 pbx-p-2 pbx-cursor-pointer"
|
|
296
296
|
>
|
|
297
297
|
<img
|
|
298
298
|
:alt="image.user.name"
|
|
@@ -353,7 +353,7 @@ onMounted(async () => {
|
|
|
353
353
|
Information
|
|
354
354
|
</p>
|
|
355
355
|
<dl
|
|
356
|
-
class="pbx-mt-2 pbx-border-t pbx-border-b pbx-border-gray-200 pbx-divide-y pbx-divide-gray-200"
|
|
356
|
+
class="pbx-mt-2 pbx-border-t-solid pbx-border-b-solid pbx-border-gray-200 pbx-divide-y pbx-divide-gray-200"
|
|
357
357
|
>
|
|
358
358
|
<div
|
|
359
359
|
class="pbx-py-3 pbx-flex pbx-justify-between pbx-text-sm pbx-font-normal pbx-items-center"
|
|
@@ -377,7 +377,7 @@ onMounted(async () => {
|
|
|
377
377
|
|
|
378
378
|
<!-- Actions footer # start -->
|
|
379
379
|
<div
|
|
380
|
-
class="pbx-px-4 pbx-py-3 pbx-flex pbx-gap-2 pbx-border-t pbx-border-gray-200 pbx-mt-4 pbx-justify-end"
|
|
380
|
+
class="pbx-px-4 pbx-py-3 pbx-flex pbx-gap-2 pbx-border-t-solid pbx-border-gray-200 pbx-mt-4 pbx-justify-end"
|
|
381
381
|
>
|
|
382
382
|
<button
|
|
383
383
|
@click="
|
|
@@ -436,7 +436,7 @@ onMounted(async () => {
|
|
|
436
436
|
<!-- Top Layout Save And Reset Area - Start -->
|
|
437
437
|
<div
|
|
438
438
|
id="pagebuilder-toolbar-area"
|
|
439
|
-
class="pbx-flex pbx-items-center pbx-justify-between pbx-bg-myPrimaryLightGrayColor pbx-border-b pbx-border-gray-200 pbx-mb-2 lg:pbx-px-6 pbx-px-4 pbx-font-sans"
|
|
439
|
+
class="pbx-flex pbx-items-center pbx-justify-between pbx-bg-myPrimaryLightGrayColor pbx-border-b pbx-border-solid pbx-border-gray-200 pbx-mb-2 lg:pbx-px-6 pbx-px-4 pbx-font-sans"
|
|
440
440
|
>
|
|
441
441
|
<template
|
|
442
442
|
v-if="
|
|
@@ -691,7 +691,7 @@ onMounted(async () => {
|
|
|
691
691
|
|
|
692
692
|
<main
|
|
693
693
|
ref="pbxToolBar"
|
|
694
|
-
class="pbx-flex pbx-flex-col pbx-grow pbx-rounded-tr-2xl pbx-rounded-tl-2xl pbx-border pbx-border-gray-200 pbx-items-stretch pbx-h-[90vh]"
|
|
694
|
+
class="pbx-flex pbx-flex-col pbx-grow pbx-rounded-tr-2xl pbx-rounded-tl-2xl pbx-border pbx-border-solid pbx-border-gray-200 pbx-items-stretch pbx-h-[90vh]"
|
|
695
695
|
:class="{ 'pbx-mr-2': !getMenuRight, '': getMenuRight }"
|
|
696
696
|
>
|
|
697
697
|
<div
|
|
@@ -748,7 +748,7 @@ onMounted(async () => {
|
|
|
748
748
|
await pageBuilderService.clearHtmlSelection()
|
|
749
749
|
}
|
|
750
750
|
"
|
|
751
|
-
class="pbx-min-w-[3.5rem] pbx-pt-7 pbx-pb-2 pbx-ml-2 pbx-border-l pbx-border-gray-200"
|
|
751
|
+
class="pbx-min-w-[3.5rem] pbx-pt-7 pbx-pb-2 pbx-ml-2 pbx-border-l-solid pbx-border-gray-200"
|
|
752
752
|
>
|
|
753
753
|
<div
|
|
754
754
|
@click.self="
|
|
@@ -783,7 +783,7 @@ onMounted(async () => {
|
|
|
783
783
|
</aside>
|
|
784
784
|
</div>
|
|
785
785
|
<div
|
|
786
|
-
class="pbx-flex pbx-items-center pbx-justify-center pbx-border-t pbx-border-gray-200 pbx-py-4"
|
|
786
|
+
class="pbx-flex pbx-items-center pbx-justify-center pbx-border-t-solid pbx-border-gray-200 pbx-py-4"
|
|
787
787
|
>
|
|
788
788
|
<div
|
|
789
789
|
@click="
|