@equinor/eds-core-react 2.4.1 → 2.5.0-beta.0

package/dist/index.next.cjs

@@ -13,75 +13,54 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
 var styled__default = /*#__PURE__*/_interopDefault(styled);
 
-/**
- * TypographyNext component for flexible typography with baseline grid support.
- *
- * Provides full control over typography properties including family, size,
- * lineHeight, baseline alignment, weight, and tracking.
- *
- * **Display behavior:** Elements render as `display: block` by default for
- * text-box trimming and baseline grid alignment. Override with CSS if needed.
- *
- * @example
- * ```tsx
- * import { TypographyNext as Typography } from '@equinor/eds-core-react'
- *
- * <Typography
- *   family="ui"
- *   size="md"
- *   lineHeight="default"
- *   baseline="grid"
- *   weight="normal"
- *   tracking="normal"
- * >
- *   Text content (renders as block-level by default)
- * </Typography>
- *
- * <Typography
- *   as="h1"
- *   family="header"
- *   size="3xl"
- *   lineHeight="squished"
- *   baseline="grid"
- *   weight="bolder"
- *   tracking="tight"
- * >
- *   Page heading
- * </Typography>
- * ```
- */
-const TypographyNext = /*#__PURE__*/react.forwardRef(({
-  as = 'span',
-  family,
-  size,
-  baseline,
-  lineHeight,
-  weight,
-  tracking,
-  debug,
-  ...rest
-}, ref) => {
-  const Component = as;
-  return /*#__PURE__*/jsxRuntime.jsx(Component, {
-    ref: ref,
-    "data-font-family": family,
-    "data-font-size": size,
-    "data-baseline": baseline || undefined,
-    "data-line-height": lineHeight || undefined,
-    "data-font-weight": weight || undefined,
-    "data-tracking": tracking || undefined,
-    "data-debug": debug ? '' : undefined,
-    ...rest
+function mergeClassNames(...classNames) {
+  return classNames.filter(Boolean).join(' ');
+}
+function mergeProps(slotProps, childProps) {
+  const merged = {
+    ...childProps
+  };
+  for (const key of Object.keys(slotProps)) {
+    const slotValue = slotProps[key];
+    const childValue = childProps[key];
+    if (key === 'className') {
+      merged[key] = mergeClassNames(slotValue, childValue);
+    } else if (key === 'style') {
+      merged[key] = {
+        ...slotValue,
+        ...childValue
+      };
+    } else if (typeof slotValue === 'function' && typeof childValue === 'function') {
+      merged[key] = (...args) => {
+        childValue(...args);
+        slotValue(...args);
+      };
+    } else if (slotValue !== undefined) {
+      merged[key] = slotValue;
+    }
+  }
+  return merged;
+}
+const Slot = /*#__PURE__*/react.forwardRef(function Slot({
+  children,
+  ...slotProps
+}, ref) {
+  if (! /*#__PURE__*/react.isValidElement(children)) {
+    return null;
+  }
+  const child = children;
+  const merged = mergeProps(slotProps, child.props);
+  return /*#__PURE__*/react.cloneElement(child, {
+    ...merged,
+    ref
   });
 });
-TypographyNext.displayName = 'TypographyNext';
+Slot.displayName = 'Slot';
 
 const SIZE_MAPPING = {
   small: 'sm',
-  default: 'md',
-  large: 'lg'
+  default: 'md'
 };
-const sizeToTypography = SIZE_MAPPING;
 const sizeToSelectableSpace = SIZE_MAPPING;
 const Button = /*#__PURE__*/react.forwardRef(function Button({
   variant = 'primary',
@@ -89,6 +68,8 @@ const Button = /*#__PURE__*/react.forwardRef(function Button({
   tone = 'accent',
   icon = false,
   round = false,
+  multiline = false,
+  asChild,
   children,
   className,
   disabled,
@@ -96,29 +77,56 @@ const Button = /*#__PURE__*/react.forwardRef(function Button({
   ...rest
 }, ref) {
   const classes = ['eds-button', className].filter(Boolean).join(' ');
-  const typographySize = sizeToTypography[size];
   const selectableSpace = sizeToSelectableSpace[size];
-  return /*#__PURE__*/jsxRuntime.jsx("button", {
-    ref: ref,
-    type: type,
+  const sharedProps = {
+    ref,
     className: classes,
-    disabled: disabled,
-    "data-variant": variant,
-    "data-selectable-space": selectableSpace,
-    "data-space-proportions": "squished",
-    "data-color-appearance": disabled ? 'neutral' : tone,
-    "data-icon-only": icon || undefined,
-    "data-round": icon && round ? true : undefined,
-    ...rest,
-    children: icon ? children : /*#__PURE__*/jsxRuntime.jsx(TypographyNext, {
-      as: "span",
-      className: "eds-button__label",
-      family: "ui",
-      size: typographySize,
-      lineHeight: "squished",
-      baseline: "center",
+    disabled,
+    'data-variant': variant,
+    'data-selectable-space': selectableSpace,
+    'data-space-proportions': 'squished',
+    'data-color-appearance': disabled ? 'neutral' : tone,
+    'data-icon-only': icon || undefined,
+    'data-round': icon && round ? true : undefined,
+    'data-multiline': multiline || undefined,
+    ...rest
+  };
+  if (asChild) {
+    return /*#__PURE__*/jsxRuntime.jsx(Slot, {
+      ...sharedProps,
       children: children
-    })
+    });
+  }
+  return /*#__PURE__*/jsxRuntime.jsx("button", {
+    type: type,
+    ...sharedProps,
+    children: (() => {
+      const out = [];
+      let buf = [];
+      let labelGroupIndex = 0;
+      react.Children.toArray(children).forEach(child => {
+        const isLabelNode = typeof child === 'string' || typeof child === 'number' || /*#__PURE__*/react.isValidElement(child) && child.type === 'br';
+        if (isLabelNode) {
+          buf.push(child);
+        } else {
+          if (buf.length) {
+            out.push(/*#__PURE__*/jsxRuntime.jsx("span", {
+              className: "label",
+              children: buf
+            }, `label-${labelGroupIndex++}`));
+            buf = [];
+          }
+          out.push(child);
+        }
+      });
+      if (buf.length) {
+        out.push(/*#__PURE__*/jsxRuntime.jsx("span", {
+          className: "label",
+          children: buf
+        }, "label-end"));
+      }
+      return out;
+    })()
   });
 });
 Button.displayName = 'Button';
@@ -201,6 +209,69 @@ const Icon = /*#__PURE__*/react.forwardRef(function Icon({
   });
 });
 
+/**
+ * TypographyNext component for flexible typography with baseline grid support.
+ *
+ * Provides full control over typography properties including family, size,
+ * lineHeight, baseline alignment, weight, and tracking.
+ *
+ * **Display behavior:** Elements render as `display: block` by default for
+ * text-box trimming and baseline grid alignment. Override with CSS if needed.
+ *
+ * @example
+ * ```tsx
+ * import { TypographyNext as Typography } from '@equinor/eds-core-react'
+ *
+ * <Typography
+ *   family="ui"
+ *   size="md"
+ *   lineHeight="default"
+ *   baseline="grid"
+ *   weight="normal"
+ *   tracking="normal"
+ * >
+ *   Text content (renders as block-level by default)
+ * </Typography>
+ *
+ * <Typography
+ *   as="h1"
+ *   family="header"
+ *   size="3xl"
+ *   lineHeight="squished"
+ *   baseline="grid"
+ *   weight="bolder"
+ *   tracking="tight"
+ * >
+ *   Page heading
+ * </Typography>
+ * ```
+ */
+const TypographyNext = /*#__PURE__*/react.forwardRef(({
+  as = 'span',
+  family,
+  size,
+  baseline,
+  lineHeight,
+  weight,
+  tracking,
+  debug,
+  ...rest
+}, ref) => {
+  const Component = as;
+  return /*#__PURE__*/jsxRuntime.jsx(Component, {
+    ref: ref,
+    "data-font-family": family,
+    "data-font-size": size,
+    "data-baseline": baseline || undefined,
+    "data-line-height": lineHeight || undefined,
+    "data-font-weight": weight || undefined,
+    "data-tracking": tracking || undefined,
+    "data-debug": debug ? '' : undefined,
+    ...rest
+  });
+});
+TypographyNext.displayName = 'TypographyNext';
+
 const FieldDescription = /*#__PURE__*/react.forwardRef(function FieldDescription({
   children,
   className,
@@ -1129,19 +1200,30 @@ Search.displayName = 'Search';
 
 const Link = /*#__PURE__*/react.forwardRef(function Link({
   variant = 'inline',
+  asChild,
   className,
   children,
   ...rest
 }, ref) {
   const classes = ['eds-link', className].filter(Boolean).join(' ');
-  return /*#__PURE__*/jsxRuntime.jsx("a", {
-    ref: ref,
+  const sharedProps = {
+    ref,
     className: classes,
-    "data-variant": variant,
-    "data-font-family": variant === 'standalone' ? 'ui' : undefined,
-    "data-font-size": variant === 'standalone' ? 'md' : undefined,
-    "data-line-height": variant === 'standalone' ? 'squished' : undefined,
-    ...rest,
+    'data-variant': variant,
+    'data-color-appearance': 'info',
+    'data-font-family': variant === 'standalone' ? 'ui' : undefined,
+    'data-font-size': variant === 'standalone' ? 'md' : undefined,
+    'data-line-height': variant === 'standalone' ? 'squished' : undefined,
+    ...rest
+  };
+  if (asChild) {
+    return /*#__PURE__*/jsxRuntime.jsx(Slot, {
+      ...sharedProps,
+      children: children
+    });
+  }
+  return /*#__PURE__*/jsxRuntime.jsx("a", {
+    ...sharedProps,
     children: children
   });
 });
@@ -1307,15 +1389,87 @@ Banner.Icon = BannerIcon;
 Banner.Message = BannerMessage;
 Banner.Actions = BannerActions;
 
+const Chip = /*#__PURE__*/react.forwardRef(function Chip({
+  tone = 'neutral',
+  variant = 'default',
+  selected = false,
+  onDelete,
+  dropdown = false,
+  onClick,
+  children,
+  className,
+  onKeyDown,
+  ...rest
+}, ref) {
+  const classes = ['eds-chip', className].filter(Boolean).join(' ');
+  const deletable = typeof onDelete === 'function';
+  const toggleable = !deletable && !dropdown;
+  const handleClick = event => {
+    if (deletable) {
+      onDelete?.(event);
+    } else {
+      onClick?.(event);
+    }
+  };
+  const handleKeyDown = event => {
+    if (deletable && (event.key === 'Backspace' || event.key === 'Delete')) {
+      event.preventDefault();
+      onDelete?.(event);
+    }
+    onKeyDown?.(event);
+  };
+  return /*#__PURE__*/jsxRuntime.jsxs("button", {
+    ref: ref,
+    type: "button",
+    className: classes,
+    "data-variant": variant,
+    "data-color-appearance": tone,
+    "data-font-family": "ui",
+    "data-font-size": "md",
+    "data-selectable-space": "sm",
+    "data-space-proportions": "squished",
+    "data-selected": selected || undefined,
+    "aria-pressed": toggleable ? selected : undefined,
+    "aria-expanded": dropdown ? selected : undefined,
+    onClick: handleClick,
+    onKeyDown: handleKeyDown,
+    ...rest,
+    children: [selected && !dropdown && !deletable && /*#__PURE__*/jsxRuntime.jsx(Icon, {
+      data: edsIcons.check,
+      "aria-hidden": true,
+      className: "icon"
+    }), /*#__PURE__*/jsxRuntime.jsx(TypographyNext, {
+      as: "span",
+      className: "label",
+      family: "ui",
+      size: "md",
+      lineHeight: "squished",
+      baseline: "center",
+      children: children
+    }), deletable && /*#__PURE__*/jsxRuntime.jsx(Icon, {
+      data: edsIcons.close,
+      title: "Remove",
+      className: "icon"
+    }), !deletable && dropdown && /*#__PURE__*/jsxRuntime.jsx(Icon, {
+      data: selected ? edsIcons.arrow_drop_up : edsIcons.arrow_drop_down,
+      "aria-hidden": true,
+      className: "icon"
+    })]
+  });
+});
+Chip.displayName = 'Chip';
+
 exports.Banner = Banner;
 exports.Button = Button;
 exports.Checkbox = Checkbox;
+exports.Chip = Chip;
 exports.Field = Field;
 exports.Icon = Icon;
 exports.Input = Input;
 exports.Link = Link;
 exports.Radio = Radio;
 exports.Search = Search;
+exports.Slot = Slot;
 exports.Switch = Switch;
 exports.TextArea = TextArea;
 exports.TextField = TextField;

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

@@ -6,12 +6,21 @@ export declare const StyledButton: import("styled-components/dist/types").IStyle
     as?: import("react").ElementType;
 } & {
     color?: "primary" | "secondary" | "danger";
-    variant?: "ghost" | "contained" | "contained_icon" | "outlined" | "ghost_icon";
+    variant?: "ghost" | "outlined" | "contained" | "contained_icon" | "ghost_icon";
     href?: string;
     disabled?: boolean;
     type?: string;
     fullWidth?: boolean;
-} & import("react").ButtonHTMLAttributes<HTMLButtonElement> & Omit<any, keyof import("react").ButtonHTMLAttributes<HTMLButtonElement> | "variant" | "href" | "fullWidth">, never>> & string & Omit<import("@equinor/eds-utils").OverridableComponent<import("../Button").ButtonProps, HTMLButtonElement> & {
+} & import("react").ButtonHTMLAttributes<HTMLButtonElement> & Omit<any, keyof import("react").ButtonHTMLAttributes<HTMLButtonElement> | "variant" | "href" | "fullWidth">, never> & Partial<Pick<{
+    as?: import("react").ElementType;
+} & {
+    color?: "primary" | "secondary" | "danger";
+    variant?: "ghost" | "outlined" | "contained" | "contained_icon" | "ghost_icon";
+    href?: string;
+    disabled?: boolean;
+    type?: string;
+    fullWidth?: boolean;
+} & import("react").ButtonHTMLAttributes<HTMLButtonElement> & Omit<any, keyof import("react").ButtonHTMLAttributes<HTMLButtonElement> | "variant" | "href" | "fullWidth">, never>>> & string & Omit<import("@equinor/eds-utils").OverridableComponent<import("../Button").ButtonProps, HTMLButtonElement> & {
     Group: typeof import("../Button").ButtonGroup;
     Toggle: typeof import("../Button").ToggleButton;
 }, keyof import("react").Component<any, {}, any>>;
@@ -67,6 +76,11 @@ export type AutocompleteProps<T = string> = {
      * @default 'summary'
      */
     selectionDisplay?: 'chips' | 'summary';
+    /** Amount of values to list in chips (only relevant if selectionDisplay = 'chips')
+     * When left blank, all values will be shown as chips
+     * @default undefined
+     */
+    chipCount?: number;
     /** Callback for the selected item change
      * changes.selectedItems gives the selected items
      */

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

@@ -39,6 +39,7 @@ export declare const AutocompleteContext: import("react").Context<{
     onInputChange: (text: string) => void;
     selectedOptions: unknown[];
     selectionDisplay: "summary" | "chips";
+    chipCount: number;
     itemToKey: (item: unknown) => unknown;
     itemCompare: (value: unknown, compare: unknown) => boolean;
     allowSelectAll: boolean;
@@ -73,6 +74,7 @@ export declare const AutocompleteContext: import("react").Context<{
         hideClearButton?: boolean;
         selectedOptions?: unknown[];
         selectionDisplay?: "chips" | "summary";
+        chipCount?: number;
         onOptionsChange?: (changes: import("./Autocomplete").AutocompleteChanges<unknown>) => void;
         onInputChange?: (text: string) => void;
         onAddNewOption?: (text: string) => void;
@@ -94,7 +96,7 @@ export declare const AutocompleteContext: import("react").Context<{
         optionLabel?: (option: unknown) => string;
     } & {
         ref?: React.Ref<HTMLInputElement>;
-    }, "disabled" | "className" | "id" | "style" | "meta" | "label" | "ref" | "multiple" | "variant" | "placeholder" | "readOnly" | "options" | "onClear" | "helperText" | "helperIcon" | "loading" | "optionDisabled" | "totalOptions" | "initialSelectedOptions" | "noOptionsText" | "hideClearButton" | "selectedOptions" | "selectionDisplay" | "onOptionsChange" | "onInputChange" | "onAddNewOption" | "allowSelectAll" | "optionComponent" | "optionsFilter" | "autoWidth" | "clearSearchOnChange" | "multiline" | "dropdownHeight" | "itemToKey" | "itemCompare" | "optionLabel">;
+    }, "disabled" | "className" | "id" | "style" | "ref" | "label" | "meta" | "variant" | "multiline" | "multiple" | "placeholder" | "readOnly" | "options" | "onClear" | "helperText" | "helperIcon" | "loading" | "optionDisabled" | "totalOptions" | "initialSelectedOptions" | "noOptionsText" | "hideClearButton" | "selectedOptions" | "selectionDisplay" | "chipCount" | "onOptionsChange" | "onInputChange" | "onAddNewOption" | "allowSelectAll" | "optionComponent" | "optionsFilter" | "autoWidth" | "clearSearchOnChange" | "dropdownHeight" | "itemToKey" | "itemCompare" | "optionLabel">;
     highlightedIndex: number;
     selectedItem: unknown;
     isOpen: boolean;
@@ -153,6 +155,7 @@ export declare const useAutocompleteContext: () => {
     onInputChange: (text: string) => void;
     selectedOptions: unknown[];
     selectionDisplay: "summary" | "chips";
+    chipCount: number;
     itemToKey: (item: unknown) => unknown;
     itemCompare: (value: unknown, compare: unknown) => boolean;
     allowSelectAll: boolean;
@@ -187,6 +190,7 @@ export declare const useAutocompleteContext: () => {
         hideClearButton?: boolean;
         selectedOptions?: unknown[];
         selectionDisplay?: "chips" | "summary";
+        chipCount?: number;
         onOptionsChange?: (changes: import("./Autocomplete").AutocompleteChanges<unknown>) => void;
         onInputChange?: (text: string) => void;
         onAddNewOption?: (text: string) => void;
@@ -208,7 +212,7 @@ export declare const useAutocompleteContext: () => {
         optionLabel?: (option: unknown) => string;
     } & {
         ref?: React.Ref<HTMLInputElement>;
-    }, "disabled" | "className" | "id" | "style" | "meta" | "label" | "ref" | "multiple" | "variant" | "placeholder" | "readOnly" | "options" | "onClear" | "helperText" | "helperIcon" | "loading" | "optionDisabled" | "totalOptions" | "initialSelectedOptions" | "noOptionsText" | "hideClearButton" | "selectedOptions" | "selectionDisplay" | "onOptionsChange" | "onInputChange" | "onAddNewOption" | "allowSelectAll" | "optionComponent" | "optionsFilter" | "autoWidth" | "clearSearchOnChange" | "multiline" | "dropdownHeight" | "itemToKey" | "itemCompare" | "optionLabel">;
+    }, "disabled" | "className" | "id" | "style" | "ref" | "label" | "meta" | "variant" | "multiline" | "multiple" | "placeholder" | "readOnly" | "options" | "onClear" | "helperText" | "helperIcon" | "loading" | "optionDisabled" | "totalOptions" | "initialSelectedOptions" | "noOptionsText" | "hideClearButton" | "selectedOptions" | "selectionDisplay" | "chipCount" | "onOptionsChange" | "onInputChange" | "onAddNewOption" | "allowSelectAll" | "optionComponent" | "optionsFilter" | "autoWidth" | "clearSearchOnChange" | "dropdownHeight" | "itemToKey" | "itemCompare" | "optionLabel">;
     highlightedIndex: number;
     selectedItem: unknown;
     isOpen: boolean;

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

@@ -4,10 +4,12 @@ type StyledListItemType = {
     $active?: string;
     $isdisabled?: string;
 };
-export declare const StyledListItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, StyledListItemType>> & string;
-export declare const AutocompleteOptionLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
+export declare const StyledListItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, keyof StyledListItemType> & StyledListItemType, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, keyof StyledListItemType> & StyledListItemType, never>>> & string;
+export declare const AutocompleteOptionLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "$multiline"> & {
     $multiline: boolean;
-}>> & string;
+}, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "$multiline"> & {
+    $multiline: boolean;
+}, never>>> & string;
 export type AutocompleteOptionProps = {
     index: number;
     virtualItem: VirtualItem;

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

@@ -1,7 +1,7 @@
 import type { DOMAttributes } from 'react';
 import { AutocompleteProps } from './Autocomplete';
 import { AutocompleteToken } from './Autocomplete.tokens';
-export declare const useAutocomplete: <T>({ options, totalOptions, label, meta, className, style, disabled, readOnly, loading, hideClearButton, onOptionsChange, onAddNewOption, onInputChange, selectedOptions: _selectedOptions, selectionDisplay, multiple, itemToKey: _itemToKey, itemCompare: _itemCompare, allowSelectAll, initialSelectedOptions: _initialSelectedOptions, optionDisabled, optionsFilter, autoWidth, placeholder, optionLabel, clearSearchOnChange, multiline, dropdownHeight, optionComponent, helperText, helperIcon, noOptionsText, variant, onClear, ref, id, ...other }: AutocompleteProps<T> & {
+export declare const useAutocomplete: <T>({ options, totalOptions, label, meta, className, style, disabled, readOnly, loading, hideClearButton, onOptionsChange, onAddNewOption, onInputChange, selectedOptions: _selectedOptions, selectionDisplay, chipCount, multiple, itemToKey: _itemToKey, itemCompare: _itemCompare, allowSelectAll, initialSelectedOptions: _initialSelectedOptions, optionDisabled, optionsFilter, autoWidth, placeholder, optionLabel, clearSearchOnChange, multiline, dropdownHeight, optionComponent, helperText, helperIcon, noOptionsText, variant, onClear, ref, id, ...other }: AutocompleteProps<T> & {
     ref?: React.Ref<HTMLInputElement>;
 }) => {
     getDropdownProps: <Options>(options?: import("downshift").UseMultipleSelectionGetDropdownPropsOptions & Options, extraOptions?: import("downshift").GetPropsCommonOptions) => Omit<import("downshift").Overwrite<import("downshift").UseMultipleSelectionGetDropdownReturnValue, Options>, "preventKeyAction">;
@@ -44,6 +44,7 @@ export declare const useAutocomplete: <T>({ options, totalOptions, label, meta,
     onInputChange: (text: string) => void;
     selectedOptions: T[];
     selectionDisplay: "summary" | "chips";
+    chipCount: number;
     itemToKey: (item: T) => unknown;
     itemCompare: (value: T, compare: T) => boolean;
     allowSelectAll: boolean;
@@ -78,6 +79,7 @@ export declare const useAutocomplete: <T>({ options, totalOptions, label, meta,
         hideClearButton?: boolean;
         selectedOptions?: T[];
         selectionDisplay?: "chips" | "summary";
+        chipCount?: number;
         onOptionsChange?: (changes: import("./Autocomplete").AutocompleteChanges<T>) => void;
         onInputChange?: (text: string) => void;
         onAddNewOption?: (text: string) => void;
@@ -103,7 +105,7 @@ export declare const useAutocomplete: <T>({ options, totalOptions, label, meta,
         optionLabel?: (option: T) => string;
     }) & {
         ref?: React.Ref<HTMLInputElement>;
-    }, "disabled" | "className" | "id" | "style" | "meta" | "label" | "ref" | "multiple" | "variant" | "placeholder" | "readOnly" | "options" | "onClear" | "helperText" | "helperIcon" | "loading" | "optionDisabled" | "totalOptions" | "initialSelectedOptions" | "noOptionsText" | "hideClearButton" | "selectedOptions" | "selectionDisplay" | "onOptionsChange" | "onInputChange" | "onAddNewOption" | "allowSelectAll" | "optionComponent" | "optionsFilter" | "autoWidth" | "clearSearchOnChange" | "multiline" | "dropdownHeight" | "itemToKey" | "itemCompare" | "optionLabel">;
+    }, "disabled" | "className" | "id" | "style" | "ref" | "label" | "meta" | "variant" | "multiline" | "multiple" | "placeholder" | "readOnly" | "options" | "onClear" | "helperText" | "helperIcon" | "loading" | "optionDisabled" | "totalOptions" | "initialSelectedOptions" | "noOptionsText" | "hideClearButton" | "selectedOptions" | "selectionDisplay" | "chipCount" | "onOptionsChange" | "onInputChange" | "onAddNewOption" | "allowSelectAll" | "optionComponent" | "optionsFilter" | "autoWidth" | "clearSearchOnChange" | "dropdownHeight" | "itemToKey" | "itemCompare" | "optionLabel">;
     highlightedIndex: number;
     selectedItem: T;
     isOpen: boolean;

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

@@ -2,7 +2,7 @@ type IconProps = {
     $variant: 'active' | 'error' | 'default';
     $disabled: boolean;
 };
-export declare const Icon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<(Omit<{
+export declare const Icon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<(Omit<{
     title?: string;
     color?: string;
     size?: 16 | 18 | 24 | 32 | 40 | 48;
@@ -18,5 +18,21 @@ export declare const Icon: import("styled-components/dist/types").IStyledCompone
     name?: import("../Icon/Icon.types").Name;
     data: import("@equinor/eds-icons").IconData;
     ref?: import("react").Ref<SVGSVGElement>;
-} & import("react").SVGProps<SVGSVGElement>, "ref"> & import("react").RefAttributes<SVGSVGElement>), IconProps>> & string & Omit<import("../Icon/Icon.types").IconType, keyof import("react").Component<any, {}, any>>;
+} & import("react").SVGProps<SVGSVGElement>, "ref"> & import("react").RefAttributes<SVGSVGElement>), keyof IconProps> & IconProps, never> & Partial<Pick<import("styled-components").FastOmit<(Omit<{
+    title?: string;
+    color?: string;
+    size?: 16 | 18 | 24 | 32 | 40 | 48;
+    rotation?: 0 | 90 | 180 | 270;
+    name: import("../Icon/Icon.types").Name;
+    data?: import("@equinor/eds-icons").IconData;
+    ref?: import("react").Ref<SVGSVGElement>;
+} & import("react").SVGProps<SVGSVGElement>, "ref"> & import("react").RefAttributes<SVGSVGElement>) | (Omit<{
+    title?: string;
+    color?: string;
+    size?: 16 | 18 | 24 | 32 | 40 | 48;
+    rotation?: 0 | 90 | 180 | 270;
+    name?: import("../Icon/Icon.types").Name;
+    data: import("@equinor/eds-icons").IconData;
+    ref?: import("react").Ref<SVGSVGElement>;
+} & import("react").SVGProps<SVGSVGElement>, "ref"> & import("react").RefAttributes<SVGSVGElement>), keyof IconProps> & IconProps, never>>> & string & Omit<import("../Icon/Icon.types").IconType, keyof import("react").Component<any, {}, any>>;
 export {};

package/dist/types/components/Datepicker/calendars/CalendarWrapper.d.ts

@@ -1 +1 @@
-export declare const CalendarWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const CalendarWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;

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

@@ -1,3 +1,3 @@
-export declare const BaseInputWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
-export declare const BaseInput: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>>, never>, never>> & string;
-export declare const GridWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const BaseInputWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>> & string;
+export declare const BaseInput: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, keyof import("react").InputHTMLAttributes<HTMLInputElement> | keyof import("react").ClassAttributes<HTMLInputElement>> & import("react").ClassAttributes<HTMLInputElement> & import("react").InputHTMLAttributes<HTMLInputElement>, "type"> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, keyof import("react").InputHTMLAttributes<HTMLInputElement> | keyof import("react").ClassAttributes<HTMLInputElement>> & import("react").ClassAttributes<HTMLInputElement> & import("react").InputHTMLAttributes<HTMLInputElement>, "type">>> & string;
+export declare const GridWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>> & string;