diff --git a/.changeset/funny-news-smell.md b/.changeset/funny-news-smell.md new file mode 100644 index 00000000000..fe5b9e5d60d --- /dev/null +++ b/.changeset/funny-news-smell.md @@ -0,0 +1,13 @@ +--- +"@fluentui-react-native/contextual-menu": patch +"@fluentui-react-native/vibrancy-view": patch +"@fluentui-react-native/focus-trap-zone": patch +"@fluentui-react-native/menu-button": patch +"@fluentui-react-native/focus-zone": patch +"@fluentui-react-native/tooltip": patch +"@fluentui-react-native/experimental-avatar": patch +"@fluentui-react-native/callout": patch +"@fluentui-react-native/button": patch +--- + +Fix codegen definitions for native components in repo diff --git a/.vscode/settings.json b/.vscode/settings.json index ff320b97c08..10b015de731 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -7,9 +7,15 @@ "editor.codeActionsOnSave": { "source.fixAll.eslint": "explicit" }, + "prettier.singleQuote": true, + "prettier.tabWidth": 2, + "prettier.printWidth": 140, + "prettier.trailingComma": "all", "eslint.enable": true, - "eslint.workingDirectories": [{ "pattern": "./packages/framework/eslint-config-rules" }], // use the common eslint config file + "eslint.workingDirectories": [ + { "pattern": "./packages/framework/eslint-config-rules" } + ], // use the common eslint config file "explorer.fileNesting.enabled": true, "explorer.fileNesting.patterns": { diff --git a/docs/pages/Components/Callout.md b/docs/pages/Components/Callout.md index d0e23949ab3..46b333bb96b 100644 --- a/docs/pages/Components/Callout.md +++ b/docs/pages/Components/Callout.md @@ -128,7 +128,7 @@ type DirectionalHint = | 'rightTopEdge' | 'rightCenter' | 'rightBottomEdge' - | 'bottonLeftEdge' + | 'bottomLeftEdge' | 'bottomAutoEdge' | 'bottomCenter' | 'bottomRightEdge'; diff --git a/packages/components/Button/SPEC.md b/packages/components/Button/SPEC.md index e0220ddfa3c..206628807b3 100644 --- a/packages/components/Button/SPEC.md +++ b/packages/components/Button/SPEC.md @@ -309,8 +309,8 @@ It is possible to override key behaviors by specifying `onKeyUp` or `onKeyDown`, #### Cursor interaction -- Cursor moves onto botton: Should immediately change the styling of the `Button` so that it appears to be hovered. -- Cursor moves out of botton: Should immediately remove the hovered styling of the `Button`. +- Cursor moves onto bottom: Should immediately change the styling of the `Button` so that it appears to be hovered. +- Cursor moves out of bottom: Should immediately remove the hovered styling of the `Button`. - Mouse click: Should execute the `Button` and move focus to its target. #### Touch interaction diff --git a/packages/components/Callout/macos/FRNCalloutManager.m b/packages/components/Callout/macos/FRNCalloutManager.m index 0d9bae2be91..8d222766835 100644 --- a/packages/components/Callout/macos/FRNCalloutManager.m +++ b/packages/components/Callout/macos/FRNCalloutManager.m @@ -28,7 +28,7 @@ + (NSRect)screenRect:(id)json @"rightTopEdge": @(NSRectEdgeMaxX), @"rightCenter": @(NSRectEdgeMaxX), @"rightBottomEdge": @(NSRectEdgeMaxX), - @"bottonLeftEdge": @(NSRectEdgeMinY), + @"bottomLeftEdge": @(NSRectEdgeMinY), @"bottomAutoEdge": @(NSRectEdgeMinY), @"bottomCenter": @(NSRectEdgeMinY), @"bottomRightEdge": @(NSRectEdgeMinY), diff --git a/packages/components/Callout/src/Callout.settings.macos.ts b/packages/components/Callout/src/Callout.settings.macos.ts index 9ba96a99128..eaeac88d7e4 100644 --- a/packages/components/Callout/src/Callout.settings.macos.ts +++ b/packages/components/Callout/src/Callout.settings.macos.ts @@ -10,7 +10,7 @@ export const settings: IComposeSettings = [ borderColor: 'transparent', borderWidth: 0, borderRadius: 5, - directionalHint: 'bottonLeftEdge', + directionalHint: 'bottomLeftEdge', }, root: { style: { diff --git a/packages/components/Callout/src/Callout.settings.ts b/packages/components/Callout/src/Callout.settings.ts index 917feb0a0da..6b21d133bf6 100644 --- a/packages/components/Callout/src/Callout.settings.ts +++ b/packages/components/Callout/src/Callout.settings.ts @@ -10,7 +10,7 @@ export const settings: IComposeSettings = [ beakWidth: 20, borderColor: 'bodyFrameBackground', borderWidth: 1, - directionalHint: 'bottonLeftEdge', + directionalHint: 'bottomLeftEdge', gapSpace: 0, minPadding: 0, }, diff --git a/packages/components/Callout/src/Callout.types.ts b/packages/components/Callout/src/Callout.types.ts index af0990f12a4..c2afec5e468 100644 --- a/packages/components/Callout/src/Callout.types.ts +++ b/packages/components/Callout/src/Callout.types.ts @@ -1,15 +1,13 @@ import type * as React from 'react'; -import type { KeyboardMetrics, ViewStyle, ViewProps } from 'react-native'; +import type { KeyboardMetrics, ViewStyle } from 'react-native'; import type { IViewProps } from '@fluentui-react-native/adapters'; import type { IBackgroundColorTokens, IBorderTokens } from '@fluentui-react-native/tokens'; import type { IRenderData } from '@uifabricshared/foundation-composable'; -import type { CalloutNativeCommands } from './CalloutNativeComponent.types'; +import type { CalloutNativeCommands } from './CalloutNativeComponent'; export const calloutName = 'Callout'; -import type { DirectEventHandler, Double, Int32 } from 'react-native/Libraries/Types/CodegenTypes'; - /** * Properties and Tokens for FluentUI React Native Callout */ @@ -25,7 +23,7 @@ export type DirectionalHint = | 'rightTopEdge' | 'rightCenter' | 'rightBottomEdge' - | 'bottonLeftEdge' + | 'bottomLeftEdge' | 'bottomAutoEdge' | 'bottomCenter' | 'bottomRightEdge'; @@ -227,34 +225,3 @@ export interface ICalloutType { slotProps: ICalloutSlotProps; tokens: ICalloutTokens; } - -type AnchorRect = { - screenX: Double; - screenY: Double; - width: Double; - height: Double; -}; - -/** - * Shared native props specific to Callout native component - */ -export interface NativePropsBase extends ViewProps { - accessibilityLabel?: string; - accessibilityOnShowAnnouncement?: string; - anchorRect?: AnchorRect; - - dismissBehaviors?: string[]; - doNotTakePointerCapture?: boolean; - focusable?: boolean; - isBeakVisible?: boolean; - maxHeight?: Int32; - maxWidth?: Int32; - setInitialFocus?: boolean; - - // targetAnchor?: string; // Win32 only Callout can target an anchor registered in the anchor registry // Can be a node id or an anchor ID - This need to be reworked as Mixed types are not supported going forward - testID?: string; - - onRestoreFocus?: DirectEventHandler<{ target: Int32; containsFocus: boolean }>; - onDismiss?: DirectEventHandler<{ target: Int32 }>; - onShow?: DirectEventHandler<{ target: Int32 }>; -} diff --git a/packages/components/Callout/src/CalloutNativeComponent.macos.ts b/packages/components/Callout/src/CalloutNativeComponent.macos.ts index b6563d44908..bd9028d578f 100644 --- a/packages/components/Callout/src/CalloutNativeComponent.macos.ts +++ b/packages/components/Callout/src/CalloutNativeComponent.macos.ts @@ -1,12 +1,68 @@ import codegenNativeCommands from 'react-native/Libraries/Utilities/codegenNativeCommands'; -import { requireNativeComponent } from 'react-native'; +import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent'; -import type { NativeProps, CalloutComponentType, CalloutNativeCommands } from './CalloutNativeComponent.types.macos'; +import type { HostComponent, ViewProps } from 'react-native'; +import type { WithDefault, UnsafeMixed, Int32, DirectEventHandler, Double } from 'react-native/Libraries/Types/CodegenTypes'; + +interface AnchorRect { + screenX: Double; + screenY: Double; + width: Double; + height: Double; +} + +/** + * Shared native props specific to Callout native component + */ +export interface NativeProps extends ViewProps { + accessibilityLabel?: string; + accessibilityOnShowAnnouncement?: string; + anchorRect?: AnchorRect; + + dismissBehaviors?: string[]; + doNotTakePointerCapture?: boolean; + focusable?: boolean; + isBeakVisible?: boolean; + maxHeight?: Int32; + maxWidth?: Int32; + setInitialFocus?: boolean; + + // targetAnchor?: string; // Win32 only Callout can target an anchor registered in the anchor registry // Can be a node id or an anchor ID - This need to be reworked as Mixed types are not supported going forward + testID?: string; + + onRestoreFocus?: DirectEventHandler<{ target: Int32; containsFocus: boolean }>; + onDismiss?: DirectEventHandler<{ target: Int32 }>; + onShow?: DirectEventHandler<{ target: Int32 }>; + + directionalHint?: WithDefault< + | 'leftTopEdge' + | 'leftCenter' + | 'leftBottomEdge' + | 'topLeftEdge' + | 'topAutoEdge' + | 'topCenter' + | 'topRightEdge' + | 'rightTopEdge' + | 'rightCenter' + | 'rightBottomEdge' + | 'bottomLeftEdge' + | 'bottomAutoEdge' + | 'bottomCenter' + | 'bottomRightEdge', + 'topleftEdge' + >; + target?: UnsafeMixed; +} + +export type CalloutComponentType = HostComponent; + +export interface CalloutNativeCommands { + focusWindow: (viewRef: React.ElementRef) => void; + blurWindow: (viewRef: React.ElementRef) => void; +} export const Commands: CalloutNativeCommands = codegenNativeCommands({ supportedCommands: ['blurWindow', 'focusWindow'], }); -// no fabric for macOS, just use requireNativeComponent -// macOS uses FRNCallout (registered by FRNCalloutManager), not RCTCallout -export default requireNativeComponent('FRNCallout') as CalloutComponentType; +export default codegenNativeComponent('FRNCallout') as CalloutComponentType; diff --git a/packages/components/Callout/src/CalloutNativeComponent.ts b/packages/components/Callout/src/CalloutNativeComponent.ts index 90da7721f3f..41e0e73d5b6 100644 --- a/packages/components/Callout/src/CalloutNativeComponent.ts +++ b/packages/components/Callout/src/CalloutNativeComponent.ts @@ -1,7 +1,65 @@ import codegenNativeCommands from 'react-native/Libraries/Utilities/codegenNativeCommands'; import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent'; -import type { NativeProps, CalloutComponentType, CalloutNativeCommands } from './CalloutNativeComponent.types'; +import type { HostComponent, ViewProps } from 'react-native'; +import type { WithDefault, UnsafeMixed, Int32, DirectEventHandler, Double } from 'react-native/Libraries/Types/CodegenTypes'; + +interface AnchorRect { + screenX: Double; + screenY: Double; + width: Double; + height: Double; +} + +/** + * Shared native props specific to Callout native component + */ +export interface NativeProps extends ViewProps { + accessibilityLabel?: string; + accessibilityOnShowAnnouncement?: string; + anchorRect?: AnchorRect; + + dismissBehaviors?: string[]; + doNotTakePointerCapture?: boolean; + focusable?: boolean; + isBeakVisible?: boolean; + maxHeight?: Int32; + maxWidth?: Int32; + setInitialFocus?: boolean; + + // targetAnchor?: string; // Win32 only Callout can target an anchor registered in the anchor registry // Can be a node id or an anchor ID - This need to be reworked as Mixed types are not supported going forward + testID?: string; + + onRestoreFocus?: DirectEventHandler<{ target: Int32; containsFocus: boolean }>; + onDismiss?: DirectEventHandler<{ target: Int32 }>; + onShow?: DirectEventHandler<{ target: Int32 }>; + + directionalHint?: WithDefault< + | 'leftTopEdge' + | 'leftCenter' + | 'leftBottomEdge' + | 'topLeftEdge' + | 'topAutoEdge' + | 'topCenter' + | 'topRightEdge' + | 'rightTopEdge' + | 'rightCenter' + | 'rightBottomEdge' + | 'bottomLeftEdge' + | 'bottomAutoEdge' + | 'bottomCenter' + | 'bottomRightEdge', + 'bottomLeftEdge' + >; + target?: UnsafeMixed; +} + +export type CalloutComponentType = HostComponent; + +export interface CalloutNativeCommands { + focusWindow: (viewRef: React.ElementRef) => void; + blurWindow: (viewRef: React.ElementRef) => void; +} export const Commands: CalloutNativeCommands = codegenNativeCommands({ supportedCommands: ['blurWindow', 'focusWindow'], diff --git a/packages/components/Callout/src/CalloutNativeComponent.types.macos.ts b/packages/components/Callout/src/CalloutNativeComponent.types.macos.ts deleted file mode 100644 index 9eda89be103..00000000000 --- a/packages/components/Callout/src/CalloutNativeComponent.types.macos.ts +++ /dev/null @@ -1,31 +0,0 @@ -import type { HostComponent } from 'react-native'; -import type { WithDefault, Int32 } from 'react-native/Libraries/Types/CodegenTypes'; -import type { NativePropsBase } from './Callout.types'; - -export interface NativeProps extends NativePropsBase { - directionalHint?: WithDefault< - | 'leftTopEdge' - | 'leftCenter' - | 'leftBottomEdge' - | 'topLeftEdge' - | 'topAutoEdge' - | 'topCenter' - | 'topRightEdge' - | 'rightTopEdge' - | 'rightCenter' - | 'rightBottomEdge' - | 'bottonLeftEdge' - | 'bottomAutoEdge' - | 'bottomCenter' - | 'bottomRightEdge', - 'topLeftEdge' - >; - target?: Int32; -} - -// making these explicit as codegen can't always handle complex typescript types and fails silently -export type CalloutComponentType = HostComponent; -export type CalloutNativeCommands = { - focusWindow: (viewRef: React.ElementRef) => void; - blurWindow: (viewRef: React.ElementRef) => void; -}; diff --git a/packages/components/Callout/src/CalloutNativeComponent.types.ts b/packages/components/Callout/src/CalloutNativeComponent.types.ts deleted file mode 100644 index f690006bb8c..00000000000 --- a/packages/components/Callout/src/CalloutNativeComponent.types.ts +++ /dev/null @@ -1,31 +0,0 @@ -import type { HostComponent } from 'react-native'; -import type { WithDefault } from 'react-native/Libraries/Types/CodegenTypes'; -import type { UnsafeMixed } from './codegenTypes'; -import type { NativePropsBase } from './Callout.types'; - -export interface NativeProps extends NativePropsBase { - directionalHint?: WithDefault< - | 'leftTopEdge' - | 'leftCenter' - | 'leftBottomEdge' - | 'topLeftEdge' - | 'topAutoEdge' - | 'topCenter' - | 'topRightEdge' - | 'rightTopEdge' - | 'rightCenter' - | 'rightBottomEdge' - | 'bottonLeftEdge' - | 'bottomAutoEdge' - | 'bottomCenter' - | 'bottomRightEdge', - 'bottonLeftEdge' - >; - target?: UnsafeMixed; -} - -export type CalloutComponentType = HostComponent; -export type CalloutNativeCommands = { - focusWindow: (viewRef: React.ElementRef) => void; - blurWindow: (viewRef: React.ElementRef) => void; -}; diff --git a/packages/components/Callout/src/CalloutNativeComponent.win32.ts b/packages/components/Callout/src/CalloutNativeComponent.win32.ts deleted file mode 100644 index 8f7e9ed5401..00000000000 --- a/packages/components/Callout/src/CalloutNativeComponent.win32.ts +++ /dev/null @@ -1,11 +0,0 @@ -import codegenNativeCommands from 'react-native/Libraries/Utilities/codegenNativeCommands'; -import { requireNativeComponent } from 'react-native'; - -import type { NativeProps, CalloutComponentType, CalloutNativeCommands } from './CalloutNativeComponent.types'; - -export const Commands: CalloutNativeCommands = codegenNativeCommands({ - supportedCommands: ['blurWindow', 'focusWindow'], -}); - -// no fabric for Win32, just use requireNativeComponent -export default requireNativeComponent('RCTCallout') as CalloutComponentType; diff --git a/packages/components/Callout/src/codegenTypes.d.ts b/packages/components/Callout/src/codegenTypes.d.ts deleted file mode 100644 index 407f2834a20..00000000000 --- a/packages/components/Callout/src/codegenTypes.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -// Separate .d.ts file to fool codegen, since UnsafeMixed does not existing in the TS types of RN currently. -export type UnsafeMixed = any; diff --git a/packages/components/Callout/src/index.ts b/packages/components/Callout/src/index.ts index 26a47fc1ffa..3e08ddab362 100644 --- a/packages/components/Callout/src/index.ts +++ b/packages/components/Callout/src/index.ts @@ -9,5 +9,5 @@ export type { ICalloutType, RestoreFocusEvent, } from './Callout.types'; -export type { CalloutNativeCommands } from './CalloutNativeComponent.types'; +export type { CalloutNativeCommands } from './CalloutNativeComponent'; export { Callout } from './Callout'; diff --git a/packages/components/ContextualMenu/src/ContextualMenu.settings.macos.ts b/packages/components/ContextualMenu/src/ContextualMenu.settings.macos.ts index 9b474c07863..16992a0a5b2 100644 --- a/packages/components/ContextualMenu/src/ContextualMenu.settings.macos.ts +++ b/packages/components/ContextualMenu/src/ContextualMenu.settings.macos.ts @@ -8,7 +8,7 @@ import { contextualMenuName } from './ContextualMenu.types'; export const settings: IComposeSettings = [ { tokens: { - directionalHint: I18nManager.isRTL ? 'bottomRightEdge' : 'bottonLeftEdge', + directionalHint: I18nManager.isRTL ? 'bottomRightEdge' : 'bottomLeftEdge', }, container: { style: { diff --git a/packages/components/ContextualMenu/src/ContextualMenu.settings.ts b/packages/components/ContextualMenu/src/ContextualMenu.settings.ts index 6c88a1f22d8..e1f21bdbd84 100644 --- a/packages/components/ContextualMenu/src/ContextualMenu.settings.ts +++ b/packages/components/ContextualMenu/src/ContextualMenu.settings.ts @@ -10,7 +10,7 @@ export const settings: IComposeSettings = [ beakWidth: 20, borderColor: 'buttonBorder', borderWidth: 1, - directionalHint: 'bottonLeftEdge', + directionalHint: 'bottomLeftEdge', gapSpace: 0, minPadding: 0, }, diff --git a/packages/components/FocusTrapZone/src/FocusTrapZoneNativeComponent.ts b/packages/components/FocusTrapZone/src/FocusTrapZoneNativeComponent.ts index b19bdf23e0a..7b81e95675b 100644 --- a/packages/components/FocusTrapZone/src/FocusTrapZoneNativeComponent.ts +++ b/packages/components/FocusTrapZone/src/FocusTrapZoneNativeComponent.ts @@ -3,8 +3,8 @@ * Licensed under the MIT License. * @format */ - -import { requireNativeComponent, type HostComponent, type ViewProps } from 'react-native'; +import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent'; +import type { HostComponent, ViewProps } from 'react-native'; export interface NativeProps extends ViewProps { /** @@ -36,4 +36,4 @@ export interface NativeProps extends ViewProps { forceFocusInsideTrap?: boolean; } -export default requireNativeComponent('RCTFocusTrapZone') as HostComponent; +export default codegenNativeComponent('RCTFocusTrapZone') as HostComponent; diff --git a/packages/components/FocusZone/src/FocusZoneNativeComponent.ts b/packages/components/FocusZone/src/FocusZoneNativeComponent.ts index 398bca18234..b6c7cf2ae50 100644 --- a/packages/components/FocusZone/src/FocusZoneNativeComponent.ts +++ b/packages/components/FocusZone/src/FocusZoneNativeComponent.ts @@ -3,13 +3,11 @@ * Licensed under the MIT License. * @format */ +import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent'; import type { ViewProps } from 'react-native'; +import type { WithDefault, UnsafeMixed } from 'react-native/Libraries/Types/CodegenTypes'; -import type { WithDefault } from 'react-native/Libraries/Types/CodegenTypes'; -import { requireNativeComponent } from 'react-native'; - -import type { UnsafeMixed } from './codegenTypes'; // Should be: // import type { UnsafeObject } from 'react-native/Libraries/Types/CodegenTypes'; @@ -23,4 +21,4 @@ export interface NativeProps extends ViewProps { isTabNavigation?: boolean; } -export default requireNativeComponent('RCTFocusZone'); +export default codegenNativeComponent('RCTFocusZone'); diff --git a/packages/components/FocusZone/src/codegenTypes.d.ts b/packages/components/FocusZone/src/codegenTypes.d.ts deleted file mode 100644 index 407f2834a20..00000000000 --- a/packages/components/FocusZone/src/codegenTypes.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -// Separate .d.ts file to fool codegen, since UnsafeMixed does not existing in the TS types of RN currently. -export type UnsafeMixed = any; diff --git a/packages/components/MenuButton/src/MacOSMenuButtonNativeComponent.ts b/packages/components/MenuButton/src/MacOSMenuButtonNativeComponent.ts index 891d10c7aa0..67caf9f8952 100644 --- a/packages/components/MenuButton/src/MacOSMenuButtonNativeComponent.ts +++ b/packages/components/MenuButton/src/MacOSMenuButtonNativeComponent.ts @@ -4,12 +4,12 @@ * @format */ -import type { HostComponent, ViewProps } from 'react-native'; +import type { HostComponent, ViewProps, ImageURISource } from 'react-native'; -import type { BubblingEventHandler, Int32 } from 'react-native/Libraries/Types/CodegenTypes'; +import type { BubblingEventHandler, Int32, UnsafeMixed } from 'react-native/Libraries/Types/CodegenTypes'; import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent'; -import type { ImageSource, UnsafeMixed } from './codegenTypes'; +type ImageSource = ImageURISource; /* interface MenuItem { diff --git a/packages/components/MenuButton/src/codegenTypes.d.ts b/packages/components/MenuButton/src/codegenTypes.d.ts deleted file mode 100644 index a183b13dd10..00000000000 --- a/packages/components/MenuButton/src/codegenTypes.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -// Separate .d.ts file to fool codegen, since ImageSource does not exist in the TS types of RN currently. -export type { ImageURISource as ImageSource } from 'react-native/Libraries/Image/ImageSource'; -export type UnsafeMixed = any; diff --git a/packages/experimental/Avatar/src/AvatarNative.types.ts b/packages/experimental/Avatar/src/AvatarNative.types.ts deleted file mode 100644 index 4dbfd51fbd4..00000000000 --- a/packages/experimental/Avatar/src/AvatarNative.types.ts +++ /dev/null @@ -1,13 +0,0 @@ -import type { ColorValue, ViewProps } from 'react-native'; - -import type { WithDefault } from 'react-native/Libraries/Types/CodegenTypes'; - -import type { ImageSource } from './codegenTypes'; - -export interface NativeProps extends ViewProps { - primaryText?: string; - secondaryText?: string; - imageSource?: ImageSource; - backgroundColor?: ColorValue; - size?: WithDefault<'size16' | 'size20' | 'size24' | 'size32' | 'size40' | 'size56' | 'size72', undefined>; -} diff --git a/packages/experimental/Avatar/src/AvatarNativeComponent.ios.ts b/packages/experimental/Avatar/src/AvatarNativeComponent.ios.ts deleted file mode 100644 index e69de29bb2d..00000000000 diff --git a/packages/experimental/Avatar/src/AvatarNativeComponent.macos.ts b/packages/experimental/Avatar/src/AvatarNativeComponent.macos.ts deleted file mode 100644 index 7ead367b2ed..00000000000 --- a/packages/experimental/Avatar/src/AvatarNativeComponent.macos.ts +++ /dev/null @@ -1,5 +0,0 @@ -import type { HostComponent } from 'react-native'; -import type { NativeProps } from './AvatarNative.types'; -import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent'; - -export default codegenNativeComponent('FRNAvatarView') as HostComponent; diff --git a/packages/experimental/Avatar/src/AvatarNativeComponent.ts b/packages/experimental/Avatar/src/AvatarNativeComponent.ts index 7f04c61c815..380dead2afb 100644 --- a/packages/experimental/Avatar/src/AvatarNativeComponent.ts +++ b/packages/experimental/Avatar/src/AvatarNativeComponent.ts @@ -1,5 +1,16 @@ +import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent'; import type { HostComponent } from 'react-native'; -import type { NativeProps } from './AvatarNative.types'; -import { requireNativeComponent } from 'react-native'; -export default requireNativeComponent('FRNAvatarView') as HostComponent; +import type { ColorValue, ViewProps, ImageURISource } from 'react-native'; + +import type { WithDefault } from 'react-native/Libraries/Types/CodegenTypes'; + +export interface NativeProps extends ViewProps { + primaryText?: string; + secondaryText?: string; + imageSource?: ImageURISource; + backgroundColor?: ColorValue; + size?: WithDefault<'size16' | 'size20' | 'size24' | 'size32' | 'size40' | 'size56' | 'size72', undefined>; +} + +export default codegenNativeComponent('FRNAvatarView') as HostComponent; diff --git a/packages/experimental/Avatar/src/codegenTypes.d.ts b/packages/experimental/Avatar/src/codegenTypes.d.ts deleted file mode 100644 index 2ee4e0427e8..00000000000 --- a/packages/experimental/Avatar/src/codegenTypes.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -// Separate .d.ts file to fool codegen, since ImageSource does not exist in the TS types of RN currently. -export type { ImageURISource as ImageSource } from 'react-native/Libraries/Image/ImageSource'; diff --git a/packages/experimental/Tooltip/src/TooltipNativeComponent.ts b/packages/experimental/Tooltip/src/TooltipNativeComponent.ts index dc1ff03199e..0ff09320d08 100644 --- a/packages/experimental/Tooltip/src/TooltipNativeComponent.ts +++ b/packages/experimental/Tooltip/src/TooltipNativeComponent.ts @@ -4,9 +4,12 @@ * @format */ -import type { HostComponent } from 'react-native'; -import type { NativeProps } from './Tooltip.types'; +import type { HostComponent, ViewProps } from 'react-native'; import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent'; +export interface NativeProps extends ViewProps { + content?: string; +} + export default codegenNativeComponent('RCTTooltip') as HostComponent; diff --git a/packages/experimental/Tooltip/src/TooltipNativeComponent.win32.ts b/packages/experimental/Tooltip/src/TooltipNativeComponent.win32.ts index 29d34186eb3..be485806ca8 100644 --- a/packages/experimental/Tooltip/src/TooltipNativeComponent.win32.ts +++ b/packages/experimental/Tooltip/src/TooltipNativeComponent.win32.ts @@ -1,6 +1,9 @@ -import type { HostComponent } from 'react-native'; -import type { NativeProps } from './Tooltip.types'; +import type { HostComponent, ViewProps } from 'react-native'; import { requireNativeComponent } from 'react-native'; +export interface NativeProps extends ViewProps { + content?: string; +} + export default requireNativeComponent('RCTTooltip') as HostComponent; diff --git a/packages/experimental/VibrancyView/src/VibrancyViewNativeComponent.macos.ts b/packages/experimental/VibrancyView/src/VibrancyViewNativeComponent.macos.ts index 8332e9b13fd..ea2d1c6d097 100644 --- a/packages/experimental/VibrancyView/src/VibrancyViewNativeComponent.macos.ts +++ b/packages/experimental/VibrancyView/src/VibrancyViewNativeComponent.macos.ts @@ -1,5 +1,27 @@ -import type { HostComponent } from 'react-native'; -import type { NativeProps } from './VibrancyView.types'; +import type { HostComponent, ViewProps } from 'react-native'; +import type { WithDefault } from 'react-native/Libraries/Types/CodegenTypes'; import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent'; +export interface NativeProps extends ViewProps { + material?: WithDefault< + | 'titlebar' + | 'selection' + | 'menu' + | 'popover' + | 'sidebar' + | 'headerview' + | 'sheet' + | 'windowbackground' + | 'hudWindow' + | 'fullScreenUI' + | 'toolTip' + | 'contentBackground' + | 'underWindowBackground' + | 'underPageBackground', + 'menu' + >; + blendingMode?: WithDefault<'behindWindow' | 'withinWindow', 'behindWindow'>; + state?: WithDefault<'followsWindowActiveState' | 'active' | 'inactive', 'followsWindowActiveState'>; +} + export default codegenNativeComponent('FRNVibrancyView') as HostComponent; diff --git a/packages/experimental/VibrancyView/src/VibrancyViewNativeComponent.ts b/packages/experimental/VibrancyView/src/VibrancyViewNativeComponent.ts index 612869c70ce..91028c47f01 100644 --- a/packages/experimental/VibrancyView/src/VibrancyViewNativeComponent.ts +++ b/packages/experimental/VibrancyView/src/VibrancyViewNativeComponent.ts @@ -1,4 +1,27 @@ -import type { NativeProps } from './VibrancyView.types'; +import type { ViewProps } from 'react-native'; +import type { WithDefault } from 'react-native/Libraries/Types/CodegenTypes'; import { requireNativeComponent } from 'react-native'; +export interface NativeProps extends ViewProps { + material?: WithDefault< + | 'titlebar' + | 'selection' + | 'menu' + | 'popover' + | 'sidebar' + | 'headerview' + | 'sheet' + | 'windowbackground' + | 'hudWindow' + | 'fullScreenUI' + | 'toolTip' + | 'contentBackground' + | 'underWindowBackground' + | 'underPageBackground', + 'menu' + >; + blendingMode?: WithDefault<'behindWindow' | 'withinWindow', 'behindWindow'>; + state?: WithDefault<'followsWindowActiveState' | 'active' | 'inactive', 'followsWindowActiveState'>; +} + export default requireNativeComponent('FRNVibrancyView');