uikit/dist/js/components/filter.min.js

UIkit is a lightweight and modular front-end framework for developing fast and powerful web interfaces.

/*! UIkit 3.23.11 | https://www.getuikit.com | (c) 2014 - 2025 YOOtheme | MIT License */(function(s,y){typeof exports=="object"&&typeof module<"u"?module.exports=y(require("uikit-util")):typeof define=="function"&&define.amd?define("uikitfilter",["uikit-util"],y):(s=typeof globalThis<"u"?globalThis:s||self,s.UIkitFilter=y(s.UIkit.util))})(this,function(s){"use strict";function y(e,n=[]){try{return e?s.startsWith(e,"{")?JSON.parse(e):n.length&&!s.includes(e,":")?{[n[0]]:e}:e.split(";").reduce((o,r)=>{const[f,t]=r.split(/:(.*)/);return f&&!s.isUndefined(t)&&(o[f.trim()]=t.trim()),o},{}):{}}catch{return{}}}function j(e,n="update"){e._connected&&e._updates.length&&(e._queued||(e._queued=new Set,s.fastdom.read(()=>{e._connected&&V(e,e._queued),e._queued=null})),e._queued.add(n.type||n))}function V(e,n){for(const{read:o,write:r,events:f=[]}of e._updates){if(!n.has("update")&&!f.some(a=>n.has(a)))continue;let t;o&&(t=o.call(e,e._data,n),t&&s.isPlainObject(t)&&s.assign(e._data,t)),r&&t!==!1&&s.fastdom.write(()=>{e._connected&&r.call(e,e._data,n)})}}function B(e){return C(s.observeResize,e,"resize")}function T(e){return C(s.observeMutation,e)}function C(e,n,o){return{observe:e,handler(){j(this,o)},...n}}T({options:{childList:!0}}),T({options:{attributes:!0,attributeFilter:["style"]}}),B({handler(e){for(const{borderBoxSize:[{inlineSize:n,blockSize:o}]}of e)if(n||o){this.$emit("resize");return}},target:({$el:e})=>[e,...s.children(e)]});function L(e){const n=[[]],o=e.some((r,f)=>f&&e[f-1].offsetParent!==r.offsetParent);for(const r of e){if(!s.isVisible(r))continue;const f=b(r,o);for(let t=n.length-1;t>=0;t--){const a=n[t];if(!a[0]){a.push(r);break}const c=b(a[0],o);if(f.top>=c.bottom-1&&f.top!==c.top){n.push([r]);break}if(f.bottom-1>c.top||f.top===c.top){let h=a.length-1;for(;h>=0;h--){const l=b(a[h],o);if(f.left>=l.left)break}a.splice(h+1,0,r);break}if(t===0){n.unshift([r]);break}}}return n}function b(e,n=!1){let{offsetTop:o,offsetLeft:r,offsetHeight:f,offsetWidth:t}=e;return n&&([o,r]=s.offsetPosition(e)),{top:o,left:r,bottom:o+f,right:r+t}}const v="uk-transition-leave",P="uk-transition-enter";function $(e,n,o,r=0){const f=g(n,!0),t={opacity:1},a={opacity:0},c=()=>f===g(n),h=i=>()=>c()?i():Promise.reject(),l=h(async()=>{s.addClass(n,v),await(r?Promise.all(x(n).map(async(i,u)=>(await S(u*r),s.Transition.start(i,a,o/2,"ease")))):s.Transition.start(n,a,o/2,"ease")),s.removeClass(n,v)}),m=h(async()=>{const i=s.height(n);s.addClass(n,P),e(),s.css(r?s.children(n):n,a),s.height(n,i),await S(),s.height(n,"");const u=s.height(n);s.css(n,"alignContent","flex-start"),s.height(n,i);let d=[],p=o/2;if(r){const w=x(n);s.css(s.children(n),a),d=w.map(async(O,X)=>{await S(X*r),await s.Transition.start(O,t,o/2,"ease"),c()&&s.resetProps(O,t)}),p+=w.length*r}if(!r||i!==u){const w={height:u,...r?{}:t};d.push(s.Transition.start(n,w,p,"ease"))}await Promise.all(d),s.removeClass(n,P),c()&&(s.resetProps(n,{height:"",alignContent:"",...t}),delete n.dataset.transition)});return s.hasClass(n,v)?I(n).then(m):s.hasClass(n,P)?I(n).then(l).then(m):l().then(m)}function g(e,n){return n&&(e.dataset.transition=1+g(e)),s.toNumber(e.dataset.transition)||0}function I(e){return Promise.all(s.children(e).filter(s.Transition.inProgress).map(n=>new Promise(o=>s.once(n,"transitionend transitioncanceled",o))))}function x(e){return L(s.children(e)).flat().filter(s.isVisible)}function S(e){return new Promise(n=>setTimeout(n,e))}async function N(e,n,o){await q();let r=s.children(n);const f=r.map(d=>F(d,!0)),t={...s.css(n,["height","padding"]),display:"block"},a=r.concat(n);await Promise.all(a.map(s.Transition.cancel)),s.css(a,"transitionProperty","none"),await e(),r=r.concat(s.children(n).filter(d=>!s.includes(r,d))),await Promise.resolve(),s.css(a,"transitionProperty","");const c=s.attr(n,"style"),h=s.css(n,["height","padding"]),[l,m]=D(n,r,f),i=r.map(d=>({style:s.attr(d,"style")}));r.forEach((d,p)=>m[p]&&s.css(d,m[p])),s.css(n,t),s.trigger(n,"scroll"),await q();const u=r.map((d,p)=>s.parent(d)===n&&s.Transition.start(d,l[p],o,"ease")).concat(s.Transition.start(n,h,o,"ease"));try{await Promise.all(u),r.forEach((d,p)=>{s.attr(d,i[p]),s.parent(d)===n&&s.css(d,"display",l[p].opacity===0?"none":"")}),s.attr(n,"style",c)}catch{s.attr(r,"style",""),s.resetProps(n,t)}}function F(e,n){const o=s.css(e,"zIndex");return s.isVisible(e)?{display:"",opacity:n?s.css(e,"opacity"):"0",pointerEvents:"none",position:"absolute",zIndex:o==="auto"?s.index(e):o,..._(e)}:!1}function D(e,n,o){const r=n.map((t,a)=>s.parent(t)&&a in o?o[a]?s.isVisible(t)?_(t):{opacity:0}:{opacity:s.isVisible(t)?1:0}:!1),f=r.map((t,a)=>{const c=s.parent(n[a])===e&&(o[a]||F(n[a]));if(!c)return!1;if(!t)delete c.opacity;else if(!("opacity"in t)){const{opacity:h}=c;h%1?t.opacity=1:delete c.opacity}return c});return[r,f]}function _(e){const{height:n,width:o}=s.dimensions(e);return{height:n,width:o,transform:"",...s.position(e),...s.css(e,["marginTop","marginLeft"])}}function q(){return new Promise(e=>requestAnimationFrame(e))}var H={props:{duration:Number,animation:Boolean},data:{duration:150,animation:"slide"},methods:{animate(e,n=this.$el){const o=this.animation;return(o==="fade"?$:o==="delayed-fade"?(...f)=>$(...f,40):o?N:()=>(e(),Promise.resolve()))(e,n,this.duration).catch(s.noop)}}};function M(e){e.target.closest('a[href="#"],a[href=""]')&&e.preventDefault()}const W={SPACE:32};var z={mixins:[H],args:"target",props:{target:String,selActive:Boolean},data:{target:"",selActive:!1,attrItem:"uk-filter-control",cls:"uk-active",duration:250},computed:{children:({target:e},n)=>s.$$(`${e} > *`,n),toggles:({attrItem:e},n)=>s.$$(`[${e}],[data-${e}]`,n)},watch:{toggles(e){this.updateState();const n=s.$$(this.selActive,this.$el);for(const o of e){this.selActive!==!1&&s.toggleClass(o,this.cls,s.includes(n,o));const r=Q(o);s.isTag(r,"a")&&(r.role="button")}},children(e,n){n&&this.updateState()}},events:{name:"click keydown",delegate:({attrItem:e})=>`[${e}],[data-${e}]`,handler(e){e.type==="keydown"&&e.keyCode!==W.SPACE||e.target.closest("a,button")&&(M(e),this.apply(e.current))}},methods:{apply(e){const n=this.getState(),o=A(e,this.attrItem,this.getState());R(n,o)||this.setState(o)},getState(){return this.toggles.filter(e=>s.hasClass(e,this.cls)).reduce((e,n)=>A(n,this.attrItem,e),{filter:{"":""},sort:[]})},async setState(e,n=!0){e={filter:{"":""},sort:[],...e},s.trigger(this.$el,"beforeFilter",[this,e]);for(const o of this.toggles)s.toggleClass(o,this.cls,G(o,this.attrItem,e));await Promise.all(s.$$(this.target,this.$el).map(o=>{const r=()=>J(e,o,s.children(o));return n?this.animate(r,o):r()})),s.trigger(this.$el,"afterFilter",[this])},updateState(){s.fastdom.write(()=>this.setState(this.getState(),!1))}}};function E(e,n){return y(s.data(e,n),["filter"])}function R(e,n){return["filter","sort"].every(o=>s.isEqual(e[o],n[o]))}function J(e,n,o){for(const t of o)s.css(t,"display",Object.values(e.filter).every(a=>!a||s.matches(t,a))?"":"none");const[r,f]=e.sort;if(r){const t=K(o,r,f);s.isEqual(t,o)||s.append(n,t)}}function A(e,n,o){const{filter:r,group:f,sort:t,order:a="asc"}=E(e,n);return(r||s.isUndefined(t))&&(f?r?(delete o.filter[""],o.filter[f]=r):(delete o.filter[f],(s.isEmpty(o.filter)||""in o.filter)&&(o.filter={"":r||""})):o.filter={"":r||""}),s.isUndefined(t)||(o.sort=[t,a]),o}function G(e,n,{filter:o={"":""},sort:[r,f]}){const{filter:t="",group:a="",sort:c,order:h="asc"}=E(e,n);return s.isUndefined(c)?a in o&&t===o[a]||!t&&a&&!(a in o)&&!o[""]:r===c&&f===h}function K(e,n,o){return[...e].sort((r,f)=>s.data(r,n).localeCompare(s.data(f,n),void 0,{numeric:!0})*(o==="asc"||-1))}function Q(e){return s.$("a,button",e)||e}return typeof window<"u"&&window.UIkit&&window.UIkit.component("filter",z),z});