Feat/incubator dialog small changes (#1843)

* Move types to the types file

* Remove extra components

* Support configuration and useCustomTheme

Author: M-i-k-e-l

generatedTypes/src/incubator/Dialog/DialogHeader.d.ts

@@ -1,4 +1,6 @@
-/// <reference types="react" />
+import React from 'react';
 import { DialogHeaderProps } from './types';
-declare const DialogHeader: (props?: DialogHeaderProps) => JSX.Element | null;
-export default DialogHeader;
+declare const _default: React.ComponentClass<DialogHeaderProps & {
+    useCustomTheme?: boolean | undefined;
+}, any>;
+export default _default;

generatedTypes/src/incubator/Dialog/index.d.ts

@@ -1,28 +1,7 @@
 import React from 'react';
-import { StyleProp, ViewStyle } from 'react-native';
-import { ImperativeDialogProps, DialogDirections, DialogDirectionsEnum, DialogHeaderProps, DialogTextProps } from './types';
-export { DialogDirections, DialogDirectionsEnum, DialogHeaderProps, DialogTextProps };
-export interface DialogProps extends Omit<ImperativeDialogProps, 'initialVisibility'> {
-    /**
-     * The visibility of the dialog.
-     */
-    visible?: boolean;
-    /**
-     * The Dialog's header
-     */
-    headerProps?: DialogHeaderProps;
-    /**
-     * The Dialog`s container style (it is set to {position: 'absolute'})
-     */
-    containerStyle?: StyleProp<ViewStyle>;
-}
-declare const Dialog: {
-    (props: DialogProps): JSX.Element;
-    displayName: string;
-    directions: typeof import("../panView").PanningDirectionsEnum;
-    Header: (props?: DialogHeaderProps) => JSX.Element | null;
-    Text: React.MemoExoticComponent<(props: Pick<DialogHeaderProps, "text">) => JSX.Element | null>;
-    Knob: React.MemoExoticComponent<(props: Pick<DialogHeaderProps, "showKnob">) => JSX.Element | null>;
-    Divider: React.MemoExoticComponent<(props: Pick<DialogHeaderProps, "showDivider">) => JSX.Element | null>;
-};
-export default Dialog;
+import { DialogProps, DialogDirections, DialogDirectionsEnum, DialogHeaderProps } from './types';
+export { DialogProps, DialogDirections, DialogDirectionsEnum, DialogHeaderProps };
+declare const _default: React.ComponentClass<DialogProps & {
+    useCustomTheme?: boolean | undefined;
+}, any>;
+export default _default;

generatedTypes/src/incubator/Dialog/types.d.ts

@@ -1,5 +1,5 @@
 import { PropsWithChildren } from 'react';
-import { StyleProp, TextStyle } from 'react-native';
+import { StyleProp, TextStyle, ViewStyle } from 'react-native';
 import { AlignmentModifiers } from '../../commons/modifiers';
 import { ModalProps } from '../../components/modal';
 import { ViewProps } from '../../components/view';
@@ -44,9 +44,6 @@ export interface ImperativeDialogMethods {
     open: () => void;
     close: () => void;
 }
-/**
- * It is available as `Dialog.Text`
- */
 export interface DialogTextProps {
     /**
      * Title
@@ -84,12 +81,24 @@ export interface DialogHeaderProps extends ViewProps {
     renderContent?: (props: DialogHeaderProps) => React.ReactElement;
     /**
      * Show the header's knob (default is true)
-     * It is available as `Dialog.Knob`
      */
     showKnob?: boolean;
     /**
      * Show the header's divider (default is true)
-     * It is available as `Dialog.Divider`
      */
     showDivider?: boolean;
 }
+export interface DialogProps extends Omit<ImperativeDialogProps, 'initialVisibility'> {
+    /**
+     * The visibility of the dialog.
+     */
+    visible?: boolean;
+    /**
+     * The Dialog's header
+     */
+    headerProps?: DialogHeaderProps;
+    /**
+     * The Dialog`s container style (it is set to {position: 'absolute'})
+     */
+    containerStyle?: StyleProp<ViewStyle>;
+}

generatedTypes/src/incubator/index.d.ts

@@ -7,4 +7,4 @@ export { default as WheelPicker, WheelPickerProps, WheelPickerItemProps } from '
 export { WheelPickerAlign } from './WheelPicker/types';
 export { default as PanView, PanViewProps, PanViewDirections, PanViewDismissThreshold } from './panView';
 export { default as TransitionView, TransitionViewProps, TransitionViewDirection, TransitionViewDirectionEnum, TransitionViewAnimationType } from './TransitionView';
-export { default as Dialog, DialogProps, DialogHeaderProps, DialogTextProps } from './Dialog';
+export { default as Dialog, DialogProps, DialogHeaderProps } from './Dialog';

src/incubator/Dialog/DialogHeader.tsx

@@ -1,5 +1,6 @@
 import {isEmpty} from 'lodash';
 import React, {useMemo} from 'react';
+import {asBaseComponent} from '../../commons/new';
 import View from '../../components/view';
 import DialogText from './DialogText';
 import DialogKnob from './DialogKnob';
@@ -31,4 +32,4 @@ const DialogHeader = (props: DialogHeaderProps = {}) => {
   return null;
 };
 
-export default DialogHeader;
+export default asBaseComponent<DialogHeaderProps>(DialogHeader);

src/incubator/Dialog/index.tsx

@@ -1,38 +1,13 @@
 import React, {useRef, useMemo} from 'react';
-import {StyleSheet, StyleProp, ViewStyle} from 'react-native';
+import {StyleSheet} from 'react-native';
 import {Spacings, Colors, BorderRadiuses} from 'style';
-import {Constants} from '../../commons/new';
+import {asBaseComponent, Constants} from '../../commons/new';
 import {useDidUpdate} from 'hooks';
 import View from '../../components/view';
 import ImperativeDialog from './ImperativeDialog';
 import DialogHeader from './DialogHeader';
-import DialogText from './DialogText';
-import DialogKnob from './DialogKnob';
-import DialogDivider from './DialogDivider';
-import {
-  ImperativeDialogProps,
-  DialogDirections,
-  DialogDirectionsEnum,
-  ImperativeDialogMethods,
-  DialogHeaderProps,
-  DialogTextProps
-} from './types';
-export {DialogDirections, DialogDirectionsEnum, DialogHeaderProps, DialogTextProps};
-
-export interface DialogProps extends Omit<ImperativeDialogProps, 'initialVisibility'> {
-  /**
-   * The visibility of the dialog.
-   */
-  visible?: boolean;
-  /**
-   * The Dialog's header
-   */
-  headerProps?: DialogHeaderProps;
-  /**
-   * The Dialog`s container style (it is set to {position: 'absolute'})
-   */
-  containerStyle?: StyleProp<ViewStyle>;
-}
+import {DialogProps, DialogDirections, DialogDirectionsEnum, ImperativeDialogMethods, DialogHeaderProps} from './types';
+export {DialogProps, DialogDirections, DialogDirectionsEnum, DialogHeaderProps};
 
 const Dialog = (props: DialogProps) => {
   const {visible, headerProps, containerStyle, children, ...others} = props;
@@ -64,11 +39,8 @@ const Dialog = (props: DialogProps) => {
 Dialog.displayName = 'Incubator.Dialog';
 Dialog.directions = DialogDirectionsEnum;
 Dialog.Header = DialogHeader;
-Dialog.Text = DialogText;
-Dialog.Knob = DialogKnob;
-Dialog.Divider = DialogDivider;
 
-export default Dialog;
+export default asBaseComponent<DialogProps>(Dialog);
 
 const styles = StyleSheet.create({
   defaultDialogStyle: {

src/incubator/Dialog/types.ts

@@ -1,5 +1,5 @@
 import {PropsWithChildren} from 'react';
-import {StyleProp, TextStyle} from 'react-native';
+import {StyleProp, TextStyle, ViewStyle} from 'react-native';
 import {AlignmentModifiers} from '../../commons/modifiers';
 import {ModalProps} from '../../components/modal';
 import {ViewProps} from '../../components/view';
@@ -48,9 +48,6 @@ export interface ImperativeDialogMethods {
   close: () => void;
 }
 
-/**
- * It is available as `Dialog.Text`
- */
 export interface DialogTextProps {
   /**
    * Title
@@ -89,12 +86,25 @@ export interface DialogHeaderProps extends ViewProps {
   renderContent?: (props: DialogHeaderProps) => React.ReactElement;
   /**
    * Show the header's knob (default is true)
-   * It is available as `Dialog.Knob`
    */
   showKnob?: boolean;
   /**
    * Show the header's divider (default is true)
-   * It is available as `Dialog.Divider`
    */
   showDivider?: boolean;
 }
+
+export interface DialogProps extends Omit<ImperativeDialogProps, 'initialVisibility'> {
+  /**
+   * The visibility of the dialog.
+   */
+  visible?: boolean;
+  /**
+   * The Dialog's header
+   */
+  headerProps?: DialogHeaderProps;
+  /**
+   * The Dialog`s container style (it is set to {position: 'absolute'})
+   */
+  containerStyle?: StyleProp<ViewStyle>;
+}

src/incubator/index.ts

@@ -14,4 +14,4 @@ export {
   TransitionViewDirectionEnum,
   TransitionViewAnimationType
 } from './TransitionView';
-export {default as Dialog, DialogProps, DialogHeaderProps, DialogTextProps} from './Dialog';
+export {default as Dialog, DialogProps, DialogHeaderProps} from './Dialog';