border-gray-200 h-6 text-gray-700 text-[14px] leading-[20px]" };
const _hoisted_2$2 = ["title", "data-cy"];
const _hoisted_3$2 = { class: "sr-only" };
const _sfc_main$4 = /* @__PURE__ */ defineComponent({
  __name: "ResultCounts",
  props: {
    totalPassed: null,
    totalFailed: null,
    totalPending: null,
    totalSkipped: null,
    order: null
  },
  setup(__props) {
    const props = __props;
    const { t } = useI18n();
    const ORDER_MAP = computed(() => {
      return {
        "SKIPPED": {
          value: props.totalSkipped,
          class: "icon-dark-gray-400",
          icon: SkippedIcon,
          name: t("runs.results.skipped")
        },
        "PENDING": {
          value: props.totalPending,
          class: "icon-dark-gray-400 icon-light-white",
          icon: PendingIcon,
          name: t("runs.results.pending")
        },
        "PASSED": {
          value: props.totalPassed,
          class: "icon-dark-jade-400",
          icon: PassedIcon,
          name: t("runs.results.passed")
        },
        "FAILED": {
          value: props.totalFailed,
          class: "icon-dark-red-400",
          icon: FailedIcon,
          name: t("runs.results.failed")
        }
      };
    });
    const results = computed(() => {
      const order = props.order || ["SKIPPED", "PENDING", "PASSED", "FAILED"];
      return order.map((status) => ORDER_MAP.value[status]);
    });
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1$4, [
        (openBlock(true), createElementBlock(Fragment, null, renderList(unref(results), (result, i) => {
          return openBlock(), createElementBlock("div", {
            key: i,
            class: "flex px-2 items-center",
            title: result.name,
            "data-cy": `runResults-${result.name}-count`
          }, [
            (openBlock(), createBlock(resolveDynamicComponent(result.icon), {
              class: normalizeClass(["mt-px h-[12px] mr-1 w-[12px]", result.class])
            }, null, 8, ["class"])),
            createBaseVNode("span", _hoisted_3$2, toDisplayString(result.name), 1),
            createTextVNode(" " + toDisplayString(result.value), 1)
          ], 8, _hoisted_2$2);
        }), 128))
      ]);
    };
  }
});
const _hoisted_1$3 = { class: "relative" };
const _sfc_main$3 = /* @__PURE__ */ defineComponent({
  __name: "Slideshow",
  setup(__props) {
    const step = ref(0);
    const decrement = () => {
      step.value--;
    };
    const increment = () => {
      step.value++;
    };
    const reset = () => {
      step.value = 0;
    };
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1$3, [
        createVNode(Transition, {
          "enter-from-class": "opacity-0",
          "enter-active-class": "transition duration-300 ease-out",
          "enter-to-class": "opacity-100",
          "leave-from-class": "opacity-100 absolute",
          "leave-active-class": "transition duration-300 ease-in absolute",
          "leave-to-class": "opacity-0 absolute"
        }, {
          default: withCtx(() => [
            renderSlot(_ctx.$slots, "default", {
              key: step.value,
              step: step.value,
              goBack: decrement,
              goForward: increment,
              reset
            })
          ]),
          _: 3
        })
      ]);
    };
  }
});
const _hoisted_1$2 = { class: "flex flex-col items-center border border-gray-100 rounded-lg shadow-[0_0_20px_rgba(0,0,0,0.08)]" };
const _sfc_main$2 = /* @__PURE__ */ defineComponent({
  __name: "Promo",
  props: {
    campaign: null,
    medium: null,
    cohort: null,
    instanceId: null
  },
  setup(__props) {
    const props = __props;
    gql`
fragment _Promo on Query {
  currentProject {
    id
    savedState
  }
}
`;
    gql`
query Promo {
  ..._Promo
}
`;
    gql`
mutation Promo_PromoSeen($campaign: String!, $messageId: String!, $medium: String!, $cohort: String) {
  recordEvent(campaign: $campaign, messageId: $messageId, medium: $medium, cohort: $cohort)
}
`;
    const promoSeenMutation = useMutation(Promo_PromoSeenDocument);
    const promoInstanceId = props.instanceId || nanoid();
    useQuery({ query: PromoDocument }).then((queryResult) => {
      var _a;
      const value = queryResult.data.value;
      if ((_a = value == null ? void 0 : value.currentProject) == null ? void 0 : _a.savedState) {
        promoSeenMutation.executeMutation({
          campaign: props.campaign,
          medium: props.medium,
          cohort: props.cohort ?? null,
          messageId: promoInstanceId
        });
      }
    });
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1$2, [
        renderSlot(_ctx.$slots, "header"),
        createVNode(_sfc_main$3, null, {
          default: withCtx(({ step, goBack, goForward, reset }) => [
            renderSlot(_ctx.$slots, "cards", {
              step,
              goBack,
              goForward,
              reset
            })
          ]),
          _: 3
        })
      ]);
    };
  }
});
const _hoisted_1$1 = { class: "text-xl font-semibold text-gray-900" };
const _hoisted_2$1 = { class: "text-gray-700" };
const _hoisted_3$1 = {
  key: 0,
  class: "row-end-[span_2] xl:col-start-2"
};
const _hoisted_4$1 = {
  key: 1,
  class: "self-end"
};
const _sfc_main$1 = /* @__PURE__ */ defineComponent({
  __name: "PromoCard",
  props: {
    title: null,
    body: null
  },
  setup(__props) {
    const slots = useSlots();
    const gridClasses = computed(() => {
      const classes = ["grid", "grid-cols-[480px]", "gap-y-[16px]"];
      if (slots.image) {
        classes.push("xl:grid-cols-[300px_470px]", "gap-x-[100px]");
      } else {
        classes.push("xl:grid-cols-[744px]");
      }
      return classes;
    });
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", {
        class: normalizeClass(["p-[40px]", unref(gridClasses)])
      }, [
        createBaseVNode("div", null, [
          createBaseVNode("h2", _hoisted_1$1, toDisplayString(__props.title), 1),
          createBaseVNode("p", _hoisted_2$1, toDisplayString(__props.body), 1),
          renderSlot(_ctx.$slots, "content")
        ]),
        unref(slots).image ? (openBlock(), createElementBlock("div", _hoisted_3$1, [
          renderSlot(_ctx.$slots, "image")
        ])) : createCommentVNode("", true),
        unref(slots).action ? (openBlock(), createElementBlock("div", _hoisted_4$1, [
          renderSlot(_ctx.$slots, "action")
        ])) : createCommentVNode("", true)
      ], 2);
    };
  }
});
const _hoisted_1 = { class: "flex flex-col bg-gray-50 border-gray-100 py-[16px] px-[24px] rounded-t-[8px] gap-16px items-start w-full" };
const _hoisted_2 = { class: "flex flex-col xl:flex-row w-full items-start xl:items-center gap-[16px]" };
const _hoisted_3 = { class: "flex flex-col flex-grow justify-center" };
const _hoisted_4 = {
  "data-cy": "promo-header-title",
  class: "font-md font-medium"
};
const _hoisted_5 = {
  key: 0,
  "data-cy": "promo-header-description",
  class: "text-sm font-normal"
};
const _hoisted_6 = { key: 0 };
const _hoisted_7 = {
  key: 0,
  class: "pt-[24px] w-full"
};
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "PromoHeader",
  props: {
    title: null
  },
  setup(__props) {
    const slots = useSlots();
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1, [
        createBaseVNode("div", _hoisted_2, [
          createBaseVNode("div", _hoisted_3, [
            createBaseVNode("div", _hoisted_4, toDisplayString(__props.title), 1),
            unref(slots).description ? (openBlock(), createElementBlock("div", _hoisted_5, [
              renderSlot(_ctx.$slots, "description")
            ])) : createCommentVNode("", true)
          ]),
          unref(slots).control ? (openBlock(), createElementBlock("div", _hoisted_6, [
            renderSlot(_ctx.$slots, "control")
          ])) : createCommentVNode("", true)
        ]),
        unref(slots).content ? (openBlock(), createElementBlock("div", _hoisted_7, [
          renderSlot(_ctx.$slots, "content")
        ])) : createCommentVNode("", true)
      ]);
    };
  }
});
export {
  _sfc_main$4 as _,
  _sfc_main as a,
  _sfc_main$1 as b,
  _sfc_main$2 as c
};