From 64c7170c98842d97e662db296ac4824f51b1e2ac Mon Sep 17 00:00:00 2001 From: Ben Howell Date: Mon, 10 Apr 2023 00:42:03 -0700 Subject: [PATCH 1/3] fix(react-skeleton): Stories should import from react-components --- .../stories/Skeleton/SkeletonAnimation.stories.tsx | 3 +-- .../stories/Skeleton/SkeletonAppearance.stories.tsx | 3 +-- .../stories/Skeleton/SkeletonDefault.stories.tsx | 4 ++-- .../react-skeleton/stories/Skeleton/SkeletonRow.stories.tsx | 2 +- 4 files changed, 5 insertions(+), 7 deletions(-) diff --git a/packages/react-components/react-skeleton/stories/Skeleton/SkeletonAnimation.stories.tsx b/packages/react-components/react-skeleton/stories/Skeleton/SkeletonAnimation.stories.tsx index 639465453e7aa7..2ec87385722f60 100644 --- a/packages/react-components/react-skeleton/stories/Skeleton/SkeletonAnimation.stories.tsx +++ b/packages/react-components/react-skeleton/stories/Skeleton/SkeletonAnimation.stories.tsx @@ -1,7 +1,6 @@ import * as React from 'react'; -import { Skeleton, SkeletonItem, SkeletonProps } from '@fluentui/react-skeleton'; -import { Field } from '@fluentui/react-field'; import { makeStyles, tokens } from '@fluentui/react-components'; +import { Field, Skeleton, SkeletonItem, SkeletonProps } from '@fluentui/react-components/unstable'; const useStyles = makeStyles({ invertedWrapper: { diff --git a/packages/react-components/react-skeleton/stories/Skeleton/SkeletonAppearance.stories.tsx b/packages/react-components/react-skeleton/stories/Skeleton/SkeletonAppearance.stories.tsx index e4df0aab754998..49b48394c79a68 100644 --- a/packages/react-components/react-skeleton/stories/Skeleton/SkeletonAppearance.stories.tsx +++ b/packages/react-components/react-skeleton/stories/Skeleton/SkeletonAppearance.stories.tsx @@ -1,7 +1,6 @@ import * as React from 'react'; -import { Skeleton, SkeletonItem, SkeletonProps } from '@fluentui/react-skeleton'; -import { Field } from '@fluentui/react-field'; import { makeStyles, tokens } from '@fluentui/react-components'; +import { Field, Skeleton, SkeletonItem, SkeletonProps } from '@fluentui/react-components/unstable'; const useStyles = makeStyles({ invertedWrapper: { diff --git a/packages/react-components/react-skeleton/stories/Skeleton/SkeletonDefault.stories.tsx b/packages/react-components/react-skeleton/stories/Skeleton/SkeletonDefault.stories.tsx index 5432b199df024e..d5a0eda57fece1 100644 --- a/packages/react-components/react-skeleton/stories/Skeleton/SkeletonDefault.stories.tsx +++ b/packages/react-components/react-skeleton/stories/Skeleton/SkeletonDefault.stories.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { Skeleton, SkeletonItem } from '@fluentui/react-skeleton'; -import type { SkeletonProps } from '@fluentui/react-skeleton'; +import { Skeleton, SkeletonItem } from '@fluentui/react-components/unstable'; +import type { SkeletonProps } from '@fluentui/react-components/unstable'; export const Default = (props: Partial) => ( diff --git a/packages/react-components/react-skeleton/stories/Skeleton/SkeletonRow.stories.tsx b/packages/react-components/react-skeleton/stories/Skeleton/SkeletonRow.stories.tsx index f511aa2441de01..708f26e8140f27 100644 --- a/packages/react-components/react-skeleton/stories/Skeleton/SkeletonRow.stories.tsx +++ b/packages/react-components/react-skeleton/stories/Skeleton/SkeletonRow.stories.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { Skeleton, SkeletonItem, SkeletonProps } from '@fluentui/react-skeleton'; import { makeStyles, shorthands, tokens } from '@fluentui/react-components'; +import { Skeleton, SkeletonItem, SkeletonProps } from '@fluentui/react-components/unstable'; const useStyles = makeStyles({ invertedWrapper: { From 78fca5ba66539f4d79cc15f427a1f4b0302e4885 Mon Sep 17 00:00:00 2001 From: Ben Howell Date: Mon, 10 Apr 2023 10:03:01 -0700 Subject: [PATCH 2/3] Update imports in index.stories.tsx as well --- .../react-progress/stories/ProgressBar/index.stories.tsx | 2 +- .../react-skeleton/stories/Skeleton/index.stories.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/react-components/react-progress/stories/ProgressBar/index.stories.tsx b/packages/react-components/react-progress/stories/ProgressBar/index.stories.tsx index f60da5681212c1..97936f3bced162 100644 --- a/packages/react-components/react-progress/stories/ProgressBar/index.stories.tsx +++ b/packages/react-components/react-progress/stories/ProgressBar/index.stories.tsx @@ -1,4 +1,4 @@ -import { ProgressBar } from '@fluentui/react-progress'; +import { ProgressBar } from '@fluentui/react-components'; import descriptionMd from './ProgressBarDescription.md'; import bestPracticesMd from './ProgressBarBestPractices.md'; diff --git a/packages/react-components/react-skeleton/stories/Skeleton/index.stories.tsx b/packages/react-components/react-skeleton/stories/Skeleton/index.stories.tsx index cc1f06ba914f89..35c0fe98b6ad26 100644 --- a/packages/react-components/react-skeleton/stories/Skeleton/index.stories.tsx +++ b/packages/react-components/react-skeleton/stories/Skeleton/index.stories.tsx @@ -1,4 +1,4 @@ -import { Skeleton } from '@fluentui/react-skeleton'; +import { Skeleton } from '@fluentui/react-components/unstable'; import descriptionMd from './SkeletonDescription.md'; import bestPracticesMd from './SkeletonBestPractices.md'; From 57ae5e1cc22fbce1d65ff6cbf4f88c78c4168b7b Mon Sep 17 00:00:00 2001 From: Ben Howell Date: Mon, 10 Apr 2023 10:47:41 -0700 Subject: [PATCH 3/3] Separate out type imports --- .../stories/Skeleton/SkeletonAnimation.stories.tsx | 3 ++- .../stories/Skeleton/SkeletonAppearance.stories.tsx | 3 ++- .../react-skeleton/stories/Skeleton/SkeletonRow.stories.tsx | 3 ++- 3 files changed, 6 insertions(+), 3 deletions(-) diff --git a/packages/react-components/react-skeleton/stories/Skeleton/SkeletonAnimation.stories.tsx b/packages/react-components/react-skeleton/stories/Skeleton/SkeletonAnimation.stories.tsx index 2ec87385722f60..c1e465000bb04e 100644 --- a/packages/react-components/react-skeleton/stories/Skeleton/SkeletonAnimation.stories.tsx +++ b/packages/react-components/react-skeleton/stories/Skeleton/SkeletonAnimation.stories.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import { makeStyles, tokens } from '@fluentui/react-components'; -import { Field, Skeleton, SkeletonItem, SkeletonProps } from '@fluentui/react-components/unstable'; +import type { SkeletonProps } from '@fluentui/react-components/unstable'; +import { Field, Skeleton, SkeletonItem } from '@fluentui/react-components/unstable'; const useStyles = makeStyles({ invertedWrapper: { diff --git a/packages/react-components/react-skeleton/stories/Skeleton/SkeletonAppearance.stories.tsx b/packages/react-components/react-skeleton/stories/Skeleton/SkeletonAppearance.stories.tsx index 49b48394c79a68..d7e2da2e928406 100644 --- a/packages/react-components/react-skeleton/stories/Skeleton/SkeletonAppearance.stories.tsx +++ b/packages/react-components/react-skeleton/stories/Skeleton/SkeletonAppearance.stories.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import { makeStyles, tokens } from '@fluentui/react-components'; -import { Field, Skeleton, SkeletonItem, SkeletonProps } from '@fluentui/react-components/unstable'; +import type { SkeletonProps } from '@fluentui/react-components/unstable'; +import { Field, Skeleton, SkeletonItem } from '@fluentui/react-components/unstable'; const useStyles = makeStyles({ invertedWrapper: { diff --git a/packages/react-components/react-skeleton/stories/Skeleton/SkeletonRow.stories.tsx b/packages/react-components/react-skeleton/stories/Skeleton/SkeletonRow.stories.tsx index 708f26e8140f27..e972c808d58be6 100644 --- a/packages/react-components/react-skeleton/stories/Skeleton/SkeletonRow.stories.tsx +++ b/packages/react-components/react-skeleton/stories/Skeleton/SkeletonRow.stories.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import { makeStyles, shorthands, tokens } from '@fluentui/react-components'; -import { Skeleton, SkeletonItem, SkeletonProps } from '@fluentui/react-components/unstable'; +import type { SkeletonProps } from '@fluentui/react-components/unstable'; +import { Skeleton, SkeletonItem } from '@fluentui/react-components/unstable'; const useStyles = makeStyles({ invertedWrapper: {