@asd20/ui 3.2.1040 → 3.2.1042
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
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
"*.scss",
|
|
6
6
|
"*.vue"
|
|
7
7
|
],
|
|
8
|
-
"version": "3.2.
|
|
8
|
+
"version": "3.2.1042",
|
|
9
9
|
"private": false,
|
|
10
10
|
"license": "MIT",
|
|
11
11
|
"repository": {
|
|
@@ -51,14 +51,13 @@
|
|
|
51
51
|
},
|
|
52
52
|
"devDependencies": {
|
|
53
53
|
"@babel/core": "^7.3.4",
|
|
54
|
-
"@release-it/conventional-changelog": "^
|
|
54
|
+
"@release-it/conventional-changelog": "^1",
|
|
55
55
|
"@storybook/addon-a11y": "^6.5.16",
|
|
56
56
|
"@storybook/addon-actions": "^6.5.16",
|
|
57
57
|
"@storybook/addon-controls": "^6.5.16",
|
|
58
58
|
"@storybook/addon-docs": "^6.5.16",
|
|
59
|
-
"@storybook/addon-knobs": "^6.
|
|
59
|
+
"@storybook/addon-knobs": "^6.4.0",
|
|
60
60
|
"@storybook/addon-links": "^6.5.16",
|
|
61
|
-
"@storybook/addon-notes": "^5.3.12",
|
|
62
61
|
"@storybook/vue": "^6.5.16",
|
|
63
62
|
"@vue/cli-plugin-babel": "^3.4.0",
|
|
64
63
|
"@vue/cli-plugin-e2e-cypress": "^3.4.0",
|
|
@@ -81,7 +80,8 @@
|
|
|
81
80
|
"jest-image-snapshot": "^2.5.0",
|
|
82
81
|
"lint-staged": "^8.1.0",
|
|
83
82
|
"puppeteer": "^1.9.0",
|
|
84
|
-
"react": "
|
|
83
|
+
"react": "16.14.0",
|
|
84
|
+
"react-dom": "16.14.0",
|
|
85
85
|
"release-it": "^10.2.0",
|
|
86
86
|
"sass": "^1.69.0",
|
|
87
87
|
"sass-loader": "10.1.1",
|
|
@@ -1,29 +1,16 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<component
|
|
3
|
-
:is="tag"
|
|
4
|
-
:href="link || undefined"
|
|
5
|
-
:class="classes"
|
|
6
|
-
:aria-label="hideLabel ? label : undefined"
|
|
7
|
-
:aria-disabled="disabled ? 'true' : undefined"
|
|
8
|
-
:title="hideLabel ? label : undefined"
|
|
9
|
-
:target="
|
|
10
|
-
!link || link.startsWith('/') || link.includes('asd20.org')
|
|
11
|
-
? undefined
|
|
12
|
-
: '_blank'
|
|
13
|
-
"
|
|
14
|
-
v-bind="[trackingCode ? { [trackingCode]: '' } : {}]"
|
|
15
|
-
>
|
|
2
|
+
<component :is="tag" v-bind="rootAttrs">
|
|
16
3
|
<asd20-icon
|
|
17
4
|
v-if="icon"
|
|
18
5
|
:name="icon"
|
|
19
6
|
:size="size"
|
|
20
|
-
:style="
|
|
7
|
+
:style="{ transform: `rotate(${iconAngle}deg)` }"
|
|
21
8
|
/>
|
|
22
9
|
<span
|
|
23
10
|
v-if="(label && !hideLabel) || $slots.default"
|
|
24
11
|
class="asd20-button__label"
|
|
25
12
|
v-html="label"
|
|
26
|
-
|
|
13
|
+
/>
|
|
27
14
|
<slot />
|
|
28
15
|
</component>
|
|
29
16
|
</template>
|
|
@@ -40,16 +27,13 @@ export default {
|
|
|
40
27
|
opposite: { type: Boolean, default: false },
|
|
41
28
|
hideLabel: { type: Boolean, default: false },
|
|
42
29
|
link: { type: String, default: '' },
|
|
43
|
-
trackingCode: { type: String, default: '' },
|
|
30
|
+
trackingCode: { type: String, default: '' }, // e.g., 'data-analytics-id'
|
|
44
31
|
icon: { type: String, default: '' },
|
|
45
32
|
badge: { type: Number, default: 0 },
|
|
46
33
|
size: {
|
|
47
34
|
type: String,
|
|
48
35
|
default: 'lg',
|
|
49
|
-
validator:
|
|
50
|
-
// The value must match one of these strings
|
|
51
|
-
return ['xs', 'sm', 'md', 'lg'].indexOf(value) !== -1
|
|
52
|
-
},
|
|
36
|
+
validator: v => ['xs', 'sm', 'md', 'lg'].indexOf(v) !== -1,
|
|
53
37
|
},
|
|
54
38
|
textOnly: { type: Boolean, default: false },
|
|
55
39
|
horizontal: { type: Boolean, default: false },
|
|
@@ -74,15 +58,53 @@ export default {
|
|
|
74
58
|
'asd20-button--centered': this.centered,
|
|
75
59
|
'asd20-button--disabled': this.disabled,
|
|
76
60
|
'asd20-button--opposite': this.opposite,
|
|
77
|
-
|
|
78
61
|
}
|
|
79
62
|
},
|
|
80
63
|
tag() {
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
64
|
+
return !this.link || this.link === ' ' ? 'button' : 'a'
|
|
65
|
+
},
|
|
66
|
+
// === link policy per your latest rules ===
|
|
67
|
+
isExternal() {
|
|
68
|
+
const l = this.link || ''
|
|
69
|
+
if (!l) return false
|
|
70
|
+
if (l.startsWith('/')) return false
|
|
71
|
+
if (l.startsWith('https://asd20.org')) return false
|
|
72
|
+
// treat other *.asd20.org as same-window links
|
|
73
|
+
return !l.includes('.asd20.org')
|
|
74
|
+
},
|
|
75
|
+
target() {
|
|
76
|
+
return this.isExternal ? '_blank' : undefined
|
|
77
|
+
},
|
|
78
|
+
rel() {
|
|
79
|
+
return this.isExternal ? 'noopener noreferrer' : undefined
|
|
80
|
+
},
|
|
81
|
+
rootAttrs() {
|
|
82
|
+
// Build once, spread with v-bind
|
|
83
|
+
const a = {
|
|
84
|
+
class: this.classes,
|
|
85
|
+
'aria-label': this.hideLabel ? this.label : undefined,
|
|
86
|
+
'aria-disabled': this.disabled ? 'true' : undefined,
|
|
87
|
+
title: this.hideLabel ? this.label : undefined,
|
|
85
88
|
}
|
|
89
|
+
|
|
90
|
+
// Anchor-specific attrs (only when tag is <a> AND not disabled)
|
|
91
|
+
if (this.tag === 'a' && !this.disabled) {
|
|
92
|
+
a.href = this.link || undefined
|
|
93
|
+
a.target = this.target
|
|
94
|
+
a.rel = this.rel
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
// Button-specific attrs
|
|
98
|
+
if (this.tag === 'button') {
|
|
99
|
+
a.type = 'button'
|
|
100
|
+
// prevent focusable-but-disabled behavior for accessibility
|
|
101
|
+
if (this.disabled) a.disabled = true
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
// Optional tracking code (dynamic attribute key)
|
|
105
|
+
if (this.trackingCode) a[this.trackingCode] = ''
|
|
106
|
+
|
|
107
|
+
return a
|
|
86
108
|
},
|
|
87
109
|
},
|
|
88
110
|
}
|