@equinor/eds-core-react 0.24.0-dev.20221007 → 0.25.0

package/dist/types/components/InputWrapper/HelperText/HelperText.d.ts

@@ -0,0 +1,18 @@
+import { ReactNode, HTMLAttributes } from 'react';
+export declare type HelperTextProps = {
+    /** Helper text */
+    text?: string;
+    /** Icon */
+    icon?: ReactNode;
+    /** Color */
+    color?: string;
+} & HTMLAttributes<HTMLDivElement>;
+declare const TextfieldHelperText: import("react").ForwardRefExoticComponent<{
+    /** Helper text */
+    text?: string;
+    /** Icon */
+    icon?: ReactNode;
+    /** Color */
+    color?: string;
+} & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+export { TextfieldHelperText as HelperText };

package/dist/types/components/{TextField → InputWrapper}/HelperText/HelperText.token.d.ts

@@ -1,5 +1,4 @@
 import type { Spacing, Typography } from '@equinor/eds-tokens';
-import { ColorStateProps } from '../types';
 export declare type HelperTextProps = {
     background: string;
     typography: Typography;
@@ -7,9 +6,5 @@ export declare type HelperTextProps = {
         comfortable: Spacing;
         compact: Spacing;
     };
-    default: ColorStateProps;
-    error: ColorStateProps;
-    warning: ColorStateProps;
-    success: ColorStateProps;
 };
 export declare const helperText: HelperTextProps;

package/dist/types/components/InputWrapper/HelperText/index.d.ts

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

package/dist/types/components/InputWrapper/InputWrapper.d.ts

@@ -0,0 +1,41 @@
+import { HTMLAttributes, ReactNode } from 'react';
+import { LabelProps } from '../Label';
+import { HelperTextProps } from './HelperText';
+import { Variants } from '../types';
+export declare type InputWrapperProps = {
+    /** Label */
+    label?: string;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Read Only */
+    readOnly?: boolean;
+    /** Highlight color */
+    color?: Variants;
+    /** Label props */
+    labelProps?: LabelProps;
+    /** Helpertext props */
+    helperProps?: HelperTextProps;
+    /** Helper Icon */
+    helperIcon?: ReactNode;
+    /** Input or Textarea element */
+    children: ReactNode;
+} & HTMLAttributes<HTMLDivElement>;
+/** InputWrapper is a internal skeleton component for structuring input elements  */
+export declare const InputWrapper: import("react").ForwardRefExoticComponent<{
+    /** Label */
+    label?: string;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Read Only */
+    readOnly?: boolean;
+    /** Highlight color */
+    color?: Variants;
+    /** Label props */
+    labelProps?: LabelProps;
+    /** Helpertext props */
+    helperProps?: HelperTextProps;
+    /** Helper Icon */
+    helperIcon?: ReactNode;
+    /** Input or Textarea element */
+    children: ReactNode;
+} & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/InputWrapper/InputWrapper.tokens.d.ts

@@ -0,0 +1,12 @@
+import type { ComponentToken } from '@equinor/eds-tokens';
+export declare type InputToken = ComponentToken;
+export declare const input: InputToken;
+export declare const error: InputToken;
+export declare const warning: InputToken;
+export declare const success: InputToken;
+export declare const inputToken: {
+    input: ComponentToken;
+    error: ComponentToken;
+    warning: ComponentToken;
+    success: ComponentToken;
+};

package/dist/types/components/InputWrapper/index.d.ts

@@ -0,0 +1,2 @@
+export { InputWrapper } from './InputWrapper';
+export type { InputWrapperProps } from './InputWrapper';

package/dist/types/components/Popover/Popover.d.ts

@@ -9,6 +9,11 @@ export declare type PopoverProps = {
     anchorEl?: HTMLElement | null;
     /** Is Popover open */
     open: boolean;
+    /** initializes react portal for dropdown, default to false. */
+    withinPortal?: boolean;
+    /** Determines whether focus should be trapped within dropdown,
+     * default to false. */
+    trapFocus?: boolean;
 } & HTMLAttributes<HTMLDivElement>;
 export declare const Popover: import("react").ForwardRefExoticComponent<{
     /**  Popover placement relative to anchor */
@@ -19,4 +24,9 @@ export declare const Popover: import("react").ForwardRefExoticComponent<{
     anchorEl?: HTMLElement | null;
     /** Is Popover open */
     open: boolean;
+    /** initializes react portal for dropdown, default to false. */
+    withinPortal?: boolean;
+    /** Determines whether focus should be trapped within dropdown,
+     * default to false. */
+    trapFocus?: boolean;
 } & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/Search/Search.d.ts

@@ -1,3 +1,3 @@
-import { InputHTMLAttributes, RefAttributes } from 'react';
+import { InputHTMLAttributes } from 'react';
 export declare type SearchProps = InputHTMLAttributes<HTMLInputElement>;
-export declare const Search: import("react").ForwardRefExoticComponent<SearchProps & RefAttributes<HTMLInputElement>>;
+export declare const Search: import("react").ForwardRefExoticComponent<SearchProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/types/components/Select/commonStyles.d.ts

@@ -5,13 +5,7 @@ declare type StyledListItemType = {
     active?: string;
 };
 export declare const Container: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, ContainerProps, never>;
-export declare const PaddedInput: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<{
-    placeholder?: string;
-    variant?: import("../TextField/types").Variants;
-    disabled?: boolean;
-    type?: string;
-    readOnly?: boolean;
-} & import("react").InputHTMLAttributes<HTMLInputElement> & import("react").RefAttributes<HTMLInputElement>>, import("styled-components").DefaultTheme, {}, never>;
+export declare const PaddedInput: import("styled-components").StyledComponent<import("@equinor/eds-utils").OverridableComponent<import("../Input").InputProps, HTMLInputElement>, import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledList: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<{
     variant?: "bullet" | "numbered";
     start?: string;

package/dist/types/components/TextField/TextField.d.ts

@@ -1,11 +1,9 @@
-import { ReactNode, InputHTMLAttributes, TextareaHTMLAttributes, Ref } from 'react';
-import type { Variants } from './types';
-export declare type TextFieldProps = {
-    /** @ignore */
-    className?: string;
+import { ReactNode, InputHTMLAttributes, TextareaHTMLAttributes, ForwardedRef } from 'react';
+import type { Variants } from '../types';
+declare type SharedTextFieldProps = {
     /** Variants */
     variant?: Variants;
-    /** Input unique id */
+    /** Input unique id. This is required to ensure accesibility */
     id: string;
     /** Label text */
     label?: string;
@@ -15,23 +13,19 @@ export declare type TextFieldProps = {
     unit?: string;
     /** Helper text */
     helperText?: string;
-    /** Placeholder text */
-    placeholder?: string;
-    /** Disabled */
-    disabled?: boolean;
-    /** Multiline input */
-    multiline?: boolean;
-    /** Specifies max rows for multiline input */
-    rowsMax?: number;
-    /** Input ref */
-    inputRef?: Ref<HTMLInputElement> | Ref<HTMLTextAreaElement>;
     /** InputIcon */
     inputIcon?: ReactNode;
     /** HelperIcon */
     helperIcon?: ReactNode;
-    /** Value */
-    value?: string;
-    /** Read Only */
-    readOnly?: boolean;
-} & (InputHTMLAttributes<HTMLInputElement> | TextareaHTMLAttributes<HTMLTextAreaElement>);
+    /**  Maximum number of rows if `multiline` is set to `true` */
+    rowsMax?: number;
+    /** Input ref */
+    inputRef?: ForwardedRef<HTMLInputElement>;
+    /** Textarea ref when multiline is set to `true` */
+    textareaRef?: ForwardedRef<HTMLTextAreaElement>;
+    /** If `true` a `textarea` is rendered for multiline support. Make sure to use `textareaRef` if you need to access reference element  */
+    multiline?: boolean;
+};
+export declare type TextFieldProps = SharedTextFieldProps & (TextareaHTMLAttributes<HTMLTextAreaElement> | InputHTMLAttributes<HTMLInputElement>);
 export declare const TextField: import("react").ForwardRefExoticComponent<TextFieldProps & import("react").RefAttributes<HTMLDivElement>>;
+export {};

package/dist/types/components/Textarea/Textarea.d.ts

@@ -1,5 +1,5 @@
 import { TextareaHTMLAttributes } from 'react';
-import type { Variants } from '../TextField/types';
+import type { Variants } from '../types';
 export declare type TextareaProps = {
     /** Placeholder */
     placeholder?: string;
@@ -11,7 +11,7 @@ export declare type TextareaProps = {
     type?: string;
     /** Read Only */
     readOnly?: boolean;
-    /** Specifies max rows for multiline input */
+    /** Specifies max rows for multiline  */
     rowsMax?: number;
 } & TextareaHTMLAttributes<HTMLTextAreaElement>;
 export declare const Textarea: import("react").ForwardRefExoticComponent<{
@@ -25,6 +25,6 @@ export declare const Textarea: import("react").ForwardRefExoticComponent<{
     type?: string;
     /** Read Only */
     readOnly?: boolean;
-    /** Specifies max rows for multiline input */
+    /** Specifies max rows for multiline  */
     rowsMax?: number;
 } & TextareaHTMLAttributes<HTMLTextAreaElement> & import("react").RefAttributes<HTMLTextAreaElement>>;

package/dist/types/components/types.d.ts

@@ -0,0 +1 @@
+export declare type Variants = 'error' | 'warning' | 'success';

package/dist/types/index.d.ts

@@ -34,3 +34,4 @@ export * from './components/Switch';
 export * from './components/EdsProvider';
 export * from './components/Paper';
 export * from './components/Autocomplete';
+export * from './components/InputWrapper';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@equinor/eds-core-react",
-  "version": "0.24.0-dev.20221007",
+  "version": "0.25.0",
   "description": "The React implementation of the Equinor Design System",
   "sideEffects": [
     "**/*.css"
@@ -79,9 +79,9 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.19.0",
-    "@equinor/eds-icons": "0.15.0-dev.20221005",
-    "@equinor/eds-tokens": "0.8.0-dev.20221005",
-    "@equinor/eds-utils": "0.5.0-dev.20221006",
+    "@equinor/eds-icons": "0.15.0",
+    "@equinor/eds-tokens": "0.9.0",
+    "@equinor/eds-utils": "0.6.0",
     "@floating-ui/react-dom-interactions": "^0.10.1",
     "downshift": "^6.1.12"
   },

package/dist/esm/components/Search/Search.tokens.js

@@ -1,83 +0,0 @@
-import { tokens } from '@equinor/eds-tokens';
-
-var _tokens$colors = tokens.colors,
-    background = _tokens$colors.ui.background__light.rgba,
-    _tokens$colors$intera = _tokens$colors.interactive,
-    primaryHoverAlt = _tokens$colors$intera.primary__hover_alt.rgba,
-    primaryColor = _tokens$colors$intera.primary__resting.rgba,
-    placeholderColor = _tokens$colors.text.static_icons__tertiary.rgba,
-    small = tokens.spacings.comfortable.small,
-    typography = tokens.typography.input.text,
-    shape = tokens.shape;
-var search = {
-  background: background,
-  typography: typography,
-  height: '36px',
-  clickbound: {
-    offset: {
-      top: '6px'
-    },
-    height: '48px'
-  },
-  spacings: {
-    left: small,
-    right: small
-  },
-  border: {
-    type: 'border',
-    width: '1px',
-    style: 'solid',
-    color: 'transparent'
-  },
-  states: {
-    focus: {
-      border: {
-        type: 'border',
-        width: '1px',
-        style: 'solid',
-        color: primaryColor
-      }
-    }
-  },
-  entities: {
-    placeholder: {
-      typography: {
-        color: placeholderColor
-      }
-    },
-    icon: {
-      typography: {
-        color: placeholderColor
-      },
-      border: {
-        type: 'border',
-        radius: '50%'
-      },
-      states: {
-        hover: {
-          background: primaryHoverAlt
-        }
-      },
-      clickbound: {
-        offset: {
-          top: '6px'
-        },
-        height: '36px'
-      }
-    },
-    button: {
-      height: '24px',
-      width: '24px',
-      spacings: {
-        right: small
-      }
-    }
-  },
-  modes: {
-    compact: {
-      height: shape._modes.compact.straight.minHeight
-    }
-  }
-};
-
-export { search };

package/dist/esm/components/TextField/Field.js

@@ -1,151 +0,0 @@
-import _objectSpread from '@babel/runtime/helpers/objectSpread2';
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { forwardRef } from 'react';
-import { useTextField } from './TextField.context.js';
-import styled, { css } from 'styled-components';
-import { typographyTemplate, outlineTemplate } from '@equinor/eds-utils';
-import * as TextField_tokens from './TextField.tokens.js';
-import { textfield as textfield$1 } from './TextField.tokens.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { Input } from '../Input/Input.js';
-import { Textarea } from '../Textarea/Textarea.js';
-import { Icon as InputIcon } from './Icon/Icon.js';
-import { useEds } from '../EdsProvider/eds.context.js';
-
-var _excluded = ["multiline", "variant", "disabled", "readOnly", "type", "unit", "inputIcon", "rowsMax", "onBlur", "onFocus"];
-var textfield = textfield$1;
-
-var Variation = function Variation(_ref) {
-  var _token$border, _token$border2, _token$border3, _token$border4;
-
-  var variant = _ref.variant,
-      isFocused = _ref.isFocused,
-      token = _ref.token;
-
-  if (!variant) {
-    return "";
-  }
-
-  return css(["box-shadow:", ";", ""], isFocused ? "none" : variant === 'default' ? "inset 0 -1px 0 0 ".concat(((_token$border = token.border) === null || _token$border === void 0 ? void 0 : _token$border.type) === 'border' && ((_token$border2 = token.border) === null || _token$border2 === void 0 ? void 0 : _token$border2.color)) : "0 0 0 1px ".concat(((_token$border3 = token.border) === null || _token$border3 === void 0 ? void 0 : _token$border3.type) === 'border' && ((_token$border4 = token.border) === null || _token$border4 === void 0 ? void 0 : _token$border4.color)), isFocused && outlineTemplate(token.states.focus.outline));
-};
-
-var StrippedInput = styled(Input).withConfig({
-  displayName: "Field__StrippedInput",
-  componentId: "sc-455b88-0"
-})(["outline:none;&:active,&:focus{outline:none;box-shadow:none;}"]);
-var StrippedTextarea = styled(Textarea).withConfig({
-  displayName: "Field__StrippedTextarea",
-  componentId: "sc-455b88-1"
-})(["outline:none;&:active,&:focus{outline:none;box-shadow:none;}"]);
-var InputWrapper = styled.div.withConfig({
-  displayName: "Field__InputWrapper",
-  componentId: "sc-455b88-2"
-})(function (_ref2) {
-  var inputIcon = _ref2.inputIcon,
-      unit = _ref2.unit,
-      isDisabled = _ref2.isDisabled,
-      isReadOnly = _ref2.isReadOnly,
-      multiline = _ref2.multiline,
-      variant = _ref2.variant;
-  return css(["", " ", " ", " ", " ", ""], Variation, (inputIcon || unit) && css(["display:flex;align-items:center;background:", ";padding-right:", ";"], textfield.background, textfield.spacings.right), isReadOnly && css(["box-shadow:", ";background:", ";"], textfield.states.readOnly.boxShadow, textfield.states.readOnly.background), isDisabled && css(["box-shadow:none;cursor:not-allowed;outline:none;"]), multiline && variant === 'default' && !inputIcon && !unit && css(["box-shadow:none;"]));
-});
-var Unit = styled.span.withConfig({
-  displayName: "Field__Unit",
-  componentId: "sc-455b88-3"
-})(["", ";display:inline-block;margin-top:3px;", ""], typographyTemplate(textfield.entities.unit.typography), function (_ref3) {
-  var isDisabled = _ref3.isDisabled;
-  return isDisabled && {
-    color: textfield.entities.unit.states.disabled.typography.color
-  };
-});
-var Adornments = styled.div.withConfig({
-  displayName: "Field__Adornments",
-  componentId: "sc-455b88-4"
-})(["display:flex;align-items:center;justify-content:center;height:100%;margin-left:", ";& div:nth-child(2){margin-left:", ";}", ""], textfield.spacings.left, textfield.spacings.left, function (_ref4) {
-  var multiline = _ref4.multiline,
-      theme = _ref4.theme;
-  return multiline && {
-    marginTop: theme.spacings.top,
-    alignSelf: 'start'
-  };
-});
-var Field = /*#__PURE__*/forwardRef(function Field(_ref5, ref) {
-  var multiline = _ref5.multiline,
-      variant = _ref5.variant,
-      disabled = _ref5.disabled,
-      readOnly = _ref5.readOnly,
-      type = _ref5.type,
-      unit = _ref5.unit,
-      inputIcon = _ref5.inputIcon,
-      rowsMax = _ref5.rowsMax,
-      onBlur = _ref5.onBlur,
-      onFocus = _ref5.onFocus,
-      other = _objectWithoutProperties(_ref5, _excluded);
-
-  var _useTextField = useTextField(),
-      handleFocus = _useTextField.handleFocus,
-      handleBlur = _useTextField.handleBlur,
-      isFocused = _useTextField.isFocused;
-
-  var _useEds = useEds(),
-      density = _useEds.density;
-
-  var iconSize = density === 'compact' ? 16 : 24;
-  var actualVariant = variant === 'default' ? 'textfield' : variant;
-  var inputVariant = TextField_tokens[actualVariant];
-  var isError = actualVariant === 'error';
-
-  var focusHandler = function focusHandler(e) {
-    handleFocus();
-    onFocus && onFocus(e);
-  };
-
-  var blurHandler = function blurHandler(e) {
-    handleBlur();
-    onBlur && onBlur(e);
-  };
-
-  var inputWrapperProps = {
-    isFocused: isFocused,
-    isDisabled: disabled,
-    isReadOnly: readOnly,
-    variant: variant,
-    token: inputVariant,
-    inputIcon: inputIcon,
-    unit: unit,
-    multiline: multiline
-  };
-
-  var inputProps = _objectSpread({
-    ref: ref,
-    'aria-invalid': isError,
-    type: type,
-    disabled: disabled,
-    readOnly: readOnly,
-    variant: variant,
-    onBlur: blurHandler,
-    onFocus: focusHandler
-  }, other);
-
-  var textareaProps = _objectSpread(_objectSpread({}, inputProps), {}, {
-    rowsMax: rowsMax,
-    ref: ref
-  });
-
-  return /*#__PURE__*/jsxs(InputWrapper, _objectSpread(_objectSpread({}, inputWrapperProps), {}, {
-    children: [multiline ? /*#__PURE__*/jsx(StrippedTextarea, _objectSpread({}, textareaProps)) : /*#__PURE__*/jsx(StrippedInput, _objectSpread({}, inputProps)), (inputIcon || unit) && /*#__PURE__*/jsxs(Adornments, {
-      multiline: multiline,
-      children: [unit && /*#__PURE__*/jsx(Unit, {
-        isDisabled: disabled,
-        children: unit
-      }), inputIcon && /*#__PURE__*/jsx(InputIcon, {
-        isDisabled: disabled,
-        variant: variant,
-        size: iconSize,
-        children: inputIcon
-      })]
-    })]
-  }));
-});
-
-export { Field, InputWrapper };

package/dist/esm/components/TextField/HelperText/HelperText.js

@@ -1,89 +0,0 @@
-import _objectSpread from '@babel/runtime/helpers/objectSpread2';
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { forwardRef } from 'react';
-import styled, { css } from 'styled-components';
-import { typographyTemplate } from '@equinor/eds-utils';
-import { helperText } from './HelperText.token.js';
-import { useTextField } from '../TextField.context.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { Icon as InputIcon } from '../Icon/Icon.js';
-
-var _excluded = ["helperText", "icon", "variant", "disabled"];
-
-var Variation = function Variation(_ref) {
-  var variant = _ref.variant,
-      isFocused = _ref.isFocused,
-      isDisabled = _ref.isDisabled;
-
-  if (!variant) {
-    return "";
-  }
-
-  var focusColor = variant.focusColor,
-      color = variant.color,
-      disabledColor = variant.disabledColor;
-
-  if (isDisabled) {
-    return css(["color:", ";"], disabledColor);
-  }
-
-  if (isFocused) {
-    return css(["color:", ";"], focusColor);
-  }
-
-  return css(["color:", ";"], color);
-};
-
-var Container = styled.div.withConfig({
-  displayName: "HelperText__Container",
-  componentId: "sc-1kfkyxg-0"
-})(["display:flex;align-items:flex-start;margin-top:", ";"], function (_ref2) {
-  var spacings = _ref2.spacings;
-  return spacings.top;
-});
-var Text = styled.p.withConfig({
-  displayName: "HelperText__Text",
-  componentId: "sc-1kfkyxg-1"
-})(["", " margin:0 0 0 ", ";", ""], typographyTemplate(helperText.typography), function (_ref3) {
-  var spacings = _ref3.spacings;
-  return spacings.left;
-}, Variation);
-var TextfieldHelperText = /*#__PURE__*/forwardRef(function TextfieldHelperText(_ref4, ref) {
-  var helperText$1 = _ref4.helperText,
-      icon = _ref4.icon,
-      _ref4$variant = _ref4.variant,
-      variant = _ref4$variant === void 0 ? 'default' : _ref4$variant,
-      isDisabled = _ref4.disabled,
-      rest = _objectWithoutProperties(_ref4, _excluded);
-
-  var helperVariant = helperText[variant];
-  var spacings = helperText.spacings.comfortable;
-
-  var _useTextField = useTextField(),
-      isFocused = _useTextField.isFocused;
-
-  var colors = {
-    color: helperVariant.color,
-    disabledColor: helperVariant.disabledColor,
-    focusColor: helperVariant.focusColor
-  };
-  return /*#__PURE__*/jsxs(Container, _objectSpread(_objectSpread({
-    ref: ref
-  }, rest), {}, {
-    spacings: spacings,
-    children: [icon && /*#__PURE__*/jsx(InputIcon, {
-      isDisabled: isDisabled,
-      colors: colors,
-      size: 16,
-      children: icon
-    }), /*#__PURE__*/jsx(Text, {
-      variant: helperVariant,
-      isFocused: isFocused,
-      isDisabled: isDisabled,
-      spacings: spacings,
-      children: helperText$1
-    })]
-  }));
-});
-
-export { TextfieldHelperText as HelperText };

package/dist/esm/components/TextField/HelperText/HelperText.token.js

@@ -1,45 +0,0 @@
-import { tokens } from '@equinor/eds-tokens';
-
-var colors = tokens.colors,
-    comfortable = tokens.spacings.comfortable,
-    typography = tokens.typography;
-var helperText = {
-  background: colors.ui.background__light.hex,
-  typography: typography.input.helper,
-  spacings: {
-    comfortable: {
-      left: comfortable.small,
-      right: comfortable.small,
-      top: comfortable.small,
-      bottom: '6px'
-    },
-    compact: {
-      left: comfortable.small,
-      right: comfortable.small,
-      top: comfortable.xx_small,
-      bottom: '6px'
-    }
-  },
-  "default": {
-    color: colors.text.static_icons__tertiary.hex,
-    disabledColor: colors.interactive.disabled__text.hex,
-    focusColor: colors.text.static_icons__tertiary.hex
-  },
-  error: {
-    color: colors.interactive.danger__text.hex,
-    disabledColor: colors.interactive.disabled__text.hex,
-    focusColor: colors.interactive.danger__hover.hex
-  },
-  warning: {
-    color: colors.interactive.warning__text.hex,
-    disabledColor: colors.interactive.disabled__text.hex,
-    focusColor: colors.interactive.warning__hover.hex
-  },
-  success: {
-    color: colors.interactive.success__text.hex,
-    disabledColor: colors.interactive.disabled__text.hex,
-    focusColor: colors.interactive.success__hover.hex
-  }
-};
-
-export { helperText };