Enabling Sections to control open-state

Author: FalkWolsky

client/packages/lowcoder-design/src/components/Section.tsx

@@ -75,6 +75,7 @@ const ShowChildren = styled.div<{ $show?: string; $noMargin?: boolean }>`
 
 interface ISectionConfig<T> {
   name?: string;
+  open?: boolean;
   width?: number;
   noMargin?: boolean;
   style?: React.CSSProperties;
@@ -103,7 +104,9 @@ export const PropertySectionContext = React.createContext<PropertySectionContext
 export const BaseSection = (props: ISectionConfig<ReactNode>) => {
   const { name } = props;
   const { compName, state, toggle } = useContext(PropertySectionContext);
-  const open = name ? state[compName]?.[name] !== false : true;
+  const open = props.open !== undefined ? props.open : name ? state[compName]?.[name] !== false : true;
+
+  console.log("open", open, props.open);
 
   const handleToggle = () => {
     if (!name) {

client/packages/lowcoder/src/comps/comps/numberInputComp/sliderComp.tsx

@@ -33,6 +33,7 @@ const SliderBasicComp = (function () {
             value={props.value.value}
             $style={props.style}
             style={{margin: 0}}
+            // FALK TODO : vertical={true}
             onChange={(e) => {
               props.value.onChange(e);
               props.onEvent("change");

client/packages/lowcoder/src/comps/comps/numberInputComp/sliderCompConstants.tsx

@@ -49,6 +49,7 @@ export const SliderStyled = styled(Slider)<{ $style: SliderStyleType }>`
   ${(props) => props.$style && getStyle(props.$style)}
 `;
 
+// Falk TODO: height: 300px;
 export const SliderWrapper = styled.div`
   width: 100%;
   display: inline-flex;

client/packages/lowcoder/src/comps/comps/tabs/tabbedContainerComp.tsx

@@ -256,6 +256,7 @@ const TabbedContainer = (props: TabbedContainerProps) => {
   return (
     <div style={{padding: props.style.margin, height: '100%'}}>
     <StyledTabs
+      // FALK: TODO tabPosition="right"
       activeKey={activeKey}
       $style={style}
       $headerStyle={headerStyle}