@bcc-code/component-library-vue 0.0.0-dev.f264081 → 0.0.0-dev.f3f88c3
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 +10446 -8208
- package/dist/component-library.umd.cjs +535 -535
- package/dist/index.css +1 -1
- package/dist/theme.css +141 -104
- package/dist-types/components/custom/BccCapacityIndicator/BccCapacityIndicator.vue.d.ts +3 -0
- package/dist-types/components/wrapped/BccRadioButton.vue.d.ts +18 -0
- package/dist-types/components/wrapped/BccSelectButton.vue.d.ts +17 -0
- package/dist-types/components/wrapped/index.d.ts +4 -0
- package/dist-types/index.d.ts +0 -2
- package/package.json +2 -2
package/dist/theme.css
CHANGED
|
@@ -590,78 +590,83 @@
|
|
|
590
590
|
|
|
591
591
|
/* === ./styles/utilities.css === */
|
|
592
592
|
@utility center {
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
&.top {
|
|
596
|
-
@apply items-start;
|
|
597
|
-
}
|
|
593
|
+
@apply flex items-center justify-center;
|
|
598
594
|
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
595
|
+
&.top {
|
|
596
|
+
@apply items-start;
|
|
597
|
+
}
|
|
602
598
|
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
599
|
+
&.bottom {
|
|
600
|
+
@apply items-end;
|
|
601
|
+
}
|
|
606
602
|
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
603
|
+
&.left {
|
|
604
|
+
@apply justify-start;
|
|
605
|
+
}
|
|
610
606
|
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
607
|
+
&.right {
|
|
608
|
+
@apply justify-end;
|
|
609
|
+
}
|
|
610
|
+
|
|
611
|
+
&.stretch {
|
|
612
|
+
@apply items-stretch;
|
|
613
|
+
}
|
|
614
614
|
}
|
|
615
615
|
|
|
616
616
|
@utility col {
|
|
617
|
-
|
|
617
|
+
@apply flex flex-col items-center justify-center;
|
|
618
618
|
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
619
|
+
&.left {
|
|
620
|
+
@apply items-start;
|
|
621
|
+
}
|
|
622
622
|
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
623
|
+
&.right {
|
|
624
|
+
@apply items-end;
|
|
625
|
+
}
|
|
626
626
|
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
627
|
+
&.top {
|
|
628
|
+
@apply justify-start;
|
|
629
|
+
}
|
|
630
630
|
|
|
631
|
-
|
|
632
|
-
|
|
633
|
-
|
|
631
|
+
&.bottom {
|
|
632
|
+
@apply justify-end;
|
|
633
|
+
}
|
|
634
634
|
}
|
|
635
635
|
|
|
636
636
|
@utility between {
|
|
637
|
-
|
|
637
|
+
@apply justify-between;
|
|
638
638
|
}
|
|
639
639
|
|
|
640
640
|
@utility hide-scrollbar {
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
|
|
641
|
+
-ms-overflow-style: none; /* for Internet Explorer, Edge */
|
|
642
|
+
scrollbar-width: none; /* for Firefox */
|
|
643
|
+
overflow-y: scroll;
|
|
644
644
|
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
645
|
+
&::-webkit-scrollbar {
|
|
646
|
+
display: none; /* for Chrome, Safari, and Opera */
|
|
647
|
+
}
|
|
648
648
|
}
|
|
649
649
|
|
|
650
650
|
/* Capitalize first letter */
|
|
651
651
|
@utility capital {
|
|
652
|
-
|
|
652
|
+
@apply inline-block;
|
|
653
653
|
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
654
|
+
&::first-letter {
|
|
655
|
+
text-transform: uppercase;
|
|
656
|
+
}
|
|
657
|
+
|
|
658
|
+
&.bcc-badge {
|
|
659
|
+
@apply inline-flex;
|
|
660
|
+
}
|
|
657
661
|
}
|
|
658
662
|
|
|
659
663
|
/* Inset 0 */
|
|
660
664
|
@utility inset-0 {
|
|
661
|
-
@apply
|
|
665
|
+
@apply top-0 right-0 bottom-0 left-0;
|
|
662
666
|
}
|
|
663
667
|
|
|
664
668
|
|
|
669
|
+
|
|
665
670
|
/* === ./styles/contexts.css === */
|
|
666
671
|
/* Auto-generated from src/figma-modes. Do not edit by hand. */
|
|
667
672
|
/* Run: pnpm run generate:context-css */
|
|
@@ -1909,6 +1914,19 @@
|
|
|
1909
1914
|
display: none;
|
|
1910
1915
|
}
|
|
1911
1916
|
|
|
1917
|
+
.p-togglebutton {
|
|
1918
|
+
font-size: var(--text-sm);
|
|
1919
|
+
border: 0;
|
|
1920
|
+
}
|
|
1921
|
+
|
|
1922
|
+
.p-togglebutton-sm {
|
|
1923
|
+
font-size: var(--text-sm);
|
|
1924
|
+
}
|
|
1925
|
+
|
|
1926
|
+
.p-togglebutton-lg {
|
|
1927
|
+
font-size: var(--text-md);
|
|
1928
|
+
}
|
|
1929
|
+
|
|
1912
1930
|
|
|
1913
1931
|
|
|
1914
1932
|
|
|
@@ -1917,19 +1935,36 @@
|
|
|
1917
1935
|
/* from ./BccAppNavigation/BccAppNavigation.css */
|
|
1918
1936
|
@layer components {
|
|
1919
1937
|
.bcc-app-nav {
|
|
1920
|
-
@apply sticky inset-x-0 bottom-0 z-20 overflow-visible
|
|
1938
|
+
@apply bg-elevation-surface-default dark:border-brand-800 sticky inset-x-0 bottom-0 z-20 overflow-visible shadow-md sm:rounded-t-xl dark:border-t;
|
|
1921
1939
|
}
|
|
1922
|
-
.bcc-app-nav
|
|
1940
|
+
.bcc-app-nav-container {
|
|
1923
1941
|
@apply center pb-inset-bottom-1 mx-auto max-w-lg pt-1;
|
|
1924
1942
|
}
|
|
1925
1943
|
|
|
1926
|
-
.bcc-app-nav
|
|
1927
|
-
@apply
|
|
1928
|
-
@apply opacity-50;
|
|
1944
|
+
.bcc-app-nav-item {
|
|
1945
|
+
@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;
|
|
1929
1946
|
}
|
|
1930
1947
|
|
|
1931
|
-
.bcc-
|
|
1932
|
-
@apply
|
|
1948
|
+
.bcc-nav-item-icon {
|
|
1949
|
+
@apply size-6 opacity-50;
|
|
1950
|
+
}
|
|
1951
|
+
|
|
1952
|
+
.bcc-nav-item-badge {
|
|
1953
|
+
@apply absolute top-0 right-1 opacity-75;
|
|
1954
|
+
}
|
|
1955
|
+
|
|
1956
|
+
.bcc-nav-item-title {
|
|
1957
|
+
@apply text-heading-xs text-center opacity-50;
|
|
1958
|
+
}
|
|
1959
|
+
|
|
1960
|
+
.bcc-app-nav-item--active {
|
|
1961
|
+
@apply text-selected;
|
|
1962
|
+
}
|
|
1963
|
+
|
|
1964
|
+
.bcc-app-nav-item--active .bcc-nav-item-icon,
|
|
1965
|
+
.bcc-app-nav-item--active .bcc-nav-item-badge,
|
|
1966
|
+
.bcc-app-nav-item--active .bcc-nav-item-title {
|
|
1967
|
+
@apply opacity-100;
|
|
1933
1968
|
}
|
|
1934
1969
|
}
|
|
1935
1970
|
|
|
@@ -1937,67 +1972,66 @@
|
|
|
1937
1972
|
|
|
1938
1973
|
/* from ./BccBadge/BccBadge.css */
|
|
1939
1974
|
@layer components {
|
|
1940
|
-
|
|
1941
|
-
|
|
1942
|
-
|
|
1943
|
-
@apply bg-ctx text-ctx;
|
|
1944
|
-
}
|
|
1975
|
+
.bcc-badge {
|
|
1976
|
+
@apply inline-flex shrink-0 items-center justify-center gap-1 rounded-full leading-none whitespace-nowrap;
|
|
1945
1977
|
|
|
1946
|
-
|
|
1947
|
-
|
|
1948
|
-
|
|
1949
|
-
|
|
1950
|
-
|
|
1951
|
-
|
|
1952
|
-
|
|
1953
|
-
|
|
1954
|
-
|
|
1955
|
-
|
|
1956
|
-
|
|
1957
|
-
|
|
1958
|
-
|
|
1959
|
-
|
|
1960
|
-
|
|
1961
|
-
|
|
1962
|
-
|
|
1963
|
-
}
|
|
1978
|
+
@apply bg-ctx text-ctx;
|
|
1979
|
+
}
|
|
1980
|
+
.bcc-badge.gradient {
|
|
1981
|
+
@apply ctx-gradient;
|
|
1982
|
+
}
|
|
1983
|
+
.bcc-badge.sm {
|
|
1984
|
+
@apply text-heading-xs h-4 w-4;
|
|
1985
|
+
}
|
|
1986
|
+
.bcc-badge.md {
|
|
1987
|
+
@apply text-heading-sm h-5 w-5;
|
|
1988
|
+
}
|
|
1989
|
+
.bcc-badge.lg {
|
|
1990
|
+
@apply text-heading-md h-6 w-6;
|
|
1991
|
+
}
|
|
1992
|
+
.bcc-badge.xl {
|
|
1993
|
+
@apply text-heading-md h-8 w-8;
|
|
1994
|
+
}
|
|
1964
1995
|
|
|
1965
|
-
|
|
1966
|
-
|
|
1967
|
-
|
|
1968
|
-
|
|
1969
|
-
|
|
1970
|
-
|
|
1971
|
-
|
|
1972
|
-
|
|
1973
|
-
|
|
1996
|
+
.bcc-badge .bcc-badge-icon {
|
|
1997
|
+
@apply size-4;
|
|
1998
|
+
}
|
|
1999
|
+
.bcc-badge.lg .bcc-badge-icon {
|
|
2000
|
+
@apply size-5;
|
|
2001
|
+
}
|
|
2002
|
+
.bcc-badge.xl .bcc-badge-icon {
|
|
2003
|
+
@apply size-6;
|
|
2004
|
+
}
|
|
1974
2005
|
|
|
1975
|
-
|
|
1976
|
-
|
|
1977
|
-
|
|
1978
|
-
|
|
1979
|
-
|
|
1980
|
-
|
|
1981
|
-
|
|
1982
|
-
|
|
1983
|
-
|
|
1984
|
-
|
|
1985
|
-
|
|
1986
|
-
|
|
2006
|
+
.bcc-badge.bcc-badge-text {
|
|
2007
|
+
@apply w-auto px-2;
|
|
2008
|
+
}
|
|
2009
|
+
.bcc-badge-text.lg,
|
|
2010
|
+
.bcc-badge-text.xl {
|
|
2011
|
+
@apply px-3;
|
|
2012
|
+
}
|
|
2013
|
+
.bcc-badge-text.border.lg,
|
|
2014
|
+
.bcc-badge-text.border.xl {
|
|
2015
|
+
@apply px-2;
|
|
2016
|
+
}
|
|
2017
|
+
.bcc-badge-text.bordered.lg,
|
|
2018
|
+
.bcc-badge-text.bordered.xl {
|
|
2019
|
+
@apply px-1;
|
|
2020
|
+
}
|
|
1987
2021
|
|
|
1988
|
-
|
|
1989
|
-
|
|
1990
|
-
|
|
1991
|
-
|
|
2022
|
+
.bcc-badge.border {
|
|
2023
|
+
@apply border-1;
|
|
2024
|
+
border-color: var(--ctx-background-pressed);
|
|
2025
|
+
}
|
|
1992
2026
|
|
|
1993
|
-
|
|
1994
|
-
|
|
1995
|
-
|
|
1996
|
-
|
|
2027
|
+
.bcc-badge.bordered {
|
|
2028
|
+
@apply border-2;
|
|
2029
|
+
border-color: var(--ctx-background-pressed);
|
|
2030
|
+
}
|
|
1997
2031
|
|
|
1998
|
-
|
|
1999
|
-
|
|
2000
|
-
|
|
2032
|
+
.bcc-badge.squared {
|
|
2033
|
+
@apply rounded-sm;
|
|
2034
|
+
}
|
|
2001
2035
|
}
|
|
2002
2036
|
|
|
2003
2037
|
|
|
@@ -2046,6 +2080,7 @@
|
|
|
2046
2080
|
|
|
2047
2081
|
.bcc-capacity-indicator.is-warning {
|
|
2048
2082
|
@apply ctx-yellow-subtlest;
|
|
2083
|
+
--bcc-capacity-indicator-circle: var(--ctx-background);
|
|
2049
2084
|
}
|
|
2050
2085
|
|
|
2051
2086
|
.bcc-capacity-indicator.is-full {
|
|
@@ -2516,6 +2551,8 @@
|
|
|
2516
2551
|
@apply m-0 p-0 font-sans antialiased;
|
|
2517
2552
|
-webkit-font-smoothing: antialiased;
|
|
2518
2553
|
-moz-osx-font-smoothing: grayscale;
|
|
2554
|
+
line-height: 1.2;
|
|
2555
|
+
font-kerning: normal;
|
|
2519
2556
|
}
|
|
2520
2557
|
|
|
2521
2558
|
hr {
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { BCC_CONTEXT } from '@/contexts';
|
|
1
2
|
export type CapacityIndicatorProps = {
|
|
2
3
|
/** Total capacity; use -1 for “unlimited” (shows an infinity-style icon instead of a bar). */
|
|
3
4
|
total: number;
|
|
@@ -11,6 +12,8 @@ export type CapacityIndicatorProps = {
|
|
|
11
12
|
squared?: boolean;
|
|
12
13
|
/** When true, applies warning/full color states (e.g. color change at high usage). */
|
|
13
14
|
colored?: boolean;
|
|
15
|
+
/** Design context (e.g. neutral, brand) used for background and text color. */
|
|
16
|
+
context?: BCC_CONTEXT;
|
|
14
17
|
};
|
|
15
18
|
declare const __VLS_export: import("vue").DefineComponent<CapacityIndicatorProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<CapacityIndicatorProps> & Readonly<{}>, {
|
|
16
19
|
size: "xs" | "sm" | "base" | "lg";
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { type RadioButtonProps as PrimeRadioButtonProps } from 'primevue/radiobutton';
|
|
2
|
+
export type RadioButtonProps = PrimeRadioButtonProps & {
|
|
3
|
+
label?: string;
|
|
4
|
+
labelLeft?: boolean;
|
|
5
|
+
};
|
|
6
|
+
declare var __VLS_6: {};
|
|
7
|
+
type __VLS_Slots = {} & {
|
|
8
|
+
default?: (props: typeof __VLS_6) => any;
|
|
9
|
+
};
|
|
10
|
+
declare const __VLS_base: import("vue").DefineComponent<RadioButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<RadioButtonProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
11
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
12
|
+
declare const _default: typeof __VLS_export;
|
|
13
|
+
export default _default;
|
|
14
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
15
|
+
new (): {
|
|
16
|
+
$slots: S;
|
|
17
|
+
};
|
|
18
|
+
};
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { type SelectButtonProps as PrimeSelectButtonProps } from 'primevue/selectbutton';
|
|
2
|
+
export type SelectButtonProps = PrimeSelectButtonProps;
|
|
3
|
+
declare var __VLS_9: {
|
|
4
|
+
option: any;
|
|
5
|
+
};
|
|
6
|
+
type __VLS_Slots = {} & {
|
|
7
|
+
option?: (props: typeof __VLS_9) => any;
|
|
8
|
+
};
|
|
9
|
+
declare const __VLS_base: import("vue").DefineComponent<PrimeSelectButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PrimeSelectButtonProps> & 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
|
+
};
|
|
@@ -11,6 +11,8 @@ export { default as BccImage } from './BccImage.vue';
|
|
|
11
11
|
export { default as BccInput } from './BccInput.vue';
|
|
12
12
|
export { default as BccMenu } from './BccMenu/BccMenu.vue';
|
|
13
13
|
export { default as BccMessage } from './BccMessage.vue';
|
|
14
|
+
export { default as BccRadioButton } from './BccRadioButton.vue';
|
|
15
|
+
export { default as BccSelectButton } from './BccSelectButton.vue';
|
|
14
16
|
export { default as BccTabs } from './BccTabs/BccTabs.vue';
|
|
15
17
|
export { default as BccToggle } from './BccToggle/BccToggle.vue';
|
|
16
18
|
export { default as BccToggleButton } from './BccToggleButton.vue';
|
|
@@ -22,6 +24,8 @@ export type { ImageProps } from './BccImage.vue';
|
|
|
22
24
|
export type { InputProps } from './BccInput.vue';
|
|
23
25
|
export type { BccMenuItem, MenuProps } from './BccMenu/BccMenu.vue';
|
|
24
26
|
export type { MessageProps } from './BccMessage.vue';
|
|
27
|
+
export type { RadioButtonProps } from './BccRadioButton.vue';
|
|
28
|
+
export type { SelectButtonProps } from './BccSelectButton.vue';
|
|
25
29
|
export type { TabItem, TabsProps } from './BccTabs/BccTabs.vue';
|
|
26
30
|
export type { ToggleProps } from './BccToggle/BccToggle.vue';
|
|
27
31
|
export type { ToggleButtonProps } from './BccToggleButton.vue';
|
package/dist-types/index.d.ts
CHANGED
|
@@ -94,7 +94,6 @@ export { default as BccPopover } from 'primevue/popover';
|
|
|
94
94
|
export { default as BccPortal } from 'primevue/portal';
|
|
95
95
|
export { default as BccProgressBar } from 'primevue/progressbar';
|
|
96
96
|
export { default as BccProgressSpinner } from 'primevue/progressspinner';
|
|
97
|
-
export { default as BccRadioButton } from 'primevue/radiobutton';
|
|
98
97
|
export { default as BccRadioButtonGroup } from 'primevue/radiobuttongroup';
|
|
99
98
|
export { default as BccRating } from 'primevue/rating';
|
|
100
99
|
export { default as BccRipple } from 'primevue/ripple';
|
|
@@ -102,7 +101,6 @@ export { default as BccRow } from 'primevue/row';
|
|
|
102
101
|
export { default as BccScrollPanel } from 'primevue/scrollpanel';
|
|
103
102
|
export { default as BccScrollTop } from 'primevue/scrolltop';
|
|
104
103
|
export { default as BccSelect } from 'primevue/select';
|
|
105
|
-
export { default as BccSelectButton } from 'primevue/selectbutton';
|
|
106
104
|
export { default as BccSkeleton } from 'primevue/skeleton';
|
|
107
105
|
export { default as BccSlider } from 'primevue/slider';
|
|
108
106
|
export { default as BccSpeedDial } from 'primevue/speeddial';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bcc-code/component-library-vue",
|
|
3
|
-
"version": "0.0.0-dev.
|
|
3
|
+
"version": "0.0.0-dev.f3f88c3",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "Extended Vue component library based on PrimeVue and BCC design tokens",
|
|
6
6
|
"repository": "https://github.com/bcc-code/bcc-design.git",
|
|
@@ -53,7 +53,7 @@
|
|
|
53
53
|
"create-version": "node ./scripts/version.cjs"
|
|
54
54
|
},
|
|
55
55
|
"dependencies": {
|
|
56
|
-
"@bcc-code/design-tokens": "^5.1.
|
|
56
|
+
"@bcc-code/design-tokens": "^5.1.50",
|
|
57
57
|
"@bcc-code/icons-vue": "^1.4.0",
|
|
58
58
|
"@primeuix/themes": "^2.0.3",
|
|
59
59
|
"@tailwindcss/vite": "^4.1.18",
|