@paperless/core 0.1.0-alpha.30 → 0.1.0-alpha.300

package/dist/collection/components/atoms/tooltip/tooltip.component.js

@@ -1,44 +1,23 @@
 import { createPopper } from '@popperjs/core';
-import { Component, Element, h, Host, Listen, Prop } from '@stencil/core';
+import { h, Host, } from '@stencil/core';
 export class Tooltip {
   constructor() {
-    /**
-     * The variant of the popover
-     */
+    this._loaded = false;
     this.variant = 'hover';
-    /**
-     * The content of the popover
-     */
     this.popover = null;
-    /**
-     * The content of the popover
-     */
     this.placement = 'top';
-    /**
-     * Wether to show the popover
-     */
+    this.strategy = 'absolute';
     this.show = false;
-    /**
-     * Wether to someone can manually close the popover
-     */
     this.canManuallyClose = true;
-    this._loaded = false;
   }
   componentShouldUpdate() {
     this._setOptions();
-    if (this._loaded && this.show) {
-      this._show();
-    }
   }
   render() {
-    return (h(Host, { class: "p-popover" },
-      h("slot", { name: "content" }),
-      h("div", { class: `popover variant-${this.variant}`, role: "popover", ref: (el) => this._load(el) },
-        this.popover ? this.popover : h("slot", { name: "popover" }),
-        h("div", { class: "arrow", "data-popper-arrow": true }))));
+    return (h(Host, { class: "p-popover" }, h("slot", { name: "content" }), h("div", { class: "popover-container" }, h("div", { class: `popover variant-${this.variant}`, role: "popover", ref: (el) => this._load(el) }, this.popover ? this.popover : h("slot", { name: "popover" }), h("div", { class: "arrow", "data-popper-arrow": true })))));
   }
   clickHandler() {
-    if (this.variant !== 'click') {
+    if (this.variant === 'hover') {
       return;
     }
     if (this._popover.hasAttribute('data-show')) {
@@ -47,7 +26,7 @@ export class Tooltip {
     this._show();
   }
   documentClickHandler() {
-    if (this.variant !== 'click' || !this.canManuallyClose) {
+    if (this.variant === 'hover' || !this.canManuallyClose) {
       return;
     }
     if (!this._popover.hasAttribute('data-show')) {
@@ -80,6 +59,7 @@ export class Tooltip {
       ] })));
     // Update its position
     this._popper.update();
+    this.isOpen.emit(true);
   }
   _hide() {
     if (!this._loaded) {
@@ -92,11 +72,14 @@ export class Tooltip {
         ...options.modifiers,
         { name: 'eventListeners', enabled: false },
       ] })));
+    this.isOpen.emit(false);
   }
   _load(popover) {
     this._popover = popover;
     if (popover) {
-      this._popper = createPopper(this._el, popover);
+      this._popper = createPopper(this._el, popover, {
+        strategy: this.strategy,
+      });
       this._setOptions();
       this._loaded = true;
       if (this.show) {
@@ -109,12 +92,12 @@ export class Tooltip {
       return;
     }
     this._popper.setOptions({
-      placement: this.variant === 'error' ? 'bottom-start' : this.placement,
+      placement: this.variant === 'error' ? 'top-end' : this.placement,
       modifiers: [
         {
           name: 'offset',
           options: {
-            offset: [0, 8],
+            offset: this.variant === 'error' ? [8, 14] : [0, 8],
           },
         },
         {
@@ -128,145 +111,194 @@ export class Tooltip {
   }
   static get is() { return "p-tooltip"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["tooltip.component.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["tooltip.component.css"]
-  }; }
-  static get properties() { return {
-    "variant": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'hover' | 'click' | 'error'",
-        "resolved": "\"click\" | \"error\" | \"hover\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The variant of the popover"
-      },
-      "attribute": "variant",
-      "reflect": false,
-      "defaultValue": "'hover'"
-    },
-    "popover": {
-      "type": "any",
-      "mutable": false,
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
+  static get originalStyleUrls() {
+    return {
+      "$": ["tooltip.component.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["tooltip.component.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "variant": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'hover' | 'click' | 'error'",
+          "resolved": "\"click\" | \"error\" | \"hover\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The variant of the popover"
+        },
+        "attribute": "variant",
+        "reflect": false,
+        "defaultValue": "'hover'"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The content of the popover"
+      "popover": {
+        "type": "any",
+        "mutable": false,
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The content of the popover"
+        },
+        "attribute": "popover",
+        "reflect": false,
+        "defaultValue": "null"
       },
-      "attribute": "popover",
-      "reflect": false,
-      "defaultValue": "null"
-    },
-    "placement": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "Placement",
-        "resolved": "\"auto\" | \"auto-end\" | \"auto-start\" | \"bottom\" | \"bottom-end\" | \"bottom-start\" | \"left\" | \"left-end\" | \"left-start\" | \"right\" | \"right-end\" | \"right-start\" | \"top\" | \"top-end\" | \"top-start\"",
-        "references": {
-          "Placement": {
-            "location": "import",
-            "path": "@popperjs/core"
+      "placement": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "Placement",
+          "resolved": "\"auto\" | \"auto-end\" | \"auto-start\" | \"bottom\" | \"bottom-end\" | \"bottom-start\" | \"left\" | \"left-end\" | \"left-start\" | \"right\" | \"right-end\" | \"right-start\" | \"top\" | \"top-end\" | \"top-start\"",
+          "references": {
+            "Placement": {
+              "location": "import",
+              "path": "@popperjs/core"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The content of the popover"
-      },
-      "attribute": "placement",
-      "reflect": false,
-      "defaultValue": "'top'"
-    },
-    "show": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Wether to show the popover"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The placement of the popover"
+        },
+        "attribute": "placement",
+        "reflect": false,
+        "defaultValue": "'top'"
       },
-      "attribute": "show",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "canManuallyClose": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
+      "strategy": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "PositioningStrategy",
+          "resolved": "\"absolute\" | \"fixed\"",
+          "references": {
+            "PositioningStrategy": {
+              "location": "import",
+              "path": "@popperjs/core"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The strategy of the popover placement"
+        },
+        "attribute": "strategy",
+        "reflect": false,
+        "defaultValue": "'absolute'"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Wether to someone can manually close the popover"
+      "show": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Wether to show the popover"
+        },
+        "attribute": "show",
+        "reflect": false,
+        "defaultValue": "false"
       },
-      "attribute": "can-manually-close",
-      "reflect": false,
-      "defaultValue": "true"
-    }
-  }; }
+      "canManuallyClose": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Wether to someone can manually close the popover"
+        },
+        "attribute": "can-manually-close",
+        "reflect": false,
+        "defaultValue": "true"
+      }
+    };
+  }
+  static get events() {
+    return [{
+        "method": "isOpen",
+        "name": "isOpen",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Open change event"
+        },
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        }
+      }];
+  }
   static get elementRef() { return "_el"; }
-  static get listeners() { return [{
-      "name": "click",
-      "method": "clickHandler",
-      "target": undefined,
-      "capture": true,
-      "passive": false
-    }, {
-      "name": "click",
-      "method": "documentClickHandler",
-      "target": "document",
-      "capture": true,
-      "passive": false
-    }, {
-      "name": "mouseenter",
-      "method": "mouseEnterHandler",
-      "target": undefined,
-      "capture": false,
-      "passive": true
-    }, {
-      "name": "focus",
-      "method": "mouseEnterHandler",
-      "target": undefined,
-      "capture": false,
-      "passive": false
-    }, {
-      "name": "mouseleave",
-      "method": "mouseLeaveHandler",
-      "target": undefined,
-      "capture": false,
-      "passive": true
-    }, {
-      "name": "blur",
-      "method": "mouseLeaveHandler",
-      "target": undefined,
-      "capture": false,
-      "passive": false
-    }]; }
+  static get listeners() {
+    return [{
+        "name": "click",
+        "method": "clickHandler",
+        "target": undefined,
+        "capture": true,
+        "passive": false
+      }, {
+        "name": "click",
+        "method": "documentClickHandler",
+        "target": "document",
+        "capture": true,
+        "passive": false
+      }, {
+        "name": "mouseenter",
+        "method": "mouseEnterHandler",
+        "target": undefined,
+        "capture": false,
+        "passive": true
+      }, {
+        "name": "focus",
+        "method": "mouseEnterHandler",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "mouseleave",
+        "method": "mouseLeaveHandler",
+        "target": undefined,
+        "capture": false,
+        "passive": true
+      }, {
+        "name": "blur",
+        "method": "mouseLeaveHandler",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }];
+  }
 }

package/dist/collection/components/helpers/table-column/table-column.component.js

@@ -0,0 +1,150 @@
+export class TableColumn {
+  constructor() {
+    this.path = undefined;
+    this.type = 'td';
+    this.name = undefined;
+    this.useSlot = false;
+    this.align = 'start';
+    this.sizes = 'auto';
+  }
+  componentDidUpdate() {
+    this.tableDefinitionChanged.emit(true);
+  }
+  render() {
+    return;
+  }
+  static get is() { return "p-table-column"; }
+  static get properties() {
+    return {
+      "path": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The path of the value of the item you want to display"
+        },
+        "attribute": "path",
+        "reflect": true
+      },
+      "type": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "'td' | 'th'",
+          "resolved": "\"td\" | \"th\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The type of the column"
+        },
+        "attribute": "type",
+        "reflect": true,
+        "defaultValue": "'td'"
+      },
+      "name": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The name of the column"
+        },
+        "attribute": "name",
+        "reflect": true
+      },
+      "useSlot": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Wether the column should use the slot"
+        },
+        "attribute": "use-slot",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "align": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "'start' | 'center' | 'end'",
+          "resolved": "\"center\" | \"end\" | \"start\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The alignment of the column"
+        },
+        "attribute": "align",
+        "reflect": true,
+        "defaultValue": "'start'"
+      },
+      "sizes": {
+        "type": "any",
+        "mutable": true,
+        "complexType": {
+          "original": "'auto' | number | TableColumnSizes",
+          "resolved": "\"auto\" | TableColumnSizes | number",
+          "references": {
+            "TableColumnSizes": {
+              "location": "import",
+              "path": "../../../types/table"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The sizes of the column"
+        },
+        "attribute": "sizes",
+        "reflect": false,
+        "defaultValue": "'auto'"
+      }
+    };
+  }
+  static get events() {
+    return [{
+        "method": "tableDefinitionChanged",
+        "name": "tableDefinitionChanged",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Event to let the table know it has to re render"
+        },
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        }
+      }];
+  }
+}

package/dist/collection/components/molecules/accordion/accordion.component.css

@@ -0,0 +1 @@
+.block{display:block!important}*{box-sizing:border-box}:host{display:block;margin-bottom:1.5rem}.static{position:static!important}.m-0{margin:0!important}.mt-6{margin-top:1.5rem!important}.flex{display:flex!important}.cursor-pointer{cursor:pointer!important}.items-center{align-items:center!important}.gap-3{gap:.75rem!important}.whitespace-nowrap{white-space:nowrap!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.font-medium{font-weight:500!important}.text-storm-vague{--tw-text-opacity:1!important;color:rgb(152 154 183/var(--tw-text-opacity))!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.rotate-0{--tw-rotate:0deg!important}.rotate-0,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-270{--tw-rotate:270deg!important}.rotate-315{--tw-rotate:315deg!important}.-rotate-0,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-135,.-rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-270,.-rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-315{--tw-rotate:-315deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-xxs{font-size:.6875rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg,.text-xl{line-height:1.75rem!important}.text-xl{font-size:1.25rem!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}