react-magma-dom 4.4.0-next.2 → 4.4.0-next.4

package/dist/components/Tabs/TabScrollSpyPanel.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+export interface TabScrollSpyPanelProps extends React.HTMLAttributes<HTMLDivElement> {
+    icon?: React.ReactElement<any> | React.ReactElement<any>[];
+    tabLabel: string;
+    /**
+     * @internal
+     */
+    testId?: string;
+}
+export declare const TabScrollSpyPanel: React.ForwardRefExoticComponent<TabScrollSpyPanelProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Tabs/Tabs.stories.d.ts

@@ -5,5 +5,7 @@ export declare const Default: import("@storybook/csf").AnnotatedStoryFn<import("
 export declare const Icon: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/types-6-0").ReactFramework, TabsProps>;
 export declare const IconOnly: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/types-6-0").ReactFramework, TabsProps>;
 export declare const Scrolling: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/types-6-0").ReactFramework, TabsProps>;
+export declare const ScrollSpy: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/types-6-0").ReactFramework, TabsProps>;
+export declare const ScrollSpyIcons: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/types-6-0").ReactFramework, TabsProps>;
 export declare const Inverse: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/types-6-0").ReactFramework, TabsProps>;
 export declare const WithDropdown: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/types-6-0").ReactFramework, TabsProps>;

package/dist/components/Tabs/TabsScrollSpyContainer.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export interface TabsScrollSpyContainerProps extends React.HTMLAttributes<HTMLDivElement> {
+    isInverse?: boolean;
+    /**
+     * @internal
+     */
+    testId?: string;
+}
+export declare const TabsScrollSpyContainer: React.ForwardRefExoticComponent<TabsScrollSpyContainerProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Tabs/index.d.ts

@@ -4,3 +4,5 @@ export * from './TabPanelsContainer';
 export * from './Tabs';
 export * from './TabsContainer';
 export * from './TabsScrollButtons';
+export * from './TabsScrollSpyContainer';
+export * from './TabScrollSpyPanel';

package/dist/components/Tabs/utils.d.ts

@@ -42,3 +42,6 @@ export declare function useTabsMeta(theme: any, orientation: any, backgroundColo
     handleTabsScroll?: undefined;
     scroll?: undefined;
 })[];
+export declare const ScrollSpy: ({ handleScroll }: {
+    handleScroll: any;
+}) => any;

package/dist/components/TreeView/TreeView.stories.d.ts

@@ -1,4 +1,5 @@
 import { TreeViewSelectable } from '.';
+import { IndeterminateCheckboxStatus } from '../..';
 declare const _default: import("@storybook/csf").ComponentAnnotations<import("@storybook/react/types-6-0").ReactFramework, import("@storybook/react/types-6-0").Args>;
 export default _default;
 export declare const Default: {
@@ -7,7 +8,10 @@ export declare const Default: {
         selectable: TreeViewSelectable;
         ariaLabel: string;
         initialExpandedItems: string[];
-        initialSelectedItems: string[];
+        initialSelectedItems: {
+            itemId: string;
+            checkedStatus: IndeterminateCheckboxStatus;
+        }[];
         testId: string;
     };
 };
@@ -15,7 +19,10 @@ export declare const NoIcons: {
     (args: any): JSX.Element;
     args: {
         initialExpandedItems: string[];
-        initialSelectedItems: string[];
+        initialSelectedItems: {
+            itemId: string;
+            checkedStatus: IndeterminateCheckboxStatus;
+        }[];
     };
 };
 export declare const Textbook: {
@@ -44,7 +51,10 @@ export declare const FirstItemLeaf: {
     (args: any): JSX.Element;
     args: {
         initialExpandedItems: string[];
-        initialSelectedItems: string[];
+        initialSelectedItems: {
+            itemId: string;
+            checkedStatus: IndeterminateCheckboxStatus;
+        }[];
     };
     parameters: {
         controls: {
@@ -63,3 +73,4 @@ export declare const Flat: {
         };
     };
 };
+export declare const UnitTest: () => JSX.Element;

package/dist/components/TreeView/TreeViewContext.d.ts

@@ -3,14 +3,14 @@ import { TreeViewSelectable } from './useTreeView';
 export interface TreeViewContextInterface {
     children?: React.ReactNode | React.ReactNode[];
     hasIcons: boolean;
-    onSelectedItemChange?: (selectedItems: any) => void;
+    onSelectedItemChange?: (selectedItems: Array<Object>) => void;
     onExpandedChange?: (event: React.SyntheticEvent) => void;
     selectable: TreeViewSelectable;
     setHasIcons: React.Dispatch<React.SetStateAction<boolean>>;
-    selectedItems: Array<string>;
+    selectedItems: Array<Object>;
     setSelectedItems: React.Dispatch<React.SetStateAction<any>>;
     initialExpandedItems: Array<string>;
-    initialSelectedItems: Array<string>;
+    initialSelectedItems: Array<Object>;
     treeItemRefArray?: React.MutableRefObject<React.MutableRefObject<Element>[]>;
     registerTreeItem: (itemRefArray: React.MutableRefObject<React.MutableRefObject<Element>[]>, itemRef: React.MutableRefObject<Element>) => void;
 }

package/dist/components/TreeView/useTreeItem.d.ts

@@ -67,11 +67,11 @@ export declare function useTreeItem(props: UseTreeItemProps, forwardedRef: any):
         hasOwnTreeItems: boolean;
         itemDepth: number;
         itemId: string;
-        numberOfTreeItemChildren: any;
+        numberOfTreeItemChildren: number;
         parentCheckedStatus: IndeterminateCheckboxStatus;
         parentDepth: number;
         ref: (node: any) => void;
-        selectedItems: string[];
+        selectedItems: Object[];
         setExpanded: React.Dispatch<React.SetStateAction<boolean>>;
         updateCheckedStatusFromChild: (index: number, status: IndeterminateCheckboxStatus) => void;
         treeItemChildren: (string | number | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, any>) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal)[];

package/dist/components/TreeView/useTreeView.d.ts

@@ -15,7 +15,7 @@ export interface UseTreeViewProps {
      * Array list of itemIds of items that should be selected by default
      * * @default [] (no items selected)
      */
-    initialSelectedItems?: Array<string>;
+    initialSelectedItems?: Array<Object>;
     isInverse?: boolean;
     /**
      * How many items can be selected in the tree view: single, multi, off
@@ -40,8 +40,10 @@ export interface UseTreeViewProps {
     ariaLabelledBy?: string;
     /**
      * Action that fires when an item is selected
+     * Return an array of objects.
+     * Example: [ {itemId: 'item0',checkedStatus: IndeterminateCheckboxStatus.indeterminate}, {itemId: 'item0-child', checkedStatus: IndeterminateCheckboxStatus.checked} ]
      */
-    onSelectedItemChange?: (selectedItems: any) => void;
+    onSelectedItemChange?: (selectedItems: Array<Object>) => void;
     /**
      * Action that fires when an item is expanded or collapsed
      */
@@ -50,14 +52,14 @@ export interface UseTreeViewProps {
 export declare function useTreeView(props: UseTreeViewProps): {
     contextValue: {
         hasIcons: boolean;
-        onSelectedItemChange: (selectedItems: any) => void;
+        onSelectedItemChange: (selectedItems: Object[]) => void;
         onExpandedChange: (event: React.SyntheticEvent<Element, Event>) => void;
         selectable: TreeViewSelectable;
         setHasIcons: React.Dispatch<React.SetStateAction<boolean>>;
         selectedItems: any[];
         setSelectedItems: React.Dispatch<React.SetStateAction<any[]>>;
         initialExpandedItems: string[];
-        initialSelectedItems: string[];
+        initialSelectedItems: Object[];
         treeItemRefArray: React.MutableRefObject<React.MutableRefObject<Element>[]>;
         registerTreeItem: (refArray: React.MutableRefObject<React.MutableRefObject<Element>[]>, ref: React.MutableRefObject<Element>) => void;
     };

package/dist/components/TreeView/utils.d.ts

@@ -12,16 +12,21 @@ export declare enum TreeNodeType {
  * Branch node - 1st level has 8px of left padding.
  * Each level after that adds 24px of left padding.
  * 8, 32, 56, 80, 104, etc.
+ *
+ * The label element (the div inside the li) gets additional spacing.
+ * In order to highlight the entire line, we need to negate the value for margin.
  */
-export declare function calculateOffset(type: TreeNodeType, depth?: number, label?: boolean, negative?: boolean): string;
+export declare function calculateOffset(type: TreeNodeType, depth?: number, labelElem?: boolean, negative?: boolean): string;
 export declare function getTreeItemLabelColor(isInverse: boolean, disabled: boolean, theme: ThemeInterface): string;
 export declare function getTreeItemWrapperCursor(disabled: boolean, selectable: TreeViewSelectable, nodeType: TreeNodeType): "not-allowed" | "pointer" | "default";
+export declare function selectedItemsIncludesId(selectedItems: any, itemId: any): any;
 export declare function getChildrenItemIds(children: any): any[];
 export declare function getAllChildrenEnabled(children: any): boolean;
 export declare function filterSelectedItems(selectedItems: any, childrenIds: any, itemId: any): any;
 export declare function getMissingChildrenIds(selectedItems: any, childrenIds: any): any;
 export declare function getChildrenCheckedStatus(childrenIds: any, status: any): any;
 export declare function getEnabledTreeItemChildrenLength(treeItemChildren: any): any;
-export declare function getUniqueSelectedItemsArray(prev: any, initialSelectedItems: any, childrenItemIds: any): any[];
+export declare function getUpdatedSelectedItems(selectedItems: any, itemId: any, checkedStatus: any): any;
+export declare function getUniqueSelectedItemsArray(prev: any, initialSelectedItems: any, childrenItemIds?: any[]): any[];
 export declare function getSelectedItemsIndexes(selectedItems: any, treeItemChildren: any): any;
 export declare function getLowestIndexItem(selectedItems: any, treeItemChildren: any): any;