wcs-core 2.9.0 → 2.12.0

package/dist/esm/wcs-error_2.entry.js

@@ -77,22 +77,19 @@ let FormField = class {
     this.updateLabelRequiredFlag(isRequired, label);
   }
   initSpiedElement() {
-    var _a;
+    var _a, _b;
     const SUPPORTED_COMPONENTS = ['wcs-input', 'wcs-select', 'wcs-textarea', 'wcs-radio-group', 'wcs-switch', 'wcs-checkbox'];
-    this.spiedElement = (_a = this.el.shadowRoot.querySelector('slot:not([name])')) === null || _a === void 0 ? void 0 : _a.assignedElements()[0];
+    this.spiedElement = (_a = this.el.shadowRoot.querySelector('slot:not([name])')) === null || _a === void 0 ? void 0 : _a.assignedElements().filter(n => [...SUPPORTED_COMPONENTS, 'SLOT'].map(x => x.toUpperCase()).indexOf(n.nodeName) !== -1)[0];
     // If the component is used in another web component
-    if (this.spiedElement.tagName === 'SLOT') {
+    if (((_b = this.spiedElement) === null || _b === void 0 ? void 0 : _b.tagName) === 'SLOT') {
       this.spiedElement = (this.spiedElement
         .assignedElements()
         .filter(n => SUPPORTED_COMPONENTS.map(x => x.toUpperCase()).indexOf(n.nodeName) !== -1)[0]);
     }
-    if (!this.spiedElement)
-      throw new Error('You must provide a slotted element in form field');
-    if (SUPPORTED_COMPONENTS
-      .map(x => x.toUpperCase())
-      .indexOf(this.spiedElement.tagName) === -1) {
+    if (!this.spiedElement) {
       // tslint:disable-next-line:no-console
-      console.warn('form-field component support ' + SUPPORTED_COMPONENTS.toString() + '. Some features may not work with the provided component (component ' + this.spiedElement.tagName + ' not natively supported).');
+      console.warn('Form-field component support only ' + SUPPORTED_COMPONENTS.toString() + '. Some features may not work with the provided component.');
+      return;
     }
   }
   updateLabelRequiredFlag(isRequired, label) {

package/dist/esm/wcs-galactic-menu.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-b982604a.js';
 import { a as clickInsideElement } from './helpers-e2993152.js';
-import { c as createPopper } from './popper-5f42e560.js';
+import { c as createPopper } from './popper-548df79b.js';
 
 const galacticMenuCss = "#menu{background-color:var(--wcs-gray);color:white;display:none;padding:var(--wcs-padding)}#menu[data-show]{display:block;z-index:9999}#menu[data-popper-placement^=top]>#arrow{bottom:-4px}#menu[data-popper-placement^=bottom]>#arrow{top:-4px}#menu[data-popper-placement^=left]>#arrow{right:-4px}#menu[data-popper-placement^=right]>#arrow{left:-4px}:host{display:flex;align-items:center;height:32px;padding-left:var(--wcs-padding);background-color:var(--wcs-gray-light)}#toggle-menu-icon{cursor:pointer;padding:0 var(--wcs-padding);user-select:none}#arrow,#arrow::before{position:absolute;width:8px;height:8px;background:inherit}#arrow{visibility:hidden}#arrow::before{visibility:visible;content:\"\";transform:rotate(45deg)}";
 

package/dist/esm/wcs-horizontal-stepper.entry.js

@@ -41,16 +41,19 @@ let HorizontalStepper = class {
     }
   }
   onCurrentStepChange(newValue, oldValue) {
-    const stepInterval = Math.abs(oldValue - newValue);
-    this.el.style.setProperty('--wcs-progress-bar-animation-duration', 375 / stepInterval + 'ms');
-    if (newValue !== oldValue) {
-      for (let i = 0; i < stepInterval; i++) {
-        setTimeout(() => {
-          this.internalCurrentStep -= (oldValue - newValue) > 0 ? 1 : -1;
-          if (i === stepInterval - 1) {
-            this.el.style.removeProperty('--wcs-progress-bar-animation-duration');
-          }
-        }, (i * (375 / stepInterval)));
+    //Check if the function is called before the component has finished its initialization in which case we do nothing
+    if (this.internalCurrentStep !== undefined) {
+      const stepInterval = Math.abs(oldValue - newValue);
+      this.el.style.setProperty('--wcs-progress-bar-animation-duration', 375 / stepInterval + 'ms');
+      if (newValue !== oldValue) {
+        for (let i = 0; i < stepInterval; i++) {
+          setTimeout(() => {
+            this.internalCurrentStep -= (oldValue - newValue) > 0 ? 1 : -1;
+            if (i === stepInterval - 1) {
+              this.el.style.removeProperty('--wcs-progress-bar-animation-duration');
+            }
+          }, (i * (375 / stepInterval)));
+        }
       }
     }
   }

package/dist/esm/wcs-mat-icon.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, H as Host } from './index-b982604a.js';
 
-const matIconCss = ":host{display:inline-block}:host .size-s{font-size:18px}:host .size-m{font-size:24px}:host .size-l{font-size:36px}:host .size-xl{font-size:48px}";
+const matIconCss = ":host{display:flex;flex-direction:column;justify-content:center}:host .size-s{font-size:18px}:host .size-m{font-size:24px}:host .size-l{font-size:36px}:host .size-xl{font-size:48px}";
 
 let MatIcon = class {
   constructor(hostRef) {

package/dist/esm/wcs-modal.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-b982604a.js';
 
-const modalCss = "wcs-modal{--saas-fix-modal:rgba(var(--wcs-black), 0.5);z-index:999;position:fixed;top:0;bottom:0;left:0;right:0;display:none}wcs-modal[show]{display:block;width:100%;height:100%;opacity:1;display:block}wcs-modal[without-backdrop] .wcs-modal-backdrop{display:none}wcs-modal[without-backdrop] .wcs-modal-container{border:solid 1px var(--wcs-text-light)}.wcs-modal-backdrop{display:block;position:fixed;top:0;left:0;bottom:0;right:0;opacity:0.4;background-color:var(--wcs-black)}.wcs-modal-container{position:fixed;top:50%;left:50%;box-sizing:border-box;max-width:100%;transform:translate(-50%, -50%);pointer-events:auto;background-color:#fff;background-clip:padding-box;border:0 solid rgba(0, 0, 0, 0.2);border-radius:0.4375rem;outline:0;z-index:20000;display:block;padding:1.375rem 1.875rem 1.875rem 1.875rem}.wcs-modal-container[data-size=s]{width:288px}.wcs-modal-container[data-size=m]{width:480px}.wcs-modal-container[data-size=l]{width:864px}.wcs-modal-container[data-size=xl]{width:1200px}.wcs-modal-header{margin-bottom:8px;display:flex;align-items:center;justify-content:space-between}.wcs-modal-header h5{font-size:24px;font-weight:400;margin:0}.wcs-modal-content{font-weight:400;font-size:16px}.wcs-modal-actions{margin-top:20px;float:right}";
+const modalCss = "wcs-modal{z-index:999;position:fixed;top:0;bottom:0;left:0;right:0;display:none;background:rgba(0, 0, 0, 0.4)}wcs-modal[show]{display:flex;height:100vh;width:100vw;align-items:center;justify-content:center}wcs-modal[without-backdrop]{background-color:unset}wcs-modal[without-backdrop] .wcs-modal-container{border:solid 1px var(--wcs-text-light)}.wcs-modal-container{max-height:var(--wcs-modal-max-height, 80%);background-color:#fff;display:grid;grid-template-columns:100%;grid-template-rows:auto 1fr auto;box-sizing:border-box;pointer-events:auto;background-clip:padding-box;border:0 solid rgba(0, 0, 0, 0.2);border-radius:0.4375rem;z-index:20000;padding:1.375rem 1.875rem 1.875rem 1.875rem}.wcs-modal-container[data-size=s]{width:288px}.wcs-modal-container[data-size=m]{width:480px}.wcs-modal-container[data-size=l]{width:864px}.wcs-modal-container[data-size=xl]{width:1200px}.wcs-modal-header{margin-bottom:8px;display:flex;align-items:center;justify-content:space-between}.wcs-modal-header h5{font-size:24px;font-weight:400;margin:0}.wcs-modal-content{font-weight:400;font-size:16px;overflow-y:auto}.wcs-modal-actions{margin-top:20px;display:flex;justify-content:flex-end}";
 
 let Modal = class {
   constructor(hostRef) {
@@ -24,9 +24,13 @@ let Modal = class {
      * size best suited for the content and screen size displaying the modal. Remember to test responsiveness.
      */
     this.size = 'm';
+    /**
+     * Specifies whether the component should hide the actions slot or not
+     */
+    this.hideActions = false;
   }
   render() {
-    return (h(Host, null, h("div", { class: "wcs-modal-backdrop" }), h("div", { class: "wcs-modal-container", "data-size": this.size }, h("div", { class: "wcs-modal-header" }, h("h5", null, h("slot", { name: "header" })), this.showCloseButton && (h("wcs-button", { shape: "round", mode: "clear", class: "wcs-dark", onClick: ($event) => this.onCloseButtonClick($event) }, h("i", { class: "material-icons" }, "close")))), h("div", { class: "wcs-modal-content" }, h("slot", null)), h("div", { class: "wcs-modal-actions" }, h("slot", { name: "actions" })))));
+    return (h(Host, null, h("div", { class: "wcs-modal-container", "data-size": this.size }, h("div", { class: "wcs-modal-header" }, h("h5", null, h("slot", { name: "header" })), this.showCloseButton && (h("wcs-button", { shape: "round", mode: "clear", class: "wcs-dark", onClick: ($event) => this.onCloseButtonClick($event) }, h("wcs-mat-icon", { icon: "close" })))), h("div", { class: "wcs-modal-content" }, h("slot", null)), !this.hideActions && (h("div", { class: "wcs-modal-actions" }, h("slot", { name: "actions" }))))));
   }
   onKeyDown(event) {
     if (this.showCloseButton && event.key === 'Escape') {