wix-style-react/dist/src/SidebarItemNext/SidebarItemButtonNext.js

wix-style-react

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _react = _interopRequireWildcard(require("react"));
var _SidebarNextContext = require("../SidebarNext/SidebarNextContext");
var _useFocusRing = require("../providers/useFocusRing/useFocusRing");
var _constants = require("./constants");
var _SidebarItemNextSt = require("./SidebarItemNext.st.css");
var _Transition = _interopRequireDefault(require("../Transition"));
var _Text = _interopRequireDefault(require("../Text"));
var _excluded = ["as", "role", "href", "dataHook", "children", "disabled", "onClick", "className", "itemKey", "suffix", "prefix", "isInQuickNavigation"];
var _jsxFileName = "/home/builduser/work/a9c1ac8876d5057c/packages/wix-style-react/dist/cjs/SidebarItemNext/SidebarItemButtonNext.tsx";
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
// FIXME: this will produce invalid intersections (e.g. `prefix` already is HTML attribute but HTML attributes cannot be `ReactNode`)

var SidebarItemButtonNext = /*#__PURE__*/(0, _react.memo)(props => {
  var context = (0, _react.useContext)(_SidebarNextContext.SidebarNextContext);
  var {
    skin,
    level,
    selectedPath,
    inert,
    parent,
    closeQuickNav,
    legacy,
    minimized
  } = context;
  var {
      as = 'button',
      role = as === 'a' ? 'link' : 'button',
      // FIXME: check original code, this is weird
      // @ts-ignore
      href,
      // FIXME: from intersection
      dataHook,
      children,
      disabled,
      onClick,
      className,
      itemKey,
      suffix,
      prefix,
      isInQuickNavigation
    } = props,
    asComponentProps = (0, _objectWithoutProperties2.default)(props, _excluded);
  var {
    isFocusVisible,
    focusProps
  } = (0, _useFocusRing.useFocusRing)();
  var Component = as;
  var selected = !!(selectedPath != null && selectedPath.length) && selectedPath[selectedPath.length - 1] === itemKey;
  var inSelection = itemKey !== undefined && !!(selectedPath != null && selectedPath.includes(itemKey));
  var htmlHref = disabled ? undefined : href;
  var tabIndex = inert ? -1 : 0;
  var textSize = level === 1 ? 'small' : 'tiny';
  var inContextMenu = parent === 'inContextMenu';
  var buttonClassName = (0, _SidebarItemNextSt.st)(_SidebarItemNextSt.classes.root, {
    selected: selected || inSelection,
    disabled,
    skin,
    inContextMenu,
    hasPrefix: !!prefix,
    level,
    legacy,
    isFocusVisible
  }, className);
  var handleClick = event => {
    if (!disabled) {
      closeQuickNav == null || closeQuickNav();
      // @ts-ignore
      onClick == null || onClick(event, itemKey); // FIXME: itemKey was not typed in props
    }
  };
  return (
    /*#__PURE__*/
    // @ts-ignore
    _react.default.createElement(Component, (0, _extends2.default)({}, focusProps, {
      className: buttonClassName,
      "data-hook": dataHook,
      type: "button",
      role: role,
      href: htmlHref,
      disabled: href ? false : disabled,
      tabIndex: tabIndex,
      onClick: handleClick,
      "aria-current": selected ? 'page' : undefined // FIXME: no longer correct
      ,
      "data-selected": selected,
      "data-disabled": disabled,
      "data-text-size": textSize,
      "data-skin": skin
    }, asComponentProps, {
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 119,
        columnNumber: 5
      }
    }), level === 3 && !inContextMenu && /*#__PURE__*/_react.default.createElement("hr", {
      className: _SidebarItemNextSt.classes.divider,
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 136,
        columnNumber: 41
      }
    }), prefix && /*#__PURE__*/_react.default.createElement("span", {
      className: _SidebarItemNextSt.classes.prefix,
      "data-hook": _constants.dataHooks.prefix,
      "aria-hidden": true,
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 138,
        columnNumber: 9
      }
    }, prefix), /*#__PURE__*/_react.default.createElement(_Transition.default, {
      className: _SidebarItemNextSt.classes.textWrapper,
      show: !minimized,
      exitAnimation: {
        fadeOut: {
          duration: 'fast01',
          easing: 'exitEasing'
        }
      },
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 146,
        columnNumber: 7
      }
    }, /*#__PURE__*/_react.default.createElement(_Text.default, {
      dataHook: _constants.dataHooks.title,
      className: _SidebarItemNextSt.classes.text,
      size: textSize,
      weight: "normal",
      secondary: skin === _constants.skins.light,
      light: skin === _constants.skins.dark,
      skin: disabled ? 'disabled' : 'standard',
      showTooltip: false,
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 156,
        columnNumber: 9
      }
    }, children)), !disabled && suffix && !minimized && /*#__PURE__*/_react.default.createElement("div", {
      className: _SidebarItemNextSt.classes.suffixContainer,
      "aria-hidden": true,
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 170,
        columnNumber: 9
      }
    }, Array.isArray(suffix) ? suffix.slice(0, 2).map(renderSuffix) : renderSuffix(suffix, 0)))
  );
});
var renderSuffix = (suffix, index) => /*#__PURE__*/_react.default.createElement("span", {
  key: "".concat(_constants.dataHooks.suffix, "-").concat(index),
  "data-hook": _constants.dataHooks.suffix,
  className: _SidebarItemNextSt.classes.suffix,
  __self: void 0,
  __source: {
    fileName: _jsxFileName,
    lineNumber: 181,
    columnNumber: 3
  }
}, suffix);
SidebarItemButtonNext.displayName = 'SidebarItemButtonNext';
var _default = exports.default = SidebarItemButtonNext;
//# sourceMappingURL=SidebarItemButtonNext.js.map