@syntrologie/adapt-nav 2.1.0 → 2.2.0-canary.2

package/node_modules/@syntro/design-system/dist/tokens/colors.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../../src/tokens/colors.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAMH,eAAO,MAAM,IAAI;;;CAGP,CAAC;AAMX,eAAO,MAAM,KAAK;;;;;;;;;;;CAWR,CAAC;AAMX,eAAO,MAAM,SAAS;;;;;;;;;;;;;;CAcZ,CAAC;AAMX,eAAO,MAAM,KAAK;;;;;;;;;;;CAWR,CAAC;AAEX,eAAO,MAAM,MAAM;;;;;;;;;;;CAWT,CAAC;AAEX,eAAO,MAAM,GAAG;;;;;;;;;;;CAWN,CAAC;AAEX,eAAO,MAAM,IAAI;;;;;;;;;;;CAWP,CAAC;AAEX,eAAO,MAAM,MAAM;;;;;;;;;;;CAWT,CAAC;AAEX,eAAO,MAAM,MAAM;;;;;;;;;;;CAWT,CAAC;AAEX,eAAO,MAAM,IAAI;;;;;;;;;;;CAWP,CAAC;AAMX,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8CT,CAAC;AAMX,eAAO,MAAM,IAAI;;;;CAIP,CAAC;AAMX,eAAO,MAAM,UAAU;;;CAGb,CAAC;AAMX,eAAO,MAAM,MAAM;;;CAGT,CAAC;AAMX,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6BT,CAAC;AAMX,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgER,CAAC;AAMX,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;CAgBd,CAAC;AAMX,eAAO,MAAM,KAAK;;;;;;;;;;;;;CAaR,CAAC;AAMX,eAAO,MAAM,GAAG;;;;CAIN,CAAC;AAMX,eAAO,MAAM,IAAI;;;;CAIP,CAAC;AAMX,eAAO,MAAM,aAAa;;;;;;;;CAQhB,CAAC;AAEX,eAAO,MAAM,UAAU;;;;;;;;;;;;;CAab,CAAC;AAMX,eAAO,MAAM,MAAM;;;;;;;;;;;;;CAaT,CAAC;AAMX,eAAO,MAAM,QAAQ;;;;;;;;;;;;;CAaX,CAAC;AAMX,eAAO,MAAM,MAAM;;;CAGT,CAAC;AAMX,eAAO,MAAM,iBAAiB;;;CAGpB,CAAC;AAMX,eAAO,MAAM,IAAI;;;;CAIP,CAAC;AAMX,eAAO,MAAM,OAAO;;;;;;;;CAQV,CAAC;AAMX,eAAO,MAAM,KAAK;;;;CAIR,CAAC;AAMX,eAAO,MAAM,GAAG;;;;;CAKN,CAAC;AAMX,eAAO,MAAM,KAAK;;;;;;;;;;;;;CAaR,CAAC;AAMX,eAAO,MAAM,WAAW;;;;;;;CAOd,CAAC;AAMX,eAAO,MAAM,gBAAgB;;;CAGnB,CAAC;AAMX,eAAO,MAAM,UAAU;;;;;;;;CAQb,CAAC;AAMX,eAAO,MAAM,MAAM,WAAe,CAAC;AAMnC,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoCT,CAAC;AAEX,eAAe,MAAM,CAAC"}

package/node_modules/@syntro/design-system/dist/tokens/colors.js

@@ -0,0 +1,564 @@
+/**
+ * Syntro Design System - Color Tokens
+ *
+ * This file contains all color tokens from the Figma design system.
+ * Colors are organized by scale and semantic meaning.
+ *
+ * @see https://www.figma.com/design/U0Ol5vM7FQvgPfIgCAgxgb/Design-System
+ */
+// ============================================================================
+// BASE COLORS
+// ============================================================================
+export const base = {
+    white: '#ffffff',
+    black: '#000000',
+};
+// ============================================================================
+// BRAND COLORS
+// ============================================================================
+export const brand = {
+    0: '#2c0b0a',
+    1: '#5b1715',
+    2: '#89221f',
+    3: '#b72e2a',
+    4: '#d44844',
+    5: '#dd6d69',
+    6: '#e5918f',
+    7: '#eeb6b4',
+    8: '#f6dada',
+    9: '#faebea',
+};
+// ============================================================================
+// NEUTRAL COLORS
+// ============================================================================
+export const slateGrey = {
+    0: '#07080a',
+    1: '#0f1318',
+    2: '#0e1114',
+    3: '#1c222a',
+    4: '#2b333f',
+    5: '#394454',
+    6: '#475569',
+    7: '#677384',
+    8: '#87919f',
+    9: '#a8afba',
+    10: '#cbd0d7',
+    11: '#e8eaee',
+    12: '#f6f7f9',
+};
+// ============================================================================
+// SEMANTIC COLOR SCALES
+// ============================================================================
+export const green = {
+    0: '#07230a',
+    1: '#0e4514',
+    2: '#16681e',
+    3: '#1d8a28',
+    4: '#24ad32',
+    5: '#4fbd5a',
+    6: '#7acd82',
+    7: '#a5deab',
+    8: '#d0eed3',
+    9: '#e5f6e7',
+};
+export const yellow = {
+    0: '#301f09',
+    1: '#5f3e12',
+    2: '#8f5e1b',
+    3: '#be7d24',
+    4: '#ee9c2d',
+    5: '#f1b057',
+    6: '#f5c481',
+    7: '#f8d7ab',
+    8: '#fcebd5',
+    9: '#fdf5ea',
+};
+export const red = {
+    0: '#330707',
+    1: '#660f0e',
+    2: '#991616',
+    3: '#cc1e1d',
+    4: '#ff2524',
+    5: '#ff5150',
+    6: '#ff7c7c',
+    7: '#ffa8a7',
+    8: '#ffd3d3',
+    9: '#ffe9e9',
+};
+export const blue = {
+    0: '#051533',
+    1: '#0a2a66',
+    2: '#0f3f98',
+    3: '#1454cb',
+    4: '#1969fe',
+    5: '#4787fe',
+    6: '#75a5fe',
+    7: '#a3c3ff',
+    8: '#d1e1ff',
+    9: '#e8f0ff',
+};
+export const orange = {
+    0: '#662500',
+    1: '#993d00',
+    2: '#cc5800',
+    3: '#ff7700',
+    4: '#fea85d',
+    5: '#fec58f',
+    6: '#ffd6ae',
+    7: '#fee6cd',
+    8: '#fff1e1',
+    9: '#fff8f0',
+};
+export const purple = {
+    0: '#151229',
+    1: '#2a2452',
+    2: '#40357c',
+    3: '#5547a5',
+    4: '#6a59ce',
+    5: '#887ad8',
+    6: '#a69be2',
+    7: '#c3bdeb',
+    8: '#e1def5',
+    9: '#f0eefa',
+};
+export const pink = {
+    0: '#37091f',
+    1: '#69123c',
+    2: '#9b1c58',
+    3: '#cd2575',
+    4: '#ff2e92',
+    5: '#ff58a8',
+    6: '#ff82be',
+    7: '#ffabd3',
+    8: '#ffd5e9',
+    9: '#ffeaf4',
+};
+// ============================================================================
+// LEGACY COLORS (Being phased out)
+// ============================================================================
+export const legacy = {
+    aqua: {
+        0: '#0c5f8d',
+        1: '#146b99',
+        2: '#1d78a6',
+        3: '#2e89b6',
+        4: '#4a9fc4',
+        5: '#6bb4d1',
+        6: '#93cce0',
+        7: '#bddff0',
+        8: '#dceef8',
+        9: '#f2f8fc',
+    },
+    violet: {
+        0: '#6927da',
+        1: '#7839ee',
+        2: '#875bf7',
+        3: '#a48afb',
+        4: '#c3b4fd',
+        5: '#ddd6fe',
+        6: '#ece9fe',
+        7: '#f5f3ff',
+        8: '#fbfaff',
+    },
+    fuchsia: {
+        0: '#9f1ab1',
+        1: '#ba24d5',
+        2: '#d444f1',
+        3: '#e478fa',
+        4: '#eeaafd',
+        5: '#f6d0fe',
+        6: '#fbe8ff',
+        7: '#fdf4ff',
+        8: '#fefaff',
+    },
+    pink: {
+        0: '#a10f5f',
+        1: '#dd2590',
+        2: '#ee46bc',
+        3: '#f670c7',
+        4: '#faa7e0',
+        5: '#fcceee',
+        6: '#fce7f6',
+        7: '#fdf2fa',
+        8: '#fef6fb',
+    },
+};
+// ============================================================================
+// TEXT TOKENS
+// ============================================================================
+export const text = {
+    primary: slateGrey[10],
+    secondary: slateGrey[9],
+    tertiary: slateGrey[8],
+};
+// ============================================================================
+// BACKGROUND TOKENS
+// ============================================================================
+export const background = {
+    primary: slateGrey[2],
+    secondary: slateGrey[0],
+};
+// ============================================================================
+// BORDER TOKENS
+// ============================================================================
+export const border = {
+    primary: slateGrey[4],
+    secondary: slateGrey[3],
+};
+// ============================================================================
+// BUTTON TOKENS
+// ============================================================================
+export const button = {
+    primary: {
+        text: base.white,
+        icon: base.white,
+        border: brand[3],
+        backgroundDefault: brand[3],
+        backgroundHover: brand[2],
+    },
+    neutral: {
+        text: slateGrey[10],
+        textHover: base.white,
+        icon: slateGrey[10],
+        iconHover: base.white,
+        border: slateGrey[4],
+        background: slateGrey[2],
+    },
+    link: {
+        text: base.white,
+        icon: base.white,
+        hover: brand[5],
+    },
+    error: {
+        text: red[5],
+        hover: red[6],
+    },
+    success: {
+        text: green[5],
+        hover: green[6],
+    },
+};
+// ============================================================================
+// BADGE TOKENS
+// ============================================================================
+export const badge = {
+    slateGrey: {
+        content: slateGrey[10],
+        pillOutline: slateGrey[10],
+        borderPrimary: slateGrey[5],
+        borderSecondary: slateGrey[5],
+        background: slateGrey[3],
+    },
+    brand: {
+        content: brand[9],
+        pillOutline: brand[9],
+        borderPrimary: brand[6],
+        borderSecondary: brand[6],
+        background: brand[0],
+    },
+    red: {
+        content: red[8],
+        pillOutline: red[4],
+        borderPrimary: red[2],
+        borderSecondary: red[2],
+        background: red[0],
+    },
+    yellow: {
+        content: yellow[8],
+        pillOutline: yellow[4],
+        borderPrimary: yellow[2],
+        borderSecondary: yellow[2],
+        background: yellow[0],
+    },
+    green: {
+        content: green[8],
+        pillOutline: green[4],
+        borderPrimary: green[2],
+        borderSecondary: green[2],
+        background: green[0],
+    },
+    purple: {
+        content: purple[8],
+        pillOutline: purple[4],
+        borderPrimary: purple[2],
+        borderSecondary: purple[2],
+        background: purple[0],
+    },
+    blue: {
+        content: blue[8],
+        pillOutline: blue[4],
+        borderPrimary: blue[2],
+        borderSecondary: blue[2],
+        background: blue[0],
+    },
+    orange: {
+        content: orange[8],
+        pillOutline: orange[4],
+        borderPrimary: orange[2],
+        borderSecondary: orange[2],
+        background: orange[0],
+    },
+    pink: {
+        content: pink[8],
+        pillOutline: pink[4],
+        borderPrimary: pink[2],
+        borderSecondary: pink[2],
+        background: pink[0],
+    },
+};
+// ============================================================================
+// BADGE BANNER TOKENS
+// ============================================================================
+export const badgeBanner = {
+    green: {
+        content: green[8],
+        border: green[2],
+        background: green[0],
+    },
+    yellow: {
+        content: yellow[8],
+        border: yellow[2],
+        background: yellow[0],
+    },
+    red: {
+        content: red[8],
+        border: red[2],
+        background: red[0],
+    },
+};
+// ============================================================================
+// ALERT TOKENS
+// ============================================================================
+export const alert = {
+    green: {
+        content: green[1],
+        background: green[9],
+    },
+    yellow: {
+        content: yellow[1],
+        background: yellow[9],
+    },
+    red: {
+        content: red[1],
+        background: red[9],
+    },
+};
+// ============================================================================
+// TAG TOKENS
+// ============================================================================
+export const tag = {
+    content: slateGrey[10],
+    border: slateGrey[4],
+    background: '#1c2124',
+};
+// ============================================================================
+// MENU TOKENS
+// ============================================================================
+export const menu = {
+    backgroundDefault: slateGrey[2],
+    backgroundHover: slateGrey[1],
+    selected: slateGrey[3],
+};
+// ============================================================================
+// INPUT/DROPDOWN TOKENS
+// ============================================================================
+export const inputDropdown = {
+    background: slateGrey[2],
+    icon: slateGrey[10],
+    borderDefault: slateGrey[4],
+    borderSelected: brand[3],
+    textLabel: slateGrey[9],
+    textPlaceholder: slateGrey[8],
+    textHint: slateGrey[8],
+};
+export const inputField = {
+    backgroundDefault: slateGrey[2],
+    backgroundDisabled: slateGrey[0],
+    textLabel: slateGrey[9],
+    textPlaceholder: slateGrey[8],
+    textHint: slateGrey[8],
+    textError: red[5],
+    iconDefault: slateGrey[9],
+    iconPlaceholder: slateGrey[10],
+    iconError: red[5],
+    borderDefault: slateGrey[4],
+    borderSelected: brand[3],
+    borderError: red[5],
+};
+// ============================================================================
+// TOGGLE TOKENS
+// ============================================================================
+export const toggle = {
+    handleDefault: base.white,
+    handleDisabled: slateGrey[10],
+    off: {
+        backgroundDefault: slateGrey[4],
+        backgroundHover: slateGrey[5],
+        backgroundDisabled: slateGrey[4],
+    },
+    on: {
+        backgroundDefault: green[3],
+        backgroundHover: green[2],
+        backgroundDisabled: slateGrey[4],
+    },
+};
+// ============================================================================
+// CHECKBOX TOKENS
+// ============================================================================
+export const checkbox = {
+    off: {
+        backgroundDefault: '#00000000',
+        backgroundHover: slateGrey[5],
+        backgroundDisabled: slateGrey[2],
+        border: slateGrey[6],
+    },
+    on: {
+        backgroundDefault: green[0],
+        backgroundHover: green[1],
+        backgroundDisabled: slateGrey[2],
+        border: green[3],
+    },
+};
+// ============================================================================
+// AVATAR TOKENS
+// ============================================================================
+export const avatar = {
+    content: slateGrey[10],
+    background: slateGrey[4],
+};
+// ============================================================================
+// PROGRESS BAR & SLIDER TOKENS
+// ============================================================================
+export const progressBarSlider = {
+    background: slateGrey[4],
+    active: green[3],
+};
+// ============================================================================
+// CARD TOKENS
+// ============================================================================
+export const card = {
+    background: slateGrey[1],
+    content: slateGrey[9],
+    border: slateGrey[4],
+};
+// ============================================================================
+// SIDEBAR TOKENS
+// ============================================================================
+export const sidebar = {
+    backgroundDefault: slateGrey[1],
+    backgroundHover: slateGrey[3],
+    backgroundActive: slateGrey[4],
+    border: slateGrey[4],
+    contentPrimary: slateGrey[10],
+    contentSecondary: slateGrey[9],
+    contentTertiary: slateGrey[8],
+};
+// ============================================================================
+// MODAL TOKENS
+// ============================================================================
+export const modal = {
+    background: slateGrey[1],
+    content: slateGrey[9],
+    border: slateGrey[4],
+};
+// ============================================================================
+// TAB TOKENS
+// ============================================================================
+export const tab = {
+    activeBackground: slateGrey[3],
+    activeContent: brand[5],
+    inactiveContent: slateGrey[9],
+    border: slateGrey[4],
+};
+// ============================================================================
+// TABLE TOKENS
+// ============================================================================
+export const table = {
+    header: {
+        textDefault: slateGrey[9],
+        textHover: slateGrey[8],
+        backgroundDefault: slateGrey[1],
+    },
+    border: slateGrey[4],
+    cell: {
+        textPrimary: slateGrey[10],
+        textSecondary: slateGrey[9],
+        backgroundDefault: slateGrey[2],
+        backgroundHover: slateGrey[1],
+    },
+};
+// ============================================================================
+// BREADCRUMBS TOKENS
+// ============================================================================
+export const breadcrumbs = {
+    textPrimaryDefault: slateGrey[10],
+    textPrimaryHover: slateGrey[10],
+    textSecondaryDefault: slateGrey[8],
+    textSecondaryHover: slateGrey[9],
+    iconPrimary: slateGrey[10],
+    iconSecondary: slateGrey[8],
+};
+// ============================================================================
+// LOADING INDICATOR TOKENS
+// ============================================================================
+export const loadingIndicator = {
+    background: green[1],
+    active: green[5],
+};
+// ============================================================================
+// DATE PICKER TOKENS
+// ============================================================================
+export const datePicker = {
+    textDefault: slateGrey[10],
+    textSelected: base.white,
+    textDisabled: slateGrey[7],
+    backgroundDefault: slateGrey[2],
+    backgroundMiddle: slateGrey[3],
+    backgroundSelected: brand[3],
+    border: slateGrey[4],
+};
+// ============================================================================
+// MISC TOKENS
+// ============================================================================
+export const scroll = slateGrey[9];
+// ============================================================================
+// EXPORTS
+// ============================================================================
+export const colors = {
+    base,
+    brand,
+    slateGrey,
+    green,
+    yellow,
+    red,
+    blue,
+    orange,
+    purple,
+    pink,
+    legacy,
+    text,
+    background,
+    border,
+    button,
+    badge,
+    badgeBanner,
+    alert,
+    tag,
+    menu,
+    inputDropdown,
+    inputField,
+    toggle,
+    checkbox,
+    avatar,
+    progressBarSlider,
+    card,
+    sidebar,
+    modal,
+    tab,
+    table,
+    breadcrumbs,
+    loadingIndicator,
+    datePicker,
+    scroll,
+};
+export default colors;

package/node_modules/@syntro/design-system/dist/tokens/effects.css

@@ -0,0 +1,43 @@
+/**
+ * Syntro Design System - Effect CSS Variables
+ *
+ * Import this file in your application to use effect tokens as CSS custom properties.
+ * Usage: box-shadow: var(--syntro-shadow-md);
+ *
+ * @see https://www.figma.com/design/U0Ol5vM7FQvgPfIgCAgxgb/Design-System
+ */
+
+:root {
+  /* ========================================================================== */
+  /* SHADOW SCALE                                                               */
+  /* ========================================================================== */
+  --syntro-shadow-xs: 0 1px 2px 0 rgba(16,24,40,0.05);
+  --syntro-shadow-sm: 0 1px 3px 0 rgba(16,24,40,0.10), 0 1px 2px -1px rgba(16,24,40,0.10);
+  --syntro-shadow-md: 0 4px 6px -1px rgba(16,24,40,0.10), 0 2px 4px -2px rgba(16,24,40,0.10);
+  --syntro-shadow-lg: 0 10px 15px -3px rgba(16,24,40,0.10), 0 4px 6px -4px rgba(16,24,40,0.10);
+  --syntro-shadow-xl: 0 20px 25px -5px rgba(16,24,40,0.10), 0 8px 10px -6px rgba(16,24,40,0.10);
+  --syntro-shadow-2xl: 0 25px 50px -12px rgba(16,24,40,0.25);
+  --syntro-shadow-3xl: 0 35px 60px -15px rgba(16,24,40,0.35);
+  --syntro-shadow-inner: inset 0 2px 4px 0 rgba(16,24,40,0.05);
+
+  /* ========================================================================== */
+  /* FOCUS RINGS                                                                */
+  /* ========================================================================== */
+  --syntro-focus-ring-primary: 0 0 0 4px rgba(221,109,105,0.25), 0 1px 2px 0 rgba(16,24,40,0.05);
+  --syntro-focus-ring-neutral: 0 0 0 4px rgba(135,145,159,0.25), 0 1px 2px 0 rgba(16,24,40,0.05);
+  --syntro-focus-ring-error: 0 0 0 4px rgba(255,81,80,0.25), 0 1px 2px 0 rgba(16,24,40,0.05);
+
+  /* ========================================================================== */
+  /* BACKDROP BLUR                                                              */
+  /* ========================================================================== */
+  --syntro-backdrop-blur-sm: 8px;
+  --syntro-backdrop-blur-md: 16px;
+  --syntro-backdrop-blur-lg: 24px;
+  --syntro-backdrop-blur-xl: 40px;
+
+  /* ========================================================================== */
+  /* OVERLAY                                                                    */
+  /* ========================================================================== */
+  --syntro-overlay-solid: rgba(0,0,0,0.70);
+  --syntro-overlay-blur: rgba(0,0,0,0.25);
+}

package/node_modules/@syntro/design-system/dist/tokens/effects.d.ts

@@ -0,0 +1,85 @@
+/**
+ * Syntro Design System - Effect Tokens
+ *
+ * Non-color effect tokens from the Figma design system:
+ * shadows, focus rings, backdrop blurs, and overlays.
+ *
+ * @see https://www.figma.com/design/U0Ol5vM7FQvgPfIgCAgxgb/Design-System
+ */
+/**
+ * Figma shadow scale using rgba(16,24,40,...) base.
+ * Each step increases vertical offset and blur radius.
+ */
+export declare const shadows: {
+    readonly xs: "0 1px 2px 0 rgba(16,24,40,0.05)";
+    readonly sm: "0 1px 3px 0 rgba(16,24,40,0.10), 0 1px 2px -1px rgba(16,24,40,0.10)";
+    readonly md: "0 4px 6px -1px rgba(16,24,40,0.10), 0 2px 4px -2px rgba(16,24,40,0.10)";
+    readonly lg: "0 10px 15px -3px rgba(16,24,40,0.10), 0 4px 6px -4px rgba(16,24,40,0.10)";
+    readonly xl: "0 20px 25px -5px rgba(16,24,40,0.10), 0 8px 10px -6px rgba(16,24,40,0.10)";
+    readonly '2xl': "0 25px 50px -12px rgba(16,24,40,0.25)";
+    readonly '3xl': "0 35px 60px -15px rgba(16,24,40,0.35)";
+    readonly inner: "inset 0 2px 4px 0 rgba(16,24,40,0.05)";
+    readonly none: "none";
+};
+/**
+ * Focus ring shadows — 4px spread + xs shadow for depth.
+ * Used via `shadow-focus-primary`, `shadow-focus-neutral`, `shadow-focus-error`.
+ *
+ * Colors reference design system color tokens:
+ *   primary → brand-5 (#dd6d69)
+ *   neutral → slateGrey-8 (#87919f)
+ *   error   → red-5 (#ff5150)
+ */
+export declare const focusRings: {
+    readonly primary: "0 0 0 4px rgba(221,109,105,0.25), 0 1px 2px 0 rgba(16,24,40,0.05)";
+    readonly neutral: "0 0 0 4px rgba(135,145,159,0.25), 0 1px 2px 0 rgba(16,24,40,0.05)";
+    readonly error: "0 0 0 4px rgba(255,81,80,0.25), 0 1px 2px 0 rgba(16,24,40,0.05)";
+};
+/**
+ * Figma backdrop blur scale.
+ */
+export declare const backdropBlur: {
+    readonly sm: "8px";
+    readonly md: "16px";
+    readonly lg: "24px";
+    readonly xl: "40px";
+};
+/**
+ * Modal/dialog overlay backgrounds.
+ *   solid → full-screen scrim (opaque)
+ *   blur  → lighter scrim intended to pair with backdrop-blur
+ */
+export declare const overlay: {
+    readonly solid: "rgba(0,0,0,0.70)";
+    readonly blur: "rgba(0,0,0,0.25)";
+};
+export declare const effects: {
+    readonly shadows: {
+        readonly xs: "0 1px 2px 0 rgba(16,24,40,0.05)";
+        readonly sm: "0 1px 3px 0 rgba(16,24,40,0.10), 0 1px 2px -1px rgba(16,24,40,0.10)";
+        readonly md: "0 4px 6px -1px rgba(16,24,40,0.10), 0 2px 4px -2px rgba(16,24,40,0.10)";
+        readonly lg: "0 10px 15px -3px rgba(16,24,40,0.10), 0 4px 6px -4px rgba(16,24,40,0.10)";
+        readonly xl: "0 20px 25px -5px rgba(16,24,40,0.10), 0 8px 10px -6px rgba(16,24,40,0.10)";
+        readonly '2xl': "0 25px 50px -12px rgba(16,24,40,0.25)";
+        readonly '3xl': "0 35px 60px -15px rgba(16,24,40,0.35)";
+        readonly inner: "inset 0 2px 4px 0 rgba(16,24,40,0.05)";
+        readonly none: "none";
+    };
+    readonly focusRings: {
+        readonly primary: "0 0 0 4px rgba(221,109,105,0.25), 0 1px 2px 0 rgba(16,24,40,0.05)";
+        readonly neutral: "0 0 0 4px rgba(135,145,159,0.25), 0 1px 2px 0 rgba(16,24,40,0.05)";
+        readonly error: "0 0 0 4px rgba(255,81,80,0.25), 0 1px 2px 0 rgba(16,24,40,0.05)";
+    };
+    readonly backdropBlur: {
+        readonly sm: "8px";
+        readonly md: "16px";
+        readonly lg: "24px";
+        readonly xl: "40px";
+    };
+    readonly overlay: {
+        readonly solid: "rgba(0,0,0,0.70)";
+        readonly blur: "rgba(0,0,0,0.25)";
+    };
+};
+export default effects;
+//# sourceMappingURL=effects.d.ts.map

package/node_modules/@syntro/design-system/dist/tokens/effects.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"effects.d.ts","sourceRoot":"","sources":["../../src/tokens/effects.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAMH;;;GAGG;AACH,eAAO,MAAM,OAAO;;;;;;;;;;CAUV,CAAC;AAMX;;;;;;;;GAQG;AACH,eAAO,MAAM,UAAU;;;;CAIb,CAAC;AAMX;;GAEG;AACH,eAAO,MAAM,YAAY;;;;;CAKf,CAAC;AAMX;;;;GAIG;AACH,eAAO,MAAM,OAAO;;;CAGV,CAAC;AAMX,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;CAKV,CAAC;AAEX,eAAe,OAAO,CAAC"}