"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[2582],{S5L0:function(e,t,r){r.d(t,{B:function(){return BabyGrowthForm}});var a=r("FRPj"),l=r("q1tI"),n=r("/npG"),i=r("mYVa"),o=r("8vDj"),s=r("iuhU"),c=r("cChf"),m=r("ZFu2"),u=r("fdQd"),g=r("u7wK"),d=r("wp0n"),h=r("iBNF"),p=r("Gx+P"),b=r("7dxN"),w=r("nS/c"),E=r("sxbY"),v=r("r0pl"),y=r("eosF"),f=r("Zge2");let x=(0,l.createContext)({}),DefaultForm=e=>{let{t,locale:r}=(0,p.u)(),{classes:a={}}=(0,l.useContext)(b.C),{form:n,currentUrl:i,submitProps:o}=(0,l.useContext)(x),s={placeholder:"DD/MM/YYYY",popoverProps:{withinPortal:!0}};return l.createElement(E.H,Object.assign({formLayout:"default"},e),l.createElement(E.H.FormRow,null,l.createElement(E.H.Control,null,l.createElement(v.G,Object.assign({isBaby:!0,genderValue:{male:"boy",female:"girl"}},n.getInputProps("gender"),{error:null}))),n.errors.gender&&l.createElement(E.H.Error,null,n.errors.gender)),l.createElement(E.H.FormRow,null,l.createElement(u.I.Wrapper,{label:l.createElement(d.T,{size:"p2",weight:"semiBold"},t("babyGrowth.input.birthday"))},l.createElement(g.D,Object.assign({},s,{maxDate:new Date},n.getInputProps("birthday"),{error:null,onChange:e=>{e&&n.validateField("measurementDate"),n.getInputProps("birthday").onChange(e)}}))),n.errors.birthday&&l.createElement(E.H.Error,null,n.errors.birthday)),l.createElement(E.H.FormRow,null,l.createElement(u.I.Number,Object.assign({label:l.createElement(d.T,{size:"p2",weight:"semiBold"},t("babyGrowth.height"),l.createElement(d.T,{size:"p2",weight:"semiBold",color:h.r.colors.gray300,as:"span"},` (${t("babyGrowth.cm")})`))},n.getInputProps("height"),{placeholder:t("babyGrowth.height"),min:w.I.height.min,max:w.I.height.max,onChange:e=>{n.setFieldValue("height",e),n.setFieldValue("checkMesureVal",!n.values.checkMesureVal)}}))),l.createElement(E.H.FormRow,null,l.createElement(u.I.Number,Object.assign({label:l.createElement(d.T,{size:"p2",weight:"semiBold"},t("babyGrowth.weight"),l.createElement(d.T,{size:"p2",weight:"semiBold",color:h.r.colors.gray300,as:"span"},` (${t("babyGrowth.kg")})`))},n.getInputProps("weight"),{placeholder:t("babyGrowth.weight"),min:w.I.weight.min,max:w.I.weight.max,onChange:e=>{n.setFieldValue("weight",e),n.setFieldValue("checkMesureVal",!n.values.checkMesureVal)}}))),r!==y.L.Vietnam&&l.createElement(E.H.FormRow,null,l.createElement(u.I.Number,Object.assign({label:l.createElement(d.T,{size:"p2",weight:"semiBold"},t("babyGrowth.head"),l.createElement(d.T,{size:"p2",weight:"semiBold",color:h.r.colors.gray300,as:"span"},` (${t("babyGrowth.cm")})`))},n.getInputProps("head"),{placeholder:t("babyGrowth.head"),onChange:e=>{n.setFieldValue("head",e),n.setFieldValue("checkMesureVal",!n.values.checkMesureVal)}}))),n.errors.checkMesureVal&&l.createElement(E.H.Error,null,n.errors.checkMesureVal),l.createElement(E.H.FormRow,null,l.createElement(u.I.Wrapper,{label:l.createElement(d.T,{size:"p2",weight:"semiBold"},t("babyGrowth.input.measurementDate"))},l.createElement(g.D,Object.assign({},s,{defaultValue:new Date},n.getInputProps("measurementDate"),{maxDate:new Date,error:null}))),n.errors.measurementDate&&l.createElement(E.H.Error,null,n.errors.measurementDate)),l.createElement(E.H.FormRow,{className:a.submitWrapper},l.createElement(E.H.Submit,Object.assign({className:a.submitBtn,type:"submit","data-event-category":"Health Tool","data-event-action":"Baby Growth","data-event-label":i},o),t("babyGrowth.input.submit"))))};var k=(0,n.k)(e=>({root:{display:"flex",flexDirection:"column",gap:(0,i.h)(8)},bmiVal:{display:"inline-block"},unitText:{color:e.colors.gray[6]},submitBtn:{}}));let localizeNumberFormat=(e,t=2)=>Intl.NumberFormat(void 0,{maximumFractionDigits:t}).format(e),bmiCalculate=(e=0,t=0)=>{try{if(e&&t){let r=Number(t)/Math.pow(Number(e)/100,2);if(isNaN(r))return 0;return Number(localizeNumberFormat(r))}}catch(e){}return 0},InlineForm=e=>{var{styles:t,classNames:r}=e,n=(0,a._)(e,["styles","classNames"]);let{t:i,locale:c}=(0,p.u)(),{form:m,currentUrl:h,submitProps:f}=(0,l.useContext)(x),{classes:I={}}=(0,l.useContext)(b.C),V=(0,o.rZ)(),{classes:C}=k(void 0,{name:"BabyGrowthForm__InlineForm",styles:t,classNames:r}),P={placeholder:"DD/MM/YYYY",popoverProps:{withinPortal:!0}};return l.createElement(E.H,Object.assign({formLayout:"inline"},n),l.createElement(E.H.FormRow,null,l.createElement(E.H.BorderInlineControl,{label:i("tools.selectBabyGender")},l.createElement(v.G,Object.assign({type:"radio",hideLabel:!0,isBaby:!0,genderValue:{male:"boy",female:"girl"}},m.getInputProps("gender")))),m.errors.gender&&l.createElement(E.H.Error,null,m.errors.gender)),l.createElement(E.H.FormRow,null,l.createElement(E.H.BorderInlineControl,{label:i("babyGrowth.input.birthday")},l.createElement(g.D,Object.assign({},P,{maxDate:new Date},m.getInputProps("birthday"),{error:null,onChange:e=>{e&&m.validateField("measurementDate"),m.getInputProps("birthday").onChange(e)}}))),m.errors.birthday&&l.createElement(E.H.Error,null,m.errors.birthday)),l.createElement(E.H.FormRow,null,l.createElement(E.H.BorderInlineControl,{label:"BMI",styles:{control:{"&:first-child":{width:"auto"}}}},l.createElement(d.T,{size:"p3"},l.createElement("span",{className:C.bmiVal},m.getInputProps("height").value&&m.getInputProps("weight").value&&bmiCalculate(Number(m.getInputProps("height").value),Number(m.getInputProps("weight").value))),"(",i("babyGrowth.kg.m2"),")"),l.createElement(u.I.Number,Object.assign({},m.getInputProps("height"),{placeholder:i("babyGrowth.height"),min:w.I.height.min,max:w.I.height.max,onChange:e=>{m.setFieldValue("height",e),m.setFieldValue("checkMesureVal",!m.values.checkMesureVal)},rightSection:l.createElement(E.H.Unit,null,i("babyGrowth.cm"))})),l.createElement(u.I.Number,Object.assign({},m.getInputProps("weight"),{placeholder:i("babyGrowth.weight"),min:w.I.weight.min,max:w.I.weight.max,onChange:e=>{m.setFieldValue("weight",e),m.setFieldValue("checkMesureVal",!m.values.checkMesureVal)},rightSection:l.createElement(E.H.Unit,null,i("babyGrowth.kg"))}))),("mb"===V.other.template||c!==y.L.Vietnam)&&l.createElement(E.H.BorderInlineControl,{label:i("babyGrowth.head")},l.createElement(u.I.Number,Object.assign({},m.getInputProps("head"),{placeholder:i("babyGrowth.head"),onChange:e=>{m.setFieldValue("head",e),m.setFieldValue("checkMesureVal",!m.values.checkMesureVal)},rightSection:l.createElement(E.H.Unit,null,i("babyGrowth.cm"))}))),m.errors.checkMesureVal&&l.createElement(E.H.Error,null,m.errors.checkMesureVal)),l.createElement(E.H.FormRow,null,l.createElement(E.H.BorderInlineControl,{label:i("babyGrowth.input.measurementDate")},l.createElement(g.D,Object.assign({},P,{maxDate:new Date},m.getInputProps("measurementDate"),{error:null}))),m.errors.measurementDate&&l.createElement(E.H.Error,null,m.errors.measurementDate)),l.createElement(E.H.FormRow,{className:I.submitWrapper},l.createElement(E.H.Submit,Object.assign({type:"submit","data-event-category":"Health Tool","data-event-action":"Baby Growth","data-event-label":h,className:(0,s.default)(C.submitBtn,I.submitBtn)},f),i("babyGrowth.input.submit"))))},MbLayout=e=>{var t=(0,a._)(e,[]);let{t:r}=(0,p.u)(),{form:n,currentUrl:i,submitProps:o}=(0,l.useContext)(x),s={placeholder:"DD/MM/YYYY",popoverProps:{withinPortal:!0}};return l.createElement(E.H,Object.assign({formLayout:"default"},t),l.createElement(E.H.FormRow,null,l.createElement(E.H.Control,null,l.createElement(v.G,Object.assign({isBaby:!0,genderValue:{male:"boy",female:"girl"}},n.getInputProps("gender"),{error:null}))),n.errors.gender&&l.createElement(E.H.Error,null,n.errors.gender)),l.createElement(E.H.BorderBoxControl,{label:r("babyGrowth.input.birthday"),rightSection:l.createElement(f.Z,null)},l.createElement(g.D,Object.assign({},s,{maxDate:new Date},n.getInputProps("birthday"),{error:null,rightSection:null,onChange:e=>{e&&n.validateField("measurementDate"),n.getInputProps("birthday").onChange(e)}}))),n.errors.birthday&&l.createElement(E.H.Error,null,n.errors.birthday),l.createElement(E.H.BorderBoxControl,{label:r("babyGrowth.height"),rightSection:r("babyGrowth.cm")},l.createElement(u.I.Number,Object.assign({},n.getInputProps("height"),{placeholder:r("tools.inputPlaceholder",{content:"160"}),min:w.I.height.min,max:w.I.height.max,onChange:e=>{n.setFieldValue("height",e),n.setFieldValue("checkMesureVal",!n.values.checkMesureVal)}}))),n.errors.height&&l.createElement(E.H.Error,null,n.errors.height),l.createElement(E.H.BorderBoxControl,{label:r("babyGrowth.weight"),rightSection:r("babyGrowth.kg")},l.createElement(u.I.Number,Object.assign({},n.getInputProps("weight"),{placeholder:r("tools.inputPlaceholder",{content:"50"}),min:w.I.weight.min,max:w.I.weight.max,onChange:e=>{n.setFieldValue("weight",e),n.setFieldValue("checkMesureVal",!n.values.checkMesureVal)}}))),n.errors.weight&&l.createElement(E.H.Error,null,n.errors.weight),l.createElement(E.H.BorderBoxControl,{label:r("babyGrowth.head"),rightSection:r("babyGrowth.cm")},l.createElement(u.I.Number,Object.assign({},n.getInputProps("head"),{placeholder:r("tools.inputPlaceholder",{content:"50"}),onChange:e=>{n.setFieldValue("head",e),n.setFieldValue("checkMesureVal",!n.values.checkMesureVal)}}))),n.errors.checkMesureVal&&l.createElement(E.H.Error,null,n.errors.checkMesureVal),l.createElement(E.H.BorderBoxControl,{label:r("babyGrowth.input.measurementDate"),rightSection:l.createElement(f.Z,null)},l.createElement(u.I.Wrapper,null,l.createElement(g.D,Object.assign({},s,{defaultValue:new Date},n.getInputProps("measurementDate"),{maxDate:new Date,rightSection:null,error:null})))),n.errors.measurementDate&&l.createElement(E.H.Error,null,n.errors.measurementDate),l.createElement(E.H.Submit,Object.assign({type:"submit","data-event-category":"Health Tool","data-event-action":"Baby Growth","data-event-label":i},o),r("babyGrowth.input.submit")))},BabyGrowthForm=e=>{var{onSubmit:t,formLayout:r="default",submitProps:n,currentUrl:i}=e,s=(0,a._)(e,["onSubmit","formLayout","submitProps","currentUrl"]);let{t:u}=(0,p.u)(),g=(0,o.rZ)(),d=(0,c.c)({initialValues:{measurementDate:new Date},validate:{gender:(0,m.U)(u("validation.error.requiredField")),birthday:(0,m.U)(u("validation.error.requiredField")),measurementDate:(e,t)=>t.birthday?t.birthday instanceof Date&&e instanceof Date&&t.birthday.getTime()<=e.getTime()?null:u("babyGrowth.error.measurementDateLowerThanBirthday",{name:""}):null,checkMesureVal:(e,t)=>void 0===t.head&&void 0===t.height&&void 0===t.weight||t.head||t.height||t.weight?null:u("babyGrowth.error.atLeastOneOf")},validateInputOnChange:["checkMesureVal"]}),h=Object.assign({onSubmit:d.onSubmit(e=>null==t?void 0:t(Object.assign(Object.assign({},e),{bmi:bmiCalculate(Number(d.getInputProps("height").value),Number(d.getInputProps("weight").value)).toString()})))},s);return l.createElement(x.Provider,{value:{submitProps:n,currentUrl:i,form:d}},"default"===r?"mb"===g.other.template?l.createElement(MbLayout,Object.assign({formLayout:r},h)):l.createElement(DefaultForm,Object.assign({},h)):l.createElement(InlineForm,Object.assign({},h)))}},LaLE:function(e,t,r){r.d(t,{C:function(){return Container}});var a=r("q1tI");let Container=({children:e,className:t,style:r,type:l})=>a.createElement("div",{className:`d76E4SH ${t||""}`,style:r,"data-type":l},e)},voTM:function(e,t,r){r.d(t,{C:function(){return h},I:function(){return ImagePreviewPopup},P:function(){return PostSingleImageViewPopup},a:function(){return PostImagePreview},b:function(){return p}});var a=r("q1tI"),l=r("DEkF"),n=r("uuQu"),i=r("Gx+P"),o=r("VhOp"),s=r("t/pd"),c=r("wp0n"),m=r("rBCA"),u=r("FRPj"),g=r("iBNF"),d=r("gEnE"),h="data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3e%3cpath stroke='%23262626' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M18 6 6 18M6 6l12 12'/%3e%3c/svg%3e",p="data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' fill='none'%3e%3cpath stroke='%23262626' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.75' d='M10.05 18.06 4 12.038l6.05-6.025M4.002 12.035h15'/%3e%3c/svg%3e";let b=m.Z.div`
  padding: 14px 16px 14px 17px;
  background: ${e=>e.bgColor};
  border-left: 3px solid ${e=>e.highlight};

  ${n.M.mbUp} {
    padding: 12px 12px 12px 17px;
  }
`,w=m.Z.div`
  display: flex;
`,E=m.Z.div`
  font-size: 12px;
  line-height: 18px;

  &[data-has-icon='true'] {
    margin-left: 10px;
  }
`,v=m.Z.div`
  flex-shrink: 0;
`,y=m.Z.div`
  display: grid;
  grid-gap: 3px;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto;

  .img-wrapper {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 56.25%;
    grid-column: auto;

    & > img {
      cursor: zoom-in;
    }

    .img-preview-blur {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 110%;
      height: 110%;
      /* Add the blur effect */
      -webkit-filter: blur(8px);
      filter: blur(8px);
      object-fit: cover;
      object-position: center;
      opacity: 0.8;
      transform: translate(-50%, -50%);
    }
    .img-preview {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: contain;
      object-position: center;
    }
    .img-more-overlay {
      position: absolute;
      top: 0;
      left: 0;
      display: flex;
      width: 100%;
      height: 100%;
      align-items: center;
      justify-content: center;
      background: rgba(0, 0, 0, 0.5);
      z-index: 4;
    }
  }
  &[data-image-count='1'] {
    .img-wrapper {
      /* padding-top: 100%; */
      grid-column: 1/3;
    }
  }
  &[data-image-count='2'] {
    .img-wrapper {
      /* padding-top: 100%; */
    }
  }
  &[data-image-count='3'] {
    .img-wrapper {
      &:first-child {
        grid-column: 1/3;
      }
    }
  }
  &[data-image-count='4'] {
    .img-wrapper {
      /* padding-top: 100%; */
    }
  }
  &[data-image-count='5'] {
    grid-template-columns: repeat(6, 1fr);
    .img-wrapper {
      /* padding-top: 100%; */
      grid-column: auto/ span 2;

      &:first-child {
        padding-top: 56.25%;
        grid-column: 1/4;
      }
      &:nth-child(2) {
        padding-top: 56.25%;
        grid-column: 4/7;
      }
    }
  }

  &[data-is-marrybaby='true'] {
    grid-gap: 8px;
    .img-wrapper {
      padding-top: 66.66%;
      border-radius: 1rem;
      .img-preview {
        object-fit: cover;
      }
    }
    &[data-image-count='3'] {
      grid-template-columns: 1fr 1fr 1fr;
      .img-wrapper {
        &:first-child {
          padding-top: 100%;
          grid-column: 1/3;
          grid-row: 1/3;
        }
      }
    }
  }
`,f=m.Z.div`
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  display: flex;
  overflow: hidden;
  width: 100vw;
  height: 100vh;
  flex-direction: column;
  background: white;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s linear;
  &[data-open='true'] {
    opacity: 1;
    pointer-events: auto;
  }
  .top-bar {
    position: relative;
    padding: 20px 40px;
    .icon-arrow-left {
      position: absolute;
      top: 50%;
      left: 20px;
      height: 24px;
      width: 24px;
      cursor: pointer;
      transform: translateY(-50%);
    }
  }
  .container {
    flex: 1;
    overflow-y: auto;
    .img-preview {
      width: 100%;
      min-width: 100%;
      margin-bottom: 0.5rem;
      cursor: pointer;
      max-height: 100%;
      object-fit: cover;
    }
  }
`,x=(0,m.Z)(e=>{var{icon:t,bgColor:r=g.r.colors.yellow50,highlightColor:l=g.r.colors.yellow800,message:n}=e,i=(0,u._)(e,["icon","bgColor","highlightColor","message"]);return a.createElement(b,Object.assign({bgColor:r,highlight:l},i),a.createElement(w,null,t&&a.createElement(v,null,t),a.createElement(E,{"data-has-icon":!!t},n)))})`
  margin-bottom: 16px;
  &.noti-bottom {
    border-left: none;
    margin-top: 4px;
    padding: 4px 8px;
    margin-left: 16px;
    margin-right: 16px;
    border-radius: 4px;
  }
`,ImagePreviewPopup=({className:e,style:t,authorName:r,images:l,onClose:n,onOpenSingleView:o,alt:m})=>{let{t:u}=(0,i.u)(),[g,d]=(0,a.useState)(!1);return(0,a.useEffect)(()=>{setTimeout(()=>{d(!0)},0)},[]),a.createElement(s.h,null,a.createElement(f,{className:e,style:t,"data-open":g},a.createElement("div",{className:"top-bar"},a.createElement("img",{className:"icon-arrow-left",src:p,onClick:n,alt:"go back",loading:"lazy"}),a.createElement(c.T,{size:"p2",weight:"bold",style:{textAlign:"center"}},u("previewPhotos.title",{name:r}))),a.createElement("div",{className:"container"},l.map((e,t)=>a.createElement("img",{className:"img-preview",key:t,src:e,onClick:()=>null==o?void 0:o(t),alt:m,loading:"lazy"})))),",")},k=m.Z.div`
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  display: flex;
  width: 100%;
  height: 100%;
  flex-direction: column;
  background: black;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s linear;
  &[data-open='true'] {
    opacity: 1;
    pointer-events: auto;
  }
`,I=m.Z.div`
  padding: 1rem;
  background: white;
  .icon-close {
    width: 26px;
    height: 26px;
    cursor: pointer;
  }
`,V=m.Z.div`
  position: relative;
  flex: 1;
  overflow: hidden;
  > img {
    height: 100%;
    width: 100%;
    object-fit: contain;
    object-position: center;
  }
`,C=m.Z.div`
  --inner-padding: max(16px, 20%);
  height: 100%;
  position: absolute;
  left: 0;
  padding: 8px;
  padding-right: var(--inner-padding);
  display: flex;
  align-items: center;
  top: 0;
  cursor: pointer;
  &[data-right] {
    padding-right: 8px;
    padding-left: var(--inner-padding);
    left: unset;
    right: 0;
  }
  &[data-disabled='true'] {
    cursor: not-allowed;
  }
`,P=m.Z.div`
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px;
  > img {
    width: 16px;
    height: 16px;
    &[data-disabled='true'] {
      opacity: 0.5;
    }
  }
  ${n.M.tdUp} {
    padding: 8px;
    > img {
      width: 30px;
      height: 30px;
    }
  }
`;var F="data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='17' fill='none'%3e%3cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.75' d='m6 12.813 4-4-4-4'/%3e%3c/svg%3e";let PostSingleImageViewPopup=({initialViewIndex:e,images:t,onClose:r,alt:l})=>{let[n,i]=(0,a.useState)(e),[o,c]=(0,a.useState)(!1);(0,a.useEffect)(()=>{setTimeout(()=>{c(!0)},0)},[]);let m=null==t?void 0:t[n],u=0===n,g=!(null==t?void 0:t.length)||n===(null==t?void 0:t.length)-1;return a.createElement(s.h,null,a.createElement(k,{"data-open":o&&!!m},a.createElement(I,null,a.createElement("img",{src:h,className:"icon-close",onClick:r,alt:"close",loading:"lazy"})),m&&n>=0&&a.createElement(a.Fragment,null,a.createElement(V,null,a.createElement("img",{className:"img-preview",src:m,alt:l,loading:"lazy"}),a.createElement(C,{"data-disabled":u,onClick:()=>!u&&i(n-1)},a.createElement(P,null,a.createElement("img",{src:F,style:{transform:"rotate(180deg)"},alt:"left arrow","data-disabled":u,loading:"lazy"}))),a.createElement(C,{"data-right":!0,"data-disabled":g,onClick:()=>!g&&i(n+1)},a.createElement(P,null,a.createElement("img",{src:F,alt:"right arrow","data-disabled":g,loading:"lazy"})))))))},D=(0,d.Z)(m.Z.div`
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.4);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  `,"hhgcomp-sensitivemask-inner"),M=m.Z.div``,H=m.Z.div`
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
  background: white;
  cursor: pointer;

  &,
  * {
    // transition: all 300ms;
    transform-origin: bottom left;
  }

  img {
    transition: none;
  }
  .img-preview {
    width: 100%;
  }
  &[data-is-blurred='true'] {
    .img-preview {
      /* Add the blur effect */
      -webkit-filter: blur(24px);
      filter: blur(24px);
    }
  }

  &[data-is-blurred='false'] {
    background: transparent;
    cursor: zoom-in;

    ${D.classSelector} {
      top: auto;
      right: auto;
      left: 8px;
      bottom: 8px;
      background: rgba(0, 0, 0, 0);
      align-items: flex-end;
      justify-content: flex-start;
    }
  }
`,SensitiveMask=({image:e,showIcon:t=!0})=>{let[r,l]=(0,a.useState)(!0);return a.createElement(H,{"data-is-blurred":r,onClick:e=>r&&e.stopPropagation()},a.createElement("img",{loading:"lazy",className:"img-preview",src:e}),a.createElement(D,{onClick:e=>{e.stopPropagation(),l(!r)}},t&&a.createElement(M,null,r?a.createElement("svg",{width:"22",height:"20",viewBox:"0 0 22 20",fill:"none"},a.createElement("path",{d:"M1.71 2.54a.996.996 0 0 1 0-1.41c.39-.39 1.03-.39 1.42 0l16.31 16.33a.996.996 0 1 1-1.41 1.41l-2.72-2.72c-1.34.52-2.79.82-4.31.82-5 0-9.27-3.11-11-7.5C.77 7.5 2.06 5.8 3.68 4.51zM16 9.47c0-2.76-2.24-5-5-5-.51 0-1 .1-1.47.24L7.36 2.54c1.15-.37 2.37-.57 3.64-.57 5 0 9.27 3.11 11 7.49-.69 1.76-1.79 3.3-3.18 4.53l-3.06-3.06c.14-.46.24-.95.24-1.46m-5 5c-2.76 0-5-2.24-5-5 0-.77.18-1.5.49-2.14L8.06 8.9c-.03.18-.06.37-.06.57 0 1.66 1.34 3 3 3 .2 0 .38-.03.57-.07l1.57 1.57c-.65.32-1.37.5-2.14.5m2.97-5.33a2.97 2.97 0 0 0-2.64-2.64z",fill:"#fff"})):a.createElement("svg",{width:"23",height:"16",viewBox:"0 0 23 16",fill:"none"},a.createElement("path",{d:"M12 0C5.142 0 1.886 5.879 1.096 7.557c-.132.28-.132.604 0 .884C1.886 10.121 5.142 16 12 16c6.834 0 10.092-5.837 10.896-7.54a1.08 1.08 0 0 0 0-.92C22.092 5.836 18.834 0 12 0m0 3a5 5 0 1 1-.001 10.001 5 5 0 0 1 0-10.001m0 2a3 3 0 1 0 0 6 3 3 0 0 0 0-6",fill:"#2D87F3"})))))},PostImagePreview=({className:e,images:t=[],style:r,authorName:s,isSensitive:c=!1,alt:m,positionAlert:u="top"})=>{let{data:{env:{isMarryBaby:g}}}=(0,a.useContext)(o.T),{t:d}=(0,i.u)(),h=`+ ${(t.length||0)-4}`,[p,b]=(0,a.useState)(!1),[w,E]=(0,a.useState)(-1),v=t.length>5,f=(0,a.useRef)(!1);return(0,a.useEffect)(()=>()=>{f.current&&(0,n.t)(!1)},[]),(0,a.useEffect)(()=>{p||w>=0?((0,n.t)(!0),f.current=!0):((0,n.t)(!1),f.current=!1)},[p,w]),a.createElement(a.Fragment,null,c&&"top"===u&&a.createElement(x,{message:d("sensitiveMask.contentWarningDescription"),icon:a.createElement("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none"},a.createElement("path",{d:"M9 .667A8.336 8.336 0 0 0 .667 9c0 4.6 3.733 8.333 8.333 8.333S17.333 13.6 17.333 9 13.6.667 9 .667m0 9.166A.836.836 0 0 1 8.167 9V5.667c0-.459.375-.834.833-.834s.833.375.833.834V9A.836.836 0 0 1 9 9.833M8.167 11.5v1.667h1.666V11.5z",fill:"#FE921D"}))}),a.createElement(y,{className:e,style:r,"data-image-count":v?5:t.length||0,"data-is-marrybaby":g,"data-cursor-pointer":!c},null==t?void 0:t.slice(0,5).map((e,t)=>{let r=4===t&&v;return a.createElement("div",{className:"img-wrapper",key:t,onClick:()=>{t>=4&&v?b(!0):E(t)}},c&&a.createElement(SensitiveMask,{image:e,showIcon:!r}),!g&&a.createElement("img",{loading:"lazy",className:"img-preview-blur",src:e,alt:m}),a.createElement("img",{loading:"lazy",className:"img-preview",src:e,alt:m}),r&&a.createElement("div",{className:"img-more-overlay"},a.createElement(l.H,{tag:"h1",as:"h2",color:"white"},h)))})),p&&a.createElement(ImagePreviewPopup,{authorName:s||"",images:t,onClose:()=>b(!1),onOpenSingleView:E,alt:m}),w>=0&&a.createElement(PostSingleImageViewPopup,{images:t,initialViewIndex:w,onClose:()=>E(-1),alt:m}),c&&"bottom"===u&&a.createElement(x,{message:d("sensitiveMask.contentWarningDescription.community"),className:"noti-bottom",icon:a.createElement("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none"},a.createElement("path",{d:"M9 .667A8.336 8.336 0 0 0 .667 9c0 4.6 3.733 8.333 8.333 8.333S17.333 13.6 17.333 9 13.6.667 9 .667m0 9.166A.836.836 0 0 1 8.167 9V5.667c0-.459.375-.834.833-.834s.833.375.833.834V9A.836.836 0 0 1 9 9.833M8.167 11.5v1.667h1.666V11.5z",fill:"#FE921D"}))}))}}}]);