Merge pull request #4 from thompsongl/steps-exports

euistep export updates
elizabetdev · May 14, 2020 · cb57335 · cb57335
2 parents 7afda6f + 55f1a11
commit cb57335
Show file tree

Hide file tree

Showing 5 changed files with 37 additions and 28 deletions.
diff --git a/src/components/steps/step.tsx b/src/components/steps/step.tsx
@@ -28,7 +28,7 @@ import { EuiStepStatus, EuiStepNumber } from './step_number';
 
 import { EuiI18n } from '../i18n';
 
-export interface EuiStepProps {
+export interface EuiStepInterface {
   children: ReactNode;
   /**
    * The HTML tag used for the title
@@ -49,11 +49,11 @@ export interface EuiStepProps {
   titleSize?: Exclude<EuiTitleProps['size'], 'xxxs' | 'xxs' | 'l'>;
 }
 
-export type StandaloneEuiStepProps = CommonProps &
+export type EuiStepProps = CommonProps &
   HTMLAttributes<HTMLDivElement> &
-  EuiStepProps;
+  EuiStepInterface;
 
-export const EuiStep: FunctionComponent<StandaloneEuiStepProps> = ({
+export const EuiStep: FunctionComponent<EuiStepProps> = ({
   className,
   children,
   headingElement = 'p',

diff --git a/src/components/steps/step_horizontal.tsx b/src/components/steps/step_horizontal.tsx
@@ -30,7 +30,9 @@ import { EuiScreenReaderOnly, EuiKeyboardAccessible } from '../accessibility';
 
 import { EuiStepStatus, EuiStepNumber } from './step_number';
 
-export interface EuiStepHorizontalProps {
+export interface EuiStepHorizontalProps
+  extends CommonProps,
+    HTMLAttributes<HTMLDivElement> {
   /**
    * Is the current step
    */
@@ -53,9 +55,7 @@ export interface EuiStepHorizontalProps {
   status?: EuiStepStatus;
 }
 
-export const EuiStepHorizontal: FunctionComponent<
-  CommonProps & HTMLAttributes<HTMLDivElement> & EuiStepHorizontalProps
-> = ({
+export const EuiStepHorizontal: FunctionComponent<EuiStepHorizontalProps> = ({
   className,
   step = 1,
   title,

diff --git a/src/components/steps/step_number.tsx b/src/components/steps/step_number.tsx
@@ -22,7 +22,7 @@ import classNames from 'classnames';
 
 import { EuiIcon } from '../icon';
 
-import { StandaloneEuiStepProps } from './step';
+import { EuiStepProps } from './step';
 
 import { EuiI18n } from '../i18n';
 import { CommonProps, keysOf } from '../common';
@@ -44,7 +44,9 @@ export type EuiStepStatus =
   | 'danger'
   | 'disabled';
 
-export interface EuiStepNumberProps {
+export interface EuiStepNumberProps
+  extends CommonProps,
+    HTMLAttributes<HTMLDivElement> {
   /**
    * May replace the number provided in props.number with alternate styling
    */
@@ -57,14 +59,17 @@ export interface EuiStepNumberProps {
   /**
    * Title sizing equivalent to EuiTitle, but only `m`, `s` and `xs`. Defaults to `s`
    */
-  titleSize?: StandaloneEuiStepProps['titleSize'];
+  titleSize?: EuiStepProps['titleSize'];
 }
 
-export const EuiStepNumber: FunctionComponent<
-  CommonProps & HTMLAttributes<HTMLDivElement> & EuiStepNumberProps
-  // Note - tslint:disable refers to the `number` as it conflicts with the build in number type
-  // tslint:disable-next-line:variable-name
-> = ({ className, status, number, isHollow, titleSize, ...rest }) => {
+export const EuiStepNumber: FunctionComponent<EuiStepNumberProps> = ({
+  className,
+  status,
+  number,
+  isHollow,
+  titleSize,
+  ...rest
+}) => {
   const classes = classNames(
     'euiStepNumber',
     status ? statusToClassNameMap[status] : undefined,

diff --git a/src/components/steps/steps.tsx b/src/components/steps/steps.tsx
@@ -21,11 +21,13 @@ import React, { FunctionComponent, HTMLAttributes } from 'react';
 import { CommonProps } from '../common';
 import classNames from 'classnames';
 
-import { StandaloneEuiStepProps, EuiStep } from './step';
+import { EuiStepProps, EuiStep } from './step';
 
-export type EuiContainedStepProps = Omit<StandaloneEuiStepProps, 'step'>;
+export type EuiContainedStepProps = Omit<EuiStepProps, 'step'>;
 
-export interface EuiStepsProps {
+export interface EuiStepsProps
+  extends CommonProps,
+    HTMLAttributes<HTMLDivElement> {
   /**
    * An array of `EuiStep` objects excluding the `step` prop
    */
@@ -41,14 +43,14 @@ export interface EuiStepsProps {
   /**
    * Title sizing equivalent to EuiTitle, but only `m`, `s` and `xs`. Defaults to `s`
    */
-  titleSize?: StandaloneEuiStepProps['titleSize'];
+  titleSize?: EuiStepProps['titleSize'];
 }
 
 function renderSteps(
   steps: EuiContainedStepProps[],
   firstStepNumber: number,
   headingElement: string,
-  titleSize?: StandaloneEuiStepProps['titleSize']
+  titleSize?: EuiStepProps['titleSize']
 ) {
   return steps.map((step, index) => {
     const { className, children, title, status, ...rest } = step;
@@ -69,9 +71,7 @@ function renderSteps(
   });
 }
 
-export const EuiSteps: FunctionComponent<
-  CommonProps & HTMLAttributes<HTMLDivElement> & EuiStepsProps
-> = ({
+export const EuiSteps: FunctionComponent<EuiStepsProps> = ({
   className,
   firstStepNumber = 1,
   headingElement = 'p',

diff --git a/src/components/steps/steps_horizontal.tsx b/src/components/steps/steps_horizontal.tsx
@@ -25,7 +25,9 @@ import { EuiStepHorizontalProps, EuiStepHorizontal } from './step_horizontal';
 
 type ContainedEuiStepHorizontalProps = Omit<EuiStepHorizontalProps, 'step'>;
 
-export interface EuiStepsHorizontalProps {
+export interface EuiStepsHorizontalProps
+  extends CommonProps,
+    HTMLAttributes<HTMLDivElement> {
   /**
    * An array of `EuiStepHorizontal` objects excluding the `step` prop
    */
@@ -38,9 +40,11 @@ function renderHorizontalSteps(steps: ContainedEuiStepHorizontalProps[]) {
   });
 }
 
-export const EuiStepsHorizontal: FunctionComponent<
-  CommonProps & HTMLAttributes<HTMLDivElement> & EuiStepsHorizontalProps
-> = ({ className, steps, ...rest }) => {
+export const EuiStepsHorizontal: FunctionComponent<EuiStepsHorizontalProps> = ({
+  className,
+  steps,
+  ...rest
+}) => {
   const classes = classNames('euiStepsHorizontal', className);
 
   return (