@oub/fusion 0.3.0 → 0.3.2

package/dist/lib/components/common/key-value-pair/FusionKeyValuePair.vue.d.ts

@@ -154,9 +154,9 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         default: boolean;
     };
 }>> & Readonly<{}>, {
+    order: keyof FusionKeyValuePairOrder;
     keyText: string;
     valueText: string;
-    order: keyof FusionKeyValuePairOrder;
     valueTextEmphasis: keyof FusionKeyValuePairEmphasis;
     secondaryValueText: string;
     strikeThroughSecondaryValueText: boolean;

package/dist/lib/components/form/sorter/FusionSorter.d.ts

@@ -0,0 +1,6 @@
+export type FusionSortOrder = "asc" | "desc";
+
+export interface FusionSortOption {
+    label: string;
+    value: any;
+}

package/dist/lib/components/form/sorter/FusionSorter.vue.d.ts

@@ -0,0 +1,543 @@
+import { PropType } from 'vue';
+import { FusionSortOption, FusionSortOrder } from './FusionSorter';
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    id: {
+        type: StringConstructor;
+        required: true;
+    };
+    name: {
+        type: StringConstructor;
+        required: true;
+    };
+    options: {
+        type: PropType<FusionSortOption[]>;
+        required: true;
+    };
+    modelValue: {
+        type: PropType<FusionSortOption>;
+        default: () => {
+            label: string;
+            value: null;
+        };
+    };
+    order: {
+        type: PropType<FusionSortOrder>;
+        default: string;
+    };
+    tabIndex: {
+        type: NumberConstructor;
+        default: number;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autofocus: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    ariaLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    dataTest: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, {}, {
+    selected: FusionSortOption;
+    currentOrder: FusionSortOrder;
+    interactionStates: {
+        opened: boolean;
+        focused: boolean;
+    };
+}, {
+    stateClasses: () => {
+        disabled: boolean;
+        opened: boolean;
+        focused: boolean;
+    };
+    orderAriaLabel: () => "Sort ascending" | "Sort descending";
+}, {
+    handleInputClick: () => void;
+    handleSelect: (option: FusionSortOption) => void;
+    toggleOrder: () => void;
+    updateInput: () => void;
+    handleFocus: () => void;
+    handleBlur: () => void;
+    handleKeydownEnter: (event: KeyboardEvent) => void;
+    closeListBox: () => void;
+}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("update:modelValue" | "keydown:enter" | "change" | "select:blur" | "select:focus" | "update:order")[], "update:modelValue" | "keydown:enter" | "change" | "select:blur" | "select:focus" | "update:order", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    id: {
+        type: StringConstructor;
+        required: true;
+    };
+    name: {
+        type: StringConstructor;
+        required: true;
+    };
+    options: {
+        type: PropType<FusionSortOption[]>;
+        required: true;
+    };
+    modelValue: {
+        type: PropType<FusionSortOption>;
+        default: () => {
+            label: string;
+            value: null;
+        };
+    };
+    order: {
+        type: PropType<FusionSortOrder>;
+        default: string;
+    };
+    tabIndex: {
+        type: NumberConstructor;
+        default: number;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autofocus: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    ariaLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    dataTest: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{
+    onChange?: ((...args: any[]) => any) | undefined;
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    "onKeydown:enter"?: ((...args: any[]) => any) | undefined;
+    "onSelect:blur"?: ((...args: any[]) => any) | undefined;
+    "onSelect:focus"?: ((...args: any[]) => any) | undefined;
+    "onUpdate:order"?: ((...args: any[]) => any) | undefined;
+}>, {
+    dataTest: string;
+    disabled: boolean;
+    modelValue: FusionSortOption;
+    tabIndex: number;
+    ariaLabel: string;
+    autofocus: boolean;
+    order: FusionSortOrder;
+}, {}, {
+    FusionListBox: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+        selectId: {
+            type: StringConstructor;
+            required: true;
+        };
+        options: {
+            type: () => import('../select/FusionSelect').FusionSelectOption[];
+            default: () => never[];
+        };
+        searchText: {
+            type: StringConstructor;
+            default: string;
+        };
+        searchDisabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        searchPlaceholder: {
+            type: StringConstructor;
+            default: string;
+        };
+        searchLoading: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        searchErrorTitle: {
+            type: StringConstructor;
+            default: string;
+        };
+        searchErrorDescription: {
+            type: StringConstructor;
+            default: string;
+        };
+        selected: {
+            type: PropType<import('../select/FusionSelect').FusionSelectOption>;
+            default: () => import('../select/FusionSelect').FusionSelectOption;
+        };
+        ariaLabel: {
+            type: StringConstructor;
+            default: string;
+        };
+        dataTest: {
+            type: StringConstructor;
+            default: string;
+        };
+    }>, {}, {
+        searchInputValue: string;
+    }, {}, {
+        closeListBox(): void;
+        handleSelect(option: import('../select/FusionSelect').FusionSelectOption): void;
+        handleInput(inputValue: string): void;
+        handleKeydownSelect(event: KeyboardEvent, option?: import('../select/FusionSelect').FusionSelectOption | undefined): void;
+    }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("handle:select" | "handle:search" | "handle:close")[], "handle:select" | "handle:search" | "handle:close", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+        selectId: {
+            type: StringConstructor;
+            required: true;
+        };
+        options: {
+            type: () => import('../select/FusionSelect').FusionSelectOption[];
+            default: () => never[];
+        };
+        searchText: {
+            type: StringConstructor;
+            default: string;
+        };
+        searchDisabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        searchPlaceholder: {
+            type: StringConstructor;
+            default: string;
+        };
+        searchLoading: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        searchErrorTitle: {
+            type: StringConstructor;
+            default: string;
+        };
+        searchErrorDescription: {
+            type: StringConstructor;
+            default: string;
+        };
+        selected: {
+            type: PropType<import('../select/FusionSelect').FusionSelectOption>;
+            default: () => import('../select/FusionSelect').FusionSelectOption;
+        };
+        ariaLabel: {
+            type: StringConstructor;
+            default: string;
+        };
+        dataTest: {
+            type: StringConstructor;
+            default: string;
+        };
+    }>> & Readonly<{
+        "onHandle:select"?: ((...args: any[]) => any) | undefined;
+        "onHandle:search"?: ((...args: any[]) => any) | undefined;
+        "onHandle:close"?: ((...args: any[]) => any) | undefined;
+    }>, {
+        dataTest: string;
+        ariaLabel: string;
+        selected: import('../select/FusionSelect').FusionSelectOption;
+        options: import('../select/FusionSelect').FusionSelectOption[];
+        searchText: string;
+        searchDisabled: boolean;
+        searchPlaceholder: string;
+        searchLoading: boolean;
+        searchErrorTitle: string;
+        searchErrorDescription: string;
+    }, {}, {
+        SVGSearch: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+        CheckCircle: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+        FusionLoadingSpinner: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+            spinnerColour: {
+                type: StringConstructor;
+                default: string;
+            };
+            dataTest: {
+                type: StringConstructor;
+                default: string;
+            };
+        }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+            spinnerColour: {
+                type: StringConstructor;
+                default: string;
+            };
+            dataTest: {
+                type: StringConstructor;
+                default: string;
+            };
+        }>> & Readonly<{}>, {
+            spinnerColour: string;
+            dataTest: string;
+        }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+        SVGInbox: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+        FusionInput: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+            id: {
+                type: StringConstructor;
+                required: true;
+            };
+            name: {
+                type: StringConstructor;
+                required: true;
+            };
+            label: {
+                type: StringConstructor;
+                default: string;
+            };
+            placeholder: {
+                type: StringConstructor;
+                default: string;
+            };
+            helperLabel: {
+                type: StringConstructor;
+                default: string;
+            };
+            errorLabel: {
+                type: StringConstructor;
+                default: string;
+            };
+            input: {
+                type: StringConstructor;
+                default: string;
+            };
+            required: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            tabIndex: {
+                type: NumberConstructor;
+                default: number;
+            };
+            autocomplete: {
+                type: StringConstructor;
+                default: string;
+            };
+            title: {
+                type: StringConstructor;
+                default: string;
+            };
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            readonly: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            type: {
+                type: StringConstructor;
+                default: string;
+            };
+            ariaLabel: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            dataTest: {
+                type: StringConstructor;
+                default: string;
+            };
+        }>, {}, {
+            inputValue: string;
+            styleVariables: {};
+            interactionStates: {
+                focused: boolean;
+                hover: boolean;
+            };
+        }, {
+            stateClasses(): {
+                disabled: boolean;
+                error: boolean;
+                icon: boolean;
+            };
+        }, {
+            updateInput(): void;
+            handleFocus(): void;
+            handleBlur(): void;
+            handleKeydownEnter(): void;
+            handleMouseover(): void;
+            handleMouseleave(): void;
+            focus(): void;
+        }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("input:focus" | "input:blur" | "keydown:enter" | "update:input")[], "input:focus" | "input:blur" | "keydown:enter" | "update:input", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+            id: {
+                type: StringConstructor;
+                required: true;
+            };
+            name: {
+                type: StringConstructor;
+                required: true;
+            };
+            label: {
+                type: StringConstructor;
+                default: string;
+            };
+            placeholder: {
+                type: StringConstructor;
+                default: string;
+            };
+            helperLabel: {
+                type: StringConstructor;
+                default: string;
+            };
+            errorLabel: {
+                type: StringConstructor;
+                default: string;
+            };
+            input: {
+                type: StringConstructor;
+                default: string;
+            };
+            required: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            tabIndex: {
+                type: NumberConstructor;
+                default: number;
+            };
+            autocomplete: {
+                type: StringConstructor;
+                default: string;
+            };
+            title: {
+                type: StringConstructor;
+                default: string;
+            };
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            readonly: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            type: {
+                type: StringConstructor;
+                default: string;
+            };
+            ariaLabel: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            dataTest: {
+                type: StringConstructor;
+                default: string;
+            };
+        }>> & Readonly<{
+            "onInput:focus"?: ((...args: any[]) => any) | undefined;
+            "onInput:blur"?: ((...args: any[]) => any) | undefined;
+            "onKeydown:enter"?: ((...args: any[]) => any) | undefined;
+            "onUpdate:input"?: ((...args: any[]) => any) | undefined;
+        }>, {
+            type: string;
+            dataTest: string;
+            input: string;
+            label: string;
+            title: string;
+            required: boolean;
+            disabled: boolean;
+            placeholder: string;
+            helperLabel: string;
+            errorLabel: string;
+            readonly: boolean;
+            tabIndex: number;
+            autocomplete: string;
+            ariaLabel: string;
+        }, {}, {
+            SVGExclamationOctagon: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+        }, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+        OnClickOutside: import('vue').DefineComponent<import('@vueuse/components').OnClickOutsideProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('@vueuse/components').OnClickOutsideProps>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+        FusionMenuItem: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+            variantType: {
+                type: PropType<keyof import('../../../../types/Global').VariantTypes>;
+                default: string;
+            };
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            selectable: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            selected: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            showCheck: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            href: {
+                type: StringConstructor;
+                default: string;
+            };
+            target: {
+                type: StringConstructor;
+                default: string;
+            };
+        }>, {}, {
+            isHovered: boolean;
+            isPressed: boolean;
+        }, {
+            componentTag(): string;
+            linkAttributes(): {
+                href: string;
+                target: string;
+                role: string;
+                "aria-checked": boolean | undefined;
+                "aria-disabled": boolean;
+            } | {
+                role: string;
+                "aria-checked": boolean | undefined;
+                "aria-disabled": boolean;
+                href?: undefined;
+                target?: undefined;
+            };
+        }, {
+            handleClick(): void;
+            handleKeydown(event: KeyboardEvent): void;
+            handleMouseOver(): void;
+            handleMouseOut(): void;
+            handleMouseDown(): void;
+            handleMouseUp(): void;
+        }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "update:selected"[], "update:selected", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+            variantType: {
+                type: PropType<keyof import('../../../../types/Global').VariantTypes>;
+                default: string;
+            };
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            selectable: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            selected: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            showCheck: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            href: {
+                type: StringConstructor;
+                default: string;
+            };
+            target: {
+                type: StringConstructor;
+                default: string;
+            };
+        }>> & Readonly<{
+            "onUpdate:selected"?: ((...args: any[]) => any) | undefined;
+        }>, {
+            variantType: keyof import('../../../../types/Global').VariantTypes;
+            disabled: boolean;
+            selectable: boolean;
+            selected: boolean;
+            showCheck: boolean;
+            href: string;
+            target: string;
+        }, {}, {
+            SVGCheck: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+        }, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+    }, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+    SVGArrowDown: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+    SVGArrowDirectionDown: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/lib/components/svgs/SVGArrowDirectionDown.vue.d.ts

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

package/dist/lib/main.d.ts

@@ -13,6 +13,7 @@ import { default as FusionNumericInputStepper } from './components/form/numeric-
 import { default as FusionDatePicker } from './components/form/date-picker/FusionDatePicker.vue';
 import { default as FusionMonthDatePicker } from './components/form/date-picker/FusionMonthDatePicker.vue';
 import { default as FusionRangeDatePicker } from './components/form/date-picker/FusionRangeDatePicker.vue';
+import { default as FusionSorter } from './components/form/sorter/FusionSorter.vue';
 import { default as FusionBanner } from './components/common/banner/FusionBanner.vue';
 import { default as FusionTextLink } from './components/common/link/FusionTextLink.vue';
 import { default as FusionLoadingSpinner } from './components/common/loading-spinner/FusionLoadingSpinner.vue';
@@ -28,7 +29,7 @@ import { default as FusionListItem } from './components/common/list/FusionListIt
 import { default as FusionListBox } from './components/common/list-box/FusionListBox.vue';
 import { default as FusionWidget } from './components/common/widget/FusionWidget.vue';
 import { default as FusionToastMessage } from './components/common/toast/FusionToastMessage.vue';
-import { default as FusionToolBar } from './components/common/bars/toolbar/FusionToolBar.vue';
+import { default as FusionTitleBar } from './components/common/bars/title-bar/FusionTitleBar.vue';
 import { default as FusionActionBar } from './components/common/bars/action-bar/FusionActionBar.vue';
 import { default as FusionIconButton } from './components/form/icon-button/FusionIconButton.vue';
 import { default as FusionKeyValuePair } from './components/common/key-value-pair/FusionKeyValuePair.vue';
@@ -41,4 +42,4 @@ import { default as FusionCircularProgressIndicatorLabelCollection } from './com
 import { default as FusionFileUploaderButton } from './components/form/file-uploader/button/FusionFileUploaderButton.vue';
 import { default as FusionProgressStepper } from './components/common/progress-stepper/FusionProgressStepper.vue';
 import { default as FusionProgressBar } from './components/common/progress-bar/FusionProgressBar.vue';
-export { FusionInput, FusionButton, FusionTextarea, FusionCheckbox, FusionRadio, FusionTextLink, FusionSelect, FusionPasswordInput, FusionPhoneInput, FusionBanner, FusionLoadingSpinner, FusionDatePicker, FusionSearchableInput, FusionNumericInputStepper, FusionTag, FusionDivider, FusionCard, FusionProgressStepper, FusionProgressBar, FusionContextMenu, FusionMenuItem, FusionPlatformBar, FusionSideNavigation, FusionSideNavigationItem, FusionListItem, FusionListBox, FusionWidget, FusionToastMessage, FusionToolBar, FusionActionBar, FusionIconButton, FusionKeyValuePair, FusionFooterBar, FusionRadioGroup, FusionCheckboxGroup, FusionModal, FusionCircularProgressIndicator, FusionCircularProgressIndicatorLabel, FusionCircularProgressIndicatorLabelChecklist, FusionCircularProgressIndicatorLabelCollection, FusionMonthDatePicker, FusionFileUploaderButton, FusionRangeDatePicker, };
+export { FusionInput, FusionButton, FusionTextarea, FusionCheckbox, FusionRadio, FusionTextLink, FusionSelect, FusionPasswordInput, FusionPhoneInput, FusionBanner, FusionLoadingSpinner, FusionDatePicker, FusionSearchableInput, FusionNumericInputStepper, FusionTag, FusionDivider, FusionCard, FusionProgressStepper, FusionProgressBar, FusionContextMenu, FusionMenuItem, FusionPlatformBar, FusionSideNavigation, FusionSideNavigationItem, FusionListItem, FusionListBox, FusionWidget, FusionToastMessage, FusionTitleBar, FusionActionBar, FusionIconButton, FusionKeyValuePair, FusionFooterBar, FusionRadioGroup, FusionCheckboxGroup, FusionModal, FusionCircularProgressIndicator, FusionCircularProgressIndicatorLabel, FusionCircularProgressIndicatorLabelChecklist, FusionCircularProgressIndicatorLabelCollection, FusionMonthDatePicker, FusionFileUploaderButton, FusionRangeDatePicker, FusionSorter, };