@coolon/angular-ui-powerups 12.4.0-alpha.60 → 12.4.0-alpha.62

package/assets/form.scss

@@ -24,6 +24,11 @@
       align-items: center; // and center our internal content.
     }
 
+    .mat-form-field-infix {
+      width: auto;
+    }
+
+
     .mat-form-field-suffix {
       .mat-icon-button {
         line-height: 2.5em; // fix centering of aup-icons within the button.

package/assets/interaction/editor/inline-string-editor.scss

@@ -17,7 +17,12 @@
       padding-bottom:  var(--aup-activity-padding-bottom);
       padding-right:  var(--aup-activity-padding-right);
 
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+
       mat-form-field {
+        flex:1;
         &:not(.empty) {
           input {
             color: currentColor;
@@ -36,63 +41,12 @@
           //opacity: 0; // hide the underline...
         }
       }
+    }
 
+    aup-string-input {
+      flex: 1;
     }
 
-    //.content {
-    //  position: relative;
-    //  display: grid;
-    //  grid-template-areas: "label edit-control" "content edit-control";
-    //  grid-template-columns: 1fr auto;
-    //  grid-template-rows: auto;
-    //
-    //  font-size: typography-utils.font-size($typography-config, input);
-    //
-    //  //box-sizing: border-box;
-    //  // copied from mat input...
-    //  border-top: 0.84375em solid transparent;
-    //  padding-bottom: 1.34375em;
-    //
-    //  $top-padding-tweak: 1px;
-    //  padding-top: $top-padding-tweak;
-    //
-    //  > label {
-    //    position: absolute;
-    //    transform: translateY(-100%);
-    //    @include mixins.floating-label-style();
-    //  }
-    //
-    //  > p {
-    //    grid-area: content;
-    //    @include typography-utils.typography-level($typography-config, input);
-    //
-    //    // copied from mat input...
-    //    padding: 0.5em 0;
-    //    margin: -0.0625em 0 0 0;
-    //
-    //    box-sizing: border-box;
-    //    flex: 1;
-    //
-    //    &.editing-enabled {
-    //      cursor: pointer;
-    //    }
-    //
-    //    &.place-holder {
-    //      color: rgba(0,0,0,0.5); // TODO: get the angular theme value for disabled form elements...
-    //    }
-    //
-    //  }
-    //
-    //  &:hover {
-    //    //background-color: rgba(0, 0, 0, 0.03);
-    //  }
-    //
-    //  > aup-command {
-    //    grid-area: edit-control;
-    //    align-self: end;
-    //    transform: translateY(3px); // hack to line up with activity actions...!
-    //  }
-    //}
   }
 }
 

package/bundles/coolon-angular-ui-powerups.umd.js

@@ -755,7 +755,7 @@
         { type: i0.Component, args: [{
                     selector: 'aup-busy-overlay',
                     template: "<ng-content></ng-content>\n<div class=\"busy-overlay-backdrop\" *ngIf=\"busyModel.value\">\n  <mat-progress-spinner mode=\"indeterminate\" [diameter]=\"52\"></mat-progress-spinner>\n</div>\n",
-                    styles: [":host{position:relative}div.busy-overlay-backdrop{position:absolute;background-color:#0003;top:0;left:0;bottom:0;right:0;display:grid;grid-template-columns:auto;grid-template-rows:auto;place-content:center}\n"]
+                    styles: [":host{position:relative}div.busy-overlay-backdrop{z-index:10;z-index:var(--aup-busy-overlay-z-index, 10);position:absolute;background-color:#0003;top:0;left:0;bottom:0;right:0;display:grid;grid-template-columns:auto;grid-template-rows:auto;place-content:center}\n"]
                 },] }
     ];
     BusyOverlayComponent.ctorParameters = function () { return []; };
@@ -4426,17 +4426,17 @@
             var _this = this;
             var chain = pectin.Dsl.disposeWith(this).chain;
             this.canExpand = chain(this.nodeModel).map(function (node) {
-                return exports.DecoratedTreeNode.getDecorator(node).hasChildren() && _this.expansionModel.isCollapsed(node);
-            }, { dependsOn: this.expansionModel.isExpandedPredicate });
+                return exports.DecoratedTreeNode.getDecorator(node).hasChildren() && _this.treeTableModel.isCollapsed(node);
+            }, { dependsOn: this.treeTableModel.treeExpansionModel.isExpandedPredicate });
             this.canCollapse = chain(this.nodeModel).map(function (node) {
-                return exports.DecoratedTreeNode.getDecorator(node).hasChildren() && !_this.expansionModel.isCollapsed(node);
-            }, { dependsOn: this.expansionModel.isExpandedPredicate });
+                return exports.DecoratedTreeNode.getDecorator(node).hasChildren() && !_this.treeTableModel.isCollapsed(node);
+            }, { dependsOn: this.treeTableModel.treeExpansionModel.isExpandedPredicate });
             this.iconModel = chain(this.nodeModel).map(function (node) {
                 var _a;
-                var expanded = _this.expansionModel.isExpanded(_this.node);
+                var expanded = _this.treeTableModel.treeExpansionModel.isExpanded(_this.node);
                 var iconFactory = (_a = _this.iconFactory) !== null && _a !== void 0 ? _a : TreeLabelCellRendererComponent.DEFAULT_ICON_FACTORY;
                 return iconFactory(node, expanded, TreeLabelCellRendererComponent.DEFAULT_ICON_FACTORY(node, expanded, undefined));
-            }, { dependsOn: this.expansionModel.isExpandedPredicate });
+            }, { dependsOn: this.treeTableModel.treeExpansionModel.isExpandedPredicate });
         };
         Object.defineProperty(TreeLabelCellRendererComponent.prototype, "isRoot", {
             get: function () {
@@ -4463,7 +4463,7 @@
         TreeLabelCellRendererComponent.prototype.expandOrCollapse = function ($event, node) {
             $event.preventDefault();
             $event.stopPropagation();
-            this.expansionModel.isCollapsed(node) ? this.expansionModel.expand(node) : this.expansionModel.collapse(node);
+            this.treeTableModel.isCollapsed(node) ? this.treeTableModel.expand(node) : this.treeTableModel.collapse(node);
         };
         return TreeLabelCellRendererComponent;
     }(DisposableComponent));
@@ -4479,7 +4479,7 @@
         value: [{ type: i0.Input }],
         label: [{ type: i0.Input }],
         iconFactory: [{ type: i0.Input }],
-        expansionModel: [{ type: i0.Input }],
+        treeTableModel: [{ type: i0.Input }],
         isRoot: [{ type: i0.HostBinding, args: ['class.root',] }],
         isLeaf: [{ type: i0.HostBinding, args: ['class.leaf',] }]
     };
@@ -4609,7 +4609,7 @@
             var _this = this;
             this.configureCellRenderer(new ComponentCellRendererPortalRef(componentType, function (component, rowData, firstTime) {
                 if (firstTime) {
-                    component.expansionModel = _this.expansionModel;
+                    component.treeTableModel = _this.expansionModel;
                 }
                 component.value = rowData.row;
                 component.label = ___default["default"].isNil(_this.labelProperty) ? undefined : rowData.row[_this.labelProperty];
@@ -4649,7 +4649,7 @@
         TreeTableModel.prototype.treeControlColumn = function (builder) {
             var _this = this;
             var columnId = 'tree-label';
-            var column = new TreeLabelColumnModel(columnId, function () { return _this.getColumnTextProperties(columnId); }, this.treeExpansionModel);
+            var column = new TreeLabelColumnModel(columnId, function () { return _this.getColumnTextProperties(columnId); }, this);
             builder(column);
             this.addColumn(column);
         };
@@ -4657,7 +4657,7 @@
             this.treeExpansionModel.expand(node);
         };
         TreeTableModel.prototype.collapse = function (node) {
-            this.treeExpansionModel.expand(node);
+            this.treeExpansionModel.collapse(node);
         };
         TreeTableModel.prototype.isCollapsed = function (node) {
             return this.treeExpansionModel.isCollapsed(node);