@fluentui/react-switch 0.0.0-nightly6a6e258c4020220125.1 → 0.0.0-nightly6faffd280a20220221.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.json CHANGED
@@ -2,90 +2,94 @@
2
2
  "name": "@fluentui/react-switch",
3
3
  "entries": [
4
4
  {
5
- "date": "Tue, 25 Jan 2022 04:17:21 GMT",
6
- "tag": "@fluentui/react-switch_v0.0.0-nightly6a6e258c4020220125.1",
7
- "version": "0.0.0-nightly6a6e258c4020220125.1",
5
+ "date": "Mon, 21 Feb 2022 04:15:30 GMT",
6
+ "tag": "@fluentui/react-switch_v0.0.0-nightly6faffd280a20220221.1",
7
+ "version": "0.0.0-nightly6faffd280a20220221.1",
8
8
  "comments": {
9
9
  "prerelease": [
10
10
  {
11
11
  "author": "email not defined",
12
12
  "package": "@fluentui/react-switch",
13
- "commit": "1d41ec351a6d5902e871c87fcbaacf8db8ecb40d",
13
+ "commit": "01ee61722cce4da8e5deb9a2ab00f4e27fc01cfd",
14
14
  "comment": "Release nightly v9"
15
15
  },
16
16
  {
17
- "author": "behowell@microsoft.com",
18
- "package": "@fluentui/react-switch",
19
- "commit": "7cc28ed8320b00f42d91c63882f10316db2205c5",
20
- "comment": "Remove component's shorthandProps array"
21
- },
22
- {
23
- "author": "olfedias@microsoft.com",
17
+ "author": "beachball",
24
18
  "package": "@fluentui/react-switch",
25
- "commit": "029a7f2fe40e5abe21d8992ad9d92bf2b04d0e97",
26
- "comment": "update styles to not use CSS shorthands"
19
+ "comment": "Bump @fluentui/react-shared-contexts to v0.0.0-nightly6faffd280a20220221.1",
20
+ "commit": "01ee61722cce4da8e5deb9a2ab00f4e27fc01cfd"
27
21
  },
28
22
  {
29
- "author": "Humberto.Morimoto@microsoft.com",
30
- "package": "@fluentui/react-switch",
31
- "commit": "b52ebbbf185a2ddc4de814238f9438fd04bfba02",
32
- "comment": "Replacing use of functions in makeStyles with direct use of tokens."
33
- },
34
- {
35
- "author": "Humberto.Morimoto@microsoft.com",
23
+ "author": "beachball",
36
24
  "package": "@fluentui/react-switch",
37
- "commit": "38c8bed2c707014688ae2ae689033fa36ef23075",
38
- "comment": "Updating packages based on changes to focusIndicator functions to remove functions from makeStyles in @fluentui/react-tabster."
25
+ "comment": "Bump @fluentui/react-tabster to v0.0.0-nightly6faffd280a20220221.1",
26
+ "commit": "01ee61722cce4da8e5deb9a2ab00f4e27fc01cfd"
39
27
  },
40
28
  {
41
- "author": "behowell@microsoft.com",
29
+ "author": "beachball",
42
30
  "package": "@fluentui/react-switch",
43
- "commit": "317209bb5cd57c40f35bc42060acb7e3cce5ec95",
44
- "comment": "BREAKING: Rename component hooks add the suffix _unstable, as their API has not been finalized yet"
31
+ "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly6faffd280a20220221.1",
32
+ "commit": "01ee61722cce4da8e5deb9a2ab00f4e27fc01cfd"
45
33
  },
46
34
  {
47
35
  "author": "beachball",
48
36
  "package": "@fluentui/react-switch",
49
- "comment": "Bump @fluentui/react-make-styles to v0.0.0-nightly6a6e258c4020220125.1",
50
- "commit": "1d41ec351a6d5902e871c87fcbaacf8db8ecb40d"
51
- },
37
+ "comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly6faffd280a20220221.1",
38
+ "commit": "01ee61722cce4da8e5deb9a2ab00f4e27fc01cfd"
39
+ }
40
+ ]
41
+ }
42
+ },
43
+ {
44
+ "date": "Fri, 18 Feb 2022 13:35:34 GMT",
45
+ "tag": "@fluentui/react-switch_v9.0.0-rc.3",
46
+ "version": "9.0.0-rc.3",
47
+ "comments": {
48
+ "prerelease": [
52
49
  {
53
- "author": "beachball",
50
+ "author": "mgodbolt@microsoft.com",
54
51
  "package": "@fluentui/react-switch",
55
- "comment": "Bump @fluentui/react-shared-contexts to v0.0.0-nightly6a6e258c4020220125.1",
56
- "commit": "1d41ec351a6d5902e871c87fcbaacf8db8ecb40d"
52
+ "commit": "2c9804dd585c1b485736c34321264dc62abe6fe1",
53
+ "comment": "fix visual display of controlled switches"
57
54
  },
58
55
  {
59
- "author": "beachball",
56
+ "author": "lingfangao@hotmail.com",
60
57
  "package": "@fluentui/react-switch",
61
- "comment": "Bump @fluentui/react-tabster to v0.0.0-nightly6a6e258c4020220125.1",
62
- "commit": "1d41ec351a6d5902e871c87fcbaacf8db8ecb40d"
58
+ "commit": "1aa9e691fcccd9a64168cea7941c0f1e71fa1d14",
59
+ "comment": "fix: Source maps contain original source code"
63
60
  },
64
61
  {
65
62
  "author": "beachball",
66
63
  "package": "@fluentui/react-switch",
67
- "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly6a6e258c4020220125.1",
68
- "commit": "1d41ec351a6d5902e871c87fcbaacf8db8ecb40d"
64
+ "comment": "Bump @fluentui/react-shared-contexts to v9.0.0-rc.3",
65
+ "commit": "3b9c1e931c23173da3d1af0c696cdc58516ce504"
69
66
  },
70
67
  {
71
68
  "author": "beachball",
72
69
  "package": "@fluentui/react-switch",
73
- "comment": "Bump @fluentui/babel-make-styles to v0.0.0-nightly6a6e258c4020220125.1",
74
- "commit": "1d41ec351a6d5902e871c87fcbaacf8db8ecb40d"
70
+ "comment": "Bump @fluentui/react-tabster to v9.0.0-rc.3",
71
+ "commit": "3b9c1e931c23173da3d1af0c696cdc58516ce504"
75
72
  },
76
73
  {
77
74
  "author": "beachball",
78
75
  "package": "@fluentui/react-switch",
79
- "comment": "Bump @fluentui/jest-serializer-make-styles to v0.0.0-nightly6a6e258c4020220125.1",
80
- "commit": "1d41ec351a6d5902e871c87fcbaacf8db8ecb40d"
76
+ "comment": "Bump @fluentui/react-utilities to v9.0.0-rc.3",
77
+ "commit": "3b9c1e931c23173da3d1af0c696cdc58516ce504"
81
78
  },
82
79
  {
83
80
  "author": "beachball",
84
81
  "package": "@fluentui/react-switch",
85
- "comment": "Bump @fluentui/react-conformance-make-styles to v0.0.0-nightly6a6e258c4020220125.1",
86
- "commit": "1d41ec351a6d5902e871c87fcbaacf8db8ecb40d"
82
+ "comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.3",
83
+ "commit": "3b9c1e931c23173da3d1af0c696cdc58516ce504"
87
84
  }
88
- ],
85
+ ]
86
+ }
87
+ },
88
+ {
89
+ "date": "Thu, 10 Feb 2022 08:50:51 GMT",
90
+ "tag": "@fluentui/react-switch_v9.0.0-rc.1",
91
+ "version": "9.0.0-rc.1",
92
+ "comments": {
89
93
  "none": [
90
94
  {
91
95
  "author": "martinhochel@microsoft.com",
@@ -111,6 +115,92 @@
111
115
  "commit": "c061e98be4b4a718c72a144a1f60bb5515824612",
112
116
  "comment": "remove inline-style-expand-shorthand from tsconfigs"
113
117
  }
118
+ ],
119
+ "prerelease": [
120
+ {
121
+ "author": "olfedias@microsoft.com",
122
+ "package": "@fluentui/react-switch",
123
+ "commit": "1df1d6e85bd3a6ab2a7b13e96a9aac324bb6d00c",
124
+ "comment": "Replace make-styles packages with griffel equivalents."
125
+ },
126
+ {
127
+ "author": "Humberto.Morimoto@microsoft.com",
128
+ "package": "@fluentui/react-switch",
129
+ "commit": "e0b8e1fa6980077e7b311fd1c72c28d3e4305db0",
130
+ "comment": "Updating based on changes to composition types."
131
+ },
132
+ {
133
+ "author": "behowell@microsoft.com",
134
+ "package": "@fluentui/react-switch",
135
+ "commit": "7cc28ed8320b00f42d91c63882f10316db2205c5",
136
+ "comment": "Remove component's shorthandProps array"
137
+ },
138
+ {
139
+ "author": "behowell@microsoft.com",
140
+ "package": "@fluentui/react-switch",
141
+ "commit": "53b01d71e335715fda91b33e3d7bbd9d471d5ed3",
142
+ "comment": "Refactor component Slot typings"
143
+ },
144
+ {
145
+ "author": "mgodbolt@microsoft.com",
146
+ "package": "@fluentui/react-switch",
147
+ "commit": "839ec14849e112b85aa321d034739ec421199141",
148
+ "comment": "remove export of commons types"
149
+ },
150
+ {
151
+ "author": "olfedias@microsoft.com",
152
+ "package": "@fluentui/react-switch",
153
+ "commit": "029a7f2fe40e5abe21d8992ad9d92bf2b04d0e97",
154
+ "comment": "update styles to not use CSS shorthands"
155
+ },
156
+ {
157
+ "author": "Humberto.Morimoto@microsoft.com",
158
+ "package": "@fluentui/react-switch",
159
+ "commit": "b52ebbbf185a2ddc4de814238f9438fd04bfba02",
160
+ "comment": "Replacing use of functions in makeStyles with direct use of tokens."
161
+ },
162
+ {
163
+ "author": "Humberto.Morimoto@microsoft.com",
164
+ "package": "@fluentui/react-switch",
165
+ "commit": "38c8bed2c707014688ae2ae689033fa36ef23075",
166
+ "comment": "Updating packages based on changes to focusIndicator functions to remove functions from makeStyles in @fluentui/react-tabster."
167
+ },
168
+ {
169
+ "author": "behowell@microsoft.com",
170
+ "package": "@fluentui/react-switch",
171
+ "commit": "317209bb5cd57c40f35bc42060acb7e3cce5ec95",
172
+ "comment": "BREAKING: Rename component hooks add the suffix _unstable, as their API has not been finalized yet"
173
+ },
174
+ {
175
+ "author": "lingfangao@hotmail.com",
176
+ "package": "@fluentui/react-switch",
177
+ "commit": "c00913d50e2dd15bbfbb0757cefe43b192ff1d7f",
178
+ "comment": "Bump Fluent UI dependencies to 9.0.0-rc"
179
+ },
180
+ {
181
+ "author": "beachball",
182
+ "package": "@fluentui/react-switch",
183
+ "comment": "Bump @fluentui/react-shared-contexts to v9.0.0-rc.1",
184
+ "commit": "e6c855f6d9019d6c73668d15fc9bc3a13291a6c8"
185
+ },
186
+ {
187
+ "author": "beachball",
188
+ "package": "@fluentui/react-switch",
189
+ "comment": "Bump @fluentui/react-tabster to v9.0.0-rc.1",
190
+ "commit": "e6c855f6d9019d6c73668d15fc9bc3a13291a6c8"
191
+ },
192
+ {
193
+ "author": "beachball",
194
+ "package": "@fluentui/react-switch",
195
+ "comment": "Bump @fluentui/react-utilities to v9.0.0-rc.1",
196
+ "commit": "e6c855f6d9019d6c73668d15fc9bc3a13291a6c8"
197
+ },
198
+ {
199
+ "author": "beachball",
200
+ "package": "@fluentui/react-switch",
201
+ "comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.1",
202
+ "commit": "e6c855f6d9019d6c73668d15fc9bc3a13291a6c8"
203
+ }
114
204
  ]
115
205
  }
116
206
  },
package/CHANGELOG.md CHANGED
@@ -1,29 +1,57 @@
1
1
  # Change Log - @fluentui/react-switch
2
2
 
3
- This log was last generated on Tue, 25 Jan 2022 04:17:21 GMT and should not be manually modified.
3
+ This log was last generated on Mon, 21 Feb 2022 04:15:30 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
- ## [0.0.0-nightly6a6e258c4020220125.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-switch_v0.0.0-nightly6a6e258c4020220125.1)
7
+ ## [0.0.0-nightly6faffd280a20220221.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-switch_v0.0.0-nightly6faffd280a20220221.1)
8
8
 
9
- Tue, 25 Jan 2022 04:17:21 GMT
10
- [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-switch_v9.0.0-beta.5..@fluentui/react-switch_v0.0.0-nightly6a6e258c4020220125.1)
9
+ Mon, 21 Feb 2022 04:15:30 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-switch_v9.0.0-rc.3..@fluentui/react-switch_v0.0.0-nightly6faffd280a20220221.1)
11
11
 
12
12
  ### Changes
13
13
 
14
- - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/1d41ec351a6d5902e871c87fcbaacf8db8ecb40d) by email not defined)
14
+ - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/01ee61722cce4da8e5deb9a2ab00f4e27fc01cfd) by email not defined)
15
+ - Bump @fluentui/react-shared-contexts to v0.0.0-nightly6faffd280a20220221.1 ([commit](https://github.com/microsoft/fluentui/commit/01ee61722cce4da8e5deb9a2ab00f4e27fc01cfd) by beachball)
16
+ - Bump @fluentui/react-tabster to v0.0.0-nightly6faffd280a20220221.1 ([commit](https://github.com/microsoft/fluentui/commit/01ee61722cce4da8e5deb9a2ab00f4e27fc01cfd) by beachball)
17
+ - Bump @fluentui/react-utilities to v0.0.0-nightly6faffd280a20220221.1 ([commit](https://github.com/microsoft/fluentui/commit/01ee61722cce4da8e5deb9a2ab00f4e27fc01cfd) by beachball)
18
+ - Bump @fluentui/react-conformance-griffel to v0.0.0-nightly6faffd280a20220221.1 ([commit](https://github.com/microsoft/fluentui/commit/01ee61722cce4da8e5deb9a2ab00f4e27fc01cfd) by beachball)
19
+
20
+ ## [9.0.0-rc.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-switch_v9.0.0-rc.3)
21
+
22
+ Fri, 18 Feb 2022 13:35:34 GMT
23
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-switch_v9.0.0-rc.1..@fluentui/react-switch_v9.0.0-rc.3)
24
+
25
+ ### Changes
26
+
27
+ - fix visual display of controlled switches ([PR #21704](https://github.com/microsoft/fluentui/pull/21704) by mgodbolt@microsoft.com)
28
+ - fix: Source maps contain original source code ([PR #21690](https://github.com/microsoft/fluentui/pull/21690) by lingfangao@hotmail.com)
29
+ - Bump @fluentui/react-shared-contexts to v9.0.0-rc.3 ([PR #21800](https://github.com/microsoft/fluentui/pull/21800) by beachball)
30
+ - Bump @fluentui/react-tabster to v9.0.0-rc.3 ([PR #21800](https://github.com/microsoft/fluentui/pull/21800) by beachball)
31
+ - Bump @fluentui/react-utilities to v9.0.0-rc.3 ([PR #21800](https://github.com/microsoft/fluentui/pull/21800) by beachball)
32
+ - Bump @fluentui/react-conformance-griffel to v9.0.0-beta.3 ([PR #21800](https://github.com/microsoft/fluentui/pull/21800) by beachball)
33
+
34
+ ## [9.0.0-rc.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-switch_v9.0.0-rc.1)
35
+
36
+ Thu, 10 Feb 2022 08:50:51 GMT
37
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-switch_v9.0.0-beta.5..@fluentui/react-switch_v9.0.0-rc.1)
38
+
39
+ ### Changes
40
+
41
+ - Replace make-styles packages with griffel equivalents. ([PR #21424](https://github.com/microsoft/fluentui/pull/21424) by olfedias@microsoft.com)
42
+ - Updating based on changes to composition types. ([PR #20891](https://github.com/microsoft/fluentui/pull/20891) by Humberto.Morimoto@microsoft.com)
15
43
  - Remove component's shorthandProps array ([PR #21134](https://github.com/microsoft/fluentui/pull/21134) by behowell@microsoft.com)
44
+ - Refactor component Slot typings ([PR #21518](https://github.com/microsoft/fluentui/pull/21518) by behowell@microsoft.com)
45
+ - remove export of commons types ([PR #21660](https://github.com/microsoft/fluentui/pull/21660) by mgodbolt@microsoft.com)
16
46
  - update styles to not use CSS shorthands ([PR #20844](https://github.com/microsoft/fluentui/pull/20844) by olfedias@microsoft.com)
17
47
  - Replacing use of functions in makeStyles with direct use of tokens. ([PR #21056](https://github.com/microsoft/fluentui/pull/21056) by Humberto.Morimoto@microsoft.com)
18
48
  - Updating packages based on changes to focusIndicator functions to remove functions from makeStyles in @fluentui/react-tabster. ([PR #21035](https://github.com/microsoft/fluentui/pull/21035) by Humberto.Morimoto@microsoft.com)
19
49
  - BREAKING: Rename component hooks add the suffix _unstable, as their API has not been finalized yet ([PR #21365](https://github.com/microsoft/fluentui/pull/21365) by behowell@microsoft.com)
20
- - Bump @fluentui/react-make-styles to v0.0.0-nightly6a6e258c4020220125.1 ([commit](https://github.com/microsoft/fluentui/commit/1d41ec351a6d5902e871c87fcbaacf8db8ecb40d) by beachball)
21
- - Bump @fluentui/react-shared-contexts to v0.0.0-nightly6a6e258c4020220125.1 ([commit](https://github.com/microsoft/fluentui/commit/1d41ec351a6d5902e871c87fcbaacf8db8ecb40d) by beachball)
22
- - Bump @fluentui/react-tabster to v0.0.0-nightly6a6e258c4020220125.1 ([commit](https://github.com/microsoft/fluentui/commit/1d41ec351a6d5902e871c87fcbaacf8db8ecb40d) by beachball)
23
- - Bump @fluentui/react-utilities to v0.0.0-nightly6a6e258c4020220125.1 ([commit](https://github.com/microsoft/fluentui/commit/1d41ec351a6d5902e871c87fcbaacf8db8ecb40d) by beachball)
24
- - Bump @fluentui/babel-make-styles to v0.0.0-nightly6a6e258c4020220125.1 ([commit](https://github.com/microsoft/fluentui/commit/1d41ec351a6d5902e871c87fcbaacf8db8ecb40d) by beachball)
25
- - Bump @fluentui/jest-serializer-make-styles to v0.0.0-nightly6a6e258c4020220125.1 ([commit](https://github.com/microsoft/fluentui/commit/1d41ec351a6d5902e871c87fcbaacf8db8ecb40d) by beachball)
26
- - Bump @fluentui/react-conformance-make-styles to v0.0.0-nightly6a6e258c4020220125.1 ([commit](https://github.com/microsoft/fluentui/commit/1d41ec351a6d5902e871c87fcbaacf8db8ecb40d) by beachball)
50
+ - Bump Fluent UI dependencies to 9.0.0-rc ([PR #21623](https://github.com/microsoft/fluentui/pull/21623) by lingfangao@hotmail.com)
51
+ - Bump @fluentui/react-shared-contexts to v9.0.0-rc.1 ([commit](https://github.com/microsoft/fluentui/commit/e6c855f6d9019d6c73668d15fc9bc3a13291a6c8) by beachball)
52
+ - Bump @fluentui/react-tabster to v9.0.0-rc.1 ([commit](https://github.com/microsoft/fluentui/commit/e6c855f6d9019d6c73668d15fc9bc3a13291a6c8) by beachball)
53
+ - Bump @fluentui/react-utilities to v9.0.0-rc.1 ([commit](https://github.com/microsoft/fluentui/commit/e6c855f6d9019d6c73668d15fc9bc3a13291a6c8) by beachball)
54
+ - Bump @fluentui/react-conformance-griffel to v9.0.0-beta.1 ([commit](https://github.com/microsoft/fluentui/commit/e6c855f6d9019d6c73668d15fc9bc3a13291a6c8) by beachball)
27
55
 
28
56
  ## [9.0.0-beta.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-switch_v9.0.0-beta.5)
29
57
 
@@ -1,8 +1,8 @@
1
1
  import type { ComponentProps } from '@fluentui/react-utilities';
2
2
  import type { ComponentState } from '@fluentui/react-utilities';
3
3
  import type { ForwardRefComponent } from '@fluentui/react-utilities';
4
- import type { IntrinsicShorthandProps } from '@fluentui/react-utilities';
5
4
  import * as React_2 from 'react';
5
+ import type { Slot } from '@fluentui/react-utilities';
6
6
 
7
7
  /**
8
8
  * Render the final JSX of Switch
@@ -16,7 +16,7 @@ export declare const Switch: ForwardRefComponent<SwitchProps>;
16
16
 
17
17
  export declare const switchClassName = "fui-Switch";
18
18
 
19
- export declare interface SwitchCommons {
19
+ declare interface SwitchCommons {
20
20
  /**
21
21
  * The starting value for a uncontrolled Switch. If `true` then the Switch will be enabled.
22
22
  * Mutually exclusive with `checked` prop.
@@ -43,34 +43,34 @@ export declare interface SwitchCommons {
43
43
  }) => void;
44
44
  }
45
45
 
46
- export declare interface SwitchProps extends Omit<ComponentProps<SwitchSlots>, 'onChange'>, SwitchCommons {
46
+ export declare interface SwitchProps extends Omit<ComponentProps<Partial<SwitchSlots>>, 'onChange'>, SwitchCommons {
47
47
  }
48
48
 
49
49
  export declare type SwitchSlots = {
50
50
  /**
51
51
  * The root of the Switch.
52
52
  */
53
- root: IntrinsicShorthandProps<'div'>;
53
+ root: Slot<'div'>;
54
54
  /**
55
55
  * The bar indicating the status of the Switch.
56
56
  */
57
- track: IntrinsicShorthandProps<'div'>;
57
+ track: NonNullable<Slot<'div'>>;
58
58
  /**
59
59
  * The wrapper around the thumb. It is used as the active area for the thumb to position itself.
60
60
  */
61
- thumbWrapper: IntrinsicShorthandProps<'div'>;
61
+ thumbWrapper: NonNullable<Slot<'div'>>;
62
62
  /**
63
63
  * The circular icon indicating the status of the Switch.
64
64
  */
65
- thumb: IntrinsicShorthandProps<'div'>;
65
+ thumb: NonNullable<Slot<'div'>>;
66
66
  /**
67
67
  * The hidden input that handles the Switch's internal functionality.
68
68
  */
69
- input: IntrinsicShorthandProps<'input'>;
69
+ input: NonNullable<Slot<'input'>>;
70
70
  /**
71
71
  * The area in which the Switch's rail allows for the thumb to be dragged.
72
72
  */
73
- activeRail: IntrinsicShorthandProps<'div'>;
73
+ activeRail: NonNullable<Slot<'div'>>;
74
74
  };
75
75
 
76
76
  export declare interface SwitchState extends ComponentState<SwitchSlots>, SwitchCommons {
package/lib/Switch.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Switch.js","sourceRoot":"","sources":["../src/Switch.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC"}
1
+ {"version":3,"file":"Switch.js","sourceRoot":"../src/","sources":["Switch.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC","sourcesContent":["export * from './components/Switch/index';\n"]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Switch/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,kBAAT,QAAmC,aAAnC;AACA,SAAS,qBAAT,QAAsC,gBAAtC;AACA,SAAS,wBAAT,QAAyC,mBAAzC;AAIA;;AAEG;;AACH,OAAO,MAAM,MAAM,gBAAqC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACtF,QAAM,KAAK,GAAG,kBAAkB,CAAC,KAAD,EAAQ,GAAR,CAAhC;AAEA,EAAA,wBAAwB,CAAC,KAAD,CAAxB;AAEA,SAAO,qBAAqB,CAAC,KAAD,CAA5B;AACD,CANuD,CAAjD;AAQP,MAAM,CAAC,WAAP,GAAqB,QAArB","sourceRoot":""}
1
+ {"version":3,"sources":["components/Switch/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,kBAAT,QAAmC,aAAnC;AACA,SAAS,qBAAT,QAAsC,gBAAtC;AACA,SAAS,wBAAT,QAAyC,mBAAzC;AAIA;;AAEG;;AACH,OAAO,MAAM,MAAM,gBAAqC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACtF,QAAM,KAAK,GAAG,kBAAkB,CAAC,KAAD,EAAQ,GAAR,CAAhC;AAEA,EAAA,wBAAwB,CAAC,KAAD,CAAxB;AAEA,SAAO,qBAAqB,CAAC,KAAD,CAA5B;AACD,CANuD,CAAjD;AAQP,MAAM,CAAC,WAAP,GAAqB,QAArB","sourcesContent":["import * as React from 'react';\nimport { useSwitch_unstable } from './useSwitch';\nimport { renderSwitch_unstable } from './renderSwitch';\nimport { useSwitchStyles_unstable } from './useSwitchStyles';\nimport type { SwitchProps } from './Switch.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * The Switch control enables users to trigger an option on or off through pressing on the component.\n */\nexport const Switch: ForwardRefComponent<SwitchProps> = React.forwardRef((props, ref) => {\n const state = useSwitch_unstable(props, ref);\n\n useSwitchStyles_unstable(state);\n\n return renderSwitch_unstable(state);\n});\n\nSwitch.displayName = 'Switch';\n"],"sourceRoot":"../src/"}
@@ -1,32 +1,32 @@
1
1
  import * as React from 'react';
2
- import type { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
2
+ import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
3
3
  export declare type SwitchSlots = {
4
4
  /**
5
5
  * The root of the Switch.
6
6
  */
7
- root: IntrinsicShorthandProps<'div'>;
7
+ root: Slot<'div'>;
8
8
  /**
9
9
  * The bar indicating the status of the Switch.
10
10
  */
11
- track: IntrinsicShorthandProps<'div'>;
11
+ track: NonNullable<Slot<'div'>>;
12
12
  /**
13
13
  * The wrapper around the thumb. It is used as the active area for the thumb to position itself.
14
14
  */
15
- thumbWrapper: IntrinsicShorthandProps<'div'>;
15
+ thumbWrapper: NonNullable<Slot<'div'>>;
16
16
  /**
17
17
  * The circular icon indicating the status of the Switch.
18
18
  */
19
- thumb: IntrinsicShorthandProps<'div'>;
19
+ thumb: NonNullable<Slot<'div'>>;
20
20
  /**
21
21
  * The hidden input that handles the Switch's internal functionality.
22
22
  */
23
- input: IntrinsicShorthandProps<'input'>;
23
+ input: NonNullable<Slot<'input'>>;
24
24
  /**
25
25
  * The area in which the Switch's rail allows for the thumb to be dragged.
26
26
  */
27
- activeRail: IntrinsicShorthandProps<'div'>;
27
+ activeRail: NonNullable<Slot<'div'>>;
28
28
  };
29
- export interface SwitchCommons {
29
+ interface SwitchCommons {
30
30
  /**
31
31
  * The starting value for a uncontrolled Switch. If `true` then the Switch will be enabled.
32
32
  * Mutually exclusive with `checked` prop.
@@ -52,7 +52,8 @@ export interface SwitchCommons {
52
52
  checked: boolean;
53
53
  }) => void;
54
54
  }
55
- export interface SwitchProps extends Omit<ComponentProps<SwitchSlots>, 'onChange'>, SwitchCommons {
55
+ export interface SwitchProps extends Omit<ComponentProps<Partial<SwitchSlots>>, 'onChange'>, SwitchCommons {
56
56
  }
57
57
  export interface SwitchState extends ComponentState<SwitchSlots>, SwitchCommons {
58
58
  }
59
+ export {};
@@ -1 +1 @@
1
- {"version":3,"file":"Switch.types.js","sourceRoot":"","sources":["../../../src/components/Switch/Switch.types.ts"],"names":[],"mappings":""}
1
+ {"version":3,"file":"Switch.types.js","sourceRoot":"../src/","sources":["components/Switch/Switch.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type SwitchSlots = {\n /**\n * The root of the Switch.\n */\n root: Slot<'div'>;\n\n /**\n * The bar indicating the status of the Switch.\n */\n track: NonNullable<Slot<'div'>>;\n\n /**\n * The wrapper around the thumb. It is used as the active area for the thumb to position itself.\n */\n thumbWrapper: NonNullable<Slot<'div'>>;\n\n /**\n * The circular icon indicating the status of the Switch.\n */\n thumb: NonNullable<Slot<'div'>>;\n\n /**\n * The hidden input that handles the Switch's internal functionality.\n */\n input: NonNullable<Slot<'input'>>;\n\n /**\n * The area in which the Switch's rail allows for the thumb to be dragged.\n */\n activeRail: NonNullable<Slot<'div'>>;\n};\n\ninterface SwitchCommons {\n /**\n * The starting value for a uncontrolled Switch. If `true` then the Switch will be enabled.\n * Mutually exclusive with `checked` prop.\n *\n * @default false\n */\n defaultChecked?: boolean;\n\n /**\n * The current value for a controlled Switch. If `true` then the Switch will be enabled.\n * Mutually exclusive with `defaultChecked` prop.\n */\n checked?: boolean;\n\n /**\n * Whether the Switch should be disabled.\n *\n * @default false\n */\n disabled?: boolean;\n\n /**\n * Callback to be called when the `checked` value changes.\n */\n onChange?: (\n ev: React.PointerEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>,\n data: {\n checked: boolean;\n },\n ) => void;\n}\n\nexport interface SwitchProps extends Omit<ComponentProps<Partial<SwitchSlots>>, 'onChange'>, SwitchCommons {}\n\nexport interface SwitchState extends ComponentState<SwitchSlots>, SwitchCommons {}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Switch/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,cAAc,mBAAmB,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/Switch/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,cAAc,mBAAmB,CAAC","sourcesContent":["export * from './Switch';\nexport * from './Switch.types';\nexport * from './renderSwitch';\nexport * from './useSwitch';\nexport * from './useSwitchStyles';\n"]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Switch/renderSwitch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,qBAAqB,GAAI,KAAD,IAAuB;AAC1D,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAc,KAAd,CAArC;AAEA,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CADF,eAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,YAAP,EAAmB,EAAA,GAAK,SAAS,CAAC;AAAf,GAAnB,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CADF,CAFF,eAKE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CALF,eAME,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,UAAP,EAAiB,EAAA,GAAK,SAAS,CAAC;AAAf,GAAjB,CANF,CADF;AAUD,CAbM","sourceRoot":""}
1
+ {"version":3,"sources":["components/Switch/renderSwitch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,qBAAqB,GAAI,KAAD,IAAuB;AAC1D,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAc,KAAd,CAArC;AAEA,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CADF,eAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,YAAP,EAAmB,EAAA,GAAK,SAAS,CAAC;AAAf,GAAnB,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CADF,CAFF,eAKE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CALF,eAME,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,UAAP,EAAiB,EAAA,GAAK,SAAS,CAAC;AAAf,GAAjB,CANF,CADF;AAUD,CAbM","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { SwitchState, SwitchSlots } from './Switch.types';\n\n/**\n * Render the final JSX of Switch\n */\nexport const renderSwitch_unstable = (state: SwitchState) => {\n const { slots, slotProps } = getSlots<SwitchSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n <slots.track {...slotProps.track} />\n <slots.thumbWrapper {...slotProps.thumbWrapper}>\n <slots.thumb {...slotProps.thumb} />\n </slots.thumbWrapper>\n <slots.input {...slotProps.input} />\n <slots.activeRail {...slotProps.activeRail} />\n </slots.root>\n );\n};\n"],"sourceRoot":"../src/"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Switch/useSwitch.ts"],"names":[],"mappings":"AACA,SAAS,qBAAT,EAAgC,gBAAhC,EAAkD,KAAlD,QAA+D,2BAA/D;AACA,SAAS,cAAT,QAA+B,kBAA/B;AAGA;;AAEG;;AACH,OAAO,MAAM,kBAAkB,GAAG,CAAC,KAAD,EAAqB,GAArB,KAAiE;AACjG,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA,YAAT;AAAuB,IAAA,KAAvB;AAA8B,IAAA,UAA9B;AAA0C,IAAA,KAA1C;AAAiD,IAAA,cAAjD;AAAiE,IAAA,OAAjE;AAA0E,IAAA,QAA1E;AAAoF,IAAA;AAApF,MAAiG,KAAvG;AACA,QAAM,KAAK,GAAgB;AACzB,IAAA,cADyB;AAEzB,IAAA,OAFyB;AAGzB,IAAA,QAHyB;AAIzB,IAAA,QAJyB;AAKzB,IAAA,IAAI,EAAE,qBAAqB,CAAC,MAAD,EAAS;AAClC,MAAA,GADkC;AAElC,SAAG,KAF+B;AAGlC,MAAA,EAAE,EAAE,KAAK,CAAC,SAAD,EAAY,KAAK,CAAC,EAAlB;AAHyB,KAAT,CALF;AAUzB,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,KAAK,EAAE,KAFG;AAGV,MAAA,YAAY,EAAE,KAHJ;AAIV,MAAA,KAAK,EAAE,KAJG;AAKV,MAAA,UAAU,EAAE,KALF;AAMV,MAAA,KAAK,EAAE;AANG,KAVa;AAkBzB,IAAA,KAAK,EAAE,gBAAgB,CAAC,KAAD,EAAQ;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAR,CAlBE;AAmBzB,IAAA,YAAY,EAAE,gBAAgB,CAAC,YAAD,EAAe;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAf,CAnBL;AAoBzB,IAAA,KAAK,EAAE,gBAAgB,CAAC,KAAD,EAAQ;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAR,CApBE;AAqBzB,IAAA,UAAU,EAAE,gBAAgB,CAAC,UAAD,EAAa;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAb,CArBH;AAsBzB,IAAA,KAAK,EAAE,gBAAgB,CAAC,KAAD,EAAQ;AAC7B,MAAA,QAAQ,EAAE,IADmB;AAE7B,MAAA,YAAY,EAAE;AACZ,QAAA,IAAI,EAAE;AADM;AAFe,KAAR;AAtBE,GAA3B;AA8BA,EAAA,cAAc,CAAC,KAAD,CAAd;AAEA,SAAO,KAAP;AACD,CAnCM","sourceRoot":""}
1
+ {"version":3,"sources":["components/Switch/useSwitch.ts"],"names":[],"mappings":"AACA,SAAS,qBAAT,EAAgC,gBAAhC,EAAkD,KAAlD,QAA+D,2BAA/D;AACA,SAAS,cAAT,QAA+B,kBAA/B;AAGA;;AAEG;;AACH,OAAO,MAAM,kBAAkB,GAAG,CAAC,KAAD,EAAqB,GAArB,KAAiE;AACjG,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA,YAAT;AAAuB,IAAA,KAAvB;AAA8B,IAAA,UAA9B;AAA0C,IAAA,KAA1C;AAAiD,IAAA,cAAjD;AAAiE,IAAA,OAAjE;AAA0E,IAAA,QAA1E;AAAoF,IAAA;AAApF,MAAiG,KAAvG;AACA,QAAM,KAAK,GAAgB;AACzB,IAAA,cADyB;AAEzB,IAAA,OAFyB;AAGzB,IAAA,QAHyB;AAIzB,IAAA,QAJyB;AAKzB,IAAA,IAAI,EAAE,qBAAqB,CAAC,MAAD,EAAS;AAClC,MAAA,GADkC;AAElC,SAAG,KAF+B;AAGlC,MAAA,EAAE,EAAE,KAAK,CAAC,SAAD,EAAY,KAAK,CAAC,EAAlB;AAHyB,KAAT,CALF;AAUzB,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,KAAK,EAAE,KAFG;AAGV,MAAA,YAAY,EAAE,KAHJ;AAIV,MAAA,KAAK,EAAE,KAJG;AAKV,MAAA,UAAU,EAAE,KALF;AAMV,MAAA,KAAK,EAAE;AANG,KAVa;AAkBzB,IAAA,KAAK,EAAE,gBAAgB,CAAC,KAAD,EAAQ;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAR,CAlBE;AAmBzB,IAAA,YAAY,EAAE,gBAAgB,CAAC,YAAD,EAAe;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAf,CAnBL;AAoBzB,IAAA,KAAK,EAAE,gBAAgB,CAAC,KAAD,EAAQ;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAR,CApBE;AAqBzB,IAAA,UAAU,EAAE,gBAAgB,CAAC,UAAD,EAAa;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAb,CArBH;AAsBzB,IAAA,KAAK,EAAE,gBAAgB,CAAC,KAAD,EAAQ;AAC7B,MAAA,QAAQ,EAAE,IADmB;AAE7B,MAAA,YAAY,EAAE;AACZ,QAAA,IAAI,EAAE;AADM;AAFe,KAAR;AAtBE,GAA3B;AA8BA,EAAA,cAAc,CAAC,KAAD,CAAd;AAEA,SAAO,KAAP;AACD,CAnCM","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport { useSwitchState } from './useSwitchState';\nimport type { SwitchProps, SwitchState } from './Switch.types';\n\n/**\n * Given user props, returns state and render function for a Switch.\n */\nexport const useSwitch_unstable = (props: SwitchProps, ref: React.Ref<HTMLElement>): SwitchState => {\n const { track, thumbWrapper, thumb, activeRail, input, defaultChecked, checked, disabled, onChange } = props;\n const state: SwitchState = {\n defaultChecked,\n checked,\n disabled,\n onChange,\n root: getNativeElementProps('span', {\n ref,\n ...props,\n id: useId('switch-', props.id),\n }),\n components: {\n root: 'div',\n track: 'div',\n thumbWrapper: 'div',\n thumb: 'div',\n activeRail: 'div',\n input: 'input',\n },\n track: resolveShorthand(track, { required: true }),\n thumbWrapper: resolveShorthand(thumbWrapper, { required: true }),\n thumb: resolveShorthand(thumb, { required: true }),\n activeRail: resolveShorthand(activeRail, { required: true }),\n input: resolveShorthand(input, {\n required: true,\n defaultProps: {\n type: 'checkbox',\n },\n }),\n };\n\n useSwitchState(state);\n\n return state;\n};\n"],"sourceRoot":"../src/"}
@@ -38,7 +38,7 @@ export const useSwitchState = state => {
38
38
  setTrue: showThumbAnimation,
39
39
  setFalse: hideThumbAnimation
40
40
  }] = useBoolean(true);
41
- const [renderedPosition, setRenderedPosition] = React.useState(currentValue === true ? 100 : 0);
41
+ const [renderedPosition, setRenderedPosition] = React.useState(undefined);
42
42
  const setChecked = useEventCallback((ev, incomingValue) => {
43
43
  ev.stopPropagation();
44
44
  ev.preventDefault();
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Switch/useSwitchState.ts"],"names":[],"mappings":"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","sourceRoot":""}
1
+ {"version":3,"sources":["components/Switch/useSwitchState.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { clamp, useBoolean, useControllableState, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { useFluent } from '@fluentui/react-shared-contexts';\nimport type { SwitchState } from './Switch.types';\n\ntype SwitchInternalState = {\n /**\n * The internal rendered value of the Switch.\n */\n internalValue: boolean;\n\n /**\n * Whether the thumb is currently being dragged.\n */\n thumbIsDragging: boolean;\n\n /**\n * Disposable events for the Switch.\n */\n disposables: (() => void)[];\n};\n\n// TODO: This should be replaced with a useEvent hook\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst on = (element: Element, eventName: string, callback: (ev: any) => void) => {\n element.addEventListener(eventName, callback);\n return () => element.removeEventListener(eventName, callback);\n};\n\nexport const useSwitchState = (state: SwitchState) => {\n const { defaultChecked = false, checked, disabled = false, onChange } = state;\n const { onPointerDown: onPointerDownCallback, onKeyUp: onKeyUpCallback } = state.root;\n\n const { dir } = useFluent();\n const inputRef = useMergedRefs(state.input.ref);\n const railRef = React.useRef<HTMLDivElement>(null);\n const internalState = React.useRef<SwitchInternalState>({\n internalValue: checked ? checked : defaultChecked,\n thumbIsDragging: false,\n disposables: [],\n });\n\n const [currentValue, setCurrentValue] = useControllableState({\n defaultState: defaultChecked,\n state: checked,\n initialState: false,\n });\n const [thumbAnimation, { setTrue: showThumbAnimation, setFalse: hideThumbAnimation }] = useBoolean(true);\n const [renderedPosition, setRenderedPosition] = React.useState<number | undefined>(undefined);\n\n const setChecked = useEventCallback(\n (ev: React.PointerEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>, incomingValue: boolean) => {\n ev.stopPropagation();\n ev.preventDefault();\n internalState.current.internalValue = incomingValue;\n onChange?.(ev, { checked: incomingValue });\n setCurrentValue(incomingValue);\n setRenderedPosition(undefined);\n },\n );\n\n const calculatePosition = React.useCallback(\n (ev: React.PointerEvent<HTMLDivElement>): number => {\n const currentBounds = railRef?.current?.getBoundingClientRect();\n const railWidth = currentBounds!.width;\n const railPosition = dir === 'rtl' ? currentBounds!.right : currentBounds!.left;\n const distance = dir === 'rtl' ? railPosition - ev.clientX : ev.clientX - railPosition;\n return clamp((distance / railWidth) * 100, 0, 100);\n },\n [dir],\n );\n\n const onPointerMove = React.useCallback(\n (ev: React.PointerEvent<HTMLDivElement>): void => {\n const incomingPosition = calculatePosition(ev);\n\n internalState.current.thumbIsDragging = true;\n hideThumbAnimation();\n setRenderedPosition(incomingPosition);\n\n // If the Switch reaches a new position of 0% or 100%, update the state and fire change.\n if (incomingPosition === 100 && internalState.current.internalValue !== true) {\n setChecked(ev, true);\n } else if (incomingPosition === 0 && internalState.current.internalValue !== false) {\n setChecked(ev, false);\n }\n },\n [calculatePosition, hideThumbAnimation, setChecked],\n );\n\n const onPointerUp = React.useCallback(\n (ev: React.PointerEvent<HTMLDivElement>): void => {\n internalState.current.disposables.forEach(dispose => dispose());\n internalState.current.disposables = [];\n inputRef.current!.focus();\n\n if (internalState.current.thumbIsDragging) {\n const roundedPosition = Math.round(calculatePosition(ev)! / 100) * 100;\n\n showThumbAnimation();\n if (roundedPosition === 100) {\n setChecked(ev, true);\n } else if (roundedPosition === 0) {\n setChecked(ev, false);\n }\n } else {\n setChecked(ev, !internalState.current.internalValue);\n }\n },\n [calculatePosition, inputRef, setChecked, showThumbAnimation],\n );\n\n const onPointerDown = React.useCallback(\n (ev: React.PointerEvent<HTMLDivElement>): void => {\n const { pointerId } = ev;\n const target = ev.target as HTMLElement;\n\n onPointerDownCallback?.(ev);\n showThumbAnimation();\n target.setPointerCapture?.(pointerId);\n internalState.current.thumbIsDragging = false;\n\n internalState.current.disposables.push(\n on(target, 'pointermove', onPointerMove),\n on(target, 'pointerup', onPointerUp),\n () => {\n target.releasePointerCapture?.(pointerId);\n },\n );\n },\n [onPointerDownCallback, onPointerMove, onPointerUp, showThumbAnimation],\n );\n\n const onKeyUp = React.useCallback(\n (ev: React.KeyboardEvent<HTMLDivElement>): void => {\n onKeyUpCallback?.(ev);\n if (ev.key === ' ') {\n setChecked(ev, !internalState.current.internalValue);\n }\n },\n [onKeyUpCallback, setChecked],\n );\n\n const currentPosition = renderedPosition !== undefined ? renderedPosition : currentValue ? 100 : 0;\n\n const rootStyles = {\n '--switch-checked-opacity': currentPosition / 100,\n '--switch-unchecked-opacity': (100 - currentPosition) / 100,\n } as React.CSSProperties;\n\n const thumbWrapperStyles = {\n transform: `translate(${dir === 'rtl' ? -currentPosition : currentPosition}%)`,\n transition: thumbAnimation\n ? 'transform .1s cubic-bezier(0.33, 0.0, 0.67, 1), opacity .1s cubic-bezier(0.33, 0.0, 0.67, 1)'\n : 'none',\n };\n\n // Root Props\n state.root.style = rootStyles;\n if (!disabled) {\n state.root.onPointerDown = onPointerDown;\n state.root.onKeyUp = onKeyUp;\n }\n\n // Input Props\n state.input.checked = currentValue;\n state.input.disabled = disabled;\n state.input.ref = inputRef;\n state.input.readOnly = true;\n state.input.role = 'switch';\n\n // Thumb Container Props\n state.thumbWrapper.style = thumbWrapperStyles;\n\n // Active Rail Props\n state.activeRail.ref = railRef;\n\n return state;\n};\n"],"sourceRoot":"../src/"}
@@ -1,4 +1,4 @@
1
- import { shorthands, __styles, mergeClasses } from '@fluentui/react-make-styles';
1
+ import { shorthands, __styles, mergeClasses } from '@griffel/react';
2
2
  import { createFocusOutlineStyle } from '@fluentui/react-tabster';
3
3
  import { tokens } from '@fluentui/react-theme';
4
4
  export const switchClassName = 'fui-Switch';
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Switch/useSwitchStyles.ts"],"names":[],"mappings":"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","sourceRoot":""}
1
+ {"version":3,"sources":["components/Switch/useSwitchStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { shorthands, makeStyles, mergeClasses } from '@griffel/react';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SwitchState } from './Switch.types';\n\nexport const switchClassName = 'fui-Switch';\nconst trackClassName = `${switchClassName}-track`;\nconst thumbClassName = `${switchClassName}-thumb`;\n\n/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n root: {\n '--switch-width': '40px',\n '--switch-height': '20px',\n '--switch-thumb-size': '14px',\n '--switch-checked-opacity': '0',\n '--switch-unchecked-opacity': '0',\n\n position: 'relative',\n width: 'var(--switch-width)',\n height: 'var(--switch-height)',\n display: 'inline-block',\n userSelect: 'none',\n touchAction: 'none',\n verticalAlign: 'bottom',\n },\n\n unchecked: {\n [`:hover .${thumbClassName}`]: {\n ':before': {\n backgroundColor: tokens.colorNeutralStrokeAccessibleHover,\n },\n },\n\n [`:hover .${trackClassName}`]: {\n ':before': {\n borderColor: tokens.colorNeutralStrokeAccessibleHover,\n },\n },\n },\n\n checked: {\n [`:hover .${trackClassName}`]: {\n ':after': {\n backgroundColor: tokens.colorBrandBackgroundHover,\n },\n },\n\n [`:active .${trackClassName}`]: {\n ':after': {\n backgroundColor: tokens.colorBrandBackgroundPressed,\n },\n },\n },\n\n enabled: {\n '-webkit-tap-highlight-color': 'rgba(0,0,0,0)',\n cursor: 'pointer',\n },\n\n disabled: {\n cursor: 'not-allowed',\n pointerEvents: 'none',\n },\n\n focusIndicator: createFocusOutlineStyle({ selector: 'focus-within', style: { outlineOffset: '8px' } }),\n});\n\n/**\n * Styles for the track slot\n */\nconst useTrackStyles = makeStyles({\n track: {\n position: 'absolute',\n width: '100%',\n height: '100%',\n transitionProperty: 'backgroundColor',\n transitionDuration: '0.1s',\n transitionTimingFunction: 'cubic-bezier(0.33, 0, 0.67, 1)',\n touchAction: 'none',\n pointerEvents: 'none',\n\n ':before': {\n position: 'absolute',\n top: '0px',\n left: '0px',\n bottom: '0px',\n right: '0px',\n boxSizing: 'border-box',\n ...shorthands.borderRadius('999px'),\n content: \"''\",\n opacity: 'var(--switch-unchecked-opacity)',\n },\n\n ':after': {\n position: 'absolute',\n top: '0px',\n left: '0px',\n bottom: '0px',\n right: '0px',\n boxSizing: 'border-box',\n ...shorthands.borderRadius('999px'),\n content: \"''\",\n opacity: 'var(--switch-checked-opacity)',\n },\n },\n\n unchecked: {\n ':before': {\n ...shorthands.border('1px', 'solid', tokens.colorNeutralStrokeAccessible),\n backgroundColor: 'transparent',\n },\n },\n\n checked: {\n ':after': {\n backgroundColor: tokens.colorBrandBackground,\n ...shorthands.borderStyle('none'),\n },\n },\n\n disabledUnchecked: {\n ':before': {\n ...shorthands.border('1px', 'solid', tokens.colorNeutralStrokeDisabled),\n },\n },\n\n disabledChecked: {\n ':after': {\n ...shorthands.border('1px', 'solid', tokens.colorTransparentStrokeDisabled),\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n },\n },\n});\n\n/**\n * Styles for the thumb wrapper slot\n */\nconst useThumbWrapperStyles = makeStyles({\n thumbWrapper: {\n position: 'absolute',\n top: '0',\n bottom: '0',\n left: 'calc(var(--switch-thumb-size) * .7)',\n right: 'calc(var(--switch-thumb-size) * .7)',\n touchAction: 'none',\n pointerEvents: 'none',\n },\n});\n\n/**\n * Styles for the thumb slot\n */\nconst useThumbStyles = makeStyles({\n thumb: {\n position: 'absolute',\n width: 'var(--switch-thumb-size)',\n height: 'var(--switch-thumb-size)',\n boxSizing: 'border-box',\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n top: '50%',\n transform: 'translate(-50%, -50%)',\n transitionProperty: 'backgroundColor',\n transitionDuration: '0.1s',\n transitionTimingFunction: 'cubic-bezier(0.33, 0, 0.67, 1)',\n touchAction: 'none',\n pointerEvents: 'none',\n\n ':before': {\n position: 'absolute',\n top: '0px',\n left: '0px',\n bottom: '0px',\n right: '0px',\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n content: \"''\",\n opacity: 'var(--switch-unchecked-opacity)',\n },\n\n ':after': {\n position: 'absolute',\n top: '0px',\n left: '0px',\n bottom: '0px',\n right: '0px',\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n content: \"''\",\n opacity: 'var(--switch-checked-opacity)',\n },\n },\n\n unchecked: {\n ':before': {\n backgroundColor: tokens.colorNeutralStrokeAccessible,\n },\n },\n\n checked: {\n ':after': {\n backgroundColor: tokens.colorNeutralForegroundOnBrand,\n },\n },\n\n disabledUnchecked: {\n ':before': {\n ...shorthands.border('1px', 'solid', tokens.colorNeutralForegroundDisabled),\n backgroundColor: tokens.colorNeutralBackground1,\n },\n },\n\n disabledChecked: {\n ':after': {\n backgroundColor: tokens.colorNeutralForegroundDisabled,\n },\n },\n});\n\n/**\n * Styles for the activeRail slot\n */\nconst useActiveRailStyles = makeStyles({\n activeRail: {\n position: 'absolute',\n left: 'calc(var(--switch-thumb-size) * .7)',\n right: 'calc(var(--switch-thumb-size) * .7)',\n },\n});\n\n/**\n * Styles for the hidden input slot\n */\nconst useInputStyle = makeStyles({\n input: {\n opacity: 0,\n position: 'absolute',\n ...shorthands.padding(0),\n ...shorthands.margin(0),\n width: '100%',\n height: '100%',\n touchAction: 'none',\n pointerEvents: 'none',\n },\n});\n\n/**\n * Apply styling to the Switch slots based on the state\n */\nexport const useSwitchStyles_unstable = (state: SwitchState): SwitchState => {\n const { checked, disabled } = state.input;\n\n const rootStyles = useRootStyles();\n const trackStyles = useTrackStyles();\n const thumbWrapperStyles = useThumbWrapperStyles();\n const thumbStyles = useThumbStyles();\n const activeRailStyles = useActiveRailStyles();\n const inputStyles = useInputStyle();\n\n state.root.className = mergeClasses(\n switchClassName + (checked ? ' checked' : ''),\n rootStyles.root,\n rootStyles.focusIndicator,\n !disabled && rootStyles.checked,\n !disabled && rootStyles.unchecked,\n disabled ? rootStyles.disabled : rootStyles.enabled,\n state.root.className,\n );\n\n state.track.className = mergeClasses(\n trackClassName,\n trackStyles.track,\n !disabled && trackStyles.checked,\n !disabled && trackStyles.unchecked,\n disabled && trackStyles.disabledChecked,\n disabled && trackStyles.disabledUnchecked,\n state.track.className,\n );\n\n state.thumbWrapper.className = mergeClasses(thumbWrapperStyles.thumbWrapper, state.thumbWrapper.className);\n\n state.thumb.className = mergeClasses(\n thumbClassName,\n thumbStyles.thumb,\n !disabled && thumbStyles.checked,\n !disabled && thumbStyles.unchecked,\n disabled && thumbStyles.disabledChecked,\n disabled && thumbStyles.disabledUnchecked,\n state.thumb.className,\n );\n\n state.activeRail.className = mergeClasses(activeRailStyles.activeRail, state.activeRail.className);\n\n state.input.className = mergeClasses(inputStyles.input, state.input.className);\n\n return state;\n};\n"],"sourceRoot":"../src/"}
package/lib/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,cAAc,UAAU,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"../src/","sources":["index.ts"],"names":[],"mappings":"AACA,cAAc,UAAU,CAAC","sourcesContent":["export {};\nexport * from './Switch';\n"]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/Switch.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,2BAAA,CAAA,EAAA,OAAA","sourceRoot":""}
1
+ {"version":3,"sources":["Switch.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,2BAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './components/Switch/index';\n"],"sourceRoot":"../src/"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Switch/Switch.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,WAAA,gBAAA,OAAA,CAAA,aAAA,CAAA;;AACA,MAAA,cAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,MAAA,gBAA2C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACtF,QAAM,KAAK,GAAG,WAAA,CAAA,kBAAA,CAAmB,KAAnB,EAA0B,GAA1B,CAAd;AAEA,EAAA,iBAAA,CAAA,wBAAA,CAAyB,KAAzB;AAEA,SAAO,cAAA,CAAA,qBAAA,CAAsB,KAAtB,CAAP;AACD,CANuD,CAA3C;AAQb,OAAA,CAAA,MAAA,CAAO,WAAP,GAAqB,QAArB","sourceRoot":""}
1
+ {"version":3,"sources":["components/Switch/Switch.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,WAAA,gBAAA,OAAA,CAAA,aAAA,CAAA;;AACA,MAAA,cAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,MAAA,gBAA2C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACtF,QAAM,KAAK,GAAG,WAAA,CAAA,kBAAA,CAAmB,KAAnB,EAA0B,GAA1B,CAAd;AAEA,EAAA,iBAAA,CAAA,wBAAA,CAAyB,KAAzB;AAEA,SAAO,cAAA,CAAA,qBAAA,CAAsB,KAAtB,CAAP;AACD,CANuD,CAA3C;AAQb,OAAA,CAAA,MAAA,CAAO,WAAP,GAAqB,QAArB","sourcesContent":["import * as React from 'react';\nimport { useSwitch_unstable } from './useSwitch';\nimport { renderSwitch_unstable } from './renderSwitch';\nimport { useSwitchStyles_unstable } from './useSwitchStyles';\nimport type { SwitchProps } from './Switch.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * The Switch control enables users to trigger an option on or off through pressing on the component.\n */\nexport const Switch: ForwardRefComponent<SwitchProps> = React.forwardRef((props, ref) => {\n const state = useSwitch_unstable(props, ref);\n\n useSwitchStyles_unstable(state);\n\n return renderSwitch_unstable(state);\n});\n\nSwitch.displayName = 'Switch';\n"],"sourceRoot":"../src/"}
@@ -1,32 +1,32 @@
1
1
  import * as React from 'react';
2
- import type { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
2
+ import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
3
3
  export declare type SwitchSlots = {
4
4
  /**
5
5
  * The root of the Switch.
6
6
  */
7
- root: IntrinsicShorthandProps<'div'>;
7
+ root: Slot<'div'>;
8
8
  /**
9
9
  * The bar indicating the status of the Switch.
10
10
  */
11
- track: IntrinsicShorthandProps<'div'>;
11
+ track: NonNullable<Slot<'div'>>;
12
12
  /**
13
13
  * The wrapper around the thumb. It is used as the active area for the thumb to position itself.
14
14
  */
15
- thumbWrapper: IntrinsicShorthandProps<'div'>;
15
+ thumbWrapper: NonNullable<Slot<'div'>>;
16
16
  /**
17
17
  * The circular icon indicating the status of the Switch.
18
18
  */
19
- thumb: IntrinsicShorthandProps<'div'>;
19
+ thumb: NonNullable<Slot<'div'>>;
20
20
  /**
21
21
  * The hidden input that handles the Switch's internal functionality.
22
22
  */
23
- input: IntrinsicShorthandProps<'input'>;
23
+ input: NonNullable<Slot<'input'>>;
24
24
  /**
25
25
  * The area in which the Switch's rail allows for the thumb to be dragged.
26
26
  */
27
- activeRail: IntrinsicShorthandProps<'div'>;
27
+ activeRail: NonNullable<Slot<'div'>>;
28
28
  };
29
- export interface SwitchCommons {
29
+ interface SwitchCommons {
30
30
  /**
31
31
  * The starting value for a uncontrolled Switch. If `true` then the Switch will be enabled.
32
32
  * Mutually exclusive with `checked` prop.
@@ -52,7 +52,8 @@ export interface SwitchCommons {
52
52
  checked: boolean;
53
53
  }) => void;
54
54
  }
55
- export interface SwitchProps extends Omit<ComponentProps<SwitchSlots>, 'onChange'>, SwitchCommons {
55
+ export interface SwitchProps extends Omit<ComponentProps<Partial<SwitchSlots>>, 'onChange'>, SwitchCommons {
56
56
  }
57
57
  export interface SwitchState extends ComponentState<SwitchSlots>, SwitchCommons {
58
58
  }
59
+ export {};
@@ -1 +1 @@
1
- {"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":""}
1
+ {"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":"../src/"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Switch/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,UAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,gBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,gBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,aAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,mBAAA,CAAA,EAAA,OAAA","sourceRoot":""}
1
+ {"version":3,"sources":["components/Switch/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,UAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,gBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,gBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,aAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,mBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './Switch';\nexport * from './Switch.types';\nexport * from './renderSwitch';\nexport * from './useSwitch';\nexport * from './useSwitchStyles';\n"],"sourceRoot":"../src/"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Switch/renderSwitch.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,qBAAqB,GAAI,KAAD,IAAuB;AAC1D,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAAsB,KAAtB,CAA7B;AAEA,SACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CADF,EAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,YAAP,EAAmB,EAAA,GAAK,SAAS,CAAC;AAAf,GAAnB,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CADF,CAFF,EAKE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CALF,EAME,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,UAAP,EAAiB,EAAA,GAAK,SAAS,CAAC;AAAf,GAAjB,CANF,CADF;AAUD,CAbM;;AAAM,OAAA,CAAA,qBAAA,GAAqB,qBAArB","sourceRoot":""}
1
+ {"version":3,"sources":["components/Switch/renderSwitch.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,qBAAqB,GAAI,KAAD,IAAuB;AAC1D,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAAsB,KAAtB,CAA7B;AAEA,SACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CADF,EAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,YAAP,EAAmB,EAAA,GAAK,SAAS,CAAC;AAAf,GAAnB,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CADF,CAFF,EAKE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CALF,EAME,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,UAAP,EAAiB,EAAA,GAAK,SAAS,CAAC;AAAf,GAAjB,CANF,CADF;AAUD,CAbM;;AAAM,OAAA,CAAA,qBAAA,GAAqB,qBAArB","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { SwitchState, SwitchSlots } from './Switch.types';\n\n/**\n * Render the final JSX of Switch\n */\nexport const renderSwitch_unstable = (state: SwitchState) => {\n const { slots, slotProps } = getSlots<SwitchSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n <slots.track {...slotProps.track} />\n <slots.thumbWrapper {...slotProps.thumbWrapper}>\n <slots.thumb {...slotProps.thumb} />\n </slots.thumbWrapper>\n <slots.input {...slotProps.input} />\n <slots.activeRail {...slotProps.activeRail} />\n </slots.root>\n );\n};\n"],"sourceRoot":"../src/"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Switch/useSwitch.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,gBAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,kBAAkB,GAAG,CAAC,KAAD,EAAqB,GAArB,KAAiE;AACjG,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA,YAAT;AAAuB,IAAA,KAAvB;AAA8B,IAAA,UAA9B;AAA0C,IAAA,KAA1C;AAAiD,IAAA,cAAjD;AAAiE,IAAA,OAAjE;AAA0E,IAAA,QAA1E;AAAoF,IAAA;AAApF,MAAiG,KAAvG;AACA,QAAM,KAAK,GAAgB;AACzB,IAAA,cADyB;AAEzB,IAAA,OAFyB;AAGzB,IAAA,QAHyB;AAIzB,IAAA,QAJyB;AAKzB,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,MAAtB,EAA8B;AAClC,MAAA,GADkC;AAElC,SAAG,KAF+B;AAGlC,MAAA,EAAE,EAAE,iBAAA,CAAA,KAAA,CAAM,SAAN,EAAiB,KAAK,CAAC,EAAvB;AAH8B,KAA9B,CALmB;AAUzB,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,KAAK,EAAE,KAFG;AAGV,MAAA,YAAY,EAAE,KAHJ;AAIV,MAAA,KAAK,EAAE,KAJG;AAKV,MAAA,UAAU,EAAE,KALF;AAMV,MAAA,KAAK,EAAE;AANG,KAVa;AAkBzB,IAAA,KAAK,EAAE,iBAAA,CAAA,gBAAA,CAAiB,KAAjB,EAAwB;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAxB,CAlBkB;AAmBzB,IAAA,YAAY,EAAE,iBAAA,CAAA,gBAAA,CAAiB,YAAjB,EAA+B;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAA/B,CAnBW;AAoBzB,IAAA,KAAK,EAAE,iBAAA,CAAA,gBAAA,CAAiB,KAAjB,EAAwB;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAxB,CApBkB;AAqBzB,IAAA,UAAU,EAAE,iBAAA,CAAA,gBAAA,CAAiB,UAAjB,EAA6B;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAA7B,CArBa;AAsBzB,IAAA,KAAK,EAAE,iBAAA,CAAA,gBAAA,CAAiB,KAAjB,EAAwB;AAC7B,MAAA,QAAQ,EAAE,IADmB;AAE7B,MAAA,YAAY,EAAE;AACZ,QAAA,IAAI,EAAE;AADM;AAFe,KAAxB;AAtBkB,GAA3B;AA8BA,EAAA,gBAAA,CAAA,cAAA,CAAe,KAAf;AAEA,SAAO,KAAP;AACD,CAnCM;;AAAM,OAAA,CAAA,kBAAA,GAAkB,kBAAlB","sourceRoot":""}
1
+ {"version":3,"sources":["components/Switch/useSwitch.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,gBAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,kBAAkB,GAAG,CAAC,KAAD,EAAqB,GAArB,KAAiE;AACjG,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA,YAAT;AAAuB,IAAA,KAAvB;AAA8B,IAAA,UAA9B;AAA0C,IAAA,KAA1C;AAAiD,IAAA,cAAjD;AAAiE,IAAA,OAAjE;AAA0E,IAAA,QAA1E;AAAoF,IAAA;AAApF,MAAiG,KAAvG;AACA,QAAM,KAAK,GAAgB;AACzB,IAAA,cADyB;AAEzB,IAAA,OAFyB;AAGzB,IAAA,QAHyB;AAIzB,IAAA,QAJyB;AAKzB,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,MAAtB,EAA8B;AAClC,MAAA,GADkC;AAElC,SAAG,KAF+B;AAGlC,MAAA,EAAE,EAAE,iBAAA,CAAA,KAAA,CAAM,SAAN,EAAiB,KAAK,CAAC,EAAvB;AAH8B,KAA9B,CALmB;AAUzB,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,KAAK,EAAE,KAFG;AAGV,MAAA,YAAY,EAAE,KAHJ;AAIV,MAAA,KAAK,EAAE,KAJG;AAKV,MAAA,UAAU,EAAE,KALF;AAMV,MAAA,KAAK,EAAE;AANG,KAVa;AAkBzB,IAAA,KAAK,EAAE,iBAAA,CAAA,gBAAA,CAAiB,KAAjB,EAAwB;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAxB,CAlBkB;AAmBzB,IAAA,YAAY,EAAE,iBAAA,CAAA,gBAAA,CAAiB,YAAjB,EAA+B;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAA/B,CAnBW;AAoBzB,IAAA,KAAK,EAAE,iBAAA,CAAA,gBAAA,CAAiB,KAAjB,EAAwB;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAxB,CApBkB;AAqBzB,IAAA,UAAU,EAAE,iBAAA,CAAA,gBAAA,CAAiB,UAAjB,EAA6B;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAA7B,CArBa;AAsBzB,IAAA,KAAK,EAAE,iBAAA,CAAA,gBAAA,CAAiB,KAAjB,EAAwB;AAC7B,MAAA,QAAQ,EAAE,IADmB;AAE7B,MAAA,YAAY,EAAE;AACZ,QAAA,IAAI,EAAE;AADM;AAFe,KAAxB;AAtBkB,GAA3B;AA8BA,EAAA,gBAAA,CAAA,cAAA,CAAe,KAAf;AAEA,SAAO,KAAP;AACD,CAnCM;;AAAM,OAAA,CAAA,kBAAA,GAAkB,kBAAlB","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport { useSwitchState } from './useSwitchState';\nimport type { SwitchProps, SwitchState } from './Switch.types';\n\n/**\n * Given user props, returns state and render function for a Switch.\n */\nexport const useSwitch_unstable = (props: SwitchProps, ref: React.Ref<HTMLElement>): SwitchState => {\n const { track, thumbWrapper, thumb, activeRail, input, defaultChecked, checked, disabled, onChange } = props;\n const state: SwitchState = {\n defaultChecked,\n checked,\n disabled,\n onChange,\n root: getNativeElementProps('span', {\n ref,\n ...props,\n id: useId('switch-', props.id),\n }),\n components: {\n root: 'div',\n track: 'div',\n thumbWrapper: 'div',\n thumb: 'div',\n activeRail: 'div',\n input: 'input',\n },\n track: resolveShorthand(track, { required: true }),\n thumbWrapper: resolveShorthand(thumbWrapper, { required: true }),\n thumb: resolveShorthand(thumb, { required: true }),\n activeRail: resolveShorthand(activeRail, { required: true }),\n input: resolveShorthand(input, {\n required: true,\n defaultProps: {\n type: 'checkbox',\n },\n }),\n };\n\n useSwitchState(state);\n\n return state;\n};\n"],"sourceRoot":"../src/"}
@@ -48,7 +48,7 @@ const useSwitchState = state => {
48
48
  setTrue: showThumbAnimation,
49
49
  setFalse: hideThumbAnimation
50
50
  }] = react_utilities_1.useBoolean(true);
51
- const [renderedPosition, setRenderedPosition] = React.useState(currentValue === true ? 100 : 0);
51
+ const [renderedPosition, setRenderedPosition] = React.useState(undefined);
52
52
  const setChecked = react_utilities_1.useEventCallback((ev, incomingValue) => {
53
53
  ev.stopPropagation();
54
54
  ev.preventDefault();
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Switch/useSwitchState.ts"],"names":[],"mappings":"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","sourceRoot":""}
1
+ {"version":3,"sources":["components/Switch/useSwitchState.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { clamp, useBoolean, useControllableState, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { useFluent } from '@fluentui/react-shared-contexts';\nimport type { SwitchState } from './Switch.types';\n\ntype SwitchInternalState = {\n /**\n * The internal rendered value of the Switch.\n */\n internalValue: boolean;\n\n /**\n * Whether the thumb is currently being dragged.\n */\n thumbIsDragging: boolean;\n\n /**\n * Disposable events for the Switch.\n */\n disposables: (() => void)[];\n};\n\n// TODO: This should be replaced with a useEvent hook\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst on = (element: Element, eventName: string, callback: (ev: any) => void) => {\n element.addEventListener(eventName, callback);\n return () => element.removeEventListener(eventName, callback);\n};\n\nexport const useSwitchState = (state: SwitchState) => {\n const { defaultChecked = false, checked, disabled = false, onChange } = state;\n const { onPointerDown: onPointerDownCallback, onKeyUp: onKeyUpCallback } = state.root;\n\n const { dir } = useFluent();\n const inputRef = useMergedRefs(state.input.ref);\n const railRef = React.useRef<HTMLDivElement>(null);\n const internalState = React.useRef<SwitchInternalState>({\n internalValue: checked ? checked : defaultChecked,\n thumbIsDragging: false,\n disposables: [],\n });\n\n const [currentValue, setCurrentValue] = useControllableState({\n defaultState: defaultChecked,\n state: checked,\n initialState: false,\n });\n const [thumbAnimation, { setTrue: showThumbAnimation, setFalse: hideThumbAnimation }] = useBoolean(true);\n const [renderedPosition, setRenderedPosition] = React.useState<number | undefined>(undefined);\n\n const setChecked = useEventCallback(\n (ev: React.PointerEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>, incomingValue: boolean) => {\n ev.stopPropagation();\n ev.preventDefault();\n internalState.current.internalValue = incomingValue;\n onChange?.(ev, { checked: incomingValue });\n setCurrentValue(incomingValue);\n setRenderedPosition(undefined);\n },\n );\n\n const calculatePosition = React.useCallback(\n (ev: React.PointerEvent<HTMLDivElement>): number => {\n const currentBounds = railRef?.current?.getBoundingClientRect();\n const railWidth = currentBounds!.width;\n const railPosition = dir === 'rtl' ? currentBounds!.right : currentBounds!.left;\n const distance = dir === 'rtl' ? railPosition - ev.clientX : ev.clientX - railPosition;\n return clamp((distance / railWidth) * 100, 0, 100);\n },\n [dir],\n );\n\n const onPointerMove = React.useCallback(\n (ev: React.PointerEvent<HTMLDivElement>): void => {\n const incomingPosition = calculatePosition(ev);\n\n internalState.current.thumbIsDragging = true;\n hideThumbAnimation();\n setRenderedPosition(incomingPosition);\n\n // If the Switch reaches a new position of 0% or 100%, update the state and fire change.\n if (incomingPosition === 100 && internalState.current.internalValue !== true) {\n setChecked(ev, true);\n } else if (incomingPosition === 0 && internalState.current.internalValue !== false) {\n setChecked(ev, false);\n }\n },\n [calculatePosition, hideThumbAnimation, setChecked],\n );\n\n const onPointerUp = React.useCallback(\n (ev: React.PointerEvent<HTMLDivElement>): void => {\n internalState.current.disposables.forEach(dispose => dispose());\n internalState.current.disposables = [];\n inputRef.current!.focus();\n\n if (internalState.current.thumbIsDragging) {\n const roundedPosition = Math.round(calculatePosition(ev)! / 100) * 100;\n\n showThumbAnimation();\n if (roundedPosition === 100) {\n setChecked(ev, true);\n } else if (roundedPosition === 0) {\n setChecked(ev, false);\n }\n } else {\n setChecked(ev, !internalState.current.internalValue);\n }\n },\n [calculatePosition, inputRef, setChecked, showThumbAnimation],\n );\n\n const onPointerDown = React.useCallback(\n (ev: React.PointerEvent<HTMLDivElement>): void => {\n const { pointerId } = ev;\n const target = ev.target as HTMLElement;\n\n onPointerDownCallback?.(ev);\n showThumbAnimation();\n target.setPointerCapture?.(pointerId);\n internalState.current.thumbIsDragging = false;\n\n internalState.current.disposables.push(\n on(target, 'pointermove', onPointerMove),\n on(target, 'pointerup', onPointerUp),\n () => {\n target.releasePointerCapture?.(pointerId);\n },\n );\n },\n [onPointerDownCallback, onPointerMove, onPointerUp, showThumbAnimation],\n );\n\n const onKeyUp = React.useCallback(\n (ev: React.KeyboardEvent<HTMLDivElement>): void => {\n onKeyUpCallback?.(ev);\n if (ev.key === ' ') {\n setChecked(ev, !internalState.current.internalValue);\n }\n },\n [onKeyUpCallback, setChecked],\n );\n\n const currentPosition = renderedPosition !== undefined ? renderedPosition : currentValue ? 100 : 0;\n\n const rootStyles = {\n '--switch-checked-opacity': currentPosition / 100,\n '--switch-unchecked-opacity': (100 - currentPosition) / 100,\n } as React.CSSProperties;\n\n const thumbWrapperStyles = {\n transform: `translate(${dir === 'rtl' ? -currentPosition : currentPosition}%)`,\n transition: thumbAnimation\n ? 'transform .1s cubic-bezier(0.33, 0.0, 0.67, 1), opacity .1s cubic-bezier(0.33, 0.0, 0.67, 1)'\n : 'none',\n };\n\n // Root Props\n state.root.style = rootStyles;\n if (!disabled) {\n state.root.onPointerDown = onPointerDown;\n state.root.onKeyUp = onKeyUp;\n }\n\n // Input Props\n state.input.checked = currentValue;\n state.input.disabled = disabled;\n state.input.ref = inputRef;\n state.input.readOnly = true;\n state.input.role = 'switch';\n\n // Thumb Container Props\n state.thumbWrapper.style = thumbWrapperStyles;\n\n // Active Rail Props\n state.activeRail.ref = railRef;\n\n return state;\n};\n"],"sourceRoot":"../src/"}
@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.useSwitchStyles_unstable = exports.switchClassName = void 0;
7
7
 
8
- const react_make_styles_1 = /*#__PURE__*/require("@fluentui/react-make-styles");
8
+ const react_1 = /*#__PURE__*/require("@griffel/react");
9
9
 
10
10
  const react_tabster_1 = /*#__PURE__*/require("@fluentui/react-tabster");
11
11
 
@@ -18,7 +18,7 @@ const thumbClassName = `${exports.switchClassName}-thumb`;
18
18
  * Styles for the root slot
19
19
  */
20
20
 
21
- const useRootStyles = /*#__PURE__*/react_make_styles_1.__styles({
21
+ const useRootStyles = /*#__PURE__*/react_1.__styles({
22
22
  "root": {
23
23
  "B64q66w": "frxo1y7",
24
24
  "yvbau0": "fe5s2ct",
@@ -77,7 +77,7 @@ const useRootStyles = /*#__PURE__*/react_make_styles_1.__styles({
77
77
  */
78
78
 
79
79
 
80
- const useTrackStyles = /*#__PURE__*/react_make_styles_1.__styles({
80
+ const useTrackStyles = /*#__PURE__*/react_1.__styles({
81
81
  "track": {
82
82
  "qhf8xq": "f1euv43f",
83
83
  "a9b677": "fly5x3f",
@@ -171,7 +171,7 @@ const useTrackStyles = /*#__PURE__*/react_make_styles_1.__styles({
171
171
  */
172
172
 
173
173
 
174
- const useThumbWrapperStyles = /*#__PURE__*/react_make_styles_1.__styles({
174
+ const useThumbWrapperStyles = /*#__PURE__*/react_1.__styles({
175
175
  "thumbWrapper": {
176
176
  "qhf8xq": "f1euv43f",
177
177
  "Bhzewxz": "f15twtuk",
@@ -189,7 +189,7 @@ const useThumbWrapperStyles = /*#__PURE__*/react_make_styles_1.__styles({
189
189
  */
190
190
 
191
191
 
192
- const useThumbStyles = /*#__PURE__*/react_make_styles_1.__styles({
192
+ const useThumbStyles = /*#__PURE__*/react_1.__styles({
193
193
  "thumb": {
194
194
  "qhf8xq": "f1euv43f",
195
195
  "a9b677": "fcjrtee",
@@ -261,7 +261,7 @@ const useThumbStyles = /*#__PURE__*/react_make_styles_1.__styles({
261
261
  */
262
262
 
263
263
 
264
- const useActiveRailStyles = /*#__PURE__*/react_make_styles_1.__styles({
264
+ const useActiveRailStyles = /*#__PURE__*/react_1.__styles({
265
265
  "activeRail": {
266
266
  "qhf8xq": "f1euv43f",
267
267
  "oyh7mz": ["fhpx7ww", "f1kctpth"],
@@ -275,7 +275,7 @@ const useActiveRailStyles = /*#__PURE__*/react_make_styles_1.__styles({
275
275
  */
276
276
 
277
277
 
278
- const useInputStyle = /*#__PURE__*/react_make_styles_1.__styles({
278
+ const useInputStyle = /*#__PURE__*/react_1.__styles({
279
279
  "input": {
280
280
  "abs64n": "fk73vx1",
281
281
  "qhf8xq": "f1euv43f",
@@ -311,12 +311,12 @@ const useSwitchStyles_unstable = state => {
311
311
  const thumbStyles = useThumbStyles();
312
312
  const activeRailStyles = useActiveRailStyles();
313
313
  const inputStyles = useInputStyle();
314
- state.root.className = react_make_styles_1.mergeClasses(exports.switchClassName + (checked ? ' checked' : ''), rootStyles.root, rootStyles.focusIndicator, !disabled && rootStyles.checked, !disabled && rootStyles.unchecked, disabled ? rootStyles.disabled : rootStyles.enabled, state.root.className);
315
- state.track.className = react_make_styles_1.mergeClasses(trackClassName, trackStyles.track, !disabled && trackStyles.checked, !disabled && trackStyles.unchecked, disabled && trackStyles.disabledChecked, disabled && trackStyles.disabledUnchecked, state.track.className);
316
- state.thumbWrapper.className = react_make_styles_1.mergeClasses(thumbWrapperStyles.thumbWrapper, state.thumbWrapper.className);
317
- state.thumb.className = react_make_styles_1.mergeClasses(thumbClassName, thumbStyles.thumb, !disabled && thumbStyles.checked, !disabled && thumbStyles.unchecked, disabled && thumbStyles.disabledChecked, disabled && thumbStyles.disabledUnchecked, state.thumb.className);
318
- state.activeRail.className = react_make_styles_1.mergeClasses(activeRailStyles.activeRail, state.activeRail.className);
319
- state.input.className = react_make_styles_1.mergeClasses(inputStyles.input, state.input.className);
314
+ state.root.className = react_1.mergeClasses(exports.switchClassName + (checked ? ' checked' : ''), rootStyles.root, rootStyles.focusIndicator, !disabled && rootStyles.checked, !disabled && rootStyles.unchecked, disabled ? rootStyles.disabled : rootStyles.enabled, state.root.className);
315
+ state.track.className = react_1.mergeClasses(trackClassName, trackStyles.track, !disabled && trackStyles.checked, !disabled && trackStyles.unchecked, disabled && trackStyles.disabledChecked, disabled && trackStyles.disabledUnchecked, state.track.className);
316
+ state.thumbWrapper.className = react_1.mergeClasses(thumbWrapperStyles.thumbWrapper, state.thumbWrapper.className);
317
+ state.thumb.className = react_1.mergeClasses(thumbClassName, thumbStyles.thumb, !disabled && thumbStyles.checked, !disabled && thumbStyles.unchecked, disabled && thumbStyles.disabledChecked, disabled && thumbStyles.disabledUnchecked, state.thumb.className);
318
+ state.activeRail.className = react_1.mergeClasses(activeRailStyles.activeRail, state.activeRail.className);
319
+ state.input.className = react_1.mergeClasses(inputStyles.input, state.input.className);
320
320
  return state;
321
321
  };
322
322
 
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Switch/useSwitchStyles.ts"],"names":[],"mappings":"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","sourceRoot":""}
1
+ {"version":3,"sources":["components/Switch/useSwitchStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { shorthands, makeStyles, mergeClasses } from '@griffel/react';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SwitchState } from './Switch.types';\n\nexport const switchClassName = 'fui-Switch';\nconst trackClassName = `${switchClassName}-track`;\nconst thumbClassName = `${switchClassName}-thumb`;\n\n/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n root: {\n '--switch-width': '40px',\n '--switch-height': '20px',\n '--switch-thumb-size': '14px',\n '--switch-checked-opacity': '0',\n '--switch-unchecked-opacity': '0',\n\n position: 'relative',\n width: 'var(--switch-width)',\n height: 'var(--switch-height)',\n display: 'inline-block',\n userSelect: 'none',\n touchAction: 'none',\n verticalAlign: 'bottom',\n },\n\n unchecked: {\n [`:hover .${thumbClassName}`]: {\n ':before': {\n backgroundColor: tokens.colorNeutralStrokeAccessibleHover,\n },\n },\n\n [`:hover .${trackClassName}`]: {\n ':before': {\n borderColor: tokens.colorNeutralStrokeAccessibleHover,\n },\n },\n },\n\n checked: {\n [`:hover .${trackClassName}`]: {\n ':after': {\n backgroundColor: tokens.colorBrandBackgroundHover,\n },\n },\n\n [`:active .${trackClassName}`]: {\n ':after': {\n backgroundColor: tokens.colorBrandBackgroundPressed,\n },\n },\n },\n\n enabled: {\n '-webkit-tap-highlight-color': 'rgba(0,0,0,0)',\n cursor: 'pointer',\n },\n\n disabled: {\n cursor: 'not-allowed',\n pointerEvents: 'none',\n },\n\n focusIndicator: createFocusOutlineStyle({ selector: 'focus-within', style: { outlineOffset: '8px' } }),\n});\n\n/**\n * Styles for the track slot\n */\nconst useTrackStyles = makeStyles({\n track: {\n position: 'absolute',\n width: '100%',\n height: '100%',\n transitionProperty: 'backgroundColor',\n transitionDuration: '0.1s',\n transitionTimingFunction: 'cubic-bezier(0.33, 0, 0.67, 1)',\n touchAction: 'none',\n pointerEvents: 'none',\n\n ':before': {\n position: 'absolute',\n top: '0px',\n left: '0px',\n bottom: '0px',\n right: '0px',\n boxSizing: 'border-box',\n ...shorthands.borderRadius('999px'),\n content: \"''\",\n opacity: 'var(--switch-unchecked-opacity)',\n },\n\n ':after': {\n position: 'absolute',\n top: '0px',\n left: '0px',\n bottom: '0px',\n right: '0px',\n boxSizing: 'border-box',\n ...shorthands.borderRadius('999px'),\n content: \"''\",\n opacity: 'var(--switch-checked-opacity)',\n },\n },\n\n unchecked: {\n ':before': {\n ...shorthands.border('1px', 'solid', tokens.colorNeutralStrokeAccessible),\n backgroundColor: 'transparent',\n },\n },\n\n checked: {\n ':after': {\n backgroundColor: tokens.colorBrandBackground,\n ...shorthands.borderStyle('none'),\n },\n },\n\n disabledUnchecked: {\n ':before': {\n ...shorthands.border('1px', 'solid', tokens.colorNeutralStrokeDisabled),\n },\n },\n\n disabledChecked: {\n ':after': {\n ...shorthands.border('1px', 'solid', tokens.colorTransparentStrokeDisabled),\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n },\n },\n});\n\n/**\n * Styles for the thumb wrapper slot\n */\nconst useThumbWrapperStyles = makeStyles({\n thumbWrapper: {\n position: 'absolute',\n top: '0',\n bottom: '0',\n left: 'calc(var(--switch-thumb-size) * .7)',\n right: 'calc(var(--switch-thumb-size) * .7)',\n touchAction: 'none',\n pointerEvents: 'none',\n },\n});\n\n/**\n * Styles for the thumb slot\n */\nconst useThumbStyles = makeStyles({\n thumb: {\n position: 'absolute',\n width: 'var(--switch-thumb-size)',\n height: 'var(--switch-thumb-size)',\n boxSizing: 'border-box',\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n top: '50%',\n transform: 'translate(-50%, -50%)',\n transitionProperty: 'backgroundColor',\n transitionDuration: '0.1s',\n transitionTimingFunction: 'cubic-bezier(0.33, 0, 0.67, 1)',\n touchAction: 'none',\n pointerEvents: 'none',\n\n ':before': {\n position: 'absolute',\n top: '0px',\n left: '0px',\n bottom: '0px',\n right: '0px',\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n content: \"''\",\n opacity: 'var(--switch-unchecked-opacity)',\n },\n\n ':after': {\n position: 'absolute',\n top: '0px',\n left: '0px',\n bottom: '0px',\n right: '0px',\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n content: \"''\",\n opacity: 'var(--switch-checked-opacity)',\n },\n },\n\n unchecked: {\n ':before': {\n backgroundColor: tokens.colorNeutralStrokeAccessible,\n },\n },\n\n checked: {\n ':after': {\n backgroundColor: tokens.colorNeutralForegroundOnBrand,\n },\n },\n\n disabledUnchecked: {\n ':before': {\n ...shorthands.border('1px', 'solid', tokens.colorNeutralForegroundDisabled),\n backgroundColor: tokens.colorNeutralBackground1,\n },\n },\n\n disabledChecked: {\n ':after': {\n backgroundColor: tokens.colorNeutralForegroundDisabled,\n },\n },\n});\n\n/**\n * Styles for the activeRail slot\n */\nconst useActiveRailStyles = makeStyles({\n activeRail: {\n position: 'absolute',\n left: 'calc(var(--switch-thumb-size) * .7)',\n right: 'calc(var(--switch-thumb-size) * .7)',\n },\n});\n\n/**\n * Styles for the hidden input slot\n */\nconst useInputStyle = makeStyles({\n input: {\n opacity: 0,\n position: 'absolute',\n ...shorthands.padding(0),\n ...shorthands.margin(0),\n width: '100%',\n height: '100%',\n touchAction: 'none',\n pointerEvents: 'none',\n },\n});\n\n/**\n * Apply styling to the Switch slots based on the state\n */\nexport const useSwitchStyles_unstable = (state: SwitchState): SwitchState => {\n const { checked, disabled } = state.input;\n\n const rootStyles = useRootStyles();\n const trackStyles = useTrackStyles();\n const thumbWrapperStyles = useThumbWrapperStyles();\n const thumbStyles = useThumbStyles();\n const activeRailStyles = useActiveRailStyles();\n const inputStyles = useInputStyle();\n\n state.root.className = mergeClasses(\n switchClassName + (checked ? ' checked' : ''),\n rootStyles.root,\n rootStyles.focusIndicator,\n !disabled && rootStyles.checked,\n !disabled && rootStyles.unchecked,\n disabled ? rootStyles.disabled : rootStyles.enabled,\n state.root.className,\n );\n\n state.track.className = mergeClasses(\n trackClassName,\n trackStyles.track,\n !disabled && trackStyles.checked,\n !disabled && trackStyles.unchecked,\n disabled && trackStyles.disabledChecked,\n disabled && trackStyles.disabledUnchecked,\n state.track.className,\n );\n\n state.thumbWrapper.className = mergeClasses(thumbWrapperStyles.thumbWrapper, state.thumbWrapper.className);\n\n state.thumb.className = mergeClasses(\n thumbClassName,\n thumbStyles.thumb,\n !disabled && thumbStyles.checked,\n !disabled && thumbStyles.unchecked,\n disabled && thumbStyles.disabledChecked,\n disabled && thumbStyles.disabledUnchecked,\n state.thumb.className,\n );\n\n state.activeRail.className = mergeClasses(activeRailStyles.activeRail, state.activeRail.className);\n\n state.input.className = mergeClasses(inputStyles.input, state.input.className);\n\n return state;\n};\n"],"sourceRoot":"../src/"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,UAAA,CAAA,EAAA,OAAA","sourceRoot":""}
1
+ {"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,UAAA,CAAA,EAAA,OAAA","sourcesContent":["export {};\nexport * from './Switch';\n"],"sourceRoot":"../src/"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-switch",
3
- "version": "0.0.0-nightly6a6e258c4020220125.1",
3
+ "version": "0.0.0-nightly6faffd280a20220221.1",
4
4
  "description": "Fluent UI React Switch component.",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -26,11 +26,9 @@
26
26
  "type-check": "tsc -b tsconfig.json"
27
27
  },
28
28
  "devDependencies": {
29
- "@fluentui/babel-make-styles": "0.0.0-nightly6a6e258c4020220125.1",
30
29
  "@fluentui/eslint-plugin": "*",
31
- "@fluentui/jest-serializer-make-styles": "0.0.0-nightly6a6e258c4020220125.1",
32
30
  "@fluentui/react-conformance": "*",
33
- "@fluentui/react-conformance-make-styles": "0.0.0-nightly6a6e258c4020220125.1",
31
+ "@fluentui/react-conformance-griffel": "0.0.0-nightly6faffd280a20220221.1",
34
32
  "@fluentui/scripts": "^1.0.0",
35
33
  "@types/enzyme": "3.10.3",
36
34
  "@types/enzyme-adapter-react-16": "1.0.3",
@@ -44,10 +42,10 @@
44
42
  "react-test-renderer": "^16.3.0"
45
43
  },
46
44
  "dependencies": {
47
- "@fluentui/react-make-styles": "0.0.0-nightly6a6e258c4020220125.1",
48
- "@fluentui/react-shared-contexts": "0.0.0-nightly6a6e258c4020220125.1",
49
- "@fluentui/react-tabster": "0.0.0-nightly6a6e258c4020220125.1",
50
- "@fluentui/react-utilities": "0.0.0-nightly6a6e258c4020220125.1",
45
+ "@fluentui/react-shared-contexts": "0.0.0-nightly6faffd280a20220221.1",
46
+ "@fluentui/react-tabster": "0.0.0-nightly6faffd280a20220221.1",
47
+ "@fluentui/react-utilities": "0.0.0-nightly6faffd280a20220221.1",
48
+ "@griffel/react": "1.0.0",
51
49
  "tslib": "^2.1.0"
52
50
  },
53
51
  "peerDependencies": {