From 5aee9ae9aa62ffbbccf5b112802f7dbae9784d8a Mon Sep 17 00:00:00 2001 From: Ruriko Araki Date: Wed, 10 Jul 2024 08:44:49 -0700 Subject: [PATCH] Export Shimmer consts (#3677) * Export shimmer consts * Change files --- ...ental-shimmer-49735c34-7217-4d2e-932f-97badd995c82.json | 7 +++++++ packages/experimental/Shimmer/src/ShimmerTokens.android.ts | 7 ++++--- packages/experimental/Shimmer/src/ShimmerTokens.ios.ts | 7 ++++--- packages/experimental/Shimmer/src/ShimmerTokens.ts | 7 ++++--- packages/experimental/Shimmer/src/ShimmerTokens.win32.ts | 7 ++++--- packages/experimental/Shimmer/src/consts.android.ts | 3 +++ packages/experimental/Shimmer/src/consts.ios.ts | 3 +++ packages/experimental/Shimmer/src/consts.ts | 3 +++ packages/experimental/Shimmer/src/consts.win32.ts | 3 +++ packages/experimental/Shimmer/src/index.ts | 1 + 10 files changed, 36 insertions(+), 12 deletions(-) create mode 100644 change/@fluentui-react-native-experimental-shimmer-49735c34-7217-4d2e-932f-97badd995c82.json create mode 100644 packages/experimental/Shimmer/src/consts.android.ts create mode 100644 packages/experimental/Shimmer/src/consts.ios.ts create mode 100644 packages/experimental/Shimmer/src/consts.ts create mode 100644 packages/experimental/Shimmer/src/consts.win32.ts diff --git a/change/@fluentui-react-native-experimental-shimmer-49735c34-7217-4d2e-932f-97badd995c82.json b/change/@fluentui-react-native-experimental-shimmer-49735c34-7217-4d2e-932f-97badd995c82.json new file mode 100644 index 000000000..00c402a80 --- /dev/null +++ b/change/@fluentui-react-native-experimental-shimmer-49735c34-7217-4d2e-932f-97badd995c82.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "Export shimmer consts", + "packageName": "@fluentui-react-native/experimental-shimmer", + "email": "ruaraki@microsoft.com", + "dependentChangeType": "patch" +} diff --git a/packages/experimental/Shimmer/src/ShimmerTokens.android.ts b/packages/experimental/Shimmer/src/ShimmerTokens.android.ts index eb575a3d3..443d652d4 100644 --- a/packages/experimental/Shimmer/src/ShimmerTokens.android.ts +++ b/packages/experimental/Shimmer/src/ShimmerTokens.android.ts @@ -1,13 +1,14 @@ import type { Theme } from '@fluentui-react-native/framework'; import type { TokenSettings } from '@fluentui-react-native/use-styling'; +import { shimmerDefaultAngle, shimmerDefaultDelay, shimmerDefaultDuration } from './consts'; import type { ShimmerTokens } from './Shimmer.types'; export const defaultShimmerTokens: TokenSettings = (theme: Theme) => ({ - angle: 45, - delay: 0, - duration: 1000, + angle: shimmerDefaultAngle, + delay: shimmerDefaultDelay, + duration: shimmerDefaultDuration, shimmerColor: theme.colors.neutralStencil1, shimmerColorOpacity: 1, shimmerWaveColor: theme.colors.neutralStencil2, diff --git a/packages/experimental/Shimmer/src/ShimmerTokens.ios.ts b/packages/experimental/Shimmer/src/ShimmerTokens.ios.ts index 84bc0c12a..443d652d4 100644 --- a/packages/experimental/Shimmer/src/ShimmerTokens.ios.ts +++ b/packages/experimental/Shimmer/src/ShimmerTokens.ios.ts @@ -1,13 +1,14 @@ import type { Theme } from '@fluentui-react-native/framework'; import type { TokenSettings } from '@fluentui-react-native/use-styling'; +import { shimmerDefaultAngle, shimmerDefaultDelay, shimmerDefaultDuration } from './consts'; import type { ShimmerTokens } from './Shimmer.types'; export const defaultShimmerTokens: TokenSettings = (theme: Theme) => ({ - angle: 0, - delay: 0, - duration: 1000, + angle: shimmerDefaultAngle, + delay: shimmerDefaultDelay, + duration: shimmerDefaultDuration, shimmerColor: theme.colors.neutralStencil1, shimmerColorOpacity: 1, shimmerWaveColor: theme.colors.neutralStencil2, diff --git a/packages/experimental/Shimmer/src/ShimmerTokens.ts b/packages/experimental/Shimmer/src/ShimmerTokens.ts index 6feb583db..6919961dc 100644 --- a/packages/experimental/Shimmer/src/ShimmerTokens.ts +++ b/packages/experimental/Shimmer/src/ShimmerTokens.ts @@ -2,14 +2,15 @@ import type { Theme } from '@fluentui-react-native/framework'; import { getCurrentAppearance } from '@fluentui-react-native/theming-utils'; import type { TokenSettings } from '@fluentui-react-native/use-styling'; +import { shimmerDefaultAngle, shimmerDefaultDelay, shimmerDefaultDuration } from './consts'; import type { ShimmerTokens } from './Shimmer.types'; export const defaultShimmerTokens: TokenSettings = (theme: Theme) => ({ - angle: 0, + angle: shimmerDefaultAngle, backgroundColor: theme.colors.transparentBackground, - delay: 0, - duration: 7000, + delay: shimmerDefaultDelay, + duration: shimmerDefaultDuration, shimmerColor: getCurrentAppearance(theme.host.appearance, 'light') === 'light' ? '#E1E1E1' : '#404040', shimmerColorOpacity: 1, shimmerWaveColor: getCurrentAppearance(theme.host.appearance, 'light') === 'light' ? 'white' : 'black', diff --git a/packages/experimental/Shimmer/src/ShimmerTokens.win32.ts b/packages/experimental/Shimmer/src/ShimmerTokens.win32.ts index aa5ffdc41..0ef43eb12 100644 --- a/packages/experimental/Shimmer/src/ShimmerTokens.win32.ts +++ b/packages/experimental/Shimmer/src/ShimmerTokens.win32.ts @@ -1,14 +1,15 @@ import type { Theme } from '@fluentui-react-native/framework'; import type { TokenSettings } from '@fluentui-react-native/use-styling'; +import { shimmerDefaultAngle, shimmerDefaultDelay, shimmerDefaultDuration } from './consts'; import type { ShimmerTokens } from './Shimmer.types'; export const defaultShimmerTokens: TokenSettings = (theme: Theme) => ({ - angle: 0, + angle: shimmerDefaultAngle, backgroundColor: theme.colors.background, - delay: 500, - duration: 2000, + delay: shimmerDefaultDelay, + duration: shimmerDefaultDuration, shimmerColor: theme.colors.bodyFrameDivider, shimmerColorOpacity: 1, shimmerWaveColor: '#E1E1E1', diff --git a/packages/experimental/Shimmer/src/consts.android.ts b/packages/experimental/Shimmer/src/consts.android.ts new file mode 100644 index 000000000..b5247213f --- /dev/null +++ b/packages/experimental/Shimmer/src/consts.android.ts @@ -0,0 +1,3 @@ +export const shimmerDefaultAngle = 45; +export const shimmerDefaultDelay = 0; +export const shimmerDefaultDuration = 1000; diff --git a/packages/experimental/Shimmer/src/consts.ios.ts b/packages/experimental/Shimmer/src/consts.ios.ts new file mode 100644 index 000000000..fa8889415 --- /dev/null +++ b/packages/experimental/Shimmer/src/consts.ios.ts @@ -0,0 +1,3 @@ +export const shimmerDefaultAngle = 0; +export const shimmerDefaultDelay = 0; +export const shimmerDefaultDuration = 1000; diff --git a/packages/experimental/Shimmer/src/consts.ts b/packages/experimental/Shimmer/src/consts.ts new file mode 100644 index 000000000..6799c2779 --- /dev/null +++ b/packages/experimental/Shimmer/src/consts.ts @@ -0,0 +1,3 @@ +export const shimmerDefaultAngle = 0; +export const shimmerDefaultDelay = 0; +export const shimmerDefaultDuration = 7000; diff --git a/packages/experimental/Shimmer/src/consts.win32.ts b/packages/experimental/Shimmer/src/consts.win32.ts new file mode 100644 index 000000000..ecce63c0f --- /dev/null +++ b/packages/experimental/Shimmer/src/consts.win32.ts @@ -0,0 +1,3 @@ +export const shimmerDefaultAngle = 0; +export const shimmerDefaultDelay = 500; +export const shimmerDefaultDuration = 2000; diff --git a/packages/experimental/Shimmer/src/index.ts b/packages/experimental/Shimmer/src/index.ts index f3ff837da..8ae24c7ff 100644 --- a/packages/experimental/Shimmer/src/index.ts +++ b/packages/experimental/Shimmer/src/index.ts @@ -9,3 +9,4 @@ export type { ShimmerTokens, ShimmerType, } from './Shimmer.types'; +export { shimmerDefaultAngle, shimmerDefaultDelay, shimmerDefaultDuration } from './consts';