@fluentui/react-infobutton 9.0.0-beta.32 → 9.0.0-beta.34
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 +91 -1
- package/CHANGELOG.md +30 -2
- package/lib/InfoButton.js +0 -1
- package/lib/InfoButton.js.map +1 -1
- package/lib/InfoLabel.js +0 -1
- package/lib/InfoLabel.js.map +1 -1
- package/lib/components/InfoButton/DefaultInfoButtonIcons.js +3 -4
- package/lib/components/InfoButton/DefaultInfoButtonIcons.js.map +1 -1
- package/lib/components/InfoButton/InfoButton.js +4 -6
- package/lib/components/InfoButton/InfoButton.js.map +1 -1
- package/lib/components/InfoButton/InfoButton.types.js +1 -2
- package/lib/components/InfoButton/InfoButton.types.js.map +1 -1
- package/lib/components/InfoButton/index.js +0 -1
- package/lib/components/InfoButton/index.js.map +1 -1
- package/lib/components/InfoButton/renderInfoButton.js +4 -9
- package/lib/components/InfoButton/renderInfoButton.js.map +1 -1
- package/lib/components/InfoButton/useInfoButton.js +46 -50
- package/lib/components/InfoButton/useInfoButton.js.map +1 -1
- package/lib/components/InfoButton/useInfoButtonStyles.styles.js +5 -5
- package/lib/components/InfoButton/useInfoButtonStyles.styles.js.map +1 -1
- package/lib/components/InfoLabel/InfoLabel.js +4 -6
- package/lib/components/InfoLabel/InfoLabel.js.map +1 -1
- package/lib/components/InfoLabel/InfoLabel.types.js +1 -2
- package/lib/components/InfoLabel/InfoLabel.types.js.map +1 -1
- package/lib/components/InfoLabel/index.js +0 -1
- package/lib/components/InfoLabel/index.js.map +1 -1
- package/lib/components/InfoLabel/renderInfoLabel.js +4 -9
- package/lib/components/InfoLabel/renderInfoLabel.js.map +1 -1
- package/lib/components/InfoLabel/useInfoLabel.js +49 -60
- package/lib/components/InfoLabel/useInfoLabel.js.map +1 -1
- package/lib/components/InfoLabel/useInfoLabelStyles.styles.js.map +1 -1
- package/lib/index.js +0 -1
- package/lib/index.js.map +1 -1
- package/lib-commonjs/InfoButton.js +0 -3
- package/lib-commonjs/InfoButton.js.map +1 -1
- package/lib-commonjs/InfoLabel.js +0 -3
- package/lib-commonjs/InfoLabel.js.map +1 -1
- package/lib-commonjs/components/InfoButton/DefaultInfoButtonIcons.js +3 -5
- package/lib-commonjs/components/InfoButton/DefaultInfoButtonIcons.js.map +1 -1
- package/lib-commonjs/components/InfoButton/InfoButton.js +1 -3
- package/lib-commonjs/components/InfoButton/InfoButton.js.map +1 -1
- package/lib-commonjs/components/InfoButton/InfoButton.types.js +0 -3
- package/lib-commonjs/components/InfoButton/InfoButton.types.js.map +1 -1
- package/lib-commonjs/components/InfoButton/index.js +0 -3
- package/lib-commonjs/components/InfoButton/index.js.map +1 -1
- package/lib-commonjs/components/InfoButton/renderInfoButton.js +1 -3
- package/lib-commonjs/components/InfoButton/renderInfoButton.js.map +1 -1
- package/lib-commonjs/components/InfoButton/useInfoButton.js +1 -3
- package/lib-commonjs/components/InfoButton/useInfoButton.js.map +1 -1
- package/lib-commonjs/components/InfoButton/useInfoButtonStyles.styles.js +12 -14
- package/lib-commonjs/components/InfoButton/useInfoButtonStyles.styles.js.map +1 -1
- package/lib-commonjs/components/InfoLabel/InfoLabel.js +1 -3
- package/lib-commonjs/components/InfoLabel/InfoLabel.js.map +1 -1
- package/lib-commonjs/components/InfoLabel/InfoLabel.types.js +0 -3
- package/lib-commonjs/components/InfoLabel/InfoLabel.types.js.map +1 -1
- package/lib-commonjs/components/InfoLabel/index.js +0 -3
- package/lib-commonjs/components/InfoLabel/index.js.map +1 -1
- package/lib-commonjs/components/InfoLabel/renderInfoLabel.js +1 -3
- package/lib-commonjs/components/InfoLabel/renderInfoLabel.js.map +1 -1
- package/lib-commonjs/components/InfoLabel/useInfoLabel.js +1 -3
- package/lib-commonjs/components/InfoLabel/useInfoLabel.js.map +1 -1
- package/lib-commonjs/components/InfoLabel/useInfoLabelStyles.styles.js +0 -2
- package/lib-commonjs/components/InfoLabel/useInfoLabelStyles.styles.js.map +1 -1
- package/lib-commonjs/index.js +0 -3
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +8 -8
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,97 @@
|
|
|
2
2
|
"name": "@fluentui/react-infobutton",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "Wed,
|
|
5
|
+
"date": "Wed, 31 May 2023 06:42:57 GMT",
|
|
6
|
+
"tag": "@fluentui/react-infobutton_v9.0.0-beta.34",
|
|
7
|
+
"version": "9.0.0-beta.34",
|
|
8
|
+
"comments": {
|
|
9
|
+
"prerelease": [
|
|
10
|
+
{
|
|
11
|
+
"author": "seanmonahan@microsoft.com",
|
|
12
|
+
"package": "@fluentui/react-infobutton",
|
|
13
|
+
"commit": "d640b972d7ac86bfb76ae6c6329f12cdd33b3b7c",
|
|
14
|
+
"comment": "chore: Update Griffel to v1.5.7."
|
|
15
|
+
},
|
|
16
|
+
{
|
|
17
|
+
"author": "beachball",
|
|
18
|
+
"package": "@fluentui/react-infobutton",
|
|
19
|
+
"comment": "Bump @fluentui/react-label to v9.1.15",
|
|
20
|
+
"commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
"author": "beachball",
|
|
24
|
+
"package": "@fluentui/react-infobutton",
|
|
25
|
+
"comment": "Bump @fluentui/react-popover to v9.6.0",
|
|
26
|
+
"commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
|
|
27
|
+
},
|
|
28
|
+
{
|
|
29
|
+
"author": "beachball",
|
|
30
|
+
"package": "@fluentui/react-infobutton",
|
|
31
|
+
"comment": "Bump @fluentui/react-tabster to v9.7.5",
|
|
32
|
+
"commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
"author": "beachball",
|
|
36
|
+
"package": "@fluentui/react-infobutton",
|
|
37
|
+
"comment": "Bump @fluentui/react-utilities to v9.9.2",
|
|
38
|
+
"commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
|
|
39
|
+
},
|
|
40
|
+
{
|
|
41
|
+
"author": "beachball",
|
|
42
|
+
"package": "@fluentui/react-infobutton",
|
|
43
|
+
"comment": "Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.6",
|
|
44
|
+
"commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
"author": "beachball",
|
|
48
|
+
"package": "@fluentui/react-infobutton",
|
|
49
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.22",
|
|
50
|
+
"commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
|
|
51
|
+
}
|
|
52
|
+
]
|
|
53
|
+
}
|
|
54
|
+
},
|
|
55
|
+
{
|
|
56
|
+
"date": "Thu, 25 May 2023 10:00:48 GMT",
|
|
57
|
+
"tag": "@fluentui/react-infobutton_v9.0.0-beta.33",
|
|
58
|
+
"version": "9.0.0-beta.33",
|
|
59
|
+
"comments": {
|
|
60
|
+
"prerelease": [
|
|
61
|
+
{
|
|
62
|
+
"author": "beachball",
|
|
63
|
+
"package": "@fluentui/react-infobutton",
|
|
64
|
+
"comment": "Bump @fluentui/react-label to v9.1.14",
|
|
65
|
+
"commit": "8f7c1b7591b3e665ae39e1b22ab0f0b28fb795c4"
|
|
66
|
+
},
|
|
67
|
+
{
|
|
68
|
+
"author": "beachball",
|
|
69
|
+
"package": "@fluentui/react-infobutton",
|
|
70
|
+
"comment": "Bump @fluentui/react-popover to v9.5.15",
|
|
71
|
+
"commit": "8f7c1b7591b3e665ae39e1b22ab0f0b28fb795c4"
|
|
72
|
+
},
|
|
73
|
+
{
|
|
74
|
+
"author": "beachball",
|
|
75
|
+
"package": "@fluentui/react-infobutton",
|
|
76
|
+
"comment": "Bump @fluentui/react-tabster to v9.7.4",
|
|
77
|
+
"commit": "8f7c1b7591b3e665ae39e1b22ab0f0b28fb795c4"
|
|
78
|
+
},
|
|
79
|
+
{
|
|
80
|
+
"author": "beachball",
|
|
81
|
+
"package": "@fluentui/react-infobutton",
|
|
82
|
+
"comment": "Bump @fluentui/react-utilities to v9.9.1",
|
|
83
|
+
"commit": "8f7c1b7591b3e665ae39e1b22ab0f0b28fb795c4"
|
|
84
|
+
},
|
|
85
|
+
{
|
|
86
|
+
"author": "beachball",
|
|
87
|
+
"package": "@fluentui/react-infobutton",
|
|
88
|
+
"comment": "Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.5",
|
|
89
|
+
"commit": "8f7c1b7591b3e665ae39e1b22ab0f0b28fb795c4"
|
|
90
|
+
}
|
|
91
|
+
]
|
|
92
|
+
}
|
|
93
|
+
},
|
|
94
|
+
{
|
|
95
|
+
"date": "Wed, 24 May 2023 20:45:27 GMT",
|
|
6
96
|
"tag": "@fluentui/react-infobutton_v9.0.0-beta.32",
|
|
7
97
|
"version": "9.0.0-beta.32",
|
|
8
98
|
"comments": {
|
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,40 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-infobutton
|
|
2
2
|
|
|
3
|
-
This log was last generated on Wed,
|
|
3
|
+
This log was last generated on Wed, 31 May 2023 06:42:57 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [9.0.0-beta.34](https://github.com/microsoft/fluentui/tree/@fluentui/react-infobutton_v9.0.0-beta.34)
|
|
8
|
+
|
|
9
|
+
Wed, 31 May 2023 06:42:57 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-infobutton_v9.0.0-beta.33..@fluentui/react-infobutton_v9.0.0-beta.34)
|
|
11
|
+
|
|
12
|
+
### Changes
|
|
13
|
+
|
|
14
|
+
- chore: Update Griffel to v1.5.7. ([PR #27925](https://github.com/microsoft/fluentui/pull/27925) by seanmonahan@microsoft.com)
|
|
15
|
+
- Bump @fluentui/react-label to v9.1.15 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
|
|
16
|
+
- Bump @fluentui/react-popover to v9.6.0 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
|
|
17
|
+
- Bump @fluentui/react-tabster to v9.7.5 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
|
|
18
|
+
- Bump @fluentui/react-utilities to v9.9.2 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
|
|
19
|
+
- Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.6 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
|
|
20
|
+
- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.22 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
|
|
21
|
+
|
|
22
|
+
## [9.0.0-beta.33](https://github.com/microsoft/fluentui/tree/@fluentui/react-infobutton_v9.0.0-beta.33)
|
|
23
|
+
|
|
24
|
+
Thu, 25 May 2023 10:00:48 GMT
|
|
25
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-infobutton_v9.0.0-beta.32..@fluentui/react-infobutton_v9.0.0-beta.33)
|
|
26
|
+
|
|
27
|
+
### Changes
|
|
28
|
+
|
|
29
|
+
- Bump @fluentui/react-label to v9.1.14 ([PR #27988](https://github.com/microsoft/fluentui/pull/27988) by beachball)
|
|
30
|
+
- Bump @fluentui/react-popover to v9.5.15 ([PR #27988](https://github.com/microsoft/fluentui/pull/27988) by beachball)
|
|
31
|
+
- Bump @fluentui/react-tabster to v9.7.4 ([PR #27988](https://github.com/microsoft/fluentui/pull/27988) by beachball)
|
|
32
|
+
- Bump @fluentui/react-utilities to v9.9.1 ([PR #27988](https://github.com/microsoft/fluentui/pull/27988) by beachball)
|
|
33
|
+
- Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.5 ([PR #27988](https://github.com/microsoft/fluentui/pull/27988) by beachball)
|
|
34
|
+
|
|
7
35
|
## [9.0.0-beta.32](https://github.com/microsoft/fluentui/tree/@fluentui/react-infobutton_v9.0.0-beta.32)
|
|
8
36
|
|
|
9
|
-
Wed, 24 May 2023 20:
|
|
37
|
+
Wed, 24 May 2023 20:45:27 GMT
|
|
10
38
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-infobutton_v9.0.0-beta.31..@fluentui/react-infobutton_v9.0.0-beta.32)
|
|
11
39
|
|
|
12
40
|
### Changes
|
package/lib/InfoButton.js
CHANGED
package/lib/InfoButton.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["InfoButton.ts"],"sourcesContent":["export * from './components/InfoButton/index';\n"],"names":[],"mappings":"AAAA,cAAc,gCAAgC"}
|
package/lib/InfoLabel.js
CHANGED
package/lib/InfoLabel.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["InfoLabel.ts"],"sourcesContent":["export * from './components/InfoLabel/index';\n"],"names":[],"mappings":"AAAA,cAAc,+BAA+B"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { Info12Regular, Info12Filled, Info16Regular, Info16Filled, Info20Regular, Info20Filled, bundleIcon } from '@fluentui/react-icons';
|
|
2
|
-
export const DefaultInfoButtonIcon12 =
|
|
3
|
-
export const DefaultInfoButtonIcon16 =
|
|
4
|
-
export const DefaultInfoButtonIcon20 =
|
|
5
|
-
//# sourceMappingURL=DefaultInfoButtonIcons.js.map
|
|
2
|
+
export const DefaultInfoButtonIcon12 = bundleIcon(Info12Filled, Info12Regular);
|
|
3
|
+
export const DefaultInfoButtonIcon16 = bundleIcon(Info16Filled, Info16Regular);
|
|
4
|
+
export const DefaultInfoButtonIcon20 = bundleIcon(Info20Filled, Info20Regular);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["DefaultInfoButtonIcons.tsx"],"sourcesContent":["import {\n Info12Regular,\n Info12Filled,\n Info16Regular,\n Info16Filled,\n Info20Regular,\n Info20Filled,\n bundleIcon,\n} from '@fluentui/react-icons';\n\nexport const DefaultInfoButtonIcon12 = bundleIcon(Info12Filled, Info12Regular);\nexport const DefaultInfoButtonIcon16 = bundleIcon(Info16Filled, Info16Regular);\nexport const DefaultInfoButtonIcon20 = bundleIcon(Info20Filled, Info20Regular);\n"],"names":["Info12Regular","Info12Filled","Info16Regular","Info16Filled","Info20Regular","Info20Filled","bundleIcon","DefaultInfoButtonIcon12","DefaultInfoButtonIcon16","DefaultInfoButtonIcon20"],"mappings":"AAAA,SACEA,aAAa,EACbC,YAAY,EACZC,aAAa,EACbC,YAAY,EACZC,aAAa,EACbC,YAAY,EACZC,UAAU,QACL,wBAAwB;AAE/B,OAAO,MAAMC,0BAA0BD,WAAWL,cAAcD,eAAe;AAC/E,OAAO,MAAMQ,0BAA0BF,WAAWH,cAAcD,eAAe;AAC/E,OAAO,MAAMO,0BAA0BH,WAAWD,cAAcD,eAAe"}
|
|
@@ -4,11 +4,9 @@ import { useInfoButton_unstable } from './useInfoButton';
|
|
|
4
4
|
import { useInfoButtonStyles_unstable } from './useInfoButtonStyles.styles';
|
|
5
5
|
/**
|
|
6
6
|
* InfoButtons provide a way to display additional information about a form field or an area in the UI.
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
return renderInfoButton_unstable(state);
|
|
7
|
+
*/ export const InfoButton = /*#__PURE__*/ React.forwardRef((props, ref)=>{
|
|
8
|
+
const state = useInfoButton_unstable(props, ref);
|
|
9
|
+
useInfoButtonStyles_unstable(state);
|
|
10
|
+
return renderInfoButton_unstable(state);
|
|
12
11
|
});
|
|
13
12
|
InfoButton.displayName = 'InfoButton';
|
|
14
|
-
//# sourceMappingURL=InfoButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["InfoButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderInfoButton_unstable } from './renderInfoButton';\nimport { useInfoButton_unstable } from './useInfoButton';\nimport { useInfoButtonStyles_unstable } from './useInfoButtonStyles.styles';\nimport type { InfoButtonProps } from './InfoButton.types';\n\n/**\n * InfoButtons provide a way to display additional information about a form field or an area in the UI.\n */\nexport const InfoButton: ForwardRefComponent<InfoButtonProps> = React.forwardRef((props, ref) => {\n const state = useInfoButton_unstable(props, ref);\n\n useInfoButtonStyles_unstable(state);\n return renderInfoButton_unstable(state);\n});\n\nInfoButton.displayName = 'InfoButton';\n"],"names":["React","renderInfoButton_unstable","useInfoButton_unstable","useInfoButtonStyles_unstable","InfoButton","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,sBAAsB,QAAQ,kBAAkB;AACzD,SAASC,4BAA4B,QAAQ,+BAA+B;AAG5E;;CAEC,GACD,OAAO,MAAMC,2BAAmDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC,MAAQ;IAC/F,MAAMC,QAAQN,uBAAuBI,OAAOC;IAE5CJ,6BAA6BK;IAC7B,OAAOP,0BAA0BO;AACnC,GAAG;AAEHJ,WAAWK,WAAW,GAAG"}
|
|
@@ -1,2 +1 @@
|
|
|
1
|
-
export {};
|
|
2
|
-
//# sourceMappingURL=InfoButton.types.js.map
|
|
1
|
+
export { };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["InfoButton.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { PopoverProps, PopoverSurface } from '@fluentui/react-popover';\n\nexport type InfoButtonSlots = {\n root: NonNullable<Slot<'button'>>;\n\n /**\n * The Popover element that wraps the info and root slots. Use this slot to pass props to the Popover.\n */\n popover: NonNullable<Slot<Partial<PopoverProps>>>;\n\n /**\n * The information to be displayed in the PopoverSurface when the button is pressed.\n */\n info: NonNullable<Slot<typeof PopoverSurface>>;\n};\n\n/**\n * InfoButton Props\n */\nexport type InfoButtonProps = Omit<ComponentProps<Partial<InfoButtonSlots>>, 'disabled'> & {\n /**\n * Size of the InfoButton.\n *\n * @default medium\n */\n size?: 'small' | 'medium' | 'large';\n};\n\n/**\n * State used in rendering InfoButton\n */\nexport type InfoButtonState = ComponentState<InfoButtonSlots> & Required<Pick<InfoButtonProps, 'size'>>;\n"],"names":[],"mappings":"AAAA,WAgCwG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './InfoButton';\nexport * from './InfoButton.types';\nexport * from './renderInfoButton';\nexport * from './useInfoButton';\nexport * from './useInfoButtonStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,eAAe;AAC7B,cAAc,qBAAqB;AACnC,cAAc,qBAAqB;AACnC,cAAc,kBAAkB;AAChC,cAAc,+BAA+B"}
|
|
@@ -1,14 +1,9 @@
|
|
|
1
|
-
/** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';
|
|
1
|
+
/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
|
|
2
2
|
import { getSlotsNext } from '@fluentui/react-utilities';
|
|
3
3
|
import { PopoverTrigger } from '@fluentui/react-popover';
|
|
4
4
|
/**
|
|
5
5
|
* Render the final JSX of InfoButton
|
|
6
|
-
*/
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
slots,
|
|
10
|
-
slotProps
|
|
11
|
-
} = getSlotsNext(state);
|
|
12
|
-
return /*#__PURE__*/createElement(slots.popover, slotProps.popover, /*#__PURE__*/createElement(PopoverTrigger, null, /*#__PURE__*/createElement(slots.root, slotProps.root)), /*#__PURE__*/createElement(slots.info, slotProps.info));
|
|
6
|
+
*/ export const renderInfoButton_unstable = (state)=>{
|
|
7
|
+
const { slots , slotProps } = getSlotsNext(state);
|
|
8
|
+
return /*#__PURE__*/ createElement(slots.popover, slotProps.popover, /*#__PURE__*/ createElement(PopoverTrigger, null, /*#__PURE__*/ createElement(slots.root, slotProps.root)), /*#__PURE__*/ createElement(slots.info, slotProps.info));
|
|
13
9
|
};
|
|
14
|
-
//# sourceMappingURL=renderInfoButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["renderInfoButton.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\n\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { PopoverTrigger } from '@fluentui/react-popover';\nimport type { PopoverProps } from '@fluentui/react-popover';\nimport type { InfoButtonState, InfoButtonSlots } from './InfoButton.types';\n\n/**\n * Render the final JSX of InfoButton\n */\nexport const renderInfoButton_unstable = (state: InfoButtonState) => {\n const { slots, slotProps } = getSlotsNext<InfoButtonSlots>(state);\n\n return (\n <slots.popover {...(slotProps.popover as PopoverProps)}>\n <PopoverTrigger>\n <slots.root {...slotProps.root} />\n </PopoverTrigger>\n <slots.info {...slotProps.info} />\n </slots.popover>\n );\n};\n"],"names":["createElement","getSlotsNext","PopoverTrigger","renderInfoButton_unstable","state","slots","slotProps","popover","root","info"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAE5D,SAASC,YAAY,QAAQ,4BAA4B;AACzD,SAASC,cAAc,QAAQ,0BAA0B;AAIzD;;CAEC,GACD,OAAO,MAAMC,4BAA4B,CAACC,QAA2B;IACnE,MAAM,EAAEC,MAAK,EAAEC,UAAS,EAAE,GAAGL,aAA8BG;IAE3D,qBACE,AAhBJ,cAgBKC,MAAME,OAAO,EAAMD,UAAUC,OAAO,gBACnC,AAjBN,cAiBOL,oCACC,AAlBR,cAkBSG,MAAMG,IAAI,EAAKF,UAAUE,IAAI,kBAEhC,AApBN,cAoBOH,MAAMI,IAAI,EAAKH,UAAUG,IAAI;AAGpC,EAAE"}
|
|
@@ -4,14 +4,14 @@ import { getNativeElementProps, mergeCallbacks, resolveShorthand } from '@fluent
|
|
|
4
4
|
import { Popover, PopoverSurface } from '@fluentui/react-popover';
|
|
5
5
|
import { useControllableState } from '@fluentui/react-utilities';
|
|
6
6
|
const infoButtonIconMap = {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
7
|
+
small: /*#__PURE__*/ React.createElement(DefaultInfoButtonIcon12, null),
|
|
8
|
+
medium: /*#__PURE__*/ React.createElement(DefaultInfoButtonIcon16, null),
|
|
9
|
+
large: /*#__PURE__*/ React.createElement(DefaultInfoButtonIcon20, null)
|
|
10
10
|
};
|
|
11
11
|
const popoverSizeMap = {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
12
|
+
small: 'small',
|
|
13
|
+
medium: 'small',
|
|
14
|
+
large: 'medium'
|
|
15
15
|
};
|
|
16
16
|
/**
|
|
17
17
|
* Create the state required to render InfoButton.
|
|
@@ -21,48 +21,44 @@ const popoverSizeMap = {
|
|
|
21
21
|
*
|
|
22
22
|
* @param props - props from this instance of InfoButton
|
|
23
23
|
* @param ref - reference to root HTMLElement of InfoButton
|
|
24
|
-
*/
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
state.popover.open = popoverOpen;
|
|
65
|
-
state.popover.onOpenChange = mergeCallbacks(state.popover.onOpenChange, (e, data) => setPopoverOpen(data.open));
|
|
66
|
-
return state;
|
|
24
|
+
*/ export const useInfoButton_unstable = (props, ref)=>{
|
|
25
|
+
const { size ='medium' } = props;
|
|
26
|
+
const state = {
|
|
27
|
+
size,
|
|
28
|
+
components: {
|
|
29
|
+
root: 'button',
|
|
30
|
+
popover: Popover,
|
|
31
|
+
info: PopoverSurface
|
|
32
|
+
},
|
|
33
|
+
root: getNativeElementProps('button', {
|
|
34
|
+
children: infoButtonIconMap[size],
|
|
35
|
+
type: 'button',
|
|
36
|
+
'aria-label': 'information',
|
|
37
|
+
...props,
|
|
38
|
+
ref
|
|
39
|
+
}),
|
|
40
|
+
popover: resolveShorthand(props.popover, {
|
|
41
|
+
required: true,
|
|
42
|
+
defaultProps: {
|
|
43
|
+
positioning: 'above-start',
|
|
44
|
+
size: popoverSizeMap[size],
|
|
45
|
+
withArrow: true
|
|
46
|
+
}
|
|
47
|
+
}),
|
|
48
|
+
info: resolveShorthand(props.info, {
|
|
49
|
+
required: true,
|
|
50
|
+
defaultProps: {
|
|
51
|
+
role: 'note',
|
|
52
|
+
tabIndex: -1
|
|
53
|
+
}
|
|
54
|
+
})
|
|
55
|
+
};
|
|
56
|
+
const [popoverOpen, setPopoverOpen] = useControllableState({
|
|
57
|
+
state: state.popover.open,
|
|
58
|
+
defaultState: state.popover.defaultOpen,
|
|
59
|
+
initialState: false
|
|
60
|
+
});
|
|
61
|
+
state.popover.open = popoverOpen;
|
|
62
|
+
state.popover.onOpenChange = mergeCallbacks(state.popover.onOpenChange, (e, data)=>setPopoverOpen(data.open));
|
|
63
|
+
return state;
|
|
67
64
|
};
|
|
68
|
-
//# sourceMappingURL=useInfoButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["useInfoButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { DefaultInfoButtonIcon12, DefaultInfoButtonIcon16, DefaultInfoButtonIcon20 } from './DefaultInfoButtonIcons';\nimport { getNativeElementProps, mergeCallbacks, resolveShorthand } from '@fluentui/react-utilities';\nimport { Popover, PopoverSurface } from '@fluentui/react-popover';\nimport { useControllableState } from '@fluentui/react-utilities';\nimport type { InfoButtonProps, InfoButtonState } from './InfoButton.types';\nimport type { PopoverProps } from '@fluentui/react-popover';\n\nconst infoButtonIconMap = {\n small: <DefaultInfoButtonIcon12 />,\n medium: <DefaultInfoButtonIcon16 />,\n large: <DefaultInfoButtonIcon20 />,\n} as const;\n\nconst popoverSizeMap = {\n small: 'small',\n medium: 'small',\n large: 'medium',\n} as const;\n\n/**\n * Create the state required to render InfoButton.\n *\n * The returned state can be modified with hooks such as useInfoButtonStyles_unstable,\n * before being passed to renderInfoButton_unstable.\n *\n * @param props - props from this instance of InfoButton\n * @param ref - reference to root HTMLElement of InfoButton\n */\nexport const useInfoButton_unstable = (props: InfoButtonProps, ref: React.Ref<HTMLElement>): InfoButtonState => {\n const { size = 'medium' } = props;\n\n const state: InfoButtonState = {\n size,\n\n components: {\n root: 'button',\n popover: Popover as React.FC<Partial<PopoverProps>>,\n info: PopoverSurface,\n },\n\n root: getNativeElementProps('button', {\n children: infoButtonIconMap[size],\n type: 'button',\n 'aria-label': 'information',\n ...props,\n ref,\n }),\n popover: resolveShorthand(props.popover, {\n required: true,\n defaultProps: {\n positioning: 'above-start',\n size: popoverSizeMap[size],\n withArrow: true,\n },\n }),\n info: resolveShorthand(props.info, {\n required: true,\n defaultProps: {\n role: 'note',\n tabIndex: -1,\n },\n }),\n };\n\n const [popoverOpen, setPopoverOpen] = useControllableState({\n state: state.popover.open,\n defaultState: state.popover.defaultOpen,\n initialState: false,\n });\n\n state.popover.open = popoverOpen;\n state.popover.onOpenChange = mergeCallbacks(state.popover.onOpenChange, (e, data) => setPopoverOpen(data.open));\n\n return state;\n};\n"],"names":["React","DefaultInfoButtonIcon12","DefaultInfoButtonIcon16","DefaultInfoButtonIcon20","getNativeElementProps","mergeCallbacks","resolveShorthand","Popover","PopoverSurface","useControllableState","infoButtonIconMap","small","medium","large","popoverSizeMap","useInfoButton_unstable","props","ref","size","state","components","root","popover","info","children","type","required","defaultProps","positioning","withArrow","role","tabIndex","popoverOpen","setPopoverOpen","open","defaultState","defaultOpen","initialState","onOpenChange","e","data"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,EAAEC,uBAAuB,EAAEC,uBAAuB,QAAQ,2BAA2B;AACrH,SAASC,qBAAqB,EAAEC,cAAc,EAAEC,gBAAgB,QAAQ,4BAA4B;AACpG,SAASC,OAAO,EAAEC,cAAc,QAAQ,0BAA0B;AAClE,SAASC,oBAAoB,QAAQ,4BAA4B;AAIjE,MAAMC,oBAAoB;IACxBC,qBAAO,oBAACV;IACRW,sBAAQ,oBAACV;IACTW,qBAAO,oBAACV;AACV;AAEA,MAAMW,iBAAiB;IACrBH,OAAO;IACPC,QAAQ;IACRC,OAAO;AACT;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAME,yBAAyB,CAACC,OAAwBC,MAAiD;IAC9G,MAAM,EAAEC,MAAO,SAAQ,EAAE,GAAGF;IAE5B,MAAMG,QAAyB;QAC7BD;QAEAE,YAAY;YACVC,MAAM;YACNC,SAASf;YACTgB,MAAMf;QACR;QAEAa,MAAMjB,sBAAsB,UAAU;YACpCoB,UAAUd,iBAAiB,CAACQ,KAAK;YACjCO,MAAM;YACN,cAAc;YACd,GAAGT,KAAK;YACRC;QACF;QACAK,SAAShB,iBAAiBU,MAAMM,OAAO,EAAE;YACvCI,UAAU,IAAI;YACdC,cAAc;gBACZC,aAAa;gBACbV,MAAMJ,cAAc,CAACI,KAAK;gBAC1BW,WAAW,IAAI;YACjB;QACF;QACAN,MAAMjB,iBAAiBU,MAAMO,IAAI,EAAE;YACjCG,UAAU,IAAI;YACdC,cAAc;gBACZG,MAAM;gBACNC,UAAU,CAAC;YACb;QACF;IACF;IAEA,MAAM,CAACC,aAAaC,eAAe,GAAGxB,qBAAqB;QACzDU,OAAOA,MAAMG,OAAO,CAACY,IAAI;QACzBC,cAAchB,MAAMG,OAAO,CAACc,WAAW;QACvCC,cAAc,KAAK;IACrB;IAEAlB,MAAMG,OAAO,CAACY,IAAI,GAAGF;IACrBb,MAAMG,OAAO,CAACgB,YAAY,GAAGjC,eAAec,MAAMG,OAAO,CAACgB,YAAY,EAAE,CAACC,GAAGC,OAASP,eAAeO,KAAKN,IAAI;IAE7G,OAAOf;AACT,EAAE"}
|
|
@@ -88,10 +88,10 @@ const useButtonStyles = /*#__PURE__*/__styles({
|
|
|
88
88
|
i03rao: ["fd0oaoj", "f1cwg4i8"],
|
|
89
89
|
Boxcth7: "fjvm52t",
|
|
90
90
|
Bsom6fd: ["f1cwg4i8", "fd0oaoj"],
|
|
91
|
-
J0r882: "
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
91
|
+
J0r882: "f57olzd",
|
|
92
|
+
Bule8hv: ["f4stah7", "fs1por5"],
|
|
93
|
+
Bjwuhne: "f480a47",
|
|
94
|
+
Ghsupd: ["fs1por5", "f4stah7"]
|
|
95
95
|
},
|
|
96
96
|
large: {
|
|
97
97
|
z8tnut: "fclwglc",
|
|
@@ -100,7 +100,7 @@ const useButtonStyles = /*#__PURE__*/__styles({
|
|
|
100
100
|
uwmqm3: ["f1b0r8ql", "f1w3695s"]
|
|
101
101
|
}
|
|
102
102
|
}, {
|
|
103
|
-
d: [".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f1ewtqcl{box-sizing:border-box;}", ".ftuwxu6{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".f4d9j23{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}", ".f1iuv45f{text-decoration-line:none;}", ".fmrv4ls{vertical-align:middle;}", ".f10pi13n{position:relative;}", ".f1c21dwh{background-color:var(--colorTransparentBackground);}", ".fkfq4zb{color:var(--colorNeutralForeground2);}", ".f1ern45e{border-top-style:none;}", ".f1n71otn{border-right-style:none;}", ".f1deefiw{border-left-style:none;}", ".f1h8hb77{border-bottom-style:none;}", ".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}", ".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}", ".f1hu3pq6{margin-top:0;}", ".f11qmguv{margin-right:0;}", ".f1tyq0we{margin-left:0;}", ".f19f4twv{margin-bottom:0;}", ".f1ywm7hm{padding-top:var(--spacingVerticalXS);}", ".f7x41pl{padding-right:var(--spacingHorizontalXS);}", ".fruq291{padding-left:var(--spacingHorizontalXS);}", ".f14wxoun{padding-bottom:var(--spacingVerticalXS);}", ".f16u1re .fui-Icon-filled{display:none;}", ".f1rw4040 .fui-Icon-regular{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".f1q9pm1r{background-color:var(--colorTransparentBackgroundSelected);}", ".f1qj7y59{color:var(--colorNeutralForeground2BrandSelected);}", ".fgzdkf0 .fui-Icon-filled{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".f15q0o9g .fui-Icon-regular{display:none;}", ".f8hki3x[data-fui-focus-visible]{border-top-color:transparent;}", ".f1d2448m[data-fui-focus-visible]{border-right-color:transparent;}", ".ffh67wi[data-fui-focus-visible]{border-left-color:transparent;}", ".f1bjia2o[data-fui-focus-visible]{border-bottom-color:transparent;}", ".f15bsgw9[data-fui-focus-visible]::after{content:\"\";}", ".f14e48fq[data-fui-focus-visible]::after{position:absolute;}", ".f18yb2kv[data-fui-focus-visible]::after{pointer-events:none;}", ".fd6o370[data-fui-focus-visible]::after{z-index:1;}", ".fh1cnn4[data-fui-focus-visible]::after{border-top-style:solid;}", ".fy7oxxb[data-fui-focus-visible]::after{border-right-style:solid;}", ".f184ne2d[data-fui-focus-visible]::after{border-left-style:solid;}", ".fpukqih[data-fui-focus-visible]::after{border-bottom-style:solid;}", ".frrh606[data-fui-focus-visible]::after{border-top-width:2px;}", ".f1v5zibi[data-fui-focus-visible]::after{border-right-width:2px;}", ".fo2hd23[data-fui-focus-visible]::after{border-left-width:2px;}", ".ful5kiu[data-fui-focus-visible]::after{border-bottom-width:2px;}", ".f1jqcqds[data-fui-focus-visible]::after{border-bottom-right-radius:var(--borderRadiusMedium);}", ".ftffrms[data-fui-focus-visible]::after{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f2e7qr6[data-fui-focus-visible]::after{border-top-right-radius:var(--borderRadiusMedium);}", ".fsr1zz6[data-fui-focus-visible]::after{border-top-left-radius:var(--borderRadiusMedium);}", ".f1dvezut[data-fui-focus-visible]::after{border-top-color:var(--colorStrokeFocus2);}", ".fd0oaoj[data-fui-focus-visible]::after{border-right-color:var(--colorStrokeFocus2);}", ".f1cwg4i8[data-fui-focus-visible]::after{border-left-color:var(--colorStrokeFocus2);}", ".fjvm52t[data-fui-focus-visible]::after{border-bottom-color:var(--colorStrokeFocus2);}", ".
|
|
103
|
+
d: [".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f1ewtqcl{box-sizing:border-box;}", ".ftuwxu6{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".f4d9j23{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}", ".f1iuv45f{text-decoration-line:none;}", ".fmrv4ls{vertical-align:middle;}", ".f10pi13n{position:relative;}", ".f1c21dwh{background-color:var(--colorTransparentBackground);}", ".fkfq4zb{color:var(--colorNeutralForeground2);}", ".f1ern45e{border-top-style:none;}", ".f1n71otn{border-right-style:none;}", ".f1deefiw{border-left-style:none;}", ".f1h8hb77{border-bottom-style:none;}", ".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}", ".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}", ".f1hu3pq6{margin-top:0;}", ".f11qmguv{margin-right:0;}", ".f1tyq0we{margin-left:0;}", ".f19f4twv{margin-bottom:0;}", ".f1ywm7hm{padding-top:var(--spacingVerticalXS);}", ".f7x41pl{padding-right:var(--spacingHorizontalXS);}", ".fruq291{padding-left:var(--spacingHorizontalXS);}", ".f14wxoun{padding-bottom:var(--spacingVerticalXS);}", ".f16u1re .fui-Icon-filled{display:none;}", ".f1rw4040 .fui-Icon-regular{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".f1q9pm1r{background-color:var(--colorTransparentBackgroundSelected);}", ".f1qj7y59{color:var(--colorNeutralForeground2BrandSelected);}", ".fgzdkf0 .fui-Icon-filled{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".f15q0o9g .fui-Icon-regular{display:none;}", ".f8hki3x[data-fui-focus-visible]{border-top-color:transparent;}", ".f1d2448m[data-fui-focus-visible]{border-right-color:transparent;}", ".ffh67wi[data-fui-focus-visible]{border-left-color:transparent;}", ".f1bjia2o[data-fui-focus-visible]{border-bottom-color:transparent;}", ".f15bsgw9[data-fui-focus-visible]::after{content:\"\";}", ".f14e48fq[data-fui-focus-visible]::after{position:absolute;}", ".f18yb2kv[data-fui-focus-visible]::after{pointer-events:none;}", ".fd6o370[data-fui-focus-visible]::after{z-index:1;}", ".fh1cnn4[data-fui-focus-visible]::after{border-top-style:solid;}", ".fy7oxxb[data-fui-focus-visible]::after{border-right-style:solid;}", ".f184ne2d[data-fui-focus-visible]::after{border-left-style:solid;}", ".fpukqih[data-fui-focus-visible]::after{border-bottom-style:solid;}", ".frrh606[data-fui-focus-visible]::after{border-top-width:2px;}", ".f1v5zibi[data-fui-focus-visible]::after{border-right-width:2px;}", ".fo2hd23[data-fui-focus-visible]::after{border-left-width:2px;}", ".ful5kiu[data-fui-focus-visible]::after{border-bottom-width:2px;}", ".f1jqcqds[data-fui-focus-visible]::after{border-bottom-right-radius:var(--borderRadiusMedium);}", ".ftffrms[data-fui-focus-visible]::after{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f2e7qr6[data-fui-focus-visible]::after{border-top-right-radius:var(--borderRadiusMedium);}", ".fsr1zz6[data-fui-focus-visible]::after{border-top-left-radius:var(--borderRadiusMedium);}", ".f1dvezut[data-fui-focus-visible]::after{border-top-color:var(--colorStrokeFocus2);}", ".fd0oaoj[data-fui-focus-visible]::after{border-right-color:var(--colorStrokeFocus2);}", ".f1cwg4i8[data-fui-focus-visible]::after{border-left-color:var(--colorStrokeFocus2);}", ".fjvm52t[data-fui-focus-visible]::after{border-bottom-color:var(--colorStrokeFocus2);}", ".f57olzd[data-fui-focus-visible]::after{top:calc(2px * -1);}", ".f4stah7[data-fui-focus-visible]::after{right:calc(2px * -1);}", ".fs1por5[data-fui-focus-visible]::after{left:calc(2px * -1);}", ".f480a47[data-fui-focus-visible]::after{bottom:calc(2px * -1);}", ".fclwglc{padding-top:var(--spacingVerticalXXS);}", ".f1w3695s{padding-right:var(--spacingVerticalXXS);}", ".f1b0r8ql{padding-left:var(--spacingVerticalXXS);}", ".fywfov9{padding-bottom:var(--spacingVerticalXXS);}"],
|
|
104
104
|
h: [".fjxutwb:hover{background-color:var(--colorTransparentBackgroundHover);}", ".f139oj5f:hover{color:var(--colorNeutralForeground2BrandHover);}", ".f1jpd6y0:hover .fui-Icon-filled{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".fuxngvv:hover .fui-Icon-regular{display:none;}", ".fwiml72:hover:active{background-color:var(--colorTransparentBackgroundPressed);}", ".f1fg1p5m:hover:active{color:var(--colorNeutralForeground2BrandPressed);}"],
|
|
105
105
|
m: [["@media (forced-colors: active){.f1rirnrt{background-color:Highlight;}}", {
|
|
106
106
|
m: "(forced-colors: active)"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["createFocusOutlineStyle","iconFilledClassName","iconRegularClassName","__styles","mergeClasses","shorthands","tokens","typographyStyles","infoButtonClassNames","root","popover","info","useButtonStyles","base","Bt984gj","B7ck84d","mc9l5x","Brf1p80","w71qe1","ha4doy","qhf8xq","De3pzq","sj55zd","icvyot","vrafjx","oivjwe","wvpqe5","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","B6of3ja","t21cq0","jrapky","Frg6f3","z8tnut","z189sj","Byoj8tv","uwmqm3","D0sxk3","t6yez3","Jwef8y","Bi91k9c","Bk3fhr4","Bmfj8id","iro3zm","B2d53fq","selected","Bsw6fvg","Bbusuzp","highContrast","Bs6v0vm","B46dtvo","gh1jta","focusIndicator","Brovlpu","B486eqv","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","Bm4h7ae","B7ys5i9","Busjfv9","Bhk32uz","Bf4ptjt","kclons","Bhdgwq3","Blkhhs4","Bqtpl0w","clg4pj","hgwjuy","Bonggc9","B1tsrr9","Dah5zi","Bkh64rk","qqdqy8","B6dhp37","i03rao","Boxcth7","Bsom6fd","J0r882","
|
|
1
|
+
{"version":3,"names":["createFocusOutlineStyle","iconFilledClassName","iconRegularClassName","__styles","mergeClasses","shorthands","tokens","typographyStyles","infoButtonClassNames","root","popover","info","useButtonStyles","base","Bt984gj","B7ck84d","mc9l5x","Brf1p80","w71qe1","ha4doy","qhf8xq","De3pzq","sj55zd","icvyot","vrafjx","oivjwe","wvpqe5","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","B6of3ja","t21cq0","jrapky","Frg6f3","z8tnut","z189sj","Byoj8tv","uwmqm3","D0sxk3","t6yez3","Jwef8y","Bi91k9c","Bk3fhr4","Bmfj8id","iro3zm","B2d53fq","selected","Bsw6fvg","Bbusuzp","highContrast","Bs6v0vm","B46dtvo","gh1jta","focusIndicator","Brovlpu","B486eqv","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","Bm4h7ae","B7ys5i9","Busjfv9","Bhk32uz","Bf4ptjt","kclons","Bhdgwq3","Blkhhs4","Bqtpl0w","clg4pj","hgwjuy","Bonggc9","B1tsrr9","Dah5zi","Bkh64rk","qqdqy8","B6dhp37","i03rao","Boxcth7","Bsom6fd","J0r882","Bule8hv","Bjwuhne","Ghsupd","large","d","h","m","f","i","usePopoverSurfaceStyles","smallMedium","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","useInfoButtonStyles_unstable","state","size","open","buttonStyles","popoverSurfaceStyles","className"],"sources":["useInfoButtonStyles.styles.js"],"sourcesContent":["import { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const infoButtonClassNames = {\n root: 'fui-InfoButton',\n // this className won't be used, but it's needed to satisfy the type checker\n popover: 'fui-InfoButton__popover',\n info: 'fui-InfoButton__info'\n};\n/**\n * Styles for the root slot\n */ const useButtonStyles = makeStyles({\n base: {\n alignItems: 'center',\n boxSizing: 'border-box',\n display: 'inline-flex',\n justifyContent: 'center',\n textDecorationLine: 'none',\n verticalAlign: 'middle',\n position: 'relative',\n backgroundColor: tokens.colorTransparentBackground,\n color: tokens.colorNeutralForeground2,\n ...shorthands.borderStyle('none'),\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n ...shorthands.margin(0),\n ...shorthands.padding(tokens.spacingVerticalXS, tokens.spacingHorizontalXS),\n [`& .${iconFilledClassName}`]: {\n display: 'none'\n },\n [`& .${iconRegularClassName}`]: {\n display: 'inline-flex'\n },\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n color: tokens.colorNeutralForeground2BrandHover,\n [`& .${iconFilledClassName}`]: {\n display: 'inline-flex'\n },\n [`& .${iconRegularClassName}`]: {\n display: 'none'\n }\n },\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n color: tokens.colorNeutralForeground2BrandPressed\n }\n },\n selected: {\n backgroundColor: tokens.colorTransparentBackgroundSelected,\n color: tokens.colorNeutralForeground2BrandSelected,\n [`& .${iconFilledClassName}`]: {\n display: 'inline-flex'\n },\n [`& .${iconRegularClassName}`]: {\n display: 'none'\n },\n '@media (forced-colors: active)': {\n backgroundColor: 'Highlight',\n color: 'Canvas'\n }\n },\n highContrast: {\n '@media (forced-colors: active)': {\n color: 'CanvasText',\n ':hover,:hover:active': {\n forcedColorAdjust: 'none',\n backgroundColor: 'Highlight',\n color: 'Canvas'\n }\n }\n },\n focusIndicator: createFocusOutlineStyle(),\n large: {\n ...shorthands.padding(tokens.spacingVerticalXXS, tokens.spacingVerticalXXS)\n }\n});\nconst usePopoverSurfaceStyles = makeStyles({\n smallMedium: typographyStyles.caption1,\n large: typographyStyles.body1\n});\n/**\n * Apply styling to the InfoButton slots based on the state\n */ export const useInfoButtonStyles_unstable = (state)=>{\n const { size } = state;\n const { open } = state.popover;\n const buttonStyles = useButtonStyles();\n const popoverSurfaceStyles = usePopoverSurfaceStyles();\n state.info.className = mergeClasses(infoButtonClassNames.info, size === 'large' && popoverSurfaceStyles.large, state.info.className);\n state.root.className = mergeClasses(infoButtonClassNames.root, buttonStyles.base, buttonStyles.highContrast, buttonStyles.focusIndicator, open && buttonStyles.selected, size === 'large' && buttonStyles.large, state.root.className);\n return state;\n};\n"],"mappings":"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"}
|
|
@@ -4,11 +4,9 @@ import { useInfoLabel_unstable } from './useInfoLabel';
|
|
|
4
4
|
import { useInfoLabelStyles_unstable } from './useInfoLabelStyles.styles';
|
|
5
5
|
/**
|
|
6
6
|
* InfoLabel component
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
return renderInfoLabel_unstable(state);
|
|
7
|
+
*/ export const InfoLabel = /*#__PURE__*/ React.forwardRef((props, ref)=>{
|
|
8
|
+
const state = useInfoLabel_unstable(props, ref);
|
|
9
|
+
useInfoLabelStyles_unstable(state);
|
|
10
|
+
return renderInfoLabel_unstable(state);
|
|
12
11
|
});
|
|
13
12
|
InfoLabel.displayName = 'InfoLabel';
|
|
14
|
-
//# sourceMappingURL=InfoLabel.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["InfoLabel.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { InfoLabelProps } from './InfoLabel.types';\nimport { renderInfoLabel_unstable } from './renderInfoLabel';\nimport { useInfoLabel_unstable } from './useInfoLabel';\nimport { useInfoLabelStyles_unstable } from './useInfoLabelStyles.styles';\n\n/**\n * InfoLabel component\n */\nexport const InfoLabel: ForwardRefComponent<InfoLabelProps> = React.forwardRef((props, ref) => {\n const state = useInfoLabel_unstable(props, ref);\n\n useInfoLabelStyles_unstable(state);\n return renderInfoLabel_unstable(state);\n});\n\nInfoLabel.displayName = 'InfoLabel';\n"],"names":["React","renderInfoLabel_unstable","useInfoLabel_unstable","useInfoLabelStyles_unstable","InfoLabel","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAI/B,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,qBAAqB,QAAQ,iBAAiB;AACvD,SAASC,2BAA2B,QAAQ,8BAA8B;AAE1E;;CAEC,GACD,OAAO,MAAMC,0BAAiDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC,MAAQ;IAC7F,MAAMC,QAAQN,sBAAsBI,OAAOC;IAE3CJ,4BAA4BK;IAC5B,OAAOP,yBAAyBO;AAClC,GAAG;AAEHJ,UAAUK,WAAW,GAAG"}
|
|
@@ -1,2 +1 @@
|
|
|
1
|
-
export {};
|
|
2
|
-
//# sourceMappingURL=InfoLabel.types.js.map
|
|
1
|
+
export { };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["InfoLabel.types.ts"],"sourcesContent":["import { Label } from '@fluentui/react-label';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { InfoButton } from '../InfoButton';\nimport type { InfoButtonProps } from '../InfoButton';\n\nexport type InfoLabelSlots = {\n root: NonNullable<Slot<'span'>>;\n\n /**\n * The Label component.\n *\n * It is not typically necessary to use this prop. The label text is the child of the `<InfoLabel>`, and other props\n * such as `size` and `required` should be set directly on the `InfoLabel`.\n *\n * This is the PRIMARY slot: all native properties specified directly on `<InfoLabel>` will be applied to this slot,\n * except `className` and `style`, which remain on the root slot.\n */\n label: NonNullable<Slot<typeof Label>>;\n\n /**\n * The InfoButton component.\n *\n * It is not typically necessary to use this prop. The content can be set using the `info` prop of the InfoLabel.\n */\n infoButton: Slot<typeof InfoButton>;\n};\n\n/**\n * InfoLabel Props\n */\nexport type InfoLabelProps = ComponentProps<Partial<InfoLabelSlots>, 'label'> & {\n /**\n * The content of the InfoButton's popover.\n */\n info?: InfoButtonProps['info'];\n};\n\n/**\n * State used in rendering InfoLabel\n */\nexport type InfoLabelState = ComponentState<InfoLabelSlots> & Pick<InfoLabelProps, 'size'>;\n"],"names":[],"mappings":"AAAA,WAwC2F"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './InfoLabel';\nexport * from './InfoLabel.types';\nexport * from './renderInfoLabel';\nexport * from './useInfoLabel';\nexport * from './useInfoLabelStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,cAAc;AAC5B,cAAc,oBAAoB;AAClC,cAAc,oBAAoB;AAClC,cAAc,iBAAiB;AAC/B,cAAc,8BAA8B"}
|
|
@@ -1,13 +1,8 @@
|
|
|
1
|
-
/** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';
|
|
1
|
+
/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
|
|
2
2
|
import { getSlotsNext } from '@fluentui/react-utilities';
|
|
3
3
|
/**
|
|
4
4
|
* Render the final JSX of InfoLabel
|
|
5
|
-
*/
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
slots,
|
|
9
|
-
slotProps
|
|
10
|
-
} = getSlotsNext(state);
|
|
11
|
-
return /*#__PURE__*/createElement(slots.root, slotProps.root, /*#__PURE__*/createElement(slots.label, slotProps.label), slots.infoButton && /*#__PURE__*/createElement(slots.infoButton, slotProps.infoButton));
|
|
5
|
+
*/ export const renderInfoLabel_unstable = (state)=>{
|
|
6
|
+
const { slots , slotProps } = getSlotsNext(state);
|
|
7
|
+
return /*#__PURE__*/ createElement(slots.root, slotProps.root, /*#__PURE__*/ createElement(slots.label, slotProps.label), slots.infoButton && /*#__PURE__*/ createElement(slots.infoButton, slotProps.infoButton));
|
|
12
8
|
};
|
|
13
|
-
//# sourceMappingURL=renderInfoLabel.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["renderInfoLabel.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\n\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport type { InfoLabelSlots, InfoLabelState } from './InfoLabel.types';\n\n/**\n * Render the final JSX of InfoLabel\n */\nexport const renderInfoLabel_unstable = (state: InfoLabelState) => {\n const { slots, slotProps } = getSlotsNext<InfoLabelSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n <slots.label {...slotProps.label} />\n {slots.infoButton && <slots.infoButton {...slotProps.infoButton} />}\n </slots.root>\n );\n};\n"],"names":["createElement","getSlotsNext","renderInfoLabel_unstable","state","slots","slotProps","root","label","infoButton"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAE5D,SAASC,YAAY,QAAQ,4BAA4B;AAGzD;;CAEC,GACD,OAAO,MAAMC,2BAA2B,CAACC,QAA0B;IACjE,MAAM,EAAEC,MAAK,EAAEC,UAAS,EAAE,GAAGJ,aAA6BE;IAE1D,qBACE,AAdJ,cAcKC,MAAME,IAAI,EAAKD,UAAUC,IAAI,gBAC5B,AAfN,cAeOF,MAAMG,KAAK,EAAKF,UAAUE,KAAK,GAC/BH,MAAMI,UAAU,kBAAI,AAhB3B,cAgB4BJ,MAAMI,UAAU,EAAKH,UAAUG,UAAU;AAGrE,EAAE"}
|