@bcc-code/component-library-vue 0.0.0-dev.ed4fb0b → 0.0.0-dev.ed567a3
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 +36476 -35903
- package/dist/component-library.umd.cjs +529 -516
- package/dist/index.css +1 -1
- package/dist/theme.css +207 -99
- package/dist-types/components/custom/BccAppNavigation/BccAppNavigation.vue.d.ts +19 -0
- package/dist-types/components/custom/BccBadge/BccBadge.vue.d.ts +2 -0
- package/dist-types/components/custom/BccDialKnob/BccDialKnob.vue.d.ts +2 -2
- package/dist-types/components/custom/BccStepIndicator/BccStepIndicator.vue.d.ts +5 -5
- package/dist-types/components/custom/BccTopNavigation/BccTopNavigation.vue.d.ts +47 -0
- package/dist-types/components/custom/index.d.ts +4 -0
- package/dist-types/components/wrapped/BccAvatar/BccAvatar.vue.d.ts +1 -1
- 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 +5 -0
- package/dist-types/index.d.ts +0 -2
- package/package.json +103 -102
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 === */
|
|
@@ -1825,48 +1825,153 @@
|
|
|
1825
1825
|
/** Custom styles to fix primevue components that are not custom or wrapped. */
|
|
1826
1826
|
|
|
1827
1827
|
/**
|
|
1828
|
-
|
|
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
|
|
1829
1846
|
**/
|
|
1830
1847
|
|
|
1831
1848
|
/** Our icons are a bit smaller that Primevue's default */
|
|
1832
1849
|
.p-autocomplete .p-icon {
|
|
1833
|
-
|
|
1834
|
-
|
|
1835
|
-
|
|
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;
|
|
1836
1859
|
}
|
|
1837
1860
|
|
|
1838
1861
|
.p-autocomplete-clearable .p-inputtext {
|
|
1839
|
-
|
|
1862
|
+
flex-grow: 1;
|
|
1840
1863
|
}
|
|
1841
1864
|
|
|
1842
1865
|
.p-autocomplete-chip.p-chip {
|
|
1843
|
-
|
|
1844
|
-
|
|
1845
|
-
|
|
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);
|
|
1846
1869
|
}
|
|
1847
1870
|
|
|
1848
|
-
|
|
1849
1871
|
/**
|
|
1850
|
-
|
|
1851
|
-
|
|
1852
|
-
|
|
1853
|
-
|
|
1854
|
-
.p-menu-overlay,
|
|
1855
|
-
.p-multiselect-overlay,
|
|
1856
|
-
.p-select-overlay,
|
|
1857
|
-
.p-treeselect-overlay {
|
|
1858
|
-
margin: var(--p-anchor-gutter) 0;
|
|
1872
|
+
* BccSelect
|
|
1873
|
+
**/
|
|
1874
|
+
.p-select {
|
|
1875
|
+
--p-icon-size: var(--icon-size-sm);
|
|
1859
1876
|
}
|
|
1860
1877
|
|
|
1861
|
-
|
|
1862
|
-
|
|
1863
|
-
|
|
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;
|
|
1864
1910
|
}
|
|
1865
1911
|
|
|
1866
1912
|
|
|
1867
1913
|
|
|
1914
|
+
|
|
1868
1915
|
/* === ./components/custom/styles.css === */
|
|
1869
1916
|
|
|
1917
|
+
/* from ./BccAppNavigation/BccAppNavigation.css */
|
|
1918
|
+
@layer components {
|
|
1919
|
+
.bcc-app-navigation {
|
|
1920
|
+
@apply justify-center items-center flex pb-inset-bottom-2 absolute inset-x-0 bottom-0 z-20 w-full overflow-visible;
|
|
1921
|
+
}
|
|
1922
|
+
.bcc-app-navigation .nav {
|
|
1923
|
+
@apply justify-center items-center flex dark:border-default mx-auto border border-white p-0.5;
|
|
1924
|
+
|
|
1925
|
+
border-radius: 20px;
|
|
1926
|
+
background: linear-gradient(135deg, rgba(255, 255, 255, 0.6) 0%, rgba(243, 244, 246, 0.4) 100%);
|
|
1927
|
+
backdrop-filter: blur(12px) saturate(160%);
|
|
1928
|
+
-webkit-backdrop-filter: blur(12px) saturate(160%);
|
|
1929
|
+
|
|
1930
|
+
max-width: min(96%, var(--container-lg));
|
|
1931
|
+
box-shadow:
|
|
1932
|
+
/* inner bevel (top-left highlight, bottom-right shade) */
|
|
1933
|
+
inset 0 0 32px white,
|
|
1934
|
+
inset 1px 0 4px -1px rgba(0, 0, 0, 0.3),
|
|
1935
|
+
inset 1px -2px 0 -1px white,
|
|
1936
|
+
inset -1px 2px 0 -1px white,
|
|
1937
|
+
0px -1px 1px -2px rgba(16, 24, 40, 0.05),
|
|
1938
|
+
0px 4px 6px -2px rgba(16, 24, 40, 0.05),
|
|
1939
|
+
0px 12px 16px -4px rgba(16, 24, 40, 0.1);
|
|
1940
|
+
}
|
|
1941
|
+
.dark .bcc-app-navigation {
|
|
1942
|
+
@apply backdrop-blur-sm;
|
|
1943
|
+
background: transparent;
|
|
1944
|
+
box-shadow: none;
|
|
1945
|
+
}
|
|
1946
|
+
|
|
1947
|
+
.bcc-app-navigation .navbar-btn {
|
|
1948
|
+
@apply col text-text-subtlest relative h-12 min-w-16 rounded-xl border border-transparent px-2 opacity-90 transition-all focus:outline-none;
|
|
1949
|
+
}
|
|
1950
|
+
|
|
1951
|
+
.bcc-app-navigation .navbar-btn--active {
|
|
1952
|
+
@apply text-brand-default bg-dark-neutral-alpha-500-a border-white opacity-100;
|
|
1953
|
+
box-shadow:
|
|
1954
|
+
/* inner bevel (top-left highlight, bottom-right shade) */
|
|
1955
|
+
inset 1px 0 4px -1px rgba(0, 100, 50, 0.3),
|
|
1956
|
+
inset 1px 2px 0 -1px white,
|
|
1957
|
+
inset -1px -2px 0 -1px white,
|
|
1958
|
+
inset 0 0 1px 0 rgba(0, 100, 50, 0.1),
|
|
1959
|
+
inset 0 -3px 2px 0 rgba(0, 100, 50, 0.1);
|
|
1960
|
+
}
|
|
1961
|
+
|
|
1962
|
+
.dark .bcc-app-navigation .navbar-btn--active {
|
|
1963
|
+
@apply bg-neutral-alpha-500-a text-brand-bold border-transparent;
|
|
1964
|
+
box-shadow:
|
|
1965
|
+
/* inner bevel (top-left highlight, bottom-right shade) */
|
|
1966
|
+
inset 1px 0 4px -1px var(--blue-500),
|
|
1967
|
+
inset 1px 2px 0 -1px var(--blue-900),
|
|
1968
|
+
inset -1px -2px 0 -1px var(--blue-900),
|
|
1969
|
+
inset 0 0 1px 0 var(--blue-300),
|
|
1970
|
+
inset 0 -3px 2px 0 var(--blue-300);
|
|
1971
|
+
}
|
|
1972
|
+
}
|
|
1973
|
+
|
|
1974
|
+
|
|
1870
1975
|
/* from ./BccBadge/BccBadge.css */
|
|
1871
1976
|
@layer components {
|
|
1872
1977
|
.bcc-badge {
|
|
@@ -1878,6 +1983,9 @@ GUTTER FIX
|
|
|
1878
1983
|
.bcc-badge.capital {
|
|
1879
1984
|
@apply inline-flex;
|
|
1880
1985
|
}
|
|
1986
|
+
.bcc-badge.gradient {
|
|
1987
|
+
@apply ctx-gradient;
|
|
1988
|
+
}
|
|
1881
1989
|
.bcc-badge.sm {
|
|
1882
1990
|
@apply w-4 h-4 text-heading-xs;
|
|
1883
1991
|
}
|
|
@@ -2328,78 +2436,74 @@ GUTTER FIX
|
|
|
2328
2436
|
|
|
2329
2437
|
/* from ./BccAvatar/BccAvatar.css */
|
|
2330
2438
|
@layer components {
|
|
2331
|
-
|
|
2332
|
-
|
|
2333
|
-
|
|
2334
|
-
|
|
2335
|
-
|
|
2336
|
-
|
|
2337
|
-
|
|
2338
|
-
.bcc-avatar.M {
|
|
2339
|
-
@apply ctx-blue-subtler;
|
|
2340
|
-
}
|
|
2341
|
-
.bcc-avatar.female,
|
|
2342
|
-
.bcc-avatar.F {
|
|
2343
|
-
@apply ctx-purple-subtler;
|
|
2344
|
-
}
|
|
2345
|
-
.bcc-avatar.male.child,
|
|
2346
|
-
.bcc-avatar.M.child {
|
|
2347
|
-
@apply ctx-teal-subtler;
|
|
2348
|
-
}
|
|
2349
|
-
.bcc-avatar.female.child,
|
|
2350
|
-
.bcc-avatar.F.child {
|
|
2351
|
-
@apply ctx-magenta-subtler;
|
|
2352
|
-
}
|
|
2353
|
-
.bcc-avatar.bordered {
|
|
2354
|
-
@apply border-2 border-ctx;
|
|
2355
|
-
}
|
|
2356
|
-
.bcc-avatar.xs {
|
|
2357
|
-
@apply size-5 text-xs;
|
|
2358
|
-
}
|
|
2359
|
-
.bcc-avatar.sm {
|
|
2360
|
-
@apply size-6 text-sm;
|
|
2361
|
-
}
|
|
2362
|
-
.bcc-avatar.md {
|
|
2363
|
-
@apply size-8 text-base;
|
|
2364
|
-
}
|
|
2365
|
-
.bcc-avatar.lg {
|
|
2366
|
-
@apply size-10 text-lg;
|
|
2367
|
-
}
|
|
2368
|
-
.bcc-avatar.xl {
|
|
2369
|
-
@apply size-12 text-xl;
|
|
2370
|
-
}
|
|
2371
|
-
.bcc-avatar.xxl {
|
|
2372
|
-
@apply size-20 text-3xl;
|
|
2373
|
-
}
|
|
2374
|
-
.bcc-avatar.xxxl {
|
|
2375
|
-
@apply size-24 text-4xl;
|
|
2376
|
-
}
|
|
2439
|
+
.bcc-avatar {
|
|
2440
|
+
--p-avatar-background: var(--ctx-background);
|
|
2441
|
+
--p-avatar-color: var(--ctx-text);
|
|
2442
|
+
--bcc-avatar-border: var(--ctx-border);
|
|
2443
|
+
--p-icon-size: var(--icon-size-sm);
|
|
2444
|
+
@apply ctx-gray-subtler shrink-0 overflow-hidden text-sm;
|
|
2445
|
+
}
|
|
2377
2446
|
|
|
2378
|
-
|
|
2379
|
-
|
|
2380
|
-
|
|
2381
|
-
|
|
2382
|
-
|
|
2383
|
-
|
|
2384
|
-
|
|
2385
|
-
|
|
2386
|
-
|
|
2387
|
-
|
|
2388
|
-
|
|
2389
|
-
|
|
2447
|
+
.bcc-avatar.male,
|
|
2448
|
+
.bcc-avatar.M {
|
|
2449
|
+
@apply ctx-blue-subtler;
|
|
2450
|
+
}
|
|
2451
|
+
.bcc-avatar.female,
|
|
2452
|
+
.bcc-avatar.F {
|
|
2453
|
+
@apply ctx-purple-subtler;
|
|
2454
|
+
}
|
|
2455
|
+
.bcc-avatar.male.child,
|
|
2456
|
+
.bcc-avatar.M.child {
|
|
2457
|
+
@apply ctx-teal-subtler;
|
|
2458
|
+
}
|
|
2459
|
+
.bcc-avatar.female.child,
|
|
2460
|
+
.bcc-avatar.F.child {
|
|
2461
|
+
@apply ctx-magenta-subtler;
|
|
2462
|
+
}
|
|
2463
|
+
.bcc-avatar.bordered {
|
|
2464
|
+
@apply border-ctx border-2;
|
|
2465
|
+
}
|
|
2466
|
+
.bcc-avatar.xs {
|
|
2467
|
+
@apply size-5 text-xs;
|
|
2468
|
+
--p-icon-size: var(--icon-size-xs);
|
|
2469
|
+
}
|
|
2470
|
+
.bcc-avatar.sm {
|
|
2471
|
+
@apply size-6 text-xs;
|
|
2472
|
+
--p-icon-size: var(--icon-size-xs);
|
|
2473
|
+
}
|
|
2474
|
+
/* .bcc-avatar.md {
|
|
2475
|
+
same as default
|
|
2476
|
+
}*/
|
|
2477
|
+
.bcc-avatar.lg {
|
|
2478
|
+
@apply text-md size-10;
|
|
2479
|
+
--p-icon-size: var(--icon-size-md);
|
|
2480
|
+
}
|
|
2481
|
+
.bcc-avatar.xl {
|
|
2482
|
+
@apply size-12 text-xl;
|
|
2483
|
+
--p-icon-size: var(--icon-size-lg);
|
|
2484
|
+
}
|
|
2485
|
+
.bcc-avatar.xxl {
|
|
2486
|
+
@apply size-20 text-3xl;
|
|
2487
|
+
--p-icon-size: var(--icon-size-xl);
|
|
2488
|
+
}
|
|
2489
|
+
.bcc-avatar.xxxl {
|
|
2490
|
+
@apply size-24 text-4xl;
|
|
2491
|
+
--p-icon-size: var(--icon-size-xl);
|
|
2492
|
+
}
|
|
2390
2493
|
|
|
2391
|
-
|
|
2392
|
-
|
|
2393
|
-
|
|
2394
|
-
|
|
2494
|
+
.p-overlaybadge .bcc-avatar.p-avatar-circle.lg ~ .p-badge,
|
|
2495
|
+
.p-overlaybadge .bcc-avatar.p-avatar-circle.xl ~ .p-badge {
|
|
2496
|
+
transform: translate(40%, -40%);
|
|
2497
|
+
}
|
|
2395
2498
|
|
|
2396
|
-
|
|
2397
|
-
|
|
2398
|
-
|
|
2399
|
-
|
|
2499
|
+
.p-overlaybadge .bcc-avatar.p-avatar-circle.xxxl ~ .p-badge,
|
|
2500
|
+
.p-overlaybadge .bcc-avatar.p-avatar-circle.xxl ~ .p-badge {
|
|
2501
|
+
transform: translate(20%, -20%);
|
|
2502
|
+
}
|
|
2400
2503
|
}
|
|
2401
2504
|
|
|
2402
2505
|
|
|
2506
|
+
|
|
2403
2507
|
/* from ./BccTabs/BccTabs.css */
|
|
2404
2508
|
@layer components {
|
|
2405
2509
|
.bcc-tabs-fill.p-tabs {
|
|
@@ -2440,24 +2544,28 @@ GUTTER FIX
|
|
|
2440
2544
|
|
|
2441
2545
|
|
|
2442
2546
|
|
|
2443
|
-
:root,
|
|
2547
|
+
:root,
|
|
2548
|
+
:host {
|
|
2444
2549
|
--font-sans: 'Archivo', system-ui, sans-serif;
|
|
2445
|
-
|
|
2446
|
-
|
|
2447
|
-
|
|
2550
|
+
@apply m-0 p-0 font-sans antialiased;
|
|
2551
|
+
-webkit-font-smoothing: antialiased;
|
|
2552
|
+
-moz-osx-font-smoothing: grayscale;
|
|
2553
|
+
}
|
|
2448
2554
|
|
|
2555
|
+
hr {
|
|
2556
|
+
border-color: var(--color-border-default);
|
|
2449
2557
|
}
|
|
2450
2558
|
|
|
2451
2559
|
b,
|
|
2452
2560
|
strong,
|
|
2453
2561
|
.bold {
|
|
2454
|
-
|
|
2455
|
-
|
|
2562
|
+
font-weight: bold;
|
|
2563
|
+
--ctx-text: var(--ctx-text-bold);
|
|
2456
2564
|
}
|
|
2457
2565
|
|
|
2458
2566
|
/* Disable state */
|
|
2459
2567
|
:disabled,
|
|
2460
2568
|
.disabled {
|
|
2461
|
-
|
|
2462
|
-
|
|
2569
|
+
cursor: not-allowed;
|
|
2570
|
+
pointer-events: none;
|
|
2463
2571
|
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { type Component } from 'vue';
|
|
2
|
+
export type BccAppNavigationItem = {
|
|
3
|
+
key: string;
|
|
4
|
+
link?: string;
|
|
5
|
+
title: string;
|
|
6
|
+
icon: Component;
|
|
7
|
+
pin?: number;
|
|
8
|
+
};
|
|
9
|
+
export type BccAppNavigationProps = {
|
|
10
|
+
items: BccAppNavigationItem[];
|
|
11
|
+
modelValue: BccAppNavigationItem['key'] | null;
|
|
12
|
+
};
|
|
13
|
+
declare const __VLS_export: import("vue").DefineComponent<BccAppNavigationProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
|
|
14
|
+
"update:modelValue": (value: string) => any;
|
|
15
|
+
}, string, import("vue").PublicProps, Readonly<BccAppNavigationProps> & Readonly<{
|
|
16
|
+
"onUpdate:modelValue"?: ((value: string) => any) | undefined;
|
|
17
|
+
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
18
|
+
declare const _default: typeof __VLS_export;
|
|
19
|
+
export default _default;
|
|
@@ -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;
|
|
@@ -38,12 +38,13 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {
|
|
|
38
38
|
"drag:update": () => any;
|
|
39
39
|
"drag:end": () => any;
|
|
40
40
|
}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
41
|
+
"onUpdate:modelValue"?: ((value: number) => any) | undefined;
|
|
41
42
|
"onDrag:start"?: (() => any) | undefined;
|
|
42
43
|
"onDrag:update"?: (() => any) | undefined;
|
|
43
44
|
"onDrag:end"?: (() => any) | undefined;
|
|
44
|
-
"onUpdate:modelValue"?: ((value: number) => any) | undefined;
|
|
45
45
|
}>, {
|
|
46
46
|
size: number;
|
|
47
|
+
duration: number;
|
|
47
48
|
colored: boolean;
|
|
48
49
|
arcWidth: number;
|
|
49
50
|
min: number;
|
|
@@ -51,7 +52,6 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {
|
|
|
51
52
|
steps: number;
|
|
52
53
|
showHandle: boolean;
|
|
53
54
|
hideArrows: boolean;
|
|
54
|
-
duration: number;
|
|
55
55
|
animateRotations: number;
|
|
56
56
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
57
57
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
@@ -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;
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { type Component } from 'vue';
|
|
2
|
+
export type TopNavigationProps = {
|
|
3
|
+
title?: string | (() => string);
|
|
4
|
+
subtitle?: string | (() => string);
|
|
5
|
+
left?: ((...args: unknown[]) => Component | null) | Component | string | 'event-logo';
|
|
6
|
+
right?: ((...args: unknown[]) => Component | null) | Component | string;
|
|
7
|
+
hideBack?: boolean;
|
|
8
|
+
backTitle?: string;
|
|
9
|
+
};
|
|
10
|
+
type __VLS_Props = TopNavigationProps & {
|
|
11
|
+
relative?: boolean;
|
|
12
|
+
fixed?: boolean;
|
|
13
|
+
padded?: boolean;
|
|
14
|
+
transparent?: boolean;
|
|
15
|
+
glass?: boolean;
|
|
16
|
+
backTitle?: string;
|
|
17
|
+
force?: boolean;
|
|
18
|
+
titleLeft?: boolean;
|
|
19
|
+
};
|
|
20
|
+
declare var __VLS_1: {
|
|
21
|
+
title: {
|
|
22
|
+
title: string;
|
|
23
|
+
subtitle: string;
|
|
24
|
+
};
|
|
25
|
+
}, __VLS_13: {}, __VLS_20: {};
|
|
26
|
+
type __VLS_Slots = {} & {
|
|
27
|
+
default?: (props: typeof __VLS_1) => any;
|
|
28
|
+
} & {
|
|
29
|
+
right?: (props: typeof __VLS_13) => any;
|
|
30
|
+
} & {
|
|
31
|
+
bottom?: (props: typeof __VLS_20) => any;
|
|
32
|
+
};
|
|
33
|
+
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
|
|
34
|
+
back: () => any;
|
|
35
|
+
}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
36
|
+
onBack?: (() => any) | undefined;
|
|
37
|
+
}>, {
|
|
38
|
+
hideBack: boolean;
|
|
39
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
40
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
41
|
+
declare const _default: typeof __VLS_export;
|
|
42
|
+
export default _default;
|
|
43
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
44
|
+
new (): {
|
|
45
|
+
$slots: S;
|
|
46
|
+
};
|
|
47
|
+
};
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
* Custom BCC components (not based on PrimeVue).
|
|
3
3
|
* Add new custom components here and export them from this file.
|
|
4
4
|
*/
|
|
5
|
+
export { default as BccAppNavigation } from './BccAppNavigation/BccAppNavigation.vue';
|
|
5
6
|
export { default as BccBadge } from './BccBadge/BccBadge.vue';
|
|
6
7
|
export { default as BccCapacityIndicator } from './BccCapacityIndicator/BccCapacityIndicator.vue';
|
|
7
8
|
export { default as BccCircleLoader } from './BccCircleLoader/BccCircleLoader.vue';
|
|
@@ -14,6 +15,8 @@ export { default as BccReact } from './BccReact/BccReact.vue';
|
|
|
14
15
|
export { default as BccReactEmoji } from './BccReact/BccReactEmoji.vue';
|
|
15
16
|
export { default as BccStepIndicator } from './BccStepIndicator/BccStepIndicator.vue';
|
|
16
17
|
export { default as BccTag } from './BccTag/BccTag.vue';
|
|
18
|
+
export { default as BccTopNavigation } from './BccTopNavigation/BccTopNavigation.vue';
|
|
19
|
+
export type { BccAppNavigationItem, BccAppNavigationProps } from './BccAppNavigation/BccAppNavigation.vue';
|
|
17
20
|
export type { BadgeProps } from './BccBadge/BccBadge.vue';
|
|
18
21
|
export type { CapacityIndicatorProps } from './BccCapacityIndicator/BccCapacityIndicator.vue';
|
|
19
22
|
export type { KnobProps, KnobSlots } from './BccDialKnob/BccDialKnob.vue';
|
|
@@ -24,3 +27,4 @@ export type { NpsScoreProps } from './BccNpsScore/BccNpsScore.vue';
|
|
|
24
27
|
export type { ReactInfo, ReactProps } from './BccReact/types';
|
|
25
28
|
export type { StepIndicatorProps } from './BccStepIndicator/BccStepIndicator.vue';
|
|
26
29
|
export type { TagProps } from './BccTag/BccTag.vue';
|
|
30
|
+
export type { TopNavigationProps } from './BccTopNavigation/BccTopNavigation.vue';
|
|
@@ -12,7 +12,7 @@ export type AvatarProps = Omit<PrimeAvatarProps, 'shape' | 'size'> & {
|
|
|
12
12
|
/** Adds a visible border around the avatar. */
|
|
13
13
|
bordered?: boolean;
|
|
14
14
|
/** Controls the avatar dimensions; maps to CSS size classes (xs through xxl). Default: md */
|
|
15
|
-
size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
|
|
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;
|
|
@@ -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;
|
|
@@ -6,7 +6,10 @@ 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
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';
|
|
9
11
|
export { default as BccInput } from './BccInput.vue';
|
|
12
|
+
export { default as BccMenu } from './BccMenu/BccMenu.vue';
|
|
10
13
|
export { default as BccMessage } from './BccMessage.vue';
|
|
11
14
|
export { default as BccTabs } from './BccTabs/BccTabs.vue';
|
|
12
15
|
export { default as BccToggle } from './BccToggle/BccToggle.vue';
|
|
@@ -15,7 +18,9 @@ export type { AvatarProps } from './BccAvatar/BccAvatar.vue';
|
|
|
15
18
|
export type { ButtonProps } from './BccButton.vue';
|
|
16
19
|
export type { CheckboxProps } from './BccCheckbox.vue';
|
|
17
20
|
export type { ChipProps } from './BccChip/BccChip.vue';
|
|
21
|
+
export type { ImageProps } from './BccImage.vue';
|
|
18
22
|
export type { InputProps } from './BccInput.vue';
|
|
23
|
+
export type { BccMenuItem, MenuProps } from './BccMenu/BccMenu.vue';
|
|
19
24
|
export type { MessageProps } from './BccMessage.vue';
|
|
20
25
|
export type { TabItem, TabsProps } from './BccTabs/BccTabs.vue';
|
|
21
26
|
export type { ToggleProps } from './BccToggle/BccToggle.vue';
|
package/dist-types/index.d.ts
CHANGED
|
@@ -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';
|