@paperless/core 0.1.0-alpha.281 → 0.1.0-alpha.282

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

@@ -1,177 +1,170 @@
-import { Component, h, Host, Prop } from '@stencil/core';
+import { h, Host } from '@stencil/core';
 export class Label {
   constructor() {
-    /**
-     * Variant of the label
-     */
     this.variant = 'info';
-    /**
-     * Define the behavior of the label
-     */
     this.behavior = 'circle';
-    /**
-     * The size of the label
-     */
+    this.icon = undefined;
+    this.iconFlip = undefined;
+    this.iconRotate = undefined;
     this.size = 'default';
-    /**
-     * Wether to keep the content on mobile
-     */
     this.keepMobileContent = false;
   }
   render() {
-    return (h(Host, { class: "p-label" },
-      this.icon && (h("p-icon", { variant: this.icon, flip: this.iconFlip, rotate: this.iconRotate })),
-      (this.behavior === 'circle' ||
-        this.behavior === 'combination') && (h("div", { class: "circle" })),
-      h("div", { class: "content" },
-        h("slot", null))));
+    return (h(Host, { class: "p-label" }, this.icon && (h("p-icon", { variant: this.icon, flip: this.iconFlip, rotate: this.iconRotate })), (this.behavior === 'circle' ||
+      this.behavior === 'combination') && (h("div", { class: "circle" })), h("div", { class: "content" }, h("slot", null))));
   }
   static get is() { return "p-label"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["label.component.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["label.component.css"]
-  }; }
-  static get properties() { return {
-    "variant": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "| 'positive'\n        | 'unbiased'\n        | 'negative'\n        | 'info'",
-        "resolved": "\"info\" | \"negative\" | \"positive\" | \"unbiased\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Variant of the label"
-      },
-      "attribute": "variant",
-      "reflect": true,
-      "defaultValue": "'info'"
-    },
-    "behavior": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "| 'icon'\n        | 'circle'\n        | 'combination'\n        | 'text'\n        | 'icon-only'",
-        "resolved": "\"circle\" | \"combination\" | \"icon\" | \"icon-only\" | \"text\"",
-        "references": {}
+  static get originalStyleUrls() {
+    return {
+      "$": ["label.component.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["label.component.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "variant": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "| 'positive'\n        | 'unbiased'\n        | 'negative'\n        | 'info'",
+          "resolved": "\"info\" | \"negative\" | \"positive\" | \"unbiased\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Variant of the label"
+        },
+        "attribute": "variant",
+        "reflect": true,
+        "defaultValue": "'info'"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Define the behavior of the label"
+      "behavior": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "| 'icon'\n        | 'circle'\n        | 'combination'\n        | 'text'\n        | 'icon-only'",
+          "resolved": "\"circle\" | \"combination\" | \"icon\" | \"icon-only\" | \"text\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Define the behavior of the label"
+        },
+        "attribute": "behavior",
+        "reflect": true,
+        "defaultValue": "'circle'"
       },
-      "attribute": "behavior",
-      "reflect": true,
-      "defaultValue": "'circle'"
-    },
-    "icon": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "IconVariant",
-        "resolved": "\"arrow\" | \"attachment\" | \"bread\" | \"calendar\" | \"camera\" | \"car\" | \"checklist\" | \"checkmark\" | \"chevron\" | \"clock\" | \"cogs\" | \"comment\" | \"document\" | \"download\" | \"envelope\" | \"explanation\" | \"eye\" | \"filter\" | \"folder\" | \"grid\" | \"headset\" | \"integration\" | \"list\" | \"location\" | \"megaphone\" | \"menu\" | \"minus\" | \"more\" | \"negative\" | \"pagination\" | \"payment\" | \"pencil\" | \"person\" | \"plus\" | \"question\" | \"receipt\" | \"report\" | \"search\" | \"settings\" | \"sick\" | \"signout\" | \"switch\" | \"tachometer\" | \"task\" | \"template\" | \"tool\" | \"trash\" | \"turn\" | \"upload\" | \"warning\"",
-        "references": {
-          "IconVariant": {
-            "location": "import",
-            "path": "../icon/icon.component"
+      "icon": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "IconVariant",
+          "resolved": "\"arrow\" | \"attachment\" | \"bread\" | \"calendar\" | \"camera\" | \"car\" | \"checklist\" | \"checkmark\" | \"chevron\" | \"clock\" | \"cogs\" | \"comment\" | \"document\" | \"download\" | \"envelope\" | \"explanation\" | \"eye\" | \"filter\" | \"folder\" | \"grid\" | \"headset\" | \"integration\" | \"list\" | \"location\" | \"megaphone\" | \"menu\" | \"minus\" | \"more\" | \"negative\" | \"pagination\" | \"payment\" | \"pencil\" | \"person\" | \"plus\" | \"question\" | \"receipt\" | \"report\" | \"search\" | \"settings\" | \"sick\" | \"signout\" | \"switch\" | \"tachometer\" | \"task\" | \"template\" | \"tool\" | \"trash\" | \"turn\" | \"upload\" | \"warning\"",
+          "references": {
+            "IconVariant": {
+              "location": "import",
+              "path": "../icon/icon.component"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Icon to show on the label"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Icon to show on the label"
+        },
+        "attribute": "icon",
+        "reflect": true
       },
-      "attribute": "icon",
-      "reflect": true
-    },
-    "iconFlip": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "IconFlipOptions",
-        "resolved": "\"horizontal\" | \"vertical\"",
-        "references": {
-          "IconFlipOptions": {
-            "location": "import",
-            "path": "../icon/icon.component"
+      "iconFlip": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "IconFlipOptions",
+          "resolved": "\"horizontal\" | \"vertical\"",
+          "references": {
+            "IconFlipOptions": {
+              "location": "import",
+              "path": "../icon/icon.component"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Icon flip"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Icon flip"
+        },
+        "attribute": "icon-flip",
+        "reflect": false
       },
-      "attribute": "icon-flip",
-      "reflect": false
-    },
-    "iconRotate": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "RotateOptions",
-        "resolved": "-135 | -180 | -225 | -25 | -270 | -315 | -45 | -90 | 0 | 135 | 180 | 225 | 25 | 270 | 315 | 45 | 90",
-        "references": {
-          "RotateOptions": {
-            "location": "import",
-            "path": "../../../types"
+      "iconRotate": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "RotateOptions",
+          "resolved": "-135 | -180 | -225 | -25 | -270 | -315 | -45 | -90 | 0 | 135 | 180 | 225 | 25 | 270 | 315 | 45 | 90",
+          "references": {
+            "RotateOptions": {
+              "location": "import",
+              "path": "../../../types"
+            }
           }
-        }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Icon rotate"
+        },
+        "attribute": "icon-rotate",
+        "reflect": false
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Icon rotate"
+      "size": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'small' | 'default'",
+          "resolved": "\"default\" | \"small\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The size of the label"
+        },
+        "attribute": "size",
+        "reflect": true,
+        "defaultValue": "'default'"
       },
-      "attribute": "icon-rotate",
-      "reflect": false
-    },
-    "size": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'small' | 'default'",
-        "resolved": "\"default\" | \"small\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The size of the label"
-      },
-      "attribute": "size",
-      "reflect": true,
-      "defaultValue": "'default'"
-    },
-    "keepMobileContent": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Wether to keep the content on mobile"
-      },
-      "attribute": "keep-mobile-content",
-      "reflect": true,
-      "defaultValue": "false"
-    }
-  }; }
+      "keepMobileContent": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Wether to keep the content on mobile"
+        },
+        "attribute": "keep-mobile-content",
+        "reflect": true,
+        "defaultValue": "false"
+      }
+    };
+  }
 }

package/dist/collection/components/atoms/layout/layout.component.css

@@ -1,73 +1 @@
-:host {
-  @apply grid h-screen w-screen content-start overflow-hidden;
-  grid-template-columns: 1fr;
-  grid-template-rows: repeat(1fr, 3);
-  gap: 0;
-  grid-template-areas: "sidebar" "topbar" "content";
-}
-@screen desktop-xs {
-  :host {
-    grid-template-columns: auto 1fr;
-    grid-template-rows: auto 1fr;
-    grid-template-areas: "topbar topbar" "sidebar content";
-  }
-}
-:host .topbar,
-:host .sidebar,
-:host .content {
-  @apply self-start;
-}
-:host .topbar {
-  grid-area: topbar;
-  @apply sticky w-full;
-  @apply order-2 desktop-sm:order-1;
-}
-:host .sidebar {
-  grid-area: sidebar;
-  @apply flex h-full box-border;
-  @apply w-sidebar-mobile desktop-sm:w-sidebar-desktop;
-  @apply order-1 desktop-sm:order-2;
-}
-:host .content {
-  grid-area: content;
-  @apply relative flex flex-col h-full overflow-y-auto overflow-x-hidden;
-  @apply order-3;
-  padding: 0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
-}
-:host .content .inner-content {
-  @apply relative pb-24;
-  @apply px-content-mobile-x py-content-mobile-y;
-  @apply desktop-xs:px-content-desktop-x desktop-xs:py-content-desktop-y;
-  @apply desktop-xs:w-content-desktop-xs desktop-sm:w-content-desktop-sm desktop:w-content-desktop desktop-lg:w-content-desktop-lg desktop-xl:w-content-desktop-xl;
-}
-
-:host(.variant-default) .content {
-  @apply flex-1;
-}
-
-:host(.variant-login) {
-  grid-template-areas: "topbar topbar" "content content";
-}
-@screen desktop-xs {
-  :host(.variant-login) {
-    grid-template-areas: "topbar topbar" "content sidebar";
-  }
-}
-:host(.variant-login) .sidebar {
-  @apply hidden desktop-xs:flex w-unset;
-  @apply order-3 p-2;
-  @apply flex-1 overflow-hidden;
-}
-:host(.variant-login) .sidebar .inner-content {
-  @apply p-2;
-}
-:host(.variant-login) .content {
-  @apply order-3 desktop-xs:order-2;
-  @apply items-center desktop-xs:justify-center;
-}
-:host(.variant-login) .content .inner-content {
-  @apply box-border;
-  @apply desktop-xs:py-0 desktop-xs:px-18;
-  @apply w-full tablet:w-content-desktop-login;
-  @apply pt-14 desktop-xs:pt-content-mobile-y;
-} .static{position:static!important}*{box-sizing:border-box}
+.relative{position:relative!important}.sticky{position:sticky!important}.order-2{order:2!important}.order-1{order:1!important}.order-3{order:3!important}.flex{display:flex!important}.grid{display:grid!important}.hidden{display:none!important}.h-screen{height:100vh!important}.h-full{height:100%!important}.w-screen{width:100vw!important}.w-full,.w-sidebar-mobile{width:100%!important}.flex-1{flex:1 1 0%!important}.flex-col{flex-direction:column!important}.content-start{align-content:flex-start!important}.items-center{align-items:center!important}.overflow-y-auto{overflow-y:auto!important}.px-content-mobile-x{padding-left:1rem!important;padding-right:1rem!important}.pt-14{padding-top:3.5rem!important}*{box-sizing:border-box}:host{align-content:flex-start;display:grid;gap:0;grid-template-areas:"sidebar" "topbar" "content";grid-template-columns:1fr;grid-template-rows:repeat(1fr,3);height:100vh;overflow:hidden;width:100vw}@media (min-width:64rem){:host{grid-template-areas:"topbar topbar" "sidebar content";grid-template-columns:auto 1fr;grid-template-rows:auto 1fr}}:host .content,:host .sidebar,:host .topbar{align-self:flex-start}:host .topbar{grid-area:topbar;order:2;position:sticky;width:100%}@media (min-width:80rem){:host .topbar{order:1}}:host .sidebar{box-sizing:border-box;display:flex;grid-area:sidebar;height:100%;order:1;width:100%}@media (min-width:80rem){:host .sidebar{order:2;width:15rem}}:host .content{display:flex;flex-direction:column;grid-area:content;height:100%;order:3;overflow-x:hidden;overflow-y:auto;padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);position:relative}:host .content .inner-content{padding:1.5rem 1rem;position:relative}@media (min-width:64rem){:host .content .inner-content{padding:2rem;width:100%}}@media (min-width:80rem){:host .content .inner-content{width:100%}}@media (min-width:85.375rem){:host .content .inner-content{width:69rem}}@media (min-width:90rem){:host .content .inner-content{width:69rem}}@media (min-width:120rem){:host .content .inner-content{width:69rem}}:host(.variant-default) .content{flex:1 1 0%}:host(.variant-login){grid-template-areas:"topbar topbar" "content content"}@media (min-width:64rem){:host(.variant-login){grid-template-areas:"topbar topbar" "content sidebar"}}:host(.variant-login) .sidebar{display:none;flex:1 1 0%;order:3;overflow:hidden;padding:.5rem;width:unset}@media (min-width:64rem){:host(.variant-login) .sidebar{display:flex}}:host(.variant-login) .sidebar .inner-content{padding:.5rem}:host(.variant-login) .content{align-items:center;order:3}@media (min-width:64rem){:host(.variant-login) .content{justify-content:center;order:2}}:host(.variant-login) .content .inner-content{box-sizing:border-box;padding-top:3.5rem;width:100%}@media (min-width:64rem){:host(.variant-login) .content .inner-content{padding:1.5rem 4.5rem 0}}@media (min-width:40rem){:host(.variant-login) .content .inner-content{width:30rem}}@media (min-width:64rem){.desktop-xs\:flex{display:flex!important}.desktop-xs\:w-content-desktop-xs{width:100%!important}.desktop-xs\:px-content-desktop-x{padding-left:2rem!important;padding-right:2rem!important}.desktop-xs\:py-0{padding-bottom:0!important;padding-top:0!important}}@media (min-width:80rem){.desktop-sm\:w-content-desktop-sm{width:100%!important}}@media (min-width:85.375rem){.desktop\:w-content-desktop{width:69rem!important}}@media (min-width:90rem){.desktop-lg\:w-content-desktop-lg{width:69rem!important}}.static{position:static!important}

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

@@ -1,47 +1,43 @@
-import { Component, h, Host, Prop } from '@stencil/core';
+import { h, Host } from '@stencil/core';
 export class Layout {
   constructor() {
-    /**
-     * Variant of the layout
-     */
     this.variant = 'default';
   }
   render() {
-    return (h(Host, { class: `p-layout variant-${this.variant}` },
-      h("div", { class: "topbar" },
-        h("slot", { name: "topbar" })),
-      h("div", { class: "sidebar" },
-        h("slot", { name: "sidebar" })),
-      h("div", { class: "content" },
-        h("div", { class: "inner-content" },
-          h("slot", { name: "content" })))));
+    return (h(Host, { class: `p-layout variant-${this.variant}` }, h("div", { class: "topbar" }, h("slot", { name: "topbar" })), h("div", { class: "sidebar" }, h("slot", { name: "sidebar" })), h("div", { class: "content" }, h("div", { class: "inner-content" }, h("slot", { name: "content" })))));
   }
   static get is() { return "p-layout"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["layout.component.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["layout.component.css"]
-  }; }
-  static get properties() { return {
-    "variant": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'default' | 'login'",
-        "resolved": "\"default\" | \"login\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Variant of the layout"
-      },
-      "attribute": "variant",
-      "reflect": false,
-      "defaultValue": "'default'"
-    }
-  }; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["layout.component.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["layout.component.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "variant": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'default' | 'login'",
+          "resolved": "\"default\" | \"login\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Variant of the layout"
+        },
+        "attribute": "variant",
+        "reflect": false,
+        "defaultValue": "'default'"
+      }
+    };
+  }
 }