@mgdis/mg-components 6.21.0 → 6.22.0

package/dist/collection/collection-manifest.json

@@ -3,7 +3,6 @@
     "components/atoms/mg-badge/mg-badge.js",
     "components/atoms/mg-button/mg-button.js",
     "components/atoms/mg-icon/mg-icon.js",
-    "components/molecules/menus/mg-menu/mg-menu.js",
     "components/molecules/internals/mg-item-more/mg-item-more.js",
     "components/molecules/menus/mg-menu-item/mg-menu-item.js",
     "components/atoms/internals/mg-character-left/mg-character-left.js",
@@ -27,8 +26,10 @@
     "components/molecules/inputs/mg-input-text/mg-input-text.js",
     "components/molecules/inputs/mg-input-textarea/mg-input-textarea.js",
     "components/molecules/inputs/mg-input-toggle/mg-input-toggle.js",
+    "components/molecules/menus/mg-menu/mg-menu.js",
     "components/molecules/mg-action-more/mg-action-more.js",
     "components/molecules/mg-alert/mg-alert.js",
+    "components/molecules/mg-breadcrumb/mg-breadcrumb.js",
     "components/molecules/mg-details/mg-details.js",
     "components/molecules/mg-fieldset/mg-fieldset.js",
     "components/molecules/mg-form/mg-form.js",

package/dist/collection/components/atoms/internals/mg-character-left/mg-character-left.js

@@ -37,7 +37,7 @@ export class MgCharacterLeft {
      * @returns HTML Element
      */
     render() {
-        return (h("span", { key: '22f23b636aaebc8857e4efa2fdb87a85977c59bf', id: this.identifier, "aria-live": "polite" }, h("span", { key: '55addb97bc00800b1ec644b0eff68e779a03528a', "aria-hidden": "true" }, this.maxlength - this.characters.length, "/", this.maxlength), h("span", { key: 'd5bd60b48b6a02cdaff4166f14e4ea6cf921f749', class: "mg-u-visually-hidden" }, this.messages.nbCharLeft.replace('{counter}', this.maxlength - this.characters.length))));
+        return (h("span", { key: '41b489eafc25e9fe2e32b54a72542090d79e1052', id: this.identifier, "aria-live": "polite" }, h("span", { key: 'c9dd3eb15ebc866333d4e911e1a560cac1c07ef7', "aria-hidden": "true" }, this.maxlength - this.characters.length, "/", this.maxlength), h("span", { key: '0e4664f577b8db68f0355fc92f9df251f945dedd', class: "mg-u-visually-hidden" }, this.messages.nbCharLeft.replace('{counter}', this.maxlength - this.characters.length))));
     }
     static get is() { return "mg-character-left"; }
     static get encapsulation() { return "scoped"; }

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

@@ -42,7 +42,7 @@ export class MgInputTitle {
     render() {
         const TagName = this.readonly ? 'span' : this.tagName;
         // \u00A0 represent a  
-        return (h(TagName, { key: '860f74509c87626d4af51641f0f48db99fa194b0', class: "mg-c-input-title", htmlFor: !this.isLegend && this.identifier, id: this.isLegend ? `${this.identifier}-title` : undefined }, h("slot", { key: '5eb0ca4d7f4061c0cff01e2de3adb9c98c42955a' }), this.required && !this.readonly && (h("span", { key: '0637de0d0dca9b7f87c9bb04fd44eadc6d0606cc', class: "mg-c-input-title__required" }, "\u00A0", h("span", { key: 'b5736467e3fd759eeabe9cf8ee6ed3cf73b8ebfc', class: "mg-u-is-asterisk" }, "*")))));
+        return (h(TagName, { key: 'd61ed048e1b2bb124281eb4067894d9a35abf778', class: "mg-c-input-title", htmlFor: !this.isLegend && this.identifier, id: this.isLegend ? `${this.identifier}-title` : undefined }, h("slot", { key: '3bad02b10f8e9bb536c5eba9bf85d4b4967a9d97' }), this.required && !this.readonly && (h("span", { key: 'f0fd90a79f4449a1a3b7ec76a3eeb96bcc2e4ee6', class: "mg-c-input-title__required" }, "\u00A0", h("span", { key: '7ea29cfc494c5c5c2b65b62ea27caee5a41062ca', class: "mg-u-is-asterisk" }, "*")))));
     }
     static get is() { return "mg-input-title"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/atoms/mg-card/mg-card.js

@@ -50,7 +50,7 @@ export class MgCard {
      * @returns HTML Element
      */
     render() {
-        return (h("div", { key: '6f83c5f7f9e0aacf502e407450cfdf039635a1f1', class: this.classCollection.join() }, h("slot", { key: '6bf8c02d3c3c9d0719e45af96b41f54289e31961' })));
+        return (h("div", { key: 'fe5eff1e1d7c533cd533e27d3fb070a4e57194a8', class: this.classCollection.join() }, h("slot", { key: 'ca27dc4039d7bcaa21284714b7820de257625009' })));
     }
     static get is() { return "mg-card"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/atoms/mg-divider/mg-divider.js

@@ -14,7 +14,7 @@ export class MgDivider {
      * @returns HTML Element
      */
     render() {
-        return (h("div", { key: '60b987cb329c6db14c2cc4a665e7f32b2696a3ee', class: {
+        return (h("div", { key: 'a1b0e3b95ed9f52febab9f8d50b4053d1c13f7fb', class: {
                 'mg-c-divider': true,
                 'mg-c-divider--full-width': this.fullWidth,
             } }));

package/dist/collection/components/atoms/mg-icon/mg-icon.js

@@ -28,7 +28,7 @@ export class MgIcon {
             svgContainer.innerHTML = icons[icon];
             this.element.shadowRoot.append(svgContainer.firstChild);
             svgContainer.remove();
-            // update svg attributes
+            // Update svg attributes
             this.svg = this.element.shadowRoot.querySelector('svg');
             this.svg.setAttribute('aria-hidden', 'true');
             this.svg.setAttribute('focusable', 'false');
@@ -144,7 +144,7 @@ export class MgIcon {
                 "mutable": false,
                 "complexType": {
                     "original": "IconType",
-                    "resolved": "\"address-card\" | \"address-card-outline\" | \"align-center\" | \"align-justify\" | \"align-left\" | \"align-right\" | \"api\" | \"archive\" | \"archive-outline\" | \"arrow-clock\" | \"arrow-down\" | \"arrow-down-a-z\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-right\" | \"arrow-rotate\" | \"arrow-rotate-backward\" | \"arrow-up\" | \"arrow-up-right\" | \"arrow-up-right-square\" | \"arrow-up-z-a\" | \"arrows-compare\" | \"arrows-right-down\" | \"arrows-right-left\" | \"arrows-rotate\" | \"arrows-rotate-backward\" | \"arrows-up-down\" | \"ban\" | \"bell\" | \"bell-outline\" | \"book\" | \"book-outline\" | \"briefcase\" | \"briefcase-outline\" | \"building\" | \"building-outline\" | \"calculator\" | \"calculator-outline\" | \"calendar\" | \"calendar-euro\" | \"calendar-euro-outline\" | \"calendar-outline\" | \"check\" | \"check-circle\" | \"check-circle-outline\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"clock\" | \"clock-outline\" | \"code-square-outline\" | \"cog\" | \"cog-outline\" | \"comment\" | \"comment-exclamation\" | \"comment-exclamation-outline\" | \"comment-outline\" | \"comment-question\" | \"comment-question-outline\" | \"comment-sms\" | \"comment-sms-outline\" | \"conversation\" | \"conversation-outline\" | \"copy\" | \"copy-file\" | \"copy-file-outline\" | \"copy-outline\" | \"credit-card\" | \"cross\" | \"cross-circle\" | \"cross-circle-outline\" | \"dashboard\" | \"dashboard-outline\" | \"download\" | \"earth\" | \"earth-outline\" | \"ellipsis\" | \"ellipsis-vertical\" | \"euro\" | \"euro-circle\" | \"exclamation-circle\" | \"exclamation-circle-outline\" | \"exclamation-stamp\" | \"exclamation-triangle\" | \"exclamation-triangle-outline\" | \"eye\" | \"eye-outline\" | \"eye-slash\" | \"eye-slash-outline\" | \"fax\" | \"fax-outline\" | \"file\" | \"file-cog\" | \"file-cog-outline\" | \"file-download\" | \"file-download-outline\" | \"file-excel\" | \"file-excel-outline\" | \"file-outline\" | \"file-pdf\" | \"file-pdf-outline\" | \"file-text\" | \"file-text-outline\" | \"file-upload\" | \"file-upload-outline\" | \"file-word\" | \"file-word-outline\" | \"filter\" | \"filter-outline\" | \"floppy-disk\" | \"floppy-disk-checked\" | \"floppy-disk-checked-outline\" | \"floppy-disk-outline\" | \"folder\" | \"folder-check\" | \"folder-check-outline\" | \"folder-lines\" | \"folder-lines-outline\" | \"folder-link\" | \"folder-link-outline\" | \"folder-outline\" | \"folder-star\" | \"folder-star-outline\" | \"folders\" | \"folders-outline\" | \"gavel\" | \"gavel-outline\" | \"graduation-cap\" | \"graduation-cap-outline\" | \"hand-euro\" | \"hand-euro-outline\" | \"hand-up\" | \"history\" | \"home\" | \"home-outline\" | \"info-circle\" | \"info-circle-outline\" | \"interrogation-circle\" | \"interrogation-circle-outline\" | \"key\" | \"laptop\" | \"layers\" | \"life-ring\" | \"lines-rectangle\" | \"lines-rectangle-outline\" | \"link\" | \"list\" | \"loader\" | \"location\" | \"location-outline\" | \"lock\" | \"lock-outline\" | \"log-in\" | \"log-out\" | \"magnifying-glass\" | \"mail\" | \"mail-open\" | \"mail-open-outline\" | \"mail-outline\" | \"messages-square\" | \"messages-square-outline\" | \"mobile\" | \"mobile-outline\" | \"notes\" | \"notes-outline\" | \"paper-plane\" | \"paper-plane-outline\" | \"paper-plane-slash\" | \"paper-plane-slash-outline\" | \"paperclip\" | \"pen\" | \"pen-circle\" | \"pen-fancy\" | \"pen-fancy-files-outline\" | \"pen-fancy-outline\" | \"pen-outline\" | \"phone\" | \"phone-outline\" | \"picture\" | \"picture-outline\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-outline\" | \"share\" | \"share-outline\" | \"shuffle\" | \"sidebar-arrow-left\" | \"sidebar-arrow-right\" | \"sitemap\" | \"sliders\" | \"sliders-outline\" | \"squares\" | \"star\" | \"star-outline\" | \"table\" | \"tag\" | \"tag-outline\" | \"tags\" | \"tags-outline\" | \"thumb-down\" | \"thumb-down-outline\" | \"thumb-up\" | \"thumb-up-outline\" | \"thumbtack\" | \"thumbtack-outline\" | \"trash\" | \"trash-outline\" | \"universal-access\" | \"universal-access-outline\" | \"unlink\" | \"unlock\" | \"unlock-outline\" | \"upload\" | \"user\" | \"user-circle\" | \"user-group\" | \"user-group-outline\" | \"user-lock\" | \"user-outline\" | \"user-pen-fancy-outline\" | \"user-plus\" | \"user-question-outline\" | \"user-shield\" | \"user-shield-outline\" | \"users\" | \"users-outline\" | \"wallet\" | \"wallet-outline\"",
+                    "resolved": "\"address-card\" | \"address-card-outline\" | \"align-center\" | \"align-justify\" | \"align-left\" | \"align-right\" | \"api\" | \"archive\" | \"archive-outline\" | \"arrow-clock\" | \"arrow-down\" | \"arrow-down-a-z\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-right\" | \"arrow-rotate\" | \"arrow-rotate-backward\" | \"arrow-up\" | \"arrow-up-right\" | \"arrow-up-right-square\" | \"arrow-up-z-a\" | \"arrows-compare\" | \"arrows-right-down\" | \"arrows-right-left\" | \"arrows-rotate\" | \"arrows-rotate-backward\" | \"arrows-up-down\" | \"ban\" | \"bell\" | \"bell-outline\" | \"book\" | \"book-outline\" | \"briefcase\" | \"briefcase-outline\" | \"building\" | \"building-outline\" | \"calculator\" | \"calculator-outline\" | \"calendar\" | \"calendar-euro\" | \"calendar-euro-outline\" | \"calendar-outline\" | \"check\" | \"check-circle\" | \"check-circle-outline\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"clock\" | \"clock-outline\" | \"code-square-outline\" | \"cog\" | \"cog-outline\" | \"comment\" | \"comment-exclamation\" | \"comment-exclamation-outline\" | \"comment-outline\" | \"comment-question\" | \"comment-question-outline\" | \"comment-sms\" | \"comment-sms-outline\" | \"conversation\" | \"conversation-outline\" | \"copy\" | \"copy-file\" | \"copy-file-outline\" | \"copy-outline\" | \"credit-card\" | \"cross\" | \"cross-circle\" | \"cross-circle-outline\" | \"dashboard\" | \"dashboard-outline\" | \"download\" | \"earth\" | \"earth-outline\" | \"ellipsis\" | \"ellipsis-vertical\" | \"euro\" | \"euro-circle\" | \"exclamation-circle\" | \"exclamation-circle-outline\" | \"exclamation-stamp\" | \"exclamation-triangle\" | \"exclamation-triangle-outline\" | \"eye\" | \"eye-outline\" | \"eye-slash\" | \"eye-slash-outline\" | \"fax\" | \"fax-outline\" | \"file\" | \"file-cog\" | \"file-cog-outline\" | \"file-download\" | \"file-download-outline\" | \"file-excel\" | \"file-excel-outline\" | \"file-outline\" | \"file-pdf\" | \"file-pdf-outline\" | \"file-text\" | \"file-text-outline\" | \"file-upload\" | \"file-upload-outline\" | \"file-word\" | \"file-word-outline\" | \"filter\" | \"filter-outline\" | \"floppy-disk\" | \"floppy-disk-checked\" | \"floppy-disk-checked-outline\" | \"floppy-disk-outline\" | \"folder\" | \"folder-check\" | \"folder-check-outline\" | \"folder-lines\" | \"folder-lines-outline\" | \"folder-link\" | \"folder-link-outline\" | \"folder-outline\" | \"folder-star\" | \"folder-star-outline\" | \"folders\" | \"folders-outline\" | \"gavel\" | \"gavel-outline\" | \"graduation-cap\" | \"graduation-cap-outline\" | \"hand-euro\" | \"hand-euro-outline\" | \"hand-up\" | \"history\" | \"home\" | \"home-outline\" | \"info-circle\" | \"info-circle-outline\" | \"interrogation-circle\" | \"interrogation-circle-outline\" | \"key\" | \"laptop\" | \"layers\" | \"life-ring\" | \"lines-rectangle\" | \"lines-rectangle-outline\" | \"link\" | \"list\" | \"loader\" | \"location\" | \"location-outline\" | \"lock\" | \"lock-outline\" | \"log-in\" | \"log-out\" | \"magnifying-glass\" | \"mail\" | \"mail-open\" | \"mail-open-outline\" | \"mail-outline\" | \"messages-square\" | \"messages-square-outline\" | \"mobile\" | \"mobile-outline\" | \"notes\" | \"notes-outline\" | \"paper-plane\" | \"paper-plane-outline\" | \"paper-plane-slash\" | \"paper-plane-slash-outline\" | \"paperclip\" | \"pause\" | \"pause-outline\" | \"pen\" | \"pen-circle\" | \"pen-fancy\" | \"pen-fancy-files-outline\" | \"pen-fancy-outline\" | \"pen-outline\" | \"phone\" | \"phone-outline\" | \"picture\" | \"picture-outline\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-outline\" | \"share\" | \"share-outline\" | \"shuffle\" | \"sidebar-arrow-left\" | \"sidebar-arrow-right\" | \"sitemap\" | \"sliders\" | \"sliders-outline\" | \"squares\" | \"star\" | \"star-outline\" | \"table\" | \"tag\" | \"tag-outline\" | \"tags\" | \"tags-outline\" | \"thumb-down\" | \"thumb-down-outline\" | \"thumb-up\" | \"thumb-up-outline\" | \"thumbtack\" | \"thumbtack-outline\" | \"trash\" | \"trash-outline\" | \"universal-access\" | \"universal-access-outline\" | \"unlink\" | \"unlock\" | \"unlock-outline\" | \"upload\" | \"user\" | \"user-circle\" | \"user-group\" | \"user-group-outline\" | \"user-lock\" | \"user-outline\" | \"user-pen-fancy-outline\" | \"user-plus\" | \"user-question-outline\" | \"user-shield\" | \"user-shield-outline\" | \"users\" | \"users-outline\" | \"wallet\" | \"wallet-outline\"",
                     "references": {
                         "IconType": {
                             "location": "import",

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

@@ -84,7 +84,7 @@ export class MgTag {
      * @returns HTML Element
      */
     render() {
-        return (h("span", { key: '8edd72c80d7179fdb5c1c37caeaecb54c086df8c', class: this.classCollection.join() }, h("slot", { key: 'e6bf4574a943f83856a6a61cba480d54ff153cb3' })));
+        return (h("span", { key: '3604851191691e002f8f7a701e37abe0059238e3', class: this.classCollection.join() }, h("slot", { key: 'c51e18e61908772878f380d1ae798e5e5f43ca02' })));
     }
     static get is() { return "mg-tag"; }
     static get encapsulation() { return "shadow"; }

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

@@ -11,7 +11,7 @@ export class MgTooltipContent {
      * @returns HTML Element
      */
     render() {
-        return (h(Host, { key: '2221de3ca0ef7c9d6e46e24b19c69007fababf81', role: "tooltip" }, h("span", { key: '9e14f7f5b3f5e5060ed9f42e8d7259b17575168e', innerHTML: this.message, class: "mg-tooltip-content__message" }), h("slot", { key: 'bc083567d77e8f4ffccee98b96036ba8ac494fb6', name: "arrow" })));
+        return (h(Host, { key: 'efe7a2b2622713929caf9a2e114e7a1267643f5e', role: "tooltip" }, h("span", { key: '00f0066cfa058e55a88533f8b6daaa8ab283b29c', innerHTML: this.message, class: "mg-tooltip-content__message" }), h("slot", { key: 'fd952c4db7b77b54591bf2c58012096579de45c2', name: "arrow" })));
     }
     static get is() { return "mg-tooltip-content"; }
     static get encapsulation() { return "shadow"; }

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

@@ -364,7 +364,7 @@ export class MgTooltip {
      * @returns HTML Element
      */
     render() {
-        return (h(Host, { key: '1f5ee653d58185c2ab15b213ad323adaabca605f' }, h("slot", { key: 'd0c615db4429e84a295d01269c268f9239da85c5' }), h("slot", { key: 'e6c6deb2f94ab883da2a62fa53cb299f5ec83a06', name: "content" })));
+        return (h(Host, { key: '8d1a0690f0b44381de181c2ea1f9e4c883a1af57' }, h("slot", { key: 'ae45df312e6a251a72b8ace11eb154c5ad13b4ae' }), h("slot", { key: 'fdbb17e42291cd785ff188df14029bcd59ba4c13', name: "content" })));
     }
     static get is() { return "mg-tooltip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/molecules/inputs/mg-input/mg-input.js

@@ -339,7 +339,7 @@ export class MgInput {
      */
     render() {
         const isGroup = this.isFieldset && !this.isReadonly;
-        return (h(Host, { key: 'fbab18280a709407c83f324127e8de6cbb05fe7c', class: this.element.classList.toString(), role: isGroup ? 'group' : undefined, "aria-labelledby": isGroup ? `${this.identifier}-title` : undefined }, h("div", { key: 'ac0924c244b9fa87d02e659a5710ee93d12a202f', class: { 'mg-c-input__title': true, 'mg-u-visually-hidden': this.labelHide } }, h("slot", { key: 'c825af33ba0a6c209d02d6487422347f7d8acfed', name: this.slotLabel }), this.tooltip && (this.tooltipPosition === 'label' || this.labelOnTop) && !this.labelHide && this.renderTooltip()), h("div", { key: '805e1eedfdea132f3ea4fd11da761810a3d7c939', class: "mg-c-input__input-container" }, this.inputContainerElements())));
+        return (h(Host, { key: 'a1db280d19eead30e7ae27eb6e395e58b35baa63', class: this.element.classList.toString(), role: isGroup ? 'group' : undefined, "aria-labelledby": isGroup ? `${this.identifier}-title` : undefined }, h("div", { key: '282f5776a9269272507f3e00f5dce690c9a604f4', class: { 'mg-c-input__title': true, 'mg-u-visually-hidden': this.labelHide } }, h("slot", { key: 'b122979a159912d9c34bb024021257f9f88e6ff4', name: this.slotLabel }), this.tooltip && (this.tooltipPosition === 'label' || this.labelOnTop) && !this.labelHide && this.renderTooltip()), h("div", { key: '098d3a7329fa0b5f37534fdf2df89e0468dcbe2a', class: "mg-c-input__input-container" }, this.inputContainerElements())));
     }
     static get is() { return "mg-input"; }
     static get encapsulation() { return "shadow"; }

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

@@ -4,7 +4,7 @@ import { h } from "@stencil/core";
  * @param props - MgInputCheckboxList Interface Props
  * @returns input template
  */
-export const MgInputCheckboxList = (props) => (h("ul", { class: "mg-c-input__input-group-container", role: "list", "aria-labelledby": props.labelledby, id: props.id }, props.checkboxes.map(input => {
+export const MgInputCheckboxList = (props) => (h("div", { class: "mg-c-input__input-group-container", "aria-labelledby": props.labelledby, 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.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("div", { 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)));
 })));

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

@@ -76,7 +76,7 @@ export class MgInputCheckboxPaginated {
     render() {
         const listId = formatID(this.messages.label);
         const tabId = 'tab-info';
-        return (h(Host, { key: '233ab4fca3f4a3121bc60650ac2f8ae06d47e6e5' }, h("slot", { key: '7d1af8c712928c06953743fc5c182e51d9a6256b', name: "header-action" }), h("div", { key: '95641bd218e36422a6b5b4ead8dd5498e8ac5fa4', class: "mg-c-input__tabs-content" }, h("p", { key: '34814dd1afc9f871cd032500b931e692d63cbd25', id: tabId, class: { 'mg-c-input__popover-info': true, 'mg-u-visually-hidden': this.items.length !== 0 }, "aria-live": this.items.length !== 0 ? 'polite' : undefined }, this.items.length === 0 ? this.messages.noValue : this.messages.values.replace('{count}', this.items.length.toString())), this.items.length > 0 && (h(MgInputCheckboxList, { key: '621077f291a401737157ad0cd9b9348537ef8bdc', checkboxes: this.items, labelledby: tabId, id: listId, disabled: this.disabled, name: this.name, invalid: this.invalid })), this.hasNext() && (h("mg-button", { key: "load-more", variant: "flat", class: "mg-c-input__load-more", tabIndex: -1, "full-width": true, onClick: this.handleLoadMore, "aria-controls": listId }, h("mg-icon", { key: 'cb00bbeb1575475b184cc9623db6c4cefc56c26a', icon: "chevron-down" }), this.messages.showMore)))));
+        return (h(Host, { key: 'ce0fe4a842cc21f7f981b6a9286d592c2c28819b' }, h("slot", { key: '683c26f98e76262c565613529c76e7f3b27efbc5', name: "header-action" }), h("div", { key: 'eb9e9bfa54a467b44f4e90a8575ae8b1fe40ea10', class: "mg-c-input__tabs-content" }, h("p", { key: '6eeb40f89a0cc0b8ea0837f44babe8cd440ced0f', id: tabId, class: { 'mg-c-input__popover-info': true, 'mg-u-visually-hidden': this.items.length !== 0 }, "aria-live": this.items.length !== 0 ? 'polite' : undefined }, this.items.length === 0 ? this.messages.noValue : this.messages.values.replace('{count}', this.items.length.toString())), this.items.length > 0 && (h(MgInputCheckboxList, { key: '1625b0bdbb1de6ef0c55850e3a08a2cf322da317', checkboxes: this.items, labelledby: tabId, id: listId, disabled: this.disabled, name: this.name, invalid: this.invalid })), this.hasNext() && (h("mg-button", { key: "load-more", variant: "flat", class: "mg-c-input__load-more", tabIndex: -1, "full-width": true, onClick: this.handleLoadMore, "aria-controls": listId }, h("mg-icon", { key: '8f10cc6152899cf869023ff1c465763e9a05d7b6', icon: "chevron-down" }), this.messages.showMore)))));
     }
     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.js

@@ -578,7 +578,7 @@ export class MgInputCheckbox {
         else {
             inputContent = this.renderCheckboxMulti();
         }
-        return (h("mg-input", { key: '5addea288b5c87fec33a56449d14f861aefd465d', label: this.label, identifier: this.identifier, class: this.classCollection.join(), labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: !this.readonly ? this.required : undefined, tooltip: this.tooltip, tooltipPosition: this.readonly && readonlyValue.length === 0 ? 'label' : this.tooltipPosition, helpText: !this.readonly ? this.helpText : undefined, errorMessage: !this.readonly ? this.errorMessage : undefined }, inputContent));
+        return (h("mg-input", { key: 'c5797a119a653c27004a171b7b79be7d4504800d', label: this.label, identifier: this.identifier, class: this.classCollection.join(), labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: !this.readonly ? this.required : undefined, tooltip: this.tooltip, tooltipPosition: this.readonly && readonlyValue.length === 0 ? 'label' : this.tooltipPosition, helpText: !this.readonly ? this.helpText : undefined, errorMessage: !this.readonly ? this.errorMessage : undefined }, inputContent));
     }
     static get is() { return "mg-input-checkbox"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/molecules/inputs/mg-input-combobox/mg-input-combobox.js

@@ -758,7 +758,7 @@ export class MgInputCombobox {
         else {
             activeDescendant = (_e = this.value) === null || _e === void 0 ? void 0 : _e.value;
         }
-        return (h("mg-input", { key: 'ee8222484fa6546a422eb724fdea67402644c0cc', label: this.label, identifier: this.identifier, class: this.classCollection.classes.join(' '), ariaDescribedbyIDs: popoverContent && popoverContent !== 'list' ? popoverContent : undefined, labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === undefined ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly ? (readonlyValue && h("b", { class: "mg-c-input__readonly-value" }, readonlyValue)) : (h("mg-popover", { identifier: this.popoverId, placement: "bottom-start", display: this.popoverDisplay, "arrow-hide": true, style: {
+        return (h("mg-input", { key: 'd16350f2e21e492932e7264c076454a249e1f5f2', label: this.label, identifier: this.identifier, class: this.classCollection.classes.join(' '), ariaDescribedbyIDs: popoverContent && popoverContent !== 'list' ? popoverContent : undefined, labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === undefined ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly ? (readonlyValue && h("b", { class: "mg-c-input__readonly-value" }, readonlyValue)) : (h("mg-popover", { identifier: this.popoverId, placement: "bottom-start", display: this.popoverDisplay, "arrow-hide": true, style: {
                 '--mg-c-input-list-width': ((_f = this.input) === null || _f === void 0 ? void 0 : _f.offsetWidth) > 0 ? `${this.input.offsetWidth}px` : undefined,
             }, "data-fallback-placement": "bottom-end", "onDisplay-change": this.handlePopoverDisplay }, h("div", { class: "mg-c-input__input-group-container" }, h("mg-icon", { icon: "magnifying-glass" }), h("input", { type: "text", role: "combobox", class: "mg-c-input__box mg-c-input__box--width", value: this.filter, id: this.identifier, name: this.name, placeholder: this.placeholder, title: this.placeholder, disabled: this.disabled, required: this.required, autocomplete: "off", "aria-autocomplete": "list", "aria-expanded": this.popoverDisplay.toString(), "aria-controls": listId, "aria-invalid": (this.invalid === true).toString(), "aria-activedescendant": formatID(activeDescendant), onInput: this.handleFilterInput, onBlur: this.handleFilterBlur, onFocus: this.handleFilterFocus, onKeyDown: this.handleFilterKeydown, ref: (el) => {
                 if (el !== null)

package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.js

@@ -357,7 +357,7 @@ export class MgInputDate {
      * @returns HTML Element
      */
     render() {
-        return (h("mg-input", { key: '1428f0f9f11d829ec8d3ed507c8690d63839ff17', label: this.label, identifier: this.identifier, class: this.classCollection.join(), labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === null ? 'label' : this.tooltipPosition, helpText: this.formatHelpText(this.helpText), errorMessage: this.errorMessage }, this.readonly ? (this.value && h("b", { class: "mg-c-input__readonly-value" }, localeDate(this.value, this.locale))) : (h("input", { type: "date", class: "mg-c-input__box", min: this.min, max: this.max, value: this.value, id: this.identifier, name: this.name, disabled: this.disabled, required: this.required, "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, ref: (el) => {
+        return (h("mg-input", { key: '53d23a27355884d3b3ac996188f619ad325d58b6', label: this.label, identifier: this.identifier, class: this.classCollection.join(), labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === null ? 'label' : this.tooltipPosition, helpText: this.formatHelpText(this.helpText), errorMessage: this.errorMessage }, this.readonly ? (this.value && h("b", { class: "mg-c-input__readonly-value" }, localeDate(this.value, this.locale))) : (h("input", { type: "date", class: "mg-c-input__box", min: this.min, max: this.max, value: this.value, id: this.identifier, name: this.name, disabled: this.disabled, required: this.required, "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, ref: (el) => {
                 if (el !== null)
                     this.input = el;
             } }))));

package/dist/collection/components/molecules/inputs/mg-input-file/mg-input-file.js

@@ -332,9 +332,9 @@ export class MgInputFile {
      * @returns HTML Element
      */
     render() {
-        return (h("mg-input", { key: '3bcbf416c083d857aac2ad556bb2a218fe9ef82f', label: this.label, identifier: this.identifier, class: this.classCollection.join(), labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, h("div", { key: '88fafc6fd4a84c05a545c0083193e2ee0db54bfb', class: "mg-c-input__file-container" }, h("input", { key: 'ad1d14bc95390d5db56191ebff0d092ed5478183', name: this.name, id: this.identifier, class: "mg-u-visually-hidden", type: "file", multiple: this.multiple === true, capture: this.capture, accept: this.accept, disabled: this.disabled, required: this.files.length === 0 && this.required, onFocus: this.handleInputFocus, onBlur: this.handleInputBlur, onChange: this.handleInputChange, "aria-invalid": (this.invalid === true).toString(), ref: (el) => {
+        return (h("mg-input", { key: '48337d8e0a059dbea60c4bfa152468429b37b897', label: this.label, identifier: this.identifier, class: this.classCollection.join(), labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, h("div", { key: 'b0a67412ce2a054ce84f001efe01156bfce001a1', class: "mg-c-input__file-container" }, h("input", { key: '0585b37ac4da8e5b29b94c04a298cfd8451016c9', name: this.name, id: this.identifier, class: "mg-u-visually-hidden", type: "file", multiple: this.multiple === true, capture: this.capture, accept: this.accept, disabled: this.disabled, required: this.files.length === 0 && this.required, onFocus: this.handleInputFocus, onBlur: this.handleInputBlur, onChange: this.handleInputChange, "aria-invalid": (this.invalid === true).toString(), ref: (el) => {
                 this.inputElement = el;
-            } }), h("mg-button", { key: 'ace59bb90e27f924ce85e96abd277e752c75b6b8', variant: "secondary", class: "mg-c-input__file-button", type: "button", disabled: this.disabled, onClick: this.handleButtonClick, onBlur: this.handleButtonBlur, tabindex: "-1", ref: (el) => {
+            } }), h("mg-button", { key: '0c71ea34375f60a357ad2aa38353c7acafc1091a', variant: "secondary", class: "mg-c-input__file-button", type: "button", disabled: this.disabled, onClick: this.handleButtonClick, onBlur: this.handleButtonBlur, tabindex: "-1", ref: (el) => {
                 this.fileButtonElement = el;
             } }, this.messages.input.file.browse), this.renderFiles())));
     }

package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.js

@@ -460,7 +460,7 @@ export class MgInputNumeric {
      * @returns HTML Element
      */
     render() {
-        return (h("mg-input", { key: 'b158c0ec7f43ee02bbdbb275c169876fcdff92ac', label: this.label, identifier: this.identifier, class: this.classCollection.join(), labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === undefined ? 'label' : this.tooltipPosition, helpText: this.formatHelpText(this.helpText), errorMessage: this.errorMessage }, this.readonly
+        return (h("mg-input", { key: '4529f67fe43372530d723e8e8a7a6c44f5057bbd', label: this.label, identifier: this.identifier, class: this.classCollection.join(), labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === undefined ? 'label' : this.tooltipPosition, helpText: this.formatHelpText(this.helpText), errorMessage: this.errorMessage }, this.readonly
             ? this.readonlyValue && this.renderReadonly()
             : [
                 h("input", { key: "input", type: "text", class: "mg-c-input__box mg-c-input__box--width", value: this.displayValue(), id: this.identifier, name: this.name, placeholder: this.placeholder, title: this.placeholder, disabled: this.disabled, required: this.required, autocomplete: "off", "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, ref: (el) => {

package/dist/collection/components/molecules/inputs/mg-input-password/mg-input-password.js

@@ -248,10 +248,10 @@ export class MgInputPassword {
      * @returns HTML Element
      */
     render() {
-        return (h("mg-input", { key: '403d92641197b3ad397a0db527944dba4137f83a', label: this.label, identifier: this.identifier, class: this.classCollection.join(), labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === undefined ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly ? (this.value !== undefined && h("b", { class: "mg-c-input__readonly-value" }, '•'.repeat(this.value.length))) : (h("span", { class: "mg-c-input__input-group" }, h("input", { type: this.displayPassword ? 'text' : 'password', class: "mg-c-input__box mg-c-input__box--width", value: this.value, id: this.identifier, name: this.name, placeholder: this.placeholder, title: this.placeholder, disabled: this.disabled, required: this.required, maxlength: this.maxlength, "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onBlur: this.handleBlur, ref: (el) => {
+        return (h("mg-input", { key: '7154d79c2c609f47ae7c9542cffd1c92d26ce383', label: this.label, identifier: this.identifier, class: this.classCollection.join(), labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === undefined ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly ? (this.value !== undefined && h("b", { class: "mg-c-input__readonly-value" }, '•'.repeat(this.value.length))) : (h("span", { class: "mg-c-input__input-group" }, h("input", { type: this.displayPassword ? 'text' : 'password', class: "mg-c-input__box mg-c-input__box--width", value: this.value, id: this.identifier, name: this.name, placeholder: this.placeholder, title: this.placeholder, disabled: this.disabled, required: this.required, maxlength: this.maxlength, "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onBlur: this.handleBlur, ref: (el) => {
                 if (el !== null)
                     this.input = el;
-            } }), h("mg-button", { label: this.messages.input.password[this.displayPassword ? 'hide' : 'display'], disabled: this.disabled, variant: "flat", class: "mg-c-input__append-button", "is-icon": true, onClick: this.toggleDisplayPassword, "aria-controls": this.identifier }, h("mg-icon", { class: "mg-c-input__input-icon", icon: this.displayPassword ? 'eye-slash' : 'eye' }))))));
+            } }), h("mg-button", { label: this.messages.input.password[this.displayPassword ? 'hide' : 'display'], disabled: this.disabled, variant: "flat", class: "mg-c-input__append-button", "is-icon": true, onClick: this.toggleDisplayPassword, "aria-controls": this.identifier }, h("mg-icon", { class: "mg-c-input__input-icon", icon: (this.displayPassword ? 'eye-slash' : 'eye') }))))));
     }
     static get is() { return "mg-input-password"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/molecules/inputs/mg-input-radio/mg-input-radio.js

@@ -284,7 +284,7 @@ export class MgInputRadio {
      * @returns HTML Element
      */
     render() {
-        return (h("mg-input", { key: '8d26edd50d44fbba4fee5fa6ef36aa3c455b1e5b', label: this.label, identifier: this.identifier, class: this.classCollection.join(), labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && !this.value ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly ? (this.readonlyValue && h("b", { class: "mg-c-input__readonly-value" }, this.readonlyValue)) : (h("ul", { class: "mg-c-input__input-group-container", role: "list" }, this.options.map((input, index) => (h("li", { key: input.title, class: { 'mg-c-input__input-group': true, 'mg-c-input__input-group--disabled': this.disabled || input.disabled } }, h("input", { type: "radio", id: this.identifier + '_' + index, name: this.identifier, value: index, checked: JSON.stringify(this.value) === JSON.stringify(this.options[index].value), disabled: this.disabled || input.disabled, required: this.required, onBlur: this.handleBlur, onInput: this.handleInput, ref: (el) => {
+        return (h("mg-input", { key: 'bdeb5a98bc7f4567beb293c1fcf4f99169089fa6', label: this.label, identifier: this.identifier, class: this.classCollection.join(), labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && !this.value ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly ? (this.readonlyValue && h("b", { class: "mg-c-input__readonly-value" }, this.readonlyValue)) : (h("div", { class: "mg-c-input__input-group-container" }, this.options.map((input, index) => (h("div", { key: input.title, class: { 'mg-c-input__input-group': true, 'mg-c-input__input-group--disabled': this.disabled || input.disabled } }, h("input", { type: "radio", id: this.identifier + '_' + index, name: this.identifier, value: index, checked: JSON.stringify(this.value) === JSON.stringify(this.options[index].value), disabled: this.disabled || input.disabled, required: this.required, onBlur: this.handleBlur, onInput: this.handleInput, ref: (el) => {
                 if (el !== null)
                     this.inputs[index] = el;
             } }), h("label", { htmlFor: this.identifier + '_' + index }, input.title))))))));

package/dist/collection/components/molecules/inputs/mg-input-rich-text-editor/editor/custom-properties.scss

@@ -0,0 +1,212 @@
+:host {
+  /**
+   * Colors - Base
+   */
+  --jd-color-white: rgb(255 255 255);
+  --jd-color-dark: rgb(76 76 76);
+  --jd-color-default: var(--jd-color-dark);
+  --jd-color-gray: rgb(218 218 218);
+  --jd-color-gray-dark: rgb(165 165 165);
+  --jd-color-red: rgb(255 59 59);
+  --jd-color-blue: rgb(181 214 253);
+  --jd-color-light-blue: rgb(181 214 253 / 50%);
+  --jd-color-light-red: rgb(255 59 59 / 40%);
+  --jd-color-error: var(--jd-color-red);
+
+  /**
+   * Colors - Background
+   */
+  --jd-color-background-default: var(--jd-color-white);
+  --jd-color-background-light-gray: rgb(245 245 246);
+  --jd-color-background-gray: var(--jd-color-gray);
+  --jd-color-background-gray-hover: rgb(248 248 248);
+  --jd-color-background-active: rgb(33 150 243);
+  --jd-color-background-button-hover: rgb(236 235 233);
+  --jd-color-background-button-hover-opacity30: rgb(234 234 234 / 30%);
+  --jd-color-background-button-hover-opacity40: rgb(219 219 219 / 40%);
+  --jd-color-background-button-hover-opacity60: rgb(219 219 219 / 60%);
+  --jd-color-background-filebrowser-folders: rgb(248 249 250);
+  --jd-color-background-progress: rgb(185 31 31);
+  --jd-color-background-selection: rgb(181 214 253);
+  --jd-color-background-selection-opacity50: rgb(181 214 253 / 99.5%);
+  --jd-color-panel: rgb(249 249 249);
+  --jd-color-source-area: rgb(50 50 50);
+  --jd-info-background: rgb(233 233 233);
+
+  /**
+   * Colors - Border
+   */
+  --jd-color-border: var(--jd-color-gray);
+  --jd-color-border-dark: var(--jd-color-dark);
+  --jd-color-border-active: rgb(181 181 181);
+  --jd-color-border-selected: rgb(30 136 229);
+  --jd-color-separator: var(--jd-color-border);
+  --jd-color-resizer: rgb(200 200 200);
+
+  /**
+   * Colors - Text
+   */
+  --jd-color-text: rgb(34 34 34);
+  --jd-color-text-icons: rgb(0 0 0 / 75%);
+  --jd-color-text-selection: var(--jd-color-white);
+  --jd-color-icon: var(--jd-color-dark);
+  --jd-color-label: var(--jd-color-gray-dark);
+  --jd-color-placeholder: var(--jd-color-gray-dark);
+  --jd-color-folder-title: rgb(177 177 177);
+  --jd-color-selection: var(--jd-color-dark);
+
+  /**
+   * Colors - Button
+   */
+  --jd-color-button-background-hover: rgb(220 220 220);
+  --jd-color-button-background-hover-opacity40: rgb(219 219 219 / 40%);
+  --jd-color-button-background-hover-opacity60: rgb(219 219 219 / 60%);
+
+  /**
+   * Colors - Selection
+   */
+  --jd-color-selection-area: rgb(189 189 189);
+  --jd-color-table-cell-background-hover: rgb(0 0 0 / 5%);
+
+  /**
+   * Colors - Dark mode
+   */
+  --jd-dark-background-color: rgb(87 87 87);
+  --jd-dark-background-darknes: rgb(53 53 53);
+  --jd-dark-background-ligher: rgb(192 192 192);
+  --jd-dark-border-color: rgb(68 68 68);
+  --jd-dark-color-border-selected: rgb(21 47 95);
+  --jd-dark-icon-color: rgb(192 192 192);
+  --jd-dark-text-color: rgb(209 204 204);
+  --jd-dark-text-color-opacity50: rgb(206 206 206 / 50%);
+  --jd-dark-text-color-opacity80: rgb(206 206 206 / 80%);
+  --jd-dark-toolbar-color: rgb(95 92 92);
+  --jd-dark-toolbar-seperator-color1: rgb(81 81 81 / 41%);
+  --jd-dark-toolbar-seperator-color2: rgb(104 103 103);
+  --jd-dark-toolbar-seperator-color3: rgb(105 105 105 / 75%);
+  --jd-dark-toolbar-seperator-color-opacity80: rgb(105 105 105 / 80%);
+
+  /**
+   * Colors - Special
+   */
+  --jd-color-picker-cell-size: 2.4rem;
+  --jd-image-editor-resizer-border-color: rgb(5 255 0);
+  --jd-image-editor-resizer-target-bg-color: rgb(140 120 120);
+  --jd-image-editor-resizer-target-border-color: rgb(56 56 56);
+  --jd-resizer-border-color: rgb(152 193 241);
+  --jd-resizer-handle-color: rgb(91 164 243);
+  --jd-resizer-handle-hover-color: rgb(83 126 187);
+
+  /**
+   * Colors - Em (Alert/Message)
+   */
+  --jd-em-color-bg: rgb(207 226 255);
+  --jd-em-color-border: rgb(182 212 254);
+  --jd-em-color-color: rgb(8 66 152);
+
+  /**
+   * Sizes - Buttons
+   */
+  --jd-button-icon-size: 1.4rem;
+  --jd-button-trigger-size: 1.4rem;
+  --jd-button-df-size: calc((var(--jd-button-icon-size) - 0.4rem) * 2);
+  --jd-button-size: calc(var(--jd-button-icon-size) + var(--jd-button-df-size) + var(--jd-margin-v) * 2);
+
+  /**
+   * Sizes - Icons
+   */
+  --jd-icon-size: 1.2rem;
+  --jd-icon-loader-size: 4.8rem;
+
+  /**
+   * Sizes - Height
+   */
+  --jd-height: 1.8rem;
+  --jd-height-element-default: 1.8rem;
+  --jd-height-search: 3rem;
+  --jd-input-height: 3.2rem;
+  --jd-switche-height: 3.2rem;
+  --jd-viewer-height: 2.4rem;
+
+  /**
+   * Sizes - Width
+   */
+  --jd-width-default: 18rem;
+  --jd-width-element-default: 1.8rem;
+  --jd-width-input-min: var(--jd-width-default);
+  --jd-width-search: 32rem;
+  --jd-width-search-count-box: 15%;
+  --jd-width-search-input-box: 60%;
+  --jd-viewer-width: 7rem;
+  --jd-switche-width: 6rem;
+  --jd-col-size: 15rem;
+  --jd-first-column: 31%;
+  --jd-image-editor-resizer-target-size: padding-default;
+
+  /**
+   * Sizes - Spacing
+   */
+  --jd-padding-default: 0.8rem;
+  --jd-margin-v: 0.2rem;
+  --jd-switche-slider-margin: 0.4rem;
+  --jd-em-padding: calc(1rem / 2) 1rem;
+
+  /**
+   * Sizes - Other
+   */
+  --jd-resizer-handle-size: 1rem;
+  --jd-switche-slider-size: calc(var(--jd-switche-height) - var(--jd-switche-slider-margin) * 2);
+  --jd-cols: 4;
+
+  /**
+   * Border and radius
+   */
+  --jd-border-radius-default: 0.3rem;
+  --jd-em-border-radius: 0.375rem;
+
+  /**
+   * Font
+   */
+  --jd-font-default: -apple-system, blinkmacsystemfont, 'Segoe UI', roboto, oxygen-sans, ubuntu, cantarell, 'Helvetica Neue', sans-serif;
+  --jd-font-size-default: 1.4rem;
+  --jd-font-size-small: 1.1rem;
+  --jd-em-font-size: 1rem;
+
+  /**
+   * Shadow
+   */
+  --jd-box-shadow-1: 0 0.8rem 1.6rem rgb(0 0 0 / 19%);
+  --jd-box-shadow-blur: 1.6rem;
+  --jd-box-shadow-tabs: 0 0.2rem 0.4rem rgb(0 0 0 / 10%);
+  --jd-popup-box-shadow: 0 0.4rem 0.1rem -0.2rem rgb(76 76 76 / 20%), 0 0.3rem 0.3rem 0 rgb(76 76 76 / 15%), 0 0.1rem 0.4rem 0 rgb(76 76 76 / 13%);
+  --jd-popup-max-height: max(50vh, 35rem);
+  --jd-focus-input-box-shadow: 0 0 0 0.05rem rgb(0 123 255 / 25%);
+
+  /**
+   * Z-index
+   */
+  --jd-z-index-dialog: 20000004;
+  --jd-z-index-dialog-overlay: 20000003;
+  --jd-z-index-popup: 10000001;
+  --jd-z-index-full-size: 100000;
+  --jd-z-index-context-menu: 30000005;
+  --jd-z-index-tooltip: 30000006;
+
+  /**
+   * Animation and transition
+   */
+  --jd-anl-color-new-line: var(--jd-color-border);
+  --jd-anl-handle-offset: calc(100% - var(--jd-anl-handle-size));
+  --jd-anl-handle-size: 2rem;
+  --jd-timeout-button-active: 0.1s;
+  --jd-transform-button-active: 0.95;
+
+  /**
+   * Tooltip
+   */
+  --jd-tooltip-color: rgb(255 255 255);
+  --jd-tooltip-background-color: rgb(0 0 0 / 70%);
+  --jd-tooltip-sfx-shadow: rgb(0 0 0 / 15%);
+  --jd-tooltip-border-width: 0;
+  --jd-tooltip-border-color: rgb(229 229 229);
+}

package/dist/collection/components/molecules/inputs/mg-input-rich-text-editor/editor/editor.conf.js

@@ -0,0 +1 @@
+export {};