@mptw/skylens-ui 1.3.2 → 1.3.3

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.
@@ -9,9 +9,11 @@
9
9
  @change="onChanged"
10
10
  )
11
11
  label(:for="uid")
12
- SLIcon(icon="circle")
13
- SLIcon(icon="dot-circle")
14
- span(v-if="label !== ''") {{ label }}
12
+ .radio-button-wrapper
13
+ SLIcon(icon="circle")
14
+ SLIcon(icon="dot-circle")
15
+ span(v-if="label !== ''") {{ label }}
16
+ .radio-button-desc(v-if="desc !== ''") {{ desc }}
15
17
  </template>
16
18
 
17
19
  <script lang="ts">
@@ -38,6 +40,10 @@ export default defineComponent({
38
40
  type: Boolean,
39
41
  default: false,
40
42
  },
43
+ desc: {
44
+ type: String,
45
+ default: '',
46
+ },
41
47
  },
42
48
  emits: ["update:modelValue"],
43
49
  setup(props, { emit }) {
@@ -69,29 +75,38 @@ export default defineComponent({
69
75
  @apply absolute s('-top-10') s('-left-10')
70
76
 
71
77
  label
72
- @apply relative inline-flex items-center text-base s('leading-4.5') text-gray-3 cursor-pointer
78
+ @apply relative inline-flex flex-col items-start space-y-1 cursor-pointer
79
+
80
+ .radio-button-wrapper
81
+ @apply inline-flex items-center text-base s('leading-4.5') text-gray-3
82
+
83
+ .icon
84
+ @apply hidden
73
85
 
74
- .icon
75
- @apply hidden
86
+ span
87
+ @apply ml-1 text-base text-gray-2
76
88
 
77
- span
78
- @apply ml-1 text-base text-gray-2
89
+ .radio-button-desc
90
+ @apply pl-5 text-xs text-gray-2
79
91
 
80
92
  input:not(:checked) + label
81
- .icon-circle
82
- @apply inline-block text-primary
93
+ .radio-button-wrapper
94
+ .icon-circle
95
+ @apply inline-block text-primary
83
96
 
84
97
  input:checked + label
85
- .icon-dot-circle
86
- @apply inline-block text-primary
98
+ .radio-button-wrapper
99
+ .icon-dot-circle
100
+ @apply inline-block text-primary
87
101
 
88
102
  input:disabled + label
89
- span
90
- @apply text-gray-3
103
+ .radio-button-wrapper
104
+ span
105
+ @apply text-gray-3
91
106
 
92
- .icon-circle
93
- @apply text-gray-3
107
+ .icon-circle
108
+ @apply text-gray-3
94
109
 
95
- .icon-dot-circle
96
- @apply text-gray-3
110
+ .icon-dot-circle
111
+ @apply text-gray-3
97
112
  </style>
@@ -11,6 +11,7 @@
11
11
  :value="option.value"
12
12
  :key="i"
13
13
  :disabled='disabled || option.disabled'
14
+ :desc='option.desc'
14
15
  )
15
16
  .invalid-feedback
16
17
  slot(name="invalid-feedback") {{ invalidFeedback }}
@@ -3,4 +3,5 @@ export default interface IInputOption {
3
3
  value: any;
4
4
  icon?: string;
5
5
  disabled?: boolean;
6
+ desc?: string;
6
7
  }
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@mptw/skylens-ui",
3
3
  "type": "module",
4
- "version": "1.3.2",
4
+ "version": "1.3.3",
5
5
  "main": "./nuxt.config.ts",
6
6
  "scripts": {
7
7
  "dev": "nuxi dev .playground",