@robotical/sensors-dashboard/dist/components/AddonsList/index.js

A dashboard tool for depicting Marty data by Robotical

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = AddonsList;
require("core-js/modules/web.dom-collections.iterator.js");
require("core-js/modules/es.regexp.exec.js");
require("core-js/modules/es.string.replace.js");
require("core-js/modules/es.array.reduce.js");
require("core-js/modules/esnext.iterator.constructor.js");
require("core-js/modules/esnext.iterator.reduce.js");
require("core-js/modules/esnext.iterator.map.js");
var _List = _interopRequireDefault(require("@mui/material/List"));
var _react = require("react");
var _fa = require("react-icons/fa");
var _AddonItem = _interopRequireDefault(require("./AddonItem"));
var _stylesModule = _interopRequireDefault(require("./styles.module.css"));
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function AddonsList(_ref) {
  let {
    addons
  } = _ref;
  const parentRef = (0, _react.useRef)(null);
  const [isExpanded, setIsExpanded] = (0, _react.useState)(true);
  const reactId = (0, _react.useId)();
  const listId = "available-signals-".concat(reactId.replace(/:/g, ""));
  const selectedCount = addons.reduce((count, addon) => count + addon.addonInputs.reduce((addonCount, input) => addonCount + (input.selected ? 1 : 0), 0), 0);
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
    className: _stylesModule.default.container,
    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
      type: "button",
      className: _stylesModule.default.disclosureButton,
      onClick: () => setIsExpanded(value => !value),
      "aria-expanded": isExpanded,
      "aria-controls": listId,
      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
        className: _stylesModule.default.disclosureCopy,
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("strong", {
          children: "Available signals"
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("small", {
          "aria-live": "polite",
          children: selectedCount === 0 ? "None selected" : "".concat(selectedCount, " selected")
        })]
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_fa.FaChevronDown, {
        className: [_stylesModule.default.disclosureIcon, isExpanded ? _stylesModule.default.disclosureIconOpen : ""].join(" "),
        "aria-hidden": "true"
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
      className: _stylesModule.default.listRegion,
      id: listId,
      ref: parentRef,
      hidden: !isExpanded,
      children: addons.length > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_List.default, {
        dense: true,
        className: _stylesModule.default.list,
        component: "nav",
        "aria-label": "Available sensor signals",
        children: addons.map((addon, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_AddonItem.default, {
          addon: addon,
          parentRef: parentRef
        }, "".concat(addon.whoAmI, "-").concat(index)))
      }) : /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
        className: _stylesModule.default.emptyMessage,
        role: "status",
        children: "No signals are available yet."
      })
    })]
  });
}