@minko-fe/postcss-pxtorem
Version:
A postcss plugin that converts px to rem.
184 lines (138 loc) • 5.8 kB
TypeScript
import { Input, Plugin } from 'postcss';
type ParseOptions = {
/**
Decode the keys and values. URI components are decoded with [`decode-uri-component`](https://github.com/SamVerschueren/decode-uri-component).
@default true
*/
readonly decode?: boolean;
/**
@default 'none'
- `bracket`: Parse arrays with bracket representation:
```
import queryString from 'query-string';
queryString.parse('foo[]=1&foo[]=2&foo[]=3', {arrayFormat: 'bracket'});
//=> {foo: ['1', '2', '3']}
```
- `index`: Parse arrays with index representation:
```
import queryString from 'query-string';
queryString.parse('foo[0]=1&foo[1]=2&foo[3]=3', {arrayFormat: 'index'});
//=> {foo: ['1', '2', '3']}
```
- `comma`: Parse arrays with elements separated by comma:
```
import queryString from 'query-string';
queryString.parse('foo=1,2,3', {arrayFormat: 'comma'});
//=> {foo: ['1', '2', '3']}
```
- `separator`: Parse arrays with elements separated by a custom character:
```
import queryString from 'query-string';
queryString.parse('foo=1|2|3', {arrayFormat: 'separator', arrayFormatSeparator: '|'});
//=> {foo: ['1', '2', '3']}
```
- `bracket-separator`: Parse arrays (that are explicitly marked with brackets) with elements separated by a custom character:
```
import queryString from 'query-string';
queryString.parse('foo[]', {arrayFormat: 'bracket-separator', arrayFormatSeparator: '|'});
//=> {foo: []}
queryString.parse('foo[]=', {arrayFormat: 'bracket-separator', arrayFormatSeparator: '|'});
//=> {foo: ['']}
queryString.parse('foo[]=1', {arrayFormat: 'bracket-separator', arrayFormatSeparator: '|'});
//=> {foo: ['1']}
queryString.parse('foo[]=1|2|3', {arrayFormat: 'bracket-separator', arrayFormatSeparator: '|'});
//=> {foo: ['1', '2', '3']}
queryString.parse('foo[]=1||3|||6', {arrayFormat: 'bracket-separator', arrayFormatSeparator: '|'});
//=> {foo: ['1', '', 3, '', '', '6']}
queryString.parse('foo[]=1|2|3&bar=fluffy&baz[]=4', {arrayFormat: 'bracket-separator', arrayFormatSeparator: '|'});
//=> {foo: ['1', '2', '3'], bar: 'fluffy', baz:['4']}
```
- `colon-list-separator`: Parse arrays with parameter names that are explicitly marked with `:list`:
```
import queryString from 'query-string';
queryString.parse('foo:list=one&foo:list=two', {arrayFormat: 'colon-list-separator'});
//=> {foo: ['one', 'two']}
```
- `none`: Parse arrays with elements using duplicate keys:
```
import queryString from 'query-string';
queryString.parse('foo=1&foo=2&foo=3');
//=> {foo: ['1', '2', '3']}
```
*/
readonly arrayFormat?: 'bracket' | 'index' | 'comma' | 'separator' | 'bracket-separator' | 'colon-list-separator' | 'none';
/**
The character used to separate array elements when using `{arrayFormat: 'separator'}`.
@default ,
*/
readonly arrayFormatSeparator?: string;
/**
Supports both `Function` as a custom sorting function or `false` to disable sorting.
If omitted, keys are sorted using `Array#sort`, which means, converting them to strings and comparing strings in Unicode code point order.
@default true
@example
```
import queryString from 'query-string';
const order = ['c', 'a', 'b'];
queryString.parse('?a=one&b=two&c=three', {
sort: (itemLeft, itemRight) => order.indexOf(itemLeft) - order.indexOf(itemRight)
});
//=> {c: 'three', a: 'one', b: 'two'}
```
@example
```
import queryString from 'query-string';
queryString.parse('?a=one&c=three&b=two', {sort: false});
//=> {a: 'one', c: 'three', b: 'two'}
```
*/
readonly sort?: ((itemLeft: string, itemRight: string) => number) | boolean;
/**
Parse the value as a number type instead of string type if it's a number.
@default false
@example
```
import queryString from 'query-string';
queryString.parse('foo=1', {parseNumbers: true});
//=> {foo: 1}
```
*/
readonly parseNumbers?: boolean;
/**
Parse the value as a boolean type instead of string type if it's a boolean.
@default false
@example
```
import queryString from 'query-string';
queryString.parse('foo=true', {parseBooleans: true});
//=> {foo: true}
```
*/
readonly parseBooleans?: boolean;
};
interface ConvertUnit {
source: string | RegExp;
target: string;
}
type XCludeType = string | RegExp | ((filePath: string) => boolean) | null;
type PxtoremOptions = Partial<{
rootValue: number | ((input: Input | undefined) => number);
unitToConvert: string;
unitPrecision: number;
selectorBlackList: (string | RegExp)[];
propList: string[];
replace: boolean;
atRules: boolean | string[];
minPixelValue: number;
include: XCludeType;
exclude: XCludeType;
disable: boolean;
convertUnit: ConvertUnit | ConvertUnit[] | false;
parseOptions: ParseOptions;
}>;
declare const DEFAULT_OPTIONS: Required<PxtoremOptions>;
declare function pxtorem(options?: PxtoremOptions): Plugin;
declare namespace pxtorem {
var postcss: boolean;
}
export { DEFAULT_OPTIONS, type PxtoremOptions, pxtorem as default, pxtorem };