How to use the @stylable/core.valueMapping.mixin function in @stylable/core

return this.getSignatureForStateWithParamSelector(meta, pos, line);
        } else if (
            line
                .slice(0, pos.character)
                .trim()
                .startsWith(valueMapping.states)
        ) {
            return this.getSignatureForStateWithParamDefinition(pos, line);
        }

        // If last node is not root, we're in a declaration [TODO: or a media query]
        if (
            line
                .slice(0, pos.character)
                .trim()
                .startsWith(valueMapping.mixin)
        ) {
            // TODO: handle multiple lines as well
            value = line
                .slice(0, pos.character)
                .trim()
                .slice(valueMapping.mixin.length + 1)
                .trim();
        } else if (
            line
                .slice(0, pos.character)
                .trim()
                .includes(':')
        ) {
            value = line
                .slice(0, pos.character)
                .trim()

}

    const word: string = val.value;

    const { lineChunkAtCursor } = getChunkAtCursor(
        res.currentLine.slice(0, val.sourceIndex + val.value.length),
        position.character
    );
    const directiveRegex = new RegExp(
        valueMapping.extends +
            '|' +
            valueMapping.named +
            '|' +
            valueMapping.default +
            '|' +
            valueMapping.mixin
    );
    if (lineChunkAtCursor.startsWith(':global')) {
        return { word: ':global(' + word + ')', meta };
    }

    const match = lineChunkAtCursor.match(directiveRegex);
    if (match && !!meta.mappedSymbols[word]) {
        // We're in an -st directive
        let imp;
        if (meta.mappedSymbols[word]._kind === 'import') {
            imp = stylable.resolver.resolveImport(meta.mappedSymbols[word] as ImportSymbol);
        } else if (
            meta.mappedSymbols[word]._kind === 'element' &&
            (meta.mappedSymbols[word] as ElementSymbol).alias
        ) {
            imp = stylable.resolver.resolveImport(

lines.forEach((line, index) => {
            let match = valueRegex.exec(line);
            while (match !== null) {
                refs.push({
                    uri: URI.file(scannedMeta.source).toString(),
                    range: {
                        start: {
                            line: decl.source!.start!.line - 1 + index,
                            character: index
                                ? match.index
                                : decl.source!.start!.column +
                                  valueMapping.mixin.length +
                                  match.index +
                                  (decl.raws.between ? decl.raws.between.length : 0) -
                                  1
                        },
                        end: {
                            line: decl.source!.start!.line - 1 + index,
                            character:
                                word.length +
                                (index
                                    ? match.index
                                    : decl.source!.start!.column +
                                      valueMapping.mixin.length +
                                      match.index +
                                      (decl.raws.between ? decl.raws.between.length : 0) -
                                      1)
                        }

parentSelector,
        meta,
        fullLineText,
        lineChunkAtCursor,
        position,
        fs,
        tsLangService,
        stylable
    }: ProviderOptions): Completion[] {
        if (
            meta.imports.some(
                imp => imp.fromRelative.endsWith('.ts') || imp.fromRelative.endsWith('.js')
            ) &&
            !fullLineText.trim().startsWith(valueMapping.from) &&
            parentSelector &&
            lineChunkAtCursor.startsWith(valueMapping.mixin + ':')
        ) {
            if (fullLineText.lastIndexOf('(') > fullLineText.lastIndexOf(')')) {
                return [];
            }

            const { lastName } = getExistingNames(fullLineText, position);
            return Object.keys(meta.mappedSymbols)
                .filter(ms => meta.mappedSymbols[ms]._kind === 'import')
                .filter(ms => ms.startsWith(lastName))
                .filter(ms => {
                    const res = stylable.resolver.resolve(meta.mappedSymbols[ms]);
                    return res && res._kind === 'js';
                })
                .filter(ms => isMixin(ms, meta, fs, tsLangService))
                .map(ms => createCodeMixinCompletion(ms, lastName, position, meta));
        } else {

provide({ lineChunkAtCursor, meta, position, fullLineText }: ProviderOptions): Completion[] {
        if (lineChunkAtCursor.startsWith(valueMapping.mixin + ':')) {
            const { names, lastName } = getExistingNames(fullLineText, position);
            return Object.keys(meta.mappedSymbols)
                .filter(
                    ms =>
                        (meta.mappedSymbols[ms]._kind === 'import' &&
                            (meta.mappedSymbols[ms] as ImportSymbol).import.fromRelative.endsWith(
                                'st.css'
                            )) ||
                        meta.mappedSymbols[ms]._kind === 'class'
                )
                .filter(ms => ms.startsWith(lastName))
                .filter(ms => names.indexOf(ms) === -1)
                .map(ms => {
                    return cssMixinCompletion(
                        ms,
                        new ProviderRange(