'use strict';

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

var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
require('core-js/modules/es.symbol.js');
require('core-js/modules/es.array.filter.js');
require('core-js/modules/es.array.map.js');
require('core-js/modules/es.object.get-own-property-descriptor.js');
require('core-js/modules/es.object.get-own-property-descriptors.js');
require('core-js/modules/es.object.keys.js');
require('core-js/modules/es.object.to-string.js');
require('core-js/modules/web.dom-collections.for-each.js');
var React = require('react');
var PropTypes = require('prop-types');
var LayoutConstants = require('../../../constants/LayoutConstants.js');
var editorUtils = require('../../DashboardEditor/editorUtils.js');
var Settings = require('../../../constants/Settings.js');
var CommonCardEditFormFields = require('./CommonCardEditFormFields.js');
var DataSeriesFormContent = require('./CardEditFormItems/DataSeriesFormItems/DataSeriesFormContent.js');
var ImageCardFormContent = require('./CardEditFormItems/ImageCardFormItems/ImageCardFormContent.js');
var TableCardFormContent = require('./CardEditFormItems/TableCardFormItems/TableCardFormContent.js');
var ContentFormItemTitle = require('./CardEditFormItems/ContentFormItemTitle.js');

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

var _slicedToArray__default = /*#__PURE__*/_interopDefault(_slicedToArray);
var _defineProperty__default = /*#__PURE__*/_interopDefault(_defineProperty);
var React__default = /*#__PURE__*/_interopDefault(React);
var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);

function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty__default.default(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var iotPrefix = Settings.settings.iotPrefix;
var propTypes = {
  /** card data value */
  cardConfig: PropTypes__default.default.shape({
    id: PropTypes__default.default.string,
    title: PropTypes__default.default.string,
    size: PropTypes__default.default.string,
    type: PropTypes__default.default.string,
    timeRange: PropTypes__default.default.string,
    renderEditContent: PropTypes__default.default.func,
    content: PropTypes__default.default.oneOfType([PropTypes__default.default.shape({
      series: PropTypes__default.default.arrayOf(PropTypes__default.default.shape({
        label: PropTypes__default.default.string,
        dataSourceId: PropTypes__default.default.string,
        color: PropTypes__default.default.string
      })),
      xLabel: PropTypes__default.default.string,
      yLabel: PropTypes__default.default.string,
      unit: PropTypes__default.default.string,
      includeZeroOnXaxis: PropTypes__default.default.bool,
      includeZeroOnYaxis: PropTypes__default.default.bool,
      timeDataSourceId: PropTypes__default.default.string,
      showLegend: PropTypes__default.default.bool
    }), PropTypes__default.default.shape({
      id: PropTypes__default.default.string,
      src: PropTypes__default.default.string,
      zoomMax: PropTypes__default.default.number
    }),
    // custom card content is a function
    PropTypes__default.default.func]),
    dataSource: PropTypes__default.default.shape({
      attributes: PropTypes__default.default.arrayOf(PropTypes__default.default.shape({
        aggregator: PropTypes__default.default.string,
        attribute: PropTypes__default.default.string,
        id: PropTypes__default.default.string
      }))
    })
  }),
  /** Callback function when form data changes */
  onChange: PropTypes__default.default.func.isRequired,
  i18n: PropTypes__default.default.shape({
    cardTitle: PropTypes__default.default.string,
    description: PropTypes__default.default.string,
    size: PropTypes__default.default.string,
    selectASize: PropTypes__default.default.string,
    timeRange: PropTypes__default.default.string,
    selectATimeRange: PropTypes__default.default.string,
    last24HoursLabel: PropTypes__default.default.string,
    last7DaysLabel: PropTypes__default.default.string,
    lastMonthLabel: PropTypes__default.default.string,
    lastQuarterLabel: PropTypes__default.default.string,
    lastYearLabel: PropTypes__default.default.string,
    thisWeekLabel: PropTypes__default.default.string,
    thisMonthLabel: PropTypes__default.default.string,
    thisQuarterLabel: PropTypes__default.default.string,
    thisYearLabel: PropTypes__default.default.string
  }),
  /** whether to use translated labels in cards */
  shouldUseTranslatedLabels: PropTypes__default.default.bool,
  /** if provided, returns an array of strings which are the timeRanges to be allowed
   * on each card
   * getValidTimeRanges(card, selectedDataItems)
   */
  getValidTimeRanges: PropTypes__default.default.func,
  /** if provided, returns an array of strings which are the dataItems to be allowed
   * on each card
   * getValidDataItems(card, selectedTimeRange)
   */
  getValidDataItems: PropTypes__default.default.func,
  /** an array of dataItems to be included on each card
   * this prop will be ignored if getValidDataItems is defined
   */
  dataItems: editorUtils.DataItemsPropTypes,
  currentBreakpoint: PropTypes__default.default.string,
  /** an object where the keys are available dimensions and the values are the values available for those dimensions
   *  ex: { manufacturer: ['Rentech', 'GHI Industries'], deviceid: ['73000', '73001', '73002'] }
   */
  availableDimensions: PropTypes__default.default.shape({}),
  isSummaryDashboard: PropTypes__default.default.bool,
  /** optional link href's for each card type that will appear in a tooltip */
  dataSeriesItemLinks: PropTypes__default.default.shape({
    simpleBar: PropTypes__default.default.string,
    groupedBar: PropTypes__default.default.string,
    stackedBar: PropTypes__default.default.string,
    timeSeries: PropTypes__default.default.string,
    value: PropTypes__default.default.string,
    custom: PropTypes__default.default.string,
    table: PropTypes__default.default.string,
    image: PropTypes__default.default.string
  }),
  actions: editorUtils.DashboardEditorActionsPropTypes
};
var defaultProps = {
  cardConfig: {},
  i18n: {},
  shouldUseTranslatedLabels: false,
  getValidDataItems: null,
  getValidTimeRanges: null,
  dataItems: [],
  currentBreakpoint: 'xl',
  availableDimensions: {},
  isSummaryDashboard: false,
  dataSeriesItemLinks: null,
  actions: editorUtils.defaultDashboardEditorActionsProps
};
var handleTranslationCallback = function handleTranslationCallback(idToTranslate, mergedI18n) {
  var openMenuText = mergedI18n.openMenuText,
    closeMenuText = mergedI18n.closeMenuText,
    clearAllText = mergedI18n.clearAllText;
  switch (idToTranslate) {
    case 'clear.all':
      return clearAllText || 'Clear all';
    case 'open.menu':
      return openMenuText || 'Open menu';
    case 'close.menu':
      return closeMenuText || 'Close menu';
    default:
      return '';
  }
};
var CardEditFormContent = function CardEditFormContent(_ref) {
  var cardConfig = _ref.cardConfig,
    isSummaryDashboard = _ref.isSummaryDashboard,
    onChange = _ref.onChange,
    i18n = _ref.i18n,
    shouldUseTranslatedLabels = _ref.shouldUseTranslatedLabels,
    dataItems = _ref.dataItems,
    getValidDataItems = _ref.getValidDataItems,
    getValidTimeRanges = _ref.getValidTimeRanges,
    currentBreakpoint = _ref.currentBreakpoint,
    availableDimensions = _ref.availableDimensions,
    dataSeriesItemLinks = _ref.dataSeriesItemLinks,
    onFetchDynamicDemoHotspots = _ref.onFetchDynamicDemoHotspots,
    actions = _ref.actions;
  var type = cardConfig.type,
    timeRange = cardConfig.timeRange,
    renderEditContent = cardConfig.renderEditContent;
  var mergedI18n = React.useMemo(function () {
    return _objectSpread(_objectSpread({}, defaultProps.i18n), i18n);
  }, [i18n]);
  var _useState = React.useState([]),
    _useState2 = _slicedToArray__default.default(_useState, 2),
    selectedDataItems = _useState2[0],
    setSelectedDataItems = _useState2[1];
  var _useState3 = React.useState(timeRange || ''),
    _useState4 = _slicedToArray__default.default(_useState3, 2),
    selectedTimeRange = _useState4[0],
    setSelectedTimeRange = _useState4[1];
  var handleTranslation = React.useCallback(function (idToTranslate) {
    return handleTranslationCallback(idToTranslate, mergedI18n);
  }, [mergedI18n]);
  var editContentSections = renderEditContent && renderEditContent(onChange, cardConfig);
  return /*#__PURE__*/React__default.default.createElement("div", {
    className: "".concat(iotPrefix, "--card-edit-form--content")
  }, /*#__PURE__*/React__default.default.createElement(CommonCardEditFormFields.default, {
    cardConfig: cardConfig,
    key: "".concat(cardConfig.id, "-common") // fix because I need to regenerate the form state when switching between cards
    ,
    onChange: onChange,
    i18n: mergedI18n,
    shouldUseTranslatedLabels: shouldUseTranslatedLabels,
    getValidTimeRanges: getValidTimeRanges,
    currentBreakpoint: currentBreakpoint,
    selectedDataItems: selectedDataItems,
    setSelectedTimeRange: setSelectedTimeRange,
    translateWithId: handleTranslation
  }), type === LayoutConstants.CARD_TYPES.IMAGE ? /*#__PURE__*/React__default.default.createElement(ImageCardFormContent, {
    cardConfig: cardConfig,
    key: "".concat(cardConfig.id, "-image") // fix because I need to regenerate the form state when switching between cards
    ,
    i18n: mergedI18n,
    onChange: onChange,
    dataSeriesItemLinks: dataSeriesItemLinks,
    dataItems: dataItems,
    getValidDataItems: getValidDataItems,
    availableDimensions: availableDimensions,
    translateWithId: handleTranslation,
    onFetchDynamicDemoHotspots: onFetchDynamicDemoHotspots,
    actions: actions
  }) : type === LayoutConstants.CARD_TYPES.TABLE ? /*#__PURE__*/React__default.default.createElement(TableCardFormContent, {
    cardConfig: cardConfig,
    key: "".concat(cardConfig.id, "-table") // fix because I need to regenerate the form state when switching between cards
    ,
    i18n: mergedI18n,
    onChange: onChange,
    dataItems: dataItems,
    selectedDataItems: selectedDataItems,
    selectedTimeRange: selectedTimeRange,
    setSelectedDataItems: setSelectedDataItems,
    getValidDataItems: getValidDataItems,
    availableDimensions: availableDimensions,
    dataSeriesItemLinks: dataSeriesItemLinks,
    translateWithId: handleTranslation,
    actions: actions
  }) : type === LayoutConstants.CARD_TYPES.BAR || type === LayoutConstants.CARD_TYPES.TIMESERIES || type === LayoutConstants.CARD_TYPES.VALUE || type === LayoutConstants.CARD_TYPES.LIST ? /*#__PURE__*/React__default.default.createElement(DataSeriesFormContent.default, {
    cardConfig: cardConfig,
    isSummaryDashboard: isSummaryDashboard,
    key: "".concat(cardConfig.id, "-data") // fix because I need to regenerate the form state when switching between cards
    ,
    onChange: onChange,
    dataItems: dataItems,
    selectedDataItems: selectedDataItems,
    setSelectedDataItems: setSelectedDataItems,
    selectedTimeRange: selectedTimeRange,
    getValidDataItems: getValidDataItems,
    availableDimensions: availableDimensions,
    i18n: mergedI18n,
    shouldUseTranslatedLabels: shouldUseTranslatedLabels,
    dataSeriesItemLinks: dataSeriesItemLinks,
    translateWithId: handleTranslation,
    actions: actions
  }) : null, Array.isArray(editContentSections) // render the content sections for all types of card if set
  ? editContentSections.map(function (_ref2, index) {
    var header = _ref2.header,
      content = _ref2.content;
    var _ref3 = header || {},
      title = _ref3.title,
      tooltip = _ref3.tooltip;
    return /*#__PURE__*/React__default.default.createElement(React__default.default.Fragment, {
      key: "custom-content-section-".concat(index)
    }, title || tooltip ? /*#__PURE__*/React__default.default.createElement(ContentFormItemTitle, {
      title: title,
      tooltip: tooltip
    }) : null, content);
  }) : null);
};
CardEditFormContent.propTypes = propTypes;
CardEditFormContent.defaultProps = defaultProps;
CardEditFormContent.__docgenInfo = {
  "description": "",
  "methods": [],
  "displayName": "CardEditFormContent",
  "props": {
    "cardConfig": {
      "defaultValue": {
        "value": "{}",
        "computed": false
      },
      "description": "card data value",
      "type": {
        "name": "shape",
        "value": {
          "id": {
            "name": "string",
            "required": false
          },
          "title": {
            "name": "string",
            "required": false
          },
          "size": {
            "name": "string",
            "required": false
          },
          "type": {
            "name": "string",
            "required": false
          },
          "timeRange": {
            "name": "string",
            "required": false
          },
          "renderEditContent": {
            "name": "func",
            "required": false
          },
          "content": {
            "name": "union",
            "value": [{
              "name": "shape",
              "value": {
                "series": {
                  "name": "arrayOf",
                  "value": {
                    "name": "shape",
                    "value": {
                      "label": {
                        "name": "string",
                        "required": false
                      },
                      "dataSourceId": {
                        "name": "string",
                        "required": false
                      },
                      "color": {
                        "name": "string",
                        "required": false
                      }
                    }
                  },
                  "required": false
                },
                "xLabel": {
                  "name": "string",
                  "required": false
                },
                "yLabel": {
                  "name": "string",
                  "required": false
                },
                "unit": {
                  "name": "string",
                  "required": false
                },
                "includeZeroOnXaxis": {
                  "name": "bool",
                  "required": false
                },
                "includeZeroOnYaxis": {
                  "name": "bool",
                  "required": false
                },
                "timeDataSourceId": {
                  "name": "string",
                  "required": false
                },
                "showLegend": {
                  "name": "bool",
                  "required": false
                }
              }
            }, {
              "name": "shape",
              "value": {
                "id": {
                  "name": "string",
                  "required": false
                },
                "src": {
                  "name": "string",
                  "required": false
                },
                "zoomMax": {
                  "name": "number",
                  "required": false
                }
              }
            }, {
              "name": "func"
            }],
            "required": false
          },
          "dataSource": {
            "name": "shape",
            "value": {
              "attributes": {
                "name": "arrayOf",
                "value": {
                  "name": "shape",
                  "value": {
                    "aggregator": {
                      "name": "string",
                      "required": false
                    },
                    "attribute": {
                      "name": "string",
                      "required": false
                    },
                    "id": {
                      "name": "string",
                      "required": false
                    }
                  }
                },
                "required": false
              }
            },
            "required": false
          }
        }
      },
      "required": false
    },
    "i18n": {
      "defaultValue": {
        "value": "{}",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "shape",
        "value": {
          "cardTitle": {
            "name": "string",
            "required": false
          },
          "description": {
            "name": "string",
            "required": false
          },
          "size": {
            "name": "string",
            "required": false
          },
          "selectASize": {
            "name": "string",
            "required": false
          },
          "timeRange": {
            "name": "string",
            "required": false
          },
          "selectATimeRange": {
            "name": "string",
            "required": false
          },
          "last24HoursLabel": {
            "name": "string",
            "required": false
          },
          "last7DaysLabel": {
            "name": "string",
            "required": false
          },
          "lastMonthLabel": {
            "name": "string",
            "required": false
          },
          "lastQuarterLabel": {
            "name": "string",
            "required": false
          },
          "lastYearLabel": {
            "name": "string",
            "required": false
          },
          "thisWeekLabel": {
            "name": "string",
            "required": false
          },
          "thisMonthLabel": {
            "name": "string",
            "required": false
          },
          "thisQuarterLabel": {
            "name": "string",
            "required": false
          },
          "thisYearLabel": {
            "name": "string",
            "required": false
          }
        }
      },
      "required": false
    },
    "shouldUseTranslatedLabels": {
      "defaultValue": {
        "value": "false",
        "computed": false
      },
      "description": "whether to use translated labels in cards",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "getValidDataItems": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "if provided, returns an array of strings which are the dataItems to be allowed\non each card\ngetValidDataItems(card, selectedTimeRange)",
      "type": {
        "name": "func"
      },
      "required": false
    },
    "getValidTimeRanges": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "if provided, returns an array of strings which are the timeRanges to be allowed\non each card\ngetValidTimeRanges(card, selectedDataItems)",
      "type": {
        "name": "func"
      },
      "required": false
    },
    "dataItems": {
      "defaultValue": {
        "value": "[]",
        "computed": false
      },
      "description": "an array of dataItems to be included on each card\nthis prop will be ignored if getValidDataItems is defined",
      "type": {
        "name": "custom",
        "raw": "DataItemsPropTypes"
      },
      "required": false
    },
    "currentBreakpoint": {
      "defaultValue": {
        "value": "'xl'",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "string"
      },
      "required": false
    },
    "availableDimensions": {
      "defaultValue": {
        "value": "{}",
        "computed": false
      },
      "description": "an object where the keys are available dimensions and the values are the values available for those dimensions\n ex: { manufacturer: ['Rentech', 'GHI Industries'], deviceid: ['73000', '73001', '73002'] }",
      "type": {
        "name": "shape",
        "value": {}
      },
      "required": false
    },
    "isSummaryDashboard": {
      "defaultValue": {
        "value": "false",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "dataSeriesItemLinks": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "optional link href's for each card type that will appear in a tooltip",
      "type": {
        "name": "shape",
        "value": {
          "simpleBar": {
            "name": "string",
            "required": false
          },
          "groupedBar": {
            "name": "string",
            "required": false
          },
          "stackedBar": {
            "name": "string",
            "required": false
          },
          "timeSeries": {
            "name": "string",
            "required": false
          },
          "value": {
            "name": "string",
            "required": false
          },
          "custom": {
            "name": "string",
            "required": false
          },
          "table": {
            "name": "string",
            "required": false
          },
          "image": {
            "name": "string",
            "required": false
          }
        }
      },
      "required": false
    },
    "actions": {
      "defaultValue": {
        "value": "defaultDashboardEditorActionsProps",
        "computed": true
      },
      "description": "",
      "type": {
        "name": "custom",
        "raw": "DashboardEditorActionsPropTypes"
      },
      "required": false
    },
    "onChange": {
      "description": "Callback function when form data changes",
      "type": {
        "name": "func"
      },
      "required": true
    }
  }
};
var CardEditFormContent$1 = CardEditFormContent;

exports.default = CardEditFormContent$1;
exports.handleTranslationCallback = handleTranslationCallback;
