@economic/taco-tokens 1.4.1 → 2.1.0

package/README.md

@@ -1,30 +1,302 @@
-# @economic/taco-vis
+# @economic/taco-tokens
 
-The `@economic/taco-vis` package is a separate library to the main taco design system, but still depends on it being available. You should ensure `@economic/taco` is installed and configured in your application before using charts.
+This is the design tokens package for Taco and other consumers of the economic brand.
+Taco-tokens fetches tokens from Figma and converts them to CSS variables and TypeScript constants.
 
-## Install
+---
 
-`npm install --save @economic/taco-vis`
+## Overview
 
-## Setup
+This package provides design tokens in multiple formats:
 
-### Tailwind
+-   **CSS Variables** - for use in stylesheets
+-   **TypeScript Constants** - for use in JavaScript/TypeScript and config files
+
+**Note:** This is a standalone package that can be consumed directly, but most consumers will likely use `@economic/taco` which already includes and re-exports these tokens.
+
+---
+
+## Installation & Usage
+
+### For consumers not using Taco
+
+**Recommended:** Import directly from `@economic/taco-tokens`:
+
+```typescript
+// CSS variables
+import '@economic/taco-tokens/tokens.css';
+
+// TypeScript constants
+import { primaryColors, borderRadius, spacing } from '@economic/taco-tokens';
+```
+
+---
+
+## Package Structure
+
+```
+packages/taco-tokens/
+├── scripts/
+│   ├── fetch-tokens.ts    # Fetches tokens from Figma API (omitted)
+│   └── build-tokens.ts    # Converts JSON to CSS/TS (omitted)
+├── tokens/
+│   ├── tokens.json        # Source data (omitted)
+│   ├── tokens.css         # CSS variables (generated & committed)
+│   └── tokens.ts          # TypeScript constants (generated & committed)
+├── .env.example           # Required: FIGMA_API_TOKEN, FIGMA_FILE_ID
+└── package.json
+```
+
+---
+
+## Syncing Tokens from Figma
+
+### Prerequisites
+
+1. Create a `.env` file (see `.env.example`):
+
+    ```bash
+    FIGMA_API_TOKEN=your_token_here
+    FIGMA_FILE_ID=your_file_id_here
+    ```
+
+2. Currently the Figma file has tokens organized in frames/groups with TEXT nodes or color fills.
+
+### Sync Command
+
+Fetch from Figma and build all outputs:
+
+```bash
+cd packages/taco-tokens
+npm run sync-tokens
+```
+
+This runs:
 
-You should ensure the taco library is added to tailwind's `content` configuration, so that tailwind classes are not purged.
+1. `fetch-tokens` - Pulls from Figma → `tokens/tokens.json`
+2. `build-tokens` - Converts JSON → `tokens/tokens.css` + `tokens/tokens.ts`
+
+### Individual Scripts
+
+**Fetch only:**
+
+```bash
+npm run fetch-tokens
+```
+
+-   Reads Figma file via API (you'll need access to a token and the file)
+-   Extracts token values from TEXT nodes or fills
+-   Groups by frame name (e.g., "Primary Colors", "Spacing")
+-   Sorts by category order (see `CATEGORY_ORDER` in script)
+-   Outputs: `tokens/tokens.json`
+
+**Build only:**
+
+```bash
+npm run build-tokens
+```
+
+-   Reads: `tokens/tokens.json`
+-   Outputs:
+    -   `tokens/tokens.css` - CSS custom properties
+    -   `tokens/tokens.ts` - TypeScript constants with type safety
+
+---
+
+## Token Categories
+
+Generated tokens are grouped by category:
+
+-   **Primary Colors** - `tacoBlue`, `tacoGray`
+-   **Secondary Colors** - `tacoRed`, `tacoYellow`, `tacoGreen`
+-   **Tertiary Colors** - `tacoPink`, `tacoPurple`
+-   **Brand Colors** - `tacoBrandMorning`, `tacoBrandNoon`, `tacoBrandSunset`, `tacoBrandMidnight`
+-   **Spacing** - `tacoSpacing0` through `tacoSpacing12`
+-   **Typography** - `tacoWeightBold`, `tacoTextSm`, `tacoHeadingLg`, etc.
+-   **Border Radius** - `tacoRadius0` through `tacoRadiusFull`
+-   **Border Width** - `tacoBorderWidth0` through `tacoBorderWidth2`
+
+---
+
+## Integration with Taco
+
+### How Taco Consumes Tokens
+
+**In `packages/taco/src/index.tsx`:**
+
+```typescript
+// Import CSS
+import '@economic/taco-tokens/tokens.css';
+
+// Re-export TypeScript constants
+export * from '@economic/taco-tokens/tokens';
+```
+
+This means:
+
+-   ✅ CSS variables are automatically included in `taco.css`
+-   ✅ TypeScript constants are re-exported from `@economic/taco`
+-   ✅ Consumers get everything through a single package
+
+### Tailwind Integration
+
+The Taco Tailwind config imports and uses the TypeScript token constants directly:
 
 ```js
+// packages/taco/tailwind.config.js
+import { borderRadius } from '@economic/taco-tokens/tokens';
+
 module.exports = {
-    ...
-    content: [
-        ...
-        './node_modules/@economic/taco-vis/dist/taco-vis.js',
-        ...
-    ],
+    theme: {
+        extend: {
+            borderRadius: {
+                DEFAULT: borderRadius.tacoRadius4,
+                none: borderRadius.tacoRadius0,
+                sm: borderRadius.tacoRadius2,
+                lg: borderRadius.tacoRadius8,
+                xl: borderRadius.tacoRadius12,
+                full: borderRadius.tacoRadiusFull,
+            },
+        },
+    },
 };
 ```
 
-taco-vis also has its own stylesheet which should be imported alongside the main taco stylesheet:
+This compiles the actual values (e.g., `4px`, `8px`) directly into the CSS at build time for better performance.
+
+---
+
+## Publishing
+
+This package is published separately from `@economic/taco`:
+
+```bash
+# From packages/taco-tokens
+npm publish
+```
+
+**Version strategy:**
+
+-   `@economic/taco-tokens` has independent versioning
+-   `@economic/taco` specifies which version to consume
+
+**Access control:**
+
+-   `"private": false` - package can be published
+-   Scoped package `@economic/...` - restricted to organization by default
+
+---
+
+## Package Exports
+
+```json
+{
+    "main": "./tokens/tokens.ts",
+    "module": "./tokens/tokens.ts",
+    "types": "./tokens/tokens.ts",
+    "exports": {
+        ".": {
+            "import": "./tokens/tokens.ts",
+            "types": "./tokens/tokens.ts"
+        },
+        "./tokens": "./tokens/tokens.ts",
+        "./tokens.css": "./tokens/tokens.css"
+    }
+}
+```
+
+**Available imports:**
+
+```typescript
+// Main export (using default "." export)
+import { tokens, primaryColors, spacing } from '@economic/taco-tokens';
+
+// Explicit tokens path
+import { tokens, primaryColors, spacing } from '@economic/taco-tokens/tokens';
+
+// CSS
+import '@economic/taco-tokens/tokens.css';
+```
+
+---
+
+## Consumer Examples
+
+### CSS Only
+
+```css
+/* In your stylesheet */
+.my-component {
+    color: var(--taco-blue-500);
+    padding: var(--taco-spacing-4);
+    border-radius: var(--taco-radius-8);
+}
+```
+
+### TypeScript/JavaScript
+
+```typescript
+import { primaryColors, spacing } from '@economic/taco';
+
+const styles = {
+    color: primaryColors.tacoBlue500,
+    padding: spacing.tacoSpacing4,
+};
+```
+
+### Tailwind
+
+```jsx
+// Maps to tailwind utility classes via. the tailwind.config
+<div className="rounded-lg text-blue-500">Content</div>
+```
+
+---
+
+## Token Naming Convention
+
+**Pattern:** `taco[Category][Scale]`
+
+-   **Primary colors:** `tacoBlue100`, `tacoBlue500`, `tacoBlue900`
+-   **Spacing:** `tacoSpacing0`, `tacoSpacing1`, ..., `tacoSpacing12`
+-   **Typography:** `tacoTextSm`, `tacoTextMd`, `tacoHeadingLg`
+-   **Border radius:** `tacoRadius0`, `tacoRadius4`, `tacoRadiusFull`
+
+**CSS variables:** Kebab-case with `--` prefix
 
 ```css
-... @import '@economic/taco-vis/dist/taco-vis.css';
+--taco-blue-500
+--taco-spacing-4
+--taco-radius-8
 ```
+
+**TypeScript:** camelCase
+
+```typescript
+tacoBlue500;
+tacoSpacing4;
+tacoRadius8;
+```
+
+---
+
+## Troubleshooting
+
+**CSS variables not working?**
+
+-   Ensure `@economic/taco/taco.css` is imported before usage
+-   Check browser DevTools → Elements → Computed → look for CSS variables
+
+**TypeScript imports failing?**
+
+-   Run `npm install` from root to ensure workspace links are created
+-   Check `node_modules/@economic/taco-tokens` exists
+
+**Figma fetch failing?**
+
+-   Verify `.env` has correct `FIGMA_API_TOKEN` and `FIGMA_FILE_ID`
+-   Check token has access to the Figma file
+-   Ensure Figma file structure matches expected format
+-   Ensure you're not hitting a rate limit
+
+---

package/package.json

@@ -1,36 +1,36 @@
 {
     "name": "@economic/taco-tokens",
-    "version": "1.4.1",
-    "source": "src/index.ts",
-    "main": "dist/taco-tokens.js",
-    "module": "dist/taco-tokens.esm.js",
-    "scripts": {
-        "watch": "parcel watch",
-        "build": "parcel build"
+    "version": "2.1.0",
+    "private": false,
+    "license": "MIT",
+    "type": "module",
+    "main": "./tokens/tokens.ts",
+    "module": "./tokens/tokens.ts",
+    "types": "./tokens/tokens.ts",
+    "exports": {
+        ".": {
+            "import": "./tokens/tokens.ts",
+            "types": "./tokens/tokens.ts"
+        },
+        "./tokens": "./tokens/tokens.ts",
+        "./tokens.css": "./tokens/tokens.css"
     },
     "files": [
-        "dist",
+        "tokens",
         "README.md"
     ],
-    "targets": {
-        "main": {
-            "optimize": true
-        }
+    "scripts": {
+        "fetch-tokens": "node scripts/fetch-tokens.ts",
+        "build-tokens": "node scripts/build-tokens.ts",
+        "sync-tokens": "npm run fetch-tokens && npm run build-tokens",
+        "typecheck": "tsc --noEmit"
     },
-    "devDependencies": {
-        "@parcel/packager-ts": "^2.7.0",
-        "@parcel/transformer-typescript-types": "^2.7.0",
-        "parcel": "^2.7.0",
-        "typescript": "^4.9.5"
+    "dependencies": {
+        "dotenv": "^16.4.0"
     },
-    "browserslist": {
-        "development": [
-            "last 2 versions"
-        ],
-        "production": [
-            ">1%",
-            "last 5 versions"
-        ]
+    "devDependencies": {
+        "@types/node": "^22.13.10",
+        "typescript": "^5.9.3"
     },
-    "gitHead": "d4c2d49bda2a1531e9cbb3714bfb850b9310ac7e"
+    "gitHead": "dafe2042fbedda861b088b89cb837ffb40be6af7"
 }

package/tokens/tokens.css

@@ -0,0 +1,93 @@
+/**
+ * Taco Design Tokens
+ * Auto-generated from tokens.json - do not edit manually
+ */
+
+:root {
+    /* Primary Colors */
+    --taco-blue-100: #d7e2f6;
+    --taco-blue-200: #a6beec;
+    --taco-blue-300: #7c9ee0;
+    --taco-blue-500: #2f5dbd;
+    --taco-blue-700: #1e3e81;
+    --taco-blue-900: #1a2c51;
+    --taco-gray-100: #e1e1e1;
+    --taco-gray-200: #bebebe;
+    --taco-gray-300: #9e9e9e;
+    --taco-gray-500: #636363;
+    --taco-gray-700: #424242;
+    --taco-gray-900: #2e2e2e;
+
+    /* Secondary Colors */
+    --taco-red-100: #fed7d1;
+    --taco-red-200: #f2a89e;
+    --taco-red-300: #e8796c;
+    --taco-red-500: #a23e35;
+    --taco-red-700: #682e28;
+    --taco-red-900: #3c2825;
+    --taco-yellow-100: #f6e191;
+    --taco-yellow-200: #ddbc28;
+    --taco-yellow-300: #ba9c14;
+    --taco-yellow-500: #756208;
+    --taco-yellow-700: #4f4100;
+    --taco-yellow-900: #362d07;
+    --taco-green-100: #c5ecdd;
+    --taco-green-200: #90cdb7;
+    --taco-green-300: #79ab99;
+    --taco-green-500: #23735c;
+    --taco-green-700: #234b3e;
+    --taco-green-900: #17342a;
+
+    /* Tertiary Colors */
+    --taco-pink-100: #fdd5e0;
+    --taco-pink-200: #e3acbc;
+    --taco-pink-300: #d2849c;
+    --taco-pink-500: #9c3e60;
+    --taco-pink-700: #642e41;
+    --taco-pink-900: #42232d;
+    --taco-purple-100: #e2dcff;
+    --taco-purple-200: #c0b6e7;
+    --taco-purple-300: #a193d4;
+    --taco-purple-500: #6951a5;
+    --taco-purple-700: #473279;
+    --taco-purple-900: #30254f;
+
+    /* Brand Colors */
+    --taco-brand-morning: #fff5e5;
+    --taco-brand-noon: #f5f7f9;
+    --taco-brand-sunset: #e89c2e;
+    --taco-brand-midnight: #29283e;
+
+    /* Spacing */
+    --taco-spacing-12: 48px;
+    --taco-spacing-8: 32px;
+    --taco-spacing-6: 24px;
+    --taco-spacing-4: 16px;
+    --taco-spacing-3: 12px;
+    --taco-spacing-2: 8px;
+    --taco-spacing-1: 4px;
+    --taco-spacing-0: 0px;
+
+    /* Typography */
+    --taco-weight-bold: 700;
+    --taco-weight-regular: 400;
+    --taco-text-sm: 12px;
+    --taco-text-md: 14px;
+    --taco-text-lg: 16px;
+    --taco-heading-sm: 20px;
+    --taco-heading-md: 24px;
+    --taco-heading-lg: 28px;
+
+    /* Border Radius */
+    --taco-radius-full: 99999px;
+    --taco-radius-12: 12px;
+    --taco-radius-8: 8px;
+    --taco-radius-4: 4px;
+    --taco-radius-2: 2px;
+    --taco-radius-0: 0px;
+
+    /* Border Width */
+    --taco-border-width-2: 2px;
+    --taco-border-width-1: 1px;
+    --taco-border-width-0: 0px;
+}

package/tokens/tokens.ts

@@ -0,0 +1,122 @@
+/**
+ * Taco Design Tokens
+ * Auto-generated from tokens.json - do not edit manually
+ */
+
+/* Primary Colors */
+export const primaryColors = {
+    tacoBlue100: '#d7e2f6',
+    tacoBlue200: '#a6beec',
+    tacoBlue300: '#7c9ee0',
+    tacoBlue500: '#2f5dbd',
+    tacoBlue700: '#1e3e81',
+    tacoBlue900: '#1a2c51',
+    tacoGray100: '#e1e1e1',
+    tacoGray200: '#bebebe',
+    tacoGray300: '#9e9e9e',
+    tacoGray500: '#636363',
+    tacoGray700: '#424242',
+    tacoGray900: '#2e2e2e',
+} as const;
+
+/* Secondary Colors */
+export const secondaryColors = {
+    tacoRed100: '#fed7d1',
+    tacoRed200: '#f2a89e',
+    tacoRed300: '#e8796c',
+    tacoRed500: '#a23e35',
+    tacoRed700: '#682e28',
+    tacoRed900: '#3c2825',
+    tacoYellow100: '#f6e191',
+    tacoYellow200: '#ddbc28',
+    tacoYellow300: '#ba9c14',
+    tacoYellow500: '#756208',
+    tacoYellow700: '#4f4100',
+    tacoYellow900: '#362d07',
+    tacoGreen100: '#c5ecdd',
+    tacoGreen200: '#90cdb7',
+    tacoGreen300: '#79ab99',
+    tacoGreen500: '#23735c',
+    tacoGreen700: '#234b3e',
+    tacoGreen900: '#17342a',
+} as const;
+
+/* Tertiary Colors */
+export const tertiaryColors = {
+    tacoPink100: '#fdd5e0',
+    tacoPink200: '#e3acbc',
+    tacoPink300: '#d2849c',
+    tacoPink500: '#9c3e60',
+    tacoPink700: '#642e41',
+    tacoPink900: '#42232d',
+    tacoPurple100: '#e2dcff',
+    tacoPurple200: '#c0b6e7',
+    tacoPurple300: '#a193d4',
+    tacoPurple500: '#6951a5',
+    tacoPurple700: '#473279',
+    tacoPurple900: '#30254f',
+} as const;
+
+/* Brand Colors */
+export const brandColors = {
+    tacoBrandMorning: '#fff5e5',
+    tacoBrandNoon: '#f5f7f9',
+    tacoBrandSunset: '#e89c2e',
+    tacoBrandMidnight: '#29283e',
+} as const;
+
+/* Spacing */
+export const spacing = {
+    tacoSpacing12: '48px',
+    tacoSpacing8: '32px',
+    tacoSpacing6: '24px',
+    tacoSpacing4: '16px',
+    tacoSpacing3: '12px',
+    tacoSpacing2: '8px',
+    tacoSpacing1: '4px',
+    tacoSpacing0: '0px',
+} as const;
+
+/* Typography */
+export const typography = {
+    tacoWeightBold: '700',
+    tacoWeightRegular: '400',
+    tacoTextSm: '12px',
+    tacoTextMd: '14px',
+    tacoTextLg: '16px',
+    tacoHeadingSm: '20px',
+    tacoHeadingMd: '24px',
+    tacoHeadingLg: '28px',
+} as const;
+
+/* Border Radius */
+export const borderRadius = {
+    tacoRadiusFull: '99999px',
+    tacoRadius12: '12px',
+    tacoRadius8: '8px',
+    tacoRadius4: '4px',
+    tacoRadius2: '2px',
+    tacoRadius0: '0px',
+} as const;
+
+/* Border Width */
+export const borderWidth = {
+    tacoBorderWidth2: '2px',
+    tacoBorderWidth1: '1px',
+    tacoBorderWidth0: '0px',
+} as const;
+
+/* All tokens combined */
+export const tokens = {
+    primaryColors,
+    secondaryColors,
+    tertiaryColors,
+    brandColors,
+    spacing,
+    typography,
+    borderRadius,
+    borderWidth,
+} as const;
+
+/* Types */
+export type TokenCategory = keyof typeof tokens;

package/dist/taco-tokens.esm.js

@@ -1,123 +0,0 @@
-var $a8ae476446035e41$export$2e2bcd8739ae039 = {
-    colors: {
-        transparent: "transparent",
-        current: "currentColor",
-        white: "#fff",
-        black: "#1c1c1c",
-        brand: {
-            vismaRed: "#E70641",
-            paleOrange: "#FFF5E5",
-            sunsetOrange: "#E89C2E",
-            midnightBlue: "#29283E",
-            coolBlue: "#F5F7F9"
-        },
-        grey: {
-            lightest: "#fafafa",
-            light: "#F6F6F6",
-            DEFAULT: "#EBEBEB",
-            dark: "#DDDDDD",
-            darker: "#ACACAC",
-            darkest: "#595959",
-            darkNew: "#a5a6a9",
-            50: "#fafafa",
-            100: "#F6F6F6",
-            200: "#EBEBEB",
-            300: "#DDDDDD",
-            500: "#ACACAC",
-            700: "#595959",
-            900: "#303030"
-        },
-        purple: {
-            lightest: "#585c74",
-            light: "#4b4f64",
-            DEFAULT: "#3d4153",
-            dark: "#353a48",
-            darker: "#29283e",
-            darkest: "#212032",
-            darkNew_1: "#373647",
-            darkNew_2: "#414050",
-            100: "#EEE5FF",
-            200: "#ddd1ff",
-            300: "#CBBCFE",
-            500: "#9270FA",
-            700: "#6542D1",
-            900: "#412970"
-        },
-        blue: {
-            lightest: "#DEEBFF",
-            light: "#75A0F5",
-            DEFAULT: "#4573D2",
-            dark: "#2B57B4",
-            100: "#DEEBFF",
-            200: "#AACCFF",
-            300: "#75A0F5",
-            500: "#4573D2",
-            700: "#2B57B4",
-            900: "#29283E"
-        },
-        red: {
-            lightest: "#FFDAD2",
-            light: "#E66568",
-            DEFAULT: "#CE3F42",
-            dark: "#950027",
-            100: "#FFDAD2",
-            200: "#f3a09d",
-            300: "#E66568",
-            500: "#CE3F42",
-            700: "#950027",
-            900: "#64001B"
-        },
-        green: {
-            lightest: "#cdf0e7",
-            light: "#52C7AB",
-            DEFAULT: "#08AE87",
-            dark: "#028465",
-            100: "#cdf0e7",
-            200: "#9be1ce",
-            300: "#52C7AB",
-            500: "#08AE87",
-            700: "#028465",
-            900: "#14493A"
-        },
-        yellow: {
-            lightest: "#FFF1C3",
-            light: "#FFD665",
-            DEFAULT: "#FFBD3B",
-            dark: "#e89c2e",
-            100: "#FFF1C3",
-            200: "#ffe494",
-            300: "#FFD665",
-            500: "#FFBD3B",
-            700: "#e89c2e",
-            900: "#733700"
-        },
-        pink: {
-            100: "#FFE3F7",
-            200: "#fcb9e9",
-            300: "#F98EDB",
-            500: "#E165BF",
-            700: "#CF49AA",
-            900: "#870062"
-        },
-        brown: {
-            100: "#EEE0DA",
-            200: "#DFCCC2",
-            300: "#C4AB9E",
-            500: "#93715D",
-            700: "#73503B",
-            900: "#45291F"
-        },
-        orange: {
-            100: "#FFE3BB",
-            200: "#FCCB80",
-            300: "#FAB64D",
-            500: "#F99702",
-            700: "#EF7D00",
-            900: "#4A2811"
-        }
-    }
-};
-
-
-export {$a8ae476446035e41$export$2e2bcd8739ae039 as default};
-//# sourceMappingURL=taco-tokens.esm.js.map

package/dist/taco-tokens.esm.js.map

@@ -1 +0,0 @@
-{"mappings":"AAAA,IAAA,2CAAe;IACX,QAAQ;QACJ,aAAa;QACb,SAAS;QACT,OAAO;QACP,OAAO;QACP,OAAO;YACH,UAAU;YACV,YAAY;YACZ,cAAc;YACd,cAAc;YACd,UAAU;QACd;QACA,MAAM;YACF,UAAU;YACV,OAAO;YACP,SAAS;YACT,MAAM;YACN,QAAQ;YACR,SAAS;YACT,SAAS;YACT,IAAI;YACJ,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;QACT;QACA,QAAQ;YACJ,UAAU;YACV,OAAO;YACP,SAAS;YACT,MAAM;YACN,QAAQ;YACR,SAAS;YACT,WAAW;YACX,WAAW;YACX,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;QACT;QACA,MAAM;YACF,UAAU;YACV,OAAO;YACP,SAAS;YACT,MAAM;YACN,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;QACT;QACA,KAAK;YACD,UAAU;YACV,OAAO;YACP,SAAS;YACT,MAAM;YACN,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;QACT;QACA,OAAO;YACH,UAAU;YACV,OAAO;YACP,SAAS;YACT,MAAM;YACN,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;QACT;QACA,QAAQ;YACJ,UAAU;YACV,OAAO;YACP,SAAS;YACT,MAAM;YACN,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;QACT;QACA,MAAM;YACF,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;QACT;QACA,OAAO;YACH,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;QACT;QACA,QAAQ;YACJ,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;YACL,KAAK;QACT;IACJ;AACJ","sources":["packages/taco-tokens/src/index.ts"],"sourcesContent":["export default {\n    colors: {\n        transparent: 'transparent',\n        current: 'currentColor',\n        white: '#fff',\n        black: '#1c1c1c',\n        brand: {\n            vismaRed: '#E70641',\n            paleOrange: '#FFF5E5',\n            sunsetOrange: '#E89C2E',\n            midnightBlue: '#29283E',\n            coolBlue: '#F5F7F9',\n        },\n        grey: {\n            lightest: '#fafafa',\n            light: '#F6F6F6',\n            DEFAULT: '#EBEBEB',\n            dark: '#DDDDDD',\n            darker: '#ACACAC',\n            darkest: '#595959',\n            darkNew: '#a5a6a9',\n            50: '#fafafa',\n            100: '#F6F6F6',\n            200: '#EBEBEB',\n            300: '#DDDDDD',\n            500: '#ACACAC',\n            700: '#595959',\n            900: '#303030',\n        },\n        purple: {\n            lightest: '#585c74',\n            light: '#4b4f64',\n            DEFAULT: '#3d4153',\n            dark: '#353a48',\n            darker: '#29283e',\n            darkest: '#212032',\n            darkNew_1: '#373647',\n            darkNew_2: '#414050',\n            100: '#EEE5FF',\n            200: '#ddd1ff',\n            300: '#CBBCFE',\n            500: '#9270FA',\n            700: '#6542D1',\n            900: '#412970',\n        },\n        blue: {\n            lightest: '#DEEBFF',\n            light: '#75A0F5',\n            DEFAULT: '#4573D2',\n            dark: '#2B57B4',\n            100: '#DEEBFF',\n            200: '#AACCFF',\n            300: '#75A0F5',\n            500: '#4573D2',\n            700: '#2B57B4',\n            900: '#29283E',\n        },\n        red: {\n            lightest: '#FFDAD2',\n            light: '#E66568',\n            DEFAULT: '#CE3F42',\n            dark: '#950027',\n            100: '#FFDAD2',\n            200: '#f3a09d',\n            300: '#E66568',\n            500: '#CE3F42',\n            700: '#950027',\n            900: '#64001B',\n        },\n        green: {\n            lightest: '#cdf0e7',\n            light: '#52C7AB',\n            DEFAULT: '#08AE87',\n            dark: '#028465',\n            100: '#cdf0e7',\n            200: '#9be1ce',\n            300: '#52C7AB',\n            500: '#08AE87',\n            700: '#028465',\n            900: '#14493A',\n        },\n        yellow: {\n            lightest: '#FFF1C3',\n            light: '#FFD665',\n            DEFAULT: '#FFBD3B',\n            dark: '#e89c2e',\n            100: '#FFF1C3',\n            200: '#ffe494',\n            300: '#FFD665',\n            500: '#FFBD3B',\n            700: '#e89c2e',\n            900: '#733700',\n        },\n        pink: {\n            100: '#FFE3F7',\n            200: '#fcb9e9',\n            300: '#F98EDB',\n            500: '#E165BF',\n            700: '#CF49AA',\n            900: '#870062',\n        },\n        brown: {\n            100: '#EEE0DA',\n            200: '#DFCCC2',\n            300: '#C4AB9E',\n            500: '#93715D',\n            700: '#73503B',\n            900: '#45291F',\n        },\n        orange: {\n            100: '#FFE3BB',\n            200: '#FCCB80',\n            300: '#FAB64D',\n            500: '#F99702',\n            700: '#EF7D00',\n            900: '#4A2811',\n        },\n    },\n};\n"],"names":[],"version":3,"file":"taco-tokens.esm.js.map"}

package/dist/taco-tokens.js

@@ -1,2 +0,0 @@
-var e,F,r,a,E;e=module.exports,Object.defineProperty(e,"__esModule",{value:!0,configurable:!0}),F=module.exports,r="default",a=function(){return t},Object.defineProperty(F,r,{get:a,set:E,enumerable:!0,configurable:!0});var t={colors:{transparent:"transparent",current:"currentColor",white:"#fff",black:"#1c1c1c",brand:{vismaRed:"#E70641",paleOrange:"#FFF5E5",sunsetOrange:"#E89C2E",midnightBlue:"#29283E",coolBlue:"#F5F7F9"},grey:{lightest:"#fafafa",light:"#F6F6F6",DEFAULT:"#EBEBEB",dark:"#DDDDDD",darker:"#ACACAC",darkest:"#595959",darkNew:"#a5a6a9",50:"#fafafa",100:"#F6F6F6",200:"#EBEBEB",300:"#DDDDDD",500:"#ACACAC",700:"#595959",900:"#303030"},purple:{lightest:"#585c74",light:"#4b4f64",DEFAULT:"#3d4153",dark:"#353a48",darker:"#29283e",darkest:"#212032",darkNew_1:"#373647",darkNew_2:"#414050",100:"#EEE5FF",200:"#ddd1ff",300:"#CBBCFE",500:"#9270FA",700:"#6542D1",900:"#412970"},blue:{lightest:"#DEEBFF",light:"#75A0F5",DEFAULT:"#4573D2",dark:"#2B57B4",100:"#DEEBFF",200:"#AACCFF",300:"#75A0F5",500:"#4573D2",700:"#2B57B4",900:"#29283E"},red:{lightest:"#FFDAD2",light:"#E66568",DEFAULT:"#CE3F42",dark:"#950027",100:"#FFDAD2",200:"#f3a09d",300:"#E66568",500:"#CE3F42",700:"#950027",900:"#64001B"},green:{lightest:"#cdf0e7",light:"#52C7AB",DEFAULT:"#08AE87",dark:"#028465",100:"#cdf0e7",200:"#9be1ce",300:"#52C7AB",500:"#08AE87",700:"#028465",900:"#14493A"},yellow:{lightest:"#FFF1C3",light:"#FFD665",DEFAULT:"#FFBD3B",dark:"#e89c2e",100:"#FFF1C3",200:"#ffe494",300:"#FFD665",500:"#FFBD3B",700:"#e89c2e",900:"#733700"},pink:{100:"#FFE3F7",200:"#fcb9e9",300:"#F98EDB",500:"#E165BF",700:"#CF49AA",900:"#870062"},brown:{100:"#EEE0DA",200:"#DFCCC2",300:"#C4AB9E",500:"#93715D",700:"#73503B",900:"#45291F"},orange:{100:"#FFE3BB",200:"#FCCB80",300:"#FAB64D",500:"#F99702",700:"#EF7D00",900:"#4A2811"}}};
-//# sourceMappingURL=taco-tokens.js.map

package/dist/taco-tokens.js.map

@@ -1 +0,0 @@
-{"mappings":"2NAAA,IAAAA,EAAe,CACXC,OAAQ,CACJC,YAAa,cACbC,QAAS,eACTC,MAAO,OACPC,MAAO,UACPC,MAAO,CACHC,SAAU,UACVC,WAAY,UACZC,aAAc,UACdC,aAAc,UACdC,SAAU,WAEdC,KAAM,CACFC,SAAU,UACVC,MAAO,UACPC,QAAS,UACTC,KAAM,UACNC,OAAQ,UACRC,QAAS,UACTC,QAAS,UACT,GAAI,UACJ,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,WAETC,OAAQ,CACJP,SAAU,UACVC,MAAO,UACPC,QAAS,UACTC,KAAM,UACNC,OAAQ,UACRC,QAAS,UACTG,UAAW,UACXC,UAAW,UACX,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,WAETC,KAAM,CACFV,SAAU,UACVC,MAAO,UACPC,QAAS,UACTC,KAAM,UACN,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,WAETQ,IAAK,CACDX,SAAU,UACVC,MAAO,UACPC,QAAS,UACTC,KAAM,UACN,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,WAETS,MAAO,CACHZ,SAAU,UACVC,MAAO,UACPC,QAAS,UACTC,KAAM,UACN,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,WAETU,OAAQ,CACJb,SAAU,UACVC,MAAO,UACPC,QAAS,UACTC,KAAM,UACN,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,WAETW,KAAM,CACF,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,WAETC,MAAO,CACH,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,WAETC,OAAQ,CACJ,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK,UACL,IAAK","sources":["packages/taco-tokens/src/index.ts"],"sourcesContent":["export default {\n    colors: {\n        transparent: 'transparent',\n        current: 'currentColor',\n        white: '#fff',\n        black: '#1c1c1c',\n        brand: {\n            vismaRed: '#E70641',\n            paleOrange: '#FFF5E5',\n            sunsetOrange: '#E89C2E',\n            midnightBlue: '#29283E',\n            coolBlue: '#F5F7F9',\n        },\n        grey: {\n            lightest: '#fafafa',\n            light: '#F6F6F6',\n            DEFAULT: '#EBEBEB',\n            dark: '#DDDDDD',\n            darker: '#ACACAC',\n            darkest: '#595959',\n            darkNew: '#a5a6a9',\n            50: '#fafafa',\n            100: '#F6F6F6',\n            200: '#EBEBEB',\n            300: '#DDDDDD',\n            500: '#ACACAC',\n            700: '#595959',\n            900: '#303030',\n        },\n        purple: {\n            lightest: '#585c74',\n            light: '#4b4f64',\n            DEFAULT: '#3d4153',\n            dark: '#353a48',\n            darker: '#29283e',\n            darkest: '#212032',\n            darkNew_1: '#373647',\n            darkNew_2: '#414050',\n            100: '#EEE5FF',\n            200: '#ddd1ff',\n            300: '#CBBCFE',\n            500: '#9270FA',\n            700: '#6542D1',\n            900: '#412970',\n        },\n        blue: {\n            lightest: '#DEEBFF',\n            light: '#75A0F5',\n            DEFAULT: '#4573D2',\n            dark: '#2B57B4',\n            100: '#DEEBFF',\n            200: '#AACCFF',\n            300: '#75A0F5',\n            500: '#4573D2',\n            700: '#2B57B4',\n            900: '#29283E',\n        },\n        red: {\n            lightest: '#FFDAD2',\n            light: '#E66568',\n            DEFAULT: '#CE3F42',\n            dark: '#950027',\n            100: '#FFDAD2',\n            200: '#f3a09d',\n            300: '#E66568',\n            500: '#CE3F42',\n            700: '#950027',\n            900: '#64001B',\n        },\n        green: {\n            lightest: '#cdf0e7',\n            light: '#52C7AB',\n            DEFAULT: '#08AE87',\n            dark: '#028465',\n            100: '#cdf0e7',\n            200: '#9be1ce',\n            300: '#52C7AB',\n            500: '#08AE87',\n            700: '#028465',\n            900: '#14493A',\n        },\n        yellow: {\n            lightest: '#FFF1C3',\n            light: '#FFD665',\n            DEFAULT: '#FFBD3B',\n            dark: '#e89c2e',\n            100: '#FFF1C3',\n            200: '#ffe494',\n            300: '#FFD665',\n            500: '#FFBD3B',\n            700: '#e89c2e',\n            900: '#733700',\n        },\n        pink: {\n            100: '#FFE3F7',\n            200: '#fcb9e9',\n            300: '#F98EDB',\n            500: '#E165BF',\n            700: '#CF49AA',\n            900: '#870062',\n        },\n        brown: {\n            100: '#EEE0DA',\n            200: '#DFCCC2',\n            300: '#C4AB9E',\n            500: '#93715D',\n            700: '#73503B',\n            900: '#45291F',\n        },\n        orange: {\n            100: '#FFE3BB',\n            200: '#FCCB80',\n            300: '#FAB64D',\n            500: '#F99702',\n            700: '#EF7D00',\n            900: '#4A2811',\n        },\n    },\n};\n"],"names":["$5f5890da2b1031bb$export$2e2bcd8739ae039","colors","transparent","current","white","black","brand","vismaRed","paleOrange","sunsetOrange","midnightBlue","coolBlue","grey","lightest","light","DEFAULT","dark","darker","darkest","darkNew","purple","darkNew_1","darkNew_2","blue","red","green","yellow","pink","brown","orange"],"version":3,"file":"taco-tokens.js.map"}