@dereekb/dbx-form 1.2.0 → 2.0.0

package/lib/form/action/form.action.directive.d.ts

@@ -1,17 +1,15 @@
 import { OnInit, OnDestroy } from '@angular/core';
 import { Observable } from 'rxjs';
-import { ActionContextStoreSourceInstance } from '@dereekb/dbx-core';
+import { DbxActionContextStoreSourceInstance } from '@dereekb/dbx-core';
 import { ReadableError } from '@dereekb/util';
-import { LockSet } from '@dereekb/rxjs';
+import { LockSet, IsModifiedFn, IsValidFn } from '@dereekb/rxjs';
 import { DbxMutableForm } from '../../form/form';
 import * as i0 from "@angular/core";
 export interface DbxActionFormTriggerResult {
     value?: any;
     reject?: ReadableError;
 }
-export declare type DbxActionFormValidateFn<T = any> = (value: T) => Observable<boolean>;
-export declare type DbxActionFormModifiedFn<T = any> = (value: T) => Observable<boolean>;
-export declare const APP_ACTION_FORM_DISABLED_KEY = "actionForm";
+export declare const APP_ACTION_FORM_DISABLED_KEY = "dbx_action_form";
 /**
  * Used with an action to bind a form to an action as it's value source.
  *
@@ -21,24 +19,28 @@ export declare const APP_ACTION_FORM_DISABLED_KEY = "actionForm";
  */
 export declare class DbxActionFormDirective<T = any> implements OnInit, OnDestroy {
     readonly form: DbxMutableForm;
-    readonly source: ActionContextStoreSourceInstance<object, any>;
+    readonly source: DbxActionContextStoreSourceInstance<object, any>;
     readonly lockSet: LockSet;
     /**
      * Optional validator that checks whether or not the value is
      * ready to send before the context store is marked enabled.
      */
-    appActionFormValidator?: DbxActionFormValidateFn<T>;
+    dbxActionFormValidator?: IsValidFn<T>;
     /**
      * Optional function that checks whether or not the value has been modified.
      */
-    appActionFormModified?: DbxActionFormModifiedFn<T>;
+    dbxActionFormModified?: IsModifiedFn<T>;
+    private _formDisabledWhileWorking;
     private _triggeredSub;
     private _isCompleteSub;
-    constructor(form: DbxMutableForm, source: ActionContextStoreSourceInstance<object, any>);
+    private _isWorkingSub;
+    constructor(form: DbxMutableForm, source: DbxActionContextStoreSourceInstance<object, any>);
+    get dbxActionFormDisabledWhileWorking(): boolean;
+    set dbxActionFormDisabledWhileWorking(dbxActionFormDisabledWhileWorking: boolean);
     ngOnInit(): void;
     ngOnDestroy(): void;
     protected preCheckReadyValue(value: T): Observable<boolean>;
     protected readyValue(value: T): Observable<DbxActionFormTriggerResult>;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxActionFormDirective<any>, [{ host: true; }, null]>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DbxActionFormDirective<any>, "[dbxActionForm]", never, { "appActionFormValidator": "appActionFormValidator"; "appActionFormModified": "appActionFormModified"; }, {}, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DbxActionFormDirective<any>, "[dbxActionForm]", never, { "dbxActionFormValidator": "dbxActionFormValidator"; "dbxActionFormModified": "dbxActionFormModified"; "dbxActionFormDisabledWhileWorking": "dbxActionFormDisabledWhileWorking"; }, {}, never>;
 }

package/lib/form/action/transition/form.action.transition.safety.directive.d.ts

@@ -1,7 +1,7 @@
 import { ViewContainerRef } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
 import { HookResult, Transition, TransitionService } from '@uirouter/core';
-import { ActionContextStoreSourceInstance } from '@dereekb/dbx-core';
+import { DbxActionContextStoreSourceInstance } from '@dereekb/dbx-core';
 import { DbxActionTransitionSafetyType, DbxActionTransitionSafetyDirective } from '@dereekb/dbx-web';
 import { DbxActionFormDirective } from '../form.action.directive';
 import * as i0 from "@angular/core";
@@ -11,9 +11,9 @@ import * as i0 from "@angular/core";
  * NOTE: Only works with UIRouter
  */
 export declare class DbxActionFormSafetyDirective<T, O> extends DbxActionTransitionSafetyDirective<T, O> {
-    readonly appActionForm: DbxActionFormDirective<T>;
+    readonly dbxActionForm: DbxActionFormDirective<T>;
     inputSafetyType?: DbxActionTransitionSafetyType;
-    constructor(appActionForm: DbxActionFormDirective<T>, source: ActionContextStoreSourceInstance<T, O>, transitionService: TransitionService, viewContainerRef: ViewContainerRef, dialog: MatDialog);
+    constructor(dbxActionForm: DbxActionFormDirective<T>, source: DbxActionContextStoreSourceInstance<T, O>, transitionService: TransitionService, viewContainerRef: ViewContainerRef, dialog: MatDialog);
     protected _handleOnBeforeTransition(transition: Transition): HookResult;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxActionFormSafetyDirective<any, any>, [{ host: true; }, null, null, null, null]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<DbxActionFormSafetyDirective<any, any>, "[dbxActionFormSafety]", never, { "inputSafetyType": "dbxActionFormSafety"; }, {}, never>;

package/lib/form/form.d.ts

@@ -1,7 +1,7 @@
 import { Provider, Type } from '@angular/core';
 import { Observable } from 'rxjs';
 import { LockSet } from '@dereekb/rxjs';
-import { Maybe } from '@dereekb/util';
+import { BooleanStringKeyArray, Maybe } from '@dereekb/util';
 /**
  * Current state of a DbxForm
  */
@@ -10,6 +10,11 @@ export declare enum DbxFormState {
     RESET = 0,
     USED = 1
 }
+/**
+ * Unique key for disabling/enabling.
+ */
+export declare type DbxFormDisabledKey = string;
+export declare const DEFAULT_FORM_DISABLED_KEY = "dbx_form_disabled";
 /**
  * DbxForm stream event
  */
@@ -20,7 +25,14 @@ export interface DbxFormEvent {
     readonly untouched?: boolean;
     readonly lastResetAt?: Date;
     readonly changesCount?: number;
+    /**
+     * Whether or not the form is disabled.
+     */
     readonly isDisabled?: boolean;
+    /**
+     * Current disabled state keys.
+     */
+    readonly disabled?: BooleanStringKeyArray;
 }
 /**
  * Form that has an event stream, value, and state items.
@@ -31,6 +43,10 @@ export declare abstract class DbxForm<T = any> {
      * Returns an observable that returns the current state of the form.
      */
     abstract getValue(): Observable<T>;
+    /**
+     * Returns an observable that returns the current disabled keys.
+     */
+    abstract getDisabled(): Observable<BooleanStringKeyArray>;
 }
 export declare abstract class DbxMutableForm<T = any> extends DbxForm<T> {
     /**
@@ -48,11 +64,11 @@ export declare abstract class DbxMutableForm<T = any> extends DbxForm<T> {
      */
     abstract resetForm(): void;
     /**
-     * Sets the form's disabled state.
+     * Disables the form
      *
      * @param disabled
      */
-    abstract setDisabled(disabled?: boolean): void;
+    abstract setDisabled(key?: DbxFormDisabledKey, disabled?: boolean): void;
     /**
      * Force the form to update itself as if it was changed.
      */

package/lib/form/io/form.input.directive.d.ts

@@ -1,6 +1,7 @@
 import { Observable } from 'rxjs';
 import { AbstractSubscriptionDirective } from '@dereekb/dbx-core';
 import { DbxMutableForm } from '../form';
+import { Maybe } from '@dereekb/util';
 import * as i0 from "@angular/core";
 /**
  * Used with a FormComponent to set the value based on the input value.
@@ -11,7 +12,7 @@ export declare class DbxFormSourceDirective<T extends object = any> extends Abst
     /**
      * Sets a LoadingContext that is watched for the loading state.
      */
-    set obs(obs: Observable<T>);
+    set obs(obs: Observable<Maybe<Partial<T>>>);
     private _setObs;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxFormSourceDirective<any>, [{ host: true; }]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<DbxFormSourceDirective<any>, "[dbxFormSource]", never, { "obs": "dbxFormSource"; }, {}, never>;

package/lib/formly/field/component/component.field.component.d.ts

@@ -1,26 +1,13 @@
-import { OnInit, Type } from '@angular/core';
 import { DbxInjectedComponentConfig } from '@dereekb/dbx-core';
 import { FieldType, FormlyFieldConfig } from '@ngx-formly/core';
-import { Maybe } from '@dereekb/util';
 import * as i0 from "@angular/core";
-export interface FormComponentFieldWrappedComponent {
-    field: FieldType<FormComponentFieldFieldConfig>;
+export interface DbxFormComponentFieldConfig<T> extends DbxInjectedComponentConfig<T> {
 }
-export declare abstract class AbstractFormComponentFieldWrappedComponent implements FormComponentFieldWrappedComponent {
-    abstract field: FieldType<FormComponentFieldFieldConfig>;
+export interface DbxFormComponentFormlyFieldConfig<T = any> extends FormlyFieldConfig {
+    componentField: DbxFormComponentFieldConfig<T>;
 }
-export interface FormComponentFieldFieldConfig<T extends FormComponentFieldWrappedComponent = any> extends FormlyFieldConfig {
-    componentField: {
-        componentClass: Type<T>;
-    };
-}
-export declare class FormComponentFieldComponent<T extends FormComponentFieldWrappedComponent = any> extends FieldType<FormComponentFieldFieldConfig<T>> implements OnInit {
-    private _config?;
-    get config(): Maybe<DbxInjectedComponentConfig>;
-    get componentField(): {
-        componentClass: Type<T>;
-    };
-    ngOnInit(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<FormComponentFieldComponent<any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<FormComponentFieldComponent<any>, "ng-component", never, {}, {}, never, never>;
+export declare class DbxFormComponentFieldComponent<T = any> extends FieldType<DbxFormComponentFormlyFieldConfig<T>> {
+    get config(): DbxInjectedComponentConfig<T>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DbxFormComponentFieldComponent<any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxFormComponentFieldComponent<any>, "ng-component", never, {}, {}, never, never>;
 }

package/lib/formly/field/component/component.field.d.ts

@@ -1,6 +1,4 @@
-import { Type } from "@angular/core";
-import { FormComponentFieldWrappedComponent, FormComponentFieldFieldConfig } from "./component.field.component";
-export interface ComponentFieldConfig<T> {
-    componentClass: Type<T>;
+import { DbxFormComponentFieldConfig, DbxFormComponentFormlyFieldConfig } from "./component.field.component";
+export interface ComponentFieldConfig<T = any> extends DbxFormComponentFieldConfig<T> {
 }
-export declare function componentField<T extends FormComponentFieldWrappedComponent>({ componentClass }: ComponentFieldConfig<T>): FormComponentFieldFieldConfig<T>;
+export declare function componentField<T>(config: ComponentFieldConfig<T>): DbxFormComponentFormlyFieldConfig;

package/lib/formly/field/component/component.field.module.d.ts

@@ -5,6 +5,6 @@ import * as i3 from "@dereekb/dbx-core";
 import * as i4 from "@ngx-formly/core";
 export declare class DbxFormFormlyComponentFieldModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxFormFormlyComponentFieldModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxFormFormlyComponentFieldModule, [typeof i1.FormComponentFieldComponent], [typeof i2.CommonModule, typeof i3.DbxInjectedComponentModule, typeof i4.FormlyModule], [typeof i1.FormComponentFieldComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxFormFormlyComponentFieldModule, [typeof i1.DbxFormComponentFieldComponent], [typeof i2.CommonModule, typeof i3.DbxInjectedComponentModule, typeof i4.FormlyModule], [typeof i1.DbxFormComponentFieldComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<DbxFormFormlyComponentFieldModule>;
 }

package/lib/formly/field/selection/searchable/searchable.field.autocomplete.item.component.d.ts

@@ -3,7 +3,7 @@ import { InjectionToken, OnDestroy } from '@angular/core';
 import { ConfiguredSearchableValueFieldDisplayValue } from './searchable';
 import { DbxInjectedComponentConfig } from '@dereekb/dbx-core';
 import * as i0 from "@angular/core";
-export declare const DBX_SEARCHABLE_FIELD_COMPONENT_DATA: InjectionToken<unknown>;
+export declare const DBX_SEARCHABLE_FIELD_COMPONENT_DATA_TOKEN: InjectionToken<unknown>;
 export declare class DbxSearchableFieldAutocompleteItemComponent<T> implements OnDestroy {
     private _displayValue;
     readonly displayValue$: Observable<ConfiguredSearchableValueFieldDisplayValue<T, any>>;

package/lib/formly/field/texteditor/_texteditor.scss

@@ -34,8 +34,6 @@
   $border-color: theming.get-color-from-palette($foreground, 'divider');
   $text-color: theming.get-color-from-palette($foreground, 'text');
 
-  @debug $border-color;
-
   .dbx-texteditor-field {
 
     .NgxEditor {

package/lib/formly/field/value/date/datetime.field.component.d.ts

@@ -1,11 +1,10 @@
-import { MatInput } from '@angular/material/input';
+import { LogicalDateStringCode, Maybe, ReadableTimeString } from '@dereekb/util';
 import { DateTimeMinuteConfig } from '@dereekb/date';
 import { ChangeDetectorRef, OnDestroy, OnInit } from '@angular/core';
 import { AbstractControl, FormControl } from '@angular/forms';
 import { FieldType } from '@ngx-formly/material';
 import { FieldTypeConfig, FormlyFieldConfig } from '@ngx-formly/core';
 import { Observable } from 'rxjs';
-import { Maybe, ReadableTimeString } from '@dereekb/util';
 import { MatDatepickerInputEvent } from '@angular/material/datepicker';
 import * as i0 from "@angular/core";
 export declare enum DateTimeFieldTimeMode {
@@ -57,7 +56,6 @@ export interface DateTimeFormlyFieldConfig extends FormlyFieldConfig {
 }
 export declare class DbxDateTimeFieldComponent extends FieldType<DateTimeFormlyFieldConfig & FieldTypeConfig> implements OnInit, OnDestroy {
     private readonly cdRef;
-    dateInput: MatInput;
     private _sub;
     private _valueSub;
     private _fullDayInputCtrl?;
@@ -73,8 +71,8 @@ export declare class DbxDateTimeFieldComponent extends FieldType<DateTimeFormlyF
      */
     readonly displayValue$: Observable<any>;
     readonly timeString$: Observable<ReadableTimeString>;
+    readonly dateInputCtrl: FormControl;
     readonly timeInputCtrl: FormControl;
-    private _date;
     private _config;
     get dateOnly(): boolean;
     get dateTimeField(): DbxDateTimeFieldConfig;
@@ -85,7 +83,7 @@ export declare class DbxDateTimeFieldComponent extends FieldType<DateTimeFormlyF
     readonly fullDay$: Observable<boolean>;
     readonly showTimeInput$: Observable<boolean>;
     readonly showAddTime$: Observable<boolean>;
-    readonly date$: Observable<Maybe<Date>>;
+    readonly date$: Observable<any>;
     readonly dateValue$: Observable<Date | null | undefined>;
     readonly timeInput$: Observable<ReadableTimeString>;
     readonly config$: Observable<Maybe<DateTimePickerConfiguration>>;
@@ -94,8 +92,8 @@ export declare class DbxDateTimeFieldComponent extends FieldType<DateTimeFormlyF
     constructor(cdRef: ChangeDetectorRef);
     ngOnInit(): void;
     ngOnDestroy(): void;
-    dateTextChanged(e: any): void;
     datePicked(event: MatDatepickerInputEvent<Date>): void;
+    setLogicalTime(time: LogicalDateStringCode): void;
     setTime(time: ReadableTimeString): void;
     keydownOnInput(event: KeyboardEvent): void;
     focusTime(): void;

package/lib/formly/field/value/date/datetime.field.d.ts

@@ -10,5 +10,5 @@ export declare const TAKE_NEXT_UPCOMING_TIME_CONFIG_OBS: () => Observable<DateTi
 /**
  * Same as DateTime field but with the Date input hidden by default.
  */
-export declare function timeOnlyField(config: Partial<TimeFieldConfig>): FormlyFieldConfig;
-export declare function dateTimeField(config: Partial<DateTimeFieldConfig>): FormlyFieldConfig;
+export declare function timeOnlyField(config?: Partial<TimeFieldConfig>): FormlyFieldConfig;
+export declare function dateTimeField(config?: Partial<DateTimeFieldConfig>): FormlyFieldConfig;

package/lib/formly/formly.context.d.ts

@@ -1,20 +1,20 @@
 import { Provider } from '@angular/core';
 import { Observable } from 'rxjs';
-import { DbxForm, DbxFormEvent, DbxMutableForm } from '../form/form';
+import { DbxForm, DbxFormDisabledKey, DbxFormEvent, DbxMutableForm } from '../form/form';
 import { FormlyFieldConfig } from '@ngx-formly/core';
 import { LockSet } from '@dereekb/rxjs';
-import { Maybe } from '@dereekb/util';
+import { BooleanStringKeyArray, Maybe } from '@dereekb/util';
 export interface DbxFormlyInitialize<T> {
     fields: Observable<FormlyFieldConfig[]>;
+    initialDisabled: BooleanStringKeyArray;
     initialValue: Maybe<Partial<T>>;
-    initialDisabled: boolean;
 }
 /**
  * DbxFormlyContext delegate.
  *
  * This is usually the component or element that contains the form itself.
  */
-export interface DbxFormlyContextDelegate<T = any> extends Omit<DbxMutableForm<T>, 'lockSet' | 'setDisabled'> {
+export interface DbxFormlyContextDelegate<T = any> extends Omit<DbxMutableForm<T>, 'lockSet'> {
     readonly stream$: Observable<DbxFormEvent>;
     init(initialize: DbxFormlyInitialize<T>): void;
 }
@@ -33,6 +33,7 @@ export declare class DbxFormlyContext<T> implements DbxForm<T> {
     private _disabled;
     private _delegate;
     readonly fields$: Observable<FormlyFieldConfig[]>;
+    readonly disabled$: Observable<string[]>;
     readonly stream$: Observable<DbxFormEvent>;
     constructor();
     destroy(): void;
@@ -43,7 +44,9 @@ export declare class DbxFormlyContext<T> implements DbxForm<T> {
     getValue(): Observable<T>;
     setValue(value: Partial<T>): void;
     isDisabled(): boolean;
-    setDisabled(disabled?: boolean): void;
+    get disabled(): BooleanStringKeyArray;
+    getDisabled(): Observable<BooleanStringKeyArray>;
+    setDisabled(key?: DbxFormDisabledKey, disabled?: boolean): void;
     resetForm(): void;
     forceFormUpdate(): void;
 }

package/lib/formly/formly.directive.d.ts

@@ -3,6 +3,7 @@ import { FormlyFieldConfig } from '@ngx-formly/core/lib/core';
 import { OnInit, OnDestroy } from '@angular/core';
 import { DbxFormlyContext } from './formly.context';
 import { Maybe } from '@dereekb/util';
+import { DbxFormDisabledKey } from '../form/form';
 import * as i0 from "@angular/core";
 /**
  * Abstract component for wrapping a form.
@@ -17,6 +18,7 @@ export declare abstract class AbstractFormlyFormDirective<T> implements OnDestro
     setValue(value: Partial<T>): void;
     resetForm(): void;
     clearValue(): void;
+    setDisabled(key?: DbxFormDisabledKey, disabled?: boolean): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<AbstractFormlyFormDirective<any>, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<AbstractFormlyFormDirective<any>, never, never, { "disabled": "disabled"; }, {}, never>;
 }

package/lib/formly/formly.form.component.d.ts

@@ -3,9 +3,15 @@ import { FormGroup } from '@angular/forms';
 import { FormlyFieldConfig, FormlyFormOptions } from '@ngx-formly/core';
 import { Observable } from 'rxjs';
 import { AbstractSubscriptionDirective } from '@dereekb/dbx-core';
-import { DbxForm, DbxFormEvent } from '../form/form';
+import { DbxForm, DbxFormDisabledKey, DbxFormEvent } from '../form/form';
 import { DbxFormlyContext, DbxFormlyContextDelegate, DbxFormlyInitialize } from './formly.context';
+import { BooleanStringKeyArray } from '@dereekb/util';
 import * as i0 from "@angular/core";
+export interface DbxFormlyFormState {
+    changesSinceLastResetCount: number;
+    isFormValid: boolean;
+    isFormDisabled: boolean;
+}
 /**
  * Used for rending a form from a DbxFormlyContext.
  */
@@ -13,8 +19,10 @@ export declare class DbxFormlyFormComponent<T extends object> extends AbstractSu
     private readonly context;
     private _fields;
     private _events;
+    private _disabled;
     private _reset;
     private _forceUpdate;
+    private _disabledSub;
     form: FormGroup;
     model: any;
     options: FormlyFormOptions;
@@ -27,8 +35,10 @@ export declare class DbxFormlyFormComponent<T extends object> extends AbstractSu
     getValue(): Observable<T>;
     setValue(value: T): void;
     resetForm(): void;
-    get disabled(): boolean;
-    setDisabled(disabled?: boolean): void;
+    get isDisabled(): boolean;
+    get disabled(): BooleanStringKeyArray;
+    getDisabled(): Observable<BooleanStringKeyArray>;
+    setDisabled(key?: DbxFormDisabledKey, disabled?: boolean): void;
     forceFormUpdate(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxFormlyFormComponent<any>, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<DbxFormlyFormComponent<any>, "dbx-formly", ["formly"], {}, {}, never, never>;

package/package.json

@@ -1,23 +1,24 @@
 {
   "name": "@dereekb/dbx-form",
-  "version": "1.2.0",
+  "version": "2.0.0",
   "peerDependencies": {
     "@angular/common": "^13.1.0",
     "@angular/core": "^13.1.0",
-    "@dereekb/dbx-core": "1.2.0",
+    "@dereekb/dbx-core": "2.0.0",
     "@ngrx/component-store": "^13.0.2",
     "@ngrx/data": "^13.0.2",
     "@ngrx/effects": "^13.0.2",
     "@ngrx/entity": "^13.0.2",
     "@ngrx/store": "^13.0.2",
     "rxjs": "^7.5.2",
-    "@dereekb/util": "1.2.0",
+    "@dereekb/util": "2.0.0",
     "extra-set": "^2.2.11",
-    "@dereekb/rxjs": "1.2.0",
+    "make-error": "^1.3.0",
+    "@dereekb/rxjs": "2.0.0",
     "ms": "^3.0.0-canary.1",
     "@angular/platform-browser": "^13.0.0",
     "date-fns": "^2.28.0",
-    "@dereekb/date": "1.2.0",
+    "@dereekb/date": "2.0.0",
     "class-transformer": "^0.5.1",
     "class-validator": "^0.13.2",
     "date-fns-tz": "^1.2.2",
@@ -26,7 +27,7 @@
     "@uirouter/core": "^6.0.8",
     "@uirouter/angular": "^9.1.0",
     "@angular/material": "^13.0.0",
-    "@dereekb/dbx-web": "1.2.0",
+    "@dereekb/dbx-web": "2.0.0",
     "mat-progress-buttons": "git+https://git@github.com/dereekb/mat-progress-buttons.git#60b0374a45644e8756f20b8d761738151ca3df64",
     "@angular/flex-layout": "^13.0.0-beta.38",
     "ng-overlay-container": "^13.0.0",