Re-enable new features

This reverts commits 1456ed9021, d0269c24b3, and 57699a0403.
This commit is contained in:
Jordan Pittman 2022-04-12 14:12:01 -04:00
parent 23a6d3ff84
commit 7ed46b6f52
24 changed files with 134 additions and 80 deletions

View file

@ -26,6 +26,7 @@ Nothing yet!
- Fix generation of `div:not(.foo)` if `.foo` is never defined ([#7815](https://github.com/tailwindlabs/tailwindcss/pull/7815))
- Allow for custom properties in `rgb`, `rgba`, `hsl` and `hsla` colors ([#7933](https://github.com/tailwindlabs/tailwindcss/pull/7933))
- Remove autoprefixer as explicit peer-dependency to avoid invalid warnings in situations where it isn't actually needed ([#7949](https://github.com/tailwindlabs/tailwindcss/pull/7949))
- Types: allow for arbitrary theme values (for 3rd party plugins) ([#7926](https://github.com/tailwindlabs/tailwindcss/pull/7926))
- Ensure the `percentage` data type is validated correctly ([#8015](https://github.com/tailwindlabs/tailwindcss/pull/8015))
### Changed
@ -34,6 +35,19 @@ Nothing yet!
- Replace `cosmiconfig` with `lilconfig` ([#6039](https://github.com/tailwindlabs/tailwindcss/pull/6038))
- Update `cssnano` to avoid removing empty variables when minifying ([#7818](https://github.com/tailwindlabs/tailwindcss/pull/7818))
### Added
- Allow default ring color to be a function ([#7587](https://github.com/tailwindlabs/tailwindcss/pull/7587))
- Add `rgb` and `hsl` color helpers for CSS variables ([#7665](https://github.com/tailwindlabs/tailwindcss/pull/7665))
- Support PostCSS `Document` nodes ([#7291](https://github.com/tailwindlabs/tailwindcss/pull/7291))
- Add `text-start` and `text-end` utilities ([#6656](https://github.com/tailwindlabs/tailwindcss/pull/6656))
- Support customizing class name when using `darkMode: 'class'` ([#5800](https://github.com/tailwindlabs/tailwindcss/pull/5800))
- Add `--poll` option to the CLI ([#7725](https://github.com/tailwindlabs/tailwindcss/pull/7725))
- Add new `border-spacing` utilities ([#7102](https://github.com/tailwindlabs/tailwindcss/pull/7102))
- Add `enabled` variant ([#7905](https://github.com/tailwindlabs/tailwindcss/pull/7905))
- Add TypeScript types for the `tailwind.config.js` file ([#7891](https://github.com/tailwindlabs/tailwindcss/pull/7891))
- Add `backdrop` variant ([#7924](https://github.com/tailwindlabs/tailwindcss/pull/7924))
## [3.0.23] - 2022-02-16
### Fixed

View file

@ -291,6 +291,7 @@ describe('Build command', () => {
-i, --input Input file
-o, --output Output file
-w, --watch Watch for changes and rebuild as needed
-p, --poll Use polling instead of filesystem events when watching
--content Content paths to use for removing unused classes
--postcss Load custom PostCSS configuration
-m, --minify Minify the output

View file

@ -4,6 +4,7 @@
"description": "A utility-first CSS framework for rapidly building custom user interfaces.",
"license": "MIT",
"main": "lib/index.js",
"types": "types/index.d.ts",
"repository": "https://github.com/tailwindlabs/tailwindcss.git",
"bugs": "https://github.com/tailwindlabs/tailwindcss/issues",
"homepage": "https://tailwindcss.com",
@ -25,7 +26,7 @@
"posttest": "npm run style",
"generate:plugin-list": "node -r @swc/register scripts/create-plugin-list.js",
"generate:types": "node -r @swc/register scripts/generate-types.js",
"generate": "npm run generate:plugin-list"
"generate": "npm run generate:plugin-list && npm run generate:types"
},
"files": [
"src/*",
@ -35,6 +36,8 @@
"scripts/*.js",
"stubs/*.stub.js",
"nesting/*",
"types/**/*",
"*.d.ts",
"*.css",
"*.js"
],

View file

@ -165,12 +165,10 @@ let commands = {
'--input': { type: String, description: 'Input file' },
'--output': { type: String, description: 'Output file' },
'--watch': { type: Boolean, description: 'Watch for changes and rebuild as needed' },
/*
'--poll': {
type: Boolean,
description: 'Use polling instead of filesystem events when watching',
},
*/
'--content': {
type: String,
description: 'Content paths to use for removing unused classes',
@ -197,9 +195,7 @@ let commands = {
'-o': '--output',
'-m': '--minify',
'-w': '--watch',
/*
'-p': '--poll',
*/
},
},
}
@ -387,10 +383,7 @@ async function build() {
let input = args['--input']
let output = args['--output']
let shouldWatch = args['--watch']
let shouldPoll = false
/*
let shouldPoll = args['--poll']
*/
let shouldCoalesceWriteEvents = shouldPoll || process.platform === 'win32'
let includePostCss = args['--postcss']

View file

@ -27,9 +27,7 @@ export let variantPlugins = {
addVariant('placeholder', '&::placeholder')
/*
addVariant('backdrop', '&::backdrop')
*/
addVariant('before', ({ container }) => {
container.walkRules((rule) => {
@ -122,9 +120,7 @@ export let variantPlugins = {
'focus',
'focus-visible',
'active',
/*
'enabled',
*/
'disabled',
].map((variant) => (Array.isArray(variant) ? variant : [variant, `:${variant}`]))
@ -179,7 +175,7 @@ export let variantPlugins = {
},
darkVariants: ({ config, addVariant }) => {
let [mode] = [].concat(config('darkMode', 'media'))
let [mode, className = '.dark'] = [].concat(config('darkMode', 'media'))
if (mode === false) {
mode = 'media'
@ -191,10 +187,7 @@ export let variantPlugins = {
}
if (mode === 'class') {
addVariant('dark', `.dark &`)
/*
addVariant('dark', `${className} &`)
*/
} else if (mode === 'media') {
addVariant('dark', '@media (prefers-color-scheme: dark)')
}
@ -539,7 +532,6 @@ export let corePlugins = {
})
},
/*
borderSpacing: ({ addDefaults, matchUtilities, theme }) => {
addDefaults('border-spacing', {
'--tw-border-spacing-x': 0,
@ -574,7 +566,6 @@ export let corePlugins = {
{ values: theme('borderSpacing') }
)
},
*/
transformOrigin: createUtilityPlugin('transformOrigin', [['origin', ['transformOrigin']]]),
translate: createUtilityPlugin(
@ -1571,10 +1562,8 @@ export let corePlugins = {
'.text-center': { 'text-align': 'center' },
'.text-right': { 'text-align': 'right' },
'.text-justify': { 'text-align': 'justify' },
/*
'.text-start': { 'text-align': 'start' },
'.text-end': { 'text-align': 'end' },
*/
})
},
@ -1978,10 +1967,7 @@ export let corePlugins = {
ringWidth: ({ matchUtilities, addDefaults, addUtilities, theme }) => {
let ringOpacityDefault = theme('ringOpacity.DEFAULT', '0.5')
let ringColorDefault = withAlphaValue(
/*
theme('ringColor')?.DEFAULT,
*/
theme('ringColor.DEFAULT'),
ringOpacityDefault,
`rgb(147 197 253 / ${ringOpacityDefault})`
)

View file

@ -15,7 +15,6 @@ module.exports = function tailwindcss(configOrPath) {
function (root, result) {
let context = setupTrackingContext(configOrPath)
/*
if (root.type === 'document') {
let roots = root.nodes.filter((node) => node.type === 'root')
@ -27,7 +26,6 @@ module.exports = function tailwindcss(configOrPath) {
return
}
*/
processTailwindFeatures(context)(root, result)
},

View file

@ -66,7 +66,6 @@ const configUtils = {
{}
)
},
/*
rgb(property) {
if (!property.startsWith('--')) {
throw new Error(
@ -97,7 +96,6 @@ const configUtils = {
return `hsl(var(${property}) / ${opacityValue})`
}
},
*/
}
function value(valueToResolve, ...args) {

View file

@ -194,11 +194,9 @@ module.exports = {
'3xl': '1.5rem',
full: '9999px',
},
/*
borderSpacing: ({ theme }) => ({
...theme('spacing'),
}),
*/
borderWidth: {
DEFAULT: '1px',
0: '0px',

View file

@ -268,48 +268,50 @@ Array [
"2:4-18 -> 368:2-15",
"2:18 -> 369:0",
"2:4 -> 371:0",
"2:4-18 -> 372:2-21",
"2:4-18 -> 373:2-21",
"2:4-18 -> 374:2-16",
"2:4-18 -> 375:2-16",
"2:4-18 -> 372:2-26",
"2:4-18 -> 373:2-26",
"2:4-18 -> 374:2-21",
"2:4-18 -> 375:2-21",
"2:4-18 -> 376:2-16",
"2:4-18 -> 377:2-17",
"2:4-18 -> 378:2-17",
"2:4-18 -> 379:2-15",
"2:4-18 -> 380:2-15",
"2:4-18 -> 381:2-20",
"2:4-18 -> 382:2-40",
"2:4-18 -> 383:2-17",
"2:4-18 -> 384:2-22",
"2:4-18 -> 385:2-24",
"2:4-18 -> 386:2-25",
"2:4-18 -> 387:2-26",
"2:4-18 -> 388:2-20",
"2:4-18 -> 389:2-29",
"2:4-18 -> 390:2-30",
"2:4-18 -> 391:2-40",
"2:4-18 -> 392:2-36",
"2:4-18 -> 393:2-29",
"2:4-18 -> 394:2-24",
"2:4-18 -> 395:2-32",
"2:4-18 -> 396:2-14",
"2:4-18 -> 397:2-20",
"2:4-18 -> 398:2-18",
"2:4-18 -> 399:2-19",
"2:4-18 -> 400:2-20",
"2:4-18 -> 401:2-16",
"2:4-18 -> 402:2-18",
"2:4-18 -> 403:2-15",
"2:4-18 -> 404:2-21",
"2:4-18 -> 405:2-23",
"2:4-18 -> 406:2-29",
"2:4-18 -> 407:2-27",
"2:4-18 -> 408:2-28",
"2:4-18 -> 409:2-29",
"2:4-18 -> 410:2-25",
"2:4-18 -> 411:2-26",
"2:4-18 -> 412:2-27",
"2:4 -> 413:2",
"2:18 -> 414:0",
"2:4-18 -> 377:2-16",
"2:4-18 -> 378:2-16",
"2:4-18 -> 379:2-17",
"2:4-18 -> 380:2-17",
"2:4-18 -> 381:2-15",
"2:4-18 -> 382:2-15",
"2:4-18 -> 383:2-20",
"2:4-18 -> 384:2-40",
"2:4-18 -> 385:2-17",
"2:4-18 -> 386:2-22",
"2:4-18 -> 387:2-24",
"2:4-18 -> 388:2-25",
"2:4-18 -> 389:2-26",
"2:4-18 -> 390:2-20",
"2:4-18 -> 391:2-29",
"2:4-18 -> 392:2-30",
"2:4-18 -> 393:2-40",
"2:4-18 -> 394:2-36",
"2:4-18 -> 395:2-29",
"2:4-18 -> 396:2-24",
"2:4-18 -> 397:2-32",
"2:4-18 -> 398:2-14",
"2:4-18 -> 399:2-20",
"2:4-18 -> 400:2-18",
"2:4-18 -> 401:2-19",
"2:4-18 -> 402:2-20",
"2:4-18 -> 403:2-16",
"2:4-18 -> 404:2-18",
"2:4-18 -> 405:2-15",
"2:4-18 -> 406:2-21",
"2:4-18 -> 407:2-23",
"2:4-18 -> 408:2-29",
"2:4-18 -> 409:2-27",
"2:4-18 -> 410:2-28",
"2:4-18 -> 411:2-29",
"2:4-18 -> 412:2-25",
"2:4-18 -> 413:2-26",
"2:4-18 -> 414:2-27",
"2:4 -> 415:2",
"2:18 -> 416:0",
]
`;

View file

@ -1,6 +1,8 @@
*,
::before,
::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;
@ -252,6 +254,19 @@
.border-collapse {
border-collapse: collapse;
}
.border-spacing-4 {
--tw-border-spacing-x: 1rem;
--tw-border-spacing-y: 1rem;
border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y);
}
.border-spacing-x-6 {
--tw-border-spacing-x: 1.5rem;
border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y);
}
.border-spacing-y-8 {
--tw-border-spacing-y: 2rem;
border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y);
}
.origin-top-right {
transform-origin: top right;
}

View file

@ -152,6 +152,8 @@ test('default ring color can be a function', () => {
*,
::before,
::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;
@ -171,7 +173,7 @@ test('default ring color can be a function', () => {
--tw-ring-inset: ;
--tw-ring-offset-width: 0px;
--tw-ring-offset-color: #fff;
--tw-ring-color: rgb(147 197 253 / 0.5);
--tw-ring-color: rgba(var(--red), 0.5);
--tw-ring-offset-shadow: 0 0 #0000;
--tw-ring-shadow: 0 0 #0000;
--tw-shadow: 0 0 #0000;

View file

@ -10,6 +10,8 @@
*,
::before,
::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;

View file

@ -23,7 +23,6 @@ it('should be possible to use the darkMode "class" mode', () => {
})
})
/*
it('should be possible to change the class name', () => {
let config = {
darkMode: ['class', '.test-dark'],
@ -46,7 +45,6 @@ it('should be possible to change the class name', () => {
`)
})
})
*/
it('should be possible to use the darkMode "media" mode', () => {
let config = {

View file

@ -4,6 +4,8 @@ h1 {
*,
::before,
::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;

View file

@ -1,6 +1,8 @@
*,
::before,
::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;

View file

@ -1,6 +1,8 @@
*,
::before,
::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;

View file

@ -1,6 +1,8 @@
*,
::before,
::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;

View file

@ -139,6 +139,8 @@ div {
*,
::before,
::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;

View file

@ -96,7 +96,6 @@ test('colors defined as functions work when opacity plugins are disabled', () =>
})
})
/*
it('can use rgb helper when defining custom properties for colors (opacity plugins enabled)', () => {
let config = {
content: [
@ -428,4 +427,3 @@ it('the hsl helper throws when not passing custom properties', () => {
'The hsl() helper requires a custom property name to be passed as the first argument.'
)
})
*/

View file

@ -11,6 +11,8 @@ it('should add the divide styles for divide-y and a default border color', () =>
*,
::before,
::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;
@ -75,6 +77,8 @@ it('should add the divide styles for divide-x and a default border color', () =>
*,
::before,
::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;
@ -139,6 +143,8 @@ it('should add the divide styles for divide-y-reverse and a default border color
*,
::before,
::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;
@ -201,6 +207,8 @@ it('should add the divide styles for divide-x-reverse and a default border color
*,
::before,
::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;
@ -263,6 +271,8 @@ it('should only inject the base styles once if we use divide and border at the s
*,
::before,
::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;

View file

@ -1,6 +1,8 @@
*,
::before,
::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;

View file

@ -10,6 +10,8 @@ export function defaults({ defaultRingColor = `rgb(59 130 246 / 0.5)` } = {}) {
*,
::before,
::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;

View file

@ -1,6 +1,8 @@
*,
::before,
::after {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;
@ -106,6 +108,12 @@
--tw-text-opacity: 1;
color: rgb(239 68 68 / var(--tw-text-opacity));
}
.backdrop\:shadow-md::backdrop {
--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
var(--tw-shadow);
}
.before\:block::before {
content: var(--tw-content);
display: block;
@ -311,6 +319,12 @@
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
var(--tw-shadow);
}
.enabled\:shadow-md:enabled {
--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
var(--tw-shadow);
}
.disabled\:shadow-md:disabled {
--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
@ -498,6 +512,12 @@
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
var(--tw-shadow);
}
.group:enabled .group-enabled\:shadow-md {
--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
var(--tw-shadow);
}
.group:disabled .group-disabled\:shadow-md {
--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
@ -685,6 +705,12 @@
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
var(--tw-shadow);
}
.peer:enabled ~ .peer-enabled\:shadow-md {
--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
var(--tw-shadow);
}
.peer:disabled ~ .peer-disabled\:shadow-md {
--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);

View file

@ -1,8 +1,6 @@
import fs from 'fs'
import path from 'path'
/*
import postcss from 'postcss'
*/
import { run, css, html, defaults } from './util/run'
@ -572,7 +570,6 @@ test('The visited variant removes opacity support', () => {
})
})
/*
it('appends variants to the correct place when using postcss documents', () => {
let config = {
content: [{ raw: html`<div class="underline sm:underline"></div>` }],
@ -606,4 +603,3 @@ it('appends variants to the correct place when using postcss documents', () => {
`)
})
})
*/