diff --git a/src/Components/UI/Organisms/FancyBoxSet/FancyBoxSet.tsx b/src/Components/UI/Organisms/FancyBoxSet/FancyBoxSet.tsx index 95d134eea..21d9278e3 100644 --- a/src/Components/UI/Organisms/FancyBoxSet/FancyBoxSet.tsx +++ b/src/Components/UI/Organisms/FancyBoxSet/FancyBoxSet.tsx @@ -3,26 +3,37 @@ import React from 'react'; import { Fieldset } from '@/Components/UI/Molecules/Fieldset'; import { FancyListBox } from '@/Components/UI/Molecules/FancyListBox'; import { FancyLine } from '@/Components/UI/Atoms/FancyLine'; +import { TLayer } from '../../Interface/TLayer'; type TFieldSetProps = React.ComponentProps; type TFancyListProps = React.ComponentProps; -type TFancyBoxSet = TFieldSetProps & TFancyListProps; +type TFancyBoxSet = TFieldSetProps & TFancyListProps & { displayLine?: boolean }; +// --------------------------------------------------------------------------- // +// ----- The FancyBoxSet to render the ListBox with a Fieldset and a Line ---- // +// --------------------------------------------------------------------------- // export default function FancyBoxSet(props: TFancyBoxSet) { - const { label, alignLabel, fontVariantLegend, disabled, children, ...HTMLProps } = props; + const { label, alignLabel, fontVariantLegend, disabled, children, themeType, displayLine, layer, ...HTMLProps } = props; + // is needed to get the length of the children for displaying the line const childArray = React.Children.toArray(children); return (
- + {childArray.map((child, i) => ( <> {child} - {childArray.length - 1 !== i && } + {!displayLine && childArray.length - 1 !== i && ( + + )} ))}
); } + +FancyBoxSet.defaultProps = { + layer: 1, +};