\").css({\n\t // position : \"absolute\",\n\t // left : margin.left,\n\t // top : margin.top,\n\t // width : pageWidth,\n\t // height : pageHeight,\n\t // boxSizing : \"border-box\",\n\t // background: \"rgba(255, 255, 0, 0.5)\"\n\t // //border : \"1px solid red\"\n\t // }).appendTo(page);\n\n\t if (options && options.pageClassName) {\n\t page.className = options.pageClassName;\n\t }\n\t pages.push(page);\n\t return page;\n\t }\n\n\t function fallsOnMargin(thing) {\n\t var box = thing.getBoundingClientRect();\n\t if (box.width === 0 || box.height === 0) {\n\t // I'd say an element with dimensions zero fits on current page.\n\t return 0;\n\t }\n\t var top = copy.getBoundingClientRect().top;\n\t var available = pageHeight - adjust;\n\t return (box.height > available) ? 3\n\t : (box.top - top > available) ? 1\n\t : (box.bottom - top > available) ? 2\n\t : 0;\n\t }\n\n\t function splitText(node, isFirst) {\n\t if (!/\\S/.test(node.data)) {\n\t return;\n\t }\n\n\t var len = node.data.length;\n\t var range = doc.createRange();\n\t range.selectNodeContents(node);\n\t var fall = fallsOnMargin(range);\n\t if (!fall) {\n\t return; // the whole text fits on current page\n\t }\n\n\t var nextnode = node;\n\t if (fall == 1) {\n\t // starts on next page, break before anyway.\n\t if (isFirst) {\n\t // avoid leaving an empty
,
, etc. on previous page.\n\t breakAtElement(node.parentNode);\n\t } else {\n\t breakAtElement(node);\n\t }\n\t }\n\t else {\n\t (function findEOP(min, pos, max) {\n\t range.setEnd(node, pos);\n\t if (min == pos || pos == max) {\n\t return pos;\n\t }\n\t if (fallsOnMargin(range)) {\n\t return findEOP(min, (min + pos) >> 1, pos);\n\t } else {\n\t return findEOP(pos, (pos + max) >> 1, max);\n\t }\n\t })(0, len >> 1, len);\n\n\t if (!/\\S/.test(range.toString()) && isFirst) {\n\t // avoid leaving an empty ,
, etc. on previous page.\n\t breakAtElement(node.parentNode);\n\t } else {\n\t // This is only needed for IE, but it feels cleaner to do it anyway. Without\n\t // it, IE will truncate a very long text (playground/pdf-long-text-2.html).\n\t nextnode = node.splitText(range.endOffset);\n\n\t var page = makePage();\n\t range.setStartBefore(copy);\n\t page.appendChild(range.extractContents());\n\t copy.parentNode.insertBefore(page, copy);\n\t preventBulletOnListItem(nextnode.parentNode);\n\t }\n\t }\n\n\t splitText(nextnode);\n\t }\n\n\t function preventBulletOnListItem(el) {\n\t // set a hint on continued LI elements, to tell the\n\t // renderer not to draw the bullet again.\n\t // https://github.com/telerik/kendo-ui-core/issues/2732\n\t var li = closest(el, \"li\");\n\t if (li) {\n\t li.setAttribute(\"kendo-no-bullet\", \"1\");\n\t preventBulletOnListItem(li.parentNode);\n\t }\n\t }\n\t }\n\n\t return promise;\n\t}\n\n\t// This is needed for the Spreadsheet print functionality. Since\n\t// there we only need to draw text, this cuts through the ceremony\n\t// of drawDOM/renderElement and renders the text node directly.\n\tfunction drawText(element) {\n\t var group = new Group();\n\t nodeInfo._clipbox = false;\n\t nodeInfo._matrix = Matrix.unit();\n\t nodeInfo._stackingContext = {\n\t element: element,\n\t group: group\n\t };\n\t pushNodeInfo(element, getComputedStyle$1(element), group);\n\t if (element.firstChild.nodeType == 3 /* Text */) {\n\t // avoid the penalty of renderElement\n\t renderText(element, element.firstChild, group);\n\t } else {\n\t _renderElement(element, group);\n\t }\n\t popNodeInfo();\n\t return group;\n\t}\n\n\tvar parseBackgroundImage = (function(){\n\t var tok_linear_gradient = /^((-webkit-|-moz-|-o-|-ms-)?linear-gradient\\s*)\\(/;\n\t //var tok_radial_gradient = /^((-webkit-|-moz-|-o-|-ms-)?radial-gradient\\s*)\\(/;\n\t var tok_percent = /^([-0-9.]+%)/;\n\t var tok_length = /^([-0-9.]+px)/;\n\t var tok_keyword = /^(left|right|top|bottom|to|center)\\W/;\n\t var tok_angle = /^([-0-9.]+(deg|grad|rad|turn)|0)/;\n\t var tok_whitespace = /^(\\s+)/;\n\t var tok_popen = /^(\\()/;\n\t var tok_pclose = /^(\\))/;\n\t var tok_comma = /^(,)/;\n\t var tok_url = /^(url)\\(/;\n\t var tok_content = /^(.*?)\\)/;\n\n\t var cache1 = {}, cache2 = {};\n\n\t function parse(input) {\n\t var orig = input;\n\t if (hasOwnProperty(cache1, orig)) {\n\t return cache1[orig];\n\t }\n\t function skip_ws() {\n\t var m = tok_whitespace.exec(input);\n\t if (m) {\n\t input = input.substr(m[1].length);\n\t }\n\t }\n\t function read(token) {\n\t skip_ws();\n\t var m = token.exec(input);\n\t if (m) {\n\t input = input.substr(m[1].length);\n\t return m[1];\n\t }\n\t }\n\n\t function read_stop() {\n\t var color = kendo.parseColor(input, true);\n\t var length, percent;\n\t if (color) {\n\t var match =\n\t /^#[0-9a-f]+/i.exec(input) ||\n\t /^rgba?\\(.*?\\)/i.exec(input) ||\n\t /^..*?\\b/.exec(input); // maybe named color\n\t input = input.substr(match[0].length);\n\t color = color.toRGB();\n\t if (!(length = read(tok_length))) {\n\t percent = read(tok_percent);\n\t }\n\t return { color: color, length: length, percent: percent };\n\t }\n\t }\n\n\t function read_linear_gradient(propName) {\n\t var angle;\n\t var to1, to2;\n\t var stops = [];\n\t var reverse = false;\n\n\t if (read(tok_popen)) {\n\t // 1. [ || to , ]?\n\t angle = read(tok_angle);\n\t if (angle == \"0\") {\n\t angle = \"0deg\"; // Edge\n\t }\n\t if (angle) {\n\t angle = parseAngle(angle);\n\t read(tok_comma);\n\t }\n\t else {\n\t to1 = read(tok_keyword);\n\t if (to1 == \"to\") {\n\t to1 = read(tok_keyword);\n\t } else if (to1 && /^-/.test(propName)) {\n\t reverse = true;\n\t }\n\t to2 = read(tok_keyword);\n\t read(tok_comma);\n\t }\n\n\t if (/-moz-/.test(propName) && angle == null && to1 == null) {\n\t var x = read(tok_percent), y = read(tok_percent);\n\t reverse = true;\n\t if (x == \"0%\") {\n\t to1 = \"left\";\n\t } else if (x == \"100%\") {\n\t to1 = \"right\";\n\t }\n\t if (y == \"0%\") {\n\t to2 = \"top\";\n\t } else if (y == \"100%\") {\n\t to2 = \"bottom\";\n\t }\n\t read(tok_comma);\n\t }\n\n\t // 2. color stops\n\t while (input && !read(tok_pclose)) {\n\t var stop = read_stop();\n\t if (!stop) {\n\t break;\n\t }\n\t stops.push(stop);\n\t read(tok_comma);\n\t }\n\n\t return {\n\t type : \"linear\",\n\t angle : angle,\n\t to : to1 && to2 ? to1 + \" \" + to2 : to1 ? to1 : to2 ? to2 : null,\n\t stops : stops,\n\t reverse : reverse\n\t };\n\t }\n\t }\n\n\t function read_url() {\n\t if (read(tok_popen)) {\n\t var url = read(tok_content);\n\t url = url.replace(/^['\"]+|[\"']+$/g, \"\");\n\t read(tok_pclose);\n\t return { type: \"url\", url: url };\n\t }\n\t }\n\n\t var tok;\n\n\t if ((tok = read(tok_linear_gradient))) {\n\t tok = read_linear_gradient(tok);\n\t }\n\t else if ((tok = read(tok_url))) {\n\t tok = read_url();\n\t }\n\n\t return (cache1[orig] = tok || { type: \"none\" });\n\t }\n\n\t return function(input) {\n\t if (hasOwnProperty(cache2, input)) {\n\t return cache2[input];\n\t }\n\t return (cache2[input] = splitProperty(input).map(parse));\n\t };\n\t})();\n\n\tvar splitProperty = (function(){\n\t var cache = {};\n\t return function(input, separator) {\n\t if (!separator) {\n\t separator = /^\\s*,\\s*/;\n\t }\n\n\t var cacheKey = input + separator;\n\n\t if (hasOwnProperty(cache, cacheKey)) {\n\t return cache[cacheKey];\n\t }\n\n\t var ret = [];\n\t var last$$1 = 0, pos = 0;\n\t var in_paren = 0;\n\t var in_string = false;\n\t var m;\n\n\t function looking_at(rx) {\n\t return (m = rx.exec(input.substr(pos)));\n\t }\n\n\t function trim(str) {\n\t return str.replace(/^\\s+|\\s+$/g, \"\");\n\t }\n\n\t while (pos < input.length) {\n\t if (!in_string && looking_at(/^[\\(\\[\\{]/)) {\n\t in_paren++;\n\t pos++;\n\t }\n\t else if (!in_string && looking_at(/^[\\)\\]\\}]/)) {\n\t in_paren--;\n\t pos++;\n\t }\n\t else if (!in_string && looking_at(/^[\\\"\\']/)) {\n\t in_string = m[0];\n\t pos++;\n\t }\n\t else if (in_string == \"'\" && looking_at(/^\\\\\\'/)) {\n\t pos += 2;\n\t }\n\t else if (in_string == '\"' && looking_at(/^\\\\\\\"/)) {\n\t pos += 2;\n\t }\n\t else if (in_string == \"'\" && looking_at(/^\\'/)) {\n\t in_string = false;\n\t pos++;\n\t }\n\t else if (in_string == '\"' && looking_at(/^\\\"/)) {\n\t in_string = false;\n\t pos++;\n\t }\n\t else if (looking_at(separator)) {\n\t if (!in_string && !in_paren && pos > last$$1) {\n\t ret.push(trim(input.substring(last$$1, pos)));\n\t last$$1 = pos + m[0].length;\n\t }\n\t pos += m[0].length;\n\t }\n\t else {\n\t pos++;\n\t }\n\t }\n\t if (last$$1 < pos) {\n\t ret.push(trim(input.substring(last$$1, pos)));\n\t }\n\t return (cache[cacheKey] = ret);\n\t };\n\t})();\n\n\tvar getFontURL = (function(cache){\n\t return function(el){\n\t // XXX: for IE we get here the whole cssText of the rule,\n\t // because the computedStyle.src is empty. Next time we need\n\t // to fix these regexps we better write a CSS parser. :-\\\n\t var url = cache[el];\n\t if (!url) {\n\t var m;\n\t if ((m = /url\\((['\"]?)([^'\")]*?)\\1\\)\\s+format\\((['\"]?)truetype\\3\\)/.exec(el))) {\n\t url = cache[el] = m[2];\n\t } else if ((m = /url\\((['\"]?)([^'\")]*?\\.ttf)\\1\\)/.exec(el))) {\n\t url = cache[el] = m[2];\n\t }\n\t }\n\t return url;\n\t };\n\t})(Object.create ? Object.create(null) : {});\n\n\tvar getFontHeight = (function(cache){\n\t return function(font) {\n\t var height = cache[font];\n\t if (height == null) {\n\t height = cache[font] = kendoUtil.measureText(\"Mapq\", { font: font }).height;\n\t }\n\t return height;\n\t };\n\t})(Object.create ? Object.create(null) : {});\n\n\tfunction getFontFaces(doc) {\n\t if (doc == null) {\n\t doc = document;\n\t }\n\t var result = {};\n\t for (var i = 0; i < doc.styleSheets.length; ++i) {\n\t doStylesheet(doc.styleSheets[i]);\n\t }\n\t return result;\n\t function doStylesheet(ss) {\n\t if (ss) {\n\t var rules = null;\n\t try {\n\t rules = ss.cssRules;\n\t } catch (ex) {}\n\t if (rules) {\n\t addRules(ss, rules);\n\t }\n\t }\n\t }\n\t function findFonts(rule) {\n\t var src = getPropertyValue(rule.style, \"src\");\n\t if (src) {\n\t return splitProperty(src).reduce(function(a, el){\n\t var font = getFontURL(el);\n\t if (font) {\n\t a.push(font);\n\t }\n\t return a;\n\t }, []);\n\t } else {\n\t // Internet Explorer\n\t // XXX: this is gross. should work though for valid CSS.\n\t var font = getFontURL(rule.cssText);\n\t return font ? [ font ] : [];\n\t }\n\t }\n\t function addRules(styleSheet, rules) {\n\t for (var i = 0; i < rules.length; ++i) {\n\t var r = rules[i];\n\t switch (r.type) {\n\t case 3: // CSSImportRule\n\t doStylesheet(r.styleSheet);\n\t break;\n\t case 5: // CSSFontFaceRule\n\t var style = r.style;\n\t var family = splitProperty(getPropertyValue(style, \"font-family\"));\n\t var bold = /^([56789]00|bold)$/i.test(getPropertyValue(style, \"font-weight\"));\n\t var italic = \"italic\" == getPropertyValue(style, \"font-style\");\n\t var src = findFonts(r);\n\t if (src.length > 0) {\n\t addRule(styleSheet, family, bold, italic, src[0]);\n\t }\n\t }\n\t }\n\t }\n\t function addRule(styleSheet, names, bold, italic, url) {\n\t // We get full resolved absolute URLs in Chrome, but sadly\n\t // not in Firefox.\n\t if (!(/^data:/i.test(url))) {\n\t if (!(/^[^\\/:]+:\\/\\//.test(url) || /^\\//.test(url))) {\n\t url = String(styleSheet.href).replace(/[^\\/]*$/, \"\") + url;\n\t }\n\t }\n\t names.forEach(function(name){\n\t name = name.replace(/^(['\"]?)(.*?)\\1$/, \"$2\"); // it's quoted\n\t if (bold) {\n\t name += \"|bold\";\n\t }\n\t if (italic) {\n\t name += \"|italic\";\n\t }\n\t result[name] = url;\n\t });\n\t }\n\t}\n\n\tfunction hasOwnProperty(obj, key) {\n\t return Object.prototype.hasOwnProperty.call(obj, key);\n\t}\n\n\tfunction getCounter(name) {\n\t name = \"_counter_\" + name;\n\t return nodeInfo[name];\n\t}\n\n\tfunction getAllCounters(name) {\n\t var values = [], p = nodeInfo;\n\t name = \"_counter_\" + name;\n\t while (p) {\n\t if (hasOwnProperty(p, name)) {\n\t values.push(p[name]);\n\t }\n\t p = Object.getPrototypeOf(p);\n\t }\n\t return values.reverse();\n\t}\n\n\tfunction incCounter(name, inc) {\n\t var p = nodeInfo;\n\t name = \"_counter_\" + name;\n\t while (p && !hasOwnProperty(p, name)) {\n\t p = Object.getPrototypeOf(p);\n\t }\n\t if (!p) {\n\t p = nodeInfo._root;\n\t }\n\t p[name] = (p[name] || 0) + (inc == null ? 1 : inc);\n\t}\n\n\tfunction resetCounter(name, val) {\n\t name = \"_counter_\" + name;\n\t nodeInfo[name] = val == null ? 0 : val;\n\t}\n\n\tfunction doCounters(a, f, def) {\n\t for (var i = 0; i < a.length;) {\n\t var name = a[i++];\n\t var val = parseFloat(a[i]);\n\t if (isNaN(val)) {\n\t f(name, def);\n\t } else {\n\t f(name, val);\n\t ++i;\n\t }\n\t }\n\t}\n\n\tfunction updateCounters(style) {\n\t var counterReset = getPropertyValue(style, \"counter-reset\");\n\t if (counterReset) {\n\t doCounters(splitProperty(counterReset, /^\\s+/), resetCounter, 0);\n\t }\n\t var counterIncrement = getPropertyValue(style, \"counter-increment\");\n\t if (counterIncrement) {\n\t doCounters(splitProperty(counterIncrement, /^\\s+/), incCounter, 1);\n\t }\n\t}\n\n\tfunction parseColor$1(str, css) {\n\t var color = kendo.parseColor(str, true);\n\t if (color) {\n\t color = color.toRGB();\n\t if (css) {\n\t color = color.toCssRgba();\n\t } else if (color.a === 0) {\n\t color = null;\n\t }\n\t }\n\t return color;\n\t}\n\n\tfunction whenImagesAreActuallyLoaded(elements, callback) {\n\t var pending = 0;\n\t elements.forEach(function(el){\n\t var images = el.querySelectorAll(\"img\");\n\t for (var i = 0; i < images.length; ++i) {\n\t var img = images[i];\n\t if (!img.complete) {\n\t pending++;\n\t img.onload = img.onerror = next;\n\t }\n\t }\n\t });\n\t if (!pending) {\n\t next();\n\t }\n\t function next() {\n\t if (--pending <= 0) {\n\t callback();\n\t }\n\t }\n\t}\n\n\tfunction cacheImages(elements, callback) {\n\t var urls = [];\n\t function add(url) {\n\t if (!IMAGE_CACHE[url]) {\n\t IMAGE_CACHE[url] = true;\n\t urls.push(url);\n\t }\n\t }\n\n\t elements.forEach(function dive(element){\n\t if (/^img$/i.test(element.tagName)) {\n\t add(element.src);\n\t }\n\t parseBackgroundImage(\n\t getPropertyValue(\n\t getComputedStyle$1(element), \"background-image\"\n\t )\n\t ).forEach(function(bg){\n\t if (bg.type == \"url\") {\n\t add(bg.url);\n\t }\n\t });\n\n\t if (element.children) {\n\t slice$1$1(element.children).forEach(dive);\n\t }\n\t });\n\n\t var count = urls.length;\n\t function next() {\n\t if (--count <= 0) {\n\t // Even though we cached them, they simply won't be available immediately in the newly\n\t // created DOM. Previously we'd allow a 10ms timeout, but that's arbitrary and clearly\n\t // not working in all cases (https://github.com/telerik/kendo/issues/5399), so this\n\t // function will wait for their .complete attribute.\n\t whenImagesAreActuallyLoaded(elements, callback);\n\t }\n\t }\n\t if (count === 0) {\n\t next();\n\t }\n\t urls.forEach(function(url){\n\t var img = IMAGE_CACHE[url] = new window.Image();\n\t if (!(/^data:/i.test(url))) {\n\t img.crossOrigin = \"Anonymous\";\n\t }\n\t img.src = url;\n\t if (img.complete) {\n\t next();\n\t } else {\n\t img.onload = next;\n\t img.onerror = function() {\n\t IMAGE_CACHE[url] = null;\n\t next();\n\t };\n\t }\n\t });\n\t}\n\n\tfunction alphaNumeral(n) {\n\t var result = \"\";\n\t do {\n\t var r = n % 26;\n\t result = String.fromCharCode(97 + r) + result;\n\t n = Math.floor(n / 26);\n\t } while (n > 0);\n\t return result;\n\t}\n\n\tfunction pushNodeInfo(element, style, group) {\n\t nodeInfo = Object.create(nodeInfo);\n\t nodeInfo[element.tagName.toLowerCase()] = {\n\t element: element,\n\t style: style\n\t };\n\t var decoration = getPropertyValue(style, \"text-decoration\");\n\t if (decoration && decoration != \"none\") {\n\t var color = getPropertyValue(style, \"color\");\n\t decoration.split(/\\s+/g).forEach(function(name){\n\t if (!nodeInfo[name]) {\n\t nodeInfo[name] = color;\n\t }\n\t });\n\t }\n\n\t if (createsStackingContext(style)) {\n\t nodeInfo._stackingContext = {\n\t element: element,\n\t group: group\n\t };\n\t }\n\t}\n\n\tfunction popNodeInfo() {\n\t nodeInfo = Object.getPrototypeOf(nodeInfo);\n\t}\n\n\tfunction updateClipbox(path) {\n\t if (nodeInfo._clipbox != null) {\n\t var box = path.bbox(nodeInfo._matrix);\n\t if (nodeInfo._clipbox) {\n\t nodeInfo._clipbox = Rect.intersect(nodeInfo._clipbox, box);\n\t } else {\n\t nodeInfo._clipbox = box;\n\t }\n\t }\n\t}\n\n\tfunction emptyClipbox() {\n\t var cb = nodeInfo._clipbox;\n\t if (cb == null) {\n\t return true;\n\t }\n\t if (cb) {\n\t return cb.width() === 0 || cb.height() === 0;\n\t }\n\t}\n\n\tfunction createsStackingContext(style) {\n\t function prop(name) { return getPropertyValue(style, name); }\n\t if (prop(\"transform\") != \"none\" ||\n\t prop(\"position\") != \"static\" ||\n\t prop(\"z-index\") != \"auto\" ||\n\t prop(\"opacity\") < 1) {\n\t return true;\n\t }\n\t}\n\n\tfunction getComputedStyle$1(element, pseudoElt) {\n\t return window.getComputedStyle(element, pseudoElt || null);\n\t}\n\n\tfunction getPropertyValue(style, prop, defa) {\n\t var val = style.getPropertyValue(prop);\n\t if (val == null || val === \"\") {\n\t if (browser.webkit) {\n\t val = style.getPropertyValue(\"-webkit-\" + prop );\n\t } else if (browser.mozilla) {\n\t val = style.getPropertyValue(\"-moz-\" + prop );\n\t } else if (browser.opera) {\n\t val = style.getPropertyValue(\"-o-\" + prop);\n\t } else if (microsoft) {\n\t val = style.getPropertyValue(\"-ms-\" + prop);\n\t }\n\t }\n\t if (arguments.length > 2 && (val == null || val === \"\")) {\n\t return defa;\n\t } else {\n\t return val;\n\t }\n\t}\n\n\tfunction pleaseSetPropertyValue(style, prop, value, important) {\n\t style.setProperty(prop, value, important);\n\t if (browser.webkit) {\n\t style.setProperty(\"-webkit-\" + prop, value, important);\n\t } else if (browser.mozilla) {\n\t style.setProperty(\"-moz-\" + prop, value, important);\n\t } else if (browser.opera) {\n\t style.setProperty(\"-o-\" + prop, value, important);\n\t } else if (microsoft) {\n\t style.setProperty(\"-ms-\" + prop, value, important);\n\t prop = \"ms\" + prop.replace(/(^|-)([a-z])/g, function(s, p1, p2){\n\t return p1 + p2.toUpperCase();\n\t });\n\t style[prop] = value;\n\t }\n\t}\n\n\tfunction getBorder(style, side) {\n\t side = \"border-\" + side;\n\t return {\n\t width: parseFloat(getPropertyValue(style, side + \"-width\")),\n\t style: getPropertyValue(style, side + \"-style\"),\n\t color: parseColor$1(getPropertyValue(style, side + \"-color\"), true)\n\t };\n\t}\n\n\tfunction saveStyle(element, func) {\n\t var prev = element.style.cssText;\n\t var result = func();\n\t element.style.cssText = prev;\n\t return result;\n\t}\n\n\tfunction getBorderRadius(style, side) {\n\t var r = getPropertyValue(style, \"border-\" + side + \"-radius\").split(/\\s+/g).map(parseFloat);\n\t if (r.length == 1) {\n\t r.push(r[0]);\n\t }\n\t return sanitizeRadius({ x: r[0], y: r[1] });\n\t}\n\n\tfunction getContentBox(element) {\n\t var box = element.getBoundingClientRect();\n\t box = innerBox(box, \"border-*-width\", element);\n\t box = innerBox(box, \"padding-*\", element);\n\t return box;\n\t}\n\n\tfunction innerBox(box, prop, element) {\n\t var style, wt, wr, wb, wl;\n\t if (typeof prop == \"string\") {\n\t style = getComputedStyle$1(element);\n\t wt = parseFloat(getPropertyValue(style, prop.replace(\"*\", \"top\")));\n\t wr = parseFloat(getPropertyValue(style, prop.replace(\"*\", \"right\")));\n\t wb = parseFloat(getPropertyValue(style, prop.replace(\"*\", \"bottom\")));\n\t wl = parseFloat(getPropertyValue(style, prop.replace(\"*\", \"left\")));\n\t }\n\t else if (typeof prop == \"number\") {\n\t wt = wr = wb = wl = prop;\n\t }\n\t return {\n\t top : box.top + wt,\n\t right : box.right - wr,\n\t bottom : box.bottom - wb,\n\t left : box.left + wl,\n\t width : box.right - box.left - wr - wl,\n\t height : box.bottom - box.top - wb - wt\n\t };\n\t}\n\n\tfunction getTransform(style) {\n\t var transform$$1 = getPropertyValue(style, \"transform\");\n\t if (transform$$1 == \"none\") {\n\t return null;\n\t }\n\t var matrix = /^\\s*matrix\\(\\s*(.*?)\\s*\\)\\s*$/.exec(transform$$1);\n\t if (matrix) {\n\t var origin = getPropertyValue(style, \"transform-origin\");\n\t matrix = matrix[1].split(/\\s*,\\s*/g).map(parseFloat);\n\t origin = origin.split(/\\s+/g).map(parseFloat);\n\t return {\n\t matrix: matrix,\n\t origin: origin\n\t };\n\t }\n\t}\n\n\tfunction radiansToDegrees(radians) {\n\t return ((180 * radians) / Math.PI) % 360;\n\t}\n\n\tfunction parseAngle(angle) {\n\t var num = parseFloat(angle);\n\t if (/grad$/.test(angle)) {\n\t return Math.PI * num / 200;\n\t }\n\t else if (/rad$/.test(angle)) {\n\t return num;\n\t }\n\t else if (/turn$/.test(angle)) {\n\t return Math.PI * num * 2;\n\t }\n\t else if (/deg$/.test(angle)) {\n\t return Math.PI * num / 180;\n\t }\n\t}\n\n\tfunction setTransform$1(shape, m) {\n\t m = new Matrix(m[0], m[1], m[2], m[3], m[4], m[5]);\n\t shape.transform(m);\n\t return m;\n\t}\n\n\tfunction setClipping(shape, clipPath) {\n\t shape.clip(clipPath);\n\t}\n\n\tfunction addArcToPath(path, x, y, options) {\n\t var points = new Arc$2([ x, y ], options).curvePoints(), i = 1;\n\t while (i < points.length) {\n\t path.curveTo(points[i++], points[i++], points[i++]);\n\t }\n\t}\n\n\tfunction sanitizeRadius(r) {\n\t if (r.x <= 0 || r.y <= 0) {\n\t r.x = r.y = 0;\n\t }\n\t return r;\n\t}\n\n\tfunction adjustBorderRadiusForBox(box, rTL, rTR, rBR, rBL) {\n\t // adjust border radiuses such that the sum of adjacent\n\t // radiuses is not bigger than the length of the side.\n\t // seems the correct algorithm is variant (3) from here:\n\t // http://www.w3.org/Style/CSS/Tracker/issues/29?changelog\n\t var tl_x = Math.max(0, rTL.x), tl_y = Math.max(0, rTL.y);\n\t var tr_x = Math.max(0, rTR.x), tr_y = Math.max(0, rTR.y);\n\t var br_x = Math.max(0, rBR.x), br_y = Math.max(0, rBR.y);\n\t var bl_x = Math.max(0, rBL.x), bl_y = Math.max(0, rBL.y);\n\n\t var f = Math.min(\n\t box.width / (tl_x + tr_x),\n\t box.height / (tr_y + br_y),\n\t box.width / (br_x + bl_x),\n\t box.height / (bl_y + tl_y)\n\t );\n\n\t if (f < 1) {\n\t tl_x *= f; tl_y *= f;\n\t tr_x *= f; tr_y *= f;\n\t br_x *= f; br_y *= f;\n\t bl_x *= f; bl_y *= f;\n\t }\n\n\t return {\n\t tl: { x: tl_x, y: tl_y },\n\t tr: { x: tr_x, y: tr_y },\n\t br: { x: br_x, y: br_y },\n\t bl: { x: bl_x, y: bl_y }\n\t };\n\t}\n\n\tfunction elementRoundBox(element, box, type) {\n\t var style = getComputedStyle$1(element);\n\n\t var rTL = getBorderRadius(style, \"top-left\");\n\t var rTR = getBorderRadius(style, \"top-right\");\n\t var rBL = getBorderRadius(style, \"bottom-left\");\n\t var rBR = getBorderRadius(style, \"bottom-right\");\n\n\t if (type == \"padding\" || type == \"content\") {\n\t var bt = getBorder(style, \"top\");\n\t var br = getBorder(style, \"right\");\n\t var bb = getBorder(style, \"bottom\");\n\t var bl = getBorder(style, \"left\");\n\t rTL.x -= bl.width; rTL.y -= bt.width;\n\t rTR.x -= br.width; rTR.y -= bt.width;\n\t rBR.x -= br.width; rBR.y -= bb.width;\n\t rBL.x -= bl.width; rBL.y -= bb.width;\n\t if (type == \"content\") {\n\t var pt = parseFloat(getPropertyValue(style, \"padding-top\"));\n\t var pr = parseFloat(getPropertyValue(style, \"padding-right\"));\n\t var pb = parseFloat(getPropertyValue(style, \"padding-bottom\"));\n\t var pl = parseFloat(getPropertyValue(style, \"padding-left\"));\n\t rTL.x -= pl; rTL.y -= pt;\n\t rTR.x -= pr; rTR.y -= pt;\n\t rBR.x -= pr; rBR.y -= pb;\n\t rBL.x -= pl; rBL.y -= pb;\n\t }\n\t }\n\n\t if (typeof type == \"number\") {\n\t rTL.x -= type; rTL.y -= type;\n\t rTR.x -= type; rTR.y -= type;\n\t rBR.x -= type; rBR.y -= type;\n\t rBL.x -= type; rBL.y -= type;\n\t }\n\n\t return roundBox(box, rTL, rTR, rBR, rBL);\n\t}\n\n\t// Create a drawing.Path for a rounded rectangle. Receives the\n\t// bounding box and the border-radiuses in CSS order (top-left,\n\t// top-right, bottom-right, bottom-left). The radiuses must be\n\t// objects containing x (horiz. radius) and y (vertical radius).\n\tfunction roundBox(box, rTL0, rTR0, rBR0, rBL0) {\n\t var tmp = adjustBorderRadiusForBox(box, rTL0, rTR0, rBR0, rBL0);\n\t var rTL = tmp.tl;\n\t var rTR = tmp.tr;\n\t var rBR = tmp.br;\n\t var rBL = tmp.bl;\n\t var path = new Path({ fill: null, stroke: null });\n\t path.moveTo(box.left, box.top + rTL.y);\n\t if (rTL.x) {\n\t addArcToPath(path, box.left + rTL.x, box.top + rTL.y, {\n\t startAngle: -180,\n\t endAngle: -90,\n\t radiusX: rTL.x,\n\t radiusY: rTL.y\n\t });\n\t }\n\t path.lineTo(box.right - rTR.x, box.top);\n\t if (rTR.x) {\n\t addArcToPath(path, box.right - rTR.x, box.top + rTR.y, {\n\t startAngle: -90,\n\t endAngle: 0,\n\t radiusX: rTR.x,\n\t radiusY: rTR.y\n\t });\n\t }\n\t path.lineTo(box.right, box.bottom - rBR.y);\n\t if (rBR.x) {\n\t addArcToPath(path, box.right - rBR.x, box.bottom - rBR.y, {\n\t startAngle: 0,\n\t endAngle: 90,\n\t radiusX: rBR.x,\n\t radiusY: rBR.y\n\t });\n\t }\n\t path.lineTo(box.left + rBL.x, box.bottom);\n\t if (rBL.x) {\n\t addArcToPath(path, box.left + rBL.x, box.bottom - rBL.y, {\n\t startAngle: 90,\n\t endAngle: 180,\n\t radiusX: rBL.x,\n\t radiusY: rBL.y\n\t });\n\t }\n\t return path.close();\n\t}\n\n\tfunction formatCounter(val, style) {\n\t var str = String(parseFloat(val));\n\t switch (style) {\n\t case \"decimal-leading-zero\":\n\t if (str.length < 2) {\n\t str = \"0\" + str;\n\t }\n\t return str;\n\t case \"lower-roman\":\n\t return arabicToRoman(val).toLowerCase();\n\t case \"upper-roman\":\n\t return arabicToRoman(val).toUpperCase();\n\t case \"lower-latin\":\n\t case \"lower-alpha\":\n\t return alphaNumeral(val - 1);\n\t case \"upper-latin\":\n\t case \"upper-alpha\":\n\t return alphaNumeral(val - 1).toUpperCase();\n\t default:\n\t return str;\n\t }\n\t}\n\n\tfunction evalPseudoElementContent(element, content) {\n\t function displayCounter(name, style, separator) {\n\t if (!separator) {\n\t return formatCounter(getCounter(name) || 0, style);\n\t }\n\t separator = separator.replace(/^\\s*([\"'])(.*)\\1\\s*$/, \"$2\");\n\t return getAllCounters(name).map(function(val){\n\t return formatCounter(val, style);\n\t }).join(separator);\n\t }\n\t var a = splitProperty(content, /^\\s+/);\n\t var result = [], m;\n\t a.forEach(function(el){\n\t var tmp;\n\t if ((m = /^\\s*([\"'])(.*)\\1\\s*$/.exec(el))) {\n\t result.push(m[2].replace(/\\\\([0-9a-f]{4})/gi, function(s, p){\n\t return String.fromCharCode(parseInt(p, 16));\n\t }));\n\t }\n\t else if ((m = /^\\s*counter\\((.*?)\\)\\s*$/.exec(el))) {\n\t tmp = splitProperty(m[1]);\n\t result.push(displayCounter(tmp[0], tmp[1]));\n\t }\n\t else if ((m = /^\\s*counters\\((.*?)\\)\\s*$/.exec(el))) {\n\t tmp = splitProperty(m[1]);\n\t result.push(displayCounter(tmp[0], tmp[2], tmp[1]));\n\t }\n\t else if ((m = /^\\s*attr\\((.*?)\\)\\s*$/.exec(el))) {\n\t result.push(element.getAttribute(m[1]) || \"\");\n\t }\n\t else {\n\t result.push(el);\n\t }\n\t });\n\t return result.join(\"\");\n\t}\n\n\tfunction getCssText(style) {\n\t if (style.cssText) {\n\t return style.cssText;\n\t }\n\t // Status: NEW. Report year: 2002. Current year: 2014.\n\t // Nice played, Mozillians.\n\t // https://bugzilla.mozilla.org/show_bug.cgi?id=137687\n\t var result = [];\n\t for (var i = 0; i < style.length; ++i) {\n\t result.push(style[i] + \": \" + getPropertyValue(style, style[i]));\n\t }\n\t return result.join(\";\\n\");\n\t}\n\n\tfunction _renderWithPseudoElements(element, group) {\n\t if (element.tagName == KENDO_PSEUDO_ELEMENT) {\n\t _renderElement(element, group);\n\t return;\n\t }\n\t var fake = [];\n\t function pseudo(kind, place) {\n\t var style = getComputedStyle$1(element, kind), content = style.content;\n\t updateCounters(style);\n\t if (content && content != \"normal\" && content != \"none\" && style.width != \"0px\") {\n\t var psel = element.ownerDocument.createElement(KENDO_PSEUDO_ELEMENT);\n\t psel.style.cssText = getCssText(style);\n\t psel.textContent = evalPseudoElementContent(element, content);\n\t element.insertBefore(psel, place);\n\t fake.push(psel);\n\t }\n\t }\n\t pseudo(\":before\", element.firstChild);\n\t pseudo(\":after\", null);\n\t if (fake.length > 0) {\n\t var saveClass = element.className;\n\t element.className += \" kendo-pdf-hide-pseudo-elements\";\n\t _renderElement(element, group);\n\t element.className = saveClass;\n\t fake.forEach(function(el){ element.removeChild(el); });\n\t } else {\n\t _renderElement(element, group);\n\t }\n\t}\n\n\tfunction _renderElement(element, group) {\n\t var style = getComputedStyle$1(element);\n\n\t var top = getBorder(style, \"top\");\n\t var right = getBorder(style, \"right\");\n\t var bottom = getBorder(style, \"bottom\");\n\t var left = getBorder(style, \"left\");\n\n\t var rTL0 = getBorderRadius(style, \"top-left\");\n\t var rTR0 = getBorderRadius(style, \"top-right\");\n\t var rBL0 = getBorderRadius(style, \"bottom-left\");\n\t var rBR0 = getBorderRadius(style, \"bottom-right\");\n\n\t var dir = getPropertyValue(style, \"direction\");\n\n\t var backgroundColor = getPropertyValue(style, \"background-color\");\n\t backgroundColor = parseColor$1(backgroundColor);\n\n\t var backgroundImage = parseBackgroundImage( getPropertyValue(style, \"background-image\") );\n\t var backgroundRepeat = splitProperty( getPropertyValue(style, \"background-repeat\") );\n\t var backgroundPosition = splitProperty( getPropertyValue(style, \"background-position\") );\n\t var backgroundOrigin = splitProperty( getPropertyValue(style, \"background-origin\") );\n\t var backgroundSize = splitProperty( getPropertyValue(style, \"background-size\") );\n\n\t // IE shrinks the text with text-overflow: ellipsis,\n\t // apparently because the returned bounding box for the range\n\t // is limited to the visible area minus space for the dots,\n\t // instead of being the full width of the text.\n\t //\n\t // https://github.com/telerik/kendo/issues/5232\n\t // https://github.com/telerik/kendo-ui-core/issues/1868\n\t //\n\t // We have to test it here rather than in renderText because\n\t // text-overflow: ellipsis could be set on a parent element (not\n\t // necessarily the one containing the text); in this case,\n\t // getComputedStyle(elementWithTheText) will return \"clip\", not\n\t // \"ellipsis\" (which is probably a bug, but oh well...)\n\t var textOverflow, saveTextOverflow;\n\t if (microsoft) {\n\t textOverflow = style.textOverflow; // computed style\n\t if (textOverflow == \"ellipsis\") {\n\t saveTextOverflow = element.style.textOverflow; // own style.\n\t element.style.textOverflow = \"clip\";\n\t }\n\t }\n\n\t if (browser.msie && browser.version < 10) {\n\t // IE9 hacks. getPropertyValue won't return the correct\n\t // value. Sucks that we have to do it here, I'd prefer to\n\t // move it in getPropertyValue, but we don't have the\n\t // element.\n\t backgroundPosition = splitProperty(element.currentStyle.backgroundPosition);\n\t }\n\n\t var innerbox = innerBox(element.getBoundingClientRect(), \"border-*-width\", element);\n\n\t // CSS \"clip\" property - if present, replace the group with a\n\t // new one which is clipped. This must happen before drawing\n\t // the borders and background.\n\t (function(){\n\t var clip = getPropertyValue(style, \"clip\");\n\t var m = /^\\s*rect\\((.*)\\)\\s*$/.exec(clip);\n\t if (m) {\n\t var a = m[1].split(/[ ,]+/g);\n\t var top = a[0] == \"auto\" ? innerbox.top : parseFloat(a[0]) + innerbox.top;\n\t var right = a[1] == \"auto\" ? innerbox.right : parseFloat(a[1]) + innerbox.left;\n\t var bottom = a[2] == \"auto\" ? innerbox.bottom : parseFloat(a[2]) + innerbox.top;\n\t var left = a[3] == \"auto\" ? innerbox.left : parseFloat(a[3]) + innerbox.left;\n\t var tmp = new Group();\n\t var clipPath = new Path()\n\t .moveTo(left, top)\n\t .lineTo(right, top)\n\t .lineTo(right, bottom)\n\t .lineTo(left, bottom)\n\t .close();\n\t setClipping(tmp, clipPath);\n\t group.append(tmp);\n\t group = tmp;\n\t updateClipbox(clipPath);\n\t }\n\t })();\n\n\t var boxes, i, cells;\n\t var display = getPropertyValue(style, \"display\");\n\n\t if (display == \"table-row\") {\n\t // because of rowspan/colspan, we shouldn't draw background of table row elements on the\n\t // box given by its getBoundingClientRect, because if we do we risk overwritting a\n\t // previously rendered cell. https://github.com/telerik/kendo/issues/4881\n\t boxes = [];\n\t for (i = 0, cells = element.children; i < cells.length; ++i) {\n\t boxes.push(cells[i].getBoundingClientRect());\n\t }\n\t } else {\n\t boxes = element.getClientRects();\n\t if (boxes.length == 1) {\n\t // Workaround the missing borders in Chrome! getClientRects() boxes contains values\n\t // rounded to integer. getBoundingClientRect() appears to work fine. We still need\n\t // getClientRects() to support cases where there are more boxes (continued inline\n\t // elements that might have border/background).\n\t boxes = [ element.getBoundingClientRect() ];\n\t }\n\t }\n\n\t // This function workarounds another Chrome bug, where boxes returned for a table with\n\t // border-collapse: collapse will overlap the table border. Our rendering is not perfect in\n\t // such case anyway, but with this is better than without it.\n\t boxes = adjustBoxes(boxes);\n\n\t for (i = 0; i < boxes.length; ++i) {\n\t drawOneBox(boxes[i], i === 0, i == boxes.length - 1);\n\t }\n\n\t // Render links as separate groups. We can't use boxes returned by element's getClientRects\n\t // because if display type is \"inline\" (default for ), boxes will not include the height of\n\t // images inside. https://github.com/telerik/kendo-ui-core/issues/3359\n\t if (element.tagName == \"A\" && element.href && !/^#?$/.test(element.getAttribute(\"href\"))) {\n\t if (!nodeInfo._avoidLinks || !matches(element, nodeInfo._avoidLinks)) {\n\t var r = document.createRange();\n\t r.selectNodeContents(element);\n\t slice$1$1(r.getClientRects()).forEach(function(box){\n\t var g = new Group();\n\t g._pdfLink = {\n\t url : element.href,\n\t top : box.top,\n\t right : box.right,\n\t bottom : box.bottom,\n\t left : box.left\n\t };\n\t group.append(g);\n\t });\n\t }\n\t }\n\n\t if (boxes.length > 0 && display == \"list-item\" && !element.getAttribute(\"kendo-no-bullet\")) {\n\t drawBullet(boxes[0]);\n\t }\n\n\t // overflow: hidden/auto - if present, replace the group with\n\t // a new one clipped by the inner box.\n\t (function(){\n\t function clipit() {\n\t var clipPath = elementRoundBox(element, innerbox, \"padding\");\n\t var tmp = new Group();\n\t setClipping(tmp, clipPath);\n\t group.append(tmp);\n\t group = tmp;\n\t updateClipbox(clipPath);\n\t }\n\t if (isFormField(element)) {\n\t clipit();\n\t } else if (/^(hidden|auto|scroll)/.test(getPropertyValue(style, \"overflow\"))) {\n\t clipit();\n\t } else if (/^(hidden|auto|scroll)/.test(getPropertyValue(style, \"overflow-x\"))) {\n\t clipit();\n\t } else if (/^(hidden|auto|scroll)/.test(getPropertyValue(style, \"overflow-y\"))) {\n\t clipit();\n\t }\n\t })();\n\n\t if (!maybeRenderWidget(element, group)) {\n\t renderContents(element, group);\n\t }\n\n\t if (microsoft && textOverflow == \"ellipsis\") {\n\t element.style.textOverflow = saveTextOverflow;\n\t }\n\n\t return group; // only utility functions after this line.\n\n\t function adjustBoxes(boxes) {\n\t if (/^td$/i.test(element.tagName)) {\n\t var table = nodeInfo.table;\n\t if (table && getPropertyValue(table.style, \"border-collapse\") == \"collapse\") {\n\t var tableBorderLeft = getBorder(table.style, \"left\").width;\n\t var tableBorderTop = getBorder(table.style, \"top\").width;\n\t // check if we need to adjust\n\t if (tableBorderLeft === 0 && tableBorderTop === 0) {\n\t return boxes; // nope\n\t }\n\t var tableBox = table.element.getBoundingClientRect();\n\t var firstCell = table.element.rows[0].cells[0];\n\t var firstCellBox = firstCell.getBoundingClientRect();\n\t if (firstCellBox.top == tableBox.top || firstCellBox.left == tableBox.left) {\n\t return slice$1$1(boxes).map(function(box){\n\t return {\n\t left : box.left + tableBorderLeft,\n\t top : box.top + tableBorderTop,\n\t right : box.right + tableBorderLeft,\n\t bottom : box.bottom + tableBorderTop,\n\t height : box.height,\n\t width : box.width\n\t };\n\t });\n\t }\n\t }\n\t }\n\t return boxes;\n\t }\n\n\t // this function will be called to draw each border. it\n\t // draws starting at origin and the resulted path must be\n\t // translated/rotated to be placed in the proper position.\n\t //\n\t // arguments are named as if it draws the top border:\n\t //\n\t // - `len` the length of the edge\n\t // - `Wtop` the width of the edge (i.e. border-top-width)\n\t // - `Wleft` the width of the left edge (border-left-width)\n\t // - `Wright` the width of the right edge\n\t // - `rl` and `rl` -- the border radius on the left and right\n\t // (objects containing x and y, for horiz/vertical radius)\n\t // - `transform` -- transformation to apply\n\t //\n\t function drawEdge(color, len, Wtop, Wleft, Wright, rl, rr, transform$$1) {\n\t if (Wtop <= 0) {\n\t return;\n\t }\n\n\t var path, edge = new Group();\n\t setTransform$1(edge, transform$$1);\n\t group.append(edge);\n\n\t sanitizeRadius(rl);\n\t sanitizeRadius(rr);\n\n\t // draw main border. this is the area without the rounded corners\n\t path = new Path({\n\t fill: { color: color },\n\t stroke: null\n\t });\n\t edge.append(path);\n\t path.moveTo(rl.x ? Math.max(rl.x, Wleft) : 0, 0)\n\t .lineTo(len - (rr.x ? Math.max(rr.x, Wright) : 0), 0)\n\t .lineTo(len - Math.max(rr.x, Wright), Wtop)\n\t .lineTo(Math.max(rl.x, Wleft), Wtop)\n\t .close();\n\n\t if (rl.x) {\n\t drawRoundCorner(Wleft, rl, [ -1, 0, 0, 1, rl.x, 0 ]);\n\t }\n\n\t if (rr.x) {\n\t drawRoundCorner(Wright, rr, [ 1, 0, 0, 1, len - rr.x, 0 ]);\n\t }\n\n\t // draws one round corner, starting at origin (needs to be\n\t // translated/rotated to be placed properly).\n\t function drawRoundCorner(Wright, r, transform$$1) {\n\t var angle = Math.PI/2 * Wright / (Wright + Wtop);\n\n\t // not sanitizing this one, because negative values\n\t // are useful to fill the box correctly.\n\t var ri = {\n\t x: r.x - Wright,\n\t y: r.y - Wtop\n\t };\n\n\t var path = new Path({\n\t fill: { color: color },\n\t stroke: null\n\t }).moveTo(0, 0);\n\n\t setTransform$1(path, transform$$1);\n\n\t addArcToPath(path, 0, r.y, {\n\t startAngle: -90,\n\t endAngle: -radiansToDegrees(angle),\n\t radiusX: r.x,\n\t radiusY: r.y\n\t });\n\n\t if (ri.x > 0 && ri.y > 0) {\n\t path.lineTo(ri.x * Math.cos(angle), r.y - ri.y * Math.sin(angle));\n\t addArcToPath(path, 0, r.y, {\n\t startAngle: -radiansToDegrees(angle),\n\t endAngle: -90,\n\t radiusX: ri.x,\n\t radiusY: ri.y,\n\t anticlockwise: true\n\t });\n\t }\n\t else if (ri.x > 0) {\n\t path.lineTo(ri.x, Wtop)\n\t .lineTo(0, Wtop);\n\t }\n\t else {\n\t path.lineTo(ri.x, Wtop)\n\t .lineTo(ri.x, 0);\n\t }\n\n\t edge.append(path.close());\n\t }\n\t }\n\n\t function drawBackground(box) {\n\t var background = new Group();\n\t setClipping(background, roundBox(box, rTL0, rTR0, rBR0, rBL0));\n\t group.append(background);\n\n\t if (backgroundColor) {\n\t var path = new Path({\n\t fill: { color: backgroundColor.toCssRgba() },\n\t stroke: null\n\t });\n\t path.moveTo(box.left, box.top)\n\t .lineTo(box.right, box.top)\n\t .lineTo(box.right, box.bottom)\n\t .lineTo(box.left, box.bottom)\n\t .close();\n\t background.append(path);\n\t }\n\n\t for (var i = backgroundImage.length; --i >= 0;) {\n\t drawOneBackground(\n\t background, box,\n\t backgroundImage[i],\n\t backgroundRepeat[i % backgroundRepeat.length],\n\t backgroundPosition[i % backgroundPosition.length],\n\t backgroundOrigin[i % backgroundOrigin.length],\n\t backgroundSize[i % backgroundSize.length]\n\t );\n\t }\n\t }\n\n\t function drawOneBackground(group, box, background, backgroundRepeat, backgroundPosition, backgroundOrigin, backgroundSize) {\n\t if (!background || (background == \"none\")) {\n\t return;\n\t }\n\n\t if (background.type == \"url\") {\n\t var img = IMAGE_CACHE[background.url];\n\t if (img && img.width > 0 && img.height > 0) {\n\t drawBackgroundImage(group, box, img.width, img.height, function(group, rect){\n\t group.append(new Image$1(background.url, rect));\n\t });\n\t }\n\t } else if (background.type == \"linear\") {\n\t drawBackgroundImage(group, box, box.width, box.height, gradientRenderer(background));\n\t } else {\n\t return;\n\t }\n\n\t function drawBackgroundImage(group, box, img_width, img_height, renderBG) {\n\t var aspect_ratio = img_width / img_height, f;\n\n\t // for background-origin: border-box the box is already appropriate\n\t var orgBox = box;\n\t if (backgroundOrigin == \"content-box\") {\n\t orgBox = innerBox(orgBox, \"border-*-width\", element);\n\t orgBox = innerBox(orgBox, \"padding-*\", element);\n\t } else if (backgroundOrigin == \"padding-box\") {\n\t orgBox = innerBox(orgBox, \"border-*-width\", element);\n\t }\n\n\t if (!/^\\s*auto(\\s+auto)?\\s*$/.test(backgroundSize)) {\n\t if (backgroundSize == \"contain\") {\n\t f = Math.min(orgBox.width / img_width,\n\t orgBox.height / img_height);\n\t img_width *= f;\n\t img_height *= f;\n\t }\n\t else if (backgroundSize == \"cover\") {\n\t f = Math.max(orgBox.width / img_width,\n\t orgBox.height / img_height);\n\t img_width *= f;\n\t img_height *= f;\n\t }\n\t else {\n\t var size = backgroundSize.split(/\\s+/g);\n\t // compute width\n\t if (/%$/.test(size[0])) {\n\t img_width = orgBox.width * parseFloat(size[0]) / 100;\n\t } else {\n\t img_width = parseFloat(size[0]);\n\t }\n\t // compute height\n\t if (size.length == 1 || size[1] == \"auto\") {\n\t img_height = img_width / aspect_ratio;\n\t } else if (/%$/.test(size[1])) {\n\t img_height = orgBox.height * parseFloat(size[1]) / 100;\n\t } else {\n\t img_height = parseFloat(size[1]);\n\t }\n\t }\n\t }\n\n\t var pos = String(backgroundPosition);\n\n\t // IE sometimes reports single-word positions\n\t // https://github.com/telerik/kendo-ui-core/issues/2786\n\t //\n\t // it seems to switch to percentages when the horizontal\n\t // position is not \"center\", therefore we don't handle\n\t // multi-word cases here. All other browsers return\n\t // percentages or pixels instead of keywords. At least\n\t // for now...\n\t switch (pos) {\n\t case \"bottom\" : pos = \"50% 100%\"; break;\n\t case \"top\" : pos = \"50% 0\"; break;\n\t case \"left\" : pos = \"0 50%\"; break;\n\t case \"right\" : pos = \"100% 50%\"; break;\n\t case \"center\" : pos = \"50% 50%\"; break;\n\t }\n\n\t pos = pos.split(/\\s+/);\n\t if (pos.length == 1) {\n\t pos[1] = \"50%\";\n\t }\n\n\t if (/%$/.test(pos[0])) {\n\t pos[0] = parseFloat(pos[0]) / 100 * (orgBox.width - img_width);\n\t } else {\n\t pos[0] = parseFloat(pos[0]);\n\t }\n\t if (/%$/.test(pos[1])) {\n\t pos[1] = parseFloat(pos[1]) / 100 * (orgBox.height - img_height);\n\t } else {\n\t pos[1] = parseFloat(pos[1]);\n\t }\n\n\t var rect = new Rect([ orgBox.left + pos[0], orgBox.top + pos[1] ], [ img_width, img_height ]);\n\n\t // XXX: background-repeat could be implemented more\n\t // efficiently as a fill pattern (at least for PDF\n\t // output, probably SVG too).\n\n\t function rewX() {\n\t while (rect.origin.x > box.left) {\n\t rect.origin.x -= img_width;\n\t }\n\t }\n\n\t function rewY() {\n\t while (rect.origin.y > box.top) {\n\t rect.origin.y -= img_height;\n\t }\n\t }\n\n\t function repeatX() {\n\t while (rect.origin.x < box.right) {\n\t renderBG(group, rect.clone());\n\t rect.origin.x += img_width;\n\t }\n\t }\n\n\t if (backgroundRepeat == \"no-repeat\") {\n\t renderBG(group, rect);\n\t }\n\t else if (backgroundRepeat == \"repeat-x\") {\n\t rewX();\n\t repeatX();\n\t }\n\t else if (backgroundRepeat == \"repeat-y\") {\n\t rewY();\n\t while (rect.origin.y < box.bottom) {\n\t renderBG(group, rect.clone());\n\t rect.origin.y += img_height;\n\t }\n\t }\n\t else if (backgroundRepeat == \"repeat\") {\n\t rewX();\n\t rewY();\n\t var origin = rect.origin.clone();\n\t while (rect.origin.y < box.bottom) {\n\t rect.origin.x = origin.x;\n\t repeatX();\n\t rect.origin.y += img_height;\n\t }\n\t }\n\t }\n\t }\n\n\t function drawBullet() {\n\t var listStyleType = getPropertyValue(style, \"list-style-type\");\n\t if (listStyleType == \"none\") {\n\t return;\n\t }\n\t var listStylePosition = getPropertyValue(style, \"list-style-position\");\n\n\t function _drawBullet(f) {\n\t saveStyle(element, function(){\n\t element.style.position = \"relative\";\n\t var bullet = element.ownerDocument.createElement(KENDO_PSEUDO_ELEMENT);\n\t bullet.style.position = \"absolute\";\n\t bullet.style.boxSizing = \"border-box\";\n\t if (listStylePosition == \"outside\") {\n\t bullet.style.width = \"6em\";\n\t bullet.style.left = \"-6.8em\";\n\t bullet.style.textAlign = \"right\";\n\t } else {\n\t bullet.style.left = \"0px\";\n\t }\n\t f(bullet);\n\t element.insertBefore(bullet, element.firstChild);\n\t renderElement(bullet, group);\n\t element.removeChild(bullet);\n\t });\n\t }\n\n\t function elementIndex(f) {\n\t var a = element.parentNode.children;\n\t var k = element.getAttribute(\"kendo-split-index\");\n\t if (k != null) {\n\t return f(k|0, a.length);\n\t }\n\t for (var i = 0; i < a.length; ++i) {\n\t if (a[i] === element) {\n\t return f(i, a.length);\n\t }\n\t }\n\t }\n\n\t switch (listStyleType) {\n\t case \"circle\":\n\t case \"disc\":\n\t case \"square\":\n\t _drawBullet(function(bullet){\n\t // XXX: the science behind these values is called \"trial and error\".\n\t bullet.style.fontSize = \"60%\";\n\t bullet.style.lineHeight = \"200%\";\n\t bullet.style.paddingRight = \"0.5em\";\n\t bullet.style.fontFamily = \"DejaVu Serif\";\n\t bullet.innerHTML = {\n\t \"disc\" : \"\\u25cf\",\n\t \"circle\" : \"\\u25ef\",\n\t \"square\" : \"\\u25a0\"\n\t }[listStyleType];\n\t });\n\t break;\n\n\t case \"decimal\":\n\t case \"decimal-leading-zero\":\n\t _drawBullet(function(bullet){\n\t elementIndex(function(idx){\n\t ++idx;\n\t if (listStyleType == \"decimal-leading-zero\" && idx < 10) {\n\t idx = \"0\" + idx;\n\t }\n\t bullet.innerHTML = idx + \".\";\n\t });\n\t });\n\t break;\n\n\t case \"lower-roman\":\n\t case \"upper-roman\":\n\t _drawBullet(function(bullet){\n\t elementIndex(function(idx){\n\t idx = arabicToRoman(idx + 1);\n\t if (listStyleType == \"upper-roman\") {\n\t idx = idx.toUpperCase();\n\t }\n\t bullet.innerHTML = idx + \".\";\n\t });\n\t });\n\t break;\n\n\t case \"lower-latin\":\n\t case \"lower-alpha\":\n\t case \"upper-latin\":\n\t case \"upper-alpha\":\n\t _drawBullet(function(bullet){\n\t elementIndex(function(idx){\n\t idx = alphaNumeral(idx);\n\t if (/^upper/i.test(listStyleType)) {\n\t idx = idx.toUpperCase();\n\t }\n\t bullet.innerHTML = idx + \".\";\n\t });\n\t });\n\t break;\n\t }\n\t }\n\n\t // draws a single border box\n\t function drawOneBox(box, isFirst, isLast) {\n\t if (box.width === 0 || box.height === 0) {\n\t return;\n\t }\n\n\t drawBackground(box);\n\n\t var shouldDrawLeft = (left.width > 0 && ((isFirst && dir == \"ltr\") || (isLast && dir == \"rtl\")));\n\t var shouldDrawRight = (right.width > 0 && ((isLast && dir == \"ltr\") || (isFirst && dir == \"rtl\")));\n\n\t // The most general case is that the 4 borders have different widths and border\n\t // radiuses. The way that is handled is by drawing 3 Paths for each border: the\n\t // straight line, and two round corners which represent half of the entire rounded\n\t // corner. To simplify code those shapes are drawed at origin (by the drawEdge\n\t // function), then translated/rotated into the right position.\n\t //\n\t // However, this leads to poor results due to rounding in the simpler cases where\n\t // borders are straight lines. Therefore we handle a few such cases separately with\n\t // straight lines. C^wC^wC^w -- nope, scratch that. poor rendering was because of a bug\n\t // in Chrome (getClientRects() returns rounded integer values rather than exact floats.\n\t // web dev is still a ghetto.)\n\n\t // first, just in case there is no border...\n\t if (top.width === 0 && left.width === 0 && right.width === 0 && bottom.width === 0) {\n\t return;\n\t }\n\n\t // START paint borders\n\t // if all borders have equal colors...\n\t if (top.color == right.color && top.color == bottom.color && top.color == left.color) {\n\n\t // if same widths too, we can draw the whole border by stroking a single path.\n\t if (top.width == right.width && top.width == bottom.width && top.width == left.width)\n\t {\n\t if (shouldDrawLeft && shouldDrawRight) {\n\t // reduce box by half the border width, so we can draw it by stroking.\n\t box = innerBox(box, top.width/2);\n\n\t // adjust the border radiuses, again by top.width/2, and make the path element.\n\t var path = elementRoundBox(element, box, top.width/2);\n\t path.options.stroke = {\n\t color: top.color,\n\t width: top.width\n\t };\n\t group.append(path);\n\t return;\n\t }\n\t }\n\t }\n\n\t // if border radiuses are zero and widths are at most one pixel, we can again use simple\n\t // paths.\n\t if (rTL0.x === 0 && rTR0.x === 0 && rBR0.x === 0 && rBL0.x === 0) {\n\t // alright, 1.9px will do as well. the difference in color blending should not be\n\t // noticeable.\n\t if (top.width < 2 && left.width < 2 && right.width < 2 && bottom.width < 2) {\n\t // top border\n\t if (top.width > 0) {\n\t group.append(\n\t new Path({\n\t stroke: { width: top.width, color: top.color }\n\t })\n\t .moveTo(box.left, box.top + top.width/2)\n\t .lineTo(box.right, box.top + top.width/2)\n\t );\n\t }\n\n\t // bottom border\n\t if (bottom.width > 0) {\n\t group.append(\n\t new Path({\n\t stroke: { width: bottom.width, color: bottom.color }\n\t })\n\t .moveTo(box.left, box.bottom - bottom.width/2)\n\t .lineTo(box.right, box.bottom - bottom.width/2)\n\t );\n\t }\n\n\t // left border\n\t if (shouldDrawLeft) {\n\t group.append(\n\t new Path({\n\t stroke: { width: left.width, color: left.color }\n\t })\n\t .moveTo(box.left + left.width/2, box.top)\n\t .lineTo(box.left + left.width/2, box.bottom)\n\t );\n\t }\n\n\t // right border\n\t if (shouldDrawRight) {\n\t group.append(\n\t new Path({\n\t stroke: { width: right.width, color: right.color }\n\t })\n\t .moveTo(box.right - right.width/2, box.top)\n\t .lineTo(box.right - right.width/2, box.bottom)\n\t );\n\t }\n\n\t return;\n\t }\n\t }\n\t // END paint borders\n\n\t var tmp = adjustBorderRadiusForBox(box, rTL0, rTR0, rBR0, rBL0);\n\t var rTL = tmp.tl;\n\t var rTR = tmp.tr;\n\t var rBR = tmp.br;\n\t var rBL = tmp.bl;\n\n\t // top border\n\t drawEdge(top.color,\n\t box.width, top.width, left.width, right.width,\n\t rTL, rTR,\n\t [ 1, 0, 0, 1, box.left, box.top ]);\n\n\t // bottom border\n\t drawEdge(bottom.color,\n\t box.width, bottom.width, right.width, left.width,\n\t rBR, rBL,\n\t [ -1, 0, 0, -1, box.right, box.bottom ]);\n\n\t // for left/right borders we need to invert the border-radiuses\n\t function inv(p) {\n\t return { x: p.y, y: p.x };\n\t }\n\n\t // left border\n\t drawEdge(left.color,\n\t box.height, left.width, bottom.width, top.width,\n\t inv(rBL), inv(rTL),\n\t [ 0, -1, 1, 0, box.left, box.bottom ]);\n\n\t // right border\n\t drawEdge(right.color,\n\t box.height, right.width, top.width, bottom.width,\n\t inv(rTR), inv(rBR),\n\t [ 0, 1, -1, 0, box.right, box.top ]);\n\t }\n\t}\n\n\tfunction gradientRenderer(gradient) {\n\t return function(group, rect) {\n\t var width = rect.width(), height = rect.height();\n\n\t switch (gradient.type) {\n\t case \"linear\":\n\n\t // figure out the angle.\n\t var angle = gradient.angle != null ? gradient.angle : Math.PI;\n\t switch (gradient.to) {\n\t case \"top\":\n\t angle = 0;\n\t break;\n\t case \"left\":\n\t angle = -Math.PI / 2;\n\t break;\n\t case \"bottom\":\n\t angle = Math.PI;\n\t break;\n\t case \"right\":\n\t angle = Math.PI / 2;\n\t break;\n\t case \"top left\": case \"left top\":\n\t angle = -Math.atan2(height, width);\n\t break;\n\t case \"top right\": case \"right top\":\n\t angle = Math.atan2(height, width);\n\t break;\n\t case \"bottom left\": case \"left bottom\":\n\t angle = Math.PI + Math.atan2(height, width);\n\t break;\n\t case \"bottom right\": case \"right bottom\":\n\t angle = Math.PI - Math.atan2(height, width);\n\t break;\n\t }\n\n\t if (gradient.reverse) {\n\t angle -= Math.PI;\n\t }\n\n\t // limit the angle between 0..2PI\n\t angle %= 2 * Math.PI;\n\t if (angle < 0) {\n\t angle += 2 * Math.PI;\n\t }\n\n\t // compute gradient's start/end points. here len is the length of the gradient line\n\t // and x,y is the end point relative to the center of the rectangle in conventional\n\t // (math) axis direction.\n\n\t // this is the original (unscaled) length of the gradient line. needed to deal with\n\t // absolutely positioned color stops. formula from the CSS spec:\n\t // http://dev.w3.org/csswg/css-images-3/#linear-gradient-syntax\n\t var pxlen = Math.abs(width * Math.sin(angle)) + Math.abs(height * Math.cos(angle));\n\n\t // The math below is pretty simple, but it took a while to figure out. We compute x\n\t // and y, the *end* of the gradient line. However, we want to transform them into\n\t // element-based coordinates (SVG's gradientUnits=\"objectBoundingBox\"). That means,\n\t // x=0 is the left edge, x=1 is the right edge, y=0 is the top edge and y=1 is the\n\t // bottom edge.\n\t //\n\t // A naive approach would use the original angle for these calculations. Say we'd\n\t // like to draw a gradient angled at 45deg in a 100x400 box. When we use\n\t // objectBoundingBox, the renderer will draw it in a 1x1 *square* box, and then\n\t // scale that to the desired dimensions. The 45deg angle will look more like 70deg\n\t // after scaling. SVG (http://www.w3.org/TR/SVG/pservers.html#LinearGradients) says\n\t // the following:\n\t //\n\t // When gradientUnits=\"objectBoundingBox\" and 'gradientTransform' is the\n\t // identity matrix, the normal of the linear gradient is perpendicular to the\n\t // gradient vector in object bounding box space (i.e., the abstract coordinate\n\t // system where (0,0) is at the top/left of the object bounding box and (1,1) is\n\t // at the bottom/right of the object bounding box). When the object's bounding\n\t // box is not square, the gradient normal which is initially perpendicular to\n\t // the gradient vector within object bounding box space may render\n\t // non-perpendicular relative to the gradient vector in user space. If the\n\t // gradient vector is parallel to one of the axes of the bounding box, the\n\t // gradient normal will remain perpendicular. This transformation is due to\n\t // application of the non-uniform scaling transformation from bounding box space\n\t // to user space.\n\t //\n\t // which is an extremely long and confusing way to tell what I just said above.\n\t //\n\t // For this reason we need to apply the reverse scaling to the original angle, so\n\t // that when it'll finally be rendered it'll actually be at the desired slope. Now\n\t // I'll let you figure out the math yourself.\n\n\t var scaledAngle = Math.atan(width * Math.tan(angle) / height);\n\t var sin = Math.sin(scaledAngle), cos = Math.cos(scaledAngle);\n\t var len = Math.abs(sin) + Math.abs(cos);\n\t var x = len/2 * sin;\n\t var y = len/2 * cos;\n\n\t // Because of the arctangent, our scaledAngle ends up between -PI/2..PI/2, possibly\n\t // losing the intended direction of the gradient. The following fixes it.\n\t if (angle > Math.PI/2 && angle <= 3*Math.PI/2) {\n\t x = -x;\n\t y = -y;\n\t }\n\n\t // compute the color stops.\n\t var implicit = [], right = 0;\n\t var stops = gradient.stops.map(function(s, i){\n\t var offset = s.percent;\n\t if (offset) {\n\t offset = parseFloat(offset) / 100;\n\t } else if (s.length) {\n\t offset = parseFloat(s.length) / pxlen;\n\t } else if (i === 0) {\n\t offset = 0;\n\t } else if (i == gradient.stops.length - 1) {\n\t offset = 1;\n\t }\n\t var stop = {\n\t color: s.color.toCssRgba(),\n\t offset: offset\n\t };\n\t if (offset != null) {\n\t right = offset;\n\t // fix implicit offsets\n\t implicit.forEach(function(s, i){\n\t var stop = s.stop;\n\t stop.offset = s.left + (right - s.left) * (i + 1) / (implicit.length + 1);\n\t });\n\t implicit = [];\n\t } else {\n\t implicit.push({ left: right, stop: stop });\n\t }\n\t return stop;\n\t });\n\n\t var start = [ 0.5 - x, 0.5 + y ];\n\t var end = [ 0.5 + x, 0.5 - y ];\n\n\t // finally, draw it.\n\t group.append(\n\t Path.fromRect(rect)\n\t .stroke(null)\n\t .fill(new LinearGradient({\n\t start : start,\n\t end : end,\n\t stops : stops,\n\t userSpace : false\n\t }))\n\t );\n\t break;\n\t case \"radial\":\n\t // XXX:\n\t if (window.console && window.console.log) {\n\t window.console.log(\"Radial gradients are not yet supported in HTML renderer\");\n\t }\n\t break;\n\t }\n\t };\n\t}\n\n\tfunction maybeRenderWidget(element, group) {\n\t var visual;\n\n\t if (element._kendoExportVisual) {\n\t visual = element._kendoExportVisual();\n\t } else if (window.kendo && window.kendo.jQuery && element.getAttribute(window.kendo.attr(\"role\"))) {\n\t var widget = window.kendo.widgetInstance(window.kendo.jQuery(element));\n\t if (widget && (widget.exportDOMVisual || widget.exportVisual)) {\n\t if (widget.exportDOMVisual) {\n\t visual = widget.exportDOMVisual();\n\t } else {\n\t visual = widget.exportVisual();\n\t }\n\t }\n\t }\n\n\t if (!visual) {\n\t return false;\n\t }\n\n\t var wrap$$1 = new Group();\n\t wrap$$1.children.push(visual);\n\n\t var bbox = element.getBoundingClientRect();\n\t wrap$$1.transform(transform$1().translate(bbox.left, bbox.top));\n\n\t group.append(wrap$$1);\n\n\t return true;\n\t}\n\n\tfunction renderImage(element, url, group) {\n\t var box = getContentBox(element);\n\t var rect = new Rect([ box.left, box.top ], [ box.width, box.height ]);\n\t var image = new Image$1(url, rect);\n\t setClipping(image, elementRoundBox(element, box, \"content\"));\n\t group.append(image);\n\t}\n\n\tfunction zIndexSort(a, b) {\n\t var sa = getComputedStyle$1(a);\n\t var sb = getComputedStyle$1(b);\n\t var za = parseFloat(getPropertyValue(sa, \"z-index\"));\n\t var zb = parseFloat(getPropertyValue(sb, \"z-index\"));\n\t var pa = getPropertyValue(sa, \"position\");\n\t var pb = getPropertyValue(sb, \"position\");\n\t if (isNaN(za) && isNaN(zb)) {\n\t if ((/static|absolute/.test(pa)) && (/static|absolute/.test(pb))) {\n\t return 0;\n\t }\n\t if (pa == \"static\") {\n\t return -1;\n\t }\n\t if (pb == \"static\") {\n\t return 1;\n\t }\n\t return 0;\n\t }\n\t if (isNaN(za)) {\n\t return zb === 0 ? 0 : zb > 0 ? -1 : 1;\n\t }\n\t if (isNaN(zb)) {\n\t return za === 0 ? 0 : za > 0 ? 1 : -1;\n\t }\n\t return parseFloat(za) - parseFloat(zb);\n\t}\n\n\tfunction isFormField(element) {\n\t return /^(?:textarea|select|input)$/i.test(element.tagName);\n\t}\n\n\tfunction getSelectedOption(element) {\n\t if (element.selectedOptions && element.selectedOptions.length > 0) {\n\t return element.selectedOptions[0];\n\t }\n\t return element.options[element.selectedIndex];\n\t}\n\n\tfunction renderCheckbox(element, group) {\n\t var style = getComputedStyle$1(element);\n\t var color = getPropertyValue(style, \"color\");\n\t var box = element.getBoundingClientRect();\n\t if (element.type == \"checkbox\") {\n\t group.append(\n\t Path.fromRect(\n\t new Rect([ box.left+1, box.top+1 ],\n\t [ box.width-2, box.height-2 ])\n\t ).stroke(color, 1)\n\t );\n\t if (element.checked) {\n\t // fill a rectangle inside? looks kinda ugly.\n\t // group.append(\n\t // Path.fromRect(\n\t // new geo.Rect([ box.left+4, box.top+4 ],\n\t // [ box.width-8, box.height-8])\n\t // ).fill(color).stroke(null)\n\t // );\n\n\t // let's draw a checkmark instead. artistic, eh?\n\t group.append(\n\t new Path()\n\t .stroke(color, 1.2)\n\t .moveTo(box.left + 0.22 * box.width,\n\t box.top + 0.55 * box.height)\n\t .lineTo(box.left + 0.45 * box.width,\n\t box.top + 0.75 * box.height)\n\t .lineTo(box.left + 0.78 * box.width,\n\t box.top + 0.22 * box.width)\n\t );\n\t }\n\t } else {\n\t group.append(\n\t new Circle(\n\t new Circle$2([\n\t (box.left + box.right) / 2,\n\t (box.top + box.bottom) / 2\n\t ], Math.min(box.width-2, box.height-2) / 2)\n\t ).stroke(color, 1)\n\t );\n\t if (element.checked) {\n\t group.append(\n\t new Circle(\n\t new Circle$2([\n\t (box.left + box.right) / 2,\n\t (box.top + box.bottom) / 2\n\t ], Math.min(box.width-8, box.height-8) / 2)\n\t ).fill(color).stroke(null)\n\t );\n\t }\n\t }\n\t}\n\n\tfunction renderFormField(element, group) {\n\t var tag = element.tagName.toLowerCase();\n\t if (tag == \"input\" && (element.type == \"checkbox\" || element.type == \"radio\")) {\n\t return renderCheckbox(element, group);\n\t }\n\t var p = element.parentNode;\n\t var doc = element.ownerDocument;\n\t var el = doc.createElement(KENDO_PSEUDO_ELEMENT);\n\t var option;\n\t el.style.cssText = getCssText(getComputedStyle$1(element));\n\t if (tag == \"input\") {\n\t el.style.whiteSpace = \"pre\";\n\t }\n\t if (tag == \"select\" || tag == \"textarea\") {\n\t el.style.overflow = \"auto\";\n\t }\n\t if (tag == \"select\") {\n\t if (element.multiple) {\n\t for (var i = 0; i < element.options.length; ++i) {\n\t option = doc.createElement(KENDO_PSEUDO_ELEMENT);\n\t option.style.cssText = getCssText(getComputedStyle$1(element.options[i]));\n\t option.style.display = \"block\"; // IE9 messes up without this\n\t option.textContent = element.options[i].textContent;\n\t el.appendChild(option);\n\t }\n\t } else {\n\t option = getSelectedOption(element);\n\t if (option) {\n\t el.textContent = option.textContent;\n\t }\n\t }\n\t } else {\n\t el.textContent = element.value;\n\t }\n\t p.insertBefore(el, element);\n\t el.scrollLeft = element.scrollLeft;\n\t el.scrollTop = element.scrollTop;\n\n\t // must temporarily hide the original element, otherwise it\n\t // may affect layout of the fake element we want to render.\n\t element.style.display = \"none\";\n\n\t renderContents(el, group);\n\t element.style.display = \"\";\n\t p.removeChild(el);\n\t}\n\n\tfunction renderContents(element, group) {\n\t if (nodeInfo._stackingContext.element === element) {\n\t // the group that was set in pushNodeInfo might have\n\t // changed due to clipping/transforms, update it here.\n\t nodeInfo._stackingContext.group = group;\n\t }\n\t switch (element.tagName.toLowerCase()) {\n\t case \"img\":\n\t renderImage(element, element.src, group);\n\t break;\n\n\t case \"svg\":\n\t var xml = new window.XMLSerializer().serializeToString(element);\n\t var dataURL = \"data:image/svg+xml;base64,\" + (encodeBase64(xml));\n\t renderImage(element, dataURL, group);\n\t break;\n\n\t case \"canvas\":\n\t try {\n\t renderImage(element, element.toDataURL(\"image/png\"), group);\n\t } catch (ex) {\n\t // tainted; can't draw it, ignore.\n\t }\n\t break;\n\n\t case \"textarea\":\n\t case \"input\":\n\t case \"select\":\n\t renderFormField(element, group);\n\t break;\n\n\t default:\n\t var children = [], floats = [], positioned = [];\n\t for (var i = element.firstChild; i; i = i.nextSibling) {\n\t switch (i.nodeType) {\n\t case 3: // Text\n\t if (/\\S/.test(i.data)) {\n\t renderText(element, i, group);\n\t }\n\t break;\n\t case 1: // Element\n\t var style = getComputedStyle$1(i);\n\t var floating = getPropertyValue(style, \"float\");\n\t var position = getPropertyValue(style, \"position\");\n\t if (position != \"static\") {\n\t positioned.push(i);\n\t }\n\t else if (floating != \"none\") {\n\t floats.push(i);\n\t } else {\n\t children.push(i);\n\t }\n\t break;\n\t }\n\t }\n\n\t mergeSort(children, zIndexSort).forEach(function(el){ renderElement(el, group); });\n\t mergeSort(floats, zIndexSort).forEach(function(el){ renderElement(el, group); });\n\t mergeSort(positioned, zIndexSort).forEach(function(el){ renderElement(el, group); });\n\t }\n\t}\n\n\tfunction renderText(element, node, group) {\n\t if (emptyClipbox()) {\n\t return;\n\t }\n\t var style = getComputedStyle$1(element);\n\n\t if (parseFloat(getPropertyValue(style, \"text-indent\")) < -500) {\n\t // assume it should not be displayed. the slider's\n\t // draggable handle displays a Drag text for some reason,\n\t // having text-indent: -3333px.\n\t return;\n\t }\n\n\t var text = node.data;\n\t var start = 0;\n\t var end = text.search(/\\S\\s*$/) + 1;\n\n\t if (!end) {\n\t return; // whitespace-only node\n\t }\n\n\t var fontSize = getPropertyValue(style, \"font-size\");\n\t var lineHeight = getPropertyValue(style, \"line-height\");\n\n\t // simply getPropertyValue(\"font\") doesn't work in Firefox :-\\\n\t var font = [\n\t getPropertyValue(style, \"font-style\"),\n\t getPropertyValue(style, \"font-variant\"),\n\t getPropertyValue(style, \"font-weight\"),\n\t fontSize, // no need for line height here; it breaks layout in FF\n\t getPropertyValue(style, \"font-family\")\n\t ].join(\" \");\n\n\t fontSize = parseFloat(fontSize);\n\t lineHeight = parseFloat(lineHeight);\n\n\t if (fontSize === 0) {\n\t return;\n\t }\n\n\t var color = getPropertyValue(style, \"color\");\n\t var range = element.ownerDocument.createRange();\n\t var align$$1 = getPropertyValue(style, \"text-align\");\n\t var isJustified = align$$1 == \"justify\";\n\t var columnCount = getPropertyValue(style, \"column-count\", 1);\n\t var whiteSpace = getPropertyValue(style, \"white-space\");\n\t var textTransform = getPropertyValue(style, \"text-transform\");\n\n\t // A line of 500px, with a font of 12px, contains an average of 80 characters, but since we\n\t // err, we'd like to guess a bigger number rather than a smaller one. Multiplying by 5\n\t // seems to be a good option.\n\t var estimateLineLength = element.getBoundingClientRect().width / fontSize * 5;\n\t if (estimateLineLength === 0) {\n\t estimateLineLength = 500;\n\t }\n\n\t // we'll maintain this so we can workaround bugs in Chrome's Range.getClientRects\n\t // https://github.com/telerik/kendo/issues/5740\n\t var prevLineBottom = null;\n\n\t var underline = nodeInfo[\"underline\"];\n\t var lineThrough = nodeInfo[\"line-through\"];\n\t var overline = nodeInfo[\"overline\"];\n\t var hasDecoration = underline || lineThrough || overline;\n\n\t // doChunk returns true when all text has been rendered\n\t while (!doChunk()) {}\n\n\t if (hasDecoration) {\n\t range.selectNode(node);\n\t slice$1$1(range.getClientRects()).forEach(decorate);\n\t }\n\n\t return; // only function declarations after this line\n\n\t function actuallyGetRangeBoundingRect(range) {\n\t // XXX: to be revised when this Chrome bug is fixed:\n\t // https://bugs.chromium.org/p/chromium/issues/detail?id=612459\n\t if (microsoft || browser.chrome) {\n\t // Workaround browser bugs: IE and Chrome would sometimes\n\t // return 0 or 1-width rectangles before or after the main\n\t // one. https://github.com/telerik/kendo/issues/4674\n\n\t // Actually Chrome 50 got worse, since the rectangles can now have the width of a\n\t // full character, making it hard to tell whether it's a bogus rectangle or valid\n\t // selection location. The workaround is to ignore rectangles that fall on the\n\t // previous line. https://github.com/telerik/kendo/issues/5740\n\t var rectangles = range.getClientRects(), box = {\n\t top : Infinity,\n\t right : -Infinity,\n\t bottom : -Infinity,\n\t left : Infinity\n\t }, done = false;\n\t for (var i = 0; i < rectangles.length; ++i) {\n\t var b = rectangles[i];\n\t if (b.width <= 1 || b.bottom === prevLineBottom) {\n\t continue; // bogus rectangle\n\t }\n\t box.left = Math.min(b.left , box.left);\n\t box.top = Math.min(b.top , box.top);\n\t box.right = Math.max(b.right , box.right);\n\t box.bottom = Math.max(b.bottom , box.bottom);\n\t done = true;\n\t }\n\t if (!done) {\n\t return range.getBoundingClientRect();\n\t }\n\t box.width = box.right - box.left;\n\t box.height = box.bottom - box.top;\n\t return box;\n\t }\n\t return range.getBoundingClientRect();\n\t }\n\n\t // Render a chunk of text, typically one line (but for justified text we render each word as\n\t // a separate Text object, because spacing is variable). Returns true when it finished the\n\t // current node. After each chunk it updates `start` to just after the last rendered\n\t // character.\n\t function doChunk() {\n\t var origStart = start;\n\t var box, pos = text.substr(start).search(/\\S/);\n\t start += pos;\n\t if (pos < 0 || start >= end) {\n\t return true;\n\t }\n\n\t // Select a single character to determine the height of a line of text. The box.bottom\n\t // will be essential for us to figure out where the next line begins.\n\t range.setStart(node, start);\n\t range.setEnd(node, start + 1);\n\t box = actuallyGetRangeBoundingRect(range);\n\n\t // for justified text we must split at each space, because space has variable width.\n\t var found = false;\n\t if (isJustified || columnCount > 1) {\n\t pos = text.substr(start).search(/\\s/);\n\t if (pos >= 0) {\n\t // we can only split there if it's on the same line, otherwise we'll fall back\n\t // to the default mechanism (see findEOL below).\n\t range.setEnd(node, start + pos);\n\t var r = actuallyGetRangeBoundingRect(range);\n\t if (r.bottom == box.bottom) {\n\t box = r;\n\t found = true;\n\t start += pos;\n\t }\n\t }\n\t }\n\n\t if (!found) {\n\t // This code does three things: (1) it selects one line of text in `range`, (2) it\n\t // leaves the bounding rect of that line in `box` and (3) it returns the position\n\t // just after the EOL. We know where the line starts (`start`) but we don't know\n\t // where it ends. To figure this out, we select a piece of text and look at the\n\t // bottom of the bounding box. If it changes, we have more than one line selected\n\t // and should retry with a smaller selection.\n\t //\n\t // To speed things up, we first try to select all text in the node (`start` ->\n\t // `end`). If there's more than one line there, then select only half of it. And\n\t // so on. When we find a value for `end` that fits in one line, we try increasing\n\t // it (also in halves) until we get to the next line. The algorithm stops when the\n\t // right side of the bounding box does not change.\n\t //\n\t // One more thing to note is that everything happens in a single Text DOM node.\n\t // There's no other tags inside it, therefore the left/top coordinates of the\n\t // bounding box will not change.\n\t pos = (function findEOL(min, eol, max){\n\t range.setEnd(node, eol);\n\t var r = actuallyGetRangeBoundingRect(range);\n\t if (r.bottom != box.bottom && min < eol) {\n\t return findEOL(min, (min + eol) >> 1, eol);\n\t } else if (r.right != box.right) {\n\t box = r;\n\t if (eol < max) {\n\t return findEOL(eol, (eol + max) >> 1, max);\n\t } else {\n\t return eol;\n\t }\n\t } else {\n\t return eol;\n\t }\n\t })(start, Math.min(end, start + estimateLineLength), end);\n\n\t if (pos == start) {\n\t // if EOL is at the start, then no more text fits on this line. Skip the\n\t // remainder of this node entirely to avoid a stack overflow.\n\t return true;\n\t }\n\t start = pos;\n\n\t pos = range.toString().search(/\\s+$/);\n\t if (pos === 0) {\n\t return false; // whitespace only; we should not get here.\n\t }\n\t if (pos > 0) {\n\t // eliminate trailing whitespace\n\t range.setEnd(node, range.startOffset + pos);\n\t box = actuallyGetRangeBoundingRect(range);\n\t }\n\t }\n\n\t // another workaround for IE: if we rely on getBoundingClientRect() we'll overlap with the bullet for LI\n\t // elements. Calling getClientRects() and using the *first* rect appears to give us the correct location.\n\t // Note: not to be used in Chrome as it randomly returns a zero-width rectangle from the previous line.\n\t if (microsoft) {\n\t box = range.getClientRects()[0];\n\t }\n\n\t var str = range.toString();\n\t if (!/^(?:pre|pre-wrap)$/i.test(whiteSpace)) {\n\t // node with non-significant space -- collapse whitespace.\n\t str = str.replace(/\\s+/g, \" \");\n\t }\n\t else if (/\\t/.test(str)) {\n\t // with significant whitespace we need to do something about literal TAB characters.\n\t // There's no TAB glyph in a font so they would be rendered in PDF as an empty box,\n\t // and the whole text will stretch to fill the original width. The core PDF lib\n\t // does not have sufficient context to deal with it.\n\n\t // calculate the starting column here, since we initially discarded any whitespace.\n\t var cc = 0;\n\t for (pos = origStart; pos < range.startOffset; ++pos) {\n\t var code = text.charCodeAt(pos);\n\t if (code == 9) {\n\t // when we meet a TAB we must round up to the next tab stop.\n\t // in all browsers TABs seem to be 8 characters.\n\t cc += 8 - cc % 8;\n\t } else if (code == 10 || code == 13) {\n\t // just in case we meet a newline we must restart.\n\t cc = 0;\n\t } else {\n\t // ordinary character --> advance one column\n\t cc++;\n\t }\n\t }\n\n\t // based on starting column, replace any TAB characters in the string we actually\n\t // have to display with spaces so that they align to columns multiple of 8.\n\t while ((pos = str.search(\"\\t\")) >= 0) {\n\t var indent = \" \".substr(0, 8 - (cc + pos) % 8);\n\t str = str.substr(0, pos) + indent + str.substr(pos + 1);\n\t }\n\t }\n\n\t if (!found) {\n\t prevLineBottom = box.bottom;\n\t }\n\t drawText(str, box);\n\t }\n\n\t function drawText(str, box) {\n\t // In IE the box height will be approximately lineHeight, while in\n\t // other browsers it'll (correctly) be the height of the bounding\n\t // box for the current text/font. Which is to say, IE sucks again.\n\t // The only good solution I can think of is to measure the text\n\t // ourselves and center the bounding box.\n\t if (microsoft && !isNaN(lineHeight)) {\n\t var height = getFontHeight(font);\n\t var top = (box.top + box.bottom - height) / 2;\n\t box = {\n\t top : top,\n\t right : box.right,\n\t bottom : top + height,\n\t left : box.left,\n\t height : height,\n\t width : box.right - box.left\n\t };\n\t }\n\n\t // var path = new Path({ stroke: { color: \"red\" }});\n\t // path.moveTo(box.left, box.top)\n\t // .lineTo(box.right, box.top)\n\t // .lineTo(box.right, box.bottom)\n\t // .lineTo(box.left, box.bottom)\n\t // .close();\n\t // group.append(path);\n\n\t switch (textTransform) {\n\t case \"uppercase\":\n\t str = str.toUpperCase();\n\t break;\n\t case \"lowercase\":\n\t str = str.toLowerCase();\n\t break;\n\t case \"capitalize\":\n\t str = str.replace(/(?:^|\\s)\\S/g, function (l) { return l.toUpperCase(); });\n\t break;\n\t }\n\n\t var text = new TextRect(\n\t str, new Rect([ box.left, box.top ],\n\t [ box.width, box.height ]),\n\t {\n\t font: font,\n\t fill: { color: color }\n\t }\n\t );\n\t group.append(text);\n\t }\n\n\t function decorate(box) {\n\t line(underline, box.bottom);\n\t line(lineThrough, box.bottom - box.height / 2.7);\n\t line(overline, box.top);\n\t function line(color, ypos) {\n\t if (color) {\n\t var width = fontSize / 12;\n\t var path = new Path({ stroke: {\n\t width: width,\n\t color: color\n\t }});\n\n\t ypos -= width;\n\t path.moveTo(box.left, ypos)\n\t .lineTo(box.right, ypos);\n\t group.append(path);\n\t }\n\t }\n\t }\n\t}\n\n\tfunction groupInStackingContext(element, group, zIndex) {\n\t var main;\n\t if (zIndex != \"auto\") {\n\t // use the current stacking context\n\t main = nodeInfo._stackingContext.group;\n\t zIndex = parseFloat(zIndex);\n\t } else {\n\t // normal flow — use given container. we still have to\n\t // figure out where should we insert this element with the\n\t // assumption that its z-index is zero, as the group might\n\t // already contain elements with higher z-index.\n\t main = group;\n\t zIndex = 0;\n\t }\n\t var a = main.children;\n\t for (var i = 0; i < a.length; ++i) {\n\t if (a[i]._dom_zIndex != null && a[i]._dom_zIndex > zIndex) {\n\t break;\n\t }\n\t }\n\n\t var tmp = new Group();\n\t main.insert(i, tmp);\n\t tmp._dom_zIndex = zIndex;\n\n\t if (main !== group) {\n\t // console.log(\"Placing\", element, \"in\", nodeInfo._stackingContext.element, \"at position\", i, \" / \", a.length);\n\t // console.log(a.slice(i+1));\n\n\t // if (nodeInfo._matrix) {\n\t // tmp.transform(nodeInfo._matrix);\n\t // }\n\t if (nodeInfo._clipbox) {\n\t var m = nodeInfo._matrix.invert();\n\t var r = nodeInfo._clipbox.transformCopy(m);\n\t setClipping(tmp, Path.fromRect(r));\n\t // console.log(r);\n\t // tmp.append(Path.fromRect(r));\n\t // tmp.append(new Text(element.className || element.id, r.topLeft()));\n\t }\n\t }\n\n\t return tmp;\n\t}\n\n\tfunction renderElement(element, container) {\n\t var style = getComputedStyle$1(element);\n\n\t updateCounters(style);\n\n\t if (/^(style|script|link|meta|iframe|col|colgroup)$/i.test(element.tagName)) {\n\t return;\n\t }\n\n\t if (nodeInfo._clipbox == null) {\n\t return;\n\t }\n\n\t var opacity = parseFloat(getPropertyValue(style, \"opacity\"));\n\t var visibility = getPropertyValue(style, \"visibility\");\n\t var display = getPropertyValue(style, \"display\");\n\n\t if (opacity === 0 || visibility == \"hidden\" || display == \"none\") {\n\t return;\n\t }\n\n\t var tr = getTransform(style);\n\t var group;\n\n\t var zIndex = getPropertyValue(style, \"z-index\");\n\t if ((tr || opacity < 1) && zIndex == \"auto\") {\n\t zIndex = 0;\n\t }\n\t group = groupInStackingContext(element, container, zIndex);\n\n\t // XXX: remove at some point\n\t // group._pdfElement = element;\n\t // group.options._pdfDebug = \"\";\n\t // if (element.id) {\n\t // group.options._pdfDebug = \"#\" + element.id;\n\t // }\n\t // if (element.className) {\n\t // group.options._pdfDebug += \".\" + element.className.split(\" \").join(\".\");\n\t // }\n\n\t if (opacity < 1) {\n\t group.opacity(opacity * group.opacity());\n\t }\n\n\t pushNodeInfo(element, style, group);\n\n\t if (!tr) {\n\t _renderWithPseudoElements(element, group);\n\t }\n\t else {\n\t saveStyle(element, function(){\n\t // must clear transform, so getBoundingClientRect returns correct values.\n\t pleaseSetPropertyValue(element.style, \"transform\", \"none\", \"important\");\n\n\t // must also clear transitions, so correct values are returned *immediately*\n\t pleaseSetPropertyValue(element.style, \"transition\", \"none\", \"important\");\n\n\t // the presence of any transform makes it behave like it had position: relative,\n\t // because why not.\n\t // http://meyerweb.com/eric/thoughts/2011/09/12/un-fixing-fixed-elements-with-css-transforms/\n\t if (getPropertyValue(style, \"position\") == \"static\") {\n\t // but only if it's not already positioned. :-/\n\t pleaseSetPropertyValue(element.style, \"position\", \"relative\", \"important\");\n\t }\n\n\t // must translate to origin before applying the CSS\n\t // transformation, then translate back.\n\t var bbox = element.getBoundingClientRect();\n\t var x = bbox.left + tr.origin[0];\n\t var y = bbox.top + tr.origin[1];\n\t var m = [ 1, 0, 0, 1, -x, -y ];\n\t m = mmul(m, tr.matrix);\n\t m = mmul(m, [ 1, 0, 0, 1, x, y ]);\n\t m = setTransform$1(group, m);\n\n\t nodeInfo._matrix = nodeInfo._matrix.multiplyCopy(m);\n\n\t _renderWithPseudoElements(element, group);\n\t });\n\t }\n\n\t popNodeInfo();\n\n\t //drawDebugBox(element.getBoundingClientRect(), container);\n\t}\n\n\t// function drawDebugBox(box, group, color) {\n\t// var path = Path.fromRect(new geo.Rect([ box.left, box.top ], [ box.width, box.height ]));\n\t// if (color) {\n\t// path.stroke(color);\n\t// }\n\t// group.append(path);\n\t// }\n\n\t// function dumpTextNode(node) {\n\t// var txt = node.data.replace(/^\\s+/, \"\");\n\t// if (txt.length < 100) {\n\t// console.log(node.data.length + \": |\" + txt);\n\t// } else {\n\t// console.log(node.data.length + \": |\" + txt.substr(0, 50) + \"|...|\" + txt.substr(-50));\n\t// }\n\t// }\n\n\tfunction mmul(a, b) {\n\t var a1 = a[0], b1 = a[1], c1 = a[2], d1 = a[3], e1 = a[4], f1 = a[5];\n\t var a2 = b[0], b2 = b[1], c2 = b[2], d2 = b[3], e2 = b[4], f2 = b[5];\n\t return [\n\t a1*a2 + b1*c2, a1*b2 + b1*d2,\n\t c1*a2 + d1*c2, c1*b2 + d1*d2,\n\t e1*a2 + f1*c2 + e2, e1*b2 + f1*d2 + f2\n\t ];\n\t}\n\n\tvar drawing = {\n\t\tsvg: svg$1,\n\t\tcanvas: canvas,\n\t\tutil: util,\n\t\tHasObservers: HasObservers,\n\t\tPathParser: PathParser,\n\t\tparsePath: parsePath,\n\t\tBaseNode: BaseNode,\n\t\tOptionsStore: OptionsStore,\n\t\tSurface: Surface,\n\t\tSurfaceFactory: SurfaceFactory,\n\t\texportImage: exportImage,\n\t\texportSVG: exportSVG,\n\t\tQuadNode: QuadNode,\n\t\tShapesQuadTree: ShapesQuadTree,\n\t\tElement: Element$1,\n\t\tCircle: Circle,\n\t\tArc: Arc,\n\t\tPath: Path,\n\t\tMultiPath: MultiPath,\n\t\tText: Text,\n\t\tImage: Image$1,\n\t\tGroup: Group,\n\t\tLayout: Layout,\n\t\tRect: Rect$2,\n\t\talign: align,\n\t\tvAlign: vAlign,\n\t\tstack: stack,\n\t\tvStack: vStack,\n\t\twrap: wrap,\n\t\tvWrap: vWrap,\n\t\tfit: fit,\n\t\tLinearGradient: LinearGradient,\n\t\tRadialGradient: RadialGradient,\n\t\tGradientStop: GradientStop,\n\t\tGradient: Gradient,\n\t\tAnimation: Animation,\n\t\tAnimationFactory: AnimationFactory,\n\t\tdrawDOM: drawDOM,\n\t\tdrawText: drawText,\n\t\tgetFontFaces: getFontFaces\n\t};\n\n\tkendo.deepExtend(kendo, {\n\t drawing: drawing,\n\t geometry: geometry\n\t});\n\n\tkendo.drawing.Segment = kendo.geometry.Segment;\n\tkendo.dataviz.drawing = kendo.drawing;\n\tkendo.dataviz.geometry = kendo.geometry;\n\tkendo.drawing.util.measureText = kendo.util.measureText;\n\tkendo.drawing.util.objectKey = kendo.util.objectKey;\n\tkendo.drawing.Color = kendo.Color;\n\tkendo.util.encodeBase64 = kendo.drawing.util.encodeBase64;\n\n\t})(window.kendo.jQuery);\n\n\t}, __webpack_require__(3));\n\n/***/ }),\n\n/***/ 955:\n/***/ (function(module, exports) {\n\n\tmodule.exports = require(\"./util\");\n\n/***/ }),\n\n/***/ 956:\n/***/ (function(module, exports) {\n\n\tmodule.exports = require(\"../kendo.color\");\n\n/***/ }),\n\n/***/ 957:\n/***/ (function(module, exports) {\n\n\tmodule.exports = require(\"../util/text-metrics\");\n\n/***/ })\n\n/******/ });"],"sourceRoot":""}