chore: generate types 🎉

scripts/generate-types/generateTypes.js

@@ -11,6 +11,7 @@ const paths = require('../../config/paths');
 const parsePropTypesVariables = require('./babel-plugin-proptype-vars');
 const copyTypes = require('./copyTypes');
 const typesPostFixes = require('./typesPostFixes');
+const pkg = require('../../package.json');
 
 // Makes the script crash on unhandled rejections instead of silently
 // ignoring them. In the future, promise rejections that are not handled will
@@ -122,7 +123,7 @@ async function generateTypeDefs() {
         console.log(chalk.green.bold(`Generated type defs for ${component.componentName}`));
 
         const output = typesPostFixes(component.componentName, result);
-        const prettifiedOutput = prettier.format(output, { parser: 'typescript' });
+        const prettifiedOutput = prettier.format(output, { parser: 'typescript', ...pkg.prettier });
 
         const fileName = `${component.relPath}${component.fileName.replace(/\.jsx$/, '.d.ts')}`;
         // put definition files in corresponding src/components/* folder

src/components/Accordion/index.d.ts

@@ -0,0 +1,33 @@
+import * as React from 'react';
+import Panel from '../Panel';
+
+export type AccordionMaxExpand = number | 'max';
+
+export interface AccordionProps {
+  /**
+   * render `data-test-selector` onto the component. It can be useful for testing.
+   */
+  dts?: string;
+  /**
+   * onPanelClick(panelId) takes in a single parameter which is the id of the clicked panel.
+   */
+  onPanelClick?: (...args: any[]) => any;
+  /**
+   * <span>
+   * Accept an array of <a href="/panel-example">Panel</a> or
+   * <a href="/accordion-panel-example">Accordion.Panel</a>
+   * </span>
+   */
+  children?: React.ReactNode;
+  defaultActivePanelIds?: string[];
+  /**
+   * Determine how many Panels can be expanded, accepted value is a positive number, or <code>max</code> to have no restriction
+   */
+  maxExpand?: AccordionMaxExpand;
+}
+
+declare const Accordion: React.FC<AccordionProps> & {
+  Panel: typeof Panel;
+};
+
+export default Accordion;

src/components/ActionPanel/index.d.ts

@@ -0,0 +1,19 @@
+import * as React from 'react';
+
+export type ActionPanelSize = 'small' | 'medium' | 'large';
+
+export interface ActionPanelProps {
+  title: React.ReactNode;
+  className?: string;
+  size?: ActionPanelSize;
+  onClose: (...args: any[]) => any;
+  children: React.ReactNode;
+  actionButton?: React.ReactNode;
+  closeIcon?: React.ReactNode;
+  isModal?: boolean;
+  cancelText?: string;
+}
+
+declare const ActionPanel: React.FC<ActionPanelProps>;
+
+export default ActionPanel;

src/components/Alert/index.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+
+export type AlertType = 'success' | 'info' | 'warning' | 'danger';
+
+export interface AlertProps {
+  /**
+   * ['success', 'info', 'warning', 'danger']
+   */
+  type?: AlertType;
+  children: React.ReactNode;
+  dts?: string;
+}
+
+declare const Alert: React.FC<AlertProps>;
+
+export default Alert;

src/components/AlertInput/index.d.ts

@@ -0,0 +1,48 @@
+import * as React from 'react';
+
+export type AlertInputAlertStatus = 'success' | 'info' | 'warning' | 'error';
+
+export type AlertInputPopoverPlacement =
+  | 'auto'
+  | 'top'
+  | 'right'
+  | 'bottom'
+  | 'left'
+  | 'auto-start'
+  | 'top-start'
+  | 'right-start'
+  | 'bottom-start'
+  | 'left-start'
+  | 'auto-end'
+  | 'top-end'
+  | 'right-end'
+  | 'bottom-end'
+  | 'left-end';
+
+export interface AlertInputProps {
+  className?: string;
+  dts?: string;
+  disabled?: boolean;
+  prefixAddon?: React.ReactNode;
+  suffixAddon?: React.ReactNode;
+  /**
+   * <span>
+   * As <code>success</code> is assumed, and help is always displayed independently, the accepted pattern is to
+   * only use <code>warning</code> and <code>error</code> feedback states with this component. Otherwise leave
+   * type undefined for <code>success</code>.
+   * </span>
+   */
+  alertStatus?: AlertInputAlertStatus;
+  /**
+   * 'left', 'top', 'top-start', 'top-end', 'bottom-start', 'bottom', 'bottom-end', 'right'
+   */
+  popoverPlacement?: AlertInputPopoverPlacement;
+  alertMessage?: string;
+  onValueChange?: (...args: any[]) => any;
+  onBlur?: (...args: any[]) => any;
+  onFocus?: (...args: any[]) => any;
+}
+
+export default class AlertInput extends React.Component<AlertInputProps, any> {
+  render(): JSX.Element;
+}

src/components/Avatar/index.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+
+export type AvatarColor = 'blue' | 'green' | 'red' | 'orange' | 'cyan' | 'black';
+
+export interface AvatarProps {
+  /**
+   * PropTypes.oneOf(['blue', 'green', 'red', 'orange', 'cyan', 'black'])
+   */
+  color?: AvatarColor;
+  givenName?: string;
+  tooltip?: string;
+  image?: string;
+  surname?: string;
+}
+
+declare const Avatar: React.FC<AvatarProps>;
+
+export default Avatar;

src/components/BorderedWell/index.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+
+export interface BorderedWellProps {
+  children?: React.ReactNode;
+}
+
+declare const BorderedWell: React.FC<BorderedWellProps>;
+
+export default BorderedWell;

src/components/Breadcrumb/Node/index.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+
+export interface BreadcrumbNodeNode {
+  id: string;
+  label: string;
+}
+
+export interface BreadcrumbNodeProps {
+  isLast: boolean;
+  node?: BreadcrumbNodeNode;
+  onClick: (...args: any[]) => any;
+}
+
+declare const BreadcrumbNode: React.FC<BreadcrumbNodeProps>;
+
+export default BreadcrumbNode;

src/components/Breadcrumb/index.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+
+export interface BreadcrumbRootNode {
+  id: string;
+  label: string;
+}
+
+export interface BreadcrumbNodes {
+  id: string;
+  label: string;
+}
+
+export interface BreadcrumbProps {
+  rootNode?: BreadcrumbRootNode;
+  divider?: React.ReactNode;
+  nodes?: BreadcrumbNodes[];
+  onClick?: (...args: any[]) => any;
+  disabled?: boolean;
+}
+
+declare const Breadcrumb: React.FC<BreadcrumbProps>;
+
+export default Breadcrumb;

src/components/Button/index.d.ts

@@ -0,0 +1,38 @@
+import * as React from 'react';
+
+export type ButtonTheme = 'default' | 'primary' | 'success' | 'info' | 'warning' | 'danger' | 'link';
+
+export type ButtonTarget = '_blank' | '_self' | '_parent' | '_top';
+
+export type ButtonSize = 'small' | 'large';
+
+export type ButtonType = 'button' | 'reset' | 'submit';
+
+export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+  /**
+   * PropTypes.oneOf(['primary', 'success', 'info', 'warning', 'danger', 'link'])
+   */
+  theme?: ButtonTheme;
+  className?: string;
+  dts?: string;
+  href?: string;
+  /**
+   * The target attribute specifies where to open the linked document when there is a defined 'href',
+   * PropTypes.oneOf(['_blank', '_self', '_parent', '_top'])
+   */
+  target?: ButtonTarget;
+  inverse?: boolean;
+  isLoading?: boolean;
+  /**
+   * PropTypes.oneOf(['small', 'large'])
+   */
+  size?: ButtonSize;
+  /**
+   * PropTypes.oneOf(['button', 'reset', 'submit'])
+   */
+  type?: ButtonType;
+}
+
+declare const Button: React.FC<ButtonProps>;
+
+export default Button;

src/components/ButtonGroup/index.d.ts

@@ -0,0 +1,19 @@
+import * as React from 'react';
+
+export type ButtonGroupTheme = 'primary' | 'success' | 'info' | 'warning' | 'danger' | 'link';
+
+export interface ButtonGroupProps {
+  dts?: string;
+  children?: React.ReactNode;
+  /**
+   * PropTypes.oneOf(['primary', 'success', 'info', 'warning', 'danger', 'link'])
+   */
+  theme?: ButtonGroupTheme;
+  inverse?: boolean;
+  disabled?: boolean;
+  size?: string;
+}
+
+export default class ButtonGroup extends React.Component<ButtonGroupProps, any> {
+  render(): JSX.Element;
+}

src/components/Card/index.d.ts

@@ -0,0 +1,31 @@
+import * as React from 'react';
+
+export interface CardProps {
+  /**
+   * arrayOf Card.Content
+   */
+  children: React.ReactNode;
+  className?: string;
+  accent?: string;
+  dts?: string;
+}
+
+declare const Card: React.FC<CardProps>;
+
+export interface CardContentProps {
+  children: React.ReactNode;
+  className?: string;
+  fill?: boolean;
+  stretch?: boolean;
+  append?: boolean;
+  dts?: string;
+}
+
+declare const CardContent: React.FC<CardContentProps>;
+
+declare const _default: {
+  Container: typeof Card;
+  Content: typeof CardContent;
+};
+
+export default _default;

src/components/Carousel/index.d.ts

@@ -0,0 +1,25 @@
+import type { Settings } from 'react-slick';
+import * as React from 'react';
+
+export interface CarouselProps {
+  className?: string;
+  children?: React.ReactNode;
+  autoplay?: boolean;
+  variableWidth?: boolean;
+  autoplaySpeed?: number;
+  slidesToShow?: number;
+  dots?: boolean;
+}
+
+declare const usePreventCarouselSwipeClicks: () => {
+  onMouseDownCapture: (e: any) => void;
+  onClickCapture: (e: any) => void;
+};
+
+declare const Carousel: React.ForwardRefExoticComponent<
+  React.PropsWithoutRef<CarouselProps & Settings> & React.RefAttributes<((...args: any[]) => any) | Element>
+> & {
+  usePreventSwipeClicks: typeof usePreventCarouselSwipeClicks;
+};
+
+export default Carousel;

src/components/Checkbox/index.d.ts

@@ -0,0 +1,48 @@
+import * as React from 'react';
+
+export type CheckboxChecked = boolean | 'partial';
+
+export interface CheckboxProps {
+  /**
+   * id for the checkbox input
+   */
+  id?: string;
+  className?: string;
+  /**
+   * name for the checkbox input
+   */
+  name?: string;
+  /**
+   * checkBox label for the checkbox input
+   */
+  label?: React.ReactNode;
+  /**
+   * checkBox input value
+   */
+  value?: string;
+  /**
+   * data-test-selector for the checkbox component
+   */
+  dts?: string;
+  /**
+   * determines if the checkbox is disabled
+   */
+  disabled?: boolean;
+  /**
+   * function called when checkBox onChange event is fired
+   */
+  onChange?: (...args: any[]) => any;
+  /**
+   * determines if checkbox-component-inline class is applied or not
+   */
+  inline?: boolean;
+  /**
+   * checked status of the input checkBox: oneOf([true, false, 'partial']
+   */
+  checked?: CheckboxChecked;
+  size?: number;
+}
+
+declare const Checkbox: React.FC<CheckboxProps>;
+
+export default Checkbox;