@lifesg/react-design-system 1.1.1 → 1.1.2

package/filter/index.js

@@ -399,7 +399,7 @@ var t=Object.getOwnPropertySymbols,n=Object.prototype.hasOwnProperty,r=Object.pr
                 background-color: ${Un.Neutral[7]};
             `}
     }
-`,Bs=o.forwardRef((({children:e,focusHighlight:n=!0,focusOutline:r="none",...i},o)=>t(Ts,{ref:o,$outline:r,$highlight:n,...i,children:e}))),As=$.div`
+`,Bs=o.forwardRef((({children:e,focusHighlight:n=!0,focusOutline:r="none",type:i="button",...o},a)=>t(Ts,{ref:a,$outline:r,$highlight:n,type:i,...o,children:e}))),As=$.div`
     background-color: ${e=>e.$collapsible?Un.Neutral[7](e):Un.Neutral[8](e)};
 
     ${Yn.mobileL} {
@@ -464,7 +464,7 @@ var t=Object.getOwnPropertySymbols,n=Object.prototype.hasOwnProperty,r=Object.pr
             ${rr("H6","semibold")}
         }
     }
-`,Zs=({collapsible:e=!0,minimisable:r=!1,minimisedHeight:i,showDivider:o=!0,showMobileDivider:s=!0,title:l,children:c,...u})=>{const{mode:d}=g(De),h="mobile"===d,[f,p]=a(!h&&e),[m,y]=a(r),v=!h&&e,b=Pe(),w=Pe(),$=Wa({height:f?0:b.height}),C=m?i??Math.min(.5*w.height,216):w.height;return n(As,{$collapsible:v,children:[t(zs,{$showDivider:o,$showMobileDivider:s}),(l||v)&&n(Rs,{children:[l&&t(Vs,{weight:"semibold",children:l}),v&&t(Ns,{focusHighlight:!1,focusOutline:"browser",onClick:()=>{p(!f)},"aria-label":f?"Expand":"Collapse",children:t(Ls,{$expanded:!f})})]}),t(Ws,{style:h?void 0:$,children:t("div",{ref:b.ref,children:n(qs,{...u,children:[t(Qs,{$height:C,$minimisable:r,children:t("div",{ref:w.ref,children:t("div",{"data-id":"content-container",children:"function"==typeof c?c(d,{minimised:m}):c})})}),r&&n(Us,{"data-id":"minimise-button",styleType:"link",onClick:()=>{y(!m)},children:["View ",m?"more":"less"]})]})})})]})},Ys=$.div`
+`,Zs=({collapsible:e=!0,minimisable:r=!1,minimisedHeight:i,showDivider:o=!0,showMobileDivider:s=!0,title:l,children:c,...u})=>{const{mode:d}=g(De),h="mobile"===d,[f,p]=a(!h&&e),[m,y]=a(r),v=!h&&e,b=Pe(),w=Pe(),$=Wa({height:f?0:b.height}),C=m?i??Math.min(.5*w.height,216):w.height;return n(As,{$collapsible:v,children:[t(zs,{$showDivider:o,$showMobileDivider:s}),(l||v)&&n(Rs,{children:[l&&t(Vs,{weight:"semibold",children:l}),v&&t(Ns,{focusHighlight:!1,focusOutline:"browser",onClick:()=>{p(!f)},"aria-label":f?"Expand":"Collapse",children:t(Ls,{$expanded:!f})})]}),t(Ws,{style:h?void 0:$,children:t("div",{ref:b.ref,children:n(qs,{...u,children:[t(Qs,{$height:C,$minimisable:r,children:t("div",{ref:w.ref,children:t("div",{"data-id":"content-container",children:"function"==typeof c?c(d,{minimised:m}):c})})}),r&&n(Us,{"data-id":"minimise-button",styleType:"link",type:"button",onClick:()=>{y(!m)},children:["View ",m?"more":"less"]})]})})})]})},Ys=$.div`
     position: relative;
     display: inline-flex;
     min-width: 10.375rem;
@@ -692,5 +692,5 @@ var t=Object.getOwnPropertySymbols,n=Object.prototype.hasOwnProperty,r=Object.pr
     border-top: 1px solid ${Un.Neutral[5]};
 `,Tl=$(Es.Default)`
     width: 100%;
-`,Bl=Object.assign((({toggleFilterButtonLabel:e="Filters",headerTitle:i="Filters",clearButtonDisabled:o=!1,onClear:s,onDismiss:l,onDone:c,children:u,...d})=>{const[h,f]=a(!1);F.exports.useMediaQuery({maxWidth:T.mobileL},void 0,(e=>{e||m()}));const p=()=>{f(!0)},m=()=>{f(!1),l&&l()},g=()=>{f(!1),c&&c()},y=()=>{s&&s()},v=e=>"function"==typeof u?u(e):u,b=e=>n(Ml,{children:["mobile"===e&&t(Pl,{onClick:m,focusOutline:"browser",focusHighlight:!1,"aria-label":"Dismiss",children:t(x,{})}),t(Fl,{weight:"semibold",children:i}),t(Dl,{styleType:"link",onClick:y,disabled:o,children:"Clear"})]});return n("div",{...d,children:[t(Sl,{children:t(De.Provider,{value:{mode:"mobile"},children:n(r,{children:[n(Hl,{styleType:"light",onClick:p,children:[t(Il,{})," ",e]}),t(H,{show:h,disableTransition:!0,children:n(kl,{children:[b("mobile"),t(jl,{children:v("mobile")}),t(El,{children:t(Tl,{onClick:g,children:"Done"})})]})})]})})}),t(xl,{children:t(De.Provider,{value:{mode:"default"},children:n(Ol,{children:[b("default"),v("default")]})})})]})}),{Item:Zs,Page:({onDismiss:e,onDone:r,children:i})=>n(bl,{children:[t(Pl,{onClick:e,focusOutline:"browser",focusHighlight:!1,"aria-label":"Dismiss",children:t(ml,{})}),t(jl,{children:i}),t(El,{children:t(Tl,{onClick:r,children:"Done"})})]}),Checkbox:({selectedOptions:e,options:r,onSelect:i,labelExtractor:o,valueExtractor:c,...u})=>{const{mode:d}=g(De),[h,f]=a(e||[]),[p,y]=a(),[v,b]=a(r.length),w=s(),$=s(),C=e=>()=>{const t=[...h],n=h.findIndex((t=>x(t)===x(e)));n>=0?t.splice(n,1):t.push(e),f(t),i?.(t)},_=e=>o?o(e):e.label??e.toString(),x=e=>c?c(e):e.value??e.toString(),S=m((()=>{if(!w.current)return void y(void 0);const e=Array.from(w.current.children);let t=0,n=0,r=-1;for(let i=0;i<e.length;i++){const o=e[i].offsetTop;if(o>r&&(n++,r=o,n>2))break;t=i}b(t),y(n>2?r-8:void 0)}),[]);l((()=>{e!==h&&f(e||[])}),[e]),l((()=>{"default"===d?(()=>{const e=$.current?$.current.offsetTop+$.current.clientHeight:void 0;y(e)})():S()}),[r]),Pe({handleWidth:"mobile"===d,handleHeight:!1,skipOnMount:!0,refreshMode:"throttle",targetRef:w,onResize:S});return t(cl,{minimisable:r.length>5,minimisedHeight:p,...u,children:(e,{minimised:i})=>t(ul,{role:"group","aria-label":u.title,ref:w,children:r.map(((r,o)=>"default"===e?((e,r,i)=>{const o=_(e),a=x(e),s=!!h.find((e=>x(e)===a));return n(dl,{$visible:!i||r<5,$selected:s,ref:4===r?$:void 0,children:[t(hl,{type:"checkbox",checked:s,onChange:C(e)}),t(fl,{type:"checkbox",active:s}),o]},a)})(r,o,i):((e,n,r)=>{const i=_(e),o=x(e),a=!!h.find((e=>x(e)===o));return t(pl,{type:"checkbox",checked:a,$visible:!r||p&&n<=v,onChange:C(e),children:i})})(r,o,i)))})})}});export{Bl as Filter};
+`,Bl=Object.assign((({toggleFilterButtonLabel:e="Filters",headerTitle:i="Filters",clearButtonDisabled:o=!1,onClear:s,onDismiss:l,onDone:c,children:u,...d})=>{const[h,f]=a(!1);F.exports.useMediaQuery({maxWidth:T.mobileL},void 0,(e=>{e||m()}));const p=()=>{f(!0)},m=()=>{f(!1),l&&l()},g=()=>{f(!1),c&&c()},y=()=>{s&&s()},v=e=>"function"==typeof u?u(e):u,b=e=>n(Ml,{children:["mobile"===e&&t(Pl,{onClick:m,focusOutline:"browser",focusHighlight:!1,"aria-label":"Dismiss",children:t(x,{})}),t(Fl,{weight:"semibold",children:i}),t(Dl,{styleType:"link",type:"button",onClick:y,disabled:o,children:"Clear"})]});return n("div",{...d,children:[t(Sl,{children:t(De.Provider,{value:{mode:"mobile"},children:n(r,{children:[n(Hl,{styleType:"light",type:"button",onClick:p,children:[t(Il,{})," ",e]}),t(H,{show:h,disableTransition:!0,children:n(kl,{children:[b("mobile"),t(jl,{children:v("mobile")}),t(El,{children:t(Tl,{type:"button",onClick:g,children:"Done"})})]})})]})})}),t(xl,{children:t(De.Provider,{value:{mode:"default"},children:n(Ol,{children:[b("default"),v("default")]})})})]})}),{Item:Zs,Page:({onDismiss:e,onDone:r,children:i})=>n(bl,{children:[t(Pl,{onClick:e,focusOutline:"browser",focusHighlight:!1,"aria-label":"Dismiss",children:t(ml,{})}),t(jl,{children:i}),t(El,{children:t(Tl,{onClick:r,type:"button",children:"Done"})})]}),Checkbox:({selectedOptions:e,options:r,onSelect:i,labelExtractor:o,valueExtractor:c,...u})=>{const{mode:d}=g(De),[h,f]=a(e||[]),[p,y]=a(),[v,b]=a(r.length),w=s(),$=s(),C=e=>()=>{const t=[...h],n=h.findIndex((t=>x(t)===x(e)));n>=0?t.splice(n,1):t.push(e),f(t),i?.(t)},_=e=>o?o(e):e.label??e.toString(),x=e=>c?c(e):e.value??e.toString(),S=m((()=>{if(!w.current)return void y(void 0);const e=Array.from(w.current.children);let t=0,n=0,r=-1;for(let i=0;i<e.length;i++){const o=e[i].offsetTop;if(o>r&&(n++,r=o,n>2))break;t=i}b(t),y(n>2?r-8:void 0)}),[]);l((()=>{e!==h&&f(e||[])}),[e]),l((()=>{"default"===d?(()=>{const e=$.current?$.current.offsetTop+$.current.clientHeight:void 0;y(e)})():S()}),[r]),Pe({handleWidth:"mobile"===d,handleHeight:!1,skipOnMount:!0,refreshMode:"throttle",targetRef:w,onResize:S});return t(cl,{minimisable:r.length>5,minimisedHeight:p,...u,children:(e,{minimised:i})=>t(ul,{role:"group","aria-label":u.title,ref:w,children:r.map(((r,o)=>"default"===e?((e,r,i)=>{const o=_(e),a=x(e),s=!!h.find((e=>x(e)===a));return n(dl,{$visible:!i||r<5,$selected:s,ref:4===r?$:void 0,children:[t(hl,{type:"checkbox",checked:s,onChange:C(e)}),t(fl,{type:"checkbox",active:s}),o]},a)})(r,o,i):((e,n,r)=>{const i=_(e),o=x(e),a=!!h.find((e=>x(e)===o));return t(pl,{type:"checkbox",checked:a,$visible:!r||p&&n<=v,onChange:C(e),children:i})})(r,o,i)))})})}});export{Bl as Filter};
 //# sourceMappingURL=index.js.map