@solostylist/ui-kit 1.0.8 → 1.0.9

package/dist/styles/theme/theme-primitives.d.ts

@@ -0,0 +1,366 @@
+import { PaletteMode, Shadows } from '@mui/material/styles';
+declare module '@mui/material/Paper' {
+    interface PaperPropsVariantOverrides {
+        highlighted: true;
+    }
+}
+declare module '@mui/material/styles' {
+    interface ColorRange {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    }
+    interface PaletteColor extends ColorRange {
+    }
+    interface Palette {
+        baseShadow: string;
+    }
+}
+export declare const brand: {
+    50: string;
+    100: string;
+    200: string;
+    300: string;
+    400: string;
+    500: string;
+    600: string;
+    700: string;
+    800: string;
+    900: string;
+};
+export declare const gray: {
+    50: string;
+    100: string;
+    200: string;
+    300: string;
+    400: string;
+    500: string;
+    600: string;
+    700: string;
+    800: string;
+    900: string;
+};
+export declare const green: {
+    50: string;
+    100: string;
+    200: string;
+    300: string;
+    400: string;
+    500: string;
+    600: string;
+    700: string;
+    800: string;
+    900: string;
+};
+export declare const orange: {
+    50: string;
+    100: string;
+    200: string;
+    300: string;
+    400: string;
+    500: string;
+    600: string;
+    700: string;
+    800: string;
+    900: string;
+};
+export declare const red: {
+    50: string;
+    100: string;
+    200: string;
+    300: string;
+    400: string;
+    500: string;
+    600: string;
+    700: string;
+    800: string;
+    900: string;
+};
+export declare const getDesignTokens: (mode: PaletteMode) => {
+    palette: {
+        mode: PaletteMode;
+        primary: {
+            contrastText: string;
+            light: string;
+            main: string;
+            dark: string;
+        };
+        info: {
+            contrastText: string;
+            light: string;
+            main: string;
+            dark: string;
+        };
+        warning: {
+            light: string;
+            main: string;
+            dark: string;
+        };
+        error: {
+            light: string;
+            main: string;
+            dark: string;
+        };
+        success: {
+            light: string;
+            main: string;
+            dark: string;
+        };
+        grey: {
+            50: string;
+            100: string;
+            200: string;
+            300: string;
+            400: string;
+            500: string;
+            600: string;
+            700: string;
+            800: string;
+            900: string;
+        };
+        divider: string;
+        background: {
+            default: string;
+            paper: string;
+        };
+        text: {
+            primary: string;
+            secondary: string;
+            warning: string;
+        };
+        action: {
+            hover: string;
+            selected: string;
+        };
+    };
+    typography: {
+        fontFamily: string;
+        h1: {
+            fontSize: string;
+            fontWeight: number;
+            lineHeight: number;
+            letterSpacing: number;
+        };
+        h2: {
+            fontSize: string;
+            fontWeight: number;
+            lineHeight: number;
+        };
+        h3: {
+            fontSize: string;
+            lineHeight: number;
+        };
+        h4: {
+            fontSize: string;
+            fontWeight: number;
+            lineHeight: number;
+        };
+        h5: {
+            fontSize: string;
+            fontWeight: number;
+        };
+        h6: {
+            fontSize: string;
+            fontWeight: number;
+        };
+        subtitle1: {
+            fontSize: string;
+        };
+        subtitle2: {
+            fontSize: string;
+            fontWeight: number;
+        };
+        body1: {
+            fontSize: string;
+        };
+        body2: {
+            fontSize: string;
+            fontWeight: number;
+        };
+        caption: {
+            fontSize: string;
+            fontWeight: number;
+        };
+    };
+    shape: {
+        borderRadius: number;
+    };
+    shadows: Shadows;
+};
+export declare const colorSchemes: {
+    light: {
+        palette: {
+            primary: {
+                light: string;
+                main: string;
+                dark: string;
+                contrastText: string;
+            };
+            info: {
+                light: string;
+                main: string;
+                dark: string;
+                contrastText: string;
+            };
+            warning: {
+                light: string;
+                main: string;
+                dark: string;
+            };
+            error: {
+                light: string;
+                main: string;
+                dark: string;
+            };
+            success: {
+                light: string;
+                main: string;
+                dark: string;
+            };
+            grey: {
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+            };
+            divider: string;
+            background: {
+                default: string;
+                paper: string;
+            };
+            text: {
+                primary: string;
+                secondary: string;
+                warning: string;
+            };
+            action: {
+                hover: string;
+                selected: string;
+            };
+            baseShadow: string;
+        };
+    };
+    dark: {
+        palette: {
+            primary: {
+                contrastText: string;
+                light: string;
+                main: string;
+                dark: string;
+            };
+            info: {
+                contrastText: string;
+                light: string;
+                main: string;
+                dark: string;
+            };
+            warning: {
+                light: string;
+                main: string;
+                dark: string;
+            };
+            error: {
+                light: string;
+                main: string;
+                dark: string;
+            };
+            success: {
+                light: string;
+                main: string;
+                dark: string;
+            };
+            grey: {
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+            };
+            divider: string;
+            background: {
+                default: string;
+                paper: string;
+            };
+            text: {
+                primary: string;
+                secondary: string;
+            };
+            action: {
+                hover: string;
+                selected: string;
+            };
+            baseShadow: string;
+        };
+    };
+};
+export declare const typography: {
+    fontFamily: string;
+    h1: {
+        fontSize: string;
+        fontWeight: number;
+        lineHeight: number;
+        letterSpacing: number;
+    };
+    h2: {
+        fontSize: string;
+        fontWeight: number;
+        lineHeight: number;
+    };
+    h3: {
+        fontSize: string;
+        lineHeight: number;
+    };
+    h4: {
+        fontSize: string;
+        fontWeight: number;
+        lineHeight: number;
+    };
+    h5: {
+        fontSize: string;
+        fontWeight: number;
+    };
+    h6: {
+        fontSize: string;
+        fontWeight: number;
+    };
+    subtitle1: {
+        fontSize: string;
+    };
+    subtitle2: {
+        fontSize: string;
+        fontWeight: number;
+    };
+    body1: {
+        fontSize: string;
+    };
+    body2: {
+        fontSize: string;
+        fontWeight: number;
+    };
+    caption: {
+        fontSize: string;
+        fontWeight: number;
+    };
+};
+export declare const shape: {
+    borderRadius: number;
+};
+export declare const shadows: Shadows;

package/dist/styles/theme/theme-primitives.js

@@ -0,0 +1,351 @@
+import { b as n, a as o } from "../../createTheme-BZxWCiBm.js";
+const h = n(), p = [...h.shadows], t = {
+  50: "hsl(210, 100%, 95%)",
+  100: "hsl(210, 100%, 92%)",
+  200: "hsl(210, 100%, 80%)",
+  300: "hsl(210, 100%, 65%)",
+  400: "hsl(210, 98%, 48%)",
+  500: "hsl(210, 98%, 42%)",
+  600: "hsl(210, 98%, 55%)",
+  700: "hsl(210, 100%, 35%)",
+  800: "hsl(210, 100%, 16%)",
+  900: "hsl(210, 100%, 21%)"
+}, e = {
+  50: "hsl(220, 35%, 97%)",
+  100: "hsl(220, 30%, 94%)",
+  200: "hsl(220, 20%, 88%)",
+  300: "hsl(220, 20%, 80%)",
+  400: "hsl(220, 20%, 65%)",
+  500: "hsl(220, 20%, 42%)",
+  600: "hsl(220, 20%, 35%)",
+  700: "hsl(220, 20%, 25%)",
+  800: "hsl(220, 30%, 6%)",
+  900: "hsl(220, 35%, 3%)"
+}, s = {
+  50: "hsl(120, 80%, 98%)",
+  100: "hsl(120, 75%, 94%)",
+  200: "hsl(120, 75%, 87%)",
+  300: "hsl(120, 61%, 77%)",
+  400: "hsl(120, 44%, 53%)",
+  500: "hsl(120, 59%, 30%)",
+  600: "hsl(120, 70%, 25%)",
+  700: "hsl(120, 75%, 16%)",
+  800: "hsl(120, 84%, 10%)",
+  900: "hsl(120, 87%, 6%)"
+}, a = {
+  50: "hsl(45, 100%, 97%)",
+  100: "hsl(45, 92%, 90%)",
+  200: "hsl(45, 94%, 80%)",
+  300: "hsl(45, 90%, 65%)",
+  400: "hsl(45, 90%, 40%)",
+  500: "hsl(45, 90%, 35%)",
+  600: "hsl(45, 91%, 25%)",
+  700: "hsl(45, 94%, 20%)",
+  800: "hsl(45, 95%, 16%)",
+  900: "hsl(45, 93%, 12%)"
+}, i = {
+  50: "hsl(0, 100%, 97%)",
+  100: "hsl(0, 92%, 90%)",
+  200: "hsl(0, 94%, 80%)",
+  300: "hsl(0, 90%, 65%)",
+  400: "hsl(0, 90%, 40%)",
+  500: "hsl(0, 90%, 30%)",
+  600: "hsl(0, 91%, 25%)",
+  700: "hsl(0, 94%, 18%)",
+  800: "hsl(0, 95%, 12%)",
+  900: "hsl(0, 93%, 6%)"
+}, y = (r) => (p[1] = r === "dark" ? "hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px" : "hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px", {
+  palette: {
+    mode: r,
+    primary: {
+      light: t[200],
+      main: t[400],
+      dark: t[700],
+      contrastText: t[50],
+      ...r === "dark" && {
+        contrastText: t[50],
+        light: t[300],
+        main: t[400],
+        dark: t[700]
+      }
+    },
+    info: {
+      light: t[100],
+      main: t[300],
+      dark: t[600],
+      contrastText: e[50],
+      ...r === "dark" && {
+        contrastText: t[300],
+        light: t[500],
+        main: t[700],
+        dark: t[900]
+      }
+    },
+    warning: {
+      light: a[300],
+      main: a[400],
+      dark: a[800],
+      ...r === "dark" && {
+        light: a[400],
+        main: a[500],
+        dark: a[700]
+      }
+    },
+    error: {
+      light: i[300],
+      main: i[400],
+      dark: i[800],
+      ...r === "dark" && {
+        light: i[400],
+        main: i[500],
+        dark: i[700]
+      }
+    },
+    success: {
+      light: s[300],
+      main: s[400],
+      dark: s[800],
+      ...r === "dark" && {
+        light: s[400],
+        main: s[500],
+        dark: s[700]
+      }
+    },
+    grey: {
+      ...e
+    },
+    divider: r === "dark" ? o(e[700], 0.6) : o(e[300], 0.4),
+    background: {
+      default: "hsl(0, 0%, 99%)",
+      paper: "hsl(220, 35%, 97%)",
+      ...r === "dark" && { default: e[900], paper: "hsl(220, 30%, 7%)" }
+    },
+    text: {
+      primary: e[800],
+      secondary: e[600],
+      warning: a[400],
+      ...r === "dark" && { primary: "hsl(0, 0%, 100%)", secondary: e[400] }
+    },
+    action: {
+      hover: o(e[200], 0.2),
+      selected: `${o(e[200], 0.3)}`,
+      ...r === "dark" && {
+        hover: o(e[600], 0.2),
+        selected: o(e[600], 0.3)
+      }
+    }
+  },
+  typography: {
+    fontFamily: "Inter, sans-serif",
+    h1: {
+      fontSize: h.typography.pxToRem(48),
+      fontWeight: 600,
+      lineHeight: 1.2,
+      letterSpacing: -0.5
+    },
+    h2: {
+      fontSize: h.typography.pxToRem(36),
+      fontWeight: 600,
+      lineHeight: 1.2
+    },
+    h3: {
+      fontSize: h.typography.pxToRem(30),
+      lineHeight: 1.2
+    },
+    h4: {
+      fontSize: h.typography.pxToRem(24),
+      fontWeight: 600,
+      lineHeight: 1.5
+    },
+    h5: {
+      fontSize: h.typography.pxToRem(20),
+      fontWeight: 600
+    },
+    h6: {
+      fontSize: h.typography.pxToRem(18),
+      fontWeight: 600
+    },
+    subtitle1: {
+      fontSize: h.typography.pxToRem(18)
+    },
+    subtitle2: {
+      fontSize: h.typography.pxToRem(14),
+      fontWeight: 500
+    },
+    body1: {
+      fontSize: h.typography.pxToRem(14)
+    },
+    body2: {
+      fontSize: h.typography.pxToRem(14),
+      fontWeight: 400
+    },
+    caption: {
+      fontSize: h.typography.pxToRem(12),
+      fontWeight: 400
+    }
+  },
+  shape: {
+    borderRadius: 8
+  },
+  shadows: p
+}), x = {
+  light: {
+    palette: {
+      primary: {
+        light: t[200],
+        main: t[400],
+        dark: t[700],
+        contrastText: t[50]
+      },
+      info: {
+        light: t[100],
+        main: t[300],
+        dark: t[600],
+        contrastText: e[50]
+      },
+      warning: {
+        light: a[300],
+        main: a[400],
+        dark: a[800]
+      },
+      error: {
+        light: i[300],
+        main: i[400],
+        dark: i[800]
+      },
+      success: {
+        light: s[300],
+        main: s[400],
+        dark: s[800]
+      },
+      grey: {
+        ...e
+      },
+      divider: o(e[300], 0.4),
+      background: {
+        default: "hsl(0, 0%, 99%)",
+        paper: "hsl(220, 35%, 97%)"
+      },
+      text: {
+        primary: e[800],
+        secondary: e[600],
+        warning: a[400]
+      },
+      action: {
+        hover: o(e[200], 0.2),
+        selected: `${o(e[200], 0.3)}`
+      },
+      baseShadow: "hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px"
+    }
+  },
+  dark: {
+    palette: {
+      primary: {
+        contrastText: t[50],
+        light: t[300],
+        main: t[400],
+        dark: t[700]
+      },
+      info: {
+        contrastText: t[300],
+        light: t[500],
+        main: t[700],
+        dark: t[900]
+      },
+      warning: {
+        light: a[400],
+        main: a[500],
+        dark: a[700]
+      },
+      error: {
+        light: i[400],
+        main: i[500],
+        dark: i[700]
+      },
+      success: {
+        light: s[400],
+        main: s[500],
+        dark: s[700]
+      },
+      grey: {
+        ...e
+      },
+      divider: o(e[700], 0.6),
+      background: {
+        default: e[900],
+        paper: "hsl(220, 30%, 7%)"
+      },
+      text: {
+        primary: "hsl(0, 0%, 100%)",
+        secondary: e[400]
+      },
+      action: {
+        hover: o(e[600], 0.2),
+        selected: o(e[600], 0.3)
+      },
+      baseShadow: "hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px"
+    }
+  }
+}, d = {
+  fontFamily: "Inter, sans-serif",
+  h1: {
+    fontSize: h.typography.pxToRem(48),
+    fontWeight: 600,
+    lineHeight: 1.2,
+    letterSpacing: -0.5
+  },
+  h2: {
+    fontSize: h.typography.pxToRem(36),
+    fontWeight: 600,
+    lineHeight: 1.2
+  },
+  h3: {
+    fontSize: h.typography.pxToRem(30),
+    lineHeight: 1.2
+  },
+  h4: {
+    fontSize: h.typography.pxToRem(24),
+    fontWeight: 600,
+    lineHeight: 1.5
+  },
+  h5: {
+    fontSize: h.typography.pxToRem(20),
+    fontWeight: 600
+  },
+  h6: {
+    fontSize: h.typography.pxToRem(18),
+    fontWeight: 600
+  },
+  subtitle1: {
+    fontSize: h.typography.pxToRem(18)
+  },
+  subtitle2: {
+    fontSize: h.typography.pxToRem(14),
+    fontWeight: 500
+  },
+  body1: {
+    fontSize: h.typography.pxToRem(14)
+  },
+  body2: {
+    fontSize: h.typography.pxToRem(14),
+    fontWeight: 400
+  },
+  caption: {
+    fontSize: h.typography.pxToRem(12),
+    fontWeight: 400
+  }
+}, f = {
+  borderRadius: 8
+}, l = ["none", "var(--template-palette-baseShadow)", ...h.shadows.slice(2)], c = l;
+export {
+  t as brand,
+  x as colorSchemes,
+  y as getDesignTokens,
+  e as gray,
+  s as green,
+  a as orange,
+  i as red,
+  c as shadows,
+  f as shape,
+  d as typography
+};

package/dist/svgIconClasses-SzHbWjUv.js

@@ -0,0 +1,10 @@
+import { g as r } from "./generateUtilityClass-CRH_bFW6.js";
+import { g as t } from "./generateUtilityClasses-STjIp_B9.js";
+function s(o) {
+  return r("MuiSvgIcon", o);
+}
+const n = t("MuiSvgIcon", ["root", "colorPrimary", "colorSecondary", "colorAction", "colorError", "colorDisabled", "fontSizeInherit", "fontSizeSmall", "fontSizeMedium", "fontSizeLarge"]);
+export {
+  s as g,
+  n as s
+};

package/dist/tabClasses-CDDkt7la.js

@@ -0,0 +1,5 @@
+import { g as e } from "./generateUtilityClasses-STjIp_B9.js";
+const o = e("MuiTab", ["root", "labelIcon", "textColorInherit", "textColorPrimary", "textColorSecondary", "selected", "disabled", "fullWidth", "wrapped", "iconWrapper", "icon"]);
+export {
+  o as t
+};