@phila/phila-ui-filter-panel 0.1.0-beta.2 → 1.0.0-beta.4

package/dist/FilterPanel.vue.d.ts

@@ -11,6 +11,7 @@ declare const _default: import('vue').DefineComponent<FilterPanelProps, {}, {},
     title: string;
     searchable: boolean;
     searchPlaceholder: string;
+    showActions: boolean;
     applyText: string;
     resetText: string;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;

package/dist/FilterPanel.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FilterPanel.vue.d.ts","sourceRoot":"","sources":["../src/FilterPanel.vue"],"names":[],"mappings":"AAkKA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;;;;;;;;;;;;;;;AAyQhD,wBASG"}
+{"version":3,"file":"FilterPanel.vue.d.ts","sourceRoot":"","sources":["../src/FilterPanel.vue"],"names":[],"mappings":"AAgMA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;;;;;;;;;;;;;;;;AAgShD,wBASG"}

package/dist/FilterPanelSection.vue.d.ts

@@ -2,14 +2,14 @@ import { FilterDefinition } from '@phila/phila-ui-core';
 type __VLS_Props = {
     filter: FilterDefinition;
     collapsed: boolean;
-    modelValue: string | string[] | boolean | undefined;
+    modelValue: boolean | Record<string, boolean> | undefined;
 };
 declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
     toggle: () => any;
-    "update:modelValue": (value: string | string[]) => any;
+    "update:modelValue": (value: Record<string, boolean>) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
     onToggle?: (() => any) | undefined;
-    "onUpdate:modelValue"?: ((value: string | string[]) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: Record<string, boolean>) => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLElement>;
 export default _default;
 //# sourceMappingURL=FilterPanelSection.vue.d.ts.map

package/dist/FilterPanelSection.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FilterPanelSection.vue.d.ts","sourceRoot":"","sources":["../src/FilterPanelSection.vue"],"names":[],"mappings":"AA8FA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAE7D,KAAK,WAAW,GAAG;IACjB,MAAM,EAAE,gBAAgB,CAAC;IACzB,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,OAAO,GAAG,SAAS,CAAC;CACrD,CAAC;;;;;;;;AAkJF,wBAQG"}
+{"version":3,"file":"FilterPanelSection.vue.d.ts","sourceRoot":"","sources":["../src/FilterPanelSection.vue"],"names":[],"mappings":"AA8FA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAE7D,KAAK,WAAW,GAAG;IACjB,MAAM,EAAE,gBAAgB,CAAC;IACzB,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,OAAO,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,SAAS,CAAC;CAC3D,CAAC;;;;;;;;AAiJF,wBAQG"}

package/dist/index.css

@@ -1 +1 @@
-.phila-filter-panel__section[data-v-4a425956]{border-bottom:1px solid var(--Schemes-Border, #ccc);padding:.75rem 0}.phila-filter-panel__section-toggle[data-v-4a425956]{display:flex;width:100%;align-items:center;justify-content:space-between;background:none;border:none;cursor:pointer;font-size:inherit;font-weight:700}.phila-filter-panel__section-toggle .is-collapsed[data-v-4a425956]{transform:rotate(-90deg)}.phila-filter-panel__section-body[data-v-4a425956]{padding-top:.75rem}.phila-filter-panel__section-body[data-v-4a425956] .labels-container{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.phila-filter-panel[data-v-c37adf1c]{display:flex;flex-direction:column;gap:1rem;padding:1.5rem;height:100%;background:#fff;overflow-y:auto;box-sizing:border-box}.phila-filter-panel__header[data-v-c37adf1c]{display:flex;align-items:center;justify-content:space-between}.phila-filter-panel__title[data-v-c37adf1c]{margin:0;font-size:1.25rem;font-weight:700}.phila-filter-panel__close[data-v-c37adf1c]{background:none;border:none;cursor:pointer;font-size:1.25rem;line-height:1}.phila-filter-panel__sections[data-v-c37adf1c]{display:flex;flex-direction:column}.phila-filter-panel__footer[data-v-c37adf1c]{display:flex;gap:.75rem;margin-top:auto}.phila-filter-panel__footer[data-v-c37adf1c]>*{flex:1}
+.phila-filter-panel__section[data-v-54c0ee8c]{border-bottom:1px solid var(--Schemes-Border, #ccc);padding:.75rem 0}.phila-filter-panel__section-toggle[data-v-54c0ee8c]{display:flex;width:100%;align-items:center;justify-content:space-between;background:none;border:none;cursor:pointer;font-size:inherit;font-weight:700}.phila-filter-panel__section-toggle .is-collapsed[data-v-54c0ee8c]{transform:rotate(-90deg)}.phila-filter-panel__section-body[data-v-54c0ee8c]{padding-top:.75rem}.phila-filter-panel__section-body[data-v-54c0ee8c] .labels-container{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.phila-filter-panel[data-v-ed0fc96d]{display:flex;flex-direction:column;height:100%;background:#fff;overflow:hidden;box-sizing:border-box}.phila-filter-panel__header[data-v-ed0fc96d]{display:flex;align-items:center;justify-content:space-between;flex-shrink:0;padding:1.5rem 1.5rem .75rem}.phila-filter-panel__body[data-v-ed0fc96d]{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:1rem;padding:0 1.5rem 1.5rem}.phila-filter-panel__title[data-v-ed0fc96d]{margin:0;font-size:1.25rem;font-weight:700}.phila-filter-panel__close[data-v-ed0fc96d]{background:none;border:none;cursor:pointer;font-size:1.25rem;line-height:1}.phila-filter-panel__sections[data-v-ed0fc96d]{display:flex;flex-direction:column}.phila-filter-panel__footer[data-v-ed0fc96d]{display:flex;gap:.75rem;flex-shrink:0;padding:.75rem 1.5rem 1.5rem;border-top:1px solid var(--Schemes-Border, #e5e7eb)}.phila-filter-panel__footer[data-v-ed0fc96d]>*{flex:1}

package/dist/index.d.ts

@@ -3,7 +3,7 @@ export { default as FilterPanel } from './FilterPanel.vue';
 export interface FilterPanelProps extends BaseProps {
     /** Filters to render. Only filters with a non-empty `choices` array become sections. */
     filters: FilterDefinition[];
-    /** Committed/applied values (v-model). The panel edits a draft and emits this on Apply. */
+    /** Selected values (v-model). Each filter is a full map of choice value → selected. */
     modelValue?: FilterValues;
     /** Header title. */
     title?: string;
@@ -11,6 +11,8 @@ export interface FilterPanelProps extends BaseProps {
     searchable?: boolean;
     /** Placeholder for the search box. */
     searchPlaceholder?: string;
+    /** Show Reset/Apply buttons (draft + commit on Apply). Default false = live apply. */
+    showActions?: boolean;
     /** Apply button label (an active-selection count is appended as " (N)"). */
     applyText?: string;
     /** Reset button label. */

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAEtF,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAE3D,MAAM,WAAW,gBAAiB,SAAQ,SAAS;IACjD,wFAAwF;IACxF,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,2FAA2F;IAC3F,UAAU,CAAC,EAAE,YAAY,CAAC;IAC1B,oBAAoB;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+EAA+E;IAC/E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,sCAAsC;IACtC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,4EAA4E;IAC5E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0BAA0B;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAEtF,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAE3D,MAAM,WAAW,gBAAiB,SAAQ,SAAS;IACjD,wFAAwF;IACxF,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,uFAAuF;IACvF,UAAU,CAAC,EAAE,YAAY,CAAC;IAC1B,oBAAoB;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+EAA+E;IAC/E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,sCAAsC;IACtC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,sFAAsF;IACtF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,4EAA4E;IAC5E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0BAA0B;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB"}

package/dist/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./index.css');const e=require("vue"),v=require("@phila/phila-ui-core"),x=require("@phila/phila-ui-search"),y=require("@phila/phila-ui-button"),V=require("@phila/phila-ui-core/icons"),_=require("@phila/phila-ui-checkbox"),N=require("@phila/phila-ui-radio"),S={class:"phila-filter-panel__section"},A={class:"phila-filter-panel__section-body"},E=e.defineComponent({__name:"FilterPanelSection",props:{filter:{},collapsed:{type:Boolean},modelValue:{type:[String,Array,Boolean]}},emits:["toggle","update:modelValue"],setup(o,{emit:p}){const n=o,i=p,r=e.computed(()=>n.filter.choices??[]),m=e.computed(()=>Array.isArray(n.modelValue)?n.modelValue:[]),s=e.computed(()=>typeof n.modelValue=="string"?n.modelValue:"");return(f,c)=>(e.openBlock(),e.createElementBlock("section",S,[e.createElementVNode("button",{type:"button",class:"phila-filter-panel__section-toggle",onClick:c[0]||(c[0]=u=>i("toggle"))},[e.createElementVNode("span",null,e.toDisplayString(o.filter.label),1),e.createVNode(e.unref(v.Icon),{icon:e.unref(V.IconChevronDown),size:"xxsmall",inline:"",decorative:"",class:e.normalizeClass({"is-collapsed":o.collapsed})},null,8,["icon","class"])]),e.withDirectives(e.createElementVNode("div",A,[o.filter.multiple?(e.openBlock(),e.createBlock(e.unref(_.CheckboxGroup),{key:0,"group-label":o.filter.label,choices:r.value,"model-value":m.value,"onUpdate:modelValue":c[1]||(c[1]=u=>i("update:modelValue",u))},null,8,["group-label","choices","model-value"])):(e.openBlock(),e.createBlock(e.unref(N.RadioGroup),{key:1,"group-label":o.filter.label,choices:r.value,"model-value":s.value,"onUpdate:modelValue":c[2]||(c[2]=u=>i("update:modelValue",u))},null,8,["group-label","choices","model-value"]))],512),[[e.vShow,!o.collapsed]])]))}}),k=(o,p)=>{const n=o.__vccOpts||o;for(const[i,r]of p)n[i]=r;return n},P=k(E,[["__scopeId","data-v-4a425956"]]),U={class:"phila-filter-panel__header"},T={class:"phila-filter-panel__title"},q={class:"phila-filter-panel__sections"},w={class:"phila-filter-panel__footer"},F=e.defineComponent({__name:"FilterPanel",props:{filters:{},modelValue:{default:()=>({})},title:{default:"All Filters"},searchable:{type:Boolean,default:!0},searchPlaceholder:{default:"Search"},applyText:{default:"Apply"},resetText:{default:"Reset"},className:{}},emits:["update:modelValue","close"],setup(o,{emit:p}){const n=o,i=p,r=e.ref({}),m=e.ref(""),s=e.ref({});function f(l){const a={};for(const t of Object.keys(l)){const d=l[t];a[t]=Array.isArray(d)?[...d]:d}return a}e.onMounted(()=>{r.value=f(n.modelValue)});const c=e.computed(()=>n.filters.filter(l=>Array.isArray(l.choices)&&l.choices.length>0)),u=e.computed(()=>{const l=m.value.trim().toLowerCase();return l?c.value.filter(a=>a.label.toLowerCase().includes(l)||(a.choices??[]).some(t=>t.text.toLowerCase().includes(l))):c.value}),h=e.computed(()=>c.value.reduce((l,a)=>{if(a.excludeFromCount)return l;const t=r.value[a.key];return l+(Array.isArray(t)?t.length:t?1:0)},0));function g(l,a){r.value={...r.value,[l]:a}}function b(l){s.value={...s.value,[l]:!s.value[l]}}function C(){r.value={}}function B(){i("update:modelValue",f(r.value)),i("close")}return(l,a)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(v.cn)("phila-filter-panel",n.className))},[e.createElementVNode("header",U,[e.createElementVNode("h2",T,e.toDisplayString(o.title),1),e.createElementVNode("button",{type:"button",class:"phila-filter-panel__close","aria-label":"Close filters",onClick:a[0]||(a[0]=t=>i("close"))},[e.createVNode(e.unref(v.Icon),{icon:e.unref(V.IconClose),size:"small",inline:"",decorative:""},null,8,["icon"])])]),o.searchable?(e.openBlock(),e.createBlock(e.unref(x.Search),{key:0,modelValue:m.value,"onUpdate:modelValue":a[1]||(a[1]=t=>m.value=t),placeholder:o.searchPlaceholder},null,8,["modelValue","placeholder"])):e.createCommentVNode("",!0),e.createElementVNode("div",q,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(u.value,t=>(e.openBlock(),e.createBlock(P,{key:t.key,filter:t,collapsed:!!s.value[t.key],"model-value":r.value[t.key],onToggle:d=>b(t.key),"onUpdate:modelValue":d=>g(t.key,d)},null,8,["filter","collapsed","model-value","onToggle","onUpdate:modelValue"]))),128))]),e.createElementVNode("footer",w,[e.createVNode(e.unref(y.PhilaButton),{variant:"secondary",onClick:C},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(o.resetText),1)]),_:1}),e.createVNode(e.unref(y.PhilaButton),{variant:"primary",onClick:B},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(o.applyText)+e.toDisplayString(h.value?` (${h.value})`:""),1)]),_:1})])],2))}}),D=k(F,[["__scopeId","data-v-c37adf1c"]]);exports.FilterPanel=D;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./index.css');const e=require("vue"),h=require("@phila/phila-ui-core"),S=require("@phila/phila-ui-search"),V=require("@phila/phila-ui-button"),k=require("@phila/phila-ui-core/icons"),w=require("@phila/phila-ui-checkbox"),E=require("@phila/phila-ui-radio"),A={class:"phila-filter-panel__section"},P={class:"phila-filter-panel__section-body"},U=e.defineComponent({__name:"FilterPanelSection",props:{filter:{},collapsed:{type:Boolean},modelValue:{type:[Boolean,Object]}},emits:["toggle","update:modelValue"],setup(o,{emit:p}){const n=o,c=p,r=e.computed(()=>n.filter.choices??[]),d=e.computed(()=>n.modelValue&&typeof n.modelValue=="object"?n.modelValue:{});return(m,i)=>(e.openBlock(),e.createElementBlock("section",A,[e.createElementVNode("button",{type:"button",class:"phila-filter-panel__section-toggle",onClick:i[0]||(i[0]=s=>c("toggle"))},[e.createElementVNode("span",null,e.toDisplayString(o.filter.label),1),e.createVNode(e.unref(h.Icon),{icon:e.unref(k.IconChevronDown),size:"xxsmall",inline:"",decorative:"",class:e.normalizeClass({"is-collapsed":o.collapsed})},null,8,["icon","class"])]),e.withDirectives(e.createElementVNode("div",P,[o.filter.multiple?(e.openBlock(),e.createBlock(e.unref(w.CheckboxGroup),{key:0,"group-label":o.filter.label,choices:r.value,"model-value":d.value,"onUpdate:modelValue":i[1]||(i[1]=s=>c("update:modelValue",s))},null,8,["group-label","choices","model-value"])):(e.openBlock(),e.createBlock(e.unref(E.RadioGroup),{key:1,"group-label":o.filter.label,choices:r.value,"model-value":d.value,"onUpdate:modelValue":i[2]||(i[2]=s=>c("update:modelValue",s))},null,8,["group-label","choices","model-value"]))],512),[[e.vShow,!o.collapsed]])]))}}),g=(o,p)=>{const n=o.__vccOpts||o;for(const[c,r]of p)n[c]=r;return n},T=g(U,[["__scopeId","data-v-54c0ee8c"]]),q={class:"phila-filter-panel__header"},D={class:"phila-filter-panel__title"},F={class:"phila-filter-panel__body"},$={class:"phila-filter-panel__sections"},j={key:0,class:"phila-filter-panel__footer"},I=e.defineComponent({__name:"FilterPanel",props:{filters:{},modelValue:{default:()=>({})},title:{default:"All Filters"},searchable:{type:Boolean,default:!0},searchPlaceholder:{default:"Search"},showActions:{type:Boolean,default:!1},applyText:{default:"Apply"},resetText:{default:"Reset"},className:{}},emits:["update:modelValue","close"],setup(o,{emit:p}){const n=o,c=p,r=e.ref({}),d=e.ref(""),m=e.ref({});function i(t){const a={};for(const l of n.filters){const u=t[l.key];if(Array.isArray(l.choices)&&l.choices.length>0){const N=u&&typeof u=="object"?u:{};a[l.key]=Object.fromEntries(l.choices.map(y=>[y.value,!!N[y.value]]))}else a[l.key]=u===!0}return a}const s=e.computed(()=>n.showActions?r.value:n.modelValue);e.onMounted(()=>{const t=i(n.modelValue);r.value=t,c("update:modelValue",t)});const v=e.computed(()=>n.filters.filter(t=>Array.isArray(t.choices)&&t.choices.length>0)),b=e.computed(()=>{const t=d.value.trim().toLowerCase();return t?v.value.filter(a=>a.label.toLowerCase().includes(t)||(a.choices??[]).some(l=>l.text.toLowerCase().includes(t))):v.value}),f=e.computed(()=>v.value.reduce((t,a)=>{if(a.excludeFromCount)return t;const l=s.value[a.key];return t+(l&&typeof l=="object"?Object.values(l).filter(Boolean).length:l?1:0)},0));function B(t,a){const l=i({...s.value,[t]:a});n.showActions?r.value=l:c("update:modelValue",l)}function C(t){m.value={...m.value,[t]:!m.value[t]}}function _(){r.value=i({})}function x(){c("update:modelValue",i(r.value)),c("close")}return(t,a)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(h.cn)("phila-filter-panel",n.className))},[e.createElementVNode("header",q,[e.createElementVNode("h2",D,e.toDisplayString(o.title)+e.toDisplayString(f.value?` (${f.value})`:""),1),e.createElementVNode("button",{type:"button",class:"phila-filter-panel__close","aria-label":"Close filters",onClick:a[0]||(a[0]=l=>c("close"))},[e.createVNode(e.unref(h.Icon),{icon:e.unref(k.IconClose),size:"small",inline:"",decorative:""},null,8,["icon"])])]),e.createElementVNode("div",F,[o.searchable?(e.openBlock(),e.createBlock(e.unref(S.Search),{key:0,modelValue:d.value,"onUpdate:modelValue":a[1]||(a[1]=l=>d.value=l),placeholder:o.searchPlaceholder},null,8,["modelValue","placeholder"])):e.createCommentVNode("",!0),e.createElementVNode("div",$,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(b.value,l=>(e.openBlock(),e.createBlock(T,{key:l.key,filter:l,collapsed:!!m.value[l.key],"model-value":s.value[l.key],onToggle:u=>C(l.key),"onUpdate:modelValue":u=>B(l.key,u)},null,8,["filter","collapsed","model-value","onToggle","onUpdate:modelValue"]))),128))])]),o.showActions?(e.openBlock(),e.createElementBlock("footer",j,[e.createVNode(e.unref(V.PhilaButton),{variant:"secondary",onClick:_},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(o.resetText),1)]),_:1}),e.createVNode(e.unref(V.PhilaButton),{variant:"primary",onClick:x},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(o.applyText)+e.toDisplayString(f.value?` (${f.value})`:""),1)]),_:1})])):e.createCommentVNode("",!0)],2))}}),z=g(I,[["__scopeId","data-v-ed0fc96d"]]);exports.FilterPanel=z;

package/dist/index.mjs

@@ -1,60 +1,65 @@
-import { defineComponent as w, computed as f, createElementBlock as _, openBlock as u, createElementVNode as c, withDirectives as U, createVNode as V, toDisplayString as y, unref as i, normalizeClass as B, createBlock as g, vShow as L, ref as b, onMounted as z, createCommentVNode as D, Fragment as E, renderList as G, withCtx as x, createTextVNode as A } from "vue";
-import { Icon as F, cn as O } from "@phila/phila-ui-core";
-import { Search as R } from "@phila/phila-ui-search";
+import { defineComponent as $, computed as v, createElementBlock as b, openBlock as u, createElementVNode as d, withDirectives as O, createVNode as g, toDisplayString as f, unref as c, normalizeClass as F, createBlock as k, vShow as D, ref as C, onMounted as E, createCommentVNode as w, Fragment as G, renderList as R, withCtx as A, createTextVNode as B } from "vue";
+import { Icon as P, cn as q } from "@phila/phila-ui-core";
+import { Search as M } from "@phila/phila-ui-search";
 import { PhilaButton as S } from "@phila/phila-ui-button";
-import { IconChevronDown as j, IconClose as q } from "@phila/phila-ui-core/icons";
-import { CheckboxGroup as M } from "@phila/phila-ui-checkbox";
-import { RadioGroup as H } from "@phila/phila-ui-radio";
-import './index.css';const J = { class: "phila-filter-panel__section" }, K = { class: "phila-filter-panel__section-body" }, Q = /* @__PURE__ */ w({
+import { IconChevronDown as H, IconClose as J } from "@phila/phila-ui-core/icons";
+import { CheckboxGroup as K } from "@phila/phila-ui-checkbox";
+import { RadioGroup as Q } from "@phila/phila-ui-radio";
+import './index.css';const W = { class: "phila-filter-panel__section" }, X = { class: "phila-filter-panel__section-body" }, Y = /* @__PURE__ */ $({
   __name: "FilterPanelSection",
   props: {
     filter: {},
     collapsed: { type: Boolean },
-    modelValue: { type: [String, Array, Boolean] }
+    modelValue: { type: [Boolean, Object] }
   },
   emits: ["toggle", "update:modelValue"],
-  setup(t, { emit: v }) {
-    const a = t, s = v, n = f(() => a.filter.choices ?? []), h = f(() => Array.isArray(a.modelValue) ? a.modelValue : []), d = f(() => typeof a.modelValue == "string" ? a.modelValue : "");
-    return (k, r) => (u(), _("section", J, [
-      c("button", {
+  setup(t, { emit: h }) {
+    const a = t, n = h, i = v(() => a.filter.choices ?? []), p = v(
+      () => a.modelValue && typeof a.modelValue == "object" ? a.modelValue : {}
+    );
+    return (y, s) => (u(), b("section", W, [
+      d("button", {
         type: "button",
         class: "phila-filter-panel__section-toggle",
-        onClick: r[0] || (r[0] = (m) => s("toggle"))
+        onClick: s[0] || (s[0] = (r) => n("toggle"))
       }, [
-        c("span", null, y(t.filter.label), 1),
-        V(i(F), {
-          icon: i(j),
+        d("span", null, f(t.filter.label), 1),
+        g(c(P), {
+          icon: c(H),
           size: "xxsmall",
           inline: "",
           decorative: "",
-          class: B({ "is-collapsed": t.collapsed })
+          class: F({ "is-collapsed": t.collapsed })
         }, null, 8, ["icon", "class"])
       ]),
-      U(c("div", K, [
-        t.filter.multiple ? (u(), g(i(M), {
+      O(d("div", X, [
+        t.filter.multiple ? (u(), k(c(K), {
           key: 0,
           "group-label": t.filter.label,
-          choices: n.value,
-          "model-value": h.value,
-          "onUpdate:modelValue": r[1] || (r[1] = (m) => s("update:modelValue", m))
-        }, null, 8, ["group-label", "choices", "model-value"])) : (u(), g(i(H), {
+          choices: i.value,
+          "model-value": p.value,
+          "onUpdate:modelValue": s[1] || (s[1] = (r) => n("update:modelValue", r))
+        }, null, 8, ["group-label", "choices", "model-value"])) : (u(), k(c(Q), {
           key: 1,
           "group-label": t.filter.label,
-          choices: n.value,
-          "model-value": d.value,
-          "onUpdate:modelValue": r[2] || (r[2] = (m) => s("update:modelValue", m))
+          choices: i.value,
+          "model-value": p.value,
+          "onUpdate:modelValue": s[2] || (s[2] = (r) => n("update:modelValue", r))
         }, null, 8, ["group-label", "choices", "model-value"]))
       ], 512), [
-        [L, !t.collapsed]
+        [D, !t.collapsed]
       ])
     ]));
   }
-}), P = (t, v) => {
+}), T = (t, h) => {
   const a = t.__vccOpts || t;
-  for (const [s, n] of v)
-    a[s] = n;
+  for (const [n, i] of h)
+    a[n] = i;
   return a;
-}, W = /* @__PURE__ */ P(Q, [["__scopeId", "data-v-4a425956"]]), X = { class: "phila-filter-panel__header" }, Y = { class: "phila-filter-panel__title" }, Z = { class: "phila-filter-panel__sections" }, ee = { class: "phila-filter-panel__footer" }, le = /* @__PURE__ */ w({
+}, Z = /* @__PURE__ */ T(Y, [["__scopeId", "data-v-54c0ee8c"]]), ee = { class: "phila-filter-panel__header" }, le = { class: "phila-filter-panel__title" }, te = { class: "phila-filter-panel__body" }, oe = { class: "phila-filter-panel__sections" }, ae = {
+  key: 0,
+  class: "phila-filter-panel__footer"
+}, ne = /* @__PURE__ */ $({
   __name: "FilterPanel",
   props: {
     filters: {},
@@ -62,106 +67,116 @@ import './index.css';const J = { class: "phila-filter-panel__section" }, K = { c
     title: { default: "All Filters" },
     searchable: { type: Boolean, default: !0 },
     searchPlaceholder: { default: "Search" },
+    showActions: { type: Boolean, default: !1 },
     applyText: { default: "Apply" },
     resetText: { default: "Reset" },
     className: {}
   },
   emits: ["update:modelValue", "close"],
-  setup(t, { emit: v }) {
-    const a = t, s = v, n = b({}), h = b(""), d = b({});
-    function k(e) {
+  setup(t, { emit: h }) {
+    const a = t, n = h, i = C({}), p = C(""), y = C({});
+    function s(l) {
       const o = {};
-      for (const l of Object.keys(e)) {
-        const p = e[l];
-        o[l] = Array.isArray(p) ? [...p] : p;
+      for (const e of a.filters) {
+        const m = l[e.key];
+        if (Array.isArray(e.choices) && e.choices.length > 0) {
+          const L = m && typeof m == "object" ? m : {};
+          o[e.key] = Object.fromEntries(e.choices.map((x) => [x.value, !!L[x.value]]));
+        } else
+          o[e.key] = m === !0;
       }
       return o;
     }
-    z(() => {
-      n.value = k(a.modelValue);
+    const r = v(() => a.showActions ? i.value : a.modelValue);
+    E(() => {
+      const l = s(a.modelValue);
+      i.value = l, n("update:modelValue", l);
     });
-    const r = f(() => a.filters.filter((e) => Array.isArray(e.choices) && e.choices.length > 0)), m = f(() => {
-      const e = h.value.trim().toLowerCase();
-      return e ? r.value.filter(
-        (o) => o.label.toLowerCase().includes(e) || (o.choices ?? []).some((l) => l.text.toLowerCase().includes(e))
-      ) : r.value;
-    }), C = f(
-      () => r.value.reduce((e, o) => {
-        if (o.excludeFromCount) return e;
-        const l = n.value[o.key];
-        return e + (Array.isArray(l) ? l.length : l ? 1 : 0);
+    const _ = v(() => a.filters.filter((l) => Array.isArray(l.choices) && l.choices.length > 0)), j = v(() => {
+      const l = p.value.trim().toLowerCase();
+      return l ? _.value.filter(
+        (o) => o.label.toLowerCase().includes(l) || (o.choices ?? []).some((e) => e.text.toLowerCase().includes(l))
+      ) : _.value;
+    }), V = v(
+      () => _.value.reduce((l, o) => {
+        if (o.excludeFromCount) return l;
+        const e = r.value[o.key];
+        return l + (e && typeof e == "object" ? Object.values(e).filter(Boolean).length : e ? 1 : 0);
       }, 0)
     );
-    function T(e, o) {
-      n.value = { ...n.value, [e]: o };
+    function N(l, o) {
+      const e = s({ ...r.value, [l]: o });
+      a.showActions ? i.value = e : n("update:modelValue", e);
     }
-    function $(e) {
-      d.value = { ...d.value, [e]: !d.value[e] };
+    function I(l) {
+      y.value = { ...y.value, [l]: !y.value[l] };
     }
-    function N() {
-      n.value = {};
+    function U() {
+      i.value = s({});
     }
-    function I() {
-      s("update:modelValue", k(n.value)), s("close");
+    function z() {
+      n("update:modelValue", s(i.value)), n("close");
     }
-    return (e, o) => (u(), _("div", {
-      class: B(i(O)("phila-filter-panel", a.className))
+    return (l, o) => (u(), b("div", {
+      class: F(c(q)("phila-filter-panel", a.className))
     }, [
-      c("header", X, [
-        c("h2", Y, y(t.title), 1),
-        c("button", {
+      d("header", ee, [
+        d("h2", le, f(t.title) + f(V.value ? ` (${V.value})` : ""), 1),
+        d("button", {
           type: "button",
           class: "phila-filter-panel__close",
           "aria-label": "Close filters",
-          onClick: o[0] || (o[0] = (l) => s("close"))
+          onClick: o[0] || (o[0] = (e) => n("close"))
         }, [
-          V(i(F), {
-            icon: i(q),
+          g(c(P), {
+            icon: c(J),
             size: "small",
             inline: "",
             decorative: ""
           }, null, 8, ["icon"])
         ])
       ]),
-      t.searchable ? (u(), g(i(R), {
-        key: 0,
-        modelValue: h.value,
-        "onUpdate:modelValue": o[1] || (o[1] = (l) => h.value = l),
-        placeholder: t.searchPlaceholder
-      }, null, 8, ["modelValue", "placeholder"])) : D("", !0),
-      c("div", Z, [
-        (u(!0), _(E, null, G(m.value, (l) => (u(), g(W, {
-          key: l.key,
-          filter: l,
-          collapsed: !!d.value[l.key],
-          "model-value": n.value[l.key],
-          onToggle: (p) => $(l.key),
-          "onUpdate:modelValue": (p) => T(l.key, p)
-        }, null, 8, ["filter", "collapsed", "model-value", "onToggle", "onUpdate:modelValue"]))), 128))
+      d("div", te, [
+        t.searchable ? (u(), k(c(M), {
+          key: 0,
+          modelValue: p.value,
+          "onUpdate:modelValue": o[1] || (o[1] = (e) => p.value = e),
+          placeholder: t.searchPlaceholder
+        }, null, 8, ["modelValue", "placeholder"])) : w("", !0),
+        d("div", oe, [
+          (u(!0), b(G, null, R(j.value, (e) => (u(), k(Z, {
+            key: e.key,
+            filter: e,
+            collapsed: !!y.value[e.key],
+            "model-value": r.value[e.key],
+            onToggle: (m) => I(e.key),
+            "onUpdate:modelValue": (m) => N(e.key, m)
+          }, null, 8, ["filter", "collapsed", "model-value", "onToggle", "onUpdate:modelValue"]))), 128))
+        ])
       ]),
-      c("footer", ee, [
-        V(i(S), {
+      t.showActions ? (u(), b("footer", ae, [
+        g(c(S), {
           variant: "secondary",
-          onClick: N
+          onClick: U
         }, {
-          default: x(() => [
-            A(y(t.resetText), 1)
+          default: A(() => [
+            B(f(t.resetText), 1)
           ]),
           _: 1
         }),
-        V(i(S), {
+        g(c(S), {
           variant: "primary",
-          onClick: I
+          onClick: z
         }, {
-          default: x(() => [
-            A(y(t.applyText) + y(C.value ? ` (${C.value})` : ""), 1)
+          default: A(() => [
+            B(f(t.applyText) + f(V.value ? ` (${V.value})` : ""), 1)
           ]),
           _: 1
         })
-      ])
+      ])) : w("", !0)
     ], 2));
   }
-}), ce = /* @__PURE__ */ P(le, [["__scopeId", "data-v-c37adf1c"]]);
+}), pe = /* @__PURE__ */ T(ne, [["__scopeId", "data-v-ed0fc96d"]]);
 export {
-  ce as FilterPanel
+  pe as FilterPanel
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@phila/phila-ui-filter-panel",
-  "version": "0.1.0-beta.2",
+  "version": "1.0.0-beta.4",
   "type": "module",
   "description": "Filter panel for faceted filtering",
   "main": "./dist/index.js",
@@ -28,11 +28,11 @@
     "vue": "^3.0.0"
   },
   "dependencies": {
-    "@phila/phila-ui-core": "3.0.0-beta.7",
-    "@phila/phila-ui-search": "1.2.0-beta.10",
-    "@phila/phila-ui-radio": "0.1.1-beta.8",
-    "@phila/phila-ui-checkbox": "0.1.1-beta.8",
-    "@phila/phila-ui-button": "2.3.0-beta.8"
+    "@phila/phila-ui-core": "3.0.0-beta.9",
+    "@phila/phila-ui-search": "1.2.0-beta.12",
+    "@phila/phila-ui-radio": "1.0.0-beta.10",
+    "@phila/phila-ui-checkbox": "1.0.0-beta.10",
+    "@phila/phila-ui-button": "2.3.0-beta.10"
   },
   "devDependencies": {
     "@types/node": "^24.0.0",