@frollo/frollo-web-ui 1.2.3 → 1.2.5

package/icons/index.ts

@@ -23,6 +23,7 @@ import CoinsSvg from './coins.svg';
 import CaretDownSvg from './caret-down.svg';
 import SortLightSvg from './sort-light.svg';
 import PlusSvg from './plus.svg';
+import UserSvg from './user.svg';
 
 export {
   ViewSvg,
@@ -49,5 +50,6 @@ export {
   CoinsSvg,
   CaretDownSvg,
   SortLightSvg,
-  PlusSvg
+  PlusSvg,
+  UserSvg
 };

package/icons/user.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 26 27" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
+<path d="M13 13.5C16.535 13.5 19.4 10.6345 19.4 7.09995C19.4 3.56545 16.535 0.699951 13 0.699951C9.46499 0.699951 6.59999 3.56545 6.59999 7.09995C6.59999 10.6345 9.46499 13.5 13 13.5ZM13 2.29995C15.647 2.29995 17.8 4.45295 17.8 7.09995C17.8 9.74645 15.647 11.9 13 11.9C10.353 11.9 8.19999 9.74495 8.19999 7.09995C8.19999 4.45295 10.355 2.29995 13 2.29995ZM15.535 15.9H10.465C5.68049 15.9 1.79999 19.78 1.79999 24.565C1.79999 25.522 2.57599 26.2985 3.53299 26.2985H22.468C23.425 26.3 24.2 25.525 24.2 24.565C24.2 19.78 20.32 15.9 15.535 15.9ZM22.465 24.7H3.53299C3.45999 24.7 3.39999 24.64 3.39999 24.565C3.39999 20.67 6.56999 17.5 10.465 17.5H15.53C19.43 17.5 22.6 20.67 22.6 24.565C22.6 24.64 22.54 24.7 22.465 24.7Z" />
+</svg>

package/index.d.ts

@@ -18,7 +18,7 @@ declare interface FwInputProps {
     tabindex?: string;
 }
 
-declare const _default$e: vue.DefineComponent<{
+declare const _default$i: vue.DefineComponent<{
     /**
      * The input v-model
      */
@@ -169,7 +169,7 @@ declare const _default$e: vue.DefineComponent<{
     tabindex: string;
 }>;
 
-declare const _default$d: vue.DefineComponent<{
+declare const _default$h: vue.DefineComponent<{
     /**
      * The name of the input field. Must be unique per form.
      */
@@ -236,7 +236,7 @@ declare interface FwDropdownProps {
     placeholder?: string;
 }
 
-declare const _default$c: vue.DefineComponent<{
+declare const _default$g: vue.DefineComponent<{
     /**
      * The select v-model
      */
@@ -347,7 +347,7 @@ declare const _default$c: vue.DefineComponent<{
     placeholder: string;
 }>;
 
-declare const _default$b: vue.DefineComponent<{
+declare const _default$f: vue.DefineComponent<{
     /**
      * The header title of the card
      */
@@ -454,7 +454,7 @@ declare interface FwButtonProps {
     rounded?: boolean;
 }
 
-declare const _default$a: vue.DefineComponent<{
+declare const _default$e: vue.DefineComponent<{
     /**
      * A `router-link` path or object
      */
@@ -590,7 +590,7 @@ declare interface NavMenuItem {
     label: string;
 }
 
-declare const _default$9: vue.DefineComponent<{
+declare const _default$d: vue.DefineComponent<{
     /**
      * An array of menu items
      * `{ to?: string | object; href?: string; label: string; }`
@@ -629,7 +629,7 @@ declare const _default$9: vue.DefineComponent<{
     onAction?: ((...args: any[]) => any) | undefined;
 }, {}>;
 
-declare const _default$8: vue.DefineComponent<{
+declare const _default$c: vue.DefineComponent<{
     /**
      * The active tab v-model
      */
@@ -653,7 +653,7 @@ declare const _default$8: vue.DefineComponent<{
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {}>;
 
-declare const _default$7: vue.DefineComponent<{
+declare const _default$b: vue.DefineComponent<{
     /**
      * The label of the tab component used as the button panel label
      */
@@ -685,7 +685,7 @@ declare const _default$7: vue.DefineComponent<{
     };
 }>>, {}>;
 
-declare const _default$6: vue.DefineComponent<{
+declare const _default$a: vue.DefineComponent<{
     /**
      * The header title of the modal
      */
@@ -834,7 +834,7 @@ declare interface ProgressBarStep {
     subSteps: number;
 }
 
-declare const _default$5: vue.DefineComponent<{
+declare const _default$9: vue.DefineComponent<{
     /**
      * An array of menu progress steps.
      * `{ label: string; position: number; subSteps: number; }`
@@ -901,7 +901,7 @@ declare interface FwTagProps {
     variant?: TagVariantName;
 }
 
-declare const _default$4: vue.DefineComponent<{
+declare const _default$8: vue.DefineComponent<{
     /**
      * The size of the tag. Accepts: 'xs' & 'sm'
      */
@@ -958,9 +958,10 @@ declare type FwTableSort = 'asc' | 'desc';
 declare interface FwTableProps {
     items: FwTableItem[];
     options?: FwTableItemOptions;
+    loading?: boolean;
 }
 
-declare const _default$3: vue.DefineComponent<{
+declare const _default$7: vue.DefineComponent<{
     items: {
         type: PropType<FwTableItem[]>;
         required: true;
@@ -969,6 +970,10 @@ declare const _default$3: vue.DefineComponent<{
         type: PropType<FwTableItemOptions | undefined>;
         required: false;
     };
+    loading: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }, {
     columns: vue.ComputedRef<string[]>;
     sortBy: vue.Ref<string>;
@@ -989,13 +994,19 @@ declare const _default$3: vue.DefineComponent<{
         type: PropType<FwTableItemOptions | undefined>;
         required: false;
     };
-}>>, {}>;
+    loading: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>>, {
+    loading: boolean;
+}>;
 
-declare const _default$2: vue.DefineComponent<{}, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, vue.EmitsOptions, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{}>>, {}>;
+declare const _default$6: vue.DefineComponent<{}, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, vue.EmitsOptions, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{}>>, {}>;
 
-declare const _default$1: vue.DefineComponent<{}, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, vue.EmitsOptions, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{}>>, {}>;
+declare const _default$5: vue.DefineComponent<{}, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, vue.EmitsOptions, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{}>>, {}>;
 
-declare const _default: vue.DefineComponent<{
+declare const _default$4: vue.DefineComponent<{
     /**
      * The header title of the accordion
      */
@@ -1043,6 +1054,118 @@ declare const _default: vue.DefineComponent<{
     isOpened: boolean;
 }>;
 
+declare const _default$3: vue.DefineComponent<{
+    /**
+     * The src attribute of the image
+     */
+    src: StringConstructor;
+    /**
+     * The alt attribute of the image
+     */
+    alt: StringConstructor;
+    /**
+     * The type of component. Accepts 'background' and defaults to the native html5 element.
+     */
+    type: {
+        type: PropType<"native" | "background" | undefined>;
+        default: string;
+        validator: (value: string) => boolean;
+    };
+    /**
+     * Whether the loading bar and error state are rounded.
+     */
+    rounded: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * The class for the native image element
+     */
+    imageClass: {
+        type: StringConstructor;
+    };
+    /**
+     * Controls the threshold before the component triggers the src url.
+     */
+    threshold: {
+        type: NumberConstructor;
+        default: number;
+    };
+}, {
+    fwImageRef: vue.Ref<null>;
+    isBackground: vue.ComputedRef<boolean>;
+}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    /**
+     * The src attribute of the image
+     */
+    src: StringConstructor;
+    /**
+     * The alt attribute of the image
+     */
+    alt: StringConstructor;
+    /**
+     * The type of component. Accepts 'background' and defaults to the native html5 element.
+     */
+    type: {
+        type: PropType<"native" | "background" | undefined>;
+        default: string;
+        validator: (value: string) => boolean;
+    };
+    /**
+     * Whether the loading bar and error state are rounded.
+     */
+    rounded: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * The class for the native image element
+     */
+    imageClass: {
+        type: StringConstructor;
+    };
+    /**
+     * Controls the threshold before the component triggers the src url.
+     */
+    threshold: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>>, {
+    type: "native" | "background" | undefined;
+    rounded: boolean;
+    threshold: number;
+}>;
+
+declare const _default$2: vue.DefineComponent<{}, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, vue.EmitsOptions, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{}>>, {}>;
+
+declare const _default$1: vue.DefineComponent<{}, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, vue.EmitsOptions, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{}>>, {}>;
+
+declare const _default: vue.DefineComponent<{
+    columns: {
+        type: NumberConstructor;
+        default: number;
+    };
+    rows: {
+        type: NumberConstructor;
+        default: number;
+    };
+}, {
+    tableClass: string;
+}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    columns: {
+        type: NumberConstructor;
+        default: number;
+    };
+    rows: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>>, {
+    columns: number;
+    rows: number;
+}>;
+
 declare const __default__$1: vue.DefineComponent<{
     /**
      * The animation-iteration-count CSS property of the pulse animation.
@@ -1136,6 +1259,15 @@ declare interface FwAccordionProps {
     isOpened?: boolean;
 }
 
+declare interface FwImageProps {
+    src?: string;
+    alt?: string;
+    type?: 'native' | 'background';
+    rounded?: boolean;
+    imageClass?: string;
+    threshold?: number;
+}
+
 declare module '@frollo/frollo-web-ui/icons' { }
 
-export { ButtonAnimation, ButtonDefinition, ButtonDefinitionList, ButtonSize, ButtonSizes, ButtonTypeAttribute, ButtonVariantName, _default as FwAccordion, FwAccordionProps, _default$a as FwButton, FwButtonProps, _default$b as FwCard, FwCardProps, _default$d as FwCheckbox, FwCheckboxProps, _default$c as FwDropdown, FwDropdownOption, FwDropdownProps, __default__$1 as FwEmailPulse, _default$e as FwInput, FwInputProps, FwInputType, _default$6 as FwModal, FwModalProps, _default$9 as FwNavigationMenu, _default$5 as FwProgressBar, __default__ as FwSuccessPulse, _default$7 as FwTab, _default$3 as FwTable, FwTableFormatFunction, _default$2 as FwTableHead, FwTableItem, FwTableItemOptions, FwTableProps, _default$1 as FwTableRow, FwTableSort, _default$8 as FwTabs, _default$4 as FwTag, FwTagProps, ModalServiceProps, NavMenuItem, ProgressBarStep, TagDefinition, TagDefinitionList, TagSize, TagSizes, TagVariantName, install as default, modalService };
+export { ButtonAnimation, ButtonDefinition, ButtonDefinitionList, ButtonSize, ButtonSizes, ButtonTypeAttribute, ButtonVariantName, _default$4 as FwAccordion, FwAccordionProps, _default$e as FwButton, FwButtonProps, _default$f as FwCard, FwCardProps, _default$h as FwCheckbox, FwCheckboxProps, _default$g as FwDropdown, FwDropdownOption, FwDropdownProps, __default__$1 as FwEmailPulse, _default$3 as FwImage, FwImageProps, _default$i as FwInput, FwInputProps, FwInputType, _default$2 as FwLoadingBar, _default$1 as FwLoadingCard, _default as FwLoadingTable, _default$a as FwModal, FwModalProps, _default$d as FwNavigationMenu, _default$9 as FwProgressBar, __default__ as FwSuccessPulse, _default$b as FwTab, _default$7 as FwTable, FwTableFormatFunction, _default$6 as FwTableHead, FwTableItem, FwTableItemOptions, FwTableProps, _default$5 as FwTableRow, FwTableSort, _default$c as FwTabs, _default$8 as FwTag, FwTagProps, ModalServiceProps, NavMenuItem, ProgressBarStep, TagDefinition, TagDefinitionList, TagSize, TagSizes, TagVariantName, install as default, modalService };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@frollo/frollo-web-ui",
-  "version": "1.2.3",
+  "version": "1.2.5",
   "description": "Frollo's UI library for components, utilities and configs",
   "exports": {
     "./icons": "./icons/index.ts",

package/types/components/fw-image/fw-image.vue.d.ts

@@ -0,0 +1,84 @@
+import { PropType } from 'vue';
+declare const _default: import("vue").DefineComponent<{
+    /**
+     * The src attribute of the image
+     */
+    src: StringConstructor;
+    /**
+     * The alt attribute of the image
+     */
+    alt: StringConstructor;
+    /**
+     * The type of component. Accepts 'background' and defaults to the native html5 element.
+     */
+    type: {
+        type: PropType<"native" | "background" | undefined>;
+        default: string;
+        validator: (value: string) => boolean;
+    };
+    /**
+     * Whether the loading bar and error state are rounded.
+     */
+    rounded: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * The class for the native image element
+     */
+    imageClass: {
+        type: StringConstructor;
+    };
+    /**
+     * Controls the threshold before the component triggers the src url.
+     */
+    threshold: {
+        type: NumberConstructor;
+        default: number;
+    };
+}, {
+    fwImageRef: import("vue").Ref<null>;
+    isBackground: import("vue").ComputedRef<boolean>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * The src attribute of the image
+     */
+    src: StringConstructor;
+    /**
+     * The alt attribute of the image
+     */
+    alt: StringConstructor;
+    /**
+     * The type of component. Accepts 'background' and defaults to the native html5 element.
+     */
+    type: {
+        type: PropType<"native" | "background" | undefined>;
+        default: string;
+        validator: (value: string) => boolean;
+    };
+    /**
+     * Whether the loading bar and error state are rounded.
+     */
+    rounded: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * The class for the native image element
+     */
+    imageClass: {
+        type: StringConstructor;
+    };
+    /**
+     * Controls the threshold before the component triggers the src url.
+     */
+    threshold: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>>, {
+    type: "native" | "background" | undefined;
+    rounded: boolean;
+    threshold: number;
+}>;
+export default _default;

package/types/components/fw-image/index.d.ts

@@ -0,0 +1,2 @@
+import FwImage from './fw-image.vue';
+export { FwImage };

package/types/components/fw-image/index.types.d.ts

@@ -0,0 +1,8 @@
+export declare interface FwImageProps {
+    src?: string;
+    alt?: string;
+    type?: 'native' | 'background';
+    rounded?: boolean;
+    imageClass?: string;
+    threshold?: number;
+}

package/types/components/fw-loading/fw-loading-bar.vue.d.ts

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

package/types/components/fw-loading/fw-loading-card.vue.d.ts

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

package/types/components/fw-loading/fw-loading-table.vue.d.ts

@@ -0,0 +1,25 @@
+declare const _default: import("vue").DefineComponent<{
+    columns: {
+        type: NumberConstructor;
+        default: number;
+    };
+    rows: {
+        type: NumberConstructor;
+        default: number;
+    };
+}, {
+    tableClass: string;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    columns: {
+        type: NumberConstructor;
+        default: number;
+    };
+    rows: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>>, {
+    columns: number;
+    rows: number;
+}>;
+export default _default;

package/types/components/fw-loading/index.d.ts

@@ -0,0 +1,4 @@
+import FwLoadingBar from './fw-loading-bar.vue';
+import FwLoadingCard from './fw-loading-card.vue';
+import FwLoadingTable from './fw-loading-table.vue';
+export { FwLoadingBar, FwLoadingCard, FwLoadingTable };

package/types/components/fw-table/fw-table.vue.d.ts

@@ -9,6 +9,10 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<import("./index.types").FwTableItemOptions | undefined>;
         required: false;
     };
+    loading: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }, {
     columns: import("vue").ComputedRef<string[]>;
     sortBy: import("vue").Ref<string>;
@@ -29,5 +33,11 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<import("./index.types").FwTableItemOptions | undefined>;
         required: false;
     };
-}>>, {}>;
+    loading: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>>, {
+    loading: boolean;
+}>;
 export default _default;

package/types/components/fw-table/index.types.d.ts

@@ -9,4 +9,5 @@ export declare type FwTableSort = 'asc' | 'desc';
 export declare interface FwTableProps {
     items: FwTableItem[];
     options?: FwTableItemOptions;
+    loading?: boolean;
 }

package/types/components/index.d.ts

@@ -11,4 +11,6 @@ export * from './fw-progress-bar';
 export * from './fw-tag';
 export * from './fw-table';
 export * from './fw-accordion';
+export * from './fw-image';
+export * from './fw-loading';
 export * from './fw-animations';

package/types/components/index.types.d.ts

@@ -9,3 +9,4 @@ export * from '../components/fw-tag/index.types';
 export * from '../components/fw-table/index.types';
 export * from '../components/fw-dropdown/index.types';
 export * from '../components/fw-accordion/index.types';
+export * from '../components/fw-image/index.types';

package/types/directives/index.d.ts

@@ -0,0 +1,2 @@
+import { lazyLoadDirective } from './lazy-loader';
+export { lazyLoadDirective };

package/types/directives/lazy-loader.d.ts

@@ -0,0 +1,3 @@
+export declare const lazyLoadDirective: {
+    mounted: (el: Element) => void;
+};

package/types/icons/index.d.ts

@@ -23,4 +23,5 @@ import CoinsSvg from './coins.svg';
 import CaretDownSvg from './caret-down.svg';
 import SortLightSvg from './sort-light.svg';
 import PlusSvg from './plus.svg';
-export { ViewSvg, GenerateSvg, ManageSvg, NotFoundSvg, EmailFilledSvg, AlertSvg, LockSvg, EyeSvg, EyeCrossedSvg, DownloadSvg, IdCardSvg, InfoCircleSvg, FileExclamationSvg, HourglassClockSvg, EnvelopeSvg, CheckSvg, ChevronUpSvg, ChevronDownSvg, ErrorFilledSvg, LightBulbSvg, LandmarkSvg, CoinsSvg, CaretDownSvg, SortLightSvg, PlusSvg };
+import UserSvg from './user.svg';
+export { ViewSvg, GenerateSvg, ManageSvg, NotFoundSvg, EmailFilledSvg, AlertSvg, LockSvg, EyeSvg, EyeCrossedSvg, DownloadSvg, IdCardSvg, InfoCircleSvg, FileExclamationSvg, HourglassClockSvg, EnvelopeSvg, CheckSvg, ChevronUpSvg, ChevronDownSvg, ErrorFilledSvg, LightBulbSvg, LandmarkSvg, CoinsSvg, CaretDownSvg, SortLightSvg, PlusSvg, UserSvg };