@bundle-stats/ui 4.3.0-beta.3 → 4.3.0-rc.1

package/types/components/index.d.ts

@@ -6,6 +6,7 @@ export { BundlePackages } from "./bundle-packages";
 export { BundleModules } from "./bundle-modules";
 export { ComponentLink } from "./component-link";
 export { Delta } from "./delta";
+export { InsightIcon } from "./insight-icon";
 export { Insights } from "./insights";
 export { JobName } from "./job-name";
 export { JobHeader } from "./job-header";
@@ -17,6 +18,7 @@ export { MetricsTableOptions } from "./metrics-table-options";
 export { MetricsTableSearch } from "./metrics-table-search";
 export { MetricsTableTitle } from "./metrics-table-title";
 export { ModuleInfo } from "./module-info";
-export { SummaryItem } from "./summary-item";
 export { Summary } from "./summary";
 export { TotalSizeTypeTitle } from "./total-size-type-title";
+export { MetricRunInfo, MetricRunInfoProps } from "./metric-run-info";
+export { RunInfo, RunInfoProps } from "./run-info";

package/types/components/insight-icon/index.d.ts

@@ -0,0 +1 @@
+export * from './insight-icon';

package/types/components/insight-icon/insight-icon.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { InsightType } from '@bundle-stats/utils';
+interface InsightIconProps extends React.HTMLAttributes<'span'> {
+    type: InsightType;
+}
+export declare const InsightIcon: (props: InsightIconProps) => JSX.Element;
+export {};

package/types/components/insights/insights.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
+import { JobInsightsInfo } from '@bundle-stats/utils';
 interface InsightsProps extends React.HTMLAttributes<HTMLDivElement> {
-    duplicatePackages: any;
-    newPackages: any;
+    insights: JobInsightsInfo;
     customComponentLink?: React.ElementType;
 }
 export declare const Insights: (props: InsightsProps) => JSX.Element;

package/types/components/job-header/job-header.d.ts

@@ -23,4 +23,4 @@ export namespace JobHeader {
         export { children_1 as children };
     }
 }
-import PropTypes from "prop-types";
+import PropTypes from 'prop-types';

package/types/components/job-meta/job-meta.d.ts

@@ -15,4 +15,4 @@ export namespace JobMeta {
         export { as_1 as as };
     }
 }
-import PropTypes from "prop-types";
+import PropTypes from 'prop-types';

package/types/components/job-name/job-name.d.ts

@@ -23,4 +23,4 @@ export namespace JobName {
         export { children_1 as children };
     }
 }
-import PropTypes from "prop-types";
+import PropTypes from 'prop-types';

package/types/components/jobs-header/jobs-header.d.ts

@@ -13,4 +13,4 @@ export namespace JobsHeader {
         export { jobs_1 as jobs };
     }
 }
-import PropTypes from "prop-types";
+import PropTypes from 'prop-types';

package/types/components/lighthouse-table/lighthouse-table.d.ts

@@ -11,4 +11,4 @@ export namespace LighthouseTable {
         export { jobs_1 as jobs };
     }
 }
-import PropTypes from "prop-types";
+import PropTypes from 'prop-types';

package/types/components/metric/index.d.ts

@@ -1 +1 @@
-export * from "./metric";
+export * from './metric';

package/types/components/metric/metric.d.ts

@@ -1,33 +1,7 @@
-export function Metric({ className, value, formatter, inline, children, enhanced }: {
-    className: any;
-    value: any;
-    formatter: any;
-    inline: any;
-    children: any;
-    enhanced: any;
-}): JSX.Element;
-export namespace Metric {
-    namespace defaultProps {
-        const className: string;
-        const enhanced: boolean;
-        const inline: boolean;
-        const value: number;
-        const children: never[];
-        function formatter(val: any): any;
-    }
-    namespace propTypes {
-        const className_1: PropTypes.Requireable<string>;
-        export { className_1 as className };
-        const enhanced_1: PropTypes.Requireable<boolean>;
-        export { enhanced_1 as enhanced };
-        const inline_1: PropTypes.Requireable<boolean>;
-        export { inline_1 as inline };
-        const value_1: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
-        export { value_1 as value };
-        const formatter_1: PropTypes.Requireable<(...args: any[]) => any>;
-        export { formatter_1 as formatter };
-        const children_1: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        export { children_1 as children };
-    }
+import React from 'react';
+export interface MetricProps {
+    value?: React.ReactNode;
+    unit?: string;
+    inline?: boolean;
 }
-import PropTypes from "prop-types";
+export declare const Metric: (props: MetricProps & React.ComponentProps<'div'>) => JSX.Element;

package/types/components/metric-run-info/index.d.ts

@@ -0,0 +1 @@
+export * from './metric-run-info';

package/types/components/metric-run-info/metric-run-info.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { RunInfoProps } from '../run-info';
+export interface MetricRunInfoProps {
+    metricId: string;
+    current: number;
+    baseline?: number;
+    showDelta?: boolean;
+    showMetricDescription?: boolean;
+    showBaseline?: boolean;
+    size?: RunInfoProps['size'];
+    loading?: RunInfoProps['loading'];
+}
+export declare const MetricRunInfo: (props: MetricRunInfoProps & React.ComponentProps<'div'>) => JSX.Element;

package/types/components/metrics-table/metrics-table.d.ts

@@ -48,4 +48,4 @@ export namespace MetricsTable {
         export { title_1 as title };
     }
 }
-import PropTypes from "prop-types";
+import PropTypes from 'prop-types';

package/types/components/metrics-table-options/metrics-table-options.d.ts

@@ -14,4 +14,4 @@ export namespace MetricsTableOptions {
         export { handleResetFilters_1 as handleResetFilters };
     }
 }
-import PropTypes from "prop-types";
+import PropTypes from 'prop-types';

package/types/components/metrics-table-search/metrics-table-search.d.ts

@@ -13,4 +13,4 @@ export namespace MetricsTableSearch {
         export { placeholder_1 as placeholder };
     }
 }
-import PropTypes from "prop-types";
+import PropTypes from 'prop-types';

package/types/components/metrics-table-title/metrics-table-title.d.ts

@@ -18,4 +18,4 @@ export namespace MetricsTableTitle {
         export { popoverInfo_1 as popoverInfo };
     }
 }
-import PropTypes from "prop-types";
+import PropTypes from 'prop-types';

package/types/components/module-info/index.d.ts

@@ -1 +1 @@
-export * from "./module-info";
+export * from './module-info';

package/types/components/module-info/module-info.d.ts

@@ -1,35 +1,17 @@
-export function ModuleInfo(props: any): JSX.Element;
-export namespace ModuleInfo {
-    namespace propTypes {
-        const className: PropTypes.Requireable<string>;
-        const item: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
-            key: PropTypes.Requireable<string>;
-            runs: PropTypes.Requireable<(PropTypes.InferProps<{
-                key: PropTypes.Requireable<string>;
-                name: PropTypes.Requireable<string>;
-                chunkIds: PropTypes.Requireable<(string | null | undefined)[]>;
-            }> | null | undefined)[]>;
-        }>>>;
-        const labels: PropTypes.Validator<(string | null | undefined)[]>;
-        const chunks: PropTypes.Requireable<(PropTypes.InferProps<{
-            id: PropTypes.Requireable<string>;
-            name: PropTypes.Requireable<string>;
-        }> | null | undefined)[]>;
-        const chunkIds: PropTypes.Requireable<(string | null | undefined)[]>;
-        const customComponentLink: PropTypes.Requireable<PropTypes.ReactComponentLike>;
-        const onClick: PropTypes.Requireable<(...args: any[]) => any>;
-    }
-    namespace defaultProps {
-        const className_1: string;
-        export { className_1 as className };
-        const chunks_1: never[];
-        export { chunks_1 as chunks };
-        const chunkIds_1: never[];
-        export { chunkIds_1 as chunkIds };
-        export { ComponentLink as customComponentLink };
-        export { noop as onClick };
-    }
+import React from 'react';
+import { MetricRunInfo } from '@bundle-stats/utils';
+import { Module, MetaChunk } from '@bundle-stats/utils/types/webpack';
+interface ModuleInfoProps {
+    item: {
+        label: string;
+        changed?: boolean;
+        duplicated?: boolean;
+        runs: Array<Module & MetricRunInfo>;
+    };
+    chunks?: Array<MetaChunk>;
+    chunkIds?: Array<string>;
+    labels: Array<string>;
+    customComponentLink?: React.ElementType;
 }
-import PropTypes from "prop-types";
-import { ComponentLink } from "../component-link";
-import noop from "lodash/noop";
+export declare const ModuleInfo: (props: ModuleInfoProps & React.ComponentProps<'div'>) => JSX.Element;
+export {};

package/types/components/package-info/index.d.ts

@@ -0,0 +1 @@
+export * from './package-info';

package/types/components/package-info/package-info.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { MetricRunInfo } from '@bundle-stats/utils';
+import { Package } from '@bundle-stats/utils/types/webpack';
+interface PackageInfoProps {
+    name: string;
+    item: {
+        label: string;
+        duplicate?: boolean;
+        runs: Array<Package & MetricRunInfo>;
+    };
+    labels: Array<string>;
+    customComponentLink?: React.ElementType;
+}
+export declare const PackageInfo: (props: PackageInfoProps & React.ComponentProps<'div'>) => JSX.Element;
+export {};

package/types/components/run-info/index.d.ts

@@ -0,0 +1 @@
+export * from './run-info';

package/types/components/run-info/run-info.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+export interface RunInfoProps {
+    title?: string;
+    titleHoverCard?: React.ReactNode;
+    titleTooltip?: React.ReactNode;
+    current?: React.ReactNode;
+    baseline?: string;
+    delta?: string;
+    deltaType?: string;
+    as?: React.ElementType;
+    size?: 'medium' | 'large';
+    showBaseline?: boolean;
+    loading?: boolean;
+    enhance?: boolean;
+}
+export declare const RunInfo: ({ className, title, titleHoverCard, titleTooltip, current, baseline, delta, deltaType, as: Component, size, showBaseline, loading, enhance, ...restProps }: RunInfoProps & React.ComponentProps<'div'>) => JSX.Element;

package/types/components/summary/index.d.ts

@@ -1 +1 @@
-export * from "./summary";
+export * from './summary';

package/types/components/summary/summary.d.ts

@@ -1,37 +1,26 @@
-export function Summary({ className, size, keys, data, loading, showSummaryItemDelta, summaryItemLink: SummaryItemCustomLink, }: {
-    className: any;
-    size: any;
-    keys: any;
-    data: any;
-    loading: any;
-    showSummaryItemDelta: any;
-    summaryItemLink: any;
-}): JSX.Element;
-export namespace Summary {
-    namespace defaultProps {
-        export const className: string;
-        export const data: null;
-        export const loading: boolean;
-        export const size: string;
-        export { METRICS_WEBPACK_GENERAL as keys };
-        export const showSummaryItemDelta: boolean;
-        export { ComponentLink as summaryItemLink };
-    }
-    namespace propTypes {
-        const className_1: PropTypes.Requireable<string>;
-        export { className_1 as className };
-        const size_1: PropTypes.Requireable<string>;
-        export { size_1 as size };
-        export const keys: PropTypes.Requireable<(string | null | undefined)[]>;
-        const data_1: PropTypes.Requireable<PropTypes.InferProps<{}>>;
-        export { data_1 as data };
-        const loading_1: PropTypes.Requireable<boolean>;
-        export { loading_1 as loading };
-        const showSummaryItemDelta_1: PropTypes.Requireable<boolean>;
-        export { showSummaryItemDelta_1 as showSummaryItemDelta };
-        export const summaryItemLink: PropTypes.Requireable<PropTypes.ReactComponentLike>;
-    }
+import React from 'react';
+import { MetricRunInfoProps } from '../metric-run-info';
+interface SummaryItemProps {
+    metricId: string;
+    data?: Record<string, SummaryItemData> | null;
+    customLink: React.ElementType;
+    size?: MetricRunInfoProps['size'];
+    loading: boolean;
+    showDelta: boolean;
+    showBaseline: boolean;
 }
-import { METRICS_WEBPACK_GENERAL } from "../../constants";
-import { ComponentLink } from "../component-link";
-import PropTypes from "prop-types";
+interface SummaryItemData {
+    current: number;
+    baseline: number;
+}
+interface SummaryProps {
+    size?: MetricRunInfoProps['size'];
+    keys?: Array<string>;
+    data?: SummaryItemProps['data'];
+    loading?: boolean;
+    showSummaryItemDelta?: SummaryItemProps['showDelta'];
+    showSummaryItemBaseline?: SummaryItemProps['showBaseline'];
+    summaryItemLink?: SummaryItemProps['customLink'];
+}
+export declare const Summary: ({ className, size, keys, data, loading, showSummaryItemDelta, showSummaryItemBaseline, summaryItemLink, }: SummaryProps & React.ComponentProps<'div'>) => JSX.Element;
+export {};

package/types/components/total-size-type-title/total-size-type-title.d.ts

@@ -10,4 +10,4 @@ export namespace TotalSizeTypeTitle {
         export { className_1 as className };
     }
 }
-import PropTypes from "prop-types";
+import PropTypes from 'prop-types';

package/types/constants.d.ts

@@ -1,14 +1,3 @@
-export const NO_SPACE: "no-space";
-export const SPACE_XXXSMALL: "xxxsmall";
-export const SPACE_XXSMALL: "xxsmall";
-export const SPACE_XSMALL: "xsmall";
-export const SPACE_SMALL: "small";
-export const SPACE_MEDIUM: "medium";
-export const SPACE_LARGE: "large";
-export const SPACE_XLARGE: "xlarge";
-export const SPACE_XXLARGE: "xxlarge";
-export const SPACE_XXXLARGE: "xxxlarge";
-export const SPACES: string[];
 export namespace URLS {
     const OVERVIEW: string;
     const ASSETS: string;

package/types/layout/box/box.d.ts

@@ -1,26 +1,13 @@
-export function Box(props: any): JSX.Element;
-export namespace Box {
-    namespace defaultProps {
-        export const className: string;
-        export const as: string;
-        export { NO_SPACE as padding };
-        export const horizontalPadding: string;
-        export const verticalPadding: string;
-        export const outline: boolean;
-    }
-    namespace propTypes {
-        const className_1: PropTypes.Requireable<string>;
-        export { className_1 as className };
-        const as_1: PropTypes.Requireable<PropTypes.ReactComponentLike>;
-        export { as_1 as as };
-        export const padding: PropTypes.Requireable<NonNullable<string | (string | null | undefined)[] | null | undefined>>;
-        const horizontalPadding_1: PropTypes.Requireable<string>;
-        export { horizontalPadding_1 as horizontalPadding };
-        const verticalPadding_1: PropTypes.Requireable<string>;
-        export { verticalPadding_1 as verticalPadding };
-        const outline_1: PropTypes.Requireable<boolean>;
-        export { outline_1 as outline };
-    }
+import React from 'react';
+import { SPACES } from '../../tokens';
+type SpaceValue = (typeof SPACES)[number];
+interface BoxProps<T extends React.ElementType> {
+    as?: T;
+    padding?: SpaceValue | [SpaceValue, SpaceValue];
+    horizontalPadding?: SpaceValue;
+    verticalPadding?: SpaceValue;
+    outline?: boolean;
+    outlineHover?: boolean;
 }
-import { NO_SPACE } from "../../constants";
-import PropTypes from "prop-types";
+export declare const Box: <T extends React.ElementType<any> = "div">(props: BoxProps<T> & Omit<React.ComponentProps<T>, keyof BoxProps<T>>) => JSX.Element;
+export {};

package/types/layout/box/index.d.ts

@@ -1 +1 @@
-export { Box } from "./box";
+export * from './box';

package/types/layout/flex-stack/flex-stack.d.ts

@@ -1,34 +1,11 @@
-export function FlexStack({ as: Component, className, space, inline, children, alignItems, ...restProps }: {
-    [x: string]: any;
-    as?: string | undefined;
-    className?: string | undefined;
-    space?: string | undefined;
-    inline?: boolean | undefined;
-    children?: null | undefined;
-    alignItems?: string | undefined;
-}): JSX.Element;
-export namespace FlexStack {
-    namespace defaultProps {
-        export const as: string;
-        export const className: string;
-        export const children: null;
-        export { NO_SPACE as space };
-        export const alignItems: undefined;
-        export const inline: boolean;
-    }
-    namespace propTypes {
-        const as_1: PropTypes.Requireable<PropTypes.ReactComponentLike>;
-        export { as_1 as as };
-        const className_1: PropTypes.Requireable<string>;
-        export { className_1 as className };
-        const children_1: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        export { children_1 as children };
-        export const space: PropTypes.Requireable<string>;
-        const alignItems_1: PropTypes.Requireable<string>;
-        export { alignItems_1 as alignItems };
-        const inline_1: PropTypes.Requireable<boolean>;
-        export { inline_1 as inline };
-    }
+import React from 'react';
+import { SPACES } from '../../tokens';
+type SpaceValue = (typeof SPACES)[number];
+interface FlexStackProps<T extends React.ElementType> {
+    as?: T;
+    space?: SpaceValue;
+    inline?: boolean;
+    alignItems?: 'top' | 'center' | 'bottom';
 }
-import { NO_SPACE } from "../../constants";
-import PropTypes from "prop-types";
+export declare const FlexStack: <T extends React.ElementType<any> = "div">(props: FlexStackProps<T> & Omit<React.ComponentProps<T>, keyof FlexStackProps<T>>) => JSX.Element;
+export {};

package/types/layout/flex-stack/index.d.ts

@@ -1 +1 @@
-export * from "./flex-stack";
+export * from './flex-stack';

package/types/layout/footer/footer.d.ts

@@ -14,4 +14,4 @@ export namespace Footer {
         export { version_1 as version };
     }
 }
-import PropTypes from "prop-types";
+import PropTypes from 'prop-types';

package/types/layout/separator.d.ts

@@ -3,11 +3,11 @@ export namespace Separator {
     export { propTypes };
     export { defaultProps };
 }
-import PropTypes from "prop-types";
+import PropTypes from 'prop-types';
 declare namespace propTypes {
     const className: PropTypes.Requireable<string>;
 }
-import React from "react";
+import React from 'react';
 declare namespace defaultProps {
     const className_1: string;
     export { className_1 as className };

package/types/layout/stack/index.d.ts

@@ -1 +1 @@
-export * from "./stack";
+export * from './stack';

package/types/layout/stack/stack.d.ts

@@ -1,20 +1,7 @@
-export function Stack(props: any): JSX.Element;
-export namespace Stack {
-    namespace defaultProps {
-        export const as: string;
-        export const className: string;
-        export const children: null;
-        export { NO_SPACE as space };
-    }
-    namespace propTypes {
-        const as_1: PropTypes.Requireable<PropTypes.ReactComponentLike>;
-        export { as_1 as as };
-        const className_1: PropTypes.Requireable<string>;
-        export { className_1 as className };
-        const children_1: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        export { children_1 as children };
-        export const space: PropTypes.Requireable<string>;
-    }
-}
-import { NO_SPACE } from "../../constants";
-import PropTypes from "prop-types";
+import React from 'react';
+import { SPACES } from '../../tokens';
+export type StackProps = {
+    as?: React.ElementType;
+    space?: (typeof SPACES)[number];
+};
+export declare const Stack: (props: StackProps & React.ComponentProps<'div'>) => JSX.Element;

package/types/tokens.d.ts

@@ -0,0 +1,23 @@
+export declare const NO_SPACE = "no-space";
+export declare const SPACE_XXXSMALL = "xxxsmall";
+export declare const SPACE_XXSMALL = "xxsmall";
+export declare const SPACE_XSMALL = "xsmall";
+export declare const SPACE_SMALL = "small";
+export declare const SPACE_MEDIUM = "medium";
+export declare const SPACE_LARGE = "large";
+export declare const SPACE_XLARGE = "xlarge";
+export declare const SPACE_XXLARGE = "xxlarge";
+export declare const SPACE_XXXLARGE = "xxxlarge";
+export declare const SPACES: readonly ["no-space", "xxxsmall", "xxsmall", "xsmall", "small", "medium", "large", "xlarge", "xxlarge", "xxxlarge"];
+export declare const KIND: {
+    readonly DEFAULT: "default";
+    readonly SUCCESS: "success";
+    readonly INFO: "info";
+    readonly WARNING: "warning";
+    readonly DANGER: "danger";
+};
+export declare const SIZE: {
+    readonly SMALL: "small";
+    readonly MEDIUM: "medium";
+    readonly LARGE: "large";
+};

package/types/ui/alert/alert.d.ts

@@ -1,15 +1,8 @@
-export function Alert(props: any): JSX.Element;
-export namespace Alert {
-    namespace propTypes {
-        const className: PropTypes.Requireable<string>;
-        const kind: PropTypes.Requireable<string>;
-        const children: PropTypes.Validator<NonNullable<PropTypes.ReactNodeLike>>;
-    }
-    namespace defaultProps {
-        const className_1: string;
-        export { className_1 as className };
-        const kind_1: string;
-        export { kind_1 as kind };
-    }
+import React from 'react';
+import { KIND } from '../../tokens';
+import { Box } from '../../layout/box';
+interface AlertProps {
+    kind?: (typeof KIND)[keyof typeof KIND];
 }
-import PropTypes from "prop-types";
+export declare const Alert: (props: AlertProps & React.ComponentProps<typeof Box>) => JSX.Element;
+export {};

package/types/ui/alert/index.d.ts

@@ -1 +1 @@
-export * from "./alert";
+export * from './alert';

package/types/ui/container/container.d.ts

@@ -1,18 +1,6 @@
-export function Container({ className, as: Component, ...restProps }: {
-    [x: string]: any;
-    className: any;
-    as: any;
-}): JSX.Element;
-export namespace Container {
-    namespace defaultProps {
-        const className: string;
-        const as: string;
-    }
-    namespace propTypes {
-        const className_1: PropTypes.Requireable<string>;
-        export { className_1 as className };
-        const as_1: PropTypes.Requireable<PropTypes.ReactComponentLike>;
-        export { as_1 as as };
-    }
+import React from 'react';
+interface ContainerProps extends React.HTMLAttributes<HTMLDivElement> {
+    as?: React.ElementType;
 }
-import PropTypes from "prop-types";
+export declare const Container: ({ as: Component, className, ...restProps }: ContainerProps) => JSX.Element;
+export {};

package/types/ui/container/index.d.ts

@@ -1 +1 @@
-export { Container } from "./container";
+export * from './container';

package/types/ui/dropdown/dropdown.d.ts

@@ -22,7 +22,7 @@ export namespace Dropdown {
     }
     export { Item };
 }
-import PropTypes from "prop-types";
+import PropTypes from 'prop-types';
 declare function Item({ className, isActive, ...restProps }: {
     [x: string]: any;
     className?: string | undefined;

package/types/ui/empty-set/empty-set.d.ts

@@ -13,4 +13,4 @@ export namespace EmptySet {
         export { handleViewAll_1 as handleViewAll };
     }
 }
-import PropTypes from "prop-types";
+import PropTypes from 'prop-types';

package/types/ui/file-name/file-name.d.ts

@@ -14,8 +14,8 @@ export namespace FileName {
         export { className_1 as className };
         const as_1: PropTypes.Requireable<PropTypes.ReactComponentLike>;
         export { as_1 as as };
-        const name_1: PropTypes.Requireable<string>;
+        const name_1: number;
         export { name_1 as name };
     }
 }
-import PropTypes from "prop-types";
+import PropTypes from 'prop-types';

package/types/ui/filters/filters.d.ts

@@ -11,4 +11,4 @@ export namespace Filters {
         export const toggleFilter: PropTypes.Validator<(...args: any[]) => any>;
     }
 }
-import PropTypes from "prop-types";
+import PropTypes from 'prop-types';