@mgdis/mg-components 6.21.0 → 6.22.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 (158) hide show
  1. package/dist/cjs/{index-CCsGMNyq.js → index-BxB20_Vw.js} +8 -0
  2. package/dist/cjs/index-C2viYwrR.js +4 -0
  3. package/dist/cjs/loader.cjs.js +1 -1
  4. package/dist/cjs/mg-action-more_37.cjs.entry.js +116 -137
  5. package/dist/cjs/mg-alert.cjs.entry.js +1 -1
  6. package/dist/cjs/mg-breadcrumb.cjs.entry.js +63 -0
  7. package/dist/cjs/mg-components.cjs.js +1 -1
  8. package/dist/cjs/mg-fieldset.cjs.entry.js +1 -1
  9. package/dist/cjs/mg-input-combobox.cjs.entry.js +3 -3
  10. package/dist/cjs/mg-input-file.cjs.entry.js +3 -3
  11. package/dist/cjs/mg-input-rich-text-editor.cjs.entry.js +40071 -15808
  12. package/dist/cjs/mg-loader.cjs.entry.js +2 -2
  13. package/dist/cjs/mg-progress.cjs.entry.js +1 -1
  14. package/dist/collection/assets/icons/index.js +1 -1
  15. package/dist/collection/collection-manifest.json +2 -1
  16. package/dist/collection/components/atoms/internals/mg-character-left/mg-character-left.js +1 -1
  17. package/dist/collection/components/atoms/internals/mg-input-title/mg-input-title.js +1 -1
  18. package/dist/collection/components/atoms/mg-card/mg-card.js +1 -1
  19. package/dist/collection/components/atoms/mg-divider/mg-divider.js +1 -1
  20. package/dist/collection/components/atoms/mg-icon/mg-icon.js +2 -2
  21. package/dist/collection/components/atoms/mg-tag/mg-tag.js +1 -1
  22. package/dist/collection/components/atoms/mg-tooltip/mg-tooltip-content/mg-tooltip-content.js +1 -1
  23. package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.js +1 -1
  24. package/dist/collection/components/molecules/inputs/mg-input/mg-input.js +1 -1
  25. package/dist/collection/components/molecules/inputs/mg-input-checkbox/MgInputCheckboxList.js +2 -2
  26. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.js +1 -1
  27. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.js +1 -1
  28. package/dist/collection/components/molecules/inputs/mg-input-combobox/mg-input-combobox.js +1 -1
  29. package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.js +1 -1
  30. package/dist/collection/components/molecules/inputs/mg-input-file/mg-input-file.js +2 -2
  31. package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.js +1 -1
  32. package/dist/collection/components/molecules/inputs/mg-input-password/mg-input-password.js +2 -2
  33. package/dist/collection/components/molecules/inputs/mg-input-radio/mg-input-radio.js +1 -1
  34. package/dist/collection/components/molecules/inputs/mg-input-rich-text-editor/editor/custom-properties.scss +212 -0
  35. package/dist/collection/components/molecules/inputs/mg-input-rich-text-editor/editor/editor.conf.js +1 -0
  36. package/dist/collection/components/molecules/inputs/mg-input-rich-text-editor/editor/index.js +300 -94
  37. package/dist/collection/components/molecules/inputs/mg-input-rich-text-editor/mg-input-rich-text-editor.conf.js +29 -0
  38. package/dist/collection/components/molecules/inputs/mg-input-rich-text-editor/mg-input-rich-text-editor.js +160 -50
  39. package/dist/collection/components/molecules/inputs/mg-input-select/mg-input-select.js +1 -1
  40. package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.js +2 -2
  41. package/dist/collection/components/molecules/inputs/mg-input-textarea/mg-input-textarea.js +1 -1
  42. package/dist/collection/components/molecules/inputs/mg-input-toggle/mg-input-toggle.js +1 -1
  43. package/dist/collection/components/molecules/internals/mg-item-more/mg-item-more.js +3 -36
  44. package/dist/collection/components/molecules/menus/mg-menu/mg-menu.conf.js +0 -4
  45. package/dist/collection/components/molecules/menus/mg-menu/mg-menu.js +21 -43
  46. package/dist/collection/components/molecules/menus/mg-menu-item/mg-menu-item.js +65 -38
  47. package/dist/collection/components/molecules/mg-action-more/mg-action-more.js +1 -1
  48. package/dist/collection/components/molecules/mg-breadcrumb/mg-breadcrumb.conf.js +1 -0
  49. package/dist/collection/components/molecules/mg-breadcrumb/mg-breadcrumb.js +92 -0
  50. package/dist/collection/components/molecules/mg-details/mg-details.js +1 -1
  51. package/dist/collection/components/molecules/mg-fieldset/mg-fieldset.js +1 -1
  52. package/dist/collection/components/molecules/mg-form/mg-form.js +1 -1
  53. package/dist/collection/components/molecules/mg-illustrated-message/mg-illustrated-message.js +1 -1
  54. package/dist/collection/components/molecules/mg-loader/mg-loader.js +1 -1
  55. package/dist/collection/components/molecules/mg-message/mg-message.js +2 -2
  56. package/dist/collection/components/molecules/mg-modal/mg-modal.js +2 -2
  57. package/dist/collection/components/molecules/mg-panel/mg-panel.js +1 -1
  58. package/dist/collection/components/molecules/mg-popover/mg-popover-content/mg-popover-content.js +1 -1
  59. package/dist/collection/components/molecules/mg-popover/mg-popover.js +1 -1
  60. package/dist/collection/components/molecules/mg-progress/mg-progress.js +1 -1
  61. package/dist/collection/components/molecules/mg-skip-links/mg-skip-links.js +1 -1
  62. package/dist/collection/components/molecules/mg-table/mg-table.js +37 -0
  63. package/dist/collection/components/molecules/mg-tabs/mg-tabs.conf.js +0 -4
  64. package/dist/collection/components/molecules/mg-tabs/mg-tabs.js +13 -33
  65. package/dist/collection/locales/en/messages.json +3 -0
  66. package/dist/collection/locales/fr/messages.json +3 -0
  67. package/dist/components/index3.js +1 -1
  68. package/dist/components/mg-action-more.js +1 -1
  69. package/dist/components/mg-breadcrumb.d.ts +11 -0
  70. package/dist/components/mg-breadcrumb.js +1 -0
  71. package/dist/components/mg-card2.js +1 -1
  72. package/dist/components/mg-character-left2.js +1 -1
  73. package/dist/components/mg-details.js +1 -1
  74. package/dist/components/mg-divider2.js +1 -1
  75. package/dist/components/mg-fieldset.js +1 -1
  76. package/dist/components/mg-form.js +1 -1
  77. package/dist/components/mg-icon2.js +1 -1
  78. package/dist/components/mg-illustrated-message.js +1 -1
  79. package/dist/components/mg-input-checkbox-paginated2.js +1 -1
  80. package/dist/components/mg-input-checkbox.js +1 -1
  81. package/dist/components/mg-input-combobox.js +1 -1
  82. package/dist/components/mg-input-date.js +1 -1
  83. package/dist/components/mg-input-file.js +1 -1
  84. package/dist/components/mg-input-numeric.js +1 -1
  85. package/dist/components/mg-input-password.js +1 -1
  86. package/dist/components/mg-input-radio.js +1 -1
  87. package/dist/components/mg-input-rich-text-editor.js +1663 -1
  88. package/dist/components/mg-input-select2.js +1 -1
  89. package/dist/components/mg-input-text2.js +1 -1
  90. package/dist/components/mg-input-textarea.js +1 -1
  91. package/dist/components/mg-input-title2.js +1 -1
  92. package/dist/components/mg-input-toggle.js +1 -1
  93. package/dist/components/mg-input2.js +1 -1
  94. package/dist/components/mg-item-more2.js +1 -1
  95. package/dist/components/mg-loader2.js +1 -1
  96. package/dist/components/mg-menu-item2.js +1 -1
  97. package/dist/components/mg-message2.js +1 -1
  98. package/dist/components/mg-modal.js +1 -1
  99. package/dist/components/mg-panel.js +1 -1
  100. package/dist/components/mg-popover-content2.js +1 -1
  101. package/dist/components/mg-popover2.js +1 -1
  102. package/dist/components/mg-progress.js +1 -1
  103. package/dist/components/mg-skip-links.js +1 -1
  104. package/dist/components/mg-table.js +1 -1
  105. package/dist/components/mg-tabs2.js +1 -1
  106. package/dist/components/mg-tag.js +1 -1
  107. package/dist/components/mg-tooltip-content2.js +1 -1
  108. package/dist/components/mg-tooltip2.js +1 -1
  109. package/dist/esm/index-DFwaH2hS.js +4 -0
  110. package/dist/esm/{index-D-uaxCxH.js → index-DSEloqPn.js} +8 -0
  111. package/dist/esm/loader.js +1 -1
  112. package/dist/esm/mg-action-more_37.entry.js +116 -137
  113. package/dist/esm/mg-alert.entry.js +1 -1
  114. package/dist/esm/mg-breadcrumb.entry.js +61 -0
  115. package/dist/esm/mg-components.js +1 -1
  116. package/dist/esm/mg-fieldset.entry.js +1 -1
  117. package/dist/esm/mg-input-combobox.entry.js +3 -3
  118. package/dist/esm/mg-input-file.entry.js +3 -3
  119. package/dist/esm/mg-input-rich-text-editor.entry.js +40057 -15794
  120. package/dist/esm/mg-loader.entry.js +2 -2
  121. package/dist/esm/mg-progress.entry.js +1 -1
  122. package/dist/mg-components/locales/en/messages.json +3 -0
  123. package/dist/mg-components/locales/fr/messages.json +3 -0
  124. package/dist/mg-components/mg-components.esm.js +1 -1
  125. package/dist/mg-components/p-0482eb9f.entry.js +1 -0
  126. package/dist/mg-components/{p-6b57f249.entry.js → p-2ee92f38.entry.js} +1 -1
  127. package/dist/mg-components/{p-c3d116b9.entry.js → p-3b653226.entry.js} +1 -1
  128. package/dist/mg-components/{p-dd1934f4.entry.js → p-5745fbea.entry.js} +1 -1
  129. package/dist/mg-components/p-DSEloqPn.js +1 -0
  130. package/dist/mg-components/{p-988c282e.entry.js → p-adec7fcc.entry.js} +1 -1
  131. package/dist/mg-components/p-c63f97f0.entry.js +1658 -0
  132. package/dist/mg-components/{p-4175dcbe.entry.js → p-c8c8cfc1.entry.js} +1 -1
  133. package/dist/mg-components/{p-6b655830.entry.js → p-cc793586.entry.js} +1 -1
  134. package/dist/mg-components/p-d5e69c95.entry.js +1 -0
  135. package/dist/types/assets/icons/index.d.ts +2 -0
  136. package/dist/types/components/molecules/inputs/mg-input/mg-input.conf.d.ts +1 -1
  137. package/dist/types/components/molecules/inputs/mg-input-rich-text-editor/editor/editor.conf.d.ts +17 -0
  138. package/dist/types/components/molecules/inputs/mg-input-rich-text-editor/editor/index.d.ts +27 -19
  139. package/dist/types/components/molecules/inputs/mg-input-rich-text-editor/mg-input-rich-text-editor.conf.d.ts +3 -0
  140. package/dist/types/components/molecules/inputs/mg-input-rich-text-editor/mg-input-rich-text-editor.d.ts +48 -14
  141. package/dist/types/components/molecules/internals/mg-item-more/mg-item-more.conf.d.ts +0 -5
  142. package/dist/types/components/molecules/internals/mg-item-more/mg-item-more.d.ts +1 -6
  143. package/dist/types/components/molecules/menus/mg-menu/mg-menu.conf.d.ts +2 -10
  144. package/dist/types/components/molecules/menus/mg-menu/mg-menu.d.ts +7 -7
  145. package/dist/types/components/molecules/menus/mg-menu-item/mg-menu-item.d.ts +12 -8
  146. package/dist/types/components/molecules/mg-breadcrumb/mg-breadcrumb.conf.d.ts +18 -0
  147. package/dist/types/components/molecules/mg-breadcrumb/mg-breadcrumb.d.ts +34 -0
  148. package/dist/types/components/molecules/mg-table/mg-table.d.ts +6 -0
  149. package/dist/types/components/molecules/mg-tabs/mg-tabs.conf.d.ts +1 -9
  150. package/dist/types/components/molecules/mg-tabs/mg-tabs.d.ts +4 -4
  151. package/dist/types/components.d.ts +93 -38
  152. package/ide/intellij/web-types.json +139 -51
  153. package/ide/vscode/css-custom-data.json +10 -2
  154. package/ide/vscode/html-custom-data.json +111 -32
  155. package/package.json +20 -19
  156. package/dist/mg-components/p-08fa327b.entry.js +0 -1
  157. package/dist/mg-components/p-D-uaxCxH.js +0 -1
  158. package/dist/mg-components/p-a79b1f19.entry.js +0 -1
@@ -1 +1 @@
1
- import{r,h as s,H as a}from"./p-DFwaH2hS.js";import{i as e,t as i,e as o}from"./p-C7xjtdiw.js";const t=["progressbar","meter"],c=class{constructor(s){r(this,s),this.ariaRole="progressbar",this.value=0,this.min=0,this.max=100}watchLabel(r){if(!e(r))throw new Error(`<mg-progress> prop "label" must be a valid string. Passed value: ${i(r)}.`)}watchAriaRole(r){if(r&&!t.includes(r))throw new Error(`<mg-progress> prop "ariaRole" must be one of: ${t.join(", ")}. Passed value: ${i(r)}.`)}watchValue(r){if(!(void 0===r||o(r)&&r>=this.min&&r<=this.max))throw new Error(`<mg-progress> prop “value” must be a number within the range ${this.min} to ${this.max}. Passed value: ${i(r)}.`)}watchMin(r){if(0!==r&&void 0!==r&&(!o(r)||r>=this.max))throw new Error(`<mg-progress> prop “min” must be a number lower than: ${this.max}. Passed value: ${i(r)}.`)}watchMax(r){if(100!==r&&void 0!==r&&(!o(r)||r<=this.min))throw new Error(`<mg-progress> prop “max” must be a number greater than: ${this.min}. Passed value: ${i(r)}.`)}componentWillLoad(){this.watchLabel(this.label),this.watchAriaRole(this.ariaRole),this.watchMin(this.min),this.watchMax(this.max),this.watchValue(this.value)}render(){return s(a,{key:"e6d254a68f35c5019158ab17fcb0e4dfd1943ef8",role:this.ariaRole,"aria-label":this.label,"aria-valuenow":this.value,"aria-valuemin":this.min,"aria-valuemax":this.max},s("div",{key:"5b427579ad97336076504a45013a0be00673f9a9",class:"mg-c-progress"},s("div",{key:"76dbdf88550caf51890e10c45c034d73cd02db5d",class:{"mg-c-progress__bar":!0,"mg-c-progress__bar--active":this.value>this.min}},s("div",{key:"b0ab6f784cdb8cc25a40b83a0d97bcda5b5c1f9b",class:"mg-c-progress__fill",style:{width:`${Math.round((this.value-this.min)/(this.max-this.min)*100)}%`}}))))}static get watchers(){return{label:[{watchLabel:0}],ariaRole:[{watchAriaRole:0}],value:[{watchValue:0}],min:[{watchMin:0}],max:[{watchMax:0}]}}};c.style=".mg-c-progress{min-width:calc(var(--mg-b-size-16)*4)}.mg-c-progress__bar{position:relative;overflow:hidden;height:var(--mg-c-progress-size);border-width:var(--mg-b-size-border);border-style:solid;border-color:var(--mg-c-progress-border-color);border-radius:calc((var(--mg-c-progress-size) + var(--mg-b-size-border)*2)/2);background-color:var(--mg-c-progress-bar-color-background)}.mg-c-progress__fill{height:100%;border-radius:calc((var(--mg-c-progress-size) + var(--mg-b-size-border)*2)/2);transition:width 300ms ease-in-out}.mg-c-progress__bar.mg-c-progress__bar--active .mg-c-progress__fill{background-color:var(--mg-c-progress-fill-color-background)}";export{c as mg_progress}
1
+ import{r,h as s,H as e}from"./p-DFwaH2hS.js";import{i as a,t as i,e as o}from"./p-C7xjtdiw.js";const t=["progressbar","meter"],c=class{constructor(s){r(this,s),this.ariaRole="progressbar",this.value=0,this.min=0,this.max=100}watchLabel(r){if(!a(r))throw new Error(`<mg-progress> prop "label" must be a valid string. Passed value: ${i(r)}.`)}watchAriaRole(r){if(r&&!t.includes(r))throw new Error(`<mg-progress> prop "ariaRole" must be one of: ${t.join(", ")}. Passed value: ${i(r)}.`)}watchValue(r){if(!(void 0===r||o(r)&&r>=this.min&&r<=this.max))throw new Error(`<mg-progress> prop “value” must be a number within the range ${this.min} to ${this.max}. Passed value: ${i(r)}.`)}watchMin(r){if(0!==r&&void 0!==r&&(!o(r)||r>=this.max))throw new Error(`<mg-progress> prop “min” must be a number lower than: ${this.max}. Passed value: ${i(r)}.`)}watchMax(r){if(100!==r&&void 0!==r&&(!o(r)||r<=this.min))throw new Error(`<mg-progress> prop “max” must be a number greater than: ${this.min}. Passed value: ${i(r)}.`)}componentWillLoad(){this.watchLabel(this.label),this.watchAriaRole(this.ariaRole),this.watchMin(this.min),this.watchMax(this.max),this.watchValue(this.value)}render(){return s(e,{key:"02466f9df3e5204eef158b9f733ba0af811ad9ed",role:this.ariaRole,"aria-label":this.label,"aria-valuenow":this.value,"aria-valuemin":this.min,"aria-valuemax":this.max},s("div",{key:"88c2eafe55d169502ef5afccfbde3371fee5165f",class:"mg-c-progress"},s("div",{key:"b46159dbed388c58b198bdc330096669c454bcd3",class:{"mg-c-progress__bar":!0,"mg-c-progress__bar--active":this.value>this.min}},s("div",{key:"0faebcc86cc7a55ccab3d9fb8dce4403bff16ebf",class:"mg-c-progress__fill",style:{width:`${Math.round((this.value-this.min)/(this.max-this.min)*100)}%`}}))))}static get watchers(){return{label:[{watchLabel:0}],ariaRole:[{watchAriaRole:0}],value:[{watchValue:0}],min:[{watchMin:0}],max:[{watchMax:0}]}}};c.style=".mg-c-progress{min-width:calc(var(--mg-b-size-16)*4)}.mg-c-progress__bar{position:relative;overflow:hidden;height:var(--mg-c-progress-size);border-width:var(--mg-b-size-border);border-style:solid;border-color:var(--mg-c-progress-border-color);border-radius:calc((var(--mg-c-progress-size) + var(--mg-b-size-border)*2)/2);background-color:var(--mg-c-progress-bar-color-background)}.mg-c-progress__fill{height:100%;border-radius:calc((var(--mg-c-progress-size) + var(--mg-b-size-border)*2)/2);transition:width 300ms ease-in-out}.mg-c-progress__bar.mg-c-progress__bar--active .mg-c-progress__fill{background-color:var(--mg-c-progress-fill-color-background)}";export{c as mg_progress}
@@ -1 +1 @@
1
- import{r as i,c as t,h as e,a as s}from"./p-DFwaH2hS.js";import{C as r,b as o,t as a,i as n,c as h}from"./p-C7xjtdiw.js";import{l,i as p}from"./p-D-uaxCxH.js";import{a as c}from"./p-C9rmNQIL.js";const m=class{constructor(s){i(this,s),this.valueChange=t(this,"value-change",7),this.inputValid=t(this,"input-valid",7),this.hasDisplayedError=!1,this.customErrorMessage={lock:!1},this.name=this.identifier,this.labelOnTop=!1,this.labelHide=!1,this.multiple=!1,this.required=!1,this.disabled=!1,this.tooltipPosition="input",this.classCollection=new r(["mg-c-input--file"]),this.files=[],this.setValidity=i=>{const t=this.valid;this.customErrorMessage.lock&&(void 0===this.customErrorMessage.message||i)||(this.valid=i),this.invalid=!this.valid,(void 0===this.handlerInProgress||"blur"===this.handlerInProgress&&this.valid!==t)&&this.inputValid.emit(this.valid)},this.handleInputChange=i=>{this.checkValidity(),this.hasDisplayedError&&this.setErrorMessage(),this.files=Array.from(i.target.files),this.fileButtonElement.focus()},this.handleInputFocus=()=>{this.fileButtonElement.dataset.focusVisible=""},this.handleInputBlur=()=>{this.handlerInProgress="blur",this.displayError().finally((()=>{this.handlerInProgress=void 0})),delete this.fileButtonElement.dataset.focusVisible},this.handleButtonBlur=()=>{this.inputElement.blur()},this.handleButtonClick=()=>{this.inputElement.click()},this.checkValidity=()=>{this.setValidity(this.disabled||!this.isMaxSizeExceeded()&&this.inputElement.checkValidity())},this.handleDeleteFileClick=()=>{this.files=[],this.fileButtonElement.focus()},this.setErrorMessage=(i=!1)=>{this.errorMessage=void 0,this.valid||(i||this.customErrorMessage.lock&&void 0!==this.customErrorMessage.message?this.errorMessage=this.customErrorMessage.message:this.isMaxSizeExceeded()?this.errorMessage=this.messages.input.file.errors.maxSize.replace("{{maxSize}}",l(this.maxSize,this.locale)):this.inputElement.validity.valueMissing&&(this.errorMessage=this.messages.errors.required))},this.isMaxSizeExceeded=()=>this.maxSize>=0&&this.files.some((i=>i.size>this.maxSize)),this.renderFiles=()=>{const i=`${this.identifier}-file-list`,t=i=>e("span",{class:"mg-c-input__file-item-name"},i.name,i.size>0?e("span",{class:"mg-c-input__file-item-size"},` ${l(i.size,this.locale)}`):void 0),s=()=>e("mg-button",{variant:"flat",class:"mg-c-input__file-delete-button","is-icon":!0,label:this.messages.input.file.deleteButton,type:"button",disabled:this.disabled,"aria-controls":[this.identifier,i].join(" "),onClick:this.handleDeleteFileClick},e("mg-icon",{icon:"cross"}));return 0===this.files.length?null:1===this.files.length?e("div",{class:"mg-c-input__file-item"},t(this.files[0]),s()):e("div",{class:"mg-c-input__file-list-container"},e("ul",{role:"list",class:"mg-c-input__file-list",id:i},Array.from(this.files).map(((i,s)=>e("li",{class:"mg-c-input__file-item",key:`${i.name}-${s}`},t(i))))),s())}}watchValue(i){if(o(i))this.files=this.value.map((i=>new File([],i)));else if(t=i,Array.isArray(t)&&t.every((i=>h(i)&&"string"==typeof i.name&&"number"==typeof i.size)))this.files=this.value;else{if(void 0!==i)throw new Error(`<mg-input-file> prop "value" must be an array of strings or File objects. Passed value: ${a(i)}.`);this.files=[]}var t;this.valueChange.emit(i)}watchMultiple(){if(!1===this.multiple&&this.files.length>1)throw new Error('<mg-input-file> prop "value" must be a single file when prop "multiple" is set to false.')}watchAccept(i){if(void 0!==i&&!n(i))throw new Error('<mg-input-file> prop "accept" must be a valid string.')}handleValidityChange(i,t,e){void 0!==this.inputElement&&(this.inputElement[e]=i,this.checkValidity(),this.hasDisplayedError&&(this.setErrorMessage(),this.hasDisplayedError=!1))}watchDisabled(i){i?this.classCollection.add(c):this.classCollection.delete(c)}watchHelpText(){if(!n(this.helpText)){const i=[];void 0!==this.maxSize&&i.push(this.messages.input.file.helpText.maxSize.replace("{{maxSize}}",l(this.maxSize,this.locale))),void 0!==this.accept&&i.push(this.messages.input.file.helpText.accept.replace("{{accept}}",this.accept)),this.helpText=i.join(". ")}}watchFiles(i,t){a(i)!==a(t)&&(this.value=i.length>0?i:void 0)}async setFocus(){this.fileButtonElement.focus()}displayError(){return new Promise((i=>{requestAnimationFrame((()=>{this.checkValidity(),this.setErrorMessage(),this.hasDisplayedError=this.invalid,i()}))}))}async setError(i,t,e=!1){if("boolean"!=typeof i)throw new Error('<mg-input-file> method "setError()" param "valid" must be a boolean.');if(void 0!==t&&!n(t))throw new Error('<mg-input-file> method "setError()" param "errorMessage" must be a string.');this.customErrorMessage={lock:!i&&e,message:i?void 0:t},this.setValidity(i),this.setErrorMessage(!0),this.hasDisplayedError=this.invalid}async reset(){return this.files=[],new Promise((i=>{requestAnimationFrame((()=>{this.customErrorMessage={lock:!1},this.checkValidity(),this.errorMessage=void 0,this.hasDisplayedError=!1,i()}))}))}componentWillLoad(){const i=p(this.element);return this.locale=i.locale,this.messages=i.messages,this.watchValue(this.value),this.watchDisabled(this.disabled),this.watchHelpText(),this.watchAccept(this.accept),this.watchMultiple(),setTimeout((()=>{this.checkValidity()}),0)}render(){return e("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},e("div",{key:"88fafc6fd4a84c05a545c0083193e2ee0db54bfb",class:"mg-c-input__file-container"},e("input",{key:"ad1d14bc95390d5db56191ebff0d092ed5478183",name:this.name,id:this.identifier,class:"mg-u-visually-hidden",type:"file",multiple:!0===this.multiple,capture:this.capture,accept:this.accept,disabled:this.disabled,required:0===this.files.length&&this.required,onFocus:this.handleInputFocus,onBlur:this.handleInputBlur,onChange:this.handleInputChange,"aria-invalid":(!0===this.invalid).toString(),ref:i=>{this.inputElement=i}}),e("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:i=>{this.fileButtonElement=i}},this.messages.input.file.browse),this.renderFiles()))}get element(){return s(this)}static get watchers(){return{value:[{watchValue:0},{watchMultiple:0}],multiple:[{watchMultiple:0}],accept:[{watchAccept:0},{watchHelpText:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}],helpText:[{watchHelpText:0}],maxSize:[{watchHelpText:0}],files:[{watchFiles:0}]}}};m.style=".mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);overflow-wrap:anywhere}.mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container{position:relative}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}.mg-c-input__file-container{display:flex;flex-direction:column;gap:var(--mg-b-size-8)}.mg-c-input__file-item{display:inline-flex;min-height:var(--mg-b-size-min-height);align-items:center;padding-left:var(--mg-b-size-8);background-color:var(--mg-b-color-neutral-10);font-weight:600;gap:var(--mg-b-size-8)}.mg-c-input__file-item-name{word-break:break-all}.mg-c-input__file-item-size{color:var(--mg-b-color-neutral-90);font-weight:400;word-break:normal}.mg-c-input__file-delete-button{align-self:flex-start}.mg-c-input__file-list{display:flex;flex-direction:column;padding:0;margin:0;gap:var(--mg-b-size-4);list-style:none}.mg-c-input__file-list .mg-c-input__file-item{min-height:unset;padding:var(--mg-b-size-8)}.mg-c-input__file-list-container{position:relative;padding:var(--mg-b-size-8) calc(var(--mg-b-size-8) + var(--mg-b-size-min-height)) var(--mg-b-size-8) var(--mg-b-size-8);border:var(--mg-b-size-border) solid var(--mg-b-color-neutral-30);border-radius:var(--mg-b-size-4)}.mg-c-input__file-list-container .mg-c-input__file-delete-button{position:absolute;top:0;right:0}";export{m as mg_input_file}
1
+ import{r as i,c as t,h as e,a as s}from"./p-DFwaH2hS.js";import{C as r,b as a,t as o,i as n,c as h}from"./p-C7xjtdiw.js";import{l,i as p}from"./p-DSEloqPn.js";import{a as c}from"./p-C9rmNQIL.js";const m=class{constructor(s){i(this,s),this.valueChange=t(this,"value-change",7),this.inputValid=t(this,"input-valid",7),this.hasDisplayedError=!1,this.customErrorMessage={lock:!1},this.name=this.identifier,this.labelOnTop=!1,this.labelHide=!1,this.multiple=!1,this.required=!1,this.disabled=!1,this.tooltipPosition="input",this.classCollection=new r(["mg-c-input--file"]),this.files=[],this.setValidity=i=>{const t=this.valid;this.customErrorMessage.lock&&(void 0===this.customErrorMessage.message||i)||(this.valid=i),this.invalid=!this.valid,(void 0===this.handlerInProgress||"blur"===this.handlerInProgress&&this.valid!==t)&&this.inputValid.emit(this.valid)},this.handleInputChange=i=>{this.checkValidity(),this.hasDisplayedError&&this.setErrorMessage(),this.files=Array.from(i.target.files),this.fileButtonElement.focus()},this.handleInputFocus=()=>{this.fileButtonElement.dataset.focusVisible=""},this.handleInputBlur=()=>{this.handlerInProgress="blur",this.displayError().finally((()=>{this.handlerInProgress=void 0})),delete this.fileButtonElement.dataset.focusVisible},this.handleButtonBlur=()=>{this.inputElement.blur()},this.handleButtonClick=()=>{this.inputElement.click()},this.checkValidity=()=>{this.setValidity(this.disabled||!this.isMaxSizeExceeded()&&this.inputElement.checkValidity())},this.handleDeleteFileClick=()=>{this.files=[],this.fileButtonElement.focus()},this.setErrorMessage=(i=!1)=>{this.errorMessage=void 0,this.valid||(i||this.customErrorMessage.lock&&void 0!==this.customErrorMessage.message?this.errorMessage=this.customErrorMessage.message:this.isMaxSizeExceeded()?this.errorMessage=this.messages.input.file.errors.maxSize.replace("{{maxSize}}",l(this.maxSize,this.locale)):this.inputElement.validity.valueMissing&&(this.errorMessage=this.messages.errors.required))},this.isMaxSizeExceeded=()=>this.maxSize>=0&&this.files.some((i=>i.size>this.maxSize)),this.renderFiles=()=>{const i=`${this.identifier}-file-list`,t=i=>e("span",{class:"mg-c-input__file-item-name"},i.name,i.size>0?e("span",{class:"mg-c-input__file-item-size"},` ${l(i.size,this.locale)}`):void 0),s=()=>e("mg-button",{variant:"flat",class:"mg-c-input__file-delete-button","is-icon":!0,label:this.messages.input.file.deleteButton,type:"button",disabled:this.disabled,"aria-controls":[this.identifier,i].join(" "),onClick:this.handleDeleteFileClick},e("mg-icon",{icon:"cross"}));return 0===this.files.length?null:1===this.files.length?e("div",{class:"mg-c-input__file-item"},t(this.files[0]),s()):e("div",{class:"mg-c-input__file-list-container"},e("ul",{role:"list",class:"mg-c-input__file-list",id:i},Array.from(this.files).map(((i,s)=>e("li",{class:"mg-c-input__file-item",key:`${i.name}-${s}`},t(i))))),s())}}watchValue(i){if(a(i))this.files=this.value.map((i=>new File([],i)));else if(t=i,Array.isArray(t)&&t.every((i=>h(i)&&"string"==typeof i.name&&"number"==typeof i.size)))this.files=this.value;else{if(void 0!==i)throw new Error(`<mg-input-file> prop "value" must be an array of strings or File objects. Passed value: ${o(i)}.`);this.files=[]}var t;this.valueChange.emit(i)}watchMultiple(){if(!1===this.multiple&&this.files.length>1)throw new Error('<mg-input-file> prop "value" must be a single file when prop "multiple" is set to false.')}watchAccept(i){if(void 0!==i&&!n(i))throw new Error('<mg-input-file> prop "accept" must be a valid string.')}handleValidityChange(i,t,e){void 0!==this.inputElement&&(this.inputElement[e]=i,this.checkValidity(),this.hasDisplayedError&&(this.setErrorMessage(),this.hasDisplayedError=!1))}watchDisabled(i){i?this.classCollection.add(c):this.classCollection.delete(c)}watchHelpText(){if(!n(this.helpText)){const i=[];void 0!==this.maxSize&&i.push(this.messages.input.file.helpText.maxSize.replace("{{maxSize}}",l(this.maxSize,this.locale))),void 0!==this.accept&&i.push(this.messages.input.file.helpText.accept.replace("{{accept}}",this.accept)),this.helpText=i.join(". ")}}watchFiles(i,t){o(i)!==o(t)&&(this.value=i.length>0?i:void 0)}async setFocus(){this.fileButtonElement.focus()}displayError(){return new Promise((i=>{requestAnimationFrame((()=>{this.checkValidity(),this.setErrorMessage(),this.hasDisplayedError=this.invalid,i()}))}))}async setError(i,t,e=!1){if("boolean"!=typeof i)throw new Error('<mg-input-file> method "setError()" param "valid" must be a boolean.');if(void 0!==t&&!n(t))throw new Error('<mg-input-file> method "setError()" param "errorMessage" must be a string.');this.customErrorMessage={lock:!i&&e,message:i?void 0:t},this.setValidity(i),this.setErrorMessage(!0),this.hasDisplayedError=this.invalid}async reset(){return this.files=[],new Promise((i=>{requestAnimationFrame((()=>{this.customErrorMessage={lock:!1},this.checkValidity(),this.errorMessage=void 0,this.hasDisplayedError=!1,i()}))}))}componentWillLoad(){const i=p(this.element);return this.locale=i.locale,this.messages=i.messages,this.watchValue(this.value),this.watchDisabled(this.disabled),this.watchHelpText(),this.watchAccept(this.accept),this.watchMultiple(),setTimeout((()=>{this.checkValidity()}),0)}render(){return e("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},e("div",{key:"b0a67412ce2a054ce84f001efe01156bfce001a1",class:"mg-c-input__file-container"},e("input",{key:"0585b37ac4da8e5b29b94c04a298cfd8451016c9",name:this.name,id:this.identifier,class:"mg-u-visually-hidden",type:"file",multiple:!0===this.multiple,capture:this.capture,accept:this.accept,disabled:this.disabled,required:0===this.files.length&&this.required,onFocus:this.handleInputFocus,onBlur:this.handleInputBlur,onChange:this.handleInputChange,"aria-invalid":(!0===this.invalid).toString(),ref:i=>{this.inputElement=i}}),e("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:i=>{this.fileButtonElement=i}},this.messages.input.file.browse),this.renderFiles()))}get element(){return s(this)}static get watchers(){return{value:[{watchValue:0},{watchMultiple:0}],multiple:[{watchMultiple:0}],accept:[{watchAccept:0},{watchHelpText:0}],required:[{handleValidityChange:0}],disabled:[{handleValidityChange:0},{watchDisabled:0}],helpText:[{watchHelpText:0}],maxSize:[{watchHelpText:0}],files:[{watchFiles:0}]}}};m.style=".mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);overflow-wrap:anywhere}.mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container{position:relative}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}.mg-c-input__file-container{display:flex;flex-direction:column;gap:var(--mg-b-size-8)}.mg-c-input__file-item{display:inline-flex;min-height:var(--mg-b-size-min-height);align-items:center;padding-left:var(--mg-b-size-8);background-color:var(--mg-b-color-neutral-10);font-weight:600;gap:var(--mg-b-size-8)}.mg-c-input__file-item-name{word-break:break-all}.mg-c-input__file-item-size{color:var(--mg-b-color-neutral-90);font-weight:400;word-break:normal}.mg-c-input__file-delete-button{align-self:flex-start}.mg-c-input__file-list{display:flex;flex-direction:column;padding:0;margin:0;gap:var(--mg-b-size-4);list-style:none}.mg-c-input__file-list .mg-c-input__file-item{min-height:unset;padding:var(--mg-b-size-8)}.mg-c-input__file-list-container{position:relative;padding:var(--mg-b-size-8) calc(var(--mg-b-size-8) + var(--mg-b-size-min-height)) var(--mg-b-size-8) var(--mg-b-size-8);border:var(--mg-b-size-border) solid var(--mg-b-color-neutral-30);border-radius:var(--mg-b-size-4)}.mg-c-input__file-list-container .mg-c-input__file-delete-button{position:absolute;top:0;right:0}";export{m as mg_input_file}
@@ -0,0 +1 @@
1
+ import{r as e,h as r,a}from"./p-DFwaH2hS.js";import{i as t}from"./p-DSEloqPn.js";import{t as i,i as s}from"./p-C7xjtdiw.js";const c=class{constructor(r){e(this,r)}validateItems(e){if(void 0===e||(r=e,!(Array.isArray(r)&&r.length>0&&r.every(((e,a)=>"object"==typeof e&&null!==e&&s(e.label)&&(a===r.length-1||s(e.href)))))))throw new Error(`<mg-breadcrumb> prop "items" is required and all values must be the same type, BreadcrumbItemType. Passed value: ${i(e)}.`);var r}renderItem(e,a){return s(e.href)?r("a",{href:e.href,"aria-label":void 0!==e.icon?e.label:void 0,"aria-current":a?"page":void 0},void 0!==e.icon?r("mg-icon",{icon:e.icon}):e.label):r("span",null,e.label)}componentWillLoad(){this.validateItems(this.items),this.messages=t(this.element).messages.breadcrumb}render(){return r("nav",{key:"5181512072a7de6e161adcbb9988ae3407f61301","aria-label":this.messages.label,class:"mg-c-breadcrumb"},r("ol",{key:"2a4cec366a72027091ebcbccd78d552884005b93",class:"mg-c-breadcrumb__list"},this.items.map(((e,a)=>{var t;return r("li",{key:`${a}-${null!==(t=e.href)&&void 0!==t?t:e.label}`,class:"mg-c-breadcrumb__list-item"},this.renderItem(e,a===this.items.length-1))}))))}get element(){return a(this)}static get watchers(){return{items:[{validateItems:0}]}}};c.style='a{color:inherit;text-decoration:underline}a:hover,a:focus,a:active{text-decoration:none}.mg-c-breadcrumb{display:block}.mg-c-breadcrumb__list{padding:0;margin:0;list-style:none}.mg-c-breadcrumb__list-item{display:inline;color:var(--mg-b-color-dark);font-weight:700}.mg-c-breadcrumb__list-item:not(:last-child)::after{content:"/";font-weight:600;margin-inline:var(--mg-b-size-8)}.mg-c-breadcrumb__list-item:has(mg-icon) a{padding:var(--mg-b-size-4);margin:calc(var(--mg-b-size-4)*-1)}.mg-c-breadcrumb__list-item mg-icon{margin-block-start:.2rem;vertical-align:top}';export{c as mg_breadcrumb}
@@ -175,6 +175,8 @@ export declare const icons: {
175
175
  'paper-plane-slash': string;
176
176
  'paper-plane-slash-outline': string;
177
177
  paperclip: string;
178
+ pause: string;
179
+ 'pause-outline': string;
178
180
  pen: string;
179
181
  'pen-circle': string;
180
182
  'pen-fancy': string;
@@ -27,7 +27,7 @@ interface InputBaseMethods {
27
27
  /**
28
28
  * Possible Input types
29
29
  */
30
- export type HTMLMgInputsElement = (HTMLMgInputElement & InputBaseMethods) | HTMLMgInputCheckboxElement | HTMLMgInputDateElement | HTMLMgInputNumericElement | HTMLMgInputPasswordElement | HTMLMgInputRadioElement | HTMLMgInputSelectElement | HTMLMgInputTextElement | HTMLMgInputTextareaElement | HTMLMgInputFileElement | (HTMLMgInputToggleElement & InputBaseMethods);
30
+ export type HTMLMgInputsElement = (HTMLMgInputElement & InputBaseMethods) | HTMLMgInputCheckboxElement | HTMLMgInputDateElement | HTMLMgInputNumericElement | HTMLMgInputPasswordElement | HTMLMgInputRadioElement | HTMLMgInputRichTextEditorElement | HTMLMgInputSelectElement | HTMLMgInputTextElement | HTMLMgInputTextareaElement | HTMLMgInputFileElement | (HTMLMgInputToggleElement & InputBaseMethods);
31
31
  /**
32
32
  * Is HTMLMgInputElement an HTMLMgInputFileElement
33
33
  * @param input - input element
@@ -0,0 +1,17 @@
1
+ import type { IJodit, ButtonsOption } from 'jodit/esm/types';
2
+ /**
3
+ * Configuration options for defineEditor function
4
+ * Combines component-specific options with Jodit configuration
5
+ */
6
+ export type DefineEditorConfig = {
7
+ value: string;
8
+ readOnly?: boolean;
9
+ disabled?: boolean;
10
+ placeholder?: string;
11
+ modules: ButtonsOption;
12
+ rows?: number;
13
+ handleTextChange: () => void;
14
+ handleFocus: () => void;
15
+ handleBlur: () => void;
16
+ };
17
+ export type { IJodit, ButtonsOption };
@@ -1,21 +1,29 @@
1
- import Quill, { type QuillOptions } from 'quill';
2
- export type EditorOptionsType = QuillOptions & {
3
- value: string;
4
- handleTextChange: () => void;
5
- handleFocus: () => void;
6
- handleBlur: () => void;
7
- };
8
- export type EditorType = Quill;
9
- interface IdefineEditor {
10
- (wrapperElement: HTMLElement, config: EditorOptionsType): EditorType;
11
- }
1
+ import 'jodit/esm/plugins/select/select.js';
2
+ import 'jodit/esm/plugins/resizer/resizer.js';
3
+ import 'jodit/esm/plugins/table/table.js';
4
+ import 'jodit/esm/plugins/select-cells/select-cells.js';
5
+ import 'jodit/esm/plugins/resize-cells/resize-cells.js';
6
+ import 'jodit/esm/plugins/table-keyboard-navigation/table-keyboard-navigation.js';
7
+ import 'jodit/esm/plugins/inline-popup/inline-popup.js';
8
+ import 'jodit/esm/plugins/clean-html/clean-html.js';
9
+ import 'jodit/esm/plugins/delete/delete.js';
10
+ import 'jodit/esm/plugins/file/file.js';
11
+ import 'jodit/esm/plugins/print/print.js';
12
+ import 'jodit/esm/plugins/source/source.js';
13
+ import type { DefineEditorConfig, IJodit } from './editor.conf';
12
14
  /**
13
- * Fixes for handling text selection in Quill when used within the Shadow DOM.
14
- * - Fixes focus detection
15
- * - Adapts native range handling to work with the Shadow DOM
16
- * - Correctly manages text selection across Shadow DOM boundaries
17
- * - Sets up selection change events
18
- * @returns Quill instance
15
+ * Converts rows count to Jodit editor min-height CSS value.
16
+ * Uses CSS variables --mg-b-font-size and --mg-b-line-height to compute height.
17
+ * @param rows - Number of rows
18
+ * @returns Height as CSS value in pixels (wysiwyg area + toolbar height of 40px + 2px borders)
19
+ * @throws If required CSS variables (--mg-b-font-size, --mg-b-line-height) are missing
19
20
  */
20
- export declare const defineEditor: IdefineEditor;
21
- export {};
21
+ export declare const rowsToEditorHeight: (rows: number) => string;
22
+ /**
23
+ * Configures Jodit editor
24
+ * @param element - Component element (HTMLMgInputRichTextEditorElement)
25
+ * @param editorElement - Textarea element for the editor
26
+ * @param config - Editor configuration options
27
+ * @returns Configured Jodit editor instance
28
+ */
29
+ export declare const defineEditor: (element: HTMLMgInputRichTextEditorElement, editorElement: HTMLTextAreaElement, config: DefineEditorConfig) => IJodit;
@@ -0,0 +1,3 @@
1
+ import type { ButtonsOption } from './editor/editor.conf';
2
+ /** Default toolbar modules when the modules prop is not set. */
3
+ export declare const DEFAULT_MODULES: ButtonsOption;
@@ -1,13 +1,16 @@
1
1
  import { EventEmitter } from '../../../../stencil-public-runtime';
2
2
  import { ClassList } from '@mgdis/core-ui-helpers/dist/utils';
3
3
  import { type TooltipPosition } from '../mg-input/mg-input.conf';
4
- import { type EditorOptionsType } from './editor';
4
+ import { type SanitizerOptions } from '@mgdis/sanitize-html';
5
+ import type { ButtonsOption } from './editor/editor.conf';
5
6
  export declare class MgInputRichTextEditor {
6
7
  /************
7
8
  * Internal *
8
9
  ************/
9
10
  private editor;
10
- private wrapperElement;
11
+ private editorElement;
12
+ private currentTitleElement;
13
+ private sanitizer;
11
14
  private messages;
12
15
  private hasDisplayedError;
13
16
  private customErrorMessage;
@@ -27,6 +30,11 @@ export declare class MgInputRichTextEditor {
27
30
  * Identifier is used for the element ID (id is a reserved prop in Stencil.js)
28
31
  */
29
32
  identifier: string;
33
+ /**
34
+ * Input name
35
+ * If not set the value equals the identifier
36
+ */
37
+ name: string;
30
38
  /**
31
39
  * Input label
32
40
  */
@@ -45,7 +53,8 @@ export declare class MgInputRichTextEditor {
45
53
  */
46
54
  placeholder?: string;
47
55
  /**
48
- * Define the number of visible text lines for the control
56
+ * Define the number of visible text lines for the editor.
57
+ * Impacts the editor height. Content can grow beyond this minimum.
49
58
  */
50
59
  rows: number;
51
60
  /**
@@ -86,9 +95,28 @@ export declare class MgInputRichTextEditor {
86
95
  */
87
96
  helpText?: string;
88
97
  /**
89
- * Editor modules configuration
90
- */
91
- modules?: EditorOptionsType['modules'];
98
+ * Editor modules configuration.
99
+ * Must be passed as an array (e.g. modules=['bold', 'italic', '|', 'ul', 'ol']).
100
+ * Use `|` for a separator/divider in the toolbar.
101
+ * Available modules:
102
+ * - **Text formatting**: `bold`, `italic`, `underline`, `strikethrough`, `eraser`
103
+ * - **Lists**: `ul` (unordered list), `ol` (ordered list)
104
+ * - **Text positioning**: `superscript`, `subscript`
105
+ * - **Colors**: `brush` (text color/background)
106
+ * - **Media**: `link`, `image`, `file`
107
+ * - **Tables**: `table`
108
+ * - **History**: `undo`, `redo`
109
+ * - **Other**: `print`, `source` (HTML source editor)
110
+ */
111
+ modules?: ButtonsOption;
112
+ watchModules(newValue: MgInputRichTextEditor['modules']): void;
113
+ /**
114
+ * Sanitizer configuration in native format.
115
+ * Use disallowTags (array of tag names) and/or disallowAttributes (object mapping tag names to string arrays).
116
+ * Use "*" as tag key to disallow attributes on all tags.
117
+ */
118
+ sanitizerOptions?: SanitizerOptions;
119
+ watchSanitizerOptions(newValue: MgInputRichTextEditor['sanitizerOptions']): void;
92
120
  /**
93
121
  * Define input valid state
94
122
  */
@@ -118,8 +146,8 @@ export declare class MgInputRichTextEditor {
118
146
  */
119
147
  setFocus(): Promise<void>;
120
148
  /**
121
- * Get editor content in HTML format
122
- * @returns HTML content of the editor
149
+ * Get editor content as HTML
150
+ * @returns HTML content of the editor (sanitized)
123
151
  */
124
152
  getEditorHTML(): Promise<string>;
125
153
  /**
@@ -150,11 +178,6 @@ export declare class MgInputRichTextEditor {
150
178
  * @returns truthy is value is invalid
151
179
  */
152
180
  private isEmpty;
153
- /**
154
- * Extract the text without HTML tags from value
155
- * @returns text content
156
- */
157
- private getTextContent;
158
181
  /**
159
182
  * Get pattern validity
160
183
  * @returns is pattern valid
@@ -187,6 +210,10 @@ export declare class MgInputRichTextEditor {
187
210
  * Handle `text-change` event
188
211
  */
189
212
  private handleTextChange;
213
+ /**
214
+ * Initialize sanitizer with current sanitizerOptions
215
+ */
216
+ private initializeSanitizer;
190
217
  /*************
191
218
  * Lifecycle *
192
219
  *************/
@@ -196,9 +223,16 @@ export declare class MgInputRichTextEditor {
196
223
  */
197
224
  componentWillLoad(): ReturnType<typeof setTimeout>;
198
225
  /**
199
- * add listeners and render editor element
226
+ * Add listeners and render editor element
200
227
  */
201
228
  componentDidLoad(): void;
229
+ /**
230
+ * Re-apply accessibility attributes after re-renders.
231
+ * When state changes (disabled, readonly, etc.) trigger a re-render,
232
+ * mg-input's renderLabel() may destroy and recreate mg-input-title,
233
+ * which loses the id and click handler needed for aria-labelledby.
234
+ */
235
+ componentDidRender(): void;
202
236
  /**
203
237
  * Render
204
238
  * @returns HTML mg-input Element
@@ -1,4 +1,3 @@
1
- import type { MgMenu } from '../../menus/mg-menu/mg-menu';
2
1
  import type { MgIcon } from '../../../atoms/mg-icon/mg-icon';
3
2
  /**
4
3
  * SlotLabel prop type
@@ -11,7 +10,3 @@ export type SlotLabelType = {
11
10
  * icon prop type
12
11
  */
13
12
  export type IconType = Pick<MgIcon, 'icon'>;
14
- /**
15
- * size type
16
- */
17
- export type SizeType = MgMenu['size'];
@@ -1,4 +1,4 @@
1
- import type { IconType, SizeType, SlotLabelType } from './mg-item-more.conf';
1
+ import type { IconType, SlotLabelType } from './mg-item-more.conf';
2
2
  /**
3
3
  * @internal
4
4
  */
@@ -27,11 +27,6 @@ export declare class MgItemMore {
27
27
  */
28
28
  slotlabel?: SlotLabelType;
29
29
  validateSlotLabel(newValue: MgItemMore['slotlabel']): void;
30
- /**
31
- * Define component child menu size.
32
- */
33
- size?: SizeType;
34
- validateSize(newValue: MgItemMore['size']): void;
35
30
  /**
36
31
  * Define component parent menu.
37
32
  */
@@ -1,4 +1,4 @@
1
- import type { Size, Direction } from '../../../../types';
1
+ import type { Direction } from '../../../../types';
2
2
  import type { MgItemMore } from '../../internals/mg-item-more/mg-item-more';
3
3
  /**
4
4
  * Menu direction values
@@ -7,12 +7,4 @@ export declare const directions: Record<string, Direction>;
7
7
  /**
8
8
  * ItemMore prop type
9
9
  */
10
- export type ItemMoreType = Pick<MgItemMore, 'icon' | 'slotlabel' | 'size'>;
11
- /**
12
- * List of all possibles sizes
13
- */
14
- export declare const sizes: readonly ["medium", "large", "xlarge"];
15
- /**
16
- * item Size from sizes
17
- */
18
- export type MenuSizeType = Size & (typeof sizes)[number];
10
+ export type ItemMoreType = Pick<MgItemMore, 'icon' | 'slotlabel'>;
@@ -1,4 +1,4 @@
1
- import type { MenuSizeType, ItemMoreType } from './mg-menu.conf';
1
+ import type { ItemMoreType } from './mg-menu.conf';
2
2
  import { Direction } from '../../../../types';
3
3
  /**
4
4
  * @slot - Menu content
@@ -26,17 +26,17 @@ export declare class MgMenu {
26
26
  */
27
27
  direction: Direction;
28
28
  validateDirection(newValue: MgMenu['direction']): void;
29
+ /**
30
+ * Size of the menu items
31
+ * @deprecated this prop is deprecated and will be removed in future releases
32
+ */
33
+ size: never;
29
34
  /**
30
35
  * Customize "mg-item-more" element
31
- * Used with direction: 'vertical' to manage overflow
36
+ * Used with direction: 'horizontal' to manage overflow
32
37
  */
33
38
  itemmore?: ItemMoreType;
34
39
  validateItemMore(newValue: MgMenu['itemmore']): void;
35
- /**
36
- * Define mg-menu size
37
- */
38
- size: MenuSizeType;
39
- validateSize(newValue: MgMenu['size']): void;
40
40
  /**
41
41
  * Define mg-menu-item listener when they are loaded
42
42
  * @param event - mg-item-loaded "item-loaded" custom event
@@ -1,6 +1,5 @@
1
1
  import { EventEmitter } from '../../../../stencil-public-runtime';
2
2
  import { ClassList } from '@mgdis/core-ui-helpers/dist/utils';
3
- import { type MenuSizeType } from '../mg-menu/mg-menu.conf';
4
3
  import { type MgMenuStatusType, type TargetType } from './mg-menu-item.conf';
5
4
  import { Direction } from '../../../../types';
6
5
  /**
@@ -15,7 +14,7 @@ export declare class MgMenuItem {
15
14
  * Internal *
16
15
  ************/
17
16
  private readonly name;
18
- private readonly navigationButton;
17
+ private readonly classNavigationButton;
19
18
  private messages;
20
19
  private popoverIdentifier;
21
20
  /**************
@@ -48,6 +47,11 @@ export declare class MgMenuItem {
48
47
  */
49
48
  status?: MgMenuStatusType;
50
49
  watchStatus(newValue: MgMenuItem['status'], oldValue?: MgMenuItem['status']): void;
50
+ /**
51
+ * Define menu-item isIcon style.
52
+ */
53
+ isIcon?: boolean;
54
+ watchIsIcon(newValue: MgMenuItem['isIcon']): void;
51
55
  /**
52
56
  * Define menu-item content expanded.
53
57
  */
@@ -67,15 +71,10 @@ export declare class MgMenuItem {
67
71
  /**********
68
72
  * States *
69
73
  *********/
70
- /**
71
- * Define menu-item size.
72
- */
73
- size: MenuSizeType;
74
- watchSize(newValue: MgMenuItem['size'], oldValue?: MgMenuItem['size']): void;
75
74
  /**
76
75
  * Component button classes
77
76
  */
78
- navigationButtonClassList: ClassList;
77
+ classNavigationButtonClassList: ClassList;
79
78
  /**
80
79
  * Parent menu direction
81
80
  */
@@ -205,6 +204,11 @@ export declare class MgMenuItem {
205
204
  * @returns promise process wich emit the 'item-updated' event
206
205
  */
207
206
  componentShouldUpdate(): Promise<void>;
207
+ /**
208
+ * Render information slot or notification badge
209
+ * @returns HTML Element
210
+ */
211
+ private renderInformationSlotOrNotification;
208
212
  /**
209
213
  * Render ineractive element
210
214
  * @returns HTML Element
@@ -0,0 +1,18 @@
1
+ import type { IconType } from '../../atoms/mg-icon/mg-icon.conf';
2
+ /**
3
+ * Breadcrumb item type
4
+ */
5
+ export type BreadcrumbItemType = {
6
+ /** Displayed label (link text or current page text). Always required. */
7
+ label: string;
8
+ /**
9
+ * Link URL. If absent or empty, the item is rendered as current page (text only, no <a>).
10
+ * Last item typically has no href.
11
+ */
12
+ href?: string;
13
+ /**
14
+ * Icon name (mg-icon). If present, the link displays the icon instead of the text.
15
+ * The label is used as accessible text (aria-label or visually hidden content).
16
+ */
17
+ icon?: IconType;
18
+ };
@@ -0,0 +1,34 @@
1
+ import { BreadcrumbItemType } from './mg-breadcrumb.conf';
2
+ export declare class MgBreadcrumb {
3
+ /************
4
+ * Internal *
5
+ ************/
6
+ private messages;
7
+ /**************
8
+ * Decorators *
9
+ **************/
10
+ /**
11
+ * Get component DOM element
12
+ */
13
+ element: HTMLMgBreadcrumbElement;
14
+ /**
15
+ * Breadcrumb items (hierarchical order: root → current page).
16
+ */
17
+ items: BreadcrumbItemType[];
18
+ validateItems(newValue: MgBreadcrumb['items']): void;
19
+ /***********
20
+ * Methods *
21
+ **********/
22
+ /**
23
+ * Render a single breadcrumb item (link or current page)
24
+ * @param item - The breadcrumb item
25
+ * @param isLast - Whether this item is the last in the list
26
+ * @returns The rendered link or span element
27
+ */
28
+ private renderItem;
29
+ /*************
30
+ * Lifecycle *
31
+ *************/
32
+ componentWillLoad(): void;
33
+ render(): HTMLElement;
34
+ }
@@ -11,6 +11,7 @@ export declare class MgTable {
11
11
  private readonly componentClass;
12
12
  private readonly componentWrapperClass;
13
13
  private readonly classFullWidth;
14
+ private readonly classBorderHide;
14
15
  private alignmentStylesheet;
15
16
  /**************
16
17
  * Decorators *
@@ -29,6 +30,11 @@ export declare class MgTable {
29
30
  */
30
31
  fullWidth: boolean;
31
32
  watchFullWidth(newValue: MgTable['fullWidth']): void;
33
+ /**
34
+ * Define if table has no outer border
35
+ */
36
+ borderHide: boolean;
37
+ watchBorderHide(newValue: MgTable['borderHide']): void;
32
38
  /**
33
39
  * Define column properties
34
40
  */
@@ -1,4 +1,4 @@
1
- import type { Size, Status as StatusType } from '../../../types';
1
+ import type { Status as StatusType } from '../../../types';
2
2
  import type { MgBadge } from '../../atoms/mg-badge/mg-badge';
3
3
  import type { MgIcon } from '../../atoms/mg-icon/mg-icon';
4
4
  /**
@@ -17,11 +17,3 @@ export type TabItem = {
17
17
  };
18
18
  status: StatusType;
19
19
  };
20
- /**
21
- * List of all possibles sizes
22
- */
23
- export declare const sizes: readonly ["medium", "large"];
24
- /**
25
- * Variant type from variants
26
- */
27
- export type SizeType = Size & (typeof sizes)[number];
@@ -1,6 +1,6 @@
1
1
  import { EventEmitter } from '../../../stencil-public-runtime';
2
2
  import { ClassList } from '@mgdis/core-ui-helpers/dist/utils';
3
- import { TabItem, SizeType } from './mg-tabs.conf';
3
+ import { TabItem } from './mg-tabs.conf';
4
4
  /**
5
5
  * @slot tab_content-n - Tab content, where `n` represents the position of the tab content. It starts at 1.
6
6
  */
@@ -32,10 +32,10 @@ export declare class MgTabs {
32
32
  label: string;
33
33
  validateLabel(newValue: MgTabs['label']): void;
34
34
  /**
35
- * Define tabs size
35
+ * Size of the tabs items.
36
+ * @deprecated this prop is deprecated and will be removed in future releases. Please use CSS custom properties to set the size of tabs items.
36
37
  */
37
- size: SizeType;
38
- validateSize(newValue: MgTabs['size']): void;
38
+ size: never;
39
39
  /**
40
40
  * Tabs items
41
41
  */