@sk-web-gui/core 4.1.1 → 4.1.2

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.
Files changed (16) hide show
  1. package/dist/cjs/components/accordion.js +113 -111
  2. package/dist/cjs/components/accordion.js.map +1 -1
  3. package/dist/cjs/components/forms.js +9 -0
  4. package/dist/cjs/components/forms.js.map +1 -1
  5. package/dist/cjs/components/progress-bar.js +6 -0
  6. package/dist/cjs/components/progress-bar.js.map +1 -1
  7. package/dist/esm/components/accordion.js +113 -111
  8. package/dist/esm/components/accordion.js.map +1 -1
  9. package/dist/esm/components/forms.js +9 -0
  10. package/dist/esm/components/forms.js.map +1 -1
  11. package/dist/esm/components/progress-bar.js +6 -0
  12. package/dist/esm/components/progress-bar.js.map +1 -1
  13. package/dist/types/components/accordion.d.ts +108 -106
  14. package/dist/types/components/forms.d.ts +9 -0
  15. package/dist/types/components/progress-bar.d.ts +6 -0
  16. package/package.json +2 -2
package/dist/cjs/components/accordion.js CHANGED
@@ -10,121 +10,141 @@ Object.defineProperty(exports, "Accordion", {
10
10
  });
11
11
  const Accordion = ()=>({
12
12
  '.sk-disclosure': {
13
+ '@apply mt-6 mb-8': {},
14
+ '@apply text-dark-secondary': {},
15
+ '&[data-inverted="true"]': {
16
+ '@apply text-inverted-dark-secondary': {}
17
+ },
13
18
  '&-icon': {
14
19
  '@apply flex self-center': {}
15
20
  },
16
21
  '&-header': {
17
- '@apply mt-6 mb-8': {},
18
- '@apply flex flex-col text-left': {},
22
+ '@apply py-8': {},
23
+ '@apply flex flex-row text-left': {},
19
24
  '@apply cursor-pointer': {},
20
- '*': {
21
- '@apply cursor-pointer': {}
25
+ '@apply items-center justify-between': {},
26
+ '@apply gap-16': {},
27
+ '&-icon': {
28
+ '@apply w-32 h-32': {},
29
+ '&-sm': {
30
+ '@apply w-20 min-h-20': {}
31
+ },
32
+ '&-md': {
33
+ '@apply w-24 min-h-24': {}
34
+ }
35
+ },
36
+ '&-title': {
37
+ '@apply text-dark-primary': {},
38
+ '@apply w-full': {},
39
+ '@apply flex flex-row': {},
40
+ '@apply items-center': {},
41
+ '@apply grow shrink': {},
42
+ '&[data-inverted="true"]': {
43
+ '@apply text-inverted-dark-primary': {}
44
+ },
45
+ '*': {
46
+ '@apply m-0': {},
47
+ '@apply text-inherit': {},
48
+ fontSize: 'inherit',
49
+ FontFamily: 'inherit',
50
+ lineHeight: 'inherit'
51
+ },
52
+ '&-disabled': {
53
+ '@apply text-dark-disabled': {},
54
+ '&[data-inverted="true"]': {
55
+ '@apply text-inverted-dark-disabled': {}
56
+ }
57
+ },
58
+ '&-sm': {
59
+ '@apply gap-16': {},
60
+ '@apply text-h4-sm': {},
61
+ '&[data-variant="alt"]': {
62
+ '@apply gap-12': {}
63
+ }
64
+ },
65
+ '&-md': {
66
+ '@apply gap-16': {},
67
+ '@apply text-h4-md': {},
68
+ '&[data-variant="alt"]': {
69
+ '@apply gap-12': {}
70
+ }
71
+ },
72
+ '&-lg': {
73
+ '@apply gap-16': {},
74
+ '&[data-variant="alt"]': {
75
+ '@apply gap-16': {},
76
+ '@apply text-h3-md': {}
77
+ }
78
+ },
79
+ '&-divider': {
80
+ '@apply border-divider': {},
81
+ '&[data-inverted="true"]': {
82
+ '@apply border-inverted-divider': {}
83
+ }
84
+ }
22
85
  },
23
86
  '&:focus-visible': {
24
87
  '@apply outline-0': {}
25
88
  },
26
- '&-icon': {
27
- '@apply ml-auto': {},
28
- '@apply text-dark-secondary': {},
29
- svg: {
30
- '@apply w-20 h-20': {}
31
- }
32
- },
33
- '&[data-disabled="true"]': {
89
+ '&[aria-disabled="true"]': {
34
90
  '@apply text-dark-disabled': {},
35
- '.sk-disclosure-title': {
36
- '@apply text-dark-disabled': {}
37
- },
38
91
  '@apply cursor-default': {},
39
92
  '*': {
40
93
  '@apply cursor-default': {}
94
+ },
95
+ '&[data-inverted="true"]': {
96
+ '@apply text-inverted-dark-disabled': {}
41
97
  }
42
- }
43
- },
44
- '&-label': {
45
- '@apply shrink-0': {}
46
- },
47
- '&-toggle': {
48
- '@apply flex items-center justify-between': {},
49
- '@apply gap-16': {},
50
- '.sk-icon': {
51
- '@apply w-32 h-32': {}
52
- }
53
- },
54
- '&-title': {
55
- '@apply text-dark-primary': {},
56
- '&-wrapper': {
57
- '@apply w-full': {},
58
- '@apply flex flex-row': {},
59
- '@apply items-center': {}
60
- }
61
- },
62
- '&-sm': {
63
- '.sk-disclosure-title': {
64
- '@apply text-h4-sm font-bold': {},
65
- '&-wrapper': {
98
+ },
99
+ '&-sm': {
100
+ '@apply gap-16': {},
101
+ '@apply h-32': {},
102
+ '&[data-variant="alt"]': {
66
103
  '@apply gap-12': {}
104
+ },
105
+ '&[data-variant="default"]': {
106
+ '@apply min-h-40': {}
67
107
  }
68
108
  },
69
- '.sk-disclosure-toggle': {
70
- '@apply gap-12': {},
71
- '.sk-icon': {
72
- '@apply w-20 min-h-20': {}
109
+ '&-md': {
110
+ '@apply gap-16': {},
111
+ '&[data-variant="alt"]': {
112
+ '@apply gap-12': {}
113
+ },
114
+ '&[data-variant="default"]': {
115
+ '@apply min-h-56': {}
73
116
  }
74
117
  },
75
- '.sk-disclosure-support': {
76
- '@apply text-small': {}
77
- },
78
- '&[data-variant="default"]': {
79
- '.sk-disclosure-toggle': {
80
- '@apply py-4': {},
81
- '@apply min-h-40': {}
82
- },
118
+ '&-lg': {
119
+ '@apply gap-16': {},
83
120
  '.sk-disclosure-header-icon': {
84
- '@apply w-32 h-32': {}
121
+ '@apply w-32 min-h-32': {}
122
+ },
123
+ '&[data-variant="alt"]': {
124
+ '@apply gap-16': {}
85
125
  }
86
- },
87
- '&[data-variant="alt"]': {}
126
+ }
127
+ },
128
+ '&[data-variant="alt"]': {
129
+ '.sk-disclosure-header': {
130
+ '@apply py-0': {},
131
+ '@apply h-32': {}
132
+ }
133
+ },
134
+ '&-label': {
135
+ '@apply shrink-0': {}
88
136
  },
89
137
  '&-md': {
90
- '.sk-disclosure-title': {
91
- '@apply text-h4-md font-bold': {},
92
- '&-wrapper': {
93
- '@apply gap-12': {}
94
- }
95
- },
96
- '.sk-disclosure-toggle': {
97
- '@apply gap-12': {},
98
- '.sk-icon': {
99
- '@apply w-24 min-h-24': {}
100
- }
101
- },
102
- '.sk-disclosure-support': {
103
- '@apply text-body': {}
104
- },
105
138
  '&[data-variant="default"]': {
106
- '.sk-disclosure-toggle': {
139
+ '.sk-disclosure-header': {
107
140
  '@apply py-8': {},
108
141
  '@apply min-h-56': {}
109
142
  },
110
- '.sk-disclosure-header-icon': {
143
+ '.sk-disclosure-header-button': {
111
144
  '@apply w-40 h-40': {}
112
145
  }
113
146
  }
114
147
  },
115
- '&-lg': {
116
- '&[data-variant="alt"]': {
117
- '.sk-disclosure-support': {
118
- '@apply text-large': {}
119
- },
120
- '.sk-disclosure-title': {
121
- '@apply text-h3-md font-bold': {},
122
- '&-wrapper': {
123
- '@apply gap-16': {}
124
- }
125
- }
126
- }
127
- },
128
148
  '&-body': {
129
149
  '&[data-size="sm"]': {
130
150
  '@apply pr-12': {}
@@ -141,13 +161,13 @@ const Accordion = ()=>({
141
161
  '@apply mr-32': {},
142
162
  '@apply gap-8': {},
143
163
  '@apply py-0': {},
144
- transitionProperty: 'visibility, height, opacity, padding, margin',
164
+ transitionProperty: 'height, opacity, padding, margin',
145
165
  transitionDuration: '180ms',
146
- '&[aria-hidden="true"], &[data-hidden="true"]': {
147
- '@apply my-0 invisible max-h-0 opacity-0': {}
166
+ '&[aria-hidden="true"]': {
167
+ '@apply my-0 overflow-hidden max-h-0 opacity-0': {}
148
168
  },
149
- '&[aria-hidden="false"], &[data-hidden="false"]': {
150
- '@apply block opacity-100 visible': {}
169
+ '&[aria-hidden="false"]': {
170
+ '@apply block opacity-100': {}
151
171
  },
152
172
  '&[data-variant="alt"]': {
153
173
  '@apply mt-24': {},
@@ -179,33 +199,15 @@ const Accordion = ()=>({
179
199
  '.sk-disclosure': {
180
200
  transitionProperty: 'margin',
181
201
  transitionDuration: '180ms',
182
- '@apply border-b-1 border-divider': {}
202
+ '@apply border-b-1 border-divider': {},
203
+ '&[data-inverted="true"]': {
204
+ '@apply border-inverted-divider': {}
205
+ }
183
206
  },
184
207
  '&:last-child .sk-disclosure': {
185
208
  '@apply border-b-transparent': {}
186
209
  }
187
210
  }
188
- },
189
- '&[data-inverted="true"]': {
190
- '&.sk-disclosure': {
191
- '&-icon': {
192
- '@apply text-inverted-dark-secondary': {}
193
- },
194
- '&[data-disabled="true"]': {
195
- '@apply text-inverted-dark-disabled': {},
196
- '.sk-disclosure-title': {
197
- '@apply text-inverted-dark-disabled': {}
198
- }
199
- },
200
- '&-title': {
201
- '@apply text-inverted-dark-primary': {}
202
- }
203
- },
204
- '&.sk-accordion': {
205
- '&-item': {
206
- '@apply border-inverted-divider': {}
207
- }
208
- }
209
211
  }
210
212
  });
211
213
 
package/dist/cjs/components/accordion.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/accordion.ts"],"sourcesContent":["export const Accordion = () => ({\r\n '.sk-disclosure': {\r\n '&-icon': {\r\n '@apply flex self-center': {},\r\n },\r\n '&-header': {\r\n '@apply mt-6 mb-8': {},\r\n '@apply flex flex-col text-left': {},\r\n '@apply cursor-pointer': {},\r\n '*': {\r\n '@apply cursor-pointer': {},\r\n },\r\n '&:focus-visible': {\r\n '@apply outline-0': {},\r\n },\r\n\r\n '&-icon': {\r\n '@apply ml-auto': {},\r\n '@apply text-dark-secondary': {},\r\n svg: {\r\n '@apply w-20 h-20': {},\r\n },\r\n },\r\n '&[data-disabled=\"true\"]': {\r\n '@apply text-dark-disabled': {},\r\n '.sk-disclosure-title': {\r\n '@apply text-dark-disabled': {},\r\n },\r\n '@apply cursor-default': {},\r\n '*': {\r\n '@apply cursor-default': {},\r\n },\r\n },\r\n },\r\n '&-label': {\r\n '@apply shrink-0': {},\r\n },\r\n '&-toggle': {\r\n '@apply flex items-center justify-between': {},\r\n '@apply gap-16': {},\r\n '.sk-icon': {\r\n '@apply w-32 h-32': {},\r\n },\r\n },\r\n '&-title': {\r\n '@apply text-dark-primary': {},\r\n '&-wrapper': {\r\n '@apply w-full': {},\r\n '@apply flex flex-row': {},\r\n '@apply items-center': {},\r\n },\r\n },\r\n\r\n '&-sm': {\r\n '.sk-disclosure-title': {\r\n '@apply text-h4-sm font-bold': {},\r\n '&-wrapper': {\r\n '@apply gap-12': {},\r\n },\r\n },\r\n '.sk-disclosure-toggle': {\r\n '@apply gap-12': {},\r\n '.sk-icon': {\r\n '@apply w-20 min-h-20': {},\r\n },\r\n },\r\n '.sk-disclosure-support': {\r\n '@apply text-small': {},\r\n },\r\n '&[data-variant=\"default\"]': {\r\n '.sk-disclosure-toggle': {\r\n '@apply py-4': {},\r\n '@apply min-h-40': {},\r\n },\r\n '.sk-disclosure-header-icon': {\r\n '@apply w-32 h-32': {},\r\n },\r\n },\r\n '&[data-variant=\"alt\"]': {},\r\n },\r\n '&-md': {\r\n '.sk-disclosure-title': {\r\n '@apply text-h4-md font-bold': {},\r\n '&-wrapper': {\r\n '@apply gap-12': {},\r\n },\r\n },\r\n '.sk-disclosure-toggle': {\r\n '@apply gap-12': {},\r\n '.sk-icon': {\r\n '@apply w-24 min-h-24': {},\r\n },\r\n },\r\n '.sk-disclosure-support': {\r\n '@apply text-body': {},\r\n },\r\n '&[data-variant=\"default\"]': {\r\n '.sk-disclosure-toggle': {\r\n '@apply py-8': {},\r\n '@apply min-h-56': {},\r\n },\r\n '.sk-disclosure-header-icon': {\r\n '@apply w-40 h-40': {},\r\n },\r\n },\r\n },\r\n '&-lg': {\r\n '&[data-variant=\"alt\"]': {\r\n '.sk-disclosure-support': {\r\n '@apply text-large': {},\r\n },\r\n '.sk-disclosure-title': {\r\n '@apply text-h3-md font-bold': {},\r\n '&-wrapper': {\r\n '@apply gap-16': {},\r\n },\r\n },\r\n },\r\n },\r\n\r\n '&-body': {\r\n '&[data-size=\"sm\"]': {\r\n '@apply pr-12': {},\r\n },\r\n '&[data-size=\"md\"]': {\r\n '@apply pr-12': {},\r\n },\r\n '&[data-size=\"lg\"]': {\r\n '@apply pr-16': {},\r\n },\r\n '@apply text-base': {},\r\n '@apply flex flex-col': {},\r\n '@apply mb-32': {},\r\n '@apply mr-32': {},\r\n '@apply gap-8': {},\r\n '@apply py-0': {},\r\n transitionProperty: 'visibility, height, opacity, padding, margin',\r\n\r\n transitionDuration: '180ms',\r\n\r\n '&[aria-hidden=\"true\"], &[data-hidden=\"true\"]': {\r\n '@apply my-0 invisible max-h-0 opacity-0': {},\r\n },\r\n\r\n '&[aria-hidden=\"false\"], &[data-hidden=\"false\"]': {\r\n '@apply block opacity-100 visible': {},\r\n },\r\n\r\n '&[data-variant=\"alt\"]': {\r\n '@apply mt-24': {},\r\n '&[data-size=\"sm\"]': {\r\n '@apply pr-12': {},\r\n },\r\n '&[data-size=\"md\"]': {\r\n '@apply pr-12': {},\r\n },\r\n '&[data-size=\"lg\"]': {\r\n '@apply pr-16': {},\r\n },\r\n '&[data-has-icon=\"true\"]': {\r\n '&[data-size=\"sm\"]': {\r\n '@apply ml-32': {},\r\n },\r\n '&[data-size=\"md\"]': {\r\n '@apply ml-36': {},\r\n },\r\n '&[data-size=\"lg\"]': {\r\n '@apply ml-48': {},\r\n },\r\n },\r\n },\r\n },\r\n },\r\n '.sk-accordion': {\r\n '&-item': {\r\n '.sk-disclosure': {\r\n transitionProperty: 'margin',\r\n transitionDuration: '180ms',\r\n '@apply border-b-1 border-divider': {},\r\n },\r\n\r\n '&:last-child .sk-disclosure': {\r\n '@apply border-b-transparent': {},\r\n },\r\n },\r\n },\r\n\r\n '&[data-inverted=\"true\"]': {\r\n '&.sk-disclosure': {\r\n '&-icon': {\r\n '@apply text-inverted-dark-secondary': {},\r\n },\r\n\r\n '&[data-disabled=\"true\"]': {\r\n '@apply text-inverted-dark-disabled': {},\r\n '.sk-disclosure-title': {\r\n '@apply text-inverted-dark-disabled': {},\r\n },\r\n },\r\n\r\n '&-title': {\r\n '@apply text-inverted-dark-primary': {},\r\n },\r\n },\r\n '&.sk-accordion': {\r\n '&-item': {\r\n '@apply border-inverted-divider': {},\r\n },\r\n },\r\n },\r\n});\r\n"],"names":["Accordion","svg","transitionProperty","transitionDuration"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../src/components/accordion.ts"],"sourcesContent":["export const Accordion = () => ({\r\n '.sk-disclosure': {\r\n '@apply mt-6 mb-8': {},\r\n '@apply text-dark-secondary': {},\r\n '&[data-inverted=\"true\"]': {\r\n '@apply text-inverted-dark-secondary': {},\r\n },\r\n '&-icon': {\r\n '@apply flex self-center': {},\r\n },\r\n '&-header': {\r\n '@apply py-8': {},\r\n '@apply flex flex-row text-left': {},\r\n '@apply cursor-pointer': {},\r\n '@apply items-center justify-between': {},\r\n '@apply gap-16': {},\r\n '&-icon': {\r\n '@apply w-32 h-32': {},\r\n '&-sm': {\r\n '@apply w-20 min-h-20': {},\r\n },\r\n '&-md': {\r\n '@apply w-24 min-h-24': {},\r\n },\r\n },\r\n\r\n '&-title': {\r\n '@apply text-dark-primary': {},\r\n '@apply w-full': {},\r\n '@apply flex flex-row': {},\r\n '@apply items-center': {},\r\n '@apply grow shrink': {},\r\n '&[data-inverted=\"true\"]': {\r\n '@apply text-inverted-dark-primary': {},\r\n },\r\n '*': {\r\n '@apply m-0': {},\r\n '@apply text-inherit': {},\r\n fontSize: 'inherit',\r\n FontFamily: 'inherit',\r\n lineHeight: 'inherit',\r\n },\r\n '&-disabled': {\r\n '@apply text-dark-disabled': {},\r\n '&[data-inverted=\"true\"]': {\r\n '@apply text-inverted-dark-disabled': {},\r\n },\r\n },\r\n '&-sm': {\r\n '@apply gap-16': {},\r\n '@apply text-h4-sm': {},\r\n '&[data-variant=\"alt\"]': {\r\n '@apply gap-12': {},\r\n },\r\n },\r\n '&-md': {\r\n '@apply gap-16': {},\r\n '@apply text-h4-md': {},\r\n '&[data-variant=\"alt\"]': {\r\n '@apply gap-12': {},\r\n },\r\n },\r\n '&-lg': {\r\n '@apply gap-16': {},\r\n '&[data-variant=\"alt\"]': {\r\n '@apply gap-16': {},\r\n '@apply text-h3-md': {},\r\n },\r\n },\r\n '&-divider': {\r\n '@apply border-divider': {},\r\n '&[data-inverted=\"true\"]': {\r\n '@apply border-inverted-divider': {},\r\n },\r\n },\r\n },\r\n\r\n '&:focus-visible': {\r\n '@apply outline-0': {},\r\n },\r\n '&[aria-disabled=\"true\"]': {\r\n '@apply text-dark-disabled': {},\r\n '@apply cursor-default': {},\r\n '*': {\r\n '@apply cursor-default': {},\r\n },\r\n '&[data-inverted=\"true\"]': {\r\n '@apply text-inverted-dark-disabled': {},\r\n },\r\n },\r\n '&-sm': {\r\n '@apply gap-16': {},\r\n '@apply h-32': {},\r\n '&[data-variant=\"alt\"]': {\r\n '@apply gap-12': {},\r\n },\r\n '&[data-variant=\"default\"]': {\r\n '@apply min-h-40': {},\r\n },\r\n },\r\n '&-md': {\r\n '@apply gap-16': {},\r\n '&[data-variant=\"alt\"]': {\r\n '@apply gap-12': {},\r\n },\r\n '&[data-variant=\"default\"]': {\r\n '@apply min-h-56': {},\r\n },\r\n },\r\n '&-lg': {\r\n '@apply gap-16': {},\r\n '.sk-disclosure-header-icon': {\r\n '@apply w-32 min-h-32': {},\r\n },\r\n '&[data-variant=\"alt\"]': {\r\n '@apply gap-16': {},\r\n },\r\n },\r\n },\r\n '&[data-variant=\"alt\"]': {\r\n '.sk-disclosure-header': {\r\n '@apply py-0': {},\r\n '@apply h-32': {},\r\n },\r\n },\r\n '&-label': {\r\n '@apply shrink-0': {},\r\n },\r\n\r\n '&-md': {\r\n '&[data-variant=\"default\"]': {\r\n '.sk-disclosure-header': {\r\n '@apply py-8': {},\r\n '@apply min-h-56': {},\r\n },\r\n '.sk-disclosure-header-button': {\r\n '@apply w-40 h-40': {},\r\n },\r\n },\r\n },\r\n\r\n '&-body': {\r\n '&[data-size=\"sm\"]': {\r\n '@apply pr-12': {},\r\n },\r\n '&[data-size=\"md\"]': {\r\n '@apply pr-12': {},\r\n },\r\n '&[data-size=\"lg\"]': {\r\n '@apply pr-16': {},\r\n },\r\n '@apply text-base': {},\r\n '@apply flex flex-col': {},\r\n '@apply mb-32': {},\r\n '@apply mr-32': {},\r\n '@apply gap-8': {},\r\n '@apply py-0': {},\r\n transitionProperty: 'height, opacity, padding, margin',\r\n\r\n transitionDuration: '180ms',\r\n\r\n '&[aria-hidden=\"true\"]': {\r\n '@apply my-0 overflow-hidden max-h-0 opacity-0': {},\r\n },\r\n\r\n '&[aria-hidden=\"false\"]': {\r\n '@apply block opacity-100': {},\r\n },\r\n\r\n '&[data-variant=\"alt\"]': {\r\n '@apply mt-24': {},\r\n '&[data-size=\"sm\"]': {\r\n '@apply pr-12': {},\r\n },\r\n '&[data-size=\"md\"]': {\r\n '@apply pr-12': {},\r\n },\r\n '&[data-size=\"lg\"]': {\r\n '@apply pr-16': {},\r\n },\r\n '&[data-has-icon=\"true\"]': {\r\n '&[data-size=\"sm\"]': {\r\n '@apply ml-32': {},\r\n },\r\n '&[data-size=\"md\"]': {\r\n '@apply ml-36': {},\r\n },\r\n '&[data-size=\"lg\"]': {\r\n '@apply ml-48': {},\r\n },\r\n },\r\n },\r\n },\r\n },\r\n '.sk-accordion': {\r\n '&-item': {\r\n '.sk-disclosure': {\r\n transitionProperty: 'margin',\r\n transitionDuration: '180ms',\r\n '@apply border-b-1 border-divider': {},\r\n '&[data-inverted=\"true\"]': {\r\n '@apply border-inverted-divider': {},\r\n },\r\n },\r\n\r\n '&:last-child .sk-disclosure': {\r\n '@apply border-b-transparent': {},\r\n },\r\n },\r\n },\r\n});\r\n"],"names":["Accordion","fontSize","FontFamily","lineHeight","transitionProperty","transitionDuration"],"mappings":";;;;+BAAaA;;;eAAAA;;;AAAN,MAAMA,YAAY,IAAO,CAAA;QAC9B,kBAAkB;YAChB,oBAAoB,CAAC;YACrB,8BAA8B,CAAC;YAC/B,2BAA2B;gBACzB,uCAAuC,CAAC;YAC1C;YACA,UAAU;gBACR,2BAA2B,CAAC;YAC9B;YACA,YAAY;gBACV,eAAe,CAAC;gBAChB,kCAAkC,CAAC;gBACnC,yBAAyB,CAAC;gBAC1B,uCAAuC,CAAC;gBACxC,iBAAiB,CAAC;gBAClB,UAAU;oBACR,oBAAoB,CAAC;oBACrB,QAAQ;wBACN,wBAAwB,CAAC;oBAC3B;oBACA,QAAQ;wBACN,wBAAwB,CAAC;oBAC3B;gBACF;gBAEA,WAAW;oBACT,4BAA4B,CAAC;oBAC7B,iBAAiB,CAAC;oBAClB,wBAAwB,CAAC;oBACzB,uBAAuB,CAAC;oBACxB,sBAAsB,CAAC;oBACvB,2BAA2B;wBACzB,qCAAqC,CAAC;oBACxC;oBACA,KAAK;wBACH,cAAc,CAAC;wBACf,uBAAuB,CAAC;wBACxBC,UAAU;wBACVC,YAAY;wBACZC,YAAY;oBACd;oBACA,cAAc;wBACZ,6BAA6B,CAAC;wBAC9B,2BAA2B;4BACzB,sCAAsC,CAAC;wBACzC;oBACF;oBACA,QAAQ;wBACN,iBAAiB,CAAC;wBAClB,qBAAqB,CAAC;wBACtB,yBAAyB;4BACvB,iBAAiB,CAAC;wBACpB;oBACF;oBACA,QAAQ;wBACN,iBAAiB,CAAC;wBAClB,qBAAqB,CAAC;wBACtB,yBAAyB;4BACvB,iBAAiB,CAAC;wBACpB;oBACF;oBACA,QAAQ;wBACN,iBAAiB,CAAC;wBAClB,yBAAyB;4BACvB,iBAAiB,CAAC;4BAClB,qBAAqB,CAAC;wBACxB;oBACF;oBACA,aAAa;wBACX,yBAAyB,CAAC;wBAC1B,2BAA2B;4BACzB,kCAAkC,CAAC;wBACrC;oBACF;gBACF;gBAEA,mBAAmB;oBACjB,oBAAoB,CAAC;gBACvB;gBACA,2BAA2B;oBACzB,6BAA6B,CAAC;oBAC9B,yBAAyB,CAAC;oBAC1B,KAAK;wBACH,yBAAyB,CAAC;oBAC5B;oBACA,2BAA2B;wBACzB,sCAAsC,CAAC;oBACzC;gBACF;gBACA,QAAQ;oBACN,iBAAiB,CAAC;oBAClB,eAAe,CAAC;oBAChB,yBAAyB;wBACvB,iBAAiB,CAAC;oBACpB;oBACA,6BAA6B;wBAC3B,mBAAmB,CAAC;oBACtB;gBACF;gBACA,QAAQ;oBACN,iBAAiB,CAAC;oBAClB,yBAAyB;wBACvB,iBAAiB,CAAC;oBACpB;oBACA,6BAA6B;wBAC3B,mBAAmB,CAAC;oBACtB;gBACF;gBACA,QAAQ;oBACN,iBAAiB,CAAC;oBAClB,8BAA8B;wBAC5B,wBAAwB,CAAC;oBAC3B;oBACA,yBAAyB;wBACvB,iBAAiB,CAAC;oBACpB;gBACF;YACF;YACA,yBAAyB;gBACvB,yBAAyB;oBACvB,eAAe,CAAC;oBAChB,eAAe,CAAC;gBAClB;YACF;YACA,WAAW;gBACT,mBAAmB,CAAC;YACtB;YAEA,QAAQ;gBACN,6BAA6B;oBAC3B,yBAAyB;wBACvB,eAAe,CAAC;wBAChB,mBAAmB,CAAC;oBACtB;oBACA,gCAAgC;wBAC9B,oBAAoB,CAAC;oBACvB;gBACF;YACF;YAEA,UAAU;gBACR,qBAAqB;oBACnB,gBAAgB,CAAC;gBACnB;gBACA,qBAAqB;oBACnB,gBAAgB,CAAC;gBACnB;gBACA,qBAAqB;oBACnB,gBAAgB,CAAC;gBACnB;gBACA,oBAAoB,CAAC;gBACrB,wBAAwB,CAAC;gBACzB,gBAAgB,CAAC;gBACjB,gBAAgB,CAAC;gBACjB,gBAAgB,CAAC;gBACjB,eAAe,CAAC;gBAChBC,oBAAoB;gBAEpBC,oBAAoB;gBAEpB,yBAAyB;oBACvB,iDAAiD,CAAC;gBACpD;gBAEA,0BAA0B;oBACxB,4BAA4B,CAAC;gBAC/B;gBAEA,yBAAyB;oBACvB,gBAAgB,CAAC;oBACjB,qBAAqB;wBACnB,gBAAgB,CAAC;oBACnB;oBACA,qBAAqB;wBACnB,gBAAgB,CAAC;oBACnB;oBACA,qBAAqB;wBACnB,gBAAgB,CAAC;oBACnB;oBACA,2BAA2B;wBACzB,qBAAqB;4BACnB,gBAAgB,CAAC;wBACnB;wBACA,qBAAqB;4BACnB,gBAAgB,CAAC;wBACnB;wBACA,qBAAqB;4BACnB,gBAAgB,CAAC;wBACnB;oBACF;gBACF;YACF;QACF;QACA,iBAAiB;YACf,UAAU;gBACR,kBAAkB;oBAChBD,oBAAoB;oBACpBC,oBAAoB;oBACpB,oCAAoC,CAAC;oBACrC,2BAA2B;wBACzB,kCAAkC,CAAC;oBACrC;gBACF;gBAEA,+BAA+B;oBAC7B,+BAA+B,CAAC;gBAClC;YACF;QACF;IACF,CAAA"}
package/dist/cjs/components/forms.js CHANGED
@@ -30,6 +30,15 @@ const Forms = ()=>({
30
30
  '.sk-form-helper-text, .sk-form-error-message': {
31
31
  '@apply font-normal': {},
32
32
  '@apply text-small': {}
33
+ },
34
+ '.sk-form-error-message': {
35
+ '@apply text-error': {},
36
+ '@apply flex items-start gap-8': {},
37
+ '@apply self-stretch': {}
38
+ },
39
+ '.sk-form-error-message-icon': {
40
+ '@apply shrink-0': {},
41
+ '@apply pt-1': {}
33
42
  }
34
43
  });
35
44
 
package/dist/cjs/components/forms.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/forms.ts"],"sourcesContent":["export const Forms = () => ({\r\n '.sk-form-control': {\r\n '@apply flex flex-col gap-8 w-fit': {},\r\n },\r\n\r\n '.sk-form-label': {\r\n '@apply font-bold': {},\r\n '&-sm': {\r\n '@apply text-label-small': {},\r\n },\r\n '&-md': {\r\n '@apply text-label-medium': {},\r\n },\r\n '&-lg': {\r\n '@apply text-label-large': {},\r\n },\r\n },\r\n\r\n 'legend.sk-form-label': {\r\n display: 'contents',\r\n },\r\n\r\n '.sk-form-helper-text, .sk-form-error-message': {\r\n '@apply font-normal': {},\r\n '@apply text-small': {},\r\n },\r\n});\r\n"],"names":["Forms","display"],"mappings":";;;;+BAAaA;;;eAAAA;;;AAAN,MAAMA,QAAQ,IAAO,CAAA;QAC1B,oBAAoB;YAClB,oCAAoC,CAAC;QACvC;QAEA,kBAAkB;YAChB,oBAAoB,CAAC;YACrB,QAAQ;gBACN,2BAA2B,CAAC;YAC9B;YACA,QAAQ;gBACN,4BAA4B,CAAC;YAC/B;YACA,QAAQ;gBACN,2BAA2B,CAAC;YAC9B;QACF;QAEA,wBAAwB;YACtBC,SAAS;QACX;QAEA,gDAAgD;YAC9C,sBAAsB,CAAC;YACvB,qBAAqB,CAAC;QACxB;IACF,CAAA"}
1
+ {"version":3,"sources":["../../../src/components/forms.ts"],"sourcesContent":["export const Forms = () => ({\r\n '.sk-form-control': {\r\n '@apply flex flex-col gap-8 w-fit': {},\r\n },\r\n\r\n '.sk-form-label': {\r\n '@apply font-bold': {},\r\n '&-sm': {\r\n '@apply text-label-small': {},\r\n },\r\n '&-md': {\r\n '@apply text-label-medium': {},\r\n },\r\n '&-lg': {\r\n '@apply text-label-large': {},\r\n },\r\n },\r\n\r\n 'legend.sk-form-label': {\r\n display: 'contents',\r\n },\r\n\r\n '.sk-form-helper-text, .sk-form-error-message': {\r\n '@apply font-normal': {},\r\n '@apply text-small': {},\r\n },\r\n '.sk-form-error-message': {\r\n '@apply text-error': {},\r\n '@apply flex items-start gap-8': {},\r\n '@apply self-stretch': {},\r\n },\r\n '.sk-form-error-message-icon': {\r\n '@apply shrink-0': {},\r\n '@apply pt-1': {},\r\n },\r\n});\r\n"],"names":["Forms","display"],"mappings":";;;;+BAAaA;;;eAAAA;;;AAAN,MAAMA,QAAQ,IAAO,CAAA;QAC1B,oBAAoB;YAClB,oCAAoC,CAAC;QACvC;QAEA,kBAAkB;YAChB,oBAAoB,CAAC;YACrB,QAAQ;gBACN,2BAA2B,CAAC;YAC9B;YACA,QAAQ;gBACN,4BAA4B,CAAC;YAC/B;YACA,QAAQ;gBACN,2BAA2B,CAAC;YAC9B;QACF;QAEA,wBAAwB;YACtBC,SAAS;QACX;QAEA,gDAAgD;YAC9C,sBAAsB,CAAC;YACvB,qBAAqB,CAAC;QACxB;QACA,0BAA0B;YACxB,qBAAqB,CAAC;YACtB,iCAAiC,CAAC;YAClC,uBAAuB,CAAC;QAC1B;QACA,+BAA+B;YAC7B,mBAAmB,CAAC;YACpB,eAAe,CAAC;QAClB;IACF,CAAA"}
package/dist/cjs/components/progress-bar.js CHANGED
@@ -29,6 +29,12 @@ const ProgressBar = (colors)=>({
29
29
  '.sk-progress-bar-fill': {
30
30
  [`@apply bg-primary-surface`]: {}
31
31
  }
32
+ },
33
+ '&-sm': {
34
+ '@apply h-[4px]': {}
35
+ },
36
+ '&-md': {
37
+ '@apply h-[8px]': {}
32
38
  }
33
39
  }
34
40
  });
package/dist/cjs/components/progress-bar.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/progress-bar.ts"],"sourcesContent":["export const ProgressBar = (colors: string[]) => ({\r\n '.sk-progress-bar': {\r\n '@apply flex h-4 rounded-circular bg-background-color-mixin-2': {},\r\n\r\n '&-fill': {\r\n '@apply rounded-circular': {},\r\n },\r\n\r\n ...colors.reduce(\r\n (styles, color) => ({\r\n ...styles,\r\n [`&[data-color=\"${color}\"]`]: {\r\n '.sk-progress-bar-fill': {\r\n [`@apply bg-${color}-surface-primary`]: {},\r\n },\r\n\r\n '&[data-accent=\"true\"]': {\r\n [`@apply bg-inverted-${color}-surface-primary`]: {},\r\n },\r\n },\r\n }),\r\n {}\r\n ),\r\n\r\n \"&[data-color='tertiary']\": {\r\n '.sk-progress-bar-fill': {\r\n [`@apply bg-primary-surface`]: {},\r\n },\r\n },\r\n },\r\n});\r\n"],"names":["ProgressBar","colors","reduce","styles","color"],"mappings":";;;;+BAAaA;;;eAAAA;;;AAAN,MAAMA,cAAc,CAACC,SAAsB,CAAA;QAChD,oBAAoB;YAClB,gEAAgE,CAAC;YAEjE,UAAU;gBACR,2BAA2B,CAAC;YAC9B;YAEA,GAAGA,OAAOC,MAAM,CACd,CAACC,QAAQC,QAAW,CAAA;oBAClB,GAAGD,MAAM;oBACT,CAAC,CAAC,cAAc,EAAEC,MAAM,EAAE,CAAC,CAAC,EAAE;wBAC5B,yBAAyB;4BACvB,CAAC,CAAC,UAAU,EAAEA,MAAM,gBAAgB,CAAC,CAAC,EAAE,CAAC;wBAC3C;wBAEA,yBAAyB;4BACvB,CAAC,CAAC,mBAAmB,EAAEA,MAAM,gBAAgB,CAAC,CAAC,EAAE,CAAC;wBACpD;oBACF;gBACF,CAAA,GACA,CAAC,EACF;YAED,4BAA4B;gBAC1B,yBAAyB;oBACvB,CAAC,CAAC,yBAAyB,CAAC,CAAC,EAAE,CAAC;gBAClC;YACF;QACF;IACF,CAAA"}
1
+ {"version":3,"sources":["../../../src/components/progress-bar.ts"],"sourcesContent":["export const ProgressBar = (colors: string[]) => ({\r\n '.sk-progress-bar': {\r\n '@apply flex h-4 rounded-circular bg-background-color-mixin-2': {},\r\n\r\n '&-fill': {\r\n '@apply rounded-circular': {},\r\n },\r\n\r\n ...colors.reduce(\r\n (styles, color) => ({\r\n ...styles,\r\n [`&[data-color=\"${color}\"]`]: {\r\n '.sk-progress-bar-fill': {\r\n [`@apply bg-${color}-surface-primary`]: {},\r\n },\r\n\r\n '&[data-accent=\"true\"]': {\r\n [`@apply bg-inverted-${color}-surface-primary`]: {},\r\n },\r\n },\r\n }),\r\n {}\r\n ),\r\n\r\n \"&[data-color='tertiary']\": {\r\n '.sk-progress-bar-fill': {\r\n [`@apply bg-primary-surface`]: {},\r\n },\r\n },\r\n '&-sm': {\r\n '@apply h-[4px]': {},\r\n },\r\n '&-md': {\r\n '@apply h-[8px]': {},\r\n },\r\n },\r\n});\r\n"],"names":["ProgressBar","colors","reduce","styles","color"],"mappings":";;;;+BAAaA;;;eAAAA;;;AAAN,MAAMA,cAAc,CAACC,SAAsB,CAAA;QAChD,oBAAoB;YAClB,gEAAgE,CAAC;YAEjE,UAAU;gBACR,2BAA2B,CAAC;YAC9B;YAEA,GAAGA,OAAOC,MAAM,CACd,CAACC,QAAQC,QAAW,CAAA;oBAClB,GAAGD,MAAM;oBACT,CAAC,CAAC,cAAc,EAAEC,MAAM,EAAE,CAAC,CAAC,EAAE;wBAC5B,yBAAyB;4BACvB,CAAC,CAAC,UAAU,EAAEA,MAAM,gBAAgB,CAAC,CAAC,EAAE,CAAC;wBAC3C;wBAEA,yBAAyB;4BACvB,CAAC,CAAC,mBAAmB,EAAEA,MAAM,gBAAgB,CAAC,CAAC,EAAE,CAAC;wBACpD;oBACF;gBACF,CAAA,GACA,CAAC,EACF;YAED,4BAA4B;gBAC1B,yBAAyB;oBACvB,CAAC,CAAC,yBAAyB,CAAC,CAAC,EAAE,CAAC;gBAClC;YACF;YACA,QAAQ;gBACN,kBAAkB,CAAC;YACrB;YACA,QAAQ;gBACN,kBAAkB,CAAC;YACrB;QACF;IACF,CAAA"}
package/dist/esm/components/accordion.js CHANGED
@@ -1,120 +1,140 @@
1
1
  export const Accordion = ()=>({
2
2
  '.sk-disclosure': {
3
+ '@apply mt-6 mb-8': {},
4
+ '@apply text-dark-secondary': {},
5
+ '&[data-inverted="true"]': {
6
+ '@apply text-inverted-dark-secondary': {}
7
+ },
3
8
  '&-icon': {
4
9
  '@apply flex self-center': {}
5
10
  },
6
11
  '&-header': {
7
- '@apply mt-6 mb-8': {},
8
- '@apply flex flex-col text-left': {},
12
+ '@apply py-8': {},
13
+ '@apply flex flex-row text-left': {},
9
14
  '@apply cursor-pointer': {},
10
- '*': {
11
- '@apply cursor-pointer': {}
15
+ '@apply items-center justify-between': {},
16
+ '@apply gap-16': {},
17
+ '&-icon': {
18
+ '@apply w-32 h-32': {},
19
+ '&-sm': {
20
+ '@apply w-20 min-h-20': {}
21
+ },
22
+ '&-md': {
23
+ '@apply w-24 min-h-24': {}
24
+ }
25
+ },
26
+ '&-title': {
27
+ '@apply text-dark-primary': {},
28
+ '@apply w-full': {},
29
+ '@apply flex flex-row': {},
30
+ '@apply items-center': {},
31
+ '@apply grow shrink': {},
32
+ '&[data-inverted="true"]': {
33
+ '@apply text-inverted-dark-primary': {}
34
+ },
35
+ '*': {
36
+ '@apply m-0': {},
37
+ '@apply text-inherit': {},
38
+ fontSize: 'inherit',
39
+ FontFamily: 'inherit',
40
+ lineHeight: 'inherit'
41
+ },
42
+ '&-disabled': {
43
+ '@apply text-dark-disabled': {},
44
+ '&[data-inverted="true"]': {
45
+ '@apply text-inverted-dark-disabled': {}
46
+ }
47
+ },
48
+ '&-sm': {
49
+ '@apply gap-16': {},
50
+ '@apply text-h4-sm': {},
51
+ '&[data-variant="alt"]': {
52
+ '@apply gap-12': {}
53
+ }
54
+ },
55
+ '&-md': {
56
+ '@apply gap-16': {},
57
+ '@apply text-h4-md': {},
58
+ '&[data-variant="alt"]': {
59
+ '@apply gap-12': {}
60
+ }
61
+ },
62
+ '&-lg': {
63
+ '@apply gap-16': {},
64
+ '&[data-variant="alt"]': {
65
+ '@apply gap-16': {},
66
+ '@apply text-h3-md': {}
67
+ }
68
+ },
69
+ '&-divider': {
70
+ '@apply border-divider': {},
71
+ '&[data-inverted="true"]': {
72
+ '@apply border-inverted-divider': {}
73
+ }
74
+ }
12
75
  },
13
76
  '&:focus-visible': {
14
77
  '@apply outline-0': {}
15
78
  },
16
- '&-icon': {
17
- '@apply ml-auto': {},
18
- '@apply text-dark-secondary': {},
19
- svg: {
20
- '@apply w-20 h-20': {}
21
- }
22
- },
23
- '&[data-disabled="true"]': {
79
+ '&[aria-disabled="true"]': {
24
80
  '@apply text-dark-disabled': {},
25
- '.sk-disclosure-title': {
26
- '@apply text-dark-disabled': {}
27
- },
28
81
  '@apply cursor-default': {},
29
82
  '*': {
30
83
  '@apply cursor-default': {}
84
+ },
85
+ '&[data-inverted="true"]': {
86
+ '@apply text-inverted-dark-disabled': {}
31
87
  }
32
- }
33
- },
34
- '&-label': {
35
- '@apply shrink-0': {}
36
- },
37
- '&-toggle': {
38
- '@apply flex items-center justify-between': {},
39
- '@apply gap-16': {},
40
- '.sk-icon': {
41
- '@apply w-32 h-32': {}
42
- }
43
- },
44
- '&-title': {
45
- '@apply text-dark-primary': {},
46
- '&-wrapper': {
47
- '@apply w-full': {},
48
- '@apply flex flex-row': {},
49
- '@apply items-center': {}
50
- }
51
- },
52
- '&-sm': {
53
- '.sk-disclosure-title': {
54
- '@apply text-h4-sm font-bold': {},
55
- '&-wrapper': {
88
+ },
89
+ '&-sm': {
90
+ '@apply gap-16': {},
91
+ '@apply h-32': {},
92
+ '&[data-variant="alt"]': {
56
93
  '@apply gap-12': {}
94
+ },
95
+ '&[data-variant="default"]': {
96
+ '@apply min-h-40': {}
57
97
  }
58
98
  },
59
- '.sk-disclosure-toggle': {
60
- '@apply gap-12': {},
61
- '.sk-icon': {
62
- '@apply w-20 min-h-20': {}
99
+ '&-md': {
100
+ '@apply gap-16': {},
101
+ '&[data-variant="alt"]': {
102
+ '@apply gap-12': {}
103
+ },
104
+ '&[data-variant="default"]': {
105
+ '@apply min-h-56': {}
63
106
  }
64
107
  },
65
- '.sk-disclosure-support': {
66
- '@apply text-small': {}
67
- },
68
- '&[data-variant="default"]': {
69
- '.sk-disclosure-toggle': {
70
- '@apply py-4': {},
71
- '@apply min-h-40': {}
72
- },
108
+ '&-lg': {
109
+ '@apply gap-16': {},
73
110
  '.sk-disclosure-header-icon': {
74
- '@apply w-32 h-32': {}
111
+ '@apply w-32 min-h-32': {}
112
+ },
113
+ '&[data-variant="alt"]': {
114
+ '@apply gap-16': {}
75
115
  }
76
- },
77
- '&[data-variant="alt"]': {}
116
+ }
117
+ },
118
+ '&[data-variant="alt"]': {
119
+ '.sk-disclosure-header': {
120
+ '@apply py-0': {},
121
+ '@apply h-32': {}
122
+ }
123
+ },
124
+ '&-label': {
125
+ '@apply shrink-0': {}
78
126
  },
79
127
  '&-md': {
80
- '.sk-disclosure-title': {
81
- '@apply text-h4-md font-bold': {},
82
- '&-wrapper': {
83
- '@apply gap-12': {}
84
- }
85
- },
86
- '.sk-disclosure-toggle': {
87
- '@apply gap-12': {},
88
- '.sk-icon': {
89
- '@apply w-24 min-h-24': {}
90
- }
91
- },
92
- '.sk-disclosure-support': {
93
- '@apply text-body': {}
94
- },
95
128
  '&[data-variant="default"]': {
96
- '.sk-disclosure-toggle': {
129
+ '.sk-disclosure-header': {
97
130
  '@apply py-8': {},
98
131
  '@apply min-h-56': {}
99
132
  },
100
- '.sk-disclosure-header-icon': {
133
+ '.sk-disclosure-header-button': {
101
134
  '@apply w-40 h-40': {}
102
135
  }
103
136
  }
104
137
  },
105
- '&-lg': {
106
- '&[data-variant="alt"]': {
107
- '.sk-disclosure-support': {
108
- '@apply text-large': {}
109
- },
110
- '.sk-disclosure-title': {
111
- '@apply text-h3-md font-bold': {},
112
- '&-wrapper': {
113
- '@apply gap-16': {}
114
- }
115
- }
116
- }
117
- },
118
138
  '&-body': {
119
139
  '&[data-size="sm"]': {
120
140
  '@apply pr-12': {}
@@ -131,13 +151,13 @@ export const Accordion = ()=>({
131
151
  '@apply mr-32': {},
132
152
  '@apply gap-8': {},
133
153
  '@apply py-0': {},
134
- transitionProperty: 'visibility, height, opacity, padding, margin',
154
+ transitionProperty: 'height, opacity, padding, margin',
135
155
  transitionDuration: '180ms',
136
- '&[aria-hidden="true"], &[data-hidden="true"]': {
137
- '@apply my-0 invisible max-h-0 opacity-0': {}
156
+ '&[aria-hidden="true"]': {
157
+ '@apply my-0 overflow-hidden max-h-0 opacity-0': {}
138
158
  },
139
- '&[aria-hidden="false"], &[data-hidden="false"]': {
140
- '@apply block opacity-100 visible': {}
159
+ '&[aria-hidden="false"]': {
160
+ '@apply block opacity-100': {}
141
161
  },
142
162
  '&[data-variant="alt"]': {
143
163
  '@apply mt-24': {},
@@ -169,33 +189,15 @@ export const Accordion = ()=>({
169
189
  '.sk-disclosure': {
170
190
  transitionProperty: 'margin',
171
191
  transitionDuration: '180ms',
172
- '@apply border-b-1 border-divider': {}
192
+ '@apply border-b-1 border-divider': {},
193
+ '&[data-inverted="true"]': {
194
+ '@apply border-inverted-divider': {}
195
+ }
173
196
  },
174
197
  '&:last-child .sk-disclosure': {
175
198
  '@apply border-b-transparent': {}
176
199
  }
177
200
  }
178
- },
179
- '&[data-inverted="true"]': {
180
- '&.sk-disclosure': {
181
- '&-icon': {
182
- '@apply text-inverted-dark-secondary': {}
183
- },
184
- '&[data-disabled="true"]': {
185
- '@apply text-inverted-dark-disabled': {},
186
- '.sk-disclosure-title': {
187
- '@apply text-inverted-dark-disabled': {}
188
- }
189
- },
190
- '&-title': {
191
- '@apply text-inverted-dark-primary': {}
192
- }
193
- },
194
- '&.sk-accordion': {
195
- '&-item': {
196
- '@apply border-inverted-divider': {}
197
- }
198
- }
199
201
  }
200
202
  });
201
203
 
package/dist/esm/components/accordion.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/accordion.ts"],"sourcesContent":["export const Accordion = () => ({\r\n '.sk-disclosure': {\r\n '&-icon': {\r\n '@apply flex self-center': {},\r\n },\r\n '&-header': {\r\n '@apply mt-6 mb-8': {},\r\n '@apply flex flex-col text-left': {},\r\n '@apply cursor-pointer': {},\r\n '*': {\r\n '@apply cursor-pointer': {},\r\n },\r\n '&:focus-visible': {\r\n '@apply outline-0': {},\r\n },\r\n\r\n '&-icon': {\r\n '@apply ml-auto': {},\r\n '@apply text-dark-secondary': {},\r\n svg: {\r\n '@apply w-20 h-20': {},\r\n },\r\n },\r\n '&[data-disabled=\"true\"]': {\r\n '@apply text-dark-disabled': {},\r\n '.sk-disclosure-title': {\r\n '@apply text-dark-disabled': {},\r\n },\r\n '@apply cursor-default': {},\r\n '*': {\r\n '@apply cursor-default': {},\r\n },\r\n },\r\n },\r\n '&-label': {\r\n '@apply shrink-0': {},\r\n },\r\n '&-toggle': {\r\n '@apply flex items-center justify-between': {},\r\n '@apply gap-16': {},\r\n '.sk-icon': {\r\n '@apply w-32 h-32': {},\r\n },\r\n },\r\n '&-title': {\r\n '@apply text-dark-primary': {},\r\n '&-wrapper': {\r\n '@apply w-full': {},\r\n '@apply flex flex-row': {},\r\n '@apply items-center': {},\r\n },\r\n },\r\n\r\n '&-sm': {\r\n '.sk-disclosure-title': {\r\n '@apply text-h4-sm font-bold': {},\r\n '&-wrapper': {\r\n '@apply gap-12': {},\r\n },\r\n },\r\n '.sk-disclosure-toggle': {\r\n '@apply gap-12': {},\r\n '.sk-icon': {\r\n '@apply w-20 min-h-20': {},\r\n },\r\n },\r\n '.sk-disclosure-support': {\r\n '@apply text-small': {},\r\n },\r\n '&[data-variant=\"default\"]': {\r\n '.sk-disclosure-toggle': {\r\n '@apply py-4': {},\r\n '@apply min-h-40': {},\r\n },\r\n '.sk-disclosure-header-icon': {\r\n '@apply w-32 h-32': {},\r\n },\r\n },\r\n '&[data-variant=\"alt\"]': {},\r\n },\r\n '&-md': {\r\n '.sk-disclosure-title': {\r\n '@apply text-h4-md font-bold': {},\r\n '&-wrapper': {\r\n '@apply gap-12': {},\r\n },\r\n },\r\n '.sk-disclosure-toggle': {\r\n '@apply gap-12': {},\r\n '.sk-icon': {\r\n '@apply w-24 min-h-24': {},\r\n },\r\n },\r\n '.sk-disclosure-support': {\r\n '@apply text-body': {},\r\n },\r\n '&[data-variant=\"default\"]': {\r\n '.sk-disclosure-toggle': {\r\n '@apply py-8': {},\r\n '@apply min-h-56': {},\r\n },\r\n '.sk-disclosure-header-icon': {\r\n '@apply w-40 h-40': {},\r\n },\r\n },\r\n },\r\n '&-lg': {\r\n '&[data-variant=\"alt\"]': {\r\n '.sk-disclosure-support': {\r\n '@apply text-large': {},\r\n },\r\n '.sk-disclosure-title': {\r\n '@apply text-h3-md font-bold': {},\r\n '&-wrapper': {\r\n '@apply gap-16': {},\r\n },\r\n },\r\n },\r\n },\r\n\r\n '&-body': {\r\n '&[data-size=\"sm\"]': {\r\n '@apply pr-12': {},\r\n },\r\n '&[data-size=\"md\"]': {\r\n '@apply pr-12': {},\r\n },\r\n '&[data-size=\"lg\"]': {\r\n '@apply pr-16': {},\r\n },\r\n '@apply text-base': {},\r\n '@apply flex flex-col': {},\r\n '@apply mb-32': {},\r\n '@apply mr-32': {},\r\n '@apply gap-8': {},\r\n '@apply py-0': {},\r\n transitionProperty: 'visibility, height, opacity, padding, margin',\r\n\r\n transitionDuration: '180ms',\r\n\r\n '&[aria-hidden=\"true\"], &[data-hidden=\"true\"]': {\r\n '@apply my-0 invisible max-h-0 opacity-0': {},\r\n },\r\n\r\n '&[aria-hidden=\"false\"], &[data-hidden=\"false\"]': {\r\n '@apply block opacity-100 visible': {},\r\n },\r\n\r\n '&[data-variant=\"alt\"]': {\r\n '@apply mt-24': {},\r\n '&[data-size=\"sm\"]': {\r\n '@apply pr-12': {},\r\n },\r\n '&[data-size=\"md\"]': {\r\n '@apply pr-12': {},\r\n },\r\n '&[data-size=\"lg\"]': {\r\n '@apply pr-16': {},\r\n },\r\n '&[data-has-icon=\"true\"]': {\r\n '&[data-size=\"sm\"]': {\r\n '@apply ml-32': {},\r\n },\r\n '&[data-size=\"md\"]': {\r\n '@apply ml-36': {},\r\n },\r\n '&[data-size=\"lg\"]': {\r\n '@apply ml-48': {},\r\n },\r\n },\r\n },\r\n },\r\n },\r\n '.sk-accordion': {\r\n '&-item': {\r\n '.sk-disclosure': {\r\n transitionProperty: 'margin',\r\n transitionDuration: '180ms',\r\n '@apply border-b-1 border-divider': {},\r\n },\r\n\r\n '&:last-child .sk-disclosure': {\r\n '@apply border-b-transparent': {},\r\n },\r\n },\r\n },\r\n\r\n '&[data-inverted=\"true\"]': {\r\n '&.sk-disclosure': {\r\n '&-icon': {\r\n '@apply text-inverted-dark-secondary': {},\r\n },\r\n\r\n '&[data-disabled=\"true\"]': {\r\n '@apply text-inverted-dark-disabled': {},\r\n '.sk-disclosure-title': {\r\n '@apply text-inverted-dark-disabled': {},\r\n },\r\n },\r\n\r\n '&-title': {\r\n '@apply text-inverted-dark-primary': {},\r\n },\r\n },\r\n '&.sk-accordion': {\r\n '&-item': {\r\n '@apply border-inverted-divider': {},\r\n },\r\n },\r\n },\r\n});\r\n"],"names":["Accordion","svg","transitionProperty","transitionDuration"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../src/components/accordion.ts"],"sourcesContent":["export const Accordion = () => ({\r\n '.sk-disclosure': {\r\n '@apply mt-6 mb-8': {},\r\n '@apply text-dark-secondary': {},\r\n '&[data-inverted=\"true\"]': {\r\n '@apply text-inverted-dark-secondary': {},\r\n },\r\n '&-icon': {\r\n '@apply flex self-center': {},\r\n },\r\n '&-header': {\r\n '@apply py-8': {},\r\n '@apply flex flex-row text-left': {},\r\n '@apply cursor-pointer': {},\r\n '@apply items-center justify-between': {},\r\n '@apply gap-16': {},\r\n '&-icon': {\r\n '@apply w-32 h-32': {},\r\n '&-sm': {\r\n '@apply w-20 min-h-20': {},\r\n },\r\n '&-md': {\r\n '@apply w-24 min-h-24': {},\r\n },\r\n },\r\n\r\n '&-title': {\r\n '@apply text-dark-primary': {},\r\n '@apply w-full': {},\r\n '@apply flex flex-row': {},\r\n '@apply items-center': {},\r\n '@apply grow shrink': {},\r\n '&[data-inverted=\"true\"]': {\r\n '@apply text-inverted-dark-primary': {},\r\n },\r\n '*': {\r\n '@apply m-0': {},\r\n '@apply text-inherit': {},\r\n fontSize: 'inherit',\r\n FontFamily: 'inherit',\r\n lineHeight: 'inherit',\r\n },\r\n '&-disabled': {\r\n '@apply text-dark-disabled': {},\r\n '&[data-inverted=\"true\"]': {\r\n '@apply text-inverted-dark-disabled': {},\r\n },\r\n },\r\n '&-sm': {\r\n '@apply gap-16': {},\r\n '@apply text-h4-sm': {},\r\n '&[data-variant=\"alt\"]': {\r\n '@apply gap-12': {},\r\n },\r\n },\r\n '&-md': {\r\n '@apply gap-16': {},\r\n '@apply text-h4-md': {},\r\n '&[data-variant=\"alt\"]': {\r\n '@apply gap-12': {},\r\n },\r\n },\r\n '&-lg': {\r\n '@apply gap-16': {},\r\n '&[data-variant=\"alt\"]': {\r\n '@apply gap-16': {},\r\n '@apply text-h3-md': {},\r\n },\r\n },\r\n '&-divider': {\r\n '@apply border-divider': {},\r\n '&[data-inverted=\"true\"]': {\r\n '@apply border-inverted-divider': {},\r\n },\r\n },\r\n },\r\n\r\n '&:focus-visible': {\r\n '@apply outline-0': {},\r\n },\r\n '&[aria-disabled=\"true\"]': {\r\n '@apply text-dark-disabled': {},\r\n '@apply cursor-default': {},\r\n '*': {\r\n '@apply cursor-default': {},\r\n },\r\n '&[data-inverted=\"true\"]': {\r\n '@apply text-inverted-dark-disabled': {},\r\n },\r\n },\r\n '&-sm': {\r\n '@apply gap-16': {},\r\n '@apply h-32': {},\r\n '&[data-variant=\"alt\"]': {\r\n '@apply gap-12': {},\r\n },\r\n '&[data-variant=\"default\"]': {\r\n '@apply min-h-40': {},\r\n },\r\n },\r\n '&-md': {\r\n '@apply gap-16': {},\r\n '&[data-variant=\"alt\"]': {\r\n '@apply gap-12': {},\r\n },\r\n '&[data-variant=\"default\"]': {\r\n '@apply min-h-56': {},\r\n },\r\n },\r\n '&-lg': {\r\n '@apply gap-16': {},\r\n '.sk-disclosure-header-icon': {\r\n '@apply w-32 min-h-32': {},\r\n },\r\n '&[data-variant=\"alt\"]': {\r\n '@apply gap-16': {},\r\n },\r\n },\r\n },\r\n '&[data-variant=\"alt\"]': {\r\n '.sk-disclosure-header': {\r\n '@apply py-0': {},\r\n '@apply h-32': {},\r\n },\r\n },\r\n '&-label': {\r\n '@apply shrink-0': {},\r\n },\r\n\r\n '&-md': {\r\n '&[data-variant=\"default\"]': {\r\n '.sk-disclosure-header': {\r\n '@apply py-8': {},\r\n '@apply min-h-56': {},\r\n },\r\n '.sk-disclosure-header-button': {\r\n '@apply w-40 h-40': {},\r\n },\r\n },\r\n },\r\n\r\n '&-body': {\r\n '&[data-size=\"sm\"]': {\r\n '@apply pr-12': {},\r\n },\r\n '&[data-size=\"md\"]': {\r\n '@apply pr-12': {},\r\n },\r\n '&[data-size=\"lg\"]': {\r\n '@apply pr-16': {},\r\n },\r\n '@apply text-base': {},\r\n '@apply flex flex-col': {},\r\n '@apply mb-32': {},\r\n '@apply mr-32': {},\r\n '@apply gap-8': {},\r\n '@apply py-0': {},\r\n transitionProperty: 'height, opacity, padding, margin',\r\n\r\n transitionDuration: '180ms',\r\n\r\n '&[aria-hidden=\"true\"]': {\r\n '@apply my-0 overflow-hidden max-h-0 opacity-0': {},\r\n },\r\n\r\n '&[aria-hidden=\"false\"]': {\r\n '@apply block opacity-100': {},\r\n },\r\n\r\n '&[data-variant=\"alt\"]': {\r\n '@apply mt-24': {},\r\n '&[data-size=\"sm\"]': {\r\n '@apply pr-12': {},\r\n },\r\n '&[data-size=\"md\"]': {\r\n '@apply pr-12': {},\r\n },\r\n '&[data-size=\"lg\"]': {\r\n '@apply pr-16': {},\r\n },\r\n '&[data-has-icon=\"true\"]': {\r\n '&[data-size=\"sm\"]': {\r\n '@apply ml-32': {},\r\n },\r\n '&[data-size=\"md\"]': {\r\n '@apply ml-36': {},\r\n },\r\n '&[data-size=\"lg\"]': {\r\n '@apply ml-48': {},\r\n },\r\n },\r\n },\r\n },\r\n },\r\n '.sk-accordion': {\r\n '&-item': {\r\n '.sk-disclosure': {\r\n transitionProperty: 'margin',\r\n transitionDuration: '180ms',\r\n '@apply border-b-1 border-divider': {},\r\n '&[data-inverted=\"true\"]': {\r\n '@apply border-inverted-divider': {},\r\n },\r\n },\r\n\r\n '&:last-child .sk-disclosure': {\r\n '@apply border-b-transparent': {},\r\n },\r\n },\r\n },\r\n});\r\n"],"names":["Accordion","fontSize","FontFamily","lineHeight","transitionProperty","transitionDuration"],"mappings":"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"}
package/dist/esm/components/forms.js CHANGED
@@ -20,6 +20,15 @@ export const Forms = ()=>({
20
20
  '.sk-form-helper-text, .sk-form-error-message': {
21
21
  '@apply font-normal': {},
22
22
  '@apply text-small': {}
23
+ },
24
+ '.sk-form-error-message': {
25
+ '@apply text-error': {},
26
+ '@apply flex items-start gap-8': {},
27
+ '@apply self-stretch': {}
28
+ },
29
+ '.sk-form-error-message-icon': {
30
+ '@apply shrink-0': {},
31
+ '@apply pt-1': {}
23
32
  }
24
33
  });
25
34
 
package/dist/esm/components/forms.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/forms.ts"],"sourcesContent":["export const Forms = () => ({\r\n '.sk-form-control': {\r\n '@apply flex flex-col gap-8 w-fit': {},\r\n },\r\n\r\n '.sk-form-label': {\r\n '@apply font-bold': {},\r\n '&-sm': {\r\n '@apply text-label-small': {},\r\n },\r\n '&-md': {\r\n '@apply text-label-medium': {},\r\n },\r\n '&-lg': {\r\n '@apply text-label-large': {},\r\n },\r\n },\r\n\r\n 'legend.sk-form-label': {\r\n display: 'contents',\r\n },\r\n\r\n '.sk-form-helper-text, .sk-form-error-message': {\r\n '@apply font-normal': {},\r\n '@apply text-small': {},\r\n },\r\n});\r\n"],"names":["Forms","display"],"mappings":"AAAA,OAAO,MAAMA,QAAQ,IAAO,CAAA;QAC1B,oBAAoB;YAClB,oCAAoC,CAAC;QACvC;QAEA,kBAAkB;YAChB,oBAAoB,CAAC;YACrB,QAAQ;gBACN,2BAA2B,CAAC;YAC9B;YACA,QAAQ;gBACN,4BAA4B,CAAC;YAC/B;YACA,QAAQ;gBACN,2BAA2B,CAAC;YAC9B;QACF;QAEA,wBAAwB;YACtBC,SAAS;QACX;QAEA,gDAAgD;YAC9C,sBAAsB,CAAC;YACvB,qBAAqB,CAAC;QACxB;IACF,CAAA,EAAG"}
1
+ {"version":3,"sources":["../../../src/components/forms.ts"],"sourcesContent":["export const Forms = () => ({\r\n '.sk-form-control': {\r\n '@apply flex flex-col gap-8 w-fit': {},\r\n },\r\n\r\n '.sk-form-label': {\r\n '@apply font-bold': {},\r\n '&-sm': {\r\n '@apply text-label-small': {},\r\n },\r\n '&-md': {\r\n '@apply text-label-medium': {},\r\n },\r\n '&-lg': {\r\n '@apply text-label-large': {},\r\n },\r\n },\r\n\r\n 'legend.sk-form-label': {\r\n display: 'contents',\r\n },\r\n\r\n '.sk-form-helper-text, .sk-form-error-message': {\r\n '@apply font-normal': {},\r\n '@apply text-small': {},\r\n },\r\n '.sk-form-error-message': {\r\n '@apply text-error': {},\r\n '@apply flex items-start gap-8': {},\r\n '@apply self-stretch': {},\r\n },\r\n '.sk-form-error-message-icon': {\r\n '@apply shrink-0': {},\r\n '@apply pt-1': {},\r\n },\r\n});\r\n"],"names":["Forms","display"],"mappings":"AAAA,OAAO,MAAMA,QAAQ,IAAO,CAAA;QAC1B,oBAAoB;YAClB,oCAAoC,CAAC;QACvC;QAEA,kBAAkB;YAChB,oBAAoB,CAAC;YACrB,QAAQ;gBACN,2BAA2B,CAAC;YAC9B;YACA,QAAQ;gBACN,4BAA4B,CAAC;YAC/B;YACA,QAAQ;gBACN,2BAA2B,CAAC;YAC9B;QACF;QAEA,wBAAwB;YACtBC,SAAS;QACX;QAEA,gDAAgD;YAC9C,sBAAsB,CAAC;YACvB,qBAAqB,CAAC;QACxB;QACA,0BAA0B;YACxB,qBAAqB,CAAC;YACtB,iCAAiC,CAAC;YAClC,uBAAuB,CAAC;QAC1B;QACA,+BAA+B;YAC7B,mBAAmB,CAAC;YACpB,eAAe,CAAC;QAClB;IACF,CAAA,EAAG"}
package/dist/esm/components/progress-bar.js CHANGED
@@ -19,6 +19,12 @@ export const ProgressBar = (colors)=>({
19
19
  '.sk-progress-bar-fill': {
20
20
  [`@apply bg-primary-surface`]: {}
21
21
  }
22
+ },
23
+ '&-sm': {
24
+ '@apply h-[4px]': {}
25
+ },
26
+ '&-md': {
27
+ '@apply h-[8px]': {}
22
28
  }
23
29
  }
24
30
  });
package/dist/esm/components/progress-bar.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/progress-bar.ts"],"sourcesContent":["export const ProgressBar = (colors: string[]) => ({\r\n '.sk-progress-bar': {\r\n '@apply flex h-4 rounded-circular bg-background-color-mixin-2': {},\r\n\r\n '&-fill': {\r\n '@apply rounded-circular': {},\r\n },\r\n\r\n ...colors.reduce(\r\n (styles, color) => ({\r\n ...styles,\r\n [`&[data-color=\"${color}\"]`]: {\r\n '.sk-progress-bar-fill': {\r\n [`@apply bg-${color}-surface-primary`]: {},\r\n },\r\n\r\n '&[data-accent=\"true\"]': {\r\n [`@apply bg-inverted-${color}-surface-primary`]: {},\r\n },\r\n },\r\n }),\r\n {}\r\n ),\r\n\r\n \"&[data-color='tertiary']\": {\r\n '.sk-progress-bar-fill': {\r\n [`@apply bg-primary-surface`]: {},\r\n },\r\n },\r\n },\r\n});\r\n"],"names":["ProgressBar","colors","reduce","styles","color"],"mappings":"AAAA,OAAO,MAAMA,cAAc,CAACC,SAAsB,CAAA;QAChD,oBAAoB;YAClB,gEAAgE,CAAC;YAEjE,UAAU;gBACR,2BAA2B,CAAC;YAC9B;YAEA,GAAGA,OAAOC,MAAM,CACd,CAACC,QAAQC,QAAW,CAAA;oBAClB,GAAGD,MAAM;oBACT,CAAC,CAAC,cAAc,EAAEC,MAAM,EAAE,CAAC,CAAC,EAAE;wBAC5B,yBAAyB;4BACvB,CAAC,CAAC,UAAU,EAAEA,MAAM,gBAAgB,CAAC,CAAC,EAAE,CAAC;wBAC3C;wBAEA,yBAAyB;4BACvB,CAAC,CAAC,mBAAmB,EAAEA,MAAM,gBAAgB,CAAC,CAAC,EAAE,CAAC;wBACpD;oBACF;gBACF,CAAA,GACA,CAAC,EACF;YAED,4BAA4B;gBAC1B,yBAAyB;oBACvB,CAAC,CAAC,yBAAyB,CAAC,CAAC,EAAE,CAAC;gBAClC;YACF;QACF;IACF,CAAA,EAAG"}
1
+ {"version":3,"sources":["../../../src/components/progress-bar.ts"],"sourcesContent":["export const ProgressBar = (colors: string[]) => ({\r\n '.sk-progress-bar': {\r\n '@apply flex h-4 rounded-circular bg-background-color-mixin-2': {},\r\n\r\n '&-fill': {\r\n '@apply rounded-circular': {},\r\n },\r\n\r\n ...colors.reduce(\r\n (styles, color) => ({\r\n ...styles,\r\n [`&[data-color=\"${color}\"]`]: {\r\n '.sk-progress-bar-fill': {\r\n [`@apply bg-${color}-surface-primary`]: {},\r\n },\r\n\r\n '&[data-accent=\"true\"]': {\r\n [`@apply bg-inverted-${color}-surface-primary`]: {},\r\n },\r\n },\r\n }),\r\n {}\r\n ),\r\n\r\n \"&[data-color='tertiary']\": {\r\n '.sk-progress-bar-fill': {\r\n [`@apply bg-primary-surface`]: {},\r\n },\r\n },\r\n '&-sm': {\r\n '@apply h-[4px]': {},\r\n },\r\n '&-md': {\r\n '@apply h-[8px]': {},\r\n },\r\n },\r\n});\r\n"],"names":["ProgressBar","colors","reduce","styles","color"],"mappings":"AAAA,OAAO,MAAMA,cAAc,CAACC,SAAsB,CAAA;QAChD,oBAAoB;YAClB,gEAAgE,CAAC;YAEjE,UAAU;gBACR,2BAA2B,CAAC;YAC9B;YAEA,GAAGA,OAAOC,MAAM,CACd,CAACC,QAAQC,QAAW,CAAA;oBAClB,GAAGD,MAAM;oBACT,CAAC,CAAC,cAAc,EAAEC,MAAM,EAAE,CAAC,CAAC,EAAE;wBAC5B,yBAAyB;4BACvB,CAAC,CAAC,UAAU,EAAEA,MAAM,gBAAgB,CAAC,CAAC,EAAE,CAAC;wBAC3C;wBAEA,yBAAyB;4BACvB,CAAC,CAAC,mBAAmB,EAAEA,MAAM,gBAAgB,CAAC,CAAC,EAAE,CAAC;wBACpD;oBACF;gBACF,CAAA,GACA,CAAC,EACF;YAED,4BAA4B;gBAC1B,yBAAyB;oBACvB,CAAC,CAAC,yBAAyB,CAAC,CAAC,EAAE,CAAC;gBAClC;YACF;YACA,QAAQ;gBACN,kBAAkB,CAAC;YACrB;YACA,QAAQ;gBACN,kBAAkB,CAAC;YACrB;QACF;IACF,CAAA,EAAG"}
package/dist/types/components/accordion.d.ts CHANGED
@@ -1,120 +1,140 @@
1
1
  export declare const Accordion: () => {
2
2
  '.sk-disclosure': {
3
+ '@apply mt-6 mb-8': {};
4
+ '@apply text-dark-secondary': {};
5
+ '&[data-inverted="true"]': {
6
+ '@apply text-inverted-dark-secondary': {};
7
+ };
3
8
  '&-icon': {
4
9
  '@apply flex self-center': {};
5
10
  };
6
11
  '&-header': {
7
- '@apply mt-6 mb-8': {};
8
- '@apply flex flex-col text-left': {};
12
+ '@apply py-8': {};
13
+ '@apply flex flex-row text-left': {};
9
14
  '@apply cursor-pointer': {};
10
- '*': {
11
- '@apply cursor-pointer': {};
12
- };
13
- '&:focus-visible': {
14
- '@apply outline-0': {};
15
- };
15
+ '@apply items-center justify-between': {};
16
+ '@apply gap-16': {};
16
17
  '&-icon': {
17
- '@apply ml-auto': {};
18
- '@apply text-dark-secondary': {};
19
- svg: {
20
- '@apply w-20 h-20': {};
18
+ '@apply w-32 h-32': {};
19
+ '&-sm': {
20
+ '@apply w-20 min-h-20': {};
21
+ };
22
+ '&-md': {
23
+ '@apply w-24 min-h-24': {};
21
24
  };
22
25
  };
23
- '&[data-disabled="true"]': {
24
- '@apply text-dark-disabled': {};
25
- '.sk-disclosure-title': {
26
+ '&-title': {
27
+ '@apply text-dark-primary': {};
28
+ '@apply w-full': {};
29
+ '@apply flex flex-row': {};
30
+ '@apply items-center': {};
31
+ '@apply grow shrink': {};
32
+ '&[data-inverted="true"]': {
33
+ '@apply text-inverted-dark-primary': {};
34
+ };
35
+ '*': {
36
+ '@apply m-0': {};
37
+ '@apply text-inherit': {};
38
+ fontSize: string;
39
+ FontFamily: string;
40
+ lineHeight: string;
41
+ };
42
+ '&-disabled': {
26
43
  '@apply text-dark-disabled': {};
44
+ '&[data-inverted="true"]': {
45
+ '@apply text-inverted-dark-disabled': {};
46
+ };
47
+ };
48
+ '&-sm': {
49
+ '@apply gap-16': {};
50
+ '@apply text-h4-sm': {};
51
+ '&[data-variant="alt"]': {
52
+ '@apply gap-12': {};
53
+ };
54
+ };
55
+ '&-md': {
56
+ '@apply gap-16': {};
57
+ '@apply text-h4-md': {};
58
+ '&[data-variant="alt"]': {
59
+ '@apply gap-12': {};
60
+ };
27
61
  };
62
+ '&-lg': {
63
+ '@apply gap-16': {};
64
+ '&[data-variant="alt"]': {
65
+ '@apply gap-16': {};
66
+ '@apply text-h3-md': {};
67
+ };
68
+ };
69
+ '&-divider': {
70
+ '@apply border-divider': {};
71
+ '&[data-inverted="true"]': {
72
+ '@apply border-inverted-divider': {};
73
+ };
74
+ };
75
+ };
76
+ '&:focus-visible': {
77
+ '@apply outline-0': {};
78
+ };
79
+ '&[aria-disabled="true"]': {
80
+ '@apply text-dark-disabled': {};
28
81
  '@apply cursor-default': {};
29
82
  '*': {
30
83
  '@apply cursor-default': {};
31
84
  };
32
- };
33
- };
34
- '&-label': {
35
- '@apply shrink-0': {};
36
- };
37
- '&-toggle': {
38
- '@apply flex items-center justify-between': {};
39
- '@apply gap-16': {};
40
- '.sk-icon': {
41
- '@apply w-32 h-32': {};
42
- };
43
- };
44
- '&-title': {
45
- '@apply text-dark-primary': {};
46
- '&-wrapper': {
47
- '@apply w-full': {};
48
- '@apply flex flex-row': {};
49
- '@apply items-center': {};
50
- };
51
- };
52
- '&-sm': {
53
- '.sk-disclosure-title': {
54
- '@apply text-h4-sm font-bold': {};
55
- '&-wrapper': {
56
- '@apply gap-12': {};
85
+ '&[data-inverted="true"]': {
86
+ '@apply text-inverted-dark-disabled': {};
57
87
  };
58
88
  };
59
- '.sk-disclosure-toggle': {
60
- '@apply gap-12': {};
61
- '.sk-icon': {
62
- '@apply w-20 min-h-20': {};
89
+ '&-sm': {
90
+ '@apply gap-16': {};
91
+ '@apply h-32': {};
92
+ '&[data-variant="alt"]': {
93
+ '@apply gap-12': {};
63
94
  };
64
- };
65
- '.sk-disclosure-support': {
66
- '@apply text-small': {};
67
- };
68
- '&[data-variant="default"]': {
69
- '.sk-disclosure-toggle': {
70
- '@apply py-4': {};
95
+ '&[data-variant="default"]': {
71
96
  '@apply min-h-40': {};
72
97
  };
73
- '.sk-disclosure-header-icon': {
74
- '@apply w-32 h-32': {};
75
- };
76
98
  };
77
- '&[data-variant="alt"]': {};
78
- };
79
- '&-md': {
80
- '.sk-disclosure-title': {
81
- '@apply text-h4-md font-bold': {};
82
- '&-wrapper': {
99
+ '&-md': {
100
+ '@apply gap-16': {};
101
+ '&[data-variant="alt"]': {
83
102
  '@apply gap-12': {};
84
103
  };
104
+ '&[data-variant="default"]': {
105
+ '@apply min-h-56': {};
106
+ };
85
107
  };
86
- '.sk-disclosure-toggle': {
87
- '@apply gap-12': {};
88
- '.sk-icon': {
89
- '@apply w-24 min-h-24': {};
108
+ '&-lg': {
109
+ '@apply gap-16': {};
110
+ '.sk-disclosure-header-icon': {
111
+ '@apply w-32 min-h-32': {};
112
+ };
113
+ '&[data-variant="alt"]': {
114
+ '@apply gap-16': {};
90
115
  };
91
116
  };
92
- '.sk-disclosure-support': {
93
- '@apply text-body': {};
117
+ };
118
+ '&[data-variant="alt"]': {
119
+ '.sk-disclosure-header': {
120
+ '@apply py-0': {};
121
+ '@apply h-32': {};
94
122
  };
123
+ };
124
+ '&-label': {
125
+ '@apply shrink-0': {};
126
+ };
127
+ '&-md': {
95
128
  '&[data-variant="default"]': {
96
- '.sk-disclosure-toggle': {
129
+ '.sk-disclosure-header': {
97
130
  '@apply py-8': {};
98
131
  '@apply min-h-56': {};
99
132
  };
100
- '.sk-disclosure-header-icon': {
133
+ '.sk-disclosure-header-button': {
101
134
  '@apply w-40 h-40': {};
102
135
  };
103
136
  };
104
137
  };
105
- '&-lg': {
106
- '&[data-variant="alt"]': {
107
- '.sk-disclosure-support': {
108
- '@apply text-large': {};
109
- };
110
- '.sk-disclosure-title': {
111
- '@apply text-h3-md font-bold': {};
112
- '&-wrapper': {
113
- '@apply gap-16': {};
114
- };
115
- };
116
- };
117
- };
118
138
  '&-body': {
119
139
  '&[data-size="sm"]': {
120
140
  '@apply pr-12': {};
@@ -133,11 +153,11 @@ export declare const Accordion: () => {
133
153
  '@apply py-0': {};
134
154
  transitionProperty: string;
135
155
  transitionDuration: string;
136
- '&[aria-hidden="true"], &[data-hidden="true"]': {
137
- '@apply my-0 invisible max-h-0 opacity-0': {};
156
+ '&[aria-hidden="true"]': {
157
+ '@apply my-0 overflow-hidden max-h-0 opacity-0': {};
138
158
  };
139
- '&[aria-hidden="false"], &[data-hidden="false"]': {
140
- '@apply block opacity-100 visible': {};
159
+ '&[aria-hidden="false"]': {
160
+ '@apply block opacity-100': {};
141
161
  };
142
162
  '&[data-variant="alt"]': {
143
163
  '@apply mt-24': {};
@@ -170,31 +190,13 @@ export declare const Accordion: () => {
170
190
  transitionProperty: string;
171
191
  transitionDuration: string;
172
192
  '@apply border-b-1 border-divider': {};
193
+ '&[data-inverted="true"]': {
194
+ '@apply border-inverted-divider': {};
195
+ };
173
196
  };
174
197
  '&:last-child .sk-disclosure': {
175
198
  '@apply border-b-transparent': {};
176
199
  };
177
200
  };
178
201
  };
179
- '&[data-inverted="true"]': {
180
- '&.sk-disclosure': {
181
- '&-icon': {
182
- '@apply text-inverted-dark-secondary': {};
183
- };
184
- '&[data-disabled="true"]': {
185
- '@apply text-inverted-dark-disabled': {};
186
- '.sk-disclosure-title': {
187
- '@apply text-inverted-dark-disabled': {};
188
- };
189
- };
190
- '&-title': {
191
- '@apply text-inverted-dark-primary': {};
192
- };
193
- };
194
- '&.sk-accordion': {
195
- '&-item': {
196
- '@apply border-inverted-divider': {};
197
- };
198
- };
199
- };
200
202
  };
package/dist/types/components/forms.d.ts CHANGED
@@ -21,4 +21,13 @@ export declare const Forms: () => {
21
21
  '@apply font-normal': {};
22
22
  '@apply text-small': {};
23
23
  };
24
+ '.sk-form-error-message': {
25
+ '@apply text-error': {};
26
+ '@apply flex items-start gap-8': {};
27
+ '@apply self-stretch': {};
28
+ };
29
+ '.sk-form-error-message-icon': {
30
+ '@apply shrink-0': {};
31
+ '@apply pt-1': {};
32
+ };
24
33
  };
package/dist/types/components/progress-bar.d.ts CHANGED
@@ -5,6 +5,12 @@ export declare const ProgressBar: (colors: string[]) => {
5
5
  "@apply bg-primary-surface": {};
6
6
  };
7
7
  };
8
+ '&-sm': {
9
+ '@apply h-[4px]': {};
10
+ };
11
+ '&-md': {
12
+ '@apply h-[8px]': {};
13
+ };
8
14
  '@apply flex h-4 rounded-circular bg-background-color-mixin-2': {};
9
15
  '&-fill': {
10
16
  '@apply rounded-circular': {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sk-web-gui/core",
3
- "version": "4.1.1",
3
+ "version": "4.1.2",
4
4
  "license": "MIT",
5
5
  "type": "module",
6
6
  "main": "./dist/cjs/index.js",
@@ -41,5 +41,5 @@
41
41
  "mini-svg-data-uri": "^1.4.4",
42
42
  "tailwindcss": "^3.4.17"
43
43
  },
44
- "gitHead": "184f8e279fc18f286164e8c761bf0d3a6b96d4c5"
44
+ "gitHead": "114df0d9913ebce239a93a786a55b21842ba2693"
45
45
  }