@bcc-code/component-library-vue 0.0.0-dev.926a8fe → 0.0.0-dev.9a9ab63
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/component-library.js +26600 -26149
- package/dist/component-library.umd.cjs +879 -683
- package/dist/index.css +1 -1
- package/dist/theme.css +196 -115
- package/dist-types/components/custom/BccBadge/BccBadge.vue.d.ts +2 -0
- package/dist-types/components/custom/BccNpsResult/BccNpsResult.vue.d.ts +2 -2
- package/dist-types/components/custom/BccStepIndicator/BccStepIndicator.vue.d.ts +5 -5
- package/dist-types/components/wrapped/BccAvatar/BccAvatar.vue.d.ts +2 -2
- package/dist-types/components/wrapped/BccButton.vue.d.ts +1 -0
- package/dist-types/components/wrapped/BccImage.vue.d.ts +17 -0
- package/dist-types/components/wrapped/BccMenu/BccMenu.vue.d.ts +14 -0
- package/dist-types/components/wrapped/BccToggle/BccToggle.vue.d.ts +12 -1
- package/dist-types/components/wrapped/index.d.ts +7 -0
- package/dist-types/index.d.ts +14 -5
- package/package.json +103 -100
package/dist/theme.css
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
/* Layer order: Tailwind base/utilities first, then PrimeVue so component styles win */
|
|
2
2
|
@layer theme, base, tailwind, primevue;
|
|
3
|
-
@import
|
|
3
|
+
@import '@bcc-code/design-tokens/css';
|
|
4
4
|
|
|
5
|
-
@import
|
|
6
|
-
@import
|
|
7
|
-
@import
|
|
5
|
+
@import 'tailwindcss';
|
|
6
|
+
@import '@bcc-code/design-tokens/tailwind';
|
|
7
|
+
@import '@bcc-code/design-tokens/primevue/overrides';
|
|
8
8
|
|
|
9
9
|
|
|
10
10
|
/* === ./styles/theme.css === */
|
|
@@ -649,7 +649,8 @@
|
|
|
649
649
|
|
|
650
650
|
/* Capitalize first letter */
|
|
651
651
|
@utility capital {
|
|
652
|
-
|
|
652
|
+
@apply inline-block;
|
|
653
|
+
|
|
653
654
|
&::first-letter {
|
|
654
655
|
text-transform: uppercase;
|
|
655
656
|
}
|
|
@@ -1824,35 +1825,93 @@
|
|
|
1824
1825
|
/** Custom styles to fix primevue components that are not custom or wrapped. */
|
|
1825
1826
|
|
|
1826
1827
|
/**
|
|
1827
|
-
|
|
1828
|
+
* GUTTER FIX
|
|
1829
|
+
* Primevue's dropwdown components are all missing the gap between input and dropdown
|
|
1830
|
+
**/
|
|
1831
|
+
.p-autocomplete-overlay,
|
|
1832
|
+
.p-menu-overlay,
|
|
1833
|
+
.p-multiselect-overlay,
|
|
1834
|
+
.p-select-overlay,
|
|
1835
|
+
.p-treeselect-overlay {
|
|
1836
|
+
margin: var(--p-anchor-gutter) 0;
|
|
1837
|
+
}
|
|
1838
|
+
|
|
1839
|
+
/* This fix is to ensure overlay badge is contained within the size of the component it wraps */
|
|
1840
|
+
.p-overlaybadge {
|
|
1841
|
+
display: inline-block;
|
|
1842
|
+
}
|
|
1843
|
+
|
|
1844
|
+
/**
|
|
1845
|
+
* BccAutocomplete
|
|
1828
1846
|
**/
|
|
1829
1847
|
|
|
1830
1848
|
/** Our icons are a bit smaller that Primevue's default */
|
|
1831
1849
|
.p-autocomplete .p-icon {
|
|
1832
|
-
|
|
1833
|
-
|
|
1834
|
-
|
|
1850
|
+
--p-icon-size: var(--icon-size-sm);
|
|
1851
|
+
--p-form-field-sm-font-size: var(--icon-size-sm);
|
|
1852
|
+
--p-form-field-lg-font-size: var(--icon-size-md);
|
|
1853
|
+
}
|
|
1854
|
+
|
|
1855
|
+
.p-autocomplete .p-autocomplete-clear-icon {
|
|
1856
|
+
/** middle-align the icon */
|
|
1857
|
+
top: calc(50% - var(--icon-size-sm) / 2);
|
|
1858
|
+
margin-top: 0;
|
|
1835
1859
|
}
|
|
1836
1860
|
|
|
1837
1861
|
.p-autocomplete-clearable .p-inputtext {
|
|
1838
|
-
|
|
1862
|
+
flex-grow: 1;
|
|
1839
1863
|
}
|
|
1840
1864
|
|
|
1865
|
+
.p-autocomplete-chip.p-chip {
|
|
1866
|
+
padding-block-start: calc(var(--p-autocomplete-padding-y) / 2);
|
|
1867
|
+
padding-block-end: calc(var(--p-autocomplete-padding-y) / 2);
|
|
1868
|
+
border-radius: var(--p-autocomplete-chip-border-radius);
|
|
1869
|
+
}
|
|
1841
1870
|
|
|
1842
1871
|
/**
|
|
1843
|
-
|
|
1844
|
-
|
|
1845
|
-
|
|
1846
|
-
|
|
1847
|
-
|
|
1848
|
-
|
|
1849
|
-
.p-select-
|
|
1850
|
-
|
|
1851
|
-
|
|
1872
|
+
* BccSelect
|
|
1873
|
+
**/
|
|
1874
|
+
.p-select {
|
|
1875
|
+
--p-icon-size: var(--icon-size-sm);
|
|
1876
|
+
}
|
|
1877
|
+
|
|
1878
|
+
.p-select.inline-select {
|
|
1879
|
+
@apply mx-auto inline-flex w-auto items-center border-0 bg-transparent shadow-none;
|
|
1880
|
+
--p-icon-size: 1.25em;
|
|
1881
|
+
--p-select-dropdown-width: 1.5em;
|
|
1882
|
+
--p-select-min-height: auto;
|
|
1883
|
+
}
|
|
1884
|
+
|
|
1885
|
+
.p-select.inline-select .p-select-label {
|
|
1886
|
+
@apply inline-block font-semibold;
|
|
1887
|
+
font-size: inherit;
|
|
1888
|
+
padding: 0 0 0 0.25em;
|
|
1889
|
+
}
|
|
1890
|
+
|
|
1891
|
+
.p-select.inline-select.inverse {
|
|
1892
|
+
--p-select-color: var(--color-neutral-0);
|
|
1893
|
+
--p-select-dropdown-color: var(--color-neutral-0);
|
|
1894
|
+
--p-select-placeholder-color: var(--color-dark-neutral-1000);
|
|
1895
|
+
}
|
|
1896
|
+
|
|
1897
|
+
/**
|
|
1898
|
+
* Fix issue with icons inside Input within an InputGroup being hidden when Input is in focus
|
|
1899
|
+
**/
|
|
1900
|
+
.p-inputicon {
|
|
1901
|
+
z-index: 2;
|
|
1902
|
+
}
|
|
1903
|
+
|
|
1904
|
+
.p-dialog-close-button .p-icon {
|
|
1905
|
+
height: var(--icon-size-sm);
|
|
1906
|
+
width: var(--icon-size-sm);
|
|
1907
|
+
}
|
|
1908
|
+
.p-dialog .p-button-icon:empty {
|
|
1909
|
+
display: none;
|
|
1852
1910
|
}
|
|
1853
1911
|
|
|
1854
1912
|
|
|
1855
1913
|
|
|
1914
|
+
|
|
1856
1915
|
/* === ./components/custom/styles.css === */
|
|
1857
1916
|
|
|
1858
1917
|
/* from ./BccBadge/BccBadge.css */
|
|
@@ -1862,6 +1921,13 @@ GUTTER FIX
|
|
|
1862
1921
|
|
|
1863
1922
|
@apply bg-ctx text-ctx;
|
|
1864
1923
|
}
|
|
1924
|
+
|
|
1925
|
+
.bcc-badge.capital {
|
|
1926
|
+
@apply inline-flex;
|
|
1927
|
+
}
|
|
1928
|
+
.bcc-badge.gradient {
|
|
1929
|
+
@apply ctx-gradient;
|
|
1930
|
+
}
|
|
1865
1931
|
.bcc-badge.sm {
|
|
1866
1932
|
@apply w-4 h-4 text-heading-xs;
|
|
1867
1933
|
}
|
|
@@ -1872,7 +1938,7 @@ GUTTER FIX
|
|
|
1872
1938
|
@apply w-6 h-6 text-heading-md;
|
|
1873
1939
|
}
|
|
1874
1940
|
.bcc-badge.xl {
|
|
1875
|
-
@apply w-8 h-8 text-heading-
|
|
1941
|
+
@apply w-8 h-8 text-heading-md;
|
|
1876
1942
|
}
|
|
1877
1943
|
|
|
1878
1944
|
.bcc-badge .bcc-badge-icon {
|
|
@@ -1909,7 +1975,7 @@ GUTTER FIX
|
|
|
1909
1975
|
}
|
|
1910
1976
|
|
|
1911
1977
|
.bcc-badge.squared {
|
|
1912
|
-
@apply rounded;
|
|
1978
|
+
@apply rounded-sm;
|
|
1913
1979
|
}
|
|
1914
1980
|
}
|
|
1915
1981
|
|
|
@@ -2011,8 +2077,8 @@ GUTTER FIX
|
|
|
2011
2077
|
.bcc-frame--raised {
|
|
2012
2078
|
--ctx-background: var(--color-elevation-surface-raised-default);
|
|
2013
2079
|
}
|
|
2014
|
-
.bcc-frame--
|
|
2015
|
-
@apply rounded;
|
|
2080
|
+
.bcc-frame--rounded {
|
|
2081
|
+
@apply rounded-md;
|
|
2016
2082
|
}
|
|
2017
2083
|
.bcc-frame--raised.bcc-frame--shadow {
|
|
2018
2084
|
@apply shadow-raised;
|
|
@@ -2083,43 +2149,53 @@ GUTTER FIX
|
|
|
2083
2149
|
@apply relative w-full;
|
|
2084
2150
|
}
|
|
2085
2151
|
|
|
2086
|
-
.bcc-nps-result
|
|
2152
|
+
.bcc-nps-result.xs {
|
|
2153
|
+
@apply w-24;
|
|
2154
|
+
}
|
|
2155
|
+
.bcc-nps-result.sm {
|
|
2156
|
+
@apply w-36;
|
|
2157
|
+
}
|
|
2158
|
+
.bcc-nps-result.md {
|
|
2159
|
+
@apply w-48;
|
|
2160
|
+
}
|
|
2161
|
+
.bcc-nps-result.lg {
|
|
2162
|
+
@apply w-60;
|
|
2163
|
+
}
|
|
2164
|
+
.bcc-nps-result.xl {
|
|
2165
|
+
@apply w-72;
|
|
2166
|
+
}
|
|
2167
|
+
|
|
2168
|
+
.bcc-nps-result .bcc-nps-result-gauge-dial {
|
|
2087
2169
|
transform-origin: center;
|
|
2088
2170
|
}
|
|
2089
2171
|
|
|
2090
|
-
.bcc-nps-result.animated .result-gauge-dial {
|
|
2172
|
+
.bcc-nps-result.animated .bcc-nps-result-gauge-dial {
|
|
2091
2173
|
transition-delay: 0.3s;
|
|
2092
2174
|
transition: all .7s cubic-bezier(0, 0, 0.3, 1.5);
|
|
2093
2175
|
}
|
|
2094
2176
|
|
|
2095
|
-
.bcc-nps-result-labels.lg {
|
|
2096
|
-
@apply bottom-[2em];
|
|
2097
|
-
}
|
|
2098
2177
|
.bcc-nps-result-labels {
|
|
2099
|
-
@apply absolute bottom-
|
|
2100
|
-
}
|
|
2101
|
-
.bcc-nps-result-labels.sm {
|
|
2102
|
-
@apply bottom-0;
|
|
2178
|
+
@apply absolute text-base bottom-1/4 translate-y-1/2 flex w-full flex-col items-center justify-center;
|
|
2103
2179
|
}
|
|
2104
2180
|
|
|
2105
|
-
.bcc-nps-result-labels.lg .bcc-nps-result-labels--heading {
|
|
2106
|
-
@apply text-heading-xl leading-tight;
|
|
2107
|
-
}
|
|
2108
2181
|
.bcc-nps-result-labels--heading {
|
|
2109
|
-
@apply text-
|
|
2182
|
+
@apply text-[1.25em] font-semibold leading-none;
|
|
2110
2183
|
}
|
|
2111
|
-
.bcc-nps-result-labels
|
|
2112
|
-
@apply text-
|
|
2184
|
+
.bcc-nps-result-labels--label {
|
|
2185
|
+
@apply text-[0.75em] text-subtlest;
|
|
2113
2186
|
}
|
|
2114
2187
|
|
|
2115
|
-
.bcc-nps-result
|
|
2116
|
-
@apply text-
|
|
2188
|
+
.bcc-nps-result.md .bcc-nps-result-labels {
|
|
2189
|
+
@apply text-lg;
|
|
2117
2190
|
}
|
|
2118
|
-
.bcc-nps-result-labels
|
|
2119
|
-
@apply text-
|
|
2191
|
+
.bcc-nps-result.lg .bcc-nps-result-labels {
|
|
2192
|
+
@apply text-xl;
|
|
2120
2193
|
}
|
|
2121
|
-
.bcc-nps-result
|
|
2122
|
-
@apply text-
|
|
2194
|
+
.bcc-nps-result.xl .bcc-nps-result-labels {
|
|
2195
|
+
@apply text-2xl;
|
|
2196
|
+
}
|
|
2197
|
+
.bcc-nps-result.full .bcc-nps-result-labels {
|
|
2198
|
+
@apply text-lg;
|
|
2123
2199
|
}
|
|
2124
2200
|
}
|
|
2125
2201
|
|
|
@@ -2302,75 +2378,76 @@ GUTTER FIX
|
|
|
2302
2378
|
|
|
2303
2379
|
/* from ./BccAvatar/BccAvatar.css */
|
|
2304
2380
|
@layer components {
|
|
2305
|
-
|
|
2306
|
-
|
|
2307
|
-
|
|
2308
|
-
|
|
2309
|
-
|
|
2310
|
-
|
|
2311
|
-
|
|
2312
|
-
.bcc-avatar.M {
|
|
2313
|
-
@apply ctx-blue-subtler;
|
|
2314
|
-
}
|
|
2315
|
-
.bcc-avatar.female,
|
|
2316
|
-
.bcc-avatar.F {
|
|
2317
|
-
@apply ctx-purple-subtler;
|
|
2318
|
-
}
|
|
2319
|
-
.bcc-avatar.male.child,
|
|
2320
|
-
.bcc-avatar.M.child {
|
|
2321
|
-
@apply ctx-teal-subtler;
|
|
2322
|
-
}
|
|
2323
|
-
.bcc-avatar.female.child,
|
|
2324
|
-
.bcc-avatar.F.child {
|
|
2325
|
-
@apply ctx-magenta-subtler;
|
|
2326
|
-
}
|
|
2327
|
-
.bcc-avatar.bordered {
|
|
2328
|
-
@apply border-2 border-ctx;
|
|
2329
|
-
}
|
|
2330
|
-
.bcc-avatar.xs {
|
|
2331
|
-
@apply size-5 text-xs;
|
|
2332
|
-
}
|
|
2333
|
-
.bcc-avatar.sm {
|
|
2334
|
-
@apply size-6 text-sm;
|
|
2335
|
-
}
|
|
2336
|
-
.bcc-avatar.md {
|
|
2337
|
-
@apply size-8 text-base;
|
|
2338
|
-
}
|
|
2339
|
-
.bcc-avatar.lg {
|
|
2340
|
-
@apply size-10 text-lg;
|
|
2341
|
-
}
|
|
2342
|
-
.bcc-avatar.xl {
|
|
2343
|
-
@apply size-12 text-xl;
|
|
2344
|
-
}
|
|
2345
|
-
.bcc-avatar.xxl {
|
|
2346
|
-
@apply size-20 text-3xl;
|
|
2347
|
-
}
|
|
2348
|
-
.bcc-avatar.xxxl {
|
|
2349
|
-
@apply size-24 text-4xl;
|
|
2350
|
-
}
|
|
2381
|
+
.bcc-avatar {
|
|
2382
|
+
--p-avatar-background: var(--ctx-background);
|
|
2383
|
+
--p-avatar-color: var(--ctx-text);
|
|
2384
|
+
--bcc-avatar-border: var(--ctx-border);
|
|
2385
|
+
--p-icon-size: var(--icon-size-sm);
|
|
2386
|
+
@apply ctx-gray-subtler shrink-0 overflow-hidden text-sm;
|
|
2387
|
+
}
|
|
2351
2388
|
|
|
2352
|
-
|
|
2353
|
-
|
|
2354
|
-
|
|
2355
|
-
|
|
2356
|
-
|
|
2357
|
-
|
|
2358
|
-
|
|
2359
|
-
|
|
2360
|
-
|
|
2361
|
-
|
|
2362
|
-
|
|
2363
|
-
|
|
2389
|
+
.bcc-avatar.male,
|
|
2390
|
+
.bcc-avatar.M {
|
|
2391
|
+
@apply ctx-blue-subtler;
|
|
2392
|
+
}
|
|
2393
|
+
.bcc-avatar.female,
|
|
2394
|
+
.bcc-avatar.F {
|
|
2395
|
+
@apply ctx-purple-subtler;
|
|
2396
|
+
}
|
|
2397
|
+
.bcc-avatar.male.child,
|
|
2398
|
+
.bcc-avatar.M.child {
|
|
2399
|
+
@apply ctx-teal-subtler;
|
|
2400
|
+
}
|
|
2401
|
+
.bcc-avatar.female.child,
|
|
2402
|
+
.bcc-avatar.F.child {
|
|
2403
|
+
@apply ctx-magenta-subtler;
|
|
2404
|
+
}
|
|
2405
|
+
.bcc-avatar.bordered {
|
|
2406
|
+
@apply border-ctx border-2;
|
|
2407
|
+
}
|
|
2408
|
+
.bcc-avatar.xs {
|
|
2409
|
+
@apply size-5 text-xs;
|
|
2410
|
+
}
|
|
2411
|
+
.bcc-avatar.xs .icon {
|
|
2412
|
+
--p-icon-size: var(--icon-size-xs);
|
|
2413
|
+
}
|
|
2414
|
+
.bcc-avatar.sm {
|
|
2415
|
+
@apply size-6 text-xs;
|
|
2416
|
+
--p-icon-size: var(--icon-size-xs);
|
|
2417
|
+
}
|
|
2418
|
+
/* .bcc-avatar.md {
|
|
2419
|
+
same as default
|
|
2420
|
+
}*/
|
|
2421
|
+
.bcc-avatar.lg {
|
|
2422
|
+
@apply text-md size-10;
|
|
2423
|
+
--p-icon-size: var(--icon-size-md);
|
|
2424
|
+
}
|
|
2425
|
+
.bcc-avatar.xl {
|
|
2426
|
+
@apply size-12 text-xl;
|
|
2427
|
+
--p-icon-size: var(--icon-size-lg);
|
|
2428
|
+
}
|
|
2429
|
+
.bcc-avatar.xxl {
|
|
2430
|
+
@apply size-20 text-3xl;
|
|
2431
|
+
--p-icon-size: var(--icon-size-xl);
|
|
2432
|
+
}
|
|
2433
|
+
.bcc-avatar.xxxl {
|
|
2434
|
+
@apply size-24 text-4xl;
|
|
2435
|
+
--p-icon-size: var(--icon-size-xl);
|
|
2436
|
+
}
|
|
2364
2437
|
|
|
2438
|
+
.p-overlaybadge .bcc-avatar.p-avatar-circle.lg ~ .p-badge,
|
|
2439
|
+
.p-overlaybadge .bcc-avatar.p-avatar-circle.xl ~ .p-badge {
|
|
2440
|
+
transform: translate(40%, -40%);
|
|
2441
|
+
}
|
|
2365
2442
|
|
|
2366
|
-
|
|
2367
|
-
|
|
2368
|
-
|
|
2369
|
-
|
|
2370
|
-
}
|
|
2443
|
+
.p-overlaybadge .bcc-avatar.p-avatar-circle.xxxl ~ .p-badge,
|
|
2444
|
+
.p-overlaybadge .bcc-avatar.p-avatar-circle.xxl ~ .p-badge {
|
|
2445
|
+
transform: translate(20%, -20%);
|
|
2446
|
+
}
|
|
2371
2447
|
}
|
|
2372
2448
|
|
|
2373
2449
|
|
|
2450
|
+
|
|
2374
2451
|
/* from ./BccTabs/BccTabs.css */
|
|
2375
2452
|
@layer components {
|
|
2376
2453
|
.bcc-tabs-fill.p-tabs {
|
|
@@ -2411,24 +2488,28 @@ GUTTER FIX
|
|
|
2411
2488
|
|
|
2412
2489
|
|
|
2413
2490
|
|
|
2414
|
-
:root,
|
|
2491
|
+
:root,
|
|
2492
|
+
:host {
|
|
2415
2493
|
--font-sans: 'Archivo', system-ui, sans-serif;
|
|
2416
|
-
|
|
2417
|
-
|
|
2418
|
-
|
|
2494
|
+
@apply m-0 p-0 font-sans antialiased;
|
|
2495
|
+
-webkit-font-smoothing: antialiased;
|
|
2496
|
+
-moz-osx-font-smoothing: grayscale;
|
|
2497
|
+
}
|
|
2419
2498
|
|
|
2499
|
+
hr {
|
|
2500
|
+
border-color: var(--color-border-default);
|
|
2420
2501
|
}
|
|
2421
2502
|
|
|
2422
2503
|
b,
|
|
2423
2504
|
strong,
|
|
2424
2505
|
.bold {
|
|
2425
|
-
|
|
2426
|
-
|
|
2506
|
+
font-weight: bold;
|
|
2507
|
+
--ctx-text: var(--ctx-text-bold);
|
|
2427
2508
|
}
|
|
2428
2509
|
|
|
2429
2510
|
/* Disable state */
|
|
2430
2511
|
:disabled,
|
|
2431
2512
|
.disabled {
|
|
2432
|
-
|
|
2433
|
-
|
|
2513
|
+
cursor: not-allowed;
|
|
2514
|
+
pointer-events: none;
|
|
2434
2515
|
}
|
|
@@ -13,6 +13,7 @@ export type BadgeProps = {
|
|
|
13
13
|
squared?: boolean;
|
|
14
14
|
/** Design context (e.g. neutral, brand) used for background and text color. */
|
|
15
15
|
context?: BCC_CONTEXT;
|
|
16
|
+
gradient?: boolean;
|
|
16
17
|
};
|
|
17
18
|
declare var __VLS_1: {};
|
|
18
19
|
type __VLS_Slots = {} & {
|
|
@@ -21,6 +22,7 @@ type __VLS_Slots = {} & {
|
|
|
21
22
|
declare const __VLS_base: import("vue").DefineComponent<BadgeProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<BadgeProps> & Readonly<{}>, {
|
|
22
23
|
size: "sm" | "md" | "lg" | "xl";
|
|
23
24
|
context: BCC_CONTEXT;
|
|
25
|
+
gradient: boolean;
|
|
24
26
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
25
27
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
26
28
|
declare const _default: typeof __VLS_export;
|
|
@@ -2,7 +2,7 @@ export type NpsResultProps = {
|
|
|
2
2
|
/** NPS score between -100 and 100; drives the gauge needle angle and position. */
|
|
3
3
|
score: number;
|
|
4
4
|
/** Controls the size of the gauge and optional text (lg, md, sm, xs). */
|
|
5
|
-
size?: '
|
|
5
|
+
size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'full';
|
|
6
6
|
/** Text shown as the main heading; defaults to the numeric score when unset. */
|
|
7
7
|
display?: string;
|
|
8
8
|
/** Secondary label shown under the main heading. */
|
|
@@ -13,7 +13,7 @@ export type NpsResultProps = {
|
|
|
13
13
|
animated?: boolean;
|
|
14
14
|
};
|
|
15
15
|
declare const __VLS_export: import("vue").DefineComponent<NpsResultProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NpsResultProps> & Readonly<{}>, {
|
|
16
|
-
size: "
|
|
16
|
+
size: "xs" | "sm" | "md" | "lg" | "xl" | "full";
|
|
17
17
|
hideText: boolean;
|
|
18
18
|
animated: boolean;
|
|
19
19
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { type BCC_CONTEXT } from '@/contexts';
|
|
2
2
|
export type StepIndicatorProps = {
|
|
3
|
-
steps: string[];
|
|
4
|
-
|
|
5
|
-
|
|
3
|
+
steps: string[] | number;
|
|
4
|
+
hideText?: boolean;
|
|
5
|
+
hideLabel?: boolean;
|
|
6
6
|
left?: boolean;
|
|
7
7
|
right?: boolean;
|
|
8
8
|
context?: BCC_CONTEXT;
|
|
@@ -20,8 +20,8 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
|
|
|
20
20
|
"onUpdate:modelValue"?: ((value: number) => any) | undefined;
|
|
21
21
|
}>, {
|
|
22
22
|
context: BCC_CONTEXT;
|
|
23
|
-
|
|
24
|
-
|
|
23
|
+
hideText: boolean;
|
|
24
|
+
hideLabel: boolean;
|
|
25
25
|
headingFn: (currentStep: number, totalSteps: number) => string;
|
|
26
26
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
27
27
|
declare const _default: typeof __VLS_export;
|
|
@@ -11,8 +11,8 @@ export type AvatarProps = Omit<PrimeAvatarProps, 'shape' | 'size'> & {
|
|
|
11
11
|
squared?: boolean;
|
|
12
12
|
/** Adds a visible border around the avatar. */
|
|
13
13
|
bordered?: boolean;
|
|
14
|
-
/** Controls the avatar dimensions; maps to CSS size classes (xs through xxl). */
|
|
15
|
-
size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
|
|
14
|
+
/** Controls the avatar dimensions; maps to CSS size classes (xs through xxl). Default: md */
|
|
15
|
+
size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl' | 'xxxl';
|
|
16
16
|
};
|
|
17
17
|
declare const __VLS_export: import("vue").DefineComponent<AvatarProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<AvatarProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
18
18
|
declare const _default: typeof __VLS_export;
|
|
@@ -3,6 +3,7 @@ import { type ButtonProps as PrimeButtonProps } from 'primevue/button';
|
|
|
3
3
|
export type ButtonProps = {
|
|
4
4
|
icon?: VueComponent;
|
|
5
5
|
iconRight?: boolean;
|
|
6
|
+
iconClass?: PrimeButtonProps['iconClass'];
|
|
6
7
|
size?: PrimeButtonProps['size'];
|
|
7
8
|
useCtx?: boolean;
|
|
8
9
|
} & /* @vue-ignore */ Omit<PrimeButtonProps, 'icon' | 'iconPos'>;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { type ImageProps as PrimeImageProps } from 'primevue/image';
|
|
2
|
+
export type ImageProps = PrimeImageProps;
|
|
3
|
+
declare var __VLS_9: {}, __VLS_17: {};
|
|
4
|
+
type __VLS_Slots = {} & {
|
|
5
|
+
refresh?: (props: typeof __VLS_9) => any;
|
|
6
|
+
} & {
|
|
7
|
+
undo?: (props: typeof __VLS_17) => any;
|
|
8
|
+
};
|
|
9
|
+
declare const __VLS_base: import("vue").DefineComponent<PrimeImageProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PrimeImageProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
10
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
11
|
+
declare const _default: typeof __VLS_export;
|
|
12
|
+
export default _default;
|
|
13
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
14
|
+
new (): {
|
|
15
|
+
$slots: S;
|
|
16
|
+
};
|
|
17
|
+
};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import type { VueComponent } from '@/types';
|
|
2
|
+
import { type MenuMethods as PrimeMenuMethods, type MenuProps as PrimeMenuProps } from 'primevue/menu';
|
|
3
|
+
import type { MenuItem } from 'primevue/menuitem';
|
|
4
|
+
/** Menu item model for BccMenu: icon can be a PrimeVue icon class string or a Vue icon component. */
|
|
5
|
+
export type BccMenuItem = Omit<MenuItem, 'icon' | 'items'> & {
|
|
6
|
+
icon?: VueComponent;
|
|
7
|
+
items?: BccMenuItem[];
|
|
8
|
+
};
|
|
9
|
+
export type MenuProps = {
|
|
10
|
+
model?: BccMenuItem[];
|
|
11
|
+
} & Omit<PrimeMenuProps, 'model'>;
|
|
12
|
+
declare const __VLS_export: import("vue").DefineComponent<MenuProps, PrimeMenuMethods, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<MenuProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
13
|
+
declare const _default: typeof __VLS_export;
|
|
14
|
+
export default _default;
|
|
@@ -14,6 +14,17 @@ export type ToggleProps = ToggleSwitchProps & {
|
|
|
14
14
|
/** When true, applies context-aware styling (e.g. from design tokens/theme). */
|
|
15
15
|
useCtx?: boolean;
|
|
16
16
|
};
|
|
17
|
-
|
|
17
|
+
type __VLS_Props = ToggleProps;
|
|
18
|
+
type __VLS_ModelProps = {
|
|
19
|
+
modelValue: boolean;
|
|
20
|
+
};
|
|
21
|
+
type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
|
|
22
|
+
declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
23
|
+
"update:modelValue": (value: boolean) => any;
|
|
24
|
+
}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
25
|
+
"onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
|
|
26
|
+
}>, {
|
|
27
|
+
defaultValue: string | boolean;
|
|
28
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
18
29
|
declare const _default: typeof __VLS_export;
|
|
19
30
|
export default _default;
|
|
@@ -5,7 +5,11 @@
|
|
|
5
5
|
export { default as BccAvatar } from './BccAvatar/BccAvatar.vue';
|
|
6
6
|
export { default as BccButton } from './BccButton.vue';
|
|
7
7
|
export { default as BccCheckbox } from './BccCheckbox.vue';
|
|
8
|
+
export { default as BccChip } from './BccChip/BccChip.vue';
|
|
9
|
+
export { default as BccConfirmDialog } from './BccConfirmDialog/BccConfirmDialog.vue';
|
|
10
|
+
export { default as BccImage } from './BccImage.vue';
|
|
8
11
|
export { default as BccInput } from './BccInput.vue';
|
|
12
|
+
export { default as BccMenu } from './BccMenu/BccMenu.vue';
|
|
9
13
|
export { default as BccMessage } from './BccMessage.vue';
|
|
10
14
|
export { default as BccTabs } from './BccTabs/BccTabs.vue';
|
|
11
15
|
export { default as BccToggle } from './BccToggle/BccToggle.vue';
|
|
@@ -13,7 +17,10 @@ export { default as BccToggleButton } from './BccToggleButton.vue';
|
|
|
13
17
|
export type { AvatarProps } from './BccAvatar/BccAvatar.vue';
|
|
14
18
|
export type { ButtonProps } from './BccButton.vue';
|
|
15
19
|
export type { CheckboxProps } from './BccCheckbox.vue';
|
|
20
|
+
export type { ChipProps } from './BccChip/BccChip.vue';
|
|
21
|
+
export type { ImageProps } from './BccImage.vue';
|
|
16
22
|
export type { InputProps } from './BccInput.vue';
|
|
23
|
+
export type { BccMenuItem, MenuProps } from './BccMenu/BccMenu.vue';
|
|
17
24
|
export type { MessageProps } from './BccMessage.vue';
|
|
18
25
|
export type { TabItem, TabsProps } from './BccTabs/BccTabs.vue';
|
|
19
26
|
export type { ToggleProps } from './BccToggle/BccToggle.vue';
|
package/dist-types/index.d.ts
CHANGED
|
@@ -16,6 +16,7 @@
|
|
|
16
16
|
* 2. Alternative: Pre-built CSS only (no Tailwind in your app; library styles + components only):
|
|
17
17
|
* - main.ts: import "@bcc-code/component-library-vue/style.css";
|
|
18
18
|
*/
|
|
19
|
+
import type { ConfirmationOptions } from 'primevue/confirmationoptions';
|
|
19
20
|
import './style.css';
|
|
20
21
|
export { default as BccPreset } from '@bcc-code/design-tokens/primevue';
|
|
21
22
|
export { BCC_CONTEXTS, type BCC_CONTEXT } from './contexts';
|
|
@@ -45,7 +46,6 @@ export { default as BccColorPicker } from 'primevue/colorpicker';
|
|
|
45
46
|
export { default as BccColumn } from 'primevue/column';
|
|
46
47
|
export { default as BccColumnGroup } from 'primevue/columngroup';
|
|
47
48
|
export { default as BccConfig } from 'primevue/config';
|
|
48
|
-
export { default as BccConfirmDialog } from 'primevue/confirmdialog';
|
|
49
49
|
export { default as BccConfirmPopup } from 'primevue/confirmpopup';
|
|
50
50
|
export { default as BccContextMenu } from 'primevue/contextmenu';
|
|
51
51
|
export { default as BccDataTable } from 'primevue/datatable';
|
|
@@ -65,7 +65,6 @@ export { default as BccFocusTrap } from 'primevue/focustrap';
|
|
|
65
65
|
export { default as BccGalleria } from 'primevue/galleria';
|
|
66
66
|
export { default as BccIconField } from 'primevue/iconfield';
|
|
67
67
|
export { default as BccIftaLabel } from 'primevue/iftalabel';
|
|
68
|
-
export { default as BccImage } from 'primevue/image';
|
|
69
68
|
export { default as BccImageCompare } from 'primevue/imagecompare';
|
|
70
69
|
export { default as BccInplace } from 'primevue/inplace';
|
|
71
70
|
export { default as BccInputChips } from 'primevue/inputchips';
|
|
@@ -80,7 +79,6 @@ export { default as BccKeyFilter } from 'primevue/keyfilter';
|
|
|
80
79
|
export { default as BccKnob } from 'primevue/knob';
|
|
81
80
|
export { default as BccListbox } from 'primevue/listbox';
|
|
82
81
|
export { default as BccMegaMenu } from 'primevue/megamenu';
|
|
83
|
-
export { default as BccMenu } from 'primevue/menu';
|
|
84
82
|
export { default as BccMenubar } from 'primevue/menubar';
|
|
85
83
|
export { default as BccMeterGroup } from 'primevue/metergroup';
|
|
86
84
|
export { default as BccMultiSelect } from 'primevue/multiselect';
|
|
@@ -116,6 +114,7 @@ export { default as BccStepItem } from 'primevue/stepitem';
|
|
|
116
114
|
export { default as BccStepList } from 'primevue/steplist';
|
|
117
115
|
export { default as BccStepPanel } from 'primevue/steppanel';
|
|
118
116
|
export { default as BccStepPanels } from 'primevue/steppanels';
|
|
117
|
+
export { default as BccStepper } from 'primevue/stepper';
|
|
119
118
|
export { default as BccSteps } from 'primevue/steps';
|
|
120
119
|
export { default as BccStyleClass } from 'primevue/styleclass';
|
|
121
120
|
export { default as BccTab } from 'primevue/tab';
|
|
@@ -137,8 +136,18 @@ export { default as BccTooltip } from 'primevue/tooltip';
|
|
|
137
136
|
export { default as BccTree } from 'primevue/tree';
|
|
138
137
|
export { default as BccTreeSelect } from 'primevue/treeselect';
|
|
139
138
|
export { default as BccTreeTable } from 'primevue/treetable';
|
|
140
|
-
export { default as BccVirtualScroller } from 'primevue/virtualscroller';
|
|
141
|
-
export { useConfirm } from 'primevue/useconfirm';
|
|
142
139
|
export { useDialog } from 'primevue/usedialog';
|
|
143
140
|
export { useToast } from 'primevue/usetoast';
|
|
141
|
+
export { default as BccVirtualScroller } from 'primevue/virtualscroller';
|
|
144
142
|
export { default as useAnimatedNumber } from './composables/animatedNumber';
|
|
143
|
+
import type { VueComponent } from './types';
|
|
144
|
+
interface UseConfirmOptions extends Omit<ConfirmationOptions, 'icon' | 'acceptIcon' | 'rejectIcon'> {
|
|
145
|
+
icon?: VueComponent | undefined;
|
|
146
|
+
acceptIcon?: VueComponent | undefined;
|
|
147
|
+
rejectIcon?: VueComponent | undefined;
|
|
148
|
+
}
|
|
149
|
+
type UseConfirmReturn = {
|
|
150
|
+
require: (option: UseConfirmOptions) => void;
|
|
151
|
+
close: () => void;
|
|
152
|
+
};
|
|
153
|
+
export declare function useConfirm(): UseConfirmReturn;
|