@admin-layout/tailwind-ui 10.1.1-alpha.20 → 10.1.1-alpha.23

package/lib/components/ThemeProvider/themes/github.js

@@ -0,0 +1,190 @@
+// GitHub-inspired theme
+const githubTheme = {
+  name: 'github',
+  colors: {
+    primary: {
+      50: '#f0f6fc',
+      100: '#ddf4ff',
+      200: '#b6e3ff',
+      300: '#80ccff',
+      400: '#54aeff',
+      500: '#0969da',
+      // GitHub primary blue
+      600: '#0550ae',
+      700: '#033d8b',
+      800: '#0a3069',
+      900: '#002155',
+      950: '#001440'
+    },
+    secondary: {
+      50: '#f6f8fa',
+      100: '#eaeef2',
+      200: '#d0d7de',
+      300: '#afb8c1',
+      400: '#8c959f',
+      500: '#6e7781',
+      // GitHub secondary gray
+      600: '#57606a',
+      700: '#424a53',
+      800: '#32383f',
+      900: '#24292f',
+      950: '#1b1f24'
+    },
+    accent: {
+      50: '#fff8c5',
+      100: '#fae17d',
+      200: '#eac54f',
+      300: '#d4a72c',
+      400: '#bf8700',
+      500: '#bf8700',
+      // GitHub yellow/gold
+      600: '#9e6a03',
+      700: '#845306',
+      800: '#693e00',
+      900: '#4b2900',
+      950: '#3b1400'
+    },
+    success: {
+      50: '#dafbe1',
+      100: '#aceebb',
+      200: '#6fdd8b',
+      300: '#4ac26b',
+      400: '#2da44e',
+      500: '#1a7f37',
+      // GitHub green
+      600: '#116329',
+      700: '#044f1e',
+      800: '#003d16',
+      900: '#002d11',
+      950: '#001e0b'
+    },
+    warning: {
+      50: '#fff8c5',
+      100: '#ffef9e',
+      200: '#ffe16a',
+      300: '#fac515',
+      400: '#eaa700',
+      500: '#9e6a03',
+      // GitHub orange/warning
+      600: '#845306',
+      700: '#693e00',
+      800: '#4b2900',
+      900: '#3b1400',
+      950: '#2f0e00'
+    },
+    error: {
+      50: '#ffebe9',
+      100: '#ffcecb',
+      200: '#ffaba8',
+      300: '#ff8182',
+      400: '#fa4549',
+      500: '#cf222e',
+      // GitHub red/error
+      600: '#a40e26',
+      700: '#82071e',
+      800: '#660018',
+      900: '#4c0014',
+      950: '#3a0012'
+    },
+    neutral: {
+      50: '#f6f8fa',
+      100: '#eaeef2',
+      200: '#d0d7de',
+      300: '#afb8c1',
+      400: '#8c959f',
+      500: '#6e7781',
+      600: '#57606a',
+      700: '#424a53',
+      800: '#32383f',
+      900: '#24292f',
+      950: '#1b1f24'
+    },
+    background: {
+      light: '#ffffff',
+      dark: '#0d1117'
+    },
+    text: {
+      light: {
+        primary: '#24292f',
+        secondary: '#57606a',
+        tertiary: '#6e7781'
+      },
+      dark: {
+        primary: '#e6edf3',
+        secondary: '#c9d1d9',
+        tertiary: '#8b949e'
+      }
+    }
+  },
+  borderRadius: {
+    sm: '3px',
+    DEFAULT: '6px',
+    md: '8px',
+    lg: '12px',
+    xl: '16px',
+    '2xl': '24px',
+    full: '9999px'
+  },
+  fontFamily: {
+    sans: ['-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Noto Sans', 'Helvetica', 'Arial', 'sans-serif', 'Apple Color Emoji', 'Segoe UI Emoji'],
+    serif: ['Georgia', 'Cambria', 'Times New Roman', 'Times', 'serif'],
+    mono: ['SFMono-Regular', 'Consolas', 'Liberation Mono', 'Menlo', 'monospace']
+  },
+  boxShadow: {
+    sm: '0 1px 0 rgba(27,31,36,0.04)',
+    DEFAULT: '0 1px 3px rgba(27,31,36,0.12)',
+    md: '0 3px 6px rgba(27,31,36,0.15)',
+    lg: '0 8px 24px rgba(140,149,159,0.2)',
+    xl: '0 12px 28px rgba(140,149,159,0.3)'
+  },
+  typography: {
+    headings: {
+      fontWeight: '600',
+      lineHeight: '1.25',
+      letterSpacing: '-0.01em'
+    },
+    body: {
+      fontWeight: '400',
+      lineHeight: '1.5',
+      letterSpacing: '0'
+    }
+  },
+  // Component specific styling
+  components: {
+    buttons: {
+      primary: {
+        background: '#2da44e',
+        text: '#ffffff',
+        hoverBackground: '#2c974b',
+        hoverText: '#ffffff',
+        borderRadius: '6px',
+        padding: '5px 16px',
+        fontWeight: '600'
+      },
+      secondary: {
+        background: '#f6f8fa',
+        text: '#24292f',
+        border: '1px solid rgba(27,31,36,0.15)',
+        hoverBackground: '#f3f4f6',
+        hoverText: '#24292f',
+        borderRadius: '6px',
+        padding: '5px 16px',
+        fontWeight: '600'
+      }
+    },
+    cards: {
+      borderRadius: '6px',
+      padding: '16px',
+      shadow: '0 1px 3px rgba(27,31,36,0.12)',
+      border: '1px solid #d0d7de'
+    },
+    inputs: {
+      borderRadius: '6px',
+      borderColor: '#d0d7de',
+      focusBorderColor: '#0969da',
+      padding: '5px 12px',
+      fontSize: '14px',
+      lineHeight: '1.5'
+    }
+  }
+};export{githubTheme};//# sourceMappingURL=github.js.map

package/lib/components/ThemeProvider/themes/github.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"github.js","sources":["../../../../src/components/ThemeProvider/themes/github.ts"],"sourcesContent":[null],"names":[],"mappings":"AAAA;AAGA,MAAA,WAAa,GAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/components/ThemeProvider/themes/index.d.ts

@@ -0,0 +1,15 @@
+import { ThemeName } from '../types';
+export * from './airbnb';
+export * from './slack';
+export * from './github';
+export * from './spotify';
+export * from './default';
+export declare const themes: {
+    airbnb: import("../types").DefaultTheme;
+    slack: import("../types").DefaultTheme;
+    github: import("../types").DefaultTheme;
+    spotify: import("../types").DefaultTheme;
+    default: import("../types").DefaultTheme;
+};
+export declare const getTheme: (themeName: ThemeName) => import("../types").DefaultTheme;
+//# sourceMappingURL=index.d.ts.map

package/lib/components/ThemeProvider/themes/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ThemeProvider/themes/index.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAErC,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAE1B,eAAO,MAAM,MAAM;;;;;;CAMlB,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,WAAW,SAAS,oCAE5C,CAAC"}

package/lib/components/ThemeProvider/themes/index.js

@@ -0,0 +1,7 @@
+import {airbnbTheme}from'./airbnb.js';import {slackTheme}from'./slack.js';import {githubTheme}from'./github.js';import {spotifyTheme}from'./spotify.js';import {defaultTheme}from'./default.js';const themes = {
+  airbnb: airbnbTheme,
+  slack: slackTheme,
+  github: githubTheme,
+  spotify: spotifyTheme,
+  default: defaultTheme
+};export{airbnbTheme,defaultTheme,githubTheme,slackTheme,spotifyTheme,themes};//# sourceMappingURL=index.js.map

package/lib/components/ThemeProvider/themes/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/ThemeProvider/themes/index.ts"],"sourcesContent":[null],"names":[],"mappings":";;EAmBE,KAAA,EAAA,UAAA;AAEF,EAAA,MAAA,EAAA,WAAa;;;"}

package/lib/components/ThemeProvider/themes/slack.d.ts

@@ -0,0 +1,3 @@
+import { DefaultTheme } from '../types';
+export declare const slackTheme: DefaultTheme;
+//# sourceMappingURL=slack.d.ts.map

package/lib/components/ThemeProvider/themes/slack.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"slack.d.ts","sourceRoot":"","sources":["../../../../src/components/ThemeProvider/themes/slack.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAGxC,eAAO,MAAM,UAAU,EAAE,YAsLxB,CAAC"}

package/lib/components/ThemeProvider/themes/slack.js

@@ -0,0 +1,188 @@
+// Slack-inspired theme
+const slackTheme = {
+  name: 'slack',
+  colors: {
+    primary: {
+      50: '#f5f3ff',
+      100: '#ede9fe',
+      200: '#ddd6fe',
+      300: '#c4b5fd',
+      400: '#a78bfa',
+      500: '#4A154B',
+      // Slack primary purple
+      600: '#4c1d95',
+      700: '#4a1d96',
+      800: '#3b0764',
+      900: '#2e0249',
+      950: '#1e0235'
+    },
+    secondary: {
+      50: '#fdf5f9',
+      100: '#fceef6',
+      200: '#fad5ea',
+      300: '#f5aad3',
+      400: '#ed7aba',
+      500: '#E01E5A',
+      // Slack pink
+      600: '#cf1259',
+      700: '#a8104e',
+      800: '#861244',
+      900: '#73103a',
+      950: '#4b031f'
+    },
+    accent: {
+      50: '#ebf9ff',
+      100: '#d0efff',
+      200: '#a8dfff',
+      300: '#6ac8ff',
+      400: '#2eadff',
+      500: '#36C5F0',
+      // Slack blue
+      600: '#0384c7',
+      700: '#0168a1',
+      800: '#045584',
+      900: '#07476e',
+      950: '#042b45'
+    },
+    success: {
+      50: '#f0fdf4',
+      100: '#dcfce7',
+      200: '#bbf7d0',
+      300: '#86efac',
+      400: '#4ade80',
+      500: '#2EB67D',
+      // Slack green
+      600: '#16a34a',
+      700: '#15803d',
+      800: '#166534',
+      900: '#14532d',
+      950: '#052e16'
+    },
+    warning: {
+      50: '#fffbeb',
+      100: '#fef3c7',
+      200: '#fde68a',
+      300: '#fcd34d',
+      400: '#fbbf24',
+      500: '#f59e0b',
+      600: '#d97706',
+      700: '#b45309',
+      800: '#92400e',
+      900: '#78350f',
+      950: '#451a03'
+    },
+    error: {
+      50: '#fef2f2',
+      100: '#fee2e2',
+      200: '#fecaca',
+      300: '#fca5a5',
+      400: '#f87171',
+      500: '#ef4444',
+      600: '#dc2626',
+      700: '#b91c1c',
+      800: '#991b1b',
+      900: '#7f1d1d',
+      950: '#450a0a'
+    },
+    neutral: {
+      50: '#fafafa',
+      100: '#f5f5f5',
+      200: '#e5e5e5',
+      300: '#d4d4d4',
+      400: '#a3a3a3',
+      500: '#737373',
+      600: '#525252',
+      700: '#404040',
+      800: '#262626',
+      900: '#171717',
+      950: '#0a0a0a'
+    },
+    background: {
+      light: '#ffffff',
+      dark: '#1a1d21'
+    },
+    text: {
+      light: {
+        primary: '#1d1c1d',
+        secondary: '#616061',
+        tertiary: '#868686'
+      },
+      dark: {
+        primary: '#ffffff',
+        secondary: '#d1d2d3',
+        tertiary: '#9f9f9f'
+      }
+    }
+  },
+  borderRadius: {
+    sm: '2px',
+    DEFAULT: '4px',
+    md: '8px',
+    lg: '12px',
+    xl: '16px',
+    '2xl': '24px',
+    full: '9999px'
+  },
+  fontFamily: {
+    sans: ['Slack-Lato', 'Lato', 'appleLogo', 'sans-serif'],
+    serif: ['Georgia', 'Cambria', 'Times New Roman', 'Times', 'serif'],
+    mono: ['Monaco', 'Menlo', 'Consolas', 'Courier New', 'monospace']
+  },
+  boxShadow: {
+    sm: '0 1px 3px 0 rgba(0, 0, 0, 0.08)',
+    DEFAULT: '0 0 0 1px rgba(29, 28, 29, 0.13)',
+    md: '0 4px 12px 0 rgba(0, 0, 0, 0.12)',
+    lg: '0 0 0 1px rgba(29, 28, 29, 0.13), 0 8px 16px 0 rgba(0, 0, 0, 0.2)',
+    xl: '0 16px 32px rgba(0, 0, 0, 0.24)'
+  },
+  typography: {
+    headings: {
+      fontWeight: '700',
+      lineHeight: '1.2',
+      letterSpacing: '-0.015em'
+    },
+    body: {
+      fontWeight: '400',
+      lineHeight: '1.5',
+      letterSpacing: '-0.01em'
+    }
+  },
+  // Component specific styling
+  components: {
+    buttons: {
+      primary: {
+        background: '#4A154B',
+        text: '#FFFFFF',
+        hoverBackground: '#611f69',
+        hoverText: '#FFFFFF',
+        borderRadius: '4px',
+        padding: '8px 16px',
+        fontWeight: '700'
+      },
+      secondary: {
+        background: '#FFFFFF',
+        text: '#1d1c1d',
+        border: '1px solid #C4C4C4',
+        hoverBackground: '#F8F8F8',
+        hoverText: '#1d1c1d',
+        borderRadius: '4px',
+        padding: '8px 16px',
+        fontWeight: '700'
+      }
+    },
+    cards: {
+      borderRadius: '4px',
+      padding: '16px',
+      shadow: '0 0 0 1px rgba(29,28,29,.13), 0 1px 3px 0 rgba(0,0,0,.08)',
+      border: 'none'
+    },
+    inputs: {
+      borderRadius: '4px',
+      borderColor: '#868686',
+      focusBorderColor: '#1264a3',
+      padding: '8px 12px',
+      fontSize: '15px',
+      lineHeight: '1.5'
+    }
+  }
+};export{slackTheme};//# sourceMappingURL=slack.js.map

package/lib/components/ThemeProvider/themes/slack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slack.js","sources":["../../../../src/components/ThemeProvider/themes/slack.ts"],"sourcesContent":[null],"names":[],"mappings":"AAAA;AAGA,MAAA,UAAa,GAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/components/ThemeProvider/themes/spotify.d.ts

@@ -0,0 +1,3 @@
+import { DefaultTheme } from '../types';
+export declare const spotifyTheme: DefaultTheme;
+//# sourceMappingURL=spotify.d.ts.map

package/lib/components/ThemeProvider/themes/spotify.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"spotify.d.ts","sourceRoot":"","sources":["../../../../src/components/ThemeProvider/themes/spotify.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAGxC,eAAO,MAAM,YAAY,EAAE,YAsL1B,CAAC"}

package/lib/components/ThemeProvider/themes/spotify.js

@@ -0,0 +1,189 @@
+// Spotify-inspired theme
+const spotifyTheme = {
+  name: 'spotify',
+  colors: {
+    primary: {
+      50: '#ecfdf5',
+      100: '#d1fae5',
+      200: '#a7f3d0',
+      300: '#6ee7b7',
+      400: '#34d399',
+      500: '#1DB954',
+      // Spotify green
+      600: '#059669',
+      700: '#047857',
+      800: '#065f46',
+      900: '#064e3b',
+      950: '#022c22'
+    },
+    secondary: {
+      50: '#f8fafc',
+      100: '#f1f5f9',
+      200: '#e2e8f0',
+      300: '#cbd5e1',
+      400: '#94a3b8',
+      500: '#767676',
+      // Spotify secondary gray
+      600: '#475569',
+      700: '#334155',
+      800: '#1e293b',
+      900: '#0f172a',
+      950: '#020617'
+    },
+    accent: {
+      50: '#fff7ed',
+      100: '#ffedd5',
+      200: '#fed7aa',
+      300: '#fdba74',
+      400: '#fb923c',
+      500: '#f97316',
+      // Spotify orange
+      600: '#ea580c',
+      700: '#c2410c',
+      800: '#9a3412',
+      900: '#7c2d12',
+      950: '#431407'
+    },
+    success: {
+      50: '#f0fdf4',
+      100: '#dcfce7',
+      200: '#bbf7d0',
+      300: '#86efac',
+      400: '#4ade80',
+      500: '#1DB954',
+      // Spotify green (same as primary)
+      600: '#16a34a',
+      700: '#15803d',
+      800: '#166534',
+      900: '#14532d',
+      950: '#052e16'
+    },
+    warning: {
+      50: '#fffbeb',
+      100: '#fef3c7',
+      200: '#fde68a',
+      300: '#fcd34d',
+      400: '#fbbf24',
+      500: '#f59e0b',
+      600: '#d97706',
+      700: '#b45309',
+      800: '#92400e',
+      900: '#78350f',
+      950: '#451a03'
+    },
+    error: {
+      50: '#fef2f2',
+      100: '#fee2e2',
+      200: '#fecaca',
+      300: '#fca5a5',
+      400: '#f87171',
+      500: '#ef4444',
+      600: '#dc2626',
+      700: '#b91c1c',
+      800: '#991b1b',
+      900: '#7f1d1d',
+      950: '#450a0a'
+    },
+    neutral: {
+      50: '#f9fafb',
+      100: '#f3f4f6',
+      200: '#e5e7eb',
+      300: '#d1d5db',
+      400: '#9ca3af',
+      500: '#6b7280',
+      600: '#4b5563',
+      700: '#374151',
+      800: '#1f2937',
+      900: '#111827',
+      950: '#030712'
+    },
+    background: {
+      light: '#ffffff',
+      dark: '#121212' // Spotify dark background
+    },
+    text: {
+      light: {
+        primary: '#191414',
+        secondary: '#535353',
+        tertiary: '#b3b3b3'
+      },
+      dark: {
+        primary: '#ffffff',
+        secondary: '#b3b3b3',
+        tertiary: '#727272'
+      }
+    }
+  },
+  borderRadius: {
+    sm: '4px',
+    DEFAULT: '8px',
+    md: '12px',
+    lg: '16px',
+    xl: '24px',
+    '2xl': '32px',
+    full: '9999px'
+  },
+  fontFamily: {
+    sans: ['Circular', 'Helvetica Neue', 'Arial', 'sans-serif'],
+    serif: ['Georgia', 'Cambria', 'Times New Roman', 'Times', 'serif'],
+    mono: ['Courier New', 'monospace']
+  },
+  boxShadow: {
+    sm: '0 2px 4px rgba(0,0,0,0.05)',
+    DEFAULT: '0 4px 8px rgba(0,0,0,0.1)',
+    md: '0 8px 16px rgba(0,0,0,0.1)',
+    lg: '0 16px 32px rgba(0,0,0,0.15)',
+    xl: '0 24px 48px rgba(0,0,0,0.2)'
+  },
+  typography: {
+    headings: {
+      fontWeight: '700',
+      lineHeight: '1.2',
+      letterSpacing: '-0.04em'
+    },
+    body: {
+      fontWeight: '400',
+      lineHeight: '1.5',
+      letterSpacing: '0'
+    }
+  },
+  // Component specific styling
+  components: {
+    buttons: {
+      primary: {
+        background: '#1DB954',
+        text: '#FFFFFF',
+        hoverBackground: '#1ed760',
+        hoverText: '#FFFFFF',
+        borderRadius: '500px',
+        // Spotify uses pill-shaped buttons
+        padding: '12px 32px',
+        fontWeight: '700'
+      },
+      secondary: {
+        background: 'transparent',
+        text: '#FFFFFF',
+        border: '1px solid #727272',
+        hoverBackground: 'rgba(255,255,255,0.1)',
+        hoverText: '#FFFFFF',
+        borderRadius: '500px',
+        padding: '12px 32px',
+        fontWeight: '700'
+      }
+    },
+    cards: {
+      borderRadius: '8px',
+      padding: '16px',
+      shadow: '0 8px 24px rgba(0,0,0,0.5)',
+      border: 'none'
+    },
+    inputs: {
+      borderRadius: '4px',
+      borderColor: '#727272',
+      focusBorderColor: '#1DB954',
+      padding: '8px 12px',
+      fontSize: '14px',
+      lineHeight: '1.5'
+    }
+  }
+};export{spotifyTheme};//# sourceMappingURL=spotify.js.map

package/lib/components/ThemeProvider/themes/spotify.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"spotify.js","sources":["../../../../src/components/ThemeProvider/themes/spotify.ts"],"sourcesContent":[null],"names":[],"mappings":"AAAA;AAGA,MAAA,YAAa,GAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}