How to use warp10 - 10 common examples

var state = renderedWidgets.state;
    var config = renderedWidgets.config;

    var result = {
        ids: ids
    };

    // NOTE: Calling warp10.stringifyPrepare(obj) will produce a new object that is safe to serializing using
    //       JSON.stringify(). The deserialized/parsed object will need to be converted to the final object using
    //       warp10.finalize(obj)
    if (!isObjectEmpty(state)) {
        result.state = warp10.stringifyPrepare(state);
    }

    if (!isObjectEmpty(config)) {
        result.config = warp10.stringifyPrepare(config);
    }

    return result;
};

exports.getRenderedWidgets = exports.getRenderedWidgetIds /* deprecated */ = function(widgetsContext) {
    var renderedWidgets = getRenderedWidgets(widgetsContext);
    var ids = renderedWidgets.ids;
    var state = renderedWidgets.state;
    var config = renderedWidgets.config;

    var result = {
        ids: ids
    };

    // NOTE: Calling warp10.stringifyPrepare(obj) will produce a new object that is safe to serializing using
    //       JSON.stringify(). The deserialized/parsed object will need to be converted to the final object using
    //       warp10.finalize(obj)
    if (!isObjectEmpty(state)) {
        result.state = warp10.stringifyPrepare(state);
    }

    if (!isObjectEmpty(config)) {
        result.config = warp10.stringifyPrepare(config);
    }

    return result;
};

exports.getInitWidgetsCode = function(widgetsContext) {
    var renderedWidgets = getRenderedWidgets(widgetsContext);
    var ids = renderedWidgets.ids;
    var state = renderedWidgets.state;
    var config = renderedWidgets.config;

    var code = '';

    if (!isObjectEmpty(state)) {
        code += warp10.serialize(
                state,
                WARP10_STATE_SERIALIZATION_OPTIONS) +
                ';\n';
    }

    if (!isObjectEmpty(config)) {
        code += warp10.serialize(
                config,
                WARP10_CONFIG_SERIALIZATION_OPTIONS) +
                ';\n';
    }

    code += '$markoWidgets("' + ids + '");';
    return code;
};

var renderedWidgets = getRenderedWidgets(widgetsContext);
    var ids = renderedWidgets.ids;
    var state = renderedWidgets.state;
    var config = renderedWidgets.config;

    var code = '';

    if (!isObjectEmpty(state)) {
        code += warp10.serialize(
                state,
                WARP10_STATE_SERIALIZATION_OPTIONS) +
                ';\n';
    }

    if (!isObjectEmpty(config)) {
        code += warp10.serialize(
                config,
                WARP10_CONFIG_SERIALIZATION_OPTIONS) +
                ';\n';
    }

    code += '$markoWidgets("' + ids + '");';
    return code;
};

}

        var widgetStateDeserializationCode;
        var widgetConfigDeserializationCode;

        if (isObjectEmpty(widgetStateStore)) {
            widgetStateDeserializationCode = '';
        } else {
            widgetStateDeserializationCode = warp10.serialize(widgetStateStore, WARP10_STATE_SERIALIZATION_OPTIONS) +
                    ';\n';
        }

        if (isObjectEmpty(widgetConfigStore)) {
            widgetConfigDeserializationCode = '';
        } else {
            widgetConfigDeserializationCode = warp10.serialize(widgetConfigStore,WARP10_CONFIG_SERIALIZATION_OPTIONS) +
                    ';\n';
        }

        var cspNonce = out.global.cspNonce;
        var nonceAttr = cspNonce ? ' nonce='+JSON.stringify(cspNonce) : '';

        if (immediate) {
            out.write('' +
                widgetStateDeserializationCode +
                widgetConfigDeserializationCode +
                '$markoWidgets("' + ids + '")');
        } else {
            out.write('' +
                widgetStateDeserializationCode +
                widgetConfigDeserializationCode +
                '');

};

        if (rootWidgetDefs) {
            writeWidgets(rootWidgetDefs);
        } else {
            writeWidgets(rootWidgetDef.children);
            rootWidgetDef.children = [];
        }

        var widgetStateDeserializationCode;
        var widgetConfigDeserializationCode;

        if (isObjectEmpty(widgetStateStore)) {
            widgetStateDeserializationCode = '';
        } else {
            widgetStateDeserializationCode = warp10.serialize(widgetStateStore, WARP10_STATE_SERIALIZATION_OPTIONS) +
                    ';\n';
        }

        if (isObjectEmpty(widgetConfigStore)) {
            widgetConfigDeserializationCode = '';
        } else {
            widgetConfigDeserializationCode = warp10.serialize(widgetConfigStore,WARP10_CONFIG_SERIALIZATION_OPTIONS) +
                    ';\n';
        }

        var cspNonce = out.global.cspNonce;
        var nonceAttr = cspNonce ? ' nonce='+JSON.stringify(cspNonce) : '';

        if (immediate) {
            out.write('' +
                widgetStateDeserializationCode +

exports.getRenderedComponents = function(out) {
    var renderedComponents = getRenderedComponents(out, true);
    return warp10.stringifyPrepare(renderedComponents);
};

var getComponentsContext = require("../ComponentsContext")
    .___getComponentsContext;
var componentsUtil = require("../util");
var componentLookup = componentsUtil.___componentLookup;
var registry = require("../registry");
var modernRenderer = require("../renderer");
var resolveComponentKey = modernRenderer.___resolveComponentKey;
var trackAsyncComponents = modernRenderer.___trackAsyncComponents;
var beginComponent = require("../beginComponent");
var endComponent = require("../endComponent");
var w10NOOP = require("warp10/constants").NOOP;

function createRendererFunc(templateRenderFunc, componentProps) {
    var typeName = componentProps.___type;
    //var assignedId = componentProps.id;
    var isSplit = componentProps.___split === true;

    return function renderer(input, out, assignedId, renderingLogic) {
        trackAsyncComponents(out);

        var widgetBody = input.renderBody;
        var widgetState = input.widgetState;
        var widgetConfig = input.widgetConfig;

        var componentsContext = getComponentsContext(out);
        var globalComponentsContext = componentsContext.___globalContext;

var w10NOOP = require("warp10/constants").NOOP;
var RENDER_BODY_TO_JSON = function() {
    return w10NOOP;
};

var FLAG_WILL_RERENDER_IN_BROWSER = 1;
var IS_SERVER = typeof window === "undefined";

function doInclude(input, out, throwError) {
    var target = input._target;
    var arg = input._arg || input;
    var renderBody = (target && target.renderBody) || target;

    if (target) {
        if (target.renderer) {
            return target.renderer(arg, out), true;
        } else if (target.render) {

"use strict";
var complain = "MARKO_DEBUG" && require("complain");
var removeDashes = require("../compiler/util/removeDashes");
var ComponentsContext = require("./components/ComponentsContext");
var getComponentsContext = ComponentsContext.___getComponentsContext;
var ComponentDef = require("./components/ComponentDef");
var w10NOOP = require("warp10/constants").NOOP;
var isArray = Array.isArray;
var RENDER_BODY_TO_JSON = function() {
    return w10NOOP;
};
var FLAG_WILL_RERENDER_IN_BROWSER = 1;
var IS_SERVER = typeof window === "undefined";

function isFunction(arg) {
    return typeof arg == "function";
}

function classList(arg, classNames) {
    var len;

    if (arg) {
        if (typeof arg == "string") {