@node-projects/web-component-designer 0.0.291 → 0.1.0

package/dist/elements/services/selectionService/SelectionService.js

@@ -1,50 +0,0 @@
-import { TypedEvent } from '@node-projects/base-custom-webcomponent';
-import { SelectionChangedAction } from '../undoService/transactionItems/SelectionChangedAction.js';
-export class SelectionService {
-    primarySelection;
-    selectedElements = [];
-    _designerCanvas;
-    _undoSelectionChanges;
-    constructor(designerCanvas, undoSelectionChanges) {
-        this._designerCanvas = designerCanvas;
-        this._undoSelectionChanges = undoSelectionChanges;
-    }
-    setSelectedElements(designItems) {
-        if (this.selectedElements != designItems && !(this.selectedElements.length === 0 && (designItems == null || designItems.length === 0))) {
-            if (this._undoSelectionChanges) {
-                const action = new SelectionChangedAction(this.selectedElements, designItems, this);
-                this._designerCanvas.instanceServiceContainer.undoService.execute(action);
-            }
-            else {
-                this._withoutUndoSetSelectedElements(designItems);
-            }
-        }
-    }
-    _withoutUndoSetSelectedElements(designItems) {
-        let oldSelectedElements = this.selectedElements;
-        if (!designItems) {
-            this.selectedElements = [];
-            this.primarySelection = null;
-        }
-        else {
-            let newSelection = [];
-            for (let d of designItems) {
-                if (d && d != d.instanceServiceContainer.contentService.rootDesignItem)
-                    newSelection.push(d);
-            }
-            this.selectedElements = newSelection;
-            if (newSelection && newSelection.length > 0)
-                this.primarySelection = newSelection[0];
-            else
-                this.primarySelection = null;
-        }
-        this.onSelectionChanged.emit({ selectedElements: this.selectedElements, oldSelectedElements: oldSelectedElements });
-    }
-    clearSelectedElements() {
-        this.setSelectedElements([]);
-    }
-    isSelected(designItem) {
-        return this.selectedElements.indexOf(designItem) >= 0;
-    }
-    onSelectionChanged = new TypedEvent();
-}

package/dist/elements/services/stylesheetService/AbstractStylesheetService.d.ts

@@ -1,47 +0,0 @@
-import { TypedEvent } from "@node-projects/base-custom-webcomponent";
-import { IDesignItem } from '../../item/IDesignItem.js';
-import { IDocumentStylesheet, IStyleDeclaration, IStyleRule, IStylesheet, IStylesheetService } from './IStylesheetService.js';
-import { InstanceServiceContainer } from "../InstanceServiceContainer.js";
-import { IDesignerCanvas } from "../../widgets/designerView/IDesignerCanvas.js";
-export declare abstract class AbstractStylesheetService implements IStylesheetService {
-    protected _stylesheets: Map<string, {
-        stylesheet: IStylesheet;
-        ast: any;
-    }>;
-    protected _documentStylesheets: Map<string, {
-        stylesheet: IDocumentStylesheet;
-        ast: any;
-    }>;
-    protected _allStylesheets: Map<string, {
-        stylesheet: IStylesheet | IDocumentStylesheet;
-        ast: any;
-    }>;
-    protected _instanceServiceContainer: InstanceServiceContainer;
-    constructor(designerCanvas: IDesignerCanvas);
-    setStylesheets(stylesheets: IStylesheet[]): Promise<void>;
-    setDocumentStylesheets(stylesheets: IDocumentStylesheet[]): Promise<void>;
-    internalSetStylesheets(stylesheets: IStylesheet[], targetMap: Map<string, {
-        stylesheet: IStylesheet;
-        ast: any;
-    }>): Promise<void>;
-    protected abstract internalParse(style: string): Promise<any>;
-    getStylesheets(): IStylesheet[];
-    abstract getAppliedRules(designItem: IDesignItem): IStyleRule[];
-    abstract getDeclarations(designItem: IDesignItem, styleName: string): IStyleDeclaration[];
-    updateDeclarationValue(declaration: IStyleDeclaration, value: string, important: boolean): void;
-    abstract insertDeclarationIntoRule(rule: IStyleRule, property: string, value: string, important: boolean): boolean;
-    abstract removeDeclarationFromRule(rule: IStyleRule, property: string): boolean;
-    abstract updateCompleteStylesheet(name: string, newStyle: string): any;
-    abstract updateCompleteStylesheetWithoutUndo(name: string, newStyle: string): any;
-    abstract updateDeclarationValueWithoutUndo(declaration: IStyleDeclaration, value: string, important: boolean): any;
-    stylesheetChanged: TypedEvent<{
-        name: string;
-        newStyle: string;
-        oldStyle: string;
-        changeSource: 'extern' | 'styleupdate' | 'undo';
-    }>;
-    stylesheetsChanged: TypedEvent<void>;
-    protected elementMatchesASelector(designItem: IDesignItem, selectors: string[]): boolean;
-    static buildPatchedStyleSheet(value: CSSStyleSheet[]): string;
-    private static traverseAndCollectRules;
-}

package/dist/elements/services/stylesheetService/AbstractStylesheetService.js

@@ -1,138 +0,0 @@
-import { TypedEvent } from "@node-projects/base-custom-webcomponent";
-import { DesignerCanvas } from '../../widgets/designerView/designerCanvas.js';
-export class AbstractStylesheetService {
-    _stylesheets = new Map();
-    _documentStylesheets = new Map();
-    _allStylesheets = new Map();
-    _instanceServiceContainer;
-    constructor(designerCanvas) {
-        this._instanceServiceContainer = designerCanvas.instanceServiceContainer;
-    }
-    async setStylesheets(stylesheets) {
-        await this.internalSetStylesheets(stylesheets, this._stylesheets);
-    }
-    async setDocumentStylesheets(stylesheets) {
-        await this.internalSetStylesheets(stylesheets, this._documentStylesheets);
-    }
-    async internalSetStylesheets(stylesheets, targetMap) {
-        if (targetMap != null && stylesheets != null && targetMap.size == stylesheets.length && stylesheets.every(x => targetMap.has(x.name))) {
-            for (let stylesheet of stylesheets) {
-                const old = targetMap.get(stylesheet.name);
-                if (old.stylesheet.content != stylesheet.content) {
-                    try {
-                        targetMap.set(stylesheet.name, {
-                            stylesheet: stylesheet,
-                            ast: await this.internalParse(stylesheet.content)
-                        });
-                    }
-                    catch (err) {
-                        console.warn("error parsing stylesheet", stylesheet, err);
-                    }
-                    if (targetMap == this._stylesheets)
-                        this.stylesheetChanged.emit({ name: stylesheet.name, newStyle: stylesheet.content, oldStyle: old.stylesheet.content, changeSource: 'extern' });
-                }
-            }
-        }
-        else if (stylesheets != null) {
-            targetMap.clear();
-            for (let stylesheet of stylesheets) {
-                try {
-                    targetMap.set(stylesheet.name, {
-                        stylesheet: stylesheet,
-                        ast: await this.internalParse(stylesheet.content)
-                    });
-                }
-                catch (err) {
-                    console.warn("error parsing stylesheet", stylesheet, err);
-                }
-            }
-            if (targetMap == this._stylesheets)
-                this.stylesheetsChanged.emit();
-        }
-        else {
-            targetMap.clear();
-        }
-        this._allStylesheets.clear();
-        for (let s of this._documentStylesheets) {
-            this._allStylesheets.set(s[0], s[1]);
-        }
-        for (let s of this._stylesheets) {
-            this._allStylesheets.set(s[0], s[1]);
-        }
-    }
-    //todo: rename to externalStylesheets
-    getStylesheets() {
-        let stylesheets = [];
-        for (let item of this._stylesheets) {
-            stylesheets.push(item[1].stylesheet);
-        }
-        ;
-        /*for (let item of this._documentStylesheets) {
-            stylesheets.push(item[1].stylesheet);
-        };*/
-        return stylesheets;
-    }
-    updateDeclarationValue(declaration, value, important) {
-        this.updateDeclarationValueWithoutUndo(declaration, value, important);
-    }
-    stylesheetChanged = new TypedEvent();
-    stylesheetsChanged = new TypedEvent();
-    elementMatchesASelector(designItem, selectors) {
-        for (let selector of selectors) {
-            if (selector == ':host') {
-                selector = DesignerCanvas.cssprefixConstant;
-            }
-            if (designItem.element.matches(selector))
-                return true;
-        }
-        return false;
-    }
-    static buildPatchedStyleSheet(value) {
-        let style = '';
-        for (let s of value) {
-            style += this.traverseAndCollectRules(s);
-        }
-        return style;
-    }
-    static traverseAndCollectRules(ruleContainer) {
-        let t = '';
-        for (let rule of ruleContainer.cssRules) {
-            if ((rule instanceof CSSContainerRule
-                || rule instanceof CSSSupportsRule
-                || rule instanceof CSSMediaRule)
-                && rule.cssRules) {
-                t += rule.cssText.split(rule.conditionText)[0] + rule.conditionText + " { " + this.traverseAndCollectRules(rule) + " }";
-            }
-            if (rule instanceof CSSStyleRule) {
-                let parts = rule.selectorText.split(',');
-                let sel = "";
-                for (let p of parts) {
-                    if (p == ':host')
-                        sel += DesignerCanvas.cssprefixConstant;
-                    else if (p.includes(DesignerCanvas.cssprefixConstant)) {
-                        sel += p;
-                        continue;
-                    }
-                    if (sel)
-                        sel += ',';
-                    sel += DesignerCanvas.cssprefixConstant + p.trimStart();
-                }
-                t += sel;
-                let cssText = rule.style.cssText;
-                //bugfix for chrome issue: https://bugs.chromium.org/p/chromium/issues/detail?id=1394353 
-                if (rule.styleMap && rule.styleMap.get('grid-template') && rule.styleMap.get('grid-template').toString().includes('repeat(')) {
-                    let entr = rule.styleMap.entries();
-                    cssText = '';
-                    for (let e of entr) {
-                        cssText += e[0] + ':' + e[1].toString() + ';';
-                    }
-                }
-                t += '{' + cssText + '}';
-                /*if (rule.cssRules) {
-                    t += rule.cssText.split(rule.conditionText)[0] + rule.conditionText + " { " + this.traverseAndCollectRules(rule) + " }";
-                }*/
-            }
-        }
-        return t;
-    }
-}

package/dist/elements/services/stylesheetService/CssToolsStylesheetService.d.ts

@@ -1,42 +0,0 @@
-import { IDesignItem } from "../../item/IDesignItem.js";
-import { IStyleDeclaration, IStyleRule, IStylesheet } from "./IStylesheetService.js";
-import { AbstractStylesheetService } from "./AbstractStylesheetService.js";
-import { IDesignerCanvas } from "../../widgets/designerView/IDesignerCanvas.js";
-type CssRuleAST = any;
-type CssDeclarationAST = any;
-type CssStylesheetAST = any;
-interface IRuleWithAST extends IStyleRule {
-    ast: CssRuleAST;
-    declarations: IDeclarationWithAST[];
-    stylesheet: IStylesheet;
-    stylesheetName: string;
-}
-interface IDeclarationWithAST extends IStyleDeclaration {
-    ast: CssDeclarationAST;
-}
-export declare class CssToolsStylesheetService extends AbstractStylesheetService {
-    constructor(designerCanvas: IDesignerCanvas);
-    _tools: {
-        parse: (css: string, options?: {
-            source?: string;
-            silent?: boolean;
-        }) => CssStylesheetAST;
-        stringify: (node: CssStylesheetAST, options?: {
-            indent?: string;
-            compress?: boolean;
-            emptyDeclarations?: boolean;
-        }) => string;
-    };
-    internalParse(style: string): Promise<any>;
-    getAppliedRules(designItem: IDesignItem): IRuleWithAST[];
-    private getRulesFromAst;
-    getDeclarations(designItem: IDesignItem, styleName: string): IStyleDeclaration[];
-    updateDeclarationValueWithoutUndo(declaration: IDeclarationWithAST, value: string, important: boolean): void;
-    insertDeclarationIntoRule(rule: IRuleWithAST, property: string, value: string, important: boolean): boolean;
-    removeDeclarationFromRule(rule: IRuleWithAST, property: string): boolean;
-    private updateStylesheet;
-    updateCompleteStylesheet(name: string, newStyle: string): void;
-    updateCompleteStylesheetWithoutUndo(name: string, newStyle: string, noUndo?: boolean): void;
-    private updateCompleteStylesheetInternal;
-}
-export {};

package/dist/elements/services/stylesheetService/CssToolsStylesheetService.js

@@ -1,114 +0,0 @@
-import { AbstractStylesheetService } from "./AbstractStylesheetService.js";
-export class CssToolsStylesheetService extends AbstractStylesheetService {
-    constructor(designerCanvas) {
-        super(designerCanvas);
-    }
-    _tools;
-    async internalParse(style) {
-        if (!this._tools)
-            this._tools = await import('@adobe/css-tools');
-        return this._tools.parse(style);
-    }
-    getAppliedRules(designItem) {
-        let rules = [];
-        for (let item of this._allStylesheets.entries()) {
-            if (!item[1].ast?.stylesheet?.rules)
-                continue;
-            let rs = Array.from(this.getRulesFromAst(item[1].ast?.stylesheet?.rules, item[1].stylesheet, designItem))
-                .map(x => ({
-                selector: x.selectors.join(', '),
-                declarations: x.declarations.filter(y => y.type == 'declaration').map(y => ({
-                    name: y.property,
-                    value: y.value.endsWith('!important') ? y.value.substring(0, y.value.length - 10).trimEnd() : y.value,
-                    important: y.value.endsWith('!important'),
-                    parent: null,
-                    ast: y,
-                    stylesheet: item[1].stylesheet
-                })),
-                specificity: 0,
-                stylesheetName: item[0],
-                ast: x,
-            }));
-            rs.forEach(x => x.declarations.forEach(y => y.parent = x));
-            rules.push(...rs);
-        }
-        ;
-        return rules;
-    }
-    *getRulesFromAst(cssAtRuleAst, stylesheet, designItem) {
-        for (const atRule of cssAtRuleAst) {
-            if (atRule.type == 'media') {
-                yield* this.getRulesFromAst(atRule.rules, stylesheet, designItem);
-            }
-            else if (atRule.type == 'supports') {
-                yield* this.getRulesFromAst(atRule.rules, stylesheet, designItem);
-            }
-            else if (atRule.type == 'rule') {
-                if (this.elementMatchesASelector(designItem, atRule.selectors))
-                    yield atRule;
-            }
-        }
-        return null;
-    }
-    getDeclarations(designItem, styleName) {
-        return this.getAppliedRules(designItem).flatMap(x => x.declarations).filter(x => x.name == styleName);
-    }
-    updateDeclarationValueWithoutUndo(declaration, value, important) {
-        declaration.ast.value = important ? value + ' !important' : value;
-        let ss = this._allStylesheets.get(declaration.parent.stylesheetName);
-        this.updateStylesheet(ss);
-        /*
-        declaration.ast.value = important ? value + ' !important' : value;
-        let ss = declaration.ast;
-        while (ss?.parent)
-            ss = ss?.parent;
-        let obj = { ast: ss, stylesheet: declaration.stylesheet };
-        this._allStylesheets.set(declaration.parent.stylesheetName, obj)
-        this.updateStylesheet(obj);
-        */
-    }
-    insertDeclarationIntoRule(rule, property, value, important) {
-        rule.ast.declarations.push({
-            type: 'declaration',
-            property: property,
-            value: important ? value + ' !important' : value
-        });
-        this.updateStylesheet(this._allStylesheets.get(rule.stylesheetName));
-        return true;
-    }
-    removeDeclarationFromRule(rule, property) {
-        let idx = rule.ast.declarations.findIndex(x => x.property == property);
-        if (idx == -1)
-            return false;
-        rule.ast.declarations.splice(idx, 1);
-        this.updateStylesheet(this._allStylesheets.get(rule.stylesheetName));
-        return true;
-    }
-    updateStylesheet(ss) {
-        const old = ss.stylesheet.content;
-        ss.stylesheet.content = this._tools.stringify(ss.ast, { indent: '    ', compress: false, emptyDeclarations: true });
-        if (ss.stylesheet.designItem) {
-            ss.stylesheet.designItem.content = ss.stylesheet.content;
-        }
-        else
-            this.stylesheetChanged.emit({ name: ss.stylesheet.name, newStyle: ss.stylesheet.content, oldStyle: old, changeSource: 'styleupdate' });
-    }
-    updateCompleteStylesheet(name, newStyle) {
-        this.updateCompleteStylesheetInternal(name, newStyle, 'styleupdate');
-    }
-    updateCompleteStylesheetWithoutUndo(name, newStyle, noUndo = false) {
-        this.updateCompleteStylesheetInternal(name, newStyle, 'undo');
-    }
-    updateCompleteStylesheetInternal(name, newStyle, changeSource) {
-        const ss = this._allStylesheets.get(name);
-        if (ss.stylesheet.content != newStyle) {
-            const old = ss.stylesheet.content;
-            ss.stylesheet.content = newStyle;
-            if (ss.stylesheet.designItem) {
-                ss.stylesheet.designItem.content = ss.stylesheet.content;
-            }
-            else
-                this.stylesheetChanged.emit({ name: ss.stylesheet.name, newStyle: ss.stylesheet.content, oldStyle: old, changeSource });
-        }
-    }
-}

package/dist/elements/services/stylesheetService/CssTreeStylesheetService.d.ts

@@ -1,58 +0,0 @@
-import { IDesignItem } from "../../item/IDesignItem.js";
-import { IStyleDeclaration, IStyleRule, IStylesheet } from "./IStylesheetService.js";
-import { AbstractStylesheetService } from "./AbstractStylesheetService.js";
-import { IDesignerCanvas } from "../../widgets/designerView/IDesignerCanvas.js";
-declare namespace csstree {
-    type CssNodePlain = any;
-    type CssNode = any;
-    type ParseOptions = any;
-    type GenerateOptions = any;
-    type RulePlain = any;
-    type DeclarationPlain = any;
-    type StyleSheetPlain = any;
-    type Raw = any;
-    type Declaration = any;
-    type AtrulePlain = any;
-    type BlockPlain = any;
-    type SelectorListPlain = any;
-}
-declare global {
-    interface Window {
-        csstree: {
-            fromPlainObject(node: csstree.CssNodePlain): csstree.CssNode;
-            toPlainObject(node: csstree.CssNode): csstree.CssNodePlain;
-            parse(text: string, options?: csstree.ParseOptions): csstree.CssNode;
-            generate(ast: csstree.CssNode, options?: csstree.GenerateOptions): string;
-        };
-    }
-}
-interface IRuleWithAST extends IStyleRule {
-    ast: csstree.RulePlain;
-    declarations: IDeclarationWithAST[];
-    stylesheet: IStylesheet;
-}
-interface IDeclarationWithAST extends IStyleDeclaration {
-    ast: csstree.DeclarationPlain;
-}
-export declare class CssTreeStylesheetService extends AbstractStylesheetService {
-    constructor(designerCanvas: IDesignerCanvas);
-    internalParse(style: string): Promise<any>;
-    private getAppliedRulesInternal;
-    getAppliedRules(designItem: IDesignItem): IRuleWithAST[];
-    private getDeclarationInternal;
-    getDeclarations(designItem: IDesignItem, stlyeName: string): IDeclarationWithAST[];
-    updateDeclarationValueWithoutUndo(declaration: IDeclarationWithAST, value: string, important: boolean): void;
-    insertDeclarationIntoRule(rule: IRuleWithAST, property: string, value: string, important: boolean): boolean;
-    removeDeclarationFromRule(rule: IRuleWithAST, property: string): boolean;
-    updateCompleteStylesheet(name: string, newStyle: string): void;
-    updateCompleteStylesheetWithoutUndo(name: string, newStyle: string, noUndo?: boolean): void;
-    private updateCompleteStylesheetInternal;
-    private rulesFromAST;
-    private astHasChildren;
-    private buildSelectorString;
-    private getSpecificity;
-    private findDeclarationInRule;
-    private buildAtRuleString;
-    private sortDeclarations;
-}
-export {};

package/dist/elements/services/stylesheetService/CssTreeStylesheetService.js

@@ -1,204 +0,0 @@
-import { calculate as calculateSpecifity } from "./SpecificityCalculator.js";
-import { AbstractStylesheetService } from "./AbstractStylesheetService.js";
-export class CssTreeStylesheetService extends AbstractStylesheetService {
-    constructor(designerCanvas) {
-        super(designerCanvas);
-    }
-    async internalParse(style) {
-        return window.csstree.toPlainObject((window.csstree.parse(style, { positions: true, parseValue: false })));
-    }
-    /* Section covers the retrieval of rules and declarations */
-    getAppliedRulesInternal(designItem) {
-        let styles = [];
-        for (let item of this._allStylesheets) {
-            if (!item[1].ast || !this.astHasChildren(item[1].ast))
-                continue;
-            styles = styles.concat(Array.from(this.rulesFromAST(item[1].ast, item[1].stylesheet.content, item[0], designItem)));
-        }
-        ;
-        return styles;
-    }
-    getAppliedRules(designItem) {
-        let rules = this.getAppliedRulesInternal(designItem);
-        if (!rules || rules.length == 0)
-            return [];
-        let retCollection = [];
-        for (let rule of rules) {
-            retCollection.push({
-                ...rule,
-                declarations: rule.ast.block.children.map((declaration) => {
-                    return {
-                        name: declaration.property,
-                        value: declaration.value.value,
-                        important: declaration.important == true,
-                        specificity: rule.specificity,
-                        parent: rule,
-                        ast: declaration,
-                    };
-                })
-            });
-        }
-        return retCollection;
-    }
-    getDeclarationInternal(designItem, styleName) {
-        let rules = this.getAppliedRulesInternal(designItem);
-        if (!rules)
-            return null;
-        let declarations = [];
-        for (let rule of rules) {
-            let declaration = this.findDeclarationInRule(rule.ast, styleName);
-            if (!declaration)
-                continue;
-            declarations.push({
-                ast: declaration,
-                parent: rule,
-                name: styleName,
-                value: declaration.value.value,
-                important: declaration.important == true,
-                stylesheet: rule.stylesheet
-            });
-        }
-        ;
-        return declarations;
-    }
-    getDeclarations(designItem, stlyeName) {
-        let declarations = this.getDeclarationInternal(designItem, stlyeName);
-        if (!declarations)
-            return null;
-        return this.sortDeclarations(declarations);
-    }
-    /* Section covers the update of rules and declarations */
-    updateDeclarationValueWithoutUndo(declaration, value, important) {
-        let sourceNode = this._allStylesheets.get(declaration.parent.stylesheetName);
-        declaration.ast.value = window.csstree.toPlainObject(window.csstree.parse(declaration.name + ": " + value + (important ? " !important" : ""), { context: 'declaration', parseValue: false })).value;
-        const old = sourceNode.stylesheet.content;
-        sourceNode.stylesheet.content = window.csstree.generate(window.csstree.fromPlainObject(sourceNode.ast));
-        // After generating the stylesheet, parse again (so line numbers are correct)
-        sourceNode.ast = window.csstree.toPlainObject((window.csstree.parse(sourceNode.stylesheet.content, { positions: true, parseValue: false })));
-        if (sourceNode.stylesheet.designItem) {
-            sourceNode.stylesheet.designItem.content = sourceNode.stylesheet.content;
-        }
-        else
-            this.stylesheetChanged.emit({ name: sourceNode.stylesheet.name, newStyle: sourceNode.stylesheet.content, oldStyle: old, changeSource: 'styleupdate' });
-    }
-    insertDeclarationIntoRule(rule, property, value, important) {
-        let sourceNode = this._allStylesheets.get(rule.stylesheetName);
-        rule.ast.block.children.push(window.csstree.toPlainObject(window.csstree.parse(property + ": " + value + (important ? " !important" : ""), { context: 'declaration', parseValue: false })));
-        const old = sourceNode.stylesheet.content;
-        sourceNode.stylesheet.content = window.csstree.generate(window.csstree.fromPlainObject(sourceNode.ast));
-        // After generating the stylesheet, parse again (so line numbers are correct)
-        sourceNode.ast = window.csstree.toPlainObject((window.csstree.parse(sourceNode.stylesheet.content, { positions: true, parseValue: false })));
-        if (sourceNode.stylesheet.designItem) {
-            sourceNode.stylesheet.designItem.content = sourceNode.stylesheet.content;
-        }
-        else
-            this.stylesheetChanged.emit({ name: sourceNode.stylesheet.name, newStyle: sourceNode.stylesheet.content, oldStyle: old, changeSource: 'styleupdate' });
-        return true;
-    }
-    removeDeclarationFromRule(rule, property) {
-        let index = rule.ast.block.children.findIndex(x => x.property == property);
-        if (index == -1)
-            return false;
-        rule.ast.block.children.splice(index, 1);
-        const ss = this._allStylesheets.get(rule.stylesheetName);
-        const old = ss.stylesheet.content;
-        ss.stylesheet.content = window.csstree.generate(window.csstree.fromPlainObject(this._allStylesheets.get(rule.stylesheetName).ast));
-        // After generating the stylesheet, parse again (so line numbers are correct)
-        ss.ast = window.csstree.toPlainObject((window.csstree.parse(this._allStylesheets.get(rule.stylesheetName).stylesheet.content, { positions: true, parseValue: false })));
-        if (ss.stylesheet.designItem) {
-            ss.stylesheet.designItem.content = ss.stylesheet.content;
-        }
-        else
-            this.stylesheetChanged.emit({ name: ss.stylesheet.name, newStyle: ss.stylesheet.content, oldStyle: old, changeSource: 'styleupdate' });
-        return true;
-    }
-    updateCompleteStylesheet(name, newStyle) {
-        this.updateCompleteStylesheetInternal(name, newStyle, 'styleupdate');
-    }
-    updateCompleteStylesheetWithoutUndo(name, newStyle, noUndo = false) {
-        this.updateCompleteStylesheetInternal(name, newStyle, 'undo');
-    }
-    updateCompleteStylesheetInternal(name, newStyle, changeSource) {
-        const ss = this._allStylesheets.get(name);
-        if (ss.stylesheet.content != newStyle) {
-            const old = ss.stylesheet.content;
-            ss.stylesheet.content = newStyle;
-            if (ss.stylesheet.designItem) {
-                ss.stylesheet.designItem.content = ss.stylesheet.content;
-            }
-            else
-                this.stylesheetChanged.emit({ name: ss.stylesheet.name, newStyle: ss.stylesheet.content, oldStyle: old, changeSource });
-        }
-    }
-    /* Section covers the internal traversal creation of rules and declarations */
-    *rulesFromAST(ast, stylesheet, source, designItem, previousCheck = '') {
-        let parent = ast["children"] != null ? ast : ast.block;
-        for (const child of parent.children) {
-            if (child.type == "Atrule") {
-                const currentCheck = this.buildAtRuleString(child, stylesheet);
-                if (currentCheck.type === "@media" && !window.matchMedia(currentCheck.sel))
-                    continue;
-                if (currentCheck.type === "@supports" && !CSS.supports(currentCheck.sel))
-                    continue;
-                let ruleCollection = this.rulesFromAST(child, stylesheet, source, designItem, previousCheck + currentCheck.type + " " + currentCheck.sel + "\n");
-                if (ruleCollection) {
-                    for (const r of ruleCollection) {
-                        if (!this.elementMatchesASelector(designItem, this.buildSelectorString(r.ast.prelude, stylesheet)))
-                            continue;
-                        yield r;
-                    }
-                }
-            }
-            if (child.type == "Rule") {
-                let selectors = this.buildSelectorString(child.prelude, stylesheet);
-                if (!this.elementMatchesASelector(designItem, selectors))
-                    continue;
-                yield ({
-                    ast: child,
-                    selector: previousCheck + this.buildSelectorString(child.prelude, stylesheet).join(", "),
-                    specificity: this.getSpecificity(child.prelude),
-                    stylesheetName: source,
-                    declarations: null,
-                    stylesheet: this._allStylesheets.get(source).stylesheet
-                });
-            }
-        }
-        ;
-    }
-    /* Utility functions for building selectors, specificity and so on  */
-    astHasChildren(ast) {
-        return ast != null && ast["children"] != null && ast["children"].length > 0;
-    }
-    buildSelectorString(selectorsAST, stylesheet) {
-        if (selectorsAST.type == 'SelectorList') {
-            return [...selectorsAST.children.map(x => this.buildSelectorString(x, stylesheet)[0])];
-        }
-        else {
-            return [stylesheet.substring(selectorsAST.loc.start.offset, selectorsAST.loc.end.offset)];
-        }
-    }
-    getSpecificity(selector) {
-        const specificities = calculateSpecifity(selector);
-        let sum = 0;
-        specificities.forEach(specificity => sum += specificity.a * 10000 + specificity.b * 100 + specificity.c);
-        return sum;
-    }
-    findDeclarationInRule(rule, styleName) {
-        return rule.block.children.find(declaration => declaration.property == styleName);
-    }
-    buildAtRuleString(ast, stylesheet) {
-        return {
-            sel: stylesheet.slice(ast.prelude.loc.start.offset, ast.prelude.loc.end.offset),
-            type: "@" + ast.name
-        };
-    }
-    sortDeclarations(declarations) {
-        if (declarations == null || declarations.length == 0)
-            return null;
-        return declarations.sort((dec1, dec2) => {
-            if (dec1.parent.specificity > dec2.parent.specificity)
-                return -1;
-            return 1;
-        });
-    }
-}