From d340ff4b1c3aa7e1818780ec4d41f46c86e451c9 Mon Sep 17 00:00:00 2001 From: Bernardo Sunderhus Date: Tue, 18 Apr 2023 19:37:51 +0200 Subject: [PATCH] chore(react-avatar): adopt custom JSX pragma (#27602) --- ...ct-avatar-1b5a14f1-cef4-4396-b5a4-264bc60ee7c7.json | 7 +++++++ packages/react-components/react-avatar/package.json | 1 + .../src/components/Avatar/renderAvatar.tsx | 10 +++++++--- .../src/components/AvatarGroup/renderAvatarGroup.tsx | 10 +++++++--- .../AvatarGroupItem/renderAvatarGroupItem.tsx | 10 +++++++--- .../AvatarGroupPopover/renderAvatarGroupPopover.tsx | 10 +++++++--- 6 files changed, 36 insertions(+), 12 deletions(-) create mode 100644 change/@fluentui-react-avatar-1b5a14f1-cef4-4396-b5a4-264bc60ee7c7.json diff --git a/change/@fluentui-react-avatar-1b5a14f1-cef4-4396-b5a4-264bc60ee7c7.json b/change/@fluentui-react-avatar-1b5a14f1-cef4-4396-b5a4-264bc60ee7c7.json new file mode 100644 index 0000000000000..e82199c55ee43 --- /dev/null +++ b/change/@fluentui-react-avatar-1b5a14f1-cef4-4396-b5a4-264bc60ee7c7.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "chore: adopt custom JSX pragma", + "packageName": "@fluentui/react-avatar", + "email": "bernardo.sunderhus@gmail.com", + "dependentChangeType": "patch" +} diff --git a/packages/react-components/react-avatar/package.json b/packages/react-components/react-avatar/package.json index 7adcb0d62c46e..2a2c3c9f2603f 100644 --- a/packages/react-components/react-avatar/package.json +++ b/packages/react-components/react-avatar/package.json @@ -45,6 +45,7 @@ "@fluentui/react-theme": "^9.1.7", "@fluentui/react-tooltip": "^9.2.9", "@fluentui/react-utilities": "^9.8.0", + "@fluentui/react-jsx-runtime": "9.0.0-alpha.1", "@griffel/react": "^1.5.2", "@swc/helpers": "^0.4.14" }, diff --git a/packages/react-components/react-avatar/src/components/Avatar/renderAvatar.tsx b/packages/react-components/react-avatar/src/components/Avatar/renderAvatar.tsx index 1a68971339b9b..203a126982e16 100644 --- a/packages/react-components/react-avatar/src/components/Avatar/renderAvatar.tsx +++ b/packages/react-components/react-avatar/src/components/Avatar/renderAvatar.tsx @@ -1,9 +1,13 @@ -import * as React from 'react'; -import { getSlots } from '@fluentui/react-utilities'; +/** @jsxRuntime classic */ +/** @jsx createElement */ + +import { createElement } from '@fluentui/react-jsx-runtime'; + +import { getSlotsNext } from '@fluentui/react-utilities'; import type { AvatarSlots, AvatarState } from './Avatar.types'; export const renderAvatar_unstable = (state: AvatarState) => { - const { slots, slotProps } = getSlots(state); + const { slots, slotProps } = getSlotsNext(state); return ( diff --git a/packages/react-components/react-avatar/src/components/AvatarGroup/renderAvatarGroup.tsx b/packages/react-components/react-avatar/src/components/AvatarGroup/renderAvatarGroup.tsx index 991278293efce..c5937f7e5c7db 100644 --- a/packages/react-components/react-avatar/src/components/AvatarGroup/renderAvatarGroup.tsx +++ b/packages/react-components/react-avatar/src/components/AvatarGroup/renderAvatarGroup.tsx @@ -1,5 +1,9 @@ -import * as React from 'react'; -import { getSlots } from '@fluentui/react-utilities'; +/** @jsxRuntime classic */ +/** @jsx createElement */ + +import { createElement } from '@fluentui/react-jsx-runtime'; + +import { getSlotsNext } from '@fluentui/react-utilities'; import { AvatarGroupProvider } from '../../contexts/AvatarGroupContext'; import type { AvatarGroupState, AvatarGroupSlots, AvatarGroupContextValues } from './AvatarGroup.types'; @@ -7,7 +11,7 @@ import type { AvatarGroupState, AvatarGroupSlots, AvatarGroupContextValues } fro * Render the final JSX of AvatarGroup */ export const renderAvatarGroup_unstable = (state: AvatarGroupState, contextValues: AvatarGroupContextValues) => { - const { slots, slotProps } = getSlots(state); + const { slots, slotProps } = getSlotsNext(state); return ( diff --git a/packages/react-components/react-avatar/src/components/AvatarGroupItem/renderAvatarGroupItem.tsx b/packages/react-components/react-avatar/src/components/AvatarGroupItem/renderAvatarGroupItem.tsx index 6b8fac77d0ae9..fe27c39ad144b 100644 --- a/packages/react-components/react-avatar/src/components/AvatarGroupItem/renderAvatarGroupItem.tsx +++ b/packages/react-components/react-avatar/src/components/AvatarGroupItem/renderAvatarGroupItem.tsx @@ -1,12 +1,16 @@ -import * as React from 'react'; -import { getSlots } from '@fluentui/react-utilities'; +/** @jsxRuntime classic */ +/** @jsx createElement */ + +import { createElement } from '@fluentui/react-jsx-runtime'; + +import { getSlotsNext } from '@fluentui/react-utilities'; import type { AvatarGroupItemState, AvatarGroupItemSlots } from './AvatarGroupItem.types'; /** * Render the final JSX of AvatarGroupItem */ export const renderAvatarGroupItem_unstable = (state: AvatarGroupItemState) => { - const { slots, slotProps } = getSlots(state); + const { slots, slotProps } = getSlotsNext(state); return ( diff --git a/packages/react-components/react-avatar/src/components/AvatarGroupPopover/renderAvatarGroupPopover.tsx b/packages/react-components/react-avatar/src/components/AvatarGroupPopover/renderAvatarGroupPopover.tsx index 3cc5008e14d8e..4d14b7aa16133 100644 --- a/packages/react-components/react-avatar/src/components/AvatarGroupPopover/renderAvatarGroupPopover.tsx +++ b/packages/react-components/react-avatar/src/components/AvatarGroupPopover/renderAvatarGroupPopover.tsx @@ -1,7 +1,11 @@ -import * as React from 'react'; +/** @jsxRuntime classic */ +/** @jsx createElement */ + +import { createElement } from '@fluentui/react-jsx-runtime'; import { AvatarGroupProvider } from '../../contexts/AvatarGroupContext'; import { AvatarGroupContextValues } from '../AvatarGroup/AvatarGroup.types'; -import { getSlots } from '@fluentui/react-utilities'; + +import { getSlotsNext } from '@fluentui/react-utilities'; import { PopoverProps, PopoverTrigger } from '@fluentui/react-popover'; import { TooltipProps } from '@fluentui/react-tooltip'; import type { AvatarGroupPopoverState, AvatarGroupPopoverSlots } from './AvatarGroupPopover.types'; @@ -13,7 +17,7 @@ export const renderAvatarGroupPopover_unstable = ( state: AvatarGroupPopoverState, contextValues: AvatarGroupContextValues, ) => { - const { slots, slotProps } = getSlots(state); + const { slots, slotProps } = getSlotsNext(state); return (