From a031418bef9966539892e403f6aae635da948a37 Mon Sep 17 00:00:00 2001 From: donovanroubos Date: Fri, 15 Jan 2021 12:08:58 +0100 Subject: [PATCH 1/2] Update core version that fixes HM size M flag --- dist/vue-flag-rollup.cjs.js | 242 +--------------------------------- dist/vue-flag-rollup.esm.js | 240 +--------------------------------- dist/vue-flag-rollup.iife.js | 243 +---------------------------------- package.json | 2 +- rollup.config.js | 16 ++- yarn.lock | 8 +- 6 files changed, 19 insertions(+), 732 deletions(-) diff --git a/dist/vue-flag-rollup.cjs.js b/dist/vue-flag-rollup.cjs.js index e0dc6ff..bc1d79e 100644 --- a/dist/vue-flag-rollup.cjs.js +++ b/dist/vue-flag-rollup.cjs.js @@ -1,241 +1 @@ -'use strict'; - -var flagpackCore = require('flagpack-core'); - -// - -var script = { - name: 'Flag', - computed: { - imageUrl () { - const url = flagpackCore.imageUrl(flagpackCore.isoToCountryCode(this.code).toUpperCase(), this.size.toLowerCase()); - return url - } - }, - props: { - size: { - type: String, - default: 'm', - validator: value => ( - ['s', 'm', 'l'].indexOf(value) !== -1 - ), - }, - code: { - type: String, - default: '528' - }, - hasDropShadow: { - type: Boolean, - default: false, - }, - hasBorder: { - type: Boolean, - default: true - }, - hasBorderRadius: { - type: Boolean, - default: true, - }, - gradient: { - type: String, - validator: value => ( - ['top-down', 'real-linear', 'real-circular'].indexOf(value) !== -1 - ), - }, - className: { - type: String - } - }, -}; - -function normalizeComponent(template, style, script, scopeId, isFunctionalTemplate, moduleIdentifier /* server only */, shadowMode, createInjector, createInjectorSSR, createInjectorShadow) { - if (typeof shadowMode !== 'boolean') { - createInjectorSSR = createInjector; - createInjector = shadowMode; - shadowMode = false; - } - // Vue.extend constructor export interop. - const options = typeof script === 'function' ? script.options : script; - // render functions - if (template && template.render) { - options.render = template.render; - options.staticRenderFns = template.staticRenderFns; - options._compiled = true; - // functional template - if (isFunctionalTemplate) { - options.functional = true; - } - } - // scopedId - if (scopeId) { - options._scopeId = scopeId; - } - let hook; - if (moduleIdentifier) { - // server build - hook = function (context) { - // 2.3 injection - context = - context || // cached call - (this.$vnode && this.$vnode.ssrContext) || // stateful - (this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext); // functional - // 2.2 with runInNewContext: true - if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') { - context = __VUE_SSR_CONTEXT__; - } - // inject component styles - if (style) { - style.call(this, createInjectorSSR(context)); - } - // register component module identifier for async chunk inference - if (context && context._registeredComponents) { - context._registeredComponents.add(moduleIdentifier); - } - }; - // used by ssr in case component is cached and beforeCreate - // never gets called - options._ssrRegister = hook; - } - else if (style) { - hook = shadowMode - ? function (context) { - style.call(this, createInjectorShadow(context, this.$root.$options.shadowRoot)); - } - : function (context) { - style.call(this, createInjector(context)); - }; - } - if (hook) { - if (options.functional) { - // register for functional component in vue file - const originalRender = options.render; - options.render = function renderWithStyleInjection(h, context) { - hook.call(context); - return originalRender(h, context); - }; - } - else { - // inject component registration as beforeCreate hook - const existing = options.beforeCreate; - options.beforeCreate = existing ? [].concat(existing, hook) : [hook]; - } - } - return script; -} - -const isOldIE = typeof navigator !== 'undefined' && - /msie [6-9]\\b/.test(navigator.userAgent.toLowerCase()); -function createInjector(context) { - return (id, style) => addStyle(id, style); -} -let HEAD; -const styles = {}; -function addStyle(id, css) { - const group = isOldIE ? css.media || 'default' : id; - const style = styles[group] || (styles[group] = { ids: new Set(), styles: [] }); - if (!style.ids.has(id)) { - style.ids.add(id); - let code = css.source; - if (css.map) { - // https://developer.chrome.com/devtools/docs/javascript-debugging - // this makes source maps inside style tags work properly in Chrome - code += '\n/*# sourceURL=' + css.map.sources[0] + ' */'; - // http://stackoverflow.com/a/26603875 - code += - '\n/*# sourceMappingURL=data:application/json;base64,' + - btoa(unescape(encodeURIComponent(JSON.stringify(css.map)))) + - ' */'; - } - if (!style.element) { - style.element = document.createElement('style'); - style.element.type = 'text/css'; - if (css.media) - style.element.setAttribute('media', css.media); - if (HEAD === undefined) { - HEAD = document.head || document.getElementsByTagName('head')[0]; - } - HEAD.appendChild(style.element); - } - if ('styleSheet' in style.element) { - style.styles.push(code); - style.element.styleSheet.cssText = style.styles - .filter(Boolean) - .join('\n'); - } - else { - const index = style.ids.size - 1; - const textNode = document.createTextNode(code); - const nodes = style.element.childNodes; - if (nodes[index]) - style.element.removeChild(nodes[index]); - if (nodes.length) - style.element.insertBefore(textNode, nodes[index]); - else - style.element.appendChild(textNode); - } - } -} - -/* script */ -const __vue_script__ = script; - -/* template */ -var __vue_render__ = function() { - var _vm = this; - var _h = _vm.$createElement; - var _c = _vm._self._c || _h; - return _c( - "div", - { - class: [ - "flag", - "size-" + _vm.size, - { "border-radius": _vm.hasBorderRadius }, - { border: _vm.hasBorder }, - { "drop-shadow": _vm.hasDropShadow }, - _vm.gradient, - _vm.className - ] - }, - [_c("img", { attrs: { src: _vm.imageUrl } })] - ) -}; -var __vue_staticRenderFns__ = []; -__vue_render__._withStripped = true; - - /* style */ - const __vue_inject_styles__ = function (inject) { - if (!inject) return - inject("data-v-36ffd0fb_0", { source: ".flag[data-v-36ffd0fb] {\n display: inline-block;\n overflow: hidden;\n position: relative;\n box-sizing: border-box;\n}\n.flag.size-s[data-v-36ffd0fb] {\n width: 16px;\n height: 12px;\n}\n.flag.size-s.drop-shadow[data-v-36ffd0fb] {\n box-shadow: 0 0 1px 0.5px rgba(0, 0, 0, 0.1);\n}\n.flag.size-s.border-radius[data-v-36ffd0fb] {\n border-radius: 1px;\n}\n.flag.size-m[data-v-36ffd0fb] {\n width: 20px;\n height: 15px;\n}\n.flag.size-m.drop-shadow[data-v-36ffd0fb] {\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);\n}\n.flag.size-m.border-radius[data-v-36ffd0fb] {\n border-radius: 1.5px;\n}\n.flag.size-l[data-v-36ffd0fb] {\n width: 32px;\n height: 24px;\n}\n.flag.size-l.drop-shadow[data-v-36ffd0fb] {\n box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.1);\n}\n.flag.size-l.border-radius[data-v-36ffd0fb] {\n border-radius: 2px;\n}\n.flag.border[data-v-36ffd0fb]::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n border: 1px solid rgba(0, 0, 0, 0.5);\n mix-blend-mode: overlay;\n}\n.flag.border-radius[data-v-36ffd0fb]::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n border-radius: 1px;\n}\n.flag.top-down[data-v-36ffd0fb]::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.3) 2%, rgba(255, 255, 255, 0.7) 100%);\n}\n.flag.real-linear[data-v-36ffd0fb]::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.2) 0%, rgba(39, 39, 39, 0.22) 11%, rgba(255, 255, 255, 0.3) 27%, rgba(0, 0, 0, 0.24) 41%, rgba(0, 0, 0, 0.55) 52%, rgba(255, 255, 255, 0.26) 63%, rgba(0, 0, 0, 0.27) 74%, rgba(255, 255, 255, 0.3) 100%);\n}\n.flag.real-circular[data-v-36ffd0fb]::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n background: radial-gradient(50% 36%, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.24) 11%, rgba(0, 0, 0, 0.55) 17%, rgba(255, 255, 255, 0.26) 22%, rgba(0, 0, 0, 0.17) 27%, rgba(255, 255, 255, 0.28) 31%, rgba(255, 255, 255, 0) 37%) center calc(50% - 8px)/600% 600%, radial-gradient(50% 123%, rgba(255, 255, 255, 0.3) 25%, rgba(0, 0, 0, 0.24) 48%, rgba(0, 0, 0, 0.55) 61%, rgba(255, 255, 255, 0.26) 72%, rgba(0, 0, 0, 0.17) 80%, rgba(255, 255, 255, 0.28) 88%, rgba(255, 255, 255, 0.3) 100%) center calc(50% - 8px)/600% 600%;\n}\n.flag img[data-v-36ffd0fb] {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n\n/*# sourceMappingURL=Flag.vue.map */", map: {"version":3,"sources":["/Users/donovanroubos/Code/Yummygum/vue-flagpack/src/Flag.vue","Flag.vue"],"names":[],"mappings":"AA0EA;EACA,qBAAA;EACA,gBAAA;EACA,kBAAA;EACA,sBAAA;ACzEA;AD4EA;EACA,WAAA;EACA,YAAA;AC1EA;AD4EA;EACA,4CAAA;AC1EA;AD6EA;EACA,kBAAA;AC3EA;AD+EA;EACA,WAAA;EACA,YAAA;AC7EA;AD+EA;EACA,0CAAA;AC7EA;ADgFA;EACA,oBAAA;AC9EA;ADkFA;EACA,WAAA;EACA,YAAA;AChFA;ADkFA;EACA,0CAAA;AChFA;ADmFA;EACA,kBAAA;ACjFA;ADuFA;EAzDA,WAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,cAAA;EACA,uBAAA;EACA,sBAAA;EAqDA,oCAAA;EACA,uBAAA;AC/EA;ADoFA;EAjEA,WAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,cAAA;EACA,uBAAA;EACA,sBAAA;EA6DA,kBAAA;AC5EA;ADiFA;EAxEA,WAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,cAAA;EACA,uBAAA;EACA,sBAAA;EAoEA,6FAAA;ACzEA;AD8EA;EA/EA,WAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,cAAA;EACA,uBAAA;EACA,sBAAA;EA2EA,kQAAA;ACtEA;AD2EA;EAtFA,WAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,cAAA;EACA,uBAAA;EACA,sBAAA;EAkFA,ygBAAA;ACnEA;ADwEA;EACA,cAAA;EACA,WAAA;EACA,YAAA;EACA,iBAAA;ACtEA;;AAEA,mCAAmC","file":"Flag.vue","sourcesContent":["\n\n\n\n\n",".flag {\n display: inline-block;\n overflow: hidden;\n position: relative;\n box-sizing: border-box;\n}\n.flag.size-s {\n width: 16px;\n height: 12px;\n}\n.flag.size-s.drop-shadow {\n box-shadow: 0 0 1px 0.5px rgba(0, 0, 0, 0.1);\n}\n.flag.size-s.border-radius {\n border-radius: 1px;\n}\n.flag.size-m {\n width: 20px;\n height: 15px;\n}\n.flag.size-m.drop-shadow {\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);\n}\n.flag.size-m.border-radius {\n border-radius: 1.5px;\n}\n.flag.size-l {\n width: 32px;\n height: 24px;\n}\n.flag.size-l.drop-shadow {\n box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.1);\n}\n.flag.size-l.border-radius {\n border-radius: 2px;\n}\n.flag.border::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n border: 1px solid rgba(0, 0, 0, 0.5);\n mix-blend-mode: overlay;\n}\n.flag.border-radius::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n border-radius: 1px;\n}\n.flag.top-down::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.3) 2%, rgba(255, 255, 255, 0.7) 100%);\n}\n.flag.real-linear::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.2) 0%, rgba(39, 39, 39, 0.22) 11%, rgba(255, 255, 255, 0.3) 27%, rgba(0, 0, 0, 0.24) 41%, rgba(0, 0, 0, 0.55) 52%, rgba(255, 255, 255, 0.26) 63%, rgba(0, 0, 0, 0.27) 74%, rgba(255, 255, 255, 0.3) 100%);\n}\n.flag.real-circular::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n background: radial-gradient(50% 36%, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.24) 11%, rgba(0, 0, 0, 0.55) 17%, rgba(255, 255, 255, 0.26) 22%, rgba(0, 0, 0, 0.17) 27%, rgba(255, 255, 255, 0.28) 31%, rgba(255, 255, 255, 0) 37%) center calc(50% - 8px)/600% 600%, radial-gradient(50% 123%, rgba(255, 255, 255, 0.3) 25%, rgba(0, 0, 0, 0.24) 48%, rgba(0, 0, 0, 0.55) 61%, rgba(255, 255, 255, 0.26) 72%, rgba(0, 0, 0, 0.17) 80%, rgba(255, 255, 255, 0.28) 88%, rgba(255, 255, 255, 0.3) 100%) center calc(50% - 8px)/600% 600%;\n}\n.flag img {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n\n/*# sourceMappingURL=Flag.vue.map */"]}, media: undefined }); - - }; - /* scoped */ - const __vue_scope_id__ = "data-v-36ffd0fb"; - /* module identifier */ - const __vue_module_identifier__ = undefined; - /* functional template */ - const __vue_is_functional_template__ = false; - /* style inject SSR */ - - /* style inject shadow dom */ - - - - const __vue_component__ = /*#__PURE__*/normalizeComponent( - { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ }, - __vue_inject_styles__, - __vue_script__, - __vue_scope_id__, - __vue_is_functional_template__, - __vue_module_identifier__, - false, - createInjector, - undefined, - undefined - ); - -module.exports = { - install: function install(Vue, options) { - Vue.component(options.name || 'vue-flagpack', __vue_component__); - } -}; +"use strict";var e=require("flagpack-core"),a={name:"Flag",computed:{imageUrl(){return e.imageUrl(e.isoToCountryCode(this.code).toUpperCase(),this.size.toLowerCase())}},props:{size:{type:String,default:"m",validator:e=>-1!==["s","m","l"].indexOf(e)},code:{type:String,default:"528"},hasDropShadow:{type:Boolean,default:!1},hasBorder:{type:Boolean,default:!0},hasBorderRadius:{type:Boolean,default:!0},gradient:{type:String,validator:e=>-1!==["top-down","real-linear","real-circular"].indexOf(e)},className:{type:String}}};function t(e,a,t,o,r,i,d,n,s,l){"boolean"!=typeof d&&(s=n,n=d,d=!1);const b="function"==typeof t?t.options:t;let g;if(e&&e.render&&(b.render=e.render,b.staticRenderFns=e.staticRenderFns,b._compiled=!0,r&&(b.functional=!0)),o&&(b._scopeId=o),i?(g=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),a&&a.call(this,s(e)),e&&e._registeredComponents&&e._registeredComponents.add(i)},b._ssrRegister=g):a&&(g=d?function(e){a.call(this,l(e,this.$root.$options.shadowRoot))}:function(e){a.call(this,n(e))}),g)if(b.functional){const e=b.render;b.render=function(a,t){return g.call(t),e(a,t)}}else{const e=b.beforeCreate;b.beforeCreate=e?[].concat(e,g):[g]}return t}const o="undefined"!=typeof navigator&&/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());function r(e){return(e,a)=>function(e,a){const t=o?a.media||"default":e,r=d[t]||(d[t]={ids:new Set,styles:[]});if(!r.ids.has(e)){r.ids.add(e);let t=a.source;if(a.map&&(t+="\n/*# sourceURL="+a.map.sources[0]+" */",t+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(a.map))))+" */"),r.element||(r.element=document.createElement("style"),r.element.type="text/css",a.media&&r.element.setAttribute("media",a.media),void 0===i&&(i=document.head||document.getElementsByTagName("head")[0]),i.appendChild(r.element)),"styleSheet"in r.element)r.styles.push(t),r.element.styleSheet.cssText=r.styles.filter(Boolean).join("\n");else{const e=r.ids.size-1,a=document.createTextNode(t),o=r.element.childNodes;o[e]&&r.element.removeChild(o[e]),o.length?r.element.insertBefore(a,o[e]):r.element.appendChild(a)}}}(e,a)}let i;const d={};const n=t({render:function(){var e=this,a=e.$createElement,t=e._self._c||a;return t("div",{class:["flag","size-"+e.size,{"border-radius":e.hasBorderRadius},{border:e.hasBorder},{"drop-shadow":e.hasDropShadow},e.gradient,e.className]},[t("img",{attrs:{src:e.imageUrl}})])},staticRenderFns:[]},(function(e){e&&e("data-v-70e8b538_0",{source:'.flag[data-v-70e8b538]{display:inline-block;overflow:hidden;position:relative;box-sizing:border-box}.flag.size-s[data-v-70e8b538]{width:16px;height:12px}.flag.size-s.drop-shadow[data-v-70e8b538]{box-shadow:0 0 1px .5px rgba(0,0,0,.1)}.flag.size-s.border-radius[data-v-70e8b538]{border-radius:1px}.flag.size-m[data-v-70e8b538]{width:20px;height:15px}.flag.size-m.drop-shadow[data-v-70e8b538]{box-shadow:0 1px 2px 0 rgba(0,0,0,.1)}.flag.size-m.border-radius[data-v-70e8b538]{border-radius:1.5px}.flag.size-l[data-v-70e8b538]{width:32px;height:24px}.flag.size-l.drop-shadow[data-v-70e8b538]{box-shadow:0 2px 3px 0 rgba(0,0,0,.1)}.flag.size-l.border-radius[data-v-70e8b538]{border-radius:2px}.flag.border[data-v-70e8b538]::before{content:"";width:100%;height:100%;position:absolute;display:block;mix-blend-mode:overlay;box-sizing:border-box;border:1px solid rgba(0,0,0,.5);mix-blend-mode:overlay}.flag.border-radius[data-v-70e8b538]::before{content:"";width:100%;height:100%;position:absolute;display:block;mix-blend-mode:overlay;box-sizing:border-box;border-radius:1px}.flag.top-down[data-v-70e8b538]::before{content:"";width:100%;height:100%;position:absolute;display:block;mix-blend-mode:overlay;box-sizing:border-box;background-image:linear-gradient(0deg,rgba(0,0,0,.3) 2%,rgba(255,255,255,.7) 100%)}.flag.real-linear[data-v-70e8b538]::before{content:"";width:100%;height:100%;position:absolute;display:block;mix-blend-mode:overlay;box-sizing:border-box;background-image:linear-gradient(45deg,rgba(0,0,0,.2) 0,rgba(39,39,39,.22) 11%,rgba(255,255,255,.3) 27%,rgba(0,0,0,.24) 41%,rgba(0,0,0,.55) 52%,rgba(255,255,255,.26) 63%,rgba(0,0,0,.27) 74%,rgba(255,255,255,.3) 100%)}.flag.real-circular[data-v-70e8b538]::before{content:"";width:100%;height:100%;position:absolute;display:block;mix-blend-mode:overlay;box-sizing:border-box;background:radial-gradient(50% 36%,rgba(255,255,255,.3) 0,rgba(0,0,0,.24) 11%,rgba(0,0,0,.55) 17%,rgba(255,255,255,.26) 22%,rgba(0,0,0,.17) 27%,rgba(255,255,255,.28) 31%,rgba(255,255,255,0) 37%) center calc(50% - 8px)/600% 600%,radial-gradient(50% 123%,rgba(255,255,255,.3) 25%,rgba(0,0,0,.24) 48%,rgba(0,0,0,.55) 61%,rgba(255,255,255,.26) 72%,rgba(0,0,0,.17) 80%,rgba(255,255,255,.28) 88%,rgba(255,255,255,.3) 100%) center calc(50% - 8px)/600% 600%}.flag img[data-v-70e8b538]{display:block;width:100%;height:100%;object-fit:cover}',map:void 0,media:void 0})}),a,"data-v-70e8b538",false,undefined,!1,r,void 0,void 0);module.exports={install:function(e,a){e.component(a.name||"vue-flagpack",n)}}; diff --git a/dist/vue-flag-rollup.esm.js b/dist/vue-flag-rollup.esm.js index 4fee68a..a2de1af 100644 --- a/dist/vue-flag-rollup.esm.js +++ b/dist/vue-flag-rollup.esm.js @@ -1,239 +1 @@ -import { imageUrl, isoToCountryCode } from 'flagpack-core'; - -// - -var script = { - name: 'Flag', - computed: { - imageUrl () { - const url = imageUrl(isoToCountryCode(this.code).toUpperCase(), this.size.toLowerCase()); - return url - } - }, - props: { - size: { - type: String, - default: 'm', - validator: value => ( - ['s', 'm', 'l'].indexOf(value) !== -1 - ), - }, - code: { - type: String, - default: '528' - }, - hasDropShadow: { - type: Boolean, - default: false, - }, - hasBorder: { - type: Boolean, - default: true - }, - hasBorderRadius: { - type: Boolean, - default: true, - }, - gradient: { - type: String, - validator: value => ( - ['top-down', 'real-linear', 'real-circular'].indexOf(value) !== -1 - ), - }, - className: { - type: String - } - }, -}; - -function normalizeComponent(template, style, script, scopeId, isFunctionalTemplate, moduleIdentifier /* server only */, shadowMode, createInjector, createInjectorSSR, createInjectorShadow) { - if (typeof shadowMode !== 'boolean') { - createInjectorSSR = createInjector; - createInjector = shadowMode; - shadowMode = false; - } - // Vue.extend constructor export interop. - const options = typeof script === 'function' ? script.options : script; - // render functions - if (template && template.render) { - options.render = template.render; - options.staticRenderFns = template.staticRenderFns; - options._compiled = true; - // functional template - if (isFunctionalTemplate) { - options.functional = true; - } - } - // scopedId - if (scopeId) { - options._scopeId = scopeId; - } - let hook; - if (moduleIdentifier) { - // server build - hook = function (context) { - // 2.3 injection - context = - context || // cached call - (this.$vnode && this.$vnode.ssrContext) || // stateful - (this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext); // functional - // 2.2 with runInNewContext: true - if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') { - context = __VUE_SSR_CONTEXT__; - } - // inject component styles - if (style) { - style.call(this, createInjectorSSR(context)); - } - // register component module identifier for async chunk inference - if (context && context._registeredComponents) { - context._registeredComponents.add(moduleIdentifier); - } - }; - // used by ssr in case component is cached and beforeCreate - // never gets called - options._ssrRegister = hook; - } - else if (style) { - hook = shadowMode - ? function (context) { - style.call(this, createInjectorShadow(context, this.$root.$options.shadowRoot)); - } - : function (context) { - style.call(this, createInjector(context)); - }; - } - if (hook) { - if (options.functional) { - // register for functional component in vue file - const originalRender = options.render; - options.render = function renderWithStyleInjection(h, context) { - hook.call(context); - return originalRender(h, context); - }; - } - else { - // inject component registration as beforeCreate hook - const existing = options.beforeCreate; - options.beforeCreate = existing ? [].concat(existing, hook) : [hook]; - } - } - return script; -} - -const isOldIE = typeof navigator !== 'undefined' && - /msie [6-9]\\b/.test(navigator.userAgent.toLowerCase()); -function createInjector(context) { - return (id, style) => addStyle(id, style); -} -let HEAD; -const styles = {}; -function addStyle(id, css) { - const group = isOldIE ? css.media || 'default' : id; - const style = styles[group] || (styles[group] = { ids: new Set(), styles: [] }); - if (!style.ids.has(id)) { - style.ids.add(id); - let code = css.source; - if (css.map) { - // https://developer.chrome.com/devtools/docs/javascript-debugging - // this makes source maps inside style tags work properly in Chrome - code += '\n/*# sourceURL=' + css.map.sources[0] + ' */'; - // http://stackoverflow.com/a/26603875 - code += - '\n/*# sourceMappingURL=data:application/json;base64,' + - btoa(unescape(encodeURIComponent(JSON.stringify(css.map)))) + - ' */'; - } - if (!style.element) { - style.element = document.createElement('style'); - style.element.type = 'text/css'; - if (css.media) - style.element.setAttribute('media', css.media); - if (HEAD === undefined) { - HEAD = document.head || document.getElementsByTagName('head')[0]; - } - HEAD.appendChild(style.element); - } - if ('styleSheet' in style.element) { - style.styles.push(code); - style.element.styleSheet.cssText = style.styles - .filter(Boolean) - .join('\n'); - } - else { - const index = style.ids.size - 1; - const textNode = document.createTextNode(code); - const nodes = style.element.childNodes; - if (nodes[index]) - style.element.removeChild(nodes[index]); - if (nodes.length) - style.element.insertBefore(textNode, nodes[index]); - else - style.element.appendChild(textNode); - } - } -} - -/* script */ -const __vue_script__ = script; - -/* template */ -var __vue_render__ = function() { - var _vm = this; - var _h = _vm.$createElement; - var _c = _vm._self._c || _h; - return _c( - "div", - { - class: [ - "flag", - "size-" + _vm.size, - { "border-radius": _vm.hasBorderRadius }, - { border: _vm.hasBorder }, - { "drop-shadow": _vm.hasDropShadow }, - _vm.gradient, - _vm.className - ] - }, - [_c("img", { attrs: { src: _vm.imageUrl } })] - ) -}; -var __vue_staticRenderFns__ = []; -__vue_render__._withStripped = true; - - /* style */ - const __vue_inject_styles__ = function (inject) { - if (!inject) return - inject("data-v-36ffd0fb_0", { source: ".flag[data-v-36ffd0fb] {\n display: inline-block;\n overflow: hidden;\n position: relative;\n box-sizing: border-box;\n}\n.flag.size-s[data-v-36ffd0fb] {\n width: 16px;\n height: 12px;\n}\n.flag.size-s.drop-shadow[data-v-36ffd0fb] {\n box-shadow: 0 0 1px 0.5px rgba(0, 0, 0, 0.1);\n}\n.flag.size-s.border-radius[data-v-36ffd0fb] {\n border-radius: 1px;\n}\n.flag.size-m[data-v-36ffd0fb] {\n width: 20px;\n height: 15px;\n}\n.flag.size-m.drop-shadow[data-v-36ffd0fb] {\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);\n}\n.flag.size-m.border-radius[data-v-36ffd0fb] {\n border-radius: 1.5px;\n}\n.flag.size-l[data-v-36ffd0fb] {\n width: 32px;\n height: 24px;\n}\n.flag.size-l.drop-shadow[data-v-36ffd0fb] {\n box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.1);\n}\n.flag.size-l.border-radius[data-v-36ffd0fb] {\n border-radius: 2px;\n}\n.flag.border[data-v-36ffd0fb]::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n border: 1px solid rgba(0, 0, 0, 0.5);\n mix-blend-mode: overlay;\n}\n.flag.border-radius[data-v-36ffd0fb]::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n border-radius: 1px;\n}\n.flag.top-down[data-v-36ffd0fb]::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.3) 2%, rgba(255, 255, 255, 0.7) 100%);\n}\n.flag.real-linear[data-v-36ffd0fb]::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.2) 0%, rgba(39, 39, 39, 0.22) 11%, rgba(255, 255, 255, 0.3) 27%, rgba(0, 0, 0, 0.24) 41%, rgba(0, 0, 0, 0.55) 52%, rgba(255, 255, 255, 0.26) 63%, rgba(0, 0, 0, 0.27) 74%, rgba(255, 255, 255, 0.3) 100%);\n}\n.flag.real-circular[data-v-36ffd0fb]::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n background: radial-gradient(50% 36%, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.24) 11%, rgba(0, 0, 0, 0.55) 17%, rgba(255, 255, 255, 0.26) 22%, rgba(0, 0, 0, 0.17) 27%, rgba(255, 255, 255, 0.28) 31%, rgba(255, 255, 255, 0) 37%) center calc(50% - 8px)/600% 600%, radial-gradient(50% 123%, rgba(255, 255, 255, 0.3) 25%, rgba(0, 0, 0, 0.24) 48%, rgba(0, 0, 0, 0.55) 61%, rgba(255, 255, 255, 0.26) 72%, rgba(0, 0, 0, 0.17) 80%, rgba(255, 255, 255, 0.28) 88%, rgba(255, 255, 255, 0.3) 100%) center calc(50% - 8px)/600% 600%;\n}\n.flag img[data-v-36ffd0fb] {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n\n/*# sourceMappingURL=Flag.vue.map */", map: {"version":3,"sources":["/Users/donovanroubos/Code/Yummygum/vue-flagpack/src/Flag.vue","Flag.vue"],"names":[],"mappings":"AA0EA;EACA,qBAAA;EACA,gBAAA;EACA,kBAAA;EACA,sBAAA;ACzEA;AD4EA;EACA,WAAA;EACA,YAAA;AC1EA;AD4EA;EACA,4CAAA;AC1EA;AD6EA;EACA,kBAAA;AC3EA;AD+EA;EACA,WAAA;EACA,YAAA;AC7EA;AD+EA;EACA,0CAAA;AC7EA;ADgFA;EACA,oBAAA;AC9EA;ADkFA;EACA,WAAA;EACA,YAAA;AChFA;ADkFA;EACA,0CAAA;AChFA;ADmFA;EACA,kBAAA;ACjFA;ADuFA;EAzDA,WAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,cAAA;EACA,uBAAA;EACA,sBAAA;EAqDA,oCAAA;EACA,uBAAA;AC/EA;ADoFA;EAjEA,WAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,cAAA;EACA,uBAAA;EACA,sBAAA;EA6DA,kBAAA;AC5EA;ADiFA;EAxEA,WAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,cAAA;EACA,uBAAA;EACA,sBAAA;EAoEA,6FAAA;ACzEA;AD8EA;EA/EA,WAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,cAAA;EACA,uBAAA;EACA,sBAAA;EA2EA,kQAAA;ACtEA;AD2EA;EAtFA,WAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,cAAA;EACA,uBAAA;EACA,sBAAA;EAkFA,ygBAAA;ACnEA;ADwEA;EACA,cAAA;EACA,WAAA;EACA,YAAA;EACA,iBAAA;ACtEA;;AAEA,mCAAmC","file":"Flag.vue","sourcesContent":["\n\n\n\n\n",".flag {\n display: inline-block;\n overflow: hidden;\n position: relative;\n box-sizing: border-box;\n}\n.flag.size-s {\n width: 16px;\n height: 12px;\n}\n.flag.size-s.drop-shadow {\n box-shadow: 0 0 1px 0.5px rgba(0, 0, 0, 0.1);\n}\n.flag.size-s.border-radius {\n border-radius: 1px;\n}\n.flag.size-m {\n width: 20px;\n height: 15px;\n}\n.flag.size-m.drop-shadow {\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);\n}\n.flag.size-m.border-radius {\n border-radius: 1.5px;\n}\n.flag.size-l {\n width: 32px;\n height: 24px;\n}\n.flag.size-l.drop-shadow {\n box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.1);\n}\n.flag.size-l.border-radius {\n border-radius: 2px;\n}\n.flag.border::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n border: 1px solid rgba(0, 0, 0, 0.5);\n mix-blend-mode: overlay;\n}\n.flag.border-radius::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n border-radius: 1px;\n}\n.flag.top-down::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.3) 2%, rgba(255, 255, 255, 0.7) 100%);\n}\n.flag.real-linear::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.2) 0%, rgba(39, 39, 39, 0.22) 11%, rgba(255, 255, 255, 0.3) 27%, rgba(0, 0, 0, 0.24) 41%, rgba(0, 0, 0, 0.55) 52%, rgba(255, 255, 255, 0.26) 63%, rgba(0, 0, 0, 0.27) 74%, rgba(255, 255, 255, 0.3) 100%);\n}\n.flag.real-circular::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n background: radial-gradient(50% 36%, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.24) 11%, rgba(0, 0, 0, 0.55) 17%, rgba(255, 255, 255, 0.26) 22%, rgba(0, 0, 0, 0.17) 27%, rgba(255, 255, 255, 0.28) 31%, rgba(255, 255, 255, 0) 37%) center calc(50% - 8px)/600% 600%, radial-gradient(50% 123%, rgba(255, 255, 255, 0.3) 25%, rgba(0, 0, 0, 0.24) 48%, rgba(0, 0, 0, 0.55) 61%, rgba(255, 255, 255, 0.26) 72%, rgba(0, 0, 0, 0.17) 80%, rgba(255, 255, 255, 0.28) 88%, rgba(255, 255, 255, 0.3) 100%) center calc(50% - 8px)/600% 600%;\n}\n.flag img {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n\n/*# sourceMappingURL=Flag.vue.map */"]}, media: undefined }); - - }; - /* scoped */ - const __vue_scope_id__ = "data-v-36ffd0fb"; - /* module identifier */ - const __vue_module_identifier__ = undefined; - /* functional template */ - const __vue_is_functional_template__ = false; - /* style inject SSR */ - - /* style inject shadow dom */ - - - - const __vue_component__ = /*#__PURE__*/normalizeComponent( - { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ }, - __vue_inject_styles__, - __vue_script__, - __vue_scope_id__, - __vue_is_functional_template__, - __vue_module_identifier__, - false, - createInjector, - undefined, - undefined - ); - -module.exports = { - install: function install(Vue, options) { - Vue.component(options.name || 'vue-flagpack', __vue_component__); - } -}; +import{imageUrl as e,isoToCountryCode as a}from"flagpack-core";var t={name:"Flag",computed:{imageUrl(){return e(a(this.code).toUpperCase(),this.size.toLowerCase())}},props:{size:{type:String,default:"m",validator:e=>-1!==["s","m","l"].indexOf(e)},code:{type:String,default:"528"},hasDropShadow:{type:Boolean,default:!1},hasBorder:{type:Boolean,default:!0},hasBorderRadius:{type:Boolean,default:!0},gradient:{type:String,validator:e=>-1!==["top-down","real-linear","real-circular"].indexOf(e)},className:{type:String}}};function o(e,a,t,o,r,i,d,n,s,l){"boolean"!=typeof d&&(s=n,n=d,d=!1);const b="function"==typeof t?t.options:t;let g;if(e&&e.render&&(b.render=e.render,b.staticRenderFns=e.staticRenderFns,b._compiled=!0,r&&(b.functional=!0)),o&&(b._scopeId=o),i?(g=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),a&&a.call(this,s(e)),e&&e._registeredComponents&&e._registeredComponents.add(i)},b._ssrRegister=g):a&&(g=d?function(e){a.call(this,l(e,this.$root.$options.shadowRoot))}:function(e){a.call(this,n(e))}),g)if(b.functional){const e=b.render;b.render=function(a,t){return g.call(t),e(a,t)}}else{const e=b.beforeCreate;b.beforeCreate=e?[].concat(e,g):[g]}return t}const r="undefined"!=typeof navigator&&/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());function i(e){return(e,a)=>function(e,a){const t=r?a.media||"default":e,o=n[t]||(n[t]={ids:new Set,styles:[]});if(!o.ids.has(e)){o.ids.add(e);let t=a.source;if(a.map&&(t+="\n/*# sourceURL="+a.map.sources[0]+" */",t+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(a.map))))+" */"),o.element||(o.element=document.createElement("style"),o.element.type="text/css",a.media&&o.element.setAttribute("media",a.media),void 0===d&&(d=document.head||document.getElementsByTagName("head")[0]),d.appendChild(o.element)),"styleSheet"in o.element)o.styles.push(t),o.element.styleSheet.cssText=o.styles.filter(Boolean).join("\n");else{const e=o.ids.size-1,a=document.createTextNode(t),r=o.element.childNodes;r[e]&&o.element.removeChild(r[e]),r.length?o.element.insertBefore(a,r[e]):o.element.appendChild(a)}}}(e,a)}let d;const n={};const s=o({render:function(){var e=this,a=e.$createElement,t=e._self._c||a;return t("div",{class:["flag","size-"+e.size,{"border-radius":e.hasBorderRadius},{border:e.hasBorder},{"drop-shadow":e.hasDropShadow},e.gradient,e.className]},[t("img",{attrs:{src:e.imageUrl}})])},staticRenderFns:[]},(function(e){e&&e("data-v-70e8b538_0",{source:'.flag[data-v-70e8b538]{display:inline-block;overflow:hidden;position:relative;box-sizing:border-box}.flag.size-s[data-v-70e8b538]{width:16px;height:12px}.flag.size-s.drop-shadow[data-v-70e8b538]{box-shadow:0 0 1px .5px rgba(0,0,0,.1)}.flag.size-s.border-radius[data-v-70e8b538]{border-radius:1px}.flag.size-m[data-v-70e8b538]{width:20px;height:15px}.flag.size-m.drop-shadow[data-v-70e8b538]{box-shadow:0 1px 2px 0 rgba(0,0,0,.1)}.flag.size-m.border-radius[data-v-70e8b538]{border-radius:1.5px}.flag.size-l[data-v-70e8b538]{width:32px;height:24px}.flag.size-l.drop-shadow[data-v-70e8b538]{box-shadow:0 2px 3px 0 rgba(0,0,0,.1)}.flag.size-l.border-radius[data-v-70e8b538]{border-radius:2px}.flag.border[data-v-70e8b538]::before{content:"";width:100%;height:100%;position:absolute;display:block;mix-blend-mode:overlay;box-sizing:border-box;border:1px solid rgba(0,0,0,.5);mix-blend-mode:overlay}.flag.border-radius[data-v-70e8b538]::before{content:"";width:100%;height:100%;position:absolute;display:block;mix-blend-mode:overlay;box-sizing:border-box;border-radius:1px}.flag.top-down[data-v-70e8b538]::before{content:"";width:100%;height:100%;position:absolute;display:block;mix-blend-mode:overlay;box-sizing:border-box;background-image:linear-gradient(0deg,rgba(0,0,0,.3) 2%,rgba(255,255,255,.7) 100%)}.flag.real-linear[data-v-70e8b538]::before{content:"";width:100%;height:100%;position:absolute;display:block;mix-blend-mode:overlay;box-sizing:border-box;background-image:linear-gradient(45deg,rgba(0,0,0,.2) 0,rgba(39,39,39,.22) 11%,rgba(255,255,255,.3) 27%,rgba(0,0,0,.24) 41%,rgba(0,0,0,.55) 52%,rgba(255,255,255,.26) 63%,rgba(0,0,0,.27) 74%,rgba(255,255,255,.3) 100%)}.flag.real-circular[data-v-70e8b538]::before{content:"";width:100%;height:100%;position:absolute;display:block;mix-blend-mode:overlay;box-sizing:border-box;background:radial-gradient(50% 36%,rgba(255,255,255,.3) 0,rgba(0,0,0,.24) 11%,rgba(0,0,0,.55) 17%,rgba(255,255,255,.26) 22%,rgba(0,0,0,.17) 27%,rgba(255,255,255,.28) 31%,rgba(255,255,255,0) 37%) center calc(50% - 8px)/600% 600%,radial-gradient(50% 123%,rgba(255,255,255,.3) 25%,rgba(0,0,0,.24) 48%,rgba(0,0,0,.55) 61%,rgba(255,255,255,.26) 72%,rgba(0,0,0,.17) 80%,rgba(255,255,255,.28) 88%,rgba(255,255,255,.3) 100%) center calc(50% - 8px)/600% 600%}.flag img[data-v-70e8b538]{display:block;width:100%;height:100%;object-fit:cover}',map:void 0,media:void 0})}),t,"data-v-70e8b538",false,undefined,!1,i,void 0,void 0);module.exports={install:function(e,a){e.component(a.name||"vue-flagpack",s)}}; diff --git a/dist/vue-flag-rollup.iife.js b/dist/vue-flag-rollup.iife.js index d55b724..8147712 100644 --- a/dist/vue-flag-rollup.iife.js +++ b/dist/vue-flag-rollup.iife.js @@ -1,242 +1 @@ -(function (flagpackCore) { - 'use strict'; - - // - - var script = { - name: 'Flag', - computed: { - imageUrl () { - const url = flagpackCore.imageUrl(flagpackCore.isoToCountryCode(this.code).toUpperCase(), this.size.toLowerCase()); - return url - } - }, - props: { - size: { - type: String, - default: 'm', - validator: value => ( - ['s', 'm', 'l'].indexOf(value) !== -1 - ), - }, - code: { - type: String, - default: '528' - }, - hasDropShadow: { - type: Boolean, - default: false, - }, - hasBorder: { - type: Boolean, - default: true - }, - hasBorderRadius: { - type: Boolean, - default: true, - }, - gradient: { - type: String, - validator: value => ( - ['top-down', 'real-linear', 'real-circular'].indexOf(value) !== -1 - ), - }, - className: { - type: String - } - }, - }; - - function normalizeComponent(template, style, script, scopeId, isFunctionalTemplate, moduleIdentifier /* server only */, shadowMode, createInjector, createInjectorSSR, createInjectorShadow) { - if (typeof shadowMode !== 'boolean') { - createInjectorSSR = createInjector; - createInjector = shadowMode; - shadowMode = false; - } - // Vue.extend constructor export interop. - const options = typeof script === 'function' ? script.options : script; - // render functions - if (template && template.render) { - options.render = template.render; - options.staticRenderFns = template.staticRenderFns; - options._compiled = true; - // functional template - if (isFunctionalTemplate) { - options.functional = true; - } - } - // scopedId - if (scopeId) { - options._scopeId = scopeId; - } - let hook; - if (moduleIdentifier) { - // server build - hook = function (context) { - // 2.3 injection - context = - context || // cached call - (this.$vnode && this.$vnode.ssrContext) || // stateful - (this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext); // functional - // 2.2 with runInNewContext: true - if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') { - context = __VUE_SSR_CONTEXT__; - } - // inject component styles - if (style) { - style.call(this, createInjectorSSR(context)); - } - // register component module identifier for async chunk inference - if (context && context._registeredComponents) { - context._registeredComponents.add(moduleIdentifier); - } - }; - // used by ssr in case component is cached and beforeCreate - // never gets called - options._ssrRegister = hook; - } - else if (style) { - hook = shadowMode - ? function (context) { - style.call(this, createInjectorShadow(context, this.$root.$options.shadowRoot)); - } - : function (context) { - style.call(this, createInjector(context)); - }; - } - if (hook) { - if (options.functional) { - // register for functional component in vue file - const originalRender = options.render; - options.render = function renderWithStyleInjection(h, context) { - hook.call(context); - return originalRender(h, context); - }; - } - else { - // inject component registration as beforeCreate hook - const existing = options.beforeCreate; - options.beforeCreate = existing ? [].concat(existing, hook) : [hook]; - } - } - return script; - } - - const isOldIE = typeof navigator !== 'undefined' && - /msie [6-9]\\b/.test(navigator.userAgent.toLowerCase()); - function createInjector(context) { - return (id, style) => addStyle(id, style); - } - let HEAD; - const styles = {}; - function addStyle(id, css) { - const group = isOldIE ? css.media || 'default' : id; - const style = styles[group] || (styles[group] = { ids: new Set(), styles: [] }); - if (!style.ids.has(id)) { - style.ids.add(id); - let code = css.source; - if (css.map) { - // https://developer.chrome.com/devtools/docs/javascript-debugging - // this makes source maps inside style tags work properly in Chrome - code += '\n/*# sourceURL=' + css.map.sources[0] + ' */'; - // http://stackoverflow.com/a/26603875 - code += - '\n/*# sourceMappingURL=data:application/json;base64,' + - btoa(unescape(encodeURIComponent(JSON.stringify(css.map)))) + - ' */'; - } - if (!style.element) { - style.element = document.createElement('style'); - style.element.type = 'text/css'; - if (css.media) - style.element.setAttribute('media', css.media); - if (HEAD === undefined) { - HEAD = document.head || document.getElementsByTagName('head')[0]; - } - HEAD.appendChild(style.element); - } - if ('styleSheet' in style.element) { - style.styles.push(code); - style.element.styleSheet.cssText = style.styles - .filter(Boolean) - .join('\n'); - } - else { - const index = style.ids.size - 1; - const textNode = document.createTextNode(code); - const nodes = style.element.childNodes; - if (nodes[index]) - style.element.removeChild(nodes[index]); - if (nodes.length) - style.element.insertBefore(textNode, nodes[index]); - else - style.element.appendChild(textNode); - } - } - } - - /* script */ - const __vue_script__ = script; - - /* template */ - var __vue_render__ = function() { - var _vm = this; - var _h = _vm.$createElement; - var _c = _vm._self._c || _h; - return _c( - "div", - { - class: [ - "flag", - "size-" + _vm.size, - { "border-radius": _vm.hasBorderRadius }, - { border: _vm.hasBorder }, - { "drop-shadow": _vm.hasDropShadow }, - _vm.gradient, - _vm.className - ] - }, - [_c("img", { attrs: { src: _vm.imageUrl } })] - ) - }; - var __vue_staticRenderFns__ = []; - __vue_render__._withStripped = true; - - /* style */ - const __vue_inject_styles__ = function (inject) { - if (!inject) return - inject("data-v-36ffd0fb_0", { source: ".flag[data-v-36ffd0fb] {\n display: inline-block;\n overflow: hidden;\n position: relative;\n box-sizing: border-box;\n}\n.flag.size-s[data-v-36ffd0fb] {\n width: 16px;\n height: 12px;\n}\n.flag.size-s.drop-shadow[data-v-36ffd0fb] {\n box-shadow: 0 0 1px 0.5px rgba(0, 0, 0, 0.1);\n}\n.flag.size-s.border-radius[data-v-36ffd0fb] {\n border-radius: 1px;\n}\n.flag.size-m[data-v-36ffd0fb] {\n width: 20px;\n height: 15px;\n}\n.flag.size-m.drop-shadow[data-v-36ffd0fb] {\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);\n}\n.flag.size-m.border-radius[data-v-36ffd0fb] {\n border-radius: 1.5px;\n}\n.flag.size-l[data-v-36ffd0fb] {\n width: 32px;\n height: 24px;\n}\n.flag.size-l.drop-shadow[data-v-36ffd0fb] {\n box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.1);\n}\n.flag.size-l.border-radius[data-v-36ffd0fb] {\n border-radius: 2px;\n}\n.flag.border[data-v-36ffd0fb]::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n border: 1px solid rgba(0, 0, 0, 0.5);\n mix-blend-mode: overlay;\n}\n.flag.border-radius[data-v-36ffd0fb]::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n border-radius: 1px;\n}\n.flag.top-down[data-v-36ffd0fb]::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.3) 2%, rgba(255, 255, 255, 0.7) 100%);\n}\n.flag.real-linear[data-v-36ffd0fb]::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.2) 0%, rgba(39, 39, 39, 0.22) 11%, rgba(255, 255, 255, 0.3) 27%, rgba(0, 0, 0, 0.24) 41%, rgba(0, 0, 0, 0.55) 52%, rgba(255, 255, 255, 0.26) 63%, rgba(0, 0, 0, 0.27) 74%, rgba(255, 255, 255, 0.3) 100%);\n}\n.flag.real-circular[data-v-36ffd0fb]::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n background: radial-gradient(50% 36%, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.24) 11%, rgba(0, 0, 0, 0.55) 17%, rgba(255, 255, 255, 0.26) 22%, rgba(0, 0, 0, 0.17) 27%, rgba(255, 255, 255, 0.28) 31%, rgba(255, 255, 255, 0) 37%) center calc(50% - 8px)/600% 600%, radial-gradient(50% 123%, rgba(255, 255, 255, 0.3) 25%, rgba(0, 0, 0, 0.24) 48%, rgba(0, 0, 0, 0.55) 61%, rgba(255, 255, 255, 0.26) 72%, rgba(0, 0, 0, 0.17) 80%, rgba(255, 255, 255, 0.28) 88%, rgba(255, 255, 255, 0.3) 100%) center calc(50% - 8px)/600% 600%;\n}\n.flag img[data-v-36ffd0fb] {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n\n/*# sourceMappingURL=Flag.vue.map */", map: {"version":3,"sources":["/Users/donovanroubos/Code/Yummygum/vue-flagpack/src/Flag.vue","Flag.vue"],"names":[],"mappings":"AA0EA;EACA,qBAAA;EACA,gBAAA;EACA,kBAAA;EACA,sBAAA;ACzEA;AD4EA;EACA,WAAA;EACA,YAAA;AC1EA;AD4EA;EACA,4CAAA;AC1EA;AD6EA;EACA,kBAAA;AC3EA;AD+EA;EACA,WAAA;EACA,YAAA;AC7EA;AD+EA;EACA,0CAAA;AC7EA;ADgFA;EACA,oBAAA;AC9EA;ADkFA;EACA,WAAA;EACA,YAAA;AChFA;ADkFA;EACA,0CAAA;AChFA;ADmFA;EACA,kBAAA;ACjFA;ADuFA;EAzDA,WAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,cAAA;EACA,uBAAA;EACA,sBAAA;EAqDA,oCAAA;EACA,uBAAA;AC/EA;ADoFA;EAjEA,WAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,cAAA;EACA,uBAAA;EACA,sBAAA;EA6DA,kBAAA;AC5EA;ADiFA;EAxEA,WAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,cAAA;EACA,uBAAA;EACA,sBAAA;EAoEA,6FAAA;ACzEA;AD8EA;EA/EA,WAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,cAAA;EACA,uBAAA;EACA,sBAAA;EA2EA,kQAAA;ACtEA;AD2EA;EAtFA,WAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,cAAA;EACA,uBAAA;EACA,sBAAA;EAkFA,ygBAAA;ACnEA;ADwEA;EACA,cAAA;EACA,WAAA;EACA,YAAA;EACA,iBAAA;ACtEA;;AAEA,mCAAmC","file":"Flag.vue","sourcesContent":["\n\n\n\n\n",".flag {\n display: inline-block;\n overflow: hidden;\n position: relative;\n box-sizing: border-box;\n}\n.flag.size-s {\n width: 16px;\n height: 12px;\n}\n.flag.size-s.drop-shadow {\n box-shadow: 0 0 1px 0.5px rgba(0, 0, 0, 0.1);\n}\n.flag.size-s.border-radius {\n border-radius: 1px;\n}\n.flag.size-m {\n width: 20px;\n height: 15px;\n}\n.flag.size-m.drop-shadow {\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);\n}\n.flag.size-m.border-radius {\n border-radius: 1.5px;\n}\n.flag.size-l {\n width: 32px;\n height: 24px;\n}\n.flag.size-l.drop-shadow {\n box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.1);\n}\n.flag.size-l.border-radius {\n border-radius: 2px;\n}\n.flag.border::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n border: 1px solid rgba(0, 0, 0, 0.5);\n mix-blend-mode: overlay;\n}\n.flag.border-radius::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n border-radius: 1px;\n}\n.flag.top-down::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.3) 2%, rgba(255, 255, 255, 0.7) 100%);\n}\n.flag.real-linear::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.2) 0%, rgba(39, 39, 39, 0.22) 11%, rgba(255, 255, 255, 0.3) 27%, rgba(0, 0, 0, 0.24) 41%, rgba(0, 0, 0, 0.55) 52%, rgba(255, 255, 255, 0.26) 63%, rgba(0, 0, 0, 0.27) 74%, rgba(255, 255, 255, 0.3) 100%);\n}\n.flag.real-circular::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n display: block;\n mix-blend-mode: overlay;\n box-sizing: border-box;\n background: radial-gradient(50% 36%, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.24) 11%, rgba(0, 0, 0, 0.55) 17%, rgba(255, 255, 255, 0.26) 22%, rgba(0, 0, 0, 0.17) 27%, rgba(255, 255, 255, 0.28) 31%, rgba(255, 255, 255, 0) 37%) center calc(50% - 8px)/600% 600%, radial-gradient(50% 123%, rgba(255, 255, 255, 0.3) 25%, rgba(0, 0, 0, 0.24) 48%, rgba(0, 0, 0, 0.55) 61%, rgba(255, 255, 255, 0.26) 72%, rgba(0, 0, 0, 0.17) 80%, rgba(255, 255, 255, 0.28) 88%, rgba(255, 255, 255, 0.3) 100%) center calc(50% - 8px)/600% 600%;\n}\n.flag img {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n\n/*# sourceMappingURL=Flag.vue.map */"]}, media: undefined }); - - }; - /* scoped */ - const __vue_scope_id__ = "data-v-36ffd0fb"; - /* module identifier */ - const __vue_module_identifier__ = undefined; - /* functional template */ - const __vue_is_functional_template__ = false; - /* style inject SSR */ - - /* style inject shadow dom */ - - - - const __vue_component__ = /*#__PURE__*/normalizeComponent( - { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ }, - __vue_inject_styles__, - __vue_script__, - __vue_scope_id__, - __vue_is_functional_template__, - __vue_module_identifier__, - false, - createInjector, - undefined, - undefined - ); - - module.exports = { - install: function install(Vue, options) { - Vue.component(options.name || 'vue-flagpack', __vue_component__); - } - }; - -}(flagpackCore)); +!function(e){"use strict";var a={name:"Flag",computed:{imageUrl(){return e.imageUrl(e.isoToCountryCode(this.code).toUpperCase(),this.size.toLowerCase())}},props:{size:{type:String,default:"m",validator:e=>-1!==["s","m","l"].indexOf(e)},code:{type:String,default:"528"},hasDropShadow:{type:Boolean,default:!1},hasBorder:{type:Boolean,default:!0},hasBorderRadius:{type:Boolean,default:!0},gradient:{type:String,validator:e=>-1!==["top-down","real-linear","real-circular"].indexOf(e)},className:{type:String}}};function t(e,a,t,o,r,i,d,n,s,l){"boolean"!=typeof d&&(s=n,n=d,d=!1);const b="function"==typeof t?t.options:t;let g;if(e&&e.render&&(b.render=e.render,b.staticRenderFns=e.staticRenderFns,b._compiled=!0,r&&(b.functional=!0)),o&&(b._scopeId=o),i?(g=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),a&&a.call(this,s(e)),e&&e._registeredComponents&&e._registeredComponents.add(i)},b._ssrRegister=g):a&&(g=d?function(e){a.call(this,l(e,this.$root.$options.shadowRoot))}:function(e){a.call(this,n(e))}),g)if(b.functional){const e=b.render;b.render=function(a,t){return g.call(t),e(a,t)}}else{const e=b.beforeCreate;b.beforeCreate=e?[].concat(e,g):[g]}return t}const o="undefined"!=typeof navigator&&/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());function r(e){return(e,a)=>function(e,a){const t=o?a.media||"default":e,r=d[t]||(d[t]={ids:new Set,styles:[]});if(!r.ids.has(e)){r.ids.add(e);let t=a.source;if(a.map&&(t+="\n/*# sourceURL="+a.map.sources[0]+" */",t+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(a.map))))+" */"),r.element||(r.element=document.createElement("style"),r.element.type="text/css",a.media&&r.element.setAttribute("media",a.media),void 0===i&&(i=document.head||document.getElementsByTagName("head")[0]),i.appendChild(r.element)),"styleSheet"in r.element)r.styles.push(t),r.element.styleSheet.cssText=r.styles.filter(Boolean).join("\n");else{const e=r.ids.size-1,a=document.createTextNode(t),o=r.element.childNodes;o[e]&&r.element.removeChild(o[e]),o.length?r.element.insertBefore(a,o[e]):r.element.appendChild(a)}}}(e,a)}let i;const d={};const n=t({render:function(){var e=this,a=e.$createElement,t=e._self._c||a;return t("div",{class:["flag","size-"+e.size,{"border-radius":e.hasBorderRadius},{border:e.hasBorder},{"drop-shadow":e.hasDropShadow},e.gradient,e.className]},[t("img",{attrs:{src:e.imageUrl}})])},staticRenderFns:[]},(function(e){e&&e("data-v-70e8b538_0",{source:'.flag[data-v-70e8b538]{display:inline-block;overflow:hidden;position:relative;box-sizing:border-box}.flag.size-s[data-v-70e8b538]{width:16px;height:12px}.flag.size-s.drop-shadow[data-v-70e8b538]{box-shadow:0 0 1px .5px rgba(0,0,0,.1)}.flag.size-s.border-radius[data-v-70e8b538]{border-radius:1px}.flag.size-m[data-v-70e8b538]{width:20px;height:15px}.flag.size-m.drop-shadow[data-v-70e8b538]{box-shadow:0 1px 2px 0 rgba(0,0,0,.1)}.flag.size-m.border-radius[data-v-70e8b538]{border-radius:1.5px}.flag.size-l[data-v-70e8b538]{width:32px;height:24px}.flag.size-l.drop-shadow[data-v-70e8b538]{box-shadow:0 2px 3px 0 rgba(0,0,0,.1)}.flag.size-l.border-radius[data-v-70e8b538]{border-radius:2px}.flag.border[data-v-70e8b538]::before{content:"";width:100%;height:100%;position:absolute;display:block;mix-blend-mode:overlay;box-sizing:border-box;border:1px solid rgba(0,0,0,.5);mix-blend-mode:overlay}.flag.border-radius[data-v-70e8b538]::before{content:"";width:100%;height:100%;position:absolute;display:block;mix-blend-mode:overlay;box-sizing:border-box;border-radius:1px}.flag.top-down[data-v-70e8b538]::before{content:"";width:100%;height:100%;position:absolute;display:block;mix-blend-mode:overlay;box-sizing:border-box;background-image:linear-gradient(0deg,rgba(0,0,0,.3) 2%,rgba(255,255,255,.7) 100%)}.flag.real-linear[data-v-70e8b538]::before{content:"";width:100%;height:100%;position:absolute;display:block;mix-blend-mode:overlay;box-sizing:border-box;background-image:linear-gradient(45deg,rgba(0,0,0,.2) 0,rgba(39,39,39,.22) 11%,rgba(255,255,255,.3) 27%,rgba(0,0,0,.24) 41%,rgba(0,0,0,.55) 52%,rgba(255,255,255,.26) 63%,rgba(0,0,0,.27) 74%,rgba(255,255,255,.3) 100%)}.flag.real-circular[data-v-70e8b538]::before{content:"";width:100%;height:100%;position:absolute;display:block;mix-blend-mode:overlay;box-sizing:border-box;background:radial-gradient(50% 36%,rgba(255,255,255,.3) 0,rgba(0,0,0,.24) 11%,rgba(0,0,0,.55) 17%,rgba(255,255,255,.26) 22%,rgba(0,0,0,.17) 27%,rgba(255,255,255,.28) 31%,rgba(255,255,255,0) 37%) center calc(50% - 8px)/600% 600%,radial-gradient(50% 123%,rgba(255,255,255,.3) 25%,rgba(0,0,0,.24) 48%,rgba(0,0,0,.55) 61%,rgba(255,255,255,.26) 72%,rgba(0,0,0,.17) 80%,rgba(255,255,255,.28) 88%,rgba(255,255,255,.3) 100%) center calc(50% - 8px)/600% 600%}.flag img[data-v-70e8b538]{display:block;width:100%;height:100%;object-fit:cover}',map:void 0,media:void 0})}),a,"data-v-70e8b538",false,undefined,!1,r,void 0,void 0);module.exports={install:function(e,a){e.component(a.name||"vue-flagpack",n)}}}(flagpackCore); diff --git a/package.json b/package.json index 8d6f527..5619446 100644 --- a/package.json +++ b/package.json @@ -73,6 +73,6 @@ } ], "dependencies": { - "flagpack-core": "0.0.43" + "flagpack-core": "^1.0.0" } } diff --git a/rollup.config.js b/rollup.config.js index b6a9ada..1ca9fff 100644 --- a/rollup.config.js +++ b/rollup.config.js @@ -1,15 +1,21 @@ import commonjs from 'rollup-plugin-commonjs' import VuePlugin from 'rollup-plugin-vue' +import { terser } from 'rollup-plugin-terser' const isProduction = process.env.NODE_ENV === 'production' +const plugins = [ + commonjs(), + VuePlugin() +] + +if (isProduction) { + plugins.push(terser()) +} + export default { input: 'src/main.js', - plugins: [ - commonjs(), - VuePlugin(), - isProduction && (import('rollup-plugin-terser')).terser() - ], + plugins, external: ['vue', 'flagpack-core'], output: [ { diff --git a/yarn.lock b/yarn.lock index ead31a9..0028e3b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2639,10 +2639,10 @@ find-up@^4.0.0: locate-path "^5.0.0" path-exists "^4.0.0" -flagpack-core@0.0.43: - version "0.0.43" - resolved "https://registry.yarnpkg.com/flagpack-core/-/flagpack-core-0.0.43.tgz#96ccf9360d59908d17f002303021c737c5b8aed9" - integrity sha512-tINdWZO/FXA+EWLXyvZrIo7dmxFcpEuWiPOVecRCBHMSMmQ7gMq3Jpw1Kt3gUT87d47rAd/KVlN4ug0zDcu40w== +flagpack-core@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/flagpack-core/-/flagpack-core-1.0.0.tgz#1006b7efa4cc8f1d04dfe8e63cbc1e942b909a38" + integrity sha512-xKNFPkF+sKFY+pP7fsHD8KkuHKl5ZUX8eY2Vzt7lNv9m0ndtchzLx+gdZrJd/3QZfTyi9U40y9WVYAEBy0w++g== flatten@^1.0.2: version "1.0.3" From cbd1672d734824fbac769fe059aedae169120efe Mon Sep 17 00:00:00 2001 From: donovanroubos Date: Fri, 15 Jan 2021 12:28:19 +0100 Subject: [PATCH 2/2] Edit README.md change master to main --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 1c4a119..b6bb8ce 100644 --- a/README.md +++ b/README.md @@ -101,7 +101,7 @@ npm version ``` This will update the version number in the `package.json`, and will add a git tag automatically. Next you'll need to push the git tag to the remote. ``` -git push --tags origin master +git push --tags origin main ``` After that you'll need to publish to npm. ```