oneslash-design-system 1.2.3 → 1.2.4

package/designTokens.js

@@ -1,234 +0,0 @@
-// design tokens definitions
-module.exports = {
-  colors: {
-    // light
-    light:{
-      text:{
-        primary: '#000000',
-        secondary: '#6D6D6D',
-        disabled: '#9E9E9E',
-        contrast: '#ffffff',
-      },
-      accent:{
-        main: '#EEAE03',
-        dark: '#CE8602',
-        light: '#FFDD43',
-        contrast: '#000000',
-      },
-      primary:{
-        main: '#454545',
-        dark: '#262626',
-        light: '#888888',
-      },
-      secondary:{
-        main: '#B0B0B0',
-        dark: '#888888',
-        light: '#D1D1D1',
-      },
-      error:{
-        main: '#D32F2F',
-        dark: '#B22323',
-        light: '#F27777',
-      },
-      warning:{
-        main: '#EF6C00',
-        dark: '#CC5302',
-        light: '#FFA732',
-      },
-      info:{
-        main: '#0087D4',
-        dark: '#006BAB',
-        light: '#2CC1FF',
-      },
-      success:{
-        main: '#328736',
-        dark: '#2A6B2D',
-        light: '#67C16B',
-      },
-      background:{
-        default: '#e8e8e8',
-        accent100:'#f1f1f1',
-        accent200:'#f7f7f7',
-        accent300:'#FFFFFF',
-      },
-      action:{
-        active: '#888888',
-        hover: '#F3F3F3',
-        selected: '#E3E3E3',
-        disabledBackground: '#D1D1D1',
-        disabled: '#B0B0B0',
-      },
-      actionBackground:{
-        enabled: '#FFFFFF',
-        hovered: '#FFFFFF',
-        selected: '#FFFFFF',
-        disabled: '#EEEEEE',
-      },
-      actionOutlinedBorder:{
-        enabled: '#888888',
-        hovered: '#CDCDCD',
-        selected: '#E8E8E8',
-        disabled: '#B0B0B0',
-      },
-      misc:{
-        divider: '#D1D1D1',
-      },
-    },
-
-    // dark
-    dark:{
-      text:{
-        primary: '#eeeeee',
-        secondary: '#B0B0B0',
-        disabled: '#6D6D6D',
-        contrast: '#000000',
-      },
-      accent:{
-        main: '#FFCD29',
-        dark: '#CE8602',
-        light: '#FFDD43',
-        contrast: '#000000',
-      },
-      primary:{
-        main: '#D5D5D5',
-        dark: '#E9E9E9',
-        light: '#9A9A9A',
-      },
-      secondary:{
-        main: '#4F4F4F',
-        dark: '#454545',
-        light: '#6D6D6D',
-      },
-      error:{
-        main: '#E74C4C',
-        dark: '#B22323',
-        light: '#F27777',
-      },
-      warning:{
-        main: '#FF8C0A',
-        dark: '#CC5302',
-        light: '#FFA732',
-      },
-      info:{
-        main: '#00AFFF',
-        dark: '#006BAB',
-        light: '#2CC1FF',
-      },
-      success:{
-        main: '#42A547',
-        dark: '#2A6B2D',
-        light: '#67C16B',
-      },
-      background:{
-        default: '#262626',
-        accent100:'#333333',
-        accent200:'#454545',
-        accent300:'#4F4F4F',
-      },
-      action:{
-        active: '#171717',
-        hover: '#3D3D3D',
-        selected: '#4E4E4E',
-        disabledBackground: '#3C3C3C',
-        disabled: '#383838',
-      },
-      actionBackground:{
-        enabled: '#FFFFFF',
-        hovered: '#FFFFFF',
-        selected: '#FFFFFF',
-        disabled: '#383838',
-      },
-      actionOutlinedBorder:{
-        enabled: '#7B7B7B',
-        hovered: '#2F2F2F',
-        selected: '#404040',
-        disabled: '#383838',
-      },
-      misc:{
-        divider: '#404040',
-      },
-    },
-  },
-
-  spacing: {
-    small: '4px',
-    medium: '8px',
-    large: '16px',
-  },
-  
-  typography: {
-    family: 'Inter, sans-serif',
-    h1: {
-      weight: '300',
-      size: '96px',
-      lineHeight: '120%',
-      letterSpacing: '-1.5px',
-    },
-    h2: {
-      weight: '300',
-      size: '60px',
-      lineHeight: '120%',
-      letterSpacing: '-0.5px',
-    },
-    h3: {
-      weight: '400',
-      size: '48px',
-      lineHeight: '120%',
-      letterSpacing: '0px',
-    },
-    h4: {
-      weight: '400',
-      size: '34px',
-      lineHeight: '120%',
-      letterSpacing: '0.3px',
-    },
-    h5: {
-      weight: '400',
-      size: '24px',
-      lineHeight: '120%',
-      letterSpacing: '0px',
-    },
-    h6: {
-      weight: '500',
-      size: '20px',
-      lineHeight: '150%',
-      letterSpacing: '0.2px',
-    },
-    subtitle1: {
-      weight: '500',
-      size: '16px',
-      lineHeight: '150%',
-      letterSpacing: '0.2px',
-    },
-    subtitle2: {
-      weight: '500',
-      size: '14px',
-      lineHeight: '150%',
-      letterSpacing: '0.1px',
-    },
-    body1: {
-      weight: '400',
-      size: '16px',
-      lineHeight: '150%',
-      letterSpacing: '0.2px',
-    },
-    body2: {
-      weight: '400',
-      size: '14px',
-      lineHeight: '150%',
-      letterSpacing: '0.2px',
-    },
-    caption: {
-      weight: '400',
-      size: '12px',
-      lineHeight: '150%',
-      letterSpacing: '0.5px',
-    },
-    alignments: {
-      left: 'left',
-      center: 'center',
-      right: 'right',
-      justify: 'justify',
-    },
-  },
-};

package/index.css

@@ -1,8 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500&display=swap');
-
-body {
-  font-family: 'Inter', sans-serif;
-}

package/index.ts

@@ -1,21 +0,0 @@
-import './index.css';
-import './designTokens';
-
-export * from './components/alert';
-export * from './components/button';
-export * from './components/checkBox';
-export * from './components/emptyBox';
-export * from './components/iconButton';
-export * from './components/loadingScreen';
-export * from './components/menu';
-export * from './components/menuItem';
-export * from './components/modal';
-export * from './components/navigation';
-export * from './components/popover';
-export * from './components/select';
-export * from './components/tab';
-export * from './components/tag';
-export * from './components/textField';
-export * from './components/timeStamp'
-export * from './components/tooltip';
-export * from './components/userImage';

package/next.config.mjs

@@ -1,4 +0,0 @@
-/** @type {import('next').NextConfig} */
-const nextConfig = {};
-
-export default nextConfig;

package/postcss.config.mjs

@@ -1,8 +0,0 @@
-/** @type {import('postcss-load-config').Config} */
-const config = {
-  plugins: {
-    tailwindcss: {},
-  },
-};
-
-export default config;

package/tailwind.config.ts

@@ -1,232 +0,0 @@
-import type { Config } from "tailwindcss";
-
-const designTokens = require('./designTokens');
-
-const config: Config = {
-  content: [
-    "./components/**/*.{js,ts,jsx,tsx,mdx}",
-  ],
-  theme: {
-    extend: {
-      colors: {
-        // Light: text colors
-        'light-text-primary': designTokens.colors.light.text.primary,
-        'light-text-secondary': designTokens.colors.light.text.secondary,
-        'light-text-disabled': designTokens.colors.light.text.disabled,
-        'light-text-contrast': designTokens.colors.light.text.contrast,
-        
-        // Dark: text colors
-        'dark-text-primary': designTokens.colors.dark.text.primary,
-        'dark-text-secondary': designTokens.colors.dark.text.secondary,
-        'dark-text-disabled': designTokens.colors.dark.text.disabled,
-        'dark-text-contrast': designTokens.colors.dark.text.contrast,
-
-        // light: accent colors
-        'light-accent-main': designTokens.colors.light.accent.main,
-        'light-accent-dark': designTokens.colors.light.accent.dark,
-        'light-accent-light': designTokens.colors.light.accent.light,
-        'light-accent-contrast': designTokens.colors.light.accent.contrast,
-
-        // dark: accent colors
-        'dark-accent-main': designTokens.colors.dark.accent.main,
-        'dark-accent-dark': designTokens.colors.dark.accent.dark,
-        'dark-accent-light': designTokens.colors.dark.accent.light,
-        'dark-accent-contrast': designTokens.colors.dark.accent.contrast,
-
-        // Light: primary colors
-        'light-primary-main': designTokens.colors.light.primary.main,
-        'light-primary-dark': designTokens.colors.light.primary.dark,
-        'light-primary-light': designTokens.colors.light.primary.light,
-        'light-primary-contrast': designTokens.colors.light.primary.contrast,
-        
-        // Dark: primary colors
-        'dark-primary-main': designTokens.colors.dark.primary.main,
-        'dark-primary-dark': designTokens.colors.dark.primary.dark,
-        'dark-primary-light': designTokens.colors.dark.primary.light,
-        'dark-primary-contrast': designTokens.colors.dark.primary.contrast,
-
-        // light: secondary colors
-        'light-secondary-main': designTokens.colors.light.secondary.main,
-        'light-secondary-dark': designTokens.colors.light.secondary.dark,
-        'light-secondary-light': designTokens.colors.light.secondary.light,
-        
-        // dark: secondary colors
-        'dark-secondary-main': designTokens.colors.dark.secondary.main,
-        'dark-secondary-dark': designTokens.colors.dark.secondary.dark,
-        'dark-secondary-light': designTokens.colors.dark.secondary.light,
-        
-        // light: error colors
-        'light-error-main': designTokens.colors.light.error.main,
-        'light-error-dark': designTokens.colors.light.error.dark,
-        'light-error-light': designTokens.colors.light.error.light,
-        
-        // dark: error colors
-        'dark-error-main': designTokens.colors.dark.error.main,
-        'dark-error-dark': designTokens.colors.dark.error.dark,
-        'dark-error-light': designTokens.colors.dark.error.light,
-
-        // light: warning colors
-        'light-warning-main': designTokens.colors.light.warning.main,
-        'light-warning-dark': designTokens.colors.light.warning.dark,
-        'light-warning-light': designTokens.colors.light.warning.light,
-        
-        // dark: warning colors
-        'dark-warning-main': designTokens.colors.dark.warning.main,
-        'dark-warning-dark': designTokens.colors.dark.warning.dark,
-        'dark-warning-light': designTokens.colors.dark.warning.light,
-
-        // light: info colors
-        'light-info-main': designTokens.colors.light.info.main,
-        'light-info-dark': designTokens.colors.light.info.dark,
-        'light-info-light': designTokens.colors.light.info.light,
-
-        // dark: info colors
-        'dark-info-main': designTokens.colors.dark.info.main,
-        'dark-info-dark': designTokens.colors.dark.info.dark,
-        'dark-info-light': designTokens.colors.dark.info.light,
-
-        // light: success colors
-        'light-success-main': designTokens.colors.light.success.main,
-        'light-success-dark': designTokens.colors.light.success.dark,
-        'light-success-light': designTokens.colors.light.success.light,
-
-        // dark: success colors
-        'dark-success-main': designTokens.colors.dark.success.main,
-        'dark-success-dark': designTokens.colors.dark.success.dark,
-        'dark-success-light': designTokens.colors.dark.success.light,
-
-        // Light: background colors
-        'light-background-default': designTokens.colors.light.background.default,
-        'light-background-accent100': designTokens.colors.light.background.accent100,
-        'light-background-accent200': designTokens.colors.light.background.accent200,
-        'light-background-accent300': designTokens.colors.light.background.accent300,
-        
-        // Dark: background colors
-        'dark-background-default': designTokens.colors.dark.background.default,
-        'dark-background-accent100': designTokens.colors.dark.background.accent100,
-        'dark-background-accent200': designTokens.colors.dark.background.accent200,
-        'dark-background-accent300': designTokens.colors.dark.background.accent300,
-
-        // Light: action colors
-        'light-action-active': designTokens.colors.light.action.active,
-        'light-action-hover': designTokens.colors.light.action.hover,
-        'light-action-selected': designTokens.colors.light.action.selected,
-        'light-action-disabledBackground': designTokens.colors.light.action.disabledBackground,
-        'light-action-disabled': designTokens.colors.light.action.disabled,
-
-        // Dark: action colors
-        'dark-action-active': designTokens.colors.dark.action.active,
-        'dark-action-hover': designTokens.colors.dark.action.hover,
-        'dark-action-selected': designTokens.colors.dark.action.selected,
-        'dark-action-disabledBackground': designTokens.colors.dark.action.disabledBackground,
-        'dark-action-disabled': designTokens.colors.dark.action.disabled,
-
-        // light: action background
-        'light-actionBackground-enabled': designTokens.colors.light.actionBackground.enabled,
-        'light-actionBackground-hovered': designTokens.colors.light.actionBackground.hovered,
-        'light-actionBackground-selected': designTokens.colors.light.actionBackground.selected,
-        'light-actionBackground-disabled': designTokens.colors.light.actionBackground.disabled,
-
-        // dark: action background
-        'dark-actionBackground-enabled': designTokens.colors.dark.actionBackground.enabled,
-        'dark-actionBackground-hovered': designTokens.colors.dark.actionBackground.hovered,
-        'dark-actionBackground-selected': designTokens.colors.dark.actionBackground.selected,
-        'dark-actionBackground-disabled': designTokens.colors.dark.actionBackground.disabled,
-
-        // light: action outlinedBorder
-        'light-actionOutlinedBorder-enabled': designTokens.colors.light.actionOutlinedBorder.enabled,
-        'light-actionOutlinedBorder-hovered': designTokens.colors.light.actionOutlinedBorder.hovered,
-        'light-actionOutlinedBorder-selected': designTokens.colors.light.actionOutlinedBorder.selected,
-        'light-actionOutlinedBorder-disabled': designTokens.colors.light.actionOutlinedBorder.disabled,
-
-        // dark: action outlinedBorder
-        'dark-actionOutlinedBorder-enabled': designTokens.colors.dark.actionOutlinedBorder.enabled,
-        'dark-actionOutlinedBorder-hovered': designTokens.colors.dark.actionOutlinedBorder.hovered,
-        'dark-actionOutlinedBorder-selected': designTokens.colors.dark.actionOutlinedBorder.selected,
-        'dark-actionOutlinedBorder-disabled': designTokens.colors.dark.actionOutlinedBorder.disabled,
-
-        // misc light colors
-        'light-misc-divider': designTokens.colors.light.misc.divider,
-
-        // misc dark colors
-        'dark-misc-divider': designTokens.colors.dark.misc.divider,
-
-        'dark-misc-scrollbar-bg': designTokens.colors.dark.background.default,
-        'dark-misc-scrollbar-thumb': designTokens.colors.dark.background.accent200,
-      },
-      spacing: {
-        small: designTokens.spacing.small,
-        medium: designTokens.spacing.medium,
-        large: designTokens.spacing.large,
-      },
-      fontSize: {
-        h1: designTokens.typography.h1.size,
-        h2: designTokens.typography.h2.size,
-        h3: designTokens.typography.h3.size,
-        h4: designTokens.typography.h4.size,
-        h5: designTokens.typography.h5.size,
-        h6: designTokens.typography.h6.size,
-        subtitle1: designTokens.typography.subtitle1.size,
-        subtitle2: designTokens.typography.subtitle2.size,
-        body1: designTokens.typography.body1.size,
-        body2: designTokens.typography.body2.size,
-        caption: designTokens.typography.caption.size,
-      },
-      fontFamily: {
-        inter: designTokens.typography.family,
-      },
-      fontWeight: {
-        h1: designTokens.typography.h1.weight,
-        h2: designTokens.typography.h2.weight,
-        h3: designTokens.typography.h3.weight,
-        h4: designTokens.typography.h4.weight,
-        h5: designTokens.typography.h5.weight,
-        h6: designTokens.typography.h6.weight,
-        subtitle1: designTokens.typography.subtitle1.weight,
-        subtitle2: designTokens.typography.subtitle2.weight,
-        body1: designTokens.typography.body1.weight,
-        body2: designTokens.typography.body2.weight,
-        caption: designTokens.typography.caption.weight,
-      },
-      letterSpacing: {
-        h1: designTokens.typography.h1.letterSpacing,
-        h2: designTokens.typography.h2.letterSpacing,
-        h3: designTokens.typography.h3.letterSpacing,
-        h4: designTokens.typography.h4.letterSpacing,
-        h5: designTokens.typography.h5.letterSpacing,
-        h6: designTokens.typography.h6.letterSpacing,
-        subtitle1: designTokens.typography.subtitle1.letterSpacing,
-        subtitle2: designTokens.typography.subtitle2.letterSpacing,
-        body1: designTokens.typography.body1.letterSpacing,
-        body2: designTokens.typography.body2.letterSpacing,
-        caption: designTokens.typography.caption.letterSpacing,
-      },
-      lineHeight: {
-        h1: designTokens.typography.h1.lineHeight,
-        h2: designTokens.typography.h2.lineHeight,
-        h3: designTokens.typography.h3.lineHeight,
-        h4: designTokens.typography.h4.lineHeight,
-        h5: designTokens.typography.h5.lineHeight,
-        h6: designTokens.typography.h6.lineHeight,
-        subtitle1: designTokens.typography.subtitle1.lineHeight,
-        subtitle2: designTokens.typography.subtitle2.lineHeight,
-        body1: designTokens.typography.body1.lineHeight,
-        body2: designTokens.typography.body2.lineHeight,
-        caption: designTokens.typography.caption.lineHeight,
-      },
-      textAlign: {
-        left: designTokens.typography.alignments.left,
-        center: designTokens.typography.alignments.center,
-        right: designTokens.typography.alignments.right,
-        justify: designTokens.typography.alignments.justify,
-      },
-    },
-  },
-  plugins: [
-    require('tailwindcss'),
-    require('autoprefixer'),
-    require('tailwind-scrollbar'),
-    
-  ],
-};
-export default config;

package/tsconfig.json

@@ -1,37 +0,0 @@
-{
-  "compilerOptions": {
-    "lib": [ "dom", "dom.iterable", "esnext" ],
-    "allowJs": true,
-    "skipLibCheck": true,
-    "strict": true,
-    "esModuleInterop": true,
-    "module": "esnext",
-    "moduleResolution": "node",
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "jsx": "preserve",
-    "incremental": true,
-    "plugins": [
-      {
-        "name": "next"
-      }
-    ],
-    "paths": {
-      "@/*": [ "./*" ]
-    },
-    "forceConsistentCasingInFileNames": true,
-    "declaration": true,
-    "declarationDir": "./dist", // Output .d.ts files to dist
-    "outDir": "./dist",        // Output compiled .js files to dist
-    "emitDeclarationOnly": false
-  },
-  "include": [
-    "next-env.d.ts",
-    "**/*.ts",
-    "**/*.tsx",
-    "components/*.tsx",
-    "*.js",
-    "index.css"
-  ],
-  "exclude": [ "node_modules",  "dist" ]
-}