@lifesg/react-design-system 2.0.0-canary.3 → 2.0.0-canary.4

package/time-range-picker/index.js

@@ -678,7 +678,7 @@ import e,{jsx as t,jsxs as n}from"react/jsx-runtime";import*as r from"react";imp
     ${La.mobileS} {
         width: 100%;
     }
-`;var Al,El,Pl;!function(e){e.HOUR_UP="hour-up",e.HOUR_DOWN="hour-down",e.MINUTE_UP="minute-up",e.MINUTE_DOWN="minute-down"}(Al||(Al={})),function(e){e.HOUR="hour",e.MINUTE="minute"}(El||(El={})),function(e){e.AM="am",e.PM="pm"}(Pl||(Pl={}));const Il=({id:e,value:r,show:i,format:o,onChange:l,onCancel:c})=>{const u=Ia.getTimeValues(o,r),[h,p]=s(u.hour),[g,m]=s(u.minute),[y,v]=s(u.period),b=a(),w=a(),$=function(e){void 0===e&&(e={});var t=e.skipOnMount,n=void 0!==t&&t,r=e.refreshMode,i=e.refreshRate,o=void 0===i?1e3:i,l=e.refreshOptions,c=e.handleWidth,u=void 0===c||c,d=e.handleHeight,h=void 0===d||d,p=e.targetRef,f=e.observerOptions,g=e.onResize,m=a(n),y=a(null),v=null!=p?p:y,b=a(),w=s({width:void 0,height:void 0}),$=w[0],S=w[1];return Yn((function(){if(!Vn()){var e=Un(g,S,u,h);b.current=Rn((function(t){(u||h)&&t.forEach((function(t){var n=t&&t.contentRect||{},r=n.width,i=n.height;!m.current&&!Vn()&&e({width:r,height:i}),m.current=!1}))}),r,o,l);var t=new window.ResizeObserver(b.current);return v.current&&t.observe(v.current,f),function(){t.disconnect();var e=b.current;e&&e.cancel&&e.cancel()}}}),[r,o,l,u,h,g,f,v.current]),Kt({ref:v},$)}();d((()=>{if(i&&b.current&&b.current.focus(),i){const{hour:e,minute:t,period:n}=Ia.getTimeValues(o,r);p(e),m(t),v(n)}}),[i,r,o]),d((()=>{const e=b.current,t=w.current;return e&&e.addEventListener("keydown",S),t&&t.addEventListener("keydown",S),()=>{e&&e.removeEventListener("keydown",S),t&&t.removeEventListener("keydown",S)}}),[]);const S=e=>{["Digit0","Digit1","Digit2","Digit3","Digit4","Digit5","Digit6","Digit7","Digit8","Digit9","Tab","Backspace","Delete","ArrowLeft","ArrowRight","ArrowUp","ArrowDown"].includes(e.code)||["Backspace","0","1","2","3","4","5","6","7","8","9"].includes(e.key)||e.preventDefault()},x=f((e=>{switch(e.currentTarget.name){case Al.MINUTE_UP:m(Ia.updateMinutes(g,"add"));break;case Al.MINUTE_DOWN:m(Ia.updateMinutes(g,"minus"));break;case Al.HOUR_UP:p(Ia.updateHours(h,"add"));break;case Al.HOUR_DOWN:p(Ia.updateHours(h,"minus"))}}),[h,g]),C=e=>{e.target.select()},_=e=>{const t=e.target.value;switch(e.target.name){case El.HOUR:t.length<=2&&p(t);break;case El.MINUTE:t.length<=2&&m(t)}},F=e=>{const t=parseInt(e.target.value);if(!isNaN(t))switch(e.target.name){case El.HOUR:{const n=t>23||t<0?u.hour:Ia.convertHourTo12HourFormat(e.target.value);p(n);break}case El.MINUTE:{const n=t>59||t<0?u.minute:e.target.value;m(Ea.padValue(n));break}}},M=e=>{switch(e.target.name){case Pl.AM:v(Pa.AM);break;case Pl.PM:v(Pa.PM)}},k=t=>e?`${e}-${t}`:t,D=ua({height:i?$.height+32:0});return t($l,{"data-testid":"animated-dropdown-wrapper",style:D,children:n(Sl,{ref:$.ref,"data-testid":k("timepicker-dropdown"),inert:i?void 0:"",children:[n(xl,{children:[n(_l,{children:[n(Ml,{children:[t(kl,{"aria-label":"increase hour",name:Al.HOUR_UP,tabIndex:-1,onClick:x,"data-testid":k("hour-increment-button"),children:t(Zt,{})}),t(Ol,{"aria-label":"hour",type:"number",name:El.HOUR,id:"hour",maxLength:2,pattern:"[0-9]{2}",ref:b,value:h,onFocus:C,onChange:_,onBlur:F,min:1,max:12,placeholder:"HH","data-testid":k("hour-input")}),t(kl,{"aria-label":"decrease hour",name:Al.HOUR_DOWN,tabIndex:-1,onClick:x,"data-testid":k("hour-decrement-button"),children:t(Wt,{})})]}),t(Dl,{children:":"}),n(Ml,{children:[t(kl,{"aria-label":"increase minute",name:Al.MINUTE_UP,tabIndex:-1,onClick:x,"data-testid":k("minute-increment-button"),children:t(Zt,{})}),t(Ol,{"aria-label":"minute",type:"number",name:El.MINUTE,id:"minute",maxLength:2,pattern:"[0-9]{2}",ref:w,value:g,onChange:_,onBlur:F,onFocus:C,min:0,max:59,placeholder:"MM","data-testid":k("minute-input")}),t(kl,{"aria-label":"decrease minute",name:Al.MINUTE_DOWN,tabIndex:-1,onClick:x,"data-testid":k("minute-decrement-button"),children:t(Wt,{})})]})]}),n(Fl,{children:[t(Bl,{checked:y===Pa.AM,name:Pl.AM,type:"radio",onChange:M,"data-testid":k("am-toggle"),"aria-label":"AM",children:"AM"}),t(Bl,{checked:y===Pa.PM,name:Pl.PM,type:"radio",onChange:M,"data-testid":k("pm-toggle"),"aria-label":"PM",children:"PM"})]})]}),n(Cl,{children:[t(Hl,{"aria-label":"close selector",type:"button",styleType:"secondary",onClick:c,"data-testid":k("cancel-button"),children:"Cancel"}),t(Hl,{"aria-label":"confirm selection",type:"button",onClick:()=>{let e;e="24hr"===o?Ia.convertTo24HourFormat({hour:h,minute:g,period:y}):`${h}:${g}${y}`,l(e)},disabled:""===h||""===g,"data-testid":k("confirm-button"),children:"Done"})]})]})})},Tl=(e,t,n=window)=>{const r=a();d((()=>{r.current=t}),[t]),d((()=>{if(!(n&&n.addEventListener))return;const t=e=>r.current(e);return n.addEventListener(e,t),()=>{n.removeEventListener(e,t)}}),[e,n])},zl=y.div`
+`;var Al,El,Pl;!function(e){e.HOUR_UP="hour-up",e.HOUR_DOWN="hour-down",e.MINUTE_UP="minute-up",e.MINUTE_DOWN="minute-down"}(Al||(Al={})),function(e){e.HOUR="hour",e.MINUTE="minute"}(El||(El={})),function(e){e.AM="am",e.PM="pm"}(Pl||(Pl={}));const Il=({id:e,value:r,show:i,format:o,onChange:l,onCancel:c})=>{const u=Ia.getTimeValues(o,r),[h,p]=s(u.hour),[g,m]=s(u.minute),[y,v]=s(u.period),b=a(),w=a(),$=function(e){void 0===e&&(e={});var t=e.skipOnMount,n=void 0!==t&&t,r=e.refreshMode,i=e.refreshRate,o=void 0===i?1e3:i,l=e.refreshOptions,c=e.handleWidth,u=void 0===c||c,d=e.handleHeight,h=void 0===d||d,p=e.targetRef,f=e.observerOptions,g=e.onResize,m=a(n),y=a(null),v=null!=p?p:y,b=a(),w=s({width:void 0,height:void 0}),$=w[0],S=w[1];return Yn((function(){if(!Vn()){var e=Un(g,S,u,h);b.current=Rn((function(t){(u||h)&&t.forEach((function(t){var n=t&&t.contentRect||{},r=n.width,i=n.height;!m.current&&!Vn()&&e({width:r,height:i}),m.current=!1}))}),r,o,l);var t=new window.ResizeObserver(b.current);return v.current&&t.observe(v.current,f),function(){t.disconnect();var e=b.current;e&&e.cancel&&e.cancel()}}}),[r,o,l,u,h,g,f,v.current]),Kt({ref:v},$)}();d((()=>{if(i&&b.current&&b.current.focus(),i){const{hour:e,minute:t,period:n}=Ia.getTimeValues(o,r);p(e),m(t),v(n)}}),[i,r,o]),d((()=>{const e=b.current,t=w.current;return e&&e.addEventListener("keydown",S),t&&t.addEventListener("keydown",S),()=>{e&&e.removeEventListener("keydown",S),t&&t.removeEventListener("keydown",S)}}),[]);const S=e=>{["Digit0","Digit1","Digit2","Digit3","Digit4","Digit5","Digit6","Digit7","Digit8","Digit9","Tab","Backspace","Delete","ArrowLeft","ArrowRight","ArrowUp","ArrowDown"].includes(e.code)||["Backspace","0","1","2","3","4","5","6","7","8","9"].includes(e.key)||e.preventDefault()},x=f((e=>{switch(e.currentTarget.name){case Al.MINUTE_UP:m(Ia.updateMinutes(g,"add"));break;case Al.MINUTE_DOWN:m(Ia.updateMinutes(g,"minus"));break;case Al.HOUR_UP:p(Ia.updateHours(h,"add"));break;case Al.HOUR_DOWN:p(Ia.updateHours(h,"minus"))}}),[h,g]),C=e=>{e.target.select()},_=e=>{const t=e.target.value;switch(e.target.name){case El.HOUR:t.length<=2&&p(t);break;case El.MINUTE:t.length<=2&&m(t)}},F=e=>{const t=parseInt(e.target.value);if(!isNaN(t))switch(e.target.name){case El.HOUR:{const n=t>23||t<0?u.hour:Ia.convertHourTo12HourFormat(e.target.value);p(n);break}case El.MINUTE:{const n=t>59||t<0?u.minute:e.target.value;m(Ea.padValue(n));break}}},M=e=>{switch(e.target.name){case Pl.AM:v(Pa.AM);break;case Pl.PM:v(Pa.PM)}},k=t=>e?`${e}-${t}`:t,D=ua({height:i?$.height+32:0});return t($l,{"data-testid":"animated-dropdown-wrapper",style:D,children:n(Sl,{ref:$.ref,"data-testid":k("timepicker-dropdown"),inert:i?void 0:"",children:[n(xl,{children:[n(_l,{children:[n(Ml,{children:[t(kl,{"aria-label":"increase hour",name:Al.HOUR_UP,tabIndex:-1,onClick:x,"data-testid":k("hour-increment-button"),children:t(Zt,{})}),t(Ol,{"aria-label":"hour",type:"number",name:El.HOUR,id:"hour",maxLength:2,pattern:"[0-9]{2}",ref:b,value:h,onFocus:C,onChange:_,onBlur:F,min:1,max:12,placeholder:"HH","data-testid":k("hour-input")}),t(kl,{"aria-label":"decrease hour",name:Al.HOUR_DOWN,tabIndex:-1,onClick:x,"data-testid":k("hour-decrement-button"),children:t(Wt,{})})]}),t(Dl,{children:":"}),n(Ml,{children:[t(kl,{"aria-label":"increase minute",name:Al.MINUTE_UP,tabIndex:-1,onClick:x,"data-testid":k("minute-increment-button"),children:t(Zt,{})}),t(Ol,{"aria-label":"minute",type:"number",name:El.MINUTE,id:"minute",maxLength:2,pattern:"[0-9]{2}",ref:w,value:g,onChange:_,onBlur:F,onFocus:C,min:0,max:59,placeholder:"MM","data-testid":k("minute-input")}),t(kl,{"aria-label":"decrease minute",name:Al.MINUTE_DOWN,tabIndex:-1,onClick:x,"data-testid":k("minute-decrement-button"),children:t(Wt,{})})]})]}),n(Fl,{children:[t(Bl,{checked:y===Pa.AM,name:Pl.AM,type:"radio",onChange:M,"data-testid":k("am-toggle"),"aria-label":"AM",children:"AM"}),t(Bl,{checked:y===Pa.PM,name:Pl.PM,type:"radio",onChange:M,"data-testid":k("pm-toggle"),"aria-label":"PM",children:"PM"})]})]}),n(Cl,{children:[t(Hl,{"aria-label":"close selector",type:"button",styleType:"secondary",onClick:c,"data-testid":k("cancel-button"),children:"Cancel"}),t(Hl,{"aria-label":"confirm selection",type:"button",onClick:()=>{let e;e="24hr"===o?Ia.convertTo24HourFormat({hour:h,minute:g,period:y}):`${h}:${g}${y}`,l(e)},disabled:""===h||""===g,"data-testid":k("confirm-button"),children:"Done"})]})]})})},Tl=(e,t,n="window",r)=>{const i=a();d((()=>{i.current=t}),[t]),d((()=>{let t;switch(n){case"window":t=window;break;case"document":t=document;break;default:t=n}if(!(t&&t.addEventListener))return;const o=e=>i.current(e);return t.addEventListener(e,o,r),()=>{t.removeEventListener(e,o,r)}}),[e,n])},zl=y.div`
     position: relative;
 `,Nl=y(bl)`
     height: 3rem;
@@ -687,5 +687,5 @@ import e,{jsx as t,jsxs as n}from"react/jsx-runtime";import*as r from"react";imp
     display: block;
     width: 100%;
     flex: 1;
-`,Rl=({id:e,disabled:r=!1,error:i,value:o,format:l="24hr",readOnly:c,onChange:u,onBlur:h,...p})=>{const[f,g]=s(!1),[m,y]=s(!1),[v,b]=s(""),[w,$]=s(""),S=a();d((()=>{o&&(b(o.start),$(o.end))}),[]),Tl("mousedown",(function(e){r||_(e)}),document),Tl("keyup",(function(e){if("Tab"===e.code)_(e)}),document);const x=()=>{C()},C=()=>{g(!1),y(!1),h&&h()},_=e=>{S&&!S.current.contains(e.target)&&(m||f)&&C()};return t(zl,{ref:S,id:e,...p,children:n(Nl,{$disabled:r,$error:i,$readOnly:c,children:[n(Vt,{error:i,currentActive:f?"start":m?"end":"none",children:[t(jl,{onFocus:()=>{r||c||f||(y(!1),g(!0))},readOnly:!0,placeholder:"From",value:Ia.formatDisplayValue(v,l),disabled:r,"data-testid":p["data-testid"]?`${p["data-testid"]}-timepicker-selector`:"timepicker-selector"}),t(jl,{onFocus:()=>{r||c||m||(g(!1),y(!0))},readOnly:!0,placeholder:"To",value:Ia.formatDisplayValue(w,l),disabled:r,"data-testid":p["data-testid"]?`${p["data-testid"]}-timepicker-selector`:"timepicker-selector"})]}),t(Il,{id:e,show:f,value:v,format:l,onCancel:x,onChange:e=>{g(!1),y(!0),b(e);u&&u({start:e,end:w})}}),t(Il,{id:e,show:m,value:w,format:l,onCancel:x,onChange:e=>{y(!1),$(e),""==v&&g(!0);u&&u({start:v,end:e})}})]})})};export{Rl as TimeRangePicker};
+`,Rl=({id:e,disabled:r=!1,error:i,value:o,format:l="24hr",readOnly:c,onChange:u,onBlur:h,...p})=>{const[f,g]=s(!1),[m,y]=s(!1),[v,b]=s(""),[w,$]=s(""),S=a();d((()=>{o&&(b(o.start),$(o.end))}),[]),Tl("mousedown",(function(e){r||_(e)}),"document"),Tl("keyup",(function(e){if("Tab"===e.code)_(e)}),"document");const x=()=>{C()},C=()=>{g(!1),y(!1),h&&h()},_=e=>{S&&!S.current.contains(e.target)&&(m||f)&&C()};return t(zl,{ref:S,id:e,...p,children:n(Nl,{$disabled:r,$error:i,$readOnly:c,children:[n(Vt,{error:i,currentActive:f?"start":m?"end":"none",children:[t(jl,{onFocus:()=>{r||c||f||(y(!1),g(!0))},readOnly:!0,placeholder:"From",value:Ia.formatDisplayValue(v,l),disabled:r,"data-testid":p["data-testid"]?`${p["data-testid"]}-timepicker-selector`:"timepicker-selector"}),t(jl,{onFocus:()=>{r||c||m||(g(!1),y(!0))},readOnly:!0,placeholder:"To",value:Ia.formatDisplayValue(w,l),disabled:r,"data-testid":p["data-testid"]?`${p["data-testid"]}-timepicker-selector`:"timepicker-selector"})]}),t(Il,{id:e,show:f,value:v,format:l,onCancel:x,onChange:e=>{g(!1),y(!0),b(e);u&&u({start:e,end:w})}}),t(Il,{id:e,show:m,value:w,format:l,onCancel:x,onChange:e=>{y(!1),$(e),""==v&&g(!0);u&&u({start:v,end:e})}})]})})};export{Rl as TimeRangePicker};
 //# sourceMappingURL=index.js.map