@spectrum-web-components/toast 0.10.15-devmode2.0 → 0.11.1
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/package.json +6 -6
- package/sp-toast.dev.js +1 -0
- package/sp-toast.dev.js.map +1 -1
- package/sp-toast.js +1 -2
- package/sp-toast.js.map +2 -2
- package/src/Toast.dev.js +8 -5
- package/src/Toast.dev.js.map +1 -1
- package/src/Toast.js +5 -167
- package/src/Toast.js.map +2 -2
- package/src/index.dev.js +1 -0
- package/src/index.dev.js.map +1 -1
- package/src/index.js +1 -1
- package/src/index.js.map +1 -1
- package/src/spectrum-toast.css.dev.js +1 -0
- package/src/spectrum-toast.css.dev.js.map +1 -1
- package/src/spectrum-toast.css.js +2 -4
- package/src/spectrum-toast.css.js.map +2 -2
- package/src/toast.css.dev.js +1 -0
- package/src/toast.css.dev.js.map +1 -1
- package/src/toast.css.js +2 -4
- package/src/toast.css.js.map +2 -2
- package/stories/toast.stories.js +1 -0
- package/stories/toast.stories.js.map +1 -1
- package/test/benchmark/test-basic.js +1 -0
- package/test/benchmark/test-basic.js.map +1 -1
- package/test/toast.test-vrt.js +1 -0
- package/test/toast.test-vrt.js.map +1 -1
- package/test/toast.test.js +68 -31
- package/test/toast.test.js.map +1 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spectrum-web-components/toast",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.11.1",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -57,10 +57,10 @@
|
|
|
57
57
|
"lit-html"
|
|
58
58
|
],
|
|
59
59
|
"dependencies": {
|
|
60
|
-
"@spectrum-web-components/base": "^0.
|
|
61
|
-
"@spectrum-web-components/button": "^0.
|
|
62
|
-
"@spectrum-web-components/icon": "^0.
|
|
63
|
-
"@spectrum-web-components/icons-workflow": "^0.
|
|
60
|
+
"@spectrum-web-components/base": "^0.7.0",
|
|
61
|
+
"@spectrum-web-components/button": "^0.19.1",
|
|
62
|
+
"@spectrum-web-components/icon": "^0.12.0",
|
|
63
|
+
"@spectrum-web-components/icons-workflow": "^0.9.0",
|
|
64
64
|
"tslib": "^2.0.0"
|
|
65
65
|
},
|
|
66
66
|
"devDependencies": {
|
|
@@ -72,5 +72,5 @@
|
|
|
72
72
|
"./sp-*.js",
|
|
73
73
|
"./**/*.dev.js"
|
|
74
74
|
],
|
|
75
|
-
"gitHead": "
|
|
75
|
+
"gitHead": "1cfea66c39440232b9982509573801b8e3a9f692"
|
|
76
76
|
}
|
package/sp-toast.dev.js
CHANGED
package/sp-toast.dev.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["sp-toast.ts"],
|
|
4
4
|
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { Toast } from './src/Toast.dev.js'\n\ncustomElements.define('sp-toast', Toast);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sp-toast': Toast;\n }\n}\n"],
|
|
5
|
-
"mappings": "AAWA;
|
|
5
|
+
"mappings": ";AAWA,SAAS,aAAa;AAEtB,eAAe,OAAO,YAAY,KAAK;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/sp-toast.js
CHANGED
package/sp-toast.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["sp-toast.ts"],
|
|
4
4
|
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { Toast } from './src/Toast.js';\n\ncustomElements.define('sp-toast', Toast);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sp-toast': Toast;\n }\n}\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "aAWA,OAAS,SAAAA,MAAa,iBAEtB,eAAe,OAAO,WAAYA,CAAK",
|
|
6
|
+
"names": ["Toast"]
|
|
7
7
|
}
|
package/src/Toast.dev.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
var __defProp = Object.defineProperty;
|
|
2
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
4
|
var __decorateClass = (decorators, target, key, kind) => {
|
|
@@ -127,11 +128,13 @@ export class Toast extends SpectrumElement {
|
|
|
127
128
|
this.countdownStart = 0;
|
|
128
129
|
}
|
|
129
130
|
shouldClose() {
|
|
130
|
-
const applyDefault = this.dispatchEvent(
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
131
|
+
const applyDefault = this.dispatchEvent(
|
|
132
|
+
new CustomEvent("close", {
|
|
133
|
+
composed: true,
|
|
134
|
+
bubbles: true,
|
|
135
|
+
cancelable: true
|
|
136
|
+
})
|
|
137
|
+
);
|
|
135
138
|
if (applyDefault) {
|
|
136
139
|
this.close();
|
|
137
140
|
}
|
package/src/Toast.dev.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["Toast.ts"],
|
|
4
4
|
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n CSSResultArray,\n html,\n PropertyValues,\n SpectrumElement,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport '@spectrum-web-components/button/sp-close-button.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-info.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-checkmark-circle.js';\n\nimport toastStyles from './toast.css.js';\n\nexport const toastVariants: ToastVariants[] = [\n 'negative',\n 'positive',\n 'info',\n 'error',\n 'warning',\n];\n\nexport type ToastVariants =\n | 'negative'\n | 'positive'\n | 'info'\n | 'error'\n | 'warning'\n | '';\n\n/**\n * @element sp-toast\n *\n * @slot - The toast content\n * @slot action - button element surfacing an action in the Toast\n *\n * @fires close - Announces that the Toast has been closed by the user or by its timeout.\n */\n\nexport class Toast extends SpectrumElement {\n public static override get styles(): CSSResultArray {\n return [toastStyles];\n }\n\n @property({ type: Boolean, reflect: true })\n public open = false;\n\n /**\n * When a timeout is provided it represents the number of milliseconds from when\n * the Toast was placed on the page before it will automatically dismiss itself.\n * Accessibility concerns require that a Toast is available for at least 6000ms\n * before being dismissed, so any timeout of less than 6000ms will be raised to\n * that baseline. It is suggested that messages longer than 120 words should\n * receive another 1000ms in their timeout for each additional 120 words in the\n * message. E.G. 240 words = 7000ms, 360 words = 8000ms, etc.\n *\n * @param {Number} timeout\n */\n @property({ type: Number })\n public set timeout(timeout: number | null) {\n const hasTimeout = typeof timeout !== null && (timeout as number) > 0;\n const newTimeout = hasTimeout\n ? Math.max(6000, timeout as number)\n : null;\n const oldValue = this.timeout;\n if (newTimeout && this.countdownStart) {\n this.countdownStart = performance.now();\n }\n this._timeout = newTimeout;\n this.requestUpdate('timeout', oldValue);\n }\n\n public get timeout(): number | null {\n return this._timeout;\n }\n\n public _timeout: number | null = null;\n\n /**\n * The variant applies specific styling when set to `negative`, `positive`, `info`, `error`, or `warning`.\n * `variant` attribute is removed when not matching one of the above.\n *\n * @param {String} variant\n */\n @property({ type: String })\n public set variant(variant: ToastVariants) {\n if (variant === this.variant) {\n return;\n }\n const oldValue = this.variant;\n if (toastVariants.includes(variant)) {\n this.setAttribute('variant', variant);\n this._variant = variant;\n } else {\n this.removeAttribute('variant');\n this._variant = '';\n }\n this.requestUpdate('variant', oldValue);\n }\n\n public get variant(): ToastVariants {\n return this._variant;\n }\n\n private _variant: ToastVariants = '';\n\n private renderIcon(variant: string): TemplateResult {\n switch (variant) {\n case 'info':\n return html`\n <sp-icon-info\n label=\"Information\"\n class=\"type\"\n ></sp-icon-info>\n `;\n case 'negative':\n case 'error': // deprecated\n case 'warning': // deprecated\n return html`\n <sp-icon-alert label=\"Error\" class=\"type\"></sp-icon-alert>\n `;\n case 'positive':\n case 'success': // deprecated\n return html`\n <sp-icon-checkmark-circle\n label=\"Success\"\n class=\"type\"\n ></sp-icon-checkmark-circle>\n `;\n default:\n return html``;\n }\n }\n\n private countdownStart = 0;\n private nextCount = -1;\n\n private doCountdown = (time: number): void => {\n if (!this.countdownStart) {\n this.countdownStart = performance.now();\n }\n if (time - this.countdownStart > (this._timeout as number)) {\n this.shouldClose();\n this.countdownStart = 0;\n } else {\n this.countdown();\n }\n };\n\n private countdown = (): void => {\n cancelAnimationFrame(this.nextCount);\n this.nextCount = requestAnimationFrame(this.doCountdown);\n };\n\n private holdCountdown = (): void => {\n this.stopCountdown();\n this.addEventListener('focusout', this.resumeCountdown);\n };\n\n private resumeCountdown = (): void => {\n this.removeEventListener('focusout', this.holdCountdown);\n this.countdown();\n };\n\n private startCountdown(): void {\n this.countdown();\n this.addEventListener('focusin', this.holdCountdown);\n }\n\n private stopCountdown(): void {\n cancelAnimationFrame(this.nextCount);\n this.countdownStart = 0;\n }\n\n private shouldClose(): void {\n const applyDefault = this.dispatchEvent(\n new CustomEvent('close', {\n composed: true,\n bubbles: true,\n cancelable: true,\n })\n );\n if (applyDefault) {\n this.close();\n }\n }\n\n public close(): void {\n this.open = false;\n }\n\n protected override render(): TemplateResult {\n return html`\n ${this.renderIcon(this.variant)}\n <div class=\"body\" role=\"alert\">\n <div class=\"content\">\n <slot></slot>\n </div>\n <slot name=\"action\"></slot>\n </div>\n <div class=\"buttons\">\n <sp-close-button\n @click=${this.shouldClose}\n label=\"Close\"\n variant=\"white\"\n ></sp-close-button>\n </div>\n `;\n }\n\n protected override updated(changes: PropertyValues): void {\n super.updated(changes);\n if (changes.has('open')) {\n if (this.open) {\n if (this.timeout) {\n this.startCountdown();\n }\n } else {\n if (this.timeout) {\n this.stopCountdown();\n }\n }\n }\n if (changes.has('timeout')) {\n if (this.timeout !== null && this.open) {\n this.startCountdown();\n } else {\n this.stopCountdown();\n }\n }\n }\n}\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/src/Toast.js
CHANGED
|
@@ -1,146 +1,16 @@
|
|
|
1
|
-
var
|
|
2
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
-
var __decorateClass = (decorators, target, key, kind) => {
|
|
4
|
-
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
|
|
5
|
-
for (var i = decorators.length - 1, decorator; i >= 0; i--)
|
|
6
|
-
if (decorator = decorators[i])
|
|
7
|
-
result = (kind ? decorator(target, key, result) : decorator(result)) || result;
|
|
8
|
-
if (kind && result)
|
|
9
|
-
__defProp(target, key, result);
|
|
10
|
-
return result;
|
|
11
|
-
};
|
|
12
|
-
import {
|
|
13
|
-
html,
|
|
14
|
-
SpectrumElement
|
|
15
|
-
} from "@spectrum-web-components/base";
|
|
16
|
-
import { property } from "@spectrum-web-components/base/src/decorators.js";
|
|
17
|
-
import "@spectrum-web-components/button/sp-close-button.js";
|
|
18
|
-
import "@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js";
|
|
19
|
-
import "@spectrum-web-components/icons-workflow/icons/sp-icon-info.js";
|
|
20
|
-
import "@spectrum-web-components/icons-workflow/icons/sp-icon-checkmark-circle.js";
|
|
21
|
-
import toastStyles from "./toast.css.js";
|
|
22
|
-
export const toastVariants = [
|
|
23
|
-
"negative",
|
|
24
|
-
"positive",
|
|
25
|
-
"info",
|
|
26
|
-
"error",
|
|
27
|
-
"warning"
|
|
28
|
-
];
|
|
29
|
-
export class Toast extends SpectrumElement {
|
|
30
|
-
constructor() {
|
|
31
|
-
super(...arguments);
|
|
32
|
-
this.open = false;
|
|
33
|
-
this._timeout = null;
|
|
34
|
-
this._variant = "";
|
|
35
|
-
this.countdownStart = 0;
|
|
36
|
-
this.nextCount = -1;
|
|
37
|
-
this.doCountdown = (time) => {
|
|
38
|
-
if (!this.countdownStart) {
|
|
39
|
-
this.countdownStart = performance.now();
|
|
40
|
-
}
|
|
41
|
-
if (time - this.countdownStart > this._timeout) {
|
|
42
|
-
this.shouldClose();
|
|
43
|
-
this.countdownStart = 0;
|
|
44
|
-
} else {
|
|
45
|
-
this.countdown();
|
|
46
|
-
}
|
|
47
|
-
};
|
|
48
|
-
this.countdown = () => {
|
|
49
|
-
cancelAnimationFrame(this.nextCount);
|
|
50
|
-
this.nextCount = requestAnimationFrame(this.doCountdown);
|
|
51
|
-
};
|
|
52
|
-
this.holdCountdown = () => {
|
|
53
|
-
this.stopCountdown();
|
|
54
|
-
this.addEventListener("focusout", this.resumeCountdown);
|
|
55
|
-
};
|
|
56
|
-
this.resumeCountdown = () => {
|
|
57
|
-
this.removeEventListener("focusout", this.holdCountdown);
|
|
58
|
-
this.countdown();
|
|
59
|
-
};
|
|
60
|
-
}
|
|
61
|
-
static get styles() {
|
|
62
|
-
return [toastStyles];
|
|
63
|
-
}
|
|
64
|
-
set timeout(timeout) {
|
|
65
|
-
const hasTimeout = typeof timeout !== null && timeout > 0;
|
|
66
|
-
const newTimeout = hasTimeout ? Math.max(6e3, timeout) : null;
|
|
67
|
-
const oldValue = this.timeout;
|
|
68
|
-
if (newTimeout && this.countdownStart) {
|
|
69
|
-
this.countdownStart = performance.now();
|
|
70
|
-
}
|
|
71
|
-
this._timeout = newTimeout;
|
|
72
|
-
this.requestUpdate("timeout", oldValue);
|
|
73
|
-
}
|
|
74
|
-
get timeout() {
|
|
75
|
-
return this._timeout;
|
|
76
|
-
}
|
|
77
|
-
set variant(variant) {
|
|
78
|
-
if (variant === this.variant) {
|
|
79
|
-
return;
|
|
80
|
-
}
|
|
81
|
-
const oldValue = this.variant;
|
|
82
|
-
if (toastVariants.includes(variant)) {
|
|
83
|
-
this.setAttribute("variant", variant);
|
|
84
|
-
this._variant = variant;
|
|
85
|
-
} else {
|
|
86
|
-
this.removeAttribute("variant");
|
|
87
|
-
this._variant = "";
|
|
88
|
-
}
|
|
89
|
-
this.requestUpdate("variant", oldValue);
|
|
90
|
-
}
|
|
91
|
-
get variant() {
|
|
92
|
-
return this._variant;
|
|
93
|
-
}
|
|
94
|
-
renderIcon(variant) {
|
|
95
|
-
switch (variant) {
|
|
96
|
-
case "info":
|
|
97
|
-
return html`
|
|
1
|
+
"use strict";var c=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var r=(a,i,t,o)=>{for(var e=o>1?void 0:o?p(i,t):i,n=a.length-1,u;n>=0;n--)(u=a[n])&&(e=(o?u(i,t,e):u(e))||e);return o&&e&&c(i,t,e),e};import{html as s,SpectrumElement as d}from"@spectrum-web-components/base";import{property as l}from"@spectrum-web-components/base/src/decorators.js";import"@spectrum-web-components/button/sp-close-button.js";import"@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js";import"@spectrum-web-components/icons-workflow/icons/sp-icon-info.js";import"@spectrum-web-components/icons-workflow/icons/sp-icon-checkmark-circle.js";import h from"./toast.css.js";export const toastVariants=["negative","positive","info","error","warning"];export class Toast extends d{constructor(){super(...arguments);this.open=!1;this._timeout=null;this._variant="";this.countdownStart=0;this.nextCount=-1;this.doCountdown=t=>{this.countdownStart||(this.countdownStart=performance.now()),t-this.countdownStart>this._timeout?(this.shouldClose(),this.countdownStart=0):this.countdown()};this.countdown=()=>{cancelAnimationFrame(this.nextCount),this.nextCount=requestAnimationFrame(this.doCountdown)};this.holdCountdown=()=>{this.stopCountdown(),this.addEventListener("focusout",this.resumeCountdown)};this.resumeCountdown=()=>{this.removeEventListener("focusout",this.holdCountdown),this.countdown()}}static get styles(){return[h]}set timeout(t){const e=typeof t!==null&&t>0?Math.max(6e3,t):null,n=this.timeout;e&&this.countdownStart&&(this.countdownStart=performance.now()),this._timeout=e,this.requestUpdate("timeout",n)}get timeout(){return this._timeout}set variant(t){if(t===this.variant)return;const o=this.variant;toastVariants.includes(t)?(this.setAttribute("variant",t),this._variant=t):(this.removeAttribute("variant"),this._variant=""),this.requestUpdate("variant",o)}get variant(){return this._variant}renderIcon(t){switch(t){case"info":return s`
|
|
98
2
|
<sp-icon-info
|
|
99
3
|
label="Information"
|
|
100
4
|
class="type"
|
|
101
5
|
></sp-icon-info>
|
|
102
|
-
`;
|
|
103
|
-
case "negative":
|
|
104
|
-
case "error":
|
|
105
|
-
case "warning":
|
|
106
|
-
return html`
|
|
6
|
+
`;case"negative":case"error":case"warning":return s`
|
|
107
7
|
<sp-icon-alert label="Error" class="type"></sp-icon-alert>
|
|
108
|
-
`;
|
|
109
|
-
case "positive":
|
|
110
|
-
case "success":
|
|
111
|
-
return html`
|
|
8
|
+
`;case"positive":case"success":return s`
|
|
112
9
|
<sp-icon-checkmark-circle
|
|
113
10
|
label="Success"
|
|
114
11
|
class="type"
|
|
115
12
|
></sp-icon-checkmark-circle>
|
|
116
|
-
`;
|
|
117
|
-
default:
|
|
118
|
-
return html``;
|
|
119
|
-
}
|
|
120
|
-
}
|
|
121
|
-
startCountdown() {
|
|
122
|
-
this.countdown();
|
|
123
|
-
this.addEventListener("focusin", this.holdCountdown);
|
|
124
|
-
}
|
|
125
|
-
stopCountdown() {
|
|
126
|
-
cancelAnimationFrame(this.nextCount);
|
|
127
|
-
this.countdownStart = 0;
|
|
128
|
-
}
|
|
129
|
-
shouldClose() {
|
|
130
|
-
const applyDefault = this.dispatchEvent(new CustomEvent("close", {
|
|
131
|
-
composed: true,
|
|
132
|
-
bubbles: true,
|
|
133
|
-
cancelable: true
|
|
134
|
-
}));
|
|
135
|
-
if (applyDefault) {
|
|
136
|
-
this.close();
|
|
137
|
-
}
|
|
138
|
-
}
|
|
139
|
-
close() {
|
|
140
|
-
this.open = false;
|
|
141
|
-
}
|
|
142
|
-
render() {
|
|
143
|
-
return html`
|
|
13
|
+
`;default:return s``}}startCountdown(){this.countdown(),this.addEventListener("focusin",this.holdCountdown)}stopCountdown(){cancelAnimationFrame(this.nextCount),this.countdownStart=0}shouldClose(){this.dispatchEvent(new CustomEvent("close",{composed:!0,bubbles:!0,cancelable:!0}))&&this.close()}close(){this.open=!1}render(){return s`
|
|
144
14
|
${this.renderIcon(this.variant)}
|
|
145
15
|
<div class="body" role="alert">
|
|
146
16
|
<div class="content">
|
|
@@ -155,37 +25,5 @@ export class Toast extends SpectrumElement {
|
|
|
155
25
|
variant="white"
|
|
156
26
|
></sp-close-button>
|
|
157
27
|
</div>
|
|
158
|
-
|
|
159
|
-
}
|
|
160
|
-
updated(changes) {
|
|
161
|
-
super.updated(changes);
|
|
162
|
-
if (changes.has("open")) {
|
|
163
|
-
if (this.open) {
|
|
164
|
-
if (this.timeout) {
|
|
165
|
-
this.startCountdown();
|
|
166
|
-
}
|
|
167
|
-
} else {
|
|
168
|
-
if (this.timeout) {
|
|
169
|
-
this.stopCountdown();
|
|
170
|
-
}
|
|
171
|
-
}
|
|
172
|
-
}
|
|
173
|
-
if (changes.has("timeout")) {
|
|
174
|
-
if (this.timeout !== null && this.open) {
|
|
175
|
-
this.startCountdown();
|
|
176
|
-
} else {
|
|
177
|
-
this.stopCountdown();
|
|
178
|
-
}
|
|
179
|
-
}
|
|
180
|
-
}
|
|
181
|
-
}
|
|
182
|
-
__decorateClass([
|
|
183
|
-
property({ type: Boolean, reflect: true })
|
|
184
|
-
], Toast.prototype, "open", 2);
|
|
185
|
-
__decorateClass([
|
|
186
|
-
property({ type: Number })
|
|
187
|
-
], Toast.prototype, "timeout", 1);
|
|
188
|
-
__decorateClass([
|
|
189
|
-
property({ type: String })
|
|
190
|
-
], Toast.prototype, "variant", 1);
|
|
28
|
+
`}updated(t){super.updated(t),t.has("open")&&(this.open?this.timeout&&this.startCountdown():this.timeout&&this.stopCountdown()),t.has("timeout")&&(this.timeout!==null&&this.open?this.startCountdown():this.stopCountdown())}}r([l({type:Boolean,reflect:!0})],Toast.prototype,"open",2),r([l({type:Number})],Toast.prototype,"timeout",1),r([l({type:String})],Toast.prototype,"variant",1);
|
|
191
29
|
//# sourceMappingURL=Toast.js.map
|
package/src/Toast.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["Toast.ts"],
|
|
4
4
|
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n CSSResultArray,\n html,\n PropertyValues,\n SpectrumElement,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport '@spectrum-web-components/button/sp-close-button.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-info.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-checkmark-circle.js';\n\nimport toastStyles from './toast.css.js';\n\nexport const toastVariants: ToastVariants[] = [\n 'negative',\n 'positive',\n 'info',\n 'error',\n 'warning',\n];\n\nexport type ToastVariants =\n | 'negative'\n | 'positive'\n | 'info'\n | 'error'\n | 'warning'\n | '';\n\n/**\n * @element sp-toast\n *\n * @slot - The toast content\n * @slot action - button element surfacing an action in the Toast\n *\n * @fires close - Announces that the Toast has been closed by the user or by its timeout.\n */\n\nexport class Toast extends SpectrumElement {\n public static override get styles(): CSSResultArray {\n return [toastStyles];\n }\n\n @property({ type: Boolean, reflect: true })\n public open = false;\n\n /**\n * When a timeout is provided it represents the number of milliseconds from when\n * the Toast was placed on the page before it will automatically dismiss itself.\n * Accessibility concerns require that a Toast is available for at least 6000ms\n * before being dismissed, so any timeout of less than 6000ms will be raised to\n * that baseline. It is suggested that messages longer than 120 words should\n * receive another 1000ms in their timeout for each additional 120 words in the\n * message. E.G. 240 words = 7000ms, 360 words = 8000ms, etc.\n *\n * @param {Number} timeout\n */\n @property({ type: Number })\n public set timeout(timeout: number | null) {\n const hasTimeout = typeof timeout !== null && (timeout as number) > 0;\n const newTimeout = hasTimeout\n ? Math.max(6000, timeout as number)\n : null;\n const oldValue = this.timeout;\n if (newTimeout && this.countdownStart) {\n this.countdownStart = performance.now();\n }\n this._timeout = newTimeout;\n this.requestUpdate('timeout', oldValue);\n }\n\n public get timeout(): number | null {\n return this._timeout;\n }\n\n public _timeout: number | null = null;\n\n /**\n * The variant applies specific styling when set to `negative`, `positive`, `info`, `error`, or `warning`.\n * `variant` attribute is removed when not matching one of the above.\n *\n * @param {String} variant\n */\n @property({ type: String })\n public set variant(variant: ToastVariants) {\n if (variant === this.variant) {\n return;\n }\n const oldValue = this.variant;\n if (toastVariants.includes(variant)) {\n this.setAttribute('variant', variant);\n this._variant = variant;\n } else {\n this.removeAttribute('variant');\n this._variant = '';\n }\n this.requestUpdate('variant', oldValue);\n }\n\n public get variant(): ToastVariants {\n return this._variant;\n }\n\n private _variant: ToastVariants = '';\n\n private renderIcon(variant: string): TemplateResult {\n switch (variant) {\n case 'info':\n return html`\n <sp-icon-info\n label=\"Information\"\n class=\"type\"\n ></sp-icon-info>\n `;\n case 'negative':\n case 'error': // deprecated\n case 'warning': // deprecated\n return html`\n <sp-icon-alert label=\"Error\" class=\"type\"></sp-icon-alert>\n `;\n case 'positive':\n case 'success': // deprecated\n return html`\n <sp-icon-checkmark-circle\n label=\"Success\"\n class=\"type\"\n ></sp-icon-checkmark-circle>\n `;\n default:\n return html``;\n }\n }\n\n private countdownStart = 0;\n private nextCount = -1;\n\n private doCountdown = (time: number): void => {\n if (!this.countdownStart) {\n this.countdownStart = performance.now();\n }\n if (time - this.countdownStart > (this._timeout as number)) {\n this.shouldClose();\n this.countdownStart = 0;\n } else {\n this.countdown();\n }\n };\n\n private countdown = (): void => {\n cancelAnimationFrame(this.nextCount);\n this.nextCount = requestAnimationFrame(this.doCountdown);\n };\n\n private holdCountdown = (): void => {\n this.stopCountdown();\n this.addEventListener('focusout', this.resumeCountdown);\n };\n\n private resumeCountdown = (): void => {\n this.removeEventListener('focusout', this.holdCountdown);\n this.countdown();\n };\n\n private startCountdown(): void {\n this.countdown();\n this.addEventListener('focusin', this.holdCountdown);\n }\n\n private stopCountdown(): void {\n cancelAnimationFrame(this.nextCount);\n this.countdownStart = 0;\n }\n\n private shouldClose(): void {\n const applyDefault = this.dispatchEvent(\n new CustomEvent('close', {\n composed: true,\n bubbles: true,\n cancelable: true,\n })\n );\n if (applyDefault) {\n this.close();\n }\n }\n\n public close(): void {\n this.open = false;\n }\n\n protected override render(): TemplateResult {\n return html`\n ${this.renderIcon(this.variant)}\n <div class=\"body\" role=\"alert\">\n <div class=\"content\">\n <slot></slot>\n </div>\n <slot name=\"action\"></slot>\n </div>\n <div class=\"buttons\">\n <sp-close-button\n @click=${this.shouldClose}\n label=\"Close\"\n variant=\"white\"\n ></sp-close-button>\n </div>\n `;\n }\n\n protected override updated(changes: PropertyValues): void {\n super.updated(changes);\n if (changes.has('open')) {\n if (this.open) {\n if (this.timeout) {\n this.startCountdown();\n }\n } else {\n if (this.timeout) {\n this.stopCountdown();\n }\n }\n }\n if (changes.has('timeout')) {\n if (this.timeout !== null && this.open) {\n this.startCountdown();\n } else {\n this.stopCountdown();\n }\n }\n }\n}\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["html", "SpectrumElement", "property", "toastStyles", "time", "timeout", "newTimeout", "oldValue", "variant", "changes", "__decorateClass"]
|
|
7
7
|
}
|
package/src/index.dev.js
CHANGED
package/src/index.dev.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["index.ts"],
|
|
4
4
|
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nexport * from './Toast.dev.js'\n"],
|
|
5
|
-
"mappings": "AAWA;",
|
|
5
|
+
"mappings": ";AAWA,cAAc;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/src/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export
|
|
1
|
+
"use strict";export*from"./Toast.js";
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/src/index.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["index.ts"],
|
|
4
4
|
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nexport * from './Toast.js';\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": "aAWA,WAAc",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["spectrum-toast.css.ts"],
|
|
4
4
|
"sourcesContent": ["/*\nCopyright 2022 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-toast-icon-padding-y:var(\n--spectrum-global-dimension-size-85\n);--spectrum-toast-neutral-content-padding-top:var(\n--spectrum-global-dimension-size-65\n);--spectrum-toast-content-padding-bottom:var(\n--spectrum-global-dimension-size-65\n);--spectrum-toast-button-margin-right:var(\n--spectrum-global-dimension-size-130\n)}:host([dir=ltr]){padding-right:var(\n--spectrum-toast-neutral-padding-right,var(--spectrum-global-dimension-size-100)\n)}:host([dir=rtl]){padding-left:var(\n--spectrum-toast-neutral-padding-right,var(--spectrum-global-dimension-size-100)\n)}:host([dir=ltr]){padding-left:var(\n--spectrum-toast-neutral-padding-left,var(--spectrum-global-dimension-size-200)\n)}:host([dir=rtl]){padding-right:var(\n--spectrum-toast-neutral-padding-left,var(--spectrum-global-dimension-size-200)\n)}:host{-webkit-font-smoothing:antialiased;align-items:stretch;border-radius:var(\n--spectrum-toast-neutral-border-radius,var(--spectrum-alias-border-radius-regular)\n);box-sizing:border-box;display:inline-flex;flex-direction:row;font-size:var(\n--spectrum-toast-neutral-text-size,var(--spectrum-global-dimension-font-size-100)\n);font-weight:var(\n--spectrum-toast-neutral-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);padding-bottom:var(\n--spectrum-toast-neutral-padding-y,var(--spectrum-global-dimension-size-100)\n);padding-top:var(\n--spectrum-toast-neutral-padding-y,var(--spectrum-global-dimension-size-100)\n)}:host([dir=ltr]) .type{margin-right:var(\n--spectrum-toast-neutral-icon-padding-right,var(--spectrum-global-dimension-size-150)\n)}:host([dir=rtl]) .type{margin-left:var(\n--spectrum-toast-neutral-icon-padding-right,var(--spectrum-global-dimension-size-150)\n)}:host([dir=ltr]) .type{margin-left:0}:host([dir=rtl]) .type{margin-right:0}.type{flex-grow:0;flex-shrink:0;margin-bottom:var(--spectrum-toast-icon-padding-y);margin-top:var(--spectrum-toast-icon-padding-y)}:host([dir=ltr]) .content{padding-right:var(\n--spectrum-toast-neutral-content-padding-right,var(--spectrum-global-dimension-size-200)\n)}:host([dir=rtl]) .content{padding-left:var(\n--spectrum-toast-neutral-content-padding-right,var(--spectrum-global-dimension-size-200)\n)}:host([dir=ltr]) .content{padding-left:0}:host([dir=rtl]) .content{padding-right:0}:host([dir=ltr]) .content{text-align:left}:host([dir=rtl]) .content{text-align:right}.content{box-sizing:border-box;display:inline-block;flex:1 1 auto;font-size:var(\n--spectrum-toast-info-text-size,var(--spectrum-global-dimension-font-size-100)\n);font-weight:var(\n--spectrum-toast-info-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);line-height:var(\n--spectrum-toast-info-text-line-height,var(--spectrum-alias-component-text-line-height)\n);padding-bottom:var(--spectrum-toast-content-padding-bottom);padding-top:var(\n--spectrum-toast-neutral-content-padding-top,var(--spectrum-global-dimension-size-65)\n)}.buttons{align-items:flex-start;display:flex;flex:0 0 auto}:host([dir=ltr]) .buttons .spectrum-ClearButton+.spectrum-ClearButton,:host([dir=ltr]) .buttons .spectrum-ClearButton+::slotted([slot=action]),:host([dir=ltr]) .buttons slot[name=action]+.spectrum-ClearButton,:host([dir=ltr]) .buttons slot[name=action]+::slotted([slot=action]){margin-left:var(\n--spectrum-toast-neutral-button-gap-x,var(--spectrum-global-dimension-size-100)\n)}:host([dir=rtl]) .buttons .spectrum-ClearButton+.spectrum-ClearButton,:host([dir=rtl]) .buttons .spectrum-ClearButton+::slotted([slot=action]),:host([dir=rtl]) .buttons slot[name=action]+.spectrum-ClearButton,:host([dir=rtl]) .buttons slot[name=action]+::slotted([slot=action]){margin-right:var(\n--spectrum-toast-neutral-button-gap-x,var(--spectrum-global-dimension-size-100)\n)}.body{align-self:center;flex:1 1 auto}:host([dir=ltr]) .body ::slotted([slot=action]){float:right}:host([dir=rtl]) .body ::slotted([slot=action]){float:left}:host([dir=ltr]) .body ::slotted([slot=action]){margin-right:var(\n--spectrum-toast-button-margin-right\n)}:host([dir=rtl]) .body ::slotted([slot=action]){margin-left:var(\n--spectrum-toast-button-margin-right\n)}:host([dir=ltr]) .body+.buttons{padding-left:var(\n--spectrum-toast-neutral-padding-right,var(--spectrum-global-dimension-size-100)\n)}:host([dir=rtl]) .body+.buttons{padding-right:var(\n--spectrum-toast-neutral-padding-right,var(--spectrum-global-dimension-size-100)\n)}:host([dir=ltr]) .body+.buttons{border-left-width:1px}:host([dir=rtl]) .body+.buttons{border-right-width:1px}:host([dir=ltr]) .body+.buttons{border-left-style:solid}:host([dir=rtl]) .body+.buttons{border-right-style:solid}:host{background-color:var(\n--spectrum-toast-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n);color:var(\n--spectrum-toast-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n)}.content{color:var(\n--spectrum-toast-neutral-text-color,var(--spectrum-global-color-static-white)\n)}.type{color:#fff}:host([dir=ltr]) .buttons{border-left-color:hsla(0,0%,100%,.2)}:host([dir=rtl]) .buttons{border-right-color:hsla(0,0%,100%,.2)}:host([variant=error]),:host([variant=negative]){background-color:var(\n--spectrum-toast-negative-background-color,var(--spectrum-semantic-negative-background-color)\n);color:var(\n--spectrum-toast-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}:host([variant=error]) .closeButton.focus-visible:not(:active),:host([variant=negative]) .closeButton.focus-visible:not(:active){color:var(\n--spectrum-toast-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}:host([variant=error]) .closeButton:focus-visible:not(:active),:host([variant=negative]) .closeButton:focus-visible:not(:active){color:var(\n--spectrum-toast-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}:host([variant=info]){background-color:var(\n--spectrum-toast-info-background-color,var(--spectrum-semantic-informative-background-color)\n);color:var(\n--spectrum-toast-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}:host([variant=info]) .closeButton.focus-visible:not(:active){color:var(\n--spectrum-toast-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}:host([variant=info]) .closeButton:focus-visible:not(:active){color:var(\n--spectrum-toast-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}:host([variant=positive]),:host([variant=success]){background-color:var(\n--spectrum-toast-positive-background-color,var(--spectrum-semantic-positive-background-color)\n);color:var(\n--spectrum-toast-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}:host([variant=positive]) .closeButton.focus-visible:not(:active),:host([variant=success]) .closeButton.focus-visible:not(:active){color:var(\n--spectrum-toast-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}:host([variant=positive]) .closeButton:focus-visible:not(:active),:host([variant=success]) .closeButton:focus-visible:not(:active){color:var(\n--spectrum-toast-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}@media (forced-colors:active){:host{border:1px solid transparent}}\n`;\nexport default styles;"],
|
|
5
|
-
"mappings": "AAWA;
|
|
5
|
+
"mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAuFf,eAAe;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
import
|
|
2
|
-
const styles = css`
|
|
1
|
+
"use strict";import{css as t}from"@spectrum-web-components/base";const o=t`
|
|
3
2
|
:host{--spectrum-toast-icon-padding-y:var(
|
|
4
3
|
--spectrum-global-dimension-size-85
|
|
5
4
|
);--spectrum-toast-neutral-content-padding-top:var(
|
|
@@ -85,6 +84,5 @@ const styles = css`
|
|
|
85
84
|
)}:host([variant=positive]) .closeButton:focus-visible:not(:active),:host([variant=success]) .closeButton:focus-visible:not(:active){color:var(
|
|
86
85
|
--spectrum-toast-positive-background-color,var(--spectrum-semantic-positive-background-color)
|
|
87
86
|
)}@media (forced-colors:active){:host{border:1px solid transparent}}
|
|
88
|
-
`;
|
|
89
|
-
export default styles;
|
|
87
|
+
`;export default o;
|
|
90
88
|
//# sourceMappingURL=spectrum-toast.css.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["spectrum-toast.css.ts"],
|
|
4
4
|
"sourcesContent": ["/*\nCopyright 2022 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-toast-icon-padding-y:var(\n--spectrum-global-dimension-size-85\n);--spectrum-toast-neutral-content-padding-top:var(\n--spectrum-global-dimension-size-65\n);--spectrum-toast-content-padding-bottom:var(\n--spectrum-global-dimension-size-65\n);--spectrum-toast-button-margin-right:var(\n--spectrum-global-dimension-size-130\n)}:host([dir=ltr]){padding-right:var(\n--spectrum-toast-neutral-padding-right,var(--spectrum-global-dimension-size-100)\n)}:host([dir=rtl]){padding-left:var(\n--spectrum-toast-neutral-padding-right,var(--spectrum-global-dimension-size-100)\n)}:host([dir=ltr]){padding-left:var(\n--spectrum-toast-neutral-padding-left,var(--spectrum-global-dimension-size-200)\n)}:host([dir=rtl]){padding-right:var(\n--spectrum-toast-neutral-padding-left,var(--spectrum-global-dimension-size-200)\n)}:host{-webkit-font-smoothing:antialiased;align-items:stretch;border-radius:var(\n--spectrum-toast-neutral-border-radius,var(--spectrum-alias-border-radius-regular)\n);box-sizing:border-box;display:inline-flex;flex-direction:row;font-size:var(\n--spectrum-toast-neutral-text-size,var(--spectrum-global-dimension-font-size-100)\n);font-weight:var(\n--spectrum-toast-neutral-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);padding-bottom:var(\n--spectrum-toast-neutral-padding-y,var(--spectrum-global-dimension-size-100)\n);padding-top:var(\n--spectrum-toast-neutral-padding-y,var(--spectrum-global-dimension-size-100)\n)}:host([dir=ltr]) .type{margin-right:var(\n--spectrum-toast-neutral-icon-padding-right,var(--spectrum-global-dimension-size-150)\n)}:host([dir=rtl]) .type{margin-left:var(\n--spectrum-toast-neutral-icon-padding-right,var(--spectrum-global-dimension-size-150)\n)}:host([dir=ltr]) .type{margin-left:0}:host([dir=rtl]) .type{margin-right:0}.type{flex-grow:0;flex-shrink:0;margin-bottom:var(--spectrum-toast-icon-padding-y);margin-top:var(--spectrum-toast-icon-padding-y)}:host([dir=ltr]) .content{padding-right:var(\n--spectrum-toast-neutral-content-padding-right,var(--spectrum-global-dimension-size-200)\n)}:host([dir=rtl]) .content{padding-left:var(\n--spectrum-toast-neutral-content-padding-right,var(--spectrum-global-dimension-size-200)\n)}:host([dir=ltr]) .content{padding-left:0}:host([dir=rtl]) .content{padding-right:0}:host([dir=ltr]) .content{text-align:left}:host([dir=rtl]) .content{text-align:right}.content{box-sizing:border-box;display:inline-block;flex:1 1 auto;font-size:var(\n--spectrum-toast-info-text-size,var(--spectrum-global-dimension-font-size-100)\n);font-weight:var(\n--spectrum-toast-info-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);line-height:var(\n--spectrum-toast-info-text-line-height,var(--spectrum-alias-component-text-line-height)\n);padding-bottom:var(--spectrum-toast-content-padding-bottom);padding-top:var(\n--spectrum-toast-neutral-content-padding-top,var(--spectrum-global-dimension-size-65)\n)}.buttons{align-items:flex-start;display:flex;flex:0 0 auto}:host([dir=ltr]) .buttons .spectrum-ClearButton+.spectrum-ClearButton,:host([dir=ltr]) .buttons .spectrum-ClearButton+::slotted([slot=action]),:host([dir=ltr]) .buttons slot[name=action]+.spectrum-ClearButton,:host([dir=ltr]) .buttons slot[name=action]+::slotted([slot=action]){margin-left:var(\n--spectrum-toast-neutral-button-gap-x,var(--spectrum-global-dimension-size-100)\n)}:host([dir=rtl]) .buttons .spectrum-ClearButton+.spectrum-ClearButton,:host([dir=rtl]) .buttons .spectrum-ClearButton+::slotted([slot=action]),:host([dir=rtl]) .buttons slot[name=action]+.spectrum-ClearButton,:host([dir=rtl]) .buttons slot[name=action]+::slotted([slot=action]){margin-right:var(\n--spectrum-toast-neutral-button-gap-x,var(--spectrum-global-dimension-size-100)\n)}.body{align-self:center;flex:1 1 auto}:host([dir=ltr]) .body ::slotted([slot=action]){float:right}:host([dir=rtl]) .body ::slotted([slot=action]){float:left}:host([dir=ltr]) .body ::slotted([slot=action]){margin-right:var(\n--spectrum-toast-button-margin-right\n)}:host([dir=rtl]) .body ::slotted([slot=action]){margin-left:var(\n--spectrum-toast-button-margin-right\n)}:host([dir=ltr]) .body+.buttons{padding-left:var(\n--spectrum-toast-neutral-padding-right,var(--spectrum-global-dimension-size-100)\n)}:host([dir=rtl]) .body+.buttons{padding-right:var(\n--spectrum-toast-neutral-padding-right,var(--spectrum-global-dimension-size-100)\n)}:host([dir=ltr]) .body+.buttons{border-left-width:1px}:host([dir=rtl]) .body+.buttons{border-right-width:1px}:host([dir=ltr]) .body+.buttons{border-left-style:solid}:host([dir=rtl]) .body+.buttons{border-right-style:solid}:host{background-color:var(\n--spectrum-toast-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n);color:var(\n--spectrum-toast-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n)}.content{color:var(\n--spectrum-toast-neutral-text-color,var(--spectrum-global-color-static-white)\n)}.type{color:#fff}:host([dir=ltr]) .buttons{border-left-color:hsla(0,0%,100%,.2)}:host([dir=rtl]) .buttons{border-right-color:hsla(0,0%,100%,.2)}:host([variant=error]),:host([variant=negative]){background-color:var(\n--spectrum-toast-negative-background-color,var(--spectrum-semantic-negative-background-color)\n);color:var(\n--spectrum-toast-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}:host([variant=error]) .closeButton.focus-visible:not(:active),:host([variant=negative]) .closeButton.focus-visible:not(:active){color:var(\n--spectrum-toast-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}:host([variant=error]) .closeButton:focus-visible:not(:active),:host([variant=negative]) .closeButton:focus-visible:not(:active){color:var(\n--spectrum-toast-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}:host([variant=info]){background-color:var(\n--spectrum-toast-info-background-color,var(--spectrum-semantic-informative-background-color)\n);color:var(\n--spectrum-toast-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}:host([variant=info]) .closeButton.focus-visible:not(:active){color:var(\n--spectrum-toast-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}:host([variant=info]) .closeButton:focus-visible:not(:active){color:var(\n--spectrum-toast-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}:host([variant=positive]),:host([variant=success]){background-color:var(\n--spectrum-toast-positive-background-color,var(--spectrum-semantic-positive-background-color)\n);color:var(\n--spectrum-toast-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}:host([variant=positive]) .closeButton.focus-visible:not(:active),:host([variant=success]) .closeButton.focus-visible:not(:active){color:var(\n--spectrum-toast-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}:host([variant=positive]) .closeButton:focus-visible:not(:active),:host([variant=success]) .closeButton:focus-visible:not(:active){color:var(\n--spectrum-toast-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}@media (forced-colors:active){:host{border:1px solid transparent}}\n`;\nexport default styles;"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAuFf,eAAeC",
|
|
6
|
+
"names": ["css", "styles"]
|
|
7
7
|
}
|
package/src/toast.css.dev.js
CHANGED
package/src/toast.css.dev.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["toast.css.ts"],
|
|
4
4
|
"sourcesContent": ["/*\nCopyright 2022 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-toast-icon-padding-y:var(\n--spectrum-global-dimension-size-85\n);--spectrum-toast-neutral-content-padding-top:var(\n--spectrum-global-dimension-size-65\n);--spectrum-toast-content-padding-bottom:var(\n--spectrum-global-dimension-size-65\n);--spectrum-toast-button-margin-right:var(\n--spectrum-global-dimension-size-130\n)}:host([dir=ltr]){padding-right:var(\n--spectrum-toast-neutral-padding-right,var(--spectrum-global-dimension-size-100)\n)}:host([dir=rtl]){padding-left:var(\n--spectrum-toast-neutral-padding-right,var(--spectrum-global-dimension-size-100)\n)}:host([dir=ltr]){padding-left:var(\n--spectrum-toast-neutral-padding-left,var(--spectrum-global-dimension-size-200)\n)}:host([dir=rtl]){padding-right:var(\n--spectrum-toast-neutral-padding-left,var(--spectrum-global-dimension-size-200)\n)}:host{-webkit-font-smoothing:antialiased;align-items:stretch;border-radius:var(\n--spectrum-toast-neutral-border-radius,var(--spectrum-alias-border-radius-regular)\n);box-sizing:border-box;display:inline-flex;flex-direction:row;font-size:var(\n--spectrum-toast-neutral-text-size,var(--spectrum-global-dimension-font-size-100)\n);font-weight:var(\n--spectrum-toast-neutral-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);padding-bottom:var(\n--spectrum-toast-neutral-padding-y,var(--spectrum-global-dimension-size-100)\n);padding-top:var(\n--spectrum-toast-neutral-padding-y,var(--spectrum-global-dimension-size-100)\n)}:host([dir=ltr]) .type{margin-right:var(\n--spectrum-toast-neutral-icon-padding-right,var(--spectrum-global-dimension-size-150)\n)}:host([dir=rtl]) .type{margin-left:var(\n--spectrum-toast-neutral-icon-padding-right,var(--spectrum-global-dimension-size-150)\n)}:host([dir=ltr]) .type{margin-left:0}:host([dir=rtl]) .type{margin-right:0}.type{flex-grow:0;flex-shrink:0;margin-bottom:var(--spectrum-toast-icon-padding-y);margin-top:var(--spectrum-toast-icon-padding-y)}:host([dir=ltr]) .content{padding-right:var(\n--spectrum-toast-neutral-content-padding-right,var(--spectrum-global-dimension-size-200)\n)}:host([dir=rtl]) .content{padding-left:var(\n--spectrum-toast-neutral-content-padding-right,var(--spectrum-global-dimension-size-200)\n)}:host([dir=ltr]) .content{padding-left:0}:host([dir=rtl]) .content{padding-right:0}:host([dir=ltr]) .content{text-align:left}:host([dir=rtl]) .content{text-align:right}.content{box-sizing:border-box;display:inline-block;flex:1 1 auto;font-size:var(\n--spectrum-toast-info-text-size,var(--spectrum-global-dimension-font-size-100)\n);font-weight:var(\n--spectrum-toast-info-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);line-height:var(\n--spectrum-toast-info-text-line-height,var(--spectrum-alias-component-text-line-height)\n);padding-bottom:var(--spectrum-toast-content-padding-bottom);padding-top:var(\n--spectrum-toast-neutral-content-padding-top,var(--spectrum-global-dimension-size-65)\n)}.buttons{align-items:flex-start;display:flex;flex:0 0 auto}:host([dir=ltr]) .buttons .spectrum-ClearButton+.spectrum-ClearButton,:host([dir=ltr]) .buttons .spectrum-ClearButton+::slotted([slot=action]),:host([dir=ltr]) .buttons slot[name=action]+.spectrum-ClearButton,:host([dir=ltr]) .buttons slot[name=action]+::slotted([slot=action]){margin-left:var(\n--spectrum-toast-neutral-button-gap-x,var(--spectrum-global-dimension-size-100)\n)}:host([dir=rtl]) .buttons .spectrum-ClearButton+.spectrum-ClearButton,:host([dir=rtl]) .buttons .spectrum-ClearButton+::slotted([slot=action]),:host([dir=rtl]) .buttons slot[name=action]+.spectrum-ClearButton,:host([dir=rtl]) .buttons slot[name=action]+::slotted([slot=action]){margin-right:var(\n--spectrum-toast-neutral-button-gap-x,var(--spectrum-global-dimension-size-100)\n)}.body{align-self:center;flex:1 1 auto}:host([dir=ltr]) .body ::slotted([slot=action]){float:right}:host([dir=rtl]) .body ::slotted([slot=action]){float:left}:host([dir=ltr]) .body ::slotted([slot=action]){margin-right:var(\n--spectrum-toast-button-margin-right\n)}:host([dir=rtl]) .body ::slotted([slot=action]){margin-left:var(\n--spectrum-toast-button-margin-right\n)}:host([dir=ltr]) .body+.buttons{padding-left:var(\n--spectrum-toast-neutral-padding-right,var(--spectrum-global-dimension-size-100)\n)}:host([dir=rtl]) .body+.buttons{padding-right:var(\n--spectrum-toast-neutral-padding-right,var(--spectrum-global-dimension-size-100)\n)}:host([dir=ltr]) .body+.buttons{border-left-width:1px}:host([dir=rtl]) .body+.buttons{border-right-width:1px}:host([dir=ltr]) .body+.buttons{border-left-style:solid}:host([dir=rtl]) .body+.buttons{border-right-style:solid}:host{background-color:var(\n--spectrum-toast-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n);color:var(\n--spectrum-toast-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n)}.content{color:var(\n--spectrum-toast-neutral-text-color,var(--spectrum-global-color-static-white)\n)}.type{color:#fff}:host([dir=ltr]) .buttons{border-left-color:hsla(0,0%,100%,.2)}:host([dir=rtl]) .buttons{border-right-color:hsla(0,0%,100%,.2)}:host([variant=error]),:host([variant=negative]){background-color:var(\n--spectrum-toast-negative-background-color,var(--spectrum-semantic-negative-background-color)\n);color:var(\n--spectrum-toast-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}:host([variant=error]) .closeButton.focus-visible:not(:active),:host([variant=negative]) .closeButton.focus-visible:not(:active){color:var(\n--spectrum-toast-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}:host([variant=error]) .closeButton:focus-visible:not(:active),:host([variant=negative]) .closeButton:focus-visible:not(:active){color:var(\n--spectrum-toast-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}:host([variant=info]){background-color:var(\n--spectrum-toast-info-background-color,var(--spectrum-semantic-informative-background-color)\n);color:var(\n--spectrum-toast-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}:host([variant=info]) .closeButton.focus-visible:not(:active){color:var(\n--spectrum-toast-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}:host([variant=info]) .closeButton:focus-visible:not(:active){color:var(\n--spectrum-toast-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}:host([variant=positive]),:host([variant=success]){background-color:var(\n--spectrum-toast-positive-background-color,var(--spectrum-semantic-positive-background-color)\n);color:var(\n--spectrum-toast-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}:host([variant=positive]) .closeButton.focus-visible:not(:active),:host([variant=success]) .closeButton.focus-visible:not(:active){color:var(\n--spectrum-toast-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}:host([variant=positive]) .closeButton:focus-visible:not(:active),:host([variant=success]) .closeButton:focus-visible:not(:active){color:var(\n--spectrum-toast-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}@media (forced-colors:active){:host{border:1px solid transparent}}.content{line-height:1.5}:host(:not([open])){display:none}\n`;\nexport default styles;"],
|
|
5
|
-
"mappings": "AAWA;
|
|
5
|
+
"mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAuFf,eAAe;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/src/toast.css.js
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
import
|
|
2
|
-
const styles = css`
|
|
1
|
+
"use strict";import{css as t}from"@spectrum-web-components/base";const o=t`
|
|
3
2
|
:host{--spectrum-toast-icon-padding-y:var(
|
|
4
3
|
--spectrum-global-dimension-size-85
|
|
5
4
|
);--spectrum-toast-neutral-content-padding-top:var(
|
|
@@ -85,6 +84,5 @@ const styles = css`
|
|
|
85
84
|
)}:host([variant=positive]) .closeButton:focus-visible:not(:active),:host([variant=success]) .closeButton:focus-visible:not(:active){color:var(
|
|
86
85
|
--spectrum-toast-positive-background-color,var(--spectrum-semantic-positive-background-color)
|
|
87
86
|
)}@media (forced-colors:active){:host{border:1px solid transparent}}.content{line-height:1.5}:host(:not([open])){display:none}
|
|
88
|
-
`;
|
|
89
|
-
export default styles;
|
|
87
|
+
`;export default o;
|
|
90
88
|
//# sourceMappingURL=toast.css.js.map
|
package/src/toast.css.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["toast.css.ts"],
|
|
4
4
|
"sourcesContent": ["/*\nCopyright 2022 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-toast-icon-padding-y:var(\n--spectrum-global-dimension-size-85\n);--spectrum-toast-neutral-content-padding-top:var(\n--spectrum-global-dimension-size-65\n);--spectrum-toast-content-padding-bottom:var(\n--spectrum-global-dimension-size-65\n);--spectrum-toast-button-margin-right:var(\n--spectrum-global-dimension-size-130\n)}:host([dir=ltr]){padding-right:var(\n--spectrum-toast-neutral-padding-right,var(--spectrum-global-dimension-size-100)\n)}:host([dir=rtl]){padding-left:var(\n--spectrum-toast-neutral-padding-right,var(--spectrum-global-dimension-size-100)\n)}:host([dir=ltr]){padding-left:var(\n--spectrum-toast-neutral-padding-left,var(--spectrum-global-dimension-size-200)\n)}:host([dir=rtl]){padding-right:var(\n--spectrum-toast-neutral-padding-left,var(--spectrum-global-dimension-size-200)\n)}:host{-webkit-font-smoothing:antialiased;align-items:stretch;border-radius:var(\n--spectrum-toast-neutral-border-radius,var(--spectrum-alias-border-radius-regular)\n);box-sizing:border-box;display:inline-flex;flex-direction:row;font-size:var(\n--spectrum-toast-neutral-text-size,var(--spectrum-global-dimension-font-size-100)\n);font-weight:var(\n--spectrum-toast-neutral-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);padding-bottom:var(\n--spectrum-toast-neutral-padding-y,var(--spectrum-global-dimension-size-100)\n);padding-top:var(\n--spectrum-toast-neutral-padding-y,var(--spectrum-global-dimension-size-100)\n)}:host([dir=ltr]) .type{margin-right:var(\n--spectrum-toast-neutral-icon-padding-right,var(--spectrum-global-dimension-size-150)\n)}:host([dir=rtl]) .type{margin-left:var(\n--spectrum-toast-neutral-icon-padding-right,var(--spectrum-global-dimension-size-150)\n)}:host([dir=ltr]) .type{margin-left:0}:host([dir=rtl]) .type{margin-right:0}.type{flex-grow:0;flex-shrink:0;margin-bottom:var(--spectrum-toast-icon-padding-y);margin-top:var(--spectrum-toast-icon-padding-y)}:host([dir=ltr]) .content{padding-right:var(\n--spectrum-toast-neutral-content-padding-right,var(--spectrum-global-dimension-size-200)\n)}:host([dir=rtl]) .content{padding-left:var(\n--spectrum-toast-neutral-content-padding-right,var(--spectrum-global-dimension-size-200)\n)}:host([dir=ltr]) .content{padding-left:0}:host([dir=rtl]) .content{padding-right:0}:host([dir=ltr]) .content{text-align:left}:host([dir=rtl]) .content{text-align:right}.content{box-sizing:border-box;display:inline-block;flex:1 1 auto;font-size:var(\n--spectrum-toast-info-text-size,var(--spectrum-global-dimension-font-size-100)\n);font-weight:var(\n--spectrum-toast-info-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);line-height:var(\n--spectrum-toast-info-text-line-height,var(--spectrum-alias-component-text-line-height)\n);padding-bottom:var(--spectrum-toast-content-padding-bottom);padding-top:var(\n--spectrum-toast-neutral-content-padding-top,var(--spectrum-global-dimension-size-65)\n)}.buttons{align-items:flex-start;display:flex;flex:0 0 auto}:host([dir=ltr]) .buttons .spectrum-ClearButton+.spectrum-ClearButton,:host([dir=ltr]) .buttons .spectrum-ClearButton+::slotted([slot=action]),:host([dir=ltr]) .buttons slot[name=action]+.spectrum-ClearButton,:host([dir=ltr]) .buttons slot[name=action]+::slotted([slot=action]){margin-left:var(\n--spectrum-toast-neutral-button-gap-x,var(--spectrum-global-dimension-size-100)\n)}:host([dir=rtl]) .buttons .spectrum-ClearButton+.spectrum-ClearButton,:host([dir=rtl]) .buttons .spectrum-ClearButton+::slotted([slot=action]),:host([dir=rtl]) .buttons slot[name=action]+.spectrum-ClearButton,:host([dir=rtl]) .buttons slot[name=action]+::slotted([slot=action]){margin-right:var(\n--spectrum-toast-neutral-button-gap-x,var(--spectrum-global-dimension-size-100)\n)}.body{align-self:center;flex:1 1 auto}:host([dir=ltr]) .body ::slotted([slot=action]){float:right}:host([dir=rtl]) .body ::slotted([slot=action]){float:left}:host([dir=ltr]) .body ::slotted([slot=action]){margin-right:var(\n--spectrum-toast-button-margin-right\n)}:host([dir=rtl]) .body ::slotted([slot=action]){margin-left:var(\n--spectrum-toast-button-margin-right\n)}:host([dir=ltr]) .body+.buttons{padding-left:var(\n--spectrum-toast-neutral-padding-right,var(--spectrum-global-dimension-size-100)\n)}:host([dir=rtl]) .body+.buttons{padding-right:var(\n--spectrum-toast-neutral-padding-right,var(--spectrum-global-dimension-size-100)\n)}:host([dir=ltr]) .body+.buttons{border-left-width:1px}:host([dir=rtl]) .body+.buttons{border-right-width:1px}:host([dir=ltr]) .body+.buttons{border-left-style:solid}:host([dir=rtl]) .body+.buttons{border-right-style:solid}:host{background-color:var(\n--spectrum-toast-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n);color:var(\n--spectrum-toast-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n)}.content{color:var(\n--spectrum-toast-neutral-text-color,var(--spectrum-global-color-static-white)\n)}.type{color:#fff}:host([dir=ltr]) .buttons{border-left-color:hsla(0,0%,100%,.2)}:host([dir=rtl]) .buttons{border-right-color:hsla(0,0%,100%,.2)}:host([variant=error]),:host([variant=negative]){background-color:var(\n--spectrum-toast-negative-background-color,var(--spectrum-semantic-negative-background-color)\n);color:var(\n--spectrum-toast-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}:host([variant=error]) .closeButton.focus-visible:not(:active),:host([variant=negative]) .closeButton.focus-visible:not(:active){color:var(\n--spectrum-toast-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}:host([variant=error]) .closeButton:focus-visible:not(:active),:host([variant=negative]) .closeButton:focus-visible:not(:active){color:var(\n--spectrum-toast-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}:host([variant=info]){background-color:var(\n--spectrum-toast-info-background-color,var(--spectrum-semantic-informative-background-color)\n);color:var(\n--spectrum-toast-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}:host([variant=info]) .closeButton.focus-visible:not(:active){color:var(\n--spectrum-toast-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}:host([variant=info]) .closeButton:focus-visible:not(:active){color:var(\n--spectrum-toast-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}:host([variant=positive]),:host([variant=success]){background-color:var(\n--spectrum-toast-positive-background-color,var(--spectrum-semantic-positive-background-color)\n);color:var(\n--spectrum-toast-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}:host([variant=positive]) .closeButton.focus-visible:not(:active),:host([variant=success]) .closeButton.focus-visible:not(:active){color:var(\n--spectrum-toast-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}:host([variant=positive]) .closeButton:focus-visible:not(:active),:host([variant=success]) .closeButton:focus-visible:not(:active){color:var(\n--spectrum-toast-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}@media (forced-colors:active){:host{border:1px solid transparent}}.content{line-height:1.5}:host(:not([open])){display:none}\n`;\nexport default styles;"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAuFf,eAAeC",
|
|
6
|
+
"names": ["css", "styles"]
|
|
7
7
|
}
|
package/stories/toast.stories.js
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["toast.stories.ts"],
|
|
4
4
|
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { html, TemplateResult } from '@spectrum-web-components/base';\n\nimport '@spectrum-web-components/toast/sp-toast.js';\nimport '@spectrum-web-components/button/sp-button.js';\n\nconst toast = ({\n variant = '',\n open = true,\n content = '',\n}): TemplateResult => html`\n <sp-toast\n variant=${variant as\n | ''\n | 'negative'\n | 'positive'\n | 'info'\n | 'error'\n | 'warning'}\n ?open=${open}\n >\n ${content}\n <sp-button slot=\"action\" variant=\"overBackground\" quiet>Undo</sp-button>\n </sp-toast>\n`;\n\nexport default {\n component: 'sp-toast',\n title: 'Toast',\n args: {\n content: 'This is a toast message.',\n open: true,\n },\n argTypes: {\n content: {\n name: 'content',\n type: { name: 'string', required: false },\n table: {\n type: { summary: 'string' },\n defaultValue: { summary: '' },\n },\n control: 'text',\n },\n open: {\n name: 'open',\n type: { name: 'boolean', required: false },\n description: 'Whether the toast is open.',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n },\n};\n\ninterface Properties {\n variant: '' | 'negative' | 'positive' | 'info' | 'error' | 'warning';\n open: boolean;\n content: string;\n onClose: (event: Event) => void;\n}\n\nexport const Default = ({\n variant,\n open,\n content,\n}: Properties): TemplateResult => {\n return toast({ variant, open, content });\n};\n\nconst variantDemo = ({\n variant,\n open,\n content,\n}: Properties): TemplateResult => {\n return toast({ variant, open, content });\n};\n\nexport const Positive = (args: Properties): TemplateResult =>\n variantDemo({ ...args, variant: 'positive' });\n\nexport const Negative = (args: Properties): TemplateResult =>\n variantDemo({ ...args, variant: 'negative' });\n\nexport const Info = (args: Properties): TemplateResult =>\n variantDemo({ ...args, variant: 'info' });\n"],
|
|
5
|
-
"mappings": "AAWA;
|
|
5
|
+
"mappings": ";AAWA,SAAS,YAA4B;AAErC,OAAO;AACP,OAAO;AAEP,MAAM,QAAQ,CAAC;AAAA,EACX,UAAU;AAAA,EACV,OAAO;AAAA,EACP,UAAU;AACd,MAAsB;AAAA;AAAA,kBAEJ;AAAA,gBAOF;AAAA;AAAA,UAEN;AAAA;AAAA;AAAA;AAKV,eAAe;AAAA,EACX,WAAW;AAAA,EACX,OAAO;AAAA,EACP,MAAM;AAAA,IACF,SAAS;AAAA,IACT,MAAM;AAAA,EACV;AAAA,EACA,UAAU;AAAA,IACN,SAAS;AAAA,MACL,MAAM;AAAA,MACN,MAAM,EAAE,MAAM,UAAU,UAAU,MAAM;AAAA,MACxC,OAAO;AAAA,QACH,MAAM,EAAE,SAAS,SAAS;AAAA,QAC1B,cAAc,EAAE,SAAS,GAAG;AAAA,MAChC;AAAA,MACA,SAAS;AAAA,IACb;AAAA,IACA,MAAM;AAAA,MACF,MAAM;AAAA,MACN,MAAM,EAAE,MAAM,WAAW,UAAU,MAAM;AAAA,MACzC,aAAa;AAAA,MACb,OAAO;AAAA,QACH,MAAM,EAAE,SAAS,UAAU;AAAA,QAC3B,cAAc,EAAE,SAAS,MAAM;AAAA,MACnC;AAAA,MACA,SAAS;AAAA,QACL,MAAM;AAAA,MACV;AAAA,IACJ;AAAA,EACJ;AACJ;AASO,aAAM,UAAU,CAAC;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AACJ,MAAkC;AAC9B,SAAO,MAAM,EAAE,SAAS,MAAM,QAAQ,CAAC;AAC3C;AAEA,MAAM,cAAc,CAAC;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AACJ,MAAkC;AAC9B,SAAO,MAAM,EAAE,SAAS,MAAM,QAAQ,CAAC;AAC3C;AAEO,aAAM,WAAW,CAAC,SACrB,YAAY,EAAE,GAAG,MAAM,SAAS,WAAW,CAAC;AAEzC,aAAM,WAAW,CAAC,SACrB,YAAY,EAAE,GAAG,MAAM,SAAS,WAAW,CAAC;AAEzC,aAAM,OAAO,CAAC,SACjB,YAAY,EAAE,GAAG,MAAM,SAAS,OAAO,CAAC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["test-basic.ts"],
|
|
4
4
|
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport '@spectrum-web-components/toast/sp-toast.js';\nimport { html } from 'lit';\nimport { measureFixtureCreation } from '../../../../test/benchmark/helpers.js';\n\nmeasureFixtureCreation(html`\n <sp-toast>Tip me!</sp-toast>\n`);\n"],
|
|
5
|
-
"mappings": "AAYA;
|
|
5
|
+
"mappings": ";AAYA,OAAO;AACP,SAAS,YAAY;AACrB,SAAS,8BAA8B;AAEvC,uBAAuB;AAAA;AAAA,CAEtB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/test/toast.test-vrt.js
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["toast.test-vrt.ts"],
|
|
4
4
|
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport * as stories from '../stories/toast.stories.js';\nimport { regressVisuals } from '../../../test/visual/test.js';\n\nregressVisuals('ToastStories', stories);\n"],
|
|
5
|
-
"mappings": "AAYA;
|
|
5
|
+
"mappings": ";AAYA,YAAY,aAAa;AACzB,SAAS,sBAAsB;AAE/B,eAAe,gBAAgB,OAAO;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/test/toast.test.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
import "@spectrum-web-components/toast/sp-toast.js";
|
|
2
3
|
import { toastVariants } from "@spectrum-web-components/toast";
|
|
3
4
|
import {
|
|
@@ -14,31 +15,41 @@ import {
|
|
|
14
15
|
} from "../../../test/testing-helpers.js";
|
|
15
16
|
import { spy } from "sinon";
|
|
16
17
|
describe("Toast", () => {
|
|
17
|
-
testForLitDevWarnings(
|
|
18
|
+
testForLitDevWarnings(
|
|
19
|
+
async () => await fixture(
|
|
20
|
+
html`
|
|
18
21
|
<sp-toast open>Help text.</sp-toast>
|
|
19
|
-
`
|
|
22
|
+
`
|
|
23
|
+
)
|
|
24
|
+
);
|
|
20
25
|
it("loads", async () => {
|
|
21
|
-
const el = await fixture(
|
|
26
|
+
const el = await fixture(
|
|
27
|
+
html`
|
|
22
28
|
<sp-toast open>Help text.</sp-toast>
|
|
23
|
-
`
|
|
29
|
+
`
|
|
30
|
+
);
|
|
24
31
|
await elementUpdated(el);
|
|
25
32
|
await expect(el).to.be.accessible();
|
|
26
33
|
});
|
|
27
34
|
toastVariants.map((variant) => {
|
|
28
35
|
it(`loads - [variant="${variant}"]`, async () => {
|
|
29
|
-
const el = await fixture(
|
|
36
|
+
const el = await fixture(
|
|
37
|
+
html`
|
|
30
38
|
<sp-toast variant=${variant} open>
|
|
31
39
|
This toast is of the \`${variant}\` variant.
|
|
32
40
|
</sp-toast>
|
|
33
|
-
`
|
|
41
|
+
`
|
|
42
|
+
);
|
|
34
43
|
await elementUpdated(el);
|
|
35
44
|
await expect(el).to.be.accessible();
|
|
36
45
|
});
|
|
37
46
|
});
|
|
38
47
|
it("loads - timeout", async () => {
|
|
39
|
-
const el = await fixture(
|
|
48
|
+
const el = await fixture(
|
|
49
|
+
html`
|
|
40
50
|
<sp-toast timeout="100">Help text.</sp-toast>
|
|
41
|
-
`
|
|
51
|
+
`
|
|
52
|
+
);
|
|
42
53
|
await elementUpdated(el);
|
|
43
54
|
expect(el.open).to.be.false;
|
|
44
55
|
el._timeout = 100;
|
|
@@ -48,9 +59,11 @@ describe("Toast", () => {
|
|
|
48
59
|
expect(el.open).to.be.false;
|
|
49
60
|
});
|
|
50
61
|
it("`timeout` updates `countdownStart`", async () => {
|
|
51
|
-
const el = await fixture(
|
|
62
|
+
const el = await fixture(
|
|
63
|
+
html`
|
|
52
64
|
<sp-toast timeout="100">Help text.</sp-toast>
|
|
53
|
-
`
|
|
65
|
+
`
|
|
66
|
+
);
|
|
54
67
|
await elementUpdated(el);
|
|
55
68
|
expect(el.open).to.be.false;
|
|
56
69
|
const testableEl = el;
|
|
@@ -73,9 +86,11 @@ describe("Toast", () => {
|
|
|
73
86
|
expect(thirdStart).to.equal(0);
|
|
74
87
|
});
|
|
75
88
|
it("stops timeout on `focusin`", async () => {
|
|
76
|
-
const el = await fixture(
|
|
89
|
+
const el = await fixture(
|
|
90
|
+
html`
|
|
77
91
|
<sp-toast timeout="100">Help text.</sp-toast>
|
|
78
|
-
`
|
|
92
|
+
`
|
|
93
|
+
);
|
|
79
94
|
await elementUpdated(el);
|
|
80
95
|
const testableEl = el;
|
|
81
96
|
expect(el.open, "not open to start").to.be.false;
|
|
@@ -90,33 +105,43 @@ describe("Toast", () => {
|
|
|
90
105
|
el.dispatchEvent(new FocusEvent("focusout"));
|
|
91
106
|
await elementUpdated(el);
|
|
92
107
|
await nextFrame();
|
|
93
|
-
expect(testableEl.countdownStart, "not 0 after focusout").to.not.equal(
|
|
108
|
+
expect(testableEl.countdownStart, "not 0 after focusout").to.not.equal(
|
|
109
|
+
0
|
|
110
|
+
);
|
|
94
111
|
await waitUntil(() => el.open === false, "closes");
|
|
95
112
|
expect(el.open, "not open to end").to.be.false;
|
|
96
113
|
});
|
|
97
114
|
it("closes", async () => {
|
|
98
|
-
const el = await fixture(
|
|
115
|
+
const el = await fixture(
|
|
116
|
+
html`
|
|
99
117
|
<sp-toast open>Help text.</sp-toast>
|
|
100
|
-
`
|
|
118
|
+
`
|
|
119
|
+
);
|
|
101
120
|
await elementUpdated(el);
|
|
102
121
|
expect(el.open).to.be.true;
|
|
103
122
|
const renderRoot = el.shadowRoot ? el.shadowRoot : el;
|
|
104
|
-
const closeButton = renderRoot.querySelector(
|
|
123
|
+
const closeButton = renderRoot.querySelector(
|
|
124
|
+
"sp-close-button"
|
|
125
|
+
);
|
|
105
126
|
closeButton.click();
|
|
106
127
|
await elementUpdated(el);
|
|
107
128
|
expect(el.open).to.be.false;
|
|
108
129
|
});
|
|
109
130
|
it("`close` can be prevented", async () => {
|
|
110
131
|
const handleClose = (event) => event.preventDefault();
|
|
111
|
-
const el = await fixture(
|
|
132
|
+
const el = await fixture(
|
|
133
|
+
html`
|
|
112
134
|
<sp-toast open timeout="100" @close=${handleClose}>
|
|
113
135
|
Help text.
|
|
114
136
|
</sp-toast>
|
|
115
|
-
`
|
|
137
|
+
`
|
|
138
|
+
);
|
|
116
139
|
await elementUpdated(el);
|
|
117
140
|
expect(el.open).to.be.true;
|
|
118
141
|
const renderRoot = el.shadowRoot ? el.shadowRoot : el;
|
|
119
|
-
const closeButton = renderRoot.querySelector(
|
|
142
|
+
const closeButton = renderRoot.querySelector(
|
|
143
|
+
"sp-close-button"
|
|
144
|
+
);
|
|
120
145
|
closeButton.click();
|
|
121
146
|
await elementUpdated(el);
|
|
122
147
|
expect(el.open).to.be.true;
|
|
@@ -127,16 +152,20 @@ describe("Toast", () => {
|
|
|
127
152
|
event.preventDefault();
|
|
128
153
|
closeSpy();
|
|
129
154
|
};
|
|
130
|
-
const el = await fixture(
|
|
155
|
+
const el = await fixture(
|
|
156
|
+
html`
|
|
131
157
|
<sp-toast open timeout="100" @close=${handleClose}>
|
|
132
158
|
Help text.
|
|
133
159
|
</sp-toast>
|
|
134
|
-
`
|
|
160
|
+
`
|
|
161
|
+
);
|
|
135
162
|
await elementUpdated(el);
|
|
136
163
|
expect(el.open).to.be.true;
|
|
137
164
|
expect(closeSpy.callCount).to.equal(0);
|
|
138
165
|
const renderRoot = el.shadowRoot ? el.shadowRoot : el;
|
|
139
|
-
const closeButton = renderRoot.querySelector(
|
|
166
|
+
const closeButton = renderRoot.querySelector(
|
|
167
|
+
"sp-close-button"
|
|
168
|
+
);
|
|
140
169
|
closeButton.click();
|
|
141
170
|
await elementUpdated(el);
|
|
142
171
|
expect(el.open).to.be.true;
|
|
@@ -147,11 +176,13 @@ describe("Toast", () => {
|
|
|
147
176
|
expect(closeSpy.callCount).to.equal(1);
|
|
148
177
|
});
|
|
149
178
|
it("validates variants", async () => {
|
|
150
|
-
const el = await fixture(
|
|
179
|
+
const el = await fixture(
|
|
180
|
+
html`
|
|
151
181
|
<sp-toast variant="invalid" open>
|
|
152
182
|
This toast validates variants.
|
|
153
183
|
</sp-toast>
|
|
154
|
-
`
|
|
184
|
+
`
|
|
185
|
+
);
|
|
155
186
|
await elementUpdated(el);
|
|
156
187
|
expect(el.variant).to.equal("");
|
|
157
188
|
el.variant = toastVariants[0];
|
|
@@ -162,11 +193,13 @@ describe("Toast", () => {
|
|
|
162
193
|
expect(el.variant).to.equal(toastVariants[0]);
|
|
163
194
|
});
|
|
164
195
|
it("maintains [variant] when disconnected/connected", async () => {
|
|
165
|
-
const el = await fixture(
|
|
196
|
+
const el = await fixture(
|
|
197
|
+
html`
|
|
166
198
|
<sp-toast variant="positive" open>
|
|
167
199
|
This toast maintains variants.
|
|
168
200
|
</sp-toast>
|
|
169
|
-
`
|
|
201
|
+
`
|
|
202
|
+
);
|
|
170
203
|
await elementUpdated(el);
|
|
171
204
|
expect(el.variant).to.equal("positive");
|
|
172
205
|
const parent = el.parentElement;
|
|
@@ -177,20 +210,24 @@ describe("Toast", () => {
|
|
|
177
210
|
});
|
|
178
211
|
it("reopens", async () => {
|
|
179
212
|
const closeSpy = spy();
|
|
180
|
-
const el = await fixture(
|
|
213
|
+
const el = await fixture(
|
|
214
|
+
html`
|
|
181
215
|
<sp-toast
|
|
182
216
|
variant="positive"
|
|
183
217
|
open
|
|
184
218
|
@close=${() => {
|
|
185
|
-
|
|
186
|
-
|
|
219
|
+
closeSpy();
|
|
220
|
+
}}
|
|
187
221
|
>
|
|
188
222
|
This toast maintains variants.
|
|
189
223
|
</sp-toast>
|
|
190
|
-
`
|
|
224
|
+
`
|
|
225
|
+
);
|
|
191
226
|
await elementUpdated(el);
|
|
192
227
|
expect(el.open).to.be.true;
|
|
193
|
-
const closeButton = el.shadowRoot.querySelector(
|
|
228
|
+
const closeButton = el.shadowRoot.querySelector(
|
|
229
|
+
"sp-close-button"
|
|
230
|
+
);
|
|
194
231
|
closeButton.click();
|
|
195
232
|
await elementUpdated(el);
|
|
196
233
|
expect(el.open).to.be.false;
|
package/test/toast.test.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["toast.test.ts"],
|
|
4
4
|
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport '@spectrum-web-components/toast/sp-toast.js';\nimport { Toast, toastVariants } from '@spectrum-web-components/toast';\nimport {\n elementUpdated,\n expect,\n fixture,\n html,\n nextFrame,\n waitUntil,\n} from '@open-wc/testing';\nimport { CloseButton } from '@spectrum-web-components/button';\nimport {\n testForLitDevWarnings,\n waitForPredicate,\n} from '../../../test/testing-helpers.js';\nimport { spy } from 'sinon';\n\ninterface TestableToast {\n _timeout: number;\n countdownStart: number;\n}\n\ndescribe('Toast', () => {\n testForLitDevWarnings(\n async () =>\n await fixture<Toast>(\n html`\n <sp-toast open>Help text.</sp-toast>\n `\n )\n );\n it('loads', async () => {\n const el = await fixture<Toast>(\n html`\n <sp-toast open>Help text.</sp-toast>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n toastVariants.map((variant) => {\n it(`loads - [variant=\"${variant}\"]`, async () => {\n const el = await fixture<Toast>(\n html`\n <sp-toast variant=${variant} open>\n This toast is of the \\`${variant}\\` variant.\n </sp-toast>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n });\n it('loads - timeout', async () => {\n const el = await fixture<Toast>(\n html`\n <sp-toast timeout=\"100\">Help text.</sp-toast>\n `\n );\n\n await elementUpdated(el);\n expect(el.open).to.be.false;\n\n (el as unknown as TestableToast)._timeout = 100;\n el.open = true;\n await elementUpdated(el);\n\n await waitForPredicate(() => el.open === false);\n expect(el.open).to.be.false;\n });\n it('`timeout` updates `countdownStart`', async () => {\n const el = await fixture<Toast>(\n html`\n <sp-toast timeout=\"100\">Help text.</sp-toast>\n `\n );\n\n await elementUpdated(el);\n expect(el.open).to.be.false;\n\n const testableEl = el as unknown as TestableToast;\n testableEl._timeout = 100;\n el.open = true;\n await elementUpdated(el);\n\n const firstStart = testableEl.countdownStart;\n\n await nextFrame();\n await nextFrame();\n await nextFrame();\n\n el.timeout = 400;\n\n await elementUpdated(el);\n const secondStart = testableEl.countdownStart;\n\n expect(secondStart).to.not.equal(firstStart);\n\n await nextFrame();\n await nextFrame();\n\n el.timeout = 0;\n\n await elementUpdated(el);\n const thirdStart = testableEl.countdownStart;\n\n expect(thirdStart).to.equal(0);\n });\n it('stops timeout on `focusin`', async () => {\n const el = await fixture<Toast>(\n html`\n <sp-toast timeout=\"100\">Help text.</sp-toast>\n `\n );\n\n await elementUpdated(el);\n\n const testableEl = el as unknown as TestableToast;\n expect(el.open, 'not open to start').to.be.false;\n\n el.open = true;\n await elementUpdated(el);\n await nextFrame();\n\n expect(testableEl.countdownStart, 'initially not 0').to.not.equal(0);\n\n testableEl._timeout = 100;\n\n el.dispatchEvent(new FocusEvent('focusin'));\n\n await elementUpdated(el);\n expect(testableEl.countdownStart, '0 after focusin').to.equal(0);\n el.dispatchEvent(new FocusEvent('focusout'));\n\n await elementUpdated(el);\n await nextFrame();\n expect(testableEl.countdownStart, 'not 0 after focusout').to.not.equal(\n 0\n );\n\n await waitUntil(() => el.open === false, 'closes');\n expect(el.open, 'not open to end').to.be.false;\n });\n it('closes', async () => {\n const el = await fixture<Toast>(\n html`\n <sp-toast open>Help text.</sp-toast>\n `\n );\n\n await elementUpdated(el);\n expect(el.open).to.be.true;\n\n const renderRoot = el.shadowRoot ? el.shadowRoot : el;\n const closeButton = renderRoot.querySelector(\n 'sp-close-button'\n ) as CloseButton;\n closeButton.click();\n\n await elementUpdated(el);\n expect(el.open).to.be.false;\n });\n it('`close` can be prevented', async () => {\n const handleClose = (event: CustomEvent): void =>\n event.preventDefault();\n const el = await fixture<Toast>(\n html`\n <sp-toast open timeout=\"100\" @close=${handleClose}>\n Help text.\n </sp-toast>\n `\n );\n\n await elementUpdated(el);\n expect(el.open).to.be.true;\n\n const renderRoot = el.shadowRoot ? el.shadowRoot : el;\n const closeButton = renderRoot.querySelector(\n 'sp-close-button'\n ) as CloseButton;\n closeButton.click();\n\n await elementUpdated(el);\n expect(el.open).to.be.true;\n });\n it('can be a controlled element', async () => {\n const closeSpy = spy();\n const handleClose = (event: CustomEvent): void => {\n event.preventDefault();\n closeSpy();\n };\n const el = await fixture<Toast>(\n html`\n <sp-toast open timeout=\"100\" @close=${handleClose}>\n Help text.\n </sp-toast>\n `\n );\n\n await elementUpdated(el);\n expect(el.open).to.be.true;\n expect(closeSpy.callCount).to.equal(0);\n\n const renderRoot = el.shadowRoot ? el.shadowRoot : el;\n const closeButton = renderRoot.querySelector(\n 'sp-close-button'\n ) as CloseButton;\n closeButton.click();\n\n await elementUpdated(el);\n expect(el.open).to.be.true;\n expect(closeSpy.callCount).to.equal(1);\n\n el.open = false;\n await elementUpdated(el);\n expect(el.open).to.be.false;\n expect(closeSpy.callCount).to.equal(1);\n });\n it('validates variants', async () => {\n const el = await fixture<Toast>(\n html`\n <sp-toast variant=\"invalid\" open>\n This toast validates variants.\n </sp-toast>\n `\n );\n\n await elementUpdated(el);\n expect(el.variant).to.equal('');\n\n el.variant = toastVariants[0];\n\n await elementUpdated(el);\n expect(el.variant).to.equal(toastVariants[0]);\n\n el.variant = toastVariants[0];\n\n await elementUpdated(el);\n expect(el.variant).to.equal(toastVariants[0]);\n });\n it('maintains [variant] when disconnected/connected', async () => {\n const el = await fixture<Toast>(\n html`\n <sp-toast variant=\"positive\" open>\n This toast maintains variants.\n </sp-toast>\n `\n );\n\n await elementUpdated(el);\n expect(el.variant).to.equal('positive');\n const parent = el.parentElement as HTMLElement;\n\n el.remove();\n\n expect(el.variant).to.equal('positive');\n\n parent.append(el);\n\n expect(el.variant).to.equal('positive');\n });\n it('reopens', async () => {\n const closeSpy = spy();\n const el = await fixture<Toast>(\n html`\n <sp-toast\n variant=\"positive\"\n open\n @close=${() => {\n closeSpy();\n }}\n >\n This toast maintains variants.\n </sp-toast>\n `\n );\n\n await elementUpdated(el);\n expect(el.open).to.be.true;\n\n const closeButton = el.shadowRoot.querySelector(\n 'sp-close-button'\n ) as HTMLElement;\n closeButton.click();\n\n await elementUpdated(el);\n expect(el.open).to.be.false;\n\n el.open = true;\n\n await elementUpdated(el);\n expect(el.open).to.be.true;\n expect(closeSpy.callCount).to.equal(1);\n });\n});\n"],
|
|
5
|
-
"mappings": "AAYA;
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|