@coolon/angular-ui-powerups 12.4.0-alpha.28 → 12.4.0-alpha.29

package/lib/components/exports.d.ts

@@ -38,6 +38,7 @@ export * from "./forms/select-input/select-input.component";
 export * from "./forms/string-input/string-input.component";
 export * from "./forms/text-input/text-input.component";
 export * from "./icon/icon.component";
+export * from "./labelled-value/labelled-value.component";
 export * from "./noop/noop.component";
 export * from "./scroll-container/scroll-container.component";
 export * from "./section-header/section-header.component";

package/lib/components/labelled-value/labelled-value.component.d.ts

@@ -0,0 +1,7 @@
+import { OnInit } from '@angular/core';
+import { DisposableComponent } from '../disposable-component';
+export declare class LabelledValueComponent extends DisposableComponent implements OnInit {
+    label: string;
+    constructor();
+    ngOnInit(): void;
+}

package/lib/interaction/components/activity-actions/activity-actions.component.d.ts

@@ -1,5 +1,6 @@
 import { ChangeDetectorRef, OnInit } from '@angular/core';
 import { Command } from '@coolon/pectin';
+import { Enum } from 'typescript-string-enums';
 import { CommandFace } from '../../../components/commands/command-face';
 import { DisposableComponent } from '../../../components/disposable-component';
 /**
@@ -40,9 +41,8 @@ export declare class ActivityActionsComponent extends DisposableComponent implem
      * @deprecated use #faces instead.
      */
     set style(style: ActivityActionsComponent.Style);
-    align: 'start' | 'end' | 'stretch';
-    get alignEnd(): boolean;
-    get alignStretch(): boolean;
+    layout: ActivityActionsComponent.Layout;
+    align: ActivityActionsComponent.Align;
     constructor(cdr: ChangeDetectorRef);
     ngOnInit(): void;
     hasConfirmFace(): boolean;
@@ -53,6 +53,17 @@ export declare class ActivityActionsComponent extends DisposableComponent implem
     }): void;
 }
 export declare namespace ActivityActionsComponent {
+    const Layout: {
+        INLINE: "inline";
+        BLOCK: "block";
+    };
+    type Layout = Enum<typeof Layout>;
+    const Align: {
+        START: "start";
+        END: "end";
+        STRETCH: "stretch";
+    };
+    type Align = Enum<typeof Align>;
     interface Style {
         confirm: CommandFace;
         cancel: CommandFace;

package/lib/interaction/components/editors/edit-context.d.ts

@@ -0,0 +1,3 @@
+export interface EditContext<T> {
+    injectError(error: string): any;
+}

package/lib/interaction/components/editors/inline-string-editor/inline-editor-model.d.ts

@@ -0,0 +1,18 @@
+import { ListModel, MutableValueModel, Validator, ValueModel } from '@coolon/pectin';
+import { EditContext } from '../edit-context';
+export declare class InlineEditorModel<T> {
+    readonly valueModel: ValueModel<T>;
+    readonly saveCallback: InlineEditorModel.SaveCallback<T>;
+    readonly editing: MutableValueModel<boolean>;
+    private readonly _validators;
+    constructor(valueModel: ValueModel<T>, saveCallback: InlineEditorModel.SaveCallback<T>);
+    get validators(): ListModel<Validator<T>>;
+    validateUsing(validator: Validator<T>): this;
+    isEditing(): boolean;
+}
+export declare namespace InlineEditorModel {
+    type SaveCallback<T> = (value: T, context: EditContext<T>) => void | Promise<void>;
+    function create<T>(valueModel: ValueModel<T>, options: {
+        save: SaveCallback<T>;
+    }): InlineEditorModel<T>;
+}

package/lib/interaction/components/editors/inline-string-editor/inline-string-editor.component.d.ts

@@ -0,0 +1,56 @@
+import { OnInit } from '@angular/core';
+import { BooleanValueModelChain, Command, ValueModel, ValueModelChain } from '@coolon/pectin';
+import { CommandFace } from '../../../../components/commands/command-face';
+import { DisposableComponent } from '../../../../components/disposable-component';
+import { InteractionService } from '../../../services/interaction.service';
+import { InPlaceInteractionContextComponent } from '../../inplace-interaction-context/in-place-interaction-context.component';
+import { InlineEditorModel } from './inline-editor-model';
+/**
+ * @example
+ * const source: ValueModel<string> = ...;
+ * const model = InlineEditorModel.create(source, {
+ *   save(updated:string, context: InlineEditorModel.SaveContext) => {
+ *      try {
+ *        try and save the thing...
+ *      } catch(error) {
+ *        context.injectError(error)
+ *      }
+ * }).validateUsing(Validator.present("We'll need a value");
+ *
+ * # in the view
+ * <aup-inline-string-editor
+ *       label="My field"
+ *       placeHolder="I'm ready for a string..."
+ *       [editorModel]="model"></aup-inline-string-editor>
+ */
+export declare class InlineStringEditorComponent extends DisposableComponent implements OnInit {
+    editorModel: InlineEditorModel<string>;
+    facesModel: ValueModel<InlineStringEditorComponent.Faces>;
+    faces: InlineStringEditorComponent.Faces;
+    interactionContext: InPlaceInteractionContextComponent<any, any, any>;
+    label: string;
+    placeHolder: string;
+    placeHolderModel: ValueModel<string>;
+    readonly description: ValueModelChain<string>;
+    empty: BooleanValueModelChain;
+    readonly editCommand: Command<void>;
+    displayValue: ValueModelChain<string>;
+    readonly editFaceModel: ValueModelChain<CommandFace>;
+    readonly saveFace: ValueModelChain<CommandFace>;
+    readonly cancelFace: ValueModelChain<CommandFace>;
+    constructor(interactionService: InteractionService);
+    ngOnInit(): void;
+    private createInputActivityData;
+    cancelEdit(): void;
+    startEdit(): void;
+    private isEditing;
+    isEmpty(): boolean;
+}
+export declare namespace InlineStringEditorComponent {
+    interface Faces {
+        edit?: CommandFace;
+        save?: CommandFace;
+        cancel?: CommandFace;
+    }
+    const DEFAULT_FACES: Faces;
+}

package/lib/interaction/components/input-activities/input-activity.d.ts

@@ -0,0 +1,33 @@
+import { Command, Form, Validator } from '@coolon/pectin';
+import { Enum } from 'typescript-string-enums';
+import { Activity } from '../../activity';
+import { ActivityActionsComponent } from '../activity-actions/activity-actions.component';
+export declare class InputActivity<T, D extends InputActivity.Data<T> = InputActivity.Data<T>> extends Activity<D, T> {
+    readonly data: D;
+    readonly confirmCommand: Command<void>;
+    readonly cancelCommand: Command<void>;
+    readonly valueModel: Form.ValueModelBase<T>;
+    class: string;
+    get layout(): InputActivity.Layout;
+    constructor(data: D);
+    onActivityReady(): void;
+}
+export declare namespace InputActivity {
+    const Layout: {
+        INLINE: "inline";
+        BLOCK: "block";
+    };
+    type Layout = Enum<typeof Layout>;
+    interface Context {
+        injectError(error: string): any;
+    }
+    interface Data<T> {
+        initialValue: T;
+        label?: string;
+        placeholder?: string;
+        layout?: InputActivity.Layout;
+        buttonStyle?: ActivityActionsComponent.Style;
+        validators?: Validator<T>[];
+        save?(valueModel: T, interactionContext?: Context): void | Promise<void>;
+    }
+}

package/lib/interaction/components/input-activities/select-input-activity.d.ts

@@ -1,7 +1,15 @@
-import { AbstractInputActivity } from './abstract-input-activity';
-import { SelectInputActivityData } from './select-input-activity-data';
-export declare class SelectInputActivity<T> extends AbstractInputActivity<T, SelectInputActivityData<T>> {
+import { ListModel } from '@coolon/pectin';
+import { InputActivity } from './input-activity';
+export declare class SelectInputActivity<T> extends InputActivity<T, SelectInputActivity.Data<T>> {
     readonly defaultOptionLabelFormat: (option: T) => T | T[keyof T];
     get optionLabelFormat(): (option: T) => any;
     get options(): T[];
 }
+export declare namespace SelectInputActivity {
+    interface Data<T> extends InputActivity.Data<T> {
+        options?: T[];
+        optionsModel?: ListModel<T>;
+        optionLabel?: keyof T;
+        optionLabelFormat?: (option: T) => any;
+    }
+}

package/lib/interaction/components/input-activities/string-input-activity.d.ts

@@ -1,3 +1,3 @@
-import { AbstractInputActivity } from './abstract-input-activity';
-export declare class StringInputActivity extends AbstractInputActivity<string> {
+import { InputActivity } from './input-activity';
+export declare class StringInputActivity extends InputActivity<string> {
 }

package/lib/interaction/exports.d.ts

@@ -24,10 +24,11 @@ export * from "./components/add-item-interaction-context/add-item-interaction-co
 export * from "./components/alert-dialog/alert-dialog.component";
 export * from "./components/confirm-then-dialog/confirm-then-dialog.component";
 export * from "./components/confirmation-dialog/confirmation-dialog.component";
+export * from "./components/editors/edit-context";
+export * from "./components/editors/inline-string-editor/inline-editor-model";
+export * from "./components/editors/inline-string-editor/inline-string-editor.component";
 export * from "./components/inplace-interaction-context/in-place-interaction-context.component";
-export * from "./components/input-activities/abstract-input-activity";
-export * from "./components/input-activities/input-activity-data";
-export * from "./components/input-activities/select-input-activity-data";
+export * from "./components/input-activities/input-activity";
 export * from "./components/input-activities/select-input-activity";
 export * from "./components/input-activities/string-input-activity";
 export * from "./components/popup-interaction-context/popup-interaction-context.component";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coolon/angular-ui-powerups",
-  "version": "12.4.0-alpha.28",
+  "version": "12.4.0-alpha.29",
   "schematics": "./schematics/collection.json",
   "dependencies": {
     "@coolon/typescript-utilities": "^2.2.0",

package/esm2015/lib/interaction/components/input-activities/abstract-input-activity.js

@@ -1,43 +0,0 @@
-import { Component, HostBinding, Inject } from '@angular/core';
-import { Command, DirtyTrackingForm } from '@coolon/pectin';
-import { Activity, ACTIVITY_DATA } from '../../activity';
-// @see https://github.com/ng-packagr/ng-packagr/issues/641 and  https://github.com/angular/angular/issues/21123
-// we're getting a metadata error for D for no reason that I can find and only during the build (ng serve works fine)
-// @dynamic
-export class AbstractInputActivity extends Activity {
-    constructor(data) {
-        super();
-        this.data = data;
-        this.class = 'aup-input-activity';
-        const form = new DirtyTrackingForm();
-        this.valueModel = form.valueModel(this.data.initialValue);
-        this.valueModel.validateUsing(data.validators || []);
-        this.confirmCommand = Command.create(() => {
-            if (this.valueModel.validate()) {
-                if (data.save) {
-                    return Promise.resolve(data.save(this.valueModel, this.interactionContext))
-                        .then(() => this.done());
-                }
-                else {
-                    this.done(this.valueModel.value);
-                }
-            }
-        });
-        this.cancelCommand = Command.create(() => {
-            this.cancel();
-        });
-    }
-    onActivityReady() {
-        this.valueModel.focusContext.requestFocus();
-    }
-}
-AbstractInputActivity.decorators = [
-    { type: Component, args: [{ template: `` },] }
-];
-AbstractInputActivity.ctorParameters = () => [
-    { type: undefined, decorators: [{ type: Inject, args: [ACTIVITY_DATA,] }] }
-];
-AbstractInputActivity.propDecorators = {
-    class: [{ type: HostBinding, args: ['class',] }]
-};
-//# sourceMappingURL=abstract-input-activity.js.map

package/esm2015/lib/interaction/components/input-activities/abstract-input-activity.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"abstract-input-activity.js","sourceRoot":"","sources":["../../../../../../../../libs/angular-ui-powerups/src/lib/interaction/components/input-activities/abstract-input-activity.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAC/D,OAAO,EAAE,OAAO,EAAE,iBAAiB,EAAQ,MAAM,gBAAgB,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAGzD,gHAAgH;AAChH,qHAAqH;AACrH,WAAW;AAEX,MAAM,OAAO,qBAAgF,SAAQ,QAAc;IAQjH,YAA4C,IAAO;QACjD,KAAK,EAAE,CAAC;QADkC,SAAI,GAAJ,IAAI,CAAG;QAF7B,UAAK,GAAG,oBAAoB,CAAC;QAKjD,MAAM,IAAI,GAAG,IAAI,iBAAiB,EAAE,CAAC;QACrC,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,CAAI,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QAC7D,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,IAAI,CAAC,UAAU,IAAI,EAAE,CAAC,CAAC;QAErD,IAAI,CAAC,cAAc,GAAG,OAAO,CAAC,MAAM,CAAC,GAAG,EAAE;YACxC,IAAI,IAAI,CAAC,UAAU,CAAC,QAAQ,EAAE,EAAE;gBAC9B,IAAI,IAAI,CAAC,IAAI,EAAE;oBACb,OAAO,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;yBACxE,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;iBAC5B;qBAAM;oBACL,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;iBAClC;aACF;QACH,CAAC,CAAC,CAAC;QACH,IAAI,CAAC,aAAa,GAAG,OAAO,CAAC,MAAM,CAAC,GAAG,EAAE;YACvC,IAAI,CAAC,MAAM,EAAE,CAAC;QAChB,CAAC,CAAC,CAAC;IACL,CAAC;IAED,eAAe;QACb,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,YAAY,EAAE,CAAC;IAC9C,CAAC;;;YAjCF,SAAS,SAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;;;4CASZ,MAAM,SAAC,aAAa;;;oBAFhC,WAAW,SAAC,OAAO","sourcesContent":["import { Component, HostBinding, Inject } from '@angular/core';\nimport { Command, DirtyTrackingForm, Form } from '@coolon/pectin';\nimport { Activity, ACTIVITY_DATA } from '../../activity';\nimport { InputActivityData } from './input-activity-data';\n\n// @see https://github.com/ng-packagr/ng-packagr/issues/641 and  https://github.com/angular/angular/issues/21123\n// we're getting a metadata error for D for no reason that I can find and only during the build (ng serve works fine)\n// @dynamic\n@Component({ template: `` })\nexport class AbstractInputActivity<T, D extends InputActivityData<T> = InputActivityData<T>> extends Activity<D, T> {\n\n  readonly confirmCommand: Command<void>;\n  readonly cancelCommand: Command<void>;\n  readonly valueModel:  Form.ValueModelBase<T>;\n\n  @HostBinding('class') class = 'aup-input-activity';\n\n  constructor(@Inject(ACTIVITY_DATA) readonly data: D) {\n    super();\n\n    const form = new DirtyTrackingForm();\n    this.valueModel = form.valueModel<T>(this.data.initialValue);\n    this.valueModel.validateUsing(data.validators || []);\n\n    this.confirmCommand = Command.create(() => {\n      if (this.valueModel.validate()) {\n        if (data.save) {\n          return Promise.resolve(data.save(this.valueModel, this.interactionContext))\n            .then(() => this.done());\n        } else {\n          this.done(this.valueModel.value);\n        }\n      }\n    });\n    this.cancelCommand = Command.create(() => {\n      this.cancel();\n    });\n  }\n\n  onActivityReady() {\n    this.valueModel.focusContext.requestFocus();\n  }\n\n}\n"]}

package/esm2015/lib/interaction/components/input-activities/abstract-input-activity.metadata.json

@@ -1 +0,0 @@
-[{"__symbolic":"module","version":4,"metadata":{"AbstractInputActivity":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../../activity","name":"Activity","line":9,"character":101},"arity":2,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":8,"character":1},"arguments":[{"template":""}]}],"members":{"class":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":15,"character":3},"arguments":["class"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":17,"character":15},"arguments":[{"__symbolic":"reference","module":"../../activity","name":"ACTIVITY_DATA","line":17,"character":22}]}]],"parameters":[{"__symbolic":"error","message":"Could not resolve type","line":17,"character":52,"context":{"typeName":"D"}}]}],"onActivityReady":[{"__symbolic":"method"}]}}}}]

package/esm2015/lib/interaction/components/input-activities/abstract-input-activity.ngfactory.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"abstract-input-activity.ngfactory.js","sourceRoot":"","sources":["../../../../../../../../libs/angular-ui-powerups/src/lib/interaction/components/input-activities/abstract-input-activity.ngfactory.ts"],"names":[],"mappings":"","sourcesContent":["import * as i0 from '@angular/core';\ni0.ComponentFactory;\n"]}

package/esm2015/lib/interaction/components/input-activities/input-activity-data.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=input-activity-data.js.map

package/esm2015/lib/interaction/components/input-activities/input-activity-data.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"input-activity-data.js","sourceRoot":"","sources":["../../../../../../../../libs/angular-ui-powerups/src/lib/interaction/components/input-activities/input-activity-data.ts"],"names":[],"mappings":"","sourcesContent":["import { Form, Validator } from '@coolon/pectin';\nimport { InteractionContext } from '../../interaction-context';\nimport { ActivityActionsComponent } from '../activity-actions/activity-actions.component';\n\nexport interface InputActivityData<T> {\n  initialValue: T;\n  buttonStyle: ActivityActionsComponent.Style\n  label?: string;\n  placeholder?: string;\n  validators?: Validator<T>[],\n\n  save?(valueModel:  Form.ValueModelBase<T>, interactionContext?: InteractionContext): void | Promise<unknown>\n}\n"]}

package/esm2015/lib/interaction/components/input-activities/input-activity-data.metadata.json

@@ -1 +0,0 @@
-[{"__symbolic":"module","version":4,"metadata":{"InputActivityData":{"__symbolic":"interface"}}}]

package/esm2015/lib/interaction/components/input-activities/select-input-activity-data.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=select-input-activity-data.js.map

package/esm2015/lib/interaction/components/input-activities/select-input-activity-data.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"select-input-activity-data.js","sourceRoot":"","sources":["../../../../../../../../libs/angular-ui-powerups/src/lib/interaction/components/input-activities/select-input-activity-data.ts"],"names":[],"mappings":"","sourcesContent":["import { ListModel } from '@coolon/pectin';\nimport { InputActivityData } from './input-activity-data';\n\nexport interface SelectInputActivityData<T> extends InputActivityData<T> {\n  options?: T[];\n  optionsModel?: ListModel<T>;\n  optionLabel?: keyof T;\n  optionLabelFormat?: (option: T) => any;\n}\n"]}

package/esm2015/lib/interaction/components/input-activities/select-input-activity-data.metadata.json

@@ -1 +0,0 @@
-[{"__symbolic":"module","version":4,"metadata":{"SelectInputActivityData":{"__symbolic":"interface"}}}]

package/lib/interaction/components/input-activities/abstract-input-activity.d.ts

@@ -1,12 +0,0 @@
-import { Command, Form } from '@coolon/pectin';
-import { Activity } from '../../activity';
-import { InputActivityData } from './input-activity-data';
-export declare class AbstractInputActivity<T, D extends InputActivityData<T> = InputActivityData<T>> extends Activity<D, T> {
-    readonly data: D;
-    readonly confirmCommand: Command<void>;
-    readonly cancelCommand: Command<void>;
-    readonly valueModel: Form.ValueModelBase<T>;
-    class: string;
-    constructor(data: D);
-    onActivityReady(): void;
-}

package/lib/interaction/components/input-activities/input-activity-data.d.ts

@@ -1,11 +0,0 @@
-import { Form, Validator } from '@coolon/pectin';
-import { InteractionContext } from '../../interaction-context';
-import { ActivityActionsComponent } from '../activity-actions/activity-actions.component';
-export interface InputActivityData<T> {
-    initialValue: T;
-    buttonStyle: ActivityActionsComponent.Style;
-    label?: string;
-    placeholder?: string;
-    validators?: Validator<T>[];
-    save?(valueModel: Form.ValueModelBase<T>, interactionContext?: InteractionContext): void | Promise<unknown>;
-}

package/lib/interaction/components/input-activities/select-input-activity-data.d.ts

@@ -1,8 +0,0 @@
-import { ListModel } from '@coolon/pectin';
-import { InputActivityData } from './input-activity-data';
-export interface SelectInputActivityData<T> extends InputActivityData<T> {
-    options?: T[];
-    optionsModel?: ListModel<T>;
-    optionLabel?: keyof T;
-    optionLabelFormat?: (option: T) => any;
-}