tailwindcss 4.0.0-alpha.2 → 4.0.0-alpha.20

package/package.json

@@ -1,9 +1,13 @@
 {
   "name": "tailwindcss",
-  "version": "4.0.0-alpha.2",
+  "version": "4.0.0-alpha.20",
   "description": "A utility-first CSS framework for rapidly building custom user interfaces.",
   "license": "MIT",
-  "repository": "https://github.com/tailwindlabs/tailwindcss.git",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/tailwindlabs/tailwindcss.git",
+    "directory": "packages/tailwindcss"
+  },
   "bugs": "https://github.com/tailwindlabs/tailwindcss/issues",
   "homepage": "https://tailwindcss.com",
   "exports": {
@@ -13,11 +17,31 @@
       "require": "./dist/lib.js",
       "import": "./dist/lib.mjs"
     },
+    "./plugin": {
+      "require": "./dist/plugin.js",
+      "import": "./dist/plugin.mjs"
+    },
+    "./defaultTheme": {
+      "require": "./dist/default-theme.js",
+      "import": "./dist/default-theme.mjs"
+    },
+    "./colors": {
+      "require": "./dist/colors.js",
+      "import": "./dist/colors.mjs"
+    },
     "./package.json": "./package.json",
     "./index.css": "./index.css",
+    "./index": "./index.css",
     "./preflight.css": "./preflight.css",
+    "./preflight": "./preflight.css",
     "./theme.css": "./theme.css",
-    "./utilities.css": "./utilities.css"
+    "./theme": "./theme.css",
+    "./utilities.css": "./utilities.css",
+    "./utilities": "./utilities.css"
+  },
+  "publishConfig": {
+    "provenance": true,
+    "access": "public"
   },
   "style": "index.css",
   "files": [
@@ -27,12 +51,10 @@
     "theme.css",
     "utilities.css"
   ],
-  "dependencies": {
-    "lightningcss": "^1.24.0"
-  },
   "devDependencies": {
-    "@types/node": "^20.10.8",
-    "@tailwindcss/oxide": "4.0.0-alpha.2"
+    "@types/node": "^20.14.8",
+    "lightningcss": "^1.26.0",
+    "@tailwindcss/oxide": "4.0.0-alpha.20"
   },
   "scripts": {
     "lint": "tsc --noEmit",

package/preflight.css

@@ -1,5 +1,7 @@
 /*
-  Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
+  1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
+  2. Remove default margins and padding
+  3. Reset all borders.
 */
 
 *,
@@ -7,15 +9,10 @@
 ::before,
 ::backdrop,
 ::file-selector-button {
-  box-sizing: border-box;
-}
-
-/*
-  Remove any default margins.
-*/
-
-* {
-  margin: 0;
+  box-sizing: border-box; /* 1 */
+  margin: 0; /* 2 */
+  padding: 0; /* 2 */
+  border: 0 solid; /* 3 */
 }
 
 /*
@@ -65,7 +62,6 @@ body {
 hr {
   height: 0; /* 1 */
   color: inherit; /* 2 */
-  border: 0 solid; /* 3 */
   border-top-width: 1px; /* 3 */
 }
 
@@ -180,9 +176,7 @@ table {
 
 /*
   1. Inherit the font styles in all browsers.
-  2. Reset the default inset border style to solid.
-  3. Remove the default background color.
-  4. Remove default padding.
+  2. Remove the default background color.
 */
 
 button,
@@ -194,21 +188,28 @@ textarea,
   font: inherit; /* 1 */
   font-feature-settings: inherit; /* 1 */
   font-variation-settings: inherit; /* 1 */
+  letter-spacing: inherit; /* 1 */
   color: inherit; /* 1 */
-  border: 1px solid; /* 2 */
-  background: transparent; /* 3 */
-  padding: 0; /* 4 */
+  background: transparent; /* 2 */
+}
+
+/*
+  Reset the default inset border style for form controls to solid.
+*/
+
+input:where(:not([type='button'], [type='reset'], [type='submit'])),
+select,
+textarea {
+  border: 1px solid;
 }
 
 /*
-  1. Correct the inability to style the border radius in iOS Safari.
-  2. Make borders opt-in.
+  Correct the inability to style the border radius in iOS Safari.
 */
 button,
 input:where([type='button'], [type='reset'], [type='submit']),
 ::file-selector-button {
-  appearance: button; /* 1 */
-  border: 0; /* 2 */
+  appearance: button;
 }
 
 /*
@@ -260,19 +261,6 @@ summary {
   display: list-item;
 }
 
-/*
-  Remove the default border and spacing for fieldset and legend elements.
-*/
-
-fieldset {
-  border: 0;
-  padding: 0;
-}
-
-legend {
-  padding: 0;
-}
-
 /*
   Make lists unstyled by default.
 */
@@ -281,15 +269,6 @@ ol,
 ul,
 menu {
   list-style: none;
-  padding: 0;
-}
-
-/*
-  Remove the default padding from dialog elements.
-*/
-
-dialog {
-  padding: 0;
 }
 
 /*
@@ -310,14 +289,6 @@ textarea {
   color: color-mix(in srgb, currentColor 50%, transparent); /* 2 */
 }
 
-/*
-  Make sure disabled buttons don't get the pointer cursor.
-*/
-
-:disabled {
-  cursor: default;
-}
-
 /*
   1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
   2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)

package/theme.css

@@ -1,7 +1,7 @@
 @theme {
   /* Defaults */
   --default-transition-duration: 150ms;
-  --default-transition-timing-function: var(--transition-timing-function-in-out);
+  --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   --default-font-family: var(--font-family-sans);
   --default-font-feature-settings: var(--font-family-sans--font-feature-settings);
   --default-font-variation-settings: var(--font-family-sans--font-variation-settings);
@@ -10,11 +10,11 @@
   --default-mono-font-variation-settings: var(--font-family-mono--font-variation-settings);
 
   /* Breakpoints */
-  --breakpoint-sm: 640px;
-  --breakpoint-md: 768px;
-  --breakpoint-lg: 1024px;
-  --breakpoint-xl: 1280px;
-  --breakpoint-2xl: 1536px;
+  --breakpoint-sm: 40rem;
+  --breakpoint-md: 48rem;
+  --breakpoint-lg: 64rem;
+  --breakpoint-xl: 80rem;
+  --breakpoint-2xl: 96rem;
 
   /* Colors */
   --color-black: #000;
@@ -278,15 +278,14 @@
   --blur-3xl: 64px;
 
   /* Radii */
-  --radius-none: 0px;
-  --radius-full: 9999px;
-  --radius-sm: 0.125rem;
   --radius: 0.25rem;
+  --radius-sm: 0.125rem;
   --radius-md: 0.375rem;
   --radius-lg: 0.5rem;
   --radius-xl: 0.75rem;
   --radius-2xl: 1rem;
   --radius-3xl: 1.5rem;
+  --radius-4xl: 2rem;
 
   /* Shadows */
   --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
@@ -310,6 +309,7 @@
   --drop-shadow-lg: 0 10px 8px rgb(0 0 0 / 0.04), 0 4px 3px rgb(0 0 0 / 0.1);
   --drop-shadow-xl: 0 20px 13px rgb(0 0 0 / 0.03), 0 8px 5px rgb(0 0 0 / 0.08);
   --drop-shadow-2xl: 0 25px 25px rgb(0 0 0 / 0.15);
+  --drop-shadow-none: 0 0 #0000;
 
   /* Spacing */
   --spacing-px: 1px;
@@ -423,8 +423,14 @@
   --line-height-9: 2.25rem;
   --line-height-10: 2.5rem;
 
+  /* 3D perspectives */
+  --perspective-dramatic: 100px;
+  --perspective-near: 300px;
+  --perspective-normal: 500px;
+  --perspective-midrange: 800px;
+  --perspective-distant: 1200px;
+
   /* Transition timing functions */
-  --transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   --transition-timing-function-linear: linear;
   --transition-timing-function-in: cubic-bezier(0.4, 0, 1, 1);
   --transition-timing-function-out: cubic-bezier(0, 0, 0.2, 1);