@bcc-code/component-library-vue 0.0.0-dev.dc82c05 → 0.0.0-dev.e4d3538

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/dist/theme.css CHANGED
@@ -4,96 +4,222 @@
4
4
 
5
5
  @import 'tailwindcss';
6
6
  @import '@bcc-code/design-tokens/tailwind';
7
- @import '@bcc-code/design-tokens/primevue/overrides';
8
7
 
9
8
 
10
9
  /* === ./styles/theme.css === */
11
10
  @theme {
11
+ /* spacing variables */
12
+ --spacing-inset-top: env(safe-area-inset-top, var(--safe-area-inset-top, 0px));
13
+ --spacing-inset-top-1: max(0.25rem, env(safe-area-inset-top, var(--safe-area-inset-top, 0px)));
14
+ --spacing-inset-top-2: max(0.5rem, env(safe-area-inset-top, var(--safe-area-inset-top, 0px)));
15
+ --spacing-inset-top-4: max(1rem, env(safe-area-inset-top, var(--safe-area-inset-top, 0px)));
16
+ --spacing-inset-bottom: env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px));
17
+ --spacing-inset-bottom-1: max(0.25rem, env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px)));
18
+ --spacing-inset-bottom-2: max(0.5rem, env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px)));
19
+ --spacing-inset-bottom-4: max(1rem, env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px)));
20
+ --spacing-inset-left: env(safe-area-inset-left, var(--safe-area-inset-left, 0px));
21
+ --spacing-inset-right: env(safe-area-inset-right, var(--safe-area-inset-right, 0px));
22
+
23
+ --spacing-18: 4.5rem;
24
+ }
25
+
26
+ .ctx-default {
27
+ @apply ctx-default;
28
+ }
29
+ .ctx-success {
30
+ @apply ctx-success-subtlest;
31
+ }
32
+ .ctx-danger {
33
+ @apply ctx-danger-subtlest;
34
+ }
35
+ .ctx-warning {
36
+ @apply ctx-warning-subtlest;
37
+ }
38
+ .ctx-info {
39
+ @apply ctx-info-subtlest;
40
+ }
41
+
42
+ .ctx-blue-bolder {
43
+ @apply ctx-blue-bolder;
44
+ }
45
+ .ctx-blue-subtle {
46
+ @apply ctx-blue-subtle;
47
+ }
48
+ .ctx-blue-subtler {
49
+ @apply ctx-blue-subtler;
50
+ }
51
+ .ctx-blue-subtlest {
52
+ @apply ctx-blue-subtlest;
53
+ }
54
+ .ctx-brand-boldest {
55
+ @apply ctx-brand-boldest;
56
+ }
57
+ .ctx-brand-bolder {
58
+ @apply ctx-brand-bolder;
59
+ }
60
+ .ctx-brand-bold {
61
+ @apply ctx-brand-bold;
62
+ }
63
+ .ctx-brand-subtle {
64
+ @apply ctx-brand-subtle;
65
+ }
66
+ .ctx-brand-subtler {
67
+ @apply ctx-brand-subtler;
68
+ }
69
+ .ctx-brand-subtlest {
70
+ @apply ctx-brand-subtlest;
71
+ }
72
+ .ctx-brown-bolder {
73
+ @apply ctx-brown-bolder;
74
+ }
75
+ .ctx-brown-subtle {
76
+ @apply ctx-brown-subtle;
77
+ }
78
+ .ctx-brown-subtler {
79
+ @apply ctx-brown-subtler;
80
+ }
81
+ .ctx-brown-subtlest {
82
+ @apply ctx-brown-subtlest;
83
+ }
84
+ .ctx-danger-subtlest {
85
+ @apply ctx-danger;
86
+ }
87
+ .ctx-danger-bolder {
88
+ @apply ctx-danger-bolder;
89
+ }
90
+ .ctx-gray-bolder {
91
+ @apply ctx-gray-bolder;
92
+ }
93
+ .ctx-gray-subtle {
94
+ @apply ctx-gray-subtle;
95
+ }
96
+ .ctx-gray-subtler {
97
+ @apply ctx-gray-subtler;
98
+ }
99
+ .ctx-gray-subtlest {
100
+ @apply ctx-gray-subtlest;
101
+ }
102
+ .ctx-green-bolder {
103
+ @apply ctx-green-bolder;
104
+ }
105
+ .ctx-green-subtle {
106
+ @apply ctx-green-subtle;
107
+ }
108
+ .ctx-green-subtler {
109
+ @apply ctx-green-subtler;
110
+ }
111
+ .ctx-green-subtlest {
112
+ @apply ctx-green-subtlest;
113
+ }
114
+ .ctx-info-subtlest {
115
+ @apply ctx-info;
116
+ }
117
+ .ctx-info-bolder {
118
+ @apply ctx-info-bolder;
119
+ }
120
+ .ctx-magenta-bolder {
121
+ @apply ctx-magenta-bolder;
122
+ }
123
+ .ctx-magenta-subtle {
124
+ @apply ctx-magenta-subtle;
125
+ }
126
+ .ctx-magenta-subtler {
127
+ @apply ctx-magenta-subtler;
128
+ }
129
+ .ctx-magenta-subtlest {
130
+ @apply ctx-magenta-subtlest;
131
+ }
132
+ .ctx-neutral-boldest {
133
+ @apply ctx-neutral-boldest;
134
+ }
135
+ .ctx-neutral-bolder {
136
+ @apply ctx-neutral-bolder;
137
+ }
138
+ .ctx-neutral-bold {
139
+ @apply ctx-neutral-bold;
140
+ }
141
+ .ctx-neutral-subtle {
142
+ @apply ctx-neutral-subtle;
143
+ }
144
+ .ctx-neutral-subtler {
145
+ @apply ctx-neutral-subtler;
146
+ }
147
+ .ctx-neutral-subtlest {
148
+ @apply ctx-neutral-subtlest;
149
+ }
150
+ .ctx-orange-bolder {
151
+ @apply ctx-orange-bolder;
152
+ }
153
+ .ctx-orange-subtle {
154
+ @apply ctx-orange-subtle;
155
+ }
156
+ .ctx-orange-subtler {
157
+ @apply ctx-orange-subtler;
158
+ }
159
+ .ctx-orange-subtlest {
160
+ @apply ctx-orange-subtlest;
161
+ }
162
+ .ctx-purple-bolder {
163
+ @apply ctx-purple-bolder;
164
+ }
165
+ .ctx-purple-subtle {
166
+ @apply ctx-purple-subtle;
167
+ }
168
+ .ctx-purple-subtler {
169
+ @apply ctx-purple-subtler;
170
+ }
171
+ .ctx-purple-subtlest {
172
+ @apply ctx-purple-subtlest;
173
+ }
174
+ .ctx-red-bolder {
175
+ @apply ctx-red-bolder;
176
+ }
177
+ .ctx-red-subtle {
178
+ @apply ctx-red-subtle;
179
+ }
180
+ .ctx-red-subtler {
181
+ @apply ctx-red-subtler;
182
+ }
183
+ .ctx-red-subtlest {
184
+ @apply ctx-red-subtlest;
185
+ }
186
+ .ctx-success-subtlest {
187
+ @apply ctx-success;
188
+ }
189
+ .ctx-success-bolder {
190
+ @apply ctx-success-bolder;
191
+ }
192
+ .ctx-teal-bolder {
193
+ @apply ctx-teal-bolder;
194
+ }
195
+ .ctx-teal-subtle {
196
+ @apply ctx-teal-subtle;
197
+ }
198
+ .ctx-teal-subtler {
199
+ @apply ctx-teal-subtler;
200
+ }
201
+ .ctx-teal-subtlest {
202
+ @apply ctx-teal-subtlest;
203
+ }
204
+ .ctx-warning-subtlest {
205
+ @apply ctx-warning;
206
+ }
207
+ .ctx-warning-bolder {
208
+ @apply ctx-warning-bolder;
209
+ }
210
+ .ctx-yellow-bolder {
211
+ @apply ctx-yellow-bolder;
212
+ }
213
+ .ctx-yellow-subtle {
214
+ @apply ctx-yellow-subtle;
215
+ }
216
+ .ctx-yellow-subtler {
217
+ @apply ctx-yellow-subtler;
218
+ }
219
+ .ctx-yellow-subtlest {
220
+ @apply ctx-yellow-subtlest;
221
+ }
12
222
 
13
- /* spacing variables */
14
- --spacing-inset-top: env(safe-area-inset-top, var(--safe-area-inset-top, 0px));
15
- --spacing-inset-top-1: max(0.25rem, env(safe-area-inset-top, var(--safe-area-inset-top, 0px)));
16
- --spacing-inset-top-2: max(0.5rem, env(safe-area-inset-top, var(--safe-area-inset-top, 0px)));
17
- --spacing-inset-top-4: max(1rem, env(safe-area-inset-top, var(--safe-area-inset-top, 0px)));
18
- --spacing-inset-bottom: env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px));
19
- --spacing-inset-bottom-1: max(0.25rem, env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px)));
20
- --spacing-inset-bottom-2: max(0.5rem, env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px)));
21
- --spacing-inset-bottom-4: max(1rem, env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px)));
22
- --spacing-inset-left: env(safe-area-inset-left, var(--safe-area-inset-left, 0px));
23
- --spacing-inset-right: env(safe-area-inset-right, var(--safe-area-inset-right, 0px));
24
-
25
- --spacing-18: 4.5rem;
26
-
27
- /* color variables */
28
- --color-overlay: rgba(17, 24, 39, 0.85);
29
- }
30
-
31
- .ctx-default { @apply ctx-default; }
32
- .ctx-success { @apply ctx-success-subtlest; }
33
- .ctx-danger { @apply ctx-danger-subtlest; }
34
- .ctx-warning { @apply ctx-warning-subtlest; }
35
- .ctx-info { @apply ctx-info-subtlest; }
36
-
37
- .ctx-blue-bolder { @apply ctx-blue-bolder; }
38
- .ctx-blue-subtle { @apply ctx-blue-subtle; }
39
- .ctx-blue-subtler { @apply ctx-blue-subtler; }
40
- .ctx-blue-subtlest { @apply ctx-blue-subtlest; }
41
- .ctx-brand-boldest { @apply ctx-brand-boldest; }
42
- .ctx-brand-bolder { @apply ctx-brand-bolder; }
43
- .ctx-brand-bold { @apply ctx-brand-bold; }
44
- .ctx-brand-subtle { @apply ctx-brand-subtle; }
45
- .ctx-brand-subtler { @apply ctx-brand-subtler; }
46
- .ctx-brand-subtlest { @apply ctx-brand-subtlest; }
47
- .ctx-brown-bolder { @apply ctx-brown-bolder; }
48
- .ctx-brown-subtle { @apply ctx-brown-subtle; }
49
- .ctx-brown-subtler { @apply ctx-brown-subtler; }
50
- .ctx-brown-subtlest { @apply ctx-brown-subtlest; }
51
- .ctx-danger-subtlest { @apply ctx-danger; }
52
- .ctx-danger-bolder { @apply ctx-danger-bolder; }
53
- .ctx-gray-bolder { @apply ctx-gray-bolder; }
54
- .ctx-gray-subtle { @apply ctx-gray-subtle; }
55
- .ctx-gray-subtler { @apply ctx-gray-subtler; }
56
- .ctx-gray-subtlest { @apply ctx-gray-subtlest; }
57
- .ctx-green-bolder { @apply ctx-green-bolder; }
58
- .ctx-green-subtle { @apply ctx-green-subtle; }
59
- .ctx-green-subtler { @apply ctx-green-subtler; }
60
- .ctx-green-subtlest { @apply ctx-green-subtlest; }
61
- .ctx-info-subtlest { @apply ctx-info; }
62
- .ctx-info-bolder { @apply ctx-info-bolder; }
63
- .ctx-magenta-bolder { @apply ctx-magenta-bolder; }
64
- .ctx-magenta-subtle { @apply ctx-magenta-subtle; }
65
- .ctx-magenta-subtler { @apply ctx-magenta-subtler; }
66
- .ctx-magenta-subtlest { @apply ctx-magenta-subtlest; }
67
- .ctx-neutral-boldest { @apply ctx-neutral-boldest; }
68
- .ctx-neutral-bolder { @apply ctx-neutral-bolder; }
69
- .ctx-neutral-bold { @apply ctx-neutral-bold; }
70
- .ctx-neutral-subtle { @apply ctx-neutral-subtle; }
71
- .ctx-neutral-subtler { @apply ctx-neutral-subtler; }
72
- .ctx-neutral-subtlest { @apply ctx-neutral-subtlest; }
73
- .ctx-orange-bolder { @apply ctx-orange-bolder; }
74
- .ctx-orange-subtle { @apply ctx-orange-subtle; }
75
- .ctx-orange-subtler { @apply ctx-orange-subtler; }
76
- .ctx-orange-subtlest { @apply ctx-orange-subtlest; }
77
- .ctx-purple-bolder { @apply ctx-purple-bolder; }
78
- .ctx-purple-subtle { @apply ctx-purple-subtle; }
79
- .ctx-purple-subtler { @apply ctx-purple-subtler; }
80
- .ctx-purple-subtlest { @apply ctx-purple-subtlest; }
81
- .ctx-red-bolder { @apply ctx-red-bolder; }
82
- .ctx-red-subtle { @apply ctx-red-subtle; }
83
- .ctx-red-subtler { @apply ctx-red-subtler; }
84
- .ctx-red-subtlest { @apply ctx-red-subtlest; }
85
- .ctx-success-subtlest { @apply ctx-success; }
86
- .ctx-success-bolder { @apply ctx-success-bolder; }
87
- .ctx-teal-bolder { @apply ctx-teal-bolder; }
88
- .ctx-teal-subtle { @apply ctx-teal-subtle; }
89
- .ctx-teal-subtler { @apply ctx-teal-subtler; }
90
- .ctx-teal-subtlest { @apply ctx-teal-subtlest; }
91
- .ctx-warning-subtlest { @apply ctx-warning; }
92
- .ctx-warning-bolder { @apply ctx-warning-bolder; }
93
- .ctx-yellow-bolder { @apply ctx-yellow-bolder; }
94
- .ctx-yellow-subtle { @apply ctx-yellow-subtle; }
95
- .ctx-yellow-subtler { @apply ctx-yellow-subtler; }
96
- .ctx-yellow-subtlest { @apply ctx-yellow-subtlest; }
97
223
 
98
224
 
99
225
  /* === ./styles/semantic.css === */
@@ -1947,6 +2073,155 @@
1947
2073
  font-size: var(--text-md);
1948
2074
  }
1949
2075
 
2076
+ /* primevue-overrides.css - CSS-level component overrides */
2077
+ @layer custom {
2078
+ .p-accordionheader {
2079
+ gap: var(--p-accordion-header-gap);
2080
+ }
2081
+
2082
+ .p-autocomplete-input-multiple {
2083
+ min-height: var(--p-autocomplete-input-multiple-min-height);
2084
+ gap: var(--p-autocomplete-input-multiple-gap);
2085
+ }
2086
+
2087
+ .p-badge-circle {
2088
+ border-radius: var(--p-badge-circle-border-radius);
2089
+ }
2090
+
2091
+ .p-button {
2092
+ min-height: var(--p-button-min-height);
2093
+ }
2094
+
2095
+ .p-button-sm {
2096
+ min-height: var(--p-button-sm-min-height);
2097
+ }
2098
+
2099
+ .p-button-lg {
2100
+ min-height: var(--p-button-lg-min-height);
2101
+ }
2102
+
2103
+ .p-button.p-button-icon-only {
2104
+ min-width: var(--p-button-icon-only-width);
2105
+ }
2106
+
2107
+ .p-button-sm.p-button-icon-only {
2108
+ min-width: var(--p-button-sm-icon-only-width);
2109
+ }
2110
+
2111
+ .p-button-lg.p-button-icon-only {
2112
+ min-width: var(--p-button-lg-icon-only-width);
2113
+ }
2114
+
2115
+ .p-divider {
2116
+ gap: var(--p-divider-content-gap);
2117
+ }
2118
+
2119
+ .p-inputgroupaddon {
2120
+ min-height: var(--p-inputgroup-addon-min-height);
2121
+ }
2122
+
2123
+ .p-inputtext {
2124
+ min-height: var(--p-inputtext-min-height);
2125
+ }
2126
+
2127
+ .p-inputtext-sm {
2128
+ min-height: var(--p-inputtext-sm-min-height);
2129
+ }
2130
+
2131
+ .p-inputtext-lg {
2132
+ min-height: var(--p-inputtext-lg-min-height);
2133
+ }
2134
+
2135
+ .p-message-text {
2136
+ line-height: var(--p-message-text-line-height);
2137
+ }
2138
+
2139
+ .p-multiselect {
2140
+ min-height: var(--p-multiselect-min-height);
2141
+ }
2142
+
2143
+ .p-multiselect-sm {
2144
+ min-height: var(--p-multiselect-sm-min-height);
2145
+ }
2146
+
2147
+ .p-multiselect-lg {
2148
+ min-height: var(--p-multiselect-lg-min-height);
2149
+ }
2150
+
2151
+ .p-multiselect-label-container {
2152
+ display: flex;
2153
+ align-items: center;
2154
+ }
2155
+
2156
+ .p-radiobutton {
2157
+ gap: var(--p-radiobutton-gap);
2158
+ border-radius: var(--p-radiobutton-border-radius);
2159
+ }
2160
+
2161
+ .p-radiobutton-icon {
2162
+ border-radius: var(--p-radiobutton-icon-border-radius);
2163
+ }
2164
+
2165
+ .p-radiobutton-icon-sm {
2166
+ border-radius: var(--p-radiobutton-icon-sm-border-radius);
2167
+ }
2168
+
2169
+ .p-radiobutton-icon-lg {
2170
+ border-radius: var(--p-radiobutton-icon-lg-border-radius);
2171
+ }
2172
+
2173
+ .p-select {
2174
+ min-height: var(--p-select-min-height);
2175
+ }
2176
+
2177
+ .p-select-sm {
2178
+ min-height: var(--p-select-sm-min-height);
2179
+ }
2180
+
2181
+ .p-select-lg {
2182
+ min-height: var(--p-select-lg-min-height);
2183
+ }
2184
+
2185
+ .p-select-label {
2186
+ display: flex;
2187
+ align-items: center;
2188
+ }
2189
+
2190
+ .p-select-option {
2191
+ gap: var(--p-select-option-gap);
2192
+ }
2193
+
2194
+ .p-textarea {
2195
+ min-height: var(--p-textarea-min-height);
2196
+ }
2197
+
2198
+ .p-togglebutton {
2199
+ min-height: var(--p-togglebutton-min-height);
2200
+ }
2201
+
2202
+ .p-togglebutton .p-togglebutton-sm {
2203
+ min-height: var(--p-togglebutton-sm-min-height);
2204
+ border-radius: var(--p-togglebutton-sm-border-radius);
2205
+ }
2206
+
2207
+ .p-togglebutton-lg {
2208
+ min-height: var(--p-togglebutton-lg-min-height);
2209
+ }
2210
+
2211
+ .p-togglebutton .p-togglebutton-content {
2212
+ min-height: var(--p-togglebutton-content-min-height);
2213
+ }
2214
+
2215
+ .p-togglebutton-sm .p-togglebutton-content {
2216
+ min-height: var(--p-togglebutton-content-sm-min-height);
2217
+ border-radius: var(--p-togglebutton-content-sm-border-radius);
2218
+ }
2219
+
2220
+ .p-togglebutton-lg .p-togglebutton-content {
2221
+ min-height: var(--p-togglebutton-content-lg-min-height);
2222
+ }
2223
+ }
2224
+
1950
2225
 
1951
2226
 
1952
2227
 
@@ -1962,29 +2237,27 @@
1962
2237
  }
1963
2238
 
1964
2239
  .bcc-app-nav-item {
1965
- @apply ctx-gray-subtlest text-ctx relative flex h-12 flex-1 flex-col items-center justify-center gap-1 transition-colors focus:ring-0 focus:outline-none;
2240
+ @apply relative flex h-12 flex-1 flex-col items-center justify-center gap-1 transition-colors focus:ring-0 focus:outline-none;
1966
2241
  }
1967
2242
 
1968
2243
  .bcc-nav-item-icon {
1969
- @apply size-6 opacity-50;
2244
+ @apply size-6 icon-subtlest;
1970
2245
  }
1971
2246
 
1972
2247
  .bcc-nav-item-badge {
1973
- @apply absolute top-0 right-1 opacity-75;
2248
+ @apply absolute top-0 right-1;
1974
2249
  }
1975
2250
 
1976
2251
  .bcc-nav-item-title {
1977
- @apply text-heading-xs text-center opacity-50;
2252
+ @apply heading-xs text-center text-subtlest opacity-75;
1978
2253
  }
1979
2254
 
1980
- .bcc-app-nav-item--active {
1981
- @apply text-selected;
2255
+ .bcc-app-nav-item--active .bcc-nav-item-title {
2256
+ @apply text-selected opacity-100;
1982
2257
  }
1983
2258
 
1984
- .bcc-app-nav-item--active .bcc-nav-item-icon,
1985
- .bcc-app-nav-item--active .bcc-nav-item-badge,
1986
- .bcc-app-nav-item--active .bcc-nav-item-title {
1987
- @apply opacity-100;
2259
+ .bcc-app-nav-item--active .bcc-nav-item-icon {
2260
+ @apply text-selected;
1988
2261
  }
1989
2262
  }
1990
2263
 
@@ -2001,16 +2274,16 @@
2001
2274
  @apply ctx-gradient;
2002
2275
  }
2003
2276
  .bcc-badge.sm {
2004
- @apply text-heading-xs h-4 w-4;
2277
+ @apply heading-xs h-4 w-4;
2005
2278
  }
2006
2279
  .bcc-badge.md {
2007
- @apply text-heading-sm h-5 w-5;
2280
+ @apply heading-sm h-5 w-5;
2008
2281
  }
2009
2282
  .bcc-badge.lg {
2010
- @apply text-heading-md h-6 w-6;
2283
+ @apply heading-md h-6 w-6;
2011
2284
  }
2012
2285
  .bcc-badge.xl {
2013
- @apply text-heading-md h-8 w-8;
2286
+ @apply heading-md h-8 w-8;
2014
2287
  }
2015
2288
 
2016
2289
  .bcc-badge .bcc-badge-icon {
@@ -2142,40 +2415,43 @@
2142
2415
 
2143
2416
  /* from ./BccFrame/BccFrame.css */
2144
2417
  @layer components {
2145
- .bcc-frame {
2146
- @apply ctx ctx-default w-full;
2147
- }
2418
+ .bcc-frame {
2419
+ @apply ctx ctx-default w-full border border-transparent;
2420
+ }
2148
2421
 
2149
- .bcc-frame.bcc-frame--shadow {
2150
- @apply shadow shadow-ctx;
2151
- }
2422
+ .bcc-frame.bcc-frame--shadow {
2423
+ @apply shadow-ctx shadow;
2424
+ }
2152
2425
 
2153
- .bcc-frame--raised {
2154
- --ctx-background: var(--color-elevation-surface-raised-default);
2155
- }
2156
- .bcc-frame--rounded {
2157
- @apply rounded-md;
2158
- }
2159
- .bcc-frame--raised.bcc-frame--shadow {
2160
- @apply shadow-raised;
2161
- }
2426
+ .bcc-frame--raised {
2427
+ --ctx-background: var(--color-elevation-surface-raised-default);
2428
+ }
2429
+ .bcc-frame--rounded {
2430
+ @apply rounded-md;
2431
+ }
2432
+ .bcc-frame--raised.bcc-frame--shadow {
2433
+ @apply shadow-raised dark:border-default;
2434
+ }
2162
2435
 
2163
- .bcc-frame--overlay {
2164
- --ctx-background: var(--color-elevation-surface-overlay-default);
2165
- }
2166
- .bcc-frame--overlay.bcc-frame--shadow {
2167
- @apply shadow-overlay;
2168
- }
2436
+ .bcc-frame--overlay {
2437
+ --ctx-background: var(--color-elevation-surface-overlay-default);
2438
+ @apply border;
2439
+ }
2440
+ .bcc-frame--overlay.bcc-frame--shadow {
2441
+ @apply shadow-overlay dark:border-default;
2442
+ }
2169
2443
 
2170
- .bcc-frame--sunken {
2171
- --ctx-background: var(--color-elevation-surface-sunken-default);
2172
- }
2173
- .bcc-frame--sunken.bcc-frame--shadow {
2174
- @apply shadow-inner;
2175
- }
2444
+ .bcc-frame--sunken {
2445
+ --ctx-background: var(--color-elevation-surface-sunken-default);
2446
+ @apply border;
2447
+ }
2448
+ .bcc-frame--sunken.bcc-frame--shadow {
2449
+ @apply dark:border-default shadow-inner;
2450
+ }
2176
2451
  }
2177
2452
 
2178
2453
 
2454
+
2179
2455
  /* from ./BccGraphic/BccGraphic.css */
2180
2456
  @layer components {
2181
2457
  .bcc-graphic .corner,
@@ -2280,7 +2556,7 @@
2280
2556
  /* from ./BccNpsScore/BccNpsScore.css */
2281
2557
  @layer components {
2282
2558
  .bcc-nps-score {
2283
- @apply min-w-[280px] p-4 text-body-sm flex flex-col gap-y-2 select-none;
2559
+ @apply min-w-70 p-4 body-sm flex flex-col gap-y-2 select-none;
2284
2560
  }
2285
2561
 
2286
2562
  .bcc-nps-score--heading {
@@ -2432,27 +2708,27 @@
2432
2708
 
2433
2709
 
2434
2710
  /* from ./BccTag/BccTag.css */
2435
-
2436
2711
  @layer components {
2437
2712
  .bcc-tag.bcc-badge {
2438
2713
  @apply w-auto;
2439
2714
  }
2440
2715
  .bcc-tag.bcc-badge.md {
2441
- @apply font-regular h-6;
2716
+ @apply body-md h-6;
2442
2717
  }
2443
2718
  .bcc-tag.bcc-badge.sm {
2444
- @apply font-regular h-5;
2719
+ @apply body-sm h-5;
2445
2720
  }
2446
2721
  .bcc-tag.bcc-badge.lg {
2447
- @apply font-regular h-8;
2722
+ @apply body-md h-8;
2448
2723
  }
2449
2724
  .bcc-tag.bcc-badge.xl {
2450
- @apply font-regular h-10;
2725
+ @apply body-lg h-10;
2451
2726
  }
2452
2727
  }
2453
2728
 
2454
2729
 
2455
2730
 
2731
+
2456
2732
  /* === ./components/wrapped/styles.css === */
2457
2733
 
2458
2734
  /* from ./BccAvatar/BccAvatar.css */
@@ -9,6 +9,8 @@ export type GraphicProps = {
9
9
  ratio?: AspectRatioStyle;
10
10
  /** When true, renders the banner image in grayscale. */
11
11
  grayscale?: boolean;
12
+ /** When true, renders the banner image with a brightness of 150%. */
13
+ highlight?: boolean;
12
14
  };
13
15
  export declare const ratioClasses: {
14
16
  ultraWide: string;
@@ -11,13 +11,13 @@ export type StepIndicatorProps = {
11
11
  };
12
12
  type __VLS_Props = StepIndicatorProps;
13
13
  type __VLS_ModelProps = {
14
- modelValue?: number;
14
+ modelValue?: number | null;
15
15
  };
16
16
  type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
17
17
  declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
18
- "update:modelValue": (value: number) => any;
18
+ "update:modelValue": (value: number | null) => any;
19
19
  }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
20
- "onUpdate:modelValue"?: ((value: number) => any) | undefined;
20
+ "onUpdate:modelValue"?: ((value: number | null) => any) | undefined;
21
21
  }>, {
22
22
  context: BCC_CONTEXT;
23
23
  hideText: boolean;
@@ -12,7 +12,7 @@ type __VLS_Props = TopNavigationProps & {
12
12
  fixed?: boolean;
13
13
  padded?: boolean;
14
14
  transparent?: boolean;
15
- glass?: boolean;
15
+ white?: boolean;
16
16
  backTitle?: string;
17
17
  force?: boolean;
18
18
  titleLeft?: boolean;
@@ -22,21 +22,23 @@ declare var __VLS_1: {
22
22
  title: string;
23
23
  subtitle: string;
24
24
  };
25
- }, __VLS_13: {
25
+ }, __VLS_8: {}, __VLS_15: {
26
26
  title: string;
27
- }, __VLS_15: {
27
+ }, __VLS_17: {
28
28
  subtitle: string;
29
- }, __VLS_17: {}, __VLS_24: {};
29
+ }, __VLS_19: {}, __VLS_26: {};
30
30
  type __VLS_Slots = {} & {
31
31
  default?: (props: typeof __VLS_1) => any;
32
32
  } & {
33
- title?: (props: typeof __VLS_13) => any;
33
+ left?: (props: typeof __VLS_8) => any;
34
34
  } & {
35
- subtitle?: (props: typeof __VLS_15) => any;
35
+ title?: (props: typeof __VLS_15) => any;
36
36
  } & {
37
- right?: (props: typeof __VLS_17) => any;
37
+ subtitle?: (props: typeof __VLS_17) => any;
38
38
  } & {
39
- bottom?: (props: typeof __VLS_24) => any;
39
+ right?: (props: typeof __VLS_19) => any;
40
+ } & {
41
+ bottom?: (props: typeof __VLS_26) => any;
40
42
  };
41
43
  declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
42
44
  back: () => any;
@@ -3,6 +3,7 @@ export type RadioButtonProps = PrimeRadioButtonProps & {
3
3
  label?: string;
4
4
  labelLeft?: boolean;
5
5
  justify?: 'start' | 'center' | 'end' | 'between' | 'around' | 'evenly';
6
+ labelClass?: string;
6
7
  };
7
8
  declare var __VLS_6: {};
8
9
  type __VLS_Slots = {} & {