@devops-flow/devops-flow-pipeline-detail 0.0.37

package/es/components/common/teambition/pipeline-instance-new/source.js

@@ -0,0 +1,376 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import { Button, Message } from '@teamix/ui';
+import { Title, TextTooltip, YunxiaoIcon } from '@alife/devops-ui';
+import copy from 'copy-to-clipboard';
+import IconFont from "../icon-font";
+import Image from "../icon-image";
+import { sourceIconMap, getSourceToolIcon } from "../pipeline-flow-orchestrator/utils";
+import intl from "../../../../locale";
+import getUrlWithContextPath from "../../../../utils/contextPathUtil";
+import { ARTIFACT_SOURCE, getCategoryFromType } from "../pipeline-source/util";
+import { getFeatures } from "../../../../utils/features";
+import { JsonParseWithCatch } from "../../../../utils";
+import { CODEUP_ROOT_PATH } from "../../../../utils/codeupRootPath";
+import { ArtifactSourceTypes } from "../pipeline-source/artifact-source";
+var decode = function decode(text) {
+  return decodeURIComponent(text);
+};
+var title = function title(trigger, text) {
+  return /*#__PURE__*/React.createElement(Title, {
+    align: "t",
+    trigger: trigger
+  }, text || trigger);
+};
+var FLOW_VERSION_MAP = {
+  lastSuccessBuild: intl.get({
+    id: 'rdc-tb-cd-assets.teambition.pipeline-instance.source.LastSuccessfulExecution',
+    defaultMessage: '最后一次成功执行'
+  })
+};
+var flowVersion = function flowVersion(trigger) {
+  var text = isNaN(trigger) ? "" + (FLOW_VERSION_MAP[trigger] || trigger) : "#" + trigger;
+  return /*#__PURE__*/React.createElement(Title, {
+    align: "t",
+    trigger: "" + text
+  }, text);
+};
+var onClickTipExtraBtn = function onClickTipExtraBtn(tip) {
+  copy(tip);
+  Message.success({
+    title: intl.get({
+      id: 'rdc-tb-cd-assets.teambition.pipeline-instance-new.source.SuccessfullyCopiedToTheClipboard',
+      defaultMessage: '成功复制到剪贴板'
+    })
+  });
+};
+var CommonGitSource = function CommonGitSource(_ref) {
+  var item = _ref.item,
+    onReleaseInfo = _ref.onReleaseInfo;
+  var data = item.data,
+    name = item.name,
+    type = item.type;
+  var _data$repo = data.repo,
+    repo = _data$repo === void 0 ? '' : _data$repo,
+    branch = data.branch,
+    commitMsg = data.commitMsg,
+    isBranchMode = data.isBranchMode,
+    af = data.aoneFlow;
+  var _JsonParseWithCatch = JsonParseWithCatch(commitMsg, [{}]),
+    commit = _JsonParseWithCatch[0];
+  var repoMatch = repo.match(/([^:/]+\/[^:/]+)\.git$/) || [];
+  var _commitMsg = decode(commit.commitMsg || '');
+  var aoneFlow = JSON.parse(af || '{}');
+  var onOpenCommit = function onOpenCommit(c_repo, c_branch, commitId) {
+    var open = function open(reg) {
+      var url;
+      if (type === 'codeup' && c_repo.startsWith('ssh://git@')) {
+        // 如果是 codeup ，yaml 流水线配了 ssh 链接, 转化为 web 地址前缀
+        url = c_repo.replace('ssh://', '').replace(reg, CODEUP_ROOT_PATH + "/$2").replace(/\.git$/, '');
+      } else {
+        url = c_repo.replace(reg, 'http://$1/$2').replace(/\.git$/, '');
+      }
+      if (commitId) {
+        return window.open(url + "/" + (url.includes('bitbucket.org') ? 'commits' : 'commit') + "/" + encodeURIComponent(commitId));
+      }
+      if (c_branch) {
+        var mrRequestBranch = new RegExp('^refs/merge-requests/[0-9]*/head$');
+        if (mrRequestBranch.test(c_branch)) {
+          var requestId = c_branch.replace('refs/merge-requests/', '').replace('/head', '');
+          return window.open(url + "/merge_request/" + encodeURIComponent(requestId));
+        }
+        return window.open(url + "/tree/" + encodeURIComponent(c_branch));
+      }
+      return window.open(url);
+    };
+
+    // 兼容使用户自定义的group
+    try {
+      open(/^git@([^/]+)[:/](.+)\.git/);
+    } catch (err) {
+      open(/^git@([^:]+):([^:]+)\.git/);
+    }
+  };
+  var _onReleaseInfo = function _onReleaseInfo(e) {
+    e.stopPropagation();
+    var params = _extends({
+      repo: repo,
+      branch: branch,
+      commitId: (commit || {}).commitId
+    }, aoneFlow);
+    onReleaseInfo && onReleaseInfo(params);
+  };
+  return /*#__PURE__*/React.createElement("ul", {
+    key: name,
+    className: "source",
+    onClick: function onClick() {
+      return branch !== '--' && onOpenCommit(repo, branch, (commit || {}).commitId);
+    }
+  }, /*#__PURE__*/React.createElement("li", {
+    className: "source-item"
+  }, /*#__PURE__*/React.createElement(Image, {
+    type: sourceIconMap[type] ? sourceIconMap[type] : sourceIconMap.aliyunGit
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "source-item-text"
+  }, /*#__PURE__*/React.createElement(TextTooltip, {
+    text: repoMatch[1] || '' || repo,
+    tip: repo,
+    length: 12,
+    needTipExtraBtn: true,
+    onClickTipExtraBtn: onClickTipExtraBtn,
+    needTipStopPropagation: true
+  }))), /*#__PURE__*/React.createElement("li", {
+    className: "secondary"
+  }, getSourceToolIcon(type), /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(TextTooltip, {
+    text: branch,
+    length: 18,
+    needTipExtraBtn: true,
+    onClickTipExtraBtn: onClickTipExtraBtn,
+    needTipStopPropagation: true,
+    alwaysShowTip: true
+  }))), /*#__PURE__*/React.createElement("li", {
+    className: "secondary"
+  }, /*#__PURE__*/React.createElement(IconFont, {
+    type: "commit-line"
+  }), /*#__PURE__*/React.createElement("span", null, commit.commitId ? /*#__PURE__*/React.createElement(TextTooltip, {
+    text: commit.commitId.substring(0, 8),
+    tip: commit.commitId,
+    length: 14,
+    needTipExtraBtn: true,
+    onClickTipExtraBtn: onClickTipExtraBtn,
+    needTipStopPropagation: true,
+    alwaysShowTip: true,
+    align: "bl"
+  }) : '--')), !isBranchMode && /*#__PURE__*/React.createElement("li", {
+    className: "secondary"
+  }, /*#__PURE__*/React.createElement(IconFont, {
+    type: "log-line"
+  }), /*#__PURE__*/React.createElement("span", null, _commitMsg ? title(_commitMsg) : '--')), isBranchMode && /*#__PURE__*/React.createElement("li", {
+    className: "secondary"
+  }, /*#__PURE__*/React.createElement(IconFont, {
+    type: "department-line",
+    style: {
+      transform: 'rotateX(180deg)'
+    }
+  }), /*#__PURE__*/React.createElement(Button, {
+    text: true,
+    type: "primary",
+    onClick: _onReleaseInfo
+  }, intl.get({
+    id: 'rdc-tb-cd-assets.teambition.pipeline-instance.source.BranchDetails',
+    defaultMessage: '分支详情'
+  }))));
+};
+var SvnSource = function SvnSource(_ref2) {
+  var item = _ref2.item,
+    type = _ref2.type;
+  var _item$data = item.data,
+    _item$data$repo = _item$data.repo,
+    repo = _item$data$repo === void 0 ? '' : _item$data$repo,
+    branch = _item$data.branch,
+    commitMsg = _item$data.commitMsg;
+  var _JsonParseWithCatch2 = JsonParseWithCatch(commitMsg, [{}]),
+    commit = _JsonParseWithCatch2[0];
+  var _commitMsg = decode(commit.commitMsg || '');
+  var url = repo.replace(/^svn/, 'http') + "/" + branch;
+  return /*#__PURE__*/React.createElement("ul", {
+    key: item.name,
+    className: "source",
+    onClick: function onClick() {
+      return window.open(url);
+    }
+  }, /*#__PURE__*/React.createElement("li", {
+    className: "source-item"
+  }, /*#__PURE__*/React.createElement(Image, {
+    type: sourceIconMap[item.type]
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "source-item-text"
+  }, /*#__PURE__*/React.createElement(TextTooltip, {
+    text: repo,
+    tip: repo,
+    length: 12
+  }))), /*#__PURE__*/React.createElement("li", {
+    className: "secondary"
+  }, getSourceToolIcon(type), /*#__PURE__*/React.createElement("span", null, title(branch))), /*#__PURE__*/React.createElement("li", {
+    className: "secondary"
+  }, /*#__PURE__*/React.createElement(IconFont, {
+    type: "commit-line"
+  }), /*#__PURE__*/React.createElement("span", null, commit.commitId ? /*#__PURE__*/React.createElement(TextTooltip, {
+    text: commit.commitId.substring(0, 8),
+    tip: commit.commitId,
+    length: 14,
+    needTipExtraBtn: true,
+    onClickTipExtraBtn: onClickTipExtraBtn,
+    needTipStopPropagation: true,
+    alwaysShowTip: true,
+    align: "bl"
+  }) : '--')), /*#__PURE__*/React.createElement("li", {
+    className: "secondary"
+  }, /*#__PURE__*/React.createElement(IconFont, {
+    type: "log-line"
+  }), /*#__PURE__*/React.createElement("span", null, _commitMsg ? title(_commitMsg) : '--')));
+};
+var JenkinsSource = function JenkinsSource(_ref3) {
+  var item = _ref3.item;
+  var scGrayEnable = window.YUNXIAO_COMMON.serviceConnectionGrayRegion === 'true'; // 是否灰度
+  var url = scGrayEnable ? item.data.jobUrl + "/" + encodeURIComponent(item.data.branch) : item.data.repo + "/" + encodeURIComponent(item.data.branch);
+  var onOpenCommit = function onOpenCommit() {
+    return window.open(url);
+  };
+  var _item$data2 = item.data,
+    _item$data2$repo = _item$data2.repo,
+    repo = _item$data2$repo === void 0 ? '' : _item$data2$repo,
+    branch = _item$data2.branch;
+  return /*#__PURE__*/React.createElement("ul", {
+    key: item.name,
+    className: "source",
+    onClick: function onClick() {
+      return onOpenCommit(repo, branch);
+    }
+  }, /*#__PURE__*/React.createElement("li", {
+    className: "source-item"
+  }, /*#__PURE__*/React.createElement(Image, {
+    type: sourceIconMap[item.type] ? sourceIconMap[item.type] : sourceIconMap.aliyunGit
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "source-item-text"
+  }, title(decodeURI(repo)))), /*#__PURE__*/React.createElement("li", {
+    className: "secondary"
+  }, getSourceToolIcon(item.type), /*#__PURE__*/React.createElement("span", null, title(branch))));
+};
+export function artifactSourceInstanceResultProcess(item) {
+  var data = item.data;
+  var repo = data.repo,
+    repoType = data.repoType,
+    artifactName = data.artifactName,
+    version = data.version,
+    versionName = data.versionName;
+  var artifactUrl = getFeatures('packages.url') + "/" + repoType + "/" + repo + "/artifacts?artifactOrg=&artifactName=" + encodeURIComponent(artifactName) + "&version=" + encodeURIComponent(versionName === 'latest' ? version : versionName);
+  var versionDisplayText = versionName === 'latest' ? "latest(" + version + ")" : versionName;
+  return {
+    versionDisplayText: versionDisplayText,
+    artifactUrl: artifactUrl
+  };
+}
+var ArtifactSource = function ArtifactSource(props) {
+  switch (props.item.type) {
+    case ArtifactSourceTypes.packages:
+      return /*#__PURE__*/React.createElement(Packages, props);
+    case ArtifactSourceTypes.acr:
+      return /*#__PURE__*/React.createElement(Acr, props);
+    default:
+      break;
+  }
+};
+var Packages = function Packages(_ref4) {
+  var item = _ref4.item;
+  var data = item.data;
+  var _artifactSourceInstan = artifactSourceInstanceResultProcess(item),
+    artifactUrl = _artifactSourceInstan.artifactUrl,
+    versionDisplayText = _artifactSourceInstan.versionDisplayText;
+  var repoName = decodeURI(data.repoName);
+  return /*#__PURE__*/React.createElement("ul", {
+    key: item.name,
+    className: "source",
+    onClick: function onClick() {
+      return window.open(artifactUrl);
+    }
+  }, /*#__PURE__*/React.createElement("li", {
+    className: "source-item"
+  }, /*#__PURE__*/React.createElement(Image, {
+    type: sourceIconMap[item.type]
+  }), /*#__PURE__*/React.createElement(TextTooltip, {
+    text: artifactUrl,
+    tip: artifactUrl,
+    length: 14,
+    needTipExtraBtn: true,
+    onClickTipExtraBtn: onClickTipExtraBtn,
+    needTipStopPropagation: true
+  })), /*#__PURE__*/React.createElement("li", {
+    className: "secondary"
+  }, /*#__PURE__*/React.createElement(YunxiaoIcon, {
+    type: "zhipincangku-package"
+  }), /*#__PURE__*/React.createElement("span", null, title(data.artifactName))), /*#__PURE__*/React.createElement("li", {
+    className: "secondary"
+  }, /*#__PURE__*/React.createElement(YunxiaoIcon, {
+    type: "appversion-line"
+  }), /*#__PURE__*/React.createElement("span", null, title(versionDisplayText))));
+};
+var Acr = function Acr(_ref5) {
+  var item = _ref5.item;
+  var data = item.data;
+  return /*#__PURE__*/React.createElement("ul", {
+    key: item.name,
+    className: "source",
+    onClick: function onClick() {}
+  }, /*#__PURE__*/React.createElement("li", {
+    className: "source-item"
+  }, /*#__PURE__*/React.createElement(Image, {
+    type: sourceIconMap[item.type]
+  }), /*#__PURE__*/React.createElement(TextTooltip, {
+    text: data.imageUrl,
+    tip: data.imageUrl,
+    length: 14,
+    needTipExtraBtn: true,
+    onClickTipExtraBtn: onClickTipExtraBtn,
+    needTipStopPropagation: true
+  })), /*#__PURE__*/React.createElement("li", {
+    className: "secondary"
+  }, /*#__PURE__*/React.createElement(YunxiaoIcon, {
+    type: "zhipincangku-package"
+  }), /*#__PURE__*/React.createElement("span", null, title(data.repoName))), /*#__PURE__*/React.createElement("li", {
+    className: "secondary"
+  }, /*#__PURE__*/React.createElement(YunxiaoIcon, {
+    type: "appversion-line"
+  }), /*#__PURE__*/React.createElement("span", null, title(data.version))));
+};
+var FlowSource = function FlowSource(_ref6) {
+  var item = _ref6.item;
+  var data = item.data,
+    name = item.name,
+    type = item.type;
+  var _data$repo2 = data.repo,
+    repo = _data$repo2 === void 0 ? '' : _data$repo2,
+    branch = data.branch,
+    pipelineName = data.pipelineName;
+  var openPipeline = function openPipeline(pipelineId, instance) {
+    var url = getUrlWithContextPath("/pipelines/" + pipelineId);
+    if (!isNaN(instance)) {
+      return window.open(url + "/builds/" + encodeURIComponent(instance));
+    }
+    return window.open(url + "/current");
+  };
+  return /*#__PURE__*/React.createElement("ul", {
+    key: name,
+    className: "source",
+    onClick: function onClick() {
+      return branch !== '--' && openPipeline(repo, branch);
+    }
+  }, /*#__PURE__*/React.createElement("li", {
+    className: "source-item"
+  }, /*#__PURE__*/React.createElement(Image, {
+    type: sourceIconMap[type] ? sourceIconMap[type] : sourceIconMap.aliyunGit
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "source-item-text",
+    style: {
+      direction: 'unset'
+    }
+  }, title(pipelineName))), /*#__PURE__*/React.createElement("li", {
+    className: "secondary"
+  }, getSourceToolIcon(type), /*#__PURE__*/React.createElement("span", null, flowVersion(branch))));
+};
+var Source = function Source(props) {
+  if (props.item.type === 'jenkins') {
+    return /*#__PURE__*/React.createElement(JenkinsSource, props);
+  }
+  if (props.item.type === 'flow') {
+    return /*#__PURE__*/React.createElement(FlowSource, props);
+  }
+  if (props.item.type === 'svn') {
+    return /*#__PURE__*/React.createElement(SvnSource, props);
+  }
+  if (getCategoryFromType(props.item.type) === ARTIFACT_SOURCE) {
+    return /*#__PURE__*/React.createElement(ArtifactSource, props);
+  }
+  return /*#__PURE__*/React.createElement(CommonGitSource, props);
+};
+export default Source;

package/es/components/common/teambition/pipeline-instance-new/status/index.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import './index.scss';
+declare const StatusIcon: ({ className, status, iconOnly, withTips }: {
+    className?: string;
+    status: any;
+    iconOnly?: boolean;
+    withTips?: boolean;
+}) => JSX.Element;
+export default StatusIcon;

package/es/components/common/teambition/pipeline-instance-new/status/index.js

@@ -0,0 +1,172 @@
+import React from 'react';
+import { Balloon } from '@teamix/ui';
+import { YunxiaoIcon } from '@alife/devops-ui';
+import "./index.scss";
+import intl from "../../../../../locale";
+var Tooltip = Balloon.Tooltip;
+var statusMap = {
+  waiting: {
+    label: intl.get({
+      id: 'rdc-tb-cd-assets.teambition.instance-status-icon.Waiting',
+      defaultMessage: '等待中'
+    }),
+    icon: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "time-fill"
+    })
+  },
+  switch_manual: {
+    label: intl.get({
+      id: 'rdc-tb-cd-assets.teambition.instance-status-icon.Waiting',
+      defaultMessage: '等待中'
+    }),
+    icon: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "time-fill"
+    })
+  },
+  canceled: {
+    label: intl.get({
+      id: 'rdc-tb-cd-assets.teambition.instance-status-icon.Canceled',
+      defaultMessage: '已取消'
+    }),
+    icon: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "minus-fill"
+    })
+  },
+  cancelled: {
+    label: intl.get({
+      id: 'rdc-tb-cd-assets.teambition.instance-status-icon.Canceled',
+      defaultMessage: '已取消'
+    }),
+    icon: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "minus-fill"
+    })
+  },
+  cancel: {
+    label: intl.get({
+      id: 'rdc-tb-cd-assets.teambition.instance-status-icon.Canceled',
+      defaultMessage: '已取消'
+    }),
+    icon: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "minus-fill"
+    })
+  },
+  finish: {
+    label: intl.get({
+      id: 'rdc-tb-cd-assets.teambition.instance-status-icon.Completed',
+      defaultMessage: '已完成'
+    }),
+    icon: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "success-fill"
+    })
+  },
+  success: {
+    label: intl.get({
+      id: 'rdc-tb-cd-assets.teambition.instance-status-icon.RunSuccessfully',
+      defaultMessage: '运行成功'
+    }),
+    icon: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "success-fill"
+    })
+  },
+  running: {
+    label: intl.get({
+      id: 'rdc-tb-cd-assets.teambition.instance-status-icon.Running',
+      defaultMessage: '运行中'
+    }),
+    icon: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "a-mingchengjiazaileixingmianxing"
+    })
+  },
+  cancelling: {
+    label: intl.get({
+      id: 'rdc-tb-cd-assets.teambition.instance-status-icon.Canceling',
+      defaultMessage: '取消中'
+    }),
+    icon: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "a-mingchengjiazaileixingmianxing"
+    })
+  },
+  fail: {
+    label: intl.get({
+      id: 'rdc-tb-cd-assets.teambition.instance-status-icon.FailedToRun',
+      defaultMessage: '运行失败'
+    }),
+    icon: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "delete-fill"
+    })
+  },
+  pause: {
+    label: intl.get({
+      id: 'rdc-tb-cd-assets.teambition.instance-status-icon.Paused',
+      defaultMessage: '暂停中'
+    }),
+    icon: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "paused-fill"
+    })
+  },
+  init: {
+    label: intl.get({
+      id: 'rdc-tb-cd-assets.teambition.instance-status-icon.Waiting',
+      defaultMessage: '等待中'
+    }),
+    icon: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "time-fill"
+    })
+  },
+  ready: {
+    label: intl.get({
+      id: 'rdc-tb-cd-assets.teambition.instance-status-icon.Waiting',
+      defaultMessage: '等待中'
+    }),
+    icon: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "time-fill"
+    })
+  },
+  skip: {
+    label: intl.get({
+      id: 'rdc-tb-cd-assets.teambition.instance-status-icon.Skipped',
+      defaultMessage: '已跳过'
+    }),
+    icon: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "success-fill"
+    })
+  },
+  "default": {
+    label: status,
+    icon: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "minus-fill"
+    })
+  },
+  dormant: {
+    label: intl.get({
+      id: 'rdc-tb-cd-assets.teambition.instance-status-icon.NotExecuted',
+      defaultMessage: '未执行'
+    }),
+    icon: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "paused-fill"
+    })
+  }
+};
+var StatusIcon = function StatusIcon(_ref) {
+  var _ref$className = _ref.className,
+    className = _ref$className === void 0 ? '' : _ref$className,
+    status = _ref.status,
+    _ref$iconOnly = _ref.iconOnly,
+    iconOnly = _ref$iconOnly === void 0 ? true : _ref$iconOnly,
+    _ref$withTips = _ref.withTips,
+    withTips = _ref$withTips === void 0 ? false : _ref$withTips;
+  if (withTips) {
+    return /*#__PURE__*/React.createElement(Tooltip, {
+      trigger: /*#__PURE__*/React.createElement("span", {
+        className: "status-icon " + status.toLowerCase() + " " + className
+      }, statusMap[status.toLowerCase()].icon),
+      align: "t"
+    }, statusMap[status.toLowerCase()].label);
+  }
+  return /*#__PURE__*/React.createElement("span", {
+    className: "status-icon " + status.toLowerCase() + " " + className
+  }, statusMap[status.toLowerCase()].icon, /*#__PURE__*/React.createElement("span", {
+    className: "status-text"
+  }, !iconOnly && statusMap[status.toLowerCase()].label));
+};
+export default StatusIcon;

package/es/components/common/teambition/pipeline-instance-new/status/index.scss

@@ -0,0 +1,45 @@
+@keyframes circle {
+  0% {
+    transform: rotate(0deg);
+  }
+
+  100% {
+    transform: rotate(360deg);
+  }
+}
+.status-icon {
+  &.cancelling,
+  &.running {
+    color: #006ad4;
+    i {
+      animation: circle 2s infinite linear;
+    }
+  }
+  &.finish,
+
+  &.success {
+    color: #22b066;
+  }
+
+  &.waiting {
+    color: var(--color-warning-5, #f98e1a);
+  }
+
+  &.skip,
+  &.dormant,
+  &.switch_manual,
+  &.init,
+  &.ready,
+  &.pause {
+    color: var(--color-fill1-6, #8b8b8b);
+  }
+  &.canceled,
+  &.fail {
+    color: var(--color-error-5, #e84738);
+  }
+  .status-text {
+    font-weight: 500px;
+    margin-right: 4px;
+    color: var(--color-text1-3, #575757);
+  }
+}

package/es/components/common/teambition/pipeline-instance-new/variable/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import './index.scss';
+declare function PipelineParams(props: any): JSX.Element;
+export default PipelineParams;