forstok-ui-lib 5.0.0 → 5.0.1

package/dist/index.mjs

@@ -632,7 +632,32 @@ import e,{useState as t,useEffect as n,useRef as r,useLayoutEffect as i,isValidE
   ${({$width:e})=>{if(e)return l` 
         max-width: ${e};
       `}}  
-`;let Gi;const Vi=e=>{var{children:t,body:i,mode:s,height:l,width:c,isOpen:h,evTooglePopup:u}=e,p=d(e,["children","body","mode","height","width","isOpen","evTooglePopup"]);const[f,m]=Ce.useStateWithCallbackLazy(!1),A=r(null),g=o((e=>{Gi=setTimeout((()=>{m(e,(()=>{const e=A&&A.current?A.current:null;e&&(e.scrollTop=0)})),clearTimeout(Gi)}),1)}),[m]),B=r({init:()=>{g(h)}});n((()=>{const{init:e}=B.current;return e(),()=>{clearTimeout(Gi)}}),[]),n((()=>{g(h)}),[h,g]);let b=[...t];const C=(null==b?void 0:b.filter((e=>a(e)&&"head"===e.props["aria-label"])))||null,x=(null==b?void 0:b.filter((e=>a(e)&&"sub-head"===e.props["aria-label"])))||null,w=(null==b?void 0:b.filter((e=>a(e)&&"body"===e.props["aria-label"])))||null,v=(null==b?void 0:b.filter((e=>a(e)&&"foot"===e.props["aria-label"])))||null,y=(null==b?void 0:b.filter((e=>a(e)&&"left-foot"===e.props["aria-label"])))||null,k=x.length?F.jsx("aside",{children:x[0]&&a(x[0])?x[0].props.children:null}):null,E=C.length&&C[0]&&a(C[0])?C[0].props["data-qa-id"]:"";return F.jsxs(ji,{$isOpen:h,children:[F.jsx(Mi,{}),F.jsx(zi,Object.assign({ref:A},p["data-qa-id"]&&{"data-qa-id":p["data-qa-id"]},{children:"question"===s?F.jsx(Xi,{$isOpen:f,children:F.jsxs(Hi,{$width:c,children:[F.jsx(oe,{$name:"warning",$width:"30px"}),F.jsxs(Yi,{$mode:s,children:[C.length?F.jsx(Wi,{children:C[0]&&a(C[0])?C[0].props.children:null}):null,k,v.length?F.jsx(Ui,{children:v[0]&&a(v[0])?F.jsx("aside",{"data-type":v[0].props.type||"",children:v[0].props.children}):null}):null]})]})}):F.jsxs(F.Fragment,{children:[F.jsx(Yi,{$width:c,$isOpen:f,$mode:s,children:C.length?F.jsxs(F.Fragment,{children:[F.jsx(K,{$mode:"round-close",onClick:u}),F.jsx(Wi,{"data-qa-id":E,children:C[0]&&a(C[0])&&C[0].props.children})]}):null}),F.jsxs(Xi,{$width:c,$isOpen:f,$withHeader:!!C.length,children:[k,w.length?F.jsx(Qi,{$mode:i,$width:c,$height:l,children:w[0]&&a(w[0])&&w[0].props.children}):null,v.length?F.jsxs(Ui,{$isLeft:!!y.length,children:[F.jsx("aside",{children:y&&y.length&&y[0]&&a(y[0])?y[0].props.children:null}),v[0]&&a(v[0])?F.jsxs("aside",{"data-type":v[0].props.type||"",children:[s&&"info"===s?F.jsx(K,{$mode:"white",$size:"small",onClick:u,children:"Close"}):F.jsx(K,{$mode:"white",$size:"small",onClick:u,"data-qa-id":"popup-button-cancel",children:"Cancel"}),v[0].props.children]}):null]}):null]})]})}))]})},Ri=s.section`
+`;let Gi;const Vi=e=>{var{children:t,body:i,mode:s,height:l,width:c,isOpen:h,evTooglePopup:u}=e,p=d(e,["children","body","mode","height","width","isOpen","evTooglePopup"]);const[f,m]=Ce.useStateWithCallbackLazy(!1),A=r(null),g=o((e=>{Gi=setTimeout((()=>{m(e,(()=>{const e=A&&A.current?A.current:null;e&&(e.scrollTop=0)})),clearTimeout(Gi)}),1)}),[m]),B=r({init:()=>{g(h)}});n((()=>{const{init:e}=B.current;return e(),()=>{clearTimeout(Gi)}}),[]),n((()=>{g(h)}),[h,g]);let b=[...t];const C=(null==b?void 0:b.filter((e=>a(e)&&"head"===e.props["aria-label"])))||null,x=(null==b?void 0:b.filter((e=>a(e)&&"sub-head"===e.props["aria-label"])))||null,w=(null==b?void 0:b.filter((e=>a(e)&&"body"===e.props["aria-label"])))||null,v=(null==b?void 0:b.filter((e=>a(e)&&"foot"===e.props["aria-label"])))||null,y=(null==b?void 0:b.filter((e=>a(e)&&"left-foot"===e.props["aria-label"])))||null,k=x.length?F.jsx("aside",{children:x[0]&&a(x[0])?x[0].props.children:null}):null,E=C.length&&C[0]&&a(C[0])?C[0].props["data-qa-id"]:"";return F.jsxs(ji,{$isOpen:h,children:[F.jsx(Mi,{}),F.jsx(zi,Object.assign({ref:A},p["data-qa-id"]&&{"data-qa-id":p["data-qa-id"]},{children:"question"===s?F.jsx(Xi,{$isOpen:f,children:F.jsxs(Hi,{$width:c,children:[F.jsx(oe,{$name:"warning",$width:"30px"}),F.jsxs(Yi,{$mode:s,children:[C.length?F.jsx(Wi,{children:C[0]&&a(C[0])?C[0].props.children:null}):null,k,v.length?F.jsx(Ui,{children:v[0]&&a(v[0])?F.jsx("aside",{"data-type":v[0].props.type||"",children:v[0].props.children}):null}):null]})]})}):F.jsxs(F.Fragment,{children:[F.jsx(Yi,{$width:c,$isOpen:f,$mode:s,children:C.length?F.jsxs(F.Fragment,{children:[F.jsx(K,{$mode:"round-close",onClick:u}),F.jsx(Wi,{"data-qa-id":E,children:C[0]&&a(C[0])&&C[0].props.children})]}):null}),F.jsxs(Xi,{$width:c,$isOpen:f,$withHeader:!!C.length,children:[k,w.length?F.jsx(Qi,{$mode:i,$width:c,$height:l,children:w[0]&&a(w[0])&&w[0].props.children}):null,v.length?F.jsxs(Ui,{$isLeft:!!y.length,children:[F.jsx("aside",{children:y&&y.length&&y[0]&&a(y[0])?y[0].props.children:null}),v[0]&&a(v[0])?F.jsxs("aside",{"data-type":v[0].props.type||"",children:[s&&"info"===s?F.jsx(K,{$mode:"white",$size:"small",onClick:u,children:"Close"}):F.jsx(K,{$mode:"white",$size:"small",onClick:u,"data-qa-id":"popup-button-cancel",children:"Cancel"}),v[0].props.children]}):null]}):null]})]})}))]})},Ri=l`
+  display: grid;
+  grid-row-gap: 12px;
+  grid-column-gap: 16px;
+  width: 100%;
+  margin-bottom: 12px;
+  align-items: start;
+`,Ji=s.form.attrs((e=>({name:e.name||"form",autoComplete:e.autoComplete||"off"})))`
+  display: inline-grid;
+  grid-auto-flow: row;
+  grid-gap: 25px;
+  width: 100%;
+  height: 100%;
+  [class*='singleValue'] {
+    width: 100%;
+    color: var(--inp-clr);
+    ._refLabel {
+      top: 5.5px;
+      right: 0;
+    }
+  }
+  ${({name:e})=>{let t="";return"invoiceForm"===e&&(t+="\n      grid-gap: 15px;\n    "),t}}
+`,Ki=s.section`
+  ${Ri}
+  ${({$width:e})=>{let t="";return e&&(t+=` \n      @media (min-width: 768px) {\n        width: ${e}; \n      }\n    `),t}}
+`,Zi=s.section`
   position: relative;
   height: 100%;
   padding-top: 20px;
@@ -647,12 +672,12 @@ import e,{useState as t,useEffect as n,useRef as r,useLayoutEffect as i,isValidE
     padding: 20px 2em 0;
     height: 100%;
   }
-`,Ji=s.section`
+`,$i=s.section`
   position: relative;
   &:first-child {
     margin-top: -4px;
   }
-`,Ki=s.section` 
+`,_i=s.section` 
   ${v}
   position: relative;
   min-height: 1px;
@@ -665,7 +690,7 @@ import e,{useState as t,useEffect as n,useRef as r,useLayoutEffect as i,isValidE
   ${({$mode:e})=>{if("full"===e)return l` 
         width: 100%; 
       `}}
-`,Zi=s.h1`
+`,ea=s.h1`
   font-family: PT Sans;
   font-size: 22px;
   color: var(--ter-clr);
@@ -682,7 +707,7 @@ import e,{useState as t,useEffect as n,useRef as r,useLayoutEffect as i,isValidE
       display: inline !important;
     }
   }
-`,$i=s.aside` 
+`,ta=s.aside` 
   display: grid;
   grid-auto-flow: column;
   grid-gap: 8px;
@@ -699,7 +724,7 @@ import e,{useState as t,useEffect as n,useRef as r,useLayoutEffect as i,isValidE
   @media only screen and (min-width: 1366px) {
     right: 20px;
   }
-`,_i=s.section`
+`,na=s.section`
   width: 100%;
   ${({$mode:e})=>"master-listing"===e?l` 
         padding: 0 16px;
@@ -711,7 +736,7 @@ import e,{useState as t,useEffect as n,useRef as r,useLayoutEffect as i,isValidE
           padding-top: 12px; 
         }
       `:void 0}
-`,ea=s.div`
+`,ra=s.div`
   padding-top: 16px;
   &._refNoTab {
     padding-top: 9px;
@@ -723,7 +748,7 @@ import e,{useState as t,useEffect as n,useRef as r,useLayoutEffect as i,isValidE
     padding-top: 24px;
   }
   ${({$mode:e})=>{let t="";return"list"===e?t+=" \n      min-height: 750px;\n      @media only screen and (min-width: 1280px) {\n        min-height: 600px;\n      }\n    ":"clear"===e&&(t+="\n      padding-top: 9px;\n      @media only screen and (min-width: 768px) {\n        padding-top: 11px;\n      }\n    "),t}}
-`,ta=s.section`
+`,ia=s.section`
   position: relative;
   > section, 
   > article {
@@ -737,7 +762,7 @@ import e,{useState as t,useEffect as n,useRef as r,useLayoutEffect as i,isValidE
   > article {
     height: calc(100vh - 50px);
   }
-`,na=s.div`
+`,aa=s.div`
   display: inline-grid;
   grid-auto-flow: column;
   grid-template-columns: minmax(140px, 150px) minmax(140px, 1fr);
@@ -757,5 +782,5 @@ import e,{useState as t,useEffect as n,useRef as r,useLayoutEffect as i,isValidE
     overflow-wrap: break-word;
     word-break: break-word;
   }
-`;export{K as ButtonComponent,G as CheckboxComponent,Be as DropdownComponent,ta as FoContainer,$i as HeaderContainer,oe as IconComponent,na as InfoGroup,Y as InputComponent,ee as LabelComponent,M as LinkComponent,Ji as ListContainer,re as LoadingComponent,Se as MessageComponent,qi as MessageQuestionComponent,Ri as PanelContainer,Ki as PanelWrapper,Vi as PopupComponent,se as ReactPortalComponent,_i as TabsContainer,ea as TabsContent,x as TextComponent,Zi as Title,D as boxBase,w as clearList,I as dropBase,y as elipsis,L as formLabel,S as headTable,k as multiElipsis,v as responseWidth,E as thirdElipsis};
+`;export{K as ButtonComponent,G as CheckboxComponent,Be as DropdownComponent,ia as FoContainer,Ji as FormContainer,ta as HeaderContainer,oe as IconComponent,aa as InfoGroup,Y as InputComponent,ee as LabelComponent,M as LinkComponent,$i as ListContainer,re as LoadingComponent,Se as MessageComponent,qi as MessageQuestionComponent,Zi as PanelContainer,_i as PanelWrapper,Vi as PopupComponent,se as ReactPortalComponent,Ki as SingleFormContainer,na as TabsContainer,ra as TabsContent,x as TextComponent,ea as Title,D as boxBase,w as clearList,I as dropBase,y as elipsis,L as formLabel,S as headTable,k as multiElipsis,v as responseWidth,E as thirdElipsis};
 //# sourceMappingURL=index.mjs.map