@m4l/styles 0.0.0 → 0.0.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m4l/styles",
-  "version": "0.0.0",
+  "version": "0.0.2",
   "license": "UNLICENSED",
   "dependencies": {
     "@m4l/graphics": "*",

package/theme/index.d.ts

@@ -1,7 +1,4 @@
 export type { CustomShadowOptions } from './shadows';
-export type { GradientsPaletteOptions } from './palette';
-export type { ChartPaletteOptions } from './palette';
-export type { GridPaletteOptions } from './palette';
 export { defaultThemeOptions } from './defaultThemeOptions';
 export { shadows, customShadows } from './shadows';
 export { palette, type ColorSchema } from './palette';

package/theme/overrides/M4LExtendedComponents/M4LButton.d.ts

@@ -1,5 +1,5 @@
 import { Theme } from '@mui/material/styles';
-export declare const M4LButton: (theme: Theme) => {
+export declare const M4LButton: (_theme: Theme) => {
     M4LButton: {
         styleOverrides: {
             "&.M4LButton-root": {

package/theme/overrides/M4LExtendedComponents/M4LErrorLabel.d.ts

@@ -1,5 +1,5 @@
 import { Theme } from '@mui/material/styles';
-export declare const M4LErrorLabel: (theme: Theme) => {
+export declare const M4LErrorLabel: (_theme: Theme) => {
     M4LErrorLabel: {
         styleOverrides: {
             "&.M4LErrorLabel-root": {

package/theme/overrides/M4LExtendedComponents/M4LIcon.d.ts

@@ -4,6 +4,7 @@ export declare const M4LIcon: (theme: Theme) => {
         styleOverrides: {
             "&.M4LIcon-root": {
                 test: string;
+                backgroundColor: string;
             };
         };
     };

package/theme/overrides/M4LExtendedComponents/M4LIconButton.d.ts

@@ -1,5 +1,5 @@
 import { Theme } from '@mui/material/styles';
-export declare const M4LIconButton: (theme: Theme) => {
+export declare const M4LIconButton: (_theme: Theme) => {
     M4LIconButton: {
         styleOverrides: {
             "&.M4LIconButton-root": {

package/theme/overrides/M4LExtendedComponents/M4LImage.d.ts

@@ -1,5 +1,5 @@
 import { Theme } from '@mui/material/styles';
-export declare const M4LImage: (theme: Theme) => {
+export declare const M4LImage: (_theme: Theme) => {
     M4LImage: {
         styleOverrides: {
             "&.M4LImage-root": {

package/theme/overrides/M4LExtendedComponents/M4LImageButton.d.ts

@@ -1,5 +1,5 @@
 import { Theme } from '@mui/material/styles';
-export declare const M4LImageButton: (theme: Theme) => {
+export declare const M4LImageButton: (_theme: Theme) => {
     M4LImageButton: {
         styleOverrides: {
             "&.M4LImageButton-root": {

package/theme/overrides/M4LExtendedComponents/M4LPopover.d.ts

@@ -1,5 +1,5 @@
 import { Theme } from '@mui/material/styles';
-export declare const M4LPopover: (theme: Theme) => {
+export declare const M4LPopover: (_theme: Theme) => {
     M4LPopover: {
         styleOverrides: {
             "&.M4LPopover-root": {

package/theme/overrides/M4LExtendedComponents/M4LTypography.d.ts

@@ -1,5 +1,5 @@
 import { Theme } from '@mui/material/styles';
-export declare const M4LTypography: (theme: Theme) => {
+export declare const M4LTypography: (_theme: Theme) => {
     M4LTypography: {
         styleOverrides: {
             "&.M4LTypography-root": {

package/theme/overrides/M4LExtendedComponents/M4LanguagePopover.d.ts

@@ -1,5 +1,5 @@
 import { Theme } from '@mui/material/styles';
-export declare const M4LanguagePopover: (theme: Theme) => {
+export declare const M4LanguagePopover: (_theme: Theme) => {
     M4LanguagePopover: {
         styleOverrides: {
             "&.M4LanguagePopover-root": {

package/theme/overrides/M4LRHFComponents/M4LRHFCheckbox.d.ts

@@ -1,5 +1,5 @@
 import { Theme } from '@mui/material/styles';
-export declare const M4LRHFCheckbox: (theme: Theme) => {
+export declare const M4LRHFCheckbox: (_theme: Theme) => {
     M4LRHFCheckbox: {
         styleOverrides: {
             "&.M4LRHFCheckbox-root": {

package/theme/overrides/M4LRHFComponents/M4LRHFTextField.d.ts

@@ -1,5 +1,5 @@
 import { Theme } from '@mui/material/styles';
-export declare const M4LRHFTextField: (theme: Theme) => {
+export declare const M4LRHFTextField: (_theme: Theme) => {
     M4LRHFTextField: {
         styleOverrides: {
             "&.M4LRHFTextField-root": {

package/theme/overrides/M4LRHFComponents/M4LRHFTextFieldPassword.d.ts

@@ -1,5 +1,5 @@
 import { Theme } from '@mui/material/styles';
-export declare const M4LRHFTextFieldPassword: (theme: Theme) => {
+export declare const M4LRHFTextFieldPassword: (_theme: Theme) => {
     M4LRHFTextFieldPassword: {
         styleOverrides: {
             "&.M4LRHFTextFieldPassword-root": {

package/theme/overrides/MUIComponents/CmpDisenoTest.d.ts

@@ -1,5 +1,5 @@
 import { Theme } from '@mui/material/styles';
-export declare const CmpDisenoTest: (theme: Theme) => {
+export declare const CmpDisenoTest: (_theme: Theme) => {
     M4LBruceTest: {
         styleOverrides: {};
     };

package/theme/overrides/MUIComponents/DynamicFilter.d.ts

@@ -1,5 +1,5 @@
 import { Theme } from '@mui/material/styles';
-export declare const M4LDynamicFilter: (theme: Theme) => {
+export declare const M4LDynamicFilter: (_theme: Theme) => {
     M4LDynamicFilter: {
         styleOverrides: {};
     };

package/theme/palette.d.ts

@@ -1,69 +1,4 @@
 export declare type ColorSchema = 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error';
-export interface GradientsPaletteOptions {
-    primary: string;
-    info: string;
-    success: string;
-    warning: string;
-    error: string;
-}
-export interface ChartPaletteOptions {
-    violet: string[];
-    blue: string[];
-    green: string[];
-    yellow: string[];
-    red: string[];
-}
-export interface GridPaletteOptions {
-    sectionHeader: string;
-    rowHover: string;
-    divider: string;
-}
-declare module '@mui/material/styles/createPalette' {
-    interface TypeBackground {
-        neutral: string;
-        autofill: string;
-        header: string;
-    }
-    interface SimplePaletteColorOptions {
-        lighter?: string;
-        darker?: string;
-        LightSelected?: string;
-        LightSelectedHover?: string;
-        DarkSelected?: string;
-        DarkSelectedHover?: string;
-    }
-    interface PaletteColor {
-        lighter?: string;
-        darker?: string;
-        LightSelected?: string;
-        LightSelectedHover?: string;
-        DarkSelected?: string;
-        DarkSelectedHover?: string;
-    }
-    interface Palette {
-        gradients?: GradientsPaletteOptions;
-        chart: ChartPaletteOptions;
-        grid?: GridPaletteOptions;
-    }
-    interface PaletteOptions {
-        gradients?: GradientsPaletteOptions;
-        chart?: ChartPaletteOptions;
-        grid?: GridPaletteOptions;
-    }
-}
-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;
-    }
-}
 export declare const GREY: {
     0: string;
     100: string;

package/types/index.d.ts

@@ -1 +1 @@
-export declare type ThemeColorPresets = 'default' | 'purple' | 'cyan' | 'blue' | 'orange' | 'red';
+export * from './types.d';

package/types/types.d.ts

@@ -0,0 +1,87 @@
+import {CustomShadowOptions } from '../theme'
+
+export {};
+
+export declare type ThemeColorPresets = 'default' | 'purple' | 'cyan' | 'blue' | 'orange' | 'red';
+
+declare module '@mui/material/styles' {
+    interface Theme {
+        stretch?: boolean;
+        customShadows: CustomShadowOptions;
+    }
+
+    interface ThemeOptions {
+        stretch?: boolean;
+        customShadows?: CustomShadowOptions;
+    }
+}
+
+export interface GridPaletteOptions {
+    sectionHeader: string;
+    rowHover: string;
+    divider: string;
+}
+
+export interface ChartPaletteOptions {
+    violet: string[];
+    blue: string[];
+    green: string[];
+    yellow: string[];
+    red: string[];
+}
+
+export interface GradientsPaletteOptions {
+    primary: string;
+    info: string;
+    success: string;
+    warning: string;
+    error: string;
+}
+
+declare module '@mui/material/styles/createPalette' {
+    interface TypeBackground {
+        neutral: string;
+        autofill: string;
+        header: string;
+    }
+    interface SimplePaletteColorOptions {
+        lighter?: string;
+        darker?: string;
+        LightSelected?: string;
+        LightSelectedHover?: string;
+        DarkSelected?: string;
+        DarkSelectedHover?: string;
+    }
+    interface PaletteColor {
+        lighter?: string;
+        darker?: string;
+        LightSelected?: string;
+        LightSelectedHover?: string;
+        DarkSelected?: string;
+        DarkSelectedHover?: string;
+    }
+    interface Palette {
+        gradients?: GradientsPaletteOptions;
+        chart: ChartPaletteOptions;
+        grid?: GridPaletteOptions;
+    }
+    interface PaletteOptions {
+        gradients?: GradientsPaletteOptions;
+        chart?: ChartPaletteOptions;
+        grid?: GridPaletteOptions;
+    }
+}
+
+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;
+    }
+}

package/utils/getColorPresets.d.ts

@@ -0,0 +1,170 @@
+import { ThemeColorPresets } from '../types';
+export declare const colorPresets: ({
+    LightSelected: string;
+    LightSelectedHover: string;
+    DarkSelected: string;
+    DarkSelectedHover: string;
+    contrastText: string;
+    lighter: string;
+    light: string;
+    main: string;
+    dark: string;
+    darker: string;
+    name: string;
+} | {
+    name: string;
+    lighter: string;
+    light: string;
+    main: string;
+    dark: string;
+    darker: string;
+    contrastText: string;
+})[];
+export declare const defaultPreset: {
+    LightSelected: string;
+    LightSelectedHover: string;
+    DarkSelected: string;
+    DarkSelectedHover: string;
+    contrastText: string;
+    lighter: string;
+    light: string;
+    main: string;
+    dark: string;
+    darker: string;
+    name: string;
+} | {
+    name: string;
+    lighter: string;
+    light: string;
+    main: string;
+    dark: string;
+    darker: string;
+    contrastText: string;
+};
+export declare const purplePreset: {
+    LightSelected: string;
+    LightSelectedHover: string;
+    DarkSelected: string;
+    DarkSelectedHover: string;
+    contrastText: string;
+    lighter: string;
+    light: string;
+    main: string;
+    dark: string;
+    darker: string;
+    name: string;
+} | {
+    name: string;
+    lighter: string;
+    light: string;
+    main: string;
+    dark: string;
+    darker: string;
+    contrastText: string;
+};
+export declare const cyanPreset: {
+    LightSelected: string;
+    LightSelectedHover: string;
+    DarkSelected: string;
+    DarkSelectedHover: string;
+    contrastText: string;
+    lighter: string;
+    light: string;
+    main: string;
+    dark: string;
+    darker: string;
+    name: string;
+} | {
+    name: string;
+    lighter: string;
+    light: string;
+    main: string;
+    dark: string;
+    darker: string;
+    contrastText: string;
+};
+export declare const bluePreset: {
+    LightSelected: string;
+    LightSelectedHover: string;
+    DarkSelected: string;
+    DarkSelectedHover: string;
+    contrastText: string;
+    lighter: string;
+    light: string;
+    main: string;
+    dark: string;
+    darker: string;
+    name: string;
+} | {
+    name: string;
+    lighter: string;
+    light: string;
+    main: string;
+    dark: string;
+    darker: string;
+    contrastText: string;
+};
+export declare const orangePreset: {
+    LightSelected: string;
+    LightSelectedHover: string;
+    DarkSelected: string;
+    DarkSelectedHover: string;
+    contrastText: string;
+    lighter: string;
+    light: string;
+    main: string;
+    dark: string;
+    darker: string;
+    name: string;
+} | {
+    name: string;
+    lighter: string;
+    light: string;
+    main: string;
+    dark: string;
+    darker: string;
+    contrastText: string;
+};
+export declare const redPreset: {
+    LightSelected: string;
+    LightSelectedHover: string;
+    DarkSelected: string;
+    DarkSelectedHover: string;
+    contrastText: string;
+    lighter: string;
+    light: string;
+    main: string;
+    dark: string;
+    darker: string;
+    name: string;
+} | {
+    name: string;
+    lighter: string;
+    light: string;
+    main: string;
+    dark: string;
+    darker: string;
+    contrastText: string;
+};
+export declare function getColorPresets(presetsKey: ThemeColorPresets): {
+    LightSelected: string;
+    LightSelectedHover: string;
+    DarkSelected: string;
+    DarkSelectedHover: string;
+    contrastText: string;
+    lighter: string;
+    light: string;
+    main: string;
+    dark: string;
+    darker: string;
+    name: string;
+} | {
+    name: string;
+    lighter: string;
+    light: string;
+    main: string;
+    dark: string;
+    darker: string;
+    contrastText: string;
+};
+export default getColorPresets;

package/utils/getFontValue.d.ts

@@ -0,0 +1,24 @@
+import type { Variant } from '@mui/material/styles/createTypography';
+export declare function remToPx(value: string): number;
+export declare function pxToRem(value: number): string;
+export declare function responsiveFontSizes({ sm, md, lg }: {
+    sm: number;
+    md: number;
+    lg: number;
+}): {
+    '@media (min-width:600px)': {
+        fontSize: string;
+    };
+    '@media (min-width:900px)': {
+        fontSize: string;
+    };
+    '@media (min-width:1200px)': {
+        fontSize: string;
+    };
+};
+export declare function getFontValue(variant: Variant): {
+    fontSize: number;
+    lineHeight: number;
+    fontWeight: import("csstype").Property.FontWeight | undefined;
+    letterSpacing: import("csstype").Property.LetterSpacing<string | number> | undefined;
+};

package/utils/index.d.ts

@@ -0,0 +1,2 @@
+export * from './getColorPresets';
+export * from './getFontValue';