@square/maker/components/Menu/script.js

Maker Design System by Square

!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("../../components/Icon"),require("../../components/Popover"),require("../../components/Row"),require("../../utils/assert"));else if("function"==typeof define&&define.amd)define(["../../components/Icon","../../components/Popover","../../components/Row","../../utils/assert"],t);else{var n="object"==typeof exports?t(require("../../components/Icon"),require("../../components/Popover"),require("../../components/Row"),require("../../utils/assert")):t(e["../../components/Icon"],e["../../components/Popover"],e["../../components/Row"],e["../../utils/assert"]);for(var o in n)("object"==typeof exports?exports:e)[o]=n[o]}}(this,(function(e,t,n,o){return(()=>{var s={89:function(e){e.exports=function(){"use strict";var e=function(e){var t=e.props,n=e.data,o=e.parent,s=function e(t){return Array.isArray(t)?(n=t=>e(t),t.reduce(((e,t)=>e.concat(n(t))),[])):null!==(o=t)&&"object"==typeof o?function(e){let t=[];for(const n in e)e[n]&&t.push(n);return t}(t):"string"==typeof t&&t?[t]:[];var n,o}([n.staticClass,n.class]);if(s){var r,i,l,c=(i=(r=t).body,l=r.document,i?window.document.body:!!l&&window.document.documentElement);if(c){var u=function(e,t){if(!t.length)return;const{classList:n}=e;return t.filter((e=>{if(!n.contains(e))return n.add(e),!0}))}(c,s),a=function(){!function(e,t){if(!t||!t.length)return;let n;for(;n=t.shift();)e.classList.remove(n);e.classList.length||e.removeAttribute("class")}(c,u)};o.$once("hook:beforeUpdate",a),o.$once("hook:destroyed",a)}}},t=Object.prototype.hasOwnProperty,n=function(e,t,n){var o="&"===t[0],s="~"===(t=o?t.slice(1):t)[0],r="!"===(t=s?t.slice(1):t)[0];return{o:e,t:t=r?t.slice(1):t,i:n,u:{once:s,capture:r,passive:o}}},o=function(e){var o,s,r,i=e.props,l=e.listeners,c=e.parent,u=function(e,o){var s,r,i=[];for(var l in o)if(s=o,r=l,t.call(s,r)){var c=o[l],u=n(e,l,c);u.o.addEventListener(u.t,u.i,u.u),i.push(u)}return i}((s=(o=i).body,r=o.document,s?window.document.body:r?window.document:window),l),a=function(){!function(e){for(var t;t=e.shift();)t.o.removeEventListener(t.t,t.i,t.u)}(u)};c.$once("hook:beforeUpdate",a),c.$once("hook:destroyed",a)},s=function(t){o(t),e(t)};return{name:"pseudo-window",functional:!0,props:{document:Boolean,body:Boolean},render:function(e,t){return t.parent._isMounted?s(t):t.parent.$once("hook:mounted",(function(){s(t)})),t.slots().default}}}()},20:t=>{"use strict";t.exports=e},382:e=>{"use strict";e.exports=t},588:e=>{"use strict";e.exports=n},455:e=>{"use strict";e.exports=o}},r={};function i(e){var t=r[e];if(void 0!==t)return t.exports;var n=r[e]={exports:{}};return s[e].call(n.exports,n,n.exports,i),n.exports}i.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return i.d(t,{a:t}),t},i.d=(e,t)=>{for(var n in t)i.o(t,n)&&!i.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},i.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),i.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var l={};return(()=>{"use strict";i.r(l),i.d(l,{MMenu:()=>m,MMenuOption:()=>_});var e=i(89),t=i.n(e),n=i(382),o=i(455),s=i.n(o),r=i(20);const c={components:{MIcon:r.MIcon},inheritAttrs:!1,model:{prop:"value",event:"select:update"},props:{variant:{type:String,default:"fill",validator:e=>["fill","outline"].includes(e)},value:{type:String,default:void 0},placeholder:{type:String,default:""},options:{type:Array,default:()=>[]},invalid:{type:Boolean,default:!1}},computed:{selected:{get(){return this.value},set(e){return this.$emit("select:update",e),e}},optionSelected(){return this.options.find((e=>e.value===this.value))},placeholderValue(){return this.optionSelected?void 0:this.value}},mounted(){this.setCustomValidity()},updated(){this.setCustomValidity()},methods:{setCustomValidity(){var e,t;const n=this.invalid?"invalid":"";null===(e=this.$refs)||void 0===e||null===(t=e.select)||void 0===t||t.setCustomValidity(n)}}},u={variant_fill:"📚19-10-2MNP6k",variant_outline:"📚19-10-2K9CIe",SelectContainer:"📚19-10-2i5cEi",Prefix:"📚19-10-2pnDG1",Icon:"📚19-10-2vqrGe",Select:"📚19-10-2QHt8E",SelectButton:"📚19-10-2abtNx",hasPrefix:"📚19-10-2wDbAV",selected:"📚19-10-2YEaIi",invalid:"📚19-10-2HbnlJ"};function a(e,t,n,o,s,r,i,l){var c,u="function"==typeof e?e.options:e;if(t&&(u.render=t,u.staticRenderFns=n,u._compiled=!0),o&&(u.functional=!0),r&&(u._scopeId="data-v-"+r),i?(c=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__),s&&s.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(i)},u._ssrRegister=c):s&&(c=l?function(){s.call(this,(u.functional?this.parent:this).$root.$options.shadowRoot)}:s),c)if(u.functional){u._injectStyles=c;var a=u.render;u.render=function(e,t){return c.call(t),a(e,t)}}else{var p=u.beforeCreate;u.beforeCreate=p?[].concat(p,c):[c]}return{exports:e,options:u}}const p=a(c,(function(){var e,t,n=this,o=n.$createElement,s=n._self._c||o;return s("div",{class:[n.$s.SelectContainer,n.$s["variant_"+n.variant]]},[n.$slots["private-menu"]?s("button",n._g(n._b({class:[n.$s.SelectButton,(e={},e[n.$s.hasPrefix]=n.$slots.prefix,e)]},"button",n.$attrs,!1),n.$listeners),[s("span",[n._t("private-menu")],2)]):s("select",n._g(n._b({directives:[{name:"model",rawName:"v-model",value:n.selected,expression:"selected"}],ref:"select",class:[n.$s.Select,(t={},t[n.$s.selected]=n.optionSelected,t[n.$s.invalid]=n.invalid,t[n.$s.hasPrefix]=n.$slots.prefix,t)],on:{change:function(e){var t=Array.prototype.filter.call(e.target.options,(function(e){return e.selected})).map((function(e){return"_value"in e?e._value:e.value}));n.selected=e.target.multiple?t:t[0]}}},"select",n.$attrs,!1),n.$listeners),[n.placeholder?s("option",{attrs:{disabled:""},domProps:{value:n.placeholderValue}},[n._v("\n\t\t\t"+n._s(n.placeholder)+"\n\t\t")]):n._e(),n._v(" "),n._l(n.options,(function(e){return s("option",{key:e.value,attrs:{disabled:e.disabled},domProps:{value:e.value,selected:e.value===n.value}},[n._v("\n\t\t\t"+n._s(e.label)+"\n\t\t")])}))],2),n._v(" "),s("m-icon",{class:n.$s.Icon,attrs:{name:"chevronDown"}}),n._v(" "),n.$slots.prefix?s("span",{class:n.$s.Prefix},[n._t("prefix")],2):n._e()],1)}),[],!1,(function(e){this.$s=u.locals||u}),null,null).exports,d=Symbol("MenuKey"),f={components:{PseudoWindow:t(),MPopover:n.MPopover,MPopoverContent:n.MPopoverContent,SelectControl:p},provide(){return{[d]:this.$data}},inheritAttrs:!1,model:{prop:"selected",event:"menu:update"},props:{selected:{type:void 0,default:void 0},type:{type:String,default:"single-select",validator:e=>["multi-select","single-select","action"].includes(e)}},data(){return{currentValue:this.selected,isSingleSelect:"single-select"===this.type,isMultiSelect:"multi-select"===this.type,isActionSelect:"action"===this.type}},watch:{selected(){this.validateProps(),this.currentValue=this.selected},currentValue(e){this.$emit("menu:update",e)}},created(){this.validateProps()},methods:{validateProps(){this.isMultiSelect&&s().error(Array.isArray(this.selected),"The v-model value for a multi-select must be of type Array.","Menu")},close(){this.$refs.popover.close()}}},v={MenuContent:"📚19-10-2nN_h_",MenuSelectControl:"📚19-10-2l7zWZ"};const m=a(f,(function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",e._g(e._b({class:e.$s.Menu},"div",e.$attrs,!1),e.$listeners),[n("m-popover",{ref:"popover",attrs:{placement:"bottom-start"},on:{open:function(t){return e.$emit("menu:open")},close:function(t){return e.$emit("menu:close")}},scopedSlots:e._u([{key:"action",fn:function(t){return[e.$slots["toggle-select"]?n("select-control",{class:e.$s.MenuSelectControl,on:{click:function(e){return e.stopPropagation(),t.toggle()}},scopedSlots:e._u([{key:"prefix",fn:function(){return[e._t("toggle-select-prefix")]},proxy:!0},{key:"private-menu",fn:function(){return[e._t("toggle-select")]},proxy:!0}],null,!0)}):n("div",{on:{click:function(e){return t.toggle()}}},[e._t("toggle")],2)]}},{key:"content",fn:function(){return[n("m-popover-content",{class:e.$s.MenuContent,attrs:{padding:"16px 0"}},[n("div",{attrs:{role:"menu"}},[e._t("menu")],2)])]},proxy:!0}],null,!0)}),e._v(" "),n("pseudo-window",{attrs:{document:""},on:{keydown:function(t){return!t.type.indexOf("key")&&e._k(t.keyCode,"esc",27,t.key,["Esc","Escape"])?null:e.close.apply(null,arguments)}}})],1)}),[],!1,(function(e){this.$s=v.locals||v}),null,null).exports;const h={components:{MRow:i(588).MRow,MIcon:r.MIcon},inject:{controlState:d},inheritAttrs:!1,props:{value:{type:void 0,default:void 0}},computed:{isSelected(){const{isMultiSelect:e,isSingleSelect:t,currentValue:n}=this.controlState;return e?n.includes(this.value):t&&n===this.value},isSelectOption(){const{isMultiSelect:e,isSingleSelect:t}=this.controlState;return e||t}},mounted(){var e;null===(null===(e=this.$el)||void 0===e?void 0:e.previousElementSibling)&&this.$el.focus({preventScroll:!0})},methods:{selectSelf(e){const{isMultiSelect:t,isActionSelect:n}=this.controlState;n&&this.$listeners.click&&this.$listeners.click(e);let o=this.value;if(t){const e=this.controlState.currentValue.slice();if(e.includes(o)){const t=1;e.splice(e.indexOf(o),t)}else e.push(o);o=e}this.controlState.currentValue=o,this.$emit("option:click")},handleKeyboardEvent(e){var t,n,o,s;switch(e.key){case"Enter":this.selectSelf();break;case"ArrowUp":null===(t=this.$el)||void 0===t||null===(n=t.previousElementSibling)||void 0===n||n.focus({preventScroll:!0});break;case"ArrowDown":null===(o=this.$el)||void 0===o||null===(s=o.nextElementSibling)||void 0===s||s.focus({preventScroll:!0})}}}},y={MenuOption:"📚19-10-2x0t7Q",Check:"📚19-10-2_gou0",Icon:"📚19-10-2c5cPm"};const _=a(h,(function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("m-row",e._b({class:e.$s.MenuOption,attrs:{role:"menuitem",tabindex:"0"},on:{click:e.selectSelf,keydown:e.handleKeyboardEvent},scopedSlots:e._u([e._l(e.$slots,(function(t,n){return{key:n,fn:function(){return[e._t(n)]},proxy:!0}})),e.isSelectOption?{key:"prefix",fn:function(){return[n("span",{class:e.$s.Check},[e.isSelected?n("m-icon",{class:e.$s.Icon,attrs:{name:"check"}}):e._e()],1)]},proxy:!0}:null],null,!0)},"m-row",e.$attrs,!1))}),[],!1,(function(e){this.$s=y.locals||y}),null,null).exports})(),l})()}));
//# sourceMappingURL=script.js.map