@devtron-labs/devtron-fe-common-lib 0.3.6 → 0.3.7

package/dist/Common/Drawer/Drawer.d.ts

@@ -10,5 +10,5 @@ interface drawerInterface {
     parentClassName?: string;
     onEscape?: (e?: any) => void;
 }
-export declare const Drawer: ({ children, position, height, width, minWidth, maxWidth, parentClassName, onEscape, }: drawerInterface) => JSX.Element;
+export declare const Drawer: ({ children, position, height, width, minWidth, maxWidth, parentClassName, onEscape, onClose, }: drawerInterface) => JSX.Element;
 export {};

package/dist/Shared/Components/TabGroup/TabGroup.helpers.d.ts

@@ -0,0 +1,7 @@
+import { TabProps } from './TabGroup.types';
+export declare const getTabIcon: ({ icon: Icon, showError, showWarning, className, }: Pick<TabProps, "showError" | "showWarning" | "icon"> & {
+    className: string;
+}) => JSX.Element;
+export declare const getTabBadge: (badge: TabProps["badge"], className: string) => JSX.Element;
+export declare const getTabIndicator: (showIndicator: TabProps["showIndicator"]) => JSX.Element;
+export declare const getTabDescription: (description: TabProps["description"]) => JSX.Element;

package/dist/Shared/Components/TabGroup/TabGroup.types.d.ts

@@ -4,7 +4,7 @@ import { DataAttributes } from '../../types';
 type TabComponentProps<TabTypeProps> = TabTypeProps & DataAttributes;
 type ConditionalTabType = {
     /**
-     *  Type of the tab, either `button`, `link` or `navLink`.
+     * Type of the tab, either `button`, `link`, `navLink` or `block`.
      */
     tabType: 'button';
     /**
@@ -17,7 +17,7 @@ type ConditionalTabType = {
     active?: boolean;
 } | {
     /**
-     *  Type of the tab, either `button`, `link` or `navLink`.
+     * Type of the tab, either `button`, `link`, `navLink` or `block`.
      */
     tabType: 'navLink';
     /**
@@ -27,10 +27,10 @@ type ConditionalTabType = {
     /**
      * Active state is determined by matching the URL.
      */
-    active?: false;
+    active?: never | false;
 } | {
     /**
-     *  Type of the tab, either `button`, `link` or `navLink`.
+     * Type of the tab, either `button`, `link`, `navLink` or `block`.
      */
     tabType: 'link';
     /**
@@ -41,6 +41,20 @@ type ConditionalTabType = {
      * Indicates if the tab is currently active.
      */
     active?: boolean;
+} | {
+    /**
+     * Type of the tab, either `button`, `link`, `navLink` or `block`.
+     * @note When `tabType` is set to `block`, the tab becomes non-interactive. It won't be active and will not have hover states.
+     */
+    tabType: 'block';
+    /**
+     * Props passed to div component.
+     */
+    props?: TabComponentProps<Omit<React.ComponentProps<'div'>, 'className' | 'style'>>;
+    /**
+     * Indicates if the tab is currently active.
+     */
+    active?: never | false;
 };
 export type TabProps = {
     /**
@@ -51,15 +65,16 @@ export type TabProps = {
      * Text label for the tab.
      */
     label: string;
+    /**
+     * Description for the tab.
+     * @note - If passed as a `string[]`, it will be rendered with a bullet in-between strings.
+     */
+    description?: string | string[];
     /**
      * Icon component to be displayed in the tab.
      * This should be a functional component that renders an SVG.
      */
     icon?: React.FunctionComponent<React.SVGProps<SVGSVGElement>>;
-    /**
-     * Type of the icon, determining whether it uses a stroke or fill style.
-     */
-    iconType?: 'stroke' | 'fill';
     /**
      * Badge number to be displayed on the tab, typically for notifications.
      */
@@ -92,7 +107,7 @@ export interface TabGroupProps {
      * Size of the tabs.
      * @default ComponentSizeType.large
      */
-    size?: ComponentSizeType.large | ComponentSizeType.medium;
+    size?: ComponentSizeType.large | ComponentSizeType.medium | ComponentSizeType.xl;
     /**
      * Optional component to be rendered on the right side of the tab list.
      */

package/dist/Shared/Components/TabGroup/TabGroup.utils.d.ts

@@ -1,7 +1,7 @@
-import { TabGroupProps, TabProps } from './TabGroup.types';
+import { TabGroupProps } from './TabGroup.types';
 export declare const getClassNameBySizeMap: ({ hideTopPadding, alignActiveBorderWithContainer, }: Pick<TabGroupProps, "hideTopPadding" | "alignActiveBorderWithContainer">) => Record<TabGroupProps["size"], {
     tabClassName: string;
     iconClassName: string;
     badgeClassName: string;
 }>;
-export declare const getIconColorClassMap: ({ active }: Pick<TabProps, "active">) => Record<TabProps["iconType"], string>;
+export declare const tabGroupClassMap: Record<TabGroupProps['size'], string>;