@galaxy-ds/core 2.0.12 → 2.0.14

package/src/Theme/leap/desktop/theme.ts

@@ -1,195 +0,0 @@
-/**
- * Module Augmentation for custom theme variables & tokens.
- * Must keep in this theme to prevent build errors.
- */
-import { PaletteColorOptions } from '@mui/material';
-
-import { Platform } from '../../custom-types/global-platform';
-import { Effects } from '../../custom-types/global-effects';
-import { Shapes } from '../../custom-types/global-shapes';
-import { Buttons } from '../../custom-types/component-buttons';
-import { Avatars } from '../../custom-types/component-avatar';
-import { Dialog } from '../../custom-types/component-dialog';
-import { EmptyState } from '../../custom-types/component-emptystate';
-import { Spacers } from '../../custom-types/global-spacers';
-import { Chip } from '../../custom-types/component-chip';
-
-type RecursivePartial<T> = {
-  [P in keyof T]?: RecursivePartial<T[P]>;
-};
-
-declare module '@mui/material/styles' {
-  interface PaletteColor {
-    transparent?: string;
-  }
-  interface SimplePaletteColorOptions {
-    transparent?: string;
-  }
-
-  interface Palette {
-    border: PaletteColor;
-    default: PaletteColor;
-  }
-
-  export interface PaletteOptions {
-    border?: PaletteColorOptions;
-    default?: PaletteColorOptions;
-  }
-
-  interface Theme {
-    platform: Platform;
-    dialog: Dialog;
-    emptyState: EmptyState;
-    effects: Effects;
-    shapes: Shapes;
-    spacers: Spacers;
-    buttons: Buttons;
-    avatars: Avatars;
-    chip: Chip;
-  }
-  interface ThemeOptions {
-    platform?: Platform;
-    dialog?: RecursivePartial<Dialog>;
-    emptyState?: RecursivePartial<EmptyState>;
-    effects?: RecursivePartial<Effects>;
-    shapes?: RecursivePartial<Shapes>;
-    spacers?: RecursivePartial<Spacers>;
-    buttons?: RecursivePartial<Buttons>;
-    avatars?: RecursivePartial<Avatars>;
-    chip?: RecursivePartial<Chip>;
-  }
-}
-/** End of module augmentation */
-
-import { createTheme } from '@mui/material';
-import palettes from './design-tokens/palette';
-import shapes from './design-tokens/shapes';
-import spacers from './design-tokens/spacers';
-import typography from './design-tokens/typography';
-import baseline from './baseline';
-import buttons from './design-tokens/components/buttons';
-import avatars from './design-tokens/components/avatars';
-import chip from './design-tokens/components/chip';
-import {
-  accordionOverrides,
-  accordionDetailsOverrides,
-  accordionSummaryOverrides,
-  autocompleteOverrides,
-  checkboxOverrides,
-  dialogOverrides,
-  dialogActionsOverrides,
-  dialogContentOverrides,
-  dialogTitleOverrides,
-  dividerOverrides,
-  dropdownOverrides,
-  formGroupOverrides,
-  formControlLabelOverrides,
-  iconButtonOverrides,
-  inputBaseOverrides,
-  inputLabelOverrides,
-  menuOverrides,
-  menuItemOverrides,
-  menuHeaderOverrides,
-  outlinedInputOverrides,
-  popoverOverrides,
-  radioOverrides,
-  listItemOverrides,
-  listItemAvatarOverrides,
-  listItemIconOverrides,
-  listItemTextOverrides,
-  listSubheaderOverrides,
-  tooltipOverrides,
-  switchOverrides,
-  svgIconOverrides,
-  tableCellOverrides,
-  tableFooterOverrides,
-  tableRowOverrides,
-} from './overrides';
-import {
-  SvgDefault,
-  SvgNoTransactions,
-  SvgNoFolder,
-  SvgNoAppointment,
-} from '../../../Icons/common/EmptyState/leap';
-
-let theme = createTheme({
-  platform: {
-    name: 'leap_desktop',
-  },
-  emptyState: {
-    icons: {
-      default: SvgDefault,
-      transaction: SvgNoTransactions,
-      matter: SvgNoFolder,
-      appointment: SvgNoAppointment,
-      document: SvgDefault,
-    },
-  },
-  palette: palettes.palette,
-  shapes: shapes,
-  spacers: spacers,
-  spacing: 4,
-});
-
-theme = createTheme(theme, {
-  typography: typography,
-  chip: chip,
-  avatars: avatars,
-  buttons: buttons,
-  shape: {
-    borderRadius: shapes.zero,
-  },
-  components: {
-    MuiCssBaseline: {
-      styleOverrides: baseline,
-    },
-    MuiAccordion: accordionOverrides,
-    MuiAccordionDetails: accordionDetailsOverrides,
-    MuiAccordionSummary: accordionSummaryOverrides,
-    MuiAutocomplete: autocompleteOverrides,
-    MuiCheckbox: checkboxOverrides,
-    MuiButtonBase: {
-      defaultProps: {
-        disableRipple: true,
-      },
-    },
-    MuiDialog: dialogOverrides,
-    MuiDialogActions: dialogActionsOverrides,
-    MuiDialogContent: dialogContentOverrides,
-    MuiDialogTitle: dialogTitleOverrides,
-    MuiDivider: dividerOverrides,
-    MuiFormGroup: formGroupOverrides,
-    MuiFormControlLabel: formControlLabelOverrides,
-    MuiIconButton: iconButtonOverrides,
-    MuiInputBase: inputBaseOverrides,
-    MuiInputLabel: inputLabelOverrides,
-    MuiMenu: menuOverrides,
-    MuiMenuItem: menuItemOverrides,
-    MuiMenuHeader: menuHeaderOverrides,
-    MuiOutlinedInput: outlinedInputOverrides,
-    MuiPaper: {
-      defaultProps: {
-        elevation: 0,
-      },
-    },
-    MuiPopover: popoverOverrides,
-    MuiRadio: radioOverrides,
-    MuiListSubheader: listSubheaderOverrides,
-    MuiListItem: listItemOverrides,
-    MuiListItemAvatar: listItemAvatarOverrides,
-    MuiListItemIcon: listItemIconOverrides,
-    MuiListItemText: listItemTextOverrides,
-    MuiTooltip: tooltipOverrides,
-    MuiSelect: dropdownOverrides,
-    MuiSwitch: switchOverrides,
-    MuiSvgIcon: svgIconOverrides,
-    MuiTableCell: tableCellOverrides,
-    MuiTableFooter: tableFooterOverrides,
-    MuiTableRow: tableRowOverrides,
-  },
-});
-
-theme.shadows[3] = '2px 3px 4px 0 rgba(0,0,0,0.5)';
-theme.shadows[4] = '0px 4px 20px 0px #00000036'; //Shadow / Modal Window
-
-export default theme;

package/src/Theme/leap/web/baseline.ts

@@ -1,49 +0,0 @@
-const baseline = {
-  html: {
-    WebkitFontSmoothing: "antialiased",
-  },
-  body: {
-    backgroundColor: "#ffffff",
-    boxSizing: "border-box",
-    color: "#444444",
-    fontFamily: "Open Sans, sans-serif",
-    fontSize: ".875rem",
-    fontWeight: "400",
-    lineHeight: "1.571",
-    margin: 0,
-    textRendering: "optimizeSpeed",
-  },
-  a: {
-    transition: "all .1s",
-    textDecoration: "none",
-  },
-  /* clears the 'X' from Internet Explorer */
-  "input[type=search]::-ms-clear": {
-    display: "none",
-    width: 0,
-    height: 0,
-  },
-  "input[type=search]::-ms-reveal": {
-    display: "none",
-    width: 0,
-    height: 0,
-  },
-  /* clears the 'X' from Chrome */
-  'input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-results-button, input[type="search"]::-webkit-search-results-decoration':{
-    display: "none",
-  },
-  ":root": {
-    "--annotation-font-size": "0.75rem",
-    "--annotation-font-weight": "500",
-    "--annotation-border-radius": "4px",
-    "--annotator-btn-color": "#1e365e",
-    "--annotator-btn-bg": "#eeeeee",
-    "--annotator-btn-add-color": "#ffffff",
-    "--annotator-btn-add-bg": "#1e365e",
-    "--sidebar-spacing": "16px",
-    "--sidebar-btn-group": "0",
-    "--sidebar-btn-group-spacing": "0",
-  },
-}
-export default baseline
-  

package/src/Theme/leap/web/design-tokens/components/avatars.ts

@@ -1,49 +0,0 @@
-import palettes from "../palette"
-const { palette } = palettes;
-
-const avatars = { 
-    fontWeight: 400,
-    color: {
-        default: {
-            color: palette.default.contrastText,
-            background: 'linear-gradient(180deg, #A3ABB5 0%, #8B929F 100%)',
-            borderColor: '#d4d4d4',
-            borderSize: '1px'
-        },
-        primary: {
-            color: palette.primary.contrastText,
-            borderColor: palette.primary.dark,
-            background: palette.primary.dark,
-            borderSize: '1px'
-        },
-        secondary: {
-            color: palette.primary.contrastText,
-            borderColor: palette.primary.light,
-            background: palette.primary.light,
-            borderSize: '0'
-        }
-    },
-    size: {
-        xsmall: {
-            size: '20px',
-            fontSize: '10px',
-        },
-        small: {
-            size: '28px',
-            fontSize: '12px',
-        },
-        medium: {
-            size: '32px',
-            fontSize: '12px',
-        },
-        large: {
-            size: '48px',
-            fontSize: '16px',
-        },
-        xlarge: {
-            size: '64px',
-            fontSize: '20px',
-        }
-    }
-}
-export default avatars

package/src/Theme/leap/web/design-tokens/components/buttons.ts

@@ -1,96 +0,0 @@
-import palettes from "../palette"
-const { palette, blue, grey } = palettes;
-
-const buttons = { 
-    padding: '8px 16px',
-    height: '34px',
-    transition: "all 0.15s ease-in-out",
-    contained: {
-        inherit: {
-            color: palette.default.contrastText,
-            border: 'transparent',
-            background: palette.default.main,
-            boxShadow: 'none',
-            colorHover: palette.default.contrastText,
-            backgroundHover: palette.default.dark,
-            borderHover: 'transparent',
-            boxShadowHover: 'none',
-            backgroundFocus: palette.default.dark,
-            boxShadowFocus: 'none',
-        },
-        primary: {
-            color: palette.primary.contrastText,
-            border: 'transparent',
-            background: palette.primary.main,
-            boxShadow: 'none',
-            colorHover: palette.primary.contrastText,
-            backgroundHover: palette.primary.dark,
-            borderHover: 'transparent',
-            boxShadowHover: 'none',
-            backgroundFocus: palette.primary.dark,
-            boxShadowFocus: 'none',
-        },
-        secondary: {
-            color: palette.secondary.contrastText,
-            border: 'transparent',
-            background: palette.secondary.main,
-            boxShadow: 'none',
-            colorHover: palette.secondary.contrastText,
-            backgroundHover: palette.secondary.main,
-            borderHover: 'transparent',
-            boxShadowHover: 'none',
-            backgroundFocus: palette.secondary.main,
-            boxShadowFocus: 'none',
-        } 
-    },
-    outline: {
-        inherit: {
-            color: palette.primary.main,
-            background: palette.background.paper, 
-            border: palette.divider, 
-            boxShadow: 'none',
-            colorHover: palette.primary.main,
-            backgroundHover: blue[100],
-            borderHover: palette.primary.main,
-            boxShadowHover: 'none',
-            backgroundFocus: blue[100],
-            boxShadowFocus: '0 0 0 0.15rem #cdd3dc, inset 0 3px 5px rgb(0 0 0 / 13%)',
-        },
-        primary: {
-            color: palette.primary.main,
-            background: palette.background.paper, 
-            border: palette.divider, 
-            boxShadow: 'none',
-            colorHover: palette.primary.main,
-            backgroundHover: blue[100],
-            borderHover: palette.primary.main,
-            boxShadowHover: 'none',
-            backgroundFocus: blue[100],
-            boxShadowFocus: '0 0 0 0.15rem #cdd3dc, inset 0 3px 5px rgb(0 0 0 / 13%)',
-        },
-        secondary: {
-            color: palette.secondary.main,
-            background: palette.background.paper, 
-            border: palette.secondary.main, 
-            boxShadow: 'none',
-            colorHover: palette.secondary.main,
-            backgroundHover: palette.secondary.light,
-            borderHover: palette.secondary.main,
-            boxShadowHover: 'none',
-            backgroundFocus: blue[100],
-            boxShadowFocus: '0 0 0 0.15rem #cdd3dc, inset 0 3px 5px rgb(0 0 0 / 13%)',
-        }
-    },
-    text: {
-        inherit: {
-            color: palette.default.main,
-        },
-        primary: {
-            color: palette.primary.main,
-        },
-        secondary: {
-            color: palette.secondary.main,
-        },
-    }
-}
-export default buttons

package/src/Theme/leap/web/design-tokens/components/chip.ts

@@ -1,64 +0,0 @@
-import palettes from "../palette"
-const { palette } = palettes;
-
-const chip = { 
-    textTransform: 'uppercase',
-    padding: '0',
-    paddingLabel: '8px',
-    border: '1px solid #d4d4d4',
-    borderDelete: '1px solid #d4d4d4',
-    color: {
-        filled: {
-            default: {
-                color: palette.primary.main,
-                background: 'rgba(30,54,94, 0.15)',
-            },
-            primary: {
-                color: palette.primary.main,
-                background: palette.primary.transparent,
-            },
-            secondary: {
-                color: palette.secondary.main,
-                background: palette.secondary.transparent,
-            },
-            info: {
-                color: palette.default.main,
-                background: palette.default.transparent,
-            },
-            success: {
-                color: palette.success.main,
-                background: palette.success.transparent,
-            },
-            warning: {
-                color: palette.warning.main,
-                background: palette.warning.transparent,
-            },
-            error: {
-                color: palette.error.main,
-                background: palette.error.transparent,
-            }
-        },
-        outlined: {
-            default: {
-                color: palette.default.main,
-                background: palette.default.contrastText,
-                borderColor: palette.divider
-            },
-        }
-    },
-    size: {
-        small: {
-            fontWeight: '400',
-            fontSize: '11px',
-            height: '22px',
-            iconBorder: '1px solid #d4d4d4'
-        },
-        medium: {
-            fontWeight: '400',
-            fontSize: '12px',
-            height: '20px',
-            iconBorder: '1px solid #d4d4d4'
-        },
-    }
-}
-export default chip

package/src/Theme/leap/web/design-tokens/effect.ts

@@ -1,3 +0,0 @@
-const effects = { 
-}
-export default effects

package/src/Theme/leap/web/design-tokens/palette.js

@@ -1,105 +0,0 @@
-import * as tokens from '@galaxy-ds/tokens/dist/leap/web/cjs/tokens';
-
-export const grey = {
-  900: '#1c2836',
-  800: '#263042',
-  700: '#444444',
-  600: '#889099',
-  500: '#7a7a7a',
-  400: '#d6d6d6',
-  300: '#d8d8d8',
-  200: '#f3f3f3',
-  100: '#eeeeee',
-  50: '#FFFFFF',
-};
-
-export const blue = {
-  400: '#EBF2F9',
-  300: '#ebf1f4',
-  200: '#C2D8E7',
-  100: '#e4edf5',
-  50: '#E0ECF5',
-};
-
-const palette = {
-  primary: {
-    main: tokens.ColorPrimaryMain,
-    light: tokens.ColorPrimaryLight,
-    dark: tokens.ColorPrimaryDark,
-    transparent: 'rgba(0,96,172, 0.12)',
-    contrastText: '#fff',
-  },
-  secondary: {
-    main: tokens.ColorSecondaryMain,
-    light: tokens.ColorSecondaryLight,
-    dark: tokens.ColorSecondaryDark,
-    transparent: 'rgba(245,146,69, 0.12)',
-    contrastText: '#fff',
-  },
-  default: {
-    main: '#6e7781',
-    light: '#EFF0F0',
-    dark: '#5c646c',
-    transparent: 'rgba(30,54,94, 0.15)',
-    contrastText: '#fff',
-  },
-  info: {
-    main: tokens.ColorContextualInfoLight,
-    light: tokens.ColorContextualInfodLight,
-    dark: tokens.ColorContextualInfoDark,
-    transparent: 'rgba(30,54,94, 0.15)',
-    contrastText: '#fff',
-  },
-  error: {
-    main: tokens.ColorContextualDangerMain,
-    light: tokens.ColorContextualDangerLight,
-    dark: tokens.ColorContextualDangerDark,
-    transparent: 'rgba(192,46,33, 0.12)',
-  },
-  warning: {
-    main: tokens.ColorContextualWarningMain,
-    light: tokens.ColorContextualWarningLight,
-    dark: tokens.ColorContextualWarningDark,
-    transparent: 'rgba(245,146,69, 0.12)',
-  },
-  success: {
-    main: tokens.ColorContextualSuccessMain,
-    light: tokens.ColorContextualSuccessLight,
-    dark: tokens.ColorContextualSuccessDark,
-    transparent: 'rgba(63,175,42, 0.12)',
-  },
-  text: {
-    primary: tokens.ColorTextPrimary,
-    secondary: tokens.ColorTextSecondary,
-    disabled: tokens.ColorTextDisabled,
-    link: '#0060AA',
-    active: '#1E365E',
-    light: '#AAB0B8',
-  },
-  background: {
-    paper: grey[50],
-    default: grey[100],
-    light: 'rgb(249, 249, 249)',
-    footer: grey[50],
-  },
-  divider: '#d8d8d8',
-  border: {
-    main: '#D8DADE',
-    light: '#D8DADE',
-    dark: '#D8DADE',
-  },
-  grey: {
-    ...grey,
-  },
-  blue: {
-    ...blue,
-  },
-};
-
-const palettes = {
-  palette,
-  grey,
-  blue,
-};
-
-export default palettes;

package/src/Theme/leap/web/design-tokens/shapes.ts

@@ -1,12 +0,0 @@
-const shapes = { 
-    zero: '0px',
-    sm: '4px',
-    md: '8px',
-    lg: '16px',
-    button: '4px',
-    card: '8px',
-    chip: '4px',
-    tag: '2px',
-    circle: '100px'
-}
-export default shapes

package/src/Theme/leap/web/design-tokens/spacers.ts

@@ -1,12 +0,0 @@
-const spacers = { 
-    xs: 0,
-    sm: '4px',
-    md: '8px',
-    lg: '12px',
-    xl: '16px',
-    xxl: '32px',
-    xxxl: '64px',
-    button: '0.375rem 1.5rem',
-    chip: '8px',
-}
-export default spacers

package/src/Theme/leap/web/design-tokens/typography.ts

@@ -1,91 +0,0 @@
-import { TypographyOptions } from "@mui/material/styles/createTypography"
-
-const typography: TypographyOptions = {
-  fontFamily: ["Open Sans", "Helvetica", "Arial"].join(","),
-  h1: {
-    fontFamily: ["Open Sans", "Helvetica", "Arial"].join(","),
-    fontWeight: 400,
-    fontSize: "22px",
-    lineHeight: 1.25,
-    letterSpacing: "-0.5px",
-  },
-  h2: {
-    fontFamily: ["Open Sans", "Helvetica", "Arial"].join(","),
-    fontWeight: 400,
-    fontSize: "20px",
-    lineHeight: 1.1667,
-    letterSpacing: "-0.5px",
-  },
-  h3: {
-    fontFamily: ["Open Sans", "Helvetica", "Arial"].join(","),
-    fontWeight: 400,
-    fontSize: "18px",
-    lineHeight: 1.2,
-    letterSpacing: "-0.5px",
-  },
-  h4: {
-    fontFamily: ["Open Sans", "Helvetica", "Arial"].join(","),
-    fontWeight: 500,
-    fontSize: "17px",
-    lineHeight: "1.5rem",
-    letterSpacing: "0",
-  },
-  h5: {
-    fontFamily: ["Open Sans", "Helvetica", "Arial"].join(","),
-    fontWeight: 400,
-    fontSize: "13px",
-    lineHeight: "2rem",
-    letterSpacing: "0",
-  },
-  h6: {
-    fontFamily: ["Open Sans", "Helvetica", "Arial"].join(","),
-    fontWeight: 400,
-    fontSize: "20px",
-    lineHeight: 1.1667,
-    letterSpacing: "-0.5px",
-  },
-  body1: {
-    fontFamily: ["Open Sans", "Helvetica", "Arial"].join(","),
-    fontWeight: 400,
-    fontSize: "14px",
-    lineHeight: "1.5rem",
-    letterSpacing: "0",
-  },
-  body2: {
-    fontFamily: ["Open Sans", "Helvetica", "Arial"].join(","),
-    fontWeight: 400,
-    fontSize: "13px",
-    lineHeight: "1.25rem", // Use rem here for accurate height calculation
-    letterSpacing: "0",
-  },
-  button: {
-    fontFamily: ["Open Sans", "Helvetica", "Arial"].join(","),
-    fontWeight: 600,
-    fontSize: ".8125rem",
-    lineHeight: "1.5715",
-    letterSpacing: ".01rem",
-    textTransform: 'uppercase'
-  },
-  caption: {
-    fontWeight: 600,
-    fontSize: 12,
-    lineHeight: "0.875rem",
-    letterSpacing: "0.07px",
-  },
-  subtitle1: {
-    fontFamily: ["Open Sans", "Helvetica", "Arial"].join(","),
-    fontWeight: 600,
-    fontSize: "14px",
-    lineHeight: "1.5rem",
-    letterSpacing: "0",
-  },
-  subtitle2: {
-    fontFamily: ["Open Sans", "Helvetica", "Arial"].join(","),
-    fontWeight: 600,
-    fontSize: "13px",
-    lineHeight: "1.25rem", // Use rem here for accurate height calculation
-    letterSpacing: "0",
-  },
-}
-
-export default typography