wj-elements 0.1.76 → 0.1.77

package/dist/light.css

@@ -399,7 +399,7 @@
   --wje-orgchart-item-hover-background: var(--wje-color-contrast-3);
   --wje-orgchart-item-highlight-border: 1px solid blue;
   --wje-orgchart-item-hover-border: 1px solid red;
-  --wje-orgchart-item-expander-size: 0.75rem;
+  --wje-orgchart-item-expander-size: .75rem;
 
   /* Orgchart - Group */
   --wje-orgchart-group-width: auto;

package/dist/wje-element.js

@@ -161,16 +161,36 @@ class UniversalService {
 }
 class WjePermissionsApi {
   constructor() {
+    this._permissionKey = "permissions";
   }
+  static set permissionKey(value) {
+    this._permissionKey = value || "permissions";
+  }
+  static get permissionKey() {
+    return this._permissionKey;
+  }
+  static set permissions(value) {
+    window.localStorage.setItem(this._permissionKey, value);
+  }
+  /**
+   * Returns the permissions.
+   * @returns {*}
+   */
   static get permissions() {
-    return [
-      ...intranet.storage().getItem("permissions", "settings") || [],
-      ...intranet.storage().getItem("globalPermissions", "settings") || []
-    ];
+    return window.localStorage.getItem(this._permissionKey) || [];
   }
+  /**
+   * Checks if the permission is included.
+   * @param key
+   * @returns {*}
+   */
   static includesKey(key) {
     return WjePermissionsApi.permissions.includes(key);
   }
+  /**
+   * Returns the keys for the permission check.
+   * @returns {*[]}
+   */
   static getKeys() {
     let key = [];
     if (this.hasAttribute("permission-check")) {
@@ -178,9 +198,17 @@ class WjePermissionsApi {
     }
     return key;
   }
+  /**
+   * Checks if the component should be shown.
+   * @returns {*}
+   */
   static shouldShow() {
     return this.hasAttribute("show") && JSON.parse(this.getAttribute("show"));
   }
+  /**
+   * Checks if the permission is fulfilled.
+   * @returns {*}
+   */
   static isPermissionFulfilled() {
     return WjePermissionsApi.getKeys.bind(this)().some((perm) => WjePermissionsApi.permissions.includes(perm)) || WjePermissionsApi.shouldShow.bind(this)();
   }

package/dist/wje-master.js

@@ -5,6 +5,7 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 import WJElement, { event } from "./wje-element.js";
+import { WjePermissionsApi } from "./wje-element.js";
 import { defaultStoreActions, store } from "./wje-store.js";
 import { b, w } from "./router-links-F7MJWhZi.js";
 import { fetchAndParseCSS } from "./wje-fetchAndParseCSS.js";
@@ -5360,6 +5361,7 @@ export {
   default84 as Tooltip,
   default85 as VisuallyHidden,
   WJElement,
+  WjePermissionsApi,
   b as bindRouterLinks,
   defaultStoreActions,
   event,

package/dist/wje-orgchart-group.js

@@ -4,7 +4,7 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-import WJElement from "./wje-element.js";
+import WJElement, { event } from "./wje-element.js";
 const styles = ":host {\n    text-align: center;\n    list-style-type: none;\n    position: relative;\n    padding: var(--wje-orgchart-group-height-line) 0 0 0;\n    transition: all 0.5s;\n\n    &::before, &::after {\n        content: '';\n        position: absolute;\n        top: 0;\n        right: 50%;\n        border-top: 1px solid var(--wje-border-color);\n        width: 50%;\n        height: var(--wje-orgchart-group-height-line);\n    }\n\n    &::after {\n        right: auto;\n        left: 50%;\n        border-left: 1px solid var(--wje-border-color);\n    }\n\n    wje-card::part(native) {\n        box-sizing: border-box;\n        padding: var(--wje-orgchart-group-padding);\n    }\n\n    wje-card h4 {\n        margin: 0;\n    }\n    wje-card .items {\n        display: flex;\n    }\n\n    .orgchart-group {\n        display: flex;\n        flex-direction: column;\n        wje-card {\n            margin: 0 auto;\n            width: var(--wje-orgchart-group-width);\n        }\n    }\n}\n\n:host(:only-child)::after, :host(:only-child)::before {\n    display: none;\n}\n\n:host(:only-child) {\n    padding-top: 0;\n}\n\n:host(:first-child)::before,\n:host(:last-child)::after {\n    border: 0 none;\n}\n\n:host(:last-child)::before {\n    border-right: 1px solid var(--wje-border-color);\n    border-radius: 0 var(--wje-orgchart-group-border-radius) 0 0;\n}\n\n:host(:first-child)::after {\n    border-radius: var(--wje-orgchart-group-border-radius) 0 0 0;\n}";
 class OrgchartGroup extends WJElement {
   /**
@@ -57,8 +57,23 @@ class OrgchartGroup extends WJElement {
     card.appendChild(items);
     native.appendChild(card);
     fragment.appendChild(native);
+    this.card = card;
     return fragment;
   }
+  /**
+   * After Draws the component.
+   *
+   * @param {Object} context - The context for drawing.
+   * @param {Object} store - The store for drawing.
+   * @param {Object} params - The parameters for drawing.
+   * @returns {DocumentFragment}
+   */
+  afterDraw(context, store, params) {
+    this.card.addEventListener("click", (e) => {
+      e.stopPropagation();
+      event.dispatchCustomEvent(this.card, "wje-orgchart-group:click", { target: this });
+    });
+  }
 }
 OrgchartGroup.define("wje-orgchart-group", OrgchartGroup);
 export {

package/dist/wje-orgchart-item.js

@@ -41,7 +41,7 @@ const styles = `:host {
         font-size: 8px;
         line-height: 1;
         box-sizing: border-box;
-        transform: translate(-50%, 6px);
+        transform: translate(-50%, calc(var(--wje-orgchart-item-expander-size) / 2));
         padding-bottom: 1px;
         cursor: pointer;
         z-index: 999;

package/dist/wje-orgchart.js

@@ -5,7 +5,7 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 import WJElement from "./wje-element.js";
-const styles = "\n\n* {margin: 0; padding: 0;}\n\n:host {\n    position: relative;\n    .native-orgchart {\n        padding-top: var(--wje-orgchart-height-line);\n        display: flex;\n    }\n\n    &::before {\n        content: '';\n        position: absolute;\n        top: 0;\n        left: 50%;\n        border-left: 1px solid var(--wje-border-color);\n        width: 0;\n        height: var(--wje-orgchart-height-line);\n    }\n}\n\n";
+const styles = "* {margin: 0; padding: 0;}\n\n:host {\n    position: relative;\n    .native-orgchart {\n        padding-top: var(--wje-orgchart-height-line);\n        display: flex;\n        justify-content: center;\n    }\n\n    &::before {\n        content: '';\n        position: absolute;\n        top: 0;\n        left: 50%;\n        border-left: 1px solid var(--wje-border-color);\n        width: 0;\n        height: var(--wje-orgchart-height-line);\n    }\n}\n\n";
 class Orgchart extends WJElement {
   /**
    * Creates an instance of Orgchart.

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "wj-elements",
   "description": "WebJET Elements is a modern set of user interface tools harnessing the power of web components designed to simplify web application development.",
-  "version": "0.1.76",
+  "version": "0.1.77",
   "homepage": "https://github.com/lencys/wj-elements",
   "author": "Lukáš Ondrejček <lukas.ondrejcek@gmail.com>",
   "license": "MIT",