@spectrum-web-components/checkbox 0.40.1 → 0.40.3
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 +7 -7
- package/src/CheckboxMixin.d.ts +1 -0
- package/src/CheckboxMixin.dev.js +1 -0
- package/src/CheckboxMixin.dev.js.map +2 -2
- package/src/CheckboxMixin.js +3 -2
- package/src/CheckboxMixin.js.map +2 -2
- package/src/checkbox.css.dev.js +6 -6
- package/src/checkbox.css.dev.js.map +1 -1
- package/src/checkbox.css.js +6 -6
- package/src/checkbox.css.js.map +1 -1
- package/src/spectrum-checkbox.css.dev.js +6 -6
- package/src/spectrum-checkbox.css.dev.js.map +1 -1
- package/src/spectrum-checkbox.css.js +6 -6
- package/src/spectrum-checkbox.css.js.map +1 -1
- package/test/checkbox.test.js +53 -0
- package/test/checkbox.test.js.map +2 -2
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spectrum-web-components/checkbox",
|
|
3
|
-
"version": "0.40.
|
|
3
|
+
"version": "0.40.3",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -65,13 +65,13 @@
|
|
|
65
65
|
"lit-html"
|
|
66
66
|
],
|
|
67
67
|
"dependencies": {
|
|
68
|
-
"@spectrum-web-components/base": "^0.40.
|
|
69
|
-
"@spectrum-web-components/icon": "^0.40.
|
|
70
|
-
"@spectrum-web-components/icons-ui": "^0.40.
|
|
71
|
-
"@spectrum-web-components/shared": "^0.40.
|
|
68
|
+
"@spectrum-web-components/base": "^0.40.3",
|
|
69
|
+
"@spectrum-web-components/icon": "^0.40.3",
|
|
70
|
+
"@spectrum-web-components/icons-ui": "^0.40.3",
|
|
71
|
+
"@spectrum-web-components/shared": "^0.40.3"
|
|
72
72
|
},
|
|
73
73
|
"devDependencies": {
|
|
74
|
-
"@spectrum-css/checkbox": "^
|
|
74
|
+
"@spectrum-css/checkbox": "^8.0.4"
|
|
75
75
|
},
|
|
76
76
|
"types": "./src/index.d.ts",
|
|
77
77
|
"customElements": "custom-elements.json",
|
|
@@ -79,5 +79,5 @@
|
|
|
79
79
|
"./sp-*.js",
|
|
80
80
|
"./**/*.dev.js"
|
|
81
81
|
],
|
|
82
|
-
"gitHead": "
|
|
82
|
+
"gitHead": "76467a3470aeafa4beefce1e4fc76341f1d6733f"
|
|
83
83
|
}
|
package/src/CheckboxMixin.d.ts
CHANGED
|
@@ -8,6 +8,7 @@ export interface CheckboxElement {
|
|
|
8
8
|
handleChange(): void;
|
|
9
9
|
inputElement: HTMLInputElement;
|
|
10
10
|
name?: string;
|
|
11
|
+
readonly?: boolean;
|
|
11
12
|
}
|
|
12
13
|
export declare function CheckboxMixin<T extends Constructor<ReactiveElement>>(constructor: T): T & Constructor<CheckboxElement>;
|
|
13
14
|
export {};
|
package/src/CheckboxMixin.dev.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["CheckboxMixin.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2023 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 { ReactiveElement } from 'lit';\nimport { html, TemplateResult } from '@spectrum-web-components/base';\nimport {\n property,\n query,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport { ifDefined } from '@spectrum-web-components/base/src/directives.js';\n\ntype Constructor<T = Record<string, unknown>> = {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n new (...args: any[]): T;\n prototype: T;\n};\n\nexport interface CheckboxElement {\n checked: boolean;\n handleChange(): void;\n inputElement: HTMLInputElement;\n name?: string;\n}\n\nexport function CheckboxMixin<T extends Constructor<ReactiveElement>>(\n constructor: T\n): T & Constructor<CheckboxElement> {\n class MixedElement extends constructor {\n @property({ type: Boolean, reflect: true })\n public checked = false;\n\n @property({ type: String, reflect: true })\n public name: string | undefined;\n\n @property({ type: Boolean, reflect: true })\n public readonly = false;\n\n @query('#input')\n inputElement!: HTMLInputElement;\n\n public handleChange(): void {\n if (this.readonly) {\n this.inputElement.checked = this.checked;\n return;\n }\n this.checked = this.inputElement.checked;\n\n const changeEvent = new CustomEvent('change', {\n bubbles: true,\n cancelable: true,\n composed: true,\n });\n const applyDefault = this.dispatchEvent(changeEvent);\n\n if (!applyDefault) {\n this.checked = !this.inputElement.checked;\n this.inputElement.checked = this.checked;\n }\n }\n\n protected render(): TemplateResult {\n return html`\n <input\n id=\"input\"\n name=${ifDefined(this.name || undefined)}\n type=\"checkbox\"\n .checked=${this.checked}\n @change=${this.handleChange}\n />\n `;\n }\n }\n return MixedElement;\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;AAaA,SAAS,YAA4B;AACrC;AAAA,EACI;AAAA,EACA;AAAA,OACG;AACP,SAAS,iBAAiB;
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2023 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 { ReactiveElement } from 'lit';\nimport { html, TemplateResult } from '@spectrum-web-components/base';\nimport {\n property,\n query,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport { ifDefined } from '@spectrum-web-components/base/src/directives.js';\n\ntype Constructor<T = Record<string, unknown>> = {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n new (...args: any[]): T;\n prototype: T;\n};\n\nexport interface CheckboxElement {\n checked: boolean;\n handleChange(): void;\n inputElement: HTMLInputElement;\n name?: string;\n readonly?: boolean;\n}\n\nexport function CheckboxMixin<T extends Constructor<ReactiveElement>>(\n constructor: T\n): T & Constructor<CheckboxElement> {\n class MixedElement extends constructor {\n @property({ type: Boolean, reflect: true })\n public checked = false;\n\n @property({ type: String, reflect: true })\n public name: string | undefined;\n\n @property({ type: Boolean, reflect: true })\n public readonly = false;\n\n @query('#input')\n inputElement!: HTMLInputElement;\n\n public handleChange(): void {\n if (this.readonly) {\n this.inputElement.checked = this.checked;\n return;\n }\n this.checked = this.inputElement.checked;\n\n const changeEvent = new CustomEvent('change', {\n bubbles: true,\n cancelable: true,\n composed: true,\n });\n const applyDefault = this.dispatchEvent(changeEvent);\n\n if (!applyDefault) {\n this.checked = !this.inputElement.checked;\n this.inputElement.checked = this.checked;\n }\n }\n\n protected render(): TemplateResult {\n return html`\n <input\n id=\"input\"\n name=${ifDefined(this.name || undefined)}\n type=\"checkbox\"\n .checked=${this.checked}\n ?disabled=${this.readonly}\n @change=${this.handleChange}\n />\n `;\n }\n }\n return MixedElement;\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;AAaA,SAAS,YAA4B;AACrC;AAAA,EACI;AAAA,EACA;AAAA,OACG;AACP,SAAS,iBAAiB;AAgBnB,gBAAS,cACZ,aACgC;AAAA,EAChC,MAAM,qBAAqB,YAAY;AAAA,IAAvC;AAAA;AAEI,WAAO,UAAU;AAMjB,WAAO,WAAW;AAAA;AAAA,IAKX,eAAqB;AACxB,UAAI,KAAK,UAAU;AACf,aAAK,aAAa,UAAU,KAAK;AACjC;AAAA,MACJ;AACA,WAAK,UAAU,KAAK,aAAa;AAEjC,YAAM,cAAc,IAAI,YAAY,UAAU;AAAA,QAC1C,SAAS;AAAA,QACT,YAAY;AAAA,QACZ,UAAU;AAAA,MACd,CAAC;AACD,YAAM,eAAe,KAAK,cAAc,WAAW;AAEnD,UAAI,CAAC,cAAc;AACf,aAAK,UAAU,CAAC,KAAK,aAAa;AAClC,aAAK,aAAa,UAAU,KAAK;AAAA,MACrC;AAAA,IACJ;AAAA,IAEU,SAAyB;AAC/B,aAAO;AAAA;AAAA;AAAA,2BAGQ,UAAU,KAAK,QAAQ,MAAS,CAAC;AAAA;AAAA,+BAE7B,KAAK,OAAO;AAAA,gCACX,KAAK,QAAQ;AAAA,8BACf,KAAK,YAAY;AAAA;AAAA;AAAA,IAGvC;AAAA,EACJ;AA3CW;AAAA,IADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,KADxC,aAEK;AAGA;AAAA,IADN,SAAS,EAAE,MAAM,QAAQ,SAAS,KAAK,CAAC;AAAA,KAJvC,aAKK;AAGA;AAAA,IADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,KAPxC,aAQK;AAGP;AAAA,IADC,MAAM,QAAQ;AAAA,KAVb,aAWF;AAmCJ,SAAO;AACX;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/src/CheckboxMixin.js
CHANGED
|
@@ -1,10 +1,11 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var a=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var c=(i,e,r,n)=>{for(var t=n>1?void 0:n?p(e,r):e,o=i.length-1,l;o>=0;o--)(l=i[o])&&(t=(n?l(e,r,t):l(t))||t);return n&&t&&a(e,r,t),t};import{html as u}from"@spectrum-web-components/base";import{property as h,query as s}from"@spectrum-web-components/base/src/decorators.js";import{ifDefined as d}from"@spectrum-web-components/base/src/directives.js";export function CheckboxMixin(i){class e extends i{constructor(){super(...arguments);this.checked=!1;this.readonly=!1}handleChange(){if(this.readonly){this.inputElement.checked=this.checked;return}this.checked=this.inputElement.checked;const t=new CustomEvent("change",{bubbles:!0,cancelable:!0,composed:!0});this.dispatchEvent(t)||(this.checked=!this.inputElement.checked,this.inputElement.checked=this.checked)}render(){return u`
|
|
2
2
|
<input
|
|
3
3
|
id="input"
|
|
4
4
|
name=${d(this.name||void 0)}
|
|
5
5
|
type="checkbox"
|
|
6
6
|
.checked=${this.checked}
|
|
7
|
+
?disabled=${this.readonly}
|
|
7
8
|
@change=${this.handleChange}
|
|
8
9
|
/>
|
|
9
|
-
`}}return c([
|
|
10
|
+
`}}return c([h({type:Boolean,reflect:!0})],e.prototype,"checked",2),c([h({type:String,reflect:!0})],e.prototype,"name",2),c([h({type:Boolean,reflect:!0})],e.prototype,"readonly",2),c([s("#input")],e.prototype,"inputElement",2),e}
|
|
10
11
|
//# sourceMappingURL=CheckboxMixin.js.map
|
package/src/CheckboxMixin.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["CheckboxMixin.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2023 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 { ReactiveElement } from 'lit';\nimport { html, TemplateResult } from '@spectrum-web-components/base';\nimport {\n property,\n query,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport { ifDefined } from '@spectrum-web-components/base/src/directives.js';\n\ntype Constructor<T = Record<string, unknown>> = {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n new (...args: any[]): T;\n prototype: T;\n};\n\nexport interface CheckboxElement {\n checked: boolean;\n handleChange(): void;\n inputElement: HTMLInputElement;\n name?: string;\n}\n\nexport function CheckboxMixin<T extends Constructor<ReactiveElement>>(\n constructor: T\n): T & Constructor<CheckboxElement> {\n class MixedElement extends constructor {\n @property({ type: Boolean, reflect: true })\n public checked = false;\n\n @property({ type: String, reflect: true })\n public name: string | undefined;\n\n @property({ type: Boolean, reflect: true })\n public readonly = false;\n\n @query('#input')\n inputElement!: HTMLInputElement;\n\n public handleChange(): void {\n if (this.readonly) {\n this.inputElement.checked = this.checked;\n return;\n }\n this.checked = this.inputElement.checked;\n\n const changeEvent = new CustomEvent('change', {\n bubbles: true,\n cancelable: true,\n composed: true,\n });\n const applyDefault = this.dispatchEvent(changeEvent);\n\n if (!applyDefault) {\n this.checked = !this.inputElement.checked;\n this.inputElement.checked = this.checked;\n }\n }\n\n protected render(): TemplateResult {\n return html`\n <input\n id=\"input\"\n name=${ifDefined(this.name || undefined)}\n type=\"checkbox\"\n .checked=${this.checked}\n @change=${this.handleChange}\n />\n `;\n }\n }\n return MixedElement;\n}\n"],
|
|
5
|
-
"mappings": "qNAaA,OAAS,QAAAA,MAA4B,gCACrC,OACI,YAAAC,EACA,SAAAC,MACG,kDACP,OAAS,aAAAC,MAAiB,
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2023 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 { ReactiveElement } from 'lit';\nimport { html, TemplateResult } from '@spectrum-web-components/base';\nimport {\n property,\n query,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport { ifDefined } from '@spectrum-web-components/base/src/directives.js';\n\ntype Constructor<T = Record<string, unknown>> = {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n new (...args: any[]): T;\n prototype: T;\n};\n\nexport interface CheckboxElement {\n checked: boolean;\n handleChange(): void;\n inputElement: HTMLInputElement;\n name?: string;\n readonly?: boolean;\n}\n\nexport function CheckboxMixin<T extends Constructor<ReactiveElement>>(\n constructor: T\n): T & Constructor<CheckboxElement> {\n class MixedElement extends constructor {\n @property({ type: Boolean, reflect: true })\n public checked = false;\n\n @property({ type: String, reflect: true })\n public name: string | undefined;\n\n @property({ type: Boolean, reflect: true })\n public readonly = false;\n\n @query('#input')\n inputElement!: HTMLInputElement;\n\n public handleChange(): void {\n if (this.readonly) {\n this.inputElement.checked = this.checked;\n return;\n }\n this.checked = this.inputElement.checked;\n\n const changeEvent = new CustomEvent('change', {\n bubbles: true,\n cancelable: true,\n composed: true,\n });\n const applyDefault = this.dispatchEvent(changeEvent);\n\n if (!applyDefault) {\n this.checked = !this.inputElement.checked;\n this.inputElement.checked = this.checked;\n }\n }\n\n protected render(): TemplateResult {\n return html`\n <input\n id=\"input\"\n name=${ifDefined(this.name || undefined)}\n type=\"checkbox\"\n .checked=${this.checked}\n ?disabled=${this.readonly}\n @change=${this.handleChange}\n />\n `;\n }\n }\n return MixedElement;\n}\n"],
|
|
5
|
+
"mappings": "qNAaA,OAAS,QAAAA,MAA4B,gCACrC,OACI,YAAAC,EACA,SAAAC,MACG,kDACP,OAAS,aAAAC,MAAiB,kDAgBnB,gBAAS,cACZC,EACgC,CAChC,MAAMC,UAAqBD,CAAY,CAAvC,kCAEI,KAAO,QAAU,GAMjB,KAAO,SAAW,GAKX,cAAqB,CACxB,GAAI,KAAK,SAAU,CACf,KAAK,aAAa,QAAU,KAAK,QACjC,MACJ,CACA,KAAK,QAAU,KAAK,aAAa,QAEjC,MAAME,EAAc,IAAI,YAAY,SAAU,CAC1C,QAAS,GACT,WAAY,GACZ,SAAU,EACd,CAAC,EACoB,KAAK,cAAcA,CAAW,IAG/C,KAAK,QAAU,CAAC,KAAK,aAAa,QAClC,KAAK,aAAa,QAAU,KAAK,QAEzC,CAEU,QAAyB,CAC/B,OAAON;AAAA;AAAA;AAAA,2BAGQG,EAAU,KAAK,MAAQ,MAAS,CAAC;AAAA;AAAA,+BAE7B,KAAK,OAAO;AAAA,gCACX,KAAK,QAAQ;AAAA,8BACf,KAAK,YAAY;AAAA;AAAA,aAGvC,CACJ,CA3CW,OAAAI,EAAA,CADNN,EAAS,CAAE,KAAM,QAAS,QAAS,EAAK,CAAC,GADxCI,EAEK,uBAGAE,EAAA,CADNN,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,GAJvCI,EAKK,oBAGAE,EAAA,CADNN,EAAS,CAAE,KAAM,QAAS,QAAS,EAAK,CAAC,GAPxCI,EAQK,wBAGPE,EAAA,CADCL,EAAM,QAAQ,GAVbG,EAWF,4BAmCGA,CACX",
|
|
6
6
|
"names": ["html", "property", "query", "ifDefined", "constructor", "MixedElement", "changeEvent", "__decorateClass"]
|
|
7
7
|
}
|
package/src/checkbox.css.dev.js
CHANGED
|
@@ -270,7 +270,9 @@ var(--spectrum-checkbox-control-size)
|
|
|
270
270
|
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
271
271
|
);box-sizing:border-box;display:flex;flex-grow:0;flex-shrink:0;inline-size:var(
|
|
272
272
|
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
273
|
-
);justify-content:center;margin:calc(var(--mod-checkbox-spacing, var(--spectrum-checkbox-spacing))/2) 0;position:relative}#box:before{
|
|
273
|
+
);justify-content:center;margin:calc(var(--mod-checkbox-spacing, var(--spectrum-checkbox-spacing))/2) 0;position:relative}#box:before{block-size:var(
|
|
274
|
+
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
275
|
+
);border-color:var(
|
|
274
276
|
--highcontrast-checkbox-color-default,var(
|
|
275
277
|
--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)
|
|
276
278
|
)
|
|
@@ -278,21 +280,19 @@ var(--spectrum-checkbox-control-size)
|
|
|
278
280
|
--mod-checkbox-control-corner-radius,var(--spectrum-checkbox-control-corner-radius)
|
|
279
281
|
);border-style:solid;border-width:var(
|
|
280
282
|
--mod-checkbox-border-width,var(--spectrum-checkbox-border-width)
|
|
281
|
-
);box-sizing:border-box;content:"";display:block;forced-color-adjust:none;
|
|
283
|
+
);box-sizing:border-box;content:"";display:block;forced-color-adjust:none;inline-size:var(
|
|
282
284
|
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
283
285
|
);position:absolute;transition:border var(
|
|
284
286
|
--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)
|
|
285
287
|
) ease-in-out,box-shadow var(
|
|
286
288
|
--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)
|
|
287
|
-
) ease-in-out;
|
|
288
|
-
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
289
|
-
);z-index:0}#box:after{border-radius:calc(var(
|
|
289
|
+
) ease-in-out;z-index:0}#box:after{border-radius:calc(var(
|
|
290
290
|
--mod-checkbox-control-corner-radius,
|
|
291
291
|
var(--spectrum-checkbox-control-corner-radius)
|
|
292
292
|
) + var(
|
|
293
293
|
--mod-checkbox-focus-indicator-gap,
|
|
294
294
|
var(--spectrum-checkbox-focus-indicator-gap)
|
|
295
|
-
));content:"";display:block;inset:0;margin:var(
|
|
295
|
+
));content:"";display:block;inset-block:0;inset-inline:0;margin:var(
|
|
296
296
|
--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)
|
|
297
297
|
);position:absolute;transform:translate(0);transition:box-shadow var(
|
|
298
298
|
--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["checkbox.css.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2023 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-checkbox-content-color-default:var(\n--spectrum-neutral-content-color-default\n);--spectrum-checkbox-content-color-hover:var(\n--spectrum-neutral-content-color-hover\n);--spectrum-checkbox-content-color-down:var(\n--spectrum-neutral-content-color-down\n);--spectrum-checkbox-content-color-focus:var(\n--spectrum-neutral-content-color-key-focus\n);--spectrum-checkbox-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n);--spectrum-checkbox-content-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-checkbox-control-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-checkbox-checkmark-color:var(--spectrum-gray-75);--spectrum-checkbox-invalid-color-default:var(\n--spectrum-negative-color-900\n);--spectrum-checkbox-invalid-color-hover:var(\n--spectrum-negative-color-1000\n);--spectrum-checkbox-invalid-color-down:var(--spectrum-negative-color-1100);--spectrum-checkbox-invalid-color-focus:var(\n--spectrum-negative-color-1000\n);--spectrum-checkbox-emphasized-color-default:var(\n--spectrum-accent-color-900\n);--spectrum-checkbox-emphasized-color-hover:var(\n--spectrum-accent-color-1000\n);--spectrum-checkbox-emphasized-color-down:var(\n--spectrum-accent-color-1100\n);--spectrum-checkbox-emphasized-color-focus:var(\n--spectrum-accent-color-1000\n);--spectrum-checkbox-control-selected-color-default:var(\n--spectrum-neutral-background-color-selected-default\n);--spectrum-checkbox-control-selected-color-hover:var(\n--spectrum-neutral-background-color-selected-hover\n);--spectrum-checkbox-control-selected-color-down:var(\n--spectrum-neutral-background-color-selected-down\n);--spectrum-checkbox-control-selected-color-focus:var(\n--spectrum-neutral-background-color-selected-key-focus\n);--spectrum-checkbox-line-height:var(--spectrum-line-height-100);--spectrum-checkbox-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-checkbox-control-corner-radius:var(--spectrum-corner-radius-75);--spectrum-checkbox-focus-indicator-gap:var(\n--spectrum-focus-indicator-gap\n);--spectrum-checkbox-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-checkbox-border-width:var(--spectrum-border-width-200);--spectrum-checkbox-selected-border-width:calc(var(--spectrum-checkbox-control-size)/2);--spectrum-checkbox-animation-duration:var(\n--spectrum-animation-duration-100\n)}:host([size=s]){--spectrum-checkbox-font-size:var(--spectrum-font-size-75);--spectrum-checkbox-height:var(--spectrum-component-height-75);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-small\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-75);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-75)}:host{--spectrum-checkbox-font-size:var(--spectrum-font-size-100);--spectrum-checkbox-height:var(--spectrum-component-height-100);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-medium\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-100)}:host([size=l]){--spectrum-checkbox-font-size:var(--spectrum-font-size-200);--spectrum-checkbox-height:var(--spectrum-component-height-200);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-large\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-200);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-200)}:host([size=xl]){--spectrum-checkbox-font-size:var(--spectrum-font-size-300);--spectrum-checkbox-height:var(--spectrum-component-height-300);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-extra-large\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-300);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-300)}:host{align-items:flex-start;color:var(\n--highcontrast-checkbox-content-color-default,var(\n--mod-checkbox-content-color-default,var(--spectrum-checkbox-content-color-default)\n)\n);max-inline-size:100%;min-block-size:var(--mod-checkbox-height,var(--spectrum-checkbox-height));position:relative}:host(:hover) #box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-color-hover,var(--spectrum-checkbox-control-color-hover)\n)\n)}:host(:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-selected-color-hover,var(--spectrum-checkbox-control-selected-color-hover)\n)\n)}:host(:hover) #label{color:var(\n--highcontrast-checkbox-content-color-hover,var(\n--mod-checkbox-content-color-hover,var(--spectrum-checkbox-content-color-hover)\n)\n)}:host:active #box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-down,var(\n--mod-checkbox-control-color-down,var(--spectrum-checkbox-control-color-down)\n)\n)}:host:active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-down,var(\n--mod-checkbox-control-selected-color-down,var(--spectrum-checkbox-control-selected-color-down)\n)\n)}:host:active #label{color:var(\n--highcontrast-checkbox-content-color-down,var(\n--mod-checkbox-content-color-down,var(--spectrum-checkbox-content-color-down)\n)\n)}:host([invalid][invalid]) #box:before,:host([invalid][invalid]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-default,var(--spectrum-checkbox-invalid-color-default)\n)\n)}:host([invalid][invalid]) #input.focus-visible+#box:before,:host([invalid][invalid][indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid]) #input:focus-visible+#box:before,:host([invalid][invalid][indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid]:hover) #box:before,:host([invalid][invalid]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([readonly]){border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]:hover) #box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]):active #box:before{border-color:var(\n--highcontrast-checkbox-selected-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]) #input:checked:disabled+#box:before,:host([readonly]) #input:disabled+#box:before{background-color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]) #input:checked:disabled~#label,:host([readonly]) #input:disabled~#label{color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-content-color-default,var(--spectrum-checkbox-content-color-default)\n)\n);forced-color-adjust:none}:host([indeterminate]) #box:before,:host([indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}:host([indeterminate]) #box #checkmark,:host([indeterminate]) #input:checked+#box #checkmark{display:none}:host([indeterminate]) #box #partialCheckmark,:host([indeterminate]) #input:checked+#box #partialCheckmark{display:block;opacity:1;transform:scale(1)}:host([indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}:host([indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}:host([indeterminate]:hover) #box:before,:host([indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-selected-color-hover,var(--spectrum-checkbox-control-selected-color-hover)\n)\n)}:host([invalid][invalid][indeterminate]) #box:before,:host([invalid][invalid][indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-default,var(--spectrum-checkbox-invalid-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}:host([invalid][invalid][indeterminate]:hover) #box:before,:host([invalid][invalid][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid][indeterminate]:hover) #label{color:var(\n--highcontrast-checkbox-content-color-hover,var(\n--mod-checkbox-content-color-hover,var(--spectrum-checkbox-content-color-hover)\n)\n)}:host([emphasized]) #input:checked+#box:before,:host([emphasized][indeterminate]) #box:before,:host([emphasized][indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-emphasized-color-default,var(--spectrum-checkbox-emphasized-color-default)\n)\n)}:host([emphasized]:hover) #input:checked+#box:before,:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-emphasized-color-hover,var(--spectrum-checkbox-emphasized-color-hover)\n)\n)}:host([emphasized]) #input.focus-visible:checked+#box:before,:host([emphasized][indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-emphasized-color-focus,var(--spectrum-checkbox-emphasized-color-focus)\n)\n)}:host([emphasized]) #input:focus-visible:checked+#box:before,:host([emphasized][indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-emphasized-color-focus,var(--spectrum-checkbox-emphasized-color-focus)\n)\n)}:host([emphasized][invalid][invalid]) #input.focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-focus,var(--spectrum-checkbox-invalid-color-focus)\n)\n)}:host([emphasized][invalid][invalid]) #input:focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-focus,var(--spectrum-checkbox-invalid-color-focus)\n)\n)}:host([emphasized][invalid][invalid]:hover) #input:checked+#box:before,:host([emphasized][invalid][invalid][indeterminate]:hover) #box:before,:host([emphasized][invalid][invalid][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([emphasized]:hover) #input:checked+#box:before,:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-emphasized-color-hover,var(--spectrum-checkbox-emphasized-color-hover)\n)\n)}:host([emphasized]):active #input:checked+#box:before,:host([emphasized][indeterminate]):active #box:before,:host([emphasized][indeterminate]):active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-emphasized-color-down,var(--spectrum-checkbox-emphasized-color-down)\n)\n)}:host([emphasized][invalid][invalid]):active #box:before,:host([emphasized][invalid][invalid]):active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-invalid-color-down,var(--spectrum-checkbox-invalid-color-down)\n)\n)}:host([emphasized].focus-visible) #box:before,:host([emphasized].focus-visible) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}:host([emphasized]:focus-visible) #box:before,:host([emphasized]:focus-visible) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#label{font-size:var(\n--mod-checkbox-font-size,var(--spectrum-checkbox-font-size)\n);line-height:var(\n--mod-checkbox-line-height,var(--spectrum-checkbox-line-height)\n);margin-block-start:var(\n--mod-checkbox-top-to-text,var(--spectrum-checkbox-top-to-text)\n);margin-inline-start:var(\n--mod-checkbox-text-to-control,var(--spectrum-checkbox-text-to-control)\n);text-align:start;transition:color var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out}#label:lang(ja),#label:lang(ko),#label:lang(zh){line-height:var(\n--mod-checkbox-line-height-cjk,var(--spectrum-checkbox-line-height-cjk)\n)}#input{block-size:100%;box-sizing:border-box;color:var(\n--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)\n);cursor:pointer;font-family:inherit;font-size:100%;inline-size:100%;line-height:1.15;margin:0;opacity:.0001;overflow:visible;padding:0;position:absolute;z-index:1}#input:disabled{cursor:default}#input:checked+#box:before{background-color:var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n);border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}#input:checked+#box #checkmark{opacity:1;transform:scale(1)}#input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#input.focus-visible+#box:after{box-shadow:0 0 0 var(\n--mod-checkbox-focus-indicator-thinkness,var(--spectrum-checkbox-focus-indicator-thickness)\n) var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);forced-color-adjust:none;margin:calc(var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n)*-1)}#input:focus-visible+#box:after{box-shadow:0 0 0 var(\n--mod-checkbox-focus-indicator-thinkness,var(--spectrum-checkbox-focus-indicator-thickness)\n) var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);forced-color-adjust:none;margin:calc(var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n)*-1)}#input.focus-visible+#label{color:var(\n--highcontrast-checkbox-content-color-focus,var(\n--mod-checkbox-content-color-focus,var(--spectrum-checkbox-content-color-focus)\n)\n)}#input:focus-visible+#label{color:var(\n--highcontrast-checkbox-content-color-focus,var(\n--mod-checkbox-content-color-focus,var(--spectrum-checkbox-content-color-focus)\n)\n)}#input.focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}#input:focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}#box{--spectrum-checkbox-spacing:calc(var(--mod-checkbox-height, var(--spectrum-checkbox-height)) - var(\n--mod-checkbox-control-size,\nvar(--spectrum-checkbox-control-size)\n));align-items:center;block-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);box-sizing:border-box;display:flex;flex-grow:0;flex-shrink:0;inline-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);justify-content:center;margin:calc(var(--mod-checkbox-spacing, var(--spectrum-checkbox-spacing))/2) 0;position:relative}#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)\n)\n);border-radius:var(\n--mod-checkbox-control-corner-radius,var(--spectrum-checkbox-control-corner-radius)\n);border-style:solid;border-width:var(\n--mod-checkbox-border-width,var(--spectrum-checkbox-border-width)\n);box-sizing:border-box;content:\"\";display:block;forced-color-adjust:none;height:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);position:absolute;transition:border var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out,box-shadow var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out;width:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);z-index:0}#box:after{border-radius:calc(var(\n--mod-checkbox-control-corner-radius,\nvar(--spectrum-checkbox-control-corner-radius)\n) + var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n));content:\"\";display:block;inset:0;margin:var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n);position:absolute;transform:translate(0);transition:box-shadow var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-out,margin var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-out}#checkmark,#partialCheckmark{color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mode-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);opacity:0;transform:scale(0);transition:opacity var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out,transform var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out}#partialCheckmark{display:none}#input:checked:disabled+#box:before,#input:disabled+#box:before{background-color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);border-color:var(\n--highcontrast-checkbox-disabled-color-default,var(\n--mod-checkbox-control-color-disabled,var(--spectrum-checkbox-control-color-disabled)\n)\n)}#input:checked:disabled~#label,#input:disabled~#label{color:var(\n--highcontrast-checkbox-disabled-color-default,var(\n--mod-checkbox-content-color-disabled,var(--spectrum-checkbox-content-color-disabled)\n)\n);forced-color-adjust:none}@media (forced-colors:active){#input.focus-visible+#box{forced-color-adjust:none;outline-color:var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);outline-offset:var(\n--highcontrast-checkbox-focus-indicator-gap,var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n)\n);outline-style:auto;outline-width:var(\n--mod-focus-indicator-thickness,var(--spectrum-focus-indicator-thickness)\n)}#input:focus-visible+#box{forced-color-adjust:none;outline-color:var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);outline-offset:var(\n--highcontrast-checkbox-focus-indicator-gap,var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n)\n);outline-style:auto;outline-width:var(\n--mod-focus-indicator-thickness,var(--spectrum-focus-indicator-thickness)\n)}#input.focus-visible+#box:after{box-shadow:0 0 0 0 var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n)}#input:focus-visible+#box:after{box-shadow:0 0 0 0 var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n)}:host{--highcontrast-checkbox-content-color-default:CanvasText;--highcontrast-checkbox-content-color-hover:CanvasText;--highcontrast-checkbox-content-color-down:CanvasText;--highcontrast-checkbox-content-color-focus:CanvasText;--highcontrast-checkbox-background-color-default:Canvas;--highcontrast-checkbox-color-default:ButtonText;--highcontrast-checkbox-color-hover:ButtonText;--highcontrast-checkbox-color-focus:Highlight;--highcontrast-checkbox-highlight-color-default:Highlight;--highcontrast-checkbox-highlight-color-hover:Highlight;--highcontrast-checkbox-highlight-color-down:Highlight;--highcontrast-checkbox-highlight-color-focus:Highlight;--highcontrast-checkbox-disabled-color-default:GrayText;--highcontrast-checkbox-focus-indicator-color:CanvasText}}:host{--spectrum-checkbox-control-color-default:var(\n--system-spectrum-checkbox-control-color-default\n);--spectrum-checkbox-control-color-hover:var(\n--system-spectrum-checkbox-control-color-hover\n);--spectrum-checkbox-control-color-down:var(\n--system-spectrum-checkbox-control-color-down\n);--spectrum-checkbox-control-color-focus:var(\n--system-spectrum-checkbox-control-color-focus\n)}:host{display:inline-flex;vertical-align:top}:host(:focus){outline:none}:host([disabled]){pointer-events:none}:host(:empty) label{display:none}\n`;\nexport default styles;"],
|
|
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-checkbox-content-color-default:var(\n--spectrum-neutral-content-color-default\n);--spectrum-checkbox-content-color-hover:var(\n--spectrum-neutral-content-color-hover\n);--spectrum-checkbox-content-color-down:var(\n--spectrum-neutral-content-color-down\n);--spectrum-checkbox-content-color-focus:var(\n--spectrum-neutral-content-color-key-focus\n);--spectrum-checkbox-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n);--spectrum-checkbox-content-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-checkbox-control-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-checkbox-checkmark-color:var(--spectrum-gray-75);--spectrum-checkbox-invalid-color-default:var(\n--spectrum-negative-color-900\n);--spectrum-checkbox-invalid-color-hover:var(\n--spectrum-negative-color-1000\n);--spectrum-checkbox-invalid-color-down:var(--spectrum-negative-color-1100);--spectrum-checkbox-invalid-color-focus:var(\n--spectrum-negative-color-1000\n);--spectrum-checkbox-emphasized-color-default:var(\n--spectrum-accent-color-900\n);--spectrum-checkbox-emphasized-color-hover:var(\n--spectrum-accent-color-1000\n);--spectrum-checkbox-emphasized-color-down:var(\n--spectrum-accent-color-1100\n);--spectrum-checkbox-emphasized-color-focus:var(\n--spectrum-accent-color-1000\n);--spectrum-checkbox-control-selected-color-default:var(\n--spectrum-neutral-background-color-selected-default\n);--spectrum-checkbox-control-selected-color-hover:var(\n--spectrum-neutral-background-color-selected-hover\n);--spectrum-checkbox-control-selected-color-down:var(\n--spectrum-neutral-background-color-selected-down\n);--spectrum-checkbox-control-selected-color-focus:var(\n--spectrum-neutral-background-color-selected-key-focus\n);--spectrum-checkbox-line-height:var(--spectrum-line-height-100);--spectrum-checkbox-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-checkbox-control-corner-radius:var(--spectrum-corner-radius-75);--spectrum-checkbox-focus-indicator-gap:var(\n--spectrum-focus-indicator-gap\n);--spectrum-checkbox-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-checkbox-border-width:var(--spectrum-border-width-200);--spectrum-checkbox-selected-border-width:calc(var(--spectrum-checkbox-control-size)/2);--spectrum-checkbox-animation-duration:var(\n--spectrum-animation-duration-100\n)}:host([size=s]){--spectrum-checkbox-font-size:var(--spectrum-font-size-75);--spectrum-checkbox-height:var(--spectrum-component-height-75);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-small\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-75);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-75)}:host{--spectrum-checkbox-font-size:var(--spectrum-font-size-100);--spectrum-checkbox-height:var(--spectrum-component-height-100);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-medium\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-100)}:host([size=l]){--spectrum-checkbox-font-size:var(--spectrum-font-size-200);--spectrum-checkbox-height:var(--spectrum-component-height-200);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-large\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-200);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-200)}:host([size=xl]){--spectrum-checkbox-font-size:var(--spectrum-font-size-300);--spectrum-checkbox-height:var(--spectrum-component-height-300);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-extra-large\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-300);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-300)}:host{align-items:flex-start;color:var(\n--highcontrast-checkbox-content-color-default,var(\n--mod-checkbox-content-color-default,var(--spectrum-checkbox-content-color-default)\n)\n);max-inline-size:100%;min-block-size:var(--mod-checkbox-height,var(--spectrum-checkbox-height));position:relative}:host(:hover) #box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-color-hover,var(--spectrum-checkbox-control-color-hover)\n)\n)}:host(:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-selected-color-hover,var(--spectrum-checkbox-control-selected-color-hover)\n)\n)}:host(:hover) #label{color:var(\n--highcontrast-checkbox-content-color-hover,var(\n--mod-checkbox-content-color-hover,var(--spectrum-checkbox-content-color-hover)\n)\n)}:host:active #box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-down,var(\n--mod-checkbox-control-color-down,var(--spectrum-checkbox-control-color-down)\n)\n)}:host:active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-down,var(\n--mod-checkbox-control-selected-color-down,var(--spectrum-checkbox-control-selected-color-down)\n)\n)}:host:active #label{color:var(\n--highcontrast-checkbox-content-color-down,var(\n--mod-checkbox-content-color-down,var(--spectrum-checkbox-content-color-down)\n)\n)}:host([invalid][invalid]) #box:before,:host([invalid][invalid]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-default,var(--spectrum-checkbox-invalid-color-default)\n)\n)}:host([invalid][invalid]) #input.focus-visible+#box:before,:host([invalid][invalid][indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid]) #input:focus-visible+#box:before,:host([invalid][invalid][indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid]:hover) #box:before,:host([invalid][invalid]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([readonly]){border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]:hover) #box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]):active #box:before{border-color:var(\n--highcontrast-checkbox-selected-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]) #input:checked:disabled+#box:before,:host([readonly]) #input:disabled+#box:before{background-color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]) #input:checked:disabled~#label,:host([readonly]) #input:disabled~#label{color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-content-color-default,var(--spectrum-checkbox-content-color-default)\n)\n);forced-color-adjust:none}:host([indeterminate]) #box:before,:host([indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}:host([indeterminate]) #box #checkmark,:host([indeterminate]) #input:checked+#box #checkmark{display:none}:host([indeterminate]) #box #partialCheckmark,:host([indeterminate]) #input:checked+#box #partialCheckmark{display:block;opacity:1;transform:scale(1)}:host([indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}:host([indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}:host([indeterminate]:hover) #box:before,:host([indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-selected-color-hover,var(--spectrum-checkbox-control-selected-color-hover)\n)\n)}:host([invalid][invalid][indeterminate]) #box:before,:host([invalid][invalid][indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-default,var(--spectrum-checkbox-invalid-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}:host([invalid][invalid][indeterminate]:hover) #box:before,:host([invalid][invalid][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid][indeterminate]:hover) #label{color:var(\n--highcontrast-checkbox-content-color-hover,var(\n--mod-checkbox-content-color-hover,var(--spectrum-checkbox-content-color-hover)\n)\n)}:host([emphasized]) #input:checked+#box:before,:host([emphasized][indeterminate]) #box:before,:host([emphasized][indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-emphasized-color-default,var(--spectrum-checkbox-emphasized-color-default)\n)\n)}:host([emphasized]:hover) #input:checked+#box:before,:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-emphasized-color-hover,var(--spectrum-checkbox-emphasized-color-hover)\n)\n)}:host([emphasized]) #input.focus-visible:checked+#box:before,:host([emphasized][indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-emphasized-color-focus,var(--spectrum-checkbox-emphasized-color-focus)\n)\n)}:host([emphasized]) #input:focus-visible:checked+#box:before,:host([emphasized][indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-emphasized-color-focus,var(--spectrum-checkbox-emphasized-color-focus)\n)\n)}:host([emphasized][invalid][invalid]) #input.focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-focus,var(--spectrum-checkbox-invalid-color-focus)\n)\n)}:host([emphasized][invalid][invalid]) #input:focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-focus,var(--spectrum-checkbox-invalid-color-focus)\n)\n)}:host([emphasized][invalid][invalid]:hover) #input:checked+#box:before,:host([emphasized][invalid][invalid][indeterminate]:hover) #box:before,:host([emphasized][invalid][invalid][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([emphasized]:hover) #input:checked+#box:before,:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-emphasized-color-hover,var(--spectrum-checkbox-emphasized-color-hover)\n)\n)}:host([emphasized]):active #input:checked+#box:before,:host([emphasized][indeterminate]):active #box:before,:host([emphasized][indeterminate]):active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-emphasized-color-down,var(--spectrum-checkbox-emphasized-color-down)\n)\n)}:host([emphasized][invalid][invalid]):active #box:before,:host([emphasized][invalid][invalid]):active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-invalid-color-down,var(--spectrum-checkbox-invalid-color-down)\n)\n)}:host([emphasized].focus-visible) #box:before,:host([emphasized].focus-visible) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}:host([emphasized]:focus-visible) #box:before,:host([emphasized]:focus-visible) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#label{font-size:var(\n--mod-checkbox-font-size,var(--spectrum-checkbox-font-size)\n);line-height:var(\n--mod-checkbox-line-height,var(--spectrum-checkbox-line-height)\n);margin-block-start:var(\n--mod-checkbox-top-to-text,var(--spectrum-checkbox-top-to-text)\n);margin-inline-start:var(\n--mod-checkbox-text-to-control,var(--spectrum-checkbox-text-to-control)\n);text-align:start;transition:color var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out}#label:lang(ja),#label:lang(ko),#label:lang(zh){line-height:var(\n--mod-checkbox-line-height-cjk,var(--spectrum-checkbox-line-height-cjk)\n)}#input{block-size:100%;box-sizing:border-box;color:var(\n--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)\n);cursor:pointer;font-family:inherit;font-size:100%;inline-size:100%;line-height:1.15;margin:0;opacity:.0001;overflow:visible;padding:0;position:absolute;z-index:1}#input:disabled{cursor:default}#input:checked+#box:before{background-color:var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n);border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}#input:checked+#box #checkmark{opacity:1;transform:scale(1)}#input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#input.focus-visible+#box:after{box-shadow:0 0 0 var(\n--mod-checkbox-focus-indicator-thinkness,var(--spectrum-checkbox-focus-indicator-thickness)\n) var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);forced-color-adjust:none;margin:calc(var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n)*-1)}#input:focus-visible+#box:after{box-shadow:0 0 0 var(\n--mod-checkbox-focus-indicator-thinkness,var(--spectrum-checkbox-focus-indicator-thickness)\n) var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);forced-color-adjust:none;margin:calc(var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n)*-1)}#input.focus-visible+#label{color:var(\n--highcontrast-checkbox-content-color-focus,var(\n--mod-checkbox-content-color-focus,var(--spectrum-checkbox-content-color-focus)\n)\n)}#input:focus-visible+#label{color:var(\n--highcontrast-checkbox-content-color-focus,var(\n--mod-checkbox-content-color-focus,var(--spectrum-checkbox-content-color-focus)\n)\n)}#input.focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}#input:focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}#box{--spectrum-checkbox-spacing:calc(var(--mod-checkbox-height, var(--spectrum-checkbox-height)) - var(\n--mod-checkbox-control-size,\nvar(--spectrum-checkbox-control-size)\n));align-items:center;block-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);box-sizing:border-box;display:flex;flex-grow:0;flex-shrink:0;inline-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);justify-content:center;margin:calc(var(--mod-checkbox-spacing, var(--spectrum-checkbox-spacing))/2) 0;position:relative}#box:before{block-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)\n)\n);border-radius:var(\n--mod-checkbox-control-corner-radius,var(--spectrum-checkbox-control-corner-radius)\n);border-style:solid;border-width:var(\n--mod-checkbox-border-width,var(--spectrum-checkbox-border-width)\n);box-sizing:border-box;content:\"\";display:block;forced-color-adjust:none;inline-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);position:absolute;transition:border var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out,box-shadow var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out;z-index:0}#box:after{border-radius:calc(var(\n--mod-checkbox-control-corner-radius,\nvar(--spectrum-checkbox-control-corner-radius)\n) + var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n));content:\"\";display:block;inset-block:0;inset-inline:0;margin:var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n);position:absolute;transform:translate(0);transition:box-shadow var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-out,margin var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-out}#checkmark,#partialCheckmark{color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mode-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);opacity:0;transform:scale(0);transition:opacity var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out,transform var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out}#partialCheckmark{display:none}#input:checked:disabled+#box:before,#input:disabled+#box:before{background-color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);border-color:var(\n--highcontrast-checkbox-disabled-color-default,var(\n--mod-checkbox-control-color-disabled,var(--spectrum-checkbox-control-color-disabled)\n)\n)}#input:checked:disabled~#label,#input:disabled~#label{color:var(\n--highcontrast-checkbox-disabled-color-default,var(\n--mod-checkbox-content-color-disabled,var(--spectrum-checkbox-content-color-disabled)\n)\n);forced-color-adjust:none}@media (forced-colors:active){#input.focus-visible+#box{forced-color-adjust:none;outline-color:var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);outline-offset:var(\n--highcontrast-checkbox-focus-indicator-gap,var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n)\n);outline-style:auto;outline-width:var(\n--mod-focus-indicator-thickness,var(--spectrum-focus-indicator-thickness)\n)}#input:focus-visible+#box{forced-color-adjust:none;outline-color:var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);outline-offset:var(\n--highcontrast-checkbox-focus-indicator-gap,var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n)\n);outline-style:auto;outline-width:var(\n--mod-focus-indicator-thickness,var(--spectrum-focus-indicator-thickness)\n)}#input.focus-visible+#box:after{box-shadow:0 0 0 0 var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n)}#input:focus-visible+#box:after{box-shadow:0 0 0 0 var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n)}:host{--highcontrast-checkbox-content-color-default:CanvasText;--highcontrast-checkbox-content-color-hover:CanvasText;--highcontrast-checkbox-content-color-down:CanvasText;--highcontrast-checkbox-content-color-focus:CanvasText;--highcontrast-checkbox-background-color-default:Canvas;--highcontrast-checkbox-color-default:ButtonText;--highcontrast-checkbox-color-hover:ButtonText;--highcontrast-checkbox-color-focus:Highlight;--highcontrast-checkbox-highlight-color-default:Highlight;--highcontrast-checkbox-highlight-color-hover:Highlight;--highcontrast-checkbox-highlight-color-down:Highlight;--highcontrast-checkbox-highlight-color-focus:Highlight;--highcontrast-checkbox-disabled-color-default:GrayText;--highcontrast-checkbox-focus-indicator-color:CanvasText}}:host{--spectrum-checkbox-control-color-default:var(\n--system-spectrum-checkbox-control-color-default\n);--spectrum-checkbox-control-color-hover:var(\n--system-spectrum-checkbox-control-color-hover\n);--spectrum-checkbox-control-color-down:var(\n--system-spectrum-checkbox-control-color-down\n);--spectrum-checkbox-control-color-focus:var(\n--system-spectrum-checkbox-control-color-focus\n)}:host{display:inline-flex;vertical-align:top}:host(:focus){outline:none}:host([disabled]){pointer-events:none}:host(:empty) label{display:none}\n`;\nexport default styles;"],
|
|
5
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;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;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;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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoWf,eAAe;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/src/checkbox.css.js
CHANGED
|
@@ -268,7 +268,9 @@ var(--spectrum-checkbox-control-size)
|
|
|
268
268
|
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
269
269
|
);box-sizing:border-box;display:flex;flex-grow:0;flex-shrink:0;inline-size:var(
|
|
270
270
|
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
271
|
-
);justify-content:center;margin:calc(var(--mod-checkbox-spacing, var(--spectrum-checkbox-spacing))/2) 0;position:relative}#box:before{
|
|
271
|
+
);justify-content:center;margin:calc(var(--mod-checkbox-spacing, var(--spectrum-checkbox-spacing))/2) 0;position:relative}#box:before{block-size:var(
|
|
272
|
+
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
273
|
+
);border-color:var(
|
|
272
274
|
--highcontrast-checkbox-color-default,var(
|
|
273
275
|
--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)
|
|
274
276
|
)
|
|
@@ -276,21 +278,19 @@ var(--spectrum-checkbox-control-size)
|
|
|
276
278
|
--mod-checkbox-control-corner-radius,var(--spectrum-checkbox-control-corner-radius)
|
|
277
279
|
);border-style:solid;border-width:var(
|
|
278
280
|
--mod-checkbox-border-width,var(--spectrum-checkbox-border-width)
|
|
279
|
-
);box-sizing:border-box;content:"";display:block;forced-color-adjust:none;
|
|
281
|
+
);box-sizing:border-box;content:"";display:block;forced-color-adjust:none;inline-size:var(
|
|
280
282
|
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
281
283
|
);position:absolute;transition:border var(
|
|
282
284
|
--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)
|
|
283
285
|
) ease-in-out,box-shadow var(
|
|
284
286
|
--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)
|
|
285
|
-
) ease-in-out;
|
|
286
|
-
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
287
|
-
);z-index:0}#box:after{border-radius:calc(var(
|
|
287
|
+
) ease-in-out;z-index:0}#box:after{border-radius:calc(var(
|
|
288
288
|
--mod-checkbox-control-corner-radius,
|
|
289
289
|
var(--spectrum-checkbox-control-corner-radius)
|
|
290
290
|
) + var(
|
|
291
291
|
--mod-checkbox-focus-indicator-gap,
|
|
292
292
|
var(--spectrum-checkbox-focus-indicator-gap)
|
|
293
|
-
));content:"";display:block;inset:0;margin:var(
|
|
293
|
+
));content:"";display:block;inset-block:0;inset-inline:0;margin:var(
|
|
294
294
|
--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)
|
|
295
295
|
);position:absolute;transform:translate(0);transition:box-shadow var(
|
|
296
296
|
--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)
|
package/src/checkbox.css.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["checkbox.css.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2023 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-checkbox-content-color-default:var(\n--spectrum-neutral-content-color-default\n);--spectrum-checkbox-content-color-hover:var(\n--spectrum-neutral-content-color-hover\n);--spectrum-checkbox-content-color-down:var(\n--spectrum-neutral-content-color-down\n);--spectrum-checkbox-content-color-focus:var(\n--spectrum-neutral-content-color-key-focus\n);--spectrum-checkbox-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n);--spectrum-checkbox-content-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-checkbox-control-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-checkbox-checkmark-color:var(--spectrum-gray-75);--spectrum-checkbox-invalid-color-default:var(\n--spectrum-negative-color-900\n);--spectrum-checkbox-invalid-color-hover:var(\n--spectrum-negative-color-1000\n);--spectrum-checkbox-invalid-color-down:var(--spectrum-negative-color-1100);--spectrum-checkbox-invalid-color-focus:var(\n--spectrum-negative-color-1000\n);--spectrum-checkbox-emphasized-color-default:var(\n--spectrum-accent-color-900\n);--spectrum-checkbox-emphasized-color-hover:var(\n--spectrum-accent-color-1000\n);--spectrum-checkbox-emphasized-color-down:var(\n--spectrum-accent-color-1100\n);--spectrum-checkbox-emphasized-color-focus:var(\n--spectrum-accent-color-1000\n);--spectrum-checkbox-control-selected-color-default:var(\n--spectrum-neutral-background-color-selected-default\n);--spectrum-checkbox-control-selected-color-hover:var(\n--spectrum-neutral-background-color-selected-hover\n);--spectrum-checkbox-control-selected-color-down:var(\n--spectrum-neutral-background-color-selected-down\n);--spectrum-checkbox-control-selected-color-focus:var(\n--spectrum-neutral-background-color-selected-key-focus\n);--spectrum-checkbox-line-height:var(--spectrum-line-height-100);--spectrum-checkbox-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-checkbox-control-corner-radius:var(--spectrum-corner-radius-75);--spectrum-checkbox-focus-indicator-gap:var(\n--spectrum-focus-indicator-gap\n);--spectrum-checkbox-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-checkbox-border-width:var(--spectrum-border-width-200);--spectrum-checkbox-selected-border-width:calc(var(--spectrum-checkbox-control-size)/2);--spectrum-checkbox-animation-duration:var(\n--spectrum-animation-duration-100\n)}:host([size=s]){--spectrum-checkbox-font-size:var(--spectrum-font-size-75);--spectrum-checkbox-height:var(--spectrum-component-height-75);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-small\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-75);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-75)}:host{--spectrum-checkbox-font-size:var(--spectrum-font-size-100);--spectrum-checkbox-height:var(--spectrum-component-height-100);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-medium\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-100)}:host([size=l]){--spectrum-checkbox-font-size:var(--spectrum-font-size-200);--spectrum-checkbox-height:var(--spectrum-component-height-200);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-large\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-200);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-200)}:host([size=xl]){--spectrum-checkbox-font-size:var(--spectrum-font-size-300);--spectrum-checkbox-height:var(--spectrum-component-height-300);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-extra-large\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-300);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-300)}:host{align-items:flex-start;color:var(\n--highcontrast-checkbox-content-color-default,var(\n--mod-checkbox-content-color-default,var(--spectrum-checkbox-content-color-default)\n)\n);max-inline-size:100%;min-block-size:var(--mod-checkbox-height,var(--spectrum-checkbox-height));position:relative}:host(:hover) #box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-color-hover,var(--spectrum-checkbox-control-color-hover)\n)\n)}:host(:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-selected-color-hover,var(--spectrum-checkbox-control-selected-color-hover)\n)\n)}:host(:hover) #label{color:var(\n--highcontrast-checkbox-content-color-hover,var(\n--mod-checkbox-content-color-hover,var(--spectrum-checkbox-content-color-hover)\n)\n)}:host:active #box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-down,var(\n--mod-checkbox-control-color-down,var(--spectrum-checkbox-control-color-down)\n)\n)}:host:active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-down,var(\n--mod-checkbox-control-selected-color-down,var(--spectrum-checkbox-control-selected-color-down)\n)\n)}:host:active #label{color:var(\n--highcontrast-checkbox-content-color-down,var(\n--mod-checkbox-content-color-down,var(--spectrum-checkbox-content-color-down)\n)\n)}:host([invalid][invalid]) #box:before,:host([invalid][invalid]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-default,var(--spectrum-checkbox-invalid-color-default)\n)\n)}:host([invalid][invalid]) #input.focus-visible+#box:before,:host([invalid][invalid][indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid]) #input:focus-visible+#box:before,:host([invalid][invalid][indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid]:hover) #box:before,:host([invalid][invalid]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([readonly]){border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]:hover) #box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]):active #box:before{border-color:var(\n--highcontrast-checkbox-selected-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]) #input:checked:disabled+#box:before,:host([readonly]) #input:disabled+#box:before{background-color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]) #input:checked:disabled~#label,:host([readonly]) #input:disabled~#label{color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-content-color-default,var(--spectrum-checkbox-content-color-default)\n)\n);forced-color-adjust:none}:host([indeterminate]) #box:before,:host([indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}:host([indeterminate]) #box #checkmark,:host([indeterminate]) #input:checked+#box #checkmark{display:none}:host([indeterminate]) #box #partialCheckmark,:host([indeterminate]) #input:checked+#box #partialCheckmark{display:block;opacity:1;transform:scale(1)}:host([indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}:host([indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}:host([indeterminate]:hover) #box:before,:host([indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-selected-color-hover,var(--spectrum-checkbox-control-selected-color-hover)\n)\n)}:host([invalid][invalid][indeterminate]) #box:before,:host([invalid][invalid][indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-default,var(--spectrum-checkbox-invalid-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}:host([invalid][invalid][indeterminate]:hover) #box:before,:host([invalid][invalid][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid][indeterminate]:hover) #label{color:var(\n--highcontrast-checkbox-content-color-hover,var(\n--mod-checkbox-content-color-hover,var(--spectrum-checkbox-content-color-hover)\n)\n)}:host([emphasized]) #input:checked+#box:before,:host([emphasized][indeterminate]) #box:before,:host([emphasized][indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-emphasized-color-default,var(--spectrum-checkbox-emphasized-color-default)\n)\n)}:host([emphasized]:hover) #input:checked+#box:before,:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-emphasized-color-hover,var(--spectrum-checkbox-emphasized-color-hover)\n)\n)}:host([emphasized]) #input.focus-visible:checked+#box:before,:host([emphasized][indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-emphasized-color-focus,var(--spectrum-checkbox-emphasized-color-focus)\n)\n)}:host([emphasized]) #input:focus-visible:checked+#box:before,:host([emphasized][indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-emphasized-color-focus,var(--spectrum-checkbox-emphasized-color-focus)\n)\n)}:host([emphasized][invalid][invalid]) #input.focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-focus,var(--spectrum-checkbox-invalid-color-focus)\n)\n)}:host([emphasized][invalid][invalid]) #input:focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-focus,var(--spectrum-checkbox-invalid-color-focus)\n)\n)}:host([emphasized][invalid][invalid]:hover) #input:checked+#box:before,:host([emphasized][invalid][invalid][indeterminate]:hover) #box:before,:host([emphasized][invalid][invalid][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([emphasized]:hover) #input:checked+#box:before,:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-emphasized-color-hover,var(--spectrum-checkbox-emphasized-color-hover)\n)\n)}:host([emphasized]):active #input:checked+#box:before,:host([emphasized][indeterminate]):active #box:before,:host([emphasized][indeterminate]):active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-emphasized-color-down,var(--spectrum-checkbox-emphasized-color-down)\n)\n)}:host([emphasized][invalid][invalid]):active #box:before,:host([emphasized][invalid][invalid]):active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-invalid-color-down,var(--spectrum-checkbox-invalid-color-down)\n)\n)}:host([emphasized].focus-visible) #box:before,:host([emphasized].focus-visible) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}:host([emphasized]:focus-visible) #box:before,:host([emphasized]:focus-visible) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#label{font-size:var(\n--mod-checkbox-font-size,var(--spectrum-checkbox-font-size)\n);line-height:var(\n--mod-checkbox-line-height,var(--spectrum-checkbox-line-height)\n);margin-block-start:var(\n--mod-checkbox-top-to-text,var(--spectrum-checkbox-top-to-text)\n);margin-inline-start:var(\n--mod-checkbox-text-to-control,var(--spectrum-checkbox-text-to-control)\n);text-align:start;transition:color var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out}#label:lang(ja),#label:lang(ko),#label:lang(zh){line-height:var(\n--mod-checkbox-line-height-cjk,var(--spectrum-checkbox-line-height-cjk)\n)}#input{block-size:100%;box-sizing:border-box;color:var(\n--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)\n);cursor:pointer;font-family:inherit;font-size:100%;inline-size:100%;line-height:1.15;margin:0;opacity:.0001;overflow:visible;padding:0;position:absolute;z-index:1}#input:disabled{cursor:default}#input:checked+#box:before{background-color:var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n);border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}#input:checked+#box #checkmark{opacity:1;transform:scale(1)}#input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#input.focus-visible+#box:after{box-shadow:0 0 0 var(\n--mod-checkbox-focus-indicator-thinkness,var(--spectrum-checkbox-focus-indicator-thickness)\n) var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);forced-color-adjust:none;margin:calc(var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n)*-1)}#input:focus-visible+#box:after{box-shadow:0 0 0 var(\n--mod-checkbox-focus-indicator-thinkness,var(--spectrum-checkbox-focus-indicator-thickness)\n) var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);forced-color-adjust:none;margin:calc(var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n)*-1)}#input.focus-visible+#label{color:var(\n--highcontrast-checkbox-content-color-focus,var(\n--mod-checkbox-content-color-focus,var(--spectrum-checkbox-content-color-focus)\n)\n)}#input:focus-visible+#label{color:var(\n--highcontrast-checkbox-content-color-focus,var(\n--mod-checkbox-content-color-focus,var(--spectrum-checkbox-content-color-focus)\n)\n)}#input.focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}#input:focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}#box{--spectrum-checkbox-spacing:calc(var(--mod-checkbox-height, var(--spectrum-checkbox-height)) - var(\n--mod-checkbox-control-size,\nvar(--spectrum-checkbox-control-size)\n));align-items:center;block-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);box-sizing:border-box;display:flex;flex-grow:0;flex-shrink:0;inline-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);justify-content:center;margin:calc(var(--mod-checkbox-spacing, var(--spectrum-checkbox-spacing))/2) 0;position:relative}#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)\n)\n);border-radius:var(\n--mod-checkbox-control-corner-radius,var(--spectrum-checkbox-control-corner-radius)\n);border-style:solid;border-width:var(\n--mod-checkbox-border-width,var(--spectrum-checkbox-border-width)\n);box-sizing:border-box;content:\"\";display:block;forced-color-adjust:none;height:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);position:absolute;transition:border var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out,box-shadow var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out;width:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);z-index:0}#box:after{border-radius:calc(var(\n--mod-checkbox-control-corner-radius,\nvar(--spectrum-checkbox-control-corner-radius)\n) + var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n));content:\"\";display:block;inset:0;margin:var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n);position:absolute;transform:translate(0);transition:box-shadow var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-out,margin var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-out}#checkmark,#partialCheckmark{color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mode-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);opacity:0;transform:scale(0);transition:opacity var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out,transform var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out}#partialCheckmark{display:none}#input:checked:disabled+#box:before,#input:disabled+#box:before{background-color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);border-color:var(\n--highcontrast-checkbox-disabled-color-default,var(\n--mod-checkbox-control-color-disabled,var(--spectrum-checkbox-control-color-disabled)\n)\n)}#input:checked:disabled~#label,#input:disabled~#label{color:var(\n--highcontrast-checkbox-disabled-color-default,var(\n--mod-checkbox-content-color-disabled,var(--spectrum-checkbox-content-color-disabled)\n)\n);forced-color-adjust:none}@media (forced-colors:active){#input.focus-visible+#box{forced-color-adjust:none;outline-color:var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);outline-offset:var(\n--highcontrast-checkbox-focus-indicator-gap,var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n)\n);outline-style:auto;outline-width:var(\n--mod-focus-indicator-thickness,var(--spectrum-focus-indicator-thickness)\n)}#input:focus-visible+#box{forced-color-adjust:none;outline-color:var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);outline-offset:var(\n--highcontrast-checkbox-focus-indicator-gap,var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n)\n);outline-style:auto;outline-width:var(\n--mod-focus-indicator-thickness,var(--spectrum-focus-indicator-thickness)\n)}#input.focus-visible+#box:after{box-shadow:0 0 0 0 var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n)}#input:focus-visible+#box:after{box-shadow:0 0 0 0 var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n)}:host{--highcontrast-checkbox-content-color-default:CanvasText;--highcontrast-checkbox-content-color-hover:CanvasText;--highcontrast-checkbox-content-color-down:CanvasText;--highcontrast-checkbox-content-color-focus:CanvasText;--highcontrast-checkbox-background-color-default:Canvas;--highcontrast-checkbox-color-default:ButtonText;--highcontrast-checkbox-color-hover:ButtonText;--highcontrast-checkbox-color-focus:Highlight;--highcontrast-checkbox-highlight-color-default:Highlight;--highcontrast-checkbox-highlight-color-hover:Highlight;--highcontrast-checkbox-highlight-color-down:Highlight;--highcontrast-checkbox-highlight-color-focus:Highlight;--highcontrast-checkbox-disabled-color-default:GrayText;--highcontrast-checkbox-focus-indicator-color:CanvasText}}:host{--spectrum-checkbox-control-color-default:var(\n--system-spectrum-checkbox-control-color-default\n);--spectrum-checkbox-control-color-hover:var(\n--system-spectrum-checkbox-control-color-hover\n);--spectrum-checkbox-control-color-down:var(\n--system-spectrum-checkbox-control-color-down\n);--spectrum-checkbox-control-color-focus:var(\n--system-spectrum-checkbox-control-color-focus\n)}:host{display:inline-flex;vertical-align:top}:host(:focus){outline:none}:host([disabled]){pointer-events:none}:host(:empty) label{display:none}\n`;\nexport default styles;"],
|
|
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-checkbox-content-color-default:var(\n--spectrum-neutral-content-color-default\n);--spectrum-checkbox-content-color-hover:var(\n--spectrum-neutral-content-color-hover\n);--spectrum-checkbox-content-color-down:var(\n--spectrum-neutral-content-color-down\n);--spectrum-checkbox-content-color-focus:var(\n--spectrum-neutral-content-color-key-focus\n);--spectrum-checkbox-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n);--spectrum-checkbox-content-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-checkbox-control-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-checkbox-checkmark-color:var(--spectrum-gray-75);--spectrum-checkbox-invalid-color-default:var(\n--spectrum-negative-color-900\n);--spectrum-checkbox-invalid-color-hover:var(\n--spectrum-negative-color-1000\n);--spectrum-checkbox-invalid-color-down:var(--spectrum-negative-color-1100);--spectrum-checkbox-invalid-color-focus:var(\n--spectrum-negative-color-1000\n);--spectrum-checkbox-emphasized-color-default:var(\n--spectrum-accent-color-900\n);--spectrum-checkbox-emphasized-color-hover:var(\n--spectrum-accent-color-1000\n);--spectrum-checkbox-emphasized-color-down:var(\n--spectrum-accent-color-1100\n);--spectrum-checkbox-emphasized-color-focus:var(\n--spectrum-accent-color-1000\n);--spectrum-checkbox-control-selected-color-default:var(\n--spectrum-neutral-background-color-selected-default\n);--spectrum-checkbox-control-selected-color-hover:var(\n--spectrum-neutral-background-color-selected-hover\n);--spectrum-checkbox-control-selected-color-down:var(\n--spectrum-neutral-background-color-selected-down\n);--spectrum-checkbox-control-selected-color-focus:var(\n--spectrum-neutral-background-color-selected-key-focus\n);--spectrum-checkbox-line-height:var(--spectrum-line-height-100);--spectrum-checkbox-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-checkbox-control-corner-radius:var(--spectrum-corner-radius-75);--spectrum-checkbox-focus-indicator-gap:var(\n--spectrum-focus-indicator-gap\n);--spectrum-checkbox-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-checkbox-border-width:var(--spectrum-border-width-200);--spectrum-checkbox-selected-border-width:calc(var(--spectrum-checkbox-control-size)/2);--spectrum-checkbox-animation-duration:var(\n--spectrum-animation-duration-100\n)}:host([size=s]){--spectrum-checkbox-font-size:var(--spectrum-font-size-75);--spectrum-checkbox-height:var(--spectrum-component-height-75);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-small\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-75);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-75)}:host{--spectrum-checkbox-font-size:var(--spectrum-font-size-100);--spectrum-checkbox-height:var(--spectrum-component-height-100);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-medium\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-100)}:host([size=l]){--spectrum-checkbox-font-size:var(--spectrum-font-size-200);--spectrum-checkbox-height:var(--spectrum-component-height-200);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-large\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-200);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-200)}:host([size=xl]){--spectrum-checkbox-font-size:var(--spectrum-font-size-300);--spectrum-checkbox-height:var(--spectrum-component-height-300);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-extra-large\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-300);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-300)}:host{align-items:flex-start;color:var(\n--highcontrast-checkbox-content-color-default,var(\n--mod-checkbox-content-color-default,var(--spectrum-checkbox-content-color-default)\n)\n);max-inline-size:100%;min-block-size:var(--mod-checkbox-height,var(--spectrum-checkbox-height));position:relative}:host(:hover) #box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-color-hover,var(--spectrum-checkbox-control-color-hover)\n)\n)}:host(:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-selected-color-hover,var(--spectrum-checkbox-control-selected-color-hover)\n)\n)}:host(:hover) #label{color:var(\n--highcontrast-checkbox-content-color-hover,var(\n--mod-checkbox-content-color-hover,var(--spectrum-checkbox-content-color-hover)\n)\n)}:host:active #box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-down,var(\n--mod-checkbox-control-color-down,var(--spectrum-checkbox-control-color-down)\n)\n)}:host:active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-down,var(\n--mod-checkbox-control-selected-color-down,var(--spectrum-checkbox-control-selected-color-down)\n)\n)}:host:active #label{color:var(\n--highcontrast-checkbox-content-color-down,var(\n--mod-checkbox-content-color-down,var(--spectrum-checkbox-content-color-down)\n)\n)}:host([invalid][invalid]) #box:before,:host([invalid][invalid]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-default,var(--spectrum-checkbox-invalid-color-default)\n)\n)}:host([invalid][invalid]) #input.focus-visible+#box:before,:host([invalid][invalid][indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid]) #input:focus-visible+#box:before,:host([invalid][invalid][indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid]:hover) #box:before,:host([invalid][invalid]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([readonly]){border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]:hover) #box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]):active #box:before{border-color:var(\n--highcontrast-checkbox-selected-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]) #input:checked:disabled+#box:before,:host([readonly]) #input:disabled+#box:before{background-color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]) #input:checked:disabled~#label,:host([readonly]) #input:disabled~#label{color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-content-color-default,var(--spectrum-checkbox-content-color-default)\n)\n);forced-color-adjust:none}:host([indeterminate]) #box:before,:host([indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}:host([indeterminate]) #box #checkmark,:host([indeterminate]) #input:checked+#box #checkmark{display:none}:host([indeterminate]) #box #partialCheckmark,:host([indeterminate]) #input:checked+#box #partialCheckmark{display:block;opacity:1;transform:scale(1)}:host([indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}:host([indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}:host([indeterminate]:hover) #box:before,:host([indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-selected-color-hover,var(--spectrum-checkbox-control-selected-color-hover)\n)\n)}:host([invalid][invalid][indeterminate]) #box:before,:host([invalid][invalid][indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-default,var(--spectrum-checkbox-invalid-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}:host([invalid][invalid][indeterminate]:hover) #box:before,:host([invalid][invalid][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid][indeterminate]:hover) #label{color:var(\n--highcontrast-checkbox-content-color-hover,var(\n--mod-checkbox-content-color-hover,var(--spectrum-checkbox-content-color-hover)\n)\n)}:host([emphasized]) #input:checked+#box:before,:host([emphasized][indeterminate]) #box:before,:host([emphasized][indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-emphasized-color-default,var(--spectrum-checkbox-emphasized-color-default)\n)\n)}:host([emphasized]:hover) #input:checked+#box:before,:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-emphasized-color-hover,var(--spectrum-checkbox-emphasized-color-hover)\n)\n)}:host([emphasized]) #input.focus-visible:checked+#box:before,:host([emphasized][indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-emphasized-color-focus,var(--spectrum-checkbox-emphasized-color-focus)\n)\n)}:host([emphasized]) #input:focus-visible:checked+#box:before,:host([emphasized][indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-emphasized-color-focus,var(--spectrum-checkbox-emphasized-color-focus)\n)\n)}:host([emphasized][invalid][invalid]) #input.focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-focus,var(--spectrum-checkbox-invalid-color-focus)\n)\n)}:host([emphasized][invalid][invalid]) #input:focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-focus,var(--spectrum-checkbox-invalid-color-focus)\n)\n)}:host([emphasized][invalid][invalid]:hover) #input:checked+#box:before,:host([emphasized][invalid][invalid][indeterminate]:hover) #box:before,:host([emphasized][invalid][invalid][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([emphasized]:hover) #input:checked+#box:before,:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-emphasized-color-hover,var(--spectrum-checkbox-emphasized-color-hover)\n)\n)}:host([emphasized]):active #input:checked+#box:before,:host([emphasized][indeterminate]):active #box:before,:host([emphasized][indeterminate]):active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-emphasized-color-down,var(--spectrum-checkbox-emphasized-color-down)\n)\n)}:host([emphasized][invalid][invalid]):active #box:before,:host([emphasized][invalid][invalid]):active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-invalid-color-down,var(--spectrum-checkbox-invalid-color-down)\n)\n)}:host([emphasized].focus-visible) #box:before,:host([emphasized].focus-visible) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}:host([emphasized]:focus-visible) #box:before,:host([emphasized]:focus-visible) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#label{font-size:var(\n--mod-checkbox-font-size,var(--spectrum-checkbox-font-size)\n);line-height:var(\n--mod-checkbox-line-height,var(--spectrum-checkbox-line-height)\n);margin-block-start:var(\n--mod-checkbox-top-to-text,var(--spectrum-checkbox-top-to-text)\n);margin-inline-start:var(\n--mod-checkbox-text-to-control,var(--spectrum-checkbox-text-to-control)\n);text-align:start;transition:color var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out}#label:lang(ja),#label:lang(ko),#label:lang(zh){line-height:var(\n--mod-checkbox-line-height-cjk,var(--spectrum-checkbox-line-height-cjk)\n)}#input{block-size:100%;box-sizing:border-box;color:var(\n--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)\n);cursor:pointer;font-family:inherit;font-size:100%;inline-size:100%;line-height:1.15;margin:0;opacity:.0001;overflow:visible;padding:0;position:absolute;z-index:1}#input:disabled{cursor:default}#input:checked+#box:before{background-color:var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n);border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}#input:checked+#box #checkmark{opacity:1;transform:scale(1)}#input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#input.focus-visible+#box:after{box-shadow:0 0 0 var(\n--mod-checkbox-focus-indicator-thinkness,var(--spectrum-checkbox-focus-indicator-thickness)\n) var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);forced-color-adjust:none;margin:calc(var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n)*-1)}#input:focus-visible+#box:after{box-shadow:0 0 0 var(\n--mod-checkbox-focus-indicator-thinkness,var(--spectrum-checkbox-focus-indicator-thickness)\n) var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);forced-color-adjust:none;margin:calc(var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n)*-1)}#input.focus-visible+#label{color:var(\n--highcontrast-checkbox-content-color-focus,var(\n--mod-checkbox-content-color-focus,var(--spectrum-checkbox-content-color-focus)\n)\n)}#input:focus-visible+#label{color:var(\n--highcontrast-checkbox-content-color-focus,var(\n--mod-checkbox-content-color-focus,var(--spectrum-checkbox-content-color-focus)\n)\n)}#input.focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}#input:focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}#box{--spectrum-checkbox-spacing:calc(var(--mod-checkbox-height, var(--spectrum-checkbox-height)) - var(\n--mod-checkbox-control-size,\nvar(--spectrum-checkbox-control-size)\n));align-items:center;block-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);box-sizing:border-box;display:flex;flex-grow:0;flex-shrink:0;inline-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);justify-content:center;margin:calc(var(--mod-checkbox-spacing, var(--spectrum-checkbox-spacing))/2) 0;position:relative}#box:before{block-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)\n)\n);border-radius:var(\n--mod-checkbox-control-corner-radius,var(--spectrum-checkbox-control-corner-radius)\n);border-style:solid;border-width:var(\n--mod-checkbox-border-width,var(--spectrum-checkbox-border-width)\n);box-sizing:border-box;content:\"\";display:block;forced-color-adjust:none;inline-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);position:absolute;transition:border var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out,box-shadow var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out;z-index:0}#box:after{border-radius:calc(var(\n--mod-checkbox-control-corner-radius,\nvar(--spectrum-checkbox-control-corner-radius)\n) + var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n));content:\"\";display:block;inset-block:0;inset-inline:0;margin:var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n);position:absolute;transform:translate(0);transition:box-shadow var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-out,margin var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-out}#checkmark,#partialCheckmark{color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mode-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);opacity:0;transform:scale(0);transition:opacity var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out,transform var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out}#partialCheckmark{display:none}#input:checked:disabled+#box:before,#input:disabled+#box:before{background-color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);border-color:var(\n--highcontrast-checkbox-disabled-color-default,var(\n--mod-checkbox-control-color-disabled,var(--spectrum-checkbox-control-color-disabled)\n)\n)}#input:checked:disabled~#label,#input:disabled~#label{color:var(\n--highcontrast-checkbox-disabled-color-default,var(\n--mod-checkbox-content-color-disabled,var(--spectrum-checkbox-content-color-disabled)\n)\n);forced-color-adjust:none}@media (forced-colors:active){#input.focus-visible+#box{forced-color-adjust:none;outline-color:var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);outline-offset:var(\n--highcontrast-checkbox-focus-indicator-gap,var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n)\n);outline-style:auto;outline-width:var(\n--mod-focus-indicator-thickness,var(--spectrum-focus-indicator-thickness)\n)}#input:focus-visible+#box{forced-color-adjust:none;outline-color:var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);outline-offset:var(\n--highcontrast-checkbox-focus-indicator-gap,var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n)\n);outline-style:auto;outline-width:var(\n--mod-focus-indicator-thickness,var(--spectrum-focus-indicator-thickness)\n)}#input.focus-visible+#box:after{box-shadow:0 0 0 0 var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n)}#input:focus-visible+#box:after{box-shadow:0 0 0 0 var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n)}:host{--highcontrast-checkbox-content-color-default:CanvasText;--highcontrast-checkbox-content-color-hover:CanvasText;--highcontrast-checkbox-content-color-down:CanvasText;--highcontrast-checkbox-content-color-focus:CanvasText;--highcontrast-checkbox-background-color-default:Canvas;--highcontrast-checkbox-color-default:ButtonText;--highcontrast-checkbox-color-hover:ButtonText;--highcontrast-checkbox-color-focus:Highlight;--highcontrast-checkbox-highlight-color-default:Highlight;--highcontrast-checkbox-highlight-color-hover:Highlight;--highcontrast-checkbox-highlight-color-down:Highlight;--highcontrast-checkbox-highlight-color-focus:Highlight;--highcontrast-checkbox-disabled-color-default:GrayText;--highcontrast-checkbox-focus-indicator-color:CanvasText}}:host{--spectrum-checkbox-control-color-default:var(\n--system-spectrum-checkbox-control-color-default\n);--spectrum-checkbox-control-color-hover:var(\n--system-spectrum-checkbox-control-color-hover\n);--spectrum-checkbox-control-color-down:var(\n--system-spectrum-checkbox-control-color-down\n);--spectrum-checkbox-control-color-focus:var(\n--system-spectrum-checkbox-control-color-focus\n)}:host{display:inline-flex;vertical-align:top}:host(:focus){outline:none}:host([disabled]){pointer-events:none}:host(:empty) label{display:none}\n`;\nexport default styles;"],
|
|
5
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;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;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;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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAoWf,eAAeC",
|
|
6
6
|
"names": ["css", "styles"]
|
|
7
7
|
}
|
|
@@ -270,7 +270,9 @@ var(--spectrum-checkbox-control-size)
|
|
|
270
270
|
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
271
271
|
);box-sizing:border-box;display:flex;flex-grow:0;flex-shrink:0;inline-size:var(
|
|
272
272
|
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
273
|
-
);justify-content:center;margin:calc(var(--mod-checkbox-spacing, var(--spectrum-checkbox-spacing))/2) 0;position:relative}#box:before{
|
|
273
|
+
);justify-content:center;margin:calc(var(--mod-checkbox-spacing, var(--spectrum-checkbox-spacing))/2) 0;position:relative}#box:before{block-size:var(
|
|
274
|
+
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
275
|
+
);border-color:var(
|
|
274
276
|
--highcontrast-checkbox-color-default,var(
|
|
275
277
|
--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)
|
|
276
278
|
)
|
|
@@ -278,21 +280,19 @@ var(--spectrum-checkbox-control-size)
|
|
|
278
280
|
--mod-checkbox-control-corner-radius,var(--spectrum-checkbox-control-corner-radius)
|
|
279
281
|
);border-style:solid;border-width:var(
|
|
280
282
|
--mod-checkbox-border-width,var(--spectrum-checkbox-border-width)
|
|
281
|
-
);box-sizing:border-box;content:"";display:block;forced-color-adjust:none;
|
|
283
|
+
);box-sizing:border-box;content:"";display:block;forced-color-adjust:none;inline-size:var(
|
|
282
284
|
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
283
285
|
);position:absolute;transition:border var(
|
|
284
286
|
--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)
|
|
285
287
|
) ease-in-out,box-shadow var(
|
|
286
288
|
--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)
|
|
287
|
-
) ease-in-out;
|
|
288
|
-
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
289
|
-
);z-index:0}#box:after{border-radius:calc(var(
|
|
289
|
+
) ease-in-out;z-index:0}#box:after{border-radius:calc(var(
|
|
290
290
|
--mod-checkbox-control-corner-radius,
|
|
291
291
|
var(--spectrum-checkbox-control-corner-radius)
|
|
292
292
|
) + var(
|
|
293
293
|
--mod-checkbox-focus-indicator-gap,
|
|
294
294
|
var(--spectrum-checkbox-focus-indicator-gap)
|
|
295
|
-
));content:"";display:block;inset:0;margin:var(
|
|
295
|
+
));content:"";display:block;inset-block:0;inset-inline:0;margin:var(
|
|
296
296
|
--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)
|
|
297
297
|
);position:absolute;transform:translate(0);transition:box-shadow var(
|
|
298
298
|
--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["spectrum-checkbox.css.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2023 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-checkbox-content-color-default:var(\n--spectrum-neutral-content-color-default\n);--spectrum-checkbox-content-color-hover:var(\n--spectrum-neutral-content-color-hover\n);--spectrum-checkbox-content-color-down:var(\n--spectrum-neutral-content-color-down\n);--spectrum-checkbox-content-color-focus:var(\n--spectrum-neutral-content-color-key-focus\n);--spectrum-checkbox-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n);--spectrum-checkbox-content-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-checkbox-control-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-checkbox-checkmark-color:var(--spectrum-gray-75);--spectrum-checkbox-invalid-color-default:var(\n--spectrum-negative-color-900\n);--spectrum-checkbox-invalid-color-hover:var(\n--spectrum-negative-color-1000\n);--spectrum-checkbox-invalid-color-down:var(--spectrum-negative-color-1100);--spectrum-checkbox-invalid-color-focus:var(\n--spectrum-negative-color-1000\n);--spectrum-checkbox-emphasized-color-default:var(\n--spectrum-accent-color-900\n);--spectrum-checkbox-emphasized-color-hover:var(\n--spectrum-accent-color-1000\n);--spectrum-checkbox-emphasized-color-down:var(\n--spectrum-accent-color-1100\n);--spectrum-checkbox-emphasized-color-focus:var(\n--spectrum-accent-color-1000\n);--spectrum-checkbox-control-selected-color-default:var(\n--spectrum-neutral-background-color-selected-default\n);--spectrum-checkbox-control-selected-color-hover:var(\n--spectrum-neutral-background-color-selected-hover\n);--spectrum-checkbox-control-selected-color-down:var(\n--spectrum-neutral-background-color-selected-down\n);--spectrum-checkbox-control-selected-color-focus:var(\n--spectrum-neutral-background-color-selected-key-focus\n);--spectrum-checkbox-line-height:var(--spectrum-line-height-100);--spectrum-checkbox-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-checkbox-control-corner-radius:var(--spectrum-corner-radius-75);--spectrum-checkbox-focus-indicator-gap:var(\n--spectrum-focus-indicator-gap\n);--spectrum-checkbox-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-checkbox-border-width:var(--spectrum-border-width-200);--spectrum-checkbox-selected-border-width:calc(var(--spectrum-checkbox-control-size)/2);--spectrum-checkbox-animation-duration:var(\n--spectrum-animation-duration-100\n)}:host([size=s]){--spectrum-checkbox-font-size:var(--spectrum-font-size-75);--spectrum-checkbox-height:var(--spectrum-component-height-75);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-small\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-75);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-75)}:host{--spectrum-checkbox-font-size:var(--spectrum-font-size-100);--spectrum-checkbox-height:var(--spectrum-component-height-100);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-medium\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-100)}:host([size=l]){--spectrum-checkbox-font-size:var(--spectrum-font-size-200);--spectrum-checkbox-height:var(--spectrum-component-height-200);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-large\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-200);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-200)}:host([size=xl]){--spectrum-checkbox-font-size:var(--spectrum-font-size-300);--spectrum-checkbox-height:var(--spectrum-component-height-300);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-extra-large\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-300);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-300)}:host{align-items:flex-start;color:var(\n--highcontrast-checkbox-content-color-default,var(\n--mod-checkbox-content-color-default,var(--spectrum-checkbox-content-color-default)\n)\n);display:inline-flex;max-inline-size:100%;min-block-size:var(--mod-checkbox-height,var(--spectrum-checkbox-height));position:relative;vertical-align:top}:host(:hover) #box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-color-hover,var(--spectrum-checkbox-control-color-hover)\n)\n)}:host(:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-selected-color-hover,var(--spectrum-checkbox-control-selected-color-hover)\n)\n)}:host(:hover) #label{color:var(\n--highcontrast-checkbox-content-color-hover,var(\n--mod-checkbox-content-color-hover,var(--spectrum-checkbox-content-color-hover)\n)\n)}:host:active #box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-down,var(\n--mod-checkbox-control-color-down,var(--spectrum-checkbox-control-color-down)\n)\n)}:host:active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-down,var(\n--mod-checkbox-control-selected-color-down,var(--spectrum-checkbox-control-selected-color-down)\n)\n)}:host:active #label{color:var(\n--highcontrast-checkbox-content-color-down,var(\n--mod-checkbox-content-color-down,var(--spectrum-checkbox-content-color-down)\n)\n)}:host([invalid][invalid]) #box:before,:host([invalid][invalid]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-default,var(--spectrum-checkbox-invalid-color-default)\n)\n)}:host([invalid][invalid]) #input.focus-visible+#box:before,:host([invalid][invalid][indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid]) #input:focus-visible+#box:before,:host([invalid][invalid][indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid]:hover) #box:before,:host([invalid][invalid]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([readonly]){border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]:hover) #box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]):active #box:before{border-color:var(\n--highcontrast-checkbox-selected-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]) #input:checked:disabled+#box:before,:host([readonly]) #input:disabled+#box:before{background-color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]) #input:checked:disabled~#label,:host([readonly]) #input:disabled~#label{color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-content-color-default,var(--spectrum-checkbox-content-color-default)\n)\n);forced-color-adjust:none}:host([indeterminate]) #box:before,:host([indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}:host([indeterminate]) #box #checkmark,:host([indeterminate]) #input:checked+#box #checkmark{display:none}:host([indeterminate]) #box #partialCheckmark,:host([indeterminate]) #input:checked+#box #partialCheckmark{display:block;opacity:1;transform:scale(1)}:host([indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}:host([indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}:host([indeterminate]:hover) #box:before,:host([indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-selected-color-hover,var(--spectrum-checkbox-control-selected-color-hover)\n)\n)}:host([invalid][invalid][indeterminate]) #box:before,:host([invalid][invalid][indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-default,var(--spectrum-checkbox-invalid-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}:host([invalid][invalid][indeterminate]:hover) #box:before,:host([invalid][invalid][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid][indeterminate]:hover) #label{color:var(\n--highcontrast-checkbox-content-color-hover,var(\n--mod-checkbox-content-color-hover,var(--spectrum-checkbox-content-color-hover)\n)\n)}:host([emphasized]) #input:checked+#box:before,:host([emphasized][indeterminate]) #box:before,:host([emphasized][indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-emphasized-color-default,var(--spectrum-checkbox-emphasized-color-default)\n)\n)}:host([emphasized]:hover) #input:checked+#box:before,:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-emphasized-color-hover,var(--spectrum-checkbox-emphasized-color-hover)\n)\n)}:host([emphasized]) #input.focus-visible:checked+#box:before,:host([emphasized][indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-emphasized-color-focus,var(--spectrum-checkbox-emphasized-color-focus)\n)\n)}:host([emphasized]) #input:focus-visible:checked+#box:before,:host([emphasized][indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-emphasized-color-focus,var(--spectrum-checkbox-emphasized-color-focus)\n)\n)}:host([emphasized][invalid][invalid]) #input.focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-focus,var(--spectrum-checkbox-invalid-color-focus)\n)\n)}:host([emphasized][invalid][invalid]) #input:focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-focus,var(--spectrum-checkbox-invalid-color-focus)\n)\n)}:host([emphasized][invalid][invalid]:hover) #input:checked+#box:before,:host([emphasized][invalid][invalid][indeterminate]:hover) #box:before,:host([emphasized][invalid][invalid][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([emphasized]:hover) #input:checked+#box:before,:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-emphasized-color-hover,var(--spectrum-checkbox-emphasized-color-hover)\n)\n)}:host([emphasized]):active #input:checked+#box:before,:host([emphasized][indeterminate]):active #box:before,:host([emphasized][indeterminate]):active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-emphasized-color-down,var(--spectrum-checkbox-emphasized-color-down)\n)\n)}:host([emphasized][invalid][invalid]):active #box:before,:host([emphasized][invalid][invalid]):active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-invalid-color-down,var(--spectrum-checkbox-invalid-color-down)\n)\n)}:host([emphasized].focus-visible) #box:before,:host([emphasized].focus-visible) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}:host([emphasized]:focus-visible) #box:before,:host([emphasized]:focus-visible) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#label{font-size:var(\n--mod-checkbox-font-size,var(--spectrum-checkbox-font-size)\n);line-height:var(\n--mod-checkbox-line-height,var(--spectrum-checkbox-line-height)\n);margin-block-start:var(\n--mod-checkbox-top-to-text,var(--spectrum-checkbox-top-to-text)\n);margin-inline-start:var(\n--mod-checkbox-text-to-control,var(--spectrum-checkbox-text-to-control)\n);text-align:start;transition:color var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out}#label:lang(ja),#label:lang(ko),#label:lang(zh){line-height:var(\n--mod-checkbox-line-height-cjk,var(--spectrum-checkbox-line-height-cjk)\n)}#input{block-size:100%;box-sizing:border-box;color:var(\n--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)\n);cursor:pointer;font-family:inherit;font-size:100%;inline-size:100%;line-height:1.15;margin:0;opacity:.0001;overflow:visible;padding:0;position:absolute;z-index:1}#input:disabled{cursor:default}#input:checked+#box:before{background-color:var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n);border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}#input:checked+#box #checkmark{opacity:1;transform:scale(1)}#input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#input.focus-visible+#box:after{box-shadow:0 0 0 var(\n--mod-checkbox-focus-indicator-thinkness,var(--spectrum-checkbox-focus-indicator-thickness)\n) var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);forced-color-adjust:none;margin:calc(var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n)*-1)}#input:focus-visible+#box:after{box-shadow:0 0 0 var(\n--mod-checkbox-focus-indicator-thinkness,var(--spectrum-checkbox-focus-indicator-thickness)\n) var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);forced-color-adjust:none;margin:calc(var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n)*-1)}#input.focus-visible+#label{color:var(\n--highcontrast-checkbox-content-color-focus,var(\n--mod-checkbox-content-color-focus,var(--spectrum-checkbox-content-color-focus)\n)\n)}#input:focus-visible+#label{color:var(\n--highcontrast-checkbox-content-color-focus,var(\n--mod-checkbox-content-color-focus,var(--spectrum-checkbox-content-color-focus)\n)\n)}#input.focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}#input:focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}#box{--spectrum-checkbox-spacing:calc(var(--mod-checkbox-height, var(--spectrum-checkbox-height)) - var(\n--mod-checkbox-control-size,\nvar(--spectrum-checkbox-control-size)\n));align-items:center;block-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);box-sizing:border-box;display:flex;flex-grow:0;flex-shrink:0;inline-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);justify-content:center;margin:calc(var(--mod-checkbox-spacing, var(--spectrum-checkbox-spacing))/2) 0;position:relative}#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)\n)\n);border-radius:var(\n--mod-checkbox-control-corner-radius,var(--spectrum-checkbox-control-corner-radius)\n);border-style:solid;border-width:var(\n--mod-checkbox-border-width,var(--spectrum-checkbox-border-width)\n);box-sizing:border-box;content:\"\";display:block;forced-color-adjust:none;height:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);position:absolute;transition:border var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out,box-shadow var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out;width:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);z-index:0}#box:after{border-radius:calc(var(\n--mod-checkbox-control-corner-radius,\nvar(--spectrum-checkbox-control-corner-radius)\n) + var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n));content:\"\";display:block;inset:0;margin:var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n);position:absolute;transform:translate(0);transition:box-shadow var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-out,margin var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-out}#checkmark,#partialCheckmark{color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mode-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);opacity:0;transform:scale(0);transition:opacity var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out,transform var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out}#partialCheckmark{display:none}#input:checked:disabled+#box:before,#input:disabled+#box:before{background-color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);border-color:var(\n--highcontrast-checkbox-disabled-color-default,var(\n--mod-checkbox-control-color-disabled,var(--spectrum-checkbox-control-color-disabled)\n)\n)}#input:checked:disabled~#label,#input:disabled~#label{color:var(\n--highcontrast-checkbox-disabled-color-default,var(\n--mod-checkbox-content-color-disabled,var(--spectrum-checkbox-content-color-disabled)\n)\n);forced-color-adjust:none}@media (forced-colors:active){#input.focus-visible+#box{forced-color-adjust:none;outline-color:var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);outline-offset:var(\n--highcontrast-checkbox-focus-indicator-gap,var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n)\n);outline-style:auto;outline-width:var(\n--mod-focus-indicator-thickness,var(--spectrum-focus-indicator-thickness)\n)}#input:focus-visible+#box{forced-color-adjust:none;outline-color:var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);outline-offset:var(\n--highcontrast-checkbox-focus-indicator-gap,var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n)\n);outline-style:auto;outline-width:var(\n--mod-focus-indicator-thickness,var(--spectrum-focus-indicator-thickness)\n)}#input.focus-visible+#box:after{box-shadow:0 0 0 0 var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n)}#input:focus-visible+#box:after{box-shadow:0 0 0 0 var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n)}:host{--highcontrast-checkbox-content-color-default:CanvasText;--highcontrast-checkbox-content-color-hover:CanvasText;--highcontrast-checkbox-content-color-down:CanvasText;--highcontrast-checkbox-content-color-focus:CanvasText;--highcontrast-checkbox-background-color-default:Canvas;--highcontrast-checkbox-color-default:ButtonText;--highcontrast-checkbox-color-hover:ButtonText;--highcontrast-checkbox-color-focus:Highlight;--highcontrast-checkbox-highlight-color-default:Highlight;--highcontrast-checkbox-highlight-color-hover:Highlight;--highcontrast-checkbox-highlight-color-down:Highlight;--highcontrast-checkbox-highlight-color-focus:Highlight;--highcontrast-checkbox-disabled-color-default:GrayText;--highcontrast-checkbox-focus-indicator-color:CanvasText}}:host{--spectrum-checkbox-control-color-default:var(\n--system-spectrum-checkbox-control-color-default\n);--spectrum-checkbox-control-color-hover:var(\n--system-spectrum-checkbox-control-color-hover\n);--spectrum-checkbox-control-color-down:var(\n--system-spectrum-checkbox-control-color-down\n);--spectrum-checkbox-control-color-focus:var(\n--system-spectrum-checkbox-control-color-focus\n)}\n`;\nexport default styles;"],
|
|
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-checkbox-content-color-default:var(\n--spectrum-neutral-content-color-default\n);--spectrum-checkbox-content-color-hover:var(\n--spectrum-neutral-content-color-hover\n);--spectrum-checkbox-content-color-down:var(\n--spectrum-neutral-content-color-down\n);--spectrum-checkbox-content-color-focus:var(\n--spectrum-neutral-content-color-key-focus\n);--spectrum-checkbox-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n);--spectrum-checkbox-content-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-checkbox-control-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-checkbox-checkmark-color:var(--spectrum-gray-75);--spectrum-checkbox-invalid-color-default:var(\n--spectrum-negative-color-900\n);--spectrum-checkbox-invalid-color-hover:var(\n--spectrum-negative-color-1000\n);--spectrum-checkbox-invalid-color-down:var(--spectrum-negative-color-1100);--spectrum-checkbox-invalid-color-focus:var(\n--spectrum-negative-color-1000\n);--spectrum-checkbox-emphasized-color-default:var(\n--spectrum-accent-color-900\n);--spectrum-checkbox-emphasized-color-hover:var(\n--spectrum-accent-color-1000\n);--spectrum-checkbox-emphasized-color-down:var(\n--spectrum-accent-color-1100\n);--spectrum-checkbox-emphasized-color-focus:var(\n--spectrum-accent-color-1000\n);--spectrum-checkbox-control-selected-color-default:var(\n--spectrum-neutral-background-color-selected-default\n);--spectrum-checkbox-control-selected-color-hover:var(\n--spectrum-neutral-background-color-selected-hover\n);--spectrum-checkbox-control-selected-color-down:var(\n--spectrum-neutral-background-color-selected-down\n);--spectrum-checkbox-control-selected-color-focus:var(\n--spectrum-neutral-background-color-selected-key-focus\n);--spectrum-checkbox-line-height:var(--spectrum-line-height-100);--spectrum-checkbox-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-checkbox-control-corner-radius:var(--spectrum-corner-radius-75);--spectrum-checkbox-focus-indicator-gap:var(\n--spectrum-focus-indicator-gap\n);--spectrum-checkbox-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-checkbox-border-width:var(--spectrum-border-width-200);--spectrum-checkbox-selected-border-width:calc(var(--spectrum-checkbox-control-size)/2);--spectrum-checkbox-animation-duration:var(\n--spectrum-animation-duration-100\n)}:host([size=s]){--spectrum-checkbox-font-size:var(--spectrum-font-size-75);--spectrum-checkbox-height:var(--spectrum-component-height-75);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-small\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-75);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-75)}:host{--spectrum-checkbox-font-size:var(--spectrum-font-size-100);--spectrum-checkbox-height:var(--spectrum-component-height-100);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-medium\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-100)}:host([size=l]){--spectrum-checkbox-font-size:var(--spectrum-font-size-200);--spectrum-checkbox-height:var(--spectrum-component-height-200);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-large\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-200);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-200)}:host([size=xl]){--spectrum-checkbox-font-size:var(--spectrum-font-size-300);--spectrum-checkbox-height:var(--spectrum-component-height-300);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-extra-large\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-300);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-300)}:host{align-items:flex-start;color:var(\n--highcontrast-checkbox-content-color-default,var(\n--mod-checkbox-content-color-default,var(--spectrum-checkbox-content-color-default)\n)\n);display:inline-flex;max-inline-size:100%;min-block-size:var(--mod-checkbox-height,var(--spectrum-checkbox-height));position:relative;vertical-align:top}:host(:hover) #box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-color-hover,var(--spectrum-checkbox-control-color-hover)\n)\n)}:host(:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-selected-color-hover,var(--spectrum-checkbox-control-selected-color-hover)\n)\n)}:host(:hover) #label{color:var(\n--highcontrast-checkbox-content-color-hover,var(\n--mod-checkbox-content-color-hover,var(--spectrum-checkbox-content-color-hover)\n)\n)}:host:active #box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-down,var(\n--mod-checkbox-control-color-down,var(--spectrum-checkbox-control-color-down)\n)\n)}:host:active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-down,var(\n--mod-checkbox-control-selected-color-down,var(--spectrum-checkbox-control-selected-color-down)\n)\n)}:host:active #label{color:var(\n--highcontrast-checkbox-content-color-down,var(\n--mod-checkbox-content-color-down,var(--spectrum-checkbox-content-color-down)\n)\n)}:host([invalid][invalid]) #box:before,:host([invalid][invalid]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-default,var(--spectrum-checkbox-invalid-color-default)\n)\n)}:host([invalid][invalid]) #input.focus-visible+#box:before,:host([invalid][invalid][indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid]) #input:focus-visible+#box:before,:host([invalid][invalid][indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid]:hover) #box:before,:host([invalid][invalid]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([readonly]){border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]:hover) #box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]):active #box:before{border-color:var(\n--highcontrast-checkbox-selected-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]) #input:checked:disabled+#box:before,:host([readonly]) #input:disabled+#box:before{background-color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]) #input:checked:disabled~#label,:host([readonly]) #input:disabled~#label{color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-content-color-default,var(--spectrum-checkbox-content-color-default)\n)\n);forced-color-adjust:none}:host([indeterminate]) #box:before,:host([indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}:host([indeterminate]) #box #checkmark,:host([indeterminate]) #input:checked+#box #checkmark{display:none}:host([indeterminate]) #box #partialCheckmark,:host([indeterminate]) #input:checked+#box #partialCheckmark{display:block;opacity:1;transform:scale(1)}:host([indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}:host([indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}:host([indeterminate]:hover) #box:before,:host([indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-selected-color-hover,var(--spectrum-checkbox-control-selected-color-hover)\n)\n)}:host([invalid][invalid][indeterminate]) #box:before,:host([invalid][invalid][indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-default,var(--spectrum-checkbox-invalid-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}:host([invalid][invalid][indeterminate]:hover) #box:before,:host([invalid][invalid][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid][indeterminate]:hover) #label{color:var(\n--highcontrast-checkbox-content-color-hover,var(\n--mod-checkbox-content-color-hover,var(--spectrum-checkbox-content-color-hover)\n)\n)}:host([emphasized]) #input:checked+#box:before,:host([emphasized][indeterminate]) #box:before,:host([emphasized][indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-emphasized-color-default,var(--spectrum-checkbox-emphasized-color-default)\n)\n)}:host([emphasized]:hover) #input:checked+#box:before,:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-emphasized-color-hover,var(--spectrum-checkbox-emphasized-color-hover)\n)\n)}:host([emphasized]) #input.focus-visible:checked+#box:before,:host([emphasized][indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-emphasized-color-focus,var(--spectrum-checkbox-emphasized-color-focus)\n)\n)}:host([emphasized]) #input:focus-visible:checked+#box:before,:host([emphasized][indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-emphasized-color-focus,var(--spectrum-checkbox-emphasized-color-focus)\n)\n)}:host([emphasized][invalid][invalid]) #input.focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-focus,var(--spectrum-checkbox-invalid-color-focus)\n)\n)}:host([emphasized][invalid][invalid]) #input:focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-focus,var(--spectrum-checkbox-invalid-color-focus)\n)\n)}:host([emphasized][invalid][invalid]:hover) #input:checked+#box:before,:host([emphasized][invalid][invalid][indeterminate]:hover) #box:before,:host([emphasized][invalid][invalid][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([emphasized]:hover) #input:checked+#box:before,:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-emphasized-color-hover,var(--spectrum-checkbox-emphasized-color-hover)\n)\n)}:host([emphasized]):active #input:checked+#box:before,:host([emphasized][indeterminate]):active #box:before,:host([emphasized][indeterminate]):active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-emphasized-color-down,var(--spectrum-checkbox-emphasized-color-down)\n)\n)}:host([emphasized][invalid][invalid]):active #box:before,:host([emphasized][invalid][invalid]):active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-invalid-color-down,var(--spectrum-checkbox-invalid-color-down)\n)\n)}:host([emphasized].focus-visible) #box:before,:host([emphasized].focus-visible) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}:host([emphasized]:focus-visible) #box:before,:host([emphasized]:focus-visible) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#label{font-size:var(\n--mod-checkbox-font-size,var(--spectrum-checkbox-font-size)\n);line-height:var(\n--mod-checkbox-line-height,var(--spectrum-checkbox-line-height)\n);margin-block-start:var(\n--mod-checkbox-top-to-text,var(--spectrum-checkbox-top-to-text)\n);margin-inline-start:var(\n--mod-checkbox-text-to-control,var(--spectrum-checkbox-text-to-control)\n);text-align:start;transition:color var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out}#label:lang(ja),#label:lang(ko),#label:lang(zh){line-height:var(\n--mod-checkbox-line-height-cjk,var(--spectrum-checkbox-line-height-cjk)\n)}#input{block-size:100%;box-sizing:border-box;color:var(\n--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)\n);cursor:pointer;font-family:inherit;font-size:100%;inline-size:100%;line-height:1.15;margin:0;opacity:.0001;overflow:visible;padding:0;position:absolute;z-index:1}#input:disabled{cursor:default}#input:checked+#box:before{background-color:var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n);border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}#input:checked+#box #checkmark{opacity:1;transform:scale(1)}#input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#input.focus-visible+#box:after{box-shadow:0 0 0 var(\n--mod-checkbox-focus-indicator-thinkness,var(--spectrum-checkbox-focus-indicator-thickness)\n) var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);forced-color-adjust:none;margin:calc(var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n)*-1)}#input:focus-visible+#box:after{box-shadow:0 0 0 var(\n--mod-checkbox-focus-indicator-thinkness,var(--spectrum-checkbox-focus-indicator-thickness)\n) var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);forced-color-adjust:none;margin:calc(var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n)*-1)}#input.focus-visible+#label{color:var(\n--highcontrast-checkbox-content-color-focus,var(\n--mod-checkbox-content-color-focus,var(--spectrum-checkbox-content-color-focus)\n)\n)}#input:focus-visible+#label{color:var(\n--highcontrast-checkbox-content-color-focus,var(\n--mod-checkbox-content-color-focus,var(--spectrum-checkbox-content-color-focus)\n)\n)}#input.focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}#input:focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}#box{--spectrum-checkbox-spacing:calc(var(--mod-checkbox-height, var(--spectrum-checkbox-height)) - var(\n--mod-checkbox-control-size,\nvar(--spectrum-checkbox-control-size)\n));align-items:center;block-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);box-sizing:border-box;display:flex;flex-grow:0;flex-shrink:0;inline-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);justify-content:center;margin:calc(var(--mod-checkbox-spacing, var(--spectrum-checkbox-spacing))/2) 0;position:relative}#box:before{block-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)\n)\n);border-radius:var(\n--mod-checkbox-control-corner-radius,var(--spectrum-checkbox-control-corner-radius)\n);border-style:solid;border-width:var(\n--mod-checkbox-border-width,var(--spectrum-checkbox-border-width)\n);box-sizing:border-box;content:\"\";display:block;forced-color-adjust:none;inline-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);position:absolute;transition:border var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out,box-shadow var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out;z-index:0}#box:after{border-radius:calc(var(\n--mod-checkbox-control-corner-radius,\nvar(--spectrum-checkbox-control-corner-radius)\n) + var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n));content:\"\";display:block;inset-block:0;inset-inline:0;margin:var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n);position:absolute;transform:translate(0);transition:box-shadow var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-out,margin var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-out}#checkmark,#partialCheckmark{color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mode-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);opacity:0;transform:scale(0);transition:opacity var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out,transform var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out}#partialCheckmark{display:none}#input:checked:disabled+#box:before,#input:disabled+#box:before{background-color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);border-color:var(\n--highcontrast-checkbox-disabled-color-default,var(\n--mod-checkbox-control-color-disabled,var(--spectrum-checkbox-control-color-disabled)\n)\n)}#input:checked:disabled~#label,#input:disabled~#label{color:var(\n--highcontrast-checkbox-disabled-color-default,var(\n--mod-checkbox-content-color-disabled,var(--spectrum-checkbox-content-color-disabled)\n)\n);forced-color-adjust:none}@media (forced-colors:active){#input.focus-visible+#box{forced-color-adjust:none;outline-color:var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);outline-offset:var(\n--highcontrast-checkbox-focus-indicator-gap,var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n)\n);outline-style:auto;outline-width:var(\n--mod-focus-indicator-thickness,var(--spectrum-focus-indicator-thickness)\n)}#input:focus-visible+#box{forced-color-adjust:none;outline-color:var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);outline-offset:var(\n--highcontrast-checkbox-focus-indicator-gap,var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n)\n);outline-style:auto;outline-width:var(\n--mod-focus-indicator-thickness,var(--spectrum-focus-indicator-thickness)\n)}#input.focus-visible+#box:after{box-shadow:0 0 0 0 var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n)}#input:focus-visible+#box:after{box-shadow:0 0 0 0 var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n)}:host{--highcontrast-checkbox-content-color-default:CanvasText;--highcontrast-checkbox-content-color-hover:CanvasText;--highcontrast-checkbox-content-color-down:CanvasText;--highcontrast-checkbox-content-color-focus:CanvasText;--highcontrast-checkbox-background-color-default:Canvas;--highcontrast-checkbox-color-default:ButtonText;--highcontrast-checkbox-color-hover:ButtonText;--highcontrast-checkbox-color-focus:Highlight;--highcontrast-checkbox-highlight-color-default:Highlight;--highcontrast-checkbox-highlight-color-hover:Highlight;--highcontrast-checkbox-highlight-color-down:Highlight;--highcontrast-checkbox-highlight-color-focus:Highlight;--highcontrast-checkbox-disabled-color-default:GrayText;--highcontrast-checkbox-focus-indicator-color:CanvasText}}:host{--spectrum-checkbox-control-color-default:var(\n--system-spectrum-checkbox-control-color-default\n);--spectrum-checkbox-control-color-hover:var(\n--system-spectrum-checkbox-control-color-hover\n);--spectrum-checkbox-control-color-down:var(\n--system-spectrum-checkbox-control-color-down\n);--spectrum-checkbox-control-color-focus:var(\n--system-spectrum-checkbox-control-color-focus\n)}\n`;\nexport default styles;"],
|
|
5
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;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;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;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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoWf,eAAe;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -268,7 +268,9 @@ var(--spectrum-checkbox-control-size)
|
|
|
268
268
|
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
269
269
|
);box-sizing:border-box;display:flex;flex-grow:0;flex-shrink:0;inline-size:var(
|
|
270
270
|
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
271
|
-
);justify-content:center;margin:calc(var(--mod-checkbox-spacing, var(--spectrum-checkbox-spacing))/2) 0;position:relative}#box:before{
|
|
271
|
+
);justify-content:center;margin:calc(var(--mod-checkbox-spacing, var(--spectrum-checkbox-spacing))/2) 0;position:relative}#box:before{block-size:var(
|
|
272
|
+
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
273
|
+
);border-color:var(
|
|
272
274
|
--highcontrast-checkbox-color-default,var(
|
|
273
275
|
--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)
|
|
274
276
|
)
|
|
@@ -276,21 +278,19 @@ var(--spectrum-checkbox-control-size)
|
|
|
276
278
|
--mod-checkbox-control-corner-radius,var(--spectrum-checkbox-control-corner-radius)
|
|
277
279
|
);border-style:solid;border-width:var(
|
|
278
280
|
--mod-checkbox-border-width,var(--spectrum-checkbox-border-width)
|
|
279
|
-
);box-sizing:border-box;content:"";display:block;forced-color-adjust:none;
|
|
281
|
+
);box-sizing:border-box;content:"";display:block;forced-color-adjust:none;inline-size:var(
|
|
280
282
|
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
281
283
|
);position:absolute;transition:border var(
|
|
282
284
|
--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)
|
|
283
285
|
) ease-in-out,box-shadow var(
|
|
284
286
|
--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)
|
|
285
|
-
) ease-in-out;
|
|
286
|
-
--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)
|
|
287
|
-
);z-index:0}#box:after{border-radius:calc(var(
|
|
287
|
+
) ease-in-out;z-index:0}#box:after{border-radius:calc(var(
|
|
288
288
|
--mod-checkbox-control-corner-radius,
|
|
289
289
|
var(--spectrum-checkbox-control-corner-radius)
|
|
290
290
|
) + var(
|
|
291
291
|
--mod-checkbox-focus-indicator-gap,
|
|
292
292
|
var(--spectrum-checkbox-focus-indicator-gap)
|
|
293
|
-
));content:"";display:block;inset:0;margin:var(
|
|
293
|
+
));content:"";display:block;inset-block:0;inset-inline:0;margin:var(
|
|
294
294
|
--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)
|
|
295
295
|
);position:absolute;transform:translate(0);transition:box-shadow var(
|
|
296
296
|
--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["spectrum-checkbox.css.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2023 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-checkbox-content-color-default:var(\n--spectrum-neutral-content-color-default\n);--spectrum-checkbox-content-color-hover:var(\n--spectrum-neutral-content-color-hover\n);--spectrum-checkbox-content-color-down:var(\n--spectrum-neutral-content-color-down\n);--spectrum-checkbox-content-color-focus:var(\n--spectrum-neutral-content-color-key-focus\n);--spectrum-checkbox-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n);--spectrum-checkbox-content-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-checkbox-control-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-checkbox-checkmark-color:var(--spectrum-gray-75);--spectrum-checkbox-invalid-color-default:var(\n--spectrum-negative-color-900\n);--spectrum-checkbox-invalid-color-hover:var(\n--spectrum-negative-color-1000\n);--spectrum-checkbox-invalid-color-down:var(--spectrum-negative-color-1100);--spectrum-checkbox-invalid-color-focus:var(\n--spectrum-negative-color-1000\n);--spectrum-checkbox-emphasized-color-default:var(\n--spectrum-accent-color-900\n);--spectrum-checkbox-emphasized-color-hover:var(\n--spectrum-accent-color-1000\n);--spectrum-checkbox-emphasized-color-down:var(\n--spectrum-accent-color-1100\n);--spectrum-checkbox-emphasized-color-focus:var(\n--spectrum-accent-color-1000\n);--spectrum-checkbox-control-selected-color-default:var(\n--spectrum-neutral-background-color-selected-default\n);--spectrum-checkbox-control-selected-color-hover:var(\n--spectrum-neutral-background-color-selected-hover\n);--spectrum-checkbox-control-selected-color-down:var(\n--spectrum-neutral-background-color-selected-down\n);--spectrum-checkbox-control-selected-color-focus:var(\n--spectrum-neutral-background-color-selected-key-focus\n);--spectrum-checkbox-line-height:var(--spectrum-line-height-100);--spectrum-checkbox-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-checkbox-control-corner-radius:var(--spectrum-corner-radius-75);--spectrum-checkbox-focus-indicator-gap:var(\n--spectrum-focus-indicator-gap\n);--spectrum-checkbox-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-checkbox-border-width:var(--spectrum-border-width-200);--spectrum-checkbox-selected-border-width:calc(var(--spectrum-checkbox-control-size)/2);--spectrum-checkbox-animation-duration:var(\n--spectrum-animation-duration-100\n)}:host([size=s]){--spectrum-checkbox-font-size:var(--spectrum-font-size-75);--spectrum-checkbox-height:var(--spectrum-component-height-75);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-small\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-75);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-75)}:host{--spectrum-checkbox-font-size:var(--spectrum-font-size-100);--spectrum-checkbox-height:var(--spectrum-component-height-100);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-medium\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-100)}:host([size=l]){--spectrum-checkbox-font-size:var(--spectrum-font-size-200);--spectrum-checkbox-height:var(--spectrum-component-height-200);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-large\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-200);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-200)}:host([size=xl]){--spectrum-checkbox-font-size:var(--spectrum-font-size-300);--spectrum-checkbox-height:var(--spectrum-component-height-300);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-extra-large\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-300);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-300)}:host{align-items:flex-start;color:var(\n--highcontrast-checkbox-content-color-default,var(\n--mod-checkbox-content-color-default,var(--spectrum-checkbox-content-color-default)\n)\n);display:inline-flex;max-inline-size:100%;min-block-size:var(--mod-checkbox-height,var(--spectrum-checkbox-height));position:relative;vertical-align:top}:host(:hover) #box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-color-hover,var(--spectrum-checkbox-control-color-hover)\n)\n)}:host(:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-selected-color-hover,var(--spectrum-checkbox-control-selected-color-hover)\n)\n)}:host(:hover) #label{color:var(\n--highcontrast-checkbox-content-color-hover,var(\n--mod-checkbox-content-color-hover,var(--spectrum-checkbox-content-color-hover)\n)\n)}:host:active #box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-down,var(\n--mod-checkbox-control-color-down,var(--spectrum-checkbox-control-color-down)\n)\n)}:host:active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-down,var(\n--mod-checkbox-control-selected-color-down,var(--spectrum-checkbox-control-selected-color-down)\n)\n)}:host:active #label{color:var(\n--highcontrast-checkbox-content-color-down,var(\n--mod-checkbox-content-color-down,var(--spectrum-checkbox-content-color-down)\n)\n)}:host([invalid][invalid]) #box:before,:host([invalid][invalid]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-default,var(--spectrum-checkbox-invalid-color-default)\n)\n)}:host([invalid][invalid]) #input.focus-visible+#box:before,:host([invalid][invalid][indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid]) #input:focus-visible+#box:before,:host([invalid][invalid][indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid]:hover) #box:before,:host([invalid][invalid]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([readonly]){border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]:hover) #box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]):active #box:before{border-color:var(\n--highcontrast-checkbox-selected-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]) #input:checked:disabled+#box:before,:host([readonly]) #input:disabled+#box:before{background-color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]) #input:checked:disabled~#label,:host([readonly]) #input:disabled~#label{color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-content-color-default,var(--spectrum-checkbox-content-color-default)\n)\n);forced-color-adjust:none}:host([indeterminate]) #box:before,:host([indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}:host([indeterminate]) #box #checkmark,:host([indeterminate]) #input:checked+#box #checkmark{display:none}:host([indeterminate]) #box #partialCheckmark,:host([indeterminate]) #input:checked+#box #partialCheckmark{display:block;opacity:1;transform:scale(1)}:host([indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}:host([indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}:host([indeterminate]:hover) #box:before,:host([indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-selected-color-hover,var(--spectrum-checkbox-control-selected-color-hover)\n)\n)}:host([invalid][invalid][indeterminate]) #box:before,:host([invalid][invalid][indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-default,var(--spectrum-checkbox-invalid-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}:host([invalid][invalid][indeterminate]:hover) #box:before,:host([invalid][invalid][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid][indeterminate]:hover) #label{color:var(\n--highcontrast-checkbox-content-color-hover,var(\n--mod-checkbox-content-color-hover,var(--spectrum-checkbox-content-color-hover)\n)\n)}:host([emphasized]) #input:checked+#box:before,:host([emphasized][indeterminate]) #box:before,:host([emphasized][indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-emphasized-color-default,var(--spectrum-checkbox-emphasized-color-default)\n)\n)}:host([emphasized]:hover) #input:checked+#box:before,:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-emphasized-color-hover,var(--spectrum-checkbox-emphasized-color-hover)\n)\n)}:host([emphasized]) #input.focus-visible:checked+#box:before,:host([emphasized][indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-emphasized-color-focus,var(--spectrum-checkbox-emphasized-color-focus)\n)\n)}:host([emphasized]) #input:focus-visible:checked+#box:before,:host([emphasized][indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-emphasized-color-focus,var(--spectrum-checkbox-emphasized-color-focus)\n)\n)}:host([emphasized][invalid][invalid]) #input.focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-focus,var(--spectrum-checkbox-invalid-color-focus)\n)\n)}:host([emphasized][invalid][invalid]) #input:focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-focus,var(--spectrum-checkbox-invalid-color-focus)\n)\n)}:host([emphasized][invalid][invalid]:hover) #input:checked+#box:before,:host([emphasized][invalid][invalid][indeterminate]:hover) #box:before,:host([emphasized][invalid][invalid][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([emphasized]:hover) #input:checked+#box:before,:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-emphasized-color-hover,var(--spectrum-checkbox-emphasized-color-hover)\n)\n)}:host([emphasized]):active #input:checked+#box:before,:host([emphasized][indeterminate]):active #box:before,:host([emphasized][indeterminate]):active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-emphasized-color-down,var(--spectrum-checkbox-emphasized-color-down)\n)\n)}:host([emphasized][invalid][invalid]):active #box:before,:host([emphasized][invalid][invalid]):active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-invalid-color-down,var(--spectrum-checkbox-invalid-color-down)\n)\n)}:host([emphasized].focus-visible) #box:before,:host([emphasized].focus-visible) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}:host([emphasized]:focus-visible) #box:before,:host([emphasized]:focus-visible) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#label{font-size:var(\n--mod-checkbox-font-size,var(--spectrum-checkbox-font-size)\n);line-height:var(\n--mod-checkbox-line-height,var(--spectrum-checkbox-line-height)\n);margin-block-start:var(\n--mod-checkbox-top-to-text,var(--spectrum-checkbox-top-to-text)\n);margin-inline-start:var(\n--mod-checkbox-text-to-control,var(--spectrum-checkbox-text-to-control)\n);text-align:start;transition:color var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out}#label:lang(ja),#label:lang(ko),#label:lang(zh){line-height:var(\n--mod-checkbox-line-height-cjk,var(--spectrum-checkbox-line-height-cjk)\n)}#input{block-size:100%;box-sizing:border-box;color:var(\n--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)\n);cursor:pointer;font-family:inherit;font-size:100%;inline-size:100%;line-height:1.15;margin:0;opacity:.0001;overflow:visible;padding:0;position:absolute;z-index:1}#input:disabled{cursor:default}#input:checked+#box:before{background-color:var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n);border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}#input:checked+#box #checkmark{opacity:1;transform:scale(1)}#input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#input.focus-visible+#box:after{box-shadow:0 0 0 var(\n--mod-checkbox-focus-indicator-thinkness,var(--spectrum-checkbox-focus-indicator-thickness)\n) var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);forced-color-adjust:none;margin:calc(var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n)*-1)}#input:focus-visible+#box:after{box-shadow:0 0 0 var(\n--mod-checkbox-focus-indicator-thinkness,var(--spectrum-checkbox-focus-indicator-thickness)\n) var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);forced-color-adjust:none;margin:calc(var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n)*-1)}#input.focus-visible+#label{color:var(\n--highcontrast-checkbox-content-color-focus,var(\n--mod-checkbox-content-color-focus,var(--spectrum-checkbox-content-color-focus)\n)\n)}#input:focus-visible+#label{color:var(\n--highcontrast-checkbox-content-color-focus,var(\n--mod-checkbox-content-color-focus,var(--spectrum-checkbox-content-color-focus)\n)\n)}#input.focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}#input:focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}#box{--spectrum-checkbox-spacing:calc(var(--mod-checkbox-height, var(--spectrum-checkbox-height)) - var(\n--mod-checkbox-control-size,\nvar(--spectrum-checkbox-control-size)\n));align-items:center;block-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);box-sizing:border-box;display:flex;flex-grow:0;flex-shrink:0;inline-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);justify-content:center;margin:calc(var(--mod-checkbox-spacing, var(--spectrum-checkbox-spacing))/2) 0;position:relative}#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)\n)\n);border-radius:var(\n--mod-checkbox-control-corner-radius,var(--spectrum-checkbox-control-corner-radius)\n);border-style:solid;border-width:var(\n--mod-checkbox-border-width,var(--spectrum-checkbox-border-width)\n);box-sizing:border-box;content:\"\";display:block;forced-color-adjust:none;height:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);position:absolute;transition:border var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out,box-shadow var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out;width:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);z-index:0}#box:after{border-radius:calc(var(\n--mod-checkbox-control-corner-radius,\nvar(--spectrum-checkbox-control-corner-radius)\n) + var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n));content:\"\";display:block;inset:0;margin:var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n);position:absolute;transform:translate(0);transition:box-shadow var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-out,margin var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-out}#checkmark,#partialCheckmark{color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mode-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);opacity:0;transform:scale(0);transition:opacity var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out,transform var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out}#partialCheckmark{display:none}#input:checked:disabled+#box:before,#input:disabled+#box:before{background-color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);border-color:var(\n--highcontrast-checkbox-disabled-color-default,var(\n--mod-checkbox-control-color-disabled,var(--spectrum-checkbox-control-color-disabled)\n)\n)}#input:checked:disabled~#label,#input:disabled~#label{color:var(\n--highcontrast-checkbox-disabled-color-default,var(\n--mod-checkbox-content-color-disabled,var(--spectrum-checkbox-content-color-disabled)\n)\n);forced-color-adjust:none}@media (forced-colors:active){#input.focus-visible+#box{forced-color-adjust:none;outline-color:var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);outline-offset:var(\n--highcontrast-checkbox-focus-indicator-gap,var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n)\n);outline-style:auto;outline-width:var(\n--mod-focus-indicator-thickness,var(--spectrum-focus-indicator-thickness)\n)}#input:focus-visible+#box{forced-color-adjust:none;outline-color:var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);outline-offset:var(\n--highcontrast-checkbox-focus-indicator-gap,var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n)\n);outline-style:auto;outline-width:var(\n--mod-focus-indicator-thickness,var(--spectrum-focus-indicator-thickness)\n)}#input.focus-visible+#box:after{box-shadow:0 0 0 0 var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n)}#input:focus-visible+#box:after{box-shadow:0 0 0 0 var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n)}:host{--highcontrast-checkbox-content-color-default:CanvasText;--highcontrast-checkbox-content-color-hover:CanvasText;--highcontrast-checkbox-content-color-down:CanvasText;--highcontrast-checkbox-content-color-focus:CanvasText;--highcontrast-checkbox-background-color-default:Canvas;--highcontrast-checkbox-color-default:ButtonText;--highcontrast-checkbox-color-hover:ButtonText;--highcontrast-checkbox-color-focus:Highlight;--highcontrast-checkbox-highlight-color-default:Highlight;--highcontrast-checkbox-highlight-color-hover:Highlight;--highcontrast-checkbox-highlight-color-down:Highlight;--highcontrast-checkbox-highlight-color-focus:Highlight;--highcontrast-checkbox-disabled-color-default:GrayText;--highcontrast-checkbox-focus-indicator-color:CanvasText}}:host{--spectrum-checkbox-control-color-default:var(\n--system-spectrum-checkbox-control-color-default\n);--spectrum-checkbox-control-color-hover:var(\n--system-spectrum-checkbox-control-color-hover\n);--spectrum-checkbox-control-color-down:var(\n--system-spectrum-checkbox-control-color-down\n);--spectrum-checkbox-control-color-focus:var(\n--system-spectrum-checkbox-control-color-focus\n)}\n`;\nexport default styles;"],
|
|
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-checkbox-content-color-default:var(\n--spectrum-neutral-content-color-default\n);--spectrum-checkbox-content-color-hover:var(\n--spectrum-neutral-content-color-hover\n);--spectrum-checkbox-content-color-down:var(\n--spectrum-neutral-content-color-down\n);--spectrum-checkbox-content-color-focus:var(\n--spectrum-neutral-content-color-key-focus\n);--spectrum-checkbox-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n);--spectrum-checkbox-content-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-checkbox-control-color-disabled:var(\n--spectrum-disabled-content-color\n);--spectrum-checkbox-checkmark-color:var(--spectrum-gray-75);--spectrum-checkbox-invalid-color-default:var(\n--spectrum-negative-color-900\n);--spectrum-checkbox-invalid-color-hover:var(\n--spectrum-negative-color-1000\n);--spectrum-checkbox-invalid-color-down:var(--spectrum-negative-color-1100);--spectrum-checkbox-invalid-color-focus:var(\n--spectrum-negative-color-1000\n);--spectrum-checkbox-emphasized-color-default:var(\n--spectrum-accent-color-900\n);--spectrum-checkbox-emphasized-color-hover:var(\n--spectrum-accent-color-1000\n);--spectrum-checkbox-emphasized-color-down:var(\n--spectrum-accent-color-1100\n);--spectrum-checkbox-emphasized-color-focus:var(\n--spectrum-accent-color-1000\n);--spectrum-checkbox-control-selected-color-default:var(\n--spectrum-neutral-background-color-selected-default\n);--spectrum-checkbox-control-selected-color-hover:var(\n--spectrum-neutral-background-color-selected-hover\n);--spectrum-checkbox-control-selected-color-down:var(\n--spectrum-neutral-background-color-selected-down\n);--spectrum-checkbox-control-selected-color-focus:var(\n--spectrum-neutral-background-color-selected-key-focus\n);--spectrum-checkbox-line-height:var(--spectrum-line-height-100);--spectrum-checkbox-line-height-cjk:var(--spectrum-cjk-line-height-100);--spectrum-checkbox-control-corner-radius:var(--spectrum-corner-radius-75);--spectrum-checkbox-focus-indicator-gap:var(\n--spectrum-focus-indicator-gap\n);--spectrum-checkbox-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-checkbox-border-width:var(--spectrum-border-width-200);--spectrum-checkbox-selected-border-width:calc(var(--spectrum-checkbox-control-size)/2);--spectrum-checkbox-animation-duration:var(\n--spectrum-animation-duration-100\n)}:host([size=s]){--spectrum-checkbox-font-size:var(--spectrum-font-size-75);--spectrum-checkbox-height:var(--spectrum-component-height-75);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-small\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-75);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-75)}:host{--spectrum-checkbox-font-size:var(--spectrum-font-size-100);--spectrum-checkbox-height:var(--spectrum-component-height-100);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-medium\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-100);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-100)}:host([size=l]){--spectrum-checkbox-font-size:var(--spectrum-font-size-200);--spectrum-checkbox-height:var(--spectrum-component-height-200);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-large\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-200);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-200)}:host([size=xl]){--spectrum-checkbox-font-size:var(--spectrum-font-size-300);--spectrum-checkbox-height:var(--spectrum-component-height-300);--spectrum-checkbox-control-size:var(\n--spectrum-checkbox-control-size-extra-large\n);--spectrum-checkbox-top-to-text:var(--spectrum-component-top-to-text-300);--spectrum-checkbox-text-to-control:var(--spectrum-text-to-control-300)}:host{align-items:flex-start;color:var(\n--highcontrast-checkbox-content-color-default,var(\n--mod-checkbox-content-color-default,var(--spectrum-checkbox-content-color-default)\n)\n);display:inline-flex;max-inline-size:100%;min-block-size:var(--mod-checkbox-height,var(--spectrum-checkbox-height));position:relative;vertical-align:top}:host(:hover) #box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-color-hover,var(--spectrum-checkbox-control-color-hover)\n)\n)}:host(:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-selected-color-hover,var(--spectrum-checkbox-control-selected-color-hover)\n)\n)}:host(:hover) #label{color:var(\n--highcontrast-checkbox-content-color-hover,var(\n--mod-checkbox-content-color-hover,var(--spectrum-checkbox-content-color-hover)\n)\n)}:host:active #box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-down,var(\n--mod-checkbox-control-color-down,var(--spectrum-checkbox-control-color-down)\n)\n)}:host:active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-down,var(\n--mod-checkbox-control-selected-color-down,var(--spectrum-checkbox-control-selected-color-down)\n)\n)}:host:active #label{color:var(\n--highcontrast-checkbox-content-color-down,var(\n--mod-checkbox-content-color-down,var(--spectrum-checkbox-content-color-down)\n)\n)}:host([invalid][invalid]) #box:before,:host([invalid][invalid]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-default,var(--spectrum-checkbox-invalid-color-default)\n)\n)}:host([invalid][invalid]) #input.focus-visible+#box:before,:host([invalid][invalid][indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid]) #input:focus-visible+#box:before,:host([invalid][invalid][indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid]:hover) #box:before,:host([invalid][invalid]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([readonly]){border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]:hover) #box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]):active #box:before{border-color:var(\n--highcontrast-checkbox-selected-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]) #input:checked:disabled+#box:before,:host([readonly]) #input:disabled+#box:before{background-color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n)}:host([readonly]) #input:checked:disabled~#label,:host([readonly]) #input:disabled~#label{color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-content-color-default,var(--spectrum-checkbox-content-color-default)\n)\n);forced-color-adjust:none}:host([indeterminate]) #box:before,:host([indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}:host([indeterminate]) #box #checkmark,:host([indeterminate]) #input:checked+#box #checkmark{display:none}:host([indeterminate]) #box #partialCheckmark,:host([indeterminate]) #input:checked+#box #partialCheckmark{display:block;opacity:1;transform:scale(1)}:host([indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}:host([indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}:host([indeterminate]:hover) #box:before,:host([indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-control-selected-color-hover,var(--spectrum-checkbox-control-selected-color-hover)\n)\n)}:host([invalid][invalid][indeterminate]) #box:before,:host([invalid][invalid][indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-default,var(--spectrum-checkbox-invalid-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}:host([invalid][invalid][indeterminate]:hover) #box:before,:host([invalid][invalid][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([invalid][invalid][indeterminate]:hover) #label{color:var(\n--highcontrast-checkbox-content-color-hover,var(\n--mod-checkbox-content-color-hover,var(--spectrum-checkbox-content-color-hover)\n)\n)}:host([emphasized]) #input:checked+#box:before,:host([emphasized][indeterminate]) #box:before,:host([emphasized][indeterminate]) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-emphasized-color-default,var(--spectrum-checkbox-emphasized-color-default)\n)\n)}:host([emphasized]:hover) #input:checked+#box:before,:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-emphasized-color-hover,var(--spectrum-checkbox-emphasized-color-hover)\n)\n)}:host([emphasized]) #input.focus-visible:checked+#box:before,:host([emphasized][indeterminate]) #input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-emphasized-color-focus,var(--spectrum-checkbox-emphasized-color-focus)\n)\n)}:host([emphasized]) #input:focus-visible:checked+#box:before,:host([emphasized][indeterminate]) #input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-emphasized-color-focus,var(--spectrum-checkbox-emphasized-color-focus)\n)\n)}:host([emphasized][invalid][invalid]) #input.focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-focus,var(--spectrum-checkbox-invalid-color-focus)\n)\n)}:host([emphasized][invalid][invalid]) #input:focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-invalid-color-focus,var(--spectrum-checkbox-invalid-color-focus)\n)\n)}:host([emphasized][invalid][invalid]:hover) #input:checked+#box:before,:host([emphasized][invalid][invalid][indeterminate]:hover) #box:before,:host([emphasized][invalid][invalid][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-hover,var(\n--mod-checkbox-invalid-color-hover,var(--spectrum-checkbox-invalid-color-hover)\n)\n)}:host([emphasized]:hover) #input:checked+#box:before,:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-hover,var(\n--mod-checkbox-emphasized-color-hover,var(--spectrum-checkbox-emphasized-color-hover)\n)\n)}:host([emphasized]):active #input:checked+#box:before,:host([emphasized][indeterminate]):active #box:before,:host([emphasized][indeterminate]):active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-emphasized-color-down,var(--spectrum-checkbox-emphasized-color-down)\n)\n)}:host([emphasized][invalid][invalid]):active #box:before,:host([emphasized][invalid][invalid]):active #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-invalid-color-down,var(--spectrum-checkbox-invalid-color-down)\n)\n)}:host([emphasized].focus-visible) #box:before,:host([emphasized].focus-visible) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}:host([emphasized]:focus-visible) #box:before,:host([emphasized]:focus-visible) #input:checked+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#label{font-size:var(\n--mod-checkbox-font-size,var(--spectrum-checkbox-font-size)\n);line-height:var(\n--mod-checkbox-line-height,var(--spectrum-checkbox-line-height)\n);margin-block-start:var(\n--mod-checkbox-top-to-text,var(--spectrum-checkbox-top-to-text)\n);margin-inline-start:var(\n--mod-checkbox-text-to-control,var(--spectrum-checkbox-text-to-control)\n);text-align:start;transition:color var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out}#label:lang(ja),#label:lang(ko),#label:lang(zh){line-height:var(\n--mod-checkbox-line-height-cjk,var(--spectrum-checkbox-line-height-cjk)\n)}#input{block-size:100%;box-sizing:border-box;color:var(\n--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)\n);cursor:pointer;font-family:inherit;font-size:100%;inline-size:100%;line-height:1.15;margin:0;opacity:.0001;overflow:visible;padding:0;position:absolute;z-index:1}#input:disabled{cursor:default}#input:checked+#box:before{background-color:var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n);border-color:var(\n--highcontrast-checkbox-highlight-color-default,var(\n--mod-checkbox-control-selected-color-default,var(--spectrum-checkbox-control-selected-color-default)\n)\n);border-width:var(\n--mod-checkbox-selected-border-width,var(--spectrum-checkbox-selected-border-width)\n)}#input:checked+#box #checkmark{opacity:1;transform:scale(1)}#input.focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#input:focus-visible+#box:before{border-color:var(\n--highcontrast-checkbox-color-focus,var(\n--mod-checkbox-control-color-focus,var(--spectrum-checkbox-control-color-focus)\n)\n)}#input.focus-visible+#box:after{box-shadow:0 0 0 var(\n--mod-checkbox-focus-indicator-thinkness,var(--spectrum-checkbox-focus-indicator-thickness)\n) var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);forced-color-adjust:none;margin:calc(var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n)*-1)}#input:focus-visible+#box:after{box-shadow:0 0 0 var(\n--mod-checkbox-focus-indicator-thinkness,var(--spectrum-checkbox-focus-indicator-thickness)\n) var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);forced-color-adjust:none;margin:calc(var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n)*-1)}#input.focus-visible+#label{color:var(\n--highcontrast-checkbox-content-color-focus,var(\n--mod-checkbox-content-color-focus,var(--spectrum-checkbox-content-color-focus)\n)\n)}#input:focus-visible+#label{color:var(\n--highcontrast-checkbox-content-color-focus,var(\n--mod-checkbox-content-color-focus,var(--spectrum-checkbox-content-color-focus)\n)\n)}#input.focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}#input:focus-visible:checked+#box:before{border-color:var(\n--highcontrast-checkbox-highlight-color-focus,var(\n--mod-checkbox-control-selected-color-focus,var(--spectrum-checkbox-control-selected-color-focus)\n)\n)}#box{--spectrum-checkbox-spacing:calc(var(--mod-checkbox-height, var(--spectrum-checkbox-height)) - var(\n--mod-checkbox-control-size,\nvar(--spectrum-checkbox-control-size)\n));align-items:center;block-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);box-sizing:border-box;display:flex;flex-grow:0;flex-shrink:0;inline-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);justify-content:center;margin:calc(var(--mod-checkbox-spacing, var(--spectrum-checkbox-spacing))/2) 0;position:relative}#box:before{block-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);border-color:var(\n--highcontrast-checkbox-color-default,var(\n--mod-checkbox-control-color-default,var(--spectrum-checkbox-control-color-default)\n)\n);border-radius:var(\n--mod-checkbox-control-corner-radius,var(--spectrum-checkbox-control-corner-radius)\n);border-style:solid;border-width:var(\n--mod-checkbox-border-width,var(--spectrum-checkbox-border-width)\n);box-sizing:border-box;content:\"\";display:block;forced-color-adjust:none;inline-size:var(\n--mod-checkbox-control-size,var(--spectrum-checkbox-control-size)\n);position:absolute;transition:border var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out,box-shadow var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out;z-index:0}#box:after{border-radius:calc(var(\n--mod-checkbox-control-corner-radius,\nvar(--spectrum-checkbox-control-corner-radius)\n) + var(\n--mod-checkbox-focus-indicator-gap,\nvar(--spectrum-checkbox-focus-indicator-gap)\n));content:\"\";display:block;inset-block:0;inset-inline:0;margin:var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n);position:absolute;transform:translate(0);transition:box-shadow var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-out,margin var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-out}#checkmark,#partialCheckmark{color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mode-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);opacity:0;transform:scale(0);transition:opacity var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out,transform var(\n--mod-checkbox-animation-duration,var(--spectrum-checkbox-animation-duration)\n) ease-in-out}#partialCheckmark{display:none}#input:checked:disabled+#box:before,#input:disabled+#box:before{background-color:var(\n--highcontrast-checkbox-background-color-default,var(\n--mod-checkbox-checkmark-color,var(--spectrum-checkbox-checkmark-color)\n)\n);border-color:var(\n--highcontrast-checkbox-disabled-color-default,var(\n--mod-checkbox-control-color-disabled,var(--spectrum-checkbox-control-color-disabled)\n)\n)}#input:checked:disabled~#label,#input:disabled~#label{color:var(\n--highcontrast-checkbox-disabled-color-default,var(\n--mod-checkbox-content-color-disabled,var(--spectrum-checkbox-content-color-disabled)\n)\n);forced-color-adjust:none}@media (forced-colors:active){#input.focus-visible+#box{forced-color-adjust:none;outline-color:var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);outline-offset:var(\n--highcontrast-checkbox-focus-indicator-gap,var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n)\n);outline-style:auto;outline-width:var(\n--mod-focus-indicator-thickness,var(--spectrum-focus-indicator-thickness)\n)}#input:focus-visible+#box{forced-color-adjust:none;outline-color:var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n);outline-offset:var(\n--highcontrast-checkbox-focus-indicator-gap,var(\n--mod-checkbox-focus-indicator-gap,var(--spectrum-checkbox-focus-indicator-gap)\n)\n);outline-style:auto;outline-width:var(\n--mod-focus-indicator-thickness,var(--spectrum-focus-indicator-thickness)\n)}#input.focus-visible+#box:after{box-shadow:0 0 0 0 var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n)}#input:focus-visible+#box:after{box-shadow:0 0 0 0 var(\n--highcontrast-checkbox-focus-indicator-color,var(\n--mod-checkbox-focus-indicator-color,var(--spectrum-checkbox-focus-indicator-color)\n)\n)}:host{--highcontrast-checkbox-content-color-default:CanvasText;--highcontrast-checkbox-content-color-hover:CanvasText;--highcontrast-checkbox-content-color-down:CanvasText;--highcontrast-checkbox-content-color-focus:CanvasText;--highcontrast-checkbox-background-color-default:Canvas;--highcontrast-checkbox-color-default:ButtonText;--highcontrast-checkbox-color-hover:ButtonText;--highcontrast-checkbox-color-focus:Highlight;--highcontrast-checkbox-highlight-color-default:Highlight;--highcontrast-checkbox-highlight-color-hover:Highlight;--highcontrast-checkbox-highlight-color-down:Highlight;--highcontrast-checkbox-highlight-color-focus:Highlight;--highcontrast-checkbox-disabled-color-default:GrayText;--highcontrast-checkbox-focus-indicator-color:CanvasText}}:host{--spectrum-checkbox-control-color-default:var(\n--system-spectrum-checkbox-control-color-default\n);--spectrum-checkbox-control-color-hover:var(\n--system-spectrum-checkbox-control-color-hover\n);--spectrum-checkbox-control-color-down:var(\n--system-spectrum-checkbox-control-color-down\n);--spectrum-checkbox-control-color-focus:var(\n--system-spectrum-checkbox-control-color-focus\n)}\n`;\nexport default styles;"],
|
|
5
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;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;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;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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAoWf,eAAeC",
|
|
6
6
|
"names": ["css", "styles"]
|
|
7
7
|
}
|
package/test/checkbox.test.js
CHANGED
|
@@ -199,6 +199,11 @@ describe("Checkbox", () => {
|
|
|
199
199
|
await elementUpdated(el);
|
|
200
200
|
expect(el.checked).to.be.true;
|
|
201
201
|
});
|
|
202
|
+
it("should recognize readonly property", async () => {
|
|
203
|
+
const el = await fixture("<sp-checkbox></sp-checkbox>");
|
|
204
|
+
expect(el.readonly).to.not.throw;
|
|
205
|
+
expect(el.readonly).to.be.a("boolean");
|
|
206
|
+
});
|
|
202
207
|
it("maintains its value when [readonly]", async () => {
|
|
203
208
|
const el = await fixture(html`
|
|
204
209
|
<sp-checkbox id="checkbox0" checked readonly>Component</sp-checkbox>
|
|
@@ -244,5 +249,53 @@ describe("Checkbox", () => {
|
|
|
244
249
|
expect(inputEl.checked).to.be.true;
|
|
245
250
|
expect(inputEl.indeterminate).to.be.false;
|
|
246
251
|
});
|
|
252
|
+
it("updates checkmark icons in response to size", async function() {
|
|
253
|
+
const el = await fixture(html`
|
|
254
|
+
<sp-checkbox checked>sizes checkbox</sp-checkbox>
|
|
255
|
+
`);
|
|
256
|
+
const getCheckmarkLocalName = () => {
|
|
257
|
+
return el.shadowRoot.querySelector("#checkmark").localName;
|
|
258
|
+
};
|
|
259
|
+
expect(el.size).to.equal("m");
|
|
260
|
+
let checkmarkLocalname = getCheckmarkLocalName();
|
|
261
|
+
el.size = "s";
|
|
262
|
+
await elementUpdated(el);
|
|
263
|
+
expect(getCheckmarkLocalName()).to.not.equal(checkmarkLocalname);
|
|
264
|
+
checkmarkLocalname = getCheckmarkLocalName();
|
|
265
|
+
el.size = "l";
|
|
266
|
+
await elementUpdated(el);
|
|
267
|
+
expect(getCheckmarkLocalName()).to.not.equal(checkmarkLocalname);
|
|
268
|
+
checkmarkLocalname = getCheckmarkLocalName();
|
|
269
|
+
el.size = "xl";
|
|
270
|
+
await elementUpdated(el);
|
|
271
|
+
expect(getCheckmarkLocalName()).to.not.equal(checkmarkLocalname);
|
|
272
|
+
});
|
|
273
|
+
it("updates partialCheckmark icons in response to size", async function() {
|
|
274
|
+
const el = await fixture(html`
|
|
275
|
+
<sp-checkbox indeterminate>sizes checkbox</sp-checkbox>
|
|
276
|
+
`);
|
|
277
|
+
const getPartialCheckmarkLocalName = () => {
|
|
278
|
+
return el.shadowRoot.querySelector("#partialCheckmark").localName;
|
|
279
|
+
};
|
|
280
|
+
expect(el.size).to.equal("m");
|
|
281
|
+
let partialCheckmarkLocalname = getPartialCheckmarkLocalName();
|
|
282
|
+
el.size = "s";
|
|
283
|
+
await elementUpdated(el);
|
|
284
|
+
expect(getPartialCheckmarkLocalName()).to.not.equal(
|
|
285
|
+
partialCheckmarkLocalname
|
|
286
|
+
);
|
|
287
|
+
partialCheckmarkLocalname = getPartialCheckmarkLocalName();
|
|
288
|
+
el.size = "l";
|
|
289
|
+
await elementUpdated(el);
|
|
290
|
+
expect(getPartialCheckmarkLocalName()).to.not.equal(
|
|
291
|
+
partialCheckmarkLocalname
|
|
292
|
+
);
|
|
293
|
+
partialCheckmarkLocalname = getPartialCheckmarkLocalName();
|
|
294
|
+
el.size = "xl";
|
|
295
|
+
await elementUpdated(el);
|
|
296
|
+
expect(getPartialCheckmarkLocalName()).to.not.equal(
|
|
297
|
+
partialCheckmarkLocalname
|
|
298
|
+
);
|
|
299
|
+
});
|
|
247
300
|
});
|
|
248
301
|
//# sourceMappingURL=checkbox.test.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["checkbox.test.ts"],
|
|
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/checkbox/sp-checkbox.js';\nimport { Checkbox } from '../';\nimport {\n elementUpdated,\n expect,\n fixture,\n html,\n triggerBlurFor,\n waitUntil,\n} from '@open-wc/testing';\nimport '@spectrum-web-components/shared/src/focus-visible.js';\nimport { testForLitDevWarnings } from '../../../test/testing-helpers.js';\nimport { a11ySnapshot, findAccessibilityNode } from '@web/test-runner-commands';\n\nfunction inputForCheckbox(checkbox: Checkbox): HTMLInputElement {\n if (!checkbox.shadowRoot) throw new Error('No shadowRoot');\n return checkbox.shadowRoot.querySelector('#input') as HTMLInputElement;\n}\n\nfunction labelForCheckbox(checkbox: Checkbox): HTMLLabelElement {\n if (!checkbox.shadowRoot) throw new Error('No shadowRoot');\n const labelEl = checkbox.shadowRoot.querySelector('label');\n if (!labelEl) {\n throw new Error('Failed to find label in shadowRoot');\n }\n return labelEl;\n}\n\nfunction labelNodeForCheckbox(checkbox: Checkbox): Node {\n if (!checkbox.shadowRoot) throw new Error('No shadowRoot');\n const slotEl = checkbox.shadowRoot.querySelector('slot');\n if (!slotEl) {\n throw new Error('Failed to find slot in shadowRoot');\n }\n return slotEl.assignedNodes()[0];\n}\ndescribe('Checkbox', () => {\n let testFixture: HTMLDivElement;\n\n beforeEach(async () => {\n testFixture = await fixture<HTMLDivElement>(\n html`\n <div>\n <div id=\"test-checkbox\">\n <sp-checkbox id=\"checkbox0\" tabindex=\"5\">\n Component\n </sp-checkbox>\n <sp-checkbox id=\"checkbox1\" tabindex=\"2\" checked>\n Check 1\n </sp-checkbox>\n <sp-checkbox id=\"checkbox2\" tabindex=\"3\" disabled>\n Check 2\n </sp-checkbox>\n <sp-checkbox id=\"checkbox3\" tabindex=\"1\" autofocus>\n Check 3\n </sp-checkbox>\n <sp-checkbox id=\"checkbox4\" tabindex=\"0\">\n Check 4\n </sp-checkbox>\n <sp-checkbox id=\"checkbox5\" tabindex=\"-1\">\n Check 5\n </sp-checkbox>\n </div>\n </div>\n `\n );\n });\n\n it('loads', async () => {\n const el = testFixture.querySelector('sp-checkbox') as Checkbox;\n expect(el).to.not.equal(undefined);\n const textNode = labelNodeForCheckbox(el);\n const content = (textNode.textContent || '').trim();\n expect(content).to.equal('Component');\n });\n testForLitDevWarnings(\n async () =>\n await fixture<Checkbox>(\n html`\n <sp-checkbox>Not Checked</sp-checkbox>\n `\n )\n );\n\n it('loads default checkbox accessibly', async () => {\n const el = await fixture<Checkbox>(\n html`\n <sp-checkbox>Not Checked</sp-checkbox>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n\n const labelEl = labelForCheckbox(el);\n const inputEl = inputForCheckbox(el);\n\n expect(labelEl.getAttribute('for')).to.equal(inputEl.id);\n expect(inputEl.checked).to.be.false;\n expect(inputEl.indeterminate).to.be.false;\n\n type NamedRoledAndCheckedNode = {\n name: string;\n role: string;\n checked: boolean;\n };\n const snapshot = (await a11ySnapshot(\n {}\n )) as unknown as NamedRoledAndCheckedNode & {\n children: NamedRoledAndCheckedNode[];\n };\n expect(\n findAccessibilityNode<NamedRoledAndCheckedNode>(\n snapshot,\n (node) =>\n node.role === 'checkbox' &&\n !node.checked &&\n node.name === 'Not Checked'\n ),\n 'Has a named and not checked \"checkbox\" element'\n ).to.not.be.null;\n });\n\n it('loads `checked` checkbox accessibly', async () => {\n const el = await fixture<Checkbox>(\n html`\n <sp-checkbox checked>Checked</sp-checkbox>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n\n const labelEl = labelForCheckbox(el);\n const inputEl = inputForCheckbox(el);\n\n expect(labelEl.getAttribute('for')).to.equal(inputEl.id);\n expect(inputEl.checked).to.be.true;\n expect(inputEl.indeterminate).to.be.false;\n\n type NamedRoledAndCheckedNode = {\n name: string;\n role: string;\n checked: boolean;\n };\n const snapshot = (await a11ySnapshot(\n {}\n )) as unknown as NamedRoledAndCheckedNode & {\n children: NamedRoledAndCheckedNode[];\n };\n expect(\n findAccessibilityNode<NamedRoledAndCheckedNode>(\n snapshot,\n (node) =>\n node.role === 'checkbox' &&\n node.checked &&\n node.name === 'Checked'\n ),\n 'Has a named and checked \"checkbox\" element'\n ).to.not.be.null;\n });\n\n it('is `invalid` checkbox accessibly', async () => {\n const el = await fixture<Checkbox>(\n html`\n <sp-checkbox invalid>Invalid Not Checked</sp-checkbox>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n\n const labelEl = labelForCheckbox(el);\n const inputEl = inputForCheckbox(el);\n\n expect(labelEl.getAttribute('for')).to.equal(inputEl.id);\n expect(inputEl).to.have.attribute('aria-invalid', 'true');\n });\n\n it('autofocuses', async () => {\n const autoElement = testFixture.querySelector(\n 'sp-checkbox[autofocus]'\n ) as Checkbox;\n\n expect(autoElement).to.exist;\n await waitUntil(\n () => document.activeElement === autoElement,\n 'Autofocused'\n );\n\n await triggerBlurFor(autoElement);\n\n expect(document.activeElement).to.not.equal(autoElement);\n });\n\n it('`click()`ing host clicks `focusElement`', async () => {\n const el = await fixture<Checkbox>(\n html`\n <sp-checkbox checked autofocus>Checked</sp-checkbox>\n `\n );\n\n await elementUpdated(el);\n\n expect(el.checked, 'checked initially').to.be.true;\n\n el.click();\n await elementUpdated(el);\n\n expect(el.checked, 'unchecked').to.be.false;\n\n el.click();\n await elementUpdated(el);\n\n expect(el.checked, 'checked again').to.be.true;\n });\n\n it('respects checked attribute', () => {\n let el = testFixture.querySelector('#checkbox0') as Checkbox;\n expect(el.checked).to.be.false;\n\n el = testFixture.querySelector('#checkbox1') as Checkbox;\n expect(el.checked).to.be.true;\n });\n\n it('has name attribute', () => {\n let el = testFixture.querySelector('#checkbox0') as Checkbox;\n\n el = testFixture.querySelector('#checkbox1') as Checkbox;\n expect(el.hasAttribute('name'));\n expect(el.name).to.be.undefined;\n el.setAttribute('name', 'test');\n expect(el.name).to.be.equal('test');\n });\n\n it('handles click events', async () => {\n const el = testFixture.querySelector('#checkbox1') as Checkbox;\n expect(el.checked).to.be.true;\n\n inputForCheckbox(el).click();\n await elementUpdated(el);\n\n expect(el.checked).to.be.false;\n });\n\n it('can have `change` events cancelled', async () => {\n const el = testFixture.querySelector('#checkbox0') as Checkbox;\n await elementUpdated(el);\n expect(el.checked).to.be.false;\n\n inputForCheckbox(el).click();\n await elementUpdated(el);\n\n expect(el.checked).to.be.true;\n\n el.addEventListener('change', (event: Event) => event.preventDefault());\n inputForCheckbox(el).click();\n await elementUpdated(el);\n\n expect(el.checked).to.be.true;\n });\n\n it('maintains its value when [readonly]', async () => {\n const el = await fixture<Checkbox>(html`\n <sp-checkbox id=\"checkbox0\" checked readonly>Component</sp-checkbox>\n `);\n expect(el.checked).to.be.true;\n\n inputForCheckbox(el).click();\n await elementUpdated(el);\n\n expect(el.checked).to.be.true;\n });\n\n it('`indeterminate, checked` becomes `not checked` on click', async () => {\n const el = await fixture<Checkbox>(html`\n <sp-checkbox checked .indeterminate=${true}>\n indeterminate, checked\n </sp-checkbox>\n `);\n expect(el.checked).to.be.true;\n expect(el.indeterminate).to.be.true;\n\n const inputEl = inputForCheckbox(el);\n expect(inputEl.checked).to.be.true;\n expect(inputEl.indeterminate).to.be.true;\n\n el.click();\n await elementUpdated(el);\n\n expect(el.checked).to.be.false;\n expect(el.indeterminate).to.be.false;\n expect(inputEl.checked).to.be.false;\n expect(inputEl.indeterminate).to.be.false;\n });\n\n it('`indeterminate, not checked` becomes `checked` on click', async () => {\n const el = await fixture<Checkbox>(html`\n <sp-checkbox .indeterminate=${true}>\n indeterminate, checked\n </sp-checkbox>\n `);\n expect(el.checked).to.be.false;\n expect(el.indeterminate).to.be.true;\n\n const inputEl = inputForCheckbox(el);\n expect(inputEl.checked).to.be.false;\n expect(inputEl.indeterminate).to.be.true;\n\n el.click();\n await elementUpdated(el);\n\n expect(el.checked).to.be.true;\n expect(el.indeterminate).to.be.false;\n expect(inputEl.checked).to.be.true;\n expect(inputEl.indeterminate).to.be.false;\n });\n});\n"],
|
|
5
|
-
"mappings": ";AAYA,OAAO;AAEP;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACG;AACP,OAAO;AACP,SAAS,6BAA6B;AACtC,SAAS,cAAc,6BAA6B;AAEpD,SAAS,iBAAiB,UAAsC;AAC5D,MAAI,CAAC,SAAS;AAAY,UAAM,IAAI,MAAM,eAAe;AACzD,SAAO,SAAS,WAAW,cAAc,QAAQ;AACrD;AAEA,SAAS,iBAAiB,UAAsC;AAC5D,MAAI,CAAC,SAAS;AAAY,UAAM,IAAI,MAAM,eAAe;AACzD,QAAM,UAAU,SAAS,WAAW,cAAc,OAAO;AACzD,MAAI,CAAC,SAAS;AACV,UAAM,IAAI,MAAM,oCAAoC;AAAA,EACxD;AACA,SAAO;AACX;AAEA,SAAS,qBAAqB,UAA0B;AACpD,MAAI,CAAC,SAAS;AAAY,UAAM,IAAI,MAAM,eAAe;AACzD,QAAM,SAAS,SAAS,WAAW,cAAc,MAAM;AACvD,MAAI,CAAC,QAAQ;AACT,UAAM,IAAI,MAAM,mCAAmC;AAAA,EACvD;AACA,SAAO,OAAO,cAAc,EAAE,CAAC;AACnC;AACA,SAAS,YAAY,MAAM;AACvB,MAAI;AAEJ,aAAW,YAAY;AACnB,kBAAc,MAAM;AAAA,MAChB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAwBJ;AAAA,EACJ,CAAC;AAED,KAAG,SAAS,YAAY;AACpB,UAAM,KAAK,YAAY,cAAc,aAAa;AAClD,WAAO,EAAE,EAAE,GAAG,IAAI,MAAM,MAAS;AACjC,UAAM,WAAW,qBAAqB,EAAE;AACxC,UAAM,WAAW,SAAS,eAAe,IAAI,KAAK;AAClD,WAAO,OAAO,EAAE,GAAG,MAAM,WAAW;AAAA,EACxC,CAAC;AACD;AAAA,IACI,YACI,MAAM;AAAA,MACF;AAAA;AAAA;AAAA,IAGJ;AAAA,EACR;AAEA,KAAG,qCAAqC,YAAY;AAChD,UAAM,KAAK,MAAM;AAAA,MACb;AAAA;AAAA;AAAA,IAGJ;AAEA,UAAM,eAAe,EAAE;AAEvB,UAAM,OAAO,EAAE,EAAE,GAAG,GAAG,WAAW;AAElC,UAAM,UAAU,iBAAiB,EAAE;AACnC,UAAM,UAAU,iBAAiB,EAAE;AAEnC,WAAO,QAAQ,aAAa,KAAK,CAAC,EAAE,GAAG,MAAM,QAAQ,EAAE;AACvD,WAAO,QAAQ,OAAO,EAAE,GAAG,GAAG;AAC9B,WAAO,QAAQ,aAAa,EAAE,GAAG,GAAG;AAOpC,UAAM,WAAY,MAAM;AAAA,MACpB,CAAC;AAAA,IACL;AAGA;AAAA,MACI;AAAA,QACI;AAAA,QACA,CAAC,SACG,KAAK,SAAS,cACd,CAAC,KAAK,WACN,KAAK,SAAS;AAAA,MACtB;AAAA,MACA;AAAA,IACJ,EAAE,GAAG,IAAI,GAAG;AAAA,EAChB,CAAC;AAED,KAAG,uCAAuC,YAAY;AAClD,UAAM,KAAK,MAAM;AAAA,MACb;AAAA;AAAA;AAAA,IAGJ;AAEA,UAAM,eAAe,EAAE;AAEvB,UAAM,OAAO,EAAE,EAAE,GAAG,GAAG,WAAW;AAElC,UAAM,UAAU,iBAAiB,EAAE;AACnC,UAAM,UAAU,iBAAiB,EAAE;AAEnC,WAAO,QAAQ,aAAa,KAAK,CAAC,EAAE,GAAG,MAAM,QAAQ,EAAE;AACvD,WAAO,QAAQ,OAAO,EAAE,GAAG,GAAG;AAC9B,WAAO,QAAQ,aAAa,EAAE,GAAG,GAAG;AAOpC,UAAM,WAAY,MAAM;AAAA,MACpB,CAAC;AAAA,IACL;AAGA;AAAA,MACI;AAAA,QACI;AAAA,QACA,CAAC,SACG,KAAK,SAAS,cACd,KAAK,WACL,KAAK,SAAS;AAAA,MACtB;AAAA,MACA;AAAA,IACJ,EAAE,GAAG,IAAI,GAAG;AAAA,EAChB,CAAC;AAED,KAAG,oCAAoC,YAAY;AAC/C,UAAM,KAAK,MAAM;AAAA,MACb;AAAA;AAAA;AAAA,IAGJ;AAEA,UAAM,eAAe,EAAE;AAEvB,UAAM,OAAO,EAAE,EAAE,GAAG,GAAG,WAAW;AAElC,UAAM,UAAU,iBAAiB,EAAE;AACnC,UAAM,UAAU,iBAAiB,EAAE;AAEnC,WAAO,QAAQ,aAAa,KAAK,CAAC,EAAE,GAAG,MAAM,QAAQ,EAAE;AACvD,WAAO,OAAO,EAAE,GAAG,KAAK,UAAU,gBAAgB,MAAM;AAAA,EAC5D,CAAC;AAED,KAAG,eAAe,YAAY;AAC1B,UAAM,cAAc,YAAY;AAAA,MAC5B;AAAA,IACJ;AAEA,WAAO,WAAW,EAAE,GAAG;AACvB,UAAM;AAAA,MACF,MAAM,SAAS,kBAAkB;AAAA,MACjC;AAAA,IACJ;AAEA,UAAM,eAAe,WAAW;AAEhC,WAAO,SAAS,aAAa,EAAE,GAAG,IAAI,MAAM,WAAW;AAAA,EAC3D,CAAC;AAED,KAAG,2CAA2C,YAAY;AACtD,UAAM,KAAK,MAAM;AAAA,MACb;AAAA;AAAA;AAAA,IAGJ;AAEA,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,SAAS,mBAAmB,EAAE,GAAG,GAAG;AAE9C,OAAG,MAAM;AACT,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,SAAS,WAAW,EAAE,GAAG,GAAG;AAEtC,OAAG,MAAM;AACT,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,SAAS,eAAe,EAAE,GAAG,GAAG;AAAA,EAC9C,CAAC;AAED,KAAG,8BAA8B,MAAM;AACnC,QAAI,KAAK,YAAY,cAAc,YAAY;AAC/C,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AAEzB,SAAK,YAAY,cAAc,YAAY;AAC3C,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AAAA,EAC7B,CAAC;AAED,KAAG,sBAAsB,MAAM;AAC3B,QAAI,KAAK,YAAY,cAAc,YAAY;AAE/C,SAAK,YAAY,cAAc,YAAY;AAC3C,WAAO,GAAG,aAAa,MAAM,CAAC;AAC9B,WAAO,GAAG,IAAI,EAAE,GAAG,GAAG;AACtB,OAAG,aAAa,QAAQ,MAAM;AAC9B,WAAO,GAAG,IAAI,EAAE,GAAG,GAAG,MAAM,MAAM;AAAA,EACtC,CAAC;AAED,KAAG,wBAAwB,YAAY;AACnC,UAAM,KAAK,YAAY,cAAc,YAAY;AACjD,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AAEzB,qBAAiB,EAAE,EAAE,MAAM;AAC3B,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AAAA,EAC7B,CAAC;AAED,KAAG,sCAAsC,YAAY;AACjD,UAAM,KAAK,YAAY,cAAc,YAAY;AACjD,UAAM,eAAe,EAAE;AACvB,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AAEzB,qBAAiB,EAAE,EAAE,MAAM;AAC3B,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AAEzB,OAAG,iBAAiB,UAAU,CAAC,UAAiB,MAAM,eAAe,CAAC;AACtE,qBAAiB,EAAE,EAAE,MAAM;AAC3B,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AAAA,EAC7B,CAAC;
|
|
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/checkbox/sp-checkbox.js';\nimport { Checkbox } from '../';\nimport {\n elementUpdated,\n expect,\n fixture,\n html,\n triggerBlurFor,\n waitUntil,\n} from '@open-wc/testing';\nimport '@spectrum-web-components/shared/src/focus-visible.js';\nimport { testForLitDevWarnings } from '../../../test/testing-helpers.js';\nimport { a11ySnapshot, findAccessibilityNode } from '@web/test-runner-commands';\n\nfunction inputForCheckbox(checkbox: Checkbox): HTMLInputElement {\n if (!checkbox.shadowRoot) throw new Error('No shadowRoot');\n return checkbox.shadowRoot.querySelector('#input') as HTMLInputElement;\n}\n\nfunction labelForCheckbox(checkbox: Checkbox): HTMLLabelElement {\n if (!checkbox.shadowRoot) throw new Error('No shadowRoot');\n const labelEl = checkbox.shadowRoot.querySelector('label');\n if (!labelEl) {\n throw new Error('Failed to find label in shadowRoot');\n }\n return labelEl;\n}\n\nfunction labelNodeForCheckbox(checkbox: Checkbox): Node {\n if (!checkbox.shadowRoot) throw new Error('No shadowRoot');\n const slotEl = checkbox.shadowRoot.querySelector('slot');\n if (!slotEl) {\n throw new Error('Failed to find slot in shadowRoot');\n }\n return slotEl.assignedNodes()[0];\n}\ndescribe('Checkbox', () => {\n let testFixture: HTMLDivElement;\n\n beforeEach(async () => {\n testFixture = await fixture<HTMLDivElement>(\n html`\n <div>\n <div id=\"test-checkbox\">\n <sp-checkbox id=\"checkbox0\" tabindex=\"5\">\n Component\n </sp-checkbox>\n <sp-checkbox id=\"checkbox1\" tabindex=\"2\" checked>\n Check 1\n </sp-checkbox>\n <sp-checkbox id=\"checkbox2\" tabindex=\"3\" disabled>\n Check 2\n </sp-checkbox>\n <sp-checkbox id=\"checkbox3\" tabindex=\"1\" autofocus>\n Check 3\n </sp-checkbox>\n <sp-checkbox id=\"checkbox4\" tabindex=\"0\">\n Check 4\n </sp-checkbox>\n <sp-checkbox id=\"checkbox5\" tabindex=\"-1\">\n Check 5\n </sp-checkbox>\n </div>\n </div>\n `\n );\n });\n\n it('loads', async () => {\n const el = testFixture.querySelector('sp-checkbox') as Checkbox;\n expect(el).to.not.equal(undefined);\n const textNode = labelNodeForCheckbox(el);\n const content = (textNode.textContent || '').trim();\n expect(content).to.equal('Component');\n });\n testForLitDevWarnings(\n async () =>\n await fixture<Checkbox>(\n html`\n <sp-checkbox>Not Checked</sp-checkbox>\n `\n )\n );\n\n it('loads default checkbox accessibly', async () => {\n const el = await fixture<Checkbox>(\n html`\n <sp-checkbox>Not Checked</sp-checkbox>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n\n const labelEl = labelForCheckbox(el);\n const inputEl = inputForCheckbox(el);\n\n expect(labelEl.getAttribute('for')).to.equal(inputEl.id);\n expect(inputEl.checked).to.be.false;\n expect(inputEl.indeterminate).to.be.false;\n\n type NamedRoledAndCheckedNode = {\n name: string;\n role: string;\n checked: boolean;\n };\n const snapshot = (await a11ySnapshot(\n {}\n )) as unknown as NamedRoledAndCheckedNode & {\n children: NamedRoledAndCheckedNode[];\n };\n expect(\n findAccessibilityNode<NamedRoledAndCheckedNode>(\n snapshot,\n (node) =>\n node.role === 'checkbox' &&\n !node.checked &&\n node.name === 'Not Checked'\n ),\n 'Has a named and not checked \"checkbox\" element'\n ).to.not.be.null;\n });\n\n it('loads `checked` checkbox accessibly', async () => {\n const el = await fixture<Checkbox>(\n html`\n <sp-checkbox checked>Checked</sp-checkbox>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n\n const labelEl = labelForCheckbox(el);\n const inputEl = inputForCheckbox(el);\n\n expect(labelEl.getAttribute('for')).to.equal(inputEl.id);\n expect(inputEl.checked).to.be.true;\n expect(inputEl.indeterminate).to.be.false;\n\n type NamedRoledAndCheckedNode = {\n name: string;\n role: string;\n checked: boolean;\n };\n const snapshot = (await a11ySnapshot(\n {}\n )) as unknown as NamedRoledAndCheckedNode & {\n children: NamedRoledAndCheckedNode[];\n };\n expect(\n findAccessibilityNode<NamedRoledAndCheckedNode>(\n snapshot,\n (node) =>\n node.role === 'checkbox' &&\n node.checked &&\n node.name === 'Checked'\n ),\n 'Has a named and checked \"checkbox\" element'\n ).to.not.be.null;\n });\n\n it('is `invalid` checkbox accessibly', async () => {\n const el = await fixture<Checkbox>(\n html`\n <sp-checkbox invalid>Invalid Not Checked</sp-checkbox>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n\n const labelEl = labelForCheckbox(el);\n const inputEl = inputForCheckbox(el);\n\n expect(labelEl.getAttribute('for')).to.equal(inputEl.id);\n expect(inputEl).to.have.attribute('aria-invalid', 'true');\n });\n\n it('autofocuses', async () => {\n const autoElement = testFixture.querySelector(\n 'sp-checkbox[autofocus]'\n ) as Checkbox;\n\n expect(autoElement).to.exist;\n await waitUntil(\n () => document.activeElement === autoElement,\n 'Autofocused'\n );\n\n await triggerBlurFor(autoElement);\n\n expect(document.activeElement).to.not.equal(autoElement);\n });\n\n it('`click()`ing host clicks `focusElement`', async () => {\n const el = await fixture<Checkbox>(\n html`\n <sp-checkbox checked autofocus>Checked</sp-checkbox>\n `\n );\n\n await elementUpdated(el);\n\n expect(el.checked, 'checked initially').to.be.true;\n\n el.click();\n await elementUpdated(el);\n\n expect(el.checked, 'unchecked').to.be.false;\n\n el.click();\n await elementUpdated(el);\n\n expect(el.checked, 'checked again').to.be.true;\n });\n\n it('respects checked attribute', () => {\n let el = testFixture.querySelector('#checkbox0') as Checkbox;\n expect(el.checked).to.be.false;\n\n el = testFixture.querySelector('#checkbox1') as Checkbox;\n expect(el.checked).to.be.true;\n });\n\n it('has name attribute', () => {\n let el = testFixture.querySelector('#checkbox0') as Checkbox;\n\n el = testFixture.querySelector('#checkbox1') as Checkbox;\n expect(el.hasAttribute('name'));\n expect(el.name).to.be.undefined;\n el.setAttribute('name', 'test');\n expect(el.name).to.be.equal('test');\n });\n\n it('handles click events', async () => {\n const el = testFixture.querySelector('#checkbox1') as Checkbox;\n expect(el.checked).to.be.true;\n\n inputForCheckbox(el).click();\n await elementUpdated(el);\n\n expect(el.checked).to.be.false;\n });\n\n it('can have `change` events cancelled', async () => {\n const el = testFixture.querySelector('#checkbox0') as Checkbox;\n await elementUpdated(el);\n expect(el.checked).to.be.false;\n\n inputForCheckbox(el).click();\n await elementUpdated(el);\n\n expect(el.checked).to.be.true;\n\n el.addEventListener('change', (event: Event) => event.preventDefault());\n inputForCheckbox(el).click();\n await elementUpdated(el);\n\n expect(el.checked).to.be.true;\n });\n it('should recognize readonly property', async () => {\n const el: Checkbox = await fixture('<sp-checkbox></sp-checkbox>');\n expect(el.readonly).to.not.throw;\n expect(el.readonly).to.be.a('boolean');\n });\n it('maintains its value when [readonly]', async () => {\n const el = await fixture<Checkbox>(html`\n <sp-checkbox id=\"checkbox0\" checked readonly>Component</sp-checkbox>\n `);\n expect(el.checked).to.be.true;\n\n inputForCheckbox(el).click();\n await elementUpdated(el);\n\n expect(el.checked).to.be.true;\n });\n\n it('`indeterminate, checked` becomes `not checked` on click', async () => {\n const el = await fixture<Checkbox>(html`\n <sp-checkbox checked .indeterminate=${true}>\n indeterminate, checked\n </sp-checkbox>\n `);\n expect(el.checked).to.be.true;\n expect(el.indeterminate).to.be.true;\n\n const inputEl = inputForCheckbox(el);\n expect(inputEl.checked).to.be.true;\n expect(inputEl.indeterminate).to.be.true;\n\n el.click();\n await elementUpdated(el);\n\n expect(el.checked).to.be.false;\n expect(el.indeterminate).to.be.false;\n expect(inputEl.checked).to.be.false;\n expect(inputEl.indeterminate).to.be.false;\n });\n\n it('`indeterminate, not checked` becomes `checked` on click', async () => {\n const el = await fixture<Checkbox>(html`\n <sp-checkbox .indeterminate=${true}>\n indeterminate, checked\n </sp-checkbox>\n `);\n expect(el.checked).to.be.false;\n expect(el.indeterminate).to.be.true;\n\n const inputEl = inputForCheckbox(el);\n expect(inputEl.checked).to.be.false;\n expect(inputEl.indeterminate).to.be.true;\n\n el.click();\n await elementUpdated(el);\n\n expect(el.checked).to.be.true;\n expect(el.indeterminate).to.be.false;\n expect(inputEl.checked).to.be.true;\n expect(inputEl.indeterminate).to.be.false;\n });\n\n it('updates checkmark icons in response to size', async function () {\n const el = await fixture<Checkbox>(html`\n <sp-checkbox checked>sizes checkbox</sp-checkbox>\n `);\n\n const getCheckmarkLocalName = (): string => {\n return (el.shadowRoot.querySelector('#checkmark') as HTMLElement)\n .localName;\n };\n\n expect(el.size).to.equal('m');\n let checkmarkLocalname = getCheckmarkLocalName();\n el.size = 's';\n await elementUpdated(el);\n expect(getCheckmarkLocalName()).to.not.equal(checkmarkLocalname);\n\n checkmarkLocalname = getCheckmarkLocalName();\n el.size = 'l';\n await elementUpdated(el);\n expect(getCheckmarkLocalName()).to.not.equal(checkmarkLocalname);\n\n checkmarkLocalname = getCheckmarkLocalName();\n el.size = 'xl';\n await elementUpdated(el);\n expect(getCheckmarkLocalName()).to.not.equal(checkmarkLocalname);\n });\n\n it('updates partialCheckmark icons in response to size', async function () {\n const el = await fixture<Checkbox>(html`\n <sp-checkbox indeterminate>sizes checkbox</sp-checkbox>\n `);\n\n const getPartialCheckmarkLocalName = (): string => {\n return (\n el.shadowRoot.querySelector('#partialCheckmark') as HTMLElement\n ).localName;\n };\n\n expect(el.size).to.equal('m');\n let partialCheckmarkLocalname = getPartialCheckmarkLocalName();\n el.size = 's';\n await elementUpdated(el);\n expect(getPartialCheckmarkLocalName()).to.not.equal(\n partialCheckmarkLocalname\n );\n\n partialCheckmarkLocalname = getPartialCheckmarkLocalName();\n el.size = 'l';\n await elementUpdated(el);\n expect(getPartialCheckmarkLocalName()).to.not.equal(\n partialCheckmarkLocalname\n );\n\n partialCheckmarkLocalname = getPartialCheckmarkLocalName();\n el.size = 'xl';\n await elementUpdated(el);\n expect(getPartialCheckmarkLocalName()).to.not.equal(\n partialCheckmarkLocalname\n );\n });\n});\n"],
|
|
5
|
+
"mappings": ";AAYA,OAAO;AAEP;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACG;AACP,OAAO;AACP,SAAS,6BAA6B;AACtC,SAAS,cAAc,6BAA6B;AAEpD,SAAS,iBAAiB,UAAsC;AAC5D,MAAI,CAAC,SAAS;AAAY,UAAM,IAAI,MAAM,eAAe;AACzD,SAAO,SAAS,WAAW,cAAc,QAAQ;AACrD;AAEA,SAAS,iBAAiB,UAAsC;AAC5D,MAAI,CAAC,SAAS;AAAY,UAAM,IAAI,MAAM,eAAe;AACzD,QAAM,UAAU,SAAS,WAAW,cAAc,OAAO;AACzD,MAAI,CAAC,SAAS;AACV,UAAM,IAAI,MAAM,oCAAoC;AAAA,EACxD;AACA,SAAO;AACX;AAEA,SAAS,qBAAqB,UAA0B;AACpD,MAAI,CAAC,SAAS;AAAY,UAAM,IAAI,MAAM,eAAe;AACzD,QAAM,SAAS,SAAS,WAAW,cAAc,MAAM;AACvD,MAAI,CAAC,QAAQ;AACT,UAAM,IAAI,MAAM,mCAAmC;AAAA,EACvD;AACA,SAAO,OAAO,cAAc,EAAE,CAAC;AACnC;AACA,SAAS,YAAY,MAAM;AACvB,MAAI;AAEJ,aAAW,YAAY;AACnB,kBAAc,MAAM;AAAA,MAChB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAwBJ;AAAA,EACJ,CAAC;AAED,KAAG,SAAS,YAAY;AACpB,UAAM,KAAK,YAAY,cAAc,aAAa;AAClD,WAAO,EAAE,EAAE,GAAG,IAAI,MAAM,MAAS;AACjC,UAAM,WAAW,qBAAqB,EAAE;AACxC,UAAM,WAAW,SAAS,eAAe,IAAI,KAAK;AAClD,WAAO,OAAO,EAAE,GAAG,MAAM,WAAW;AAAA,EACxC,CAAC;AACD;AAAA,IACI,YACI,MAAM;AAAA,MACF;AAAA;AAAA;AAAA,IAGJ;AAAA,EACR;AAEA,KAAG,qCAAqC,YAAY;AAChD,UAAM,KAAK,MAAM;AAAA,MACb;AAAA;AAAA;AAAA,IAGJ;AAEA,UAAM,eAAe,EAAE;AAEvB,UAAM,OAAO,EAAE,EAAE,GAAG,GAAG,WAAW;AAElC,UAAM,UAAU,iBAAiB,EAAE;AACnC,UAAM,UAAU,iBAAiB,EAAE;AAEnC,WAAO,QAAQ,aAAa,KAAK,CAAC,EAAE,GAAG,MAAM,QAAQ,EAAE;AACvD,WAAO,QAAQ,OAAO,EAAE,GAAG,GAAG;AAC9B,WAAO,QAAQ,aAAa,EAAE,GAAG,GAAG;AAOpC,UAAM,WAAY,MAAM;AAAA,MACpB,CAAC;AAAA,IACL;AAGA;AAAA,MACI;AAAA,QACI;AAAA,QACA,CAAC,SACG,KAAK,SAAS,cACd,CAAC,KAAK,WACN,KAAK,SAAS;AAAA,MACtB;AAAA,MACA;AAAA,IACJ,EAAE,GAAG,IAAI,GAAG;AAAA,EAChB,CAAC;AAED,KAAG,uCAAuC,YAAY;AAClD,UAAM,KAAK,MAAM;AAAA,MACb;AAAA;AAAA;AAAA,IAGJ;AAEA,UAAM,eAAe,EAAE;AAEvB,UAAM,OAAO,EAAE,EAAE,GAAG,GAAG,WAAW;AAElC,UAAM,UAAU,iBAAiB,EAAE;AACnC,UAAM,UAAU,iBAAiB,EAAE;AAEnC,WAAO,QAAQ,aAAa,KAAK,CAAC,EAAE,GAAG,MAAM,QAAQ,EAAE;AACvD,WAAO,QAAQ,OAAO,EAAE,GAAG,GAAG;AAC9B,WAAO,QAAQ,aAAa,EAAE,GAAG,GAAG;AAOpC,UAAM,WAAY,MAAM;AAAA,MACpB,CAAC;AAAA,IACL;AAGA;AAAA,MACI;AAAA,QACI;AAAA,QACA,CAAC,SACG,KAAK,SAAS,cACd,KAAK,WACL,KAAK,SAAS;AAAA,MACtB;AAAA,MACA;AAAA,IACJ,EAAE,GAAG,IAAI,GAAG;AAAA,EAChB,CAAC;AAED,KAAG,oCAAoC,YAAY;AAC/C,UAAM,KAAK,MAAM;AAAA,MACb;AAAA;AAAA;AAAA,IAGJ;AAEA,UAAM,eAAe,EAAE;AAEvB,UAAM,OAAO,EAAE,EAAE,GAAG,GAAG,WAAW;AAElC,UAAM,UAAU,iBAAiB,EAAE;AACnC,UAAM,UAAU,iBAAiB,EAAE;AAEnC,WAAO,QAAQ,aAAa,KAAK,CAAC,EAAE,GAAG,MAAM,QAAQ,EAAE;AACvD,WAAO,OAAO,EAAE,GAAG,KAAK,UAAU,gBAAgB,MAAM;AAAA,EAC5D,CAAC;AAED,KAAG,eAAe,YAAY;AAC1B,UAAM,cAAc,YAAY;AAAA,MAC5B;AAAA,IACJ;AAEA,WAAO,WAAW,EAAE,GAAG;AACvB,UAAM;AAAA,MACF,MAAM,SAAS,kBAAkB;AAAA,MACjC;AAAA,IACJ;AAEA,UAAM,eAAe,WAAW;AAEhC,WAAO,SAAS,aAAa,EAAE,GAAG,IAAI,MAAM,WAAW;AAAA,EAC3D,CAAC;AAED,KAAG,2CAA2C,YAAY;AACtD,UAAM,KAAK,MAAM;AAAA,MACb;AAAA;AAAA;AAAA,IAGJ;AAEA,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,SAAS,mBAAmB,EAAE,GAAG,GAAG;AAE9C,OAAG,MAAM;AACT,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,SAAS,WAAW,EAAE,GAAG,GAAG;AAEtC,OAAG,MAAM;AACT,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,SAAS,eAAe,EAAE,GAAG,GAAG;AAAA,EAC9C,CAAC;AAED,KAAG,8BAA8B,MAAM;AACnC,QAAI,KAAK,YAAY,cAAc,YAAY;AAC/C,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AAEzB,SAAK,YAAY,cAAc,YAAY;AAC3C,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AAAA,EAC7B,CAAC;AAED,KAAG,sBAAsB,MAAM;AAC3B,QAAI,KAAK,YAAY,cAAc,YAAY;AAE/C,SAAK,YAAY,cAAc,YAAY;AAC3C,WAAO,GAAG,aAAa,MAAM,CAAC;AAC9B,WAAO,GAAG,IAAI,EAAE,GAAG,GAAG;AACtB,OAAG,aAAa,QAAQ,MAAM;AAC9B,WAAO,GAAG,IAAI,EAAE,GAAG,GAAG,MAAM,MAAM;AAAA,EACtC,CAAC;AAED,KAAG,wBAAwB,YAAY;AACnC,UAAM,KAAK,YAAY,cAAc,YAAY;AACjD,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AAEzB,qBAAiB,EAAE,EAAE,MAAM;AAC3B,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AAAA,EAC7B,CAAC;AAED,KAAG,sCAAsC,YAAY;AACjD,UAAM,KAAK,YAAY,cAAc,YAAY;AACjD,UAAM,eAAe,EAAE;AACvB,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AAEzB,qBAAiB,EAAE,EAAE,MAAM;AAC3B,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AAEzB,OAAG,iBAAiB,UAAU,CAAC,UAAiB,MAAM,eAAe,CAAC;AACtE,qBAAiB,EAAE,EAAE,MAAM;AAC3B,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AAAA,EAC7B,CAAC;AACD,KAAG,sCAAsC,YAAY;AACjD,UAAM,KAAe,MAAM,QAAQ,6BAA6B;AAChE,WAAO,GAAG,QAAQ,EAAE,GAAG,IAAI;AAC3B,WAAO,GAAG,QAAQ,EAAE,GAAG,GAAG,EAAE,SAAS;AAAA,EACzC,CAAC;AACD,KAAG,uCAAuC,YAAY;AAClD,UAAM,KAAK,MAAM,QAAkB;AAAA;AAAA,SAElC;AACD,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AAEzB,qBAAiB,EAAE,EAAE,MAAM;AAC3B,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AAAA,EAC7B,CAAC;AAED,KAAG,2DAA2D,YAAY;AACtE,UAAM,KAAK,MAAM,QAAkB;AAAA,kDACO,IAAI;AAAA;AAAA;AAAA,SAG7C;AACD,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AACzB,WAAO,GAAG,aAAa,EAAE,GAAG,GAAG;AAE/B,UAAM,UAAU,iBAAiB,EAAE;AACnC,WAAO,QAAQ,OAAO,EAAE,GAAG,GAAG;AAC9B,WAAO,QAAQ,aAAa,EAAE,GAAG,GAAG;AAEpC,OAAG,MAAM;AACT,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AACzB,WAAO,GAAG,aAAa,EAAE,GAAG,GAAG;AAC/B,WAAO,QAAQ,OAAO,EAAE,GAAG,GAAG;AAC9B,WAAO,QAAQ,aAAa,EAAE,GAAG,GAAG;AAAA,EACxC,CAAC;AAED,KAAG,2DAA2D,YAAY;AACtE,UAAM,KAAK,MAAM,QAAkB;AAAA,0CACD,IAAI;AAAA;AAAA;AAAA,SAGrC;AACD,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AACzB,WAAO,GAAG,aAAa,EAAE,GAAG,GAAG;AAE/B,UAAM,UAAU,iBAAiB,EAAE;AACnC,WAAO,QAAQ,OAAO,EAAE,GAAG,GAAG;AAC9B,WAAO,QAAQ,aAAa,EAAE,GAAG,GAAG;AAEpC,OAAG,MAAM;AACT,UAAM,eAAe,EAAE;AAEvB,WAAO,GAAG,OAAO,EAAE,GAAG,GAAG;AACzB,WAAO,GAAG,aAAa,EAAE,GAAG,GAAG;AAC/B,WAAO,QAAQ,OAAO,EAAE,GAAG,GAAG;AAC9B,WAAO,QAAQ,aAAa,EAAE,GAAG,GAAG;AAAA,EACxC,CAAC;AAED,KAAG,+CAA+C,iBAAkB;AAChE,UAAM,KAAK,MAAM,QAAkB;AAAA;AAAA,SAElC;AAED,UAAM,wBAAwB,MAAc;AACxC,aAAQ,GAAG,WAAW,cAAc,YAAY,EAC3C;AAAA,IACT;AAEA,WAAO,GAAG,IAAI,EAAE,GAAG,MAAM,GAAG;AAC5B,QAAI,qBAAqB,sBAAsB;AAC/C,OAAG,OAAO;AACV,UAAM,eAAe,EAAE;AACvB,WAAO,sBAAsB,CAAC,EAAE,GAAG,IAAI,MAAM,kBAAkB;AAE/D,yBAAqB,sBAAsB;AAC3C,OAAG,OAAO;AACV,UAAM,eAAe,EAAE;AACvB,WAAO,sBAAsB,CAAC,EAAE,GAAG,IAAI,MAAM,kBAAkB;AAE/D,yBAAqB,sBAAsB;AAC3C,OAAG,OAAO;AACV,UAAM,eAAe,EAAE;AACvB,WAAO,sBAAsB,CAAC,EAAE,GAAG,IAAI,MAAM,kBAAkB;AAAA,EACnE,CAAC;AAED,KAAG,sDAAsD,iBAAkB;AACvE,UAAM,KAAK,MAAM,QAAkB;AAAA;AAAA,SAElC;AAED,UAAM,+BAA+B,MAAc;AAC/C,aACI,GAAG,WAAW,cAAc,mBAAmB,EACjD;AAAA,IACN;AAEA,WAAO,GAAG,IAAI,EAAE,GAAG,MAAM,GAAG;AAC5B,QAAI,4BAA4B,6BAA6B;AAC7D,OAAG,OAAO;AACV,UAAM,eAAe,EAAE;AACvB,WAAO,6BAA6B,CAAC,EAAE,GAAG,IAAI;AAAA,MAC1C;AAAA,IACJ;AAEA,gCAA4B,6BAA6B;AACzD,OAAG,OAAO;AACV,UAAM,eAAe,EAAE;AACvB,WAAO,6BAA6B,CAAC,EAAE,GAAG,IAAI;AAAA,MAC1C;AAAA,IACJ;AAEA,gCAA4B,6BAA6B;AACzD,OAAG,OAAO;AACV,UAAM,eAAe,EAAE;AACvB,WAAO,6BAA6B,CAAC,EAAE,GAAG,IAAI;AAAA,MAC1C;AAAA,IACJ;AAAA,EACJ,CAAC;AACL,CAAC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|