From 5863f81e58c79844b1ae5301a33b0a3726663eee Mon Sep 17 00:00:00 2001 From: Carlos Morales <51803643+cjosue15@users.noreply.github.com> Date: Mon, 9 Sep 2024 06:43:11 -0500 Subject: [PATCH] fix(formfield): add brain form-field and forms into the generator CLI (#369) * fix(form-field): add form field brain into peerDependencies (#365,#358,#351) - remove unused code - change docs from form-field to formfield - add ui-form-field-brain and ui-forms-brain into supported ui libraries * fix(form-field): run linter * fix(form-field): update supported UI libraries - form field brain and forms brain * feat(form-field): add UI form field test --- .../(form-field)/form-field.page.ts | 4 +- .../files/lib/form-field.spec.ts.template | 2 +- .../ui-form-field/files/index.ts.template | 14 ------- .../hlm-error.directive.ts.template | 10 ----- .../directives/hlm-hint.directive.ts.template | 10 ----- .../lib/hlm-form-field.component.ts.template | 41 ------------------- .../ui/libs/ui-form-field/generator.ts | 12 ------ .../generators/ui/supported-ui-libraries.json | 10 ++++- libs/ui/form-field/helm/package.json | 1 + libs/ui/input/helm/package.json | 2 + .../input/helm/src/lib/hlm-input.directive.ts | 2 +- libs/ui/select/brain/package.json | 4 +- .../src/lib/brn-slider-input.directive.ts | 4 +- .../src/lib/brn-slider-thumb.directive.ts | 2 +- .../src/lib/brn-slider-track.directive.ts | 4 +- .../brain/src/lib/brn-slider.directive.ts | 10 ++--- libs/ui/slider/slider.stories.ts | 2 +- 17 files changed, 29 insertions(+), 105 deletions(-) delete mode 100644 libs/cli/src/generators/ui/libs/ui-form-field/files/index.ts.template delete mode 100644 libs/cli/src/generators/ui/libs/ui-form-field/files/lib/directives/hlm-error.directive.ts.template delete mode 100644 libs/cli/src/generators/ui/libs/ui-form-field/files/lib/directives/hlm-hint.directive.ts.template delete mode 100644 libs/cli/src/generators/ui/libs/ui-form-field/files/lib/hlm-form-field.component.ts.template delete mode 100644 libs/cli/src/generators/ui/libs/ui-form-field/generator.ts diff --git a/apps/app/src/app/pages/(components)/components/(form-field)/form-field.page.ts b/apps/app/src/app/pages/(components)/components/(form-field)/form-field.page.ts index 6c11fabd9..d0ec51d65 100644 --- a/apps/app/src/app/pages/(components)/components/(form-field)/form-field.page.ts +++ b/apps/app/src/app/pages/(components)/components/(form-field)/form-field.page.ts @@ -62,8 +62,8 @@ export const routeMeta: RouteMeta = { Installation Usage diff --git a/libs/cli/src/generators/ui/libs/ui-form-field-helm/files/lib/form-field.spec.ts.template b/libs/cli/src/generators/ui/libs/ui-form-field-helm/files/lib/form-field.spec.ts.template index a54e33afb..315a7873b 100644 --- a/libs/cli/src/generators/ui/libs/ui-form-field-helm/files/lib/form-field.spec.ts.template +++ b/libs/cli/src/generators/ui/libs/ui-form-field-helm/files/lib/form-field.spec.ts.template @@ -132,4 +132,4 @@ describe('Hlm Form Field Component', () => { expect(error()?.textContent?.trim()).toBe(TEXT_ERROR); }); }); -}); +}); \ No newline at end of file diff --git a/libs/cli/src/generators/ui/libs/ui-form-field/files/index.ts.template b/libs/cli/src/generators/ui/libs/ui-form-field/files/index.ts.template deleted file mode 100644 index ae0f270ca..000000000 --- a/libs/cli/src/generators/ui/libs/ui-form-field/files/index.ts.template +++ /dev/null @@ -1,14 +0,0 @@ -import { NgModule } from '@angular/core'; -import { HlmErrorDirective } from './lib/directives/hlm-error.directive'; -import { HlmHintDirective } from './lib/directives/hlm-hint.directive'; -import { HlmFormFieldComponent } from './lib/hlm-form-field.component'; - -export * from './lib/hlm-form-field.component'; -export * from './lib/directives/hlm-error.directive'; -export * from './lib/directives/hlm-hint.directive'; - -@NgModule({ - imports: [HlmFormFieldComponent, HlmErrorDirective, HlmHintDirective], - exports: [HlmFormFieldComponent, HlmErrorDirective, HlmHintDirective], -}) -export class HlmFormFieldModule {} diff --git a/libs/cli/src/generators/ui/libs/ui-form-field/files/lib/directives/hlm-error.directive.ts.template b/libs/cli/src/generators/ui/libs/ui-form-field/files/lib/directives/hlm-error.directive.ts.template deleted file mode 100644 index 1b72b9505..000000000 --- a/libs/cli/src/generators/ui/libs/ui-form-field/files/lib/directives/hlm-error.directive.ts.template +++ /dev/null @@ -1,10 +0,0 @@ -import { Directive } from "@angular/core"; - -@Directive({ - standalone: true, - selector: 'hlm-error', - host: { - class: 'block text-destructive text-sm font-medium' - } -}) -export class HlmErrorDirective {} \ No newline at end of file diff --git a/libs/cli/src/generators/ui/libs/ui-form-field/files/lib/directives/hlm-hint.directive.ts.template b/libs/cli/src/generators/ui/libs/ui-form-field/files/lib/directives/hlm-hint.directive.ts.template deleted file mode 100644 index 66befb15e..000000000 --- a/libs/cli/src/generators/ui/libs/ui-form-field/files/lib/directives/hlm-hint.directive.ts.template +++ /dev/null @@ -1,10 +0,0 @@ -import { Directive } from '@angular/core'; - -@Directive({ - selector: 'hlm-hint', - standalone: true, - host: { - class: 'block text-sm text-muted-foreground', - }, -}) -export class HlmHintDirective {} diff --git a/libs/cli/src/generators/ui/libs/ui-form-field/files/lib/hlm-form-field.component.ts.template b/libs/cli/src/generators/ui/libs/ui-form-field/files/lib/hlm-form-field.component.ts.template deleted file mode 100644 index 41ca6f007..000000000 --- a/libs/cli/src/generators/ui/libs/ui-form-field/files/lib/hlm-form-field.component.ts.template +++ /dev/null @@ -1,41 +0,0 @@ -import { Component, type Signal, computed, contentChild, contentChildren, effect } from '@angular/core'; - -import { BrnFormFieldControl } from '@spartan-ng/ui-form-field-brain'; -import { HlmErrorDirective } from './directives/hlm-error.directive'; - -@Component({ - selector: 'hlm-form-field', - template: ` - - - @switch (hasDisplayedMessage()) { - @case ('error') { - - } - @default { - - } - } - `, - standalone: true, - host: { - class: 'space-y-2 block', - }, -}) -export class HlmFormFieldComponent { - control = contentChild(BrnFormFieldControl); - - errorChildren = contentChildren(HlmErrorDirective); - - hasDisplayedMessage: Signal<'error' | 'hint'> = computed(() => { - return this.errorChildren() && this.errorChildren().length > 0 && this.control()?.errorState() ? 'error' : 'hint'; - }); - - constructor() { - effect(() => { - if(!this.control()) { - throw new Error('hlm-form-field must contain a BrnFormFieldControl.'); - } - }) - } -} diff --git a/libs/cli/src/generators/ui/libs/ui-form-field/generator.ts b/libs/cli/src/generators/ui/libs/ui-form-field/generator.ts deleted file mode 100644 index c9bca0562..000000000 --- a/libs/cli/src/generators/ui/libs/ui-form-field/generator.ts +++ /dev/null @@ -1,12 +0,0 @@ -import { Tree } from '@nx/devkit'; -import hlmBaseGenerator from '../../../base/generator'; -import { HlmBaseGeneratorSchema } from '../../../base/schema'; - -export async function generator(tree: Tree, options: HlmBaseGeneratorSchema) { - return await hlmBaseGenerator(tree, { - ...options, - primitiveName: 'form-field', - internalName: 'ui-form-field-helm', - publicName: 'ui-form-field-helm', - }); -} diff --git a/libs/cli/src/generators/ui/supported-ui-libraries.json b/libs/cli/src/generators/ui/supported-ui-libraries.json index d6973bc74..c9d3b363a 100644 --- a/libs/cli/src/generators/ui/supported-ui-libraries.json +++ b/libs/cli/src/generators/ui/supported-ui-libraries.json @@ -110,7 +110,9 @@ "@angular/core": "^18.0.0", "@spartan-ng/ui-core": "0.0.1-alpha.353", "class-variance-authority": "^0.6.0", - "clsx": "^1.2.1" + "clsx": "^1.2.1", + "@spartan-ng/ui-form-field-brain": "0.0.1-alpha.353", + "@spartan-ng/ui-forms-brain": "0.0.1-alpha.353" } }, "label": { @@ -304,6 +306,9 @@ "@angular/core": "^18.0.0", "@spartan-ng/ui-core": "0.0.1-alpha.353", "@spartan-ng/ui-select-brain": "0.0.1-alpha.353", + "@spartan-ng/ui-label-brain": "0.0.1-alpha.353", + "@spartan-ng/ui-form-field-brain": "0.0.1-alpha.353", + "@spartan-ng/ui-forms-brain": "0.0.1-alpha.353", "class-variance-authority": "^0.6.0", "clsx": "^1.2.1" } @@ -332,7 +337,8 @@ "@angular/core": "^18.0.0", "@spartan-ng/ui-core": "0.0.1-alpha.353", "class-variance-authority": "^0.6.0", - "clsx": "^1.2.1" + "clsx": "^1.2.1", + "@spartan-ng/ui-form-field-brain": "0.0.1-alpha.353" } } } diff --git a/libs/ui/form-field/helm/package.json b/libs/ui/form-field/helm/package.json index 3e88a1031..6dacfccf2 100644 --- a/libs/ui/form-field/helm/package.json +++ b/libs/ui/form-field/helm/package.json @@ -5,6 +5,7 @@ "@angular/core": "^18.0.0", "@spartan-ng/ui-core": "0.0.1-alpha.353", "class-variance-authority": "^0.6.0", + "@spartan-ng/ui-form-field-brain": "0.0.1-alpha.353", "clsx": "^1.2.1" }, "dependencies": {}, diff --git a/libs/ui/input/helm/package.json b/libs/ui/input/helm/package.json index cb1c44848..3c3dd5e07 100644 --- a/libs/ui/input/helm/package.json +++ b/libs/ui/input/helm/package.json @@ -5,6 +5,8 @@ "@angular/core": "^18.0.0", "@spartan-ng/ui-core": "0.0.1-alpha.353", "class-variance-authority": "^0.6.0", + "@spartan-ng/ui-forms-brain": "0.0.1-alpha.353", + "@spartan-ng/ui-form-field-brain": "0.0.1-alpha.353", "clsx": "^1.2.1" }, "dependencies": {}, diff --git a/libs/ui/input/helm/src/lib/hlm-input.directive.ts b/libs/ui/input/helm/src/lib/hlm-input.directive.ts index 6089a37cf..7f6669261 100644 --- a/libs/ui/input/helm/src/lib/hlm-input.directive.ts +++ b/libs/ui/input/helm/src/lib/hlm-input.directive.ts @@ -1,4 +1,4 @@ -import { Directive, type DoCheck, Inject, Injector, Input, computed, effect, inject, input, signal } from '@angular/core'; +import { Directive, type DoCheck, Injector, Input, computed, effect, inject, input, signal } from '@angular/core'; import { FormGroupDirective, NgControl, NgForm } from '@angular/forms'; import { hlm } from '@spartan-ng/ui-core'; import { BrnFormFieldControl } from '@spartan-ng/ui-form-field-brain'; diff --git a/libs/ui/select/brain/package.json b/libs/ui/select/brain/package.json index 2634b7629..c539f6be7 100644 --- a/libs/ui/select/brain/package.json +++ b/libs/ui/select/brain/package.json @@ -7,7 +7,9 @@ "@angular/cdk": "^18.0.0", "@angular/forms": "^18.0.0", "@spartan-ng/ui-core": "0.0.1-alpha.353", - "@spartan-ng/ui-label-brain": "0.0.1-alpha.353" + "@spartan-ng/ui-label-brain": "0.0.1-alpha.353", + "@spartan-ng/ui-form-field-brain": "0.0.1-alpha.353", + "@spartan-ng/ui-forms-brain": "0.0.1-alpha.353" }, "dependencies": {}, "sideEffects": false, diff --git a/libs/ui/slider/brain/src/lib/brn-slider-input.directive.ts b/libs/ui/slider/brain/src/lib/brn-slider-input.directive.ts index 6646c7a8f..76c8a4c9f 100644 --- a/libs/ui/slider/brain/src/lib/brn-slider-input.directive.ts +++ b/libs/ui/slider/brain/src/lib/brn-slider-input.directive.ts @@ -6,13 +6,13 @@ import { InjectionToken, PLATFORM_ID, Renderer2, + type Signal, computed, effect, inject, signal, - type Signal, } from '@angular/core'; -import { NG_VALUE_ACCESSOR, type ControlValueAccessor } from '@angular/forms'; +import { type ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; import { BRN_SLIDER } from './brn-slider.directive'; export const BRN_SLIDER_INPUT = new InjectionToken('BrnSliderInput'); diff --git a/libs/ui/slider/brain/src/lib/brn-slider-thumb.directive.ts b/libs/ui/slider/brain/src/lib/brn-slider-thumb.directive.ts index 929f0fa56..0c1b8771e 100644 --- a/libs/ui/slider/brain/src/lib/brn-slider-thumb.directive.ts +++ b/libs/ui/slider/brain/src/lib/brn-slider-thumb.directive.ts @@ -1,5 +1,5 @@ import { isPlatformBrowser } from '@angular/common'; -import { Directive, ElementRef, PLATFORM_ID, computed, effect, inject, type Signal } from '@angular/core'; +import { Directive, ElementRef, PLATFORM_ID, type Signal, computed, effect, inject } from '@angular/core'; import { BRN_SLIDER } from './brn-slider.directive'; export interface BrnSliderThumb { diff --git a/libs/ui/slider/brain/src/lib/brn-slider-track.directive.ts b/libs/ui/slider/brain/src/lib/brn-slider-track.directive.ts index 5af54af92..f12f48c04 100644 --- a/libs/ui/slider/brain/src/lib/brn-slider-track.directive.ts +++ b/libs/ui/slider/brain/src/lib/brn-slider-track.directive.ts @@ -1,17 +1,17 @@ import { SharedResizeObserver } from '@angular/cdk/observers/private'; import { isPlatformBrowser } from '@angular/common'; import { + type AfterViewInit, Directive, ElementRef, InjectionToken, PLATFORM_ID, + type Signal, computed, contentChild, forwardRef, inject, signal, - type AfterViewInit, - type Signal, } from '@angular/core'; import { Subject, debounceTime, takeUntil, tap } from 'rxjs'; import { BRN_SLIDER_INPUT, type BrnSliderInput } from './brn-slider-input.directive'; diff --git a/libs/ui/slider/brain/src/lib/brn-slider.directive.ts b/libs/ui/slider/brain/src/lib/brn-slider.directive.ts index 3c45869a6..759a87b4d 100644 --- a/libs/ui/slider/brain/src/lib/brn-slider.directive.ts +++ b/libs/ui/slider/brain/src/lib/brn-slider.directive.ts @@ -1,19 +1,19 @@ -import { Directionality, type Direction } from '@angular/cdk/bidi'; +import { type Direction, Directionality } from '@angular/cdk/bidi'; import { isPlatformBrowser } from '@angular/common'; import { + type AfterViewInit, Directive, InjectionToken, Injector, + type OnDestroy, PLATFORM_ID, + type Signal, + type WritableSignal, contentChild, inject, input, model, signal, - type AfterViewInit, - type OnDestroy, - type Signal, - type WritableSignal, } from '@angular/core'; import { toObservable } from '@angular/core/rxjs-interop'; import type { BrnLabelDirective } from '@spartan-ng/ui-label-brain'; diff --git a/libs/ui/slider/slider.stories.ts b/libs/ui/slider/slider.stories.ts index fe4b55b39..d3a0e10f7 100644 --- a/libs/ui/slider/slider.stories.ts +++ b/libs/ui/slider/slider.stories.ts @@ -1,7 +1,7 @@ import type { Direction } from '@angular/cdk/bidi'; import { signal } from '@angular/core'; import { FormControl, FormGroup, FormsModule, ReactiveFormsModule } from '@angular/forms'; -import { argsToTemplate, moduleMetadata, type Meta, type StoryObj } from '@storybook/angular'; +import { type Meta, type StoryObj, argsToTemplate, moduleMetadata } from '@storybook/angular'; import { BrnSliderImports } from './brain/src'; import { HlmSliderImports } from './helm/src';