@kiwicom/orbit-components/lib/ChoiceGroup/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 _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
exports.__esModule = true;
exports.default = void 0;
var React = _interopRequireWildcard(require("react"));
var _clsx = _interopRequireDefault(require("clsx"));
var _Heading = _interopRequireDefault(require("../Heading"));
var _Stack = _interopRequireDefault(require("../Stack"));
var _consts = require("./consts");
var _Feedback = _interopRequireDefault(require("./components/Feedback"));
var _FilterWrapper = _interopRequireDefault(require("./components/FilterWrapper"));
var _useRandomId = _interopRequireDefault(require("../hooks/useRandomId"));
var _useTheme = _interopRequireDefault(require("../hooks/useTheme"));
const getHeadingSize = size => {
  const SIZES = {
    [_consts.LABEL_SIZES.NORMAL]: "title3",
    [_consts.LABEL_SIZES.LARGE]: "title2"
  };
  return SIZES[size];
};
const ItemContainer = ({
  filter,
  itemProps,
  onOnlySelection,
  onlySelectionText
}) => ({
  children
}) => {
  return !filter ? /*#__PURE__*/React.cloneElement(React.Children.only(children), itemProps) : /*#__PURE__*/React.createElement(_FilterWrapper.default, {
    child: React.Children.only(children),
    onOnlySelection: onOnlySelection,
    onlySelectionText: onlySelectionText
  }, /*#__PURE__*/React.cloneElement(React.Children.only(children), itemProps));
};
const ChoiceGroup = /*#__PURE__*/React.forwardRef(({
  dataTest,
  id,
  label,
  labelSize = _consts.LABEL_SIZES.NORMAL,
  labelAs = _consts.LABEL_ELEMENTS.H4,
  error,
  children,
  filter,
  onOnlySelection,
  onlySelectionText,
  onChange
}, ref) => {
  const groupID = (0, _useRandomId.default)();
  const theme = (0, _useTheme.default)();
  const handleChange = ev => {
    if (onChange) {
      onChange(ev);
    }
  };
  const itemProps = {
    onChange: handleChange,
    hasError: Boolean(error)
  };
  return /*#__PURE__*/React.createElement("div", {
    ref: ref,
    "data-test": dataTest,
    role: "group",
    "aria-labelledby": groupID,
    id: id,
    className: (0, _clsx.default)("flex w-full flex-col", "[&_.orbit-choice-group-feedback]:mt-xs [&_.orbit-choice-group-feedback]:relative [&_.orbit-choice-group-feedback]:top-[initial]")
  }, label && /*#__PURE__*/React.createElement(_Heading.default, {
    id: groupID,
    type: getHeadingSize(labelSize),
    as: labelAs,
    spaceAfter: "medium"
  }, label), typeof children === "function" ? children({
    // for now a plain <div> is all we need, but we're reserving this space in the API
    // in case we'll need something more in the future
    Container: "div",
    Item: ItemContainer({
      filter,
      onOnlySelection,
      onlySelectionText,
      itemProps
    }),
    spacing: filter ? "0px" : theme.orbit.spaceXSmall
  }) : /*#__PURE__*/React.createElement(_Stack.default, {
    direction: "column",
    spacing: filter ? "none" : "XSmall"
  }, React.Children.map(children, child => {
    return !filter ?
    /*#__PURE__*/
    // @ts-expect-error TODO
    React.cloneElement(child, itemProps) : /*#__PURE__*/React.createElement(_FilterWrapper.default
    // @ts-expect-error TODO
    , {
      child: child,
      onOnlySelection: onOnlySelection,
      onlySelectionText: onlySelectionText
    }, /*#__PURE__*/React.cloneElement(child, itemProps));
  })), error && /*#__PURE__*/React.createElement(_Feedback.default, null, error));
});
var _default = ChoiceGroup;
exports.default = _default;