azure-boards-ui 2.264.2 → 2.266.0

package/Common/ColorUtilities.js

@@ -1,15 +1,13 @@
-export var COLOR_TRANSPARENT = "transparent";
-export var COLOR_WHITE = "ffffff";
-var hexColorMatcher = /^[0-9a-fA-F]+$/;
+export const COLOR_TRANSPARENT = "transparent";
+export const COLOR_WHITE = "ffffff";
+const hexColorMatcher = /^[0-9a-fA-F]+$/;
 /**
  * Parse color to format #aabbcc
  * @param rawColor Raw string for color
  * @param defaultColor will be changed to default one if rawColor is not fulfilled
  * @param alphaRequired Color has alpha and don't need to remove it in result
  */
-export function parseColor(rawColor, alphaRequired, defaultColor) {
-    if (alphaRequired === void 0) { alphaRequired = false; }
-    if (defaultColor === void 0) { defaultColor = COLOR_WHITE; }
+export function parseColor(rawColor, alphaRequired = false, defaultColor = COLOR_WHITE) {
     if (!rawColor) {
         rawColor = defaultColor;
     }
@@ -30,7 +28,7 @@ export function parseColor(rawColor, alphaRequired, defaultColor) {
         }
         else {
             // remove transparency
-            rawColor = "#".concat(rawColor.substring(rawColor.length - 6));
+            rawColor = `#${rawColor.substring(rawColor.length - 6)}`;
         }
     }
     return rawColor;

package/Common/ColorUtilities.min.js

@@ -1 +1 @@
-var COLOR_TRANSPARENT="transparent",COLOR_WHITE="ffffff",hexColorMatcher=/^[0-9a-fA-F]+$/;function parseColor(r,t,e){return void 0===t&&(t=!1),void 0===e&&(e=COLOR_WHITE),r=8===(r=3!==(r="undefined"===(r="#"===(r=r||e)[0]?r.substring(1):r)?e:r).length&&4!==r.length&&6!==r.length||!hexColorMatcher.test(r)?r:"#"+r).length&&hexColorMatcher.test(r)?t?"#"+r:"#".concat(r.substring(r.length-6)):r}function hexToRgb(r){if(7!==r.length||"#"!==r[0])throw new Error("Expected color in format #aabbcc");return[parseInt(r.substr(1,2),16),parseInt(r.substr(3,2),16),parseInt(r.substr(5,2),16)]}export{COLOR_TRANSPARENT,COLOR_WHITE,parseColor,hexToRgb};
+const COLOR_TRANSPARENT="transparent",COLOR_WHITE="ffffff",hexColorMatcher=/^[0-9a-fA-F]+$/;function parseColor(t,r=!1,e=COLOR_WHITE){return t=8===(t=3!==(t="undefined"===(t="#"===(t=t||e)[0]?t.substring(1):t)?e:t).length&&4!==t.length&&6!==t.length||!hexColorMatcher.test(t)?t:"#"+t).length&&hexColorMatcher.test(t)?r?"#"+t:"#"+t.substring(t.length-6):t}function hexToRgb(t){if(7!==t.length||"#"!==t[0])throw new Error("Expected color in format #aabbcc");return[parseInt(t.substr(1,2),16),parseInt(t.substr(3,2),16),parseInt(t.substr(5,2),16)]}export{COLOR_TRANSPARENT,COLOR_WHITE,parseColor,hexToRgb};

package/Components/WorkItemState/WorkItemState.js

@@ -1,4 +1,3 @@
-import { __assign } from "tslib";
 import "azure-devops-ui/CommonImports";
 import "azure-devops-ui/Core/core.css";
 import "./WorkItemState.css";
@@ -8,29 +7,29 @@ import { Observer } from "azure-devops-ui/Observer";
 import { Tooltip } from "azure-devops-ui/TooltipEx";
 import { css } from "azure-devops-ui/Util";
 import { COLOR_TRANSPARENT, COLOR_WHITE, hexToRgb, parseColor } from "../../Common/ColorUtilities";
-var DefaultWorkItemStateColor = "5688E0";
+const DefaultWorkItemStateColor = "5688E0";
 /**
  * Component to display work item state value with the state color.
  */
-export var WorkItemState = function (props) {
-    var data = props.data, className = props.className, hideText = props.hideText;
+export const WorkItemState = (props) => {
+    const { data, className, hideText } = props;
     if (!data) {
         // Render nothing if state and color data is not passed.
         return null;
     }
-    var tooltipHostId = getId("work-item-state-color-tooltip");
-    return (React.createElement(Observer, { data: data }, function (props) {
-        var stateName = props.data.name;
-        var fill = props.data.fill || DefaultWorkItemStateColor;
-        var fillColor = parseColor(fill);
-        var borderColor = getBorderColor(fill);
+    const tooltipHostId = getId("work-item-state-color-tooltip");
+    return (React.createElement(Observer, { data: data }, (props) => {
+        const stateName = props.data.name;
+        const fill = props.data.fill || DefaultWorkItemStateColor;
+        const fillColor = parseColor(fill);
+        const borderColor = getBorderColor(fill);
         // when state name is hidden, we need aria information on the circle
-        var stateCircleAriaProps = hideText
+        const stateCircleAriaProps = hideText
             ? {
                 "aria-label": stateName
             }
             : undefined;
-        var stateCircle = (React.createElement("div", __assign({ className: css("work-item-state-circle", !hideText && "withText"), style: { backgroundColor: fillColor, borderColor: borderColor } }, stateCircleAriaProps)));
+        const stateCircle = (React.createElement("div", Object.assign({ className: css("work-item-state-circle", !hideText && "withText"), style: { backgroundColor: fillColor, borderColor: borderColor } }, stateCircleAriaProps)));
         return (React.createElement("div", { className: css("wit-ui-control work-item-state", className) },
             hideText ? (React.createElement(Tooltip, { id: tooltipHostId, text: stateName, addAriaDescribedBy: true }, stateCircle)) : (stateCircle),
             !hideText && (React.createElement(Tooltip, { id: tooltipHostId, overflowOnly: true, text: stateName },
@@ -39,16 +38,16 @@ export var WorkItemState = function (props) {
     }));
 };
 function getBorderColor(stateFillColor) {
-    var border = stateFillColor === COLOR_WHITE || stateFillColor === COLOR_TRANSPARENT ? DefaultWorkItemStateColor : stateFillColor;
+    const border = stateFillColor === COLOR_WHITE || stateFillColor === COLOR_TRANSPARENT ? DefaultWorkItemStateColor : stateFillColor;
     return parseStateBorderColor(border);
 }
 function parseStateBorderColor(rawColor) {
     if (rawColor.startsWith("var(")) {
-        return "rgba(".concat(rawColor, ", 0.3)");
+        return `rgba(${rawColor}, 0.3)`;
     }
     else {
-        var borderColorHex = parseColor(rawColor);
-        var borderColorRGB = hexToRgb(borderColorHex);
-        return "rgba(".concat(borderColorRGB[0], ", ").concat(borderColorRGB[1], ", ").concat(borderColorRGB[2], ", 0.3)");
+        const borderColorHex = parseColor(rawColor);
+        const borderColorRGB = hexToRgb(borderColorHex);
+        return `rgba(${borderColorRGB[0]}, ${borderColorRGB[1]}, ${borderColorRGB[2]}, 0.3)`;
     }
 }

package/Components/WorkItemState/WorkItemState.min.js

@@ -1 +1 @@
-import{__assign}from"tslib";import"azure-devops-ui/CommonImports";import"azure-devops-ui/Core/core.css";import"./WorkItemState.css";import*as React from"react";import{getId}from"azure-devops-ui/Core/Util/Object";import{Observer}from"azure-devops-ui/Observer";import{Tooltip}from"azure-devops-ui/TooltipEx";import{css}from"azure-devops-ui/Util";import{COLOR_TRANSPARENT,COLOR_WHITE,hexToRgb,parseColor}from"../../Common/ColorUtilities";var DefaultWorkItemStateColor="5688E0",WorkItemState=function(e){var a,t=e.data,i=e.className,l=e.hideText;return t?(a=getId("work-item-state-color-tooltip"),React.createElement(Observer,{data:t},function(e){var t=e.data.name,e=e.data.fill||DefaultWorkItemStateColor,r=parseColor(e),e=getBorderColor(e),o=l?{"aria-label":t}:void 0,r=React.createElement("div",__assign({className:css("work-item-state-circle",!l&&"withText"),style:{backgroundColor:r,borderColor:e}},o));return React.createElement("div",{className:css("wit-ui-control work-item-state",i)},l?React.createElement(Tooltip,{id:a,text:t,addAriaDescribedBy:!0},r):r,!l&&React.createElement(Tooltip,{id:a,overflowOnly:!0,text:t},React.createElement("div",{className:"work-item-state-name"},React.createElement("span",null,t))))})):null};function getBorderColor(e){return parseStateBorderColor(e===COLOR_WHITE||e===COLOR_TRANSPARENT?DefaultWorkItemStateColor:e)}function parseStateBorderColor(e){return e.startsWith("var(")?"rgba(".concat(e,", 0.3)"):(e=parseColor(e),e=hexToRgb(e),"rgba(".concat(e[0],", ").concat(e[1],", ").concat(e[2],", 0.3)"))}export{WorkItemState};
+import"azure-devops-ui/CommonImports";import"azure-devops-ui/Core/core.css";import"./WorkItemState.css";import*as React from"react";import{getId}from"azure-devops-ui/Core/Util/Object";import{Observer}from"azure-devops-ui/Observer";import{Tooltip}from"azure-devops-ui/TooltipEx";import{css}from"azure-devops-ui/Util";import{COLOR_TRANSPARENT,COLOR_WHITE,hexToRgb,parseColor}from"../../Common/ColorUtilities";const DefaultWorkItemStateColor="5688E0",WorkItemState=e=>{const{data:t,className:a,hideText:i}=e;if(!t)return null;const l=getId("work-item-state-color-tooltip");return React.createElement(Observer,{data:t},e=>{var t=e.data.name,e=e.data.fill||DefaultWorkItemStateColor,r=parseColor(e),e=getBorderColor(e),o=i?{"aria-label":t}:void 0,r=React.createElement("div",Object.assign({className:css("work-item-state-circle",!i&&"withText"),style:{backgroundColor:r,borderColor:e}},o));return React.createElement("div",{className:css("wit-ui-control work-item-state",a)},i?React.createElement(Tooltip,{id:l,text:t,addAriaDescribedBy:!0},r):r,!i&&React.createElement(Tooltip,{id:l,overflowOnly:!0,text:t},React.createElement("div",{className:"work-item-state-name"},React.createElement("span",null,t))))})};function getBorderColor(e){return parseStateBorderColor(e===COLOR_WHITE||e===COLOR_TRANSPARENT?DefaultWorkItemStateColor:e)}function parseStateBorderColor(e){return e.startsWith("var(")?`rgba(${e}, 0.3)`:(e=parseColor(e),`rgba(${(e=hexToRgb(e))[0]}, ${e[1]}, ${e[2]}, 0.3)`)}export{WorkItemState};

package/Components/WorkItemTypeIcon/Constants.js

@@ -1,4 +1,4 @@
-export var DEFAULT_WORKITEMTYPE_COLOR_AND_ICON = {
+export const DEFAULT_WORKITEMTYPE_COLOR_AND_ICON = {
     color: "__default__",
     icon: "__default__",
     workItemTypeName: "",

package/Components/WorkItemTypeIcon/Constants.min.js

@@ -1 +1 @@
-var DEFAULT_WORKITEMTYPE_COLOR_AND_ICON={color:"__default__",icon:"__default__",workItemTypeName:"",isDisabled:!1};export{DEFAULT_WORKITEMTYPE_COLOR_AND_ICON};
+const DEFAULT_WORKITEMTYPE_COLOR_AND_ICON={color:"__default__",icon:"__default__",workItemTypeName:"",isDisabled:!1};export{DEFAULT_WORKITEMTYPE_COLOR_AND_ICON};

package/Components/WorkItemTypeIcon/WorkItemTypeIcon.js

@@ -1,4 +1,3 @@
-import { __assign } from "tslib";
 import "azure-devops-ui/CommonImports";
 import "azure-devops-ui/Core/core.css";
 import "./WorkItemTypeIcon.css";
@@ -12,23 +11,22 @@ import { TypeIconSize } from "./WorkItemTypeIcon.Props";
 /**
  * Display an icon for a work item type.
  */
-export var WorkItemTypeIcon = function (props) {
-    return (React.createElement(Observer, { data: props.data }, function (_a) {
-        var data = _a.data;
-        return React.createElement(Icon, __assign({}, getWorkItemTypeIconProps(__assign(__assign({}, props), { data: data }))));
+export const WorkItemTypeIcon = (props) => {
+    return (React.createElement(Observer, { data: props.data }, ({ data }) => {
+        return React.createElement(Icon, Object.assign({}, getWorkItemTypeIconProps(Object.assign(Object.assign({}, props), { data }))));
     }));
 };
 /**
  * Gets the IIconProps to pass to <Icon> to show a WorkItemTypeIcon
  */
 export function getWorkItemTypeIconProps(props) {
-    var data = props.data, className = props.className, size = props.size, suppressAriaLabel = props.suppressAriaLabel, suppressTooltip = props.suppressTooltip;
-    var showDefault = !data || data.icon === "__default__" || data.color === "__default__";
-    var iconClassName = data && ICONNAME_TO_CLASSNAME_MAPPINGS[data.icon];
-    var iconName = showDefault || !iconClassName ? "ClipboardSolid" : "bowtie-icon bowtie-".concat(iconClassName);
-    var iconColor = (!showDefault && parseColor(data.color)) || undefined;
-    var workItemTypeName = (data && data.workItemTypeName) || "";
-    var tooltipHostId = getId("work-item-type-icon-tooltip");
+    const { data, className, size, suppressAriaLabel, suppressTooltip } = props;
+    const showDefault = !data || data.icon === "__default__" || data.color === "__default__";
+    const iconClassName = data && ICONNAME_TO_CLASSNAME_MAPPINGS[data.icon];
+    const iconName = showDefault || !iconClassName ? "ClipboardSolid" : `bowtie-icon bowtie-${iconClassName}`;
+    const iconColor = (!showDefault && parseColor(data.color)) || undefined;
+    const workItemTypeName = (data && data.workItemTypeName) || "";
+    const tooltipHostId = getId("work-item-type-icon-tooltip");
     return {
         iconName: showDefault || !iconClassName ? iconName : undefined,
         className: css("work-item-type-icon", className, getSizeCssClass(size), showDefault ? "default" : iconName),
@@ -57,7 +55,7 @@ function getSizeCssClass(size) {
             return "normal";
     }
 }
-var ICONNAME_TO_CLASSNAME_MAPPINGS = {
+const ICONNAME_TO_CLASSNAME_MAPPINGS = {
     icon_crown: "symbol-crown",
     icon_trophy: "symbol-trophy",
     icon_list: "symbol-list",

package/Components/WorkItemTypeIcon/WorkItemTypeIcon.min.js

@@ -1 +1 @@
-import{__assign}from"tslib";import"azure-devops-ui/CommonImports";import"azure-devops-ui/Core/core.css";import"./WorkItemTypeIcon.css";import*as React from"react";import{getId}from"azure-devops-ui/Core/Util/Object";import{Icon}from"azure-devops-ui/Icon";import{Observer}from"azure-devops-ui/Observer";import{css}from"azure-devops-ui/Util";import{parseColor}from"../../Common/ColorUtilities";import{TypeIconSize}from"./WorkItemTypeIcon.Props";var WorkItemTypeIcon=function(e){return React.createElement(Observer,{data:e.data},function(o){o=o.data;return React.createElement(Icon,__assign({},getWorkItemTypeIconProps(__assign(__assign({},e),{data:o}))))})};function getWorkItemTypeIconProps(o){var e=o.data,s=o.className,t=o.size,i=o.suppressAriaLabel,r=o.suppressTooltip,n=!e||"__default__"===e.icon||"__default__"===e.color,a=e&&ICONNAME_TO_CLASSNAME_MAPPINGS[e.icon],c=n||!a?"ClipboardSolid":"bowtie-icon bowtie-".concat(a),l=!n&&parseColor(e.color)||void 0,e=e&&e.workItemTypeName||"",m=getId("work-item-type-icon-tooltip");return{iconName:n||!a?c:void 0,className:css("work-item-type-icon",s,getSizeCssClass(t),n?"default":c),ariaDescribedBy:m,ariaLabel:i?void 0:e,style:{color:l},tooltipProps:r?void 0:{id:m,text:e},wrapperClass:o.iconWrapperClass}}function getSizeCssClass(o){switch(o){case TypeIconSize.small:return"small";case TypeIconSize.large:return"large";default:TypeIconSize.normal;return"normal"}}var ICONNAME_TO_CLASSNAME_MAPPINGS={icon_crown:"symbol-crown",icon_trophy:"symbol-trophy",icon_list:"symbol-list",icon_book:"symbol-book",icon_sticky_note:"symbol-stickynote",icon_clipboard:"symbol-task",icon_insect:"symbol-bug",icon_traffic_cone:"symbol-impediment",icon_chat_bubble:"symbol-review",icon_flame:"symbol-flame",icon_megaphone:"symbol-ask",icon_test_plan:"test-plan",icon_test_suite:"test-suite",icon_test_case:"test-case",icon_test_step:"test-step",icon_test_parameter:"test-parameter",icon_code_review:"symbol-review-request",icon_code_response:"symbol-review-response",icon_review:"symbol-feedback-request",icon_response:"symbol-feedback-response",icon_ribbon:"symbol-ribbon",icon_chart:"symbol-finance",icon_headphone:"symbol-headphone",icon_key:"symbol-key",icon_airplane:"symbol-airplane",icon_car:"symbol-car",icon_diamond:"symbol-diamond",icon_asterisk:"symbol-asterisk",icon_database_storage:"symbol-storage-database",icon_government:"symbol-government",icon_gavel:"symbol-decision",icon_parachute:"symbol-parachute",icon_paint_brush:"symbol-paint-brush",icon_palette:"symbol-color-palette",icon_gear:"settings-gear",icon_check_box:"status-success-box",icon_gift:"package-fill",icon_test_beaker:"test-fill",icon_broken_lightbulb:"symbol-defect",icon_clipboard_issue:"symbol-issue",icon_github:"brand-github",icon_pull_request:"tfvc-pull-request",icon_github_issue:"status-error-outline"};export{WorkItemTypeIcon,getWorkItemTypeIconProps};
+import"azure-devops-ui/CommonImports";import"azure-devops-ui/Core/core.css";import"./WorkItemTypeIcon.css";import*as React from"react";import{getId}from"azure-devops-ui/Core/Util/Object";import{Icon}from"azure-devops-ui/Icon";import{Observer}from"azure-devops-ui/Observer";import{css}from"azure-devops-ui/Util";import{parseColor}from"../../Common/ColorUtilities";import{TypeIconSize}from"./WorkItemTypeIcon.Props";const WorkItemTypeIcon=o=>React.createElement(Observer,{data:o.data},({data:e})=>React.createElement(Icon,Object.assign({},getWorkItemTypeIconProps(Object.assign(Object.assign({},o),{data:e})))));function getWorkItemTypeIconProps(e){var{data:o,className:s,size:t,suppressAriaLabel:i,suppressTooltip:r}=e,c=!o||"__default__"===o.icon||"__default__"===o.color,a=o&&ICONNAME_TO_CLASSNAME_MAPPINGS[o.icon],n=c||!a?"ClipboardSolid":"bowtie-icon bowtie-"+a,l=!c&&parseColor(o.color)||void 0,o=o&&o.workItemTypeName||"",m=getId("work-item-type-icon-tooltip");return{iconName:c||!a?n:void 0,className:css("work-item-type-icon",s,getSizeCssClass(t),c?"default":n),ariaDescribedBy:m,ariaLabel:i?void 0:o,style:{color:l},tooltipProps:r?void 0:{id:m,text:o},wrapperClass:e.iconWrapperClass}}function getSizeCssClass(e){switch(e){case TypeIconSize.small:return"small";case TypeIconSize.large:return"large";default:TypeIconSize.normal;return"normal"}}const ICONNAME_TO_CLASSNAME_MAPPINGS={icon_crown:"symbol-crown",icon_trophy:"symbol-trophy",icon_list:"symbol-list",icon_book:"symbol-book",icon_sticky_note:"symbol-stickynote",icon_clipboard:"symbol-task",icon_insect:"symbol-bug",icon_traffic_cone:"symbol-impediment",icon_chat_bubble:"symbol-review",icon_flame:"symbol-flame",icon_megaphone:"symbol-ask",icon_test_plan:"test-plan",icon_test_suite:"test-suite",icon_test_case:"test-case",icon_test_step:"test-step",icon_test_parameter:"test-parameter",icon_code_review:"symbol-review-request",icon_code_response:"symbol-review-response",icon_review:"symbol-feedback-request",icon_response:"symbol-feedback-response",icon_ribbon:"symbol-ribbon",icon_chart:"symbol-finance",icon_headphone:"symbol-headphone",icon_key:"symbol-key",icon_airplane:"symbol-airplane",icon_car:"symbol-car",icon_diamond:"symbol-diamond",icon_asterisk:"symbol-asterisk",icon_database_storage:"symbol-storage-database",icon_government:"symbol-government",icon_gavel:"symbol-decision",icon_parachute:"symbol-parachute",icon_paint_brush:"symbol-paint-brush",icon_palette:"symbol-color-palette",icon_gear:"settings-gear",icon_check_box:"status-success-box",icon_gift:"package-fill",icon_test_beaker:"test-fill",icon_broken_lightbulb:"symbol-defect",icon_clipboard_issue:"symbol-issue",icon_github:"brand-github",icon_pull_request:"tfvc-pull-request",icon_github_issue:"status-error-outline"};export{WorkItemTypeIcon,getWorkItemTypeIconProps};

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "azure-boards-ui",
-    "version": "2.264.2",
+    "version": "2.266.0",
     "description": "React components for building web UI in Azure Boards",
     "author": "Microsoft Corporation",
     "license": "MIT",
@@ -10,7 +10,7 @@
     },
     "homepage": "https://developer.microsoft.com/azure-devops",
     "dependencies": {
-        "azure-devops-ui": "2.264.2",
+        "azure-devops-ui": "2.266.0",
         "tslib": "~2.6.2"
     },
     "peerDependencies": {