"use strict";

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

function _jade_template_fn(locals) {
  locals = locals || {};;;
  var result_of_with = function ($helpers, Object, String, disabled, editing, errorPlacement, inputValue, minInputWidth, placeholder, size, validationMessage, value) {
    var h = require('panel').h;
    var __vjadeSafeCode = function __vjadeSafeCode(code) {
      return code || String(code);
    };
    return {
      value: h("div", {
        "class": Object.assign({}, _defineProperty({
          'mp-clickable-input-editing': editing
        }, "mp-clickable-input-size-" + size, true), {
          'mp-clickable-input-container': true
        })
      }, function () {
        var __jade_nodes = []; /*  we keep the input div in the DOM to expose it to form-related DOM APIs */
        __jade_nodes = __jade_nodes.concat(h("input", {
          "attrs": $helpers.getInputAttributes(),
          "on": {
            input: $helpers.handleInput,
            blur: $helpers.handleInputBlur,
            keydown: $helpers.handleKeydown,
            invalid: $helpers.handleInputInvalid
          },
          "props": {
            value: inputValue
          },
          "style": {
            'min-width': editing ? minInputWidth : null
          },
          "hook": {
            insert: $helpers.inputInsertHook
          }
        })); /*  we keep the label div in the DOM to set the width of the container (<input> relies on container width) */
        /*  that's why we populate this label div with the inputValue while invisible, so it can invisibly expand the container width */
        __jade_nodes = __jade_nodes.concat(h("div", {
          "on": {
            click: disabled ? null : $helpers.handleLabelClick
          },
          "class": Object.assign({}, {
            'mp-clickable-input-disabled': disabled,
            'mp-clickable-input-empty': !value
          }, {
            'mp-clickable-input-label': true
          })
        }, [__vjadeSafeCode((editing ? inputValue : value) || placeholder)]));
        __jade_nodes = __jade_nodes.concat(editing && validationMessage ? function () {
          var __jade_nodes = [];
          __jade_nodes = __jade_nodes.concat(h("mp-tooltip", {
            "attrs": {
              'always-show': true,
              placement: errorPlacement,
              type: "error"
            },
            "class": {
              'mp-clickable-input-error-message': true
            }
          }, [__vjadeSafeCode(validationMessage)]));;
          return __jade_nodes;
        }.call(this) : undefined);;
        return __jade_nodes;
      }.call(this).filter(Boolean))
    };
  }.call(this, "$helpers" in locals ? locals.$helpers : typeof $helpers !== "undefined" ? $helpers : undefined, "Object" in locals ? locals.Object : typeof Object !== "undefined" ? Object : undefined, "String" in locals ? locals.String : typeof String !== "undefined" ? String : undefined, "disabled" in locals ? locals.disabled : typeof disabled !== "undefined" ? disabled : undefined, "editing" in locals ? locals.editing : typeof editing !== "undefined" ? editing : undefined, "errorPlacement" in locals ? locals.errorPlacement : typeof errorPlacement !== "undefined" ? errorPlacement : undefined, "inputValue" in locals ? locals.inputValue : typeof inputValue !== "undefined" ? inputValue : undefined, "minInputWidth" in locals ? locals.minInputWidth : typeof minInputWidth !== "undefined" ? minInputWidth : undefined, "placeholder" in locals ? locals.placeholder : typeof placeholder !== "undefined" ? placeholder : undefined, "size" in locals ? locals.size : typeof size !== "undefined" ? size : undefined, "validationMessage" in locals ? locals.validationMessage : typeof validationMessage !== "undefined" ? validationMessage : undefined, "value" in locals ? locals.value : typeof value !== "undefined" ? value : undefined);
  if (result_of_with) return result_of_with.value;
}
module.exports = _jade_template_fn;