@hazelcast/ui 1.3.3-next.3 → 1.3.3-next.30

package/lib/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sourceRoot":"","sources":["../src/Button.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../src/Button.tsx"],"names":[],"mappings":"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"}

package/lib/Button.module.scss

@@ -1,3 +1,4 @@
+@use 'sass:color';
 @use '../styles/constants' as c;
 @use '../styles/helpers' as h;
 
@@ -174,12 +175,12 @@
       &.hover,
       &:focus-visible,
       &.focus {
-        @include buttonColor(lighten(c.$colorBrand, 20%));
+        @include buttonColor(color.adjust(c.$colorBrand, $lightness: 20%));
       }
 
       &:active,
       &.active {
-        @include buttonColor(darken(c.$colorBrand, 10%));
+        @include buttonColor(color.adjust(c.$colorBrand, $lightness: -10%));
       }
 
       &.variantContained {
@@ -192,18 +193,18 @@
     }
 
     &AuthPrimary {
-      @include buttonColor(c.$authPrimary);
+      @include buttonColor(c.$colorBrandPrimary);
 
       &:hover,
       &.hover,
       &:focus-visible,
       &.focus {
-        @include buttonColor(lighten(c.$authPrimary, 10%));
+        @include buttonColor(color.adjust(c.$colorBrandPrimary, $lightness: 10%));
       }
 
       &:active,
       &.active {
-        @include buttonColor(darken(c.$authPrimary, 10%));
+        @include buttonColor(color.adjust(c.$colorBrandPrimary, $lightness: -10%));
       }
 
       &.variantContained {
@@ -216,7 +217,7 @@
     }
 
     &AuthSecondary {
-      @include buttonColor(c.$authSecondary);
+      @include buttonColor(c.$colorAuthSecondary);
 
       border-color: c.$colorNeutralWhite;
 
@@ -224,12 +225,12 @@
       &.hover,
       &:focus-visible,
       &.focus {
-        @include buttonColor(lighten(c.$authSecondary, 10%));
+        @include buttonColor(color.adjust(c.$colorAuthSecondary, $lightness: 10%));
       }
 
       &:active,
       &.active {
-        @include buttonColor(darken(c.$authSecondary, 10%));
+        @include buttonColor(color.adjust(c.$colorAuthSecondary, $lightness: -10%));
       }
 
       &.variantContained {
@@ -237,7 +238,7 @@
       }
 
       &.variantOutlined {
-        border-color: c.$authSecondary;
+        border-color: c.$colorAuthSecondary;
       }
 
       &:disabled {
@@ -245,6 +246,36 @@
         background-color: c.$colorNeutralWhite;
       }
     }
+
+    &Light {
+      @include buttonColor(c.$colorNeutralLighter);
+
+      border-color: c.$colorNeutralLighter;
+
+      &:hover,
+      &.hover,
+      &:focus-visible,
+      &.focus {
+        @include buttonColor(color.adjust(c.$colorBrandText, $lightness: 10%));
+      }
+
+      &:active,
+      &.active {
+        @include buttonColor(c.$colorBrandText);
+      }
+
+      &.variantContained {
+        color: c.$colorText;
+
+        &:disabled {
+          @include disabledButtonColor;
+        }
+      }
+
+      &:disabled {
+        @include buttonColor(c.$colorNeutralLight);
+      }
+    }
   }
 
   &.variant {
@@ -281,7 +312,6 @@
     }
 
     &Text {
-      color: inherit;
       background: none;
 
       &:hover,

package/lib/Card.d.ts

@@ -5,8 +5,10 @@ export type CardProps = {
     headingIcon?: IconProps['icon'];
     caption?: ReactNode;
     title?: string;
+    titleTagName?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
     headingContent?: ReactNode;
     separator?: boolean;
+    variant?: 'bordered' | 'default';
     children: ReactNode;
     className?: string;
     iconClassName?: string;

package/lib/Card.js

@@ -2,6 +2,7 @@ import React from 'react';
 import cn from 'classnames';
 import { Icon } from './Icon';
 import styles from './Card.module.scss';
+const Title = ({ as: Tag, ...props }) => React.createElement(Tag, { "data-test": "card-heading-title", ...props });
 /**
  * ### Purpose
  * Card components define content hierarchy (visual and logical), separating content into "groups".
@@ -9,11 +10,11 @@ import styles from './Card.module.scss';
  * ### General Info
  * - Card can be rendered with an optional separator and/or icon.
  */
-export const Card = ({ headingIcon, title, headingContent, separator = false, 'data-test': dataTest, children, className, iconClassName, titleClassName, contentClassName, headerClassName, caption, }) => (React.createElement("div", { "data-test": dataTest !== null && dataTest !== void 0 ? dataTest : 'card-wrapper', className: cn(styles.wrapper, { [styles.noTitle]: !title }, className) },
+export const Card = ({ headingIcon, title, headingContent, separator = false, variant = 'default', 'data-test': dataTest, children, titleTagName = 'h2', className, iconClassName, titleClassName, contentClassName, headerClassName, caption, }) => (React.createElement("div", { "data-test": dataTest !== null && dataTest !== void 0 ? dataTest : 'card-wrapper', className: cn(styles.wrapper, { [styles.noTitle]: !title, [styles.bordered]: variant === 'bordered' }, className) },
     caption && React.createElement("div", { className: styles.caption }, caption),
     (title || headingContent || headingIcon) && (React.createElement("div", { "data-test": "card-heading", className: cn(styles.heading, headerClassName) },
         headingIcon && React.createElement(Icon, { "data-test": "card-heading-icon", icon: headingIcon, className: cn(styles.icon, iconClassName), ariaHidden: true }),
-        title && (React.createElement("h3", { "data-test": "card-heading-title", className: cn(styles.title, { [styles.space]: !!headingContent }, titleClassName) }, title)),
+        title && (React.createElement(Title, { as: titleTagName, className: cn(styles.title, { [styles.space]: !!headingContent }, titleClassName) }, title)),
         headingContent)),
     separator && React.createElement("div", { "data-test": "card-separator", className: styles.separator }),
     children && (React.createElement("div", { "data-test": "card-content", className: cn(styles.content, contentClassName) }, children))));

package/lib/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","sourceRoot":"","sources":["../src/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAA;AAC5C,OAAO,EAAE,MAAM,YAAY,CAAA;AAG3B,OAAO,EAAE,IAAI,EAAa,MAAM,QAAQ,CAAA;AAExC,OAAO,MAAM,MAAM,oBAAoB,CAAA;AAgBvC;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,IAAI,GAAkB,CAAC,EAClC,WAAW,EACX,KAAK,EACL,cAAc,EACd,SAAS,GAAG,KAAK,EACjB,WAAW,EAAE,QAAQ,EACrB,QAAQ,EACR,SAAS,EACT,aAAa,EACb,cAAc,EACd,gBAAgB,EAChB,eAAe,EACf,OAAO,GACR,EAAE,EAAE,CAAC,CACJ,0CAAgB,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,cAAc,EAAE,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,EAAE,SAAS,CAAC;IAC/G,OAAO,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO,IAAG,OAAO,CAAO;IAC1D,CAAC,KAAK,IAAI,cAAc,IAAI,WAAW,CAAC,IAAI,CAC3C,0CAAe,cAAc,EAAC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,EAAE,eAAe,CAAC;QACzE,WAAW,IAAI,oBAAC,IAAI,iBAAW,mBAAmB,EAAC,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,aAAa,CAAC,EAAE,UAAU,SAAG;QAC9H,KAAK,IAAI,CACR,yCAAc,oBAAoB,EAAC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,cAAc,EAAE,EAAE,cAAc,CAAC,IACjH,KAAK,CACH,CACN;QACA,cAAc,CACX,CACP;IAEA,SAAS,IAAI,0CAAe,gBAAgB,EAAC,SAAS,EAAE,MAAM,CAAC,SAAS,GAAI;IAE5E,QAAQ,IAAI,CACX,0CAAe,cAAc,EAAC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,EAAE,gBAAgB,CAAC,IAC1E,QAAQ,CACL,CACP,CACG,CACP,CAAA"}
+{"version":3,"file":"Card.js","sourceRoot":"","sources":["../src/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqC,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,MAAM,YAAY,CAAA;AAG3B,OAAO,EAAE,IAAI,EAAa,MAAM,QAAQ,CAAA;AAExC,OAAO,MAAM,MAAM,oBAAoB,CAAA;AAuBvC,MAAM,KAAK,GAAmB,CAAC,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE,CAAC,oBAAC,GAAG,iBAAW,oBAAoB,KAAK,KAAK,GAAI,CAAA;AAE1G;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,IAAI,GAAkB,CAAC,EAClC,WAAW,EACX,KAAK,EACL,cAAc,EACd,SAAS,GAAG,KAAK,EACjB,OAAO,GAAG,SAAS,EACnB,WAAW,EAAE,QAAQ,EACrB,QAAQ,EACR,YAAY,GAAG,IAAI,EACnB,SAAS,EACT,aAAa,EACb,cAAc,EACd,gBAAgB,EAChB,eAAe,EACf,OAAO,GACR,EAAE,EAAE,CAAC,CACJ,0CACa,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,cAAc,EACrC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,OAAO,KAAK,UAAU,EAAE,EAAE,SAAS,CAAC;IAEhH,OAAO,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO,IAAG,OAAO,CAAO;IAC1D,CAAC,KAAK,IAAI,cAAc,IAAI,WAAW,CAAC,IAAI,CAC3C,0CAAe,cAAc,EAAC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,EAAE,eAAe,CAAC;QACzE,WAAW,IAAI,oBAAC,IAAI,iBAAW,mBAAmB,EAAC,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,aAAa,CAAC,EAAE,UAAU,SAAG;QAC9H,KAAK,IAAI,CACR,oBAAC,KAAK,IAAC,EAAE,EAAE,YAAY,EAAE,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,cAAc,EAAE,EAAE,cAAc,CAAC,IACvG,KAAK,CACA,CACT;QACA,cAAc,CACX,CACP;IAEA,SAAS,IAAI,0CAAe,gBAAgB,EAAC,SAAS,EAAE,MAAM,CAAC,SAAS,GAAI;IAE5E,QAAQ,IAAI,CACX,0CAAe,cAAc,EAAC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,EAAE,gBAAgB,CAAC,IAC1E,QAAQ,CACL,CACP,CACG,CACP,CAAA"}

package/lib/Card.module.scss

@@ -1,18 +1,14 @@
 @use '../styles/constants' as c;
 
-.wrapper {
-  $padding: c.$grid * 5;
+$padding: c.$grid * 5;
 
-  padding: $padding;
-  border-radius: c.$borderRadius;
+.wrapper {
   background: c.$colorNeutralWhite;
-  border: c.$borderWidth solid c.$colorNeutral;
 
   .heading {
-    @include c.typographyH3;
-
     display: flex;
     align-items: center;
+    margin-bottom: c.$grid * 5;
 
     .icon {
       margin-right: c.$grid * 2.5;
@@ -20,8 +16,6 @@
 
     .title {
       margin: 0;
-      font-size: c.$fontSizeBodyNormal !important;
-      line-height: c.$lineHeightBodyNormal !important;
 
       &.space {
         margin-right: c.$grid * 2.5;
@@ -37,23 +31,62 @@
   }
 
   .content {
+    padding-top: c.$grid * 6;
     @include c.typographyBodyNormal;
-
-    margin-top: c.$grid * 4;
-  }
-
-  &.noTitle {
-    .content {
-      margin-top: 0;
-    }
   }
 
   .caption {
     display: flex;
-    margin: (-$padding) (-$padding) $padding (-$padding);
+    margin-bottom: $padding;
 
     & > * {
       flex: 1;
     }
   }
 }
+
+.bordered {
+  padding: $padding;
+  border-radius: c.$borderRadius;
+  border: c.$borderWidth solid c.$colorNeutral;
+
+  .heading {
+    @include c.typographyH3;
+
+    display: flex;
+    align-items: center;
+    margin: 0;
+
+    .icon {
+      margin-right: c.$grid * 2.5;
+    }
+
+    .title {
+      margin: 0;
+      font-size: c.$fontSizeBodyNormal !important;
+      line-height: c.$lineHeightBodyNormal !important;
+
+      &.space {
+        margin-right: c.$grid * 2.5;
+      }
+    }
+  }
+
+  .content {
+    @include c.typographyBodyNormal;
+
+    margin-top: c.$grid * 4;
+    padding: 0;
+  }
+
+  .caption {
+    margin: (-$padding) (-$padding) $padding;
+  }
+}
+
+.noTitle {
+  .content {
+    margin-top: 0;
+    padding-top: 0;
+  }
+}

package/lib/CenteredLoader.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { DataTestProp } from '@hazelcast/helpers';
+import { LoaderProps } from './Loader';
+export type CenteredLoaderProps = LoaderProps & DataTestProp;
+export declare const CenteredLoader: FC<CenteredLoaderProps>;

package/lib/CenteredLoader.js

@@ -0,0 +1,6 @@
+import React from 'react';
+import { Loader } from './Loader';
+import styles from './CenteredLoader.module.scss';
+export const CenteredLoader = ({ 'data-test': dataTest = 'centered-loader', ...props }) => (React.createElement("div", { className: styles.container, "data-test": dataTest },
+    React.createElement(Loader, { ...props })));
+//# sourceMappingURL=CenteredLoader.js.map

package/lib/CenteredLoader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CenteredLoader.js","sourceRoot":"","sources":["../src/CenteredLoader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAa,MAAM,OAAO,CAAA;AAGjC,OAAO,EAAe,MAAM,EAAE,MAAM,UAAU,CAAA;AAE9C,OAAO,MAAM,MAAM,8BAA8B,CAAA;AAGjD,MAAM,CAAC,MAAM,cAAc,GAA4B,CAAC,EAAE,WAAW,EAAE,QAAQ,GAAG,iBAAiB,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE,CAAC,CAClH,6BAAK,SAAS,EAAE,MAAM,CAAC,SAAS,eAAa,QAAQ;IACnD,oBAAC,MAAM,OAAK,KAAK,GAAI,CACjB,CACP,CAAA"}

package/lib/CenteredLoader.module.scss

@@ -0,0 +1,11 @@
+@use '../styles/constants' as c;
+
+.container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+  flex-grow: 1;
+  color: c.$colorTextSecondary;
+}

package/lib/Checkbox.module.scss

@@ -9,12 +9,12 @@
   box-sizing: border-box;
   overflow: hidden;
 
+  @include c.typographyBodySmall;
+
   * {
     box-sizing: border-box;
   }
 
-  @include c.typographyBodySmall;
-
   // hide native checkbox
   input {
     @include h.visuallyHidden;

package/lib/Icon.d.ts

@@ -1,4 +1,5 @@
 import React, { FC, SVGAttributes } from 'react';
+import { DataTestProp } from '@hazelcast/helpers';
 export type IconSize = 'small' | 'smallMedium' | 'medium' | 'large' | 'xlarge';
 export type IconAriaProps = {
     ariaLabel: string | undefined;
@@ -25,5 +26,5 @@ export type IconProps = {
     containerClassName?: string;
     bold?: boolean;
     role?: string;
-} & IconAriaProps;
+} & IconAriaProps & DataTestProp;
 export declare const Icon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<HTMLDivElement>>;

package/lib/Icon.js

@@ -2,7 +2,7 @@ import React, { forwardRef } from 'react';
 import cn from 'classnames';
 import styleConsts from '../styles/constants/export.module.scss';
 import styles from './Icon.module.scss';
-export const Icon = forwardRef(({ color, icon: IconElement, ariaLabel, ariaLabelledBy, ariaHidden, className, containerClassName, size = 'medium', bold = false, role = 'img', }, ref) => {
+export const Icon = forwardRef(({ color, icon: IconElement, ariaLabel, ariaLabelledBy, ariaHidden, className, containerClassName, size = 'medium', bold = false, role = 'img', 'data-test': dataTest, }, ref) => {
     const iconStroke = bold ? styleConsts.iconStrokeWidthBold : styleConsts.iconStrokeWidth;
     const props = {
         'aria-label': ariaLabel || 'icon',
@@ -20,7 +20,7 @@ export const Icon = forwardRef(({ color, icon: IconElement, ariaLabel, ariaLabel
         }, className),
         strokeWidth: iconStroke,
     };
-    return (React.createElement("div", { className: cn(styles.iconContainer, containerClassName), ref: ref },
+    return (React.createElement("div", { className: cn(styles.iconContainer, containerClassName), "data-test": dataTest, ref: ref },
         React.createElement(IconElement, { role: role, ...props })));
 });
 Icon.displayName = 'Icon';

package/lib/Icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../src/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,UAAU,EAA2B,MAAM,OAAO,CAAA;AACtE,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,WAAW,MAAM,wCAAwC,CAAA;AAChE,OAAO,MAAM,MAAM,oBAAoB,CAAA;AAuCvC,MAAM,CAAC,MAAM,IAAI,GAAG,UAAU,CAC5B,CACE,EACE,KAAK,EACL,IAAI,EAAE,WAAW,EACjB,SAAS,EACT,cAAc,EACd,UAAU,EACV,SAAS,EACT,kBAAkB,EAClB,IAAI,GAAG,QAAQ,EACf,IAAI,GAAG,KAAK,EACZ,IAAI,GAAG,KAAK,GACb,EACD,GAAG,EACH,EAAE;IACF,MAAM,UAAU,GAAG,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,mBAAmB,CAAC,CAAC,CAAC,WAAW,CAAC,eAAe,CAAA;IAEvF,MAAM,KAAK,GAAyB;QAClC,YAAY,EAAE,SAAS,IAAI,MAAM;QACjC,iBAAiB,EAAE,cAAc;QACjC,aAAa,EAAE,UAAU;QACzB,KAAK;QACL,KAAK,EAAE,KAAK;QACZ,MAAM,EAAE,KAAK;QACb,SAAS,EAAE,EAAE,CACX;YACE,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,IAAI,KAAK,OAAO;YAChC,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,IAAI,KAAK,aAAa;YAC5C,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,IAAI,KAAK,QAAQ;YAClC,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,IAAI,KAAK,OAAO;YAChC,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,IAAI,KAAK,QAAQ;SACnC,EACD,SAAS,CACV;QACD,WAAW,EAAE,UAAU;KACxB,CAAA;IAED,OAAO,CACL,6BAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,aAAa,EAAE,kBAAkB,CAAC,EAAE,GAAG,EAAE,GAAG;QACpE,oBAAC,WAAW,IAAC,IAAI,EAAE,IAAI,KAAM,KAAK,GAAI,CAClC,CACP,CAAA;AACH,CAAC,CACF,CAAA;AACD,IAAI,CAAC,WAAW,GAAG,MAAM,CAAA"}
+{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../src/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,UAAU,EAA2B,MAAM,OAAO,CAAA;AACtE,OAAO,EAAE,MAAM,YAAY,CAAA;AAG3B,OAAO,WAAW,MAAM,wCAAwC,CAAA;AAChE,OAAO,MAAM,MAAM,oBAAoB,CAAA;AAwCvC,MAAM,CAAC,MAAM,IAAI,GAAG,UAAU,CAC5B,CACE,EACE,KAAK,EACL,IAAI,EAAE,WAAW,EACjB,SAAS,EACT,cAAc,EACd,UAAU,EACV,SAAS,EACT,kBAAkB,EAClB,IAAI,GAAG,QAAQ,EACf,IAAI,GAAG,KAAK,EACZ,IAAI,GAAG,KAAK,EACZ,WAAW,EAAE,QAAQ,GACtB,EACD,GAAG,EACH,EAAE;IACF,MAAM,UAAU,GAAG,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,mBAAmB,CAAC,CAAC,CAAC,WAAW,CAAC,eAAe,CAAA;IAEvF,MAAM,KAAK,GAAyB;QAClC,YAAY,EAAE,SAAS,IAAI,MAAM;QACjC,iBAAiB,EAAE,cAAc;QACjC,aAAa,EAAE,UAAU;QACzB,KAAK;QACL,KAAK,EAAE,KAAK;QACZ,MAAM,EAAE,KAAK;QACb,SAAS,EAAE,EAAE,CACX;YACE,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,IAAI,KAAK,OAAO;YAChC,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,IAAI,KAAK,aAAa;YAC5C,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,IAAI,KAAK,QAAQ;YAClC,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,IAAI,KAAK,OAAO;YAChC,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,IAAI,KAAK,QAAQ;SACnC,EACD,SAAS,CACV;QACD,WAAW,EAAE,UAAU;KACxB,CAAA;IAED,OAAO,CACL,6BAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,aAAa,EAAE,kBAAkB,CAAC,eAAa,QAAQ,EAAE,GAAG,EAAE,GAAG;QACzF,oBAAC,WAAW,IAAC,IAAI,EAAE,IAAI,KAAM,KAAK,GAAI,CAClC,CACP,CAAA;AACH,CAAC,CACF,CAAA;AACD,IAAI,CAAC,WAAW,GAAG,MAAM,CAAA"}

package/lib/Link.d.ts

@@ -20,7 +20,7 @@ export type LinkTarget = '_self' | '_blank' | '_parent' | '_top';
 export type LinkRel = 'alternate' | 'author' | 'bookmark' | 'dns-prefetch' | 'external' | 'help' | 'license' | 'next' | 'nofollow' | 'noopener' | 'noreferrer' | 'opener' | 'prev' | 'search' | 'tag';
 export type LinkProps = IconProps & {
     size?: keyof typeof sizes;
-    kind?: 'primary' | 'secondary';
+    kind?: 'primary' | 'secondary' | 'contrast';
     children: ReactNode;
     bold?: boolean;
     onClick?: MouseEventHandler<HTMLButtonElement | HTMLAnchorElement>;

package/lib/Link.js

@@ -26,6 +26,7 @@ export const Link = forwardRef(({ component = 'a', kind = 'primary', size = 'nor
             // kind
             [styles.primary]: kind === 'primary',
             [styles.secondary]: kind === 'secondary',
+            [styles.contrast]: kind === 'contrast',
             // bold
             [styles.bold]: bold,
         }, className),

package/lib/Link.js.map

@@ -1 +1 @@
-{"version":3,"file":"Link.js","sourceRoot":"","sources":["../src/Link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA8C,UAAU,EAAkD,MAAM,OAAO,CAAA;AAErI,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,MAAM,MAAM,oBAAoB,CAAA;AAGvC,MAAM,KAAK,GAAG;IACZ,MAAM,EAAE,MAAM,CAAC,MAAM;IACrB,KAAK,EAAE,MAAM,CAAC,KAAK;IACnB,OAAO,EAAE,MAAM,CAAC,OAAO;CACxB,CAAA;AA8DD;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,UAAU,CAC5B,CACE,EACE,SAAS,GAAG,GAAG,EACf,IAAI,GAAG,SAAS,EAChB,IAAI,GAAG,QAAQ,EACf,IAAI,GAAG,KAAK,EACZ,IAAI,EACJ,SAAS,EACT,aAAa,EACb,IAAI,EACJ,GAAG,GAAG,UAAU,EAChB,MAAM,GAAG,OAAO,EAChB,IAAI,GAAG,QAAQ,EACf,OAAO,EACP,SAAS,EACT,QAAQ,EACR,WAAW,EAAE,QAAQ,GAAG,MAAM,GAC/B,EACD,GAAG,EACH,EAAE;IACF,MAAM,QAAQ,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAA;IAEzD,MAAM,WAAW,GAAG;QAClB,SAAS,EAAE,EAAE,CACX,MAAM,CAAC,IAAI,EACX,MAAM,CAAC,IAAI,CAAC,EACZ;YACE,OAAO;YACP,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,IAAI,KAAK,SAAS;YACpC,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,IAAI,KAAK,WAAW;YACxC,OAAO;YACP,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,IAAI;SACpB,EACD,SAAS,CACV;QACD,IAAI,EAAE,IAAI;QACV,OAAO,EAAE,OAAO;KACjB,CAAA;IAED,MAAM,aAAa,GACjB,IAAI,IAAI,SAAS,CAAC,CAAC,CAAC,CAClB,oBAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,EAAE,SAAS,EAAE,aAAa,GAAI,CAC/H,CAAC,CAAC,CAAC,SAAS,CAAA;IAEf,OAAO,SAAS,KAAK,GAAG,CAAC,CAAC,CAAC,CACzB,8BAAO,WAAW,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,GAA0C,eAAa,QAAQ;QACpH,QAAQ;QACR,aAAa,CACZ,CACL,CAAC,CAAC,CAAC,CACF,mCAAY,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,GAA0C,eAAa,QAAQ;QACtG,QAAQ;QACR,aAAa,CACP,CACV,CAAA;AACH,CAAC,CACF,CAAA;AACD,IAAI,CAAC,WAAW,GAAG,MAAM,CAAA"}
+{"version":3,"file":"Link.js","sourceRoot":"","sources":["../src/Link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA8C,UAAU,EAAkD,MAAM,OAAO,CAAA;AAErI,OAAO,EAAE,MAAM,YAAY,CAAA;AAG3B,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAE7B,OAAO,MAAM,MAAM,oBAAoB,CAAA;AAEvC,MAAM,KAAK,GAAG;IACZ,MAAM,EAAE,MAAM,CAAC,MAAM;IACrB,KAAK,EAAE,MAAM,CAAC,KAAK;IACnB,OAAO,EAAE,MAAM,CAAC,OAAO;CACxB,CAAA;AA8DD;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,UAAU,CAC5B,CACE,EACE,SAAS,GAAG,GAAG,EACf,IAAI,GAAG,SAAS,EAChB,IAAI,GAAG,QAAQ,EACf,IAAI,GAAG,KAAK,EACZ,IAAI,EACJ,SAAS,EACT,aAAa,EACb,IAAI,EACJ,GAAG,GAAG,UAAU,EAChB,MAAM,GAAG,OAAO,EAChB,IAAI,GAAG,QAAQ,EACf,OAAO,EACP,SAAS,EACT,QAAQ,EACR,WAAW,EAAE,QAAQ,GAAG,MAAM,GAC/B,EACD,GAAG,EACH,EAAE;IACF,MAAM,QAAQ,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAA;IAEzD,MAAM,WAAW,GAAG;QAClB,SAAS,EAAE,EAAE,CACX,MAAM,CAAC,IAAI,EACX,MAAM,CAAC,IAAI,CAAC,EACZ;YACE,OAAO;YACP,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,IAAI,KAAK,SAAS;YACpC,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,IAAI,KAAK,WAAW;YACxC,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,IAAI,KAAK,UAAU;YACtC,OAAO;YACP,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,IAAI;SACpB,EACD,SAAS,CACV;QACD,IAAI,EAAE,IAAI;QACV,OAAO,EAAE,OAAO;KACjB,CAAA;IAED,MAAM,aAAa,GACjB,IAAI,IAAI,SAAS,CAAC,CAAC,CAAC,CAClB,oBAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,EAAE,SAAS,EAAE,aAAa,GAAI,CAC/H,CAAC,CAAC,CAAC,SAAS,CAAA;IAEf,OAAO,SAAS,KAAK,GAAG,CAAC,CAAC,CAAC,CACzB,8BAAO,WAAW,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,GAA0C,eAAa,QAAQ;QACpH,QAAQ;QACR,aAAa,CACZ,CACL,CAAC,CAAC,CAAC,CACF,mCAAY,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,GAA0C,eAAa,QAAQ;QACtG,QAAQ;QACR,aAAa,CACP,CACV,CAAA;AACH,CAAC,CACF,CAAA;AACD,IAAI,CAAC,WAAW,GAAG,MAAM,CAAA"}

package/lib/Link.module.scss

@@ -16,6 +16,7 @@
   &.focus,
   &:active,
   &.active {
+    /* doiuse-disable text-decoration */
     text-decoration: underline solid;
     outline: transparent solid c.$outlineWidth;
   }
@@ -32,6 +33,10 @@
   &.secondary {
     color: c.$colorTextSecondary;
   }
+
+  &.contrast {
+    color: c.$colorNeutralLighter;
+  }
 }
 
 .link {

package/lib/Modal.module.scss

@@ -1,3 +1,4 @@
+@use 'sass:color';
 @use '../styles/constants' as c;
 @use '../styles/helpers' as h;
 
@@ -14,7 +15,7 @@
 .overlay {
   width: 100%;
   height: 100%;
-  background-color: transparentize(c.$colorText, 0.2);
+  background-color: color.adjust(c.$colorText, $alpha: -0.2);
   pointer-events: all;
 }
 

package/lib/NumberField.d.ts

@@ -14,6 +14,7 @@ export type NumberFieldExtraProps = Omit<TextFieldProps<'number'>, 'onChange' |
     step?: number;
     min?: number;
     max?: number;
+    disableChangeOnScroll?: boolean;
     defaultValue?: number;
     numberType?: 'int' | 'float';
     iconPosition?: 'separate' | 'together';

package/lib/NumberField.js

@@ -1,11 +1,27 @@
-import React, { useCallback, useMemo } from 'react';
+import React, { useCallback, useMemo, useRef, useEffect } from 'react';
 import { PlusCircle, MinusCircle } from 'react-feather';
 import useIsomorphicLayoutEffect from 'react-use/lib/useIsomorphicLayoutEffect';
 import cn from 'classnames';
 import { TextField } from './TextField';
 import { IconButton } from './IconButton';
 import styles from './NumberField.module.scss';
-export const NumberField = ({ incrementIconAriaLabel = 'Increment', decrementIconAriaLabel = 'Decrement', step = 1, min, max, value, numberType = 'int', iconPosition = 'together', showIconButtons = true, inputClassName, inputContainerClassName, onChange, disabled, size, ...props }) => {
+export const NumberField = ({ incrementIconAriaLabel = 'Increment', decrementIconAriaLabel = 'Decrement', step = 1, min, max, disableChangeOnScroll, value, numberType = 'int', iconPosition = 'together', showIconButtons = true, inputClassName, inputContainerClassName, onChange, disabled, size, ...props }) => {
+    const field = useRef(null);
+    const handleWheel = useCallback((e) => {
+        const target = e.target;
+        target.blur();
+    }, []);
+    useEffect(() => {
+        if (disableChangeOnScroll) {
+            const current = field.current;
+            if (current) {
+                current.addEventListener('wheel', handleWheel);
+                return () => {
+                    current.removeEventListener('wheel', handleWheel);
+                };
+            }
+        }
+    }, [disableChangeOnScroll, handleWheel]);
     useIsomorphicLayoutEffect(() => {
         if (min !== undefined && value !== undefined && value < min) {
             onChange(min);
@@ -118,7 +134,7 @@ export const NumberField = ({ incrementIconAriaLabel = 'Increment', decrementIco
         }
         onChange(newValueParsed);
     }, [onChange, numberType, min, max]);
-    return (React.createElement(TextField, { ...props, value: value, onChange: onChangeWrapped, type: "number", inputContainerChild: overlay, inputContainerClassName: cn(styles.inputContainer, {
+    return (React.createElement(TextField, { ...props, ...(disableChangeOnScroll ? { mRef: field } : {}), value: value, onChange: onChangeWrapped, type: "number", inputContainerChild: overlay, inputContainerClassName: cn(styles.inputContainer, {
             [styles.buttons]: showIconButtons,
             [styles.buttonsIconsSeparate]: iconPosition === 'separate',
             [styles.buttonsRegularIconsSeparate]: iconPosition === 'separate' && size !== 'small',

package/lib/NumberField.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumberField.js","sourceRoot":"","sources":["../src/NumberField.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"NumberField.js","sourceRoot":"","sources":["../src/NumberField.tsx"],"names":[],"mappings":"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"}

package/lib/Overlay.js

@@ -5,6 +5,7 @@ import cn from 'classnames';
 import useIsomorphicLayoutEffect from 'react-use/lib/useIsomorphicLayoutEffect';
 import { Icon } from './Icon';
 import { Link } from './Link';
+import { TruncatedText } from './TruncatedText';
 import styles from './Overlay.module.scss';
 /*
  * ### Purpose
@@ -28,7 +29,8 @@ export const Overlay = ({ 'data-test': dataTest, children, className, headerClas
         React.createElement("div", { "data-test": "overlay-wrapper", className: cn(styles.wrapper, { [styles.normal]: contentWidth === 'normal', [styles.fullscreen]: contentWidth === 'fullscreen' }, wrapperClassName) },
             React.createElement("div", { "data-test": "overlay-header", className: cn(styles.header, headerClassName) },
                 icon && React.createElement(Icon, { "data-test": "overlay-header-icon", className: styles.icon, size: "medium", icon: icon, ariaHidden: true }),
-                title && (React.createElement("h1", { "data-test": "overlay-header-title", className: styles.title }, title)),
+                title && (React.createElement("h1", { "data-test": "overlay-header-title", className: styles.title },
+                    React.createElement(TruncatedText, { multiline: true, text: title }))),
                 headingContent,
                 closable && (React.createElement(Link, { "data-test": "overlay-header-cancel-button", className: styles.close, component: "button", onClick: onClose, size: "small", iconClassName: styles.closeIcon, icon: X, ariaLabel: closeText || 'Cancel' }, !!closeText && React.createElement("span", { className: styles.closeText }, closeText)))),
             React.createElement("div", { "data-test": "overlay-content", className: cn(styles.content, contentClassName) }, children),

package/lib/Overlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"Overlay.js","sourceRoot":"","sources":["../src/Overlay.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Overlay.js","sourceRoot":"","sources":["../src/Overlay.tsx"],"names":[],"mappings":"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"}

package/lib/Overlay.module.scss

@@ -1,3 +1,4 @@
+@use 'sass:color';
 @use '../styles/constants' as c;
 @use '../styles/helpers' as h;
 
@@ -14,7 +15,7 @@
 }
 
 .modal {
-  background: transparentize(c.$colorOverlayBackground, 0.1);
+  background: color.adjust(c.$colorOverlayBackground, $alpha: -0.1);
   width: 100vw;
   height: 100vh;
   z-index: c.$zIndex1000;
@@ -62,7 +63,8 @@
       display: flex;
       justify-content: center;
       align-items: center;
-      min-height: c.$grid * 10;
+      overflow: hidden;
+      flex-shrink: 0;
       margin-bottom: c.$grid * 9;
       padding: 0 c.$grid * 21; // close button width
 
@@ -93,6 +95,7 @@
 
       .title {
         margin: 0;
+        overflow: hidden;
         word-break: break-word;
       }
     }

package/lib/Pagination.js

@@ -58,30 +58,30 @@ export const Pagination = ({ pageCount, currentPage, canPreviousPage, canNextPag
             setPageSize(pageSize);
         }
     }, [setPageSize]);
-    const RowsPerPageSelect = useMemo(() => (React.createElement(SelectField, { className: styles.rowsPerPage, label: "Rows", labelClassName: styles.label, name: "rowsPerPage", value: pageSize, options: rowsPerPageOptions, onChange: onChangeWrapped, isSearchable: false, size: "small" })), [rowsPerPageOptions, pageSize, onChangeWrapped]);
+    const RowsPerPageSelect = useMemo(() => (React.createElement(SelectField, { className: styles.rowsPerPage, label: "Rows", labelClassName: styles.label, name: "rowsPerPage", value: pageSize, options: rowsPerPageOptions, onChange: onChangeWrapped, isSearchable: false, size: "small", "data-test": "pagination-rows-per-page-select" })), [rowsPerPageOptions, pageSize, onChangeWrapped]);
     const submitPageJump = useCallback(() => {
         goToPage(currentPageValue || 0);
     }, [goToPage, currentPageValue]);
     const PageJumpForm = useMemo(() => {
         if (pageCount > 1) {
-            return (React.createElement("div", { className: styles.pageJumpForm },
-                React.createElement(NumberField, { showIconButtons: false, inputContainerClassName: styles.inputContainer, name: "page", label: "Go to page", showAriaLabel: true, min: 1, max: pageCount, size: "small", value: currentPageValue, onChange: setCurrentPageValue }),
-                React.createElement(Link, { size: "small", component: "button", type: "submit", onClick: submitPageJump }, "Go")));
+            return (React.createElement("div", { "data-test": "pagination-jump-from", className: styles.pageJumpForm },
+                React.createElement(NumberField, { showIconButtons: false, inputContainerClassName: styles.inputContainer, name: "page", label: "Go to page", showAriaLabel: true, min: 1, max: pageCount, size: "small", value: currentPageValue, "data-test": "pagination-jump-from-input-field", onChange: setCurrentPageValue }),
+                React.createElement(Link, { "data-test": "pagination-jump-from-button", size: "small", component: "button", type: "submit", onClick: submitPageJump }, "Go")));
         }
     }, [currentPageValue, pageCount, submitPageJump]);
     const PageButtons = useDeepCompareMemo(() => {
         if (pageCount > 1) {
             return (React.createElement("div", { "data-test": "pagination-buttons", className: styles.buttons }, pages.map((page, i) => {
                 if (page === 'previous') {
-                    return canPreviousPage ? (React.createElement(IconButton, { key: "previous", kind: "primary", icon: ChevronLeft, ariaLabel: "Previous page", className: styles.iconButton, onClick: previousPage })) : null;
+                    return canPreviousPage ? (React.createElement(IconButton, { key: "previous", kind: "primary", icon: ChevronLeft, ariaLabel: "Previous page", className: styles.iconButton, onClick: previousPage, "data-test": "pagination-buttons-previous-page" })) : null;
                 }
                 if (page === 'next') {
-                    return canNextPage ? (React.createElement(IconButton, { key: "next", kind: "primary", icon: ChevronRight, ariaLabel: "Next page", className: styles.iconButton, onClick: nextPage })) : null;
+                    return canNextPage ? (React.createElement(IconButton, { key: "next", kind: "primary", icon: ChevronRight, ariaLabel: "Next page", className: styles.iconButton, onClick: nextPage, "data-test": "pagination-buttons-next-page" })) : null;
                 }
                 if (page === 'ellipsis') {
-                    return React.createElement("span", { key: `ellipsis-${i}` }, "\u2013");
+                    return (React.createElement("span", { "data-test": "pagination-buttons-ellipsis", key: `ellipsis-${i}` }, "\u2013"));
                 }
-                return (React.createElement(Button, { key: page, type: "button", kind: "transparent", className: cn(styles.button, {
+                return (React.createElement(Button, { key: page, type: "button", variant: "text", "data-test": "pagination-buttons-go-to-page", className: cn(styles.button, {
                         [styles.selected]: page === currentPage,
                     }), bodyClassName: styles.body, outlineClassName: styles.outline, capitalize: false, onClick: () => {
                         goToPage(page);
@@ -90,7 +90,7 @@ export const Pagination = ({ pageCount, currentPage, canPreviousPage, canNextPag
         }
     }, [canNextPage, canPreviousPage, currentPage, goToPage, nextPage, previousPage, pageCount, pages]);
     const [moreOptions, setMoreOptions] = useState(false);
-    return (React.createElement("div", { ref: containerWidthRef, className: styles.container },
+    return (React.createElement("div", { "data-test": "pagination", ref: containerWidthRef, className: styles.container },
         displaySmall && moreOptions && !isSimpleView ? (React.createElement(React.Fragment, null,
             PageJumpForm,
             RowsPerPageSelect)) : (PageButtons),