@korautils/forms
Version:
1 lines • 6.84 kB
Source Map (JSON)
{"version":3,"sources":["../src/modules/core/components/shared/TabsRenderer/styles.tsx","../src/modules/core/components/shared/TabsRenderer/TabsRenderer.tsx","../src/modules/core/components/shared/TabsRenderer/index.tsx"],"names":["TabCustom","styled","Tab","TabsRendererWrapper","CustomTabPanel","children","value","currentValue","props","jsx","Box","allProps","TabsRenderer","name","uuidv4","options","onChange","formHandler","ref","tabValue","watch","formState","state","handleChange","event","newValue","visibleOptions","item","jsxs","Fragment","Tabs","isArrayEmpty","index","createElement","TabsRenderer_default"],"mappings":"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","file":"TabsRenderer-RZDA6NEF.mjs","sourcesContent":["import { styled, Tab } from '@mui/material'\n\nexport const TabCustom:any = styled(Tab)``\n\nexport const TabsRendererWrapper:any = styled('div')`\n display: block;\n width: 100%;\n\n .MuiTabs-root {\n background-color: #f8f8f8;\n }\n`\n","import * as React from 'react'\nimport Tabs from '@mui/material/Tabs'\nimport { TabCustom, TabsRendererWrapper } from '@/modules/core/components/shared/TabsRenderer/styles'\nimport { Box } from '@mui/material'\nimport { FormHandlerProps } from '@/modules/builder/interfaces/elements/types'\nimport { isArrayEmpty, uuidv4 } from '@/modules/core/utils'\nimport { ItemOptionProps } from '@/modules/builder/interfaces/elements/components'\nimport { ChildrenElement } from '@/modules/builder/interfaces/general'\n\ninterface TabsValue {\n tabValue?: string\n}\n\ninterface Props {\n options?: Array<ItemOptionProps>\n name?: string\n value?: TabsValue\n onChange?: any\n formHandler?: FormHandlerProps\n}\n\ninterface TabPanelProps {\n children?: ChildrenElement\n currentValue?: string\n value: string\n}\n\nconst CustomTabPanel = ({\n children,\n value,\n currentValue,\n ...props\n}: TabPanelProps) => {\n const isActive = value === currentValue\n\n return (\n <div\n role=\"tabpanel\"\n style={{ display: isActive ? 'block' : 'none' }}\n id={`simple-tabpanel-${currentValue}`}\n aria-labelledby={`simple-tab-${currentValue}`}\n {...props}\n >\n <Box sx={{ padding: '10px 0' }}>{children as any}</Box>\n </div>\n )\n}\n\nconst allProps = (value: string) => {\n return {\n id: `simple-tab-${value}`,\n 'aria-controls': `simple-tabpanel-${value}`,\n value: value,\n }\n}\n\nconst TabsRenderer: React.FC<Props> = React.forwardRef(function Element(\n { name = uuidv4(), options = [], value = {}, onChange, formHandler = {} },\n ref: any\n) {\n const { tabValue = options?.[0]?.value } = value\n const { watch } = formHandler\n const formState = watch!()\n const state = watch!(name)\n\n const handleChange = React.useCallback(\n (event: any, newValue: string) => {\n onChange({\n target: {\n name: name,\n value: {\n ...state,\n tabValue: newValue,\n },\n },\n })\n },\n [name, onChange, state]\n )\n\n const visibleOptions = options.filter((item) => item.visible != false)\n\n return (\n <TabsRendererWrapper className=\"TabsRendererWrapper\" ref={ref}>\n <>\n <Tabs value={tabValue} onChange={handleChange}>\n {!isArrayEmpty(options) &&\n visibleOptions.map((item, index) => (\n <TabCustom\n label={item.label as any}\n {...allProps(item.value as string)}\n wrapped\n key={index}\n />\n ))}\n </Tabs>\n\n {!isArrayEmpty(visibleOptions) &&\n visibleOptions.map((item, index) => (\n <CustomTabPanel\n value={item.value as string}\n currentValue={tabValue}\n key={index}\n >\n {typeof item.children === 'string' && item.children}\n\n {React.isValidElement(item.children) &&\n React.cloneElement(item.children as any, {\n formHandler,\n parentName: name,\n })}\n </CustomTabPanel>\n ))}\n </>\n </TabsRendererWrapper>\n )\n})\n\nexport default React.memo(TabsRenderer)\n","import TabsRenderer from '@/modules/core/components/shared/TabsRenderer/TabsRenderer'\n\nexport default TabsRenderer\n"]}