comand-component-library 4.0.41 → 4.0.42

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.0.41",
3
+ "version": "4.0.42",
4
4
  "private": false,
5
5
  "type": "module",
6
6
  "license": "GPL-3.0-only",
@@ -804,6 +804,7 @@ export default {
804
804
  onBlur(event) {
805
805
  this.validateInput(event)
806
806
  this.closeTooltipOnBlur()
807
+ this.$emit('blur', event)
807
808
  },
808
809
  onInput(event) {
809
810
  this.validateInput(event)
@@ -1,38 +1,62 @@
1
1
  <template>
2
2
  <!-- begin CmdLink -->
3
3
  <!-- begin href -->
4
- <a v-if="linkType === 'href'" :href="path" :target="target" :class="['cmd-link', {'button': styleAsButton, 'primary': primaryButton}]" @click.prevent="emitClick($event, 'href')">
5
- <span v-if="icon.iconClass && icon.position !== 'right'" :class="icon.iconClass" :title="icon.tooltip"></span>
6
- <span v-if="text">{{ text }}</span>
7
- <span v-if="icon.iconClass && icon.position === 'right'" :class="icon.iconClass" :title="icon.tooltip"></span>
8
- <slot></slot>
4
+ <a v-if="linkType === 'href'" :href="path" :target="target" :class="['cmd-link', {'button': styleAsButton, 'primary': primaryButton}]" @click="emitClick($event, 'href')">
5
+ <InnerLink :text="text" :icon="icon">
6
+ <slot></slot>
7
+ </InnerLink>
9
8
  </a>
10
9
  <!-- end href -->
11
10
 
12
11
  <!-- begin router -->
13
- <router-link v-else-if="linkType === 'router'" :to="path" :class="['cmd-link', {'button': styleAsButton, 'primary': primaryButton}]" @click.prevent="emitClick($event, 'router')">
14
- <span v-if="icon.iconClass && icon.position !== 'right'" :class="icon.iconClass" :title="icon.tooltip"></span>
15
- <span v-if="text">{{ text }}</span>
16
- <span v-if="icon.iconClass && icon.position === 'right'" :class="icon.iconClass" :title="icon.tooltip"></span>
17
- <slot></slot>
12
+ <router-link v-else-if="linkType === 'router'" :to="path" :class="['cmd-link', {'button': styleAsButton, 'primary': primaryButton}]" @click="emitClick($event, 'router')">
13
+ <InnerLink :text="text" :icon="icon">
14
+ <slot></slot>
15
+ </InnerLink>
18
16
  </router-link>
19
17
  <!-- end router -->
20
18
 
21
19
  <!-- begin button -->
22
- <button v-else-if="linkType === 'button'" :class="['cmd-link button', {'primary': primaryButton}]" type="submit" @click.prevent="emitClick($event, 'button')">
23
- <span v-if="icon.iconClass && icon.position !== 'right'" :class="icon.iconClass" :title="icon.tooltip"></span>
24
- <span v-if="text">{{ text }}</span>
25
- <span v-if="icon.iconClass && icon.position === 'right'" :class="icon.iconClass" :title="icon.tooltip"></span>
26
- <slot></slot>
20
+ <button v-else-if="linkType === 'button'" :class="['cmd-link button', {'primary': primaryButton}]" type="submit" @click="emitClick($event, 'button')">
21
+ <InnerLink :text="text" :icon="icon">
22
+ <slot></slot>
23
+ </InnerLink>
27
24
  </button>
28
25
  <!-- end button -->
29
26
  <!-- end CmdLink -->
30
27
  </template>
31
28
 
32
29
  <script>
30
+ import { defineComponent } from "vue"
31
+ const InnerLink = defineComponent({
32
+ template: `<span v-if="icon.iconClass && icon.position !== 'right'" :class="icon.iconClass" :title="icon.tooltip"></span>
33
+ <span v-if="text">{{ text }}</span>
34
+ <span v-if="icon.iconClass && icon.position === 'right'" :class="icon.iconClass" :title="icon.tooltip"></span>
35
+ <slot></slot>`,
36
+ props: {
37
+ /**
38
+ * icon to display
39
+ */
40
+ icon: {
41
+ type: Object,
42
+ default: {}
43
+ },
44
+ /**
45
+ * displayed text
46
+ */
47
+ text: {
48
+ type: String,
49
+ default: ""
50
+ }
51
+ }
52
+ })
53
+
33
54
  export default {
34
55
  name: "CmdLink",
35
56
  emits: ["click"],
57
+ components: {
58
+ InnerLink
59
+ },
36
60
  props: {
37
61
  /**
38
62
  * set type of link
@@ -54,7 +78,7 @@ export default {
54
78
  * linkType-property must be 'href', 'router'
55
79
  */
56
80
  path: {
57
- type: String,
81
+ type: [String, Object],
58
82
  default: "#"
59
83
  },
60
84
  /**
@@ -12,6 +12,7 @@
12
12
  <!-- end CmdIcon -->
13
13
  <span v-if="link.text">{{ link.text }}</span>
14
14
  </a>
15
+ <!--CmdLink @click="executeLink()" /-->
15
16
  <!-- end use href --->
16
17
 
17
18
  <!-- begin use router-link -->
@@ -24,6 +25,7 @@
24
25
  <!-- end CmdIcon -->
25
26
  <span v-if="link.text">{{ link.text }}</span>
26
27
  </router-link>
28
+ <!--CmdLink :path="getRoute(link)" /-->
27
29
  <!-- end use router-link -->
28
30
 
29
31
  <!-- begin CmdListOfLinksItem for nested children -->
@@ -16,54 +16,6 @@
16
16
  <span :class="separatorIconClass"></span>
17
17
  </CmdLink>
18
18
  <!-- end CmdLink -->
19
-
20
- <!-- begin type === href -->
21
- <a v-if="step.type === 'href'"
22
- :href="step.path" @click.stop.prevent="clickedStep($event, index)"
23
- :title="step.tooltip"
24
- >
25
- <span v-if="showStepNumber" class="number">{{ index + 1 }}</span>
26
- <!-- begin CmdIcon -->
27
- <CmdIcon v-if="step.iconClass" :iconClass="step.iconClass" :type="step.iconType" />
28
- <!-- end CmdIcon -->
29
- <span v-if="step.text">{{ step.text }}</span>
30
- <span :class="separatorIconClass"></span>
31
- </a>
32
- <!-- end type === href -->
33
-
34
- <!-- begin type === router -->
35
- <router-link
36
- v-if="step.type === 'router'"
37
- :to="getRoute(step)"
38
- :title="step.tooltip"
39
- >
40
- <span v-if="showStepNumber" class="number">{{ index + 1 }}</span>
41
- <!-- begin CmdIcon -->
42
- <CmdIcon v-if="step.iconClass" :iconClass="step.iconClass" :type="step.iconType" />
43
- <!-- end CmdIcon -->
44
- <span v-if="step.text">{{ step.text }}</span>
45
- <span :class="separatorIconClass"></span>
46
- </router-link>
47
- <!-- end type === router -->
48
-
49
- <!-- begin type === button/submit -->
50
- <button
51
- v-if="step.type === 'button' || step.type === 'submit'"
52
- class="button"
53
- :type="step.type"
54
- :name="step.name"
55
- :title="step.tooltip"
56
- :formaction="step.formaction"
57
- @click.stop.prevent="clickedStep($event, index)"
58
- >
59
- <span v-if="showStepNumber" class="number">{{ index + 1 }}</span>
60
- <!-- begin CmdIcon -->
61
- <CmdIcon v-if="step.iconClass" :iconClass="step.iconClass" :type="step.iconType" />
62
- <!-- end CmdIcon -->
63
- <span v-if="step.text">{{ step.text }}</span>
64
- <span :class="separatorIconClass"></span>
65
- </button>
66
- <!-- end type === button/submit -->
67
19
  </li>
68
20
  </ol>
69
21
  </template>
@@ -1,5 +1,6 @@
1
1
  <template>
2
2
  <div class="cmd-tabs">
3
+ <!-- being tab-list -->
3
4
  <ul :class="{'stretch-tabs' : stretchTabs}" role="tablist">
4
5
  <li v-for="(tab, index) in tabs" :class="{active : showTab === index}" :key="index" role="tab">
5
6
  <a href="#" @click.prevent="setActiveTab(index)" :title="!tab.name ? tab.tooltip : undefined">
@@ -10,7 +11,9 @@
10
11
  </a>
11
12
  </li>
12
13
  </ul>
14
+ <!-- end tab-list -->
13
15
 
16
+ <!-- being tab-content -->
14
17
  <!-- begin slot -->
15
18
  <template v-if="useSlot">
16
19
  <div v-show="showTab === index - 1" v-for="index in tabs.length" :key="index" aria-live="assertive">
@@ -32,6 +35,7 @@
32
35
  <!-- end CmdHeadline -->
33
36
  <div v-html="tabs[showTab].htmlContent"></div>
34
37
  </div>
38
+ <!-- end tab-content -->
35
39
  </div>
36
40
  </template>
37
41