design system token v0.1

2026-04-13 15:33:00 -05:00
parent 52b4156653
commit c3215945f2
63 changed files with 11562 additions and 181 deletions
--- a/tokens/motion.json
+++ b/tokens/motion.json
@@ -0,0 +1,72 @@
+{
+  "motion": {
+    "$description": "Greyhaven Design System — Animation & Motion Tokens",
+    "duration": {
+      "fast": {
+        "$type": "duration",
+        "$value": "150ms",
+        "$description": "Quick transitions — tooltips, hover states"
+      },
+      "normal": {
+        "$type": "duration",
+        "$value": "200ms",
+        "$description": "Default transitions — most UI interactions"
+      },
+      "slow": {
+        "$type": "duration",
+        "$value": "300ms",
+        "$description": "Deliberate transitions — modals, drawers, accordions"
+      }
+    },
+    "easing": {
+      "default": {
+        "$type": "cubicBezier",
+        "$value": [0.4, 0, 0.2, 1],
+        "$description": "Standard ease-in-out"
+      },
+      "in": {
+        "$type": "cubicBezier",
+        "$value": [0.4, 0, 1, 1],
+        "$description": "Ease-in for exits"
+      },
+      "out": {
+        "$type": "cubicBezier",
+        "$value": [0, 0, 0.2, 1],
+        "$description": "Ease-out for entrances"
+      }
+    },
+    "keyframes": {
+      "$description": "Named animation patterns used by components",
+      "accordion-down": {
+        "$description": "Accordion open — height 0 to auto"
+      },
+      "accordion-up": {
+        "$description": "Accordion close — height auto to 0"
+      },
+      "spin": {
+        "$description": "Spinner rotation — 360deg continuous"
+      },
+      "pulse": {
+        "$description": "Skeleton loading — opacity fade in/out"
+      },
+      "fade-in": {
+        "$description": "Generic entrance — opacity 0 to 1"
+      },
+      "fade-out": {
+        "$description": "Generic exit — opacity 1 to 0"
+      },
+      "slide-in-from-top": {
+        "$description": "Dropdown entrance — translate-y negative to 0"
+      },
+      "slide-in-from-bottom": {
+        "$description": "Drawer entrance — translate-y positive to 0"
+      },
+      "zoom-in": {
+        "$description": "Dialog entrance — scale 0.95 to 1 + fade"
+      },
+      "zoom-out": {
+        "$description": "Dialog exit — scale 1 to 0.95 + fade"
+      }
+    }
+  }
+}