@reecem/h-bar - npm Package Compare versions

Comparing version 0.2.0 to 0.2.1

CHANGELOG.md

@@ -5,2 +5,9 @@ # Changelog
 
+## 0.2.1 - 2020-02-28
+
+***FEATURES***
+
+- [a89fcc0] Adds more themes for the styling
+- [dc588ce] Gives the link an svg chevron for pretty
+
 ## 0.2.0 - 2020-02-23
@@ -7,0 +14,0 @@

dist/hBar.js

@@ -406,3 +406,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
 // Module
-exports.push([module.i, ".hb-bg-white{background-color:#fff}.hb-bg-gray-900{background-color:#1a202c}.hb-bg-blue-100{background-color:#ebf8ff}.hb-bg-blue-900{background-color:#2a4365}.hb-rounded-full{border-radius:9999px}.hb-cursor-pointer{cursor:pointer}.hb-flex{display:flex}.hb-items-center{align-items:center}.hb-justify-between{justify-content:space-between}.hb-font-semibold{font-weight:600}.hb-leading-relaxed{line-height:1.625}.hb-mx-2{margin-left:.5rem;margin-right:.5rem}.hb-mx-5{margin-left:1.25rem;margin-right:1.25rem}.hb-px-1{padding-left:.25rem;padding-right:.25rem}.hb-py-2{padding-top:.5rem;padding-bottom:.5rem}.hb-px-2{padding-left:.5rem;padding-right:.5rem}.hb-text-gray-100{color:#f7fafc}.hb-text-gray-900{color:#1a202c}.hb-text-blue-100{color:#ebf8ff}.hb-text-blue-900{color:#2a4365}.hover\\:hb-text-gray-300:hover{color:#e2e8f0}.hover\\:hb-text-blue-300:hover{color:#90cdf4}.hb-text-xs{font-size:.75rem}.hb-text-sm{font-size:.875rem}.hb-uppercase{text-transform:uppercase}.hover\\:hb-underline:hover{text-decoration:underline}.hb-tracking-wider{letter-spacing:.05em}.hb-w-full{width:100%}a{color:inherit;text-decoration:inherit;background-color:transparent}*{box-sizing:border-box;border:0 solid #e2e8f0}.fade-in-top{-webkit-animation:fade-in-top .8s cubic-bezier(.39,.575,.565,1);animation:fade-in-top .8s cubic-bezier(.39,.575,.565,1)}@-webkit-keyframes fade-in-top{to{transform:translateY(0);opacity:1}}@keyframes fade-in-top{0%{transform:translateY(-50px);opacity:0}to{transform:translateY(0);opacity:1}}@media (min-width:640px){.sm\\:hb-flex-row{flex-direction:row}}@media (min-width:768px){.md\\:hb-flex-row{flex-direction:row}.md\\:hb-px-20{padding-left:5rem;padding-right:5rem}}", ""]);
+exports.push([module.i, ".hb-bg-white{background-color:#fff}.hb-bg-gray-400{background-color:#cbd5e0}.hb-bg-gray-900{background-color:#1a202c}.hb-bg-red-100{background-color:#fff5f5}.hb-bg-red-400{background-color:#fc8181}.hb-bg-orange-300{background-color:#fbd38d}.hb-bg-orange-800{background-color:#9c4221}.hb-bg-yellow-100{background-color:ivory}.hb-bg-yellow-300{background-color:#faf089}.hb-bg-green-100{background-color:#f0fff4}.hb-bg-green-600{background-color:#38a169}.hb-bg-teal-500{background-color:#38b2ac}.hb-bg-teal-900{background-color:#234e52}.hb-bg-blue-100{background-color:#ebf8ff}.hb-bg-blue-900{background-color:#2a4365}.hb-bg-indigo-100{background-color:#ebf4ff}.hb-bg-indigo-800{background-color:#434190}.hb-rounded-full{border-radius:9999px}.hb-cursor-pointer{cursor:pointer}.hb-flex{display:flex}.hb-inline-flex{display:inline-flex}.hb-items-center{align-items:center}.hb-justify-between{justify-content:space-between}.hb-font-semibold{font-weight:600}.hb-leading-relaxed{line-height:1.625}.hb-mx-2{margin-left:.5rem;margin-right:.5rem}.hb-mx-5{margin-left:1.25rem;margin-right:1.25rem}.hb-px-1{padding-left:.25rem;padding-right:.25rem}.hb-py-2{padding-top:.5rem;padding-bottom:.5rem}.hb-px-2{padding-left:.5rem;padding-right:.5rem}.hb-text-gray-100{color:#f7fafc}.hb-text-gray-900{color:#1a202c}.hb-text-red-900{color:#742a2a}.hb-text-orange-100{color:#fffaf0}.hb-text-orange-900{color:#7b341e}.hb-text-yellow-900{color:#744210}.hb-text-green-100{color:#f0fff4}.hb-text-green-900{color:#22543d}.hb-text-teal-100{color:#e6fffa}.hb-text-blue-100{color:#ebf8ff}.hb-text-blue-900{color:#2a4365}.hb-text-indigo-100{color:#ebf4ff}.hb-text-indigo-900{color:#3c366b}.hover\\:hb-text-gray-300:hover{color:#e2e8f0}.hover\\:hb-text-gray-600:hover{color:#718096}.hover\\:hb-text-red-100:hover{color:#fff5f5}.hover\\:hb-text-orange-700:hover{color:#c05621}.hover\\:hb-text-yellow-700:hover{color:#b7791f}.hover\\:hb-text-green-300:hover{color:#9ae6b4}.hover\\:hb-text-teal-300:hover{color:#81e6d9}.hover\\:hb-text-blue-300:hover{color:#90cdf4}.hover\\:hb-text-indigo-300:hover{color:#a3bffa}.hb-text-xs{font-size:.75rem}.hb-text-sm{font-size:.875rem}.hb-uppercase{text-transform:uppercase}.hover\\:hb-underline:hover{text-decoration:underline}.hb-tracking-wider{letter-spacing:.05em}.hb-w-full{width:100%}a{color:inherit;text-decoration:inherit;background-color:transparent}*{box-sizing:border-box;border:0 solid #e2e8f0}.fade-in-top{-webkit-animation:fade-in-top .8s cubic-bezier(.39,.575,.565,1);animation:fade-in-top .8s cubic-bezier(.39,.575,.565,1)}@-webkit-keyframes fade-in-top{to{transform:translateY(0);opacity:1}}@keyframes fade-in-top{0%{transform:translateY(-50px);opacity:0}to{transform:translateY(0);opacity:1}}@media (min-width:640px){.sm\\:hb-flex-row{flex-direction:row}}@media (min-width:768px){.md\\:hb-flex-row{flex-direction:row}.md\\:hb-px-20{padding-left:5rem;padding-right:5rem}}", ""]);
 // Exports
@@ -624,3 +624,3 @@ module.exports = exports;
   badge: "hb-px-2 hb-mx-2 hb-leading-relaxed hb-tracking-wider hb-uppercase hb-font-semibold hb-rounded-full hb-text-xs",
-  postTitle: "hover:hb-underline",
+  postTitle: "hover:hb-underline hb-inline-flex hb-items-center",
   secondaryLink: "hb-mx-5 hb-cursor-pointer hover:hb-underline"
@@ -642,8 +642,57 @@ };
   },
+  lightGray: {
+    wrapper: "hb-bg-gray-400 hb-text-gray-900",
+    linkWrapper: "",
+    badge: "hb-bg-white hb-text-gray-900 shadow",
+    postTitle: "hover:hb-text-gray-600",
+    secondaryLink: "hover:hb-text-gray-600"
+  },
   blue: {
     wrapper: "hb-bg-blue-900 hb-text-blue-100",
     linkWrapper: "",
-    badge: "hb-bg-blue-100 hb-text-blue-900",
+    badge: "hb-bg-blue-100 hb-text-blue-900 shadow",
     postTitle: "hover:hb-text-blue-300",
     secondaryLink: "hover:hb-text-blue-300"
+  },
+  green: {
+    wrapper: "hb-bg-green-600 hb-text-green-100",
+    linkWrapper: "",
+    badge: "hb-bg-green-100 hb-text-green-900",
+    postTitle: "hover:hb-text-green-300",
+    secondaryLink: "hover:hb-text-green-300"
+  },
+  indigo: {
+    wrapper: "hb-bg-indigo-800 hb-text-indigo-100",
+    linkWrapper: "",
+    badge: "hb-bg-indigo-100 hb-text-indigo-900 shadow",
+    postTitle: "hover:hb-text-indigo-300",
+    secondaryLink: "hover:hb-text-indigo-300"
+  },
+  orange: {
+    wrapper: "hb-bg-orange-300 hb-text-orange-900",
+    linkWrapper: "",
+    badge: "hb-bg-orange-800 hb-text-orange-100 shadow",
+    postTitle: "hover:hb-text-orange-700",
+    secondaryLink: "hover:hb-text-orange-700"
+  },
+  yellow: {
+    wrapper: "hb-bg-yellow-300 hb-text-yellow-900",
+    linkWrapper: "",
+    badge: "hb-bg-yellow-100 hb-text-yellow-900 shadow",
+    postTitle: "hover:hb-text-yellow-700",
+    secondaryLink: "hover:hb-text-yellow-700"
+  },
+  teal: {
+    wrapper: "hb-bg-teal-500 hb-text-teal-100",
+    linkWrapper: "",
+    badge: "hb-bg-teal-900 hb-text-teal-100 shadow",
+    postTitle: "hover:hb-text-teal-300",
+    secondaryLink: "hover:hb-text-teal-300"
+  },
+  red: {
+    wrapper: "hb-bg-red-400 hb-text-red-900",
+    linkWrapper: "",
+    badge: "hb-bg-red-100 hb-text-red-900 shadow",
+    postTitle: "hover:hb-text-red-100",
+    secondaryLink: "hover:hb-text-red-100"
   }
@@ -766,3 +815,3 @@ };
  *
- * @version 0.2.0
+ * @version 0.2.1
  * @author ReeceM
@@ -779,3 +828,3 @@ */
   */
-  version: "0.2.0",
+  version: "0.2.1",
 
@@ -842,2 +891,3 @@ /**
       postLink.innerText = _this2.postTitle;
+      postLink.innerHTML += "\n            <svg class=\"h-3 w-3\" viewBox=\"0 0 20 20\" fill=\"currentColor\">\n                <path fill-rule=\"evenodd\" d=\"M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z\" clip-rule=\"evenodd\"/>\n            </svg>\n            ";
       var postElement = newElement('div', {
@@ -844,0 +894,0 @@ classes: "".concat(_this2.styling.linkWrapper, " ").concat(themes[_this2.theme].linkWrapper),

dist/hBar.min.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.hBar=t():e.hBar=t()}(window,function(){return r={},o.m=n=[function(e,t,n){var r=n(1),o=n(2);"string"==typeof(o=o.__esModule?o.default:o)&&(o=[[e.i,o,""]]);var i={insert:"head",singleton:!1},a=(r(o,i),o.locals?o.locals:{});e.exports=a},function(e,t,i){"use strict";var n,r,o=function(){return void 0===n&&(n=Boolean(window&&document&&document.all&&!window.atob)),n},a=(r={},function(e){if(void 0===r[e]){var t=document.querySelector(e);if(window.HTMLIFrameElement&&t instanceof window.HTMLIFrameElement)try{t=t.contentDocument.head}catch(e){t=null}r[e]=t}return r[e]}),d=[];function f(e){for(var t=-1,n=0;n<d.length;n++)if(d[n].identifier===e){t=n;break}return t}function s(e,t){for(var n={},r=[],o=0;o<e.length;o++){var i=e[o],a=t.base?i[0]+t.base:i[0],c=n[a]||0,s="".concat(a," ").concat(c);n[a]=c+1;var l=f(s),u={css:i[1],media:i[2],sourceMap:i[3]};-1!==l?(d[l].references++,d[l].updater(u)):d.push({identifier:s,updater:m(u,t),references:1}),r.push(s)}return r}function c(e){var t=document.createElement("style"),n=e.attributes||{};if(void 0===n.nonce){var r=i.nc;r&&(n.nonce=r)}if(Object.keys(n).forEach(function(e){t.setAttribute(e,n[e])}),"function"==typeof e.insert)e.insert(t);else{var o=a(e.insert||"head");if(!o)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");o.appendChild(t)}return t}var l,u=(l=[],function(e,t){return l[e]=t,l.filter(Boolean).join("\n")});function h(e,t,n,r){var o=n?"":r.media?"@media ".concat(r.media," {").concat(r.css,"}"):r.css;if(e.styleSheet)e.styleSheet.cssText=u(t,o);else{var i=document.createTextNode(o),a=e.childNodes;a[t]&&e.removeChild(a[t]),a.length?e.insertBefore(i,a[t]):e.appendChild(i)}}var p=null,b=0;function m(t,e){var n,r,o;if(e.singleton){var i=b++;n=p=p||c(e),r=h.bind(null,n,i,!1),o=h.bind(null,n,i,!0)}else n=c(e),r=function(e,t,n){var r=n.css,o=n.media,i=n.sourceMap;if(o?e.setAttribute("media",o):e.removeAttribute("media"),i&&btoa&&(r+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(i))))," */")),e.styleSheet)e.styleSheet.cssText=r;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(r))}}.bind(null,n,e),o=function(){var e;null!==(e=n).parentNode&&e.parentNode.removeChild(e)};return r(t),function(e){if(e){if(e.css===t.css&&e.media===t.media&&e.sourceMap===t.sourceMap)return;r(t=e)}else o()}}e.exports=function(e,a){(a=a||{}).singleton||"boolean"==typeof a.singleton||(a.singleton=o());var c=s(e=e||[],a);return function(e){if(e=e||[],"[object Array]"===Object.prototype.toString.call(e)){for(var t=0;t<c.length;t++){var n=f(c[t]);d[n].references--}for(var r=s(e,a),o=0;o<c.length;o++){var i=f(c[o]);0===d[i].references&&(d[i].updater(),d.splice(i,1))}c=r}}}},function(e,t,n){(t=n(3)(!1)).push([e.i,".hb-bg-white{background-color:#fff}.hb-bg-gray-900{background-color:#1a202c}.hb-bg-blue-100{background-color:#ebf8ff}.hb-bg-blue-900{background-color:#2a4365}.hb-rounded-full{border-radius:9999px}.hb-cursor-pointer{cursor:pointer}.hb-flex{display:flex}.hb-items-center{align-items:center}.hb-justify-between{justify-content:space-between}.hb-font-semibold{font-weight:600}.hb-leading-relaxed{line-height:1.625}.hb-mx-2{margin-left:.5rem;margin-right:.5rem}.hb-mx-5{margin-left:1.25rem;margin-right:1.25rem}.hb-px-1{padding-left:.25rem;padding-right:.25rem}.hb-py-2{padding-top:.5rem;padding-bottom:.5rem}.hb-px-2{padding-left:.5rem;padding-right:.5rem}.hb-text-gray-100{color:#f7fafc}.hb-text-gray-900{color:#1a202c}.hb-text-blue-100{color:#ebf8ff}.hb-text-blue-900{color:#2a4365}.hover\\:hb-text-gray-300:hover{color:#e2e8f0}.hover\\:hb-text-blue-300:hover{color:#90cdf4}.hb-text-xs{font-size:.75rem}.hb-text-sm{font-size:.875rem}.hb-uppercase{text-transform:uppercase}.hover\\:hb-underline:hover{text-decoration:underline}.hb-tracking-wider{letter-spacing:.05em}.hb-w-full{width:100%}a{color:inherit;text-decoration:inherit;background-color:transparent}*{box-sizing:border-box;border:0 solid #e2e8f0}.fade-in-top{-webkit-animation:fade-in-top .8s cubic-bezier(.39,.575,.565,1);animation:fade-in-top .8s cubic-bezier(.39,.575,.565,1)}@-webkit-keyframes fade-in-top{to{transform:translateY(0);opacity:1}}@keyframes fade-in-top{0%{transform:translateY(-50px);opacity:0}to{transform:translateY(0);opacity:1}}@media (min-width:640px){.sm\\:hb-flex-row{flex-direction:row}}@media (min-width:768px){.md\\:hb-flex-row{flex-direction:row}.md\\:hb-px-20{padding-left:5rem;padding-right:5rem}}",""]),e.exports=t},function(e,t,n){"use strict";e.exports=function(n){var s=[];return s.toString=function(){return this.map(function(e){var t=function(e,t){var n=e[1]||"",r=e[3];if(!r)return n;if(t&&"function"==typeof btoa){var o=function(e){var t=btoa(unescape(encodeURIComponent(JSON.stringify(e)))),n="sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(t);return"/*# ".concat(n," */")}(r),i=r.sources.map(function(e){return"/*# sourceURL=".concat(r.sourceRoot||"").concat(e," */")});return[n].concat(i).concat([o]).join("\n")}return[n].join("\n")}(e,n);return e[2]?"@media ".concat(e[2]," {").concat(t,"}"):t}).join("")},s.i=function(e,t,n){"string"==typeof e&&(e=[[null,e,""]]);var r={};if(n)for(var o=0;o<this.length;o++){var i=this[o][0];null!=i&&(r[i]=!0)}for(var a=0;a<e.length;a++){var c=[].concat(e[a]);n&&r[c[0]]||(t&&(c[2]?c[2]="".concat(t," and ").concat(c[2]):c[2]=t),s.push(c))}},s}},function(e,t,n){"use strict";n.r(t);n(0);var f={url:"",theme:"gray",secondaryLinks:[],fetchOptions:{method:"GET",mode:"cors",cache:"no-cache",headers:{Accept:"application/json"},redirect:"follow"}};function h(e){var t=e[0],n=t.title.rendered,r=t.link;return null==n&&console.error("WP-json response doesn't have real values %o",e[0]),{title:n,link:r}}var p=h;var b={wrapper:"hb-flex hb-w-full hd-flex-col md:hb-flex-row sm:hb-flex-row hb-text-sm hb-py-2 md:hb-px-20 hb-px-1 hb-items-center hb-justify-between",linkWrapper:"hb-flex hb-items-center",badge:"hb-px-2 hb-mx-2 hb-leading-relaxed hb-tracking-wider hb-uppercase hb-font-semibold hb-rounded-full hb-text-xs",postTitle:"hover:hb-underline",secondaryLink:"hb-mx-5 hb-cursor-pointer hover:hb-underline"},c={gray:{wrapper:"hb-bg-gray-900 hb-text-gray-100",linkWrapper:"",badge:"hb-bg-white hb-text-gray-900",postTitle:"hover:hb-text-gray-300",secondaryLink:"hover:hb-text-gray-300"},blue:{wrapper:"hb-bg-blue-900 hb-text-blue-100",linkWrapper:"",badge:"hb-bg-blue-100 hb-text-blue-900",postTitle:"hover:hb-text-blue-300",secondaryLink:"hover:hb-text-blue-300"}};function a(e){return function(e){if(Array.isArray(e)){for(var t=0,n=new Array(e.length);t<e.length;t++)n[t]=e[t];return n}}(e)||function(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance")}()}function s(e,t){var n=t.children,r=t.classes,o=document.createElement(e),i=document.createDocumentFragment();return function(e){var t,n=(1<arguments.length&&void 0!==arguments[1]?arguments[1]:"").trim().split(" ");(t=e.classList).add.apply(t,a(n))}(o,r||""),n&&n.forEach(function(e){Array.isArray(e)?e.forEach(function(e){return i.appendChild(e)}):i.appendChild(e)}),o.appendChild(i),o}function r(e){return(r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}var o={version:"0.2.0",init:function(e){var t,n=e.url,r=e.ele,o=e.badge,i=e.secondaryLinks,a=e.options,c=e.customStyles,s=e.onCompleted,l=e.parser,u=e.link,d=e.title;return this.url=n,this.ele=r||"h-bar",this.config=Object.assign(f,a),this.styling=Object.assign(b,c),this.secondaryLinks=i,this.onCompleted=s||function(){},this.badge=o||"New",this.postLink=u,this.postTitle=d,this.theme=this.config.theme,p="function"==typeof(t=l)?t:h,this},fetchData:function(){var o=this;fetch(this.url,this.config.fetchOptions).then(function(e){return e.json()}).then(function(e){var n;"object"==r(e)?(n=e,new Promise(function(e,t){if(n)try{e(p(n))}catch(e){t(e)}t({error:"No Data",data:n})}).then(function(e){var t=e.title,n=e.link,r=e.secondaryLinks;o.postTitle=t,o.postLink=n,o.secondaryLinks=r||[],o.render()}).catch(function(e){console.error(e),o.destroy()})):console.error("".concat(o.url," Did not return an object"))})},render:function(){var a=this;new Promise(function(e){"loading"==document.readyState?document.addEventListener("DOMContentLoaded",e):e()}).then(function(){var e=s("div",{children:a.createSecondaryLinks(),classes:"".concat(a.styling.linkWrapper," ").concat(c[a.theme].linkWrapper)}),t=s("span",{classes:"".concat(a.styling.badge," ").concat(c[a.theme].badge)}),n=s("a",{classes:"".concat(a.styling.postTitle," ").concat(c[a.theme].postTitle)});t.innerText=a.badge,n.href=a.postLink,n.innerText=a.postTitle;var r=s("div",{classes:"".concat(a.styling.linkWrapper," ").concat(c[a.theme].linkWrapper),children:[t,n]}),o=s("div",{classes:"".concat(a.styling.wrapper," ").concat(c[a.theme].wrapper),children:[r,e]}),i=document.getElementById(a.ele);i.innerHTML="",i.appendChild(o),a.onCompleted({element:i,id:a.ele})})},destroy:function(){document.getElementById(this.ele).remove()},createSecondaryLinks:function(){var o=this;return this.secondaryLinks?this.secondaryLinks.map(function(e){var t=e.title,n=e.link,r=s("a",{classes:"".concat(o.styling.secondaryLink," ").concat(c[o.theme].secondaryLink)});return r.href=n,r.innerText=t,r},this):[]}};t.default=o}],o.c=r,o.d=function(e,t,n){o.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},o.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.t=function(t,e){if(1&e&&(t=o(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(o.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)o.d(n,r,function(e){return t[e]}.bind(null,r));return n},o.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(t,"a",t),t},o.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},o.p="",o(o.s=4).default;function o(e){if(r[e])return r[e].exports;var t=r[e]={i:e,l:!1,exports:{}};return n[e].call(t.exports,t,t.exports,o),t.l=!0,t.exports}var n,r});
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.hBar=t():e.hBar=t()}(window,function(){return n={},o.m=r=[function(e,t,r){var n=r(1),o=r(2);"string"==typeof(o=o.__esModule?o.default:o)&&(o=[[e.i,o,""]]);var i={insert:"head",singleton:!1},a=(n(o,i),o.locals?o.locals:{});e.exports=a},function(e,t,i){"use strict";var r,n,o=function(){return void 0===r&&(r=Boolean(window&&document&&document.all&&!window.atob)),r},a=(n={},function(e){if(void 0===n[e]){var t=document.querySelector(e);if(window.HTMLIFrameElement&&t instanceof window.HTMLIFrameElement)try{t=t.contentDocument.head}catch(e){t=null}n[e]=t}return n[e]}),s=[];function d(e){for(var t=-1,r=0;r<s.length;r++)if(s[r].identifier===e){t=r;break}return t}function l(e,t){for(var r={},n=[],o=0;o<e.length;o++){var i=e[o],a=t.base?i[0]+t.base:i[0],c=r[a]||0,l="".concat(a," ").concat(c);r[a]=c+1;var h=d(l),b={css:i[1],media:i[2],sourceMap:i[3]};-1!==h?(s[h].references++,s[h].updater(b)):s.push({identifier:l,updater:g(b,t),references:1}),n.push(l)}return n}function c(e){var t=document.createElement("style"),r=e.attributes||{};if(void 0===r.nonce){var n=i.nc;n&&(r.nonce=n)}if(Object.keys(r).forEach(function(e){t.setAttribute(e,r[e])}),"function"==typeof e.insert)e.insert(t);else{var o=a(e.insert||"head");if(!o)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");o.appendChild(t)}return t}var h,b=(h=[],function(e,t){return h[e]=t,h.filter(Boolean).join("\n")});function f(e,t,r,n){var o=r?"":n.media?"@media ".concat(n.media," {").concat(n.css,"}"):n.css;if(e.styleSheet)e.styleSheet.cssText=b(t,o);else{var i=document.createTextNode(o),a=e.childNodes;a[t]&&e.removeChild(a[t]),a.length?e.insertBefore(i,a[t]):e.appendChild(i)}}var u=null,p=0;function g(t,e){var r,n,o;if(e.singleton){var i=p++;r=u=u||c(e),n=f.bind(null,r,i,!1),o=f.bind(null,r,i,!0)}else r=c(e),n=function(e,t,r){var n=r.css,o=r.media,i=r.sourceMap;if(o?e.setAttribute("media",o):e.removeAttribute("media"),i&&btoa&&(n+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(i))))," */")),e.styleSheet)e.styleSheet.cssText=n;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(n))}}.bind(null,r,e),o=function(){var e;null!==(e=r).parentNode&&e.parentNode.removeChild(e)};return n(t),function(e){if(e){if(e.css===t.css&&e.media===t.media&&e.sourceMap===t.sourceMap)return;n(t=e)}else o()}}e.exports=function(e,a){(a=a||{}).singleton||"boolean"==typeof a.singleton||(a.singleton=o());var c=l(e=e||[],a);return function(e){if(e=e||[],"[object Array]"===Object.prototype.toString.call(e)){for(var t=0;t<c.length;t++){var r=d(c[t]);s[r].references--}for(var n=l(e,a),o=0;o<c.length;o++){var i=d(c[o]);0===s[i].references&&(s[i].updater(),s.splice(i,1))}c=n}}}},function(e,t,r){(t=r(3)(!1)).push([e.i,".hb-bg-white{background-color:#fff}.hb-bg-gray-400{background-color:#cbd5e0}.hb-bg-gray-900{background-color:#1a202c}.hb-bg-red-100{background-color:#fff5f5}.hb-bg-red-400{background-color:#fc8181}.hb-bg-orange-300{background-color:#fbd38d}.hb-bg-orange-800{background-color:#9c4221}.hb-bg-yellow-100{background-color:ivory}.hb-bg-yellow-300{background-color:#faf089}.hb-bg-green-100{background-color:#f0fff4}.hb-bg-green-600{background-color:#38a169}.hb-bg-teal-500{background-color:#38b2ac}.hb-bg-teal-900{background-color:#234e52}.hb-bg-blue-100{background-color:#ebf8ff}.hb-bg-blue-900{background-color:#2a4365}.hb-bg-indigo-100{background-color:#ebf4ff}.hb-bg-indigo-800{background-color:#434190}.hb-rounded-full{border-radius:9999px}.hb-cursor-pointer{cursor:pointer}.hb-flex{display:flex}.hb-inline-flex{display:inline-flex}.hb-items-center{align-items:center}.hb-justify-between{justify-content:space-between}.hb-font-semibold{font-weight:600}.hb-leading-relaxed{line-height:1.625}.hb-mx-2{margin-left:.5rem;margin-right:.5rem}.hb-mx-5{margin-left:1.25rem;margin-right:1.25rem}.hb-px-1{padding-left:.25rem;padding-right:.25rem}.hb-py-2{padding-top:.5rem;padding-bottom:.5rem}.hb-px-2{padding-left:.5rem;padding-right:.5rem}.hb-text-gray-100{color:#f7fafc}.hb-text-gray-900{color:#1a202c}.hb-text-red-900{color:#742a2a}.hb-text-orange-100{color:#fffaf0}.hb-text-orange-900{color:#7b341e}.hb-text-yellow-900{color:#744210}.hb-text-green-100{color:#f0fff4}.hb-text-green-900{color:#22543d}.hb-text-teal-100{color:#e6fffa}.hb-text-blue-100{color:#ebf8ff}.hb-text-blue-900{color:#2a4365}.hb-text-indigo-100{color:#ebf4ff}.hb-text-indigo-900{color:#3c366b}.hover\\:hb-text-gray-300:hover{color:#e2e8f0}.hover\\:hb-text-gray-600:hover{color:#718096}.hover\\:hb-text-red-100:hover{color:#fff5f5}.hover\\:hb-text-orange-700:hover{color:#c05621}.hover\\:hb-text-yellow-700:hover{color:#b7791f}.hover\\:hb-text-green-300:hover{color:#9ae6b4}.hover\\:hb-text-teal-300:hover{color:#81e6d9}.hover\\:hb-text-blue-300:hover{color:#90cdf4}.hover\\:hb-text-indigo-300:hover{color:#a3bffa}.hb-text-xs{font-size:.75rem}.hb-text-sm{font-size:.875rem}.hb-uppercase{text-transform:uppercase}.hover\\:hb-underline:hover{text-decoration:underline}.hb-tracking-wider{letter-spacing:.05em}.hb-w-full{width:100%}a{color:inherit;text-decoration:inherit;background-color:transparent}*{box-sizing:border-box;border:0 solid #e2e8f0}.fade-in-top{-webkit-animation:fade-in-top .8s cubic-bezier(.39,.575,.565,1);animation:fade-in-top .8s cubic-bezier(.39,.575,.565,1)}@-webkit-keyframes fade-in-top{to{transform:translateY(0);opacity:1}}@keyframes fade-in-top{0%{transform:translateY(-50px);opacity:0}to{transform:translateY(0);opacity:1}}@media (min-width:640px){.sm\\:hb-flex-row{flex-direction:row}}@media (min-width:768px){.md\\:hb-flex-row{flex-direction:row}.md\\:hb-px-20{padding-left:5rem;padding-right:5rem}}",""]),e.exports=t},function(e,t,r){"use strict";e.exports=function(r){var l=[];return l.toString=function(){return this.map(function(e){var t=function(e,t){var r=e[1]||"",n=e[3];if(!n)return r;if(t&&"function"==typeof btoa){var o=function(e){var t=btoa(unescape(encodeURIComponent(JSON.stringify(e)))),r="sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(t);return"/*# ".concat(r," */")}(n),i=n.sources.map(function(e){return"/*# sourceURL=".concat(n.sourceRoot||"").concat(e," */")});return[r].concat(i).concat([o]).join("\n")}return[r].join("\n")}(e,r);return e[2]?"@media ".concat(e[2]," {").concat(t,"}"):t}).join("")},l.i=function(e,t,r){"string"==typeof e&&(e=[[null,e,""]]);var n={};if(r)for(var o=0;o<this.length;o++){var i=this[o][0];null!=i&&(n[i]=!0)}for(var a=0;a<e.length;a++){var c=[].concat(e[a]);r&&n[c[0]]||(t&&(c[2]?c[2]="".concat(t," and ").concat(c[2]):c[2]=t),l.push(c))}},l}},function(e,t,r){"use strict";r.r(t);r(0);var d={url:"",theme:"gray",secondaryLinks:[],fetchOptions:{method:"GET",mode:"cors",cache:"no-cache",headers:{Accept:"application/json"},redirect:"follow"}};function f(e){var t=e[0],r=t.title.rendered,n=t.link;return null==r&&console.error("WP-json response doesn't have real values %o",e[0]),{title:r,link:n}}var u=f;var p={wrapper:"hb-flex hb-w-full hd-flex-col md:hb-flex-row sm:hb-flex-row hb-text-sm hb-py-2 md:hb-px-20 hb-px-1 hb-items-center hb-justify-between",linkWrapper:"hb-flex hb-items-center",badge:"hb-px-2 hb-mx-2 hb-leading-relaxed hb-tracking-wider hb-uppercase hb-font-semibold hb-rounded-full hb-text-xs",postTitle:"hover:hb-underline hb-inline-flex hb-items-center",secondaryLink:"hb-mx-5 hb-cursor-pointer hover:hb-underline"},c={gray:{wrapper:"hb-bg-gray-900 hb-text-gray-100",linkWrapper:"",badge:"hb-bg-white hb-text-gray-900",postTitle:"hover:hb-text-gray-300",secondaryLink:"hover:hb-text-gray-300"},lightGray:{wrapper:"hb-bg-gray-400 hb-text-gray-900",linkWrapper:"",badge:"hb-bg-white hb-text-gray-900 shadow",postTitle:"hover:hb-text-gray-600",secondaryLink:"hover:hb-text-gray-600"},blue:{wrapper:"hb-bg-blue-900 hb-text-blue-100",linkWrapper:"",badge:"hb-bg-blue-100 hb-text-blue-900 shadow",postTitle:"hover:hb-text-blue-300",secondaryLink:"hover:hb-text-blue-300"},green:{wrapper:"hb-bg-green-600 hb-text-green-100",linkWrapper:"",badge:"hb-bg-green-100 hb-text-green-900",postTitle:"hover:hb-text-green-300",secondaryLink:"hover:hb-text-green-300"},indigo:{wrapper:"hb-bg-indigo-800 hb-text-indigo-100",linkWrapper:"",badge:"hb-bg-indigo-100 hb-text-indigo-900 shadow",postTitle:"hover:hb-text-indigo-300",secondaryLink:"hover:hb-text-indigo-300"},orange:{wrapper:"hb-bg-orange-300 hb-text-orange-900",linkWrapper:"",badge:"hb-bg-orange-800 hb-text-orange-100 shadow",postTitle:"hover:hb-text-orange-700",secondaryLink:"hover:hb-text-orange-700"},yellow:{wrapper:"hb-bg-yellow-300 hb-text-yellow-900",linkWrapper:"",badge:"hb-bg-yellow-100 hb-text-yellow-900 shadow",postTitle:"hover:hb-text-yellow-700",secondaryLink:"hover:hb-text-yellow-700"},teal:{wrapper:"hb-bg-teal-500 hb-text-teal-100",linkWrapper:"",badge:"hb-bg-teal-900 hb-text-teal-100 shadow",postTitle:"hover:hb-text-teal-300",secondaryLink:"hover:hb-text-teal-300"},red:{wrapper:"hb-bg-red-400 hb-text-red-900",linkWrapper:"",badge:"hb-bg-red-100 hb-text-red-900 shadow",postTitle:"hover:hb-text-red-100",secondaryLink:"hover:hb-text-red-100"}};function a(e){return function(e){if(Array.isArray(e)){for(var t=0,r=new Array(e.length);t<e.length;t++)r[t]=e[t];return r}}(e)||function(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance")}()}function l(e,t){var r=t.children,n=t.classes,o=document.createElement(e),i=document.createDocumentFragment();return function(e){var t,r=(1<arguments.length&&void 0!==arguments[1]?arguments[1]:"").trim().split(" ");(t=e.classList).add.apply(t,a(r))}(o,n||""),r&&r.forEach(function(e){Array.isArray(e)?e.forEach(function(e){return i.appendChild(e)}):i.appendChild(e)}),o.appendChild(i),o}function n(e){return(n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}var o={version:"0.2.1",init:function(e){var t,r=e.url,n=e.ele,o=e.badge,i=e.secondaryLinks,a=e.options,c=e.customStyles,l=e.onCompleted,h=e.parser,b=e.link,s=e.title;return this.url=r,this.ele=n||"h-bar",this.config=Object.assign(d,a),this.styling=Object.assign(p,c),this.secondaryLinks=i,this.onCompleted=l||function(){},this.badge=o||"New",this.postLink=b,this.postTitle=s,this.theme=this.config.theme,u="function"==typeof(t=h)?t:f,this},fetchData:function(){var o=this;fetch(this.url,this.config.fetchOptions).then(function(e){return e.json()}).then(function(e){var r;"object"==n(e)?(r=e,new Promise(function(e,t){if(r)try{e(u(r))}catch(e){t(e)}t({error:"No Data",data:r})}).then(function(e){var t=e.title,r=e.link,n=e.secondaryLinks;o.postTitle=t,o.postLink=r,o.secondaryLinks=n||[],o.render()}).catch(function(e){console.error(e),o.destroy()})):console.error("".concat(o.url," Did not return an object"))})},render:function(){var a=this;new Promise(function(e){"loading"==document.readyState?document.addEventListener("DOMContentLoaded",e):e()}).then(function(){var e=l("div",{children:a.createSecondaryLinks(),classes:"".concat(a.styling.linkWrapper," ").concat(c[a.theme].linkWrapper)}),t=l("span",{classes:"".concat(a.styling.badge," ").concat(c[a.theme].badge)}),r=l("a",{classes:"".concat(a.styling.postTitle," ").concat(c[a.theme].postTitle)});t.innerText=a.badge,r.href=a.postLink,r.innerText=a.postTitle,r.innerHTML+='\n            <svg class="h-3 w-3" viewBox="0 0 20 20" fill="currentColor">\n                <path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd"/>\n            </svg>\n            ';var n=l("div",{classes:"".concat(a.styling.linkWrapper," ").concat(c[a.theme].linkWrapper),children:[t,r]}),o=l("div",{classes:"".concat(a.styling.wrapper," ").concat(c[a.theme].wrapper),children:[n,e]}),i=document.getElementById(a.ele);i.innerHTML="",i.appendChild(o),a.onCompleted({element:i,id:a.ele})})},destroy:function(){document.getElementById(this.ele).remove()},createSecondaryLinks:function(){var o=this;return this.secondaryLinks?this.secondaryLinks.map(function(e){var t=e.title,r=e.link,n=l("a",{classes:"".concat(o.styling.secondaryLink," ").concat(c[o.theme].secondaryLink)});return n.href=r,n.innerText=t,n},this):[]}};t.default=o}],o.c=n,o.d=function(e,t,r){o.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},o.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.t=function(t,e){if(1&e&&(t=o(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var r=Object.create(null);if(o.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var n in t)o.d(r,n,function(e){return t[e]}.bind(null,n));return r},o.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(t,"a",t),t},o.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},o.p="",o(o.s=4).default;function o(e){if(n[e])return n[e].exports;var t=n[e]={i:e,l:!1,exports:{}};return r[e].call(t.exports,t,t.exports,o),t.l=!0,t.exports}var r,n});

package.json

 {
     "name": "@reecem/h-bar",
-    "version": "0.2.0",
+    "version": "0.2.1",
     "description": "Lightweight Announcement Bar with Tailwindcss, extendable too",
@@ -5,0 +5,0 @@ "main": "dist/hBar.js",

src/config/styling.js

@@ -12,3 +12,3 @@ /**
     badge: "hb-px-2 hb-mx-2 hb-leading-relaxed hb-tracking-wider hb-uppercase hb-font-semibold hb-rounded-full hb-text-xs",
-    postTitle: "hover:hb-underline",
+    postTitle: "hover:hb-underline hb-inline-flex hb-items-center",
     secondaryLink: "hb-mx-5 hb-cursor-pointer hover:hb-underline",
@@ -30,9 +30,58 @@ }
     },
+    lightGray: {
+        wrapper: "hb-bg-gray-400 hb-text-gray-900",
+        linkWrapper: "",
+        badge: "hb-bg-white hb-text-gray-900 shadow",
+        postTitle: "hover:hb-text-gray-600",
+        secondaryLink: "hover:hb-text-gray-600"
+    },
     blue: {
         wrapper: "hb-bg-blue-900 hb-text-blue-100",
         linkWrapper: "",
-        badge: "hb-bg-blue-100 hb-text-blue-900",
+        badge: "hb-bg-blue-100 hb-text-blue-900 shadow",
         postTitle: "hover:hb-text-blue-300",
         secondaryLink: "hover:hb-text-blue-300"
     },
+    green: {
+        wrapper: "hb-bg-green-600 hb-text-green-100",
+        linkWrapper: "",
+        badge: "hb-bg-green-100 hb-text-green-900",
+        postTitle: "hover:hb-text-green-300",
+        secondaryLink: "hover:hb-text-green-300"
+    },
+    indigo: {
+        wrapper: "hb-bg-indigo-800 hb-text-indigo-100",
+        linkWrapper: "",
+        badge: "hb-bg-indigo-100 hb-text-indigo-900 shadow",
+        postTitle: "hover:hb-text-indigo-300",
+        secondaryLink: "hover:hb-text-indigo-300"
+    },
+    orange: {
+        wrapper: "hb-bg-orange-300 hb-text-orange-900",
+        linkWrapper: "",
+        badge: "hb-bg-orange-800 hb-text-orange-100 shadow",
+        postTitle: "hover:hb-text-orange-700",
+        secondaryLink: "hover:hb-text-orange-700"
+    },
+    yellow: {
+        wrapper: "hb-bg-yellow-300 hb-text-yellow-900",
+        linkWrapper: "",
+        badge: "hb-bg-yellow-100 hb-text-yellow-900 shadow",
+        postTitle: "hover:hb-text-yellow-700",
+        secondaryLink: "hover:hb-text-yellow-700"
+    },
+    teal: {
+        wrapper: "hb-bg-teal-500 hb-text-teal-100",
+        linkWrapper: "",
+        badge: "hb-bg-teal-900 hb-text-teal-100 shadow",
+        postTitle: "hover:hb-text-teal-300",
+        secondaryLink: "hover:hb-text-teal-300"
+    },
+    red: {
+        wrapper: "hb-bg-red-400 hb-text-red-900",
+        linkWrapper: "",
+        badge: "hb-bg-red-100 hb-text-red-900 shadow",
+        postTitle: "hover:hb-text-red-100",
+        secondaryLink: "hover:hb-text-red-100"
+    },
 }

src/index.js

 /**
  * h-bar announcement banner
  *
- * @version 0.2.0
+ * @version 0.2.1
  * @author ReeceM
@@ -17,3 +17,3 @@ */
     */
-    version: "0.2.0",
+    version: "0.2.1",
 
@@ -75,2 +75,8 @@ /**
 
+            postLink.innerHTML += `
+            <svg class="h-3 w-3" viewBox="0 0 20 20" fill="currentColor">
+                <path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd"/>
+            </svg>
+            `
+
             let postElement = newElement('div', {
@@ -77,0 +83,0 @@ classes: `${this.styling.linkWrapper} ${themes[this.theme].linkWrapper}`,

No alert changes

Improved metrics

Total package byte prevSize

155142

increased by5.59%

Lines of code

1303

increased by9.13%

No dependency changes