@brightspace-ui/core 3.36.5 → 3.37.0
Sign up to get free protection for your applications and to get access to all the features.
- package/components/dialog/dialog-fullscreen.js +6 -2
- package/components/dialog/dialog.js +1 -1
- package/components/focus-trap/focus-trap.js +2 -4
- package/components/form/form-errory-summary.js +1 -0
- package/components/icons/catalogue.md +17 -16
- package/components/icons/images/html-editor/h5p.svg +4 -0
- package/components/inputs/docs/input-search.md +1 -1
- package/components/inputs/input-date.js +11 -3
- package/components/inputs/input-time.js +5 -2
- package/components/skeleton/demo/skeleton-test-link.js +2 -1
- package/generated/icons/html-editor/h5p.js +6 -0
- package/generated/icons/presetIconLoader.js +2 -0
- package/lang/ar.js +1 -0
- package/lang/cy.js +1 -0
- package/lang/da.js +1 -0
- package/lang/de.js +1 -0
- package/lang/en-gb.js +1 -0
- package/lang/en.js +1 -0
- package/lang/es-es.js +1 -0
- package/lang/es.js +1 -0
- package/lang/fr-fr.js +1 -0
- package/lang/fr.js +1 -0
- package/lang/hi.js +1 -0
- package/lang/ja.js +1 -0
- package/lang/ko.js +1 -0
- package/lang/nl.js +1 -0
- package/lang/pt.js +1 -0
- package/lang/sv.js +1 -0
- package/lang/tr.js +1 -0
- package/lang/zh-cn.js +1 -0
- package/lang/zh-tw.js +1 -0
- package/package.json +1 -1
- package/templates/primary-secondary/primary-secondary.js +3 -1
@@ -197,6 +197,7 @@ class DialogFullscreen extends LocalizeCoreElement(AsyncContainerMixin(DialogMix
|
|
197
197
|
this._handleResize = this._handleResize.bind(this);
|
198
198
|
this._handleResize();
|
199
199
|
this.width = 1170;
|
200
|
+
this._titleId = getUniqueId();
|
200
201
|
}
|
201
202
|
|
202
203
|
get asyncContainerCustom() {
|
@@ -214,7 +215,6 @@ class DialogFullscreen extends LocalizeCoreElement(AsyncContainerMixin(DialogMix
|
|
214
215
|
}
|
215
216
|
|
216
217
|
render() {
|
217
|
-
this._width = Math.max(1170, this.width);
|
218
218
|
const heightOverride = {} ;
|
219
219
|
let topOverride = null;
|
220
220
|
if (this._ifrauContextInfo) {
|
@@ -251,7 +251,6 @@ class DialogFullscreen extends LocalizeCoreElement(AsyncContainerMixin(DialogMix
|
|
251
251
|
<div style=${styleMap(slotStyles)}><slot></slot></div>
|
252
252
|
`;
|
253
253
|
|
254
|
-
if (!this._titleId) this._titleId = getUniqueId();
|
255
254
|
const inner = html`
|
256
255
|
<div class="d2l-dialog-inner" style=${styleMap(heightOverride)}>
|
257
256
|
<div class="d2l-dialog-header">
|
@@ -286,6 +285,11 @@ class DialogFullscreen extends LocalizeCoreElement(AsyncContainerMixin(DialogMix
|
|
286
285
|
}
|
287
286
|
}
|
288
287
|
|
288
|
+
willUpdate(changedProperties) {
|
289
|
+
super.willUpdate(changedProperties);
|
290
|
+
if (changedProperties.has('width')) this._width = Math.max(1170, this.width);
|
291
|
+
}
|
292
|
+
|
289
293
|
_abort() {
|
290
294
|
this._close('abort');
|
291
295
|
}
|
@@ -105,6 +105,7 @@ class Dialog extends LocalizeCoreElement(AsyncContainerMixin(DialogMixin(LitElem
|
|
105
105
|
this._criticalLabelId = getUniqueId();
|
106
106
|
this._handleResize = this._handleResize.bind(this);
|
107
107
|
this._titleId = getUniqueId();
|
108
|
+
this._textId = getUniqueId();
|
108
109
|
}
|
109
110
|
|
110
111
|
get asyncContainerCustom() {
|
@@ -158,7 +159,6 @@ class Dialog extends LocalizeCoreElement(AsyncContainerMixin(DialogMixin(LitElem
|
|
158
159
|
'd2l-footer-no-content': !this._hasFooterContent
|
159
160
|
};
|
160
161
|
|
161
|
-
if (!this._textId && this.describeContent) this._textId = getUniqueId();
|
162
162
|
const content = html`
|
163
163
|
${loading}
|
164
164
|
<div id="${ifDefined(this._textId)}" style=${styleMap(slotStyles)}><slot></slot></div>
|
@@ -117,8 +117,7 @@ class FocusTrap extends FocusMixin(LitElement) {
|
|
117
117
|
// user is exiting trap via forward tabbing...
|
118
118
|
const firstFocusable = getNextFocusable(this.shadowRoot.querySelector('.d2l-focus-trap-start'));
|
119
119
|
if (firstFocusable) {
|
120
|
-
|
121
|
-
setTimeout(() => firstFocusable.focus(), 50);
|
120
|
+
firstFocusable.focus();
|
122
121
|
return;
|
123
122
|
}
|
124
123
|
}
|
@@ -141,8 +140,7 @@ class FocusTrap extends FocusMixin(LitElement) {
|
|
141
140
|
// user is exiting trap via back tabbing...
|
142
141
|
const lastFocusable = getPreviousFocusable(this.shadowRoot.querySelector('.d2l-focus-trap-end'));
|
143
142
|
if (lastFocusable) {
|
144
|
-
|
145
|
-
setTimeout(() => lastFocusable.focus(), 50);
|
143
|
+
lastFocusable.focus();
|
146
144
|
return;
|
147
145
|
}
|
148
146
|
}
|
@@ -74,6 +74,7 @@ class FormErrorSummary extends LocalizeCoreElement(RtlMixin(LitElement)) {
|
|
74
74
|
<d2l-button-icon
|
75
75
|
aria-expanded=${this._expanded ? 'true' : 'false'}
|
76
76
|
icon=${this._expanded ? 'tier1:arrow-collapse-small' : 'tier1:arrow-expand-small' }
|
77
|
+
text="${this.localize('components.form-error-summary.text')}"
|
77
78
|
@click=${this._toggleExpandCollapse}>
|
78
79
|
</d2l-button-icon>
|
79
80
|
</div>
|
@@ -15,22 +15,23 @@ Size: `18px` x `18`px
|
|
15
15
|
|
16
16
|
| Icon | Name | | Icon | Name | | Icon | Name |
|
17
17
|
| :---: | :--- | --- | :---: | :--- | --- | :---: | :--- |
|
18
|
-
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/accessibility-check.svg?sanitize=true) | accessibility-check | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/insert-attributes.svg?sanitize=true) | insert-attributes | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-cell-
|
19
|
-
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/align-center.svg?sanitize=true) | align-center | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/insert-emoticon.svg?sanitize=true) | insert-emoticon | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-
|
20
|
-
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/align-full.svg?sanitize=true) | align-full | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/italic.svg?sanitize=true) | italic | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-column-insert-
|
21
|
-
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/align-left.svg?sanitize=true) | align-left | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/link.svg?sanitize=true) | link | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-column-
|
22
|
-
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/align-right.svg?sanitize=true) | align-right | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/list-bullet.svg?sanitize=true) | list-bullet | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-
|
23
|
-
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/bold.svg?sanitize=true) | bold | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/list-ordered.svg?sanitize=true) | list-ordered | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-
|
24
|
-
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/cut.svg?sanitize=true) | cut | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/media.svg?sanitize=true) | media | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-
|
25
|
-
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/direction-ltr.svg?sanitize=true) | direction-ltr | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/new-line.svg?sanitize=true) | new-line | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-row-
|
26
|
-
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/direction-rtl.svg?sanitize=true) | direction-rtl | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/paste.svg?sanitize=true) | paste | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-row-
|
27
|
-
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/equation-graphical-chemistry.svg?sanitize=true) | equation-graphical-chemistry | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/source-editor.svg?sanitize=true) | source-editor | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-row-insert-
|
28
|
-
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/equation-graphical.svg?sanitize=true) | equation-graphical | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/spellcheck.svg?sanitize=true) | spellcheck | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-row-
|
29
|
-
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/equation-latex.svg?sanitize=true) | equation-latex | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/strikethrough.svg?sanitize=true) | strikethrough | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-row-paste-
|
30
|
-
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/equation-mathml.svg?sanitize=true) | equation-mathml | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/subscript.svg?sanitize=true) | subscript | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-row-
|
31
|
-
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/
|
32
|
-
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/
|
33
|
-
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/indent-
|
18
|
+
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/accessibility-check.svg?sanitize=true) | accessibility-check | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/insert-attributes.svg?sanitize=true) | insert-attributes | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-cell-split.svg?sanitize=true) | table-cell-split |
|
19
|
+
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/align-center.svg?sanitize=true) | align-center | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/insert-emoticon.svg?sanitize=true) | insert-emoticon | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-column-insert-after.svg?sanitize=true) | table-column-insert-after |
|
20
|
+
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/align-full.svg?sanitize=true) | align-full | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/italic.svg?sanitize=true) | italic | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-column-insert-before.svg?sanitize=true) | table-column-insert-before |
|
21
|
+
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/align-left.svg?sanitize=true) | align-left | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/link.svg?sanitize=true) | link | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-column-remove.svg?sanitize=true) | table-column-remove |
|
22
|
+
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/align-right.svg?sanitize=true) | align-right | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/list-bullet.svg?sanitize=true) | list-bullet | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-delete.svg?sanitize=true) | table-delete |
|
23
|
+
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/bold.svg?sanitize=true) | bold | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/list-ordered.svg?sanitize=true) | list-ordered | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-properties.svg?sanitize=true) | table-properties |
|
24
|
+
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/cut.svg?sanitize=true) | cut | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/media.svg?sanitize=true) | media | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-row-copy.svg?sanitize=true) | table-row-copy |
|
25
|
+
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/direction-ltr.svg?sanitize=true) | direction-ltr | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/new-line.svg?sanitize=true) | new-line | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-row-cut.svg?sanitize=true) | table-row-cut |
|
26
|
+
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/direction-rtl.svg?sanitize=true) | direction-rtl | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/paste.svg?sanitize=true) | paste | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-row-insert-after.svg?sanitize=true) | table-row-insert-after |
|
27
|
+
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/equation-graphical-chemistry.svg?sanitize=true) | equation-graphical-chemistry | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/source-editor.svg?sanitize=true) | source-editor | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-row-insert-before.svg?sanitize=true) | table-row-insert-before |
|
28
|
+
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/equation-graphical.svg?sanitize=true) | equation-graphical | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/spellcheck.svg?sanitize=true) | spellcheck | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-row-paste-above.svg?sanitize=true) | table-row-paste-above |
|
29
|
+
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/equation-latex.svg?sanitize=true) | equation-latex | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/strikethrough.svg?sanitize=true) | strikethrough | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-row-paste-below.svg?sanitize=true) | table-row-paste-below |
|
30
|
+
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/equation-mathml.svg?sanitize=true) | equation-mathml | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/subscript.svg?sanitize=true) | subscript | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-row-properties.svg?sanitize=true) | table-row-properties |
|
31
|
+
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/h5p.svg?sanitize=true) | h5p | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/superscript.svg?sanitize=true) | superscript | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-row-remove.svg?sanitize=true) | table-row-remove |
|
32
|
+
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/image.svg?sanitize=true) | image | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/symbol.svg?sanitize=true) | symbol | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/underline.svg?sanitize=true) | underline |
|
33
|
+
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/indent-decrease.svg?sanitize=true) | indent-decrease | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-cell-merge.svg?sanitize=true) | table-cell-merge | | | |
|
34
|
+
| ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/indent-increase.svg?sanitize=true) | indent-increase | | ![](https://raw.githubusercontent.com/BrightspaceUI/core/main/components/icons/images/html-editor/table-cell-properties.svg?sanitize=true) | table-cell-properties | | | |
|
34
35
|
|
35
36
|
## tier1
|
36
37
|
|
@@ -0,0 +1,4 @@
|
|
1
|
+
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
2
|
+
<path d="M17.336 5.636C16.896 5.212 16.226 5 15.34 5h-2.992v1.686h-3.59l-.294 1.208c.245-.114.593-.229.832-.288.24-.06.479-.05.713-.05.794 0 1.441.245 1.936.724.495.479.74 1.088.74 1.817 0 .511-.125 1.006-.38 1.48a2.61 2.61 0 0 1-1.083 1.088 2.815 2.815 0 0 1-.555.223h3.041v-2.883h1.36c.99 0 1.724-.229 2.208-.68.484-.452.724-1.083.724-1.883 0-.777-.223-1.381-.664-1.806Zm-2.013 2.497c-.19.163-.522.24-.995.24h-.62V6.632h.718c.457 0 .772.082.935.256a.85.85 0 0 1 .25.625.776.776 0 0 1-.288.62Z" fill="#494C4E"/>
|
3
|
+
<path d="M9.22 8.987c-.43 0-.8.25-.979.61l-2.149-.305L7.061 5H5.113v3.373h-2.72V5H0v7.888h2.393v-2.883h2.72v2.883h2.949c-.365-.11-.68-.25-.936-.441a2.642 2.642 0 0 1-.636-.67 3.275 3.275 0 0 1-.398-.897l2.155-.31c.18.36.549.604.973.604a1.093 1.093 0 0 0 0-2.187Z" fill="#494C4E"/>
|
4
|
+
</svg>
|
@@ -82,7 +82,7 @@ When the input is cleared, the same event will be fired with an empty value.
|
|
82
82
|
* `inline-help`: Help text that will appear below the input. Use this only when other helpful cues are not sufficient, such as a carefully-worded label.
|
83
83
|
<!-- docs: end hidden content -->
|
84
84
|
|
85
|
-
##
|
85
|
+
## Accessibility
|
86
86
|
|
87
87
|
- While the component does not have a visible label, the search icon clearly indicates its purpose
|
88
88
|
- While not required to meet WCAG, this [pattern](https://www.w3.org/WAI/WCAG2/supplemental/patterns/o1p07-icons-used/) is a great way to help individuals with cognitive accessibility needs
|
@@ -178,6 +178,11 @@ class InputDate extends FocusMixin(LabelledMixin(SkeletonMixin(FormElementMixin(
|
|
178
178
|
return 'd2l-input-text';
|
179
179
|
}
|
180
180
|
|
181
|
+
/** @ignore */
|
182
|
+
get inputTextWidth() {
|
183
|
+
return `calc(${this._hiddenContentWidth} + 0.75rem + 3px)`; // text and icon width + paddingRight + border width + 1
|
184
|
+
}
|
185
|
+
|
181
186
|
/** @ignore */
|
182
187
|
get validationMessage() {
|
183
188
|
if (this.validity.rangeOverflow || this.validity.rangeUnderflow) {
|
@@ -238,9 +243,7 @@ class InputDate extends FocusMixin(LabelledMixin(SkeletonMixin(FormElementMixin(
|
|
238
243
|
|
239
244
|
render() {
|
240
245
|
const formattedWideDate = formatISODateInUserCalDescriptor('2323-12-23');
|
241
|
-
const inputTextWidth = `calc(${this._hiddenContentWidth} + 0.75rem + 3px)`; // text and icon width + paddingRight + border width + 1
|
242
246
|
const shortDateFormat = (this._dateTimeDescriptor.formats.dateFormats.short).toUpperCase();
|
243
|
-
this.style.maxWidth = inputTextWidth;
|
244
247
|
|
245
248
|
const clearButton = !this.required ? html`<d2l-button-subtle text="${this.localize(`${this._namespace}.clear`)}" @click="${this._handleClear}"></d2l-button-subtle>` : null;
|
246
249
|
const nowButton = this.hasNow ? html`<d2l-button-subtle text="${this.localize(`${this._namespace}.now`)}" @click="${this._handleSetToNow}"></d2l-button-subtle>` : null;
|
@@ -304,7 +307,7 @@ class InputDate extends FocusMixin(LabelledMixin(SkeletonMixin(FormElementMixin(
|
|
304
307
|
placeholder="${shortDateFormat}"
|
305
308
|
?required="${this.required}"
|
306
309
|
?skeleton="${this.skeleton}"
|
307
|
-
style="${styleMap({ maxWidth: inputTextWidth })}"
|
310
|
+
style="${styleMap({ maxWidth: this.inputTextWidth })}"
|
308
311
|
.value="${this._formattedValue}">
|
309
312
|
${icon}
|
310
313
|
<slot slot="inline-help" name="inline-help"></slot>
|
@@ -339,6 +342,11 @@ class InputDate extends FocusMixin(LabelledMixin(SkeletonMixin(FormElementMixin(
|
|
339
342
|
});
|
340
343
|
}
|
341
344
|
|
345
|
+
willUpdate(changedProperties) {
|
346
|
+
super.willUpdate(changedProperties);
|
347
|
+
if (changedProperties.has('_hiddenContentWidth')) this.style.maxWidth = this.inputTextWidth;
|
348
|
+
}
|
349
|
+
|
342
350
|
async validate() {
|
343
351
|
if (!this.shadowRoot) return;
|
344
352
|
const textInput = this.shadowRoot.querySelector('d2l-input-text');
|
@@ -329,11 +329,9 @@ class InputTime extends InputInlineHelpMixin(FocusMixin(LabelledMixin(SkeletonMi
|
|
329
329
|
`)}` : null;
|
330
330
|
const formattedWideTimeAM = formatTime(new Date(2020, 0, 1, 10, 23, 0));
|
331
331
|
const formattedWideTimePM = formatTime(new Date(2020, 0, 1, 23, 23, 0));
|
332
|
-
const inputTextWidth = `calc(${this._hiddenContentWidth} + 1.5rem + 3px)`; // text and icon width + left & right padding + border width + 1
|
333
332
|
const opened = this.opened && !this.disabled && !this.skeleton;
|
334
333
|
const dropdownIdTimezone = `${this._dropdownId}-timezone`;
|
335
334
|
const ariaDescribedByIds = `${this._dropdownId ? dropdownIdTimezone : ''} ${this._hasInlineHelp ? this._inlineHelpId : ''}`.trim();
|
336
|
-
this.style.maxWidth = inputTextWidth;
|
337
335
|
|
338
336
|
return html`
|
339
337
|
<div aria-hidden="true" class="d2l-input-time-hidden-content">
|
@@ -393,6 +391,11 @@ class InputTime extends InputInlineHelpMixin(FocusMixin(LabelledMixin(SkeletonMi
|
|
393
391
|
});
|
394
392
|
}
|
395
393
|
|
394
|
+
willUpdate(changedProperties) {
|
395
|
+
super.willUpdate(changedProperties);
|
396
|
+
this.style.maxWidth = `calc(${this._hiddenContentWidth} + 1.5rem + 3px)`; // text and icon width + left & right padding + border width + 1
|
397
|
+
}
|
398
|
+
|
396
399
|
getTime() {
|
397
400
|
const time = getDateFromISOTime(this.value);
|
398
401
|
return {
|
@@ -36,8 +36,9 @@ export class SkeletonTestLink extends SkeletonMixin(LitElement) {
|
|
36
36
|
'd2l-link-small': this.type === 'small',
|
37
37
|
'd2l-skeletize': true
|
38
38
|
};
|
39
|
+
const widthSkeletonSize = `d2l-skeletize-${this.width}`;
|
39
40
|
if (this.width !== undefined) {
|
40
|
-
classes[
|
41
|
+
classes[widthSkeletonSize] = true;
|
41
42
|
}
|
42
43
|
return html`<a href="https://d2l.com" class="${classMap(classes)}">Link (${this.type})</a>`;
|
43
44
|
}
|
@@ -0,0 +1,6 @@
|
|
1
|
+
// auto-generated
|
2
|
+
export const val = `<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
3
|
+
<path d="M17.336 5.636C16.896 5.212 16.226 5 15.34 5h-2.992v1.686h-3.59l-.294 1.208c.245-.114.593-.229.832-.288.24-.06.479-.05.713-.05.794 0 1.441.245 1.936.724.495.479.74 1.088.74 1.817 0 .511-.125 1.006-.38 1.48a2.61 2.61 0 0 1-1.083 1.088 2.815 2.815 0 0 1-.555.223h3.041v-2.883h1.36c.99 0 1.724-.229 2.208-.68.484-.452.724-1.083.724-1.883 0-.777-.223-1.381-.664-1.806Zm-2.013 2.497c-.19.163-.522.24-.995.24h-.62V6.632h.718c.457 0 .772.082.935.256a.85.85 0 0 1 .25.625.776.776 0 0 1-.288.62Z" fill="#494C4E"/>
|
4
|
+
<path d="M9.22 8.987c-.43 0-.8.25-.979.61l-2.149-.305L7.061 5H5.113v3.373h-2.72V5H0v7.888h2.393v-2.883h2.72v2.883h2.949c-.365-.11-.68-.25-.936-.441a2.642 2.642 0 0 1-.636-.67 3.275 3.275 0 0 1-.398-.897l2.155-.31c.18.36.549.604.973.604a1.093 1.093 0 0 0 0-2.187Z" fill="#494C4E"/>
|
5
|
+
</svg>
|
6
|
+
`;
|
@@ -39,6 +39,8 @@ export function loadSvg(icon) {
|
|
39
39
|
return import(/* webpackChunkName: "icon-equation-latex" */'./html-editor/equation-latex.js');
|
40
40
|
case 'html-editor:equation-mathml':
|
41
41
|
return import(/* webpackChunkName: "icon-equation-mathml" */'./html-editor/equation-mathml.js');
|
42
|
+
case 'html-editor:h5p':
|
43
|
+
return import(/* webpackChunkName: "icon-h5p" */'./html-editor/h5p.js');
|
42
44
|
case 'html-editor:image':
|
43
45
|
return import(/* webpackChunkName: "icon-image" */'./html-editor/image.js');
|
44
46
|
case 'html-editor:indent-decrease':
|
package/lang/ar.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "عنوان URL غير صالح",
|
45
45
|
"components.form-element.valueMissing": "{label} مطلوبة.",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, one {تم العثور على {count} خطأ في المعلومات التي أرسلتها} other {تم العثور على {count} من الأخطاء في المعلومات التي أرسلتها}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "لون الخلفية",
|
48
49
|
"components.input-color.foregroundColor": "لون المقدمة",
|
49
50
|
"components.input-color.none": "لا شيء",
|
package/lang/cy.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "Nid yw'r URL yn ddilys.",
|
45
45
|
"components.form-element.valueMissing": "Mae angen {label}.",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, one {Canfuwyd {count} gwall yn y wybodaeth a gyflwynoch} other {Canfuwyd {count} gwall yn y wybodaeth a gyflwynoch}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "Lliw Cefndir",
|
48
49
|
"components.input-color.foregroundColor": "Lliw Blaendir",
|
49
50
|
"components.input-color.none": "Dim",
|
package/lang/da.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "URL-adresse er ikke gyldig",
|
45
45
|
"components.form-element.valueMissing": "{label} er påkrævet.",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, one {Der blev fundet {count} fejl i de oplysninger, du indsendte} other {Der blev fundet {count} fejl i de oplysninger, du indsendte}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "Baggrundsfarve",
|
48
49
|
"components.input-color.foregroundColor": "Forgrundsfarve",
|
49
50
|
"components.input-color.none": "Ingen",
|
package/lang/de.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "URL ist ungültig",
|
45
45
|
"components.form-element.valueMissing": "{label} ist erforderlich.",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, one {Die von Ihnen übermittelten Informationen enthalten {count} Fehler} other {Die von Ihnen übermittelten Informationen enthalten {count} Fehler}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "Hintergrundfarbe",
|
48
49
|
"components.input-color.foregroundColor": "Vordergrundfarbe",
|
49
50
|
"components.input-color.none": "Keine",
|
package/lang/en-gb.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "URL is not valid",
|
45
45
|
"components.form-element.valueMissing": "{label} is required.",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, one {There was {count} error found in the information you submitted} other {There were {count} errors found in the information you submitted}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "Background Colour",
|
48
49
|
"components.input-color.foregroundColor": "Foreground Colour",
|
49
50
|
"components.input-color.none": "None",
|
package/lang/en.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "URL is not valid",
|
45
45
|
"components.form-element.valueMissing": "{label} is required.",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, one {There was {count} error found in the information you submitted} other {There were {count} errors found in the information you submitted}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "Background Color",
|
48
49
|
"components.input-color.foregroundColor": "Foreground Color",
|
49
50
|
"components.input-color.none": "None",
|
package/lang/es-es.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "La dirección URL no es válida",
|
45
45
|
"components.form-element.valueMissing": "{label} es obligatorio.",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, one {Se ha encontrado {count} error en la información que ha enviado} other {Se han encontrado {count} errores en la información que ha enviado}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "Color de fondo",
|
48
49
|
"components.input-color.foregroundColor": "Color del primer plano",
|
49
50
|
"components.input-color.none": "Ninguno",
|
package/lang/es.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "La dirección URL no es válida",
|
45
45
|
"components.form-element.valueMissing": "{label} es obligatoria.",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, one {Se encontró {count} error en la información que envió} other {Se encontraron {count} errores en la información que envió}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "Color de fondo",
|
48
49
|
"components.input-color.foregroundColor": "Color del primer plano",
|
49
50
|
"components.input-color.none": "Ninguno",
|
package/lang/fr-fr.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "URL non valide",
|
45
45
|
"components.form-element.valueMissing": "{label} est obligatoire.",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, one {{count} erreur trouvée dans les informations soumises} other {{count} erreurs trouvées dans les informations soumises}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "Couleur de l’arrière-plan",
|
48
49
|
"components.input-color.foregroundColor": "Couleur de l’avant-plan",
|
49
50
|
"components.input-color.none": "Aucune",
|
package/lang/fr.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "L'URL n'est pas valide",
|
45
45
|
"components.form-element.valueMissing": "{label} est requis.",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, one {Il y avait {count} erreur trouvée dans les informations que vous avez soumises} other {Il y avait {count} erreurs trouvées dans les informations que vous avez soumises}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "Couleur d’arrière-plan",
|
48
49
|
"components.input-color.foregroundColor": "Couleur de l'avant-plan",
|
49
50
|
"components.input-color.none": "Aucun",
|
package/lang/hi.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "URL मान्य नहीं है",
|
45
45
|
"components.form-element.valueMissing": "{label} आवश्यक है।",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, one {आपके द्वारा सबमिट की गई जानकारी में {count} त्रुटियाँ पाई गईं} other {आपके द्वारा सबमिट की गई जानकारी में {count} त्रुटियाँ पाई गईं}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "पृष्ठभूमि का रंग",
|
48
49
|
"components.input-color.foregroundColor": "अग्रभूमि का रंग",
|
49
50
|
"components.input-color.none": "कोई नहीं",
|
package/lang/ja.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "URL が有効ではありません",
|
45
45
|
"components.form-element.valueMissing": "{label} は必須です。",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, other {送信した情報に {count} 件のエラーが見つかりました}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "背景色",
|
48
49
|
"components.input-color.foregroundColor": "前景色",
|
49
50
|
"components.input-color.none": "なし",
|
package/lang/ko.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "URL이 유효하지 않습니다",
|
45
45
|
"components.form-element.valueMissing": "{label}이(가) 필요합니다.",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, other {제출한 정보에서 {count}개의 오류가 발견되었습니다}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "배경 색상",
|
48
49
|
"components.input-color.foregroundColor": "전경 색상",
|
49
50
|
"components.input-color.none": "없음",
|
package/lang/nl.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "URL is niet geldig",
|
45
45
|
"components.form-element.valueMissing": "{label} is vereist.",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, one {Er is {count} fout gevonden in de informatie die u hebt ingediend} other {Er zijn {count} fouten gevonden in de informatie die u hebt ingediend}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "Achtergrondkleur",
|
48
49
|
"components.input-color.foregroundColor": "Voorgrondkleur",
|
49
50
|
"components.input-color.none": "Geen",
|
package/lang/pt.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "URL inválido",
|
45
45
|
"components.form-element.valueMissing": "{label} é obrigatório.",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, one {{count} erro foi encontrado nas informações enviadas} other {{count} erros foram encontrados nas informações enviadas}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "Cor do Plano de fundo",
|
48
49
|
"components.input-color.foregroundColor": "Cor do Primeiro plano",
|
49
50
|
"components.input-color.none": "Nenhum",
|
package/lang/sv.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "URL är inte giltigt",
|
45
45
|
"components.form-element.valueMissing": "{label} krävs.",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, one {Det finns {count} fel i informationen som du skickade} other {Det finns {count} fel i informationen som du skickade}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "Bakgrundsfärg",
|
48
49
|
"components.input-color.foregroundColor": "Förgrundsfärg",
|
49
50
|
"components.input-color.none": "Inga",
|
package/lang/tr.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "URL geçerli değil",
|
45
45
|
"components.form-element.valueMissing": "{label} zorunludur.",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, one {Gönderdiğiniz bilgilerde {count} hata bulundu} other {Gönderdiğiniz bilgilerde {count} hata bulundu}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "Arka Plan Rengi",
|
48
49
|
"components.input-color.foregroundColor": "Ön Plan Rengi",
|
49
50
|
"components.input-color.none": "Yok",
|
package/lang/zh-cn.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "URL 无效",
|
45
45
|
"components.form-element.valueMissing": "{label} 为必填项。",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, other {在您提交的信息中发现 {count} 个错误}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "背景颜色",
|
48
49
|
"components.input-color.foregroundColor": "前景颜色",
|
49
50
|
"components.input-color.none": "无",
|
package/lang/zh-tw.js
CHANGED
@@ -44,6 +44,7 @@ export default {
|
|
44
44
|
"components.form-element.input.url.typeMismatch": "URL 無效",
|
45
45
|
"components.form-element.valueMissing": "{label} 為必填。",
|
46
46
|
"components.form-error-summary.errorSummary": "{count, plural, other {您提交的資訊中發現 {count} 個錯誤}}",
|
47
|
+
"components.form-error-summary.text": "Toggle error details",
|
47
48
|
"components.input-color.backgroundColor": "背景顏色",
|
48
49
|
"components.input-color.foregroundColor": "前景顏色",
|
49
50
|
"components.input-color.none": "無",
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@brightspace-ui/core",
|
3
|
-
"version": "3.
|
3
|
+
"version": "3.37.0",
|
4
4
|
"description": "A collection of accessible, free, open-source web components for building Brightspace applications",
|
5
5
|
"type": "module",
|
6
6
|
"repository": "https://github.com/BrightspaceUI/core.git",
|
@@ -997,6 +997,7 @@ class TemplatePrimarySecondary extends RtlMixin(LocalizeCoreElement(LitElement))
|
|
997
997
|
}
|
998
998
|
|
999
999
|
disconnectedCallback() {
|
1000
|
+
super.disconnectedCallback();
|
1000
1001
|
for (const resizer of this._resizers) {
|
1001
1002
|
resizer.disconnect();
|
1002
1003
|
}
|
@@ -1021,7 +1022,8 @@ class TemplatePrimarySecondary extends RtlMixin(LocalizeCoreElement(LitElement))
|
|
1021
1022
|
const size = this._size ?? 0;
|
1022
1023
|
const secondaryPanelStyles = {};
|
1023
1024
|
if (this._isResizable()) {
|
1024
|
-
|
1025
|
+
const dimension = this._isMobile ? 'height' : 'width';
|
1026
|
+
secondaryPanelStyles[dimension] = `${size}px`;
|
1025
1027
|
}
|
1026
1028
|
const scrollClasses = {
|
1027
1029
|
'd2l-template-scroll': isWindows
|