@bcc-code/component-library-vue 0.0.0-dev.923fa1b → 0.0.0-dev.9242239

package/dist/theme.css

@@ -1962,29 +1962,27 @@
 	}
 
 	.bcc-app-nav-item {
-		@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;
+		@apply relative flex h-12 flex-1 flex-col items-center justify-center gap-1 transition-colors focus:ring-0 focus:outline-none;
 	}
 
 	.bcc-nav-item-icon {
-		@apply size-6 opacity-50;
+		@apply size-6 icon-subtlest;
 	}
 
 	.bcc-nav-item-badge {
-		@apply absolute top-0 right-1 opacity-75;
+		@apply absolute top-0 right-1;
 	}
 
 	.bcc-nav-item-title {
-		@apply text-heading-xs text-center opacity-50;
+		@apply text-heading-xs text-center text-subtlest opacity-75;
 	}
 
-	.bcc-app-nav-item--active {
-		@apply text-selected;
+	.bcc-app-nav-item--active .bcc-nav-item-title {
+		@apply text-selected opacity-100;
 	}
 
-	.bcc-app-nav-item--active .bcc-nav-item-icon,
-	.bcc-app-nav-item--active .bcc-nav-item-badge,
-	.bcc-app-nav-item--active .bcc-nav-item-title {
-		@apply opacity-100;
+	.bcc-app-nav-item--active .bcc-nav-item-icon {
+		@apply text-selected;
 	}
 }
 
@@ -2142,40 +2140,43 @@
 
 /* from ./BccFrame/BccFrame.css */
 @layer components {
-    .bcc-frame {
-        @apply ctx ctx-default w-full;
-    }
+	.bcc-frame {
+		@apply ctx ctx-default w-full border border-transparent;
+	}
 
-    .bcc-frame.bcc-frame--shadow {
-        @apply shadow shadow-ctx;
-    }
+	.bcc-frame.bcc-frame--shadow {
+		@apply shadow-ctx shadow;
+	}
 
-    .bcc-frame--raised {
-        --ctx-background: var(--color-elevation-surface-raised-default);
-    }
-    .bcc-frame--rounded {
-        @apply rounded-md;
-    }
-    .bcc-frame--raised.bcc-frame--shadow {
-        @apply shadow-raised;
-    }
+	.bcc-frame--raised {
+		--ctx-background: var(--color-elevation-surface-raised-default);
+	}
+	.bcc-frame--rounded {
+		@apply rounded-md;
+	}
+	.bcc-frame--raised.bcc-frame--shadow {
+		@apply shadow-raised dark:border-default;
+	}
 
-    .bcc-frame--overlay {
-        --ctx-background: var(--color-elevation-surface-overlay-default);
-    }
-    .bcc-frame--overlay.bcc-frame--shadow {
-        @apply shadow-overlay;
-    }
+	.bcc-frame--overlay {
+		--ctx-background: var(--color-elevation-surface-overlay-default);
+		@apply border;
+	}
+	.bcc-frame--overlay.bcc-frame--shadow {
+		@apply shadow-overlay dark:border-default;
+	}
 
-    .bcc-frame--sunken {
-        --ctx-background: var(--color-elevation-surface-sunken-default);
-    }
-    .bcc-frame--sunken.bcc-frame--shadow {
-        @apply shadow-inner;
-    }
+	.bcc-frame--sunken {
+		--ctx-background: var(--color-elevation-surface-sunken-default);
+		@apply border;
+	}
+	.bcc-frame--sunken.bcc-frame--shadow {
+		@apply dark:border-default shadow-inner;
+	}
 }
 
 
+
 /* from ./BccGraphic/BccGraphic.css */
 @layer components {
   .bcc-graphic .corner,
@@ -2417,10 +2418,13 @@
 	}
 
 	.bcc-react-emoji-list-item {
-		@apply ctx clickable flex items-center justify-center rounded-full p-1 text-2xl leading-none drop-shadow transition-all hover:scale-105;
+		@apply ctx clickable center h-7 min-w-7 shrink-0 rounded-full p-1 text-lg leading-none drop-shadow transition-all hover:scale-105;
 		/* Default --not-selected */
 		@apply ctx-neutral-subtlest;
 	}
+	.bcc-react-emoji-list-item span {
+		@apply leading-none;
+	}
 	.bcc-react-emoji-list-item.selected {
 		@apply ctx-neutral-subtle;
 	}
@@ -2429,27 +2433,27 @@
 
 
 /* from ./BccTag/BccTag.css */
-
 @layer components {
 	.bcc-tag.bcc-badge {
 		@apply w-auto;
 	}
 	.bcc-tag.bcc-badge.md {
-		@apply font-regular h-6;
+		@apply text-body-md h-6;
 	}
 	.bcc-tag.bcc-badge.sm {
-		@apply font-regular h-5;
+		@apply text-body-sm h-5;
 	}
 	.bcc-tag.bcc-badge.lg {
-		@apply font-regular h-8;
+		@apply text-body-md h-8;
 	}
 	.bcc-tag.bcc-badge.xl {
-		@apply font-regular h-10;
+		@apply text-body-lg h-10;
 	}
 }
 
 
 
+
 /* === ./components/wrapped/styles.css === */
 
 /* from ./BccAvatar/BccAvatar.css */

package/dist-types/components/custom/BccGraphic/BccGraphic.vue.d.ts

@@ -9,6 +9,8 @@ export type GraphicProps = {
     ratio?: AspectRatioStyle;
     /** When true, renders the banner image in grayscale. */
     grayscale?: boolean;
+    /** When true, renders the banner image with a brightness of 150%. */
+    highlight?: boolean;
 };
 export declare const ratioClasses: {
     ultraWide: string;

package/dist-types/components/custom/BccReact/BccReact.vue.d.ts

@@ -1,4 +1,4 @@
-import type { ReactProps } from './types';
+import type { ReactInfo, ReactProps } from './types';
 declare const __VLS_export: import("vue").DefineComponent<ReactProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     toggle: (id: string) => any;
 }, string, import("vue").PublicProps, Readonly<ReactProps> & Readonly<{
@@ -6,6 +6,7 @@ declare const __VLS_export: import("vue").DefineComponent<ReactProps, {}, {}, {}
 }>, {
     placeholder: string;
     top: boolean;
+    emojis: ReactInfo[];
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist-types/components/custom/BccStepIndicator/BccStepIndicator.vue.d.ts

@@ -11,13 +11,13 @@ export type StepIndicatorProps = {
 };
 type __VLS_Props = StepIndicatorProps;
 type __VLS_ModelProps = {
-    modelValue?: number;
+    modelValue?: number | null;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
 declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: number) => any;
+    "update:modelValue": (value: number | null) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:modelValue"?: ((value: number) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: number | null) => any) | undefined;
 }>, {
     context: BCC_CONTEXT;
     hideText: boolean;

package/dist-types/components/custom/BccTag/BccTag.vue.d.ts

@@ -11,6 +11,7 @@ export type TagProps = Omit<BadgeProps, 'value' | 'squared'> & {
     clickable?: boolean;
     /** Label text for the tag when not using the default slot. */
     text?: string;
+    truncate?: boolean;
 };
 declare var __VLS_13: {};
 type __VLS_Slots = {} & {

package/dist-types/components/custom/BccTopNavigation/BccTopNavigation.vue.d.ts

@@ -12,7 +12,7 @@ type __VLS_Props = TopNavigationProps & {
     fixed?: boolean;
     padded?: boolean;
     transparent?: boolean;
-    glass?: boolean;
+    white?: boolean;
     backTitle?: string;
     force?: boolean;
     titleLeft?: boolean;
@@ -22,21 +22,23 @@ declare var __VLS_1: {
         title: string;
         subtitle: string;
     };
-}, __VLS_13: {
+}, __VLS_8: {}, __VLS_15: {
     title: string;
-}, __VLS_15: {
+}, __VLS_17: {
     subtitle: string;
-}, __VLS_17: {}, __VLS_24: {};
+}, __VLS_19: {}, __VLS_26: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 } & {
-    title?: (props: typeof __VLS_13) => any;
+    left?: (props: typeof __VLS_8) => any;
 } & {
-    subtitle?: (props: typeof __VLS_15) => any;
+    title?: (props: typeof __VLS_15) => any;
 } & {
-    right?: (props: typeof __VLS_17) => any;
+    subtitle?: (props: typeof __VLS_17) => any;
 } & {
-    bottom?: (props: typeof __VLS_24) => any;
+    right?: (props: typeof __VLS_19) => any;
+} & {
+    bottom?: (props: typeof __VLS_26) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     back: () => any;

package/dist-types/components/wrapped/BccRadioButton.vue.d.ts

@@ -3,6 +3,7 @@ export type RadioButtonProps = PrimeRadioButtonProps & {
     label?: string;
     labelLeft?: boolean;
     justify?: 'start' | 'center' | 'end' | 'between' | 'around' | 'evenly';
+    labelClass?: string;
 };
 declare var __VLS_6: {};
 type __VLS_Slots = {} & {

package/dist-types/components/wrapped/BccSelectButton.vue.d.ts

@@ -1,12 +1,15 @@
+import type { VueComponent } from '@/types';
 import { type SelectButtonProps as PrimeSelectButtonProps } from 'primevue/selectbutton';
-export type SelectButtonProps = PrimeSelectButtonProps;
+export type SelectButtonProps = PrimeSelectButtonProps & {
+    optionIcon?: string | ((option: unknown) => VueComponent | null);
+};
 declare var __VLS_9: {
     option: any;
 };
 type __VLS_Slots = {} & {
     option?: (props: typeof __VLS_9) => any;
 };
-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>;
+declare const __VLS_base: import("vue").DefineComponent<SelectButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<SelectButtonProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/package.json

@@ -1,105 +1,107 @@
 {
-	"name": "@bcc-code/component-library-vue",
-	"version": "0.0.0-dev.923fa1b",
-	"type": "module",
-	"description": "Extended Vue component library based on PrimeVue and BCC design tokens",
-	"repository": "https://github.com/bcc-code/bcc-design.git",
-	"license": "Apache-2.0",
-	"publishConfig": {
-		"access": "public"
-	},
-	"packageManager": "pnpm@9.15.0",
-	"files": [
-		"dist",
-		"dist-types",
-		"dist-css"
-	],
-	"main": "./dist/component-library.umd.cjs",
-	"module": "./dist/component-library.js",
-	"types": "./dist-types/index.d.ts",
-	"exports": {
-		".": {
-			"import": {
-				"types": "./dist-types/index.d.ts",
-				"default": "./dist/component-library.js"
-			},
-			"require": {
-				"types": "./dist-types/index.d.ts",
-				"default": "./dist/component-library.umd.cjs"
-			}
-		},
-		"./style.css": "./dist/index.css",
-		"./theme.css": "./dist/theme.css",
-		"./archivo-font.css": "./dist/archivo-font.css",
-		"./tailwind.css": "./dist-css/tailwind.css"
-	},
-	"scripts": {
-		"start": "storybook dev -p 6006",
-		"build-storybook": "storybook build",
-		"build": "run-p typecheck build:types build:vite",
-		"build:vite": "rimraf dist && vite build && node scripts/build-theme-css.mjs",
-		"build:types": "rimraf dist-types && vue-tsc -p tsconfig.build.json",
-		"generate:semantic": "node scripts/restructure-semantic-primitives.mjs",
-		"generate:semantic-css": "node scripts/generate-semantic-css.mjs",
-		"generate:context-modes": "node scripts/generate-context-modes.mjs",
-		"generate:context-css": "node scripts/generate-context-css.mjs",
-		"generate": "pnpm run generate:semantic && pnpm run generate:semantic-css && pnpm run generate:context-modes && pnpm run generate:context-css",
-		"sync:primevue-icon-patches": "node scripts/sync-primevue-icon-patches.mjs",
-		"typecheck": "vue-tsc --noEmit",
-		"lint": "eslint src/**/*.ts src/**/*.vue",
-		"lint:fix": "eslint --fix src/**/*.ts src/**/*.vue",
-		"test:unit": "vitest run",
-		"release-channel": "node ./scripts/release-channel.cjs",
-		"create-version": "node ./scripts/version.cjs"
-	},
-	"dependencies": {
-		"@bcc-code/design-tokens": "^5.1.60",
-		"@bcc-code/icons-vue": "^1.4.0",
-		"@primeuix/themes": "^2.0.3",
-		"@tailwindcss/vite": "^4.1.18",
-		"primevue": "^4.5.4",
-		"tailwindcss": "^4.0.0"
-	},
-	"peerDependencies": {
-		"vue": "^3.5.0"
-	},
-	"devDependencies": {
-		"@eslint/js": "^9.39.2",
-		"@primevue/auto-import-resolver": "^4.5.4",
-		"@storybook/addon-docs": "^10.2.8",
-		"@storybook/manager-api": "^8.6.14",
-		"@storybook/theming": "^8.6.14",
-		"@storybook/vue3": "^10.0.0",
-		"@storybook/vue3-vite": "^10.0.0",
-		"@types/node": "^22.0.0",
-		"@vitejs/plugin-vue": "^6.0.0",
-		"@vue/eslint-config-prettier": "^10.2.0",
-		"@vue/test-utils": "^2.4.6",
-		"@vue/tsconfig": "^0.7.0",
-		"autoprefixer": "^10.4.20",
-		"eslint": "^9.39.2",
-		"eslint-plugin-prettier": "^5.5.5",
-		"eslint-plugin-vue": "^10.7.0",
-		"globals": "^17.3.0",
-		"jiti": "^2.6.1",
-		"npm-run-all": "^4.1.5",
-		"postcss": "^8.4.49",
-		"prettier": "^3.8.1",
-		"prettier-plugin-tailwindcss": "^0.7.2",
-		"remark-gfm": "^4.0.0",
-		"rimraf": "^6.0.0",
-		"storybook": "^10.0.0",
-		"typescript": "~5.7.0",
-		"typescript-eslint": "^8.54.0",
-		"unplugin-vue-components": "^31.0.0",
-		"vite": "^7.3.0",
-		"vitest": "^4.0.18",
-		"vue": "^3.5.0",
-		"vue-tsc": "^3.2.4"
-	},
-	"pnpm": {
-		"patchedDependencies": {
-			"@primevue/icons": "patches/@primevue__icons.patch"
-		}
-	}
+  "name": "@bcc-code/component-library-vue",
+  "version": "0.0.0-dev.9242239",
+  "type": "module",
+  "description": "Extended Vue component library based on PrimeVue and BCC design tokens",
+  "repository": "https://github.com/bcc-code/bcc-design.git",
+  "license": "Apache-2.0",
+  "publishConfig": {
+    "access": "public"
+  },
+  "packageManager": "pnpm@9.15.0",
+  "files": [
+    "dist",
+    "dist-types",
+    "dist-css"
+  ],
+  "main": "./dist/component-library.umd.cjs",
+  "module": "./dist/component-library.js",
+  "types": "./dist-types/index.d.ts",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist-types/index.d.ts",
+        "default": "./dist/component-library.js"
+      },
+      "require": {
+        "types": "./dist-types/index.d.ts",
+        "default": "./dist/component-library.umd.cjs"
+      }
+    },
+    "./style.css": "./dist/index.css",
+    "./theme.css": "./dist/theme.css",
+    "./archivo-font.css": "./dist/archivo-font.css",
+    "./tailwind.css": "./dist-css/tailwind.css"
+  },
+  "scripts": {
+    "start": "storybook dev -p 6006",
+    "build-storybook": "storybook build",
+    "build": "run-p typecheck build:types build:vite",
+    "build:vite": "rimraf dist && vite build && node scripts/build-theme-css.mjs",
+    "build:types": "rimraf dist-types && vue-tsc -p tsconfig.build.json",
+    "generate:semantic": "node scripts/restructure-semantic-primitives.mjs",
+    "generate:semantic-css": "node scripts/generate-semantic-css.mjs",
+    "generate:context-modes": "node scripts/generate-context-modes.mjs",
+    "generate:context-css": "node scripts/generate-context-css.mjs",
+    "generate": "pnpm run generate:semantic && pnpm run generate:semantic-css && pnpm run generate:context-modes && pnpm run generate:context-css",
+    "sync:primevue-icon-patches": "node scripts/sync-primevue-icon-patches.mjs",
+    "typecheck": "vue-tsc --noEmit",
+    "lint": "eslint src/**/*.ts src/**/*.vue",
+    "lint:fix": "eslint --fix src/**/*.ts src/**/*.vue",
+    "test:unit": "vitest run",
+    "test:e2e": "playwright test",
+    "release-channel": "node ./scripts/release-channel.cjs",
+    "create-version": "node ./scripts/version.cjs"
+  },
+  "dependencies": {
+    "@bcc-code/design-tokens": "^5.1.80",
+    "@bcc-code/icons-vue": "^1.4.0",
+    "@primeuix/themes": "^2.0.3",
+    "@tailwindcss/vite": "^4.1.18",
+    "primevue": "^4.5.4",
+    "tailwindcss": "^4.0.0"
+  },
+  "peerDependencies": {
+    "vue": "^3.5.0"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.39.2",
+    "@playwright/test": "^1.59.1",
+    "@primevue/auto-import-resolver": "^4.5.4",
+    "@storybook/addon-docs": "^10.3.5",
+    "@storybook/vue3-vite": "^10.3.5",
+    "@types/node": "^22.0.0",
+    "@vitejs/plugin-vue": "^6.0.0",
+    "@vue/eslint-config-prettier": "^10.2.0",
+    "@vue/test-utils": "^2.4.6",
+    "@vue/tsconfig": "^0.7.0",
+    "autoprefixer": "^10.4.20",
+    "eslint": "^9.39.2",
+    "eslint-plugin-prettier": "^5.5.5",
+    "eslint-plugin-vue": "^10.7.0",
+    "globals": "^17.3.0",
+    "http-server": "^14.1.1",
+    "jiti": "^2.6.1",
+    "npm-run-all": "^4.1.5",
+    "postcss": "^8.4.49",
+    "prettier": "^3.8.1",
+    "prettier-plugin-tailwindcss": "^0.7.2",
+    "remark-gfm": "^4.0.0",
+    "rimraf": "^6.0.0",
+    "storybook": "^10.3.5",
+    "tippy.js": "^6.3.7",
+    "typescript": "~5.7.0",
+    "typescript-eslint": "^8.54.0",
+    "unplugin-vue-components": "^31.0.0",
+    "vite": "^7.3.0",
+    "vitest": "^4.0.18",
+    "vue": "^3.5.0",
+    "vue-tsc": "^3.2.4",
+    "eslint-plugin-storybook": "10.3.5"
+  },
+  "pnpm": {
+    "patchedDependencies": {
+      "@primevue/icons": "patches/@primevue__icons.patch"
+    }
+  }
 }