@goodhood-web/ui 1.1.0-development.2 → 1.1.0-development.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (19) hide show
  1. package/index.d.ts +2 -1
  2. package/index.js +18 -16
  3. package/index.mjs +1492 -1331
  4. package/lib/BaseButton/BaseButton.d.ts +3 -1
  5. package/lib/Icon/icons/32x32/index.d.ts +3 -0
  6. package/lib/Icon/icons/index.d.ts +3 -0
  7. package/lib/MenuItem/MenuItem.d.ts +1 -1
  8. package/lib/MenuItem/MenuItem.types.d.ts +3 -1
  9. package/lib/SmartLink/SmartLink.d.ts +3 -0
  10. package/lib/SmartLink/SmartLink.types.d.ts +10 -0
  11. package/lib/TextButton/TextButton.d.ts +8 -0
  12. package/lib/TextButton/TextButton.types.d.ts +12 -0
  13. package/lib/TextInput/TextInput.d.ts +3 -0
  14. package/lib/TextInput/TextInput.types.d.ts +11 -0
  15. package/lib/Typography/Typography.types.d.ts +1 -1
  16. package/package.json +3 -2
  17. package/style.css +1 -1
  18. package/styles/_design-tokens.scss +1 -0
  19. package/styles/_functions.scss +25 -0
package/lib/BaseButton/BaseButton.d.ts CHANGED
@@ -1,11 +1,13 @@
1
- /// <reference types="react" />
2
1
  import { ButtonOwnProps } from '@mui/base';
2
+ import { AriaRole } from 'react';
3
3
  export interface BaseButtonProps extends ButtonOwnProps {
4
4
  ariaLabel?: string;
5
5
  ariaLabelledBy?: string;
6
6
  className?: string;
7
+ disabled?: boolean;
7
8
  onClick: () => void;
8
9
  ref?: React.ForwardedRef<null>;
10
+ role?: AriaRole;
9
11
  }
10
12
  declare const BaseButton: (props: BaseButtonProps) => import("react/jsx-runtime").JSX.Element;
11
13
  export default BaseButton;
package/lib/Icon/icons/32x32/index.d.ts CHANGED
@@ -144,6 +144,9 @@ declare const IconsMap: {
144
144
  readonly list: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
145
145
  title?: string | undefined;
146
146
  }>;
147
+ readonly log_in: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
148
+ title?: string | undefined;
149
+ }>;
147
150
  readonly log_out: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
148
151
  title?: string | undefined;
149
152
  }>;
package/lib/Icon/icons/index.d.ts CHANGED
@@ -273,6 +273,9 @@ declare const iconsMap: {
273
273
  readonly list: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
274
274
  title?: string | undefined;
275
275
  }>;
276
+ readonly log_in: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
277
+ title?: string | undefined;
278
+ }>;
276
279
  readonly log_out: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
277
280
  title?: string | undefined;
278
281
  }>;
package/lib/MenuItem/MenuItem.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import { MenuItemProps } from './MenuItem.types';
2
- declare const MenuItem: ({ isSelected, labelPillText, leftIcon, onClick, rightIcon, text, }: MenuItemProps) => import("react/jsx-runtime").JSX.Element;
2
+ declare const MenuItem: ({ isSelected, labelPillText, leftIcon, onClick, rightIcon, role, text, }: MenuItemProps) => import("react/jsx-runtime").JSX.Element;
3
3
  export default MenuItem;
package/lib/MenuItem/MenuItem.types.d.ts CHANGED
@@ -1,9 +1,11 @@
1
1
  import { ReactNode } from 'react';
2
+ import { BaseButtonProps } from '../BaseButton/BaseButton';
2
3
  export interface MenuItemProps {
3
4
  isSelected?: boolean;
4
5
  labelPillText?: string;
5
6
  leftIcon: ReactNode;
6
- onClick: () => void;
7
+ onClick: BaseButtonProps['onClick'];
7
8
  rightIcon?: ReactNode;
9
+ role?: BaseButtonProps['role'];
8
10
  text: string;
9
11
  }
package/lib/SmartLink/SmartLink.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ import { SmartLinkProps } from './SmartLink.types';
2
+ export declare function SmartLink({ ariaLabel, ariaLabelledBy, as, className, href, label, onClick, target, type, }: SmartLinkProps): import("react/jsx-runtime").JSX.Element;
3
+ export default SmartLink;
package/lib/SmartLink/SmartLink.types.d.ts ADDED
@@ -0,0 +1,10 @@
1
+ import { BaseButtonProps } from '../BaseButton/BaseButton';
2
+ import { TypographyProps } from '../Typography/Typography.types';
3
+ export interface SmartLinkProps extends Omit<BaseButtonProps, 'type' | 'role' | 'onClick'> {
4
+ as?: TypographyProps['as'];
5
+ href?: string;
6
+ label: string;
7
+ onClick?: () => void;
8
+ target?: string;
9
+ type?: TypographyProps['type'];
10
+ }
package/lib/TextButton/TextButton.d.ts ADDED
@@ -0,0 +1,8 @@
1
+ import { TextButtonProps } from './TextButton.types';
2
+ export declare const typographyType: {
3
+ large: string;
4
+ medium: string;
5
+ small: string;
6
+ };
7
+ export declare function TextButton({ ariaLabel, ariaLabelledBy, color, disabled, leftIcon, onClick, ref, rightIcon, size, text, }: TextButtonProps): import("react/jsx-runtime").JSX.Element;
8
+ export default TextButton;
package/lib/TextButton/TextButton.types.d.ts ADDED
@@ -0,0 +1,12 @@
1
+ /// <reference types="react" />
2
+ import { BaseButtonProps } from '../BaseButton/BaseButton';
3
+ import { IconProps } from '../Icon/Icon.types';
4
+ import { NotificationBubbleProps } from '../NotificationBubble/NotificationBubble.types';
5
+ export interface TextButtonProps extends Omit<BaseButtonProps, 'role' | 'className'> {
6
+ color: 'green' | 'blue' | 'text';
7
+ leftIcon?: React.ReactElement<IconProps | NotificationBubbleProps>;
8
+ onClick: () => void;
9
+ rightIcon?: React.ReactElement<IconProps | NotificationBubbleProps>;
10
+ size: 'large' | 'medium' | 'small';
11
+ text: string;
12
+ }
package/lib/TextInput/TextInput.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ import { TextInputProps } from './TextInput.types';
2
+ declare const TextInput: ({ colorScheme, errorMessage, id, label, name, ref, size, ...props }: TextInputProps) => import("react/jsx-runtime").JSX.Element;
3
+ export default TextInput;
package/lib/TextInput/TextInput.types.d.ts ADDED
@@ -0,0 +1,11 @@
1
+ /// <reference types="react" />
2
+ import { UseInputParameters } from '@mui/base/useInput';
3
+ export interface TextInputProps extends UseInputParameters {
4
+ colorScheme: 'light' | 'dark';
5
+ errorMessage?: string;
6
+ id: string;
7
+ label: string;
8
+ name?: string;
9
+ ref?: React.ForwardedRef<null>;
10
+ size: 'small' | 'medium';
11
+ }
package/lib/Typography/Typography.types.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import { JSX } from 'react';
2
- export type TypographyType = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'h7' | 'h8' | 'body-large' | 'body-regular' | 'body-semibold' | 'body-italic' | 'detail-medium' | 'detail-bold' | 'detail-upper-case';
2
+ export type TypographyType = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'h7' | 'h8' | 'body-large' | 'body-regular' | 'body-semibold' | 'body-italic' | 'detail-medium' | 'detail-bold' | 'detail-upper-case' | 'detail-regular';
3
3
  export interface TypographyProps {
4
4
  as?: Extract<keyof JSX.IntrinsicElements, 'span' | 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'>;
5
5
  children: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@goodhood-web/ui",
3
- "version": "1.1.0-development.2",
3
+ "version": "1.1.0-development.21",
4
4
  "main": "./index.js",
5
5
  "types": "./index.d.ts",
6
6
  "exports": {
@@ -15,6 +15,7 @@
15
15
  },
16
16
  "private": false,
17
17
  "peerDependencies": {
18
- "@mui/base": "^5.0.0-beta.27"
18
+ "@mui/base": "^5.0.0-beta.30",
19
+ "@goodhood/design-tokens": "1.0.0-dev.24"
19
20
  }
20
21
  }
package/style.css CHANGED
@@ -1 +1 @@
1
- ._baseBtn_1r0xb_5{min-width:2rem;min-height:2rem;border:none;border-radius:0;cursor:pointer}._baseBtn--active_1r0xb_12{background:#b1b1b1}._root_ann27_5{display:flex;overflow:hidden;width:100%;flex-direction:column;padding:16px;background-color:#fff;box-shadow:0 2px 8px #0000001a;color:#201649}._root--border-radius_ann27_15{border-radius:8px}._root_kfd82_5{padding:8px 0;color:inherit}._iconComponent_s85d7_5{display:block}._iconComponent_s85d7_5 path{stroke:currentColor}._iconButton_51nxe_5{display:flex;width:auto;min-width:unset;height:auto;min-height:unset;flex-shrink:0;align-items:center;justify-content:center;color:#201649}._iconButton_51nxe_5:disabled{background:none}._iconButton_51nxe_5:hover,._iconButton_51nxe_5:active{background:none}._iconButton--circular_51nxe_25{border-radius:50%;background:#cae85d}._iconButton--circular_51nxe_25:disabled{background:#ffffff}._iconButton--circular_51nxe_25:hover{background:#b5d622}._iconButton--circular_51nxe_25:active{background:#cae85d}._iconButton--circular-small_51nxe_38{width:40px;height:40px}._iconButton--circular-medium_51nxe_42{width:48px;height:48px}._iconButton--circular-large_51nxe_46{width:56px;height:56px}._root_9ve6u_5{display:flex;align-items:center;padding-bottom:12px;color:inherit;gap:8px}._title_9ve6u_13{flex-grow:1;margin:0}._h1_1ohbl_5{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:32px;font-weight:500;letter-spacing:0;line-height:40px;text-decoration:none;text-indent:0px;text-transform:none}._h2_1ohbl_17{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:24px;font-weight:Semi Bold;letter-spacing:0;line-height:32px;text-decoration:none;text-indent:0px;text-transform:none}._h3_1ohbl_29{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:20px;font-weight:Semi Bold;letter-spacing:0;line-height:24px;text-decoration:none;text-indent:0px;text-transform:none}._h4_1ohbl_41{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:18px;font-weight:700;letter-spacing:0;line-height:24px;text-decoration:none;text-indent:0px;text-transform:none}._h5_1ohbl_53{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:16px;font-weight:Semi Bold;letter-spacing:0;line-height:24px;text-decoration:none;text-indent:0px;text-transform:none}._h6_1ohbl_65{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:14px;font-weight:700;letter-spacing:1;line-height:24px;text-decoration:none;text-indent:0px;text-transform:uppercase}._h7_1ohbl_77{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:12px;font-weight:Extra Bold;letter-spacing:1;line-height:16px;text-decoration:none;text-indent:0px;text-transform:uppercase}._h8_1ohbl_89{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:10px;font-weight:Extra Bold;letter-spacing:1.5;line-height:16px;text-decoration:none;text-indent:0px;text-transform:uppercase}._body-large_1ohbl_101{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:16px;font-weight:500;letter-spacing:0;line-height:24px;text-decoration:none;text-indent:0px;text-transform:none}._body-regular_1ohbl_113{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:14px;font-weight:400;letter-spacing:0;line-height:24px;text-decoration:none;text-indent:0px;text-transform:none}._body-semibold_1ohbl_125{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:14px;font-weight:Semi Bold;letter-spacing:0;line-height:24px;text-decoration:none;text-indent:0px;text-transform:none}._body-italic_1ohbl_137{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:14px;font-weight:Italic;letter-spacing:0;line-height:24px;text-decoration:none;text-indent:0px;text-transform:none}._detail-medium_1ohbl_149{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:12px;font-weight:500;letter-spacing:0;line-height:16px;text-decoration:none;text-indent:0px;text-transform:none}._detail-bold_1ohbl_161{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:12px;font-weight:700;letter-spacing:0;line-height:16px;text-decoration:none;text-indent:0px;text-transform:none}._detail-upper-case_1ohbl_173{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:10px;font-weight:Extra Bold;letter-spacing:0;line-height:16px;text-decoration:none;text-indent:0px;text-transform:uppercase}._ccBtn_1a3lk_5{display:flex;width:100%;height:40px;align-items:center;align-self:stretch;padding:8px 16px;border-color:transparent;border-radius:12px;background-color:#f4f3f6;color:#201649;cursor:pointer;font-size:14px}._dividerContainer_zbq8i_5{display:flex;align-items:center}._dividerLine_zbq8i_10{height:1px;flex-grow:1;background-color:#d2d0db}._fieldset_nicjl_5{border:none}._labelPill_1rbex_5{display:inline-flex;align-items:center;justify-content:center;border-radius:16px;background:#01819C}._labelPill_1rbex_5 span{color:#fff;line-height:16px;text-align:center}._labelPill--small_1rbex_17{height:20px;padding:0 8px}._labelPill--small_1rbex_17 span{font-size:10px;font-weight:800;text-transform:uppercase}._labelPill--medium_1rbex_26{padding:4px 8px}._labelPill--medium_1rbex_26 span{font-size:12px;font-weight:700}._legend_121jx_5{display:flex;flex-direction:column;padding-bottom:12px;gap:8px}._legend_121jx_5 ._text_121jx_11{color:#635c80}._menuItem_1lgof_5{display:flex;width:100%;flex-shrink:0;align-items:center;padding:0 8px;background-color:#fff;color:#201649;cursor:pointer;gap:8px;text-decoration:none}._menuItem_1lgof_5 ._highlightFrame_1lgof_17{display:flex;flex:1;align-items:center;padding:8px;border-radius:8px;gap:8px}._menuItem_1lgof_5 ._rightIcon_1lgof_25{display:inherit;margin-left:auto}._menuItem_1lgof_5 ._rightIcon_1lgof_25 svg path{stroke:#635c80!important}._menuItem--selected_1lgof_32 ._highlightFrame_1lgof_17{background-color:#f2fbc4}._menuItem--selected_1lgof_32 ._highlightFrame_1lgof_17 svg path{stroke:#738c00}._menuItem--selected_1lgof_32:hover{color:#738c00}._menuItem_1lgof_5:not(._menuItem--selected_1lgof_32):active{background-color:#f4f3f6}._menuItem_1lgof_5:not(._menuItem--selected_1lgof_32):hover{color:#635c80}._menuItem_1lgof_5:not(._menuItem--selected_1lgof_32):hover svg path{stroke:#635c80}._menuItem_1lgof_5:not(._menuItem--selected_1lgof_32):hover ._highlightFrame_1lgof_17{background-color:#f4f3f6}._bubbleContent_1p3aw_5{position:relative;display:inline-block}._bubble_1p3aw_5{position:absolute;z-index:auto;top:6px;right:6px;display:flex;width:20px;height:20px;align-items:center;justify-content:center;border-radius:50%;background-color:#ff9de2;color:#201649;font-size:12px;font-weight:700;text-align:center;transform:translate(50%,-50%);transform-origin:100% 0;white-space:nowrap}._bubble--empty_1p3aw_30{width:12px;height:12px}._root_154gi_12{position:relative;overflow:hidden;flex-shrink:0;border:solid 1px #d2d0db;background-color:#d2d0db}._root--24_154gi_19{width:24px;height:24px}._root--28_154gi_23{width:28px;height:28px}._root--32_154gi_27{width:32px;height:32px}._root--40_154gi_31{width:40px;height:40px}._root--48_154gi_35{width:48px;height:48px}._root--56_154gi_39{width:56px;height:56px}._root--64_154gi_43{width:64px;height:64px}._root--80_154gi_47{width:80px;height:80px}._root--120_154gi_51{width:120px;height:120px}._root--280_154gi_55{width:280px;height:280px}._root--square_154gi_59._root--24_154gi_19,._root--square_154gi_59._root--32_154gi_27{border-radius:4px}._root--square_154gi_59._root--40_154gi_31,._root--square_154gi_59._root--48_154gi_35{border-radius:8px}._root--square_154gi_59._root--56_154gi_39,._root--square_154gi_59._root--64_154gi_43{border-radius:12px}._root--square_154gi_59._root--80_154gi_47,._root--square_154gi_59._root--120_154gi_51{border-radius:16px}._root--circular_154gi_71{border-radius:50%}._root--isPlaceholder_154gi_74:before{position:absolute;z-index:1;width:100%;height:100%;background-color:#d2d0db;content:"";opacity:.4}._root_154gi_12 img{width:100%;height:100%;object-fit:cover}._switch_wzvtf_5{position:relative;display:inline-block;width:48px;height:28px}._switch_wzvtf_5 input{position:absolute;z-index:2;width:48px;height:28px;cursor:pointer;opacity:0}._switch_wzvtf_5 ._slider_wzvtf_19{z-index:1;display:block;width:100%;height:100%;border-radius:34px;background-color:#e9e8ed;box-shadow:0 1px 3px #0003 inset;cursor:pointer;transition:.4s}._switch_wzvtf_5 ._slider_wzvtf_19:before{position:absolute;right:3px;bottom:2px;width:24px;height:24px;border-radius:50%;background-color:#fff;box-shadow:0 0 2px #0003;content:"";transform:translate(-18px);transition:.4s}._switch_wzvtf_5 ._slider_wzvtf_19._focusVisible_wzvtf_43{box-shadow:0 0 0 3px #cae85d}._switch_wzvtf_5 input:checked+._slider_wzvtf_19{background-color:#b5d622}._switch_wzvtf_5 input:checked+._slider_wzvtf_19:before{transform:translate(0)}._toggleInput_1oelr_5{display:flex;width:100%;align-items:center;padding:8px 16px;background-color:#fff;color:#635c80;cursor:pointer;gap:12px}._toggleInput_1oelr_5 svg{flex-shrink:0}._toggleInput_1oelr_5 ._textLabel_1oelr_18{flex-grow:1}._toggleInput_1oelr_5 ._switch_1oelr_21{flex-shrink:0}._toggleInput--checked_1oelr_24{color:#201649}._toggleInput--withBorder_1oelr_27{padding:12px 16px;border-radius:16px;box-shadow:inset 0 0 0 1px #d2d0db}
1
+ ._baseBtn_139o5_9{min-width:2rem;min-height:2rem;border:none;border-radius:0;cursor:pointer}._root_ybv6b_9{display:flex;overflow:hidden;width:100%;flex-direction:column;padding:16px;background-color:#fff;box-shadow:0 2px 8px #0000001a;color:#201649}._root--border-radius_ybv6b_19{border-radius:8px}._root_16qu1_9{padding:8px 0;color:inherit}._iconComponent_l8e8p_9{display:block}._iconComponent_l8e8p_9 path{stroke:currentColor}._iconButton_1exhv_9{display:flex;width:auto;min-width:unset;height:auto;min-height:unset;flex-shrink:0;align-items:center;justify-content:center;color:#201649}._iconButton_1exhv_9:disabled{background:none}._iconButton_1exhv_9:hover,._iconButton_1exhv_9:active{background:none}._iconButton--circular_1exhv_29{border-radius:50%;background:#cae85d}._iconButton--circular_1exhv_29:disabled{background:#ffffff}._iconButton--circular_1exhv_29:hover{background:#b5d622}._iconButton--circular_1exhv_29:active{background:#cae85d}._iconButton--circular-small_1exhv_42{width:40px;height:40px}._iconButton--circular-medium_1exhv_46{width:48px;height:48px}._iconButton--circular-large_1exhv_50{width:56px;height:56px}._root_9dqi9_9{display:flex;align-items:center;padding-bottom:12px;color:inherit;gap:8px}._title_9dqi9_17{flex-grow:1;margin:0}._h1_4692r_9{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:32px;font-weight:500;letter-spacing:0;line-height:40px;text-decoration:none;text-indent:0px;text-transform:none}._h2_4692r_21{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:24px;font-weight:600;letter-spacing:0;line-height:32px;text-decoration:none;text-indent:0px;text-transform:none}._h3_4692r_33{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:20px;font-weight:600;letter-spacing:0;line-height:24px;text-decoration:none;text-indent:0px;text-transform:none}._h4_4692r_45{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:18px;font-weight:700;letter-spacing:0;line-height:24px;text-decoration:none;text-indent:0px;text-transform:none}._h5_4692r_57{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:16px;font-weight:600;letter-spacing:0;line-height:24px;text-decoration:none;text-indent:0px;text-transform:none}._h6_4692r_69{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:14px;font-weight:700;letter-spacing:1px;line-height:24px;text-decoration:none;text-indent:0px;text-transform:uppercase}._h7_4692r_81{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:12px;font-weight:800;letter-spacing:1px;line-height:16px;text-decoration:none;text-indent:0px;text-transform:uppercase}._h8_4692r_93{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:10px;font-weight:800;letter-spacing:1.5px;line-height:16px;text-decoration:none;text-indent:0px;text-transform:uppercase}._body-large_4692r_105{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:16px;font-weight:500;letter-spacing:0;line-height:24px;text-decoration:none;text-indent:0px;text-transform:none}._body-regular_4692r_117{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:14px;font-weight:400;letter-spacing:0;line-height:20px;text-decoration:none;text-indent:0px;text-transform:none}._body-semibold_4692r_129{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:14px;font-weight:600;letter-spacing:0;line-height:20px;text-decoration:none;text-indent:0px;text-transform:none}._body-italic_4692r_141{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:14px;font-weight:400;letter-spacing:0;line-height:20px;text-decoration:none;text-indent:0px;text-transform:none}._detail-medium_4692r_153{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:12px;font-weight:500;letter-spacing:0;line-height:16px;text-decoration:none;text-indent:0px;text-transform:none}._detail-bold_4692r_165{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:12px;font-weight:700;letter-spacing:0;line-height:16px;text-decoration:none;text-indent:0px;text-transform:none}._detail-upper-case_4692r_177{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:10px;font-weight:800;letter-spacing:0;line-height:16px;text-decoration:none;text-indent:0px;text-transform:uppercase}._detail-regular_4692r_189{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:12px;font-weight:400;letter-spacing:0;line-height:16px;text-decoration:none;text-indent:0px;text-transform:none}._ccBtn_xa0b7_9{display:flex;width:100%;height:40px;align-items:center;align-self:stretch;padding:8px 16px;border-color:transparent;border-radius:12px;background-color:#f4f3f6;color:#201649;cursor:pointer;font-size:14px}._dividerContainer_hqwav_9{display:flex;align-items:center}._dividerLine_hqwav_14{height:1px;flex-grow:1;background-color:#d2d0db}._fieldset_8h0yg_9{border:none}._labelPill_ni81m_9{display:inline-flex;align-items:center;justify-content:center;border-radius:16px;background:#01819C}._labelPill_ni81m_9 span{color:#fff;line-height:16px;text-align:center}._labelPill--small_ni81m_21{height:20px;padding:0 8px}._labelPill--small_ni81m_21 span{font-size:10px;font-weight:800;text-transform:uppercase}._labelPill--medium_ni81m_30{padding:4px 8px}._labelPill--medium_ni81m_30 span{font-size:12px;font-weight:700}._legend_1aqg2_9{display:flex;flex-direction:column;padding-bottom:12px;gap:8px}._legend_1aqg2_9 ._text_1aqg2_15{color:#635c80}._menuItem_1ofae_9{display:flex;width:100%;flex-shrink:0;align-items:center;padding:0 8px;background-color:#fff;color:#201649;cursor:pointer;gap:8px;text-decoration:none}._menuItem_1ofae_9 ._highlightFrame_1ofae_21{display:flex;flex:1;align-items:center;padding:8px;border-radius:8px;gap:8px}._menuItem_1ofae_9 ._rightIcon_1ofae_29{display:inherit;margin-left:auto;color:#635c80}._menuItem--selected_1ofae_34{color:#201649}._menuItem--selected_1ofae_34 ._highlightFrame_1ofae_21{background-color:#f2fbc4}._menuItem--selected_1ofae_34:hover{color:#738c00}._menuItem_1ofae_9:not(._menuItem--selected_1ofae_34):hover{color:#635c80}._menuItem_1ofae_9:not(._menuItem--selected_1ofae_34):hover ._highlightFrame_1ofae_21{background-color:#f4f3f6}._bubbleContent_zmkfq_9{position:relative;display:inline-block}._bubble_zmkfq_9{position:absolute;z-index:auto;top:6px;right:6px;display:flex;width:20px;height:20px;align-items:center;justify-content:center;border-radius:50%;background-color:#ff9de2;color:#201649;font-size:12px;font-weight:700;text-align:center;transform:translate(50%,-50%);transform-origin:100% 0;white-space:nowrap}._bubble--empty_zmkfq_34{width:12px;height:12px}._wrapper_5w65w_9{width:100%}._wrapper_5w65w_9 ._textInputContainer_5w65w_12{position:relative}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 label{position:absolute;top:50%;right:16px;left:16px;overflow:hidden;text-overflow:ellipsis;transform:translateY(-50%);transition:top .3s,font-size .3s;white-space:nowrap}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput_5w65w_12{overflow:hidden;width:100%;color:#201649;outline:none;text-overflow:ellipsis;white-space:nowrap}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput_5w65w_12+label{color:#635c80}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput_5w65w_12:focus+label,._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput_5w65w_12:not(:placeholder-shown)+label{top:16px}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput_5w65w_12:focus+label>span,._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput_5w65w_12:not(:placeholder-shown)+label>span{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:12px;font-weight:500;letter-spacing:0;line-height:16px;text-decoration:none;text-indent:0px;text-transform:none}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--medium_5w65w_51{padding:16px;border-radius:16px;margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:16px;font-weight:500;letter-spacing:0;line-height:24px;text-decoration:none;text-indent:0px;text-transform:none}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--medium_5w65w_51:focus,._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--medium_5w65w_51:not(:placeholder-shown){padding-top:26px;padding-bottom:6px}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--medium_5w65w_51._textInput--light_5w65w_68{padding:15px}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--medium_5w65w_51._textInput--light_5w65w_68:focus,._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--medium_5w65w_51._textInput--light_5w65w_68:not(:placeholder-shown){padding-top:25px;padding-bottom:5px}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--small_5w65w_75{margin-bottom:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;font-size:14px;font-weight:400;letter-spacing:0;line-height:20px;text-decoration:none;text-indent:0px;text-transform:none;padding:8px 16px;border-radius:12px}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--small_5w65w_75:focus+label,._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--small_5w65w_75:not(:placeholder-shown)+label{display:none}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--small_5w65w_75._textInput--light_5w65w_68{padding:7px 15px}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--dark_5w65w_94{background-color:#f4f3f6}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--dark_5w65w_94:hover{background-color:#e9e8ed}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--dark_5w65w_94:disabled{color:#a6a2b6}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--dark_5w65w_94:disabled:hover{background-color:#f4f3f6}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--dark_5w65w_94:disabled+label{color:#a6a2b6}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--light_5w65w_68{border:1px solid #a6a2b6;background-color:#fff}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--light_5w65w_68:hover{border-color:#797392;background-color:#f4f3f6}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--light_5w65w_68:disabled{border-color:#d2d0db;color:#a6a2b6}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--light_5w65w_68:disabled:hover{background-color:#fff}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--light_5w65w_68:disabled+label{color:#a6a2b6}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--error_5w65w_127{padding:15px;border:1px solid #CC339F;background-color:#fde6f7;color:#201649}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--error_5w65w_127:hover{background-color:#fde6f7}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--error_5w65w_127:focus,._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--error_5w65w_127:not(:placeholder-shown){padding-top:25px;padding-bottom:5px}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--error_5w65w_127:disabled{border-color:#cc339f}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--error_5w65w_127:disabled:hover{background-color:#fde6f7}._wrapper_5w65w_9 ._textInputContainer_5w65w_12 ._textInput--error_5w65w_127._textInput--small_5w65w_75{padding:7px 15px}._wrapper_5w65w_9 ._textInputContainer--errorMessage_5w65w_149{display:block;margin-top:4px;margin-left:8px;color:#cc339f;text-transform:capitalize}._root_oj0uf_16{position:relative;overflow:hidden;flex-shrink:0;border:solid 1px #d2d0db;background-color:#d2d0db}._root--24_oj0uf_23{width:24px;height:24px}._root--28_oj0uf_27{width:28px;height:28px}._root--32_oj0uf_31{width:32px;height:32px}._root--40_oj0uf_35{width:40px;height:40px}._root--48_oj0uf_39{width:48px;height:48px}._root--56_oj0uf_43{width:56px;height:56px}._root--64_oj0uf_47{width:64px;height:64px}._root--80_oj0uf_51{width:80px;height:80px}._root--120_oj0uf_55{width:120px;height:120px}._root--280_oj0uf_59{width:280px;height:280px}._root--square_oj0uf_63._root--24_oj0uf_23,._root--square_oj0uf_63._root--32_oj0uf_31{border-radius:4px}._root--square_oj0uf_63._root--40_oj0uf_35,._root--square_oj0uf_63._root--48_oj0uf_39{border-radius:8px}._root--square_oj0uf_63._root--56_oj0uf_43,._root--square_oj0uf_63._root--64_oj0uf_47{border-radius:12px}._root--square_oj0uf_63._root--80_oj0uf_51,._root--square_oj0uf_63._root--120_oj0uf_55{border-radius:16px}._root--circular_oj0uf_75{border-radius:50%}._root--isPlaceholder_oj0uf_78:before{position:absolute;z-index:1;width:100%;height:100%;background-color:#d2d0db;content:"";opacity:.4}._root_oj0uf_16 img{width:100%;height:100%;object-fit:cover}._switch_yu7wd_9{position:relative;display:inline-block;width:48px;height:28px}._switch_yu7wd_9 input{position:absolute;z-index:2;width:48px;height:28px;opacity:0}._switch_yu7wd_9 input:not(:disabled){cursor:pointer}._switch_yu7wd_9 input:hover+._slider_yu7wd_25{box-shadow:inset 0 0 0 1.5px #797392}._switch_yu7wd_9 input:disabled+._slider_yu7wd_25{opacity:.4}._switch_yu7wd_9 ._slider_yu7wd_25{z-index:1;display:block;width:100%;height:100%;border-radius:100px;background-color:#d2d0db;box-shadow:inset 0 0 0 1.5px #a6a2b6;transition:.4s}._switch_yu7wd_9 ._slider_yu7wd_25:before{position:absolute;right:0px;bottom:2px;width:24px;height:24px;border-radius:50%;background-color:#fff;transform:translate(calc(-100% + 2px));content:"";transition:.4s}._switch_yu7wd_9 ._slider_yu7wd_25._focusVisible_yu7wd_53{box-shadow:inset 0 0 0 1.5px #43adc3!important}._switch_yu7wd_9 input:checked+._slider_yu7wd_25{background-color:#201649;box-shadow:inset 0 0 0 1.5px #201649}._switch_yu7wd_9 input:checked+._slider_yu7wd_25:before{transform:translate(-2px)}._switch_yu7wd_9 input:checked:hover+._slider_yu7wd_25{background-color:#635c80;box-shadow:inset 0 0 0 1.5px #635c80}._toggleInput_glgyz_9{display:flex;width:100%;align-items:center;padding:8px 16px;background-color:#fff;color:#635c80;cursor:pointer;gap:12px}._toggleInput_glgyz_9 svg{flex-shrink:0}._toggleInput_glgyz_9 ._textLabel_glgyz_22{flex-grow:1}._toggleInput_glgyz_9 ._switch_glgyz_25{flex-shrink:0}._toggleInput--checked_glgyz_28{color:#201649}._toggleInput--disabled_glgyz_31{cursor:unset}._toggleInput--withBorder_glgyz_34{padding:12px 16px;border-radius:16px;box-shadow:inset 0 0 0 1px #d2d0db}
package/styles/_design-tokens.scss ADDED
@@ -0,0 +1 @@
1
+ @forward '@goodhood/design-tokens/lib/web/index';
package/styles/_functions.scss ADDED
@@ -0,0 +1,25 @@
1
+ @use 'sass:map';
2
+
3
+ @forward 'design-tokens';
4
+
5
+ @function mapGet($map, $keys...) {
6
+ $value: map.get($map, $keys...);
7
+
8
+ @if not $value {
9
+ @error "Value not found for keys: #{$keys}";
10
+ }
11
+
12
+ @return $value;
13
+ }
14
+
15
+ @function getSemanticColor($color, $shade) {
16
+ @return mapGet($tokens, color, semantic, $color, $shade);
17
+ }
18
+
19
+ @function getSpacing($spacingType) {
20
+ @return mapGet($tokens, spacing, $spacingType);
21
+ }
22
+
23
+ @function getBorderRadius($spacingType) {
24
+ @return mapGet($tokens, borderRadius, $spacingType);
25
+ }