@findify/react-components/lib/components/CategoryFacet/Item.js

Findify react UI components

/**
 * @module components/CategoryFacet
 */
import MapArray from "../common/MapArray";
import content from "./content";
import Button from "../Button";
import Text from "../Text";
import Icon from "../Icon";
var styles = {
  "root": "findify-components--category-facet",
  "nested": "findify-components--category-facet__nested",
  "content": "findify-components--category-facet__content",
  "item": "findify-components--category-facet__item",
  "mobile": "findify-components--category-facet__mobile",
  "active": "findify-components--category-facet__active",
  "expand": "findify-components--category-facet__expand"
};
import cx from 'classnames';
/** This is a list of props that each individual child of CategoryFacet View accepts */

import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
import { Fragment as _Fragment } from "react/jsx-runtime";

var Item = function Item(_ref) {
  var item = _ref.item,
      _ref$theme = _ref.theme,
      theme = _ref$theme === void 0 ? styles : _ref$theme,
      style = _ref.style,
      config = _ref.config,
      isMobile = _ref.isMobile;
  return /*#__PURE__*/_jsxs(_Fragment, {
    children: [/*#__PURE__*/_jsxs(Button, {
      style: style,
      className: cx(theme.item, isMobile && theme.mobile),
      onClick: item.toggle,
      role: "checkbox",
      "area-checked": item.get('selected') ? 'true' : 'false',
      children: [/*#__PURE__*/_jsxs(Text, {
        className: theme.content,
        primary: true,
        lowercase: true,
        bold: item.get('selected'),
        children: [content({
          item: item
        }), item.get('has_children') ? /*#__PURE__*/_jsx(Icon, {
          name: item.get('selected') ? 'ArrowDown' : 'ArrowRight',
          title: item.get('selected') ? 'Extended' : 'Collapsed'
        }) : null]
      }), /*#__PURE__*/_jsxs(Text, {
        secondary: true,
        uppercase: true,
        children: ["(", item.get('count'), ")"]
      })]
    }), item.get('children') ? /*#__PURE__*/_jsx("div", {
      className: theme.nested,
      children: /*#__PURE__*/_jsx(MapArray, {
        config: config,
        array: item.get('children'),
        factory: Item,
        theme: theme,
        isMobile: isMobile
      })
    }) : null]
  });
};

export default Item;