comand-component-library 3.3.84 → 3.3.85

Sign up to get free protection for your applications and to get access to all the features.
Files changed (38) hide show
  1. package/dist/comand-component-library.js +5630 -3936
  2. package/dist/comand-component-library.umd.cjs +4 -4
  3. package/dist/style.css +1 -1
  4. package/package.json +2 -2
  5. package/src/App.vue +215 -112
  6. package/src/assets/data/component-structure.json +228 -0
  7. package/src/assets/data/form-elements.json +156 -0
  8. package/src/assets/data/opening-hours.json +79 -37
  9. package/src/components/CmdAddressData.vue +187 -201
  10. package/src/components/CmdAddressDataItem.vue +306 -0
  11. package/src/components/CmdBox.vue +1 -0
  12. package/src/components/CmdBoxWrapper.vue +53 -5
  13. package/src/components/CmdFancyBox.vue +31 -4
  14. package/src/components/CmdForm.vue +98 -4
  15. package/src/components/CmdFormElement.vue +5 -1
  16. package/src/components/CmdHeadline.vue +179 -52
  17. package/src/components/CmdImage.vue +150 -21
  18. package/src/components/CmdImageGallery.vue +88 -85
  19. package/src/components/CmdListOfLinks.vue +63 -43
  20. package/src/components/CmdListOfLinksItem.vue +97 -0
  21. package/src/components/CmdLoginForm.vue +3 -6
  22. package/src/components/CmdMultistepFormProgressBar.vue +37 -8
  23. package/src/components/CmdOpeningHours.vue +280 -63
  24. package/src/components/CmdOpeningHoursItem.vue +264 -0
  25. package/src/components/{CmdPager.vue → CmdPagination.vue} +2 -2
  26. package/src/components/CmdSlideshow.vue +137 -10
  27. package/src/components/CmdSocialNetworks.vue +115 -28
  28. package/src/components/CmdSocialNetworksItem.vue +184 -0
  29. package/src/components/CmdTable.vue +0 -1
  30. package/src/components/CmdTextImageBlock.vue +158 -0
  31. package/src/components/CmdThumbnailScroller.vue +132 -12
  32. package/src/components/CmdToggleDarkMode.vue +58 -1
  33. package/src/components/EditComponentWrapper.vue +553 -0
  34. package/src/index.js +2 -2
  35. package/src/mixins/EditMode.vue +28 -9
  36. package/src/utils/editmode.js +30 -5
  37. package/src/components/CmdTextBlock.vue +0 -73
  38. package/src/editmode/editModeContext.js +0 -50
@@ -1,73 +0,0 @@
1
- <template>
2
- <div class="cmd-text-block flex-container vertical">
3
- <!-- begin cmd-headline -->
4
- <CmdHeadline v-if="cmdHeadline" :headlineText="cmdHeadline.headlineText" :headlineLevel="cmdHeadline.headlineLevel" />
5
- <!-- end cmd-headline -->
6
-
7
- <!-- begin continuous text -->
8
- <textarea v-if="editModeContext?.editing" class="edit-mode" v-model="editableHtmlContent"></textarea>
9
- <div v-else-if="htmlContent" v-html="htmlContent"></div>
10
- <!-- end continuous text -->
11
- </div>
12
- </template>
13
-
14
- <script>
15
- import {useEditModeContext} from "../editmode/editModeContext.js"
16
-
17
- export default {
18
- name: "CmdTextBlock",
19
- provide() {
20
- return {
21
- editModeContext: this.context
22
- }
23
- },
24
- inject: {
25
- editModeContext: {
26
- default: null
27
- }
28
- },
29
- data() {
30
- return {
31
- context: useEditModeContext(this.editModeContext, {tb: true}, this.onPersist),
32
- editableHtmlHeadline: this.cmdHeadline?.headlineText || "",
33
- editableHtmlContent: this.htmlContent
34
- }
35
- },
36
- props: {
37
- editModeContextData: {
38
- type: Object
39
- },
40
- /**
41
- * properties for CmdHeadline-component
42
- */
43
- cmdHeadline: {
44
- type: Object,
45
- required: false
46
- },
47
- /**
48
- * content for continuous text (can contain html-tags)
49
- */
50
- htmlContent: {
51
- type: String,
52
- required: true
53
- }
54
- },
55
- methods: {
56
- onPersist(data) {
57
- const htmlContent = this.editableHtmlContent
58
- return {
59
- editModeContextData: {
60
- ...(this.editModeContextData || {})
61
- },
62
- update(props) {
63
- props.cmdHeadline = {
64
- ...(props.cmdHeadline || {}),
65
- }
66
- props.cmdHeadline.headlineText = data[0].headlineText
67
- props.htmlContent = htmlContent
68
- }
69
- }
70
- }
71
- }
72
- }
73
- </script>
@@ -1,50 +0,0 @@
1
- import {ref, watchEffect} from "vue"
2
-
3
- export function useEditModeContext(parentContext, props, persistHandler) {
4
- const editing = ref(!!parentContext?.editing)
5
- const saveHandlers = []
6
-
7
- function save() {
8
- const data = []
9
- saveHandlers.forEach(saveHandler => {
10
- const result = saveHandler();
11
- if (result) {
12
- data.push(result)
13
- }
14
- })
15
- callPersistHandler(data)
16
- }
17
-
18
- function callPersistHandler(data) {
19
- let processedData = data
20
- if (persistHandler) {
21
- processedData = persistHandler(data)
22
- }
23
- if (parentContext && processedData != null) {
24
- parentContext.callPersistHandler(processedData)
25
- }
26
- }
27
-
28
- function addSaveHandler(saveHandler) {
29
- if (!saveHandlers.includes(saveHandler)) {
30
- saveHandlers.push(saveHandler)
31
- }
32
- }
33
-
34
- if (parentContext) {
35
- parentContext.addSaveHandler(save)
36
- }
37
-
38
- watchEffect(() => editing.value = !!parentContext?.editing);
39
-
40
- return {
41
- editing,
42
- props: {
43
- ...(parentContext?.props || {}),
44
- ...(props || {})
45
- },
46
- addSaveHandler,
47
- save,
48
- callPersistHandler
49
- }
50
- }