@geoblink/design-system/dist/components/GeoDropdown.js

Geoblink Design System for Vue.js

!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("lodash")):"function"==typeof define&&define.amd?define(["lodash"],e):"object"==typeof exports?exports["components/GeoDropdown"]=e(require("lodash")):t["components/GeoDropdown"]=e(t.lodash)}(window,function(t){return i={},e.m=o={"3Fcl":function(t,e,o){"use strict";var i=o("YLtl"),n=o.n(i);e.a=function(t){var e=1<arguments.length&&void 0!==arguments[1]?arguments[1]:10;return n.a.throttle(t,e,{leading:!0,trailing:!0})}},"3iwg":function(t,e,o){"use strict";function i(){var t=0;return function(){return t++}}o.d(e,"a",function(){return i})},50:function(t,e,o){t.exports=o("jk/Z")},"DI/g":function(t,e,o){"use strict";e.a=function(t){return t.componentInstance&&t.componentInstance.$isServer}},EA35:function(t,e,o){"use strict";o.r(e),o.d(e,"X_AXIS_POSITION",function(){return a}),o.d(e,"Y_AXIS_POSITION",function(){return c}),o.d(e,"geoDropdownMixinFactory",function(){return l});var i=o("lSNA"),n=o.n(i),r=o("YLtl"),s=o.n(r),a={right:"right",left:"left"},c={top:"top",bottom:"bottom"};function l(t){var e,o=s.a.camelCase(t),i="".concat(o[0].toUpperCase()).concat(o.slice(1)),r="is".concat(i,"DropdownOpened");return{data:function(){return n()({},r,!1)},methods:(e={},n()(e,"dismiss".concat(i,"Dropdown"),function(){this[r]=!1}),n()(e,"toggle".concat(i,"Dropdown"),function(){this[r]=!this[r]}),e)}}},"KHd+":function(t,e,o){"use strict";function i(t,e,o,i,n,r,s,a){var c,l="function"==typeof t?t.options:t;if(e&&(l.render=e,l.staticRenderFns=o,l._compiled=!0),i&&(l.functional=!0),r&&(l._scopeId="data-v-"+r),s?(c=function(t){(t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),n&&n.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(s)},l._ssrRegister=c):n&&(c=a?function(){n.call(this,this.$root.$options.shadowRoot)}:n),c)if(l.functional){l._injectStyles=c;var p=l.render;l.render=function(t,e){return c.call(e),p(t,e)}}else{var u=l.beforeCreate;l.beforeCreate=u?[].concat(u,c):[c]}return{exports:t,options:l}}o.d(e,"a",function(){return i})},YLtl:function(e,o){e.exports=t},i4Qp:function(t,e,o){"use strict";function i(t){var e={type:String,validator:function(e){if(t.checkUndefined&&void 0===e)return!0;var o=Object.values(t.enumDictionary);if(o.includes(e))return!0;var i=o.map(function(t){return"«".concat(t,"»")}).join(", ");return console.warn("".concat(t.componentName," [component] :: Unsupported value («").concat(e,"») for «").concat(t.propertyName,"» property. Use one of ").concat(i)),!1}};return"defaultValue"in t&&(e.default=t.defaultValue),"required"in t&&(e.required=!!t.required),e}o.d(e,"a",function(){return i})},"jk/Z":function(t,e,o){"use strict";o.r(e);var i=o("lSNA"),n=o.n(i),r=o("i4Qp"),s=o("YLtl"),a=o.n(s),c=o("3Fcl"),l=o("DI/g"),p=o("3iwg"),u=Object(p.a)(),d=Object(c.a)(function(t){var e=a.a.map(a.a.reverse(a.a.sortedUniq(Object.keys(f))),function(t){return f[t]}),o=!0,i=!1,n=void 0;try{for(var r,s=e[Symbol.iterator]();!(o=(r=s.next()).done);o=!0)(0,r.value)(t)}catch(t){i=!0,n=t}finally{try{o||null==s.return||s.return()}finally{if(i)throw n}}}),f={},h={bind:function(t,e,o){!function(t){return"function"==typeof t.value||(console.error("GeoClickOutside [directive] :: provided expression ".concat(t.expression," is not a function")),!1)}(e)||Object(l.a)(o)||(a.a.isEmpty(f)&&window.addEventListener("click",d,!0),t.__geoOnClickOutsideCallbackId__=u(),f[t.__geoOnClickOutsideCallbackId__]=function(i){i.isStopped||!o.context||t===i.target||t.contains(i.target)||e.value(i,function(){i.isStopped=!0})})},unbind:function(t){f=a.a.omit(f,t.__geoOnClickOutsideCallbackId__),a.a.isEmpty(f)&&window.removeEventListener("click",d)}},v=o("wEB2"),_=o("EA35"),P={name:"GeoDropdown",status:"ready",release:"4.0.0",constants:_,directives:{ScrollAnywhere:v.a,ClickOutside:h},props:{opened:{type:Boolean,required:!0},preferredXAxisPosition:Object(r.a)({componentName:"GeoDropdown",propertyName:"preferredXAxisPosition",enumDictionary:_.X_AXIS_POSITION,defaultValue:_.X_AXIS_POSITION.left}),preferredYAxisPosition:Object(r.a)({componentName:"GeoDropdown",propertyName:"preferredYAxisPosition",enumDictionary:_.Y_AXIS_POSITION,defaultValue:_.Y_AXIS_POSITION.bottom}),forceYAxisPosition:Object(r.a)({componentName:"GeoDropdown",propertyName:"forceYAxisPosition",enumDictionary:_.Y_AXIS_POSITION,required:!1,checkUndefined:!0}),fixedWidth:{type:Boolean,default:!1},popupClass:{type:[String,Array,Object],required:!1},repositionOnUpdate:{type:Boolean,default:!1}},data:function(){return{horizontalAxisConfig:{left:{translation:0,availableWidth:null},right:{translation:0,availableWidth:null}},horizontalAxisPosition:"left",verticalAxisConfig:{top:{translation:0,availableHeight:null},bottom:{translation:0,availableHeight:null}},verticalAxisPosition:"bottom",toggleButtonWidth:null}},computed:{isOpened:function(){return this.opened},popupAnchor:function(){var t,e,o=(t={},n()(t,_.X_AXIS_POSITION.left,"left"),n()(t,_.X_AXIS_POSITION.right,"right"),t),i=(e={},n()(e,_.Y_AXIS_POSITION.top,"bottom"),n()(e,_.Y_AXIS_POSITION.bottom,"top"),e);return{xAxis:o[this.horizontalAxisPosition],yAxis:i[this.verticalAxisPosition]}},popupTranslation:function(){var t=this.horizontalAxisConfig[this.horizontalAxisPosition],e=this.verticalAxisConfig[this.verticalAxisPosition];return{x:t.translation,y:e.translation}},popupMaxSize:function(){var t=this.horizontalAxisConfig[this.horizontalAxisPosition],e=this.verticalAxisConfig[this.verticalAxisPosition];return{width:t.availableWidth,height:e.availableHeight}},popupStyle:function(){var t,e=(t={},n()(t,this.popupAnchor.xAxis,"0px"),n()(t,this.popupAnchor.yAxis,"0px"),n()(t,"max-height","".concat(this.popupMaxSize.height,"px")),n()(t,"max-width","".concat(this.popupMaxSize.width,"px")),n()(t,"transform","translate(\n          ".concat(Math.round(this.popupTranslation.x),"px,\n          ").concat(Math.round(this.popupTranslation.y),"px\n        )")),t);return this.fixedWidth&&(e.width="".concat(this.toggleButtonWidth,"px")),e}},watch:{isOpened:function(){this.repositionPopup(),this.$nextTick(this.repositionPopup.bind(this))},fixedWidth:function(){this.repositionPopup(),this.$nextTick(this.repositionPopup.bind(this))}},created:function(){this.POPUP_REF_NAME="popup"},mounted:function(){this.reattachPopupToDocumentBody()},updated:function(){this.repositionOnUpdate&&(this.repositionPopup(),this.$nextTick(this.repositionPopup.bind(this)))},beforeDestroy:function(){this.removePopupFromDOM()},methods:{removePopupFromDOM:function(){var t=this.$refs.popup;t.parentNode&&t.parentNode.removeChild(t)},reattachPopupToDocumentBody:function(){var t=this.$refs.popup;this.removePopupFromDOM(),document.body.appendChild(t),this.repositionPopup()},repositionPopup:function(){if(this.isOpened&&!this.$isServer&&this.$el&&this.$refs.popup){var t=document.documentElement.clientHeight,e=document.documentElement.clientWidth,o=this.$el,i=this.$refs.popup;i.style&&(i.style.removeProperty("--available-width"),i.style.removeProperty("--available-height"));var n=o.getBoundingClientRect(),r=i.getBoundingClientRect(),s=-(e-n.right),c=n.left;this.horizontalAxisConfig.left.translation=c,this.horizontalAxisConfig.right.translation=s;var l=Math.max(n.right,0),p=Math.max(e-n.left,0);this.horizontalAxisConfig.left.availableWidth=p,this.horizontalAxisConfig.right.availableWidth=l;var u=getComputedStyle(i),d=parseInt(u.getPropertyValue("--spacing-to-toggle-button")||"0",10),f=Math.max(n.top-2*d,0),h=Math.max(t-n.bottom-2*d,0);this.verticalAxisConfig.top.availableHeight=f,this.verticalAxisConfig.bottom.availableHeight=h;var v=n.bottom+d,P=-(t-n.top+d);this.verticalAxisConfig.top.translation=P,this.verticalAxisConfig.bottom.translation=v;var g=r.width<p,m=r.width<l,O=r.height<h,x=r.height<f,b={fitsTowardsPreferredXPosition:m,preferredXPosition:_.X_AXIS_POSITION.right,fallbackXPosition:_.X_AXIS_POSITION.left},A={fitsTowardsPreferredXPosition:g,preferredXPosition:_.X_AXIS_POSITION.left,fallbackXPosition:_.X_AXIS_POSITION.right},y={fitsTowardsPreferredYPosition:x,preferredYPosition:_.Y_AXIS_POSITION.top,fallbackYPosition:_.Y_AXIS_POSITION.bottom},I={fitsTowardsPreferredYPosition:O,preferredYPosition:_.Y_AXIS_POSITION.bottom,fallbackYPosition:_.Y_AXIS_POSITION.top},S=this.preferredXAxisPosition===_.X_AXIS_POSITION.right?b:A,C=S.fitsTowardsPreferredXPosition?S.preferredXPosition:S.fallbackXPosition;this.horizontalAxisPosition=C,i.style&&i.style.setProperty("--available-width","".concat(this.popupMaxSize.width,"px"));var w=y.fitsTowardsPreferredYPosition||I.fitsTowardsPreferredYPosition;if(this.forceYAxisPosition)this.verticalAxisPosition=this.forceYAxisPosition;else if(w){var k=this.preferredYAxisPosition===_.Y_AXIS_POSITION.top?y:I,X=k.fitsTowardsPreferredYPosition?k.preferredYPosition:k.fallbackYPosition;this.verticalAxisPosition=X}i.style&&i.style.setProperty("--available-height","".concat(this.popupMaxSize.height,"px")),this.toggleButtonWidth=a.a.sum(a.a.map(a.a.get(this.$slots,"toggleButton"),function(t){return t.elm&&t.elm.getBoundingClientRect().width||0}))}},checkScrollEventAndRepositionIfNeeded:function(t){this.$refs.popup&&!this.$refs.popup.contains(t.target)&&this.repositionPopup()},checkClickCoordinatesAndEmitClickOutside:function(t){var e=this.$refs.popup;if(this.isOpened&&e!==t.target&&!e.contains(t.target)){var o=a.a.get(this.$slots.popupContent,"[0].context.$refs");this.hasClickOnChildrenPopup(o,t)||this.$emit("click-outside",t)}},hasClickOnChildrenPopup:function(t,e){var o=this,i=this.POPUP_REF_NAME;return a.a.reduce(t,function(t,n,r){return t||!(r!==i||n!==e.target&&!n.contains(e.target))||o.hasClickOnChildrenPopup(a.a.get(n,"$refs"),e)},!1)}}},g=o("KHd+"),m=Object(g.a)(P,function(){var t,e,o=this,i=o.$createElement,n=o._self._c||i;return n("div",{directives:[{name:"scroll-anywhere",rawName:"v-scroll-anywhere",value:o.checkScrollEventAndRepositionIfNeeded,expression:"checkScrollEventAndRepositionIfNeeded"},{name:"click-outside",rawName:"v-click-outside",value:o.checkClickCoordinatesAndEmitClickOutside,expression:"checkClickCoordinatesAndEmitClickOutside"}],class:(t={},t["geo-dropdown"]=!0,t["geo-dropdown--is-open"]=o.isOpened,t)},[o._t("toggleButton"),o._v(" "),n("div",{ref:o.POPUP_REF_NAME,class:[o.popupClass,(e={},e["geo-dropdown__popup"]=!0,e["geo-dropdown__popup--is-open"]=o.isOpened,e)],style:o.popupStyle},[o.isOpened?o._t("popupContent"):o._e()],2)],2)},[],!1,null,null,null);e.default=m.exports},lSNA:function(t,e){t.exports=function(t,e,o){return e in t?Object.defineProperty(t,e,{value:o,enumerable:!0,configurable:!0,writable:!0}):t[e]=o,t},t.exports.__esModule=!0,t.exports.default=t.exports},wEB2:function(t,e,o){"use strict";var i=o("YLtl"),n=o.n(i),r=o("3Fcl"),s=o("DI/g"),a=o("3iwg"),c=Object(a.a)(),l=Object(r.a)(function(t){for(var e=0,o=Object.values(p);e<o.length;e++)(0,o[e])(t)}),p={};e.a={bind:function(t,e,o){!function(t){return"function"==typeof t.value||(console.error("GeoScrollAnywhere [directive] :: provided expression ".concat(t.expression," is not a function")),!1)}(e)||Object(s.a)(o)||(n.a.isEmpty(p)&&window.addEventListener("scroll",l,!0),t.__geoOnAnyScrollCallbackId__=c(),p[t.__geoOnAnyScrollCallbackId__]=function(t){e.value(t)})},unbind:function(t){p=n.a.omit(p,t.__geoOnAnyScrollCallbackId__),n.a.isEmpty(p)&&window.removeEventListener("scroll",l)}}}},e.c=i,e.d=function(t,o,i){e.o(t,o)||Object.defineProperty(t,o,{enumerable:!0,get:i})},e.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},e.t=function(t,o){if(1&o&&(t=e(t)),8&o)return t;if(4&o&&"object"==typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(e.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&o&&"string"!=typeof t)for(var n in t)e.d(i,n,function(e){return t[e]}.bind(null,n));return i},e.n=function(t){var o=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(o,"a",o),o},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="/",e(e.s=50);function e(t){if(i[t])return i[t].exports;var n=i[t]={i:t,l:!1,exports:{}};return o[t].call(n.exports,n,n.exports,e),n.l=!0,n.exports}var o,i});