@phila/phila-ui-filter-panel 1.0.0-beta.5 → 1.0.0-beta.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"FilterPanel.vue.d.ts","sourceRoot":"","sources":["../src/FilterPanel.vue"],"names":[],"mappings":"AA2MA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;;;;;;;;;;;;;;;;;AAiThD,wBASG"}
1
+ {"version":3,"file":"FilterPanel.vue.d.ts","sourceRoot":"","sources":["../src/FilterPanel.vue"],"names":[],"mappings":"AAqOA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;;;;;;;;;;;;;;;;;AA+ThD,wBASG"}
package/dist/index.css CHANGED
@@ -1 +1 @@
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-052723b8]{display:flex;flex-direction:column;height:100%;background:#fff;overflow:hidden;box-sizing:border-box}.phila-filter-panel--full-screen[data-v-052723b8]{position:fixed;inset:0;z-index:10001}.phila-filter-panel__header[data-v-052723b8]{display:flex;align-items:center;justify-content:space-between;flex-shrink:0;padding:1.5rem 1.5rem .75rem}.phila-filter-panel__body[data-v-052723b8]{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-052723b8]{margin:0;font-size:1.25rem;font-weight:700}.phila-filter-panel__close[data-v-052723b8]{background:none;border:none;cursor:pointer;font-size:1.25rem;line-height:1}.phila-filter-panel__sections[data-v-052723b8]{display:flex;flex-direction:column}.phila-filter-panel__footer[data-v-052723b8]{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-052723b8]>*{flex:1}
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-bfb39f78]{display:flex;flex-direction:column;height:100%;background:#fff;overflow:hidden;box-sizing:border-box}.phila-filter-panel--full-screen[data-v-bfb39f78]{position:fixed;inset:0;z-index:10001}.phila-filter-panel__header[data-v-bfb39f78]{display:flex;align-items:center;justify-content:space-between;flex-shrink:0;padding:1.5rem 1.5rem .75rem}.phila-filter-panel__body[data-v-bfb39f78]{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-bfb39f78]{margin:0;font-size:1.25rem;font-weight:700}.phila-filter-panel__close[data-v-bfb39f78]{background:none;border:none;cursor:pointer;font-size:1.25rem;line-height:1}.phila-filter-panel__header-left[data-v-bfb39f78]{display:flex;align-items:center;gap:var(--spacing-s, .75rem)}.phila-filter-panel__reset[data-v-bfb39f78]{background:none;border:none;padding:0;cursor:pointer;color:var(--Schemes-Primary);text-decoration:underline;font-weight:600}.phila-filter-panel__reset[data-v-bfb39f78]:focus-visible{outline:2px solid var(--Schemes-Primary);outline-offset:2px}.phila-filter-panel__sections[data-v-bfb39f78]{display:flex;flex-direction:column}.phila-filter-panel__footer[data-v-bfb39f78]{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-bfb39f78]>*{flex:1}
package/dist/index.js CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./index.css');const e=require("vue"),h=require("@phila/phila-ui-core"),_=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"},T=e.defineComponent({__name:"FilterPanelSection",props:{filter:{},collapsed:{type:Boolean},modelValue:{type:[Boolean,Object]}},emits:["toggle","update:modelValue"],setup(t,{emit:p}){const n=t,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(t.filter.label),1),e.createVNode(e.unref(h.Icon),{icon:e.unref(k.IconChevronDown),size:"xxsmall",inline:"",decorative:"",class:e.normalizeClass({"is-collapsed":t.collapsed})},null,8,["icon","class"])]),e.withDirectives(e.createElementVNode("div",P,[t.filter.multiple?(e.openBlock(),e.createBlock(e.unref(w.CheckboxGroup),{key:0,"group-label":t.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":t.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,!t.collapsed]])]))}}),b=(t,p)=>{const n=t.__vccOpts||t;for(const[c,r]of p)n[c]=r;return n},U=b(T,[["__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"},fullScreen:{type:Boolean,default:!1},className:{}},emits:["update:modelValue","close"],setup(t,{emit:p}){const n=t,c=p,r=e.ref({}),d=e.ref(""),m=e.ref({});function i(o){const a={};for(const l of n.filters){const u=o[l.key];if(Array.isArray(l.choices)&&l.choices.length>0){const x=u&&typeof u=="object"?u:{};a[l.key]=Object.fromEntries(l.choices.map(y=>[y.value,!!x[y.value]]))}else a[l.key]=u===!0}return a}const s=e.computed(()=>n.showActions?r.value:n.modelValue);e.onMounted(()=>{const o=i(n.modelValue);r.value=o,c("update:modelValue",o)});const v=e.computed(()=>n.filters.filter(o=>Array.isArray(o.choices)&&o.choices.length>0)),g=e.computed(()=>{const o=d.value.trim().toLowerCase();return o?v.value.filter(a=>a.label.toLowerCase().includes(o)||(a.choices??[]).some(l=>l.text.toLowerCase().includes(o))):v.value}),f=e.computed(()=>v.value.reduce((o,a)=>{if(a.excludeFromCount)return o;const l=s.value[a.key];return o+(l&&typeof l=="object"?Object.values(l).filter(Boolean).length:l?1:0)},0));function B(o,a){const l=i({...s.value,[o]:a});n.showActions?r.value=l:c("update:modelValue",l)}function C(o){m.value={...m.value,[o]:!m.value[o]}}function N(){r.value=i({})}function S(){c("update:modelValue",i(r.value)),c("close")}return(o,a)=>(e.openBlock(),e.createBlock(e.Teleport,{to:"body",disabled:!t.fullScreen},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(h.cn)("phila-filter-panel",t.fullScreen&&"phila-filter-panel--full-screen",n.className))},[e.createElementVNode("header",q,[e.createElementVNode("h2",D,e.toDisplayString(t.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,[t.searchable?(e.openBlock(),e.createBlock(e.unref(_.Search),{key:0,modelValue:d.value,"onUpdate:modelValue":a[1]||(a[1]=l=>d.value=l),placeholder:t.searchPlaceholder},null,8,["modelValue","placeholder"])):e.createCommentVNode("",!0),e.createElementVNode("div",$,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(g.value,l=>(e.openBlock(),e.createBlock(U,{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))])]),t.showActions?(e.openBlock(),e.createElementBlock("footer",j,[e.createVNode(e.unref(V.PhilaButton),{variant:"secondary",onClick:N},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.resetText),1)]),_:1}),e.createVNode(e.unref(V.PhilaButton),{variant:"primary",onClick:S},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.applyText)+e.toDisplayString(f.value?` (${f.value})`:""),1)]),_:1})])):e.createCommentVNode("",!0)],2)],8,["disabled"]))}}),z=b(I,[["__scopeId","data-v-052723b8"]]);exports.FilterPanel=z;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./index.css');const e=require("vue"),v=require("@phila/phila-ui-core"),_=require("@phila/phila-ui-search"),k=require("@phila/phila-ui-button"),b=require("@phila/phila-ui-core/icons"),E=require("@phila/phila-ui-checkbox"),w=require("@phila/phila-ui-radio"),A={class:"phila-filter-panel__section"},T={class:"phila-filter-panel__section-body"},P=e.defineComponent({__name:"FilterPanelSection",props:{filter:{},collapsed:{type:Boolean},modelValue:{type:[Boolean,Object]}},emits:["toggle","update:modelValue"],setup(o,{emit:p}){const a=o,c=p,r=e.computed(()=>a.filter.choices??[]),d=e.computed(()=>a.modelValue&&typeof a.modelValue=="object"?a.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(v.Icon),{icon:e.unref(b.IconChevronDown),size:"xxsmall",inline:"",decorative:"",class:e.normalizeClass({"is-collapsed":o.collapsed})},null,8,["icon","class"])]),e.withDirectives(e.createElementVNode("div",T,[o.filter.multiple?(e.openBlock(),e.createBlock(e.unref(E.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(w.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 a=o.__vccOpts||o;for(const[c,r]of p)a[c]=r;return a},U=g(P,[["__scopeId","data-v-54c0ee8c"]]),D={class:"phila-filter-panel__header"},q={class:"phila-filter-panel__header-left"},F={class:"phila-filter-panel__title"},$={class:"phila-filter-panel__body"},j={class:"phila-filter-panel__sections"},I={key:0,class:"phila-filter-panel__footer"},z=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"},fullScreen:{type:Boolean,default:!1},className:{}},emits:["update:modelValue","close"],setup(o,{emit:p}){const a=o,c=p,r=e.ref({}),d=e.ref(""),m=e.ref({});function i(t){const n={};for(const l of a.filters){const u=t[l.key];if(Array.isArray(l.choices)&&l.choices.length>0){const S=u&&typeof u=="object"?u:{};n[l.key]=Object.fromEntries(l.choices.map(V=>[V.value,!!S[V.value]]))}else n[l.key]=u===!0}return n}const s=e.computed(()=>a.showActions?r.value:a.modelValue);e.onMounted(()=>{const t=i(a.modelValue);r.value=t,c("update:modelValue",t)});const h=e.computed(()=>a.filters.filter(t=>Array.isArray(t.choices)&&t.choices.length>0)),B=e.computed(()=>{const t=d.value.trim().toLowerCase();return t?h.value.filter(n=>n.label.toLowerCase().includes(t)||(n.choices??[]).some(l=>l.text.toLowerCase().includes(t))):h.value}),f=e.computed(()=>h.value.reduce((t,n)=>{if(n.excludeFromCount)return t;const l=s.value[n.key];return t+(l&&typeof l=="object"?Object.values(l).filter(Boolean).length:l?1:0)},0));function C(t,n){const l=i({...s.value,[t]:n});a.showActions?r.value=l:c("update:modelValue",l)}function N(t){m.value={...m.value,[t]:!m.value[t]}}function y(){const t=i({});a.showActions?r.value=t:c("update:modelValue",t)}function x(){c("update:modelValue",i(r.value)),c("close")}return(t,n)=>(e.openBlock(),e.createBlock(e.Teleport,{to:"body",disabled:!o.fullScreen},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(v.cn)("phila-filter-panel",o.fullScreen&&"phila-filter-panel--full-screen",a.className))},[e.createElementVNode("header",D,[e.createElementVNode("div",q,[e.createElementVNode("h2",F,e.toDisplayString(o.title)+e.toDisplayString(f.value?` (${f.value})`:""),1),e.createElementVNode("button",{type:"button",class:"phila-filter-panel__reset has-text-body-small",onClick:y},e.toDisplayString(o.resetText),1)]),e.createElementVNode("button",{type:"button",class:"phila-filter-panel__close","aria-label":"Close filters",onClick:n[0]||(n[0]=l=>c("close"))},[e.createVNode(e.unref(v.Icon),{icon:e.unref(b.IconClose),size:"small",inline:"",decorative:""},null,8,["icon"])])]),e.createElementVNode("div",$,[o.searchable?(e.openBlock(),e.createBlock(e.unref(_.Search),{key:0,modelValue:d.value,"onUpdate:modelValue":n[1]||(n[1]=l=>d.value=l),placeholder:o.searchPlaceholder},null,8,["modelValue","placeholder"])):e.createCommentVNode("",!0),e.createElementVNode("div",j,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(B.value,l=>(e.openBlock(),e.createBlock(U,{key:l.key,filter:l,collapsed:!!m.value[l.key],"model-value":s.value[l.key],onToggle:u=>N(l.key),"onUpdate:modelValue":u=>C(l.key,u)},null,8,["filter","collapsed","model-value","onToggle","onUpdate:modelValue"]))),128))])]),o.showActions?(e.openBlock(),e.createElementBlock("footer",I,[e.createVNode(e.unref(k.PhilaButton),{variant:"secondary",onClick:y},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(o.resetText),1)]),_:1}),e.createVNode(e.unref(k.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)],8,["disabled"]))}}),O=g(z,[["__scopeId","data-v-bfb39f78"]]);exports.FilterPanel=O;
package/dist/index.mjs CHANGED
@@ -1,11 +1,11 @@
1
- import { defineComponent as T, computed as v, createElementBlock as x, openBlock as d, createElementVNode as r, withDirectives as O, createVNode as g, toDisplayString as f, unref as c, normalizeClass as $, createBlock as b, vShow as D, ref as C, onMounted as E, Teleport as G, createCommentVNode as w, Fragment as R, renderList as q, withCtx as S, createTextVNode as A } from "vue";
2
- import { Icon as F, cn as M } from "@phila/phila-ui-core";
1
+ import { defineComponent as $, computed as v, createElementBlock as x, openBlock as d, createElementVNode as i, withDirectives as O, createVNode as g, toDisplayString as f, unref as r, normalizeClass as F, createBlock as b, vShow as D, ref as _, onMounted as E, Teleport as G, createCommentVNode as A, Fragment as R, renderList as q, withCtx as S, createTextVNode as B } from "vue";
2
+ import { Icon as P, cn as M } from "@phila/phila-ui-core";
3
3
  import { Search as H } from "@phila/phila-ui-search";
4
- import { PhilaButton as B } from "@phila/phila-ui-button";
4
+ import { PhilaButton as T } from "@phila/phila-ui-button";
5
5
  import { IconChevronDown as J, IconClose as K } from "@phila/phila-ui-core/icons";
6
6
  import { CheckboxGroup as Q } from "@phila/phila-ui-checkbox";
7
7
  import { RadioGroup as W } from "@phila/phila-ui-radio";
8
- import './index.css';const X = { class: "phila-filter-panel__section" }, Y = { class: "phila-filter-panel__section-body" }, Z = /* @__PURE__ */ T({
8
+ import './index.css';const X = { class: "phila-filter-panel__section" }, Y = { class: "phila-filter-panel__section-body" }, Z = /* @__PURE__ */ $({
9
9
  __name: "FilterPanelSection",
10
10
  props: {
11
11
  filter: {},
@@ -13,53 +13,53 @@ import './index.css';const X = { class: "phila-filter-panel__section" }, Y = { c
13
13
  modelValue: { type: [Boolean, Object] }
14
14
  },
15
15
  emits: ["toggle", "update:modelValue"],
16
- setup(l, { emit: h }) {
17
- const a = l, n = h, i = v(() => a.filter.choices ?? []), p = v(
18
- () => a.modelValue && typeof a.modelValue == "object" ? a.modelValue : {}
16
+ setup(t, { emit: h }) {
17
+ const o = t, n = h, c = v(() => o.filter.choices ?? []), m = v(
18
+ () => o.modelValue && typeof o.modelValue == "object" ? o.modelValue : {}
19
19
  );
20
20
  return (y, s) => (d(), x("section", X, [
21
- r("button", {
21
+ i("button", {
22
22
  type: "button",
23
23
  class: "phila-filter-panel__section-toggle",
24
24
  onClick: s[0] || (s[0] = (u) => n("toggle"))
25
25
  }, [
26
- r("span", null, f(l.filter.label), 1),
27
- g(c(F), {
28
- icon: c(J),
26
+ i("span", null, f(t.filter.label), 1),
27
+ g(r(P), {
28
+ icon: r(J),
29
29
  size: "xxsmall",
30
30
  inline: "",
31
31
  decorative: "",
32
- class: $({ "is-collapsed": l.collapsed })
32
+ class: F({ "is-collapsed": t.collapsed })
33
33
  }, null, 8, ["icon", "class"])
34
34
  ]),
35
- O(r("div", Y, [
36
- l.filter.multiple ? (d(), b(c(Q), {
35
+ O(i("div", Y, [
36
+ t.filter.multiple ? (d(), b(r(Q), {
37
37
  key: 0,
38
- "group-label": l.filter.label,
39
- choices: i.value,
40
- "model-value": p.value,
38
+ "group-label": t.filter.label,
39
+ choices: c.value,
40
+ "model-value": m.value,
41
41
  "onUpdate:modelValue": s[1] || (s[1] = (u) => n("update:modelValue", u))
42
- }, null, 8, ["group-label", "choices", "model-value"])) : (d(), b(c(W), {
42
+ }, null, 8, ["group-label", "choices", "model-value"])) : (d(), b(r(W), {
43
43
  key: 1,
44
- "group-label": l.filter.label,
45
- choices: i.value,
46
- "model-value": p.value,
44
+ "group-label": t.filter.label,
45
+ choices: c.value,
46
+ "model-value": m.value,
47
47
  "onUpdate:modelValue": s[2] || (s[2] = (u) => n("update:modelValue", u))
48
48
  }, null, 8, ["group-label", "choices", "model-value"]))
49
49
  ], 512), [
50
- [D, !l.collapsed]
50
+ [D, !t.collapsed]
51
51
  ])
52
52
  ]));
53
53
  }
54
- }), P = (l, h) => {
55
- const a = l.__vccOpts || l;
56
- for (const [n, i] of h)
57
- a[n] = i;
58
- return a;
59
- }, ee = /* @__PURE__ */ P(Z, [["__scopeId", "data-v-54c0ee8c"]]), le = { class: "phila-filter-panel__header" }, te = { class: "phila-filter-panel__title" }, oe = { class: "phila-filter-panel__body" }, ae = { class: "phila-filter-panel__sections" }, ne = {
54
+ }), j = (t, h) => {
55
+ const o = t.__vccOpts || t;
56
+ for (const [n, c] of h)
57
+ o[n] = c;
58
+ return o;
59
+ }, ee = /* @__PURE__ */ j(Z, [["__scopeId", "data-v-54c0ee8c"]]), le = { class: "phila-filter-panel__header" }, te = { class: "phila-filter-panel__header-left" }, oe = { class: "phila-filter-panel__title" }, ae = { class: "phila-filter-panel__body" }, ne = { class: "phila-filter-panel__sections" }, se = {
60
60
  key: 0,
61
61
  class: "phila-filter-panel__footer"
62
- }, se = /* @__PURE__ */ T({
62
+ }, ie = /* @__PURE__ */ $({
63
63
  __name: "FilterPanel",
64
64
  props: {
65
65
  filters: {},
@@ -74,115 +74,123 @@ import './index.css';const X = { class: "phila-filter-panel__section" }, Y = { c
74
74
  className: {}
75
75
  },
76
76
  emits: ["update:modelValue", "close"],
77
- setup(l, { emit: h }) {
78
- const a = l, n = h, i = C({}), p = C(""), y = C({});
79
- function s(t) {
80
- const o = {};
81
- for (const e of a.filters) {
82
- const m = t[e.key];
77
+ setup(t, { emit: h }) {
78
+ const o = t, n = h, c = _({}), m = _(""), y = _({});
79
+ function s(l) {
80
+ const a = {};
81
+ for (const e of o.filters) {
82
+ const p = l[e.key];
83
83
  if (Array.isArray(e.choices) && e.choices.length > 0) {
84
- const L = m && typeof m == "object" ? m : {};
85
- o[e.key] = Object.fromEntries(e.choices.map((_) => [_.value, !!L[_.value]]));
84
+ const L = p && typeof p == "object" ? p : {};
85
+ a[e.key] = Object.fromEntries(e.choices.map((w) => [w.value, !!L[w.value]]));
86
86
  } else
87
- o[e.key] = m === !0;
87
+ a[e.key] = p === !0;
88
88
  }
89
- return o;
89
+ return a;
90
90
  }
91
- const u = v(() => a.showActions ? i.value : a.modelValue);
91
+ const u = v(() => o.showActions ? c.value : o.modelValue);
92
92
  E(() => {
93
- const t = s(a.modelValue);
94
- i.value = t, n("update:modelValue", t);
93
+ const l = s(o.modelValue);
94
+ c.value = l, n("update:modelValue", l);
95
95
  });
96
- const k = v(() => a.filters.filter((t) => Array.isArray(t.choices) && t.choices.length > 0)), j = v(() => {
97
- const t = p.value.trim().toLowerCase();
98
- return t ? k.value.filter(
99
- (o) => o.label.toLowerCase().includes(t) || (o.choices ?? []).some((e) => e.text.toLowerCase().includes(t))
96
+ const k = v(() => o.filters.filter((l) => Array.isArray(l.choices) && l.choices.length > 0)), N = v(() => {
97
+ const l = m.value.trim().toLowerCase();
98
+ return l ? k.value.filter(
99
+ (a) => a.label.toLowerCase().includes(l) || (a.choices ?? []).some((e) => e.text.toLowerCase().includes(l))
100
100
  ) : k.value;
101
101
  }), V = v(
102
- () => k.value.reduce((t, o) => {
103
- if (o.excludeFromCount) return t;
104
- const e = u.value[o.key];
105
- return t + (e && typeof e == "object" ? Object.values(e).filter(Boolean).length : e ? 1 : 0);
102
+ () => k.value.reduce((l, a) => {
103
+ if (a.excludeFromCount) return l;
104
+ const e = u.value[a.key];
105
+ return l + (e && typeof e == "object" ? Object.values(e).filter(Boolean).length : e ? 1 : 0);
106
106
  }, 0)
107
107
  );
108
- function N(t, o) {
109
- const e = s({ ...u.value, [t]: o });
110
- a.showActions ? i.value = e : n("update:modelValue", e);
108
+ function I(l, a) {
109
+ const e = s({ ...u.value, [l]: a });
110
+ o.showActions ? c.value = e : n("update:modelValue", e);
111
111
  }
112
- function I(t) {
113
- y.value = { ...y.value, [t]: !y.value[t] };
112
+ function U(l) {
113
+ y.value = { ...y.value, [l]: !y.value[l] };
114
114
  }
115
- function U() {
116
- i.value = s({});
115
+ function C() {
116
+ const l = s({});
117
+ o.showActions ? c.value = l : n("update:modelValue", l);
117
118
  }
118
119
  function z() {
119
- n("update:modelValue", s(i.value)), n("close");
120
+ n("update:modelValue", s(c.value)), n("close");
120
121
  }
121
- return (t, o) => (d(), b(G, {
122
+ return (l, a) => (d(), b(G, {
122
123
  to: "body",
123
- disabled: !l.fullScreen
124
+ disabled: !t.fullScreen
124
125
  }, [
125
- r("div", {
126
- class: $(c(M)("phila-filter-panel", l.fullScreen && "phila-filter-panel--full-screen", a.className))
126
+ i("div", {
127
+ class: F(r(M)("phila-filter-panel", t.fullScreen && "phila-filter-panel--full-screen", o.className))
127
128
  }, [
128
- r("header", le, [
129
- r("h2", te, f(l.title) + f(V.value ? ` (${V.value})` : ""), 1),
130
- r("button", {
129
+ i("header", le, [
130
+ i("div", te, [
131
+ i("h2", oe, f(t.title) + f(V.value ? ` (${V.value})` : ""), 1),
132
+ i("button", {
133
+ type: "button",
134
+ class: "phila-filter-panel__reset has-text-body-small",
135
+ onClick: C
136
+ }, f(t.resetText), 1)
137
+ ]),
138
+ i("button", {
131
139
  type: "button",
132
140
  class: "phila-filter-panel__close",
133
141
  "aria-label": "Close filters",
134
- onClick: o[0] || (o[0] = (e) => n("close"))
142
+ onClick: a[0] || (a[0] = (e) => n("close"))
135
143
  }, [
136
- g(c(F), {
137
- icon: c(K),
144
+ g(r(P), {
145
+ icon: r(K),
138
146
  size: "small",
139
147
  inline: "",
140
148
  decorative: ""
141
149
  }, null, 8, ["icon"])
142
150
  ])
143
151
  ]),
144
- r("div", oe, [
145
- l.searchable ? (d(), b(c(H), {
152
+ i("div", ae, [
153
+ t.searchable ? (d(), b(r(H), {
146
154
  key: 0,
147
- modelValue: p.value,
148
- "onUpdate:modelValue": o[1] || (o[1] = (e) => p.value = e),
149
- placeholder: l.searchPlaceholder
150
- }, null, 8, ["modelValue", "placeholder"])) : w("", !0),
151
- r("div", ae, [
152
- (d(!0), x(R, null, q(j.value, (e) => (d(), b(ee, {
155
+ modelValue: m.value,
156
+ "onUpdate:modelValue": a[1] || (a[1] = (e) => m.value = e),
157
+ placeholder: t.searchPlaceholder
158
+ }, null, 8, ["modelValue", "placeholder"])) : A("", !0),
159
+ i("div", ne, [
160
+ (d(!0), x(R, null, q(N.value, (e) => (d(), b(ee, {
153
161
  key: e.key,
154
162
  filter: e,
155
163
  collapsed: !!y.value[e.key],
156
164
  "model-value": u.value[e.key],
157
- onToggle: (m) => I(e.key),
158
- "onUpdate:modelValue": (m) => N(e.key, m)
165
+ onToggle: (p) => U(e.key),
166
+ "onUpdate:modelValue": (p) => I(e.key, p)
159
167
  }, null, 8, ["filter", "collapsed", "model-value", "onToggle", "onUpdate:modelValue"]))), 128))
160
168
  ])
161
169
  ]),
162
- l.showActions ? (d(), x("footer", ne, [
163
- g(c(B), {
170
+ t.showActions ? (d(), x("footer", se, [
171
+ g(r(T), {
164
172
  variant: "secondary",
165
- onClick: U
173
+ onClick: C
166
174
  }, {
167
175
  default: S(() => [
168
- A(f(l.resetText), 1)
176
+ B(f(t.resetText), 1)
169
177
  ]),
170
178
  _: 1
171
179
  }),
172
- g(c(B), {
180
+ g(r(T), {
173
181
  variant: "primary",
174
182
  onClick: z
175
183
  }, {
176
184
  default: S(() => [
177
- A(f(l.applyText) + f(V.value ? ` (${V.value})` : ""), 1)
185
+ B(f(t.applyText) + f(V.value ? ` (${V.value})` : ""), 1)
178
186
  ]),
179
187
  _: 1
180
188
  })
181
- ])) : w("", !0)
189
+ ])) : A("", !0)
182
190
  ], 2)
183
191
  ], 8, ["disabled"]));
184
192
  }
185
- }), fe = /* @__PURE__ */ P(se, [["__scopeId", "data-v-052723b8"]]);
193
+ }), ve = /* @__PURE__ */ j(ie, [["__scopeId", "data-v-bfb39f78"]]);
186
194
  export {
187
- fe as FilterPanel
195
+ ve as FilterPanel
188
196
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@phila/phila-ui-filter-panel",
3
- "version": "1.0.0-beta.5",
3
+ "version": "1.0.0-beta.7",
4
4
  "type": "module",
5
5
  "description": "Filter panel for faceted filtering",
6
6
  "main": "./dist/index.js",
@@ -30,8 +30,8 @@
30
30
  "dependencies": {
31
31
  "@phila/phila-ui-core": "3.0.0-beta.9",
32
32
  "@phila/phila-ui-search": "1.2.0-beta.12",
33
- "@phila/phila-ui-radio": "1.0.0-beta.10",
34
- "@phila/phila-ui-checkbox": "1.0.0-beta.10",
33
+ "@phila/phila-ui-radio": "1.0.0-beta.12",
34
+ "@phila/phila-ui-checkbox": "1.0.0-beta.12",
35
35
  "@phila/phila-ui-button": "2.3.0-beta.10"
36
36
  },
37
37
  "devDependencies": {