'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var _extends = require('@babel/runtime/helpers/extends');
var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
require('core-js/modules/es.array.concat.js');
require('core-js/modules/es.array.iterator.js');
require('core-js/modules/es.array.map.js');
require('core-js/modules/es.object.to-string.js');
require('core-js/modules/es.regexp.exec.js');
require('core-js/modules/es.string.search.js');
require('core-js/modules/web.dom-collections.iterator.js');
var React = require('react');
var PropTypes = require('prop-types');
var react = require('@carbon/react');
var classnames = require('classnames');
var SimplePagination = require('../SimplePagination/SimplePagination.js');
var Settings = require('../../constants/Settings.js');
var deprecate = require('../../internal/deprecate.js');
var TileGroup = require('./TileGroup.js');
var iconsReact = require('@carbon/icons-react');

function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

var _extends__default = /*#__PURE__*/_interopDefault(_extends);
var _toConsumableArray__default = /*#__PURE__*/_interopDefault(_toConsumableArray);
var React__default = /*#__PURE__*/_interopDefault(React);
var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
var classnames__default = /*#__PURE__*/_interopDefault(classnames);

var iotPrefix = Settings.settings.iotPrefix;
var propTypes = {
  /** Is the data actively loading? */
  isLoading: PropTypes__default.default.bool,
  /** error loading the tile catalog */
  error: PropTypes__default.default.string,
  pagination: PropTypes__default.default.shape({
    pageSize: PropTypes__default.default.number,
    pageText: PropTypes__default.default.string,
    /** Gets called back with arguments (page, maxPage) */
    pageOfPagesText: PropTypes__default.default.func,
    nextPageText: PropTypes__default.default.string,
    prevPageText: PropTypes__default.default.string,
    onPage: PropTypes__default.default.func,
    /** current page number */
    page: PropTypes__default.default.number,
    totalItems: PropTypes__default.default.number
  }),
  /** We will callback with the search value */
  search: PropTypes__default.default.shape({
    placeHolderText: deprecate(PropTypes__default.default.string, '\n The prop `placeHolderText` has been deprecated in favor `placeholder`'),
    placeholder: PropTypes__default.default.string,
    noMatchesFoundText: PropTypes__default.default.string,
    /** current search value */
    value: PropTypes__default.default.string,
    onSearch: PropTypes__default.default.func
  }),
  /** form id */
  id: PropTypes__default.default.string.isRequired,
  /** title displayed above the catalog */
  title: PropTypes__default.default.node,
  /** tiles describes what to render */
  tiles: PropTypes__default.default.arrayOf(PropTypes__default.default.shape({
    id: PropTypes__default.default.string.isRequired,
    /**  the values field is searched by the search widget */
    values: PropTypes__default.default.oneOfType([PropTypes__default.default.object, PropTypes__default.default.string]).isRequired,
    /** renderContent is called back with the full value object and id to render */
    renderContent: PropTypes__default.default.func,
    className: PropTypes__default.default.string
  })).isRequired,
  /** Callbacks */
  onSelection: PropTypes__default.default.func.isRequired,
  /** currently selected tile id */
  selectedTileId: PropTypes__default.default.string,
  testId: PropTypes__default.default.string
};
var defaultProps = {
  isLoading: false,
  title: null,
  error: null,
  pagination: null,
  search: null,
  selectedTileId: null,
  testId: 'tile-catalog'
};

/**
 * Renders a searchable and pageable catalog of RadioTiles from carbon. Couldn't reuse the TileGroup component from Carbon due to this limitation.
 * https://github.com/IBM/carbon-components-react/issues/1999
 *
 */
var TileCatalog = function TileCatalog(_ref) {
  var _search$placeHolderTe, _search$placeHolderTe2;
  var id = _ref.id,
    className = _ref.className,
    isLoading = _ref.isLoading,
    error = _ref.error,
    search = _ref.search,
    pagination = _ref.pagination,
    tiles = _ref.tiles,
    onSelection = _ref.onSelection,
    selectedTileId = _ref.selectedTileId,
    testId = _ref.testId;
  var searchState = search ? search.value : '';
  var handleSearch = search && search.onSearch;
  var pageSize = pagination && pagination.pageSize ? pagination.pageSize : 10;
  var totalTiles = pagination && pagination.totalItems ? pagination.totalItems : 10;
  return /*#__PURE__*/React__default.default.createElement("div", {
    "data-testid": testId,
    className: classnames__default.default(className, "".concat(iotPrefix, "--tile-catalog"))
  }, /*#__PURE__*/React__default.default.createElement("div", {
    "data-testid": "".concat(testId, "-header"),
    className: "".concat(iotPrefix, "--tile-catalog--header")
  }, search && (search.placeHolderText || search.placeholder) ? /*#__PURE__*/React__default.default.createElement(react.TableToolbarSearch, {
    size: "lg",
    value: searchState,
    labelText: (_search$placeHolderTe = search.placeHolderText) !== null && _search$placeHolderTe !== void 0 ? _search$placeHolderTe : search.placeholder,
    placeholder: (_search$placeHolderTe2 = search.placeHolderText) !== null && _search$placeHolderTe2 !== void 0 ? _search$placeHolderTe2 : search.placeholder,
    onChange: handleSearch,
    id: "".concat(id, "-searchbox"),
    "data-testid": "".concat(testId, "-search-input")
  }) : null), isLoading ?
  /*#__PURE__*/
  // generate empty tiles for first page
  React__default.default.createElement(TileGroup, {
    testId: "".concat(testId, "-loading-group"),
    tiles: _toConsumableArray__default.default(Array(pageSize)).map(function (val, index) {
      return /*#__PURE__*/React__default.default.createElement(react.Tile, {
        className: "".concat(iotPrefix, "--tile-catalog--empty-tile"),
        key: "emptytile-".concat(index)
      }, /*#__PURE__*/React__default.default.createElement(react.SkeletonText, null));
    }),
    totalTiles: totalTiles
  }) : tiles.length > 0 ? /*#__PURE__*/React__default.default.createElement(TileGroup, {
    testId: "".concat(testId, "-group"),
    tiles: tiles.map(function (tile) {
      return /*#__PURE__*/React__default.default.createElement(react.RadioTile, {
        className: tile.className,
        key: tile.id,
        id: tile.id,
        value: tile.id,
        name: id,
        checked: selectedTileId === tile.id,
        onChange: onSelection,
        "data-testid": "".concat(testId, "-radio-tile-").concat(tile.id)
      }, tile.renderContent ? tile.renderContent({
        values: tile.values,
        id: tile.id
      }) : tile.value);
    })
  }) : /*#__PURE__*/React__default.default.createElement(react.Tile, {
    "data-testid": "".concat(testId, "-empty"),
    className: "".concat(iotPrefix, "--tile-catalog--empty-tile")
  }, error || /*#__PURE__*/React__default.default.createElement(React.Fragment, null, /*#__PURE__*/React__default.default.createElement(iconsReact.Bee, {
    size: 32
  }), /*#__PURE__*/React__default.default.createElement("p", null, search && search.noMatchesFoundText || 'No matches found'))), !isLoading && tiles.length > 0 && !error && pagination ? /*#__PURE__*/React__default.default.createElement(SimplePagination.default, _extends__default.default({}, pagination, {
    maxPage: Math.ceil(totalTiles / pageSize)
    // TODO: pass testId in v3 to override defaults
    // testId={`${testId}-pagination`}
  })) : null);
};
TileCatalog.propTypes = propTypes;
TileCatalog.defaultProps = defaultProps;
TileCatalog.__docgenInfo = {
  "description": "Renders a searchable and pageable catalog of RadioTiles from carbon. Couldn't reuse the TileGroup component from Carbon due to this limitation.\nhttps://github.com/IBM/carbon-components-react/issues/1999",
  "methods": [],
  "displayName": "TileCatalog",
  "props": {
    "isLoading": {
      "defaultValue": {
        "value": "false",
        "computed": false
      },
      "description": "Is the data actively loading?",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "title": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "title displayed above the catalog",
      "type": {
        "name": "node"
      },
      "required": false
    },
    "error": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "error loading the tile catalog",
      "type": {
        "name": "string"
      },
      "required": false
    },
    "pagination": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "shape",
        "value": {
          "pageSize": {
            "name": "number",
            "required": false
          },
          "pageText": {
            "name": "string",
            "required": false
          },
          "pageOfPagesText": {
            "name": "func",
            "description": "Gets called back with arguments (page, maxPage)",
            "required": false
          },
          "nextPageText": {
            "name": "string",
            "required": false
          },
          "prevPageText": {
            "name": "string",
            "required": false
          },
          "onPage": {
            "name": "func",
            "required": false
          },
          "page": {
            "name": "number",
            "description": "current page number",
            "required": false
          },
          "totalItems": {
            "name": "number",
            "required": false
          }
        }
      },
      "required": false
    },
    "search": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "We will callback with the search value",
      "type": {
        "name": "shape",
        "value": {
          "placeHolderText": {
            "name": "custom",
            "raw": "deprecate(\n  PropTypes.string,\n  '\\n The prop `placeHolderText` has been deprecated in favor `placeholder`'\n)",
            "required": false
          },
          "placeholder": {
            "name": "string",
            "required": false
          },
          "noMatchesFoundText": {
            "name": "string",
            "required": false
          },
          "value": {
            "name": "string",
            "description": "current search value",
            "required": false
          },
          "onSearch": {
            "name": "func",
            "required": false
          }
        }
      },
      "required": false
    },
    "selectedTileId": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "currently selected tile id",
      "type": {
        "name": "string"
      },
      "required": false
    },
    "testId": {
      "defaultValue": {
        "value": "'tile-catalog'",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "string"
      },
      "required": false
    },
    "id": {
      "description": "form id",
      "type": {
        "name": "string"
      },
      "required": true
    },
    "tiles": {
      "description": "tiles describes what to render",
      "type": {
        "name": "arrayOf",
        "value": {
          "name": "shape",
          "value": {
            "id": {
              "name": "string",
              "required": true
            },
            "values": {
              "name": "union",
              "value": [{
                "name": "object"
              }, {
                "name": "string"
              }],
              "description": "the values field is searched by the search widget",
              "required": true
            },
            "renderContent": {
              "name": "func",
              "description": "renderContent is called back with the full value object and id to render",
              "required": false
            },
            "className": {
              "name": "string",
              "required": false
            }
          }
        }
      },
      "required": true
    },
    "onSelection": {
      "description": "Callbacks",
      "type": {
        "name": "func"
      },
      "required": true
    }
  }
};
var TileCatalog$1 = TileCatalog;

exports.default = TileCatalog$1;
exports.propTypes = propTypes;
