@descope/web-components-ui 1.0.378 → 1.0.379

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@descope/web-components-ui",
-  "version": "1.0.378",
+  "version": "1.0.379",
   "description": "",
   "main": "dist/cjs/index.cjs.js",
   "module": "dist/index.esm.js",
@@ -72,6 +72,7 @@
     "husky": "^9.0.0",
     "jest": "^29.5.0",
     "jest-environment-jsdom": "^29.5.0",
+    "lint-staged": "^15.0.0",
     "patch-package": "^8.0.0",
     "prettier": "^3.0.2",
     "rollup": "^3.21.4",
@@ -88,7 +89,6 @@
     "@vaadin/checkbox": "24.3.4",
     "@vaadin/combo-box": "24.3.4",
     "@vaadin/custom-field": "24.3.4",
-    "@vaadin/date-picker": "24.3.4",
     "@vaadin/dialog": "24.3.4",
     "@vaadin/email-field": "24.3.4",
     "@vaadin/grid": "24.3.4",
@@ -98,6 +98,7 @@
     "@vaadin/notification": "24.3.4",
     "@vaadin/number-field": "24.3.4",
     "@vaadin/password-field": "24.3.4",
+    "@vaadin/popover": "24.5.0",
     "@vaadin/radio-group": "24.3.4",
     "@vaadin/text-area": "24.3.4",
     "@vaadin/text-field": "24.3.4",
@@ -106,7 +107,6 @@
     "element-internals-polyfill": "^1.3.9",
     "highlight.js": "^11.9.0",
     "libphonenumber-js": "^1.11.12",
-    "lint-staged": "^15.0.0",
     "lodash.debounce": "4.0.8",
     "lodash.merge": "4.6.2",
     "markdown-it": "14.1.0"
@@ -117,7 +117,6 @@
     "@vaadin/checkbox": "24.3.4",
     "@vaadin/combo-box": "24.3.4",
     "@vaadin/custom-field": "24.3.4",
-    "@vaadin/date-picker": "24.3.4",
     "@vaadin/dialog": "24.3.4",
     "@vaadin/email-field": "24.3.4",
     "@vaadin/grid": "24.3.4",
@@ -126,9 +125,16 @@
     "@vaadin/multi-select-combo-box": "24.3.4",
     "@vaadin/notification": "24.3.4",
     "@vaadin/number-field": "24.3.4",
+    "@vaadin/component-base": "24.3.4",
     "@vaadin/password-field": "24.3.4",
     "@vaadin/text-area": "24.3.4",
-    "@vaadin/text-field": "24.3.4"
+    "@vaadin/text-field": "24.3.4",
+    "@vaadin/overlay": "24.3.4",
+    "@vaadin/vaadin-lumo-styles": "24.3.4",
+    "@vaadin/vaadin-material-styles": "24.3.4",
+    "@vaadin/vaadin-themable-mixin": "24.3.4",
+    "@vaadin/a11y-base": "24.3.4",
+    "@vaadin/tooltip": "24.3.4"
   },
   "vaadin": {
     "disableUsageStatistics": true

package/src/components/descope-combo-box/ComboBoxClass.js

@@ -268,7 +268,13 @@ const ComboBoxMixin = (superclass) =>
     }
 
     get value() {
-      return this.baseElement.selectedItem?.['data-id'] || '';
+      return this.baseElement.selectedItem?.['data-id'] || this.allowCustomValue
+        ? this.baseElement.__data.value || ''
+        : '';
+    }
+
+    get allowCustomValue() {
+      return this.getAttribute('allow-custom-value') === 'true';
     }
   };
 

package/src/components/descope-date-field/DateCounterClass.js

@@ -0,0 +1,83 @@
+// DateCounterClass allows us to add several counters to the input, and use them seperately.
+// For examele, we have a DayCounter, MonthCounter and YearCounter, which can each separately navigate
+// between different ranges.
+export class DateCounter {
+  constructor({ id, min, max, placeholder }) {
+    this.id = id;
+    this.data = [];
+    this.min = min;
+    this.max = max;
+    this.placeholder = placeholder;
+  }
+
+  get #initialNumValue() {
+    return this.data.length ? this.numberValue : 0;
+  }
+
+  get numberValue() {
+    return Number(this.stringValue);
+  }
+
+  get stringValue() {
+    return (this.data.join('') || this.placeholder).padStart(this.length, '0');
+  }
+
+  get isFull() {
+    return this.numberValue * 10 > this.max || this.data.length === this.length;
+  }
+
+  get isEmpty() {
+    return this.stringValue === this.placeholder;
+  }
+
+  get length() {
+    return this.max.toString().length;
+  }
+
+  set(val) {
+    this.data = val.toString().split('');
+  }
+
+  add(num) {
+    this.data.push(num);
+
+    if (this.numberValue > this.max) {
+      this.data.length = 0;
+      this.data.push(num);
+    } else if (this.length < this.data.length) {
+      this.data.shift();
+    }
+
+    return num;
+  }
+
+  del() {
+    if (!this.data.filter((d) => d !== '0').filter(Boolean).length) {
+      this.data.length = 0;
+    } else {
+      this.data.pop();
+    }
+  }
+
+  clear() {
+    this.data = [];
+  }
+
+  inc(gap) {
+    this.replaceValue(this.#initialNumValue + (gap || 1));
+  }
+
+  dec(gap) {
+    this.replaceValue(this.#initialNumValue - (gap || 1));
+  }
+
+  isInRange(val) {
+    return val >= this.min && val <= this.max;
+  }
+
+  replaceValue(val) {
+    if (this.isInRange(val)) {
+      this.data = val.toString().padStart(this.length, 0).split('');
+    }
+  }
+}