@intellias/menu 1.0.0 → 1.0.4

package/components/user-picture/UserPicture.scss

@@ -1,62 +0,0 @@
-@use "sass:map";
-@import "../../scss/components/variables";
-
-.image-wrapper {
-    &.sm {
-        width: 35px;
-        height: 35px;
-        .user-image {
-            border: 1px solid map.get($intems-colors, "border");
-            &.anonymous {
-                font-size: $font-size-12;
-            }
-        }
-    }
-    &.md {
-        height: 44px;
-        width: 44px;
-        .user-image {
-            border: 1px solid map.get($intems-colors, "border");
-            &.anonymous {
-                font-size: $font-size-16;
-                color: map.get($intems-colors, "text-disable");
-            }
-        }
-    }
-    &.lg {
-        height: 96px;
-        width: 96px;
-    }
-    &.xl {
-        height: 128px;
-        width: 128px;
-        .user-image.anonymous {
-            font-size: $font-size-50;
-            color: map.get($intems-colors, "text-disable");
-        }
-    }
-    .user-image {
-        border: 2px solid map.get($intems-colors, "border");
-        border-radius: 50%;
-        overflow: hidden;
-        width: inherit;
-        height: inherit;
-
-        &img {
-            object-fit: cover;
-        }
-        &.anonymous {
-            background-color: map.get($intems-colors, "background");
-            font-size: $font-size-40;
-            color: map.get($intems-colors, "text-disable");
-            font-weight: 600;
-            text-transform: uppercase;
-            display: inline-flex;
-            justify-content: center;
-            align-items: center;
-        }
-    }
-    &.no-border .user-image {
-        border: none;
-    }
-}

package/components/user-picture/UserPicture.ts

@@ -1,105 +0,0 @@
-import { PropType } from "vue";
-import { VueLazyloadImage } from "vue-lazyload";
-import PublicInfoModel from "../../models/PublicInfoModel";
-
-enum Size {
-  sm = "sm",
-  md = "md",
-  lg = "lg",
-  xl = "xl",
-  full = "full",
-}
-
-interface IPictureOptions {
-  size: Size;
-  noBorder: boolean;
-}
-
-const OPTIONS: IPictureOptions = {
-  size: Size.md,
-  noBorder: false,
-};
-
-export interface IPictureModel {
-  avatar_url: string;
-  thumbnail_url: string;
-  first_name: string;
-  last_name: string;
-}
-const EMPTY_MODEL: IPictureModel = {
-  avatar_url: "",
-  first_name: "",
-  last_name: "",
-  thumbnail_url: "",
-};
-export default {
-  props: {
-    employee: {} as PublicInfoModel | IPictureModel,
-    options: {} as PropType<IPictureOptions>,
-  },
-  mounted(): void {
-    this.cOptions = { ...OPTIONS, ...this.options };
-    this.pictureModel = this.toPictureModel();
-  },
-  watch: {
-    employee: {
-      deep: true,
-      handler(newVal: IPictureModel, oldVal: IPictureModel): void {
-        if (newVal.avatar_url && newVal.avatar_url !== oldVal.avatar_url) {
-          this.anonymous = false;
-        }
-        this.pictureModel = this.toPictureModel();
-      },
-    },
-  },
-  computed: {
-    image(): VueLazyloadImage {
-      return {
-        src: this.imageUrl,
-        error: `not-image`,
-      } as VueLazyloadImage;
-    },
-    imageUrl(): string {
-      return [Size.sm, Size.md].includes(this.cOptions.size) &&
-        this.pictureModel.thumbnail_url
-        ? this.pictureModel.thumbnail_url
-        : this.pictureModel.avatar_url;
-    },
-    imageAlt(): string {
-      return `${this.pictureModel.first_name} ${this.pictureModel.last_name} avatar`;
-    },
-    employeeInitials(): string {
-      return `${
-        typeof this.pictureModel.first_name === "string"
-          ? this.pictureModel.first_name.substring(0, 1)
-          : ""
-      }${
-        typeof this.pictureModel.last_name === "string"
-          ? this.pictureModel.last_name.substring(0, 1)
-          : ""
-      }`;
-    },
-    border(): string {
-      return this.cOptions.noBorder ? "no-border" : "";
-    },
-  },
-  methods: {
-    replaceByAnonymous(): void {
-      this.anonymous = true;
-    },
-    toPictureModel(): IPictureModel {
-      if (this.employee === undefined) {
-        return EMPTY_MODEL as IPictureModel;
-      }
-
-      return { ...EMPTY_MODEL, ...this.employee };
-    },
-  },
-  data(): Record<string, unknown> {
-    return {
-      anonymous: false,
-      cOptions: {} as IPictureOptions,
-      pictureModel: {} as IPictureModel,
-    };
-  },
-};

package/components/user-picture/UserPicture.vue

@@ -1,23 +0,0 @@
-<template>
-  <div class="image-wrapper" :class="[cOptions.size, border]">
-    <img
-      v-if="imageUrl && !anonymous"
-      class="user-image"
-      v-lazy="image"
-      :alt="imageAlt"
-      @error="replaceByAnonymous"
-    />
-    <div v-else class="user-image anonymous" :title="imageAlt">
-      <span>{{ employeeInitials }}</span>
-    </div>
-  </div>
-</template>
-
-<script>
-import UserPicture from "./UserPicture";
-
-export default UserPicture;
-</script>
-<style lang="scss">
-@import "UserPicture";
-</style>

package/components/v-select-intems/VSelectIntems.ts

@@ -1,112 +0,0 @@
-import vSelect from "vue-select";
-import debounce from "lodash.debounce";
-import UserPicture from "../user-picture/UserPicture.vue";
-import UserListModel from "../give-kudos-form/models/UserListModel";
-import OpenIndicator from "./open-indicator/OpenIndicator.vue";
-
-export default {
-  components: { UserPicture, vSelect },
-  props: ["data", "value"],
-  methods: {
-    onInput(val): void {
-      this.$emit("input", val);
-    },
-    handlers(map, vm) {
-      const choose = (e) => {
-        e.preventDefault();
-
-        if (
-          vm.filteredOptions.length === 1 &&
-          vm.filteredOptions[0] instanceof UserListModel &&
-          vm.filteredOptions[0].disabled_option
-        ) {
-          return false;
-        }
-        vm.typeAheadSelect();
-      };
-
-      return {
-        ...map,
-        13: choose,
-      };
-    },
-    opened(): void {
-      this.$emit("open");
-
-      const comboboxEl = this.toggleElement;
-      const selectedEl = this.$el.getElementsByClassName("vs__selected")[0];
-      if (this.data.multiple || !comboboxEl || !selectedEl) {
-        return;
-      }
-
-      comboboxEl.style.height = `${selectedEl.offsetHeight + 9}px`;
-    },
-    search: debounce(function (val) {
-      if (val) {
-        this.$emit("search", val);
-      }
-    }, 500),
-    selected(val): void {
-      this.$emit("selected", val);
-    },
-    deselected(val): void {
-      this.$emit("deselected", val);
-    },
-    selecting(val): void {
-      this.$emit("selecting", val);
-    },
-    deselecting(val): void {
-      this.$emit("deselecting", val);
-    },
-    closed(): void {
-      this.$emit("close");
-
-      const comboboxEl = this.toggleElement;
-      if (this.data.multiple && !comboboxEl) {
-        return;
-      }
-
-      comboboxEl.style.height = null;
-    },
-  },
-  computed: {
-    toggleElement(): Element {
-      return this.$el.getElementsByClassName("vs__dropdown-toggle")[0];
-    },
-    filterBy() {
-      return this.data.filterBy
-        ? (
-            option: Record<string, unknown>,
-            label: string,
-            search: string
-          ): boolean => {
-            let searchString = "";
-            this.data.filterBy.forEach((field) => {
-              searchString +=
-                option[field] !== undefined ? ` ${option[field]}` : "";
-            });
-
-            return (
-              searchString.toLowerCase().indexOf(search.toLowerCase()) > -1
-            );
-          }
-        : undefined;
-    },
-    showOptionsWithAvatars(): boolean {
-      return this.data.class && this.data.class["select-with-avatars"];
-    },
-    customOption(): boolean {
-      return this.showOptionsWithAvatars;
-    },
-  },
-  data(): Record<string, unknown> {
-    return {
-      Deselect,
-      OpenIndicator,
-      attributes: {
-        ref: "openIndicator",
-        role: "presentation",
-      },
-    };
-  },
-};

package/components/v-select-intems/VSelectIntems.vue

@@ -1,68 +0,0 @@
-<template>
-  <v-select
-    :selectable="(item) => !item.disabled_option"
-    :value="value"
-    @input="onInput"
-    v-bind="data"
-    :components="{ OpenIndicator }"
-    v-bind:filterBy="filterBy"
-    :map-keydown="handlers"
-    @open="opened"
-    @close="closed"
-    @search="search"
-    @option:selected="selected"
-    @option:deselected="deselected"
-    @option:selecting="selecting"
-    @option:deselecting="deselecting"
-  >
-    <template
-      slot="selected-option"
-      v-if="showOptionsWithAvatars"
-      slot-scope="option"
-    >
-      <div class="option-with-image">
-        <user-picture
-          :employee="option"
-          :options="{ size: 'sm' }"
-        ></user-picture>
-        <div class="option-value">
-          <div class="label">{{ option[data.label] }}</div>
-          <div class="position">
-            {{ option.position }}
-          </div>
-        </div>
-      </div>
-    </template>
-    <template slot="option" slot-scope="option">
-      <div>
-        <user-picture
-          :employee="option"
-          :options="{ size: 'sm' }"
-        ></user-picture>
-        <span class="text-wrapper"> {{ option[data.label] }}</span>
-      </div>
-    </template>
-    <template slot="option" v-if="customOption" slot-scope="option">
-      <div class="option-with-image" v-if="showOptionsWithAvatars">
-        <user-picture
-          :employee="option"
-          :options="{ size: 'sm' }"
-        ></user-picture>
-        <div class="text-block">
-          <span class="text-name"> {{ option[data.label] }}</span>
-          <br />
-          <span class="text-position"> {{ option.position }}</span>
-        </div>
-      </div>
-    </template>
-
-    <template #list-footer>
-      <slot name="list-footer"></slot>
-    </template>
-  </v-select>
-</template>
-<script>
-import VSelectIntems from "./VSelectIntems";
-
-export default VSelectIntems;
-</script>

package/components/v-select-intems/open-indicator/OpenIndicator.vue

@@ -1,3 +0,0 @@
-<template>
-    <i  class="icon icon-small arrow-down"></i>
-</template>

package/dist/html/app.html

@@ -1,19 +0,0 @@
-Html Webpack Plugin:
-<pre>
-  TypeError: Cannot read properties of undefined (reading 'entry')
-  
-  - loader.js:4 eval
-    [app.html?.]/[html-webpack-plugin]/lib/loader.js:4:45
-  
-  - loader.js:9 module.exports
-    [app.html?.]/[html-webpack-plugin]/lib/loader.js:9:3
-  
-  - index.js:284 
-    [intems-menu]/[html-webpack-plugin]/index.js:284:18
-  
-  - runMicrotasks
-  
-  - task_queues:96 processTicksAndRejections
-    node:internal/process/task_queues:96:5
-  
-</pre>

package/dist/html/styles.html

@@ -1 +0,0 @@
-<link href="/css/main.css" rel="stylesheet">

package/helpers/GeneralHelper.ts

@@ -1,61 +0,0 @@
-import axios from "axios";
-import { Collection } from "collect.js";
-
-export function getRandomIntegerBetween(min: number, max: number): number {
-  const randomBuffer = new Uint32Array(1);
-
-  window.crypto.getRandomValues(randomBuffer);
-
-  const randomNumber = randomBuffer[0] / (0xffffffff + 1);
-
-  return Math.floor(randomNumber * (max - min + 1)) + min;
-}
-
-export function sortObjectByKeysCaseInsensitive(
-  object: unknown
-): Record<string, unknown> {
-  return (object instanceof Collection ? object : Object.keys(object))
-    .sort((a, b) => a.localeCompare(b))
-    .reduce((sorted, key) => {
-      sorted[key] = object[key];
-      return sorted;
-    }, {});
-}
-
-export function downloadFile(filePath: string, fileName?: string): void {
-  axios({
-    url: filePath,
-    method: "GET",
-    responseType: "blob",
-  }).then((response) => {
-    const fileURL = window.URL.createObjectURL(new Blob([response.data]));
-    const fileLink = document.createElement("a");
-
-    fileLink.href = fileURL;
-    fileLink.setAttribute(
-      "download",
-      fileName || filePath.replace(/^.*[\\\/]/, "")
-    );
-    document.body.appendChild(fileLink);
-
-    fileLink.click();
-  });
-}
-
-export function postForm(url: string, data?: Record<string, string>): void {
-  const form = document.createElement("form");
-  form.method = "POST";
-  form.action = url;
-
-  Object.entries(data).forEach(([key, value]: [key: string, value: string]) => {
-    const input = document.createElement("input");
-    input.type = "hidden";
-    input.name = key;
-    input.value = value;
-    form.append(input);
-  });
-
-  document.body.appendChild(form);
-
-  form.submit();
-}

package/helpers/PublisherSubscriber.ts

@@ -1,34 +0,0 @@
-// Publisher-Subscriber pattern interface
-type Callback = (data: unknown) => void;
-type Subscriber<Event> = Map<Event, Set<Callback>>;
-
-export default abstract class PublisherSubscriber<Event> {
-  protected subscribers: Map<string, Subscriber<Event>> = new Map();
-
-  subscribe(event: Event, callback: Callback, context = ""): void {
-    if (!this.subscribers.has(context)) {
-      this.createSubscriber(context);
-    }
-    if (!this.subscribers.get(context).has(event)) {
-      this.createEvent(context, event);
-    }
-    this.subscribers.get(context).get(event).add(callback);
-  }
-
-  protected createSubscriber(context: string): void {
-    this.subscribers.set(context, new Map());
-  }
-
-  protected createEvent(context: string, event: Event): void {
-    this.subscribers.get(context).set(event, new Set());
-  }
-
-  protected publish(event: Event, data: unknown, context = ""): void {
-    const subscriber = this.subscribers.get(context);
-    if (subscriber && subscriber.has(event)) {
-      subscriber.get(event).forEach((callback) => {
-        callback(data);
-      });
-    }
-  }
-}

package/helpers/QueryFilter.ts

@@ -1,204 +0,0 @@
-import { Moment } from "moment";
-
-enum SortDirection {
-  asc = "asc",
-  desc = "desc",
-}
-const MAX_ITEMS_ON_PAGE = 25;
-export default class QueryFilter {
-  private query = {};
-  max_on_page = MAX_ITEMS_ON_PAGE as number;
-  total = undefined as number;
-  end_reached = false as boolean;
-  loading = false as boolean;
-
-  equal(key: string, value: string | number | Moment): this {
-    if (value) {
-      this.query[`${key}$eq`] = value;
-    }
-
-    return this;
-  }
-
-  custom(
-    key: string,
-    value: string | number | boolean | Moment | string[]
-  ): this {
-    if (value !== null) {
-      this.query[key] = value;
-    }
-
-    return this;
-  }
-
-  scope(key: string, value: string | number | Moment): this {
-    if (value) {
-      this.query[`${key}$scope`] = value;
-    }
-
-    return this;
-  }
-
-  jsonContains(key: string, value: string | number | Moment): this {
-    if (value) {
-      this.query[`${key}$jc`] = value;
-    }
-
-    return this;
-  }
-
-  notEqual(key: string, value: string | number | Moment): this {
-    if (value) {
-      this.query[`${key}$neq`] = value;
-    }
-
-    return this;
-  }
-
-  gte(key: string, value: string | number | Moment): this {
-    if (value) {
-      this.query[`${key}$gte`] = value;
-    }
-
-    return this;
-  }
-
-  lte(key: string, value: string | number | Moment): this {
-    if (value) {
-      this.query[`${key}$lte`] = value;
-    }
-
-    return this;
-  }
-
-  gt(key: string, value: string | number | Moment): this {
-    if (value) {
-      this.query[`${key}$gt`] = value;
-    }
-
-    return this;
-  }
-
-  lt(key: string, value: string | number | Moment): this {
-    if (value) {
-      this.query[`${key}$lt`] = value;
-    }
-
-    return this;
-  }
-
-  like(key: string, value: string | number | Moment): this {
-    if (value) {
-      this.query[`${key}$like`] = value;
-    }
-
-    return this;
-  }
-
-  offset(offset: number): this {
-    this.query[`@offset`] = offset;
-
-    return this;
-  }
-
-  take(take: number = this.max_on_page): this {
-    this.query[`@take`] = take;
-
-    return this;
-  }
-
-  page(page: number | null, max_on_page = this.max_on_page): this {
-    if (page) {
-      this.offset(page * max_on_page - max_on_page);
-      this.take(max_on_page);
-      this.custom("page", page);
-    }
-
-    return this;
-  }
-
-  firstPage(): this {
-    this.end_reached = false;
-    this.page(1);
-
-    return this;
-  }
-
-  unsetPagination(): this {
-    this.end_reached = false;
-    this.offset(undefined);
-
-    return this;
-  }
-
-  nextPage(): this {
-    if (this.query[`@offset`] !== undefined) {
-      this.offset(this.query[`@offset`] + this.max_on_page);
-    } else {
-      this.offset(0);
-    }
-    this.take(this.max_on_page);
-
-    return this;
-  }
-
-  unlimited(): this {
-    this.take(null);
-    this.offset(null);
-    this.page(null);
-
-    return this;
-  }
-
-  sort(key: number, direction: SortDirection = SortDirection.asc): this {
-    this.query[`@sort,${direction}`] = key;
-
-    return this;
-  }
-
-  in(key: string, values: Array<string | number | Moment>): this {
-    if (values) {
-      this.query[`${key}$in`] = values.join(",");
-    }
-
-    return this;
-  }
-
-  notIn(key: string, values: Array<string | number | Moment>): this {
-    if (values) {
-      this.query[`${key}$nin`] = values.join(",");
-    }
-
-    return this;
-  }
-
-  endList(): void {
-    this.end_reached = true;
-  }
-
-  startLoading(): void {
-    this.loading = true;
-  }
-
-  endLoading(): void {
-    this.loading = false;
-  }
-
-  maxOnPage(max_on_page: number): this {
-    this.max_on_page = max_on_page;
-
-    return this;
-  }
-
-  getKey(key: string): unknown {
-    return this.query[key];
-  }
-
-  clone(): QueryFilter {
-    return Object.assign(Object.create(Object.getPrototypeOf(this)), this);
-  }
-
-  toObject(): Record<string, unknown> {
-    return this.query;
-  }
-}