@allurereport/web-allure2 3.0.0-beta.10

package/src/assets/icons/teamcity.svg

@@ -0,0 +1,40 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 128.01 128.01">
+  <defs>
+    <linearGradient id="linear-gradient" x1="66.73" y1="-662.84" x2="26.4" y2="-613.01" gradientTransform="matrix(1, 0, 0, -1, 0, -585.01)" gradientUnits="userSpaceOnUse">
+      <stop offset="0.06" stop-color="#0cb0f2"/>
+      <stop offset="0.21" stop-color="#10adf2"/>
+      <stop offset="0.37" stop-color="#1ea5f3"/>
+      <stop offset="0.54" stop-color="#3497f5"/>
+      <stop offset="0.71" stop-color="#5283f7"/>
+      <stop offset="0.88" stop-color="#796af9"/>
+      <stop offset="0.97" stop-color="#905cfb"/>
+    </linearGradient>
+    <linearGradient id="linear-gradient-2" x1="20.9" y1="-706.33" x2="41.11" y2="-659.59" gradientTransform="matrix(1, 0, 0, -1, 0, -585.01)" gradientUnits="userSpaceOnUse">
+      <stop offset="0.06" stop-color="#0cb0f2"/>
+      <stop offset="0.2" stop-color="#0db2ee"/>
+      <stop offset="0.35" stop-color="#12b7e0"/>
+      <stop offset="0.51" stop-color="#19c0ca"/>
+      <stop offset="0.68" stop-color="#23ccac"/>
+      <stop offset="0.85" stop-color="#30dc85"/>
+      <stop offset="0.97" stop-color="#3bea62"/>
+    </linearGradient>
+    <linearGradient id="linear-gradient-3" x1="48.62" y1="-644.91" x2="88.12" y2="-594.24" xlink:href="#linear-gradient-2"/>
+    <linearGradient id="linear-gradient-4" x1="63.99" y1="-609.92" x2="63.99" y2="-689.92" gradientTransform="matrix(1, 0, 0, -1, 0, -585.01)" gradientUnits="userSpaceOnUse">
+      <stop offset="0"/>
+      <stop offset="1"/>
+    </linearGradient>
+  </defs>
+  <title>icon_TeamCity</title>
+  <g>
+    <path d="M45.92,2.92a25,25,0,0,0-5.53-2c-25.7-6.1-44.8,19.1-34.3,42,0.1,0.1,18.7,40.9,21.7,47.4,0,0,34.2-15.7,41.2-31.8,6.48-15-4.45-42.38-6.45-46.49Z" fill="url(#linear-gradient)"/>
+    <path d="M123.19,48.43a24.36,24.36,0,0,0-8.6-8c-0.1,0-24.1-13.2-24.1-13.2S8.09,75,8,75.13c-9.3,10.6-11.4,27.4-.7,42a25.22,25.22,0,0,0,13,9.2c9.7,3,18.3,1.8,25.5-2,0.2-.1,67.7-35.9,67.9-36.1C126.89,81.33,133,63.73,123.19,48.43Z" fill="#0cb0f2"/>
+    <path d="M38.42,37.94l-22,27S8,75,7.89,75.13c-9.3,10.6-11.4,27.4-.7,42a25.22,25.22,0,0,0,13,9.2c9.7,3,18.4,1.8,25.6-2,0,0,1.7-.9,4.6-2.5C59.53,116.89,72.14,83.68,80.74,58Z" fill="url(#linear-gradient-2)"/>
+    <path d="M73,63.93L90.49,27a0.1,0.1,0,0,1,.1-0.1c0.1-.3,1.5-3.9,1.6-4.1a17,17,0,0,0-1.8-15.9,14.29,14.29,0,0,0-8.9-6.3,16.4,16.4,0,0,0-17.1,5.7c-0.1.1-3.9,4.5-3.9,4.5l-28,34.5Z" fill="url(#linear-gradient-3)"/>
+  </g>
+  <g>
+    <rect x="23.99" y="23.93" width="80" height="80" fill="url(#linear-gradient-4)"/>
+    <polygon points="42.79 41.63 31.99 41.63 31.99 34.63 61.29 34.63 61.29 41.63 50.59 41.63 50.59 69.22 42.79 69.22 42.79 41.63" fill="#fff"/>
+    <path d="M61.29,52h0c0-10,7.4-18.1,18.1-18.1,6.5,0,10.5,2.2,13.7,5.4l-4.9,5.6c-2.7-2.4-5.4-3.9-8.9-3.9-5.8,0-10.1,4.9-10.1,10.8v0.1c0,6,4.1,10.9,10.1,10.9,4,0,6.4-1.6,9.1-4.1l4.9,4.9c-3.6,3.8-7.5,6.2-14.2,6.2A17.41,17.41,0,0,1,61.29,52" fill="#fff"/>
+    <rect x="31.99" y="87.93" width="29.3" height="5.3" fill="#fff"/>
+  </g>
+</svg>

package/src/assets/icons/timeline.svg

@@ -0,0 +1,12 @@
+<svg viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_310_8)">
+<path d="M15 11H17V20H15V11Z" fill="currentColor"/>
+<path d="M13 2H19V4H13V2Z" fill="currentColor"/>
+<path d="M28 8.99999L26.58 7.58999L24.33 9.83999C22.4882 7.71302 19.8977 6.37742 17.0968 6.1107C14.2959 5.84397 11.4999 6.66663 9.28979 8.40774C7.07965 10.1488 5.62527 12.6745 5.22886 15.46C4.83244 18.2456 5.52446 21.0767 7.16113 23.3653C8.7978 25.6538 11.2533 27.2239 14.0174 27.7491C16.7815 28.2744 19.6417 27.7145 22.0038 26.1858C24.3658 24.6571 26.0481 22.2771 26.701 19.5403C27.354 16.8036 26.9274 13.9204 25.51 11.49L28 8.99999ZM16 26C14.22 26 12.4799 25.4722 10.9999 24.4832C9.51983 23.4943 8.36627 22.0887 7.68509 20.4441C7.0039 18.7996 6.82567 16.99 7.17293 15.2442C7.5202 13.4983 8.37737 11.8947 9.63604 10.636C10.8947 9.37736 12.4984 8.52019 14.2442 8.17292C15.99 7.82566 17.7996 8.00389 19.4442 8.68508C21.0887 9.36626 22.4943 10.5198 23.4832 11.9999C24.4722 13.4799 25 15.22 25 17C25 19.3869 24.0518 21.6761 22.364 23.364C20.6761 25.0518 18.3869 26 16 26Z" fill="currentColor"/>
+</g>
+<defs>
+<clipPath id="clip0_310_8">
+<rect width="32" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/src/assets/icons/tree.svg

@@ -0,0 +1,10 @@
+<svg viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_53_88)">
+<path d="M23 9.005H29C29.5304 9.005 30.0391 8.79429 30.4142 8.41922C30.7893 8.04415 31 7.53544 31 7.005V3.005C31 2.47457 30.7893 1.96586 30.4142 1.59079C30.0391 1.21572 29.5304 1.005 29 1.005H23C22.4696 1.005 21.9609 1.21572 21.5858 1.59079C21.2107 1.96586 21 2.47457 21 3.005V4.005H11V3.005C11 2.47457 10.7893 1.96586 10.4142 1.59079C10.0391 1.21572 9.53043 1.005 9 1.005H3C2.46957 1.005 1.96086 1.21572 1.58579 1.59079C1.21071 1.96586 1 2.47457 1 3.005V7.005C1 7.53544 1.21071 8.04415 1.58579 8.41922C1.96086 8.79429 2.46957 9.005 3 9.005H9C9.53043 9.005 10.0391 8.79429 10.4142 8.41922C10.7893 8.04415 11 7.53544 11 7.005V6.005H15V26.005C15.0005 26.5353 15.2114 27.0437 15.5864 27.4186C15.9613 27.7936 16.4697 28.0045 17 28.005H21V29.005C21 29.5354 21.2107 30.0441 21.5858 30.4192C21.9609 30.7943 22.4696 31.005 23 31.005H29C29.5304 31.005 30.0391 30.7943 30.4142 30.4192C30.7893 30.0441 31 29.5354 31 29.005V25.005C31 24.4746 30.7893 23.9659 30.4142 23.5908C30.0391 23.2157 29.5304 23.005 29 23.005H23C22.4696 23.005 21.9609 23.2157 21.5858 23.5908C21.2107 23.9659 21 24.4746 21 25.005V26.005H17V17.005H21V18.005C21 18.5354 21.2107 19.0441 21.5858 19.4192C21.9609 19.7943 22.4696 20.005 23 20.005H29C29.5304 20.005 30.0391 19.7943 30.4142 19.4192C30.7893 19.0441 31 18.5354 31 18.005V14.005C31 13.4746 30.7893 12.9659 30.4142 12.5908C30.0391 12.2157 29.5304 12.005 29 12.005H23C22.4696 12.005 21.9609 12.2157 21.5858 12.5908C21.2107 12.9659 21 13.4746 21 14.005V15.005H17V6.005H21V7.005C21 7.53544 21.2107 8.04415 21.5858 8.41922C21.9609 8.79429 22.4696 9.005 23 9.005ZM23 3.005H29V7.005H23V3.005ZM9 7.005H3V3.005H9V7.005ZM23 25.005H29V29.005H23V25.005ZM23 14.005H29V18.005H23V14.005Z" fill="currentColor"/>
+</g>
+<defs>
+<clipPath id="clip0_53_88">
+<rect width="32" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/src/assets/icons/txt.svg

@@ -0,0 +1,11 @@
+<svg viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_473_39)">
+<path d="M22 14V10C22.0035 9.86858 21.9785 9.73795 21.9268 9.61711C21.875 9.49627 21.7976 9.38809 21.7 9.3L14.7 2.3C14.612 2.20235 14.5038 2.12495 14.3829 2.07316C14.2621 2.02137 14.1314 1.99641 14 2H4C3.47005 2.00159 2.96227 2.21281 2.58753 2.58754C2.2128 2.96227 2.00158 3.47006 2 4V28C2 28.5304 2.21071 29.0391 2.58579 29.4142C2.96086 29.7893 3.46957 30 4 30H20V28H4V4H12V10C12.0016 10.53 12.2128 11.0377 12.5875 11.4125C12.9623 11.7872 13.4701 11.9984 14 12H20V14H22ZM14 10V4.4L19.6 10H14Z" fill="currentColor"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6 16H8H10H12V18H10V26H8V18H6V16ZM21 16H23H25H27V18H25V26H23V18H21V16ZM12.8955 16L15.4936 20.5L12.3181 26H14.6275L16.6483 22.5L18.669 26H20.9784L17.803 20.5L20.401 16H18.0916L16.6483 18.5L15.2049 16H12.8955ZM11.9889 26.5702L12 26.551V26.5767L11.9889 26.5702Z" fill="currentColor"/>
+</g>
+<defs>
+<clipPath id="clip0_473_39">
+<rect width="32" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/src/assets/icons/unknown.svg

@@ -0,0 +1,10 @@
+<svg viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_202_14)">
+<path d="M16 2C13.2311 2 10.5243 2.82109 8.22202 4.35943C5.91973 5.89777 4.12532 8.08427 3.06569 10.6424C2.00607 13.2006 1.72882 16.0155 2.26901 18.7313C2.80921 21.447 4.14258 23.9416 6.10051 25.8995C8.05845 27.8574 10.553 29.1908 13.2687 29.731C15.9845 30.2712 18.7994 29.9939 21.3576 28.9343C23.9157 27.8747 26.1022 26.0803 27.6406 23.778C29.1789 21.4757 30 18.7689 30 16C30 12.287 28.525 8.72601 25.8995 6.1005C23.274 3.475 19.713 2 16 2ZM16 25C15.7033 25 15.4133 24.912 15.1667 24.7472C14.92 24.5824 14.7277 24.3481 14.6142 24.074C14.5007 23.7999 14.471 23.4983 14.5288 23.2074C14.5867 22.9164 14.7296 22.6491 14.9393 22.4393C15.1491 22.2296 15.4164 22.0867 15.7074 22.0288C15.9983 21.9709 16.2999 22.0007 16.574 22.1142C16.8481 22.2277 17.0824 22.42 17.2472 22.6666C17.412 22.9133 17.5 23.2033 17.5 23.5C17.5 23.8978 17.342 24.2794 17.0607 24.5607C16.7794 24.842 16.3978 25 16 25ZM17.142 17.246V19.747H14.892V15H17.017C17.6473 15 18.2518 14.7496 18.6974 14.3039C19.1431 13.8583 19.3935 13.2538 19.3935 12.6235C19.3935 11.9932 19.1431 11.3887 18.6974 10.9431C18.2518 10.4974 17.6473 10.247 17.017 10.247H15.517C14.8874 10.2478 14.2837 10.4983 13.8385 10.9435C13.3933 11.3887 13.1428 11.9924 13.142 12.622V13.26H10.892V12.622C10.8936 11.3961 11.3815 10.221 12.2486 9.35445C13.1157 8.48791 14.2911 8.00079 15.517 8H17.017C18.2307 8.00278 19.3947 8.48263 20.2577 9.33602C21.1207 10.1894 21.6136 11.3479 21.63 12.5615C21.6464 13.7751 21.185 14.9465 20.3454 15.8229C19.5057 16.6993 18.3552 17.2104 17.142 17.246Z" fill="currentColor"/>
+</g>
+<defs>
+<clipPath id="clip0_202_14">
+<rect width="32" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/src/behaviors/ClipboardBehavior.js

@@ -0,0 +1,34 @@
+import { Behavior } from "backbone.marionette";
+import TooltipView from "@/components/tooltip/TooltipView.js";
+import { on } from "@/decorators/index.js";
+import translate from "@/helpers/t.js";
+import copy from "@/utils/clipboard.js";
+
+export default class ClipboardBehavior extends Behavior {
+  initialize() {
+    this.tooltip = new TooltipView({
+      position: "left",
+    });
+  }
+
+  @on("mouseenter [data-copy]")
+  onTipHover(e) {
+    const el = this.$(e.currentTarget);
+    this.tooltip.show(translate("controls.clipboard"), el);
+  }
+
+  @on("mouseleave [data-copy]")
+  onTipLeave() {
+    this.tooltip.hide();
+  }
+
+  @on("click [data-copy]")
+  onCopyableClick(e) {
+    const el = this.$(e.currentTarget);
+    if (copy(el.data("copy"))) {
+      this.tooltip.show(translate("controls.clipboardSuccess"), el);
+    } else {
+      this.tooltip.show(translate("controls.clipboardError"), el);
+    }
+  }
+}

package/src/behaviors/DownloadBehavior.js

@@ -0,0 +1,42 @@
+import { reportDataUrl } from "@allurereport/web-commons";
+import { Behavior } from "backbone.marionette";
+import TooltipView from "@/components/tooltip/TooltipView.js";
+import { on } from "@/decorators/index.js";
+
+export default class DownloadBehavior extends Behavior {
+  initialize() {
+    this.tooltip = new TooltipView({
+      position: "left",
+    });
+  }
+
+  @on("click [data-download]")
+  onDownloadableClick(e) {
+    e.preventDefault();
+    e.stopPropagation();
+    const el = this.$(e.currentTarget);
+    const path = el.data("download");
+    if (!path) {
+      return;
+    }
+
+    const contentType = el.data("download-type") || "application/octet-stream";
+    const target = el.data("download-target") === "_blank";
+
+    reportDataUrl(`${path}`, contentType)
+      .then((href) => {
+        const link = document.createElement("a");
+        link.setAttribute("href", href);
+        link.setAttribute("download", path);
+        if (target) {
+          link.setAttribute("target", "_blank");
+        }
+        document.body.appendChild(link);
+        link.click();
+        document.body.removeChild(link);
+      })
+      .catch((error) => {
+        this.tooltip.show(`Download error: ${error}`, el);
+      });
+  }
+}

package/src/behaviors/GaBehavior.js

@@ -0,0 +1,27 @@
+import { Behavior } from "backbone.marionette";
+import { on } from "@/decorators/index.js";
+import gtag from "@/utils/gtag.js";
+
+export default class GaBehavior extends Behavior {
+  initialize() {}
+
+  @on("click [data-ga4-event]")
+  onDataEventClick(e) {
+    const el = this.$(e.currentTarget);
+    const event = el.data("ga4-event");
+    const dataAttributes = el.data();
+    const eventParams = Object.keys(dataAttributes)
+      .filter((key) => key.startsWith("ga4Param"))
+      .map((key) => {
+        const value = dataAttributes[key];
+        const gaKey = key
+          .substring(8)
+          .split(/\.?(?=[A-Z])/)
+          .join("_")
+          .toLowerCase();
+        return { [gaKey]: value };
+      })
+      .reduce((a, b) => Object.assign(a, b), {});
+    gtag(event, eventParams);
+  }
+}

package/src/behaviors/LoadBehavior.js

@@ -0,0 +1,18 @@
+import { Behavior } from "backbone.marionette";
+
+export default class LoadBehavior extends Behavior {
+  initialize() {
+    const renderView = this.view.render.bind(this.view);
+    this.loaded = false;
+    this.view.render = () => {
+      if (this.loaded) {
+        renderView();
+      } else {
+        this.view.loadData().then(() => {
+          this.loaded = true;
+          renderView();
+        });
+      }
+    };
+  }
+}

package/src/behaviors/TooltipBehavior.js

@@ -0,0 +1,25 @@
+import { Behavior } from "backbone.marionette";
+import { escapeExpression as escape } from "handlebars/runtime.js";
+import TooltipView from "@/components/tooltip/TooltipView.js";
+import { on } from "@/decorators/index.js";
+
+export default class TooltipBehavior extends Behavior {
+  initialize() {
+    this.tooltip = new TooltipView(this.options);
+  }
+
+  onDestroy() {
+    this.tooltip.hide();
+  }
+
+  @on("mouseenter [data-tooltip]")
+  onTipHover(e) {
+    const el = this.$(e.currentTarget);
+    this.tooltip.show(escape(el.data("tooltip")), el);
+  }
+
+  @on("mouseleave [data-tooltip]")
+  onTipLeave() {
+    this.tooltip.hide();
+  }
+}

package/src/behaviors/index.js

@@ -0,0 +1,7 @@
+import ClipboardBehavior from "./ClipboardBehavior.js";
+import DownloadBehavior from "./DownloadBehavior.js";
+import GaBehavior from "./GaBehavior.js";
+import LoadBehavior from "./LoadBehavior.js";
+import TooltipBehavior from "./TooltipBehavior.js";
+
+export { LoadBehavior, TooltipBehavior, ClipboardBehavior, GaBehavior, DownloadBehavior };

package/src/blocks/alert/styles.scss

@@ -0,0 +1,8 @@
+@import "../../mixins.scss";
+
+.alert {
+  &__code {
+    white-space: pre;
+  }
+  @include status-bg();
+}

package/src/blocks/arrow/styles.scss

@@ -0,0 +1,21 @@
+.block__arrow {
+  visibility: visible;
+  transition: transform 0.1s;
+  font-weight: initial;
+  vertical-align: middle;
+  line-height: normal;
+
+  &__expanded {
+    transform: rotate(90deg);
+  }
+}
+
+[dir="rtl"] .block__arrow {
+  transform: scaleX(-1);
+  filter: FlipH;
+}
+
+.angle {
+  width: 20px;
+  display: flex;
+}

package/src/blocks/attachment-row/attachment-row.hbs

@@ -0,0 +1,34 @@
+<div>
+    <div class="attachment-row" data-uid="{{uid}}">
+        <span class="attachment-row__arrow block__arrow">{{angle}}</span>
+        <div class="attachment-row__icon">
+            <span data-tooltip="{{type}}" class="attachment-icon">
+              {{allure-icon (fileicon type) noTooltip=true width="12px" height="12px"}}
+            </span>
+        </div>
+        <div class="attachment-row__name long-line">
+            {{#if name}}
+                {{name}}
+            {{else}}
+                {{source}}
+            {{/if}}
+        </div>
+        <div class="attachment-row__control attachment-row__link">
+            <div class="link"
+                  data-download="data/attachments/{{source}}"
+                  data-download-target="_blank"
+                  data-download-type="{{type}}"
+                  data-tooltip="Open attachment in new tab">
+                {{allure-icon "save" noTooltip=true width="12px" height="12px"}} {{filesize size}}
+            </div>
+        </div>
+        <div class="attachment-row__control attachment-row__fullscreen">
+            <a class="link">
+              {{allure-icon "maximize" noTooltip=true width="12px" height="12px"}}
+            </a>
+        </div>
+    </div>
+    <div class="attachment-row__preview">
+        <div class="attachment-row__content {{b 'attachment' uid }}"></div>
+    </div>
+</div>

package/src/blocks/attachment-row/styles.scss

@@ -0,0 +1,71 @@
+@import "../../variables.scss";
+
+.attachment-row {
+  padding: 5px $gap-size 5px 18px;
+  cursor: pointer;
+  font-size: smaller;
+  display: flex;
+  gap: 4px;
+  position: sticky;
+  top: 0;
+  align-items: center;
+
+  &:hover {
+    background: $hover-color;
+  }
+
+  &_selected {
+    &,
+    &:hover {
+      background: $pane-bg-color;
+    }
+
+    &:hover {
+      background: $hover-color;
+    }
+  }
+
+  &_selected > &__arrow {
+    transform: rotate(90deg);
+  }
+
+  &__arrow {
+    left: 7px;
+    top: 4px;
+  }
+
+  &__name {
+    flex: 1;
+  }
+
+  &__control {
+    padding-left: $gap-size;
+    display: inline-block;
+  }
+
+  &__icon {
+    display: flex;
+    align-items: center;
+  }
+
+  &__preview {
+    margin-bottom: 7px;
+    margin-left: 40px;
+  }
+
+  &__content {
+    background-color: $attachment-bg;
+  }
+
+  &__content > div {
+    padding: 5px;
+  }
+}
+
+.hljs {
+  background: inherit;
+}
+
+.attachment-icon {
+  display: flex;
+}

package/src/blocks/bar/styles.scss

@@ -0,0 +1,22 @@
+@import "../../variables.scss";
+@import "../../mixins.scss";
+
+.bar {
+  height: 18px;
+  overflow: hidden;
+  border-radius: 3px;
+  background: #eee;
+  display: inline-flex;
+  width: 100%;
+  &__fill {
+    display: inline-block;
+    overflow: hidden;
+    height: 18px;
+    background: $brand-blue;
+    text-align: center;
+    color: #fff;
+    font-size: 12px;
+    line-height: 18px;
+    @include status-bg-bright();
+  }
+}

package/src/blocks/button/styles.scss

@@ -0,0 +1,60 @@
+@import "../../variables.scss";
+
+$button-border-radius: 3px;
+$button-border-color: rgba(0, 0, 0, 0.2);
+$button-border-hover: rgba(0, 0, 0, 0.3);
+
+$button-bg-pressed: rgba(0, 0, 0, 0.05);
+$button-bg-checked: #e8e8e8;
+
+$button-inverse-border-color: #666666;
+$button-inverse-color: #737373;
+$button-inverse-border-hover: #737373;
+
+.button {
+  padding: 0 13px;
+  font-size: 13px;
+  line-height: 26px;
+  overflow: hidden;
+  background: transparent;
+  border: 1px solid $button-border-color;
+  border-radius: $button-border-radius;
+  outline: none;
+  box-sizing: content-box;
+
+  &:hover {
+    border-color: $button-border-hover;
+  }
+  &:active {
+    background: $button-bg-pressed;
+  }
+  &_active {
+    background: $button-bg-checked;
+  }
+  &_inverse {
+    color: $button-inverse-color;
+    border-color: $button-inverse-border-color;
+
+    &:hover {
+      border-color: $button-inverse-border-hover;
+    }
+  }
+}
+
+.button-group {
+  display: flex;
+  .button {
+    border-radius: 0;
+    border-right-width: 0;
+    &:last-child {
+      border-right-width: 1px;
+      border-radius: 0 $button-border-radius $button-border-radius 0;
+    }
+    &:first-child {
+      border-radius: $button-border-radius 0 0 $button-border-radius;
+    }
+    &:hover + .button {
+      border-left-color: $button-border-hover;
+    }
+  }
+}

package/src/blocks/clipboard-copy/clipboard-copy.hbs

@@ -0,0 +1,5 @@
+<span class="fullname__copy"
+      data-copy="{{value}}"
+      data-ga4-event="clipboard_copy_click">
+  {{allure-icon "copy" noTooltip=true width="16px" height="16px"}}
+</span>

package/src/blocks/executor-icon/bamboo.svg

@@ -0,0 +1,31 @@
+<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
+
+ <g>
+  <title>background</title>
+  <rect fill="none" id="canvas_background" height="202" width="202" y="-1" x="-1"/>
+  <g display="none" overflow="visible" y="0" x="0" height="100%" width="100%" id="canvasGrid">
+   <rect fill="url(#gridpattern)" stroke-width="0" y="19.622145" x="61.378059" height="400" width="580"/>
+  </g>
+ </g>
+ <g>
+  <title>Layer 1</title>
+  <g stroke="null" id="svg_62">
+   <g stroke="null" transform="matrix(1.861673452141284,0,0,1.861673452141284,-13127.843153378715,-13264.447356877272) " id="svg_61">
+    <title stroke="null" transform="translate(-0.2685726284980774,9.094947017729282e-13) translate(3.2228715419769287,9.094947017729282e-13) translate(9.094947017729282e-13,9.094947017729282e-13) translate(-6.483190536499023,-3.2415952682495117) translate(-47.84577178955078,-49.380184173583984) translate(-9.094947017729282e-13,-9.094947017729282e-13) translate(-434.96026611328125,-337.7338562011719) translate(7279,0) translate(0,7369) ">Layer 1</title>
+    <style stroke="null" transform="translate(-0.2685726284980774,9.094947017729282e-13) translate(3.2228715419769287,9.094947017729282e-13) translate(9.094947017729282e-13,9.094947017729282e-13) translate(-6.483190536499023,-3.2415952682495117) translate(-47.84577178955078,-49.380184173583984) translate(-9.094947017729282e-13,-9.094947017729282e-13) translate(-434.96026611328125,-337.7338562011719) translate(7279,0) translate(0,7369) " type="text/css">.st0{fill:#205081;}</style>
+    <g stroke="null" id="svg_46">
+     <g stroke="null" id="svg_47" transform="matrix(0.6944444113307533,0,0,0.6944444113307533,-343.74998807907116,15.277777247958717) ">
+      <path stroke="null" class="st0" d="m10655.408403,10310.598235c2.60001,1.6 8.20001,3.3 15.9,3.3l0,0c3.70001,0 7.4,-0.4 10.4,-1.2c0.3,-0.1 0.6,-0.4 0.6,-0.7c0.5,-5.8 2.1,-11.6 4.8,-16.8c0.1,-0.2 0.1,-0.4 0,-0.6c-0.1,-0.2 -0.2,-0.4 -0.4,-0.5c-3,-1.4 -6.2,-3.3 -9.1,-5.4c-4.5,-3.2 -8.2,-6.9 -10.9,-10.6c-0.2,-0.3 -0.5,-0.4 -0.9,-0.3c-0.29999,0.1 -0.6,0.3 -0.6,0.7c-1,5.1 -2.4,10.3 -4.1,15.7c-1.8,5.5 -3.8,10.6 -6,15.4c-0.2,0.3 -0.1,0.8 0.3,1z" id="svg_55"/>
+      <path stroke="null" class="st0" d="m10688.708403,10339.798235c0.2,-0.3 0.3,-0.7 0.1,-1c-2.4,-4 -4.2,-8.3 -5.29999,-12.9c-0.3,-1.1 -0.5,-2.3 -0.70001,-3.5c0,-0.2 -0.2,-0.4 -0.29999,-0.6c-0.20001,-0.1 -0.4,-0.2 -0.60001,-0.1c-3.29999,0.6 -6.89999,1 -10.5,1c-5.5,0 -10.7,-0.7 -15.1,-2.2c-0.29999,-0.1 -0.7,0 -0.9,0.2c-0.2,0.2 -0.29999,0.6 -0.1,0.9c2.20001,4.7 4.20001,9.8 5.9,15.1c1.8,5.5 3.2,10.8 4.2,16c0.10001,0.4 0.4,0.7 0.8,0.7c0,0 0,0 0.1,0c3.1,-0.3 8.6,-2.1 14.8,-6.7c2.9,-2 5.6,-4.5 7.6,-6.9z" id="svg_54"/>
+      <path stroke="null" class="st0" d="m10734.108413,10249.098235c-0.3,-0.6 -0.8,-1 -1.4,-1.1l-39.8,-8.3c-0.8,-0.2 -1.6,0.2 -2.1,0.9c-0.4,0.7 -0.4,1.6 0.1,2.2l6,8.1c-3.3,2.9 -6.9,5.8 -10.7,8.6c-4.6,3.4 -9.3,6.4 -13.9,8.9c-0.4,0.2 -0.5,0.7 -0.4,1.1c1.2,2.8 4.7,7.5 10.9,12c3,2.2 6.2,4 9.1,5.2c0.1,0 0.2,0.1 0.3,0.1c0.2,0 0.5,-0.1 0.6,-0.3c4.1,-4.8 9.1,-8.6 14.8,-11.3l2,10.1c0.2,0.8 0.79999,1.4 1.6,1.6c0.1,0 0.2,0 0.3,0c0.7,0 1.29999,-0.4 1.7,-1l20.7,-35c0.4,-0.6 0.5,-1.3 0.2,-1.8z" id="svg_53"/>
+      <path stroke="null" class="st0" d="m10710.008413,10356.898235c-5.5,-2.2 -10.5,-5.6 -14.70001,-9.8c-0.2,-0.2 -0.4,-0.2 -0.6,-0.2c-0.2,0 -0.4,0.1 -0.6,0.3c-2.3,2.4 -5,4.9 -7.9,7c-4.5,3.2 -9.1,5.7 -13.4,7.1c-0.29999,0.1 -0.5,0.4 -0.6,0.7c0,0.3 0.1,0.6 0.4,0.8c4.5,2.5 9.1,5.5 13.7,8.8c4.70001,3.4 9.1,7 13,10.7c0.20001,0.1 0.4,0.2 0.6,0.2c0.20001,0 0.4,-0.1 0.5,-0.2c2.4,-2.1 5.70001,-6.9 8.10001,-14.2c1.2,-3.6 1.89999,-7.1 2.1,-10.3c-0.1,-0.4 -0.3,-0.8 -0.6,-0.9z" id="svg_52"/>
+      <path stroke="null" class="st0" d="m10798.908403,10320.198235c-2.6,-1.6 -8.2,-3.3 -15.89999,-3.3c-3.8,0 -7.4,0.4 -10.4,1.2c-0.3,0.1 -0.6,0.4 -0.6,0.7c-0.5,5.8 -2.10001,11.6 -4.8,16.8c-0.1,0.2 -0.1,0.4 0,0.7c0.1,0.2 0.2,0.4 0.4,0.5c3,1.4 6.2,3.3 9.1,5.4c4.5,3.2 8.2,6.9 10.9,10.6c0.2,0.2 0.4,0.3 0.7,0.3c0.1,0 0.1,0 0.2,0c0.3,-0.1 0.6,-0.3 0.6,-0.7c1,-5.1 2.4,-10.3 4.1,-15.7c1.8,-5.5 3.8,-10.6 6,-15.4c0.2,-0.5 0.1,-0.9 -0.3,-1.1l-0.00001,0z" id="svg_51"/>
+      <path stroke="null" class="st0" d="m10765.608413,10290.898235c-0.20001,0.3 -0.3,0.7 -0.1,1c2.39999,4 4.2,8.3 5.29999,12.9c0.3,1.1 0.5,2.3 0.70001,3.5c0,0.2 0.2,0.4 0.29999,0.6c0.20001,0.1 0.4,0.2 0.6,0.1c3.3,-0.6 6.9,-1 10.5,-1c5.5,0 10.70001,0.7 15.10001,2.2c0.1,0 0.2,0 0.29999,0c0,0 0,0 0,0c0.5,0 0.8,-0.4 0.8,-0.8c0,-0.2 -0.1,-0.4 -0.2,-0.5c-2.2,-4.6 -4.1,-9.7 -5.8,-15c-1.8,-5.5 -3.2,-10.8 -4.2,-16c-0.1,-0.4 -0.5,-0.7 -0.9,-0.7c-3.1,0.3 -8.5,2.1 -14.8,6.7c-2.9,2.1 -5.6,4.6 -7.6,7l0.00001,0z" id="svg_50"/>
+      <path stroke="null" class="st0" d="m10744.308403,10274.098235c5.5,2.2 10.5,5.6 14.70001,9.8c0.2,0.2 0.39999,0.2 0.6,0.2c0,0 0,0 0,0c0.2,0 0.4,-0.1 0.6,-0.3c2.3,-2.4 5,-4.9 7.9,-7c4.5,-3.2 9.1,-5.7 13.4,-7.1c0.29999,-0.1 0.5,-0.4 0.6,-0.7c0,-0.3 -0.1,-0.6 -0.4,-0.8c-4.5,-2.5 -9.1,-5.5 -13.7,-8.8c-4.70001,-3.4 -9.10001,-7 -13,-10.7c-0.3,-0.3 -0.8,-0.3 -1.10001,0c-2.39999,2.1 -5.7,6.9 -8.1,14.2c-1.2,3.6 -1.9,7.1 -2.1,10.3c0.1,0.4 0.3,0.8 0.6,0.9z" id="svg_49"/>
+      <path stroke="null" class="st0" d="m10771.508413,10349.298235c-3,-2.2 -6.20001,-4 -9.10001,-5.2c-0.29999,-0.1 -0.7,0 -0.89999,0.2c-4.10001,4.8 -9.10001,8.6 -14.8,11.3l-2,-10.1c-0.2,-0.8 -0.8,-1.4 -1.6,-1.6c-0.8,-0.1 -1.6,0.2 -2,0.9l-20.70001,35c-0.29999,0.5 -0.39999,1.2 -0.1,1.8c0.3,0.6 0.8,1 1.4,1.1l39.8,8.3c0.1,0 0.3,0 0.4,0c1.1,0 2,-0.9 2,-2c0,-0.5 -0.2,-1 -0.5,-1.4l-5.8,-8c3.3,-2.9 6.9,-5.8 10.7,-8.6c4.6,-3.4 9.3,-6.4 13.9,-8.9c0.4,-0.2 0.5,-0.7 0.4,-1.1c-1.4,-2.5 -4.9,-7.2 -11.1,-11.7l0.00001,0z" id="svg_48"/>
+     </g>
+    </g>
+   </g>
+  </g>
+ </g>
+</svg>

package/src/blocks/executor-icon/bitbucket.svg

@@ -0,0 +1,10 @@
+<svg width="24px" height="24px" viewBox="0 0 0.48 0.48" xmlns="http://www.w3.org/2000/svg" fill="none">
+    <path fill="#2684FF" fill-rule="evenodd" d="M0.042 0.065A0.013 0.013 0 0 1 0.052 0.06l0.376 0a0.013 0.013 0 0 1 0.013 0.015l-0.054 0.334a0.013 0.013 0 0 1 -0.013 0.011H0.111a0.018 0.018 0 0 1 -0.017 -0.014l-0.055 -0.331a0.013 0.013 0 0 1 0.003 -0.01zm0.156 0.234H0.282l0.02 -0.118H0.176l0.022 0.118z" clip-rule="evenodd"/>
+    <path fill="url(#bitbucket-color-16__paint0_linear_707_135)" d="M0.424 0.181H0.303l-0.02 0.118H0.198L0.1 0.416c0.003 0.003 0.007 0.004 0.011 0.004h0.263a0.013 0.013 0 0 0 0.013 -0.011l0.037 -0.228z"/>
+    <defs>
+    <path id="bitbucket-color-16__paint0_linear_707_135" x1="11.544" x2="6.918" y1="4.676" y2="11.282" gradientUnits="userSpaceOnUse" d="">
+        <stop offset=".18" stop-color="#0052CC"/>
+        <stop offset="1" stop-color="#2684FF"/>
+    </path>
+    </defs>
+</svg>

package/src/blocks/executor-icon/circleci.svg

@@ -0,0 +1 @@
+<svg width="24px" height="24px" viewBox="0 0 24 24" role="img" xmlns="http://www.w3.org/2000/svg"><title>CircleCI icon</title><path d="M8.963 12c0-1.584 1.284-2.855 2.855-2.855 1.572 0 2.856 1.284 2.856 2.855 0 1.572-1.284 2.856-2.856 2.856-1.57 0-2.855-1.284-2.855-2.856zm2.855-12C6.215 0 1.522 3.84.19 9.025c-.01.036-.01.07-.01.12 0 .313.252.576.575.576H5.59c.23 0 .433-.13.517-.333.997-2.16 3.18-3.672 5.712-3.672 3.466 0 6.286 2.82 6.286 6.287 0 3.47-2.82 6.29-6.29 6.29-2.53 0-4.714-1.5-5.71-3.673-.097-.19-.29-.336-.517-.336H.755c-.312 0-.575.253-.575.576 0 .037.014.072.014.12C1.514 20.16 6.214 24 11.818 24c6.624 0 12-5.375 12-12 0-6.623-5.376-12-12-12z"/></svg>

package/src/blocks/executor-icon/github.svg

@@ -0,0 +1,4 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+    <title>GitHub icon</title>
+    <path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/>
+</svg>

package/src/blocks/executor-icon/gitlab.svg

@@ -0,0 +1,12 @@
+<svg viewBox="0 0 60 55" xmlns="http://www.w3.org/2000/svg">
+    <g fill="none" fill-rule="evenodd">
+        <path d="m59.682 31.392l-3.35-10.26-6.627-20.352c-.34-1.04-1.821-1.04-2.173 0l-6.627 20.339h-22.02l-6.627-20.339c-.34-1.04-1.821-1.04-2.173 0l-6.616 20.339-3.35 10.272c-.303.932.025 1.96.826 2.541l28.951 20.968 28.951-20.968c.801-.581 1.141-1.609.837-2.541" fill="#fc6d26"/>
+        <path d="m29.901 54.887l11.01-33.767h-22.02z" fill="#e24329"/>
+        <path d="m29.893 54.887l-11.01-33.767h-15.417z" fill="#fc6d26"/>
+        <path d="m3.462 21.13l-3.35 10.26c-.303.931.025 1.96.826 2.541l28.951 20.968-26.426-33.769" fill="#fca326"/>
+        <path d="m3.466 21.13h15.429l-6.64-20.339c-.34-1.041-1.821-1.041-2.173 0l-6.616 20.339" fill="#e24329"/>
+        <path d="m29.901 54.887l11.01-33.767h15.429z" fill="#fc6d26"/>
+        <path d="m56.33 21.13l3.35 10.26c.303.931-.024 1.96-.826 2.541l-28.951 20.956 26.426-33.757" fill="#fca326"/>
+        <path d="m56.34 21.13h-15.428l6.627-20.339c.34-1.041 1.821-1.041 2.173 0l6.628 20.339" fill="#e24329"/>
+    </g>
+</svg>