@bcc-code/component-library-vue 0.0.0-dev.7252f5d → 0.0.0-dev.7bf4556

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
@@ -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 "@bcc-code/design-tokens/css";
3
+ @import '@bcc-code/design-tokens/css';
4
4
 
5
- @import "tailwindcss";
6
- @import "@bcc-code/design-tokens/tailwind";
7
- @import "@bcc-code/design-tokens/primevue/overrides";
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
- display: inline-block;
652
+ @apply inline-block;
653
+
653
654
  &::first-letter {
654
655
  text-transform: uppercase;
655
656
  }
@@ -1824,36 +1825,78 @@
1824
1825
  /** Custom styles to fix primevue components that are not custom or wrapped. */
1825
1826
 
1826
1827
  /**
1827
- .BccAutocomplete
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
- --p-icon-size: var(--icon-size-sm);
1833
- --p-form-field-sm-font-size: var(--icon-size-sm);
1834
- --p-form-field-lg-font-size: var(--icon-size-md);
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
- flex-grow: 1;
1862
+ flex-grow: 1;
1839
1863
  }
1840
1864
 
1841
- /** Primevue 's component is missing the gap between input and dropdown */
1842
- .p-autocomplete-overlay {
1843
- margin: var(--p-anchor-gutter) 0;
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);
1844
1869
  }
1845
1870
 
1846
1871
  /**
1847
- .BccSelect
1872
+ * BccSelect
1848
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
+ }
1849
1890
 
1850
- /** Primevue 's component is missing the gap between input and dropdown */
1851
- .p-select-overlay.p-component {
1852
- margin: var(--p-anchor-gutter) 0;
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);
1853
1895
  }
1854
1896
 
1855
1897
 
1856
1898
 
1899
+
1857
1900
  /* === ./components/custom/styles.css === */
1858
1901
 
1859
1902
  /* from ./BccBadge/BccBadge.css */
@@ -1863,6 +1906,10 @@
1863
1906
 
1864
1907
  @apply bg-ctx text-ctx;
1865
1908
  }
1909
+
1910
+ .bcc-badge.capital {
1911
+ @apply inline-flex;
1912
+ }
1866
1913
  .bcc-badge.sm {
1867
1914
  @apply w-4 h-4 text-heading-xs;
1868
1915
  }
@@ -1873,7 +1920,7 @@
1873
1920
  @apply w-6 h-6 text-heading-md;
1874
1921
  }
1875
1922
  .bcc-badge.xl {
1876
- @apply w-8 h-8 text-heading-lg;
1923
+ @apply w-8 h-8 text-heading-md;
1877
1924
  }
1878
1925
 
1879
1926
  .bcc-badge .bcc-badge-icon {
@@ -1910,7 +1957,7 @@
1910
1957
  }
1911
1958
 
1912
1959
  .bcc-badge.squared {
1913
- @apply rounded;
1960
+ @apply rounded-sm;
1914
1961
  }
1915
1962
  }
1916
1963
 
@@ -2012,8 +2059,8 @@
2012
2059
  .bcc-frame--raised {
2013
2060
  --ctx-background: var(--color-elevation-surface-raised-default);
2014
2061
  }
2015
- .bcc-frame--raised.rounded {
2016
- @apply rounded;
2062
+ .bcc-frame--rounded {
2063
+ @apply rounded-md;
2017
2064
  }
2018
2065
  .bcc-frame--raised.bcc-frame--shadow {
2019
2066
  @apply shadow-raised;
@@ -2084,43 +2131,53 @@
2084
2131
  @apply relative w-full;
2085
2132
  }
2086
2133
 
2087
- .bcc-nps-result .result-gauge-dial {
2134
+ .bcc-nps-result.xs {
2135
+ @apply w-24;
2136
+ }
2137
+ .bcc-nps-result.sm {
2138
+ @apply w-36;
2139
+ }
2140
+ .bcc-nps-result.md {
2141
+ @apply w-48;
2142
+ }
2143
+ .bcc-nps-result.lg {
2144
+ @apply w-60;
2145
+ }
2146
+ .bcc-nps-result.xl {
2147
+ @apply w-72;
2148
+ }
2149
+
2150
+ .bcc-nps-result .bcc-nps-result-gauge-dial {
2088
2151
  transform-origin: center;
2089
2152
  }
2090
2153
 
2091
- .bcc-nps-result.animated .result-gauge-dial {
2154
+ .bcc-nps-result.animated .bcc-nps-result-gauge-dial {
2092
2155
  transition-delay: 0.3s;
2093
2156
  transition: all .7s cubic-bezier(0, 0, 0.3, 1.5);
2094
2157
  }
2095
2158
 
2096
- .bcc-nps-result-labels.lg {
2097
- @apply bottom-[2em];
2098
- }
2099
2159
  .bcc-nps-result-labels {
2100
- @apply absolute bottom-[1em] flex w-full flex-col items-center justify-center;
2101
- }
2102
- .bcc-nps-result-labels.sm {
2103
- @apply bottom-0;
2160
+ @apply absolute text-base bottom-1/4 translate-y-1/2 flex w-full flex-col items-center justify-center;
2104
2161
  }
2105
2162
 
2106
- .bcc-nps-result-labels.lg .bcc-nps-result-labels--heading {
2107
- @apply text-heading-xl leading-tight;
2108
- }
2109
2163
  .bcc-nps-result-labels--heading {
2110
- @apply text-heading-lg leading-none;
2164
+ @apply text-[1.25em] font-semibold leading-none;
2111
2165
  }
2112
- .bcc-nps-result-labels.sm .bcc-nps-result-labels--heading {
2113
- @apply text-heading-md leading-none;
2166
+ .bcc-nps-result-labels--label {
2167
+ @apply text-[0.75em] text-subtlest;
2114
2168
  }
2115
2169
 
2116
- .bcc-nps-result-labels.lg .bcc-nps-result-labels--label {
2117
- @apply text-body-lg opacity-60;
2170
+ .bcc-nps-result.md .bcc-nps-result-labels {
2171
+ @apply text-lg;
2118
2172
  }
2119
- .bcc-nps-result-labels--label {
2120
- @apply text-body-md opacity-60;
2173
+ .bcc-nps-result.lg .bcc-nps-result-labels {
2174
+ @apply text-xl;
2175
+ }
2176
+ .bcc-nps-result.xl .bcc-nps-result-labels {
2177
+ @apply text-2xl;
2121
2178
  }
2122
- .bcc-nps-result-labels.sm .bcc-nps-result-labels--label {
2123
- @apply text-body-sm;
2179
+ .bcc-nps-result.full .bcc-nps-result-labels {
2180
+ @apply text-lg;
2124
2181
  }
2125
2182
  }
2126
2183
 
@@ -2363,11 +2420,14 @@
2363
2420
  @apply text-5xl;
2364
2421
  }
2365
2422
 
2423
+ .p-overlaybadge .bcc-avatar.p-avatar-circle.lg~.p-badge,
2424
+ .p-overlaybadge .bcc-avatar.p-avatar-circle.xl~.p-badge {
2425
+ transform: translate(40%, -40%);
2426
+ }
2366
2427
 
2367
2428
  .p-overlaybadge .bcc-avatar.p-avatar-circle.xxxl~.p-badge,
2368
- .p-overlaybadge .bcc-avatar.p-avatar-circle.xxl~.p-badge,
2369
- .p-overlaybadge .bcc-avatar.p-avatar-circle.xl~.p-badge {
2370
- transform: translate(25%, -25%);
2429
+ .p-overlaybadge .bcc-avatar.p-avatar-circle.xxl~.p-badge {
2430
+ transform: translate(20%, -20%);
2371
2431
  }
2372
2432
  }
2373
2433
 
@@ -2412,24 +2472,28 @@
2412
2472
 
2413
2473
 
2414
2474
 
2415
- :root, :host {
2475
+ :root,
2476
+ :host {
2416
2477
  --font-sans: 'Archivo', system-ui, sans-serif;
2417
- @apply font-sans antialiased p-0 m-0;
2418
- -webkit-font-smoothing: antialiased;
2419
- -moz-osx-font-smoothing: grayscale;
2478
+ @apply m-0 p-0 font-sans antialiased;
2479
+ -webkit-font-smoothing: antialiased;
2480
+ -moz-osx-font-smoothing: grayscale;
2481
+ }
2420
2482
 
2483
+ hr {
2484
+ border-color: var(--color-border-default);
2421
2485
  }
2422
2486
 
2423
2487
  b,
2424
2488
  strong,
2425
2489
  .bold {
2426
- font-weight: bold;
2427
- --ctx-text: var(--ctx-text-bold);
2490
+ font-weight: bold;
2491
+ --ctx-text: var(--ctx-text-bold);
2428
2492
  }
2429
2493
 
2430
2494
  /* Disable state */
2431
2495
  :disabled,
2432
2496
  .disabled {
2433
- cursor: not-allowed;
2434
- pointer-events: none;
2497
+ cursor: not-allowed;
2498
+ pointer-events: none;
2435
2499
  }
@@ -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?: 'lg' | 'md' | 'sm' | 'xs';
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: "lg" | "md" | "sm" | "xs";
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
3
  steps: string[];
4
- additionalText?: boolean;
5
- showStepLabel?: boolean;
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
- additionalText: boolean;
24
- showStepLabel: boolean;
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,7 +11,7 @@ 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). */
14
+ /** Controls the avatar dimensions; maps to CSS size classes (xs through xxl). Default: md */
15
15
  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
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>;
@@ -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,14 @@
1
+ import type { VueComponent } from '@/types';
2
+ import type { MenuItem } from 'primevue/menuitem';
3
+ /** Menu item model for BccMenu: icon can be a PrimeVue icon class string or a Vue icon component. */
4
+ export type BccMenuItem = Omit<MenuItem, 'icon' | 'items'> & {
5
+ icon?: string | VueComponent;
6
+ items?: BccMenuItem[];
7
+ };
8
+ declare const __VLS_export: import("vue").DefineComponent<{}, {
9
+ toggle: (event: Event, target?: unknown) => void | undefined;
10
+ show: (event: Event, target?: unknown) => void | undefined;
11
+ hide: () => void | undefined;
12
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
13
+ declare const _default: typeof __VLS_export;
14
+ export default _default;
@@ -5,7 +5,9 @@
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';
8
9
  export { default as BccInput } from './BccInput.vue';
10
+ export { default as BccMenu } from './BccMenu/BccMenu.vue';
9
11
  export { default as BccMessage } from './BccMessage.vue';
10
12
  export { default as BccTabs } from './BccTabs/BccTabs.vue';
11
13
  export { default as BccToggle } from './BccToggle/BccToggle.vue';
@@ -13,7 +15,9 @@ export { default as BccToggleButton } from './BccToggleButton.vue';
13
15
  export type { AvatarProps } from './BccAvatar/BccAvatar.vue';
14
16
  export type { ButtonProps } from './BccButton.vue';
15
17
  export type { CheckboxProps } from './BccCheckbox.vue';
18
+ export type { ChipProps } from './BccChip/BccChip.vue';
16
19
  export type { InputProps } from './BccInput.vue';
20
+ export type { BccMenuItem } from './BccMenu/BccMenu.vue';
17
21
  export type { MessageProps } from './BccMessage.vue';
18
22
  export type { TabItem, TabsProps } from './BccTabs/BccTabs.vue';
19
23
  export type { ToggleProps } from './BccToggle/BccToggle.vue';
@@ -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';
@@ -80,7 +80,7 @@ export { default as BccKeyFilter } from 'primevue/keyfilter';
80
80
  export { default as BccKnob } from 'primevue/knob';
81
81
  export { default as BccListbox } from 'primevue/listbox';
82
82
  export { default as BccMegaMenu } from 'primevue/megamenu';
83
- export { default as BccMenu } from 'primevue/menu';
83
+ export { BccMenu, type BccMenuItem } from './components/wrapped';
84
84
  export { default as BccMenubar } from 'primevue/menubar';
85
85
  export { default as BccMeterGroup } from 'primevue/metergroup';
86
86
  export { default as BccMultiSelect } from 'primevue/multiselect';
@@ -116,6 +116,7 @@ export { default as BccStepItem } from 'primevue/stepitem';
116
116
  export { default as BccStepList } from 'primevue/steplist';
117
117
  export { default as BccStepPanel } from 'primevue/steppanel';
118
118
  export { default as BccStepPanels } from 'primevue/steppanels';
119
+ export { default as BccStepper } from 'primevue/stepper';
119
120
  export { default as BccSteps } from 'primevue/steps';
120
121
  export { default as BccStyleClass } from 'primevue/styleclass';
121
122
  export { default as BccTab } from 'primevue/tab';
@@ -137,8 +138,18 @@ export { default as BccTooltip } from 'primevue/tooltip';
137
138
  export { default as BccTree } from 'primevue/tree';
138
139
  export { default as BccTreeSelect } from 'primevue/treeselect';
139
140
  export { default as BccTreeTable } from 'primevue/treetable';
140
- export { default as BccVirtualScroller } from 'primevue/virtualscroller';
141
- export { useConfirm } from 'primevue/useconfirm';
142
141
  export { useDialog } from 'primevue/usedialog';
143
142
  export { useToast } from 'primevue/usetoast';
143
+ export { default as BccVirtualScroller } from 'primevue/virtualscroller';
144
144
  export { default as useAnimatedNumber } from './composables/animatedNumber';
145
+ import type { VueComponent } from './types';
146
+ interface UseConfirmOptions extends Omit<ConfirmationOptions, 'icon' | 'acceptIcon' | 'rejectIcon'> {
147
+ icon?: VueComponent | undefined;
148
+ acceptIcon?: VueComponent | undefined;
149
+ rejectIcon?: VueComponent | undefined;
150
+ }
151
+ type UseConfirmReturn = {
152
+ require: (option: UseConfirmOptions) => void;
153
+ close: () => void;
154
+ };
155
+ export declare function useConfirm(): UseConfirmReturn;
package/package.json CHANGED
@@ -1,102 +1,105 @@
1
1
  {
2
- "name": "@bcc-code/component-library-vue",
3
- "version": "0.0.0-dev.7252f5d",
4
- "type": "module",
5
- "description": "Extended Vue component library based on PrimeVue and BCC design tokens",
6
- "repository": "https://github.com/bcc-code/bcc-design.git",
7
- "license": "Apache-2.0",
8
- "publishConfig": {
9
- "access": "public"
10
- },
11
- "packageManager": "pnpm@9.15.0",
12
- "files": [
13
- "dist",
14
- "dist-types",
15
- "dist-css"
16
- ],
17
- "main": "./dist/component-library.umd.cjs",
18
- "module": "./dist/component-library.js",
19
- "types": "./dist-types/index.d.ts",
20
- "exports": {
21
- ".": {
22
- "import": {
23
- "types": "./dist-types/index.d.ts",
24
- "default": "./dist/component-library.js"
25
- },
26
- "require": {
27
- "types": "./dist-types/index.d.ts",
28
- "default": "./dist/component-library.umd.cjs"
29
- }
30
- },
31
- "./style.css": "./dist/index.css",
32
- "./theme.css": "./dist/theme.css",
33
- "./archivo-font.css": "./dist/archivo-font.css",
34
- "./tailwind.css": "./dist-css/tailwind.css"
35
- },
36
- "scripts": {
37
- "start": "storybook dev -p 6006",
38
- "build-storybook": "storybook build",
39
- "build": "run-p typecheck build:types build:vite",
40
- "build:vite": "rimraf dist && vite build && node scripts/build-theme-css.mjs",
41
- "build:types": "rimraf dist-types && vue-tsc -p tsconfig.build.json",
42
- "generate:semantic": "node scripts/restructure-semantic-primitives.mjs",
43
- "generate:semantic-css": "node scripts/generate-semantic-css.mjs",
44
- "generate:context-modes": "node scripts/generate-context-modes.mjs",
45
- "generate:context-css": "node scripts/generate-context-css.mjs",
46
- "generate": "pnpm run generate:semantic && pnpm run generate:semantic-css && pnpm run generate:context-modes && pnpm run generate:context-css",
47
- "sync:primevue-icon-patches": "node scripts/sync-primevue-icon-patches.mjs",
48
- "typecheck": "vue-tsc --noEmit",
49
- "lint": "eslint src/**/*.ts src/**/*.vue",
50
- "lint:fix": "eslint --fix src/**/*.ts src/**/*.vue",
51
- "test:unit": "vitest run",
52
- "release-channel": "node ./scripts/release-channel.cjs",
53
- "create-version": "node ./scripts/version.cjs"
54
- },
55
- "dependencies": {
56
- "@bcc-code/design-tokens": "^5.1.2",
57
- "@bcc-code/icons-vue": "^1.4.0",
58
- "@primeuix/themes": "^2.0.3",
59
- "@tailwindcss/vite": "^4.1.18",
60
- "primevue": "^4.5.4",
61
- "tailwindcss": "^4.0.0"
62
- },
63
- "peerDependencies": {
64
- "vue": "^3.5.0"
65
- },
66
- "devDependencies": {
67
- "@eslint/js": "^9.39.2",
68
- "@primevue/auto-import-resolver": "^4.5.4",
69
- "@storybook/addon-docs": "^10.2.8",
70
- "@storybook/vue3": "^10.0.0",
71
- "@storybook/vue3-vite": "^10.0.0",
72
- "@types/node": "^22.0.0",
73
- "@vitejs/plugin-vue": "^6.0.0",
74
- "@vue/eslint-config-prettier": "^10.2.0",
75
- "@vue/test-utils": "^2.4.6",
76
- "@vue/tsconfig": "^0.7.0",
77
- "autoprefixer": "^10.4.20",
78
- "eslint": "^9.39.2",
79
- "eslint-plugin-prettier": "^5.5.5",
80
- "eslint-plugin-vue": "^10.7.0",
81
- "globals": "^17.3.0",
82
- "jiti": "^2.6.1",
83
- "npm-run-all": "^4.1.5",
84
- "postcss": "^8.4.49",
85
- "prettier": "^3.8.1",
86
- "prettier-plugin-tailwindcss": "^0.7.2",
87
- "rimraf": "^6.0.0",
88
- "storybook": "^10.0.0",
89
- "typescript": "~5.7.0",
90
- "typescript-eslint": "^8.54.0",
91
- "unplugin-vue-components": "^31.0.0",
92
- "vite": "^7.3.0",
93
- "vitest": "^4.0.18",
94
- "vue": "^3.5.0",
95
- "vue-tsc": "^3.2.4"
96
- },
97
- "pnpm": {
98
- "patchedDependencies": {
99
- "@primevue/icons": "patches/@primevue__icons.patch"
100
- }
101
- }
2
+ "name": "@bcc-code/component-library-vue",
3
+ "version": "0.0.0-dev.7bf4556",
4
+ "type": "module",
5
+ "description": "Extended Vue component library based on PrimeVue and BCC design tokens",
6
+ "repository": "https://github.com/bcc-code/bcc-design.git",
7
+ "license": "Apache-2.0",
8
+ "publishConfig": {
9
+ "access": "public"
10
+ },
11
+ "packageManager": "pnpm@9.15.0",
12
+ "files": [
13
+ "dist",
14
+ "dist-types",
15
+ "dist-css"
16
+ ],
17
+ "main": "./dist/component-library.umd.cjs",
18
+ "module": "./dist/component-library.js",
19
+ "types": "./dist-types/index.d.ts",
20
+ "exports": {
21
+ ".": {
22
+ "import": {
23
+ "types": "./dist-types/index.d.ts",
24
+ "default": "./dist/component-library.js"
25
+ },
26
+ "require": {
27
+ "types": "./dist-types/index.d.ts",
28
+ "default": "./dist/component-library.umd.cjs"
29
+ }
30
+ },
31
+ "./style.css": "./dist/index.css",
32
+ "./theme.css": "./dist/theme.css",
33
+ "./archivo-font.css": "./dist/archivo-font.css",
34
+ "./tailwind.css": "./dist-css/tailwind.css"
35
+ },
36
+ "scripts": {
37
+ "start": "storybook dev -p 6006",
38
+ "build-storybook": "storybook build",
39
+ "build": "run-p typecheck build:types build:vite",
40
+ "build:vite": "rimraf dist && vite build && node scripts/build-theme-css.mjs",
41
+ "build:types": "rimraf dist-types && vue-tsc -p tsconfig.build.json",
42
+ "generate:semantic": "node scripts/restructure-semantic-primitives.mjs",
43
+ "generate:semantic-css": "node scripts/generate-semantic-css.mjs",
44
+ "generate:context-modes": "node scripts/generate-context-modes.mjs",
45
+ "generate:context-css": "node scripts/generate-context-css.mjs",
46
+ "generate": "pnpm run generate:semantic && pnpm run generate:semantic-css && pnpm run generate:context-modes && pnpm run generate:context-css",
47
+ "sync:primevue-icon-patches": "node scripts/sync-primevue-icon-patches.mjs",
48
+ "typecheck": "vue-tsc --noEmit",
49
+ "lint": "eslint src/**/*.ts src/**/*.vue",
50
+ "lint:fix": "eslint --fix src/**/*.ts src/**/*.vue",
51
+ "test:unit": "vitest run",
52
+ "release-channel": "node ./scripts/release-channel.cjs",
53
+ "create-version": "node ./scripts/version.cjs"
54
+ },
55
+ "dependencies": {
56
+ "@bcc-code/design-tokens": "^5.1.34",
57
+ "@bcc-code/icons-vue": "^1.4.0",
58
+ "@primeuix/themes": "^2.0.3",
59
+ "@tailwindcss/vite": "^4.1.18",
60
+ "primevue": "^4.5.4",
61
+ "tailwindcss": "^4.0.0"
62
+ },
63
+ "peerDependencies": {
64
+ "vue": "^3.5.0"
65
+ },
66
+ "devDependencies": {
67
+ "@eslint/js": "^9.39.2",
68
+ "@primevue/auto-import-resolver": "^4.5.4",
69
+ "@storybook/addon-docs": "^10.2.8",
70
+ "@storybook/manager-api": "^8.6.14",
71
+ "@storybook/theming": "^8.6.14",
72
+ "@storybook/vue3": "^10.0.0",
73
+ "@storybook/vue3-vite": "^10.0.0",
74
+ "@types/node": "^22.0.0",
75
+ "@vitejs/plugin-vue": "^6.0.0",
76
+ "@vue/eslint-config-prettier": "^10.2.0",
77
+ "@vue/test-utils": "^2.4.6",
78
+ "@vue/tsconfig": "^0.7.0",
79
+ "autoprefixer": "^10.4.20",
80
+ "eslint": "^9.39.2",
81
+ "eslint-plugin-prettier": "^5.5.5",
82
+ "eslint-plugin-vue": "^10.7.0",
83
+ "globals": "^17.3.0",
84
+ "jiti": "^2.6.1",
85
+ "npm-run-all": "^4.1.5",
86
+ "postcss": "^8.4.49",
87
+ "prettier": "^3.8.1",
88
+ "prettier-plugin-tailwindcss": "^0.7.2",
89
+ "remark-gfm": "^4.0.0",
90
+ "rimraf": "^6.0.0",
91
+ "storybook": "^10.0.0",
92
+ "typescript": "~5.7.0",
93
+ "typescript-eslint": "^8.54.0",
94
+ "unplugin-vue-components": "^31.0.0",
95
+ "vite": "^7.3.0",
96
+ "vitest": "^4.0.18",
97
+ "vue": "^3.5.0",
98
+ "vue-tsc": "^3.2.4"
99
+ },
100
+ "pnpm": {
101
+ "patchedDependencies": {
102
+ "@primevue/icons": "patches/@primevue__icons.patch"
103
+ }
104
+ }
102
105
  }