@itwin/itwinui-react 3.11.3 → 3.12.0

package/cjs/core/DropdownMenu/DropdownMenu.js

@@ -1,117 +1,72 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
+'use strict';
+Object.defineProperty(exports, '__esModule', {
+  value: true,
+});
+Object.defineProperty(exports, 'DropdownMenu', {
+  enumerable: true,
+  get: function () {
+    return DropdownMenu;
+  },
 });
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DropdownMenu = void 0;
-/*---------------------------------------------------------------------------------------------
- * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
- * See LICENSE.md in the project root for license terms and full copyright notice.
- *--------------------------------------------------------------------------------------------*/
-const React = __importStar(require("react"));
-const index_js_1 = require("../../utils/index.js");
-const Menu_js_1 = require("../Menu/Menu.js");
-const Popover_js_1 = require("../Popover/Popover.js");
-const react_1 = require("@floating-ui/react");
-const MenuItem_js_1 = require("../Menu/MenuItem.js");
-/**
- * Dropdown menu component.
- * Built on top of the {@link Popover} component.
- * @example
- * const menuItems = (close: () => void) => [
- *   <MenuItem key={1} onClick={onClick(1, close)}>
- *     Item #1
- *   </MenuItem>,
- *   <MenuItem key={2} onClick={onClick(2, close)}>
- *     Item #2
- *   </MenuItem>,
- *   <MenuItem key={3} onClick={onClick(3, close)}>
- *     Item #3
- *   </MenuItem>,
- * ];
- * <DropdownMenu menuItems={menuItems}>
- *   <Button>Menu</Button>
- * </DropdownMenu>
- */
-exports.DropdownMenu = React.forwardRef((props, forwardedRef) => {
-    return (React.createElement(react_1.FloatingTree, null,
-        React.createElement(DropdownMenuContent, { ref: forwardedRef, ...props })));
+const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
+const _jsxruntime = require('react/jsx-runtime');
+const _react = _interop_require_wildcard._(require('react'));
+const _index = require('../../utils/index.js');
+const _Menu = require('../Menu/Menu.js');
+const _react1 = require('@floating-ui/react');
+const DropdownMenu = _react.forwardRef((props, forwardedRef) => {
+  return (0, _jsxruntime.jsx)(_react1.FloatingTree, {
+    children: (0, _jsxruntime.jsx)(DropdownMenuContent, {
+      ref: forwardedRef,
+      ...props,
+    }),
+  });
 });
-// ----------------------------------------------------------------------------
-const DropdownMenuContent = React.forwardRef((props, forwardedRef) => {
-    const { menuItems, children, role = 'menu', visible: visibleProp, placement = 'bottom-start', matchWidth = false, onVisibleChange, portal = true, ...rest } = props;
-    const [visible, setVisible] = (0, index_js_1.useControlledState)(false, visibleProp, onVisibleChange);
-    const triggerRef = React.useRef(null);
-    const close = React.useCallback(() => {
-        setVisible(false);
-        triggerRef.current?.focus({ preventScroll: true });
-    }, [setVisible]);
-    const menuContent = React.useMemo(() => {
-        if (typeof menuItems === 'function') {
-            return menuItems(close);
+const DropdownMenuContent = _react.forwardRef((props, forwardedRef) => {
+  const {
+    menuItems,
+    children,
+    role = 'menu',
+    visible: visibleProp,
+    placement = 'bottom-start',
+    matchWidth = false,
+    onVisibleChange,
+    portal = true,
+    ...rest
+  } = props;
+  const [visible, setVisible] = (0, _index.useControlledState)(
+    false,
+    visibleProp,
+    onVisibleChange,
+  );
+  const menuContent = _react.useMemo(() => {
+    if (typeof menuItems === 'function') {
+      return menuItems(() => setVisible(false));
+    }
+    return menuItems;
+  }, [menuItems, setVisible]);
+  return (0, _jsxruntime.jsx)(_jsxruntime.Fragment, {
+    children: (0, _jsxruntime.jsx)(_Menu.Menu, {
+      trigger: children,
+      onKeyDown: (0, _index.mergeEventHandlers)(props.onKeyDown, (e) => {
+        if (e.defaultPrevented) {
+          return;
         }
-        return menuItems;
-    }, [menuItems, close]);
-    const [currentFocusedNodeIndex, setCurrentFocusedNodeIndex] = React.useState(null);
-    const focusableNodes = React.useRef([]);
-    const nodeId = (0, react_1.useFloatingNodeId)();
-    const popover = (0, Popover_js_1.usePopover)({
-        nodeId,
-        visible,
-        onVisibleChange: (open) => (open ? setVisible(true) : close()),
+        if (e.key === 'Tab') {
+          setVisible(false);
+        }
+      }),
+      role: role,
+      ref: forwardedRef,
+      portal: portal,
+      popoverProps: {
         placement,
         matchWidth,
-        interactions: {
-            listNavigation: {
-                activeIndex: currentFocusedNodeIndex,
-                onNavigate: setCurrentFocusedNodeIndex,
-                listRef: focusableNodes,
-                focusItemOnOpen: true,
-            },
-        },
-    });
-    const popoverRef = (0, index_js_1.useMergedRefs)(forwardedRef, popover.refs.setFloating);
-    return (React.createElement(React.Fragment, null,
-        (0, index_js_1.cloneElementWithRef)(children, (children) => ({
-            ...popover.getReferenceProps(children.props),
-            'aria-expanded': popover.open,
-            ref: (0, index_js_1.mergeRefs)(triggerRef, popover.refs.setReference),
-        })),
-        React.createElement(react_1.FloatingNode, { id: nodeId }, popover.open && (React.createElement(index_js_1.Portal, { portal: portal },
-            React.createElement(MenuItem_js_1.MenuItemContext.Provider, { value: {
-                    setCurrentFocusedNodeIndex,
-                    focusableNodes,
-                } },
-                React.createElement(Menu_js_1.Menu, { setFocus: false, ...popover.getFloatingProps({
-                        role,
-                        ...rest,
-                        onKeyDown: (0, index_js_1.mergeEventHandlers)(props.onKeyDown, (e) => {
-                            if (e.defaultPrevented) {
-                                return;
-                            }
-                            if (e.key === 'Tab') {
-                                close();
-                            }
-                        }),
-                    }), ref: popoverRef }, menuContent)))))));
+        visible,
+        onVisibleChange: setVisible,
+      },
+      ...rest,
+      children: menuContent,
+    }),
+  });
 });

package/cjs/core/ExpandableBlock/ExpandableBlock.d.ts

@@ -106,9 +106,9 @@ export declare const ExpandableBlock: PolymorphicForwardRefComponent<"div", Expa
     EndIcon: PolymorphicForwardRefComponent<"span", Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
         ref?: ((instance: HTMLSpanElement | null) => void) | React.RefObject<HTMLSpanElement> | null | undefined;
     }, "fill" | "as" | "key" | "size" | keyof React.HTMLAttributes<HTMLSpanElement> | "padded"> & {
-        size?: "small" | "auto" | "medium" | "large" | import("../../utils/types.js").AnyString | undefined;
-        fill?: "default" | "positive" | "negative" | "warning" | import("../../utils/types.js").AnyString | "informational" | undefined;
-        padded?: boolean | undefined;
+        size?: "auto" | "small" | "medium" | "large" | import("../../utils/types.js").AnyString;
+        fill?: "default" | "positive" | "informational" | "negative" | "warning" | import("../../utils/types.js").AnyString;
+        padded?: boolean;
     } & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
         as?: "span" | undefined;
     }, "ref">>;

package/cjs/core/ExpandableBlock/ExpandableBlock.js

@@ -1,197 +1,216 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
+'use strict';
+Object.defineProperty(exports, '__esModule', {
+  value: true,
 });
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ExpandableBlock = void 0;
-/*---------------------------------------------------------------------------------------------
- * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
- * See LICENSE.md in the project root for license terms and full copyright notice.
- *--------------------------------------------------------------------------------------------*/
-const classnames_1 = __importDefault(require("classnames"));
-const React = __importStar(require("react"));
-const index_js_1 = require("../../utils/index.js");
-const Icon_js_1 = require("../Icon/Icon.js");
-const LinkAction_js_1 = require("../LinkAction/LinkAction.js");
-const ExpandableBlockContext = React.createContext(undefined);
+Object.defineProperty(exports, 'ExpandableBlock', {
+  enumerable: true,
+  get: function () {
+    return ExpandableBlock;
+  },
+});
+const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
+const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
+const _jsxruntime = require('react/jsx-runtime');
+const _classnames = _interop_require_default._(require('classnames'));
+const _react = _interop_require_wildcard._(require('react'));
+const _index = require('../../utils/index.js');
+const _Icon = require('../Icon/Icon.js');
+const _LinkAction = require('../LinkAction/LinkAction.js');
+const ExpandableBlockContext = _react.createContext(undefined);
 ExpandableBlockContext.displayName = 'ExpandableBlockContext';
-const ExpandableBlockComponent = React.forwardRef((props, forwardedRef) => {
-    const { children, title, caption, endIcon, ...rest } = props;
-    return (React.createElement(exports.ExpandableBlock.Wrapper, { ...rest, ref: forwardedRef },
-        React.createElement(exports.ExpandableBlock.Trigger, { label: title, caption: caption, endIcon: endIcon }),
-        React.createElement(exports.ExpandableBlock.Content, null, children)));
+const ExpandableBlockComponent = _react.forwardRef((props, forwardedRef) => {
+  const { children, title, caption, endIcon, ...rest } = props;
+  return (0, _jsxruntime.jsxs)(ExpandableBlock.Wrapper, {
+    ...rest,
+    ref: forwardedRef,
+    children: [
+      (0, _jsxruntime.jsx)(ExpandableBlock.Trigger, {
+        label: title,
+        caption: caption,
+        endIcon: endIcon,
+      }),
+      (0, _jsxruntime.jsx)(ExpandableBlock.Content, {
+        children: children,
+      }),
+    ],
+  });
 });
 ExpandableBlockComponent.displayName = 'ExpandableBlock';
-// ----------------------------------------------------------------------------
-const ExpandableBlockWrapper = React.forwardRef((props, forwardedRef) => {
-    const { children, className, onToggle, style, isExpanded, status, size = 'default', styleType = 'default', disabled = false, ...rest } = props;
-    const [expandedState, setExpanded] = React.useState(isExpanded ?? false);
-    const expanded = isExpanded ?? expandedState;
-    const [descriptionId, setDescriptionId] = React.useState(undefined);
-    return (React.createElement(ExpandableBlockContext.Provider, { value: {
-            status,
-            isExpanded: expanded,
-            onToggle,
-            size,
-            styleType,
-            disabled,
-            setExpanded,
-            children,
-            descriptionId,
-            setDescriptionId,
-        } },
-        React.createElement(index_js_1.Box, { className: (0, classnames_1.default)('iui-expandable-block', className), "data-iui-expanded": expanded, "data-iui-size": size, "data-iui-variant": styleType !== 'default' ? styleType : undefined, style: style, ref: forwardedRef, ...rest }, children)));
+const ExpandableBlockWrapper = _react.forwardRef((props, forwardedRef) => {
+  const {
+    children,
+    className,
+    onToggle,
+    style,
+    isExpanded,
+    status,
+    size = 'default',
+    styleType = 'default',
+    disabled = false,
+    ...rest
+  } = props;
+  const [expandedState, setExpanded] = _react.useState(isExpanded ?? false);
+  const expanded = isExpanded ?? expandedState;
+  const [descriptionId, setDescriptionId] = _react.useState(undefined);
+  return (0, _jsxruntime.jsx)(ExpandableBlockContext.Provider, {
+    value: {
+      status,
+      isExpanded: expanded,
+      onToggle,
+      size,
+      styleType,
+      disabled,
+      setExpanded,
+      children,
+      descriptionId,
+      setDescriptionId,
+    },
+    children: (0, _jsxruntime.jsx)(_index.Box, {
+      className: (0, _classnames.default)('iui-expandable-block', className),
+      'data-iui-expanded': expanded,
+      'data-iui-size': size,
+      'data-iui-variant': styleType !== 'default' ? styleType : undefined,
+      style: style,
+      ref: forwardedRef,
+      ...rest,
+      children: children,
+    }),
+  });
 });
 ExpandableBlockWrapper.displayName = 'ExpandableBlock.Wrapper';
-const ExpandableBlockTrigger = React.forwardRef((props, forwardedRef) => {
-    const { className, children, label, caption, expandIcon, endIcon, ...rest } = props;
-    const { disabled, status } = (0, index_js_1.useSafeContext)(ExpandableBlockContext);
-    return (React.createElement(LinkAction_js_1.LinkBox, { className: (0, classnames_1.default)('iui-expandable-header', className), "data-iui-disabled": disabled ? 'true' : undefined, ref: forwardedRef, ...rest }, children ?? (React.createElement(React.Fragment, null,
-        expandIcon ?? React.createElement(exports.ExpandableBlock.ExpandIcon, null),
-        React.createElement(exports.ExpandableBlock.LabelArea, null,
-            React.createElement(exports.ExpandableBlock.Title, null, label),
-            caption && (React.createElement(exports.ExpandableBlock.Caption, null, caption))),
-        endIcon || status ? (React.createElement(exports.ExpandableBlock.EndIcon, null, endIcon)) : null))));
+const ExpandableBlockTrigger = _react.forwardRef((props, forwardedRef) => {
+  const { className, children, label, caption, expandIcon, endIcon, ...rest } =
+    props;
+  const { disabled, status } = (0, _index.useSafeContext)(
+    ExpandableBlockContext,
+  );
+  return (0, _jsxruntime.jsx)(_LinkAction.LinkBox, {
+    className: (0, _classnames.default)('iui-expandable-header', className),
+    'data-iui-disabled': disabled ? 'true' : undefined,
+    ref: forwardedRef,
+    ...rest,
+    children:
+      children ??
+      (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
+        children: [
+          expandIcon ?? (0, _jsxruntime.jsx)(ExpandableBlock.ExpandIcon, {}),
+          (0, _jsxruntime.jsxs)(ExpandableBlock.LabelArea, {
+            children: [
+              (0, _jsxruntime.jsx)(ExpandableBlock.Title, {
+                children: label,
+              }),
+              caption &&
+                (0, _jsxruntime.jsx)(ExpandableBlock.Caption, {
+                  children: caption,
+                }),
+            ],
+          }),
+          endIcon || status
+            ? (0, _jsxruntime.jsx)(ExpandableBlock.EndIcon, {
+                children: endIcon,
+              })
+            : null,
+        ],
+      }),
+  });
 });
 ExpandableBlockTrigger.displayName = 'ExpandableBlock.Trigger';
-// ----------------------------------------------------------------------------
-// ExpandableBlock.ExpandIcon component
-const ExpandableBlockExpandIcon = React.forwardRef((props, forwardedRef) => {
-    const { className, children, ...rest } = props;
-    return (React.createElement(Icon_js_1.Icon, { className: (0, classnames_1.default)('iui-expandable-block-icon', className), ref: forwardedRef, ...rest }, children ?? React.createElement(index_js_1.SvgChevronRight, { "aria-hidden": true })));
+const ExpandableBlockExpandIcon = _react.forwardRef((props, forwardedRef) => {
+  const { className, children, ...rest } = props;
+  return (0, _jsxruntime.jsx)(_Icon.Icon, {
+    className: (0, _classnames.default)('iui-expandable-block-icon', className),
+    ref: forwardedRef,
+    ...rest,
+    children:
+      children ??
+      (0, _jsxruntime.jsx)(_index.SvgChevronRight, {
+        'aria-hidden': true,
+      }),
+  });
 });
 ExpandableBlockExpandIcon.displayName = 'ExpandableBlock.ExpandIcon';
-// ----------------------------------------------------------------------------
-// ExpandableBlock.LabelArea component
-const ExpandableBlockLabelArea = index_js_1.polymorphic.span('iui-expandable-block-label');
+const ExpandableBlockLabelArea = _index.polymorphic.span(
+  'iui-expandable-block-label',
+);
 ExpandableBlockLabelArea.displayName = 'ExpandableBlock.LabelArea';
-// ----------------------------------------------------------------------------
-// ExpandableBlock.Title component
-const ExpandableBlockTitle = React.forwardRef((props, forwardedRef) => {
-    const { className, children, onClick: onClickProp, ...rest } = props;
-    const { isExpanded, setExpanded, disabled, onToggle, descriptionId } = (0, index_js_1.useSafeContext)(ExpandableBlockContext);
-    return (React.createElement(index_js_1.ButtonBase, { className: (0, classnames_1.default)('iui-expandable-block-title', 'iui-link-action', className), "aria-expanded": isExpanded, "aria-disabled": disabled, onClick: (0, index_js_1.mergeEventHandlers)(onClickProp, () => {
-            if (disabled) {
-                return;
-            }
-            setExpanded(!isExpanded);
-            onToggle?.(!isExpanded);
-        }), ref: forwardedRef, "aria-describedby": descriptionId, ...rest }, children));
+const ExpandableBlockTitle = _react.forwardRef((props, forwardedRef) => {
+  const { className, children, onClick: onClickProp, ...rest } = props;
+  const { isExpanded, setExpanded, disabled, onToggle, descriptionId } = (0,
+  _index.useSafeContext)(ExpandableBlockContext);
+  return (0, _jsxruntime.jsx)(_index.ButtonBase, {
+    className: (0, _classnames.default)(
+      'iui-expandable-block-title',
+      'iui-link-action',
+      className,
+    ),
+    'aria-expanded': isExpanded,
+    'aria-disabled': disabled,
+    onClick: (0, _index.mergeEventHandlers)(onClickProp, () => {
+      if (disabled) {
+        return;
+      }
+      setExpanded(!isExpanded);
+      onToggle?.(!isExpanded);
+    }),
+    ref: forwardedRef,
+    'aria-describedby': descriptionId,
+    ...rest,
+    children: children,
+  });
 });
 ExpandableBlockTitle.displayName = 'ExpandableBlock.Title';
-// ----------------------------------------------------------------------------
-// ExpandableBlock.Caption component
-const ExpandableBlockCaption = React.forwardRef((props, forwardedRef) => {
-    const fallbackId = (0, index_js_1.useId)();
-    const { setDescriptionId } = (0, index_js_1.useSafeContext)(ExpandableBlockContext);
-    React.useEffect(() => {
-        setDescriptionId(props.id || fallbackId);
-        return () => setDescriptionId(undefined);
-    }, [props.id, fallbackId, setDescriptionId]);
-    return (React.createElement(index_js_1.Box, { ref: forwardedRef, id: fallbackId, ...props, className: (0, classnames_1.default)('iui-expandable-block-caption', props?.className) }));
+const ExpandableBlockCaption = _react.forwardRef((props, forwardedRef) => {
+  const fallbackId = (0, _index.useId)();
+  const { setDescriptionId } = (0, _index.useSafeContext)(
+    ExpandableBlockContext,
+  );
+  _react.useEffect(() => {
+    setDescriptionId(props.id || fallbackId);
+    return () => setDescriptionId(undefined);
+  }, [props.id, fallbackId, setDescriptionId]);
+  return (0, _jsxruntime.jsx)(_index.Box, {
+    ref: forwardedRef,
+    id: fallbackId,
+    ...props,
+    className: (0, _classnames.default)(
+      'iui-expandable-block-caption',
+      props?.className,
+    ),
+  });
 });
 ExpandableBlockCaption.displayName = 'ExpandableBlock.Caption';
-// ----------------------------------------------------------------------------
-// ExpandableBlock.EndIcon component
-const ExpandableBlockEndIcon = React.forwardRef((props, forwardedRef) => {
-    const { children, ...rest } = props;
-    const { status } = (0, index_js_1.useSafeContext)(ExpandableBlockContext);
-    const icon = children ?? (status && index_js_1.StatusIconMap[status]());
-    return (React.createElement(Icon_js_1.Icon, { fill: status, ref: forwardedRef, ...rest }, icon));
+const ExpandableBlockEndIcon = _react.forwardRef((props, forwardedRef) => {
+  const { children, ...rest } = props;
+  const { status } = (0, _index.useSafeContext)(ExpandableBlockContext);
+  const icon = children ?? (status && _index.StatusIconMap[status]());
+  return (0, _jsxruntime.jsx)(_Icon.Icon, {
+    fill: status,
+    ref: forwardedRef,
+    ...rest,
+    children: icon,
+  });
 });
 ExpandableBlockEndIcon.displayName = 'ExpandableBlock.EndIcon';
-const ExpandableBlockContent = React.forwardRef((props, forwardedRef) => {
-    const { className, children, innerProps, ...rest } = props;
-    return (React.createElement(index_js_1.Box, { className: (0, classnames_1.default)('iui-expandable-content', className), ref: forwardedRef, ...rest },
-        React.createElement(index_js_1.Box, { ...innerProps }, children)));
+const ExpandableBlockContent = _react.forwardRef((props, forwardedRef) => {
+  const { className, children, innerProps, ...rest } = props;
+  return (0, _jsxruntime.jsx)(_index.Box, {
+    className: (0, _classnames.default)('iui-expandable-content', className),
+    ref: forwardedRef,
+    ...rest,
+    children: (0, _jsxruntime.jsx)(_index.Box, {
+      ...innerProps,
+      children: children,
+    }),
+  });
 });
 ExpandableBlockContent.displayName = 'ExpandableBlock.Content';
-/**
- * Expandable block with customizable Title, Caption, Content and EndIcon subcomponents.
- * @example
- *  <ExpandableBlock.Wrapper>
- *    <ExpandableBlock.Trigger>
- *      <ExpandableBlock.ExpandIcon/>
- *      <ExpandableBlock.LabelArea>
- *        <ExpandableBlock.Title/>
- *        <ExpandableBlock.Caption/>
- *      </ExpandableBlock.LabelArea>
- *      <ExpandableBlock.EndIcon/>
- *    </ExpandableBlock.Trigger>
- *    <ExpandableBlock.Content/>
- *  </ExpandableBlock.Wrapper>
- */
-exports.ExpandableBlock = Object.assign(ExpandableBlockComponent, {
-    Wrapper: ExpandableBlockWrapper,
-    /**
-     * `Header` container that contains `ExpandIcon`, `LabelArea` and `EndIcon` subcomponents
-     * @example
-     * <ExpandableBlock.Trigger>
-     *    <ExpandableBlock.ExpandIcon/>
-     *    <ExpandableBlock.LabelArea/>
-     *    <ExpandableBlock.EndIcon/>
-     * </ExpandableBlock.Trigger>
-     */
-    Trigger: ExpandableBlockTrigger,
-    /**
-     * The expanding icon on the left of header
-     */
-    ExpandIcon: ExpandableBlockExpandIcon,
-    /**
-     * `LabelArea` subcomponent that contains `Title` and `Caption`
-     * @example
-     * <ExpandableBlock.LabelArea>
-     *    <ExpandableBLock.Title> Title </ExpandableBlock.Title>
-     *    <ExpandableBlock.Caption> Caption </ExpandableBlock.Caption>
-     * </ExpandableBlock.LabelArea>
-     */
-    LabelArea: ExpandableBlockLabelArea,
-    /**
-     * The main text displayed on the block header, regardless of state.
-     */
-    Title: ExpandableBlockTitle,
-    /**
-     * Small note displayed below title, regardless of state.
-     */
-    Caption: ExpandableBlockCaption,
-    /**
-     * Svg icon displayed at the end of the main text.
-     * Will override status icon if specified. Used inside `Header` subcomponent.
-     * @example
-     * <ExpandableBlock.Trigger>
-     *    <ExpandableBlock.EndIcon> <SvgIcon/> </ExpandableBlock.EndIcon>
-     * <ExpandableBlock.Trigger/>
-     */
-    EndIcon: ExpandableBlockEndIcon,
-    /**
-     * Content shown in the block's body when fully expanded.
-     * @example
-     * <ExpandableBlock.Wrapper>
-     *    <ExpandableBlock.Content> Content </ExpandableBlock.Content>
-     * </ExpandableBlock.Wrapper>
-     */
-    Content: ExpandableBlockContent,
+const ExpandableBlock = Object.assign(ExpandableBlockComponent, {
+  Wrapper: ExpandableBlockWrapper,
+  Trigger: ExpandableBlockTrigger,
+  ExpandIcon: ExpandableBlockExpandIcon,
+  LabelArea: ExpandableBlockLabelArea,
+  Title: ExpandableBlockTitle,
+  Caption: ExpandableBlockCaption,
+  EndIcon: ExpandableBlockEndIcon,
+  Content: ExpandableBlockContent,
 });