@mgdis/mg-components 6.20.0 → 6.21.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 (159) hide show
  1. package/dist/cjs/{index-Bp6wZzau.js → index-C2viYwrR.js} +1757 -80
  2. package/dist/cjs/{index-TUElr4Wv.js → index-CCsGMNyq.js} +46 -0
  3. package/dist/cjs/loader.cjs.js +2 -2
  4. package/dist/cjs/mg-action-more_37.cjs.entry.js +684 -273
  5. package/dist/cjs/mg-alert.cjs.entry.js +17 -9
  6. package/dist/cjs/mg-components.cjs.js +3 -3
  7. package/dist/cjs/mg-fieldset.cjs.entry.js +24 -7
  8. package/dist/cjs/mg-input-combobox.cjs.entry.js +48 -18
  9. package/dist/cjs/mg-input-file.cjs.entry.js +384 -0
  10. package/dist/cjs/mg-input-rich-text-editor.cjs.entry.js +30 -18
  11. package/dist/cjs/{mg-input.conf-D7jmj_lh.js → mg-input.conf-BNpeATnq.js} +7 -0
  12. package/dist/cjs/mg-loader.cjs.entry.js +8 -6
  13. package/dist/cjs/mg-progress.cjs.entry.js +19 -9
  14. package/dist/collection/collection-manifest.json +3 -2
  15. package/dist/collection/components/atoms/mg-icon/mg-icon.js +1 -1
  16. package/dist/collection/components/molecules/inputs/mg-input/mg-input.conf.js +6 -0
  17. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.js +1 -1
  18. package/dist/collection/components/molecules/inputs/mg-input-file/mg-input-file.js +877 -0
  19. package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.js +1 -1
  20. package/dist/collection/components/molecules/inputs/mg-input-password/mg-input-password.js +1 -1
  21. package/dist/collection/components/molecules/inputs/mg-input-radio/mg-input-radio.js +1 -1
  22. package/dist/collection/components/molecules/inputs/mg-input-rich-text-editor/mg-input-rich-text-editor.js +12 -12
  23. package/dist/collection/components/molecules/inputs/mg-input-select/mg-input-select.js +1 -1
  24. package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.js +2 -2
  25. package/dist/collection/components/molecules/inputs/mg-input-textarea/mg-input-textarea.js +1 -1
  26. package/dist/collection/components/molecules/inputs/mg-input-toggle/mg-input-toggle.js +1 -1
  27. package/dist/collection/components/molecules/mg-action-more/mg-action-more.js +1 -1
  28. package/dist/collection/components/molecules/mg-alert/mg-alert.js +1 -1
  29. package/dist/collection/components/molecules/mg-details/mg-details.js +1 -1
  30. package/dist/collection/components/molecules/mg-fieldset/mg-fieldset.js +12 -3
  31. package/dist/collection/components/molecules/mg-form/mg-form.js +12 -2
  32. package/dist/collection/components/molecules/mg-illustrated-message/mg-illustrated-message.js +1 -1
  33. package/dist/collection/components/molecules/mg-loader/mg-loader.js +1 -1
  34. package/dist/collection/components/molecules/mg-message/mg-message.js +2 -2
  35. package/dist/collection/components/molecules/mg-modal/mg-modal.js +2 -2
  36. package/dist/collection/components/molecules/mg-panel/mg-panel.js +1 -1
  37. package/dist/collection/components/molecules/mg-popover/mg-popover-content/mg-popover-content.js +1 -1
  38. package/dist/collection/components/molecules/mg-popover/mg-popover.js +1 -1
  39. package/dist/collection/components/molecules/mg-progress/mg-progress.js +1 -1
  40. package/dist/collection/components/molecules/mg-skip-links/mg-skip-links.js +1 -1
  41. package/dist/collection/components/molecules/mg-tabs/mg-tabs.js +1 -1
  42. package/dist/collection/locales/en/messages.json +11 -0
  43. package/dist/collection/locales/fr/messages.json +11 -0
  44. package/dist/components/events.utils.js +1 -23
  45. package/dist/components/index.d.ts +2 -0
  46. package/dist/components/index.js +1 -1
  47. package/dist/components/index2.js +1 -408
  48. package/dist/components/index3.js +1 -476
  49. package/dist/components/mg-action-more.js +1 -254
  50. package/dist/components/mg-alert.js +1 -224
  51. package/dist/components/mg-badge.js +1 -6
  52. package/dist/components/mg-badge2.js +1 -113
  53. package/dist/components/mg-button.js +1 -6
  54. package/dist/components/mg-button2.js +1 -275
  55. package/dist/components/mg-card.js +1 -6
  56. package/dist/components/mg-card2.js +1 -92
  57. package/dist/components/mg-character-left.js +1 -6
  58. package/dist/components/mg-character-left2.js +1 -75
  59. package/dist/components/mg-details.js +1 -104
  60. package/dist/components/mg-divider.js +1 -6
  61. package/dist/components/mg-divider2.js +1 -49
  62. package/dist/components/mg-fieldset.js +1 -209
  63. package/dist/components/mg-form.js +1 -302
  64. package/dist/components/mg-icon.js +1 -6
  65. package/dist/components/mg-icon2.js +1 -188
  66. package/dist/components/mg-illustrated-message.js +1 -129
  67. package/dist/components/mg-input-checkbox-paginated.js +1 -6
  68. package/dist/components/mg-input-checkbox-paginated2.js +1 -135
  69. package/dist/components/mg-input-checkbox.js +1 -762
  70. package/dist/components/mg-input-combobox.js +1 -940
  71. package/dist/components/mg-input-date.js +1 -463
  72. package/dist/components/mg-input-file.d.ts +11 -0
  73. package/dist/components/mg-input-file.js +1 -0
  74. package/dist/components/mg-input-numeric.js +1 -592
  75. package/dist/components/mg-input-password.js +1 -360
  76. package/dist/components/mg-input-radio.js +1 -392
  77. package/dist/components/mg-input-rich-text-editor.js +1 -16797
  78. package/dist/components/mg-input-select.js +1 -6
  79. package/dist/components/mg-input-select2.js +1 -481
  80. package/dist/components/mg-input-text.js +1 -6
  81. package/dist/components/mg-input-text2.js +1 -514
  82. package/dist/components/mg-input-textarea.js +1 -412
  83. package/dist/components/mg-input-title.js +1 -6
  84. package/dist/components/mg-input-title2.js +1 -81
  85. package/dist/components/mg-input-toggle.js +1 -371
  86. package/dist/components/mg-input.conf.js +1 -0
  87. package/dist/components/mg-input.js +1 -6
  88. package/dist/components/mg-input2.js +1 -459
  89. package/dist/components/mg-item-more.js +1 -6
  90. package/dist/components/mg-item-more2.js +1 -505
  91. package/dist/components/mg-loader.js +1 -6
  92. package/dist/components/mg-loader2.js +1 -74
  93. package/dist/components/mg-menu-item.js +1 -6
  94. package/dist/components/mg-menu-item2.js +1 -485
  95. package/dist/components/mg-menu.js +1 -6
  96. package/dist/components/mg-message.js +1 -6
  97. package/dist/components/mg-message2.js +1 -146
  98. package/dist/components/mg-modal.js +1 -184
  99. package/dist/components/mg-pagination.js +1 -234
  100. package/dist/components/mg-panel.js +1 -350
  101. package/dist/components/mg-popover-content.js +1 -6
  102. package/dist/components/mg-popover-content2.js +1 -96
  103. package/dist/components/mg-popover.js +1 -6
  104. package/dist/components/mg-popover2.js +1 -312
  105. package/dist/components/mg-progress.js +1 -123
  106. package/dist/components/mg-skip-links.js +1 -78
  107. package/dist/components/mg-table.js +1 -319
  108. package/dist/components/mg-tabs.js +1 -6
  109. package/dist/components/mg-tabs2.js +1 -315
  110. package/dist/components/mg-tag.js +1 -133
  111. package/dist/components/mg-tooltip-content.js +1 -6
  112. package/dist/components/mg-tooltip-content2.js +1 -42
  113. package/dist/components/mg-tooltip.js +1 -6
  114. package/dist/components/mg-tooltip2.js +1 -421
  115. package/dist/components/popper.js +1 -1790
  116. package/dist/esm/{index-CNX6lq0x.js → index-D-uaxCxH.js} +46 -1
  117. package/dist/esm/{index-BluNKQ3L.js → index-DFwaH2hS.js} +1757 -80
  118. package/dist/esm/loader.js +3 -3
  119. package/dist/esm/mg-action-more_37.entry.js +684 -273
  120. package/dist/esm/mg-alert.entry.js +17 -9
  121. package/dist/esm/mg-components.js +4 -4
  122. package/dist/esm/mg-fieldset.entry.js +24 -7
  123. package/dist/esm/mg-input-combobox.entry.js +48 -18
  124. package/dist/esm/mg-input-file.entry.js +382 -0
  125. package/dist/esm/mg-input-rich-text-editor.entry.js +30 -18
  126. package/dist/esm/{mg-input.conf-DDnrE1hD.js → mg-input.conf-C9rmNQIL.js} +7 -1
  127. package/dist/esm/mg-loader.entry.js +8 -6
  128. package/dist/esm/mg-progress.entry.js +19 -9
  129. package/dist/mg-components/locales/en/messages.json +11 -0
  130. package/dist/mg-components/locales/fr/messages.json +11 -0
  131. package/dist/mg-components/mg-components.esm.js +1 -1
  132. package/dist/mg-components/{p-d5a276eb.entry.js → p-08fa327b.entry.js} +1 -1
  133. package/dist/mg-components/p-4175dcbe.entry.js +1 -0
  134. package/dist/mg-components/{p-7132bca1.entry.js → p-6b57f249.entry.js} +1 -1
  135. package/dist/mg-components/p-6b655830.entry.js +1 -0
  136. package/dist/mg-components/p-988c282e.entry.js +1 -0
  137. package/dist/mg-components/p-C9rmNQIL.js +1 -0
  138. package/dist/mg-components/p-D-uaxCxH.js +1 -0
  139. package/dist/mg-components/p-DFwaH2hS.js +2 -0
  140. package/dist/mg-components/p-a79b1f19.entry.js +1 -0
  141. package/dist/mg-components/{p-916dfb6d.entry.js → p-c3d116b9.entry.js} +1 -1
  142. package/dist/mg-components/p-dd1934f4.entry.js +1 -0
  143. package/dist/types/components/molecules/inputs/mg-input/mg-input.conf.d.ts +7 -1
  144. package/dist/types/components/molecules/inputs/mg-input-file/mg-input-file.d.ts +210 -0
  145. package/dist/types/components/molecules/inputs/mg-input-rich-text-editor/mg-input-rich-text-editor.d.ts +4 -4
  146. package/dist/types/components.d.ts +211 -10
  147. package/dist/types/stencil-public-runtime.d.ts +76 -12
  148. package/ide/intellij/web-types.json +356 -12
  149. package/ide/vscode/html-custom-data.json +338 -76
  150. package/package.json +19 -19
  151. package/dist/collection/components/molecules/inputs/mg-input-rich-text-editor/editor/editor.scss +0 -1
  152. package/dist/mg-components/p-016bd291.entry.js +0 -1
  153. package/dist/mg-components/p-186a6139.entry.js +0 -1
  154. package/dist/mg-components/p-BluNKQ3L.js +0 -2
  155. package/dist/mg-components/p-CNX6lq0x.js +0 -1
  156. package/dist/mg-components/p-DDnrE1hD.js +0 -1
  157. package/dist/mg-components/p-cd061b38.entry.js +0 -1
  158. package/dist/mg-components/p-d2c72f09.entry.js +0 -1
  159. package/ide/vscode/custom.css-data.json +0 -425
@@ -0,0 +1,382 @@
1
+ import { r as registerInstance, c as createEvent, h, a as getElement } from './index-DFwaH2hS.js';
2
+ import { C as ClassList, b as allItemsAreString, t as toString, i as isValidString, c as isObject } from './index-C7xjtdiw.js';
3
+ import { l as localeByte, i as initLocales } from './index-D-uaxCxH.js';
4
+ import { a as classDisabled } from './mg-input.conf-C9rmNQIL.js';
5
+
6
+ const mgInputFileCss = () => `.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}`;
7
+
8
+ const allItemsAreFile = (items) => {
9
+ return Array.isArray(items) && items.every(item => isObject(item) && typeof item.name === 'string' && typeof item.size === 'number');
10
+ };
11
+ const MgInputFile = class {
12
+ constructor(hostRef) {
13
+ registerInstance(this, hostRef);
14
+ this.valueChange = createEvent(this, "value-change", 7);
15
+ this.inputValid = createEvent(this, "input-valid", 7);
16
+ // hasDisplayedError (triggered by blur event)
17
+ this.hasDisplayedError = false;
18
+ this.customErrorMessage = { lock: false };
19
+ /**
20
+ * Input name
21
+ * If not set the value equals the identifier
22
+ */
23
+ this.name = this.identifier;
24
+ /**
25
+ * Define if label is displayed on top
26
+ */
27
+ this.labelOnTop = false;
28
+ /**
29
+ * Define if label is visible
30
+ */
31
+ this.labelHide = false;
32
+ /**
33
+ * Define multiple files
34
+ * When the multiple Boolean attribute is specified, the file input allows the user to select more than one file.
35
+ * (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#multiple).
36
+ */
37
+ this.multiple = false;
38
+ /**
39
+ * Define if input is required
40
+ */
41
+ this.required = false;
42
+ /**
43
+ * Define if input is disabled
44
+ */
45
+ this.disabled = false;
46
+ /**
47
+ * Define tooltip position
48
+ */
49
+ this.tooltipPosition = 'input';
50
+ /**
51
+ * Component classes
52
+ */
53
+ this.classCollection = new ClassList(['mg-c-input--file']);
54
+ /**
55
+ * Files list
56
+ */
57
+ this.files = [];
58
+ /**
59
+ * Method to set validity values
60
+ * @param newValue - valid new value
61
+ */
62
+ this.setValidity = (newValue) => {
63
+ const oldValue = this.valid;
64
+ if (!this.customErrorMessage.lock || (this.customErrorMessage.message !== undefined && !newValue)) {
65
+ this.valid = newValue;
66
+ }
67
+ this.invalid = !this.valid;
68
+ // We need to send valid event even if it is the same value
69
+ if (this.handlerInProgress === undefined || (this.handlerInProgress === 'blur' && this.valid !== oldValue)) {
70
+ this.inputValid.emit(this.valid);
71
+ }
72
+ };
73
+ /**
74
+ * Handle change event
75
+ */
76
+ this.handleInputChange = (event) => {
77
+ this.checkValidity();
78
+ if (this.hasDisplayedError) {
79
+ this.setErrorMessage();
80
+ }
81
+ this.files = Array.from(event.target.files);
82
+ // Reset input focus to the button after file selection
83
+ this.fileButtonElement.focus();
84
+ };
85
+ /**
86
+ * Handle input focus event
87
+ */
88
+ this.handleInputFocus = () => {
89
+ this.fileButtonElement.dataset.focusVisible = '';
90
+ };
91
+ /**
92
+ * Handle input blur event
93
+ */
94
+ this.handleInputBlur = () => {
95
+ // Display Error
96
+ this.handlerInProgress = 'blur';
97
+ this.displayError().finally(() => {
98
+ // reset guard
99
+ this.handlerInProgress = undefined;
100
+ });
101
+ delete this.fileButtonElement.dataset.focusVisible;
102
+ };
103
+ /**
104
+ * Handle button blur event
105
+ */
106
+ this.handleButtonBlur = () => {
107
+ this.inputElement.blur();
108
+ };
109
+ /**
110
+ * Handle add file button click
111
+ */
112
+ this.handleButtonClick = () => {
113
+ this.inputElement.click();
114
+ };
115
+ /**
116
+ * Check if input is valid
117
+ */
118
+ this.checkValidity = () => {
119
+ this.setValidity(this.disabled || (!this.isMaxSizeExceeded() && this.inputElement.checkValidity()));
120
+ };
121
+ /**
122
+ * Handle delete file button click
123
+ */
124
+ this.handleDeleteFileClick = () => {
125
+ this.files = [];
126
+ // Reset input focus to the button after file selection
127
+ this.fileButtonElement.focus();
128
+ };
129
+ /**
130
+ * Set input error message
131
+ * @param fromSetErrorContext - context come from `setError` method
132
+ */
133
+ this.setErrorMessage = (fromSetErrorContext = false) => {
134
+ // Set error message
135
+ this.errorMessage = undefined;
136
+ if (!this.valid) {
137
+ // Does have a new custom error message OR does have a custom error message locked
138
+ if (fromSetErrorContext || (this.customErrorMessage.lock && this.customErrorMessage.message !== undefined)) {
139
+ this.errorMessage = this.customErrorMessage.message;
140
+ }
141
+ // Does not match max size
142
+ else if (this.isMaxSizeExceeded()) {
143
+ this.errorMessage = this.messages.input.file.errors.maxSize.replace('{{maxSize}}', localeByte(this.maxSize, this.locale));
144
+ }
145
+ // required
146
+ else if (this.inputElement.validity.valueMissing) {
147
+ this.errorMessage = this.messages.errors.required;
148
+ }
149
+ }
150
+ };
151
+ /**
152
+ * Check if max size is exceeded
153
+ * @returns boolean - true if max size is exceeded
154
+ */
155
+ this.isMaxSizeExceeded = () => {
156
+ return this.maxSize >= 0 && this.files.some(file => file.size > this.maxSize);
157
+ };
158
+ /**
159
+ * Render files
160
+ * @returns formated files.
161
+ */
162
+ this.renderFiles = () => {
163
+ const fileListId = `${this.identifier}-file-list`;
164
+ const renderFileName = (file) => (h("span", { class: "mg-c-input__file-item-name" }, file.name, file.size > 0 ? h("span", { class: "mg-c-input__file-item-size" }, ` ${localeByte(file.size, this.locale)}`) : undefined));
165
+ const renderDeleteButton = () => (h("mg-button", { variant: "flat", class: "mg-c-input__file-delete-button", "is-icon": true, label: this.messages.input.file.deleteButton, type: "button", disabled: this.disabled, "aria-controls": [this.identifier, fileListId].join(' '), onClick: this.handleDeleteFileClick }, h("mg-icon", { icon: "cross" })));
166
+ if (this.files.length === 0) {
167
+ return null;
168
+ }
169
+ else if (this.files.length === 1) {
170
+ return (h("div", { class: "mg-c-input__file-item" }, renderFileName(this.files[0]), renderDeleteButton()));
171
+ }
172
+ else {
173
+ return (h("div", { class: "mg-c-input__file-list-container" }, h("ul", { role: "list", class: "mg-c-input__file-list", id: fileListId }, Array.from(this.files).map((file, index) => (h("li", { class: "mg-c-input__file-item", key: `${file.name}-${index}` }, renderFileName(file))))), renderDeleteButton()));
174
+ }
175
+ };
176
+ }
177
+ watchValue(newValue) {
178
+ if (allItemsAreString(newValue)) {
179
+ this.files = this.value.map((fileName) => new File([], fileName));
180
+ }
181
+ else if (allItemsAreFile(newValue)) {
182
+ this.files = this.value;
183
+ }
184
+ else if (newValue !== undefined) {
185
+ throw new Error(`<mg-input-file> prop "value" must be an array of strings or File objects. Passed value: ${toString(newValue)}.`);
186
+ }
187
+ else {
188
+ this.files = [];
189
+ }
190
+ this.valueChange.emit(newValue);
191
+ }
192
+ watchMultiple() {
193
+ if (this.multiple === false && this.files.length > 1) {
194
+ throw new Error(`<mg-input-file> prop "value" must be a single file when prop "multiple" is set to false.`);
195
+ }
196
+ }
197
+ watchAccept(newValue) {
198
+ if (newValue !== undefined && !isValidString(newValue)) {
199
+ throw new Error(`<mg-input-file> prop "accept" must be a valid string.`);
200
+ }
201
+ }
202
+ handleValidityChange(newValue, _oldValue, prop) {
203
+ if (this.inputElement !== undefined) {
204
+ this.inputElement[prop] = newValue;
205
+ this.checkValidity();
206
+ if (this.hasDisplayedError) {
207
+ this.setErrorMessage();
208
+ this.hasDisplayedError = false;
209
+ }
210
+ }
211
+ }
212
+ watchDisabled(newValue) {
213
+ if (newValue) {
214
+ this.classCollection.add(classDisabled);
215
+ }
216
+ else {
217
+ this.classCollection.delete(classDisabled);
218
+ }
219
+ }
220
+ watchHelpText() {
221
+ if (!isValidString(this.helpText)) {
222
+ const helpText = [];
223
+ if (this.maxSize !== undefined) {
224
+ helpText.push(this.messages.input.file.helpText.maxSize.replace('{{maxSize}}', localeByte(this.maxSize, this.locale)));
225
+ }
226
+ if (this.accept !== undefined) {
227
+ helpText.push(this.messages.input.file.helpText.accept.replace('{{accept}}', this.accept));
228
+ }
229
+ this.helpText = helpText.join('. ');
230
+ }
231
+ }
232
+ watchFiles(newValue, oldValue) {
233
+ if (toString(newValue) !== toString(oldValue)) {
234
+ this.value = newValue.length > 0 ? newValue : undefined;
235
+ }
236
+ }
237
+ /**
238
+ * Set focus on input add file button
239
+ */
240
+ async setFocus() {
241
+ this.fileButtonElement.focus();
242
+ }
243
+ /**
244
+ * Display input error if it exists.
245
+ */
246
+ displayError() {
247
+ // Use `Promise` as requested for stencil method
248
+ // Use `requestAnimationFrame` to ensure:
249
+ // - DOM is fully updated before validation
250
+ // - Async operations are completed
251
+ // - No timing issues with Stencil's render cycle
252
+ // - Keep everything in sync both inside and outside the component
253
+ return new Promise(resolve => {
254
+ requestAnimationFrame(() => {
255
+ this.checkValidity();
256
+ this.setErrorMessage();
257
+ this.hasDisplayedError = this.invalid;
258
+ resolve();
259
+ });
260
+ });
261
+ }
262
+ /**
263
+ * Set an error and display a custom error message.
264
+ * This method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.
265
+ * It must be paired with an error message to display for the given context.
266
+ * When used to set validity to `false`, you should use this method again to reset the validity to `true`.
267
+ * @param valid - value indicating the validity
268
+ * @param errorMessage - the error message to display
269
+ * @param errorMessageLock - lock the error message and validity state
270
+ */
271
+ async setError(valid, errorMessage, errorMessageLock = false) {
272
+ if (typeof valid !== 'boolean') {
273
+ throw new Error('<mg-input-file> method "setError()" param "valid" must be a boolean.');
274
+ }
275
+ else if (errorMessage !== undefined && !isValidString(errorMessage)) {
276
+ throw new Error('<mg-input-file> method "setError()" param "errorMessage" must be a string.');
277
+ }
278
+ else {
279
+ this.customErrorMessage = {
280
+ lock: valid ? false : errorMessageLock,
281
+ message: valid ? undefined : errorMessage,
282
+ };
283
+ this.setValidity(valid);
284
+ this.setErrorMessage(true);
285
+ this.hasDisplayedError = this.invalid;
286
+ }
287
+ }
288
+ /**
289
+ * Reset value, validity and error state
290
+ */
291
+ async reset() {
292
+ this.files = [];
293
+ // Use `Promise` as requested for stencil method
294
+ // Use `requestAnimationFrame` to ensure:
295
+ // - DOM is fully updated before validation
296
+ // - Async operations are completed
297
+ // - No timing issues with Stencil's render cycle
298
+ // - Keep everything in sync both inside and outside the component
299
+ return new Promise(resolve => {
300
+ requestAnimationFrame(() => {
301
+ // unlock validity check by resetting customErrorMessage
302
+ this.customErrorMessage = { lock: false };
303
+ this.checkValidity();
304
+ this.errorMessage = undefined;
305
+ this.hasDisplayedError = false;
306
+ resolve();
307
+ });
308
+ });
309
+ }
310
+ /*************
311
+ * Lifecycle *
312
+ *************/
313
+ /**
314
+ * Check if component props are well configured on init
315
+ * @returns timeout
316
+ */
317
+ componentWillLoad() {
318
+ // Get locales
319
+ const locales = initLocales(this.element);
320
+ this.locale = locales.locale;
321
+ this.messages = locales.messages;
322
+ // Validate
323
+ this.watchValue(this.value);
324
+ this.watchDisabled(this.disabled);
325
+ this.watchHelpText();
326
+ this.watchAccept(this.accept);
327
+ this.watchMultiple();
328
+ // Check validity when component is ready
329
+ // return a promise to process action only in the FIRST render().
330
+ // https://stenciljs.com/docs/component-lifecycle#componentwillload
331
+ return setTimeout(() => {
332
+ this.checkValidity();
333
+ }, 0);
334
+ }
335
+ /**
336
+ * Render
337
+ * @returns HTML Element
338
+ */
339
+ render() {
340
+ 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) => {
341
+ this.inputElement = el;
342
+ } }), 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) => {
343
+ this.fileButtonElement = el;
344
+ } }, this.messages.input.file.browse), this.renderFiles())));
345
+ }
346
+ get element() { return getElement(this); }
347
+ static get watchers() { return {
348
+ "value": [{
349
+ "watchValue": 0
350
+ }, {
351
+ "watchMultiple": 0
352
+ }],
353
+ "multiple": [{
354
+ "watchMultiple": 0
355
+ }],
356
+ "accept": [{
357
+ "watchAccept": 0
358
+ }, {
359
+ "watchHelpText": 0
360
+ }],
361
+ "required": [{
362
+ "handleValidityChange": 0
363
+ }],
364
+ "disabled": [{
365
+ "handleValidityChange": 0
366
+ }, {
367
+ "watchDisabled": 0
368
+ }],
369
+ "helpText": [{
370
+ "watchHelpText": 0
371
+ }],
372
+ "maxSize": [{
373
+ "watchHelpText": 0
374
+ }],
375
+ "files": [{
376
+ "watchFiles": 0
377
+ }]
378
+ }; }
379
+ };
380
+ MgInputFile.style = mgInputFileCss();
381
+
382
+ export { MgInputFile as mg_input_file };
@@ -1,7 +1,7 @@
1
- import { r as registerInstance, c as createEvent, h, a as getElement } from './index-BluNKQ3L.js';
1
+ import { r as registerInstance, c as createEvent, h, a as getElement } from './index-DFwaH2hS.js';
2
2
  import { i as isValidString, C as ClassList, t as toString } from './index-C7xjtdiw.js';
3
- import { c as classReadonly, a as classDisabled } from './mg-input.conf-DDnrE1hD.js';
4
- import { i as initLocales } from './index-CNX6lq0x.js';
3
+ import { c as classReadonly, a as classDisabled } from './mg-input.conf-C9rmNQIL.js';
4
+ import { i as initLocales } from './index-D-uaxCxH.js';
5
5
 
6
6
  /** Detect free variable `global` from Node.js. */
7
7
  var freeGlobal = typeof global == 'object' && global && global.Object === Object && global;
@@ -16374,11 +16374,9 @@ const defineEditor = (wrapperElement, { value, modules, readOnly, placeholder, h
16374
16374
  return editor;
16375
16375
  };
16376
16376
 
16377
- const quillSnowCss = "/*!\n * Quill Editor v2.0.3\n * https://quilljs.com\n * Copyright (c) 2017-2024, Slab\n * Copyright (c) 2014, Jason Chen\n * Copyright (c) 2013, salesforce.com\n */.ql-container{box-sizing:border-box;font-family:Helvetica,Arial,sans-serif;font-size:13px;height:100%;margin:0;position:relative}.ql-container.ql-disabled .ql-tooltip{visibility:hidden}.ql-container:not(.ql-disabled) li[data-list=checked]>.ql-ui,.ql-container:not(.ql-disabled) li[data-list=unchecked]>.ql-ui{cursor:pointer}.ql-clipboard{left:-100000px;height:1px;overflow-y:hidden;position:absolute;top:50%}.ql-clipboard p{margin:0;padding:0}.ql-editor{box-sizing:border-box;counter-reset:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;line-height:1.42;height:100%;outline:none;overflow-y:auto;padding:12px 15px;tab-size:4;-moz-tab-size:4;text-align:left;white-space:pre-wrap;word-wrap:break-word}.ql-editor>*{cursor:text}.ql-editor p,.ql-editor ol,.ql-editor pre,.ql-editor blockquote,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6{margin:0;padding:0}@supports (counter-set:none){.ql-editor p,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6{counter-set:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor p,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6{counter-reset:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}.ql-editor table{border-collapse:collapse}.ql-editor td{border:1px solid #000;padding:2px 5px}.ql-editor ol{padding-left:1.5em}.ql-editor li{list-style-type:none;padding-left:1.5em;position:relative}.ql-editor li>.ql-ui:before{display:inline-block;margin-left:-1.5em;margin-right:.3em;text-align:right;white-space:nowrap;width:1.2em}.ql-editor li[data-list=checked]>.ql-ui,.ql-editor li[data-list=unchecked]>.ql-ui{color:#777}.ql-editor li[data-list=bullet]>.ql-ui:before{content:'\\2022'}.ql-editor li[data-list=checked]>.ql-ui:before{content:'\\2611'}.ql-editor li[data-list=unchecked]>.ql-ui:before{content:'\\2610'}@supports (counter-set:none){.ql-editor li[data-list]{counter-set:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list]{counter-reset:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}.ql-editor li[data-list=ordered]{counter-increment:list-0}.ql-editor li[data-list=ordered]>.ql-ui:before{content:counter(list-0, decimal) '. '}.ql-editor li[data-list=ordered].ql-indent-1{counter-increment:list-1}.ql-editor li[data-list=ordered].ql-indent-1>.ql-ui:before{content:counter(list-1, lower-alpha) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-1{counter-set:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-1{counter-reset:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-2{counter-increment:list-2}.ql-editor li[data-list=ordered].ql-indent-2>.ql-ui:before{content:counter(list-2, lower-roman) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-2{counter-set:list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-2{counter-reset:list-3 list-4 list-5 list-6 list-7 list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-3{counter-increment:list-3}.ql-editor li[data-list=ordered].ql-indent-3>.ql-ui:before{content:counter(list-3, decimal) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-3{counter-set:list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-3{counter-reset:list-4 list-5 list-6 list-7 list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-4{counter-increment:list-4}.ql-editor li[data-list=ordered].ql-indent-4>.ql-ui:before{content:counter(list-4, lower-alpha) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-4{counter-set:list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-4{counter-reset:list-5 list-6 list-7 list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-5{counter-increment:list-5}.ql-editor li[data-list=ordered].ql-indent-5>.ql-ui:before{content:counter(list-5, lower-roman) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-5{counter-set:list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-5{counter-reset:list-6 list-7 list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-6{counter-increment:list-6}.ql-editor li[data-list=ordered].ql-indent-6>.ql-ui:before{content:counter(list-6, decimal) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-6{counter-set:list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-6{counter-reset:list-7 list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-7{counter-increment:list-7}.ql-editor li[data-list=ordered].ql-indent-7>.ql-ui:before{content:counter(list-7, lower-alpha) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-7{counter-set:list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-7{counter-reset:list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-8{counter-increment:list-8}.ql-editor li[data-list=ordered].ql-indent-8>.ql-ui:before{content:counter(list-8, lower-roman) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-8{counter-set:list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-8{counter-reset:list-9}}.ql-editor li[data-list=ordered].ql-indent-9{counter-increment:list-9}.ql-editor li[data-list=ordered].ql-indent-9>.ql-ui:before{content:counter(list-9, decimal) '. '}.ql-editor .ql-indent-1:not(.ql-direction-rtl){padding-left:3em}.ql-editor li.ql-indent-1:not(.ql-direction-rtl){padding-left:4.5em}.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right{padding-right:3em}.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right{padding-right:4.5em}.ql-editor .ql-indent-2:not(.ql-direction-rtl){padding-left:6em}.ql-editor li.ql-indent-2:not(.ql-direction-rtl){padding-left:7.5em}.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right{padding-right:6em}.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right{padding-right:7.5em}.ql-editor .ql-indent-3:not(.ql-direction-rtl){padding-left:9em}.ql-editor li.ql-indent-3:not(.ql-direction-rtl){padding-left:10.5em}.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right{padding-right:9em}.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right{padding-right:10.5em}.ql-editor .ql-indent-4:not(.ql-direction-rtl){padding-left:12em}.ql-editor li.ql-indent-4:not(.ql-direction-rtl){padding-left:13.5em}.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right{padding-right:12em}.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right{padding-right:13.5em}.ql-editor .ql-indent-5:not(.ql-direction-rtl){padding-left:15em}.ql-editor li.ql-indent-5:not(.ql-direction-rtl){padding-left:16.5em}.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right{padding-right:15em}.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right{padding-right:16.5em}.ql-editor .ql-indent-6:not(.ql-direction-rtl){padding-left:18em}.ql-editor li.ql-indent-6:not(.ql-direction-rtl){padding-left:19.5em}.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right{padding-right:18em}.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right{padding-right:19.5em}.ql-editor .ql-indent-7:not(.ql-direction-rtl){padding-left:21em}.ql-editor li.ql-indent-7:not(.ql-direction-rtl){padding-left:22.5em}.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right{padding-right:21em}.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right{padding-right:22.5em}.ql-editor .ql-indent-8:not(.ql-direction-rtl){padding-left:24em}.ql-editor li.ql-indent-8:not(.ql-direction-rtl){padding-left:25.5em}.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right{padding-right:24em}.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right{padding-right:25.5em}.ql-editor .ql-indent-9:not(.ql-direction-rtl){padding-left:27em}.ql-editor li.ql-indent-9:not(.ql-direction-rtl){padding-left:28.5em}.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right{padding-right:27em}.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right{padding-right:28.5em}.ql-editor li.ql-direction-rtl{padding-right:1.5em}.ql-editor li.ql-direction-rtl>.ql-ui:before{margin-left:.3em;margin-right:-1.5em;text-align:left}.ql-editor table{table-layout:fixed;width:100%}.ql-editor table td{outline:none}.ql-editor .ql-code-block-container{font-family:monospace}.ql-editor .ql-video{display:block;max-width:100%}.ql-editor .ql-video.ql-align-center{margin:0 auto}.ql-editor .ql-video.ql-align-right{margin:0 0 0 auto}.ql-editor .ql-bg-black{background-color:#000}.ql-editor .ql-bg-red{background-color:#e60000}.ql-editor .ql-bg-orange{background-color:#f90}.ql-editor .ql-bg-yellow{background-color:#ff0}.ql-editor .ql-bg-green{background-color:#008a00}.ql-editor .ql-bg-blue{background-color:#06c}.ql-editor .ql-bg-purple{background-color:#93f}.ql-editor .ql-color-white{color:#fff}.ql-editor .ql-color-red{color:#e60000}.ql-editor .ql-color-orange{color:#f90}.ql-editor .ql-color-yellow{color:#ff0}.ql-editor .ql-color-green{color:#008a00}.ql-editor .ql-color-blue{color:#06c}.ql-editor .ql-color-purple{color:#93f}.ql-editor .ql-font-serif{font-family:Georgia,Times New Roman,serif}.ql-editor .ql-font-monospace{font-family:Monaco,Courier New,monospace}.ql-editor .ql-size-small{font-size:.75em}.ql-editor .ql-size-large{font-size:1.5em}.ql-editor .ql-size-huge{font-size:2.5em}.ql-editor .ql-direction-rtl{direction:rtl;text-align:inherit}.ql-editor .ql-align-center{text-align:center}.ql-editor .ql-align-justify{text-align:justify}.ql-editor .ql-align-right{text-align:right}.ql-editor .ql-ui{position:absolute}.ql-editor.ql-blank::before{color:rgba(0,0,0,0.6);content:attr(data-placeholder);font-style:italic;left:15px;pointer-events:none;position:absolute;right:15px}.ql-snow.ql-toolbar:after,.ql-snow .ql-toolbar:after{clear:both;content:'';display:table}.ql-snow.ql-toolbar button,.ql-snow .ql-toolbar button{background:none;border:none;cursor:pointer;display:inline-block;float:left;height:24px;padding:3px 5px;width:28px}.ql-snow.ql-toolbar button svg,.ql-snow .ql-toolbar button svg{float:left;height:100%}.ql-snow.ql-toolbar button:active:hover,.ql-snow .ql-toolbar button:active:hover{outline:none}.ql-snow.ql-toolbar input.ql-image[type=file],.ql-snow .ql-toolbar input.ql-image[type=file]{display:none}.ql-snow.ql-toolbar button:hover,.ql-snow .ql-toolbar button:hover,.ql-snow.ql-toolbar button:focus,.ql-snow .ql-toolbar button:focus,.ql-snow.ql-toolbar button.ql-active,.ql-snow .ql-toolbar button.ql-active,.ql-snow.ql-toolbar .ql-picker-label:hover,.ql-snow .ql-toolbar .ql-picker-label:hover,.ql-snow.ql-toolbar .ql-picker-label.ql-active,.ql-snow .ql-toolbar .ql-picker-label.ql-active,.ql-snow.ql-toolbar .ql-picker-item:hover,.ql-snow .ql-toolbar .ql-picker-item:hover,.ql-snow.ql-toolbar .ql-picker-item.ql-selected,.ql-snow .ql-toolbar .ql-picker-item.ql-selected{color:#06c}.ql-snow.ql-toolbar button:hover .ql-fill,.ql-snow .ql-toolbar button:hover .ql-fill,.ql-snow.ql-toolbar button:focus .ql-fill,.ql-snow .ql-toolbar button:focus .ql-fill,.ql-snow.ql-toolbar button.ql-active .ql-fill,.ql-snow .ql-toolbar button.ql-active .ql-fill,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill{fill:#06c}.ql-snow.ql-toolbar button:hover .ql-stroke,.ql-snow .ql-toolbar button:hover .ql-stroke,.ql-snow.ql-toolbar button:focus .ql-stroke,.ql-snow .ql-toolbar button:focus .ql-stroke,.ql-snow.ql-toolbar button.ql-active .ql-stroke,.ql-snow .ql-toolbar button.ql-active .ql-stroke,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,.ql-snow.ql-toolbar button:hover .ql-stroke-miter,.ql-snow .ql-toolbar button:hover .ql-stroke-miter,.ql-snow.ql-toolbar button:focus .ql-stroke-miter,.ql-snow .ql-toolbar button:focus .ql-stroke-miter,.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter{stroke:#06c}@media (pointer:coarse){.ql-snow.ql-toolbar button:hover:not(.ql-active),.ql-snow .ql-toolbar button:hover:not(.ql-active){color:#444}.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill{fill:#444}.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter{stroke:#444}}.ql-snow{box-sizing:border-box}.ql-snow *{box-sizing:border-box}.ql-snow .ql-hidden{display:none}.ql-snow .ql-out-bottom,.ql-snow .ql-out-top{visibility:hidden}.ql-snow .ql-tooltip{position:absolute;transform:translateY(10px)}.ql-snow .ql-tooltip a{cursor:pointer;text-decoration:none}.ql-snow .ql-tooltip.ql-flip{transform:translateY(-10px)}.ql-snow .ql-formats{display:inline-block;vertical-align:middle}.ql-snow .ql-formats:after{clear:both;content:'';display:table}.ql-snow .ql-stroke{fill:none;stroke:#444;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}.ql-snow .ql-stroke-miter{fill:none;stroke:#444;stroke-miterlimit:10;stroke-width:2}.ql-snow .ql-fill,.ql-snow .ql-stroke.ql-fill{fill:#444}.ql-snow .ql-empty{fill:none}.ql-snow .ql-even{fill-rule:evenodd}.ql-snow .ql-thin,.ql-snow .ql-stroke.ql-thin{stroke-width:1}.ql-snow .ql-transparent{opacity:.4}.ql-snow .ql-direction svg:last-child{display:none}.ql-snow .ql-direction.ql-active svg:last-child{display:inline}.ql-snow .ql-direction.ql-active svg:first-child{display:none}.ql-snow .ql-editor h1{font-size:2em}.ql-snow .ql-editor h2{font-size:1.5em}.ql-snow .ql-editor h3{font-size:1.17em}.ql-snow .ql-editor h4{font-size:1em}.ql-snow .ql-editor h5{font-size:.83em}.ql-snow .ql-editor h6{font-size:.67em}.ql-snow .ql-editor a{text-decoration:underline}.ql-snow .ql-editor blockquote{border-left:4px solid #ccc;margin-bottom:5px;margin-top:5px;padding-left:16px}.ql-snow .ql-editor code,.ql-snow .ql-editor .ql-code-block-container{background-color:#f0f0f0;border-radius:3px}.ql-snow .ql-editor .ql-code-block-container{margin-bottom:5px;margin-top:5px;padding:5px 10px}.ql-snow .ql-editor code{font-size:85%;padding:2px 4px}.ql-snow .ql-editor .ql-code-block-container{background-color:#23241f;color:#f8f8f2;overflow:visible}.ql-snow .ql-editor img{max-width:100%}.ql-snow .ql-picker{color:#444;display:inline-block;float:left;font-size:14px;font-weight:500;height:24px;position:relative;vertical-align:middle}.ql-snow .ql-picker-label{cursor:pointer;display:inline-block;height:100%;padding-left:8px;padding-right:2px;position:relative;width:100%}.ql-snow .ql-picker-label::before{display:inline-block;line-height:22px}.ql-snow .ql-picker-options{background-color:#fff;display:none;min-width:100%;padding:4px 8px;position:absolute;white-space:nowrap}.ql-snow .ql-picker-options .ql-picker-item{cursor:pointer;display:block;padding-bottom:5px;padding-top:5px}.ql-snow .ql-picker.ql-expanded .ql-picker-label{color:#ccc;z-index:2}.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill{fill:#ccc}.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke{stroke:#ccc}.ql-snow .ql-picker.ql-expanded .ql-picker-options{display:block;margin-top:-1px;top:100%;z-index:1}.ql-snow .ql-color-picker,.ql-snow .ql-icon-picker{width:28px}.ql-snow .ql-color-picker .ql-picker-label,.ql-snow .ql-icon-picker .ql-picker-label{padding:2px 4px}.ql-snow .ql-color-picker .ql-picker-label svg,.ql-snow .ql-icon-picker .ql-picker-label svg{right:4px}.ql-snow .ql-icon-picker .ql-picker-options{padding:4px 0}.ql-snow .ql-icon-picker .ql-picker-item{height:24px;width:24px;padding:2px 4px}.ql-snow .ql-color-picker .ql-picker-options{padding:3px 5px;width:152px}.ql-snow .ql-color-picker .ql-picker-item{border:1px solid transparent;float:left;height:16px;margin:2px;padding:0;width:16px}.ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg{position:absolute;margin-top:-9px;right:0;top:50%;width:18px}.ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=''])::before{content:attr(data-label)}.ql-snow .ql-picker.ql-header{width:98px}.ql-snow .ql-picker.ql-header .ql-picker-label::before,.ql-snow .ql-picker.ql-header .ql-picker-item::before{content:'Normal'}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"1\"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"1\"]::before{content:'Heading 1'}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"2\"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"2\"]::before{content:'Heading 2'}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"3\"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"3\"]::before{content:'Heading 3'}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"4\"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"4\"]::before{content:'Heading 4'}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"5\"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"5\"]::before{content:'Heading 5'}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"6\"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"6\"]::before{content:'Heading 6'}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"1\"]::before{font-size:2em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"2\"]::before{font-size:1.5em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"3\"]::before{font-size:1.17em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"4\"]::before{font-size:1em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"5\"]::before{font-size:.83em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"6\"]::before{font-size:.67em}.ql-snow .ql-picker.ql-font{width:108px}.ql-snow .ql-picker.ql-font .ql-picker-label::before,.ql-snow .ql-picker.ql-font .ql-picker-item::before{content:'Sans Serif'}.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]::before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before{content:'Serif'}.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]::before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before{content:'Monospace'}.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before{font-family:Georgia,Times New Roman,serif}.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before{font-family:Monaco,Courier New,monospace}.ql-snow .ql-picker.ql-size{width:98px}.ql-snow .ql-picker.ql-size .ql-picker-label::before,.ql-snow .ql-picker.ql-size .ql-picker-item::before{content:'Normal'}.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]::before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before{content:'Small'}.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]::before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before{content:'Large'}.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]::before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before{content:'Huge'}.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before{font-size:10px}.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before{font-size:18px}.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before{font-size:32px}.ql-snow .ql-color-picker.ql-background .ql-picker-item{background-color:#fff}.ql-snow .ql-color-picker.ql-color .ql-picker-item{background-color:#000}.ql-code-block-container{position:relative}.ql-code-block-container .ql-ui{right:5px;top:5px}.ql-toolbar.ql-snow{border:1px solid #ccc;box-sizing:border-box;font-family:'Helvetica Neue','Helvetica','Arial',sans-serif;padding:8px}.ql-toolbar.ql-snow .ql-formats{margin-right:15px}.ql-toolbar.ql-snow .ql-picker-label{border:1px solid transparent}.ql-toolbar.ql-snow .ql-picker-options{border:1px solid transparent;box-shadow:rgba(0,0,0,0.2) 0 2px 8px}.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label{border-color:#ccc}.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options{border-color:#ccc}.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover{border-color:#000}.ql-toolbar.ql-snow+.ql-container.ql-snow{border-top:0}.ql-snow .ql-tooltip{background-color:#fff;border:1px solid #ccc;box-shadow:0 0 5px #ddd;color:#444;padding:5px 12px;white-space:nowrap}.ql-snow .ql-tooltip::before{content:\"Visit URL:\";line-height:26px;margin-right:8px}.ql-snow .ql-tooltip input[type=text]{display:none;border:1px solid #ccc;font-size:13px;height:26px;margin:0;padding:3px 5px;width:170px}.ql-snow .ql-tooltip a.ql-preview{display:inline-block;max-width:200px;overflow-x:hidden;text-overflow:ellipsis;vertical-align:top}.ql-snow .ql-tooltip a.ql-action::after{border-right:1px solid #ccc;content:'Edit';margin-left:16px;padding-right:8px}.ql-snow .ql-tooltip a.ql-remove::before{content:'Remove';margin-left:8px}.ql-snow .ql-tooltip a{line-height:26px}.ql-snow .ql-tooltip.ql-editing a.ql-preview,.ql-snow .ql-tooltip.ql-editing a.ql-remove{display:none}.ql-snow .ql-tooltip.ql-editing input[type=text]{display:inline-block}.ql-snow .ql-tooltip.ql-editing a.ql-action::after{border-right:0;content:'Save';padding-right:0}.ql-snow .ql-tooltip[data-mode=link]::before{content:\"Enter link:\"}.ql-snow .ql-tooltip[data-mode=formula]::before{content:\"Enter formula:\"}.ql-snow .ql-tooltip[data-mode=video]::before{content:\"Enter video:\"}.ql-snow a{color:#06c}.ql-container.ql-snow{border:1px solid #ccc}";
16377
+ const quillSnowCss = () => `.ql-container{box-sizing:border-box;font-family:Helvetica,Arial,sans-serif;font-size:13px;height:100%;margin:0;position:relative}.ql-container.ql-disabled .ql-tooltip{visibility:hidden}.ql-container:not(.ql-disabled) li[data-list=checked]>.ql-ui,.ql-container:not(.ql-disabled) li[data-list=unchecked]>.ql-ui{cursor:pointer}.ql-clipboard{left:-100000px;height:1px;overflow-y:hidden;position:absolute;top:50%}.ql-clipboard p{margin:0;padding:0}.ql-editor{box-sizing:border-box;counter-reset:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;line-height:1.42;height:100%;outline:none;overflow-y:auto;padding:12px 15px;tab-size:4;-moz-tab-size:4;text-align:left;white-space:pre-wrap;word-wrap:break-word}.ql-editor>*{cursor:text}.ql-editor p,.ql-editor ol,.ql-editor pre,.ql-editor blockquote,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6{margin:0;padding:0}@supports (counter-set:none){.ql-editor p,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6{counter-set:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor p,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6{counter-reset:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}.ql-editor table{border-collapse:collapse}.ql-editor td{border:1px solid #000;padding:2px 5px}.ql-editor ol{padding-left:1.5em}.ql-editor li{list-style-type:none;padding-left:1.5em;position:relative}.ql-editor li>.ql-ui:before{display:inline-block;margin-left:-1.5em;margin-right:.3em;text-align:right;white-space:nowrap;width:1.2em}.ql-editor li[data-list=checked]>.ql-ui,.ql-editor li[data-list=unchecked]>.ql-ui{color:#777}.ql-editor li[data-list=bullet]>.ql-ui:before{content:'\\2022'}.ql-editor li[data-list=checked]>.ql-ui:before{content:'\\2611'}.ql-editor li[data-list=unchecked]>.ql-ui:before{content:'\\2610'}@supports (counter-set:none){.ql-editor li[data-list]{counter-set:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list]{counter-reset:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}.ql-editor li[data-list=ordered]{counter-increment:list-0}.ql-editor li[data-list=ordered]>.ql-ui:before{content:counter(list-0, decimal) '. '}.ql-editor li[data-list=ordered].ql-indent-1{counter-increment:list-1}.ql-editor li[data-list=ordered].ql-indent-1>.ql-ui:before{content:counter(list-1, lower-alpha) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-1{counter-set:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-1{counter-reset:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-2{counter-increment:list-2}.ql-editor li[data-list=ordered].ql-indent-2>.ql-ui:before{content:counter(list-2, lower-roman) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-2{counter-set:list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-2{counter-reset:list-3 list-4 list-5 list-6 list-7 list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-3{counter-increment:list-3}.ql-editor li[data-list=ordered].ql-indent-3>.ql-ui:before{content:counter(list-3, decimal) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-3{counter-set:list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-3{counter-reset:list-4 list-5 list-6 list-7 list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-4{counter-increment:list-4}.ql-editor li[data-list=ordered].ql-indent-4>.ql-ui:before{content:counter(list-4, lower-alpha) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-4{counter-set:list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-4{counter-reset:list-5 list-6 list-7 list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-5{counter-increment:list-5}.ql-editor li[data-list=ordered].ql-indent-5>.ql-ui:before{content:counter(list-5, lower-roman) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-5{counter-set:list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-5{counter-reset:list-6 list-7 list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-6{counter-increment:list-6}.ql-editor li[data-list=ordered].ql-indent-6>.ql-ui:before{content:counter(list-6, decimal) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-6{counter-set:list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-6{counter-reset:list-7 list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-7{counter-increment:list-7}.ql-editor li[data-list=ordered].ql-indent-7>.ql-ui:before{content:counter(list-7, lower-alpha) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-7{counter-set:list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-7{counter-reset:list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-8{counter-increment:list-8}.ql-editor li[data-list=ordered].ql-indent-8>.ql-ui:before{content:counter(list-8, lower-roman) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-8{counter-set:list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-8{counter-reset:list-9}}.ql-editor li[data-list=ordered].ql-indent-9{counter-increment:list-9}.ql-editor li[data-list=ordered].ql-indent-9>.ql-ui:before{content:counter(list-9, decimal) '. '}.ql-editor .ql-indent-1:not(.ql-direction-rtl){padding-left:3em}.ql-editor li.ql-indent-1:not(.ql-direction-rtl){padding-left:4.5em}.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right{padding-right:3em}.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right{padding-right:4.5em}.ql-editor .ql-indent-2:not(.ql-direction-rtl){padding-left:6em}.ql-editor li.ql-indent-2:not(.ql-direction-rtl){padding-left:7.5em}.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right{padding-right:6em}.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right{padding-right:7.5em}.ql-editor .ql-indent-3:not(.ql-direction-rtl){padding-left:9em}.ql-editor li.ql-indent-3:not(.ql-direction-rtl){padding-left:10.5em}.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right{padding-right:9em}.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right{padding-right:10.5em}.ql-editor .ql-indent-4:not(.ql-direction-rtl){padding-left:12em}.ql-editor li.ql-indent-4:not(.ql-direction-rtl){padding-left:13.5em}.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right{padding-right:12em}.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right{padding-right:13.5em}.ql-editor .ql-indent-5:not(.ql-direction-rtl){padding-left:15em}.ql-editor li.ql-indent-5:not(.ql-direction-rtl){padding-left:16.5em}.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right{padding-right:15em}.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right{padding-right:16.5em}.ql-editor .ql-indent-6:not(.ql-direction-rtl){padding-left:18em}.ql-editor li.ql-indent-6:not(.ql-direction-rtl){padding-left:19.5em}.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right{padding-right:18em}.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right{padding-right:19.5em}.ql-editor .ql-indent-7:not(.ql-direction-rtl){padding-left:21em}.ql-editor li.ql-indent-7:not(.ql-direction-rtl){padding-left:22.5em}.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right{padding-right:21em}.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right{padding-right:22.5em}.ql-editor .ql-indent-8:not(.ql-direction-rtl){padding-left:24em}.ql-editor li.ql-indent-8:not(.ql-direction-rtl){padding-left:25.5em}.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right{padding-right:24em}.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right{padding-right:25.5em}.ql-editor .ql-indent-9:not(.ql-direction-rtl){padding-left:27em}.ql-editor li.ql-indent-9:not(.ql-direction-rtl){padding-left:28.5em}.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right{padding-right:27em}.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right{padding-right:28.5em}.ql-editor li.ql-direction-rtl{padding-right:1.5em}.ql-editor li.ql-direction-rtl>.ql-ui:before{margin-left:.3em;margin-right:-1.5em;text-align:left}.ql-editor table{table-layout:fixed;width:100%}.ql-editor table td{outline:none}.ql-editor .ql-code-block-container{font-family:monospace}.ql-editor .ql-video{display:block;max-width:100%}.ql-editor .ql-video.ql-align-center{margin:0 auto}.ql-editor .ql-video.ql-align-right{margin:0 0 0 auto}.ql-editor .ql-bg-black{background-color:#000}.ql-editor .ql-bg-red{background-color:#e60000}.ql-editor .ql-bg-orange{background-color:#f90}.ql-editor .ql-bg-yellow{background-color:#ff0}.ql-editor .ql-bg-green{background-color:#008a00}.ql-editor .ql-bg-blue{background-color:#06c}.ql-editor .ql-bg-purple{background-color:#93f}.ql-editor .ql-color-white{color:#fff}.ql-editor .ql-color-red{color:#e60000}.ql-editor .ql-color-orange{color:#f90}.ql-editor .ql-color-yellow{color:#ff0}.ql-editor .ql-color-green{color:#008a00}.ql-editor .ql-color-blue{color:#06c}.ql-editor .ql-color-purple{color:#93f}.ql-editor .ql-font-serif{font-family:Georgia,Times New Roman,serif}.ql-editor .ql-font-monospace{font-family:Monaco,Courier New,monospace}.ql-editor .ql-size-small{font-size:.75em}.ql-editor .ql-size-large{font-size:1.5em}.ql-editor .ql-size-huge{font-size:2.5em}.ql-editor .ql-direction-rtl{direction:rtl;text-align:inherit}.ql-editor .ql-align-center{text-align:center}.ql-editor .ql-align-justify{text-align:justify}.ql-editor .ql-align-right{text-align:right}.ql-editor .ql-ui{position:absolute}.ql-editor.ql-blank::before{color:rgba(0,0,0,0.6);content:attr(data-placeholder);font-style:italic;left:15px;pointer-events:none;position:absolute;right:15px}.ql-snow.ql-toolbar:after,.ql-snow .ql-toolbar:after{clear:both;content:'';display:table}.ql-snow.ql-toolbar button,.ql-snow .ql-toolbar button{background:none;border:none;cursor:pointer;display:inline-block;float:left;height:24px;padding:3px 5px;width:28px}.ql-snow.ql-toolbar button svg,.ql-snow .ql-toolbar button svg{float:left;height:100%}.ql-snow.ql-toolbar button:active:hover,.ql-snow .ql-toolbar button:active:hover{outline:none}.ql-snow.ql-toolbar input.ql-image[type=file],.ql-snow .ql-toolbar input.ql-image[type=file]{display:none}.ql-snow.ql-toolbar button:hover,.ql-snow .ql-toolbar button:hover,.ql-snow.ql-toolbar button:focus,.ql-snow .ql-toolbar button:focus,.ql-snow.ql-toolbar button.ql-active,.ql-snow .ql-toolbar button.ql-active,.ql-snow.ql-toolbar .ql-picker-label:hover,.ql-snow .ql-toolbar .ql-picker-label:hover,.ql-snow.ql-toolbar .ql-picker-label.ql-active,.ql-snow .ql-toolbar .ql-picker-label.ql-active,.ql-snow.ql-toolbar .ql-picker-item:hover,.ql-snow .ql-toolbar .ql-picker-item:hover,.ql-snow.ql-toolbar .ql-picker-item.ql-selected,.ql-snow .ql-toolbar .ql-picker-item.ql-selected{color:#06c}.ql-snow.ql-toolbar button:hover .ql-fill,.ql-snow .ql-toolbar button:hover .ql-fill,.ql-snow.ql-toolbar button:focus .ql-fill,.ql-snow .ql-toolbar button:focus .ql-fill,.ql-snow.ql-toolbar button.ql-active .ql-fill,.ql-snow .ql-toolbar button.ql-active .ql-fill,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill{fill:#06c}.ql-snow.ql-toolbar button:hover .ql-stroke,.ql-snow .ql-toolbar button:hover .ql-stroke,.ql-snow.ql-toolbar button:focus .ql-stroke,.ql-snow .ql-toolbar button:focus .ql-stroke,.ql-snow.ql-toolbar button.ql-active .ql-stroke,.ql-snow .ql-toolbar button.ql-active .ql-stroke,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,.ql-snow.ql-toolbar button:hover .ql-stroke-miter,.ql-snow .ql-toolbar button:hover .ql-stroke-miter,.ql-snow.ql-toolbar button:focus .ql-stroke-miter,.ql-snow .ql-toolbar button:focus .ql-stroke-miter,.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter{stroke:#06c}@media (pointer:coarse){.ql-snow.ql-toolbar button:hover:not(.ql-active),.ql-snow .ql-toolbar button:hover:not(.ql-active){color:#444}.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill{fill:#444}.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter{stroke:#444}}.ql-snow{box-sizing:border-box}.ql-snow *{box-sizing:border-box}.ql-snow .ql-hidden{display:none}.ql-snow .ql-out-bottom,.ql-snow .ql-out-top{visibility:hidden}.ql-snow .ql-tooltip{position:absolute;transform:translateY(10px)}.ql-snow .ql-tooltip a{cursor:pointer;text-decoration:none}.ql-snow .ql-tooltip.ql-flip{transform:translateY(-10px)}.ql-snow .ql-formats{display:inline-block;vertical-align:middle}.ql-snow .ql-formats:after{clear:both;content:'';display:table}.ql-snow .ql-stroke{fill:none;stroke:#444;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}.ql-snow .ql-stroke-miter{fill:none;stroke:#444;stroke-miterlimit:10;stroke-width:2}.ql-snow .ql-fill,.ql-snow .ql-stroke.ql-fill{fill:#444}.ql-snow .ql-empty{fill:none}.ql-snow .ql-even{fill-rule:evenodd}.ql-snow .ql-thin,.ql-snow .ql-stroke.ql-thin{stroke-width:1}.ql-snow .ql-transparent{opacity:.4}.ql-snow .ql-direction svg:last-child{display:none}.ql-snow .ql-direction.ql-active svg:last-child{display:inline}.ql-snow .ql-direction.ql-active svg:first-child{display:none}.ql-snow .ql-editor h1{font-size:2em}.ql-snow .ql-editor h2{font-size:1.5em}.ql-snow .ql-editor h3{font-size:1.17em}.ql-snow .ql-editor h4{font-size:1em}.ql-snow .ql-editor h5{font-size:.83em}.ql-snow .ql-editor h6{font-size:.67em}.ql-snow .ql-editor a{text-decoration:underline}.ql-snow .ql-editor blockquote{border-left:4px solid #ccc;margin-bottom:5px;margin-top:5px;padding-left:16px}.ql-snow .ql-editor code,.ql-snow .ql-editor .ql-code-block-container{background-color:#f0f0f0;border-radius:3px}.ql-snow .ql-editor .ql-code-block-container{margin-bottom:5px;margin-top:5px;padding:5px 10px}.ql-snow .ql-editor code{font-size:85%;padding:2px 4px}.ql-snow .ql-editor .ql-code-block-container{background-color:#23241f;color:#f8f8f2;overflow:visible}.ql-snow .ql-editor img{max-width:100%}.ql-snow .ql-picker{color:#444;display:inline-block;float:left;font-size:14px;font-weight:500;height:24px;position:relative;vertical-align:middle}.ql-snow .ql-picker-label{cursor:pointer;display:inline-block;height:100%;padding-left:8px;padding-right:2px;position:relative;width:100%}.ql-snow .ql-picker-label::before{display:inline-block;line-height:22px}.ql-snow .ql-picker-options{background-color:#fff;display:none;min-width:100%;padding:4px 8px;position:absolute;white-space:nowrap}.ql-snow .ql-picker-options .ql-picker-item{cursor:pointer;display:block;padding-bottom:5px;padding-top:5px}.ql-snow .ql-picker.ql-expanded .ql-picker-label{color:#ccc;z-index:2}.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill{fill:#ccc}.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke{stroke:#ccc}.ql-snow .ql-picker.ql-expanded .ql-picker-options{display:block;margin-top:-1px;top:100%;z-index:1}.ql-snow .ql-color-picker,.ql-snow .ql-icon-picker{width:28px}.ql-snow .ql-color-picker .ql-picker-label,.ql-snow .ql-icon-picker .ql-picker-label{padding:2px 4px}.ql-snow .ql-color-picker .ql-picker-label svg,.ql-snow .ql-icon-picker .ql-picker-label svg{right:4px}.ql-snow .ql-icon-picker .ql-picker-options{padding:4px 0}.ql-snow .ql-icon-picker .ql-picker-item{height:24px;width:24px;padding:2px 4px}.ql-snow .ql-color-picker .ql-picker-options{padding:3px 5px;width:152px}.ql-snow .ql-color-picker .ql-picker-item{border:1px solid transparent;float:left;height:16px;margin:2px;padding:0;width:16px}.ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg{position:absolute;margin-top:-9px;right:0;top:50%;width:18px}.ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=''])::before{content:attr(data-label)}.ql-snow .ql-picker.ql-header{width:98px}.ql-snow .ql-picker.ql-header .ql-picker-label::before,.ql-snow .ql-picker.ql-header .ql-picker-item::before{content:'Normal'}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before{content:'Heading 1'}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before{content:'Heading 2'}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before{content:'Heading 3'}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before{content:'Heading 4'}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before{content:'Heading 5'}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before{content:'Heading 6'}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before{font-size:2em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before{font-size:1.5em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before{font-size:1.17em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before{font-size:1em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before{font-size:.83em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before{font-size:.67em}.ql-snow .ql-picker.ql-font{width:108px}.ql-snow .ql-picker.ql-font .ql-picker-label::before,.ql-snow .ql-picker.ql-font .ql-picker-item::before{content:'Sans Serif'}.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]::before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before{content:'Serif'}.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]::before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before{content:'Monospace'}.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before{font-family:Georgia,Times New Roman,serif}.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before{font-family:Monaco,Courier New,monospace}.ql-snow .ql-picker.ql-size{width:98px}.ql-snow .ql-picker.ql-size .ql-picker-label::before,.ql-snow .ql-picker.ql-size .ql-picker-item::before{content:'Normal'}.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]::before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before{content:'Small'}.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]::before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before{content:'Large'}.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]::before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before{content:'Huge'}.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before{font-size:10px}.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before{font-size:18px}.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before{font-size:32px}.ql-snow .ql-color-picker.ql-background .ql-picker-item{background-color:#fff}.ql-snow .ql-color-picker.ql-color .ql-picker-item{background-color:#000}.ql-code-block-container{position:relative}.ql-code-block-container .ql-ui{right:5px;top:5px}.ql-toolbar.ql-snow{border:1px solid #ccc;box-sizing:border-box;font-family:'Helvetica Neue','Helvetica','Arial',sans-serif;padding:8px}.ql-toolbar.ql-snow .ql-formats{margin-right:15px}.ql-toolbar.ql-snow .ql-picker-label{border:1px solid transparent}.ql-toolbar.ql-snow .ql-picker-options{border:1px solid transparent;box-shadow:rgba(0,0,0,0.2) 0 2px 8px}.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label{border-color:#ccc}.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options{border-color:#ccc}.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover{border-color:#000}.ql-toolbar.ql-snow+.ql-container.ql-snow{border-top:0}.ql-snow .ql-tooltip{background-color:#fff;border:1px solid #ccc;box-shadow:0 0 5px #ddd;color:#444;padding:5px 12px;white-space:nowrap}.ql-snow .ql-tooltip::before{content:"Visit URL:";line-height:26px;margin-right:8px}.ql-snow .ql-tooltip input[type=text]{display:none;border:1px solid #ccc;font-size:13px;height:26px;margin:0;padding:3px 5px;width:170px}.ql-snow .ql-tooltip a.ql-preview{display:inline-block;max-width:200px;overflow-x:hidden;text-overflow:ellipsis;vertical-align:top}.ql-snow .ql-tooltip a.ql-action::after{border-right:1px solid #ccc;content:'Edit';margin-left:16px;padding-right:8px}.ql-snow .ql-tooltip a.ql-remove::before{content:'Remove';margin-left:8px}.ql-snow .ql-tooltip a{line-height:26px}.ql-snow .ql-tooltip.ql-editing a.ql-preview,.ql-snow .ql-tooltip.ql-editing a.ql-remove{display:none}.ql-snow .ql-tooltip.ql-editing input[type=text]{display:inline-block}.ql-snow .ql-tooltip.ql-editing a.ql-action::after{border-right:0;content:'Save';padding-right:0}.ql-snow .ql-tooltip[data-mode=link]::before{content:"Enter link:"}.ql-snow .ql-tooltip[data-mode=formula]::before{content:"Enter formula:"}.ql-snow .ql-tooltip[data-mode=video]::before{content:"Enter video:"}.ql-snow a{color:#06c}.ql-container.ql-snow{border:1px solid #ccc}`;
16378
16378
 
16379
- const editorScss = quillSnowCss + "";
16380
-
16381
- const mgInputRichTextEditorCss = ".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-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}}a{color:inherit;text-decoration:underline}a:hover,a:focus,a:active{text-decoration:none}.mg-c-input__wrapper{display:flex;width:100%;flex-direction:column;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)}.mg-c-input__wrapper:focus-within{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus);outline:Highlight auto .1rem;outline:-webkit-focus-ring-color auto .1rem}.mg-c-input--has-error .mg-c-input__wrapper{border-color:var(--mg-b-color-danger)}.mg-c-input--disabled .mg-c-input__wrapper{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input--rich-text-editor .mg-c-input__readonly-value p{margin:0}.mg-c-input--rich-text-editor .mg-c-input__readonly-value p:not(:first-child){margin-top:1em}.mg-c-input--rich-text-editor .ql-toolbar{display:flex;flex-wrap:wrap;padding:var(--mg-b-size-8);border:0;border-radius:var(--mg-c-input-border-radius) var(--mg-c-input-border-radius) 0 0;background:var(--mg-b-color-neutral-0);border-block-end-width:var(--mg-c-input-border-width);border-block-end-color:var(--mg-c-input-color-border);border-block-end-style:solid}.mg-c-input--rich-text-editor .ql-toolbar .ql-formats{display:inline-flex;margin:inherit;gap:.2rem}.mg-c-input--rich-text-editor .ql-toolbar .ql-formats:not(:last-child)::after{width:.1rem;height:var(--mg-b-size-16);background:var(--mg-c-input-color-border);content:\"\";margin-block:var(--mg-b-size-8);margin-inline:var(--mg-b-size-8)}.mg-c-input--rich-text-editor .ql-toolbar button .ql-fill,.mg-c-input--rich-text-editor .ql-toolbar button:hover .ql-fill,.mg-c-input--rich-text-editor .ql-toolbar button:focus .ql-fill,.mg-c-input--rich-text-editor .ql-toolbar button.ql-active .ql-fill{fill:currentcolor}.mg-c-input--rich-text-editor .ql-toolbar button:hover .ql-stroke,.mg-c-input--rich-text-editor .ql-toolbar button:focus .ql-stroke,.mg-c-input--rich-text-editor .ql-toolbar button.ql-active .ql-stroke,.mg-c-input--rich-text-editor .ql-toolbar button .ql-stroke{stroke:currentcolor}.mg-c-input--rich-text-editor .ql-toolbar button{display:flex;min-width:var(--mg-b-size-32);height:var(--mg-b-size-32);align-items:center;justify-content:center;padding:var(--mg-b-size-4);border:.1rem solid rgba(0,0,0,0);border-radius:var(--mg-b-size-radius);color:var(--mg-b-color-dark);float:inherit;transition-duration:.2s;transition-property:background-color,border-color;transition-timing-function:ease-in-out}.mg-c-input--rich-text-editor .ql-toolbar button svg{width:var(--mg-b-size-20);height:var(--mg-b-size-20)}.mg-c-input--rich-text-editor .ql-toolbar button:focus{color:var(--mg-b-color-dark)}.mg-c-input--rich-text-editor .ql-toolbar button:focus-visible,.mg-c-input--rich-text-editor .ql-toolbar button:hover,.mg-c-input--rich-text-editor .ql-toolbar button.ql-active{border-color:var(--mg-b-color-neutral-70);background:var(--mg-b-color-neutral-20);color:var(--mg-b-color-dark)}.mg-c-input--rich-text-editor .ql-toolbar button .ql-stroke{stroke-width:.12rem}.mg-c-input--rich-text-editor .ql-toolbar button .ql-stroke.ql-thin{stroke-width:.1rem}.mg-c-input--rich-text-editor .ql-toolbar button.ql-bold .ql-stroke{stroke-width:.2rem}.mg-c-input--rich-text-editor .ql-container{border:0;border-radius:0 0 var(--mg-c-input-border-radius) var(--mg-c-input-border-radius);margin:0 .1rem .1rem;background:var(--mg-b-color-neutral-0)}.mg-c-input--rich-text-editor .ql-editor{min-height:calc(calc(var(--mg-b-font-size) * var(--mg-b-line-height) * var(--mg-c-input-rich-text-editor-rows, 3)) + calc((var(--mg-b-size-min-height) - var(--mg-b-font-size) * var(--mg-b-line-height)) / 2));padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);color:var(--mg-b-color-dark);font-size:var(--mg-b-font-size)}.mg-c-input--rich-text-editor .ql-editor.ql-blank::before{right:var(--mg-b-size-8);left:var(--mg-b-size-8)}.mg-c-input--rich-text-editor .ql-editor p:not(:first-child){margin-top:1em}.mg-c-input--rich-text-editor.mg-c-input--disabled .ql-toolbar{pointer-events:none}.mg-c-input--rich-text-editor.mg-c-input--has-error .ql-toolbar{border-color:var(--mg-b-color-danger)}";
16379
+ const mgInputRichTextEditorCss = () => `.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-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}}a{color:inherit;text-decoration:underline}a:hover,a:focus,a:active{text-decoration:none}.mg-c-input__wrapper{display:flex;width:100%;flex-direction:column;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)}.mg-c-input__wrapper:focus-within{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus);outline:Highlight auto .1rem;outline:-webkit-focus-ring-color auto .1rem}.mg-c-input--has-error .mg-c-input__wrapper{border-color:var(--mg-b-color-danger)}.mg-c-input--disabled .mg-c-input__wrapper{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input--rich-text-editor .mg-c-input__readonly-value p{margin:0}.mg-c-input--rich-text-editor .mg-c-input__readonly-value p:not(:first-child){margin-top:1em}.mg-c-input--rich-text-editor .ql-toolbar{display:flex;flex-wrap:wrap;padding:var(--mg-b-size-8);border:0;border-radius:var(--mg-c-input-border-radius) var(--mg-c-input-border-radius) 0 0;background:var(--mg-b-color-neutral-0);border-block-end-width:var(--mg-c-input-border-width);border-block-end-color:var(--mg-c-input-color-border);border-block-end-style:solid}.mg-c-input--rich-text-editor .ql-toolbar .ql-formats{display:inline-flex;margin:inherit;gap:.2rem}.mg-c-input--rich-text-editor .ql-toolbar .ql-formats:not(:last-child)::after{width:.1rem;height:var(--mg-b-size-16);background:var(--mg-c-input-color-border);content:"";margin-block:var(--mg-b-size-8);margin-inline:var(--mg-b-size-8)}.mg-c-input--rich-text-editor .ql-toolbar button .ql-fill,.mg-c-input--rich-text-editor .ql-toolbar button:hover .ql-fill,.mg-c-input--rich-text-editor .ql-toolbar button:focus .ql-fill,.mg-c-input--rich-text-editor .ql-toolbar button.ql-active .ql-fill{fill:currentcolor}.mg-c-input--rich-text-editor .ql-toolbar button:hover .ql-stroke,.mg-c-input--rich-text-editor .ql-toolbar button:focus .ql-stroke,.mg-c-input--rich-text-editor .ql-toolbar button.ql-active .ql-stroke,.mg-c-input--rich-text-editor .ql-toolbar button .ql-stroke{stroke:currentcolor}.mg-c-input--rich-text-editor .ql-toolbar button{display:flex;min-width:var(--mg-b-size-32);height:var(--mg-b-size-32);align-items:center;justify-content:center;padding:var(--mg-b-size-4);border:.1rem solid rgba(0,0,0,0);border-radius:var(--mg-b-size-radius);color:var(--mg-b-color-dark);float:inherit;transition-duration:.2s;transition-property:background-color,border-color;transition-timing-function:ease-in-out}.mg-c-input--rich-text-editor .ql-toolbar button svg{width:var(--mg-b-size-20);height:var(--mg-b-size-20)}.mg-c-input--rich-text-editor .ql-toolbar button:focus{color:var(--mg-b-color-dark)}.mg-c-input--rich-text-editor .ql-toolbar button:focus-visible,.mg-c-input--rich-text-editor .ql-toolbar button:hover,.mg-c-input--rich-text-editor .ql-toolbar button.ql-active{border-color:var(--mg-b-color-neutral-70);background:var(--mg-b-color-neutral-20);color:var(--mg-b-color-dark)}.mg-c-input--rich-text-editor .ql-toolbar button .ql-stroke{stroke-width:.12rem}.mg-c-input--rich-text-editor .ql-toolbar button .ql-stroke.ql-thin{stroke-width:.1rem}.mg-c-input--rich-text-editor .ql-toolbar button.ql-bold .ql-stroke{stroke-width:.2rem}.mg-c-input--rich-text-editor .ql-container{border:0;border-radius:0 0 var(--mg-c-input-border-radius) var(--mg-c-input-border-radius);margin:0 .1rem .1rem;background:var(--mg-b-color-neutral-0)}.mg-c-input--rich-text-editor .ql-editor{min-height:calc(calc(var(--mg-b-font-size) * var(--mg-b-line-height) * var(--mg-c-input-rich-text-editor-rows, 3)) + calc((var(--mg-b-size-min-height) - var(--mg-b-font-size) * var(--mg-b-line-height)) / 2));padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);color:var(--mg-b-color-dark);font-size:var(--mg-b-font-size)}.mg-c-input--rich-text-editor .ql-editor.ql-blank::before{right:var(--mg-b-size-8);left:var(--mg-b-size-8)}.mg-c-input--rich-text-editor .ql-editor p:not(:first-child){margin-top:1em}.mg-c-input--rich-text-editor.mg-c-input--disabled .ql-toolbar{pointer-events:none}.mg-c-input--rich-text-editor.mg-c-input--has-error .ql-toolbar{border-color:var(--mg-b-color-danger)}`;
16382
16380
 
16383
16381
  const MgInputRichTextEditor = class {
16384
16382
  constructor(hostRef) {
@@ -16546,10 +16544,10 @@ const MgInputRichTextEditor = class {
16546
16544
  (_a = this.editor) === null || _a === void 0 ? void 0 : _a.focus();
16547
16545
  }
16548
16546
  /**
16549
- * Get editor content as HTML
16547
+ * Get editor content in HTML format
16550
16548
  * @returns HTML content of the editor
16551
16549
  */
16552
- getHTML() {
16550
+ getEditorHTML() {
16553
16551
  return new Promise(resolve => {
16554
16552
  requestAnimationFrame(() => {
16555
16553
  resolve(this.editor.getSemanticHTML());
@@ -16557,10 +16555,10 @@ const MgInputRichTextEditor = class {
16557
16555
  });
16558
16556
  }
16559
16557
  /**
16560
- * Get editor content as plain text
16558
+ * Get editor content in plain text format
16561
16559
  * @returns Plain text content of the editor
16562
16560
  */
16563
- async getText() {
16561
+ async getEditorText() {
16564
16562
  return new Promise(resolve => {
16565
16563
  requestAnimationFrame(() => {
16566
16564
  resolve(this.editor.getText());
@@ -16696,19 +16694,33 @@ const MgInputRichTextEditor = class {
16696
16694
  * @returns HTML mg-input Element
16697
16695
  */
16698
16696
  render() {
16699
- return (h("mg-input", { key: '5e807e1059704a6624a1fda63ab56a6f9a51230f', identifier: this.identifier, class: this.classCollection.join(), label: this.label, labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.tooltipPosition, helpText: this.helpText, errorMessage: this.hasDisplayedError ? this.errorMessage : undefined }, this.readonly ? (h("div", { class: "mg-c-input__readonly-value", innerHTML: this.value })) : (h("div", { ref: el => {
16697
+ return (h("mg-input", { key: '26e4f26987e66541a6b21c7888ed7acd4e4ccad6', identifier: this.identifier, class: this.classCollection.join(), label: this.label, labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.tooltipPosition, helpText: this.helpText, errorMessage: this.hasDisplayedError ? this.errorMessage : undefined }, this.readonly ? (h("div", { class: "mg-c-input__readonly-value", innerHTML: this.value })) : (h("div", { ref: el => {
16700
16698
  this.wrapperElement = el;
16701
16699
  }, id: this.identifier, class: "mg-c-input__wrapper" }, h("div", null)))));
16702
16700
  }
16703
16701
  get element() { return getElement(this); }
16704
16702
  static get watchers() { return {
16705
- "readonly": ["watchReadonly", "handleValidityChange"],
16706
- "disabled": ["watchDisabled", "handleValidityChange"],
16707
- "required": ["handleValidityChange"],
16708
- "pattern": ["validatePattern"],
16709
- "patternErrorMessage": ["validatePattern"]
16703
+ "readonly": [{
16704
+ "watchReadonly": 0
16705
+ }, {
16706
+ "handleValidityChange": 0
16707
+ }],
16708
+ "disabled": [{
16709
+ "watchDisabled": 0
16710
+ }, {
16711
+ "handleValidityChange": 0
16712
+ }],
16713
+ "required": [{
16714
+ "handleValidityChange": 0
16715
+ }],
16716
+ "pattern": [{
16717
+ "validatePattern": 0
16718
+ }],
16719
+ "patternErrorMessage": [{
16720
+ "validatePattern": 0
16721
+ }]
16710
16722
  }; }
16711
16723
  };
16712
- MgInputRichTextEditor.style = editorScss + mgInputRichTextEditorCss;
16724
+ MgInputRichTextEditor.style = quillSnowCss() + mgInputRichTextEditorCss();
16713
16725
 
16714
16726
  export { MgInputRichTextEditor as mg_input_rich_text_editor };
@@ -10,10 +10,16 @@ const tooltipPositions = ['input', 'label'];
10
10
  * Possible label headings
11
11
  */
12
12
  const labelHeadings = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
13
+ /**
14
+ * Is HTMLMgInputElement an HTMLMgInputFileElement
15
+ * @param input - input element
16
+ * @returns true if input is an mg-input-file element
17
+ */
18
+ const isMgInputFile = (input) => input.nodeName === 'MG-INPUT-FILE';
13
19
  const classFieldset = 'mg-c-input--fieldset';
14
20
  const classDisabled = 'mg-c-input--disabled';
15
21
  const classReadonly = 'mg-c-input--readonly';
16
22
  const classVerticalList = 'mg-c-input--vertical-list';
17
23
  const classDisplayCharacterLeft = 'mg-c-input--display-character-left';
18
24
 
19
- export { classDisabled as a, classFieldset as b, classReadonly as c, classVerticalList as d, classDisplayCharacterLeft as e, labelHeadings as l, tooltipPositions as t, widths as w };
25
+ export { classDisabled as a, classFieldset as b, classReadonly as c, classVerticalList as d, classDisplayCharacterLeft as e, isMgInputFile as i, labelHeadings as l, tooltipPositions as t, widths as w };