@itfin/components 1.3.95 → 1.3.97

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itfin/components",
-  "version": "1.3.95",
+  "version": "1.3.97",
   "author": "Vitalii Savchuk <esvit666@gmail.com>",
   "scripts": {
     "serve": "vue-cli-service serve",

package/src/components/panels/Panel.vue

@@ -146,6 +146,10 @@ class Panel extends Vue {
   @Prop(Boolean) animate;
   @Prop(Boolean) nocard;
 
+  openPanel(...args) {
+    this.$emit('open', args);
+  }
+
   expandPanel() {
     this.$emit('expand');
   }

package/src/components/panels/PanelList.vue

@@ -19,6 +19,7 @@
           :collapsed="panel.isCollapsed"
           :closeable="panel.isCloseable"
           :animate="panel.isAnimate"
+          @open="openPanel($event[0], $event[1], n + 1)"
           @expand="expandPanel(panel)"
           @fullsize="fullsizePanel(panel)"
           @close="closePanel(panel)"
@@ -162,6 +163,7 @@ export interface IPanel {
   nocard?: boolean;
   isCollapsed: boolean;
   isCloseable: boolean;
+  isAnimate: boolean;
   open: (type: string, visOptions: VisualOptions, payload: any) => void;
   close: () => void;
   expand: () => void;

package/src/components/table/Table2.vue

@@ -53,6 +53,7 @@
             :editable-property="editableProperty"
             :sorting.sync="_sorting"
             :active="active"
+            :sort-as-string="sortAsString"
             @update:expanded-ids="$emit('update:expanded-ids', $event)"
             @new="$emit('new', $event)"
             @add-column="$emit('add-column', $event)"
@@ -113,6 +114,7 @@ class itfTable2 extends Vue {
   @Prop({ type: Array, default: () => [] }) expandedIds;
   @Prop() currency;
   @Prop() currencies;
+  @Prop(Boolean) sortAsString;
   @Prop(Boolean) stickyHeader;
   @Prop(Boolean) addNewRows;
   @Prop(Boolean) columnSorting;

package/src/components/table/TableGroup.vue

@@ -42,6 +42,7 @@
             :rows="rows"
             :schema="schema"
             :editable="editable"
+            :sort-as-string="sortAsString"
             :no-column-menu="noColumnMenu"
             :no-select-all="noSelectAll"
             :selected-ids="selectedIds"
@@ -361,6 +362,7 @@ class itfTableGroup extends Vue {
   @Prop(Boolean) expandedAll;
   @Prop(Boolean) striped;
   @Prop(Boolean) stickyHeader;
+  @Prop(Boolean) sortAsString;
   @Prop() indicatorWidth;
   @Prop() cssProperty;
   @PropSync('sorting') _sorting;

package/src/components/table/TableHeader.vue

@@ -174,6 +174,7 @@ class itfTableHeader extends Vue {
   @Prop(Boolean) noColumnMenu;
   @Prop(Boolean) noSelectAll;
   @Prop(Boolean) editable;
+  @Prop(Boolean) sortAsString;
   @Prop() idProperty;
   @Prop() indicatorType;
 
@@ -359,8 +360,10 @@ class itfTableHeader extends Vue {
   }
 
   sortBy(column, order) {
-    let sort = order === 'desc' ? `-${column.property}` : column.property;
-    console.info(sort);
+    let sort = { [column.property]: order };
+    if (this.sortAsString) {
+      sort = order === 'desc' ? `-${column.property}` : column.property;
+    }
     this.$emit('update:sorting', sort);
   }
 }

package/src/components/table/TableRows.vue

@@ -50,7 +50,7 @@
               <div
                 v-if="column.visible !== false"
                 :data-column="k"
-                :style="column.grow ? `left: ${column.left}px; flex-grow: 1` : `width: ${column.width}px; max-width: ${column.width}px; left: ${column.left}px;`"
+                :style="column.grow ? `left: ${column.left}px; width: ${column.width}px; flex-grow: 1` : `width: ${column.width}px; max-width: ${column.width}px; left: ${column.left}px;`"
                 :class="{'justify-content-end': column.align === 'end', 'sticky': column.pinned, 'last-sticky-column': k === lastPinnedIndex, 'flex-grow-1': column.grow, 'px-2': !(column.editable && editable), 'editable': column.editable && editable}"
                 class="table-view-item-value d-flex h-100">
                 <slot :name="`column.${column.property}`" :toggle="() => $emit('toggle', item)" :level="level" :editable="column.editable && editable" :item="item" :column="column" :update="(val) => updateValue(item, val, n, column)" :value="getValue(item, column)">

package/src/components/text-field/MoneyField.vue

@@ -1,11 +1,11 @@
 <template>
   <div class="itf-money-field ph-no-capture" :class="{'currency-arrow': !currencyDisabled, 'currency-select': currencySelect}">
-    <div :class="{'input-group h-100': noCurrencySign}" :style="`--itf-money-field-padding-left: ${noCurrencySign ? 1 : selectedCurrencySymbol.length * 0.6 + 1}rem`">
+    <div class="h-100" :class="{'input-group h-100': noCurrencySign}" :style="`--itf-money-field-padding-left: ${noCurrencySign ? 1 : selectedCurrencySymbol.length * 0.6 + 1}rem`">
       <span class="itf-money-field__prepend" v-if="!noCurrencySign">{{ selectedCurrencySymbol }}</span>
       <i-mask-component
         ref="input"
         v-bind="mask"
-        class="form-control"
+        class="form-control h-100"
         :class="{ 'is-invalid': isInvalid(), 'is-valid': isSuccess() }"
         @input="setValue"
         :value="maskedValue"
@@ -167,6 +167,10 @@ class itfMoneyField extends Vue {
   }
 
   setValue (val) {
+    if (val === '') {
+      this.$emit('input', null);
+      return;
+    }
     if (!isNumeric(val) || (val || '').toString().match(/\..*0$/)) { // що не видаляло останній нуль вкінці
       return;
     }