@hhgtech/hhg-components 1.24.21 → 1.24.23

package/build/esm/index-fcef2054.js

@@ -1,78 +0,0 @@
-import{_ as e,a as t}from"./tslib.es6-f1b9d31e.js";import n,{forwardRef as a,useState as i,useEffect as r,Component as o,useRef as s,useCallback as l,useImperativeHandle as c}from"react";import{P as p,a as d,I as u,b as g,c as m,M as h,d as f,T as y,V as b,C as v}from"./Vietnam-dc72e656.js";import{s as j}from"./index-c9290e7f.js";import{Image as x,Text as C,Textarea as S,Accordion as E,Indicator as z,Avatar as k,Checkbox as w,Radio as O,Flex as P}from"@mantine/core";import{CommonGAssets as A}from"./gAssets.js";import{DatePicker as I,DateRangePicker as D}from"@mantine/dates";import H,{css as $}from"styled-components";import N from"dayjs";import"./screenSizeContext-796cb6e5.js";import{t as M}from"./theme-6dca57c7.js";import{M as T}from"./utils-049d75fa.js";import"./isProduction-e00482ad.js";import{L as R}from"./Locale-2a1e1450.js";import{Carousel as W}from"@mantine/carousel";import{c as V}from"./index-881e5990.js";
-/*!
-	Copyright (c) 2018 Jed Watson.
-	Licensed under the MIT License (MIT), see
-	http://jedwatson.github.io/classnames
-*/var B=V((function(e){!function(){var t={}.hasOwnProperty;function n(){for(var e=[],a=0;a<arguments.length;a++){var i=arguments[a];if(i){var r=typeof i;if("string"===r||"number"===r)e.push(i);else if(Array.isArray(i)){if(i.length){var o=n.apply(null,i);o&&e.push(o)}}else if("object"===r){if(i.toString!==Object.prototype.toString&&!i.toString.toString().includes("[native code]")){e.push(i.toString());continue}for(var s in i)t.call(i,s)&&i[s]&&e.push(s)}}}return e.join(" ")}e.exports?(n.default=n,e.exports=n):window.classNames=n}()}));const L=Object.values(j).reduce(((e,{phoneCountry:t})=>(e.includes(t)||e.push(t),e)),[]),G={PH:p,KH:d,ID:u,IN:g,MM:m,MY:h,TH:f,TW:y,VN:b};var F={phoneInput:"i-9Ibox",error:"YDWHh9b"};const U=a(((a,o)=>{const{isError:s,defaultCountry:l,countries:c=L,countryCallingCodeEditable:p=!1,defaultValue:d,value:u,onChange:g,className:m}=a,h=e(a,["isError","defaultCountry","countries","countryCallingCodeEditable","defaultValue","value","onChange","className"]),[f,y]=i(d||u),[b,j]=i(null);return r((()=>{y(u)}),[u]),r((()=>{t(void 0,void 0,void 0,(function*(){const e=yield import("react-phone-number-input");j(e)}))}),[]),b?n.createElement(b.default,Object.assign({ref:o,value:f,onChange:e=>{y(e),null==g||g(e)},countries:c,defaultCountry:l,countryCallingCodeEditable:p,className:B(F.phoneInput,{isError:s,[F.error]:s},m),flagUrl:void 0,flagComponent:t=>{const{country:a,countryName:i,flagUrl:r}=t,o=e(t,["country","countryName","flagUrl"]),s=G[a],l=a?`(+${b.getCountryCallingCode(a)})`:"";return s?n.createElement(n.Fragment,null,n.createElement(s,Object.assign({title:i},o)),n.createElement("span",{className:B(F.callingCode,"PhoneInputCountryIconCallingCode")},l)):n.createElement(n.Fragment,null)},countrySelectProps:{arrowComponent:()=>n.createElement("div",{className:B(F.arrowSelect,"PhoneInputArrowContainer")},n.createElement(v,null))}},h)):null})),Y=H(I)`
-  position: relative;
-  ${e=>e.fullWidth&&$`
-      .mantine-DatePicker-dropdown {
-        min-width: 100%;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-      }
-    `}
-`,K=H(D)`
-  position: relative;
-  ${e=>e.fullWidth&&$`
-      .mantine-DateRangePicker-dropdown {
-        min-width: 100%;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-      }
-    `}
-`,_=e=>n.createElement(Y,Object.assign({size:"md",clearable:!1,fullWidth:!0,styles:{rightSection:{pointerEvents:"none",cursor:"default"}},rightSection:n.createElement(x,{src:A.getAssetPath(e.isMB?"MB-calendar.svg":"OutlineCalendar.svg"),width:16,height:16})},e));_.Range=e=>n.createElement(K,Object.assign({size:"md",clearable:!1,fullWidth:!0,styles:{rightSection:{pointerEvents:"none",cursor:"default"}},rightSection:n.createElement(x,{src:A.getAssetPath("OutlineCalendar.svg"),width:16,height:16})},e));const Q=Object.assign({},{fontSize:{base:[16,16],lg:[18,16],md:[18,16],sm:[16,14],xs:[14,12],s1:[22,18],s2:[18,16],s3:[16,14],s4:[14,12],s5:[12,12],p1:[18,16],p2:[16,16],p3:[16,14],p4:[14,12],c1:[16,14],c2:[14,12],n1:[12,12],label1:[14,14],label2:[12,12]},lineHeight:{base:[24,24],lg:[32,28],md:[32,28],sm:[24,22],xs:[24,18],s1:[32,26],s2:[28,24],s3:[24,24],s4:[22,18],s5:[18,18],p1:[32,28],p2:[24,24],p3:[24,22],p4:[22,18],c1:[24,22],c2:[22,18],n1:[18,18],label1:[22,22],label2:[18,18]},letterSpacing:{lg:[-.2,0],md:[-.2,0],sm:[0,-.2],s1:[-.6,-.6],s2:[-.4,-.2],s3:[0,-.2],s4:[0,-.2],p1:[-.2,-.2],p2:[0,-.2],p3:[0,-.2],p4:[-.2,0],label1:[0,-.2]},fontWeight:{regular:400,semiBold:600,bold:700}}),q=H(C)`
-  font-weight: ${e=>Q.fontWeight[e["data-weight"]]};
-  font-size: ${e=>Q.fontSize[e["data-size"]][0]}px;
-  line-height: ${e=>Q.lineHeight[e["data-size"]][0]}px;
-  letter-spacing: ${e=>{var t,n,a;return null!==(a=null===(n=null===(t=Q.letterSpacing)||void 0===t?void 0:t[e["data-size"]])||void 0===n?void 0:n[0])&&void 0!==a?a:0}}px;
-
-  ${T.mbDown} {
-    font-size: ${e=>Q.fontSize[e["data-size"]][1]}px;
-    line-height: ${e=>Q.lineHeight[e["data-size"]][1]}px;
-    letter-spacing: ${e=>{var t,n,a;return null!==(a=null===(n=null===(t=Q.letterSpacing)||void 0===t?void 0:t[e["data-size"]])||void 0===n?void 0:n[1])&&void 0!==a?a:0}}px;
-  }
-`,J=H(S)`
-  .mantine-Textarea-input {
-    padding: 12px 16px;
-    background: #ffffff;
-    border: 1px solid ${M.colors.gray200};
-    border-radius: 4px;
-  }
-`,X=H(E)`
-  .mantine-Accordion-control {
-    &:hover {
-      background-color: transparent;
-    }
-  }
-  .mantine-Accordion-item {
-    .mantine-Accordion-chevron {
-      > div {
-        background-repeat: no-repeat;
-        width: 16px;
-        height: 16px;
-        background-position: center;
-        background-image: url(${e=>e.closeChevron||A.getAssetPath("plus-icon.svg")});
-      }
-    }
-    &[data-active='true'] {
-      .mantine-Accordion-chevron {
-        > div {
-          background-image: url(${e=>e.openChevron||A.getAssetPath("minus-icon.svg")});
-        }
-      }
-    }
-  }
-  .mantine-Accordion-panel {
-    border-radius: ${e=>e.theme.borderRadius};
-  }
-  .mantine-Accordion-content {
-    white-space: pre-wrap;
-  }
-`,Z=t=>{var{children:a}=t,i=e(t,["children"]);return n.createElement(X,Object.assign({chevron:n.createElement("div",null),disableChevronRotation:!0,transitionDuration:300},i),a)};Z.Control=E.Control,Z.Item=E.Item,Z.Panel=E.Panel;const ee=A.getAssetPath("avatar.jpg"),te=t=>{var{withIndicator:a=!1,indicatorConfig:i=null,size:r=56,children:o,styles:s}=t,l=e(t,["withIndicator","indicatorConfig","size","children","styles"]);const c=()=>n.createElement(k,Object.assign({size:r,radius:"xl"},l,{imageProps:Object.assign({loading:"lazy"},l.imageProps)}),o||n.createElement("img",{loading:"lazy",src:ee,width:r}));return a?n.createElement(z,Object.assign({inline:!0,position:"bottom-end",offset:9},i,{styles:Object.assign({indicator:{backgroundColor:n.isValidElement(i.label)&&"transparent",zIndex:1}},s)}),c()):c()};class ne extends o{constructor(){super(...arguments),this.state={hasError:!1}}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(e,t){console.error("Uncaught error:",e,t)}render(){return this.state.hasError?this.props.fallback||n.createElement(n.Fragment,null):this.props.children}}const ae=t=>{var{slidesToShow:a=1,children:i}=t,r=e(t,["slidesToShow","children"]);return(Array.isArray(i)?i.length:1)?n.createElement(ne,null,n.createElement(W,Object.assign({slideSize:String(Math.floor(1/a*100))+"%",containScroll:"trimSnaps"},r),i)):null};ae.Slide=W.Slide;const ie=e=>n.createElement(w,Object.assign({},e));ie.Group=w.Group;const re=H(O)`
-  .mantine-Radio-icon {
-    color: ${e=>e.color||M.colors.primaryBase};
-  }
-`,oe=e=>n.createElement(re,Object.assign({size:"sm"},e));oe.Group=O.Group;const se={[R.Vietnam]:"vi",[R.Cambodia]:"km",[R.India]:"hi",[R.Indonesia]:"id",[R.Malaysia]:"ms",[R.Thailand]:"th",[R.Taiwan]:"zh-tw",[R.PhilippinesTagalog]:"tl-ph",[R.PhilippinesEnglish]:"en",[R.Myanmar]:"my"},le={[R.Vietnam]:()=>import("dayjs/locale/vi.js"),[R.Cambodia]:()=>import("dayjs/locale/km.js"),[R.India]:()=>import("dayjs/locale/hi.js"),[R.Indonesia]:()=>import("dayjs/locale/id.js"),[R.Malaysia]:()=>import("dayjs/locale/ms.js"),[R.Thailand]:()=>import("dayjs/locale/th.js"),[R.Taiwan]:()=>import("dayjs/locale/zh-tw.js"),[R.PhilippinesTagalog]:()=>import("dayjs/locale/tl-ph.js"),[R.PhilippinesEnglish]:()=>import("dayjs/locale/en.js"),[R.Myanmar]:()=>import("dayjs/locale/my.js")},ce=e=>{const[n,a]=i(!1);return r((()=>{t(void 0,void 0,void 0,(function*(){var t;a(!1),yield null===(t=le[e])||void 0===t?void 0:t.call(le),N.locale(se[e]),a(!0)}))}),[e]),{isLoaded:n}},pe="100ms",de={"&:hover":{border:`1px solid ${M.colors.primaryBase}`}},ue=[{size:40,lineHeight:"52px",letterSpacing:"-1.2px"},{size:32,lineHeight:"42px",letterSpacing:"-1px"},{size:26,lineHeight:"36px",letterSpacing:"-0.8px"},{size:22,lineHeight:"32px",letterSpacing:"-0.6px"},{size:18,lineHeight:"28px",letterSpacing:"-0.2px"},{size:16,lineHeight:"24px",letterSpacing:0}],ge=[{size:26,lineHeight:"534px",letterSpacing:"-0.9px"},{size:24,lineHeight:"32px",letterSpacing:"-0.8px"},{size:20,lineHeight:"26px",letterSpacing:"-0.7px"},{size:18,lineHeight:"26px",letterSpacing:"-0.6px"},{size:16,lineHeight:"24px",letterSpacing:"-0.2px"},{size:14,lineHeight:"22px",letterSpacing:"-0.2px"}],me=(e=!1)=>Object.fromEntries((e?ge:ue).map(((e,t)=>[`&:is(h${t+1})`,{fontSize:e.size,lineHeight:e.lineHeight,letterSpacing:e.letterSpacing}]))),he={Title:{styles:{root:Object.assign(Object.assign({fontWeight:Q.fontWeight.bold},me()),{[`&${T.mbDown}`]:Object.assign({},me(!0))})}}},fe={Radio:{styles:{radio:Object.assign(Object.assign({backgroundColor:"#ffffff"},de),{"&:checked":{backgroundColor:"#ffffff"}})}}};function ye(e,t=6){const n=new Array(t).fill("");if(e){const t=e.toString().split("");n.map(((e,a)=>{t[a]&&(n[a]=t[a]||"")}))}return n}function be(e){return e.join("")}var ve="_2iQs0sk",je="Ia6IojY";const xe=a(((t,a)=>{const{maxLength:i=1,placeholder:r,className:o}=t,s=e(t,["maxLength","placeholder","className"]);return n.createElement("input",Object.assign({maxLength:i,className:B(je,"otpInput",o),placeholder:r,type:"number"},s,{ref:a}))})),Ce=a(((e,t)=>{const{valueLength:a=6,type:o="number",value:p,defaultValue:d,onChange:u,onBlur:g}=e,m=s(new Array(a).fill(null)),[h,f]=i(d||p),[y,b]=i(-1),[v,j]=i((()=>ye(h,a))),x=l((()=>{if(-1===y)return;const e=m.current[y];if(e){e.value="";const t=v;t[y]="",j(t),f((()=>be(t))),null==u||u(be(t))}}),[y,u,v]),C=l((()=>{if(0===y)return;const e=m.current[y];e&&e.blur();const t=m.current[y-1];t&&t.focus()}),[y]),S=l((()=>{if(y===a-1)return;const e=m.current[y];e&&e.blur();const t=m.current[y+1];t&&t.focus()}),[y,a]),E=l((e=>{const t=e.target,n=t.value.toString().slice(0,1),a=m.current.findIndex((e=>e===t));if(-1!==a){const e=v;e[a]=n,j(e),f((()=>be(e))),null==u||u(be(e))}S()}),[S,u,v]),z=l((e=>{const t=e.target,n=m.current.findIndex((e=>e===t));"number"===o?t.select():t.setSelectionRange(0,t.value.length,"backward"),-1!==n&&b(n)}),[]),k=l((e=>{const t=ye(e.clipboardData.getData("text/plain"),a),n=be(t);j(t),f(n),null==u||u(n)}),[u,o,a]),w=l((e=>{8===e.keyCode||"Backspace"===e.key?(e.preventDefault(),x(),C()):46===e.keyCode||"Delete"===e.key?(e.preventDefault(),x()):37===e.keyCode||"ArrowLeft"===e.key?(e.preventDefault(),C()):39===e.keyCode||"ArrowRight"===e.key?(e.preventDefault(),S()):32!==e.keyCode&&" "!==e.key&&"Spacebar"!==e.key&&"Space"!==e.key||e.preventDefault()}),[x,S,C]);return c(t,(()=>m.current[0]),[]),r((()=>{j((()=>ye(p,a))),f(p)}),[a,p]),n.createElement(P,{justify:"center",columnGap:8,className:B(ve,"otpContainer")},v.map(((e,t)=>n.createElement(xe,{ref:e=>{m.current[t]=e},key:""+t,value:e,type:o,onChange:E,onFocus:z,onKeyDown:w,onPaste:k,onBlur:g}))))}));export{pe as A,ae as C,_ as D,fe as G,se as M,Ce as O,U as P,oe as R,q as S,J as a,de as b,he as c,Z as d,te as e,ie as f,Q as g,ce as u};