How to use the @stylable/core.expandCustomSelectors function in @stylable/core

To help you get started, we’ve selected a few @stylable/core examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github wix / stylable / packages / language-service / src / lib / provider.ts View on Github external
? (astAtCursor as SRule)
                : null;

        const { lineChunkAtCursor, fixedCharIndex } = getChunkAtCursor(
            fullLineText,
            cursorPosInLine
        );
        const ps = parseSelector(lineChunkAtCursor, fixedCharIndex);
        const chunkStrings: string[] = ps.selector.reduce((acc, s) => {
            return acc.concat(s.text);
        }, [] as string[]);
        const currentSelector =
            (ps.selector[0] as SelectorChunk).classes[0] ||
            (ps.selector[0] as SelectorChunk).customSelectors[0] ||
            chunkStrings[0];
        const expandedLine: string = expandCustomSelectors(
            postcss.rule({ selector: lineChunkAtCursor }),
            meta.customSelectors
        )
            .split(' ')
            .pop()!; // TODO: replace with selector parser
        const resolvedElements = transformer.resolveSelectorElements(meta, expandedLine);

        let resolved: CSSResolve[] = [];
        if (currentSelector && resolvedElements[0].length) {
            const clas = resolvedElements[0].find(
                e => e.type === 'class' || (e.type === 'element' && e.resolved.length > 1)
            ); // TODO: better type parsing
            resolved = clas ? clas.resolved : [];
        }

        return {
github wix / stylable / packages / language-service / src / lib / provider.ts View on Github external
if (resolvedVar) {
            return { word, meta: resolvedVar.meta };
        } else {
            return { word, meta: null };
        }
    }

    const transformer = new StylableTransformer({
        diagnostics: new Diagnostics(),
        fileProcessor: stylable.fileProcessor,
        requireModule: () => {
            throw new Error('Not implemented, why are we here');
        }
    });

    const expandedLine: string = expandCustomSelectors(
        postcss.rule({ selector: lineChunkAtCursor }),
        meta.customSelectors
    )
        .split(' ')
        .pop()!; // TODO: replace with selector parser
    const resolvedElements = transformer.resolveSelectorElements(meta, expandedLine);

    let reso: CSSResolve | undefined;
    if (word.charAt(0) !== word.charAt(0).toLowerCase()) {
        reso = resolvedElements[0][resolvedElements[0].length - 1].resolved.find(
            res => !!(res.symbol as ClassSymbol)['-st-root']
        );
    } else {
        reso = resolvedElements[0][resolvedElements[0].length - 1].resolved.find(res => {
            let symbolStates;
            if (res.symbol._kind === 'class') {