@festo-ui/react 8.2.0-dev.582 → 8.2.0-dev.584

package/node/lib/components/accordion/Accordion.js

@@ -13,8 +13,8 @@ let nextId = 0;
 const Accordion = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
     children,
-    showMore = 'Show more',
-    showLess = 'Show less',
+    showMore = "Show more",
+    showLess = "Show less",
     keepItemsOpen = true,
     className,
     transparent = false,
@@ -39,8 +39,8 @@ const Accordion = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     value: contextValue,
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       ref: ref,
-      className: (0, _classnames.default)('fr-accordion', {
-        'fwe-bg-white': !transparent
+      className: (0, _classnames.default)("fr-accordion", {
+        "fwe-bg-white": !transparent
       }, className),
       ...props,
       children: children

package/node/lib/components/accordion/accordion-header/AccordionHeader.js

@@ -16,7 +16,7 @@ const AccordionHeader = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   } = _ref;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     ref: ref,
-    className: (0, _classnames.default)('fr-accordion-header', className),
+    className: (0, _classnames.default)("fr-accordion-header", className),
     ...props,
     children: children
   });

package/node/lib/components/accordion/accordion-item/AccordionItem.js

@@ -56,10 +56,10 @@ const AccordionItem = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     value: contextValue,
     children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       ref: ref,
-      className: (0, _classnames.default)('fr-accordion-item', {
-        'fr-accordion-item--collapsed': !expanded,
-        'fr-accordion-item--expanded': expanded,
-        'fr-accordion-item--highlighted': expanded && highlighted
+      className: (0, _classnames.default)("fr-accordion-item", {
+        "fr-accordion-item--collapsed": !expanded,
+        "fr-accordion-item--expanded": expanded,
+        "fr-accordion-item--highlighted": expanded && highlighted
       }, className),
       ...props,
       children: [children, /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {

package/node/lib/components/accordion/accordion-item/accordion-item-body/AccordionItemBody.js

@@ -24,7 +24,7 @@ const AccordionItemBody = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   const innerRef = (0, _react.useRef)(null);
   const element = innerRef.current;
   const combinedRef = (0, _useForkRef.default)(ref, innerRef);
-  const initialHeight = (0, _react.useRef)(expanded ? 'auto' : 0);
+  const initialHeight = (0, _react.useRef)(expanded ? "auto" : 0);
   const handleEntering = () => {
     if (element) {
       const itemHeight = element.scrollHeight;
@@ -33,7 +33,7 @@ const AccordionItemBody = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   };
   const handleEntered = () => {
     if (element) {
-      element.style.height = 'auto';
+      element.style.height = "auto";
     }
   };
   const handleExit = () => {
@@ -45,7 +45,7 @@ const AccordionItemBody = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   const handleExiting = () => {
     setTimeout(() => {
       if (element) {
-        element.style.height = '0px';
+        element.style.height = "0px";
       }
     });
   };
@@ -62,7 +62,7 @@ const AccordionItemBody = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
       role: "region",
       id: `${id}-body`,
       "aria-labelledby": `${id}-header`,
-      className: (0, _classnames.default)('fr-accordion-item-body', className),
+      className: (0, _classnames.default)("fr-accordion-item-body", className),
       style: {
         height: initialHeight.current,
         minHeight: 0

package/node/lib/components/accordion/accordion-item/accordion-item-header/AccordionItemHeader.js

@@ -20,20 +20,20 @@ const AccordionItemHeader = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     id
   } = (0, _react.useContext)(_AccordionItemContext.default);
   function handleKeyDown(event) {
-    if (event.key === 'Enter') {
+    if (event.key === "Enter") {
       event.preventDefault();
       toggle?.(event);
     }
   }
   function handleKeyUp(event) {
-    if (event.key === 'Enter') {
+    if (event.key === "Enter") {
       event.preventDefault();
       toggle?.(event);
     }
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     ref: ref,
-    className: (0, _classnames.default)('fr-accordion-item-header', className),
+    className: (0, _classnames.default)("fr-accordion-item-header", className),
     role: "button",
     tabIndex: 0,
     id: `${id}-header`,

package/node/lib/components/bottom-sheet/BottomSheet.js

@@ -16,7 +16,7 @@ function BottomSheet(_ref) {
     children,
     open,
     defaultExpanded,
-    expandFrom = 'center',
+    expandFrom = "center",
     hasBackdrop = true,
     hideCloseIcon,
     onOpenChange
@@ -61,17 +61,17 @@ function BottomSheet(_ref) {
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: (0, _classnames.default)('fwe-bottom-sheet-backdrop', {
-        'fwe-bottom-sheet-backdrop--visible': hasBackdrop && open && !isClosing
+      className: (0, _classnames.default)("fwe-bottom-sheet-backdrop", {
+        "fwe-bottom-sheet-backdrop--visible": hasBackdrop && open && !isClosing
       }),
       onClick: closeBottomSheet
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: (0, _classnames.default)('fwe-bottom-sheet-container', {
-        'fwe-bottom-sheet-container--open': open,
-        'fwe-bottom-sheet-container--expanded': expanded,
-        'fwe-bottom-sheet-container--expand-from-center': expandFrom === 'center',
-        'fwe-bottom-sheet-container--with-backdrop': hasBackdrop,
-        'fwe-bottom-sheet-container--closing': isClosing
+      className: (0, _classnames.default)("fwe-bottom-sheet-container", {
+        "fwe-bottom-sheet-container--open": open,
+        "fwe-bottom-sheet-container--expanded": expanded,
+        "fwe-bottom-sheet-container--expand-from-center": expandFrom === "center",
+        "fwe-bottom-sheet-container--with-backdrop": hasBackdrop,
+        "fwe-bottom-sheet-container--closing": isClosing
       }),
       onTouchStart: handleTouchStart,
       onTouchMove: handleTouchMove,

package/node/lib/components/bottom-sheet/BottomSheet.stories.js

@@ -10,7 +10,7 @@ var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const meta = {
   component: _BottomSheet.default,
-  title: 'Components/Bottom Sheet',
+  title: "Components/Bottom Sheet",
   decorators: [Story => /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     style: {
       minHeight: 600
@@ -44,7 +44,7 @@ const WithoutBackdrop = exports.WithoutBackdrop = {
 };
 const ExpandFromBottom = exports.ExpandFromBottom = {
   args: {
-    expandFrom: 'bottom'
+    expandFrom: "bottom"
   },
   render: Default.render
 };

package/node/lib/components/breadcrumb/Breadcrumb.js

@@ -25,13 +25,13 @@ function Breadcrumb(_ref) {
         ...element,
         props: {
           ...element.props,
-          className: 'fr-breadcrumb-location'
+          className: "fr-breadcrumb-location"
         }
       });
     }
   });
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    className: (0, _classnames.default)('fwe-breadcrumb', className),
+    className: (0, _classnames.default)("fwe-breadcrumb", className),
     children: locations ? locations.map(location => /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.default.Fragment, {
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
         className: "fr-breadcrumb-location",

package/node/lib/components/buttons/button/Button.js

@@ -12,7 +12,7 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
 const Button = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
     icon,
-    type = 'button',
+    type = "button",
     disabled = false,
     iconOnly = false,
     large = false,
@@ -24,18 +24,18 @@ const Button = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     children,
     ...props
   } = _ref;
-  const classes = (0, _classnames.default)('fwe-btn', 'fr-button', {
-    'fwe-btn-icon': iconOnly
+  const classes = (0, _classnames.default)("fwe-btn", "fr-button", {
+    "fwe-btn-icon": iconOnly
   }, {
-    'fwe-disabled': disabled
+    "fwe-disabled": disabled
   }, {
-    'fwe-btn-hero': primary && !tertiary
+    "fwe-btn-hero": primary && !tertiary
   }, {
-    'fwe-btn-link': tertiary && !primary
+    "fwe-btn-link": tertiary && !primary
   }, {
-    'fwe-btn-lg': large
+    "fwe-btn-lg": large
   }, {
-    'fwe-btn-floating': floating
+    "fwe-btn-floating": floating
   }, className);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
     // ignore here because fallback will explicitly be set to type 'button'

package/node/lib/components/buttons/button/Button.stories.js

@@ -10,7 +10,7 @@ var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const meta = {
   component: _Button.default,
-  title: 'Components/Buttons'
+  title: "Components/Buttons"
 };
 var _default = exports.default = meta;
 const Overview = exports.Overview = {
@@ -50,36 +50,36 @@ const Overview = exports.Overview = {
 const Primary = exports.Primary = {
   args: {
     primary: true,
-    children: 'Primary'
+    children: "Primary"
   }
 };
 const Secondary = exports.Secondary = {
   args: {
-    children: 'Secondary'
+    children: "Secondary"
   }
 };
 const Tertiary = exports.Tertiary = {
   args: {
     tertiary: true,
-    children: 'Tertiary'
+    children: "Tertiary"
   }
 };
 const Sizes = exports.Sizes = {
   args: {
-    children: 'Large Button',
+    children: "Large Button",
     large: true
   }
 };
 const Icon = exports.Icon = {
   args: {
-    children: 'With Icon',
-    icon: 'ecommerce-core-range-product'
+    children: "With Icon",
+    icon: "ecommerce-core-range-product"
   }
 };
 const IconOnly = exports.IconOnly = {
   args: {
     iconOnly: true,
-    icon: 'ecommerce-core-range-product'
+    icon: "ecommerce-core-range-product"
   }
 };
 const Floating = exports.Floating = {
@@ -88,6 +88,6 @@ const Floating = exports.Floating = {
     large: true,
     primary: true,
     floating: true,
-    icon: 'ecommerce-core-range-product'
+    icon: "ecommerce-core-range-product"
   }
 };

package/node/lib/components/card/Card.js

@@ -13,7 +13,7 @@ function Card(_ref) {
     className
   } = _ref;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    className: (0, _classnames.default)('fwe-card', className),
+    className: (0, _classnames.default)("fwe-card", className),
     children: children
   });
 }

package/node/lib/components/card/CardBody.js

@@ -14,7 +14,7 @@ function CardBody(_ref) {
     className
   } = _ref;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    className: (0, _classnames.default)('fwe-card-body', className),
+    className: (0, _classnames.default)("fwe-card-body", className),
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: "fwe-card-text",
       children: text

package/node/lib/components/card/CardHeader.js

@@ -18,10 +18,10 @@ function CardHeader(_ref) {
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
     children: [image ? /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
       alt: image.alt,
-      className: `fwe-card-img-${image.aspectRatio === '3/2' ? '32' : '169'}`,
+      className: `fwe-card-img-${image.aspectRatio === "3/2" ? "32" : "169"}`,
       src: image.src
     }) : null, /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: (0, _classnames.default)('fwe-card-header', className),
+      className: (0, _classnames.default)("fwe-card-header", className),
       children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         className: "fwe-card-title",
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("h5", {

package/node/lib/components/card/CardHeader.stories.helper.js

@@ -11,7 +11,7 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
 
 const cardImage = {
   src: _gallery01Webp.default,
-  alt: 'Asset',
-  aspectRatio: '16/9'
+  alt: "Asset",
+  aspectRatio: "16/9"
 };
 var _default = exports.default = cardImage;

package/node/lib/components/chips/chip/Chip.js

@@ -26,18 +26,18 @@ function Chip(_ref) {
     onClick,
     className
   } = _ref;
-  const classes = (0, _classnames.default)('fr-chip', 'fwe-chip', {
-    'fwe-selected': selected
+  const classes = (0, _classnames.default)("fr-chip", "fwe-chip", {
+    "fwe-selected": selected
   }, {
-    'fwe-disabled': disabled
+    "fwe-disabled": disabled
   }, {
-    'fwe-chip-lg': large
+    "fwe-chip-lg": large
   }, {
-    'fwe-category': type === ChipType.Category
+    "fwe-category": type === ChipType.Category
   }, {
-    'fwe-filter': type === ChipType.Filter
+    "fwe-filter": type === ChipType.Filter
   }, {
-    'fwe-readonly': type === ChipType.Readonly
+    "fwe-readonly": type === ChipType.Readonly
   }, className);
   return (
     /*#__PURE__*/

package/node/lib/components/chips/chip-container/ChipContainer.js

@@ -13,8 +13,8 @@ function ChipContainer(_ref) {
     children,
     className
   } = _ref;
-  const classes = (0, _classnames.default)('fwe-chip-container', {
-    'fwe-chip-container-lg': large
+  const classes = (0, _classnames.default)("fwe-chip-container", {
+    "fwe-chip-container-lg": large
   }, className);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     className: classes,

package/node/lib/components/icon-wrapper/IconWrapper.js

@@ -10,9 +10,9 @@ function IconWrapper(_ref) {
     icon
   } = _ref;
   if (!icon) return null;
-  if (typeof icon === 'string') {
+  if (typeof icon === "string") {
     let iconName = icon;
-    if (!icon.startsWith('fwe-icon-')) {
+    if (!icon.startsWith("fwe-icon-")) {
       iconName = `fwe-icon-${icon}`;
     }
     return /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {

package/node/lib/components/link-button/LinkButton.js

@@ -19,10 +19,10 @@ const LinkButton = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     className,
     ...props
   } = _ref;
-  const classes = (0, _classnames.default)('fwe-btn', 'fwe-btn-link', {
-    'fwe-disabled': disabled
+  const classes = (0, _classnames.default)("fwe-btn", "fwe-btn-link", {
+    "fwe-disabled": disabled
   }, {
-    'fwe-btn-icon': iconOnly
+    "fwe-btn-icon": iconOnly
   }, className);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
     onClick: onClick,

package/node/lib/components/loading-indicator/LoadingIndicator.js

@@ -10,19 +10,19 @@ var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const LoadingIndicator = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
-    size = 'large',
+    size = "large",
     children,
     className,
     ...props
   } = _ref;
-  const classes = (0, _classnames.default)('fwe-waiting-indicator', {
-    'fwe-waiting-indicator-md': size === 'medium'
+  const classes = (0, _classnames.default)("fwe-waiting-indicator", {
+    "fwe-waiting-indicator-md": size === "medium"
   }, {
-    'fwe-waiting-indicator-sm': size === 'small'
+    "fwe-waiting-indicator-sm": size === "small"
   });
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    className: (0, _classnames.default)('fwe-waiting-container', {
-      'fwe-waiting-container-sm': size === 'small'
+    className: (0, _classnames.default)("fwe-waiting-container", {
+      "fwe-waiting-container-sm": size === "small"
     }, className),
     ref: ref,
     ...props,

package/node/lib/components/mobile-flyout/MobileFlyout.js

@@ -12,7 +12,7 @@ var _useControlled = _interopRequireDefault(require("../../helper/useControlled.
 var _MobileFlyoutContext = _interopRequireDefault(require("./MobileFlyoutContext.js"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const defaultVisibleValue = ['root'];
+const defaultVisibleValue = ["root"];
 const MobileFlyout = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
     className,
@@ -67,17 +67,17 @@ const MobileFlyout = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     back
   }), [handleVisibleChange, visibleState, back, handleOpenChange]);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    className: (0, _classnames.default)('fwe-mobile-flyout', className),
+    className: (0, _classnames.default)("fwe-mobile-flyout", className),
     ...props,
     ref: combinedRef,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
       "aria-label": "menu",
       type: "button",
-      className: openState ? 'fwe-close-button' : 'fwe-burger-button',
+      className: openState ? "fwe-close-button" : "fwe-burger-button",
       onClick: toggle
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: (0, _classnames.default)('fwe-mobile-flyout-container', {
-        'fwe-opened': openState
+      className: (0, _classnames.default)("fwe-mobile-flyout-container", {
+        "fwe-opened": openState
       }),
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_MobileFlyoutContext.default.Provider, {
         value: contextValue,

package/node/lib/components/mobile-flyout/mobile-flyout-page/MobileFlyoutPage.js

@@ -23,15 +23,15 @@ const MobileFlyoutPage = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     back: backContext
   } = (0, _react.useContext)(_MobileFlyoutContext.default);
   const innerVisible = root || name && visible.includes(name);
-  const innerBack = back ?? backContext ?? 'Back';
+  const innerBack = back ?? backContext ?? "Back";
   function handleChange() {
     if (name) {
       setVisible(name);
     }
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    className: (0, _classnames.default)('fwe-mobile-flyout-page', {
-      'fwe-opened': innerVisible
+    className: (0, _classnames.default)("fwe-mobile-flyout-page", {
+      "fwe-opened": innerVisible
     }),
     ref: ref,
     ...props,

package/node/lib/components/modals/AlertModal.js

@@ -25,10 +25,10 @@ function AlertModal(_ref) {
   } = _ref;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.default, {
     className: (0, _classnames.default)({
-      'fwe-modal--with-indicator-bar': strong,
-      'fwe-modal--warning': alertType === 'warning',
-      'fwe-modal--error': alertType === 'error',
-      'fwe-modal--info': alertType === 'info'
+      "fwe-modal--with-indicator-bar": strong,
+      "fwe-modal--warning": alertType === "warning",
+      "fwe-modal--error": alertType === "error",
+      "fwe-modal--info": alertType === "info"
     }, className),
     head: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
       children: [subtitle && /*#__PURE__*/(0, _jsxRuntime.jsx)("h2", {
@@ -39,7 +39,7 @@ function AlertModal(_ref) {
         children: title
       })]
     }),
-    body: typeof body === 'string' ? /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+    body: typeof body === "string" ? /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
       children: body
     }) : body,
     ...props,
@@ -47,16 +47,16 @@ function AlertModal(_ref) {
       children: [cancel && /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
         type: "button",
         "aria-label": "Cancel",
-        className: (0, _classnames.default)('fwe-btn fwe-btn-lg', {
-          'fwe-btn-link': strong
+        className: (0, _classnames.default)("fwe-btn fwe-btn-lg", {
+          "fwe-btn-link": strong
         }),
         onClick: onCancel,
         children: cancel
       }), ok && /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
         type: "button",
         "aria-label": "Ok",
-        className: (0, _classnames.default)('fwe-btn fwe-btn-lg', {
-          'fwe-btn-hero': !strong
+        className: (0, _classnames.default)("fwe-btn fwe-btn-lg", {
+          "fwe-btn-hero": !strong
         }),
         onClick: onOk,
         children: ok

package/node/lib/components/modals/ConfirmModal.js

@@ -24,7 +24,7 @@ function ConfirmModal(_ref) {
   } = _ref;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.default, {
     className: (0, _classnames.default)({
-      'fwe-modal--large': large
+      "fwe-modal--large": large
     }, className),
     head: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
       children: [subtitle && /*#__PURE__*/(0, _jsxRuntime.jsx)("h2", {
@@ -35,7 +35,7 @@ function ConfirmModal(_ref) {
         children: title
       })]
     }),
-    body: typeof body === 'string' ? /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+    body: typeof body === "string" ? /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
       children: body
     }) : body,
     ...props,

package/node/lib/components/modals/CustomModal.js

@@ -20,7 +20,7 @@ const CustomModal = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   } = _ref;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ModalBase.default, {
     className: (0, _classnames.default)({
-      'fwe-modal--large': large
+      "fwe-modal--large": large
     }, className),
     ref: ref,
     ...props,

package/node/lib/components/modals/ModalBase.js

@@ -31,12 +31,12 @@ const ModalBase = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   const container = modalRef?.current?.ownerDocument || document;
   (0, _react.useEffect)(() => {
     const handleKeyDown = event => {
-      if (event.key === 'Escape' && isOpen) {
+      if (event.key === "Escape" && isOpen) {
         onClose?.();
       }
     };
-    container.addEventListener('keydown', handleKeyDown);
-    return () => container.removeEventListener('keydown', handleKeyDown);
+    container.addEventListener("keydown", handleKeyDown);
+    return () => container.removeEventListener("keydown", handleKeyDown);
   }, [onClose, isOpen, container]);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
     children: /*#__PURE__*/_reactDom.default.createPortal(/*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
@@ -77,7 +77,7 @@ const ModalBase = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactRemoveScroll.RemoveScroll, {
             ref: allRefs,
             enabled: isOpen,
-            className: (0, _classnames.default)('fr-modal fwe-modal', className),
+            className: (0, _classnames.default)("fr-modal fwe-modal", className),
             children: children
           })
         })

package/node/lib/components/modals/ModalFooter.js

@@ -15,9 +15,9 @@ const ModalFooter = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   } = _ref;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     ref: ref,
-    className: (0, _classnames.default)('fwe-modal-footer', className),
+    className: (0, _classnames.default)("fwe-modal-footer", className),
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: (0, _classnames.default)('fwe-modal-buttons'),
+      className: (0, _classnames.default)("fwe-modal-buttons"),
       children: children
     })
   });

package/node/lib/components/modals/image-gallery/ImageGallery.helper.js

@@ -7,7 +7,7 @@ exports.default = void 0;
 var _classnames = _interopRequireDefault(require("classnames"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const getClasses = (thumbnailImages, descriptiveContent, className) => {
-  const base = 'fwe-modal-image-gallery';
+  const base = "fwe-modal-image-gallery";
   const thumbnail = `${base}--with-thumbnails`;
   const container = `${base}--with-container`;
   return (0, _classnames.default)(base, {

package/node/lib/components/modals/image-gallery/ImageGallery.js

@@ -17,7 +17,7 @@ var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function getLength(pagination, images) {
   let length = 0;
-  if (typeof pagination === 'number') {
+  if (typeof pagination === "number") {
     length = pagination;
   } else if (pagination === true && images?.length) {
     length = images.length;
@@ -80,7 +80,7 @@ const ImageGallery = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
           children: children
         }), images && descriptiveContent === true ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_ImageGalleryContent.default, {
           imageContent: images?.[currentIndex - 1]?.content
-        }) : null, typeof descriptiveContent === 'function' ? descriptiveContent?.(currentIndex - 1) : null]
+        }) : null, typeof descriptiveContent === "function" ? descriptiveContent?.(currentIndex - 1) : null]
       })]
     })
   });