feat: Reinitialize frontend with SvelteKit and TypeScript

- Delete old Vite+Svelte frontend
- Initialize new SvelteKit project with TypeScript
- Configure Tailwind CSS v4 + DaisyUI
- Implement JWT authentication with auto-refresh
- Create login page with form validation (Zod)
- Add protected route guards
- Update Docker configuration for single-stage build
- Add E2E tests with Playwright (6/11 passing)
- Fix Svelte 5 reactivity with $state() runes

Known issues:
- 5 E2E tests failing (timing/async issues)
- Token refresh implementation needs debugging
- Validation error display timing
This commit is contained in:
2026-02-17 16:19:59 -05:00
parent 54df6018f5
commit de2d83092e
28274 changed files with 3816354 additions and 90 deletions

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

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,52 @@
import Element from '../../../nodes/element/Element.js';
import CSSStyleDeclarationPropertyManager from '../property-manager/CSSStyleDeclarationPropertyManager.js';
/**
* CSS Style Declaration utility
*/
export default class CSSStyleDeclarationComputedStyle {
private element;
/**
* Constructor.
*
* @param element Element.
* @param [computed] Computed.
*/
constructor(element: Element);
/**
* Returns style sheets.
*
* @param element Element.
* @returns Style sheets.
*/
getComputedStyle(): CSSStyleDeclarationPropertyManager;
/**
* Applies CSS text to elements.
*
* @param options Options.
* @param options.elements Elements.
* @param options.cssRules CSS rules.
* @param options.rootElement Root element.
* @param [options.hostElement] Host element.
*/
private parseCSSRules;
/**
* Parses CSS variables in a value.
*
* @param value Value.
* @param cssVariables CSS variables.
* @returns CSS value.
*/
private parseCSSVariablesInValue;
/**
* Parses measurements in a value.
*
* @param options Options.
* @param options.value Value.
* @param options.rootFontSize Root font size.
* @param options.parentFontSize Parent font size.
* @param [options.parentSize] Parent width.
* @returns CSS value.
*/
private parseMeasurementsInValue;
}
//# sourceMappingURL=CSSStyleDeclarationComputedStyle.d.ts.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"CSSStyleDeclarationComputedStyle.d.ts","sourceRoot":"","sources":["../../../../src/css/declaration/computed-style/CSSStyleDeclarationComputedStyle.ts"],"names":[],"mappings":"AAEA,OAAO,OAAO,MAAM,mCAAmC,CAAC;AAIxD,OAAO,kCAAkC,MAAM,2DAA2D,CAAC;AAuB3G;;GAEG;AACH,MAAM,CAAC,OAAO,OAAO,gCAAgC;IACpD,OAAO,CAAC,OAAO,CAAU;IAEzB;;;;;OAKG;gBACS,OAAO,EAAE,OAAO;IAI5B;;;;;OAKG;IACI,gBAAgB,IAAI,kCAAkC;IAkO7D;;;;;;;;OAQG;IACH,OAAO,CAAC,aAAa;IA8DrB;;;;;;OAMG;IACH,OAAO,CAAC,wBAAwB;IAgBhC;;;;;;;;;OASG;IACH,OAAO,CAAC,wBAAwB;CAmChC"}

View File

@@ -0,0 +1,325 @@
import * as PropertySymbol from '../../../PropertySymbol.js';
import CSSStyleDeclarationPropertyManager from '../property-manager/CSSStyleDeclarationPropertyManager.js';
import NodeTypeEnum from '../../../nodes/node/NodeTypeEnum.js';
import CSSRuleTypeEnum from '../../CSSRuleTypeEnum.js';
import CSSStyleDeclarationElementDefaultCSS from './config/CSSStyleDeclarationElementDefaultCSS.js';
import CSSStyleDeclarationElementInheritedProperties from './config/CSSStyleDeclarationElementInheritedProperties.js';
import CSSStyleDeclarationElementMeasurementProperties from './config/CSSStyleDeclarationElementMeasurementProperties.js';
import CSSStyleDeclarationCSSParser from '../css-parser/CSSStyleDeclarationCSSParser.js';
import QuerySelector from '../../../query-selector/QuerySelector.js';
import CSSMeasurementConverter from '../measurement-converter/CSSMeasurementConverter.js';
import MediaQueryList from '../../../match-media/MediaQueryList.js';
import WindowBrowserContext from '../../../window/WindowBrowserContext.js';
const CSS_MEASUREMENT_REGEXP = /[0-9.]+(px|rem|em|vw|vh|%|vmin|vmax|cm|mm|in|pt|pc|Q)/g;
const CSS_VARIABLE_REGEXP = /var\( *(--[^), ]+)\)|var\( *(--[^), ]+), *(.+)\)/;
/**
* CSS Style Declaration utility
*/
export default class CSSStyleDeclarationComputedStyle {
element;
/**
* Constructor.
*
* @param element Element.
* @param [computed] Computed.
*/
constructor(element) {
this.element = element;
}
/**
* Returns style sheets.
*
* @param element Element.
* @returns Style sheets.
*/
getComputedStyle() {
const documentElements = [];
const parentElements = [];
let styleAndElement = {
element: this.element,
cssTexts: []
};
let shadowRootElements = [];
if (!this.element[PropertySymbol.isConnected]) {
return new CSSStyleDeclarationPropertyManager();
}
const cacheResult = this.element[PropertySymbol.cache].computedStyle;
if (cacheResult?.result) {
const result = cacheResult.result.deref();
if (result) {
return result;
}
}
// Walks through all parent elements and stores them in an array with element and matching CSS text.
while (styleAndElement.element) {
if (styleAndElement.element[PropertySymbol.nodeType] === NodeTypeEnum.elementNode) {
const rootNode = styleAndElement.element.getRootNode();
if (rootNode[PropertySymbol.nodeType] === NodeTypeEnum.documentNode) {
documentElements.unshift(styleAndElement);
}
else {
shadowRootElements.unshift(styleAndElement);
}
parentElements.unshift(styleAndElement);
}
if (styleAndElement.element === this.element[PropertySymbol.ownerDocument]) {
const styleSheets = (this.element[PropertySymbol.ownerDocument].querySelectorAll('style,link[rel="stylesheet"]'));
for (const styleSheet of styleSheets) {
const sheet = styleSheet.sheet;
if (sheet) {
this.parseCSSRules({
elements: documentElements,
rootElement: documentElements[0].element[PropertySymbol.tagName] === 'HTML'
? documentElements[0]
: null,
cssRules: sheet.cssRules
});
}
}
for (const sheet of this.element[PropertySymbol.ownerDocument].adoptedStyleSheets) {
this.parseCSSRules({
elements: documentElements,
rootElement: documentElements[0].element[PropertySymbol.tagName] === 'HTML'
? documentElements[0]
: null,
cssRules: sheet.cssRules
});
}
styleAndElement = { element: null, cssTexts: [] };
}
else if (styleAndElement.element[PropertySymbol.nodeType] === NodeTypeEnum.documentFragmentNode &&
styleAndElement.element.host) {
const shadowRoot = styleAndElement.element;
const styleSheets = (shadowRoot.querySelectorAll('style,link[rel="stylesheet"]'));
styleAndElement = {
element: shadowRoot.host,
cssTexts: []
};
for (const styleSheet of styleSheets) {
const sheet = styleSheet.sheet;
if (sheet) {
this.parseCSSRules({
elements: shadowRootElements,
cssRules: sheet.cssRules,
hostElement: styleAndElement
});
}
}
for (const sheet of shadowRoot.adoptedStyleSheets) {
this.parseCSSRules({
elements: shadowRootElements,
cssRules: sheet.cssRules,
hostElement: styleAndElement
});
}
shadowRootElements = [];
}
else {
styleAndElement = {
element: styleAndElement.element[PropertySymbol.parentNode],
cssTexts: []
};
}
}
// Concatenates all parent element CSS to one string.
const targetElement = parentElements[parentElements.length - 1];
const propertyManager = new CSSStyleDeclarationPropertyManager();
const cssProperties = {};
let rootFontSize = 16;
let parentFontSize = 16;
for (const parentElement of parentElements) {
parentElement.cssTexts.sort((a, b) => a.priorityWeight - b.priorityWeight);
let elementCSSText = '';
if (CSSStyleDeclarationElementDefaultCSS[parentElement.element[PropertySymbol.tagName]]) {
if (typeof CSSStyleDeclarationElementDefaultCSS[parentElement.element[PropertySymbol.tagName]] === 'string') {
elementCSSText +=
CSSStyleDeclarationElementDefaultCSS[parentElement.element[PropertySymbol.tagName]];
}
else {
for (const key of Object.keys(CSSStyleDeclarationElementDefaultCSS[parentElement.element[PropertySymbol.tagName]])) {
if (key === 'default' || !!parentElement.element[key]) {
elementCSSText +=
CSSStyleDeclarationElementDefaultCSS[parentElement.element[PropertySymbol.tagName]][key];
}
}
}
elementCSSText +=
CSSStyleDeclarationElementDefaultCSS[parentElement.element[PropertySymbol.tagName]];
}
for (const cssText of parentElement.cssTexts) {
elementCSSText += cssText.cssText;
}
const elementStyleAttribute = parentElement.element.getAttribute('style');
if (elementStyleAttribute) {
elementCSSText += elementStyleAttribute;
}
const rulesAndProperties = CSSStyleDeclarationCSSParser.parse(elementCSSText);
const rules = rulesAndProperties.rules;
Object.assign(cssProperties, rulesAndProperties.properties);
for (const { name, value, important } of rules) {
if (CSSStyleDeclarationElementInheritedProperties[name] ||
parentElement === targetElement) {
const parsedValue = this.parseCSSVariablesInValue(value.trim(), cssProperties);
if (parsedValue && (!propertyManager.get(name)?.important || important)) {
propertyManager.set(name, parsedValue, important);
if (name === 'font' || name === 'font-size') {
const fontSize = propertyManager.properties['font-size'];
if (fontSize !== null) {
const parsedValue = this.parseMeasurementsInValue({
value: fontSize.value,
rootFontSize,
parentFontSize,
parentSize: parentFontSize
});
if (parentElement.element[PropertySymbol.tagName] === 'HTML') {
rootFontSize = parsedValue;
}
else if (parentElement !== targetElement) {
parentFontSize = parsedValue;
}
}
}
}
}
}
}
for (const name of CSSStyleDeclarationElementMeasurementProperties) {
const property = propertyManager.properties[name];
if (property) {
property.value = this.parseMeasurementsInValue({
value: property.value,
rootFontSize,
parentFontSize,
// TODO: Only "font-size" is supported when using percentage values. Add support for other properties.
parentSize: name === 'font-size' ? parentFontSize : null
});
}
}
const cachedResult = {
result: new WeakRef(propertyManager)
};
this.element[PropertySymbol.cache].computedStyle = cachedResult;
this.element[PropertySymbol.ownerDocument][PropertySymbol.affectsComputedStyleCache].push(cachedResult);
return propertyManager;
}
/**
* Applies CSS text to elements.
*
* @param options Options.
* @param options.elements Elements.
* @param options.cssRules CSS rules.
* @param options.rootElement Root element.
* @param [options.hostElement] Host element.
*/
parseCSSRules(options) {
if (!options.elements.length) {
return;
}
const window = this.element[PropertySymbol.window];
for (const rule of options.cssRules) {
if (rule.type === CSSRuleTypeEnum.styleRule) {
const selectorText = rule.selectorText;
if (selectorText) {
if (selectorText.startsWith(':host')) {
if (options.hostElement) {
options.hostElement.cssTexts.push({
cssText: rule[PropertySymbol.cssText],
priorityWeight: 0
});
}
}
else if (selectorText.startsWith(':root')) {
if (options.rootElement) {
options.rootElement.cssTexts.push({
cssText: rule[PropertySymbol.cssText],
priorityWeight: 0
});
}
}
else {
for (const element of options.elements) {
const match = QuerySelector.matches(element.element, selectorText, {
ignoreErrors: true
});
if (match) {
element.cssTexts.push({
cssText: rule[PropertySymbol.cssText],
priorityWeight: match.priorityWeight
});
}
}
}
}
}
else if (rule.type === CSSRuleTypeEnum.mediaRule &&
// TODO: We need to send in a predfined root font size as it will otherwise be calculated using Window.getComputedStyle(), which will cause a never ending loop. Is there another solution?
new MediaQueryList({
window,
media: rule.conditionText,
rootFontSize: this.element[PropertySymbol.tagName] === 'HTML' ? 16 : null
}).matches) {
this.parseCSSRules({
elements: options.elements,
cssRules: rule.cssRules,
hostElement: options.hostElement
});
}
}
}
/**
* Parses CSS variables in a value.
*
* @param value Value.
* @param cssVariables CSS variables.
* @returns CSS value.
*/
parseCSSVariablesInValue(value, cssVariables) {
let newValue = value;
let match;
while ((match = newValue.match(CSS_VARIABLE_REGEXP)) !== null) {
// Fallback value - E.g. var(--my-var, #FFFFFF)
if (match[2] !== undefined) {
newValue = newValue.replace(match[0], cssVariables[match[2]] || match[3]);
}
else {
newValue = newValue.replace(match[0], cssVariables[match[1]] || '');
}
}
return newValue;
}
/**
* Parses measurements in a value.
*
* @param options Options.
* @param options.value Value.
* @param options.rootFontSize Root font size.
* @param options.parentFontSize Parent font size.
* @param [options.parentSize] Parent width.
* @returns CSS value.
*/
parseMeasurementsInValue(options) {
if (new WindowBrowserContext(this.element[PropertySymbol.window]).getSettings()
?.disableComputedStyleRendering) {
return options.value;
}
const regexp = new RegExp(CSS_MEASUREMENT_REGEXP);
let newValue = options.value;
let match;
while ((match = regexp.exec(options.value)) !== null) {
if (match[1] !== 'px') {
const valueInPixels = CSSMeasurementConverter.toPixels({
window: this.element[PropertySymbol.window],
value: match[0],
rootFontSize: options.rootFontSize,
parentFontSize: options.parentFontSize,
parentSize: options.parentSize
});
if (valueInPixels !== null) {
newValue = newValue.replace(match[0], valueInPixels + 'px');
}
}
}
return newValue;
}
}
//# sourceMappingURL=CSSStyleDeclarationComputedStyle.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,135 @@
declare const _default: {
default: string;
A: string;
ABBR: string;
ADDRESS: string;
AREA: string;
ARTICLE: string;
ASIDE: string;
AUDIO: string;
B: string;
BASE: string;
BDI: string;
BDO: string;
BLOCKQUAOTE: string;
BODY: string;
TEMPLATE: string;
FORM: string;
INPUT: string;
TEXTAREA: string;
SCRIPT: string;
IMG: string;
LINK: string;
STYLE: string;
LABEL: string;
SLOT: string;
SVG: string;
CIRCLE: string;
ELLIPSE: string;
LINE: string;
PATH: string;
POLYGON: string;
POLYLINE: string;
RECT: string;
STOP: string;
USE: string;
META: string;
BLOCKQUOTE: string;
BR: string;
BUTTON: string;
CANVAS: string;
CAPTION: string;
CITE: string;
CODE: string;
COL: string;
COLGROUP: string;
DATA: string;
DATALIST: string;
DD: string;
DEL: string;
DETAILS: string;
DFN: string;
DIALOG: {
default: string;
open: string;
};
DIV: string;
DL: string;
DT: string;
EM: string;
EMBED: string;
FIELDSET: string;
FIGCAPTION: string;
FIGURE: string;
FOOTER: string;
H1: string;
H2: string;
H3: string;
H4: string;
H5: string;
H6: string;
HEAD: string;
HEADER: string;
HGROUP: string;
HR: string;
HTML: string;
I: string;
IFRAME: string;
INS: string;
KBD: string;
LEGEND: string;
LI: string;
MAIN: string;
MAP: string;
MARK: string;
MATH: string;
MENU: string;
MENUITEM: string;
METER: string;
NAV: string;
NOSCRIPT: string;
OBJECT: string;
OL: string;
OPTGROUP: string;
OPTION: string;
OUTPUT: string;
P: string;
PARAM: string;
PICTURE: string;
PRE: string;
PROGRESS: string;
Q: string;
RB: string;
RP: string;
RT: string;
RTC: string;
RUBY: string;
S: string;
SAMP: string;
SECTION: string;
SELECT: string;
SMALL: string;
SOURCE: string;
SPAN: string;
STRONG: string;
SUB: string;
SUMMARY: string;
SUP: string;
TABLE: string;
TBODY: string;
TD: string;
TFOOT: string;
TH: string;
THEAD: string;
TIME: string;
TITLE: string;
TR: string;
TRACK: string;
U: string;
UL: string;
VAR: string;
VIDEO: string;
WBR: string;
};
export default _default;
//# sourceMappingURL=CSSStyleDeclarationElementDefaultCSS.d.ts.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"CSSStyleDeclarationElementDefaultCSS.d.ts","sourceRoot":"","sources":["../../../../../src/css/declaration/computed-style/config/CSSStyleDeclarationElementDefaultCSS.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,wBAoIE"}

View File

@@ -0,0 +1,134 @@
export default {
default: 'display: inline;',
A: '',
ABBR: '',
ADDRESS: 'display: block;',
AREA: '',
ARTICLE: 'display: block;',
ASIDE: 'display: block;',
AUDIO: 'display: none;',
B: '',
BASE: 'display: none;',
BDI: '',
BDO: '',
BLOCKQUAOTE: '',
BODY: 'display: block;',
TEMPLATE: 'display: none;',
FORM: 'display: block;',
INPUT: 'display: inline-block;',
TEXTAREA: 'display: inline-block;',
SCRIPT: 'display: none;',
IMG: '',
LINK: 'display: none;',
STYLE: 'display: none;',
LABEL: '',
SLOT: 'display: contents;',
SVG: '',
CIRCLE: '',
ELLIPSE: '',
LINE: '',
PATH: '',
POLYGON: '',
POLYLINE: '',
RECT: '',
STOP: '',
USE: '',
META: 'display: none;',
BLOCKQUOTE: 'display: block;',
BR: '',
BUTTON: 'display: inline-block;',
CANVAS: '',
CAPTION: 'display: table-caption;',
CITE: '',
CODE: '',
COL: 'display: table-column;',
COLGROUP: 'display: table-column-group;',
DATA: '',
DATALIST: 'display: none;',
DD: 'display: block;',
DEL: '',
DETAILS: 'display: block;',
DFN: '',
DIALOG: {
default: 'display: none;',
open: 'display: block;'
},
DIV: 'display: block;',
DL: 'display: block;',
DT: 'display: block;',
EM: '',
EMBED: '',
FIELDSET: 'display: block;',
FIGCAPTION: 'display: block;',
FIGURE: 'display: block;',
FOOTER: 'display: block;',
H1: 'display: block;',
H2: 'display: block;',
H3: 'display: block;',
H4: 'display: block;',
H5: 'display: block;',
H6: 'display: block;',
HEAD: 'display: none;',
HEADER: 'display: block;',
HGROUP: 'display: block;',
HR: 'display: block;',
HTML: 'display: block;direction: ltr;font: 16px "Times New Roman";',
I: '',
IFRAME: '',
INS: '',
KBD: '',
LEGEND: 'display: block;',
LI: 'display: list-item;',
MAIN: 'display: block;',
MAP: '',
MARK: '',
MATH: '',
MENU: 'display: block;',
MENUITEM: '',
METER: 'display: inline-block;',
NAV: 'display: block;',
NOSCRIPT: '',
OBJECT: '',
OL: 'display: block;',
OPTGROUP: 'display: block;',
OPTION: 'display: block;',
OUTPUT: 'unicode-bidi: isolate;',
P: 'display: block;',
PARAM: 'display: none;',
PICTURE: '',
PRE: 'display: block;',
PROGRESS: 'display: inline-block;',
Q: '',
RB: '',
RP: 'display: none;',
RT: '',
RTC: '',
RUBY: '',
S: '',
SAMP: '',
SECTION: 'display: block;',
SELECT: 'display: inline-block;',
SMALL: '',
SOURCE: '',
SPAN: '',
STRONG: '',
SUB: '',
SUMMARY: 'display: block;',
SUP: '',
TABLE: 'display: table;',
TBODY: 'display: table-row-group;',
TD: 'display: table-cell;',
TFOOT: 'display: table-footer-group;',
TH: 'display: table-cell;',
THEAD: 'display: table-header-group;',
TIME: '',
TITLE: 'display: none;',
TR: 'display: table-row;',
TRACK: '',
U: '',
UL: 'display: block;',
VAR: '',
VIDEO: '',
WBR: ''
};
//# sourceMappingURL=CSSStyleDeclarationElementDefaultCSS.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"CSSStyleDeclarationElementDefaultCSS.js","sourceRoot":"","sources":["../../../../../src/css/declaration/computed-style/config/CSSStyleDeclarationElementDefaultCSS.ts"],"names":[],"mappings":"AAAA,eAAe;IACd,OAAO,EAAE,kBAAkB;IAC3B,CAAC,EAAE,EAAE;IACL,IAAI,EAAE,EAAE;IACR,OAAO,EAAE,iBAAiB;IAC1B,IAAI,EAAE,EAAE;IACR,OAAO,EAAE,iBAAiB;IAC1B,KAAK,EAAE,iBAAiB;IACxB,KAAK,EAAE,gBAAgB;IACvB,CAAC,EAAE,EAAE;IACL,IAAI,EAAE,gBAAgB;IACtB,GAAG,EAAE,EAAE;IACP,GAAG,EAAE,EAAE;IACP,WAAW,EAAE,EAAE;IACf,IAAI,EAAE,iBAAiB;IACvB,QAAQ,EAAE,gBAAgB;IAC1B,IAAI,EAAE,iBAAiB;IACvB,KAAK,EAAE,wBAAwB;IAC/B,QAAQ,EAAE,wBAAwB;IAClC,MAAM,EAAE,gBAAgB;IACxB,GAAG,EAAE,EAAE;IACP,IAAI,EAAE,gBAAgB;IACtB,KAAK,EAAE,gBAAgB;IACvB,KAAK,EAAE,EAAE;IACT,IAAI,EAAE,oBAAoB;IAC1B,GAAG,EAAE,EAAE;IACP,MAAM,EAAE,EAAE;IACV,OAAO,EAAE,EAAE;IACX,IAAI,EAAE,EAAE;IACR,IAAI,EAAE,EAAE;IACR,OAAO,EAAE,EAAE;IACX,QAAQ,EAAE,EAAE;IACZ,IAAI,EAAE,EAAE;IACR,IAAI,EAAE,EAAE;IACR,GAAG,EAAE,EAAE;IACP,IAAI,EAAE,gBAAgB;IACtB,UAAU,EAAE,iBAAiB;IAC7B,EAAE,EAAE,EAAE;IACN,MAAM,EAAE,wBAAwB;IAChC,MAAM,EAAE,EAAE;IACV,OAAO,EAAE,yBAAyB;IAClC,IAAI,EAAE,EAAE;IACR,IAAI,EAAE,EAAE;IACR,GAAG,EAAE,wBAAwB;IAC7B,QAAQ,EAAE,8BAA8B;IACxC,IAAI,EAAE,EAAE;IACR,QAAQ,EAAE,gBAAgB;IAC1B,EAAE,EAAE,iBAAiB;IACrB,GAAG,EAAE,EAAE;IACP,OAAO,EAAE,iBAAiB;IAC1B,GAAG,EAAE,EAAE;IACP,MAAM,EAAE;QACP,OAAO,EAAE,gBAAgB;QACzB,IAAI,EAAE,iBAAiB;KACvB;IACD,GAAG,EAAE,iBAAiB;IACtB,EAAE,EAAE,iBAAiB;IACrB,EAAE,EAAE,iBAAiB;IACrB,EAAE,EAAE,EAAE;IACN,KAAK,EAAE,EAAE;IACT,QAAQ,EAAE,iBAAiB;IAC3B,UAAU,EAAE,iBAAiB;IAC7B,MAAM,EAAE,iBAAiB;IACzB,MAAM,EAAE,iBAAiB;IACzB,EAAE,EAAE,iBAAiB;IACrB,EAAE,EAAE,iBAAiB;IACrB,EAAE,EAAE,iBAAiB;IACrB,EAAE,EAAE,iBAAiB;IACrB,EAAE,EAAE,iBAAiB;IACrB,EAAE,EAAE,iBAAiB;IACrB,IAAI,EAAE,gBAAgB;IACtB,MAAM,EAAE,iBAAiB;IACzB,MAAM,EAAE,iBAAiB;IACzB,EAAE,EAAE,iBAAiB;IACrB,IAAI,EAAE,6DAA6D;IACnE,CAAC,EAAE,EAAE;IACL,MAAM,EAAE,EAAE;IACV,GAAG,EAAE,EAAE;IACP,GAAG,EAAE,EAAE;IACP,MAAM,EAAE,iBAAiB;IACzB,EAAE,EAAE,qBAAqB;IACzB,IAAI,EAAE,iBAAiB;IACvB,GAAG,EAAE,EAAE;IACP,IAAI,EAAE,EAAE;IACR,IAAI,EAAE,EAAE;IACR,IAAI,EAAE,iBAAiB;IACvB,QAAQ,EAAE,EAAE;IACZ,KAAK,EAAE,wBAAwB;IAC/B,GAAG,EAAE,iBAAiB;IACtB,QAAQ,EAAE,EAAE;IACZ,MAAM,EAAE,EAAE;IACV,EAAE,EAAE,iBAAiB;IACrB,QAAQ,EAAE,iBAAiB;IAC3B,MAAM,EAAE,iBAAiB;IACzB,MAAM,EAAE,wBAAwB;IAChC,CAAC,EAAE,iBAAiB;IACpB,KAAK,EAAE,gBAAgB;IACvB,OAAO,EAAE,EAAE;IACX,GAAG,EAAE,iBAAiB;IACtB,QAAQ,EAAE,wBAAwB;IAClC,CAAC,EAAE,EAAE;IACL,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,gBAAgB;IACpB,EAAE,EAAE,EAAE;IACN,GAAG,EAAE,EAAE;IACP,IAAI,EAAE,EAAE;IACR,CAAC,EAAE,EAAE;IACL,IAAI,EAAE,EAAE;IACR,OAAO,EAAE,iBAAiB;IAC1B,MAAM,EAAE,wBAAwB;IAChC,KAAK,EAAE,EAAE;IACT,MAAM,EAAE,EAAE;IACV,IAAI,EAAE,EAAE;IACR,MAAM,EAAE,EAAE;IACV,GAAG,EAAE,EAAE;IACP,OAAO,EAAE,iBAAiB;IAC1B,GAAG,EAAE,EAAE;IACP,KAAK,EAAE,iBAAiB;IACxB,KAAK,EAAE,2BAA2B;IAClC,EAAE,EAAE,sBAAsB;IAC1B,KAAK,EAAE,8BAA8B;IACrC,EAAE,EAAE,sBAAsB;IAC1B,KAAK,EAAE,8BAA8B;IACrC,IAAI,EAAE,EAAE;IACR,KAAK,EAAE,gBAAgB;IACvB,EAAE,EAAE,qBAAqB;IACzB,KAAK,EAAE,EAAE;IACT,CAAC,EAAE,EAAE;IACL,EAAE,EAAE,iBAAiB;IACrB,GAAG,EAAE,EAAE;IACP,KAAK,EAAE,EAAE;IACT,GAAG,EAAE,EAAE;CACP,CAAC"}

View File

@@ -0,0 +1,41 @@
declare const _default: {
'border-collapse': boolean;
'border-spacing': boolean;
'caption-side': boolean;
color: boolean;
cursor: boolean;
direction: boolean;
'empty-cells': boolean;
'font-family': boolean;
'font-size': boolean;
'font-style': boolean;
'font-variant': boolean;
'font-weight': boolean;
'font-size-adjust': boolean;
'font-stretch': boolean;
font: boolean;
'letter-spacing': boolean;
'line-height': boolean;
'list-style-image': boolean;
'list-style-position': boolean;
'list-style-type': boolean;
'list-style': boolean;
orphans: boolean;
quotes: boolean;
'tab-size': boolean;
'text-align': boolean;
'text-align-last': boolean;
'text-decoration-color': boolean;
'text-indent': boolean;
'text-justify': boolean;
'text-shadow': boolean;
'text-transform': boolean;
visibility: boolean;
'white-space': boolean;
widows: boolean;
'word-break': boolean;
'word-spacing': boolean;
'word-wrap': boolean;
};
export default _default;
//# sourceMappingURL=CSSStyleDeclarationElementInheritedProperties.d.ts.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"CSSStyleDeclarationElementInheritedProperties.d.ts","sourceRoot":"","sources":["../../../../../src/css/declaration/computed-style/config/CSSStyleDeclarationElementInheritedProperties.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,wBAsCE"}

View File

@@ -0,0 +1,40 @@
export default {
'border-collapse': true,
'border-spacing': true,
'caption-side': true,
color: true,
cursor: true,
direction: true,
'empty-cells': true,
'font-family': true,
'font-size': true,
'font-style': true,
'font-variant': true,
'font-weight': true,
'font-size-adjust': true,
'font-stretch': true,
font: true,
'letter-spacing': true,
'line-height': true,
'list-style-image': true,
'list-style-position': true,
'list-style-type': true,
'list-style': true,
orphans: true,
quotes: true,
'tab-size': true,
'text-align': true,
'text-align-last': true,
'text-decoration-color': true,
'text-indent': true,
'text-justify': true,
'text-shadow': true,
'text-transform': true,
visibility: true,
'white-space': true,
widows: true,
'word-break': true,
'word-spacing': true,
'word-wrap': true
};
//# sourceMappingURL=CSSStyleDeclarationElementInheritedProperties.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"CSSStyleDeclarationElementInheritedProperties.js","sourceRoot":"","sources":["../../../../../src/css/declaration/computed-style/config/CSSStyleDeclarationElementInheritedProperties.ts"],"names":[],"mappings":"AAAA,eAAe;IACd,iBAAiB,EAAE,IAAI;IACvB,gBAAgB,EAAE,IAAI;IACtB,cAAc,EAAE,IAAI;IACpB,KAAK,EAAE,IAAI;IACX,MAAM,EAAE,IAAI;IACZ,SAAS,EAAE,IAAI;IACf,aAAa,EAAE,IAAI;IACnB,aAAa,EAAE,IAAI;IACnB,WAAW,EAAE,IAAI;IACjB,YAAY,EAAE,IAAI;IAClB,cAAc,EAAE,IAAI;IACpB,aAAa,EAAE,IAAI;IACnB,kBAAkB,EAAE,IAAI;IACxB,cAAc,EAAE,IAAI;IACpB,IAAI,EAAE,IAAI;IACV,gBAAgB,EAAE,IAAI;IACtB,aAAa,EAAE,IAAI;IACnB,kBAAkB,EAAE,IAAI;IACxB,qBAAqB,EAAE,IAAI;IAC3B,iBAAiB,EAAE,IAAI;IACvB,YAAY,EAAE,IAAI;IAClB,OAAO,EAAE,IAAI;IACb,MAAM,EAAE,IAAI;IACZ,UAAU,EAAE,IAAI;IAChB,YAAY,EAAE,IAAI;IAClB,iBAAiB,EAAE,IAAI;IACvB,uBAAuB,EAAE,IAAI;IAC7B,aAAa,EAAE,IAAI;IACnB,cAAc,EAAE,IAAI;IACpB,aAAa,EAAE,IAAI;IACnB,gBAAgB,EAAE,IAAI;IACtB,UAAU,EAAE,IAAI;IAChB,aAAa,EAAE,IAAI;IACnB,MAAM,EAAE,IAAI;IACZ,YAAY,EAAE,IAAI;IAClB,cAAc,EAAE,IAAI;IACpB,WAAW,EAAE,IAAI;CACjB,CAAC"}

View File

@@ -0,0 +1,3 @@
declare const _default: string[];
export default _default;
//# sourceMappingURL=CSSStyleDeclarationElementMeasurementProperties.d.ts.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"CSSStyleDeclarationElementMeasurementProperties.d.ts","sourceRoot":"","sources":["../../../../../src/css/declaration/computed-style/config/CSSStyleDeclarationElementMeasurementProperties.ts"],"names":[],"mappings":";AAAA,wBAwCE"}

View File

@@ -0,0 +1,42 @@
export default [
'background-position-x',
'background-position-y',
'background-size',
'border-image-outset',
'border-top-width',
'border-right-width',
'border-bottom-width',
'border-left-width',
'border-top-left-radius',
'border-top-right-radius',
'border-bottom-right-radius',
'border-bottom-left-radius',
'border-image-width',
'clip',
'font-size',
'padding-top',
'padding-right',
'padding-bottom',
'padding-left',
'margin-top',
'margin-right',
'margin-bottom',
'margin-left',
'width',
'height',
'min-width',
'min-height',
'max-width',
'max-height',
'top',
'right',
'bottom',
'left',
'outline-width',
'outline-offset',
'letter-spacing',
'word-spacing',
'text-indent',
'line-height'
];
//# sourceMappingURL=CSSStyleDeclarationElementMeasurementProperties.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"CSSStyleDeclarationElementMeasurementProperties.js","sourceRoot":"","sources":["../../../../../src/css/declaration/computed-style/config/CSSStyleDeclarationElementMeasurementProperties.ts"],"names":[],"mappings":"AAAA,eAAe;IACd,uBAAuB;IACvB,uBAAuB;IACvB,iBAAiB;IACjB,qBAAqB;IACrB,kBAAkB;IAClB,oBAAoB;IACpB,qBAAqB;IACrB,mBAAmB;IACnB,wBAAwB;IACxB,yBAAyB;IACzB,4BAA4B;IAC5B,2BAA2B;IAC3B,oBAAoB;IACpB,MAAM;IACN,WAAW;IACX,aAAa;IACb,eAAe;IACf,gBAAgB;IAChB,cAAc;IACd,YAAY;IACZ,cAAc;IACd,eAAe;IACf,aAAa;IACb,OAAO;IACP,QAAQ;IACR,WAAW;IACX,YAAY;IACZ,WAAW;IACX,YAAY;IACZ,KAAK;IACL,OAAO;IACP,QAAQ;IACR,MAAM;IACN,eAAe;IACf,gBAAgB;IAChB,gBAAgB;IAChB,cAAc;IACd,aAAa;IACb,aAAa;CACb,CAAC"}

View File

@@ -0,0 +1,22 @@
/**
* CSS parser.
*/
export default class CSSStyleDeclarationCSSParser {
/**
* Class construtor.
*
* @param cssText CSS string.
* @param callback Callback.
*/
static parse(cssText: string): {
rules: Array<{
name: string;
value: string;
important: boolean;
}>;
properties: {
[name: string]: string;
};
};
}
//# sourceMappingURL=CSSStyleDeclarationCSSParser.d.ts.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"CSSStyleDeclarationCSSParser.d.ts","sourceRoot":"","sources":["../../../../src/css/declaration/css-parser/CSSStyleDeclarationCSSParser.ts"],"names":[],"mappings":"AAQA;;GAEG;AACH,MAAM,CAAC,OAAO,OAAO,4BAA4B;IAChD;;;;;OAKG;WACW,KAAK,CAAC,OAAO,EAAE,MAAM,GAAG;QACrC,KAAK,EAAE,KAAK,CAAC;YAAE,IAAI,EAAE,MAAM,CAAC;YAAC,KAAK,EAAE,MAAM,CAAC;YAAC,SAAS,EAAE,OAAO,CAAA;SAAE,CAAC,CAAC;QAClE,UAAU,EAAE;YAAE,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAAA;SAAE,CAAC;KACvC;CAsBD"}

View File

@@ -0,0 +1,36 @@
// Groups:
// Property name => \s*([^:;]+?)\s*:
// Property value => \s*((?:[^(;]*?(?:\([^)]*\))?)*?) <- will match any non ';' char except inside (), nested parentheses are not supported
// Important ("!important") => \s*(!important)?
// End of rule => \s*(?:$|;)
const SPLIT_RULES_REGEXP = /\s*([^:;]+?)\s*:\s*((?:[^(;]*?(?:\([^)]*\))?)*?)\s*(!important)?\s*(?:$|;)/g;
/**
* CSS parser.
*/
export default class CSSStyleDeclarationCSSParser {
/**
* Class construtor.
*
* @param cssText CSS string.
* @param callback Callback.
*/
static parse(cssText) {
const properties = {};
const rules = [];
const regexp = new RegExp(SPLIT_RULES_REGEXP);
let match;
while ((match = regexp.exec(cssText))) {
const name = (match[1] ?? '').trim();
const value = (match[2] ?? '').trim();
const important = match[3] ? true : false;
if (name && value) {
if (name.startsWith('--')) {
properties[name] = value;
}
rules.push({ name, value, important });
}
}
return { rules, properties };
}
}
//# sourceMappingURL=CSSStyleDeclarationCSSParser.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"CSSStyleDeclarationCSSParser.js","sourceRoot":"","sources":["../../../../src/css/declaration/css-parser/CSSStyleDeclarationCSSParser.ts"],"names":[],"mappings":"AAAA,UAAU;AACV,sCAAsC;AACtC,4IAA4I;AAC5I,+CAA+C;AAC/C,6BAA6B;AAC7B,MAAM,kBAAkB,GACvB,6EAA6E,CAAC;AAE/E;;GAEG;AACH,MAAM,CAAC,OAAO,OAAO,4BAA4B;IAChD;;;;;OAKG;IACI,MAAM,CAAC,KAAK,CAAC,OAAe;QAIlC,MAAM,UAAU,GAA+B,EAAE,CAAC;QAClD,MAAM,KAAK,GAA+D,EAAE,CAAC;QAC7E,MAAM,MAAM,GAAG,IAAI,MAAM,CAAC,kBAAkB,CAAC,CAAC;QAC9C,IAAI,KAAK,CAAC;QAEV,OAAO,CAAC,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,EAAE,CAAC;YACvC,MAAM,IAAI,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC;YACrC,MAAM,KAAK,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC;YACtC,MAAM,SAAS,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC;YAE1C,IAAI,IAAI,IAAI,KAAK,EAAE,CAAC;gBACnB,IAAI,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;oBAC3B,UAAU,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC;gBAC1B,CAAC;gBAED,KAAK,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC;YACxC,CAAC;QACF,CAAC;QAED,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC;IAC9B,CAAC;CACD"}

View File

@@ -0,0 +1,32 @@
import BrowserWindow from '../../../window/BrowserWindow.js';
/**
* CSS Measurement Converter.
*/
export default class CSSMeasurementConverter {
/**
* Returns measurement in pixels.
*
* @param options Options.
* @param options.window Owner window.
* @param options.value Measurement (e.g. "10px", "10rem" or "10em").
* @param options.rootFontSize Root font size in pixels.
* @param options.parentFontSize Parent font size in pixels.
* @param [options.parentSize] Parent size in pixels.
* @returns Measurement in pixels.
*/
static toPixels(options: {
window: BrowserWindow;
value: string;
rootFontSize: string | number;
parentFontSize: string | number;
parentSize?: string | number | null;
}): number | null;
/**
* Rounds the number with 4 decimals.
*
* @param value Value.
* @returns Rounded value.
*/
static round(value: number): number;
}
//# sourceMappingURL=CSSMeasurementConverter.d.ts.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"CSSMeasurementConverter.d.ts","sourceRoot":"","sources":["../../../../src/css/declaration/measurement-converter/CSSMeasurementConverter.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,MAAM,kCAAkC,CAAC;AAE7D;;GAEG;AACH,MAAM,CAAC,OAAO,OAAO,uBAAuB;IAC3C;;;;;;;;;;OAUG;WACW,QAAQ,CAAC,OAAO,EAAE;QAC/B,MAAM,EAAE,aAAa,CAAC;QACtB,KAAK,EAAE,MAAM,CAAC;QACd,YAAY,EAAE,MAAM,GAAG,MAAM,CAAC;QAC9B,cAAc,EAAE,MAAM,GAAG,MAAM,CAAC;QAChC,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;KACpC,GAAG,MAAM,GAAG,IAAI;IA8CjB;;;;;OAKG;WACW,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;CAG1C"}

View File

@@ -0,0 +1,67 @@
/**
* CSS Measurement Converter.
*/
export default class CSSMeasurementConverter {
/**
* Returns measurement in pixels.
*
* @param options Options.
* @param options.window Owner window.
* @param options.value Measurement (e.g. "10px", "10rem" or "10em").
* @param options.rootFontSize Root font size in pixels.
* @param options.parentFontSize Parent font size in pixels.
* @param [options.parentSize] Parent size in pixels.
* @returns Measurement in pixels.
*/
static toPixels(options) {
const value = parseFloat(options.value);
const unit = options.value.replace(value.toString(), '');
if (isNaN(value)) {
return null;
}
switch (unit) {
case 'px':
return value;
case 'rem':
return this.round(value * parseFloat(options.rootFontSize));
case 'em':
return this.round(value * parseFloat(options.parentFontSize));
case 'vw':
return this.round((value * options.window.innerWidth) / 100);
case 'vh':
return this.round((value * options.window.innerHeight) / 100);
case '%':
return options.parentSize !== undefined && options.parentSize !== null
? this.round((value * parseFloat(options.parentSize)) / 100)
: null;
case 'vmin':
return this.round((value * Math.min(options.window.innerWidth, options.window.innerHeight)) / 100);
case 'vmax':
return (value * Math.max(options.window.innerWidth, options.window.innerHeight)) / 100;
case 'cm':
return this.round(value * 37.7812);
case 'mm':
return this.round(value * 3.7781);
case 'in':
return this.round(value * 96);
case 'pt':
return this.round(value * 1.3281);
case 'pc':
return this.round(value * 16);
case 'Q':
return this.round(value * 0.945);
default:
return null;
}
}
/**
* Rounds the number with 4 decimals.
*
* @param value Value.
* @returns Rounded value.
*/
static round(value) {
return Math.round(value * 10000) / 10000;
}
}
//# sourceMappingURL=CSSMeasurementConverter.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"CSSMeasurementConverter.js","sourceRoot":"","sources":["../../../../src/css/declaration/measurement-converter/CSSMeasurementConverter.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,MAAM,CAAC,OAAO,OAAO,uBAAuB;IAC3C;;;;;;;;;;OAUG;IACI,MAAM,CAAC,QAAQ,CAAC,OAMtB;QACA,MAAM,KAAK,GAAG,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QACxC,MAAM,IAAI,GAAG,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC;QAEzD,IAAI,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;YAClB,OAAO,IAAI,CAAC;QACb,CAAC;QAED,QAAQ,IAAI,EAAE,CAAC;YACd,KAAK,IAAI;gBACR,OAAO,KAAK,CAAC;YACd,KAAK,KAAK;gBACT,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,UAAU,CAAS,OAAO,CAAC,YAAY,CAAC,CAAC,CAAC;YACrE,KAAK,IAAI;gBACR,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,UAAU,CAAS,OAAO,CAAC,cAAc,CAAC,CAAC,CAAC;YACvE,KAAK,IAAI;gBACR,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,KAAK,GAAG,OAAO,CAAC,MAAM,CAAC,UAAU,CAAC,GAAG,GAAG,CAAC,CAAC;YAC9D,KAAK,IAAI;gBACR,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,KAAK,GAAG,OAAO,CAAC,MAAM,CAAC,WAAW,CAAC,GAAG,GAAG,CAAC,CAAC;YAC/D,KAAK,GAAG;gBACP,OAAO,OAAO,CAAC,UAAU,KAAK,SAAS,IAAI,OAAO,CAAC,UAAU,KAAK,IAAI;oBACrE,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,KAAK,GAAG,UAAU,CAAS,OAAO,CAAC,UAAU,CAAC,CAAC,GAAG,GAAG,CAAC;oBACpE,CAAC,CAAC,IAAI,CAAC;YACT,KAAK,MAAM;gBACV,OAAO,IAAI,CAAC,KAAK,CAChB,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,MAAM,CAAC,UAAU,EAAE,OAAO,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,GAAG,GAAG,CAC/E,CAAC;YACH,KAAK,MAAM;gBACV,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,MAAM,CAAC,UAAU,EAAE,OAAO,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,GAAG,GAAG,CAAC;YACxF,KAAK,IAAI;gBACR,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,OAAO,CAAC,CAAC;YACpC,KAAK,IAAI;gBACR,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,MAAM,CAAC,CAAC;YACnC,KAAK,IAAI;gBACR,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,EAAE,CAAC,CAAC;YAC/B,KAAK,IAAI;gBACR,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,MAAM,CAAC,CAAC;YACnC,KAAK,IAAI;gBACR,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,EAAE,CAAC,CAAC;YAC/B,KAAK,GAAG;gBACP,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,CAAC;YAClC;gBACC,OAAO,IAAI,CAAC;QACd,CAAC;IACF,CAAC;IAED;;;;;OAKG;IACI,MAAM,CAAC,KAAK,CAAC,KAAa;QAChC,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,GAAG,KAAK,CAAC;IAC1C,CAAC;CACD"}

View File

@@ -0,0 +1,177 @@
import ICSSStyleDeclarationPropertyValue from './ICSSStyleDeclarationPropertyValue.js';
/**
* Computed style property parser.
*/
export default class CSSStyleDeclarationPropertyGetParser {
/**
* Returns margin.
*
* @param properties Properties.
* @returns Property value
*/
static getMargin(properties: {
[k: string]: ICSSStyleDeclarationPropertyValue;
}): ICSSStyleDeclarationPropertyValue | null;
/**
* Returns padding.
*
* @param properties Properties.
* @returns Property value
*/
static getPadding(properties: {
[k: string]: ICSSStyleDeclarationPropertyValue;
}): ICSSStyleDeclarationPropertyValue | null;
/**
* Returns outline.
*
* @param properties Properties.
* @returns Property value
*/
static getOutline(properties: {
[k: string]: ICSSStyleDeclarationPropertyValue;
}): ICSSStyleDeclarationPropertyValue | null;
/**
* Returns border.
*
* @param properties Properties.
* @returns Property value
*/
static getBorder(properties: {
[k: string]: ICSSStyleDeclarationPropertyValue;
}): ICSSStyleDeclarationPropertyValue | null;
/**
* Returns border.
*
* @param properties Properties.
* @returns Property value
*/
static getBorderTop(properties: {
[k: string]: ICSSStyleDeclarationPropertyValue;
}): ICSSStyleDeclarationPropertyValue | null;
/**
* Returns border.
*
* @param properties Properties.
* @returns Property value
*/
static getBorderRight(properties: {
[k: string]: ICSSStyleDeclarationPropertyValue;
}): ICSSStyleDeclarationPropertyValue | null;
/**
* Returns border.
*
* @param properties Properties.
* @returns Property value
*/
static getBorderBottom(properties: {
[k: string]: ICSSStyleDeclarationPropertyValue;
}): ICSSStyleDeclarationPropertyValue | null;
/**
* Returns border.
*
* @param properties Properties.
* @returns Property value
*/
static getBorderLeft(properties: {
[k: string]: ICSSStyleDeclarationPropertyValue;
}): ICSSStyleDeclarationPropertyValue | null;
/**
* Returns border.
*
* @param properties Properties.
* @returns Property value
*/
static getBorderColor(properties: {
[k: string]: ICSSStyleDeclarationPropertyValue;
}): ICSSStyleDeclarationPropertyValue | null;
/**
* Returns border.
*
* @param properties Properties.
* @returns Property value
*/
static getBorderWidth(properties: {
[k: string]: ICSSStyleDeclarationPropertyValue;
}): ICSSStyleDeclarationPropertyValue | null;
/**
* Returns border.
*
* @param properties Properties.
* @returns Property value
*/
static getBorderStyle(properties: {
[k: string]: ICSSStyleDeclarationPropertyValue;
}): ICSSStyleDeclarationPropertyValue | null;
/**
* Returns border radius.
*
* @param properties Properties.
* @returns Property value
*/
static getBorderRadius(properties: {
[k: string]: ICSSStyleDeclarationPropertyValue;
}): ICSSStyleDeclarationPropertyValue | null;
/**
* Returns border image.
*
* @param properties Properties.
* @returns Property value
*/
static getBorderImage(properties: {
[k: string]: ICSSStyleDeclarationPropertyValue;
}): ICSSStyleDeclarationPropertyValue | null;
/**
* Returns background.
*
* @param properties Properties.
* @returns Property value
*/
static getBackground(properties: {
[k: string]: ICSSStyleDeclarationPropertyValue;
}): ICSSStyleDeclarationPropertyValue | null;
/**
* Returns background position.
*
* @param properties Properties.
* @returns Property value
*/
static getBackgroundPosition(properties: {
[k: string]: ICSSStyleDeclarationPropertyValue;
}): ICSSStyleDeclarationPropertyValue | null;
/**
* Returns flex.
*
* @param properties Properties.
* @returns Property value
*/
static getFlex(properties: {
[k: string]: ICSSStyleDeclarationPropertyValue;
}): ICSSStyleDeclarationPropertyValue | null;
/**
* Returns flex.
*
* @param properties Properties.
* @returns Property value
*/
static getFont(properties: {
[k: string]: ICSSStyleDeclarationPropertyValue;
}): ICSSStyleDeclarationPropertyValue | null;
/**
* Returns border.
*
* @param properties Properties.
* @param position
* @returns Property value
*/
private static getBorderTopRightBottomLeft;
/**
* Returns a padding like property.
*
* @param properties Properties.
* @param position
* @param propertyNames
* @returns Property value
*/
private static getPaddingLikeProperty;
}
//# sourceMappingURL=CSSStyleDeclarationPropertyGetParser.d.ts.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"CSSStyleDeclarationPropertyGetParser.d.ts","sourceRoot":"","sources":["../../../../src/css/declaration/property-manager/CSSStyleDeclarationPropertyGetParser.ts"],"names":[],"mappings":"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"}

View File

@@ -0,0 +1,569 @@
import CSSStyleDeclarationValueParser from './CSSStyleDeclarationValueParser.js';
/**
* Computed style property parser.
*/
export default class CSSStyleDeclarationPropertyGetParser {
/**
* Returns margin.
*
* @param properties Properties.
* @returns Property value
*/
static getMargin(properties) {
return this.getPaddingLikeProperty(['margin-top', 'margin-right', 'margin-bottom', 'margin-left'], properties);
}
/**
* Returns padding.
*
* @param properties Properties.
* @returns Property value
*/
static getPadding(properties) {
return this.getPaddingLikeProperty(['padding-top', 'padding-right', 'padding-bottom', 'padding-left'], properties);
}
/**
* Returns outline.
*
* @param properties Properties.
* @returns Property value
*/
static getOutline(properties) {
if (!properties['outline-color']?.value ||
!properties['outline-style']?.value ||
!properties['outline-width']?.value) {
return null;
}
const important = properties['outline-color'].important &&
properties['outline-style'].important &&
properties['outline-width'].important;
if (CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties['outline-width'].value) &&
properties['outline-width'].value === properties['outline-style'].value &&
properties['outline-width'].value === properties['outline-color'].value) {
return {
important,
value: properties['outline-width'].value
};
}
const values = [];
if (!CSSStyleDeclarationValueParser.getInitial(properties['outline-color']?.value)) {
values.push(properties['outline-color'].value);
}
if (!CSSStyleDeclarationValueParser.getInitial(properties['outline-style']?.value)) {
values.push(properties['outline-style'].value);
}
if (!CSSStyleDeclarationValueParser.getInitial(properties['outline-width'].value)) {
values.push(properties['outline-width'].value);
}
return {
important,
value: values.join(' ')
};
}
/**
* Returns border.
*
* @param properties Properties.
* @returns Property value
*/
static getBorder(properties) {
if (!properties['border-top-width']?.value ||
properties['border-top-width']?.value !== properties['border-right-width']?.value ||
properties['border-top-width']?.value !== properties['border-bottom-width']?.value ||
properties['border-top-width']?.value !== properties['border-left-width']?.value ||
!properties['border-top-style']?.value ||
properties['border-top-style']?.value !== properties['border-right-style']?.value ||
properties['border-top-style']?.value !== properties['border-bottom-style']?.value ||
properties['border-top-style']?.value !== properties['border-left-style']?.value ||
!properties['border-top-color']?.value ||
properties['border-top-color']?.value !== properties['border-right-color']?.value ||
properties['border-top-color']?.value !== properties['border-bottom-color']?.value ||
properties['border-top-color']?.value !== properties['border-left-color']?.value ||
!properties['border-image-source']?.value ||
!properties['border-image-slice']?.value ||
!properties['border-image-width']?.value ||
!properties['border-image-outset']?.value ||
!properties['border-image-repeat']?.value) {
return null;
}
const important = properties['border-top-width'].important &&
properties['border-right-width'].important &&
properties['border-bottom-width'].important &&
properties['border-left-width'].important &&
properties['border-top-style'].important &&
properties['border-right-style'].important &&
properties['border-bottom-style'].important &&
properties['border-left-style'].important &&
properties['border-top-color'].important &&
properties['border-right-color'].important &&
properties['border-bottom-color'].important &&
properties['border-left-color'].important &&
properties['border-image-source'].important &&
properties['border-image-slice'].important &&
properties['border-image-width'].important &&
properties['border-image-outset'].important &&
properties['border-image-repeat'].important;
if (CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties['border-top-width'].value) ||
CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties['border-top-style'].value) ||
CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties['border-top-color'].value) ||
CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties['border-image-source'].value) ||
CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties['border-image-slice'].value) ||
CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties['border-image-width'].value) ||
CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties['border-image-outset'].value) ||
CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties['border-image-repeat'].value)) {
if (properties['border-top-width'].value !== properties['border-top-style'].value ||
properties['border-top-width'].value !== properties['border-top-color'].value ||
properties['border-top-width'].value !== properties['border-image-source'].value ||
properties['border-top-width'].value !== properties['border-image-slice'].value ||
properties['border-top-width'].value !== properties['border-image-width'].value ||
properties['border-top-width'].value !== properties['border-image-outset'].value ||
properties['border-top-width'].value !== properties['border-image-repeat'].value) {
return null;
}
return {
important,
value: properties['border-top-width'].value
};
}
const values = [];
if (!CSSStyleDeclarationValueParser.getInitial(properties['border-top-width'].value)) {
values.push(properties['border-top-width'].value);
}
if (!CSSStyleDeclarationValueParser.getInitial(properties['border-top-style'].value)) {
values.push(properties['border-top-style'].value);
}
if (!CSSStyleDeclarationValueParser.getInitial(properties['border-top-color'].value)) {
values.push(properties['border-top-color'].value);
}
return {
important,
value: values.join(' ')
};
}
/**
* Returns border.
*
* @param properties Properties.
* @returns Property value
*/
static getBorderTop(properties) {
return this.getBorderTopRightBottomLeft('top', properties);
}
/**
* Returns border.
*
* @param properties Properties.
* @returns Property value
*/
static getBorderRight(properties) {
return this.getBorderTopRightBottomLeft('right', properties);
}
/**
* Returns border.
*
* @param properties Properties.
* @returns Property value
*/
static getBorderBottom(properties) {
return this.getBorderTopRightBottomLeft('bottom', properties);
}
/**
* Returns border.
*
* @param properties Properties.
* @returns Property value
*/
static getBorderLeft(properties) {
return this.getBorderTopRightBottomLeft('left', properties);
}
/**
* Returns border.
*
* @param properties Properties.
* @returns Property value
*/
static getBorderColor(properties) {
return this.getPaddingLikeProperty(['border-top-color', 'border-right-color', 'border-bottom-color', 'border-left-color'], properties);
}
/**
* Returns border.
*
* @param properties Properties.
* @returns Property value
*/
static getBorderWidth(properties) {
return this.getPaddingLikeProperty(['border-top-width', 'border-right-width', 'border-bottom-width', 'border-left-width'], properties);
}
/**
* Returns border.
*
* @param properties Properties.
* @returns Property value
*/
static getBorderStyle(properties) {
return this.getPaddingLikeProperty(['border-top-style', 'border-right-style', 'border-bottom-style', 'border-left-style'], properties);
}
/**
* Returns border radius.
*
* @param properties Properties.
* @returns Property value
*/
static getBorderRadius(properties) {
return this.getPaddingLikeProperty([
'border-top-left-radius',
'border-top-right-radius',
'border-bottom-right-radius',
'border-bottom-left-radius'
], properties);
}
/**
* Returns border image.
*
* @param properties Properties.
* @returns Property value
*/
static getBorderImage(properties) {
if (!properties['border-image-source']?.value ||
!properties['border-image-slice']?.value ||
!properties['border-image-width']?.value ||
!properties['border-image-outset']?.value ||
!properties['border-image-repeat']?.value) {
return null;
}
const important = properties['border-image-source'].important &&
properties['border-image-slice'].important &&
properties['border-image-width'].important &&
properties['border-image-outset'].important &&
properties['border-image-repeat'].important;
if (CSSStyleDeclarationValueParser.getGlobal(properties['border-image-source'].value) ||
CSSStyleDeclarationValueParser.getGlobal(properties['border-image-slice'].value) ||
CSSStyleDeclarationValueParser.getGlobal(properties['border-image-width'].value) ||
CSSStyleDeclarationValueParser.getGlobal(properties['border-image-outset'].value) ||
CSSStyleDeclarationValueParser.getGlobal(properties['border-image-repeat'].value)) {
if (properties['border-image-source'].value !== properties['border-image-slice'].value ||
properties['border-image-source'].value !== properties['border-image-width'].value ||
properties['border-image-source'].value !== properties['border-image-outset'].value ||
properties['border-image-source'].value !== properties['border-image-repeat'].value) {
return null;
}
return {
important,
value: properties['border-image-source'].value
};
}
return {
important,
value: `${properties['border-image-source'].value} ${properties['border-image-slice'].value} / ${properties['border-image-width'].value} / ${properties['border-image-outset'].value} ${properties['border-image-repeat'].value}`
};
}
/**
* Returns background.
*
* @param properties Properties.
* @returns Property value
*/
static getBackground(properties) {
if (!properties['background-image']?.value ||
!properties['background-repeat']?.value ||
!properties['background-attachment']?.value ||
!properties['background-position-x']?.value ||
!properties['background-position-y']?.value ||
!properties['background-color']?.value ||
!properties['background-size']?.value ||
!properties['background-origin']?.value ||
!properties['background-clip']?.value) {
return null;
}
const important = properties['background-image'].important &&
properties['background-repeat'].important &&
properties['background-attachment'].important &&
properties['background-position-x'].important &&
properties['background-position-y'].important &&
properties['background-color'].important &&
properties['background-size'].important &&
properties['background-origin'].important &&
properties['background-clip'].important;
if (CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties['background-image'].value) ||
CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties['background-repeat'].value) ||
CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties['background-attachment'].value) ||
CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties['background-position-x'].value) ||
CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties['background-position-y'].value) ||
CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties['background-color'].value) ||
CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties['background-size'].value) ||
CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties['background-origin'].value) ||
CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties['background-clip'].value)) {
if (properties['background-image'].value !== properties['background-repeat'].value ||
properties['background-image'].value !== properties['background-attachment'].value ||
properties['background-image'].value !== properties['background-position-x'].value ||
properties['background-image'].value !== properties['background-position-y'].value ||
properties['background-image'].value !== properties['background-color'].value ||
properties['background-image'].value !== properties['background-size'].value ||
properties['background-image'].value !== properties['background-origin'].value ||
properties['background-image'].value !== properties['background-clip'].value) {
return null;
}
return {
important,
value: properties['background-image'].value
};
}
const values = [];
if (!CSSStyleDeclarationValueParser.getInitial(properties['background-image'].value)) {
values.push(properties['background-image'].value);
}
if (!CSSStyleDeclarationValueParser.getInitial(properties['background-position-x'].value) &&
!CSSStyleDeclarationValueParser.getInitial(properties['background-position-y'].value) &&
!CSSStyleDeclarationValueParser.getInitial(properties['background-size'].value)) {
values.push(`${properties['background-position-x'].value} ${properties['background-position-y'].value} / ${properties['background-size'].value}`);
}
else if (!CSSStyleDeclarationValueParser.getInitial(properties['background-position-x'].value) &&
!CSSStyleDeclarationValueParser.getInitial(properties['background-position-y'].value)) {
values.push(`${properties['background-position-x'].value} ${properties['background-position-y'].value}`);
}
if (!CSSStyleDeclarationValueParser.getInitial(properties['background-repeat'].value)) {
values.push(properties['background-repeat'].value);
}
if (!CSSStyleDeclarationValueParser.getInitial(properties['background-attachment'].value)) {
values.push(properties['background-attachment'].value);
}
if (!CSSStyleDeclarationValueParser.getInitial(properties['background-origin'].value)) {
values.push(properties['background-origin'].value);
}
if (!CSSStyleDeclarationValueParser.getInitial(properties['background-clip'].value)) {
values.push(properties['background-clip'].value);
}
if (!CSSStyleDeclarationValueParser.getInitial(properties['background-color'].value)) {
values.push(properties['background-color'].value);
}
return {
important,
value: values.join(' ')
};
}
/**
* Returns background position.
*
* @param properties Properties.
* @returns Property value
*/
static getBackgroundPosition(properties) {
if (!properties['background-position-x']?.value ||
!properties['background-position-y']?.value) {
return null;
}
const important = properties['background-position-x'].important &&
properties['background-position-y'].important;
if (CSSStyleDeclarationValueParser.getGlobal(properties['background-position-x'].value) ||
CSSStyleDeclarationValueParser.getGlobal(properties['background-position-y'].value)) {
if (properties['background-position-x'].value !== properties['background-position-y'].value) {
return null;
}
return {
important,
value: properties['background-position-x'].value
};
}
const positionX = properties['background-position-x'].value.replace(/ *, */g, ',').split(',');
const positionY = properties['background-position-y'].value.replace(/ *, */g, ',').split(',');
const parts = [];
for (let i = 0; i < positionX.length; i++) {
parts.push(`${positionX[i]} ${positionY[i]}`);
}
return {
important,
value: parts.join(', ')
};
}
/**
* Returns flex.
*
* @param properties Properties.
* @returns Property value
*/
static getFlex(properties) {
if (!properties['flex-grow']?.value ||
!properties['flex-shrink']?.value ||
!properties['flex-basis']?.value) {
return null;
}
const important = properties['flex-grow'].important &&
properties['flex-shrink'].important &&
properties['flex-basis'].important;
if (CSSStyleDeclarationValueParser.getGlobal(properties['flex-grow'].value) ||
CSSStyleDeclarationValueParser.getGlobal(properties['flex-shrink'].value) ||
CSSStyleDeclarationValueParser.getGlobal(properties['flex-basis'].value)) {
if (properties['flex-grow'].value !== properties['flex-shrink'].value ||
properties['flex-grow'].value !== properties['flex-basis'].value) {
return null;
}
return {
important,
value: properties['flex-grow'].value
};
}
return {
important,
value: `${properties['flex-grow'].value} ${properties['flex-shrink'].value} ${properties['flex-basis'].value}`
};
}
/**
* Returns flex.
*
* @param properties Properties.
* @returns Property value
*/
static getFont(properties) {
if (!properties['font-size']?.value ||
!properties['font-family']?.value ||
!properties['font-weight']?.value ||
!properties['font-style']?.value ||
!properties['font-variant']?.value ||
!properties['font-stretch']?.value ||
!properties['line-height']?.value) {
return null;
}
const important = properties['font-size'].important &&
properties['font-family'].important &&
properties['font-weight'].important &&
properties['font-style'].important &&
properties['font-variant'].important &&
properties['font-stretch'].important &&
properties['line-height'].important;
if (CSSStyleDeclarationValueParser.getGlobal(properties['font-size'].value) ||
CSSStyleDeclarationValueParser.getGlobal(properties['font-family'].value) ||
CSSStyleDeclarationValueParser.getGlobal(properties['font-weight'].value) ||
CSSStyleDeclarationValueParser.getGlobal(properties['font-style'].value) ||
CSSStyleDeclarationValueParser.getGlobal(properties['font-variant'].value) ||
CSSStyleDeclarationValueParser.getGlobal(properties['font-stretch'].value) ||
CSSStyleDeclarationValueParser.getGlobal(properties['line-height'].value)) {
if (properties['font-size'].value !== properties['font-family'].value ||
properties['font-size'].value !== properties['font-weight'].value ||
properties['font-size'].value !== properties['font-style'].value ||
properties['font-size'].value !== properties['font-variant'].value ||
properties['font-size'].value !== properties['font-stretch'].value ||
properties['font-size'].value !== properties['line-height'].value) {
return null;
}
return {
important,
value: properties['font-size'].value
};
}
const values = [];
if (properties['font-style'].value !== 'normal') {
values.push(properties['font-style'].value);
}
if (properties['font-variant'].value !== 'normal') {
values.push(properties['font-variant'].value);
}
if (properties['font-weight'].value !== 'normal') {
values.push(properties['font-weight'].value);
}
if (properties['font-stretch'].value !== 'normal') {
values.push(properties['font-stretch'].value);
}
if (properties['line-height'].value !== 'normal') {
values.push(`${properties['font-size'].value} / ${properties['line-height'].value}`);
}
else {
values.push(properties['font-size'].value);
}
values.push(properties['font-family'].value);
return {
important,
value: values.join(' ')
};
}
/**
* Returns border.
*
* @param properties Properties.
* @param position
* @returns Property value
*/
static getBorderTopRightBottomLeft(position, properties) {
if (!properties[`border-${position}-width`]?.value ||
!properties[`border-${position}-style`]?.value ||
!properties[`border-${position}-color`]?.value) {
return null;
}
const important = properties[`border-${position}-width`].important &&
properties[`border-${position}-style`].important &&
properties[`border-${position}-color`].important;
if (CSSStyleDeclarationValueParser.getGlobalExceptInitial(properties[`border-${position}-width`].value) &&
properties[`border-${position}-width`].value ===
properties[`border-${position}-style`].value &&
properties[`border-${position}-width`].value === properties[`border-${position}-color`].value) {
return {
important,
value: properties[`border-${position}-width`].value
};
}
const values = [];
if (!CSSStyleDeclarationValueParser.getInitial(properties[`border-${position}-width`].value)) {
values.push(properties[`border-${position}-width`].value);
}
if (!CSSStyleDeclarationValueParser.getInitial(properties[`border-${position}-style`]?.value)) {
values.push(properties[`border-${position}-style`].value);
}
if (!CSSStyleDeclarationValueParser.getInitial(properties[`border-${position}-color`]?.value)) {
values.push(properties[`border-${position}-color`].value);
}
return {
important,
value: values.join(' ')
};
}
/**
* Returns a padding like property.
*
* @param properties Properties.
* @param position
* @param propertyNames
* @returns Property value
*/
static getPaddingLikeProperty(propertyNames, properties) {
if (!properties[propertyNames[0]]?.value ||
!properties[propertyNames[1]]?.value ||
!properties[propertyNames[2]]?.value ||
!properties[propertyNames[3]]?.value) {
return null;
}
const important = properties[propertyNames[0]].important &&
properties[propertyNames[1]].important &&
properties[propertyNames[2]].important &&
properties[propertyNames[3]].important;
if (CSSStyleDeclarationValueParser.getGlobal(properties[propertyNames[0]].value) ||
CSSStyleDeclarationValueParser.getGlobal(properties[propertyNames[1]].value) ||
CSSStyleDeclarationValueParser.getGlobal(properties[propertyNames[2]].value) ||
CSSStyleDeclarationValueParser.getGlobal(properties[propertyNames[3]].value)) {
if (properties[propertyNames[0]].value !== properties[propertyNames[1]].value ||
properties[propertyNames[0]].value !== properties[propertyNames[2]].value ||
properties[propertyNames[0]].value !== properties[propertyNames[3]].value) {
return null;
}
return {
important,
value: properties[propertyNames[0]].value
};
}
const values = [properties[propertyNames[0]].value];
if (properties[propertyNames[1]].value !== properties[propertyNames[0]].value ||
properties[propertyNames[2]].value !== properties[propertyNames[0]].value ||
properties[propertyNames[3]].value !== properties[propertyNames[1]].value) {
values.push(properties[propertyNames[1]].value);
}
if (properties[propertyNames[2]].value !== properties[propertyNames[0]].value ||
properties[propertyNames[3]].value !== properties[propertyNames[1]].value) {
values.push(properties[propertyNames[2]].value);
}
if (properties[propertyNames[3]].value !== properties[propertyNames[1]].value) {
values.push(properties[propertyNames[3]].value);
}
return {
important,
value: values.join(' ')
};
}
}
//# sourceMappingURL=CSSStyleDeclarationPropertyGetParser.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,66 @@
import ICSSStyleDeclarationPropertyValue from './ICSSStyleDeclarationPropertyValue.js';
/**
* Computed this.properties property parser.
*/
export default class CSSStyleDeclarationPropertyManager {
properties: {
[k: string]: ICSSStyleDeclarationPropertyValue;
};
private definedPropertyNames;
/**
* Class construtor.
*
* @param [options] Options.
* @param [options.cssText] CSS string.
*/
constructor(options?: {
cssText?: string;
});
/**
* Returns property value.
*
* @param name Property name.
* @returns Property value.
*/
get(name: string): ICSSStyleDeclarationPropertyValue | null;
/**
* Removes a property.
*
* @param name Property name.
*/
remove(name: string): void;
/**
* Sets a property
*
* @param name Name.
* @param value Value.
* @param important Important.
*/
set(name: string, value: string, important: boolean): void;
/**
* Returns a clone.
*
* @returns Clone.
*/
clone(): CSSStyleDeclarationPropertyManager;
/**
* Returns size.
*
* @returns Size.
*/
size(): number;
/**
* Returns property name.
*
* @param index Index.
* @returns Property name.
*/
item(index: number): string;
/**
* Converts properties to string.
*
* @returns String.
*/
toString(): string;
}
//# sourceMappingURL=CSSStyleDeclarationPropertyManager.d.ts.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"CSSStyleDeclarationPropertyManager.d.ts","sourceRoot":"","sources":["../../../../src/css/declaration/property-manager/CSSStyleDeclarationPropertyManager.ts"],"names":[],"mappings":"AAAA,OAAO,iCAAiC,MAAM,wCAAwC,CAAC;AAevF;;GAEG;AACH,MAAM,CAAC,OAAO,OAAO,kCAAkC;IAC/C,UAAU,EAAE;QAClB,CAAC,CAAC,EAAE,MAAM,GAAG,iCAAiC,CAAC;KAC/C,CAAM;IACP,OAAO,CAAC,oBAAoB,CAAgC;IAE5D;;;;;OAKG;gBACS,OAAO,CAAC,EAAE;QAAE,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE;IAW1C;;;;;OAKG;IACI,GAAG,CAAC,IAAI,EAAE,MAAM,GAAG,iCAAiC,GAAG,IAAI;IA4ClE;;;;OAIG;IACI,MAAM,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI;IAgJjC;;;;;;OAMG;IACI,GAAG,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,GAAG,IAAI;IA6RjE;;;;OAIG;IACI,KAAK,IAAI,kCAAkC;IAUlD;;;;OAIG;IACI,IAAI,IAAI,MAAM;IAIrB;;;;;OAKG;IACI,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAIlC;;;;OAIG;IACI,QAAQ,IAAI,MAAM;CAwDzB"}

View File

@@ -0,0 +1,594 @@
import CSSStyleDeclarationPropertySetParser from './CSSStyleDeclarationPropertySetParser.js';
import CSSStyleDeclarationValueParser from './CSSStyleDeclarationValueParser.js';
import CSSStyleDeclarationPropertyGetParser from './CSSStyleDeclarationPropertyGetParser.js';
import CSSStyleDeclarationCSSParser from '../css-parser/CSSStyleDeclarationCSSParser.js';
const TO_STRING_SHORTHAND_PROPERTIES = [
['margin'],
['padding'],
['border', ['border-width', 'border-style', 'border-color', 'border-image']],
['border-radius'],
['background', 'background-position'],
['font']
];
/**
* Computed this.properties property parser.
*/
export default class CSSStyleDeclarationPropertyManager {
properties = {};
definedPropertyNames = {};
/**
* Class construtor.
*
* @param [options] Options.
* @param [options.cssText] CSS string.
*/
constructor(options) {
if (options?.cssText) {
const { rules } = CSSStyleDeclarationCSSParser.parse(options.cssText);
for (const rule of rules) {
if (rule.important || !this.get(rule.name)?.important) {
this.set(rule.name, rule.value, rule.important);
}
}
}
}
/**
* Returns property value.
*
* @param name Property name.
* @returns Property value.
*/
get(name) {
if (this.properties[name]) {
return this.properties[name];
}
switch (name) {
case 'margin':
return CSSStyleDeclarationPropertyGetParser.getMargin(this.properties);
case 'padding':
return CSSStyleDeclarationPropertyGetParser.getPadding(this.properties);
case 'border':
return CSSStyleDeclarationPropertyGetParser.getBorder(this.properties);
case 'border-top':
return CSSStyleDeclarationPropertyGetParser.getBorderTop(this.properties);
case 'border-right':
return CSSStyleDeclarationPropertyGetParser.getBorderRight(this.properties);
case 'border-bottom':
return CSSStyleDeclarationPropertyGetParser.getBorderBottom(this.properties);
case 'border-left':
return CSSStyleDeclarationPropertyGetParser.getBorderLeft(this.properties);
case 'border-color':
return CSSStyleDeclarationPropertyGetParser.getBorderColor(this.properties);
case 'border-style':
return CSSStyleDeclarationPropertyGetParser.getBorderStyle(this.properties);
case 'border-width':
return CSSStyleDeclarationPropertyGetParser.getBorderWidth(this.properties);
case 'border-radius':
return CSSStyleDeclarationPropertyGetParser.getBorderRadius(this.properties);
case 'border-image':
return CSSStyleDeclarationPropertyGetParser.getBorderImage(this.properties);
case 'outline':
return CSSStyleDeclarationPropertyGetParser.getOutline(this.properties);
case 'background':
return CSSStyleDeclarationPropertyGetParser.getBackground(this.properties);
case 'background-position':
return CSSStyleDeclarationPropertyGetParser.getBackgroundPosition(this.properties);
case 'flex':
return CSSStyleDeclarationPropertyGetParser.getFlex(this.properties);
case 'font':
return CSSStyleDeclarationPropertyGetParser.getFont(this.properties);
}
return this.properties[name] || null;
}
/**
* Removes a property.
*
* @param name Property name.
*/
remove(name) {
delete this.properties[name];
delete this.definedPropertyNames[name];
switch (name) {
case 'border':
delete this.properties['border-top-width'];
delete this.properties['border-right-width'];
delete this.properties['border-bottom-width'];
delete this.properties['border-left-width'];
delete this.properties['border-top-style'];
delete this.properties['border-right-style'];
delete this.properties['border-bottom-style'];
delete this.properties['border-left-style'];
delete this.properties['border-top-color'];
delete this.properties['border-right-color'];
delete this.properties['border-bottom-color'];
delete this.properties['border-left-color'];
delete this.properties['border-image-source'];
delete this.properties['border-image-slice'];
delete this.properties['border-image-width'];
delete this.properties['border-image-outset'];
delete this.properties['border-image-repeat'];
break;
case 'border-top':
delete this.properties['border-top-width'];
delete this.properties['border-top-style'];
delete this.properties['border-top-color'];
delete this.properties['border-image-source'];
delete this.properties['border-image-slice'];
delete this.properties['border-image-width'];
delete this.properties['border-image-outset'];
delete this.properties['border-image-repeat'];
break;
case 'border-right':
delete this.properties['border-right-width'];
delete this.properties['border-right-style'];
delete this.properties['border-right-color'];
delete this.properties['border-image-source'];
delete this.properties['border-image-slice'];
delete this.properties['border-image-width'];
delete this.properties['border-image-outset'];
delete this.properties['border-image-repeat'];
break;
case 'border-bottom':
delete this.properties['border-bottom-width'];
delete this.properties['border-bottom-style'];
delete this.properties['border-bottom-color'];
delete this.properties['border-image-source'];
delete this.properties['border-image-slice'];
delete this.properties['border-image-width'];
delete this.properties['border-image-outset'];
delete this.properties['border-image-repeat'];
break;
case 'border-left':
delete this.properties['border-left-width'];
delete this.properties['border-left-style'];
delete this.properties['border-left-color'];
delete this.properties['border-image-source'];
delete this.properties['border-image-slice'];
delete this.properties['border-image-width'];
delete this.properties['border-image-outset'];
delete this.properties['border-image-repeat'];
break;
case 'border-width':
delete this.properties['border-top-width'];
delete this.properties['border-right-width'];
delete this.properties['border-bottom-width'];
delete this.properties['border-left-width'];
break;
case 'border-style':
delete this.properties['border-top-style'];
delete this.properties['border-right-style'];
delete this.properties['border-bottom-style'];
delete this.properties['border-left-style'];
break;
case 'border-color':
delete this.properties['border-top-color'];
delete this.properties['border-right-color'];
delete this.properties['border-bottom-color'];
delete this.properties['border-left-color'];
break;
case 'border-image':
delete this.properties['border-image-source'];
delete this.properties['border-image-slice'];
delete this.properties['border-image-width'];
delete this.properties['border-image-outset'];
delete this.properties['border-image-repeat'];
break;
case 'border-radius':
delete this.properties['border-top-left-radius'];
delete this.properties['border-top-right-radius'];
delete this.properties['border-bottom-right-radius'];
delete this.properties['border-bottom-left-radius'];
break;
case 'outline':
delete this.properties['outline-color'];
delete this.properties['outline-style'];
delete this.properties['outline-width'];
break;
case 'background':
delete this.properties['background-color'];
delete this.properties['background-image'];
delete this.properties['background-repeat'];
delete this.properties['background-attachment'];
delete this.properties['background-position-x'];
delete this.properties['background-position-y'];
delete this.properties['background-size'];
delete this.properties['background-origin'];
delete this.properties['background-clip'];
break;
case 'background-position':
delete this.properties['background-position-x'];
delete this.properties['background-position-y'];
break;
case 'flex':
delete this.properties['flex-grow'];
delete this.properties['flex-shrink'];
delete this.properties['flex-basis'];
break;
case 'font':
delete this.properties['font-style'];
delete this.properties['font-variant'];
delete this.properties['font-weight'];
delete this.properties['font-stretch'];
delete this.properties['font-size'];
delete this.properties['line-height'];
delete this.properties['font-family'];
break;
case 'padding':
delete this.properties['padding-top'];
delete this.properties['padding-right'];
delete this.properties['padding-bottom'];
delete this.properties['padding-left'];
break;
case 'margin':
delete this.properties['margin-top'];
delete this.properties['margin-right'];
delete this.properties['margin-bottom'];
delete this.properties['margin-left'];
break;
}
}
/**
* Sets a property
*
* @param name Name.
* @param value Value.
* @param important Important.
*/
set(name, value, important) {
if (value === null) {
this.remove(name);
return;
}
let properties = null;
switch (name) {
case 'border':
properties = CSSStyleDeclarationPropertySetParser.getBorder(value, important);
break;
case 'border-top':
properties = CSSStyleDeclarationPropertySetParser.getBorderTop(value, important);
break;
case 'border-right':
properties = CSSStyleDeclarationPropertySetParser.getBorderRight(value, important);
break;
case 'border-bottom':
properties = CSSStyleDeclarationPropertySetParser.getBorderBottom(value, important);
break;
case 'border-left':
properties = CSSStyleDeclarationPropertySetParser.getBorderLeft(value, important);
break;
case 'border-width':
properties = CSSStyleDeclarationPropertySetParser.getBorderWidth(value, important);
break;
case 'border-style':
properties = CSSStyleDeclarationPropertySetParser.getBorderStyle(value, important);
break;
case 'border-color':
properties = CSSStyleDeclarationPropertySetParser.getBorderColor(value, important);
break;
case 'border-image':
properties = CSSStyleDeclarationPropertySetParser.getBorderImage(value, important);
break;
case 'border-image-source':
properties = CSSStyleDeclarationPropertySetParser.getBorderImageSource(value, important);
break;
case 'border-image-slice':
properties = CSSStyleDeclarationPropertySetParser.getBorderImageSlice(value, important);
break;
case 'border-image-width':
properties = CSSStyleDeclarationPropertySetParser.getBorderImageWidth(value, important);
break;
case 'border-image-outset':
properties = CSSStyleDeclarationPropertySetParser.getBorderImageOutset(value, important);
break;
case 'border-image-repeat':
properties = CSSStyleDeclarationPropertySetParser.getBorderImageRepeat(value, important);
break;
case 'border-top-width':
properties = CSSStyleDeclarationPropertySetParser.getBorderTopWidth(value, important);
break;
case 'border-right-width':
properties = CSSStyleDeclarationPropertySetParser.getBorderRightWidth(value, important);
break;
case 'border-bottom-width':
properties = CSSStyleDeclarationPropertySetParser.getBorderBottomWidth(value, important);
break;
case 'border-left-width':
properties = CSSStyleDeclarationPropertySetParser.getBorderLeftWidth(value, important);
break;
case 'border-top-color':
properties = CSSStyleDeclarationPropertySetParser.getBorderTopColor(value, important);
break;
case 'border-right-color':
properties = CSSStyleDeclarationPropertySetParser.getBorderRightColor(value, important);
break;
case 'border-bottom-color':
properties = CSSStyleDeclarationPropertySetParser.getBorderBottomColor(value, important);
break;
case 'border-left-color':
properties = CSSStyleDeclarationPropertySetParser.getBorderLeftColor(value, important);
break;
case 'border-top-style':
properties = CSSStyleDeclarationPropertySetParser.getBorderTopStyle(value, important);
break;
case 'border-right-style':
properties = CSSStyleDeclarationPropertySetParser.getBorderRightStyle(value, important);
break;
case 'border-bottom-style':
properties = CSSStyleDeclarationPropertySetParser.getBorderBottomStyle(value, important);
break;
case 'border-left-style':
properties = CSSStyleDeclarationPropertySetParser.getBorderLeftStyle(value, important);
break;
case 'border-radius':
properties = CSSStyleDeclarationPropertySetParser.getBorderRadius(value, important);
break;
case 'border-top-left-radius':
properties = CSSStyleDeclarationPropertySetParser.getBorderTopLeftRadius(value, important);
break;
case 'border-top-right-radius':
properties = CSSStyleDeclarationPropertySetParser.getBorderTopRightRadius(value, important);
break;
case 'border-bottom-right-radius':
properties = CSSStyleDeclarationPropertySetParser.getBorderBottomRightRadius(value, important);
break;
case 'border-bottom-left-radius':
properties = CSSStyleDeclarationPropertySetParser.getBorderBottomLeftRadius(value, important);
break;
case 'border-collapse':
properties = CSSStyleDeclarationPropertySetParser.getBorderCollapse(value, important);
break;
case 'outline':
properties = CSSStyleDeclarationPropertySetParser.getOutline(value, important);
break;
case 'outline-width':
properties = CSSStyleDeclarationPropertySetParser.getOutlineWidth(value, important);
break;
case 'outline-style':
properties = CSSStyleDeclarationPropertySetParser.getOutlineStyle(value, important);
break;
case 'outline-color':
properties = CSSStyleDeclarationPropertySetParser.getOutlineColor(value, important);
break;
case 'letter-spacing':
properties = CSSStyleDeclarationPropertySetParser.getLetterSpacing(value, important);
break;
case 'word-spacing':
properties = CSSStyleDeclarationPropertySetParser.getWordSpacing(value, important);
break;
case 'clear':
properties = CSSStyleDeclarationPropertySetParser.getClear(value, important);
break;
case 'clip':
properties = CSSStyleDeclarationPropertySetParser.getClip(value, important);
break;
case 'css-float':
properties = CSSStyleDeclarationPropertySetParser.getCSSFloat(value, important);
break;
case 'float':
properties = CSSStyleDeclarationPropertySetParser.getFloat(value, important);
break;
case 'display':
properties = CSSStyleDeclarationPropertySetParser.getDisplay(value, important);
break;
case 'direction':
properties = CSSStyleDeclarationPropertySetParser.getDirection(value, important);
break;
case 'flex':
properties = CSSStyleDeclarationPropertySetParser.getFlex(value, important);
break;
case 'flex-shrink':
properties = CSSStyleDeclarationPropertySetParser.getFlexShrink(value, important);
break;
case 'flex-grow':
properties = CSSStyleDeclarationPropertySetParser.getFlexGrow(value, important);
break;
case 'flex-basis':
properties = CSSStyleDeclarationPropertySetParser.getFlexBasis(value, important);
break;
case 'padding':
properties = CSSStyleDeclarationPropertySetParser.getPadding(value, important);
break;
case 'padding-top':
properties = CSSStyleDeclarationPropertySetParser.getPaddingTop(value, important);
break;
case 'padding-right':
properties = CSSStyleDeclarationPropertySetParser.getPaddingRight(value, important);
break;
case 'padding-bottom':
properties = CSSStyleDeclarationPropertySetParser.getPaddingBottom(value, important);
break;
case 'padding-left':
properties = CSSStyleDeclarationPropertySetParser.getPaddingLeft(value, important);
break;
case 'margin':
properties = CSSStyleDeclarationPropertySetParser.getMargin(value, important);
break;
case 'margin-top':
properties = CSSStyleDeclarationPropertySetParser.getMarginTop(value, important);
break;
case 'margin-right':
properties = CSSStyleDeclarationPropertySetParser.getMarginRight(value, important);
break;
case 'margin-bottom':
properties = CSSStyleDeclarationPropertySetParser.getMarginBottom(value, important);
break;
case 'margin-left':
properties = CSSStyleDeclarationPropertySetParser.getMarginLeft(value, important);
break;
case 'background':
properties = CSSStyleDeclarationPropertySetParser.getBackground(value, important);
break;
case 'background-image':
properties = CSSStyleDeclarationPropertySetParser.getBackgroundImage(value, important);
break;
case 'background-color':
properties = CSSStyleDeclarationPropertySetParser.getBackgroundColor(value, important);
break;
case 'background-repeat':
properties = CSSStyleDeclarationPropertySetParser.getBackgroundRepeat(value, important);
break;
case 'background-attachment':
properties = CSSStyleDeclarationPropertySetParser.getBackgroundAttachment(value, important);
break;
case 'background-position':
properties = CSSStyleDeclarationPropertySetParser.getBackgroundPosition(value, important);
break;
case 'width':
properties = CSSStyleDeclarationPropertySetParser.getWidth(value, important);
break;
case 'height':
properties = CSSStyleDeclarationPropertySetParser.getHeight(value, important);
break;
case 'top':
properties = CSSStyleDeclarationPropertySetParser.getTop(value, important);
break;
case 'right':
properties = CSSStyleDeclarationPropertySetParser.getRight(value, important);
break;
case 'bottom':
properties = CSSStyleDeclarationPropertySetParser.getBottom(value, important);
break;
case 'left':
properties = CSSStyleDeclarationPropertySetParser.getLeft(value, important);
break;
case 'font':
properties = CSSStyleDeclarationPropertySetParser.getFont(value, important);
break;
case 'font-style':
properties = CSSStyleDeclarationPropertySetParser.getFontStyle(value, important);
break;
case 'font-variant':
properties = CSSStyleDeclarationPropertySetParser.getFontVariant(value, important);
break;
case 'font-weight':
properties = CSSStyleDeclarationPropertySetParser.getFontWeight(value, important);
break;
case 'font-stretch':
properties = CSSStyleDeclarationPropertySetParser.getFontStretch(value, important);
break;
case 'font-size':
properties = CSSStyleDeclarationPropertySetParser.getFontSize(value, important);
break;
case 'line-height':
properties = CSSStyleDeclarationPropertySetParser.getLineHeight(value, important);
break;
case 'text-indent':
properties = CSSStyleDeclarationPropertySetParser.getTextIndent(value, important);
break;
case 'font-family':
properties = CSSStyleDeclarationPropertySetParser.getFontFamily(value, important);
break;
case 'color':
properties = CSSStyleDeclarationPropertySetParser.getColor(value, important);
break;
case 'flood-color':
properties = CSSStyleDeclarationPropertySetParser.getFloodColor(value, important);
break;
case 'text-transform':
properties = CSSStyleDeclarationPropertySetParser.getTextTransform(value, important);
break;
case 'visibility':
properties = CSSStyleDeclarationPropertySetParser.getVisibility(value, important);
break;
case 'aspect-ratio':
properties = CSSStyleDeclarationPropertySetParser.getAspectRatio(value, important);
break;
default:
const trimmedValue = value.trim();
if (trimmedValue) {
const globalValue = CSSStyleDeclarationValueParser.getGlobal(trimmedValue);
properties = {
[name]: { value: globalValue || trimmedValue, important }
};
}
break;
}
if (properties !== null && Object.keys(properties).length > 0) {
this.definedPropertyNames[name] = true;
Object.assign(this.properties, properties);
}
}
/**
* Returns a clone.
*
* @returns Clone.
*/
clone() {
const _class = this.constructor;
const clone = new _class();
clone.properties = JSON.parse(JSON.stringify(this.properties));
clone.definedPropertyNames = Object.assign({}, this.definedPropertyNames);
return clone;
}
/**
* Returns size.
*
* @returns Size.
*/
size() {
return Object.keys(this.properties).length;
}
/**
* Returns property name.
*
* @param index Index.
* @returns Property name.
*/
item(index) {
return Object.keys(this.properties)[index] || '';
}
/**
* Converts properties to string.
*
* @returns String.
*/
toString() {
const result = [];
const clone = this.clone();
const properties = {};
for (const shorthandPropertyGroup of TO_STRING_SHORTHAND_PROPERTIES) {
for (const shorthandProperty of shorthandPropertyGroup) {
if (Array.isArray(shorthandProperty)) {
let isMatch = false;
for (const childShorthandProperty of shorthandProperty) {
const property = clone.get(childShorthandProperty);
if (property) {
properties[childShorthandProperty] = property;
clone.remove(childShorthandProperty);
isMatch = true;
}
}
if (isMatch) {
break;
}
}
else {
const property = clone.get(shorthandProperty);
if (property) {
properties[shorthandProperty] = property;
clone.remove(shorthandProperty);
break;
}
}
}
}
for (const name of Object.keys(clone.properties)) {
properties[name] = clone.get(name);
}
for (const definedPropertyName of Object.keys(this.definedPropertyNames)) {
const property = properties[definedPropertyName];
if (property) {
result.push(`${definedPropertyName}: ${property.value}${property.important ? ' !important' : ''};`);
delete properties[definedPropertyName];
}
}
for (const propertyName of Object.keys(properties)) {
const property = properties[propertyName];
if (property) {
result.push(`${propertyName}: ${property.value}${property.important ? ' !important' : ''};`);
}
}
return result.join(' ');
}
}
//# sourceMappingURL=CSSStyleDeclarationPropertyManager.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,910 @@
import ICSSStyleDeclarationPropertyValue from './ICSSStyleDeclarationPropertyValue.js';
/**
* Computed style property parser.
*/
export default class CSSStyleDeclarationPropertySetParser {
/**
* Returns border collapse.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderCollapse(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns display.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getDisplay(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns direction.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getDirection(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns letter spacing.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getLetterSpacing(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns word spacing.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getWordSpacing(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns text indent.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getTextIndent(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns width.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getWidth(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns height.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getHeight(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns top.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getTop(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns top.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getRight(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns top.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBottom(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns top.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getLeft(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns clear.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getClear(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns clip
*
* Based on:
* https://github.com/jsdom/cssstyle/blob/master/lib/properties/clip.js
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getClip(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns float.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getFloat(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns float.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getCSSFloat(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns outline.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getOutline(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns outline color.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getOutlineColor(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns outline offset.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getOutlineOffset(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns outline style.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getOutlineStyle(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns outline width.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getOutlineWidth(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getBorder(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border width.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderWidth(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border style.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderStyle(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border color.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderColor(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border image.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderImage(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border source.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderImageSource(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border slice.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderImageSlice(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border width.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderImageWidth(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border outset.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderImageOutset(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border repeat.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderImageRepeat(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border width.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderTopWidth(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border width.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderRightWidth(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border width.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderBottomWidth(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border width.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderLeftWidth(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border style.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderTopStyle(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border style.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderRightStyle(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border style.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderBottomStyle(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border style.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderLeftStyle(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border color.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderTopColor(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border color.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderRightColor(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border color.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderBottomColor(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border color.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBorderLeftColor(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border radius.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getBorderRadius(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border radius.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getBorderTopLeftRadius(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border radius.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getBorderTopRightRadius(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border radius.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getBorderBottomRightRadius(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border radius.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getBorderBottomLeftRadius(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border top, right, bottom or left.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getBorderTop(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border top, right, bottom or left.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getBorderRight(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border top, right, bottom or left.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getBorderBottom(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns border top, right, bottom or left.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getBorderLeft(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns padding.
*
* @param value Value.
* @param important Important.
*/
static getPadding(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns padding top.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getPaddingTop(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns padding right.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getPaddingRight(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns padding bottom.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getPaddingBottom(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns padding left.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getPaddingLeft(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns margin.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getMargin(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns margin top.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getMarginTop(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns margin right.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getMarginRight(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns margin right.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getMarginBottom(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns margin left.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getMarginLeft(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns flex.
*
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getFlex(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns flex basis.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getFlexBasis(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns flex shrink.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getFlexShrink(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns flex grow.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getFlexGrow(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns background.
*
* @param name Name.
* @param value Value.
* @param important Important.
* @returns Property values.
*/
static getBackground(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns background size.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBackgroundSize(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns background origin.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBackgroundOrigin(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns background clip.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBackgroundClip(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns background repeat.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBackgroundRepeat(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns background attachment.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBackgroundAttachment(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns background position.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBackgroundPosition(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns background position.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBackgroundPositionX(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns background position.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getBackgroundPositionY(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns background color.
*
* @param value Value.
* @param important Important.
* @returns Property value.
*/
static getBackgroundColor(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns background image.
*
* @param value Value.
* @param important Important.
* @returns Property value.
*/
static getBackgroundImage(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns color.
*
* @param value Value.
* @param important Important.
* @returns Property value.
*/
static getColor(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns color.
*
* @param value Value.
* @param important Important.
* @returns Property value.
*/
static getFloodColor(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns font.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getFont(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns font style.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getFontStyle(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns font variant.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getFontVariant(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns font strech.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getFontStretch(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns font weight.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getFontWeight(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns font size.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getFontSize(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns line height.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getLineHeight(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns font family.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getFontFamily(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns font family.
*
* @param value Value.
* @param important Important.
* @returns Property values
*/
static getTextTransform(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns visibility.
*
* @param value Value.
* @param important Important.
* @returns Property
*/
static getVisibility(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
/**
* Returns aspect ratio.
*
* @param value Value.
* @param important Important.
* @returns Property
*/
static getAspectRatio(value: string, important: boolean): {
[key: string]: ICSSStyleDeclarationPropertyValue;
};
}
//# sourceMappingURL=CSSStyleDeclarationPropertySetParser.d.ts.map

File diff suppressed because one or more lines are too long

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,128 @@
/**
* Style declaration value parser.
*/
export default class CSSStyleDeclarationValueParser {
/**
* Returns length.
*
* @param value Value.
* @returns Parsed value.
*/
static getLength(value: string): string;
/**
* Returns percentance.
*
* @param value Value.
* @returns Parsed value.
*/
static getPercentage(value: string): string;
/**
* Returns degree.
*
* @param value Value.
* @returns Parsed value.
*/
static getDegree(value: string): string;
/**
* Returns calc.
*
* @param value Value.
* @returns Parsed value.
*/
static getCalc(value: string): string;
/**
* Returns fit content.
*
* @param value Value.
* @returns Parsed value.
*/
static getFitContent(value: string): string;
/**
* Returns measurement.
*
* @param value Value.
* @returns Parsed value.
*/
static getMeasurement(value: string): string;
/**
* Returns measurement or auto, min-content, max-content or fit-content.
*
* @param value Value.
* @returns Parsed value.
*/
static getContentMeasurement(value: string): string;
/**
* Returns measurement or auto, min-content, max-content or fit-content.
*
* @param value Value.
* @returns Parsed value.
*/
static getAutoMeasurement(value: string): string;
/**
* Returns integer.
*
* @param value Value.
* @returns Parsed value.
*/
static getInteger(value: string): string;
/**
* Returns float.
*
* @param value Value.
* @returns Parsed value.
*/
static getFloat(value: string): string;
/**
* Returns gradient.
*
* @param value Value.
* @returns Parsed value.
*/
static getGradient(value: string): string;
/**
* Returns color.
*
* @param value Value.
* @returns Parsed value.
*/
static getColor(value: string): string;
/**
* Returns URL.
*
* Based on:
* https://github.com/jsdom/cssstyle/blob/master/lib/parsers.js#L222
*
* @param value Value.
* @returns Parsed value.
*/
static getURL(value: string): string;
/**
* Returns global initial value.
*
* @param value Value.
* @returns Parsed value.
*/
static getInitial(value: string): string;
/**
* Returns CSS variable.
*
* @param value Value.
* @returns Parsed value.
*/
static getVariable(value: string): string;
/**
* Returns global.
*
* @param value Value.
* @returns Parsed value.
*/
static getGlobal(value: string): string;
/**
* Returns global, unless it is not set to 'initial' as it is sometimes treated different.
*
* @param value Value.
* @returns Parsed value.
*/
static getGlobalExceptInitial(value: string): string;
}
//# sourceMappingURL=CSSStyleDeclarationValueParser.d.ts.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"CSSStyleDeclarationValueParser.d.ts","sourceRoot":"","sources":["../../../../src/css/declaration/property-manager/CSSStyleDeclarationValueParser.ts"],"names":[],"mappings":"AA0KA;;GAEG;AACH,MAAM,CAAC,OAAO,OAAO,8BAA8B;IAClD;;;;;OAKG;WACW,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAgB9C;;;;;OAKG;WACW,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAUlD;;;;;OAKG;WACW,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAU9C;;;;;OAKG;WACW,OAAO,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAO5C;;;;;OAKG;WACW,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAgBlD;;;;;OAKG;WACW,cAAc,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAInD;;;;;OAKG;WACW,qBAAqB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAI1D;;;;;OAKG;WACW,kBAAkB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAOvD;;;;;OAKG;WACW,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAO/C;;;;;OAKG;WACW,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAW7C;;;;;OAKG;WACW,WAAW,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAWhD;;;;;OAKG;WACW,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAW7C;;;;;;;;OAQG;WACW,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IA4C3C;;;;;OAKG;WACW,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAI/C;;;;;OAKG;WACW,WAAW,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAQhD;;;;;OAKG;WACW,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAK9C;;;;;OAKG;WACW,sBAAsB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;CAI3D"}

View File

@@ -0,0 +1,429 @@
const COLOR_REGEXP = /^#([0-9a-fA-F]{3,4}){1,2}$|^rgb\(([^)]*)\)$|^rgba\(([^)]*)\)$|^hsla?\(\s*(-?\d+|-?\d*.\d+)\s*,\s*(-?\d+|-?\d*.\d+)%\s*,\s*(-?\d+|-?\d*.\d+)%\s*(,\s*(-?\d+|-?\d*.\d+)\s*)?\)|(?:(rgba?|hsla?)\((var\(\s*(--[^)\s]+)\))\))/;
const LENGTH_REGEXP = /^(0|[-+]?[0-9]*\.?[0-9]+)(in|cm|em|mm|pt|pc|px|ex|rem|vh|vw|ch|vw|vh|vmin|vmax|Q)$/;
const PERCENTAGE_REGEXP = /^[-+]?[0-9]*\.?[0-9]+%$/;
const DEGREE_REGEXP = /^[0-9]+deg$/;
const URL_REGEXP = /^url\(\s*([^)]*)\s*\)$/;
const INTEGER_REGEXP = /^[0-9]+$/;
const FLOAT_REGEXP = /^[0-9.]+$/;
const CALC_REGEXP = /^calc\([^^)]+\)$/;
const CSS_VARIABLE_REGEXP = /^var\(\s*(--[^)\s]+)\)$/;
const FIT_CONTENT_REGEXP = /^fit-content\([^^)]+\)$/;
const GRADIENT_REGEXP = /^((repeating-linear|linear|radial|repeating-radial|conic|repeating-conic)-gradient)\(([^)]+)\)$/;
const GLOBALS = ['inherit', 'initial', 'unset', 'revert'];
const COLORS = [
'none',
'currentcolor',
'transparent',
'silver',
'gray',
'white',
'maroon',
'red',
'purple',
'fuchsia',
'green',
'lime',
'olive',
'yellow',
'navy',
'blue',
'teal',
'aliceblue',
'aqua',
'antiquewhite',
'aquamarine',
'azure',
'beige',
'bisque',
'black',
'blanchedalmond',
'blueviolet',
'brown',
'burlywood',
'cadetblue',
'chartreuse',
'chocolate',
'coral',
'cornflowerblue',
'cornsilk',
'crimson',
'cyan',
'darkblue',
'darkcyan',
'darkgoldenrod',
'darkgray',
'darkgreen',
'darkgrey',
'darkkhaki',
'darkmagenta',
'darkolivegreen',
'darkorange',
'darkorchid',
'darkred',
'darksalmon',
'darkseagreen',
'darkslateblue',
'darkslategray',
'darkslategrey',
'darkturquoise',
'darkviolet',
'deeppink',
'deepskyblue',
'dimgray',
'dimgrey',
'dodgerblue',
'firebrick',
'floralwhite',
'forestgreen',
'gainsboro',
'ghostwhite',
'gold',
'goldenrod',
'greenyellow',
'grey',
'honeydew',
'hotpink',
'indianred',
'indigo',
'ivory',
'khaki',
'lavender',
'lavenderblush',
'lawngreen',
'lemonchiffon',
'lightblue',
'lightcoral',
'lightcyan',
'lightgoldenrodyellow',
'lightgray',
'lightgreen',
'lightgrey',
'lightpink',
'lightsalmon',
'lightseagreen',
'lightskyblue',
'lightslategray',
'lightslategrey',
'lightsteelblue',
'lightyellow',
'limegreen',
'linen',
'magenta',
'mediumaquamarine',
'mediumblue',
'mediumorchid',
'mediumpurple',
'mediumseagreen',
'mediumslateblue',
'mediumspringgreen',
'mediumturquoise',
'mediumvioletred',
'midnightblue',
'mintcream',
'mistyrose',
'moccasin',
'navajowhite',
'oldlace',
'olivedrab',
'orange',
'orangered',
'orchid',
'palegoldenrod',
'palegreen',
'paleturquoise',
'palevioletred',
'papayawhip',
'peachpuff',
'peru',
'pink',
'plum',
'powderblue',
'rebeccapurple',
'rosybrown',
'royalblue',
'saddlebrown',
'salmon',
'sandybrown',
'seagreen',
'seashell',
'sienna',
'skyblue',
'slateblue',
'slategray',
'slategrey',
'snow',
'springgreen',
'steelblue',
'tan',
'thistle',
'tomato',
'turquoise',
'violet',
'wheat',
'whitesmoke',
'yellowgreen'
];
/**
* Style declaration value parser.
*/
export default class CSSStyleDeclarationValueParser {
/**
* Returns length.
*
* @param value Value.
* @returns Parsed value.
*/
static getLength(value) {
if (value === '0') {
return '0px';
}
const match = value.match(LENGTH_REGEXP);
if (match) {
const number = parseFloat(match[1]);
if (isNaN(number)) {
return null;
}
const unit = match[2];
return `${Math.round(number * 1000000) / 1000000}${unit}`;
}
return null;
}
/**
* Returns percentance.
*
* @param value Value.
* @returns Parsed value.
*/
static getPercentage(value) {
if (value === '0') {
return '0%';
}
if (PERCENTAGE_REGEXP.test(value)) {
return value;
}
return null;
}
/**
* Returns degree.
*
* @param value Value.
* @returns Parsed value.
*/
static getDegree(value) {
if (value === '0') {
return '0deg';
}
if (DEGREE_REGEXP.test(value)) {
return value;
}
return null;
}
/**
* Returns calc.
*
* @param value Value.
* @returns Parsed value.
*/
static getCalc(value) {
if (CALC_REGEXP.test(value)) {
return value;
}
return null;
}
/**
* Returns fit content.
*
* @param value Value.
* @returns Parsed value.
*/
static getFitContent(value) {
const lowerValue = value.toLowerCase();
if (lowerValue === 'auto' ||
lowerValue === 'max-content' ||
lowerValue === 'min-content' ||
lowerValue === 'fit-content') {
return lowerValue;
}
if (FIT_CONTENT_REGEXP.test(lowerValue)) {
return lowerValue;
}
return null;
}
/**
* Returns measurement.
*
* @param value Value.
* @returns Parsed value.
*/
static getMeasurement(value) {
return this.getLength(value) || this.getPercentage(value) || this.getCalc(value);
}
/**
* Returns measurement or auto, min-content, max-content or fit-content.
*
* @param value Value.
* @returns Parsed value.
*/
static getContentMeasurement(value) {
return this.getFitContent(value) || this.getMeasurement(value);
}
/**
* Returns measurement or auto, min-content, max-content or fit-content.
*
* @param value Value.
* @returns Parsed value.
*/
static getAutoMeasurement(value) {
if (value.toLocaleLowerCase() === 'auto') {
return 'auto';
}
return this.getMeasurement(value);
}
/**
* Returns integer.
*
* @param value Value.
* @returns Parsed value.
*/
static getInteger(value) {
if (INTEGER_REGEXP.test(value)) {
return value;
}
return null;
}
/**
* Returns float.
*
* @param value Value.
* @returns Parsed value.
*/
static getFloat(value) {
if (FLOAT_REGEXP.test(value)) {
const number = parseFloat(value);
if (isNaN(number)) {
return null;
}
return String(Math.round(number * 1000000) / 1000000);
}
return null;
}
/**
* Returns gradient.
*
* @param value Value.
* @returns Parsed value.
*/
static getGradient(value) {
const match = value.match(GRADIENT_REGEXP);
if (match) {
return `${match[1]}(${match[3]
.trim()
.split(/\s*,\s*/)
.join(', ')})`;
}
return null;
}
/**
* Returns color.
*
* @param value Value.
* @returns Parsed value.
*/
static getColor(value) {
const lowerValue = value.toLowerCase();
if (COLORS.includes(lowerValue)) {
return lowerValue;
}
if (COLOR_REGEXP.test(value)) {
return value.replace(/,([^ ])/g, ', $1');
}
return null;
}
/**
* Returns URL.
*
* Based on:
* https://github.com/jsdom/cssstyle/blob/master/lib/parsers.js#L222
*
* @param value Value.
* @returns Parsed value.
*/
static getURL(value) {
if (!value) {
return null;
}
if (value.toLowerCase() === 'none') {
return 'none';
}
const result = URL_REGEXP.exec(value);
if (!result) {
return null;
}
let url = result[1].trim();
if ((url[0] === '"' || url[0] === "'") && url[0] !== url[url.length - 1]) {
return null;
}
if (url[0] === '"' || url[0] === "'") {
url = url.substring(1, url.length - 1);
}
for (let i = 0; i < url.length; i++) {
switch (url[i]) {
case '(':
case ')':
case ' ':
case '\t':
case '\n':
case "'":
case '"':
return null;
case '\\':
i++;
break;
}
}
return `url("${url}")`;
}
/**
* Returns global initial value.
*
* @param value Value.
* @returns Parsed value.
*/
static getInitial(value) {
return value.toLowerCase() === 'initial' ? 'initial' : null;
}
/**
* Returns CSS variable.
*
* @param value Value.
* @returns Parsed value.
*/
static getVariable(value) {
const cssVariableMatch = value.match(CSS_VARIABLE_REGEXP);
if (cssVariableMatch) {
return `var(${cssVariableMatch[1]})`;
}
return null;
}
/**
* Returns global.
*
* @param value Value.
* @returns Parsed value.
*/
static getGlobal(value) {
const lowerValue = value.toLowerCase();
return GLOBALS.includes(lowerValue) ? lowerValue : null;
}
/**
* Returns global, unless it is not set to 'initial' as it is sometimes treated different.
*
* @param value Value.
* @returns Parsed value.
*/
static getGlobalExceptInitial(value) {
const lowerValue = value.toLowerCase();
return lowerValue !== 'initial' && GLOBALS.includes(lowerValue) ? lowerValue : null;
}
}
//# sourceMappingURL=CSSStyleDeclarationValueParser.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,5 @@
export default interface ICSSStyleDeclarationPropertyValue {
value: string;
important: boolean;
}
//# sourceMappingURL=ICSSStyleDeclarationPropertyValue.d.ts.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"ICSSStyleDeclarationPropertyValue.d.ts","sourceRoot":"","sources":["../../../../src/css/declaration/property-manager/ICSSStyleDeclarationPropertyValue.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,OAAO,WAAW,iCAAiC;IACzD,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,OAAO,CAAC;CACnB"}

View File

@@ -0,0 +1,2 @@
export {};
//# sourceMappingURL=ICSSStyleDeclarationPropertyValue.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"ICSSStyleDeclarationPropertyValue.js","sourceRoot":"","sources":["../../../../src/css/declaration/property-manager/ICSSStyleDeclarationPropertyValue.ts"],"names":[],"mappings":""}