@frollo/frollo-web-ui 8.5.4 → 9.0.0

package/index.d.ts

@@ -1,9 +1,10 @@
 import * as vue from 'vue';
-import { PropType, ComponentInternalInstance, Plugin } from 'vue';
+import { PropType, ComponentInternalInstance, Component, ComponentCustomProps, Plugin } from 'vue';
 import * as vee_validate from 'vee-validate';
 import { RuleExpression } from 'vee-validate';
 export { Form as FwForm } from 'vee-validate';
 import * as _vue_shared from '@vue/shared';
+import * as lodash from 'lodash';
 import * as chart_js_dist_types_utils from 'chart.js/dist/types/utils';
 import * as chart_js from 'chart.js';
 
@@ -25,7 +26,7 @@ declare interface FwInputProps {
     required?: boolean;
 }
 
-declare const _default$p: vue.DefineComponent<{
+declare const __default__$d: vue.DefineComponent<{
     /**
      * The input v-model
      */
@@ -64,7 +65,7 @@ declare const _default$p: vue.DefineComponent<{
      * Validation rules. Accepts an object, string schema or validation function.
      */
     rules: {
-        type: PropType<vee_validate.RuleExpression<unknown>>;
+        type: PropType<FwInputProps["rules"]>;
     };
     /**
      * Converts the input into a readonly disabled field
@@ -123,17 +124,15 @@ declare const _default$p: vue.DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
-    centerAlignInput: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
 }, {
-    uuid: string;
     inputBaseClass: vue.Ref<string>;
     inputValue: vue.WritableComputedRef<string>;
+    onInput: (e: Event) => void;
     onFocus: (e: FocusEvent) => void;
     onBlur: (e: FocusEvent) => void;
-}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("update:modelValue" | "focus" | "blur")[], "update:modelValue" | "focus" | "blur", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    primaryFade5: string;
+    colorErrorTextFade5: string;
+}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("update:modelValue" | "input" | "focus" | "blur")[], "update:modelValue" | "input" | "focus" | "blur", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     /**
      * The input v-model
      */
@@ -172,7 +171,7 @@ declare const _default$p: vue.DefineComponent<{
      * Validation rules. Accepts an object, string schema or validation function.
      */
     rules: {
-        type: PropType<vee_validate.RuleExpression<unknown>>;
+        type: PropType<FwInputProps["rules"]>;
     };
     /**
      * Converts the input into a readonly disabled field
@@ -231,12 +230,9 @@ declare const _default$p: vue.DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
-    centerAlignInput: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
 }>> & {
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    onInput?: ((...args: any[]) => any) | undefined;
     onFocus?: ((...args: any[]) => any) | undefined;
     onBlur?: ((...args: any[]) => any) | undefined;
 }, {
@@ -247,10 +243,19 @@ declare const _default$p: vue.DefineComponent<{
     tabindex: string;
     rounded: boolean;
     enableErrors: boolean;
-    centerAlignInput: boolean;
 }, {}>;
 
-declare const _default$o: vue.DefineComponent<{
+declare interface FwCheckboxProps {
+    name: string;
+    value?: string;
+    label?: string;
+    rules?: string | Record<string, unknown> | (() => boolean);
+    hint?: string;
+    enableErrors?: boolean;
+    isChecked?: boolean;
+}
+
+declare const __default__$c: vue.DefineComponent<{
     /**
      * The name of the checkbox input field.
      * Multiple checkboxes can use the same name with a unique value.
@@ -276,7 +281,7 @@ declare const _default$o: vue.DefineComponent<{
      * Validation rules. Accepts an object, stringm schema or validation function.
      */
     rules: {
-        type: PropType<string | Record<string, unknown> | (() => boolean) | undefined>;
+        type: PropType<FwCheckboxProps["rules"]>;
     };
     /**
      * The hint text shown below the input
@@ -302,6 +307,8 @@ declare const _default$o: vue.DefineComponent<{
     };
 }, {
     uuid: string;
+    primaryFade5: string;
+    colorErrorTextFade5: string;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     /**
      * The name of the checkbox input field.
@@ -328,7 +335,7 @@ declare const _default$o: vue.DefineComponent<{
      * Validation rules. Accepts an object, stringm schema or validation function.
      */
     rules: {
-        type: PropType<string | Record<string, unknown> | (() => boolean) | undefined>;
+        type: PropType<FwCheckboxProps["rules"]>;
     };
     /**
      * The hint text shown below the input
@@ -374,7 +381,7 @@ declare interface FwDropdownProps {
     required?: boolean;
 }
 
-declare const _default$n: vue.DefineComponent<{
+declare const __default__$b: vue.DefineComponent<{
     /**
      * The select v-model
      */
@@ -398,13 +405,13 @@ declare const _default$n: vue.DefineComponent<{
      * Validation rules. Accepts an object, string schema or validation function.
      */
     rules: {
-        type: PropType<string | Record<string, unknown> | (() => boolean) | undefined>;
+        type: PropType<FwDropdownProps["rules"]>;
     };
     /**
      * An array of options for the dropdown menu.
      */
     options: {
-        type: PropType<FwDropdownOption[]>;
+        type: PropType<FwDropdownProps["options"]>;
         required: true;
     };
     /**
@@ -441,7 +448,7 @@ declare const _default$n: vue.DefineComponent<{
     menuButtonClass: string;
     menuClass: string;
     menuItemClass: string;
-    menuItemActiveClass: (option: FwDropdownOption) => "bg-white" | "bg-none";
+    menuItemActiveClass: (option: FwDropdownOption) => "fw-dropdown--open" | "bg-none";
     errors: vue.Ref<string[]>;
     errorMessage: vue.Ref<string | undefined>;
     meta: vee_validate.FieldMeta<unknown>;
@@ -455,6 +462,8 @@ declare const _default$n: vue.DefineComponent<{
         image_url?: string | undefined;
         description?: string | undefined;
     } | null>;
+    primaryFade5: string;
+    colorErrorTextFade5: string;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     /**
      * The select v-model
@@ -479,13 +488,13 @@ declare const _default$n: vue.DefineComponent<{
      * Validation rules. Accepts an object, string schema or validation function.
      */
     rules: {
-        type: PropType<string | Record<string, unknown> | (() => boolean) | undefined>;
+        type: PropType<FwDropdownProps["rules"]>;
     };
     /**
      * An array of options for the dropdown menu.
      */
     options: {
-        type: PropType<FwDropdownOption[]>;
+        type: PropType<FwDropdownProps["options"]>;
         required: true;
     };
     /**
@@ -526,7 +535,115 @@ declare const _default$n: vue.DefineComponent<{
     required: boolean;
 }, {}>;
 
-declare const _default$m: vue.DefineComponent<{
+declare interface FwSwitchProps {
+    name: string;
+    value?: string;
+    rules?: string | Record<string, unknown> | (() => boolean);
+    hint?: string;
+    enableErrors?: boolean;
+    isChecked?: boolean;
+}
+
+declare const _default$i: vue.DefineComponent<{
+    /**
+     * The name of the switch input field.
+     * Multiple switches can use the same name with a unique value.
+     */
+    name: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * The value of the input field. Must be unique per name.
+     */
+    value: {
+        type: StringConstructor;
+        required: false;
+    };
+    /**
+     * Validation rules. Accepts an object, stringm schema or validation function.
+     */
+    rules: {
+        type: PropType<FwSwitchProps["rules"]>;
+    };
+    /**
+     * The hint text shown below the input
+     */
+    hint: {
+        type: StringConstructor;
+    };
+    /**
+     * Enable or disable the error hidden element
+     */
+    enableErrors: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Progmatically set the checked state of the input.
+     * Used outside a FwForm element
+     */
+    isChecked: {
+        type: BooleanConstructor;
+        required: false;
+        default: boolean;
+    };
+}, {
+    isSwitched: vue.Ref<boolean>;
+    toggleSwitch: () => void;
+    uuid: string;
+}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "change"[], "change", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    /**
+     * The name of the switch input field.
+     * Multiple switches can use the same name with a unique value.
+     */
+    name: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * The value of the input field. Must be unique per name.
+     */
+    value: {
+        type: StringConstructor;
+        required: false;
+    };
+    /**
+     * Validation rules. Accepts an object, stringm schema or validation function.
+     */
+    rules: {
+        type: PropType<FwSwitchProps["rules"]>;
+    };
+    /**
+     * The hint text shown below the input
+     */
+    hint: {
+        type: StringConstructor;
+    };
+    /**
+     * Enable or disable the error hidden element
+     */
+    enableErrors: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Progmatically set the checked state of the input.
+     * Used outside a FwForm element
+     */
+    isChecked: {
+        type: BooleanConstructor;
+        required: false;
+        default: boolean;
+    };
+}>> & {
+    onChange?: ((...args: any[]) => any) | undefined;
+}, {
+    enableErrors: boolean;
+    isChecked: boolean;
+}, {}>;
+
+declare const __default__$a: vue.DefineComponent<{
     /**
      * The header title of the card
      */
@@ -566,6 +683,7 @@ declare const _default$m: vue.DefineComponent<{
 }, {
     componentName: vue.ComputedRef<"router-link" | "a" | "div">;
     linkClass: vue.Ref<string>;
+    cardHeaderBg: string;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     /**
      * The header title of the card
@@ -608,7 +726,7 @@ declare const _default$m: vue.DefineComponent<{
     isBordered: boolean;
 }, {}>;
 
-type ButtonVariantName = 'primary' | 'secondary' | 'tertiary' | 'error' | 'success' | 'link' | 'text' | 'transparent' | 'disabled';
+type ButtonVariantName = 'primary' | 'secondary' | 'tertiary' | 'quaternary' | 'error' | 'success' | 'link' | 'text' | 'transparent' | 'gradient';
 declare interface ButtonDefinition {
     text: string;
     background: string;
@@ -634,11 +752,9 @@ declare interface FwButtonProps {
     rounded?: boolean;
     loading?: boolean;
     external?: boolean;
-    disabled?: boolean;
-    active?: boolean;
 }
 
-declare const _default$l: vue.DefineComponent<{
+declare const _default$h: vue.DefineComponent<{
     /**
      * The label text of the button.
      * Overrides the default slot content.
@@ -666,7 +782,7 @@ declare const _default$l: vue.DefineComponent<{
     };
     /**
      * The colour variant of the button.
-     * Accepts 'primary', 'secondary', 'tertiary', 'error', 'success', 'link', 'text', 'transparent'
+     * Accepts 'primary', 'secondary', 'tertiary', 'quaternary', 'error', 'success', 'link', 'text', 'transparent', 'gradient'
      */
     variant: {
         type: PropType<ButtonVariantName>;
@@ -711,16 +827,15 @@ declare const _default$l: vue.DefineComponent<{
         type: BooleanConstructor;
     };
     /**
-     * Whether the button is disabled or not
+     * Whether the button selected state is active
      */
-    disabled: {
+    selected: {
         type: BooleanConstructor;
-        default: boolean;
     };
     /**
-     * Whether the button is preselected or not
+     * Whether the button is disabled
      */
-    active: {
+    disabled: {
         type: BooleanConstructor;
         default: boolean;
     };
@@ -736,7 +851,7 @@ declare const _default$l: vue.DefineComponent<{
     onFocusin: (e: FocusEvent) => void;
     onFocusout: (e: FocusEvent) => void;
     tagName: vue.ComputedRef<"button" | "router-link" | "a">;
-    loadingSize: vue.ComputedRef<{
+    iconSize: vue.ComputedRef<{
         spacing: string;
         size: string;
     } | {
@@ -780,7 +895,7 @@ declare const _default$l: vue.DefineComponent<{
     };
     /**
      * The colour variant of the button.
-     * Accepts 'primary', 'secondary', 'tertiary', 'error', 'success', 'link', 'text', 'transparent'
+     * Accepts 'primary', 'secondary', 'tertiary', 'quaternary', 'error', 'success', 'link', 'text', 'transparent', 'gradient'
      */
     variant: {
         type: PropType<ButtonVariantName>;
@@ -825,16 +940,15 @@ declare const _default$l: vue.DefineComponent<{
         type: BooleanConstructor;
     };
     /**
-     * Whether the button is disabled or not
+     * Whether the button selected state is active
      */
-    disabled: {
+    selected: {
         type: BooleanConstructor;
-        default: boolean;
     };
     /**
-     * Whether the button is preselected or not
+     * Whether the button is disabled
      */
-    active: {
+    disabled: {
         type: BooleanConstructor;
         default: boolean;
     };
@@ -846,14 +960,57 @@ declare const _default$l: vue.DefineComponent<{
     onFocusout?: ((...args: any[]) => any) | undefined;
 }, {
     size: ButtonSize;
-    disabled: boolean;
     variant: ButtonVariantName;
     buttonType: ButtonTypeAttribute;
     animation: ButtonAnimation;
     rounded: boolean;
     loading: boolean;
     external: boolean;
-    active: boolean;
+    selected: boolean;
+    disabled: boolean;
+}, {}>;
+
+type AlertVariantName = 'success' | 'error';
+
+declare const _default$g: vue.DefineComponent<{
+    /**
+     * The colour variant of the alert element.
+     * Accepts 'success', 'error'
+     */
+    variant: {
+        type: PropType<AlertVariantName>;
+        required: true;
+        validator: (value: string) => boolean;
+    };
+    /**
+     * Disables the icon element.
+     */
+    disableIcon: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}, {
+    bgClass: vue.ComputedRef<"bg-brand-error-bg" | "bg-brand-success-bg">;
+    defaultScale: vue.Ref<string>;
+}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    /**
+     * The colour variant of the alert element.
+     * Accepts 'success', 'error'
+     */
+    variant: {
+        type: PropType<AlertVariantName>;
+        required: true;
+        validator: (value: string) => boolean;
+    };
+    /**
+     * Disables the icon element.
+     */
+    disableIcon: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>>, {
+    disableIcon: boolean;
 }, {}>;
 
 declare interface NavMenuItem {
@@ -862,15 +1019,33 @@ declare interface NavMenuItem {
     label: string;
     external?: boolean;
     onClick?: () => void;
+    disabled?: boolean;
+}
+declare interface FwNavigationMenuProps {
+    menuItems: NavMenuItem[];
+    additionalMenuItems?: NavMenuItem[];
+    actionLabel?: string;
+    containerClass?: string;
+    menuEnabled?: boolean;
+    authenticated?: boolean;
+    paddingClasses?: string;
+    transparent?: boolean;
 }
 
-declare const _default$k: vue.DefineComponent<{
+declare const _default$f: vue.DefineComponent<{
     /**
      * An array of menu items
-     * `{ to?: string | object; href?: string; label: string; }`
+     * `{ to?: string | object; href?: string; label: string; external?: boolean; }`
      */
     menuItems: {
-        type: PropType<NavMenuItem[]>;
+        type: PropType<FwNavigationMenuProps["menuItems"]>;
+    };
+    /**
+     * An array of menu items
+     * `{ to?: string | object; href?: string; label: string; external?: boolean; }`
+     */
+    additionalMenuItems: {
+        type: PropType<FwNavigationMenuProps["menuItems"] | null>;
     };
     /**
      * The label for the action button.
@@ -886,6 +1061,33 @@ declare const _default$k: vue.DefineComponent<{
         type: StringConstructor;
         default: string;
     };
+    /**
+     * Whether menu items are enabled or disabled.
+     */
+    menuEnabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Whether the route is an authenticated route.
+     */
+    authenticated: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Padding for the inner menu, should match the sidebar menu width.
+     */
+    paddingClasses: {
+        type: StringConstructor;
+    };
+    /**
+     * Whether the background is transparent
+     */
+    transparent: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }, {
     mobileMenuClass: vue.Ref<string>;
     isMobileMenuOpen: vue.Ref<boolean>;
@@ -894,10 +1096,17 @@ declare const _default$k: vue.DefineComponent<{
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "action"[], "action", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     /**
      * An array of menu items
-     * `{ to?: string | object; href?: string; label: string; }`
+     * `{ to?: string | object; href?: string; label: string; external?: boolean; }`
      */
     menuItems: {
-        type: PropType<NavMenuItem[]>;
+        type: PropType<FwNavigationMenuProps["menuItems"]>;
+    };
+    /**
+     * An array of menu items
+     * `{ to?: string | object; href?: string; label: string; external?: boolean; }`
+     */
+    additionalMenuItems: {
+        type: PropType<FwNavigationMenuProps["menuItems"] | null>;
     };
     /**
      * The label for the action button.
@@ -913,10 +1122,40 @@ declare const _default$k: vue.DefineComponent<{
         type: StringConstructor;
         default: string;
     };
+    /**
+     * Whether menu items are enabled or disabled.
+     */
+    menuEnabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Whether the route is an authenticated route.
+     */
+    authenticated: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Padding for the inner menu, should match the sidebar menu width.
+     */
+    paddingClasses: {
+        type: StringConstructor;
+    };
+    /**
+     * Whether the background is transparent
+     */
+    transparent: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & {
     onAction?: ((...args: any[]) => any) | undefined;
 }, {
     containerClass: string;
+    menuEnabled: boolean;
+    authenticated: boolean;
+    transparent: boolean;
 }, {}>;
 
 declare interface TabsState {
@@ -927,7 +1166,7 @@ declare interface FwTabsProps {
     modelValue: number;
 }
 
-declare const _default$j: vue.DefineComponent<{
+declare const _default$e: vue.DefineComponent<{
     /**
      * The active tab v-model
      */
@@ -950,7 +1189,7 @@ declare const _default$j: vue.DefineComponent<{
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {}, {}>;
 
-declare const _default$i: vue.DefineComponent<{
+declare const _default$d: vue.DefineComponent<{
     /**
      * The label of the tab component used as the button panel label
      */
@@ -974,53 +1213,267 @@ declare const _default$i: vue.DefineComponent<{
     };
 }>>, {}, {}>;
 
-declare const _default$h: vue.DefineComponent<{
-    /**
-     * The modal's v-model. Controls the visibility of the modal.
-     */
-    modelValue: {
-        type: BooleanConstructor;
-    };
-    /**
-     * The header title of the modal
-     */
-    header: {
-        type: StringConstructor;
-    };
-    /**
-     * The element to attach the modal too. Defaults to `#app` element.
-     */
-    element: {
-        type: StringConstructor;
-        default: string;
-    };
-    /**
-     * The body description of the modal
-     */
-    body: {
-        type: StringConstructor;
-    };
-    /**
-     * The aria role of the modal container. Defaults to `dialog`
-     */
-    role: {
-        type: StringConstructor;
-        default: string;
-    };
-    /**
-     * Whether to show the cancel button
-     */
-    showCancel: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Whether to show the confirm button
-     */
-    showConfirm: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
+declare interface FwCardProps {
+    title?: string;
+    prefixTitle?: string;
+    to?: string | object;
+    href?: string;
+    slotPadding?: boolean;
+    isBordered?: boolean;
+}
+
+declare interface FwModalProps {
+    modelValue: boolean;
+    header?: string;
+    element?: string;
+    body?: string;
+    role?: string;
+    showCancel?: boolean;
+    showConfirm?: boolean;
+    cancelButtonText?: string;
+    cancelButtonType?: ButtonVariantName;
+    confirmButtonText?: string;
+    confirmButtonType?: ButtonVariantName;
+    padding?: boolean;
+    showCloseButton?: boolean;
+    containerClass?: string;
+    footerClass?: string;
+}
+
+declare interface ProgressBarStep {
+    label: string;
+    position: number;
+    subSteps: number;
+}
+
+type TagVariantName = 'primary' | 'secondary' | 'tertiary' | 'quaternary' | 'alert' | 'error' | 'success';
+declare interface TagDefinition {
+    text: string;
+    background: string;
+    iconButtonType: FwButtonProps['variant'];
+}
+type TagDefinitionList = {
+    [key in TagVariantName]: TagDefinition;
+};
+type TagSize = 'xs' | 'sm' | 'md';
+type TagSizes = {
+    [key in TagSize]: string;
+};
+declare interface FwTagProps {
+    size?: TagSize;
+    variant?: TagVariantName;
+}
+
+declare type FwTableItem = Record<string, string | number>;
+declare type FwTableFormatFunction = (value: string | number | object) => string;
+declare type FwTableSortFunction = (items: FwTableItem[], columnName: string, sortDirection?: FwTableSort) => FwTableItem[] | undefined;
+declare type FwTableSort = 'asc' | 'desc';
+declare type FwTableItemOptions = Record<string, {
+    formatter?: FwTableFormatFunction;
+    isSortable?: boolean;
+    disabled?: boolean;
+    initSortOrder?: FwTableSort;
+    sort?: FwTableSortFunction;
+}>;
+declare interface FwTableProps {
+    items: FwTableItem[];
+    options?: FwTableItemOptions;
+    loading?: boolean;
+    clickableRows?: boolean;
+    autoSortColumn?: number;
+    enablePagination?: boolean;
+    totalAmount?: number;
+    pageSize?: number;
+}
+
+declare interface FwAccordionProps {
+    title?: string;
+    titleClass?: string;
+    suffixTitle?: string;
+    isOpened?: boolean;
+    iconPositionStart?: boolean;
+    isArrow?: boolean;
+    buttonPadding?: string;
+    borderStyle?: string;
+}
+
+declare interface FwImageProps {
+    src?: string;
+    alt?: string;
+    type?: 'native' | 'background';
+    rounded?: boolean;
+    imageClass?: string;
+    threshold?: number;
+    enableErrors?: boolean;
+}
+
+type ToastType = 'success' | 'error' | 'warning';
+type ToastTypes = {
+    [key in ToastType]: string;
+};
+type ToastPosition = 'top' | 'bottom' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
+declare interface FwToastProps {
+    modelValue: boolean;
+    type?: ToastType;
+    position?: ToastPosition;
+    content?: string;
+    element?: string;
+    timeout?: number;
+}
+
+declare interface FwTransactionsCardProps {
+    title: string;
+    subTitle?: string;
+    imageUrl?: string;
+    amount?: string;
+}
+
+declare interface FwBarGraphData {
+    name: string;
+    value: string | number;
+}
+declare interface FwBarChartProps {
+    title?: string;
+    yMarker?: string;
+    x?: string[] | string;
+    y?: (string | number)[] | string;
+    graphData?: FwBarGraphData[] | string;
+}
+
+declare interface FwSidebarMenuItem {
+    to?: string | object;
+    href?: string;
+    label: string;
+    external?: boolean;
+    disabled?: boolean;
+    onClick?: () => void;
+    modelValue?: boolean;
+}
+declare interface FwSidebarMenuProps {
+    modelValue: boolean;
+    menuItems: FwSidebarMenuItem[];
+    toggleButtonClass?: string;
+    openWidth?: string;
+    closedWidth?: string;
+    toggleButtonVariant?: ButtonVariantName;
+}
+
+declare interface FwDrawerProps {
+    modelValue: boolean;
+    header?: string;
+    body?: string;
+    role?: string;
+    showCancel?: boolean;
+    showConfirm?: boolean;
+    cancelButtonText?: string;
+    cancelButtonType?: ButtonVariantName;
+    confirmButtonText?: string;
+    confirmButtonType?: ButtonVariantName;
+}
+
+declare interface FwProviderListItem {
+    status: 'supported' | 'outage';
+    name: string;
+    image_url: string;
+}
+declare interface FwProviderListProps {
+    heading: string;
+    items: FwProviderListItem[];
+    searchPlaceholder?: string;
+    tableHeaderName?: string;
+}
+
+type FwDatePickerModel = string | Date | {
+    start: string | Date;
+    end: string | Date;
+} | null;
+declare interface FwDatePickerProps {
+    modelValue: FwDatePickerModel;
+    name: string;
+    label?: string;
+    placeholder?: string;
+    isRange?: boolean;
+    startLabel?: string;
+    endLabel?: string;
+    startPlaceholder?: string;
+    endPlaceholder?: string;
+    tabindex?: string;
+    rounded?: boolean;
+    required?: boolean;
+    maxDate?: string | Date;
+    minDate?: string | Date;
+    rules?: string | Record<string, unknown> | (() => boolean);
+    enableErrors?: boolean;
+}
+
+interface FwPopoverProps {
+    title: string;
+    placement: 'top' | 'right' | 'bottom' | 'left' | 'auto' | 'auto-start' | 'auto-end' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end';
+    trigger: 'click' | 'hover' | 'focus';
+    position: 'fixed' | 'absolute';
+    closeOnClick?: boolean;
+    closeOnClickOutside?: boolean;
+    showOnTop?: boolean;
+    showArrow?: boolean;
+    textAlign?: 'center' | 'left' | 'right';
+}
+
+declare interface FwMediaPickerProps {
+    acceptedFileTypes?: string;
+    maxFileSize?: number;
+    imageUrl?: string;
+    title?: string;
+    uploadHeaderText?: string;
+    editHeaderText?: string;
+}
+
+declare const __default__$9: vue.DefineComponent<{
+    /**
+     * The modal's v-model. Controls the visibility of the modal.
+     */
+    modelValue: {
+        type: BooleanConstructor;
+    };
+    /**
+     * The header title of the modal
+     */
+    header: {
+        type: StringConstructor;
+    };
+    /**
+     * The element to attach the modal too. Defaults to `#app` element.
+     */
+    element: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * The body description of the modal
+     */
+    body: {
+        type: StringConstructor;
+    };
+    /**
+     * The aria role of the modal container. Defaults to `dialog`
+     */
+    role: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Whether to show the cancel button
+     */
+    showCancel: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Whether to show the confirm button
+     */
+    showConfirm: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     /**
      * Custom text for the cancel button
      */
@@ -1032,7 +1485,7 @@ declare const _default$h: vue.DefineComponent<{
      * Button variant for the cancel button
      */
     cancelButtonType: {
-        type: PropType<ButtonVariantName>;
+        type: PropType<FwModalProps["cancelButtonType"]>;
         default: string;
         validator: (value: string) => boolean;
     };
@@ -1047,10 +1500,23 @@ declare const _default$h: vue.DefineComponent<{
      * Button variant for the confirm button
      */
     confirmButtonType: {
-        type: PropType<ButtonVariantName>;
+        type: PropType<FwModalProps["confirmButtonType"]>;
         default: string;
         validator: (value: string) => boolean;
     };
+    /**
+     * Icon name for the confirm button
+     */
+    confirmIconName: {
+        type: StringConstructor;
+    };
+    /**
+     * Whether the confirm button loading animation is showing or not
+     */
+    confirmLoading: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     /**
      * Controls the outer padding of the modal
      */
@@ -1077,10 +1543,17 @@ declare const _default$h: vue.DefineComponent<{
     footerClass: {
         type: StringConstructor;
     };
+    /**
+     * Banner Image Url source
+     */
+    bannerUrl: {
+        type: StringConstructor;
+    };
 }, {
     isOpen: vue.ComputedRef<boolean>;
-    uuid: string;
+    uuid: `${string}-${string}-${string}-${string}-${string}`;
     isMounted: vue.Ref<boolean>;
+    modalBgColour: string;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("cancel" | "confirm")[], "cancel" | "confirm", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     /**
      * The modal's v-model. Controls the visibility of the modal.
@@ -1139,7 +1612,7 @@ declare const _default$h: vue.DefineComponent<{
      * Button variant for the cancel button
      */
     cancelButtonType: {
-        type: PropType<ButtonVariantName>;
+        type: PropType<FwModalProps["cancelButtonType"]>;
         default: string;
         validator: (value: string) => boolean;
     };
@@ -1154,10 +1627,23 @@ declare const _default$h: vue.DefineComponent<{
      * Button variant for the confirm button
      */
     confirmButtonType: {
-        type: PropType<ButtonVariantName>;
+        type: PropType<FwModalProps["confirmButtonType"]>;
         default: string;
         validator: (value: string) => boolean;
     };
+    /**
+     * Icon name for the confirm button
+     */
+    confirmIconName: {
+        type: StringConstructor;
+    };
+    /**
+     * Whether the confirm button loading animation is showing or not
+     */
+    confirmLoading: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     /**
      * Controls the outer padding of the modal
      */
@@ -1184,30 +1670,31 @@ declare const _default$h: vue.DefineComponent<{
     footerClass: {
         type: StringConstructor;
     };
+    /**
+     * Banner Image Url source
+     */
+    bannerUrl: {
+        type: StringConstructor;
+    };
 }>> & {
     onCancel?: ((...args: any[]) => any) | undefined;
     onConfirm?: ((...args: any[]) => any) | undefined;
 }, {
+    cancelButtonType: ButtonVariantName | undefined;
+    confirmButtonType: ButtonVariantName | undefined;
     modelValue: boolean;
     element: string;
     role: string;
     showCancel: boolean;
     showConfirm: boolean;
     cancelButtonText: string;
-    cancelButtonType: ButtonVariantName;
     confirmButtonText: string;
-    confirmButtonType: ButtonVariantName;
+    confirmLoading: boolean;
     padding: boolean;
     showCloseButton: boolean;
 }, {}>;
 
-declare interface ProgressBarStep {
-    label: string;
-    position: number;
-    subSteps: number;
-}
-
-declare const _default$g: vue.DefineComponent<{
+declare const _default$c: vue.DefineComponent<{
     /**
      * An array of menu progress steps.
      * `{ label: string; position: number; subSteps: number; }`
@@ -1257,219 +1744,7 @@ declare const _default$g: vue.DefineComponent<{
     };
 }>>, {}, {}>;
 
-declare interface FwCardProps {
-    title?: string;
-    prefixTitle?: string;
-    to?: string | object;
-    href?: string;
-    slotPadding?: boolean;
-    isBordered?: boolean;
-}
-
-declare interface FwCheckboxProps {
-    name: string;
-    value?: string;
-    label?: string;
-    rules?: string | Record<string, unknown> | (() => boolean);
-    hint?: string;
-    enableErrors?: boolean;
-    isChecked?: boolean;
-}
-
-declare interface FwModalProps {
-    modelValue: boolean;
-    header?: string;
-    element?: string;
-    body?: string;
-    role?: string;
-    showCancel?: boolean;
-    showConfirm?: boolean;
-    cancelButtonText?: string;
-    cancelButtonType?: ButtonVariantName;
-    confirmButtonText?: string;
-    confirmButtonType?: ButtonVariantName;
-    padding?: boolean;
-    showCloseButton?: boolean;
-    containerClass?: string;
-    footerClass?: string;
-}
-
-type TagVariantName = 'primary' | 'secondary' | 'alert' | 'error' | 'success';
-declare interface TagDefinition {
-    text: string;
-    background: string;
-    iconType: FwButtonProps['variant'];
-}
-type TagDefinitionList = {
-    [key in TagVariantName]: TagDefinition;
-};
-type TagSize = 'xs' | 'sm' | 'md';
-type TagSizes = {
-    [key in TagSize]: string;
-};
-declare interface FwTagProps {
-    size?: TagSize;
-    variant?: TagVariantName;
-}
-
-declare type FwTableItem = Record<string, string | number>;
-declare type FwTableFormatFunction = (value: string | number | object) => string;
-declare type FwTableSortFunction = (items: FwTableItem[], columnName: string, sortDirection?: FwTableSort) => FwTableItem[] | undefined;
-declare type FwTableSort = 'asc' | 'desc';
-declare type FwTableItemOptions = Record<string, {
-    formatter?: FwTableFormatFunction;
-    isSortable?: boolean;
-    disabled?: boolean;
-    initSortOrder?: FwTableSort;
-    sort?: FwTableSortFunction;
-}>;
-declare interface FwTableProps {
-    items: FwTableItem[];
-    options?: FwTableItemOptions;
-    loading?: boolean;
-    clickableRows?: boolean;
-    autoSortColumn?: number;
-    enablePagination?: boolean;
-    totalAmount?: number;
-    pageSize?: number;
-}
-declare type FwTableApi = {
-    resetPage: () => void;
-};
-
-declare interface FwAccordionProps {
-    title?: string;
-    titleClass?: string;
-    suffixTitle?: string;
-    isOpened?: boolean;
-    iconPositionStart?: boolean;
-    isArrow?: boolean;
-    buttonPadding?: string;
-    borderStyle?: string;
-}
-
-declare interface FwImageProps {
-    src?: string;
-    alt?: string;
-    type?: 'native' | 'background';
-    rounded?: boolean;
-    imageClass?: string;
-    threshold?: number;
-    enableErrors?: boolean;
-}
-
-type ToastType = 'success' | 'error' | 'warning';
-type ToastTypes = {
-    [key in ToastType]: string;
-};
-type ToastPosition = 'top' | 'bottom' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
-declare interface FwToastProps {
-    modelValue: boolean;
-    type?: ToastType;
-    position?: ToastPosition;
-    content?: string;
-    element?: string;
-    timeout?: number;
-}
-
-declare interface FwTransactionsCardProps {
-    title: string;
-    subTitle?: string;
-    imageUrl?: string;
-    amount?: string;
-}
-
-declare interface FwBarGraphData {
-    name: string;
-    value: string | number;
-}
-declare interface FwBarChartProps {
-    title?: string;
-    yMarker?: string;
-    x?: string[] | string;
-    y?: (string | number)[] | string;
-    graphData?: FwBarGraphData[] | string;
-}
-
-declare interface FwSidebarMenuItem {
-    to?: string | object;
-    href?: string;
-    label: string;
-    external?: boolean;
-    disabled?: boolean;
-    onClick?: () => void;
-    modelValue?: boolean;
-}
-
-declare interface FwDrawerProps {
-    modelValue: boolean;
-    header?: string;
-    body?: string;
-    role?: string;
-    showCancel?: boolean;
-    showConfirm?: boolean;
-    cancelButtonText?: string;
-    cancelButtonType?: ButtonVariantName;
-    confirmButtonText?: string;
-    confirmButtonType?: ButtonVariantName;
-}
-
-declare interface FwProviderListItem {
-    status: 'supported' | 'outage';
-    name: string;
-    image_url: string;
-}
-declare interface FwProviderListProps {
-    heading: string;
-    items: FwProviderListItem[];
-    searchPlaceholder?: string;
-    tableHeaderName?: string;
-}
-
-declare interface FwDatePickerProps {
-    modelValue: string | {
-        start: string;
-        end: string;
-    } | Date;
-    name: string;
-    label?: string;
-    placeholder?: string;
-    isRange?: boolean;
-    startLabel?: string;
-    endLabel?: string;
-    startPlaceholder?: string;
-    endPlaceholder?: string;
-    tabindex?: string;
-    rounded?: boolean;
-    required?: boolean;
-    maxDate?: string | Date;
-    minDate?: string | Date;
-    rules?: string | Record<string, unknown> | (() => boolean);
-    enableErrors?: boolean;
-}
-
-interface FwPopoverProps {
-    title: string;
-    placement: 'top' | 'right' | 'bottom' | 'left' | 'auto' | 'auto-start' | 'auto-end' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end';
-    trigger: 'click' | 'hover' | 'focus';
-    position: 'fixed' | 'absolute';
-    closeOnClick?: boolean;
-    closeOnClickOutside?: boolean;
-    showOnTop?: boolean;
-    showArrow?: boolean;
-    textAlign?: 'center' | 'left' | 'right';
-}
-
-declare interface FwMediaPickerProps {
-    acceptedFileTypes?: string;
-    maxFileSize?: number;
-    imageUrl?: string;
-    title?: string;
-    uploadHeaderText?: string;
-    editHeaderText?: string;
-}
-
-declare const __default__$6: vue.DefineComponent<{
+declare const __default__$8: vue.DefineComponent<{
     /**
      * The label text of the tag.
      * Overrides the default slot content.
@@ -1547,13 +1822,13 @@ declare const __default__$6: vue.DefineComponent<{
     dismissable: boolean;
 }, {}>;
 
-declare const __default__$5: vue.DefineComponent<{
+declare const __default__$7: vue.DefineComponent<{
     items: {
-        type: PropType<FwTableItem[]>;
+        type: PropType<FwTableProps["items"]>;
         required: true;
     };
     options: {
-        type: PropType<FwTableItemOptions | undefined>;
+        type: PropType<FwTableProps["options"]>;
         required: false;
     };
     loading: {
@@ -1595,15 +1870,15 @@ declare const __default__$5: vue.DefineComponent<{
     rowClicked: (row: FwTableItem) => void;
     bgHoverColor: string;
     currentPage: vue.Ref<number>;
-    maxPageAmount: vue.ComputedRef<number | undefined>;
+    maxPageAmount: vue.Ref<number | undefined>;
     pageArrowClick: (next: boolean) => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("rowClicked" | "columnSorted" | "pageChanged")[], "rowClicked" | "columnSorted" | "pageChanged", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     items: {
-        type: PropType<FwTableItem[]>;
+        type: PropType<FwTableProps["items"]>;
         required: true;
     };
     options: {
-        type: PropType<FwTableItemOptions | undefined>;
+        type: PropType<FwTableProps["options"]>;
         required: false;
     };
     loading: {
@@ -1641,11 +1916,11 @@ declare const __default__$5: vue.DefineComponent<{
     enablePagination: boolean;
 }, {}>;
 
-declare const _default$f: vue.DefineComponent<{}, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{}>>, {}, {}>;
+declare const _default$b: vue.DefineComponent<{}, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{}>>, {}, {}>;
 
-declare const _default$e: vue.DefineComponent<{}, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{}>>, {}, {}>;
+declare const _default$a: vue.DefineComponent<{}, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{}>>, {}, {}>;
 
-declare const __default__$4: vue.DefineComponent<{
+declare const __default__$6: vue.DefineComponent<{
     /**
      * The header title of the accordion
      */
@@ -1680,16 +1955,9 @@ declare const __default__$4: vue.DefineComponent<{
         default: boolean;
     };
     /**
-     * Icon type (arrow or plus)
-     */
-    isArrow: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Padding className for the accordion button
+     * Header className for the accordion button
      */
-    buttonPadding: {
+    headerClass: {
         type: StringConstructor;
         default: string;
     };
@@ -1700,6 +1968,13 @@ declare const __default__$4: vue.DefineComponent<{
         type: StringConstructor;
         default: string;
     };
+    /**
+     * Secondary appearance of the accordion
+     */
+    secondary: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }, {
     isOpen: vue.Ref<boolean>;
     beforeEnter: (el: Element) => void;
@@ -1742,16 +2017,9 @@ declare const __default__$4: vue.DefineComponent<{
         default: boolean;
     };
     /**
-     * Icon type (arrow or plus)
-     */
-    isArrow: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Padding className for the accordion button
+     * Header className for the accordion button
      */
-    buttonPadding: {
+    headerClass: {
         type: StringConstructor;
         default: string;
     };
@@ -1762,18 +2030,25 @@ declare const __default__$4: vue.DefineComponent<{
         type: StringConstructor;
         default: string;
     };
+    /**
+     * Secondary appearance of the accordion
+     */
+    secondary: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & {
     onToggled?: ((...args: any[]) => any) | undefined;
 }, {
     titleClass: string;
     isOpened: boolean;
     iconPositionStart: boolean;
-    isArrow: boolean;
-    buttonPadding: string;
+    headerClass: string;
     borderStyle: string;
+    secondary: boolean;
 }, {}>;
 
-declare const _default$d: vue.DefineComponent<{
+declare const __default__$5: vue.DefineComponent<{
     /**
      * The src attribute of the image
      */
@@ -1786,7 +2061,7 @@ declare const _default$d: vue.DefineComponent<{
      * The type of component. Accepts 'background' and defaults to the native html5 element.
      */
     type: {
-        type: PropType<"native" | "background" | undefined>;
+        type: PropType<FwImageProps["type"]>;
         default: string;
         validator: (value: string) => boolean;
     };
@@ -1820,6 +2095,7 @@ declare const _default$d: vue.DefineComponent<{
 }, {
     fwImageRef: vue.Ref<null>;
     isBackground: vue.ComputedRef<boolean>;
+    colorErrorTextFade5: string;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("click" | "mouseover" | "mouseout")[], "click" | "mouseover" | "mouseout", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     /**
      * The src attribute of the image
@@ -1833,7 +2109,7 @@ declare const _default$d: vue.DefineComponent<{
      * The type of component. Accepts 'background' and defaults to the native html5 element.
      */
     type: {
-        type: PropType<"native" | "background" | undefined>;
+        type: PropType<FwImageProps["type"]>;
         default: string;
         validator: (value: string) => boolean;
     };
@@ -1875,11 +2151,14 @@ declare const _default$d: vue.DefineComponent<{
     enableErrors: boolean;
 }, {}>;
 
-declare const _default$c: vue.DefineComponent<{}, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{}>>, {}, {}>;
+declare const __default__$4: vue.DefineComponent<{}, {
+    primaryFade5: string;
+    primaryFade20: string;
+}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{}>>, {}, {}>;
 
-declare const _default$b: vue.DefineComponent<{}, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{}>>, {}, {}>;
+declare const _default$9: vue.DefineComponent<{}, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{}>>, {}, {}>;
 
-declare const _default$a: vue.DefineComponent<{
+declare const _default$8: vue.DefineComponent<{
     columns: {
         type: NumberConstructor;
         default: number;
@@ -1904,7 +2183,9 @@ declare const _default$a: vue.DefineComponent<{
     rows: number;
 }, {}>;
 
-declare const _default$9: vue.DefineComponent<{
+declare const _default$7: vue.DefineComponent<{}, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{}>>, {}, {}>;
+
+declare const _default$6: vue.DefineComponent<{
     /**
      * The toast's v-model. Controls the visibility of the toast.
      */
@@ -2023,7 +2304,7 @@ declare const _default$9: vue.DefineComponent<{
     timeout: number;
 }, {}>;
 
-declare const _default$8: vue.DefineComponent<{
+declare const _default$5: vue.DefineComponent<{
     /**
      * The transaction title of the card
      */
@@ -2081,88 +2362,7 @@ declare const _default$8: vue.DefineComponent<{
     };
 }>>, {}, {}>;
 
-declare const _default$7: vue.DefineComponent<{
-    /**
-     * The transaction title of the chart
-     */
-    title: {
-        type: StringConstructor;
-    };
-    /**
-     * The marker label of the y-axis transactions
-     */
-    yMarker: {
-        type: StringConstructor;
-    };
-    /**
-     * The x axis data.
-     */
-    x: {
-        type: PropType<string | string[] | undefined>;
-    };
-    /**
-     * The y axis data.
-     */
-    y: {
-        type: PropType<string | (string | number)[] | undefined>;
-    };
-    /**
-     * The x and y axis data.
-     */
-    graphData: {
-        type: PropType<string | FwBarGraphData[] | undefined>;
-    };
-}, {
-    uuid: string;
-    xModel: vue.ComputedRef<string[]>;
-    yModel: vue.ComputedRef<number[]>;
-    chartOptions: vue.ComputedRef<chart_js_dist_types_utils._DeepPartialObject<chart_js.CoreChartOptions<keyof chart_js.ChartTypeRegistry> & chart_js.ElementChartOptions<keyof chart_js.ChartTypeRegistry> & chart_js.PluginChartOptions<keyof chart_js.ChartTypeRegistry> & chart_js.DatasetChartOptions<keyof chart_js.ChartTypeRegistry> & chart_js.ScaleChartOptions<keyof chart_js.ChartTypeRegistry>>>;
-    chartData: vue.ComputedRef<{
-        labels: string[];
-        datasets: {
-            backgroundColor: string[] | undefined;
-            data: number[];
-            borderWidth: number;
-            borderRadius: number;
-            barPercentage: number;
-        }[];
-    }>;
-    bgColor: string;
-    primaryFade: string;
-}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
-    /**
-     * The transaction title of the chart
-     */
-    title: {
-        type: StringConstructor;
-    };
-    /**
-     * The marker label of the y-axis transactions
-     */
-    yMarker: {
-        type: StringConstructor;
-    };
-    /**
-     * The x axis data.
-     */
-    x: {
-        type: PropType<string | string[] | undefined>;
-    };
-    /**
-     * The y axis data.
-     */
-    y: {
-        type: PropType<string | (string | number)[] | undefined>;
-    };
-    /**
-     * The x and y axis data.
-     */
-    graphData: {
-        type: PropType<string | FwBarGraphData[] | undefined>;
-    };
-}>>, {}, {}>;
-
-declare const _default$6: vue.DefineComponent<{
+declare const _default$4: vue.DefineComponent<{
     /**
      * Controls the sidebar menu open/close state
      */
@@ -2175,7 +2375,7 @@ declare const _default$6: vue.DefineComponent<{
      * `{ to?: string | object; href?: string; label: string; }`
      */
     menuItems: {
-        type: PropType<FwSidebarMenuItem[]>;
+        type: PropType<FwSidebarMenuProps["menuItems"]>;
     };
     /**
      * The class for the open/close toggle button
@@ -2198,6 +2398,14 @@ declare const _default$6: vue.DefineComponent<{
         type: StringConstructor;
         default: string;
     };
+    /**
+     * The button variant of the toggle button
+     */
+    toggleButtonVariant: {
+        type: PropType<FwSidebarMenuProps["toggleButtonVariant"]>;
+        default: string;
+        validator: (value: string) => boolean;
+    };
 }, {
     baseClass: string;
     isMenuOpen: vue.WritableComputedRef<boolean>;
@@ -2215,7 +2423,7 @@ declare const _default$6: vue.DefineComponent<{
      * `{ to?: string | object; href?: string; label: string; }`
      */
     menuItems: {
-        type: PropType<FwSidebarMenuItem[]>;
+        type: PropType<FwSidebarMenuProps["menuItems"]>;
     };
     /**
      * The class for the open/close toggle button
@@ -2238,17 +2446,26 @@ declare const _default$6: vue.DefineComponent<{
         type: StringConstructor;
         default: string;
     };
+    /**
+     * The button variant of the toggle button
+     */
+    toggleButtonVariant: {
+        type: PropType<FwSidebarMenuProps["toggleButtonVariant"]>;
+        default: string;
+        validator: (value: string) => boolean;
+    };
 }>> & {
     onToggled?: ((...args: any[]) => any) | undefined;
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
+    toggleButtonVariant: ButtonVariantName | undefined;
     modelValue: boolean;
     toggleButtonClass: string;
     openWidth: string;
     closedWidth: string;
 }, {}>;
 
-declare const _default$5: vue.DefineComponent<{
+declare const __default__$3: vue.DefineComponent<{
     /**
      * The drawer's v-model. Controls the visibility of the drawer.
      */
@@ -2274,6 +2491,13 @@ declare const _default$5: vue.DefineComponent<{
         type: StringConstructor;
         default: string;
     };
+    /**
+     * The element to attach the modal too. Defaults to `#app` element.
+     */
+    element: {
+        type: StringConstructor;
+        default: string;
+    };
     /**
      * Whether to show the cancel button
      */
@@ -2299,7 +2523,7 @@ declare const _default$5: vue.DefineComponent<{
      * Button variant for the cancel button
      */
     cancelButtonType: {
-        type: PropType<ButtonVariantName>;
+        type: PropType<FwDrawerProps["cancelButtonType"]>;
         default: string;
         validator: (value: string) => boolean;
     };
@@ -2314,7 +2538,7 @@ declare const _default$5: vue.DefineComponent<{
      * Button variant for the confirm button
      */
     confirmButtonType: {
-        type: PropType<ButtonVariantName>;
+        type: PropType<FwDrawerProps["confirmButtonType"]>;
         default: string;
         validator: (value: string) => boolean;
     };
@@ -2326,6 +2550,7 @@ declare const _default$5: vue.DefineComponent<{
     isMounted: vue.Ref<boolean>;
     onConfirmed: () => void;
     onCancelled: () => void;
+    drawerBgColour: string;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("update:modelValue" | "cancel" | "confirm")[], "update:modelValue" | "cancel" | "confirm", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     /**
      * The drawer's v-model. Controls the visibility of the drawer.
@@ -2352,6 +2577,13 @@ declare const _default$5: vue.DefineComponent<{
         type: StringConstructor;
         default: string;
     };
+    /**
+     * The element to attach the modal too. Defaults to `#app` element.
+     */
+    element: {
+        type: StringConstructor;
+        default: string;
+    };
     /**
      * Whether to show the cancel button
      */
@@ -2377,7 +2609,7 @@ declare const _default$5: vue.DefineComponent<{
      * Button variant for the cancel button
      */
     cancelButtonType: {
-        type: PropType<ButtonVariantName>;
+        type: PropType<FwDrawerProps["cancelButtonType"]>;
         default: string;
         validator: (value: string) => boolean;
     };
@@ -2392,7 +2624,7 @@ declare const _default$5: vue.DefineComponent<{
      * Button variant for the confirm button
      */
     confirmButtonType: {
-        type: PropType<ButtonVariantName>;
+        type: PropType<FwDrawerProps["confirmButtonType"]>;
         default: string;
         validator: (value: string) => boolean;
     };
@@ -2401,17 +2633,18 @@ declare const _default$5: vue.DefineComponent<{
     onConfirm?: ((...args: any[]) => any) | undefined;
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
+    cancelButtonType: ButtonVariantName | undefined;
+    confirmButtonType: ButtonVariantName | undefined;
     modelValue: boolean;
     role: string;
+    element: string;
     showCancel: boolean;
     showConfirm: boolean;
     cancelButtonText: string;
-    cancelButtonType: ButtonVariantName;
     confirmButtonText: string;
-    confirmButtonType: ButtonVariantName;
 }, {}>;
 
-declare const _default$4: vue.DefineComponent<{
+declare const __default__$2: vue.DefineComponent<{
     /**
      * The header heading of the list.
      */
@@ -2422,7 +2655,7 @@ declare const _default$4: vue.DefineComponent<{
      * The list items of the table items.
      */
     items: {
-        type: PropType<FwProviderListItem[]>;
+        type: PropType<FwProviderListProps["items"]>;
         required: true;
     };
     /**
@@ -2458,6 +2691,9 @@ declare const _default$4: vue.DefineComponent<{
     sortedTableItems: vue.ComputedRef<FwTableItem[]>;
     searchFilterModel: vue.Ref<string>;
     statusFilterModel: vue.Ref<string>;
+    primaryFade5: string;
+    primaryFade20: string;
+    primaryFade40: string;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "changed"[], "changed", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     /**
      * The header heading of the list.
@@ -2469,7 +2705,7 @@ declare const _default$4: vue.DefineComponent<{
      * The list items of the table items.
      */
     items: {
-        type: PropType<FwProviderListItem[]>;
+        type: PropType<FwProviderListProps["items"]>;
         required: true;
     };
     /**
@@ -2509,15 +2745,13 @@ declare const _default$4: vue.DefineComponent<{
     statusFilterLabel: string;
 }, {}>;
 
-declare const __default__$3: vue.DefineComponent<{
+declare const __default__$1: vue.DefineComponent<{
     /**
      * The date-picker v-model
      */
     modelValue: {
-        type: PropType<string | Date | {
-            start: string;
-            end: string;
-        }>;
+        type: PropType<FwDatePickerModel>;
+        default: null;
     };
     /**
      * The name of the input field. Must be unique per form.
@@ -2604,27 +2838,24 @@ declare const __default__$3: vue.DefineComponent<{
      * The minimum selectable date
      */
     minDate: {
-        type: PropType<string | Date | undefined>;
+        type: PropType<FwDatePickerProps["minDate"]>;
     };
     /**
      * The maximum selectable date
      */
     maxDate: {
-        type: PropType<string | Date | undefined>;
+        type: PropType<FwDatePickerProps["maxDate"]>;
     };
     /**
      * Validation rules. Accepts an object, string schema or validation function.
      */
     rules: {
-        type: PropType<string | Record<string, unknown> | (() => boolean) | undefined>;
+        type: PropType<FwDatePickerProps["rules"]>;
     };
 }, {
     uuid: string;
     inputBaseClass: vue.Ref<string>;
-    dateModel: vue.WritableComputedRef<string | Date | {
-        start: string;
-        end: string;
-    } | undefined>;
+    dateModel: vue.WritableComputedRef<FwDatePickerModel>;
     errors: vue.Ref<string[]>;
     errorMessage: vue.Ref<string | undefined>;
     meta: vee_validate.FieldMeta<unknown>;
@@ -2642,10 +2873,8 @@ declare const __default__$3: vue.DefineComponent<{
      * The date-picker v-model
      */
     modelValue: {
-        type: PropType<string | Date | {
-            start: string;
-            end: string;
-        }>;
+        type: PropType<FwDatePickerModel>;
+        default: null;
     };
     /**
      * The name of the input field. Must be unique per form.
@@ -2732,23 +2961,24 @@ declare const __default__$3: vue.DefineComponent<{
      * The minimum selectable date
      */
     minDate: {
-        type: PropType<string | Date | undefined>;
+        type: PropType<FwDatePickerProps["minDate"]>;
     };
     /**
      * The maximum selectable date
      */
     maxDate: {
-        type: PropType<string | Date | undefined>;
+        type: PropType<FwDatePickerProps["maxDate"]>;
     };
     /**
      * Validation rules. Accepts an object, string schema or validation function.
      */
     rules: {
-        type: PropType<string | Record<string, unknown> | (() => boolean) | undefined>;
+        type: PropType<FwDatePickerProps["rules"]>;
     };
 }>> & {
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
+    modelValue: FwDatePickerModel;
     isRange: boolean;
     tabindex: string;
     rounded: boolean;
@@ -2756,7 +2986,7 @@ declare const __default__$3: vue.DefineComponent<{
     enableErrors: boolean;
 }, {}>;
 
-declare const __default__$2: vue.DefineComponent<{
+declare const __default__: vue.DefineComponent<{
     /**
      * The title of the popover
      */
@@ -2765,7 +2995,7 @@ declare const __default__$2: vue.DefineComponent<{
      * The side of the target element the popover should be placed against. Accepts 'top', 'right', 'bottom' and 'left'
      */
     placement: {
-        type: PropType<"top" | "right" | "bottom" | "left" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end">;
+        type: PropType<FwPopoverProps["placement"]>;
         default: string;
         validator: (value: string) => boolean;
     };
@@ -2774,7 +3004,7 @@ declare const __default__$2: vue.DefineComponent<{
      * Absolute is more performant if you have a lot of popovers; fixed is more robust
      */
     position: {
-        type: PropType<"fixed" | "absolute">;
+        type: PropType<FwPopoverProps["position"]>;
         default: string;
         validator: (value: string) => boolean;
     };
@@ -2833,6 +3063,10 @@ declare const __default__$2: vue.DefineComponent<{
     autoCloseContent: (e: Event) => void;
     visible: vue.Ref<boolean>;
     spacingSize: vue.ComputedRef<"12px" | "2px">;
+    debounce: {
+        <T extends (...args: any) => any>(func: T, wait: number | undefined, options: lodash.DebounceSettingsLeading): lodash.DebouncedFuncLeading<T>;
+        <T extends (...args: any) => any>(func: T, wait?: number, options?: lodash.DebounceSettings): lodash.DebouncedFunc<T>;
+    };
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "closed"[], "closed", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     /**
      * The title of the popover
@@ -2842,7 +3076,7 @@ declare const __default__$2: vue.DefineComponent<{
      * The side of the target element the popover should be placed against. Accepts 'top', 'right', 'bottom' and 'left'
      */
     placement: {
-        type: PropType<"top" | "right" | "bottom" | "left" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end">;
+        type: PropType<FwPopoverProps["placement"]>;
         default: string;
         validator: (value: string) => boolean;
     };
@@ -2851,7 +3085,7 @@ declare const __default__$2: vue.DefineComponent<{
      * Absolute is more performant if you have a lot of popovers; fixed is more robust
      */
     position: {
-        type: PropType<"fixed" | "absolute">;
+        type: PropType<FwPopoverProps["position"]>;
         default: string;
         validator: (value: string) => boolean;
     };
@@ -2913,60 +3147,6 @@ declare const __default__$2: vue.DefineComponent<{
 }, {}>;
 
 declare const _default$3: vue.DefineComponent<{
-    modelValue: {
-        type: PropType<number | undefined>;
-    };
-    /**
-     * The available periods to be chosen in months.
-     */
-    periodOptions: {
-        type: PropType<number[]>;
-    };
-    /**
-     * A size that will be propogated down to the button. Accepts: 'sm', 'md', 'lg', 'xl', '2xl'
-     */
-    size: {
-        type: PropType<ButtonSize>;
-        default: string;
-        validator: (value: string) => boolean;
-    };
-    disabled: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}, {
-    generateButtonLabel: (month: number) => string;
-    selectedPeriod: vue.WritableComputedRef<number | undefined>;
-}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
-    modelValue: {
-        type: PropType<number | undefined>;
-    };
-    /**
-     * The available periods to be chosen in months.
-     */
-    periodOptions: {
-        type: PropType<number[]>;
-    };
-    /**
-     * A size that will be propogated down to the button. Accepts: 'sm', 'md', 'lg', 'xl', '2xl'
-     */
-    size: {
-        type: PropType<ButtonSize>;
-        default: string;
-        validator: (value: string) => boolean;
-    };
-    disabled: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>> & {
-    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
-}, {
-    size: ButtonSize;
-    disabled: boolean;
-}, {}>;
-
-declare const _default$2: vue.DefineComponent<{
     /**
      * The accepted file types for the media picker
      */
@@ -3078,7 +3258,7 @@ declare const _default$2: vue.DefineComponent<{
     editHeaderText: string;
 }, {}>;
 
-declare const _default$1: vue.DefineComponent<{
+declare const _default$2: vue.DefineComponent<{
     min: {
         type: NumberConstructor;
         default: number;
@@ -3137,53 +3317,86 @@ declare const _default$1: vue.DefineComponent<{
     maxValue: number;
 }, {}>;
 
-declare const __default__$1: vue.DefineComponent<{
+declare const _default$1: vue.DefineComponent<{
     /**
-     * The animation-iteration-count CSS property of the pulse animation.
-     * Sets the number of times an animation sequence should be played before stopping.
-     * https://developer.mozilla.org/en-US/docs/Web/CSS/animation-iteration-count
+     * The transaction title of the chart
      */
-    animationIteration: {
-        type: (StringConstructor | NumberConstructor)[];
-        default: number;
+    title: {
+        type: StringConstructor;
     };
-}, unknown, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     /**
-     * The animation-iteration-count CSS property of the pulse animation.
-     * Sets the number of times an animation sequence should be played before stopping.
-     * https://developer.mozilla.org/en-US/docs/Web/CSS/animation-iteration-count
+     * The marker label of the y-axis transactions
      */
-    animationIteration: {
-        type: (StringConstructor | NumberConstructor)[];
-        default: number;
+    yMarker: {
+        type: StringConstructor;
     };
-}>>, {
-    animationIteration: string | number;
-}, {}>;
-
-declare const __default__: vue.DefineComponent<{
     /**
-     * The animation-iteration-count CSS property of the pulse animation.
-     * Sets the number of times an animation sequence should be played before stopping.
-     * https://developer.mozilla.org/en-US/docs/Web/CSS/animation-iteration-count
+     * The x axis data.
      */
-    animationIteration: {
-        type: (StringConstructor | NumberConstructor)[];
-        default: number;
+    x: {
+        type: PropType<FwBarChartProps["x"]>;
     };
-}, unknown, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     /**
-     * The animation-iteration-count CSS property of the pulse animation.
-     * Sets the number of times an animation sequence should be played before stopping.
-     * https://developer.mozilla.org/en-US/docs/Web/CSS/animation-iteration-count
+     * The y axis data.
      */
-    animationIteration: {
-        type: (StringConstructor | NumberConstructor)[];
-        default: number;
+    y: {
+        type: PropType<FwBarChartProps["y"]>;
     };
-}>>, {
-    animationIteration: string | number;
-}, {}>;
+    /**
+     * The x and y axis data.
+     */
+    graphData: {
+        type: PropType<FwBarChartProps["graphData"]>;
+    };
+}, {
+    uuid: string;
+    xModel: vue.ComputedRef<string[]>;
+    yModel: vue.ComputedRef<number[]>;
+    chartOptions: vue.ComputedRef<chart_js_dist_types_utils._DeepPartialObject<chart_js.CoreChartOptions<"bar"> & chart_js.ElementChartOptions<"bar"> & chart_js.PluginChartOptions<"bar"> & chart_js.DatasetChartOptions<"bar"> & chart_js.ScaleChartOptions<"bar"> & chart_js.BarControllerChartOptions>>;
+    chartData: vue.ComputedRef<{
+        labels: string[];
+        datasets: {
+            backgroundColor: string[] | undefined;
+            data: number[];
+            borderWidth: number;
+            borderRadius: number;
+            barPercentage: number;
+        }[];
+    }>;
+    bgColor: string;
+    primaryFade: string;
+}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    /**
+     * The transaction title of the chart
+     */
+    title: {
+        type: StringConstructor;
+    };
+    /**
+     * The marker label of the y-axis transactions
+     */
+    yMarker: {
+        type: StringConstructor;
+    };
+    /**
+     * The x axis data.
+     */
+    x: {
+        type: PropType<FwBarChartProps["x"]>;
+    };
+    /**
+     * The y axis data.
+     */
+    y: {
+        type: PropType<FwBarChartProps["y"]>;
+    };
+    /**
+     * The x and y axis data.
+     */
+    graphData: {
+        type: PropType<FwBarChartProps["graphData"]>;
+    };
+}>>, {}, {}>;
 
 declare const _default: vue.DefineComponent<{}, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{}>>, {}, {}>;
 
@@ -3205,8 +3418,31 @@ declare const toastService: () => {
     warning: (options?: ToastServiceProps) => void;
 };
 
+declare const getHexWithOpacity: (hexColor: string, fadePercentage: number | string) => string;
+declare const useColours: () => {
+    colorPrimary: string;
+    colorSecondary: string;
+    colorTertiary: string;
+    fontFamily: string;
+    colorBody: string;
+    primaryFade5: string;
+    primaryFade10: string;
+    primaryFade20: string;
+    primaryFade30: string;
+    primaryFade40: string;
+    primaryFade50: string;
+    primaryFade60: string;
+    primaryFade70: string;
+    primaryFade80: string;
+    primaryFade90: string;
+    brandBg1Fade95: string;
+    colorErrorTextFade5: string;
+};
+
+declare const getVueComponentHtml: (component: Component, props: ComponentCustomProps) => string;
+
 declare const install: Exclude<Plugin['install'], undefined>;
 
 declare module '@frollo/frollo-web-ui/icons' { }
 
-export { type ButtonAnimation, type ButtonDefinition, type ButtonDefinitionList, type ButtonSize, type ButtonSizes, type ButtonTypeAttribute, type ButtonVariantName, __default__$4 as FwAccordion, type FwAccordionProps, _default$7 as FwBarChart, type FwBarChartProps, type FwBarGraphData, _default$l as FwButton, type FwButtonProps, _default$m as FwCard, type FwCardProps, _default$o as FwCheckbox, type FwCheckboxProps, __default__$3 as FwDatePicker, type FwDatePickerProps, _default$5 as FwDrawer, type FwDrawerProps, _default$n as FwDropdown, type FwDropdownOption, type FwDropdownProps, __default__$1 as FwEmailPulse, _default$d as FwImage, type FwImageProps, _default$p as FwInput, type FwInputProps, type FwInputType, _default$c as FwLoadingBar, _default$b as FwLoadingCard, _default as FwLoadingSpinner, _default$a as FwLoadingTable, _default$2 as FwMediaPicker, type FwMediaPickerProps, _default$h as FwModal, type FwModalProps, _default$k as FwNavigationMenu, _default$3 as FwPeriodSelector, __default__$2 as FwPopover, type FwPopoverProps, _default$g as FwProgressBar, _default$4 as FwProviderList, type FwProviderListItem, type FwProviderListProps, _default$6 as FwSidebarMenu, type FwSidebarMenuItem, _default$1 as FwSlider, __default__ as FwSuccessPulse, _default$i as FwTab, __default__$5 as FwTable, type FwTableApi, type FwTableFormatFunction, _default$f as FwTableHead, type FwTableItem, type FwTableItemOptions, type FwTableProps, _default$e as FwTableRow, type FwTableSort, type FwTableSortFunction, _default$j as FwTabs, type FwTabsProps, __default__$6 as FwTag, type FwTagProps, _default$9 as FwToast, type FwToastProps, _default$8 as FwTransactionsCard, type FwTransactionsCardProps, type ModalServiceProps, type NavMenuItem, type ProgressBarStep, type TabsState, type TagDefinition, type TagDefinitionList, type TagSize, type TagSizes, type TagVariantName, type ToastPosition, type ToastServiceProps, type ToastType, type ToastTypes, install as default, modalService, toastService };
+export { type ButtonAnimation, type ButtonDefinition, type ButtonDefinitionList, type ButtonSize, type ButtonSizes, type ButtonTypeAttribute, type ButtonVariantName, __default__$6 as FwAccordion, type FwAccordionProps, _default$g as FwAlert, _default$1 as FwBarChart, type FwBarChartProps, type FwBarGraphData, _default$h as FwButton, type FwButtonProps, __default__$a as FwCard, type FwCardProps, __default__$c as FwCheckbox, type FwCheckboxProps, __default__$1 as FwDatePicker, type FwDatePickerModel, type FwDatePickerProps, __default__$3 as FwDrawer, type FwDrawerProps, __default__$b as FwDropdown, type FwDropdownOption, type FwDropdownProps, __default__$5 as FwImage, type FwImageProps, __default__$d as FwInput, type FwInputProps, type FwInputType, __default__$4 as FwLoadingBar, _default$9 as FwLoadingCard, _default$7 as FwLoadingDots, _default$8 as FwLoadingTable, _default$3 as FwMediaPicker, type FwMediaPickerProps, __default__$9 as FwModal, type FwModalProps, _default$f as FwNavigationMenu, type FwNavigationMenuProps, __default__ as FwPopover, type FwPopoverProps, _default$c as FwProgressBar, __default__$2 as FwProviderList, type FwProviderListItem, type FwProviderListProps, _default$4 as FwSidebarMenu, type FwSidebarMenuItem, type FwSidebarMenuProps, _default$2 as FwSlider, _default as FwSuccessAnimation, _default$i as FwSwitch, type FwSwitchProps, _default$d as FwTab, __default__$7 as FwTable, type FwTableFormatFunction, _default$b as FwTableHead, type FwTableItem, type FwTableItemOptions, type FwTableProps, _default$a as FwTableRow, type FwTableSort, type FwTableSortFunction, _default$e as FwTabs, type FwTabsProps, __default__$8 as FwTag, type FwTagProps, _default$6 as FwToast, type FwToastProps, _default$5 as FwTransactionsCard, type FwTransactionsCardProps, type ModalServiceProps, type NavMenuItem, type ProgressBarStep, type TabsState, type TagDefinition, type TagDefinitionList, type TagSize, type TagSizes, type TagVariantName, type ToastPosition, type ToastServiceProps, type ToastType, type ToastTypes, install as default, getHexWithOpacity, getVueComponentHtml, modalService, toastService, useColours };