dendelion-ui 0.0.2 → 0.0.5

package/dist/dendelion-ui.cjs.js

@@ -1,5 +1,5 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue");var p=(e=>(e[e.Primary=0]="Primary",e[e.PrimaryContent=1]="PrimaryContent",e[e.Secondary=2]="Secondary",e[e.SecondaryContent=3]="SecondaryContent",e[e.Accent=4]="Accent",e[e.AccentContent=5]="AccentContent",e[e.Neutral=6]="Neutral",e[e.NeutralContent=7]="NeutralContent",e[e.Base100=8]="Base100",e[e.Base200=9]="Base200",e[e.Base300=10]="Base300",e[e.BaseContent=11]="BaseContent",e[e.Info=12]="Info",e[e.InfoContent=13]="InfoContent",e[e.Success=14]="Success",e[e.SuccessContent=15]="SuccessContent",e[e.Warning=16]="Warning",e[e.WarningContent=17]="WarningContent",e[e.Error=18]="Error",e[e.ErrorContent=19]="ErrorContent",e))(p||{});class m{static toClassName(n){switch(n){case 0:return"primary";case 1:return"primary-content";case 2:return"secondary";case 3:return"secondary-content";case 4:return"accent";case 5:return"accent-content";case 6:return"neutral";case 7:return"neutral-content";case 8:return"base-100";case 9:return"base-200";case 10:return"base-300";case 11:return"base-content";case 12:return"info";case 13:return"info-content";case 14:return"success";case 15:return"success-content";case 16:return"warning";case 17:return"warning-content";case 18:return"error";case 19:return"error-content";default:return"primary"}}}function h(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var f={exports:{}};/*!
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue");var L=(t=>(t[t.Primary=0]="Primary",t[t.PrimaryContent=1]="PrimaryContent",t[t.Secondary=2]="Secondary",t[t.SecondaryContent=3]="SecondaryContent",t[t.Accent=4]="Accent",t[t.AccentContent=5]="AccentContent",t[t.Neutral=6]="Neutral",t[t.NeutralContent=7]="NeutralContent",t[t.Base100=8]="Base100",t[t.Base200=9]="Base200",t[t.Base300=10]="Base300",t[t.BaseContent=11]="BaseContent",t[t.Info=12]="Info",t[t.InfoContent=13]="InfoContent",t[t.Success=14]="Success",t[t.SuccessContent=15]="SuccessContent",t[t.Warning=16]="Warning",t[t.WarningContent=17]="WarningContent",t[t.Error=18]="Error",t[t.ErrorContent=19]="ErrorContent",t))(L||{});class D{static toClassName(r){switch(r){case 0:return"primary";case 1:return"primary-content";case 2:return"secondary";case 3:return"secondary-content";case 4:return"accent";case 5:return"accent-content";case 6:return"neutral";case 7:return"neutral-content";case 8:return"base-100";case 9:return"base-200";case 10:return"base-300";case 11:return"base-content";case 12:return"info";case 13:return"info-content";case 14:return"success";case 15:return"success-content";case 16:return"warning";case 17:return"warning-content";case 18:return"error";case 19:return"error-content";default:return"primary"}}}function I(t){return t&&t.__esModule&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t}var T={exports:{}};/*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
 	http://jedwatson.github.io/classnames
-*/var _;function x(){return _||(_=1,function(e){(function(){var n={}.hasOwnProperty;function s(){for(var a="",c=0;c<arguments.length;c++){var l=arguments[c];l&&(a=o(a,r(l)))}return a}function r(a){if(typeof a=="string"||typeof a=="number")return a;if(typeof a!="object")return"";if(Array.isArray(a))return s.apply(null,a);if(a.toString!==Object.prototype.toString&&!a.toString.toString().includes("[native code]"))return a.toString();var c="";for(var l in a)n.call(a,l)&&a[l]&&(c=o(c,l));return c}function o(a,c){return c?a?a+" "+c:a+c:a}e.exports?(s.default=s,e.exports=s):window.classNames=s})()}(f)),f.exports}var S=x();const d=h(S),k=["type"],w={class:"group-[.is-loading]:text-transparent"},$=t.defineComponent({__name:"Button",props:{type:{default:"button"},loading:{type:Boolean},color:{default:p.Neutral},click:{}},setup(e){const n=e,s=t.ref(d("btn","group",`btn-${m.toClassName(n.color)}`,n.loading?"is-loading":""));return t.watch(()=>n.loading,r=>{s.value=d("btn","group",`btn-${m.toClassName(n.color)}`,r?"is-loading":"")}),(r,o)=>(t.openBlock(),t.createElementBlock("button",{onClick:o[0]||(o[0]=(...a)=>r.click&&r.click(...a)),class:t.normalizeClass(s.value),type:r.type},[o[1]||(o[1]=t.createElementVNode("span",{class:"loading loading-spinner loading-md absolute hidden group-[.is-loading]:block"},null,-1)),t.createElementVNode("span",w,[t.renderSlot(r.$slots,"default")])],10,k))}});var b=(e=>(e[e.XS=0]="XS",e[e.SM=1]="SM",e[e.MD=2]="MD",e[e.LG=3]="LG",e[e.XL=4]="XL",e[e.TWOXL=5]="TWOXL",e[e.THREEXL=6]="THREEXL",e))(b||{});class g{static toClassName(n){switch(n){case 0:return"xs";case 1:return"sm";case 2:return"md";case 3:return"lg";case 4:return"xl";case 5:return"2xl";case 6:return"3xl";default:return"md"}}}const C=t.defineComponent({__name:"Card",props:{backgroundColor:{default:p.Primary},shadow:{type:Boolean,default:!1},fullWidth:{type:Boolean,default:!1},rounded:{type:Boolean},roundedSize:{}},setup(e){const n=e,s=t.ref(d("card",`bg-${n.backgroundColor}`,n.shadow?"shadow-lg":"",n.fullWidth?"w-full":"",n.rounded&&!n.roundedSize?"rounded":n.roundedSize?`rounded-${n.roundedSize}`:""));return(r,o)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(s.value)},[t.renderSlot(r.$slots,"default")],2))}}),y=(e,n)=>{const s=e.__vccOpts||e;for(const[r,o]of n)s[r]=o;return s},N={},E={class:"card-body"};function M(e,n){return t.openBlock(),t.createElementBlock("div",E,[t.renderSlot(e.$slots,"default")])}const L=y(N,[["render",M]]),P=t.defineComponent({__name:"CardTitle",props:{is:{default:"h1"},text:{default:""}},setup(e){return(n,s)=>(t.openBlock(),t.createBlock(t.resolveDynamicComponent(n.is),{class:"card-title"},{default:t.withCtx(()=>[t.createTextVNode(t.toDisplayString(n.text),1)]),_:1}))}}),V=t.defineComponent({__name:"Container",props:{container:{type:Boolean,default:!0},padding:{type:Boolean,default:!0}},setup(e){const n=e,s=t.ref([n.container?"container":"",n.padding?"p-6":""]);return(r,o)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(s.value)},[t.renderSlot(r.$slots,"default")],2))}}),T=t.defineComponent({__name:"Table",props:{zebra:{type:Boolean,default:!1},pinRows:{type:Boolean,default:!1},pinCols:{type:Boolean,default:!1},size:{default:b.MD},columns:{},dataSource:{},ajax:{}},setup(e){const n=t.ref(null),s=e,r=t.ref(d("table",`table-${g.toClassName(s.size)}`,{"table-zebra":s.zebra,"table-pin-rows":s.pinRows,"table-pin-cols	":s.pinCols}));return(o,a)=>(t.openBlock(),t.createElementBlock("table",{ref_key:"table",ref:n,class:t.normalizeClass(r.value)},null,2))}}),j=t.defineComponent({__name:"Stepper",props:{value:{}},emits:["update:value"],setup(e,{expose:n,emit:s}){const r=e,o=t.ref(r.value),a=s,c=l=>{o.value=l,a("update:value",l)};return t.provide("stepper",{value:o,updateValue:c}),t.watch(()=>r.value,l=>{o.value=l}),n({updateValue:c}),(l,v)=>t.renderSlot(l.$slots,"default",{updateValue:c})}}),O=t.defineComponent({__name:"Step",props:{value:{}},setup(e){const n=e,s=t.inject("stepper"),r=t.ref("");return t.watch(()=>s==null?void 0:s.value.value,o=>{o&&n.value&&(r.value=Number(o)>=Number(n.value)?"step-primary":"")}),t.onMounted(()=>{s&&(r.value=s.value.value===n.value?"step-primary":"",Number(s.value.value)>=Number(n.value)&&(r.value="step-primary"))}),(o,a)=>(t.openBlock(),t.createElementBlock("li",{class:t.normalizeClass(["step",r.value])},[t.renderSlot(o.$slots,"default")],2))}}),W={},X={class:"steps"};function A(e,n){return t.openBlock(),t.createElementBlock("ul",X,[t.renderSlot(e.$slots,"default")])}const D=y(W,[["render",A]]),z={key:0},R=t.defineComponent({__name:"StepPanels",setup(e){const n=t.inject("stepper");return(s,r)=>(t.openBlock(),t.createBlock(t.Transition,{name:"fade",mode:"out-in"},{default:t.withCtx(()=>{var o,a;return[(o=t.unref(n))!=null&&o.value?(t.openBlock(),t.createElementBlock("div",z,[t.renderSlot(s.$slots,"default",{currentStep:(a=t.unref(n))==null?void 0:a.value})])):t.createCommentVNode("",!0)]}),_:3}))}}),I={key:0},U=t.defineComponent({__name:"StepPanel",props:{value:{}},setup(e,{expose:n}){const s=t.computed(()=>r==null?void 0:r.value.value),r=t.inject("stepper"),o=a=>{r&&r.updateValue(a.toString())};return n({activateCallback:o}),(a,c)=>a.value===s.value?(t.openBlock(),t.createElementBlock("div",I,[t.renderSlot(a.$slots,"default",{activateCallback:o})])):t.createCommentVNode("",!0)}}),q={className:"modal-box"},G={key:0,method:"dialog"},H=t.defineComponent({__name:"Modal",props:{closeButton:{type:Boolean,default:!0},overflow:{type:Boolean,default:!1}},emits:["close"],setup(e,{expose:n,emit:s}){const r=t.ref(null),o=s,a=e,c=t.ref(d("modal",{"overflow-visible":a.overflow}));return n({showModal:()=>{var u;(u=r.value)==null||u.showModal()},closeModal:()=>{var u;(u=r.value)==null||u.close()}}),(u,i)=>(t.openBlock(),t.createElementBlock("dialog",{ref_key:"modal",ref:r,class:t.normalizeClass(c.value),"aria-modal":"true","aria-hidden":"true",role:"dialog",onClose:i[0]||(i[0]=B=>o("close",B))},[t.createElementVNode("div",q,[u.closeButton?(t.openBlock(),t.createElementBlock("form",G,i[1]||(i[1]=[t.createElementVNode("button",{className:"btn btn-sm btn-circle btn-ghost absolute right-2 top-2"},"✕",-1)]))):t.createCommentVNode("",!0),t.renderSlot(u.$slots,"default")])],34))}}),F=["bg-primary","bg-primary-content","bg-secondary","bg-secondary-content","bg-accent","bg-accent-content","bg-neutral","bg-neutral-content","bg-base-100","bg-base-200","bg-base-300","bg-base-content","bg-info","bg-info-content","bg-success","bg-success-content","bg-warning","bg-warning-content","bg-error","bg-error-content","btn-primary","btn-primary-content","btn-secondary","btn-secondary-content","btn-accent","btn-accent-content","btn-neutral","btn-neutral-content","btn-base-100","btn-base-200","btn-base-300","btn-base-content","btn-info","btn-info-content","btn-success","btn-success-content","btn-warning","btn-warning-content","btn-error","btn-error-content","text-primary","text-primary-content","text-secondary","text-secondary-content","text-accent","text-accent-content","text-neutral","text-neutral-content","text-base-100","text-base-200","text-base-300","text-base-content","text-info","text-info-content","text-success","text-success-content","text-warning","text-warning-content","text-error","text-error-content","text-transparent","step","steps","modal","modal-box","btn","btn-sm","btn-circle","btn-ghost","absolute","right-2","top-2","shadow-lg","w-full","rounded-xs","rounded-sm","rounded-md","rounded-lg","rounded-xl","rounded-2xl","rounded-3xl","hidden","block"];exports.Button=$;exports.Card=C;exports.CardBody=L;exports.CardTitle=P;exports.Color=p;exports.ColorUtils=m;exports.Container=V;exports.Modal=H;exports.Size=b;exports.SizeUtils=g;exports.Step=O;exports.StepList=D;exports.StepPanel=U;exports.StepPanels=R;exports.Stepper=j;exports.Table=T;exports.dendelionSafeList=F;
+*/var R;function Q(){return R||(R=1,function(t){(function(){var r={}.hasOwnProperty;function a(){for(var n="",c=0;c<arguments.length;c++){var v=arguments[c];v&&(n=o(n,s(v)))}return n}function s(n){if(typeof n=="string"||typeof n=="number")return n;if(typeof n!="object")return"";if(Array.isArray(n))return a.apply(null,n);if(n.toString!==Object.prototype.toString&&!n.toString.toString().includes("[native code]"))return n.toString();var c="";for(var v in n)r.call(n,v)&&n[v]&&(c=o(c,v));return c}function o(n,c){return c?n?n+" "+c:n+c:n}t.exports?(a.default=a,t.exports=a):window.classNames=a})()}(T)),T.exports}var ee=Q();const $=I(ee),te=["type"],ne={class:"group-[.is-loading]:text-transparent"},re=e.defineComponent({__name:"Button",props:{type:{default:"button"},loading:{type:Boolean},color:{default:L.Neutral},click:{}},setup(t){const r=t,a=e.ref($("btn","group",`btn-${D.toClassName(r.color)}`,r.loading?"is-loading":""));return e.watch(()=>r.loading,s=>{a.value=$("btn","group",`btn-${D.toClassName(r.color)}`,s?"is-loading":"")}),(s,o)=>(e.openBlock(),e.createElementBlock("button",{onClick:o[0]||(o[0]=(...n)=>s.click&&s.click(...n)),class:e.normalizeClass(a.value),type:s.type},[o[1]||(o[1]=e.createElementVNode("span",{class:"loading loading-spinner loading-md absolute hidden group-[.is-loading]:block"},null,-1)),e.createElementVNode("span",ne,[e.renderSlot(s.$slots,"default")])],10,te))}});var O=(t=>(t[t.XS=0]="XS",t[t.SM=1]="SM",t[t.MD=2]="MD",t[t.LG=3]="LG",t[t.XL=4]="XL",t[t.TWOXL=5]="TWOXL",t[t.THREEXL=6]="THREEXL",t))(O||{});class H{static toClassName(r){switch(r){case 0:return"xs";case 1:return"sm";case 2:return"md";case 3:return"lg";case 4:return"xl";case 5:return"2xl";case 6:return"3xl";default:return"md"}}}const ae=e.defineComponent({__name:"Card",props:{backgroundColor:{default:L.Primary},shadow:{type:Boolean,default:!1},fullWidth:{type:Boolean,default:!1},rounded:{type:Boolean},roundedSize:{}},setup(t){const r=t,a=e.ref($("card",`bg-${r.backgroundColor}`,r.shadow?"shadow-lg":"",r.fullWidth?"w-full":"",r.rounded&&!r.roundedSize?"rounded":r.roundedSize?`rounded-${r.roundedSize}`:""));return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(a.value)},[e.renderSlot(s.$slots,"default")],2))}}),U=(t,r)=>{const a=t.__vccOpts||t;for(const[s,o]of r)a[s]=o;return a},se={},oe={class:"card-body"};function ce(t,r){return e.openBlock(),e.createElementBlock("div",oe,[e.renderSlot(t.$slots,"default")])}const le=U(se,[["render",ce]]),ue=e.defineComponent({__name:"CardTitle",props:{is:{default:"h1"},text:{default:""}},setup(t){return(r,a)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(r.is),{class:"card-title"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.text),1)]),_:1}))}}),ie=e.defineComponent({__name:"Container",props:{container:{type:Boolean,default:!0},padding:{type:Boolean,default:!0}},setup(t){const r=t,a=e.ref([r.container?"container":"",r.padding?"p-6":""]);return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(a.value)},[e.renderSlot(s.$slots,"default")],2))}});var F={},W={},q;function G(){return q||(q=1,function(t){t.__esModule=!0,t.default=o;var r=/[\u0300-\u036f]/g,a=/ł/g,s=/ñ/g;function o(n){return n.toLowerCase().normalize("NFD").replace(r,"").replace(a,"l").replace(s,"n").trim()}}(W)),W}var C={},P;function A(){if(P)return C;P=1,C.__esModule=!0,C.aggressiveFuzzyMatch=k,C.createFuzzySearchImpl=K,C.experimentalSmartFuzzyMatch=B,C.fuzzyMatchImpl=x;var t=r(G());function r(u){return u&&u.__esModule?u:{default:u}}var a=Number.MAX_SAFE_INTEGER,s=function(l,m){return l.score-m.score},o=function(l,m){return l[0]-m[0]},n=new Set(`  []()-–—'"“”`.split(""));function c(u){return n.has(u)}function v(u,l,m,_,i,h,p){if(u===_)return[0,[[0,u.length-1]]];var d=_.length,f=l.length,g=i.length;if(l===i)return[.1,[[0,f-1]]];if(l.startsWith(i))return[.5,[[0,g-1]]];var S=u.indexOf(_);if(S>-1&&c(u[S-1]))return[.9,[[S,S+d-1]]];var y=l.indexOf(i);if(y>-1&&c(l[y-1]))return[1,[[y,y+d-1]]];var E=h.length;if(E>1&&h.every(function(N){return m.has(N)})){var w=1.5+E*.2;return[w,h.map(function(N){var M=l.indexOf(N);return[M,M+N.length-1]}).sort(o)]}return y>-1?[2,[[y,y+d-1]]]:p==="aggressive"?k(l,i):p==="smart"?B(l,i):null}function k(u,l){for(var m=u.length,_=l.length,i=0,h=l[i],p=[],d=-1,f=-2,g=0;g<m;g+=1)if(u[g]===h){if(g!==f+1&&(d>=0&&p.push([d,f]),d=g),f=g,i+=1,i===_)return p.push([d,f]),b(p,u);h=l[i]}return null}function B(u,l){for(var m=u.length,_=[],i=0,h=l[i],p=-1,d=-2;;){var f=u.indexOf(h,d+1);if(f===-1)break;if(f===0||c(u[f-1]))p=f;else{var g=l.length-i,S=u.length-f,y=Math.min(3,g,S),E=l.slice(i,i+y);if(u.slice(f,f+y)===E)p=f;else{d+=1;continue}}for(d=p;d<m&&u[d]===h;d+=1)i+=1,h=l[i];if(d-=1,_.push([p,d]),i===l.length)return b(_,u)}return null}function b(u,l){var m=2;return u.forEach(function(_){var i=_[0],h=_[1],p=h-i+1,d=i===0||l[i]===" "||l[i-1]===" ",f=h===l.length-1||l[h]===" "||l[h+1]===" ",g=d&&f;g?m+=.2:d?m+=.4:p>=3?m+=.8:m+=1.6}),[m,u]}function x(u,l){var m=(0,t.default)(l),_=m.split(" "),i=(0,t.default)(u),h=new Set(i.split(" ")),p=v(u,i,h,l,m,_,"smart");return p?{item:u,score:p[0],matches:[p[1]]}:null}function K(u,l){var m=l.strategy,_=m===void 0?"aggressive":m,i=l.getText,h=u.map(function(p){var d;if(i)d=i(p);else{var f=l.key?p[l.key]:p;d=[f]}var g=d.map(function(S){var y=S||"",E=(0,t.default)(y),w=new Set(E.split(" "));return[y,E,w]});return[p,g]});return function(p){var d=[],f=(0,t.default)(p),g=f.split(" ");return f.length?(h.forEach(function(S){for(var y=S[0],E=S[1],w=a,N=[],M=0,j=E.length;M<j;M+=1){var V=E[M],Z=V[0],J=V[1],Y=V[2],z=v(Z,J,Y,p,f,g,_);z?(w=Math.min(w,z[0]),N.push(z[1])):N.push(null)}w<a&&d.push({item:y,score:w,matches:N})}),d.sort(s),d):[]}}return C}var X;function de(){return X||(X=1,function(t){t.__esModule=!0,t.default=s,t.fuzzyMatch=o;var r=a(G());t.normalizeText=r.default;function a(n){return n&&n.__esModule?n:{default:n}}function s(n,c){return c===void 0&&(c={}),A().createFuzzySearchImpl(n,c)}function o(n,c){return A().fuzzyMatchImpl(n,c)}}(F)),F}var pe=de();const fe=I(pe),ve=["innerHTML"],me=e.defineComponent({__name:"Table",props:{zebra:{type:Boolean,default:!1},pinRows:{type:Boolean,default:!1},pinCols:{type:Boolean,default:!1},size:{default:O.MD},columns:{},dataSource:{},ajax:{},searchValue:{},searchFunction:{}},setup(t){const r=e.ref([]),a=e.ref([]),s=e.computed(()=>fe(r.value)),o=e.ref(null),n=t,c=e.ref($("table",`table-${H.toClassName(n.size)}`,{"table-zebra":n.zebra,"table-pin-rows":n.pinRows,"table-pin-cols	":n.pinCols})),v=(k,B)=>String(!k||typeof k!="object"?k:B.split(".").reduce((b,x)=>b&&(typeof b=="object"?b[x]:b),k));return e.watch(()=>n.searchValue,k=>{if(n.searchFunction){a.value=n.searchFunction(k??"");return}a.value=k?s.value(k):r.value}),(k,B)=>(e.openBlock(),e.createElementBlock("table",{ref_key:"table",ref:o,class:e.normalizeClass(c.value)},[e.createElementVNode("thead",null,[e.createElementVNode("tr",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.columns,b=>(e.openBlock(),e.createElementBlock("th",{key:b.title},e.toDisplayString(b.title),1))),128))])]),e.createElementVNode("tbody",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.value,b=>(e.openBlock(),e.createElementBlock("tr",{key:String(b)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.columns,x=>(e.openBlock(),e.createElementBlock("td",{key:x.title,innerHTML:x.render?x.render(v(b,x.data),b):v(b,x.data)},null,8,ve))),128))]))),128))])],2))}}),be=e.defineComponent({__name:"Stepper",props:{value:{}},emits:["update:value"],setup(t,{expose:r,emit:a}){const s=t,o=e.ref(s.value),n=a,c=v=>{o.value=v,n("update:value",v)};return e.provide("stepper",{value:o,updateValue:c}),e.watch(()=>s.value,v=>{o.value=v}),r({updateValue:c}),(v,k)=>e.renderSlot(v.$slots,"default",{updateValue:c})}}),he=e.defineComponent({__name:"Step",props:{value:{}},setup(t){const r=t,a=e.inject("stepper"),s=e.ref("");return e.watch(()=>a==null?void 0:a.value.value,o=>{o&&r.value&&(s.value=Number(o)>=Number(r.value)?"step-primary":"")}),e.onMounted(()=>{a&&(s.value=a.value.value===r.value?"step-primary":"",Number(a.value.value)>=Number(r.value)&&(s.value="step-primary"))}),(o,n)=>(e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass(["step",s.value])},[e.renderSlot(o.$slots,"default")],2))}}),ge={},_e={class:"steps"};function ye(t,r){return e.openBlock(),e.createElementBlock("ul",_e,[e.renderSlot(t.$slots,"default")])}const ke=U(ge,[["render",ye]]),Be={key:0},xe=e.defineComponent({__name:"StepPanels",setup(t){const r=e.inject("stepper");return(a,s)=>(e.openBlock(),e.createBlock(e.Transition,{name:"fade",mode:"out-in"},{default:e.withCtx(()=>{var o,n;return[(o=e.unref(r))!=null&&o.value?(e.openBlock(),e.createElementBlock("div",Be,[e.renderSlot(a.$slots,"default",{currentStep:(n=e.unref(r))==null?void 0:n.value})])):e.createCommentVNode("",!0)]}),_:3}))}}),Se={key:0},Ee=e.defineComponent({__name:"StepPanel",props:{value:{}},setup(t,{expose:r}){const a=e.computed(()=>s==null?void 0:s.value.value),s=e.inject("stepper"),o=n=>{s&&s.updateValue(n.toString())};return r({activateCallback:o}),(n,c)=>n.value===a.value?(e.openBlock(),e.createElementBlock("div",Se,[e.renderSlot(n.$slots,"default",{activateCallback:o})])):e.createCommentVNode("",!0)}}),we={className:"modal-box"},Ne={key:0,method:"dialog"},Ce=e.defineComponent({__name:"Modal",props:{closeButton:{type:Boolean,default:!0},overflow:{type:Boolean,default:!1}},emits:["close"],setup(t,{expose:r,emit:a}){const s=e.ref(null),o=a,n=t,c=e.ref($("modal",{"overflow-visible":n.overflow}));return r({showModal:()=>{var B;(B=s.value)==null||B.showModal()},closeModal:()=>{var B;(B=s.value)==null||B.close()}}),(B,b)=>(e.openBlock(),e.createElementBlock("dialog",{ref_key:"modal",ref:s,class:e.normalizeClass(c.value),"aria-modal":"true","aria-hidden":"true",role:"dialog",onClose:b[0]||(b[0]=x=>o("close",x))},[e.createElementVNode("div",we,[B.closeButton?(e.openBlock(),e.createElementBlock("form",Ne,b[1]||(b[1]=[e.createElementVNode("button",{className:"btn btn-sm btn-circle btn-ghost absolute right-2 top-2"},"✕",-1)]))):e.createCommentVNode("",!0),e.renderSlot(B.$slots,"default")])],34))}}),Me={class:"hidden w-full max-w-sm lg:flex"},$e={class:"relative mx-3 w-full"},Le={class:"w-full max-w-full relative"},Ve=e.defineComponent({__name:"SearchBar",emits:["input"],setup(t,{emit:r}){const a=e.ref(null),s=r,o=n=>{(n.ctrlKey||n.metaKey)&&n.key.toLowerCase()==="k"&&(n.preventDefault(),a.value&&a.value.focus())};return e.onMounted(()=>{document.addEventListener("keydown",o)}),e.onUnmounted(()=>{document.removeEventListener("keydown",o)}),(n,c)=>(e.openBlock(),e.createElementBlock("div",Me,[e.createElementVNode("label",$e,[c[1]||(c[1]=e.createElementVNode("svg",{class:"pointer-events-none absolute z-10 my-3.5 ms-4 opacity-60 text-base-content","aria-hidden":"true",width:"16",height:"16",viewBox:"0.48 0.48 23.04 23.04",fill:"currentColor"},[e.createElementVNode("path",{fill:"none",d:"M0 0h24v24H0z"}),e.createElementVNode("path",{d:"M15.5 14h-.79l-.28-.27A6.471 6.471 0 0016 9.5 6.5 6.5 0 109.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"})],-1)),e.createElementVNode("div",Le,[e.createElementVNode("form",null,[e.createElementVNode("input",{ref_key:"searchInput",ref:a,type:"search",placeholder:"Zoeken...",onInput:c[0]||(c[0]=v=>s("input",v.target.value)),class:"bg-transparent color-[inherit] border-[2px] border-solid border-transparent focus:border-[2px] focus:border-base-200 focus:outline-none rounded-xl w-full px-3 py-2 ps-10"},null,544)])]),c[2]||(c[2]=e.createElementVNode("div",{class:"pointer-events-none absolute end-10 top-2.5 gap-1 opacity-50 rtl:flex-row-reverse hidden lg:flex"},[e.createElementVNode("kbd",{class:"kbd kbd-sm"},"ctrl"),e.createElementVNode("kbd",{class:"kbd kbd-sm"},"K")],-1))])]))}}),ze=["bg-primary","bg-primary-content","bg-secondary","bg-secondary-content","bg-accent","bg-accent-content","bg-neutral","bg-neutral-content","bg-base-100","bg-base-200","bg-base-300","bg-base-content","bg-info","bg-info-content","bg-success","bg-success-content","bg-warning","bg-warning-content","bg-error","bg-error-content","btn-primary","btn-primary-content","btn-secondary","btn-secondary-content","btn-accent","btn-accent-content","btn-neutral","btn-neutral-content","btn-base-100","btn-base-200","btn-base-300","btn-base-content","btn-info","btn-info-content","btn-success","btn-success-content","btn-warning","btn-warning-content","btn-error","btn-error-content","text-primary","text-primary-content","text-secondary","text-secondary-content","text-accent","text-accent-content","text-neutral","text-neutral-content","text-base-100","text-base-200","text-base-300","text-base-content","text-info","text-info-content","text-success","text-success-content","text-warning","text-warning-content","text-error","text-error-content","text-transparent","step","steps","modal","modal-box","btn","btn-sm","btn-circle","btn-ghost","absolute","right-2","top-2","shadow-lg","w-full","rounded-xs","rounded-sm","rounded-md","rounded-lg","rounded-xl","rounded-2xl","rounded-3xl","hidden","block"];exports.Button=re;exports.Card=ae;exports.CardBody=le;exports.CardTitle=ue;exports.Color=L;exports.ColorUtils=D;exports.Container=ie;exports.Modal=Ce;exports.SearchBar=Ve;exports.Size=O;exports.SizeUtils=H;exports.Step=he;exports.StepList=ke;exports.StepPanel=Ee;exports.StepPanels=xe;exports.Stepper=be;exports.Table=me;exports.dendelionSafeList=ze;

package/dist/dendelion-ui.es.js

@@ -1,8 +1,8 @@
-import { defineComponent as i, ref as p, watch as v, openBlock as u, createElementBlock as l, normalizeClass as b, createElementVNode as g, renderSlot as d, createBlock as N, resolveDynamicComponent as T, withCtx as k, createTextVNode as C, toDisplayString as O, provide as W, inject as x, onMounted as X, Transition as V, unref as w, createCommentVNode as h, computed as j } from "vue";
-var $ = /* @__PURE__ */ ((e) => (e[e.Primary = 0] = "Primary", e[e.PrimaryContent = 1] = "PrimaryContent", e[e.Secondary = 2] = "Secondary", e[e.SecondaryContent = 3] = "SecondaryContent", e[e.Accent = 4] = "Accent", e[e.AccentContent = 5] = "AccentContent", e[e.Neutral = 6] = "Neutral", e[e.NeutralContent = 7] = "NeutralContent", e[e.Base100 = 8] = "Base100", e[e.Base200 = 9] = "Base200", e[e.Base300 = 10] = "Base300", e[e.BaseContent = 11] = "BaseContent", e[e.Info = 12] = "Info", e[e.InfoContent = 13] = "InfoContent", e[e.Success = 14] = "Success", e[e.SuccessContent = 15] = "SuccessContent", e[e.Warning = 16] = "Warning", e[e.WarningContent = 17] = "WarningContent", e[e.Error = 18] = "Error", e[e.ErrorContent = 19] = "ErrorContent", e))($ || {});
-class B {
-  static toClassName(t) {
-    switch (t) {
+import { defineComponent as N, ref as M, watch as R, createElementBlock as m, openBlock as h, normalizeClass as W, createElementVNode as _, renderSlot as T, createBlock as te, resolveDynamicComponent as be, withCtx as ne, createTextVNode as he, toDisplayString as re, computed as ae, Fragment as P, renderList as A, provide as ge, inject as H, onMounted as se, Transition as me, createCommentVNode as G, unref as U, onUnmounted as _e } from "vue";
+var K = /* @__PURE__ */ ((e) => (e[e.Primary = 0] = "Primary", e[e.PrimaryContent = 1] = "PrimaryContent", e[e.Secondary = 2] = "Secondary", e[e.SecondaryContent = 3] = "SecondaryContent", e[e.Accent = 4] = "Accent", e[e.AccentContent = 5] = "AccentContent", e[e.Neutral = 6] = "Neutral", e[e.NeutralContent = 7] = "NeutralContent", e[e.Base100 = 8] = "Base100", e[e.Base200 = 9] = "Base200", e[e.Base300 = 10] = "Base300", e[e.BaseContent = 11] = "BaseContent", e[e.Info = 12] = "Info", e[e.InfoContent = 13] = "InfoContent", e[e.Success = 14] = "Success", e[e.SuccessContent = 15] = "SuccessContent", e[e.Warning = 16] = "Warning", e[e.WarningContent = 17] = "WarningContent", e[e.Error = 18] = "Error", e[e.ErrorContent = 19] = "ErrorContent", e))(K || {});
+class Z {
+  static toClassName(n) {
+    switch (n) {
       case 0:
         return "primary";
       case 1:
@@ -48,88 +48,88 @@ class B {
     }
   }
 }
-function A(e) {
+function ue(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
 }
-var y = { exports: {} };
+var V = { exports: {} };
 /*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
 	http://jedwatson.github.io/classnames
 */
-var S;
-function D() {
-  return S || (S = 1, function(e) {
+var J;
+function ye() {
+  return J || (J = 1, function(e) {
     (function() {
-      var t = {}.hasOwnProperty;
-      function n() {
-        for (var s = "", o = 0; o < arguments.length; o++) {
-          var c = arguments[o];
-          c && (s = r(s, a(c)));
+      var n = {}.hasOwnProperty;
+      function r() {
+        for (var t = "", u = 0; u < arguments.length; u++) {
+          var p = arguments[u];
+          p && (t = s(t, a(p)));
         }
-        return s;
+        return t;
       }
-      function a(s) {
-        if (typeof s == "string" || typeof s == "number")
-          return s;
-        if (typeof s != "object")
+      function a(t) {
+        if (typeof t == "string" || typeof t == "number")
+          return t;
+        if (typeof t != "object")
           return "";
-        if (Array.isArray(s))
-          return n.apply(null, s);
-        if (s.toString !== Object.prototype.toString && !s.toString.toString().includes("[native code]"))
-          return s.toString();
-        var o = "";
-        for (var c in s)
-          t.call(s, c) && s[c] && (o = r(o, c));
-        return o;
+        if (Array.isArray(t))
+          return r.apply(null, t);
+        if (t.toString !== Object.prototype.toString && !t.toString.toString().includes("[native code]"))
+          return t.toString();
+        var u = "";
+        for (var p in t)
+          n.call(t, p) && t[p] && (u = s(u, p));
+        return u;
       }
-      function r(s, o) {
-        return o ? s ? s + " " + o : s + o : s;
+      function s(t, u) {
+        return u ? t ? t + " " + u : t + u : t;
       }
-      e.exports ? (n.default = n, e.exports = n) : window.classNames = n;
+      e.exports ? (r.default = r, e.exports = r) : window.classNames = r;
     })();
-  }(y)), y.exports;
+  }(V)), V.exports;
 }
-var R = D();
-const m = /* @__PURE__ */ A(R), I = ["type"], q = { class: "group-[.is-loading]:text-transparent" }, ne = /* @__PURE__ */ i({
+var xe = ye();
+const D = /* @__PURE__ */ ue(xe), Se = ["type"], we = { class: "group-[.is-loading]:text-transparent" }, Xe = /* @__PURE__ */ N({
   __name: "Button",
   props: {
     type: { default: "button" },
     loading: { type: Boolean },
-    color: { default: $.Neutral },
+    color: { default: K.Neutral },
     click: {}
   },
   setup(e) {
-    const t = e, n = p(m(
+    const n = e, r = M(D(
       "btn",
       "group",
-      `btn-${B.toClassName(t.color)}`,
-      t.loading ? "is-loading" : ""
+      `btn-${Z.toClassName(n.color)}`,
+      n.loading ? "is-loading" : ""
     ));
-    return v(() => t.loading, (a) => {
-      n.value = m(
+    return R(() => n.loading, (a) => {
+      r.value = D(
         "btn",
         "group",
-        `btn-${B.toClassName(t.color)}`,
+        `btn-${Z.toClassName(n.color)}`,
         a ? "is-loading" : ""
       );
-    }), (a, r) => (u(), l("button", {
-      onClick: r[0] || (r[0] = //@ts-ignore
-      (...s) => a.click && a.click(...s)),
-      class: b(n.value),
+    }), (a, s) => (h(), m("button", {
+      onClick: s[0] || (s[0] = //@ts-ignore
+      (...t) => a.click && a.click(...t)),
+      class: W(r.value),
       type: a.type
     }, [
-      r[1] || (r[1] = g("span", { class: "loading loading-spinner loading-md absolute hidden group-[.is-loading]:block" }, null, -1)),
-      g("span", q, [
-        d(a.$slots, "default")
+      s[1] || (s[1] = _("span", { class: "loading loading-spinner loading-md absolute hidden group-[.is-loading]:block" }, null, -1)),
+      _("span", we, [
+        T(a.$slots, "default")
       ])
-    ], 10, I));
+    ], 10, Se));
   }
 });
-var M = /* @__PURE__ */ ((e) => (e[e.XS = 0] = "XS", e[e.SM = 1] = "SM", e[e.MD = 2] = "MD", e[e.LG = 3] = "LG", e[e.XL = 4] = "XL", e[e.TWOXL = 5] = "TWOXL", e[e.THREEXL = 6] = "THREEXL", e))(M || {});
-class G {
-  static toClassName(t) {
-    switch (t) {
+var oe = /* @__PURE__ */ ((e) => (e[e.XS = 0] = "XS", e[e.SM = 1] = "SM", e[e.MD = 2] = "MD", e[e.LG = 3] = "LG", e[e.XL = 4] = "XL", e[e.TWOXL = 5] = "TWOXL", e[e.THREEXL = 6] = "THREEXL", e))(oe || {});
+class ke {
+  static toClassName(n) {
+    switch (n) {
       case 0:
         return "xs";
       case 1:
@@ -149,214 +149,442 @@ class G {
     }
   }
 }
-const se = /* @__PURE__ */ i({
+const Ie = /* @__PURE__ */ N({
   __name: "Card",
   props: {
-    backgroundColor: { default: $.Primary },
+    backgroundColor: { default: K.Primary },
     shadow: { type: Boolean, default: !1 },
     fullWidth: { type: Boolean, default: !1 },
     rounded: { type: Boolean },
     roundedSize: {}
   },
   setup(e) {
-    const t = e, n = p(m(
+    const n = e, r = M(D(
       "card",
-      `bg-${t.backgroundColor}`,
-      t.shadow ? "shadow-lg" : "",
-      t.fullWidth ? "w-full" : "",
-      t.rounded && !t.roundedSize ? "rounded" : t.roundedSize ? `rounded-${t.roundedSize}` : ""
+      `bg-${n.backgroundColor}`,
+      n.shadow ? "shadow-lg" : "",
+      n.fullWidth ? "w-full" : "",
+      n.rounded && !n.roundedSize ? "rounded" : n.roundedSize ? `rounded-${n.roundedSize}` : ""
     ));
-    return (a, r) => (u(), l("div", {
-      class: b(n.value)
+    return (a, s) => (h(), m("div", {
+      class: W(r.value)
     }, [
-      d(a.$slots, "default")
+      T(a.$slots, "default")
     ], 2));
   }
-}), E = (e, t) => {
-  const n = e.__vccOpts || e;
-  for (const [a, r] of t)
-    n[a] = r;
-  return n;
-}, H = {}, U = { class: "card-body" };
-function F(e, t) {
-  return u(), l("div", U, [
-    d(e.$slots, "default")
+}), ce = (e, n) => {
+  const r = e.__vccOpts || e;
+  for (const [a, s] of n)
+    r[a] = s;
+  return r;
+}, Me = {}, $e = { class: "card-body" };
+function Be(e, n) {
+  return h(), m("div", $e, [
+    T(e.$slots, "default")
   ]);
 }
-const ae = /* @__PURE__ */ E(H, [["render", F]]), re = /* @__PURE__ */ i({
+const He = /* @__PURE__ */ ce(Me, [["render", Be]]), Ge = /* @__PURE__ */ N({
   __name: "CardTitle",
   props: {
     is: { default: "h1" },
     text: { default: "" }
   },
   setup(e) {
-    return (t, n) => (u(), N(T(t.is), { class: "card-title" }, {
-      default: k(() => [
-        C(O(t.text), 1)
+    return (n, r) => (h(), te(be(n.is), { class: "card-title" }, {
+      default: ne(() => [
+        he(re(n.text), 1)
       ]),
       _: 1
     }));
   }
-}), oe = /* @__PURE__ */ i({
+}), Ke = /* @__PURE__ */ N({
   __name: "Container",
   props: {
     container: { type: Boolean, default: !0 },
     padding: { type: Boolean, default: !0 }
   },
   setup(e) {
-    const t = e, n = p([
-      t.container ? "container" : "",
+    const n = e, r = M([
+      n.container ? "container" : "",
       //To disable the max width in some cases
-      t.padding ? "p-6" : ""
+      n.padding ? "p-6" : ""
     ]);
-    return (a, r) => (u(), l("div", {
-      class: b(n.value)
+    return (a, s) => (h(), m("div", {
+      class: W(r.value)
     }, [
-      d(a.$slots, "default")
+      T(a.$slots, "default")
     ], 2));
   }
-}), ce = /* @__PURE__ */ i({
+});
+var X = {}, I = {}, Y;
+function le() {
+  return Y || (Y = 1, function(e) {
+    e.__esModule = !0, e.default = s;
+    var n = /[\u0300-\u036f]/g, r = /ł/g, a = /ñ/g;
+    function s(t) {
+      return t.toLowerCase().normalize("NFD").replace(n, "").replace(r, "l").replace(a, "n").trim();
+    }
+  }(I)), I;
+}
+var F = {}, j;
+function Q() {
+  if (j) return F;
+  j = 1, F.__esModule = !0, F.aggressiveFuzzyMatch = w, F.createFuzzySearchImpl = ie, F.experimentalSmartFuzzyMatch = k, F.fuzzyMatchImpl = $;
+  var e = n(le());
+  function n(c) {
+    return c && c.__esModule ? c : { default: c };
+  }
+  var r = Number.MAX_SAFE_INTEGER, a = function(o, v) {
+    return (
+      /*: number*/
+      o.score - v.score
+    );
+  }, s = function(o, v) {
+    return (
+      /*: number*/
+      o[0] - v[0]
+    );
+  }, t = new Set(`  []()-–—'"“”`.split(""));
+  function u(c) {
+    return t.has(c);
+  }
+  function p(c, o, v, x, l, g, d) {
+    if (c === x)
+      return [0, [[0, c.length - 1]]];
+    var i = x.length, f = o.length, y = l.length;
+    if (o === l)
+      return [0.1, [[0, f - 1]]];
+    if (o.startsWith(l))
+      return [0.5, [[0, y - 1]]];
+    var B = c.indexOf(x);
+    if (B > -1 && u(c[B - 1]))
+      return [0.9, [[B, B + i - 1]]];
+    var S = o.indexOf(l);
+    if (S > -1 && u(o[S - 1]))
+      return [1, [[S, S + i - 1]]];
+    var L = g.length;
+    if (L > 1 && g.every(function(z) {
+      return v.has(z);
+    })) {
+      var E = 1.5 + L * 0.2;
+      return [E, g.map(function(z) {
+        var C = o.indexOf(z);
+        return [C, C + z.length - 1];
+      }).sort(s)];
+    }
+    return S > -1 ? [2, [[S, S + i - 1]]] : d === "aggressive" ? w(o, l) : d === "smart" ? k(o, l) : null;
+  }
+  function w(c, o) {
+    for (var v = c.length, x = o.length, l = 0, g = o[l], d = [], i = -1, f = -2, y = 0; y < v; y += 1)
+      if (c[y] === g) {
+        if (y !== f + 1 && (i >= 0 && d.push([i, f]), i = y), f = y, l += 1, l === x)
+          return d.push([i, f]), b(d, c);
+        g = o[l];
+      }
+    return null;
+  }
+  function k(c, o) {
+    for (var v = c.length, x = [], l = 0, g = o[l], d = -1, i = -2; ; ) {
+      var f = c.indexOf(g, i + 1);
+      if (f === -1)
+        break;
+      if (f === 0 || u(c[f - 1]))
+        d = f;
+      else {
+        var y = o.length - l, B = c.length - f, S = Math.min(3, y, B), L = o.slice(l, l + S);
+        if (c.slice(f, f + S) === L)
+          d = f;
+        else {
+          i += 1;
+          continue;
+        }
+      }
+      for (i = d; i < v && c[i] === g; i += 1)
+        l += 1, g = o[l];
+      if (i -= 1, x.push([d, i]), l === o.length)
+        return b(x, c);
+    }
+    return null;
+  }
+  function b(c, o) {
+    var v = 2;
+    return c.forEach(function(x) {
+      var l = x[0], g = x[1], d = g - l + 1, i = l === 0 || o[l] === " " || o[l - 1] === " ", f = g === o.length - 1 || o[g] === " " || o[g + 1] === " ", y = i && f;
+      y ? v += 0.2 : i ? v += 0.4 : d >= 3 ? v += 0.8 : v += 1.6;
+    }), [v, c];
+  }
+  function $(c, o) {
+    var v = (0, e.default)(o), x = v.split(" "), l = (0, e.default)(c), g = new Set(l.split(" ")), d = p(c, l, g, o, v, x, "smart");
+    return d ? {
+      item: c,
+      score: d[0],
+      matches: [d[1]]
+    } : null;
+  }
+  function ie(c, o) {
+    var v = o.strategy, x = v === void 0 ? "aggressive" : v, l = o.getText, g = c.map(function(d) {
+      var i;
+      if (l)
+        i = l(d);
+      else {
+        var f = o.key ? d[o.key] : d;
+        i = [f];
+      }
+      var y = i.map(function(B) {
+        var S = B || "", L = (0, e.default)(S), E = new Set(L.split(" "));
+        return [S, L, E];
+      });
+      return [d, y];
+    });
+    return function(d) {
+      var i = [], f = (0, e.default)(d), y = f.split(" ");
+      return f.length ? (g.forEach(function(B) {
+        for (var S = B[0], L = B[1], E = r, z = [], C = 0, de = L.length; C < de; C += 1) {
+          var O = L[C], fe = O[0], pe = O[1], ve = O[2], q = p(fe, pe, ve, d, f, y, x);
+          q ? (E = Math.min(E, q[0]), z.push(q[1])) : z.push(null);
+        }
+        E < r && i.push({
+          item: S,
+          score: E,
+          matches: z
+        });
+      }), i.sort(a), i) : [];
+    };
+  }
+  return F;
+}
+var ee;
+function Ne() {
+  return ee || (ee = 1, function(e) {
+    e.__esModule = !0, e.default = a, e.fuzzyMatch = s;
+    var n = r(le());
+    e.normalizeText = n.default;
+    function r(t) {
+      return t && t.__esModule ? t : { default: t };
+    }
+    function a(t, u) {
+      return u === void 0 && (u = {}), Q().createFuzzySearchImpl(t, u);
+    }
+    function s(t, u) {
+      return Q().fuzzyMatchImpl(t, u);
+    }
+  }(X)), X;
+}
+var Le = Ne();
+const Te = /* @__PURE__ */ ue(Le), Ee = ["innerHTML"], Ue = /* @__PURE__ */ N({
   __name: "Table",
   props: {
     zebra: { type: Boolean, default: !1 },
     pinRows: { type: Boolean, default: !1 },
     pinCols: { type: Boolean, default: !1 },
-    size: { default: M.MD },
+    size: { default: oe.MD },
     columns: {},
     dataSource: {},
-    ajax: {}
+    ajax: {},
+    searchValue: {},
+    searchFunction: {}
   },
   setup(e) {
-    const t = p(null), n = e, a = p(m("table", `table-${G.toClassName(n.size)}`, {
-      "table-zebra": n.zebra,
-      "table-pin-rows": n.pinRows,
-      "table-pin-cols	": n.pinCols
-    }));
-    return (r, s) => (u(), l("table", {
+    const n = M([]), r = M([]), a = ae(() => Te(n.value)), s = M(null), t = e, u = M(D("table", `table-${ke.toClassName(t.size)}`, {
+      "table-zebra": t.zebra,
+      "table-pin-rows": t.pinRows,
+      "table-pin-cols	": t.pinCols
+    })), p = (w, k) => String(!w || typeof w != "object" ? w : k.split(".").reduce((b, $) => b && (typeof b == "object" ? b[$] : b), w));
+    return R(() => t.searchValue, (w) => {
+      if (t.searchFunction) {
+        r.value = t.searchFunction(w ?? "");
+        return;
+      }
+      r.value = w ? a.value(w) : n.value;
+    }), (w, k) => (h(), m("table", {
       ref_key: "table",
-      ref: t,
-      class: b(a.value)
-    }, null, 2));
+      ref: s,
+      class: W(u.value)
+    }, [
+      _("thead", null, [
+        _("tr", null, [
+          (h(!0), m(P, null, A(t.columns, (b) => (h(), m("th", {
+            key: b.title
+          }, re(b.title), 1))), 128))
+        ])
+      ]),
+      _("tbody", null, [
+        (h(!0), m(P, null, A(r.value, (b) => (h(), m("tr", {
+          key: String(b)
+        }, [
+          (h(!0), m(P, null, A(t.columns, ($) => (h(), m("td", {
+            key: $.title,
+            innerHTML: $.render ? $.render(p(b, $.data), b) : p(b, $.data)
+          }, null, 8, Ee))), 128))
+        ]))), 128))
+      ])
+    ], 2));
   }
-}), ue = /* @__PURE__ */ i({
+}), Ze = /* @__PURE__ */ N({
   __name: "Stepper",
   props: {
     value: {}
   },
   emits: ["update:value"],
-  setup(e, { expose: t, emit: n }) {
-    const a = e, r = p(a.value), s = n, o = (c) => {
-      r.value = c, s("update:value", c);
+  setup(e, { expose: n, emit: r }) {
+    const a = e, s = M(a.value), t = r, u = (p) => {
+      s.value = p, t("update:value", p);
     };
-    return W("stepper", {
-      value: r,
-      updateValue: o
-    }), v(() => a.value, (c) => {
-      r.value = c;
-    }), t({
-      updateValue: o
-    }), (c, P) => d(c.$slots, "default", { updateValue: o });
+    return ge("stepper", {
+      value: s,
+      updateValue: u
+    }), R(() => a.value, (p) => {
+      s.value = p;
+    }), n({
+      updateValue: u
+    }), (p, w) => T(p.$slots, "default", { updateValue: u });
   }
-}), le = /* @__PURE__ */ i({
+}), Je = /* @__PURE__ */ N({
   __name: "Step",
   props: {
     value: {}
   },
   setup(e) {
-    const t = e, n = x("stepper"), a = p("");
-    return v(() => n == null ? void 0 : n.value.value, (r) => {
-      r && t.value && (a.value = Number(r) >= Number(t.value) ? "step-primary" : "");
-    }), X(() => {
-      n && (a.value = n.value.value === t.value ? "step-primary" : "", Number(n.value.value) >= Number(t.value) && (a.value = "step-primary"));
-    }), (r, s) => (u(), l("li", {
-      class: b(["step", a.value])
+    const n = e, r = H("stepper"), a = M("");
+    return R(() => r == null ? void 0 : r.value.value, (s) => {
+      s && n.value && (a.value = Number(s) >= Number(n.value) ? "step-primary" : "");
+    }), se(() => {
+      r && (a.value = r.value.value === n.value ? "step-primary" : "", Number(r.value.value) >= Number(n.value) && (a.value = "step-primary"));
+    }), (s, t) => (h(), m("li", {
+      class: W(["step", a.value])
     }, [
-      d(r.$slots, "default")
+      T(s.$slots, "default")
     ], 2));
   }
-}), J = {}, K = { class: "steps" };
-function Q(e, t) {
-  return u(), l("ul", K, [
-    d(e.$slots, "default")
+}), ze = {}, Fe = { class: "steps" };
+function Ce(e, n) {
+  return h(), m("ul", Fe, [
+    T(e.$slots, "default")
   ]);
 }
-const ie = /* @__PURE__ */ E(J, [["render", Q]]), Y = { key: 0 }, de = /* @__PURE__ */ i({
+const Ye = /* @__PURE__ */ ce(ze, [["render", Ce]]), We = { key: 0 }, je = /* @__PURE__ */ N({
   __name: "StepPanels",
   setup(e) {
-    const t = x("stepper");
-    return (n, a) => (u(), N(V, {
+    const n = H("stepper");
+    return (r, a) => (h(), te(me, {
       name: "fade",
       mode: "out-in"
     }, {
-      default: k(() => {
-        var r, s;
+      default: ne(() => {
+        var s, t;
         return [
-          (r = w(t)) != null && r.value ? (u(), l("div", Y, [
-            d(n.$slots, "default", {
-              currentStep: (s = w(t)) == null ? void 0 : s.value
+          (s = U(n)) != null && s.value ? (h(), m("div", We, [
+            T(r.$slots, "default", {
+              currentStep: (t = U(n)) == null ? void 0 : t.value
             })
-          ])) : h("", !0)
+          ])) : G("", !0)
         ];
       }),
       _: 3
     }));
   }
-}), Z = { key: 0 }, pe = /* @__PURE__ */ i({
+}), De = { key: 0 }, Qe = /* @__PURE__ */ N({
   __name: "StepPanel",
   props: {
     value: {}
   },
-  setup(e, { expose: t }) {
-    const n = j(() => a == null ? void 0 : a.value.value), a = x("stepper"), r = (s) => {
-      a && a.updateValue(s.toString());
+  setup(e, { expose: n }) {
+    const r = ae(() => a == null ? void 0 : a.value.value), a = H("stepper"), s = (t) => {
+      a && a.updateValue(t.toString());
     };
-    return t({
-      activateCallback: r
-    }), (s, o) => s.value === n.value ? (u(), l("div", Z, [
-      d(s.$slots, "default", { activateCallback: r })
-    ])) : h("", !0);
+    return n({
+      activateCallback: s
+    }), (t, u) => t.value === r.value ? (h(), m("div", De, [
+      T(t.$slots, "default", { activateCallback: s })
+    ])) : G("", !0);
   }
-}), z = { className: "modal-box" }, ee = {
+}), Re = { className: "modal-box" }, Oe = {
   key: 0,
   method: "dialog"
-}, fe = /* @__PURE__ */ i({
+}, et = /* @__PURE__ */ N({
   __name: "Modal",
   props: {
     closeButton: { type: Boolean, default: !0 },
     overflow: { type: Boolean, default: !1 }
   },
   emits: ["close"],
-  setup(e, { expose: t, emit: n }) {
-    const a = p(null), r = n, o = p(m("modal", {
+  setup(e, { expose: n, emit: r }) {
+    const a = M(null), s = r, u = M(D("modal", {
       "overflow-visible": e.overflow
     }));
-    return t({
+    return n({
       showModal: () => {
-        var f;
-        (f = a.value) == null || f.showModal();
+        var k;
+        (k = a.value) == null || k.showModal();
       },
       closeModal: () => {
-        var f;
-        (f = a.value) == null || f.close();
+        var k;
+        (k = a.value) == null || k.close();
       }
-    }), (f, _) => (u(), l("dialog", {
+    }), (k, b) => (h(), m("dialog", {
       ref_key: "modal",
       ref: a,
-      class: b(o.value),
+      class: W(u.value),
       "aria-modal": "true",
       "aria-hidden": "true",
       role: "dialog",
-      onClose: _[0] || (_[0] = (L) => r("close", L))
+      onClose: b[0] || (b[0] = ($) => s("close", $))
     }, [
-      g("div", z, [
-        f.closeButton ? (u(), l("form", ee, _[1] || (_[1] = [
-          g("button", { className: "btn btn-sm btn-circle btn-ghost absolute right-2 top-2" }, "✕", -1)
-        ]))) : h("", !0),
-        d(f.$slots, "default")
+      _("div", Re, [
+        k.closeButton ? (h(), m("form", Oe, b[1] || (b[1] = [
+          _("button", { className: "btn btn-sm btn-circle btn-ghost absolute right-2 top-2" }, "✕", -1)
+        ]))) : G("", !0),
+        T(k.$slots, "default")
       ])
     ], 34));
   }
-}), be = [
+}), qe = { class: "hidden w-full max-w-sm lg:flex" }, Pe = { class: "relative mx-3 w-full" }, Ae = { class: "w-full max-w-full relative" }, tt = /* @__PURE__ */ N({
+  __name: "SearchBar",
+  emits: ["input"],
+  setup(e, { emit: n }) {
+    const r = M(null), a = n, s = (t) => {
+      (t.ctrlKey || t.metaKey) && t.key.toLowerCase() === "k" && (t.preventDefault(), r.value && r.value.focus());
+    };
+    return se(() => {
+      document.addEventListener("keydown", s);
+    }), _e(() => {
+      document.removeEventListener("keydown", s);
+    }), (t, u) => (h(), m("div", qe, [
+      _("label", Pe, [
+        u[1] || (u[1] = _("svg", {
+          class: "pointer-events-none absolute z-10 my-3.5 ms-4 opacity-60 text-base-content",
+          "aria-hidden": "true",
+          width: "16",
+          height: "16",
+          viewBox: "0.48 0.48 23.04 23.04",
+          fill: "currentColor"
+        }, [
+          _("path", {
+            fill: "none",
+            d: "M0 0h24v24H0z"
+          }),
+          _("path", { d: "M15.5 14h-.79l-.28-.27A6.471 6.471 0 0016 9.5 6.5 6.5 0 109.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z" })
+        ], -1)),
+        _("div", Ae, [
+          _("form", null, [
+            _("input", {
+              ref_key: "searchInput",
+              ref: r,
+              type: "search",
+              placeholder: "Zoeken...",
+              onInput: u[0] || (u[0] = (p) => a("input", p.target.value)),
+              class: "bg-transparent color-[inherit] border-[2px] border-solid border-transparent focus:border-[2px] focus:border-base-200 focus:outline-none rounded-xl w-full px-3 py-2 ps-10"
+            }, null, 544)
+          ])
+        ]),
+        u[2] || (u[2] = _("div", { class: "pointer-events-none absolute end-10 top-2.5 gap-1 opacity-50 rtl:flex-row-reverse hidden lg:flex" }, [
+          _("kbd", { class: "kbd kbd-sm" }, "ctrl"),
+          _("kbd", { class: "kbd kbd-sm" }, "K")
+        ], -1))
+      ])
+    ]));
+  }
+}), nt = [
   "bg-primary",
   "bg-primary-content",
   "bg-secondary",
@@ -442,21 +670,22 @@ const ie = /* @__PURE__ */ E(J, [["render", Q]]), Y = { key: 0 }, de = /* @__PUR
   "block"
 ];
 export {
-  ne as Button,
-  se as Card,
-  ae as CardBody,
-  re as CardTitle,
-  $ as Color,
-  B as ColorUtils,
-  oe as Container,
-  fe as Modal,
-  M as Size,
-  G as SizeUtils,
-  le as Step,
-  ie as StepList,
-  pe as StepPanel,
-  de as StepPanels,
-  ue as Stepper,
-  ce as Table,
-  be as dendelionSafeList
+  Xe as Button,
+  Ie as Card,
+  He as CardBody,
+  Ge as CardTitle,
+  K as Color,
+  Z as ColorUtils,
+  Ke as Container,
+  et as Modal,
+  tt as SearchBar,
+  oe as Size,
+  ke as SizeUtils,
+  Je as Step,
+  Ye as StepList,
+  Qe as StepPanel,
+  je as StepPanels,
+  Ze as Stepper,
+  Ue as Table,
+  nt as dendelionSafeList
 };

package/dist/dendelion-ui.umd.js

@@ -1,5 +1,5 @@
-(function(c,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(c=typeof globalThis<"u"?globalThis:c||self,t(c.DendelionUI={},c.Vue))})(this,function(c,t){"use strict";var p=(e=>(e[e.Primary=0]="Primary",e[e.PrimaryContent=1]="PrimaryContent",e[e.Secondary=2]="Secondary",e[e.SecondaryContent=3]="SecondaryContent",e[e.Accent=4]="Accent",e[e.AccentContent=5]="AccentContent",e[e.Neutral=6]="Neutral",e[e.NeutralContent=7]="NeutralContent",e[e.Base100=8]="Base100",e[e.Base200=9]="Base200",e[e.Base300=10]="Base300",e[e.BaseContent=11]="BaseContent",e[e.Info=12]="Info",e[e.InfoContent=13]="InfoContent",e[e.Success=14]="Success",e[e.SuccessContent=15]="SuccessContent",e[e.Warning=16]="Warning",e[e.WarningContent=17]="WarningContent",e[e.Error=18]="Error",e[e.ErrorContent=19]="ErrorContent",e))(p||{});class m{static toClassName(n){switch(n){case 0:return"primary";case 1:return"primary-content";case 2:return"secondary";case 3:return"secondary-content";case 4:return"accent";case 5:return"accent-content";case 6:return"neutral";case 7:return"neutral-content";case 8:return"base-100";case 9:return"base-200";case 10:return"base-300";case 11:return"base-content";case 12:return"info";case 13:return"info-content";case 14:return"success";case 15:return"success-content";case 16:return"warning";case 17:return"warning-content";case 18:return"error";case 19:return"error-content";default:return"primary"}}}function h(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var b={exports:{}};/*!
+(function(p,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(p=typeof globalThis<"u"?globalThis:p||self,e(p.DendelionUI={},p.Vue))})(this,function(p,e){"use strict";var T=(t=>(t[t.Primary=0]="Primary",t[t.PrimaryContent=1]="PrimaryContent",t[t.Secondary=2]="Secondary",t[t.SecondaryContent=3]="SecondaryContent",t[t.Accent=4]="Accent",t[t.AccentContent=5]="AccentContent",t[t.Neutral=6]="Neutral",t[t.NeutralContent=7]="NeutralContent",t[t.Base100=8]="Base100",t[t.Base200=9]="Base200",t[t.Base300=10]="Base300",t[t.BaseContent=11]="BaseContent",t[t.Info=12]="Info",t[t.InfoContent=13]="InfoContent",t[t.Success=14]="Success",t[t.SuccessContent=15]="SuccessContent",t[t.Warning=16]="Warning",t[t.WarningContent=17]="WarningContent",t[t.Error=18]="Error",t[t.ErrorContent=19]="ErrorContent",t))(T||{});class V{static toClassName(r){switch(r){case 0:return"primary";case 1:return"primary-content";case 2:return"secondary";case 3:return"secondary-content";case 4:return"accent";case 5:return"accent-content";case 6:return"neutral";case 7:return"neutral-content";case 8:return"base-100";case 9:return"base-200";case 10:return"base-300";case 11:return"base-content";case 12:return"info";case 13:return"info-content";case 14:return"success";case 15:return"success-content";case 16:return"warning";case 17:return"warning-content";case 18:return"error";case 19:return"error-content";default:return"primary"}}}function q(t){return t&&t.__esModule&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t}var z={exports:{}};/*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
 	http://jedwatson.github.io/classnames
-*/var y;function S(){return y||(y=1,function(e){(function(){var n={}.hasOwnProperty;function s(){for(var a="",l=0;l<arguments.length;l++){var i=arguments[l];i&&(a=o(a,r(i)))}return a}function r(a){if(typeof a=="string"||typeof a=="number")return a;if(typeof a!="object")return"";if(Array.isArray(a))return s.apply(null,a);if(a.toString!==Object.prototype.toString&&!a.toString.toString().includes("[native code]"))return a.toString();var l="";for(var i in a)n.call(a,i)&&a[i]&&(l=o(l,i));return l}function o(a,l){return l?a?a+" "+l:a+l:a}e.exports?(s.default=s,e.exports=s):window.classNames=s})()}(b)),b.exports}var k=S();const u=h(k),w=["type"],$={class:"group-[.is-loading]:text-transparent"},C=t.defineComponent({__name:"Button",props:{type:{default:"button"},loading:{type:Boolean},color:{default:p.Neutral},click:{}},setup(e){const n=e,s=t.ref(u("btn","group",`btn-${m.toClassName(n.color)}`,n.loading?"is-loading":""));return t.watch(()=>n.loading,r=>{s.value=u("btn","group",`btn-${m.toClassName(n.color)}`,r?"is-loading":"")}),(r,o)=>(t.openBlock(),t.createElementBlock("button",{onClick:o[0]||(o[0]=(...a)=>r.click&&r.click(...a)),class:t.normalizeClass(s.value),type:r.type},[o[1]||(o[1]=t.createElementVNode("span",{class:"loading loading-spinner loading-md absolute hidden group-[.is-loading]:block"},null,-1)),t.createElementVNode("span",$,[t.renderSlot(r.$slots,"default")])],10,w))}});var _=(e=>(e[e.XS=0]="XS",e[e.SM=1]="SM",e[e.MD=2]="MD",e[e.LG=3]="LG",e[e.XL=4]="XL",e[e.TWOXL=5]="TWOXL",e[e.THREEXL=6]="THREEXL",e))(_||{});class g{static toClassName(n){switch(n){case 0:return"xs";case 1:return"sm";case 2:return"md";case 3:return"lg";case 4:return"xl";case 5:return"2xl";case 6:return"3xl";default:return"md"}}}const N=t.defineComponent({__name:"Card",props:{backgroundColor:{default:p.Primary},shadow:{type:Boolean,default:!1},fullWidth:{type:Boolean,default:!1},rounded:{type:Boolean},roundedSize:{}},setup(e){const n=e,s=t.ref(u("card",`bg-${n.backgroundColor}`,n.shadow?"shadow-lg":"",n.fullWidth?"w-full":"",n.rounded&&!n.roundedSize?"rounded":n.roundedSize?`rounded-${n.roundedSize}`:""));return(r,o)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(s.value)},[t.renderSlot(r.$slots,"default")],2))}}),B=(e,n)=>{const s=e.__vccOpts||e;for(const[r,o]of n)s[r]=o;return s},x={},E={class:"card-body"};function M(e,n){return t.openBlock(),t.createElementBlock("div",E,[t.renderSlot(e.$slots,"default")])}const T=B(x,[["render",M]]),V=t.defineComponent({__name:"CardTitle",props:{is:{default:"h1"},text:{default:""}},setup(e){return(n,s)=>(t.openBlock(),t.createBlock(t.resolveDynamicComponent(n.is),{class:"card-title"},{default:t.withCtx(()=>[t.createTextVNode(t.toDisplayString(n.text),1)]),_:1}))}}),L=t.defineComponent({__name:"Container",props:{container:{type:Boolean,default:!0},padding:{type:Boolean,default:!0}},setup(e){const n=e,s=t.ref([n.container?"container":"",n.padding?"p-6":""]);return(r,o)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(s.value)},[t.renderSlot(r.$slots,"default")],2))}}),P=t.defineComponent({__name:"Table",props:{zebra:{type:Boolean,default:!1},pinRows:{type:Boolean,default:!1},pinCols:{type:Boolean,default:!1},size:{default:_.MD},columns:{},dataSource:{},ajax:{}},setup(e){const n=t.ref(null),s=e,r=t.ref(u("table",`table-${g.toClassName(s.size)}`,{"table-zebra":s.zebra,"table-pin-rows":s.pinRows,"table-pin-cols	":s.pinCols}));return(o,a)=>(t.openBlock(),t.createElementBlock("table",{ref_key:"table",ref:n,class:t.normalizeClass(r.value)},null,2))}}),j=t.defineComponent({__name:"Stepper",props:{value:{}},emits:["update:value"],setup(e,{expose:n,emit:s}){const r=e,o=t.ref(r.value),a=s,l=i=>{o.value=i,a("update:value",i)};return t.provide("stepper",{value:o,updateValue:l}),t.watch(()=>r.value,i=>{o.value=i}),n({updateValue:l}),(i,J)=>t.renderSlot(i.$slots,"default",{updateValue:l})}}),O=t.defineComponent({__name:"Step",props:{value:{}},setup(e){const n=e,s=t.inject("stepper"),r=t.ref("");return t.watch(()=>s==null?void 0:s.value.value,o=>{o&&n.value&&(r.value=Number(o)>=Number(n.value)?"step-primary":"")}),t.onMounted(()=>{s&&(r.value=s.value.value===n.value?"step-primary":"",Number(s.value.value)>=Number(n.value)&&(r.value="step-primary"))}),(o,a)=>(t.openBlock(),t.createElementBlock("li",{class:t.normalizeClass(["step",r.value])},[t.renderSlot(o.$slots,"default")],2))}}),W={},X={class:"steps"};function D(e,n){return t.openBlock(),t.createElementBlock("ul",X,[t.renderSlot(e.$slots,"default")])}const A=B(W,[["render",D]]),z={key:0},I=t.defineComponent({__name:"StepPanels",setup(e){const n=t.inject("stepper");return(s,r)=>(t.openBlock(),t.createBlock(t.Transition,{name:"fade",mode:"out-in"},{default:t.withCtx(()=>{var o,a;return[(o=t.unref(n))!=null&&o.value?(t.openBlock(),t.createElementBlock("div",z,[t.renderSlot(s.$slots,"default",{currentStep:(a=t.unref(n))==null?void 0:a.value})])):t.createCommentVNode("",!0)]}),_:3}))}}),R={key:0},U=t.defineComponent({__name:"StepPanel",props:{value:{}},setup(e,{expose:n}){const s=t.computed(()=>r==null?void 0:r.value.value),r=t.inject("stepper"),o=a=>{r&&r.updateValue(a.toString())};return n({activateCallback:o}),(a,l)=>a.value===s.value?(t.openBlock(),t.createElementBlock("div",R,[t.renderSlot(a.$slots,"default",{activateCallback:o})])):t.createCommentVNode("",!0)}}),q={className:"modal-box"},G={key:0,method:"dialog"},H=t.defineComponent({__name:"Modal",props:{closeButton:{type:Boolean,default:!0},overflow:{type:Boolean,default:!1}},emits:["close"],setup(e,{expose:n,emit:s}){const r=t.ref(null),o=s,a=e,l=t.ref(u("modal",{"overflow-visible":a.overflow}));return n({showModal:()=>{var d;(d=r.value)==null||d.showModal()},closeModal:()=>{var d;(d=r.value)==null||d.close()}}),(d,f)=>(t.openBlock(),t.createElementBlock("dialog",{ref_key:"modal",ref:r,class:t.normalizeClass(l.value),"aria-modal":"true","aria-hidden":"true",role:"dialog",onClose:f[0]||(f[0]=K=>o("close",K))},[t.createElementVNode("div",q,[d.closeButton?(t.openBlock(),t.createElementBlock("form",G,f[1]||(f[1]=[t.createElementVNode("button",{className:"btn btn-sm btn-circle btn-ghost absolute right-2 top-2"},"✕",-1)]))):t.createCommentVNode("",!0),t.renderSlot(d.$slots,"default")])],34))}}),F=["bg-primary","bg-primary-content","bg-secondary","bg-secondary-content","bg-accent","bg-accent-content","bg-neutral","bg-neutral-content","bg-base-100","bg-base-200","bg-base-300","bg-base-content","bg-info","bg-info-content","bg-success","bg-success-content","bg-warning","bg-warning-content","bg-error","bg-error-content","btn-primary","btn-primary-content","btn-secondary","btn-secondary-content","btn-accent","btn-accent-content","btn-neutral","btn-neutral-content","btn-base-100","btn-base-200","btn-base-300","btn-base-content","btn-info","btn-info-content","btn-success","btn-success-content","btn-warning","btn-warning-content","btn-error","btn-error-content","text-primary","text-primary-content","text-secondary","text-secondary-content","text-accent","text-accent-content","text-neutral","text-neutral-content","text-base-100","text-base-200","text-base-300","text-base-content","text-info","text-info-content","text-success","text-success-content","text-warning","text-warning-content","text-error","text-error-content","text-transparent","step","steps","modal","modal-box","btn","btn-sm","btn-circle","btn-ghost","absolute","right-2","top-2","shadow-lg","w-full","rounded-xs","rounded-sm","rounded-md","rounded-lg","rounded-xl","rounded-2xl","rounded-3xl","hidden","block"];c.Button=C,c.Card=N,c.CardBody=T,c.CardTitle=V,c.Color=p,c.ColorUtils=m,c.Container=L,c.Modal=H,c.Size=_,c.SizeUtils=g,c.Step=O,c.StepList=A,c.StepPanel=U,c.StepPanels=I,c.Stepper=j,c.Table=P,c.dendelionSafeList=F,Object.defineProperty(c,Symbol.toStringTag,{value:"Module"})});
+*/var P;function j(){return P||(P=1,function(t){(function(){var r={}.hasOwnProperty;function a(){for(var n="",c=0;c<arguments.length;c++){var h=arguments[c];h&&(n=o(n,s(h)))}return n}function s(n){if(typeof n=="string"||typeof n=="number")return n;if(typeof n!="object")return"";if(Array.isArray(n))return a.apply(null,n);if(n.toString!==Object.prototype.toString&&!n.toString.toString().includes("[native code]"))return n.toString();var c="";for(var h in n)r.call(n,h)&&n[h]&&(c=o(c,h));return c}function o(n,c){return c?n?n+" "+c:n+c:n}t.exports?(a.default=a,t.exports=a):window.classNames=a})()}(z)),z.exports}var Z=j();const L=q(Z),J=["type"],Y={class:"group-[.is-loading]:text-transparent"},Q=e.defineComponent({__name:"Button",props:{type:{default:"button"},loading:{type:Boolean},color:{default:T.Neutral},click:{}},setup(t){const r=t,a=e.ref(L("btn","group",`btn-${V.toClassName(r.color)}`,r.loading?"is-loading":""));return e.watch(()=>r.loading,s=>{a.value=L("btn","group",`btn-${V.toClassName(r.color)}`,s?"is-loading":"")}),(s,o)=>(e.openBlock(),e.createElementBlock("button",{onClick:o[0]||(o[0]=(...n)=>s.click&&s.click(...n)),class:e.normalizeClass(a.value),type:s.type},[o[1]||(o[1]=e.createElementVNode("span",{class:"loading loading-spinner loading-md absolute hidden group-[.is-loading]:block"},null,-1)),e.createElementVNode("span",Y,[e.renderSlot(s.$slots,"default")])],10,J))}});var F=(t=>(t[t.XS=0]="XS",t[t.SM=1]="SM",t[t.MD=2]="MD",t[t.LG=3]="LG",t[t.XL=4]="XL",t[t.TWOXL=5]="TWOXL",t[t.THREEXL=6]="THREEXL",t))(F||{});class A{static toClassName(r){switch(r){case 0:return"xs";case 1:return"sm";case 2:return"md";case 3:return"lg";case 4:return"xl";case 5:return"2xl";case 6:return"3xl";default:return"md"}}}const ee=e.defineComponent({__name:"Card",props:{backgroundColor:{default:T.Primary},shadow:{type:Boolean,default:!1},fullWidth:{type:Boolean,default:!1},rounded:{type:Boolean},roundedSize:{}},setup(t){const r=t,a=e.ref(L("card",`bg-${r.backgroundColor}`,r.shadow?"shadow-lg":"",r.fullWidth?"w-full":"",r.rounded&&!r.roundedSize?"rounded":r.roundedSize?`rounded-${r.roundedSize}`:""));return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(a.value)},[e.renderSlot(s.$slots,"default")],2))}}),X=(t,r)=>{const a=t.__vccOpts||t;for(const[s,o]of r)a[s]=o;return a},te={},ne={class:"card-body"};function re(t,r){return e.openBlock(),e.createElementBlock("div",ne,[e.renderSlot(t.$slots,"default")])}const ae=X(te,[["render",re]]),se=e.defineComponent({__name:"CardTitle",props:{is:{default:"h1"},text:{default:""}},setup(t){return(r,a)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(r.is),{class:"card-title"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.text),1)]),_:1}))}}),oe=e.defineComponent({__name:"Container",props:{container:{type:Boolean,default:!0},padding:{type:Boolean,default:!0}},setup(t){const r=t,a=e.ref([r.container?"container":"",r.padding?"p-6":""]);return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(a.value)},[e.renderSlot(s.$slots,"default")],2))}});var D={},W={},I;function U(){return I||(I=1,function(t){t.__esModule=!0,t.default=o;var r=/[\u0300-\u036f]/g,a=/ł/g,s=/ñ/g;function o(n){return n.toLowerCase().normalize("NFD").replace(r,"").replace(a,"l").replace(s,"n").trim()}}(W)),W}var M={},H;function G(){if(H)return M;H=1,M.__esModule=!0,M.aggressiveFuzzyMatch=S,M.createFuzzySearchImpl=$e,M.experimentalSmartFuzzyMatch=E,M.fuzzyMatchImpl=x;var t=r(U());function r(i){return i&&i.__esModule?i:{default:i}}var a=Number.MAX_SAFE_INTEGER,s=function(l,b){return l.score-b.score},o=function(l,b){return l[0]-b[0]},n=new Set(`  []()-–—'"“”`.split(""));function c(i){return n.has(i)}function h(i,l,b,k,u,y,f){if(i===k)return[0,[[0,i.length-1]]];var d=k.length,m=l.length,_=u.length;if(l===u)return[.1,[[0,m-1]]];if(l.startsWith(u))return[.5,[[0,_-1]]];var w=i.indexOf(k);if(w>-1&&c(i[w-1]))return[.9,[[w,w+d-1]]];var B=l.indexOf(u);if(B>-1&&c(l[B-1]))return[1,[[B,B+d-1]]];var N=y.length;if(N>1&&y.every(function(C){return b.has(C)})){var v=1.5+N*.2;return[v,y.map(function(C){var $=l.indexOf(C);return[$,$+C.length-1]}).sort(o)]}return B>-1?[2,[[B,B+d-1]]]:f==="aggressive"?S(l,u):f==="smart"?E(l,u):null}function S(i,l){for(var b=i.length,k=l.length,u=0,y=l[u],f=[],d=-1,m=-2,_=0;_<b;_+=1)if(i[_]===y){if(_!==m+1&&(d>=0&&f.push([d,m]),d=_),m=_,u+=1,u===k)return f.push([d,m]),g(f,i);y=l[u]}return null}function E(i,l){for(var b=i.length,k=[],u=0,y=l[u],f=-1,d=-2;;){var m=i.indexOf(y,d+1);if(m===-1)break;if(m===0||c(i[m-1]))f=m;else{var _=l.length-u,w=i.length-m,B=Math.min(3,_,w),N=l.slice(u,u+B);if(i.slice(m,m+B)===N)f=m;else{d+=1;continue}}for(d=f;d<b&&i[d]===y;d+=1)u+=1,y=l[u];if(d-=1,k.push([f,d]),u===l.length)return g(k,i)}return null}function g(i,l){var b=2;return i.forEach(function(k){var u=k[0],y=k[1],f=y-u+1,d=u===0||l[u]===" "||l[u-1]===" ",m=y===l.length-1||l[y]===" "||l[y+1]===" ",_=d&&m;_?b+=.2:d?b+=.4:f>=3?b+=.8:b+=1.6}),[b,i]}function x(i,l){var b=(0,t.default)(l),k=b.split(" "),u=(0,t.default)(i),y=new Set(u.split(" ")),f=h(i,u,y,l,b,k,"smart");return f?{item:i,score:f[0],matches:[f[1]]}:null}function $e(i,l){var b=l.strategy,k=b===void 0?"aggressive":b,u=l.getText,y=i.map(function(f){var d;if(u)d=u(f);else{var m=l.key?f[l.key]:f;d=[m]}var _=d.map(function(w){var B=w||"",N=(0,t.default)(B),v=new Set(N.split(" "));return[B,N,v]});return[f,_]});return function(f){var d=[],m=(0,t.default)(f),_=m.split(" ");return m.length?(y.forEach(function(w){for(var B=w[0],N=w[1],v=a,C=[],$=0,Le=N.length;$<Le;$+=1){var O=N[$],Te=O[0],Ve=O[1],ze=O[2],R=h(Te,Ve,ze,f,m,_,k);R?(v=Math.min(v,R[0]),C.push(R[1])):C.push(null)}v<a&&d.push({item:B,score:v,matches:C})}),d.sort(s),d):[]}}return M}var K;function ce(){return K||(K=1,function(t){t.__esModule=!0,t.default=s,t.fuzzyMatch=o;var r=a(U());t.normalizeText=r.default;function a(n){return n&&n.__esModule?n:{default:n}}function s(n,c){return c===void 0&&(c={}),G().createFuzzySearchImpl(n,c)}function o(n,c){return G().fuzzyMatchImpl(n,c)}}(D)),D}var le=ce();const ie=q(le),ue=["innerHTML"],de=e.defineComponent({__name:"Table",props:{zebra:{type:Boolean,default:!1},pinRows:{type:Boolean,default:!1},pinCols:{type:Boolean,default:!1},size:{default:F.MD},columns:{},dataSource:{},ajax:{},searchValue:{},searchFunction:{}},setup(t){const r=e.ref([]),a=e.ref([]),s=e.computed(()=>ie(r.value)),o=e.ref(null),n=t,c=e.ref(L("table",`table-${A.toClassName(n.size)}`,{"table-zebra":n.zebra,"table-pin-rows":n.pinRows,"table-pin-cols	":n.pinCols})),h=(S,E)=>String(!S||typeof S!="object"?S:E.split(".").reduce((g,x)=>g&&(typeof g=="object"?g[x]:g),S));return e.watch(()=>n.searchValue,S=>{if(n.searchFunction){a.value=n.searchFunction(S??"");return}a.value=S?s.value(S):r.value}),(S,E)=>(e.openBlock(),e.createElementBlock("table",{ref_key:"table",ref:o,class:e.normalizeClass(c.value)},[e.createElementVNode("thead",null,[e.createElementVNode("tr",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.columns,g=>(e.openBlock(),e.createElementBlock("th",{key:g.title},e.toDisplayString(g.title),1))),128))])]),e.createElementVNode("tbody",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.value,g=>(e.openBlock(),e.createElementBlock("tr",{key:String(g)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.columns,x=>(e.openBlock(),e.createElementBlock("td",{key:x.title,innerHTML:x.render?x.render(h(g,x.data),g):h(g,x.data)},null,8,ue))),128))]))),128))])],2))}}),fe=e.defineComponent({__name:"Stepper",props:{value:{}},emits:["update:value"],setup(t,{expose:r,emit:a}){const s=t,o=e.ref(s.value),n=a,c=h=>{o.value=h,n("update:value",h)};return e.provide("stepper",{value:o,updateValue:c}),e.watch(()=>s.value,h=>{o.value=h}),r({updateValue:c}),(h,S)=>e.renderSlot(h.$slots,"default",{updateValue:c})}}),pe=e.defineComponent({__name:"Step",props:{value:{}},setup(t){const r=t,a=e.inject("stepper"),s=e.ref("");return e.watch(()=>a==null?void 0:a.value.value,o=>{o&&r.value&&(s.value=Number(o)>=Number(r.value)?"step-primary":"")}),e.onMounted(()=>{a&&(s.value=a.value.value===r.value?"step-primary":"",Number(a.value.value)>=Number(r.value)&&(s.value="step-primary"))}),(o,n)=>(e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass(["step",s.value])},[e.renderSlot(o.$slots,"default")],2))}}),me={},he={class:"steps"};function be(t,r){return e.openBlock(),e.createElementBlock("ul",he,[e.renderSlot(t.$slots,"default")])}const ge=X(me,[["render",be]]),ye={key:0},_e=e.defineComponent({__name:"StepPanels",setup(t){const r=e.inject("stepper");return(a,s)=>(e.openBlock(),e.createBlock(e.Transition,{name:"fade",mode:"out-in"},{default:e.withCtx(()=>{var o,n;return[(o=e.unref(r))!=null&&o.value?(e.openBlock(),e.createElementBlock("div",ye,[e.renderSlot(a.$slots,"default",{currentStep:(n=e.unref(r))==null?void 0:n.value})])):e.createCommentVNode("",!0)]}),_:3}))}}),ke={key:0},Be=e.defineComponent({__name:"StepPanel",props:{value:{}},setup(t,{expose:r}){const a=e.computed(()=>s==null?void 0:s.value.value),s=e.inject("stepper"),o=n=>{s&&s.updateValue(n.toString())};return r({activateCallback:o}),(n,c)=>n.value===a.value?(e.openBlock(),e.createElementBlock("div",ke,[e.renderSlot(n.$slots,"default",{activateCallback:o})])):e.createCommentVNode("",!0)}}),Se={className:"modal-box"},Ee={key:0,method:"dialog"},xe=e.defineComponent({__name:"Modal",props:{closeButton:{type:Boolean,default:!0},overflow:{type:Boolean,default:!1}},emits:["close"],setup(t,{expose:r,emit:a}){const s=e.ref(null),o=a,n=t,c=e.ref(L("modal",{"overflow-visible":n.overflow}));return r({showModal:()=>{var E;(E=s.value)==null||E.showModal()},closeModal:()=>{var E;(E=s.value)==null||E.close()}}),(E,g)=>(e.openBlock(),e.createElementBlock("dialog",{ref_key:"modal",ref:s,class:e.normalizeClass(c.value),"aria-modal":"true","aria-hidden":"true",role:"dialog",onClose:g[0]||(g[0]=x=>o("close",x))},[e.createElementVNode("div",Se,[E.closeButton?(e.openBlock(),e.createElementBlock("form",Ee,g[1]||(g[1]=[e.createElementVNode("button",{className:"btn btn-sm btn-circle btn-ghost absolute right-2 top-2"},"✕",-1)]))):e.createCommentVNode("",!0),e.renderSlot(E.$slots,"default")])],34))}}),we={class:"hidden w-full max-w-sm lg:flex"},Ne={class:"relative mx-3 w-full"},ve={class:"w-full max-w-full relative"},Ce=e.defineComponent({__name:"SearchBar",emits:["input"],setup(t,{emit:r}){const a=e.ref(null),s=r,o=n=>{(n.ctrlKey||n.metaKey)&&n.key.toLowerCase()==="k"&&(n.preventDefault(),a.value&&a.value.focus())};return e.onMounted(()=>{document.addEventListener("keydown",o)}),e.onUnmounted(()=>{document.removeEventListener("keydown",o)}),(n,c)=>(e.openBlock(),e.createElementBlock("div",we,[e.createElementVNode("label",Ne,[c[1]||(c[1]=e.createElementVNode("svg",{class:"pointer-events-none absolute z-10 my-3.5 ms-4 opacity-60 text-base-content","aria-hidden":"true",width:"16",height:"16",viewBox:"0.48 0.48 23.04 23.04",fill:"currentColor"},[e.createElementVNode("path",{fill:"none",d:"M0 0h24v24H0z"}),e.createElementVNode("path",{d:"M15.5 14h-.79l-.28-.27A6.471 6.471 0 0016 9.5 6.5 6.5 0 109.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"})],-1)),e.createElementVNode("div",ve,[e.createElementVNode("form",null,[e.createElementVNode("input",{ref_key:"searchInput",ref:a,type:"search",placeholder:"Zoeken...",onInput:c[0]||(c[0]=h=>s("input",h.target.value)),class:"bg-transparent color-[inherit] border-[2px] border-solid border-transparent focus:border-[2px] focus:border-base-200 focus:outline-none rounded-xl w-full px-3 py-2 ps-10"},null,544)])]),c[2]||(c[2]=e.createElementVNode("div",{class:"pointer-events-none absolute end-10 top-2.5 gap-1 opacity-50 rtl:flex-row-reverse hidden lg:flex"},[e.createElementVNode("kbd",{class:"kbd kbd-sm"},"ctrl"),e.createElementVNode("kbd",{class:"kbd kbd-sm"},"K")],-1))])]))}}),Me=["bg-primary","bg-primary-content","bg-secondary","bg-secondary-content","bg-accent","bg-accent-content","bg-neutral","bg-neutral-content","bg-base-100","bg-base-200","bg-base-300","bg-base-content","bg-info","bg-info-content","bg-success","bg-success-content","bg-warning","bg-warning-content","bg-error","bg-error-content","btn-primary","btn-primary-content","btn-secondary","btn-secondary-content","btn-accent","btn-accent-content","btn-neutral","btn-neutral-content","btn-base-100","btn-base-200","btn-base-300","btn-base-content","btn-info","btn-info-content","btn-success","btn-success-content","btn-warning","btn-warning-content","btn-error","btn-error-content","text-primary","text-primary-content","text-secondary","text-secondary-content","text-accent","text-accent-content","text-neutral","text-neutral-content","text-base-100","text-base-200","text-base-300","text-base-content","text-info","text-info-content","text-success","text-success-content","text-warning","text-warning-content","text-error","text-error-content","text-transparent","step","steps","modal","modal-box","btn","btn-sm","btn-circle","btn-ghost","absolute","right-2","top-2","shadow-lg","w-full","rounded-xs","rounded-sm","rounded-md","rounded-lg","rounded-xl","rounded-2xl","rounded-3xl","hidden","block"];p.Button=Q,p.Card=ee,p.CardBody=ae,p.CardTitle=se,p.Color=T,p.ColorUtils=V,p.Container=oe,p.Modal=xe,p.SearchBar=Ce,p.Size=F,p.SizeUtils=A,p.Step=pe,p.StepList=ge,p.StepPanel=Be,p.StepPanels=_e,p.Stepper=fe,p.Table=de,p.dendelionSafeList=Me,Object.defineProperty(p,Symbol.toStringTag,{value:"Module"})});

package/dist/types/components/search/SearchBar.vue.d.ts

@@ -0,0 +1,8 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    input: (...args: any[]) => void;
+}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{
+    onInput?: ((...args: any[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {
+    searchInput: HTMLInputElement;
+}, HTMLDivElement>;
+export default _default;

package/dist/types/components/search/index.d.ts

@@ -0,0 +1 @@
+export { default as SearchBar } from './SearchBar.vue';

package/dist/types/components/table/Table.vue.d.ts

@@ -1,11 +1,14 @@
 import { TableProps } from './interface';
-import { Size } from '@/types';
-declare const _default: import("vue").DefineComponent<TableProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<TableProps> & Readonly<{}>, {
-    size: Size;
-    zebra: boolean;
-    pinRows: boolean;
-    pinCols: boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {
-    table: HTMLTableElement;
-}, HTMLTableElement>;
+declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{} & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, never> & TableProps<T> & Partial<{}>> & import("vue").PublicProps;
+    expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
+    attrs: any;
+    slots: {};
+    emit: {};
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
 export default _default;
+type __VLS_PrettifyLocal<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/dist/types/components/table/index.d.ts

@@ -1,2 +1,2 @@
 export { default as Table } from './Table.vue';
-export type { TableProps } from './interface';
+export * from './interface';

package/dist/types/components/table/interface.d.ts

@@ -1,17 +1,20 @@
 import { Size } from "@/types";
-export type TableProps = {
+import { Component, VNode } from "vue";
+export type TableProps<T> = {
     zebra?: boolean;
     pinRows?: boolean;
     pinCols?: boolean;
-    size: Size;
-    columns: Column[];
-    dataSource: Record<string, unknown>[];
-    ajax?: (params: object) => Promise<object>;
+    size?: Size;
+    columns: Column<T>[];
+    dataSource: T[];
+    ajax?: (params: object) => Promise<object> | string;
+    searchValue?: string;
+    searchFunction?: (searchValue: string) => T[];
 };
-export type Column = {
+export type Column<T> = {
     title: string;
     data: string;
-    render?: (text: string, record?: Record<string, unknown>) => string;
+    render?: (text: string, row: T) => string | Component | VNode;
     extraClasses?: ExtraClasses;
 };
 export type ExtraClasses = {

package/dist/types/components.d.ts

@@ -4,3 +4,4 @@ export * from './components/container';
 export * from './components/table';
 export * from './components/stepper';
 export * from './components/modal';
+export * from './components/search';

package/package.json

@@ -2,7 +2,7 @@
   "name": "dendelion-ui",
   "private": false,
   "description": "Simpel component library using Tailwind css and DaisyUI",
-  "version": "0.0.2",
+  "version": "0.0.5",
   "author": "ThatzOkay",
   "license": "MIT",
   "homepage": "https://github.com/ThatzOkay/DendelionUI#readme",
@@ -25,7 +25,7 @@
     "dist",
     "src"
   ],
-  "main": "./dist/apldendelion-uiayer.umd.js",
+  "main": "./dist/dendelion-ui.umd.js",
   "module": "./dist/dendelion-ui.es.js",
   "typings": "./dist/types/index.d.ts",
   "types": "./dist/types/index.d.ts",
@@ -52,7 +52,9 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@nozbe/microfuzz": "^1.0.0",
     "classnames": "^2.5.1",
+    "fuzzysearch": "^1.0.3",
     "vue": "^3.5.13"
   },
   "devDependencies": {
@@ -60,13 +62,13 @@
     "@vue/tsconfig": "^0.7.0",
     "cross-env": "^7.0.3",
     "daisyui": "^4.12.23",
-    "eslint": "^9.17.0",
+    "eslint": "^9.20.1",
     "eslint-plugin-vue": "^9.32.0",
     "fluid-tailwind": "^1.0.4",
     "rimraf": "^6.0.1",
     "typescript": "~5.7.0",
-    "typescript-eslint": "^8.19.1",
-    "vite": "^6.0.5",
+    "typescript-eslint": "^8.24.0",
+    "vite": "^6.1.0",
     "vue-tsc": "^2.2.0"
   }
 }

package/src/components/search/SearchBar.vue

@@ -0,0 +1,51 @@
+<template>
+    <div class="hidden w-full max-w-sm lg:flex">
+        <label class="relative mx-3 w-full">
+            <svg class="pointer-events-none absolute z-10 my-3.5 ms-4 opacity-60 text-base-content" aria-hidden="true"
+                width="16" height="16" viewBox="0.48 0.48 23.04 23.04" fill="currentColor">
+                <path fill="none" d="M0 0h24v24H0z"></path>
+                <path
+                    d="M15.5 14h-.79l-.28-.27A6.471 6.471 0 0016 9.5 6.5 6.5 0 109.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z">
+                </path>
+            </svg>
+            <div class="w-full max-w-full relative">
+                <form>
+                    <input ref="searchInput" type="search" placeholder="Zoeken..." @input="emit('input', ($event.target as HTMLInputElement).value)"
+                        class="bg-transparent color-[inherit] border-[2px] border-solid border-transparent focus:border-[2px] focus:border-base-200 focus:outline-none rounded-xl w-full px-3 py-2 ps-10">
+                </form>
+            </div>
+            <div
+                class="pointer-events-none absolute end-10 top-2.5 gap-1 opacity-50 rtl:flex-row-reverse hidden lg:flex">
+                <kbd class="kbd kbd-sm">ctrl</kbd>
+                <kbd class="kbd kbd-sm">K</kbd>
+            </div>
+        </label>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { onMounted, onUnmounted, ref } from 'vue';
+
+const searchInput = ref<HTMLInputElement | null>(null);
+
+const emit = defineEmits(['input']);
+
+const handleKeyPress = (event: KeyboardEvent) => {
+  if ((event.ctrlKey || event.metaKey) && event.key.toLowerCase() === 'k') {
+    event.preventDefault();
+    if (searchInput.value) {
+      searchInput.value.focus(); 
+    }
+  }
+};
+
+
+onMounted(() => {
+    document.addEventListener('keydown', handleKeyPress);
+})
+
+onUnmounted(() => {
+  document.removeEventListener('keydown', handleKeyPress);
+});
+
+</script>

package/src/components/search/index.ts

@@ -0,0 +1 @@
+export { default as SearchBar } from './SearchBar.vue';

package/src/components/table/Table.vue

@@ -1,18 +1,37 @@
 <template>
     <table ref="table" :class="tableClasses">
-        
+        <thead>
+            <tr>
+                <th v-for="column in props.columns" v-bind:key="column.title">
+                    {{ column.title }}
+                </th>
+            </tr>
+        </thead>
+        <tbody>
+            <tr v-for="row in filteredDataSource" v-bind:key="String(row)">
+                <td v-for="column in props.columns" v-bind:key="column.title" v-html="column.render ? column.render(getValue(row, column.data), row as T) : getValue(row, column.data) ">                    
+                </td>
+            </tr>
+        </tbody>
     </table>
 </template>
 
-<script setup lang="ts">
-import { ref } from 'vue';
+<script setup lang="ts" generic="T">
+import { computed, ref, watch } from 'vue';
 import { TableProps } from './interface';
 import classNames from 'classnames';
 import { Size, SizeUtils } from '@/types';
+import createFuzzySearch from '@nozbe/microfuzz'
+
+const originalDataSource = ref<T[]>([]);
+const filteredDataSource = ref<T[]>([]);
+const fuzzyDataSource = computed(() => {
+    return createFuzzySearch(originalDataSource.value);
+});
 
 const table = ref<HTMLTableElement | null>(null)
 
-const props = withDefaults(defineProps<TableProps>(), {
+const props = withDefaults(defineProps<TableProps<T>>(), {
     size: Size.MD,
     zebra: false,
     pinRows: false,
@@ -24,4 +43,22 @@ const tableClasses = ref(classNames('table', `table-${SizeUtils.toClassName(prop
     'table-pin-rows': props.pinRows,
     'table-pin-cols	': props.pinCols,
 }));
+
+//I'll figure pagination later
+const getValue = (obj: any, keyPath: string): string => {
+    if (!obj || typeof obj !== 'object') return String(obj);
+    return String(
+        keyPath.split('.').reduce<unknown>((acc, key) => acc && (typeof acc === 'object' ? (acc as Record<string, any>)[key] : acc), obj)
+    );
+};
+
+watch(() => props.searchValue, (value) => {
+    if (props.searchFunction) {
+        filteredDataSource.value = props.searchFunction(value ?? "");
+        return;
+    }
+
+    filteredDataSource.value = value ? fuzzyDataSource.value(value) as T[] : originalDataSource.value;
+});
+
 </script>

package/src/components/table/index.ts

@@ -1,2 +1,2 @@
 export { default as Table } from './Table.vue';
-export type { TableProps } from './interface';
+export * from './interface';

package/src/components/table/interface.ts

@@ -1,19 +1,22 @@
 import { Size } from "@/types";
+import { Component, VNode } from "vue";
 
-export type TableProps = {
+export type TableProps<T> = {
     zebra?: boolean;
     pinRows?: boolean;
     pinCols?: boolean;
-    size: Size
-    columns: Column[];
-    dataSource: Record<string, unknown>[];
-    ajax?: (params: object) => Promise<object>;
+    size?: Size
+    columns: Column<T>[];
+    dataSource: T[];
+    ajax?: (params: object) => Promise<object> | string;
+    searchValue?: string;
+    searchFunction?: (searchValue: string) => T[];
 }
 
-export type Column = {
+export type Column<T> = {
     title: string;
     data: string;
-    render?: (text: string, record?: Record<string, unknown>) => string;
+    render?: (text: string, row: T) => string | Component | VNode;
     extraClasses?: ExtraClasses;
 }
 

package/src/components.ts

@@ -3,4 +3,5 @@ export * from './components/card';
 export * from './components/container';
 export * from './components/table';
 export * from './components/stepper';
-export * from './components/modal';
+export * from './components/modal';
+export * from './components/search';