@dnb/eufemia 10.5.0 → 10.7.0

package/components/accordion/AccordionHeader.d.ts

@@ -1,97 +1,67 @@
-import * as React from 'react';
+/**
+ * Web Accordion Component
+ *
+ */
+import React from 'react';
+import type { SpacingProps } from '../space/types';
 import type { ButtonIconPosition } from '../Button';
 import type { HeadingLevel } from '../Heading';
 import type { IconSize } from '../Icon';
 import type { SkeletonShow } from '../Skeleton';
-import type { SpacingProps } from '../space/types';
 import type { AccordionIcon } from './Accordion';
-export interface AccordionHeaderTitleProps extends SpacingProps {
-  children?: React.ReactNode;
-}
-declare const AccordionHeaderTitle: React.FC<AccordionHeaderTitleProps>;
-export interface AccordionHeaderDescriptionProps extends SpacingProps {
-  children?: React.ReactNode;
-}
-declare const AccordionHeaderDescription: React.FC<AccordionHeaderDescriptionProps>;
-export interface AccordionHeaderContainerProps extends SpacingProps {
-  children?: React.ReactNode;
-}
-declare const AccordionHeaderContainer: React.FC<AccordionHeaderContainerProps>;
-export interface AccordionHeaderIconProps {
-  icon?: AccordionHeaderIconIcon;
-  size?: string;
-  expanded?: boolean;
-}
-declare const AccordionHeaderIcon: React.FC<AccordionHeaderIconProps>;
-export type AccordionHeaderTitle =
-  | string
-  | React.ReactNode
-  | ((...args: any[]) => any);
-export type AccordionHeaderDescription =
-  | string
-  | React.ReactNode
-  | ((...args: any[]) => any);
-export type AccordionHeaderLeftComponent =
-  | string
-  | React.ReactNode
-  | ((...args: any[]) => any);
-export type AccordionHeaderElement =
-  | string
-  | React.ReactNode
-  | ((...args: any[]) => any);
-export type AccordionHeaderHeading =
-  | boolean
-  | string
-  | React.ReactNode
-  | ((...args: any[]) => any);
-export type AccordionHeaderIcon =
-  | React.ReactNode
-  | ((...args: any[]) => any)
-  | {
-      closed?: React.ReactNode | ((...args: any[]) => any);
-      expanded?: React.ReactNode | ((...args: any[]) => any);
-    };
-export type AccordionHeaderChildren =
-  | string
-  | React.ReactNode
-  | ((...args: any[]) => any);
-export interface AccordionHeaderProps
-  extends React.HTMLProps<HTMLElement>,
-    SpacingProps {
-  title?: AccordionHeaderTitle;
-  description?: AccordionHeaderDescription;
-  left_component?: AccordionHeaderLeftComponent;
-  element?: AccordionHeaderElement;
-  heading?: AccordionHeaderHeading;
-  heading_level?: HeadingLevel;
-  icon?: AccordionIcon;
-  icon_position?: ButtonIconPosition;
-  icon_size?: IconSize;
-  disabled?: boolean;
-  skeleton?: SkeletonShow;
-  no_animation?: boolean;
-  className?: string;
-  children?: AccordionHeaderChildren;
-}
-export default class AccordionHeader extends React.Component<
-  AccordionHeaderProps,
-  any
-> {
-  static defaultProps: object;
-  static Container: ({
-    children
-  }: {
-    children: React.ReactNode;
-  }) => JSX.Element;
-  static Title: ({
-    children
-  }: {
-    children: React.ReactNode;
-  }) => JSX.Element;
-  static Description: ({
-    children
-  }: {
-    children: React.ReactNode;
-  }) => JSX.Element;
-  render(): JSX.Element;
-}
+export type AccordionHeaderTitleProps = SpacingProps & {
+    children?: React.ReactNode;
+};
+declare function AccordionHeaderTitle({ children, ...rest }: AccordionHeaderTitleProps): import("react/jsx-runtime").JSX.Element;
+export type AccordionHeaderDescriptionProps = SpacingProps & {
+    children?: React.ReactNode;
+};
+declare function AccordionHeaderDescription({ children, ...rest }: AccordionHeaderDescriptionProps): import("react/jsx-runtime").JSX.Element;
+export type AccordionHeaderContainerProps = SpacingProps & {
+    children?: React.ReactNode;
+};
+declare function AccordionHeaderContainer({ children, ...rest }: AccordionHeaderContainerProps): import("react/jsx-runtime").JSX.Element;
+type AccordionHeaderIconIcon = React.ReactNode | ((...args: any[]) => React.ReactNode) | {
+    closed?: React.ReactNode | ((...args: any[]) => React.ReactNode);
+    expanded?: React.ReactNode | ((...args: any[]) => React.ReactNode);
+};
+export type AccordionHeaderIconProps = {
+    icon?: AccordionHeaderIconIcon;
+    size?: IconSize;
+    expanded?: boolean;
+};
+declare function AccordionHeaderIcon({ icon, expanded, size, }: AccordionHeaderIconProps): import("react/jsx-runtime").JSX.Element;
+export type AccordionHeaderTitle = string | React.ReactNode | ((...args: any[]) => any);
+export type AccordionHeaderDescription = string | React.ReactNode | ((...args: any[]) => any);
+export type AccordionHeaderLeftComponent = string | React.ReactNode | ((...args: any[]) => any);
+export type AccordionHeaderElement = string | React.ReactNode | ((...args: any[]) => any);
+export type AccordionHeaderHeading = boolean | string | React.ReactNode | ((...args: any[]) => any);
+export type AccordionHeaderIcon = React.ReactNode | ((...args: any[]) => any) | {
+    closed?: React.ReactNode | ((...args: any[]) => any);
+    expanded?: React.ReactNode | ((...args: any[]) => any);
+};
+export type AccordionHeaderProps = React.HTMLProps<HTMLElement> & SpacingProps & {
+    title?: AccordionHeaderTitle;
+    expanded?: boolean;
+    description?: AccordionHeaderDescription;
+    left_component?: AccordionHeaderLeftComponent;
+    element?: AccordionHeaderElement;
+    heading?: AccordionHeaderHeading;
+    heading_level?: HeadingLevel;
+    icon?: AccordionIcon;
+    icon_position?: ButtonIconPosition;
+    icon_size?: IconSize;
+    disabled?: boolean;
+    skeleton?: SkeletonShow;
+    no_animation?: boolean;
+    className?: string;
+    children?: string | React.ReactNode | ((...args: any[]) => any);
+};
+export declare const AccordionHeader: {
+    ({ icon_size: icon_size_default, ...restOfProps }: AccordionHeaderProps): import("react/jsx-runtime").JSX.Element;
+    Container: typeof AccordionHeaderContainer;
+    Icon: typeof AccordionHeaderIcon;
+    Title: typeof AccordionHeaderTitle;
+    Description: typeof AccordionHeaderDescription;
+};
+export default AccordionHeader;

package/components/accordion/AccordionHeader.js

@@ -1,311 +1,235 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 const _excluded = ["children"],
   _excluded2 = ["children"],
   _excluded3 = ["children"],
-  _excluded4 = ["icon", "expanded"],
+  _excluded4 = ["icon_size"],
   _excluded5 = ["children", "className", "left_component", "expanded", "title", "description", "icon", "icon_size", "disabled"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-import React from 'react';
-import PropTypes from 'prop-types';
-import { isTrue, validateDOMAttributes, extendPropsWithContextInClassComponent } from '../../shared/component-helper';
-import IconPrimary from '../../components/icon-primary/IconPrimary';
+import React, { useContext, useState } from 'react';
+import { validateDOMAttributes, extendPropsWithContext } from '../../shared/component-helper';
+import IconPrimary from '../icon-primary/IconPrimary';
 import classnames from 'classnames';
-import keycode from 'keycode';
 import AccordionContext from './AccordionContext';
-import { spacingPropTypes, createSpacingClasses } from '../space/SpacingHelper';
+import { createSpacingClasses } from '../space/SpacingHelper';
 import { skeletonDOMAttributes, createSkeletonClass } from '../skeleton/SkeletonHelper';
 function AccordionHeaderTitle(_ref) {
   let {
-      children
+      children = null
     } = _ref,
     rest = _objectWithoutProperties(_ref, _excluded);
   return React.createElement("span", {
     className: classnames('dnb-accordion__header__title', createSpacingClasses(rest))
   }, children);
 }
-process.env.NODE_ENV !== "production" ? AccordionHeaderTitle.propTypes = _objectSpread(_objectSpread({}, spacingPropTypes), {}, {
-  children: PropTypes.node
-}) : void 0;
-AccordionHeaderTitle.defaultProps = {
-  children: null
-};
 function AccordionHeaderDescription(_ref2) {
   let {
-      children
+      children = null
     } = _ref2,
     rest = _objectWithoutProperties(_ref2, _excluded2);
   return children ? React.createElement("span", {
     className: classnames('dnb-accordion__header__description', createSpacingClasses(rest))
   }, children) : null;
 }
-process.env.NODE_ENV !== "production" ? AccordionHeaderDescription.propTypes = _objectSpread(_objectSpread({}, spacingPropTypes), {}, {
-  children: PropTypes.node
-}) : void 0;
-AccordionHeaderDescription.defaultProps = {
-  children: null
-};
 function AccordionHeaderContainer(_ref3) {
   let {
-      children
+      children = null
     } = _ref3,
     rest = _objectWithoutProperties(_ref3, _excluded3);
   return children ? React.createElement("span", {
     className: classnames('dnb-accordion__header__container', createSpacingClasses(rest))
   }, children) : null;
 }
-process.env.NODE_ENV !== "production" ? AccordionHeaderContainer.propTypes = _objectSpread(_objectSpread({}, spacingPropTypes), {}, {
-  children: PropTypes.node
-}) : void 0;
-AccordionHeaderContainer.defaultProps = {
-  children: null
-};
 function AccordionHeaderIcon(_ref4) {
   let {
-      icon,
-      expanded
-    } = _ref4,
-    rest = _objectWithoutProperties(_ref4, _excluded4);
+    icon,
+    expanded,
+    size = 'medium'
+  } = _ref4;
   return React.createElement("span", {
     className: "dnb-accordion__header__icon"
-  }, React.createElement(IconPrimary, _extends({}, rest, {
-    icon: typeof (icon === null || icon === void 0 ? void 0 : icon.expanded) !== 'undefined' ? icon[expanded ? 'expanded' : 'closed'] : icon || 'chevron-down',
+  }, React.createElement(IconPrimary, {
+    size: size,
+    icon: icon && typeof icon === 'object' && 'expanded' in icon && typeof (icon === null || icon === void 0 ? void 0 : icon.expanded) !== 'undefined' ? icon[expanded ? 'expanded' : 'closed'] : icon || 'chevron-down',
     "aria-hidden": true
-  })));
+  }));
 }
-process.env.NODE_ENV !== "production" ? AccordionHeaderIcon.propTypes = {
-  icon: PropTypes.oneOfType([PropTypes.node, PropTypes.func, PropTypes.shape({
-    closed: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
-    expanded: PropTypes.oneOfType([PropTypes.node, PropTypes.func])
-  })]),
-  size: PropTypes.string,
-  expanded: PropTypes.bool
-} : void 0;
-AccordionHeaderIcon.defaultProps = {
-  icon: null,
-  size: 'medium',
-  expanded: null
+const accordionHeaderDefaultProps = {
+  icon_size: 'medium'
 };
-export default class AccordionHeader extends React.PureComponent {
-  constructor(props) {
-    super(props);
-    _defineProperty(this, "onKeyDownHandler", event => {
-      switch (keycode(event)) {
-        case 'enter':
-        case 'space':
-          event.preventDefault();
-          this.onClickHandler(event);
-          break;
-      }
-    });
-    _defineProperty(this, "onClickHandler", event => {
-      const {
+export const AccordionHeader = _ref5 => {
+  let {
+      icon_size: icon_size_default = 'medium'
+    } = _ref5,
+    restOfProps = _objectWithoutProperties(_ref5, _excluded4);
+  const props = _objectSpread({
+    icon_size: icon_size_default
+  }, restOfProps);
+  const [isHoverring, setIsHovering] = useState(false);
+  const [hasClicked, setHasClicked] = useState(false);
+  const context = useContext(AccordionContext);
+  function onKeyDownHandler(event) {
+    const keyPressed = event.key;
+    if (keyPressed === 'Enter' || keyPressed === ' ') {
+      event.preventDefault();
+      onClickHandler(event);
+    }
+  }
+  function onClickHandler(event) {
+    const {
+      id,
+      group
+    } = context;
+    if (canClick()) {
+      const expanded = !context.expanded;
+      context.callOnChange({
         id,
-        group
-      } = this.context;
-      if (this.canClick()) {
-        const expanded = !this.context.expanded;
-        this.context.callOnChange({
-          id,
-          group,
-          expanded,
-          event
-        });
-        this.setState({
-          hadClick: true
-        });
-      }
-    });
-    _defineProperty(this, "onMouseOverHandler", () => {
-      this.setState({
-        hover: true
-      });
-    });
-    _defineProperty(this, "onMouseOutHandler", () => {
-      this.setState({
-        hover: false,
-        hadClick: false
+        group,
+        expanded,
+        event
       });
-    });
-    this.state = {};
+      setHasClicked(true);
+    }
+  }
+  function onMouseOverHandler() {
+    setIsHovering(true);
+  }
+  function onMouseOutHandler() {
+    setIsHovering(false);
+    setHasClicked(false);
   }
-  canClick() {
+  function canClick() {
     const {
       expanded,
       allow_close_all,
       group
-    } = this.context;
-    return !group || group && !expanded || isTrue(allow_close_all);
+    } = context;
+    return !group || group && !expanded || allow_close_all;
   }
-  render() {
-    const props = extendPropsWithContextInClassComponent(this.props, AccordionHeader.defaultProps, this.context);
-    const {
-      id,
-      left_component,
-      expanded,
-      title,
-      description,
-      element,
-      heading,
-      heading_level,
-      icon,
-      icon_size,
-      disabled,
-      skeleton,
-      no_animation
-    } = props;
-    const _this$props = this.props,
-      {
-        children,
-        className,
-        left_component: _left_component,
-        expanded: _expanded,
-        title: _title,
-        description: _description,
-        icon: _icon,
-        icon_size: _icon_size,
-        disabled: _disabled
-      } = _this$props,
-      rest = _objectWithoutProperties(_this$props, _excluded5);
-    const {
-      hover,
-      hadClick
-    } = this.state;
-    let {
-      icon_position
-    } = props;
-    const defaultParts = [React.createElement(AccordionHeaderIcon, {
-      key: "icon",
-      icon: icon,
-      size: icon_size,
-      expanded: this.context.expanded
-    }), React.createElement(AccordionHeaderContainer, {
-      key: "container"
-    }, left_component), React.createElement(AccordionHeaderTitle, {
-      key: "title"
-    }, title || (Array.isArray(children) ? children.filter(cur => !React.isValidElement(cur)) : children)), React.createElement(AccordionHeaderDescription, {
-      key: "description"
-    }, description)];
-    if (Array.isArray(children)) {
-      const removeParts = [];
-      children.forEach(cur => {
-        if (React.isValidElement(cur)) {
-          const part = defaultParts.find(c => c.type === cur.type);
-          if (part) {
-            removeParts.push(part);
-          }
-          defaultParts.push(cur);
-        }
-      });
-      removeParts.forEach(part => {
-        const index = defaultParts.findIndex(c => c === part);
-        if (index > -1) {
-          defaultParts.splice(index, 1);
-        }
-      });
-    }
-    const partsToRender = [];
-    const wrapperParts = [];
-    const wrapperComp = React.createElement("span", {
-      className: "dnb-accordion__header__wrapper",
-      key: "wrapper"
-    }, wrapperParts);
-    defaultParts.forEach(part => {
-      if (React.isValidElement(part) && (part.type === AccordionHeaderTitle || part.type === AccordionHeaderDescription)) {
-        wrapperParts.push(part);
-        if (partsToRender.findIndex(c => c === wrapperComp) === -1) {
-          partsToRender.push(wrapperComp);
+  const extendedProps = extendPropsWithContext(props, accordionHeaderDefaultProps, context);
+  const {
+    id,
+    left_component,
+    expanded,
+    title,
+    description,
+    element,
+    heading,
+    heading_level,
+    icon,
+    icon_size,
+    disabled,
+    skeleton,
+    no_animation
+  } = extendedProps;
+  let {
+    icon_position
+  } = extendedProps;
+  const {
+      children,
+      className,
+      left_component: _left_component,
+      expanded: _expanded,
+      title: _title,
+      description: _description,
+      icon: _icon,
+      icon_size: _icon_size,
+      disabled: _disabled
+    } = props,
+    rest = _objectWithoutProperties(props, _excluded5);
+  const defaultParts = [React.createElement(AccordionHeaderIcon, {
+    key: "icon",
+    icon: icon,
+    size: icon_size,
+    expanded: context.expanded
+  }), React.createElement(AccordionHeaderContainer, {
+    key: "container"
+  }, left_component), React.createElement(AccordionHeaderTitle, {
+    key: "title"
+  }, title || (Array.isArray(children) ? children.filter(cur => !React.isValidElement(cur)) : children)), React.createElement(AccordionHeaderDescription, {
+    key: "description"
+  }, description)];
+  if (Array.isArray(children)) {
+    const removeParts = [];
+    children.forEach(cur => {
+      if (React.isValidElement(cur)) {
+        const part = defaultParts.find(c => c.type === cur.type);
+        if (part) {
+          removeParts.push(part);
         }
-      } else {
-        partsToRender.push(part);
+        defaultParts.push(cur);
       }
     });
-    if (icon_position === null) {
-      const iconIndex = partsToRender.findIndex(c => c.type === AccordionHeaderIcon);
-      if (iconIndex > 1) {
-        icon_position = 'right';
+    removeParts.forEach(part => {
+      const index = defaultParts.findIndex(c => c === part);
+      if (index > -1) {
+        defaultParts.splice(index, 1);
       }
-      if (left_component) {
-        icon_position = 'right';
+    });
+  }
+  const partsToRender = [];
+  const wrapperParts = [];
+  const wrapperComp = React.createElement("span", {
+    className: "dnb-accordion__header__wrapper",
+    key: "wrapper"
+  }, wrapperParts);
+  defaultParts.forEach(part => {
+    if (React.isValidElement(part) && (part.type === AccordionHeaderTitle || part.type === AccordionHeaderDescription)) {
+      wrapperParts.push(part);
+      if (partsToRender.findIndex(c => c === wrapperComp) === -1) {
+        partsToRender.push(wrapperComp);
       }
-    }
-    const headerParams = _objectSpread({
-      id: `${id}-header`,
-      'aria-controls': `${id}-content`,
-      'aria-expanded': this.context.expanded,
-      role: 'button',
-      tabIndex: '0',
-      className: classnames('dnb-accordion__header', createSkeletonClass('font', skeleton, this.context), createSpacingClasses(rest), className, icon_position && `dnb-accordion__header__icon--${icon_position}`, hover && hadClick && 'dnb-accordion--hover', !this.canClick() && 'dnb-accordion__header--prevent-click', description && 'dnb-accordion__header--description', no_animation && 'dnb-accordion__header--no-animation'),
-      disabled
-    }, rest);
-    if (disabled || isTrue(skeleton)) {
-      headerParams.tabIndex = '-1';
-      headerParams.disabled = true;
-      headerParams['aria-disabled'] = true;
     } else {
-      headerParams.onClick = this.onClickHandler;
-      headerParams.onKeyDown = this.onKeyDownHandler;
-      headerParams.onMouseOver = this.onMouseOverHandler;
-      headerParams.onMouseOut = this.onMouseOutHandler;
+      partsToRender.push(part);
+    }
+  });
+  if (icon_position === undefined) {
+    const iconIndex = partsToRender.findIndex(c => c.type === AccordionHeaderIcon);
+    if (iconIndex > 1) {
+      icon_position = 'right';
     }
-    skeletonDOMAttributes(headerParams, skeleton, this.context);
-    validateDOMAttributes(this.props, headerParams);
-    let Element = 'div';
-    if (isTrue(heading)) {
-      headerParams.role = 'heading';
-      headerParams['aria-level'] = heading_level ? String(heading_level) : '2';
-    } else if (heading) {
-      headerParams.role = null;
-      Element = heading;
-    } else if (element) {
-      headerParams.role = null;
-      Element = element;
+    if (left_component) {
+      icon_position = 'right';
     }
-    return React.createElement(Element, headerParams, partsToRender);
   }
-}
-_defineProperty(AccordionHeader, "contextType", AccordionContext);
-_defineProperty(AccordionHeader, "defaultProps", {
-  id: null,
-  title: null,
-  description: null,
-  left_component: null,
-  element: null,
-  heading: null,
-  heading_level: null,
-  icon: null,
-  icon_position: null,
-  icon_size: 'medium',
-  disabled: null,
-  skeleton: null,
-  no_animation: null,
-  className: null,
-  children: null
-});
-_defineProperty(AccordionHeader, "Container", AccordionHeaderContainer);
-_defineProperty(AccordionHeader, "Icon", AccordionHeaderIcon);
-_defineProperty(AccordionHeader, "Title", AccordionHeaderTitle);
-_defineProperty(AccordionHeader, "Description", AccordionHeaderDescription);
-process.env.NODE_ENV !== "production" ? AccordionHeader.propTypes = _objectSpread(_objectSpread({
-  title: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.func]),
-  description: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.func]),
-  left_component: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.func]),
-  element: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.func]),
-  heading: PropTypes.oneOfType([PropTypes.bool, PropTypes.string, PropTypes.node, PropTypes.func]),
-  heading_level: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  icon: PropTypes.oneOfType([PropTypes.node, PropTypes.func, PropTypes.shape({
-    closed: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
-    expanded: PropTypes.oneOfType([PropTypes.node, PropTypes.func])
-  })]),
-  icon_position: PropTypes.oneOf(['left', 'right']),
-  icon_size: PropTypes.string,
-  disabled: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
-  skeleton: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
-  no_animation: PropTypes.oneOfType([PropTypes.string, PropTypes.bool])
-}, spacingPropTypes), {}, {
-  className: PropTypes.string,
-  children: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.func])
-}) : void 0;
+  const headerParams = _objectSpread({
+    id: `${id}-header`,
+    'aria-controls': `${id}-content`,
+    'aria-expanded': context.expanded,
+    role: 'button',
+    tabIndex: 0,
+    className: classnames('dnb-accordion__header', createSkeletonClass('font', skeleton, context), createSpacingClasses(rest), className, icon_position && `dnb-accordion__header__icon--${icon_position}`, isHoverring && hasClicked && 'dnb-accordion--hover', !canClick() && 'dnb-accordion__header--prevent-click', description && 'dnb-accordion__header--description', no_animation && 'dnb-accordion__header--no-animation'),
+    disabled
+  }, rest);
+  if (disabled || skeleton) {
+    headerParams.tabIndex = -1;
+    headerParams.disabled = true;
+    headerParams['aria-disabled'] = true;
+  } else {
+    headerParams.onClick = onClickHandler;
+    headerParams.onKeyDown = onKeyDownHandler;
+    headerParams.onMouseOver = onMouseOverHandler;
+    headerParams.onMouseOut = onMouseOutHandler;
+  }
+  skeletonDOMAttributes(headerParams, skeleton, context);
+  validateDOMAttributes(props, headerParams);
+  let Element = 'div';
+  if (heading && (String(heading) === 'true' || String(heading) === '1')) {
+    headerParams.role = 'heading';
+    headerParams['aria-level'] = heading_level ? Number(heading_level) : 2;
+  } else if (heading) {
+    headerParams.role = null;
+    Element = heading;
+  } else if (element) {
+    headerParams.role = null;
+    Element = element;
+  }
+  return React.createElement(Element, headerParams, partsToRender);
+};
+AccordionHeader.Container = AccordionHeaderContainer;
+AccordionHeader.Icon = AccordionHeaderIcon;
+AccordionHeader.Title = AccordionHeaderTitle;
+AccordionHeader.Description = AccordionHeaderDescription;
+export default AccordionHeader;
 //# sourceMappingURL=AccordionHeader.js.map