@useinsider/guido 3.17.0-beta.668ca65 → 3.17.0-beta.6b5cdfc

package/dist/components/organisms/extensions/recommendation/AssignStrategyDrawer.vue2.js

@@ -1,105 +0,0 @@
-import { defineComponent as v, defineAsyncComponent as u, ref as f, computed as l, watch as O } from "vue";
-import "@useinsider/design-system-organisms/style";
-import { useToaster as x } from "../../../../composables/useToaster.js";
-import { useTranslations as A } from "../../../../composables/useTranslations.js";
-import { DOTTED_DATE_LOCALE as E } from "../../../../enums/date.js";
-import { URLS as h } from "../../../../enums/extensions/recommendationBlock.js";
-import { ToasterTypeOptions as p } from "../../../../enums/toaster.js";
-import { useRecommendationExtensionStore as C } from "../../../../extensions/Blocks/Recommendation/store/recommendation.js";
-import b from "./StrategyInfoBoxContent.vue.js";
-import { formatShortDate as B } from "../../../../utils/dateUtil.js";
-import { escapeHtml as I } from "../../../../utils/htmlEscape.js";
-import { InSkeleton as N } from "@useinsider/design-system-vue";
-const V = /* @__PURE__ */ v({
-  __name: "AssignStrategyDrawer",
-  setup(k) {
-    const c = () => import("@useinsider/design-system-organisms"), g = (t, r) => ({
-      render: (s) => s(N, { props: { sizing: { width: t, height: r } } })
-    }), S = u({
-      loader: async () => (await c()).OrgStrategyDetailModal,
-      loadingComponent: g(480, 240),
-      delay: 0
-    }), T = u({
-      loader: async () => (await c()).OrgStrategyDropdown,
-      loadingComponent: g(240, 42),
-      delay: 0
-    }), o = A(), e = C(), { showToaster: a } = x(), n = f(null), i = f(!1), m = (t) => typeof t == "string" ? t : typeof t == "number" ? String(t) : "", _ = l(() => e.assignStrategyDrawerStatus ? o("email-editor.assign-strategy-description", { url: h.RECOMMENDATION_STRATEGIES_PANEL_PATH }) : "");
-    O(() => e.assignStrategyDrawerStatus, (t) => {
-      if (!t)
-        return;
-      const { strategyId: r } = e.recommendationConfigs;
-      n.value = r || null, i.value = !1, e.fetchStrategies().catch(() => {
-        a({
-          type: p.Error,
-          message: o("discovery-strategy.error-description")
-        });
-      });
-    });
-    const d = (t) => {
-      const r = m(t.updated_at || t.created_at);
-      if (!r)
-        return "";
-      const s = B(r, E);
-      return o("recommendation-strategy.last-updated-on", { value: s });
-    }, D = l(() => e.strategies.map((t) => ({
-      text: t.name,
-      value: t.strategy_id,
-      infoBoxProps: {
-        id: `strategy-info-${t.strategy_id}`,
-        theme: "light",
-        variant: "information",
-        className: "assign-strategy-info-box",
-        titleText: I(m(t.name)),
-        descriptionStatus: !0,
-        descriptionText: d(t),
-        slot: b,
-        slotProps: { strategy: t }
-      }
-    }))), y = l(() => {
-      const t = e.strategies.find((r) => String(r.strategy_id) === String(n.value ?? ""));
-      return t ? { ...t, fallback_config: null } : null;
-    }), w = l(() => ({
-      primaryButton: {
-        styling: "solid",
-        type: "primary",
-        labelText: o("products.assign-btn")
-      },
-      cancelOrBackButton: {
-        styling: "ghost",
-        type: "secondary",
-        labelText: o("products.cancel")
-      }
-    }));
-    return { __sfc: !0, loadOrganisms: c, skeleton: g, OrgStrategyDetailModal: S, OrgStrategyDropdown: T, trans: o, store: e, showToaster: a, selectedStrategyId: n, showSelectionError: i, asText: m, drawerDescription: _, lastUpdatedText: d, strategyOptions: D, selectedStrategy: y, footerButtonGroupOptions: w, closeDrawer: () => {
-      e.closeAssignStrategyDrawer();
-    }, assignStrategy: async () => {
-      const t = y.value;
-      if (!t) {
-        i.value = !0;
-        return;
-      }
-      let r = "";
-      try {
-        r = await e.resolveStrategyUrlTemplate(t, e.recommendationConfigs.currencySettings.value);
-      } catch (s) {
-        console.error("[AssignStrategyDrawer] resolveStrategyUrlTemplate failed", s);
-      }
-      if (!r) {
-        a({
-          type: p.Error,
-          message: o("email-editor.strategy-assign-failed", { strategyName: t.name })
-        });
-        return;
-      }
-      e.assignStrategy(t), a({
-        type: p.Success,
-        message: o("email-editor.strategy-assigned-success", { strategyName: t.name })
-      }), e.closeAssignStrategyDrawer();
-    }, onSelect: (t) => {
-      n.value = t.value, i.value = !1;
-    } };
-  }
-});
-export {
-  V as default
-};

package/dist/components/organisms/extensions/recommendation/StrategyInfoBoxContent.vue.js

@@ -1,19 +0,0 @@
-import r from "./StrategyInfoBoxContent.vue2.js";
-import _ from "../../../../_virtual/_plugin-vue2_normalizer.js";
-var c = function() {
-  var t = this, s = t._self._c, n = t._self._setupProxy;
-  return s("div", { staticClass: "d-f f-d-c mt-3" }, t._l(n.details, function(e, a) {
-    return s("div", { key: e.title, staticClass: "d-f f-d-c", class: { "mt-2": a > 0 } }, [s("span", { staticClass: "f-s-1 f-w-600 l-h-1 t-c-52 mb-12" }, [t._v(t._s(e.title))]), s("span", { staticClass: "f-s-1 l-h-6 t-c-55 w-b-b-w" }, [t._v(t._s(e.value))])]);
-  }), 0);
-}, f = [], l = /* @__PURE__ */ _(
-  r,
-  c,
-  f,
-  !1,
-  null,
-  null
-);
-const p = l.exports;
-export {
-  p as default
-};

package/dist/components/organisms/extensions/recommendation/StrategyInfoBoxContent.vue2.js

@@ -1,62 +0,0 @@
-import { defineComponent as v, computed as i } from "vue";
-import { useTranslations as _ } from "../../../../composables/useTranslations.js";
-const A = /* @__PURE__ */ v({
-  __name: "StrategyInfoBoxContent",
-  props: {
-    strategy: null
-  },
-  setup(p) {
-    const s = p, n = _(), o = (t) => typeof t == "string" ? t : typeof t == "number" ? String(t) : "", a = i(() => n("recommendation-strategy.none")), u = i(() => {
-      const t = o(s.strategy.algorithm) === "MIXED" ? n("discovery-strategy.mixed-algorithm") : n("discovery-strategy.single-algorithm"), e = o(s.strategy.algorithm_used).split(",").map((r) => r.trim()).filter(Boolean).map((r) => n(`recommendation-algorithm-names.${r.replaceAll("_", "-").toLowerCase()}`));
-      return e.length ? `${t} · ${e.join(", ")}` : t;
-    }), g = i(() => [
-      [s.strategy.exclude_view, "discovery-strategy.exclude-recently-view-items"],
-      [s.strategy.exclude_purchase, "discovery-strategy.exclude-recently-purchased-items"],
-      [s.strategy.exclude_cart, "discovery-strategy.exclude-recently-added-cart-items"]
-    ].filter(([t]) => Number(t) === 1).map(([, t]) => n(t)).join(", ") || a.value), l = (t) => {
-      const e = o(t).trim();
-      if (!e)
-        return "";
-      let r;
-      try {
-        r = JSON.parse(e);
-      } catch {
-        return e;
-      }
-      if (Array.isArray(r))
-        return r.length ? String(r.length) : "";
-      if (r && typeof r == "object") {
-        const c = Object.keys(r).length;
-        return c ? String(c) : "";
-      }
-      return e;
-    }, d = i(() => l(s.strategy.manual_merchandising) || l(s.strategy.manual_merchandising_products) || a.value), m = (t) => {
-      if (Array.isArray(t))
-        return t.length;
-      const { conditionList: e } = t ?? {};
-      return Array.isArray(e) ? e.length : 1;
-    }, y = i(() => {
-      const t = s.strategy.filters;
-      if (!t)
-        return a.value;
-      try {
-        const e = typeof t == "string" ? JSON.parse(t) : t;
-        if (!e || typeof e != "object")
-          return a.value;
-        const r = Object.values(e).reduce((c, f) => c + m(f), 0);
-        return r ? String(r) : a.value;
-      } catch {
-        return a.value;
-      }
-    }), h = i(() => [
-      { title: n("gpt-app-builder.algorithms-and-method"), value: u.value },
-      { title: n("gpt-app-builder.exclusions"), value: g.value },
-      { title: n("discovery-strategy.filters"), value: y.value },
-      { title: n("action-builder.manual-merchandising"), value: d.value }
-    ]);
-    return { __sfc: !0, props: s, trans: n, asText: o, none: a, algorithmsAndMethod: u, exclusions: g, asMerchandising: l, manualMerchandising: d, conditionsIn: m, filters: y, details: h };
-  }
-});
-export {
-  A as default
-};

package/dist/extensions/Blocks/Recommendation/controls/main/strategy.js

@@ -1,124 +0,0 @@
-var d = Object.defineProperty;
-var y = (r, s, t) => s in r ? d(r, s, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[s] = t;
-var o = (r, s, t) => y(r, typeof s != "symbol" ? s + "" : s, t);
-import { ACADEMY_LINKS as m } from "../../../../../enums/academy.js";
-import { CommonControl as h } from "../../../common-control.js";
-import { useRecommendationExtensionStore as u } from "../../store/recommendation.js";
-const p = "recommendation-strategy-control";
-class f extends h {
-  constructor() {
-    super(...arguments);
-    o(this, "store", u());
-    o(this, "storeUnsubscription", () => {
-    });
-    o(this, "listeners", []);
-    o(this, "lastPaintedState", null);
-  }
-  getId() {
-    return p;
-  }
-  getTemplate() {
-    const t = this.api.translate(
-      "You can assign a recommendation strategy by selecting an existing one or creating a new one to show specific content."
-    ), e = this.api.translate("For more information, you can"), a = this.api.translate("visit Academy");
-    return `
-            <div class="strategy-control-container">
-                <div class="strategy-control-header">
-                    <h3 class="strategy-control-title">${this.api.translate("Recommendation Strategy")}</h3>
-                </div>
-                <div class="strategy-control-description-row">
-                    <p class="strategy-control-description">
-                        ${t}
-                        ${e}
-                        <a
-                            href="${m.EMAIL_RECOMMENDATION_BLOCK}"
-                            target="_blank"
-                            rel="noopener noreferrer">${a}</a>.
-                    </p>
-                </div>
-                <div data-strategy-empty-state>
-                    ${this._GuTwoColumns([
-      this._GuButton({
-        name: "assignStrategy",
-        label: this.api.translate("Assign Strategy"),
-        id: "guido__btn-assign-strategy",
-        className: "strategy-control-cta on"
-      }),
-      this._GuButton({
-        name: "createStrategy",
-        label: this.api.translate("Create New Strategy"),
-        id: "guido__btn-create-strategy",
-        className: "strategy-control-cta primary",
-        disabled: !0
-      })
-    ], "strategy-control-cta-row")}
-                </div>
-                <div data-strategy-assigned-state style="display: none;">
-                    <div class="strategy-control-name-band">
-                        <span class="strategy-control-name" data-strategy-name></span>
-                    </div>
-                    <div class="strategy-control-actions">
-                        ${this._strategyAction({
-      id: "guido__btn-change-strategy",
-      label: this.api.translate("Change"),
-      modifier: "change"
-    })}
-                        ${this._strategyAction({
-      id: "guido__btn-remove-strategy",
-      label: this.api.translate("Remove"),
-      modifier: "remove"
-    })}
-                    </div>
-                </div>
-            </div>
-        `;
-  }
-  _strategyAction({ id: t, label: e, modifier: a }) {
-    return `
-            <button
-                id="${t}"
-                type="button"
-                class="strategy-control-action strategy-control-action--${a}">
-                <span>${e}</span>
-            </button>
-        `;
-  }
-  onRender() {
-    this._teardown(), this._setupButtonListeners(), this._renderState(), this.storeUnsubscription = this.store.$subscribe(() => {
-      this._renderState();
-    }), this.store.recommendationConfigs.strategyId && !this.store.strategies.length && this.store.fetchStrategies().catch(() => {
-    });
-  }
-  onDestroy() {
-    this._teardown();
-  }
-  _teardown() {
-    this.storeUnsubscription(), this.storeUnsubscription = () => {
-    }, this.lastPaintedState = null, this.listeners.forEach(({ element: t, handler: e }) => t.removeEventListener("click", e)), this.listeners = [];
-  }
-  _setupButtonListeners() {
-    const t = this.getContainer();
-    if (!t)
-      return;
-    const e = (a, n) => {
-      const i = t.querySelector(a);
-      i && (i.addEventListener("click", n), this.listeners.push({ element: i, handler: n }));
-    };
-    e("#guido__btn-assign-strategy", () => this.store.openAssignStrategyDrawer()), e("#guido__btn-change-strategy", () => this.store.openAssignStrategyDrawer()), e("#guido__btn-remove-strategy", () => this.store.removeStrategy());
-  }
-  _renderState() {
-    var l;
-    const { strategyId: t } = this.store.recommendationConfigs, e = t ? ((l = this.store.assignedStrategy) == null ? void 0 : l.name) ?? "" : "", a = `${t}\0${e}`;
-    if (a === this.lastPaintedState)
-      return;
-    const n = this.getContainer();
-    if (!n)
-      return;
-    const i = n.querySelector("[data-strategy-empty-state]"), c = n.querySelector("[data-strategy-assigned-state]"), g = n.querySelector("[data-strategy-name]");
-    !i || !c || (i.style.display = t ? "none" : "", c.style.display = t ? "" : "none", g && t && (g.textContent = e || `#${t}`), this.lastPaintedState = a);
-  }
-}
-export {
-  p as STRATEGY_CONTROL_ID,
-  f as StrategyControl
-};

package/dist/src/components/organisms/extensions/recommendation/AssignStrategyDrawer.vue.d.ts

@@ -1,3 +0,0 @@
-import '@useinsider/design-system-organisms/style';
-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/extensions/recommendation/StrategyInfoBoxContent.vue.d.ts

@@ -1,15 +0,0 @@
-import type { RrsStrategy } from '@@/Types/recommendation';
-type __VLS_Props = {
-    strategy: RrsStrategy;
-};
-declare const _default: import("vue").DefineComponent<__VLS_TypePropsToOption<__VLS_Props>, {}, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToOption<__VLS_Props>>>, {}>;
-export default _default;
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToOption<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};

package/dist/src/extensions/Blocks/Recommendation/controls/main/strategy.d.ts

@@ -1,16 +0,0 @@
-import { CommonControl } from '../../../common-control';
-export declare const STRATEGY_CONTROL_ID = "recommendation-strategy-control";
-export declare class StrategyControl extends CommonControl {
-    private store;
-    private storeUnsubscription;
-    private listeners;
-    private lastPaintedState;
-    getId(): string;
-    getTemplate(): string;
-    private _strategyAction;
-    onRender(): void;
-    onDestroy(): void;
-    private _teardown;
-    private _setupButtonListeners;
-    private _renderState;
-}

package/dist/src/mock/api/recommendation-strategies.d.ts

@@ -1,2 +0,0 @@
-declare const _default: import("msw").HttpHandler[];
-export default _default;

package/dist/static/assets/icons/line-change.svg.js

@@ -1,5 +0,0 @@
-const l = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill-rule="evenodd" clip-rule="evenodd" d="M17.768 11.694a1.03 1.03 0 0 1-1.465 0 1.051 1.051 0 0 1 0-1.478L17.51 9H9a1 1 0 1 1 0-2h8.509l-1.206-1.216a1.051 1.051 0 0 1 0-1.478 1.03 1.03 0 0 1 1.465 0l2.929 2.955c.404.408.404 1.07 0 1.478l-2.93 2.955zM3.303 15.261a1.051 1.051 0 0 0 0 1.478l2.93 2.955a1.03 1.03 0 0 0 1.464 0 1.051 1.051 0 0 0 0-1.478L6.49 17H15a1 1 0 1 0 0-2H6.491l1.206-1.216a1.051 1.051 0 0 0 0-1.478 1.03 1.03 0 0 0-1.465 0l-2.929 2.955z"/></svg>
-`;
-export {
-  l as default
-};

package/dist/static/assets/icons/line-delete.svg.js

@@ -1,5 +0,0 @@
-const a = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill-rule="evenodd" clip-rule="evenodd" d="M10 3a2 2 0 0 0-2 2v2H5a1 1 0 0 0 0 2h1v10a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V9h1a1 1 0 1 0 0-2h-3V5a2 2 0 0 0-2-2h-4zm4 4h-4V5h4v2zm-4 2h6v10H8V9h2zm2 2a1 1 0 0 0-1 1v4a1 1 0 1 0 2 0v-4a1 1 0 0 0-1-1z"></path></svg>
-`;
-export {
-  a as default
-};

package/dist/static/assets/icons/line-plus.svg.js

@@ -1,5 +0,0 @@
-const a = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill-rule="evenodd" clip-rule="evenodd" d="M12 5a1 1 0 0 0-1 1v5H6a1 1 0 1 0 0 2h5v5a1 1 0 1 0 2 0v-5h5a1 1 0 1 0 0-2h-5V6a1 1 0 0 0-1-1z"></path></svg>
-`;
-export {
-  a as default
-};

package/dist/static/styles/components/recommendation-strategy.css.js

@@ -1,155 +0,0 @@
-const n = `.strategy-control-header {
-    padding: 16px 16px 0;
-}
-
-.strategy-control-title {
-    margin: 0;
-    color: var(--guido-color-gray-800);
-    font-size: 16px;
-    font-weight: 600;
-    line-height: 24px;
-}
-
-.strategy-control-description-row {
-    padding: 8px 16px 16px;
-}
-
-.strategy-control-description {
-    margin: 0;
-    color: var(--guido-color-gray-600);
-    font-size: 13px;
-    line-height: 16px;
-}
-
-.strategy-control-description a {
-    color: var(--guido-color-primary-500);
-    text-decoration: underline;
-}
-
-.recommendation-controls-container .container.strategy-control-cta-row {
-    grid-template-columns: repeat(2, minmax(0, 180px));
-    justify-content: start;
-    gap: 16px;
-    padding: 0 16px 16px;
-}
-
-.strategy-control-cta {
-    width: 100%;
-}
-
-.strategy-control-cta > .button {
-    display: flex;
-    gap: 8px;
-    justify-content: center;
-    width: 100%;
-    border: none;
-    font-size: 15px;
-    font-weight: 400;
-    line-height: 24px;
-    white-space: nowrap;
-}
-
-.strategy-control-cta.primary > .button:disabled,
-.strategy-control-cta.primary > .button.disabled {
-    opacity: 1;
-    color: var(--guido-color-gray-800);
-    cursor: default;
-}
-
-.strategy-control-name-band {
-    display: flex;
-    align-items: center;
-    min-height: 48px;
-    padding: 0 16px;
-    background-color: var(--guido-color-gray-0);
-}
-
-.strategy-control-name {
-    color: var(--guido-color-gray-800);
-    font-size: 15px;
-    font-weight: 600;
-    line-height: 24px;
-}
-
-.strategy-control-actions {
-    display: flex;
-    align-items: center;
-    padding: 16px;
-}
-
-.strategy-control-action {
-    display: inline-flex;
-    align-items: center;
-    padding: 0;
-    border: none;
-    background: none;
-    font-size: 15px;
-    font-weight: 400;
-    line-height: 24px;
-    cursor: pointer;
-}
-
-.strategy-control-action > span {
-    padding: 0 8px;
-}
-
-.strategy-control-action::before,
-.strategy-control-cta.on > .button::before {
-    content: '';
-    flex: none;
-    width: 24px;
-    height: 24px;
-    background-color: currentcolor;
-    mask-repeat: no-repeat;
-    mask-position: center;
-    mask-size: 24px 24px;
-}
-
-.strategy-control-action--change::before {
-    mask-image: var(--guido-icon-line-change);
-}
-
-.strategy-control-action--remove::before {
-    mask-image: var(--guido-icon-line-delete);
-}
-
-.strategy-control-cta.on > .button::before {
-    mask-image: var(--guido-icon-line-plus);
-}
-
-.strategy-control-action--change {
-    color: var(--guido-color-primary-500);
-}
-
-.strategy-control-action--remove {
-    color: var(--guido-color-danger-500);
-}
-
-.strategy-control-action:hover {
-    text-decoration: underline;
-}
-
-.recommendation-controls-container:not(.strategy-block) .strategy-control-container,
-.recommendation-controls-container.strategy-block .product-count-control-container,
-.recommendation-controls-container.strategy-block .algorithm-control-container,
-.recommendation-controls-container.strategy-block .filters-control-container,
-.recommendation-controls-container.strategy-block .shuffle-control-container {
-    display: none;
-}
-
-.recommendation-controls-container.strategy-block {
-    display: flex;
-    flex-direction: column;
-}
-
-.recommendation-controls-container.strategy-block .price-placement-control-container {
-    order: 1;
-}
-
-.recommendation-controls-container.strategy-block .product-layout-control-container {
-    order: 2;
-}
-`;
-export {
-  n as default
-};