Skip to content

Commit

Permalink
Some copy updates
Browse files Browse the repository at this point in the history
  • Loading branch information
j-malt committed Apr 30, 2024
1 parent 91cb062 commit 63bb26d
Showing 1 changed file with 28 additions and 3 deletions.
31 changes: 28 additions & 3 deletions docs/reference/cms-dev-server.md
Original file line number Diff line number Diff line change
Expand Up @@ -89,7 +89,7 @@ If you are using Typescript in your CMS React project, you can make use of the `

```tsx
// components/modules/MyModule/fields.tsx
// THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.

export const fields = (
<ModuleFields>
<ChoiceField
Expand All @@ -116,10 +116,35 @@ export const fields = (
);
```

then running `hs-cms-dev-server [path-to-project] --generateFieldTypes` will generate a file `modules/MyModule/fields.types.ts` with a default exported type `MyModuleFieldsType`. Then, you can import the type in your component as follows:
Running `hs-cms-dev-server [path-to-project] --generateFieldsTypes` will generate a `modules/MyModule/fields.types.ts` file with a default exported type `MyModuleFieldsType`. The above `fields.tsx` will generate this file:

```ts
// modules/MyModule/fields.types.ts

// THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
// Removing the above comment will disable type generation for this module
// This file was created by @hubspot/cms-dev-server, for more information see https://github.hubspot.com/cms-react/reference/js-modules.html#module-fields
import { type DefaultValues, type ChoiceFieldType, type NumberFieldType, type TextFieldType, type GroupFieldType, type Override } from "@hubspot/cms-components/fields";
type MyModuleFieldsType = DefaultValues<{
choice: Required<ChoiceFieldType>;
numberField: NumberFieldType;
defaultGroup: Override<GroupFieldType, {
children: {
textFieldOne: Required<TextFieldType>;
textFieldTwo: TextFieldType;
numberField: NumberFieldType;
};
}>;
}>;
export default MyModuleFieldsType;
```


Then, you can import and use the type in your component as follows:

```tsx
// components/modules/MyModule/index.tsx

import { ModuleProps } from '@hubspot/cms-components';
import MyModule from './fields.types';

Expand All @@ -139,4 +164,4 @@ export const Component = ({
}
```

The generated types file will be overwritten every time there is an update made to the fields file. If you would like to disable this overwriting, remove the `THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.` comment at the top of the file, which will disable overwriting of the types file.
Note that the generated types file will be overwritten every time there is an update made to the fields object. To disable this behaviour, remove the `THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.` comment at the top of the file.

0 comments on commit 63bb26d

Please sign in to comment.