Add support for Radix UI spacing variables (#109)

spear-ai · Feb 12, 2024 · b86ff35 · b86ff35
1 parent c028b47
commit b86ff35
Show file tree

Hide file tree

Showing 2 changed files with 45 additions and 0 deletions.
diff --git a/.changeset/sharp-cows-pump.md b/.changeset/sharp-cows-pump.md
@@ -0,0 +1,5 @@
+---
+"@spear-ai/tailwind-config": minor
+---
+
+Added support for Radix UI spacing variables.
diff --git a/packages/tailwind-config/src/index.ts b/packages/tailwind-config/src/index.ts
@@ -54,6 +54,46 @@ export const tailwindConfig: Config = {
       scale: {
         "-1": "-1",
       },
+      spacing: {
+        "accordion-content-height": "var(--radix-accordion-content-height)",
+        "accordion-content-width": "var(--radix-accordion-content-width)",
+        "collapsible-content-height": "var(--radix-collapsible-content-height)",
+        "collapsible-content-width": "var(--radix-collapsible-content-width)",
+        "context-menu-content-available-height": "var(--radix-context-menu-content-available-height)",
+        "context-menu-content-available-width": "var(--radix-context-menu-content-available-width)",
+        "context-menu-trigger-height": "var(--radix-context-menu-trigger-height)",
+        "context-menu-trigger-width": "var(--radix-context-menu-trigger-width)",
+        "dropdown-menu-content-available-height": "var(--radix-dropdown-menu-content-available-height)",
+        "dropdown-menu-content-available-width": "var(--radix-dropdown-menu-content-available-width)",
+        "dropdown-menu-trigger-height": "var(--radix-dropdown-menu-trigger-width)",
+        "dropdown-menu-trigger-width": "var(--radix-dropdown-menu-trigger-width)",
+        "hover-card-content-available-height": "var(--radix-hover-card-content-available-height)",
+        "hover-card-content-available-width": "var(--radix-hover-card-content-available-width)",
+        "hover-card-trigger-height": "var(--radix-hover-card-trigger-width)",
+        "hover-card-trigger-width": "var(--radix-hover-card-trigger-width)",
+        "menubar-content-available-height": "var(--radix-menubar-content-available-height)",
+        "menubar-content-available-width": "var(--radix-menubar-content-available-width)",
+        "menubar-trigger-height": "var(--radix-menubar-trigger-width)",
+        "menubar-trigger-width": "var(--radix-menubar-trigger-width)",
+        "navigation-menu-viewport-height": "var(--radix-navigation-menu-viewport-height)",
+        "navigation-menu-viewport-width": "var(--radix-navigation-menu-viewport-width)",
+        "popover-content-available-height": "var(--radix-popover-content-available-height)",
+        "popover-content-available-width": "var(--radix-popover-content-available-width)",
+        "popover-trigger-height": "var(--radix-popover-trigger-height)",
+        "popover-trigger-width": "var(--radix-popover-trigger-width)",
+        "select-content-available-height": "var(--radix-select-content-available-height)",
+        "select-content-available-width": "var(--radix-select-content-available-width)",
+        "select-trigger-height": "var(--radix-select-trigger-height)",
+        "select-trigger-width": "var(--radix-select-trigger-width)",
+        "toast-swipe-end-x": "var(--radix-toast-swipe-end-x)",
+        "toast-swipe-end-y": "var(--radix-toast-swipe-end-y)",
+        "toast-swipe-move-x": "var(--radix-toast-swipe-move-x)",
+        "toast-swipe-move-y": "var(--radix-toast-swipe-move-y)",
+        "tooltip-content-available-height": "var(--radix-tooltip-content-available-height)",
+        "tooltip-content-available-width": "var(--radix-tooltip-content-available-width)",
+        "tooltip-trigger-height": "var(--radix-tooltip-trigger-height)",
+        "tooltip-trigger-width": "var(--radix-tooltip-trigger-width)",
+      },
       typography: ({ theme }: { theme: (path: string) => string }) => ({
         theme: {
           css: {