From 9fdd0c58b4b83034ca9b9cd6d70348db3fde130b Mon Sep 17 00:00:00 2001 From: Kenny Lin Date: Fri, 29 May 2026 14:28:26 -0400 Subject: [PATCH 1/6] removal of HiddenText --- .../__snapshots__/gamut.test.ts.snap | 1 - .../gamut/agent-tools/DESIGN.Codecademy.md | 2 +- .../gamut/agent-tools/rules/accessibility.mdc | 2 +- .../src/ConnectedForm/ConnectedFormGroup.tsx | 4 +- .../gamut/src/ConnectedForm/SubmitButton.tsx | 6 ++- .../src/GridForm/GridFormInputGroup/index.tsx | 4 +- .../HiddenText/__tests__/HiddenText.test.tsx | 12 ------ packages/gamut/src/HiddenText/index.tsx | 13 ------- packages/gamut/src/index.tsx | 1 - .../styleguide/src/lib/Typography/About.mdx | 7 +--- .../lib/Typography/HiddenText/HiddenText.mdx | 37 ------------------- .../HiddenText/HiddenText.stories.tsx | 14 ------- 12 files changed, 11 insertions(+), 92 deletions(-) delete mode 100644 packages/gamut/src/HiddenText/__tests__/HiddenText.test.tsx delete mode 100644 packages/gamut/src/HiddenText/index.tsx delete mode 100644 packages/styleguide/src/lib/Typography/HiddenText/HiddenText.mdx delete mode 100644 packages/styleguide/src/lib/Typography/HiddenText/HiddenText.stories.tsx diff --git a/packages/gamut/__tests__/__snapshots__/gamut.test.ts.snap b/packages/gamut/__tests__/__snapshots__/gamut.test.ts.snap index 7bdb1824d89..5de2f2ad9a9 100644 --- a/packages/gamut/__tests__/__snapshots__/gamut.test.ts.snap +++ b/packages/gamut/__tests__/__snapshots__/gamut.test.ts.snap @@ -62,7 +62,6 @@ exports[`Gamut Exported Keys 1`] = ` "GridBox", "GridForm", "GridFormContent", - "HiddenText", "IconButton", "iFrameWrapper", "InfoTip", diff --git a/packages/gamut/agent-tools/DESIGN.Codecademy.md b/packages/gamut/agent-tools/DESIGN.Codecademy.md index 4bbd148cd8f..fd210358e5e 100644 --- a/packages/gamut/agent-tools/DESIGN.Codecademy.md +++ b/packages/gamut/agent-tools/DESIGN.Codecademy.md @@ -481,7 +481,7 @@ Components are organized into three tiers: ### Atoms — foundational, single-purpose -Badge, Button (FillButton, StrokeButton, CTAButton, TextButton, IconButton), ButtonBase, Card, Checkbox, CodeBlock, ColorMode, Drawer, FlexBox, FormGroup, GridBox, HiddenText, Icon, Input, Label, Loader, Radio, Select, Spinner, Tag, TextArea, Toggle, Tooltip +Badge, Button (FillButton, StrokeButton, CTAButton, TextButton, IconButton), ButtonBase, Card, Checkbox, CodeBlock, ColorMode, Drawer, FlexBox, FormGroup, GridBox, Icon, Input, Label, Loader, Radio, Select, Spinner, Tag, TextArea, Toggle, Tooltip ### Molecules — composed of atoms, handle a discrete task diff --git a/packages/gamut/agent-tools/rules/accessibility.mdc b/packages/gamut/agent-tools/rules/accessibility.mdc index 2c060d2cc87..0e519156767 100644 --- a/packages/gamut/agent-tools/rules/accessibility.mdc +++ b/packages/gamut/agent-tools/rules/accessibility.mdc @@ -56,7 +56,7 @@ Match `htmlFor` on `` with the `id` on the control. Base `` for visually hidden but announced content. `` is deprecated. +Use `` for visually hidden but announced content. ## Color and contrast diff --git a/packages/gamut/src/ConnectedForm/ConnectedFormGroup.tsx b/packages/gamut/src/ConnectedForm/ConnectedFormGroup.tsx index 4e7ede387b2..97f17ca74c0 100644 --- a/packages/gamut/src/ConnectedForm/ConnectedFormGroup.tsx +++ b/packages/gamut/src/ConnectedForm/ConnectedFormGroup.tsx @@ -5,9 +5,9 @@ import * as React from 'react'; import { FormError, FormGroup, FormGroupLabel, FormGroupProps } from '..'; import { Anchor } from '../Anchor'; -import { HiddenText } from '../HiddenText'; import { Markdown } from '../Markdown'; import { InfoTipSubComponentProps } from '../Tip/InfoTip/type-utils'; +import { Text } from '../Typography'; import { ConnectedField, FieldProps, SubmitContextProps } from './types'; import { getErrorMessage, useField } from './utils'; @@ -94,7 +94,7 @@ export function ConnectedFormGroup({ return ( - {hideLabel ? {renderedLabel} : renderedLabel} + {hideLabel ? {renderedLabel} : renderedLabel} = ({ {isLoading && ( - Loading + + Loading + )} diff --git a/packages/gamut/src/GridForm/GridFormInputGroup/index.tsx b/packages/gamut/src/GridForm/GridFormInputGroup/index.tsx index 50c794ea4f2..ba4837931bd 100644 --- a/packages/gamut/src/GridForm/GridFormInputGroup/index.tsx +++ b/packages/gamut/src/GridForm/GridFormInputGroup/index.tsx @@ -5,9 +5,9 @@ import { UseFormReturn } from 'react-hook-form'; import { Anchor } from '../../Anchor'; import { FormError, FormGroup, FormGroupLabel } from '../../Form'; -import { HiddenText } from '../../HiddenText'; import { Column } from '../../Layout'; import { Markdown } from '../../Markdown'; +import { Text } from '../../Typography'; import { GridFormField, GridFormHiddenField, @@ -169,7 +169,7 @@ export const GridFormInputGroup: React.FC = ({ return ( - {field.hideLabel ? {label} : label} + {field.hideLabel ? {label} : label} {getInput()} {errorMessage && ( { - it('renders', () => { - const { view } = renderView({}); - view.getByText('Surprise!'); - }); -}); diff --git a/packages/gamut/src/HiddenText/index.tsx b/packages/gamut/src/HiddenText/index.tsx deleted file mode 100644 index a2a6e22c694..00000000000 --- a/packages/gamut/src/HiddenText/index.tsx +++ /dev/null @@ -1,13 +0,0 @@ -import styled from '@emotion/styled'; - -/** - * @deprecated Use `` instead with `screenreader='true'` - */ -export const HiddenText = styled.span` - display: inline-block; - font-size: 0; - height: 1px; - overflow: hidden; - position: absolute; - width: 1px; -`; diff --git a/packages/gamut/src/index.tsx b/packages/gamut/src/index.tsx index 55192cf5ecc..01a11e61e2b 100644 --- a/packages/gamut/src/index.tsx +++ b/packages/gamut/src/index.tsx @@ -31,7 +31,6 @@ export type { SelectDropdownGroup, } from './Form/SelectDropdown'; export * from './GridForm'; -export * from './HiddenText'; export * from './Layout/Column'; export * from './Layout/LayoutGrid'; export * from './List'; diff --git a/packages/styleguide/src/lib/Typography/About.mdx b/packages/styleguide/src/lib/Typography/About.mdx index f2e21e5294c..5e416e6e354 100644 --- a/packages/styleguide/src/lib/Typography/About.mdx +++ b/packages/styleguide/src/lib/Typography/About.mdx @@ -7,7 +7,6 @@ import { } from '~styleguide/blocks'; import { parameters as anchorParameters } from './Anchor/Anchor.mdx'; -import { parameters as hiddenTextParameters } from './HiddenText/HiddenText.mdx'; import { parameters as textParameters } from './Text/Text.mdx'; export const parameters = { @@ -25,9 +24,5 @@ Foundations make up the smallest scale design values that comprise a design syst Sometimes referred to elsewhere as "tokens", they are the abstract units that comprise and stitch together our atoms, molecules, and organisms. diff --git a/packages/styleguide/src/lib/Typography/HiddenText/HiddenText.mdx b/packages/styleguide/src/lib/Typography/HiddenText/HiddenText.mdx deleted file mode 100644 index 1e7c79edafb..00000000000 --- a/packages/styleguide/src/lib/Typography/HiddenText/HiddenText.mdx +++ /dev/null @@ -1,37 +0,0 @@ -import { Canvas, Controls, Meta } from '@storybook/addon-docs/blocks'; - -import { Callout, ComponentHeader, LinkTo } from '~styleguide/blocks'; - -import * as HiddenTextStories from './HiddenText.stories'; - -export const parameters = { - title: 'HiddenText', - subtitle: `Visually hidden text that should still be narrated by screenreaders.`, - status: 'deprecated', - source: { - repo: 'gamut', - githubLink: - 'https://github.com/Codecademy/gamut/blob/cass-gm-843/packages/gamut/src/HiddenText/index.tsx#', - }, -}; - - - - - -Previously, this was useful for cases where we visually indicate something not easily conveyed through semantic HTML. -Ideally those cases should be exceedingly rare; unfortunately, some of our older pages aren't set up well for this. - - - For newer pages, use the{' '} - Text component and set{' '} - screenreader="true". - - } -/> - - - - diff --git a/packages/styleguide/src/lib/Typography/HiddenText/HiddenText.stories.tsx b/packages/styleguide/src/lib/Typography/HiddenText/HiddenText.stories.tsx deleted file mode 100644 index f8a45a4cabc..00000000000 --- a/packages/styleguide/src/lib/Typography/HiddenText/HiddenText.stories.tsx +++ /dev/null @@ -1,14 +0,0 @@ -import { HiddenText } from '@codecademy/gamut'; -import type { Meta, StoryObj } from '@storybook/react'; - -const meta: Meta = { - component: HiddenText, - args: { children: 'Surprise!' }, -}; - -export default meta; -type Story = StoryObj; - -export const Default: Story = { - args: {}, -}; From 80066e23f779e90521450f722ea98c54facab364 Mon Sep 17 00:00:00 2001 From: Kenny Lin Date: Fri, 29 May 2026 14:36:22 -0400 Subject: [PATCH 2/6] fix lint and add version plan --- .nx/version-plans/version-plan-1748553600000.md | 9 +++++++++ packages/gamut/src/ConnectedForm/SubmitButton.tsx | 2 +- 2 files changed, 10 insertions(+), 1 deletion(-) create mode 100644 .nx/version-plans/version-plan-1748553600000.md diff --git a/.nx/version-plans/version-plan-1748553600000.md b/.nx/version-plans/version-plan-1748553600000.md new file mode 100644 index 00000000000..896a0e10e9e --- /dev/null +++ b/.nx/version-plans/version-plan-1748553600000.md @@ -0,0 +1,9 @@ +--- +gamut: major +--- + +Remove deprecated `HiddenText` component + +- **BREAKING:** `HiddenText` is no longer exported from `@codecademy/gamut` +- Migrate to `` for visually hidden, screen-reader-accessible text +- Removed Storybook docs for `HiddenText`; use the `Text` screenreader utility docs instead diff --git a/packages/gamut/src/ConnectedForm/SubmitButton.tsx b/packages/gamut/src/ConnectedForm/SubmitButton.tsx index 84e67c84e94..dc33a67b21d 100644 --- a/packages/gamut/src/ConnectedForm/SubmitButton.tsx +++ b/packages/gamut/src/ConnectedForm/SubmitButton.tsx @@ -50,7 +50,7 @@ export const SubmitButton: React.FC = ({ {isLoading && ( - + Loading From c76b84bd19d7ed7809cab2b9843edbc37eb7ea99 Mon Sep 17 00:00:00 2001 From: Kenny Lin Date: Fri, 29 May 2026 16:00:51 -0400 Subject: [PATCH 3/6] add back in checkout@v4 to publish alpha --- .github/workflows/publish-alpha.yml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.github/workflows/publish-alpha.yml b/.github/workflows/publish-alpha.yml index b968dd17558..e4c5830d8a6 100644 --- a/.github/workflows/publish-alpha.yml +++ b/.github/workflows/publish-alpha.yml @@ -27,6 +27,8 @@ jobs: runs-on: ubuntu-22.04 timeout-minutes: 30 steps: + - uses: actions/checkout@v4 + - uses: ./.github/actions/prerelease-publish with: node-auth-token: ${{ secrets.NODE_AUTH_TOKEN }} From 838d24cdb45602260e38647d657e2b6fc18a4103 Mon Sep 17 00:00:00 2001 From: Kenny Lin Date: Fri, 29 May 2026 14:28:26 -0400 Subject: [PATCH 4/6] removal of HiddenText --- .../__snapshots__/gamut.test.ts.snap | 1 - .../gamut/agent-tools/DESIGN.Codecademy.md | 2 +- .../gamut/agent-tools/rules/accessibility.mdc | 2 +- .../src/ConnectedForm/ConnectedFormGroup.tsx | 4 +- .../gamut/src/ConnectedForm/SubmitButton.tsx | 6 ++- .../src/GridForm/GridFormInputGroup/index.tsx | 4 +- .../HiddenText/__tests__/HiddenText.test.tsx | 12 ------ packages/gamut/src/HiddenText/index.tsx | 13 ------- packages/gamut/src/index.tsx | 1 - .../styleguide/src/lib/Typography/About.mdx | 7 +--- .../lib/Typography/HiddenText/HiddenText.mdx | 37 ------------------- .../HiddenText/HiddenText.stories.tsx | 14 ------- 12 files changed, 11 insertions(+), 92 deletions(-) delete mode 100644 packages/gamut/src/HiddenText/__tests__/HiddenText.test.tsx delete mode 100644 packages/gamut/src/HiddenText/index.tsx delete mode 100644 packages/styleguide/src/lib/Typography/HiddenText/HiddenText.mdx delete mode 100644 packages/styleguide/src/lib/Typography/HiddenText/HiddenText.stories.tsx diff --git a/packages/gamut/__tests__/__snapshots__/gamut.test.ts.snap b/packages/gamut/__tests__/__snapshots__/gamut.test.ts.snap index 7bdb1824d89..5de2f2ad9a9 100644 --- a/packages/gamut/__tests__/__snapshots__/gamut.test.ts.snap +++ b/packages/gamut/__tests__/__snapshots__/gamut.test.ts.snap @@ -62,7 +62,6 @@ exports[`Gamut Exported Keys 1`] = ` "GridBox", "GridForm", "GridFormContent", - "HiddenText", "IconButton", "iFrameWrapper", "InfoTip", diff --git a/packages/gamut/agent-tools/DESIGN.Codecademy.md b/packages/gamut/agent-tools/DESIGN.Codecademy.md index 4bbd148cd8f..fd210358e5e 100644 --- a/packages/gamut/agent-tools/DESIGN.Codecademy.md +++ b/packages/gamut/agent-tools/DESIGN.Codecademy.md @@ -481,7 +481,7 @@ Components are organized into three tiers: ### Atoms — foundational, single-purpose -Badge, Button (FillButton, StrokeButton, CTAButton, TextButton, IconButton), ButtonBase, Card, Checkbox, CodeBlock, ColorMode, Drawer, FlexBox, FormGroup, GridBox, HiddenText, Icon, Input, Label, Loader, Radio, Select, Spinner, Tag, TextArea, Toggle, Tooltip +Badge, Button (FillButton, StrokeButton, CTAButton, TextButton, IconButton), ButtonBase, Card, Checkbox, CodeBlock, ColorMode, Drawer, FlexBox, FormGroup, GridBox, Icon, Input, Label, Loader, Radio, Select, Spinner, Tag, TextArea, Toggle, Tooltip ### Molecules — composed of atoms, handle a discrete task diff --git a/packages/gamut/agent-tools/rules/accessibility.mdc b/packages/gamut/agent-tools/rules/accessibility.mdc index 2c060d2cc87..0e519156767 100644 --- a/packages/gamut/agent-tools/rules/accessibility.mdc +++ b/packages/gamut/agent-tools/rules/accessibility.mdc @@ -56,7 +56,7 @@ Match `htmlFor` on `` with the `id` on the control. Base `` for visually hidden but announced content. `` is deprecated. +Use `` for visually hidden but announced content. ## Color and contrast diff --git a/packages/gamut/src/ConnectedForm/ConnectedFormGroup.tsx b/packages/gamut/src/ConnectedForm/ConnectedFormGroup.tsx index 4e7ede387b2..97f17ca74c0 100644 --- a/packages/gamut/src/ConnectedForm/ConnectedFormGroup.tsx +++ b/packages/gamut/src/ConnectedForm/ConnectedFormGroup.tsx @@ -5,9 +5,9 @@ import * as React from 'react'; import { FormError, FormGroup, FormGroupLabel, FormGroupProps } from '..'; import { Anchor } from '../Anchor'; -import { HiddenText } from '../HiddenText'; import { Markdown } from '../Markdown'; import { InfoTipSubComponentProps } from '../Tip/InfoTip/type-utils'; +import { Text } from '../Typography'; import { ConnectedField, FieldProps, SubmitContextProps } from './types'; import { getErrorMessage, useField } from './utils'; @@ -94,7 +94,7 @@ export function ConnectedFormGroup({ return ( - {hideLabel ? {renderedLabel} : renderedLabel} + {hideLabel ? {renderedLabel} : renderedLabel} = ({ {isLoading && ( - Loading + + Loading + )} diff --git a/packages/gamut/src/GridForm/GridFormInputGroup/index.tsx b/packages/gamut/src/GridForm/GridFormInputGroup/index.tsx index 50c794ea4f2..ba4837931bd 100644 --- a/packages/gamut/src/GridForm/GridFormInputGroup/index.tsx +++ b/packages/gamut/src/GridForm/GridFormInputGroup/index.tsx @@ -5,9 +5,9 @@ import { UseFormReturn } from 'react-hook-form'; import { Anchor } from '../../Anchor'; import { FormError, FormGroup, FormGroupLabel } from '../../Form'; -import { HiddenText } from '../../HiddenText'; import { Column } from '../../Layout'; import { Markdown } from '../../Markdown'; +import { Text } from '../../Typography'; import { GridFormField, GridFormHiddenField, @@ -169,7 +169,7 @@ export const GridFormInputGroup: React.FC = ({ return ( - {field.hideLabel ? {label} : label} + {field.hideLabel ? {label} : label} {getInput()} {errorMessage && ( { - it('renders', () => { - const { view } = renderView({}); - view.getByText('Surprise!'); - }); -}); diff --git a/packages/gamut/src/HiddenText/index.tsx b/packages/gamut/src/HiddenText/index.tsx deleted file mode 100644 index a2a6e22c694..00000000000 --- a/packages/gamut/src/HiddenText/index.tsx +++ /dev/null @@ -1,13 +0,0 @@ -import styled from '@emotion/styled'; - -/** - * @deprecated Use `` instead with `screenreader='true'` - */ -export const HiddenText = styled.span` - display: inline-block; - font-size: 0; - height: 1px; - overflow: hidden; - position: absolute; - width: 1px; -`; diff --git a/packages/gamut/src/index.tsx b/packages/gamut/src/index.tsx index 55192cf5ecc..01a11e61e2b 100644 --- a/packages/gamut/src/index.tsx +++ b/packages/gamut/src/index.tsx @@ -31,7 +31,6 @@ export type { SelectDropdownGroup, } from './Form/SelectDropdown'; export * from './GridForm'; -export * from './HiddenText'; export * from './Layout/Column'; export * from './Layout/LayoutGrid'; export * from './List'; diff --git a/packages/styleguide/src/lib/Typography/About.mdx b/packages/styleguide/src/lib/Typography/About.mdx index f2e21e5294c..5e416e6e354 100644 --- a/packages/styleguide/src/lib/Typography/About.mdx +++ b/packages/styleguide/src/lib/Typography/About.mdx @@ -7,7 +7,6 @@ import { } from '~styleguide/blocks'; import { parameters as anchorParameters } from './Anchor/Anchor.mdx'; -import { parameters as hiddenTextParameters } from './HiddenText/HiddenText.mdx'; import { parameters as textParameters } from './Text/Text.mdx'; export const parameters = { @@ -25,9 +24,5 @@ Foundations make up the smallest scale design values that comprise a design syst Sometimes referred to elsewhere as "tokens", they are the abstract units that comprise and stitch together our atoms, molecules, and organisms. diff --git a/packages/styleguide/src/lib/Typography/HiddenText/HiddenText.mdx b/packages/styleguide/src/lib/Typography/HiddenText/HiddenText.mdx deleted file mode 100644 index 1e7c79edafb..00000000000 --- a/packages/styleguide/src/lib/Typography/HiddenText/HiddenText.mdx +++ /dev/null @@ -1,37 +0,0 @@ -import { Canvas, Controls, Meta } from '@storybook/addon-docs/blocks'; - -import { Callout, ComponentHeader, LinkTo } from '~styleguide/blocks'; - -import * as HiddenTextStories from './HiddenText.stories'; - -export const parameters = { - title: 'HiddenText', - subtitle: `Visually hidden text that should still be narrated by screenreaders.`, - status: 'deprecated', - source: { - repo: 'gamut', - githubLink: - 'https://github.com/Codecademy/gamut/blob/cass-gm-843/packages/gamut/src/HiddenText/index.tsx#', - }, -}; - - - - - -Previously, this was useful for cases where we visually indicate something not easily conveyed through semantic HTML. -Ideally those cases should be exceedingly rare; unfortunately, some of our older pages aren't set up well for this. - - - For newer pages, use the{' '} - Text component and set{' '} - screenreader="true". - - } -/> - - - - diff --git a/packages/styleguide/src/lib/Typography/HiddenText/HiddenText.stories.tsx b/packages/styleguide/src/lib/Typography/HiddenText/HiddenText.stories.tsx deleted file mode 100644 index f8a45a4cabc..00000000000 --- a/packages/styleguide/src/lib/Typography/HiddenText/HiddenText.stories.tsx +++ /dev/null @@ -1,14 +0,0 @@ -import { HiddenText } from '@codecademy/gamut'; -import type { Meta, StoryObj } from '@storybook/react'; - -const meta: Meta = { - component: HiddenText, - args: { children: 'Surprise!' }, -}; - -export default meta; -type Story = StoryObj; - -export const Default: Story = { - args: {}, -}; From 30a66548e83aa9a4ef910480055aad27825a323f Mon Sep 17 00:00:00 2001 From: Kenny Lin Date: Fri, 29 May 2026 14:36:22 -0400 Subject: [PATCH 5/6] fix lint and add version plan --- .nx/version-plans/version-plan-1748553600000.md | 9 +++++++++ packages/gamut/src/ConnectedForm/SubmitButton.tsx | 2 +- 2 files changed, 10 insertions(+), 1 deletion(-) create mode 100644 .nx/version-plans/version-plan-1748553600000.md diff --git a/.nx/version-plans/version-plan-1748553600000.md b/.nx/version-plans/version-plan-1748553600000.md new file mode 100644 index 00000000000..896a0e10e9e --- /dev/null +++ b/.nx/version-plans/version-plan-1748553600000.md @@ -0,0 +1,9 @@ +--- +gamut: major +--- + +Remove deprecated `HiddenText` component + +- **BREAKING:** `HiddenText` is no longer exported from `@codecademy/gamut` +- Migrate to `` for visually hidden, screen-reader-accessible text +- Removed Storybook docs for `HiddenText`; use the `Text` screenreader utility docs instead diff --git a/packages/gamut/src/ConnectedForm/SubmitButton.tsx b/packages/gamut/src/ConnectedForm/SubmitButton.tsx index 84e67c84e94..dc33a67b21d 100644 --- a/packages/gamut/src/ConnectedForm/SubmitButton.tsx +++ b/packages/gamut/src/ConnectedForm/SubmitButton.tsx @@ -50,7 +50,7 @@ export const SubmitButton: React.FC = ({ {isLoading && ( - + Loading From a3fcd3d7f41ab171678c5b0677691a3ce4754bbf Mon Sep 17 00:00:00 2001 From: Kenny Lin Date: Mon, 1 Jun 2026 16:35:08 -0400 Subject: [PATCH 6/6] adding temp test code --- .../styleguide/src/lib/Organisms/GridForm/Buttons.stories.tsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/styleguide/src/lib/Organisms/GridForm/Buttons.stories.tsx b/packages/styleguide/src/lib/Organisms/GridForm/Buttons.stories.tsx index 013817542a8..afc24cc5da7 100644 --- a/packages/styleguide/src/lib/Organisms/GridForm/Buttons.stories.tsx +++ b/packages/styleguide/src/lib/Organisms/GridForm/Buttons.stories.tsx @@ -92,6 +92,8 @@ export const SubmitButtonInline: Story = { name: 'simple-text', type: 'text', size: 6, + // WILL REMOVE BEFORE MERGING + hideLabel: true, }, ], submit: {