@eturnity/eturnity_reusable_components 8.37.1-EPDM-16633.2 → 8.37.1-EPDM-16320.0

package/dist/main.es748.js

@@ -0,0 +1,25 @@
+let supported;
+let perf;
+function isPerformanceSupported() {
+  var _a;
+  if (supported !== void 0) {
+    return supported;
+  }
+  if (typeof window !== "undefined" && window.performance) {
+    supported = true;
+    perf = window.performance;
+  } else if (typeof globalThis !== "undefined" && ((_a = globalThis.perf_hooks) === null || _a === void 0 ? void 0 : _a.performance)) {
+    supported = true;
+    perf = globalThis.perf_hooks.performance;
+  } else {
+    supported = false;
+  }
+  return supported;
+}
+function now() {
+  return isPerformanceSupported() ? perf.now() : Date.now();
+}
+export {
+  isPerformanceSupported,
+  now
+};

package/dist/main.es749.js

@@ -0,0 +1,64 @@
+function makeMap(str, expectsLowerCase) {
+  const map = /* @__PURE__ */ Object.create(null);
+  const list = str.split(",");
+  for (let i = 0; i < list.length; i++) {
+    map[list[i]] = true;
+  }
+  return expectsLowerCase ? (val) => !!map[val.toLowerCase()] : (val) => !!map[val];
+}
+!!(process.env.NODE_ENV !== "production") ? Object.freeze({}) : {};
+!!(process.env.NODE_ENV !== "production") ? Object.freeze([]) : [];
+const NOOP = () => {
+};
+const extend = Object.assign;
+const hasOwnProperty = Object.prototype.hasOwnProperty;
+const hasOwn = (val, key) => hasOwnProperty.call(val, key);
+const isArray = Array.isArray;
+const isMap = (val) => toTypeString(val) === "[object Map]";
+const isFunction = (val) => typeof val === "function";
+const isString = (val) => typeof val === "string";
+const isSymbol = (val) => typeof val === "symbol";
+const isObject = (val) => val !== null && typeof val === "object";
+const objectToString = Object.prototype.toString;
+const toTypeString = (value) => objectToString.call(value);
+const toRawType = (value) => {
+  return toTypeString(value).slice(8, -1);
+};
+const isIntegerKey = (key) => isString(key) && key !== "NaN" && key[0] !== "-" && "" + parseInt(key, 10) === key;
+const cacheStringFunction = (fn) => {
+  const cache = /* @__PURE__ */ Object.create(null);
+  return (str) => {
+    const hit = cache[str];
+    return hit || (cache[str] = fn(str));
+  };
+};
+const capitalize = cacheStringFunction(
+  (str) => str.charAt(0).toUpperCase() + str.slice(1)
+);
+const hasChanged = (value, oldValue) => !Object.is(value, oldValue);
+const def = (obj, key, value) => {
+  Object.defineProperty(obj, key, {
+    configurable: true,
+    enumerable: false,
+    value
+  });
+};
+export {
+  NOOP,
+  capitalize,
+  def,
+  extend,
+  hasChanged,
+  hasOwn,
+  isArray,
+  isFunction,
+  isIntegerKey,
+  isMap,
+  isObject,
+  isString,
+  isSymbol,
+  makeMap,
+  objectToString,
+  toRawType,
+  toTypeString
+};

package/dist/main.es9.js

@@ -1,10 +1,10 @@
 import styled from "./main.es7.js";
-import _sfc_main$1 from "./main.es17.js";
+import _sfc_main$1 from "./main.es26.js";
 import theme from "./main.es8.js";
 import "./main.es3.js";
 import _export_sfc from "./main.es11.js";
 import { resolveComponent, openBlock, createBlock, withCtx, createVNode, createTextVNode } from "./main.es6.js";
-import { toDisplayString } from "./main.es16.js";
+import { toDisplayString } from "./main.es24.js";
 const TagContainer = styled.div`
     display: inline-flex;
     align-items: baseline;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eturnity/eturnity_reusable_components",
-  "version": "8.37.1-EPDM-16633.2",
+  "version": "8.37.1-EPDM-16320.0",
   "files": [
     "dist",
     "src"

package/src/assets/svgIcons/accept_document.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+  <path d="M11.3789 1.5C11.9756 1.50006 12.5478 1.73728 12.9697 2.15918L17.3408 6.53027C17.7627 6.95218 17.9999 7.52444 18 8.12109V13.5H16.5V9H13.5C12.2574 9 11.25 7.99264 11.25 6.75V3H5.25C4.83579 3 4.5 3.33579 4.5 3.75V20.25C4.5 20.6642 4.83579 21 5.25 21H12V22.5H5.25C4.00736 22.5 3 21.4926 3 20.25V3.75C3 2.50736 4.00736 1.5 5.25 1.5H11.3789ZM21.2197 12.9697C21.5126 12.6768 21.9874 12.6768 22.2803 12.9697C22.5732 13.2626 22.5732 13.7374 22.2803 14.0303L15.5303 20.7803C15.3813 20.9292 15.1767 21.008 14.9663 20.9985C14.756 20.989 14.5592 20.8921 14.4243 20.7305L10.6743 16.2305C10.4093 15.9124 10.4517 15.4396 10.7695 15.1743C11.0876 14.9093 11.5604 14.9517 11.8257 15.2695L15.0498 19.1382L21.2197 12.9697ZM12.75 6.75C12.75 7.16421 13.0858 7.5 13.5 7.5H16.1895L12.75 4.06055V6.75Z" fill="white"/>
+</svg>

package/src/assets/svgIcons/menu.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+  <path d="M21 17.25C21.4142 17.25 21.75 17.5858 21.75 18C21.75 18.4142 21.4142 18.75 21 18.75H3C2.58579 18.75 2.25 18.4142 2.25 18C2.25 17.5858 2.58579 17.25 3 17.25H21ZM15 11.25C15.4142 11.25 15.75 11.5858 15.75 12C15.75 12.4142 15.4142 12.75 15 12.75H3C2.58579 12.75 2.25 12.4142 2.25 12C2.25 11.5858 2.58579 11.25 3 11.25H15ZM21 5.25C21.4142 5.25 21.75 5.58579 21.75 6C21.75 6.41421 21.4142 6.75 21 6.75H3C2.58579 6.75 2.25 6.41421 2.25 6C2.25 5.58579 2.58579 5.25 3 5.25H21Z" fill="#263238"/>
+</svg>

package/src/assets/svgIcons/phone.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+  <path d="M4.97755 2.24316C5.75791 1.84846 6.68009 1.84849 7.46046 2.24316C7.87984 2.45528 8.24512 2.83446 8.73487 3.32421L8.9297 3.51904C9.25214 3.84147 9.4986 4.08256 9.66652 4.34082C10.259 5.25222 10.259 6.42649 9.66652 7.33789C9.49859 7.59616 9.25215 7.83721 8.9297 8.15966C8.86927 8.2201 8.83665 8.25399 8.81251 8.27978C8.80241 8.29058 8.79649 8.29671 8.79347 8.30029C8.79233 8.30165 8.79098 8.30266 8.79054 8.30322V8.30468C8.7546 8.35487 8.73529 8.46062 8.75245 8.52002C8.75327 8.52281 8.75606 8.52771 8.76417 8.54638C8.77514 8.5716 8.78944 8.60454 8.8213 8.67089C9.48112 10.0452 10.3817 11.3342 11.5225 12.4751C12.6634 13.616 13.9523 14.5164 15.3267 15.1763C15.3934 15.2083 15.4259 15.2239 15.4512 15.2349C15.4693 15.2427 15.4747 15.2443 15.4776 15.2451C15.5367 15.2624 15.6424 15.2442 15.6929 15.2085C15.6933 15.2082 15.6958 15.2068 15.6973 15.2056C15.7008 15.2026 15.7079 15.1957 15.7192 15.1851C15.745 15.161 15.7778 15.128 15.8379 15.0679C16.1604 14.7454 16.4014 14.499 16.6597 14.3311C17.5712 13.7384 18.7467 13.7384 19.6582 14.3311C19.9164 14.499 20.1576 14.7455 20.48 15.0679L20.6748 15.2627C21.1644 15.7523 21.5422 16.1179 21.7544 16.5371C22.1491 17.3175 22.1491 18.2396 21.7544 19.02C21.5423 19.4393 21.1644 19.8048 20.6748 20.2944L20.5166 20.4526C20.0103 20.9589 19.6682 21.3085 19.1997 21.5718C18.6874 21.8596 17.9387 22.054 17.3511 22.0522C16.8193 22.0506 16.4401 21.9391 15.8892 21.7827C12.7361 20.8878 9.76089 19.1992 7.28028 16.7187C4.79956 14.238 3.10985 11.2617 2.21486 8.10839C2.05851 7.55757 1.94691 7.17832 1.94532 6.64648C1.94361 6.05901 2.13813 5.3116 2.42579 4.79931C2.68919 4.33042 3.03972 3.98763 3.5464 3.48095L3.70314 3.32421C4.19274 2.83461 4.55834 2.45532 4.97755 2.24316ZM6.7837 3.58203C6.42912 3.40268 6.01041 3.40283 5.65577 3.58203C5.50439 3.6586 5.33681 3.81163 4.76368 4.38476L4.60694 4.5415C4.05462 5.09382 3.87496 5.2822 3.7339 5.5332C3.57287 5.81985 3.44436 6.31328 3.44532 6.64209C3.4462 6.93598 3.49373 7.1219 3.65773 7.6997C4.48466 10.613 6.04579 13.3616 8.34083 15.6567C10.6361 17.952 13.3858 19.5129 16.2993 20.3398C16.8765 20.5036 17.0619 20.5513 17.3555 20.5522C17.6843 20.5532 18.1777 20.4247 18.4644 20.2637C18.7155 20.1226 18.9036 19.9431 19.4561 19.3906L19.6143 19.2339C20.1866 18.6616 20.3389 18.4945 20.4155 18.3433C20.595 17.9885 20.595 17.5686 20.4155 17.2139C20.3388 17.0627 20.1863 16.8953 19.6143 16.3232L19.4194 16.1284C19.0428 15.7517 18.9326 15.65 18.8394 15.5894C18.4251 15.3201 17.8913 15.32 17.4771 15.5894C17.3839 15.65 17.2743 15.7525 16.8984 16.1284C16.8002 16.2266 16.6952 16.3356 16.5674 16.4272C16.1429 16.7312 15.5599 16.831 15.0586 16.6851C14.9092 16.6415 14.7882 16.5814 14.6777 16.5283C13.1529 15.7962 11.7242 14.7979 10.4619 13.5356C9.19979 12.2734 8.20133 10.8446 7.46925 9.31982C7.41632 9.2096 7.35598 9.08943 7.31251 8.94043C7.16639 8.43914 7.26641 7.85622 7.57032 7.43164C7.66208 7.30349 7.77076 7.19751 7.86915 7.09912C8.24571 6.72255 8.34906 6.61374 8.40968 6.5205C8.6788 6.10635 8.67877 5.57236 8.40968 5.1582C8.34906 5.06497 8.24568 4.95612 7.86915 4.57959L7.67433 4.38476C7.10152 3.81195 6.93502 3.65864 6.7837 3.58203Z" fill="#595A5E"/>
+</svg>

package/src/components/buttons/buttonIcon/index.vue

@@ -90,7 +90,7 @@
 
   import Icon from '../../icon'
   import styled from 'vue3-styled-components'
-  import Theme from '@/assets/theme'
+  import Theme from '../../../assets/theme'
 
   const PageContainer = styled.div`
     position: relative;
@@ -148,15 +148,17 @@
     overflow: visible;
     min-width: ${(props) => props.minWidth || 'initial'};
 
-    &:hover {
-      background-color: ${(props) =>
-        props.isDisabled
-          ? props.theme.mainButton[props.appTheme][props.type][props.variant]
-              .disabled.backgroundColor
-          : props.customColor
-          ? props.customColor
-          : props.theme.mainButton[props.appTheme][props.type][props.variant]
-              .hover.backgroundColor};
+    @media (hover: hover) and (pointer: fine) {
+      &:hover {
+        background-color: ${(props) =>
+          props.isDisabled
+            ? props.theme.mainButton[props.appTheme][props.type][props.variant]
+                .disabled.backgroundColor
+            : props.customColor
+            ? props.customColor
+            : props.theme.mainButton[props.appTheme][props.type][props.variant]
+                .hover.backgroundColor};
+      }
     }
 
     &:active {

package/src/components/buttons/mainButton/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <PageContainer>
+  <PageContainer :height="height" :width="width">
     <ButtonContainer
       :id="id"
       :app-theme="appTheme"
@@ -47,7 +47,10 @@
   import Icon from '../../icon'
   import theme from '../../../assets/theme'
 
-  const PageContainer = styled.div``
+  const PageContainer = styled('div', { height: String, width: String })`
+    height: ${(props) => props.height};
+    width: ${(props) => props.width};
+  `
 
   const ButtonAttrs = {
     type: String,
@@ -101,13 +104,16 @@
     height: ${(props) => props.height};
     line-height: 1;
     width: ${(props) => props.width};
-    &:hover {
-      background-color: ${(props) =>
-        props.isDisabled
-          ? props.theme.mainButton[props.appTheme][props.type][props.variant]
-              .disabled.backgroundColor
-          : props.theme.mainButton[props.appTheme][props.type][props.variant]
-              .hover.backgroundColor};
+
+    @media (hover: hover) and (pointer: fine) {
+      &:hover {
+        background-color: ${(props) =>
+          props.isDisabled
+            ? props.theme.mainButton[props.appTheme][props.type][props.variant]
+                .disabled.backgroundColor
+            : props.theme.mainButton[props.appTheme][props.type][props.variant]
+                .hover.backgroundColor};
+      }
     }
 
     &:active {

package/src/components/filter/index.vue

@@ -3,7 +3,6 @@
     <ParentDropdown
       :dropdown-text="dropdownText ? dropdownText : 'Default view'"
       :is-open="isDropdownOpen"
-      :number-of-filters-applied="numberOfFiltersApplied"
       @on-toggle="onToggleDropdown()"
     />
     <FilterSettings
@@ -75,11 +74,6 @@
       closeDropdown: {
         required: false,
       },
-      activeFilterView: {
-        type: Object,
-        default: null,
-        required: false,
-      },
     },
     data() {
       return {
@@ -88,14 +82,6 @@
         preventOutsideClick: false,
       }
     },
-    computed: {
-      numberOfFiltersApplied() {
-        const filterColumns = this.activeFilterView?.columns?.filter(
-          (column) => column.custom_view_filter !== null
-        )
-        return filterColumns?.length > 0 ? filterColumns.length : 0
-      },
-    },
     watch: {
       closeDropdown(newVal) {
         if (newVal) {

package/src/components/filter/parentDropdown.vue

@@ -6,9 +6,6 @@
     <TitleWrapper :is-open="isOpen">
       <TitleText>
         {{ dropdownText }}
-        <Counter v-if="numberOfFiltersApplied">
-          {{ numberOfFiltersApplied }}
-        </Counter>
       </TitleText>
       <ArrowWrapper>
         <Icon
@@ -46,32 +43,18 @@
     grid-template-columns: auto auto;
     align-items: center;
     justify-items: center;
-    grid-gap: 8px;
+    grid-gap: 10px;
     border: 1px solid ${(props) => props.theme.colors.grey4};
     background-color: ${(props) =>
       props.isOpen ? props.theme.colors.grey5 : props.theme.colors.white};
     border-left: none;
     border-radius: 0px 4px 4px 0px;
-    padding: 6px 10px;
+    padding: 6px 14px;
     user-select: none;
   `
 
   const TitleText = styled.div`
     font-size: 13px;
-    display: flex;
-    align-items: center;
-    gap: 8px;
-  `
-
-  const Counter = styled.div`
-    line-height: 18px;
-    border-radius: 8px;
-    padding: 0 8px;
-    background: ${(props) => props.theme.semanticColors.purple['100']};
-    color: ${(props) => props.theme.colors.primary};
-    display: flex;
-    align-items: center;
-    justify-content: center;
   `
 
   const ArrowWrapper = styled.div`
@@ -92,7 +75,6 @@
       IconWrapper,
       TitleWrapper,
       TitleText,
-      Counter,
       ArrowWrapper,
     },
     props: {
@@ -104,11 +86,6 @@
         required: true,
         default: 'View',
       },
-      numberOfFiltersApplied: {
-        required: false,
-        default: 0,
-        type: Number,
-      },
     },
   }
 </script>

package/src/components/modals/modal/index.vue

@@ -5,13 +5,17 @@
     :add-padding-top="addPaddingTop"
     :backdrop="backdrop"
     class="rc-modal-wrapper"
+    :disable-default-media-query="disableDefaultMediaQuery"
     :full-screen="fullScreen"
     :is-open="isOpen"
     :position="position"
   >
     <ModalContainer
       v-if="isOpen"
+      :disable-default-media-query="disableDefaultMediaQuery"
       :is-loading="isLoading"
+      :max-width="maxWidth"
+      :modal-container-alignment="modalContainerAlignment"
       :overflow="overflowRule"
       @click="onClickModalContainer"
     >
@@ -51,6 +55,7 @@
     position: String,
     addPaddingTop: Boolean,
     fullScreen: Boolean,
+    disableDefaultMediaQuery: Boolean,
   }
   const PageWrapper = styled('div', pageAttrs)`
   position: ${(props) => props.position}
@@ -69,22 +74,30 @@
   overflow: auto;
   padding-top: ${(props) => (props.addPaddingTop ? '80px' : '0')};
 
-    @media (max-width: 425px) {
+  ${(props) =>
+    !props.disableDefaultMediaQuery &&
+    `@media (max-width: 425px) {
       background: white;
-    }
+    }`}
   `
 
-  const modalContainerAttrs = { overflow: String, isLoading: Boolean }
+  const modalContainerAttrs = {
+    overflow: String,
+    isLoading: Boolean,
+    disableDefaultMediaQuery: Boolean,
+    maxWidth: String,
+    modalContainerAlignment: Object,
+  }
   const ModalContainer = styled('div', modalContainerAttrs)`
-    align-self: center;
-    justify-self: center;
+    align-self: ${(props) => props.modalContainerAlignment.alignSelf};
+    justify-self: ${(props) => props.modalContainerAlignment.justifySelf};
     position: relative;
     box-shadow: 0px 4px 4px 3px rgba(0, 0, 0, 0.1);
     border-radius: 4px;
     background: white;
     margin: 0 auto;
     overflow: ${(props) => props.overflow};
-    max-width: 95%;
+    max-width: ${(props) => props.maxWidth};
     max-height: 95%;
     min-width: ${(props) => (props.isLoading ? '400px' : '100px')};
     min-height: ${(props) => (props.isLoading ? '500px' : '100px')};
@@ -110,20 +123,24 @@
       right: 20px;
       top: 20px;
 
-      @media (max-width: 425px) {
-        right: 14px;
-        top: 12px;
-        background: white;
-        position: fixed;
-        z-index: 99;
-      }
+      ${(props) =>
+        !props.disableDefaultMediaQuery &&
+        `@media (max-width: 425px) {
+          right: 14px;
+          top: 12px;
+          background: white;
+          position: fixed;
+          z-index: 99;
+        }`}
     }
 
-    @media (max-width: 425px) {
-      width: 100%;
-      height: 100%;
-      box-shadow: none;
-    }
+    ${(props) =>
+      !props.disableDefaultMediaQuery &&
+      `@media (max-width: 425px) {
+        width: 100%;
+        height: 100%;
+        box-shadow: none;
+      }`}
   `
 
   export default {
@@ -138,22 +155,27 @@
     props: {
       isOpen: {
         required: true,
+        type: Boolean,
         default: false,
       },
       isLoading: {
         required: false,
+        type: Boolean,
         default: false,
       },
       hideClose: {
         required: false,
+        type: Boolean,
         default: false,
       },
       backdrop: {
         required: false,
+        type: String,
         default: 'white',
       },
       position: {
         required: false,
+        type: String,
         default: 'fixed',
       },
       stopPropagation: {
@@ -173,6 +195,21 @@
         type: Boolean,
         default: true,
       },
+      maxWidth: {
+        type: String,
+        default: '95%',
+      },
+      disableDefaultMediaQuery: {
+        type: Boolean,
+        default: false,
+      },
+      modalContainerAlignment: {
+        type: Object,
+        default: () => ({
+          alignSelf: 'center',
+          justifySelf: 'center',
+        }),
+      },
     },
     setup() {
       const modalRef = ref(null)