@useinsider/guido 3.19.0-beta.c604f7d → 3.19.0-beta.cac604e

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

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

package/dist/composables/useAccessibilityApi.js

@@ -1,35 +0,0 @@
-import { useEditorStore as r } from "../stores/editor.js";
-const A = () => {
-  const e = r(), i = () => window.StripoEditorApi.accessibilityApi, s = () => {
-    i().openAccessibilityTestingMode(), e.isAccessibilityTestingOpen = !0;
-  }, o = () => {
-    try {
-      i().closeAccessibilityTestingMode();
-    } finally {
-      e.isAccessibilityTestingOpen = !1, e.imagesHidden = !1, e.colorVisionDeficiency = "";
-    }
-  }, l = () => e.isAccessibilityTestingOpen ? o() : s(), g = () => i().isAccessibilityTestingModeOpen(), t = () => {
-    i().showImages(), e.imagesHidden = !1;
-  }, c = () => {
-    i().hideImages(), e.imagesHidden = !0;
-  };
-  return {
-    openAccessibilityTestingMode: s,
-    closeAccessibilityTestingMode: o,
-    toggleAccessibilityTestingMode: l,
-    isAccessibilityTestingModeOpen: g,
-    showImages: t,
-    hideImages: c,
-    toggleImages: () => e.imagesHidden ? t() : c(),
-    setColorVisionDeficiency: (n) => {
-      i().setColorVisionDeficiency(n), e.colorVisionDeficiency = n;
-    },
-    getColorVisionDeficiency: () => i().getColorVisionDeficiency(),
-    switchToDesktopPreview: () => i().switchToDesktopPreview(),
-    switchToMobilePreview: () => i().switchToMobilePreview(),
-    toggleCodeEditor: () => i().emitToggleCodeEditor()
-  };
-};
-export {
-  A 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,15 +0,0 @@
-import type { ColorVisionDeficiency } from '@@/Types/api/accessibility-api';
-export declare const useAccessibilityApi: () => {
-    openAccessibilityTestingMode: () => void;
-    closeAccessibilityTestingMode: () => void;
-    toggleAccessibilityTestingMode: () => void;
-    isAccessibilityTestingModeOpen: () => boolean;
-    showImages: () => void;
-    hideImages: () => void;
-    toggleImages: () => void;
-    setColorVisionDeficiency: (type: ColorVisionDeficiency) => void;
-    getColorVisionDeficiency: () => ColorVisionDeficiency;
-    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
-};