@mgdis/mg-components 6.20.0 → 6.21.0

package/dist/mg-components/{p-916dfb6d.entry.js → p-c3d116b9.entry.js}

@@ -1 +1 @@
-import{r as t,c as s,f as i,h as e,a}from"./p-BluNKQ3L.js";import{C as h,t as o}from"./p-C7xjtdiw.js";import{i as r}from"./p-CNX6lq0x.js";const n=["info","warning","success","danger"],c=["bar-left","background"],l=class{constructor(i){t(this,i),this.componentShow=s(this,"component-show",3),this.componentHide=s(this,"component-hide",3),this.componentClose=s(this,"component-close",3),this.classCloseButton="mg-c-alert--close-button",this.storedTimer=null,this.isFocused=!1,this.isHovered=!1,this.variant="info",this.variantStyle="bar-left",this.classCollection=new h(["mg-c-alert"]),this.hasActions=!1,this.setTimer=()=>{this.storedTimer=setTimeout((()=>this.element.hidden=!0),1e3*this.delay)},this.clearTimer=()=>{clearTimeout(this.storedTimer)},this.timerEvents=t=>{this.clearTimer();const s="mouseenter"===t.type;this[s?"isHovered":"isFocused"]=!0,this.element.addEventListener(s?"mouseleave":"focusout",(t=>{this["mouseleave"===t.type?"isHovered":"isFocused"]=!1,this.isFocused||this.isHovered||this.setTimer()}),{once:!0})},this.handleClose=()=>{this.element.hidden=!0,this.componentClose.emit()}}watchDelay(t){if(void 0!==t&&t<2)throw new Error(`<mg-alert> prop "delay" must be greater than 2 seconds. Passed value: ${o(t)}.`)}watchVariant(t){if(t&&!n.includes(t))throw new Error(`<mg-alert> prop "variant" must be one of: ${n.join(", ")}. Passed value: ${o(t)}.`)}watchVariantStyle(t){if(t&&!c.includes(t))throw new Error(`<mg-alert> prop "variantStyle" must be one of: ${c.join(", ")}. Passed value: ${o(t)}.`)}watchHidden(t){"string"==typeof t&&""===t&&(t=!0),t?(this.componentHide.emit(),["focusin","mouseenter"].forEach((t=>{this.element.removeEventListener(t,this.timerEvents)})),this.clearTimer()):(this.componentShow.emit(),this.delay>1&&(this.setTimer(),["focusin","mouseenter"].forEach((t=>{this.element.addEventListener(t,this.timerEvents)})))),i(this)}componentWillLoad(){this.messages=r(this.element).messages,this.watchVariant(this.variant),this.watchVariantStyle(this.variantStyle),this.watchDelay(this.delay),this.watchHidden(this.element.hidden),this.hasActions=null!==this.element.querySelector('[slot="actions"]'),this.hasActions||this.classCollection.add(this.classCloseButton)}render(){return e("mg-message",{key:"4b974a10812e527a2c481ec00f22324ab490a135",class:this.classCollection.join(),role:["info","success"].includes(this.variant)?"status":"alert",variant:this.variant,variantStyle:this.variantStyle},e("slot",{key:"9133a3cca56d67e75e8c3f018c52838c31e908f2"}),this.hasActions?e("span",{slot:"actions"},e("slot",{name:"actions"})):e("span",{class:"mg-c-alert__close-button"},e("mg-button",{"is-icon":!0,variant:"flat",label:this.messages.alert.closeButton,onClick:this.handleClose},e("mg-icon",{icon:"cross"}))))}get element(){return a(this)}static get watchers(){return{delay:["watchDelay"],variant:["watchVariant"],variantStyle:["watchVariantStyle"],hidden:["watchHidden"]}}};l.style=".mg-c-alert__close-button{position:absolute;top:0;right:0}.mg-c-alert.mg-c-alert--close-button{--mg-c-card-spacing:0 var(--mg-b-size-min-height) 0 0}";export{l as mg_alert}
+import{r as t,c as s,f as i,h as e,a}from"./p-DFwaH2hS.js";import{C as h,t as o}from"./p-C7xjtdiw.js";import{i as r}from"./p-D-uaxCxH.js";const n=["info","warning","success","danger"],c=["bar-left","background"],l=class{constructor(i){t(this,i),this.componentShow=s(this,"component-show",3),this.componentHide=s(this,"component-hide",3),this.componentClose=s(this,"component-close",3),this.classCloseButton="mg-c-alert--close-button",this.storedTimer=null,this.isFocused=!1,this.isHovered=!1,this.variant="info",this.variantStyle="bar-left",this.classCollection=new h(["mg-c-alert"]),this.hasActions=!1,this.setTimer=()=>{this.storedTimer=setTimeout((()=>this.element.hidden=!0),1e3*this.delay)},this.clearTimer=()=>{clearTimeout(this.storedTimer)},this.timerEvents=t=>{this.clearTimer();const s="mouseenter"===t.type;this[s?"isHovered":"isFocused"]=!0,this.element.addEventListener(s?"mouseleave":"focusout",(t=>{this["mouseleave"===t.type?"isHovered":"isFocused"]=!1,this.isFocused||this.isHovered||this.setTimer()}),{once:!0})},this.handleClose=()=>{this.element.hidden=!0,this.componentClose.emit()}}watchDelay(t){if(void 0!==t&&t<2)throw new Error(`<mg-alert> prop "delay" must be greater than 2 seconds. Passed value: ${o(t)}.`)}watchVariant(t){if(t&&!n.includes(t))throw new Error(`<mg-alert> prop "variant" must be one of: ${n.join(", ")}. Passed value: ${o(t)}.`)}watchVariantStyle(t){if(t&&!c.includes(t))throw new Error(`<mg-alert> prop "variantStyle" must be one of: ${c.join(", ")}. Passed value: ${o(t)}.`)}watchHidden(t){"string"==typeof t&&""===t&&(t=!0),t?(this.componentHide.emit(),["focusin","mouseenter"].forEach((t=>{this.element.removeEventListener(t,this.timerEvents)})),this.clearTimer()):(this.componentShow.emit(),this.delay>1&&(this.setTimer(),["focusin","mouseenter"].forEach((t=>{this.element.addEventListener(t,this.timerEvents)})))),i(this)}componentWillLoad(){this.messages=r(this.element).messages,this.watchVariant(this.variant),this.watchVariantStyle(this.variantStyle),this.watchDelay(this.delay),this.watchHidden(this.element.hidden),this.hasActions=null!==this.element.querySelector('[slot="actions"]'),this.hasActions||this.classCollection.add(this.classCloseButton)}render(){return e("mg-message",{key:"6085a45d00c4762bae88d98e89f44c20d5f9b6c4",class:this.classCollection.join(),role:["info","success"].includes(this.variant)?"status":"alert",variant:this.variant,variantStyle:this.variantStyle},e("slot",{key:"55491d1b41609883958680c14a2ddb8dd84a3bd4"}),this.hasActions?e("span",{slot:"actions"},e("slot",{name:"actions"})):e("span",{class:"mg-c-alert__close-button"},e("mg-button",{"is-icon":!0,variant:"flat",label:this.messages.alert.closeButton,onClick:this.handleClose},e("mg-icon",{icon:"cross"}))))}get element(){return a(this)}static get watchers(){return{delay:[{watchDelay:0}],variant:[{watchVariant:0}],variantStyle:[{watchVariantStyle:0}],hidden:[{watchHidden:0}]}}};l.style=".mg-c-alert__close-button{position:absolute;top:0;right:0}.mg-c-alert.mg-c-alert--close-button{--mg-c-card-spacing:0 var(--mg-b-size-min-height) 0 0}";export{l as mg_alert}

package/dist/mg-components/p-dd1934f4.entry.js

@@ -0,0 +1 @@
+import{r as t,h as i,a as s}from"./p-DFwaH2hS.js";import{C as e,i as h}from"./p-C7xjtdiw.js";import{i as a,c as r}from"./p-C9rmNQIL.js";const o=class{constructor(i){t(this,i),this.name=this.identifier,this.legendHide=!1,this.legendBorderDisplay=!1,this.readonly=!1,this.disabled=!1,this.classCollection=new e(["mg-c-input--fieldset"]),this.checkValidity=()=>{var t;this.valid=!(this.mgInputs.some((t=>t.invalid))||(null===(t=this.errorMessage)||void 0===t?void 0:t.length)>0)},this.setMgInputs=()=>{this.mgInputs=Array.from(this.element.querySelectorAll("*")).filter((t=>t.nodeName.startsWith("MG-INPUT"))),this.mgInputs.forEach((t=>{"MG-INPUT-FILE"===t.nodeName&&(this.readonly?t.setAttribute("hidden",""):t.removeAttribute("hidden")),this.readonly&&!a(t)?t.readonly=!0:this.disabled?t.disabled=!0:t.addEventListener("input-valid",this.checkValidity)}))}}watchLegendBorderDisplay(t){if(t&&!h(this.legendHeading))throw new Error('<mg-fieldset> prop "legendBorderDisplay" must not be paired with the prop "legendHeading".')}watchReadonly(t){t?this.classCollection.add(r):this.classCollection.delete(r)}handleAttributeChange(){this.setMgInputs()}async setCustomValidity(t){this.errorMessage=h(t)?t:void 0,this.checkValidity()}async displayError(){this.readonly||this.mgInputs.forEach((t=>{t.displayError()}))}componentWillLoad(){this.watchReadonly(this.readonly),this.watchLegendBorderDisplay(this.legendBorderDisplay),this.setMgInputs()}componentDidLoad(){const t={childList:!0,subtree:!0};new MutationObserver((i=>{i.some((i=>Object.keys(t).includes(i.type)))&&this.setMgInputs()})).observe(this.element,t)}render(){return i("mg-input",{key:"31ccb9f783687845080fc7f184cc54b7343fab65",label:this.legend,identifier:this.identifier,class:this.classCollection.join(),labelOnTop:!this.legendHide,labelHeading:this.legendHeading,labelBorderDisplay:this.legendHeading&&this.legendBorderDisplay,labelHide:this.legendHide,inputsOnBottom:void 0!==this.legendHeading,tooltip:this.tooltip,tooltipPosition:"label",helpText:this.helpText,errorMessage:!this.valid&&h(this.errorMessage)?this.errorMessage:void 0},i("span",{key:"eedf1c66eaf88bee037c11b812844bb5a92175c1",class:"mg-c-input__input-group"},i("slot",{key:"a28f6759a63873ef4a228820b4310b42fcf1d3c7"})))}get element(){return s(this)}static get watchers(){return{legendBorderDisplay:[{watchLegendBorderDisplay:0}],readonly:[{watchReadonly:0},{handleAttributeChange:0}],disabled:[{handleAttributeChange:0}]}}};export{o as mg_fieldset}

package/dist/types/components/molecules/inputs/mg-input/mg-input.conf.d.ts

@@ -27,7 +27,13 @@ interface InputBaseMethods {
 /**
  * Possible Input types
  */
-export type HTMLMgInputsElement = (HTMLMgInputElement & InputBaseMethods) | HTMLMgInputCheckboxElement | HTMLMgInputDateElement | HTMLMgInputNumericElement | HTMLMgInputPasswordElement | HTMLMgInputRadioElement | HTMLMgInputSelectElement | HTMLMgInputTextElement | HTMLMgInputTextareaElement | (HTMLMgInputToggleElement & InputBaseMethods);
+export type HTMLMgInputsElement = (HTMLMgInputElement & InputBaseMethods) | HTMLMgInputCheckboxElement | HTMLMgInputDateElement | HTMLMgInputNumericElement | HTMLMgInputPasswordElement | HTMLMgInputRadioElement | HTMLMgInputSelectElement | HTMLMgInputTextElement | HTMLMgInputTextareaElement | HTMLMgInputFileElement | (HTMLMgInputToggleElement & InputBaseMethods);
+/**
+ * Is HTMLMgInputElement an HTMLMgInputFileElement
+ * @param input - input element
+ * @returns true if input is an mg-input-file element
+ */
+export declare const isMgInputFile: (input: HTMLMgInputsElement) => input is HTMLMgInputFileElement;
 /**
  * Available WindowEvent types
  */

package/dist/types/components/molecules/inputs/mg-input-file/mg-input-file.d.ts

@@ -0,0 +1,210 @@
+import { EventEmitter } from '../../../../stencil-public-runtime';
+import { ClassList } from '@mgdis/core-ui-helpers/dist/utils';
+import { type TooltipPosition } from '../mg-input/mg-input.conf';
+export declare class MgInputFile {
+    /************
+     * Internal *
+     ************/
+    private inputElement;
+    private fileButtonElement;
+    private locale;
+    private messages;
+    private hasDisplayedError;
+    private customErrorMessage;
+    private handlerInProgress;
+    /**************
+     * Decorators *
+     **************/
+    /**
+     * Get component DOM element
+     */
+    element: HTMLMgInputFileElement;
+    /**
+     * Component value
+     */
+    value: any;
+    watchValue(newValue: MgInputFile['value']): void;
+    /**
+     * Identifier is used for the element ID (id is a reserved prop in Stencil.js)
+     */
+    identifier: string;
+    /**
+     * Input name
+     * If not set the value equals the identifier
+     */
+    name: string;
+    /**
+     * Input label
+     */
+    label: string;
+    /**
+     * Define if label is displayed on top
+     */
+    labelOnTop: boolean;
+    /**
+     * Define if label is visible
+     */
+    labelHide: boolean;
+    /**
+     * Define multiple files
+     * When the multiple Boolean attribute is specified, the file input allows the user to select more than one file.
+     * (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#multiple).
+     */
+    multiple: boolean;
+    watchMultiple(): void;
+    /**
+     * Define file accept format
+     * The accept property is an attribute of the file `<input>` type
+     * that defines the file types the file input should accept
+     * (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#accept).
+     */
+    accept?: string;
+    watchAccept(newValue: MgInputFile['accept']): void;
+    /**
+     * Define max file size (in octets)
+     */
+    maxSize?: number;
+    /**
+     * Define input capture attribute
+     * The capture attribute is a Boolean attribute that specifies
+     * if the device's camera or microphone should be used to capture
+     * media directly, instead of choosing an existing file.
+     * (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#capture).
+     */
+    capture?: 'user' | 'environment' | '';
+    /**
+     * Define if input is required
+     */
+    required: boolean;
+    /**
+     * Define if input is disabled
+     */
+    disabled: boolean;
+    handleValidityChange(newValue: boolean, _oldValue: boolean, prop: string): void;
+    watchDisabled(newValue: MgInputFile['disabled']): void;
+    /**
+     * Add a tooltip message next to the input
+     */
+    tooltip?: string;
+    /**
+     * Define tooltip position
+     */
+    tooltipPosition: TooltipPosition;
+    /**
+     * Add a help text under the input, usually expected data format and example
+     */
+    helpText?: string;
+    watchHelpText(): void;
+    /**
+     * Define input valid state
+     */
+    valid: boolean;
+    /**
+     * Define input invalid state
+     */
+    invalid: boolean;
+    /**
+     * Component classes
+     */
+    classCollection: ClassList;
+    /**
+     * Error message to display
+     */
+    errorMessage: string;
+    /**
+     * Files list
+     */
+    files: File[];
+    watchFiles(newValue: MgInputFile['files'], oldValue: MgInputFile['files']): void;
+    /**
+     * Emitted event when value change
+     */
+    valueChange: EventEmitter<HTMLMgInputFileElement['value']>;
+    /**
+     * Emitted event when checking validity
+     */
+    inputValid: EventEmitter<HTMLMgInputFileElement['valid']>;
+    /**
+     * Set focus on input add file button
+     */
+    setFocus(): Promise<void>;
+    /**
+     * Display input error if it exists.
+     */
+    displayError(): Promise<void>;
+    /**
+     * Set an error and display a custom error message.
+     * This method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.
+     * It must be paired with an error message to display for the given context.
+     * When used to set validity to `false`, you should use this method again to reset the validity to `true`.
+     * @param valid - value indicating the validity
+     * @param errorMessage - the error message to display
+     * @param errorMessageLock - lock the error message and validity state
+     */
+    setError(valid: MgInputFile['valid'], errorMessage?: string, errorMessageLock?: boolean): Promise<void>;
+    /**
+     * Reset value, validity and error state
+     */
+    reset(): Promise<void>;
+    /**
+     * Method to set validity values
+     * @param newValue - valid new value
+     */
+    private setValidity;
+    /**
+     * Handle change event
+     */
+    private handleInputChange;
+    /**
+     * Handle input focus event
+     */
+    private handleInputFocus;
+    /**
+     * Handle input blur event
+     */
+    private handleInputBlur;
+    /**
+     * Handle button blur event
+     */
+    private handleButtonBlur;
+    /**
+     * Handle add file button click
+     */
+    private handleButtonClick;
+    /**
+     * Check if input is valid
+     */
+    private checkValidity;
+    /**
+     * Handle delete file button click
+     */
+    private handleDeleteFileClick;
+    /**
+     * Set input error message
+     * @param fromSetErrorContext - context come from `setError` method
+     */
+    private setErrorMessage;
+    /**
+     * Check if max size is exceeded
+     * @returns boolean - true if max size is exceeded
+     */
+    private isMaxSizeExceeded;
+    /*************
+     * Lifecycle *
+     *************/
+    /**
+     * Check if component props are well configured on init
+     * @returns timeout
+     */
+    componentWillLoad(): ReturnType<typeof setTimeout>;
+    /**
+     * Render files
+     * @returns formated files.
+     */
+    private renderFiles;
+    /**
+     * Render
+     * @returns HTML Element
+     */
+    render(): HTMLElement;
+}

package/dist/types/components/molecules/inputs/mg-input-rich-text-editor/mg-input-rich-text-editor.d.ts

@@ -118,15 +118,15 @@ export declare class MgInputRichTextEditor {
      */
     setFocus(): Promise<void>;
     /**
-     * Get editor content as HTML
+     * Get editor content in HTML format
      * @returns HTML content of the editor
      */
-    getHTML(): Promise<string>;
+    getEditorHTML(): Promise<string>;
     /**
-     * Get editor content as plain text
+     * Get editor content in plain text format
      * @returns Plain text content of the editor
      */
-    getText(): Promise<string>;
+    getEditorText(): Promise<string>;
     /**
      * Display input error if it exists.
      */

package/dist/types/components.d.ts

@@ -781,6 +781,102 @@ export namespace Components {
          */
         "value": string;
     }
+    interface MgInputFile {
+        /**
+          * Define file accept format The accept property is an attribute of the file `<input>` type that defines the file types the file input should accept (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#accept).
+         */
+        "accept"?: string;
+        /**
+          * Define input capture attribute The capture attribute is a Boolean attribute that specifies if the device's camera or microphone should be used to capture media directly, instead of choosing an existing file. (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#capture).
+         */
+        "capture"?: 'user' | 'environment' | '';
+        /**
+          * Define if input is disabled
+          * @default false
+         */
+        "disabled": boolean;
+        /**
+          * Display input error if it exists.
+         */
+        "displayError": () => Promise<void>;
+        /**
+          * Add a help text under the input, usually expected data format and example
+         */
+        "helpText"?: string;
+        /**
+          * Identifier is used for the element ID (id is a reserved prop in Stencil.js)
+         */
+        "identifier": string;
+        /**
+          * Define input invalid state
+         */
+        "invalid": boolean;
+        /**
+          * Input label
+         */
+        "label": string;
+        /**
+          * Define if label is visible
+          * @default false
+         */
+        "labelHide": boolean;
+        /**
+          * Define if label is displayed on top
+          * @default false
+         */
+        "labelOnTop": boolean;
+        /**
+          * Define max file size (in octets)
+         */
+        "maxSize"?: number;
+        /**
+          * Define multiple files When the multiple Boolean attribute is specified, the file input allows the user to select more than one file. (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#multiple).
+          * @default false
+         */
+        "multiple": boolean;
+        /**
+          * Input name If not set the value equals the identifier
+          * @default this.identifier
+         */
+        "name": string;
+        /**
+          * Define if input is required
+          * @default false
+         */
+        "required": boolean;
+        /**
+          * Reset value, validity and error state
+         */
+        "reset": () => Promise<void>;
+        /**
+          * Set an error and display a custom error message. This method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter. It must be paired with an error message to display for the given context. When used to set validity to `false`, you should use this method again to reset the validity to `true`.
+          * @param valid - value indicating the validity
+          * @param errorMessage - the error message to display
+          * @param errorMessageLock - lock the error message and validity state
+         */
+        "setError": (valid: MgInputFile["valid"], errorMessage?: string, errorMessageLock?: boolean) => Promise<void>;
+        /**
+          * Set focus on input add file button
+         */
+        "setFocus": () => Promise<void>;
+        /**
+          * Add a tooltip message next to the input
+         */
+        "tooltip"?: string;
+        /**
+          * Define tooltip position
+          * @default 'input'
+         */
+        "tooltipPosition": TooltipPosition;
+        /**
+          * Define input valid state
+         */
+        "valid": boolean;
+        /**
+          * Component value
+         */
+        "value": any;
+    }
     interface MgInputNumeric {
         /**
           * Define currency
@@ -1116,15 +1212,15 @@ export namespace Components {
          */
         "displayError": () => Promise<void>;
         /**
-          * Get editor content as HTML
+          * Get editor content in HTML format
           * @returns HTML content of the editor
          */
-        "getHTML": () => Promise<string>;
+        "getEditorHTML": () => Promise<string>;
         /**
-          * Get editor content as plain text
+          * Get editor content in plain text format
           * @returns Plain text content of the editor
          */
-        "getText": () => Promise<string>;
+        "getEditorText": () => Promise<string>;
         /**
           * Add a help text under the input, usually expected data format and example
          */
@@ -2049,6 +2145,10 @@ export interface MgInputDateCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLMgInputDateElement;
 }
+export interface MgInputFileCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLMgInputFileElement;
+}
 export interface MgInputNumericCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLMgInputNumericElement;
@@ -2306,6 +2406,24 @@ declare global {
         prototype: HTMLMgInputDateElement;
         new (): HTMLMgInputDateElement;
     };
+    interface HTMLMgInputFileElementEventMap {
+        "value-change": HTMLMgInputFileElement['value'];
+        "input-valid": HTMLMgInputFileElement['valid'];
+    }
+    interface HTMLMgInputFileElement extends Components.MgInputFile, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLMgInputFileElementEventMap>(type: K, listener: (this: HTMLMgInputFileElement, ev: MgInputFileCustomEvent<HTMLMgInputFileElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLMgInputFileElementEventMap>(type: K, listener: (this: HTMLMgInputFileElement, ev: MgInputFileCustomEvent<HTMLMgInputFileElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLMgInputFileElement: {
+        prototype: HTMLMgInputFileElement;
+        new (): HTMLMgInputFileElement;
+    };
     interface HTMLMgInputNumericElementEventMap {
         "value-change": number;
         "input-valid": HTMLMgInputNumericElement['valid'];
@@ -2364,12 +2482,7 @@ declare global {
         "input-valid": boolean;
         "value-change": string;
     }
-    interface HTMLMgInputRichTextEditorElement extends Omit<Components.MgInputRichTextEditor, "getHTML">, HTMLStencilElement {
-        /**
-          * Get editor content as HTML
-          * @returns HTML content of the editor
-         */
-        "getHTML": () => Promise<string>;
+    interface HTMLMgInputRichTextEditorElement extends Components.MgInputRichTextEditor, HTMLStencilElement {
         addEventListener<K extends keyof HTMLMgInputRichTextEditorElementEventMap>(type: K, listener: (this: HTMLMgInputRichTextEditorElement, ev: MgInputRichTextEditorCustomEvent<HTMLMgInputRichTextEditorElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
         addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
         addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
@@ -2674,6 +2787,7 @@ declare global {
         "mg-input-checkbox-paginated": HTMLMgInputCheckboxPaginatedElement;
         "mg-input-combobox": HTMLMgInputComboboxElement;
         "mg-input-date": HTMLMgInputDateElement;
+        "mg-input-file": HTMLMgInputFileElement;
         "mg-input-numeric": HTMLMgInputNumericElement;
         "mg-input-password": HTMLMgInputPasswordElement;
         "mg-input-radio": HTMLMgInputRadioElement;
@@ -3406,6 +3520,91 @@ declare namespace LocalJSX {
          */
         "value"?: string;
     }
+    interface MgInputFile {
+        /**
+          * Define file accept format The accept property is an attribute of the file `<input>` type that defines the file types the file input should accept (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#accept).
+         */
+        "accept"?: string;
+        /**
+          * Define input capture attribute The capture attribute is a Boolean attribute that specifies if the device's camera or microphone should be used to capture media directly, instead of choosing an existing file. (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#capture).
+         */
+        "capture"?: 'user' | 'environment' | '';
+        /**
+          * Define if input is disabled
+          * @default false
+         */
+        "disabled"?: boolean;
+        /**
+          * Add a help text under the input, usually expected data format and example
+         */
+        "helpText"?: string;
+        /**
+          * Identifier is used for the element ID (id is a reserved prop in Stencil.js)
+         */
+        "identifier": string;
+        /**
+          * Define input invalid state
+         */
+        "invalid"?: boolean;
+        /**
+          * Input label
+         */
+        "label": string;
+        /**
+          * Define if label is visible
+          * @default false
+         */
+        "labelHide"?: boolean;
+        /**
+          * Define if label is displayed on top
+          * @default false
+         */
+        "labelOnTop"?: boolean;
+        /**
+          * Define max file size (in octets)
+         */
+        "maxSize"?: number;
+        /**
+          * Define multiple files When the multiple Boolean attribute is specified, the file input allows the user to select more than one file. (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#multiple).
+          * @default false
+         */
+        "multiple"?: boolean;
+        /**
+          * Input name If not set the value equals the identifier
+          * @default this.identifier
+         */
+        "name"?: string;
+        /**
+          * Emitted event when checking validity
+         */
+        "onInput-valid"?: (event: MgInputFileCustomEvent<HTMLMgInputFileElement['valid']>) => void;
+        /**
+          * Emitted event when value change
+         */
+        "onValue-change"?: (event: MgInputFileCustomEvent<HTMLMgInputFileElement['value']>) => void;
+        /**
+          * Define if input is required
+          * @default false
+         */
+        "required"?: boolean;
+        /**
+          * Add a tooltip message next to the input
+         */
+        "tooltip"?: string;
+        /**
+          * Define tooltip position
+          * @default 'input'
+         */
+        "tooltipPosition"?: TooltipPosition;
+        /**
+          * Define input valid state
+         */
+        "valid"?: boolean;
+        /**
+          * Component value
+         */
+        "value"?: any;
+    }
     interface MgInputNumeric {
         /**
           * Define currency
@@ -4622,6 +4821,7 @@ declare namespace LocalJSX {
         "mg-input-checkbox-paginated": MgInputCheckboxPaginated;
         "mg-input-combobox": MgInputCombobox;
         "mg-input-date": MgInputDate;
+        "mg-input-file": MgInputFile;
         "mg-input-numeric": MgInputNumeric;
         "mg-input-password": MgInputPassword;
         "mg-input-radio": MgInputRadio;
@@ -4674,6 +4874,7 @@ declare module "@stencil/core" {
             "mg-input-checkbox-paginated": LocalJSX.MgInputCheckboxPaginated & JSXBase.HTMLAttributes<HTMLMgInputCheckboxPaginatedElement>;
             "mg-input-combobox": LocalJSX.MgInputCombobox & JSXBase.HTMLAttributes<HTMLMgInputComboboxElement>;
             "mg-input-date": LocalJSX.MgInputDate & JSXBase.HTMLAttributes<HTMLMgInputDateElement>;
+            "mg-input-file": LocalJSX.MgInputFile & JSXBase.HTMLAttributes<HTMLMgInputFileElement>;
             "mg-input-numeric": LocalJSX.MgInputNumeric & JSXBase.HTMLAttributes<HTMLMgInputNumericElement>;
             "mg-input-password": LocalJSX.MgInputPassword & JSXBase.HTMLAttributes<HTMLMgInputPasswordElement>;
             "mg-input-radio": LocalJSX.MgInputRadio & JSXBase.HTMLAttributes<HTMLMgInputRadioElement>;