tailwindcss
Version:
A utility-first CSS framework for rapidly building custom user interfaces.
1,721 lines • 110 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.corePlugins = exports.variantPlugins = void 0;
var _fs = _interopRequireDefault(require("fs"));
var path = _interopRequireWildcard(require("path"));
var _postcss = _interopRequireDefault(require("postcss"));
var _createUtilityPlugin = _interopRequireDefault(require("./util/createUtilityPlugin"));
var _buildMediaQuery = _interopRequireDefault(require("./util/buildMediaQuery"));
var _parseAnimationValue = _interopRequireDefault(require("./util/parseAnimationValue"));
var _flattenColorPalette = _interopRequireDefault(require("./util/flattenColorPalette"));
var _withAlphaVariable = _interopRequireWildcard(require("./util/withAlphaVariable"));
var _toColorValue = _interopRequireDefault(require("./util/toColorValue"));
var _isPlainObject = _interopRequireDefault(require("./util/isPlainObject"));
var _transformThemeValue = _interopRequireDefault(require("./util/transformThemeValue"));
var _packageJson = require("../package.json");
var _log = _interopRequireDefault(require("./util/log"));
var _normalizeScreens = require("./util/normalizeScreens");
var _parseBoxShadowValue = require("./util/parseBoxShadowValue");
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
function _interopRequireWildcard(obj) {
if (obj && obj.__esModule) {
return obj;
} else {
var newObj = {
};
if (obj != null) {
for(var key in obj){
if (Object.prototype.hasOwnProperty.call(obj, key)) {
var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {
};
if (desc.get || desc.set) {
Object.defineProperty(newObj, key, desc);
} else {
newObj[key] = obj[key];
}
}
}
}
newObj.default = obj;
return newObj;
}
}
let variantPlugins = {
pseudoElementVariants: ({ addVariant })=>{
addVariant('first-letter', '&::first-letter');
addVariant('first-line', '&::first-line');
addVariant('marker', [
'& *::marker',
'&::marker'
]);
addVariant('selection', [
'& *::selection',
'&::selection'
]);
addVariant('file', '&::file-selector-button');
addVariant('placeholder', '&::placeholder');
addVariant('before', ({ container })=>{
container.walkRules((rule)=>{
let foundContent = false;
rule.walkDecls('content', ()=>{
foundContent = true;
});
if (!foundContent) {
rule.prepend(_postcss.default.decl({
prop: 'content',
value: 'var(--tw-content)'
}));
}
});
return '&::before';
});
addVariant('after', ({ container })=>{
container.walkRules((rule)=>{
let foundContent = false;
rule.walkDecls('content', ()=>{
foundContent = true;
});
if (!foundContent) {
rule.prepend(_postcss.default.decl({
prop: 'content',
value: 'var(--tw-content)'
}));
}
});
return '&::after';
});
},
pseudoClassVariants: ({ addVariant })=>{
let pseudoVariants = [
// Positional
[
'first',
':first-child'
],
[
'last',
':last-child'
],
[
'only',
':only-child'
],
[
'odd',
':nth-child(odd)'
],
[
'even',
':nth-child(even)'
],
'first-of-type',
'last-of-type',
'only-of-type',
// State
'visited',
'target',
[
'open',
'[open]'
],
// Forms
'default',
'checked',
'indeterminate',
'placeholder-shown',
'autofill',
'required',
'valid',
'invalid',
'in-range',
'out-of-range',
'read-only',
// Content
'empty',
// Interactive
'focus-within',
'hover',
'focus',
'focus-visible',
'active',
'disabled',
].map((variant)=>Array.isArray(variant) ? variant : [
variant,
`:${variant}`
]
);
for (let [variantName, state] of pseudoVariants){
addVariant(variantName, `&${state}`);
}
for (let [variantName1, state1] of pseudoVariants){
addVariant(`group-${variantName1}`, `:merge(.group)${state1} &`);
}
for (let [variantName2, state2] of pseudoVariants){
addVariant(`peer-${variantName2}`, `:merge(.peer)${state2} ~ &`);
}
},
directionVariants: ({ addVariant })=>{
addVariant('ltr', ()=>{
_log.default.warn('rtl-experimental', [
'The RTL features in Tailwind CSS are currently in preview.',
'Preview features are not covered by semver, and may be improved in breaking ways at any time.',
]);
return '[dir="ltr"] &';
});
addVariant('rtl', ()=>{
_log.default.warn('rtl-experimental', [
'The RTL features in Tailwind CSS are currently in preview.',
'Preview features are not covered by semver, and may be improved in breaking ways at any time.',
]);
return '[dir="rtl"] &';
});
},
reducedMotionVariants: ({ addVariant })=>{
addVariant('motion-safe', '@media (prefers-reduced-motion: no-preference)');
addVariant('motion-reduce', '@media (prefers-reduced-motion: reduce)');
},
darkVariants: ({ config , addVariant })=>{
let mode = config('darkMode', 'media');
if (mode === false) {
mode = 'media';
_log.default.warn('darkmode-false', [
'The `darkMode` option in your Tailwind CSS configuration is set to `false`, which now behaves the same as `media`.',
'Change `darkMode` to `media` or remove it entirely.',
]);
}
if (mode === 'class') {
addVariant('dark', '.dark &');
} else if (mode === 'media') {
addVariant('dark', '@media (prefers-color-scheme: dark)');
}
},
printVariant: ({ addVariant })=>{
addVariant('print', '@media print');
},
screenVariants: ({ theme , addVariant })=>{
for (let screen of (0, _normalizeScreens).normalizeScreens(theme('screens'))){
let query = (0, _buildMediaQuery).default(screen);
addVariant(screen.name, `@media ${query}`);
}
},
orientationVariants: ({ addVariant })=>{
addVariant('portrait', '@media (orientation: portrait)');
addVariant('landscape', '@media (orientation: landscape)');
}
};
exports.variantPlugins = variantPlugins;
let corePlugins = {
preflight: ({ addBase })=>{
let preflightStyles = _postcss.default.parse(_fs.default.readFileSync(path.join(__dirname, './css/preflight.css'), 'utf8'));
addBase([
_postcss.default.comment({
text: `! tailwindcss v${_packageJson.version} | MIT License | https://tailwindcss.com`
}),
...preflightStyles.nodes,
]);
},
container: (()=>{
function extractMinWidths(breakpoints = []) {
return breakpoints.flatMap((breakpoint1)=>breakpoint1.values.map((breakpoint)=>breakpoint.min
)
).filter((v)=>v !== undefined
);
}
function mapMinWidthsToPadding(minWidths, screens, paddings) {
if (typeof paddings === 'undefined') {
return [];
}
if (!(typeof paddings === 'object' && paddings !== null)) {
return [
{
screen: 'DEFAULT',
minWidth: 0,
padding: paddings
},
];
}
let mapping = [];
if (paddings.DEFAULT) {
mapping.push({
screen: 'DEFAULT',
minWidth: 0,
padding: paddings.DEFAULT
});
}
for (let minWidth of minWidths){
for (let screen of screens){
for (let { min } of screen.values){
if (min === minWidth) {
mapping.push({
minWidth,
padding: paddings[screen.name]
});
}
}
}
}
return mapping;
}
return function({ addComponents , theme }) {
let screens = (0, _normalizeScreens).normalizeScreens(theme('container.screens', theme('screens')));
let minWidths = extractMinWidths(screens);
let paddings = mapMinWidthsToPadding(minWidths, screens, theme('container.padding'));
let generatePaddingFor = (minWidth)=>{
let paddingConfig = paddings.find((padding)=>padding.minWidth === minWidth
);
if (!paddingConfig) {
return {
};
}
return {
paddingRight: paddingConfig.padding,
paddingLeft: paddingConfig.padding
};
};
let atRules = Array.from(new Set(minWidths.slice().sort((a, z)=>parseInt(a) - parseInt(z)
))).map((minWidth)=>({
[`@media (min-width: ${minWidth})`]: {
'.container': {
'max-width': minWidth,
...generatePaddingFor(minWidth)
}
}
})
);
addComponents([
{
'.container': Object.assign({
width: '100%'
}, theme('container.center', false) ? {
marginRight: 'auto',
marginLeft: 'auto'
} : {
}, generatePaddingFor(0))
},
...atRules,
]);
};
})(),
accessibility: ({ addUtilities })=>{
addUtilities({
'.sr-only': {
position: 'absolute',
width: '1px',
height: '1px',
padding: '0',
margin: '-1px',
overflow: 'hidden',
clip: 'rect(0, 0, 0, 0)',
whiteSpace: 'nowrap',
borderWidth: '0'
},
'.not-sr-only': {
position: 'static',
width: 'auto',
height: 'auto',
padding: '0',
margin: '0',
overflow: 'visible',
clip: 'auto',
whiteSpace: 'normal'
}
});
},
pointerEvents: ({ addUtilities })=>{
addUtilities({
'.pointer-events-none': {
'pointer-events': 'none'
},
'.pointer-events-auto': {
'pointer-events': 'auto'
}
});
},
visibility: ({ addUtilities })=>{
addUtilities({
'.visible': {
visibility: 'visible'
},
'.invisible': {
visibility: 'hidden'
}
});
},
position: ({ addUtilities })=>{
addUtilities({
'.static': {
position: 'static'
},
'.fixed': {
position: 'fixed'
},
'.absolute': {
position: 'absolute'
},
'.relative': {
position: 'relative'
},
'.sticky': {
position: 'sticky'
}
});
},
inset: (0, _createUtilityPlugin).default('inset', [
[
'inset',
[
'top',
'right',
'bottom',
'left'
]
],
[
[
'inset-x',
[
'left',
'right'
]
],
[
'inset-y',
[
'top',
'bottom'
]
],
],
[
[
'top',
[
'top'
]
],
[
'right',
[
'right'
]
],
[
'bottom',
[
'bottom'
]
],
[
'left',
[
'left'
]
],
],
], {
supportsNegativeValues: true
}),
isolation: ({ addUtilities })=>{
addUtilities({
'.isolate': {
isolation: 'isolate'
},
'.isolation-auto': {
isolation: 'auto'
}
});
},
zIndex: (0, _createUtilityPlugin).default('zIndex', [
[
'z',
[
'zIndex'
]
]
], {
supportsNegativeValues: true
}),
order: (0, _createUtilityPlugin).default('order', undefined, {
supportsNegativeValues: true
}),
gridColumn: (0, _createUtilityPlugin).default('gridColumn', [
[
'col',
[
'gridColumn'
]
]
]),
gridColumnStart: (0, _createUtilityPlugin).default('gridColumnStart', [
[
'col-start',
[
'gridColumnStart'
]
]
]),
gridColumnEnd: (0, _createUtilityPlugin).default('gridColumnEnd', [
[
'col-end',
[
'gridColumnEnd'
]
]
]),
gridRow: (0, _createUtilityPlugin).default('gridRow', [
[
'row',
[
'gridRow'
]
]
]),
gridRowStart: (0, _createUtilityPlugin).default('gridRowStart', [
[
'row-start',
[
'gridRowStart'
]
]
]),
gridRowEnd: (0, _createUtilityPlugin).default('gridRowEnd', [
[
'row-end',
[
'gridRowEnd'
]
]
]),
float: ({ addUtilities })=>{
addUtilities({
'.float-right': {
float: 'right'
},
'.float-left': {
float: 'left'
},
'.float-none': {
float: 'none'
}
});
},
clear: ({ addUtilities })=>{
addUtilities({
'.clear-left': {
clear: 'left'
},
'.clear-right': {
clear: 'right'
},
'.clear-both': {
clear: 'both'
},
'.clear-none': {
clear: 'none'
}
});
},
margin: (0, _createUtilityPlugin).default('margin', [
[
'm',
[
'margin'
]
],
[
[
'mx',
[
'margin-left',
'margin-right'
]
],
[
'my',
[
'margin-top',
'margin-bottom'
]
],
],
[
[
'mt',
[
'margin-top'
]
],
[
'mr',
[
'margin-right'
]
],
[
'mb',
[
'margin-bottom'
]
],
[
'ml',
[
'margin-left'
]
],
],
], {
supportsNegativeValues: true
}),
boxSizing: ({ addUtilities })=>{
addUtilities({
'.box-border': {
'box-sizing': 'border-box'
},
'.box-content': {
'box-sizing': 'content-box'
}
});
},
display: ({ addUtilities })=>{
addUtilities({
'.block': {
display: 'block'
},
'.inline-block': {
display: 'inline-block'
},
'.inline': {
display: 'inline'
},
'.flex': {
display: 'flex'
},
'.inline-flex': {
display: 'inline-flex'
},
'.table': {
display: 'table'
},
'.inline-table': {
display: 'inline-table'
},
'.table-caption': {
display: 'table-caption'
},
'.table-cell': {
display: 'table-cell'
},
'.table-column': {
display: 'table-column'
},
'.table-column-group': {
display: 'table-column-group'
},
'.table-footer-group': {
display: 'table-footer-group'
},
'.table-header-group': {
display: 'table-header-group'
},
'.table-row-group': {
display: 'table-row-group'
},
'.table-row': {
display: 'table-row'
},
'.flow-root': {
display: 'flow-root'
},
'.grid': {
display: 'grid'
},
'.inline-grid': {
display: 'inline-grid'
},
'.contents': {
display: 'contents'
},
'.list-item': {
display: 'list-item'
},
'.hidden': {
display: 'none'
}
});
},
aspectRatio: (0, _createUtilityPlugin).default('aspectRatio', [
[
'aspect',
[
'aspect-ratio'
]
]
]),
height: (0, _createUtilityPlugin).default('height', [
[
'h',
[
'height'
]
]
]),
maxHeight: (0, _createUtilityPlugin).default('maxHeight', [
[
'max-h',
[
'maxHeight'
]
]
]),
minHeight: (0, _createUtilityPlugin).default('minHeight', [
[
'min-h',
[
'minHeight'
]
]
]),
width: (0, _createUtilityPlugin).default('width', [
[
'w',
[
'width'
]
]
]),
minWidth: (0, _createUtilityPlugin).default('minWidth', [
[
'min-w',
[
'minWidth'
]
]
]),
maxWidth: (0, _createUtilityPlugin).default('maxWidth', [
[
'max-w',
[
'maxWidth'
]
]
]),
flex: (0, _createUtilityPlugin).default('flex'),
flexShrink: (0, _createUtilityPlugin).default('flexShrink', [
[
'flex-shrink',
[
'flex-shrink'
]
],
[
'shrink',
[
'flex-shrink'
]
],
]),
flexGrow: (0, _createUtilityPlugin).default('flexGrow', [
[
'flex-grow',
[
'flex-grow'
]
],
[
'grow',
[
'flex-grow'
]
],
]),
flexBasis: (0, _createUtilityPlugin).default('flexBasis', [
[
'basis',
[
'flex-basis'
]
]
]),
tableLayout: ({ addUtilities })=>{
addUtilities({
'.table-auto': {
'table-layout': 'auto'
},
'.table-fixed': {
'table-layout': 'fixed'
}
});
},
borderCollapse: ({ addUtilities })=>{
addUtilities({
'.border-collapse': {
'border-collapse': 'collapse'
},
'.border-separate': {
'border-collapse': 'separate'
}
});
},
transformOrigin: (0, _createUtilityPlugin).default('transformOrigin', [
[
'origin',
[
'transformOrigin'
]
]
]),
translate: (0, _createUtilityPlugin).default('translate', [
[
[
'translate-x',
[
[
'@defaults transform',
{
}
],
'--tw-translate-x',
[
'transform',
'var(--tw-transform)'
]
],
],
[
'translate-y',
[
[
'@defaults transform',
{
}
],
'--tw-translate-y',
[
'transform',
'var(--tw-transform)'
]
],
],
],
], {
supportsNegativeValues: true
}),
rotate: (0, _createUtilityPlugin).default('rotate', [
[
'rotate',
[
[
'@defaults transform',
{
}
],
'--tw-rotate',
[
'transform',
'var(--tw-transform)'
]
],
],
], {
supportsNegativeValues: true
}),
skew: (0, _createUtilityPlugin).default('skew', [
[
[
'skew-x',
[
[
'@defaults transform',
{
}
],
'--tw-skew-x',
[
'transform',
'var(--tw-transform)'
]
],
],
[
'skew-y',
[
[
'@defaults transform',
{
}
],
'--tw-skew-y',
[
'transform',
'var(--tw-transform)'
]
],
],
],
], {
supportsNegativeValues: true
}),
scale: (0, _createUtilityPlugin).default('scale', [
[
'scale',
[
[
'@defaults transform',
{
}
],
'--tw-scale-x',
'--tw-scale-y',
[
'transform',
'var(--tw-transform)'
],
],
],
[
[
'scale-x',
[
[
'@defaults transform',
{
}
],
'--tw-scale-x',
[
'transform',
'var(--tw-transform)'
]
],
],
[
'scale-y',
[
[
'@defaults transform',
{
}
],
'--tw-scale-y',
[
'transform',
'var(--tw-transform)'
]
],
],
],
], {
supportsNegativeValues: true
}),
transform: ({ addBase , addUtilities })=>{
addBase({
'@defaults transform': {
'--tw-translate-x': '0',
'--tw-translate-y': '0',
'--tw-rotate': '0',
'--tw-skew-x': '0',
'--tw-skew-y': '0',
'--tw-scale-x': '1',
'--tw-scale-y': '1',
'--tw-transform': [
'translateX(var(--tw-translate-x))',
'translateY(var(--tw-translate-y))',
'rotate(var(--tw-rotate))',
'skewX(var(--tw-skew-x))',
'skewY(var(--tw-skew-y))',
'scaleX(var(--tw-scale-x))',
'scaleY(var(--tw-scale-y))',
].join(' ')
}
});
addUtilities({
'.transform': {
'@defaults transform': {
},
transform: 'var(--tw-transform)'
},
'.transform-cpu': {
'--tw-transform': [
'translateX(var(--tw-translate-x))',
'translateY(var(--tw-translate-y))',
'rotate(var(--tw-rotate))',
'skewX(var(--tw-skew-x))',
'skewY(var(--tw-skew-y))',
'scaleX(var(--tw-scale-x))',
'scaleY(var(--tw-scale-y))',
].join(' ')
},
'.transform-gpu': {
'--tw-transform': [
'translate3d(var(--tw-translate-x), var(--tw-translate-y), 0)',
'rotate(var(--tw-rotate))',
'skewX(var(--tw-skew-x))',
'skewY(var(--tw-skew-y))',
'scaleX(var(--tw-scale-x))',
'scaleY(var(--tw-scale-y))',
].join(' ')
},
'.transform-none': {
transform: 'none'
}
});
},
animation: ({ matchUtilities , theme , prefix })=>{
let prefixName = (name)=>prefix(`.${name}`).slice(1)
;
var ref;
let keyframes = Object.fromEntries(Object.entries((ref = theme('keyframes')) !== null && ref !== void 0 ? ref : {
}).map(([key, value])=>{
return [
key,
{
[`@keyframes ${prefixName(key)}`]: value
}
];
}));
matchUtilities({
animate: (value1)=>{
let animations = (0, _parseAnimationValue).default(value1);
return [
...animations.flatMap((animation)=>keyframes[animation.name]
),
{
animation: animations.map(({ name , value })=>{
if (name === undefined || keyframes[name] === undefined) {
return value;
}
return value.replace(name, prefixName(name));
}).join(', ')
},
];
}
}, {
values: theme('animation')
});
},
cursor: (0, _createUtilityPlugin).default('cursor'),
touchAction: ({ addBase , addUtilities })=>{
addBase({
'@defaults touch-action': {
'--tw-pan-x': 'var(--tw-empty,/*!*/ /*!*/)',
'--tw-pan-y': 'var(--tw-empty,/*!*/ /*!*/)',
'--tw-pinch-zoom': 'var(--tw-empty,/*!*/ /*!*/)',
'--tw-touch-action': 'var(--tw-pan-x) var(--tw-pan-y) var(--tw-pinch-zoom)'
}
});
addUtilities({
'.touch-auto': {
'touch-action': 'auto'
},
'.touch-none': {
'touch-action': 'none'
},
'.touch-pan-x': {
'@defaults touch-action': {
},
'--tw-pan-x': 'pan-x',
'touch-action': 'var(--tw-touch-action)'
},
'.touch-pan-left': {
'@defaults touch-action': {
},
'--tw-pan-x': 'pan-left',
'touch-action': 'var(--tw-touch-action)'
},
'.touch-pan-right': {
'@defaults touch-action': {
},
'--tw-pan-x': 'pan-right',
'touch-action': 'var(--tw-touch-action)'
},
'.touch-pan-y': {
'@defaults touch-action': {
},
'--tw-pan-y': 'pan-y',
'touch-action': 'var(--tw-touch-action)'
},
'.touch-pan-up': {
'@defaults touch-action': {
},
'--tw-pan-y': 'pan-up',
'touch-action': 'var(--tw-touch-action)'
},
'.touch-pan-down': {
'@defaults touch-action': {
},
'--tw-pan-y': 'pan-down',
'touch-action': 'var(--tw-touch-action)'
},
'.touch-pinch-zoom': {
'@defaults touch-action': {
},
'--tw-pinch-zoom': 'pinch-zoom',
'touch-action': 'var(--tw-touch-action)'
},
'.touch-manipulation': {
'touch-action': 'manipulation'
}
});
},
userSelect: ({ addUtilities })=>{
addUtilities({
'.select-none': {
'user-select': 'none'
},
'.select-text': {
'user-select': 'text'
},
'.select-all': {
'user-select': 'all'
},
'.select-auto': {
'user-select': 'auto'
}
});
},
resize: ({ addUtilities })=>{
addUtilities({
'.resize-none': {
resize: 'none'
},
'.resize-y': {
resize: 'vertical'
},
'.resize-x': {
resize: 'horizontal'
},
'.resize': {
resize: 'both'
}
});
},
scrollSnapType: ({ addUtilities , addBase })=>{
addBase({
'@defaults scroll-snap-type': {
'--tw-scroll-snap-strictness': 'proximity'
}
});
addUtilities({
'.snap-none': {
'scroll-snap-type': 'none'
},
'.snap-x': {
'@defaults scroll-snap-type': {
},
'scroll-snap-type': 'x var(--tw-scroll-snap-strictness)'
},
'.snap-y': {
'@defaults scroll-snap-type': {
},
'scroll-snap-type': 'y var(--tw-scroll-snap-strictness)'
},
'.snap-both': {
'@defaults scroll-snap-type': {
},
'scroll-snap-type': 'both var(--tw-scroll-snap-strictness)'
},
'.snap-mandatory': {
'--tw-scroll-snap-strictness': 'mandatory'
},
'.snap-proximity': {
'--tw-scroll-snap-strictness': 'proximity'
}
});
},
scrollSnapAlign: ({ addUtilities })=>{
addUtilities({
'.snap-start': {
'scroll-snap-align': 'start'
},
'.snap-end': {
'scroll-snap-align': 'end'
},
'.snap-center': {
'scroll-snap-align': 'center'
},
'.snap-align-none': {
'scroll-snap-align': 'none'
}
});
},
scrollSnapStop: ({ addUtilities })=>{
addUtilities({
'.snap-normal': {
'scroll-snap-stop': 'normal'
},
'.snap-always': {
'scroll-snap-stop': 'always'
}
});
},
scrollMargin: (0, _createUtilityPlugin).default('scrollMargin', [
[
'scroll-m',
[
'scroll-margin'
]
],
[
[
'scroll-mx',
[
'scroll-margin-left',
'scroll-margin-right'
]
],
[
'scroll-my',
[
'scroll-margin-top',
'scroll-margin-bottom'
]
],
],
[
[
'scroll-mt',
[
'scroll-margin-top'
]
],
[
'scroll-mr',
[
'scroll-margin-right'
]
],
[
'scroll-mb',
[
'scroll-margin-bottom'
]
],
[
'scroll-ml',
[
'scroll-margin-left'
]
],
],
], {
supportsNegativeValues: true
}),
scrollPadding: (0, _createUtilityPlugin).default('scrollPadding', [
[
'scroll-p',
[
'scroll-padding'
]
],
[
[
'scroll-px',
[
'scroll-padding-left',
'scroll-padding-right'
]
],
[
'scroll-py',
[
'scroll-padding-top',
'scroll-padding-bottom'
]
],
],
[
[
'scroll-pt',
[
'scroll-padding-top'
]
],
[
'scroll-pr',
[
'scroll-padding-right'
]
],
[
'scroll-pb',
[
'scroll-padding-bottom'
]
],
[
'scroll-pl',
[
'scroll-padding-left'
]
],
],
]),
listStylePosition: ({ addUtilities })=>{
addUtilities({
'.list-inside': {
'list-style-position': 'inside'
},
'.list-outside': {
'list-style-position': 'outside'
}
});
},
listStyleType: (0, _createUtilityPlugin).default('listStyleType', [
[
'list',
[
'listStyleType'
]
]
]),
appearance: ({ addUtilities })=>{
addUtilities({
'.appearance-none': {
appearance: 'none'
}
});
},
columns: (0, _createUtilityPlugin).default('columns', [
[
'columns',
[
'columns'
]
]
]),
breakBefore: ({ addUtilities })=>{
addUtilities({
'.break-before-auto': {
'break-before': 'auto'
},
'.break-before-avoid': {
'break-before': 'avoid'
},
'.break-before-all': {
'break-before': 'all'
},
'.break-before-avoid-page': {
'break-before': 'avoid-page'
},
'.break-before-page': {
'break-before': 'page'
},
'.break-before-left': {
'break-before': 'left'
},
'.break-before-right': {
'break-before': 'right'
},
'.break-before-column': {
'break-before': 'column'
}
});
},
breakInside: ({ addUtilities })=>{
addUtilities({
'.break-inside-auto': {
'break-inside': 'auto'
},
'.break-inside-avoid': {
'break-inside': 'avoid'
},
'.break-inside-avoid-page': {
'break-inside': 'avoid-page'
},
'.break-inside-avoid-column': {
'break-inside': 'avoid-column'
}
});
},
breakAfter: ({ addUtilities })=>{
addUtilities({
'.break-after-auto': {
'break-after': 'auto'
},
'.break-after-avoid': {
'break-after': 'avoid'
},
'.break-after-all': {
'break-after': 'all'
},
'.break-after-avoid-page': {
'break-after': 'avoid-page'
},
'.break-after-page': {
'break-after': 'page'
},
'.break-after-left': {
'break-after': 'left'
},
'.break-after-right': {
'break-after': 'right'
},
'.break-after-column': {
'break-after': 'column'
}
});
},
gridAutoColumns: (0, _createUtilityPlugin).default('gridAutoColumns', [
[
'auto-cols',
[
'gridAutoColumns'
]
]
]),
gridAutoFlow: ({ addUtilities })=>{
addUtilities({
'.grid-flow-row': {
gridAutoFlow: 'row'
},
'.grid-flow-col': {
gridAutoFlow: 'column'
},
'.grid-flow-row-dense': {
gridAutoFlow: 'row dense'
},
'.grid-flow-col-dense': {
gridAutoFlow: 'column dense'
}
});
},
gridAutoRows: (0, _createUtilityPlugin).default('gridAutoRows', [
[
'auto-rows',
[
'gridAutoRows'
]
]
]),
gridTemplateColumns: (0, _createUtilityPlugin).default('gridTemplateColumns', [
[
'grid-cols',
[
'gridTemplateColumns'
]
],
]),
gridTemplateRows: (0, _createUtilityPlugin).default('gridTemplateRows', [
[
'grid-rows',
[
'gridTemplateRows'
]
]
]),
flexDirection: ({ addUtilities })=>{
addUtilities({
'.flex-row': {
'flex-direction': 'row'
},
'.flex-row-reverse': {
'flex-direction': 'row-reverse'
},
'.flex-col': {
'flex-direction': 'column'
},
'.flex-col-reverse': {
'flex-direction': 'column-reverse'
}
});
},
flexWrap: ({ addUtilities })=>{
addUtilities({
'.flex-wrap': {
'flex-wrap': 'wrap'
},
'.flex-wrap-reverse': {
'flex-wrap': 'wrap-reverse'
},
'.flex-nowrap': {
'flex-wrap': 'nowrap'
}
});
},
placeContent: ({ addUtilities })=>{
addUtilities({
'.place-content-center': {
'place-content': 'center'
},
'.place-content-start': {
'place-content': 'start'
},
'.place-content-end': {
'place-content': 'end'
},
'.place-content-between': {
'place-content': 'space-between'
},
'.place-content-around': {
'place-content': 'space-around'
},
'.place-content-evenly': {
'place-content': 'space-evenly'
},
'.place-content-stretch': {
'place-content': 'stretch'
}
});
},
placeItems: ({ addUtilities })=>{
addUtilities({
'.place-items-start': {
'place-items': 'start'
},
'.place-items-end': {
'place-items': 'end'
},
'.place-items-center': {
'place-items': 'center'
},
'.place-items-stretch': {
'place-items': 'stretch'
}
});
},
alignContent: ({ addUtilities })=>{
addUtilities({
'.content-center': {
'align-content': 'center'
},
'.content-start': {
'align-content': 'flex-start'
},
'.content-end': {
'align-content': 'flex-end'
},
'.content-between': {
'align-content': 'space-between'
},
'.content-around': {
'align-content': 'space-around'
},
'.content-evenly': {
'align-content': 'space-evenly'
}
});
},
alignItems: ({ addUtilities })=>{
addUtilities({
'.items-start': {
'align-items': 'flex-start'
},
'.items-end': {
'align-items': 'flex-end'
},
'.items-center': {
'align-items': 'center'
},
'.items-baseline': {
'align-items': 'baseline'
},
'.items-stretch': {
'align-items': 'stretch'
}
});
},
justifyContent: ({ addUtilities })=>{
addUtilities({
'.justify-start': {
'justify-content': 'flex-start'
},
'.justify-end': {
'justify-content': 'flex-end'
},
'.justify-center': {
'justify-content': 'center'
},
'.justify-between': {
'justify-content': 'space-between'
},
'.justify-around': {
'justify-content': 'space-around'
},
'.justify-evenly': {
'justify-content': 'space-evenly'
}
});
},
justifyItems: ({ addUtilities })=>{
addUtilities({
'.justify-items-start': {
'justify-items': 'start'
},
'.justify-items-end': {
'justify-items': 'end'
},
'.justify-items-center': {
'justify-items': 'center'
},
'.justify-items-stretch': {
'justify-items': 'stretch'
}
});
},
gap: (0, _createUtilityPlugin).default('gap', [
[
'gap',
[
'gap'
]
],
[
[
'gap-x',
[
'columnGap'
]
],
[
'gap-y',
[
'rowGap'
]
],
],
]),
space: ({ matchUtilities , addUtilities , theme })=>{
matchUtilities({
'space-x': (value)=>{
value = value === '0' ? '0px' : value;
return {
'& > :not([hidden]) ~ :not([hidden])': {
'--tw-space-x-reverse': '0',
'margin-right': `calc(${value} * var(--tw-space-x-reverse))`,
'margin-left': `calc(${value} * calc(1 - var(--tw-space-x-reverse)))`
}
};
},
'space-y': (value)=>{
value = value === '0' ? '0px' : value;
return {
'& > :not([hidden]) ~ :not([hidden])': {
'--tw-space-y-reverse': '0',
'margin-top': `calc(${value} * calc(1 - var(--tw-space-y-reverse)))`,
'margin-bottom': `calc(${value} * var(--tw-space-y-reverse))`
}
};
}
}, {
values: theme('space'),
supportsNegativeValues: true
});
addUtilities({
'.space-y-reverse > :not([hidden]) ~ :not([hidden])': {
'--tw-space-y-reverse': '1'
},
'.space-x-reverse > :not([hidden]) ~ :not([hidden])': {
'--tw-space-x-reverse': '1'
}
});
},
divideWidth: ({ matchUtilities , addUtilities , theme })=>{
matchUtilities({
'divide-x': (value)=>{
value = value === '0' ? '0px' : value;
return {
'& > :not([hidden]) ~ :not([hidden])': {
'@defaults border-width': {
},
'--tw-divide-x-reverse': '0',
'border-right-width': `calc(${value} * var(--tw-divide-x-reverse))`,
'border-left-width': `calc(${value} * calc(1 - var(--tw-divide-x-reverse)))`
}
};
},
'divide-y': (value)=>{
value = value === '0' ? '0px' : value;
return {
'& > :not([hidden]) ~ :not([hidden])': {
'@defaults border-width': {
},
'--tw-divide-y-reverse': '0',
'border-top-width': `calc(${value} * calc(1 - var(--tw-divide-y-reverse)))`,
'border-bottom-width': `calc(${value} * var(--tw-divide-y-reverse))`
}
};
}
}, {
values: theme('divideWidth'),
type: [
'line-width',
'length'
]
});
addUtilities({
'.divide-y-reverse > :not([hidden]) ~ :not([hidden])': {
'@defaults border-width': {
},
'--tw-divide-y-reverse': '1'
},
'.divide-x-reverse > :not([hidden]) ~ :not([hidden])': {
'@defaults border-width': {
},
'--tw-divide-x-reverse': '1'
}
});
},
divideStyle: ({ addUtilities })=>{
addUtilities({
'.divide-solid > :not([hidden]) ~ :not([hidden])': {
'border-style': 'solid'
},
'.divide-dashed > :not([hidden]) ~ :not([hidden])': {
'border-style': 'dashed'
},
'.divide-dotted > :not([hidden]) ~ :not([hidden])': {
'border-style': 'dotted'
},
'.divide-double > :not([hidden]) ~ :not([hidden])': {
'border-style': 'double'
},
'.divide-none > :not([hidden]) ~ :not([hidden])': {
'border-style': 'none'
}
});
},
divideColor: ({ matchUtilities , theme , corePlugins: corePlugins1 })=>{
matchUtilities({
divide: (value)=>{
if (!corePlugins1('divideOpacity')) {
return {
['& > :not([hidden]) ~ :not([hidden])']: {
'border-color': (0, _toColorValue).default(value)
}
};
}
return {
['& > :not([hidden]) ~ :not([hidden])']: (0, _withAlphaVariable).default({
color: value,
property: 'border-color',
variable: '--tw-divide-opacity'
})
};
}
}, {
values: (({ DEFAULT: _ , ...colors })=>colors
)((0, _flattenColorPalette).default(theme('divideColor'))),
type: 'color'
});
},
divideOpacity: ({ matchUtilities , theme })=>{
matchUtilities({
'divide-opacity': (value)=>{
return {
[`& > :not([hidden]) ~ :not([hidden])`]: {
'--tw-divide-opacity': value
}
};
}
}, {
values: theme('divideOpacity')
});
},
placeSelf: ({ addUtiliti