/*!
 * Copyright © 2018 Splunk Inc.
 * SPLUNK CONFIDENTIAL – Use or disclosure of this material in whole or
 * in part without a valid written license from Splunk Inc. is PROHIBITED.
 */
module.exports =
/******/ (function(modules) { // webpackBootstrap
/******/ 	// The module cache
/******/ 	var installedModules = {};
/******/
/******/ 	// The require function
/******/ 	function __webpack_require__(moduleId) {
/******/
/******/ 		// Check if module is in cache
/******/ 		if(installedModules[moduleId]) {
/******/ 			return installedModules[moduleId].exports;
/******/ 		}
/******/ 		// Create a new module (and put it into the cache)
/******/ 		var module = installedModules[moduleId] = {
/******/ 			i: moduleId,
/******/ 			l: false,
/******/ 			exports: {}
/******/ 		};
/******/
/******/ 		// Execute the module function
/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ 		// Flag the module as loaded
/******/ 		module.l = true;
/******/
/******/ 		// Return the exports of the module
/******/ 		return module.exports;
/******/ 	}
/******/
/******/
/******/ 	// expose the modules object (__webpack_modules__)
/******/ 	__webpack_require__.m = modules;
/******/
/******/ 	// expose the module cache
/******/ 	__webpack_require__.c = installedModules;
/******/
/******/ 	// define getter function for harmony exports
/******/ 	__webpack_require__.d = function(exports, name, getter) {
/******/ 		if(!__webpack_require__.o(exports, name)) {
/******/ 			Object.defineProperty(exports, name, { enumerable: true, get: getter });
/******/ 		}
/******/ 	};
/******/
/******/ 	// define __esModule on exports
/******/ 	__webpack_require__.r = function(exports) {
/******/ 		if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ 			Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ 		}
/******/ 		Object.defineProperty(exports, '__esModule', { value: true });
/******/ 	};
/******/
/******/ 	// create a fake namespace object
/******/ 	// mode & 1: value is a module id, require it
/******/ 	// mode & 2: merge all properties of value into the ns
/******/ 	// mode & 4: return value when already ns object
/******/ 	// mode & 8|1: behave like require
/******/ 	__webpack_require__.t = function(value, mode) {
/******/ 		if(mode & 1) value = __webpack_require__(value);
/******/ 		if(mode & 8) return value;
/******/ 		if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
/******/ 		var ns = Object.create(null);
/******/ 		__webpack_require__.r(ns);
/******/ 		Object.defineProperty(ns, 'default', { enumerable: true, value: value });
/******/ 		if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
/******/ 		return ns;
/******/ 	};
/******/
/******/ 	// getDefaultExport function for compatibility with non-harmony modules
/******/ 	__webpack_require__.n = function(module) {
/******/ 		var getter = module && module.__esModule ?
/******/ 			function getDefault() { return module['default']; } :
/******/ 			function getModuleExports() { return module; };
/******/ 		__webpack_require__.d(getter, 'a', getter);
/******/ 		return getter;
/******/ 	};
/******/
/******/ 	// Object.prototype.hasOwnProperty.call
/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ 	// __webpack_public_path__
/******/ 	__webpack_require__.p = "";
/******/
/******/
/******/ 	// Load entry module and return exports
/******/ 	return __webpack_require__(__webpack_require__.s = 71);
/******/ })
/************************************************************************/
/******/ ([
/* 0 */
/***/ (function(module, exports) {

module.exports = require("prop-types");

/***/ }),
/* 1 */
/***/ (function(module, exports) {

module.exports = require("react");

/***/ }),
/* 2 */,
/* 3 */
/***/ (function(module, exports) {

module.exports = require("@splunk/visualizations-shared/SanitizeProps");

/***/ }),
/* 4 */
/***/ (function(module, exports) {

module.exports = require("@babel/runtime/helpers/extends");

/***/ }),
/* 5 */,
/* 6 */
/***/ (function(module, exports) {

module.exports = require("@babel/runtime/helpers/defineProperty");

/***/ }),
/* 7 */
/***/ (function(module, exports) {

module.exports = require("styled-components");

/***/ }),
/* 8 */
/***/ (function(module, exports) {

module.exports = require("lodash/omit");

/***/ }),
/* 9 */,
/* 10 */,
/* 11 */,
/* 12 */,
/* 13 */,
/* 14 */,
/* 15 */,
/* 16 */,
/* 17 */,
/* 18 */
/***/ (function(module, exports) {

module.exports = require("lodash/isEmpty");

/***/ }),
/* 19 */
/***/ (function(module, exports) {

module.exports = require("@splunk/visualizations/common/utils/singleValueUtils");

/***/ }),
/* 20 */
/***/ (function(module, __webpack_exports__, __webpack_require__) {

"use strict";
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return propsConvert; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return propsDeprecate; });
/* harmony import */ var lodash_omit__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(8);
/* harmony import */ var lodash_omit__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(lodash_omit__WEBPACK_IMPORTED_MODULE_0__);

/**
 * convert the old props to new props for pure visualization based on propsMapping
 * @param {Object} oldProps   props used by react visualizations
 * @param {Object} propsMapping
 * @return {Object} newprops    props used by pure visualizations
 */

var propsConvert = function propsConvert(oldProps, propsMapping) {
  var newProps = {};
  Object.keys(oldProps).forEach(function (propKey) {
    var key = propsMapping[propKey] || propKey;
    newProps[key] = oldProps[propKey];
  });
  return newProps;
};
/**
 * omit the deprecated props for pure visualization
 * @param {Object} props   props used by react visualizations
 * @param {Array} deprecatedProps
 * @return {Object} newprops    props used by pure visualizations
 */

var propsDeprecate = function propsDeprecate(props, deprecatedProps) {
  return lodash_omit__WEBPACK_IMPORTED_MODULE_0___default()(props, deprecatedProps);
};

/***/ }),
/* 21 */,
/* 22 */
/***/ (function(module, exports) {

module.exports = require("@splunk/themes/variables");

/***/ }),
/* 23 */,
/* 24 */,
/* 25 */,
/* 26 */,
/* 27 */,
/* 28 */,
/* 29 */
/***/ (function(module, exports) {

module.exports = require("@splunk/themes/pick");

/***/ }),
/* 30 */
/***/ (function(module, exports) {

module.exports = require("@splunk/visualizations-shared/colorConstants");

/***/ }),
/* 31 */,
/* 32 */
/***/ (function(module, exports) {

module.exports = require("@splunk/ui-utils/i18n");

/***/ }),
/* 33 */
/***/ (function(module, exports) {

module.exports = require("@splunk/visualizations-shared/Message");

/***/ }),
/* 34 */,
/* 35 */
/***/ (function(module, exports) {

module.exports = require("@splunk/visualizations/SingleValueBasic");

/***/ }),
/* 36 */,
/* 37 */,
/* 38 */,
/* 39 */,
/* 40 */,
/* 41 */,
/* 42 */,
/* 43 */
/***/ (function(module, exports) {

module.exports = require("lodash/pick");

/***/ }),
/* 44 */
/***/ (function(module, exports) {

module.exports = require("@splunk/visualizations-shared/style");

/***/ }),
/* 45 */
/***/ (function(module, exports) {

module.exports = require("@splunk/visualizations-shared/SizeAwareWrapper");

/***/ }),
/* 46 */,
/* 47 */,
/* 48 */,
/* 49 */,
/* 50 */,
/* 51 */,
/* 52 */,
/* 53 */,
/* 54 */,
/* 55 */,
/* 56 */,
/* 57 */,
/* 58 */,
/* 59 */,
/* 60 */,
/* 61 */,
/* 62 */,
/* 63 */,
/* 64 */,
/* 65 */,
/* 66 */,
/* 67 */,
/* 68 */,
/* 69 */,
/* 70 */,
/* 71 */
/***/ (function(module, __webpack_exports__, __webpack_require__) {

"use strict";
// ESM COMPAT FLAG
__webpack_require__.r(__webpack_exports__);

// EXTERNAL MODULE: external "@babel/runtime/helpers/defineProperty"
var defineProperty_ = __webpack_require__(6);
var defineProperty_default = /*#__PURE__*/__webpack_require__.n(defineProperty_);

// EXTERNAL MODULE: external "@babel/runtime/helpers/extends"
var extends_ = __webpack_require__(4);
var extends_default = /*#__PURE__*/__webpack_require__.n(extends_);

// EXTERNAL MODULE: external "react"
var external_react_ = __webpack_require__(1);
var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_);

// EXTERNAL MODULE: external "prop-types"
var external_prop_types_ = __webpack_require__(0);
var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_prop_types_);

// EXTERNAL MODULE: external "@splunk/visualizations-shared/SanitizeProps"
var SanitizeProps_ = __webpack_require__(3);

// EXTERNAL MODULE: external "@splunk/themes/pick"
var pick_ = __webpack_require__(29);
var pick_default = /*#__PURE__*/__webpack_require__.n(pick_);

// EXTERNAL MODULE: external "@splunk/themes/variables"
var variables_ = __webpack_require__(22);
var variables_default = /*#__PURE__*/__webpack_require__.n(variables_);

// EXTERNAL MODULE: external "styled-components"
var external_styled_components_ = __webpack_require__(7);
var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_);

// EXTERNAL MODULE: external "lodash/pick"
var external_lodash_pick_ = __webpack_require__(43);
var external_lodash_pick_default = /*#__PURE__*/__webpack_require__.n(external_lodash_pick_);

// EXTERNAL MODULE: external "lodash/isEmpty"
var isEmpty_ = __webpack_require__(18);
var isEmpty_default = /*#__PURE__*/__webpack_require__.n(isEmpty_);

// EXTERNAL MODULE: external "@splunk/ui-utils/i18n"
var i18n_ = __webpack_require__(32);

// EXTERNAL MODULE: external "@splunk/visualizations-shared/style"
var style_ = __webpack_require__(44);

// EXTERNAL MODULE: external "@splunk/visualizations-shared/SizeAwareWrapper"
var SizeAwareWrapper_ = __webpack_require__(45);
var SizeAwareWrapper_default = /*#__PURE__*/__webpack_require__.n(SizeAwareWrapper_);

// EXTERNAL MODULE: external "@splunk/visualizations-shared/Message"
var Message_ = __webpack_require__(33);
var Message_default = /*#__PURE__*/__webpack_require__.n(Message_);

// EXTERNAL MODULE: external "@splunk/visualizations/common/utils/singleValueUtils"
var singleValueUtils_ = __webpack_require__(19);

// EXTERNAL MODULE: external "@splunk/visualizations/SingleValueBasic"
var SingleValueBasic_ = __webpack_require__(35);
var SingleValueBasic_default = /*#__PURE__*/__webpack_require__.n(SingleValueBasic_);

// EXTERNAL MODULE: external "@splunk/visualizations-shared/colorConstants"
var colorConstants_ = __webpack_require__(30);

// CONCATENATED MODULE: ./src/visualizations/SingleValueRadial/src/components/RadialGraph.jsx
// this is a copy of RadialGraph.jsx @ 23.5.0 before the design changes to PureSingleValueRadial were rolled out




var RadialGraph_RadialGraph = function RadialGraph(_ref) {
  var progress = _ref.progress,
      _ref$size = _ref.size,
      size = _ref$size === void 0 ? 200 : _ref$size,
      strokeWidth = _ref.strokeWidth,
      _ref$backgroundColor = _ref.backgroundColor,
      backgroundColor = _ref$backgroundColor === void 0 ? colorConstants_["RADIAL_BACKGROUND_COLOR"] : _ref$backgroundColor,
      _ref$progressColor = _ref.progressColor,
      progressColor = _ref$progressColor === void 0 ? colorConstants_["RADIAL_STROKE_COLOR"] : _ref$progressColor;
  var normalizedSize = size / 2;
  var normalizedRadius = normalizedSize - strokeWidth * 2;
  var circumference = normalizedRadius * 2 * Math.PI;
  var bgCircleOffset = 0.8 * circumference;
  var progress80 = progress / 100 * 80;
  var progressWidth = progress80 / 100 * circumference; // Offset the start of the circle to a position that makes the arc look evenly spaced
  // with the opening at the bottom
  // We use 80% of a circle (288deg), half on each side of "0" (144deg)
  // SVG starts drawing (0deg) at the 3 o'clock position, so add another 90 to offset this (234deg)
  // This means the arc length that we offset is 2 * PI * r * 234/360 or ...

  var strokeDashoffset = circumference * 0.65;
  return /*#__PURE__*/external_react_default.a.createElement("svg", {
    height: normalizedSize * 2,
    width: normalizedSize * 2
  }, /*#__PURE__*/external_react_default.a.createElement("g", null, /*#__PURE__*/external_react_default.a.createElement("circle", {
    "data-test": "background-radial",
    stroke: backgroundColor,
    fill: "transparent",
    strokeWidth: strokeWidth,
    strokeDasharray: "".concat(bgCircleOffset, " ").concat(circumference - bgCircleOffset),
    style: {
      strokeDashoffset: strokeDashoffset
    },
    r: normalizedRadius,
    cx: normalizedSize,
    cy: normalizedSize
  }), /*#__PURE__*/external_react_default.a.createElement("circle", {
    "data-test": "progress-radial",
    stroke: progressColor,
    fill: "transparent",
    strokeWidth: strokeWidth,
    strokeDasharray: "".concat(progressWidth, " ").concat(circumference - progressWidth),
    style: {
      strokeDashoffset: strokeDashoffset
    },
    r: normalizedRadius,
    cx: normalizedSize,
    cy: normalizedSize
  })));
};

RadialGraph_RadialGraph.propTypes = {
  progress: external_prop_types_default.a.number,
  size: external_prop_types_default.a.number,
  strokeWidth: external_prop_types_default.a.number,
  backgroundColor: external_prop_types_default.a.string,
  progressColor: external_prop_types_default.a.string
};
RadialGraph_RadialGraph.defaultProps = {
  progress: 0,
  strokeWidth: 12
};
/* harmony default export */ var components_RadialGraph = (RadialGraph_RadialGraph);
// CONCATENATED MODULE: ./src/visualizations/SingleValueRadial/src/utils/displayUtils.js
// this is a copy of displayUtils.js @ 23.5.0 before the design changes to PureSingleValueRadial were rolled out


var VALID_TREND_POSITIONS = ['standard', 'below', 'outside'];
var MAJOR_FONT_THRESHOLD = 25;
var TREND_FONT_THRESHOLD = 12;
var DEFAULT_RADIAL_STROKE_WIDTH = 12;
var SMALL_RADIAL_STROKE_WIDTH = 6;
/**
 * Get the colors for a radial graph based on severity
 * @method getRadialColors
 * @param {Object} props
 * @param {Bool} props.backgroundEnabled
 * @param {String} props.backgroundColor
 * @returns {Object} { background, stroke } colors
 */

var displayUtils_getRadialColors = function getRadialColors(_ref) {
  var backgroundEnabled = _ref.backgroundEnabled,
      backgroundColor = _ref.backgroundColor;
  return Object(singleValueUtils_["getGraphColors"])({
    backgroundEnabled: backgroundEnabled,
    backgroundColor: backgroundColor,
    defaultColors: colorConstants_["RADIAL_SEVERITY_COLORS"],
    customColorFormatter: function customColorFormatter(color) {
      return {
        background: Object(singleValueUtils_["lighten"])(color),
        stroke: Object(singleValueUtils_["darken"])(color)
      };
    }
  });
};
/**
 * Figure out the diameter of the graph
 * @method getGraphSize
 * @param {Object} props
 * @param {Number} props.width                    // Width of the container
 * @param {Number} props.height                   // Height of the container
 * @param {Number} props.underLabel               // Underlabel if present
 * @returns {Number} diameter of the graph
 */

var displayUtils_getGraphSize = function getGraphSize(_ref2) {
  var width = _ref2.width,
      height = _ref2.height,
      underLabel = _ref2.underLabel;
  var size = Math.min(width, height);

  if (underLabel) {
    size -= singleValueUtils_["DEFAULT_FONT"];
  }

  return size;
};
/**
 * Get the maximum size of the container that holds the graph text
 * @method getValueContentSize
 * @param {Object} props
 * @param {Number} props.graphSize
 * @param {Number} props.radialStrokeWidth             // Stroke width of the graph
 * @returns {Number} content size for showing major and trend values in radial graph
 */

var getValueContentSize = function getValueContentSize(_ref3) {
  var graphSize = _ref3.graphSize,
      radialStrokeWidth = _ref3.radialStrokeWidth; // Account for the graph's stroke width

  var diameter = graphSize - radialStrokeWidth; // Use pythagoreum theorum with circle diameter
  // to calculate the size of the sides of the square inside the circle

  return Math.floor(Math.sqrt(Math.pow(diameter, 2) / 2));
};
/*
 * @method getRadialStrokeWidth
 * @param {Number} graphSize
 * @returns {Number} radial stroke width
 */

var getRadialStrokeWidth = function getRadialStrokeWidth(graphSize) {
  return graphSize >= 90 ? DEFAULT_RADIAL_STROKE_WIDTH : SMALL_RADIAL_STROKE_WIDTH;
};
/*
 * @method isValidPosition
 * @param {String} position
 * @returns {Bool}
 */

var isValidPosition = function isValidPosition(position) {
  return VALID_TREND_POSITIONS.indexOf(position) > -1;
};
/**
 * Compute the trend indicator position based on font size of major and trend value
 * @method computeTrendIndicatorPosition
 * @param {Object} props
 * @param {String} props.trendIndicatorPosition
 * @param {Number} props.majorTextFontSize
 * @param {Number} props.trendTextFontSize
 * @returns {String} trend indicator position in radial graph
 */

var computeTrendIndicatorPosition = function computeTrendIndicatorPosition(_ref4) {
  var trendIndicatorPosition = _ref4.trendIndicatorPosition,
      majorTextFontSize = _ref4.majorTextFontSize,
      trendTextFontSize = _ref4.trendTextFontSize;
  var position = trendIndicatorPosition;

  if (!isValidPosition(position)) {
    position = 'standard';
  }

  if (position !== 'outside' && (trendTextFontSize < TREND_FONT_THRESHOLD || majorTextFontSize < MAJOR_FONT_THRESHOLD)) {
    position = 'below';
  }

  return position;
};
/*
 * @method showTrendPositionStandard
 * @param {Object} props
 * @param {Bool} props.showTrendIndicator
 * @param {String} props.position
 * @returns {Bool}
 */

var showTrendPositionStandard = function showTrendPositionStandard(_ref5) {
  var showTrendIndicator = _ref5.showTrendIndicator,
      position = _ref5.position;
  return showTrendIndicator && position === 'standard';
};
/*
 * @method showTrendPositionBelow
 * @param {Object} props
 * @param {Bool} props.showTrendIndicator
 * @param {String} props.position
 * @returns {Bool}
 */

var showTrendPositionBelow = function showTrendPositionBelow(_ref6) {
  var showTrendIndicator = _ref6.showTrendIndicator,
      position = _ref6.position;
  return showTrendIndicator && position === 'below';
};
/*
 * @method showTrendPositionOutside
 * @param {Object} props
 * @param {Bool} props.showTrendIndicator
 * @param {String} props.position
 * @returns {Bool}
 */

var showTrendPositionOutside = function showTrendPositionOutside(_ref7) {
  var showTrendIndicator = _ref7.showTrendIndicator,
      position = _ref7.position;
  return showTrendIndicator && position === 'outside';
};
/*
 * todo: need handle max and min
 * @method getRadialProgress
 * @param {Number} majorValue
 * @returns {Number} progress bar in radial graph
 */

var getRadialProgress = function getRadialProgress(majorValue) {
  return Number.isNaN(Number(majorValue)) ? 0 : majorValue / Math.max(majorValue, 100) * 100;
};
// CONCATENATED MODULE: ./src/visualizations/SingleValueRadial/src/components/RadialLayout.jsx



function ownKeys(object, enumerableOnly) {
  var keys = Object.keys(object);

  if (Object.getOwnPropertySymbols) {
    var symbols = Object.getOwnPropertySymbols(object);
    if (enumerableOnly) symbols = symbols.filter(function (sym) {
      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
    });
    keys.push.apply(keys, symbols);
  }

  return keys;
}

function _objectSpread(target) {
  for (var i = 1; i < arguments.length; i++) {
    var source = arguments[i] != null ? arguments[i] : {};

    if (i % 2) {
      ownKeys(Object(source), true).forEach(function (key) {
        defineProperty_default()(target, key, source[key]);
      });
    } else if (Object.getOwnPropertyDescriptors) {
      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
    } else {
      ownKeys(Object(source)).forEach(function (key) {
        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
      });
    }
  }

  return target;
} // this is a copy of RadialLayout.jsx @ 23.5.0 before the design changes to PureSingleValueRadial were rolled out









var PositionDiv = external_styled_components_default.a.div.withConfig({
  displayName: "RadialLayout__PositionDiv",
  componentId: "sc-1vd28ez-0"
})(["position:absolute;", ";bottom:", "px;left:0;width:100%;height:100%;display:flex;align-items:", ";justify-content:center;"], function (props) {
  return props.bottom ? '' : 'top: 0';
}, function (props) {
  return props.bottom || 0;
}, function (props) {
  return props.align || 'center';
});
var Column = external_styled_components_default.a.div.withConfig({
  displayName: "RadialLayout__Column",
  componentId: "sc-1vd28ez-1"
})(["display:flex;flex-direction:column;align-items:", ";justify-content:", ";"], function (props) {
  return props.align || 'center';
}, function (props) {
  return props.align || 'center';
});
var Row = external_styled_components_default.a.div.withConfig({
  displayName: "RadialLayout__Row",
  componentId: "sc-1vd28ez-2"
})(["display:flex;flex-direction:row;align-items:center;justify-content:center;"]);
var Square = external_styled_components_default.a.div.withConfig({
  displayName: "RadialLayout__Square",
  componentId: "sc-1vd28ez-3"
})(["position:relative;margin:0 auto;width:", "px;height:", "px;"], function (props) {
  return props.size;
}, function (props) {
  return props.size;
});
var UnderLabelContainer = external_styled_components_default.a.div.withConfig({
  displayName: "RadialLayout__UnderLabelContainer",
  componentId: "sc-1vd28ez-4"
})(["color:", ";margin-top:", ";font-size:", "px;"], function (props) {
  return props.color;
}, function (props) {
  return props.size && "-".concat(props.size * 0.1, "px") || 0;
}, function (props) {
  return props.size || 12;
});
/**
 * Render the trend indicator
 * @method renderTrendValue
 * @returns {Object}
 * @private
 */

var RadialLayout_renderIsolateTrend = function renderIsolateTrend(_ref) {
  var trendText = _ref.trendText,
      trendColor = _ref.trendColor,
      contentSize = _ref.contentSize;
  var trendTextFontSize = Object(singleValueUtils_["getTrendFontSize"])({
    width: contentSize / 2,
    height: contentSize / 4,
    trendText: trendText,
    spaceRatio: 1
  });
  return /*#__PURE__*/external_react_default.a.createElement(SingleValueBasic_["SingleValueTrendValue"], {
    fontSize: trendTextFontSize,
    color: trendColor,
    value: trendText,
    text: trendText
  });
};

RadialLayout_renderIsolateTrend.propTypes = {
  trendText: external_prop_types_default.a.string,
  trendColor: external_prop_types_default.a.string,
  contentSize: external_prop_types_default.a.number
};

var RadialLayout_RadialContent = function RadialContent(_ref2) {
  var props = extends_default()({}, _ref2);

  var majorColor = props.majorColor,
      majorText = props.majorText,
      majorTextFontSize = props.majorTextFontSize,
      majorValueTitle = props.majorValueTitle,
      trendColor = props.trendColor,
      trendText = props.trendText,
      trendTextFontSize = props.trendTextFontSize,
      showTrendIndicator = props.showTrendIndicator,
      trendPosition = props.trendPosition,
      unit = props.unit,
      unitPosition = props.unitPosition,
      underLabelColor = props.underLabelColor,
      underLabelFontSize = props.underLabelFontSize,
      underLabel = props.underLabel,
      onValueClick = props.onValueClick,
      contentSize = props.contentSize,
      showRadialGraph = props.showRadialGraph,
      graphSize = props.graphSize,
      progress = props.progress,
      radialBackgroundColor = props.radialBackgroundColor,
      radialStrokeColor = props.radialStrokeColor,
      radialStrokeWidth = props.radialStrokeWidth; // for trend position below and outside

  var trendComponent = RadialLayout_renderIsolateTrend({
    trendText: trendText,
    trendColor: trendColor,
    contentSize: contentSize
  });
  var basicSingleValues = /*#__PURE__*/external_react_default.a.createElement(SingleValueBasic_default.a, {
    majorColor: majorColor,
    majorText: majorText,
    majorTextFontSize: majorTextFontSize,
    majorValueTitle: majorValueTitle,
    trendColor: trendColor,
    trendText: trendText,
    trendTextFontSize: trendTextFontSize,
    showTrendIndicator: showTrendPositionStandard({
      showTrendIndicator: showTrendIndicator,
      position: trendPosition
    }),
    unit: unit,
    unitPosition: unitPosition,
    onValueClick: onValueClick
  });
  var radialGraph = showRadialGraph ? /*#__PURE__*/external_react_default.a.createElement(components_RadialGraph, {
    size: graphSize,
    progress: progress,
    backgroundColor: radialBackgroundColor,
    progressColor: radialStrokeColor,
    strokeWidth: radialStrokeWidth
  }) : null;
  var underLabelComponent = underLabel ? /*#__PURE__*/external_react_default.a.createElement(UnderLabelContainer, {
    "data-test": "underLabel",
    color: underLabelColor,
    size: underLabelFontSize
  }, underLabel) : null;
  var outsideComponent = showTrendPositionOutside({
    showTrendIndicator: showTrendIndicator,
    position: trendPosition
  }) ? /*#__PURE__*/external_react_default.a.createElement(Column, {
    align: "end",
    "data-test": "trend-position-outside"
  }, trendComponent, underLabelComponent) : null;
  var belowTrendComponent = showTrendPositionBelow({
    showTrendIndicator: showTrendIndicator,
    position: trendPosition
  }) ? /*#__PURE__*/external_react_default.a.createElement(PositionDiv, {
    "data-test": "trend-position-below",
    align: "flex-end",
    bottom: graphSize * 0.1,
    style: {
      textAlign: 'center'
    }
  }, trendComponent) : null;
  return /*#__PURE__*/external_react_default.a.createElement(Row, null, /*#__PURE__*/external_react_default.a.createElement(Column, null, /*#__PURE__*/external_react_default.a.createElement(Square, {
    size: graphSize
  }, radialGraph, belowTrendComponent, /*#__PURE__*/external_react_default.a.createElement(PositionDiv, null, basicSingleValues)), trendPosition !== 'outside' && underLabelComponent), outsideComponent);
};

RadialLayout_RadialContent.propTypes = _objectSpread(_objectSpread({}, SingleValueBasic_default.a.propTypes), {}, {
  trendPosition: external_prop_types_default.a.string,
  contentSize: external_prop_types_default.a.number,
  showRadialGraph: external_prop_types_default.a.bool,
  graphSize: external_prop_types_default.a.number,
  progress: external_prop_types_default.a.number,
  radialBackgroundColor: external_prop_types_default.a.string,
  radialStrokeColor: external_prop_types_default.a.string,
  radialStrokeWidth: external_prop_types_default.a.number
});
/* harmony default export */ var RadialLayout = (RadialLayout_RadialContent);
// CONCATENATED MODULE: ./src/visualizations/SingleValueRadial/src/components/SingleValueRadial.jsx
 // this is a copy of SingleValueRadial.jsx @ 23.5.0 before the design changes to PureSingleValueRadial were rolled out















var Container = external_styled_components_default.a.div.withConfig({
  displayName: "SingleValueRadial__Container",
  componentId: "sc-172kh88-0"
})(["overflow:hidden;", ";"], function (props) {
  return Object(style_["toDimension"])(external_lodash_pick_default()(props, ['width', 'height']));
});
var VizStyleWrapper = external_styled_components_default.a.div.attrs(function (_ref) {
  var dataTestKey = _ref.dataTestKey;
  return {
    'data-test': dataTestKey
  };
}).withConfig({
  displayName: "SingleValueRadial__VizStyleWrapper",
  componentId: "sc-172kh88-1"
})(["display:flex;justify-content:center;flex-direction:column;width:100%;height:100%;background-color:", ";"], function (props) {
  return props.backgroundColor;
});
VizStyleWrapper.displayName = 'VizStyleWrapper';

var SingleValueRadial_SingleValueRadial = function SingleValueRadial(_ref2) {
  var props = extends_default()({}, _ref2);

  var width = props.width,
      _props$height = props.height,
      height = _props$height === void 0 ? 250 : _props$height,
      style = props.style,
      majorFontSize = props.majorFontSize,
      majorValue = props.majorValue,
      majorValueField = props.majorValueField,
      trendValue = props.trendValue,
      trendFontSize = props.trendFontSize,
      unitPosition = props.unitPosition,
      numberPrecision = props.numberPrecision,
      shouldUseThousandSeparators = props.shouldUseThousandSeparators,
      shouldAbbreviateTrendValue = props.shouldAbbreviateTrendValue,
      _props$trendIndicator = props.trendIndicatorPosition,
      trendIndicatorPosition = _props$trendIndicator === void 0 ? 'standard' : _props$trendIndicator,
      onValueClick = props.onValueClick; // calculate colors

  var defaultColors = {
    defaultFontColor: pick_default()({
      enterprise: {
        dark: variables_default.a.textColor(props),
        light: variables_default.a.gray20(props)
      },
      prisma: variables_default.a.contentColorActive(props)
    })(props),
    defaultBlockFontColor: pick_default()({
      enterprise: variables_default.a.white(props),
      prisma: variables_default.a.contentColorActive(props)
    })(props)
  };

  var _computeColors = Object(singleValueUtils_["computeColors"])(props, defaultColors),
      backgroundEnabled = _computeColors.backgroundEnabled,
      backgroundColor = _computeColors.backgroundColor,
      majorColor = _computeColors.majorColor,
      trendColor = _computeColors.trendColor,
      underLabelColor = _computeColors.underLabelColor;

  var radialColors = displayUtils_getRadialColors({
    backgroundEnabled: backgroundEnabled,
    backgroundColor: backgroundColor
  });
  var radialBackgroundColor = props.radialBackgroundColor || radialColors.background;
  var radialStrokeColor = props.radialStrokeColor || radialColors.stroke;
  var handleValueClick = Object(external_react_["useCallback"])(function (ev) {
    return Object(singleValueUtils_["handleValueClickCallback"])(ev, majorValue, majorValueField, trendValue, onValueClick);
  }, [onValueClick, majorValue, majorValueField, trendValue]);

  var renderVisualization = function renderVisualization(_ref3) {
    var containerWidth = _ref3.width,
        containerHeight = _ref3.height;

    if (containerWidth < 35 || containerHeight < 35) {
      return /*#__PURE__*/external_react_default.a.createElement(Message_default.a, {
        width: containerWidth,
        height: containerHeight,
        message: Object(i18n_["_"])('Too small to render content'),
        level: "info"
      });
    } // will update later based on text size


    var trendDisplay = props.trendDisplay,
        unit = props.unit,
        underLabel = props.underLabel;
    var showRadialGraph = true; // calculate radial graph, major and trend content, and underlabel size

    var graphSize = displayUtils_getGraphSize({
      width: containerWidth,
      height: containerHeight,
      underLabel: underLabel
    });
    var radialStrokeWidth = getRadialStrokeWidth(graphSize);
    var valueContentSize = getValueContentSize({
      graphSize: graphSize,
      radialStrokeWidth: radialStrokeWidth
    });
    var underLabelFontSize = Object(singleValueUtils_["getUnderLabelHeight"])(graphSize * 0.1); // calculate major and trend text

    var toRemoveList = [{
      key: 'underLabel',
      value: ''
    }, {
      key: 'showRadialGraph',
      value: false
    }, {
      key: 'trendDisplay',
      value: 'off'
    }, {
      key: 'unit',
      value: ''
    }];

    var _computeSingleValueCo = Object(singleValueUtils_["computeSingleValueContent"])({
      majorValue: majorValue,
      trendValue: trendValue,
      majorFontSize: majorFontSize,
      trendFontSize: trendFontSize,
      trendDisplay: trendDisplay,
      contentWidth: valueContentSize,
      contentHeight: valueContentSize,
      containerWidth: containerWidth,
      containerHeight: containerHeight,
      unit: unit,
      numberPrecision: numberPrecision,
      shouldUseThousandSeparators: shouldUseThousandSeparators,
      shouldAbbreviateTrendValue: shouldAbbreviateTrendValue,
      toRemoveList: toRemoveList
    }),
        majorText = _computeSingleValueCo.majorText,
        trendText = _computeSingleValueCo.trendText,
        majorTextFontSize = _computeSingleValueCo.majorTextFontSize,
        trendTextFontSize = _computeSingleValueCo.trendTextFontSize,
        majorValueTitle = _computeSingleValueCo.majorValueTitle,
        smallVizProps = _computeSingleValueCo.smallVizProps;

    if (!isEmpty_default()(smallVizProps)) {
      underLabel = smallVizProps.underLabel;
      showRadialGraph = smallVizProps.showRadialGraph;
      trendDisplay = smallVizProps.trendDisplay;
      unit = smallVizProps.unit;
    } // calculate trend position


    var position = computeTrendIndicatorPosition({
      trendIndicatorPosition: trendIndicatorPosition,
      majorTextFontSize: majorTextFontSize,
      trendTextFontSize: trendTextFontSize
    }); // calculate radial

    var progress = getRadialProgress(majorValue);
    return /*#__PURE__*/external_react_default.a.createElement(VizStyleWrapper, {
      backgroundColor: backgroundColor,
      style: style,
      dataTestKey: "SingleValueRadialWrapper"
    }, /*#__PURE__*/external_react_default.a.createElement(RadialLayout, {
      "data-test": "RadialLayout",
      majorColor: majorColor,
      majorText: majorText,
      majorTextFontSize: majorTextFontSize,
      majorValueTitle: majorValueTitle,
      trendColor: trendColor,
      trendText: trendText,
      trendTextFontSize: trendTextFontSize,
      showTrendIndicator: Object(singleValueUtils_["shouldShowTrend"])(trendDisplay),
      trendPosition: position,
      unit: unit,
      unitPosition: unitPosition,
      underLabelColor: underLabelColor,
      underLabelFontSize: underLabelFontSize,
      underLabel: underLabel,
      onValueClick: handleValueClick,
      contentSize: valueContentSize * 0.7,
      showRadialGraph: showRadialGraph,
      graphSize: graphSize,
      progress: progress,
      radialBackgroundColor: radialBackgroundColor,
      radialStrokeColor: radialStrokeColor,
      radialStrokeWidth: radialStrokeWidth
    }));
  };

  return /*#__PURE__*/external_react_default.a.createElement(Container, {
    width: width,
    height: height
  }, /*#__PURE__*/external_react_default.a.createElement(SizeAwareWrapper_default.a, null, function (containerDimension) {
    return renderVisualization(containerDimension);
  }));
};

SingleValueRadial_SingleValueRadial.propTypes = {
  width: external_prop_types_default.a.oneOfType([external_prop_types_default.a.string, external_prop_types_default.a.number]),
  height: external_prop_types_default.a.oneOfType([external_prop_types_default.a.string, external_prop_types_default.a.number]),
  style: external_prop_types_default.a.object,
  majorValue: external_prop_types_default.a.oneOfType([external_prop_types_default.a.string, external_prop_types_default.a.number]),
  majorValueField: external_prop_types_default.a.string,
  majorColor: external_prop_types_default.a.string,
  majorFontSize: external_prop_types_default.a.number,
  trendValue: external_prop_types_default.a.oneOfType([external_prop_types_default.a.string, external_prop_types_default.a.number]),
  trendColor: external_prop_types_default.a.string,
  trendFontSize: external_prop_types_default.a.number,
  trendDisplay: external_prop_types_default.a.string,
  trendIndicatorPosition: external_prop_types_default.a.oneOf(['standard', 'below', 'outside']),
  shouldAbbreviateTrendValue: external_prop_types_default.a.bool,
  backgroundColor: external_prop_types_default.a.string,
  unit: external_prop_types_default.a.string,
  unitPosition: external_prop_types_default.a.string,
  underLabel: external_prop_types_default.a.string,
  numberPrecision: external_prop_types_default.a.number,
  shouldUseThousandSeparators: external_prop_types_default.a.bool,
  radialBackgroundColor: external_prop_types_default.a.string,
  radialStrokeColor: external_prop_types_default.a.string,
  onValueClick: external_prop_types_default.a.func
};
SingleValueRadial_SingleValueRadial.defaultProps = {
  width: '100%',
  height: 250,
  majorValue: 'N/A',
  majorValueField: '',
  trendDisplay: 'absolute',
  trendIndicatorPosition: 'standard',
  shouldAbbreviateTrendValue: false,
  unitPosition: 'after',
  numberPrecision: 0,
  shouldUseThousandSeparators: true,
  onValueClick: function onValueClick() {}
};
/* harmony default export */ var components_SingleValueRadial = (Object(external_styled_components_["withTheme"])(SingleValueRadial_SingleValueRadial));
// EXTERNAL MODULE: ./src/utils/propUtils.js
var propUtils = __webpack_require__(20);

// CONCATENATED MODULE: ./src/visualizations/SingleValueRadial/SingleValueRadial.jsx



function SingleValueRadial_ownKeys(object, enumerableOnly) {
  var keys = Object.keys(object);

  if (Object.getOwnPropertySymbols) {
    var symbols = Object.getOwnPropertySymbols(object);
    if (enumerableOnly) symbols = symbols.filter(function (sym) {
      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
    });
    keys.push.apply(keys, symbols);
  }

  return keys;
}

function SingleValueRadial_objectSpread(target) {
  for (var i = 1; i < arguments.length; i++) {
    var source = arguments[i] != null ? arguments[i] : {};

    if (i % 2) {
      SingleValueRadial_ownKeys(Object(source), true).forEach(function (key) {
        defineProperty_default()(target, key, source[key]);
      });
    } else if (Object.getOwnPropertyDescriptors) {
      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
    } else {
      SingleValueRadial_ownKeys(Object(source)).forEach(function (key) {
        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
      });
    }
  }

  return target;
}





 // This propsMapping is for React SingleValue to use PureSingleValue.

var propsMapping = {
  value: 'majorValue',
  deltaValue: 'trendValue',
  deltaColor: 'trendColor',
  deltaFontSize: 'trendFontSize',
  useTrendUnits: 'shouldAbbreviateTrendValue',
  useThousandSeparators: 'shouldUseThousandSeparators'
};
var deprecatedProps = ['showTrendIndicator', 'trendDisplayMode'];

var SingleValueRadial_ReactSingleValueRadial = function ReactSingleValueRadial(_ref) {
  var props = extends_default()({}, _ref);

  var newProps = Object(propUtils["a" /* propsConvert */])(props, propsMapping); // change props

  var trendDisplay = newProps.showTrendIndicator ? newProps.trendDisplayMode : 'off';
  newProps = SingleValueRadial_objectSpread(SingleValueRadial_objectSpread({}, Object(propUtils["b" /* propsDeprecate */])(newProps, deprecatedProps)), {}, {
    trendDisplay: trendDisplay
  });
  return /*#__PURE__*/external_react_default.a.createElement(components_SingleValueRadial, newProps);
};

SingleValueRadial_ReactSingleValueRadial.propTypes = {
  width: external_prop_types_default.a.oneOfType([external_prop_types_default.a.string, external_prop_types_default.a.number]),
  height: external_prop_types_default.a.oneOfType([external_prop_types_default.a.string, external_prop_types_default.a.number]),
  style: external_prop_types_default.a.object,
  value: external_prop_types_default.a.oneOfType([external_prop_types_default.a.string, external_prop_types_default.a.number]),
  majorColor: external_prop_types_default.a.string,
  majorFontSize: external_prop_types_default.a.number,
  deltaValue: external_prop_types_default.a.oneOfType([external_prop_types_default.a.string, external_prop_types_default.a.number]),
  deltaColor: external_prop_types_default.a.string,
  deltaFontSize: external_prop_types_default.a.number,
  trendDisplayMode: external_prop_types_default.a.string,
  trendIndicatorPosition: external_prop_types_default.a.oneOf(['standard', 'below', 'outside']),
  useTrendUnits: external_prop_types_default.a.bool,
  showTrendIndicator: external_prop_types_default.a.bool,
  backgroundColor: external_prop_types_default.a.string,
  unit: external_prop_types_default.a.string,
  unitPosition: external_prop_types_default.a.string,
  underLabel: external_prop_types_default.a.string,
  numberPrecision: external_prop_types_default.a.number,
  useThousandSeparators: external_prop_types_default.a.bool,
  radialBackgroundColor: external_prop_types_default.a.string,
  radialStrokeColor: external_prop_types_default.a.string,
  onValueClick: external_prop_types_default.a.func
};
SingleValueRadial_ReactSingleValueRadial.defaultProps = {
  width: '100%',
  height: 250,
  trendDisplayMode: 'absolute',
  trendIndicatorPosition: 'standard',
  useTrendUnits: false,
  showTrendIndicator: true,
  unitPosition: 'after',
  numberPrecision: 0,
  useThousandSeparators: true,
  onValueClick: function onValueClick() {}
};
/* harmony default export */ var visualizations_SingleValueRadial_SingleValueRadial = __webpack_exports__["default"] = (Object(SanitizeProps_["withSanitizedProps"])(SingleValueRadial_ReactSingleValueRadial));

/***/ })
/******/ ]);
//# sourceMappingURL=SingleValueRadial.js.map