@scania/tegel 1.30.0 → 1.31.1-textarea-reactive-value-beta.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.
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/tds-accordion-item.cjs.entry.js +25 -3
- package/dist/cjs/tds-button.cjs.entry.js +1 -1
- package/dist/cjs/tds-modal.cjs.entry.js +14 -4
- package/dist/cjs/tds-popover-core.cjs.entry.js +1 -1
- package/dist/cjs/tds-textarea.cjs.entry.js +4 -4
- package/dist/cjs/tds-toast.cjs.entry.js +1 -1
- package/dist/cjs/tegel.cjs.js +1 -1
- package/dist/collection/components/accordion/accordion-item/accordion-item.js +77 -4
- package/dist/collection/components/button/button.css +11 -11
- package/dist/collection/components/modal/modal.js +45 -4
- package/dist/collection/components/popover-core/tds-popover-core.css +843 -12
- package/dist/collection/components/textarea/textarea.js +4 -4
- package/dist/collection/components/toast/toast.js +1 -1
- package/dist/components/{p-a2dafd0e.js → p-4420365f.js} +1 -1
- package/dist/components/{p-d4fa1832.js → p-516d8085.js} +1 -1
- package/dist/components/p-96e83134.js +2098 -0
- package/dist/components/tds-accordion-item.js +30 -5
- package/dist/components/tds-button.js +1 -1
- package/dist/components/tds-header-dropdown.js +2 -2
- package/dist/components/tds-header-launcher.js +2 -2
- package/dist/components/tds-modal.js +15 -4
- package/dist/components/tds-popover-canvas.js +1 -1
- package/dist/components/tds-popover-core.js +1 -1
- package/dist/components/tds-popover-menu.js +1 -1
- package/dist/components/tds-textarea.js +6 -6
- package/dist/components/tds-toast.js +1 -1
- package/dist/components/tds-tooltip.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/tds-accordion-item.entry.js +25 -3
- package/dist/esm/tds-button.entry.js +1 -1
- package/dist/esm/tds-modal.entry.js +14 -4
- package/dist/esm/tds-popover-core.entry.js +1 -1
- package/dist/esm/tds-textarea.entry.js +4 -4
- package/dist/esm/tds-toast.entry.js +1 -1
- package/dist/esm/tegel.js +1 -1
- package/dist/tegel/p-2b8e97e1.entry.js +1 -0
- package/dist/tegel/p-30c88c69.entry.js +1 -0
- package/dist/tegel/p-3e4707fb.entry.js +1 -0
- package/dist/tegel/p-554644a9.entry.js +1 -0
- package/dist/tegel/p-b58c7bed.entry.js +1 -0
- package/dist/tegel/p-b9603974.entry.js +1 -0
- package/dist/tegel/tegel.css +2 -2
- package/dist/tegel/tegel.esm.js +1 -1
- package/dist/types/components/accordion/accordion-item/accordion-item.d.ts +6 -0
- package/dist/types/components/modal/modal.d.ts +6 -2
- package/dist/types/components.d.ts +21 -0
- package/package.json +6 -1
- package/dist/components/p-2e25c35b.js +0 -2098
- package/dist/tegel/p-0955d5fc.entry.js +0 -1
- package/dist/tegel/p-26e8f033.entry.js +0 -1
- package/dist/tegel/p-b6a4f459.entry.js +0 -1
- package/dist/tegel/p-c3d91dfa.entry.js +0 -1
- package/dist/tegel/p-d38039b3.entry.js +0 -1
- package/dist/tegel/p-d56f426f.entry.js +0 -1
|
@@ -31,7 +31,7 @@ export class TdsTextarea {
|
|
|
31
31
|
}
|
|
32
32
|
// Data input event in value prop
|
|
33
33
|
handleInput(event) {
|
|
34
|
-
if (event.target instanceof
|
|
34
|
+
if (event.target instanceof HTMLTextAreaElement) {
|
|
35
35
|
this.value = event.target.value;
|
|
36
36
|
this.tdsInput.emit(event);
|
|
37
37
|
}
|
|
@@ -58,7 +58,7 @@ export class TdsTextarea {
|
|
|
58
58
|
}
|
|
59
59
|
render() {
|
|
60
60
|
var _a;
|
|
61
|
-
return (h("div", { key: '
|
|
61
|
+
return (h("div", { key: '71aa238805cae74bde180e9a2300677c2ca5542a', class: {
|
|
62
62
|
'textarea-container': true,
|
|
63
63
|
'textarea-label-inside': this.labelPosition === 'inside',
|
|
64
64
|
'textarea-focus': this.focusInput,
|
|
@@ -68,7 +68,7 @@ export class TdsTextarea {
|
|
|
68
68
|
'textarea-data': this.value !== '',
|
|
69
69
|
[`textarea-${this.state}`]: this.state === 'error' || this.state === 'success',
|
|
70
70
|
'no-min-width': this.noMinWidth,
|
|
71
|
-
} }, this.labelPosition !== 'no-label' && (h("label", { key: '
|
|
71
|
+
} }, this.labelPosition !== 'no-label' && (h("label", { key: 'a5f6eabfb1f455d3d773b52e5a77e379b1175c88', htmlFor: `textarea-element-${this.uuid}`, class: 'textarea-label' }, this.label)), h("div", { key: '6d555f64a6f92d170b697c5634a41a5ca5114a6c', class: "textarea-wrapper" }, h("textarea", { key: '90ce33c8896fbc9f037026f3e83557d9a09e0dcb', id: `textarea-element-${this.uuid}`, class: 'textarea-input', ref: (inputEl) => {
|
|
72
72
|
this.textEl = inputEl;
|
|
73
73
|
}, disabled: this.disabled, readonly: !this.disabled && this.readOnly, placeholder: this.placeholder, value: this.value, name: this.name, autofocus: this.autofocus, maxlength: this.maxLength, cols: this.cols, rows: this.rows, onFocus: (event) => {
|
|
74
74
|
if (!this.readOnly) {
|
|
@@ -78,7 +78,7 @@ export class TdsTextarea {
|
|
|
78
78
|
if (!this.readOnly) {
|
|
79
79
|
this.handleBlur(event);
|
|
80
80
|
}
|
|
81
|
-
}, onInput: (event) => this.handleInput(event), onChange: (event) => this.handleChange(event), "aria-invalid": this.state === 'error' ? 'true' : 'false', "aria-readonly": this.readOnly ? 'true' : 'false', "aria-label": this.tdsAriaLabel ? this.tdsAriaLabel : this.label, "aria-describedby": `textarea-helper-element-${this.uuid}` }), h("span", { key: '
|
|
81
|
+
}, onInput: (event) => this.handleInput(event), onChange: (event) => this.handleChange(event), "aria-invalid": this.state === 'error' ? 'true' : 'false', "aria-readonly": this.readOnly ? 'true' : 'false', "aria-label": this.tdsAriaLabel ? this.tdsAriaLabel : this.label, "aria-describedby": `textarea-helper-element-${this.uuid}` }), h("span", { key: '0e253fbbed6e02fe7d1af68a033fd4324c1a9bd6', class: "textarea-resizer-icon" }, h("svg", { key: '740d12a1ef48b430fd12c3362511b8186d1d0d4f', width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'f5d9d20101d4ee5882ab4b36e085f5f32c12bd4c', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.8536 0.853553C12.0488 0.658291 12.0488 0.341709 11.8536 0.146447C11.6583 -0.0488155 11.3417 -0.0488155 11.1464 0.146447L0.146447 11.1464C-0.0488155 11.3417 -0.0488155 11.6583 0.146447 11.8536C0.341709 12.0488 0.658291 12.0488 0.853553 11.8536L11.8536 0.853553ZM11.8536 4.64645C12.0488 4.84171 12.0488 5.15829 11.8536 5.35355L5.35355 11.8536C5.15829 12.0488 4.84171 12.0488 4.64645 11.8536C4.45118 11.6583 4.45118 11.3417 4.64645 11.1464L11.1464 4.64645C11.3417 4.45118 11.6583 4.45118 11.8536 4.64645ZM11.8536 8.64645C12.0488 8.84171 12.0488 9.15829 11.8536 9.35355L9.35355 11.8536C9.15829 12.0488 8.84171 12.0488 8.64645 11.8536C8.45118 11.6583 8.45118 11.3417 8.64645 11.1464L11.1464 8.64645C11.3417 8.45118 11.6583 8.45118 11.8536 8.64645Z", fill: "currentColor" }))), !this.disabled && !this.hideReadOnlyIcon && this.readOnly && (h("span", { key: '2415b36f980c421d69522ae0d41e91d7f19221f9', class: "textarea-icon__readonly" }, h("tds-tooltip", { key: '0d3a2de49aa612cb9d308ec2ccae03c21ca86ca4', placement: "top-end", text: "This field is non-editable", selector: "#readonly-tooltip" }), h("tds-icon", { key: '287b924c5fdaa3248d1dd82fa2b14d61e18dc78f', id: "readonly-tooltip", name: "edit_inactive", svgTitle: "inactive" })))), h("span", { key: '920d6a4e93b0f392c24b1e8aabd49e17f724af80', class: 'textarea-helper', "aria-live": "assertive", id: `textarea-helper-element-${this.uuid}` }, this.state === 'error' && !this.readOnly && h("tds-icon", { key: '3162f70c2c16dcd2e78248731a0a59c58a1a7e1b', name: "error", size: "16px" }), this.helper), this.maxLength > 0 && (h("div", { key: '81d7c4a8b3ba2dde55384d36edad90d96604107c', class: 'textarea-textcounter' }, this.value === null ? 0 : (_a = this.value) === null || _a === void 0 ? void 0 : _a.length, h("span", { key: 'db93c588a97eeeb7eb533a224d4b8d080f8ad49b', class: "textfield-textcounter-divider" }, " / "), " ", this.maxLength))));
|
|
82
82
|
}
|
|
83
83
|
static get is() { return "tds-textarea"; }
|
|
84
84
|
static get encapsulation() { return "scoped"; }
|
|
@@ -70,7 +70,7 @@ export class TdsToast {
|
|
|
70
70
|
show: !this.hidden,
|
|
71
71
|
} }, h("div", { key: 'bd1e5c5c04b8aa66cb44241fb37711df0d797d28', class: `
|
|
72
72
|
wrapper
|
|
73
|
-
${this.variant}` }, h("tds-icon", { key: '
|
|
73
|
+
${this.variant}` }, h("tds-icon", { key: 'aa6e3fd61ad5a2e962f6e70d48ce266b7c8913e0', name: this.getIconName(), size: "20px", svgTitle: this.getIconName() }), h("div", { key: '8502cb5c3b305942fe14ffde76ee4dfc63758ce8', class: `content` }, h("div", { key: '5ef927acd2e0d6bba51c4b20b79fee1240c821ef', class: "header-subheader" }, this.header && h("div", { key: 'c568d13668da3502c5f34810fea5f3a9d9629572', class: "header" }, this.header), usesHeaderSlot && h("slot", { key: 'e9316b99d758019127faf05adb9ae1754e3ea910', name: "header" }), this.subheader && h("div", { key: '428e2659621c6eb4ddb302b9cab6902d93d2f514', class: "subheader" }, this.subheader), usesSubheaderSlot && h("slot", { key: '2ec858d2feeaf679ab8aa061cab2156f926e29a2', name: "subheader" })), usesActionsSlot && (h("div", { key: '3f4836e54bedbeb3b02b78c0ac0bfa47770c4f80', class: `toast-bottom ${usesSubheaderSlot || this.subheader ? 'subheader' : 'no-subheader'}` }, h("slot", { key: '76fa5d8534ea34010968a7183e07e62a4be3e5f7', name: "actions" })))), this.closable && (h("button", { key: '8076fa3d885b7649758b084301e092d083103ecd', id: "my-button", "aria-label": this.tdsCloseAriaLabel, onClick: this.handleClose, class: "close" }, h("tds-icon", { key: 'f9bf7fa804352e9d09bbdc6251fe02c89cb174a8', name: "cross", size: "20px", svgTitle: "cross" }))))));
|
|
74
74
|
}
|
|
75
75
|
static get is() { return "tds-toast"; }
|
|
76
76
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { p as proxyCustomElement, H, h, c as Host } from './p-28ef5186.js';
|
|
2
2
|
import { i as inheritAttributes } from './p-3fe9cbbf.js';
|
|
3
|
-
import { d as defineCustomElement$1 } from './p-
|
|
3
|
+
import { d as defineCustomElement$1 } from './p-96e83134.js';
|
|
4
4
|
|
|
5
5
|
const tooltipCss = ".sc-tds-tooltip-h{position:absolute}.tds-tooltip.sc-tds-tooltip{box-sizing:border-box;font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);color:var(--tds-tooltip-color);background-color:var(--tds-tooltip-background);border-radius:4px;padding:8px;word-wrap:break-word;white-space:normal;max-width:192px;z-index:900;opacity:0;visibility:hidden;transition:opacity 200ms ease-in, visibility 200ms ease-in}.tds-tooltip.sc-tds-tooltip *.sc-tds-tooltip{box-sizing:border-box}.tds-tooltip.tds-tooltip-top-left.sc-tds-tooltip{border-radius:0 4px 4px}.tds-tooltip.tds-tooltip-top-right.sc-tds-tooltip{border-radius:4px 0 4px 4px}.tds-tooltip.tds-tooltip-bottom-right.sc-tds-tooltip{border-radius:4px 4px 0}.tds-tooltip.tds-tooltip-bottom-left.sc-tds-tooltip{border-radius:4px 4px 4px 0}.tds-tooltip-show.sc-tds-tooltip{opacity:1;visibility:visible}";
|
|
6
6
|
const TdsTooltipStyle0 = tooltipCss;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { p as proxyCustomElement, H, h, c as Host } from './p-28ef5186.js';
|
|
2
2
|
import { i as inheritAttributes } from './p-3fe9cbbf.js';
|
|
3
|
-
import { d as defineCustomElement$1 } from './p-
|
|
3
|
+
import { d as defineCustomElement$1 } from './p-96e83134.js';
|
|
4
4
|
|
|
5
5
|
const popoverCanvasCss = ".tds-popover-canvas.sc-tds-popover-canvas{box-sizing:border-box;display:inline-block;color:var(--tds-popover-canvas-color);background-color:var(--tds-popover-canvas-background);box-shadow:0 3px 3px rgba(0, 0, 0, 0.15), 0 -1px 1px rgba(0, 0, 0, 0.1);border-radius:4px;z-index:900}.tds-popover-canvas.sc-tds-popover-canvas *.sc-tds-popover-canvas{box-sizing:border-box}";
|
|
6
6
|
const TdsPopoverCanvasStyle0 = popoverCanvasCss;
|