@fluentui/react-migration-v8-v9 9.7.12 → 9.8.0
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.md +20 -2
- package/dist/index.d.ts +1 -1
- package/lib/components/Button/ActionButtonShim.js.map +1 -1
- package/lib/components/Button/ButtonShim.js.map +1 -1
- package/lib/components/Button/CompoundButtonShim.js.map +1 -1
- package/lib/components/Button/DefaultButtonShim.js.map +1 -1
- package/lib/components/Button/MenuButtonShim.js.map +1 -1
- package/lib/components/Button/PrimaryButtonShim.js.map +1 -1
- package/lib/components/Button/ToggleButtonShim.js.map +1 -1
- package/lib/components/Button/shimButtonProps.js.map +1 -1
- package/lib/components/Checkbox/CheckboxShim.js +1 -0
- package/lib/components/Checkbox/CheckboxShim.js.map +1 -1
- package/lib-commonjs/components/Button/ActionButtonShim.js.map +1 -1
- package/lib-commonjs/components/Button/ButtonShim.js.map +1 -1
- package/lib-commonjs/components/Button/CompoundButtonShim.js.map +1 -1
- package/lib-commonjs/components/Button/DefaultButtonShim.js.map +1 -1
- package/lib-commonjs/components/Button/MenuButtonShim.js.map +1 -1
- package/lib-commonjs/components/Button/PrimaryButtonShim.js.map +1 -1
- package/lib-commonjs/components/Button/ToggleButtonShim.js.map +1 -1
- package/lib-commonjs/components/Button/shimButtonProps.js.map +1 -1
- package/lib-commonjs/components/Checkbox/CheckboxShim.js +1 -0
- package/lib-commonjs/components/Checkbox/CheckboxShim.js.map +1 -1
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,30 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-migration-v8-v9
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Thu, 12 Jun 2025 09:39:11 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [9.8.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-migration-v8-v9_v9.8.0)
|
|
8
|
+
|
|
9
|
+
Thu, 12 Jun 2025 09:39:11 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-migration-v8-v9_v9.7.13..@fluentui/react-migration-v8-v9_v9.8.0)
|
|
11
|
+
|
|
12
|
+
### Minor changes
|
|
13
|
+
|
|
14
|
+
- Bump @fluentui/react-components to v9.66.0 ([PR #34456](https://github.com/microsoft/fluentui/pull/34456) by beachball)
|
|
15
|
+
|
|
16
|
+
## [9.7.13](https://github.com/microsoft/fluentui/tree/@fluentui/react-migration-v8-v9_v9.7.13)
|
|
17
|
+
|
|
18
|
+
Wed, 11 Jun 2025 22:31:57 GMT
|
|
19
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-migration-v8-v9_v9.7.12..@fluentui/react-migration-v8-v9_v9.7.13)
|
|
20
|
+
|
|
21
|
+
### Patches
|
|
22
|
+
|
|
23
|
+
- Bump @fluentui/react-components to v9.65.0 ([PR #34631](https://github.com/microsoft/fluentui/pull/34631) by beachball)
|
|
24
|
+
|
|
7
25
|
## [9.7.12](https://github.com/microsoft/fluentui/tree/@fluentui/react-migration-v8-v9_v9.7.12)
|
|
8
26
|
|
|
9
|
-
Fri, 06 Jun 2025 13:
|
|
27
|
+
Fri, 06 Jun 2025 13:15:17 GMT
|
|
10
28
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-migration-v8-v9_v9.7.11..@fluentui/react-migration-v8-v9_v9.7.12)
|
|
11
29
|
|
|
12
30
|
### Patches
|
package/dist/index.d.ts
CHANGED
|
@@ -32,7 +32,7 @@ export declare const brandWeb: BrandVariants;
|
|
|
32
32
|
|
|
33
33
|
export declare const ButtonShim: React_2.ForwardRefExoticComponent<IBaseButtonProps & React_2.RefAttributes<HTMLButtonElement>>;
|
|
34
34
|
|
|
35
|
-
export declare const CheckboxShim: React_2.ForwardRefExoticComponent<
|
|
35
|
+
export declare const CheckboxShim: React_2.ForwardRefExoticComponent<ICheckboxProps & React_2.RefAttributes<HTMLInputElement>>;
|
|
36
36
|
|
|
37
37
|
/**
|
|
38
38
|
* Possible color variant values
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Button/ActionButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { Button } from '@fluentui/react-components';\n\nimport { shimButtonProps } from './shimButtonProps';\n\n/**\n * Shims a v8 ActionButton to render a v9 Button\n */\nexport const ActionButtonShim: React.ForwardRefExoticComponent
|
|
1
|
+
{"version":3,"sources":["../src/components/Button/ActionButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { Button } from '@fluentui/react-components';\nimport type { RefAttributes } from '@fluentui/react-utilities';\n\nimport { shimButtonProps } from './shimButtonProps';\n\n/**\n * Shims a v8 ActionButton to render a v9 Button\n */\nexport const ActionButtonShim: React.ForwardRefExoticComponent<\n IButtonProps &\n // eslint-disable-next-line @typescript-eslint/no-restricted-types -- this is expected in order to be compatible with v8, as every v8 interface contains `React.RefAttributes` to accept ref as string\n React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n const variantProps = {\n ...props,\n variantClassName: 'ms-Button--action ms-Button--command',\n };\n\n const shimProps = shimButtonProps(variantProps);\n\n return <Button {...(props as RefAttributes<HTMLButtonElement>)} {...shimProps} appearance=\"transparent\" />;\n});\n"],"names":["React","Button","shimButtonProps","ActionButtonShim","forwardRef","props","_ref","variantProps","variantClassName","shimProps","appearance"],"rangeMappings":";;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAI/B,SAASC,MAAM,QAAQ,6BAA6B;AAGpD,SAASC,eAAe,QAAQ,oBAAoB;AAEpD;;CAEC,GACD,OAAO,MAAMC,iCAITH,MAAMI,UAAU,CAAC,CAACC,OAAOC;IAC3B,MAAMC,eAAe;QACnB,GAAGF,KAAK;QACRG,kBAAkB;IACpB;IAEA,MAAMC,YAAYP,gBAAgBK;IAElC,qBAAO,oBAACN;QAAQ,GAAII,KAAK;QAAwC,GAAGI,SAAS;QAAEC,YAAW;;AAC5F,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Button/ButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IBaseButtonProps } from '@fluentui/react';\n\nimport { Button } from '@fluentui/react-components';\n\nimport { shimButtonProps } from './shimButtonProps';\nimport { ToggleButtonShim } from './ToggleButtonShim';\nimport { CompoundButtonShim } from './CompoundButtonShim';\n\nexport const ButtonShim: React.ForwardRefExoticComponent
|
|
1
|
+
{"version":3,"sources":["../src/components/Button/ButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IBaseButtonProps } from '@fluentui/react';\n\nimport { Button } from '@fluentui/react-components';\nimport type { RefAttributes } from '@fluentui/react-utilities';\n\nimport { shimButtonProps } from './shimButtonProps';\nimport { ToggleButtonShim } from './ToggleButtonShim';\nimport { CompoundButtonShim } from './CompoundButtonShim';\n\nexport const ButtonShim: React.ForwardRefExoticComponent<\n IBaseButtonProps &\n // eslint-disable-next-line @typescript-eslint/no-restricted-types -- this is expected in order to be compatible with v8, as every v8 interface contains `React.RefAttributes` to accept ref as string\n React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n const shimProps = shimButtonProps(props);\n\n if (props.toggle) {\n return <ToggleButtonShim {...props}>{props.children}</ToggleButtonShim>;\n }\n if (props.secondaryText || props.onRenderDescription?.(props)) {\n return <CompoundButtonShim {...props} />;\n }\n\n return <Button {...(props as RefAttributes<HTMLButtonElement>)} {...shimProps} />;\n});\n"],"names":["React","Button","shimButtonProps","ToggleButtonShim","CompoundButtonShim","ButtonShim","forwardRef","props","_ref","shimProps","toggle","children","secondaryText","onRenderDescription"],"rangeMappings":";;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAI/B,SAASC,MAAM,QAAQ,6BAA6B;AAGpD,SAASC,eAAe,QAAQ,oBAAoB;AACpD,SAASC,gBAAgB,QAAQ,qBAAqB;AACtD,SAASC,kBAAkB,QAAQ,uBAAuB;AAE1D,OAAO,MAAMC,2BAITL,MAAMM,UAAU,CAAC,CAACC,OAAOC;QAMAD;IAL3B,MAAME,YAAYP,gBAAgBK;IAElC,IAAIA,MAAMG,MAAM,EAAE;QAChB,qBAAO,oBAACP,kBAAqBI,OAAQA,MAAMI,QAAQ;IACrD;IACA,IAAIJ,MAAMK,aAAa,MAAIL,6BAAAA,MAAMM,mBAAmB,cAAzBN,iDAAAA,gCAAAA,OAA4BA,SAAQ;QAC7D,qBAAO,oBAACH,oBAAuBG;IACjC;IAEA,qBAAO,oBAACN;QAAQ,GAAIM,KAAK;QAAwC,GAAGE,SAAS;;AAC/E,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Button/CompoundButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { CompoundButton } from '@fluentui/react-components';\nimport type { CompoundButtonProps } from '@fluentui/react-components';\n\nimport { shimButtonProps } from './shimButtonProps';\n\n/**\n * Shims v8 CompoundButton to render a v9 CompoundButton\n */\nexport const CompoundButtonShim: React.ForwardRefExoticComponent<\n IButtonProps
|
|
1
|
+
{"version":3,"sources":["../src/components/Button/CompoundButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { CompoundButton } from '@fluentui/react-components';\nimport type { CompoundButtonProps } from '@fluentui/react-components';\nimport type { RefAttributes } from '@fluentui/react-utilities';\n\nimport { shimButtonProps } from './shimButtonProps';\n\n/**\n * Shims v8 CompoundButton to render a v9 CompoundButton\n */\nexport const CompoundButtonShim: React.ForwardRefExoticComponent<\n IButtonProps &\n // eslint-disable-next-line @typescript-eslint/no-restricted-types -- this is expected in order to be compatible with v8, as every v8 interface contains `React.RefAttributes` to accept ref as string\n React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n const variantProps = {\n ...props,\n variantClassName: props.primary ? 'ms-Button--compoundPrimary' : 'ms-Button--compound',\n };\n\n const shimProps: CompoundButtonProps = {\n ...shimButtonProps(variantProps),\n secondaryContent: props.secondaryText || props.onRenderDescription?.(props),\n };\n\n return <CompoundButton {...(props as RefAttributes<HTMLButtonElement>)} {...shimProps} />;\n});\n"],"names":["React","CompoundButton","shimButtonProps","CompoundButtonShim","forwardRef","props","_ref","variantProps","variantClassName","primary","shimProps","secondaryContent","secondaryText","onRenderDescription"],"rangeMappings":";;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAI/B,SAASC,cAAc,QAAQ,6BAA6B;AAI5D,SAASC,eAAe,QAAQ,oBAAoB;AAEpD;;CAEC,GACD,OAAO,MAAMC,mCAITH,MAAMI,UAAU,CAAC,CAACC,OAAOC;QAQgBD;IAP3C,MAAME,eAAe;QACnB,GAAGF,KAAK;QACRG,kBAAkBH,MAAMI,OAAO,GAAG,+BAA+B;IACnE;IAEA,MAAMC,YAAiC;QACrC,GAAGR,gBAAgBK,aAAa;QAChCI,kBAAkBN,MAAMO,aAAa,MAAIP,6BAAAA,MAAMQ,mBAAmB,cAAzBR,iDAAAA,gCAAAA,OAA4BA;IACvE;IAEA,qBAAO,oBAACJ;QAAgB,GAAII,KAAK;QAAwC,GAAGK,SAAS;;AACvF,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Button/DefaultButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { ButtonShim } from './ButtonShim';\n\n/**\n * Shims a v8 DefaultButton to render a v9 Button\n */\nexport const DefaultButtonShim: React.ForwardRefExoticComponent
|
|
1
|
+
{"version":3,"sources":["../src/components/Button/DefaultButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { ButtonShim } from './ButtonShim';\n\n/**\n * Shims a v8 DefaultButton to render a v9 Button\n */\nexport const DefaultButtonShim: React.ForwardRefExoticComponent<\n IButtonProps &\n // eslint-disable-next-line @typescript-eslint/no-restricted-types -- this is expected in order to be compatible with v8, as every v8 interface contains `React.RefAttributes` to accept ref as string\n React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n return <ButtonShim {...props} variantClassName={props.primary ? 'ms-Button--primary' : 'ms-Button--default'} />;\n});\n"],"names":["React","ButtonShim","DefaultButtonShim","forwardRef","props","_ref","variantClassName","primary"],"rangeMappings":";;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAI/B,SAASC,UAAU,QAAQ,eAAe;AAE1C;;CAEC,GACD,OAAO,MAAMC,kCAITF,MAAMG,UAAU,CAAC,CAACC,OAAOC;IAC3B,qBAAO,oBAACJ;QAAY,GAAGG,KAAK;QAAEE,kBAAkBF,MAAMG,OAAO,GAAG,uBAAuB;;AACzF,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Button/MenuButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\nimport { MenuButton, Menu, MenuList, MenuPopover, MenuTrigger } from '@fluentui/react-components';\nimport type { MenuButtonProps } from '@fluentui/react-components';\nimport { MenuItemShim, shimMenuProps } from '../Menu/index';\n\nimport { shimButtonProps } from './shimButtonProps';\n\nexport const MenuButtonShim: React.ForwardRefExoticComponent
|
|
1
|
+
{"version":3,"sources":["../src/components/Button/MenuButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\nimport { MenuButton, Menu, MenuList, MenuPopover, MenuTrigger } from '@fluentui/react-components';\nimport type { MenuButtonProps } from '@fluentui/react-components';\nimport { MenuItemShim, shimMenuProps } from '../Menu/index';\n\nimport { shimButtonProps } from './shimButtonProps';\n\nexport const MenuButtonShim: React.ForwardRefExoticComponent<\n IButtonProps &\n // eslint-disable-next-line @typescript-eslint/no-restricted-types -- this is expected in order to be compatible with v8, as every v8 interface contains `React.RefAttributes` to accept ref as string\n React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n const variantProps = {\n ...props,\n variantClassName: props.primary ? 'ms-Button--primary' : 'ms-Button--default',\n };\n\n const shimProps: MenuButtonProps = {\n ...shimButtonProps(variantProps),\n };\n\n const shimmedMenuProps = props.menuProps ? shimMenuProps(props.menuProps) : {};\n\n return (\n <Menu {...shimmedMenuProps}>\n <MenuTrigger>\n <MenuButton {...shimProps} />\n </MenuTrigger>\n <MenuPopover>\n <MenuList>\n {props.menuProps?.items.map(item => (\n // key is added through item spread\n // eslint-disable-next-line react/jsx-key\n <MenuItemShim {...item} />\n ))}\n </MenuList>\n </MenuPopover>\n </Menu>\n );\n});\n"],"names":["React","MenuButton","Menu","MenuList","MenuPopover","MenuTrigger","MenuItemShim","shimMenuProps","shimButtonProps","MenuButtonShim","forwardRef","props","_ref","variantProps","variantClassName","primary","shimProps","shimmedMenuProps","menuProps","items","map","item"],"rangeMappings":";;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,SAASC,UAAU,EAAEC,IAAI,EAAEC,QAAQ,EAAEC,WAAW,EAAEC,WAAW,QAAQ,6BAA6B;AAElG,SAASC,YAAY,EAAEC,aAAa,QAAQ,gBAAgB;AAE5D,SAASC,eAAe,QAAQ,oBAAoB;AAEpD,OAAO,MAAMC,+BAITT,MAAMU,UAAU,CAAC,CAACC,OAAOC;QAmBlBD;IAlBT,MAAME,eAAe;QACnB,GAAGF,KAAK;QACRG,kBAAkBH,MAAMI,OAAO,GAAG,uBAAuB;IAC3D;IAEA,MAAMC,YAA6B;QACjC,GAAGR,gBAAgBK,aAAa;IAClC;IAEA,MAAMI,mBAAmBN,MAAMO,SAAS,GAAGX,cAAcI,MAAMO,SAAS,IAAI,CAAC;IAE7E,qBACE,oBAAChB,MAASe,gCACR,oBAACZ,iCACC,oBAACJ,YAAee,2BAElB,oBAACZ,iCACC,oBAACD,iBACEQ,mBAAAA,MAAMO,SAAS,cAAfP,uCAAAA,iBAAiBQ,KAAK,CAACC,GAAG,CAACC,CAAAA,OAC1B,mCAAmC;QACnC,yCAAyC;sBACzC,oBAACf,cAAiBe;AAM9B,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Button/PrimaryButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\nimport { ButtonShim } from './ButtonShim';\n\n/**\n * Shims v8 PrimaryButton to render a v9 Button\n */\nexport const PrimaryButtonShim: React.ForwardRefExoticComponent
|
|
1
|
+
{"version":3,"sources":["../src/components/Button/PrimaryButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\nimport { ButtonShim } from './ButtonShim';\n\n/**\n * Shims v8 PrimaryButton to render a v9 Button\n */\nexport const PrimaryButtonShim: React.ForwardRefExoticComponent<\n IButtonProps &\n // eslint-disable-next-line @typescript-eslint/no-restricted-types -- this is expected in order to be compatible with v8, as every v8 interface contains `React.RefAttributes` to accept ref as string\n React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n return <ButtonShim {...props} primary variantClassName=\"ms-Button--primary\" />;\n});\n"],"names":["React","ButtonShim","PrimaryButtonShim","forwardRef","props","_ref","primary","variantClassName"],"rangeMappings":";;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,SAASC,UAAU,QAAQ,eAAe;AAE1C;;CAEC,GACD,OAAO,MAAMC,kCAITF,MAAMG,UAAU,CAAC,CAACC,OAAOC;IAC3B,qBAAO,oBAACJ;QAAY,GAAGG,KAAK;QAAEE,SAAAA;QAAQC,kBAAiB;;AACzD,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Button/ToggleButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { ToggleButton } from '@fluentui/react-components';\nimport type { ToggleButtonProps } from '@fluentui/react-components';\n\nimport { shimButtonProps } from './shimButtonProps';\n\n/**\n * Shims v8 ToggleButton to render a v9 ToggleButton\n */\nexport const ToggleButtonShim: React.ForwardRefExoticComponent
|
|
1
|
+
{"version":3,"sources":["../src/components/Button/ToggleButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { ToggleButton } from '@fluentui/react-components';\nimport type { ToggleButtonProps } from '@fluentui/react-components';\nimport type { RefAttributes } from '@fluentui/react-utilities';\n\nimport { shimButtonProps } from './shimButtonProps';\n\n/**\n * Shims v8 ToggleButton to render a v9 ToggleButton\n */\nexport const ToggleButtonShim: React.ForwardRefExoticComponent<\n IButtonProps &\n // eslint-disable-next-line @typescript-eslint/no-restricted-types -- this is expected in order to be compatible with v8, as every v8 interface contains `React.RefAttributes` to accept ref as string\n React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n const variantProps = {\n ...props,\n variantClassName: props.primary ? 'ms-Button--compoundPrimary' : 'ms-Button--compound',\n };\n\n const shimProps: ToggleButtonProps = {\n ...shimButtonProps(variantProps),\n checked: props.checked,\n defaultChecked: props.defaultChecked,\n };\n\n return <ToggleButton {...(props as RefAttributes<HTMLButtonElement>)} {...shimProps} />;\n});\n"],"names":["React","ToggleButton","shimButtonProps","ToggleButtonShim","forwardRef","props","_ref","variantProps","variantClassName","primary","shimProps","checked","defaultChecked"],"rangeMappings":";;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAI/B,SAASC,YAAY,QAAQ,6BAA6B;AAI1D,SAASC,eAAe,QAAQ,oBAAoB;AAEpD;;CAEC,GACD,OAAO,MAAMC,iCAITH,MAAMI,UAAU,CAAC,CAACC,OAAOC;IAC3B,MAAMC,eAAe;QACnB,GAAGF,KAAK;QACRG,kBAAkBH,MAAMI,OAAO,GAAG,+BAA+B;IACnE;IAEA,MAAMC,YAA+B;QACnC,GAAGR,gBAAgBK,aAAa;QAChCI,SAASN,MAAMM,OAAO;QACtBC,gBAAgBP,MAAMO,cAAc;IACtC;IAEA,qBAAO,oBAACX;QAAc,GAAII,KAAK;QAAwC,GAAGK,SAAS;;AACrF,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Button/shimButtonProps.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Icon } from '@fluentui/react';\nimport type { IBaseButtonProps } from '@fluentui/react';\n\nimport type { ButtonProps } from '@fluentui/react-components';\n\nexport const shimButtonProps = (props: IBaseButtonProps
|
|
1
|
+
{"version":3,"sources":["../src/components/Button/shimButtonProps.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Icon } from '@fluentui/react';\nimport type { IBaseButtonProps } from '@fluentui/react';\n\nimport type { ButtonProps } from '@fluentui/react-components';\n\nexport const shimButtonProps = (\n props: IBaseButtonProps &\n // eslint-disable-next-line @typescript-eslint/no-restricted-types -- this is expected in order to be compatible with v8, as every v8 interface contains `React.RefAttributes` to accept ref as string\n React.RefAttributes<HTMLButtonElement>,\n): ButtonProps => {\n //TODO: Icon shim. This still renders the v8 icon.\n const icon = props.onRenderIcon ? (\n props.onRenderIcon(props)\n ) : props.iconProps ? (\n <Icon {...props.iconProps} />\n ) : undefined;\n\n const variantClassName = props.variantClassName ?? props.primary ? 'ms-Button--primary' : 'ms-Button--default';\n const className = [props.baseClassName, variantClassName, props.className].filter(Boolean).join(' ');\n\n return {\n // spread incoming props to propagate HTML properties not part of IBaseButtonProps\n ...props,\n appearance: props.primary ? 'primary' : undefined,\n className,\n disabled: props.disabled,\n disabledFocusable: props.allowDisabledFocus,\n 'aria-hidden': props.ariaHidden,\n 'aria-label': props.ariaLabel,\n icon,\n key: props.key || props.uniqueId,\n children: props.onRenderChildren\n ? props.onRenderChildren(props)\n : props.onRenderText\n ? props.onRenderText(props)\n : props.text || props.children,\n } as ButtonProps;\n};\n"],"names":["React","Icon","shimButtonProps","props","icon","onRenderIcon","iconProps","undefined","variantClassName","primary","className","baseClassName","filter","Boolean","join","appearance","disabled","disabledFocusable","allowDisabledFocus","ariaHidden","ariaLabel","key","uniqueId","children","onRenderChildren","onRenderText","text"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,IAAI,QAAQ,kBAAkB;AAKvC,OAAO,MAAMC,kBAAkB,CAC7BC;IAIA,kDAAkD;IAClD,MAAMC,OAAOD,MAAME,YAAY,GAC7BF,MAAME,YAAY,CAACF,SACjBA,MAAMG,SAAS,iBACjB,oBAACL,MAASE,MAAMG,SAAS,IACvBC;QAEqBJ;IAAzB,MAAMK,mBAAmBL,CAAAA,CAAAA,0BAAAA,MAAMK,gBAAgB,cAAtBL,qCAAAA,0BAA0BA,MAAMM,OAAO,AAAD,IAAI,uBAAuB;IAC1F,MAAMC,YAAY;QAACP,MAAMQ,aAAa;QAAEH;QAAkBL,MAAMO,SAAS;KAAC,CAACE,MAAM,CAACC,SAASC,IAAI,CAAC;IAEhG,OAAO;QACL,kFAAkF;QAClF,GAAGX,KAAK;QACRY,YAAYZ,MAAMM,OAAO,GAAG,YAAYF;QACxCG;QACAM,UAAUb,MAAMa,QAAQ;QACxBC,mBAAmBd,MAAMe,kBAAkB;QAC3C,eAAef,MAAMgB,UAAU;QAC/B,cAAchB,MAAMiB,SAAS;QAC7BhB;QACAiB,KAAKlB,MAAMkB,GAAG,IAAIlB,MAAMmB,QAAQ;QAChCC,UAAUpB,MAAMqB,gBAAgB,GAC5BrB,MAAMqB,gBAAgB,CAACrB,SACvBA,MAAMsB,YAAY,GAClBtB,MAAMsB,YAAY,CAACtB,SACnBA,MAAMuB,IAAI,IAAIvB,MAAMoB,QAAQ;IAClC;AACF,EAAE"}
|
|
@@ -49,5 +49,6 @@ export const CheckboxShim = /*#__PURE__*/ React.forwardRef((props, _ref)=>{
|
|
|
49
49
|
className: mergeClasses('ms-Checkbox-checkbox', styles.checkbox)
|
|
50
50
|
}
|
|
51
51
|
});
|
|
52
|
+
// NOTE: cast is necessary as `ICheckboxProps` extends React.Ref<HTMLDivElement> which is not compatible with our defined React.Ref<HTMLInputElement>
|
|
52
53
|
});
|
|
53
54
|
CheckboxShim.displayName = 'CheckboxShim';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Checkbox/CheckboxShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { classNamesFunction, ICheckboxProps, ICheckboxStyles, ICheckboxStyleProps } from '@fluentui/react';\nimport { Checkbox, mergeClasses } from '@fluentui/react-components';\nimport { useCheckboxProps } from './shimCheckboxProps';\nimport { useCheckboxStyles } from './Checkbox.styles';\n\nconst getClassNames = classNamesFunction<ICheckboxStyleProps, ICheckboxStyles>({\n useStaticStyles: false,\n});\n\nexport const CheckboxShim = React.forwardRef((props
|
|
1
|
+
{"version":3,"sources":["../src/components/Checkbox/CheckboxShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { classNamesFunction, ICheckboxProps, ICheckboxStyles, ICheckboxStyleProps } from '@fluentui/react';\nimport { Checkbox, mergeClasses } from '@fluentui/react-components';\nimport { useCheckboxProps } from './shimCheckboxProps';\nimport { useCheckboxStyles } from './Checkbox.styles';\n\nconst getClassNames = classNamesFunction<ICheckboxStyleProps, ICheckboxStyles>({\n useStaticStyles: false,\n});\n\nexport const CheckboxShim = React.forwardRef((props, _ref) => {\n 'use no memo';\n\n const { className, styles: stylesV8, onRenderLabel, label, componentRef } = props;\n const shimProps = useCheckboxProps(props);\n const styles = getClassNames(stylesV8);\n const stylesV9 = useCheckboxStyles();\n const checkboxRef = (_ref as React.RefObject<HTMLInputElement>) || React.createRef<HTMLInputElement>();\n\n React.useImperativeHandle(componentRef, () => ({\n checked: checkboxRef.current?.checked ?? false,\n indeterminate: checkboxRef.current?.indeterminate ?? false,\n focus: () => checkboxRef.current?.focus(),\n }));\n\n const defaultLabelRenderer = (checkboxProps?: ICheckboxProps): JSX.Element | null => {\n if (!checkboxProps) {\n return null;\n }\n const { label: defaultLabel, title } = checkboxProps;\n return defaultLabel ? (\n <span title={title} className={styles.text}>\n {defaultLabel}\n </span>\n ) : null;\n };\n\n if (label || onRenderLabel) {\n shimProps.label = {\n className: mergeClasses('ms-Checkbox-text', styles.label, styles.text),\n children: onRenderLabel ? onRenderLabel(props, defaultLabelRenderer) : label,\n };\n }\n\n return (\n <Checkbox\n {...shimProps}\n ref={checkboxRef}\n className={mergeClasses(stylesV9.root, 'ms-Checkbox', className, styles.root)}\n indicator={{ className: mergeClasses('ms-Checkbox-checkbox', styles.checkbox) }}\n />\n );\n // NOTE: cast is necessary as `ICheckboxProps` extends React.Ref<HTMLDivElement> which is not compatible with our defined React.Ref<HTMLInputElement>\n}) as React.ForwardRefExoticComponent<\n ICheckboxProps &\n // eslint-disable-next-line @typescript-eslint/no-restricted-types -- this is expected in order to be compatible with v8, as every v8 interface contains `React.RefAttributes` to accept ref as string\n React.RefAttributes<HTMLInputElement>\n>;\n\nCheckboxShim.displayName = 'CheckboxShim';\n"],"names":["React","classNamesFunction","Checkbox","mergeClasses","useCheckboxProps","useCheckboxStyles","getClassNames","useStaticStyles","CheckboxShim","forwardRef","props","_ref","className","styles","stylesV8","onRenderLabel","label","componentRef","shimProps","stylesV9","checkboxRef","createRef","useImperativeHandle","checked","current","indeterminate","focus","defaultLabelRenderer","checkboxProps","defaultLabel","title","span","text","children","ref","root","indicator","checkbox","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,kBAAkB,QAA8D,kBAAkB;AAC3G,SAASC,QAAQ,EAAEC,YAAY,QAAQ,6BAA6B;AACpE,SAASC,gBAAgB,QAAQ,sBAAsB;AACvD,SAASC,iBAAiB,QAAQ,oBAAoB;AAEtD,MAAMC,gBAAgBL,mBAAyD;IAC7EM,iBAAiB;AACnB;AAEA,OAAO,MAAMC,6BAAeR,MAAMS,UAAU,CAAC,CAACC,OAAOC;IACnD;IAEA,MAAM,EAAEC,SAAS,EAAEC,QAAQC,QAAQ,EAAEC,aAAa,EAAEC,KAAK,EAAEC,YAAY,EAAE,GAAGP;IAC5E,MAAMQ,YAAYd,iBAAiBM;IACnC,MAAMG,SAASP,cAAcQ;IAC7B,MAAMK,WAAWd;IACjB,MAAMe,cAAc,AAACT,sBAA8CX,MAAMqB,SAAS;IAElFrB,MAAMsB,mBAAmB,CAACL,cAAc;YAC7BG,sBACMA;YADNA,8BACMA;eAF8B;YAC7CG,SAASH,CAAAA,gCAAAA,uBAAAA,YAAYI,OAAO,cAAnBJ,2CAAAA,qBAAqBG,OAAO,cAA5BH,0CAAAA,+BAAgC;YACzCK,eAAeL,CAAAA,sCAAAA,wBAAAA,YAAYI,OAAO,cAAnBJ,4CAAAA,sBAAqBK,aAAa,cAAlCL,gDAAAA,qCAAsC;YACrDM,OAAO;oBAAMN;wBAAAA,uBAAAA,YAAYI,OAAO,cAAnBJ,2CAAAA,qBAAqBM,KAAK;;QACzC;IAAA;IAEA,MAAMC,uBAAuB,CAACC;QAC5B,IAAI,CAACA,eAAe;YAClB,OAAO;QACT;QACA,MAAM,EAAEZ,OAAOa,YAAY,EAAEC,KAAK,EAAE,GAAGF;QACvC,OAAOC,6BACL,oBAACE;YAAKD,OAAOA;YAAOlB,WAAWC,OAAOmB,IAAI;WACvCH,gBAED;IACN;IAEA,IAAIb,SAASD,eAAe;QAC1BG,UAAUF,KAAK,GAAG;YAChBJ,WAAWT,aAAa,oBAAoBU,OAAOG,KAAK,EAAEH,OAAOmB,IAAI;YACrEC,UAAUlB,gBAAgBA,cAAcL,OAAOiB,wBAAwBX;QACzE;IACF;IAEA,qBACE,oBAACd;QACE,GAAGgB,SAAS;QACbgB,KAAKd;QACLR,WAAWT,aAAagB,SAASgB,IAAI,EAAE,eAAevB,WAAWC,OAAOsB,IAAI;QAC5EC,WAAW;YAAExB,WAAWT,aAAa,wBAAwBU,OAAOwB,QAAQ;QAAE;;AAGlF,sJAAsJ;AACxJ,GAIE;AAEF7B,aAAa8B,WAAW,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Button/ActionButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { Button } from '@fluentui/react-components';\n\nimport { shimButtonProps } from './shimButtonProps';\n\n/**\n * Shims a v8 ActionButton to render a v9 Button\n */\nexport const ActionButtonShim: React.ForwardRefExoticComponent
|
|
1
|
+
{"version":3,"sources":["../src/components/Button/ActionButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { Button } from '@fluentui/react-components';\nimport type { RefAttributes } from '@fluentui/react-utilities';\n\nimport { shimButtonProps } from './shimButtonProps';\n\n/**\n * Shims a v8 ActionButton to render a v9 Button\n */\nexport const ActionButtonShim: React.ForwardRefExoticComponent<\n IButtonProps &\n // eslint-disable-next-line @typescript-eslint/no-restricted-types -- this is expected in order to be compatible with v8, as every v8 interface contains `React.RefAttributes` to accept ref as string\n React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n const variantProps = {\n ...props,\n variantClassName: 'ms-Button--action ms-Button--command',\n };\n\n const shimProps = shimButtonProps(variantProps);\n\n return <Button {...(props as RefAttributes<HTMLButtonElement>)} {...shimProps} appearance=\"transparent\" />;\n});\n"],"names":["ActionButtonShim","React","forwardRef","props","_ref","variantProps","variantClassName","shimProps","shimButtonProps","createElement","Button","appearance"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAYaA;;;eAAAA;;;;iEAZU;iCAIA;iCAGS;AAKzB,MAAMA,mBAAAA,WAAAA,GAITC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC3B,MAAMC,eAAe;QACnB,GAAGF,KAAK;QACRG,kBAAkB;IACpB;IAEA,MAAMC,YAAYC,IAAAA,gCAAAA,EAAgBH;IAElC,OAAA,WAAA,GAAOJ,OAAAQ,aAAA,CAACC,uBAAAA,EAAAA;QAAQ,GAAIP,KAAK;QAAwC,GAAGI,SAAS;QAAEI,YAAW;;AAC5F"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Button/ButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IBaseButtonProps } from '@fluentui/react';\n\nimport { Button } from '@fluentui/react-components';\n\nimport { shimButtonProps } from './shimButtonProps';\nimport { ToggleButtonShim } from './ToggleButtonShim';\nimport { CompoundButtonShim } from './CompoundButtonShim';\n\nexport const ButtonShim: React.ForwardRefExoticComponent
|
|
1
|
+
{"version":3,"sources":["../src/components/Button/ButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IBaseButtonProps } from '@fluentui/react';\n\nimport { Button } from '@fluentui/react-components';\nimport type { RefAttributes } from '@fluentui/react-utilities';\n\nimport { shimButtonProps } from './shimButtonProps';\nimport { ToggleButtonShim } from './ToggleButtonShim';\nimport { CompoundButtonShim } from './CompoundButtonShim';\n\nexport const ButtonShim: React.ForwardRefExoticComponent<\n IBaseButtonProps &\n // eslint-disable-next-line @typescript-eslint/no-restricted-types -- this is expected in order to be compatible with v8, as every v8 interface contains `React.RefAttributes` to accept ref as string\n React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n const shimProps = shimButtonProps(props);\n\n if (props.toggle) {\n return <ToggleButtonShim {...props}>{props.children}</ToggleButtonShim>;\n }\n if (props.secondaryText || props.onRenderDescription?.(props)) {\n return <CompoundButtonShim {...props} />;\n }\n\n return <Button {...(props as RefAttributes<HTMLButtonElement>)} {...shimProps} />;\n});\n"],"names":["ButtonShim","React","forwardRef","props","_ref","shimProps","shimButtonProps","toggle","createElement","ToggleButtonShim","children","secondaryText","onRenderDescription","CompoundButtonShim","Button"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAWaA;;;eAAAA;;;;iEAXU;iCAIA;iCAGS;kCACC;oCACE;AAE5B,MAAMA,aAAAA,WAAAA,GAITC,OAAMC,UAAU,CAAC,CAACC,OAAOC;QAMAD;IAL3B,MAAME,YAAYC,IAAAA,gCAAAA,EAAgBH;IAElC,IAAIA,MAAMI,MAAM,EAAE;QAChB,OAAA,WAAA,GAAON,OAAAO,aAAA,CAACC,kCAAAA,EAAqBN,OAAQA,MAAMO,QAAQ;IACrD;IACA,IAAIP,MAAMQ,aAAa,IAAA,CAAA,AAAIR,CAAAA,6BAAAA,MAAMS,mBAAmB,AAAnBA,MAAmB,QAAzBT,+BAAAA,KAAAA,IAAAA,KAAAA,IAAAA,2BAAAA,IAAAA,CAAAA,OAA4BA,MAAAA,GAAQ;QAC7D,OAAA,WAAA,GAAOF,OAAAO,aAAA,CAACK,sCAAAA,EAAuBV;IACjC;IAEA,OAAA,WAAA,GAAOF,OAAAO,aAAA,CAACM,uBAAAA,EAAAA;QAAQ,GAAIX,KAAK;QAAwC,GAAGE,SAAS;;AAC/E"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Button/CompoundButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { CompoundButton } from '@fluentui/react-components';\nimport type { CompoundButtonProps } from '@fluentui/react-components';\n\nimport { shimButtonProps } from './shimButtonProps';\n\n/**\n * Shims v8 CompoundButton to render a v9 CompoundButton\n */\nexport const CompoundButtonShim: React.ForwardRefExoticComponent<\n IButtonProps
|
|
1
|
+
{"version":3,"sources":["../src/components/Button/CompoundButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { CompoundButton } from '@fluentui/react-components';\nimport type { CompoundButtonProps } from '@fluentui/react-components';\nimport type { RefAttributes } from '@fluentui/react-utilities';\n\nimport { shimButtonProps } from './shimButtonProps';\n\n/**\n * Shims v8 CompoundButton to render a v9 CompoundButton\n */\nexport const CompoundButtonShim: React.ForwardRefExoticComponent<\n IButtonProps &\n // eslint-disable-next-line @typescript-eslint/no-restricted-types -- this is expected in order to be compatible with v8, as every v8 interface contains `React.RefAttributes` to accept ref as string\n React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n const variantProps = {\n ...props,\n variantClassName: props.primary ? 'ms-Button--compoundPrimary' : 'ms-Button--compound',\n };\n\n const shimProps: CompoundButtonProps = {\n ...shimButtonProps(variantProps),\n secondaryContent: props.secondaryText || props.onRenderDescription?.(props),\n };\n\n return <CompoundButton {...(props as RefAttributes<HTMLButtonElement>)} {...shimProps} />;\n});\n"],"names":["CompoundButtonShim","React","forwardRef","props","_ref","variantProps","variantClassName","primary","shimProps","shimButtonProps","secondaryContent","secondaryText","onRenderDescription","createElement","CompoundButton"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAaaA;;;eAAAA;;;;iEAbU;iCAIQ;iCAIC;AAKzB,MAAMA,qBAAAA,WAAAA,GAITC,OAAMC,UAAU,CAAC,CAACC,OAAOC;QAQgBD;IAP3C,MAAME,eAAe;QACnB,GAAGF,KAAK;QACRG,kBAAkBH,MAAMI,OAAO,GAAG,+BAA+B;IACnE;IAEA,MAAMC,YAAiC;QACrC,GAAGC,IAAAA,gCAAAA,EAAgBJ,aAAa;QAChCK,kBAAkBP,MAAMQ,aAAa,IAAA,CAAA,AAAIR,CAAAA,6BAAAA,MAAMS,mBAAmB,AAAnBA,MAAmB,QAAzBT,+BAAAA,KAAAA,IAAAA,KAAAA,IAAAA,2BAAAA,IAAAA,CAAAA,OAA4BA,MAAAA;IACvE;IAEA,OAAA,WAAA,GAAOF,OAAAY,aAAA,CAACC,+BAAAA,EAAAA;QAAgB,GAAIX,KAAK;QAAwC,GAAGK,SAAS;;AACvF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Button/DefaultButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { ButtonShim } from './ButtonShim';\n\n/**\n * Shims a v8 DefaultButton to render a v9 Button\n */\nexport const DefaultButtonShim: React.ForwardRefExoticComponent
|
|
1
|
+
{"version":3,"sources":["../src/components/Button/DefaultButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { ButtonShim } from './ButtonShim';\n\n/**\n * Shims a v8 DefaultButton to render a v9 Button\n */\nexport const DefaultButtonShim: React.ForwardRefExoticComponent<\n IButtonProps &\n // eslint-disable-next-line @typescript-eslint/no-restricted-types -- this is expected in order to be compatible with v8, as every v8 interface contains `React.RefAttributes` to accept ref as string\n React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n return <ButtonShim {...props} variantClassName={props.primary ? 'ms-Button--primary' : 'ms-Button--default'} />;\n});\n"],"names":["DefaultButtonShim","React","forwardRef","props","_ref","createElement","ButtonShim","variantClassName","primary"],"rangeMappings":";;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;;iEATU;4BAII;AAKpB,MAAMA,oBAAAA,WAAAA,GAITC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC3B,OAAA,WAAA,GAAOH,OAAAI,aAAA,CAACC,sBAAAA,EAAAA;QAAY,GAAGH,KAAK;QAAEI,kBAAkBJ,MAAMK,OAAO,GAAG,uBAAuB;;AACzF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Button/MenuButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\nimport { MenuButton, Menu, MenuList, MenuPopover, MenuTrigger } from '@fluentui/react-components';\nimport type { MenuButtonProps } from '@fluentui/react-components';\nimport { MenuItemShim, shimMenuProps } from '../Menu/index';\n\nimport { shimButtonProps } from './shimButtonProps';\n\nexport const MenuButtonShim: React.ForwardRefExoticComponent
|
|
1
|
+
{"version":3,"sources":["../src/components/Button/MenuButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\nimport { MenuButton, Menu, MenuList, MenuPopover, MenuTrigger } from '@fluentui/react-components';\nimport type { MenuButtonProps } from '@fluentui/react-components';\nimport { MenuItemShim, shimMenuProps } from '../Menu/index';\n\nimport { shimButtonProps } from './shimButtonProps';\n\nexport const MenuButtonShim: React.ForwardRefExoticComponent<\n IButtonProps &\n // eslint-disable-next-line @typescript-eslint/no-restricted-types -- this is expected in order to be compatible with v8, as every v8 interface contains `React.RefAttributes` to accept ref as string\n React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n const variantProps = {\n ...props,\n variantClassName: props.primary ? 'ms-Button--primary' : 'ms-Button--default',\n };\n\n const shimProps: MenuButtonProps = {\n ...shimButtonProps(variantProps),\n };\n\n const shimmedMenuProps = props.menuProps ? shimMenuProps(props.menuProps) : {};\n\n return (\n <Menu {...shimmedMenuProps}>\n <MenuTrigger>\n <MenuButton {...shimProps} />\n </MenuTrigger>\n <MenuPopover>\n <MenuList>\n {props.menuProps?.items.map(item => (\n // key is added through item spread\n // eslint-disable-next-line react/jsx-key\n <MenuItemShim {...item} />\n ))}\n </MenuList>\n </MenuPopover>\n </Menu>\n );\n});\n"],"names":["MenuButtonShim","React","forwardRef","props","_ref","variantProps","variantClassName","primary","shimProps","shimButtonProps","shimmedMenuProps","menuProps","shimMenuProps","createElement","Menu","MenuTrigger","MenuButton","MenuPopover","MenuList","items","map","item","MenuItemShim"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;;iEATU;iCAG8C;uBAEzB;iCAEZ;AAEzB,MAAMA,iBAAAA,WAAAA,GAITC,OAAMC,UAAU,CAAC,CAACC,OAAOC;QAmBlBD;IAlBT,MAAME,eAAe;QACnB,GAAGF,KAAK;QACRG,kBAAkBH,MAAMI,OAAO,GAAG,uBAAuB;IAC3D;IAEA,MAAMC,YAA6B;QACjC,GAAGC,IAAAA,gCAAAA,EAAgBJ,aAAa;IAClC;IAEA,MAAMK,mBAAmBP,MAAMQ,SAAS,GAAGC,IAAAA,oBAAAA,EAAcT,MAAMQ,SAAS,IAAI,CAAC;IAE7E,OAAA,WAAA,GACEV,OAAAY,aAAA,CAACC,qBAAAA,EAASJ,kBAAAA,WAAAA,GACRT,OAAAY,aAAA,CAACE,4BAAAA,EAAAA,MAAAA,WAAAA,GACCd,OAAAY,aAAA,CAACG,2BAAAA,EAAeR,aAAAA,WAAAA,GAElBP,OAAAY,aAAA,CAACI,4BAAAA,EAAAA,MAAAA,WAAAA,GACChB,OAAAY,aAAA,CAACK,yBAAAA,EAAAA,MAAAA,AACEf,CAAAA,mBAAAA,MAAMQ,SAAS,AAATA,MAAS,QAAfR,qBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,iBAAiBgB,KAAK,CAACC,GAAG,CAACC,CAAAA,OAE1B,yCAAyC;sBACzCpB,OAAAY,aAAA,CAACS,mBAAAA,EAAiBD;AAM9B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Button/PrimaryButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\nimport { ButtonShim } from './ButtonShim';\n\n/**\n * Shims v8 PrimaryButton to render a v9 Button\n */\nexport const PrimaryButtonShim: React.ForwardRefExoticComponent
|
|
1
|
+
{"version":3,"sources":["../src/components/Button/PrimaryButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\nimport { ButtonShim } from './ButtonShim';\n\n/**\n * Shims v8 PrimaryButton to render a v9 Button\n */\nexport const PrimaryButtonShim: React.ForwardRefExoticComponent<\n IButtonProps &\n // eslint-disable-next-line @typescript-eslint/no-restricted-types -- this is expected in order to be compatible with v8, as every v8 interface contains `React.RefAttributes` to accept ref as string\n React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n return <ButtonShim {...props} primary variantClassName=\"ms-Button--primary\" />;\n});\n"],"names":["PrimaryButtonShim","React","forwardRef","props","_ref","createElement","ButtonShim","primary","variantClassName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAQaA;;;eAAAA;;;;iEARU;4BAGI;AAKpB,MAAMA,oBAAAA,WAAAA,GAITC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC3B,OAAA,WAAA,GAAOH,OAAAI,aAAA,CAACC,sBAAAA,EAAAA;QAAY,GAAGH,KAAK;QAAEI,SAAAA;QAAQC,kBAAiB;;AACzD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Button/ToggleButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { ToggleButton } from '@fluentui/react-components';\nimport type { ToggleButtonProps } from '@fluentui/react-components';\n\nimport { shimButtonProps } from './shimButtonProps';\n\n/**\n * Shims v8 ToggleButton to render a v9 ToggleButton\n */\nexport const ToggleButtonShim: React.ForwardRefExoticComponent
|
|
1
|
+
{"version":3,"sources":["../src/components/Button/ToggleButtonShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { ToggleButton } from '@fluentui/react-components';\nimport type { ToggleButtonProps } from '@fluentui/react-components';\nimport type { RefAttributes } from '@fluentui/react-utilities';\n\nimport { shimButtonProps } from './shimButtonProps';\n\n/**\n * Shims v8 ToggleButton to render a v9 ToggleButton\n */\nexport const ToggleButtonShim: React.ForwardRefExoticComponent<\n IButtonProps &\n // eslint-disable-next-line @typescript-eslint/no-restricted-types -- this is expected in order to be compatible with v8, as every v8 interface contains `React.RefAttributes` to accept ref as string\n React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n const variantProps = {\n ...props,\n variantClassName: props.primary ? 'ms-Button--compoundPrimary' : 'ms-Button--compound',\n };\n\n const shimProps: ToggleButtonProps = {\n ...shimButtonProps(variantProps),\n checked: props.checked,\n defaultChecked: props.defaultChecked,\n };\n\n return <ToggleButton {...(props as RefAttributes<HTMLButtonElement>)} {...shimProps} />;\n});\n"],"names":["ToggleButtonShim","React","forwardRef","props","_ref","variantProps","variantClassName","primary","shimProps","shimButtonProps","checked","defaultChecked","createElement","ToggleButton"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAaaA;;;eAAAA;;;;iEAbU;iCAIM;iCAIG;AAKzB,MAAMA,mBAAAA,WAAAA,GAITC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC3B,MAAMC,eAAe;QACnB,GAAGF,KAAK;QACRG,kBAAkBH,MAAMI,OAAO,GAAG,+BAA+B;IACnE;IAEA,MAAMC,YAA+B;QACnC,GAAGC,IAAAA,gCAAAA,EAAgBJ,aAAa;QAChCK,SAASP,MAAMO,OAAO;QACtBC,gBAAgBR,MAAMQ,cAAc;IACtC;IAEA,OAAA,WAAA,GAAOV,OAAAW,aAAA,CAACC,6BAAAA,EAAAA;QAAc,GAAIV,KAAK;QAAwC,GAAGK,SAAS;;AACrF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Button/shimButtonProps.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Icon } from '@fluentui/react';\nimport type { IBaseButtonProps } from '@fluentui/react';\n\nimport type { ButtonProps } from '@fluentui/react-components';\n\nexport const shimButtonProps = (props: IBaseButtonProps
|
|
1
|
+
{"version":3,"sources":["../src/components/Button/shimButtonProps.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Icon } from '@fluentui/react';\nimport type { IBaseButtonProps } from '@fluentui/react';\n\nimport type { ButtonProps } from '@fluentui/react-components';\n\nexport const shimButtonProps = (\n props: IBaseButtonProps &\n // eslint-disable-next-line @typescript-eslint/no-restricted-types -- this is expected in order to be compatible with v8, as every v8 interface contains `React.RefAttributes` to accept ref as string\n React.RefAttributes<HTMLButtonElement>,\n): ButtonProps => {\n //TODO: Icon shim. This still renders the v8 icon.\n const icon = props.onRenderIcon ? (\n props.onRenderIcon(props)\n ) : props.iconProps ? (\n <Icon {...props.iconProps} />\n ) : undefined;\n\n const variantClassName = props.variantClassName ?? props.primary ? 'ms-Button--primary' : 'ms-Button--default';\n const className = [props.baseClassName, variantClassName, props.className].filter(Boolean).join(' ');\n\n return {\n // spread incoming props to propagate HTML properties not part of IBaseButtonProps\n ...props,\n appearance: props.primary ? 'primary' : undefined,\n className,\n disabled: props.disabled,\n disabledFocusable: props.allowDisabledFocus,\n 'aria-hidden': props.ariaHidden,\n 'aria-label': props.ariaLabel,\n icon,\n key: props.key || props.uniqueId,\n children: props.onRenderChildren\n ? props.onRenderChildren(props)\n : props.onRenderText\n ? props.onRenderText(props)\n : props.text || props.children,\n } as ButtonProps;\n};\n"],"names":["shimButtonProps","props","icon","onRenderIcon","iconProps","React","createElement","Icon","undefined","variantClassName","primary","className","baseClassName","filter","Boolean","join","appearance","disabled","disabledFocusable","allowDisabledFocus","ariaHidden","ariaLabel","key","uniqueId","children","onRenderChildren","onRenderText","text"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAOaA;;;eAAAA;;;;iEAPU;wBAEF;AAKd,MAAMA,kBAAkB,CAC7BC;IAIA,kDAAkD;IAClD,MAAMC,OAAOD,MAAME,YAAY,GAC7BF,MAAME,YAAY,CAACF,SACjBA,MAAMG,SAAS,GAAA,WAAA,GACjBC,OAAAC,aAAA,CAACC,YAAAA,EAASN,MAAMG,SAAS,IACvBI;QAEqBP;IAAzB,MAAMQ,mBAAmBR,CAAAA,CAAAA,0BAAAA,MAAMQ,gBAAgB,AAAhBA,MAAgB,QAAtBR,4BAAAA,KAAAA,IAAAA,0BAA0BA,MAAMS,OAAO,AAAPA,IAAU,uBAAuB;IAC1F,MAAMC,YAAY;QAACV,MAAMW,aAAa;QAAEH;QAAkBR,MAAMU,SAAS;KAAC,CAACE,MAAM,CAACC,SAASC,IAAI,CAAC;IAEhG,OAAO;QACL,kFAAkF;QAClF,GAAGd,KAAK;QACRe,YAAYf,MAAMS,OAAO,GAAG,YAAYF;QACxCG;QACAM,UAAUhB,MAAMgB,QAAQ;QACxBC,mBAAmBjB,MAAMkB,kBAAkB;QAC3C,eAAelB,MAAMmB,UAAU;QAC/B,cAAcnB,MAAMoB,SAAS;QAC7BnB;QACAoB,KAAKrB,MAAMqB,GAAG,IAAIrB,MAAMsB,QAAQ;QAChCC,UAAUvB,MAAMwB,gBAAgB,GAC5BxB,MAAMwB,gBAAgB,CAACxB,SACvBA,MAAMyB,YAAY,GAClBzB,MAAMyB,YAAY,CAACzB,SACnBA,MAAM0B,IAAI,IAAI1B,MAAMuB,QAAQ;IAClC;AACF"}
|
|
@@ -60,5 +60,6 @@ const CheckboxShim = /*#__PURE__*/ _react.forwardRef((props, _ref)=>{
|
|
|
60
60
|
className: (0, _reactcomponents.mergeClasses)('ms-Checkbox-checkbox', styles.checkbox)
|
|
61
61
|
}
|
|
62
62
|
});
|
|
63
|
+
// NOTE: cast is necessary as `ICheckboxProps` extends React.Ref<HTMLDivElement> which is not compatible with our defined React.Ref<HTMLInputElement>
|
|
63
64
|
});
|
|
64
65
|
CheckboxShim.displayName = 'CheckboxShim';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Checkbox/CheckboxShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { classNamesFunction, ICheckboxProps, ICheckboxStyles, ICheckboxStyleProps } from '@fluentui/react';\nimport { Checkbox, mergeClasses } from '@fluentui/react-components';\nimport { useCheckboxProps } from './shimCheckboxProps';\nimport { useCheckboxStyles } from './Checkbox.styles';\n\nconst getClassNames = classNamesFunction<ICheckboxStyleProps, ICheckboxStyles>({\n useStaticStyles: false,\n});\n\nexport const CheckboxShim = React.forwardRef((props
|
|
1
|
+
{"version":3,"sources":["../src/components/Checkbox/CheckboxShim.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { classNamesFunction, ICheckboxProps, ICheckboxStyles, ICheckboxStyleProps } from '@fluentui/react';\nimport { Checkbox, mergeClasses } from '@fluentui/react-components';\nimport { useCheckboxProps } from './shimCheckboxProps';\nimport { useCheckboxStyles } from './Checkbox.styles';\n\nconst getClassNames = classNamesFunction<ICheckboxStyleProps, ICheckboxStyles>({\n useStaticStyles: false,\n});\n\nexport const CheckboxShim = React.forwardRef((props, _ref) => {\n 'use no memo';\n\n const { className, styles: stylesV8, onRenderLabel, label, componentRef } = props;\n const shimProps = useCheckboxProps(props);\n const styles = getClassNames(stylesV8);\n const stylesV9 = useCheckboxStyles();\n const checkboxRef = (_ref as React.RefObject<HTMLInputElement>) || React.createRef<HTMLInputElement>();\n\n React.useImperativeHandle(componentRef, () => ({\n checked: checkboxRef.current?.checked ?? false,\n indeterminate: checkboxRef.current?.indeterminate ?? false,\n focus: () => checkboxRef.current?.focus(),\n }));\n\n const defaultLabelRenderer = (checkboxProps?: ICheckboxProps): JSX.Element | null => {\n if (!checkboxProps) {\n return null;\n }\n const { label: defaultLabel, title } = checkboxProps;\n return defaultLabel ? (\n <span title={title} className={styles.text}>\n {defaultLabel}\n </span>\n ) : null;\n };\n\n if (label || onRenderLabel) {\n shimProps.label = {\n className: mergeClasses('ms-Checkbox-text', styles.label, styles.text),\n children: onRenderLabel ? onRenderLabel(props, defaultLabelRenderer) : label,\n };\n }\n\n return (\n <Checkbox\n {...shimProps}\n ref={checkboxRef}\n className={mergeClasses(stylesV9.root, 'ms-Checkbox', className, styles.root)}\n indicator={{ className: mergeClasses('ms-Checkbox-checkbox', styles.checkbox) }}\n />\n );\n // NOTE: cast is necessary as `ICheckboxProps` extends React.Ref<HTMLDivElement> which is not compatible with our defined React.Ref<HTMLInputElement>\n}) as React.ForwardRefExoticComponent<\n ICheckboxProps &\n // eslint-disable-next-line @typescript-eslint/no-restricted-types -- this is expected in order to be compatible with v8, as every v8 interface contains `React.RefAttributes` to accept ref as string\n React.RefAttributes<HTMLInputElement>\n>;\n\nCheckboxShim.displayName = 'CheckboxShim';\n"],"names":["CheckboxShim","getClassNames","classNamesFunction","useStaticStyles","React","forwardRef","props","_ref","className","styles","stylesV8","onRenderLabel","label","componentRef","shimProps","useCheckboxProps","stylesV9","useCheckboxStyles","checkboxRef","createRef","useImperativeHandle","checked","current","indeterminate","focus","defaultLabelRenderer","checkboxProps","defaultLabel","title","createElement","span","text","mergeClasses","children","Checkbox","ref","root","indicator","checkbox","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAWaA;;;eAAAA;;;;iEAXU;wBAEkE;iCAClD;mCACN;gCACC;AAElC,MAAMC,gBAAgBC,IAAAA,0BAAAA,EAAyD;IAC7EC,iBAAiB;AACnB;AAEO,MAAMH,eAAAA,WAAAA,GAAeI,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACnD;IAEA,MAAM,EAAEC,SAAS,EAAEC,QAAQC,QAAQ,EAAEC,aAAa,EAAEC,KAAK,EAAEC,YAAY,EAAE,GAAGP;IAC5E,MAAMQ,YAAYC,IAAAA,mCAAAA,EAAiBT;IACnC,MAAMG,SAASR,cAAcS;IAC7B,MAAMM,WAAWC,IAAAA,iCAAAA;IACjB,MAAMC,cAAcX,QAACA,WAAAA,GAA8CH,OAAMe,SAAS;IAElFf,OAAMgB,mBAAmB,CAACP,cAAc;YAC7BK,sBACMA;YADNA,8BACMA;eAF8B;YAC7CG,SAASH,CAAAA,+BAAAA,CAAAA,uBAAAA,YAAYI,OAAO,AAAPA,MAAO,QAAnBJ,yBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,qBAAqBG,OAAO,AAAPA,MAAO,QAA5BH,iCAAAA,KAAAA,IAAAA,+BAAgC;YACzCK,eAAeL,CAAAA,qCAAAA,CAAAA,wBAAAA,YAAYI,OAAO,AAAPA,MAAO,QAAnBJ,0BAAAA,KAAAA,IAAAA,KAAAA,IAAAA,sBAAqBK,aAAa,AAAbA,MAAa,QAAlCL,uCAAAA,KAAAA,IAAAA,qCAAsC;YACrDM,OAAO;oBAAMN;uBAAAA,CAAAA,uBAAAA,YAAYI,OAAO,AAAPA,MAAO,QAAnBJ,yBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,qBAAqBM,KAAK;;QACzC;IAAA;IAEA,MAAMC,uBAAuB,CAACC;QAC5B,IAAI,CAACA,eAAe;YAClB,OAAO;QACT;QACA,MAAM,EAAEd,OAAOe,YAAY,EAAEC,KAAK,EAAE,GAAGF;QACvC,OAAOC,eAAAA,WAAAA,GACLvB,OAAAyB,aAAA,CAACC,QAAAA;YAAKF,OAAOA;YAAOpB,WAAWC,OAAOsB,IAAI;WACvCJ,gBAED;IACN;IAEA,IAAIf,SAASD,eAAe;QAC1BG,UAAUF,KAAK,GAAG;YAChBJ,WAAWwB,IAAAA,6BAAAA,EAAa,oBAAoBvB,OAAOG,KAAK,EAAEH,OAAOsB,IAAI;YACrEE,UAAUtB,gBAAgBA,cAAcL,OAAOmB,wBAAwBb;QACzE;IACF;IAEA,OAAA,WAAA,GACER,OAAAyB,aAAA,CAACK,yBAAAA,EAAAA;QACE,GAAGpB,SAAS;QACbqB,KAAKjB;QACLV,WAAWwB,IAAAA,6BAAAA,EAAahB,SAASoB,IAAI,EAAE,eAAe5B,WAAWC,OAAO2B,IAAI;QAC5EC,WAAW;YAAE7B,WAAWwB,IAAAA,6BAAAA,EAAa,wBAAwBvB,OAAO6B,QAAQ;QAAE;;AAGlF,sJAAsJ;AACxJ;AAMAtC,aAAauC,WAAW,GAAG"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-migration-v8-v9",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.8.0",
|
|
4
4
|
"description": "Migration shim components and methods for hybrid v8/v9 applications building on Fluent UI React.",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
"@ctrl/tinycolor": "^3.3.4",
|
|
22
22
|
"@fluentui/fluent2-theme": "^8.107.137",
|
|
23
23
|
"@fluentui/react": "^8.123.0",
|
|
24
|
-
"@fluentui/react-components": "^9.
|
|
24
|
+
"@fluentui/react-components": "^9.66.0",
|
|
25
25
|
"@fluentui/react-icons": "^2.0.245",
|
|
26
26
|
"@fluentui/react-hooks": "^8.8.19",
|
|
27
27
|
"@griffel/react": "^1.5.22",
|