@eturnity/eturnity_reusable_components 9.19.0 → 9.19.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eturnity/eturnity_reusable_components",
-  "version": "9.19.0",
+  "version": "9.19.1",
   "files": [
     "dist",
     "src"

package/src/TestChart.vue

@@ -77,7 +77,7 @@
   const options = [
     { label: 'Day', value: 'day' },
     { label: 'Month', value: 'month' },
-    { label: 'Year', value: 'year' },
+    { label: 'year', value: 'year' },
   ]
 
   const selectedTimeFrame = ref('day')

package/src/components/barchart/BottomFields.vue

@@ -25,11 +25,11 @@
             >
               <InputNumber
                 :allow-negative="false"
-                :data-qa-id="processedDataQaId({label: item.label, series})"
+                :data-qa-id="processedDataQaId({ label: item.label, series })"
                 :default-number="0"
                 :disabled="isInputsDisabled"
                 :error-message="getInputErrorMessage(series.data, item.label)"
-                :input-data-id="processedDataId({label: item.label, series})"
+                :input-data-id="processedDataId({ label: item.label, series })"
                 input-height="36px"
                 :is-disabled-styled-only="true"
                 :is-error="getIsError(series.data, item.label)"
@@ -39,7 +39,7 @@
                     : false
                 "
                 :is-relative-error-message="true"
-                :label-data-id="`${processedDataId({label: item.label, series})}_label`"
+                :label-data-id="`${processedDataId({ label: item.label, series })}_label`"
                 :min-decimals="0"
                 :number-precision="fieldMode === 'percentage' ? 2 : 0"
                 text-align="center"
@@ -56,11 +56,7 @@
           <TotalInputRow v-if="fieldMode === 'percentage'">
             <LabelsColumn :width="yAxisWidth">
               <TotalRow v-if="seriesData.length">
-                {{
-                  $gettext
-                    ? `${$gettext('loadprofile_total')} (%)`
-                    : 'Total (%)'
-                }}
+                {{ $gettext ? `${$gettext('Total')} (%)` : 'Total (%)' }}
               </TotalRow>
             </LabelsColumn>
             <InputGroup
@@ -71,14 +67,14 @@
             >
               <InputNumber
                 :allow-negative="false"
-                :data-qa-id="processedDataQaId({label: item.label, series})"
+                :data-qa-id="processedDataQaId({ label: item.label, series })"
                 :default-number="0"
                 :disabled="isInputsDisabled"
                 input-height="36px"
                 :is-disabled-styled-only="true"
                 :is-read-only="true"
-                :input-data-id="processedDataId({label: item.label, series})"
-                :label-data-id="`${processedDataId({label: item.label, series})}_label`"
+                :input-data-id="processedDataId({ label: item.label, series })"
+                :label-data-id="`${processedDataId({ label: item.label, series })}_label`"
                 :min-decimals="0"
                 :number-precision="fieldMode === 'percentage' ? 2 : 0"
                 text-align="center"
@@ -91,11 +87,7 @@
           <TotalInputRow>
             <LabelsColumn :width="yAxisWidth">
               <TotalRow v-if="seriesData.length">
-                {{
-                  $gettext
-                    ? `${$gettext('loadprofile_total')} (kWh)`
-                    : 'Total (kWh)'
-                }}
+                {{ $gettext ? `${$gettext('Total')} (kWh)` : 'Total (kWh)' }}
               </TotalRow>
             </LabelsColumn>
             <InputGroup
@@ -105,9 +97,9 @@
               :is-scrollable="isScrollable"
             >
               <InputNumber
-                :data-qa-id="processedDataQaId({label: item.label, series})"
+                :data-qa-id="processedDataQaId({ label: item.label, series })"
                 :default-number="0"
-                :input-data-id="processedDataId({label: item.label, series})"
+                :input-data-id="processedDataId({ label: item.label, series })"
                 input-height="36px"
                 :is-border-error-only="true"
                 :is-info-border="
@@ -116,7 +108,7 @@
                     : false
                 "
                 :is-read-only="true"
-                :label-data-id="`${processedDataId({label: item.label, series})}_label`"
+                :label-data-id="`${processedDataId({ label: item.label, series })}_label`"
                 :min-decimals="0"
                 :number-precision="0"
                 text-align="center"
@@ -138,14 +130,14 @@
             >
               <InputNumber
                 :allow-negative="false"
-                :data-qa-id="processedDataQaId({label: item.label})"
+                :data-qa-id="processedDataQaId({ label: item.label })"
                 :disabled="isInputsDisabled"
                 :error-message="item.errorMessage"
-                :input-data-id="processedDataId({label: item.label})"
+                :input-data-id="processedDataId({ label: item.label })"
                 input-height="36px"
                 :is-disabled-styled-only="true"
                 :is-error="item.isError"
-                :label-data-id="`${processedDataId({label: item.label})}_label`"
+                :label-data-id="`${processedDataId({ label: item.label })}_label`"
                 :min-decimals="0"
                 :number-precision="0"
                 text-align="center"

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

@@ -16,7 +16,7 @@
           {{ label }}
           <IsRequiredLabelStar v-if="isRequiredLabel" />
           <OptionalLabel v-if="labelOptional" data-test-id="label_optional">
-            ({{ $gettext('Optional') }})
+            ({{ $gettext('optional') }})
           </OptionalLabel>
         </InputLabel>
         <InfoText
@@ -119,8 +119,8 @@
       props.theme.colors[props.labelFontColor]
         ? props.theme.colors[props.labelFontColor]
         : props.labelFontColor
-        ? props.labelFontColor
-        : props.theme.colors.eturnityGrey};
+          ? props.labelFontColor
+          : props.theme.colors.eturnityGrey};
 
     font-size: ${(props) => (props.fontSize ? props.fontSize : '13px')};
     font-weight: 700;
@@ -163,20 +163,20 @@
       props.noBorder
         ? 'none'
         : props.isError
-        ? '1px solid ' + props.theme.colors.red
-        : props.borderColor
-        ? props.theme.colors[props.borderColor]
-          ? '1px solid ' + props.theme.colors[props.borderColor]
-          : '1px solid ' + props.borderColor
-        : '1px solid ' + props.theme.colors.grey4};
+          ? '1px solid ' + props.theme.colors.red
+          : props.borderColor
+            ? props.theme.colors[props.borderColor]
+              ? '1px solid ' + props.theme.colors[props.borderColor]
+              : '1px solid ' + props.borderColor
+            : '1px solid ' + props.theme.colors.grey4};
     padding: ${(props) =>
       props.isError
         ? '11px 25px 11px 10px'
         : props.inputType === 'password'
-        ? '11px 25px 11px 10px'
-        : props.defaultPadding
-        ? '10px 35px 10px 15px'
-        : '11px 5px 11px 10px'};
+          ? '11px 25px 11px 10px'
+          : props.defaultPadding
+            ? '10px 35px 10px 15px'
+            : '11px 5px 11px 10px'};
     border-radius: 4px;
     position: relative;
     font-size: ${(props) => (props.fontSize ? props.fontSize : '16px')};
@@ -184,8 +184,8 @@
       props.isDisabled
         ? props.theme.colors.grey2
         : props.fontColor
-        ? props.fontColor + ' !important'
-        : props.theme.colors.black};
+          ? props.fontColor + ' !important'
+          : props.theme.colors.black};
 
     width: ${(props) => (props.inputWidth ? props.inputWidth : '100%')};
     min-width: ${(props) => (props.minWidth ? props.minWidth : 'unset')};
@@ -199,8 +199,8 @@
           ? props.disabledBackgroundColor + ' !important'
           : props.theme.colors.grey5
         : props.backgroundColor
-        ? props.backgroundColor + ' !important'
-        : props.theme.colors.white};
+          ? props.backgroundColor + ' !important'
+          : props.theme.colors.white};
     &::placeholder {
       color: ${(props) => props.theme.colors.grey2};
     }

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

@@ -29,7 +29,7 @@
           >{{ label }}
           <IsRequiredLabelStar v-if="isRequiredLabel" />
           <OptionalLabel v-if="labelOptional">
-            ({{ $gettext('Optional') }})</OptionalLabel
+            ({{ $gettext('optional') }})</OptionalLabel
           >
         </InputLabel>
         <InfoText
@@ -50,10 +50,10 @@
             buttonBgColor
               ? buttonBgColor
               : colorMode == 'dark'
-              ? 'transparentBlack1'
-              : colorMode == 'transparent'
-              ? 'transparent'
-              : 'white'
+                ? 'transparentBlack1'
+                : colorMode == 'transparent'
+                  ? 'transparent'
+                  : 'white'
           "
           class="select-button"
           :color-mode="colorMode"
@@ -171,8 +171,8 @@
                 colorMode == 'dark'
                   ? '#000000'
                   : colorMode == 'transparent'
-                  ? 'grey6'
-                  : dropdownBgColor
+                    ? 'grey6'
+                    : dropdownBgColor
               "
               :hovered-index="hoveredIndex"
               :hovered-value="hoveredValue"
@@ -365,23 +365,23 @@
           ? 'padding: 10px 15px 10px 5px;'
           : 'padding: 10px 15px;'
         : props.isSearchBarVisible
-        ? ''
-        : `padding-left: ${
-            props.hasNoPadding
-              ? '0'
-              : props.tablePaddingLeft
-              ? props.tablePaddingLeft
-              : props.paddingLeft
-          }`};
+          ? ''
+          : `padding-left: ${
+              props.hasNoPadding
+                ? '0'
+                : props.tablePaddingLeft
+                  ? props.tablePaddingLeft
+                  : props.paddingLeft
+            }`};
     text-align: ${(props) => (props.textCenter ? 'center' : 'left')};
     min-height: ${(props) =>
       props.selectHeight
         ? props.selectHeight
         : props.selectMinHeight
-        ? props.selectMinHeight
-        : props.height
-        ? props.height
-        : '36px'};
+          ? props.selectMinHeight
+          : props.height
+            ? props.height
+            : '36px'};
     display: flex;
     align-items: center;
     height: ${(props) => props.selectHeight};
@@ -389,8 +389,8 @@
       showBorder &&
       `
     border: ${BORDER_WIDTH} solid ${
-        hasError ? theme.colors.red : theme.colors.grey4
-      }
+      hasError ? theme.colors.red : theme.colors.grey4
+    }
   `}
     opacity: ${(props) =>
       props.colorMode === 'transparent' && props.disabled ? '0.4' : '1'};
@@ -398,18 +398,18 @@
       props.colorMode === 'transparent'
         ? 'transparent'
         : props.disabled && props.showDisabledBackground
-        ? props.theme.colors.grey5
-        : props.theme.colors[props.bgColor]
-        ? props.theme.colors[props.bgColor]
-        : props.bgColor} !important;
+          ? props.theme.colors.grey5
+          : props.theme.colors[props.bgColor]
+            ? props.theme.colors[props.bgColor]
+            : props.bgColor} !important;
     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.fontColor};
+          ? props.theme.colors.black
+          : props.theme.colors[props.fontColor]
+            ? props.theme.colors[props.fontColor]
+            : props.fontColor};
     ${(props) => (props.disabled ? 'pointer-events: none' : '')};
     overflow: hidden;
     & > .handle {
@@ -458,8 +458,8 @@
       props.minWidth
         ? props.minWidth
         : props.optionWidth
-        ? props.optionWidth
-        : '100%'};
+          ? props.optionWidth
+          : '100%'};
     background-color: ${(props) =>
       props.theme.colors[props.bgColor]
         ? props.theme.colors[props.bgColor]

package/src/components/label/index.vue

@@ -4,7 +4,7 @@
       <slot></slot>
       <IsRequiredLabelStar v-if="isRequiredLabel" />
       <OptionalLabel v-if="labelOptional">
-        ({{ $gettext('Optional') }})
+        ({{ $gettext('optional') }})
       </OptionalLabel>
     </InputLabel>
     <InfoText
@@ -27,8 +27,8 @@
       props.theme.colors[props.labelFontColor]
         ? props.theme.colors[props.labelFontColor]
         : props.labelFontColor
-        ? props.labelFontColor
-        : props.theme.colors.eturnityGrey};
+          ? props.labelFontColor
+          : props.theme.colors.eturnityGrey};
 
     font-size: ${(props) => (props.fontSize ? props.fontSize : '13px')};
     font-weight: 700;

package/src/components/selectedOptions/index.vue

@@ -106,11 +106,11 @@
   // optionsList = [
   //   {
   //     type: 'export',
-  //     name: 'Export'
+  //     name: 'export'
   //   },
   //   {
   //     type: 'export',
-  //     name: 'Export'
+  //     name: 'export'
   //     ...
   //     add component parameter if we were passing a component to the selected options
   //     component: 'set_supplier'
@@ -281,8 +281,8 @@
         props.disabled
           ? props.theme.colors.grey3
           : props.hoverColor
-          ? props.theme.colors[props.hoverColor]
-          : props.theme.colors.white};
+            ? props.theme.colors[props.hoverColor]
+            : props.theme.colors.white};
     }
   `
 

package/src/components/selectedOptions/selectedOptions.stories.js

@@ -44,7 +44,7 @@ Default.args = {
   optionsList: [
     {
       type: 'export',
-      name: 'Export',
+      name: 'export',
     },
     {
       type: 'delete',
@@ -60,7 +60,7 @@ WithDisabledOptions.args = {
   optionsList: [
     {
       type: 'export',
-      name: 'Export',
+      name: 'export',
     },
     {
       type: 'delete',
@@ -77,7 +77,7 @@ WithCustomComponent.args = {
   optionsList: [
     {
       type: 'export',
-      name: 'Export',
+      name: 'export',
     },
     {
       type: 'set_supplier',
@@ -93,7 +93,7 @@ ManyOptions.args = {
   optionsList: [
     {
       type: 'export',
-      name: 'Export',
+      name: 'export',
     },
     {
       type: 'delete',
@@ -127,7 +127,7 @@ CustomLabels.args = {
   optionsList: [
     {
       type: 'export',
-      name: 'Export',
+      name: 'export',
     },
     {
       type: 'delete',
@@ -150,7 +150,7 @@ CustomLabels.args = {
 //   },
 //   {
 //     type: 'export',
-//     name: 'Export'
+//     name: 'export'
 //     ...
 //     add component parameter if we were passing a component to the selected options (see below)
 //     component: 'set_supplier'
@@ -202,7 +202,7 @@ export const Expanded = {
     optionsList: [
       {
         type: 'export',
-        name: 'Export',
+        name: 'export',
       },
       {
         type: 'export_page',
@@ -228,7 +228,7 @@ export const Expanded = {
     expandedOptions: [
       {
         type: 'export',
-        name: 'Export',
+        name: 'export',
       },
       {
         type: 'export_page',

package/src/components/tables/mainTable/MainTable.stories.js

@@ -76,7 +76,7 @@ Default.args = {
   cellPaddings: '6px 6px 7px 4px',
   isLoading: false,
   isOverflowHidden: true,
-  titleText: 'Projects',
+  titleText: 'projects',
   hasAimHover: false,
   tableCursor: 'pointer',
 }