@eturnity/eturnity_reusable_components 7.48.1-EPDM-12680.11 → 7.48.1-dev-14.0

package/src/components/inputs/radioButton/radioButton.spec.js

@@ -114,7 +114,9 @@ describe('RadioButton.vue', () => {
     const checkedWrapper = checkedWrapperArray[0]
     const checkedRadioInput = checkedWrapper.find('input[type="radio"]')
     const defaultValueFromProps = radioButtons.props('selectedOption')
-    expect(checkedRadioInput.attributes('value')).toBe(defaultValueFromProps)
+    expect(checkedRadioInput.attributes('value')).toBe(
+      defaultValueFromProps
+    )
 
     // Log attributes to see what is rendered (commented out just for reference)
     // console.log('checkedRadioInput attributes', checkedRadioInput.attributes())
@@ -147,33 +149,25 @@ describe('RadioButton.vue', () => {
     it('click on disabled element (|| selected element || info icon || image) does not emit anything', async () => {
       // Remember the number of emitted events before triggering clicks
       const initialNumberOfEvents =
-        radioButtons.emitted('on-radio-change')?.length || 0
+        radioButtons.emitted('on-radio-change').length
 
       // Test RadioWrapper with disabled element
       const disabledWrapperArray = findRadioWrappersByCriteria(['disabled'])
-      if (disabledWrapperArray.length > 0) {
-        const disabledLabelWrapper = disabledWrapperArray[0].find('label')
-        if (disabledLabelWrapper.exists()) {
-          await disabledLabelWrapper.trigger('click')
-          // Check if we still have the same number of emitted events as at the beginning
-          expect(radioButtons.emitted('on-radio-change')?.length || 0).toBe(
-            initialNumberOfEvents
-          )
-        }
-      }
+      const disabledLabelWrapper = disabledWrapperArray[0].find('label')
+      await disabledLabelWrapper.trigger('click')
+      // Check if we still have the same number of emitted events as at the beginning
+      expect(radioButtons.emitted('on-radio-change')).toHaveLength(
+        initialNumberOfEvents
+      )
 
       // Get RadioWrapper with selected element
       const checkedWrapperArray = findRadioWrappersByCriteria(['checked'])
-      if (checkedWrapperArray.length > 0) {
-        const checkedLabelWrapper = checkedWrapperArray[0].find('label')
-        if (checkedLabelWrapper.exists()) {
-          await checkedLabelWrapper.trigger('click')
-          // Check if we still have the same number of emitted events as at the beginning
-          expect(radioButtons.emitted('on-radio-change')?.length || 0).toBe(
-            initialNumberOfEvents
-          )
-        }
-      }
+      const checkedLabelWrapper = checkedWrapperArray[0].find('label')
+      await checkedLabelWrapper.trigger('click')
+      // Check if we still have the same number of emitted events as at the beginning
+      expect(radioButtons.emitted('on-radio-change')).toHaveLength(
+        initialNumberOfEvents
+      )
 
       // Get RadioWrapper with info icon
       const arrayOfWrappersWithInfoIcons = findRadioWrappersByCriteria([
@@ -181,18 +175,14 @@ describe('RadioButton.vue', () => {
         'unchecked',
         'hasInfoIcon',
       ])
-      if (arrayOfWrappersWithInfoIcons.length > 0) {
-        const infoIconForClick = arrayOfWrappersWithInfoIcons[0].find(
-          '[data-test-id="infoText_trigger"]'
-        )
-        if (infoIconForClick.exists()) {
-          await infoIconForClick.trigger('click')
-          // Check if we still have the same number of emitted events as at the beginning
-          expect(radioButtons.emitted('on-radio-change')?.length || 0).toBe(
-            initialNumberOfEvents
-          )
-        }
-      }
+      const infoIconForClick = arrayOfWrappersWithInfoIcons[0].find(
+        '[data-test-id="infoText_trigger"]'
+      )
+      await infoIconForClick.trigger('click')
+      // Check if we still have the same number of emitted events as at the beginning
+      expect(radioButtons.emitted('on-radio-change')).toHaveLength(
+        initialNumberOfEvents
+      )
 
       // Get RadioWrapper with image
       const arrayOfWrappersWithImage = findRadioWrappersByCriteria([
@@ -200,87 +190,60 @@ describe('RadioButton.vue', () => {
         'unchecked',
         'hasImage',
       ])
-      if (arrayOfWrappersWithImage.length > 0) {
-        const testedRadioWrapperWithImage = arrayOfWrappersWithImage[0]
-        const openImageWrapperTestId = testedRadioWrapperWithImage
-          .attributes('data-test-id')
-          .replace('radioWrapper_', 'radioOpenImage_')
-        const openImageWrapper = testedRadioWrapperWithImage.find(
-          `[data-test-id="${openImageWrapperTestId}"]`
-        )
-        if (openImageWrapper.exists()) {
-          await openImageWrapper.trigger('click')
-          // Check if we still have the same number of emitted events as at the beginning
-          expect(radioButtons.emitted('on-radio-change')?.length || 0).toBe(
-            initialNumberOfEvents
-          )
+      const testedRadioWrapperWithImage = arrayOfWrappersWithImage[0]
+      const openImageWrapperTestId = testedRadioWrapperWithImage
+        .attributes('data-test-id')
+        .replace('radioWrapper_', 'radioOpenImage_')
+      const openImageWrapper = testedRadioWrapperWithImage.find(
+        `[data-test-id="${openImageWrapperTestId}"]`
+      )
+      await openImageWrapper.trigger('click')
+      // Check if we still have the same number of emitted events as at the beginning
+      expect(radioButtons.emitted('on-radio-change')).toHaveLength(
+        initialNumberOfEvents
+      )
 
-          // Since we just clicked on image miniature
-          // lets check has the corresponding modal been opened
-          // and is the correct image displayed
-          const imageModalWrapperTestId = testedRadioWrapperWithImage
-            .attributes('data-test-id')
-            .replace('radioWrapper_', 'radioModal_')
-          const imageModalWrapper = testedRadioWrapperWithImage.find(
-            `[data-test-id="${imageModalWrapperTestId}"]`
-          )
-          if (imageModalWrapper.exists()) {
-            expect(imageModalWrapper.attributes('class')).toContain('visible')
-            const imageWrapperTestId = testedRadioWrapperWithImage
-              .attributes('data-test-id')
-              .replace('radioWrapper_', 'radioImage_')
-            const imageWrapper = testedRadioWrapperWithImage.find(
-              `[data-test-id="${imageWrapperTestId}"]`
-            )
-            if (imageWrapper.exists()) {
-              const expectedImageSrc = imageWrapper.attributes('src')
-              const modalImage = imageModalWrapper.find('img')
-              if (modalImage.exists()) {
-                const modalImageSrc = modalImage.attributes('src')
-                expect(modalImageSrc).toBe(expectedImageSrc)
-              }
-            }
-            //Close the modal
-            const closeButton = radioButtons.find('.visible .close')
-            if (closeButton.exists()) {
-              await closeButton.trigger('click')
-              await radioButtons.vm.$nextTick()
-              expect(imageModalWrapper.attributes('class')).toContain('hidden')
-            }
-          }
-        }
-      }
+      // Since we just clicked on image miniature
+      // lets check has the corresponding modal been opened
+      // and is the correct image displayed
+      const imageModalWrapperTestId = testedRadioWrapperWithImage
+        .attributes('data-test-id')
+        .replace('radioWrapper_', 'radioModal_')
+      const imageModalWrapper = testedRadioWrapperWithImage.find(
+        `[data-test-id="${imageModalWrapperTestId}"]`
+      )
+      expect(imageModalWrapper.attributes('class')).toContain('visible')
+      const imageWrapperTestId = testedRadioWrapperWithImage
+        .attributes('data-test-id')
+        .replace('radioWrapper_', 'radioImage_')
+      const imageWrapper = testedRadioWrapperWithImage.find(
+        `[data-test-id="${imageWrapperTestId}"]`
+      )
+      const expectedImageSrc = imageWrapper.attributes('src')
+      const modalImageSrc = imageModalWrapper.find('img').attributes('src')
+      expect(modalImageSrc).toBe(expectedImageSrc)
+      //Close the modal
+      radioButtons.find('.visible .close').trigger('click')
+      await radioButtons.vm.$nextTick()
+      expect(imageModalWrapper.attributes('class')).toContain('hidden')
     }),
     it('test hover on Info Icon', async () => {
       // Get RadioWrapper with Info Icon
       const arrayOfWrappersWithInfoIcon = findRadioWrappersByCriteria([
         'hasInfoIcon',
       ])
-
-      // Ensure we have at least one wrapper with Info Icon
-      expect(arrayOfWrappersWithInfoIcon.length).toBeGreaterThan(0)
-
       //Select tested item and get expected text within the info badge
       const testedRadioWrapper =
         arrayOfWrappersWithInfoIcon[arrayOfWrappersWithInfoIcon.length - 1]
       const valueOfTestedRadioWrapper = testedRadioWrapper
         .attributes('data-test-id')
         .replace('radioWrapper_', '')
-      const expectedText = defaultRadioButtonProps.options.find(
-        (el) => el.value === valueOfTestedRadioWrapper
-      ).infoText
+      const expectedText = defaultRadioButtonProps.options.find((el) => el.value === valueOfTestedRadioWrapper).infoText
       const iconForHover = testedRadioWrapper.find(
         '[data-test-id="infoText_trigger"]'
       )
-
-      // Check if the icon exists before triggering the event
-      // expect(iconForHover.exists()).toBe(true)
-
-      if (iconForHover.exists()) {
-        await iconForHover.trigger('mouseenter')
-        await radioButtons.vm.$nextTick() // Wait for the next tick to ensure reactivity
-        expect(testedRadioWrapper.text()).toContain(expectedText)
-      }
+      await iconForHover.trigger('mouseenter')
+      expect(testedRadioWrapper.text()).toContain(expectedText)
     }),
     it('Test the click again after all the manipulations', async () => {
       const uncheckedWrapperArray = findRadioWrappersByCriteria([

package/src/components/inputs/select/index.vue

@@ -17,9 +17,7 @@
       >
         <InputLabel
           :font-color="
-            labelFontColor || colorMode == 'dark' || colorMode == 'transparent'
-              ? 'white'
-              : 'eturnityGrey'
+            labelFontColor || colorMode == 'dark' ? 'white' : 'eturnityGrey'
           "
           :font-size="fontSize"
           >{{ label }}
@@ -42,26 +40,18 @@
         <SelectButton
           ref="select"
           :bg-color="
-            buttonBgColor || colorMode == 'dark'
-              ? 'transparentBlack1'
-              : colorMode == 'transparent'
-              ? 'transparent'
-              : 'white'
+            buttonBgColor || colorMode == 'dark' ? 'transparentBlack1' : 'white'
           "
           class="select-button"
-          :color-mode="colorMode"
           :data-id="dataId"
           :disabled="disabled"
           :font-color="
-            buttonFontColor || colorMode == 'dark' || colorMode == 'transparent'
-              ? 'white'
-              : 'black'
+            buttonFontColor || colorMode == 'dark' ? 'white' : 'black'
           "
           :font-size="fontSize"
           :has-error="hasError"
           :has-no-padding="isSearchBarVisible || !hasSelectButtonPadding"
           :height="height"
-          :is-search-bar-visible="isSearchBarVisible"
           :no-relative="noRelative"
           :padding-left="paddingLeft"
           :select-height="selectHeight"
@@ -82,11 +72,7 @@
             ref="searchInput"
             background-color="transparent"
             :font-color="
-              buttonFontColor ||
-              colorMode == 'dark' ||
-              colorMode == 'transparent'
-                ? 'white'
-                : 'black'
+              buttonFontColor || colorMode == 'dark' ? 'white' : 'black'
             "
             :font-size="fontSize"
             input-height="34px"
@@ -100,36 +86,37 @@
           />
           <Selector
             v-else
+            :disabled="disabled"
             :padding-left="paddingLeft"
             :select-width="selectWidth"
             :show-border="showBorder"
           >
             <slot name="selector" :selected-value="selectedValue"></slot>
           </Selector>
-          <Caret
-            class="caret_dropdown"
-            :color-mode="colorMode"
-            @click.stop="toggleCaretDropdown"
-          >
+          <Caret class="caret_dropdown" @click.stop="toggleCaretDropdown">
             <Icon
               v-if="isDropdownOpen"
               :color="
-                caretColor || colorMode == 'dark' || colorMode == 'transparent'
+                caretColor || disabled
+                  ? 'grey2'
+                  : colorMode == 'dark'
                   ? 'white'
                   : 'transparentBlack1'
               "
               name="arrow_up"
-              :size="colorMode === 'transparent' ? '8px' : '12px'"
+              size="12px"
             />
             <Icon
               v-else
               :color="
-                caretColor || colorMode == 'dark' || colorMode == 'transparent'
+                caretColor || disabled
+                  ? 'grey2'
+                  : colorMode == 'dark'
                   ? 'white'
                   : 'transparentBlack1'
               "
               name="arrow_down"
-              :size="colorMode === 'transparent' ? '8px' : '12px'"
+              size="12px"
             />
           </Caret>
         </SelectButton>
@@ -139,27 +126,15 @@
               v-show="isSelectDropdownShown"
               ref="dropdown"
               :bg-color="
-                dropdownBgColor ||
-                colorMode == 'dark' ||
-                colorMode == 'transparent'
-                  ? 'black'
-                  : 'white'
+                dropdownBgColor || colorMode == 'dark' ? 'black' : 'white'
               "
               :dropdown-position="dropdownPosition"
               :font-color="
-                dropdownFontColor ||
-                colorMode == 'dark' ||
-                colorMode == 'transparent'
-                  ? 'white'
-                  : 'black'
+                dropdownFontColor || colorMode == 'dark' ? 'white' : 'black'
               "
               :font-size="fontSize"
               :hovered-bg-color="
-                colorMode == 'dark'
-                  ? '#000000'
-                  : colorMode == 'transparent'
-                  ? 'grey6'
-                  : dropdownBgColor
+                colorMode == 'dark' ? '#000000' : dropdownBgColor
               "
               :hovered-index="hoveredIndex"
               :hovered-value="hoveredValue"
@@ -216,15 +191,12 @@
   const CARET_WIDTH = '30px'
   const BORDER_WIDTH = '1px'
 
-  const CaretAttrs = { colorMode: String }
-  const Caret = styled('div', CaretAttrs)`
+  const Caret = styled.div`
     display: flex;
     align-items: center;
     justify-content: center;
-    width: ${(props) =>
-      props.colorMode === 'transparent' ? '15px' : CARET_WIDTH};
-    min-width: ${(props) =>
-      props.colorMode === 'transparent' ? '15px' : CARET_WIDTH};
+    width: ${CARET_WIDTH};
+    min-width: ${CARET_WIDTH};
     height: 100%;
     align-items: center;
     cursor: pointer;
@@ -232,11 +204,13 @@
   `
 
   const selectorProps = {
+    disabled: Boolean,
     selectWidth: String,
     paddingLeft: String,
     showBorder: Boolean,
   }
   const Selector = styled('div', selectorProps)`
+    color: ${(props) => (props.disabled ? props.theme.colors.grey2 : '')};
     ${(props) =>
       props.selectWidth === '100%'
         ? 'width: 100%;'
@@ -263,7 +237,6 @@
   `
   const OptionalLabel = styled.span`
     font-weight: 300;
-    text-transform: lowercase;
   `
   const inputProps = {
     selectWidth: String,
@@ -308,8 +281,6 @@
     noRelative: Boolean,
     tablePaddingLeft: String,
     showDisabledBackground: Boolean,
-    colorMode: String,
-    isSearchBarVisible: Boolean,
   }
   const SelectButton = styled('div', selectButtonAttrs)`
     position: ${(props) => (props.noRelative ? 'static' : 'relative')};
@@ -317,11 +288,7 @@
     border-radius: 4px;
     max-width: ${(props) => (props.selectWidth ? props.selectWidth : '100%')};
     ${(props) =>
-      props.colorMode === 'transparent'
-        ? props.isSearchBarVisible
-          ? 'padding: 10px 15px 10px 5px;'
-          : 'padding: 10px 15px;'
-        : props.isSearchBarVisible
+      props.isSearchBarVisible
         ? ''
         : `padding-left: ${
             props.hasNoPadding
@@ -349,22 +316,14 @@
         hasError ? theme.colors.red : theme.colors.grey4
       }
   `}
-    opacity: ${(props) =>
-      props.colorMode === 'transparent' && props.disabled ? '0.4' : '1'};
-    background-color: ${(props) =>
-      props.colorMode === 'transparent'
-        ? 'transparent'
-        : props.disabled && props.showDisabledBackground
-        ? props.theme.colors.disabled
+    background-color:${(props) =>
+      props.disabled && props.showDisabledBackground
+        ? props.theme.colors.grey5
         : props.theme.colors[props.bgColor]
         ? props.theme.colors[props.bgColor]
         : props.bgColor};
     color: ${(props) =>
-      props.colorMode === 'transparent'
-        ? props.theme.colors.white
-        : props.disabled && props.showDisabledBackground
-        ? props.theme.colors.black
-        : props.theme.colors[props.fontColor]
+      props.theme.colors[props.fontColor]
         ? props.theme.colors[props.fontColor]
         : props.fontColor};
     ${(props) => (props.disabled ? 'pointer-events: none' : '')};
@@ -583,6 +542,7 @@
       },
       disabled: {
         required: false,
+        type: Boolean,
         default: false,
       },
       isAutoSearch: {
@@ -661,7 +621,7 @@
         if (this.isDropdownOpen) {
           return this.$refs.dropdown.$el.childElementCount > 1
             ? this.$refs.dropdown.$el.childElementCount
-            : this.$refs.dropdown.$el.children[0]
+            : !!this.$refs.dropdown.$el.children[0]
             ? this.$refs.dropdown.$el.children[0].childElementCount
             : 0
         }

package/src/components/inputs/select/option/index.vue

@@ -1,12 +1,6 @@
 <template>
   <OptionContainer
-    :background-color="
-      colorMode == 'dark'
-        ? '#000000'
-        : colorMode == 'transparent'
-        ? 'black'
-        : backgroundColor
-    "
+    :background-color="colorMode == 'dark' ? '#000000' : backgroundColor"
     :cursor-type="cursorType"
     :data-value="value"
     :disabled-bg-color="disabledBgColor"
@@ -14,8 +8,6 @@
     :hovered-bg-color="
       colorMode == 'dark'
         ? '#000000'
-        : colorMode == 'transparent'
-        ? 'grey6'
         : hoveredBgColor
         ? hoveredBgColor
         : 'grey5'
@@ -138,8 +130,7 @@
         default: '12px 10px',
       },
       textColor: {
-        type: String,
-        required: false,
+        type: true,
         default: 'inherit',
       },
     },

package/src/components/markerItem/index.vue

@@ -12,7 +12,7 @@
         :name="iconName"
         size="10px"
       />
-      <span :title="label">{{ label }}</span>
+      <span>{{ label }}</span>
     </MarkerContainer>
   </PageContainer>
 </template>
@@ -60,13 +60,6 @@
     border-radius: 4px;
     white-space: nowrap;
     cursor: ${(props) => (props.isEditionAllowed ? 'pointer' : props.cursor)};
-    overflow: hidden;
-    text-overflow: ellipsis;
-
-    span {
-      overflow: hidden;
-      text-overflow: ellipsis;
-    }
   `
 
   export default {

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

@@ -5,7 +5,7 @@
     :is-open="isOpen"
     :position="position"
   >
-    <ModalContainer @click="onClickModalContainer">
+    <ModalContainer :overflow="overflowRule" @click="onClickModalContainer">
       <Spinner v-if="isLoading" :limited-to-modal="true" size="50px" />
       <ContentContainer :visible="!isLoading">
         <slot></slot>
@@ -67,7 +67,8 @@
   }
 `
 
-  const ModalContainer = styled.div`
+  const modalContainerAttrs = { overflow: String }
+  const ModalContainer = styled('div', modalContainerAttrs)`
     align-self: center;
     justify-self: center;
     position: relative;
@@ -75,7 +76,7 @@
     border-radius: 4px;
     background: white;
     margin: 0 auto;
-    overflow: auto;
+    overflow: ${(props) => props.overflow};
     max-width: 95%;
     max-height: 95%;
     min-width: 100px;
@@ -152,6 +153,11 @@
         type: Boolean,
         default: true,
       },
+      overflowRule: {
+        required: false,
+        type: String,
+        default: 'auto',
+      },
     },
     watch: {
       isOpen: {

package/src/components/sideMenu/index.vue

@@ -254,9 +254,6 @@
         activeDropdown: null,
       }
     },
-    mounted() {
-      this.activeDropdown = this.activeParentTab
-    },
     methods: {
       toggleActiveDropdown(value) {
         if (this.activeDropdown === value) {
@@ -266,5 +263,17 @@
         }
       },
     },
+    watch: {
+      activeTab: {
+        // once active tab is received, check if any parent
+        // tab is active and if so open according dropdown
+        handler() {
+          if (this.activeParentTab) {
+            this.activeDropdown = this.activeParentTab
+          }
+        },
+        once: true,
+      },
+    },
   }
 </script>

package/src/components/spinner/index.vue

@@ -3,7 +3,6 @@
     <Container>
       <SpinnerWrapper data-test-id="spinner_full_wrapper">
         <SpinnerSvg
-          :class="{ white: isWhite }"
           data-test-id="spinner_full_icon"
           :style="{ width: size, height: size }"
         />
@@ -17,7 +16,6 @@
   >
     <SpinnerWrapper data-test-id="spinner_wrapper">
       <SpinnerSvg
-        :class="{ white: isWhite }"
         data-test-id="spinner_icon"
         :style="{ width: size, height: size }"
       />
@@ -56,10 +54,6 @@
   const SpinnerWrapper = styled.div`
     width: ${(props) => (props.size ? props.size : '60px')};
     height: auto;
-
-    .white {
-      filter: brightness(0) invert(1);
-    }
   `
 
   export default {
@@ -86,11 +80,6 @@
         default: '60px',
         type: String,
       },
-      isWhite: {
-        required: false,
-        default: false,
-        type: Boolean,
-      },
     },
   }
 </script>

package/src/components/tables/mainTable/index.vue

@@ -10,7 +10,11 @@
       ref="tableRef"
       :is-position-absolute="doesTableContainDraggables"
     >
-      <TableWrapper class="main-table-wrapper" :full-width="fullWidth">
+      <TableWrapper
+        class="main-table-wrapper"
+        :full-width="fullWidth"
+        :is-overflow-hidden="isOverflowHidden"
+      >
         <SpinnerWrapper v-if="isLoading">
           <Spinner />
         </SpinnerWrapper>
@@ -70,12 +74,12 @@
   `}
   `
 
-  const wrapperAttrs = { fullWidth: Boolean }
+  const wrapperAttrs = { fullWidth: Boolean, isOverflowHidden: Boolean }
   const TableWrapper = styled('div', wrapperAttrs)`
     width: ${(props) => (props.fullWidth ? '100%' : 'fit-content')};
     max-width: 100%;
-    overflow-x: auto;
-    overflow-y: hidden;
+    ${(props) =>
+      props.isOverflowHidden ? 'overflow-x: auto; overflow-y: hidden;' : ''}
 
     ::-webkit-scrollbar {
       height: 10px; //height of the whole scrollbar area
@@ -409,6 +413,10 @@
         required: false,
         default: false,
       },
+      isOverflowHidden: {
+        required: false,
+        default: true,
+      },
       titleText: {
         required: false,
         default: null,

package/src/assets/svgIcons/collapse_all.svg

@@ -1,4 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
-  <path d="M3 2L7 5L11 2" stroke="white" stroke-width="1.27273" class="fix"/>
-  <path d="M3 12L7 9L11 12" stroke="white" stroke-width="1.27273" class="fix"/>
-</svg>

package/src/assets/svgIcons/hybrid.svg

@@ -1,4 +0,0 @@
-<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M4.22998 11.8962H10.5006H12.2505V10.1463V8.97906H14.0004V5.47917H12.2505V4.31283V2.56289V2.55151H10.5006V2.56289H8.58218L7.76617 4.31283H10.5006V10.1463H5.04599L4.22998 11.8962Z" fill="white"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M7.2622 4.79738C6.91629 4.63687 6.53076 4.54729 6.12431 4.54729C4.63054 4.54729 3.41919 5.75796 3.41919 7.25241C3.41919 8.33588 4.05591 9.26984 4.97534 9.70158L7.2622 4.79738ZM5.44786 3.11681C5.44786 3.49042 5.7507 3.79326 6.12431 3.79326C6.49793 3.79326 6.80077 3.49042 6.80077 3.11681V1.76459C6.80077 1.39097 6.49793 1.08813 6.12431 1.08813C5.7507 1.08813 5.44786 1.39097 5.44786 1.76459V3.11681ZM2.02818 7.88939H0.675962C0.302349 7.88939 -0.000488281 7.58655 -0.000488281 7.21294C-0.000488281 6.83932 0.302349 6.53649 0.675962 6.53649H2.02818C2.4018 6.53649 2.70463 6.83932 2.70463 7.21294C2.70463 7.58655 2.4018 7.88939 2.02818 7.88939ZM3.7057 10.5877L2.74955 11.5439C2.4855 11.8079 2.05745 11.8079 1.7934 11.5439C1.52935 11.2798 1.52935 10.8518 1.7934 10.5877L2.74955 9.63155C3.0136 9.36751 3.44165 9.36751 3.7057 9.63155C3.96975 9.8956 3.96975 10.3237 3.7057 10.5877ZM2.74955 4.79432L1.7934 3.83817C1.52935 3.57412 1.52935 3.14607 1.7934 2.88202C2.05745 2.61797 2.4855 2.61797 2.74955 2.88202L3.7057 3.83817C3.96975 4.10222 3.96975 4.53027 3.7057 4.79432C3.44165 5.05837 3.0136 5.05837 2.74955 4.79432Z" fill="white"/>
-</svg>

package/src/assets/svgIcons/module.svg

@@ -1,3 +0,0 @@
-<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M11.0722 3.6H1.6V10.4H11.0722L7.87332 7.60217L7.18484 7L7.87332 6.39783L11.0722 3.6ZM12.4 9.43572V4.56428L9.61516 7L12.4 9.43572ZM0 2H1.6H12.4H14V3.6V10.4V12H12.4H1.6H0V10.4V3.6V2Z" fill="white"/>
-</svg>