@dcodegroup-au/page-builder 0.1.4 → 0.1.6

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dcodegroup-au/page-builder",
3
- "version": "0.1.4",
3
+ "version": "0.1.6",
4
4
  "exports": {
5
5
  ".": {
6
6
  "import": "./dist/page-builder.es.js"
@@ -10,7 +10,7 @@
10
10
  </div>
11
11
  </template>
12
12
  <script setup>
13
- import { defaultProps } from "@/js/vue/components/admin/pages/common/defaultProps.js";
13
+ import { defaultProps } from "@/js/vue/components/admin/pages/common/defaultProps";
14
14
 
15
15
  const props = defineProps({
16
16
  ...defaultProps,
@@ -10,7 +10,7 @@
10
10
  </div>
11
11
  </template>
12
12
  <script setup>
13
- import { defaultProps } from "@/js/vue/components/admin/pages/common/defaultProps.js";
13
+ import { defaultProps } from "@/js/vue/components/admin/pages/common/defaultProps";
14
14
 
15
15
  const props = defineProps({
16
16
  ...defaultProps,
@@ -16,7 +16,7 @@
16
16
  </div>
17
17
  </template>
18
18
  <script setup>
19
- import { defaultProps } from "@/js/vue/components/admin/pages/common/defaultProps.js";
19
+ import { defaultProps } from "@/js/vue/components/admin/pages/common/defaultProps";
20
20
 
21
21
  const emit = defineEmits(["update"]);
22
22
  const route = inject("route");
@@ -17,7 +17,7 @@
17
17
  </div>
18
18
  </template>
19
19
  <script setup>
20
- import { defaultProps } from "@/js/vue/components/admin/pages/common/defaultProps.js";
20
+ import { defaultProps } from "@/js/vue/components/admin/pages/common/defaultProps";
21
21
 
22
22
  const emit = defineEmits(["update"]);
23
23
  const route = inject("route");
@@ -41,7 +41,7 @@
41
41
  </template>
42
42
  <script setup>
43
43
  import { ref } from "vue";
44
- import { defaultProps } from "@/components/helpers/defaultProps.js";
44
+ import { defaultProps } from "@/components/helpers/defaultProps";
45
45
  import InputWrapper from "@/components/common/InputWrapper.vue";
46
46
 
47
47
  const emit = defineEmits(["update"]);
@@ -30,7 +30,7 @@
30
30
  <div class="flex flex-col gap-3">
31
31
  <div v-for="(item, index) in dataRef.data"
32
32
  class="flex items-center gap-4 px-2 py-1 hover:bg-gray-100 rounded-lg"
33
- :class="{'bg-gray-200 hover:bg-gray-200': openSlideStates[index]}">
33
+ :class="{'bg-gray-200 hover:bg-gray-200': openItemStates[index]}">
34
34
  <div class="flex flex-1 items-center justify-between relative" @click="toggleSlide(index);">
35
35
  <div class="flex flex-1 flex-col cursor-pointer" @click="edit(item, index)">
36
36
  <div class="text-xs text-gray-600">
@@ -53,7 +53,7 @@ import {ref} from "vue";
53
53
  import PlusIcon from "@/assets/img/icons/plus.svg";
54
54
  import { defaultProps } from "@/components/helpers/defaultProps";
55
55
  import { singularize, parseName } from "@/components/helpers/common";
56
- import { createSlide } from "@/components/helpers/pageBuilderFactory";
56
+ import { createItem } from "@/components/helpers/pageBuilderFactory";
57
57
  import ActionMenu from "@/components/common/ActionMenu.vue";
58
58
  import VModal from "@/components/common/VModal.vue";
59
59
 
@@ -66,27 +66,28 @@ const dataRef = ref(props.data.component);
66
66
  const type = dataRef.value.type;
67
67
  const modalRef = ref(null);
68
68
 
69
- const openSlideStates = ref(JSON.parse(window.localStorage.getItem("openSlideStates")));
70
- if (!openSlideStates.value) {
71
- openSlideStates.value = {};
69
+ const key = `${type.value}-openItemStates`;
70
+ const openItemStates = ref(JSON.parse(window.localStorage.getItem(key)));
71
+ if (!openItemStates.value) {
72
+ openItemStates.value = {};
72
73
 
73
74
  dataRef.value.data.forEach((item, index) => {
74
- openSlideStates.value[index] = false;
75
+ openItemStates.value[index] = false;
75
76
  });
76
77
 
77
- window.localStorage.setItem("openSlideStates", JSON.stringify(openSlideStates.value));
78
+ window.localStorage.setItem(key, JSON.stringify(openItemStates.value));
78
79
  }
79
80
 
80
81
  const toggleSlide = (index) => {
81
- Object.keys(openSlideStates.value).forEach((key) => {
82
- openSlideStates.value[key] = false;
82
+ Object.keys(openItemStates.value).forEach((key) => {
83
+ openItemStates.value[key] = false;
83
84
  });
84
- openSlideStates.value[index] = !openSlideStates.value[index];
85
- window.localStorage.setItem("openSlideStates", JSON.stringify(openSlideStates.value));
85
+ openItemStates.value[index] = !openItemStates.value[index];
86
+ window.localStorage.setItem(key, JSON.stringify(openItemStates.value));
86
87
  };
87
88
 
88
89
  const addItem = () => {
89
- dataRef.value.data.push(createSlide());
90
+ dataRef.value.data.push(createItem({}, type.value === 'sliders'));
90
91
  emit("update", false);
91
92
  };
92
93
 
@@ -104,6 +105,6 @@ const edit = (item, index) => {
104
105
  window.location.href = item.edit_url;
105
106
  }
106
107
 
107
- window.location.href = `/admin/pages/${props?.data?.page?.id}/sections/${props?.data?.sectionIndex}/components/${props?.data?.componentIndex}/slides/${index}`;
108
+ window.location.href = `/admin/pages/${props?.data?.page?.id}/sections/${props?.data?.sectionIndex}/components/${props?.data?.componentIndex}/items/${index}`;
108
109
  };
109
110
  </script>
@@ -1,25 +1,36 @@
1
- export function createSlide(overrides = {}) {
2
- return {
1
+ export function createItem(overrides = {}, withSecondary = true) {
2
+ let data = {
3
3
  title: "New slide",
4
- description: "New description",
5
- public: false,
6
- featured_image: "",
7
- primary_button: {
4
+ description: "New description",
5
+ public: false,
6
+ featured_image: "",
7
+ primary_button: {
8
8
  show: false,
9
- label: "",
10
- type: "site-content",
11
- url: '',
12
- is_new_tab: false,
13
- ...(overrides.primary_button || {}),
9
+ label: "",
10
+ type: "site-content",
11
+ url: '',
12
+ is_new_tab: false,
13
+ ...(overrides.primary_button || {}),
14
14
  },
15
- secondary_button: {
15
+ }
16
+
17
+ if (!withSecondary) {
18
+ data.primary_button.name = 'Linked to';
19
+ }
20
+
21
+ if (withSecondary) {
22
+ data.secondary_button = {
16
23
  show: false,
17
24
  label: "",
18
25
  type: "site-content",
19
26
  url: '',
20
27
  is_new_tab: false,
21
28
  ...(overrides.secondary_button || {}),
22
- },
29
+ };
30
+ }
31
+
32
+ return {
33
+ data,
23
34
  ...overrides,
24
35
  };
25
36
  }
@@ -83,4 +83,12 @@ onMounted(() => {
83
83
  selectItem(publicTabs.value[0]);
84
84
  }
85
85
  });
86
- </script>
86
+ </script>
87
+ <style scoped>
88
+ .fade-enter-active, .fade-leave-active {
89
+ @apply transition-opacity duration-300;
90
+ }
91
+ .fade-enter-from, .fade-leave-to {
92
+ @apply opacity-0;
93
+ }
94
+ </style>