norma-library 0.5.79 → 0.5.121

package/src/helpers/colors.ts

@@ -1,206 +1,206 @@
-import { createTheme } from '@mui/material/styles';
-
-export const getPalette = () => {
-  return {
-    primary: 'rgb(219, 102, 25)',
-    primaryLight: '#FFDB9F',
-    primaryMedium: '#FFA84C',
-    primaryDark: '#B74608',
-    inherit: 'rgb(102, 102, 102)',
-    secondary: 'rgb(67, 187, 242)',
-    error: 'rgb(214, 54, 67)',
-    warning: 'rgb(255, 195, 0)',
-    info: 'rgb(113, 213, 247)',
-    success: 'rgb(107, 194, 53)',
-    white: '#ffffff',
-    black: 'rgb(0, 0, 0)',
-    helper: 'rgb(90, 42, 121)',
-    secondaryLight: '#D9FCFE',
-    secondaryMedium: '#71D5F7',
-    secondaryDark: '#154F8C',
-    inheritLight: '#A3A3A3',
-    inheritMedium: '#666666',
-    inheritDark: '#292929',
-    whiteLight: '#F5F5F5',
-    whiteMedium: '#E0E0E0',
-    whiteDark: '#CCCCCC',
-    successLight: '#D9F8B0',
-    successMedium: '#B9EC85',
-    successDark: '#247010',
-    errorLight: '#FABEAF',
-    errorMedium: '#F29085',
-    errorDark: '#F29085',
-    warningLight: '#FFF7CC',
-    warningMedium: '#FFE266',
-    warningDark: '#936600',
-    helperLight: '#F3D7F8',
-    helperMedium: '#BF82D6',
-    helperDark: '#250D46',
-  };
-};
-
-export const palette = getPalette();
-
-export const textColors = {
-  inherit: palette.inherit,
-  primary: palette.primary,
-  secondary: palette.secondary,
-  error: palette.error,
-  warning: palette.warning,
-  info: palette.info,
-  success: palette.success,
-  white: palette.white,
-  black: palette.black,
-  helper: palette.helper,
-  primaryLight: palette.primaryLight,
-  primaryMedium: palette.primaryMedium,
-  primaryDark: palette.primaryDark,
-  secondaryLight: palette.secondaryLight,
-  secondaryMedium: palette.secondaryMedium,
-  secondaryDark: palette.secondaryDark,
-  inheritLight: palette.inheritLight,
-  inheritMedium: palette.inheritMedium,
-  inheritDark: palette.inheritDark,
-  whiteLight: palette.whiteLight,
-  whiteMedium: palette.whiteMedium,
-  whiteDark: palette.whiteDark,
-  successLight: palette.successLight,
-  successMedium: palette.successMedium,
-  successDark: palette.successDark,
-  errorLight: palette.errorLight,
-  errorMedium: palette.errorMedium,
-  errorDark: palette.errorDark,
-  warningLight: palette.warningLight,
-  warningMedium: palette.warningMedium,
-  warningDark: palette.warningDark,
-  helperLight: palette.helperLight,
-  helperMedium: palette.helperMedium,
-  helperDark: palette.helperDark,
-};
-
-export const backgroundColors = {
-  inherit: palette.inherit,
-  primary: palette.primary,
-  secondary: palette.secondary,
-  error: palette.error,
-  warning: palette.warning,
-  info: palette.info,
-  success: palette.success,
-  white: palette.white,
-  black: palette.black,
-  primaryLight: palette.primaryLight,
-  primaryMedium: palette.primaryMedium,
-  primaryDark: palette.primaryDark,
-  secondaryLight: palette.secondaryLight,
-  secondaryMedium: palette.secondaryMedium,
-  secondaryDark: palette.secondaryDark,
-  inheritLight: palette.inheritLight,
-  inheritMedium: palette.inheritMedium,
-  inheritDark: palette.inheritDark,
-  whiteLight: palette.whiteLight,
-  whiteMedium: palette.whiteMedium,
-  whiteDark: palette.whiteDark,
-  successLight: palette.successLight,
-  successMedium: palette.successMedium,
-  successDark: palette.successDark,
-  errorLight: palette.errorLight,
-  errorMedium: palette.errorMedium,
-  errorDark: palette.errorDark,
-  warningLight: palette.warningLight,
-  warningMedium: palette.warningMedium,
-  warningDark: palette.warningDark,
-  helperLight: palette.helperLight,
-  helperMedium: palette.helperMedium,
-  helperDark: palette.helperDark,
-};
-
-export const olosPalette = {
-  primary: {
-    main: palette.primary,
-  },
-  secondary: {
-    main: palette.secondary,
-  },
-  error: {
-    main: palette.error,
-  },
-  warning: {
-    main: palette.warning,
-  },
-  info: {
-    main: palette.info,
-  },
-  success: {
-    main: palette.success,
-  },
-};
-
-export const lightTheme = createTheme({
-  palette: {
-    mode: 'light',
-    ...olosPalette,
-  },
-});
-
-export const darkTheme = createTheme({
-  palette: {
-    mode: 'dark',
-    ...olosPalette,
-    background: {
-      default: palette.inheritLight,
-      paper: palette.inheritDark,
-    },
-  },
-});
-
-export const themes = {
-  light: lightTheme,
-  dark: darkTheme,
-};
-
-type PaletteKey = keyof typeof getPalette;
-
-const getColor = (key: PaletteKey) => {
-  const palette = getPalette();
-  if (palette.hasOwnProperty(key)) {
-    return palette[key];
-  } else {
-    return '#CCC';
-  }
-};
-
-const extractRGB = (rgbString: string) => {
-  if (typeof rgbString === 'string') {
-    const match = rgbString.match(/\((\d+), (\d+), (\d+)\)/);
-
-    if (match) {
-      const r = match[1];
-      const g = match[2];
-      const b = match[3];
-      return `${r},${g},${b}`;
-    }
-  }
-  return null;
-};
-
-const lightenRGB = (rgbString: string, amount = 20) => {
-  console.log('RGB ==> ', rgbString);
-  if (typeof rgbString === 'string') {
-    const match = rgbString.match(/\((\d+), (\d+), (\d+)\)/);
-
-    if (match) {
-      const r = parseInt(match[1]);
-      const g = parseInt(match[2]);
-      const b = parseInt(match[3]);
-
-      const newR = Math.min(255, r + amount);
-      const newG = Math.min(255, g + amount);
-      const newB = Math.min(255, b + amount);
-
-      return `rgb(${newR},${newG},${newB})`;
-    }
-  }
-  return null;
-};
-
-export { getColor, extractRGB, lightenRGB };
+import { createTheme } from '@mui/material/styles';
+
+export const getPalette = () => {
+  return {
+    primary: 'rgb(219, 102, 25)',
+    primaryLight: '#FFDB9F',
+    primaryMedium: '#FFA84C',
+    primaryDark: '#B74608',
+    inherit: 'rgb(102, 102, 102)',
+    secondary: 'rgb(67, 187, 242)',
+    error: 'rgb(214, 54, 67)',
+    warning: 'rgb(255, 195, 0)',
+    info: 'rgb(113, 213, 247)',
+    success: 'rgb(107, 194, 53)',
+    white: '#ffffff',
+    black: 'rgb(0, 0, 0)',
+    helper: 'rgb(90, 42, 121)',
+    secondaryLight: '#D9FCFE',
+    secondaryMedium: '#71D5F7',
+    secondaryDark: '#154F8C',
+    inheritLight: '#A3A3A3',
+    inheritMedium: '#666666',
+    inheritDark: '#292929',
+    whiteLight: '#F5F5F5',
+    whiteMedium: '#E0E0E0',
+    whiteDark: '#CCCCCC',
+    successLight: '#D9F8B0',
+    successMedium: '#B9EC85',
+    successDark: '#247010',
+    errorLight: '#FABEAF',
+    errorMedium: '#F29085',
+    errorDark: '#F29085',
+    warningLight: '#FFF7CC',
+    warningMedium: '#FFE266',
+    warningDark: '#936600',
+    helperLight: '#F3D7F8',
+    helperMedium: '#BF82D6',
+    helperDark: '#250D46',
+  };
+};
+
+export const palette = getPalette();
+
+export const textColors = {
+  inherit: palette.inherit,
+  primary: palette.primary,
+  secondary: palette.secondary,
+  error: palette.error,
+  warning: palette.warning,
+  info: palette.info,
+  success: palette.success,
+  white: palette.white,
+  black: palette.black,
+  helper: palette.helper,
+  primaryLight: palette.primaryLight,
+  primaryMedium: palette.primaryMedium,
+  primaryDark: palette.primaryDark,
+  secondaryLight: palette.secondaryLight,
+  secondaryMedium: palette.secondaryMedium,
+  secondaryDark: palette.secondaryDark,
+  inheritLight: palette.inheritLight,
+  inheritMedium: palette.inheritMedium,
+  inheritDark: palette.inheritDark,
+  whiteLight: palette.whiteLight,
+  whiteMedium: palette.whiteMedium,
+  whiteDark: palette.whiteDark,
+  successLight: palette.successLight,
+  successMedium: palette.successMedium,
+  successDark: palette.successDark,
+  errorLight: palette.errorLight,
+  errorMedium: palette.errorMedium,
+  errorDark: palette.errorDark,
+  warningLight: palette.warningLight,
+  warningMedium: palette.warningMedium,
+  warningDark: palette.warningDark,
+  helperLight: palette.helperLight,
+  helperMedium: palette.helperMedium,
+  helperDark: palette.helperDark,
+};
+
+export const backgroundColors = {
+  inherit: palette.inherit,
+  primary: palette.primary,
+  secondary: palette.secondary,
+  error: palette.error,
+  warning: palette.warning,
+  info: palette.info,
+  success: palette.success,
+  white: palette.white,
+  black: palette.black,
+  primaryLight: palette.primaryLight,
+  primaryMedium: palette.primaryMedium,
+  primaryDark: palette.primaryDark,
+  secondaryLight: palette.secondaryLight,
+  secondaryMedium: palette.secondaryMedium,
+  secondaryDark: palette.secondaryDark,
+  inheritLight: palette.inheritLight,
+  inheritMedium: palette.inheritMedium,
+  inheritDark: palette.inheritDark,
+  whiteLight: palette.whiteLight,
+  whiteMedium: palette.whiteMedium,
+  whiteDark: palette.whiteDark,
+  successLight: palette.successLight,
+  successMedium: palette.successMedium,
+  successDark: palette.successDark,
+  errorLight: palette.errorLight,
+  errorMedium: palette.errorMedium,
+  errorDark: palette.errorDark,
+  warningLight: palette.warningLight,
+  warningMedium: palette.warningMedium,
+  warningDark: palette.warningDark,
+  helperLight: palette.helperLight,
+  helperMedium: palette.helperMedium,
+  helperDark: palette.helperDark,
+};
+
+export const olosPalette = {
+  primary: {
+    main: palette.primary,
+  },
+  secondary: {
+    main: palette.secondary,
+  },
+  error: {
+    main: palette.error,
+  },
+  warning: {
+    main: palette.warning,
+  },
+  info: {
+    main: palette.info,
+  },
+  success: {
+    main: palette.success,
+  },
+};
+
+export const lightTheme = createTheme({
+  palette: {
+    mode: 'light',
+    ...olosPalette,
+  },
+});
+
+export const darkTheme = createTheme({
+  palette: {
+    mode: 'dark',
+    ...olosPalette,
+    background: {
+      default: palette.inheritLight,
+      paper: palette.inheritDark,
+    },
+  },
+});
+
+export const themes = {
+  light: lightTheme,
+  dark: darkTheme,
+};
+
+type PaletteKey = keyof typeof getPalette;
+
+const getColor = (key: PaletteKey) => {
+  const palette = getPalette();
+  if (palette.hasOwnProperty(key)) {
+    return palette[key];
+  } else {
+    return '#CCC';
+  }
+};
+
+const extractRGB = (rgbString: string) => {
+  if (typeof rgbString === 'string') {
+    const match = rgbString.match(/\((\d+), (\d+), (\d+)\)/);
+
+    if (match) {
+      const r = match[1];
+      const g = match[2];
+      const b = match[3];
+      return `${r},${g},${b}`;
+    }
+  }
+  return null;
+};
+
+const lightenRGB = (rgbString: string, amount = 20) => {
+  console.log('RGB ==> ', rgbString);
+  if (typeof rgbString === 'string') {
+    const match = rgbString.match(/\((\d+), (\d+), (\d+)\)/);
+
+    if (match) {
+      const r = parseInt(match[1]);
+      const g = parseInt(match[2]);
+      const b = parseInt(match[3]);
+
+      const newR = Math.min(255, r + amount);
+      const newG = Math.min(255, g + amount);
+      const newB = Math.min(255, b + amount);
+
+      return `rgb(${newR},${newG},${newB})`;
+    }
+  }
+  return null;
+};
+
+export { getColor, extractRGB, lightenRGB };

package/src/helpers/index.ts

@@ -1,5 +1,5 @@
-export * from './borders';
-export * from './colors';
-export * from './sizes';
-export * from './radios';
-export * from './alignments';
+export * from './borders';
+export * from './colors';
+export * from './sizes';
+export * from './radios';
+export * from './alignments';

package/src/helpers/radios.ts

@@ -1,24 +1,24 @@
-function getRadioSize(radio: string) {
-  switch (radio) {
-    case 'none':
-      return 'rounded-none';
-    case 'xs':
-      return 'rounded-xs';
-    case 'sm':
-      return 'rounded-sm';
-    case 'md':
-      return 'rounded-md';
-    case 'lg':
-      return 'rounded-lg';
-    case 'xl':
-      return 'rounded-xl';
-    case 'xll':
-      return 'rounded-2xl';
-    case 'full':
-      return 'rounded-full';
-    default:
-      return 'rounded-none';
-  }
-}
-
-export { getRadioSize };
+function getRadioSize(radio: string) {
+  switch (radio) {
+    case 'none':
+      return 'rounded-none';
+    case 'xs':
+      return 'rounded-xs';
+    case 'sm':
+      return 'rounded-sm';
+    case 'md':
+      return 'rounded-md';
+    case 'lg':
+      return 'rounded-lg';
+    case 'xl':
+      return 'rounded-xl';
+    case 'xll':
+      return 'rounded-2xl';
+    case 'full':
+      return 'rounded-full';
+    default:
+      return 'rounded-none';
+  }
+}
+
+export { getRadioSize };

package/src/helpers/sizes.ts

@@ -1,72 +1,72 @@
-function getSize(size: string) {
-  switch (size) {
-    case 'small':
-      return 'text-sm';
-    case 'medium':
-      return 'text-lg';
-    case 'large':
-      return 'text-xl';
-    default:
-      return 'text-base';
-  }
-}
-
-function getBtnSize(size: string) {
-  switch (size) {
-    case 'small':
-      return 'px-3 py-2 text-xs font-medium';
-    case 'medium':
-      return 'px-5 py-2.5 text-sm font-medium ';
-    case 'large':
-      return 'px-6 py-3.5 text-base font-medium font-semibold';
-    default:
-      return 'h-10 py-2 px-4 text-lg';
-  }
-}
-
-function getPaddingSize(size: string) {
-  switch (size) {
-    case 'small':
-      return 'px-4 py-2.5';
-    case 'medium':
-      return 'px-5 py-2.5';
-    case 'large':
-      return 'px-6 py-3';
-    default:
-      return 'px-5 py-2.5';
-  }
-}
-
-function getHeightSize(size: string) {
-  switch (size) {
-    case 'small':
-      return 'h-6';
-    case 'medium':
-      return 'h-10';
-    case 'large':
-      return '10';
-    default:
-      return 'h-12';
-  }
-}
-
-function getIconSize(size: string) {
-  switch (size) {
-    case 'small':
-      return 'px-1.5 py-0 h-6 w-6';
-    case 'medium':
-      return 'px-1.5 py-0 h-8 w-8';
-    case 'large':
-      return 'px-1.5 py-0 h-10 w-10';
-    default:
-      return 'px-1.5 py-0 h-8 w-8';
-  }
-}
-
-const sizes = {
-  small: 'small',
-  medium: 'medium',
-  large: 'large',
-};
-
-export { sizes, getBtnSize, getSize, getPaddingSize, getHeightSize, getIconSize };
+function getSize(size: string) {
+  switch (size) {
+    case 'small':
+      return 'text-sm';
+    case 'medium':
+      return 'text-lg';
+    case 'large':
+      return 'text-xl';
+    default:
+      return 'text-base';
+  }
+}
+
+function getBtnSize(size: string) {
+  switch (size) {
+    case 'small':
+      return 'px-3 py-2 text-xs font-medium';
+    case 'medium':
+      return 'px-5 py-2.5 text-sm font-medium ';
+    case 'large':
+      return 'px-6 py-3.5 text-base font-medium font-semibold';
+    default:
+      return 'h-10 py-2 px-4 text-lg';
+  }
+}
+
+function getPaddingSize(size: string) {
+  switch (size) {
+    case 'small':
+      return 'px-4 py-2.5';
+    case 'medium':
+      return 'px-5 py-2.5';
+    case 'large':
+      return 'px-6 py-3';
+    default:
+      return 'px-5 py-2.5';
+  }
+}
+
+function getHeightSize(size: string) {
+  switch (size) {
+    case 'small':
+      return 'h-6';
+    case 'medium':
+      return 'h-10';
+    case 'large':
+      return '10';
+    default:
+      return 'h-12';
+  }
+}
+
+function getIconSize(size: string) {
+  switch (size) {
+    case 'small':
+      return 'px-1.5 py-0 h-6 w-6';
+    case 'medium':
+      return 'px-1.5 py-0 h-8 w-8';
+    case 'large':
+      return 'px-1.5 py-0 h-10 w-10';
+    default:
+      return 'px-1.5 py-0 h-8 w-8';
+  }
+}
+
+const sizes = {
+  small: 'small',
+  medium: 'medium',
+  large: 'large',
+};
+
+export { sizes, getBtnSize, getSize, getPaddingSize, getHeightSize, getIconSize };

package/src/index.css

@@ -1,2 +0,0 @@
-@import "styles/globals.css";
-@import "styles/custom.css";