{"version":3,"sources":["jsdelivr-header.js","/npm/playful-avatars@1.0.0/index.js"],"names":[],"mappings":"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","file":"/npm/playful-avatars@1.0.0/index.js","sourceRoot":"","sourcesContent":["/**\n * Minified by jsDelivr using Terser v5.39.0.\n * Original file: /npm/playful-avatars@1.0.0/index.js\n *\n * Do NOT use SRI with dynamically generated files! More information: https://www.jsdelivr.com/using-sri-with-dynamic-files\n */\n","/*\n *********** UTILS ***********\n */\nconst hashCode = (name) => {\n\tlet hash = 0;\n\tfor (let i = 0; i < name.length; i++) {\n\t\tlet character = name.charCodeAt(i);\n\t\thash = ((hash << 5) - hash) + character;\n\t\thash = hash & hash; // Convert to 32bit integer\n\t}\n\treturn Math.abs(hash);\n};\n\nconst getDigit = (number, index) => {\n\tconst d = Math.floor((number / Math.pow(10, index)) % 10);\n\treturn d;\n};\n\nconst getBoolean = (number, index) => {\n\treturn (!((getDigit(number, index)) % 2));\n};\n\nconst getUnit = (number, range, index) => {\n\tconst value = number % range;\n\n\tif (index && ((getDigit(number, index) % 2) === 0)) {\n\t\treturn -value;\n\t}\n\treturn value;\n};\n\nconst getRandomColor = (number, colors, range) => {\n\treturn colors[(number) % range];\n};\n\nconst getContrastColor = (hexcolor) => {\n\thexcolor = hexcolor.replace('#', '');\n\n\t// Convert to RGB value\n\tconst r = parseInt(hexcolor.substr(0, 2), 16);\n\tconst g = parseInt(hexcolor.substr(2, 2), 16);\n\tconst b = parseInt(hexcolor.substr(4, 2), 16);\n\n\t// Get YIQ ratio\n\tconst yiq = ((r * 299) + (g * 587) + (b * 114)) / 1000;\n\n\t// Check contrast\n\treturn (yiq >= 128) ? '#000000' : '#FFFFFF';\n};\n\nconst sanitizeColors = (colors) => {\n\tif (Array.isArray(colors)) {\n\t\treturn colors.map(color => '#' + color.replace(/[^0-9A-Fa-f]/g, ''));\n\t}\n\telse if (typeof colors === 'string') {\n\t\treturn sanitizeColors(colors.split(','));\n\t}\n\treturn [];\n};\n\n/*\n *********** BEAM ***********\n */\nfunction generateBeamData(name, colors, size) {\n\tconst numFromName = hashCode(name);\n\tconst range = colors && colors.length;\n\tconst wrapperColor = getRandomColor(numFromName, colors, range);\n\tconst preTranslateX = getUnit(numFromName, 10, 1);\n\tconst wrapperTranslateX = preTranslateX < 5 ? preTranslateX + size / 9 : preTranslateX;\n\tconst preTranslateY = getUnit(numFromName, 10, 2);\n\tconst wrapperTranslateY = preTranslateY < 5 ? preTranslateY + size / 9 : preTranslateY;\n\n\tconst data = {\n\t\twrapperColor: wrapperColor,\n\t\tfaceColor: getContrastColor(wrapperColor),\n\t\tbackgroundColor: getRandomColor(numFromName + 13, colors, range),\n\t\twrapperTranslateX: wrapperTranslateX,\n\t\twrapperTranslateY: wrapperTranslateY,\n\t\twrapperRotate: getUnit(numFromName, 360),\n\t\twrapperScale: 1 + getUnit(numFromName, size / 12) / 10,\n\t\tisMouthOpen: getBoolean(numFromName, 2),\n\t\tisCircle: getBoolean(numFromName, 1),\n\t\teyeSpread: getUnit(numFromName, 5),\n\t\tmouthSpread: getUnit(numFromName, 3),\n\t\tfaceRotate: getUnit(numFromName, 10, 3),\n\t\tfaceTranslateX: wrapperTranslateX > size / 6 ? wrapperTranslateX / 2 : getUnit(numFromName, 8, 1),\n\t\tfaceTranslateY: wrapperTranslateY > size / 6 ? wrapperTranslateY / 2 : getUnit(numFromName, 7, 2),\n\t};\n\n\treturn data;\n}\n\nfunction generateBeamSVG(name, colors, useTitle) {\n\tconst size = 36; // viewBox\n\tconst data = generateBeamData(name, colors, size);\n\treturn `<svg part=\"svg\" viewBox=\"0 0 ${size} ${size}\" fill=\"none\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" width=\"${size}\" height=\"${size}\">\n\t\t${useTitle ? `<title>${name}</title>` : ''}\n\t\t<g>\n\t\t\t<rect width=\"${size}\" height=\"${size}\" fill=\"${data.backgroundColor}\" />\n\t\t\t<rect x=\"0\" y=\"0\" width=\"${size}\" height=\"${size}\" transform=\"translate(${data.wrapperTranslateX} ${data.wrapperTranslateY}) rotate(${data.wrapperRotate} ${size / 2} ${size / 2}) scale(${data.wrapperScale})\" fill=\"${data.wrapperColor}\" rx=\"${data.isCircle ? size : size / 6}\" />\n\t\t\t<g transform=\"translate(${data.faceTranslateX} ${data.faceTranslateY}) rotate(${data.faceRotate} ${size / 2} ${size / 2})\">\n\t\t\t\t${data.isMouthOpen\n\t\t\t\t? `<path d=\"M15 ${19 + data.mouthSpread}c2 1 4 1 6 0\" stroke=\"${data.faceColor}\" fill=\"none\" strokeLinecap=\"round\" />`\n\t\t\t\t: `<path d=\"M13,${19 + data.mouthSpread} a1,0.75 0 0,0 10,0\" fill=\"${data.faceColor}\" />`\n\t\t\t\t}\n\t\t\t\t<rect x=\"${14 - data.eyeSpread}\" y=\"14\" width=\"1.5\" height=\"2\" rx=\"1\" stroke=\"none\" fill=\"${data.faceColor}\" />\n\t\t\t\t<rect x=\"${20 + data.eyeSpread}\" y=\"14\" width=\"1.5\" height=\"2\" rx=\"1\" stroke=\"none\" fill=\"${data.faceColor}\" />\n\t\t\t</g>\n\t\t</g>\n\t</svg>`;\n}\n\n/*\n *********** MARBLE ***********\n */\nfunction generateMarbleData(name, colors, elements, size) {\n\tconst numFromName = hashCode(name);\n\tconst range = colors && colors.length;\n\n\tconst elementsProperties = Array.from({ length: elements }, (_, i) => ({\n\t\tcolor: getRandomColor(numFromName + i, colors, range),\n\t\ttranslateX: getUnit(numFromName * (i + 1), size / 10, 1),\n\t\ttranslateY: getUnit(numFromName * (i + 1), size / 10, 2),\n\t\tscale: 1.2 + getUnit(numFromName * (i + 1), size / 20) / 10,\n\t\trotate: getUnit(numFromName * (i + 1), 360, 1),\n\t}));\n\n\treturn elementsProperties;\n}\n\nfunction generateMarbleSVG(name, colors, useTitle) {\n\tconst size = 80; // viewBox\n\tconst filterID = `r${hashCode(name)}`;\n\tconst data = generateMarbleData(name, colors, 3, size);\n\treturn `<svg part=\"svg\" viewBox=\"0 0 ${size} ${size}\" fill=\"none\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" width=\"${size}\" height=\"${size}\">\n\t\t${useTitle ? `<title>${name}</title>` : ''}\n\t\t<g>\n\t\t\t<rect width=\"${size}\" height=\"${size}\" fill=\"${data[0].color}\" />\n\t\t\t<path\n\t\t\t\tfilter=\"url(#filter_${filterID})\"\n\t\t\t\td=\"M32.414 59.35L50.376 70.5H72.5v-71H33.728L26.5 13.381l19.057 27.08L32.414 59.35z\"\n\t\t\t\tfill=\"${data[1].color}\"\n\t\t\t\ttransform=\"translate(${data[1].translateX} ${data[1].translateY}) rotate(${data[1].rotate} ${size / 2} ${size / 2}) scale(${data[2].scale})\"\n\t\t\t/>\n\t\t\t<path\n\t\t\t\tfilter=\"url(#filter_${filterID})\"\n\t\t\t\tstyle=\"mix-blend-mode: overlay\"\n\t\t\t\td=\"M22.216 24L0 46.75l14.108 38.129L78 86l-3.081-59.276-22.378 4.005 12.972 20.186-23.35 27.395L22.215 24z\"\n\t\t\t\tfill=\"${data[2].color}\"\n\t\t\t\ttransform=\"translate(${data[2].translateX} ${data[2].translateY}) rotate(${data[2].rotate} ${size / 2} ${size / 2}) scale(${data[2].scale})\"\n\t\t\t/>\n\t\t</g>\n\t\t<defs>\n\t\t\t<filter id=\"filter_${filterID}\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\n\t\t\t\t<feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\n\t\t\t\t<feBlend in=\"SourceGraphic\" in2=\"BackgroundImageFix\" result=\"shape\" />\n\t\t\t\t<feGaussianBlur stdDeviation=\"7\" result=\"effect1_foregroundBlur\" />\n\t\t\t</filter>\n\t\t</defs>\n\t</svg>`;\n}\n\n/*\n *********** PIXEL ***********\n */\nfunction generatePixelData(name, colors, elements) {\n\tconst numFromName = hashCode(name);\n\tconst range = colors && colors.length;\n\n\tconst colorList = Array.from({ length: elements }, (_, i) =>\n\t\tgetRandomColor(numFromName % (i + 1), colors, range),\n\t);\n\n\treturn colorList;\n}\n\nfunction generatePixelSVG(name, colors, useTitle) {\n\tconst size = 80;\n\tconst colorsList = generatePixelData(name, colors, 64, size);\n\tconst coordinates = [\n\t\t{ x: 0, y: 0 }, { x: 20, y: 0 }, { x: 40, y: 0 }, { x: 60, y: 0 }, { x: 10, y: 0 }, { x: 30, y: 0 }, { x: 50, y: 0 }, { x: 70, y: 0 },\n\t\t{ x: 0, y: 10 }, { x: 0, y: 20 }, { x: 0, y: 30 }, { x: 0, y: 40 }, { x: 0, y: 50 }, { x: 0, y: 60 }, { x: 0, y: 70 }, { x: 20, y: 10 },\n\t\t{ x: 20, y: 20 }, { x: 20, y: 30 }, { x: 20, y: 40 }, { x: 20, y: 50 }, { x: 20, y: 60 }, { x: 20, y: 70 }, { x: 40, y: 10 }, { x: 40, y: 20 },\n\t\t{ x: 40, y: 30 }, { x: 40, y: 40 }, { x: 40, y: 50 }, { x: 40, y: 60 }, { x: 40, y: 70 }, { x: 60, y: 10 }, { x: 60, y: 20 }, { x: 60, y: 30 },\n\t\t{ x: 60, y: 40 }, { x: 60, y: 50 }, { x: 60, y: 60 }, { x: 60, y: 70 }, { x: 10, y: 10 }, { x: 10, y: 20 }, { x: 10, y: 30 }, { x: 10, y: 40 },\n\t\t{ x: 10, y: 50 }, { x: 10, y: 60 }, { x: 10, y: 70 }, { x: 30, y: 10 }, { x: 30, y: 20 }, { x: 30, y: 30 }, { x: 30, y: 40 }, { x: 30, y: 50 },\n\t\t{ x: 30, y: 60 }, { x: 30, y: 70 }, { x: 50, y: 10 }, { x: 50, y: 20 }, { x: 50, y: 30 }, { x: 50, y: 40 }, { x: 50, y: 50 }, { x: 50, y: 60 },\n\t\t{ x: 50, y: 70 }, { x: 70, y: 10 }, { x: 70, y: 20 }, { x: 70, y: 30 }, { x: 70, y: 40 }, { x: 70, y: 50 }, { x: 70, y: 60 }, { x: 70, y: 70 }\n\t];\n\treturn `<svg part=\"svg\" viewBox=\"0 0 ${size} ${size}\" fill=\"none\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" width=\"${size}\" height=\"${size}\">\n\t\t${useTitle ? `<title>${name}</title>` : ''}\n\t\t<g>\n\t\t\t${coordinates.map((c, i) => `<rect x=\"${c.x}\" y=\"${c.y}\" width=\"10\" height=\"10\" fill=\"${colorsList[i]}\" />`).join('\\n')}\n\t\t</g>\n\t</svg>`;\n}\n\n/*\n *********** SUNSET ***********\n */\nfunction generateSunsetData(name, colors, elements) {\n\tconst numFromName = hashCode(name);\n\tconst range = colors && colors.length;\n\n\tconst colorsList = Array.from({ length: elements }, (_, i) =>\n\t\tgetRandomColor(numFromName + i, colors, range),\n\t);\n\n\treturn colorsList;\n}\n\nfunction generateSunsetSVG(name, colors, useTitle) {\n\tconst size = 80;\n\tconst colorsList = generateSunsetData(name, colors, 4, size);\n\tconst filterID = `r${hashCode(name)}`;\n\treturn `<svg part=\"svg\" viewBox=\"0 0 ${size} ${size}\" fill=\"none\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" width=\"${size}\" height=\"${size}\">\n\t\t${useTitle ? `<title>${name}</title>` : ''}\n\t\t<g>\n\t\t\t<path fill=\"url(#gradient_paint0_linear_${filterID})\" d=\"M0 0h80v40H0z\" />\n\t\t\t<path fill=\"url(#gradient_paint1_linear_${filterID})\" d=\"M0 40h80v40H0z\" />\n\t\t  </g>\n\t\t  <defs>\n\t\t\t<linearGradient id=\"gradient_paint0_linear_${filterID}\" x1=\"${size / 2}\" y1=\"0\" x2=\"${size / 2}\" y2=\"${size / 2}\" gradientUnits=\"userSpaceOnUse\">\n\t\t\t\t  <stop stop-color=\"${colorsList[0]}\" />\n\t\t\t\t  <stop offset=\"1\" stop-color=\"${colorsList[1]}\" />\n\t\t\t</linearGradient>\n\t\t\t<linearGradient id=\"gradient_paint1_linear_${filterID}\" x1=\"${size / 2}\" y1=\"${size / 2}\" x2=\"${size / 2}\" y2=\"${size}\" gradientUnits=\"userSpaceOnUse\">\n\t\t\t\t  <stop stop-color=\"${colorsList[2]}\" />\n\t\t\t\t  <stop offset=\"1\" stop-color=\"${colorsList[3]}\" />\n\t\t\t</linearGradient>\n\t\t  </defs>\n\t</svg>`;\n}\n\n/*\n *********** BAUSHAUS ***********\n */\nfunction generateBauhausData(name, colors, elements, size) {\n\tconst numFromName = hashCode(name);\n\tconst range = colors && colors.length;\n\n\tconst elementsProperties = Array.from({ length: elements }, (_, i) => ({\n\t\tcolor: getRandomColor(numFromName + i, colors, range),\n\t\ttranslateX: getUnit(numFromName * (i + 1), size / 2 - (i + 17), 1),\n\t\ttranslateY: getUnit(numFromName * (i + 1), size / 2 - (i + 17), 2),\n\t\trotate: getUnit(numFromName * (i + 1), 360),\n\t\tisSquare: getBoolean(numFromName, 2),\n\t}));\n\n\treturn elementsProperties;\n}\n\nfunction generateBauhausSVG(name, colors, useTitle) {\n\tconst size = 80;\n\tconst data = generateBauhausData(name, colors, 4, size);\n\treturn `<svg part=\"svg\" viewBox=\"0 0 ${size} ${size}\" fill=\"none\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" width=\"${size}\" height=\"${size}\">\n\t\t${useTitle ? `<title>${name}</title>` : ''}\n\t\t<rect width=\"${size}\" height=\"${size}\" fill=\"${data[0].color}\" />\n\t\t<rect\n\t\t\tx=\"${(size - 60) / 2}\"\n\t\t\ty=\"${(size - 20) / 2}\"\n\t\t\twidth=\"${size}\"\n\t\t\theight=\"${data[1].isSquare ? size : size / 8}\"\n\t\t\tfill=\"${data[1].color}\"\n\t\t\ttransform=\"translate(${data[1].translateX} ${data[1].translateY}) rotate(${data[1].rotate} ${size / 2} ${size / 2})\"\n\t\t/>\n\t\t<circle\n\t\t\tcx=\"${size / 2}\"\n\t\t\tcy=\"${size / 2}\"\n\t\t\tfill=\"${data[2].color}\"\n\t\t\tr=\"${size / 5}\"\n\t\t\ttransform=\"translate(${data[2].translateX} ${data[2].translateY})\"\n\t\t/>\n\t\t<line\n\t\t\tx1=\"0\"\n\t\t\ty1=\"${size / 2}\"\n\t\t\tx2=\"${size}\"\n\t\t\ty2=\"${size / 2}\"\n\t\t\tstroke-width=\"2\"\n\t\t\tstroke=\"${data[3].color}\"\n\t\t\ttransform=\"translate(${data[3].translateX} ${data[3].translateY}) rotate(${data[3].rotate} ${size / 2} ${size / 2})\"\n\t\t/>\n\t</svg>`;\n}\n\n/*\n *********** RING ***********\n */\nfunction generateRingData(name, colors, elements) {\n\tconst numFromName = hashCode(name);\n\tconst range = colors && colors.length;\n\tconst colorsShuffle = Array.from({ length: elements }, (_, i) =>\n\t\tgetRandomColor(numFromName + i, colors, range),\n\t);\n\tconst colorsList = [];\n\tcolorsList[0] = colorsShuffle[0];\n\tcolorsList[1] = colorsShuffle[1];\n\tcolorsList[2] = colorsShuffle[1];\n\tcolorsList[3] = colorsShuffle[2];\n\tcolorsList[4] = colorsShuffle[2];\n\tcolorsList[5] = colorsShuffle[3];\n\tcolorsList[6] = colorsShuffle[3];\n\tcolorsList[7] = colorsShuffle[0];\n\tcolorsList[8] = colorsShuffle[4];\n\n\treturn colorsList;\n}\nfunction generateRingSVG(name, colors, useTitle) {\n\tconst size = 90;\n\tconst colorsList = generateRingData(name, colors, 8, size);\n\treturn `<svg part=\"svg\" viewBox=\"0 0 ${size} ${size}\" fill=\"none\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" width=\"${size}\" height=\"${size}\">\n\t\t${useTitle ? `<title>${name}</title>` : ''}\n\t\t<g>\n\t\t\t<path d=\"M0 0h90v45H0z\" fill=\"${colorsList[0]}\" />\n\t\t\t<path d=\"M0 45h90v45H0z\" fill=\"${colorsList[1]}\" />\n\t\t\t<path d=\"M83 45a38 38 0 00-76 0h76z\" fill=\"${colorsList[2]}\" />\n\t\t\t<path d=\"M83 45a38 38 0 01-76 0h76z\" fill=\"${colorsList[3]}\" />\n\t\t\t<path d=\"M77 45a32 32 0 10-64 0h64z\" fill=\"${colorsList[4]}\" />\n\t\t\t<path d=\"M77 45a32 32 0 11-64 0h64z\" fill=\"${colorsList[5]}\" />\n\t\t\t<path d=\"M71 45a26 26 0 00-52 0h52z\" fill=\"${colorsList[6]}\" />\n\t\t\t<path d=\"M71 45a26 26 0 01-52 0h52z\" fill=\"${colorsList[7]}\" />\n\t\t\t<circle cx=\"45\" cy=\"45\" r=\"23\" fill=\"${colorsList[8]}\" />\n\t\t</g>\n\t</svg>`;\n}\n\n/*\n *********** CUSTOM ELEMENT ***********\n */\nclass PlayfulAvatar extends HTMLElement {\n\n\tstatic get observedAttributes() {\n\t\treturn ['name', 'variant', 'title', 'colors'];\n\t}\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis._isConnected = false;\n\t\tthis.attachShadow({ mode: 'open' });\n\t}\n\n\tget name() { return this.getAttribute('name'); }\n\tset name(value) { value ? this.setAttribute('name', value) : this.removeAttribute('name'); }\n\n\tget variant() { return this.getAttribute('variant'); }\n\tset variant(value) { value ? this.setAttribute('variant', value) : this.removeAttribute('variant'); }\n\n\tget title() { return this.hasAttribute('title'); }\n\tset title(value) { value ? this.setAttribute('title', value) : this.removeAttribute('title'); }\n\n\tget colors() { return this.getAttribute('colors'); }\n\tset colors(value) { value ? this.setAttribute('colors', sanitizeColors(value).join(',')) : this.removeAttribute('colors'); }\n\n\tattributeChangedCallback(name, oldValue, newValue) {\n\t\tif (this._isConnected && newValue !== oldValue) {\n\t\t\tthis.render();\n\t\t}\n\t}\n\n\t// see https://web.dev/articles/custom-elements-best-practices#make_properties_lazy\n\t_upgradeProperty(prop) {\n\t\tif (this.hasOwnProperty(prop)) {\n\t\t\tconst value = this[prop];\n\t\t\tdelete this[prop];\n\t\t\tthis[prop] = value;\n\t\t}\n\t}\n\n\tconnectedCallback() {\n\t\tif (!this._isConnected) {\n\t\t\tthis._isConnected = true;\n\t\t\tthis._upgradeProperty('name');\n\t\t\tthis._upgradeProperty('title');\n\t\t\tthis._upgradeProperty('colors');\n\t\t\tthis.render();\n\t\t}\n\t}\n\n\trender() {\n\t\tconst name = this.getAttribute('name');\n\t\tconst colors = this.hasAttribute('colors')\n\t\t\t? sanitizeColors(this.getAttribute('colors'))\n\t\t\t: [\"#0a0310\", \"#49007e\", \"#ff005b\", \"#ff7d10\", \"#ffb238\"];\n\t\tconst variant = this.getAttribute('variant');\n\t\tconst useTitle = this.hasAttribute('title');\n\t\tlet svg;\n\t\tswitch (variant) {\n\t\t\tcase 'marble':\n\t\t\t\tsvg = generateMarbleSVG(name, colors, useTitle);\n\t\t\t\tbreak;\n\t\t\tcase 'pixel':\n\t\t\t\tsvg = generatePixelSVG(name, colors, useTitle\t);\n\t\t\t\tbreak;\n\t\t\tcase 'sunset':\n\t\t\t\tsvg = generateSunsetSVG(name, colors, useTitle);\n\t\t\t\tbreak;\n\t\t\tcase 'bauhaus':\n\t\t\t\tsvg = generateBauhausSVG(name, colors, useTitle);\n\t\t\t\tbreak;\n\t\t\tcase 'ring':\n\t\t\t\tsvg = generateRingSVG(name, colors, useTitle);\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tsvg = generateBeamSVG(name, colors, useTitle);\n\t\t}\n\n\t\tthis.shadowRoot.innerHTML = `<style>\n\t\t\t:host { display: inline-block; line-height: 0;  }\n\t\t\t:host([hidden]) { display: none; }\n\t\t\tsvg {\n\t\t\t\twidth: inherit;\n\t\t\t\theight: inherit;\n\t\t\t\tborder-radius: inherit;\n\t\t\t\tbox-shadow: inherit;\n\t\t\t}\n\t\t\t</style>\n\t\t\t${svg}\n\t\t`;\n\t}\n}\n\n// define custom element only if it wasn't defined before\nif (!customElements.get('playful-avatar')) {\n\tcustomElements.define('playful-avatar', PlayfulAvatar);\n}\n"]}