@synergy-design-system/components 1.0.0-main.17 → 1.0.0-main.19
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/LICENSE +5 -24
- package/dist/chunks/{chunk.AC72SG2F.js → chunk.36WJCPWJ.js} +4 -4
- package/dist/chunks/{chunk.4JOMEFHA.js → chunk.4XAK6MOQ.js} +2 -2
- package/dist/chunks/{chunk.6RANOXJK.js → chunk.6HOJNR5P.js} +2 -2
- package/dist/chunks/{chunk.SDBXQYGM.js → chunk.ACJLZOKO.js} +2 -2
- package/dist/chunks/chunk.AFEABUNX.js +107 -0
- package/dist/chunks/chunk.AFEABUNX.js.map +7 -0
- package/dist/chunks/{chunk.ZLFNI7BI.js → chunk.AN3MCZ5L.js} +2 -2
- package/dist/chunks/{chunk.KCA3BG3W.js → chunk.B2VXDAMH.js} +2 -2
- package/dist/chunks/{chunk.GLYODAYL.js → chunk.CGHM66CT.js} +2 -2
- package/dist/chunks/{chunk.66VFBEAZ.js → chunk.D2Z6ZJXY.js} +3 -3
- package/dist/chunks/{chunk.HB6CB6XA.js → chunk.DO6FDFLR.js} +3 -3
- package/dist/chunks/{chunk.FJRJZ6RE.js → chunk.ELVQAMXS.js} +2 -2
- package/dist/chunks/{chunk.TS3BXLB7.js → chunk.F4TIM42X.js} +2 -2
- package/dist/chunks/{chunk.WQ3IDDAS.js → chunk.FT2URWZV.js} +2 -2
- package/dist/chunks/{chunk.SDBSVMIH.js → chunk.GK6FOY6O.js} +2 -2
- package/dist/chunks/{chunk.O764J4CP.js → chunk.GNAJOKCJ.js} +3 -1
- package/dist/chunks/{chunk.O764J4CP.js.map → chunk.GNAJOKCJ.js.map} +2 -2
- package/dist/chunks/{chunk.6ZXWKDC3.js → chunk.L6IGKNDY.js} +3 -3
- package/dist/chunks/chunk.MNMITYTH.js +184 -0
- package/dist/chunks/chunk.MNMITYTH.js.map +7 -0
- package/dist/chunks/{chunk.5555WGU3.js → chunk.MXJIZZJQ.js} +2 -2
- package/dist/chunks/{chunk.UAY5JJC6.js → chunk.QAB6MVFI.js} +3 -3
- package/dist/chunks/chunk.T7HUHZ5Q.js +12 -0
- package/dist/chunks/chunk.T7HUHZ5Q.js.map +7 -0
- package/dist/chunks/{chunk.5ENQHYQ2.js → chunk.TTYVMQM7.js} +3 -3
- package/dist/chunks/{chunk.5F5XNVZM.js → chunk.U3DCFCX3.js} +2 -2
- package/dist/chunks/{chunk.5F5XNVZM.js.map → chunk.U3DCFCX3.js.map} +1 -1
- package/dist/chunks/{chunk.SZ6N6QU7.js → chunk.UIG4NCKL.js} +2 -2
- package/dist/chunks/{chunk.K4NFW3LK.js → chunk.UWJKSEFE.js} +2 -2
- package/dist/chunks/chunk.WY3ORLFU.js +212 -0
- package/dist/chunks/chunk.WY3ORLFU.js.map +7 -0
- package/dist/chunks/{chunk.5M3MSGTH.js → chunk.ZQ2MDF3U.js} +2 -2
- package/dist/components/button/button.component.js +6 -6
- package/dist/components/button/button.js +7 -7
- package/dist/components/button-group/button-group.component.js +2 -2
- package/dist/components/button-group/button-group.js +3 -3
- package/dist/components/checkbox/checkbox.component.js +5 -5
- package/dist/components/checkbox/checkbox.js +6 -6
- package/dist/components/icon/icon.component.js +4 -4
- package/dist/components/icon/icon.js +5 -5
- package/dist/components/icon/library.js +2 -2
- package/dist/components/icon/library.system.js +1 -1
- package/dist/components/input/input.component.js +5 -5
- package/dist/components/input/input.js +6 -6
- package/dist/components/radio/radio.component.js +5 -5
- package/dist/components/radio/radio.js +6 -6
- package/dist/components/radio-button/radio-button.component.js +2 -2
- package/dist/components/radio-button/radio-button.js +3 -3
- package/dist/components/radio-group/radio-group.component.js +3 -3
- package/dist/components/radio-group/radio-group.js +4 -4
- package/dist/components/spinner/spinner.component.js +2 -2
- package/dist/components/switch/switch.component.d.ts +86 -0
- package/dist/components/switch/switch.component.js +15 -0
- package/dist/components/switch/switch.component.js.map +7 -0
- package/dist/components/switch/switch.custom.styles.d.ts +2 -0
- package/dist/components/switch/switch.custom.styles.js +8 -0
- package/dist/components/switch/switch.custom.styles.js.map +7 -0
- package/dist/components/switch/switch.d.ts +8 -0
- package/dist/components/switch/switch.js +16 -0
- package/dist/components/switch/switch.js.map +7 -0
- package/dist/components/switch/switch.styles.d.ts +2 -0
- package/dist/components/switch/switch.styles.js +10 -0
- package/dist/components/switch/switch.styles.js.map +7 -0
- package/dist/components/textarea/textarea.component.js +2 -2
- package/dist/components/textarea/textarea.js +3 -3
- package/dist/custom-elements.json +629 -214
- package/dist/synergy.d.ts +1 -0
- package/dist/synergy.js +32 -25
- package/dist/utilities/icon-library.js +2 -2
- package/dist/vscode.html-custom-data.json +69 -17
- package/dist/web-types.json +161 -30
- package/package.json +6 -6
- /package/dist/chunks/{chunk.AC72SG2F.js.map → chunk.36WJCPWJ.js.map} +0 -0
- /package/dist/chunks/{chunk.4JOMEFHA.js.map → chunk.4XAK6MOQ.js.map} +0 -0
- /package/dist/chunks/{chunk.6RANOXJK.js.map → chunk.6HOJNR5P.js.map} +0 -0
- /package/dist/chunks/{chunk.SDBXQYGM.js.map → chunk.ACJLZOKO.js.map} +0 -0
- /package/dist/chunks/{chunk.ZLFNI7BI.js.map → chunk.AN3MCZ5L.js.map} +0 -0
- /package/dist/chunks/{chunk.KCA3BG3W.js.map → chunk.B2VXDAMH.js.map} +0 -0
- /package/dist/chunks/{chunk.GLYODAYL.js.map → chunk.CGHM66CT.js.map} +0 -0
- /package/dist/chunks/{chunk.66VFBEAZ.js.map → chunk.D2Z6ZJXY.js.map} +0 -0
- /package/dist/chunks/{chunk.HB6CB6XA.js.map → chunk.DO6FDFLR.js.map} +0 -0
- /package/dist/chunks/{chunk.FJRJZ6RE.js.map → chunk.ELVQAMXS.js.map} +0 -0
- /package/dist/chunks/{chunk.TS3BXLB7.js.map → chunk.F4TIM42X.js.map} +0 -0
- /package/dist/chunks/{chunk.WQ3IDDAS.js.map → chunk.FT2URWZV.js.map} +0 -0
- /package/dist/chunks/{chunk.SDBSVMIH.js.map → chunk.GK6FOY6O.js.map} +0 -0
- /package/dist/chunks/{chunk.6ZXWKDC3.js.map → chunk.L6IGKNDY.js.map} +0 -0
- /package/dist/chunks/{chunk.5555WGU3.js.map → chunk.MXJIZZJQ.js.map} +0 -0
- /package/dist/chunks/{chunk.UAY5JJC6.js.map → chunk.QAB6MVFI.js.map} +0 -0
- /package/dist/chunks/{chunk.5ENQHYQ2.js.map → chunk.TTYVMQM7.js.map} +0 -0
- /package/dist/chunks/{chunk.SZ6N6QU7.js.map → chunk.UIG4NCKL.js.map} +0 -0
- /package/dist/chunks/{chunk.K4NFW3LK.js.map → chunk.UWJKSEFE.js.map} +0 -0
- /package/dist/chunks/{chunk.5M3MSGTH.js.map → chunk.ZQ2MDF3U.js.map} +0 -0
package/LICENSE
CHANGED
|
@@ -1,28 +1,9 @@
|
|
|
1
|
-
|
|
1
|
+
The MIT License
|
|
2
2
|
|
|
3
|
-
Copyright
|
|
3
|
+
Copyright 2023 SICK AG
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
modification, are permitted provided that the following conditions are met:
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
|
7
6
|
|
|
8
|
-
|
|
9
|
-
list of conditions and the following disclaimer.
|
|
7
|
+
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
|
10
8
|
|
|
11
|
-
|
|
12
|
-
this list of conditions and the following disclaimer in the documentation
|
|
13
|
-
and/or other materials provided with the distribution.
|
|
14
|
-
|
|
15
|
-
3. Neither the name of the copyright holder nor the names of its
|
|
16
|
-
contributors may be used to endorse or promote products derived from
|
|
17
|
-
this software without specific prior written permission.
|
|
18
|
-
|
|
19
|
-
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
|
|
20
|
-
AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
|
|
21
|
-
IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
|
|
22
|
-
DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
|
|
23
|
-
FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
|
|
24
|
-
DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
|
|
25
|
-
SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
|
|
26
|
-
CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
|
|
27
|
-
OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
|
|
28
|
-
OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
|
9
|
+
THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
SynSpinner
|
|
3
|
-
} from "./chunk.
|
|
3
|
+
} from "./chunk.UIG4NCKL.js";
|
|
4
4
|
import {
|
|
5
5
|
LocalizeController
|
|
6
6
|
} from "./chunk.R6VNLE6N.js";
|
|
@@ -13,7 +13,7 @@ import {
|
|
|
13
13
|
} from "./chunk.P2LNG2PZ.js";
|
|
14
14
|
import {
|
|
15
15
|
SynIcon
|
|
16
|
-
} from "./chunk.
|
|
16
|
+
} from "./chunk.QAB6MVFI.js";
|
|
17
17
|
import {
|
|
18
18
|
watch
|
|
19
19
|
} from "./chunk.VZ7S7YYN.js";
|
|
@@ -22,7 +22,7 @@ import {
|
|
|
22
22
|
} from "./chunk.YTS5TRJZ.js";
|
|
23
23
|
import {
|
|
24
24
|
SynergyElement
|
|
25
|
-
} from "./chunk.
|
|
25
|
+
} from "./chunk.U3DCFCX3.js";
|
|
26
26
|
import {
|
|
27
27
|
__decorateClass
|
|
28
28
|
} from "./chunk.DJOAQ4JU.js";
|
|
@@ -277,4 +277,4 @@ __decorateClass([
|
|
|
277
277
|
export {
|
|
278
278
|
SynButton
|
|
279
279
|
};
|
|
280
|
-
//# sourceMappingURL=chunk.
|
|
280
|
+
//# sourceMappingURL=chunk.36WJCPWJ.js.map
|
|
@@ -3,7 +3,7 @@ import {
|
|
|
3
3
|
} from "./chunk.6C4JXZZN.js";
|
|
4
4
|
import {
|
|
5
5
|
library_system_default
|
|
6
|
-
} from "./chunk.
|
|
6
|
+
} from "./chunk.GNAJOKCJ.js";
|
|
7
7
|
|
|
8
8
|
// src/components/icon/library.ts
|
|
9
9
|
var registry = [library_default_default, library_system_default];
|
|
@@ -42,4 +42,4 @@ export {
|
|
|
42
42
|
registerIconLibrary,
|
|
43
43
|
unregisterIconLibrary
|
|
44
44
|
};
|
|
45
|
-
//# sourceMappingURL=chunk.
|
|
45
|
+
//# sourceMappingURL=chunk.4XAK6MOQ.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
SynButtonGroup
|
|
3
|
-
} from "./chunk.
|
|
3
|
+
} from "./chunk.GK6FOY6O.js";
|
|
4
4
|
|
|
5
5
|
// src/components/button-group/button-group.ts
|
|
6
6
|
var button_group_default = SynButtonGroup;
|
|
@@ -9,4 +9,4 @@ SynButtonGroup.define("syn-button-group");
|
|
|
9
9
|
export {
|
|
10
10
|
button_group_default
|
|
11
11
|
};
|
|
12
|
-
//# sourceMappingURL=chunk.
|
|
12
|
+
//# sourceMappingURL=chunk.6HOJNR5P.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
SynInput
|
|
3
|
-
} from "./chunk.
|
|
3
|
+
} from "./chunk.L6IGKNDY.js";
|
|
4
4
|
|
|
5
5
|
// src/components/input/input.ts
|
|
6
6
|
var input_default = SynInput;
|
|
@@ -9,4 +9,4 @@ SynInput.define("syn-input");
|
|
|
9
9
|
export {
|
|
10
10
|
input_default
|
|
11
11
|
};
|
|
12
|
-
//# sourceMappingURL=chunk.
|
|
12
|
+
//# sourceMappingURL=chunk.ACJLZOKO.js.map
|
|
@@ -0,0 +1,107 @@
|
|
|
1
|
+
// src/components/switch/switch.custom.styles.ts
|
|
2
|
+
import { css } from "lit";
|
|
3
|
+
var switch_custom_styles_default = css`
|
|
4
|
+
:host([size='small']) {
|
|
5
|
+
--height: calc(var(--syn-font-size-medium) + 2px);
|
|
6
|
+
--thumb-size: var(--syn-font-size-small);
|
|
7
|
+
--width: calc((var(--height) * 2) - 6px);
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
:host([size='medium']) {
|
|
11
|
+
--height: var(--syn-font-size-large);
|
|
12
|
+
--thumb-size: var(--syn-font-size-medium);
|
|
13
|
+
--width: calc((var(--height) * 2) - 6px);
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
:host([size='large']) {
|
|
17
|
+
--height: calc(var(--syn-toggle-size-large) + 4px);
|
|
18
|
+
--thumb-size: var(--syn-toggle-size-large);
|
|
19
|
+
--width: calc((var(--height) * 2) - 6px);
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
.switch.switch--small {
|
|
23
|
+
padding: var(--syn-spacing-2x-small) 0;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
.switch.switch--medium {
|
|
27
|
+
padding: var(--syn-spacing-2x-small) 0;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
.switch.switch--large {
|
|
31
|
+
padding: var(--syn-spacing-3x-small) 0;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.switch__control {
|
|
35
|
+
background-color: var(--syn-color-neutral-600);
|
|
36
|
+
border: solid var(--syn-border-width-medium) var(--syn-color-neutral-600);
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.switch__control .switch__thumb {
|
|
40
|
+
border: none;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
/* Hover */
|
|
44
|
+
.switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover {
|
|
45
|
+
background-color: var(--syn-color-neutral-900);
|
|
46
|
+
border-color: var(--syn-color-neutral-900);
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
.switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover .switch__thumb {
|
|
50
|
+
background-color: var(--syn-color-neutral-0);
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
/* Checked + hover */
|
|
54
|
+
.switch.switch--checked:not(.switch--disabled) .switch__control:hover {
|
|
55
|
+
background-color: var(--syn-color-primary-900);
|
|
56
|
+
border-color: var(--syn-color-primary-900);
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
.switch.switch--checked:not(.switch--disabled) .switch__control:hover .switch__thumb {
|
|
60
|
+
background-color: var(--syn-color-neutral-0);
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
/* Focus */
|
|
64
|
+
.switch:not(.switch--checked):not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {
|
|
65
|
+
background-color: var(--syn-color-neutral-600);
|
|
66
|
+
border-color: var(--syn-color-neutral-600);
|
|
67
|
+
outline: var(--syn-focus-ring);
|
|
68
|
+
outline-offset: var(--syn-focus-ring-offset);
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
.switch:not(.switch--checked):not(.switch--disabled) .switch__input:focus-visible ~ .switch__control .switch__thumb {
|
|
72
|
+
background-color: var(--syn-color-neutral-0);
|
|
73
|
+
outline: none;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
/* Checked + focus */
|
|
77
|
+
.switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {
|
|
78
|
+
background-color: var(--syn-color-primary-900);
|
|
79
|
+
border-color: var(--syn-color-primary-900);
|
|
80
|
+
outline: var(--syn-focus-ring);
|
|
81
|
+
outline-offset: var(--syn-focus-ring-offset);
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
.switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control .switch__thumb {
|
|
85
|
+
background-color: var(--syn-color-neutral-0);
|
|
86
|
+
outline: none;
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
.switch__label {
|
|
90
|
+
margin-inline-start: var(--syn-spacing-x-small);
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
:host([data-user-invalid]) .switch:not(.switch--checked):not(.switch--disabled) .switch__control {
|
|
94
|
+
background-color: var(--syn-color-error-700);
|
|
95
|
+
border-color: var(--syn-color-error-700);
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
:host([data-user-invalid]) .switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover {
|
|
99
|
+
background-color: var(--syn-color-error-900);
|
|
100
|
+
border-color: var(--syn-color-error-900);
|
|
101
|
+
}
|
|
102
|
+
`;
|
|
103
|
+
|
|
104
|
+
export {
|
|
105
|
+
switch_custom_styles_default
|
|
106
|
+
};
|
|
107
|
+
//# sourceMappingURL=chunk.AFEABUNX.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/components/switch/switch.custom.styles.ts"],
|
|
4
|
+
"sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n:host([size='small']) {\n --height: calc(var(--syn-font-size-medium) + 2px);\n --thumb-size: var(--syn-font-size-small);\n --width: calc((var(--height) * 2) - 6px);\n }\n\n :host([size='medium']) {\n --height: var(--syn-font-size-large);\n --thumb-size: var(--syn-font-size-medium);\n --width: calc((var(--height) * 2) - 6px);\n }\n\n :host([size='large']) {\n --height: calc(var(--syn-toggle-size-large) + 4px);\n --thumb-size: var(--syn-toggle-size-large);\n --width: calc((var(--height) * 2) - 6px);\n }\n\n .switch.switch--small {\n padding: var(--syn-spacing-2x-small) 0;\n }\n\n .switch.switch--medium {\n padding: var(--syn-spacing-2x-small) 0;\n }\n\n .switch.switch--large {\n padding: var(--syn-spacing-3x-small) 0;\n }\n\n .switch__control {\n background-color: var(--syn-color-neutral-600);\n border: solid var(--syn-border-width-medium) var(--syn-color-neutral-600);\n }\n\n .switch__control .switch__thumb {\n border: none;\n }\n\n /* Hover */\n .switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover {\n background-color: var(--syn-color-neutral-900);\n border-color: var(--syn-color-neutral-900);\n }\n\n .switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover .switch__thumb {\n background-color: var(--syn-color-neutral-0);\n }\n\n /* Checked + hover */\n .switch.switch--checked:not(.switch--disabled) .switch__control:hover {\n background-color: var(--syn-color-primary-900);\n border-color: var(--syn-color-primary-900);\n }\n\n .switch.switch--checked:not(.switch--disabled) .switch__control:hover .switch__thumb {\n background-color: var(--syn-color-neutral-0);\n }\n\n /* Focus */\n .switch:not(.switch--checked):not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {\n background-color: var(--syn-color-neutral-600);\n border-color: var(--syn-color-neutral-600);\n outline: var(--syn-focus-ring);\n outline-offset: var(--syn-focus-ring-offset);\n }\n\n .switch:not(.switch--checked):not(.switch--disabled) .switch__input:focus-visible ~ .switch__control .switch__thumb {\n background-color: var(--syn-color-neutral-0);\n outline: none;\n }\n\n /* Checked + focus */\n .switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {\n background-color: var(--syn-color-primary-900);\n border-color: var(--syn-color-primary-900);\n outline: var(--syn-focus-ring);\n outline-offset: var(--syn-focus-ring-offset);\n }\n\n .switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control .switch__thumb {\n background-color: var(--syn-color-neutral-0);\n outline: none;\n }\n\n .switch__label {\n margin-inline-start: var(--syn-spacing-x-small);\n }\n \n :host([data-user-invalid]) .switch:not(.switch--checked):not(.switch--disabled) .switch__control {\n background-color: var(--syn-color-error-700);\n border-color: var(--syn-color-error-700);\n }\n\n :host([data-user-invalid]) .switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover {\n background-color: var(--syn-color-error-900);\n border-color: var(--syn-color-error-900);\n }\n `;\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,+BAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -15,7 +15,7 @@ import {
|
|
|
15
15
|
} from "./chunk.VZ7S7YYN.js";
|
|
16
16
|
import {
|
|
17
17
|
SynergyElement
|
|
18
|
-
} from "./chunk.
|
|
18
|
+
} from "./chunk.U3DCFCX3.js";
|
|
19
19
|
import {
|
|
20
20
|
__decorateClass
|
|
21
21
|
} from "./chunk.DJOAQ4JU.js";
|
|
@@ -357,4 +357,4 @@ __decorateClass([
|
|
|
357
357
|
export {
|
|
358
358
|
SynTextarea
|
|
359
359
|
};
|
|
360
|
-
//# sourceMappingURL=chunk.
|
|
360
|
+
//# sourceMappingURL=chunk.AN3MCZ5L.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
SynIcon
|
|
3
|
-
} from "./chunk.
|
|
3
|
+
} from "./chunk.QAB6MVFI.js";
|
|
4
4
|
|
|
5
5
|
// src/components/icon/icon.ts
|
|
6
6
|
var icon_default = SynIcon;
|
|
@@ -9,4 +9,4 @@ SynIcon.define("syn-icon");
|
|
|
9
9
|
export {
|
|
10
10
|
icon_default
|
|
11
11
|
};
|
|
12
|
-
//# sourceMappingURL=chunk.
|
|
12
|
+
//# sourceMappingURL=chunk.B2VXDAMH.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
SynRadio
|
|
3
|
-
} from "./chunk.
|
|
3
|
+
} from "./chunk.D2Z6ZJXY.js";
|
|
4
4
|
|
|
5
5
|
// src/components/radio/radio.ts
|
|
6
6
|
var radio_default = SynRadio;
|
|
@@ -9,4 +9,4 @@ SynRadio.define("syn-radio");
|
|
|
9
9
|
export {
|
|
10
10
|
radio_default
|
|
11
11
|
};
|
|
12
|
-
//# sourceMappingURL=chunk.
|
|
12
|
+
//# sourceMappingURL=chunk.CGHM66CT.js.map
|
|
@@ -3,13 +3,13 @@ import {
|
|
|
3
3
|
} from "./chunk.JBYBQ5TQ.js";
|
|
4
4
|
import {
|
|
5
5
|
SynIcon
|
|
6
|
-
} from "./chunk.
|
|
6
|
+
} from "./chunk.QAB6MVFI.js";
|
|
7
7
|
import {
|
|
8
8
|
watch
|
|
9
9
|
} from "./chunk.VZ7S7YYN.js";
|
|
10
10
|
import {
|
|
11
11
|
SynergyElement
|
|
12
|
-
} from "./chunk.
|
|
12
|
+
} from "./chunk.U3DCFCX3.js";
|
|
13
13
|
import {
|
|
14
14
|
__decorateClass
|
|
15
15
|
} from "./chunk.DJOAQ4JU.js";
|
|
@@ -108,4 +108,4 @@ __decorateClass([
|
|
|
108
108
|
export {
|
|
109
109
|
SynRadio
|
|
110
110
|
};
|
|
111
|
-
//# sourceMappingURL=chunk.
|
|
111
|
+
//# sourceMappingURL=chunk.D2Z6ZJXY.js.map
|
|
@@ -15,10 +15,10 @@ import {
|
|
|
15
15
|
} from "./chunk.VZ7S7YYN.js";
|
|
16
16
|
import {
|
|
17
17
|
SynButtonGroup
|
|
18
|
-
} from "./chunk.
|
|
18
|
+
} from "./chunk.GK6FOY6O.js";
|
|
19
19
|
import {
|
|
20
20
|
SynergyElement
|
|
21
|
-
} from "./chunk.
|
|
21
|
+
} from "./chunk.U3DCFCX3.js";
|
|
22
22
|
import {
|
|
23
23
|
__decorateClass
|
|
24
24
|
} from "./chunk.DJOAQ4JU.js";
|
|
@@ -348,4 +348,4 @@ __decorateClass([
|
|
|
348
348
|
export {
|
|
349
349
|
SynRadioGroup
|
|
350
350
|
};
|
|
351
|
-
//# sourceMappingURL=chunk.
|
|
351
|
+
//# sourceMappingURL=chunk.DO6FDFLR.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
SynRadioGroup
|
|
3
|
-
} from "./chunk.
|
|
3
|
+
} from "./chunk.DO6FDFLR.js";
|
|
4
4
|
|
|
5
5
|
// src/components/radio-group/radio-group.ts
|
|
6
6
|
var radio_group_default = SynRadioGroup;
|
|
@@ -9,4 +9,4 @@ SynRadioGroup.define("syn-radio-group");
|
|
|
9
9
|
export {
|
|
10
10
|
radio_group_default
|
|
11
11
|
};
|
|
12
|
-
//# sourceMappingURL=chunk.
|
|
12
|
+
//# sourceMappingURL=chunk.ELVQAMXS.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
SynTextarea
|
|
3
|
-
} from "./chunk.
|
|
3
|
+
} from "./chunk.AN3MCZ5L.js";
|
|
4
4
|
|
|
5
5
|
// src/components/textarea/textarea.ts
|
|
6
6
|
var textarea_default = SynTextarea;
|
|
@@ -9,4 +9,4 @@ SynTextarea.define("syn-textarea");
|
|
|
9
9
|
export {
|
|
10
10
|
textarea_default
|
|
11
11
|
};
|
|
12
|
-
//# sourceMappingURL=chunk.
|
|
12
|
+
//# sourceMappingURL=chunk.F4TIM42X.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
SynRadioButton
|
|
3
|
-
} from "./chunk.
|
|
3
|
+
} from "./chunk.ZQ2MDF3U.js";
|
|
4
4
|
|
|
5
5
|
// src/components/radio-button/radio-button.ts
|
|
6
6
|
var radio_button_default = SynRadioButton;
|
|
@@ -9,4 +9,4 @@ SynRadioButton.define("syn-radio-button");
|
|
|
9
9
|
export {
|
|
10
10
|
radio_button_default
|
|
11
11
|
};
|
|
12
|
-
//# sourceMappingURL=chunk.
|
|
12
|
+
//# sourceMappingURL=chunk.FT2URWZV.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
SynergyElement
|
|
3
|
-
} from "./chunk.
|
|
3
|
+
} from "./chunk.U3DCFCX3.js";
|
|
4
4
|
import {
|
|
5
5
|
button_group_styles_default
|
|
6
6
|
} from "./chunk.4ZURABYO.js";
|
|
@@ -83,4 +83,4 @@ function findButton(el) {
|
|
|
83
83
|
export {
|
|
84
84
|
SynButtonGroup
|
|
85
85
|
};
|
|
86
|
-
//# sourceMappingURL=chunk.
|
|
86
|
+
//# sourceMappingURL=chunk.GK6FOY6O.js.map
|
|
@@ -10,6 +10,8 @@ var icons = {
|
|
|
10
10
|
<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill='currentColor'><path d="M12 4.5C7 4.5 2.73 7.61 1 12C2.73 16.39 7 19.5 12 19.5C17 19.5 21.27 16.39 23 12C21.27 7.61 17 4.5 12 4.5ZM12 17C9.24 17 7 14.76 7 12C7 9.24 9.24 7 12 7C14.76 7 17 9.24 17 12C17 14.76 14.76 17 12 17ZM12 9C10.34 9 9 10.34 9 12C9 13.66 10.34 15 12 15C13.66 15 15 13.66 15 12C15 10.34 13.66 9 12 9Z"/></svg>`,
|
|
11
11
|
"indeterminate": `
|
|
12
12
|
<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill='currentColor'><path d="M19 13H5V11H19V13Z"/></svg>`,
|
|
13
|
+
"radio": `
|
|
14
|
+
<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill='currentColor'><path d="M17 12C17 14.7614 14.7614 17 12 17C9.23858 17 7 14.7614 7 12C7 9.23858 9.23858 7 12 7C14.7614 7 17 9.23858 17 12Z"/></svg>`,
|
|
13
15
|
"x-circle-fill": `
|
|
14
16
|
<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill='currentColor'><path d="M12 2C6.47 2 2 6.47 2 12C2 17.53 6.47 22 12 22C17.53 22 22 17.53 22 12C22 6.47 17.53 2 12 2ZM17 15.59L15.59 17L12 13.41L8.41 17L7 15.59L10.59 12L7 8.41L8.41 7L12 10.59L15.59 7L17 8.41L13.41 12L17 15.59Z"/></svg>`
|
|
15
17
|
};
|
|
@@ -27,4 +29,4 @@ var library_system_default = systemLibrary;
|
|
|
27
29
|
export {
|
|
28
30
|
library_system_default
|
|
29
31
|
};
|
|
30
|
-
//# sourceMappingURL=chunk.
|
|
32
|
+
//# sourceMappingURL=chunk.GNAJOKCJ.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/components/icon/library.system.ts"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable */\nimport type { IconLibrary } from './library.js';\n\n//\n// System icons are a separate library to ensure they're always available, regardless of how the default icon library is\n// configured or if its icons resolve properly.\n//\n// All Synergy components must use the system library instead of the default library. For visual consistency, system\n// icons are a subset of Bootstrap Icons.\n//\n// **Start system icons**\nconst icons = {\n\t'caret': `\n\t\t<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" fill='currentColor'><path d=\"M16.59 8.295L12 12.875L7.41 8.295L6 9.705L12 15.705L18 9.705L16.59 8.295Z\"/></svg>`,\n\t'check': `\n\t\t<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" fill='currentColor'><path d=\"M8.79496 15.875L4.62496 11.705L3.20496 13.115L8.79496 18.705L20.795 6.705L19.385 5.295L8.79496 15.875Z\"/></svg>`,\n\t'eye-slash': `\n\t\t<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" fill='currentColor'><path d=\"M12.005 6.5C14.765 6.5 17.005 8.74 17.005 11.5C17.005 12.15 16.875 12.76 16.645 13.33L19.565 16.25C21.075 14.99 22.265 13.36 22.995 11.5C21.265 7.11 16.995 4 11.995 4C10.595 4 9.255 4.25 8.01501 4.7L10.175 6.86C10.745 6.63 11.355 6.5 12.005 6.5ZM2.005 3.77L4.745 6.51C3.085 7.8 1.785 9.52 1.005 11.5C2.735 15.89 7.005 19 12.005 19C13.555 19 15.035 18.7 16.385 18.16L16.805 18.58L19.735 21.5L21.005 20.23L3.275 2.5L2.005 3.77ZM7.53501 9.3L9.085 10.85C9.035 11.06 9.005 11.28 9.005 11.5C9.005 13.16 10.345 14.5 12.005 14.5C12.225 14.5 12.445 14.47 12.655 14.42L14.205 15.97C13.535 16.3 12.795 16.5 12.005 16.5C9.245 16.5 7.005 14.26 7.005 11.5C7.005 10.71 7.20501 9.97 7.53501 9.3ZM11.845 8.52L14.995 11.67L15.015 11.51C15.015 9.85 13.675 8.51 12.015 8.51L11.845 8.52Z\"/></svg>`,\n\t'eye': `\n\t\t<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" fill='currentColor'><path d=\"M12 4.5C7 4.5 2.73 7.61 1 12C2.73 16.39 7 19.5 12 19.5C17 19.5 21.27 16.39 23 12C21.27 7.61 17 4.5 12 4.5ZM12 17C9.24 17 7 14.76 7 12C7 9.24 9.24 7 12 7C14.76 7 17 9.24 17 12C17 14.76 14.76 17 12 17ZM12 9C10.34 9 9 10.34 9 12C9 13.66 10.34 15 12 15C13.66 15 15 13.66 15 12C15 10.34 13.66 9 12 9Z\"/></svg>`,\n\t'indeterminate': `\n\t\t<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" fill='currentColor'><path d=\"M19 13H5V11H19V13Z\"/></svg>`,\n\t'x-circle-fill': `\n\t\t<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" fill='currentColor'><path d=\"M12 2C6.47 2 2 6.47 2 12C2 17.53 6.47 22 12 22C17.53 22 22 17.53 22 12C22 6.47 17.53 2 12 2ZM17 15.59L15.59 17L12 13.41L8.41 17L7 15.59L10.59 12L7 8.41L8.41 7L12 10.59L15.59 7L17 8.41L13.41 12L17 15.59Z\"/></svg>`\n};\n// **End system icons**\n\nconst systemLibrary: IconLibrary = {\n name: 'system',\n resolver: (name: keyof typeof icons) => {\n if (name in icons) {\n return `data:image/svg+xml,${encodeURIComponent(icons[name])}`;\n }\n return '';\n }\n};\n\nexport default systemLibrary;\n"],
|
|
5
|
-
"mappings": ";AAWA,IAAM,QAAQ;AAAA,EACb,SAAS;AAAA;AAAA,EAET,SAAS;AAAA;AAAA,EAET,aAAa;AAAA;AAAA,EAEb,OAAO;AAAA;AAAA,EAEP,iBAAiB;AAAA;AAAA,EAEjB,iBAAiB;AAAA;AAElB;AAGA,IAAM,gBAA6B;AAAA,EACjC,MAAM;AAAA,EACN,UAAU,CAAC,SAA6B;AACtC,QAAI,QAAQ,OAAO;AACjB,aAAO,sBAAsB,mBAAmB,MAAM,IAAI,CAAC,CAAC;AAAA,IAC9D;AACA,WAAO;AAAA,EACT;AACF;AAEA,IAAO,yBAAQ;",
|
|
4
|
+
"sourcesContent": ["/* eslint-disable */\nimport type { IconLibrary } from './library.js';\n\n//\n// System icons are a separate library to ensure they're always available, regardless of how the default icon library is\n// configured or if its icons resolve properly.\n//\n// All Synergy components must use the system library instead of the default library. For visual consistency, system\n// icons are a subset of Bootstrap Icons.\n//\n// **Start system icons**\nconst icons = {\n\t'caret': `\n\t\t<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" fill='currentColor'><path d=\"M16.59 8.295L12 12.875L7.41 8.295L6 9.705L12 15.705L18 9.705L16.59 8.295Z\"/></svg>`,\n\t'check': `\n\t\t<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" fill='currentColor'><path d=\"M8.79496 15.875L4.62496 11.705L3.20496 13.115L8.79496 18.705L20.795 6.705L19.385 5.295L8.79496 15.875Z\"/></svg>`,\n\t'eye-slash': `\n\t\t<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" fill='currentColor'><path d=\"M12.005 6.5C14.765 6.5 17.005 8.74 17.005 11.5C17.005 12.15 16.875 12.76 16.645 13.33L19.565 16.25C21.075 14.99 22.265 13.36 22.995 11.5C21.265 7.11 16.995 4 11.995 4C10.595 4 9.255 4.25 8.01501 4.7L10.175 6.86C10.745 6.63 11.355 6.5 12.005 6.5ZM2.005 3.77L4.745 6.51C3.085 7.8 1.785 9.52 1.005 11.5C2.735 15.89 7.005 19 12.005 19C13.555 19 15.035 18.7 16.385 18.16L16.805 18.58L19.735 21.5L21.005 20.23L3.275 2.5L2.005 3.77ZM7.53501 9.3L9.085 10.85C9.035 11.06 9.005 11.28 9.005 11.5C9.005 13.16 10.345 14.5 12.005 14.5C12.225 14.5 12.445 14.47 12.655 14.42L14.205 15.97C13.535 16.3 12.795 16.5 12.005 16.5C9.245 16.5 7.005 14.26 7.005 11.5C7.005 10.71 7.20501 9.97 7.53501 9.3ZM11.845 8.52L14.995 11.67L15.015 11.51C15.015 9.85 13.675 8.51 12.015 8.51L11.845 8.52Z\"/></svg>`,\n\t'eye': `\n\t\t<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" fill='currentColor'><path d=\"M12 4.5C7 4.5 2.73 7.61 1 12C2.73 16.39 7 19.5 12 19.5C17 19.5 21.27 16.39 23 12C21.27 7.61 17 4.5 12 4.5ZM12 17C9.24 17 7 14.76 7 12C7 9.24 9.24 7 12 7C14.76 7 17 9.24 17 12C17 14.76 14.76 17 12 17ZM12 9C10.34 9 9 10.34 9 12C9 13.66 10.34 15 12 15C13.66 15 15 13.66 15 12C15 10.34 13.66 9 12 9Z\"/></svg>`,\n\t'indeterminate': `\n\t\t<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" fill='currentColor'><path d=\"M19 13H5V11H19V13Z\"/></svg>`,\n\t'radio': `\n\t\t<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" fill='currentColor'><path d=\"M17 12C17 14.7614 14.7614 17 12 17C9.23858 17 7 14.7614 7 12C7 9.23858 9.23858 7 12 7C14.7614 7 17 9.23858 17 12Z\"/></svg>`,\n\t'x-circle-fill': `\n\t\t<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" fill='currentColor'><path d=\"M12 2C6.47 2 2 6.47 2 12C2 17.53 6.47 22 12 22C17.53 22 22 17.53 22 12C22 6.47 17.53 2 12 2ZM17 15.59L15.59 17L12 13.41L8.41 17L7 15.59L10.59 12L7 8.41L8.41 7L12 10.59L15.59 7L17 8.41L13.41 12L17 15.59Z\"/></svg>`\n};\n// **End system icons**\n\nconst systemLibrary: IconLibrary = {\n name: 'system',\n resolver: (name: keyof typeof icons) => {\n if (name in icons) {\n return `data:image/svg+xml,${encodeURIComponent(icons[name])}`;\n }\n return '';\n }\n};\n\nexport default systemLibrary;\n"],
|
|
5
|
+
"mappings": ";AAWA,IAAM,QAAQ;AAAA,EACb,SAAS;AAAA;AAAA,EAET,SAAS;AAAA;AAAA,EAET,aAAa;AAAA;AAAA,EAEb,OAAO;AAAA;AAAA,EAEP,iBAAiB;AAAA;AAAA,EAEjB,SAAS;AAAA;AAAA,EAET,iBAAiB;AAAA;AAElB;AAGA,IAAM,gBAA6B;AAAA,EACjC,MAAM;AAAA,EACN,UAAU,CAAC,SAA6B;AACtC,QAAI,QAAQ,OAAO;AACjB,aAAO,sBAAsB,mBAAmB,MAAM,IAAI,CAAC,CAAC;AAAA,IAC9D;AACA,WAAO;AAAA,EACT;AACF;AAEA,IAAO,yBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -15,13 +15,13 @@ import {
|
|
|
15
15
|
} from "./chunk.P2LNG2PZ.js";
|
|
16
16
|
import {
|
|
17
17
|
SynIcon
|
|
18
|
-
} from "./chunk.
|
|
18
|
+
} from "./chunk.QAB6MVFI.js";
|
|
19
19
|
import {
|
|
20
20
|
watch
|
|
21
21
|
} from "./chunk.VZ7S7YYN.js";
|
|
22
22
|
import {
|
|
23
23
|
SynergyElement
|
|
24
|
-
} from "./chunk.
|
|
24
|
+
} from "./chunk.U3DCFCX3.js";
|
|
25
25
|
import {
|
|
26
26
|
__decorateClass
|
|
27
27
|
} from "./chunk.DJOAQ4JU.js";
|
|
@@ -477,4 +477,4 @@ __decorateClass([
|
|
|
477
477
|
export {
|
|
478
478
|
SynInput
|
|
479
479
|
};
|
|
480
|
-
//# sourceMappingURL=chunk.
|
|
480
|
+
//# sourceMappingURL=chunk.L6IGKNDY.js.map
|
|
@@ -0,0 +1,184 @@
|
|
|
1
|
+
import {
|
|
2
|
+
switch_custom_styles_default
|
|
3
|
+
} from "./chunk.AFEABUNX.js";
|
|
4
|
+
import {
|
|
5
|
+
component_styles_default
|
|
6
|
+
} from "./chunk.O7USYXBT.js";
|
|
7
|
+
|
|
8
|
+
// src/components/switch/switch.styles.ts
|
|
9
|
+
import { css } from "lit";
|
|
10
|
+
var switch_styles_default = css`
|
|
11
|
+
/* stylelint-disable */
|
|
12
|
+
${component_styles_default}
|
|
13
|
+
|
|
14
|
+
:host {
|
|
15
|
+
display: inline-block;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
:host([size='small']) {
|
|
19
|
+
--height: var(--syn-toggle-size-small);
|
|
20
|
+
--thumb-size: calc(var(--syn-toggle-size-small) + 4px);
|
|
21
|
+
--width: calc(var(--height) * 2);
|
|
22
|
+
|
|
23
|
+
font-size: var(--syn-input-font-size-small);
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
:host([size='medium']) {
|
|
27
|
+
--height: var(--syn-toggle-size-medium);
|
|
28
|
+
--thumb-size: calc(var(--syn-toggle-size-medium) + 4px);
|
|
29
|
+
--width: calc(var(--height) * 2);
|
|
30
|
+
|
|
31
|
+
font-size: var(--syn-input-font-size-medium);
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
:host([size='large']) {
|
|
35
|
+
--height: var(--syn-toggle-size-large);
|
|
36
|
+
--thumb-size: calc(var(--syn-toggle-size-large) + 4px);
|
|
37
|
+
--width: calc(var(--height) * 2);
|
|
38
|
+
|
|
39
|
+
font-size: var(--syn-input-font-size-large);
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
.switch {
|
|
43
|
+
position: relative;
|
|
44
|
+
display: inline-flex;
|
|
45
|
+
align-items: center;
|
|
46
|
+
font-family: var(--syn-input-font-family);
|
|
47
|
+
font-size: inherit;
|
|
48
|
+
font-weight: var(--syn-input-font-weight);
|
|
49
|
+
color: var(--syn-input-label-color);
|
|
50
|
+
vertical-align: middle;
|
|
51
|
+
cursor: pointer;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.switch__control {
|
|
55
|
+
flex: 0 0 auto;
|
|
56
|
+
position: relative;
|
|
57
|
+
display: inline-flex;
|
|
58
|
+
align-items: center;
|
|
59
|
+
justify-content: center;
|
|
60
|
+
width: var(--width);
|
|
61
|
+
height: var(--height);
|
|
62
|
+
background-color: var(--syn-color-neutral-400);
|
|
63
|
+
border: solid var(--syn-input-border-width) var(--syn-color-neutral-400);
|
|
64
|
+
border-radius: var(--height);
|
|
65
|
+
transition:
|
|
66
|
+
var(--syn-transition-fast) border-color,
|
|
67
|
+
var(--syn-transition-fast) background-color;
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
.switch__control .switch__thumb {
|
|
71
|
+
width: var(--thumb-size);
|
|
72
|
+
height: var(--thumb-size);
|
|
73
|
+
background-color: var(--syn-color-neutral-0);
|
|
74
|
+
border-radius: 50%;
|
|
75
|
+
border: solid var(--syn-input-border-width) var(--syn-color-neutral-400);
|
|
76
|
+
translate: calc((var(--width) - var(--height)) / -2);
|
|
77
|
+
transition:
|
|
78
|
+
var(--syn-transition-fast) translate ease,
|
|
79
|
+
var(--syn-transition-fast) background-color,
|
|
80
|
+
var(--syn-transition-fast) border-color,
|
|
81
|
+
var(--syn-transition-fast) box-shadow;
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
.switch__input {
|
|
85
|
+
position: absolute;
|
|
86
|
+
opacity: 0;
|
|
87
|
+
padding: 0;
|
|
88
|
+
margin: 0;
|
|
89
|
+
pointer-events: none;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
/* Hover */
|
|
93
|
+
.switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover {
|
|
94
|
+
background-color: var(--syn-color-neutral-400);
|
|
95
|
+
border-color: var(--syn-color-neutral-400);
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
.switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover .switch__thumb {
|
|
99
|
+
background-color: var(--syn-color-neutral-0);
|
|
100
|
+
border-color: var(--syn-color-neutral-400);
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
/* Focus */
|
|
104
|
+
.switch:not(.switch--checked):not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {
|
|
105
|
+
background-color: var(--syn-color-neutral-400);
|
|
106
|
+
border-color: var(--syn-color-neutral-400);
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
.switch:not(.switch--checked):not(.switch--disabled) .switch__input:focus-visible ~ .switch__control .switch__thumb {
|
|
110
|
+
background-color: var(--syn-color-neutral-0);
|
|
111
|
+
border-color: var(--syn-color-primary-600);
|
|
112
|
+
outline: var(--syn-focus-ring);
|
|
113
|
+
outline-offset: var(--syn-focus-ring-offset);
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
/* Checked */
|
|
117
|
+
.switch--checked .switch__control {
|
|
118
|
+
background-color: var(--syn-color-primary-600);
|
|
119
|
+
border-color: var(--syn-color-primary-600);
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
.switch--checked .switch__control .switch__thumb {
|
|
123
|
+
background-color: var(--syn-color-neutral-0);
|
|
124
|
+
border-color: var(--syn-color-primary-600);
|
|
125
|
+
translate: calc((var(--width) - var(--height)) / 2);
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
/* Checked + hover */
|
|
129
|
+
.switch.switch--checked:not(.switch--disabled) .switch__control:hover {
|
|
130
|
+
background-color: var(--syn-color-primary-600);
|
|
131
|
+
border-color: var(--syn-color-primary-600);
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
.switch.switch--checked:not(.switch--disabled) .switch__control:hover .switch__thumb {
|
|
135
|
+
background-color: var(--syn-color-neutral-0);
|
|
136
|
+
border-color: var(--syn-color-primary-600);
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
/* Checked + focus */
|
|
140
|
+
.switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {
|
|
141
|
+
background-color: var(--syn-color-primary-600);
|
|
142
|
+
border-color: var(--syn-color-primary-600);
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
.switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control .switch__thumb {
|
|
146
|
+
background-color: var(--syn-color-neutral-0);
|
|
147
|
+
border-color: var(--syn-color-primary-600);
|
|
148
|
+
outline: var(--syn-focus-ring);
|
|
149
|
+
outline-offset: var(--syn-focus-ring-offset);
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
/* Disabled */
|
|
153
|
+
.switch--disabled {
|
|
154
|
+
opacity: 0.5;
|
|
155
|
+
cursor: not-allowed;
|
|
156
|
+
}
|
|
157
|
+
|
|
158
|
+
.switch__label {
|
|
159
|
+
display: inline-block;
|
|
160
|
+
line-height: var(--height);
|
|
161
|
+
margin-inline-start: 0.5em;
|
|
162
|
+
user-select: none;
|
|
163
|
+
-webkit-user-select: none;
|
|
164
|
+
}
|
|
165
|
+
|
|
166
|
+
:host([required]) .switch__label::after {
|
|
167
|
+
content: var(--syn-input-required-content);
|
|
168
|
+
margin-inline-start: var(--syn-input-required-content-offset);
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
@media (forced-colors: active) {
|
|
172
|
+
.switch.switch--checked:not(.switch--disabled) .switch__control:hover .switch__thumb,
|
|
173
|
+
.switch--checked .switch__control .switch__thumb {
|
|
174
|
+
background-color: ButtonText;
|
|
175
|
+
}
|
|
176
|
+
}
|
|
177
|
+
|
|
178
|
+
${switch_custom_styles_default}
|
|
179
|
+
`;
|
|
180
|
+
|
|
181
|
+
export {
|
|
182
|
+
switch_styles_default
|
|
183
|
+
};
|
|
184
|
+
//# sourceMappingURL=chunk.MNMITYTH.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/components/switch/switch.styles.ts"],
|
|
4
|
+
"sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { css } from 'lit';\nimport customStyles from './switch.custom.styles.js';\nimport componentStyles from '../../styles/component.styles.js';\n\nexport default css`\n\t/* stylelint-disable */\n ${componentStyles}\n\n :host {\n display: inline-block;\n }\n\n :host([size='small']) {\n --height: var(--syn-toggle-size-small);\n --thumb-size: calc(var(--syn-toggle-size-small) + 4px);\n --width: calc(var(--height) * 2);\n\n font-size: var(--syn-input-font-size-small);\n }\n\n :host([size='medium']) {\n --height: var(--syn-toggle-size-medium);\n --thumb-size: calc(var(--syn-toggle-size-medium) + 4px);\n --width: calc(var(--height) * 2);\n\n font-size: var(--syn-input-font-size-medium);\n }\n\n :host([size='large']) {\n --height: var(--syn-toggle-size-large);\n --thumb-size: calc(var(--syn-toggle-size-large) + 4px);\n --width: calc(var(--height) * 2);\n\n font-size: var(--syn-input-font-size-large);\n }\n\n .switch {\n position: relative;\n display: inline-flex;\n align-items: center;\n font-family: var(--syn-input-font-family);\n font-size: inherit;\n font-weight: var(--syn-input-font-weight);\n color: var(--syn-input-label-color);\n vertical-align: middle;\n cursor: pointer;\n }\n\n .switch__control {\n flex: 0 0 auto;\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: var(--width);\n height: var(--height);\n background-color: var(--syn-color-neutral-400);\n border: solid var(--syn-input-border-width) var(--syn-color-neutral-400);\n border-radius: var(--height);\n transition:\n var(--syn-transition-fast) border-color,\n var(--syn-transition-fast) background-color;\n }\n\n .switch__control .switch__thumb {\n width: var(--thumb-size);\n height: var(--thumb-size);\n background-color: var(--syn-color-neutral-0);\n border-radius: 50%;\n border: solid var(--syn-input-border-width) var(--syn-color-neutral-400);\n translate: calc((var(--width) - var(--height)) / -2);\n transition:\n var(--syn-transition-fast) translate ease,\n var(--syn-transition-fast) background-color,\n var(--syn-transition-fast) border-color,\n var(--syn-transition-fast) box-shadow;\n }\n\n .switch__input {\n position: absolute;\n opacity: 0;\n padding: 0;\n margin: 0;\n pointer-events: none;\n }\n\n /* Hover */\n .switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover {\n background-color: var(--syn-color-neutral-400);\n border-color: var(--syn-color-neutral-400);\n }\n\n .switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover .switch__thumb {\n background-color: var(--syn-color-neutral-0);\n border-color: var(--syn-color-neutral-400);\n }\n\n /* Focus */\n .switch:not(.switch--checked):not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {\n background-color: var(--syn-color-neutral-400);\n border-color: var(--syn-color-neutral-400);\n }\n\n .switch:not(.switch--checked):not(.switch--disabled) .switch__input:focus-visible ~ .switch__control .switch__thumb {\n background-color: var(--syn-color-neutral-0);\n border-color: var(--syn-color-primary-600);\n outline: var(--syn-focus-ring);\n outline-offset: var(--syn-focus-ring-offset);\n }\n\n /* Checked */\n .switch--checked .switch__control {\n background-color: var(--syn-color-primary-600);\n border-color: var(--syn-color-primary-600);\n }\n\n .switch--checked .switch__control .switch__thumb {\n background-color: var(--syn-color-neutral-0);\n border-color: var(--syn-color-primary-600);\n translate: calc((var(--width) - var(--height)) / 2);\n }\n\n /* Checked + hover */\n .switch.switch--checked:not(.switch--disabled) .switch__control:hover {\n background-color: var(--syn-color-primary-600);\n border-color: var(--syn-color-primary-600);\n }\n\n .switch.switch--checked:not(.switch--disabled) .switch__control:hover .switch__thumb {\n background-color: var(--syn-color-neutral-0);\n border-color: var(--syn-color-primary-600);\n }\n\n /* Checked + focus */\n .switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control {\n background-color: var(--syn-color-primary-600);\n border-color: var(--syn-color-primary-600);\n }\n\n .switch.switch--checked:not(.switch--disabled) .switch__input:focus-visible ~ .switch__control .switch__thumb {\n background-color: var(--syn-color-neutral-0);\n border-color: var(--syn-color-primary-600);\n outline: var(--syn-focus-ring);\n outline-offset: var(--syn-focus-ring-offset);\n }\n\n /* Disabled */\n .switch--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .switch__label {\n display: inline-block;\n line-height: var(--height);\n margin-inline-start: 0.5em;\n user-select: none;\n -webkit-user-select: none;\n }\n\n :host([required]) .switch__label::after {\n content: var(--syn-input-required-content);\n margin-inline-start: var(--syn-input-required-content-offset);\n }\n\n @media (forced-colors: active) {\n .switch.switch--checked:not(.switch--disabled) .switch__control:hover .switch__thumb,\n .switch--checked .switch__control .switch__thumb {\n background-color: ButtonText;\n }\n }\n\n ${customStyles}\n`;\n\n"],
|
|
5
|
+
"mappings": ";;;;;;;;AAMA,SAAS,WAAW;AAIpB,IAAO,wBAAQ;AAAA;AAAA,IAEX,wBAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAsKf,4BAAY;AAAA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|