@bcc-code/component-library-vue 1.3.24 → 1.3.25

package/dist/sfc-styles.css

@@ -1 +1 @@
-.p-button.useCtx{--p-button-primary-color:var(--ctx-text);--p-button-primary-background:var(--ctx-background);--p-button-primary-border-color:var(--ctx-border);--p-button-primary-hover-background:var(--ctx-background-hover);--p-button-primary-hover-border-color:var(--ctx-border-hover);--p-button-primary-hover-color:var(--ctx-text-hover);--p-button-primary-active-background:var(--ctx-background-pressed);--p-button-primary-active-border-color:var(--ctx-border-pressed);--p-button-primary-active-color:var(--ctx-text-pressed)}.p-inputicon{--icon-size: 20px;font-size:var(--icon-size);width:var(--icon-size);height:var(--icon-size);margin-top:calc(-1 * (var(--icon-size) / 2))}.p-iconfield:has(.p-inputfield-sm) .p-inputicon{--icon-size: 16px}.p-iconfield:has(.p-inputfield-lg) .p-inputicon{--icon-size: 24px}
+.p-button.useCtx{--p-button-primary-color:var(--ctx-text);--p-button-primary-background:var(--ctx-background);--p-button-primary-border-color:var(--ctx-border);--p-button-primary-hover-background:var(--ctx-background-hover);--p-button-primary-hover-border-color:var(--ctx-border-hover);--p-button-primary-hover-color:var(--ctx-text-hover);--p-button-primary-active-background:var(--ctx-background-pressed);--p-button-primary-active-border-color:var(--ctx-border-pressed);--p-button-primary-active-color:var(--ctx-text-pressed)}.p-inputicon{--icon-size: 20px;font-size:var(--icon-size);width:var(--icon-size);height:var(--icon-size);margin-top:calc(-1 * (var(--icon-size) / 2))}.p-iconfield:has(.p-inputfield-sm) .p-inputicon{--icon-size: 16px}.p-iconfield:has(.p-inputfield-lg) .p-inputicon{--icon-size: 24px}.p-message.no-shadow{box-shadow:none}

package/dist/theme.css

@@ -1798,84 +1798,6 @@
 
 
 
-/* === ./lightbox/BccLightbox.css === */
-@layer components {
-	.bcc-lightbox {
-		@apply fixed inset-0 z-9999 flex touch-none items-center justify-center;
-	}
-
-	.bcc-lightbox__backdrop {
-		@apply absolute inset-0 bg-black/75;
-	}
-
-	.bcc-lightbox__header {
-		@apply top-inset-top pointer-events-none absolute inset-x-0 z-20 flex items-center justify-end gap-3 p-3;
-	}
-
-	.bcc-lightbox__counter {
-		@apply body-sm pointer-events-none mr-auto rounded-md bg-black/50 px-2.5 py-1 text-white;
-	}
-
-	.bcc-lightbox__control {
-		@apply pointer-events-auto flex cursor-pointer items-center justify-center rounded-md border-0 bg-black/50 p-2 text-white transition-colors hover:bg-black/65;
-	}
-
-	.bcc-lightbox__icon {
-		@apply size-6 shrink-0;
-	}
-
-	.bcc-lightbox__nav {
-		@apply absolute top-1/2 z-20 -translate-y-1/2;
-	}
-
-	.bcc-lightbox__nav--prev {
-		@apply left-1 sm:left-3;
-	}
-
-	.bcc-lightbox__nav--next {
-		@apply right-1 sm:right-3;
-	}
-
-	.bcc-lightbox__stage {
-		@apply relative z-10 box-border flex h-full w-full max-w-6xl items-center justify-center px-2 py-14 sm:px-12;
-	}
-
-	.bcc-lightbox__toolbar {
-		@apply center bottom-inset-bottom-4 pointer-events-none absolute z-20 flex gap-1 rounded-md bg-black/50 p-1;
-	}
-
-	.bcc-lightbox__toolbar-btn {
-		@apply pointer-events-auto flex cursor-pointer items-center justify-center rounded-sm border-0 bg-transparent px-3 py-2 text-white transition-colors hover:bg-white/12;
-	}
-
-	.bcc-lightbox__media {
-		@apply flex max-h-[calc(100vh-7rem)] w-full touch-none flex-col items-center justify-center;
-	}
-
-	.bcc-lightbox__media--zoomable {
-		@apply cursor-grab active:cursor-grabbing;
-	}
-
-	.bcc-lightbox__transform {
-		@apply flex origin-center items-center justify-center will-change-transform;
-	}
-
-	.bcc-lightbox__image,
-	.bcc-lightbox__video {
-		@apply block h-auto max-h-[calc(100vh-8rem)] w-auto max-w-[min(92vw,68rem)] object-contain select-none;
-	}
-
-	.bcc-lightbox__video {
-		@apply bg-black;
-	}
-
-	.bcc-lightbox__caption {
-		@apply body-sm mt-3 max-w-[min(92vw,40rem)] text-center text-white;
-	}
-}
-
-
-
 /* === ./components/custom/styles.css === */
 
 /* from ./BccAppNavigation/BccAppNavigation.css */
@@ -2162,7 +2084,7 @@
 /* from ./BccImage/BccImage.css */
 @layer components {
 	.bcc-image {
-		@apply relative inline-block leading-none;
+		@apply relative inline-block overflow-hidden leading-none;
 	}
 
 	.bcc-image__img {
@@ -2185,11 +2107,83 @@
 	.bcc-image__preview-icon {
 		@apply size-6 text-white;
 	}
+}
 
-	@media (width < 750px) {
-		.bcc-image--preview .bcc-image__preview-mask {
-			@apply opacity-100;
-		}
+
+
+/* from ./BccLightbox/BccLightbox.css */
+@layer components {
+	.bcc-lightbox {
+		@apply fixed inset-0 z-9999 flex touch-none items-center justify-center;
+	}
+
+	.bcc-lightbox__backdrop {
+		@apply absolute inset-0 bg-black/75;
+	}
+
+	.bcc-lightbox__header {
+		@apply top-inset-top pointer-events-none absolute inset-x-0 z-20 flex items-center justify-end gap-3 p-3;
+	}
+
+	.bcc-lightbox__counter {
+		@apply body-sm pointer-events-none mr-auto rounded-md bg-black/50 px-2.5 py-1 text-white;
+	}
+
+	.bcc-lightbox__control {
+		@apply pointer-events-auto flex cursor-pointer items-center justify-center rounded-md border-0 bg-black/50 p-2 text-white transition-colors hover:bg-black/65;
+	}
+
+	.bcc-lightbox__icon {
+		@apply size-6 shrink-0;
+	}
+
+	.bcc-lightbox__nav {
+		@apply absolute top-1/2 z-20 -translate-y-1/2;
+	}
+
+	.bcc-lightbox__nav--prev {
+		@apply left-1 sm:left-3;
+	}
+
+	.bcc-lightbox__nav--next {
+		@apply right-1 sm:right-3;
+	}
+
+	.bcc-lightbox__stage {
+		@apply relative z-10 box-border flex h-full w-full max-w-6xl items-center justify-center px-2 py-14 sm:px-12;
+	}
+
+	.bcc-lightbox__toolbar {
+		@apply center bottom-inset-bottom-4 pointer-events-none absolute z-20 flex gap-1 rounded-md bg-black/50 p-1;
+	}
+
+	.bcc-lightbox__toolbar-btn {
+		@apply pointer-events-auto flex cursor-pointer items-center justify-center rounded-sm border-0 bg-transparent px-3 py-2 text-white transition-colors hover:bg-white/12;
+	}
+
+	.bcc-lightbox__media {
+		@apply flex max-h-[calc(100vh-7rem)] w-full touch-none flex-col items-center justify-center;
+	}
+
+	.bcc-lightbox__media--zoomable {
+		@apply cursor-grab active:cursor-grabbing;
+	}
+
+	.bcc-lightbox__transform {
+		@apply flex origin-center items-center justify-center will-change-transform;
+	}
+
+	.bcc-lightbox__image,
+	.bcc-lightbox__video {
+		@apply block h-auto max-h-[calc(100vh-8rem)] w-auto max-w-[min(92vw,68rem)] object-contain select-none;
+	}
+
+	.bcc-lightbox__video {
+		@apply bg-black;
+	}
+
+	.bcc-lightbox__caption {
+		@apply body-sm mt-3 max-w-[min(92vw,40rem)] text-center text-white;
 	}
 }
 
@@ -2429,6 +2423,7 @@
 
 
 
+
 /* === ./components/wrapped/styles.css === */
 
 /* from ./BccAvatar/BccAvatar.css */

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

@@ -1,6 +1,6 @@
 import { type StyleValue } from 'vue';
-import type { LightboxItemInput } from '../../../lightbox/types';
-export type { LightboxItem, LightboxItemInput, LightboxMediaType } from '../../../lightbox/types';
+import type { LightboxItemInput } from '../BccLightbox/types';
+export type { LightboxItem, LightboxItemInput, LightboxMediaType } from '../BccLightbox/types';
 export type ImageProps = {
     /** Image URL for the thumbnail and lightbox (when `imgs` is not set). */
     src?: string;

package/dist-types/{lightbox → components/custom/BccLightbox}/index.d.ts

@@ -1,7 +1,6 @@
 export { default as BccLightbox } from './BccLightbox.vue';
 export { closeBccLightbox, openBccLightbox, useLightbox, usePinchPan } from './composables';
 export { detectMediaType, normalizeLightboxItem, normalizeLightboxItems } from './detectMedia';
-export { canGoNext, canGoPrevious, closeLightbox, goToNextItem, goToPreviousItem, installLightbox, lightboxState, openLightbox, setLightboxIndex, } from './state';
-export type { LightboxState } from './state';
+export { installBccLightbox, LightboxStore } from './state';
 export { LIGHTBOX_KEY } from './types';
-export type { LightboxApi, LightboxItem, LightboxItemInput, LightboxMediaType, LightboxOpenOptions } from './types';
+export type { LightboxApi, LightboxItem, LightboxItemInput, LightboxMediaType, LightboxOpenOptions, LightboxState, } from './types';

package/dist-types/components/custom/BccLightbox/state.d.ts

@@ -0,0 +1,33 @@
+import type { App } from 'vue';
+import { type LightboxOpenOptions } from './types';
+export declare function openLightbox(options: LightboxOpenOptions): void;
+export declare function closeLightbox(): void;
+declare function setLightboxIndex(index: number): void;
+declare function goToPreviousItem(): void;
+declare function goToNextItem(): void;
+declare function canGoPrevious(): boolean;
+declare function canGoNext(): boolean;
+export declare const LightboxStore: {
+    state: {
+        readonly visible: boolean;
+        readonly items: readonly {
+            readonly src: string;
+            readonly type?: import("./types").LightboxMediaType | undefined;
+            readonly alt?: string | undefined;
+            readonly title?: string | undefined;
+            readonly poster?: string | undefined;
+        }[];
+        readonly index: number;
+        readonly loop: boolean;
+        readonly maskClosable: boolean;
+    };
+    openLightbox: typeof openLightbox;
+    closeLightbox: typeof closeLightbox;
+    setLightboxIndex: typeof setLightboxIndex;
+    goToPreviousItem: typeof goToPreviousItem;
+    goToNextItem: typeof goToNextItem;
+    canGoPrevious: typeof canGoPrevious;
+    canGoNext: typeof canGoNext;
+};
+export declare function installBccLightbox(app: App): void;
+export {};

package/dist-types/{lightbox → components/custom/BccLightbox}/types.d.ts

@@ -17,6 +17,13 @@ export type LightboxOpenOptions = {
     onShow?: () => void;
     onHide?: () => void;
 };
+export type LightboxState = {
+    visible: boolean;
+    items: LightboxItem[];
+    index: number;
+    loop: boolean;
+    maskClosable: boolean;
+};
 export type LightboxApi = {
     open: (options: LightboxOpenOptions) => void;
     close: () => void;

package/dist-types/components/custom/index.d.ts

@@ -2,6 +2,7 @@
  * Custom BCC components (not based on PrimeVue).
  * Add new custom components here and export them from this file.
  */
+export * from './BccLightbox';
 export { default as BccAppNavigation } from './BccAppNavigation/BccAppNavigation.vue';
 export { default as BccBadge } from './BccBadge/BccBadge.vue';
 export { default as BccCapacityIndicator } from './BccCapacityIndicator/BccCapacityIndicator.vue';

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

@@ -5,6 +5,7 @@ export type MessageProps = Omit<PrimeMessageProps, 'icon'> & {
     iconRight?: VueComponent | boolean;
     title?: string;
     message?: string;
+    noShadow?: boolean;
 };
 declare var __VLS_19: {}, __VLS_21: {}, __VLS_23: {};
 type __VLS_Slots = {} & {

package/dist-types/index.d.ts

@@ -23,7 +23,6 @@ export { BCC_CONTEXTS, type BCC_CONTEXT } from './contexts';
 export { default as BccComponentLibrary } from './setup';
 export * from './types';
 export * from './components/custom';
-export * from './lightbox';
 export * from './components/wrapped';
 export { default as BccAccordion } from 'primevue/accordion';
 export { default as BccAccordionContent } from 'primevue/accordioncontent';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bcc-code/component-library-vue",
-  "version": "1.3.24",
+  "version": "1.3.25",
   "type": "module",
   "description": "Extended Vue component library based on PrimeVue and BCC design tokens",
   "repository": "https://github.com/bcc-code/bcc-design.git",

package/dist-types/lightbox/state.d.ts

@@ -1,30 +0,0 @@
-import type { App } from 'vue';
-import { type LightboxItem, type LightboxOpenOptions } from './types';
-export type LightboxState = {
-    visible: boolean;
-    items: LightboxItem[];
-    index: number;
-    loop: boolean;
-    maskClosable: boolean;
-};
-export declare const lightboxState: {
-    readonly visible: boolean;
-    readonly items: readonly {
-        readonly src: string;
-        readonly type?: import("./types").LightboxMediaType | undefined;
-        readonly alt?: string | undefined;
-        readonly title?: string | undefined;
-        readonly poster?: string | undefined;
-    }[];
-    readonly index: number;
-    readonly loop: boolean;
-    readonly maskClosable: boolean;
-};
-export declare function openLightbox(options: LightboxOpenOptions): void;
-export declare function closeLightbox(): void;
-export declare function setLightboxIndex(index: number): void;
-export declare function goToPreviousItem(): void;
-export declare function goToNextItem(): void;
-export declare function canGoPrevious(): boolean;
-export declare function canGoNext(): boolean;
-export declare function installLightbox(app: App): void;