@syntrologie/adapt-nav 2.8.0-canary.31 → 2.8.0-canary.310

package/node_modules/@syntro/design-system/dist/tailwind-preset.js

@@ -1,453 +0,0 @@
-/**
- * Syntro Design System - Tailwind Preset
- *
- * Import and extend this preset in your Tailwind config to use the design system.
- *
- * @example
- * ```typescript
- * import { syntroPreset } from '@syntro/design-system/tailwind-preset';
- *
- * export default {
- *   presets: [syntroPreset],
- *   content: ['./src/**\/*.{ts,tsx}'],
- * };
- * ```
- */
-import { colors } from './tokens/colors';
-import { backdropBlur, focusRings, overlay, shadows } from './tokens/effects';
-export const syntroPreset = {
-    darkMode: ['class'],
-    theme: {
-        extend: {
-            colors: {
-                // Base colors
-                white: colors.base.white,
-                black: colors.base.black,
-                // Brand scale
-                brand: {
-                    0: colors.brand[0],
-                    1: colors.brand[1],
-                    2: colors.brand[2],
-                    3: colors.brand[3],
-                    4: colors.brand[4],
-                    5: colors.brand[5],
-                    6: colors.brand[6],
-                    7: colors.brand[7],
-                    8: colors.brand[8],
-                    9: colors.brand[9],
-                    DEFAULT: colors.brand[3],
-                },
-                // Neutral scale (Slate Grey)
-                'slate-grey': {
-                    0: colors.slateGrey[0],
-                    1: colors.slateGrey[1],
-                    2: colors.slateGrey[2],
-                    3: colors.slateGrey[3],
-                    4: colors.slateGrey[4],
-                    5: colors.slateGrey[5],
-                    6: colors.slateGrey[6],
-                    7: colors.slateGrey[7],
-                    8: colors.slateGrey[8],
-                    9: colors.slateGrey[9],
-                    10: colors.slateGrey[10],
-                    11: colors.slateGrey[11],
-                    12: colors.slateGrey[12],
-                    DEFAULT: colors.slateGrey[6],
-                },
-                // Semantic color scales
-                green: {
-                    0: colors.green[0],
-                    1: colors.green[1],
-                    2: colors.green[2],
-                    3: colors.green[3],
-                    4: colors.green[4],
-                    5: colors.green[5],
-                    6: colors.green[6],
-                    7: colors.green[7],
-                    8: colors.green[8],
-                    9: colors.green[9],
-                    DEFAULT: colors.green[4],
-                },
-                yellow: {
-                    0: colors.yellow[0],
-                    1: colors.yellow[1],
-                    2: colors.yellow[2],
-                    3: colors.yellow[3],
-                    4: colors.yellow[4],
-                    5: colors.yellow[5],
-                    6: colors.yellow[6],
-                    7: colors.yellow[7],
-                    8: colors.yellow[8],
-                    9: colors.yellow[9],
-                    DEFAULT: colors.yellow[4],
-                },
-                red: {
-                    0: colors.red[0],
-                    1: colors.red[1],
-                    2: colors.red[2],
-                    3: colors.red[3],
-                    4: colors.red[4],
-                    5: colors.red[5],
-                    6: colors.red[6],
-                    7: colors.red[7],
-                    8: colors.red[8],
-                    9: colors.red[9],
-                    DEFAULT: colors.red[4],
-                },
-                blue: {
-                    0: colors.blue[0],
-                    1: colors.blue[1],
-                    2: colors.blue[2],
-                    3: colors.blue[3],
-                    4: colors.blue[4],
-                    5: colors.blue[5],
-                    6: colors.blue[6],
-                    7: colors.blue[7],
-                    8: colors.blue[8],
-                    9: colors.blue[9],
-                    DEFAULT: colors.blue[4],
-                },
-                orange: {
-                    0: colors.orange[0],
-                    1: colors.orange[1],
-                    2: colors.orange[2],
-                    3: colors.orange[3],
-                    4: colors.orange[4],
-                    5: colors.orange[5],
-                    6: colors.orange[6],
-                    7: colors.orange[7],
-                    8: colors.orange[8],
-                    9: colors.orange[9],
-                    DEFAULT: colors.orange[3],
-                },
-                purple: {
-                    0: colors.purple[0],
-                    1: colors.purple[1],
-                    2: colors.purple[2],
-                    3: colors.purple[3],
-                    4: colors.purple[4],
-                    5: colors.purple[5],
-                    6: colors.purple[6],
-                    7: colors.purple[7],
-                    8: colors.purple[8],
-                    9: colors.purple[9],
-                    DEFAULT: colors.purple[4],
-                },
-                pink: {
-                    0: colors.pink[0],
-                    1: colors.pink[1],
-                    2: colors.pink[2],
-                    3: colors.pink[3],
-                    4: colors.pink[4],
-                    5: colors.pink[5],
-                    6: colors.pink[6],
-                    7: colors.pink[7],
-                    8: colors.pink[8],
-                    9: colors.pink[9],
-                    DEFAULT: colors.pink[4],
-                },
-                // Semantic tokens
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                text: {
-                    primary: colors.text.primary,
-                    secondary: colors.text.secondary,
-                    tertiary: colors.text.tertiary,
-                    DEFAULT: colors.text.primary,
-                },
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                background: {
-                    primary: colors.background.primary,
-                    secondary: colors.background.secondary,
-                    DEFAULT: colors.background.primary,
-                },
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                border: {
-                    primary: colors.border.primary,
-                    secondary: colors.border.secondary,
-                    DEFAULT: colors.border.primary,
-                },
-                // Component tokens - Button
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                'btn-primary': {
-                    DEFAULT: colors.button.primary.backgroundDefault,
-                    hover: colors.button.primary.backgroundHover,
-                    text: colors.button.primary.text,
-                    border: colors.button.primary.border,
-                },
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                'btn-neutral': {
-                    DEFAULT: colors.button.neutral.background,
-                    text: colors.button.neutral.text,
-                    'text-hover': colors.button.neutral.textHover,
-                    border: colors.button.neutral.border,
-                },
-                'btn-link': {
-                    text: colors.button.link.text,
-                    hover: colors.button.link.hover,
-                },
-                'btn-error': {
-                    text: colors.button.error.text,
-                    hover: colors.button.error.hover,
-                },
-                'btn-success': {
-                    text: colors.button.success.text,
-                    hover: colors.button.success.hover,
-                },
-                // Component tokens - Card
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                card: {
-                    bg: colors.card.background,
-                    content: colors.card.content,
-                    border: colors.card.border,
-                },
-                // Component tokens - Modal
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                modal: {
-                    bg: colors.modal.background,
-                    content: colors.modal.content,
-                    border: colors.modal.border,
-                },
-                // Component tokens - Sidebar
-                sidebar: {
-                    DEFAULT: colors.sidebar.backgroundDefault,
-                    hover: colors.sidebar.backgroundHover,
-                    active: colors.sidebar.backgroundActive,
-                    border: colors.sidebar.border,
-                    'content-primary': colors.sidebar.contentPrimary,
-                    'content-secondary': colors.sidebar.contentSecondary,
-                    'content-tertiary': colors.sidebar.contentTertiary,
-                },
-                // Component tokens - Tab
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                tab: {
-                    'active-bg': colors.tab.activeBackground,
-                    'active-content': colors.tab.activeContent,
-                    'inactive-content': colors.tab.inactiveContent,
-                    border: colors.tab.border,
-                },
-                // Component tokens - Table
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                'table-header': {
-                    text: colors.table.header.textDefault,
-                    'text-hover': colors.table.header.textHover,
-                    bg: colors.table.header.backgroundDefault,
-                },
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                'table-cell': {
-                    // biome-ignore lint: Tailwind preset defines semantic token names, not usage of shadcn color classes
-                    'text-primary': colors.table.cell.textPrimary,
-                    // biome-ignore lint: Tailwind preset defines semantic token names, not usage of shadcn color classes
-                    'text-secondary': colors.table.cell.textSecondary,
-                    bg: colors.table.cell.backgroundDefault,
-                    'bg-hover': colors.table.cell.backgroundHover,
-                },
-                'table-border': colors.table.border,
-                // Component tokens - Input
-                'input-field': {
-                    bg: colors.inputField.backgroundDefault,
-                    'bg-disabled': colors.inputField.backgroundDisabled,
-                    'text-label': colors.inputField.textLabel,
-                    'text-placeholder': colors.inputField.textPlaceholder,
-                    'text-hint': colors.inputField.textHint,
-                    'text-error': colors.inputField.textError,
-                    border: colors.inputField.borderDefault,
-                    'border-selected': colors.inputField.borderSelected,
-                    'border-error': colors.inputField.borderError,
-                },
-                // Component tokens - Badge (9 variants)
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                'badge-slate': {
-                    content: colors.badge.slateGrey.content,
-                    outline: colors.badge.slateGrey.pillOutline,
-                    border: colors.badge.slateGrey.borderPrimary,
-                    bg: colors.badge.slateGrey.background,
-                },
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                'badge-brand': {
-                    content: colors.badge.brand.content,
-                    outline: colors.badge.brand.pillOutline,
-                    border: colors.badge.brand.borderPrimary,
-                    bg: colors.badge.brand.background,
-                },
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                'badge-green': {
-                    content: colors.badge.green.content,
-                    outline: colors.badge.green.pillOutline,
-                    border: colors.badge.green.borderPrimary,
-                    bg: colors.badge.green.background,
-                },
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                'badge-yellow': {
-                    content: colors.badge.yellow.content,
-                    outline: colors.badge.yellow.pillOutline,
-                    border: colors.badge.yellow.borderPrimary,
-                    bg: colors.badge.yellow.background,
-                },
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                'badge-red': {
-                    content: colors.badge.red.content,
-                    outline: colors.badge.red.pillOutline,
-                    border: colors.badge.red.borderPrimary,
-                    bg: colors.badge.red.background,
-                },
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                'badge-blue': {
-                    content: colors.badge.blue.content,
-                    outline: colors.badge.blue.pillOutline,
-                    border: colors.badge.blue.borderPrimary,
-                    bg: colors.badge.blue.background,
-                },
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                'badge-purple': {
-                    content: colors.badge.purple.content,
-                    outline: colors.badge.purple.pillOutline,
-                    border: colors.badge.purple.borderPrimary,
-                    bg: colors.badge.purple.background,
-                },
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                'badge-orange': {
-                    content: colors.badge.orange.content,
-                    outline: colors.badge.orange.pillOutline,
-                    border: colors.badge.orange.borderPrimary,
-                    bg: colors.badge.orange.background,
-                },
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                'badge-pink': {
-                    content: colors.badge.pink.content,
-                    outline: colors.badge.pink.pillOutline,
-                    border: colors.badge.pink.borderPrimary,
-                    bg: colors.badge.pink.background,
-                },
-                // Component tokens - Toggle
-                toggle: {
-                    handle: colors.toggle.handleDefault,
-                    'handle-disabled': colors.toggle.handleDisabled,
-                    'off-bg': colors.toggle.off.backgroundDefault,
-                    'off-bg-hover': colors.toggle.off.backgroundHover,
-                    'on-bg': colors.toggle.on.backgroundDefault,
-                    'on-bg-hover': colors.toggle.on.backgroundHover,
-                },
-                // Component tokens - Menu
-                // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-                menu: {
-                    DEFAULT: colors.menu.backgroundDefault,
-                    hover: colors.menu.backgroundHover,
-                    selected: colors.menu.selected,
-                },
-                // Component tokens - Alert
-                'alert-green': {
-                    content: colors.alert.green.content,
-                    bg: colors.alert.green.background,
-                },
-                'alert-yellow': {
-                    content: colors.alert.yellow.content,
-                    bg: colors.alert.yellow.background,
-                },
-                'alert-red': {
-                    content: colors.alert.red.content,
-                    bg: colors.alert.red.background,
-                },
-            },
-            // Typography
-            fontSize: {
-                xs: ['0.75rem', { lineHeight: '1rem' }],
-                sm: ['0.875rem', { lineHeight: '1.25rem' }],
-                base: ['1rem', { lineHeight: '1.5rem' }],
-                lg: ['1.125rem', { lineHeight: '1.75rem' }],
-                xl: ['1.25rem', { lineHeight: '1.75rem' }],
-                '2xl': ['1.5rem', { lineHeight: '2rem' }],
-                '3xl': ['1.875rem', { lineHeight: '2.25rem' }],
-                '4xl': ['2.25rem', { lineHeight: '2.5rem' }],
-                '5xl': ['3rem', { lineHeight: '1' }],
-                '6xl': ['3.75rem', { lineHeight: '1' }],
-            },
-            // Spacing
-            spacing: {
-                0: '0',
-                1: '0.25rem',
-                2: '0.5rem',
-                3: '0.75rem',
-                4: '1rem',
-                5: '1.25rem',
-                6: '1.5rem',
-                8: '2rem',
-                10: '2.5rem',
-                12: '3rem',
-                16: '4rem',
-                20: '5rem',
-                24: '6rem',
-                32: '8rem',
-            },
-            // Border radius
-            borderRadius: {
-                none: '0',
-                sm: '0.125rem',
-                DEFAULT: '0.25rem',
-                md: '0.375rem',
-                lg: '0.5rem',
-                xl: '0.75rem',
-                '2xl': '1rem',
-                '3xl': '1.5rem',
-                full: '9999px',
-            },
-            // Box shadow — Figma shadow scale
-            boxShadow: {
-                ...shadows,
-                DEFAULT: shadows.sm,
-                // Focus rings (4px spread + xs shadow)
-                'focus-primary': focusRings.primary,
-                'focus-neutral': focusRings.neutral,
-                'focus-error': focusRings.error,
-            },
-            // Backdrop blur — Figma scale
-            // biome-ignore lint: Tailwind preset intentionally maps design tokens from source
-            backdropBlur: {
-                sm: backdropBlur.sm,
-                md: backdropBlur.md,
-                lg: backdropBlur.lg,
-                xl: backdropBlur.xl,
-            },
-            // Overlay background colors
-            backgroundColor: {
-                'overlay-solid': overlay.solid,
-                'overlay-blur': overlay.blur,
-            },
-            // Animation
-            keyframes: {
-                'fade-in': {
-                    '0%': { opacity: '0' },
-                    '100%': { opacity: '1' },
-                },
-                'fade-out': {
-                    '0%': { opacity: '1' },
-                    '100%': { opacity: '0' },
-                },
-                'slide-in-from-top': {
-                    '0%': { transform: 'translateY(-100%)' },
-                    '100%': { transform: 'translateY(0)' },
-                },
-                'slide-in-from-bottom': {
-                    '0%': { transform: 'translateY(100%)' },
-                    '100%': { transform: 'translateY(0)' },
-                },
-                'slide-in-from-left': {
-                    '0%': { transform: 'translateX(-100%)' },
-                    '100%': { transform: 'translateX(0)' },
-                },
-                'slide-in-from-right': {
-                    '0%': { transform: 'translateX(100%)' },
-                    '100%': { transform: 'translateX(0)' },
-                },
-            },
-            animation: {
-                'fade-in': 'fade-in 0.2s ease-out',
-                'fade-out': 'fade-out 0.2s ease-out',
-                'slide-in-from-top': 'slide-in-from-top 0.3s ease-out',
-                'slide-in-from-bottom': 'slide-in-from-bottom 0.3s ease-out',
-                'slide-in-from-left': 'slide-in-from-left 0.3s ease-out',
-                'slide-in-from-right': 'slide-in-from-right 0.3s ease-out',
-            },
-        },
-    },
-};
-export default syntroPreset;