glimmer inline components

example.js

import SecondComponent from 'foo/bar';

function MyComponent(args) { return { a: 1, b: 2, c: args.e } }

function hasHelperManagerFor() {
    return true;
}

function hasComponentManagerFor() {
    return true;
}

function hasModifierManagerFor() {
    return true;
}



function wrapValue(value) {
    if (typeof value === 'string' || typeof value === 'boolean' || typeof value === 'number') {
        return function() {
            return value;
        }
    } else if (typeof value === 'function') {
        if (hasHelperManagerFor(value)) {
            return value;
        } else if (hasComponentManagerFor(value)) {
            return value;
        } else if (hasModifierManagerFor(value)) {
            return value;
        } else {
            throw new Error('unknown value type');
        }
    }
}

function hbs({raw}, ...args) {
    const template = [];
    const scope = {};
    raw.forEach((el, index) => {
        template.push(el);
        if (args.length) {
            let value = args.shift();
            scope[`reference${index}`] = wrapValue(value);
            template.push(`{{reference${index}}}`);
        }
    });
    const tpl = template.join('');
    console.log(tpl);
    return function (Component) {
        return setComponentTemplate(Component, compile(tpl));
    }
}

export default hbs`<div><${SecondComponent}/></div>`(MyComponent)