@dnanpm/styleguide 3.12.3 → 4.0.0

package/build/cjs/components/Button/Button.d.ts

@@ -75,12 +75,6 @@ export interface Props {
      * Allows to pass a custom className
      */
     className?: string;
-    /**
-     * Adds data attribute `data-no-close` to button and children wrapper
-     *
-     * @deprecated Nominated for removal due to proposed changes in functionality (https://jira.dna.fi/browse/STYLE-233)
-     */
-    'data-no-close'?: string;
     /**
      * Adds data attribute `data-track-value` to button
      */
@@ -123,6 +117,6 @@ export declare const shade: {
     };
 };
 /** @visibleName Button */
-declare const Button: ({ type, "data-testid": dataTestId, "data-no-close": dataNoClose, "data-track-value": dataTrackValue, "aria-label": ariaLabel, ...props }: Props) => React.JSX.Element;
+declare const Button: ({ type, "data-testid": dataTestId, "data-track-value": dataTrackValue, "aria-label": ariaLabel, ...props }: Props) => React.JSX.Element;
 /** @component */
 export default Button;

package/build/cjs/components/Button/Button.js

@@ -126,11 +126,11 @@ const Element = styledComponents.styled.button `
 /** @visibleName Button */
 const Button = (_a) => {
     var _b;
-    var { type = 'submit', 'data-testid': dataTestId, 'data-no-close': dataNoClose, 'data-track-value': dataTrackValue, 'aria-label': ariaLabel } = _a, props = tslib.__rest(_a, ["type", 'data-testid', 'data-no-close', 'data-track-value', 'aria-label']);
-    return (React__default.default.createElement(Element, Object.assign({ id: props.id, as: (_b = props.nextLink) !== null && _b !== void 0 ? _b : (props.href ? 'a' : undefined), type: props.href ? undefined : type, href: props.href, target: props.href ? props.target : undefined, rel: props.target === '_blank' ? 'noopener noreferrer' : undefined, onClick: props.onClick, onMouseDown: props.onMouseDown, "$small": props.small, "$darkBg": props.darkBg, "$fullWidth": props.fullWidth, "$loading": props.loading, tabIndex: props.loading ? -1 : 0, "data-loading": props.loading, className: props.className, "data-testid": dataTestId, "data-no-close": dataNoClose, "data-track-value": dataTrackValue, "aria-label": ariaLabel }, props.dataAttributes, (!props.href && {
+    var { type = 'submit', 'data-testid': dataTestId, 'data-track-value': dataTrackValue, 'aria-label': ariaLabel } = _a, props = tslib.__rest(_a, ["type", 'data-testid', 'data-track-value', 'aria-label']);
+    return (React__default.default.createElement(Element, Object.assign({ id: props.id, as: (_b = props.nextLink) !== null && _b !== void 0 ? _b : (props.href ? 'a' : undefined), type: props.href ? undefined : type, href: props.href, target: props.href ? props.target : undefined, rel: props.target === '_blank' ? 'noopener noreferrer' : undefined, onClick: props.onClick, onMouseDown: props.onMouseDown, "$small": props.small, "$darkBg": props.darkBg, "$fullWidth": props.fullWidth, "$loading": props.loading, tabIndex: props.loading ? -1 : 0, "data-loading": props.loading, className: props.className, "data-testid": dataTestId, "data-track-value": dataTrackValue, "aria-label": ariaLabel }, props.dataAttributes, (!props.href && {
         name: props.name,
         disabled: props.disabled,
-    })), props.loading ? (React__default.default.createElement(PixelLoader.default, { color: props.darkBg ? theme.default.color.default.white : theme.default.color.default.plum, label: props.loadingLabel })) : (React__default.default.createElement("span", { "data-testid": dataTestId && `${dataTestId}-text`, "data-no-close": dataNoClose }, props.children))));
+    })), props.loading ? (React__default.default.createElement(PixelLoader.default, { color: props.darkBg ? theme.default.color.default.white : theme.default.color.default.plum, label: props.loadingLabel })) : (React__default.default.createElement("span", { "data-testid": dataTestId && `${dataTestId}-text` }, props.children))));
 };
 
 exports.default = Button;

package/build/cjs/components/ButtonArrow/ButtonArrow.d.ts

@@ -24,7 +24,7 @@ type Props = ({
      */
     icon: ReactNode;
     direction?: never;
-}) & Omit<ButtonProps, 'children' | 'small' | 'fullWidth' | 'loading' | 'data-no-close' | 'href' | 'loadingLabel'> & {
+}) & Omit<ButtonProps, 'children' | 'small' | 'fullWidth' | 'loading' | 'href' | 'nextLink' | 'loadingLabel'> & {
     /**
      * Allows to change the styling of component
      *
@@ -34,12 +34,6 @@ type Props = ({
      * @default 'primary'
      */
     variant?: ButtonArrowVariant;
-    /**
-     * Allows to change the type of resulting HTML element from button (`<button></button>`) to anchor (`<a href="..."></a>`)
-     *
-     * @deprecated Use `Button` component for href support
-     */
-    href?: string;
 };
 /** @visibleName Button Arrow */
 declare const ButtonArrow: ({ variant, "data-testid": dataTestId, "data-track-value": dataTrackValue, "aria-label": ariaLabel, ...props }: Props) => React.JSX.Element;

package/build/cjs/components/ButtonArrow/ButtonArrow.js

@@ -74,12 +74,12 @@ const ButtonArrow = (_a) => {
     let iconElement = null;
     if (props.direction) {
         const IconComponent = iconsMap[props.direction];
-        iconElement = React__default.default.createElement(IconComponent, { size: "1rem" });
+        iconElement = React__default.default.createElement(IconComponent, { icon: iconsMap[props.direction], size: "1rem" });
     }
     else if (React.isValidElement(props.icon)) {
         iconElement = React.cloneElement(props.icon, { size: '1rem' });
     }
-    return (React__default.default.createElement(Element, { id: props.id, href: props.href, name: props.name, type: props.type, onClick: props.onClick, onMouseDown: props.onMouseDown, darkBg: props.darkBg, disabled: props.disabled, className: props.className, "data-testid": dataTestId, "data-track-value": dataTrackValue, dataAttributes: props.dataAttributes, "aria-label": ariaLabel }, iconElement));
+    return (React__default.default.createElement(Element, { id: props.id, name: props.name, type: props.type, onClick: props.onClick, onMouseDown: props.onMouseDown, darkBg: props.darkBg, disabled: props.disabled, className: props.className, "data-testid": dataTestId, "data-track-value": dataTrackValue, dataAttributes: props.dataAttributes, "aria-label": ariaLabel }, iconElement));
 };
 
 exports.default = ButtonArrow;

package/build/cjs/components/ButtonIcon/ButtonIcon.js

@@ -125,11 +125,11 @@ const ButtonElement = styledComponents.styled.button `
 `;
 /** @visibleName Button Icon */
 const ButtonIcon = React.forwardRef((_a, ref) => {
-    var { icon = icons.EditUnderline, 'data-testid': dataTestId, 'data-no-close': dataNoClose, 'data-track-value': dataTrackValue } = _a, props = tslib.__rest(_a, ["icon", 'data-testid', 'data-no-close', 'data-track-value']);
+    var { icon = icons.EditUnderline, 'data-testid': dataTestId, 'data-track-value': dataTrackValue } = _a, props = tslib.__rest(_a, ["icon", 'data-testid', 'data-track-value']);
     const position = props.isReversed ? 'right' : 'left';
-    return (React__default.default.createElement(ButtonElement, Object.assign({ ref: ref, id: props.id, name: props.name, type: props.type, onClick: props.onClick, onMouseDown: props.onMouseDown, "$small": props.small, "$darkBg": props.darkBg, "$loading": props.loading, tabIndex: props.loading ? -1 : 0, "data-loading": props.loading, disabled: props.disabled, "$hideChildrenMobile": props.hideChildrenMobile, "$isReversed": props.isReversed, className: props.className, "data-testid": dataTestId, "data-no-close": dataNoClose, "data-track-value": dataTrackValue, "aria-expanded": props.ariaExpanded, "aria-label": props.ariaLabel, "$isLinkStyle": props.isLinkStyle }, props.dataAttributes), props.loading ? (React__default.default.createElement(PixelLoader.default, { color: props.darkBg ? theme.default.color.default.white : theme.default.color.default.black, label: props.loadingLabel })) : (React__default.default.createElement(React__default.default.Fragment, null,
+    return (React__default.default.createElement(ButtonElement, Object.assign({ ref: ref, id: props.id, name: props.name, type: props.type, onClick: props.onClick, onMouseDown: props.onMouseDown, "$small": props.small, "$darkBg": props.darkBg, "$loading": props.loading, tabIndex: props.loading ? -1 : 0, "data-loading": props.loading, disabled: props.disabled, "$hideChildrenMobile": props.hideChildrenMobile, "$isReversed": props.isReversed, className: props.className, "data-testid": dataTestId, "data-track-value": dataTrackValue, "aria-expanded": props.ariaExpanded, "aria-label": props.ariaLabel, "$isLinkStyle": props.isLinkStyle }, props.dataAttributes), props.loading ? (React__default.default.createElement(PixelLoader.default, { color: props.darkBg ? theme.default.color.default.white : theme.default.color.default.black, label: props.loadingLabel })) : (React__default.default.createElement(React__default.default.Fragment, null,
         React__default.default.createElement(Icon.default, { icon: icon, color: props.darkBg ? theme.default.color.default.white : theme.default.color.default.pink, size: props.small ? '1.25rem' : '1.5rem', position: props.children ? position : undefined, "aria-hidden": true }),
-        props.children && (React__default.default.createElement("span", { "data-testid": dataTestId && `${dataTestId}-text`, "data-no-close": dataNoClose }, props.children))))));
+        props.children && (React__default.default.createElement("span", { "data-testid": dataTestId && `${dataTestId}-text` }, props.children))))));
 });
 
 exports.default = ButtonIcon;

package/build/cjs/components/Chip/Chip.d.ts

@@ -1,7 +1,6 @@
 import type { MouseEvent, ReactNode } from 'react';
 import React from 'react';
-type ChipType = 'default' | 'info' | 'success' | 'warning' | 'error';
-type ChipVariant = 'outlined' | 'filled';
+type ChipType = 'default' | 'success' | 'error';
 interface Props {
     /**
      * Unique ID for the component
@@ -11,27 +10,12 @@ interface Props {
      * Allows to change the color styling of component, depending on the passed type
      *
      * @param {ChipType} default Uses default color: `theme.color.line.L01`
-     * @param {ChipType} info Changes color to default color (this type will be deprecated in the future)
      * @param {ChipType} success Uses `theme.color.notification.success` color for styling
-     * @param {ChipType} warning Changes color to default color (this type will be deprecated in the future)
      * @param {ChipType} error Uses `theme.color.notification.error` color for styling
      *
-     * @deprecated The 'info' and 'warning' types will be deprecated and removed in the next major release.
-     *
      * @default 'default'
      */
     type?: ChipType;
-    /**
-     * Allows to change the appearance styling of component, depending on passed variant
-     *
-     * @param {ChipVariant} outlined
-     * @param {ChipVariant} filled
-     *
-     * @deprecated The styles are now encapsulated within the component. The 'variant' prop will be removed in the next major release.
-     *
-     * @default 'outlined'
-     */
-    variant?: ChipVariant;
     /**
      * Content of the component
      */
@@ -58,6 +42,6 @@ interface Props {
      */
     ariaDescribedBy?: string;
 }
-declare const Chip: ({ type, variant, "data-testid": dataTestId, ...props }: Props) => React.JSX.Element;
+declare const Chip: ({ type, "data-testid": dataTestId, ...props }: Props) => React.JSX.Element;
 /** @component */
 export default Chip;

package/build/cjs/components/Chip/Chip.js

@@ -56,9 +56,9 @@ const Element = styledComponents.styled.div `
     }
 `;
 const Chip = (_a) => {
-    var { type = 'default', variant = 'outlined', 'data-testid': dataTestId } = _a, props = tslib.__rest(_a, ["type", "variant", 'data-testid']);
+    var { type = 'default', 'data-testid': dataTestId } = _a, props = tslib.__rest(_a, ["type", 'data-testid']);
     const label = props.ariaLabel || (typeof props.children === 'string' ? props.children : undefined);
-    return (React__default.default.createElement(Element, { as: props.onClick ? 'button' : 'div', id: props.id, "$type": type, "$variant": variant, onClick: props.onClick, className: props.className, "data-testid": dataTestId, "aria-label": label, "aria-describedby": props.ariaDescribedBy, tabIndex: 0 }, props.children));
+    return (React__default.default.createElement(Element, { as: props.onClick ? 'button' : 'div', id: props.id, "$type": type, onClick: props.onClick, className: props.className, "data-testid": dataTestId, "aria-label": label, "aria-describedby": props.ariaDescribedBy, tabIndex: 0 }, props.children));
 };
 
 exports.default = Chip;

package/build/cjs/components/Drawer/Drawer.d.ts

@@ -60,13 +60,6 @@ interface Props {
      * @default 'right'
      */
     side?: Side;
-    /**
-     * Allows to pass a custom margin
-     *
-     * @default '0'
-     * @deprecated Will be removed in the next major version
-     */
-    margin?: string;
     /**
      * Allows to pass a custom padding
      *

package/build/cjs/components/Drawer/Drawer.js

@@ -179,7 +179,7 @@ const Drawer = (_a) => {
     ReactModal__default.default.setAppElement(appElement);
     return (React__default.default.createElement(React__default.default.Fragment, null,
         React__default.default.createElement(StyledReactModal, { id: props.id, isOpen: props.isOpen, overlayElement: ModalOverlay, contentElement: ModalContent, onRequestClose: props.onRequestClose, portalClassName: props.className, contentLabel: props.contentLabel, shouldCloseOnEsc: isClosable, shouldCloseOnOverlayClick: isClosable, closeTimeoutMS: 300, "$size": size, "$side": side },
-            React__default.default.createElement(StyledBox, { "data-testid": dataTestId, elevation: "extraHigh", margin: props.margin, padding: "0" },
+            React__default.default.createElement(StyledBox, { "data-testid": dataTestId, elevation: "extraHigh", padding: "0" },
                 React__default.default.createElement(ContentContainer, null,
                     React__default.default.createElement(Header, { "$variant": variant, "data-testid": dataTestId && `${dataTestId}-header` },
                         React__default.default.createElement(Title, { "$size": size, "$variant": variant }, props.title),

package/build/cjs/components/Footer/Components/FooterComponents.js

@@ -13,7 +13,6 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
-/* eslint-disable react/no-array-index-key */
 const linkHoverStyles = styledComponents.css `
     &:hover,
     &:focus,

package/build/cjs/components/Hero/Hero.js

@@ -174,8 +174,9 @@ const renderImage = (ImageComponent, imageProps) => {
     if (!imageProps)
         return null;
     if (typeof ImageComponent === 'string') {
-        // eslint-disable-next-line jsx-a11y/alt-text, react/jsx-props-no-spreading
-        return React__default.default.createElement("img", Object.assign({}, imageProps));
+        const { alt } = imageProps, rest = tslib.__rest(imageProps, ["alt"]);
+        // eslint-disable-next-line react/jsx-props-no-spreading
+        return React__default.default.createElement("img", Object.assign({ alt: alt }, rest));
     }
     // eslint-disable-next-line react/jsx-props-no-spreading
     return React__default.default.createElement(ImageComponent, Object.assign({}, imageProps));

package/build/cjs/components/Icon/Icon.d.ts

@@ -23,13 +23,7 @@ export interface Props extends Partial<IconProps> {
      *
      * @type Icon
      */
-    icon?: ComponentType<IconType>;
-    /**
-     * Icon name
-     *
-     * @deprecated Use property `icon`
-     */
-    name?: string;
+    icon: ComponentType<IconType>;
     /**
      * On Icon click callback
      */
@@ -61,6 +55,6 @@ export interface Props extends Partial<IconProps> {
      */
     'aria-hidden'?: boolean;
 }
-declare const Icon: ({ name, icon: IconParam, color, size, "data-testid": dataTestId, "aria-label": ariaLabel, "aria-hidden": ariaHidden, ...props }: Props) => React.JSX.Element;
+declare const Icon: ({ icon: IconParam, color, size, "data-testid": dataTestId, "aria-label": ariaLabel, "aria-hidden": ariaHidden, ...props }: Props) => React.JSX.Element;
 /** @component */
 export default Icon;

package/build/cjs/components/Icon/Icon.js

@@ -7,13 +7,11 @@ var React = require('react');
 var styledComponents = require('styled-components');
 var theme = require('../../themes/theme.js');
 var styledUtils = require('../../utils/styledUtils.js');
-var index = require('../Icons/index.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
-const IconsList = index;
 const IconContainer = styledComponents.styled.span `
     display: inline-flex;
     width: ${({ size }) => size};
@@ -35,14 +33,9 @@ const IconContainer = styledComponents.styled.span `
     }
 `;
 const Icon = (_a) => {
-    var { name, icon: IconParam, color = 'currentColor', size = '1.5rem', 'data-testid': dataTestId, 'aria-label': ariaLabel, 'aria-hidden': ariaHidden } = _a, props = tslib.__rest(_a, ["name", "icon", "color", "size", 'data-testid', 'aria-label', 'aria-hidden']);
-    // TODO: Remove once https://jira.dna.fi/browse/STYLE-334 is done
-    const RenderIcon = name && IconsList[name];
-    return (React__default.default.createElement(React__default.default.Fragment, null,
-        RenderIcon && (React__default.default.createElement(IconContainer, { "$position": props.position, size: size, className: "dnasg-icon", "data-testid": dataTestId },
-            React__default.default.createElement(RenderIcon, Object.assign({}, props, { size: size, color: color })))),
-        IconParam && (React__default.default.createElement(IconContainer, { onClick: props.onClick, "$position": props.position, size: size, className: `dnasg-icon ${props.className || ''}`.trim(), "data-testid": dataTestId, "aria-label": ariaLabel, "aria-hidden": ariaHidden, role: !ariaHidden ? 'img' : undefined },
-            React__default.default.createElement(IconParam, { size: size, color: color })))));
+    var { icon: IconParam, color = 'currentColor', size = '1.5rem', 'data-testid': dataTestId, 'aria-label': ariaLabel, 'aria-hidden': ariaHidden } = _a, props = tslib.__rest(_a, ["icon", "color", "size", 'data-testid', 'aria-label', 'aria-hidden']);
+    return (React__default.default.createElement(IconContainer, { onClick: props.onClick, "$position": props.position, size: size, className: `dnasg-icon ${props.className || ''}`.trim(), "data-testid": dataTestId, "aria-label": ariaLabel, "aria-hidden": ariaHidden, role: !ariaHidden ? 'img' : undefined },
+        React__default.default.createElement(IconParam, { size: size, color: color })));
 };
 
 exports.default = Icon;

package/build/cjs/components/Input/Input.d.ts

@@ -2,10 +2,6 @@ import type { ChangeEvent, FocusEvent, KeyboardEvent, MouseEvent } from 'react';
 import React from 'react';
 type InputStatus = 'none' | 'success' | 'error' | 'comment';
 type InputType = 'email' | 'hidden' | 'number' | 'password' | 'range' | 'search' | 'tel' | 'text' | 'url';
-/**
- * @deprecated Use `DateTimePicker` component
- */
-type InputTypeDeprecated = 'date' | 'month' | 'time' | 'week';
 interface Props {
     /**
      * Unique ID for the input element
@@ -28,14 +24,9 @@ interface Props {
      * @param {InputType} text Single-line text field
      * @param {InputType} url Used for entering a URL and supported with browser validation
      *
-     * @param {InputTypeDeprecated} date DEPRECATED Use `DateTimePicker` component
-     * @param {InputTypeDeprecated} month DEPRECATED Use `DateTimePicker` component
-     * @param {InputTypeDeprecated} time DEPRECATED Use `DateTimePicker` component
-     * @param {InputTypeDeprecated} week DEPRECATED Use `DateTimePicker` component
-     *
      * @default 'text'
      */
-    type?: InputType | InputTypeDeprecated;
+    type?: InputType;
     /**
      * Default value of input element
      */

package/build/cjs/components/LabelText/LabelText.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from 'react';
 import React from 'react';
-type LabelTextStatus = 'info' | 'success' | 'warning' | 'error';
+type LabelTextStatus = 'error';
 interface Props {
     /**
      * Unique ID for the component
@@ -18,12 +18,7 @@ interface Props {
      * Styling of `label` element changes depending on the passed status
      *
      * @param {LabelTextStatus} undefined Default styling
-     * @param {LabelTextStatus} info Changes color to default color (this type will be deprecated in the future)
-     * @param {LabelTextStatus} success Changes color to default color (this type will be deprecated in the future)
-     * @param {LabelTextStatus} warning Changes color to default color (this type will be deprecated in the future)
      * @param {LabelTextStatus} error Changes color to `theme.color.notification.error`
-     *
-     * @deprecated info, success and warning are deprecated, please switch to default or error status
      */
     status?: LabelTextStatus;
     /**

package/build/cjs/components/MainHeaderNavigation/ChildComponents/MainNavTooltipMenu.d.ts

@@ -12,7 +12,7 @@ interface MainNavTooltipMenuProps<ContentProps extends object = object> extends
     tooltipRight?: string;
     /** Mandatory Component provided as login content */
     contentComponent?: ComponentType<ContentProps> | ReactNode | boolean;
-    /** Array of tags (lowercase) that will close menu if they are inside the dropdown tooltip menu. default []. THIS CAN BE OVERRIDEN WITH data-no-close="true" in element */
+    /** Array of tags (lowercase) that will close menu if they are inside the dropdown tooltip menu. default []. THIS CAN BE OVERRIDEN WITH className="no-close" in element */
     closeWhenTagClicked?: string[];
     /** Width of the opened menu content. default 20rem. */
     contentWidth?: string;

package/build/cjs/components/MainHeaderNavigation/ChildComponents/MinicartTooltip.js

@@ -14,8 +14,8 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
 const MinicartTooltip = ({ minicartAmount, minicartAmountLabel, minicartLabel, onCartButtonClick, }) => {
-    const { navZIndex, minicartComponent } = React.useContext(NavContext.default);
-    return (React__default.default.createElement(MainNavTooltipMenu.default, { closeWhenTagClicked: ['a', 'button'], onCartButtonClick: onCartButtonClick, contentComponent: minicartComponent, contentWidth: "35rem", fullWidthBreakpoint: theme.default.breakpoints.md, globalStateString: "minicart", tooltipRight: "5rem", zIndex: navZIndex + 1 },
+    const { navZIndex } = React.useContext(NavContext.default);
+    return (React__default.default.createElement(MainNavTooltipMenu.default, { closeWhenTagClicked: ['a', 'button'], onCartButtonClick: onCartButtonClick, contentWidth: "35rem", fullWidthBreakpoint: theme.default.breakpoints.md, globalStateString: "minicart", tooltipRight: "5rem", zIndex: navZIndex + 1 },
         React__default.default.createElement(icons.Cart, null),
         React__default.default.createElement("span", { "aria-hidden": !!minicartAmountLabel }, minicartLabel),
         minicartAmount > 0 && (React__default.default.createElement(NotificationBadge.default, { "data-testid": "header-minicart-amount", right: "5px", top: "-5px", visuallyHiddenText: minicartAmountLabel }, minicartAmount))));

package/build/cjs/components/MainHeaderNavigation/MainHeaderNavigation.d.ts

@@ -19,12 +19,6 @@ export interface MainHeaderNavigationProps {
     minicartText?: string;
     minicartAmount?: number;
     minicartAmountLabel?: string;
-    /**
-     * Defines MinicartComponent when used. If minicart is true but component is not provided, shown as disabled element.
-     *
-     * @deprecated Use `onCartButtonClick` property instead
-     */
-    minicartComponent?: ComponentType | ReactNode | boolean;
     showMinicart?: boolean;
     /**
      * On Cart button click callback
@@ -47,6 +41,6 @@ export interface MainHeaderNavigationProps {
     notificationText?: string;
 }
 /** @visibleName MainHeaderNavigation */
-declare const MainHeaderNavigation: ({ backToPreviousCategoryLabel, businessMenuAriaLabel, categoryCollectionText, closeMainMenuAriaLabel, className, collapseSize, currentUrl, dnaLogoLinkAriaLabel, featuredItemsAriaLabel, isLoggedIn, items, language, languageSelector, languageSelectorText, login, loginComponent, loginText, mainMenuAriaLabel, minicart, minicartAmount, minicartAmountLabel, minicartComponent, minicartText, nextJSLinkComponent, nextJSLinkLegacyBehavior, notificationText, openMainMenuAriaLabel, search, searchComponent, searchText, showLoginTooltip, showMinicart, zIndex, ...props }: MainHeaderNavigationProps) => React.JSX.Element;
+declare const MainHeaderNavigation: ({ backToPreviousCategoryLabel, businessMenuAriaLabel, categoryCollectionText, closeMainMenuAriaLabel, className, collapseSize, currentUrl, dnaLogoLinkAriaLabel, featuredItemsAriaLabel, isLoggedIn, items, language, languageSelector, languageSelectorText, login, loginComponent, loginText, mainMenuAriaLabel, minicart, minicartAmount, minicartAmountLabel, minicartText, nextJSLinkComponent, nextJSLinkLegacyBehavior, notificationText, openMainMenuAriaLabel, search, searchComponent, searchText, showLoginTooltip, showMinicart, zIndex, ...props }: MainHeaderNavigationProps) => React.JSX.Element;
 /** @component */
 export default MainHeaderNavigation;

package/build/cjs/components/MainHeaderNavigation/MainHeaderNavigation.js

@@ -134,7 +134,7 @@ const initiateScrollToHeader = (componentRef) => {
 /** @visibleName MainHeaderNavigation */
 const MainHeaderNavigation = (_a) => {
     var _b, _c, _d;
-    var { backToPreviousCategoryLabel = '', businessMenuAriaLabel = 'Sivustot', categoryCollectionText = 'Muut kategoriat', closeMainMenuAriaLabel, className, collapseSize = 767, currentUrl = '', dnaLogoLinkAriaLabel, featuredItemsAriaLabel = '', isLoggedIn = false, items = {}, language = 'fi', languageSelector = false, languageSelectorText = 'Vaihda kieltä', login = true, loginComponent, loginText = 'Kirjaudu', mainMenuAriaLabel = 'Päänavigaatio', minicart = true, minicartAmount = 0, minicartAmountLabel, minicartComponent = false, minicartText = 'Ostoskori', nextJSLinkComponent = false, nextJSLinkLegacyBehavior = true, notificationText = '', openMainMenuAriaLabel, search = true, searchComponent = false, searchText = 'Haku', showLoginTooltip = false, showMinicart = false, zIndex = 1030 } = _a, props = tslib.__rest(_a, ["backToPreviousCategoryLabel", "businessMenuAriaLabel", "categoryCollectionText", "closeMainMenuAriaLabel", "className", "collapseSize", "currentUrl", "dnaLogoLinkAriaLabel", "featuredItemsAriaLabel", "isLoggedIn", "items", "language", "languageSelector", "languageSelectorText", "login", "loginComponent", "loginText", "mainMenuAriaLabel", "minicart", "minicartAmount", "minicartAmountLabel", "minicartComponent", "minicartText", "nextJSLinkComponent", "nextJSLinkLegacyBehavior", "notificationText", "openMainMenuAriaLabel", "search", "searchComponent", "searchText", "showLoginTooltip", "showMinicart", "zIndex"]);
+    var { backToPreviousCategoryLabel = '', businessMenuAriaLabel = 'Sivustot', categoryCollectionText = 'Muut kategoriat', closeMainMenuAriaLabel, className, collapseSize = 767, currentUrl = '', dnaLogoLinkAriaLabel, featuredItemsAriaLabel = '', isLoggedIn = false, items = {}, language = 'fi', languageSelector = false, languageSelectorText = 'Vaihda kieltä', login = true, loginComponent, loginText = 'Kirjaudu', mainMenuAriaLabel = 'Päänavigaatio', minicart = true, minicartAmount = 0, minicartAmountLabel, minicartText = 'Ostoskori', nextJSLinkComponent = false, nextJSLinkLegacyBehavior = true, notificationText = '', openMainMenuAriaLabel, search = true, searchComponent = false, searchText = 'Haku', showLoginTooltip = false, showMinicart = false, zIndex = 1030 } = _a, props = tslib.__rest(_a, ["backToPreviousCategoryLabel", "businessMenuAriaLabel", "categoryCollectionText", "closeMainMenuAriaLabel", "className", "collapseSize", "currentUrl", "dnaLogoLinkAriaLabel", "featuredItemsAriaLabel", "isLoggedIn", "items", "language", "languageSelector", "languageSelectorText", "login", "loginComponent", "loginText", "mainMenuAriaLabel", "minicart", "minicartAmount", "minicartAmountLabel", "minicartText", "nextJSLinkComponent", "nextJSLinkLegacyBehavior", "notificationText", "openMainMenuAriaLabel", "search", "searchComponent", "searchText", "showLoginTooltip", "showMinicart", "zIndex"]);
     const { isMobile } = useWindowSize.default(collapseSize);
     const navigationEl = React.useRef(null);
     const key = ramda.prop('id');
@@ -254,7 +254,6 @@ const MainHeaderNavigation = (_a) => {
             level2Items,
             loginComponent,
             menuLevel,
-            minicartComponent,
             navZIndex: zIndex,
             nextJSLinkComponent,
             nextJSLinkLegacyBehavior,
@@ -280,7 +279,6 @@ const MainHeaderNavigation = (_a) => {
         level2Items,
         loginComponent,
         menuLevel,
-        minicartComponent,
         nextJSLinkComponent,
         nextJSLinkLegacyBehavior,
         searchComponent,

package/build/cjs/components/MainHeaderNavigation/context/NavContext.d.ts

@@ -17,7 +17,6 @@ export interface NavContextProps {
     lang: string;
     loginComponent?: ComponentType | ReactNode | boolean;
     menuLevel: MenuStates;
-    minicartComponent?: ComponentType | ReactNode | boolean;
     navZIndex: number;
     nextJSLinkComponent: ComponentType | ReactNode | boolean;
     nextJSLinkLegacyBehavior?: boolean;

package/build/cjs/components/MainHeaderNavigation/context/NavContext.js

@@ -40,7 +40,6 @@ const NavContext = React.createContext({
         scrollPosition: 0,
         hideOnScroll: false,
     },
-    minicartComponent: undefined,
     navZIndex: 1030,
     nextJSLinkComponent: false,
     nextJSLinkLegacyBehavior: true,

package/build/cjs/components/Modal/Modal.d.ts

@@ -63,11 +63,6 @@ interface Props {
      * Allows to set property `aria-label` for content element
      */
     contentLabel?: string;
-    /**
-     * Allows changing CSS property `max-width` for Modal content wrapper element.
-     * @deprecated Replaced with 'size' property
-     */
-    maxWidth?: string;
     /**
      * Allows to change the size of the component.
      * Size in mobile view is always 100% of the window size

package/build/cjs/components/ReadMore/ReadMore.d.ts

@@ -17,12 +17,6 @@ interface Props {
      * @default false
      */
     isExpanded?: boolean;
-    /**
-     * Allows to show component in expanded state on init and immediately close after load
-     *
-     * @deprecated Use `isExpanded` property
-     */
-    seoInitExpanded?: boolean;
     /**
      * On ButtonIcon mouse click callback.
      */
@@ -46,20 +40,6 @@ interface Props {
      * @default '10rem'
      */
     collapsedSize?: string;
-    /**
-     * Allows to change the label of ButtonIcon.
-     * Note: Ignored when `isStateless` is set to true
-     *
-     * @deprecated Use `buttonLabel` property
-     */
-    showMoreText?: string;
-    /**
-     * Allows to change the label of ButtonIcon.
-     * Note: Ignored when `isStateless` is set to true
-     *
-     * @deprecated Use `buttonLabel` property
-     */
-    showLessText?: string;
     /**
      * Allows to pass a custom className
      */

package/build/cjs/components/ReadMore/ReadMore.js

@@ -44,14 +44,13 @@ const StyledButtonIcon = styledComponents.styled(ButtonIcon.default) `
 /** @visibleName Read More */
 const ReadMore = (_a) => {
     var { collapsedSize = '10rem', 'data-testid': dataTestId } = _a, props = tslib.__rest(_a, ["collapsedSize", 'data-testid']);
-    const [expanded, setExpanded] = React.useState(props.seoInitExpanded === true || false);
+    const [expanded, setExpanded] = React.useState(false);
     const contentRef = React.useRef(null);
     const buttonRef = React.useRef(null);
     const userInteractedRef = React.useRef(false);
     // TODO: Remove once https://jira.dna.fi/browse/STYLE-662 is done
     const temporaryIsStatelessFlag = typeof props.isExpanded !== 'undefined';
     const temporaryStateManagement = temporaryIsStatelessFlag ? props.isExpanded : expanded;
-    const temporaryButtonLabel = temporaryStateManagement ? props.showLessText : props.showMoreText;
     const handleOnClick = (event) => {
         if (props.onClick) {
             props.onClick(event);
@@ -61,11 +60,6 @@ const ReadMore = (_a) => {
         }
         userInteractedRef.current = true;
     };
-    React.useEffect(() => {
-        if (props.seoInitExpanded) {
-            setExpanded(false);
-        }
-    }, [props.seoInitExpanded]);
     React.useEffect(() => {
         var _a, _b;
         if (userInteractedRef.current) {
@@ -92,7 +86,7 @@ const ReadMore = (_a) => {
     return (React__default.default.createElement(Container, { id: props.id, className: props.className, "data-testid": dataTestId, "aria-label": props.ariaLabel, role: "region" },
         React__default.default.createElement(Content, { ref: contentRef, "$isExpanded": temporaryStateManagement, "$collapsedSize": collapsedSize, "data-testid": dataTestId && `${dataTestId}-content`, "aria-hidden": temporaryStateManagement ? 'false' : 'true', tabIndex: temporaryStateManagement ? 0 : -1 }, React.Children.map(props.children, forceTabIndexOnTextLinks)),
         React__default.default.createElement(ButtonWrapper, { "$buttonPosition": props.buttonPosition },
-            React__default.default.createElement(StyledButtonIcon, { ref: buttonRef, icon: temporaryStateManagement ? icons.ChevronUp : icons.ChevronDown, onClick: handleOnClick, "aria-expanded": temporaryStateManagement }, temporaryButtonLabel || props.buttonLabel))));
+            React__default.default.createElement(StyledButtonIcon, { ref: buttonRef, icon: temporaryStateManagement ? icons.ChevronUp : icons.ChevronDown, onClick: handleOnClick, "aria-expanded": temporaryStateManagement }, props.buttonLabel))));
 };
 
 exports.default = ReadMore;

package/build/cjs/components/Tab/Tab.d.ts

@@ -1,10 +1,6 @@
 import type { MouseEvent, ReactNode } from 'react';
 import React from 'react';
 type Type = 'box' | 'panel' | 'underlined';
-/**
- * @deprecated Use `box`, `panel` or `underlined` types
- */
-type TypeDeprecated = 'default' | 'gray';
 export interface Props {
     /**
      * Unique ID for the component
@@ -21,45 +17,21 @@ export interface Props {
      * @param {Type} panel Content container remains unstyled
      * @param {Type} underlined Tab label is visually similar to anchor, with content container unstyled
      *
-     * @param {TypeDeprecated} default DEPRECATED Use `box` type
-     * @param {TypeDeprecated} gray DEPRECATED Use `box`, `panel` or `underlined` types
-     *
      * @default 'box'
      */
-    type?: Type | TypeDeprecated;
-    /**
-     * Style of the tab
-     *
-     * @deprecated Use `type` property
-     */
-    tabStyle?: Type;
+    type?: Type;
     /**
      * Content of the component
      */
     children?: ReactNode;
-    /**
-     * Allows to define currently active tab
-     *
-     * @deprecated Use `isActive` property
-     */
-    activeTab?: string;
     /**
      * Allows to set tab as active
      */
     isActive?: boolean;
-    /**
-     * Allows to enable updated internal state management.
-     * Note: In updated internal state management, this component acts as truly stateless and can be controlled with `isActive` property.
-     *
-     * @deprecated Will be removed in next major release
-     */
-    isStateless?: boolean;
     /**
      * On tab label click callback
-     *
-     * @deprecated Parameter `tab` has been deprecated. Use `e` parameter instead
      */
-    onClick?: (tab: string, e?: MouseEvent<HTMLElement>) => void;
+    onClick?: (label: string, e?: MouseEvent<HTMLElement>) => void;
     /**
      * Allows to pass testid string for testing purposes
      */

package/build/cjs/components/Tab/Tab.js

@@ -7,8 +7,6 @@ var React = require('react');
 var styledComponents = require('styled-components');
 var theme = require('../../themes/theme.js');
 var styledUtils = require('../../utils/styledUtils.js');
-var Box = require('../Box/Box.js');
-var Divider = require('../Divider/Divider.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
@@ -64,26 +62,6 @@ const TabStyle = styledComponents.styled.li `
             background-color: transparent;
         `}
 `;
-const ContentContainer = styledComponents.styled.div `
-    ${({ $type }) => {
-    if ($type === 'box' || $type === 'default') {
-        return `
-                border-top-left-radius: 0;
-            `;
-    }
-    if ($type === 'panel') {
-        return `
-                border-top: 1px solid ${theme.default.color.line.L03};
-            `;
-    }
-    if ($type === 'underlined' || $type === 'gray') {
-        return `
-                margin-top: ${theme.default.grid.gutter};
-            `;
-    }
-    return '';
-}}
-`;
 /** @visibleName Tab */
 const Tab = (_a) => {
     var { type = 'box', 'data-testid': dataTestId } = _a, props = tslib.__rest(_a, ["type", 'data-testid']);
@@ -92,17 +70,8 @@ const Tab = (_a) => {
             props.onClick(props.label, e);
         }
     };
-    const isActive = props.activeTab ? props.activeTab === props.label : props.isActive;
-    return type === 'box' || type === 'default' || type === 'panel' ? (React__default.default.createElement(React__default.default.Fragment, null,
-        React__default.default.createElement(TabLabel, { role: "tab", id: props.id, "$type": type, "aria-selected": isActive, "$isActive": isActive, onClick: onClickHandler, tabIndex: isActive ? 0 : -1 }, props.label),
-        props.isStateless &&
-            (props.children && (props.activeTab === props.label || props.isActive) ? (React__default.default.createElement(ContentContainer, { role: "tabpanel", "$type": props.tabStyle || type, as: (type === 'box' || type === 'default') && !props.tabStyle
-                    ? Box.default
-                    : undefined }, props.children)) : (React__default.default.createElement(Divider.default, { margin: "0" }))))) : (React__default.default.createElement(React__default.default.Fragment, null,
-        React__default.default.createElement(TabStyle, { role: "tab", id: props.id, "$type": props.tabStyle || type, "aria-selected": isActive, "$isActive": isActive, onClick: onClickHandler, tabIndex: isActive ? 0 : -1 }, props.label),
-        props.isStateless &&
-            props.children &&
-            (props.activeTab === props.label || props.isActive) && (React__default.default.createElement(ContentContainer, { role: "tabpanel", "$type": props.tabStyle || type }, props.children))));
+    const { isActive } = props;
+    return type === 'box' || type === 'panel' ? (React__default.default.createElement(TabLabel, { role: "tab", "data-testid": dataTestId, id: props.id, "$type": type, "aria-selected": isActive, "$isActive": isActive, onClick: onClickHandler, tabIndex: isActive ? 0 : -1 }, props.label)) : (React__default.default.createElement(TabStyle, { role: "tab", "data-testid": dataTestId, id: props.id, "$type": type, "aria-selected": isActive, "$isActive": isActive, onClick: onClickHandler, tabIndex: isActive ? 0 : -1 }, props.label));
 };
 
 exports.default = Tab;