From 18912938d3678f3edb3c209c5fcb358cb5ab998a Mon Sep 17 00:00:00 2001 From: Bernard Date: Wed, 10 Mar 2021 12:06:49 -0600 Subject: [PATCH] [NO_TICKET] Fix flag typing (#968) * Remove console.log * Generate typescript definition files for tsx files, and rely on manual type defs for jsx --- packages/design-system-scripts/gulp/build.js | 15 +++- .../createReactExampleWebpackConfig.js | 2 - .../src/types/FormControl/FormControl.d.ts | 86 ------------------- .../src/types/InlineError/InlineError.d.ts | 9 -- packages/design-system/src/types/index.d.ts | 7 +- 5 files changed, 17 insertions(+), 102 deletions(-) delete mode 100644 packages/design-system/src/types/FormControl/FormControl.d.ts delete mode 100644 packages/design-system/src/types/InlineError/InlineError.d.ts diff --git a/packages/design-system-scripts/gulp/build.js b/packages/design-system-scripts/gulp/build.js index 5fa79e7ad0..625419de3d 100644 --- a/packages/design-system-scripts/gulp/build.js +++ b/packages/design-system-scripts/gulp/build.js @@ -87,7 +87,15 @@ async function copyAll(dir, options) { */ async function generateTypeDefinitions(dir, changedPath) { const src = path.join(dir, 'src', 'components'); - const srcGlob = getSrcGlob(src, changedPath); + const srcGlob = changedPath + ? [changedPath`!${src}/**/*.{js,jsx}`] + : [ + `${src}/**/*.{ts,tsx}`, + `!${src}/**/*.{js,jsx}`, + `!${src}/setupTests.{js,jsx,ts,tsx}`, + `!${src}/**/*{.test,.spec,.d}.{js,jsx,ts,tsx}`, + `!${src}/**/{__mocks__,__tests__,helpers}/**/*`, + ]; const tsProject = ts.createProject('tsconfig.json', { declaration: true, @@ -174,9 +182,8 @@ function compileJs(dir, options, changedPath) { return compileEsmJs(dir, changedPath); }) .then(() => { - // If design system is using typescript, use tsc to generate definition files - // Core DS manually updates definition files - if (options.typescript && !options.core) { + // If design system is using typescript, use tsc to generate definition files for tsx files + if (options.typescript) { return generateTypeDefinitions(dir, changedPath); } }); diff --git a/packages/design-system-scripts/gulp/docs/webpack/createReactExampleWebpackConfig.js b/packages/design-system-scripts/gulp/docs/webpack/createReactExampleWebpackConfig.js index 901dd9dcfb..3849c8af07 100644 --- a/packages/design-system-scripts/gulp/docs/webpack/createReactExampleWebpackConfig.js +++ b/packages/design-system-scripts/gulp/docs/webpack/createReactExampleWebpackConfig.js @@ -22,8 +22,6 @@ module.exports = async function createReactExampleWebpackConfig( const entry = [...(additionalEntry ? [exampleEntryFile] : []), path.resolve(reactExampleEntry)]; - console.log(entry); - const config = { mode: process.env.NODE_ENV, entry, diff --git a/packages/design-system/src/types/FormControl/FormControl.d.ts b/packages/design-system/src/types/FormControl/FormControl.d.ts deleted file mode 100644 index b4edd70296..0000000000 --- a/packages/design-system/src/types/FormControl/FormControl.d.ts +++ /dev/null @@ -1,86 +0,0 @@ -import React from 'react'; -interface FormControlRenderProps { - id: string; - labelId: string; - errorId: string; - setRef: (elem: HTMLDivElement) => void; -} -interface FormControlProps { - /** - * Additional classes to be added to the field container. - */ - className?: string; - /** - * The HTML element used to render the container - */ - component: 'div' | 'fieldset'; - /** - * A unique ID to be used for the error message. If one isn't provided, a unique ID will be generated. - */ - errorId?: string; - errorMessage?: React.ReactNode; - /** - * Additional classes to be added to the error message - */ - errorMessageClassName?: string; - /** - * Location of the error message relative to the field input - */ - errorPlacement: 'top' | 'bottom'; - /** - * Used to focus the field input on `componentDidMount()` - */ - focusTrigger?: boolean; - /** - * Additional hint text to display - */ - hint?: React.ReactNode; - /** - * A unique ID to be used for the field input. If one isn't provided, a unique ID will be generated. - */ - id?: string; - /** - * Access a reference to the field input - */ - inputRef?: (elem: HTMLDivElement) => void; - /** - * Applies the "inverse" UI theme - */ - inversed?: boolean; - /** - * Label for the field. - */ - label: React.ReactNode; - /** - * Additional classes to be added to the field label - */ - labelClassName?: string; - /** - * The root HTML element used to render the field label - */ - labelComponent: 'label' | 'legend'; - /** - * A unique `id` to be used on the field label. If one isn't provided, a unique ID will be generated. - */ - labelId?: string; - /** - * Text showing the requirement ("Required", "Optional", etc.). See [Required and Optional Fields]({{root}}/guidelines/forms/#required-and-optional-fields). - */ - requirementLabel?: React.ReactNode; - /** - * A function that returns a field input element to accept render props - */ - render: (renderProps: FormControlRenderProps) => React.ReactNode; -} -export declare class FormControl extends React.Component { - constructor(props: FormControlProps); - componentDidMount(): void; - id: string; - labelId: string; - errorId: string; - inputRef?: HTMLDivElement; - setRef(elem: HTMLDivElement): void; - render(): React.ReactNode; -} -export declare const FormControlPropKeys: string[]; -export default FormControl; diff --git a/packages/design-system/src/types/InlineError/InlineError.d.ts b/packages/design-system/src/types/InlineError/InlineError.d.ts deleted file mode 100644 index 2d643c7b69..0000000000 --- a/packages/design-system/src/types/InlineError/InlineError.d.ts +++ /dev/null @@ -1,9 +0,0 @@ -import React from 'react'; -interface InlineErrorProps { - children?: React.ReactNode; - className?: string; - id?: string; - inversed?: boolean; -} -declare function InlineError({ children, className, id, inversed }: InlineErrorProps): React.ReactElement; -export default InlineError; diff --git a/packages/design-system/src/types/index.d.ts b/packages/design-system/src/types/index.d.ts index df21a49db9..fdf2240e90 100644 --- a/packages/design-system/src/types/index.d.ts +++ b/packages/design-system/src/types/index.d.ts @@ -30,4 +30,9 @@ export { default as TabPanel } from './Tabs/TabPanel'; export { default as TextField } from './TextField/TextField'; export { maskValue, unmaskValue } from './TextField/Mask'; export { default as UsaBanner } from './UsaBanner/UsaBanner'; -export { default as VerticalNav } from './VerticalNav/VerticalNav'; \ No newline at end of file +export { default as VerticalNav } from './VerticalNav/VerticalNav'; + +// Type definitions generated by cmsds scripts +export * from './InlineError/InlineError'; +export * from './FormControl/FormControl'; +export * from './flags';