@lanaco/lnc-react-ui/dist/DetailsView.cjs

React component library

"use strict";const o=require("react/jsx-runtime"),T=require("react"),x=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),D=require("./FlexGrid.cjs"),L=require("./FlexGridItem.cjs"),i=require("./utils-BK6B_Y9X.cjs"),w=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),W=require("./Button.cjs"),d=require("./IconButton.cjs"),A=x.styled.label`
  display: block;
  margin-bottom: 4px;
  ${e=>i.getComponentTypographyCss(e.theme,"FormField",e.size,"enabled")}
  color: ${e=>i.getColorRgbaValue(e.theme,"FormField",e.color,"enabled","text")};
`,k=T.forwardRef((e,c)=>{const{size:h="small",color:n="primary",className:l="",style:u={},children:b}=e,m=w.useTheme();return o.jsx(A,{theme:m,size:h,className:"lnc-ui-label "+l,style:u,color:n,ref:c,children:b})});k.defaultProps={style:{},size:"small",color:"primary"};const j=x.styled.div`
  display: flex;
  justify-content: space-between;
`,O=x.styled.div`
  display: flex;
  flex-direction: column;
  gap: 1rem;
  box-shadow: ${e=>i.getComponentPropValue(e.theme,"Popover",e.color,"enabled","boxShadow")};
  border-radius: ${e=>i.getBorderRadiusValueWithUnits(e.theme,e.borderRadius)};
  border-top: 1px solid rgba(0, 0, 0, 0.04);
  padding: 12px;
  background-color: ${e=>i.getColorRgbaValue(e.theme,"Popover","default","enabled","bg")};
`,C=T.forwardRef((e,c)=>{const{__TYPE__:h="DETAILS_VIEW",goToPreviousView:n,data:l={},fields:u={},flexGridProps:b,goBackText:m="Go back",showBack:P=!0,showNext:_=!0,showPrevious:q=!0,showEdit:g=!0,disableGoBack:v=!1,disableNext:E=!1,disablePrevious:F=!1,disableEdit:p=!1,editOnTop:y=!1,goToNext:R=()=>{},goToPrevious:V=()=>{},onEdit:f=()=>{},goBack:B=()=>{},className:I="",color:t="primary",size:r="small",children:N,...S}=e,G=w.useTheme(),$=(s,a)=>{n&&n(),B(s,a)},z=()=>o.jsx(o.Fragment,{children:N||o.jsx(D,{spacing:10,...b,children:u.map((s,a)=>o.jsxs(L,{...s,children:[o.jsxs(k,{color:t,size:r,children:[s.label,":"]},a),l[s.accessor]]},a))})});return o.jsxs(O,{ref:c,theme:G,color:t,borderRadius:"regular",className:I,...S,children:[o.jsxs(j,{children:[P&&o.jsx(W,{leadingIcon:"arrow-circle-left",text:m,btnType:"outline",style:{width:"fit-content"},onClick:s=>$(s,l),disabled:v,color:t,size:r},0),g&&y&&o.jsx(d,{btnType:"outline",icon:"pen",disabled:p,onClick:s=>f(l,s),color:t,size:r})]}),z(),o.jsxs(j,{children:[o.jsxs("div",{children:[_&&o.jsxs(o.Fragment,{children:[o.jsx(d,{btnType:"outline",icon:"angle-left",disabled:F,onClick:s=>V(l,s),color:t,size:r}),"  "]}),q&&o.jsx(d,{btnType:"outline",icon:"angle-right",disabled:E,onClick:s=>R(l,s),color:t,size:r})]}),g&&!y&&o.jsx(d,{btnType:"outline",icon:"pen",disabled:p,onClick:s=>f(l,s),color:t,size:r})]})]})});C.displayName="DETAILS_VIEW";module.exports=C;