@fluentui/react-select 9.1.4 → 9.1.6
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/.swcrc +30 -0
- package/CHANGELOG.json +79 -1
- package/CHANGELOG.md +28 -2
- package/lib/Select.js.map +1 -1
- package/lib/SelectField.js.map +1 -1
- package/lib/components/Select/Select.js.map +1 -1
- package/lib/components/Select/Select.types.js +1 -1
- package/lib/components/Select/Select.types.js.map +1 -1
- package/lib/components/Select/index.js.map +1 -1
- package/lib/components/Select/renderSelect.js +1 -7
- package/lib/components/Select/renderSelect.js.map +1 -1
- package/lib/components/Select/useSelect.js +2 -2
- package/lib/components/Select/useSelect.js.map +1 -1
- package/lib/components/Select/useSelectStyles.js.map +1 -1
- package/lib/components/SelectField/SelectField.js +1 -2
- package/lib/components/SelectField/SelectField.js.map +1 -1
- package/lib/components/SelectField/index.js.map +1 -1
- package/lib/index.js.map +1 -1
- package/lib-commonjs/Select.js +5 -4
- package/lib-commonjs/Select.js.map +1 -1
- package/lib-commonjs/SelectField.js +5 -4
- package/lib-commonjs/SelectField.js.map +1 -1
- package/lib-commonjs/components/Select/Select.js +19 -20
- package/lib-commonjs/components/Select/Select.js.map +1 -1
- package/lib-commonjs/components/Select/Select.types.js +5 -2
- package/lib-commonjs/components/Select/Select.types.js.map +1 -1
- package/lib-commonjs/components/Select/index.js +9 -8
- package/lib-commonjs/components/Select/index.js.map +1 -1
- package/lib-commonjs/components/Select/renderSelect.js +13 -22
- package/lib-commonjs/components/Select/renderSelect.js.map +1 -1
- package/lib-commonjs/components/Select/useSelect.js +60 -69
- package/lib-commonjs/components/Select/useSelect.js.map +1 -1
- package/lib-commonjs/components/Select/useSelectStyles.js +589 -272
- package/lib-commonjs/components/Select/useSelectStyles.js.map +1 -1
- package/lib-commonjs/components/SelectField/SelectField.js +17 -11
- package/lib-commonjs/components/SelectField/SelectField.js.map +1 -1
- package/lib-commonjs/components/SelectField/index.js +5 -4
- package/lib-commonjs/components/SelectField/index.js.map +1 -1
- package/lib-commonjs/index.js +21 -49
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +10 -9
- package/lib-amd/Select.js +0 -6
- package/lib-amd/Select.js.map +0 -1
- package/lib-amd/SelectField.js +0 -6
- package/lib-amd/SelectField.js.map +0 -1
- package/lib-amd/components/Select/Select.js +0 -17
- package/lib-amd/components/Select/Select.js.map +0 -1
- package/lib-amd/components/Select/Select.types.js +0 -5
- package/lib-amd/components/Select/Select.types.js.map +0 -1
- package/lib-amd/components/Select/index.js +0 -10
- package/lib-amd/components/Select/index.js.map +0 -1
- package/lib-amd/components/Select/renderSelect.js +0 -16
- package/lib-amd/components/Select/renderSelect.js.map +0 -1
- package/lib-amd/components/Select/useSelect.js +0 -51
- package/lib-amd/components/Select/useSelect.js.map +0 -1
- package/lib-amd/components/Select/useSelectStyles.js +0 -154
- package/lib-amd/components/Select/useSelectStyles.js.map +0 -1
- package/lib-amd/components/SelectField/SelectField.js +0 -10
- package/lib-amd/components/SelectField/SelectField.js.map +0 -1
- package/lib-amd/components/SelectField/index.js +0 -6
- package/lib-amd/components/SelectField/index.js.map +0 -1
- package/lib-amd/index.js +0 -13
- package/lib-amd/index.js.map +0 -1
package/.swcrc
ADDED
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
{
|
|
2
|
+
"$schema": "https://json.schemastore.org/swcrc",
|
|
3
|
+
"exclude": [
|
|
4
|
+
"/testing",
|
|
5
|
+
"/**/*.cy.ts",
|
|
6
|
+
"/**/*.cy.tsx",
|
|
7
|
+
"/**/*.spec.ts",
|
|
8
|
+
"/**/*.spec.tsx",
|
|
9
|
+
"/**/*.test.ts",
|
|
10
|
+
"/**/*.test.tsx"
|
|
11
|
+
],
|
|
12
|
+
"jsc": {
|
|
13
|
+
"parser": {
|
|
14
|
+
"syntax": "typescript",
|
|
15
|
+
"tsx": true,
|
|
16
|
+
"decorators": false,
|
|
17
|
+
"dynamicImport": false
|
|
18
|
+
},
|
|
19
|
+
"externalHelpers": true,
|
|
20
|
+
"transform": {
|
|
21
|
+
"react": {
|
|
22
|
+
"runtime": "classic",
|
|
23
|
+
"useSpread": true
|
|
24
|
+
}
|
|
25
|
+
},
|
|
26
|
+
"target": "es2019"
|
|
27
|
+
},
|
|
28
|
+
"minify": false,
|
|
29
|
+
"sourceMaps": true
|
|
30
|
+
}
|
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,85 @@
|
|
|
2
2
|
"name": "@fluentui/react-select",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "Thu,
|
|
5
|
+
"date": "Thu, 23 Mar 2023 12:28:45 GMT",
|
|
6
|
+
"tag": "@fluentui/react-select_v9.1.6",
|
|
7
|
+
"version": "9.1.6",
|
|
8
|
+
"comments": {
|
|
9
|
+
"patch": [
|
|
10
|
+
{
|
|
11
|
+
"author": "beachball",
|
|
12
|
+
"package": "@fluentui/react-select",
|
|
13
|
+
"comment": "Bump @fluentui/react-field to v9.0.0-alpha.28",
|
|
14
|
+
"commit": "be0ca69899300abe3c8478c435e0f6837138479b"
|
|
15
|
+
},
|
|
16
|
+
{
|
|
17
|
+
"author": "beachball",
|
|
18
|
+
"package": "@fluentui/react-select",
|
|
19
|
+
"comment": "Bump @fluentui/react-shared-contexts to v9.3.3",
|
|
20
|
+
"commit": "be0ca69899300abe3c8478c435e0f6837138479b"
|
|
21
|
+
}
|
|
22
|
+
]
|
|
23
|
+
}
|
|
24
|
+
},
|
|
25
|
+
{
|
|
26
|
+
"date": "Tue, 21 Mar 2023 21:23:49 GMT",
|
|
27
|
+
"tag": "@fluentui/react-select_v9.1.5",
|
|
28
|
+
"version": "9.1.5",
|
|
29
|
+
"comments": {
|
|
30
|
+
"patch": [
|
|
31
|
+
{
|
|
32
|
+
"author": "tristan.watanabe@gmail.com",
|
|
33
|
+
"package": "@fluentui/react-select",
|
|
34
|
+
"commit": "ead1c6d4c2ac3f3596b62b8cbc07b0a03041f11f",
|
|
35
|
+
"comment": "fix: add node field to package.json exports map."
|
|
36
|
+
},
|
|
37
|
+
{
|
|
38
|
+
"author": "tristan.watanabe@gmail.com",
|
|
39
|
+
"package": "@fluentui/react-select",
|
|
40
|
+
"commit": "2fac1a139149bd13b76b1306207bc988dca9c72c",
|
|
41
|
+
"comment": "chore: migrate to swc transpilation approach."
|
|
42
|
+
},
|
|
43
|
+
{
|
|
44
|
+
"author": "makotom@microsoft.com",
|
|
45
|
+
"package": "@fluentui/react-select",
|
|
46
|
+
"commit": "7fde5c94869ff9841b142b7ff1d0a3df0ab58f74",
|
|
47
|
+
"comment": "chore: Bumping version of @fluentui/react-icons to ^2.0.196."
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
"author": "beachball",
|
|
51
|
+
"package": "@fluentui/react-select",
|
|
52
|
+
"comment": "Bump @fluentui/react-field to v9.0.0-alpha.27",
|
|
53
|
+
"commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
|
|
54
|
+
},
|
|
55
|
+
{
|
|
56
|
+
"author": "beachball",
|
|
57
|
+
"package": "@fluentui/react-select",
|
|
58
|
+
"comment": "Bump @fluentui/react-shared-contexts to v9.3.2",
|
|
59
|
+
"commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
|
|
60
|
+
},
|
|
61
|
+
{
|
|
62
|
+
"author": "beachball",
|
|
63
|
+
"package": "@fluentui/react-select",
|
|
64
|
+
"comment": "Bump @fluentui/react-theme to v9.1.7",
|
|
65
|
+
"commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
|
|
66
|
+
},
|
|
67
|
+
{
|
|
68
|
+
"author": "beachball",
|
|
69
|
+
"package": "@fluentui/react-select",
|
|
70
|
+
"comment": "Bump @fluentui/react-utilities to v9.7.2",
|
|
71
|
+
"commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
|
|
72
|
+
},
|
|
73
|
+
{
|
|
74
|
+
"author": "beachball",
|
|
75
|
+
"package": "@fluentui/react-select",
|
|
76
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.20",
|
|
77
|
+
"commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
|
|
78
|
+
}
|
|
79
|
+
]
|
|
80
|
+
}
|
|
81
|
+
},
|
|
82
|
+
{
|
|
83
|
+
"date": "Thu, 16 Mar 2023 14:36:59 GMT",
|
|
6
84
|
"tag": "@fluentui/react-select_v9.1.4",
|
|
7
85
|
"version": "9.1.4",
|
|
8
86
|
"comments": {
|
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,38 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-select
|
|
2
2
|
|
|
3
|
-
This log was last generated on Thu,
|
|
3
|
+
This log was last generated on Thu, 23 Mar 2023 12:28:45 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [9.1.6](https://github.com/microsoft/fluentui/tree/@fluentui/react-select_v9.1.6)
|
|
8
|
+
|
|
9
|
+
Thu, 23 Mar 2023 12:28:45 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-select_v9.1.5..@fluentui/react-select_v9.1.6)
|
|
11
|
+
|
|
12
|
+
### Patches
|
|
13
|
+
|
|
14
|
+
- Bump @fluentui/react-field to v9.0.0-alpha.28 ([PR #27286](https://github.com/microsoft/fluentui/pull/27286) by beachball)
|
|
15
|
+
- Bump @fluentui/react-shared-contexts to v9.3.3 ([PR #27286](https://github.com/microsoft/fluentui/pull/27286) by beachball)
|
|
16
|
+
|
|
17
|
+
## [9.1.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-select_v9.1.5)
|
|
18
|
+
|
|
19
|
+
Tue, 21 Mar 2023 21:23:49 GMT
|
|
20
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-select_v9.1.4..@fluentui/react-select_v9.1.5)
|
|
21
|
+
|
|
22
|
+
### Patches
|
|
23
|
+
|
|
24
|
+
- fix: add node field to package.json exports map. ([PR #27154](https://github.com/microsoft/fluentui/pull/27154) by tristan.watanabe@gmail.com)
|
|
25
|
+
- chore: migrate to swc transpilation approach. ([PR #27250](https://github.com/microsoft/fluentui/pull/27250) by tristan.watanabe@gmail.com)
|
|
26
|
+
- chore: Bumping version of @fluentui/react-icons to ^2.0.196. ([PR #27100](https://github.com/microsoft/fluentui/pull/27100) by makotom@microsoft.com)
|
|
27
|
+
- Bump @fluentui/react-field to v9.0.0-alpha.27 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
|
|
28
|
+
- Bump @fluentui/react-shared-contexts to v9.3.2 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
|
|
29
|
+
- Bump @fluentui/react-theme to v9.1.7 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
|
|
30
|
+
- Bump @fluentui/react-utilities to v9.7.2 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
|
|
31
|
+
- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.20 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
|
|
32
|
+
|
|
7
33
|
## [9.1.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-select_v9.1.4)
|
|
8
34
|
|
|
9
|
-
Thu, 16 Mar 2023 14:
|
|
35
|
+
Thu, 16 Mar 2023 14:36:59 GMT
|
|
10
36
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-select_v9.1.3..@fluentui/react-select_v9.1.4)
|
|
11
37
|
|
|
12
38
|
### Patches
|
package/lib/Select.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":[],"sources":["../src/Select.ts"],"sourcesContent":["export * from './components/Select/index';\n"],"mappings":"AAAA,cAAc"}
|
package/lib/SelectField.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":[],"sources":["../src/SelectField.ts"],"sourcesContent":["export * from './components/SelectField/index';\n"],"mappings":"AAAA,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useSelect_unstable","renderSelect_unstable","useSelectStyles_unstable","useCustomStyleHooks_unstable","Select","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["
|
|
1
|
+
{"version":3,"names":["React","useSelect_unstable","renderSelect_unstable","useSelectStyles_unstable","useCustomStyleHooks_unstable","Select","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSelect_unstable } from './useSelect';\nimport { renderSelect_unstable } from './renderSelect';\nimport { useSelectStyles_unstable } from './useSelectStyles';\nimport type { SelectProps } from './Select.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Select component\n */\nexport const Select: ForwardRefComponent<SelectProps> = React.forwardRef((props, ref) => {\n const state = useSelect_unstable(props, ref);\n\n useSelectStyles_unstable(state);\n\n const { useSelectStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderSelect_unstable(state);\n});\n\nSelect.displayName = 'Select';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,kBAAkB,QAAQ;AACnC,SAASC,qBAAqB,QAAQ;AACtC,SAASC,wBAAwB,QAAQ;AAGzC,SAASC,4BAA4B,QAAQ;AAE7C;;;AAGA,OAAO,MAAMC,MAAA,gBAA2CL,KAAA,CAAMM,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACvF,MAAMC,KAAA,GAAQR,kBAAA,CAAmBM,KAAA,EAAOC,GAAA;EAExCL,wBAAA,CAAyBM,KAAA;EAEzB,MAAM;IAAEN,wBAAA,EAA0BO;EAAe,CAAE,GAAGN,4BAAA;EACtDM,eAAA,CAAgBD,KAAA;EAEhB,OAAOP,qBAAA,CAAsBO,KAAA;AAC/B;AAEAJ,MAAA,CAAOM,WAAW,GAAG"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
|
|
1
|
+
import * as React from 'react';
|
|
2
2
|
//# sourceMappingURL=Select.types.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":["React"],"sources":["../../../src/components/Select/Select.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type SelectSlots = {\n /*\n * Wrapper for both the select and icon, renders as a `<span>`.\n * The `className` and `style` props on `<Select>` are applied to this slot;\n * All other top-level props are applied to the primary slot, `select`.\n */\n root: NonNullable<Slot<'span'>>;\n\n /** Primary slot: the actual `<select>` element */\n select: NonNullable<Slot<'select'>>;\n\n /** the icon, typically a down arrow */\n icon: Slot<'span'>;\n};\n\nexport type SelectProps = Omit<ComponentProps<Partial<SelectSlots>, 'select'>, 'size' | 'onChange'> & {\n /**\n * Controls the colors and borders of the Select.\n *\n * @default 'outline'\n */\n appearance?: 'outline' | 'underline' | 'filled-darker' | 'filled-lighter';\n\n /**\n * Called when the user changes the select element's value by selecting an option.\n */\n onChange?: (ev: React.ChangeEvent<HTMLSelectElement>, data: SelectOnChangeData) => void;\n\n /**\n * Matches the Input sizes\n *\n * @default 'medium'\n */\n size?: 'small' | 'medium' | 'large';\n};\n\nexport type SelectState = ComponentState<SelectSlots> & Required<Pick<SelectProps, 'appearance' | 'size'>>;\n\n/**\n * Data passed to the `onChange` callback when a new option is selected.\n */\nexport type SelectOnChangeData = {\n /**\n * Updated `<select>` value, taken from either the selected option's value prop or inner text.\n */\n value: string;\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":[],"sources":["../../../src/components/Select/index.ts"],"sourcesContent":["export * from './Select';\nexport * from './Select.types';\nexport * from './renderSelect';\nexport * from './useSelect';\nexport * from './useSelectStyles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}
|
|
@@ -8,12 +8,6 @@ export const renderSelect_unstable = state => {
|
|
|
8
8
|
slots,
|
|
9
9
|
slotProps
|
|
10
10
|
} = getSlots(state);
|
|
11
|
-
return /*#__PURE__*/React.createElement(slots.root,
|
|
12
|
-
...slotProps.root
|
|
13
|
-
}, /*#__PURE__*/React.createElement(slots.select, {
|
|
14
|
-
...slotProps.select
|
|
15
|
-
}, slotProps.select.children), /*#__PURE__*/React.createElement(slots.icon, {
|
|
16
|
-
...slotProps.icon
|
|
17
|
-
}));
|
|
11
|
+
return /*#__PURE__*/React.createElement(slots.root, slotProps.root, /*#__PURE__*/React.createElement(slots.select, slotProps.select, slotProps.select.children), /*#__PURE__*/React.createElement(slots.icon, slotProps.icon));
|
|
18
12
|
};
|
|
19
13
|
//# sourceMappingURL=renderSelect.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","getSlots","renderSelect_unstable","state","slots","slotProps","createElement","root","select","children","icon"],"sources":["
|
|
1
|
+
{"version":3,"names":["React","getSlots","renderSelect_unstable","state","slots","slotProps","createElement","root","select","children","icon"],"sources":["../../../src/components/Select/renderSelect.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { SelectSlots, SelectState } from './Select.types';\n\n/**\n * Render the final JSX of Select\n */\nexport const renderSelect_unstable = (state: SelectState) => {\n const { slots, slotProps } = getSlots<SelectSlots>(state);\n return (\n <slots.root {...slotProps.root}>\n <slots.select {...slotProps.select}>{slotProps.select.children}</slots.select>\n <slots.icon {...slotProps.icon} />\n </slots.root>\n );\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,QAAQ,QAAQ;AAGzB;;;AAGA,OAAO,MAAMC,qBAAA,GAAyBC,KAAA,IAAuB;EAC3D,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGJ,QAAA,CAAsBE,KAAA;EACnD,oBACEH,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMG,IAAI,EAAKF,SAAA,CAAUE,IAAI,eAC5BP,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMI,MAAM,EAAKH,SAAA,CAAUG,MAAM,EAAGH,SAAA,CAAUG,MAAM,CAACC,QAAQ,gBAC9DT,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMM,IAAI,EAAKL,SAAA,CAAUK,IAAI;AAGpC"}
|
|
@@ -12,15 +12,15 @@ import { useOverrides_unstable as useOverrides } from '@fluentui/react-shared-co
|
|
|
12
12
|
* @param ref - reference to the `<select>` element in Select
|
|
13
13
|
*/
|
|
14
14
|
export const useSelect_unstable = (props, ref) => {
|
|
15
|
-
var _a;
|
|
16
15
|
const overrides = useOverrides();
|
|
16
|
+
var _overrides_inputDefaultAppearance;
|
|
17
17
|
const {
|
|
18
18
|
defaultValue,
|
|
19
19
|
value,
|
|
20
20
|
select,
|
|
21
21
|
icon,
|
|
22
22
|
root,
|
|
23
|
-
appearance = (
|
|
23
|
+
appearance = (_overrides_inputDefaultAppearance = overrides.inputDefaultAppearance) !== null && _overrides_inputDefaultAppearance !== void 0 ? _overrides_inputDefaultAppearance : 'outline',
|
|
24
24
|
onChange,
|
|
25
25
|
size = 'medium'
|
|
26
26
|
} = props;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","getPartitionedNativeProps","resolveShorthand","useEventCallback","ChevronDownRegular","useOverrides_unstable","useOverrides","useSelect_unstable","props","ref","overrides","defaultValue","value","select","icon","root","appearance","
|
|
1
|
+
{"version":3,"names":["React","getPartitionedNativeProps","resolveShorthand","useEventCallback","ChevronDownRegular","useOverrides_unstable","useOverrides","useSelect_unstable","props","ref","overrides","_overrides_inputDefaultAppearance","defaultValue","value","select","icon","root","appearance","inputDefaultAppearance","onChange","size","nativeProps","primarySlotTagName","excludedPropNames","state","components","required","defaultProps","primary","children","createElement","event","target"],"sources":["../../../src/components/Select/useSelect.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getPartitionedNativeProps, resolveShorthand, useEventCallback } from '@fluentui/react-utilities';\nimport { ChevronDownRegular } from '@fluentui/react-icons';\nimport type { SelectProps, SelectState } from './Select.types';\nimport { useOverrides_unstable as useOverrides } from '@fluentui/react-shared-contexts';\n\n/**\n * Create the state required to render Select.\n *\n * The returned state can be modified with hooks such as useSelectStyles,\n * before being passed to renderSelect.\n *\n * @param props - props from this instance of Select\n * @param ref - reference to the `<select>` element in Select\n */\nexport const useSelect_unstable = (props: SelectProps, ref: React.Ref<HTMLSelectElement>): SelectState => {\n const overrides = useOverrides();\n\n const {\n defaultValue,\n value,\n select,\n icon,\n root,\n appearance = overrides.inputDefaultAppearance ?? 'outline',\n\n onChange,\n size = 'medium',\n } = props;\n\n const nativeProps = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'select',\n excludedPropNames: ['appearance', 'defaultValue', 'onChange', 'size', 'value'],\n });\n\n const state: SelectState = {\n size,\n appearance,\n components: {\n root: 'span',\n select: 'select',\n icon: 'span',\n },\n select: resolveShorthand(select, {\n required: true,\n defaultProps: {\n defaultValue,\n value,\n ref,\n ...nativeProps.primary,\n },\n }),\n icon: resolveShorthand(icon, {\n required: true,\n defaultProps: { children: <ChevronDownRegular /> },\n }),\n root: resolveShorthand(root, {\n required: true,\n defaultProps: nativeProps.root,\n }),\n };\n\n state.select.onChange = useEventCallback(event => {\n onChange?.(event, { value: (event.target as HTMLSelectElement).value });\n });\n\n return state;\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,yBAAyB,EAAEC,gBAAgB,EAAEC,gBAAgB,QAAQ;AAC9E,SAASC,kBAAkB,QAAQ;AAEnC,SAASC,qBAAA,IAAyBC,YAAY,QAAQ;AAEtD;;;;;;;;;AASA,OAAO,MAAMC,kBAAA,GAAqBA,CAACC,KAAA,EAAoBC,GAAA,KAAmD;EACxG,MAAMC,SAAA,GAAYJ,YAAA;MAQHK,iCAAA;EANf,MAAM;IACJC,YAAA;IACAC,KAAA;IACAC,MAAA;IACAC,IAAA;IACAC,IAAA;IACAC,UAAA,GAAa,CAAAN,iCAAA,GAAAD,SAAA,CAAUQ,sBAAsB,cAAhCP,iCAAA,cAAAA,iCAAA,GAAoC,SAAS;IAE1DQ,QAAA;IACAC,IAAA,GAAO;EAAQ,CAChB,GAAGZ,KAAA;EAEJ,MAAMa,WAAA,GAAcpB,yBAAA,CAA0B;IAC5CO,KAAA;IACAc,kBAAA,EAAoB;IACpBC,iBAAA,EAAmB,CAAC,cAAc,gBAAgB,YAAY,QAAQ;EACxE;EAEA,MAAMC,KAAA,GAAqB;IACzBJ,IAAA;IACAH,UAAA;IACAQ,UAAA,EAAY;MACVT,IAAA,EAAM;MACNF,MAAA,EAAQ;MACRC,IAAA,EAAM;IACR;IACAD,MAAA,EAAQZ,gBAAA,CAAiBY,MAAA,EAAQ;MAC/BY,QAAA,EAAU,IAAI;MACdC,YAAA,EAAc;QACZf,YAAA;QACAC,KAAA;QACAJ,GAAA;QACA,GAAGY,WAAA,CAAYO;MACjB;IACF;IACAb,IAAA,EAAMb,gBAAA,CAAiBa,IAAA,EAAM;MAC3BW,QAAA,EAAU,IAAI;MACdC,YAAA,EAAc;QAAEE,QAAA,eAAU7B,KAAA,CAAA8B,aAAA,CAAC1B,kBAAA;MAAsB;IACnD;IACAY,IAAA,EAAMd,gBAAA,CAAiBc,IAAA,EAAM;MAC3BU,QAAA,EAAU,IAAI;MACdC,YAAA,EAAcN,WAAA,CAAYL;IAC5B;EACF;EAEAQ,KAAA,CAAMV,MAAM,CAACK,QAAQ,GAAGhB,gBAAA,CAAiB4B,KAAA,IAAS;IAChDZ,QAAA,aAAAA,QAAA,uBAAAA,QAAA,CAAWY,KAAA,EAAO;MAAElB,KAAA,EAAOkB,KAAC,CAAMC,MAAM,CAAuBnB;IAAM;EACvE;EAEA,OAAOW,KAAA;AACT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","selectClassNames","root","select","icon","iconSizes","small","medium","large","fieldHeights","paddingRight","spacingHorizontalSNudge","spacingHorizontalXXS","spacingHorizontalMNudge","spacingHorizontalM","paddingLeft","useRootStyles","base","Bt984gj","B7ck84d","mc9l5x","Eh141a","Bahqtrf","qhf8xq","h62rwi","B3778ie","d9w3h3","Bl18szs","B4j8arr","li1rpt","Bsft5z2","Dlnsje","E3zdtr","By385i5","Eqx8gd","B1piin3","b1kco5","Ba2ppi3","F2fol1","lck23g","df92cz","I188md","umuwi5","Blcqepd","nplu4u","Bioka5o","H713fs","B9ooomg","d","m","w","useSelectStyles","Bowrso0","B4j52fo","Bekrc4i","Bn0qgzm","ibv6hh","icvyot","vrafjx","oivjwe","wvpqe5","g2u3we","h3c5rm","B9xav0g","zhjwy3","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","E5pizo","sj55zd","Bceei9c","Bh6795r","B2u0y6b","Byoj8tv","z8tnut","B3aqqti","Brovlpu","Bxa1mx5","disabled","De3pzq","Bjwas2f","Bn1d65q","Bxeuatn","n51gp8","disabledUnderline","Bqenvij","uwmqm3","z189sj","Be2twd7","Bhrd7zp","Bg96gwp","outline","outlineInteractive","Bgoe8wy","Bwzppfd","oetu4i","gg5e9n","B6oc9vd","ak43y8","wmxk5l","B50zh58","underline","invalid","tvckwq","gk2u95","hhx65j","Bxowmz0","invalidUnderline","f","h","a","useIconStyles","Bkecrkj","Bo70h7d","Bbusuzp","j35jbq","a9b677","useSelectStyles_unstable","state","size","appearance","iconStyles","rootStyles","selectStyles","className"],"sources":["../src/packages/react-components/react-select/src/components/Select/useSelectStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { SlotClassNames } from '@fluentui/react-utilities';\nimport type { SelectSlots, SelectState } from './Select.types';\n\nexport const selectClassNames: SlotClassNames<SelectSlots> = {\n root: 'fui-Select',\n select: 'fui-Select__select',\n icon: 'fui-Select__icon',\n};\n\nconst iconSizes = {\n small: '16px',\n medium: '20px',\n large: '24px',\n};\n\n//TODO: Should fieldHeights be a set of global design tokens or constants?\nconst fieldHeights = {\n small: '24px',\n medium: '32px',\n large: '40px',\n};\n\n/* Since the <select> element must span the full width and cannot have children,\n * the right padding needs to be calculated from the sum of the following:\n * 1. Field padding-right\n * 2. Icon width\n * 3. Content-icon spacing\n * 4. Content inner padding\n */\nconst paddingRight = {\n small: `calc(${tokens.spacingHorizontalSNudge}\n + ${iconSizes.small}\n + ${tokens.spacingHorizontalXXS}\n + ${tokens.spacingHorizontalXXS})`,\n medium: `calc(${tokens.spacingHorizontalMNudge}\n + ${iconSizes.medium}\n + ${tokens.spacingHorizontalXXS}\n + ${tokens.spacingHorizontalXXS})`,\n large: `calc(${tokens.spacingHorizontalM}\n + ${iconSizes.large}\n + ${tokens.spacingHorizontalSNudge}\n + ${tokens.spacingHorizontalSNudge})`,\n};\n\n/* Left padding is calculated from the outer padding + inner content padding values\n * since <select> can't have additional child content or custom inner layout */\nconst paddingLeft = {\n small: `calc(${tokens.spacingHorizontalSNudge} + ${tokens.spacingHorizontalXXS})`,\n medium: `calc(${tokens.spacingHorizontalMNudge} + ${tokens.spacingHorizontalXXS})`,\n large: `calc(${tokens.spacingHorizontalM} + ${tokens.spacingHorizontalSNudge})`,\n};\n\n/* end of shared values */\n\nconst useRootStyles = makeStyles({\n base: {\n alignItems: 'center',\n boxSizing: 'border-box',\n display: 'flex',\n flexWrap: 'nowrap',\n fontFamily: tokens.fontFamilyBase,\n position: 'relative',\n\n '&::after': {\n backgroundImage: `linear-gradient(\n 0deg,\n ${tokens.colorCompoundBrandStroke} 0%,\n ${tokens.colorCompoundBrandStroke} 50%,\n transparent 50%,\n transparent 100%\n )`,\n ...shorthands.borderRadius(0, 0, tokens.borderRadiusMedium, tokens.borderRadiusMedium),\n boxSizing: 'border-box',\n content: '\"\"',\n height: tokens.borderRadiusMedium,\n position: 'absolute',\n bottom: '0',\n left: '0',\n right: '0',\n transform: 'scaleX(0)',\n transitionProperty: 'transform',\n transitionDuration: tokens.durationUltraFast,\n transitionDelay: tokens.curveAccelerateMid,\n\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n transitionDelay: '0.01ms',\n },\n },\n\n '&:focus-within::after': {\n transform: 'scaleX(1)',\n transitionProperty: 'transform',\n transitionDuration: tokens.durationNormal,\n transitionDelay: tokens.curveDecelerateMid,\n\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n transitionDelay: '0.01ms',\n },\n },\n },\n});\n\nconst useSelectStyles = makeStyles({\n base: {\n appearance: 'none',\n ...shorthands.border('1px', 'solid', 'transparent'),\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n boxShadow: 'none',\n boxSizing: 'border-box',\n color: tokens.colorNeutralForeground1,\n cursor: 'pointer',\n flexGrow: 1,\n maxWidth: '100%',\n paddingBottom: 0,\n paddingTop: 0,\n\n ':focus': {\n outlineWidth: '2px',\n outlineStyle: 'solid',\n outlineColor: 'transparent',\n },\n },\n disabled: {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n cursor: 'not-allowed',\n '@media (forced-colors: active)': {\n ...shorthands.borderColor('GrayText'),\n },\n },\n disabledUnderline: {\n ...shorthands.borderColor(\n tokens.colorTransparentStrokeDisabled,\n tokens.colorTransparentStrokeDisabled,\n tokens.colorNeutralStrokeDisabled,\n ),\n },\n\n small: {\n height: fieldHeights.small,\n paddingLeft: paddingLeft.small,\n paddingRight: paddingRight.small,\n ...typographyStyles.caption1,\n },\n medium: {\n height: fieldHeights.medium,\n paddingLeft: paddingLeft.medium,\n paddingRight: paddingRight.medium,\n ...typographyStyles.body1,\n },\n large: {\n height: fieldHeights.large,\n paddingLeft: paddingLeft.large,\n paddingRight: paddingRight.large,\n ...typographyStyles.body2,\n },\n outline: {\n backgroundColor: tokens.colorNeutralBackground1,\n ...shorthands.border('1px', 'solid', tokens.colorNeutralStroke1),\n borderBottomColor: tokens.colorNeutralStrokeAccessible,\n },\n outlineInteractive: {\n '&:hover': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n borderBottomColor: tokens.colorNeutralStrokeAccessible,\n },\n\n '&:active': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n borderBottomColor: tokens.colorNeutralStrokeAccessible,\n },\n },\n underline: {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderBottom('1px', 'solid', tokens.colorNeutralStrokeAccessible),\n ...shorthands.borderRadius(0),\n },\n 'filled-lighter': {\n backgroundColor: tokens.colorNeutralBackground1,\n },\n 'filled-darker': {\n backgroundColor: tokens.colorNeutralBackground3,\n },\n invalid: {\n ':not(:focus-within),:hover:not(:focus-within)': {\n ...shorthands.borderColor(tokens.colorPaletteRedBorder2),\n },\n },\n invalidUnderline: {\n ':not(:focus-within),:hover:not(:focus-within)': {\n borderBottomColor: tokens.colorPaletteRedBorder2,\n },\n },\n});\n\nconst useIconStyles = makeStyles({\n icon: {\n boxSizing: 'border-box',\n color: tokens.colorNeutralStrokeAccessible,\n display: 'block',\n position: 'absolute',\n pointerEvents: 'none',\n\n // the SVG must have display: block for accurate positioning\n // otherwise an extra inline space is inserted after the svg element\n '& svg': {\n display: 'block',\n },\n },\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n '@media (forced-colors: active)': {\n color: 'GrayText',\n },\n },\n small: {\n fontSize: iconSizes.small,\n height: iconSizes.small,\n right: tokens.spacingHorizontalSNudge,\n width: iconSizes.small,\n },\n medium: {\n fontSize: iconSizes.medium,\n height: iconSizes.medium,\n right: tokens.spacingHorizontalMNudge,\n width: iconSizes.medium,\n },\n large: {\n fontSize: iconSizes.large,\n height: iconSizes.large,\n right: tokens.spacingHorizontalM,\n width: iconSizes.large,\n },\n});\n\n/**\n * Apply styling to the Select slots based on the state\n */\nexport const useSelectStyles_unstable = (state: SelectState): SelectState => {\n const { size, appearance } = state;\n const disabled = state.select.disabled;\n const invalid = `${state.select['aria-invalid']}` === 'true';\n\n const iconStyles = useIconStyles();\n const rootStyles = useRootStyles();\n const selectStyles = useSelectStyles();\n\n state.root.className = mergeClasses(selectClassNames.root, rootStyles.base, state.root.className);\n\n state.select.className = mergeClasses(\n selectClassNames.select,\n selectStyles.base,\n selectStyles[size],\n selectStyles[appearance],\n !disabled && appearance === 'outline' && selectStyles.outlineInteractive,\n !disabled && invalid && appearance !== 'underline' && selectStyles.invalid,\n !disabled && invalid && appearance === 'underline' && selectStyles.invalidUnderline,\n disabled && selectStyles.disabled,\n disabled && appearance === 'underline' && selectStyles.disabledUnderline,\n state.select.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(\n selectClassNames.icon,\n iconStyles.icon,\n disabled && iconStyles.disabled,\n iconStyles[size],\n state.icon.className,\n );\n }\n\n return state;\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","selectClassNames","root","select","icon","iconSizes","small","medium","large","fieldHeights","paddingRight","spacingHorizontalSNudge","spacingHorizontalXXS","spacingHorizontalMNudge","spacingHorizontalM","paddingLeft","useRootStyles","base","Bt984gj","B7ck84d","mc9l5x","Eh141a","Bahqtrf","qhf8xq","h62rwi","B3778ie","d9w3h3","Bl18szs","B4j8arr","li1rpt","Bsft5z2","Dlnsje","E3zdtr","By385i5","Eqx8gd","B1piin3","b1kco5","Ba2ppi3","F2fol1","lck23g","df92cz","I188md","umuwi5","Blcqepd","nplu4u","Bioka5o","H713fs","B9ooomg","d","m","w","useSelectStyles","Bowrso0","B4j52fo","Bekrc4i","Bn0qgzm","ibv6hh","icvyot","vrafjx","oivjwe","wvpqe5","g2u3we","h3c5rm","B9xav0g","zhjwy3","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","E5pizo","sj55zd","Bceei9c","Bh6795r","B2u0y6b","Byoj8tv","z8tnut","B3aqqti","Brovlpu","Bxa1mx5","disabled","De3pzq","Bjwas2f","Bn1d65q","Bxeuatn","n51gp8","disabledUnderline","Bqenvij","uwmqm3","z189sj","Be2twd7","Bhrd7zp","Bg96gwp","outline","outlineInteractive","Bgoe8wy","Bwzppfd","oetu4i","gg5e9n","B6oc9vd","ak43y8","wmxk5l","B50zh58","underline","invalid","tvckwq","gk2u95","hhx65j","Bxowmz0","invalidUnderline","f","h","a","useIconStyles","Bkecrkj","Bo70h7d","Bbusuzp","j35jbq","a9b677","useSelectStyles_unstable","state","size","appearance","iconStyles","rootStyles","selectStyles","className"],"sources":["../../../src/components/Select/useSelectStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { SlotClassNames } from '@fluentui/react-utilities';\nimport type { SelectSlots, SelectState } from './Select.types';\n\nexport const selectClassNames: SlotClassNames<SelectSlots> = {\n root: 'fui-Select',\n select: 'fui-Select__select',\n icon: 'fui-Select__icon',\n};\n\nconst iconSizes = {\n small: '16px',\n medium: '20px',\n large: '24px',\n};\n\n//TODO: Should fieldHeights be a set of global design tokens or constants?\nconst fieldHeights = {\n small: '24px',\n medium: '32px',\n large: '40px',\n};\n\n/* Since the <select> element must span the full width and cannot have children,\n * the right padding needs to be calculated from the sum of the following:\n * 1. Field padding-right\n * 2. Icon width\n * 3. Content-icon spacing\n * 4. Content inner padding\n */\nconst paddingRight = {\n small: `calc(${tokens.spacingHorizontalSNudge}\n + ${iconSizes.small}\n + ${tokens.spacingHorizontalXXS}\n + ${tokens.spacingHorizontalXXS})`,\n medium: `calc(${tokens.spacingHorizontalMNudge}\n + ${iconSizes.medium}\n + ${tokens.spacingHorizontalXXS}\n + ${tokens.spacingHorizontalXXS})`,\n large: `calc(${tokens.spacingHorizontalM}\n + ${iconSizes.large}\n + ${tokens.spacingHorizontalSNudge}\n + ${tokens.spacingHorizontalSNudge})`,\n};\n\n/* Left padding is calculated from the outer padding + inner content padding values\n * since <select> can't have additional child content or custom inner layout */\nconst paddingLeft = {\n small: `calc(${tokens.spacingHorizontalSNudge} + ${tokens.spacingHorizontalXXS})`,\n medium: `calc(${tokens.spacingHorizontalMNudge} + ${tokens.spacingHorizontalXXS})`,\n large: `calc(${tokens.spacingHorizontalM} + ${tokens.spacingHorizontalSNudge})`,\n};\n\n/* end of shared values */\n\nconst useRootStyles = makeStyles({\n base: {\n alignItems: 'center',\n boxSizing: 'border-box',\n display: 'flex',\n flexWrap: 'nowrap',\n fontFamily: tokens.fontFamilyBase,\n position: 'relative',\n\n '&::after': {\n backgroundImage: `linear-gradient(\n 0deg,\n ${tokens.colorCompoundBrandStroke} 0%,\n ${tokens.colorCompoundBrandStroke} 50%,\n transparent 50%,\n transparent 100%\n )`,\n ...shorthands.borderRadius(0, 0, tokens.borderRadiusMedium, tokens.borderRadiusMedium),\n boxSizing: 'border-box',\n content: '\"\"',\n height: tokens.borderRadiusMedium,\n position: 'absolute',\n bottom: '0',\n left: '0',\n right: '0',\n transform: 'scaleX(0)',\n transitionProperty: 'transform',\n transitionDuration: tokens.durationUltraFast,\n transitionDelay: tokens.curveAccelerateMid,\n\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n transitionDelay: '0.01ms',\n },\n },\n\n '&:focus-within::after': {\n transform: 'scaleX(1)',\n transitionProperty: 'transform',\n transitionDuration: tokens.durationNormal,\n transitionDelay: tokens.curveDecelerateMid,\n\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n transitionDelay: '0.01ms',\n },\n },\n },\n});\n\nconst useSelectStyles = makeStyles({\n base: {\n appearance: 'none',\n ...shorthands.border('1px', 'solid', 'transparent'),\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n boxShadow: 'none',\n boxSizing: 'border-box',\n color: tokens.colorNeutralForeground1,\n cursor: 'pointer',\n flexGrow: 1,\n maxWidth: '100%',\n paddingBottom: 0,\n paddingTop: 0,\n\n ':focus': {\n outlineWidth: '2px',\n outlineStyle: 'solid',\n outlineColor: 'transparent',\n },\n },\n disabled: {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n cursor: 'not-allowed',\n '@media (forced-colors: active)': {\n ...shorthands.borderColor('GrayText'),\n },\n },\n disabledUnderline: {\n ...shorthands.borderColor(\n tokens.colorTransparentStrokeDisabled,\n tokens.colorTransparentStrokeDisabled,\n tokens.colorNeutralStrokeDisabled,\n ),\n },\n\n small: {\n height: fieldHeights.small,\n paddingLeft: paddingLeft.small,\n paddingRight: paddingRight.small,\n ...typographyStyles.caption1,\n },\n medium: {\n height: fieldHeights.medium,\n paddingLeft: paddingLeft.medium,\n paddingRight: paddingRight.medium,\n ...typographyStyles.body1,\n },\n large: {\n height: fieldHeights.large,\n paddingLeft: paddingLeft.large,\n paddingRight: paddingRight.large,\n ...typographyStyles.body2,\n },\n outline: {\n backgroundColor: tokens.colorNeutralBackground1,\n ...shorthands.border('1px', 'solid', tokens.colorNeutralStroke1),\n borderBottomColor: tokens.colorNeutralStrokeAccessible,\n },\n outlineInteractive: {\n '&:hover': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n borderBottomColor: tokens.colorNeutralStrokeAccessible,\n },\n\n '&:active': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n borderBottomColor: tokens.colorNeutralStrokeAccessible,\n },\n },\n underline: {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderBottom('1px', 'solid', tokens.colorNeutralStrokeAccessible),\n ...shorthands.borderRadius(0),\n },\n 'filled-lighter': {\n backgroundColor: tokens.colorNeutralBackground1,\n },\n 'filled-darker': {\n backgroundColor: tokens.colorNeutralBackground3,\n },\n invalid: {\n ':not(:focus-within),:hover:not(:focus-within)': {\n ...shorthands.borderColor(tokens.colorPaletteRedBorder2),\n },\n },\n invalidUnderline: {\n ':not(:focus-within),:hover:not(:focus-within)': {\n borderBottomColor: tokens.colorPaletteRedBorder2,\n },\n },\n});\n\nconst useIconStyles = makeStyles({\n icon: {\n boxSizing: 'border-box',\n color: tokens.colorNeutralStrokeAccessible,\n display: 'block',\n position: 'absolute',\n pointerEvents: 'none',\n\n // the SVG must have display: block for accurate positioning\n // otherwise an extra inline space is inserted after the svg element\n '& svg': {\n display: 'block',\n },\n },\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n '@media (forced-colors: active)': {\n color: 'GrayText',\n },\n },\n small: {\n fontSize: iconSizes.small,\n height: iconSizes.small,\n right: tokens.spacingHorizontalSNudge,\n width: iconSizes.small,\n },\n medium: {\n fontSize: iconSizes.medium,\n height: iconSizes.medium,\n right: tokens.spacingHorizontalMNudge,\n width: iconSizes.medium,\n },\n large: {\n fontSize: iconSizes.large,\n height: iconSizes.large,\n right: tokens.spacingHorizontalM,\n width: iconSizes.large,\n },\n});\n\n/**\n * Apply styling to the Select slots based on the state\n */\nexport const useSelectStyles_unstable = (state: SelectState): SelectState => {\n const { size, appearance } = state;\n const disabled = state.select.disabled;\n const invalid = `${state.select['aria-invalid']}` === 'true';\n\n const iconStyles = useIconStyles();\n const rootStyles = useRootStyles();\n const selectStyles = useSelectStyles();\n\n state.root.className = mergeClasses(selectClassNames.root, rootStyles.base, state.root.className);\n\n state.select.className = mergeClasses(\n selectClassNames.select,\n selectStyles.base,\n selectStyles[size],\n selectStyles[appearance],\n !disabled && appearance === 'outline' && selectStyles.outlineInteractive,\n !disabled && invalid && appearance !== 'underline' && selectStyles.invalid,\n !disabled && invalid && appearance === 'underline' && selectStyles.invalidUnderline,\n disabled && selectStyles.disabled,\n disabled && appearance === 'underline' && selectStyles.disabledUnderline,\n state.select.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(\n selectClassNames.icon,\n iconStyles.icon,\n disabled && iconStyles.disabled,\n iconStyles[size],\n state.icon.className,\n );\n }\n\n return state;\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ;AACrD,SAASC,MAAM,EAAEC,gBAAgB,QAAQ;AAIzC,OAAO,MAAMC,gBAAA,GAAgD;EAC3DC,IAAA,EAAM;EACNC,MAAA,EAAQ;EACRC,IAAA,EAAM;AACR;AAEA,MAAMC,SAAA,GAAY;EAChBC,KAAA,EAAO;EACPC,MAAA,EAAQ;EACRC,KAAA,EAAO;AACT;AAEA;AACA,MAAMC,YAAA,GAAe;EACnBH,KAAA,EAAO;EACPC,MAAA,EAAQ;EACRC,KAAA,EAAO;AACT;AAEA;;;;;;;AAOA,MAAME,YAAA,GAAe;EACnBJ,KAAA,EAAQ,QAAOP,MAAA,CAAOY,uBAAwB;QACxCN,SAAA,CAAUC,KAAM;QAChBP,MAAA,CAAOa,oBAAqB;QAC5Bb,MAAA,CAAOa,oBAAqB,GAAE;EACpCL,MAAA,EAAS,QAAOR,MAAA,CAAOc,uBAAwB;QACzCR,SAAA,CAAUE,MAAO;QACjBR,MAAA,CAAOa,oBAAqB;QAC5Bb,MAAA,CAAOa,oBAAqB,GAAE;EACpCJ,KAAA,EAAQ,QAAOT,MAAA,CAAOe,kBAAmB;QACnCT,SAAA,CAAUG,KAAM;QAChBT,MAAA,CAAOY,uBAAwB;QAC/BZ,MAAA,CAAOY,uBAAwB;AACvC;AAEA;;AAEA,MAAMI,WAAA,GAAc;EAClBT,KAAA,EAAQ,QAAOP,MAAA,CAAOY,uBAAwB,MAAKZ,MAAA,CAAOa,oBAAqB,GAAE;EACjFL,MAAA,EAAS,QAAOR,MAAA,CAAOc,uBAAwB,MAAKd,MAAA,CAAOa,oBAAqB,GAAE;EAClFJ,KAAA,EAAQ,QAAOT,MAAA,CAAOe,kBAAmB,MAAKf,MAAA,CAAOY,uBAAwB;AAC/E;AAEA;AAEA,MAAMK,aAAA,gBAAgBpB,QAAA;EAAAqB,IAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;EAAAC,CAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;EAAAC,CAAA;AAAA,EAgDtB;AAEA,MAAMC,eAAA,gBAAkBvD,QAAA;EAAAqB,IAAA;IAAAmC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAlD,OAAA;IAAAmD,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;EAAAC,QAAA;IAAAC,MAAA;IAAAnB,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAM,MAAA;IAAAC,OAAA;IAAAU,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,iBAAA;IAAAxB,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAA1D,KAAA;IAAAgF,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAlE,OAAA;IAAAmE,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;EAAApF,MAAA;IAAA+E,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAlE,OAAA;IAAAmE,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;EAAAnF,KAAA;IAAA8E,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAlE,OAAA;IAAAmE,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;EAAAC,OAAA;IAAAZ,MAAA;IAAA3B,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAA6B,kBAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAC,SAAA;IAAAtB,MAAA;IAAAzB,OAAA;IAAAI,MAAA;IAAAI,OAAA;IAAAE,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;EAAA;IAAAY,MAAA;EAAA;EAAA;IAAAA,MAAA;EAAA;EAAAuB,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAC,gBAAA;IAAAF,MAAA;EAAA;AAAA;EAAA1D,CAAA;EAAA6D,CAAA;EAAA5D,CAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;EAAA6D,CAAA;EAAAC,CAAA;AAAA,EA4FxB;AAEA,MAAMC,aAAA,gBAAgBpH,QAAA;EAAAQ,IAAA;IAAAe,OAAA;IAAAmD,MAAA;IAAAlD,MAAA;IAAAG,MAAA;IAAA0F,OAAA;IAAAC,OAAA;EAAA;EAAAnC,QAAA;IAAAT,MAAA;IAAA6C,OAAA;EAAA;EAAA7G,KAAA;IAAAmF,OAAA;IAAAH,OAAA;IAAA8B,MAAA;IAAAC,MAAA;EAAA;EAAA9G,MAAA;IAAAkF,OAAA;IAAAH,OAAA;IAAA8B,MAAA;IAAAC,MAAA;EAAA;EAAA7G,KAAA;IAAAiF,OAAA;IAAAH,OAAA;IAAA8B,MAAA;IAAAC,MAAA;EAAA;AAAA;EAAArE,CAAA;EAAAC,CAAA;IAAAA,CAAA;EAAA;AAAA,EAsCtB;AAEA;;;AAGA,OAAO,MAAMqE,wBAAA,GAA4BC,KAAA,IAAoC;EAC3E,MAAM;IAAEC,IAAA;IAAMC;EAAU,CAAE,GAAGF,KAAA;EAC7B,MAAMxC,QAAA,GAAWwC,KAAA,CAAMpH,MAAM,CAAC4E,QAAQ;EACtC,MAAMwB,OAAA,GAAW,GAAEgB,KAAA,CAAMpH,MAAM,CAAC,eAAgB,EAAC,KAAK;EAEtD,MAAMuH,UAAA,GAAaV,aAAA;EACnB,MAAMW,UAAA,GAAa3G,aAAA;EACnB,MAAM4G,YAAA,GAAezE,eAAA;EAErBoE,KAAA,CAAMrH,IAAI,CAAC2H,SAAS,GAAGhI,YAAA,CAAaI,gBAAA,CAAiBC,IAAI,EAAEyH,UAAA,CAAW1G,IAAI,EAAEsG,KAAA,CAAMrH,IAAI,CAAC2H,SAAS;EAEhGN,KAAA,CAAMpH,MAAM,CAAC0H,SAAS,GAAGhI,YAAA,CACvBI,gBAAA,CAAiBE,MAAM,EACvByH,YAAA,CAAa3G,IAAI,EACjB2G,YAAY,CAACJ,IAAA,CAAK,EAClBI,YAAY,CAACH,UAAA,CAAW,EACxB,CAAC1C,QAAA,IAAY0C,UAAA,KAAe,aAAaG,YAAA,CAAa/B,kBAAkB,EACxE,CAACd,QAAA,IAAYwB,OAAA,IAAWkB,UAAA,KAAe,eAAeG,YAAA,CAAarB,OAAO,EAC1E,CAACxB,QAAA,IAAYwB,OAAA,IAAWkB,UAAA,KAAe,eAAeG,YAAA,CAAahB,gBAAgB,EACnF7B,QAAA,IAAY6C,YAAA,CAAa7C,QAAQ,EACjCA,QAAA,IAAY0C,UAAA,KAAe,eAAeG,YAAA,CAAavC,iBAAiB,EACxEkC,KAAA,CAAMpH,MAAM,CAAC0H,SAAS;EAGxB,IAAIN,KAAA,CAAMnH,IAAI,EAAE;IACdmH,KAAA,CAAMnH,IAAI,CAACyH,SAAS,GAAGhI,YAAA,CACrBI,gBAAA,CAAiBG,IAAI,EACrBsH,UAAA,CAAWtH,IAAI,EACf2E,QAAA,IAAY2C,UAAA,CAAW3C,QAAQ,EAC/B2C,UAAU,CAACF,IAAA,CAAK,EAChBD,KAAA,CAAMnH,IAAI,CAACyH,SAAS;EAExB;EAEA,OAAON,KAAA;AACT"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
/* eslint-disable deprecation/deprecation */
|
|
2
|
-
import { getDeprecatedFieldClassNames, makeDeprecatedField } from '@fluentui/react-field';
|
|
1
|
+
/* eslint-disable deprecation/deprecation */import { getDeprecatedFieldClassNames, makeDeprecatedField } from '@fluentui/react-field';
|
|
3
2
|
import { Select, selectClassNames } from '../../Select';
|
|
4
3
|
/** @deprecated Use Field with Select: `<Field><Select /></Field>` */
|
|
5
4
|
export const selectFieldClassNames = /*#__PURE__*/getDeprecatedFieldClassNames(selectClassNames.root);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["getDeprecatedFieldClassNames","makeDeprecatedField","Select","selectClassNames","selectFieldClassNames","root","SelectField"],"sources":["
|
|
1
|
+
{"version":3,"names":["getDeprecatedFieldClassNames","makeDeprecatedField","Select","selectClassNames","selectFieldClassNames","root","SelectField"],"sources":["../../../src/components/SelectField/SelectField.tsx"],"sourcesContent":["/* eslint-disable deprecation/deprecation */\nimport { DeprecatedFieldProps, getDeprecatedFieldClassNames, makeDeprecatedField } from '@fluentui/react-field';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { Select, selectClassNames, SelectProps } from '../../Select';\n\n/** @deprecated Use Field with Select: `<Field><Select /></Field>` */\nexport type SelectFieldProps = DeprecatedFieldProps<SelectProps>;\n/** @deprecated Use Field with Select: `<Field><Select /></Field>` */\nexport const selectFieldClassNames = getDeprecatedFieldClassNames(selectClassNames.root);\n/** @deprecated Use Field with Select: `<Field><Select /></Field>` */\nexport const SelectField: ForwardRefComponent<SelectFieldProps> = makeDeprecatedField(Select);\n"],"mappings":"AAAA,4CACA,SAA+BA,4BAA4B,EAAEC,mBAAmB,QAAQ;AAExF,SAASC,MAAM,EAAEC,gBAAgB,QAAqB;AAItD;AACA,OAAO,MAAMC,qBAAA,gBAAwBJ,4BAAA,CAA6BG,gBAAA,CAAiBE,IAAI;AACvF;AACA,OAAO,MAAMC,WAAA,gBAAqDL,mBAAA,CAAoBC,MAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"names":[],"sources":["../../../src/components/SelectField/index.ts"],"sourcesContent":["export * from './SelectField';\n"],"mappings":"AAAA,cAAc"}
|
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Select","selectClassNames","renderSelect_unstable","useSelectStyles_unstable","useSelect_unstable","SelectField","SelectField_unstable","selectFieldClassNames"],"sources":["../src/
|
|
1
|
+
{"version":3,"names":["Select","selectClassNames","renderSelect_unstable","useSelectStyles_unstable","useSelect_unstable","SelectField","SelectField_unstable","selectFieldClassNames"],"sources":["../src/index.ts"],"sourcesContent":["export {\n Select,\n selectClassNames,\n renderSelect_unstable,\n useSelectStyles_unstable,\n useSelect_unstable,\n} from './Select';\nexport type { SelectOnChangeData, SelectProps, SelectSlots, SelectState } from './Select';\n\n// eslint-disable-next-line deprecation/deprecation\nexport { SelectField as SelectField_unstable, selectFieldClassNames } from './SelectField';\n// eslint-disable-next-line deprecation/deprecation\nexport type { SelectFieldProps as SelectFieldProps_unstable } from './SelectField';\n"],"mappings":"AAAA,SACEA,MAAM,EACNC,gBAAgB,EAChBC,qBAAqB,EACrBC,wBAAwB,EACxBC,kBAAkB,QACb;AAGP;AACA,SAASC,WAAA,IAAeC,oBAAoB,EAAEC,qBAAqB,QAAQ"}
|
package/lib-commonjs/Select.js
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
|
|
3
2
|
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
|
|
3
|
+
value: true
|
|
5
4
|
});
|
|
6
|
-
const
|
|
7
|
-
|
|
5
|
+
const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
|
|
6
|
+
_exportStar(require("./components/Select/index"), exports);
|
|
7
|
+
//# sourceMappingURL=Select.js.map
|
|
8
|
+
|
|
8
9
|
//# sourceMappingURL=Select.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../lib/Select.js"],"sourcesContent":["export * from './components/Select/index';\n//# sourceMappingURL=Select.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,kCAAkC"}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
|
|
3
2
|
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
|
|
3
|
+
value: true
|
|
5
4
|
});
|
|
6
|
-
const
|
|
7
|
-
|
|
5
|
+
const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
|
|
6
|
+
_exportStar(require("./components/SelectField/index"), exports);
|
|
7
|
+
//# sourceMappingURL=SelectField.js.map
|
|
8
|
+
|
|
8
9
|
//# sourceMappingURL=SelectField.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../lib/SelectField.js"],"sourcesContent":["export * from './components/SelectField/index';\n//# sourceMappingURL=SelectField.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,uCAAuC"}
|
|
@@ -1,25 +1,24 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
|
|
3
2
|
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "Select", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: ()=>Select
|
|
5
8
|
});
|
|
6
|
-
|
|
7
|
-
const
|
|
8
|
-
const
|
|
9
|
-
const
|
|
10
|
-
const
|
|
11
|
-
const
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
const {
|
|
19
|
-
useSelectStyles_unstable: useCustomStyles
|
|
20
|
-
} = react_shared_contexts_1.useCustomStyleHooks_unstable();
|
|
21
|
-
useCustomStyles(state);
|
|
22
|
-
return renderSelect_1.renderSelect_unstable(state);
|
|
9
|
+
const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
|
|
10
|
+
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
11
|
+
const _useSelect = require("./useSelect");
|
|
12
|
+
const _renderSelect = require("./renderSelect");
|
|
13
|
+
const _useSelectStyles = require("./useSelectStyles");
|
|
14
|
+
const _reactSharedContexts = require("@fluentui/react-shared-contexts");
|
|
15
|
+
const Select = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
|
|
16
|
+
const state = (0, _useSelect.useSelect_unstable)(props, ref);
|
|
17
|
+
(0, _useSelectStyles.useSelectStyles_unstable)(state);
|
|
18
|
+
const { useSelectStyles_unstable: useCustomStyles } = (0, _reactSharedContexts.useCustomStyleHooks_unstable)();
|
|
19
|
+
useCustomStyles(state);
|
|
20
|
+
return (0, _renderSelect.renderSelect_unstable)(state);
|
|
23
21
|
});
|
|
24
|
-
|
|
22
|
+
Select.displayName = 'Select'; //# sourceMappingURL=Select.js.map
|
|
23
|
+
|
|
25
24
|
//# sourceMappingURL=Select.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../lib/components/Select/Select.js"],"sourcesContent":["import * as React from 'react';\nimport { useSelect_unstable } from './useSelect';\nimport { renderSelect_unstable } from './renderSelect';\nimport { useSelectStyles_unstable } from './useSelectStyles';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n/**\n * Select component\n */\nexport const Select = /*#__PURE__*/React.forwardRef((props, ref) => {\n const state = useSelect_unstable(props, ref);\n useSelectStyles_unstable(state);\n const {\n useSelectStyles_unstable: useCustomStyles\n } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n return renderSelect_unstable(state);\n});\nSelect.displayName = 'Select';\n//# sourceMappingURL=Select.js.map"],"names":["Select","React","forwardRef","props","ref","state","useSelect_unstable","useSelectStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderSelect_unstable","displayName"],"mappings":";;;;+BAQaA;;aAAAA;;;6DARU;2BACY;8BACG;iCACG;qCACI;AAItC,MAAMA,SAAS,WAAW,GAAEC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAQ;IAClE,MAAMC,QAAQC,IAAAA,6BAAkB,EAACH,OAAOC;IACxCG,IAAAA,yCAAwB,EAACF;IACzB,MAAM,EACJE,0BAA0BC,gBAAe,EAC1C,GAAGC,IAAAA,iDAA4B;IAChCD,gBAAgBH;IAChB,OAAOK,IAAAA,mCAAqB,EAACL;AAC/B;AACAL,OAAOW,WAAW,GAAG,UACrB,kCAAkC"}
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
|
|
3
2
|
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
|
|
3
|
+
value: true
|
|
5
4
|
});
|
|
5
|
+
const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
|
|
6
|
+
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
7
|
+
//# sourceMappingURL=Select.types.js.map
|
|
8
|
+
|
|
6
9
|
//# sourceMappingURL=Select.types.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../lib/components/Select/Select.types.js"],"sourcesContent":["import * as React from 'react';\n//# sourceMappingURL=Select.types.js.map"],"names":[],"mappings":";;;;;6DAAuB;CACvB,wCAAwC"}
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
|
|
3
2
|
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
|
|
3
|
+
value: true
|
|
5
4
|
});
|
|
6
|
-
const
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
5
|
+
const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
|
|
6
|
+
_exportStar(require("./Select"), exports);
|
|
7
|
+
_exportStar(require("./Select.types"), exports);
|
|
8
|
+
_exportStar(require("./renderSelect"), exports);
|
|
9
|
+
_exportStar(require("./useSelect"), exports);
|
|
10
|
+
_exportStar(require("./useSelectStyles"), exports);
|
|
11
|
+
//# sourceMappingURL=index.js.map
|
|
12
|
+
|
|
12
13
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../lib/components/Select/index.js"],"sourcesContent":["export * from './Select';\nexport * from './Select.types';\nexport * from './renderSelect';\nexport * from './useSelect';\nexport * from './useSelectStyles';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;CACd,iCAAiC"}
|
|
@@ -1,26 +1,17 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
|
|
3
2
|
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "renderSelect_unstable", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: ()=>renderSelect_unstable
|
|
5
8
|
});
|
|
6
|
-
|
|
7
|
-
const
|
|
8
|
-
const
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
*/
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
slots,
|
|
15
|
-
slotProps
|
|
16
|
-
} = react_utilities_1.getSlots(state);
|
|
17
|
-
return React.createElement(slots.root, {
|
|
18
|
-
...slotProps.root
|
|
19
|
-
}, React.createElement(slots.select, {
|
|
20
|
-
...slotProps.select
|
|
21
|
-
}, slotProps.select.children), React.createElement(slots.icon, {
|
|
22
|
-
...slotProps.icon
|
|
23
|
-
}));
|
|
24
|
-
};
|
|
25
|
-
exports.renderSelect_unstable = renderSelect_unstable;
|
|
9
|
+
const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
|
|
10
|
+
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
11
|
+
const _reactUtilities = require("@fluentui/react-utilities");
|
|
12
|
+
const renderSelect_unstable = (state)=>{
|
|
13
|
+
const { slots , slotProps } = (0, _reactUtilities.getSlots)(state);
|
|
14
|
+
return /*#__PURE__*/ _react.createElement(slots.root, slotProps.root, /*#__PURE__*/ _react.createElement(slots.select, slotProps.select, slotProps.select.children), /*#__PURE__*/ _react.createElement(slots.icon, slotProps.icon));
|
|
15
|
+
}; //# sourceMappingURL=renderSelect.js.map
|
|
16
|
+
|
|
26
17
|
//# sourceMappingURL=renderSelect.js.map
|