postcss-preset-mantine
Advanced tools
Comparing version 1.10.0 to 1.11.0
"use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
function scaleRem(remValue) { | ||
return `calc(${remValue} * var(--mantine-scale))`; | ||
} | ||
function createConverter(units, { shouldScale = false } = {}) { | ||
function converter(value) { | ||
if (value === 0 || value === '0') { | ||
return '0'; | ||
} | ||
if (typeof value === 'number') { | ||
const val = `${value / 16}${units}`; | ||
return shouldScale ? scaleRem(val) : val; | ||
} | ||
if (typeof value === 'string') { | ||
if (value.startsWith('calc(') || value.startsWith('var(')) { | ||
return value; | ||
} | ||
if (value.includes(' ')) { | ||
return value | ||
.split(' ') | ||
.map((val) => converter(val)) | ||
.join(' '); | ||
} | ||
if (value.includes(units)) { | ||
return shouldScale ? scaleRem(value) : value; | ||
} | ||
const replaced = value.replace('px', ''); | ||
if (!Number.isNaN(Number(replaced))) { | ||
const val = `${Number(replaced) / 16}${units}`; | ||
return shouldScale ? scaleRem(val) : val; | ||
} | ||
} | ||
return value; | ||
} | ||
return converter; | ||
} | ||
const rem = createConverter('rem', { shouldScale: true }); | ||
const remNoScale = createConverter('rem'); | ||
const em = createConverter('em'); | ||
const converters = require('./converters'); | ||
const getRegExp = (units) => new RegExp('\\b' + units + '\\(([^()]+)\\)', 'g'); | ||
@@ -48,4 +11,4 @@ const emRegExp = getRegExp('em'); | ||
Once(root) { | ||
root.replaceValues(remRegExp, { fast: `rem(` }, (_, values) => rem(values)); | ||
root.replaceValues(emRegExp, { fast: `em(` }, (_, values) => em(values)); | ||
root.replaceValues(remRegExp, { fast: `rem(` }, (_, values) => converters.rem(values)); | ||
root.replaceValues(emRegExp, { fast: `em(` }, (_, values) => converters.em(values)); | ||
}, | ||
@@ -55,4 +18,4 @@ AtRule: { | ||
atRule.params = atRule.params | ||
.replace(remRegExp, (value) => remNoScale(value.replace(/rem\((.*?)\)/g, '$1'))) | ||
.replace(emRegExp, (value) => em(value.replace(/em\((.*?)\)/g, '$1'))); | ||
.replace(remRegExp, (value) => converters.remNoScale(value.replace(/rem\((.*?)\)/g, '$1'))) | ||
.replace(emRegExp, (value) => converters.em(value.replace(/em\((.*?)\)/g, '$1'))); | ||
}, | ||
@@ -59,0 +22,0 @@ }, |
@@ -6,2 +6,3 @@ "use strict"; | ||
const lightDark = require('./postcss-light-dark'); | ||
const converters = require('./converters'); | ||
function colorSchemeMixin(colorScheme) { | ||
@@ -53,2 +54,12 @@ return { | ||
}; | ||
const smallerThanMixin = (_mixin, breakpoint) => ({ | ||
[`@media (max-width: ${converters.em(converters.px(breakpoint) - 0.1)})`]: { | ||
'@mixin-content': {}, | ||
}, | ||
}); | ||
const largerThanMixin = (_mixin, breakpoint) => ({ | ||
[`@media (min-width: ${converters.em(breakpoint)})`]: { | ||
'@mixin-content': {}, | ||
}, | ||
}); | ||
module.exports = () => { | ||
@@ -72,2 +83,4 @@ return { | ||
'not-ltr': notLtrMixin, | ||
'smaller-than': smallerThanMixin, | ||
'larger-than': largerThanMixin, | ||
}, | ||
@@ -74,0 +87,0 @@ }), |
{ | ||
"name": "postcss-preset-mantine", | ||
"version": "1.10.0", | ||
"version": "1.11.0", | ||
"description": "PostCSS preset for Mantine (7.0+) applications", | ||
@@ -5,0 +5,0 @@ "main": "dist/preset.js", |
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
15753
12
244