feat(hatch): RED-GREEN test 1 — hatch starts Buttoned Up

This commit is contained in:
2026-05-23 06:04:28 +00:00
parent 6c880fd93a
commit 233127d8e4
4857 changed files with 3794230 additions and 0 deletions

1
node_modules/.bin/acorn generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../acorn/bin/acorn

1
node_modules/.bin/ansi-html generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../ansi-html-community/bin/ansi-html

1
node_modules/.bin/baseline-browser-mapping generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../baseline-browser-mapping/dist/cli.cjs

1
node_modules/.bin/browserslist generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../browserslist/cli.js

1
node_modules/.bin/color-support generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../color-support/bin.js

1
node_modules/.bin/create-jest generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../create-jest/bin/create-jest.js

1
node_modules/.bin/envinfo generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../envinfo/dist/cli.js

1
node_modules/.bin/escodegen generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../escodegen/bin/escodegen.js

1
node_modules/.bin/esgenerate generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../escodegen/bin/esgenerate.js

1
node_modules/.bin/esparse generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../esprima/bin/esparse.js

1
node_modules/.bin/esvalidate generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../esprima/bin/esvalidate.js

1
node_modules/.bin/flat generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../flat/cli.js

1
node_modules/.bin/import-local-fixture generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../import-local/fixtures/cli.js

1
node_modules/.bin/is-docker generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../is-docker/cli.js

1
node_modules/.bin/is-inside-container generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../is-inside-container/cli.js

1
node_modules/.bin/jest generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../jest/bin/jest.js

1
node_modules/.bin/js-yaml generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../js-yaml/bin/js-yaml.js

1
node_modules/.bin/jsesc generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../jsesc/bin/jsesc

1
node_modules/.bin/json5 generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../json5/lib/cli.js

1
node_modules/.bin/mime generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../mime/cli.js

1
node_modules/.bin/mkdirp generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../mkdirp/bin/cmd.js

1
node_modules/.bin/multicast-dns generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../multicast-dns/cli.js

1
node_modules/.bin/nanoid generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../nanoid/bin/nanoid.cjs

1
node_modules/.bin/node-pre-gyp generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../@mapbox/node-pre-gyp/bin/node-pre-gyp

1
node_modules/.bin/node-which generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../which/bin/node-which

1
node_modules/.bin/nopt generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../nopt/bin/nopt.js

1
node_modules/.bin/parser generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../@babel/parser/bin/babel-parser.js

1
node_modules/.bin/resolve generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../resolve/bin/resolve

1
node_modules/.bin/rimraf generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../rimraf/bin.js

1
node_modules/.bin/rolldown generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../rolldown/bin/cli.mjs

1
node_modules/.bin/semver generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../semver/bin/semver.js

1
node_modules/.bin/specificity generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../@bramus/specificity/bin/cli.js

1
node_modules/.bin/terser generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../terser/bin/terser

1
node_modules/.bin/tldts generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../tldts/bin/cli.js

1
node_modules/.bin/update-browserslist-db generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../update-browserslist-db/cli.js

1
node_modules/.bin/uuid generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../uuid/dist/bin/uuid

1
node_modules/.bin/vite generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../vite/bin/vite.js

1
node_modules/.bin/vitest generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../vitest/vitest.mjs

1
node_modules/.bin/webpack generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../webpack/bin/webpack.js

1
node_modules/.bin/webpack-cli generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../webpack-cli/bin/cli.js

1
node_modules/.bin/webpack-dev-server generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../webpack-dev-server/bin/webpack-dev-server.js

1
node_modules/.bin/why-is-node-running generated vendored Symbolic link
View File

@@ -0,0 +1 @@
../why-is-node-running/cli.js

1264
node_modules/.package-lock.json generated vendored Normal file

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1 @@
{"version":"4.1.7","results":[[":tests/game/entities/CommanderHatch.test.js",{"duration":3.0219520000000557,"failed":false}]]}

21
node_modules/@asamuzakjp/css-color/LICENSE generated vendored Normal file
View File

@@ -0,0 +1,21 @@
MIT License
Copyright (c) 2024 asamuzaK (Kazz)
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

316
node_modules/@asamuzakjp/css-color/README.md generated vendored Normal file
View File

@@ -0,0 +1,316 @@
# CSS color
[![build](https://github.com/asamuzaK/cssColor/actions/workflows/node.js.yml/badge.svg)](https://github.com/asamuzaK/cssColor/actions/workflows/node.js.yml)
[![CodeQL](https://github.com/asamuzaK/cssColor/actions/workflows/github-code-scanning/codeql/badge.svg)](https://github.com/asamuzaK/cssColor/actions/workflows/github-code-scanning/codeql)
[![npm (scoped)](https://img.shields.io/npm/v/@asamuzakjp/css-color)](https://www.npmjs.com/package/@asamuzakjp/css-color)
Resolve and convert CSS colors.
## Install
```console
npm i @asamuzakjp/css-color
```
## Usage
```javascript
import { convert, resolve, utils } from '@asamuzakjp/css-color';
const resolvedValue = resolve(
'color-mix(in oklab, lch(67.5345 42.5 258.2), color(srgb 0 0.5 0))'
);
// 'oklab(0.620754 -0.0931934 -0.00374881)'
const convertedValue = convert.colorToHex('lab(46.2775% -47.5621 48.5837)');
// '#008000'
const result = utils.isColor('green');
// true
```
<!-- Generated by documentation.js. Update this documentation by updating the source code. -->
### resolve(color, opt)
resolves CSS color
#### Parameters
- `color` **[string][133]** color value
- system colors are not supported
- `opt` **[object][135]?** options (optional, default `{}`)
- `opt.currentColor` **[string][133]?**
- color to use for `currentcolor` keyword
- if omitted, it will be treated as a missing color,
i.e. `rgb(none none none / none)`
- `opt.customProperty` **[object][135]?**
- custom properties
- pair of `--` prefixed property name as a key and it's value,
e.g.
```javascript
const opt = {
customProperty: {
'--some-color': '#008000',
'--some-length': '16px'
}
};
```
- and/or `callback` function to get the value of the custom property,
e.g.
```javascript
const node = document.getElementById('foo');
const opt = {
customProperty: {
callback: node.style.getPropertyValue
}
};
```
- `opt.dimension` **[object][135]?**
- dimension, e.g. for converting relative length to pixels
- pair of unit as a key and number in pixels as it's value,
e.g. suppose `1em === 12px`, `1rem === 16px` and `100vw === 1024px`, then
```javascript
const opt = {
dimension: {
em: 12,
rem: 16,
vw: 10.24
}
};
```
- and/or `callback` function to get the value as a number in pixels,
e.g.
```javascript
const opt = {
dimension: {
callback: unit => {
switch (unit) {
case 'em':
return 12;
case 'rem':
return 16;
case 'vw':
return 10.24;
default:
return;
}
}
}
};
```
- `opt.format` **[string][133]?**
- output format, one of below
- `computedValue` (default), [computed value][139] of the color
- `specifiedValue`, [specified value][140] of the color
- `hex`, hex color notation, i.e. `#rrggbb`
- `hexAlpha`, hex color notation with alpha channel, i.e. `#rrggbbaa`
Returns **[string][133]?** one of `rgba?()`, `#rrggbb(aa)?`, `color-name`, `color(color-space r g b / alpha)`, `color(color-space x y z / alpha)`, `(ok)?lab(l a b / alpha)`, `(ok)?lch(l c h / alpha)`, `'(empty-string)'`, `null`
- in `computedValue`, values are numbers, however `rgb()` values are integers
- in `specifiedValue`, returns `empty string` for unknown and/or invalid color
- in `hex`, returns `null` for `transparent`, and also returns `null` if any of `r`, `g`, `b`, `alpha` is not a number
- in `hexAlpha`, returns `#00000000` for `transparent`, however returns `null` if any of `r`, `g`, `b`, `alpha` is not a number
### convert
Contains various color conversion functions.
### convert.numberToHex(value)
convert number to hex string
#### Parameters
- `value` **[number][134]** color value
Returns **[string][133]** hex string: 00..ff
### convert.colorToHex(value, opt)
convert color to hex
#### Parameters
- `value` **[string][133]** color value
- `opt` **[object][135]?** options (optional, default `{}`)
- `opt.alpha` **[boolean][136]?** return in #rrggbbaa notation
- `opt.customProperty` **[object][135]?**
- custom properties, see `resolve()` function above
- `opt.dimension` **[object][135]?**
- dimension, see `resolve()` function above
Returns **[string][133]** #rrggbb(aa)?
### convert.colorToHsl(value, opt)
convert color to hsl
#### Parameters
- `value` **[string][133]** color value
- `opt` **[object][135]?** options (optional, default `{}`)
- `opt.customProperty` **[object][135]?**
- custom properties, see `resolve()` function above
- `opt.dimension` **[object][135]?**
- dimension, see `resolve()` function above
Returns **[Array][137]<[number][134]>** \[h, s, l, alpha]
### convert.colorToHwb(value, opt)
convert color to hwb
#### Parameters
- `value` **[string][133]** color value
- `opt` **[object][135]?** options (optional, default `{}`)
- `opt.customProperty` **[object][135]?**
- custom properties, see `resolve()` function above
- `opt.dimension` **[object][135]?**
- dimension, see `resolve()` function above
Returns **[Array][137]<[number][134]>** \[h, w, b, alpha]
### convert.colorToLab(value, opt)
convert color to lab
#### Parameters
- `value` **[string][133]** color value
- `opt` **[object][135]?** options (optional, default `{}`)
- `opt.customProperty` **[object][135]?**
- custom properties, see `resolve()` function above
- `opt.dimension` **[object][135]?**
- dimension, see `resolve()` function above
Returns **[Array][137]<[number][134]>** \[l, a, b, alpha]
### convert.colorToLch(value, opt)
convert color to lch
#### Parameters
- `value` **[string][133]** color value
- `opt` **[object][135]?** options (optional, default `{}`)
- `opt.customProperty` **[object][135]?**
- custom properties, see `resolve()` function above
- `opt.dimension` **[object][135]?**
- dimension, see `resolve()` function above
Returns **[Array][137]<[number][134]>** \[l, c, h, alpha]
### convert.colorToOklab(value, opt)
convert color to oklab
#### Parameters
- `value` **[string][133]** color value
- `opt` **[object][135]?** options (optional, default `{}`)
- `opt.customProperty` **[object][135]?**
- custom properties, see `resolve()` function above
- `opt.dimension` **[object][135]?**
- dimension, see `resolve()` function above
Returns **[Array][137]<[number][134]>** \[l, a, b, alpha]
### convert.colorToOklch(value, opt)
convert color to oklch
#### Parameters
- `value` **[string][133]** color value
- `opt` **[object][135]?** options (optional, default `{}`)
- `opt.customProperty` **[object][135]?**
- custom properties, see `resolve()` function above
- `opt.dimension` **[object][135]?**
- dimension, see `resolve()` function above
Returns **[Array][137]<[number][134]>** \[l, c, h, alpha]
### convert.colorToRgb(value, opt)
convert color to rgb
#### Parameters
- `value` **[string][133]** color value
- `opt` **[object][135]?** options (optional, default `{}`)
- `opt.customProperty` **[object][135]?**
- custom properties, see `resolve()` function above
- `opt.dimension` **[object][135]?**
- dimension, see `resolve()` function above
Returns **[Array][137]<[number][134]>** \[r, g, b, alpha]
### convert.colorToXyz(value, opt)
convert color to xyz
#### Parameters
- `value` **[string][133]** color value
- `opt` **[object][135]?** options (optional, default `{}`)
- `opt.customProperty` **[object][135]?**
- custom properties, see `resolve()` function above
- `opt.dimension` **[object][135]?**
- dimension, see `resolve()` function above
- `opt.d50` **[boolean][136]?** xyz in d50 white point
Returns **[Array][137]<[number][134]>** \[x, y, z, alpha]
### convert.colorToXyzD50(value, opt)
convert color to xyz-d50
#### Parameters
- `value` **[string][133]** color value
- `opt` **[object][135]?** options (optional, default `{}`)
- `opt.customProperty` **[object][135]?**
- custom properties, see `resolve()` function above
- `opt.dimension` **[object][135]?**
- dimension, see `resolve()` function above
Returns **[Array][137]<[number][134]>** \[x, y, z, alpha]
### utils
Contains utility functions.
### utils.isColor(color)
is valid color type
#### Parameters
- `color` **[string][133]** color value
- system colors are not supported
Returns **[boolean][136]**
## Acknowledgments
The following resources have been of great help in the development of the CSS color.
- [csstools/postcss-plugins](https://github.com/csstools/postcss-plugins)
- [lru-cache](https://github.com/isaacs/node-lru-cache)
---
Copyright (c) 2024 [asamuzaK (Kazz)](https://github.com/asamuzaK/)
[133]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String
[134]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number
[135]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object
[136]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean
[137]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array
[138]: https://w3c.github.io/csswg-drafts/css-color-4/#color-conversion-code
[139]: https://developer.mozilla.org/en-US/docs/Web/CSS/computed_value
[140]: https://developer.mozilla.org/en-US/docs/Web/CSS/specified_value
[141]: https://www.npmjs.com/package/@csstools/css-calc

20
node_modules/@asamuzakjp/css-color/dist/esm/index.d.ts generated vendored Normal file
View File

@@ -0,0 +1,20 @@
/*!
* CSS color - Resolve, parse, convert CSS color.
* @license MIT
* @copyright asamuzaK (Kazz)
* @see {@link https://github.com/asamuzaK/cssColor/blob/main/LICENSE}
*/
export { convert } from './js/convert.js';
export { resolve } from './js/resolve.js';
export declare const utils: {
cssCalc: (value: string, opt?: import('./js/typedef.js').Options) => string;
cssVar: (value: string, opt?: import('./js/typedef.js').Options) => string;
extractDashedIdent: (value: string) => string[];
isAbsoluteFontSize: (css: unknown) => boolean;
isAbsoluteSizeOrLength: (value: number | string, unit: string | undefined) => boolean;
isColor: (value: unknown, opt?: import('./js/typedef.js').Options) => boolean;
isGradient: (value: string, opt?: import('./js/typedef.js').Options) => boolean;
resolveGradient: (value: string, opt?: import('./js/typedef.js').Options) => string;
resolveLengthInPixels: (value: number | string, unit: string | undefined, opt?: import('./js/typedef.js').Options) => number;
splitValue: (value: string, opt?: import('./js/typedef.js').Options) => string[];
};

29
node_modules/@asamuzakjp/css-color/dist/esm/index.js generated vendored Normal file
View File

@@ -0,0 +1,29 @@
import { resolve } from "./js/resolve.js";
import { extractDashedIdent, isAbsoluteFontSize, isAbsoluteSizeOrLength, isColor, resolveLengthInPixels, splitValue } from "./js/util.js";
import { cssVar } from "./js/css-var.js";
import { cssCalc } from "./js/css-calc.js";
import { isGradient, resolveGradient } from "./js/css-gradient.js";
import { convert } from "./js/convert.js";
//#region src/index.ts
/*!
* CSS color - Resolve, parse, convert CSS color.
* @license MIT
* @copyright asamuzaK (Kazz)
* @see {@link https://github.com/asamuzaK/cssColor/blob/main/LICENSE}
*/
var utils = {
cssCalc,
cssVar,
extractDashedIdent,
isAbsoluteFontSize,
isAbsoluteSizeOrLength,
isColor,
isGradient,
resolveGradient,
resolveLengthInPixels,
splitValue
};
//#endregion
export { convert, resolve, utils };
//# sourceMappingURL=index.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.js","names":[],"sources":["../../src/index.ts"],"sourcesContent":["/*!\n * CSS color - Resolve, parse, convert CSS color.\n * @license MIT\n * @copyright asamuzaK (Kazz)\n * @see {@link https://github.com/asamuzaK/cssColor/blob/main/LICENSE}\n */\n\nimport { cssCalc } from './js/css-calc';\nimport { isGradient, resolveGradient } from './js/css-gradient';\nimport { cssVar } from './js/css-var';\nimport {\n extractDashedIdent,\n isAbsoluteFontSize,\n isAbsoluteSizeOrLength,\n isColor,\n resolveLengthInPixels,\n splitValue\n} from './js/util';\n\nexport { convert } from './js/convert';\nexport { resolve } from './js/resolve';\n/* utils */\nexport const utils = {\n cssCalc,\n cssVar,\n extractDashedIdent,\n isAbsoluteFontSize,\n isAbsoluteSizeOrLength,\n isColor,\n isGradient,\n resolveGradient,\n resolveLengthInPixels,\n splitValue\n};\n"],"mappings":";;;;;;;;;;;;;AAsBA,IAAa,QAAQ;CACnB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD"}

View File

@@ -0,0 +1,38 @@
import { GenerationalCache } from '@asamuzakjp/generational-cache';
import { Options } from './typedef.js';
/**
* CacheItem
*/
export declare class CacheItem {
#private;
constructor(item: unknown, isNull?: boolean);
get item(): unknown;
get isNull(): boolean;
}
/**
* NullObject
*/
export declare class NullObject extends CacheItem {
constructor();
}
export declare const genCache: GenerationalCache<string, CacheItem>;
/**
* set cache
* @param key - cache key
* @param value - value to cache
* @returns void
*/
export declare const setCache: (key: string, value: unknown) => void;
/**
* get cache
* @param key - cache key
* @returns cached item or false otherwise
*/
export declare const getCache: (key: string) => CacheItem | false;
/**
* create cache key
* @param keyData - key data
* @param [opt] - options
* @returns cache key
*/
export declare const createCacheKey: (keyData: Record<string, string>, opt?: Options) => string;

View File

@@ -0,0 +1,90 @@
import { GenerationalCache } from "@asamuzakjp/generational-cache";
//#region src/js/cache.ts
/**
* cache
*/
var CACHE_SIZE = 2048;
/**
* CacheItem
*/
var CacheItem = class {
#isNull;
#item;
constructor(item, isNull = false) {
this.#item = item;
this.#isNull = !!isNull;
}
get item() {
return this.#item;
}
get isNull() {
return this.#isNull;
}
};
/**
* NullObject
*/
var NullObject = class extends CacheItem {
constructor() {
super(Symbol("null"), true);
}
};
var genCache = new GenerationalCache(CACHE_SIZE);
/**
* shared null object
*/
var sharedNullObject = new NullObject();
/**
* set cache
* @param key - cache key
* @param value - value to cache
* @returns void
*/
var setCache = (key, value) => {
if (!key) return;
if (value === null) genCache.set(key, sharedNullObject);
else if (value instanceof CacheItem) genCache.set(key, value);
else genCache.set(key, new CacheItem(value));
};
/**
* get cache
* @param key - cache key
* @returns cached item or false otherwise
*/
var getCache = (key) => {
if (!key) return false;
const item = genCache.get(key);
if (item !== void 0) return item;
return false;
};
/**
* helper function to sort object keys alphabetically
* @param obj - Object
* @returns stringified JSON
*/
var stringifySorted = (obj) => {
const keys = Object.keys(obj);
if (keys.length === 0) return "";
keys.sort();
let result = "";
for (const key of keys) result += `${key}:${JSON.stringify(obj[key])};`;
return result;
};
/**
* create cache key
* @param keyData - key data
* @param [opt] - options
* @returns cache key
*/
var createCacheKey = (keyData, opt = {}) => {
if (!keyData || opt.customProperty && typeof opt.customProperty.callback === "function" || opt.dimension && typeof opt.dimension.callback === "function") return "";
const namespace = keyData.namespace || "";
const name = keyData.name || "";
const value = keyData.value || "";
if (!namespace && !name && !value) return "";
return `${`${namespace}:${name}:${value}`}::${`${opt.format || ""}|${opt.colorSpace || ""}|${opt.colorScheme || ""}|${opt.currentColor || ""}|${opt.d50 ? "1" : "0"}|${opt.nullable ? "1" : "0"}|${opt.preserveComment ? "1" : "0"}|${opt.delimiter || ""}`}::${opt.customProperty ? stringifySorted(opt.customProperty) : ""}::${opt.dimension ? stringifySorted(opt.dimension) : ""}`;
};
//#endregion
export { CacheItem, NullObject, createCacheKey, getCache, setCache };
//# sourceMappingURL=cache.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"cache.js","names":["#item","#isNull"],"sources":["../../../src/js/cache.ts"],"sourcesContent":["/**\n * cache\n */\n\nimport { GenerationalCache } from '@asamuzakjp/generational-cache';\nimport { Options } from './typedef';\n\n/* constants */\nconst CACHE_SIZE = 2048;\n\n/**\n * CacheItem\n */\nexport class CacheItem {\n /* private */\n #isNull: boolean;\n #item: unknown;\n\n constructor(item: unknown, isNull: boolean = false) {\n this.#item = item;\n this.#isNull = !!isNull;\n }\n\n get item() {\n return this.#item;\n }\n\n get isNull() {\n return this.#isNull;\n }\n}\n\n/**\n * NullObject\n */\nexport class NullObject extends CacheItem {\n constructor() {\n super(Symbol('null'), true);\n }\n}\n\n/*\n * generational cache instance\n */\nexport const genCache = new GenerationalCache<string, CacheItem>(CACHE_SIZE);\n\n/**\n * shared null object\n */\nconst sharedNullObject = new NullObject();\n\n/**\n * set cache\n * @param key - cache key\n * @param value - value to cache\n * @returns void\n */\nexport const setCache = (key: string, value: unknown): void => {\n if (!key) {\n return;\n }\n if (value === null) {\n genCache.set(key, sharedNullObject);\n } else if (value instanceof CacheItem) {\n genCache.set(key, value);\n } else {\n genCache.set(key, new CacheItem(value));\n }\n};\n\n/**\n * get cache\n * @param key - cache key\n * @returns cached item or false otherwise\n */\nexport const getCache = (key: string): CacheItem | false => {\n if (!key) {\n return false;\n }\n const item = genCache.get(key);\n if (item !== undefined) {\n return item as CacheItem;\n }\n return false;\n};\n\n/**\n * helper function to sort object keys alphabetically\n * @param obj - Object\n * @returns stringified JSON\n */\nconst stringifySorted = (obj: Record<string, unknown>): string => {\n const keys = Object.keys(obj);\n if (keys.length === 0) {\n return '';\n }\n keys.sort();\n let result = '';\n for (const key of keys) {\n result += `${key}:${JSON.stringify(obj[key])};`;\n }\n return result;\n};\n\n/**\n * create cache key\n * @param keyData - key data\n * @param [opt] - options\n * @returns cache key\n */\nexport const createCacheKey = (\n keyData: Record<string, string>,\n opt: Options = {}\n): string => {\n if (\n !keyData ||\n (opt.customProperty && typeof opt.customProperty.callback === 'function') ||\n (opt.dimension && typeof opt.dimension.callback === 'function')\n ) {\n return '';\n }\n const namespace = keyData.namespace || '';\n const name = keyData.name || '';\n const value = keyData.value || '';\n if (!namespace && !name && !value) {\n return '';\n }\n const baseKey = `${namespace}:${name}:${value}`;\n const optStr = `${opt.format || ''}|${opt.colorSpace || ''}|${opt.colorScheme || ''}|${opt.currentColor || ''}|${opt.d50 ? '1' : '0'}|${opt.nullable ? '1' : '0'}|${opt.preserveComment ? '1' : '0'}|${opt.delimiter || ''}`;\n const customPropStr = opt.customProperty\n ? stringifySorted(opt.customProperty as Record<string, unknown>)\n : '';\n const dimStr = opt.dimension\n ? stringifySorted(opt.dimension as Record<string, unknown>)\n : '';\n return `${baseKey}::${optStr}::${customPropStr}::${dimStr}`;\n};\n"],"mappings":";;;;;AAQA,IAAM,aAAa;;;;AAKnB,IAAa,YAAb,MAAuB;CAErB;CACA;CAEA,YAAY,MAAe,SAAkB,OAAO;AAClD,QAAA,OAAa;AACb,QAAA,SAAe,CAAC,CAAC;;CAGnB,IAAI,OAAO;AACT,SAAO,MAAA;;CAGT,IAAI,SAAS;AACX,SAAO,MAAA;;;;;;AAOX,IAAa,aAAb,cAAgC,UAAU;CACxC,cAAc;AACZ,QAAM,OAAO,OAAO,EAAE,KAAK;;;AAO/B,IAAa,WAAW,IAAI,kBAAqC,WAAW;;;;AAK5E,IAAM,mBAAmB,IAAI,YAAY;;;;;;;AAQzC,IAAa,YAAY,KAAa,UAAyB;AAC7D,KAAI,CAAC,IACH;AAEF,KAAI,UAAU,KACZ,UAAS,IAAI,KAAK,iBAAiB;UAC1B,iBAAiB,UAC1B,UAAS,IAAI,KAAK,MAAM;KAExB,UAAS,IAAI,KAAK,IAAI,UAAU,MAAM,CAAC;;;;;;;AAS3C,IAAa,YAAY,QAAmC;AAC1D,KAAI,CAAC,IACH,QAAO;CAET,MAAM,OAAO,SAAS,IAAI,IAAI;AAC9B,KAAI,SAAS,KAAA,EACX,QAAO;AAET,QAAO;;;;;;;AAQT,IAAM,mBAAmB,QAAyC;CAChE,MAAM,OAAO,OAAO,KAAK,IAAI;AAC7B,KAAI,KAAK,WAAW,EAClB,QAAO;AAET,MAAK,MAAM;CACX,IAAI,SAAS;AACb,MAAK,MAAM,OAAO,KAChB,WAAU,GAAG,IAAI,GAAG,KAAK,UAAU,IAAI,KAAK,CAAC;AAE/C,QAAO;;;;;;;;AAST,IAAa,kBACX,SACA,MAAe,EAAE,KACN;AACX,KACE,CAAC,WACA,IAAI,kBAAkB,OAAO,IAAI,eAAe,aAAa,cAC7D,IAAI,aAAa,OAAO,IAAI,UAAU,aAAa,WAEpD,QAAO;CAET,MAAM,YAAY,QAAQ,aAAa;CACvC,MAAM,OAAO,QAAQ,QAAQ;CAC7B,MAAM,QAAQ,QAAQ,SAAS;AAC/B,KAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,MAC1B,QAAO;AAUT,QAAO,GARS,GAAG,UAAU,GAAG,KAAK,GAAG,QAQtB,IAPH,GAAG,IAAI,UAAU,GAAG,GAAG,IAAI,cAAc,GAAG,GAAG,IAAI,eAAe,GAAG,GAAG,IAAI,gBAAgB,GAAG,GAAG,IAAI,MAAM,MAAM,IAAI,GAAG,IAAI,WAAW,MAAM,IAAI,GAAG,IAAI,kBAAkB,MAAM,IAAI,GAAG,IAAI,aAAa,KAO3L,IANP,IAAI,iBACtB,gBAAgB,IAAI,eAA0C,GAC9D,GAI2C,IAHhC,IAAI,YACf,gBAAgB,IAAI,UAAqC,GACzD"}

View File

@@ -0,0 +1,537 @@
import { NullObject } from './cache.js';
import { ColorChannels, Options, SpecifiedColorChannels } from './typedef.js';
/**
* @type TriColorChannels - color channels without alpha
*/
type TriColorChannels = [x: number, y: number, z: number];
/**
* @type ColorMatrix - color matrix
*/
type ColorMatrix = [
r1: TriColorChannels,
r2: TriColorChannels,
r3: TriColorChannels
];
/**
* named colors
*/
export declare const NAMED_COLORS: {
readonly aliceblue: [240, 248, 255];
readonly antiquewhite: [250, 235, 215];
readonly aqua: [0, 255, 255];
readonly aquamarine: [127, 255, 212];
readonly azure: [240, 255, 255];
readonly beige: [245, 245, 220];
readonly bisque: [255, 228, 196];
readonly black: [0, 0, 0];
readonly blanchedalmond: [255, 235, 205];
readonly blue: [0, 0, 255];
readonly blueviolet: [138, 43, 226];
readonly brown: [165, 42, 42];
readonly burlywood: [222, 184, 135];
readonly cadetblue: [95, 158, 160];
readonly chartreuse: [127, 255, 0];
readonly chocolate: [210, 105, 30];
readonly coral: [255, 127, 80];
readonly cornflowerblue: [100, 149, 237];
readonly cornsilk: [255, 248, 220];
readonly crimson: [220, 20, 60];
readonly cyan: [0, 255, 255];
readonly darkblue: [0, 0, 139];
readonly darkcyan: [0, 139, 139];
readonly darkgoldenrod: [184, 134, 11];
readonly darkgray: [169, 169, 169];
readonly darkgreen: [0, 100, 0];
readonly darkgrey: [169, 169, 169];
readonly darkkhaki: [189, 183, 107];
readonly darkmagenta: [139, 0, 139];
readonly darkolivegreen: [85, 107, 47];
readonly darkorange: [255, 140, 0];
readonly darkorchid: [153, 50, 204];
readonly darkred: [139, 0, 0];
readonly darksalmon: [233, 150, 122];
readonly darkseagreen: [143, 188, 143];
readonly darkslateblue: [72, 61, 139];
readonly darkslategray: [47, 79, 79];
readonly darkslategrey: [47, 79, 79];
readonly darkturquoise: [0, 206, 209];
readonly darkviolet: [148, 0, 211];
readonly deeppink: [255, 20, 147];
readonly deepskyblue: [0, 191, 255];
readonly dimgray: [105, 105, 105];
readonly dimgrey: [105, 105, 105];
readonly dodgerblue: [30, 144, 255];
readonly firebrick: [178, 34, 34];
readonly floralwhite: [255, 250, 240];
readonly forestgreen: [34, 139, 34];
readonly fuchsia: [255, 0, 255];
readonly gainsboro: [220, 220, 220];
readonly ghostwhite: [248, 248, 255];
readonly gold: [255, 215, 0];
readonly goldenrod: [218, 165, 32];
readonly gray: [128, 128, 128];
readonly green: [0, 128, 0];
readonly greenyellow: [173, 255, 47];
readonly grey: [128, 128, 128];
readonly honeydew: [240, 255, 240];
readonly hotpink: [255, 105, 180];
readonly indianred: [205, 92, 92];
readonly indigo: [75, 0, 130];
readonly ivory: [255, 255, 240];
readonly khaki: [240, 230, 140];
readonly lavender: [230, 230, 250];
readonly lavenderblush: [255, 240, 245];
readonly lawngreen: [124, 252, 0];
readonly lemonchiffon: [255, 250, 205];
readonly lightblue: [173, 216, 230];
readonly lightcoral: [240, 128, 128];
readonly lightcyan: [224, 255, 255];
readonly lightgoldenrodyellow: [250, 250, 210];
readonly lightgray: [211, 211, 211];
readonly lightgreen: [144, 238, 144];
readonly lightgrey: [211, 211, 211];
readonly lightpink: [255, 182, 193];
readonly lightsalmon: [255, 160, 122];
readonly lightseagreen: [32, 178, 170];
readonly lightskyblue: [135, 206, 250];
readonly lightslategray: [119, 136, 153];
readonly lightslategrey: [119, 136, 153];
readonly lightsteelblue: [176, 196, 222];
readonly lightyellow: [255, 255, 224];
readonly lime: [0, 255, 0];
readonly limegreen: [50, 205, 50];
readonly linen: [250, 240, 230];
readonly magenta: [255, 0, 255];
readonly maroon: [128, 0, 0];
readonly mediumaquamarine: [102, 205, 170];
readonly mediumblue: [0, 0, 205];
readonly mediumorchid: [186, 85, 211];
readonly mediumpurple: [147, 112, 219];
readonly mediumseagreen: [60, 179, 113];
readonly mediumslateblue: [123, 104, 238];
readonly mediumspringgreen: [0, 250, 154];
readonly mediumturquoise: [72, 209, 204];
readonly mediumvioletred: [199, 21, 133];
readonly midnightblue: [25, 25, 112];
readonly mintcream: [245, 255, 250];
readonly mistyrose: [255, 228, 225];
readonly moccasin: [255, 228, 181];
readonly navajowhite: [255, 222, 173];
readonly navy: [0, 0, 128];
readonly oldlace: [253, 245, 230];
readonly olive: [128, 128, 0];
readonly olivedrab: [107, 142, 35];
readonly orange: [255, 165, 0];
readonly orangered: [255, 69, 0];
readonly orchid: [218, 112, 214];
readonly palegoldenrod: [238, 232, 170];
readonly palegreen: [152, 251, 152];
readonly paleturquoise: [175, 238, 238];
readonly palevioletred: [219, 112, 147];
readonly papayawhip: [255, 239, 213];
readonly peachpuff: [255, 218, 185];
readonly peru: [205, 133, 63];
readonly pink: [255, 192, 203];
readonly plum: [221, 160, 221];
readonly powderblue: [176, 224, 230];
readonly purple: [128, 0, 128];
readonly rebeccapurple: [102, 51, 153];
readonly red: [255, 0, 0];
readonly rosybrown: [188, 143, 143];
readonly royalblue: [65, 105, 225];
readonly saddlebrown: [139, 69, 19];
readonly salmon: [250, 128, 114];
readonly sandybrown: [244, 164, 96];
readonly seagreen: [46, 139, 87];
readonly seashell: [255, 245, 238];
readonly sienna: [160, 82, 45];
readonly silver: [192, 192, 192];
readonly skyblue: [135, 206, 235];
readonly slateblue: [106, 90, 205];
readonly slategray: [112, 128, 144];
readonly slategrey: [112, 128, 144];
readonly snow: [255, 250, 250];
readonly springgreen: [0, 255, 127];
readonly steelblue: [70, 130, 180];
readonly tan: [210, 180, 140];
readonly teal: [0, 128, 128];
readonly thistle: [216, 191, 216];
readonly tomato: [255, 99, 71];
readonly turquoise: [64, 224, 208];
readonly violet: [238, 130, 238];
readonly wheat: [245, 222, 179];
readonly white: [255, 255, 255];
readonly whitesmoke: [245, 245, 245];
readonly yellow: [255, 255, 0];
readonly yellowgreen: [154, 205, 50];
};
/**
* cache invalid color value
* @param key - cache key
* @param nullable - is nullable
* @returns cached value
*/
export declare const cacheInvalidColorValue: (cacheKey: string, format: string, nullable?: boolean) => SpecifiedColorChannels | string | NullObject;
/**
* resolve invalid color value
* @param format - output format
* @param nullable - is nullable
* @returns resolved value
*/
export declare const resolveInvalidColorValue: (format: string, nullable?: boolean) => SpecifiedColorChannels | string | NullObject;
/**
* validate color components
* @param arr - color components
* @param [opt] - options
* @param [opt.alpha] - alpha channel
* @param [opt.minLength] - min length
* @param [opt.maxLength] - max length
* @param [opt.minRange] - min range
* @param [opt.maxRange] - max range
* @param [opt.validateRange] - validate range
* @returns result - validated color components
*/
export declare const validateColorComponents: (arr: ColorChannels | TriColorChannels, opt?: {
alpha?: boolean;
minLength?: number;
maxLength?: number;
minRange?: number;
maxRange?: number;
validateRange?: boolean;
}) => ColorChannels | TriColorChannels;
/**
* transform matrix
* @param mtx - 3 * 3 matrix
* @param vct - vector
* @param [skip] - skip validate
* @returns TriColorChannels - [p1, p2, p3]
*/
export declare const transformMatrix: (mtx: ColorMatrix, vct: TriColorChannels, skip?: boolean) => TriColorChannels;
/**
* normalize color components
* @param colorA - color components [v1, v2, v3, v4]
* @param colorB - color components [v1, v2, v3, v4]
* @param [skip] - skip validate
* @returns result - [colorA, colorB]
*/
export declare const normalizeColorComponents: (colorA: [number | string, number | string, number | string, number | string], colorB: [number | string, number | string, number | string, number | string], skip?: boolean) => [ColorChannels, ColorChannels];
/**
* number to hex string
* @param value - numeric value
* @returns hex string
*/
export declare const numberToHexString: (value: number) => string;
/**
* angle to deg
* @param angle
* @returns deg: 0..360
*/
export declare const angleToDeg: (angle: string) => number;
/**
* parse alpha
* @param [alpha] - alpha value
* @returns alpha: 0..1
*/
export declare const parseAlpha: (alpha?: string) => number;
/**
* parse hex alpha
* @param value - alpha value in hex string
* @returns alpha: 0..1
*/
export declare const parseHexAlpha: (value: string) => number;
/**
* transform rgb to linear rgb
* @param rgb - [r, g, b] r|g|b: 0..255
* @param [skip] - skip validate
* @returns TriColorChannels - [r, g, b] r|g|b: 0..1
*/
export declare const transformRgbToLinearRgb: (rgb: TriColorChannels, skip?: boolean) => TriColorChannels;
/**
* transform rgb to xyz
* @param rgb - [r, g, b] r|g|b: 0..255
* @param [skip] - skip validate
* @returns TriColorChannels - [x, y, z]
*/
export declare const transformRgbToXyz: (rgb: TriColorChannels, skip?: boolean) => TriColorChannels;
/**
* transform rgb to xyz-d50
* @param rgb - [r, g, b] r|g|b: 0..255 alpha: 0..1
* @returns TriColorChannels - [x, y, z]
*/
export declare const transformRgbToXyzD50: (rgb: TriColorChannels) => TriColorChannels;
/**
* transform linear rgb to rgb
* @param rgb - [r, g, b] r|g|b: 0..1
* @param [round] - round result
* @returns TriColorChannels - [r, g, b] r|g|b: 0..255
*/
export declare const transformLinearRgbToRgb: (rgb: TriColorChannels, round?: boolean) => TriColorChannels;
/**
* transform xyz to rgb
* @param xyz - [x, y, z]
* @param [skip] - skip validate
* @returns TriColorChannels - [r, g, b] r|g|b: 0..255
*/
export declare const transformXyzToRgb: (xyz: TriColorChannels, skip?: boolean) => TriColorChannels;
/**
* transform xyz to xyz-d50
* @param xyz - [x, y, z]
* @returns TriColorChannels - [x, y, z]
*/
export declare const transformXyzToXyzD50: (xyz: TriColorChannels) => TriColorChannels;
/**
* transform xyz to hsl
* @param xyz - [x, y, z]
* @param [skip] - skip validate
* @returns TriColorChannels - [h, s, l]
*/
export declare const transformXyzToHsl: (xyz: TriColorChannels, skip?: boolean) => TriColorChannels;
/**
* transform xyz to hwb
* @param xyz - [x, y, z]
* @param [skip] - skip validate
* @returns TriColorChannels - [h, w, b]
*/
export declare const transformXyzToHwb: (xyz: TriColorChannels, skip?: boolean) => TriColorChannels;
/**
* transform xyz to oklab
* @param xyz - [x, y, z]
* @param [skip] - skip validate
* @returns TriColorChannels - [l, a, b]
*/
export declare const transformXyzToOklab: (xyz: TriColorChannels, skip?: boolean) => TriColorChannels;
/**
* transform xyz to oklch
* @param xyz - [x, y, z]
* @param [skip] - skip validate
* @returns TriColorChannels - [l, c, h]
*/
export declare const transformXyzToOklch: (xyz: TriColorChannels, skip?: boolean) => TriColorChannels;
/**
* transform xyz D50 to rgb
* @param xyz - [x, y, z]
* @param [skip] - skip validate
* @returns TriColorChannels - [r, g, b] r|g|b: 0..255
*/
export declare const transformXyzD50ToRgb: (xyz: TriColorChannels, skip?: boolean) => TriColorChannels;
/**
* transform xyz-d50 to lab
* @param xyz - [x, y, z]
* @param [skip] - skip validate
* @returns TriColorChannels - [l, a, b]
*/
export declare const transformXyzD50ToLab: (xyz: TriColorChannels, skip?: boolean) => TriColorChannels;
/**
* transform xyz-d50 to lch
* @param xyz - [x, y, z]
* @param [skip] - skip validate
* @returns TriColorChannels - [l, c, h]
*/
export declare const transformXyzD50ToLch: (xyz: TriColorChannels, skip?: boolean) => TriColorChannels;
/**
* convert rgb to hex color
* @param rgb - [r, g, b, alpha] r|g|b: 0..255 alpha: 0..1
* @returns hex color
*/
export declare const convertRgbToHex: (rgb: ColorChannels) => string;
/**
* convert linear rgb to hex color
* @param rgb - [r, g, b, alpha] r|g|b|alpha: 0..1
* @param [skip] - skip validate
* @returns hex color
*/
export declare const convertLinearRgbToHex: (rgb: ColorChannels, skip?: boolean) => string;
/**
* convert xyz to hex color
* @param xyz - [x, y, z, alpha]
* @returns hex color
*/
export declare const convertXyzToHex: (xyz: ColorChannels) => string;
/**
* convert xyz D50 to hex color
* @param xyz - [x, y, z, alpha]
* @returns hex color
*/
export declare const convertXyzD50ToHex: (xyz: ColorChannels) => string;
/**
* convert hex color to rgb
* @param value - hex color value
* @returns ColorChannels - [r, g, b, alpha] r|g|b: 0..255 alpha: 0..1
*/
export declare const convertHexToRgb: (value: string) => ColorChannels;
/**
* convert hex color to linear rgb
* @param value - hex color value
* @returns ColorChannels - [r, g, b, alpha] r|g|b|alpha: 0..1
*/
export declare const convertHexToLinearRgb: (value: string) => ColorChannels;
/**
* convert hex color to xyz
* @param value - hex color value
* @returns ColorChannels - [x, y, z, alpha]
*/
export declare const convertHexToXyz: (value: string) => ColorChannels;
/**
* parse rgb()
* @param value - rgb color value
* @param [opt] - options
* @returns parsed color - ['rgb', r, g, b, alpha], '(empty)', NullObject
*/
export declare const parseRgb: (value: string, opt?: Options) => SpecifiedColorChannels | string | NullObject;
/**
* parse hsl()
* @param value - hsl color value
* @param [opt] - options
* @returns parsed color - ['rgb', r, g, b, alpha], '(empty)', NullObject
*/
export declare const parseHsl: (value: string, opt?: Options) => SpecifiedColorChannels | string | NullObject;
/**
* parse hwb()
* @param value - hwb color value
* @param [opt] - options
* @returns parsed color - ['rgb', r, g, b, alpha], '(empty)', NullObject
*/
export declare const parseHwb: (value: string, opt?: Options) => SpecifiedColorChannels | string | NullObject;
/**
* parse lab()
* @param value - lab color value
* @param [opt] - options
* @returns parsed color
* - [xyz-d50, x, y, z, alpha], ['lab', l, a, b, alpha], '(empty)', NullObject
*/
export declare const parseLab: (value: string, opt?: Options) => SpecifiedColorChannels | string | NullObject;
/**
* parse lch()
* @param value - lch color value
* @param [opt] - options
* @returns parsed color
* - ['xyz-d50', x, y, z, alpha], ['lch', l, c, h, alpha]
* - '(empty)', NullObject
*/
export declare const parseLch: (value: string, opt?: Options) => SpecifiedColorChannels | string | NullObject;
/**
* parse oklab()
* @param value - oklab color value
* @param [opt] - options
* @returns parsed color
* - ['xyz-d65', x, y, z, alpha], ['oklab', l, a, b, alpha]
* - '(empty)', NullObject
*/
export declare const parseOklab: (value: string, opt?: Options) => SpecifiedColorChannels | string | NullObject;
/**
* parse oklch()
* @param value - oklch color value
* @param [opt] - options
* @returns parsed color
* - ['xyz-d65', x, y, z, alpha], ['oklch', l, c, h, alpha]
* - '(empty)', NullObject
*/
export declare const parseOklch: (value: string, opt?: Options) => SpecifiedColorChannels | string | NullObject;
/**
* parse color()
* @param value - color function value
* @param [opt] - options
* @returns parsed color
* - ['xyz-(d50|d65)', x, y, z, alpha], [cs, r, g, b, alpha]
* - '(empty)', NullObject
*/
export declare const parseColorFunc: (value: string, opt?: Options) => SpecifiedColorChannels | string | NullObject;
/**
* parse color value
* @param value - CSS color value
* @param [opt] - options
* @returns parsed color
* - ['xyz-(d50|d65)', x, y, z, alpha], ['rgb', r, g, b, alpha]
* - value, '(empty)', NullObject
*/
export declare const parseColorValue: (value: string, opt?: Options) => SpecifiedColorChannels | string | NullObject;
/**
* resolve color value
* @param value - CSS color value
* @param [opt] - options
* @returns resolved color
* - [cs, v1, v2, v3, alpha], value, '(empty)', NullObject
*/
export declare const resolveColorValue: (value: string, opt?: Options) => SpecifiedColorChannels | string | NullObject;
/**
* resolve color()
* @param value - color function value
* @param [opt] - options
* @returns resolved color - [cs, v1, v2, v3, alpha], '(empty)', NullObject
*/
export declare const resolveColorFunc: (value: string, opt?: Options) => SpecifiedColorChannels | string | NullObject;
/**
* convert color value to linear rgb
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels | NullObject - [r, g, b, alpha] r|g|b|alpha: 0..1
*/
export declare const convertColorToLinearRgb: (value: string, opt?: {
colorSpace?: string;
format?: string;
}) => ColorChannels | NullObject;
/**
* convert color value to rgb
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels | NullObject
* - [r, g, b, alpha] r|g|b: 0..255 alpha: 0..1
*/
export declare const convertColorToRgb: (value: string, opt?: Options) => ColorChannels | NullObject;
/**
* convert color value to xyz
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels | NullObject - [x, y, z, alpha]
*/
export declare const convertColorToXyz: (value: string, opt?: Options) => ColorChannels | NullObject;
/**
* convert color value to hsl
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels | NullObject - [h, s, l, alpha], hue may be powerless
*/
export declare const convertColorToHsl: (value: string, opt?: Options) => ColorChannels | [number | string, number, number, number] | NullObject;
/**
* convert color value to hwb
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels | NullObject - [h, w, b, alpha], hue may be powerless
*/
export declare const convertColorToHwb: (value: string, opt?: Options) => ColorChannels | [number | string, number, number, number] | NullObject;
/**
* convert color value to lab
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels | NullObject - [l, a, b, alpha]
*/
export declare const convertColorToLab: (value: string, opt?: Options) => ColorChannels | NullObject;
/**
* convert color value to lch
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels | NullObject - [l, c, h, alpha], hue may be powerless
*/
export declare const convertColorToLch: (value: string, opt?: Options) => ColorChannels | [number, number, number | string, number] | NullObject;
/**
* convert color value to oklab
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels | NullObject - [l, a, b, alpha]
*/
export declare const convertColorToOklab: (value: string, opt?: Options) => ColorChannels | NullObject;
/**
* convert color value to oklch
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels | NullObject - [l, c, h, alpha], hue may be powerless
*/
export declare const convertColorToOklch: (value: string, opt?: Options) => ColorChannels | [number, number, number | string, number] | NullObject;
/**
* resolve color-mix()
* @param value - color-mix color value
* @param [opt] - options
* @returns resolved color - [cs, v1, v2, v3, alpha], '(empty)'
*/
export declare const resolveColorMix: (value: string, opt?: Options) => SpecifiedColorChannels | string | NullObject;
export {};

3534
node_modules/@asamuzakjp/css-color/dist/esm/js/color.js generated vendored Normal file

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,21 @@
/**
* common
*/
/**
* get type
* @param o - object to check
* @returns type of object
*/
export declare const getType: (o: unknown) => string;
/**
* is string
* @param o - object to check
* @returns result
*/
export declare const isString: (o: unknown) => o is string;
/**
* is string or number
* @param o - object to check
* @returns result
*/
export declare const isStringOrNumber: (o: unknown) => boolean;

View File

@@ -0,0 +1,17 @@
//#region src/js/common.ts
/**
* is string
* @param o - object to check
* @returns result
*/
var isString = (o) => typeof o === "string" || o instanceof String;
/**
* is string or number
* @param o - object to check
* @returns result
*/
var isStringOrNumber = (o) => isString(o) || typeof o === "number";
//#endregion
export { isString, isStringOrNumber };
//# sourceMappingURL=common.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"common.js","names":[],"sources":["../../../src/js/common.ts"],"sourcesContent":["/**\n * common\n */\n\n/* numeric constants */\nconst TYPE_FROM = 8;\nconst TYPE_TO = -1;\n\n/**\n * get type\n * @param o - object to check\n * @returns type of object\n */\nexport const getType = (o: unknown): string =>\n Object.prototype.toString.call(o).slice(TYPE_FROM, TYPE_TO);\n\n/**\n * is string\n * @param o - object to check\n * @returns result\n */\nexport const isString = (o: unknown): o is string =>\n typeof o === 'string' || o instanceof String;\n\n/**\n * is string or number\n * @param o - object to check\n * @returns result\n */\nexport const isStringOrNumber = (o: unknown): boolean =>\n isString(o) || typeof o === 'number';\n"],"mappings":";;;;;;AAqBA,IAAa,YAAY,MACvB,OAAO,MAAM,YAAY,aAAa;;;;;;AAOxC,IAAa,oBAAoB,MAC/B,SAAS,EAAE,IAAI,OAAO,MAAM"}

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,60 @@
//#region src/js/constant.ts
/**
* constant
*/
var _DIGIT = "(?:0|[1-9]\\d*)";
var _MATH = `clamp|max|min|exp|hypot|log|pow|sqrt|abs|sign|mod|rem|round|a?(?:cos|sin|tan)|atan2`;
var _CALC = `calc|${_MATH}`;
var _VAR = `var|${_CALC}`;
var ANGLE = "deg|g?rad|turn";
var LENGTH = "[cm]m|[dls]?v(?:[bhiw]|max|min)|in|p[ctx]|q|r?(?:[cl]h|cap|e[mx]|ic)";
var NUM = `[+-]?(?:${_DIGIT}(?:\\.\\d*)?|\\.\\d+)(?:e-?${_DIGIT})?`;
var NUM_POSITIVE = `\\+?(?:${_DIGIT}(?:\\.\\d*)?|\\.\\d+)(?:e-?${_DIGIT})?`;
var NONE = "none";
var PCT = `${NUM}%`;
var SYN_FN_CALC = `^(?:${_CALC})\\(|(?<=[*\\/\\s\\(])(?:${_CALC})\\(`;
var SYN_FN_MATH_START = `^(?:${_MATH})\\($`;
var SYN_FN_VAR = "^var\\(|(?<=[*\\/\\s\\(])var\\(";
var SYN_FN_VAR_START = `^(?:${_VAR})\\(`;
var _ALPHA = `(?:\\s*\\/\\s*(?:${NUM}|${PCT}|${NONE}))?`;
var _ALPHA_LV3 = `(?:\\s*,\\s*(?:${NUM}|${PCT}))?`;
var _COLOR_FUNC = "(?:ok)?l(?:ab|ch)|color|hsla?|hwb|rgba?";
var _COLOR_KEY = "[a-z]+|#[\\da-f]{3}|#[\\da-f]{4}|#[\\da-f]{6}|#[\\da-f]{8}";
var _CS_HUE = "(?:ok)?lch|hsl|hwb";
var _CS_HUE_ARC = "(?:de|in)creasing|longer|shorter";
var _NUM_ANGLE = `${NUM}(?:${ANGLE})?`;
var _NUM_ANGLE_NONE = `(?:${NUM}(?:${ANGLE})?|${NONE})`;
var _NUM_PCT_NONE = `(?:${NUM}|${PCT}|${NONE})`;
var CS_HUE = `(?:${_CS_HUE})(?:\\s(?:${_CS_HUE_ARC})\\shue)?`;
var CS_HUE_CAPT = `(${_CS_HUE})(?:\\s(${_CS_HUE_ARC})\\shue)?`;
var CS_LAB = "(?:ok)?lab";
var CS_LCH = "(?:ok)?lch";
var CS_RGB = `(?:a98|prophoto)-rgb|display-p3|rec2020|srgb(?:-linear)?`;
var CS_XYZ = "xyz(?:-d(?:50|65))?";
var CS_RECT = `${CS_LAB}|${CS_RGB}|${CS_XYZ}`;
var CS_MIX = `${CS_HUE}|${CS_RECT}`;
var FN_COLOR = "color(";
var FN_LIGHT_DARK = "light-dark(";
var FN_MIX = "color-mix(";
var FN_REL = `(?:${_COLOR_FUNC})\\(\\s*from\\s+`;
var FN_REL_CAPT = `(${_COLOR_FUNC})\\(\\s*from\\s+`;
var FN_VAR = "var(";
var SYN_FN_COLOR = `(?:${CS_RGB}|${CS_XYZ})(?:\\s+${_NUM_PCT_NONE}){3}${_ALPHA}`;
var SYN_FN_LIGHT_DARK = "^light-dark\\(";
var SYN_FN_REL = `^${FN_REL}|(?<=[\\s])${FN_REL}`;
var SYN_HSL = `${_NUM_ANGLE_NONE}(?:\\s+${_NUM_PCT_NONE}){2}${_ALPHA}`;
var SYN_HSL_LV3 = `${_NUM_ANGLE}(?:\\s*,\\s*${PCT}){2}${_ALPHA_LV3}`;
var SYN_LCH = `(?:${_NUM_PCT_NONE}\\s+){2}${_NUM_ANGLE_NONE}${_ALPHA}`;
var SYN_MOD = `${_NUM_PCT_NONE}(?:\\s+${_NUM_PCT_NONE}){2}${_ALPHA}`;
var SYN_RGB_LV3 = `(?:${NUM}(?:\\s*,\\s*${NUM}){2}|${PCT}(?:\\s*,\\s*${PCT}){2})${_ALPHA_LV3}`;
var SYN_COLOR_TYPE = `${_COLOR_KEY}|hsla?\\(\\s*${SYN_HSL_LV3}\\s*\\)|rgba?\\(\\s*${SYN_RGB_LV3}\\s*\\)|(?:hsla?|hwb)\\(\\s*${SYN_HSL}\\s*\\)|(?:(?:ok)?lab|rgba?)\\(\\s*${SYN_MOD}\\s*\\)|(?:ok)?lch\\(\\s*${SYN_LCH}\\s*\\)|color\\(\\s*${SYN_FN_COLOR}\\s*\\)`;
var SYN_MIX_PART = `(?:${SYN_COLOR_TYPE})(?:\\s+${PCT})?`;
var SYN_MIX = `color-mix\\(\\s*in\\s+(?:${CS_MIX})\\s*,\\s*${SYN_MIX_PART}\\s*,\\s*${SYN_MIX_PART}\\s*\\)`;
var SYN_MIX_CAPT = `color-mix\\(\\s*in\\s+(${CS_MIX})\\s*,\\s*(${SYN_MIX_PART})\\s*,\\s*(${SYN_MIX_PART})\\s*\\)`;
var VAL_COMP = "computedValue";
var VAL_MIX = "mixValue";
var VAL_SPEC = "specifiedValue";
//#endregion
export { ANGLE, CS_HUE, CS_HUE_CAPT, CS_LAB, CS_LCH, CS_MIX, CS_RECT, CS_RGB, CS_XYZ, FN_COLOR, FN_LIGHT_DARK, FN_MIX, FN_REL, FN_REL_CAPT, FN_VAR, LENGTH, NONE, NUM, NUM_POSITIVE, PCT, SYN_COLOR_TYPE, SYN_FN_CALC, SYN_FN_COLOR, SYN_FN_LIGHT_DARK, SYN_FN_MATH_START, SYN_FN_REL, SYN_FN_VAR, SYN_FN_VAR_START, SYN_HSL, SYN_HSL_LV3, SYN_LCH, SYN_MIX, SYN_MIX_CAPT, SYN_MIX_PART, SYN_MOD, SYN_RGB_LV3, VAL_COMP, VAL_MIX, VAL_SPEC };
//# sourceMappingURL=constant.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,99 @@
import { NullObject } from './cache.js';
import { ColorChannels, Options } from './typedef.js';
/**
* pre process
* @param value - CSS color value
* @param [opt] - options
* @returns value
*/
export declare const preProcess: (value: string, opt?: Options) => string | NullObject;
/**
* convert number to hex string
* @param value - numeric value
* @returns hex string: 00..ff
*/
export declare const numberToHex: (value: number) => string;
/**
* convert color to hex
* @param value - CSS color value
* @param [opt] - options
* @param [opt.alpha] - enable alpha channel
* @returns #rrggbb | #rrggbbaa | null
*/
export declare const colorToHex: (value: string, opt?: Options) => string | null;
/**
* convert color to hsl
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [h, s, l, alpha]
*/
export declare const colorToHsl: (value: string, opt?: Options) => ColorChannels;
/**
* convert color to hwb
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [h, w, b, alpha]
*/
export declare const colorToHwb: (value: string, opt?: Options) => ColorChannels;
/**
* convert color to lab
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [l, a, b, alpha]
*/
export declare const colorToLab: (value: string, opt?: Options) => ColorChannels;
/**
* convert color to lch
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [l, c, h, alpha]
*/
export declare const colorToLch: (value: string, opt?: Options) => ColorChannels;
/**
* convert color to oklab
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [l, a, b, alpha]
*/
export declare const colorToOklab: (value: string, opt?: Options) => ColorChannels;
/**
* convert color to oklch
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [l, c, h, alpha]
*/
export declare const colorToOklch: (value: string, opt?: Options) => ColorChannels;
/**
* convert color to rgb
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [r, g, b, alpha]
*/
export declare const colorToRgb: (value: string, opt?: Options) => ColorChannels;
/**
* convert color to xyz
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [x, y, z, alpha]
*/
export declare const colorToXyz: (value: string, opt?: Options) => ColorChannels;
/**
* convert color to xyz-d50
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [x, y, z, alpha]
*/
export declare const colorToXyzD50: (value: string, opt?: Options) => ColorChannels;
export declare const convert: {
colorToHex: (value: string, opt?: Options) => string | null;
colorToHsl: (value: string, opt?: Options) => ColorChannels;
colorToHwb: (value: string, opt?: Options) => ColorChannels;
colorToLab: (value: string, opt?: Options) => ColorChannels;
colorToLch: (value: string, opt?: Options) => ColorChannels;
colorToOklab: (value: string, opt?: Options) => ColorChannels;
colorToOklch: (value: string, opt?: Options) => ColorChannels;
colorToRgb: (value: string, opt?: Options) => ColorChannels;
colorToXyz: (value: string, opt?: Options) => ColorChannels;
colorToXyzD50: (value: string, opt?: Options) => ColorChannels;
numberToHex: (value: number) => string;
};

View File

@@ -0,0 +1,245 @@
import { CacheItem, NullObject, createCacheKey, getCache, setCache } from "./cache.js";
import { isString } from "./common.js";
import { SYN_FN_CALC, SYN_FN_REL, SYN_FN_VAR, VAL_COMP } from "./constant.js";
import { convertColorToHsl, convertColorToHwb, convertColorToLab, convertColorToLch, convertColorToOklab, convertColorToOklch, convertColorToRgb, numberToHexString, parseColorFunc, parseColorValue } from "./color.js";
import { resolveRelativeColor } from "./relative-color.js";
import { resolveColor } from "./resolve.js";
import { resolveVar } from "./css-var.js";
import { cssCalc } from "./css-calc.js";
//#region src/js/convert.ts
/**
* convert
*/
var NAMESPACE = "convert";
var REG_FN_CALC = new RegExp(SYN_FN_CALC);
var REG_FN_REL = new RegExp(SYN_FN_REL);
var REG_FN_VAR = new RegExp(SYN_FN_VAR);
/**
* pre process
* @param value - CSS color value
* @param [opt] - options
* @returns value
*/
var preProcess = (value, opt = {}) => {
if (!isString(value)) return new NullObject();
value = value.trim();
if (!value) return new NullObject();
const cacheKey = createCacheKey({
namespace: NAMESPACE,
name: "preProcess",
value
}, opt);
const cachedResult = getCache(cacheKey);
if (cachedResult instanceof CacheItem) {
if (cachedResult.isNull) return cachedResult;
return cachedResult.item;
}
let res = value;
if (REG_FN_VAR.test(value)) {
const resolved = resolveVar(value, opt);
if (isString(resolved)) res = resolved;
else {
setCache(cacheKey, null);
return new NullObject();
}
}
if (isString(res)) {
if (REG_FN_REL.test(res)) {
const resolved = resolveRelativeColor(res, opt);
if (isString(resolved)) res = resolved;
else {
setCache(cacheKey, null);
return new NullObject();
}
} else if (REG_FN_CALC.test(res)) res = cssCalc(res, opt);
}
if (isString(res)) {
if (res.startsWith("color-mix")) res = resolveColor(res, {
...opt,
format: VAL_COMP,
nullable: true
});
}
setCache(cacheKey, res);
return res;
};
/**
* converter factory to reduce boilerplate
* @param name - function name for cache
* @param format - color format
* @param convertFn - conversion function
* @returns color converter function
*/
var createColorConverter = (name, format, convertFn) => {
const colorConverterFn = (value, opt = {}) => {
if (!isString(value)) throw new TypeError(`${value} is not a string.`);
const resolved = preProcess(value, opt);
if (resolved instanceof NullObject) return [
0,
0,
0,
0
];
const val = resolved.toLowerCase();
const cacheKey = createCacheKey({
namespace: NAMESPACE,
name,
value: val
}, opt);
const cached = getCache(cacheKey);
if (cached instanceof CacheItem) return cached.item;
const result = convertFn(val, {
...opt,
format
});
setCache(cacheKey, result);
return result;
};
return colorConverterFn;
};
/**
* convert number to hex string
* @param value - numeric value
* @returns hex string: 00..ff
*/
var numberToHex = (value) => numberToHexString(value);
/**
* convert color to hex
* @param value - CSS color value
* @param [opt] - options
* @param [opt.alpha] - enable alpha channel
* @returns #rrggbb | #rrggbbaa | null
*/
var colorToHex = (value, opt = {}) => {
if (!isString(value)) throw new TypeError(`${value} is not a string.`);
const resolved = preProcess(value, opt);
if (resolved instanceof NullObject) return null;
const val = resolved.toLowerCase();
const cacheKey = createCacheKey({
namespace: NAMESPACE,
name: "colorToHex",
value: val
}, opt);
const cached = getCache(cacheKey);
if (cached instanceof CacheItem) {
if (cached.isNull) return null;
return cached.item;
}
const hex = resolveColor(val, {
...opt,
nullable: true,
format: opt.alpha ? "hexAlpha" : "hex"
});
if (isString(hex)) {
setCache(cacheKey, hex);
return hex;
}
setCache(cacheKey, null);
return null;
};
/**
* convert color to hsl
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [h, s, l, alpha]
*/
var colorToHsl = createColorConverter("colorToHsl", "hsl", convertColorToHsl);
/**
* convert color to hwb
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [h, w, b, alpha]
*/
var colorToHwb = createColorConverter("colorToHwb", "hwb", convertColorToHwb);
/**
* convert color to lab
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [l, a, b, alpha]
*/
var colorToLab = createColorConverter("colorToLab", "lab", convertColorToLab);
/**
* convert color to lch
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [l, c, h, alpha]
*/
var colorToLch = createColorConverter("colorToLch", "lch", convertColorToLch);
/**
* convert color to oklab
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [l, a, b, alpha]
*/
var colorToOklab = createColorConverter("colorToOklab", "oklab", convertColorToOklab);
/**
* convert color to oklch
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [l, c, h, alpha]
*/
var colorToOklch = createColorConverter("colorToOklch", "oklch", convertColorToOklch);
/**
* convert color to rgb
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [r, g, b, alpha]
*/
var colorToRgb = createColorConverter("colorToRgb", "rgb", convertColorToRgb);
/**
* convert color to xyz
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [x, y, z, alpha]
*/
var colorToXyz = (value, opt = {}) => {
if (!isString(value)) throw new TypeError(`${value} is not a string.`);
const resolved = preProcess(value, opt);
if (resolved instanceof NullObject) return [
0,
0,
0,
0
];
const val = resolved.toLowerCase();
const cacheKey = createCacheKey({
namespace: NAMESPACE,
name: "colorToXyz",
value: val
}, opt);
const cached = getCache(cacheKey);
if (cached instanceof CacheItem) return cached.item;
let parsed;
if (val.startsWith("color(")) parsed = parseColorFunc(val, opt);
else parsed = parseColorValue(val, opt);
const [, ...xyz] = parsed;
setCache(cacheKey, xyz);
return xyz;
};
/**
* convert color to xyz-d50
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [x, y, z, alpha]
*/
var colorToXyzD50 = (value, opt = {}) => {
opt.d50 = true;
return colorToXyz(value, opt);
};
var convert = {
colorToHex,
colorToHsl,
colorToHwb,
colorToLab,
colorToLch,
colorToOklab,
colorToOklch,
colorToRgb,
colorToXyz,
colorToXyzD50,
numberToHex
};
//#endregion
export { convert };
//# sourceMappingURL=convert.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,89 @@
import { CSSToken } from '@csstools/css-tokenizer';
import { NullObject } from './cache.js';
import { Options } from './typedef.js';
/**
* Calclator
*/
export declare class Calculator {
#private;
/**
* constructor
*/
constructor();
get hasNum(): boolean;
set hasNum(value: boolean);
get numSum(): number[];
get numMul(): number[];
get hasPct(): boolean;
set hasPct(value: boolean);
get pctSum(): number[];
get pctMul(): number[];
get hasDim(): boolean;
set hasDim(value: boolean);
get dimSum(): string[];
get dimSub(): string[];
get dimMul(): string[];
get dimDiv(): string[];
get hasEtc(): boolean;
set hasEtc(value: boolean);
get etcSum(): string[];
get etcSub(): string[];
get etcMul(): string[];
get etcDiv(): string[];
/**
* clear values
* @returns void
*/
clear(): void;
/**
* sort values
* @param values - values
* @returns sorted values
*/
sort(values?: string[]): string[];
/**
* multiply values
* @returns resolved value
*/
multiply(): string;
/**
* sum values
* @returns resolved value
*/
sum(): string;
}
/**
* sort calc values
* @param values - values to sort
* @param [finalize] - finalize values
* @returns sorted values
*/
export declare const sortCalcValues: (values?: (number | string)[], finalize?: boolean) => string;
/**
* serialize calc
* @param value - CSS value
* @param [opt] - options
* @returns serialized value
*/
export declare const serializeCalc: (value: string, opt?: Options) => string;
/**
* resolve dimension
* @param token - CSS token
* @param [opt] - options
* @returns resolved value
*/
export declare const resolveDimension: (token: CSSToken, opt?: Options) => string | NullObject;
/**
* parse tokens
* @param tokens - CSS tokens
* @param [opt] - options
* @returns parsed tokens
*/
export declare const parseTokens: (tokens: CSSToken[], opt?: Options) => string[];
/**
* CSS calc()
* @param value - CSS value including calc()
* @param [opt] - options
* @returns resolved value
*/
export declare const cssCalc: (value: string, opt?: Options) => string;

View File

@@ -0,0 +1,636 @@
import { CacheItem, NullObject, createCacheKey, getCache, setCache } from "./cache.js";
import { isString, isStringOrNumber } from "./common.js";
import { ANGLE, LENGTH, NUM, SYN_FN_CALC, SYN_FN_MATH_START, SYN_FN_VAR, SYN_FN_VAR_START } from "./constant.js";
import { resolveLengthInPixels, roundToPrecision } from "./util.js";
import { resolveVar } from "./css-var.js";
import { calc } from "@csstools/css-calc";
import { TokenType, tokenize } from "@csstools/css-tokenizer";
//#region src/js/css-calc.ts
/**
* css-calc
*/
var { CloseParen: PAREN_CLOSE, Comment: COMMENT, Dimension: DIM, EOF, Function: FUNC, OpenParen: PAREN_OPEN, Whitespace: W_SPACE } = TokenType;
var NAMESPACE = "css-calc";
var TRIA = 3;
var HEX = 16;
var MAX_PCT = 100;
var REG_FN_CALC = new RegExp(SYN_FN_CALC);
var REG_FN_CALC_NUM = new RegExp(`^calc\\((${NUM})\\)$`);
var REG_FN_MATH_START = new RegExp(SYN_FN_MATH_START);
var REG_FN_VAR = new RegExp(SYN_FN_VAR);
var REG_FN_VAR_START = new RegExp(SYN_FN_VAR_START);
var REG_OPERATOR = /\s[*+/-]\s/;
var REG_PAREN_OPEN = /\($/;
var REG_TYPE_DIM = new RegExp(`^(${NUM})(${ANGLE}|${LENGTH})$`);
var REG_TYPE_DIM_PCT = new RegExp(`^(${NUM})(${ANGLE}|${LENGTH}|%)$`);
var REG_TYPE_PCT = new RegExp(`^(${NUM})%$`);
/**
* Calclator
*/
var Calculator = class {
#hasNum;
#numSum;
#numMul;
#hasPct;
#pctSum;
#pctMul;
#hasDim;
#dimSum;
#dimSub;
#dimMul;
#dimDiv;
#hasEtc;
#etcSum;
#etcSub;
#etcMul;
#etcDiv;
#calcOpts;
/**
* constructor
*/
constructor() {
this.#hasNum = false;
this.#numSum = [];
this.#numMul = [];
this.#hasPct = false;
this.#pctSum = [];
this.#pctMul = [];
this.#hasDim = false;
this.#dimSum = [];
this.#dimSub = [];
this.#dimMul = [];
this.#dimDiv = [];
this.#hasEtc = false;
this.#etcSum = [];
this.#etcSub = [];
this.#etcMul = [];
this.#etcDiv = [];
this.#calcOpts = { toCanonicalUnits: true };
}
get hasNum() {
return this.#hasNum;
}
set hasNum(value) {
this.#hasNum = !!value;
}
get numSum() {
return this.#numSum;
}
get numMul() {
return this.#numMul;
}
get hasPct() {
return this.#hasPct;
}
set hasPct(value) {
this.#hasPct = !!value;
}
get pctSum() {
return this.#pctSum;
}
get pctMul() {
return this.#pctMul;
}
get hasDim() {
return this.#hasDim;
}
set hasDim(value) {
this.#hasDim = !!value;
}
get dimSum() {
return this.#dimSum;
}
get dimSub() {
return this.#dimSub;
}
get dimMul() {
return this.#dimMul;
}
get dimDiv() {
return this.#dimDiv;
}
get hasEtc() {
return this.#hasEtc;
}
set hasEtc(value) {
this.#hasEtc = !!value;
}
get etcSum() {
return this.#etcSum;
}
get etcSub() {
return this.#etcSub;
}
get etcMul() {
return this.#etcMul;
}
get etcDiv() {
return this.#etcDiv;
}
/**
* clear values
* @returns void
*/
clear() {
this.#hasNum = false;
this.#numSum.length = 0;
this.#numMul.length = 0;
this.#hasPct = false;
this.#pctSum.length = 0;
this.#pctMul.length = 0;
this.#hasDim = false;
this.#dimSum.length = 0;
this.#dimSub.length = 0;
this.#dimMul.length = 0;
this.#dimDiv.length = 0;
this.#hasEtc = false;
this.#etcSum.length = 0;
this.#etcSub.length = 0;
this.#etcMul.length = 0;
this.#etcDiv.length = 0;
}
/**
* sort values
* @param values - values
* @returns sorted values
*/
sort(values = []) {
const arr = [...values];
if (arr.length > 1) arr.sort((a, b) => {
let res;
if (REG_TYPE_DIM_PCT.test(a) && REG_TYPE_DIM_PCT.test(b)) {
const [, valA, unitA] = a.match(REG_TYPE_DIM_PCT);
const [, valB, unitB] = b.match(REG_TYPE_DIM_PCT);
if (unitA === unitB) if (Number(valA) === Number(valB)) res = 0;
else if (Number(valA) > Number(valB)) res = 1;
else res = -1;
else if (unitA > unitB) res = 1;
else res = -1;
} else if (a === b) res = 0;
else if (a > b) res = 1;
else res = -1;
return res;
});
return arr;
}
/**
* multiply values
* @returns resolved value
*/
multiply() {
const value = [];
let num;
if (this.#hasNum) {
num = 1;
for (const i of this.#numMul) {
num *= i;
if (num === 0 || !Number.isFinite(num) || Number.isNaN(num)) break;
}
if (!this.#hasPct && !this.#hasDim && !this.hasEtc) {
if (Number.isFinite(num)) num = roundToPrecision(num, HEX);
value.push(num);
}
}
if (this.#hasPct) {
if (typeof num !== "number") num = 1;
for (const i of this.#pctMul) {
num *= i;
if (num === 0 || !Number.isFinite(num) || Number.isNaN(num)) break;
}
if (Number.isFinite(num)) num = `${roundToPrecision(num, HEX)}%`;
if (!this.#hasDim && !this.hasEtc) value.push(num);
}
if (this.#hasDim) {
let dim = "";
let mul = "";
let div = "";
if (this.#dimMul.length) if (this.#dimMul.length === 1) [mul] = this.#dimMul;
else mul = `${this.sort(this.#dimMul).join(" * ")}`;
if (this.#dimDiv.length) if (this.#dimDiv.length === 1) [div] = this.#dimDiv;
else div = `${this.sort(this.#dimDiv).join(" * ")}`;
if (Number.isFinite(num)) {
if (mul) if (div) if (div.includes("*")) dim = calc(`calc(${num} * ${mul} / (${div}))`, this.#calcOpts);
else dim = calc(`calc(${num} * ${mul} / ${div})`, this.#calcOpts);
else dim = calc(`calc(${num} * ${mul})`, this.#calcOpts);
else if (div.includes("*")) dim = calc(`calc(${num} / (${div}))`, this.#calcOpts);
else dim = calc(`calc(${num} / ${div})`, this.#calcOpts);
value.push(dim.replace(/^calc/, ""));
} else {
if (!value.length && num !== void 0) value.push(num);
if (mul) {
if (div) if (div.includes("*")) dim = calc(`calc(${mul} / (${div}))`, this.#calcOpts);
else dim = calc(`calc(${mul} / ${div})`, this.#calcOpts);
else dim = calc(`calc(${mul})`, this.#calcOpts);
if (value.length) value.push("*", dim.replace(/^calc/, ""));
else value.push(dim.replace(/^calc/, ""));
} else {
dim = calc(`calc(${div})`, this.#calcOpts);
if (value.length) value.push("/", dim.replace(/^calc/, ""));
else value.push("1", "/", dim.replace(/^calc/, ""));
}
}
}
if (this.#hasEtc) {
if (this.#etcMul.length) {
if (!value.length && num !== void 0) value.push(num);
const mul = this.sort(this.#etcMul).join(" * ");
if (value.length) value.push(`* ${mul}`);
else value.push(`${mul}`);
}
if (this.#etcDiv.length) {
const div = this.sort(this.#etcDiv).join(" * ");
if (div.includes("*")) if (value.length) value.push(`/ (${div})`);
else value.push(`1 / (${div})`);
else if (value.length) value.push(`/ ${div}`);
else value.push(`1 / ${div}`);
}
}
if (value.length) return value.join(" ");
return "";
}
/**
* sum values
* @returns resolved value
*/
sum() {
const value = [];
if (this.#hasNum) {
let num = 0;
for (const i of this.#numSum) {
num += i;
if (!Number.isFinite(num) || Number.isNaN(num)) break;
}
value.push(num);
}
if (this.#hasPct) {
let num = 0;
for (const i of this.#pctSum) {
num += i;
if (!Number.isFinite(num)) break;
}
if (Number.isFinite(num)) num = `${num}%`;
if (value.length) value.push(`+ ${num}`);
else value.push(num);
}
if (this.#hasDim) {
let dim, sum, sub;
if (this.#dimSum.length) sum = this.sort(this.#dimSum).join(" + ");
if (this.#dimSub.length) sub = this.sort(this.#dimSub).join(" + ");
if (sum) if (sub) if (sub.includes("-")) dim = calc(`calc(${sum} - (${sub}))`, this.#calcOpts);
else dim = calc(`calc(${sum} - ${sub})`, this.#calcOpts);
else dim = calc(`calc(${sum})`, this.#calcOpts);
else dim = calc(`calc(-1 * (${sub}))`, this.#calcOpts);
if (value.length) value.push("+", dim.replace(/^calc/, ""));
else value.push(dim.replace(/^calc/, ""));
}
if (this.#hasEtc) {
if (this.#etcSum.length) {
const sum = this.sort(this.#etcSum).map((item) => {
let res;
if (REG_OPERATOR.test(item) && !item.startsWith("(") && !item.endsWith(")")) res = `(${item})`;
else res = item;
return res;
}).join(" + ");
if (value.length) if (this.#etcSum.length > 1) value.push(`+ (${sum})`);
else value.push(`+ ${sum}`);
else value.push(`${sum}`);
}
if (this.#etcSub.length) {
const sub = this.sort(this.#etcSub).map((item) => {
let res;
if (REG_OPERATOR.test(item) && !item.startsWith("(") && !item.endsWith(")")) res = `(${item})`;
else res = item;
return res;
}).join(" + ");
if (value.length) if (this.#etcSub.length > 1) value.push(`- (${sub})`);
else value.push(`- ${sub}`);
else if (this.#etcSub.length > 1) value.push(`-1 * (${sub})`);
else value.push(`-1 * ${sub}`);
}
}
if (value.length) return value.join(" ");
return "";
}
};
/**
* sort calc values
* @param values - values to sort
* @param [finalize] - finalize values
* @returns sorted values
*/
var sortCalcValues = (values = [], finalize = false) => {
if (values.length < TRIA) throw new Error(`Unexpected array length ${values.length}.`);
const start = values.shift();
if (!isString(start) || !start.endsWith("(")) throw new Error(`Unexpected token ${start}.`);
const end = values.pop();
if (end !== ")") throw new Error(`Unexpected token ${end}.`);
if (values.length === 1) {
const [value] = values;
if (!isStringOrNumber(value)) throw new Error(`Unexpected token ${value}.`);
return `${start}${value}${end}`;
}
const sortedValues = [];
const cal = new Calculator();
let operator = "";
const l = values.length;
let hasAddSub = false;
for (let i = 0; i < l; i++) {
const value = values[i];
if (!isStringOrNumber(value)) throw new Error(`Unexpected token ${value}.`);
if (value === "*" || value === "/") operator = value;
else if (value === "+" || value === "-") {
const sortedValue = cal.multiply();
if (sortedValue) sortedValues.push(sortedValue, value);
hasAddSub = true;
cal.clear();
operator = "";
} else {
const numValue = Number(value);
const strValue = `${value}`;
switch (operator) {
case "/":
if (Number.isFinite(numValue)) {
cal.hasNum = true;
cal.numMul.push(1 / numValue);
} else if (REG_TYPE_PCT.test(strValue)) {
const [, val] = strValue.match(REG_TYPE_PCT);
cal.hasPct = true;
cal.pctMul.push(MAX_PCT * MAX_PCT / Number(val));
} else if (REG_TYPE_DIM.test(strValue)) {
cal.hasDim = true;
cal.dimDiv.push(strValue);
} else {
cal.hasEtc = true;
cal.etcDiv.push(strValue);
}
break;
default: if (Number.isFinite(numValue)) {
cal.hasNum = true;
cal.numMul.push(numValue);
} else if (REG_TYPE_PCT.test(strValue)) {
const [, val] = strValue.match(REG_TYPE_PCT);
cal.hasPct = true;
cal.pctMul.push(Number(val));
} else if (REG_TYPE_DIM.test(strValue)) {
cal.hasDim = true;
cal.dimMul.push(strValue);
} else {
cal.hasEtc = true;
cal.etcMul.push(strValue);
}
}
}
if (i === l - 1) {
const sortedValue = cal.multiply();
if (sortedValue) sortedValues.push(sortedValue);
cal.clear();
operator = "";
}
}
let resolvedValue = "";
if (finalize && hasAddSub) {
const finalizedValues = [];
cal.clear();
operator = "";
const l = sortedValues.length;
for (let i = 0; i < l; i++) {
const value = sortedValues[i];
if (isStringOrNumber(value)) if (value === "+" || value === "-") operator = value;
else {
const numValue = Number(value);
const strValue = `${value}`;
switch (operator) {
case "-":
if (Number.isFinite(numValue)) {
cal.hasNum = true;
cal.numSum.push(-1 * numValue);
} else if (REG_TYPE_PCT.test(strValue)) {
const [, val] = strValue.match(REG_TYPE_PCT);
cal.hasPct = true;
cal.pctSum.push(-1 * Number(val));
} else if (REG_TYPE_DIM.test(strValue)) {
cal.hasDim = true;
cal.dimSub.push(strValue);
} else {
cal.hasEtc = true;
cal.etcSub.push(strValue);
}
break;
default: if (Number.isFinite(numValue)) {
cal.hasNum = true;
cal.numSum.push(numValue);
} else if (REG_TYPE_PCT.test(strValue)) {
const [, val] = strValue.match(REG_TYPE_PCT);
cal.hasPct = true;
cal.pctSum.push(Number(val));
} else if (REG_TYPE_DIM.test(strValue)) {
cal.hasDim = true;
cal.dimSum.push(strValue);
} else {
cal.hasEtc = true;
cal.etcSum.push(strValue);
}
}
}
if (i === l - 1) {
const sortedValue = cal.sum();
if (sortedValue) finalizedValues.push(sortedValue);
cal.clear();
operator = "";
}
}
resolvedValue = finalizedValues.join(" ").replace(/\+\s-/g, "- ");
} else resolvedValue = sortedValues.join(" ").replace(/\+\s-/g, "- ");
if (resolvedValue.startsWith("(") && resolvedValue.endsWith(")") && resolvedValue.lastIndexOf("(") === 0 && resolvedValue.indexOf(")") === resolvedValue.length - 1) resolvedValue = resolvedValue.substring(1, resolvedValue.length - 1);
return `${start}${resolvedValue}${end}`;
};
/**
* resolve AST node
* @param node - AST node
* @param isRoot - is root node
* @returns resolved value
*/
var resolveNode = (node, isRoot) => {
const flatItems = [];
for (const item of node) if (Array.isArray(item)) flatItems.push(resolveNode(item, false));
else flatItems.push(item);
if (isRoot) {
if (flatItems.length >= TRIA) return sortCalcValues(flatItems, true);
const joined = flatItems.join("");
return joined.startsWith("calc(") ? joined : `calc(${joined})`;
}
if (flatItems.length >= TRIA) {
let serialized = sortCalcValues(flatItems, false);
if (REG_FN_VAR_START.test(serialized)) serialized = calc(serialized, { toCanonicalUnits: true });
return serialized;
}
return flatItems.join("");
};
/**
* serialize calc
* @param value - CSS value
* @param [opt] - options
* @returns serialized value
*/
var serializeCalc = (value, opt = {}) => {
const { format = "" } = opt;
if (isString(value)) {
if (!REG_FN_VAR_START.test(value) || format !== "specifiedValue") return value;
value = value.toLowerCase().trim();
} else throw new TypeError(`${value} is not a string.`);
const cacheKey = createCacheKey({
namespace: NAMESPACE,
name: "serializeCalc",
value
}, opt);
const cachedResult = getCache(cacheKey);
if (cachedResult instanceof CacheItem) return cachedResult.item;
const items = tokenize({ css: value }).map((token) => {
const [type, val] = token;
let res = "";
if (type !== W_SPACE && type !== COMMENT) res = val;
return res;
}).filter((v) => v);
const stack = [[]];
for (const item of items) if (REG_PAREN_OPEN.test(item)) {
const newNode = [item];
const parent = stack[stack.length - 1];
if (parent) parent.push(newNode);
stack.push(newNode);
} else if (item === ")") if (stack.length > 1) {
const currentLevel = stack.pop();
if (currentLevel) currentLevel.push(item);
} else {
const root = stack[0];
if (root) root.push(item);
}
else {
const parent = stack[stack.length - 1];
if (parent) parent.push(item);
}
let serializedCalc = "";
const rootItems = stack[0];
if (rootItems) if (rootItems.length === 1 && Array.isArray(rootItems[0])) serializedCalc = resolveNode(rootItems[0], true);
else {
const flatItems = [];
for (const item of rootItems) if (Array.isArray(item)) flatItems.push(resolveNode(item, false));
else flatItems.push(item);
if (flatItems.length >= TRIA) serializedCalc = sortCalcValues(flatItems, true);
else {
const firstItem = flatItems[0] || "";
serializedCalc = isString(firstItem) && firstItem.startsWith("calc(") ? firstItem : `calc(${firstItem})`;
}
}
setCache(cacheKey, serializedCalc);
return serializedCalc;
};
/**
* resolve dimension
* @param token - CSS token
* @param [opt] - options
* @returns resolved value
*/
var resolveDimension = (token, opt = {}) => {
if (!Array.isArray(token)) throw new TypeError(`${token} is not an array.`);
const [, , , , detail = {}] = token;
const { unit, value } = detail;
if (unit === "px") return `${value}${unit}`;
const pixelValue = resolveLengthInPixels(Number(value), unit, opt);
if (Number.isFinite(pixelValue)) return `${roundToPrecision(pixelValue, HEX)}px`;
return new NullObject();
};
/**
* parse tokens
* @param tokens - CSS tokens
* @param [opt] - options
* @returns parsed tokens
*/
var parseTokens = (tokens, opt = {}) => {
if (!Array.isArray(tokens)) throw new TypeError(`${tokens} is not an array.`);
const { format = "" } = opt;
const mathFunc = /* @__PURE__ */ new Set();
let nest = 0;
const res = [];
for (const token of tokens) {
if (!Array.isArray(token)) throw new TypeError(`${token} is not an array.`);
const [type = "", value = ""] = token;
switch (type) {
case DIM:
if (format === "specifiedValue" && !mathFunc.has(nest)) res.push(value);
else {
const resolvedValue = resolveDimension(token, opt);
if (isString(resolvedValue)) res.push(resolvedValue);
else res.push(value);
}
break;
case FUNC:
case PAREN_OPEN:
res.push(value);
nest++;
if (REG_FN_MATH_START.test(value)) mathFunc.add(nest);
break;
case PAREN_CLOSE:
if (res.length) if (res[res.length - 1] === " ") res.splice(-1, 1, value);
else res.push(value);
else res.push(value);
if (mathFunc.has(nest)) mathFunc.delete(nest);
nest--;
break;
case W_SPACE:
if (res.length) {
const lastValue = res[res.length - 1];
if (isString(lastValue) && !lastValue.endsWith("(") && lastValue !== " ") res.push(value);
}
break;
default: if (type !== COMMENT && type !== EOF) res.push(value);
}
}
return res;
};
/**
* CSS calc()
* @param value - CSS value including calc()
* @param [opt] - options
* @returns resolved value
*/
var cssCalc = (value, opt = {}) => {
const { format = "" } = opt;
if (isString(value)) {
if (REG_FN_VAR.test(value)) if (format === "specifiedValue") return value;
else {
const resolvedValue = resolveVar(value, opt);
if (isString(resolvedValue)) return resolvedValue;
else return "";
}
else if (!REG_FN_CALC.test(value)) return value;
value = value.toLowerCase().trim();
} else throw new TypeError(`${value} is not a string.`);
const cacheKey = createCacheKey({
namespace: NAMESPACE,
name: "cssCalc",
value
}, opt);
const cachedResult = getCache(cacheKey);
if (cachedResult instanceof CacheItem) return cachedResult.item;
let resolvedValue = calc(parseTokens(tokenize({ css: value }), opt).join(""), { toCanonicalUnits: true });
if (REG_FN_VAR_START.test(value)) {
if (REG_TYPE_DIM_PCT.test(resolvedValue)) {
const [, val, unit] = resolvedValue.match(REG_TYPE_DIM_PCT);
resolvedValue = `${roundToPrecision(Number(val), HEX)}${unit}`;
}
if (resolvedValue && !REG_FN_VAR_START.test(resolvedValue) && format === "specifiedValue") resolvedValue = `calc(${resolvedValue})`;
}
if (format === "specifiedValue") {
if (/\s[-+*/]\s/.test(resolvedValue) && !resolvedValue.includes("NaN")) resolvedValue = serializeCalc(resolvedValue, opt);
else if (REG_FN_CALC_NUM.test(resolvedValue)) {
const [, val] = resolvedValue.match(REG_FN_CALC_NUM);
resolvedValue = `calc(${roundToPrecision(Number(val), HEX)})`;
}
}
setCache(cacheKey, resolvedValue);
return resolvedValue;
};
//#endregion
export { cssCalc, resolveDimension, serializeCalc };
//# sourceMappingURL=css-calc.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,79 @@
import { Options } from './typedef.js';
/**
* @type ColorStopList - list of color stops
*/
type ColorStopList = [string, string, ...string[]];
/**
* @typedef ValidateGradientLine - validate gradient line
* @property line - gradient line
* @property valid - result
*/
interface ValidateGradientLine {
line: string;
valid: boolean;
}
/**
* @typedef ValidateColorStops - validate color stops
* @property colorStops - list of color stops
* @property valid - result
*/
interface ValidateColorStops {
colorStops: string[];
valid: boolean;
}
/**
* @typedef Gradient - parsed CSS gradient
* @property value - input value
* @property type - gradient type
* @property [gradientLine] - gradient line
* @property colorStopList - list of color stops
*/
interface Gradient {
value: string;
type: string;
gradientLine?: string;
colorStopList: ColorStopList;
}
/**
* get gradient type
* @param value - gradient value
* @returns gradient type
*/
export declare const getGradientType: (value: string) => string;
/**
* validate gradient line
* @param value - gradient line value
* @param type - gradient type
* @returns result
*/
export declare const validateGradientLine: (value: string, type: string) => ValidateGradientLine;
/**
* validate color stop list
* @param list
* @param type
* @param [opt]
* @returns result
*/
export declare const validateColorStopList: (list: string[], type: string, opt?: Options) => ValidateColorStops;
/**
* parse CSS gradient
* @param value - gradient value
* @param [opt] - options
* @returns parsed result
*/
export declare const parseGradient: (value: string, opt?: Options) => Gradient | null;
/**
* resolve CSS gradient
* @param value - CSS value
* @param [opt] - options
* @returns result
*/
export declare const resolveGradient: (value: string, opt?: Options) => string;
/**
* is CSS gradient
* @param value - CSS value
* @param [opt] - options
* @returns result
*/
export declare const isGradient: (value: string, opt?: Options) => boolean;
export {};

View File

@@ -0,0 +1,291 @@
import { CacheItem, createCacheKey, getCache, setCache } from "./cache.js";
import { isString } from "./common.js";
import { ANGLE, CS_HUE, CS_RECT, LENGTH, NUM, NUM_POSITIVE, PCT, VAL_COMP } from "./constant.js";
import { resolveColor } from "./resolve.js";
import { isColor, splitValue } from "./util.js";
//#region src/js/css-gradient.ts
/**
* css-gradient
*/
var NAMESPACE = "css-gradient";
var DIM_ANGLE = `${NUM}(?:${ANGLE})`;
var DIM_ANGLE_PCT = `${DIM_ANGLE}|${PCT}`;
var DIM_LEN_PCT = `${`${NUM}(?:${LENGTH})|0`}|${PCT}`;
var DIM_LEN_PCT_POSI = `${NUM_POSITIVE}(?:${LENGTH}|%)|0`;
var DIM_LEN_POSI = `${NUM_POSITIVE}(?:${LENGTH})|0`;
var CTR = "center";
var L_R = "left|right";
var T_B = "top|bottom";
var S_E = "start|end";
var AXIS_X = `${L_R}|x-(?:${S_E})`;
var AXIS_Y = `${T_B}|y-(?:${S_E})`;
var BLOCK = `block-(?:${S_E})`;
var INLINE = `inline-(?:${S_E})`;
var POS_1 = `${CTR}|${AXIS_X}|${AXIS_Y}|${BLOCK}|${INLINE}|${DIM_LEN_PCT}`;
var POS_2 = [
`(?:${CTR}|${AXIS_X})\\s+(?:${CTR}|${AXIS_Y})`,
`(?:${CTR}|${AXIS_Y})\\s+(?:${CTR}|${AXIS_X})`,
`(?:${CTR}|${AXIS_X}|${DIM_LEN_PCT})\\s+(?:${CTR}|${AXIS_Y}|${DIM_LEN_PCT})`,
`(?:${CTR}|${BLOCK})\\s+(?:${CTR}|${INLINE})`,
`(?:${CTR}|${INLINE})\\s+(?:${CTR}|${BLOCK})`,
`(?:${CTR}|${S_E})\\s+(?:${CTR}|${S_E})`
].join("|");
var POS_4 = [
`(?:${AXIS_X})\\s+(?:${DIM_LEN_PCT})\\s+(?:${AXIS_Y})\\s+(?:${DIM_LEN_PCT})`,
`(?:${AXIS_Y})\\s+(?:${DIM_LEN_PCT})\\s+(?:${AXIS_X})\\s+(?:${DIM_LEN_PCT})`,
`(?:${BLOCK})\\s+(?:${DIM_LEN_PCT})\\s+(?:${INLINE})\\s+(?:${DIM_LEN_PCT})`,
`(?:${INLINE})\\s+(?:${DIM_LEN_PCT})\\s+(?:${BLOCK})\\s+(?:${DIM_LEN_PCT})`,
`(?:${S_E})\\s+(?:${DIM_LEN_PCT})\\s+(?:${S_E})\\s+(?:${DIM_LEN_PCT})`
].join("|");
var RAD_EXTENT = "(?:clos|farth)est-(?:corner|side)";
var RAD_SIZE = [
`${RAD_EXTENT}(?:\\s+${RAD_EXTENT})?`,
`${DIM_LEN_POSI}`,
`(?:${DIM_LEN_PCT_POSI})\\s+(?:${DIM_LEN_PCT_POSI})`
].join("|");
var RAD_SHAPE = "circle|ellipse";
var FROM_ANGLE = `from\\s+${DIM_ANGLE}`;
var AT_POSITION = `at\\s+(?:${POS_1}|${POS_2}|${POS_4})`;
var TO_SIDE_CORNER = `to\\s+(?:(?:${L_R})(?:\\s(?:${T_B}))?|(?:${T_B})(?:\\s(?:${L_R}))?)`;
var IN_COLOR_SPACE = `in\\s+(?:${CS_RECT}|${CS_HUE})`;
var LINE_SYNTAX_LINEAR = [`(?:${DIM_ANGLE}|${TO_SIDE_CORNER})(?:\\s+${IN_COLOR_SPACE})?`, `${IN_COLOR_SPACE}(?:\\s+(?:${DIM_ANGLE}|${TO_SIDE_CORNER}))?`].join("|");
var LINE_SYNTAX_RADIAL = [
`(?:${RAD_SHAPE})(?:\\s+(?:${RAD_SIZE}))?(?:\\s+${AT_POSITION})?(?:\\s+${IN_COLOR_SPACE})?`,
`(?:${RAD_SIZE})(?:\\s+(?:${RAD_SHAPE}))?(?:\\s+${AT_POSITION})?(?:\\s+${IN_COLOR_SPACE})?`,
`${AT_POSITION}(?:\\s+${IN_COLOR_SPACE})?`,
`${IN_COLOR_SPACE}(?:\\s+${RAD_SHAPE})(?:\\s+(?:${RAD_SIZE}))?(?:\\s+${AT_POSITION})?`,
`${IN_COLOR_SPACE}(?:\\s+${RAD_SIZE})(?:\\s+(?:${RAD_SHAPE}))?(?:\\s+${AT_POSITION})?`,
`${IN_COLOR_SPACE}(?:\\s+${AT_POSITION})?`
].join("|");
var LINE_SYNTAX_CONIC = [
`${FROM_ANGLE}(?:\\s+${AT_POSITION})?(?:\\s+${IN_COLOR_SPACE})?`,
`${AT_POSITION}(?:\\s+${IN_COLOR_SPACE})?`,
`${IN_COLOR_SPACE}(?:\\s+${FROM_ANGLE})?(?:\\s+${AT_POSITION})?`
].join("|");
var DEFAULT_LINEAR = [/to\s+bottom/];
var DEFAULT_RADIAL = [
/ellipse/,
/farthest-corner/,
/at\s+center/
];
var DEFAULT_CONIC = [/at\s+center/];
var IS_CONIC = /^(?:repeating-)?conic-gradient$/;
var IS_LINEAR = /^(?:repeating-)?linear-gradient$/;
var IS_RADIAL = /^(?:repeating-)?radial-gradient$/;
var REG_COLOR_HINT_CONIC = new RegExp(`^(?:${DIM_ANGLE_PCT})$`);
var REG_COLOR_HINT_NON_CONIC = new RegExp(`^(?:${DIM_LEN_PCT})$`);
var REG_DIM_CONIC = new RegExp(`(?:\\s+(?:${DIM_ANGLE_PCT})){1,2}$`);
var REG_DIM_NON_CONIC = new RegExp(`(?:\\s+(?:${DIM_LEN_PCT})){1,2}$`);
var REG_GRAD = /^(?:repeating-)?(?:conic|linear|radial)-gradient\(/;
var REG_GRAD_CAPT = /^((?:repeating-)?(?:conic|linear|radial)-gradient)\(/;
var REG_LINE_CONIC = new RegExp(`^(?:${LINE_SYNTAX_CONIC})$`);
var REG_LINE_LINEAR = new RegExp(`^(?:${LINE_SYNTAX_LINEAR})$`);
var REG_LINE_RADIAL = new RegExp(`^(?:${LINE_SYNTAX_RADIAL})$`);
/**
* get gradient type
* @param value - gradient value
* @returns gradient type
*/
var getGradientType = (value) => {
if (isString(value)) {
value = value.trim();
if (REG_GRAD.test(value)) {
const [, type] = value.match(REG_GRAD_CAPT);
return type;
}
}
return "";
};
/**
* validate gradient line
* @param value - gradient line value
* @param type - gradient type
* @returns result
*/
var validateGradientLine = (value, type) => {
if (isString(value) && isString(type)) {
value = value.trim();
type = type.trim();
let reg = null;
let defaultValues = [];
if (IS_LINEAR.test(type)) {
reg = REG_LINE_LINEAR;
defaultValues = DEFAULT_LINEAR;
} else if (IS_RADIAL.test(type)) {
reg = REG_LINE_RADIAL;
defaultValues = DEFAULT_RADIAL;
} else if (IS_CONIC.test(type)) {
reg = REG_LINE_CONIC;
defaultValues = DEFAULT_CONIC;
}
if (reg) {
const valid = reg.test(value);
if (valid) {
let line = value;
for (const defaultValue of defaultValues) line = line.replace(defaultValue, "");
line = line.replace(/\s{2,}/g, " ").trim();
return {
line,
valid
};
}
return {
valid,
line: value
};
}
}
return {
line: value,
valid: false
};
};
/**
* validate color stop list
* @param list
* @param type
* @param [opt]
* @returns result
*/
var validateColorStopList = (list, type, opt = {}) => {
if (Array.isArray(list) && list.length > 1) {
const isConic = IS_CONIC.test(type);
const regColorHint = isConic ? REG_COLOR_HINT_CONIC : REG_COLOR_HINT_NON_CONIC;
const regDimension = isConic ? REG_DIM_CONIC : REG_DIM_NON_CONIC;
const valueList = [];
let prevType = "";
for (let i = 0; i < list.length; i++) {
const item = list[i];
if (isString(item)) if (regColorHint.test(item)) {
if (i === 0 || prevType === "hint") return {
colorStops: list,
valid: false
};
prevType = "hint";
valueList.push(item);
} else {
const itemColor = item.replace(regDimension, "");
if (isColor(itemColor, { format: "specifiedValue" })) {
const resolvedColor = resolveColor(itemColor, opt);
prevType = "color";
valueList.push(item.replace(itemColor, resolvedColor));
} else return {
colorStops: list,
valid: false
};
}
else return {
colorStops: list,
valid: false
};
}
if (prevType !== "color") return {
colorStops: list,
valid: false
};
return {
valid: true,
colorStops: valueList
};
}
return {
colorStops: list,
valid: false
};
};
/**
* parse CSS gradient
* @param value - gradient value
* @param [opt] - options
* @returns parsed result
*/
var parseGradient = (value, opt = {}) => {
if (isString(value)) {
value = value.trim();
const cacheKey = createCacheKey({
namespace: NAMESPACE,
name: "parseGradient",
value
}, opt);
const cachedResult = getCache(cacheKey);
if (cachedResult instanceof CacheItem) {
if (cachedResult.isNull) return null;
return cachedResult.item;
}
const type = getGradientType(value);
const gradValue = value.replace(REG_GRAD, "").replace(/\)$/, "");
if (type && gradValue) {
const [lineOrColorStop = "", ...itemList] = splitValue(gradValue, { delimiter: "," });
const regDimension = IS_CONIC.test(type) ? REG_DIM_CONIC : REG_DIM_NON_CONIC;
let colorStop = "";
if (regDimension.test(lineOrColorStop)) {
const itemColor = lineOrColorStop.replace(regDimension, "");
if (isColor(itemColor, { format: "specifiedValue" })) {
const resolvedColor = resolveColor(itemColor, opt);
colorStop = lineOrColorStop.replace(itemColor, resolvedColor);
}
} else if (isColor(lineOrColorStop, { format: "specifiedValue" })) colorStop = resolveColor(lineOrColorStop, opt);
if (colorStop) {
itemList.unshift(colorStop);
const { colorStops, valid } = validateColorStopList(itemList, type, opt);
if (valid) {
const res = {
value,
type,
colorStopList: colorStops
};
setCache(cacheKey, res);
return res;
}
} else if (itemList.length > 1) {
const { line: gradientLine, valid: validLine } = validateGradientLine(lineOrColorStop, type);
const { colorStops, valid: validColorStops } = validateColorStopList(itemList, type, opt);
if (validLine && validColorStops) {
const res = {
value,
type,
gradientLine,
colorStopList: colorStops
};
setCache(cacheKey, res);
return res;
}
}
}
setCache(cacheKey, null);
return null;
}
return null;
};
/**
* resolve CSS gradient
* @param value - CSS value
* @param [opt] - options
* @returns result
*/
var resolveGradient = (value, opt = {}) => {
const { format = VAL_COMP } = opt;
const gradient = parseGradient(value, opt);
if (gradient) {
const { type = "", gradientLine = "", colorStopList = [] } = gradient;
if (type && Array.isArray(colorStopList) && colorStopList.length > 1) {
if (gradientLine) return `${type}(${gradientLine}, ${colorStopList.join(", ")})`;
return `${type}(${colorStopList.join(", ")})`;
}
}
if (format === "specifiedValue") return "";
return "none";
};
/**
* is CSS gradient
* @param value - CSS value
* @param [opt] - options
* @returns result
*/
var isGradient = (value, opt = {}) => {
return parseGradient(value, opt) !== null;
};
//#endregion
export { isGradient, resolveGradient };
//# sourceMappingURL=css-gradient.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,31 @@
import { CSSToken } from '@csstools/css-tokenizer';
import { NullObject } from './cache.js';
import { Options } from './typedef.js';
/**
* resolve custom property
* @param tokens - CSS tokens
* @param [opt] - options
* @returns result - [tokens, resolvedValue]
*/
export declare function resolveCustomProperty(tokens: CSSToken[], opt?: Options): [CSSToken[], string];
/**
* parse tokens
* @param tokens - CSS tokens
* @param [opt] - options
* @returns parsed tokens
*/
export declare function parseTokens(tokens: CSSToken[], opt?: Options): string[] | NullObject;
/**
* resolve CSS var()
* @param value - CSS value including var()
* @param [opt] - options
* @returns resolved value
*/
export declare function resolveVar(value: string, opt?: Options): string | NullObject;
/**
* CSS var()
* @param value - CSS value including var()
* @param [opt] - options
* @returns resolved value
*/
export declare const cssVar: (value: string, opt?: Options) => string;

View File

@@ -0,0 +1,144 @@
import { CacheItem, NullObject, createCacheKey, getCache, setCache } from "./cache.js";
import { isString } from "./common.js";
import { SYN_FN_CALC, SYN_FN_VAR } from "./constant.js";
import { isColor } from "./util.js";
import { cssCalc } from "./css-calc.js";
import { TokenType, tokenize } from "@csstools/css-tokenizer";
//#region src/js/css-var.ts
/**
* css-var
*/
var { CloseParen: PAREN_CLOSE, Comment: COMMENT, EOF, Ident: IDENT, Whitespace: W_SPACE } = TokenType;
var NAMESPACE = "css-var";
var REG_FN_CALC = new RegExp(SYN_FN_CALC);
var REG_FN_VAR = new RegExp(SYN_FN_VAR);
var REG_CSS_WIDE_KEYWORD = /^(?:inherit|initial|revert(?:-layer)?|unset)$/;
/**
* resolve custom property
* @param tokens - CSS tokens
* @param [opt] - options
* @returns result - [tokens, resolvedValue]
*/
function resolveCustomProperty(tokens, opt = {}) {
if (!Array.isArray(tokens)) throw new TypeError(`${tokens} is not an array.`);
const { customProperty = {} } = opt;
const items = [];
while (tokens.length) {
const token = tokens.shift();
if (!token) break;
if (!Array.isArray(token)) throw new TypeError(`${token} is not an array.`);
const [type, value] = token;
if (type === PAREN_CLOSE) break;
if (value === "var(") {
const [, item] = resolveCustomProperty(tokens, opt);
if (item) items.push(item);
} else if (type === IDENT) {
if (value.startsWith("--")) {
let item;
if (Object.hasOwn(customProperty, value)) item = customProperty[value];
else if (typeof customProperty.callback === "function") item = customProperty.callback(value);
if (item) items.push(item);
} else if (value) items.push(value);
}
}
let resolveAsColor = false;
if (items.length > 1) resolveAsColor = isColor(items[items.length - 1]);
let resolvedValue = "";
for (let item of items) {
item = item.trim();
if (REG_FN_VAR.test(item)) {
const resolvedItem = resolveVar(item, opt);
if (isString(resolvedItem)) {
if (!resolveAsColor || isColor(resolvedItem)) resolvedValue = resolvedItem;
}
} else if (REG_FN_CALC.test(item)) {
item = cssCalc(item, opt);
if (!resolveAsColor || isColor(item)) resolvedValue = item;
} else if (item && !REG_CSS_WIDE_KEYWORD.test(item)) {
if (!resolveAsColor || isColor(item)) resolvedValue = item;
}
if (resolvedValue) break;
}
return [tokens, resolvedValue];
}
/**
* parse tokens
* @param tokens - CSS tokens
* @param [opt] - options
* @returns parsed tokens
*/
function parseTokens(tokens, opt = {}) {
const res = [];
while (tokens.length) {
const token = tokens.shift();
if (!token) break;
const [type = "", value = ""] = token;
if (value === "var(") {
const [, resolvedValue] = resolveCustomProperty(tokens, opt);
if (!resolvedValue) return new NullObject();
res.push(resolvedValue);
} else switch (type) {
case PAREN_CLOSE:
if (res.length) if (res[res.length - 1] === " ") res[res.length - 1] = value;
else res.push(value);
else res.push(value);
break;
case W_SPACE:
if (res.length) {
const lastValue = res[res.length - 1];
if (isString(lastValue) && !lastValue.endsWith("(") && lastValue !== " ") res.push(value);
}
break;
default: if (type !== COMMENT && type !== EOF) res.push(value);
}
}
return res;
}
/**
* resolve CSS var()
* @param value - CSS value including var()
* @param [opt] - options
* @returns resolved value
*/
function resolveVar(value, opt = {}) {
const { format = "" } = opt;
if (isString(value)) {
if (!REG_FN_VAR.test(value) || format === "specifiedValue") return value;
value = value.trim();
} else throw new TypeError(`${value} is not a string.`);
const cacheKey = createCacheKey({
namespace: NAMESPACE,
name: "resolveVar",
value
}, opt);
const cachedResult = getCache(cacheKey);
if (cachedResult instanceof CacheItem) {
if (cachedResult.isNull) return cachedResult;
return cachedResult.item;
}
const values = parseTokens(tokenize({ css: value }), opt);
if (Array.isArray(values)) {
let color = values.join("");
if (REG_FN_CALC.test(color)) color = cssCalc(color, opt);
setCache(cacheKey, color);
return color;
} else {
setCache(cacheKey, null);
return new NullObject();
}
}
/**
* CSS var()
* @param value - CSS value including var()
* @param [opt] - options
* @returns resolved value
*/
var cssVar = (value, opt = {}) => {
const resolvedValue = resolveVar(value, opt);
if (isString(resolvedValue)) return resolvedValue;
return "";
};
//#endregion
export { cssVar, resolveVar };
//# sourceMappingURL=css-var.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,65 @@
import { CSSToken } from '@csstools/css-tokenizer';
import { NullObject } from './cache.js';
import { ColorChannels, Options, StringColorChannels } from './typedef.js';
/**
* @type NumberOrStringColorChannels - color channel
*/
type NumberOrStringColorChannels = ColorChannels & StringColorChannels;
/**
* resolve relative color channels
* @param value
* - CSS color value
* - system colors are not supported
* @param [opt] - options
* @param [opt.currentColor]
* - color to use for `currentcolor` keyword
* - if omitted, it will be treated as a missing color
* i.e. `rgb(none none none / none)`
* @param [opt.customProperty]
* - custom properties
* - pair of `--` prefixed property name and value,
* e.g. `customProperty: { '--some-color': '#0000ff' }`
* - and/or `callback` function to get the value of the custom property,
* e.g. `customProperty: { callback: someDeclaration.getPropertyValue }`
* @param [opt.dimension]
* - dimension, convert relative length to pixels
* - pair of unit and it's value as a number in pixels,
* e.g. `dimension: { em: 12, rem: 16, vw: 10.26 }`
* - and/or `callback` function to get the value as a number in pixels,
* e.g. `dimension: { callback: convertUnitToPixel }`
* @param [opt.format]
* - output format, one of below
* - `computedValue` (default), [computed value][139] of the color
* - `specifiedValue`, [specified value][140] of the color
* - `hex`, hex color notation, i.e. `rrggbb`
* - `hexAlpha`, hex color notation with alpha channel, i.e. `#rrggbbaa`
* @returns
* - one of rgba?(), #rrggbb(aa)?, color-name, '(empty-string)',
* color(color-space r g b / alpha), color(color-space x y z / alpha),
* lab(l a b / alpha), lch(l c h / alpha), oklab(l a b / alpha),
* oklch(l c h / alpha), null
* - in `computedValue`, values are numbers, however `rgb()` values are
* integers
* - in `specifiedValue`, returns `empty string` for unknown and/or invalid
* color
* - in `hex`, returns `null` for `transparent`, and also returns `null` if
* any of `r`, `g`, `b`, `alpha` is not a number
* - in `hexAlpha`, returns `#00000000` for `transparent`,
* however returns `null` if any of `r`, `g`, `b`, `alpha` is not a number
*/
export declare function resolveColorChannels(tokens: CSSToken[], opt?: Options): NumberOrStringColorChannels | NullObject;
/**
* extract origin color
* @param value - CSS color value
* @param [opt] - options
* @returns origin color value
*/
export declare function extractOriginColor(value: string, opt?: Options): string | NullObject;
/**
* resolve relative color
* @param value - CSS relative color value
* @param [opt] - options
* @returns resolved value
*/
export declare function resolveRelativeColor(value: string, opt?: Options): string | NullObject;
export {};

View File

@@ -0,0 +1,451 @@
import { CacheItem, NullObject, createCacheKey, getCache, setCache } from "./cache.js";
import { isString, isStringOrNumber } from "./common.js";
import { CS_LAB, CS_LCH, FN_REL, FN_REL_CAPT, FN_VAR, NONE, SYN_COLOR_TYPE, SYN_FN_MATH_START, SYN_FN_VAR, SYN_MIX, VAL_SPEC } from "./constant.js";
import { NAMED_COLORS, convertColorToRgb } from "./color.js";
import { resolveColor } from "./resolve.js";
import { roundToPrecision, splitValue } from "./util.js";
import { resolveDimension, serializeCalc } from "./css-calc.js";
import { TokenType, tokenize } from "@csstools/css-tokenizer";
import { SyntaxFlag, color } from "@csstools/css-color-parser";
import { parseComponentValue } from "@csstools/css-parser-algorithms";
//#region src/js/relative-color.ts
/**
* relative-color
*/
var { CloseParen: PAREN_CLOSE, Comment: COMMENT, Delim: DELIM, Dimension: DIM, EOF, Function: FUNC, Ident: IDENT, Number: NUM, OpenParen: PAREN_OPEN, Percentage: PCT, Whitespace: W_SPACE } = TokenType;
var { HasNoneKeywords: KEY_NONE } = SyntaxFlag;
var NAMESPACE = "relative-color";
var OCT = 8;
var DEC = 10;
var HEX = 16;
var MAX_PCT = 100;
var MAX_RGB = 255;
var COLOR_CHANNELS = new Map([
["color", [
"r",
"g",
"b",
"alpha"
]],
["hsl", [
"h",
"s",
"l",
"alpha"
]],
["hsla", [
"h",
"s",
"l",
"alpha"
]],
["hwb", [
"h",
"w",
"b",
"alpha"
]],
["lab", [
"l",
"a",
"b",
"alpha"
]],
["lch", [
"l",
"c",
"h",
"alpha"
]],
["oklab", [
"l",
"a",
"b",
"alpha"
]],
["oklch", [
"l",
"c",
"h",
"alpha"
]],
["rgb", [
"r",
"g",
"b",
"alpha"
]],
["rgba", [
"r",
"g",
"b",
"alpha"
]]
]);
var REG_COLOR_CAPT = new RegExp(`^${FN_REL}(${SYN_COLOR_TYPE}|${SYN_MIX})\\s+`);
var REG_CS_HSL = /(?:hsla?|hwb)$/;
var REG_CS_CIE = new RegExp(`^(?:${CS_LAB}|${CS_LCH})$`);
var REG_FN_CALC_SUM = /^(?:abs|sig?n|cos|tan)\(/;
var REG_FN_MATH_START = new RegExp(SYN_FN_MATH_START);
var REG_FN_REL = new RegExp(FN_REL);
var REG_FN_REL_CAPT = new RegExp(`^${FN_REL_CAPT}`);
var REG_FN_REL_START = new RegExp(`^${FN_REL}`);
var REG_FN_VAR = new RegExp(SYN_FN_VAR);
/**
* resolve relative color channels
* @param value
* - CSS color value
* - system colors are not supported
* @param [opt] - options
* @param [opt.currentColor]
* - color to use for `currentcolor` keyword
* - if omitted, it will be treated as a missing color
* i.e. `rgb(none none none / none)`
* @param [opt.customProperty]
* - custom properties
* - pair of `--` prefixed property name and value,
* e.g. `customProperty: { '--some-color': '#0000ff' }`
* - and/or `callback` function to get the value of the custom property,
* e.g. `customProperty: { callback: someDeclaration.getPropertyValue }`
* @param [opt.dimension]
* - dimension, convert relative length to pixels
* - pair of unit and it's value as a number in pixels,
* e.g. `dimension: { em: 12, rem: 16, vw: 10.26 }`
* - and/or `callback` function to get the value as a number in pixels,
* e.g. `dimension: { callback: convertUnitToPixel }`
* @param [opt.format]
* - output format, one of below
* - `computedValue` (default), [computed value][139] of the color
* - `specifiedValue`, [specified value][140] of the color
* - `hex`, hex color notation, i.e. `rrggbb`
* - `hexAlpha`, hex color notation with alpha channel, i.e. `#rrggbbaa`
* @returns
* - one of rgba?(), #rrggbb(aa)?, color-name, '(empty-string)',
* color(color-space r g b / alpha), color(color-space x y z / alpha),
* lab(l a b / alpha), lch(l c h / alpha), oklab(l a b / alpha),
* oklch(l c h / alpha), null
* - in `computedValue`, values are numbers, however `rgb()` values are
* integers
* - in `specifiedValue`, returns `empty string` for unknown and/or invalid
* color
* - in `hex`, returns `null` for `transparent`, and also returns `null` if
* any of `r`, `g`, `b`, `alpha` is not a number
* - in `hexAlpha`, returns `#00000000` for `transparent`,
* however returns `null` if any of `r`, `g`, `b`, `alpha` is not a number
*/
function resolveColorChannels(tokens, opt = {}) {
if (!Array.isArray(tokens)) throw new TypeError(`${tokens} is not an array.`);
const { colorSpace = "", format = "" } = opt;
const colorChannel = COLOR_CHANNELS.get(colorSpace);
if (!colorChannel) return new NullObject();
const mathFunc = /* @__PURE__ */ new Set();
const channels = [
[],
[],
[],
[]
];
let i = 0;
let nest = 0;
let func = "";
let precededPct = false;
for (const token of tokens) {
if (!Array.isArray(token)) throw new TypeError(`${token} is not an array.`);
const [type, value, , , detail] = token;
const channel = channels[i];
if (Array.isArray(channel)) switch (type) {
case DELIM:
if (func) {
if ((value === "+" || value === "-") && precededPct && !REG_FN_CALC_SUM.test(func)) return new NullObject();
precededPct = false;
channel.push(value);
}
break;
case DIM: {
if (!func || !REG_FN_CALC_SUM.test(func)) return new NullObject();
const resolvedValue = resolveDimension(token, opt);
if (isString(resolvedValue)) channel.push(resolvedValue);
else channel.push(value);
break;
}
case FUNC:
channel.push(value);
func = value;
nest++;
if (REG_FN_MATH_START.test(value)) mathFunc.add(nest);
break;
case IDENT:
if (!colorChannel.includes(value)) return new NullObject();
channel.push(value);
if (!func) i++;
break;
case NUM:
channel.push(Number(detail?.value));
if (!func) i++;
break;
case PAREN_OPEN:
channel.push(value);
nest++;
break;
case PAREN_CLOSE:
if (func) {
if (channel[channel.length - 1] === " ") channel[channel.length - 1] = value;
else channel.push(value);
if (mathFunc.has(nest)) mathFunc.delete(nest);
nest--;
if (nest === 0) {
func = "";
i++;
}
}
break;
case PCT:
if (!func) return new NullObject();
else if (!REG_FN_CALC_SUM.test(func)) {
let lastValue;
for (let j = channel.length - 1; j >= 0; j--) if (channel[j] !== " ") {
lastValue = channel[j];
break;
}
if (lastValue === "+" || lastValue === "-") return new NullObject();
else if (lastValue === "*" || lastValue === "/") precededPct = false;
else precededPct = true;
}
channel.push(Number(detail?.value) / MAX_PCT);
break;
case W_SPACE:
if (channel.length && func) {
const lastValue = channel[channel.length - 1];
if (typeof lastValue === "number") channel.push(value);
else if (isString(lastValue) && !lastValue.endsWith("(") && lastValue !== " ") channel.push(value);
}
break;
default: if (type !== COMMENT && type !== EOF && func) channel.push(value);
}
}
const channelValues = [];
for (const channel of channels) if (channel.length === 1) {
const [resolvedValue] = channel;
if (isStringOrNumber(resolvedValue)) channelValues.push(resolvedValue);
} else if (channel.length) {
const resolvedValue = serializeCalc(channel.join(""), { format });
channelValues.push(resolvedValue);
}
return channelValues;
}
/**
* extract origin color
* @param value - CSS color value
* @param [opt] - options
* @returns origin color value
*/
function extractOriginColor(value, opt = {}) {
const { colorScheme = "normal", currentColor = "", format = "" } = opt;
if (isString(value)) {
value = value.toLowerCase().trim();
if (!value) return new NullObject();
if (!REG_FN_REL_START.test(value)) return value;
} else return new NullObject();
const cacheKey = createCacheKey({
namespace: NAMESPACE,
name: "extractOriginColor",
value
}, opt);
const cachedResult = getCache(cacheKey);
if (cachedResult instanceof CacheItem) {
if (cachedResult.isNull) return cachedResult;
return cachedResult.item;
}
if (/currentcolor/.test(value)) if (currentColor) value = value.replace(/currentcolor/g, currentColor);
else {
setCache(cacheKey, null);
return new NullObject();
}
let colorSpace = "";
if (REG_FN_REL_CAPT.test(value)) [, colorSpace] = value.match(REG_FN_REL_CAPT);
opt.colorSpace = colorSpace;
if (value.includes("light-dark(")) {
const [, originColor = ""] = splitValue(value.replace(new RegExp(`^${colorSpace}\\(`), "").replace(/\)$/, ""));
const specifiedOriginColor = resolveColor(originColor, {
colorScheme,
format: VAL_SPEC
});
if (specifiedOriginColor === "") {
setCache(cacheKey, null);
return new NullObject();
}
if (format === "specifiedValue") value = value.replace(originColor, specifiedOriginColor);
else {
const resolvedOriginColor = resolveColor(specifiedOriginColor, opt);
if (isString(resolvedOriginColor)) value = value.replace(originColor, resolvedOriginColor);
}
}
if (REG_COLOR_CAPT.test(value)) {
const [, originColor] = value.match(REG_COLOR_CAPT);
const [, restValue] = value.split(originColor);
if (/^[a-z]+$/.test(originColor)) {
if (!/^transparent$/.test(originColor) && !Object.hasOwn(NAMED_COLORS, originColor)) {
setCache(cacheKey, null);
return new NullObject();
}
} else if (format === "specifiedValue") {
const resolvedOriginColor = resolveColor(originColor, opt);
if (isString(resolvedOriginColor)) value = value.replace(originColor, resolvedOriginColor);
}
if (format === "specifiedValue") {
const channelValues = resolveColorChannels(tokenize({ css: restValue }), opt);
if (channelValues instanceof NullObject) {
setCache(cacheKey, null);
return channelValues;
}
const [v1, v2, v3, v4] = channelValues;
let channelValue = "";
if (isStringOrNumber(v4)) channelValue = ` ${v1} ${v2} ${v3} / ${v4})`;
else channelValue = ` ${channelValues.join(" ")})`;
if (restValue !== channelValue) value = value.replace(restValue, channelValue);
}
} else {
const [, restValue] = value.split(REG_FN_REL_START);
const tokens = tokenize({ css: restValue });
const originColor = [];
let nest = 0;
let tokenIndex = 0;
for (const [type, tokenValue] of tokens) {
tokenIndex++;
switch (type) {
case FUNC:
case PAREN_OPEN:
originColor.push(tokenValue);
nest++;
break;
case PAREN_CLOSE: {
const lastValue = originColor[originColor.length - 1];
if (lastValue === " ") originColor[originColor.length - 1] = tokenValue;
else if (isString(lastValue)) originColor.push(tokenValue);
nest--;
break;
}
case W_SPACE: {
const lastValue = originColor[originColor.length - 1];
if (isString(lastValue) && !lastValue.endsWith("(") && lastValue !== " ") originColor.push(tokenValue);
break;
}
default: if (type !== COMMENT && type !== EOF) originColor.push(tokenValue);
}
if (nest === 0) break;
}
const resolvedOriginColor = resolveRelativeColor(originColor.join("").trim(), opt);
if (resolvedOriginColor instanceof NullObject) {
setCache(cacheKey, null);
return resolvedOriginColor;
}
const channelValues = resolveColorChannels(tokens.slice(tokenIndex), opt);
if (channelValues instanceof NullObject) {
setCache(cacheKey, null);
return channelValues;
}
const [v1, v2, v3, v4] = channelValues;
let channelValue = "";
if (isStringOrNumber(v4)) channelValue = ` ${v1} ${v2} ${v3} / ${v4})`;
else channelValue = ` ${channelValues.join(" ")})`;
value = value.replace(restValue, `${resolvedOriginColor}${channelValue}`);
}
setCache(cacheKey, value);
return value;
}
/**
* resolve relative color
* @param value - CSS relative color value
* @param [opt] - options
* @returns resolved value
*/
function resolveRelativeColor(value, opt = {}) {
const { format = "" } = opt;
if (isString(value)) {
if (REG_FN_VAR.test(value)) {
if (format !== "specifiedValue") throw new SyntaxError(`Unexpected token ${FN_VAR} found.`);
return value;
} else if (!REG_FN_REL.test(value)) return value;
value = value.toLowerCase().trim();
} else throw new TypeError(`${value} is not a string.`);
const cacheKey = createCacheKey({
namespace: NAMESPACE,
name: "resolveRelativeColor",
value
}, opt);
const cachedResult = getCache(cacheKey);
if (cachedResult instanceof CacheItem) {
if (cachedResult.isNull) return cachedResult;
return cachedResult.item;
}
const originColor = extractOriginColor(value, opt);
if (originColor instanceof NullObject) {
setCache(cacheKey, null);
return originColor;
}
value = originColor;
if (format === "specifiedValue") {
if (value.startsWith("rgba(")) value = value.replace("rgba(", "rgb(");
else if (value.startsWith("hsla(")) value = value.replace("hsla(", "hsl(");
return value;
}
const parsedComponents = color(parseComponentValue(tokenize({ css: value })));
if (!parsedComponents) {
setCache(cacheKey, null);
return new NullObject();
}
const { alpha: alphaComponent, channels: channelsComponent, colorNotation, syntaxFlags } = parsedComponents;
let alpha;
if (Number.isNaN(Number(alphaComponent))) if (syntaxFlags instanceof Set && syntaxFlags.has(KEY_NONE)) alpha = NONE;
else alpha = 0;
else alpha = roundToPrecision(Number(alphaComponent), OCT);
let v1;
let v2;
let v3;
[v1, v2, v3] = channelsComponent;
let resolvedValue;
if (REG_CS_CIE.test(colorNotation)) {
const hasNone = syntaxFlags instanceof Set && syntaxFlags.has(KEY_NONE);
if (Number.isNaN(v1)) if (hasNone) v1 = NONE;
else v1 = 0;
else v1 = roundToPrecision(v1, HEX);
if (Number.isNaN(v2)) if (hasNone) v2 = NONE;
else v2 = 0;
else v2 = roundToPrecision(v2, HEX);
if (Number.isNaN(v3)) if (hasNone) v3 = NONE;
else v3 = 0;
else v3 = roundToPrecision(v3, HEX);
if (alpha === 1) resolvedValue = `${colorNotation}(${v1} ${v2} ${v3})`;
else resolvedValue = `${colorNotation}(${v1} ${v2} ${v3} / ${alpha})`;
} else if (REG_CS_HSL.test(colorNotation)) {
if (Number.isNaN(v1)) v1 = 0;
if (Number.isNaN(v2)) v2 = 0;
if (Number.isNaN(v3)) v3 = 0;
let [r, g, b] = convertColorToRgb(`${colorNotation}(${v1} ${v2} ${v3} / ${alpha})`);
r = roundToPrecision(r / MAX_RGB, DEC);
g = roundToPrecision(g / MAX_RGB, DEC);
b = roundToPrecision(b / MAX_RGB, DEC);
if (alpha === 1) resolvedValue = `color(srgb ${r} ${g} ${b})`;
else resolvedValue = `color(srgb ${r} ${g} ${b} / ${alpha})`;
} else {
const cs = colorNotation === "rgb" ? "srgb" : colorNotation;
const hasNone = syntaxFlags instanceof Set && syntaxFlags.has(KEY_NONE);
if (Number.isNaN(v1)) if (hasNone) v1 = NONE;
else v1 = 0;
else v1 = roundToPrecision(v1, DEC);
if (Number.isNaN(v2)) if (hasNone) v2 = NONE;
else v2 = 0;
else v2 = roundToPrecision(v2, DEC);
if (Number.isNaN(v3)) if (hasNone) v3 = NONE;
else v3 = 0;
else v3 = roundToPrecision(v3, DEC);
if (alpha === 1) resolvedValue = `color(${cs} ${v1} ${v2} ${v3})`;
else resolvedValue = `color(${cs} ${v1} ${v2} ${v3} / ${alpha})`;
}
setCache(cacheKey, resolvedValue);
return resolvedValue;
}
//#endregion
export { resolveRelativeColor };
//# sourceMappingURL=relative-color.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,15 @@
import { NullObject } from './cache.js';
import { Options } from './typedef.js';
/**
* resolve color
* @param value - CSS color value
* @param [opt] - options
* @returns resolved color
*/
export declare const resolveColor: (value: string, opt?: Options) => string | NullObject;
/**
* resolve CSS color
* @param value - CSS color value. system colors are not supported
* @param [opt] - options
*/
export declare const resolve: (value: string, opt?: Options) => string | null;

View File

@@ -0,0 +1,210 @@
import { CacheItem, NullObject, createCacheKey, getCache, setCache } from "./cache.js";
import { isString } from "./common.js";
import { SYN_FN_CALC, SYN_FN_LIGHT_DARK, SYN_FN_REL, SYN_FN_VAR, VAL_COMP, VAL_SPEC } from "./constant.js";
import { convertRgbToHex, resolveColorFunc, resolveColorMix, resolveColorValue } from "./color.js";
import { resolveRelativeColor } from "./relative-color.js";
import { splitValue } from "./util.js";
import { resolveVar } from "./css-var.js";
import { cssCalc } from "./css-calc.js";
//#region src/js/resolve.ts
/**
* resolve
*/
var NAMESPACE = "resolve";
var RGB_TRANSPARENT = "rgba(0, 0, 0, 0)";
var REG_FN_CALC = new RegExp(SYN_FN_CALC);
var REG_FN_LIGHT_DARK = new RegExp(SYN_FN_LIGHT_DARK);
var REG_FN_REL = new RegExp(SYN_FN_REL);
var REG_FN_VAR = new RegExp(SYN_FN_VAR);
/**
* resolve color
* @param value - CSS color value
* @param [opt] - options
* @returns resolved color
*/
var resolveColor = (value, opt = {}) => {
if (!isString(value)) throw new TypeError(`${value} is not a string.`);
value = value.trim();
const { colorScheme = "normal", currentColor = "", format = VAL_COMP, nullable = false } = opt;
const cacheKey = createCacheKey({
namespace: NAMESPACE,
name: "resolve",
value
}, opt);
const cachedResult = getCache(cacheKey);
if (cachedResult instanceof CacheItem) {
if (cachedResult.isNull) return cachedResult;
return cachedResult.item;
}
if (REG_FN_VAR.test(value)) {
if (format === "specifiedValue") {
setCache(cacheKey, value);
return value;
}
const resolvedVar = resolveVar(value, opt);
if (resolvedVar instanceof NullObject) {
const res = format === "hex" || format === "hexAlpha" || nullable ? resolvedVar : RGB_TRANSPARENT;
setCache(cacheKey, res);
return res;
}
value = resolvedVar;
}
if (opt.format !== format) opt.format = format;
value = value.toLowerCase();
if (REG_FN_LIGHT_DARK.test(value) && value.endsWith(")")) {
const [light = "", dark = ""] = splitValue(value.replace(REG_FN_LIGHT_DARK, "").replace(/\)$/, ""), { delimiter: "," });
if (light && dark) {
if (format === "specifiedValue") {
const lightColor = resolveColor(light, opt);
const darkColor = resolveColor(dark, opt);
const res = lightColor && darkColor ? `light-dark(${lightColor}, ${darkColor})` : "";
setCache(cacheKey, res);
return res;
}
const resolved = resolveColor(colorScheme === "dark" ? dark : light, opt);
const res = resolved instanceof NullObject && !nullable ? RGB_TRANSPARENT : resolved;
setCache(cacheKey, res);
return res;
}
const invalidRes = format === "specifiedValue" ? "" : format === "hex" || format === "hexAlpha" ? new NullObject() : RGB_TRANSPARENT;
setCache(cacheKey, invalidRes);
return invalidRes;
}
if (REG_FN_REL.test(value)) {
const resolvedRel = resolveRelativeColor(value, opt);
if (format === "computedValue") {
const res = resolvedRel instanceof NullObject && !nullable ? RGB_TRANSPARENT : resolvedRel;
setCache(cacheKey, res);
return res;
}
if (format === "specifiedValue") {
const res = resolvedRel instanceof NullObject ? "" : resolvedRel;
setCache(cacheKey, res);
return res;
}
value = resolvedRel instanceof NullObject ? "" : resolvedRel;
}
if (REG_FN_CALC.test(value)) value = cssCalc(value, opt);
let cs = "";
let r = NaN;
let g = NaN;
let b = NaN;
let alpha = NaN;
if (value === "transparent") {
let res;
switch (format) {
case VAL_SPEC:
res = value;
break;
case "hex":
res = new NullObject();
break;
case "hexAlpha":
res = "#00000000";
break;
default: res = RGB_TRANSPARENT;
}
setCache(cacheKey, res);
return res;
}
if (value === "currentcolor") {
if (format === "specifiedValue") {
setCache(cacheKey, value);
return value;
}
if (currentColor) {
let resolvedCurrent;
if (currentColor.startsWith("color-mix(")) resolvedCurrent = resolveColorMix(currentColor, opt);
else if (currentColor.startsWith("color(")) resolvedCurrent = resolveColorFunc(currentColor, opt);
else resolvedCurrent = resolveColorValue(currentColor, opt);
if (resolvedCurrent instanceof NullObject) {
setCache(cacheKey, resolvedCurrent);
return resolvedCurrent;
}
[cs, r, g, b, alpha] = resolvedCurrent;
} else {
const res = format === "computedValue" ? RGB_TRANSPARENT : value;
if (format === "computedValue") {
setCache(cacheKey, res);
return res;
}
}
} else if (format === "specifiedValue") {
let res = "";
if (value.startsWith("color-mix(")) res = resolveColorMix(value, opt);
else if (value.startsWith("color(")) {
const [scs, rr, gg, bb, aa] = resolveColorFunc(value, opt);
res = aa === 1 ? `color(${scs} ${rr} ${gg} ${bb})` : `color(${scs} ${rr} ${gg} ${bb} / ${aa})`;
} else {
const rgb = resolveColorValue(value, opt);
if (isString(rgb)) res = rgb;
else {
const [scs, rr, gg, bb, aa] = rgb;
if (scs === "rgb") res = aa === 1 ? `${scs}(${rr}, ${gg}, ${bb})` : `${scs}a(${rr}, ${gg}, ${bb}, ${aa})`;
else res = aa === 1 ? `${scs}(${rr} ${gg} ${bb})` : `${scs}(${rr} ${gg} ${bb} / ${aa})`;
}
}
setCache(cacheKey, res);
return res;
} else if (value.startsWith("color-mix(")) {
if (currentColor) value = value.replace(/currentcolor/g, currentColor);
value = value.replace(/transparent/g, RGB_TRANSPARENT);
const resolvedMix = resolveColorMix(value, opt);
if (resolvedMix instanceof NullObject) {
setCache(cacheKey, resolvedMix);
return resolvedMix;
}
[cs, r, g, b, alpha] = resolvedMix;
} else if (value.startsWith("color(")) {
const resolvedFunc = resolveColorFunc(value, opt);
if (resolvedFunc instanceof NullObject) {
setCache(cacheKey, resolvedFunc);
return resolvedFunc;
}
[cs, r, g, b, alpha] = resolvedFunc;
} else if (value) {
const resolvedVal = resolveColorValue(value, opt);
if (resolvedVal instanceof NullObject) {
setCache(cacheKey, resolvedVal);
return resolvedVal;
}
[cs, r, g, b, alpha] = resolvedVal;
}
let finalRes = "";
switch (format) {
case "hex":
case "hexAlpha":
if (Number.isNaN(r) || Number.isNaN(g) || Number.isNaN(b) || Number.isNaN(alpha) || format === "hex" && alpha === 0) finalRes = new NullObject();
else finalRes = convertRgbToHex([
r,
g,
b,
format === "hex" ? 1 : alpha
]);
break;
default: if (cs === "rgb") finalRes = alpha === 1 ? `${cs}(${r}, ${g}, ${b})` : `${cs}a(${r}, ${g}, ${b}, ${alpha})`;
else if ([
"lab",
"lch",
"oklab",
"oklch"
].includes(cs)) finalRes = alpha === 1 ? `${cs}(${r} ${g} ${b})` : `${cs}(${r} ${g} ${b} / ${alpha})`;
else finalRes = alpha === 1 ? `color(${cs} ${r} ${g} ${b})` : `color(${cs} ${r} ${g} ${b} / ${alpha})`;
}
setCache(cacheKey, finalRes);
return finalRes;
};
/**
* resolve CSS color
* @param value - CSS color value. system colors are not supported
* @param [opt] - options
*/
var resolve = (value, opt = {}) => {
opt.nullable = false;
const resolvedValue = resolveColor(value, opt);
return resolvedValue instanceof NullObject ? null : resolvedValue;
};
//#endregion
export { resolve, resolveColor };
//# sourceMappingURL=resolve.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,80 @@
/**
* typedef
*/
/**
* @typedef Options - options
* @property [alpha] - enable alpha
* @property [colorSpace] - color space
* @property [currentColor] - color for currentcolor
* @property [customProperty] - custom properties
* @property [d50] - white point in d50
* @property [dimension] - dimension
* @property [format] - output format
* @property [key] - key
*/
export interface Options {
alpha?: boolean;
colorScheme?: string;
colorSpace?: string;
currentColor?: string;
customProperty?: Record<string, string | ((K: string) => string)>;
d50?: boolean;
delimiter?: string | string[];
dimension?: Record<string, number | ((K: string) => number)>;
format?: string;
nullable?: boolean;
preserveComment?: boolean;
}
/**
* @type ColorChannels - color channels
*/
export type ColorChannels = [x: number, y: number, z: number, alpha: number];
/**
* @type StringColorChannels - color channels
*/
export type StringColorChannels = [
x: string,
y: string,
z: string,
alpha: string | undefined
];
/**
* @type StringColorSpacedChannels - specified value
*/
export type StringColorSpacedChannels = [
cs: string,
x: string,
y: string,
z: string,
alpha: string | undefined
];
/**
* @type ComputedColorChannels - computed value
*/
export type ComputedColorChannels = [
cs: string,
x: number,
y: number,
z: number,
alpha: number
];
/**
* @type SpecifiedColorChannels - specified value
*/
export type SpecifiedColorChannels = [
cs: string,
x: number | string,
y: number | string,
z: number | string,
alpha: number | string
];
/**
* @type MatchedRegExp - matched regexp array
*/
export type MatchedRegExp = [
match: string,
gr1: string,
gr2: string,
gr3: string,
gr4: string
];

View File

@@ -0,0 +1,59 @@
import { Options } from './typedef.js';
/**
* split value
* NOTE: comments are stripped, it can be preserved if, in the options param,
* `delimiter` is either ',' or '/' and with `preserveComment` set to `true`
* @param value - CSS value
* @param [opt] - options
* @returns array of values
*/
export declare const splitValue: (value: string, opt?: Options) => string[];
/**
* extract dashed-ident tokens
* @param value - CSS value
* @returns array of dashed-ident tokens
*/
export declare const extractDashedIdent: (value: string) => string[];
/**
* is color
* @param value - CSS value
* @param [opt] - options
* @returns result
*/
export declare const isColor: (value: unknown, opt?: Options) => boolean;
/**
* round to specified precision
* @param value - numeric value
* @param bit - minimum bits
* @returns rounded value
*/
export declare const roundToPrecision: (value: number, bit?: number) => number;
/**
* interpolate hue
* @param hueA - hue value
* @param hueB - hue value
* @param arc - shorter | longer | increasing | decreasing
* @returns result - [hueA, hueB]
*/
export declare const interpolateHue: (hueA: number, hueB: number, arc?: string) => [number, number];
/**
* resolve length in pixels
* @param value - value
* @param unit - unit
* @param [opt] - options
* @returns pixelated value
*/
export declare const resolveLengthInPixels: (value: number | string, unit: string | undefined, opt?: Options) => number;
/**
* is absolute size or length
* @param value - value
* @param unit - unit
* @returns result
*/
export declare const isAbsoluteSizeOrLength: (value: number | string, unit: string | undefined) => boolean;
/**
* is absolute font size
* @param css - css
* @returns result
*/
export declare const isAbsoluteFontSize: (css: unknown) => boolean;

274
node_modules/@asamuzakjp/css-color/dist/esm/js/util.js generated vendored Normal file
View File

@@ -0,0 +1,274 @@
import { CacheItem, createCacheKey, getCache, setCache } from "./cache.js";
import { isString } from "./common.js";
import { SYN_COLOR_TYPE, SYN_MIX, VAL_SPEC } from "./constant.js";
import { NAMED_COLORS } from "./color.js";
import { resolveColor } from "./resolve.js";
import { TokenType, tokenize } from "@csstools/css-tokenizer";
//#region src/js/util.ts
/**
* util
*/
var { CloseParen: PAREN_CLOSE, Comma: COMMA, Comment: COMMENT, Delim: DELIM, EOF, Function: FUNC, OpenParen: PAREN_OPEN, Whitespace: W_SPACE } = TokenType;
var NAMESPACE = "util";
var DEC = 10;
var HEX = 16;
var DEG = 360;
var DEG_HALF = 180;
var REG_COLOR = new RegExp(`^(?:${SYN_COLOR_TYPE})$`);
var REG_DIMENSION = /^([+-]?(?:\d+(?:\.\d+)?|\.\d+)(?:e[+-]?\d+)?)([a-z]*)$/i;
var REG_FN_COLOR = /^(?:(?:ok)?l(?:ab|ch)|color(?:-mix)?|hsla?|hwb|rgba?|var)\(/;
var REG_MIX = new RegExp(SYN_MIX);
var REG_DASHED_IDENT = /--[\w-]+/g;
var REG_COMMA = /^,$/;
var REG_SLASH = /^\/$/;
var REG_WHITESPACE = /^\s+$/;
/**
* split value
* NOTE: comments are stripped, it can be preserved if, in the options param,
* `delimiter` is either ',' or '/' and with `preserveComment` set to `true`
* @param value - CSS value
* @param [opt] - options
* @returns array of values
*/
var splitValue = (value, opt = {}) => {
if (!isString(value)) throw new TypeError(`${value} is not a string.`);
const strValue = value.trim();
const { delimiter = " ", preserveComment = false } = opt;
const cacheKey = createCacheKey({
namespace: NAMESPACE,
name: "splitValue",
value: strValue
}, {
delimiter,
preserveComment
});
const cachedResult = getCache(cacheKey);
if (cachedResult instanceof CacheItem) return cachedResult.item;
let regDelimiter;
switch (delimiter) {
case ",":
regDelimiter = REG_COMMA;
break;
case "/":
regDelimiter = REG_SLASH;
break;
default: regDelimiter = REG_WHITESPACE;
}
const tokens = tokenize({ css: strValue });
let nest = 0;
let currentStr = "";
const res = [];
for (const [type, val] of tokens) switch (type) {
case COMMA:
case DELIM:
if (nest === 0 && regDelimiter.test(val)) {
res.push(currentStr.trim());
currentStr = "";
} else currentStr += val;
break;
case COMMENT:
if (preserveComment && (delimiter === "," || delimiter === "/")) currentStr += val;
break;
case FUNC:
case PAREN_OPEN:
currentStr += val;
nest++;
break;
case PAREN_CLOSE:
currentStr += val;
nest--;
break;
case W_SPACE:
if (regDelimiter.test(val)) if (nest === 0) {
if (currentStr) {
res.push(currentStr.trim());
currentStr = "";
}
} else currentStr += " ";
else if (!currentStr.endsWith(" ")) currentStr += " ";
break;
default: if (type === EOF) {
res.push(currentStr.trim());
currentStr = "";
} else currentStr += val;
}
setCache(cacheKey, res);
return res;
};
/**
* extract dashed-ident tokens
* @param value - CSS value
* @returns array of dashed-ident tokens
*/
var extractDashedIdent = (value) => {
if (!isString(value)) throw new TypeError(`${value} is not a string.`);
const strValue = value.trim();
const cacheKey = createCacheKey({
namespace: NAMESPACE,
name: "extractDashedIdent",
value: strValue
});
const cachedResult = getCache(cacheKey);
if (cachedResult instanceof CacheItem) return cachedResult.item;
const matches = strValue.match(REG_DASHED_IDENT);
const res = matches ? [...new Set(matches)] : [];
setCache(cacheKey, res);
return res;
};
/**
* is color
* @param value - CSS value
* @param [opt] - options
* @returns result
*/
var isColor = (value, opt = {}) => {
if (!isString(value)) return false;
const str = value.toLowerCase().trim();
if (!str) return false;
if (/^[a-z]+$/.test(str)) return str === "currentcolor" || str === "transparent" || Object.hasOwn(NAMED_COLORS, str);
if (REG_COLOR.test(str) || REG_MIX.test(str)) return true;
if (REG_FN_COLOR.test(str)) {
const colorOpt = {
...opt,
nullable: true
};
if (!colorOpt.format) colorOpt.format = VAL_SPEC;
return !!resolveColor(str, colorOpt);
}
return false;
};
/**
* round to specified precision
* @param value - numeric value
* @param bit - minimum bits
* @returns rounded value
*/
var roundToPrecision = (value, bit = 0) => {
if (!Number.isFinite(value)) throw new TypeError(`${value} is not a finite number.`);
if (!Number.isFinite(bit)) throw new TypeError(`${bit} is not a finite number.`);
if (bit < 0 || bit > HEX) throw new RangeError(`${bit} is not between 0 and ${HEX}.`);
if (bit === 0) return Math.round(value);
const precision = bit === HEX ? 6 : bit < DEC ? 4 : 5;
return parseFloat(value.toPrecision(precision));
};
/**
* interpolate hue
* @param hueA - hue value
* @param hueB - hue value
* @param arc - shorter | longer | increasing | decreasing
* @returns result - [hueA, hueB]
*/
var interpolateHue = (hueA, hueB, arc = "shorter") => {
if (!Number.isFinite(hueA)) throw new TypeError(`${hueA} is not a finite number.`);
if (!Number.isFinite(hueB)) throw new TypeError(`${hueB} is not a finite number.`);
let a = hueA;
let b = hueB;
switch (arc) {
case "decreasing":
if (b > a) a += DEG;
break;
case "increasing":
if (b < a) b += DEG;
break;
case "longer":
if (b > a && b < a + DEG_HALF) a += DEG;
else if (b > a - DEG_HALF && b <= a) b += DEG;
break;
default: if (b > a + DEG_HALF) a += DEG;
else if (b < a - DEG_HALF) b += DEG;
}
return [a, b];
};
var absoluteFontSize = new Map([
["xx-small", 9 / 16],
["x-small", 5 / 8],
["small", 13 / 16],
["medium", 1],
["large", 9 / 8],
["x-large", 3 / 2],
["xx-large", 2],
["xxx-large", 3]
]);
var relativeFontSize = new Map([["smaller", 1 / 1.2], ["larger", 1.2]]);
var absoluteLength = new Map([
["cm", 96 / 2.54],
["mm", 96 / 25.4],
["q", 96 / 101.6],
["in", 96],
["pc", 16],
["pt", 96 / 72],
["px", 1]
]);
var relativeLength = new Map([
["rcap", 1],
["rch", .5],
["rem", 1],
["rex", .5],
["ric", 1],
["rlh", 1.2]
]);
/**
* resolve length in pixels
* @param value - value
* @param unit - unit
* @param [opt] - options
* @returns pixelated value
*/
var resolveLengthInPixels = (value, unit, opt = {}) => {
const { dimension = {} } = opt;
const { callback, em, rem, vh, vw } = dimension;
if (isString(value)) {
const str = value.toLowerCase().trim();
const ratio = absoluteFontSize.get(str);
if (ratio !== void 0) return ratio * rem;
const relRatio = relativeFontSize.get(str);
if (relRatio !== void 0) return relRatio * em;
return NaN;
}
if (Number.isFinite(value) && unit) {
const u = unit.toLowerCase();
if (Object.hasOwn(dimension, u)) return value * Number(dimension[u]);
if (typeof callback === "function") return value * (callback(u) ?? NaN);
const absRatio = absoluteLength.get(u);
if (absRatio !== void 0) return value * absRatio;
const relRatio = relativeLength.get(u);
if (relRatio !== void 0) return value * relRatio * rem;
const rUnitRatio = relativeLength.get(`r${u}`);
if (rUnitRatio !== void 0) return value * rUnitRatio * em;
switch (u) {
case "vb":
case "vi": return value * vw;
case "vmax": return value * Math.max(vh, vw);
case "vmin": return value * Math.min(vh, vw);
default:
}
}
return NaN;
};
/**
* is absolute size or length
* @param value - value
* @param unit - unit
* @returns result
*/
var isAbsoluteSizeOrLength = (value, unit) => {
if (isString(value)) return absoluteFontSize.has(value.toLowerCase().trim());
if (isString(unit)) return absoluteLength.has(unit.toLowerCase().trim());
return value === 0;
};
/**
* is absolute font size
* @param css - css
* @returns result
*/
var isAbsoluteFontSize = (css) => {
if (!isString(css)) return false;
const str = css.trim();
if (isAbsoluteSizeOrLength(str, void 0)) return true;
const match = str.match(REG_DIMENSION);
return match ? isAbsoluteSizeOrLength(Number(match[1]), match[2] || void 0) : false;
};
//#endregion
export { extractDashedIdent, interpolateHue, isAbsoluteFontSize, isAbsoluteSizeOrLength, isColor, resolveLengthInPixels, roundToPrecision, splitValue };
//# sourceMappingURL=util.js.map

File diff suppressed because one or more lines are too long

89
node_modules/@asamuzakjp/css-color/package.json generated vendored Normal file
View File

@@ -0,0 +1,89 @@
{
"name": "@asamuzakjp/css-color",
"description": "CSS color - Resolve and convert CSS colors.",
"author": "asamuzaK",
"license": "MIT",
"repository": {
"type": "git",
"url": "git+https://github.com/asamuzaK/cssColor.git"
},
"homepage": "https://github.com/asamuzaK/cssColor#readme",
"bugs": {
"url": "https://github.com/asamuzaK/cssColor/issues"
},
"files": [
"dist",
"src"
],
"type": "module",
"exports": {
".": {
"types": "./dist/esm/index.d.ts",
"default": "./dist/esm/index.js"
},
"./package.json": "./package.json"
},
"dependencies": {
"@asamuzakjp/generational-cache": "^1.0.1",
"@csstools/css-calc": "^3.2.0",
"@csstools/css-color-parser": "^4.1.0",
"@csstools/css-parser-algorithms": "^4.0.0",
"@csstools/css-tokenizer": "^4.0.0"
},
"devDependencies": {
"@tanstack/vite-config": "^0.5.2",
"@types/node": "^25.6.0",
"@vitest/coverage-istanbul": "^4.1.4",
"esbuild": "^0.27.7",
"eslint": "^9.39.4",
"eslint-plugin-regexp": "^3.1.0",
"globals": "^17.5.0",
"knip": "^6.4.1",
"mitata": "^1.0.34",
"neostandard": "^0.13.0",
"prettier": "^3.8.3",
"publint": "^0.3.18",
"rimraf": "^6.1.3",
"tsx": "^4.21.0",
"typescript": "^5.9.3",
"vite": "^8.0.8",
"vitest": "^4.1.4"
},
"packageManager": "pnpm@10.33.0",
"pnpm": {
"onlyBuiltDependencies": [
"esbuild",
"oxc-resolver",
"unrs-resolver"
],
"overrides": {
"ajv": "^8.18.0",
"@eslint/eslintrc>ajv": "^6.14.0",
"eslint>ajv": "^6.14.0",
"brace-expansion": "^5.0.4",
"minimatch": "^3.1.5",
"@typescript-eslint/typescript-estree>minimatch": "^9.0.9",
"@vue/language-core>minimatch": "^9.0.9",
"eslint-plugin-import-x>minimatch": "^10.2.4",
"glob>minimatch": "^10.2.4",
"lodash@>=4.0.0 <=4.17.23": ">=4.18.0",
"lodash@<=4.17.23": ">=4.18.0"
}
},
"scripts": {
"bench:color": "npx tsx --expose-gc ./benchmark/bench-color.ts",
"build": "pnpm run clean && pnpm run test && pnpm run knip && vite build && pnpm run publint",
"clean": "rimraf ./coverage ./dist",
"knip": "knip",
"prettier": "prettier . --ignore-unknown --write",
"publint": "publint --strict",
"test": "pnpm run prettier && pnpm run --stream \"/^test:.*/\"",
"test:eslint": "eslint ./src ./test --fix",
"test:types": "tsc",
"test:unit": "vitest"
},
"engines": {
"node": "^20.19.0 || ^22.12.0 || >=24.0.0"
},
"version": "5.1.11"
}

34
node_modules/@asamuzakjp/css-color/src/index.ts generated vendored Normal file
View File

@@ -0,0 +1,34 @@
/*!
* CSS color - Resolve, parse, convert CSS color.
* @license MIT
* @copyright asamuzaK (Kazz)
* @see {@link https://github.com/asamuzaK/cssColor/blob/main/LICENSE}
*/
import { cssCalc } from './js/css-calc';
import { isGradient, resolveGradient } from './js/css-gradient';
import { cssVar } from './js/css-var';
import {
extractDashedIdent,
isAbsoluteFontSize,
isAbsoluteSizeOrLength,
isColor,
resolveLengthInPixels,
splitValue
} from './js/util';
export { convert } from './js/convert';
export { resolve } from './js/resolve';
/* utils */
export const utils = {
cssCalc,
cssVar,
extractDashedIdent,
isAbsoluteFontSize,
isAbsoluteSizeOrLength,
isColor,
isGradient,
resolveGradient,
resolveLengthInPixels,
splitValue
};

137
node_modules/@asamuzakjp/css-color/src/js/cache.ts generated vendored Normal file
View File

@@ -0,0 +1,137 @@
/**
* cache
*/
import { GenerationalCache } from '@asamuzakjp/generational-cache';
import { Options } from './typedef';
/* constants */
const CACHE_SIZE = 2048;
/**
* CacheItem
*/
export class CacheItem {
/* private */
#isNull: boolean;
#item: unknown;
constructor(item: unknown, isNull: boolean = false) {
this.#item = item;
this.#isNull = !!isNull;
}
get item() {
return this.#item;
}
get isNull() {
return this.#isNull;
}
}
/**
* NullObject
*/
export class NullObject extends CacheItem {
constructor() {
super(Symbol('null'), true);
}
}
/*
* generational cache instance
*/
export const genCache = new GenerationalCache<string, CacheItem>(CACHE_SIZE);
/**
* shared null object
*/
const sharedNullObject = new NullObject();
/**
* set cache
* @param key - cache key
* @param value - value to cache
* @returns void
*/
export const setCache = (key: string, value: unknown): void => {
if (!key) {
return;
}
if (value === null) {
genCache.set(key, sharedNullObject);
} else if (value instanceof CacheItem) {
genCache.set(key, value);
} else {
genCache.set(key, new CacheItem(value));
}
};
/**
* get cache
* @param key - cache key
* @returns cached item or false otherwise
*/
export const getCache = (key: string): CacheItem | false => {
if (!key) {
return false;
}
const item = genCache.get(key);
if (item !== undefined) {
return item as CacheItem;
}
return false;
};
/**
* helper function to sort object keys alphabetically
* @param obj - Object
* @returns stringified JSON
*/
const stringifySorted = (obj: Record<string, unknown>): string => {
const keys = Object.keys(obj);
if (keys.length === 0) {
return '';
}
keys.sort();
let result = '';
for (const key of keys) {
result += `${key}:${JSON.stringify(obj[key])};`;
}
return result;
};
/**
* create cache key
* @param keyData - key data
* @param [opt] - options
* @returns cache key
*/
export const createCacheKey = (
keyData: Record<string, string>,
opt: Options = {}
): string => {
if (
!keyData ||
(opt.customProperty && typeof opt.customProperty.callback === 'function') ||
(opt.dimension && typeof opt.dimension.callback === 'function')
) {
return '';
}
const namespace = keyData.namespace || '';
const name = keyData.name || '';
const value = keyData.value || '';
if (!namespace && !name && !value) {
return '';
}
const baseKey = `${namespace}:${name}:${value}`;
const optStr = `${opt.format || ''}|${opt.colorSpace || ''}|${opt.colorScheme || ''}|${opt.currentColor || ''}|${opt.d50 ? '1' : '0'}|${opt.nullable ? '1' : '0'}|${opt.preserveComment ? '1' : '0'}|${opt.delimiter || ''}`;
const customPropStr = opt.customProperty
? stringifySorted(opt.customProperty as Record<string, unknown>)
: '';
const dimStr = opt.dimension
? stringifySorted(opt.dimension as Record<string, unknown>)
: '';
return `${baseKey}::${optStr}::${customPropStr}::${dimStr}`;
};

3496
node_modules/@asamuzakjp/css-color/src/js/color.ts generated vendored Normal file

File diff suppressed because it is too large Load Diff

31
node_modules/@asamuzakjp/css-color/src/js/common.ts generated vendored Normal file
View File

@@ -0,0 +1,31 @@
/**
* common
*/
/* numeric constants */
const TYPE_FROM = 8;
const TYPE_TO = -1;
/**
* get type
* @param o - object to check
* @returns type of object
*/
export const getType = (o: unknown): string =>
Object.prototype.toString.call(o).slice(TYPE_FROM, TYPE_TO);
/**
* is string
* @param o - object to check
* @returns result
*/
export const isString = (o: unknown): o is string =>
typeof o === 'string' || o instanceof String;
/**
* is string or number
* @param o - object to check
* @returns result
*/
export const isStringOrNumber = (o: unknown): boolean =>
isString(o) || typeof o === 'number';

68
node_modules/@asamuzakjp/css-color/src/js/constant.ts generated vendored Normal file
View File

@@ -0,0 +1,68 @@
/**
* constant
*/
/* values and units */
const _DIGIT = '(?:0|[1-9]\\d*)';
const _COMPARE = 'clamp|max|min';
const _EXPO = 'exp|hypot|log|pow|sqrt';
const _SIGN = 'abs|sign';
const _STEP = 'mod|rem|round';
const _TRIG = 'a?(?:cos|sin|tan)|atan2';
const _MATH = `${_COMPARE}|${_EXPO}|${_SIGN}|${_STEP}|${_TRIG}`;
const _CALC = `calc|${_MATH}`;
const _VAR = `var|${_CALC}`;
export const ANGLE = 'deg|g?rad|turn';
export const LENGTH =
'[cm]m|[dls]?v(?:[bhiw]|max|min)|in|p[ctx]|q|r?(?:[cl]h|cap|e[mx]|ic)';
export const NUM = `[+-]?(?:${_DIGIT}(?:\\.\\d*)?|\\.\\d+)(?:e-?${_DIGIT})?`;
export const NUM_POSITIVE = `\\+?(?:${_DIGIT}(?:\\.\\d*)?|\\.\\d+)(?:e-?${_DIGIT})?`;
export const NONE = 'none';
export const PCT = `${NUM}%`;
export const SYN_FN_CALC = `^(?:${_CALC})\\(|(?<=[*\\/\\s\\(])(?:${_CALC})\\(`;
export const SYN_FN_MATH_START = `^(?:${_MATH})\\($`;
export const SYN_FN_VAR = '^var\\(|(?<=[*\\/\\s\\(])var\\(';
export const SYN_FN_VAR_START = `^(?:${_VAR})\\(`;
/* colors */
const _ALPHA = `(?:\\s*\\/\\s*(?:${NUM}|${PCT}|${NONE}))?`;
const _ALPHA_LV3 = `(?:\\s*,\\s*(?:${NUM}|${PCT}))?`;
const _COLOR_FUNC = '(?:ok)?l(?:ab|ch)|color|hsla?|hwb|rgba?';
const _COLOR_KEY = '[a-z]+|#[\\da-f]{3}|#[\\da-f]{4}|#[\\da-f]{6}|#[\\da-f]{8}';
const _CS_HUE = '(?:ok)?lch|hsl|hwb';
const _CS_HUE_ARC = '(?:de|in)creasing|longer|shorter';
const _NUM_ANGLE = `${NUM}(?:${ANGLE})?`;
const _NUM_ANGLE_NONE = `(?:${NUM}(?:${ANGLE})?|${NONE})`;
const _NUM_PCT_NONE = `(?:${NUM}|${PCT}|${NONE})`;
export const CS_HUE = `(?:${_CS_HUE})(?:\\s(?:${_CS_HUE_ARC})\\shue)?`;
export const CS_HUE_CAPT = `(${_CS_HUE})(?:\\s(${_CS_HUE_ARC})\\shue)?`;
export const CS_LAB = '(?:ok)?lab';
export const CS_LCH = '(?:ok)?lch';
export const CS_SRGB = 'srgb(?:-linear)?';
export const CS_RGB = `(?:a98|prophoto)-rgb|display-p3|rec2020|${CS_SRGB}`;
export const CS_XYZ = 'xyz(?:-d(?:50|65))?';
export const CS_RECT = `${CS_LAB}|${CS_RGB}|${CS_XYZ}`;
export const CS_MIX = `${CS_HUE}|${CS_RECT}`;
export const FN_COLOR = 'color(';
export const FN_LIGHT_DARK = 'light-dark(';
export const FN_MIX = 'color-mix(';
export const FN_REL = `(?:${_COLOR_FUNC})\\(\\s*from\\s+`;
export const FN_REL_CAPT = `(${_COLOR_FUNC})\\(\\s*from\\s+`;
export const FN_VAR = 'var(';
export const SYN_FN_COLOR = `(?:${CS_RGB}|${CS_XYZ})(?:\\s+${_NUM_PCT_NONE}){3}${_ALPHA}`;
export const SYN_FN_LIGHT_DARK = '^light-dark\\(';
export const SYN_FN_REL = `^${FN_REL}|(?<=[\\s])${FN_REL}`;
export const SYN_HSL = `${_NUM_ANGLE_NONE}(?:\\s+${_NUM_PCT_NONE}){2}${_ALPHA}`;
export const SYN_HSL_LV3 = `${_NUM_ANGLE}(?:\\s*,\\s*${PCT}){2}${_ALPHA_LV3}`;
export const SYN_LCH = `(?:${_NUM_PCT_NONE}\\s+){2}${_NUM_ANGLE_NONE}${_ALPHA}`;
export const SYN_MOD = `${_NUM_PCT_NONE}(?:\\s+${_NUM_PCT_NONE}){2}${_ALPHA}`;
export const SYN_RGB_LV3 = `(?:${NUM}(?:\\s*,\\s*${NUM}){2}|${PCT}(?:\\s*,\\s*${PCT}){2})${_ALPHA_LV3}`;
export const SYN_COLOR_TYPE = `${_COLOR_KEY}|hsla?\\(\\s*${SYN_HSL_LV3}\\s*\\)|rgba?\\(\\s*${SYN_RGB_LV3}\\s*\\)|(?:hsla?|hwb)\\(\\s*${SYN_HSL}\\s*\\)|(?:(?:ok)?lab|rgba?)\\(\\s*${SYN_MOD}\\s*\\)|(?:ok)?lch\\(\\s*${SYN_LCH}\\s*\\)|color\\(\\s*${SYN_FN_COLOR}\\s*\\)`;
export const SYN_MIX_PART = `(?:${SYN_COLOR_TYPE})(?:\\s+${PCT})?`;
export const SYN_MIX = `color-mix\\(\\s*in\\s+(?:${CS_MIX})\\s*,\\s*${SYN_MIX_PART}\\s*,\\s*${SYN_MIX_PART}\\s*\\)`;
export const SYN_MIX_CAPT = `color-mix\\(\\s*in\\s+(${CS_MIX})\\s*,\\s*(${SYN_MIX_PART})\\s*,\\s*(${SYN_MIX_PART})\\s*\\)`;
/* formats */
export const VAL_COMP = 'computedValue';
export const VAL_MIX = 'mixValue';
export const VAL_SPEC = 'specifiedValue';

331
node_modules/@asamuzakjp/css-color/src/js/convert.ts generated vendored Normal file
View File

@@ -0,0 +1,331 @@
/**
* convert
*/
import {
CacheItem,
NullObject,
createCacheKey,
getCache,
setCache
} from './cache';
import {
convertColorToHsl,
convertColorToHwb,
convertColorToLab,
convertColorToLch,
convertColorToOklab,
convertColorToOklch,
convertColorToRgb,
numberToHexString,
parseColorFunc,
parseColorValue
} from './color';
import { isString } from './common';
import { cssCalc } from './css-calc';
import { resolveVar } from './css-var';
import { resolveRelativeColor } from './relative-color';
import { resolveColor } from './resolve';
import { ColorChannels, ComputedColorChannels, Options } from './typedef';
/* constants */
import { SYN_FN_CALC, SYN_FN_REL, SYN_FN_VAR, VAL_COMP } from './constant';
const NAMESPACE = 'convert';
/* regexp */
const REG_FN_CALC = new RegExp(SYN_FN_CALC);
const REG_FN_REL = new RegExp(SYN_FN_REL);
const REG_FN_VAR = new RegExp(SYN_FN_VAR);
/**
* pre process
* @param value - CSS color value
* @param [opt] - options
* @returns value
*/
export const preProcess = (
value: string,
opt: Options = {}
): string | NullObject => {
if (!isString(value)) {
return new NullObject();
}
value = value.trim();
if (!value) {
return new NullObject();
}
const cacheKey: string = createCacheKey(
{ namespace: NAMESPACE, name: 'preProcess', value },
opt
);
const cachedResult = getCache(cacheKey);
if (cachedResult instanceof CacheItem) {
if (cachedResult.isNull) {
return cachedResult as NullObject;
}
return cachedResult.item as string;
}
let res: string | NullObject = value;
if (REG_FN_VAR.test(value)) {
const resolved = resolveVar(value, opt);
if (isString(resolved)) {
res = resolved;
} else {
setCache(cacheKey, null);
return new NullObject();
}
}
if (isString(res)) {
if (REG_FN_REL.test(res)) {
const resolved = resolveRelativeColor(res, opt);
if (isString(resolved)) {
res = resolved;
} else {
setCache(cacheKey, null);
return new NullObject();
}
} else if (REG_FN_CALC.test(res)) {
res = cssCalc(res, opt);
}
}
if (isString(res)) {
if (res.startsWith('color-mix')) {
res = resolveColor(res, { ...opt, format: VAL_COMP, nullable: true });
}
}
setCache(cacheKey, res);
return res;
};
/**
* converter factory to reduce boilerplate
* @param name - function name for cache
* @param format - color format
* @param convertFn - conversion function
* @returns color converter function
*/
const createColorConverter = (
name: string,
format: string,
convertFn: Function
) => {
const colorConverterFn = (
value: string,
opt: Options = {}
): ColorChannels => {
if (!isString(value)) {
throw new TypeError(`${value} is not a string.`);
}
const resolved = preProcess(value, opt);
if (resolved instanceof NullObject) {
return [0, 0, 0, 0];
}
const val = resolved.toLowerCase();
const cacheKey = createCacheKey(
{ namespace: NAMESPACE, name, value: val },
opt
);
const cached = getCache(cacheKey);
if (cached instanceof CacheItem) {
return cached.item as ColorChannels;
}
const result = convertFn(val, { ...opt, format }) as ColorChannels;
setCache(cacheKey, result);
return result;
};
return colorConverterFn;
};
/**
* convert number to hex string
* @param value - numeric value
* @returns hex string: 00..ff
*/
export const numberToHex = (value: number): string => numberToHexString(value);
/**
* convert color to hex
* @param value - CSS color value
* @param [opt] - options
* @param [opt.alpha] - enable alpha channel
* @returns #rrggbb | #rrggbbaa | null
*/
export const colorToHex = (value: string, opt: Options = {}): string | null => {
if (!isString(value)) {
throw new TypeError(`${value} is not a string.`);
}
const resolved = preProcess(value, opt);
if (resolved instanceof NullObject) {
return null;
}
const val = resolved.toLowerCase();
const cacheKey = createCacheKey(
{ namespace: NAMESPACE, name: 'colorToHex', value: val },
opt
);
const cached = getCache(cacheKey);
if (cached instanceof CacheItem) {
if (cached.isNull) {
return null;
}
return cached.item as string;
}
const hex = resolveColor(val, {
...opt,
nullable: true,
format: opt.alpha ? 'hexAlpha' : 'hex'
});
if (isString(hex)) {
setCache(cacheKey, hex);
return hex;
}
setCache(cacheKey, null);
return null;
};
/**
* convert color to hsl
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [h, s, l, alpha]
*/
export const colorToHsl = createColorConverter(
'colorToHsl',
'hsl',
convertColorToHsl
);
/**
* convert color to hwb
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [h, w, b, alpha]
*/
export const colorToHwb = createColorConverter(
'colorToHwb',
'hwb',
convertColorToHwb
);
/**
* convert color to lab
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [l, a, b, alpha]
*/
export const colorToLab = createColorConverter(
'colorToLab',
'lab',
convertColorToLab
);
/**
* convert color to lch
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [l, c, h, alpha]
*/
export const colorToLch = createColorConverter(
'colorToLch',
'lch',
convertColorToLch
);
/**
* convert color to oklab
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [l, a, b, alpha]
*/
export const colorToOklab = createColorConverter(
'colorToOklab',
'oklab',
convertColorToOklab
);
/**
* convert color to oklch
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [l, c, h, alpha]
*/
export const colorToOklch = createColorConverter(
'colorToOklch',
'oklch',
convertColorToOklch
);
/**
* convert color to rgb
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [r, g, b, alpha]
*/
export const colorToRgb = createColorConverter(
'colorToRgb',
'rgb',
convertColorToRgb
);
/**
* convert color to xyz
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [x, y, z, alpha]
*/
export const colorToXyz = (value: string, opt: Options = {}): ColorChannels => {
if (!isString(value)) {
throw new TypeError(`${value} is not a string.`);
}
const resolved = preProcess(value, opt);
if (resolved instanceof NullObject) {
return [0, 0, 0, 0];
}
const val = resolved.toLowerCase();
const cacheKey = createCacheKey(
{ namespace: NAMESPACE, name: 'colorToXyz', value: val },
opt
);
const cached = getCache(cacheKey);
if (cached instanceof CacheItem) {
return cached.item as ColorChannels;
}
let parsed;
if (val.startsWith('color(')) {
parsed = parseColorFunc(val, opt);
} else {
parsed = parseColorValue(val, opt);
}
const [, ...xyz] = parsed as ComputedColorChannels;
setCache(cacheKey, xyz);
return xyz as ColorChannels;
};
/**
* convert color to xyz-d50
* @param value - CSS color value
* @param [opt] - options
* @returns ColorChannels - [x, y, z, alpha]
*/
export const colorToXyzD50 = (
value: string,
opt: Options = {}
): ColorChannels => {
opt.d50 = true;
return colorToXyz(value, opt);
};
/* convert */
export const convert = {
colorToHex,
colorToHsl,
colorToHwb,
colorToLab,
colorToLch,
colorToOklab,
colorToOklch,
colorToRgb,
colorToXyz,
colorToXyzD50,
numberToHex
};

1008
node_modules/@asamuzakjp/css-color/src/js/css-calc.ts generated vendored Normal file

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,374 @@
/**
* css-gradient
*/
import { CacheItem, createCacheKey, getCache, setCache } from './cache';
import { resolveColor } from './resolve';
import { isString } from './common';
import { MatchedRegExp, Options } from './typedef';
import { isColor, splitValue } from './util';
/* constants */
import {
ANGLE,
CS_HUE,
CS_RECT,
LENGTH,
NUM,
NUM_POSITIVE,
PCT,
VAL_COMP,
VAL_SPEC
} from './constant';
const NAMESPACE = 'css-gradient';
const DIM_ANGLE = `${NUM}(?:${ANGLE})`;
const DIM_ANGLE_PCT = `${DIM_ANGLE}|${PCT}`;
const DIM_LEN = `${NUM}(?:${LENGTH})|0`;
const DIM_LEN_PCT = `${DIM_LEN}|${PCT}`;
const DIM_LEN_PCT_POSI = `${NUM_POSITIVE}(?:${LENGTH}|%)|0`;
const DIM_LEN_POSI = `${NUM_POSITIVE}(?:${LENGTH})|0`;
const CTR = 'center';
const L_R = 'left|right';
const T_B = 'top|bottom';
const S_E = 'start|end';
const AXIS_X = `${L_R}|x-(?:${S_E})`;
const AXIS_Y = `${T_B}|y-(?:${S_E})`;
const BLOCK = `block-(?:${S_E})`;
const INLINE = `inline-(?:${S_E})`;
const POS_1 = `${CTR}|${AXIS_X}|${AXIS_Y}|${BLOCK}|${INLINE}|${DIM_LEN_PCT}`;
const POS_2 = [
`(?:${CTR}|${AXIS_X})\\s+(?:${CTR}|${AXIS_Y})`,
`(?:${CTR}|${AXIS_Y})\\s+(?:${CTR}|${AXIS_X})`,
`(?:${CTR}|${AXIS_X}|${DIM_LEN_PCT})\\s+(?:${CTR}|${AXIS_Y}|${DIM_LEN_PCT})`,
`(?:${CTR}|${BLOCK})\\s+(?:${CTR}|${INLINE})`,
`(?:${CTR}|${INLINE})\\s+(?:${CTR}|${BLOCK})`,
`(?:${CTR}|${S_E})\\s+(?:${CTR}|${S_E})`
].join('|');
const POS_4 = [
`(?:${AXIS_X})\\s+(?:${DIM_LEN_PCT})\\s+(?:${AXIS_Y})\\s+(?:${DIM_LEN_PCT})`,
`(?:${AXIS_Y})\\s+(?:${DIM_LEN_PCT})\\s+(?:${AXIS_X})\\s+(?:${DIM_LEN_PCT})`,
`(?:${BLOCK})\\s+(?:${DIM_LEN_PCT})\\s+(?:${INLINE})\\s+(?:${DIM_LEN_PCT})`,
`(?:${INLINE})\\s+(?:${DIM_LEN_PCT})\\s+(?:${BLOCK})\\s+(?:${DIM_LEN_PCT})`,
`(?:${S_E})\\s+(?:${DIM_LEN_PCT})\\s+(?:${S_E})\\s+(?:${DIM_LEN_PCT})`
].join('|');
const RAD_EXTENT = '(?:clos|farth)est-(?:corner|side)';
const RAD_SIZE = [
`${RAD_EXTENT}(?:\\s+${RAD_EXTENT})?`,
`${DIM_LEN_POSI}`,
`(?:${DIM_LEN_PCT_POSI})\\s+(?:${DIM_LEN_PCT_POSI})`
].join('|');
const RAD_SHAPE = 'circle|ellipse';
const FROM_ANGLE = `from\\s+${DIM_ANGLE}`;
const AT_POSITION = `at\\s+(?:${POS_1}|${POS_2}|${POS_4})`;
const TO_SIDE_CORNER = `to\\s+(?:(?:${L_R})(?:\\s(?:${T_B}))?|(?:${T_B})(?:\\s(?:${L_R}))?)`;
const IN_COLOR_SPACE = `in\\s+(?:${CS_RECT}|${CS_HUE})`;
const LINE_SYNTAX_LINEAR = [
`(?:${DIM_ANGLE}|${TO_SIDE_CORNER})(?:\\s+${IN_COLOR_SPACE})?`,
`${IN_COLOR_SPACE}(?:\\s+(?:${DIM_ANGLE}|${TO_SIDE_CORNER}))?`
].join('|');
const LINE_SYNTAX_RADIAL = [
`(?:${RAD_SHAPE})(?:\\s+(?:${RAD_SIZE}))?(?:\\s+${AT_POSITION})?(?:\\s+${IN_COLOR_SPACE})?`,
`(?:${RAD_SIZE})(?:\\s+(?:${RAD_SHAPE}))?(?:\\s+${AT_POSITION})?(?:\\s+${IN_COLOR_SPACE})?`,
`${AT_POSITION}(?:\\s+${IN_COLOR_SPACE})?`,
`${IN_COLOR_SPACE}(?:\\s+${RAD_SHAPE})(?:\\s+(?:${RAD_SIZE}))?(?:\\s+${AT_POSITION})?`,
`${IN_COLOR_SPACE}(?:\\s+${RAD_SIZE})(?:\\s+(?:${RAD_SHAPE}))?(?:\\s+${AT_POSITION})?`,
`${IN_COLOR_SPACE}(?:\\s+${AT_POSITION})?`
].join('|');
const LINE_SYNTAX_CONIC = [
`${FROM_ANGLE}(?:\\s+${AT_POSITION})?(?:\\s+${IN_COLOR_SPACE})?`,
`${AT_POSITION}(?:\\s+${IN_COLOR_SPACE})?`,
`${IN_COLOR_SPACE}(?:\\s+${FROM_ANGLE})?(?:\\s+${AT_POSITION})?`
].join('|');
const DEFAULT_LINEAR = [/to\s+bottom/];
const DEFAULT_RADIAL = [/ellipse/, /farthest-corner/, /at\s+center/];
const DEFAULT_CONIC = [/at\s+center/];
/* type definitions */
/**
* @type ColorStopList - list of color stops
*/
type ColorStopList = [string, string, ...string[]];
/**
* @typedef ValidateGradientLine - validate gradient line
* @property line - gradient line
* @property valid - result
*/
interface ValidateGradientLine {
line: string;
valid: boolean;
}
/**
* @typedef ValidateColorStops - validate color stops
* @property colorStops - list of color stops
* @property valid - result
*/
interface ValidateColorStops {
colorStops: string[];
valid: boolean;
}
/**
* @typedef Gradient - parsed CSS gradient
* @property value - input value
* @property type - gradient type
* @property [gradientLine] - gradient line
* @property colorStopList - list of color stops
*/
interface Gradient {
value: string;
type: string;
gradientLine?: string;
colorStopList: ColorStopList;
}
/* regexp */
const IS_CONIC = /^(?:repeating-)?conic-gradient$/;
const IS_LINEAR = /^(?:repeating-)?linear-gradient$/;
const IS_RADIAL = /^(?:repeating-)?radial-gradient$/;
const REG_COLOR_HINT_CONIC = new RegExp(`^(?:${DIM_ANGLE_PCT})$`);
const REG_COLOR_HINT_NON_CONIC = new RegExp(`^(?:${DIM_LEN_PCT})$`);
const REG_DIM_CONIC = new RegExp(`(?:\\s+(?:${DIM_ANGLE_PCT})){1,2}$`);
const REG_DIM_NON_CONIC = new RegExp(`(?:\\s+(?:${DIM_LEN_PCT})){1,2}$`);
const REG_GRAD = /^(?:repeating-)?(?:conic|linear|radial)-gradient\(/;
const REG_GRAD_CAPT = /^((?:repeating-)?(?:conic|linear|radial)-gradient)\(/;
const REG_LINE_CONIC = new RegExp(`^(?:${LINE_SYNTAX_CONIC})$`);
const REG_LINE_LINEAR = new RegExp(`^(?:${LINE_SYNTAX_LINEAR})$`);
const REG_LINE_RADIAL = new RegExp(`^(?:${LINE_SYNTAX_RADIAL})$`);
/**
* get gradient type
* @param value - gradient value
* @returns gradient type
*/
export const getGradientType = (value: string): string => {
if (isString(value)) {
value = value.trim();
if (REG_GRAD.test(value)) {
const [, type] = value.match(REG_GRAD_CAPT) as MatchedRegExp;
return type;
}
}
return '';
};
/**
* validate gradient line
* @param value - gradient line value
* @param type - gradient type
* @returns result
*/
export const validateGradientLine = (
value: string,
type: string
): ValidateGradientLine => {
if (isString(value) && isString(type)) {
value = value.trim();
type = type.trim();
let reg: RegExp | null = null;
let defaultValues: RegExp[] = [];
if (IS_LINEAR.test(type)) {
reg = REG_LINE_LINEAR;
defaultValues = DEFAULT_LINEAR;
} else if (IS_RADIAL.test(type)) {
reg = REG_LINE_RADIAL;
defaultValues = DEFAULT_RADIAL;
} else if (IS_CONIC.test(type)) {
reg = REG_LINE_CONIC;
defaultValues = DEFAULT_CONIC;
}
if (reg) {
const valid = reg.test(value);
if (valid) {
let line = value;
for (const defaultValue of defaultValues) {
line = line.replace(defaultValue, '');
}
line = line.replace(/\s{2,}/g, ' ').trim();
return { line, valid };
}
return { valid, line: value };
}
}
return { line: value, valid: false };
};
/**
* validate color stop list
* @param list
* @param type
* @param [opt]
* @returns result
*/
export const validateColorStopList = (
list: string[],
type: string,
opt: Options = {}
): ValidateColorStops => {
if (Array.isArray(list) && list.length > 1) {
const isConic = IS_CONIC.test(type);
const regColorHint = isConic
? REG_COLOR_HINT_CONIC
: REG_COLOR_HINT_NON_CONIC;
const regDimension = isConic ? REG_DIM_CONIC : REG_DIM_NON_CONIC;
const valueList: string[] = [];
// State tracker: 'color' or 'hint'
let prevType = '';
for (let i = 0; i < list.length; i++) {
const item = list[i];
if (isString(item)) {
if (regColorHint.test(item)) {
// Hints cannot be the first item, and two hints cannot be adjacent
if (i === 0 || prevType === 'hint') {
return { colorStops: list, valid: false };
}
prevType = 'hint';
valueList.push(item);
} else {
const itemColor = item.replace(regDimension, '');
if (isColor(itemColor, { format: VAL_SPEC })) {
const resolvedColor = resolveColor(itemColor, opt) as string;
prevType = 'color';
valueList.push(item.replace(itemColor, resolvedColor));
} else {
return { colorStops: list, valid: false };
}
}
} else {
return { colorStops: list, valid: false };
}
}
// The last item must be a color, not a hint
if (prevType !== 'color') {
return { colorStops: list, valid: false };
}
return { valid: true, colorStops: valueList };
}
return { colorStops: list, valid: false };
};
/**
* parse CSS gradient
* @param value - gradient value
* @param [opt] - options
* @returns parsed result
*/
export const parseGradient = (
value: string,
opt: Options = {}
): Gradient | null => {
if (isString(value)) {
value = value.trim();
const cacheKey: string = createCacheKey(
{
namespace: NAMESPACE,
name: 'parseGradient',
value
},
opt
);
const cachedResult = getCache(cacheKey);
if (cachedResult instanceof CacheItem) {
if (cachedResult.isNull) {
return null;
}
return cachedResult.item as Gradient;
}
const type = getGradientType(value);
const gradValue = value.replace(REG_GRAD, '').replace(/\)$/, '');
if (type && gradValue) {
const [lineOrColorStop = '', ...itemList] = splitValue(gradValue, {
delimiter: ','
});
const isConic = IS_CONIC.test(type);
const regDimension = isConic ? REG_DIM_CONIC : REG_DIM_NON_CONIC;
let colorStop = '';
if (regDimension.test(lineOrColorStop)) {
const itemColor = lineOrColorStop.replace(regDimension, '');
if (isColor(itemColor, { format: VAL_SPEC })) {
const resolvedColor = resolveColor(itemColor, opt) as string;
colorStop = lineOrColorStop.replace(itemColor, resolvedColor);
}
} else if (isColor(lineOrColorStop, { format: VAL_SPEC })) {
colorStop = resolveColor(lineOrColorStop, opt) as string;
}
if (colorStop) {
itemList.unshift(colorStop);
const { colorStops, valid } = validateColorStopList(
itemList,
type,
opt
);
if (valid) {
const res: Gradient = {
value,
type,
colorStopList: colorStops as ColorStopList
};
setCache(cacheKey, res);
return res;
}
} else if (itemList.length > 1) {
const { line: gradientLine, valid: validLine } = validateGradientLine(
lineOrColorStop,
type
);
const { colorStops, valid: validColorStops } = validateColorStopList(
itemList,
type,
opt
);
if (validLine && validColorStops) {
const res: Gradient = {
value,
type,
gradientLine,
colorStopList: colorStops as ColorStopList
};
setCache(cacheKey, res);
return res;
}
}
}
setCache(cacheKey, null);
return null;
}
return null;
};
/**
* resolve CSS gradient
* @param value - CSS value
* @param [opt] - options
* @returns result
*/
export const resolveGradient = (value: string, opt: Options = {}): string => {
const { format = VAL_COMP } = opt;
const gradient = parseGradient(value, opt);
if (gradient) {
const { type = '', gradientLine = '', colorStopList = [] } = gradient;
if (type && Array.isArray(colorStopList) && colorStopList.length > 1) {
if (gradientLine) {
return `${type}(${gradientLine}, ${colorStopList.join(', ')})`;
}
return `${type}(${colorStopList.join(', ')})`;
}
}
if (format === VAL_SPEC) {
return '';
}
return 'none';
};
/**
* is CSS gradient
* @param value - CSS value
* @param [opt] - options
* @returns result
*/
export const isGradient = (value: string, opt: Options = {}): boolean => {
const gradient = parseGradient(value, opt);
return gradient !== null;
};

236
node_modules/@asamuzakjp/css-color/src/js/css-var.ts generated vendored Normal file
View File

@@ -0,0 +1,236 @@
/**
* css-var
*/
import { CSSToken, TokenType, tokenize } from '@csstools/css-tokenizer';
import {
CacheItem,
NullObject,
createCacheKey,
getCache,
setCache
} from './cache';
import { isString } from './common';
import { cssCalc } from './css-calc';
import { isColor } from './util';
import { Options } from './typedef';
/* constants */
import { FN_VAR, SYN_FN_CALC, SYN_FN_VAR, VAL_SPEC } from './constant';
const {
CloseParen: PAREN_CLOSE,
Comment: COMMENT,
EOF,
Ident: IDENT,
Whitespace: W_SPACE
} = TokenType;
const NAMESPACE = 'css-var';
/* regexp */
const REG_FN_CALC = new RegExp(SYN_FN_CALC);
const REG_FN_VAR = new RegExp(SYN_FN_VAR);
const REG_CSS_WIDE_KEYWORD = /^(?:inherit|initial|revert(?:-layer)?|unset)$/;
/**
* resolve custom property
* @param tokens - CSS tokens
* @param [opt] - options
* @returns result - [tokens, resolvedValue]
*/
export function resolveCustomProperty(
tokens: CSSToken[],
opt: Options = {}
): [CSSToken[], string] {
if (!Array.isArray(tokens)) {
throw new TypeError(`${tokens} is not an array.`);
}
const { customProperty = {} } = opt;
const items: string[] = [];
while (tokens.length) {
const token = tokens.shift();
if (!token) {
break;
}
if (!Array.isArray(token)) {
throw new TypeError(`${token} is not an array.`);
}
const [type, value] = token as [TokenType, string];
// end of var()
if (type === PAREN_CLOSE) {
break;
}
// nested var()
if (value === FN_VAR) {
const [, item] = resolveCustomProperty(tokens, opt);
if (item) {
items.push(item);
}
} else if (type === IDENT) {
if (value.startsWith('--')) {
let item;
if (Object.hasOwn(customProperty, value)) {
item = customProperty[value] as string;
} else if (typeof customProperty.callback === 'function') {
item = customProperty.callback(value);
}
if (item) {
items.push(item);
}
} else if (value) {
items.push(value);
}
}
}
let resolveAsColor = false;
if (items.length > 1) {
resolveAsColor = isColor(items[items.length - 1]);
}
let resolvedValue = '';
for (let item of items) {
item = item.trim();
if (REG_FN_VAR.test(item)) {
// recurse resolveVar()
const resolvedItem = resolveVar(item, opt);
if (isString(resolvedItem)) {
if (!resolveAsColor || isColor(resolvedItem)) {
resolvedValue = resolvedItem;
}
}
} else if (REG_FN_CALC.test(item)) {
item = cssCalc(item, opt);
if (!resolveAsColor || isColor(item)) {
resolvedValue = item;
}
} else if (item && !REG_CSS_WIDE_KEYWORD.test(item)) {
if (!resolveAsColor || isColor(item)) {
resolvedValue = item;
}
}
if (resolvedValue) {
break;
}
}
return [tokens, resolvedValue];
}
/**
* parse tokens
* @param tokens - CSS tokens
* @param [opt] - options
* @returns parsed tokens
*/
export function parseTokens(
tokens: CSSToken[],
opt: Options = {}
): string[] | NullObject {
const res: string[] = [];
while (tokens.length) {
const token = tokens.shift();
if (!token) break;
const [type = '', value = ''] = token as [TokenType, string];
if (value === FN_VAR) {
const [, resolvedValue] = resolveCustomProperty(tokens, opt);
if (!resolvedValue) {
return new NullObject();
}
res.push(resolvedValue);
} else {
switch (type) {
case PAREN_CLOSE: {
if (res.length) {
if (res[res.length - 1] === ' ') {
res[res.length - 1] = value;
} else {
res.push(value);
}
} else {
res.push(value);
}
break;
}
case W_SPACE: {
if (res.length) {
const lastValue = res[res.length - 1];
if (
isString(lastValue) &&
!lastValue.endsWith('(') &&
lastValue !== ' '
) {
res.push(value);
}
}
break;
}
default: {
if (type !== COMMENT && type !== EOF) {
res.push(value);
}
}
}
}
}
return res;
}
/**
* resolve CSS var()
* @param value - CSS value including var()
* @param [opt] - options
* @returns resolved value
*/
export function resolveVar(
value: string,
opt: Options = {}
): string | NullObject {
const { format = '' } = opt;
if (isString(value)) {
if (!REG_FN_VAR.test(value) || format === VAL_SPEC) {
return value;
}
value = value.trim();
} else {
throw new TypeError(`${value} is not a string.`);
}
const cacheKey: string = createCacheKey(
{
namespace: NAMESPACE,
name: 'resolveVar',
value
},
opt
);
const cachedResult = getCache(cacheKey);
if (cachedResult instanceof CacheItem) {
if (cachedResult.isNull) {
return cachedResult as NullObject;
}
return cachedResult.item as string;
}
const tokens = tokenize({ css: value });
const values = parseTokens(tokens, opt);
if (Array.isArray(values)) {
let color = values.join('');
if (REG_FN_CALC.test(color)) {
color = cssCalc(color, opt);
}
setCache(cacheKey, color);
return color;
} else {
setCache(cacheKey, null);
return new NullObject();
}
}
/**
* CSS var()
* @param value - CSS value including var()
* @param [opt] - options
* @returns resolved value
*/
export const cssVar = (value: string, opt: Options = {}): string => {
const resolvedValue = resolveVar(value, opt);
if (isString(resolvedValue)) {
return resolvedValue;
}
return '';
};

View File

@@ -0,0 +1,673 @@
/**
* relative-color
*/
import { SyntaxFlag, color as colorParser } from '@csstools/css-color-parser';
import {
ComponentValue,
parseComponentValue
} from '@csstools/css-parser-algorithms';
import { CSSToken, TokenType, tokenize } from '@csstools/css-tokenizer';
import {
CacheItem,
NullObject,
createCacheKey,
getCache,
setCache
} from './cache';
import { NAMED_COLORS, convertColorToRgb } from './color';
import { isString, isStringOrNumber } from './common';
import { resolveDimension, serializeCalc } from './css-calc';
import { resolveColor } from './resolve';
import { roundToPrecision, splitValue } from './util';
import {
ColorChannels,
MatchedRegExp,
Options,
StringColorChannels
} from './typedef';
/* constants */
import {
CS_LAB,
CS_LCH,
FN_LIGHT_DARK,
FN_REL,
FN_REL_CAPT,
FN_VAR,
NONE,
SYN_COLOR_TYPE,
SYN_FN_MATH_START,
SYN_FN_VAR,
SYN_MIX,
VAL_SPEC
} from './constant';
const {
CloseParen: PAREN_CLOSE,
Comment: COMMENT,
Delim: DELIM,
Dimension: DIM,
EOF,
Function: FUNC,
Ident: IDENT,
Number: NUM,
OpenParen: PAREN_OPEN,
Percentage: PCT,
Whitespace: W_SPACE
} = TokenType;
const { HasNoneKeywords: KEY_NONE } = SyntaxFlag;
const NAMESPACE = 'relative-color';
/* constants */
const OCT = 8;
const DEC = 10;
const HEX = 16;
const MAX_PCT = 100;
const MAX_RGB = 255;
const COLOR_CHANNELS = new Map([
['color', ['r', 'g', 'b', 'alpha']],
['hsl', ['h', 's', 'l', 'alpha']],
['hsla', ['h', 's', 'l', 'alpha']],
['hwb', ['h', 'w', 'b', 'alpha']],
['lab', ['l', 'a', 'b', 'alpha']],
['lch', ['l', 'c', 'h', 'alpha']],
['oklab', ['l', 'a', 'b', 'alpha']],
['oklch', ['l', 'c', 'h', 'alpha']],
['rgb', ['r', 'g', 'b', 'alpha']],
['rgba', ['r', 'g', 'b', 'alpha']]
]);
/* type definitions */
/**
* @type NumberOrStringColorChannels - color channel
*/
type NumberOrStringColorChannels = ColorChannels & StringColorChannels;
/* regexp */
const REG_COLOR_CAPT = new RegExp(
`^${FN_REL}(${SYN_COLOR_TYPE}|${SYN_MIX})\\s+`
);
const REG_CS_HSL = /(?:hsla?|hwb)$/;
const REG_CS_CIE = new RegExp(`^(?:${CS_LAB}|${CS_LCH})$`);
const REG_FN_CALC_SUM = /^(?:abs|sig?n|cos|tan)\(/;
const REG_FN_MATH_START = new RegExp(SYN_FN_MATH_START);
const REG_FN_REL = new RegExp(FN_REL);
const REG_FN_REL_CAPT = new RegExp(`^${FN_REL_CAPT}`);
const REG_FN_REL_START = new RegExp(`^${FN_REL}`);
const REG_FN_VAR = new RegExp(SYN_FN_VAR);
/**
* resolve relative color channels
* @param value
* - CSS color value
* - system colors are not supported
* @param [opt] - options
* @param [opt.currentColor]
* - color to use for `currentcolor` keyword
* - if omitted, it will be treated as a missing color
* i.e. `rgb(none none none / none)`
* @param [opt.customProperty]
* - custom properties
* - pair of `--` prefixed property name and value,
* e.g. `customProperty: { '--some-color': '#0000ff' }`
* - and/or `callback` function to get the value of the custom property,
* e.g. `customProperty: { callback: someDeclaration.getPropertyValue }`
* @param [opt.dimension]
* - dimension, convert relative length to pixels
* - pair of unit and it's value as a number in pixels,
* e.g. `dimension: { em: 12, rem: 16, vw: 10.26 }`
* - and/or `callback` function to get the value as a number in pixels,
* e.g. `dimension: { callback: convertUnitToPixel }`
* @param [opt.format]
* - output format, one of below
* - `computedValue` (default), [computed value][139] of the color
* - `specifiedValue`, [specified value][140] of the color
* - `hex`, hex color notation, i.e. `rrggbb`
* - `hexAlpha`, hex color notation with alpha channel, i.e. `#rrggbbaa`
* @returns
* - one of rgba?(), #rrggbb(aa)?, color-name, '(empty-string)',
* color(color-space r g b / alpha), color(color-space x y z / alpha),
* lab(l a b / alpha), lch(l c h / alpha), oklab(l a b / alpha),
* oklch(l c h / alpha), null
* - in `computedValue`, values are numbers, however `rgb()` values are
* integers
* - in `specifiedValue`, returns `empty string` for unknown and/or invalid
* color
* - in `hex`, returns `null` for `transparent`, and also returns `null` if
* any of `r`, `g`, `b`, `alpha` is not a number
* - in `hexAlpha`, returns `#00000000` for `transparent`,
* however returns `null` if any of `r`, `g`, `b`, `alpha` is not a number
*/
export function resolveColorChannels(
tokens: CSSToken[],
opt: Options = {}
): NumberOrStringColorChannels | NullObject {
if (!Array.isArray(tokens)) {
throw new TypeError(`${tokens} is not an array.`);
}
const { colorSpace = '', format = '' } = opt;
const colorChannel = COLOR_CHANNELS.get(colorSpace);
// invalid color channel
if (!colorChannel) {
return new NullObject();
}
const mathFunc = new Set();
const channels: [
(number | string)[],
(number | string)[],
(number | string)[],
(number | string)[]
] = [[], [], [], []];
let i = 0;
let nest = 0;
let func = '';
let precededPct = false;
for (const token of tokens) {
if (!Array.isArray(token)) {
throw new TypeError(`${token} is not an array.`);
}
const [type, value, , , detail] = token as [
TokenType,
string,
number,
number,
{ value: string | number } | undefined
];
const channel = channels[i];
if (Array.isArray(channel)) {
switch (type) {
case DELIM: {
if (func) {
if (
(value === '+' || value === '-') &&
precededPct &&
!REG_FN_CALC_SUM.test(func)
) {
return new NullObject();
}
precededPct = false;
channel.push(value);
}
break;
}
case DIM: {
if (!func || !REG_FN_CALC_SUM.test(func)) {
return new NullObject();
}
const resolvedValue = resolveDimension(token, opt);
if (isString(resolvedValue)) {
channel.push(resolvedValue);
} else {
channel.push(value);
}
break;
}
case FUNC: {
channel.push(value);
func = value;
nest++;
if (REG_FN_MATH_START.test(value)) {
mathFunc.add(nest);
}
break;
}
case IDENT: {
// invalid channel key
if (!colorChannel.includes(value)) {
return new NullObject();
}
channel.push(value);
if (!func) {
i++;
}
break;
}
case NUM: {
channel.push(Number(detail?.value));
if (!func) {
i++;
}
break;
}
case PAREN_OPEN: {
channel.push(value);
nest++;
break;
}
case PAREN_CLOSE: {
if (func) {
const lastValue = channel[channel.length - 1];
if (lastValue === ' ') {
channel[channel.length - 1] = value;
} else {
channel.push(value);
}
if (mathFunc.has(nest)) {
mathFunc.delete(nest);
}
nest--;
if (nest === 0) {
func = '';
i++;
}
}
break;
}
case PCT: {
if (!func) {
return new NullObject();
} else if (!REG_FN_CALC_SUM.test(func)) {
let lastValue: string | number | undefined;
for (let j = channel.length - 1; j >= 0; j--) {
if (channel[j] !== ' ') {
lastValue = channel[j];
break;
}
}
if (lastValue === '+' || lastValue === '-') {
return new NullObject();
} else if (lastValue === '*' || lastValue === '/') {
precededPct = false;
} else {
precededPct = true;
}
}
channel.push(Number(detail?.value) / MAX_PCT);
break;
}
case W_SPACE: {
if (channel.length && func) {
const lastValue = channel[channel.length - 1];
if (typeof lastValue === 'number') {
channel.push(value);
} else if (
isString(lastValue) &&
!lastValue.endsWith('(') &&
lastValue !== ' '
) {
channel.push(value);
}
}
break;
}
default: {
if (type !== COMMENT && type !== EOF && func) {
channel.push(value);
}
}
}
}
}
const channelValues = [];
for (const channel of channels) {
if (channel.length === 1) {
const [resolvedValue] = channel;
if (isStringOrNumber(resolvedValue)) {
channelValues.push(resolvedValue);
}
} else if (channel.length) {
const resolvedValue = serializeCalc(channel.join(''), {
format
});
channelValues.push(resolvedValue);
}
}
return channelValues as NumberOrStringColorChannels;
}
/**
* extract origin color
* @param value - CSS color value
* @param [opt] - options
* @returns origin color value
*/
export function extractOriginColor(
value: string,
opt: Options = {}
): string | NullObject {
const { colorScheme = 'normal', currentColor = '', format = '' } = opt;
if (isString(value)) {
value = value.toLowerCase().trim();
if (!value) {
return new NullObject();
}
if (!REG_FN_REL_START.test(value)) {
return value;
}
} else {
return new NullObject();
}
const cacheKey: string = createCacheKey(
{
namespace: NAMESPACE,
name: 'extractOriginColor',
value
},
opt
);
const cachedResult = getCache(cacheKey);
if (cachedResult instanceof CacheItem) {
if (cachedResult.isNull) {
return cachedResult as NullObject;
}
return cachedResult.item as string;
}
if (/currentcolor/.test(value)) {
if (currentColor) {
value = value.replace(/currentcolor/g, currentColor);
} else {
setCache(cacheKey, null);
return new NullObject();
}
}
let colorSpace = '';
if (REG_FN_REL_CAPT.test(value)) {
[, colorSpace] = value.match(REG_FN_REL_CAPT) as MatchedRegExp;
}
opt.colorSpace = colorSpace;
if (value.includes(FN_LIGHT_DARK)) {
const colorParts = value
.replace(new RegExp(`^${colorSpace}\\(`), '')
.replace(/\)$/, '');
const [, originColor = ''] = splitValue(colorParts);
const specifiedOriginColor = resolveColor(originColor, {
colorScheme,
format: VAL_SPEC
}) as string;
if (specifiedOriginColor === '') {
setCache(cacheKey, null);
return new NullObject();
}
if (format === VAL_SPEC) {
value = value.replace(originColor, specifiedOriginColor);
} else {
const resolvedOriginColor = resolveColor(specifiedOriginColor, opt);
if (isString(resolvedOriginColor)) {
value = value.replace(originColor, resolvedOriginColor);
}
}
}
if (REG_COLOR_CAPT.test(value)) {
const [, originColor] = value.match(REG_COLOR_CAPT) as MatchedRegExp;
const [, restValue] = value.split(originColor) as MatchedRegExp;
if (/^[a-z]+$/.test(originColor)) {
if (
!/^transparent$/.test(originColor) &&
!Object.hasOwn(NAMED_COLORS, originColor)
) {
setCache(cacheKey, null);
return new NullObject();
}
} else if (format === VAL_SPEC) {
const resolvedOriginColor = resolveColor(originColor, opt);
if (isString(resolvedOriginColor)) {
value = value.replace(originColor, resolvedOriginColor);
}
}
if (format === VAL_SPEC) {
const tokens = tokenize({ css: restValue });
const channelValues = resolveColorChannels(tokens, opt);
if (channelValues instanceof NullObject) {
setCache(cacheKey, null);
return channelValues;
}
const [v1, v2, v3, v4] = channelValues;
let channelValue = '';
if (isStringOrNumber(v4)) {
channelValue = ` ${v1} ${v2} ${v3} / ${v4})`;
} else {
channelValue = ` ${channelValues.join(' ')})`;
}
if (restValue !== channelValue) {
value = value.replace(restValue, channelValue);
}
}
} else {
// nested relative color
const [, restValue] = value.split(REG_FN_REL_START) as MatchedRegExp;
const tokens = tokenize({ css: restValue });
const originColor: string[] = [];
let nest = 0;
let tokenIndex = 0;
for (const [type, tokenValue] of tokens) {
tokenIndex++;
switch (type) {
case FUNC:
case PAREN_OPEN: {
originColor.push(tokenValue);
nest++;
break;
}
case PAREN_CLOSE: {
const lastValue = originColor[originColor.length - 1];
if (lastValue === ' ') {
originColor[originColor.length - 1] = tokenValue;
} else if (isString(lastValue)) {
originColor.push(tokenValue);
}
nest--;
break;
}
case W_SPACE: {
const lastValue = originColor[originColor.length - 1];
if (
isString(lastValue) &&
!lastValue.endsWith('(') &&
lastValue !== ' '
) {
originColor.push(tokenValue);
}
break;
}
default: {
if (type !== COMMENT && type !== EOF) {
originColor.push(tokenValue);
}
}
}
if (nest === 0) {
break;
}
}
const resolvedOriginColor = resolveRelativeColor(
originColor.join('').trim(),
opt
);
if (resolvedOriginColor instanceof NullObject) {
setCache(cacheKey, null);
return resolvedOriginColor;
}
const channelValues = resolveColorChannels(tokens.slice(tokenIndex), opt);
if (channelValues instanceof NullObject) {
setCache(cacheKey, null);
return channelValues;
}
const [v1, v2, v3, v4] = channelValues;
let channelValue = '';
if (isStringOrNumber(v4)) {
channelValue = ` ${v1} ${v2} ${v3} / ${v4})`;
} else {
channelValue = ` ${channelValues.join(' ')})`;
}
value = value.replace(restValue, `${resolvedOriginColor}${channelValue}`);
}
setCache(cacheKey, value);
return value;
}
/**
* resolve relative color
* @param value - CSS relative color value
* @param [opt] - options
* @returns resolved value
*/
export function resolveRelativeColor(
value: string,
opt: Options = {}
): string | NullObject {
const { format = '' } = opt;
if (isString(value)) {
if (REG_FN_VAR.test(value)) {
// var() must be resolved before resolveRelativeColor()
if (format !== VAL_SPEC) {
throw new SyntaxError(`Unexpected token ${FN_VAR} found.`);
}
return value;
} else if (!REG_FN_REL.test(value)) {
return value;
}
value = value.toLowerCase().trim();
} else {
throw new TypeError(`${value} is not a string.`);
}
const cacheKey: string = createCacheKey(
{
namespace: NAMESPACE,
name: 'resolveRelativeColor',
value
},
opt
);
const cachedResult = getCache(cacheKey);
if (cachedResult instanceof CacheItem) {
if (cachedResult.isNull) {
return cachedResult as NullObject;
}
return cachedResult.item as string;
}
const originColor = extractOriginColor(value, opt);
if (originColor instanceof NullObject) {
setCache(cacheKey, null);
return originColor;
}
value = originColor;
if (format === VAL_SPEC) {
if (value.startsWith('rgba(')) {
value = value.replace('rgba(', 'rgb(');
} else if (value.startsWith('hsla(')) {
value = value.replace('hsla(', 'hsl(');
}
return value;
}
const tokens = tokenize({ css: value });
const components = parseComponentValue(tokens) as ComponentValue;
const parsedComponents = colorParser(components);
if (!parsedComponents) {
setCache(cacheKey, null);
return new NullObject();
}
const {
alpha: alphaComponent,
channels: channelsComponent,
colorNotation,
syntaxFlags
} = parsedComponents;
let alpha: number | string;
if (Number.isNaN(Number(alphaComponent))) {
if (syntaxFlags instanceof Set && syntaxFlags.has(KEY_NONE)) {
alpha = NONE;
} else {
alpha = 0;
}
} else {
alpha = roundToPrecision(Number(alphaComponent), OCT);
}
let v1: number | string;
let v2: number | string;
let v3: number | string;
[v1, v2, v3] = channelsComponent;
let resolvedValue;
if (REG_CS_CIE.test(colorNotation)) {
const hasNone = syntaxFlags instanceof Set && syntaxFlags.has(KEY_NONE);
if (Number.isNaN(v1)) {
if (hasNone) {
v1 = NONE;
} else {
v1 = 0;
}
} else {
v1 = roundToPrecision(v1, HEX);
}
if (Number.isNaN(v2)) {
if (hasNone) {
v2 = NONE;
} else {
v2 = 0;
}
} else {
v2 = roundToPrecision(v2, HEX);
}
if (Number.isNaN(v3)) {
if (hasNone) {
v3 = NONE;
} else {
v3 = 0;
}
} else {
v3 = roundToPrecision(v3, HEX);
}
if (alpha === 1) {
resolvedValue = `${colorNotation}(${v1} ${v2} ${v3})`;
} else {
resolvedValue = `${colorNotation}(${v1} ${v2} ${v3} / ${alpha})`;
}
} else if (REG_CS_HSL.test(colorNotation)) {
if (Number.isNaN(v1)) {
v1 = 0;
}
if (Number.isNaN(v2)) {
v2 = 0;
}
if (Number.isNaN(v3)) {
v3 = 0;
}
let [r, g, b] = convertColorToRgb(
`${colorNotation}(${v1} ${v2} ${v3} / ${alpha})`
) as ColorChannels;
r = roundToPrecision(r / MAX_RGB, DEC);
g = roundToPrecision(g / MAX_RGB, DEC);
b = roundToPrecision(b / MAX_RGB, DEC);
if (alpha === 1) {
resolvedValue = `color(srgb ${r} ${g} ${b})`;
} else {
resolvedValue = `color(srgb ${r} ${g} ${b} / ${alpha})`;
}
} else {
const cs = colorNotation === 'rgb' ? 'srgb' : colorNotation;
const hasNone = syntaxFlags instanceof Set && syntaxFlags.has(KEY_NONE);
if (Number.isNaN(v1)) {
if (hasNone) {
v1 = NONE;
} else {
v1 = 0;
}
} else {
v1 = roundToPrecision(v1, DEC);
}
if (Number.isNaN(v2)) {
if (hasNone) {
v2 = NONE;
} else {
v2 = 0;
}
} else {
v2 = roundToPrecision(v2, DEC);
}
if (Number.isNaN(v3)) {
if (hasNone) {
v3 = NONE;
} else {
v3 = 0;
}
} else {
v3 = roundToPrecision(v3, DEC);
}
if (alpha === 1) {
resolvedValue = `color(${cs} ${v1} ${v2} ${v3})`;
} else {
resolvedValue = `color(${cs} ${v1} ${v2} ${v3} / ${alpha})`;
}
}
setCache(cacheKey, resolvedValue);
return resolvedValue;
}

322
node_modules/@asamuzakjp/css-color/src/js/resolve.ts generated vendored Normal file
View File

@@ -0,0 +1,322 @@
/**
* resolve
*/
import {
CacheItem,
NullObject,
createCacheKey,
getCache,
setCache
} from './cache';
import {
convertRgbToHex,
resolveColorFunc,
resolveColorMix,
resolveColorValue
} from './color';
import { isString } from './common';
import { cssCalc } from './css-calc';
import { resolveVar } from './css-var';
import { resolveRelativeColor } from './relative-color';
import { splitValue } from './util';
import {
ComputedColorChannels,
Options,
SpecifiedColorChannels
} from './typedef';
/* constants */
import {
FN_COLOR,
FN_MIX,
SYN_FN_CALC,
SYN_FN_LIGHT_DARK,
SYN_FN_REL,
SYN_FN_VAR,
VAL_COMP,
VAL_SPEC
} from './constant';
const NAMESPACE = 'resolve';
const RGB_TRANSPARENT = 'rgba(0, 0, 0, 0)';
/* regexp */
const REG_FN_CALC = new RegExp(SYN_FN_CALC);
const REG_FN_LIGHT_DARK = new RegExp(SYN_FN_LIGHT_DARK);
const REG_FN_REL = new RegExp(SYN_FN_REL);
const REG_FN_VAR = new RegExp(SYN_FN_VAR);
/**
* resolve color
* @param value - CSS color value
* @param [opt] - options
* @returns resolved color
*/
export const resolveColor = (
value: string,
opt: Options = {}
): string | NullObject => {
if (!isString(value)) {
throw new TypeError(`${value} is not a string.`);
}
value = value.trim();
const {
colorScheme = 'normal',
currentColor = '',
format = VAL_COMP,
nullable = false
} = opt;
const cacheKey: string = createCacheKey(
{ namespace: NAMESPACE, name: 'resolve', value },
opt
);
const cachedResult = getCache(cacheKey);
if (cachedResult instanceof CacheItem) {
if (cachedResult.isNull) {
return cachedResult as NullObject;
}
return cachedResult.item as string;
}
// 1. var() resolution
if (REG_FN_VAR.test(value)) {
if (format === VAL_SPEC) {
setCache(cacheKey, value);
return value;
}
const resolvedVar = resolveVar(value, opt);
if (resolvedVar instanceof NullObject) {
const res =
format === 'hex' || format === 'hexAlpha' || nullable
? resolvedVar
: RGB_TRANSPARENT;
setCache(cacheKey, res);
return res;
}
value = resolvedVar;
}
if (opt.format !== format) {
opt.format = format;
}
value = value.toLowerCase();
// 2. light-dark() resolution
if (REG_FN_LIGHT_DARK.test(value) && value.endsWith(')')) {
const colorParts = value.replace(REG_FN_LIGHT_DARK, '').replace(/\)$/, '');
const [light = '', dark = ''] = splitValue(colorParts, { delimiter: ',' });
if (light && dark) {
if (format === VAL_SPEC) {
const lightColor = resolveColor(light, opt);
const darkColor = resolveColor(dark, opt);
const res =
lightColor && darkColor
? `light-dark(${lightColor}, ${darkColor})`
: '';
setCache(cacheKey, res);
return res;
}
const chosen = colorScheme === 'dark' ? dark : light;
const resolved = resolveColor(chosen, opt);
const res =
resolved instanceof NullObject && !nullable
? RGB_TRANSPARENT
: resolved;
setCache(cacheKey, res);
return res;
}
// fallback for invalid light-dark
const invalidRes =
format === VAL_SPEC
? ''
: format === 'hex' || format === 'hexAlpha'
? new NullObject()
: RGB_TRANSPARENT;
setCache(cacheKey, invalidRes);
return invalidRes;
}
// 3. Relative Color resolution
if (REG_FN_REL.test(value)) {
const resolvedRel = resolveRelativeColor(value, opt);
if (format === VAL_COMP) {
const res =
resolvedRel instanceof NullObject && !nullable
? RGB_TRANSPARENT
: resolvedRel;
setCache(cacheKey, res);
return res;
}
if (format === VAL_SPEC) {
const res = resolvedRel instanceof NullObject ? '' : resolvedRel;
setCache(cacheKey, res);
return res;
}
value = resolvedRel instanceof NullObject ? '' : resolvedRel;
}
// 4. calc() resolution
if (REG_FN_CALC.test(value)) {
value = cssCalc(value, opt);
}
// 5. Keyword & Color-space resolution
let cs = '';
let r = NaN;
let g = NaN;
let b = NaN;
let alpha = NaN;
if (value === 'transparent') {
let res: string | NullObject;
switch (format) {
case VAL_SPEC: {
res = value;
break;
}
case 'hex': {
res = new NullObject();
break;
}
case 'hexAlpha': {
res = '#00000000';
break;
}
default: {
res = RGB_TRANSPARENT;
}
}
setCache(cacheKey, res);
return res;
}
if (value === 'currentcolor') {
if (format === VAL_SPEC) {
setCache(cacheKey, value);
return value;
}
if (currentColor) {
let resolvedCurrent;
if (currentColor.startsWith(FN_MIX)) {
resolvedCurrent = resolveColorMix(currentColor, opt);
} else if (currentColor.startsWith(FN_COLOR)) {
resolvedCurrent = resolveColorFunc(currentColor, opt);
} else {
resolvedCurrent = resolveColorValue(currentColor, opt);
}
if (resolvedCurrent instanceof NullObject) {
setCache(cacheKey, resolvedCurrent);
return resolvedCurrent;
}
[cs, r, g, b, alpha] = resolvedCurrent as ComputedColorChannels;
} else {
// value is handled below if not VAL_COMP
const res = format === VAL_COMP ? RGB_TRANSPARENT : value;
if (format === VAL_COMP) {
setCache(cacheKey, res);
return res;
}
}
} else if (format === VAL_SPEC) {
let res = '';
if (value.startsWith(FN_MIX)) {
res = resolveColorMix(value, opt) as string;
} else if (value.startsWith(FN_COLOR)) {
const [scs, rr, gg, bb, aa] = resolveColorFunc(
value,
opt
) as SpecifiedColorChannels;
res =
aa === 1
? `color(${scs} ${rr} ${gg} ${bb})`
: `color(${scs} ${rr} ${gg} ${bb} / ${aa})`;
} else {
const rgb = resolveColorValue(value, opt);
if (isString(rgb)) {
res = rgb;
} else {
const [scs, rr, gg, bb, aa] = rgb as SpecifiedColorChannels;
if (scs === 'rgb') {
res =
aa === 1
? `${scs}(${rr}, ${gg}, ${bb})`
: `${scs}a(${rr}, ${gg}, ${bb}, ${aa})`;
} else {
res =
aa === 1
? `${scs}(${rr} ${gg} ${bb})`
: `${scs}(${rr} ${gg} ${bb} / ${aa})`;
}
}
}
setCache(cacheKey, res);
return res;
} else if (value.startsWith(FN_MIX)) {
if (currentColor) {
value = value.replace(/currentcolor/g, currentColor);
}
value = value.replace(/transparent/g, RGB_TRANSPARENT);
const resolvedMix = resolveColorMix(value, opt);
if (resolvedMix instanceof NullObject) {
setCache(cacheKey, resolvedMix);
return resolvedMix;
}
[cs, r, g, b, alpha] = resolvedMix as ComputedColorChannels;
} else if (value.startsWith(FN_COLOR)) {
const resolvedFunc = resolveColorFunc(value, opt);
if (resolvedFunc instanceof NullObject) {
setCache(cacheKey, resolvedFunc);
return resolvedFunc;
}
[cs, r, g, b, alpha] = resolvedFunc as ComputedColorChannels;
} else if (value) {
const resolvedVal = resolveColorValue(value, opt);
if (resolvedVal instanceof NullObject) {
setCache(cacheKey, resolvedVal);
return resolvedVal;
}
[cs, r, g, b, alpha] = resolvedVal as ComputedColorChannels;
}
// 6. Format Finalization
let finalRes: string | NullObject = '';
switch (format) {
case 'hex':
case 'hexAlpha': {
if (
Number.isNaN(r) ||
Number.isNaN(g) ||
Number.isNaN(b) ||
Number.isNaN(alpha) ||
(format === 'hex' && alpha === 0)
) {
finalRes = new NullObject();
} else {
finalRes = convertRgbToHex([r, g, b, format === 'hex' ? 1 : alpha]);
}
break;
}
default: {
if (cs === 'rgb') {
finalRes =
alpha === 1
? `${cs}(${r}, ${g}, ${b})`
: `${cs}a(${r}, ${g}, ${b}, ${alpha})`;
} else if (['lab', 'lch', 'oklab', 'oklch'].includes(cs)) {
finalRes =
alpha === 1
? `${cs}(${r} ${g} ${b})`
: `${cs}(${r} ${g} ${b} / ${alpha})`;
} else {
finalRes =
alpha === 1
? `color(${cs} ${r} ${g} ${b})`
: `color(${cs} ${r} ${g} ${b} / ${alpha})`;
}
}
}
setCache(cacheKey, finalRes);
return finalRes;
};
/**
* resolve CSS color
* @param value - CSS color value. system colors are not supported
* @param [opt] - options
*/
export const resolve = (value: string, opt: Options = {}): string | null => {
opt.nullable = false;
const resolvedValue = resolveColor(value, opt);
return resolvedValue instanceof NullObject ? null : (resolvedValue as string);
};

88
node_modules/@asamuzakjp/css-color/src/js/typedef.ts generated vendored Normal file
View File

@@ -0,0 +1,88 @@
/**
* typedef
*/
/* type definitions */
/**
* @typedef Options - options
* @property [alpha] - enable alpha
* @property [colorSpace] - color space
* @property [currentColor] - color for currentcolor
* @property [customProperty] - custom properties
* @property [d50] - white point in d50
* @property [dimension] - dimension
* @property [format] - output format
* @property [key] - key
*/
export interface Options {
alpha?: boolean;
colorScheme?: string;
colorSpace?: string;
currentColor?: string;
customProperty?: Record<string, string | ((K: string) => string)>;
d50?: boolean;
delimiter?: string | string[];
dimension?: Record<string, number | ((K: string) => number)>;
format?: string;
nullable?: boolean;
preserveComment?: boolean;
}
/**
* @type ColorChannels - color channels
*/
export type ColorChannels = [x: number, y: number, z: number, alpha: number];
/**
* @type StringColorChannels - color channels
*/
export type StringColorChannels = [
x: string,
y: string,
z: string,
alpha: string | undefined
];
/**
* @type StringColorSpacedChannels - specified value
*/
export type StringColorSpacedChannels = [
cs: string,
x: string,
y: string,
z: string,
alpha: string | undefined
];
/**
* @type ComputedColorChannels - computed value
*/
export type ComputedColorChannels = [
cs: string,
x: number,
y: number,
z: number,
alpha: number
];
/**
* @type SpecifiedColorChannels - specified value
*/
export type SpecifiedColorChannels = [
cs: string,
x: number | string,
y: number | string,
z: number | string,
alpha: number | string
];
/**
* @type MatchedRegExp - matched regexp array
*/
export type MatchedRegExp = [
match: string,
gr1: string,
gr2: string,
gr3: string,
gr4: string
];

423
node_modules/@asamuzakjp/css-color/src/js/util.ts generated vendored Normal file
View File

@@ -0,0 +1,423 @@
/**
* util
*/
import { TokenType, tokenize } from '@csstools/css-tokenizer';
import { CacheItem, createCacheKey, getCache, setCache } from './cache';
import { isString } from './common';
import { resolveColor } from './resolve';
import { Options } from './typedef';
/* constants */
import { NAMED_COLORS } from './color';
import { SYN_COLOR_TYPE, SYN_MIX, VAL_SPEC } from './constant';
const {
CloseParen: PAREN_CLOSE,
Comma: COMMA,
Comment: COMMENT,
Delim: DELIM,
EOF,
Function: FUNC,
OpenParen: PAREN_OPEN,
Whitespace: W_SPACE
} = TokenType;
const NAMESPACE = 'util';
/* numeric constants */
const DEC = 10;
const HEX = 16;
const DEG = 360;
const DEG_HALF = 180;
/* regexp */
const REG_COLOR = new RegExp(`^(?:${SYN_COLOR_TYPE})$`);
const REG_DIMENSION = /^([+-]?(?:\d+(?:\.\d+)?|\.\d+)(?:e[+-]?\d+)?)([a-z]*)$/i;
const REG_FN_COLOR =
/^(?:(?:ok)?l(?:ab|ch)|color(?:-mix)?|hsla?|hwb|rgba?|var)\(/;
const REG_MIX = new RegExp(SYN_MIX);
const REG_DASHED_IDENT = /--[\w-]+/g;
const REG_COMMA = /^,$/;
const REG_SLASH = /^\/$/;
const REG_WHITESPACE = /^\s+$/;
/**
* split value
* NOTE: comments are stripped, it can be preserved if, in the options param,
* `delimiter` is either ',' or '/' and with `preserveComment` set to `true`
* @param value - CSS value
* @param [opt] - options
* @returns array of values
*/
export const splitValue = (value: string, opt: Options = {}): string[] => {
if (!isString(value)) {
throw new TypeError(`${value} is not a string.`);
}
const strValue = value.trim();
const { delimiter = ' ', preserveComment = false } = opt;
const cacheKey: string = createCacheKey(
{
namespace: NAMESPACE,
name: 'splitValue',
value: strValue
},
{ delimiter, preserveComment }
);
const cachedResult = getCache(cacheKey);
if (cachedResult instanceof CacheItem) {
return cachedResult.item as string[];
}
let regDelimiter;
switch (delimiter) {
case ',': {
regDelimiter = REG_COMMA;
break;
}
case '/': {
regDelimiter = REG_SLASH;
break;
}
default: {
regDelimiter = REG_WHITESPACE;
}
}
const tokens = tokenize({ css: strValue });
let nest = 0;
let currentStr = '';
const res: string[] = [];
for (const [type, val] of tokens) {
switch (type) {
case COMMA:
case DELIM: {
if (nest === 0 && regDelimiter.test(val)) {
res.push(currentStr.trim());
currentStr = '';
} else {
currentStr += val;
}
break;
}
case COMMENT: {
if (preserveComment && (delimiter === ',' || delimiter === '/')) {
currentStr += val;
}
break;
}
case FUNC:
case PAREN_OPEN: {
currentStr += val;
nest++;
break;
}
case PAREN_CLOSE: {
currentStr += val;
nest--;
break;
}
case W_SPACE: {
if (regDelimiter.test(val)) {
if (nest === 0) {
if (currentStr) {
res.push(currentStr.trim());
currentStr = '';
}
} else {
currentStr += ' ';
}
} else if (!currentStr.endsWith(' ')) {
currentStr += ' ';
}
break;
}
default: {
if (type === EOF) {
res.push(currentStr.trim());
currentStr = '';
} else {
currentStr += val;
}
}
}
}
setCache(cacheKey, res);
return res;
};
/**
* extract dashed-ident tokens
* @param value - CSS value
* @returns array of dashed-ident tokens
*/
export const extractDashedIdent = (value: string): string[] => {
if (!isString(value)) {
throw new TypeError(`${value} is not a string.`);
}
const strValue = value.trim();
const cacheKey: string = createCacheKey({
namespace: NAMESPACE,
name: 'extractDashedIdent',
value: strValue
});
const cachedResult = getCache(cacheKey);
if (cachedResult instanceof CacheItem) {
return cachedResult.item as string[];
}
const matches = strValue.match(REG_DASHED_IDENT);
const res = matches ? [...new Set(matches)] : [];
setCache(cacheKey, res);
return res;
};
/**
* is color
* @param value - CSS value
* @param [opt] - options
* @returns result
*/
export const isColor = (value: unknown, opt: Options = {}): boolean => {
if (!isString(value)) {
return false;
}
const str = value.toLowerCase().trim();
if (!str) {
return false;
}
if (/^[a-z]+$/.test(str)) {
return (
str === 'currentcolor' ||
str === 'transparent' ||
Object.hasOwn(NAMED_COLORS, str)
);
}
if (REG_COLOR.test(str) || REG_MIX.test(str)) {
return true;
}
if (REG_FN_COLOR.test(str)) {
const colorOpt = { ...opt, nullable: true };
if (!colorOpt.format) colorOpt.format = VAL_SPEC;
return !!resolveColor(str, colorOpt);
}
return false;
};
/**
* round to specified precision
* @param value - numeric value
* @param bit - minimum bits
* @returns rounded value
*/
export const roundToPrecision = (value: number, bit: number = 0): number => {
if (!Number.isFinite(value)) {
throw new TypeError(`${value} is not a finite number.`);
}
if (!Number.isFinite(bit)) {
throw new TypeError(`${bit} is not a finite number.`);
}
if (bit < 0 || bit > HEX) {
throw new RangeError(`${bit} is not between 0 and ${HEX}.`);
}
if (bit === 0) {
return Math.round(value);
}
const precision = bit === HEX ? 6 : bit < DEC ? 4 : 5;
return parseFloat(value.toPrecision(precision));
};
/**
* interpolate hue
* @param hueA - hue value
* @param hueB - hue value
* @param arc - shorter | longer | increasing | decreasing
* @returns result - [hueA, hueB]
*/
export const interpolateHue = (
hueA: number,
hueB: number,
arc: string = 'shorter'
): [number, number] => {
if (!Number.isFinite(hueA)) {
throw new TypeError(`${hueA} is not a finite number.`);
}
if (!Number.isFinite(hueB)) {
throw new TypeError(`${hueB} is not a finite number.`);
}
let a = hueA;
let b = hueB;
switch (arc) {
case 'decreasing': {
if (b > a) {
a += DEG;
}
break;
}
case 'increasing': {
if (b < a) {
b += DEG;
}
break;
}
case 'longer': {
if (b > a && b < a + DEG_HALF) {
a += DEG;
} else if (b > a - DEG_HALF && b <= a) {
b += DEG;
}
break;
}
case 'shorter':
default: {
if (b > a + DEG_HALF) {
a += DEG;
} else if (b < a - DEG_HALF) {
b += DEG;
}
}
}
return [a, b];
};
/* absolute font size to pixel ratio */
const absoluteFontSize = new Map([
['xx-small', 9 / 16],
['x-small', 5 / 8],
['small', 13 / 16],
['medium', 1],
['large', 9 / 8],
['x-large', 3 / 2],
['xx-large', 2],
['xxx-large', 3]
]);
/* relative font size to pixel ratio */
const relativeFontSize = new Map([
['smaller', 1 / 1.2],
['larger', 1.2]
]);
/* absolute length to pixel ratio */
const absoluteLength = new Map([
['cm', 96 / 2.54],
['mm', 96 / 25.4],
['q', 96 / 101.6],
['in', 96],
['pc', 16],
['pt', 96 / 72],
['px', 1]
]);
/* relative length to pixel ratio */
const relativeLength = new Map([
['rcap', 1],
['rch', 0.5],
['rem', 1],
['rex', 0.5],
['ric', 1],
['rlh', 1.2]
]);
/**
* resolve length in pixels
* @param value - value
* @param unit - unit
* @param [opt] - options
* @returns pixelated value
*/
export const resolveLengthInPixels = (
value: number | string,
unit: string | undefined,
opt: Options = {}
): number => {
const { dimension = {} } = opt;
const { callback, em, rem, vh, vw } = dimension as {
callback: (K: string) => number;
em: number;
rem: number;
vh: number;
vw: number;
};
if (isString(value)) {
const str = value.toLowerCase().trim();
const ratio = absoluteFontSize.get(str);
if (ratio !== undefined) {
return ratio * rem;
}
const relRatio = relativeFontSize.get(str);
if (relRatio !== undefined) {
return relRatio * em;
}
return Number.NaN;
}
if (Number.isFinite(value) && unit) {
const u = unit.toLowerCase();
if (Object.hasOwn(dimension, u)) {
return value * Number(dimension[u]);
}
if (typeof callback === 'function') {
return value * (callback(u) ?? Number.NaN);
}
const absRatio = absoluteLength.get(u);
if (absRatio !== undefined) {
return value * absRatio;
}
const relRatio = relativeLength.get(u);
if (relRatio !== undefined) {
return value * relRatio * rem;
}
const rUnitRatio = relativeLength.get(`r${u}`);
if (rUnitRatio !== undefined) {
return value * rUnitRatio * em;
}
switch (u) {
case 'vb':
case 'vi': {
return value * vw;
}
case 'vmax': {
return value * Math.max(vh, vw);
}
case 'vmin': {
return value * Math.min(vh, vw);
}
default:
}
}
// unsupported or invalid value
return Number.NaN;
};
/**
* is absolute size or length
* @param value - value
* @param unit - unit
* @returns result
*/
export const isAbsoluteSizeOrLength = (
value: number | string,
unit: string | undefined
): boolean => {
if (isString(value)) {
return absoluteFontSize.has(value.toLowerCase().trim());
}
if (isString(unit)) {
return absoluteLength.has(unit.toLowerCase().trim());
}
return value === 0;
};
/**
* is absolute font size
* @param css - css
* @returns result
*/
export const isAbsoluteFontSize = (css: unknown): boolean => {
if (!isString(css)) {
return false;
}
const str = css.trim();
if (isAbsoluteSizeOrLength(str, undefined)) {
return true;
}
const match = str.match(REG_DIMENSION);
return match
? isAbsoluteSizeOrLength(Number(match[1]), match[2] || undefined)
: false;
};

21
node_modules/@asamuzakjp/dom-selector/LICENSE generated vendored Normal file
View File

@@ -0,0 +1,21 @@
MIT License
Copyright (c) 2023 asamuzaK (Kazz)
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

324
node_modules/@asamuzakjp/dom-selector/README.md generated vendored Normal file
View File

@@ -0,0 +1,324 @@
# DOM Selector
[![build](https://github.com/asamuzaK/domSelector/actions/workflows/node.js.yml/badge.svg)](https://github.com/asamuzaK/domSelector/actions/workflows/node.js.yml)
[![CodeQL](https://github.com/asamuzaK/domSelector/actions/workflows/github-code-scanning/codeql/badge.svg)](https://github.com/asamuzaK/domSelector/actions/workflows/github-code-scanning/codeql)
[![npm (scoped)](https://img.shields.io/npm/v/@asamuzakjp/dom-selector)](https://www.npmjs.com/package/@asamuzakjp/dom-selector)
A CSS selector engine.
## Install
```console
npm i @asamuzakjp/dom-selector
```
## Usage
```javascript
import { DOMSelector } from '@asamuzakjp/dom-selector';
import { JSDOM } from 'jsdom';
const { window } = new JSDOM();
const {
closest, matches, querySelector, querySelectorAll
} = new DOMSelector(window);
```
<!-- Generated by documentation.js. Update this documentation by updating the source code. -->
### matches(selector, node, opt)
matches - equivalent to [Element.matches()][64]
#### Parameters
- `selector` **[string][59]** CSS selector
- `node` **[object][60]** Element node
- `opt` **[object][60]?** options
- `opt.noexcept` **[boolean][61]?** no exception
- `opt.warn` **[boolean][61]?** console warn e.g. unsupported pseudo-class
Returns **[boolean][61]** `true` if matched, `false` otherwise
### closest(selector, node, opt)
closest - equivalent to [Element.closest()][65]
#### Parameters
- `selector` **[string][59]** CSS selector
- `node` **[object][60]** Element node
- `opt` **[object][60]?** options
- `opt.noexcept` **[boolean][61]?** no exception
- `opt.warn` **[boolean][61]?** console warn e.g. unsupported pseudo-class
Returns **[object][60]?** matched node
### querySelector(selector, node, opt)
querySelector - equivalent to [Document.querySelector()][66], [DocumentFragment.querySelector()][67] and [Element.querySelector()][68]
#### Parameters
- `selector` **[string][59]** CSS selector
- `node` **[object][60]** Document, DocumentFragment or Element node
- `opt` **[object][60]?** options
- `opt.noexcept` **[boolean][61]?** no exception
- `opt.warn` **[boolean][61]?** console warn e.g. unsupported pseudo-class
Returns **[object][60]?** matched node
### querySelectorAll(selector, node, opt)
querySelectorAll - equivalent to [Document.querySelectorAll()][69], [DocumentFragment.querySelectorAll()][70] and [Element.querySelectorAll()][71]
**NOTE**: returns Array, not NodeList
#### Parameters
- `selector` **[string][59]** CSS selector
- `node` **[object][60]** Document, DocumentFragment or Element node
- `opt` **[object][60]?** options
- `opt.noexcept` **[boolean][61]?** no exception
- `opt.warn` **[boolean][61]?** console warn e.g. unsupported pseudo-class
Returns **[Array][62]&lt;([object][60] \| [undefined][63])>** array of matched nodes
## Monkey patch jsdom
``` javascript
import { DOMSelector } from '@asamuzakjp/dom-selector';
import { JSDOM } from 'jsdom';
const dom = new JSDOM('', {
runScripts: 'dangerously',
url: 'http://localhost/',
beforeParse: window => {
const domSelector = new DOMSelector(window);
const matches = domSelector.matches.bind(domSelector);
window.Element.prototype.matches = function (...args) {
if (!args.length) {
throw new window.TypeError('1 argument required, but only 0 present.');
}
const [selector] = args;
return matches(selector, this);
};
const closest = domSelector.closest.bind(domSelector);
window.Element.prototype.closest = function (...args) {
if (!args.length) {
throw new window.TypeError('1 argument required, but only 0 present.');
}
const [selector] = args;
return closest(selector, this);
};
const querySelector = domSelector.querySelector.bind(domSelector);
window.Document.prototype.querySelector = function (...args) {
if (!args.length) {
throw new window.TypeError('1 argument required, but only 0 present.');
}
const [selector] = args;
return querySelector(selector, this);
};
window.DocumentFragment.prototype.querySelector = function (...args) {
if (!args.length) {
throw new window.TypeError('1 argument required, but only 0 present.');
}
const [selector] = args;
return querySelector(selector, this);
};
window.Element.prototype.querySelector = function (...args) {
if (!args.length) {
throw new window.TypeError('1 argument required, but only 0 present.');
}
const [selector] = args;
return querySelector(selector, this);
};
const querySelectorAll = domSelector.querySelectorAll.bind(domSelector);
window.Document.prototype.querySelectorAll = function (...args) {
if (!args.length) {
throw new window.TypeError('1 argument required, but only 0 present.');
}
const [selector] = args;
return querySelectorAll(selector, this);
};
window.DocumentFragment.prototype.querySelectorAll = function (...args) {
if (!args.length) {
throw new window.TypeError('1 argument required, but only 0 present.');
}
const [selector] = args;
return querySelectorAll(selector, this);
};
window.Element.prototype.querySelectorAll = function (...args) {
if (!args.length) {
throw new window.TypeError('1 argument required, but only 0 present.');
}
const [selector] = args;
return querySelectorAll(selector, this);
};
}
});
```
## Supported CSS selectors
|Pattern|Supported|Note|
|:--------|:-------:|:--------|
|\*|✓| |
|E|✓| |
|ns\|E|✓| |
|\*\|E|✓| |
|\|E|✓| |
|E&nbsp;F|✓| |
|E > F|✓| |
|E + F|✓| |
|E ~ F|✓| |
|F \|\| E|Unsupported| |
|E.warning|✓| |
|E#myid|✓| |
|E\[foo\]|✓| |
|E\[foo="bar"\]|✓| |
|E\[foo="bar"&nbsp;i\]|✓| |
|E\[foo="bar"&nbsp;s\]|✓| |
|E\[foo~="bar"\]|✓| |
|E\[foo^="bar"\]|✓| |
|E\[foo$="bar"\]|✓| |
|E\[foo*="bar"\]|✓| |
|E\[foo\|="en"\]|✓| |
|E:is(s1, s2, …)|✓| |
|E:not(s1, s2, …)|✓| |
|E:where(s1, s2, …)|✓| |
|E:has(rs1, rs2, …)|✓| |
|E:defined|Partially supported|Matching with MathML is not yet supported.|
|E:dir(ltr)|✓| |
|E:lang(en)|✓| |
|E:any&#8209;link|✓| |
|E:link|✓| |
|E:visited|✓|Returns `false` or `null` to prevent fingerprinting.|
|E:local&#8209;link|✓| |
|E:target|✓| |
|E:target&#8209;within|✓| |
|E:scope|✓| |
|E:hover|✓| |
|E:active|✓| |
|E:focus|✓| |
|E:focus&#8209;visible|✓| |
|E:focus&#8209;within|✓| |
|E:current|Unsupported| |
|E:current(s)|Unsupported| |
|E:past|Unsupported| |
|E:future|Unsupported| |
|E:open<br>E:closed|Partially supported|Matching with &lt;select&gt;, e.g. `select:open`, is not supported.|
|E:popover-open|Unsupported| |
|E:enabled<br>E:disabled|✓| |
|E:read&#8209;write<br>E:read&#8209;only|✓| |
|E:placeholder&#8209;shown|✓| |
|E:default|✓| |
|E:checked|✓| |
|E:indeterminate|✓| |
|E:blank|Unsupported| |
|E:valid<br>E:invalid|✓| |
|E:in-range<br>E:out-of-range|✓| |
|E:required<br>E:optional|✓| |
|E:user&#8209;valid<br>E:user&#8209;invalid|Unsupported| |
|E:root|✓| |
|E:empty|✓| |
|E:nth&#8209;child(n&nbsp;[of&nbsp;S]?)|✓| |
|E:nth&#8209;last&#8209;child(n&nbsp;[of&nbsp;S]?)|✓| |
|E:first&#8209;child|✓| |
|E:last&#8209;child|✓| |
|E:only&#8209;child|✓| |
|E:nth&#8209;of&#8209;type(n)|✓| |
|E:nth&#8209;last&#8209;of&#8209;type(n)|✓| |
|E:first&#8209;of&#8209;type|✓| |
|E:last&#8209;of&#8209;type|✓| |
|E:only&#8209;of&#8209;type|✓| |
|E:nth&#8209;col(n)|Unsupported| |
|E:nth&#8209;last&#8209;col(n)|Unsupported| |
|CE:state(v)|✓|*1|
|:host|✓| |
|:host(s)|✓| |
|:host(:state(v))|✓|*1|
|:host:has(rs1, rs2, ...)|✓| |
|:host(s):has(rs1, rs2, ...)|✓| |
|:host&#8209;context(s)|✓| |
|:host&#8209;context(s):has(rs1, rs2, ...)|✓| |
|&amp;|✓|Only supports outermost `&`, i.e. equivalent to `:scope`|
*1: `ElementInternals.states`, i.e. `CustomStateSet`, is not implemented in jsdom, so you need to apply a patch in the custom element constructor.
``` javascript
class LabeledCheckbox extends window.HTMLElement {
#internals;
constructor() {
super();
this.#internals = this.attachInternals();
// patch CustomStateSet
if (!this.#internals.states) {
this.#internals.states = new Set();
}
this.addEventListener('click', this._onClick.bind(this));
}
get checked() {
return this.#internals.states.has('checked');
}
set checked(flag) {
if (flag) {
this.#internals.states.add('checked');
} else {
this.#internals.states.delete('checked');
}
}
_onClick(event) {
this.checked = !this.checked;
}
}
```
## Performance
See [benchmark](https://github.com/asamuzaK/domSelector/actions/workflows/benchmark.yml) for the latest results.
## Acknowledgments
The following resources have been of great help in the development of the DOM Selector.
- [CSSTree](https://github.com/csstree/csstree)
- [selery](https://github.com/danburzo/selery)
- [jsdom](https://github.com/jsdom/jsdom)
- [nwsapi](https://github.com/dperini/nwsapi)
---
Copyright (c) 2023 [asamuzaK (Kazz)](https://github.com/asamuzaK/)
[1]: #matches
[2]: #parameters
[3]: #closest
[4]: #parameters-1
[5]: #queryselector
[6]: #parameters-2
[7]: #queryselectorall
[8]: #parameters-3
[59]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String
[60]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object
[61]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean
[62]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array
[63]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/undefined
[64]: https://developer.mozilla.org/docs/Web/API/Element/matches
[65]: https://developer.mozilla.org/docs/Web/API/Element/closest
[66]: https://developer.mozilla.org/docs/Web/API/Document/querySelector
[67]: https://developer.mozilla.org/docs/Web/API/DocumentFragment/querySelector
[68]: https://developer.mozilla.org/docs/Web/API/Element/querySelector
[69]: https://developer.mozilla.org/docs/Web/API/Document/querySelectorAll
[70]: https://developer.mozilla.org/docs/Web/API/DocumentFragment/querySelectorAll
[71]: https://developer.mozilla.org/docs/Web/API/Element/querySelectorAll

79
node_modules/@asamuzakjp/dom-selector/package.json generated vendored Normal file
View File

@@ -0,0 +1,79 @@
{
"name": "@asamuzakjp/dom-selector",
"description": "A CSS selector engine.",
"author": "asamuzaK",
"license": "MIT",
"homepage": "https://github.com/asamuzaK/domSelector#readme",
"bugs": {
"url": "https://github.com/asamuzaK/domSelector/issues"
},
"repository": {
"type": "git",
"url": "git+https://github.com/asamuzaK/domSelector.git"
},
"files": [
"src",
"types"
],
"type": "module",
"exports": {
".": {
"types": "./types/index.d.ts",
"default": "./src/index.js"
},
"./package.json": "./package.json"
},
"dependencies": {
"@asamuzakjp/generational-cache": "^1.0.1",
"@asamuzakjp/nwsapi": "^2.3.9",
"bidi-js": "^1.0.3",
"css-tree": "^3.2.1",
"is-potential-custom-element-name": "^1.0.1"
},
"devDependencies": {
"@types/css-tree": "^2.3.11",
"@types/node": "^25.6.0",
"benchmark": "^2.1.4",
"c8": "^11.0.0",
"chai": "^6.2.2",
"commander": "^14.0.3",
"eslint": "^9.39.4",
"eslint-config-prettier": "^10.1.8",
"eslint-plugin-jsdoc": "^62.9.0",
"eslint-plugin-prettier": "^5.5.5",
"eslint-plugin-regexp": "^3.1.0",
"eslint-plugin-unicorn": "^64.0.0",
"globals": "^17.5.0",
"jsdom": "^29.0.2",
"mitata": "^1.0.34",
"mocha": "^11.7.5",
"neostandard": "^0.13.0",
"prettier": "^3.8.3",
"sinon": "^21.1.2",
"typescript": "^6.0.3",
"wpt-runner": "^7.0.0"
},
"overrides": {
"c8": {
"yargs": "^18.0.0"
},
"jsdom": "$jsdom",
"serialize-javascript": "^7.0.4"
},
"scripts": {
"bench": "node benchmark/bench.js",
"bench:cache": "node benchmark/bench-cache.js",
"bench:cacheMonster": "node benchmark/bench-cache-monster.js",
"bench:sizzle": "node benchmark/bench-sizzle.js",
"build": "npm run tsc && npm run lint && npm test",
"lint": "eslint --fix .",
"test": "c8 --reporter=text mocha --exit test/**/*.test.js",
"test:wpt": "node test/wpt/wpt-runner.js",
"tsc": "node scripts/index clean --dir=types -i && npx tsc",
"update:wpt": "git submodule update --init --recursive --remote"
},
"engines": {
"node": "^20.19.0 || ^22.12.0 || >=24.0.0"
},
"version": "7.1.1"
}

Some files were not shown because too many files have changed in this diff Show More