@spectrum-web-components/clear-button 0.0.0-20241209155954

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (17) hide show
  1. package/package.json +57 -0
  2. package/src/clear-button-overrides.css.d.ts +2 -0
  3. package/src/clear-button-overrides.css.dev.js +7 -0
  4. package/src/clear-button-overrides.css.dev.js.map +7 -0
  5. package/src/clear-button-overrides.css.js +4 -0
  6. package/src/clear-button-overrides.css.js.map +7 -0
  7. package/src/clear-button.css.d.ts +2 -0
  8. package/src/clear-button.css.dev.js +7 -0
  9. package/src/clear-button.css.dev.js.map +7 -0
  10. package/src/clear-button.css.js +4 -0
  11. package/src/clear-button.css.js.map +7 -0
  12. package/src/spectrum-clear-button.css.d.ts +2 -0
  13. package/src/spectrum-clear-button.css.dev.js +7 -0
  14. package/src/spectrum-clear-button.css.dev.js.map +7 -0
  15. package/src/spectrum-clear-button.css.js +4 -0
  16. package/src/spectrum-clear-button.css.js.map +7 -0
  17. package/src/spectrum-config.js +90 -0
package/package.json ADDED
@@ -0,0 +1,57 @@
1
+ {
2
+ "name": "@spectrum-web-components/clear-button",
3
+ "version": "0.0.0-20241209155954",
4
+ "publishConfig": {
5
+ "access": "public"
6
+ },
7
+ "description": "Web component implementation of a Spectrum design ClearButton",
8
+ "license": "Apache-2.0",
9
+ "repository": {
10
+ "type": "git",
11
+ "url": "https://github.com/adobe/spectrum-web-components.git",
12
+ "directory": "packages/clear-button"
13
+ },
14
+ "author": "",
15
+ "homepage": "https://opensource.adobe.com/spectrum-web-components/components/clear-button",
16
+ "bugs": {
17
+ "url": "https://github.com/adobe/spectrum-web-components/issues"
18
+ },
19
+ "main": "src/clear-button.css.js",
20
+ "module": "src/clear-button.css.js",
21
+ "type": "module",
22
+ "exports": {
23
+ ".": "./src/clear-button.css.js",
24
+ "./package.json": "./package.json",
25
+ "./src/clear-button-overrides.css.js": "./src/clear-button-overrides.css.js",
26
+ "./src/clear-button.css.js": "./src/clear-button.css.js"
27
+ },
28
+ "scripts": {
29
+ "test": "echo \"Error: run tests from mono-repo root.\" && exit 1"
30
+ },
31
+ "files": [
32
+ "**/*.d.ts",
33
+ "**/*.js",
34
+ "**/*.js.map",
35
+ "custom-elements.json",
36
+ "!stories/",
37
+ "!test/"
38
+ ],
39
+ "keywords": [
40
+ "spectrum css",
41
+ "web components",
42
+ "lit-element",
43
+ "lit-html"
44
+ ],
45
+ "dependencies": {
46
+ "@spectrum-web-components/base": "0.0.0-20241209155954"
47
+ },
48
+ "devDependencies": {
49
+ "@spectrum-css/clearbutton": "^7.0.0-s2-foundations.16"
50
+ },
51
+ "types": "./src/index.d.ts",
52
+ "customElements": "custom-elements.json",
53
+ "sideEffects": [
54
+ "./sp-*.js",
55
+ "./**/*.dev.js"
56
+ ]
57
+ }
package/src/clear-button-overrides.css.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ declare const styles: import("@spectrum-web-components/base").CSSResult;
2
+ export default styles;
package/src/clear-button-overrides.css.dev.js ADDED
@@ -0,0 +1,7 @@
1
+ "use strict";
2
+ import { css } from "@spectrum-web-components/base";
3
+ const styles = css`
4
+ :host{--spectrum-clear-button-background-color:var(--system-clear-button-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-background-color-key-focus);--spectrum-clear-button-height:var(--system-clear-button-height);--spectrum-clear-button-width:var(--system-clear-button-width);--spectrum-clear-button-padding:var(--system-clear-button-padding);--spectrum-clear-button-icon-color:var(--system-clear-button-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-icon-color-down);--spectrum-clear-button-icon-color-key-focus:var(--system-clear-button-icon-color-key-focus)}:host([size=s]){--spectrum-clear-button-height:var(--system-clear-button-size-s-height);--spectrum-clear-button-width:var(--system-clear-button-size-s-width)}:host([size=l]){--spectrum-clear-button-height:var(--system-clear-button-size-l-height);--spectrum-clear-button-width:var(--system-clear-button-size-l-width)}:host([size=xl]){--spectrum-clear-button-height:var(--system-clear-button-size-xl-height);--spectrum-clear-button-width:var(--system-clear-button-size-xl-width)}:host .spectrum-ClearButton--quiet{--spectrum-clear-button-background-color:var(--system-clear-button-quiet-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-quiet-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-quiet-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-quiet-background-color-key-focus)}:host([variant=overBackground]){--spectrum-clear-button-icon-color:var(--system-clear-button-over-background-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-over-background-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-over-background-icon-color-down);--spectrum-clear-button-icon-color-key-focus:var(--system-clear-button-over-background-icon-color-key-focus);--spectrum-clear-button-background-color:var(--system-clear-button-over-background-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-over-background-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-over-background-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-over-background-background-color-key-focus)}:host([disabled]),:host([disabled]){--spectrum-clear-button-icon-color:var(--system-clear-button-disabled-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-disabled-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-disabled-icon-color-down);--spectrum-clear-button-background-color:var(--system-clear-button-disabled-background-color)}
5
+ `;
6
+ export default styles;
7
+ //# sourceMappingURL=clear-button-overrides.css.dev.js.map
package/src/clear-button-overrides.css.dev.js.map ADDED
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["clear-button-overrides.css.ts"],
4
+ "sourcesContent": ["/*\nCopyright 2024 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-clear-button-background-color:var(--system-clear-button-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-background-color-key-focus);--spectrum-clear-button-height:var(--system-clear-button-height);--spectrum-clear-button-width:var(--system-clear-button-width);--spectrum-clear-button-padding:var(--system-clear-button-padding);--spectrum-clear-button-icon-color:var(--system-clear-button-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-icon-color-down);--spectrum-clear-button-icon-color-key-focus:var(--system-clear-button-icon-color-key-focus)}:host([size=s]){--spectrum-clear-button-height:var(--system-clear-button-size-s-height);--spectrum-clear-button-width:var(--system-clear-button-size-s-width)}:host([size=l]){--spectrum-clear-button-height:var(--system-clear-button-size-l-height);--spectrum-clear-button-width:var(--system-clear-button-size-l-width)}:host([size=xl]){--spectrum-clear-button-height:var(--system-clear-button-size-xl-height);--spectrum-clear-button-width:var(--system-clear-button-size-xl-width)}:host .spectrum-ClearButton--quiet{--spectrum-clear-button-background-color:var(--system-clear-button-quiet-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-quiet-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-quiet-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-quiet-background-color-key-focus)}:host([variant=overBackground]){--spectrum-clear-button-icon-color:var(--system-clear-button-over-background-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-over-background-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-over-background-icon-color-down);--spectrum-clear-button-icon-color-key-focus:var(--system-clear-button-over-background-icon-color-key-focus);--spectrum-clear-button-background-color:var(--system-clear-button-over-background-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-over-background-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-over-background-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-over-background-background-color-key-focus)}:host([disabled]),:host([disabled]){--spectrum-clear-button-icon-color:var(--system-clear-button-disabled-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-disabled-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-disabled-icon-color-down);--spectrum-clear-button-background-color:var(--system-clear-button-disabled-background-color)}\n`;\nexport default styles;"],
5
+ "mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAGf,eAAe;",
6
+ "names": []
7
+ }
package/src/clear-button-overrides.css.js ADDED
@@ -0,0 +1,4 @@
1
+ "use strict";import{css as o}from"@spectrum-web-components/base";const r=o`
2
+ :host{--spectrum-clear-button-background-color:var(--system-clear-button-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-background-color-key-focus);--spectrum-clear-button-height:var(--system-clear-button-height);--spectrum-clear-button-width:var(--system-clear-button-width);--spectrum-clear-button-padding:var(--system-clear-button-padding);--spectrum-clear-button-icon-color:var(--system-clear-button-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-icon-color-down);--spectrum-clear-button-icon-color-key-focus:var(--system-clear-button-icon-color-key-focus)}:host([size=s]){--spectrum-clear-button-height:var(--system-clear-button-size-s-height);--spectrum-clear-button-width:var(--system-clear-button-size-s-width)}:host([size=l]){--spectrum-clear-button-height:var(--system-clear-button-size-l-height);--spectrum-clear-button-width:var(--system-clear-button-size-l-width)}:host([size=xl]){--spectrum-clear-button-height:var(--system-clear-button-size-xl-height);--spectrum-clear-button-width:var(--system-clear-button-size-xl-width)}:host .spectrum-ClearButton--quiet{--spectrum-clear-button-background-color:var(--system-clear-button-quiet-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-quiet-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-quiet-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-quiet-background-color-key-focus)}:host([variant=overBackground]){--spectrum-clear-button-icon-color:var(--system-clear-button-over-background-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-over-background-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-over-background-icon-color-down);--spectrum-clear-button-icon-color-key-focus:var(--system-clear-button-over-background-icon-color-key-focus);--spectrum-clear-button-background-color:var(--system-clear-button-over-background-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-over-background-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-over-background-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-over-background-background-color-key-focus)}:host([disabled]),:host([disabled]){--spectrum-clear-button-icon-color:var(--system-clear-button-disabled-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-disabled-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-disabled-icon-color-down);--spectrum-clear-button-background-color:var(--system-clear-button-disabled-background-color)}
3
+ `;export default r;
4
+ //# sourceMappingURL=clear-button-overrides.css.js.map
package/src/clear-button-overrides.css.js.map ADDED
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["clear-button-overrides.css.ts"],
4
+ "sourcesContent": ["/*\nCopyright 2024 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-clear-button-background-color:var(--system-clear-button-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-background-color-key-focus);--spectrum-clear-button-height:var(--system-clear-button-height);--spectrum-clear-button-width:var(--system-clear-button-width);--spectrum-clear-button-padding:var(--system-clear-button-padding);--spectrum-clear-button-icon-color:var(--system-clear-button-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-icon-color-down);--spectrum-clear-button-icon-color-key-focus:var(--system-clear-button-icon-color-key-focus)}:host([size=s]){--spectrum-clear-button-height:var(--system-clear-button-size-s-height);--spectrum-clear-button-width:var(--system-clear-button-size-s-width)}:host([size=l]){--spectrum-clear-button-height:var(--system-clear-button-size-l-height);--spectrum-clear-button-width:var(--system-clear-button-size-l-width)}:host([size=xl]){--spectrum-clear-button-height:var(--system-clear-button-size-xl-height);--spectrum-clear-button-width:var(--system-clear-button-size-xl-width)}:host .spectrum-ClearButton--quiet{--spectrum-clear-button-background-color:var(--system-clear-button-quiet-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-quiet-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-quiet-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-quiet-background-color-key-focus)}:host([variant=overBackground]){--spectrum-clear-button-icon-color:var(--system-clear-button-over-background-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-over-background-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-over-background-icon-color-down);--spectrum-clear-button-icon-color-key-focus:var(--system-clear-button-over-background-icon-color-key-focus);--spectrum-clear-button-background-color:var(--system-clear-button-over-background-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-over-background-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-over-background-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-over-background-background-color-key-focus)}:host([disabled]),:host([disabled]){--spectrum-clear-button-icon-color:var(--system-clear-button-disabled-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-disabled-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-disabled-icon-color-down);--spectrum-clear-button-background-color:var(--system-clear-button-disabled-background-color)}\n`;\nexport default styles;"],
5
+ "mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA,EAGf,eAAeC",
6
+ "names": ["css", "styles"]
7
+ }
package/src/clear-button.css.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ declare const styles: import("@spectrum-web-components/base").CSSResult;
2
+ export default styles;
package/src/clear-button.css.dev.js ADDED
@@ -0,0 +1,7 @@
1
+ "use strict";
2
+ import { css } from "@spectrum-web-components/base";
3
+ const styles = css`
4
+ :host{block-size:var(--mod-clear-button-height,var(--spectrum-clear-button-height));inline-size:var(--mod-clear-button-width,var(--spectrum-clear-button-width));cursor:pointer;background-color:initial;background-color:var(--mod-clear-button-background-color,transparent);padding:var(--mod-clear-button-padding,var(--spectrum-clear-button-padding));color:var(--mod-clear-button-icon-color,var(--spectrum-clear-button-icon-color));border:none;border-radius:100%;margin:0}.icon{margin-block:0;margin-inline:auto}@media (hover:hover){:host(:hover){color:var(--highcontrast-clear-button-icon-color-hover,var(--mod-clear-button-icon-color-hover,var(--spectrum-clear-button-icon-color-hover)))}:host(:hover) .fill{background-color:var(--mod-clear-button-background-color-hover,var(--spectrum-clear-button-background-color-hover))}}:host(:is(:active,[active])){color:var(--mod-clear-button-icon-color-down,var(--spectrum-clear-button-icon-color-down))}:host(:is(:active,[active])) .fill{background-color:var(--mod-clear-button-background-color-down,var(--spectrum-clear-button-background-color-down))}:host([focus-within]) .js-focus-within,:host(:focus-visible),:host:focus-within,:host([focus-within]) .js-focus-within{color:var(--mod-clear-button-icon-color-key-focus,var(--spectrum-clear-button-icon-color-key-focus))}:host([focus-within]) .js-focus-within .fill,:host(:focus-visible) .fill,:host:focus-within .fill,:host([focus-within]) .js-focus-within .fill{background-color:var(--mod-clear-button-background-color-key-focus,var(--spectrum-clear-button-background-color-key-focus))}:host([disabled]),:host([disabled]){--spectrum-clear-button-icon-color:var(--mod-clear-button-icon-color-disabled,var(--spectrum-disabled-content-color));--spectrum-clear-button-background-color:var(--mod-clear-button-background-color-disabled,transparent)}.fill{background-color:var(--mod-clear-button-background-color,var(--spectrum-clear-button-background-color));inline-size:100%;block-size:100%;border-radius:100%;justify-content:center;align-items:center;display:flex}:host([variant=overBackground]:focus-visible){outline:none}@media (forced-colors:active){:host:not(:disabled){--highcontrast-clear-button-icon-color-hover:Highlight}}:host{--spectrum-clear-button-background-color:var(--system-clear-button-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-background-color-key-focus);--spectrum-clear-button-height:var(--system-clear-button-height);--spectrum-clear-button-width:var(--system-clear-button-width);--spectrum-clear-button-padding:var(--system-clear-button-padding);--spectrum-clear-button-icon-color:var(--system-clear-button-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-icon-color-down);--spectrum-clear-button-icon-color-key-focus:var(--system-clear-button-icon-color-key-focus)}:host([size=s]){--spectrum-clear-button-height:var(--system-clear-button-size-s-height);--spectrum-clear-button-width:var(--system-clear-button-size-s-width)}:host([size=l]){--spectrum-clear-button-height:var(--system-clear-button-size-l-height);--spectrum-clear-button-width:var(--system-clear-button-size-l-width)}:host([size=xl]){--spectrum-clear-button-height:var(--system-clear-button-size-xl-height);--spectrum-clear-button-width:var(--system-clear-button-size-xl-width)}:host .spectrum-ClearButton--quiet{--spectrum-clear-button-background-color:var(--system-clear-button-quiet-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-quiet-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-quiet-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-quiet-background-color-key-focus)}:host([variant=overBackground]){--spectrum-clear-button-icon-color:var(--system-clear-button-over-background-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-over-background-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-over-background-icon-color-down);--spectrum-clear-button-icon-color-key-focus:var(--system-clear-button-over-background-icon-color-key-focus);--spectrum-clear-button-background-color:var(--system-clear-button-over-background-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-over-background-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-over-background-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-over-background-background-color-key-focus)}:host([disabled]),:host([disabled]){--spectrum-clear-button-icon-color:var(--system-clear-button-disabled-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-disabled-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-disabled-icon-color-down);--spectrum-clear-button-background-color:var(--system-clear-button-disabled-background-color)}:host{box-sizing:border-box}
5
+ `;
6
+ export default styles;
7
+ //# sourceMappingURL=clear-button.css.dev.js.map
package/src/clear-button.css.dev.js.map ADDED
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["clear-button.css.ts"],
4
+ "sourcesContent": ["/*\nCopyright 2024 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{block-size:var(--mod-clear-button-height,var(--spectrum-clear-button-height));inline-size:var(--mod-clear-button-width,var(--spectrum-clear-button-width));cursor:pointer;background-color:initial;background-color:var(--mod-clear-button-background-color,transparent);padding:var(--mod-clear-button-padding,var(--spectrum-clear-button-padding));color:var(--mod-clear-button-icon-color,var(--spectrum-clear-button-icon-color));border:none;border-radius:100%;margin:0}.icon{margin-block:0;margin-inline:auto}@media (hover:hover){:host(:hover){color:var(--highcontrast-clear-button-icon-color-hover,var(--mod-clear-button-icon-color-hover,var(--spectrum-clear-button-icon-color-hover)))}:host(:hover) .fill{background-color:var(--mod-clear-button-background-color-hover,var(--spectrum-clear-button-background-color-hover))}}:host(:is(:active,[active])){color:var(--mod-clear-button-icon-color-down,var(--spectrum-clear-button-icon-color-down))}:host(:is(:active,[active])) .fill{background-color:var(--mod-clear-button-background-color-down,var(--spectrum-clear-button-background-color-down))}:host([focus-within]) .js-focus-within,:host(:focus-visible),:host:focus-within,:host([focus-within]) .js-focus-within{color:var(--mod-clear-button-icon-color-key-focus,var(--spectrum-clear-button-icon-color-key-focus))}:host([focus-within]) .js-focus-within .fill,:host(:focus-visible) .fill,:host:focus-within .fill,:host([focus-within]) .js-focus-within .fill{background-color:var(--mod-clear-button-background-color-key-focus,var(--spectrum-clear-button-background-color-key-focus))}:host([disabled]),:host([disabled]){--spectrum-clear-button-icon-color:var(--mod-clear-button-icon-color-disabled,var(--spectrum-disabled-content-color));--spectrum-clear-button-background-color:var(--mod-clear-button-background-color-disabled,transparent)}.fill{background-color:var(--mod-clear-button-background-color,var(--spectrum-clear-button-background-color));inline-size:100%;block-size:100%;border-radius:100%;justify-content:center;align-items:center;display:flex}:host([variant=overBackground]:focus-visible){outline:none}@media (forced-colors:active){:host:not(:disabled){--highcontrast-clear-button-icon-color-hover:Highlight}}:host{--spectrum-clear-button-background-color:var(--system-clear-button-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-background-color-key-focus);--spectrum-clear-button-height:var(--system-clear-button-height);--spectrum-clear-button-width:var(--system-clear-button-width);--spectrum-clear-button-padding:var(--system-clear-button-padding);--spectrum-clear-button-icon-color:var(--system-clear-button-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-icon-color-down);--spectrum-clear-button-icon-color-key-focus:var(--system-clear-button-icon-color-key-focus)}:host([size=s]){--spectrum-clear-button-height:var(--system-clear-button-size-s-height);--spectrum-clear-button-width:var(--system-clear-button-size-s-width)}:host([size=l]){--spectrum-clear-button-height:var(--system-clear-button-size-l-height);--spectrum-clear-button-width:var(--system-clear-button-size-l-width)}:host([size=xl]){--spectrum-clear-button-height:var(--system-clear-button-size-xl-height);--spectrum-clear-button-width:var(--system-clear-button-size-xl-width)}:host .spectrum-ClearButton--quiet{--spectrum-clear-button-background-color:var(--system-clear-button-quiet-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-quiet-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-quiet-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-quiet-background-color-key-focus)}:host([variant=overBackground]){--spectrum-clear-button-icon-color:var(--system-clear-button-over-background-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-over-background-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-over-background-icon-color-down);--spectrum-clear-button-icon-color-key-focus:var(--system-clear-button-over-background-icon-color-key-focus);--spectrum-clear-button-background-color:var(--system-clear-button-over-background-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-over-background-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-over-background-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-over-background-background-color-key-focus)}:host([disabled]),:host([disabled]){--spectrum-clear-button-icon-color:var(--system-clear-button-disabled-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-disabled-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-disabled-icon-color-down);--spectrum-clear-button-background-color:var(--system-clear-button-disabled-background-color)}:host{box-sizing:border-box}\n`;\nexport default styles;"],
5
+ "mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAGf,eAAe;",
6
+ "names": []
7
+ }
package/src/clear-button.css.js ADDED
@@ -0,0 +1,4 @@
1
+ "use strict";import{css as o}from"@spectrum-web-components/base";const r=o`
2
+ :host{block-size:var(--mod-clear-button-height,var(--spectrum-clear-button-height));inline-size:var(--mod-clear-button-width,var(--spectrum-clear-button-width));cursor:pointer;background-color:initial;background-color:var(--mod-clear-button-background-color,transparent);padding:var(--mod-clear-button-padding,var(--spectrum-clear-button-padding));color:var(--mod-clear-button-icon-color,var(--spectrum-clear-button-icon-color));border:none;border-radius:100%;margin:0}.icon{margin-block:0;margin-inline:auto}@media (hover:hover){:host(:hover){color:var(--highcontrast-clear-button-icon-color-hover,var(--mod-clear-button-icon-color-hover,var(--spectrum-clear-button-icon-color-hover)))}:host(:hover) .fill{background-color:var(--mod-clear-button-background-color-hover,var(--spectrum-clear-button-background-color-hover))}}:host(:is(:active,[active])){color:var(--mod-clear-button-icon-color-down,var(--spectrum-clear-button-icon-color-down))}:host(:is(:active,[active])) .fill{background-color:var(--mod-clear-button-background-color-down,var(--spectrum-clear-button-background-color-down))}:host([focus-within]) .js-focus-within,:host(:focus-visible),:host:focus-within,:host([focus-within]) .js-focus-within{color:var(--mod-clear-button-icon-color-key-focus,var(--spectrum-clear-button-icon-color-key-focus))}:host([focus-within]) .js-focus-within .fill,:host(:focus-visible) .fill,:host:focus-within .fill,:host([focus-within]) .js-focus-within .fill{background-color:var(--mod-clear-button-background-color-key-focus,var(--spectrum-clear-button-background-color-key-focus))}:host([disabled]),:host([disabled]){--spectrum-clear-button-icon-color:var(--mod-clear-button-icon-color-disabled,var(--spectrum-disabled-content-color));--spectrum-clear-button-background-color:var(--mod-clear-button-background-color-disabled,transparent)}.fill{background-color:var(--mod-clear-button-background-color,var(--spectrum-clear-button-background-color));inline-size:100%;block-size:100%;border-radius:100%;justify-content:center;align-items:center;display:flex}:host([variant=overBackground]:focus-visible){outline:none}@media (forced-colors:active){:host:not(:disabled){--highcontrast-clear-button-icon-color-hover:Highlight}}:host{--spectrum-clear-button-background-color:var(--system-clear-button-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-background-color-key-focus);--spectrum-clear-button-height:var(--system-clear-button-height);--spectrum-clear-button-width:var(--system-clear-button-width);--spectrum-clear-button-padding:var(--system-clear-button-padding);--spectrum-clear-button-icon-color:var(--system-clear-button-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-icon-color-down);--spectrum-clear-button-icon-color-key-focus:var(--system-clear-button-icon-color-key-focus)}:host([size=s]){--spectrum-clear-button-height:var(--system-clear-button-size-s-height);--spectrum-clear-button-width:var(--system-clear-button-size-s-width)}:host([size=l]){--spectrum-clear-button-height:var(--system-clear-button-size-l-height);--spectrum-clear-button-width:var(--system-clear-button-size-l-width)}:host([size=xl]){--spectrum-clear-button-height:var(--system-clear-button-size-xl-height);--spectrum-clear-button-width:var(--system-clear-button-size-xl-width)}:host .spectrum-ClearButton--quiet{--spectrum-clear-button-background-color:var(--system-clear-button-quiet-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-quiet-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-quiet-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-quiet-background-color-key-focus)}:host([variant=overBackground]){--spectrum-clear-button-icon-color:var(--system-clear-button-over-background-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-over-background-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-over-background-icon-color-down);--spectrum-clear-button-icon-color-key-focus:var(--system-clear-button-over-background-icon-color-key-focus);--spectrum-clear-button-background-color:var(--system-clear-button-over-background-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-over-background-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-over-background-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-over-background-background-color-key-focus)}:host([disabled]),:host([disabled]){--spectrum-clear-button-icon-color:var(--system-clear-button-disabled-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-disabled-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-disabled-icon-color-down);--spectrum-clear-button-background-color:var(--system-clear-button-disabled-background-color)}:host{box-sizing:border-box}
3
+ `;export default r;
4
+ //# sourceMappingURL=clear-button.css.js.map
package/src/clear-button.css.js.map ADDED
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["clear-button.css.ts"],
4
+ "sourcesContent": ["/*\nCopyright 2024 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{block-size:var(--mod-clear-button-height,var(--spectrum-clear-button-height));inline-size:var(--mod-clear-button-width,var(--spectrum-clear-button-width));cursor:pointer;background-color:initial;background-color:var(--mod-clear-button-background-color,transparent);padding:var(--mod-clear-button-padding,var(--spectrum-clear-button-padding));color:var(--mod-clear-button-icon-color,var(--spectrum-clear-button-icon-color));border:none;border-radius:100%;margin:0}.icon{margin-block:0;margin-inline:auto}@media (hover:hover){:host(:hover){color:var(--highcontrast-clear-button-icon-color-hover,var(--mod-clear-button-icon-color-hover,var(--spectrum-clear-button-icon-color-hover)))}:host(:hover) .fill{background-color:var(--mod-clear-button-background-color-hover,var(--spectrum-clear-button-background-color-hover))}}:host(:is(:active,[active])){color:var(--mod-clear-button-icon-color-down,var(--spectrum-clear-button-icon-color-down))}:host(:is(:active,[active])) .fill{background-color:var(--mod-clear-button-background-color-down,var(--spectrum-clear-button-background-color-down))}:host([focus-within]) .js-focus-within,:host(:focus-visible),:host:focus-within,:host([focus-within]) .js-focus-within{color:var(--mod-clear-button-icon-color-key-focus,var(--spectrum-clear-button-icon-color-key-focus))}:host([focus-within]) .js-focus-within .fill,:host(:focus-visible) .fill,:host:focus-within .fill,:host([focus-within]) .js-focus-within .fill{background-color:var(--mod-clear-button-background-color-key-focus,var(--spectrum-clear-button-background-color-key-focus))}:host([disabled]),:host([disabled]){--spectrum-clear-button-icon-color:var(--mod-clear-button-icon-color-disabled,var(--spectrum-disabled-content-color));--spectrum-clear-button-background-color:var(--mod-clear-button-background-color-disabled,transparent)}.fill{background-color:var(--mod-clear-button-background-color,var(--spectrum-clear-button-background-color));inline-size:100%;block-size:100%;border-radius:100%;justify-content:center;align-items:center;display:flex}:host([variant=overBackground]:focus-visible){outline:none}@media (forced-colors:active){:host:not(:disabled){--highcontrast-clear-button-icon-color-hover:Highlight}}:host{--spectrum-clear-button-background-color:var(--system-clear-button-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-background-color-key-focus);--spectrum-clear-button-height:var(--system-clear-button-height);--spectrum-clear-button-width:var(--system-clear-button-width);--spectrum-clear-button-padding:var(--system-clear-button-padding);--spectrum-clear-button-icon-color:var(--system-clear-button-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-icon-color-down);--spectrum-clear-button-icon-color-key-focus:var(--system-clear-button-icon-color-key-focus)}:host([size=s]){--spectrum-clear-button-height:var(--system-clear-button-size-s-height);--spectrum-clear-button-width:var(--system-clear-button-size-s-width)}:host([size=l]){--spectrum-clear-button-height:var(--system-clear-button-size-l-height);--spectrum-clear-button-width:var(--system-clear-button-size-l-width)}:host([size=xl]){--spectrum-clear-button-height:var(--system-clear-button-size-xl-height);--spectrum-clear-button-width:var(--system-clear-button-size-xl-width)}:host .spectrum-ClearButton--quiet{--spectrum-clear-button-background-color:var(--system-clear-button-quiet-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-quiet-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-quiet-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-quiet-background-color-key-focus)}:host([variant=overBackground]){--spectrum-clear-button-icon-color:var(--system-clear-button-over-background-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-over-background-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-over-background-icon-color-down);--spectrum-clear-button-icon-color-key-focus:var(--system-clear-button-over-background-icon-color-key-focus);--spectrum-clear-button-background-color:var(--system-clear-button-over-background-background-color);--spectrum-clear-button-background-color-hover:var(--system-clear-button-over-background-background-color-hover);--spectrum-clear-button-background-color-down:var(--system-clear-button-over-background-background-color-down);--spectrum-clear-button-background-color-key-focus:var(--system-clear-button-over-background-background-color-key-focus)}:host([disabled]),:host([disabled]){--spectrum-clear-button-icon-color:var(--system-clear-button-disabled-icon-color);--spectrum-clear-button-icon-color-hover:var(--system-clear-button-disabled-icon-color-hover);--spectrum-clear-button-icon-color-down:var(--system-clear-button-disabled-icon-color-down);--spectrum-clear-button-background-color:var(--system-clear-button-disabled-background-color)}:host{box-sizing:border-box}\n`;\nexport default styles;"],
5
+ "mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA,EAGf,eAAeC",
6
+ "names": ["css", "styles"]
7
+ }
package/src/spectrum-clear-button.css.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ declare const styles: import("@spectrum-web-components/base").CSSResult;
2
+ export default styles;
package/src/spectrum-clear-button.css.dev.js ADDED
@@ -0,0 +1,7 @@
1
+ "use strict";
2
+ import { css } from "@spectrum-web-components/base";
3
+ const styles = css`
4
+ :host{block-size:var(--mod-clear-button-height,var(--spectrum-clear-button-height));inline-size:var(--mod-clear-button-width,var(--spectrum-clear-button-width));cursor:pointer;background-color:initial;background-color:var(--mod-clear-button-background-color,transparent);padding:var(--mod-clear-button-padding,var(--spectrum-clear-button-padding));color:var(--mod-clear-button-icon-color,var(--spectrum-clear-button-icon-color));border:none;border-radius:100%;margin:0}.icon{margin-block:0;margin-inline:auto}@media (hover:hover){:host(:hover){color:var(--highcontrast-clear-button-icon-color-hover,var(--mod-clear-button-icon-color-hover,var(--spectrum-clear-button-icon-color-hover)))}:host(:hover) .fill{background-color:var(--mod-clear-button-background-color-hover,var(--spectrum-clear-button-background-color-hover))}}:host(:is(:active,[active])){color:var(--mod-clear-button-icon-color-down,var(--spectrum-clear-button-icon-color-down))}:host(:is(:active,[active])) .fill{background-color:var(--mod-clear-button-background-color-down,var(--spectrum-clear-button-background-color-down))}:host([focus-within]) .js-focus-within,:host(:focus-visible),:host:focus-within,:host([focus-within]) .js-focus-within{color:var(--mod-clear-button-icon-color-key-focus,var(--spectrum-clear-button-icon-color-key-focus))}:host([focus-within]) .js-focus-within .fill,:host(:focus-visible) .fill,:host:focus-within .fill,:host([focus-within]) .js-focus-within .fill{background-color:var(--mod-clear-button-background-color-key-focus,var(--spectrum-clear-button-background-color-key-focus))}:host([disabled]),:host([disabled]){--spectrum-clear-button-icon-color:var(--mod-clear-button-icon-color-disabled,var(--spectrum-disabled-content-color));--spectrum-clear-button-background-color:var(--mod-clear-button-background-color-disabled,transparent)}.fill{background-color:var(--mod-clear-button-background-color,var(--spectrum-clear-button-background-color));inline-size:100%;block-size:100%;border-radius:100%;justify-content:center;align-items:center;display:flex}:host([variant=overBackground]:focus-visible){outline:none}@media (forced-colors:active){:host:not(:disabled){--highcontrast-clear-button-icon-color-hover:Highlight}}
5
+ `;
6
+ export default styles;
7
+ //# sourceMappingURL=spectrum-clear-button.css.dev.js.map
package/src/spectrum-clear-button.css.dev.js.map ADDED
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["spectrum-clear-button.css.ts"],
4
+ "sourcesContent": ["/*\nCopyright 2024 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{block-size:var(--mod-clear-button-height,var(--spectrum-clear-button-height));inline-size:var(--mod-clear-button-width,var(--spectrum-clear-button-width));cursor:pointer;background-color:initial;background-color:var(--mod-clear-button-background-color,transparent);padding:var(--mod-clear-button-padding,var(--spectrum-clear-button-padding));color:var(--mod-clear-button-icon-color,var(--spectrum-clear-button-icon-color));border:none;border-radius:100%;margin:0}.icon{margin-block:0;margin-inline:auto}@media (hover:hover){:host(:hover){color:var(--highcontrast-clear-button-icon-color-hover,var(--mod-clear-button-icon-color-hover,var(--spectrum-clear-button-icon-color-hover)))}:host(:hover) .fill{background-color:var(--mod-clear-button-background-color-hover,var(--spectrum-clear-button-background-color-hover))}}:host(:is(:active,[active])){color:var(--mod-clear-button-icon-color-down,var(--spectrum-clear-button-icon-color-down))}:host(:is(:active,[active])) .fill{background-color:var(--mod-clear-button-background-color-down,var(--spectrum-clear-button-background-color-down))}:host([focus-within]) .js-focus-within,:host(:focus-visible),:host:focus-within,:host([focus-within]) .js-focus-within{color:var(--mod-clear-button-icon-color-key-focus,var(--spectrum-clear-button-icon-color-key-focus))}:host([focus-within]) .js-focus-within .fill,:host(:focus-visible) .fill,:host:focus-within .fill,:host([focus-within]) .js-focus-within .fill{background-color:var(--mod-clear-button-background-color-key-focus,var(--spectrum-clear-button-background-color-key-focus))}:host([disabled]),:host([disabled]){--spectrum-clear-button-icon-color:var(--mod-clear-button-icon-color-disabled,var(--spectrum-disabled-content-color));--spectrum-clear-button-background-color:var(--mod-clear-button-background-color-disabled,transparent)}.fill{background-color:var(--mod-clear-button-background-color,var(--spectrum-clear-button-background-color));inline-size:100%;block-size:100%;border-radius:100%;justify-content:center;align-items:center;display:flex}:host([variant=overBackground]:focus-visible){outline:none}@media (forced-colors:active){:host:not(:disabled){--highcontrast-clear-button-icon-color-hover:Highlight}}\n`;\nexport default styles;"],
5
+ "mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAGf,eAAe;",
6
+ "names": []
7
+ }
package/src/spectrum-clear-button.css.js ADDED
@@ -0,0 +1,4 @@
1
+ "use strict";import{css as o}from"@spectrum-web-components/base";const r=o`
2
+ :host{block-size:var(--mod-clear-button-height,var(--spectrum-clear-button-height));inline-size:var(--mod-clear-button-width,var(--spectrum-clear-button-width));cursor:pointer;background-color:initial;background-color:var(--mod-clear-button-background-color,transparent);padding:var(--mod-clear-button-padding,var(--spectrum-clear-button-padding));color:var(--mod-clear-button-icon-color,var(--spectrum-clear-button-icon-color));border:none;border-radius:100%;margin:0}.icon{margin-block:0;margin-inline:auto}@media (hover:hover){:host(:hover){color:var(--highcontrast-clear-button-icon-color-hover,var(--mod-clear-button-icon-color-hover,var(--spectrum-clear-button-icon-color-hover)))}:host(:hover) .fill{background-color:var(--mod-clear-button-background-color-hover,var(--spectrum-clear-button-background-color-hover))}}:host(:is(:active,[active])){color:var(--mod-clear-button-icon-color-down,var(--spectrum-clear-button-icon-color-down))}:host(:is(:active,[active])) .fill{background-color:var(--mod-clear-button-background-color-down,var(--spectrum-clear-button-background-color-down))}:host([focus-within]) .js-focus-within,:host(:focus-visible),:host:focus-within,:host([focus-within]) .js-focus-within{color:var(--mod-clear-button-icon-color-key-focus,var(--spectrum-clear-button-icon-color-key-focus))}:host([focus-within]) .js-focus-within .fill,:host(:focus-visible) .fill,:host:focus-within .fill,:host([focus-within]) .js-focus-within .fill{background-color:var(--mod-clear-button-background-color-key-focus,var(--spectrum-clear-button-background-color-key-focus))}:host([disabled]),:host([disabled]){--spectrum-clear-button-icon-color:var(--mod-clear-button-icon-color-disabled,var(--spectrum-disabled-content-color));--spectrum-clear-button-background-color:var(--mod-clear-button-background-color-disabled,transparent)}.fill{background-color:var(--mod-clear-button-background-color,var(--spectrum-clear-button-background-color));inline-size:100%;block-size:100%;border-radius:100%;justify-content:center;align-items:center;display:flex}:host([variant=overBackground]:focus-visible){outline:none}@media (forced-colors:active){:host:not(:disabled){--highcontrast-clear-button-icon-color-hover:Highlight}}
3
+ `;export default r;
4
+ //# sourceMappingURL=spectrum-clear-button.css.js.map
package/src/spectrum-clear-button.css.js.map ADDED
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["spectrum-clear-button.css.ts"],
4
+ "sourcesContent": ["/*\nCopyright 2024 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{block-size:var(--mod-clear-button-height,var(--spectrum-clear-button-height));inline-size:var(--mod-clear-button-width,var(--spectrum-clear-button-width));cursor:pointer;background-color:initial;background-color:var(--mod-clear-button-background-color,transparent);padding:var(--mod-clear-button-padding,var(--spectrum-clear-button-padding));color:var(--mod-clear-button-icon-color,var(--spectrum-clear-button-icon-color));border:none;border-radius:100%;margin:0}.icon{margin-block:0;margin-inline:auto}@media (hover:hover){:host(:hover){color:var(--highcontrast-clear-button-icon-color-hover,var(--mod-clear-button-icon-color-hover,var(--spectrum-clear-button-icon-color-hover)))}:host(:hover) .fill{background-color:var(--mod-clear-button-background-color-hover,var(--spectrum-clear-button-background-color-hover))}}:host(:is(:active,[active])){color:var(--mod-clear-button-icon-color-down,var(--spectrum-clear-button-icon-color-down))}:host(:is(:active,[active])) .fill{background-color:var(--mod-clear-button-background-color-down,var(--spectrum-clear-button-background-color-down))}:host([focus-within]) .js-focus-within,:host(:focus-visible),:host:focus-within,:host([focus-within]) .js-focus-within{color:var(--mod-clear-button-icon-color-key-focus,var(--spectrum-clear-button-icon-color-key-focus))}:host([focus-within]) .js-focus-within .fill,:host(:focus-visible) .fill,:host:focus-within .fill,:host([focus-within]) .js-focus-within .fill{background-color:var(--mod-clear-button-background-color-key-focus,var(--spectrum-clear-button-background-color-key-focus))}:host([disabled]),:host([disabled]){--spectrum-clear-button-icon-color:var(--mod-clear-button-icon-color-disabled,var(--spectrum-disabled-content-color));--spectrum-clear-button-background-color:var(--mod-clear-button-background-color-disabled,transparent)}.fill{background-color:var(--mod-clear-button-background-color,var(--spectrum-clear-button-background-color));inline-size:100%;block-size:100%;border-radius:100%;justify-content:center;align-items:center;display:flex}:host([variant=overBackground]:focus-visible){outline:none}@media (forced-colors:active){:host:not(:disabled){--highcontrast-clear-button-icon-color-hover:Highlight}}\n`;\nexport default styles;"],
5
+ "mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA,EAGf,eAAeC",
6
+ "names": ["css", "styles"]
7
+ }
package/src/spectrum-config.js ADDED
@@ -0,0 +1,90 @@
1
+ // @ts-check
2
+ /*
3
+ Copyright 2023 Adobe. All rights reserved.
4
+ This file is licensed to you under the Apache License, Version 2.0 (the 'License');
5
+ you may not use this file except in compliance with the License. You may obtain a copy
6
+ of the License at http://www.apache.org/licenses/LICENSE-2.0
7
+
8
+ Unless required by applicable law or agreed to in writing, software distributed under
9
+ the License is distributed on an 'AS IS' BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
10
+ OF ANY KIND, either express or implied. See the License for the specific language
11
+ governing permissions and limitations under the License.
12
+ */
13
+
14
+ import { converterFor } from '../../../tasks/process-spectrum-utils.js';
15
+
16
+ const converter = converterFor('spectrum-ClearButton');
17
+
18
+ /**
19
+ * @type { import('../../../tasks/spectrum-css-converter').SpectrumCSSConverter }
20
+ */
21
+ const config = {
22
+ conversions: [
23
+ {
24
+ inPackage: '@spectrum-css/clearbutton',
25
+ outPackage: 'clear-button',
26
+ fileName: 'clear-button',
27
+ components: [
28
+ converter.classToHost(),
29
+ {
30
+ find: {
31
+ type: 'pseudo-class',
32
+ kind: 'active',
33
+ },
34
+ replace: {
35
+ type: 'pseudo-class',
36
+ kind: 'is',
37
+ selectors: [
38
+ [
39
+ {
40
+ type: 'pseudo-class',
41
+ kind: 'active',
42
+ },
43
+ ],
44
+ [
45
+ {
46
+ type: 'attribute',
47
+ name: 'active',
48
+ },
49
+ ],
50
+ ],
51
+ },
52
+ hoist: true,
53
+ },
54
+ converter.pseudoToAttribute('disabled', 'disabled'),
55
+ converter.classToAttribute('is-disabled', 'disabled'),
56
+ ...converter.enumerateAttributes(
57
+ [
58
+ ['spectrum-ClearButton--cta'],
59
+ ['spectrum-ClearButton--primary'],
60
+ ['spectrum-ClearButton--secondary'],
61
+ ['spectrum-ClearButton--overBackground'],
62
+ ['spectrum-ClearButton--warning', 'negative'],
63
+ ],
64
+ 'variant'
65
+ ),
66
+ // Default to `size='m'` without needing the attribute
67
+ converter.classToHost('spectrum-ClearButton--sizeM'),
68
+ ...converter.enumerateAttributes(
69
+ [
70
+ ['spectrum-ClearButton--sizeS', 's'],
71
+ ['spectrum-ClearButton--sizeL', 'l'],
72
+ ['spectrum-ClearButton--sizeXL', 'xl'],
73
+ ],
74
+ 'size'
75
+ ),
76
+ converter.classToClass('spectrum-Icon', 'icon'),
77
+ converter.classToClass('spectrum-ClearButton-fill'),
78
+ ],
79
+ excludeByComponents: [
80
+ {
81
+ type: 'pseudo-element',
82
+ kind: 'custom',
83
+ name: '-moz-focus-inner',
84
+ },
85
+ ],
86
+ },
87
+ ],
88
+ };
89
+
90
+ export default config;