diff --git a/src/components/sandbox/AngularReactiveSerializer.ts b/src/components/sandbox/AngularReactiveSerializer.ts index 81314ffbe..9ed0cf6a9 100644 --- a/src/components/sandbox/AngularReactiveSerializer.ts +++ b/src/components/sandbox/AngularReactiveSerializer.ts @@ -102,7 +102,11 @@ export class AngularReactiveSerializer extends BaseSerializer implements Seriali } const currentPrefix = "Goab"; const oldPrefix = "goa"; - const tail = name.replace(currentPrefix, ""); + let tail = name.replace(currentPrefix, ""); + + if (tail === "TextArea" && this.version === "new") { + tail = "Textarea" + } if (this.version === "old") { return `${oldPrefix}-${this.dasherize(tail)}`; diff --git a/src/components/sandbox/AngularSerializer.ts b/src/components/sandbox/AngularSerializer.ts index 96f837288..157eda398 100644 --- a/src/components/sandbox/AngularSerializer.ts +++ b/src/components/sandbox/AngularSerializer.ts @@ -94,6 +94,9 @@ export class AngularSerializer extends BaseSerializer implements Serializer { if (tail === "OneColumnLayout" && this.version === "new") { tail = "ColumnLayout"; } + if (tail === "TextArea" && this.version === "new") { + tail = "Textarea" + } return `${this.version === "old" ? "goa" : "goab"}-${this.dasherize(tail)}`; } diff --git a/src/examples/add-another-item-in-a-modal.tsx b/src/examples/add-another-item-in-a-modal.tsx index 60d5874e3..335443853 100644 --- a/src/examples/add-another-item-in-a-modal.tsx +++ b/src/examples/add-another-item-in-a-modal.tsx @@ -4,7 +4,7 @@ import { GoabContainer, GoabDropdown, GoabDropdownItem, GoabFormItem, GoabInput, - GoabModal, GoabTextarea + GoabModal, GoabTextArea } from "@abgov/react-components"; import { CodeSnippet } from "@components/code-snippet/CodeSnippet.tsx"; import { useContext, useState } from "react"; @@ -66,12 +66,12 @@ export const AddAnotherItemInAModal = () => { name="name"> - + value={description}> diff --git a/src/examples/ask-a-long-answer-question-with-a-maximum-word-count.tsx b/src/examples/ask-a-long-answer-question-with-a-maximum-word-count.tsx index cbf4e2b52..1e2cbc331 100644 --- a/src/examples/ask-a-long-answer-question-with-a-maximum-word-count.tsx +++ b/src/examples/ask-a-long-answer-question-with-a-maximum-word-count.tsx @@ -1,7 +1,7 @@ import { Sandbox } from "@components/sandbox"; import { GoabFormItem, - GoabTextarea + GoabTextArea } from "@abgov/react-components"; export const AskALongAnswerQuestionWithAMaximumWordCount = () => { @@ -13,7 +13,7 @@ export const AskALongAnswerQuestionWithAMaximumWordCount = () => { - + diff --git a/src/examples/give-context-before-asking-a-long-answer-question.tsx b/src/examples/give-context-before-asking-a-long-answer-question.tsx index e3de88d02..3e0fd8a2a 100644 --- a/src/examples/give-context-before-asking-a-long-answer-question.tsx +++ b/src/examples/give-context-before-asking-a-long-answer-question.tsx @@ -4,7 +4,7 @@ import { GoabButtonGroup, GoabDetails, GoabFormItem, - GoabTextarea + GoabTextArea } from "@abgov/react-components"; import { CodeSnippet } from "@components/code-snippet/CodeSnippet.tsx"; import { useContext } from "react"; @@ -44,7 +44,7 @@ export const GiveContextBeforeAskingALongAnswerQuestion = () => { - + diff --git a/src/examples/include-a-link-in-the-helper-text-of-an-option.tsx b/src/examples/include-a-link-in-the-helper-text-of-an-option.tsx index 18714d585..5b7e18747 100644 --- a/src/examples/include-a-link-in-the-helper-text-of-an-option.tsx +++ b/src/examples/include-a-link-in-the-helper-text-of-an-option.tsx @@ -1,5 +1,5 @@ import { CodeSnippet } from "@components/code-snippet/CodeSnippet.tsx"; -import { GoabCheckbox, GoabFormItem } from "@abgov/react-components"; +import { GoabRadioGroup, GoabRadioItem, GoabFormItem } from "@abgov/react-components"; import { Sandbox } from "@components/sandbox"; import { useContext } from "react"; import { LanguageVersionContext } from "@contexts/LanguageVersionContext.tsx"; @@ -17,14 +17,16 @@ export const IncludeALinkInTheHelperTextOfAnOption = () => { tags="angular" allowCopy={true} code={` - - - Help text with a link. - - - - - `} + + + + Help text with a link. + + + + + + `} />} {version === "new" && { tags="angular" allowCopy={true} code={` - - - - Help text with a link. - - - - - - `} + + + + + Help text with a link. + + + + + + + `} />} {/*React*/} @@ -50,17 +54,18 @@ export const IncludeALinkInTheHelperTextOfAnOption = () => { tags="react" allowCopy={true} code={` - - Help text with a link.} - /> - - - - `} + + + Help text with a link.} + /> + + + + + `} />} {version === "new" && { tags="react" allowCopy={true} code={` - - Help text with a link.} - /> - - - - `} + + + Help text with a link.} + /> + + + + + `} />} - Help text with a link.} - /> - - + + Help text with a link.} + /> + + + diff --git a/src/examples/include-descriptions-for-items-in-a-checkbox-list.tsx b/src/examples/include-descriptions-for-items-in-a-checkbox-list.tsx index 98aa9c562..c3605278c 100644 --- a/src/examples/include-descriptions-for-items-in-a-checkbox-list.tsx +++ b/src/examples/include-descriptions-for-items-in-a-checkbox-list.tsx @@ -1,4 +1,4 @@ -import { GoabFormItem, GoabRadioGroup, GoabRadioItem } from "@abgov/react-components"; +import { GoabFormItem, GoabCheckbox } from "@abgov/react-components"; import { Sandbox } from "@components/sandbox"; import { CodeSnippet } from "@components/code-snippet/CodeSnippet.tsx"; import { useContext } from "react"; @@ -19,14 +19,12 @@ export default function IncludeDescriptionsForIndividualInputOptions() { allowCopy={true} code={` - - - Use the account associated with the business - - - If you don't have a Alberta.ca login, you can create one - - + + Use the account associated with the business + + If you don't have a Alberta.ca login, you can create one + `} /> @@ -42,7 +40,8 @@ export default function IncludeDescriptionsForIndividualInputOptions() { public constructor(private fb: FormBuilder) { this.form = this.fb.group({ - selectOne: ["1"] + checkboxOne: [""], + checkboxTwo: [""] }); } } @@ -57,18 +56,16 @@ export default function IncludeDescriptionsForIndividualInputOptions() { allowCopy={true} code={` - - - - Use the account associated with the business - - - - - If you don't have a Alberta.ca login, you can create one - - - + + + Use the account associated with the business + + + + + If you don't have a Alberta.ca login, you can create one + + `} /> @@ -82,18 +79,20 @@ export default function IncludeDescriptionsForIndividualInputOptions() { allowCopy={true} code={` - - - - + + `} /> @@ -106,36 +105,40 @@ export default function IncludeDescriptionsForIndividualInputOptions() { allowCopy={true} code={` - - - - + + `} /> )} - - - - + + ) diff --git a/src/examples/review-and-action.tsx b/src/examples/review-and-action.tsx index 79d5b8f9d..e43cb057d 100644 --- a/src/examples/review-and-action.tsx +++ b/src/examples/review-and-action.tsx @@ -6,7 +6,7 @@ import { GoabContainer, GoabDropdown, GoabDropdownItem, GoabFormItem, GoabGrid, - GoabRadioGroup, GoabRadioItem, GoabTextarea + GoabRadioGroup, GoabRadioItem, GoabTextArea } from "@abgov/react-components"; import { useContext } from "react"; import { LanguageVersionContext } from "@contexts/LanguageVersionContext.tsx"; @@ -170,7 +170,7 @@ export const ReviewAndAction = () => { - {}} /> + {}} /> {}}> diff --git a/src/routes/components/TextArea.tsx b/src/routes/components/TextArea.tsx index 3d18a5eb2..b1aa0e960 100644 --- a/src/routes/components/TextArea.tsx +++ b/src/routes/components/TextArea.tsx @@ -5,7 +5,7 @@ import { ComponentProperty, } from "@components/component-properties/ComponentProperties.tsx"; import { Category, ComponentHeader } from "@components/component-header/ComponentHeader.tsx"; -import { GoabBadge, GoabFormItem, GoabTab, GoabTabs, GoabTextarea } from "@abgov/react-components"; +import { GoabBadge, GoabFormItem, GoabTab, GoabTabs, GoabTextArea } from "@abgov/react-components"; import { CodeSnippet } from "@components/code-snippet/CodeSnippet.tsx"; import { useSandboxFormItem } from "@hooks/useSandboxFormItem.tsx"; import { ComponentContent } from "@components/component-content/ComponentContent"; @@ -517,7 +517,7 @@ export default function TextAreaPage() { )}
- - handleChange(event.name, event.value) } rows={ 6 } width="90%" error={ !!expectedError } /> + handleChange(event.name, event.value) } rows={ 6 } width="90%" error={ !!expectedError } /> - handleChange(event.name, event.value) } rows={ 6 } width="90%" error={ !!actualError } /> + handleChange(event.name, event.value) } rows={ 6 } width="90%" error={ !!actualError } /> - handleChange(event.name, event.value) } rows={ 6 } width="90%" error={ !!replicationError } /> + handleChange(event.name, event.value) } rows={ 6 } width="90%" error={ !!replicationError } /> - handleChange(event.name, event.value) } rows={ 6 } width="90%" /> + handleChange(event.name, event.value) } rows={ 6 } width="90%" /> Submit bug report