@splunk/visualizations 25.4.0 → 25.5.0

package/Markdown.js

@@ -87,7 +87,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 399);
+/******/ 	return __webpack_require__(__webpack_require__.s = 402);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -113,13 +113,6 @@ module.exports = require("@splunk/visualizations-shared/Message");
 
 /***/ }),
 
-/***/ 109:
-/***/ (function(module, exports) {
-
-module.exports = require("@splunk/react-ui/Markdown");
-
-/***/ }),
-
 /***/ 11:
 /***/ (function(module, exports) {
 
@@ -127,10 +120,10 @@ module.exports = require("@babel/runtime/helpers/classCallCheck");
 
 /***/ }),
 
-/***/ 114:
+/***/ 111:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-ui/Paragraph");
+module.exports = require("@splunk/react-ui/Markdown");
 
 /***/ }),
 
@@ -216,7 +209,7 @@ var withFixedSizeContainer = function withFixedSizeContainer(Viz) {
 
     return React.createElement(FixSizeItem, {
       "data-test": "fix-size-item",
-      "data-splunk-visualization-version": "25.4.0 - 6a8a433b8",
+      "data-splunk-visualization-version": "25.5.0 - 12c0447a7",
       width: width,
       height: height,
       backgroundColor: backgroundColor
@@ -271,7 +264,7 @@ exports.extendStaticWrapperProps = extendStaticWrapperProps;
 
 /***/ }),
 
-/***/ 143:
+/***/ 144:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -294,7 +287,7 @@ var React = __webpack_require__(1);
 
 var style_1 = __webpack_require__(15);
 
-var Markdown_1 = __webpack_require__(109);
+var Markdown_1 = __webpack_require__(111);
 
 var styled_components_1 = __webpack_require__(4);
 
@@ -302,17 +295,17 @@ var T = __webpack_require__(0);
 
 var themes_1 = __webpack_require__(69);
 
-var Heading_1 = __webpack_require__(400);
+var Heading_1 = __webpack_require__(403);
 
-var Paragraph_1 = __webpack_require__(114);
+var Paragraph_1 = __webpack_require__(95);
 
-var List_1 = __webpack_require__(401);
+var List_1 = __webpack_require__(404);
 
-var Code_1 = __webpack_require__(402);
+var Code_1 = __webpack_require__(405);
 
 var withDashboardViz_1 = __webpack_require__(32);
 
-var config_1 = __webpack_require__(403);
+var config_1 = __webpack_require__(406);
 
 exports.config = config_1.default; // map of valid font sizes with elements' respective pixel sizes
 
@@ -356,12 +349,14 @@ exports.FONT_SIZES = {
 var MarkdownContainer = styled_components_1.default.div.withConfig({
   displayName: "Markdown__MarkdownContainer",
   componentId: "zd3qkg-0"
-})(["overflow:auto;position:relative;box-sizing:border-box;", ";", ";background-color:", ";& *:not(code):not(pre):not(code *):not(a){color:", ";}", ";"], function (props) {
+})(["overflow:auto;position:relative;box-sizing:border-box;", ";", ";background-color:", ";transform-origin:center;transform:rotate(", "deg);& *:not(code):not(pre):not(code *):not(a){color:", ";}", ";"], function (props) {
   return style_1.toDimension(lodash_1.pick(props, ['width', 'height']));
 }, function (props) {
   return style_1.toPadding(props.padding);
 }, function (props) {
   return props.backgroundColor;
+}, function (props) {
+  return props.rotation || 0;
 }, function (props) {
   return props.fontColor;
 }, function (_ref) {
@@ -422,7 +417,7 @@ var StyledA = styled_components_1.default.a.withConfig({
   componentId: "zd3qkg-3"
 })(["text-decoration:underlined;"]); // returns renderers customized with the appropriate font sizes given the provided `fontSize` value.
 
-var getMarkdownRenderer = function getMarkdownRenderer(fontSize, customFontSize) {
+var getMarkdownRenderer = function getMarkdownRenderer(fontFamilyStyle, fontSize, customFontSize) {
   // defaults to customFontSize of 14px if value is invalid
   var cleanedCustomFontSize = types_1.isNumber(customFontSize) ? customFontSize : 14;
   var isCustomFontSize = fontSize === 'custom';
@@ -438,10 +433,10 @@ var getMarkdownRenderer = function getMarkdownRenderer(fontSize, customFontSize)
     paragraphRenderer: function paragraphRenderer(_ref2) {
       var children = _ref2.children;
       return React.createElement(Paragraph_1.default, {
-        style: {
+        style: Object.assign({
           fontSize: fontMap.p,
           lineHeight: "".concat(fontMap.p, "px")
-        }
+        }, fontFamilyStyle)
       }, children);
     },
     headingRenderer: function headingRenderer(_ref3) {
@@ -449,20 +444,20 @@ var getMarkdownRenderer = function getMarkdownRenderer(fontSize, customFontSize)
           level = _ref3.level;
       return React.createElement(Heading_1.default, {
         level: level,
-        style: {
+        style: Object.assign({
           fontSize: fontMap["h".concat(level)],
           lineHeight: "".concat(fontMap["h".concat(level)], "px")
-        }
+        }, fontFamilyStyle)
       }, children);
     },
     itemRenderer: function itemRenderer(_ref4) {
       var children = _ref4.children,
           nodeKey = _ref4.nodeKey;
       return React.createElement(List_1.default.Item, {
-        style: {
+        style: Object.assign({
           fontSize: fontMap.p,
           lineHeight: "".concat(fontMap.p, "px")
-        },
+        }, fontFamilyStyle),
         key: nodeKey
       }, children);
     },
@@ -503,21 +498,31 @@ var MarkdownVisualization = function MarkdownVisualization(_ref8) {
       markdown = _ref8.markdown,
       backgroundColor = _ref8.backgroundColor,
       fontColor = _ref8.fontColor,
+      fontFamily = _ref8.fontFamily,
       fontSize = _ref8.fontSize,
       customFontSize = _ref8.customFontSize,
+      rotation = _ref8.rotation,
       hasEventHandlers = _ref8.hasEventHandlers,
       onMarkdownClick = _ref8.onMarkdownClick;
 
-  var _a; // because DSL evaluation is not guaranteed to return string data if `markdown` is powered by DSL, we do a typecast here
+  var _a;
 
+  var _themes_1$useSplunkTh = themes_1.useSplunkTheme(),
+      defaultFontFamily = _themes_1$useSplunkTh.fontFamily; // font-family style for non-code content - default font family appended to custom option value as fallback
+
+
+  var markdownContentFontFamilyStyle = {
+    fontFamily: "".concat(fontFamily, ", ").concat(defaultFontFamily)
+  }; // because DSL evaluation is not guaranteed to return string data if `markdown` is powered by DSL, we do a typecast here
 
   var stringifiedMarkdown = "".concat(markdown);
-  var renderersForFontSize = getMarkdownRenderer(fontSize, customFontSize);
+  var renderersForFontSize = getMarkdownRenderer(markdownContentFontFamilyStyle, fontSize, customFontSize);
   return React.createElement(MarkdownContainer, {
-    "data-testid": "markdown-container",
+    "data-test": "markdown-container",
     padding: [5, 5, 5, 5],
     width: width,
     height: height,
+    rotation: rotation,
     backgroundColor: backgroundColor,
     fontColor: fontColor,
     startsWithHeader: (_a = stringifiedMarkdown.trim().match(/^#+/)) === null || _a === void 0 ? void 0 : _a[0].length
@@ -538,8 +543,10 @@ var propTypes = {
   markdown: T.string,
   backgroundColor: T.string,
   fontColor: T.string,
+  fontFamily: T.string,
   fontSize: T.string,
   customFontSize: T.number,
+  rotation: T.number,
   hasEventHandlers: T.bool,
   onMarkdownClick: T.func
 };
@@ -549,8 +556,10 @@ var defaultProps = {
   markdown: '',
   backgroundColor: 'transparent',
   fontColor: 'rgba(255, 255, 255, 0.7)',
+  fontFamily: 'Splunk Platform Sans',
   fontSize: 'default',
   customFontSize: 14,
+  rotation: 0,
   hasEventHandlers: false,
   onMarkdownClick: function onMarkdownClick() {}
 };
@@ -1608,49 +1617,6 @@ exports.validSortDirs = ['asc', 'desc', 'none'];
 
 /***/ }),
 
-/***/ 399:
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-var __createBinding = this && this.__createBinding || (Object.create ? function (o, m, k, k2) {
-  if (k2 === undefined) k2 = k;
-  Object.defineProperty(o, k2, {
-    enumerable: true,
-    get: function get() {
-      return m[k];
-    }
-  });
-} : function (o, m, k, k2) {
-  if (k2 === undefined) k2 = k;
-  o[k2] = m[k];
-});
-
-var __exportStar = this && this.__exportStar || function (m, exports) {
-  for (var p in m) {
-    if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-  }
-};
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-__exportStar(__webpack_require__(143), exports);
-
-var Markdown_1 = __webpack_require__(143);
-
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function get() {
-    return Markdown_1.default;
-  }
-});
-
-/***/ }),
-
 /***/ 4:
 /***/ (function(module, exports) {
 
@@ -1704,28 +1670,71 @@ exports.useDeepMemo = useDeepMemo;
 
 /***/ }),
 
-/***/ 400:
+/***/ 402:
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+var __createBinding = this && this.__createBinding || (Object.create ? function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  Object.defineProperty(o, k2, {
+    enumerable: true,
+    get: function get() {
+      return m[k];
+    }
+  });
+} : function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  o[k2] = m[k];
+});
+
+var __exportStar = this && this.__exportStar || function (m, exports) {
+  for (var p in m) {
+    if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+  }
+};
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+__exportStar(__webpack_require__(144), exports);
+
+var Markdown_1 = __webpack_require__(144);
+
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return Markdown_1.default;
+  }
+});
+
+/***/ }),
+
+/***/ 403:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/Heading");
 
 /***/ }),
 
-/***/ 401:
+/***/ 404:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/List");
 
 /***/ }),
 
-/***/ 402:
+/***/ 405:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/Code");
 
 /***/ }),
 
-/***/ 403:
+/***/ 406:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -1749,7 +1758,7 @@ var VizCategory_1 = __webpack_require__(31);
 
 var configUtils_1 = __webpack_require__(17);
 
-var BackgroundColor_1 = __webpack_require__(50);
+var BackgroundColor_1 = __webpack_require__(49);
 
 var FONT_OPTIONS = new Set(['extraSmall', 'small', 'default', 'large', 'extraLarge']);
 var dataContract = {
@@ -1790,6 +1799,11 @@ var optionsSchema = {
     default: '> themes.defaultFontColor',
     pattern: schemaUtils_1.COLOR_OR_TOKEN_PATTERN_WITH_RGBA
   },
+  fontFamily: {
+    default: 'Splunk Platform Sans',
+    description: 'Specify the font family you would like to use for markdown content, such as "Comic Sans MS". Note: the font needs to be available to your end user.',
+    type: 'string'
+  },
   fontSize: {
     description: 'Specify the font size you would like to use for markdown content. Font sizes range from extra small (10px for unformatted text) to extra large (18px for unformatted text) with the default being 14px for unformatted text.',
     type: 'string',
@@ -1799,6 +1813,11 @@ var optionsSchema = {
   markdown: {
     description: 'Add text using basic markdown syntax.',
     type: 'string'
+  },
+  rotation: {
+    description: 'Specify the angle of rotation of the markdown content in degrees.',
+    type: 'number',
+    default: 0
   }
 };
 var themes = {
@@ -1813,17 +1832,9 @@ var themes = {
   }
 };
 var editorConfig = [{
-  label: i18n_1._('Markdown Settings'),
-  open: true,
+  label: i18n_1._('Color and style'),
   layout: [[{
-    label: '',
-    option: 'markdown',
-    editor: 'editor.markdown'
-  }]]
-}, {
-  label: i18n_1._('General'),
-  layout: [[{
-    label: i18n_1._('Font Color'),
+    label: i18n_1._('Font'),
     option: 'fontColor',
     editor: 'editor.color',
     editorProps: {
@@ -1831,10 +1842,31 @@ var editorConfig = [{
       themes: themes
     }
   }].concat(_toConsumableArray(BackgroundColor_1.default({
-    label: 'Background Color',
+    label: 'Background',
     themes: themes
   }))), [{
-    label: i18n_1._('Font Size'),
+    label: i18n_1._('Font family'),
+    option: 'fontFamily',
+    editor: 'editor.select',
+    editorProps: {
+      values: [{
+        value: 'Splunk Platform Sans'
+      }, {
+        value: 'Splunk Data Sans'
+      }, {
+        value: 'Splunk Platform Mono'
+      }, {
+        value: 'Arial'
+      }, {
+        value: 'Helvetica'
+      }, {
+        value: 'Times New Roman'
+      }, {
+        value: 'Comic Sans MS'
+      }]
+    }
+  }], [{
+    label: i18n_1._('Font size'),
     option: 'fontSize',
     editor: 'editor.select',
     editorProps: {
@@ -1859,7 +1891,7 @@ var editorConfig = [{
       }]
     }
   }, {
-    label: i18n_1._('Custom Font Size (px)'),
+    label: i18n_1._('Custom font size (px)'),
     option: 'customFontSize',
     editor: 'editor.number',
     editorProps: {
@@ -1870,6 +1902,22 @@ var editorConfig = [{
       var options = _ref.options;
       return options.fontSize && !FONT_OPTIONS.has(options.fontSize);
     }
+  }], [{
+    label: i18n_1._('Rotation (degrees)'),
+    option: 'rotation',
+    editor: 'editor.number',
+    editorProps: {
+      min: -360,
+      max: 360
+    }
+  }]]
+}, {
+  label: i18n_1._('Markdown content'),
+  open: true,
+  layout: [[{
+    label: '',
+    option: 'markdown',
+    editor: 'editor.markdown'
   }]]
 }];
 /**
@@ -2011,7 +2059,7 @@ var Cover = styled_components_1.default.div.withConfig({
   componentId: "sc-1gsbnxb-0"
 })(["position:absolute;left:0;right:0;top:0;bottom:0;"]);
 var Blocker = styled_components_1.default.div.attrs({
-  'data-splunk-visualization-version': "25.4.0 - 6a8a433b8"
+  'data-splunk-visualization-version': "25.5.0 - 12c0447a7"
 }).withConfig({
   displayName: "withEditModeCover__Blocker",
   componentId: "sc-1gsbnxb-1"
@@ -2108,7 +2156,7 @@ exports.default = withPlaceholder;
 
 /***/ }),
 
-/***/ 50:
+/***/ 49:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -2217,6 +2265,13 @@ module.exports = require("@babel/runtime/helpers/taggedTemplateLiteral");
 
 module.exports = require("@splunk/themes/variables");
 
+/***/ }),
+
+/***/ 95:
+/***/ (function(module, exports) {
+
+module.exports = require("@splunk/react-ui/Paragraph");
+
 /***/ })
 
 /******/ });