@visitscotland/component-library 1.2.1 → 1.2.2

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

@@ -0,0 +1,67 @@
+declare const _default: import("vue").DefineComponent<{
+    /**
+     * The image latitude
+     */
+    latitude: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * The image longitude
+     */
+    longitude: {
+        type: StringConstructor;
+        default: string;
+    };
+    mapOutlineColor: {
+        type: StringConstructor;
+        default: string;
+    };
+    mapMarkerColor: {
+        type: StringConstructor;
+        default: string;
+    };
+}, any, {
+    cornerCoordinates: {
+        NE: number;
+        NW: number;
+        SE: number;
+        SW: number;
+    };
+    mapWidth: number;
+    mapHeight: number;
+}, {
+    positionY(): number;
+    positionX(): number;
+}, {
+    calculateAxisPosition(scaleStart: any, scaleEnd: any, coord: any, axisLength: any): number;
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * The image latitude
+     */
+    latitude: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * The image longitude
+     */
+    longitude: {
+        type: StringConstructor;
+        default: string;
+    };
+    mapOutlineColor: {
+        type: StringConstructor;
+        default: string;
+    };
+    mapMarkerColor: {
+        type: StringConstructor;
+        default: string;
+    };
+}>>, {
+    latitude: string;
+    longitude: string;
+    mapOutlineColor: string;
+    mapMarkerColor: string;
+}, {}>;
+export default _default;

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

@@ -0,0 +1,7 @@
+declare namespace _default {
+    export { VsCaption };
+    export { VsCaptionImageMap };
+}
+export default _default;
+import VsCaption from './Caption.vue';
+import VsCaptionImageMap from './components/CaptionImageMap.vue';

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

@@ -0,0 +1,242 @@
+declare const _default: import("vue").DefineComponent<{
+    /**
+     * An object providing all required localisation content from the CMS. This
+     * should contain global props like a translation for `next`, `previous`,
+     * `results` and so on, as well as question by question labels. Those should
+     * take the form
+     *    `question-1.title` <- the category for the first question
+     *    `question-1.question` <- the content of the first question
+     *    `question-1.option-1` <- the first option for the first question
+     *    `question-1.tip` <- the content of the tip for the above option
+     * and then repeat for each question-x beyond that.
+     */
+    labelsMap: {
+        type: ObjectConstructor;
+        required: true;
+    };
+    /**
+     * Language locale string. Used to determine correct formatting for numbers (decimal
+     * delimeter)
+     *
+     * Example: "en-gb"
+     */
+    language: {
+        type: StringConstructor;
+        default: string;
+    };
+}, any, any, {
+    /**
+     * The question which is currently being displayed to the user, null if
+     * the user is on the intro or results page.
+     */
+    currentQuestion(): any;
+    /**
+     * The tip which is currently being displayed to the user, based on their
+     * answer to the current question and what tips are available in their language
+     */
+    currentTip(): any;
+    /**
+     * The length of the user's stay, parsed to an int from an answer
+     * provided to the user. Necessary to calculate the emissions per
+     * day in the results page.
+     */
+    stayDuration(): number;
+    /**
+     * Retrieves the category for a given stage from the localised labelsMap provided
+     * by the CMS
+     */
+    currentCategory(): any;
+    /**
+     * Retrieves the CTA to add an extra answer for a given stage, if that stage is repeatable
+     */
+    activeStageRepeatable(): any;
+}, {
+    /**
+     * Defines the initial state of the component, when the component is
+     * initialised and when the user resets the form to get another calculation.
+     */
+    initialState(): {
+        formData: {};
+        messagingData: {};
+        form: {};
+        formIsInvalid: boolean;
+        showErrorMessage: boolean;
+        errorFields: any[];
+        triggerValidate: boolean;
+        conditionalFields: {};
+        reAlertErrors: boolean;
+        totalKilos: number;
+        transportKilos: number;
+        accommodationKilos: number;
+        foodKilos: number;
+        transportTip: any;
+        foodTip: any;
+        accommodationTip: any;
+        transportInternalTip: any;
+        activeStage: number;
+        answerSet: boolean;
+        repeatableStages: {};
+    };
+    /**
+     * Resets the form to its initial data configuration to restart the user's calculation.
+     * The formData is loaded on page creation by axios and won't change between calculations
+     * so can be held and set in the component to avoid doubling the load.
+     */
+    restart(): void;
+    /**
+     * Remove leftover duplicated fields from form field data on reset, and reset count for
+     * each field that has been duplicated.
+     */
+    cleanFields(): void;
+    /**
+     * Called on component created. Loads the json file located at this.dataUrl which
+     * contains all of the question data validation. This does not contain localisations, which
+     * are loaded from the CMS as labels and then mapped to the questions from the form.
+     */
+    getFormData(): void;
+    /**
+     * Retrieves the default value for a message from the global messages json file in the
+     * current language.
+     */
+    getMessagingData(type: any, lang: any): any;
+    /**
+     * Retrieves the label for a given question from the localised labelsMap provided
+     * by the CMS
+     */
+    getQuestionLabel(field: any, index: any): any;
+    /**
+     * Retrieves the hint for a given question from the localised labelsMap provided
+     * by the CMS
+     */
+    getQuestionHint(field: any, index: any): any;
+    /**
+     * Retrieves the options for a given question from the localised labelsMap provided
+     * by the CMS
+     */
+    getQuestionOptions(field: any, index: any): any;
+    /**
+     * Called when the value of any input changes, updating values in the main this.form source
+     * of truth. The new value is stored, validated, error statuses and conditional field
+     * appearance is updated
+     *
+     * The inputs can't directly v-model variables from the this.form object because reactivity
+     * on sub-variables on arrays passed through multiple components is inconsistent and
+     * unreliable. Instead each component tracks its own value on an internal variable called
+     * inputVal then reports any changes to that value back up to the form.
+     */
+    updateFieldData(data: any): void;
+    /**
+     * Updates the errorFields list with the current validated state of each field.
+     */
+    manageErrorStatus(field: any, errors: any): void;
+    /**
+     * Calculates the current value of a radio button based question in the carbon calculator
+     * form. Each field has an actual raw value which is retruned by the radio button
+     * component, but also has a potential multiplication factor which could be based on
+     * another field or on a static value.
+     */
+    getRadioValue(fieldName: any, key: any): any;
+    /**
+     * Calculates the current value of a number input based question in the carbon calculator
+     * form. Each field has an actual raw value which is retruned by the radio button
+     * component, but also has a potential multiplication factor which could be based on
+     * another field or on a static value.
+     */
+    getNumberValue(fieldName: any, key: any): number;
+    /**
+     * Retrieves the current value for a given field, based on its type
+     */
+    getFieldValue(checkField: any): any;
+    /**
+     * Calculates the current total emissions value, and category specific emission values
+     * for the user based on their submitted answers.
+     */
+    calculateEmissions(): void;
+    /**
+     * Checks whether conditional fields meet the rules to show them
+     */
+    checkConditionalFields(): void;
+    /**
+     * Moves the form forward one stage
+     */
+    forwardPage(event: any): void;
+    /**
+     * Moves the form back one stage
+     */
+    backwardPage(event: any): void;
+    /**
+     * Checks if an answer has been provided for the current question, if one
+     * is necessary to proceed
+     */
+    checkNewAnswerSet(): void;
+    /**
+     * Check if the current stage appears in the list of repeatableStages defined in the form
+     * data. If so it should be possible to enter multiple values for it.
+     */
+    isRepeatable(stage: any): boolean;
+    /**
+     * Sets the 'd-none' class on conditional fields which are currently not displaying.
+     */
+    conditionalElementClass(fieldName: any): "" | "d-none";
+    /**
+     * Set the user focus to just before the current question. Called whenever they navigate
+     * to a new page to ensure a keyboard navigating user has clarity on what is happening
+     * after nav.
+     */
+    resetFocus(): void;
+    /**
+     * Adds a duplicate for each question in the current stage to the form data. Duplicates
+     * are marked as clones to ensure subsequent duplicates are only added one set at a time
+     * rather than doubled.
+     */
+    duplicateCurrentStage(event: any): void;
+}, {
+    computed: {
+        pageUrl: () => string;
+    };
+    data(): {
+        dataLayerLoadConfirmed: boolean;
+        dataLayerStore: any;
+    };
+    mounted(): void;
+    methods: {
+        templateFiller(template: any, values: any): {};
+        createDataLayerObject(type: any, event: any, href: any): void; /**
+         * Retrieves the options for a given question from the localised labelsMap provided
+         * by the CMS
+         */
+        returnIsoDate(): string;
+        pushToDataLayer(object: any): void;
+        compileFullTemplate(templateValues: any): any;
+        targetText(event: any): any;
+    };
+}, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * An object providing all required localisation content from the CMS. This
+     * should contain global props like a translation for `next`, `previous`,
+     * `results` and so on, as well as question by question labels. Those should
+     * take the form
+     *    `question-1.title` <- the category for the first question
+     *    `question-1.question` <- the content of the first question
+     *    `question-1.option-1` <- the first option for the first question
+     *    `question-1.tip` <- the content of the tip for the above option
+     * and then repeat for each question-x beyond that.
+     */
+    labelsMap: {
+        type: ObjectConstructor;
+        required: true;
+    };
+    /**
+     * Language locale string. Used to determine correct formatting for numbers (decimal
+     * delimeter)
+     *
+     * Example: "en-gb"
+     */
+    language: {
+        type: StringConstructor;
+        default: string;
+    };
+}>>, {
+    language: string;
+}, {}>;
+export default _default;

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

@@ -0,0 +1,2 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+export default _default;

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

@@ -0,0 +1,151 @@
+declare const _default: import("vue").DefineComponent<{
+    /**
+     * The localised main text of the question that prompts the user to answer
+     */
+    label: {
+        type: StringConstructor;
+        required: true;
+    };
+    labelFor: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * The localised hint text of the question that clarifies the answer expected
+     * from the user
+     */
+    hint: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Any additional styling  classes that should be applied to the question
+     * as a whole
+     */
+    fieldClass: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * Which selector type should be used for the question.
+     * `radio|number`.
+     */
+    fieldType: {
+        type: StringConstructor;
+        default: string;
+        validator: (value: unknown) => any;
+    };
+    /**
+     * The identifier for the field which should be provided when updating the
+     * value of the field to the calculator as a whole
+     */
+    fieldName: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * An array of options that the user can select. Each should be an object with a `value`
+     * string (that is submitted as part of the answer to the carbon calculation), a `text`
+     * string which denotes what the answer represents, and an `icon` string which dictates
+     * which icon is rendered on the radio button.
+     */
+    options: {
+        type: ArrayConstructor;
+        required: true;
+    };
+    /**
+     * Minimum number value, only needed for number inputs
+     */
+    minimum: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * Maximum number value, only needed for number inputs
+     */
+    maximum: {
+        type: NumberConstructor;
+        default: number;
+    };
+}, any, any, {}, {
+    /**
+     * Fired when the value of the nested input changes, emits the new value up to the
+     * questionnaire to be tracked in the running total.
+    */
+    valueChanged(newData: any): void;
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * The localised main text of the question that prompts the user to answer
+     */
+    label: {
+        type: StringConstructor;
+        required: true;
+    };
+    labelFor: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * The localised hint text of the question that clarifies the answer expected
+     * from the user
+     */
+    hint: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Any additional styling  classes that should be applied to the question
+     * as a whole
+     */
+    fieldClass: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * Which selector type should be used for the question.
+     * `radio|number`.
+     */
+    fieldType: {
+        type: StringConstructor;
+        default: string;
+        validator: (value: unknown) => any;
+    };
+    /**
+     * The identifier for the field which should be provided when updating the
+     * value of the field to the calculator as a whole
+     */
+    fieldName: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * An array of options that the user can select. Each should be an object with a `value`
+     * string (that is submitted as part of the answer to the carbon calculation), a `text`
+     * string which denotes what the answer represents, and an `icon` string which dictates
+     * which icon is rendered on the radio button.
+     */
+    options: {
+        type: ArrayConstructor;
+        required: true;
+    };
+    /**
+     * Minimum number value, only needed for number inputs
+     */
+    minimum: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * Maximum number value, only needed for number inputs
+     */
+    maximum: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>>, {
+    hint: string;
+    fieldType: string;
+    minimum: number;
+    maximum: number;
+}, {}>;
+export default _default;

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

@@ -0,0 +1,183 @@
+declare const _default: import("vue").DefineComponent<{
+    /**
+     * The total equivalent weight of emissions for the survey, used as the headline figure
+     * as well as for working out daily emissions and in the comparison.
+     */
+    totalKilos: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * The weight of emissions specifically related to food
+     */
+    foodKilos: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * The weight of emissions specifically related to transport
+     */
+    transportKilos: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * The weight of emissions specifically related to accommodation
+     */
+    accommodationKilos: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * The number of nights the user is staying, used to calculate per day emissions
+     */
+    stayDuration: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * An array that defines which placeholders in the comparison need to be replaced and what
+     * they should be replaced with. Each entry should be an object with a "repl" key and a
+     * "divisor" key
+     *
+     * {
+     *      "repl": "xxx",
+     *      "divisor": 0.2
+     * }
+     *
+     * In the above case, the substring "xxx" in the comparison will be replaced with the total
+     * emissions number / 0.2
+     */
+    comparisonReplacements: {
+        type: ArrayConstructor;
+        default: () => any[];
+    };
+    /**
+     * Language locale string. Used to determine correct formatting for numbers (decimal
+     * delimeter)
+     *
+     * Example: "en-gb"
+     */
+    language: {
+        type: StringConstructor;
+        default: string;
+    };
+}, any, {
+    chartDirection: import("vue").Ref<string>;
+    chartAxis: import("vue").Ref<{
+        primary: {
+            type: string;
+        };
+    }>;
+    cssProps: string;
+}, {
+    /**
+     * Data object for the vue3-chart
+     */
+    chartData(): {
+        name: any;
+        emissions: any;
+    }[];
+    /**
+     * Returns the localised comparison from the labelsmap with actual data interpolated into
+     * it. The comparison is a string with one or more placeholders in it which need to be
+     * replaced with a number specific to the user's actual data (in the general form of
+     * "that's equivalent to 15 full washloads").
+     *
+     * The exact string that needs to be replaced and the number that should be entered is
+     * derived from the comparison replacements object described in props.
+     */
+    interpolComparison(): any;
+    /**
+     * Interpolates the per day emissions into a localised string.
+     */
+    interpolKGsPerDay(): any;
+    /**
+     * Interpolates the per day success into a localised string.
+     */
+    interpolPerDaySuccess(): any;
+    transportPercent(): number;
+    accommodationPercent(): number;
+    foodPercent(): number;
+    totalPerDay(): number;
+}, {
+    responsiveMargin(width: any): {
+        left: number;
+        top: number;
+        right: number;
+        bottom: number;
+    };
+}, any, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * The total equivalent weight of emissions for the survey, used as the headline figure
+     * as well as for working out daily emissions and in the comparison.
+     */
+    totalKilos: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * The weight of emissions specifically related to food
+     */
+    foodKilos: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * The weight of emissions specifically related to transport
+     */
+    transportKilos: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * The weight of emissions specifically related to accommodation
+     */
+    accommodationKilos: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * The number of nights the user is staying, used to calculate per day emissions
+     */
+    stayDuration: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * An array that defines which placeholders in the comparison need to be replaced and what
+     * they should be replaced with. Each entry should be an object with a "repl" key and a
+     * "divisor" key
+     *
+     * {
+     *      "repl": "xxx",
+     *      "divisor": 0.2
+     * }
+     *
+     * In the above case, the substring "xxx" in the comparison will be replaced with the total
+     * emissions number / 0.2
+     */
+    comparisonReplacements: {
+        type: ArrayConstructor;
+        default: () => any[];
+    };
+    /**
+     * Language locale string. Used to determine correct formatting for numbers (decimal
+     * delimeter)
+     *
+     * Example: "en-gb"
+     */
+    language: {
+        type: StringConstructor;
+        default: string;
+    };
+}>>, {
+    language: string;
+    totalKilos: number;
+    foodKilos: number;
+    transportKilos: number;
+    accommodationKilos: number;
+    stayDuration: number;
+    comparisonReplacements: unknown[];
+}, {}>;
+export default _default;

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

@@ -0,0 +1,45 @@
+declare const _default: import("vue").DefineComponent<{
+    /**
+     * The current total number of kilos of carbon captured in the
+     * user's calculation. Will be rounded to 3 significant figures
+     * when rendered.
+     */
+    totalKilos: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * Language locale string. Used to determine correct formatting for numbers (decimal
+     * delimeter)
+     *
+     * Example: "en-gb"
+     */
+    language: {
+        type: StringConstructor;
+        default: string;
+    };
+}, any, any, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * The current total number of kilos of carbon captured in the
+     * user's calculation. Will be rounded to 3 significant figures
+     * when rendered.
+     */
+    totalKilos: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * Language locale string. Used to determine correct formatting for numbers (decimal
+     * delimeter)
+     *
+     * Example: "en-gb"
+     */
+    language: {
+        type: StringConstructor;
+        default: string;
+    };
+}>>, {
+    language: string;
+    totalKilos: number;
+}, {}>;
+export default _default;