@m4l/styles 3.0.0 → 3.1.1

package/{config-CoeBxEZB.js → config-B8bZIPuH.js}

@@ -9,8 +9,9 @@ const s = {
 }, e = {
   mobile: 16,
   desktop: 16
-};
+}, m = "medium";
 export {
+  m as D,
   e as g,
   s as m
 };

package/config.d.ts

@@ -1,3 +1,4 @@
+import { Sizes } from './types';
 export declare const muiBreakpointsValues: {
     values: {
         xs: number;
@@ -11,3 +12,7 @@ export declare const globalRemSize: {
     mobile: number;
     desktop: number;
 };
+/**
+ * Constante con el valor por defecto para las props sizes usadas en los componentes o sus derivaciones
+ */
+export declare const DEFAULT_SIZE: Sizes;

package/index.d.ts

@@ -1,4 +1,4 @@
 export * from './theme';
 export * from './utils';
 export * from './types';
-export { muiBreakpointsValues, globalRemSize } from './config';
+export { muiBreakpointsValues, globalRemSize, DEFAULT_SIZE } from './config';

package/index.js

@@ -1,32 +1,33 @@
-import { g as o, m as a } from "./config-CoeBxEZB.js";
-import { d as t } from "./theme/defaultThemeOptions-BlJvKCE6.js";
-import { c as m, s as f } from "./theme/shadows-GTYqExFA.js";
-import { t as x } from "./theme/typography-BsOO459U.js";
-import { f as C } from "./theme/overrides/index-DrDgOdnk.js";
-import { B as i, a as l, C as S, G as u, g as E, p as P } from "./theme/palette-DM0gXxA2.js";
-import { u as T } from "./utils/useResponsive-DaeQVwlH.js";
-import { D as _, d as A, g as B } from "./utils/getColorPresets-CXZaM9oS.js";
-import { g as h, p as v, a as y, r as F } from "./utils/getFontValue-BEO-XID9.js";
+import { D as o, g as a, m as r } from "./config-B8bZIPuH.js";
+import { d as p } from "./theme/defaultThemeOptions-BayzDRnS.js";
+import { c as f, s as O } from "./theme/shadows-GTYqExFA.js";
+import { t as n } from "./theme/typography-BsOO459U.js";
+import { f as E } from "./theme/overrides/index-DrDgOdnk.js";
+import { B as g, a as i, C as l, G as T, g as u, p as P } from "./theme/palette-DM0gXxA2.js";
+import { u as d } from "./utils/useResponsive-DaeQVwlH.js";
+import { D as A, d as L, g as B } from "./utils/getColorPresets-CXZaM9oS.js";
+import { g as D, p as F, a as v, r as y } from "./utils/getFontValue-BEO-XID9.js";
 export {
-  i as BASE_COLORS,
-  l as BASE_OPACITY_COLORS,
-  S as COMMON_COLORS,
-  _ as DEFAULT_PRESET,
-  u as GREY_PALETTE,
-  m as createCustomShadows,
-  A as defaultPresetColors,
-  t as defaultThemeOptions,
-  C as fnComponentsOverrides,
+  g as BASE_COLORS,
+  i as BASE_OPACITY_COLORS,
+  l as COMMON_COLORS,
+  A as DEFAULT_PRESET,
+  o as DEFAULT_SIZE,
+  T as GREY_PALETTE,
+  f as createCustomShadows,
+  L as defaultPresetColors,
+  p as defaultThemeOptions,
+  E as fnComponentsOverrides,
   B as getColorPresets,
-  h as getFontValue,
-  E as getPaletteByPreset,
-  o as globalRemSize,
-  a as muiBreakpointsValues,
+  D as getFontValue,
+  u as getPaletteByPreset,
+  a as globalRemSize,
+  r as muiBreakpointsValues,
   P as presetsOptions,
-  v as pxToRem,
-  y as remToPx,
-  F as responsiveFontSizes,
-  f as shadows,
-  x as typography,
-  T as useResponsive
+  F as pxToRem,
+  v as remToPx,
+  y as responsiveFontSizes,
+  O as shadows,
+  n as typography,
+  d as useResponsive
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m4l/styles",
-  "version": "3.0.0",
+  "version": "3.1.1",
   "license": "UNLICENSED",
   "author": "m4l team",
   "dependencies": {

package/theme/{defaultThemeOptions-BlJvKCE6.js → defaultThemeOptions-BayzDRnS.js}

@@ -2,19 +2,22 @@ import { createTheme as a, alpha as s } from "@mui/material/styles";
 import { t as o } from "./typography-BsOO459U.js";
 import { s as r, c as m } from "./shadows-GTYqExFA.js";
 import { g as p } from "./palette-DM0gXxA2.js";
-import { g as h, D as t } from "../utils/getColorPresets-CXZaM9oS.js";
-const e = a(), f = {
-  ...e,
+import { g as i, D as e } from "../utils/getColorPresets-CXZaM9oS.js";
+const t = a(), f = {
+  ...t,
   typography: o,
+  generalSettings: {
+    isMobile: !1
+  },
   palette: {
-    ...e.palette,
-    ...p(t).light,
+    ...t.palette,
+    ...p(e).light,
     mode: "light"
   },
   shape: { borderRadius: 8 },
   shadows: r.dark,
   customShadows: {
-    primary: `0 8px 16px 0 ${s(h(t).main, 0.2)}`,
+    primary: `0 8px 16px 0 ${s(i(e).main, 0.2)}`,
     ...m("dark")
   },
   stretch: !0

package/types/augmentations.d.ts

@@ -1,144 +1,147 @@
-import { Breakpoints } from '@mui/material';
-import { CssVarsTheme } from '@mui/material/styles';
-
-import type { CustomShadowOptions } from '../theme';
-
-declare module '@mui/material' {
-  interface Color {
-    0: string;
-    500_8: string;
-    500_12: string;
-    500_16: string;
-    500_24: string;
-    500_32: string;
-    500_48: string;
-    500_56: string;
-    500_80: string;
-  }
-}
-
-declare module '@mui/material/styles' {
-  interface PaletteColor {
-    lighter?: string;
-    darker?: string;
-    active: string;
-    activeOpacity: string;
-    hover: string;
-    focus: string;
-    selected: string;
-    toneOpacity: string;
-  }
-
-  interface SimplePaletteColorOptions {
-    lighter?: string;
-    darker?: string;
-    active: string;
-    activeOpacity: string;
-    hover: string;
-    focus: string;
-    selected: string;
-    toneOpacity: string;
-  }
-
-  interface Palette {
-    mode: 'light' | 'dark';
-    secondary: never;
-    skeleton: { default: string; transition: string };
-    border: {
-      active: string;
-      selected: string;
-      default: string;
-      primary: string;
-      secondary: string;
-      disabled: string;
-      dense: string;
-      line: string;
-    };
-    general: {
-      scrollBar: string;
-      gridHover: string;
-    };
-  }
-
-  interface PaletteOptions {
-    mode: 'light' | 'dark';
-    secondary: never;
-    skeleton: { default: string; transition: string };
-    border: {
-      active: string;
-      selected: string;
-      default: string;
-      primary: string;
-      secondary: string;
-      disabled: string;
-      dense: string;
-      line: string;
-    };
-    general: {
-      scrollBar: string;
-      gridHover: string;
-    };
-  }
-
-  interface ColorSchemeOverrides {
-    finalTheme?: true;
-  }
-
-  interface Theme extends CssVarsTheme {
-    stretch: boolean;
-    customShadows: CustomShadowOptions;
-    breakpoints: Breakpoints;
-  }
-
-  interface ThemeVars {
-    customShadows: CustomShadowOptions;
-  }
-
-  interface ColorSystem {
-    typography: TypographyVariants;
-  }
-
-  interface TypeBackground {
-    default: string;
-    hover: string;
-    surface: string;
-    subtle: string;
-    main: string;
-    bold: string;
-    backdrop: string;
-    reverse: string;
-    header: string;
-  }
-
-  interface TypographyVariants {
-    subtitle: Record<string, any>;
-    subtitleDens: Record<string, any>;
-    paragraph: Record<string, any>;
-    paragraphDens: Record<string, any>;
-    body: Record<string, any>;
-    bodyDens: Record<string, any>;
-    action: Record<string, any>;
-  }
-
-  interface TypographyVariantsOptions {
-    subtitle: React.CSSProperties;
-    subtitleDens: React.CSSProperties;
-    paragraph: React.CSSProperties;
-    paragraphDens: React.CSSProperties;
-    body: React.CSSProperties;
-    bodyDens: React.CSSProperties;
-    action: React.CSSProperties;
-  }
-}
-
-declare module '@mui/material/Typography' {
-  interface TypographyPropsVariantOverrides {
-    subtitle: true;
-    subtitleDens: true;
-    paragraph: true;
-    paragraphDens: true;
-    body: true;
-    bodyDens: true;
-    action: true;
-  }
-}
+import { Breakpoints } from '@mui/material';
+import { CssVarsTheme } from '@mui/material/styles';
+
+import type { CustomShadowOptions } from '../theme';
+
+declare module '@mui/material' {
+  interface Color {
+    0: string;
+    500_8: string;
+    500_12: string;
+    500_16: string;
+    500_24: string;
+    500_32: string;
+    500_48: string;
+    500_56: string;
+    500_80: string;
+  }
+}
+
+declare module '@mui/material/styles' {
+  interface PaletteColor {
+    lighter?: string;
+    darker?: string;
+    active: string;
+    activeOpacity: string;
+    hover: string;
+    focus: string;
+    selected: string;
+    toneOpacity: string;
+  }
+
+  interface SimplePaletteColorOptions {
+    lighter?: string;
+    darker?: string;
+    active: string;
+    activeOpacity: string;
+    hover: string;
+    focus: string;
+    selected: string;
+    toneOpacity: string;
+  }
+
+  interface Palette {
+    mode: 'light' | 'dark';
+    secondary: never;
+    skeleton: { default: string; transition: string };
+    border: {
+      active: string;
+      selected: string;
+      default: string;
+      primary: string;
+      secondary: string;
+      disabled: string;
+      dense: string;
+      line: string;
+    };
+    general: {
+      scrollBar: string;
+      gridHover: string;
+    };
+  }
+
+  interface PaletteOptions {
+    mode: 'light' | 'dark';
+    secondary: never;
+    skeleton: { default: string; transition: string };
+    border: {
+      active: string;
+      selected: string;
+      default: string;
+      primary: string;
+      secondary: string;
+      disabled: string;
+      dense: string;
+      line: string;
+    };
+    general: {
+      scrollBar: string;
+      gridHover: string;
+    };
+  }
+
+  interface ColorSchemeOverrides {
+    finalTheme?: true;
+  }
+
+  interface Theme extends CssVarsTheme {
+    stretch: boolean;
+    customShadows: CustomShadowOptions;
+    breakpoints: Breakpoints;
+    generalSettings: {
+      isMobile: boolean;
+    }
+  }
+
+  interface ThemeVars {
+    customShadows: CustomShadowOptions;
+  }
+
+  interface ColorSystem {
+    typography: TypographyVariants;
+  }
+
+  interface TypeBackground {
+    default: string;
+    hover: string;
+    surface: string;
+    subtle: string;
+    main: string;
+    bold: string;
+    backdrop: string;
+    reverse: string;
+    header: string;
+  }
+
+  interface TypographyVariants {
+    subtitle: Record<string, any>;
+    subtitleDens: Record<string, any>;
+    paragraph: Record<string, any>;
+    paragraphDens: Record<string, any>;
+    body: Record<string, any>;
+    bodyDens: Record<string, any>;
+    action: Record<string, any>;
+  }
+
+  interface TypographyVariantsOptions {
+    subtitle: React.CSSProperties;
+    subtitleDens: React.CSSProperties;
+    paragraph: React.CSSProperties;
+    paragraphDens: React.CSSProperties;
+    body: React.CSSProperties;
+    bodyDens: React.CSSProperties;
+    action: React.CSSProperties;
+  }
+}
+
+declare module '@mui/material/Typography' {
+  interface TypographyPropsVariantOverrides {
+    subtitle: true;
+    subtitleDens: true;
+    paragraph: true;
+    paragraphDens: true;
+    body: true;
+    bodyDens: true;
+    action: true;
+  }
+}

package/types/types.d.ts

@@ -1,4 +1,8 @@
 import { PaletteColor } from '@mui/material/styles';
+/**
+ * type usado para tipar las props sizes de los componentes o sus derivaciones
+ */
+export declare type Sizes = 'small' | 'medium' | 'large';
 export declare type ThemeColorPresets = 'patronus' | 'turqui' | 'grass' | 'brown' | 'blaze';
 export declare type StateColorSchema = 'info' | 'success' | 'warning' | 'error';
 export declare type ColorSchema = 'primary' | 'secondary' | StateColorSchema;

package/vite-env.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="vite/client" />
-/// <reference types="vitest" />
-/// <reference types="vitest/importMeta" />
+/// <reference types="vite/client" />
+/// <reference types="vitest" />
+/// <reference types="vitest/importMeta" />