2025-04-18 - frontend page-output output npm library

Output library

PageOutputMain

• use with object not have section

import { PageOutputMain } from "@frozengirls/page-output-output";
//provide props
     <PageOutputMain
                objId={menuConfigId}//objectId eg. formObjectEditId
                tableBody={menuConfig} //objConfig
                ElementComponent={ElementOutput} //output element component
                name={MENU_OUTPUT_SLICE_NAME}//reducer name from reduxStoreConsts file
     />
//recieve props
export const ElementOutput = ({
  elementIndex, //index of element eg. 0,1,2
  objId,//objectId eg. formObjectEditId
  elementId,//uuid of element 
  tableBody,//objConfig
  name
}) => {}

PageOutputSectionMain

• use with object have section

import { PageOutputMain } from "@frozengirls/page-output-output";
//provide props
  <PageOutputSectionMain
          objId={objId} //objectId eg. formObjectEditId
          tableBody={tableConfig} //objConfig
          sectionData={tableConfigUtils.sortResultData} //array of data 
          ElementComponent={sectionConfigs} //output element component but separate section type
          sectionConfigs={sectionConfigs}
          name={NAME} //reducer name from reduxStoreConsts file
          cssPrefixes={[]} //for send cssStyle
     />
//recieve props

export const ElementOutput = ({
  elementIndex, //index of element eg. 0,1,2
  objId,//objectId eg. formObjectEditId
  elementId,//uuid of element 
  tableBody,//objConfig
  name
}) => {}

///output element component for section pageoutput example
const sectionConfigs = {
  records: {
    elementOutputComponent: RecordElementOutput, // recordElementOutput
  },
  headerFooter: {
    elementOutputComponent: HeaderFooterElementOutput, // headerFooterElementOutput
  },
};