npm - @mgdis/mg-components - Versions diffs - 5.23.1 → 5.24.0 - Mend

@mgdis/mg-components 5.23.1 → 5.24.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (250) hide show

package/dist/collection/components/atoms/mg-input-title/mg-input-title.js CHANGED Viewed

@@ -33,7 +33,7 @@ export class MgInputTitle {
     render() {
         const TagName = this.readonly ? 'span' : this.tagName;
         // \u00A0 represent a &nbsp;
-        return (h(TagName, { class: "mg-c-input-title", htmlFor: this.isLegend ? undefined : this.identifier }, h("slot", null), this.required && (h("span", { class: "mg-c-input-title__required" }, "\u00A0", h("span", { class: "mg-u-is-asterisk" }, "*")))));
+        return (h(TagName, { key: '0fbbce483f0d178036c4bf8ada139ddba9c16694', class: "mg-c-input-title", htmlFor: this.isLegend ? undefined : this.identifier }, h("slot", { key: '1db71caf002de0874f566d55b4bd0031ddf10650' }), this.required && (h("span", { class: "mg-c-input-title__required" }, "\u00A0", h("span", { class: "mg-u-is-asterisk" }, "*")))));
     }
     static get is() { return "mg-input-title"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/atoms/mg-input-title/mg-input-title.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-input-title.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-input-title/mg-input-title.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAOvD,MAAM,OAAO,YAAY;;;;;wBAyBJ,KAAK;uBASL,OAAO;;IA5B1B,kBAAkB,CAAC,QAAoC;QACrD,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE,CAAC;YAC7B,MAAM,IAAI,KAAK,CAAC,iDAAiD,CAAC,CAAC;QACrE,CAAC;IACH,CAAC;IAiBD,gBAAgB,CAAC,QAAkC;QACjD,IAAI,CAAC,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC;IAC/C,CAAC;IAOD;;mBAEe;IAEf;;OAEG;IACH,iBAAiB;QACf,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QACzC,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IACvC,CAAC;IAED;;;OAGG;IACH,MAAM;QACJ,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC;QACtD,4BAA4B;QAC5B,OAAO,CACL,EAAC,OAAO,~~IAAC~~,KAAK,EAAC,kBAAkB,EAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU;YACpF,~~eAAa~~;YACZ,IAAI,CAAC,QAAQ,IAAI,CAChB,YAAM,KAAK,EAAC,4BAA4B;;gBAChC,YAAM,KAAK,EAAC,kBAAkB,QAAS,CACxC,CACR,CACO,CACX,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Watch } from '@stencil/core';\nimport { isValidString } from '@mgdis/stencil-helpers';\n\n@Component({\n tag: 'mg-input-title',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-input-title.css',\n scoped: true,\n})\nexport class MgInputTitle {\n /*\n Label input id\n /\n @Prop() identifier!: string;\n @Watch('identifier')\n validateIdentifier(newValue: MgInputTitle['identifier']): void {\n if (!isValidString(newValue)) {\n throw new Error('<mg-input-title> prop \"identifier\" is required.');\n }\n }\n\n /\n If input is required an asterisk is added at the end of the label\n /\n @Prop() required: boolean;\n\n /\n If input is required an asterisk is added at the end of the label\n /\n @Prop() readonly: boolean;\n\n /\n Switch from label to fieldset sementic\n /\n @Prop() isLegend = false;\n @Watch('isLegend')\n validateIsLegend(newValue: MgInputTitle['isLegend']) {\n this.tagName = newValue ? 'legend' : 'label';\n }\n\n /\n Component parent tagname\n /\n @State() tagName = 'label';\n\n /***********\n Lifecycle \n **********/\n\n /\n * Init tag name\n /\n componentWillLoad(): void {\n this.validateIdentifier(this.identifier);\n this.validateIsLegend(this.isLegend);\n }\n\n /\n Render\n * @returns HTML element\n /\n render(): HTMLElement {\n const TagName = this.readonly ? 'span' : this.tagName;\n // \\u00A0 represent a  \n return (\n <TagName class=\"mg-c-input-title\" htmlFor={this.isLegend ? undefined : this.identifier}>\n <slot></slot>\n {this.required && (\n <span class=\"mg-c-input-title__required\">\n  <span class=\"mg-u-is-asterisk\"></span>\n </span>\n )}\n </TagName>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"mg-input-title.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-input-title/mg-input-title.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAOvD,MAAM,OAAO,YAAY;;;;;wBAyBJ,KAAK;uBASL,OAAO;;IA5B1B,kBAAkB,CAAC,QAAoC;QACrD,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE,CAAC;YAC7B,MAAM,IAAI,KAAK,CAAC,iDAAiD,CAAC,CAAC;QACrE,CAAC;IACH,CAAC;IAiBD,gBAAgB,CAAC,QAAkC;QACjD,IAAI,CAAC,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC;IAC/C,CAAC;IAOD;;mBAEe;IAEf;;OAEG;IACH,iBAAiB;QACf,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QACzC,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IACvC,CAAC;IAED;;;OAGG;IACH,MAAM;QACJ,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC;QACtD,4BAA4B;QAC5B,OAAO,CACL,EAAC,OAAO,qDAAC,KAAK,EAAC,kBAAkB,EAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU;YACpF,8DAAa;YACZ,IAAI,CAAC,QAAQ,IAAI,CAChB,YAAM,KAAK,EAAC,4BAA4B;;gBAChC,YAAM,KAAK,EAAC,kBAAkB,QAAS,CACxC,CACR,CACO,CACX,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Watch } from '@stencil/core';\nimport { isValidString } from '@mgdis/stencil-helpers';\n\n@Component({\n tag: 'mg-input-title',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-input-title.css',\n scoped: true,\n})\nexport class MgInputTitle {\n /*\n Label input id\n /\n @Prop() identifier!: string;\n @Watch('identifier')\n validateIdentifier(newValue: MgInputTitle['identifier']): void {\n if (!isValidString(newValue)) {\n throw new Error('<mg-input-title> prop \"identifier\" is required.');\n }\n }\n\n /\n If input is required an asterisk is added at the end of the label\n /\n @Prop() required: boolean;\n\n /\n If input is required an asterisk is added at the end of the label\n /\n @Prop() readonly: boolean;\n\n /\n Switch from label to fieldset sementic\n /\n @Prop() isLegend = false;\n @Watch('isLegend')\n validateIsLegend(newValue: MgInputTitle['isLegend']) {\n this.tagName = newValue ? 'legend' : 'label';\n }\n\n /\n Component parent tagname\n /\n @State() tagName = 'label';\n\n /***********\n Lifecycle \n **********/\n\n /\n * Init tag name\n /\n componentWillLoad(): void {\n this.validateIdentifier(this.identifier);\n this.validateIsLegend(this.isLegend);\n }\n\n /\n Render\n * @returns HTML element\n /\n render(): HTMLElement {\n const TagName = this.readonly ? 'span' : this.tagName;\n // \\u00A0 represent a  \n return (\n <TagName class=\"mg-c-input-title\" htmlFor={this.isLegend ? undefined : this.identifier}>\n <slot></slot>\n {this.required && (\n <span class=\"mg-c-input-title__required\">\n  <span class=\"mg-u-is-asterisk\"></span>\n </span>\n )}\n </TagName>\n );\n }\n}\n"]}

package/dist/collection/components/atoms/mg-tag/mg-tag.js CHANGED Viewed

@@ -69,7 +69,7 @@ export class MgTag {
      * @returns HTML Element
      */
     render() {
-        return (h("span", { class: this.classCollection.join() }, h("slot", null)));
+        return (h("span", { key: '15dd499acdc87ca43c277bb7561646fa9c44f4c0', class: this.classCollection.join() }, h("slot", { key: '3237e437f07cede09a85997be8a73e98f26d78b2' })));
     }
     static get is() { return "mg-tag"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/atoms/mg-tag/mg-tag.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-tag.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-tag/mg-tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAC1E,OAAO,EAAkB,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAMlE,MAAM,OAAO,KAAK;;QAChB;;sBAEc;QAEd,UAAU;QACO,iBAAY,GAAG,mBAAmB,CAAC;QACnC,cAAS,GAAG,gBAAgB,CAAC;uBAcZ,QAAQ,CAAC,CAAC,CAAC;;;+BAwCP,IAAI,SAAS,CAAC,CAAC,UAAU,CAAC,CAAC;;IAtCjE,eAAe,CAAC,QAA0B,EAAE,QAA2B;QACrE,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC;YACjC,MAAM,IAAI,KAAK,CAAC,2CAA2C,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACrF,CAAC;aAAM,CAAC;YACN,IAAI,QAAQ,KAAK,SAAS,EAAE,CAAC;gBAC3B,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,aAAa,QAAQ,EAAE,CAAC,CAAC;YACvD,CAAC;YACD,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,aAAa,QAAQ,EAAE,CAAC,CAAC;QACpD,CAAC;IACH,CAAC;IAOD,eAAe,CAAC,QAA0B;QACxC,IAAI,QAAQ;YAAE,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;;YACrD,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;IACtD,CAAC;IAOD,YAAY,CAAC,QAAuB;QAClC,mBAAmB;QACnB,IAAI,QAAQ,IAAI,IAAI,CAAC,OAAO;YAAE,MAAM,IAAI,KAAK,CAAC,2DAA2D,CAAC,CAAC;QAE3G,cAAc;QACd,IAAI,QAAQ;YAAE,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;;YAClD,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IACnD,CAAC;IAOD;;mBAEe;IAEf;;;OAGG;IACK,mBAAmB,CAAC,WAAmB;QAC7C,IAAI,CAAC,aAAa,CAAC,WAAW,CAAC;YAAE,MAAM,IAAI,KAAK,CAAC,4CAA4C,CAAC,CAAC;IACjG,CAAC;IAED;;mBAEe;IAEf;;OAEG;IACH,iBAAiB;QACf,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACnC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACnC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC7B,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;IACrD,CAAC;IAED;;;OAGG;IACH,MAAM;QACJ,OAAO,CACL,~~YAAM~~,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE;YACtC,~~eAAa~~,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Watch, Element } from '@stencil/core';\nimport { TagVariantType, variants } from './mg-tag.conf';\nimport { ClassList, isValidString } from '@mgdis/stencil-helpers';\n@Component({\n tag: 'mg-tag',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-tag.css',\n shadow: true,\n})\nexport class MgTag {\n /***********\n Internal \n *********/\n\n // Classes\n private readonly classOutline = 'mg-c-tag--outline';\n private readonly classSoft = 'mg-c-tag--soft';\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgTagElement;\n\n /\n Define tag variant\n /\n @Prop() variant: TagVariantType = variants[0]; // primary\n @Watch('variant')\n validateVariant(newValue: MgTag['variant'], oldValue?: MgTag['variant']): void {\n if (!variants.includes(newValue)) {\n throw new Error(`<mg-tag> prop \"variant\" must be one of: ${variants.join(', ')}.`);\n } else {\n if (oldValue !== undefined) {\n this.classCollection.delete(`mg-c-tag--${oldValue}`);\n }\n this.classCollection.add(`mg-c-tag--${newValue}`);\n }\n }\n\n /\n Define if tag is using outline style\n /\n @Prop() outline: boolean;\n @Watch('outline')\n validateOutline(newValue: MgTag['outline']): void {\n if (newValue) this.classCollection.add(this.classOutline);\n else this.classCollection.delete(this.classOutline);\n }\n\n /\n Define if tag is using soft style\n /\n @Prop() soft: boolean;\n @Watch('soft')\n validateSoft(newValue: MgTag['soft']): void {\n // usage validation\n if (newValue && this.outline) throw new Error('<mg-tag> prop \"soft\" can NOT be used with prop \"outline\".');\n\n // apply class\n if (newValue) this.classCollection.add(this.classSoft);\n else this.classCollection.delete(this.classSoft);\n }\n\n /\n Component classes\n /\n @State() classCollection: ClassList = new ClassList(['mg-c-tag']);\n\n /***********\n Methods \n **********/\n\n /\n * Validate the given textContent\n * @param textContent - html element textContent property\n /\n private validateTextContent(textContent: string): void {\n if (!isValidString(textContent)) throw new Error('<mg-tag> slot must contain a text content.');\n }\n\n /***********\n Lifecycle \n **********/\n\n /\n * Check if props are well configured on init\n /\n componentWillLoad(): void {\n this.validateVariant(this.variant);\n this.validateOutline(this.outline);\n this.validateSoft(this.soft);\n this.validateTextContent(this.element.textContent);\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <span class={this.classCollection.join()}>\n <slot></slot>\n </span>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"mg-tag.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-tag/mg-tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAC1E,OAAO,EAAkB,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAMlE,MAAM,OAAO,KAAK;;QAChB;;sBAEc;QAEd,UAAU;QACO,iBAAY,GAAG,mBAAmB,CAAC;QACnC,cAAS,GAAG,gBAAgB,CAAC;uBAcZ,QAAQ,CAAC,CAAC,CAAC;;;+BAwCP,IAAI,SAAS,CAAC,CAAC,UAAU,CAAC,CAAC;;IAtCjE,eAAe,CAAC,QAA0B,EAAE,QAA2B;QACrE,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC;YACjC,MAAM,IAAI,KAAK,CAAC,2CAA2C,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACrF,CAAC;aAAM,CAAC;YACN,IAAI,QAAQ,KAAK,SAAS,EAAE,CAAC;gBAC3B,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,aAAa,QAAQ,EAAE,CAAC,CAAC;YACvD,CAAC;YACD,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,aAAa,QAAQ,EAAE,CAAC,CAAC;QACpD,CAAC;IACH,CAAC;IAOD,eAAe,CAAC,QAA0B;QACxC,IAAI,QAAQ;YAAE,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;;YACrD,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;IACtD,CAAC;IAOD,YAAY,CAAC,QAAuB;QAClC,mBAAmB;QACnB,IAAI,QAAQ,IAAI,IAAI,CAAC,OAAO;YAAE,MAAM,IAAI,KAAK,CAAC,2DAA2D,CAAC,CAAC;QAE3G,cAAc;QACd,IAAI,QAAQ;YAAE,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;;YAClD,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IACnD,CAAC;IAOD;;mBAEe;IAEf;;;OAGG;IACK,mBAAmB,CAAC,WAAmB;QAC7C,IAAI,CAAC,aAAa,CAAC,WAAW,CAAC;YAAE,MAAM,IAAI,KAAK,CAAC,4CAA4C,CAAC,CAAC;IACjG,CAAC;IAED;;mBAEe;IAEf;;OAEG;IACH,iBAAiB;QACf,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACnC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACnC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC7B,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;IACrD,CAAC;IAED;;;OAGG;IACH,MAAM;QACJ,OAAO,CACL,6DAAM,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE;YACtC,8DAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Watch, Element } from '@stencil/core';\nimport { TagVariantType, variants } from './mg-tag.conf';\nimport { ClassList, isValidString } from '@mgdis/stencil-helpers';\n@Component({\n tag: 'mg-tag',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-tag.css',\n shadow: true,\n})\nexport class MgTag {\n /***********\n Internal \n *********/\n\n // Classes\n private readonly classOutline = 'mg-c-tag--outline';\n private readonly classSoft = 'mg-c-tag--soft';\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgTagElement;\n\n /\n Define tag variant\n /\n @Prop() variant: TagVariantType = variants[0]; // primary\n @Watch('variant')\n validateVariant(newValue: MgTag['variant'], oldValue?: MgTag['variant']): void {\n if (!variants.includes(newValue)) {\n throw new Error(`<mg-tag> prop \"variant\" must be one of: ${variants.join(', ')}.`);\n } else {\n if (oldValue !== undefined) {\n this.classCollection.delete(`mg-c-tag--${oldValue}`);\n }\n this.classCollection.add(`mg-c-tag--${newValue}`);\n }\n }\n\n /\n Define if tag is using outline style\n /\n @Prop() outline: boolean;\n @Watch('outline')\n validateOutline(newValue: MgTag['outline']): void {\n if (newValue) this.classCollection.add(this.classOutline);\n else this.classCollection.delete(this.classOutline);\n }\n\n /\n Define if tag is using soft style\n /\n @Prop() soft: boolean;\n @Watch('soft')\n validateSoft(newValue: MgTag['soft']): void {\n // usage validation\n if (newValue && this.outline) throw new Error('<mg-tag> prop \"soft\" can NOT be used with prop \"outline\".');\n\n // apply class\n if (newValue) this.classCollection.add(this.classSoft);\n else this.classCollection.delete(this.classSoft);\n }\n\n /\n Component classes\n /\n @State() classCollection: ClassList = new ClassList(['mg-c-tag']);\n\n /***********\n Methods \n **********/\n\n /\n * Validate the given textContent\n * @param textContent - html element textContent property\n /\n private validateTextContent(textContent: string): void {\n if (!isValidString(textContent)) throw new Error('<mg-tag> slot must contain a text content.');\n }\n\n /***********\n Lifecycle \n **********/\n\n /\n * Check if props are well configured on init\n /\n componentWillLoad(): void {\n this.validateVariant(this.variant);\n this.validateOutline(this.outline);\n this.validateSoft(this.soft);\n this.validateTextContent(this.element.textContent);\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <span class={this.classCollection.join()}>\n <slot></slot>\n </span>\n );\n }\n}\n"]}

package/dist/collection/components/atoms/mg-tooltip/mg-tooltip-content/mg-tooltip-content.js CHANGED Viewed

@@ -11,7 +11,7 @@ export class MgTooltipContent {
      * @returns HTML Element
      */
     render() {
-        return (h(Host, { role: "tooltip" }, h("span", { innerHTML: this.message, class: "mg-tooltip-content__message" }), h("slot", { name: "arrow" })));
+        return (h(Host, { key: 'a26eb86dd6c3461563b2c532b1330f8897eb2da6', role: "tooltip" }, h("span", { key: 'eff274511b40c5e60429ebc387e32717854f7ffc', innerHTML: this.message, class: "mg-tooltip-content__message" }), h("slot", { key: '3b26eabf4471f34ae3997faa81e667341d26bee5', name: "arrow" })));
     }
     static get is() { return "mg-tooltip-content"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/atoms/mg-tooltip/mg-tooltip-content/mg-tooltip-content.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-tooltip-content.js","sourceRoot":"","sources":["../../../../../src/components/atoms/mg-tooltip/mg-tooltip-content/mg-tooltip-content.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,gBAAgB;;;;IAM3B;;mBAEe;IAEf;;;OAGG;IACH,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,~~IAAC~~,IAAI,EAAC,SAAS;YAClB,~~YAAM~~,SAAS,EAAE,IAAI,CAAC,OAAO,EAAE,KAAK,EAAC,6BAA6B,GAAQ;YAC1E,~~YAAM~~,IAAI,EAAC,OAAO,GAAQ,CACrB,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'mg-tooltip-content',\n styleUrl: '../../../../../node_modules/@mgdis/styles/dist/components/mg-tooltip-content.css',\n shadow: true,\n})\nexport class MgTooltipContent {\n /*\n Displayed message in the tooltip\n /\n @Prop() message!: string;\n\n /***********\n Lifecycle \n **********/\n\n /\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <Host role=\"tooltip\">\n <span innerHTML={this.message} class=\"mg-tooltip-content__message\"></span>\n <slot name=\"arrow\"></slot>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"mg-tooltip-content.js","sourceRoot":"","sources":["../../../../../src/components/atoms/mg-tooltip/mg-tooltip-content/mg-tooltip-content.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,gBAAgB;;;;IAM3B;;mBAEe;IAEf;;;OAGG;IACH,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,IAAI,EAAC,SAAS;YAClB,6DAAM,SAAS,EAAE,IAAI,CAAC,OAAO,EAAE,KAAK,EAAC,6BAA6B,GAAQ;YAC1E,6DAAM,IAAI,EAAC,OAAO,GAAQ,CACrB,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'mg-tooltip-content',\n styleUrl: '../../../../../node_modules/@mgdis/styles/dist/components/mg-tooltip-content.css',\n shadow: true,\n})\nexport class MgTooltipContent {\n /*\n Displayed message in the tooltip\n /\n @Prop() message!: string;\n\n /***********\n Lifecycle \n **********/\n\n /\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <Host role=\"tooltip\">\n <span innerHTML={this.message} class=\"mg-tooltip-content__message\"></span>\n <slot name=\"arrow\"></slot>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.js CHANGED Viewed

@@ -295,7 +295,7 @@ export class MgTooltip {
      * @returns HTML Element
      */
     render() {
-        return (h(Host, null, h("slot", null), h("slot", { name: "content" })));
+        return (h(Host, { key: '39e72edae07252421d527bfbeede585a27d2663c' }, h("slot", { key: '0402c8ea5aa2dea27e66a621e3d905356786dd27' }), h("slot", { key: 'e194462c062b565a6cb0e6330fa841a29746445d', name: "content" })));
     }
     static get is() { return "mg-tooltip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-tooltip.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-tooltip/mg-tooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Host, Prop, Watch } from '@stencil/core';\nimport { createID, focusableElements, getWindows, isValidString, nextTick } from '@mgdis/stencil-helpers';\nimport { Instance as PopperInstance, createPopper, Placement, PositioningStrategy } from '@popperjs/core';\nimport { Guard } from './mg-tooltip.conf';\n\n/*\n HTMLMgButtonElement type guard\n * @param element - element to check\n * @returns return true if type is HTMLMgButtonElement\n /\nconst isButton = (element: unknown): element is HTMLMgButtonElement => typeof element === 'object' && ['MG-BUTTON', 'BUTTON'].includes((element as Element).tagName);\n\n@Component({\n tag: 'mg-tooltip',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-tooltip.css',\n shadow: true,\n})\nexport class MgTooltip {\n /**********\n Internal \n *********/\n\n private popper: PopperInstance;\n private mgTooltipContent: HTMLMgTooltipContentElement;\n private tooltipedElement: HTMLElement;\n private windows: Window[];\n private hasCustomTabIndex: boolean;\n\n // tooltip actions guards\n private guard: Guard;\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgTooltipElement;\n\n /\n Sets an `id` attribute.\n * Needed by the input for accessibility `aria-decribedby`.\n /\n @Prop() identifier: string = createID('mg-tooltip');\n @Watch('identifier')\n validateIdentifier(): void {\n // use renderTooltipContent to update tooltip-content id\n this.renderTooltipContent();\n }\n\n /\n Displayed message in the tooltip\n /\n @Prop() message!: string;\n @Watch('message')\n validateMessage(newValue: MgTooltip['message']): void {\n if (!isValidString(newValue)) {\n throw new Error('<mg-tooltip> prop \"message\" is required.');\n }\n this.mgTooltipContent.message = newValue;\n }\n\n /\n Tooltip placement\n /\n @Prop() placement: Placement = 'bottom';\n\n /\n Display tooltip\n /\n @Prop({ mutable: true }) display = false;\n @Watch('display')\n handleDisplay(newValue: MgTooltip['display']): void {\n if (newValue) {\n this.show();\n } else {\n this.hide();\n }\n }\n\n /\n Disable tooltip\n /\n @Prop() disabled = false;\n @Watch('disabled')\n validateDisabled(newValue: MgTooltip['disabled']): void {\n if (this.hasCustomTabIndex) {\n if (newValue) this.tooltipedElement.removeAttribute('tabindex');\n else if (this.tooltipedElement.getAttribute('tabindex') === null) this.tooltipedElement.setAttribute('tabindex', '0');\n }\n }\n\n /\n Show tooltip\n /\n private show = (): void => {\n // Make the tooltip visible\n this.mgTooltipContent.dataset.show = '';\n // Enable the event listeners\n this.popper.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, { name: 'eventListeners', enabled: true }],\n }));\n // hide when click outside on nextTick to prevent event to trigger after creation\n nextTick(() => {\n this.windows.forEach((localWindow: Window) => {\n localWindow.addEventListener('click', this.clickOutside, false);\n localWindow.addEventListener('keydown', this.pressEscape, false);\n });\n });\n };\n\n /\n Hide tooltip\n /\n private hide = (): void => {\n // Hide the tooltip\n this.mgTooltipContent.removeAttribute('data-show');\n // Disable the event listeners\n this.popper.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, { name: 'eventListeners', enabled: false }],\n }));\n // Remove event listener\n this.windows.forEach((localWindow: Window) => {\n localWindow.removeEventListener('click', this.clickOutside, false);\n localWindow.removeEventListener('keyboard', this.pressEscape, false);\n });\n };\n\n /\n Check if clicked outside of component and hidde tooltip\n * @param event - mouse event\n /\n private clickOutside = (event: MouseEvent & { target: HTMLElement }): void => {\n if (event.target.closest('mg-tooltip') !== this.element) this.setDisplay(false);\n };\n\n /\n Check if 'Escape' key is pressed of component and hidde tooltip\n * @param event - keyboard event\n /\n private pressEscape = (event: KeyboardEvent): void => {\n if (event.code === 'Escape') {\n this.setDisplay(false);\n this.resetGuard();\n }\n };\n\n /\n Method to set display prop\n * @param newValue - display prop new value\n * @param condition - additionnal condition to apply display prop newValue\n /\n private setDisplay = (newValue: MgTooltip['display'], condition = true): void => {\n if (!this.disabled && condition) this.display = newValue;\n };\n\n /\n Action for tooltip element and tooltiped element mouse listener\n * @param elementGuard - tooltip element guard\n * @param isMouseenter - mouseenter validation\n * @param conditionalGuard - guard condition\n /\n private tooltipMouseListenerAction = (elementGuard: Guard, isMouseenter: boolean, conditionalGuard: Guard): void => {\n // we mutate elementGuard\n if (this.guard !== Guard.FOCUS) {\n this.guard = elementGuard;\n if (!isMouseenter) {\n // process action in the next event loop macro task\n setTimeout(() => {\n this.setDisplay(isMouseenter, this.guard !== conditionalGuard);\n this.resetGuard();\n }, 100);\n } else if (this.guard === Guard.HOVER_TOOLTIPED_ELEMENT) {\n this.setDisplay(isMouseenter);\n }\n }\n };\n\n /\n Method to reset guard value\n /\n private resetGuard = (): void => {\n this.guard = undefined;\n };\n\n /\n Update slot content when it is a mg-button\n * @param mgButton - slotted mg-button\n /\n private setMgButtonWrapper = (mgButton: HTMLMgButtonElement): void => {\n if (mgButton.disabled) {\n const div = document.createElement('div');\n div.classList.add('mg-c-tooltip__mg-button-wrapper');\n mgButton.parentNode.insertBefore(div, mgButton);\n div.appendChild(mgButton);\n this.tooltipedElement = div;\n } else if (mgButton.parentElement.classList.contains('mg-c-tooltip__mg-button-wrapper')) {\n this.element.firstElementChild.replaceWith(mgButton);\n this.tooltipedElement = mgButton;\n }\n };\n\n /\n Init tooltip\n * @param slotElement - slotted element\n * @param interactiveElement - interactive element\n /\n private initTooltip = (slotElement: HTMLElement, interactiveElement: HTMLElement): void => {\n // Add tabindex to slotted element if we can't find any interactive element\n if (!this.disabled && !interactiveElement) {\n this.hasCustomTabIndex = true;\n slotElement.tabIndex = 0;\n // Add role on non-interactive element to work with \"aria-describedby\" for screen readers\n slotElement.setAttribute('role', 'button');\n }\n // Set aria-describedby\n const ariaDescribedby = slotElement.getAttribute('aria-describedby');\n\n if (ariaDescribedby === null) {\n this.tooltipedElement.setAttribute('aria-describedby', this.identifier);\n } else {\n // We ensure to have uniq ids\n slotElement.setAttribute('aria-describedby', `${[...new Set([...ariaDescribedby.split(' '), this.identifier])].join(' ')}`);\n }\n\n // use element data attribute: `data-popper-strategy`, in order to get popper strategy configuration\n const strategy = (this.element.dataset.popperStrategy \|\| 'fixed') as PositioningStrategy;\n\n // Create popperjs tooltip\n this.popper = createPopper(this.tooltipedElement, this.mgTooltipContent, {\n placement: this.placement,\n strategy,\n modifiers: [\n {\n name: 'offset',\n options: {\n offset: [0, 8],\n },\n },\n {\n name: 'flip',\n options: {\n fallbackPlacements: ['auto'],\n },\n },\n ],\n });\n\n // Manage tooltipedElement focus/blur events\n this.tooltipedElement.addEventListener('focus', () => {\n this.guard = Guard.FOCUS;\n this.setDisplay(true);\n });\n\n // as `click` event is the composition of `mousedown` and `mouseup` event,\n // and `click` event trigger `focus` event after a success `mousedown` wich set the `guard` to `Guard.FOCUS`\n // we reset the guard on `mouseup` event to unlock tooltip\n this.tooltipedElement.addEventListener('mouseup', () => {\n this.resetGuard();\n });\n\n this.tooltipedElement.addEventListener('blur', () => {\n this.resetGuard();\n this.setDisplay(false);\n });\n\n document.addEventListener('keydown', this.pressEscape);\n\n // manage tooltipElement & tooltipedElement mouseenter/mouseleave events\n ['mouseenter', 'mouseleave'].forEach(eventType => {\n const isMouseenter = eventType === 'mouseenter';\n [\n { element: this.mgTooltipContent, action: () => this.tooltipMouseListenerAction(Guard.HOVER_TOOLTIP_ELEMENT, isMouseenter, Guard.HOVER_TOOLTIPED_ELEMENT) },\n { element: this.tooltipedElement, action: () => this.tooltipMouseListenerAction(Guard.HOVER_TOOLTIPED_ELEMENT, isMouseenter, Guard.HOVER_TOOLTIP_ELEMENT) },\n ].forEach(({ element, action }) => {\n element.addEventListener(eventType, () => {\n action();\n });\n });\n });\n };\n\n /\n Render tooltip content element\n /\n private renderTooltipContent(): void {\n const mgTooltipContent = this.element.querySelector('mg-tooltip-content');\n if (mgTooltipContent === null) {\n const mgTooltipContent = document.createElement('mg-tooltip-content');\n mgTooltipContent.setAttribute('slot', 'content');\n mgTooltipContent.setAttribute('id', this.identifier);\n\n const arrow = document.createElement('div');\n arrow.setAttribute('slot', 'arrow');\n arrow.dataset.popperArrow = '';\n mgTooltipContent.appendChild(arrow);\n\n // append tooltip element to component\n this.element.appendChild(mgTooltipContent);\n } else {\n mgTooltipContent.setAttribute('id', this.identifier);\n }\n }\n\n /***********\n Lifecycle \n **********/\n\n /\n * set variables\n /\n componentWillLoad(): void {\n // Get windows to attach events\n this.windows = getWindows(window);\n\n // Get tooltip element\n this.renderTooltipContent();\n this.mgTooltipContent = this.element.querySelector(`#${this.identifier}`);\n\n //validate properties\n this.validateDisabled(this.disabled);\n this.validateMessage(this.message);\n this.validateIdentifier();\n }\n\n /\n Get slotted element\n * Check if it already contain an interactive element, if not we need to add a tabIndex attribute\n * We need to attach the focused element to the tooltip (aria-describedby)\n /\n componentDidLoad(): void {\n // get slotted element wich is not the tooltip\n const slotElement: HTMLElement = this.element.querySelector(`:not(#${this.identifier})`);\n\n // Get interactive element\n const interactiveElement: HTMLElement = slotElement.matches(focusableElements) ? slotElement : slotElement.shadowRoot?.querySelector(focusableElements);\n\n // define selected element to become tooltip selector\n this.tooltipedElement = interactiveElement \|\| slotElement;\n\n // Check if slotted element is a disabled mg-button\n // In this case we wrap the mg-button into a div to enable the tooltip\n if (isButton(slotElement)) {\n new MutationObserver(mutationList => {\n if (mutationList.some(mutation => ['aria-disabled', 'disabled'].includes(mutation.attributeName))) {\n this.setMgButtonWrapper(slotElement);\n // Since Firefox doesn't trigger a \"blur\" event when the \"disabled\" attribute is added or removed from a button\n // we have to manually unlock the guard because the \"blur\" handler of the tooltipedElement won't do it.\n this.resetGuard();\n this.initTooltip(slotElement, interactiveElement);\n }\n }).observe(slotElement, { attributes: true });\n this.setMgButtonWrapper(slotElement);\n }\n\n // Init Tooltip\n this.initTooltip(slotElement, interactiveElement);\n\n this.handleDisplay(this.display);\n }\n\n /*\n update popper position after props change on component did update hook to benefit from render ended\n /\n componentDidUpdate(): void {\n this.popper.update();\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <Host>\n <slot></slot>\n <slot name=\"content\"></slot>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"mg-tooltip.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-tooltip/mg-tooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Host, Prop, Watch } from '@stencil/core';\nimport { createID, focusableElements, getWindows, isValidString, nextTick } from '@mgdis/stencil-helpers';\nimport { Instance as PopperInstance, createPopper, Placement, PositioningStrategy } from '@popperjs/core';\nimport { Guard } from './mg-tooltip.conf';\n\n/*\n HTMLMgButtonElement type guard\n * @param element - element to check\n * @returns return true if type is HTMLMgButtonElement\n /\nconst isButton = (element: unknown): element is HTMLMgButtonElement => typeof element === 'object' && ['MG-BUTTON', 'BUTTON'].includes((element as Element).tagName);\n\n@Component({\n tag: 'mg-tooltip',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-tooltip.css',\n shadow: true,\n})\nexport class MgTooltip {\n /**********\n Internal \n *********/\n\n private popper: PopperInstance;\n private mgTooltipContent: HTMLMgTooltipContentElement;\n private tooltipedElement: HTMLElement;\n private windows: Window[];\n private hasCustomTabIndex: boolean;\n\n // tooltip actions guards\n private guard: Guard;\n\n /***********\n Decorators \n ***********/\n\n /\n * Get component DOM element\n /\n @Element() element: HTMLMgTooltipElement;\n\n /\n Sets an `id` attribute.\n * Needed by the input for accessibility `aria-decribedby`.\n /\n @Prop() identifier: string = createID('mg-tooltip');\n @Watch('identifier')\n validateIdentifier(): void {\n // use renderTooltipContent to update tooltip-content id\n this.renderTooltipContent();\n }\n\n /\n Displayed message in the tooltip\n /\n @Prop() message!: string;\n @Watch('message')\n validateMessage(newValue: MgTooltip['message']): void {\n if (!isValidString(newValue)) {\n throw new Error('<mg-tooltip> prop \"message\" is required.');\n }\n this.mgTooltipContent.message = newValue;\n }\n\n /\n Tooltip placement\n /\n @Prop() placement: Placement = 'bottom';\n\n /\n Display tooltip\n /\n @Prop({ mutable: true }) display = false;\n @Watch('display')\n handleDisplay(newValue: MgTooltip['display']): void {\n if (newValue) {\n this.show();\n } else {\n this.hide();\n }\n }\n\n /\n Disable tooltip\n /\n @Prop() disabled = false;\n @Watch('disabled')\n validateDisabled(newValue: MgTooltip['disabled']): void {\n if (this.hasCustomTabIndex) {\n if (newValue) this.tooltipedElement.removeAttribute('tabindex');\n else if (this.tooltipedElement.getAttribute('tabindex') === null) this.tooltipedElement.setAttribute('tabindex', '0');\n }\n }\n\n /\n Show tooltip\n /\n private show = (): void => {\n // Make the tooltip visible\n this.mgTooltipContent.dataset.show = '';\n // Enable the event listeners\n this.popper.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, { name: 'eventListeners', enabled: true }],\n }));\n // hide when click outside on nextTick to prevent event to trigger after creation\n nextTick(() => {\n this.windows.forEach((localWindow: Window) => {\n localWindow.addEventListener('click', this.clickOutside, false);\n localWindow.addEventListener('keydown', this.pressEscape, false);\n });\n });\n };\n\n /\n Hide tooltip\n /\n private hide = (): void => {\n // Hide the tooltip\n this.mgTooltipContent.removeAttribute('data-show');\n // Disable the event listeners\n this.popper.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, { name: 'eventListeners', enabled: false }],\n }));\n // Remove event listener\n this.windows.forEach((localWindow: Window) => {\n localWindow.removeEventListener('click', this.clickOutside, false);\n localWindow.removeEventListener('keyboard', this.pressEscape, false);\n });\n };\n\n /\n Check if clicked outside of component and hidde tooltip\n * @param event - mouse event\n /\n private clickOutside = (event: MouseEvent & { target: HTMLElement }): void => {\n if (event.target.closest('mg-tooltip') !== this.element) this.setDisplay(false);\n };\n\n /\n Check if 'Escape' key is pressed of component and hidde tooltip\n * @param event - keyboard event\n /\n private pressEscape = (event: KeyboardEvent): void => {\n if (event.code === 'Escape') {\n this.setDisplay(false);\n this.resetGuard();\n }\n };\n\n /\n Method to set display prop\n * @param newValue - display prop new value\n * @param condition - additionnal condition to apply display prop newValue\n /\n private setDisplay = (newValue: MgTooltip['display'], condition = true): void => {\n if (!this.disabled && condition) this.display = newValue;\n };\n\n /\n Action for tooltip element and tooltiped element mouse listener\n * @param elementGuard - tooltip element guard\n * @param isMouseenter - mouseenter validation\n * @param conditionalGuard - guard condition\n /\n private tooltipMouseListenerAction = (elementGuard: Guard, isMouseenter: boolean, conditionalGuard: Guard): void => {\n // we mutate elementGuard\n if (this.guard !== Guard.FOCUS) {\n this.guard = elementGuard;\n if (!isMouseenter) {\n // process action in the next event loop macro task\n setTimeout(() => {\n this.setDisplay(isMouseenter, this.guard !== conditionalGuard);\n this.resetGuard();\n }, 100);\n } else if (this.guard === Guard.HOVER_TOOLTIPED_ELEMENT) {\n this.setDisplay(isMouseenter);\n }\n }\n };\n\n /\n Method to reset guard value\n /\n private resetGuard = (): void => {\n this.guard = undefined;\n };\n\n /\n Update slot content when it is a mg-button\n * @param mgButton - slotted mg-button\n /\n private setMgButtonWrapper = (mgButton: HTMLMgButtonElement): void => {\n if (mgButton.disabled) {\n const div = document.createElement('div');\n div.classList.add('mg-c-tooltip__mg-button-wrapper');\n mgButton.parentNode.insertBefore(div, mgButton);\n div.appendChild(mgButton);\n this.tooltipedElement = div;\n } else if (mgButton.parentElement.classList.contains('mg-c-tooltip__mg-button-wrapper')) {\n this.element.firstElementChild.replaceWith(mgButton);\n this.tooltipedElement = mgButton;\n }\n };\n\n /\n Init tooltip\n * @param slotElement - slotted element\n * @param interactiveElement - interactive element\n /\n private initTooltip = (slotElement: HTMLElement, interactiveElement: HTMLElement): void => {\n // Add tabindex to slotted element if we can't find any interactive element\n if (!this.disabled && !interactiveElement) {\n this.hasCustomTabIndex = true;\n slotElement.tabIndex = 0;\n // Add role on non-interactive element to work with \"aria-describedby\" for screen readers\n slotElement.setAttribute('role', 'button');\n }\n // Set aria-describedby\n const ariaDescribedby = slotElement.getAttribute('aria-describedby');\n\n if (ariaDescribedby === null) {\n this.tooltipedElement.setAttribute('aria-describedby', this.identifier);\n } else {\n // We ensure to have uniq ids\n slotElement.setAttribute('aria-describedby', `${[...new Set([...ariaDescribedby.split(' '), this.identifier])].join(' ')}`);\n }\n\n // use element data attribute: `data-popper-strategy`, in order to get popper strategy configuration\n const strategy = (this.element.dataset.popperStrategy \|\| 'fixed') as PositioningStrategy;\n\n // Create popperjs tooltip\n this.popper = createPopper(this.tooltipedElement, this.mgTooltipContent, {\n placement: this.placement,\n strategy,\n modifiers: [\n {\n name: 'offset',\n options: {\n offset: [0, 8],\n },\n },\n {\n name: 'flip',\n options: {\n fallbackPlacements: ['auto'],\n },\n },\n ],\n });\n\n // Manage tooltipedElement focus/blur events\n this.tooltipedElement.addEventListener('focus', () => {\n this.guard = Guard.FOCUS;\n this.setDisplay(true);\n });\n\n // as `click` event is the composition of `mousedown` and `mouseup` event,\n // and `click` event trigger `focus` event after a success `mousedown` wich set the `guard` to `Guard.FOCUS`\n // we reset the guard on `mouseup` event to unlock tooltip\n this.tooltipedElement.addEventListener('mouseup', () => {\n this.resetGuard();\n });\n\n this.tooltipedElement.addEventListener('blur', () => {\n this.resetGuard();\n this.setDisplay(false);\n });\n\n document.addEventListener('keydown', this.pressEscape);\n\n // manage tooltipElement & tooltipedElement mouseenter/mouseleave events\n ['mouseenter', 'mouseleave'].forEach(eventType => {\n const isMouseenter = eventType === 'mouseenter';\n [\n { element: this.mgTooltipContent, action: () => this.tooltipMouseListenerAction(Guard.HOVER_TOOLTIP_ELEMENT, isMouseenter, Guard.HOVER_TOOLTIPED_ELEMENT) },\n { element: this.tooltipedElement, action: () => this.tooltipMouseListenerAction(Guard.HOVER_TOOLTIPED_ELEMENT, isMouseenter, Guard.HOVER_TOOLTIP_ELEMENT) },\n ].forEach(({ element, action }) => {\n element.addEventListener(eventType, () => {\n action();\n });\n });\n });\n };\n\n /\n Render tooltip content element\n /\n private renderTooltipContent(): void {\n const mgTooltipContent = this.element.querySelector('mg-tooltip-content');\n if (mgTooltipContent === null) {\n const mgTooltipContent = document.createElement('mg-tooltip-content');\n mgTooltipContent.setAttribute('slot', 'content');\n mgTooltipContent.setAttribute('id', this.identifier);\n\n const arrow = document.createElement('div');\n arrow.setAttribute('slot', 'arrow');\n arrow.dataset.popperArrow = '';\n mgTooltipContent.appendChild(arrow);\n\n // append tooltip element to component\n this.element.appendChild(mgTooltipContent);\n } else {\n mgTooltipContent.setAttribute('id', this.identifier);\n }\n }\n\n /***********\n Lifecycle \n **********/\n\n /\n * set variables\n /\n componentWillLoad(): void {\n // Get windows to attach events\n this.windows = getWindows(window);\n\n // Get tooltip element\n this.renderTooltipContent();\n this.mgTooltipContent = this.element.querySelector(`#${this.identifier}`);\n\n //validate properties\n this.validateDisabled(this.disabled);\n this.validateMessage(this.message);\n this.validateIdentifier();\n }\n\n /\n Get slotted element\n * Check if it already contain an interactive element, if not we need to add a tabIndex attribute\n * We need to attach the focused element to the tooltip (aria-describedby)\n /\n componentDidLoad(): void {\n // get slotted element wich is not the tooltip\n const slotElement: HTMLElement = this.element.querySelector(`:not(#${this.identifier})`);\n\n // Get interactive element\n const interactiveElement: HTMLElement = slotElement.matches(focusableElements) ? slotElement : slotElement.shadowRoot?.querySelector(focusableElements);\n\n // define selected element to become tooltip selector\n this.tooltipedElement = interactiveElement \|\| slotElement;\n\n // Check if slotted element is a disabled mg-button\n // In this case we wrap the mg-button into a div to enable the tooltip\n if (isButton(slotElement)) {\n new MutationObserver(mutationList => {\n if (mutationList.some(mutation => ['aria-disabled', 'disabled'].includes(mutation.attributeName))) {\n this.setMgButtonWrapper(slotElement);\n // Since Firefox doesn't trigger a \"blur\" event when the \"disabled\" attribute is added or removed from a button\n // we have to manually unlock the guard because the \"blur\" handler of the tooltipedElement won't do it.\n this.resetGuard();\n this.initTooltip(slotElement, interactiveElement);\n }\n }).observe(slotElement, { attributes: true });\n this.setMgButtonWrapper(slotElement);\n }\n\n // Init Tooltip\n this.initTooltip(slotElement, interactiveElement);\n\n this.handleDisplay(this.display);\n }\n\n /*\n update popper position after props change on component did update hook to benefit from render ended\n /\n componentDidUpdate(): void {\n this.popper.update();\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <Host>\n <slot></slot>\n <slot name=\"content\"></slot>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/molecules/inputs/MgInput.conf.js CHANGED Viewed

@@ -10,4 +10,5 @@ export var Handler;
     Handler["BLUR"] = "blur";
     Handler["FOCUS"] = "focus";
 })(Handler || (Handler = {}));
+export const tooltipPositions = ['input', 'label'];
 //# sourceMappingURL=MgInput.conf.js.map

package/dist/collection/components/molecules/inputs/MgInput.conf.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MgInput.conf.js","sourceRoot":"","sources":["../../../../src/components/molecules/inputs/MgInput.conf.ts"],"names":[],"mappings":"~~AAAA~~;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,MAAM,CAAU,CAAC;~~AAmBlD~~;;GAEG;AACH,MAAM,CAAN,IAAY,OAGX;AAHD,WAAY,OAAO;IACjB,wBAAa,CAAA;IACb,0BAAe,CAAA;AACjB,CAAC,EAHW,OAAO,KAAP,OAAO,QAGlB","sourcesContent":["/*\n Possible input width\n /\nexport const widths = [2, 4, 16, 'full'] as const;\n\nexport type Width = (typeof widths)[number];\n\n/\n Possible Input types\n /\n\nexport type HTMLMgInputsElement =\n \| HTMLMgInputCheckboxElement\n \| HTMLMgInputDateElement\n \| HTMLMgInputNumericElement\n \| HTMLMgInputPasswordElement\n \| HTMLMgInputRadioElement\n \| HTMLMgInputSelectElement\n \| HTMLMgInputTextElement\n \| HTMLMgInputTextareaElement\n \| (HTMLMgInputToggleElement & { required: true; invalid: false; displayError: () => void });\n\n/\n Available handlers\n */\nexport enum Handler {\n BLUR = 'blur',\n FOCUS = 'focus',\n}\n"]}
1	+ {"version":3,"file":"MgInput.conf.js","sourceRoot":"","sources":["../../../../src/components/molecules/inputs/MgInput.conf.ts"],"names":[],"mappings":"AAgCA;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,MAAM,CAAU,CAAC;AAkBlD;;GAEG;AACH,MAAM,CAAN,IAAY,OAGX;AAHD,WAAY,OAAO;IACjB,wBAAa,CAAA;IACb,0BAAe,CAAA;AACjB,CAAC,EAHW,OAAO,KAAP,OAAO,QAGlB;AAED,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,OAAO,EAAE,OAAO,CAAU,CAAC","sourcesContent":["import type { MgInputTitle } from '../../atoms/mg-input-title/mg-input-title';\nimport type { ClassList } from '@mgdis/stencil-helpers';\n\n/*\n MgInput component props\n /\nexport interface MgInputProps {\n // Global\n identifier: string;\n classCollection: ClassList;\n // Label\n label: string;\n labelOnTop: boolean;\n labelHide: boolean;\n isFieldset: MgInputTitle['isLegend'];\n // Input\n value: string;\n readonlyValue: string \| string[];\n required: boolean;\n readonly: boolean;\n mgWidth: Width;\n disabled: boolean;\n // Tooltip\n tooltip: string;\n tooltipPosition: TooltipPosition;\n // Help Text\n helpText: string;\n // Error Message\n errorMessage: string;\n // ariaDescribedbyIDs\n ariaDescribedbyIDs: string[];\n}\n/\n Possible input width\n /\nexport const widths = [2, 4, 16, 'full'] as const;\n\nexport type Width = (typeof widths)[number];\n\n/\n Possible Input types\n /\nexport type HTMLMgInputsElement =\n \| HTMLMgInputCheckboxElement\n \| HTMLMgInputDateElement\n \| HTMLMgInputNumericElement\n \| HTMLMgInputPasswordElement\n \| HTMLMgInputRadioElement\n \| HTMLMgInputSelectElement\n \| HTMLMgInputTextElement\n \| HTMLMgInputTextareaElement\n \| (HTMLMgInputToggleElement & { required: true; invalid: false; displayError: () => void });\n\n/\n Available handlers\n */\nexport enum Handler {\n BLUR = 'blur',\n FOCUS = 'focus',\n}\n\nexport const tooltipPositions = ['input', 'label'] as const;\n\nexport type TooltipPosition = (typeof tooltipPositions)[number];\n"]}

package/dist/collection/components/molecules/inputs/MgInput.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { h } from "@stencil/core";
-import { widths } from "./MgInput.conf";
+import { widths, tooltipPositions } from "./MgInput.conf";
 import { isValidString } from "@mgdis/stencil-helpers";
 /**
  * Apply in all input child node the aria-describedby attribute
@@ -37,12 +37,33 @@ const manageClasses = (props) => {
     if (props.mgWidth !== undefined)
         props.classCollection.add(`mg-c-input--width-${props.mgWidth}`);
 };
+/**
+ * Check props configuration
+ * @param props - MgInput Interface Props
+ */
+const checkPropsConfig = (props) => {
+    if (!isValidString(props.identifier)) {
+        throw new Error('<mg-input> prop "identifier" is required.');
+    }
+    if (!isValidString(props.label)) {
+        throw new Error('<mg-input> prop "label" is required.');
+    }
+    if (props.labelOnTop && props.labelHide) {
+        throw new Error('<mg-input> prop "labelOnTop" must not be paired with the prop "labelHide".');
+    }
+    if (!tooltipPositions.includes(props.tooltipPosition)) {
+        throw new Error(`<mg-input> prop "tooltipPosition" must be one of: ${tooltipPositions.join(', ')}`);
+    }
+};
 /**
  * Get tagname
  * @param isFieldset - is fieldset
  * @returns tag name
  */
 const getTagName = (isFieldset, readOnly) => (!isFieldset || readOnly ? 'div' : 'fieldset');
+/**
+ * MgInput Interface
+ */
 /**
  * Get input template
  * @param props - MgInput Interface Props
@@ -52,17 +73,9 @@ const getTagName = (isFieldset, readOnly) => (!isFieldset || readOnly ? 'div' :
  */
 export const MgInput = (props, children, utils) => {
     /**
-     * Check required properties
+     * Check props config
      */
-    if (!isValidString(props.identifier)) {
-        throw new Error('<mg-input> prop "identifier" is required.');
-    }
-    if (!isValidString(props.label)) {
-        throw new Error('<mg-input> prop "label" is required.');
-    }
-    if (props.labelOnTop && props.labelHide) {
-        throw new Error('<mg-input> prop "labelOnTop" must not be paired with the prop "labelHide".');
-    }
+    checkPropsConfig(props);
     /**
      * Set readonly value
      */
@@ -89,15 +102,15 @@ export const MgInput = (props, children, utils) => {
     /**
      * Return template
      *
-     * +--------+--------------+---------+
-     * |  label | input        | tooltip |
-     * |        +--------------+---------+
-     * |        | nb Char Left           |
-     * |        +------------------------+
-     * |        | Help Text              |
-     * |        +------------------------+
-     * |        | Error                  |
-     * +--------+------------------------+
+     * +--------+---------+--------------+---------+
+     * |  label | tooltip | input        | tooltip |
+     * |--------+---------+--------------+---------+
+     * |                  | nb Char Left           |
+     * |                  +------------------------+
+     * |                  | Help Text              |
+     * |                  +------------------------+
+     * |                  | Error                  |
+     * +------------------+------------------------+
      *
      * Error message is based on this aria method: https://www.w3.org/WAI/tutorials/forms/notifications/#on-focus-change
      */
@@ -107,12 +120,6 @@ export const MgInput = (props, children, utils) => {
      * @returns mg-tooltip
      */
     const getTooltip = () => (h("mg-tooltip", { identifier: `${props.identifier}-tooltip`, message: props.tooltip }, h("mg-icon", { icon: "info-circle" })));
-    /**
-     * Get input title (label) node
-     * Display asterisk only if not disabled and not readonly
-     * @returns mg-input-title
-     */
-    const getInputTitle = () => (h("mg-input-title", { identifier: props.identifier, readonly: props.readonly, class: props.labelHide ? 'mg-u-visually-hidden' : undefined, required: props.required && !props.disabled && !props.readonly, "is-legend": props.isFieldset }, props.label));
-    return (h(TagName, { class: props.classCollection.join() }, props.labelOnTop ? (h("div", { class: "mg-c-input__title" }, getInputTitle(), !props.readonly && props.tooltip && getTooltip())) : (getInputTitle()), props.readonly ? (h("div", { class: "mg-c-input__input-container" }, h("strong", null, props.readonlyValue), children.filter(child => Object.values(child).includes('append-input')))) : (h("div", { class: "mg-c-input__input-container" }, h("div", { class: { 'mg-c-input__input': true, 'mg-c-input__input--has-error': props.errorMessage !== undefined } }, applyAriadescribedBy(children, ariaDescribedbyIDs, utils), !props.labelOnTop && props.tooltip && getTooltip()), props.helpText && h("div", { id: helpTextId, class: "mg-c-input__help-text", innerHTML: props.helpText }), props.errorMessage && !props.readonly && !props.disabled && (h("div", { id: helpTextErrorId, class: "mg-c-input__error", innerHTML: props.errorMessage, "aria-live": "assertive" }))))));
+    return (h(TagName, { class: props.classCollection.join() }, h("div", { class: { 'mg-c-input__title': true, 'mg-u-visually-hidden': props.labelHide } }, h("mg-input-title", { identifier: props.identifier, readonly: props.readonly, required: props.required && !props.disabled && !props.readonly, "is-legend": props.isFieldset }, props.label), props.tooltip && !props.readonly && (props.tooltipPosition === 'label' || props.labelOnTop) && !props.labelHide && getTooltip()), props.readonly ? (h("div", { class: "mg-c-input__input-container" }, Array.isArray(props.readonlyValue) ? (h("ul", null, props.readonlyValue.map(value => (h("li", { key: value }, h("strong", null, value)))))) : (h("strong", null, props.readonlyValue)), children.filter(child => Object.values(child).includes('append-input')))) : (h("div", { class: "mg-c-input__input-container" }, h("div", { class: { 'mg-c-input__input': true, 'mg-c-input__input--has-error': props.errorMessage !== undefined } }, applyAriadescribedBy(children, ariaDescribedbyIDs, utils), props.tooltip && !props.readonly && !props.labelOnTop && (props.tooltipPosition === 'input' || props.labelHide) && getTooltip()), props.helpText && h("div", { id: helpTextId, class: "mg-c-input__help-text", innerHTML: props.helpText }), props.errorMessage && !props.readonly && !props.disabled && (h("div", { id: helpTextErrorId, class: "mg-c-input__error", innerHTML: props.errorMessage, "aria-live": "assertive" }))))));
 };
 //# sourceMappingURL=MgInput.js.map

package/dist/collection/components/molecules/inputs/MgInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MgInput.js","sourceRoot":"","sources":["../../../../src/components/molecules/inputs/MgInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionalComponent, h, VNode, FunctionalUtilities } from '@stencil/core';\nimport { widths, Width } from './MgInput.conf';\nimport { ClassList, isValidString } from '@mgdis/stencil-helpers';\nimport { MgInputTitle } from '../../atoms/mg-input-title/mg-input-title';\n\n/*\n Apply in all input child node the aria-describedby attribute\n * @param children - Represent scoped elements\n * @param ariaDescribedbyIDs - List of IDs\n * @param utils - Stencil.js utils\n * @returns Children with aria-describedby attribute\n /\nconst applyAriadescribedBy = (children: VNode[], ariaDescribedbyIDs: Set<string>, utils: FunctionalUtilities): VNode[] =>\n utils.map(children, child => {\n if (['input', 'select', 'textarea'].includes(child.vtag as string)) {\n return {\n ...child,\n vattrs: {\n ...child.vattrs,\n 'aria-describedby': [...ariaDescribedbyIDs].join(' '),\n },\n };\n }\n\n // we recursively apply ariadescribedBy attributes to child input nodes if exists\n if (child.vchildren === null) return { ...child };\n return {\n ...child,\n vchildren: applyAriadescribedBy(child.vchildren, ariaDescribedbyIDs, utils),\n };\n });\n\n/\n Add classes based on props\n * @param props - MgInput Interface Props\n /\nconst manageClasses = (props: MgInputProps): void => {\n props.classCollection.add('mg-c-input');\n\n if (props.labelOnTop) props.classCollection.add('mg-c-input--label-on-top');\n else props.classCollection.delete('mg-c-input--label-on-top');\n\n if (props.readonly) props.classCollection.add('mg-c-input--readonly');\n else props.classCollection.delete('mg-c-input--readonly');\n\n widths.forEach(width => {\n props.classCollection.delete(`mg-c-input--width-${width}`);\n });\n if (props.mgWidth !== undefined) props.classCollection.add(`mg-c-input--width-${props.mgWidth}`);\n};\n\n/\n Get tagname\n * @param isFieldset - is fieldset\n * @returns tag name\n /\nconst getTagName = (isFieldset: MgInputProps['isFieldset'], readOnly: MgInputProps['readonly']): string => (!isFieldset \|\| readOnly ? 'div' : 'fieldset');\n\n/\n MgInput Interface\n /\ninterface MgInputProps {\n // Global\n identifier: string;\n classCollection: ClassList;\n // Label\n label: string;\n labelOnTop: boolean;\n labelHide: boolean;\n isFieldset: MgInputTitle['isLegend'];\n // Input\n value: string;\n readonlyValue: string;\n required: boolean;\n readonly: boolean;\n mgWidth: Width;\n disabled: boolean;\n // Tooltip\n tooltip: string;\n // Help Text\n helpText: string;\n // Error Message\n errorMessage: string;\n // ariaDescribedbyIDs\n ariaDescribedbyIDs: string[];\n}\n\n/\n Get input template\n * @param props - MgInput Interface Props\n * @param children - Represent scoped elements\n * @param utils - Stencil.js utils\n * @returns input template\n /\nexport const MgInput: FunctionalComponent<MgInputProps> = (props: MgInputProps, children: VNode[], utils: FunctionalUtilities): VNode[] => {\n /\n Check required properties\n /\n if (!isValidString(props.identifier)) {\n throw new Error('<mg-input> prop \"identifier\" is required.');\n }\n if (!isValidString(props.label)) {\n throw new Error('<mg-input> prop \"label\" is required.');\n }\n if (props.labelOnTop && props.labelHide) {\n throw new Error('<mg-input> prop \"labelOnTop\" must not be paired with the prop \"labelHide\".');\n }\n\n /\n Set readonly value\n /\n if (props.readonlyValue === undefined) props.readonlyValue = props.value;\n\n /\n Component classes\n /\n manageClasses(props);\n\n /\n a11y IDs\n /\n const ariaDescribedbyIDs: Set<string> = new Set(props.ariaDescribedbyIDs);\n\n // Help text\n const helpTextId = `${props.identifier}-help-text`;\n if (typeof props.helpText === 'string' && props.helpText !== '') {\n ariaDescribedbyIDs.add(helpTextId);\n }\n\n // Error Message\n const helpTextErrorId = `${props.identifier}-error`;\n if (typeof props.errorMessage === 'string' && props.errorMessage !== '') {\n ariaDescribedbyIDs.add(helpTextErrorId);\n }\n\n /\n Return template\n \n +--------+--------------+---------+\n * \| label \| input \| tooltip \|\n * \| +--------------+---------+\n * \| \| nb Char Left \|\n * \| +------------------------+\n * \| \| Help Text \|\n * \| +------------------------+\n * \| \| Error \|\n * +--------+------------------------+\n \n Error message is based on this aria method: https://www.w3.org/WAI/tutorials/forms/notifications/#on-focus-change\n /\n\n const TagName = getTagName(props.isFieldset, props.readonly);\n\n /\n Get tooltip node\n * @returns mg-tooltip\n /\n const getTooltip = (): VNode[] => (\n <mg-tooltip identifier={`${props.identifier}-tooltip`} message={props.tooltip}>\n <mg-icon icon=\"info-circle\"></mg-icon>\n </mg-tooltip>\n );\n\n /\n Get input title (label) node\n * Display asterisk only if not disabled and not readonly\n * @returns mg-input-title\n */\n const getInputTitle = (): VNode[] => (\n <mg-input-title\n identifier={props.identifier}\n readonly={props.readonly}\n class={props.labelHide ? 'mg-u-visually-hidden' : undefined}\n required={props.required && !props.disabled && !props.readonly}\n is-legend={props.isFieldset}\n >\n {props.label}\n </mg-input-title>\n );\n\n return (\n <TagName class={props.classCollection.join()}>\n {props.labelOnTop ? (\n <div class=\"mg-c-input__title\">\n {getInputTitle()}\n {!props.readonly && props.tooltip && getTooltip()}\n </div>\n ) : (\n getInputTitle()\n )}\n {props.readonly ? (\n <div class=\"mg-c-input__input-container\">\n <strong>{props.readonlyValue}</strong>\n {children.filter(child => Object.values(child).includes('append-input'))}\n </div>\n ) : (\n <div class=\"mg-c-input__input-container\">\n <div class={{ 'mg-c-input__input': true, 'mg-c-input__input--has-error': props.errorMessage !== undefined }}>\n {applyAriadescribedBy(children, ariaDescribedbyIDs, utils)}\n {!props.labelOnTop && props.tooltip && getTooltip()}\n </div>\n {props.helpText && <div id={helpTextId} class=\"mg-c-input__help-text\" innerHTML={props.helpText}></div>}\n {props.errorMessage && !props.readonly && !props.disabled && (\n <div id={helpTextErrorId} class=\"mg-c-input__error\" innerHTML={props.errorMessage} aria-live=\"assertive\"></div>\n )}\n </div>\n )}\n </TagName>\n );\n};\n"]}
1	+ {"version":3,"file":"MgInput.js","sourceRoot":"","sources":["../../../../src/components/molecules/inputs/MgInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionalComponent, h, VNode, FunctionalUtilities } from '@stencil/core';\nimport { widths, tooltipPositions, type MgInputProps } from './MgInput.conf';\nimport { isValidString } from '@mgdis/stencil-helpers';\n\n/*\n Apply in all input child node the aria-describedby attribute\n * @param children - Represent scoped elements\n * @param ariaDescribedbyIDs - List of IDs\n * @param utils - Stencil.js utils\n * @returns Children with aria-describedby attribute\n /\nconst applyAriadescribedBy = (children: VNode[], ariaDescribedbyIDs: Set<string>, utils: FunctionalUtilities): VNode[] =>\n utils.map(children, child => {\n if (['input', 'select', 'textarea'].includes(child.vtag as string)) {\n return {\n ...child,\n vattrs: {\n ...child.vattrs,\n 'aria-describedby': [...ariaDescribedbyIDs].join(' '),\n },\n };\n }\n\n // we recursively apply ariadescribedBy attributes to child input nodes if exists\n if (child.vchildren === null) return { ...child };\n return {\n ...child,\n vchildren: applyAriadescribedBy(child.vchildren, ariaDescribedbyIDs, utils),\n };\n });\n\n/\n Add classes based on props\n * @param props - MgInput Interface Props\n /\nconst manageClasses = (props: MgInputProps): void => {\n props.classCollection.add('mg-c-input');\n\n if (props.labelOnTop) props.classCollection.add('mg-c-input--label-on-top');\n else props.classCollection.delete('mg-c-input--label-on-top');\n\n if (props.readonly) props.classCollection.add('mg-c-input--readonly');\n else props.classCollection.delete('mg-c-input--readonly');\n\n widths.forEach(width => {\n props.classCollection.delete(`mg-c-input--width-${width}`);\n });\n if (props.mgWidth !== undefined) props.classCollection.add(`mg-c-input--width-${props.mgWidth}`);\n};\n\n/\n Check props configuration\n * @param props - MgInput Interface Props\n /\nconst checkPropsConfig = (props: MgInputProps): void => {\n if (!isValidString(props.identifier)) {\n throw new Error('<mg-input> prop \"identifier\" is required.');\n }\n if (!isValidString(props.label)) {\n throw new Error('<mg-input> prop \"label\" is required.');\n }\n if (props.labelOnTop && props.labelHide) {\n throw new Error('<mg-input> prop \"labelOnTop\" must not be paired with the prop \"labelHide\".');\n }\n if (!tooltipPositions.includes(props.tooltipPosition)) {\n throw new Error(`<mg-input> prop \"tooltipPosition\" must be one of: ${tooltipPositions.join(', ')}`);\n }\n};\n\n/\n Get tagname\n * @param isFieldset - is fieldset\n * @returns tag name\n /\nconst getTagName = (isFieldset: MgInputProps['isFieldset'], readOnly: MgInputProps['readonly']): string => (!isFieldset \|\| readOnly ? 'div' : 'fieldset');\n\n/\n MgInput Interface\n /\n\n/\n Get input template\n * @param props - MgInput Interface Props\n * @param children - Represent scoped elements\n * @param utils - Stencil.js utils\n * @returns input template\n /\nexport const MgInput: FunctionalComponent<MgInputProps> = (props: MgInputProps, children: VNode[], utils: FunctionalUtilities): VNode[] => {\n /\n Check props config\n /\n checkPropsConfig(props);\n\n /\n Set readonly value\n /\n if (props.readonlyValue === undefined) props.readonlyValue = props.value;\n\n /\n Component classes\n /\n manageClasses(props);\n\n /\n a11y IDs\n /\n const ariaDescribedbyIDs: Set<string> = new Set(props.ariaDescribedbyIDs);\n\n // Help text\n const helpTextId = `${props.identifier}-help-text`;\n if (typeof props.helpText === 'string' && props.helpText !== '') {\n ariaDescribedbyIDs.add(helpTextId);\n }\n\n // Error Message\n const helpTextErrorId = `${props.identifier}-error`;\n if (typeof props.errorMessage === 'string' && props.errorMessage !== '') {\n ariaDescribedbyIDs.add(helpTextErrorId);\n }\n\n /\n Return template\n \n +--------+---------+--------------+---------+\n * \| label \| tooltip \| input \| tooltip \|\n * \|--------+---------+--------------+---------+\n * \| \| nb Char Left \|\n * \| +------------------------+\n * \| \| Help Text \|\n * \| +------------------------+\n * \| \| Error \|\n * +------------------+------------------------+\n \n Error message is based on this aria method: https://www.w3.org/WAI/tutorials/forms/notifications/#on-focus-change\n /\n\n const TagName = getTagName(props.isFieldset, props.readonly);\n\n /\n Get tooltip node\n * @returns mg-tooltip\n */\n const getTooltip = (): VNode[] => (\n <mg-tooltip identifier={`${props.identifier}-tooltip`} message={props.tooltip}>\n <mg-icon icon=\"info-circle\"></mg-icon>\n </mg-tooltip>\n );\n\n return (\n <TagName class={props.classCollection.join()}>\n <div class={{ 'mg-c-input__title': true, 'mg-u-visually-hidden': props.labelHide }}>\n <mg-input-title identifier={props.identifier} readonly={props.readonly} required={props.required && !props.disabled && !props.readonly} is-legend={props.isFieldset}>\n {props.label}\n </mg-input-title>\n {props.tooltip && !props.readonly && (props.tooltipPosition === 'label' \|\| props.labelOnTop) && !props.labelHide && getTooltip()}\n </div>\n {props.readonly ? (\n <div class=\"mg-c-input__input-container\">\n {Array.isArray(props.readonlyValue) ? (\n <ul>\n {props.readonlyValue.map(value => (\n <li key={value}>\n <strong>{value}</strong>\n </li>\n ))}\n </ul>\n ) : (\n <strong>{props.readonlyValue}</strong>\n )}\n {children.filter(child => Object.values(child).includes('append-input'))}\n </div>\n ) : (\n <div class=\"mg-c-input__input-container\">\n <div class={{ 'mg-c-input__input': true, 'mg-c-input__input--has-error': props.errorMessage !== undefined }}>\n {applyAriadescribedBy(children, ariaDescribedbyIDs, utils)}\n {props.tooltip && !props.readonly && !props.labelOnTop && (props.tooltipPosition === 'input' \|\| props.labelHide) && getTooltip()}\n </div>\n {props.helpText && <div id={helpTextId} class=\"mg-c-input__help-text\" innerHTML={props.helpText}></div>}\n {props.errorMessage && !props.readonly && !props.disabled && (\n <div id={helpTextErrorId} class=\"mg-c-input__error\" innerHTML={props.errorMessage} aria-live=\"assertive\"></div>\n )}\n </div>\n )}\n </TagName>\n );\n};\n"]}

package/dist/collection/components/molecules/inputs/mg-input-checkbox/MgInputCheckboxList.js CHANGED Viewed

@@ -8,12 +8,10 @@ export const MgInputCheckboxList = (props) => (
 // eslint-disable-next-line jsx-a11y/no-redundant-roles
 h("ul", { class: {
         'mg-c-input__input-group-container': true,
-        'mg-c-input__input-group-container--vertical': props.inputVerticalList || (props.type === 'multi' && !props.readonly),
-        'mg-c-input__input-checkbox-multi-inputs': props.type === 'multi' && !props.readonly,
-    }, role: "list", "aria-describedby": props.displaySearchInput ? 'search-results' : undefined, "aria-label": props.displaySearchInput ? props.messages.searchResults : undefined, "aria-live": props.displaySearchInput ? 'polite' : undefined, id: props.id }, props.checkboxes
-    .filter(item => !props.readonly || item.value)
-    .map(input => {
+        'mg-c-input__input-group-container--vertical': props.inputVerticalList || props.type === 'multi',
+        'mg-c-input__input-checkbox-multi-inputs': props.type === 'multi',
+    }, role: "list", "aria-describedby": props.displaySearchInput ? 'search-results' : undefined, "aria-label": props.displaySearchInput ? props.messages.searchResults : undefined, "aria-live": props.displaySearchInput ? 'polite' : undefined, id: props.id }, props.checkboxes.map(input => {
     var _a, _b;
-    return (h("li", { key: input._id, class: { 'mg-c-input__input-group': true, 'mg-c-input__input-group--disabled': props.disabled || input.disabled } }, h("input", { type: "checkbox", id: input._id, name: props.name, value: (_a = input.value) === null || _a === void 0 ? void 0 : _a.toString(), checked: Boolean(input.value), required: input.required, "aria-invalid": ((_b = props.invalid) === null || _b === void 0 ? void 0 : _b.toString()) || 'false', disabled: props.readonly || props.disabled || input.disabled, indeterminate: input.value === null, onInput: input._handleInput, onBlur: input._handleBlur, onKeyDown: input._handleKeydown }), h("label", { htmlFor: input._id }, input.title)));
+    return (h("li", { key: input._id, class: { 'mg-c-input__input-group': true, 'mg-c-input__input-group--disabled': props.disabled || input.disabled } }, h("input", { type: "checkbox", id: input._id, name: props.name, value: (_a = input.value) === null || _a === void 0 ? void 0 : _a.toString(), checked: Boolean(input.value), required: input.required, "aria-invalid": ((_b = props.invalid) === null || _b === void 0 ? void 0 : _b.toString()) || 'false', disabled: props.disabled || input.disabled, indeterminate: input.value === null, onInput: input._handleInput, onBlur: input._handleBlur, onKeyDown: input._handleKeydown }), h("label", { htmlFor: input._id }, input.title)));
 })));
 //# sourceMappingURL=MgInputCheckboxList.js.map

package/dist/collection/components/molecules/inputs/mg-input-checkbox/MgInputCheckboxList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MgInputCheckboxList.js","sourceRoot":"","sources":["../../../../../src/components/molecules/inputs/mg-input-checkbox/MgInputCheckboxList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,CAAC,EAAS,MAAM,eAAe,CAAC;AAG9D;;;;GAIG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAkD,CAAC,KAA+B,EAAW,EAAE,CAAC;AAC9H,uDAAuD;AACvD,UACE,KAAK,EAAE;QACL,mCAAmC,EAAE,IAAI;QACzC,6CAA6C,EAAE,KAAK,CAAC,iBAAiB,IAAI,~~CAAC,~~KAAK,CAAC,IAAI,KAAK,OAAO~~,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC~~;~~QACrH~~,yCAAyC,EAAE,KAAK,CAAC,IAAI,KAAK,OAAO~~,IAAI,CAAC,KAAK,CAAC,QAAQ~~;~~KACrF~~,EACD,IAAI,EAAC,MAAM,sBACO,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,SAAS,gBAC7D,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,eACpE,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAC1D,EAAE,EAAE,KAAK,CAAC,EAAE,IAEX,KAAK,CAAC,UAAU~~;KACd~~,~~MAAM,~~CAAC,~~IAAI,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,QAAQ,IAAI,IAAI,CAAC,KAAK,CAAC;KAC7C,~~GAAG,CAAC,KAAK,CAAC,EAAE;;IAAC,OAAA,~~CACZ~~,UAAI,GAAG,EAAE,KAAK,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,yBAAyB,EAAE,IAAI,EAAE,mCAAmC,EAAE,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,EAAE;QACnI,aACE,IAAI,EAAC,UAAU,EACf,EAAE,EAAE,KAAK,CAAC,GAAG,EACb,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,KAAK,EAAE,MAAA,KAAK,CAAC,KAAK,0CAAE,QAAQ,EAAE,EAC9B,OAAO,EAAE,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,EAC7B,QAAQ,EAAE,KAAK,CAAC,QAAQ,kBACV,CAAA,MAAA,KAAK,CAAC,OAAO,0CAAE,QAAQ,EAAE,KAAI,OAAO,EAClD,QAAQ,EAAE,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,~~IAAI~~,~~KAAK,CAAC,QAAQ,EAC5D,~~aAAa,EAAE,KAAK,CAAC,KAAK,KAAK,IAAI,EACnC,OAAO,EAAE,KAAK,CAAC,YAAY,EAC3B,MAAM,EAAE,KAAK,CAAC,WAAW,EACzB,SAAS,EAAE,KAAK,CAAC,cAAc,GAC/B;QACF,aAAO,OAAO,EAAE,KAAK,CAAC,GAAG,IAAG,KAAK,CAAC,KAAK,CAAS,CAC7C,CACN,CAAA;CAAA,CAAC,~~CACD~~,CACN,CAAC","sourcesContent":["import { FunctionalComponent, h, VNode } from '@stencil/core';\nimport { MgInputCheckboxListProps } from './mg-input-checkbox.conf';\n\n/*\n Get checkboxes list template\n * @param props - MgInputCheckboxList Interface Props\n * @returns input template\n */\nexport const MgInputCheckboxList: FunctionalComponent<MgInputCheckboxListProps> = (props: MgInputCheckboxListProps): VNode[] => (\n // eslint-disable-next-line jsx-a11y/no-redundant-roles\n <ul\n class={{\n 'mg-c-input__input-group-container': true,\n 'mg-c-input__input-group-container--vertical': props.inputVerticalList \|\| (props.type === 'multi' ~~&& !props.readonly)~~,\n 'mg-c-input__input-checkbox-multi-inputs': props.type === 'multi' ~~&& !props.readonly~~,\n }}\n role=\"list\"\n aria-describedby={props.displaySearchInput ? 'search-results' : undefined}\n aria-label={props.displaySearchInput ? props.messages.searchResults : undefined}\n aria-live={props.displaySearchInput ? 'polite' : undefined}\n id={props.id}\n >\n {props.checkboxes\n .~~filter(item => !props.readonly \|\| item.value)\n .~~map(input => (\n <li key={input._id} class={{ 'mg-c-input__input-group': true, 'mg-c-input__input-group--disabled': props.disabled \|\| input.disabled }}>\n <input\n type=\"checkbox\"\n id={input._id}\n name={props.name}\n value={input.value?.toString()}\n checked={Boolean(input.value)}\n required={input.required}\n aria-invalid={props.invalid?.toString() \|\| 'false'}\n disabled={props.~~readonly \|\| props.~~disabled \|\| input.disabled}\n indeterminate={input.value === null}\n onInput={input._handleInput}\n onBlur={input._handleBlur}\n onKeyDown={input._handleKeydown}\n />\n <label htmlFor={input._id}>{input.title}</label>\n </li>\n ))}\n </ul>\n);\n"]}
1	+ {"version":3,"file":"MgInputCheckboxList.js","sourceRoot":"","sources":["../../../../../src/components/molecules/inputs/mg-input-checkbox/MgInputCheckboxList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,CAAC,EAAS,MAAM,eAAe,CAAC;AAG9D;;;;GAIG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAkD,CAAC,KAA+B,EAAW,EAAE,CAAC;AAC9H,uDAAuD;AACvD,UACE,KAAK,EAAE;QACL,mCAAmC,EAAE,IAAI;QACzC,6CAA6C,EAAE,KAAK,CAAC,iBAAiB,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO;QAChG,yCAAyC,EAAE,KAAK,CAAC,IAAI,KAAK,OAAO;KAClE,EACD,IAAI,EAAC,MAAM,sBACO,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,SAAS,gBAC7D,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,eACpE,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAC1D,EAAE,EAAE,KAAK,CAAC,EAAE,IAEX,KAAK,CAAC,UAAU,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;;IAAC,OAAA,CAC7B,UAAI,GAAG,EAAE,KAAK,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,yBAAyB,EAAE,IAAI,EAAE,mCAAmC,EAAE,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,EAAE;QACnI,aACE,IAAI,EAAC,UAAU,EACf,EAAE,EAAE,KAAK,CAAC,GAAG,EACb,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,KAAK,EAAE,MAAA,KAAK,CAAC,KAAK,0CAAE,QAAQ,EAAE,EAC9B,OAAO,EAAE,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,EAC7B,QAAQ,EAAE,KAAK,CAAC,QAAQ,kBACV,CAAA,MAAA,KAAK,CAAC,OAAO,0CAAE,QAAQ,EAAE,KAAI,OAAO,EAClD,QAAQ,EAAE,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,EAC1C,aAAa,EAAE,KAAK,CAAC,KAAK,KAAK,IAAI,EACnC,OAAO,EAAE,KAAK,CAAC,YAAY,EAC3B,MAAM,EAAE,KAAK,CAAC,WAAW,EACzB,SAAS,EAAE,KAAK,CAAC,cAAc,GAC/B;QACF,aAAO,OAAO,EAAE,KAAK,CAAC,GAAG,IAAG,KAAK,CAAC,KAAK,CAAS,CAC7C,CACN,CAAA;CAAA,CAAC,CACC,CACN,CAAC","sourcesContent":["import { FunctionalComponent, h, VNode } from '@stencil/core';\nimport { MgInputCheckboxListProps } from './mg-input-checkbox.conf';\n\n/*\n Get checkboxes list template\n * @param props - MgInputCheckboxList Interface Props\n * @returns input template\n */\nexport const MgInputCheckboxList: FunctionalComponent<MgInputCheckboxListProps> = (props: MgInputCheckboxListProps): VNode[] => (\n // eslint-disable-next-line jsx-a11y/no-redundant-roles\n <ul\n class={{\n 'mg-c-input__input-group-container': true,\n 'mg-c-input__input-group-container--vertical': props.inputVerticalList \|\| props.type === 'multi',\n 'mg-c-input__input-checkbox-multi-inputs': props.type === 'multi',\n }}\n role=\"list\"\n aria-describedby={props.displaySearchInput ? 'search-results' : undefined}\n aria-label={props.displaySearchInput ? props.messages.searchResults : undefined}\n aria-live={props.displaySearchInput ? 'polite' : undefined}\n id={props.id}\n >\n {props.checkboxes.map(input => (\n <li key={input._id} class={{ 'mg-c-input__input-group': true, 'mg-c-input__input-group--disabled': props.disabled \|\| input.disabled }}>\n <input\n type=\"checkbox\"\n id={input._id}\n name={props.name}\n value={input.value?.toString()}\n checked={Boolean(input.value)}\n required={input.required}\n aria-invalid={props.invalid?.toString() \|\| 'false'}\n disabled={props.disabled \|\| input.disabled}\n indeterminate={input.value === null}\n onInput={input._handleInput}\n onBlur={input._handleBlur}\n onKeyDown={input._handleKeydown}\n />\n <label htmlFor={input._id}>{input.title}</label>\n </li>\n ))}\n </ul>\n);\n"]}

package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.js CHANGED Viewed

@@ -99,10 +99,10 @@ export class MgInputCheckboxPaginated {
      * @returns HTML Element
      */
     render() {
-        const getText = (checkboxes) => (h("em", { class: "mg-c-input__input-checkbox-multi-section-header-label" }, `${this.messages[checkboxes.length > 1 ? 'titlePlurial' : 'title']} (${checkboxes.length})`));
+        const getText = (checkboxes) => (h("em", { key: '28eedd949445bc6c7a5a750359af7159055657d8', class: "mg-c-input__input-checkbox-multi-section-header-label" }, `${this.messages[checkboxes.length > 1 ? 'titlePlurial' : 'title']} (${checkboxes.length})`));
         const [from, to] = this.getFromToIndexes();
         const itemsContainerId = `items-${this.sectionKind}-container`;
-        return (h(Host, { hidden: this.checkboxes.length < 1 }, h("div", { class: "mg-c-input__input-checkbox-multi-section-header" }, this.titleKind === SectionTitleKind.BUTTON ? (h("mg-button", { variant: "flat", onClick: this.handleToggleClick, "aria-controls": itemsContainerId, "aria-expanded": this.expanded.toString() }, h("mg-icon", { icon: this.expanded ? 'chevron-up' : 'chevron-down', size: "small" }), h("span", { class: "mg-c-input__input-checkbox-multi-text" }, getText(this.checkboxes)))) : (h("p", { class: "mg-c-input__input-checkbox-multi-title" }, getText(this.checkboxes))), ((this.sectionKind === SectionKind.SELECTED && this.expanded) || this.sectionKind === SectionKind.NOT_SELECTED) && (h("mg-tooltip", { class: "mg-c-input__input-checkbox-multi-section-header-tootlip", message: this.messages.tooltip, "data-popper-strategy": "absolute" }, h("mg-button", { variant: "link", onClick: this.massActionHandler }, this.messages.action))), this.expanded && this.getPageCount(this.checkboxes) > 1 && (h("mg-pagination", { key: "search-pagination", totalPages: this.getPageCount(this.checkboxes), currentPage: this.currentPage, "onCurrent-page-change": this.handleCurrentPageChange, hideNavigationLabels: true, hidePageCount: true, identifier: `input-checkbox-pagination-${this.sectionKind}` }))), h("div", { hidden: !this.expanded, id: itemsContainerId, class: "mg-c-input__input-checkbox-multi-section-content" }, h(MgInputCheckboxList, { checkboxes: this.getArrayRange(this.checkboxes, from, to), inputVerticalList: true, type: 'multi', displaySearchInput: true, messages: this.messages, id: `items-${this.sectionKind}`, readonly: this.readonly, disabled: this.disabled, name: this.name, invalid: this.invalid }))));
+        return (h(Host, { key: 'a7ade87a72bb1cba4d0c20dde425cefc5c7fbff4', hidden: this.checkboxes.length < 1 }, h("div", { key: '38711edade3945e940ba29b44492424c3e5b7063', class: "mg-c-input__input-checkbox-multi-section-header" }, this.titleKind === SectionTitleKind.BUTTON ? (h("mg-button", { variant: "flat", onClick: this.handleToggleClick, "aria-controls": itemsContainerId, "aria-expanded": this.expanded.toString() }, h("mg-icon", { icon: this.expanded ? 'chevron-up' : 'chevron-down', size: "small" }), h("span", { class: "mg-c-input__input-checkbox-multi-text" }, getText(this.checkboxes)))) : (h("p", { class: "mg-c-input__input-checkbox-multi-title" }, getText(this.checkboxes))), ((this.sectionKind === SectionKind.SELECTED && this.expanded) || this.sectionKind === SectionKind.NOT_SELECTED) && (h("mg-tooltip", { class: "mg-c-input__input-checkbox-multi-section-header-tootlip", message: this.messages.tooltip, "data-popper-strategy": "absolute" }, h("mg-button", { variant: "link", onClick: this.massActionHandler }, this.messages.action))), this.expanded && this.getPageCount(this.checkboxes) > 1 && (h("mg-pagination", { key: "search-pagination", totalPages: this.getPageCount(this.checkboxes), currentPage: this.currentPage, "onCurrent-page-change": this.handleCurrentPageChange, hideNavigationLabels: true, hidePageCount: true, identifier: `input-checkbox-pagination-${this.sectionKind}` }))), h("div", { key: '3a514d5711da9ebb57d21e70609b7f6f2d1e621e', hidden: !this.expanded, id: itemsContainerId, class: "mg-c-input__input-checkbox-multi-section-content" }, h(MgInputCheckboxList, { key: '84223d73e67e355ce01a4f70ef75a42a18fd96b4', checkboxes: this.getArrayRange(this.checkboxes, from, to), inputVerticalList: true, type: 'multi', displaySearchInput: true, messages: this.messages, id: `items-${this.sectionKind}`, disabled: this.disabled, name: this.name, invalid: this.invalid }))));
     }
     static get is() { return "mg-input-checkbox-paginated"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-input-checkbox-paginated.js","sourceRoot":"","sources":["../../../../../../src/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, State, Event, EventEmitter, Watch, Host } from '@stencil/core';\nimport { CheckboxItem, IMgInputCheckboxBase, SectionKind, SectionTitleKind } from '../mg-input-checkbox.conf';\nimport { MgInputCheckboxList } from '../MgInputCheckboxList';\n\n/*\n Internal component use to manage sections instances\n /\n@Component({\n tag: 'mg-input-checkbox-paginated',\n shadow: false,\n scoped: true,\n})\nexport class MgInputCheckboxPaginated implements IMgInputCheckboxBase {\n /***********\n Constantes \n **********/\n private readonly offset = 10;\n\n /**********\n Decorators \n **********/\n\n /\n * Define if mg-input-checkbox-list is readonly\n /\n @Prop() readonly: boolean;\n\n /\n Define if mg-input-checkbox-list is disabled\n /\n @Prop() disabled: boolean;\n\n /\n Define mg-input-checkbox input name\n /\n @Prop() name: string;\n\n /\n Define mg-input-checkbox input invalid\n /\n @Prop() invalid: boolean;\n\n /\n Current page\n /\n @Prop({ mutable: true }) currentPage = 1;\n\n /\n Define checkboxes to paginate\n /\n @Prop() checkboxes: CheckboxItem[] = [];\n @Watch('checkboxes')\n validateCheckboxes(newValue: MgInputCheckboxPaginated['checkboxes'], oldValue: MgInputCheckboxPaginated['checkboxes']): void {\n const pageCountNewValue = this.getPageCount(newValue);\n const pageCountOldValue = this.getPageCount(oldValue);\n // after each array.length update we reset pagination\n // when items fill on page, we set current page to 1\n if (pageCountNewValue === 1 \|\| (pageCountNewValue !== 0 && this.currentPage === 0)) {\n this.currentPage = 1;\n }\n // when old items page numbers match the current page AND new items page number is lower than current page, we set the new last page\n else if (pageCountOldValue === this.currentPage && pageCountNewValue < this.currentPage) {\n this.currentPage--;\n }\n }\n\n /\n Define section kind\n /\n @Prop() sectionKind: SectionKind;\n @Watch('sectionKind')\n validateSectionKind(newValue: MgInputCheckboxPaginated['sectionKind']): void {\n if (newValue === SectionKind.SELECTED) this.titleKind = SectionTitleKind.BUTTON;\n else this.titleKind = SectionTitleKind.TEXT;\n }\n\n /\n Define component message\n /\n @Prop() messages: Record<string, string>;\n\n /\n Emit 'mass-action' event\n * used to informe that select-all/unselect-all button listner is triggered\n /\n @Event({ eventName: 'mass-action' }) massAction: EventEmitter<HTMLMgInputCheckboxPaginatedElement['sectionKind']>;\n\n /\n Define section title\n /\n @State() titleKind: SectionTitleKind;\n\n /\n Is checked items values expanded\n /\n @State() expanded = true;\n\n /*********\n Methods \n ********/\n\n /\n * Mass action handler\n /\n private massActionHandler = (): void => {\n this.massAction.emit(this.sectionKind);\n };\n\n /\n Toggle items button handler\n /\n private handleToggleClick = (): void => {\n this.expanded = !this.expanded;\n };\n\n /\n Method to get a array range\n * @param from - array start index\n * @param to - array end index\n * @returns array's range\n /\n private getArrayRange = <ItemType,>(array: ItemType[], from: number, to: number): ItemType[] => array.slice(from, to);\n\n /\n Get from and to index\n * @returns [from,to] index\n /\n private getFromToIndexes(): number[] {\n const isFirstPage = this.currentPage === 1;\n const from = isFirstPage ? 0 : (this.currentPage - 1) this.offset;\n const to = isFirstPage ? this.offset : this.currentPage * this.offset;\n return [from, to];\n }\n\n /*\n Method to get page count from items\n * @param items - items to count\n * @returns page count from items\n /\n private getPageCount = (item: unknown[]): number => Math.ceil(item.length / this.offset);\n\n /\n Handle mg-pagination current page change event\n * @param event - pagination current page change event\n /\n private handleCurrentPageChange = (event: CustomEvent): void => {\n this.currentPage = Number(event.detail);\n };\n\n /***********\n Lifecycle \n **********/\n\n /\n * Check if component props are well configured on init\n /\n componentWillLoad(): void {\n this.validateSectionKind(this.sectionKind);\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n const getText = (checkboxes: CheckboxItem[]): HTMLElement => (\n <em class=\"mg-c-input__input-checkbox-multi-section-header-label\">{`${this.messages[checkboxes.length > 1 ? 'titlePlurial' : 'title']} (${checkboxes.length})`}</em>\n );\n const [from, to] = this.getFromToIndexes();\n const itemsContainerId = `items-${this.sectionKind}-container`;\n\n return (\n <Host hidden={this.checkboxes.length < 1}>\n <div class=\"mg-c-input__input-checkbox-multi-section-header\">\n {this.titleKind === SectionTitleKind.BUTTON ? (\n <mg-button variant=\"flat\" onClick={this.handleToggleClick} aria-controls={itemsContainerId} aria-expanded={this.expanded.toString()}>\n <mg-icon icon={this.expanded ? 'chevron-up' : 'chevron-down'} size=\"small\"></mg-icon>\n <span class=\"mg-c-input__input-checkbox-multi-text\">{getText(this.checkboxes)}</span>\n </mg-button>\n ) : (\n <p class=\"mg-c-input__input-checkbox-multi-title\">{getText(this.checkboxes)}</p>\n )}\n {((this.sectionKind === SectionKind.SELECTED && this.expanded) \|\| this.sectionKind === SectionKind.NOT_SELECTED) && (\n <mg-tooltip class=\"mg-c-input__input-checkbox-multi-section-header-tootlip\" message={this.messages.tooltip} data-popper-strategy=\"absolute\">\n <mg-button variant=\"link\" onClick={this.massActionHandler}>\n {this.messages.action}\n </mg-button>\n </mg-tooltip>\n )}\n {this.expanded && this.getPageCount(this.checkboxes) > 1 && (\n <mg-pagination\n key=\"search-pagination\"\n totalPages={this.getPageCount(this.checkboxes)}\n currentPage={this.currentPage}\n onCurrent-page-change={this.handleCurrentPageChange}\n hideNavigationLabels={true}\n hidePageCount={true}\n identifier={`input-checkbox-pagination-${this.sectionKind}`}\n ></mg-pagination>\n )}\n </div>\n <div hidden={!this.expanded} id={itemsContainerId} class=\"mg-c-input__input-checkbox-multi-section-content\">\n <MgInputCheckboxList\n checkboxes={this.getArrayRange(this.checkboxes, from, to)}\n inputVerticalList={true}\n type={'multi'}\n displaySearchInput={true}\n messages={this.messages}\n id={`items-${this.sectionKind}`}\n readonly={this.readonly}\n disabled={this.disabled}\n name={this.name}\n invalid={this.invalid}\n ></MgInputCheckboxList>\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"mg-input-checkbox-paginated.js","sourceRoot":"","sources":["../../../../../../src/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAgB,KAAK,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC5F,OAAO,EAAsC,WAAW,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAC9G,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAE7D;;GAEG;AAMH,MAAM,OAAO,wBAAwB;;QACnC;;uBAEe;QACE,WAAM,GAAG,EAAE,CAAC;QAiF7B;;qBAEa;QAEb;;WAEG;QACK,sBAAiB,GAAG,GAAS,EAAE;YACrC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QACzC,CAAC,CAAC;QAEF;;WAEG;QACK,sBAAiB,GAAG,GAAS,EAAE;YACrC,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;QACjC,CAAC,CAAC;QAEF;;;;;WAKG;QACK,kBAAa,GAAG,CAAY,KAAiB,EAAE,IAAY,EAAE,EAAU,EAAc,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QAatH;;;;WAIG;QACK,iBAAY,GAAG,CAAC,IAAe,EAAU,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC;QAEzF;;;WAGG;QACK,4BAAuB,GAAG,CAAC,KAAkB,EAAQ,EAAE;YAC7D,IAAI,CAAC,WAAW,GAAG,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;QAC1C,CAAC,CAAC;;;;;2BAtGqC,CAAC;0BAKH,EAAE;;;;wBA6CnB,IAAI;;IA3CxB,kBAAkB,CAAC,QAAgD,EAAE,QAAgD;QACnH,MAAM,iBAAiB,GAAG,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;QACtD,MAAM,iBAAiB,GAAG,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;QACtD,qDAAqD;QACrD,oDAAoD;QACpD,IAAI,iBAAiB,KAAK,CAAC,IAAI,CAAC,iBAAiB,KAAK,CAAC,IAAI,IAAI,CAAC,WAAW,KAAK,CAAC,CAAC,EAAE,CAAC;YACnF,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC;QACvB,CAAC;QACD,oIAAoI;aAC/H,IAAI,iBAAiB,KAAK,IAAI,CAAC,WAAW,IAAI,iBAAiB,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC;YACxF,IAAI,CAAC,WAAW,EAAE,CAAC;QACrB,CAAC;IACH,CAAC;IAOD,mBAAmB,CAAC,QAAiD;QACnE,IAAI,QAAQ,KAAK,WAAW,CAAC,QAAQ;YAAE,IAAI,CAAC,SAAS,GAAG,gBAAgB,CAAC,MAAM,CAAC;;YAC3E,IAAI,CAAC,SAAS,GAAG,gBAAgB,CAAC,IAAI,CAAC;IAC9C,CAAC;IAiDD;;;OAGG;IACK,gBAAgB;QACtB,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW,KAAK,CAAC,CAAC;QAC3C,MAAM,IAAI,GAAG,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC;QACpE,MAAM,EAAE,GAAG,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,MAAM,CAAC;QACtE,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;IACpB,CAAC;IAiBD;;mBAEe;IAEf;;OAEG;IACH,iBAAiB;QACf,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;IAC7C,CAAC;IAED;;;OAGG;IACH,MAAM;QACJ,MAAM,OAAO,GAAG,CAAC,UAA0B,EAAe,EAAE,CAAC,CAC3D,2DAAI,KAAK,EAAC,uDAAuD,IAAE,GAAG,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,OAAO,CAAC,KAAK,UAAU,CAAC,MAAM,GAAG,CAAM,CACrK,CAAC;QACF,MAAM,CAAC,IAAI,EAAE,EAAE,CAAC,GAAG,IAAI,CAAC,gBAAgB,EAAE,CAAC;QAC3C,MAAM,gBAAgB,GAAG,SAAS,IAAI,CAAC,WAAW,YAAY,CAAC;QAE/D,OAAO,CACL,EAAC,IAAI,qDAAC,MAAM,EAAE,IAAI,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC;YACtC,4DAAK,KAAK,EAAC,iDAAiD;gBACzD,IAAI,CAAC,SAAS,KAAK,gBAAgB,CAAC,MAAM,CAAC,CAAC,CAAC,CAC5C,iBAAW,OAAO,EAAC,MAAM,EAAC,OAAO,EAAE,IAAI,CAAC,iBAAiB,mBAAiB,gBAAgB,mBAAiB,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE;oBACjI,eAAS,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,cAAc,EAAE,IAAI,EAAC,OAAO,GAAW;oBACrF,YAAM,KAAK,EAAC,uCAAuC,IAAE,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,CAAQ,CAC3E,CACb,CAAC,CAAC,CAAC,CACF,SAAG,KAAK,EAAC,wCAAwC,IAAE,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,CAAK,CACjF;gBACA,CAAC,CAAC,IAAI,CAAC,WAAW,KAAK,WAAW,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,WAAW,KAAK,WAAW,CAAC,YAAY,CAAC,IAAI,CAClH,kBAAY,KAAK,EAAC,yDAAyD,EAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,OAAO,0BAAuB,UAAU;oBACzI,iBAAW,OAAO,EAAC,MAAM,EAAC,OAAO,EAAE,IAAI,CAAC,iBAAiB,IACtD,IAAI,CAAC,QAAQ,CAAC,MAAM,CACX,CACD,CACd;gBACA,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAC1D,qBACE,GAAG,EAAC,mBAAmB,EACvB,UAAU,EAAE,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,EAC9C,WAAW,EAAE,IAAI,CAAC,WAAW,2BACN,IAAI,CAAC,uBAAuB,EACnD,oBAAoB,EAAE,IAAI,EAC1B,aAAa,EAAE,IAAI,EACnB,UAAU,EAAE,6BAA6B,IAAI,CAAC,WAAW,EAAE,GAC5C,CAClB,CACG;YACN,4DAAK,MAAM,EAAE,CAAC,IAAI,CAAC,QAAQ,EAAE,EAAE,EAAE,gBAAgB,EAAE,KAAK,EAAC,kDAAkD;gBACzG,EAAC,mBAAmB,qDAClB,UAAU,EAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,EAAE,EAAE,CAAC,EACzD,iBAAiB,EAAE,IAAI,EACvB,IAAI,EAAE,OAAO,EACb,kBAAkB,EAAE,IAAI,EACxB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,EAAE,EAAE,SAAS,IAAI,CAAC,WAAW,EAAE,EAC/B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,OAAO,GACA,CACnB,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Event, EventEmitter, Watch, Host } from '@stencil/core';\nimport { CheckboxItem, IMgInputCheckboxBase, SectionKind, SectionTitleKind } from '../mg-input-checkbox.conf';\nimport { MgInputCheckboxList } from '../MgInputCheckboxList';\n\n/*\n Internal component use to manage sections instances\n /\n@Component({\n tag: 'mg-input-checkbox-paginated',\n shadow: false,\n scoped: true,\n})\nexport class MgInputCheckboxPaginated implements IMgInputCheckboxBase {\n /***********\n Constantes \n **********/\n private readonly offset = 10;\n\n /**********\n Decorators \n **********/\n\n /\n * Define if mg-input-checkbox-list is readonly\n /\n @Prop() readonly: boolean;\n\n /\n Define if mg-input-checkbox-list is disabled\n /\n @Prop() disabled: boolean;\n\n /\n Define mg-input-checkbox input name\n /\n @Prop() name: string;\n\n /\n Define mg-input-checkbox input invalid\n /\n @Prop() invalid: boolean;\n\n /\n Current page\n /\n @Prop({ mutable: true }) currentPage = 1;\n\n /\n Define checkboxes to paginate\n /\n @Prop() checkboxes: CheckboxItem[] = [];\n @Watch('checkboxes')\n validateCheckboxes(newValue: MgInputCheckboxPaginated['checkboxes'], oldValue: MgInputCheckboxPaginated['checkboxes']): void {\n const pageCountNewValue = this.getPageCount(newValue);\n const pageCountOldValue = this.getPageCount(oldValue);\n // after each array.length update we reset pagination\n // when items fill on page, we set current page to 1\n if (pageCountNewValue === 1 \|\| (pageCountNewValue !== 0 && this.currentPage === 0)) {\n this.currentPage = 1;\n }\n // when old items page numbers match the current page AND new items page number is lower than current page, we set the new last page\n else if (pageCountOldValue === this.currentPage && pageCountNewValue < this.currentPage) {\n this.currentPage--;\n }\n }\n\n /\n Define section kind\n /\n @Prop() sectionKind: SectionKind;\n @Watch('sectionKind')\n validateSectionKind(newValue: MgInputCheckboxPaginated['sectionKind']): void {\n if (newValue === SectionKind.SELECTED) this.titleKind = SectionTitleKind.BUTTON;\n else this.titleKind = SectionTitleKind.TEXT;\n }\n\n /\n Define component message\n /\n @Prop() messages: Record<string, string>;\n\n /\n Emit 'mass-action' event\n * used to informe that select-all/unselect-all button listner is triggered\n /\n @Event({ eventName: 'mass-action' }) massAction: EventEmitter<HTMLMgInputCheckboxPaginatedElement['sectionKind']>;\n\n /\n Define section title\n /\n @State() titleKind: SectionTitleKind;\n\n /\n Is checked items values expanded\n /\n @State() expanded = true;\n\n /*********\n Methods \n ********/\n\n /\n * Mass action handler\n /\n private massActionHandler = (): void => {\n this.massAction.emit(this.sectionKind);\n };\n\n /\n Toggle items button handler\n /\n private handleToggleClick = (): void => {\n this.expanded = !this.expanded;\n };\n\n /\n Method to get a array range\n * @param from - array start index\n * @param to - array end index\n * @returns array's range\n /\n private getArrayRange = <ItemType,>(array: ItemType[], from: number, to: number): ItemType[] => array.slice(from, to);\n\n /\n Get from and to index\n * @returns [from,to] index\n /\n private getFromToIndexes(): number[] {\n const isFirstPage = this.currentPage === 1;\n const from = isFirstPage ? 0 : (this.currentPage - 1) this.offset;\n const to = isFirstPage ? this.offset : this.currentPage * this.offset;\n return [from, to];\n }\n\n /*\n Method to get page count from items\n * @param items - items to count\n * @returns page count from items\n /\n private getPageCount = (item: unknown[]): number => Math.ceil(item.length / this.offset);\n\n /\n Handle mg-pagination current page change event\n * @param event - pagination current page change event\n /\n private handleCurrentPageChange = (event: CustomEvent): void => {\n this.currentPage = Number(event.detail);\n };\n\n /***********\n Lifecycle \n **********/\n\n /\n * Check if component props are well configured on init\n /\n componentWillLoad(): void {\n this.validateSectionKind(this.sectionKind);\n }\n\n /\n Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n const getText = (checkboxes: CheckboxItem[]): HTMLElement => (\n <em class=\"mg-c-input__input-checkbox-multi-section-header-label\">{`${this.messages[checkboxes.length > 1 ? 'titlePlurial' : 'title']} (${checkboxes.length})`}</em>\n );\n const [from, to] = this.getFromToIndexes();\n const itemsContainerId = `items-${this.sectionKind}-container`;\n\n return (\n <Host hidden={this.checkboxes.length < 1}>\n <div class=\"mg-c-input__input-checkbox-multi-section-header\">\n {this.titleKind === SectionTitleKind.BUTTON ? (\n <mg-button variant=\"flat\" onClick={this.handleToggleClick} aria-controls={itemsContainerId} aria-expanded={this.expanded.toString()}>\n <mg-icon icon={this.expanded ? 'chevron-up' : 'chevron-down'} size=\"small\"></mg-icon>\n <span class=\"mg-c-input__input-checkbox-multi-text\">{getText(this.checkboxes)}</span>\n </mg-button>\n ) : (\n <p class=\"mg-c-input__input-checkbox-multi-title\">{getText(this.checkboxes)}</p>\n )}\n {((this.sectionKind === SectionKind.SELECTED && this.expanded) \|\| this.sectionKind === SectionKind.NOT_SELECTED) && (\n <mg-tooltip class=\"mg-c-input__input-checkbox-multi-section-header-tootlip\" message={this.messages.tooltip} data-popper-strategy=\"absolute\">\n <mg-button variant=\"link\" onClick={this.massActionHandler}>\n {this.messages.action}\n </mg-button>\n </mg-tooltip>\n )}\n {this.expanded && this.getPageCount(this.checkboxes) > 1 && (\n <mg-pagination\n key=\"search-pagination\"\n totalPages={this.getPageCount(this.checkboxes)}\n currentPage={this.currentPage}\n onCurrent-page-change={this.handleCurrentPageChange}\n hideNavigationLabels={true}\n hidePageCount={true}\n identifier={`input-checkbox-pagination-${this.sectionKind}`}\n ></mg-pagination>\n )}\n </div>\n <div hidden={!this.expanded} id={itemsContainerId} class=\"mg-c-input__input-checkbox-multi-section-content\">\n <MgInputCheckboxList\n checkboxes={this.getArrayRange(this.checkboxes, from, to)}\n inputVerticalList={true}\n type={'multi'}\n displaySearchInput={true}\n messages={this.messages}\n id={`items-${this.sectionKind}`}\n disabled={this.disabled}\n name={this.name}\n invalid={this.invalid}\n ></MgInputCheckboxList>\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.conf.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mg-input-checkbox.conf.js","sourceRoot":"","sources":["../../../../../src/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.conf.ts"],"names":[],"mappings":"AAsBA;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,UAAU,EAAE,OAAO,CAAU,CAAC;AAO5D;;GAEG;AACH,MAAM,CAAN,IAAY,WAGX;AAHD,WAAY,WAAW;IACrB,oCAAqB,CAAA;IACrB,4CAA6B,CAAA;AAC/B,CAAC,EAHW,WAAW,KAAX,WAAW,QAGtB;AAED;;GAEG;AACH,MAAM,CAAN,IAAY,gBAGX;AAHD,WAAY,gBAAgB;IAC1B,qCAAiB,CAAA;IACjB,iCAAa,CAAA;AACf,CAAC,EAHW,gBAAgB,KAAhB,gBAAgB,QAG3B;~~AAwBD~~;;GAEG;AACH,MAAM,CAAN,IAAY,qBAIX;AAJD,WAAY,qBAAqB;IAC/B,4CAAmB,CAAA;IACnB,4CAAmB,CAAA;IACnB,gDAAuB,CAAA;AACzB,CAAC,EAJW,qBAAqB,KAArB,qBAAqB,QAIhC","sourcesContent":["/*\n interface CheckboxValue\n * use to match returned value\n /\nexport interface CheckboxValue {\n title: string;\n value: boolean \| null;\n disabled?: boolean;\n required?: boolean;\n}\n\n/\n interface CheckboxItem\n * use to match checkbox attributes\n /\nexport interface CheckboxItem extends CheckboxValue {\n _id: string;\n _handleInput: (event: InputEvent & { target: HTMLInputElement }) => void;\n _handleBlur: () => void;\n _handleKeydown: (event: KeyboardEvent & { target: HTMLElement }) => void;\n}\n\n/\n List of all availables checkbox type\n /\nexport const checkboxTypes = ['checkbox', 'multi'] as const;\n\n/\n ChecboxType from checkbox types\n /\nexport type CheckboxType = (typeof checkboxTypes)[number];\n\n/\n mg-input-checkbox-paginated section kind\n /\nexport enum SectionKind {\n SELECTED = 'selected',\n NOT_SELECTED = 'not-selected',\n}\n\n/\n mg-input-checkbox-paginated section title kind\n /\nexport enum SectionTitleKind {\n BUTTON = 'button',\n TEXT = 'text',\n}\n\n/\n Base mg-input-checkbox interface\n /\nexport interface IMgInputCheckboxBase {\n ~~readonly: boolean;\n~~ disabled: boolean;\n name: string;\n invalid: boolean;\n}\n\n/\n mg-input-checkbox-list interface\n /\nexport interface MgInputCheckboxListProps extends IMgInputCheckboxBase {\n inputVerticalList: boolean;\n type: CheckboxType;\n displaySearchInput: boolean;\n messages: Record<string, unknown>;\n checkboxes: CheckboxItem[];\n id: string;\n}\n\n/\n Define select values button key\n */\nexport enum SelectValuesButtonKey {\n EDIT = 'editButton',\n SHOW = 'showButton',\n SELECT = 'selectButton',\n}\n"]}
1	+ {"version":3,"file":"mg-input-checkbox.conf.js","sourceRoot":"","sources":["../../../../../src/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.conf.ts"],"names":[],"mappings":"AAsBA;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,UAAU,EAAE,OAAO,CAAU,CAAC;AAO5D;;GAEG;AACH,MAAM,CAAN,IAAY,WAGX;AAHD,WAAY,WAAW;IACrB,oCAAqB,CAAA;IACrB,4CAA6B,CAAA;AAC/B,CAAC,EAHW,WAAW,KAAX,WAAW,QAGtB;AAED;;GAEG;AACH,MAAM,CAAN,IAAY,gBAGX;AAHD,WAAY,gBAAgB;IAC1B,qCAAiB,CAAA;IACjB,iCAAa,CAAA;AACf,CAAC,EAHW,gBAAgB,KAAhB,gBAAgB,QAG3B;AAuBD;;GAEG;AACH,MAAM,CAAN,IAAY,qBAIX;AAJD,WAAY,qBAAqB;IAC/B,4CAAmB,CAAA;IACnB,4CAAmB,CAAA;IACnB,gDAAuB,CAAA;AACzB,CAAC,EAJW,qBAAqB,KAArB,qBAAqB,QAIhC","sourcesContent":["/*\n interface CheckboxValue\n * use to match returned value\n /\nexport interface CheckboxValue {\n title: string;\n value: boolean \| null;\n disabled?: boolean;\n required?: boolean;\n}\n\n/\n interface CheckboxItem\n * use to match checkbox attributes\n /\nexport interface CheckboxItem extends CheckboxValue {\n _id: string;\n _handleInput: (event: InputEvent & { target: HTMLInputElement }) => void;\n _handleBlur: () => void;\n _handleKeydown: (event: KeyboardEvent & { target: HTMLElement }) => void;\n}\n\n/\n List of all availables checkbox type\n /\nexport const checkboxTypes = ['checkbox', 'multi'] as const;\n\n/\n ChecboxType from checkbox types\n /\nexport type CheckboxType = (typeof checkboxTypes)[number];\n\n/\n mg-input-checkbox-paginated section kind\n /\nexport enum SectionKind {\n SELECTED = 'selected',\n NOT_SELECTED = 'not-selected',\n}\n\n/\n mg-input-checkbox-paginated section title kind\n /\nexport enum SectionTitleKind {\n BUTTON = 'button',\n TEXT = 'text',\n}\n\n/\n Base mg-input-checkbox interface\n /\nexport interface IMgInputCheckboxBase {\n disabled: boolean;\n name: string;\n invalid: boolean;\n}\n\n/\n mg-input-checkbox-list interface\n /\nexport interface MgInputCheckboxListProps extends IMgInputCheckboxBase {\n inputVerticalList: boolean;\n type: CheckboxType;\n displaySearchInput: boolean;\n messages: Record<string, unknown>;\n checkboxes: CheckboxItem[];\n id: string;\n}\n\n/\n Define select values button key\n */\nexport enum SelectValuesButtonKey {\n EDIT = 'editButton',\n SHOW = 'showButton',\n SELECT = 'selectButton',\n}\n"]}