@bundle-stats/ui 4.22.2-beta.0 → 4.22.2-beta.1

package/src/css/default.css

@@ -1,4 +1,4 @@
-@import url("~modern-css-reset/dist/reset.css");
+@import url('~modern-css-reset/dist/reset.css');
 
 /** modern-css-reset updates */
 pre,
@@ -19,7 +19,12 @@ body {
   line-height: var(--line-height);
 }
 
-h1, h2, h3, h4, h5, h6 {
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
   color: var(--color-heading);
   font-weight: 500;
   line-height: var(--line-height-heading);

package/src/css/variables.css

@@ -1,6 +1,9 @@
 :root {
-  --font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
-  --font-family-fixed: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  --font-family:
+    system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu,
+    Cantarell, 'Helvetica Neue', sans-serif;
+  --font-family-fixed:
+    SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
 
   /* Spaces */
   --space-xxxsmall: 4px;
@@ -128,9 +131,9 @@
   --color-light: #fff;
 
   /* Functional color variables */
-  --color-branding-light: #2B76D4;
+  --color-branding-light: #2b76d4;
   --color-branding: #1a477f;
-  --color-branding-dark: #09182A;
+  --color-branding-dark: #09182a;
 
   --color-text-ultra-light: var(--color-gray-ultra-light);
   --color-text-light: var(--color-gray-light);
@@ -202,7 +205,12 @@
   --radius-medium: 7px;
   --radius-large: 9px;
 
-  --skeleton-inline-background: linear-gradient(transparent 10%, currentColor 10.1%, currentColor 89.9%, transparent 90%);
+  --skeleton-inline-background: linear-gradient(
+    transparent 10%,
+    currentColor 10.1%,
+    currentColor 89.9%,
+    transparent 90%
+  );
   --skeleton-block-background: currentColor;
   --skeleton-opacity: 0.06;
 

package/src/hooks/rows-sort.ts

@@ -72,11 +72,11 @@ export const useRowsSort = <TRow>({
   const orderedRows = useMemo(
     () =>
       orderBy(
-      rows,
-      getSortFn(sort.field, getCustomSort),
-      // if direction is empty (reset), sort asc
-      sort.direction !== '' ? sort.direction : (SORT.ASC as any),
-    ),
+        rows,
+        getSortFn(sort.field, getCustomSort),
+        // if direction is empty (reset), sort asc
+        sort.direction !== '' ? sort.direction : (SORT.ASC as any),
+      ),
     [rows, sort],
   );
 

package/src/types.d.ts

@@ -21,7 +21,7 @@ type FilterGroupFieldData = {
   children: Array<ChildFilterFieldData>;
 };
 
-type FilterFieldsData = Record<string, FilterFieldData | FilterGroupFieldData>;
+export type FilterFieldsData = Record<string, FilterFieldData | FilterGroupFieldData>;
 
 export type ReportMetricAssetRowMetaStatus = 'added' | 'removed';
 

package/src/ui/button/button.module.css

@@ -290,7 +290,6 @@ a.root {
   border-color: var(--color-outline-success-dark);
 }
 
-
 /**
  * Padding variation
  */

package/src/ui/dialog/dialog.module.css

@@ -58,7 +58,10 @@
 
 .content {
   width: 100%;
-  max-height: calc(100vh - 2 * var(--space-medium) - 2 * var(--dialog-padding) - var(--dialog-header-height) - var(--dialog-vspace));
+  max-height: calc(
+    100vh - 2 * var(--space-medium) - 2 * var(--dialog-padding) - var(--dialog-header-height) -
+      var(--dialog-vspace)
+  );
   padding-bottom: 0.3em; /* extra space to compensate for the title line-height and allow to show focus state correctly on buttons */
   overflow: auto;
 }

package/src/ui/file-name/file-name.jsx

@@ -5,9 +5,7 @@ import cx from 'classnames';
 import css from './file-name.module.css';
 
 export const FileName = ({ className, as: Component, name }) => (
-  <Component className={cx(css.root, className)}>
-    {name}
-  </Component>
+  <Component className={cx(css.root, className)}>{name}</Component>
 );
 
 FileName.defaultProps = {
@@ -24,5 +22,5 @@ FileName.propTypes = {
   as: PropTypes.elementType,
 
   /** File name source  */
-  name: PropTypes.string | PropTypes.node,
+  name: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
 };

package/src/ui/filters/filters.utils.ts

@@ -22,7 +22,6 @@ export const getGroupFiltersLabelSuffix = (filters: FilterGroupFieldData['childr
     return LABELS.ALL;
   }
 
-  // eslint-disable-next-line no-unused-vars
   const checkedFilterLabels = checkedFilters.map(({ label }) => label);
 
   let suffix = '';

package/src/ui/filters/index.tsx

@@ -6,11 +6,10 @@ import { FilterFieldsData } from '../../types';
 import { getInitialValues } from './filters.utils';
 import { Filters as BaseComponent } from './filters';
 
-interface FiltersProps
-  extends Omit<
-    React.ComponentProps<typeof BaseComponent>,
-    'onChange' | 'filters' | 'values' | 'toggleFilter' | 'toggleFilters'
-  > {
+interface FiltersProps extends Omit<
+  React.ComponentProps<typeof BaseComponent>,
+  'onChange' | 'filters' | 'values' | 'toggleFilter' | 'toggleFilters'
+> {
   onChange?: (newValues: Record<string, boolean>) => void;
   filters: FilterFieldsData;
 }

package/src/ui/table/table.module.css

@@ -41,8 +41,7 @@
 
 .root tbody td a:hover,
 .root tbody td a:focus,
-.root tbody td a:active
-{
+.root tbody td a:active {
   color: var(--color-primary);
   text-decoration: underline;
 }

package/src/ui/textarea/textarea.module.css

@@ -31,7 +31,7 @@
   transition: var(--transition-out);
 }
 
-.root[readonly=""] {
+.root[readonly=''] {
   color: var(--color-text-light);
 }
 

package/src/ui/toolbar/toolbar.module.css

@@ -1,6 +1,8 @@
-.root { }
+.root {
+}
 
-.content {}
+.content {
+}
 
 .actions {
   margin-top: var(--space-xsmall);

package/src/utils/components.tsx

@@ -14,6 +14,6 @@ export const getRenderChildWithClassName = (className: string) => (child: any) =
 
   return React.cloneElement(child, {
     ...props,
-    className: cx(className, props.className), // eslint-disable-line react/prop-types
+    className: cx(className, props.className),
   });
 };

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

@@ -14,7 +14,7 @@ export namespace FileName {
         export { className_1 as className };
         let as_1: PropTypes.Requireable<PropTypes.ReactComponentLike>;
         export { as_1 as as };
-        let name_1: number;
+        let name_1: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
         export { name_1 as name };
     }
 }