@eturnity/eturnity_reusable_components 7.48.0 → 7.48.1--EPDM-12129.7

package/dist/main.es92.js

@@ -0,0 +1,23 @@
+import "./main.es3.js";
+import { openBlock, createElementBlock, createElementVNode as createBaseVNode } from "./main.es6.js";
+const _hoisted_1 = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "6",
+  height: "16",
+  fill: "none"
+};
+const _hoisted_2 = /* @__PURE__ */ createBaseVNode("path", {
+  fill: "#263238",
+  d: "M21.75 14.75a1.75 1.75 0 1 1-3.5 0 1.75 1.75 0 0 1 3.5 0M21.75 20a1.75 1.75 0 1 1-3.5 0 1.75 1.75 0 0 1 3.5 0M21.75 25.25a1.75 1.75 0 1 1-3.5 0 1.75 1.75 0 0 1 3.5 0"
+}, null, -1);
+const _hoisted_3 = [
+  _hoisted_2
+];
+function render(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1, _hoisted_3);
+}
+const context_menu = { render };
+export {
+  context_menu as default,
+  render
+};

package/dist/main.es93.js

@@ -0,0 +1,23 @@
+import "./main.es3.js";
+import { openBlock, createElementBlock, createElementVNode as createBaseVNode } from "./main.es6.js";
+const _hoisted_1 = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "16",
+  height: "6",
+  fill: "none"
+};
+const _hoisted_2 = /* @__PURE__ */ createBaseVNode("path", {
+  fill: "#B2B9C5",
+  d: "M16.5 19.75a1.75 1.75 0 1 1-3.5 0 1.75 1.75 0 0 1 3.5 0M21.75 19.75a1.75 1.75 0 1 1-3.5 0 1.75 1.75 0 0 1 3.5 0M27 19.75a1.75 1.75 0 1 1-3.5 0 1.75 1.75 0 0 1 3.5 0"
+}, null, -1);
+const _hoisted_3 = [
+  _hoisted_2
+];
+function render(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1, _hoisted_3);
+}
+const context_menu_tabs = { render };
+export {
+  context_menu_tabs as default,
+  render
+};

package/dist/main.es94.js

@@ -0,0 +1,24 @@
+import "./main.es3.js";
+import { openBlock, createElementBlock, createElementVNode as createBaseVNode } from "./main.es6.js";
+const _hoisted_1 = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "800",
+  height: "800",
+  viewBox: "0 0 512 512"
+};
+const _hoisted_2 = /* @__PURE__ */ createBaseVNode("path", {
+  fill: "none",
+  "fill-rule": "evenodd",
+  d: "M426.667 128v320h-256V128zM384 170.667H213.333v234.666H384zm-64-128v42.666H128v256H85.333V42.667z"
+}, null, -1);
+const _hoisted_3 = [
+  _hoisted_2
+];
+function render(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1, _hoisted_3);
+}
+const copy = { render };
+export {
+  copy as default,
+  render
+};

package/dist/main.es95.js

@@ -0,0 +1,28 @@
+import "./main.es3.js";
+import { openBlock, createElementBlock, createElementVNode as createBaseVNode } from "./main.es6.js";
+const _hoisted_1 = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "10",
+  height: "10",
+  fill: "none"
+};
+const _hoisted_2 = /* @__PURE__ */ createBaseVNode("path", {
+  fill: "#000",
+  d: "m9.879 8.479-1.4 1.4L.12 1.52l1.4-1.4L5.7 4.3z"
+}, null, -1);
+const _hoisted_3 = /* @__PURE__ */ createBaseVNode("path", {
+  fill: "#000",
+  d: "m1.521 9.879-1.4-1.4L8.48.12l1.4 1.4z"
+}, null, -1);
+const _hoisted_4 = [
+  _hoisted_2,
+  _hoisted_3
+];
+function render(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1, _hoisted_4);
+}
+const cross = { render };
+export {
+  cross as default,
+  render
+};

package/dist/main.es96.js

@@ -0,0 +1,28 @@
+import "./main.es3.js";
+import { openBlock, createElementBlock, createElementVNode as createBaseVNode } from "./main.es6.js";
+const _hoisted_1 = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "20",
+  height: "14",
+  fill: "none"
+};
+const _hoisted_2 = /* @__PURE__ */ createBaseVNode("path", {
+  fill: "#263238",
+  d: "M20 16c2.829 0 4.976 1.278 6.69 4.003C24.975 22.724 22.827 24 20 24s-4.975-1.276-6.69-3.997C15.024 17.278 17.171 16 20 16m0-2c-4.273 0-7.094 2.43-9 6.005C12.906 23.57 15.727 26 20 26s7.094-2.43 9-5.995C27.094 16.43 24.273 14 20 14"
+}, null, -1);
+const _hoisted_3 = /* @__PURE__ */ createBaseVNode("path", {
+  fill: "#263238",
+  d: "M20 22a2 2 0 1 0 0-4 2 2 0 0 0 0 4"
+}, null, -1);
+const _hoisted_4 = [
+  _hoisted_2,
+  _hoisted_3
+];
+function render(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1, _hoisted_4);
+}
+const current_variant = { render };
+export {
+  current_variant as default,
+  render
+};

package/dist/main.es97.js

@@ -0,0 +1,23 @@
+import "./main.es3.js";
+import { openBlock, createElementBlock, createElementVNode as createBaseVNode } from "./main.es6.js";
+const _hoisted_1 = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "18",
+  height: "18",
+  fill: "none"
+};
+const _hoisted_2 = /* @__PURE__ */ createBaseVNode("path", {
+  fill: "#fff",
+  d: "M0 10h8V0H0zm0 8h8v-6H0zm10 0h8V8h-8zm0-18v6h8V0z"
+}, null, -1);
+const _hoisted_3 = [
+  _hoisted_2
+];
+function render(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1, _hoisted_3);
+}
+const dashboard = { render };
+export {
+  dashboard as default,
+  render
+};

package/dist/main.es98.js

@@ -0,0 +1,23 @@
+import "./main.es3.js";
+import { openBlock, createElementBlock, createElementVNode as createBaseVNode } from "./main.es6.js";
+const _hoisted_1 = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "18",
+  height: "18",
+  fill: "none"
+};
+const _hoisted_2 = /* @__PURE__ */ createBaseVNode("path", {
+  fill: "#263238",
+  d: "M16 0H2a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h4v-2H2V2h14v14h-4v2h4c1.1 0 2-.9 2-2V2a2 2 0 0 0-2-2M9 6l-4 4h3v8h2v-8h3z"
+}, null, -1);
+const _hoisted_3 = [
+  _hoisted_2
+];
+function render(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1, _hoisted_3);
+}
+const data_transfer = { render };
+export {
+  data_transfer as default,
+  render
+};

package/dist/main.es99.js

@@ -0,0 +1,28 @@
+import "./main.es3.js";
+import { openBlock, createElementBlock, createElementVNode as createBaseVNode } from "./main.es6.js";
+const _hoisted_1 = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "12",
+  height: "16",
+  fill: "none"
+};
+const _hoisted_2 = /* @__PURE__ */ createBaseVNode("path", {
+  fill: "#263238",
+  d: "M15 13h2v14h-2z"
+}, null, -1);
+const _hoisted_3 = /* @__PURE__ */ createBaseVNode("path", {
+  fill: "#263238",
+  d: "M17 21a2 2 0 0 1-2-2v-4a2 2 0 0 1 2-2h8l-2.857 4L25 21z"
+}, null, -1);
+const _hoisted_4 = [
+  _hoisted_2,
+  _hoisted_3
+];
+function render(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1, _hoisted_4);
+}
+const deadline = { render };
+export {
+  deadline as default,
+  render
+};

package/dist/style.css

@@ -0,0 +1 @@
+html,body{height:100%;margin:0}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eturnity/eturnity_reusable_components",
-  "version": "7.48.0",
+  "version": "7.48.1--EPDM-12129.7",
   "files": [
     "dist",
     "src"

package/src/components/addNewButton/index.vue

@@ -1,6 +1,6 @@
 <template>
   <PageContainer :should-position="shouldPosition">
-    <ButtonContainer :data-id="dataId">
+    <ButtonContainer :data-id="dataId" :data-qa-id="dataQaId">
       <PlusButtonSvg />
     </ButtonContainer>
   </PageContainer>
@@ -57,6 +57,10 @@
         type: String,
         default: '',
       },
+      dataQaId: {
+        type: String,
+        default: '',
+      },
     },
   }
 </script>

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

@@ -4,6 +4,7 @@
       :id="id"
       :custom-color="customColor"
       :data-id="dataId"
+      :data-qa-id="dataQaId"
       :font-color="fontColor"
       :is-disabled="isDisabled"
       :min-width="minWidth"
@@ -145,6 +146,10 @@
         type: String,
         default: '',
       },
+      dataQaId: {
+        type: String,
+        default: '',
+      },
     },
   }
 </script>

package/src/components/iconWrapper/index.vue

@@ -4,6 +4,7 @@
     :border-radius="borderRadius"
     :color="iconColor"
     :data-id="dataId"
+    :data-qa-id="dataQaId"
     :disabled="disabled"
     :has-border="hasBorder"
     :hovered-background-color="hoveredBackgroundColor"
@@ -154,6 +155,10 @@
         type: String,
         default: '',
       },
+      dataQaId: {
+        type: String,
+        default: '',
+      },
       isHovered: {
         required: false,
         default: false,

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

@@ -13,6 +13,7 @@
       <InputCheckbox
         :checked="isChecked"
         :data-id="dataId"
+        :data-qa-id="dataQaId"
         type="checkbox"
         @change="onChangeHandler(!isChecked)"
       />
@@ -203,6 +204,10 @@
         type: String,
         default: '',
       },
+      dataQaId: {
+        type: String,
+        default: '',
+      },
       cursorType: {
         type: String,
         default: 'pointer',

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

@@ -13,7 +13,11 @@
     </LabelSlotWrapper>
 
     <LabelWrapper v-if="labelText">
-      <LabelText :data-id="labelDataId" :label-font-color="labelFontColor">
+      <LabelText
+        :data-id="labelDataId"
+        :data-test-id="labelDataTestId"
+        :label-font-color="labelFontColor"
+      >
         {{ labelText }}
       </LabelText>
 
@@ -31,6 +35,7 @@
         :background-color="backgroundColor"
         :border-color="borderColor"
         :data-id="inputDataId"
+        :data-qa-id="dataQaId"
         :disabled="disabled"
         :font-color="fontColor"
         :font-size="fontSize"
@@ -496,6 +501,10 @@
         required: false,
         default: '',
       },
+      dataQaId: {
+        required: false,
+        default: '',
+      },
       showSelect: {
         type: Boolean,
         default: false,

package/src/components/inputs/inputText/InputText.stories.js

@@ -3,73 +3,68 @@ import InputText from './index.vue'
 export default {
   title: 'InputText',
   component: InputText,
-  // argTypes: {},
+  tags: ['autodocs'],
 }
 
-const Template = (args, { argTypes }) => ({
-  // Components used in your story `template` are defined in the `components` object
-  components: { InputText },
-  // The story's `args` need to be mapped into the template through the `setup()` method
-  props: Object.keys(argTypes),
-  template: '<input-text v-bind="$props" />',
+// import InputText from "@eturnity/eturnity_reusable_components/src/components/inputs/inputText"
+// To use:
+// <input-text
+//   placeholder="Company name"
+//   :value="companyName"
+//   @input-change="onInputChange({ value: $event, type: 'companyName' })"
+//   :isError="checkErrors()"
+//   :errorMessage="This is my error message"
+//   infoTextAlign="right" // left by default
+//   infoTextMessage="My info message"
+//   label="Question 5"
+//   alignItems="horizontal" // horizontal, vertical
+//   inputWidth="250px"
+//   minWidth="100px"
+// />
 
-  // import InputText from "@eturnity/eturnity_reusable_components/src/components/inputs/inputText"
-  // To use:
-  // <input-text
-  //   placeholder="Company name"
-  //   :value="companyName"
-  //   @input-change="onInputChange({ value: $event, type: 'companyName' })"
-  //   :isError="checkErrors()"
-  //   :errorMessage="This is my error message"
-  //   infoTextAlign="right" // left by default
-  //   infoTextMessage="My info message"
-  //   label="Question 5"
-  //   alignItems="horizontal" // horizontal, vertical
-  //   inputWidth="250px"
-  //   minWidth="100px"
-  // />
-})
-
-export const Default = Template.bind({})
-Default.args = {
-  placeholder: 'Company name',
-  disabled: false,
-  value: '',
-  inputWidth: '200px',
-  minWidth: '10ch',
-  unitName: 'pc',
-  isError: false,
-  textAlign: 'left',
+export const Default = {
+  args: {
+    placeholder: 'Company name',
+    disabled: false,
+    value: '',
+    inputWidth: '200px',
+    minWidth: '10ch',
+    isError: false,
+    label: 'label test',
+    labelOptional: true,
+  },
 }
 
-export const hasError = Template.bind({})
-hasError.args = {
-  placeholder: 'Enter Value',
-  errorMessage: 'This field is required',
-  isError: true,
-  disabled: false,
-  inputWidth: '200px',
+export const HasError = {
+  args: {
+    placeholder: 'Enter Value',
+    errorMessage: 'This field is required',
+    isError: true,
+    disabled: false,
+    inputWidth: '200px',
+  },
 }
 
-export const Disabled = Template.bind({})
-Disabled.args = {
-  placeholder: 'Enter Value',
-  disabled: true,
-  value: '',
-  inputWidth: '200px',
-  isError: false,
+export const Disabled = {
+  args: {
+    placeholder: 'Enter Value',
+    disabled: true,
+    value: '',
+    inputWidth: '200px',
+    isError: false,
+  },
 }
 
-export const WithLabel = Template.bind({})
-WithLabel.args = {
-  placeholder: 'Company name',
-  disabled: false,
-  label: 'What is the best company in Switzerland?',
-  value: 'Eturnity',
-  inputWidth: '200px',
-  unitName: 'pc',
-  isError: false,
-  errorMessage: 'Maximum 5 characters',
-  textAlign: 'left',
-  alignItems: 'vertical',
+export const WithLabel = {
+  args: {
+    placeholder: 'Company name',
+    disabled: false,
+    label: 'What is the best company in Switzerland?',
+    value: 'Eturnity',
+    inputWidth: '200px',
+    unitName: 'pc',
+    isError: false,
+    errorMessage: 'Maximum 5 characters',
+    alignItems: 'vertical',
+  },
 }

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

@@ -2,22 +2,26 @@
   <Container>
     <InputWrapper
       :align-items="alignItems"
+      data-test-id="input_wrapper"
       :has-label="!!label && label.length > 0"
     >
       <LabelWrapper v-if="label">
         <InputLabel
+          ref="label"
           :data-id="labelDataId"
+          data-test-id="label_wrapper"
           :font-size="fontSize"
           :label-font-color="labelFontColor"
         >
           {{ label }}
-          <OptionalLabel v-if="labelOptional">
+          <OptionalLabel v-if="labelOptional" data-test-id="label_optional">
             ({{ $gettext('Optional') }})
           </OptionalLabel>
         </InputLabel>
         <InfoText
-          v-if="infoTextMessage"
+          v-if="infoTextMessage != ''"
           :align-arrow="infoTextAlign"
+          data-test-id="info_text_message"
           :size="fontSize ? fontSize : '16px'"
           :text="infoTextMessage"
         />
@@ -28,6 +32,8 @@
             ref="inputElement"
             :background-color="backgroundColor"
             :data-id="inputDataId"
+            :data-qa-id="dataQaId"
+            data-test-id="input"
             :disabled="disabled"
             :disabled-background-color="disabledBackgroundColor"
             :font-color="fontColor"
@@ -50,16 +56,20 @@
           />
           <IconWrapper
             v-if="inputType === 'password' && !isError"
+            data-test-id="password_visiblity_change_icon"
             size="20px"
             @click="toggleShowPassword()"
           >
             <Icon name="current_variant" size="20px" />
           </IconWrapper>
-          <IconWrapper v-if="hasError" size="16px">
+          <IconWrapper v-if="hasError" data-test-id="error_wrapper" size="16px">
             <Icon cursor="default" name="warning" size="16px" />
           </IconWrapper>
         </IconContainer>
-        <ErrorMessage v-if="hasError && hasErrorMessage">
+        <ErrorMessage
+          v-if="hasError && hasErrorMessage"
+          data-test-id="error_message_wrapper"
+        >
           {{ dynamicErrorMessage }}
         </ErrorMessage>
       </InputErrorWrapper>
@@ -237,93 +247,128 @@
       placeholder: {
         required: false,
         default: '',
+        type: String,
       },
       alignItems: {
         required: false,
         default: 'horizontal',
+        type: String,
+        validator(value) {
+          return ['horizontal', 'vertical'].includes(value)
+        },
       },
       isError: {
         required: false,
         default: false,
+        type: Boolean,
       },
       inputWidth: {
         required: false,
         default: null,
+        type: String,
       },
       inputHeight: {
         required: false,
         default: null,
+        type: String,
       },
       minWidth: {
         required: false,
         default: null,
+        type: String,
       },
       value: {
         required: true,
         default: null,
+        type: String,
       },
       errorMessage: {
         required: false,
         default: '',
+        type: String,
       },
       infoTextMessage: {
         required: false,
+        default: '',
+        type: String,
       },
       infoTextAlign: {
         required: false,
+        default: 'left',
+        type: String,
       },
       label: {
         required: false,
+        default: '',
+        type: String,
       },
       labelOptional: {
         required: false,
         default: false,
+        type: Boolean,
       },
       noBorder: {
         required: false,
         default: false,
+        type: Boolean,
       },
       disabled: {
         required: false,
         default: false,
+        type: Boolean,
       },
       fontSize: {
         required: false,
         default: null,
+        type: String,
       },
       inputType: {
         required: false,
         default: 'text',
+        type: String,
       },
       labelFontColor: {
         required: false,
         default: 'black',
+        type: String,
       },
       backgroundColor: {
         required: false,
+        type: String,
       },
       disabledBackgroundColor: {
         required: false,
         default: null,
+        type: String,
       },
       fontColor: {
         required: false,
         default: 'black',
+        type: String,
       },
       hasFocus: {
         required: false,
         default: false,
+        type: Boolean,
       },
       borderColor: {
         required: false,
+        type: String,
       },
       labelDataId: {
         required: false,
         default: '',
+        type: String,
       },
       inputDataId: {
         required: false,
         default: '',
+        type: String,
+      },
+      dataQaId: {
+        required: false,
+        default: '',
+        type: String,
       },
     },
     data() {
@@ -336,12 +381,10 @@
         return this.isError || this.error
       },
       hasErrorMessage() {
-        return (
-          (this.errorMessage && this.errorMessage.length > 0) || this.errMessage
-        )
+        return this.errorMessage && this.errorMessage.length > 0
       },
       dynamicErrorMessage() {
-        return this.errMessage || this.errorMessage
+        return this.errorMessage
       },
     },
     watch: {