From 6376fb5cb0f21a99e11ee008c09b316d8dda2338 Mon Sep 17 00:00:00 2001 From: Bernardo Sunderhus Date: Fri, 14 Apr 2023 09:11:45 +0000 Subject: [PATCH] chore: adopt custom jsx pragma --- ...act-tree-4dc34ddd-5922-4835-8c43-5a96d8cb1a1e.json | 7 +++++++ packages/react-components/react-tree/package.json | 1 + .../react-tree/src/components/Tree/renderTree.tsx | 11 ++++++++--- .../src/components/TreeItem/renderTreeItem.tsx | 11 ++++++++--- .../TreeItemLayout/renderTreeItemLayout.tsx | 11 ++++++++--- .../renderTreeItemPersonaLayout.tsx | 11 ++++++++--- 6 files changed, 40 insertions(+), 12 deletions(-) create mode 100644 change/@fluentui-react-tree-4dc34ddd-5922-4835-8c43-5a96d8cb1a1e.json diff --git a/change/@fluentui-react-tree-4dc34ddd-5922-4835-8c43-5a96d8cb1a1e.json b/change/@fluentui-react-tree-4dc34ddd-5922-4835-8c43-5a96d8cb1a1e.json new file mode 100644 index 00000000000000..5b469de2550622 --- /dev/null +++ b/change/@fluentui-react-tree-4dc34ddd-5922-4835-8c43-5a96d8cb1a1e.json @@ -0,0 +1,7 @@ +{ + "type": "prerelease", + "comment": "chore: adopt custom jsx pragma", + "packageName": "@fluentui/react-tree", + "email": "bernardo.sunderhus@gmail.com", + "dependentChangeType": "patch" +} diff --git a/packages/react-components/react-tree/package.json b/packages/react-components/react-tree/package.json index 50cd8838b7ae12..9abf3c95c63c1d 100644 --- a/packages/react-components/react-tree/package.json +++ b/packages/react-components/react-tree/package.json @@ -46,6 +46,7 @@ "@fluentui/react-tabster": "^9.6.4", "@fluentui/react-theme": "^9.1.7", "@fluentui/react-utilities": "^9.7.4", + "@fluentui/react-jsx-runtime": "^9.0.0-alpha.0", "@griffel/react": "^1.5.2", "@swc/helpers": "^0.4.14" }, diff --git a/packages/react-components/react-tree/src/components/Tree/renderTree.tsx b/packages/react-components/react-tree/src/components/Tree/renderTree.tsx index 2131a034f19408..68a2b3760cfba8 100644 --- a/packages/react-components/react-tree/src/components/Tree/renderTree.tsx +++ b/packages/react-components/react-tree/src/components/Tree/renderTree.tsx @@ -1,10 +1,15 @@ -import * as React from 'react'; -import { getSlots } from '@fluentui/react-utilities'; +/* eslint-disable jsdoc/check-tag-names */ +/** @jsxRuntime classic */ +/** @jsx createElement */ +/* eslint-enable jsdoc/check-tag-names */ + +import { createElement } from '@fluentui/react-jsx-runtime'; +import { getSlotsNext } from '@fluentui/react-utilities'; import type { TreeState, TreeSlots, TreeContextValues } from './Tree.types'; import { TreeProvider } from '../../contexts'; export const renderTree_unstable = (state: TreeState, contextValues: TreeContextValues) => { - const { slots, slotProps } = getSlots(state); + const { slots, slotProps } = getSlotsNext(state); return ( diff --git a/packages/react-components/react-tree/src/components/TreeItem/renderTreeItem.tsx b/packages/react-components/react-tree/src/components/TreeItem/renderTreeItem.tsx index 662090f55e50c4..b8ffcda3d445ed 100644 --- a/packages/react-components/react-tree/src/components/TreeItem/renderTreeItem.tsx +++ b/packages/react-components/react-tree/src/components/TreeItem/renderTreeItem.tsx @@ -1,5 +1,10 @@ -import * as React from 'react'; -import { getSlots } from '@fluentui/react-utilities'; +/* eslint-disable jsdoc/check-tag-names */ +/** @jsxRuntime classic */ +/** @jsx createElement */ +/* eslint-enable jsdoc/check-tag-names */ + +import { createElement } from '@fluentui/react-jsx-runtime'; +import { getSlotsNext } from '@fluentui/react-utilities'; import type { TreeItemState, TreeItemSlots, TreeItemContextValues } from './TreeItem.types'; import { TreeItemProvider } from '../../contexts'; import { ButtonContextProvider } from '@fluentui/react-button'; @@ -8,7 +13,7 @@ import { ButtonContextProvider } from '@fluentui/react-button'; * Render the final JSX of TreeItem */ export const renderTreeItem_unstable = (state: TreeItemState, contextValues: TreeItemContextValues) => { - const { slots, slotProps } = getSlots(state); + const { slots, slotProps } = getSlotsNext(state); return ( diff --git a/packages/react-components/react-tree/src/components/TreeItemLayout/renderTreeItemLayout.tsx b/packages/react-components/react-tree/src/components/TreeItemLayout/renderTreeItemLayout.tsx index 366105bd655822..bb99fa1d526e48 100644 --- a/packages/react-components/react-tree/src/components/TreeItemLayout/renderTreeItemLayout.tsx +++ b/packages/react-components/react-tree/src/components/TreeItemLayout/renderTreeItemLayout.tsx @@ -1,5 +1,10 @@ -import * as React from 'react'; -import { getSlots } from '@fluentui/react-utilities'; +/* eslint-disable jsdoc/check-tag-names */ +/** @jsxRuntime classic */ +/** @jsx createElement */ +/* eslint-enable jsdoc/check-tag-names */ + +import { createElement } from '@fluentui/react-jsx-runtime'; +import { getSlotsNext } from '@fluentui/react-utilities'; import type { TreeItemLayoutState, TreeItemLayoutSlots } from './TreeItemLayout.types'; /** @@ -7,7 +12,7 @@ import type { TreeItemLayoutState, TreeItemLayoutSlots } from './TreeItemLayout. */ export const renderTreeItemLayout_unstable = (state: TreeItemLayoutState) => { const { isActionsVisible } = state; - const { slots, slotProps } = getSlots(state); + const { slots, slotProps } = getSlotsNext(state); return ( {slots.iconBefore && } diff --git a/packages/react-components/react-tree/src/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.tsx b/packages/react-components/react-tree/src/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.tsx index f83cecf5a8a4b8..74afb326b8b33e 100644 --- a/packages/react-components/react-tree/src/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.tsx +++ b/packages/react-components/react-tree/src/components/TreeItemPersonaLayout/renderTreeItemPersonaLayout.tsx @@ -1,5 +1,10 @@ -import * as React from 'react'; -import { getSlots } from '@fluentui/react-utilities'; +/* eslint-disable jsdoc/check-tag-names */ +/** @jsxRuntime classic */ +/** @jsx createElement */ +/* eslint-enable jsdoc/check-tag-names */ + +import { createElement } from '@fluentui/react-jsx-runtime'; +import { getSlotsNext } from '@fluentui/react-utilities'; import type { TreeItemPersonaLayoutState, TreeItemPersonaLayoutSlots, @@ -15,7 +20,7 @@ export const renderTreeItemPersonaLayout_unstable = ( contextValues: TreeItemPersonaLayoutContextValues, ) => { const { isActionsVisible } = state; - const { slots, slotProps } = getSlots(state); + const { slots, slotProps } = getSlotsNext(state); return (