balm-ui/components/image-list/index.js

A modular and customizable UI library based on Material Design and Vue 3

!function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t(require("vue")):"function"===typeof define&&define.amd?define("UiImageList",["vue"],t):"object"===typeof exports?exports.UiImageList=t(require("vue")):e.UiImageList=t(e.Vue)}("undefined"!==typeof self?self:this,(function(e){return function(){"use strict";var t={744:function(e){var t=function(e){return function(e){return!!e&&"object"===typeof e}(e)&&!function(e){var t=Object.prototype.toString.call(e);return"[object RegExp]"===t||"[object Date]"===t||function(e){return e.$$typeof===r}(e)}(e)};var r="function"===typeof Symbol&&Symbol.for?Symbol.for("react.element"):60103;function n(e,t){return!1!==t.clone&&t.isMergeableObject(e)?c((r=e,Array.isArray(r)?[]:{}),e,t):e;var r}function o(e,t,r){return e.concat(t).map((function(e){return n(e,r)}))}function s(e){return Object.keys(e).concat(function(e){return Object.getOwnPropertySymbols?Object.getOwnPropertySymbols(e).filter((function(t){return Object.propertyIsEnumerable.call(e,t)})):[]}(e))}function a(e,t){try{return t in e}catch(r){return!1}}function i(e,t,r){var o={};return r.isMergeableObject(e)&&s(e).forEach((function(t){o[t]=n(e[t],r)})),s(t).forEach((function(s){(function(e,t){return a(e,t)&&!(Object.hasOwnProperty.call(e,t)&&Object.propertyIsEnumerable.call(e,t))})(e,s)||(a(e,s)&&r.isMergeableObject(t[s])?o[s]=function(e,t){if(!t.customMerge)return c;var r=t.customMerge(e);return"function"===typeof r?r:c}(s,r)(e[s],t[s],r):o[s]=n(t[s],r))})),o}function c(e,r,s){(s=s||{}).arrayMerge=s.arrayMerge||o,s.isMergeableObject=s.isMergeableObject||t,s.cloneUnlessOtherwiseSpecified=n;var a=Array.isArray(r);return a===Array.isArray(e)?a?s.arrayMerge(e,r,s):i(e,r,s):n(r,s)}c.all=function(e,t){if(!Array.isArray(e))throw new Error("first argument should be an array");return e.reduce((function(e,r){return c(e,r,t)}),{})};var l=c;e.exports=l},262:function(e,t){t.A=(e,t)=>{const r=e.__vccOpts||e;for(const[n,o]of t)r[n]=o;return r}},154:function(t){t.exports=e}},r={};function n(e){var o=r[e];if(void 0!==o)return o.exports;var s=r[e]={exports:{}};return t[e](s,s.exports,n),s.exports}n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,{a:t}),t},n.d=function(e,t){for(var r in t)n.o(t,r)&&!n.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)};var o={};n.d(o,{default:function(){return B}});var s=n(744),a=n.n(s);const i=/(?:^\[object\s(.*?)\]$)/;var c=e=>Object.prototype.toString.call(e).replace(i,"$1").toLowerCase();const l=e=>{let{componentProps:t,propName:r,props:n}=e,o=n[r];if("object"===c(o)){const e=t[r].default;t[r].default=()=>a()(e,o)}else Array.isArray(o)?t[r].default=()=>o:t[r].default=o},u=e=>{let{componentMixins:t,propName:r,props:n}=e;if(t.length){let e=t.length;for(;e--;)if(t[e].props&&void 0!==t[e].props[r]){l({componentProps:t[e].props,propName:r,props:n});break}}};var p=(e,t)=>{for(const r of Object.keys(t))e.props?void 0===e.props[r]?u({componentMixins:e.mixins,propName:r,props:t}):l({componentProps:e.props,propName:r,props:t}):u({componentMixins:e.mixins,propName:r,props:t})};var m=(e,t)=>{for(const r of Object.keys(t))if(/^Ui[A-Z]{1}[A-Za-z]+$/.test(r)){const n=e[r],o=t[r];p(n,o)}};var f=e=>{const t={install(t){m(e,arguments.length>1&&void 0!==arguments[1]?arguments[1]:{});for(let r in e){const n=e[r];t.component(n.name,n)}}};return t},g=n(154);var d=(e,t,r)=>e[r]||e.type===t[r]||e.type===r;const y={TYPES:{standard:0,masonry:1},cssClasses:{image:"mdc-image-list__image"},EVENTS:{CLICK:"click"}},b={name:"UiImageList",customOptions:{UI_IMAGE_LIST:y}};var v=Object.assign(b,{props:{type:{type:[String,Number],default:0},masonry:{type:Boolean,default:!1},textProtection:{type:Boolean,default:!1}},setup(e,t){let{expose:r}=t;const n=e,o=(0,g.computed)((()=>d(n,y.TYPES,"masonry"))),s=(0,g.computed)((()=>({"mdc-image-list":!0,"mdc-image-list--masonry":o.value,"mdc-image-list--with-text-protection":n.textProtection})));return r({isMasonry:o}),(e,t)=>((0,g.openBlock)(),(0,g.createElementBlock)("ul",{class:(0,g.normalizeClass)(s.value)},[(0,g.renderSlot)(e.$slots,"default")],2))}});const I={cssClasses:{icon:"material-icons"},EVENTS:{CLICK:"click"},getMaterialIconClass:function(){for(var e=arguments.length,t=new Array(e),r=0;r<e;r++)t[r]=arguments[r];return[I.cssClasses.icon,...t]}};var C=I;const O=["src"],j={key:1,class:"mdc-image-list__image-aspect-container"},E=["src"],k="UiImageItem",S={cssClasses:{image:"mdc-image-list__image"}},x={name:k,customOptions:{name:k,UI_GLOBAL:C,UI_IMAGE_ITEM:S}};var M=Object.assign(x,{props:{image:{type:[String,null],default:null},bgImage:{type:[String,null],default:null}},emits:[C.EVENTS.CLICK],setup(e,t){let{emit:r}=t;const n=e,o=r,s=(0,g.getCurrentInstance)().parent,{handleClick:a}=function(e){let{emit:t}=e;return{handleClick:function(e){t(I.EVENTS.CLICK,e)}}}({emit:o}),i=(0,g.computed)((()=>({"background-image":`url(${n.bgImage})`})));return(0,g.onBeforeMount)((()=>{var e;null!==s&&void 0!==s&&null!==(e=s.exposed)&&void 0!==e&&e.isMasonry.value&&n.bgImage&&console.warn(`[${k}]: The 'bgImage' prop is not compatible with the masonry image list, you need to set the 'image' prop`)})),(t,r)=>((0,g.openBlock)(),(0,g.createElementBlock)("li",{class:"mdc-image-list__item",onClick:r[0]||(r[0]=function(){return(0,g.unref)(a)&&(0,g.unref)(a)(...arguments)})},[t.$parent.isMasonry?(0,g.renderSlot)(t.$slots,"image",{key:0,imageClass:S.cssClasses.image},(()=>[(0,g.createElementVNode)("img",{class:(0,g.normalizeClass)(S.cssClasses.image),src:e.image},null,10,O)])):((0,g.openBlock)(),(0,g.createElementBlock)("div",j,[(0,g.renderSlot)(t.$slots,"image",{imageClass:S.cssClasses.image},(()=>[e.bgImage?((0,g.openBlock)(),(0,g.createElementBlock)("div",{key:0,class:(0,g.normalizeClass)(S.cssClasses.image),style:(0,g.normalizeStyle)(i.value)},null,6)):((0,g.openBlock)(),(0,g.createElementBlock)("img",{key:1,class:(0,g.normalizeClass)(S.cssClasses.image),src:e.image},null,10,E))]))])),(0,g.renderSlot)(t.$slots,"default")]))}});const _={class:"mdc-image-list__supporting"},h={class:"mdc-image-list__label"};var A={name:"UiImageText"};var B=f({UiImageList:v,UiImageItem:M,UiImageText:(0,n(262).A)(A,[["render",function(e,t,r,n,o,s){return(0,g.openBlock)(),(0,g.createElementBlock)("div",_,[(0,g.createElementVNode)("span",h,[(0,g.renderSlot)(e.$slots,"default")]),(0,g.renderSlot)(e.$slots,"action")])}]])});return o=o.default}()}));