@eturnity/eturnity_reusable_components 8.49.1 → 8.49.2-EPDM-16285.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eturnity/eturnity_reusable_components",
-  "version": "8.49.1",
+  "version": "8.49.2-EPDM-16285.0",
   "files": [
     "dist",
     "src"

package/src/components/accordion/Accordion.stories.js

@@ -1,4 +1,5 @@
 import Accordion from './index.vue'
+import theme from '@/assets/theme'
 
 export default {
   title: 'Accordion',
@@ -26,6 +27,9 @@ const Template = (args, { argTypes }) => ({
       </div>
   </template>
 </Accordion>`,
+  provide: {
+    theme,
+  },
 })
 
 export const Default = Template.bind({})

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

@@ -25,6 +25,7 @@
               : 'eturnityGrey'
           "
           :font-size="fontSize"
+          :font-weight="labelFontWeight"
           >{{ label }}
           <IsRequiredLabelStar v-if="isRequiredLabel" />
           <OptionalLabel v-if="labelOptional">
@@ -287,14 +288,14 @@
     overflow: hidden;`}
   `
 
-  const labelAttrs = { fontSize: String, fontColor: String }
+  const labelAttrs = { fontSize: String, fontColor: String, fontWeight: String }
   const InputLabel = styled('div', labelAttrs)`
     color: ${(props) =>
       props.theme.colors[props.fontColor]
         ? props.theme.colors[props.fontColor]
         : props.fontColor};
     font-size: ${(props) => props.fontSize};
-    font-weight: 700;
+    font-weight: ${(props) => props.fontWeight};
   `
   const OptionalLabel = styled.span`
     font-weight: 300;
@@ -539,6 +540,11 @@
       label: {
         required: false,
       },
+      labelFontWeight: {
+        required: false,
+        default: '700',
+        type: String,
+      },
       isRequiredLabel: {
         required: false,
         default: false,

package/src/components/selectedOptions/index.vue

@@ -382,9 +382,9 @@
         default: () => [],
       },
       numberSelected: {
-        type: Number,
         required: true,
         default: 0,
+        validator: (value) => value === null || typeof value === 'number',
       },
       selectedLabel: {
         type: String,

package/src/components/styledText/index.js

@@ -0,0 +1,76 @@
+import styled from 'vue3-styled-components'
+
+const TEXT_VARIANTS = {
+  HEADING_MEDIUM: 'heading-medium',
+  HEADING_LARGE: 'heading-large',
+  BODY_SMALL: 'body-small',
+  BODY_MEDIUM: 'body-medium',
+  BODY_LARGE: 'body-large',
+  SUBHEADING_SMALL: 'subheading-small',
+  SUBHEADING_MEDIUM: 'subheading-medium',
+  SUBHEADING_LARGE: 'subheading-large',
+}
+
+const textVariants = {
+  [TEXT_VARIANTS.HEADING_MEDIUM]: {
+    fontSize: '20px',
+    fontWeight: '500',
+    lineHeight: '130%',
+    letterSpacing: '-0.3px',
+  },
+  [TEXT_VARIANTS.HEADING_LARGE]: {
+    fontSize: '24px',
+    fontWeight: '500',
+    lineHeight: '130%',
+    letterSpacing: '-0.36px',
+  },
+  [TEXT_VARIANTS.SUBHEADING_SMALL]: {
+    fontSize: '12px',
+    fontWeight: '500',
+    lineHeight: '140%',
+    letterSpacing: '-0.12px',
+  },
+  [TEXT_VARIANTS.SUBHEADING_MEDIUM]: {
+    fontSize: '14px',
+    fontWeight: '500',
+    lineHeight: '140%',
+    letterSpacing: '-0.14px',
+  },
+  [TEXT_VARIANTS.SUBHEADING_LARGE]: {
+    fontSize: '16px',
+    fontWeight: '500',
+    lineHeight: '140%',
+    letterSpacing: '-0.16px',
+  },
+  [TEXT_VARIANTS.BODY_SMALL]: {
+    fontSize: '12px',
+    fontWeight: '400',
+    lineHeight: '150%',
+  },
+  [TEXT_VARIANTS.BODY_MEDIUM]: {
+    fontSize: '14px',
+    fontWeight: '400',
+    lineHeight: '150%',
+  },
+  [TEXT_VARIANTS.BODY_LARGE]: {
+    fontSize: '16px',
+    fontWeight: '400',
+    lineHeight: '150%',
+  },
+}
+
+const StyledText = styled('div', {
+  fontColor: String,
+  type: String,
+})`
+  color: ${(props) => props.fontColor};
+  font-style: normal;
+
+  font-size: ${(props) => textVariants[props.type]?.fontSize ?? '14px'};
+  font-weight: ${(props) => textVariants[props.type]?.fontWeight ?? '400'};
+  line-height: ${(props) => textVariants[props.type]?.lineHeight ?? '150%'};
+  letter-spacing: ${(props) =>
+    textVariants[props.type]?.letterSpacing ?? 'normal'};
+`
+
+export default StyledText