@visitscotland/component-library 5.43.1 → 5.45.0

package/dist/components/src/components/toggle-button/ToggleButton.vue.d.ts

@@ -1,27 +1,179 @@
 declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
-    /**
+    /** ⚠️ Deprecated - use the new props instead.
      * ID for the toggled element
      */
     toggleId: {
         type: StringConstructor;
         default: string;
     };
+    /**
+     * Style variation to give additional meaning
+     * `default|overlay|overlay-strong`.
+     */
+    variant: {
+        type: StringConstructor;
+        default: string;
+        validator: (value: unknown) => any;
+    };
+    /**
+     * The default icon to display
+     */
+    icon: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * The icon for pressed state
+     */
+    pressedIcon: {
+        type: StringConstructor;
+        default: any;
+    };
+    /**
+     * Controlled pressed state (v-model)
+     */
+    modelValue: {
+        type: BooleanConstructor;
+        default: any;
+    };
+    /**
+     * Accessible label for the button
+     */
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Accessible label for pressed state
+     */
+    pressedLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Breakpoint at which button label becomes visible.
+     * Button shows as icon-only below this breakpoint.
+     */
+    labelBreakpoint: {
+        type: StringConstructor;
+        default: any;
+        validator: (value: unknown) => boolean;
+    };
 }>, {}, {
     show: boolean;
-}, {}, {
-    toggleAction(): void;
-}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "toggleAction"[], "toggleAction", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    internalPressed: boolean;
+}, {
+    /**
+     * Checks if this is the legacy button or using new props
+     * Should be removed when ⚠️ deprecated code is removed.
+     */
+    isLegacyMode(): boolean;
+    /**
+     * Pressed state (supports controlled + uncontrolled)
+     */
+    isPressed(): boolean;
+    /**
+     * Button classes
+     */
+    buttonClasses(): {
+        [x: string]: string | boolean;
+        'vs-toggle-button--pressed': boolean;
+    };
+    buttonLabelClasses(): {
+        [x: string]: string;
+    };
+    /**
+     * Current icon displayed
+     */
+    currentIcon(): string;
+    /**
+     * Accessible label based on state
+     */
+    computedLabel(): string;
+}, {
+    /**
+     * Emits toggleAction event for legacy button
+     * Should be removed when ⚠️ deprecated code is removed.
+     */
+    toggleLegacy(event: any): void;
     /**
+     * Updates toggle state and emits toggle value and click event
+     */
+    handleClick(event: any): void;
+}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("click" | "update:modelValue" | "toggleAction")[], "click" | "update:modelValue" | "toggleAction", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    /** ⚠️ Deprecated - use the new props instead.
      * ID for the toggled element
      */
     toggleId: {
         type: StringConstructor;
         default: string;
     };
+    /**
+     * Style variation to give additional meaning
+     * `default|overlay|overlay-strong`.
+     */
+    variant: {
+        type: StringConstructor;
+        default: string;
+        validator: (value: unknown) => any;
+    };
+    /**
+     * The default icon to display
+     */
+    icon: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * The icon for pressed state
+     */
+    pressedIcon: {
+        type: StringConstructor;
+        default: any;
+    };
+    /**
+     * Controlled pressed state (v-model)
+     */
+    modelValue: {
+        type: BooleanConstructor;
+        default: any;
+    };
+    /**
+     * Accessible label for the button
+     */
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Accessible label for pressed state
+     */
+    pressedLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Breakpoint at which button label becomes visible.
+     * Button shows as icon-only below this breakpoint.
+     */
+    labelBreakpoint: {
+        type: StringConstructor;
+        default: any;
+        validator: (value: unknown) => boolean;
+    };
 }>> & Readonly<{
+    onClick?: (...args: any[]) => any;
+    "onUpdate:modelValue"?: (...args: any[]) => any;
     onToggleAction?: (...args: any[]) => any;
 }>, {
+    icon: string;
+    variant: string;
+    label: string;
+    modelValue: boolean;
     toggleId: string;
+    pressedIcon: string;
+    pressedLabel: string;
+    labelBreakpoint: string;
 }, {}, {
     VsButton: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
         href: {
@@ -942,6 +1094,483 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             smallSize: string;
         }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
     }, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+    BButton: {
+        new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+            pressed: import('vue').PropType<boolean | undefined>;
+            tag: {
+                type: import('vue').PropType<string>;
+                default: string;
+            };
+            type: {
+                type: import('vue').PropType<import('bootstrap-vue-next').ButtonType>;
+                default: string;
+            };
+            replace: {
+                type: import('vue').PropType<boolean>;
+                default: undefined;
+            };
+            target: {
+                type: import('vue').PropType<import('bootstrap-vue-next').LinkTarget>;
+                default: undefined;
+            };
+            to: {
+                type: import('vue').PropType<import('vue-router').RouteLocationRaw>;
+                default: undefined;
+            };
+            append: {
+                type: import('vue').PropType<boolean>;
+                default: undefined;
+            };
+            disabled: {
+                type: import('vue').PropType<boolean>;
+                default: undefined;
+            };
+            href: {
+                type: import('vue').PropType<string>;
+                default: undefined;
+            };
+            rel: {
+                type: import('vue').PropType<string>;
+                default: undefined;
+            };
+            size: {
+                type: import('vue').PropType<keyof import('bootstrap-vue-next').BaseSize>;
+                default: string;
+            };
+            active: {
+                type: import('vue').PropType<boolean>;
+                default: boolean;
+            };
+            activeClass: {
+                type: import('vue').PropType<string>;
+                default: undefined;
+            };
+            routerComponentName: {
+                type: import('vue').PropType<string>;
+                default: undefined;
+            };
+            variant: {
+                type: import('vue').PropType<keyof import('bootstrap-vue-next').BaseButtonVariant | null>;
+                default: string;
+            };
+            opacity: {
+                type: import('vue').PropType<10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100">;
+                default: undefined;
+            };
+            opacityHover: {
+                type: import('vue').PropType<10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100">;
+                default: undefined;
+            };
+            underlineVariant: {
+                type: import('vue').PropType<keyof import('bootstrap-vue-next').BaseColorVariant | null>;
+                default: undefined;
+            };
+            underlineOffset: {
+                type: import('vue').PropType<1 | 2 | 3 | "1" | "2" | "3">;
+                default: undefined;
+            };
+            underlineOffsetHover: {
+                type: import('vue').PropType<1 | 2 | 3 | "1" | "2" | "3">;
+                default: undefined;
+            };
+            underlineOpacity: {
+                type: import('vue').PropType<0 | "0" | 10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100">;
+                default: undefined;
+            };
+            underlineOpacityHover: {
+                type: import('vue').PropType<0 | "0" | 10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100">;
+                default: undefined;
+            };
+            pill: {
+                type: import('vue').PropType<boolean>;
+                default: boolean;
+            };
+            icon: {
+                type: import('vue').PropType<boolean>;
+                default: undefined;
+            };
+            routerTag: {
+                type: import('vue').PropType<string>;
+                default: undefined;
+            };
+            exactActiveClass: {
+                type: import('vue').PropType<string>;
+                default: undefined;
+            };
+            loading: {
+                type: import('vue').PropType<boolean>;
+                default: boolean;
+            };
+            loadingFill: {
+                type: import('vue').PropType<boolean>;
+                default: boolean;
+            };
+            loadingText: {
+                type: import('vue').PropType<string>;
+                default: string;
+            };
+            squared: {
+                type: import('vue').PropType<boolean>;
+                default: boolean;
+            };
+        }>> & {
+            onClick?: ((value: MouseEvent) => any) | undefined;
+        }, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+            click: (value: MouseEvent) => void;
+        }, import('vue').PublicProps, {
+            tag: string;
+            type: import('bootstrap-vue-next').ButtonType;
+            replace: boolean;
+            target: import('bootstrap-vue-next').LinkTarget;
+            to: import('vue-router').RouteLocationRaw;
+            append: boolean;
+            disabled: boolean;
+            href: string;
+            rel: string;
+            size: keyof import('bootstrap-vue-next').BaseSize;
+            active: boolean;
+            activeClass: string;
+            routerComponentName: string;
+            variant: keyof import('bootstrap-vue-next').BaseButtonVariant | null;
+            opacity: 10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100";
+            opacityHover: 10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100";
+            underlineVariant: keyof import('bootstrap-vue-next').BaseColorVariant | null;
+            underlineOffset: 1 | 2 | 3 | "1" | "2" | "3";
+            underlineOffsetHover: 1 | 2 | 3 | "1" | "2" | "3";
+            underlineOpacity: 0 | "0" | 10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100";
+            underlineOpacityHover: 0 | "0" | 10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100";
+            pill: boolean;
+            icon: boolean;
+            routerTag: string;
+            exactActiveClass: string;
+            loading: boolean;
+            loadingFill: boolean;
+            loadingText: string;
+            squared: boolean;
+        }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<import('vue').ExtractPropTypes<{
+            pressed: import('vue').PropType<boolean | undefined>;
+            tag: {
+                type: import('vue').PropType<string>;
+                default: string;
+            };
+            type: {
+                type: import('vue').PropType<import('bootstrap-vue-next').ButtonType>;
+                default: string;
+            };
+            replace: {
+                type: import('vue').PropType<boolean>;
+                default: undefined;
+            };
+            target: {
+                type: import('vue').PropType<import('bootstrap-vue-next').LinkTarget>;
+                default: undefined;
+            };
+            to: {
+                type: import('vue').PropType<import('vue-router').RouteLocationRaw>;
+                default: undefined;
+            };
+            append: {
+                type: import('vue').PropType<boolean>;
+                default: undefined;
+            };
+            disabled: {
+                type: import('vue').PropType<boolean>;
+                default: undefined;
+            };
+            href: {
+                type: import('vue').PropType<string>;
+                default: undefined;
+            };
+            rel: {
+                type: import('vue').PropType<string>;
+                default: undefined;
+            };
+            size: {
+                type: import('vue').PropType<keyof import('bootstrap-vue-next').BaseSize>;
+                default: string;
+            };
+            active: {
+                type: import('vue').PropType<boolean>;
+                default: boolean;
+            };
+            activeClass: {
+                type: import('vue').PropType<string>;
+                default: undefined;
+            };
+            routerComponentName: {
+                type: import('vue').PropType<string>;
+                default: undefined;
+            };
+            variant: {
+                type: import('vue').PropType<keyof import('bootstrap-vue-next').BaseButtonVariant | null>;
+                default: string;
+            };
+            opacity: {
+                type: import('vue').PropType<10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100">;
+                default: undefined;
+            };
+            opacityHover: {
+                type: import('vue').PropType<10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100">;
+                default: undefined;
+            };
+            underlineVariant: {
+                type: import('vue').PropType<keyof import('bootstrap-vue-next').BaseColorVariant | null>;
+                default: undefined;
+            };
+            underlineOffset: {
+                type: import('vue').PropType<1 | 2 | 3 | "1" | "2" | "3">;
+                default: undefined;
+            };
+            underlineOffsetHover: {
+                type: import('vue').PropType<1 | 2 | 3 | "1" | "2" | "3">;
+                default: undefined;
+            };
+            underlineOpacity: {
+                type: import('vue').PropType<0 | "0" | 10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100">;
+                default: undefined;
+            };
+            underlineOpacityHover: {
+                type: import('vue').PropType<0 | "0" | 10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100">;
+                default: undefined;
+            };
+            pill: {
+                type: import('vue').PropType<boolean>;
+                default: boolean;
+            };
+            icon: {
+                type: import('vue').PropType<boolean>;
+                default: undefined;
+            };
+            routerTag: {
+                type: import('vue').PropType<string>;
+                default: undefined;
+            };
+            exactActiveClass: {
+                type: import('vue').PropType<string>;
+                default: undefined;
+            };
+            loading: {
+                type: import('vue').PropType<boolean>;
+                default: boolean;
+            };
+            loadingFill: {
+                type: import('vue').PropType<boolean>;
+                default: boolean;
+            };
+            loadingText: {
+                type: import('vue').PropType<string>;
+                default: string;
+            };
+            squared: {
+                type: import('vue').PropType<boolean>;
+                default: boolean;
+            };
+        }>> & {
+            onClick?: ((value: MouseEvent) => any) | undefined;
+        }, {}, {}, {}, {}, {
+            tag: string;
+            type: import('bootstrap-vue-next').ButtonType;
+            replace: boolean;
+            target: import('bootstrap-vue-next').LinkTarget;
+            to: import('vue-router').RouteLocationRaw;
+            append: boolean;
+            disabled: boolean;
+            href: string;
+            rel: string;
+            size: keyof import('bootstrap-vue-next').BaseSize;
+            active: boolean;
+            activeClass: string;
+            routerComponentName: string;
+            variant: keyof import('bootstrap-vue-next').BaseButtonVariant | null;
+            opacity: 10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100";
+            opacityHover: 10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100";
+            underlineVariant: keyof import('bootstrap-vue-next').BaseColorVariant | null;
+            underlineOffset: 1 | 2 | 3 | "1" | "2" | "3";
+            underlineOffsetHover: 1 | 2 | 3 | "1" | "2" | "3";
+            underlineOpacity: 0 | "0" | 10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100";
+            underlineOpacityHover: 0 | "0" | 10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100";
+            pill: boolean;
+            icon: boolean;
+            routerTag: string;
+            exactActiveClass: string;
+            loading: boolean;
+            loadingFill: boolean;
+            loadingText: string;
+            squared: boolean;
+        }>;
+        __isFragment?: never;
+        __isTeleport?: never;
+        __isSuspense?: never;
+    } & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+        pressed: import('vue').PropType<boolean | undefined>;
+        tag: {
+            type: import('vue').PropType<string>;
+            default: string;
+        };
+        type: {
+            type: import('vue').PropType<import('bootstrap-vue-next').ButtonType>;
+            default: string;
+        };
+        replace: {
+            type: import('vue').PropType<boolean>;
+            default: undefined;
+        };
+        target: {
+            type: import('vue').PropType<import('bootstrap-vue-next').LinkTarget>;
+            default: undefined;
+        };
+        to: {
+            type: import('vue').PropType<import('vue-router').RouteLocationRaw>;
+            default: undefined;
+        };
+        append: {
+            type: import('vue').PropType<boolean>;
+            default: undefined;
+        };
+        disabled: {
+            type: import('vue').PropType<boolean>;
+            default: undefined;
+        };
+        href: {
+            type: import('vue').PropType<string>;
+            default: undefined;
+        };
+        rel: {
+            type: import('vue').PropType<string>;
+            default: undefined;
+        };
+        size: {
+            type: import('vue').PropType<keyof import('bootstrap-vue-next').BaseSize>;
+            default: string;
+        };
+        active: {
+            type: import('vue').PropType<boolean>;
+            default: boolean;
+        };
+        activeClass: {
+            type: import('vue').PropType<string>;
+            default: undefined;
+        };
+        routerComponentName: {
+            type: import('vue').PropType<string>;
+            default: undefined;
+        };
+        variant: {
+            type: import('vue').PropType<keyof import('bootstrap-vue-next').BaseButtonVariant | null>;
+            default: string;
+        };
+        opacity: {
+            type: import('vue').PropType<10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100">;
+            default: undefined;
+        };
+        opacityHover: {
+            type: import('vue').PropType<10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100">;
+            default: undefined;
+        };
+        underlineVariant: {
+            type: import('vue').PropType<keyof import('bootstrap-vue-next').BaseColorVariant | null>;
+            default: undefined;
+        };
+        underlineOffset: {
+            type: import('vue').PropType<1 | 2 | 3 | "1" | "2" | "3">;
+            default: undefined;
+        };
+        underlineOffsetHover: {
+            type: import('vue').PropType<1 | 2 | 3 | "1" | "2" | "3">;
+            default: undefined;
+        };
+        underlineOpacity: {
+            type: import('vue').PropType<0 | "0" | 10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100">;
+            default: undefined;
+        };
+        underlineOpacityHover: {
+            type: import('vue').PropType<0 | "0" | 10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100">;
+            default: undefined;
+        };
+        pill: {
+            type: import('vue').PropType<boolean>;
+            default: boolean;
+        };
+        icon: {
+            type: import('vue').PropType<boolean>;
+            default: undefined;
+        };
+        routerTag: {
+            type: import('vue').PropType<string>;
+            default: undefined;
+        };
+        exactActiveClass: {
+            type: import('vue').PropType<string>;
+            default: undefined;
+        };
+        loading: {
+            type: import('vue').PropType<boolean>;
+            default: boolean;
+        };
+        loadingFill: {
+            type: import('vue').PropType<boolean>;
+            default: boolean;
+        };
+        loadingText: {
+            type: import('vue').PropType<string>;
+            default: string;
+        };
+        squared: {
+            type: import('vue').PropType<boolean>;
+            default: boolean;
+        };
+    }>> & {
+        onClick?: ((value: MouseEvent) => any) | undefined;
+    }, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+        click: (value: MouseEvent) => void;
+    }, string, {
+        tag: string;
+        type: import('bootstrap-vue-next').ButtonType;
+        replace: boolean;
+        target: import('bootstrap-vue-next').LinkTarget;
+        to: import('vue-router').RouteLocationRaw;
+        append: boolean;
+        disabled: boolean;
+        href: string;
+        rel: string;
+        size: keyof import('bootstrap-vue-next').BaseSize;
+        active: boolean;
+        activeClass: string;
+        routerComponentName: string;
+        variant: keyof import('bootstrap-vue-next').BaseButtonVariant | null;
+        opacity: 10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100";
+        opacityHover: 10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100";
+        underlineVariant: keyof import('bootstrap-vue-next').BaseColorVariant | null;
+        underlineOffset: 1 | 2 | 3 | "1" | "2" | "3";
+        underlineOffsetHover: 1 | 2 | 3 | "1" | "2" | "3";
+        underlineOpacity: 0 | "0" | 10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100";
+        underlineOpacityHover: 0 | "0" | 10 | "10" | 100 | 50 | 25 | 75 | "25" | "50" | "75" | "100";
+        pill: boolean;
+        icon: boolean;
+        routerTag: string;
+        exactActiveClass: string;
+        loading: boolean;
+        loadingFill: boolean;
+        loadingText: string;
+        squared: boolean;
+    }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+        $slots: Readonly<{
+            default?: ((props: Record<string, never>) => any) | undefined;
+            loading?: ((props: Record<string, never>) => any) | undefined;
+            'loading-spinner'?: ((props: Record<string, never>) => any) | undefined;
+        }> & {
+            default?: ((props: Record<string, never>) => any) | undefined;
+            loading?: ((props: Record<string, never>) => any) | undefined;
+            'loading-spinner'?: ((props: Record<string, never>) => any) | undefined;
+        };
+    });
     VsIcon: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
         icon: {
             type: StringConstructor;