@atlaskit/forge-react-types 0.2.1 → 0.4.0

package/dist/types-ts4.5/components/__generated__/types.codegen.d.ts

@@ -0,0 +1,32 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ *
+ * Shared types file from UIKit 2
+ *
+ * @codegen <<SignedSource::876fcb93a6505f3c3d8febc6657b1016>>
+ * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/types.ts <<SignedSource::4c43233e6c4a02225fbb326afeddd9f7>>
+ */
+export type SerialisableEvent = {
+    bubbles: boolean;
+    cancelable: boolean;
+    defaultPrevented: boolean;
+    eventPhase: number;
+    isTrusted: boolean;
+    nativeEvent: any;
+    target: {
+        value?: any;
+        checked?: boolean;
+        name?: string;
+        id?: string;
+        tagName?: string;
+        type?: string;
+    };
+    timeStamp: number;
+    type: string;
+};
+export type EventHandlerProps = {
+    onChange?: (event: SerialisableEvent) => void;
+    onBlur?: (event: SerialisableEvent) => void;
+    onFocus?: (event: SerialisableEvent) => void;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/forge-react-types",
-  "version": "0.2.1",
+  "version": "0.4.0",
   "description": "Component types for Forge UI Kit React components",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -34,7 +34,7 @@
     "@atlaskit/heading": "^1.6.0",
     "@atlaskit/lozenge": "^11.6.0",
     "@atlaskit/modal-dialog": "^12.10.0",
-    "@atlaskit/primitives": "^2.0.0",
+    "@atlaskit/primitives": "^2.1.0",
     "@atlaskit/progress-bar": "2.0.1",
     "@atlaskit/progress-tracker": "8.5.6",
     "@atlaskit/radio": "^6.0.0",

package/scripts/codegen/codeGenerator.ts

@@ -125,24 +125,37 @@ class ImportDeclarationProxy {
   }
 
   public getText() {
+    const code = this.base.getText();
+    const match = code.match(
+      /^(import |import type ){(.+)} from ['"](.+)['"];$/,
+    );
+    if (!match) {
+      return this.base.getText();
+    }
+    let [_, importStatement, importedNames, packageName] = match;
+    importedNames = importedNames.trim();
+
+    if (isSharedUIKit2TypesImport(this.base)) {
+      packageName = './types.codegen';
+    }
     if (this.removedNamedImports.size > 0) {
-      const code = this.base.getText();
-      const matches = code.match(
-        /^(import |import type ){(.+)} from \'(.+)\';$/,
-      )!;
-      const importedNames = matches[2]!
+      importedNames = importedNames!
         .split(',')
         .map((text) => text.trim())
-        .filter((text) => !this.removedNamedImports.has(text));
-
-      return `${matches[1]}{ ${importedNames.join(', ')} } from '${
-        matches[3]
-      }';`;
+        .filter((text) => !this.removedNamedImports.has(text))
+        .join(', ');
     }
-    return this.base.getText();
+    return `${importStatement}{ ${importedNames} } from '${packageName}';`;
   }
 }
 
+const isSharedUIKit2TypesImport = (importDeclaration: ImportDeclaration) => {
+  return (
+    importDeclaration.isTypeOnly() &&
+    importDeclaration.getModuleSpecifierValue() === '../../types'
+  );
+};
+
 const extractImportDeclarations = (
   sourceFile: SourceFile,
   componentPropSymbol: Symbol,
@@ -161,9 +174,14 @@ const extractImportDeclarations = (
     .getImportDeclarations()
     .filter((declaration) => {
       const moduleSpecifier = declaration.getModuleSpecifierValue();
-      // only keep dependencies from @atlaskit and react
+      // only keep dependencies from
+      // - @atlaskit
+      // - react
+      // - or '../../types'
       return (
-        moduleSpecifier.startsWith('@atlaskit/') || moduleSpecifier === 'react'
+        moduleSpecifier.startsWith('@atlaskit/') ||
+        moduleSpecifier === 'react' ||
+        isSharedUIKit2TypesImport(declaration)
       );
     })
     .reduce<ImportDeclarationProxy[]>((declarations, declaration) => {

package/scripts/codegen/componentPropTypes.ts

@@ -228,6 +228,32 @@ const updatePackageJsonWithADSComponentDependencies = (
   fs.writeFileSync(packageJsonPath, JSON.stringify(packageJson, null, 2));
 };
 
+/**
+ * This copies types file from the types file in UIKit2-codegen
+ * to __generated__ folder.
+ */
+const generateSharedTypesFile = (componentOutputDir: string) => {
+  // eslint-disable-next-line no-console
+  console.log('Generating shared types file');
+
+  const uiKit2TypesFile = require.resolve(
+    '@atlassian/forge-ui/src/components/UIKit2-codegen/types',
+  );
+
+  const signedSourceCode = createSignedArtifact(
+    fs.readFileSync(uiKit2TypesFile, 'utf8'),
+    'yarn workspace @atlaskit/forge-react-types codegen',
+    {
+      description: 'Shared types file from UIKit 2',
+      dependencies: [uiKit2TypesFile],
+      outputFolder: componentOutputDir,
+    },
+  );
+
+  const typesFilePath = resolve(componentOutputDir, 'types.codegen.ts');
+  fs.writeFileSync(typesFilePath, signedSourceCode);
+};
+
 const generateComponentPropTypes = (componentPropTypeFilter?: string) => {
   const componentOutputDir = resolve(
     __dirname,
@@ -248,6 +274,9 @@ const generateComponentPropTypes = (componentPropTypeFilter?: string) => {
       )
       .sort((a, b) => a.getName().localeCompare(b.getName()));
 
+    // generate share types file first
+    generateSharedTypesFile(componentOutputDir);
+
     generateComponentPropTypeSourceFiles(
       componentOutputDir,
       componentPropTypeSymbols,

package/src/components/__generated__/BoxProps.codegen.tsx

@@ -3,9 +3,9 @@
  *
  * Extract component prop types from UIKit 2 components - BoxProps
  *
- * @codegen <<SignedSource::8309292dff495dc1e8e24268d3958b56>>
+ * @codegen <<SignedSource::d3c324dbe7016205a18cc6190b57ad19>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/box/__generated__/index.partial.tsx <<SignedSource::391296376275f3173652baee432184f1>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/box/__generated__/index.partial.tsx <<SignedSource::851605328aa816df414378c18c7104fe>>
  */
 /* eslint-disable @atlaskit/design-system/ensure-design-token-usage/preview */
 
@@ -17,22 +17,26 @@ import type * as CSS from 'csstype';
 import type { MediaQuery } from '@atlaskit/primitives';
 import { tokensMap } from '@atlaskit/primitives';
 type TokensMap = typeof tokensMap;
-type TokenisedProps = {
-    [K in keyof TokensMap]?: keyof TokensMap[K];
+type TokensMapPropKey = keyof TokensMap;
+type TokenizedProps = {
+    [K in TokensMapPropKey]?: keyof TokensMap[K];
 };
-type RelaxedTokenisedProps = {
-    [K in keyof TokensMap]?: keyof TokensMap[K] | CSSProperties[K];
+type RawCSSValue = string & {};
+type RelaxedTokenizedProps = {
+    [K in TokensMapPropKey]?: keyof TokensMap[K] | RawCSSValue;
 };
 type AllMedia = MediaQuery | '@media screen and (forced-colors: active), screen and (-ms-high-contrast: active)' | '@media (prefers-color-scheme: dark)' | '@media (prefers-color-scheme: light)' | '@media (prefers-reduced-motion: reduce)';
-type StandardCSSProps = Omit<CSSProperties, keyof TokenisedProps>;
-type SafeCSSObject<T extends keyof CSSProperties = keyof CSSProperties, R extends T = T, M extends StandardCSSProps = StandardCSSProps> = {
-    [MQ in AllMedia]?: Omit<SafeCSSObject<T, R>, AllMedia>;
+type StandardCSSProps = Omit<CSSProperties, TokensMapPropKey>;
+type RestrictedPropsSpec = RelaxedTokenizedProps & StandardCSSProps;
+type SafeCSSObject<SupportedPropKeys extends keyof CSSProperties = keyof CSSProperties, RawCSSPropKeys extends SupportedPropKeys = SupportedPropKeys, RestrictedProps extends RestrictedPropsSpec = RestrictedPropsSpec> = {
+    [MQ in AllMedia]?: Omit<SafeCSSObject<SupportedPropKeys, RawCSSPropKeys, RestrictedPropsSpec>, AllMedia>;
 } & {
-    [Pseudo in CSS.Pseudos]?: Omit<SafeCSSObject<T, R>, CSS.Pseudos | AllMedia>;
-} & Pick<TokenisedProps, Exclude<Extract<T, keyof TokenisedProps>, R>> & Pick<RelaxedTokenisedProps, Extract<R, keyof TokenisedProps>> & Pick<StandardCSSProps, Exclude<Extract<T, keyof StandardCSSProps>, keyof M>> & M;
+    [Pseudo in CSS.Pseudos]?: Omit<SafeCSSObject<SupportedPropKeys, RawCSSPropKeys, RestrictedPropsSpec>, CSS.Pseudos | AllMedia>;
+} & Pick<TokenizedProps, Exclude<Extract<SupportedPropKeys, TokensMapPropKey>, RawCSSPropKeys | keyof RestrictedProps>> & Pick<StandardCSSProps, Exclude<Extract<SupportedPropKeys, keyof StandardCSSProps>, RawCSSPropKeys | keyof RestrictedProps>> & // force standard css prop values for allowCSS: true
+Pick<CSSProperties, Extract<RawCSSPropKeys, keyof CSSProperties>> & RestrictedProps;
 type XCSSValidatorParam = {
     [key in keyof CSSProperties]: true | {
-        supportedValues: Array<CSSProperties[key]>;
+        supportedValues: Array<RestrictedPropsSpec[key]>;
     } | {
         allowCSS: true;
     };
@@ -47,16 +51,16 @@ type XCSSValidatorParam = {
  *    as specified in the supportedXCSSProps list. The props that are not supported will be removed from the
  *    returned style object and a warning will be logged in the console.
  */
-declare const makeXCSSValidator: <U extends XCSSValidatorParam>(supportedXCSSProps: U) => (styleObj: SafeCSSObject<keyof CSSProperties, keyof CSSProperties, StandardCSSProps> | SafeCSSObject<Extract<keyof U, keyof CSSProperties>, Extract<{ [K in Extract<keyof U, keyof CSSProperties>]: U[K] extends {
+declare const makeXCSSValidator: <U extends XCSSValidatorParam>(supportedXCSSProps: U) => (styleObj: SafeCSSObject<keyof CSSProperties, keyof CSSProperties, RestrictedPropsSpec> | SafeCSSObject<Extract<keyof U, keyof CSSProperties>, Extract<{ [K in Extract<keyof U, keyof CSSProperties>]: U[K] extends {
     allowCSS: true;
 } ? K : never; }[Extract<keyof U, keyof CSSProperties>], Extract<keyof U, keyof CSSProperties>>, { [K_2 in Extract<{ [K_1 in Extract<keyof U, keyof CSSProperties>]: U[K_1] extends {
-    supportedValues: CSSProperties[K_1][];
+    supportedValues: RestrictedPropsSpec[K_1][];
 } ? K_1 : never; }[Extract<keyof U, keyof CSSProperties>], Extract<keyof U, keyof CSSProperties>>]?: (U[K_2] extends {
     supportedValues: infer V;
 } ? Exclude<V[keyof V], number | Function> : never) | undefined; }>) => SafeCSSObject<Extract<keyof U, keyof CSSProperties>, Extract<{ [K in Extract<keyof U, keyof CSSProperties>]: U[K] extends {
     allowCSS: true;
 } ? K : never; }[Extract<keyof U, keyof CSSProperties>], Extract<keyof U, keyof CSSProperties>>, { [K_2 in Extract<{ [K_1 in Extract<keyof U, keyof CSSProperties>]: U[K_1] extends {
-    supportedValues: CSSProperties[K_1][];
+    supportedValues: RestrictedPropsSpec[K_1][];
 } ? K_1 : never; }[Extract<keyof U, keyof CSSProperties>], Extract<keyof U, keyof CSSProperties>>]?: (U[K_2] extends {
     supportedValues: infer V;
 } ? Exclude<V[keyof V], number | Function> : never) | undefined; }>;
@@ -124,26 +128,26 @@ const xcssValidator = makeXCSSValidator({
   paddingTop: true,
 
   // other box related props
-  borderRadius: true,
-  borderBottomLeftRadius: true,
-  borderBottomRightRadius: true,
-  borderTopLeftRadius: true,
-  borderTopRightRadius: true,
-  borderEndEndRadius: true,
-  borderEndStartRadius: true,
-  borderStartEndRadius: true,
-  borderStartStartRadius: true,
-  borderWidth: true,
-  borderBlockWidth: true,
-  borderBlockEndWidth: true,
-  borderBlockStartWidth: true,
-  borderBottomWidth: true,
-  borderInlineWidth: true,
-  borderInlineEndWidth: true,
-  borderInlineStartWidth: true,
-  borderLeftWidth: true,
-  borderRightWidth: true,
-  borderTopWidth: true,
+  borderRadius: { supportedValues: ['border.radius'] },
+  borderBottomLeftRadius: { supportedValues: ['border.radius'] },
+  borderBottomRightRadius: { supportedValues: ['border.radius'] },
+  borderTopLeftRadius: { supportedValues: ['border.radius'] },
+  borderTopRightRadius: { supportedValues: ['border.radius'] },
+  borderEndEndRadius: { supportedValues: ['border.radius'] },
+  borderEndStartRadius: { supportedValues: ['border.radius'] },
+  borderStartEndRadius: { supportedValues: ['border.radius'] },
+  borderStartStartRadius: { supportedValues: ['border.radius'] },
+  borderWidth: { supportedValues: ['border.width'] },
+  borderBlockWidth: { supportedValues: ['border.width'] },
+  borderBlockEndWidth: { supportedValues: ['border.width'] },
+  borderBlockStartWidth: { supportedValues: ['border.width'] },
+  borderBottomWidth: { supportedValues: ['border.width'] },
+  borderInlineWidth: { supportedValues: ['border.width'] },
+  borderInlineEndWidth: { supportedValues: ['border.width'] },
+  borderInlineStartWidth: { supportedValues: ['border.width'] },
+  borderLeftWidth: { supportedValues: ['border.width'] },
+  borderRightWidth: { supportedValues: ['border.width'] },
+  borderTopWidth: { supportedValues: ['border.width'] },
 
   // other props not in tokens based props
   borderTopStyle: {

package/src/components/__generated__/CheckboxProps.codegen.tsx

@@ -3,12 +3,13 @@
  *
  * Extract component prop types from UIKit 2 components - CheckboxProps
  *
- * @codegen <<SignedSource::56c904bc1a3ad0ed3621db32045cff13>>
+ * @codegen <<SignedSource::c3f249f62fc1e2dab7bc6a21a0681633>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/checkbox/__generated__/index.partial.tsx <<SignedSource::57649f2b33c0aec30c2ad0e41479c28b>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/checkbox/__generated__/index.partial.tsx <<SignedSource::e85d1dd9754f25c100758622ff6d2d91>>
  */
 import React from 'react';
 import PlatformCheckbox from '@atlaskit/checkbox';
+import type { EventHandlerProps } from './types.codegen';
 
 type PlatformCheckboxProps = React.ComponentProps<typeof PlatformCheckbox>;
 
@@ -16,4 +17,4 @@ export type CheckboxProps = Pick<
   PlatformCheckboxProps,
   'testId' | 'defaultChecked' | 'isChecked' | 'isIndeterminate' | 'label'
  | 'id' | 'isRequired' | 'isDisabled' | 'isInvalid' | 'onChange' | 'onBlur' | 'onFocus' | 'value' | 'aria-invalid' | 'aria-labelledby' | 'name'
->;
+> & Pick<EventHandlerProps, 'onChange' | 'onBlur' | 'onFocus'>;

package/src/components/__generated__/DynamicTableProps.codegen.tsx

@@ -3,9 +3,9 @@
  *
  * Extract component prop types from UIKit 2 components - DynamicTableProps
  *
- * @codegen <<SignedSource::8b04874579e3370bf65d66c376e70709>>
+ * @codegen <<SignedSource::3ec687a739b617f4cbe7a8969062cca9>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/dynamictable/__generated__/index.partial.tsx <<SignedSource::9c044f09ae44854b9f861a93462c004a>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/dynamictable/__generated__/index.partial.tsx <<SignedSource::027c1440c4dc132bea4898d69f352f23>>
  */
 import type { RowType, StatefulProps } from '@atlaskit/dynamic-table/types';
 

package/src/components/__generated__/FlexProps.codegen.tsx

@@ -3,9 +3,9 @@
  *
  * Extract component prop types from UIKit 2 components - FlexProps
  *
- * @codegen <<SignedSource::f8cf7fcd48be584224dc9b3dbbb9d394>>
+ * @codegen <<SignedSource::2660d61ae4436d4239c8c7ed6c343415>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/flex/__generated__/index.partial.tsx <<SignedSource::752cb9176f453cb3422d13a493b64a06>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/flex/__generated__/index.partial.tsx <<SignedSource::87ea6214c3b6ee4b2d36987f1682074e>>
  */
 import React from 'react';
 import { Flex as PlatformFlex } from '@atlaskit/primitives';

package/src/components/__generated__/GridProps.codegen.tsx

@@ -3,9 +3,9 @@
  *
  * Extract component prop types from UIKit 2 components - GridProps
  *
- * @codegen <<SignedSource::60e56f4ba271fccb01ee83e02659eb52>>
+ * @codegen <<SignedSource::4f326921dc60e223cfd0ba05be93a9eb>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/grid/__generated__/index.partial.tsx <<SignedSource::7f93ba0404d4e15e02f70341e423b955>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/grid/__generated__/index.partial.tsx <<SignedSource::82ef52184f696a17dcca4c8a84e23441>>
  */
 import React from 'react';
 import { Grid as PlatformGrid } from '@atlaskit/primitives';

package/src/components/__generated__/InlineProps.codegen.tsx

@@ -3,9 +3,9 @@
  *
  * Extract component prop types from UIKit 2 components - InlineProps
  *
- * @codegen <<SignedSource::1f9b9835477c3248e8ab5d01e9cdc22a>>
+ * @codegen <<SignedSource::807734fa360131f49ef4e7bb552bcb95>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/inline/__generated__/index.partial.tsx <<SignedSource::050cb8647981a5e0272677d7903f51eb>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/inline/__generated__/index.partial.tsx <<SignedSource::d8e43c17dbcecadc5f72802f65dc1eb4>>
  */
 import React from 'react';
 import { Inline as PlatformInline } from '@atlaskit/primitives';

package/src/components/__generated__/RadioGroupProps.codegen.tsx

@@ -3,12 +3,13 @@
  *
  * Extract component prop types from UIKit 2 components - RadioGroupProps
  *
- * @codegen <<SignedSource::cdab8c21bdbe308e0525c518987435f6>>
+ * @codegen <<SignedSource::f21dfcf68dcf1e2443af8b267b5a057f>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/radio/__generated__/radio-group.partial.tsx <<SignedSource::7d9b07f217be4924a1cf7755f682fb58>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/radio/__generated__/radio-group.partial.tsx <<SignedSource::2cbedc883c6d0fdf8e7f443d9ea14eb1>>
  */
 import React from 'react';
 import { RadioGroup as PlatformRadioGroup } from '@atlaskit/radio';
+import type { EventHandlerProps } from './types.codegen';
 
 type PlatformRadioGroupProps = React.ComponentProps<typeof PlatformRadioGroup>;
 
@@ -16,4 +17,4 @@ export type RadioGroupProps = Pick<
   PlatformRadioGroupProps,
   'defaultValue' | 'options' | 'onInvalid' | 'testId'
  | 'isRequired' | 'isDisabled' | 'isInvalid' | 'onChange' | 'value' | 'aria-labelledby' | 'name'
->;
+> & Pick<EventHandlerProps, 'onChange'>;

package/src/components/__generated__/RadioProps.codegen.tsx

@@ -3,12 +3,13 @@
  *
  * Extract component prop types from UIKit 2 components - RadioProps
  *
- * @codegen <<SignedSource::ca014c2fa3ed73cb002099a84ac8a08a>>
+ * @codegen <<SignedSource::18d92f885ea65e94fa46c10f531d5b42>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/radio/__generated__/index.partial.tsx <<SignedSource::ba49931714a2937a807db87c6ed3ed7b>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/radio/__generated__/index.partial.tsx <<SignedSource::f8c9f83aa0faf7291e9446bec9e441d6>>
  */
 import React from 'react';
 import { Radio as PlatformRadio } from '@atlaskit/radio';
+import type { EventHandlerProps } from './types.codegen';
 
 type PlatformRadioProps = React.ComponentProps<typeof PlatformRadio>;
 
@@ -16,4 +17,4 @@ export type RadioProps = Pick<
   PlatformRadioProps,
   'label' | 'testId' | 'isChecked' | 'ariaLabel' | 'onInvalid'
  | 'id' | 'isRequired' | 'isDisabled' | 'isInvalid' | 'onChange' | 'onBlur' | 'onFocus' | 'value' | 'aria-invalid' | 'aria-labelledby' | 'name'
->;
+> & Pick<EventHandlerProps, 'onChange' | 'onBlur' | 'onFocus'>;

package/src/components/__generated__/RangeProps.codegen.tsx

@@ -3,12 +3,13 @@
  *
  * Extract component prop types from UIKit 2 components - RangeProps
  *
- * @codegen <<SignedSource::e63be8ed022af8026cc320c9683dfebf>>
+ * @codegen <<SignedSource::67e22cda61419468c91e120179019751>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/range/__generated__/index.partial.tsx <<SignedSource::73b4d120484ba38e2bf1334749c9bc05>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/range/__generated__/index.partial.tsx <<SignedSource::da47c96a98423bdcf0e9c79c7e31854f>>
  */
 import React from 'react';
 import PlatformRange from '@atlaskit/range';
+import type { EventHandlerProps } from './types.codegen';
 
 type PlatformRangeProps = React.ComponentProps<typeof PlatformRange>;
 
@@ -16,4 +17,4 @@ export type RangeProps = Pick<
   PlatformRangeProps,
   'defaultValue' | 'max' | 'min' | 'step' | 'testId' | 'onChange'
  | 'id' | 'isDisabled' | 'onBlur' | 'onFocus' | 'value' | 'aria-invalid' | 'aria-labelledby' | 'name'
->;
+> & Pick<EventHandlerProps, 'onBlur' | 'onFocus'>;

package/src/components/__generated__/SelectProps.codegen.tsx

@@ -3,9 +3,9 @@
  *
  * Extract component prop types from UIKit 2 components - SelectProps
  *
- * @codegen <<SignedSource::fc820c7821eab223fd3731133a386703>>
+ * @codegen <<SignedSource::15d2ba46804ab0a683383a0ba9cae564>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/select/__generated__/index.partial.tsx <<SignedSource::9650d96ed765605a9c8e52d59df07caa>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/select/__generated__/index.partial.tsx <<SignedSource::a826a4f7af8f06890432c9274aad7332>>
  */
 import { SelectProps as PlatformSelectProps } from '@atlaskit/select';
 
@@ -13,4 +13,4 @@ export type SelectProps = Pick<
 PlatformSelectProps<any, true | false>,
   'spacing' | 'appearance' | 'testId' | 'autoFocus' | 'defaultValue' | 'closeMenuOnSelect' | 'inputValue' | 'inputId' | 'isClearable' | 'isLoading' | 'isMulti' | 'isSearchable' | 'menuIsOpen' | 'onInputChange' | 'options' | 'placeholder' | 'onChange'
  | 'id' | 'isDisabled' | 'isInvalid' | 'onBlur' | 'onFocus' | 'value' | 'aria-invalid' | 'aria-labelledby' | 'name'
-> & { isRequired: boolean };
+> & { isRequired?: boolean };

package/src/components/__generated__/StackProps.codegen.tsx

@@ -3,9 +3,9 @@
  *
  * Extract component prop types from UIKit 2 components - StackProps
  *
- * @codegen <<SignedSource::f3afde823b52ff8f169a9c09c922d8c8>>
+ * @codegen <<SignedSource::078aee141bb0e11ae719fd7e91902969>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/stack/__generated__/index.partial.tsx <<SignedSource::70a76bc91e660eb24d95369466375eec>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/stack/__generated__/index.partial.tsx <<SignedSource::a7e2eb6e4d64591d6b9659e49b6ca7cc>>
  */
 import React from 'react';
 import { Stack as PlatformStack } from '@atlaskit/primitives';

package/src/components/__generated__/TextAreaProps.codegen.tsx

@@ -3,12 +3,13 @@
  *
  * Extract component prop types from UIKit 2 components - TextAreaProps
  *
- * @codegen <<SignedSource::c8fb478551776ee1318282f1e09b6aec>>
+ * @codegen <<SignedSource::57ac3475df0ec3a8015a85ab681b0bec>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/textarea/__generated__/index.partial.tsx <<SignedSource::6ff82f2e9669ec2ae4884bccaf00b53d>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/textarea/__generated__/index.partial.tsx <<SignedSource::bebce724d5e7ad41e8a3cd3c50b5ea6f>>
  */
 import React from 'react';
 import PlatformTextarea from '@atlaskit/textarea';
+import type { EventHandlerProps } from './types.codegen';
 
 type PlatformTextareaProps = React.ComponentProps<typeof PlatformTextarea>;
 
@@ -16,4 +17,4 @@ export type TextAreaProps = Pick<
   PlatformTextareaProps,
   'appearance' | 'defaultValue' | 'isCompact' | 'isMonospaced' | 'isReadOnly' | 'maxHeight' | 'minimumRows' | 'placeholder' | 'resize' | 'spellCheck' | 'testId' | 'maxLength' | 'minLength'
  | 'id' | 'isRequired' | 'isDisabled' | 'isInvalid' | 'onChange' | 'onBlur' | 'onFocus' | 'value' | 'aria-invalid' | 'aria-labelledby' | 'name'
->;
+> & Pick<EventHandlerProps, 'onChange' | 'onBlur' | 'onFocus'>;

package/src/components/__generated__/TextfieldProps.codegen.tsx

@@ -3,17 +3,18 @@
  *
  * Extract component prop types from UIKit 2 components - TextfieldProps
  *
- * @codegen <<SignedSource::720c29dc742f5983dfd70304c695f12a>>
+ * @codegen <<SignedSource::77a5f574841fda41b36a73e5427d6aa0>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/textfield/__generated__/index.partial.tsx <<SignedSource::be81e96ef821ffead27eed0b4af96460>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/textfield/__generated__/index.partial.tsx <<SignedSource::3bcb2c74465d3be32f20d7ee141d0f9a>>
  */
 import React from 'react';
 import PlatformTextfield from '@atlaskit/textfield';
+import type { EventHandlerProps } from './types.codegen';
 
 type PlatformTextfieldProps = React.ComponentProps<typeof PlatformTextfield>;
 
 export type TextfieldProps = Pick<
   PlatformTextfieldProps,
-  'appearance' | 'elemAfterInput' | 'elemBeforeInput' | 'isCompact' | 'isReadOnly' | 'isMonospaced' | 'placeholder' | 'testId' | 'width' | 'type' | 'defaultValue' | 'min' | 'max' | 'maxLength' | 'minLength'
+  'appearance' | 'elemAfterInput' | 'elemBeforeInput' | 'isCompact' | 'isReadOnly' | 'isMonospaced' | 'placeholder' | 'testId' | 'width' | 'type' | 'defaultValue' | 'min' | 'max' | 'maxLength' | 'minLength' | 'pattern'
  | 'id' | 'isRequired' | 'isDisabled' | 'isInvalid' | 'onChange' | 'onBlur' | 'onFocus' | 'value' | 'aria-invalid' | 'aria-labelledby' | 'name'
->;
+> & Pick<EventHandlerProps, 'onChange' | 'onBlur' | 'onFocus'>;

package/src/components/__generated__/ToggleProps.codegen.tsx

@@ -3,12 +3,13 @@
  *
  * Extract component prop types from UIKit 2 components - ToggleProps
  *
- * @codegen <<SignedSource::3725fc15575cc31d6f57a976cbb10297>>
+ * @codegen <<SignedSource::9934170c1bfa2f8647584b8098d373e5>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/toggle/__generated__/index.partial.tsx <<SignedSource::00ab09d4c92a9047a164a1063e7b52de>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit2-codegen/toggle/__generated__/index.partial.tsx <<SignedSource::15954687b51568b070d3d6687a80e7af>>
  */
 import React from 'react';
 import PlatformToggle from '@atlaskit/toggle';
+import type { EventHandlerProps } from './types.codegen';
 
 type PlatformToggleProps = React.ComponentProps<typeof PlatformToggle>;
 
@@ -16,4 +17,4 @@ export type ToggleProps = Pick<
   PlatformToggleProps,
   'size' | 'testId' | 'defaultChecked' | 'isChecked' | 'label'
  | 'id' | 'isDisabled' | 'onChange' | 'onBlur' | 'onFocus' | 'value' | 'name'
->;
+> & Pick<EventHandlerProps, 'onChange' | 'onBlur' | 'onFocus'>;

package/src/components/__generated__/index.codegen.ts

@@ -3,29 +3,29 @@
  *
  * Index file for component prop types
  *
- * @codegen <<SignedSource::d4328d9d29905451f7abdcaeb6cdfaed>>
+ * @codegen <<SignedSource::0af01b1102b6d9b9f668cbed2fe0b27b>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
  * @codegenDependency BadgeProps.codegen.tsx <<SignedSource::4759a95fede44eb7af89a4ada26252e9>>
  * @codegenDependency BleedProps.codegen.tsx <<SignedSource::376f3f60ae6c1912e80b568958802fb5>>
- * @codegenDependency BoxProps.codegen.tsx <<SignedSource::4ced3eed4de7f562539dd8a769a6871d>>
+ * @codegenDependency BoxProps.codegen.tsx <<SignedSource::981f130ecaeeb0b694d4f81c2dc8255d>>
  * @codegenDependency ButtonGroupProps.codegen.tsx <<SignedSource::a529cee05261919cb2eccacb9837aed0>>
  * @codegenDependency ButtonProps.codegen.tsx <<SignedSource::cc45a3581574c0496c410cbba542fa50>>
- * @codegenDependency CheckboxProps.codegen.tsx <<SignedSource::9afb80a74c374b81d16e4b41c905799c>>
+ * @codegenDependency CheckboxProps.codegen.tsx <<SignedSource::64e2dd8eb8b122646e0a11c5a029a4d6>>
  * @codegenDependency CodeBlockProps.codegen.tsx <<SignedSource::54097e23c683ba0621cb0c224cbdee7a>>
  * @codegenDependency CodeProps.codegen.tsx <<SignedSource::bc1c608d36eb55ac7c4eb0545c4beda3>>
  * @codegenDependency DatePickerProps.codegen.tsx <<SignedSource::91eb5f1515fdb028c2916d07b59ea49a>>
- * @codegenDependency DynamicTableProps.codegen.tsx <<SignedSource::a515b50fd70a7fc6bc821f42852a6c22>>
+ * @codegenDependency DynamicTableProps.codegen.tsx <<SignedSource::5e1fb410256c2a689e97b87ac6152074>>
  * @codegenDependency ErrorMessageProps.codegen.tsx <<SignedSource::63e86a9739201928809df1932f0ceec9>>
- * @codegenDependency FlexProps.codegen.tsx <<SignedSource::93c0da4d6aad38e9a93dac738a15c7e4>>
+ * @codegenDependency FlexProps.codegen.tsx <<SignedSource::7f93c1d8cb30006984a5a43ebd95e4c8>>
  * @codegenDependency FormFooterProps.codegen.tsx <<SignedSource::3c26d17eab08af0dfa1beabfc6065d18>>
  * @codegenDependency FormHeaderProps.codegen.tsx <<SignedSource::1327f7e4c259cd2d5c1bf3198cc8c1eb>>
  * @codegenDependency FormProps.codegen.tsx <<SignedSource::22baf31090e921045516d5295e2226ef>>
  * @codegenDependency FormSectionProps.codegen.tsx <<SignedSource::43e20fc89b7abc977b8f10fd61ba6ea7>>
- * @codegenDependency GridProps.codegen.tsx <<SignedSource::8887e674f7f9420766714b0bf196b7f7>>
+ * @codegenDependency GridProps.codegen.tsx <<SignedSource::e98d5d15bb747873a1436cfa2428fdf6>>
  * @codegenDependency HeadingProps.codegen.tsx <<SignedSource::e34844b4af1a7c827505fe3ff587eda9>>
  * @codegenDependency HelperMessageProps.codegen.tsx <<SignedSource::8afdecf85bd6b2539ac011e4f5249b09>>
  * @codegenDependency IconProps.codegen.tsx <<SignedSource::24314f42437fe2bf4e2693316b97bb74>>
- * @codegenDependency InlineProps.codegen.tsx <<SignedSource::db16fe89fabe2d38cad0e3e5695311b3>>
+ * @codegenDependency InlineProps.codegen.tsx <<SignedSource::e9624f171d2611c81d05bb70d5d5efd8>>
  * @codegenDependency LabelProps.codegen.tsx <<SignedSource::32b9d05796f68e57b79ad99d6c37d246>>
  * @codegenDependency LinkButtonProps.codegen.tsx <<SignedSource::9d91758a306a8ad6dadcd2693603ca0c>>
  * @codegenDependency LoadingButtonProps.codegen.tsx <<SignedSource::8db1bb8fad98a6f0d577c0f55e30d679>>
@@ -38,23 +38,23 @@
  * @codegenDependency ModalTransitionProps.codegen.tsx <<SignedSource::eae5bf2abf85a1a39c377b0da0f7a1ed>>
  * @codegenDependency ProgressBarProps.codegen.tsx <<SignedSource::b27527e77286c102eac2a4aa3ed6585a>>
  * @codegenDependency ProgressTrackerProps.codegen.tsx <<SignedSource::75a7d6d27ff905f2e1ed85668749aec0>>
- * @codegenDependency RadioGroupProps.codegen.tsx <<SignedSource::92f707b80740efdb35d1588c854838d7>>
- * @codegenDependency RadioProps.codegen.tsx <<SignedSource::7de921ff8e1eceb6e5a3ae6dd8afc8cc>>
- * @codegenDependency RangeProps.codegen.tsx <<SignedSource::c71093a0781c3c46701e313db8c9e1d9>>
+ * @codegenDependency RadioGroupProps.codegen.tsx <<SignedSource::1ad039c8add4a5cbbbfcb0297330f608>>
+ * @codegenDependency RadioProps.codegen.tsx <<SignedSource::96e4c026daaf1aec3bf68aea545556d7>>
+ * @codegenDependency RangeProps.codegen.tsx <<SignedSource::4cb6e9003e3ad70a198b218708b324a4>>
  * @codegenDependency SectionMessageActionProps.codegen.tsx <<SignedSource::190b8417f32673d5e54cd206ea0c76d0>>
  * @codegenDependency SectionMessageProps.codegen.tsx <<SignedSource::dad8a3d213b5863972ea115389c33fdc>>
- * @codegenDependency SelectProps.codegen.tsx <<SignedSource::9c26b0a488f304bd77f227c6242062b9>>
+ * @codegenDependency SelectProps.codegen.tsx <<SignedSource::5c1824fd709a27eb74098e537e7f3541>>
  * @codegenDependency SpinnerProps.codegen.tsx <<SignedSource::602b1cc246e020dd7f32222a4d6bbb6e>>
- * @codegenDependency StackProps.codegen.tsx <<SignedSource::11eaa0ce90d5dd36a8ca57a03f01afe6>>
+ * @codegenDependency StackProps.codegen.tsx <<SignedSource::d3889e3b819fa2f96c0ce38a52734b76>>
  * @codegenDependency TabListProps.codegen.tsx <<SignedSource::ba3257cc8f382811ae1630adc50c4fac>>
  * @codegenDependency TabPanelProps.codegen.tsx <<SignedSource::dda2f64bb72b6b2d308412f1f9dae114>>
  * @codegenDependency TabProps.codegen.tsx <<SignedSource::6edd2e77416e83af2879893b06c1e004>>
  * @codegenDependency TabsProps.codegen.tsx <<SignedSource::014a7bfcca5304d7bb613a53d9117d01>>
  * @codegenDependency TagGroupProps.codegen.tsx <<SignedSource::e8e2bd37a4b5175ff1bf296b465ef727>>
  * @codegenDependency TagProps.codegen.tsx <<SignedSource::86aff9005e1db842009ece108d61a6b1>>
- * @codegenDependency TextAreaProps.codegen.tsx <<SignedSource::6acc3b533fd4766729e98c15a9750739>>
- * @codegenDependency TextfieldProps.codegen.tsx <<SignedSource::f849d7935598c075df91b83544913e3b>>
- * @codegenDependency ToggleProps.codegen.tsx <<SignedSource::6595958ccdf883ba48233225095e19d0>>
+ * @codegenDependency TextAreaProps.codegen.tsx <<SignedSource::1ffeeec37e609f7a8e8fa7a4abcffc28>>
+ * @codegenDependency TextfieldProps.codegen.tsx <<SignedSource::f029b18bd851bfca81384b61b12ba04b>>
+ * @codegenDependency ToggleProps.codegen.tsx <<SignedSource::4cf587b7a202a52ddb50db0157c2b0e5>>
  * @codegenDependency TooltipProps.codegen.tsx <<SignedSource::aa2be4a5cb38eecf50dd652836a3e6ad>>
  * @codegenDependency ValidMessageProps.codegen.tsx <<SignedSource::3498c77c19604ab5b3b2800fee3e75b3>>
  */