comand-component-library 4.3.20 → 4.3.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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "comand-component-library",
3
- "version": "4.3.20",
3
+ "version": "4.3.21",
4
4
  "license": "GPL-3.0-only",
5
5
  "author": "CoManD-UI",
6
6
  "private": false,
@@ -1,7 +1,7 @@
1
1
  <template>
2
2
  <!-- begin CmdAccordion ---------------------------------------------------------------------------------------- -->
3
3
  <details ref="cmdAccordion" :class="['cmd-accordion', highlightLevel, { 'flex-container no-gap' : rowView }]" :name="accordionName">
4
- <summary>
4
+ <summary :class="{'writing-mode-vertical' : summaryWritingMode}">
5
5
  <!--
6
6
  <span :class="[cmdIconClosed.iconClass, 'closed']" :title="cmdIconClosed.tooltip"></span>
7
7
  <span :class="[cmdIconOpen.iconClass, 'open']" :title="cmdIconOpen.tooltip"></span>
@@ -33,7 +33,7 @@ export default {
33
33
  },
34
34
  props: {
35
35
  /**
36
- * arranges box-content in a row
36
+ * arranges accordion-content in a row
37
37
  *
38
38
  * @affectsStyling: true
39
39
  */
@@ -41,6 +41,21 @@ export default {
41
41
  type: Boolean,
42
42
  default: false
43
43
  },
44
+ /**
45
+ * set direction of text for summary
46
+ *
47
+ * rowView-property must be true
48
+ *
49
+ * @allowedValues: "horizontal", "vertical"
50
+ */
51
+ summaryWritingMode: {
52
+ type: String,
53
+ default: "horizontal",
54
+ validator(value) {
55
+ return value === "horizontal",
56
+ value === "vertical"
57
+ }
58
+ },
44
59
  /**
45
60
  * set highlight-level for headline
46
61
  *
@@ -161,6 +176,7 @@ export default {
161
176
 
162
177
  <style>
163
178
  .cmd-accordion {
179
+ /* begin rowView */
164
180
  &.flex-container {
165
181
  flex-wrap: nowrap;
166
182
  align-items: center;
@@ -175,11 +191,12 @@ export default {
175
191
  }
176
192
  }
177
193
 
178
- summary {
194
+ summary.writing-mode-vertical {
179
195
  writing-mode: vertical-rl;
180
196
  transform: rotate(180deg);
181
197
  }
182
198
  }
199
+ /* end rowView */
183
200
 
184
201
  summary {
185
202
  .cmd-headline {
@@ -25,6 +25,7 @@
25
25
  :boxToggled="boxToggled"
26
26
  :boxIsOpen="boxIsOpen"
27
27
  :rowView="rowView"
28
+ :summaryWritingMode="summaryWritingMode"
28
29
  @toggleCollapse="boxIsToggled"
29
30
  >
30
31
  </slot>
@@ -69,6 +70,21 @@ export default {
69
70
  type: Boolean,
70
71
  default: false
71
72
  },
73
+ /**
74
+ * set direction of text for summary
75
+ *
76
+ * rowView-property must be true
77
+ *
78
+ * @allowedValues: "horizontal", "vertical"
79
+ */
80
+ summaryWritingMode: {
81
+ type: String,
82
+ default: "horizontal",
83
+ validator(value) {
84
+ return value === "horizontal",
85
+ value === "vertical"
86
+ }
87
+ },
72
88
  /**
73
89
  * activate if user can toggle grid- and row-orientation by himself
74
90
  */
@@ -194,7 +210,7 @@ export default {
194
210
  </script>
195
211
 
196
212
  <style>
197
- /* begin cmd-box-wrapper ---------------------------------------------------------------------------------------- */
213
+ /* begin cmd-accordions-wrapper ---------------------------------------------------------------------------------------- */
198
214
  .cmd-accordions-wrapper {
199
215
  .inner-accordions-wrapper {
200
216
  .cmd-accordion {
@@ -202,8 +218,5 @@ export default {
202
218
  }
203
219
  }
204
220
  }
205
- </style>
206
-
207
- <style>
208
- /* end cmd-box-wrapper ---------------------------------------------------------------------------------------- */
221
+ /* end cmd-accordions-wrapper ---------------------------------------------------------------------------------------- */
209
222
  </style>
@@ -71,6 +71,7 @@ export default {
71
71
  </script>
72
72
 
73
73
  <style>
74
+ /* begin cmd-footnote ---------------------------------------------------------------------------------------- */
74
75
  .cmd-footnote {
75
76
  .cmd-list {
76
77
  dl {
@@ -89,4 +90,5 @@ export default {
89
90
  }
90
91
  }
91
92
  }
93
+ /* end cmd-footnote ---------------------------------------------------------------------------------------- */
92
94
  </style>
@@ -147,7 +147,7 @@ export default {
147
147
  /**
148
148
  * define the highlight-level
149
149
  *
150
- * @allowedValues: "", "primary", "secondary", "tertiary"
150
+ * @allowedValues: null, "primary", "secondary", "tertiary"
151
151
  */
152
152
  highlightLevel: {
153
153
  type: String,
@@ -147,7 +147,7 @@ export default {
147
147
  if(this.contentOrientation === "horizontal") {
148
148
  return "flex-container"
149
149
  } else if(this.contentOrientation === "vertical") {
150
- return "flex-container vertical"
150
+ return "flex-container flex-direction-column"
151
151
  }
152
152
  }
153
153
  return ""