From b4c33eec66241bc3dc935e2452aa74d2c4fedf1f Mon Sep 17 00:00:00 2001 From: Woramat Ngamkham Date: Tue, 1 Nov 2022 22:24:29 +0700 Subject: [PATCH] refactor(form): deprecate labelPosition (#172) --- apps/demo/src/pages/index.astro | 1 - apps/docs/src/pages/en/page-2.md | 1 - packages/common/types/control.types.ts | 1 - packages/form/README.md | 1 - packages/form/components/Form.astro | 1 + packages/form/components/Label.astro | 4 ++-- packages/form/components/controls/Input.astro | 1 - packages/form/components/controls/TextArea.astro | 1 - packages/form/core/form-control.ts | 7 ------- packages/form/test/Field.astro.test.js | 4 ---- packages/form/test/FieldSet.astro.test.js | 1 - packages/validator/README.md | 1 - 12 files changed, 3 insertions(+), 21 deletions(-) diff --git a/apps/demo/src/pages/index.astro b/apps/demo/src/pages/index.astro index 88f9d5d..fb6433f 100644 --- a/apps/demo/src/pages/index.astro +++ b/apps/demo/src/pages/index.astro @@ -62,7 +62,6 @@ const config: ControlConfig = { type: "checkbox", name: "is-awesome", label: "is Awesome?", - labelPosition: "right", }; // insert a control diff --git a/apps/docs/src/pages/en/page-2.md b/apps/docs/src/pages/en/page-2.md index 89e2cb5..b9e4d00 100644 --- a/apps/docs/src/pages/en/page-2.md +++ b/apps/docs/src/pages/en/page-2.md @@ -56,7 +56,6 @@ form.controls.push( type: "checkbox", name: "is-awesome", label: "is Awesome?", - labelPosition: "right", }) ); diff --git a/packages/common/types/control.types.ts b/packages/common/types/control.types.ts index fb8f22b..1bc8e6d 100644 --- a/packages/common/types/control.types.ts +++ b/packages/common/types/control.types.ts @@ -33,7 +33,6 @@ export interface ControlBase { type?: ControlType; value?: string | number | string[]; label?: string; - labelPosition?: "right" | "left"; placeholder?: string; validators?: string[]; // TODO: implement validator type options?: string[] | ControlOption[]; diff --git a/packages/form/README.md b/packages/form/README.md index df68184..1f10105 100644 --- a/packages/form/README.md +++ b/packages/form/README.md @@ -58,7 +58,6 @@ form.controls.push( type: "checkbox", name: "is-awesome", label: "is Awesome?", - labelPosition: "right", }) ); diff --git a/packages/form/components/Form.astro b/packages/form/components/Form.astro index a115e53..ce0855f 100644 --- a/packages/form/components/Form.astro +++ b/packages/form/components/Form.astro @@ -57,3 +57,4 @@ const formName = Array.isArray(formGroups) ? null : formGroups?.name || null; border-color: red; } + \ No newline at end of file diff --git a/packages/form/components/Label.astro b/packages/form/components/Label.astro index 1616e27..0780471 100644 --- a/packages/form/components/Label.astro +++ b/packages/form/components/Label.astro @@ -15,7 +15,7 @@ const isRequired: boolean = showValidationHints && validators.includes('validato --- { - control.label && control.labelPosition === 'left' && ( + control.label && control.type !== "checkbox" && ( @@ -25,7 +25,7 @@ const isRequired: boolean = showValidationHints && validators.includes('validato { - control.label && control.labelPosition === 'right' && ( + control.label && control.type === "checkbox" && ( diff --git a/packages/form/components/controls/Input.astro b/packages/form/components/controls/Input.astro index 3e76529..0858dac 100644 --- a/packages/form/components/controls/Input.astro +++ b/packages/form/components/controls/Input.astro @@ -36,7 +36,6 @@ const validatorAttributes: Record = validators?.reduce((prev, va checked={control.value === 'checked'} placeholder={control.placeholder} data-label={control.label} - data-label-position={control.labelPosition} data-validator-haserrors={hasErrors.toString()} readonly={readOnly || null} disabled={(readOnly || null) && control.type === 'checkbox'} diff --git a/packages/form/components/controls/TextArea.astro b/packages/form/components/controls/TextArea.astro index b1f9c2e..df6fc62 100644 --- a/packages/form/components/controls/TextArea.astro +++ b/packages/form/components/controls/TextArea.astro @@ -32,7 +32,6 @@ const validatorAttributes: Record = validators?.reduce((prev, va rows={control?.rows ?? 3} cols={control?.cols ?? 21} data-label={control?.label} - data-label-position={control?.labelPosition} readonly={readOnly || null} {...validatorAttributes} > diff --git a/packages/form/core/form-control.ts b/packages/form/core/form-control.ts index 28fef8d..7c3da13 100644 --- a/packages/form/core/form-control.ts +++ b/packages/form/core/form-control.ts @@ -18,7 +18,6 @@ export class FormControl { private _type: ControlType = 'text'; private _value?: string | number | null | string[] | ControlOption[]; private _label = ''; - private _labelPosition?: 'right' | 'left' = 'left'; private _isValid = true; private _isPristine = true; private _placeholder: string | null = null; @@ -43,7 +42,6 @@ export class FormControl { type = 'text', value = null, label = '', - labelPosition = 'left', placeholder = null, validators = [], options = [], @@ -53,7 +51,6 @@ export class FormControl { this._type = type; this._value = value; this._label = label; - this._labelPosition = labelPosition; this._placeholder = placeholder; this._validators = validators; this._options = options; @@ -96,10 +93,6 @@ export class FormControl { return this._label; } - get labelPosition() { - return this._labelPosition; - } - get placeholder() { return this._placeholder; } diff --git a/packages/form/test/Field.astro.test.js b/packages/form/test/Field.astro.test.js index 191a04e..403bb6f 100644 --- a/packages/form/test/Field.astro.test.js +++ b/packages/form/test/Field.astro.test.js @@ -17,7 +17,6 @@ describe('Field.astro test', () => { control: { label: expectedLabel, name: 'username', - labelPosition: 'left', }, showValidationHints: false, }; @@ -38,7 +37,6 @@ describe('Field.astro test', () => { control: { label: expectedLabel, name: 'username', - labelPosition: 'left', validators: ['validator-required'], }, showValidationHints: true, @@ -60,7 +58,6 @@ describe('Field.astro test', () => { control: { label: 'FAKE LABEL', name: 'username', - labelPosition: 'left', validators: ['validator-required'], errors: [ { @@ -88,7 +85,6 @@ describe('Field.astro test', () => { control: { label: expectedLabel, name: 'username', - labelPosition: 'left', validators: ['validator-required'], }, readOnly: true, diff --git a/packages/form/test/FieldSet.astro.test.js b/packages/form/test/FieldSet.astro.test.js index 879ee39..db06c61 100644 --- a/packages/form/test/FieldSet.astro.test.js +++ b/packages/form/test/FieldSet.astro.test.js @@ -10,7 +10,6 @@ describe('FieldSet.astro test', () => { name: 'test', label: 'Test', type: 'text', - labelPosition: 'left', }; beforeEach(() => { diff --git a/packages/validator/README.md b/packages/validator/README.md index 46bdd45..a3fc798 100644 --- a/packages/validator/README.md +++ b/packages/validator/README.md @@ -62,7 +62,6 @@ form.controls.push( type: "checkbox", name: "is-awesome", label: "is Awesome?", - labelPosition: "right", }) );