@useinsider/guido 3.19.0-beta.80b64cf → 3.19.0-beta.84c97db

package/dist/src/stores/recommendation.d.ts

@@ -6,5 +6,10 @@ type RecommendationConfig = {
 interface StoreState {
     recommendationConfigs: RecommendationConfig[];
 }
+/**
+ * @deprecated recommendationConfigs has no writer in src/, so the store is
+ * permanently empty and its only readers (useHtmlValidator.ts:496-497) are a
+ * no-op. Slated for deletion, see the SD-667788 dead-code ledger.
+ */
 export declare const useRecommendationStore: import("pinia").StoreDefinition<"guidoRecommendation", StoreState, {}, {}>;
 export {};

package/dist/src/stores/version-history.d.ts

@@ -1,4 +1,4 @@
-import type { VersionHistoryState } from '@@/Types/version-history-api';
+import type { VersionHistoryState } from '@@/Types/api/version-history-api';
 export interface StoreState extends VersionHistoryState {
     editorVisualMode: 'desktop' | 'mobile';
 }

package/dist/src/utils/dateUtil.d.ts

@@ -3,12 +3,22 @@
  * en-US -> MM/DD/YYYY
  * en-GB -> DD/MM/YYYY
  * tr-TR -> DD.MM.YYYY
+ *
+ * The non-string branches below are unreachable: the only caller chain is
+ * formatShortDate -> AssignStrategyDrawer.vue:74, which passes a non-empty string.
+ * The function itself is live — do not delete it with them.
  */
 export declare const convertToDateObject: (date: string | number | Date | null | undefined) => Date;
 export declare const locale: () => string;
 export declare const localTz: string;
 export declare const timezone: () => string;
+/**
+ * @deprecated No caller in src/ and not exported from library.ts. Slated for deletion, see the SD-667788 dead-code ledger.
+ */
 export declare const hour12: () => boolean;
+/**
+ * @deprecated No caller in src/ and not exported from library.ts. Slated for deletion, see the SD-667788 dead-code ledger.
+ */
 export declare const dateFormat: () => string;
 /**
  * @example 04/22/2024

package/dist/src/utils/genericUtil.d.ts

@@ -24,6 +24,9 @@ export declare const getCsrfToken: () => string;
  */
 export declare const getUrlParams: () => URLSearchParams;
 export declare const getUrlParam: (paramName: string, defaultValue?: string) => string;
+/**
+ * @deprecated No caller in src/. Slated for deletion, see the SD-667788 dead-code ledger.
+ */
 export declare const replaceString: (string?: string, values?: Record<string, string | number>, isRemoveEmptyValues?: boolean) => string;
 /**
  * Narrows an unknown API value to a printable string; anything that is neither

package/dist/src/utils/timeUtil.d.ts

@@ -6,3 +6,8 @@
  * @example formatLocalTime(date, true)        -> 12:20:02 (UTC+3 Istanbul)
  */
 export declare const formatLocalTime: (date: Date, useTimezone?: boolean) => string;
+export declare const autoSaveTimestamp: (date: Date, now?: Date) => {
+    isToday: boolean;
+    time: string;
+    date: string;
+};

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

@@ -0,0 +1,234 @@
+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
+};

package/dist/static/styles/components/version-history.css.js

@@ -1,4 +1,4 @@
-const n = `.patch-session-container {
+const r = `.patch-session-container {
     row-gap: 16px;
 }
 
@@ -28,11 +28,7 @@ ue-vh-patch.selected .patch-wrapper {
 .change-history-panel-wrapper .control-panel-header {
     padding: 16px 0 16px 16px;
 }
-
-.change-history-panel-wrapper .header-control-panel-label {
-    grid-area: 1 / 1 / 2 / 12;
-}
 `;
 export {
-  n as default
+  r as default
 };

package/dist/static/styles/variables.css.js

@@ -14,8 +14,10 @@ const o = `:host {
     --guido-color-gray-0: #F9F9F9;
     --guido-color-neutral-800: #222938;
     --guido-color-neutral-700: #2C3546;
+    --guido-color-neutral-500: #5D6980;
     --guido-color-neutral-200: #DCDFE6;
     --guido-color-neutral-100: #EFF2F4;
+    --guido-color-warning-500: #FFBF00;
     --guido-color-danger-300: #e84342;
     --guido-color-danger-500: #DC2A2A; 
     --guido-box-shadow: 0 4px 12px 0 rgba(44,53,70,0.15);

package/dist/stores/autosave.js

@@ -1,17 +1,22 @@
-import { defineStore as t } from "pinia";
-const e = {
+import { defineStore as e } from "pinia";
+const s = {
   IDLE: "idle",
   SAVING: "saving",
   SAVED: "saved",
   ERROR: "error"
-}, o = t("guidoAutosave", {
+}, S = e("guidoAutosave", {
   state: () => ({
     isOn: !0,
     lastSavedAt: null,
-    status: e.IDLE
-  })
+    status: s.IDLE
+  }),
+  getters: {
+    // Whether the header actually renders autosave text: the divider beside it must not be
+    // left hanging over empty space when it does not.
+    hasStatusLabel: (t) => t.status === s.SAVING || t.status === s.SAVED && t.lastSavedAt !== null
+  }
 });
 export {
-  e as AUTOSAVE_STATUS,
-  o as useAutosaveStore
+  s as AUTOSAVE_STATUS,
+  S as useAutosaveStore
 };

package/dist/stores/editor.js

@@ -6,6 +6,9 @@ const o = e("guidoEditor", {
     isSaveAsTemplateDrawerOpen: !1,
     isVersionHistoryOpen: !1,
     isPreviewModeOpen: !1,
+    isAccessibilityTestingOpen: !1,
+    imagesHidden: !1,
+    colorVisionDeficiency: "",
     editorVisualMode: "desktop",
     hasChanges: !1,
     // Bumped on every Stripo document change. `hasChanges` is a latch that stays
@@ -21,20 +24,20 @@ const o = e("guidoEditor", {
   }),
   getters: {
     // Middle Slot
-    isEditorToolbarVisible: (i) => !i.isVersionHistoryOpen && !i.isPreviewModeOpen,
+    isEditorToolbarVisible: (i) => !i.isVersionHistoryOpen && !i.isPreviewModeOpen && !i.isAccessibilityTestingOpen,
     isUndoButtonDisabled: (i) => i.loadingStatus || i.isPreviewModeOpen,
     isRedoButtonDisabled: (i) => i.loadingStatus || i.isPreviewModeOpen,
     isCodeEditorButtonDisabled: (i) => i.loadingStatus || i.isPreviewModeOpen,
     isPreviewButtonDisabled: (i) => i.loadingStatus,
     isViewOptionsDisabled: (i) => i.loadingStatus || i.isPreviewModeOpen,
     // Right Slot
+    isNormalMode: (i) => !i.isVersionHistoryOpen && !i.isAccessibilityTestingOpen,
     isVersionHistoryButtonDisabled: (i) => i.loadingStatus || i.isPreviewModeOpen,
     isExportButtonDisabled: (i) => i.loadingStatus || i.isVersionHistoryOpen,
     isSaveAsButtonDisabled: (i) => i.loadingStatus || i.isVersionHistoryOpen,
     isTestButtonDisabled: (i) => i.loadingStatus || i.isVersionHistoryOpen,
-    isSaveButtonDisabled: (i) => i.loadingStatus || i.isVersionHistoryOpen || i.isPreviewModeOpen,
-    // Autosave
-    isInSaveableState: (i) => !i.loadingStatus && !i.isVersionHistoryOpen && !i.isPreviewModeOpen && !i.isCodeEditorOpen
+    isSaveButtonDisabled: (i) => i.loadingStatus || i.isVersionHistoryOpen || i.isPreviewModeOpen || i.isAccessibilityTestingOpen,
+    isInSaveableState: (i) => !i.loadingStatus && !i.isVersionHistoryOpen && !i.isPreviewModeOpen && !i.isCodeEditorOpen && !i.isAccessibilityTestingOpen
   }
 });
 export {

package/dist/stores/guido-email-editor.js

@@ -4,7 +4,9 @@ const d = e("guidoEmailEditor", {
     html: "",
     css: "",
     lastUpdatedAt: 0,
-    templateId: ""
+    templateId: "",
+    bridgeActive: !1,
+    applyAcks: {}
   }),
   getters: {
     /** True once the bridge has published at least one snapshot. */

package/dist/stores/onboarding.js

@@ -1,27 +1,32 @@
-import { useOnboardingApi as e } from "../services/onboardingApi.js";
+import { useOnboardingApi as t } from "../services/onboardingApi.js";
 import { defineStore as s } from "pinia";
-const t = () => ({
+const e = () => ({
   cardIndex: 0,
   isActive: !1,
-  config: []
+  config: [],
+  cardOffset: 0
 }), a = () => ({
   onboardings: {
-    newVersionPopup: t(),
-    genericOnboarding: t(),
-    textBlockOnboarding: t(),
-    versionHistoryOnboarding: t(),
-    ampOnboarding: t(),
-    itemsOnboarding: t(),
-    recommendationStrategyOnboarding: t(),
-    recommendationLegacyStrategyOnboarding: t()
+    newVersionPopup: e(),
+    genericOnboarding: e(),
+    textBlockOnboarding: e(),
+    versionHistoryOnboarding: e(),
+    ampOnboarding: e(),
+    itemsOnboarding: e(),
+    editorTabBarOnboarding: e(),
+    recommendationStrategyOnboarding: e(),
+    recommendationLegacyStrategyOnboarding: e()
   },
   userModalState: {},
-  isFetched: !1
-}), c = s("guidoOnboarding", {
+  isFetched: !1,
+  closedThisSession: []
+}), g = s("guidoOnboarding", {
   state: () => a(),
   getters: {
+    /** @deprecated Components use the type-specific getters. Slated for deletion, see the SD-667788 dead-code ledger. */
     getOnboarding: (n) => (o) => n.onboardings[o],
     isActive: (n) => (o) => n.onboardings[o].isActive,
+    /** @deprecated Components use getGenericCurrentCard / getTextBlockCurrentCard. Slated for deletion, see the SD-667788 dead-code ledger. */
     getCurrentCard: (n) => (o) => {
       const i = n.onboardings[o];
       return i.config[i.cardIndex];
@@ -46,6 +51,14 @@ const t = () => ({
       const { itemsOnboarding: o } = n.onboardings;
       return o.config[o.cardIndex];
     },
+    getEditorTabBarCurrentCard: (n) => {
+      const { editorTabBarOnboarding: o } = n.onboardings;
+      return o.config[o.cardIndex];
+    },
+    isEditorActionsMenuPinned: (n) => {
+      const { editorTabBarOnboarding: o } = n.onboardings, i = o.config[o.cardIndex];
+      return o.isActive && !!(i != null && i.pinsMenu);
+    },
     getRecommendationStrategyCurrentCard: (n) => {
       const { recommendationStrategyOnboarding: o } = n.onboardings;
       return o.config[o.cardIndex];
@@ -63,7 +76,10 @@ const t = () => ({
     closeOtherOnboardings(n) {
       Object.keys(this.onboardings).forEach((o) => {
         const i = o;
-        i !== n && this.onboardings[i].isActive && (this.onboardings[i].isActive = !1, this.onboardings[i].cardIndex = 0, this.onboardings[i].config = []);
+        if (i !== n && this.onboardings[i].isActive) {
+          const r = this.onboardings[i];
+          r.cardOffset += r.cardIndex, r.isActive = !1, r.cardIndex = 0, r.config = [];
+        }
       });
     },
     start(n) {
@@ -72,8 +88,16 @@ const t = () => ({
     startOnboarding(n) {
       this.shouldShowOnboarding(n) && !this.isActive(n) && this.start(n);
     },
+    closeForSession(n) {
+      this.closedThisSession.includes(n) || this.closedThisSession.push(n), this.onboardings[n].isActive = !1, this.onboardings[n].cardIndex = 0, this.onboardings[n].config = [], this.onboardings[n].cardOffset = 0;
+    },
     async close(n) {
-      await this.setUserModalState(n, "true", "Guido"), this.onboardings[n].isActive = !1, this.onboardings[n].cardIndex = 0, this.onboardings[n].config = [];
+      this.closeForSession(n);
+      try {
+        await this.setUserModalState(n, "true", "Guido");
+      } catch (o) {
+        console.warn("guido:onboarding:close-not-persisted", n, o);
+      }
     },
     next(n) {
       this.onboardings[n].cardIndex < this.onboardings[n].config.length - 1 && this.onboardings[n].cardIndex++;
@@ -81,15 +105,16 @@ const t = () => ({
     previous(n) {
       this.onboardings[n].cardIndex > 0 && this.onboardings[n].cardIndex--;
     },
+    /** @deprecated No caller in src/. Slated for deletion, see the SD-667788 dead-code ledger. */
     updateCardPosition(n, o, i) {
       const r = this.onboardings[n].config[o];
       r && (r.top = i.top, r.position = i.position);
     },
-    setConfig(n, o) {
-      this.onboardings[n].config = o ?? [], this.onboardings[n].cardIndex >= this.onboardings[n].config.length && (this.onboardings[n].cardIndex = 0);
+    setConfig(n, o, i = 0) {
+      this.onboardings[n].config = o ?? [], this.onboardings[n].cardOffset = i, this.onboardings[n].cardIndex >= this.onboardings[n].config.length && (this.onboardings[n].cardIndex = 0);
     },
     async onDiscoverNowClicked() {
-      await this.setUserModalState("newVersionPopup", "true", "Guido"), await this.setUserModalState("genericOnboarding", "true", "Guido"), this.start("genericOnboarding");
+      this.start("genericOnboarding"), await this.setUserModalState("newVersionPopup", "true", "Guido"), await this.setUserModalState("genericOnboarding", "true", "Guido");
     },
     onRemindMeLater() {
       sessionStorage.setItem("newVersionPopupDismissed", "true");
@@ -97,13 +122,14 @@ const t = () => ({
     async onNewVersionPopupClose() {
       await this.setUserModalState("newVersionPopup", "true", "Guido");
     },
+    /** @deprecated No caller in src/. Slated for deletion, see the SD-667788 dead-code ledger. */
     isOnboardingActive() {
       return Object.values(this.onboardings).some((n) => n.isActive);
     },
     async fetchUserModalState() {
       if (this.isFetched)
         return;
-      const { fetchUserModalState: n } = e();
+      const { fetchUserModalState: n } = t();
       try {
         const o = await n();
         this.userModalState = o, this.isFetched = !0;
@@ -111,11 +137,11 @@ const t = () => ({
       }
     },
     async setUserModalState(n, o, i) {
-      const { setUserModalState: r } = e();
+      const { setUserModalState: r } = t();
       await r(n, o, i), this.isFetched = !1, await this.fetchUserModalState();
     }
   }
 });
 export {
-  c as useOnboardingStore
+  g as useOnboardingStore
 };