@dnb/eufemia/cjs/components/table/TableClickableHead.js

DNB Eufemia Design System UI Library

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.TableClickableButtonTd = TableClickableButtonTd;
exports.TableClickableHead = TableClickableHead;
exports.TableIconSrTh = TableIconSrTh;
exports.isTableHead = void 0;
exports.onClickTr = onClickTr;
var _react = _interopRequireDefault(require("react"));
var _clsx = _interopRequireDefault(require("clsx"));
var _useId = _interopRequireDefault(require("../../shared/helpers/useId.js"));
var _helpers = require("../../shared/helpers.js");
var _Button = _interopRequireDefault(require("../button/Button.js"));
var _IconPrimary = _interopRequireDefault(require("../icon/IconPrimary.js"));
var _TableTh = _interopRequireDefault(require("./TableTh.js"));
var _TableTd = _interopRequireDefault(require("./TableTd.js"));
var _TableContext = require("./TableContext.js");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function TableClickableHead(allProps) {
  const {
    children,
    className,
    disabled,
    expanded,
    onClick,
    onOpen,
    onClose,
    trIsOpen,
    trIsHover,
    trHadClick,
    clickable,
    noAnimation,
    onMouseEnter,
    onMouseLeave,
    onKeyDown,
    ariaLabel,
    style,
    ...props
  } = allProps;
  const tableContext = _react.default.useContext(_TableContext.TableContext);
  const id = (0, _useId.default)();
  const trParams = !disabled && clickable ? {
    onClick: onClick,
    onMouseEnter: onMouseEnter,
    onMouseLeave: onMouseLeave,
    onKeyDown: onKeydownHandler
  } : {};
  return (0, _jsxRuntime.jsx)("tr", {
    tabIndex: clickable && !disabled ? 0 : undefined,
    className: (0, _clsx.default)(className, clickable && 'dnb-table__tr--clickable', trIsOpen && 'dnb-table__tr--expanded', disabled && 'dnb-table__tr--disabled', noAnimation && 'dnb-table__tr--no-animation', trIsHover && trHadClick && 'dnb-table__tr--hover'),
    style: {
      ...style,
      viewTransitionName: tableContext.hasAccordionRows ? `row-${id}` : undefined
    },
    ...trParams,
    ...props,
    children: children
  });
  function onKeydownHandler(event) {
    switch (event.key) {
      case ' ':
      case 'Enter':
        {
          const target = event.target;
          if (document.activeElement !== target || target.tagName === 'TR') {
            onKeyDown(event);
            event.preventDefault();
          }
        }
        break;
    }
  }
}
function onClickTr(event, allowInteractiveElement = false, onClick) {
  const target = event.target;
  if ((document.activeElement !== target && target.tagName !== 'INPUT' && target.tagName !== 'LABEL' || allowInteractiveElement) && !((0, _helpers.hasSelectedText)() && event.type === 'click')) {
    onClick === null || onClick === void 0 || onClick(event);
  }
}
function TableClickableButtonTd(props) {
  var _React$useContext;
  const {
    trIsOpen,
    ariaLabel,
    icon,
    onClick
  } = props;
  const tableContextAllProps = (_React$useContext = _react.default.useContext(_TableContext.TableContext)) === null || _React$useContext === void 0 ? void 0 : _React$useContext.allProps;
  const iconSize = (tableContextAllProps === null || tableContextAllProps === void 0 ? void 0 : tableContextAllProps.size) === 'medium' || (tableContextAllProps === null || tableContextAllProps === void 0 ? void 0 : tableContextAllProps.size) === 'small' ? 'basis' : 'medium';
  return (0, _jsxRuntime.jsx)(_TableTd.default, {
    className: "dnb-table__td__button-icon",
    onClick: () => {
      (0, _helpers.emptySelectedText)();
    },
    children: (0, _jsxRuntime.jsxs)("span", {
      className: "dnb-table__button",
      children: [(0, _jsxRuntime.jsx)(_IconPrimary.default, {
        icon: icon,
        size: iconSize
      }), (0, _jsxRuntime.jsx)(_Button.default, {
        className: "dnb-sr-only",
        tabIndex: -1,
        "aria-label": ariaLabel,
        "aria-expanded": Boolean(trIsOpen),
        ...(trIsOpen != null ? {
          'aria-expanded': Boolean(trIsOpen)
        } : {}),
        onClick: event => onClick(event, true)
      })]
    })
  });
}
function TableIconSrTh(props) {
  const {
    text
  } = props;
  return (0, _jsxRuntime.jsx)(_TableTh.default, {
    "aria-hidden": true,
    className: "dnb-table__th__button-icon",
    children: (0, _jsxRuntime.jsx)("div", {
      children: text
    })
  });
}
const isTableHead = children => children.some(element => element.type === _TableTh.default);
exports.isTableHead = isTableHead;
//# sourceMappingURL=TableClickableHead.js.map