@hazelcast/ui 3.0.13 → 4.0.1-canary.10

package/lib/old/Button.d.ts

@@ -0,0 +1,75 @@
+import React, { ButtonHTMLAttributes, HTMLAttributes, ReactElement } from 'react';
+import { IconProps, IconSize } from '../components/Icon';
+import { TooltipSide } from '../components/Tooltip';
+import { LinkRel, LinkTarget } from '../components/Link';
+import { DataTestProp } from '../helpers/types';
+export type ButtonVariant = 'contained' | 'outlined' | 'text';
+export type ButtonColor = 'primary' | 'secondary' | 'warning' | 'brand' | 'authPrimary' | 'authSecondary' | 'light';
+export type ButtonAccessibleIconLeftProps = {
+    iconLeft: IconProps['icon'];
+    iconLeftAriaLabel: string;
+    iconLeftColor?: IconProps['color'];
+    iconLeftClassName?: string;
+} | {
+    iconLeft?: never;
+    iconLeftAriaLabel?: never;
+    iconLeftColor?: never;
+    iconLeftClassName?: never;
+};
+export type ButtonAccessibleIconRightProps = {
+    iconRight: IconProps['icon'];
+    iconRightAriaLabel: string;
+    iconRightColor?: IconProps['color'];
+    iconRightClassName?: string;
+} | {
+    iconRight?: never;
+    iconRightAriaLabel?: never;
+    iconRightColor?: never;
+    iconRightClassName?: never;
+};
+type ButtonNotDisabledProps = {
+    disabled?: never;
+    disabledTooltip?: never;
+    disabledTooltipVisible?: never;
+    disabledTooltipPlacement?: never;
+};
+export type ButtonDisabledProps = {
+    disabledTooltip?: string;
+    disabled: boolean;
+    disabledTooltipVisible?: boolean;
+    disabledTooltipPlacement?: TooltipSide;
+};
+export type ButtonOutlineType = 'outline' | 'inset';
+export type ButtonCommonProps = {
+    children: string | ReactElement;
+    iconSize?: IconSize;
+    color?: ButtonColor;
+    capitalize?: boolean;
+    bodyClassName?: string;
+    variant?: ButtonVariant;
+    outlineClassName?: string;
+    outline?: ButtonOutlineType;
+    tooltip?: string;
+    tooltipColor?: 'dark' | 'secondary';
+    active?: boolean;
+    truncate?: boolean;
+} & (ButtonDisabledProps | ButtonNotDisabledProps) & Pick<HTMLAttributes<HTMLAnchorElement | HTMLButtonElement>, 'className' | 'onClick' | 'tabIndex' | 'style'>;
+export type ButtonTypeAnchorProps = {
+    component: 'a';
+    href: string;
+    target?: LinkTarget;
+    rel?: LinkRel | LinkRel[];
+    type?: never;
+    loading?: never;
+};
+export type ButtonTypeButtonProps = {
+    component?: 'button';
+    href?: never;
+    target?: never;
+    rel?: never;
+    loading?: boolean;
+} & Pick<ButtonHTMLAttributes<HTMLButtonElement>, 'autoFocus' | 'type'>;
+export type ButtonTypeProps = ButtonTypeAnchorProps | ButtonTypeButtonProps;
+export type ButtonProps<T = ButtonTypeProps> = ButtonCommonProps & T & ButtonAccessibleIconLeftProps & ButtonAccessibleIconRightProps & DataTestProp;
+export declare const Button: React.ForwardRefExoticComponent<ButtonProps<ButtonTypeProps> & React.RefAttributes<HTMLElement>>;
+export {};

package/lib/old/Button.js

@@ -0,0 +1,37 @@
+import React, { forwardRef } from 'react';
+import cn from 'classnames';
+import { useUID } from 'react-uid';
+import { Icon } from '../components/Icon';
+import { TruncatedText } from '../components/TruncatedText';
+import { Tooltip } from '../components/Tooltip';
+import { Loader } from '../components/Loader';
+import styles from './ButtonLegacy.module.scss';
+const capitalizeFirstCharacter = (str) => `${str[0].toUpperCase()}${str.slice(1)}`;
+export const Button = forwardRef(({ component: Component = 'button', className, bodyClassName, outlineClassName, outline = 'outline', children, capitalize = true, disabled, disabledTooltip, disabledTooltipVisible, disabledTooltipPlacement, iconLeft, iconLeftAriaLabel, iconLeftColor, iconLeftClassName, iconRight, iconRightAriaLabel, iconRightColor, iconRightClassName, rel = 'noopener', target, type = 'button', loading, variant = 'contained', color = 'primary', tooltip, active, truncate = true, iconSize: propIconSize, tooltipColor, ...rest }, ref) => {
+    const tooltipId = useUID();
+    const iconSize = propIconSize !== null && propIconSize !== void 0 ? propIconSize : 'small';
+    const relFinal = Array.isArray(rel) ? rel.join(' ') : rel;
+    const loadingAnimationOnRight = loading && iconRight && iconRightAriaLabel && !(iconLeft && iconLeftAriaLabel);
+    return (React.createElement(Tooltip, { id: tooltipId, color: tooltipColor, content: disabled ? disabledTooltip : tooltip, open: disabled && disabledTooltipVisible, side: disabledTooltipPlacement },
+        React.createElement(Component, { "data-test": "button", className: cn(styles.button, {
+                [styles[`color${capitalizeFirstCharacter(color)}`]]: true,
+                [styles[`variant${capitalizeFirstCharacter(variant)}`]]: true,
+                [styles.active]: active,
+            }, className), "aria-describedby": disabled ? tooltipId : undefined, disabled: disabled !== null && disabled !== void 0 ? disabled : loading, rel: Component === 'a' ? relFinal : undefined, target: Component === 'a' ? target : undefined, type: Component === 'button' ? type : undefined, ref: ref, ...rest },
+            React.createElement("span", { "data-test": "button-outline", className: cn(styles.outline, { [styles.inset]: outline === 'inset' }, outlineClassName) }),
+            React.createElement("span", { className: cn(styles.body, bodyClassName) },
+                loading && !loadingAnimationOnRight && React.createElement(Loader, { className: styles.iconLeft, size: iconSize }),
+                iconLeft && iconLeftAriaLabel && !loading && (React.createElement(Icon, { icon: iconLeft, ariaLabel: iconLeftAriaLabel, "data-test": "button-icon-left", className: cn(styles.iconLeft, iconLeftClassName), size: iconSize, color: iconLeftColor })),
+                truncate ? (React.createElement(TruncatedText, { text: capitalize && typeof children === 'string' ? children.toUpperCase() : children, 
+                    /*
+                      If a button is disabled and text is long we don't want to show 2 popups.
+                      1. In case a button is disabled and no `disabledTooltipVisible` is enforced, we just hide truncated popup.
+                      2. In case a button is disabled and disabledTooltip is hidden with a false flag, there is a space to show
+                      the truncated popup -> setting it to undefined will leave the default behaviour.
+                    */
+                    tooltipVisible: disabled && disabledTooltipVisible !== false ? false : undefined })) : (children),
+                loadingAnimationOnRight && React.createElement(Loader, { className: styles.iconRight, size: iconSize }),
+                !loadingAnimationOnRight && iconRight && iconRightAriaLabel && (React.createElement(Icon, { icon: iconRight, ariaLabel: iconRightAriaLabel, "data-test": "button-icon-right", className: cn(styles.iconRight, iconRightClassName), size: iconSize, color: iconRightColor }))))));
+});
+Button.displayName = 'Button';
+//# sourceMappingURL=Button.js.map

package/lib/old/Button.js.map

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

package/lib/{components/Button.module.scss → old/ButtonLegacy.module.scss}

@@ -21,7 +21,7 @@
   cursor: pointer;
   border: none;
   padding: 0;
-  border-radius: c.$borderRadiusButtonSmall;
+  border-radius: 8px;
   height: c.$inputHeightSmall;
   max-width: c.$buttonMaxWidth;
 
@@ -30,15 +30,9 @@
 
   @include c.typographyButton('small');
 
-  &.medium {
-    height: c.$grid * 10.75;
-
-    @include c.typographyButton('medium');
-  }
-
   .outline {
     position: absolute;
-    border-radius: c.$borderRadiusButtonSmall;
+    border-radius: 8px;
     pointer-events: none;
     top: 50%;
     left: 50%;

package/lib/old/Checkbox.d.ts

@@ -0,0 +1,35 @@
+import React, { ChangeEvent, FocusEvent, ReactElement, MouseEvent } from 'react';
+import { HelpProps } from '../components/Help';
+import { DataTestProp } from '../helpers/types';
+type CheckboxCoreProps = {
+    name: string;
+    value?: string;
+    onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
+    onChange: (e: ChangeEvent<HTMLInputElement>) => void;
+    onClick?: (e: MouseEvent<HTMLInputElement>) => void;
+    error?: string;
+    checked?: boolean;
+};
+export type CheckboxExtraProps = {
+    label?: ReactElement | string;
+    helperText?: HelpProps['helperText'];
+    indeterminate?: boolean;
+    disabled?: boolean;
+    required?: boolean;
+    className?: string;
+    classNameLabel?: string;
+    'aria-label'?: string;
+    classNameCheckmark?: string;
+};
+/**
+ * ### Purpose
+ * Forms require input from users. If you need information that can be represented as boolean, use input with type 'checkbox'.
+ * Checkbox fields accept boolean types of data. And help and error guidance to ensure they know what to enter.
+ *
+ *
+ * ### General Info
+ * - It's important to realise that we don't set checkbox value, but state (on/off). That is the main difference from other input types.
+ * - They can have a special indeterminate state, that represents a '3rd' value, usually used in tree structures, etc.
+ */
+export declare const Checkbox: React.ForwardRefExoticComponent<CheckboxCoreProps & CheckboxExtraProps & DataTestProp & React.RefAttributes<HTMLDivElement>>;
+export {};

package/lib/old/Checkbox.js

@@ -0,0 +1,38 @@
+import React, { useRef, forwardRef } from 'react';
+import { Check, Minus } from 'react-feather';
+import { useUID } from 'react-uid';
+import classNames from 'classnames';
+import { Error, errorId } from '../components/Error';
+import { Help, helpTooltipId } from '../components/Help';
+import styles from './CheckboxLegacy.module.scss';
+import { TruncatedText } from '../components/TruncatedText';
+/**
+ * ### Purpose
+ * Forms require input from users. If you need information that can be represented as boolean, use input with type 'checkbox'.
+ * Checkbox fields accept boolean types of data. And help and error guidance to ensure they know what to enter.
+ *
+ *
+ * ### General Info
+ * - It's important to realise that we don't set checkbox value, but state (on/off). That is the main difference from other input types.
+ * - They can have a special indeterminate state, that represents a '3rd' value, usually used in tree structures, etc.
+ */
+export const Checkbox = forwardRef((props, ref) => {
+    const { checked, name, onChange, onBlur, className, classNameLabel, classNameCheckmark, value, indeterminate = false, label, helperText, error, disabled = false, required, 'data-test': dataTest = 'checkbox', 'aria-label': ariaLabel, onClick, } = props;
+    const inputRef = useRef(null);
+    const id = useUID();
+    return (React.createElement("div", { ref: ref, className: classNames(className, { [styles.withError]: 'error' in props }), "data-test": dataTest },
+        React.createElement("label", { className: classNames(styles.wrapper, {
+                [styles.error]: !!error,
+                [styles.checked]: checked,
+                [styles.disabled]: disabled,
+                [styles.indeterminate]: indeterminate,
+            }, classNameLabel), htmlFor: id },
+            label !== undefined && (React.createElement("div", { className: styles.name, "data-test": "input-checkbox-label" },
+                React.createElement(TruncatedText, { text: label }))),
+            React.createElement("input", { type: "checkbox", ref: inputRef, id: id, name: name, "aria-label": ariaLabel, checked: !!checked, onChange: onChange, onBlur: onBlur, onClick: onClick, value: value, disabled: disabled, "aria-invalid": !!error, "aria-required": required, "aria-describedby": helperText && helpTooltipId(id), "aria-errormessage": error && errorId(id) }),
+            indeterminate ? (React.createElement(Minus, { "data-test": `${dataTest}-minus`, className: classNames(styles.checkmark, classNameCheckmark) })) : (React.createElement(Check, { "data-test": `${dataTest}-check`, className: classNames(styles.checkmark, classNameCheckmark) })),
+            helperText && React.createElement(Help, { parentId: id, helperText: helperText, className: styles.helperText })),
+        React.createElement(Error, { truncated: true, error: error, className: styles.errorContainer, inputId: id })));
+});
+Checkbox.displayName = 'Checkbox';
+//# sourceMappingURL=Checkbox.js.map

package/lib/old/Checkbox.js.map

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

package/lib/old/CheckboxFormik.d.ts

@@ -0,0 +1,10 @@
+import { ReactElement } from 'react';
+import { CheckboxExtraProps } from './Checkbox';
+import { FieldValidatorGeneric } from '../utils/formik';
+import { ExtractKeysOfValueType } from '../utils/types';
+export type CheckboxFieldFormikProps<V extends object> = CheckboxExtraProps & {
+    name: ExtractKeysOfValueType<V, boolean>;
+    validate?: FieldValidatorGeneric<boolean>;
+    onChange?: (value: boolean) => void;
+};
+export declare const CheckboxFormik: <V extends object>({ name, validate, onChange, ...props }: CheckboxFieldFormikProps<V>) => ReactElement;

package/lib/old/CheckboxFormik.js

@@ -0,0 +1,17 @@
+import React, { useCallback } from 'react';
+import { useField } from 'formik';
+import { Checkbox } from './Checkbox';
+import { getFieldError } from '../utils/formik';
+export const CheckboxFormik = ({ name, validate, onChange, ...props }) => {
+    const [{ onBlur, onChange: onFormikChange, value }, meta] = useField({
+        name,
+        validate,
+    });
+    return (React.createElement(Checkbox, { ...props, name: name, checked: value, onChange: useCallback((e) => {
+            if (onChange) {
+                onChange(e.target.checked);
+            }
+            onFormikChange(e);
+        }, [onFormikChange, onChange]), onBlur: onBlur, error: getFieldError(meta) }));
+};
+//# sourceMappingURL=CheckboxFormik.js.map

package/lib/old/CheckboxFormik.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxFormik.js","sourceRoot":"","sources":["../../src/old/CheckboxFormik.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAgB,WAAW,EAAE,MAAM,OAAO,CAAA;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAEjC,OAAO,EAAE,QAAQ,EAAsB,MAAM,YAAY,CAAA;AACzD,OAAO,EAAyB,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAStE,MAAM,CAAC,MAAM,cAAc,GAAG,CAAmB,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,KAAK,EAA+B,EAAgB,EAAE;IACpI,MAAM,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,cAAc,EAAE,KAAK,EAAE,EAAE,IAAI,CAAC,GAAG,QAAQ,CAAU;QAC5E,IAAI;QACJ,QAAQ;KACT,CAAC,CAAA;IAEF,OAAO,CACL,oBAAC,QAAQ,OACH,KAAK,EACT,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,KAAK,EACd,QAAQ,EAAE,WAAW,CACnB,CAAC,CAAC,EAAE,EAAE;YACJ,IAAI,QAAQ,EAAE,CAAC;gBACb,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAA;YAC5B,CAAC;YAED,cAAc,CAAC,CAAC,CAAC,CAAA;QACnB,CAAC,EACD,CAAC,cAAc,EAAE,QAAQ,CAAC,CAC3B,EACD,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,aAAa,CAAC,IAAI,CAAC,GAC1B,CACH,CAAA;AACH,CAAC,CAAA"}

package/lib/old/IconButton.d.ts

@@ -0,0 +1,49 @@
+import React, { ButtonHTMLAttributes } from 'react';
+import { Icon as FeatherIcon } from 'react-feather';
+import { IconProps, IconAriaProps } from '../components/Icon';
+import { TooltipSide } from '../components/Tooltip';
+import { LinkRel, LinkTarget } from '../components/Link';
+import { DataTestProp } from '../helpers/types';
+export type IconButtonKind = 'primary' | 'transparent';
+type IconButtonCommonProps = {
+    icon: FeatherIcon;
+    iconClassName?: string;
+    iconColor?: string;
+    iconRole?: string;
+    loaderRole?: string;
+    kind?: IconButtonKind;
+    size?: IconProps['size'];
+    padding?: 'normal';
+    tooltip?: string;
+    tooltipVisible?: boolean;
+    tooltipPlacement?: TooltipSide;
+} & DataTestProp & IconAriaProps & Pick<ButtonHTMLAttributes<HTMLAnchorElement | HTMLButtonElement>, 'onClick' | 'onMouseDown' | 'className' | 'tabIndex' | 'style'>;
+export type IconButtonNotDisabledProps = {
+    disabledTooltip?: never;
+    disabled?: never;
+    disabledTooltipPlacement?: never;
+    disabledTooltipVisible?: never;
+};
+export type IconButtonDisabledProps = {
+    disabledTooltip: string;
+    disabled: boolean;
+    disabledTooltipPlacement?: TooltipSide;
+    disabledTooltipVisible?: boolean;
+};
+type IconButtonComponentProps = ({
+    component: 'a';
+    href: string;
+    target?: LinkTarget;
+    rel?: LinkRel | LinkRel[];
+    type?: never;
+    loading?: never;
+} & IconButtonNotDisabledProps) | ({
+    component?: 'button';
+    href?: never;
+    target?: never;
+    rel?: never;
+    loading?: boolean;
+} & (IconButtonDisabledProps | IconButtonNotDisabledProps) & Pick<ButtonHTMLAttributes<HTMLButtonElement>, 'autoFocus' | 'type'>);
+export type IconButtonProps = IconButtonCommonProps & IconButtonComponentProps;
+export declare const IconButton: React.ForwardRefExoticComponent<IconButtonProps & React.RefAttributes<HTMLElement>>;
+export {};

package/lib/old/IconButton.js

@@ -0,0 +1,25 @@
+import React, { forwardRef } from 'react';
+import cn from 'classnames';
+import { useUID } from 'react-uid';
+import { Icon } from '../components/Icon';
+import { Tooltip } from '../components/Tooltip';
+import { Loader } from '../components/Loader';
+import styles from './IconButtonLegacy.module.scss';
+export const IconButton = forwardRef(({ component: Component = 'button', icon, iconClassName, iconColor, iconRole, loaderRole, className, size, kind = 'transparent', ariaHidden, ariaLabelledBy, ariaLabel, 
+// Disabled tooltip
+disabled, disabledTooltip, disabledTooltipVisible, disabledTooltipPlacement, rel = 'noopener', target, type = 'button', loading, padding, tooltip, tooltipPlacement, tooltipVisible, 'data-test': dataTest = 'icon-button', ...rest }, ref) => {
+    const tooltipId = useUID();
+    const relFinal = Array.isArray(rel) ? rel.join(' ') : rel;
+    const labelledByFinal = [ariaLabelledBy, disabled ? tooltipId : undefined].filter(Boolean).join(' ');
+    return (React.createElement(Tooltip, { id: tooltipId, content: disabled ? disabledTooltip : tooltip, side: disabled ? disabledTooltipPlacement : tooltipPlacement, open: disabled ? disabledTooltipVisible : tooltipVisible },
+        React.createElement(Component, { className: cn(styles.iconButton, {
+                [styles.primary]: kind === 'primary',
+                [styles.transparent]: kind === 'transparent',
+                [styles.paddingNormal]: padding === 'normal',
+            }, className), "aria-hidden": ariaHidden, "aria-label": ariaLabel, "aria-labelledby": labelledByFinal, disabled: disabled !== null && disabled !== void 0 ? disabled : loading, rel: Component === 'a' ? relFinal : undefined, target: Component === 'a' ? target : undefined, type: Component === 'button' ? type : undefined, "data-test": dataTest, ...rest },
+            React.createElement("span", { className: styles.body, ref: ref },
+                loading && React.createElement(Loader, { role: loaderRole, size: size }),
+                !loading && (React.createElement(Icon, { role: iconRole, className: iconClassName, color: iconColor, "data-test": `${dataTest}-icon`, icon: icon, size: size, ariaHidden: true }))))));
+});
+IconButton.displayName = 'IconButton';
+//# sourceMappingURL=IconButton.js.map

package/lib/old/IconButton.js.map

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

package/lib/old/InteractiveList.d.ts

@@ -0,0 +1,34 @@
+import React from 'react';
+import { DataTestProp } from '../helpers/types';
+import { ExtractKeysOfValueType } from '../utils/types';
+import { FieldHeaderProps } from '../components/FieldHeader';
+import { TextFieldExtraProps } from './TextField';
+export type InteractiveListExtraProps = {
+    children?: React.ReactNode | React.ReactNode[];
+    iconClassName?: string;
+    itemClassName?: string;
+    listClassName?: string;
+} & Pick<TextFieldExtraProps<'text'>, 'inputIcon' | 'type' | 'placeholder' | 'inputClassName' | 'className'> & Omit<FieldHeaderProps, 'id'>;
+export type InteractiveListCoreProps<V> = {
+    name: ExtractKeysOfValueType<V, string[]>;
+    value: string[];
+    error?: string;
+    inputValue: string;
+    setInputValue: (val: string) => void;
+    onAddItem: () => Promise<string | undefined>;
+    onRemoveItem: (idx: number) => boolean;
+} & InteractiveListExtraProps & DataTestProp;
+export type InteractiveListProps<V> = InteractiveListExtraProps & InteractiveListCoreProps<V>;
+export type InteractiveListInputRef = {
+    setValue: (value: string) => void;
+    addItem: () => Promise<string | undefined>;
+    getValue: () => string;
+};
+export type InteractiveListItemProps = {
+    content: string;
+    error?: string;
+    idx: number;
+    onRemoveItem: (idx: number) => boolean;
+} & DataTestProp;
+export declare const InteractiveListItem: ({ onRemoveItem, content, error, idx, "data-test": dataTest }: InteractiveListItemProps) => React.JSX.Element;
+export declare const InteractiveList: <V>({ label, children, error, name, value, helperText, placeholder, inputIcon, type, inputValue, setInputValue, onAddItem, onRemoveItem, className, inputClassName, iconClassName, itemClassName, listClassName, "data-test": dataTest, }: InteractiveListProps<V>) => React.JSX.Element;

package/lib/old/InteractiveList.js

@@ -0,0 +1,43 @@
+import React from 'react';
+import { Plus, X } from 'react-feather';
+import { useUID } from 'react-uid';
+import cn from 'classnames';
+import { Error, errorId } from '../components/Error';
+import { TextField } from './TextField';
+import { IconButton } from './IconButton';
+import styles from './InteractiveListLegacy.module.scss';
+export const InteractiveListItem = ({ onRemoveItem, content, error, idx, 'data-test': dataTest }) => {
+    const id = useUID();
+    const errorProps = error
+        ? {
+            'aria-invalid': true,
+            'aria-errormessage': errorId(id),
+        }
+        : {};
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { "data-test": dataTest, className: styles.content },
+            React.createElement("span", { id: id, ...errorProps }, content),
+            ' ',
+            React.createElement(IconButton, { kind: "transparent", ariaLabel: "Remove Item", icon: X, className: styles.removeIcon, onClick: () => {
+                    onRemoveItem(idx);
+                } })),
+        error && React.createElement(Error, { error: error, inputId: id })));
+};
+export const InteractiveList = ({ label, children, error, name, value, helperText, placeholder, inputIcon, type, inputValue, setInputValue, onAddItem, onRemoveItem, className, inputClassName, iconClassName, itemClassName, listClassName, 'data-test': dataTest = 'interactive-list', }) => {
+    const id = useUID();
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { "data-test": dataTest, className: cn(styles.inputRow, className) },
+            React.createElement(TextField, { id: id, type: type, helperText: helperText, placeholder: placeholder, inputIcon: inputIcon, inputClassName: cn(styles.input, inputClassName), inputContainerClassName: styles.inputContainer, inputBorderOverlayClassName: styles.inputBorderOverlay, error: typeof error === 'string' ? error : undefined, label: label, name: name, value: inputValue, onChange: ({ target: { value } }) => {
+                    setInputValue(value);
+                }, onKeyDown: async (e) => {
+                    if (e.key === 'Enter') {
+                        e.preventDefault();
+                        await onAddItem();
+                    }
+                } },
+                React.createElement(IconButton, { "data-test": `${dataTest}-add-button`, kind: "primary", ariaLabel: "Add Icon", icon: Plus, className: cn(styles.addIcon, iconClassName), onClick: () => void onAddItem() }))),
+        children,
+        React.createElement("ul", { className: cn(styles.list, listClassName) }, value.map((str, idx) => (React.createElement("li", { key: str, className: itemClassName },
+            React.createElement(InteractiveListItem, { onRemoveItem: onRemoveItem, idx: idx, content: str, "data-test": `${dataTest}-item`, error: typeof error === 'object' && error[idx] ? error[idx] : undefined })))))));
+};
+//# sourceMappingURL=InteractiveList.js.map

package/lib/old/InteractiveList.js.map

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

package/lib/old/InteractiveListFormik.d.ts

@@ -0,0 +1,10 @@
+import { ReactElement, Ref } from 'react';
+import { FieldValidator } from 'formik';
+import { ExtractKeysOfValueType } from '../utils/types';
+import { InteractiveListExtraProps, InteractiveListInputRef } from './InteractiveList';
+export type InteractiveListFormikProps<V extends object> = InteractiveListExtraProps & {
+    name: ExtractKeysOfValueType<V, string[]>;
+    validate?: FieldValidator;
+    inputControlRef?: Ref<InteractiveListInputRef>;
+};
+export declare const InteractiveListFormik: <V extends object>({ name, validate, children, inputControlRef, ...props }: InteractiveListFormikProps<V>) => ReactElement;

package/lib/old/InteractiveListFormik.js

@@ -0,0 +1,75 @@
+import React, { useCallback, useEffect, useImperativeHandle, useMemo, useState } from 'react';
+import { FieldArray, useField, useFormikContext } from 'formik';
+import { getFieldError } from '../utils/formik';
+import { InteractiveList } from './InteractiveList';
+export const InteractiveListFormik = ({ name, validate, children, inputControlRef, ...props }) => {
+    const { validateForm, values: valuesFormik } = useFormikContext();
+    const [field, meta, { setTouched, setError, setValue }] = useField({
+        name,
+        validate,
+    });
+    const [inputValue, setInputValue] = useState('');
+    const [inputTouched, setInputTouched] = useState(false);
+    const normalizedValue = useMemo(() => inputValue.trim(), [inputValue]);
+    const getValidationError = useCallback(async () => {
+        let validationError = undefined;
+        if (normalizedValue.length === 0) {
+            validationError = 'You need to provide a non empty value';
+        }
+        if (validationError === undefined && field.value.includes(normalizedValue)) {
+            validationError = 'You need to provide a unique value';
+        }
+        if (validationError === undefined && validate) {
+            const error = await validate(normalizedValue);
+            if (error) {
+                validationError = error;
+            }
+        }
+        if (validationError === undefined) {
+            const formikErrors = await validateForm({
+                ...valuesFormik,
+                [name]: [...field.value, normalizedValue],
+            });
+            const fieldErrors = formikErrors[name];
+            validationError = typeof fieldErrors === 'string' ? fieldErrors : fieldErrors === null || fieldErrors === void 0 ? void 0 : fieldErrors.find((x) => !!x);
+        }
+        return validationError;
+    }, [field.value, name, normalizedValue, validate, validateForm, valuesFormik]);
+    const onError = useCallback((value) => {
+        setTouched(true, false);
+        // @ts-expect-error Formik expects string[] in typings, while runtime supports string | string[]
+        setError(value);
+    }, [setTouched, setError]);
+    const addItem = useCallback(async () => {
+        const validationError = await getValidationError();
+        if (validationError) {
+            onError(validationError);
+            setInputTouched(true);
+            return validationError;
+        }
+        field.value.push(normalizedValue);
+        setValue(field.value);
+        setInputTouched(false);
+        setInputValue('');
+        return undefined;
+    }, [field.value, getValidationError, normalizedValue, onError, setValue]);
+    useImperativeHandle(inputControlRef, () => ({
+        setValue: (value) => {
+            setInputValue(value);
+        },
+        addItem,
+        getValue: () => inputValue,
+    }));
+    useEffect(() => {
+        if (inputTouched) {
+            void getValidationError().then((validationError) => {
+                if (validationError) {
+                    onError(validationError);
+                }
+            });
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [inputTouched, inputValue]);
+    return (React.createElement(FieldArray, { name: name, render: (arrayHelpers) => (React.createElement(InteractiveList, { ...props, name: name, value: field.value, inputValue: inputValue, setInputValue: setInputValue, error: getFieldError(meta), onAddItem: addItem, onRemoveItem: (idx) => !!arrayHelpers.remove(idx) }, children)) }));
+};
+//# sourceMappingURL=InteractiveListFormik.js.map

package/lib/old/InteractiveListFormik.js.map

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

package/lib/old/Modal.d.ts

@@ -0,0 +1,26 @@
+import { FC, ReactNode } from 'react';
+import { Props as ReactModalProps } from 'react-modal';
+import { DataTestProp } from '../helpers/types';
+import { ButtonProps, ButtonTypeButtonProps } from './Button';
+import { IconProps } from '../components/Icon';
+export declare const setAppElement: (appElement: string | HTMLElement) => void;
+export type ModalActionProps = ButtonProps<ButtonTypeButtonProps>;
+export type ModalProps = {
+    actions?: ModalActionProps[];
+    hideActions?: boolean;
+    autoFocus?: boolean;
+    children?: ReactNode;
+    closable?: boolean;
+    showCloseButton?: boolean;
+    bodyClassName?: string;
+    headerClassName?: string;
+    contentClassName?: string;
+    footerClassName?: string;
+    overlayClassName?: string;
+    className?: string;
+    icon?: IconProps['icon'];
+    iconAriaLabel?: IconProps['ariaLabel'];
+    onClose: ReactModalProps['onRequestClose'];
+    title: string;
+} & DataTestProp & Exclude<ReactModalProps, 'onRequestClose' | 'shouldFocusAfterRender' | 'shouldReturnFocusAfterClose'>;
+export declare const Modal: FC<ModalProps>;

package/lib/old/Modal.js

@@ -0,0 +1,41 @@
+import React, { useMemo } from 'react';
+import ReactModal from 'react-modal';
+import cn from 'classnames';
+import { X } from 'react-feather';
+import { Button } from './Button';
+import { Icon } from '../components/Icon';
+import { IconButton } from './IconButton';
+import styles from './ModalLegacy.module.scss';
+// Direct re-exporting is breaking tests in MC
+// TODO: Investigate why
+export const setAppElement = (appElement) => ReactModal.setAppElement(appElement);
+/*
+ * ### Purpose
+ * Occasionally there's a user-story that's not a part of the main user flow. Such action can be contained in a Modal.
+ * Modals can contain components like forms, menus, tables etc.
+ * Usually modals are used to drive a complex action. In case there is a simple action (e.g. confirmation), consider using a Dialog.
+ *
+ * ### General Info
+ * - Modal always contains a title, icon "X" in the header, content and active buttons in the footer.
+ * - No interactions on the underlying page can be performed while a Modal.
+ * - Content beneath the modal is covered by a "blanket".
+ * - To close the Modal, use "Cancel" button in the footer, "X" button in the header, press "Esc" key or click anywhere on the "blanket".
+ */
+export const Modal = ({ 'data-test': dataTest = 'modal', actions, hideActions = false, autoFocus = true, children, className, closable = true, showCloseButton = true, bodyClassName, headerClassName, contentClassName, footerClassName, icon, iconAriaLabel, onClose, overlayClassName, title, ...rest }) => {
+    const shouldAutoFocusCancelButton = useMemo(() => autoFocus && !(actions === null || actions === void 0 ? void 0 : actions.some((action) => action === null || action === void 0 ? void 0 : action.autoFocus)), [autoFocus, actions]);
+    return (React.createElement(ReactModal, { portalClassName: styles.portal, className: cn(styles.modal, className), contentLabel: title, onRequestClose: onClose, overlayClassName: cn(styles.overlay, overlayClassName), shouldCloseOnEsc: closable, shouldCloseOnOverlayClick: closable, shouldFocusAfterRender: false, shouldReturnFocusAfterClose: true, ...rest },
+        React.createElement("div", { className: styles.outline }),
+        React.createElement("div", { className: cn(styles.body, bodyClassName) },
+            React.createElement("div", { "data-test": "modal-header", className: cn(styles.header, headerClassName) },
+                icon && iconAriaLabel && React.createElement(Icon, { "data-test": "modal-header-icon", className: styles.icon, icon: icon, ariaLabel: iconAriaLabel }),
+                React.createElement("h3", { "data-test": "modal-header-title", className: styles.title }, title),
+                closable && showCloseButton && (
+                // Note: Mostly a Dialog use-case. We want it to be closable, but we don't want to show an X button in the corner.
+                React.createElement("div", { className: styles.close },
+                    React.createElement(IconButton, { "data-test": `${dataTest}-button-close`, kind: "transparent", ariaLabel: "Close icon", icon: X, onClick: onClose })))),
+            React.createElement("div", { "data-test": "modal-content", className: cn(styles.content, contentClassName) }, children),
+            !hideActions && (React.createElement("div", { "data-test": "modal-footer", className: cn(styles.footer, footerClassName) }, actions === null || actions === void 0 ? void 0 :
+                actions.map(({ children, ...actionPropsRest }, key) => (React.createElement(Button, { key: key, "data-test": "modal-button-action", ...actionPropsRest }, children))),
+                React.createElement(Button, { autoFocus: shouldAutoFocusCancelButton, "data-test": "modal-button-cancel", variant: "outlined", color: "secondary", onClick: onClose }, "Cancel"))))));
+};
+//# sourceMappingURL=Modal.js.map

package/lib/old/Modal.js.map

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