@useinsider/guido 3.22.0-beta.ce512a7 → 3.22.0-beta.d4e1d48

package/dist/components/organisms/header/EditorActionsMenu.vue2.js

@@ -1,99 +0,0 @@
-import { defineComponent as D, ref as C, computed as i, watch as L } from "vue";
-import { useAccessibilityApi as R } from "../../../composables/useAccessibilityApi.js";
-import { useConfig as Y } from "../../../composables/useConfig.js";
-import { useExport as F } from "../../../composables/useExport.js";
-import { useTranslations as N } from "../../../composables/useTranslations.js";
-import { useVersionHistoryApi as U } from "../../../composables/useVersionHistoryApi.js";
-import { useAutosaveStore as X } from "../../../stores/autosave.js";
-import { useEditorStore as j } from "../../../stores/editor.js";
-import { useOnboardingStore as q } from "../../../stores/onboarding.js";
-import { getTooltipOptions as z } from "../../../utils/tooltipUtils.js";
-import { InToggle as G, InDropdownMenu as J, InButtonV2 as K } from "@useinsider/design-system-vue";
-const ce = /* @__PURE__ */ D({
-  __name: "EditorActionsMenu",
-  setup(Q) {
-    const c = "guido__kebab-autosave", u = "guido__kebab-version-history", p = "guido__kebab-accessibility", d = "guido__kebab-save-as", v = "guido__kebab-export", { config: m, isFeatureEnabled: b } = Y(), { exportHtml: y } = F(), { openVersionHistory: A, closeVersionHistory: S } = U(), { toggleAccessibilityTestingMode: _ } = R(), e = j(), a = X(), f = q(), o = N(), g = C(!1), M = i(() => g.value || f.isEditorActionsMenuPinned), r = C(!1), O = i(() => b("autosave")), x = i(
-      () => {
-        var t, s;
-        return !!((s = (t = m.value) == null ? void 0 : t.features) != null && s.versionHistory) && !e.isPreviewModeOpen;
-      }
-    ), h = i(
-      () => b("accessibilityTesting") && !e.isPreviewModeOpen
-    ), V = i(() => {
-      var t, s;
-      return !!((s = (t = m.value) == null ? void 0 : t.features) != null && s.saveAsTemplate);
-    }), E = i(() => O.value ? [
-      { categoryText: o("email-editor.preferences") },
-      {
-        text: o("email-editor.auto-save"),
-        value: c,
-        disable: e.loadingStatus,
-        rightSlotComponent: G,
-        rightSlotProps: {
-          // InDropdownMenu fills attrs.id with its own positional test id, and v-bind
-          // skips a key already there — only `name` survives as a stable hook.
-          name: "guido-kebab-autosave-toggle",
-          class: "p-e-n",
-          checked: a.isOn,
-          disable: e.loadingStatus
-        }
-      },
-      { divider: "solid" }
-    ] : []), T = i(() => [
-      { categoryText: o("email-editor.actions") },
-      ...x.value ? [{
-        text: o("newsletter.version-history"),
-        value: u,
-        iconLeft: "line-architect-version-history",
-        disable: e.isVersionHistoryButtonDisabled
-      }] : [],
-      ...h.value ? [{
-        text: o("email-editor.accessibility-test"),
-        value: p,
-        iconLeft: "line-accessibility",
-        disable: e.loadingStatus
-      }] : [],
-      ...V.value ? [{
-        text: o("newsletter.save-templates"),
-        value: d,
-        iconLeft: "line-newsletter-save-as-template",
-        disable: e.isSaveAsButtonDisabled
-      }] : [],
-      {
-        text: o("email-editor.export-html"),
-        value: v,
-        iconLeft: "line-export",
-        disable: r.value || e.isExportButtonDisabled
-      }
-    ]), P = i(() => [...E.value, ...T.value]), n = () => {
-      g.value = !1;
-    };
-    L(() => f.isEditorActionsMenuPinned, (t) => {
-      t || n();
-    });
-    const k = () => {
-      a.isOn = !a.isOn;
-    }, w = () => {
-      e.isVersionHistoryOpen ? S() : A(), n();
-    }, H = () => {
-      _(), n();
-    }, I = () => {
-      e.isSaveAsTemplateDrawerOpen = !0, n();
-    }, B = async () => {
-      r.value = !0, await y(), r.value = !1, n();
-    }, l = {
-      [c]: k,
-      [u]: w,
-      [p]: H,
-      [d]: I,
-      [v]: B
-    };
-    return { __sfc: !0, AUTOSAVE: c, VERSION_HISTORY: u, ACCESSIBILITY: p, SAVE_AS: d, EXPORT: v, config: m, isFeatureEnabled: b, exportHtml: y, openVersionHistory: A, closeVersionHistory: S, toggleAccessibilityTestingMode: _, editorStore: e, autosaveStore: a, onboardingStore: f, trans: o, isOpen: g, isPanelOpen: M, isExporting: r, isAutosaveVisible: O, isVersionHistoryVisible: x, isAccessibilityVisible: h, isSaveAsVisible: V, preferenceOptions: E, actionOptions: T, options: P, close: n, toggleAutosave: k, handleVersionHistory: w, handleAccessibility: H, handleSaveAs: I, handleExport: B, optionHandlers: l, handleOptionClick: ({ value: t }) => {
-      var s;
-      return (s = l[t]) == null ? void 0 : s.call(l);
-    }, getTooltipOptions: z, InButtonV2: K, InDropdownMenu: J };
-  }
-});
-export {
-  ce as default
-};

package/dist/components/organisms/header/accessibility/AccessibilityToolbar.vue.js

@@ -1,18 +0,0 @@
-import i from "./AccessibilityToolbar.vue2.js";
-/* empty css                          */
-import s from "../../../../_virtual/_plugin-vue2_normalizer.js";
-var a = function() {
-  var o = this, e = o._self._c, t = o._self._setupProxy;
-  return e("div", { staticClass: "d-f a-i-c accessibility-toolbar" }, [e(t.InButtonV2, { attrs: { id: "guido__a11y-no-images", "data-testid": "Accessibility No Images", "left-icon": "line-no-image-v2", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.loadingStatus, "label-text-status": !1, "selected-status": t.editorStore.imagesHidden, "tooltip-options": t.getTooltipOptions("guido__a11y-no-images"), "tooltip-text": t.imagesTooltip }, on: { click: t.toggleImages } }), e(t.InButtonV2, { attrs: { id: "guido__a11y-code", "data-testid": "Accessibility Code Editor", "left-icon": "line-code", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.loadingStatus, "label-text-status": !1, "selected-status": t.editorStore.isCodeEditorOpen, "tooltip-options": t.getTooltipOptions("guido__a11y-code"), "tooltip-text": t.trans("newsletter.html-editor") }, on: { click: t.toggleCodeEditor } }), e(t.ColorVisionSelect), e(t.InSegments, { attrs: { id: "guido__a11y-view-selection", "with-icon": "", disable: t.editorStore.loadingStatus, "segment-list": t.segmentList, selected: t.editorStore.editorVisualMode }, on: { click: t.handleView } })], 1);
-}, l = [], d = /* @__PURE__ */ s(
-  i,
-  a,
-  l,
-  !1,
-  null,
-  "391019bc"
-);
-const _ = d.exports;
-export {
-  _ as default
-};

package/dist/components/organisms/header/accessibility/AccessibilityToolbar.vue2.js

@@ -1,37 +0,0 @@
-import { defineComponent as d, computed as n } from "vue";
-import { useAccessibilityApi as c } from "../../../../composables/useAccessibilityApi.js";
-import { useTranslations as g } from "../../../../composables/useTranslations.js";
-import { useEditorStore as u } from "../../../../stores/editor.js";
-import { getTooltipOptions as e } from "../../../../utils/tooltipUtils.js";
-import { InSegments as _, InButtonV2 as f } from "@useinsider/design-system-vue";
-import w from "./ColorVisionSelect.vue.js";
-const A = /* @__PURE__ */ d({
-  __name: "AccessibilityToolbar",
-  setup(b) {
-    const t = u(), o = g(), {
-      toggleImages: r,
-      toggleCodeEditor: m,
-      switchToDesktopPreview: i,
-      switchToMobilePreview: s
-    } = c(), l = n(() => [
-      {
-        text: "",
-        icon: "line-desktop",
-        value: "desktop",
-        tooltipText: o("newsletter.desktop"),
-        tooltipOptions: e("guido__a11y-view-desktop")
-      },
-      {
-        text: "",
-        icon: "line-menu-mobileapp",
-        value: "mobile",
-        tooltipText: o("newsletter.mobile"),
-        tooltipOptions: e("guido__a11y-view-mobile")
-      }
-    ]), p = n(() => t.imagesHidden ? o("email-editor.a11y-show-images") : o("email-editor.a11y-hide-images"));
-    return { __sfc: !0, editorStore: t, trans: o, toggleImages: r, toggleCodeEditor: m, switchToDesktopPreview: i, switchToMobilePreview: s, segmentList: l, imagesTooltip: p, handleView: (a) => a === "mobile" ? s() : i(), getTooltipOptions: e, InButtonV2: f, InSegments: _, ColorVisionSelect: w };
-  }
-});
-export {
-  A as default
-};

package/dist/components/organisms/header/accessibility/ColorVisionSelect.vue.js

@@ -1,22 +0,0 @@
-import i from "./ColorVisionSelect.vue2.js";
-/* empty css                       */
-import n from "../../../../_virtual/_plugin-vue2_normalizer.js";
-var l = function() {
-  var o = this, e = o._self._c, t = o._self._setupProxy;
-  return e("div", { staticClass: "color-vision-select p-r" }, [e(t.InButtonV2, { attrs: { id: "guido__a11y-color-vision-trigger", "left-icon": "line-show-on", "right-icon": "line-chevron-small-down", type: "secondary", "disabled-status": t.editorStore.loadingStatus, "label-text": t.selectedOption.text }, on: { click: function(s) {
-    t.isOpen = !t.isOpen;
-  } } }), e(t.InDropdownMenu, { staticClass: "color-vision-select__dropdown", attrs: { id: "guido__a11y-color-vision-menu", "is-wrapped-description": "", "box-width": "basedOnLongestItem", "static-position": "bottom left", "dynamic-position": !1, "max-height": 400, options: t.options, "pre-selected-values": [t.selectedOption], "select-all-option-status": !1, status: t.isOpen }, on: { clickOutside: function(s) {
-    t.isOpen = !1;
-  }, optionClick: t.select } })], 1);
-}, r = [], a = /* @__PURE__ */ n(
-  i,
-  l,
-  r,
-  !1,
-  null,
-  "64cb50da"
-);
-const u = a.exports;
-export {
-  u as default
-};

package/dist/components/organisms/header/accessibility/ColorVisionSelect.vue2.js

@@ -1,48 +0,0 @@
-import { defineComponent as d, ref as p, computed as c } from "vue";
-import { useAccessibilityApi as m } from "../../../../composables/useAccessibilityApi.js";
-import { useTranslations as u } from "../../../../composables/useTranslations.js";
-import { useEditorStore as v } from "../../../../stores/editor.js";
-import { InDropdownMenu as f, InButtonV2 as y } from "@useinsider/design-system-vue";
-const C = /* @__PURE__ */ d({
-  __name: "ColorVisionSelect",
-  setup(K) {
-    const i = "none", a = [
-      {
-        value: i,
-        labelKey: "email-editor.cvd-none"
-      },
-      {
-        value: "protanopia",
-        labelKey: "email-editor.cvd-protanopia",
-        descriptionKey: "email-editor.cvd-protanopia-description"
-      },
-      {
-        value: "deuteranopia",
-        labelKey: "email-editor.cvd-deuteranopia",
-        descriptionKey: "email-editor.cvd-deuteranopia-description"
-      },
-      {
-        value: "tritanopia",
-        labelKey: "email-editor.cvd-tritanopia",
-        descriptionKey: "email-editor.cvd-tritanopia-description"
-      },
-      {
-        value: "achromatopsia",
-        labelKey: "email-editor.cvd-achromatopsia",
-        descriptionKey: "email-editor.cvd-achromatopsia-description"
-      }
-    ], r = v(), o = u(), { setColorVisionDeficiency: n } = m(), s = p(!1), t = c(() => a.map((e) => ({
-      text: o(e.labelKey),
-      value: e.value,
-      ...e.descriptionKey ? { description: o(e.descriptionKey) } : {}
-    }))), l = c(
-      () => t.value.find((e) => e.value === (r.colorVisionDeficiency || i)) ?? t.value[0]
-    );
-    return { __sfc: !0, NONE: i, OPTIONS: a, editorStore: r, trans: o, setColorVisionDeficiency: n, isOpen: s, options: t, selectedOption: l, select: ({ value: e }) => {
-      n(e === i ? "" : e), s.value = !1;
-    }, InButtonV2: y, InDropdownMenu: f };
-  }
-});
-export {
-  C as default
-};

package/dist/components/organisms/onboarding/EditorTabBarOnboarding.vue.js

@@ -1,19 +0,0 @@
-import i from "./EditorTabBarOnboarding.vue2.js";
-/* empty css                            */
-import a from "../../../_virtual/_plugin-vue2_normalizer.js";
-var s = function() {
-  var r, n;
-  var t = this, e = t._self._c, o = t._self._setupProxy;
-  return o.isVisible ? e(o.InOnboard, { key: "guido__tab-bar-onboard", staticClass: "w-21-s p-a z-11", class: (r = o.onboardingStore.getEditorTabBarCurrentCard) == null ? void 0 : r.classes, attrs: { id: o.CARD_ID, "is-multiple-page": "", visible: "", "image-source": "", title: "", "pages-config": o.onboardingStore.onboardings.editorTabBarOnboarding.config, "pointer-position": (n = o.onboardingStore.getEditorTabBarCurrentCard) == null ? void 0 : n.position, "right-position": o.placement.right, "top-position": o.placement.top }, on: { backButtonClick: o.handleBack, close: o.finish, nextButtonClick: o.handleNext } }) : t._e();
-}, c = [], d = /* @__PURE__ */ a(
-  i,
-  s,
-  c,
-  !1,
-  null,
-  "219b4f7c"
-);
-const g = d.exports;
-export {
-  g as default
-};

package/dist/components/organisms/onboarding/EditorTabBarOnboarding.vue2.js

@@ -1,90 +0,0 @@
-import { defineComponent as M, ref as q, computed as P, watch as I, nextTick as N } from "vue";
-import { useConfig as D } from "../../../composables/useConfig.js";
-import { useRibbonOffset as F } from "../../../composables/useRibbonOffset.js";
-import { useTranslations as G } from "../../../composables/useTranslations.js";
-import { useOnboardingStore as K } from "../../../stores/onboarding.js";
-import { InOnboard as $ } from "@useinsider/design-system-vue";
-const Q = /* @__PURE__ */ M({
-  __name: "EditorTabBarOnboarding",
-  setup(H) {
-    const r = "editorTabBarOnboarding", B = "guido__tab-bar-onboard", i = G(), o = K(), { isFeatureEnabled: x } = D(), { getTopPosition: f } = F(), k = () => o.next(r), T = () => o.previous(r), _ = () => void o.close(r), C = 4, O = 17, d = "#guido__kebab-button", b = ".editor-actions-menu__dropdown", c = (t, e, n) => ({
-      classes: "guido-tab-bar-onboarding",
-      position: "Right Top",
-      title: i(t),
-      description: i(e),
-      imageSource: "",
-      backButtonType: "text",
-      backButtonText: i("action-builder.back"),
-      backButtonClick: T,
-      nextButtonType: "text",
-      nextButtonText: i("action-builder.next"),
-      nextButtonClick: k,
-      ...n
-    }), g = { backButtonType: void 0, backButtonText: void 0, backButtonClick: () => {
-    } }, v = () => x("autosave") ? [{
-      card: c("email-editor.onboarding-autosave-title", "email-editor.onboarding-autosave-description", {
-        pinsMenu: !0
-      }),
-      edge: b,
-      target: '[data-attr-value="guido__kebab-autosave"]'
-    }] : [], h = () => [
-      {
-        card: c("email-editor.onboarding-kebab-title", "email-editor.onboarding-kebab-description", g),
-        edge: d,
-        target: d
-      },
-      ...v(),
-      {
-        card: c("email-editor.onboarding-accessibility-title", "email-editor.onboarding-accessibility-description", {
-          nextButtonText: i("action-builder.ok"),
-          nextButtonClick: _,
-          pinsMenu: !0
-        }),
-        edge: b,
-        target: '[data-attr-value="guido__kebab-accessibility"]'
-      }
-    ], y = (t, e) => {
-      if (e <= 0 || e >= t.length)
-        return { steps: t, offset: 0 };
-      const [n, ...a] = t.slice(e);
-      return { steps: [{ ...n, card: { ...n.card, ...g } }, ...a], offset: e };
-    }, l = () => ({ top: f(56), right: "150px" });
-    let s = [];
-    const p = q(l()), m = async () => {
-      var R;
-      await N();
-      const t = s[o.onboardings.editorTabBarOnboarding.cardIndex], e = (R = document.getElementById(B)) == null ? void 0 : R.offsetParent, n = (t && document.querySelector(t.edge)) ?? document.querySelector(d), a = (t && document.querySelector(t.target)) ?? document.querySelector(d);
-      if (!e || !n || !a) {
-        p.value = l();
-        return;
-      }
-      const u = e.getBoundingClientRect(), E = a.getBoundingClientRect();
-      p.value = {
-        top: `${Math.round(E.top + E.height / 2 - u.top - O)}px`,
-        right: `${Math.round(u.right - n.getBoundingClientRect().left - C)}px`
-      };
-    }, A = P(
-      () => o.onboardings.editorTabBarOnboarding.config.length > 0 && o.onboardings.editorTabBarOnboarding.isActive
-    ), S = () => {
-      var t, e;
-      (e = (t = o.getEditorTabBarCurrentCard) == null ? void 0 : t.nextButtonClick) == null || e.call(t);
-    }, w = () => {
-      var t, e;
-      (e = (t = o.getEditorTabBarCurrentCard) == null ? void 0 : t.backButtonClick) == null || e.call(t);
-    };
-    return I(
-      () => o.onboardings.editorTabBarOnboarding.isActive,
-      async (t) => {
-        if (!t)
-          return;
-        await N();
-        const { cardOffset: e, cardIndex: n } = o.onboardings.editorTabBarOnboarding, a = y(h(), e + n);
-        ({ steps: s } = a), o.resetCardIndex(r), o.setConfig(r, s.map((u) => u.card), a.offset), await m();
-      },
-      { immediate: !0 }
-    ), I(() => o.onboardings.editorTabBarOnboarding.cardIndex, m), { __sfc: !0, ONBOARDING: r, CARD_ID: B, trans: i, onboardingStore: o, isFeatureEnabled: x, getTopPosition: f, goNext: k, goBack: T, finish: _, ANCHOR_GAP: C, POINTER_CENTER: O, KEBAB: d, MENU: b, card: c, NO_BACK: g, autoSaveStep: v, buildSteps: h, resumeFrom: y, designFallback: l, steps: s, placement: p, place: m, isVisible: A, handleNext: S, handleBack: w, InOnboard: $ };
-  }
-});
-export {
-  Q as default
-};

package/dist/composables/useAccessibilityApi.js

@@ -1,51 +0,0 @@
-import { ToasterTypeOptions as p } from "../enums/toaster.js";
-import { useEditorStore as m } from "../stores/editor.js";
-import { findEditorApi as d, EDITOR_NOT_READY_MESSAGE as A } from "../utils/stripoEditorApi.js";
-import { useToaster as b } from "./useToaster.js";
-const C = () => {
-  const e = m(), { showToaster: a, handleError: t } = b(), s = (i) => {
-    var g;
-    const o = (g = d()) == null ? void 0 : g.accessibilityApi;
-    if (!o) {
-      a({ type: p.Error, message: A });
-      return;
-    }
-    try {
-      i(o);
-    } catch (y) {
-      t(y, "Accessibility Test action failed");
-    }
-  }, c = () => s((i) => {
-    i.openAccessibilityTestingMode(), e.isAccessibilityTestingOpen = !0;
-  }), r = () => {
-    var i;
-    try {
-      (i = d()) == null || i.accessibilityApi.closeAccessibilityTestingMode();
-    } catch (o) {
-      t(o, "Failed to exit Accessibility Test");
-    } finally {
-      e.isAccessibilityTestingOpen = !1, e.imagesHidden = !1, e.colorVisionDeficiency = "";
-    }
-  }, T = () => e.isAccessibilityTestingOpen ? r() : c(), n = () => s((i) => {
-    i.showImages(), e.imagesHidden = !1;
-  }), l = () => s((i) => {
-    i.hideImages(), e.imagesHidden = !0;
-  });
-  return {
-    openAccessibilityTestingMode: c,
-    closeAccessibilityTestingMode: r,
-    toggleAccessibilityTestingMode: T,
-    showImages: n,
-    hideImages: l,
-    toggleImages: () => e.imagesHidden ? n() : l(),
-    setColorVisionDeficiency: (i) => s((o) => {
-      o.setColorVisionDeficiency(i), e.colorVisionDeficiency = i;
-    }),
-    switchToDesktopPreview: () => s((i) => i.switchToDesktopPreview()),
-    switchToMobilePreview: () => s((i) => i.switchToMobilePreview()),
-    toggleCodeEditor: () => s((i) => i.emitToggleCodeEditor())
-  };
-};
-export {
-  C as useAccessibilityApi
-};

package/dist/src/components/organisms/header/EditorActionsMenu.vue.d.ts

@@ -1,2 +0,0 @@
-declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
-export default _default;

package/dist/src/components/organisms/header/accessibility/AccessibilityToolbar.vue.d.ts

@@ -1,2 +0,0 @@
-declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
-export default _default;

package/dist/src/components/organisms/header/accessibility/ColorVisionSelect.vue.d.ts

@@ -1,2 +0,0 @@
-declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
-export default _default;

package/dist/src/components/organisms/onboarding/EditorTabBarOnboarding.vue.d.ts

@@ -1,2 +0,0 @@
-declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
-export default _default;

package/dist/src/composables/useAccessibilityApi.d.ts

@@ -1,13 +0,0 @@
-import type { ColorVisionDeficiency } from '@@/Types/api/accessibility-api';
-export declare const useAccessibilityApi: () => {
-    openAccessibilityTestingMode: () => void;
-    closeAccessibilityTestingMode: () => void;
-    toggleAccessibilityTestingMode: () => void;
-    showImages: () => void;
-    hideImages: () => void;
-    toggleImages: () => void;
-    setColorVisionDeficiency: (type: ColorVisionDeficiency) => void;
-    switchToDesktopPreview: () => void;
-    switchToMobilePreview: () => void;
-    toggleCodeEditor: () => void;
-};

package/dist/static/styles/components/accessibility.css.js

@@ -1,234 +0,0 @@
-const n = `
-ue-ui-simple-panel.accessibility-panel,
-ue-accessibility-panel {
-    height: 100%;
-}
-
-ue-accessibility-panel .header-control-panel-right {
-    min-width: 50px;
-    min-height: 50px;
-}
-
-ue-accessibility-panel .tabs-header .accent {
-    min-width: 21px;
-    margin-left: 8px;
-    padding: 3px 5px;
-    border: 1px solid var(--guido-color-gray-300);
-    border-radius: 4px;
-    background-color: var(--guido-color-white);
-    color: var(--guido-color-gray-800);
-    font-size: 13px;
-    font-weight: 400;
-    line-height: 16px;
-}
-
-ue-accessibility-panel .tabs-header button.checked .accent {
-    border-color: var(--guido-color-primary-500);
-    color: var(--guido-color-primary-500);
-}
-
-ue-accessibility-panel .issue-card-surface {
-    border-radius: 8px;
-    outline: 1px solid var(--guido-color-gray-300);
-    outline-offset: -1px;
-}
-
-ue-accessibility-panel .issue-card-surface--active {
-    outline-color: var(--guido-color-primary-500);
-}
-
-ue-accessibility-panel .issue-card-title {
-    color: var(--guido-color-gray-800);
-}
-
-ue-accessibility-panel .issue-card-header-row .icon-help {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    width: 24px;
-    height: 24px;
-    color: var(--guido-color-gray-600);
-}
-
-ue-accessibility-panel .issue-card-header-row .icon-help svg {
-    width: 14px;
-    height: 14px;
-}
-
-ue-accessibility-panel .issue-card-header-row ue-icon-component.danger {
-    color: var(--guido-color-danger-500);
-}
-
-ue-accessibility-panel .issue-card-header-row ue-icon-component.warning {
-    color: var(--guido-color-warning-500);
-}
-
-ue-accessibility-panel .issue-card-header-row ue-icon-component.info {
-    color: var(--guido-color-primary-500);
-}
-
-ue-accessibility-passed-tab input,
-ue-accessibility-passed-tab ue-select .toggle-select-button {
-    opacity: 0.6;
-    cursor: not-allowed;
-}
-
-ue-accessibility-panel .controls-separator-line:has(.fit-to-color) {
-    padding: 10px;
-}
-
-ue-accessibility-passed-tab .controls-separator-line:has(.fit-to-color) {
-    padding-bottom: 34px;
-}
-
-ue-accessibility-panel .controls-separator-line:has(.fit-to-color) .sub-container.two-columns {
-    box-sizing: border-box;
-    min-height: 50px;
-    padding: 5px 16px;
-    align-items: center;
-}
-
-ue-accessibility-panel .controls-list.fit-to-color {
-    justify-content: flex-end;
-    align-items: center;
-    gap: 0;
-    font-size: 13px;
-    line-height: 16px;
-}
-
-ue-accessibility-panel .controls-list.fit-to-color ue-icon-component {
-    align-items: center;
-    justify-content: center;
-    width: 24px;
-    height: 24px;
-    margin: 0;
-}
-
-ue-accessibility-panel .controls-list.fit-to-color ue-icon-component svg {
-    width: 16px;
-    height: 16px;
-}
-
-ue-accessibility-panel .controls-list.fit-to-color ue-icon-component.warning {
-    color: var(--guido-color-warning-500);
-}
-
-ue-accessibility-panel {
-    --ue-accessibility-image-width: 240px;
-    --ue-accessibility-image-height: 240px;
-}
-
-ue-accessibility-panel ue-scrollable-container:has(.accessibility-list-empty, ue-accessibility-passed-tab:empty) {
-    flex-grow: 1;
-}
-
-ue-accessibility-panel ue-scrollable-container:has(.accessibility-list-empty, ue-accessibility-passed-tab:empty) .ue-scrollable {
-    height: 100%;
-}
-
-ue-accessibility-panel .ue-scrollable-content:has(.accessibility-list-empty, ue-accessibility-passed-tab:empty) {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    min-height: 100%;
-}
-
-ue-accessibility-panel .accessibility-list-empty.light-theme.failed-list,
-ue-accessibility-panel .accessibility-list-empty.light-theme.ignored-list,
-ue-accessibility-passed-tab:empty::before {
-    display: block;
-    height: auto;
-    margin: 0;
-    padding: 248px 16px 0;
-    background: url("https://image.useinsider.com/insider-design-system/img/speacial/no-personalization.svg") no-repeat center top / 240px 240px;
-    color: var(--guido-color-neutral-500);
-    font-size: 15px;
-    line-height: 24px;
-    text-align: center;
-    white-space: pre-line;
-}
-
-ue-accessibility-passed-tab:empty {
-    display: block;
-}
-
-ue-accessibility-passed-tab:empty::before {
-    content: "No Passed Items\\A You have no passed items.";
-}
-
-ue-accessibility-panel .accessibility-list-empty::first-line,
-ue-accessibility-passed-tab:empty::first-line {
-    color: var(--guido-color-neutral-700);
-    font-size: 18px;
-    line-height: 40px;
-}
-
-ue-accessibility-panel .e2e-ignore-button > .button,
-ue-accessibility-panel .e2e-unignore-button > .button,
-ue-accessibility-panel .e2e-auto-tune-button > .button {
-    border: none;
-    background-color: var(--guido-color-neutral-200);
-    color: var(--guido-color-neutral-800);
-}
-
-ue-accessibility-panel .e2e-ignore-button > .button .icon-button,
-ue-accessibility-panel .e2e-unignore-button > .button .icon-button,
-ue-accessibility-panel .e2e-auto-tune-button > .button .icon-button {
-    color: var(--guido-color-neutral-800);
-}
-
-ue-accessibility-panel .e2e-ignore-button > .button:hover:not(:disabled,.disabled),
-ue-accessibility-panel .e2e-unignore-button > .button:hover:not(:disabled,.disabled),
-ue-accessibility-panel .e2e-auto-tune-button > .button:hover:not(:disabled,.disabled) {
-    background-color: var(--guido-color-neutral-100);
-}
-
-ue-accessibility-panel .e2e-apply-button > .button {
-    border: none;
-    background-color: var(--guido-color-primary-100);
-    color: var(--guido-color-primary-500);
-}
-
-ue-accessibility-panel .e2e-apply-button > .button .icon-button {
-    color: var(--guido-color-primary-500);
-}
-
-ue-accessibility-panel .e2e-apply-button > .button:hover:not(:disabled,.disabled) {
-    background-color: var(--guido-color-primary-0);
-}
-
-.e2e-accessibility-refresh .icon-button {
-    color: var(--guido-color-primary-500);
-}
-
-.ue-popover.dark,
-.ue-popover.dark-tiny {
-    border-radius: 4px;
-    background: var(--guido-color-gray-800);
-    box-shadow: 0 15px 17.5px rgb(0 0 0 / 10%), 0 8px 5px rgb(0 0 0 / 10%);
-    color: var(--guido-color-white);
-    font-size: 13px;
-    line-height: 16px;
-}
-
-.ue-popover.dark .popup-pointer ue-icon-component svg,
-.ue-popover.dark-tiny .popup-pointer ue-icon-component svg {
-    fill: var(--guido-color-gray-800);
-}
-
-.ue-popover.dark a,
-.ue-popover.dark-tiny a,
-.ue-popover.dark ue-description a,
-.ue-popover.dark-tiny ue-description a {
-    color: var(--guido-color-white);
-    text-decoration: underline;
-}
-
-.ue-popover ue-description a[href^="https://act-rules.github.io/"],
-.ue-popover ue-description a[href^="https://dequeuniversity.com/"] {
-    display: inline;
-}
-`;
-export {
-  n as default
-};