@coolon/angular-ui-powerups 12.4.0-alpha.40 → 12.4.0-alpha.42
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/{activities.scss → activities/activities.scss} +15 -11
- package/assets/activities/input-activities.scss +20 -0
- package/assets/interaction.scss +3 -4
- package/assets/mixins.scss +5 -7
- package/assets/styles.scss +5 -5
- package/bundles/coolon-angular-ui-powerups.umd.js +42 -14
- package/bundles/coolon-angular-ui-powerups.umd.js.map +1 -1
- package/coolon-angular-ui-powerups.metadata.json +1 -1
- package/esm2015/lib/components/cards/card-container/card-container.component.js +8 -2
- package/esm2015/lib/components/cards/card-container/card-container.component.js.map +1 -1
- package/esm2015/lib/components/cards/card-container/card-container.component.metadata.json +1 -1
- package/esm2015/lib/components/cards/card-stack/card-stack.component.js +1 -1
- package/esm2015/lib/components/cards/card-stack/card-stack.component.metadata.json +1 -1
- package/esm2015/lib/components/components.module.ngfactory.js.map +1 -1
- package/esm2015/lib/interaction/components/activity-container/activity-container.component.js +1 -1
- package/esm2015/lib/interaction/components/activity-container/activity-container.component.js.map +1 -1
- package/esm2015/lib/interaction/components/activity-container/activity-container.component.metadata.json +1 -1
- package/esm2015/lib/interaction/components/activity-triggers/abstract-activity-trigger.component.js.map +1 -1
- package/esm2015/lib/interaction/components/activity-triggers/abstract-activity-trigger.component.metadata.json +1 -1
- package/esm2015/lib/interaction/components/add-card-activity/add-card-activity.component.js +1 -1
- package/esm2015/lib/interaction/components/add-card-activity/add-card-activity.component.metadata.json +1 -1
- package/esm2015/lib/interaction/components/editors/inline-string-editor/inline-string-editor.component.js +2 -1
- package/esm2015/lib/interaction/components/editors/inline-string-editor/inline-string-editor.component.js.map +1 -1
- package/esm2015/lib/interaction/components/input-activities/input-activity.js +21 -2
- package/esm2015/lib/interaction/components/input-activities/input-activity.js.map +1 -1
- package/esm2015/lib/interaction/components/input-activities/input-activity.metadata.json +1 -1
- package/esm2015/lib/interaction/components/input-activities/select-input-activity.js +3 -1
- package/esm2015/lib/interaction/components/input-activities/select-input-activity.js.map +1 -1
- package/esm2015/lib/interaction/components/input-activities/select-input-activity.metadata.json +1 -1
- package/esm2015/lib/interaction/components/input-activities/string-input-activity.js +4 -1
- package/esm2015/lib/interaction/components/input-activities/string-input-activity.js.map +1 -1
- package/esm2015/lib/interaction/components/input-activities/string-input-activity.metadata.json +1 -1
- package/esm2015/lib/interaction/components/popup-interaction-context/popup-interaction-context.component.js +1 -0
- package/esm2015/lib/interaction/components/popup-interaction-context/popup-interaction-context.component.js.map +1 -1
- package/esm2015/lib/interaction/interaction.module.js +2 -0
- package/esm2015/lib/interaction/interaction.module.js.map +1 -1
- package/esm2015/lib/interaction/interaction.module.metadata.json +1 -1
- package/esm2015/lib/interaction/interaction.module.ngfactory.js.map +1 -1
- package/fesm2015/coolon-angular-ui-powerups.js +42 -9
- package/fesm2015/coolon-angular-ui-powerups.js.map +1 -1
- package/lib/components/cards/card-container/card-container.component.d.ts +5 -0
- package/lib/interaction/components/input-activities/input-activity.d.ts +8 -2
- package/lib/interaction/components/input-activities/string-input-activity.d.ts +4 -0
- package/package.json +1 -1
- package/assets/interaction/input-activity.scss +0 -12
|
@@ -68,6 +68,11 @@ export class CardContainerComponent extends AbstractCardContainerComponent {
|
|
|
68
68
|
constructor(elementRef) {
|
|
69
69
|
super();
|
|
70
70
|
this.elementRef = elementRef;
|
|
71
|
+
/**
|
|
72
|
+
* Enable scrolling. If true the container will have height==0 so you must set it's height explicitly
|
|
73
|
+
* or place in a layout that will stretch it such as a grid or flex layout.
|
|
74
|
+
*/
|
|
75
|
+
this.enabledScroll = false;
|
|
71
76
|
}
|
|
72
77
|
set columnCount(count) {
|
|
73
78
|
if (!_.isNil(count) && (!_.isInteger(count) || count < 1)) {
|
|
@@ -102,8 +107,8 @@ export class CardContainerComponent extends AbstractCardContainerComponent {
|
|
|
102
107
|
CardContainerComponent.decorators = [
|
|
103
108
|
{ type: Component, args: [{
|
|
104
109
|
selector: 'aup-card-container',
|
|
105
|
-
template: "<div class=\"header-container\">\n <ng-content select=\"[card-container-header]\"></ng-content>\n</div>\n<
|
|
106
|
-
styles: [":host{--resolved-card-gap:var(--card-gap,16px);--resolved-card-width:var(--card-width,300px);--resolved-card-width-max:var(--card-width-max,auto);--resolved-card-height:var(--card-height,auto);--resolved-card-min-height:var(--card-min-height,auto);--resolved-card-background:var(--card-background,var(--aup-card-container-default-background-color));flex:1;display:flex;flex-direction:column;align-items:stretch;background:var(--resolved-card-background)}:host.auto-columns .card-container{grid-template-columns:repeat(auto-fit,minmax(var(--resolved-card-width),auto));min-width:calc(var(--resolved-card-width) + 2 * var(--resolved-card-gap));width:calc((var(--resolved-card-width) + var(--resolved-card-gap)) * 2 + var(--grid-gap))}:host:not(.auto-columns) .card-container{grid-template-columns:repeat(var(--aup-card-container-column-count),1fr)}.card-container{display:grid;box-sizing:border-box;padding:var(--resolved-card-gap);min-height:calc(var(--resolved-card-height) + 2 * var(--resolved-card-gap));max-width:100%;grid-auto-rows:minmax(var(--resolved-card-min-height),var(--resolved-card-height));grid-gap:var(--resolved-card-gap)}aup-scroll-container{flex:1}.add-card-container{width:var(--resolved-card-width);height:var(--resolved-card-height);min-height:var(--resolved-card-min-height);display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;border:2px dashed rgba(0,0,0,.1);border-radius:6px;font-weight:300;cursor:pointer;color:rgba(0,0,0,.54);background-color:hsla(0,0%,100%,.8)
|
|
110
|
+
template: "<div class=\"header-container\">\n <ng-content select=\"[card-container-header]\"></ng-content>\n</div>\n\n<ng-template #content>\n <div class=\"card-container\">\n <ng-content></ng-content>\n\n <div class=\"add-card-container\" *ngIf=\"addCardCommand.enabled.value\" [pectinCommand]=\"addCardCommand\">\n <aup-command-face *ngIf=\"addCardFace\" [faces]=\"[addCardFace]\"></aup-command-face>\n <aup-icon *ngIf=\"!addCardFace\" icon=\"mat:add\"></aup-icon>\n </div>\n\n <div class=\"add-card-template\" *ngIf=\"addCardTemplate\">\n <ng-container [ngTemplateOutlet]=\"addCardTemplate\"></ng-container>\n </div>\n </div>\n</ng-template>\n\n<div class=\"no-scroll-container\" *ngIf=\"!enabledScroll\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</div>\n\n<aup-scroll-container *ngIf=\"enabledScroll\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</aup-scroll-container>\n\n<div class=\"footer-container\">\n <ng-content select=\"[card-container-footer]\"></ng-content>\n</div>\n\n",
|
|
111
|
+
styles: [":host{--resolved-card-gap:var(--card-gap,16px);--resolved-card-width:var(--card-width,300px);--resolved-card-width-max:var(--card-width-max,auto);--resolved-card-height:var(--card-height,auto);--resolved-card-min-height:var(--card-min-height,auto);--resolved-card-background:var(--card-background,var(--aup-card-container-default-background-color));flex:1;display:flex;flex-direction:column;align-items:stretch;background:var(--resolved-card-background)}:host.auto-columns .card-container{grid-template-columns:repeat(auto-fit,minmax(var(--resolved-card-width),auto));min-width:calc(var(--resolved-card-width) + 2 * var(--resolved-card-gap));width:calc((var(--resolved-card-width) + var(--resolved-card-gap)) * 2 + var(--grid-gap))}:host:not(.auto-columns) .card-container{grid-template-columns:repeat(var(--aup-card-container-column-count),1fr)}.card-container{display:grid;box-sizing:border-box;padding:var(--resolved-card-gap);min-height:calc(var(--resolved-card-height) + 2 * var(--resolved-card-gap));max-width:100%;grid-auto-rows:minmax(var(--resolved-card-min-height),var(--resolved-card-height));grid-gap:var(--resolved-card-gap)}.no-scroll-container,aup-scroll-container{flex:1}.add-card-container{width:var(--resolved-card-width);height:var(--resolved-card-height);min-height:var(--resolved-card-min-height);display:flex;flex-direction:column;align-items:center;justify-content:center;transition:box-shadow .28s cubic-bezier(.4,0,.2,1);box-sizing:border-box;border:2px dashed rgba(0,0,0,.1);border-radius:6px;font-weight:300;cursor:pointer;color:rgba(0,0,0,.54);background-color:hsla(0,0%,100%,.8)}.add-card-container mat-icon{font-size:200%}.add-card-container:hover{box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12);border-color:transparent;background-color:#fff;color:rgba(0,0,0,.54)}.add-card-template-container{width:var(--resolved-card-width);height:var(--resolved-card-height);display:flex;flex-direction:column;align-items:stretch;justify-content:stretch}"]
|
|
107
112
|
},] }
|
|
108
113
|
];
|
|
109
114
|
CardContainerComponent.ctorParameters = () => [
|
|
@@ -111,6 +116,7 @@ CardContainerComponent.ctorParameters = () => [
|
|
|
111
116
|
];
|
|
112
117
|
CardContainerComponent.propDecorators = {
|
|
113
118
|
columnCount: [{ type: Input }],
|
|
119
|
+
enabledScroll: [{ type: Input }],
|
|
114
120
|
isAutoColumns: [{ type: HostBinding, args: ['class.auto-columns',] }],
|
|
115
121
|
isSingleColumn: [{ type: HostBinding, args: ['class.single-column',] }]
|
|
116
122
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card-container.component.js","sourceRoot":"","sources":["../../../../../../../../libs/angular-ui-powerups/src/lib/components/cards/card-container/card-container.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,WAAW,EAAE,KAAK,EAAU,MAAM,eAAe,CAAC;AAClF,OAAO,EAAE,IAAI,EAAE,MAAM,8BAA8B,CAAC;AACpD,OAAO,KAAK,CAAC,MAAM,QAAQ,CAAC;AAC5B,OAAO,EAAE,8BAA8B,EAAE,MAAM,sCAAsC,CAAC;AAGtF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6DG;AAMH,MAAM,OAAO,sBAAuB,SAAQ,8BAA8B;
|
|
1
|
+
{"version":3,"file":"card-container.component.js","sourceRoot":"","sources":["../../../../../../../../libs/angular-ui-powerups/src/lib/components/cards/card-container/card-container.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,WAAW,EAAE,KAAK,EAAU,MAAM,eAAe,CAAC;AAClF,OAAO,EAAE,IAAI,EAAE,MAAM,8BAA8B,CAAC;AACpD,OAAO,KAAK,CAAC,MAAM,QAAQ,CAAC;AAC5B,OAAO,EAAE,8BAA8B,EAAE,MAAM,sCAAsC,CAAC;AAGtF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6DG;AAMH,MAAM,OAAO,sBAAuB,SAAQ,8BAA8B;IAwBxE,YAA6B,UAAsB;QACjD,KAAK,EAAE,CAAC;QADmB,eAAU,GAAV,UAAU,CAAY;QAPnD;;;WAGG;QAEH,kBAAa,GAAG,KAAK,CAAC;IAItB,CAAC;IAtBD,IACI,WAAW,CAAC,KAAyB;QACvC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,KAAK,GAAG,CAAC,CAAC,EAAE;YACzD,IAAI,CAAC,YAAY,CAAC,+CAA+C,CAAC,CAAC;SACpE;QACD,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;QAC1B,IAAI,CAAC,uBAAuB,EAAE,CAAC;IACjC,CAAC;IAED,IAAI,WAAW;QACb,OAAO,IAAI,CAAC,YAAY,CAAC;IAC3B,CAAC;IAaD,QAAQ;QACN,KAAK,CAAC,QAAQ,EAAE,CAAC;QACjB,IAAI,CAAC,uBAAuB,EAAE,CAAC;IACjC,CAAC;IAED,IACI,aAAa;QACf,OAAO,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;IACpC,CAAC;IAED,IACI,cAAc;QAChB,OAAO,IAAI,CAAC,YAAY,KAAK,CAAC,CAAC;IACjC,CAAC;IAES,uBAAuB;QAC/B,MAAM,EAAE,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC;QACzC,IAAI,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,EAAE;YAC9B,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,mCAAmC,EAAE,EAAE,CAAC,CAAC;SAC/D;aAAM;YACL,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,mCAAmC,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;SAC9E;IACH,CAAC;;;YAvDF,SAAS,SAAC;gBACT,QAAQ,EAAE,oBAAoB;gBAC9B,2iCAA8C;;aAE/C;;;YAxEmB,UAAU;;;0BA6E3B,KAAK;4BAiBL,KAAK;4BAYL,WAAW,SAAC,oBAAoB;6BAKhC,WAAW,SAAC,qBAAqB","sourcesContent":["import { Component, ElementRef, HostBinding, Input, OnInit } from '@angular/core';\nimport { lang } from '@coolon/typescript-utilities';\nimport * as _ from 'lodash';\nimport { AbstractCardContainerComponent } from '../abstract-card-container.component';\n\n\n/**\n * @example\n * // basic usage\n * <aup-card-container>\n * <my-card *ngFor=\"...\"></my-card>\n * </aup-card-container>\n *\n * // adds an add button with a the '+' icon to the end of the card list.\n * <aup-card-container [addCardCommand]=\"addCard\">\n * <my-card *ngFor=\"...\"></my-card>\n * </aup-card-container>\n *\n * // adds an add button with the specified face\n * <aup-card-container [addCardCommand]=\"addCard\" [addCardFace]=\"i18n.addCard\" >\n * <my-card *ngFor=\"...\"></my-card>\n * </aup-card-container>\n *\n * // use the aup-add-card-activity to display as the new card place holder and to run\n * // the activity inside teh card\n * <aup-card-container [addCardCommand]=\"addCard\" [addCardFace]=\"i18n.addCard\" >\n * <my-card *ngFor=\"...\"></my-card>\n * <aup-add-card-activity type=\"inline\" renderAs=\"card\" [face]=\"i18n.commands.addModal\" [activityClass]=\"AddCardActivity\"></aup-add-card-activity>\n * </aup-card-container>\n *\n * // adds an add card component using the specified template. The template\n * // will fill it's container in the grid.\n * <aup-card-container>\n * <my-card *ngFor=\"...\"></my-card>\n * <ng-template #addCardTemplate>\n * <div>This is a new card template, it will the the size of the other cards.</div>\n * </ng-template>\n * </aup-card-container>\n *\n * // sing the default new card styles for your template\n * @import \"../../../../assets/styles\";\n * .my-new-card {\n * @include aup-card-container-new-card-style();\n * // OR\n * @include aup-card-container-new-card-style(\n * $color: rgba(0,0,0,0.54),\n * $background-color: rgba(255,255,255,0.8),\n * $hover-color: $color,\n * $background-hover-color: white\n * )\n * }\n * <aup-card-container>\n * <my-card *ngFor=\"...\"></my-card>\n * <ng-template #addCardTemplate>\n * <div class=\"my-new-card\" >This is a new card template, it will the the size of the other cards.</div>\n * </ng-template>\n * </aup-card-container>\n *\n * // CSS Vars\n * aup-card-container {\n * --card-gap: var(--card-gap, 16px);\n * --card-width: var(--card-width, 300px);\n * --card-width-max: auto;\n * --card-height: var(--card-height, auto);\n * --card-min-height: var(--card-min-height, auto);\n * --card-background: var(--card-background, #fcfcfb);\n * }\n */\n@Component({\n selector: 'aup-card-container',\n templateUrl: './card-container.component.html',\n styleUrls: ['./card-container.component.scss']\n})\nexport class CardContainerComponent extends AbstractCardContainerComponent implements OnInit {\n\n private _columnCount: number | undefined;\n\n @Input()\n set columnCount(count: number | undefined) {\n if (!_.isNil(count) && (!_.isInteger(count) || count < 1)) {\n lang.illegalState('columnCount must be a positive integer or nil');\n }\n this._columnCount = count;\n this.updateColumnCountStyles();\n }\n\n get columnCount() {\n return this._columnCount;\n }\n\n /**\n * Enable scrolling. If true the container will have height==0 so you must set it's height explicitly\n * or place in a layout that will stretch it such as a grid or flex layout.\n */\n @Input()\n enabledScroll = false;\n\n constructor(private readonly elementRef: ElementRef) {\n super();\n }\n\n ngOnInit() {\n super.ngOnInit();\n this.updateColumnCountStyles();\n }\n\n @HostBinding('class.auto-columns')\n get isAutoColumns() {\n return _.isNil(this._columnCount);\n }\n\n @HostBinding('class.single-column')\n get isSingleColumn() {\n return this._columnCount === 1;\n }\n\n protected updateColumnCountStyles() {\n const el = this.elementRef.nativeElement;\n if (_.isNil(this._columnCount)) {\n el.style.setProperty('--aup-card-container-column-count', '');\n } else {\n el.style.setProperty('--aup-card-container-column-count', this._columnCount);\n }\n }\n\n}\n\nexport namespace CardContainerComponent {\n export interface ColumnConfiguration {\n count: number;\n stretchToFill: boolean;\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
[{"__symbolic":"module","version":4,"metadata":{"CardContainerComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../abstract-card-container.component","name":"AbstractCardContainerComponent","line":73,"character":44},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":68,"character":1},"arguments":[{"selector":"aup-card-container","template":"<div class=\"header-container\">\n <ng-content select=\"[card-container-header]\"></ng-content>\n</div>\n<
|
|
1
|
+
[{"__symbolic":"module","version":4,"metadata":{"CardContainerComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../abstract-card-container.component","name":"AbstractCardContainerComponent","line":73,"character":44},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":68,"character":1},"arguments":[{"selector":"aup-card-container","template":"<div class=\"header-container\">\n <ng-content select=\"[card-container-header]\"></ng-content>\n</div>\n\n<ng-template #content>\n <div class=\"card-container\">\n <ng-content></ng-content>\n\n <div class=\"add-card-container\" *ngIf=\"addCardCommand.enabled.value\" [pectinCommand]=\"addCardCommand\">\n <aup-command-face *ngIf=\"addCardFace\" [faces]=\"[addCardFace]\"></aup-command-face>\n <aup-icon *ngIf=\"!addCardFace\" icon=\"mat:add\"></aup-icon>\n </div>\n\n <div class=\"add-card-template\" *ngIf=\"addCardTemplate\">\n <ng-container [ngTemplateOutlet]=\"addCardTemplate\"></ng-container>\n </div>\n </div>\n</ng-template>\n\n<div class=\"no-scroll-container\" *ngIf=\"!enabledScroll\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</div>\n\n<aup-scroll-container *ngIf=\"enabledScroll\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</aup-scroll-container>\n\n<div class=\"footer-container\">\n <ng-content select=\"[card-container-footer]\"></ng-content>\n</div>\n\n","styles":[":host{--resolved-card-gap:var(--card-gap,16px);--resolved-card-width:var(--card-width,300px);--resolved-card-width-max:var(--card-width-max,auto);--resolved-card-height:var(--card-height,auto);--resolved-card-min-height:var(--card-min-height,auto);--resolved-card-background:var(--card-background,var(--aup-card-container-default-background-color));flex:1;display:flex;flex-direction:column;align-items:stretch;background:var(--resolved-card-background)}:host.auto-columns .card-container{grid-template-columns:repeat(auto-fit,minmax(var(--resolved-card-width),auto));min-width:calc(var(--resolved-card-width) + 2 * var(--resolved-card-gap));width:calc((var(--resolved-card-width) + var(--resolved-card-gap)) * 2 + var(--grid-gap))}:host:not(.auto-columns) .card-container{grid-template-columns:repeat(var(--aup-card-container-column-count),1fr)}.card-container{display:grid;box-sizing:border-box;padding:var(--resolved-card-gap);min-height:calc(var(--resolved-card-height) + 2 * var(--resolved-card-gap));max-width:100%;grid-auto-rows:minmax(var(--resolved-card-min-height),var(--resolved-card-height));grid-gap:var(--resolved-card-gap)}.no-scroll-container,aup-scroll-container{flex:1}.add-card-container{width:var(--resolved-card-width);height:var(--resolved-card-height);min-height:var(--resolved-card-min-height);display:flex;flex-direction:column;align-items:center;justify-content:center;transition:box-shadow .28s cubic-bezier(.4,0,.2,1);box-sizing:border-box;border:2px dashed rgba(0,0,0,.1);border-radius:6px;font-weight:300;cursor:pointer;color:rgba(0,0,0,.54);background-color:hsla(0,0%,100%,.8)}.add-card-container mat-icon{font-size:200%}.add-card-container:hover{box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12);border-color:transparent;background-color:#fff;color:rgba(0,0,0,.54)}.add-card-template-container{width:var(--resolved-card-width);height:var(--resolved-card-height);display:flex;flex-direction:column;align-items:stretch;justify-content:stretch}"]}]}],"members":{"columnCount":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":77,"character":3}}]}],"enabledScroll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":94,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":97,"character":43}]}],"ngOnInit":[{"__symbolic":"method"}],"isAutoColumns":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":106,"character":3},"arguments":["class.auto-columns"]}]}],"isSingleColumn":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":111,"character":3},"arguments":["class.single-column"]}]}],"updateColumnCountStyles":[{"__symbolic":"method"}]}}}}]
|
|
@@ -71,7 +71,7 @@ CardStackComponent.decorators = [
|
|
|
71
71
|
{ type: Component, args: [{
|
|
72
72
|
selector: 'aup-card-stack',
|
|
73
73
|
template: "<div class=\"card-container\">\n <ng-content></ng-content>\n</div>\n<div class=\"footer\">\n <div class=\"add-card-container\" *ngIf=\"addCardCommand.enabled.value\" [pectinCommand]=\"addCardCommand\">\n <aup-command-face *ngIf=\"addCardFace\" [faces]=\"[addCardFace]\"></aup-command-face>\n <aup-icon *ngIf=\"!addCardFace\" icon=\"mat:add\"></aup-icon>\n </div>\n\n <div class=\"add-card-template\" *ngIf=\"addCardTemplate\">\n <ng-container [ngTemplateOutlet]=\"addCardTemplate\"></ng-container>\n </div>\n <ng-content select=\"[aup-card-stack-footer]\"></ng-content>\n</div>\n",
|
|
74
|
-
styles: [":host{--resolved-card-gap:var(--card-gap,16px);--resolved-card-height:var(--card-height,auto);--resolved-card-min-height:var(--card-min-height,auto);--resolved-card-background:var(--card-background,#fcfcfb);flex:1;display:block;background:var(--resolved-card-background)}.card-container{display:grid;grid-template-columns:1fr;grid-auto-rows:minmax(var(--resolved-card-min-height),var(--resolved-card-height));grid-gap:var(--resolved-card-gap);box-sizing:border-box;padding:var(--resolved-card-gap);max-width:100%}.footer{align-items:stretch;padding:0 var(--resolved-card-gap) var(--resolved-card-gap)}.add-card-container,.footer{display:flex;flex-direction:column}.add-card-container{width:var(--resolved-card-width);height:var(--resolved-card-height);min-height:var(--resolved-card-min-height);align-items:center;justify-content:center;box-sizing:border-box;border:2px dashed rgba(0,0,0,.1);border-radius:6px;font-weight:300;cursor:pointer;color:rgba(0,0,0,.54);background-color:hsla(0,0%,100%,.8)
|
|
74
|
+
styles: [":host{--resolved-card-gap:var(--card-gap,16px);--resolved-card-height:var(--card-height,auto);--resolved-card-min-height:var(--card-min-height,auto);--resolved-card-background:var(--card-background,#fcfcfb);flex:1;display:block;background:var(--resolved-card-background)}.card-container{display:grid;grid-template-columns:1fr;grid-auto-rows:minmax(var(--resolved-card-min-height),var(--resolved-card-height));grid-gap:var(--resolved-card-gap);box-sizing:border-box;padding:var(--resolved-card-gap);max-width:100%}.footer{align-items:stretch;padding:0 var(--resolved-card-gap) var(--resolved-card-gap)}.add-card-container,.footer{display:flex;flex-direction:column}.add-card-container{width:var(--resolved-card-width);height:var(--resolved-card-height);min-height:var(--resolved-card-min-height);align-items:center;justify-content:center;transition:box-shadow .28s cubic-bezier(.4,0,.2,1);box-sizing:border-box;border:2px dashed rgba(0,0,0,.1);border-radius:6px;font-weight:300;cursor:pointer;color:rgba(0,0,0,.54);background-color:hsla(0,0%,100%,.8)}.add-card-container mat-icon{font-size:200%}.add-card-container:hover{box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12);border-color:transparent;background-color:#fff;color:rgba(0,0,0,.54)}.add-card-template-container{width:var(--resolved-card-width);height:var(--resolved-card-height);display:flex;flex-direction:column;align-items:stretch;justify-content:stretch}"]
|
|
75
75
|
},] }
|
|
76
76
|
];
|
|
77
77
|
CardStackComponent.ctorParameters = () => [];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
[{"__symbolic":"module","version":4,"metadata":{"CardStackComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../abstract-card-container.component","name":"AbstractCardContainerComponent","line":69,"character":40},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":64,"character":1},"arguments":[{"selector":"aup-card-stack","template":"<div class=\"card-container\">\n <ng-content></ng-content>\n</div>\n<div class=\"footer\">\n <div class=\"add-card-container\" *ngIf=\"addCardCommand.enabled.value\" [pectinCommand]=\"addCardCommand\">\n <aup-command-face *ngIf=\"addCardFace\" [faces]=\"[addCardFace]\"></aup-command-face>\n <aup-icon *ngIf=\"!addCardFace\" icon=\"mat:add\"></aup-icon>\n </div>\n\n <div class=\"add-card-template\" *ngIf=\"addCardTemplate\">\n <ng-container [ngTemplateOutlet]=\"addCardTemplate\"></ng-container>\n </div>\n <ng-content select=\"[aup-card-stack-footer]\"></ng-content>\n</div>\n","styles":[":host{--resolved-card-gap:var(--card-gap,16px);--resolved-card-height:var(--card-height,auto);--resolved-card-min-height:var(--card-min-height,auto);--resolved-card-background:var(--card-background,#fcfcfb);flex:1;display:block;background:var(--resolved-card-background)}.card-container{display:grid;grid-template-columns:1fr;grid-auto-rows:minmax(var(--resolved-card-min-height),var(--resolved-card-height));grid-gap:var(--resolved-card-gap);box-sizing:border-box;padding:var(--resolved-card-gap);max-width:100%}.footer{align-items:stretch;padding:0 var(--resolved-card-gap) var(--resolved-card-gap)}.add-card-container,.footer{display:flex;flex-direction:column}.add-card-container{width:var(--resolved-card-width);height:var(--resolved-card-height);min-height:var(--resolved-card-min-height);align-items:center;justify-content:center;box-sizing:border-box;border:2px dashed rgba(0,0,0,.1);border-radius:6px;font-weight:300;cursor:pointer;color:rgba(0,0,0,.54);background-color:hsla(0,0%,100%,.8)
|
|
1
|
+
[{"__symbolic":"module","version":4,"metadata":{"CardStackComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../abstract-card-container.component","name":"AbstractCardContainerComponent","line":69,"character":40},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":64,"character":1},"arguments":[{"selector":"aup-card-stack","template":"<div class=\"card-container\">\n <ng-content></ng-content>\n</div>\n<div class=\"footer\">\n <div class=\"add-card-container\" *ngIf=\"addCardCommand.enabled.value\" [pectinCommand]=\"addCardCommand\">\n <aup-command-face *ngIf=\"addCardFace\" [faces]=\"[addCardFace]\"></aup-command-face>\n <aup-icon *ngIf=\"!addCardFace\" icon=\"mat:add\"></aup-icon>\n </div>\n\n <div class=\"add-card-template\" *ngIf=\"addCardTemplate\">\n <ng-container [ngTemplateOutlet]=\"addCardTemplate\"></ng-container>\n </div>\n <ng-content select=\"[aup-card-stack-footer]\"></ng-content>\n</div>\n","styles":[":host{--resolved-card-gap:var(--card-gap,16px);--resolved-card-height:var(--card-height,auto);--resolved-card-min-height:var(--card-min-height,auto);--resolved-card-background:var(--card-background,#fcfcfb);flex:1;display:block;background:var(--resolved-card-background)}.card-container{display:grid;grid-template-columns:1fr;grid-auto-rows:minmax(var(--resolved-card-min-height),var(--resolved-card-height));grid-gap:var(--resolved-card-gap);box-sizing:border-box;padding:var(--resolved-card-gap);max-width:100%}.footer{align-items:stretch;padding:0 var(--resolved-card-gap) var(--resolved-card-gap)}.add-card-container,.footer{display:flex;flex-direction:column}.add-card-container{width:var(--resolved-card-width);height:var(--resolved-card-height);min-height:var(--resolved-card-min-height);align-items:center;justify-content:center;transition:box-shadow .28s cubic-bezier(.4,0,.2,1);box-sizing:border-box;border:2px dashed rgba(0,0,0,.1);border-radius:6px;font-weight:300;cursor:pointer;color:rgba(0,0,0,.54);background-color:hsla(0,0%,100%,.8)}.add-card-container mat-icon{font-size:200%}.add-card-container:hover{box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12);border-color:transparent;background-color:#fff;color:rgba(0,0,0,.54)}.add-card-template-container{width:var(--resolved-card-width);height:var(--resolved-card-height);display:flex;flex-direction:column;align-items:stretch;justify-content:stretch}"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}]}}}}]
|