@visitscotland/component-library 4.0.3 → 4.1.1

package/dist/client/styles/02b37d1fbe6d4d012ac9.css

@@ -0,0 +1 @@
+label,legend{font-weight:600;margin-bottom:0}legend{font-size:1.125rem}.error{font-size:1rem;color:#e71845;display:block}.hint-text{font-size:1rem;color:#756d94;margin-bottom:0}.vs-textarea{border:#5d5478 1px solid;margin-top:.5rem}.vs-textarea.form-control-md{height:50px}.vs-textarea:focus{border-color:#3369ff;box-shadow:0 0 0 2px #3369ff inset;outline:none}.vs-textarea--error{border-color:#e71845;box-shadow:0 0 0 2px #e71845 inset}.vs-textarea:disabled{background-color:#fff;border-color:#c3bfd6;opacity:.5}

package/dist/client/styles/0554e8f364e41ddcbb6b.css

@@ -0,0 +1 @@
+.vs-quote__content{font-size:1.5rem;font-weight:300;line-height:1.3}.vs-quote__author-name{font-weight:700;margin-bottom:0}@media(min-width: 768px){.vs-quote__author-name{margin-bottom:.25rem;font-size:1.125rem}}.vs-quote__author-title{line-height:1.25rem;margin-bottom:0}@media(min-width: 768px){.vs-quote__author-title{line-height:1.3;font-size:1.125rem}}.vs-quote__author-title--narrow-margin{margin-bottom:1.75rem}@media(min-width: 768px){.vs-quote__quote-link{margin-top:1.75rem}}.vs-quote__speech-mark{font-weight:700;color:#535396;font-size:7rem;height:5rem;line-height:1;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.vs-quote__speech-container{display:block;margin-bottom:1rem;margin-right:1.25rem;width:3.5rem;height:2.5rem;position:relative}@media(min-width: 576px){.vs-quote__speech-container{display:inline-block;vertical-align:top}}.vs-quote__author-container{display:block;width:50%;max-width:8rem;margin-bottom:1rem}.vs-quote__author-container img{width:100%}@media(min-width: 992px){.vs-quote__author-container{margin-right:1.25rem}}.vs-quote__content-container{display:block}@media(min-width: 576px){.vs-quote--wide .vs-quote__author-container{display:inline-block;vertical-align:top;margin-bottom:1.25rem}}@media(min-width: 576px){.vs-quote--wide .vs-quote__content-container{display:inline-block;vertical-align:top}}@media(min-width: 1200px){.vs-quote--wide .vs-quote__content-container{width:calc(100% - 15rem);margin-top:-7px}}.vs-quote--with-border{border-left:.25rem solid #535396;padding-left:1.5rem}.vs-quote--with-border .vs-quote__author-name,.vs-quote--with-border .vs-quote__author-title{color:#535396}

package/dist/client/styles/2bef7317c860a39e730f.css

@@ -0,0 +1 @@
+.vs-styled-list--numbered .vs-styled-list__item{counter-increment:section;padding:0 0 1.5rem 1.5rem;position:relative}@media(min-width: 768px){.vs-styled-list--numbered .vs-styled-list__item{padding:0 0 2rem 2rem}}.vs-styled-list--numbered .vs-styled-list__item::before{background-color:#23014a;color:#fff;content:counter(section);font-size:1rem;padding:.25rem .75rem;position:absolute;right:100%;top:.125rem}@media(min-width: 768px){.vs-styled-list--numbered .vs-styled-list__item::before{padding:.25rem 1.75rem}}.vs-styled-list--numbered .vs-styled-list__item:not(:last-child)::after{position:absolute;content:"";width:.25rem;height:100%;background-color:#23014a;right:100%;top:.125rem}.vs-styled-list--numbered .vs-styled-list__item .vs-heading{margin-top:0}.vs-styled-list--icon .vs-styled-list__item{padding:0 0 1.5rem 3rem;position:relative}.vs-styled-list--icon .vs-styled-list__item::before{content:"";color:#04c852;font-family:"Font Awesome Kit";font-size:1.5rem;position:absolute;top:1rem;left:0}.vs-styled-list--image{margin-bottom:2.5rem}.vs-styled-list--image img{max-width:100%}.vs-styled-list--image-horizontal .vs-styled-list__item{padding:0 1.5rem}.vs-styled-list--image-horizontal .vs-styled-list__item img{margin:auto;width:80%}

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

@@ -111,6 +111,7 @@ export { default as VsTabs } from './tabs/Tabs.vue';
 export { default as VsTabItem } from './tabs/components/TabItem.vue';
 export { default as VsTag } from './tag/Tag.vue';
 export { default as VsTagManagerWrapper } from './tag-manager-wrapper/TagManagerWrapper.vue';
+export { default as VsTextarea } from './textarea/Textarea.vue';
 export { default as VsToggleButton } from './toggle-button/ToggleButton.vue';
 export { default as VsTooltip } from './tooltip/Tooltip.vue';
 export { default as VsVideo } from './video/Video.vue';

package/dist/components/components/textarea/Textarea.vue.d.ts

@@ -0,0 +1,287 @@
+declare const _default: import('vue').DefineComponent<{
+    /**
+     * Default value of the field
+     */
+    value: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Name of the field (for name and id attributes)
+     */
+    fieldName: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * Name of the field (if different from ID)
+     */
+    name: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Whether the browser can autocomplete the field or not.
+     */
+    autoComplete: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Rules for Vuelidate plugin
+     */
+    validationRules: {
+        type: ObjectConstructor;
+        default(): {};
+    };
+    /**
+     * Prop to define invalid from parent
+     */
+    invalid: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+    * Option to disable the input
+    */
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Prop to trigger manual validation. Used by a parent
+     * component to trigger validation eg. when the submit
+     * button is clicked.
+     */
+    triggerValidate: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Specific validation messages for different
+     * types of validation
+     */
+    validationMessages: {
+        type: ObjectConstructor;
+        default(): {};
+    };
+    /**
+     * Fallback translated validation - this is a set of
+     * validation messages to be used when no specific
+     * validation message is needed, eg. "This field is required"
+     */
+    genericValidation: {
+        type: ObjectConstructor;
+        default(): {};
+    };
+    /**
+     * Content for hint text
+     */
+    hintText: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Element placeholder text
+     */
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Whether the parent form has just been submitted, if so all errors
+     * need to be wiped from then re-added to the DOM to inform screen
+     * readers that they should be re-declared
+     */
+    reAlertErrors: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** The number of visible lines of text */
+    rows: {
+        type: StringConstructor | NumberConstructor;
+        default: number;
+    };
+}, {
+    v$: import('vue').Ref<import('@vuelidate/core').Validation<import('@vuelidate/core').ValidationArgs<unknown>, unknown>>;
+}, {
+    inputVal: string;
+    clearErrorsOnFocus: boolean;
+}, {
+    /**
+     * element type class plus error classes
+     */
+    elementClass(): string;
+}, {
+    /**
+     * Clear any text entered in the input
+     */
+    clearInput(): void;
+    /**
+     * Focus on the input
+     */
+    focusOnInput(): void;
+    /**
+     * Clears the input on button click
+     * and adds focus back to the input
+     */
+    clearInputAndFocus(): void;
+    /**
+     *  return autocomplete value in appropriate places
+     */
+    autocompleteValue(): "off" | "on";
+    /**
+     * Validate errors on blur, and re-render them to the screen for screen
+     * reader notice
+     */
+    validateErrors(): void;
+    /**
+     * Reset field errors on focus to allow screen reader to notice them if still
+     * present on blur
+     */
+    resetErrors(): void;
+}, {
+    data(): {
+        inputVal: any;
+        isInvalid: any;
+    };
+    computed: {
+        isRequired(): boolean;
+        rules(): {
+            inputVal: {};
+        } | {
+            inputVal?: undefined;
+        };
+        errorsList(): any[];
+    };
+    watch: {
+        errorsList(newValue: any): void;
+    };
+    methods: {
+        manualValidate(): void;
+        emitStatus(): void;
+    };
+} | {
+    computed: {
+        ariaDescription(): string;
+    };
+}, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    /**
+     * Default value of the field
+     */
+    value: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Name of the field (for name and id attributes)
+     */
+    fieldName: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * Name of the field (if different from ID)
+     */
+    name: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Whether the browser can autocomplete the field or not.
+     */
+    autoComplete: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Rules for Vuelidate plugin
+     */
+    validationRules: {
+        type: ObjectConstructor;
+        default(): {};
+    };
+    /**
+     * Prop to define invalid from parent
+     */
+    invalid: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+    * Option to disable the input
+    */
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Prop to trigger manual validation. Used by a parent
+     * component to trigger validation eg. when the submit
+     * button is clicked.
+     */
+    triggerValidate: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Specific validation messages for different
+     * types of validation
+     */
+    validationMessages: {
+        type: ObjectConstructor;
+        default(): {};
+    };
+    /**
+     * Fallback translated validation - this is a set of
+     * validation messages to be used when no specific
+     * validation message is needed, eg. "This field is required"
+     */
+    genericValidation: {
+        type: ObjectConstructor;
+        default(): {};
+    };
+    /**
+     * Content for hint text
+     */
+    hintText: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Element placeholder text
+     */
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Whether the parent form has just been submitted, if so all errors
+     * need to be wiped from then re-added to the DOM to inform screen
+     * readers that they should be re-declared
+     */
+    reAlertErrors: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** The number of visible lines of text */
+    rows: {
+        type: StringConstructor | NumberConstructor;
+        default: number;
+    };
+}>>, {
+    name: string;
+    value: string;
+    disabled: boolean;
+    invalid: boolean;
+    validationRules: Record<string, any>;
+    hintText: string;
+    triggerValidate: boolean;
+    validationMessages: Record<string, any>;
+    genericValidation: Record<string, any>;
+    reAlertErrors: boolean;
+    placeholder: string;
+    autoComplete: boolean;
+    rows: string | number;
+}, {}>;
+export default _default;

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

@@ -0,0 +1,3 @@
+import { default as VsTextarea } from './Textarea.vue';
+
+export default VsTextarea;

package/dist/components/components/video/Video.vue.d.ts

@@ -82,6 +82,10 @@ declare const _default: import('vue').DefineComponent<{
      * Pauses the video
      */
     pauseVideo(): Promise<void>;
+    /**
+     * Stops the video, which resets to beginning
+     */
+    stopVideo(): Promise<void>;
     /**
      * Triggered by video status events from the vue-youtube component. When any of these
      * occur an appropriate analytics event is dispatched to the datalayer.
@@ -120,15 +124,9 @@ declare const _default: import('vue').DefineComponent<{
     storeVideoDetails(): void;
     /**
      * Attaches event listeners upon mounting video. These include play and pause functions,
-     * for external play buttons and re-render + autoplay functionality for a video inside
-     * a modal.
+     * for external play buttons and autoplay functionality for a video inside a modal.
      */
     setEventListeners(): void;
-    /**
-     * Upon opening a vs-modal with a video, the video must be briefly removed and re-rendered
-     * to ensure that all event triggers in the video fire properly.
-     */
-    reRenderVideo(): void;
 }, {
     computed: {
         pageUrl: () => string;