@visitscotland/component-library 3.3.8 → 4.0.0

package/dist/components/components/caption/Caption.vue.d.ts

@@ -8,6 +8,15 @@ declare const _default: import('vue').DefineComponent<{
         default: string;
         validator: (value: unknown) => any;
     };
+    /**
+     * Colour theme of the caption
+     * `bold, subtle`
+     */
+    theme: {
+        type: StringConstructor;
+        default: string;
+        validator: (value: unknown) => any;
+    };
     /**
      * The image latitude
      */
@@ -49,13 +58,14 @@ declare const _default: import('vue').DefineComponent<{
         "vs-color-background-accent-lavender": string;
         "vs-color-background-accent-etive": string;
         "vs-color-background-accent-heather": string;
+        /**
+         * Colour theme of the caption
+         * `bold, subtle`
+         */
         "vs-color-background-accent-glencoe": string;
         "vs-color-background-accent-bog-myrtle": string;
         "vs-color-background-accent-kelp": string;
-        "vs-color-background-accent-unicorn": string; /**
-         * Option to choose text alignment
-         * `left, right`
-         */
+        "vs-color-background-accent-unicorn": string;
         "vs-color-background-accent-foxglove": string;
         "vs-color-background-accent-cuillin": string;
         "vs-color-background-accent-cranachan": string;
@@ -75,6 +85,12 @@ declare const _default: import('vue').DefineComponent<{
         "vs-color-background-accent-grey-03": string;
         "vs-color-background-accent-grey-04": string;
         "vs-color-background-accent-grey-05": string;
+        "vs-color-new-background-primary": string;
+        "vs-color-new-background-secondary": string;
+        "vs-color-new-background-bold": string;
+        "vs-color-new-background-brand": string;
+        "vs-color-interaction-cta-subtle-hover": string;
+        "vs-color-interaction-cta-primary": string;
         "vs-color-border": string;
         "vs-color-border-primary": string;
         "vs-color-border-primary-hover": string;
@@ -149,6 +165,10 @@ declare const _default: import('vue').DefineComponent<{
         "vs-color-icon-accent-grey-03": string;
         "vs-color-icon-accent-grey-04": string;
         "vs-color-icon-accent-grey-05": string;
+        "vs-color-interaction-disabled": string;
+        "vs-color-interaction-cta-hover": string;
+        "vs-color-interaction-cta-active": string;
+        "vs-color-interaction-cta-subtle-active": string;
         "vs-color-link": string;
         "vs-color-link-pressed": string;
         "vs-color-text-visited": string;
@@ -189,6 +209,14 @@ declare const _default: import('vue').DefineComponent<{
         "vs-color-text-accent-buachaille": string;
         "vs-color-text-accent-gorse": string;
         "vs-color-text-accent-limestone": string;
+        "vs-color-new-text-primary": string;
+        "vs-color-new-text-secondary": string;
+        "vs-color-new-text-inverse": string;
+        "vs-color-new-text-tertiary": string;
+        "vs-color-new-text-danger": string;
+        "vs-color-new-text-disabled": string;
+        "vs-color-new-text-cta-on-light": string;
+        "vs-color-new-text-brand": string;
         "vs-elevation-shadow-raised": string;
         "vs-elevation-shadow-overlay": string;
         "vs-elevation-surface": string;
@@ -214,9 +242,8 @@ declare const _default: import('vue').DefineComponent<{
         font_weight_semi_bold: string;
         font_weight_normal: string;
         font_weight_light: string;
-        font_family_sans_serif: string;
-        headings_font_family: string;
-        headings_font_family_thin: string;
+        "font-family-sans-serif": string;
+        "display-font-family": string;
         icon_size_xxs: string;
         icon_size_xs: string;
         icon_size_sm: string;
@@ -242,19 +269,20 @@ declare const _default: import('vue').DefineComponent<{
         breakpoint_xxl: string;
         "vs-box-shadow-focus": string;
         "vs-box-shadow-focus-on-dark": string;
-        "font-size-h1": string;
-        "font-size-h1-md": string;
-        "font-size-h2": string;
-        "font-size-h2-md": string;
-        "font-size-h3": string;
-        "font-size-h3-md": string;
-        "font-size-h4": string;
-        "font-size-h5": string;
-        "font-size-h5-md": string;
-        "font-size-h6": string;
-        "font-size-h6-md": string;
-        "font-size-h3-sub": string;
-        "font-size-h2-sub": string;
+        "display-l": string;
+        "display-m": string;
+        "display-s": string;
+        "display-xs": string;
+        "heading-xxl": string;
+        "heading-xl": string;
+        "heading-l": string;
+        "heading-m": string;
+        "heading-s": string;
+        "heading-xs": string;
+        "heading-xxs": string;
+        "sub-heading-l": string;
+        "sub-heading-m": string;
+        "sub-heading-s": string;
         letter_spacing_xxl: string;
         letter_spacing_xl: string;
         letter_spacing_l: string;
@@ -282,30 +310,24 @@ declare const _default: import('vue').DefineComponent<{
         "spacer-500": string;
         "spacer-600": string;
         "spacer-700": string;
-        "spacer-1": string;
-        "spacer-2": string;
-        "spacer-3": string;
-        "spacer-4": string;
-        "spacer-5": string;
-        "spacer-6": string;
-        "spacer-7": string;
-        "spacer-8": string;
-        "spacer-9": string;
-        "spacer-10": string;
-        "spacer-11": string;
-        "spacer-12": string;
-        line_height_lead: string;
-        line_height_xl: string;
-        line_height_l: string;
         line_height_m: string;
+        line_height_xl: string;
         line_height_s: string;
-        line_height_standard: string;
+        "line-height-sub-heading": string;
         line_height_xs: string;
+        line_height_lead: string;
+        line_height_standard: string;
+        "line-height-body": string;
+        "line-height-heading": string;
+        line_height_l: string;
         grid_columns: string;
         grid_gutter_width: string;
         no_javascript: string;
         theme_dark: string;
         theme_grey: string;
+        "tracking-heading": string;
+        "tracking-sub-heading": string;
+        "tracking-body": string;
     };
 }, {
     showMap(): boolean;
@@ -324,6 +346,15 @@ declare const _default: import('vue').DefineComponent<{
         default: string;
         validator: (value: unknown) => any;
     };
+    /**
+     * Colour theme of the caption
+     * `bold, subtle`
+     */
+    theme: {
+        type: StringConstructor;
+        default: string;
+        validator: (value: unknown) => any;
+    };
     /**
      * The image latitude
      */
@@ -349,6 +380,7 @@ declare const _default: import('vue').DefineComponent<{
     };
 }>>, {
     variant: string;
+    theme: string;
     latitude: string;
     longitude: string;
     textAlign: string;

package/dist/components/components/carbon-calculator/components/CarbonCalculatorResults.vue.d.ts

@@ -110,16 +110,17 @@ declare const _default: import('vue').DefineComponent<{
         "vs-color-background-accent-grey-03": string;
         "vs-color-background-accent-grey-04": string;
         "vs-color-background-accent-grey-05": string;
+        "vs-color-new-background-primary": string;
+        "vs-color-new-background-secondary": string;
+        "vs-color-new-background-bold": string;
+        "vs-color-new-background-brand": string;
+        "vs-color-interaction-cta-subtle-hover": string;
+        "vs-color-interaction-cta-primary": string;
         "vs-color-border": string;
         "vs-color-border-primary": string;
         "vs-color-border-primary-hover": string;
         "vs-color-border-input": string;
-        "vs-color-border-bold": string; /**
-         * Language locale string. Used to determine correct formatting for numbers (decimal
-         * delimeter)
-         *
-         * Example: "en-gb"
-         */
+        "vs-color-border-bold": string;
         "vs-color-border-focus": string;
         "vs-color-border-disabled": string;
         "vs-color-border-tertiary": string;
@@ -189,6 +190,10 @@ declare const _default: import('vue').DefineComponent<{
         "vs-color-icon-accent-grey-03": string;
         "vs-color-icon-accent-grey-04": string;
         "vs-color-icon-accent-grey-05": string;
+        "vs-color-interaction-disabled": string;
+        "vs-color-interaction-cta-hover": string;
+        "vs-color-interaction-cta-active": string;
+        "vs-color-interaction-cta-subtle-active": string;
         "vs-color-link": string;
         "vs-color-link-pressed": string;
         "vs-color-text-visited": string;
@@ -229,6 +234,14 @@ declare const _default: import('vue').DefineComponent<{
         "vs-color-text-accent-buachaille": string;
         "vs-color-text-accent-gorse": string;
         "vs-color-text-accent-limestone": string;
+        "vs-color-new-text-primary": string;
+        "vs-color-new-text-secondary": string;
+        "vs-color-new-text-inverse": string;
+        "vs-color-new-text-tertiary": string;
+        "vs-color-new-text-danger": string;
+        "vs-color-new-text-disabled": string;
+        "vs-color-new-text-cta-on-light": string;
+        "vs-color-new-text-brand": string;
         "vs-elevation-shadow-raised": string;
         "vs-elevation-shadow-overlay": string;
         "vs-elevation-surface": string;
@@ -254,9 +267,8 @@ declare const _default: import('vue').DefineComponent<{
         font_weight_semi_bold: string;
         font_weight_normal: string;
         font_weight_light: string;
-        font_family_sans_serif: string;
-        headings_font_family: string;
-        headings_font_family_thin: string;
+        "font-family-sans-serif": string;
+        "display-font-family": string;
         icon_size_xxs: string;
         icon_size_xs: string;
         icon_size_sm: string;
@@ -282,19 +294,20 @@ declare const _default: import('vue').DefineComponent<{
         breakpoint_xxl: string;
         "vs-box-shadow-focus": string;
         "vs-box-shadow-focus-on-dark": string;
-        "font-size-h1": string;
-        "font-size-h1-md": string;
-        "font-size-h2": string;
-        "font-size-h2-md": string;
-        "font-size-h3": string;
-        "font-size-h3-md": string;
-        "font-size-h4": string;
-        "font-size-h5": string;
-        "font-size-h5-md": string;
-        "font-size-h6": string;
-        "font-size-h6-md": string;
-        "font-size-h3-sub": string;
-        "font-size-h2-sub": string;
+        "display-l": string;
+        "display-m": string;
+        "display-s": string;
+        "display-xs": string;
+        "heading-xxl": string;
+        "heading-xl": string;
+        "heading-l": string;
+        "heading-m": string;
+        "heading-s": string;
+        "heading-xs": string;
+        "heading-xxs": string;
+        "sub-heading-l": string;
+        "sub-heading-m": string;
+        "sub-heading-s": string;
         letter_spacing_xxl: string;
         letter_spacing_xl: string;
         letter_spacing_l: string;
@@ -322,30 +335,24 @@ declare const _default: import('vue').DefineComponent<{
         "spacer-500": string;
         "spacer-600": string;
         "spacer-700": string;
-        "spacer-1": string;
-        "spacer-2": string;
-        "spacer-3": string;
-        "spacer-4": string;
-        "spacer-5": string;
-        "spacer-6": string;
-        "spacer-7": string;
-        "spacer-8": string;
-        "spacer-9": string;
-        "spacer-10": string;
-        "spacer-11": string;
-        "spacer-12": string;
-        line_height_lead: string;
-        line_height_xl: string;
-        line_height_l: string;
         line_height_m: string;
+        line_height_xl: string;
         line_height_s: string;
-        line_height_standard: string;
+        "line-height-sub-heading": string;
         line_height_xs: string;
+        line_height_lead: string;
+        line_height_standard: string;
+        "line-height-body": string;
+        "line-height-heading": string;
+        line_height_l: string;
         grid_columns: string;
         grid_gutter_width: string;
         no_javascript: string;
         theme_dark: string;
         theme_grey: string;
+        "tracking-heading": string;
+        "tracking-sub-heading": string;
+        "tracking-body": string;
     };
 }, {
     /**

package/dist/components/components/heading/Heading.vue.d.ts

@@ -9,33 +9,19 @@ declare const _default: import('vue').DefineComponent<{
         validator: (value: unknown) => any;
     };
     /**
-     * Use the thin font
+     * The heading style used for the heading.
+     * `display-l|display-m|display-s|display-xs|heading-xxl|heading-xl|
+     * heading-l|heading-m|heading-s|heading-xs|heading-xxs`
      */
-    thin: {
-        type: BooleanConstructor;
-    };
-    /**
-     * Alternative font
-     */
-    alternative: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Heading override style
-     * `1|2|3|4|5|6`
-     */
-    overrideStyleLevel: {
+    headingStyle: {
         type: (StringConstructor | NumberConstructor)[];
-        default: any;
+        required: true;
         validator: (value: unknown) => any;
     };
 }, any, any, {
     hasSubtitle(): boolean;
-    headingClasses(): (string | {
-        'vs-heading--thin': any;
-        'vs-heading--alternative': any;
-    })[];
+    headingClasses(): string[];
+    subHeadingClass(): string;
     type(): string;
 }, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     /**
@@ -48,31 +34,16 @@ declare const _default: import('vue').DefineComponent<{
         validator: (value: unknown) => any;
     };
     /**
-     * Use the thin font
-     */
-    thin: {
-        type: BooleanConstructor;
-    };
-    /**
-     * Alternative font
-     */
-    alternative: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Heading override style
-     * `1|2|3|4|5|6`
+     * The heading style used for the heading.
+     * `display-l|display-m|display-s|display-xs|heading-xxl|heading-xl|
+     * heading-l|heading-m|heading-s|heading-xs|heading-xxs`
      */
-    overrideStyleLevel: {
+    headingStyle: {
         type: (StringConstructor | NumberConstructor)[];
-        default: any;
+        required: true;
         validator: (value: unknown) => any;
     };
 }>>, {
     level: string | number;
-    thin: boolean;
-    alternative: boolean;
-    overrideStyleLevel: string | number;
 }, {}>;
 export default _default;

package/dist/components/components/hero-section/HeroSection.vue.d.ts

@@ -0,0 +1,116 @@
+declare const _default: import('vue').DefineComponent<{
+    /**
+    * Whether the image should sit in a container or not
+    */
+    inset: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+    * The text for the heading
+    */
+    heading: {
+        type: StringConstructor;
+        default: string;
+        required: true;
+    };
+    /**
+    * The text for the summary
+    */
+    lede: {
+        type: StringConstructor;
+        default: string;
+        required: true;
+    };
+    /**
+    * The image src url to display
+    */
+    src: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+    * The alt text for the image if applicable
+    */
+    imgAlt: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+    * The caption text for the image
+    */
+    imgCaption: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+    * The author credit for the image
+    */
+    imgCredit: {
+        type: StringConstructor;
+        default: string;
+    };
+}, any, any, {
+    setInset(): "" | "container";
+}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    /**
+    * Whether the image should sit in a container or not
+    */
+    inset: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+    * The text for the heading
+    */
+    heading: {
+        type: StringConstructor;
+        default: string;
+        required: true;
+    };
+    /**
+    * The text for the summary
+    */
+    lede: {
+        type: StringConstructor;
+        default: string;
+        required: true;
+    };
+    /**
+    * The image src url to display
+    */
+    src: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+    * The alt text for the image if applicable
+    */
+    imgAlt: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+    * The caption text for the image
+    */
+    imgCaption: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+    * The author credit for the image
+    */
+    imgCredit: {
+        type: StringConstructor;
+        default: string;
+    };
+}>>, {
+    imgAlt: string;
+    src: string;
+    heading: string;
+    inset: boolean;
+    lede: string;
+    imgCaption: string;
+    imgCredit: string;
+}, {}>;
+export default _default;

package/dist/components/components/hero-section/index.d.ts

@@ -0,0 +1,2 @@
+import { default as VsHeroSection } from './HeroSection.vue';
+export default VsHeroSection;

package/dist/components/components/index.d.ts

@@ -38,6 +38,7 @@ export { default as VsCol } from './grid/Col.vue';
 export { default as VsContainer } from './grid/Container.vue';
 export { default as VsRow } from './grid/Row.vue';
 export { default as VsHeading } from './heading/Heading.vue';
+export { default as VsHeroSection } from './hero-section/HeroSection.vue';
 export { default as VsHtmlError } from './html-error/HtmlError.vue';
 export { default as VsTourismInfo } from './tourism-info/TourismInfo.vue';
 export { default as VsIcon } from './icon/Icon.vue';

package/dist/components/components/mega-nav/MegaNav.vue.d.ts

@@ -114,16 +114,24 @@ declare const _default: import('vue').DefineComponent<{
         "vs-color-background-accent-grey-03": string;
         "vs-color-background-accent-grey-04": string;
         "vs-color-background-accent-grey-05": string;
+        "vs-color-new-background-primary": string; /**
+         * Text that renders inside the clear button
+         * on the search form (sr-only)
+         */
+        "vs-color-new-background-secondary": string;
+        "vs-color-new-background-bold": string;
+        "vs-color-new-background-brand": string;
+        "vs-color-interaction-cta-subtle-hover": string; /**
+         * Text that renders inside the close button on
+         * the search form (sr-only)
+         */
+        "vs-color-interaction-cta-primary": string;
         "vs-color-border": string;
         "vs-color-border-primary": string;
         "vs-color-border-primary-hover": string;
         "vs-color-border-input": string;
         "vs-color-border-bold": string;
         "vs-color-border-focus": string;
-        /**
-         * Text that renders inside the close button on
-         * the search form (sr-only)
-         */
         "vs-color-border-disabled": string;
         "vs-color-border-tertiary": string;
         "vs-color-border-danger": string;
@@ -192,6 +200,10 @@ declare const _default: import('vue').DefineComponent<{
         "vs-color-icon-accent-grey-03": string;
         "vs-color-icon-accent-grey-04": string;
         "vs-color-icon-accent-grey-05": string;
+        "vs-color-interaction-disabled": string;
+        "vs-color-interaction-cta-hover": string;
+        "vs-color-interaction-cta-active": string;
+        "vs-color-interaction-cta-subtle-active": string;
         "vs-color-link": string;
         "vs-color-link-pressed": string;
         "vs-color-text-visited": string;
@@ -232,6 +244,14 @@ declare const _default: import('vue').DefineComponent<{
         "vs-color-text-accent-buachaille": string;
         "vs-color-text-accent-gorse": string;
         "vs-color-text-accent-limestone": string;
+        "vs-color-new-text-primary": string;
+        "vs-color-new-text-secondary": string;
+        "vs-color-new-text-inverse": string;
+        "vs-color-new-text-tertiary": string;
+        "vs-color-new-text-danger": string;
+        "vs-color-new-text-disabled": string;
+        "vs-color-new-text-cta-on-light": string;
+        "vs-color-new-text-brand": string;
         "vs-elevation-shadow-raised": string;
         "vs-elevation-shadow-overlay": string;
         "vs-elevation-surface": string;
@@ -257,9 +277,8 @@ declare const _default: import('vue').DefineComponent<{
         font_weight_semi_bold: string;
         font_weight_normal: string;
         font_weight_light: string;
-        font_family_sans_serif: string;
-        headings_font_family: string;
-        headings_font_family_thin: string;
+        "font-family-sans-serif": string;
+        "display-font-family": string;
         icon_size_xxs: string;
         icon_size_xs: string;
         icon_size_sm: string;
@@ -285,19 +304,20 @@ declare const _default: import('vue').DefineComponent<{
         breakpoint_xxl: string;
         "vs-box-shadow-focus": string;
         "vs-box-shadow-focus-on-dark": string;
-        "font-size-h1": string;
-        "font-size-h1-md": string;
-        "font-size-h2": string;
-        "font-size-h2-md": string;
-        "font-size-h3": string;
-        "font-size-h3-md": string;
-        "font-size-h4": string;
-        "font-size-h5": string;
-        "font-size-h5-md": string;
-        "font-size-h6": string;
-        "font-size-h6-md": string;
-        "font-size-h3-sub": string;
-        "font-size-h2-sub": string;
+        "display-l": string;
+        "display-m": string;
+        "display-s": string;
+        "display-xs": string;
+        "heading-xxl": string;
+        "heading-xl": string;
+        "heading-l": string;
+        "heading-m": string;
+        "heading-s": string;
+        "heading-xs": string;
+        "heading-xxs": string;
+        "sub-heading-l": string;
+        "sub-heading-m": string;
+        "sub-heading-s": string;
         letter_spacing_xxl: string;
         letter_spacing_xl: string;
         letter_spacing_l: string;
@@ -325,30 +345,24 @@ declare const _default: import('vue').DefineComponent<{
         "spacer-500": string;
         "spacer-600": string;
         "spacer-700": string;
-        "spacer-1": string;
-        "spacer-2": string;
-        "spacer-3": string;
-        "spacer-4": string;
-        "spacer-5": string;
-        "spacer-6": string;
-        "spacer-7": string;
-        "spacer-8": string;
-        "spacer-9": string;
-        "spacer-10": string;
-        "spacer-11": string;
-        "spacer-12": string;
-        line_height_lead: string;
-        line_height_xl: string;
-        line_height_l: string;
         line_height_m: string;
+        line_height_xl: string;
         line_height_s: string;
-        line_height_standard: string;
+        "line-height-sub-heading": string;
         line_height_xs: string;
+        line_height_lead: string;
+        line_height_standard: string;
+        "line-height-body": string;
+        "line-height-heading": string;
+        line_height_l: string;
         grid_columns: string;
         grid_gutter_width: string;
         no_javascript: string;
         theme_dark: string;
         theme_grey: string;
+        "tracking-heading": string;
+        "tracking-sub-heading": string;
+        "tracking-body": string;
     };
 }, {}, {
     /**