@heliux-org/design-system-core 0.0.399 → 0.0.400

package/src/components/Sidebar/__stories__/Sidebar.stories.tsx

@@ -45,7 +45,7 @@ export const Overview = {
           onClick={close}
         >
           <SidebarHeader closeSidebar={close} />
-          <SidebarMenuItem active={true} link="/" text="Dashboard" iconPath="ic_view_layout_grid_16" showCounter={true} count={5}/>
+          <SidebarMenuItem active={true} link="/" text="Dashboard" iconPath="ic_view_layout_grid_16" showCounter={true} count={5} />
           <SectionLabel iconPath="ic_view_cube_16" text={"Product OS"} />
           <SidebarMenuItem link="/" text="Files" />
           <SidebarMenuItem link="/" text="Releases" />
@@ -98,21 +98,21 @@ export const Menu = {
             text="Menu Item with Icon"
             iconPath="ic_view_cube_16"
             active={true}
-            onClick={() => {}}
+            onClick={() => { }}
           />
 
           <SidebarMenuItem
             text="Menu Item with Counter"
             iconPath="ic_view_layout_grid_16"
-            showCounter={true} 
+            showCounter={true}
             count={5}
-            onClick={() => {}}
+            onClick={() => { }}
           />
 
           <SidebarMenuItem
             text="Regular Menu Item"
             iconPath="ic_buildings_16"
-            onClick={() => {}}
+            onClick={() => { }}
           />
         </div>
 
@@ -124,7 +124,7 @@ export const Menu = {
             iconPath="ic_view_cube_16"
             active={true}
             isCollapsed={true}
-            onClick={() => {}}
+            onClick={() => { }}
           />
 
           <SidebarMenuItem
@@ -133,35 +133,35 @@ export const Menu = {
             showCounter={true}
             count={5}
             isCollapsed={true}
-            onClick={() => {}}
+            onClick={() => { }}
           />
 
           <SidebarMenuItem
             text="Regular Menu Item"
             iconPath="ic_buildings_16"
             isCollapsed={true}
-            onClick={() => {}}
+            onClick={() => { }}
           />
         </div>
 
         {/* Adding new MenuGroup examples */}
         <div>
           <Text type={Text.types.TEXT1} weight={Text.weights.MEDIUM}>Menu Groups</Text>
-          
+
           {/* Expanded MenuGroup */}
           <div style={{ marginBottom: '24px' }}>
             <Text type={Text.types.TEXT2}>Expanded</Text>
-            <SidebarMenuGroup 
-              text="Libraries" 
+            <SidebarMenuGroup
+              text="Libraries"
               iconPath="ic_view_cube_16"
               defaultExpanded={true}
             >
-              <SidebarMenuItem 
+              <SidebarMenuItem
                 text="Suppliers"
                 iconPath="ic_buildings_16"
                 link="/"
               />
-              <SidebarMenuItem 
+              <SidebarMenuItem
                 text="Purchase Requests"
                 iconPath="ic_buildings_16"
                 link="/"
@@ -172,19 +172,19 @@ export const Menu = {
           {/* Collapsed MenuGroup */}
           <div>
             <Text type={Text.types.TEXT2}>Collapsed</Text>
-            <SidebarMenuGroup 
-              text="Libraries" 
+            <SidebarMenuGroup
+              text="Libraries"
               iconPath="ic_view_cube_16"
               isCollapsed={true}
               defaultExpanded={true}
             >
-              <SidebarMenuItem 
+              <SidebarMenuItem
                 text="Suppliers"
                 iconPath="ic_buildings_16"
                 link="/"
                 isCollapsed={true}
               />
-              <SidebarMenuItem 
+              <SidebarMenuItem
                 text="Purchase Requests"
                 iconPath="ic_buildings_16"
                 link="/"
@@ -205,7 +205,7 @@ export const Menu = {
               ariaLabel={isCollapsed ? "Expand menu" : "Collapse menu"}
             />
           </div>
-          
+
           <div style={{ display: 'flex', gap: '32px' }}>
             {/* Existing interactive MenuItem */}
             <div>
@@ -215,26 +215,26 @@ export const Menu = {
                 iconPath="ic_view_cube_16"
                 active={true}
                 isCollapsed={isCollapsed}
-                onClick={() => {}}
+                onClick={() => { }}
               />
             </div>
 
             {/* New interactive MenuGroup */}
             <div>
               <Text type={Text.types.TEXT2}>Menu Group</Text>
-              <SidebarMenuGroup 
-                text="Libraries" 
+              <SidebarMenuGroup
+                text="Libraries"
                 iconPath="ic_view_cube_16"
                 isCollapsed={isCollapsed}
                 defaultExpanded={true}
               >
-                <SidebarMenuItem 
+                <SidebarMenuItem
                   text="Suppliers"
                   iconPath="ic_buildings_16"
                   link="/"
                   isCollapsed={isCollapsed}
                 />
-                <SidebarMenuItem 
+                <SidebarMenuItem
                   text="Purchase Requests"
                   iconPath="ic_buildings_16"
                   link="/"
@@ -274,12 +274,12 @@ export const MenuGroup = {
           onClick={close}
         >
           <SidebarHeader closeSidebar={close} />
-          <SidebarMenuItem indentLevel={1} active={true} link="/" text="Dashboard" showCounter={true} count={5}/>
-          <SidebarMenuItem indentLevel={1}  active={true} link="/" text="Dashboard" iconPath="ic_view_layout_grid_16" showCounter={true} count={5}/>
+          <SidebarMenuItem indentLevel={1} active={true} link="/" text="Dashboard" showCounter={true} count={5} />
+          <SidebarMenuItem indentLevel={1} active={true} link="/" text="Dashboard" iconPath="ic_view_layout_grid_16" showCounter={true} count={5} />
           <SectionLabel iconPath="ic_view_cube_16" text={"Product OS"} />
           <SidebarMenuItem indentLevel={1} link="/" text="Files" />
           <SidebarMenuItem indentLevel={1} link="/" text="Releases" />
-          <SidebarMenuGroup indentLevel={1}  text="Open Me"onClick={(event) => {console.log("Group clicked", event);}} defaultExpanded={false}>
+          <SidebarMenuGroup indentLevel={1} text="Open Me" onClick={(event) => { console.log("Group clicked", event); }} defaultExpanded={false}>
             <SidebarMenuItem indentLevel={2} link="/" text="Suppliers" />
             <SidebarMenuItem indentLevel={2} link="/" text="Purchase Requests" />
             <SidebarMenuItem indentLevel={2} link="/" text="RFQs" />
@@ -330,19 +330,21 @@ export const NewSidebar = {
 
     return (
       <div style={{ height: "800px", width: "900px", background: "var(--surface-gradient-bg", position: "relative" }}>
-        <PanelLayout 
+        <PanelLayout
           showLeftSide={isOpen}
           leftPanelDefaultSize={isCollapsed ? 5 : 20}
-          leftPanelMinSize={isCollapsed ? 5 : 15}
-          leftPanelCollapsedSize={5}
+          leftPanelMinSize={isCollapsed ? 5 : 20}
+          leftPanelMaxSize={isCollapsed ? 5 : 20}
           leftOverlay={false}
           isCollapsed={isCollapsed}
+          onLeftPanelCollapse={() => setIsCollapsed(true)}
+          onLeftPanelExpand={() => setIsCollapsed(false)}
           leftSide={
-            <div 
-              ref={sidebarRef} 
-              style={{ 
-                height: '100%', 
-                display: 'flex', 
+            <div
+              ref={sidebarRef}
+              style={{
+                height: '100%',
+                display: 'flex',
                 flexDirection: 'column',
                 width: isCollapsed ? '40px' : '100%',
                 transition: 'width 0.3s ease-in-out',
@@ -350,65 +352,65 @@ export const NewSidebar = {
               }}
             >
               <div>
-                <SidebarHeader 
-                  closeSidebar={close} 
+                <SidebarHeader
+                  closeSidebar={close}
                   showCloseButton={false}
                   isCollapsed={isCollapsed}
                 />
               </div>
-              
+
               <div style={{ flex: 1 }}>
-                <SidebarMenuItem 
-                  indentLevel={1} 
-                  active={true} 
-                  link="/" 
-                  text="Dashboard" 
-                  iconPath="ic_view_layout_grid_16" 
-                  showCounter={true} 
+                <SidebarMenuItem
+                  indentLevel={1}
+                  active={true}
+                  link="/"
+                  text="Dashboard"
+                  iconPath="ic_view_layout_grid_16"
+                  showCounter={true}
                   count={5}
                   isCollapsed={isCollapsed}
                 />
-                <SidebarMenuItem 
-                  indentLevel={1} 
-                  link="/" 
-                  text="Files" 
+                <SidebarMenuItem
+                  indentLevel={1}
+                  link="/"
+                  text="Files"
                   iconPath="ic_view_cube_16"
                   isCollapsed={isCollapsed}
                 />
-                <SidebarMenuItem 
-                  indentLevel={1} 
-                  link="/" 
-                  text="Releases" 
+                <SidebarMenuItem
+                  indentLevel={1}
+                  link="/"
+                  text="Releases"
                   iconPath="ic_view_layout_grid_16"
                   isCollapsed={isCollapsed}
                 />
-                <SectionLabel 
-                  text={isCollapsed ? "" : "Libraries"} 
+                <SectionLabel
+                  text={isCollapsed ? "" : "Libraries"}
                 />
-                <SidebarMenuGroup 
-                  indentLevel={1} 
-                  text="Open Me" 
+                <SidebarMenuGroup
+                  indentLevel={1}
+                  text="Open Me"
                   iconPath="ic_view_cube_16"
-                  onClick={(event) => {console.log("Group clicked", event);}} 
+                  onClick={(event) => { console.log("Group clicked", event); }}
                   defaultExpanded={true}
                   isCollapsed={isCollapsed}
                 >
-                  <SidebarMenuItem 
-                    indentLevel={2} 
-                    link="/" 
+                  <SidebarMenuItem
+                    indentLevel={2}
+                    link="/"
                     text="Suppliers"
                     iconPath="ic_buildings_16"
                     isCollapsed={isCollapsed}
                   />
-                  <SidebarMenuItem 
-                    indentLevel={3} 
-                    link="/" 
+                  <SidebarMenuItem
+                    indentLevel={3}
+                    link="/"
                     text="Files"
                     isCollapsed={isCollapsed}
                   />
-                  <SidebarMenuItem 
-                    indentLevel={2} 
-                    link="/" 
+                  <SidebarMenuItem
+                    indentLevel={2}
+                    link="/"
                     text="Purchase Requests"
                     iconPath="ic_buildings_16"
                     isCollapsed={isCollapsed}

package/src/components/index.ts

@@ -42,7 +42,7 @@ export { default as DropdownSingleValue } from "./Dropdown/components/singleValu
 export { default as ProcessingToast } from "./ProcessingToast/ProcessingToast";
 export { default as Toast } from "./Toast/Toast";
 export { default as ToastContainer } from "./Toast/Toast";
-export { default as ToastProps }  from "./Toast/Toast";
+export { default as ToastProps } from "./Toast/Toast";
 export { default as ToastButton } from "./Toast/ToastButton/ToastButton";
 export { default as ToastLink } from "./Toast/ToastLink/ToastLink";
 export { default as AttentionBoxLink } from "./AttentionBox/AttentionBoxLink/AttentionBoxLink";
@@ -171,7 +171,7 @@ export { DEFAULT_NUMBER_OF_COLORS_IN_LINE, COLOR_SIZES, COLOR_PADDING, DIALOG_WI
 export { ComboboxOptionIconType } from "./Combobox/components/ComboboxConstants";
 export { CounterColor, CounterType, CounterSize } from "./Counter/CounterConstants";
 export { Moment, Direction, FocusInput, RangeDate } from "./DatePicker/types";
-export { YEAR_FORMAT, MONTH_FORMAT, DAY_SIZE, WEEK_FIRST_DAY}  from "./DatePicker/constants";
+export { YEAR_FORMAT, MONTH_FORMAT, DAY_SIZE, WEEK_FIRST_DAY } from "./DatePicker/constants";
 export { DialogSize, DialogType } from "./DialogContentContainer/DialogContentContainerConstants";
 export { DirectionType, ColorType } from "./Divider/DividerConstants";
 export * from "./Dropdown/DropdownConstants";
@@ -205,8 +205,8 @@ export * from "./SplitButton/SplitButtonConstants";
 export * from "./Steps/StepsConstants";
 export * from "./Tabs/TabPanels/TabPanelsConstants";
 export * from "./Text/TextConstants";
-export { TextAreaFieldAriaLabel, TextAreaFieldFeedbackState} from "./TextAreaField/TextAreaFieldConstants";
-export { TextFieldAriaLabel, TextFieldFeedbackState, TextFieldSize, TextFieldTextType} from "./TextField/TextFieldConstants";
+export { TextAreaFieldAriaLabel, TextAreaFieldFeedbackState } from "./TextAreaField/TextAreaFieldConstants";
+export { TextFieldAriaLabel, TextFieldFeedbackState, TextFieldSize, TextFieldTextType } from "./TextField/TextFieldConstants";
 export { SystemTheme, ThemeColor, Theme } from "./ThemeProvider/ThemeProviderConstants";
 export * from "./Tipseen/TipseenConstants";
 export * from "./Toast/ToastConstants";
@@ -214,7 +214,7 @@ export * from "./ProcessingToast/ProcessingToastConstants";
 export * from "./Toggle/ToggleConstants";
 export * from "./Tooltip/TooltipConstants";
 export * from "./Typography/TypographyConstants";
-export {EMPTY_ARR as EMPTY_ARR_ANY} from "../constants/common";
+export { EMPTY_ARR as EMPTY_ARR_ANY } from "../constants/common";
 export * from "../constants/dialog";
 export * from "../constants/keyCodes";
 export * from "../constants/positions";
@@ -229,20 +229,20 @@ export { default as TablePaginator } from "./Table/TablePaginator";
 export { TablePaginatorProps } from "./Table/TablePaginator";
 export { default as ActionColumn } from "./Table/columns/actionColumn";
 export { default as TableRowMemoized } from "./Table/TableRowMemoized";
-export {default as NewTableHeader} from './NewTable/components/TableHeader/TableHeader';
-export {default as TableHead} from './NewTable/components/TableHead/TableHead';
-export {default as TableBody} from './NewTable/components/TableBody/TableBody';
-export {default as Row} from './NewTable/components/Row/Row';
-export {default as HeaderRow} from './NewTable/components/Row/HeaderRow/HeaderRow';
-export {default as RowCellChildren} from './NewTable/components/Row/RowCellChildren';
-export {default as ExpandedContent} from './NewTable/components/ExpandedContent/ExpandedContent';
-export {default as HeaderCell} from './NewTable/components/Cell/HeaderCell/HeaderCell';
-export {default as Cell} from './NewTable/components/Cell/Cell';
-export {default as NewTable} from './NewTable/Table';
+export { default as NewTableHeader } from './NewTable/components/TableHeader/TableHeader';
+export { default as TableHead } from './NewTable/components/TableHead/TableHead';
+export { default as TableBody } from './NewTable/components/TableBody/TableBody';
+export { default as Row } from './NewTable/components/Row/Row';
+export { default as HeaderRow } from './NewTable/components/Row/HeaderRow/HeaderRow';
+export { default as RowCellChildren } from './NewTable/components/Row/RowCellChildren';
+export { default as ExpandedContent } from './NewTable/components/ExpandedContent/ExpandedContent';
+export { default as HeaderCell } from './NewTable/components/Cell/HeaderCell/HeaderCell';
+export { default as Cell } from './NewTable/components/Cell/Cell';
+export { default as NewTable } from './NewTable/Table';
 export type { LeafyGreenTableCell, LGRowData } from './NewTable/components/useLeafyGreenTable/useLeafyGreenTable.types';
 export { LeafyGreenTableRow } from './NewTable/components/useLeafyGreenTable/useLeafyGreenTable.types';
 export type { TableProps as NewTableProps } from './NewTable/Table.types';
-export {default as useLeafyGreenTable} from './NewTable/components/useLeafyGreenTable/useLeafyGreenTable';
+export { default as useLeafyGreenTable } from './NewTable/components/useLeafyGreenTable/useLeafyGreenTable';
 export { default as TipseenMedia } from "./Tipseen/TipseenMedia/TipseenMedia";
 export { default as ThemeProvider } from "./ThemeProvider/ThemeProvider";
 export { default as EditableText } from "./EditableText/EditableText";
@@ -295,7 +295,7 @@ export { default as NumericField } from "./NumericField/NumericField";
 export { Uploader, BasicUploader } from "./Uploader/Uploader";
 export { Comments, CommentForm, Comment, CommentFormProps, CommentProps, CommentsProps, UserCard, User } from "./Comments/Comments";
 export { DropdownMenu as TableDropdownMenu } from "./Table/new/DropdownMenu/DropdownMenu";
-export type {PathName} from "./Icon/SvgIcon/paths";
+export type { PathName } from "./Icon/SvgIcon/paths";
 export { default as WorkflowStep } from "./WorkflowStep/WorkflowStep";
 export { default as WorkflowCard } from "./WorkflowCard/WorkflowCard";
 export { default as WorkflowList } from "./WorkflowList/WorkflowList";
@@ -305,4 +305,5 @@ export { BASE_SIZES } from "../constants/sizes";
 export { default as DiffCell } from "./Diffs/DiffCell/DiffCell";
 export { default as DiffTable } from "./Diffs/DiffTable/DiffTable";
 export { PanelLayout, PanelContextProvider, usePanelContext } from "./PanelLayout";
+export { DynamicPanelLayout, PanelData } from "./DynamicPanelLayout/PanelLayout";
 export type { PanelLayoutProps, PanelContextType } from "./PanelLayout";