@kiwicom/orbit-components/lib/Seat/index.js

Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com's products.

"use strict";
"use client";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
exports.__esModule = true;
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var React = _interopRequireWildcard(require("react"));
var _clsx = _interopRequireDefault(require("clsx"));
var _SeatLegend = _interopRequireDefault(require("./components/SeatLegend"));
exports.SeatLegend = _SeatLegend.default;
var _Stack = _interopRequireDefault(require("../Stack"));
var _Text = _interopRequireDefault(require("../Text"));
var _useRandomId = require("../hooks/useRandomId");
var _SeatNormal = _interopRequireDefault(require("./components/SeatNormal"));
var _SeatSmall = _interopRequireDefault(require("./components/SeatSmall"));
var _SeatCircle = _interopRequireDefault(require("./components/SeatCircle"));
var _consts = require("./consts");
const Seat = ({
  type = _consts.TYPES.DEFAULT,
  selected = false,
  onClick,
  size = _consts.SIZE_OPTIONS.MEDIUM,
  dataTest,
  id,
  price,
  label,
  title,
  description,
  "aria-labelledby": ariaLabelledBy = ""
}) => {
  const randomId = (0, _useRandomId.useRandomIdSeed)();
  const titleId = title ? randomId("title") : "";
  const descrId = description ? randomId("descr") : "";
  const isAvailable = type !== _consts.TYPES.UNAVAILABLE;
  const clickable = isAvailable && onClick !== undefined;
  const commonProps = {
    className: (0, _clsx.default)("orbit-seat font-base group relative", isAvailable && "cursor-pointer", size === _consts.SIZE_OPTIONS.SMALL ? "w-800 h-[36px]" : "size-[46px]"),
    id,
    "data-test": dataTest
  };
  const seatContent = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("svg", {
    viewBox: size === _consts.SIZE_OPTIONS.SMALL ? "0 0 32 36" : "0 0 46 46",
    "aria-labelledby": `${[ariaLabelledBy, titleId, descrId].join(" ").trim()}` || undefined,
    fill: "none",
    role: "img"
  }, title && /*#__PURE__*/React.createElement("title", {
    id: titleId
  }, title), description && /*#__PURE__*/React.createElement("desc", {
    id: descrId
  }, description), size === _consts.SIZE_OPTIONS.SMALL ? /*#__PURE__*/React.createElement(_SeatSmall.default, {
    type: type,
    selected: selected,
    label: label
  }) : /*#__PURE__*/React.createElement(_SeatNormal.default, {
    type: type,
    selected: selected,
    label: label
  })), selected && isAvailable && /*#__PURE__*/React.createElement(_SeatCircle.default, {
    size: size,
    type: type
  }));
  return /*#__PURE__*/React.createElement(_Stack.default, {
    inline: true,
    grow: false,
    spacing: "50",
    direction: "column",
    align: "center"
  }, clickable ? /*#__PURE__*/React.createElement("button", (0, _extends2.default)({}, commonProps, {
    onClick: onClick,
    type: "button",
    "aria-pressed": selected
  }), seatContent) : /*#__PURE__*/React.createElement("div", (0, _extends2.default)({}, commonProps, {
    role: "button",
    "aria-pressed": selected,
    "aria-disabled": "true"
  }), seatContent), price && !(selected && !isAvailable) && /*#__PURE__*/React.createElement(_Text.default, {
    size: "small",
    type: "secondary"
  }, price));
};
var _default = exports.default = Seat;