@integrigo/integrigo-ui 1.6.16-b → 1.6.16-d

package/lib/src/components/molecules/Checkbox/Checkbox.stories.d.ts

@@ -1,19 +1,19 @@
 import React from 'react';
 import { ComponentStory, ComponentMeta } from '@storybook/react';
-declare const _default: ComponentMeta<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
+declare const _default: ComponentMeta<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
     size?: "s" | "m" | "l" | "xl" | undefined;
     label?: string | undefined;
 } & React.RefAttributes<HTMLInputElement>>>;
 export default _default;
-export declare const Basic: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
+export declare const Basic: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
     size?: "s" | "m" | "l" | "xl" | undefined;
     label?: string | undefined;
 } & React.RefAttributes<HTMLInputElement>>>;
-export declare const Controlled: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
+export declare const Controlled: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
     size?: "s" | "m" | "l" | "xl" | undefined;
     label?: string | undefined;
 } & React.RefAttributes<HTMLInputElement>>>;
-export declare const WithLabel: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
+export declare const WithLabel: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
     size?: "s" | "m" | "l" | "xl" | undefined;
     label?: string | undefined;
 } & React.RefAttributes<HTMLInputElement>>>;

package/lib/src/components/molecules/Radio/Radio.stories.d.ts

@@ -1,20 +1,20 @@
 import React from 'react';
 import { ComponentMeta, ComponentStory } from '@storybook/react';
 import { Size } from './Radio';
-declare const _default: ComponentMeta<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
+declare const _default: ComponentMeta<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
     size?: Size | undefined;
     label?: string | undefined;
 } & React.RefAttributes<HTMLInputElement>>>;
 export default _default;
-export declare const Basic: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
+export declare const Basic: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
     size?: Size | undefined;
     label?: string | undefined;
 } & React.RefAttributes<HTMLInputElement>>>;
-export declare const Controlled: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
+export declare const Controlled: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
     size?: Size | undefined;
     label?: string | undefined;
 } & React.RefAttributes<HTMLInputElement>>>;
-export declare const WithLabel: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
+export declare const WithLabel: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
     size?: Size | undefined;
     label?: string | undefined;
 } & React.RefAttributes<HTMLInputElement>>>;

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "registry": "https://npm.pkg.github.com/integrigo"
   },
-  "version": "1.6.16b",
+  "version": "1.6.16d",
   "main": "lib/index.js",
   "module": "lib/index.esm.js",
   "types": "lib/index.d.ts",

package/src/components/atoms/Chip/Chip.tsx

@@ -162,15 +162,15 @@ const getVariantStyles = (variant: ChipVariant, clickable: boolean): string => {
       `;
     case ChipVariant.grey:
       return `
-        background-color: var(--shades-of-grey-40);
+        background-color: var(--shades-of-grey-20);
         
         ${clickable && `
           &:hover {
-            background-color: var(--shades-of-grey-60);
+            background-color: var(--shades-of-grey-40);
           }
           
           &:active {
-            background-color: var(--shades-of-grey-60);
+            background-color: var(--shades-of-grey-40);
           }
         `}
       `;

package/src/components/atoms/Initials/Initials.tsx

@@ -27,6 +27,7 @@ const Root = styled.div<{ size: number, color: string }>`
   background-color: ${p => p.color};
   color: var(--color-white);
   display: flex;
+  font-size: ${p => `calc(${p.size}px / 2)`};
   align-items: center;
   justify-content: center;
   text-transform: uppercase;

package/src/components/molecules/Profile/Profile.tsx

@@ -10,6 +10,14 @@ type ProfileProps = Partial<React.ComponentProps<typeof Avatar>> & {
   children?: React.ReactNode;
 };
 
+const fontSizeVariant = {
+  s: 12,
+  m: 16,
+  l: 20,
+  xl: 24,
+  xxl: 32,
+};
+
 const getInitials = (text: string): string =>
   text
     .split(' ')
@@ -32,7 +40,7 @@ export const Profile: React.FC<ProfileProps> = ({
     )}
 
     <Details>
-      <Name as="span">{name}</Name>
+      <Name as="span" size={size}>{name}</Name>
       {children}
     </Details>
   </Root>
@@ -46,8 +54,9 @@ const Root = styled.div`
 
 Root.displayName = 'Root';
 
-const Name = styled(Hero)`
+const Name = styled(Hero)<{ size: ProfileProps['size']}>`
   font-weight: var(--font-bold);
+  font-size: ${p => fontSizeVariant[p.size || 'm']}px;
 `;
 
 Name.displayName = 'Name';