@useinsider/guido 2.1.0-beta.7d0f92a → 2.1.0-beta.860ef21

package/dist/extensions/Blocks/Recommendation/control.js

@@ -0,0 +1,336 @@
+var p = Object.defineProperty;
+var S = (a, s, e) => s in a ? p(a, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : a[s] = e;
+var u = (a, s, e) => S(a, typeof s != "symbol" ? s + "" : s, e);
+import { currencyDecimalCounts as _, currencyOperators as C, currencyLocationMaps as R } from "../../../enums/extensions/recommendationBlock.js";
+import { UEAttr as O, ModificationDescription as g } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+import { CommonControl as U } from "../common-control.js";
+import { useRecommendationExtensionStore as N } from "./store/recommendation.js";
+import { prepareProductRows as E } from "./templates/blockTemplate.js";
+import { DEFAULT_CARD_COMPOSITION as d, getDefaultProducts as L } from "./templates/templateUtils.js";
+import { useDebounceFn as T } from "../../../node_modules/@vueuse/shared/index.js";
+const f = "ui-elements-recommendation-block", t = {
+  ALGORITHM: "strategy",
+  PRODUCT_IDS: "productIds",
+  LOCALE: "language",
+  CURRENCY: "value",
+  CURRENCY_LOCATION: "alignment",
+  CURRENCY_SYMBOL: "symbol",
+  CURRENCY_THOUSAND_SEPARATOR: "thousandSeparator",
+  CURRENCY_DECIMAL_SEPARATOR: "decimalSeparator",
+  CURRENCY_DECIMAL_COUNT: "decimalCount",
+  FILTERS: "filterStatus",
+  PRODUCT_COUNT: "size",
+  PRODUCT_IN_ROW: "cardsInRow",
+  SHUFFLE_PRODUCTS: "shuffleProducts"
+};
+class Y extends U {
+  constructor() {
+    super(...arguments);
+    u(this, "store", N());
+    u(this, "storeUnsubscription", () => {
+    });
+    u(this, "addFilterListener", () => {
+    });
+    u(this, "addFilterButton", null);
+    u(this, "_debouncedRegenerateProductRows", T(() => {
+      this._regenerateProductRows();
+    }, 500));
+  }
+  getId() {
+    return f;
+  }
+  getTemplate() {
+    return `
+            <div class="recommendation-controls-container">
+                ${this._getAlgorithms()}
+                ${this._getLanguages()}
+                ${this._getCurrency()}
+                ${this._getFilterStatus()}
+                ${this._getProductLayout()}
+                ${this._getShuffleProducts()}
+            </div>
+        `;
+  }
+  async onRender() {
+    await Promise.all([
+      this.store.fetchRecommendationFilters(),
+      this.store.fetchRecommendationCreateData(),
+      this.store.fetchRecommendationProducts()
+      // TODO: We need to change the location. It's just for testing
+    ]), this._listenStateUpdates(), this._initializeSelectItems(), this._setFormValues(), this._listenToFormUpdates();
+  }
+  onDestroy() {
+    var e;
+    (e = this.addFilterButton) == null || e.removeEventListener("click", this.addFilterListener), this.storeUnsubscription();
+  }
+  _setFormValues() {
+    const e = this.store.recommendationConfigs;
+    this._setProductIdsVisibility(), this.api.updateValues({
+      [t.ALGORITHM]: e.strategy,
+      [t.PRODUCT_IDS]: e.productIds.join(","),
+      [t.CURRENCY]: e.currencySettings.value,
+      [t.LOCALE]: e.language,
+      [t.CURRENCY_LOCATION]: e.currencySettings.alignment,
+      [t.CURRENCY_SYMBOL]: e.currencySettings.symbol,
+      [t.CURRENCY_THOUSAND_SEPARATOR]: e.currencySettings.thousandSeparator,
+      [t.CURRENCY_DECIMAL_SEPARATOR]: e.currencySettings.decimalSeparator,
+      [t.CURRENCY_DECIMAL_COUNT]: e.currencySettings.decimalCount,
+      [t.PRODUCT_COUNT]: e.size,
+      [t.PRODUCT_IN_ROW]: e.cardsInRow,
+      [t.SHUFFLE_PRODUCTS]: e.shuffleProducts
+    });
+  }
+  _initializeSelectItems() {
+    const { store: e } = this, o = e.getActivePredictiveAlgorithms, i = e.getLanguages, n = {
+      [t.ALGORITHM]: o,
+      [t.LOCALE]: i,
+      [t.CURRENCY]: e.currencyList,
+      [t.CURRENCY_LOCATION]: R,
+      [t.CURRENCY_SYMBOL]: e.getCurrencySymbolList,
+      [t.CURRENCY_THOUSAND_SEPARATOR]: C,
+      [t.CURRENCY_DECIMAL_SEPARATOR]: C,
+      [t.CURRENCY_DECIMAL_COUNT]: _,
+      [t.PRODUCT_COUNT]: Number(e.recommendationConfigs.size),
+      [t.PRODUCT_IN_ROW]: e.recommendationConfigs.cardsInRow,
+      [t.SHUFFLE_PRODUCTS]: e.recommendationConfigs.shuffleProducts
+    };
+    Object.entries(n).forEach(([r, l]) => {
+      this.api.setUIEAttribute(r, O.SELECTPICKER.items, l);
+    });
+  }
+  _getAlgorithms() {
+    return `
+            ${this._GuTwoColumns([
+      this._GuLabel({ text: "Recommendation Algorithm" }),
+      this._GuSelect({
+        name: t.ALGORITHM,
+        placeholder: "Select Recommendation Algorithm",
+        options: this.store.getActivePredictiveAlgorithms
+      }),
+      this._GuLabel({ text: "Product Ids", name: `${t.PRODUCT_IDS}_label` }),
+      this._GuTextInput({
+        name: t.PRODUCT_IDS,
+        placeholder: "Enter Product Ids",
+        className: "es-180w"
+      })
+    ])}
+        `;
+  }
+  _getLanguages() {
+    return `
+            ${this._GuTwoColumns([
+      this._GuLabel({ text: "Recommendation Locale" }),
+      this._GuSelect({
+        name: t.LOCALE,
+        placeholder: "Select Recommendation Locale",
+        options: this.store.getLanguages
+      })
+    ])}
+        `;
+  }
+  _getCurrency() {
+    return `
+            ${this._GuTwoColumns([
+      this._GuLabel({ text: "Currency" }),
+      this._GuSelect({
+        name: t.CURRENCY,
+        placeholder: "Select Currency",
+        options: this.store.currencyList
+      }),
+      this._GuLabel({ text: "Currency Location" }),
+      this._GuSelect({
+        name: t.CURRENCY_LOCATION,
+        placeholder: "Select Currency Location",
+        options: R
+      }),
+      this._GuLabel({ text: "Currency Symbol" }),
+      this._GuSelect({
+        name: t.CURRENCY_SYMBOL,
+        placeholder: "Select Currency Symbol",
+        options: this.store.getCurrencySymbolList
+      }),
+      this._GuLabel({ text: "Thousand Separator" }),
+      this._GuSelect({
+        name: t.CURRENCY_THOUSAND_SEPARATOR,
+        placeholder: "Select Thousand Separator",
+        options: C
+      }),
+      this._GuLabel({ text: "Decimal Separator" }),
+      this._GuSelect({
+        name: t.CURRENCY_DECIMAL_SEPARATOR,
+        placeholder: "Select Decimal Separator",
+        options: C
+      }),
+      this._GuLabel({ text: "Decimal Count" }),
+      this._GuSelect({
+        name: t.CURRENCY_DECIMAL_COUNT,
+        placeholder: "Select Decimal Count",
+        options: _
+      })
+    ])}
+        `;
+  }
+  _getProductLayout() {
+    return `
+            ${this._GuTwoColumns([
+      this._GuLabel({ text: "Number of Products" }),
+      this._GuCounter({ name: t.PRODUCT_COUNT, maxValue: 9 }),
+      this._GuLabel({ text: "Products in One Row" }),
+      this._GuCounter({ name: t.PRODUCT_IN_ROW, maxValue: 4 })
+    ])}
+        `;
+  }
+  _getFilterStatus() {
+    return `
+            ${this._GuTwoColumns([
+      this._GuLabel({ text: "Filters" }),
+      this._GuButton({
+        name: t.FILTERS,
+        label: "Add Filter",
+        id: "guido__btn-add-filter"
+      })
+    ])}
+        `;
+  }
+  _getShuffleProducts() {
+    return `
+            ${this._GuTwoColumns([
+      this._GuLabel({ text: "Shuffle Recommended Products" }),
+      this._GuToggle(t.SHUFFLE_PRODUCTS)
+    ])}
+        `;
+  }
+  _onFilterSelectClick() {
+    this.store.$patch({
+      filterSelectionDrawerStatus: !0
+    });
+  }
+  _onDataChange(e, o) {
+    this.currentNode && (this.store.$patch({
+      recommendationConfigs: {
+        [e]: o
+      }
+    }), this._debouncedRegenerateProductRows());
+  }
+  /**
+   * Get the current card composition from block data attribute or use default
+   */
+  _getCardComposition() {
+    if (!this.currentNode)
+      return d;
+    const e = this.currentNode.querySelector(".ins-recommendation-v3-block-v2");
+    if (!e || !("getAttribute" in e))
+      return d;
+    const o = e.getAttribute("data-card-composition");
+    return o ? o.split(",").filter(Boolean) : d;
+  }
+  _regenerateProductRows() {
+    if (!this.currentNode || !("querySelector" in this.currentNode))
+      return;
+    const e = this.currentNode.querySelector(".ins-recommendation-product-container");
+    if (!e) {
+      console.error("Could not find container table for product rows");
+      return;
+    }
+    const o = this.store.recommendationProducts.length > 0 ? this.store.recommendationProducts : L(), { cardsInRow: i } = this.store.recommendationConfigs, n = this._getCardComposition(), r = E(o, i, n);
+    this.api.getDocumentModifier().modifyHtml(e).setInnerHtml(r).apply(new g("Updated product")), this._reapplySpacing();
+  }
+  /**
+   * Reapply spacing values after product regeneration
+   * This ensures spacing persists when products are regenerated
+   */
+  _reapplySpacing() {
+    if (!this.currentNode)
+      return;
+    const e = this.currentNode.querySelector(".ins-recommendation-v3-block-v2");
+    if (!e || !("getAttribute" in e))
+      return;
+    const o = e.getAttribute("data-column-spacing"), i = e.getAttribute("data-row-spacing"), n = this.api.getDocumentModifier();
+    if (o) {
+      const r = parseInt(o);
+      if (!Number.isNaN(r)) {
+        const h = `0 ${Math.floor(r / 2)}px`;
+        Array.from(
+          this.currentNode.querySelectorAll(".product-card-wrapper")
+        ).forEach((c) => {
+          "parentNode" in c && c.parentNode && typeof c.parentNode == "object" && "tagName" in c.parentNode && c.parentNode.tagName === "TD" && n.modifyHtml(c.parentNode).setStyle("padding", h);
+        });
+      }
+    }
+    if (i) {
+      const r = parseInt(i);
+      if (!Number.isNaN(r)) {
+        const l = `${r}px`;
+        Array.from(this.currentNode.querySelectorAll(".spacer")).forEach((m) => {
+          n.modifyHtml(m).setStyle("height", l);
+        });
+      }
+    }
+    (o || i) && n.apply(new g("Reapply spacing after regeneration"));
+  }
+  _onCurrencyConfigChange(e, o) {
+    this.currentNode && this.store.$patch({
+      recommendationConfigs: {
+        currencySettings: {
+          [e]: o
+        }
+      }
+    });
+  }
+  _onCurrencyChange(e) {
+    const [, o] = e.split(".");
+    this.store.$patch({
+      recommendationConfigs: {
+        currencySettings: {
+          name: o,
+          value: o
+        }
+      }
+    });
+  }
+  _setProductIdsVisibility() {
+    const { recommendationConfigs: e } = this.store, o = e.strategy === "manualMerchandising";
+    this.api.setVisibility(t.PRODUCT_IDS, o), this.api.setVisibility(`${t.PRODUCT_IDS}_label`, o);
+  }
+  _listenToFormUpdates() {
+    var o;
+    this.api.onValueChanged(t.ALGORITHM, (i) => {
+      const n = i;
+      this._onDataChange(t.ALGORITHM, n), this._setProductIdsVisibility();
+    }), this.api.onValueChanged(t.PRODUCT_IDS, (i) => {
+      this._onDataChange(t.PRODUCT_IDS, i.split(",") || []);
+    }), this.api.onValueChanged(t.LOCALE, (i) => {
+      this._onDataChange(t.LOCALE, i);
+    }), this.api.onValueChanged(t.CURRENCY, (i) => {
+      this._onCurrencyChange(i);
+    }), [
+      t.CURRENCY_LOCATION,
+      t.CURRENCY_SYMBOL,
+      t.CURRENCY_THOUSAND_SEPARATOR,
+      t.CURRENCY_DECIMAL_SEPARATOR,
+      t.CURRENCY_DECIMAL_COUNT
+    ].forEach((i) => {
+      this.api.onValueChanged(i, (n) => {
+        this._onCurrencyConfigChange(i, n);
+      });
+    }), this.api.onValueChanged(t.PRODUCT_COUNT, (i) => {
+      this._onDataChange(t.PRODUCT_COUNT, i.toString());
+    }), this.api.onValueChanged(t.PRODUCT_IN_ROW, (i) => {
+      this._onDataChange(t.PRODUCT_IN_ROW, i);
+    }), this.api.onValueChanged(t.SHUFFLE_PRODUCTS, (i) => {
+      this._onDataChange(t.SHUFFLE_PRODUCTS, i);
+    }), this.addFilterListener = this._onFilterSelectClick.bind(this), this.addFilterButton = this.getContainer().querySelector("#guido__btn-add-filter"), (o = this.addFilterButton) == null || o.addEventListener("click", this.addFilterListener);
+  }
+  _listenStateUpdates() {
+    this.storeUnsubscription = this.store.$subscribe((e) => {
+      if ("payload" in e) {
+        const o = e.payload.recommendationConfigs;
+        o && (this.api.updateValues(o), this.store.fetchRecommendationProducts());
+      }
+    });
+  }
+}
+export {
+  f as CONTROL_BLOCK_ID,
+  Y as RecommendationBlockControl
+};

package/dist/extensions/Blocks/Recommendation/controls/cardBackgroundColorControl.js

@@ -0,0 +1,68 @@
+import { ModificationDescription as a } from "../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+import { CommonControl as d } from "../../common-control.js";
+const c = "recommendation-card-background-color-control", o = {
+  CARD_BACKGROUND_COLOR: "cardBackgroundColor"
+};
+class u extends d {
+  getId() {
+    return c;
+  }
+  getTemplate() {
+    return `
+            <div class="card-bg-control-container">
+                ${this._GuTwoColumns([
+      this._GuLabel({ text: "Card Background Color" }),
+      this._GuColorPicker(o.CARD_BACKGROUND_COLOR)
+    ])}
+            </div>
+        `;
+  }
+  onRender() {
+    this._setFormValues(), this._listenToFormUpdates();
+  }
+  onTemplateNodeUpdated(r) {
+    super.onTemplateNodeUpdated(r), this._setFormValues();
+  }
+  _setFormValues() {
+    const r = this._getCurrentCardBackgroundColor();
+    this.api.updateValues({
+      [o.CARD_BACKGROUND_COLOR]: r
+    });
+  }
+  /**
+   * Reads the current background color from the first product card wrapper
+   * @returns The background color value or 'transparent' if not found
+   */
+  _getCurrentCardBackgroundColor() {
+    if (!this.currentNode || !("querySelectorAll" in this.currentNode))
+      return "transparent";
+    const r = this.currentNode.querySelector(".product-card-wrapper");
+    return !r || !("getStyle" in r) ? "transparent" : r.getStyle("background-color") || "transparent";
+  }
+  /**
+   * Handles card background color changes
+   * Applies the color to all product card wrapper elements
+   */
+  _onCardBackgroundColorChange(r) {
+    if (!this.currentNode || !("querySelectorAll" in this.currentNode))
+      return;
+    const e = Array.from(
+      this.currentNode.querySelectorAll(".product-card-wrapper")
+    );
+    if (e.length === 0)
+      return;
+    const t = this.api.getDocumentModifier();
+    e.forEach((n) => {
+      t.modifyHtml(n).setStyle("background-color", r);
+    }), t.apply(new a("Update card background color"));
+  }
+  _listenToFormUpdates() {
+    this.api.onValueChanged(o.CARD_BACKGROUND_COLOR, (r) => {
+      this._onCardBackgroundColorChange(r);
+    });
+  }
+}
+export {
+  c as CARD_BACKGROUND_COLOR_CONTROL_ID,
+  u as CardBackgroundColorControl
+};

package/dist/extensions/Blocks/Recommendation/controls/index.js

@@ -0,0 +1,245 @@
+import { createButtonAlignControl as c, createButtonBorderControl as _, createButtonBorderRadiusControl as T, createButtonColorControl as i, createButtonFitToContainerControl as B, createButtonFontFamilyControl as s, createButtonMarginsControl as S, createButtonPaddingsControl as E, createButtonTextControl as P, createButtonTextSizeControl as U, createButtonTextStyleAndFontColorControl as R, createImageMarginsControl as a, createImageSizeControl as M, createTextAlignControl as C, createTextBackgroundColorControl as r, createTextColorControl as O, createTextFontFamilyControl as I, createPaddingsControl as e, createTextSizeControl as N, createTextStyleControl as l } from "../../controlFactories.js";
+import { RecommendationBlockId as o, RecommendationControlId as t } from "../constants.js";
+const n = ".ins-recommendation-product-container", u = C(
+  t.NAME_ALIGN,
+  o.NAME,
+  n
+), d = O(
+  t.NAME_COLOR,
+  o.NAME,
+  n
+), m = N(
+  t.NAME_SIZE,
+  o.NAME,
+  n
+), L = l(
+  t.NAME_STYLE,
+  o.NAME,
+  n
+), F = I(
+  t.NAME_FONT_FAMILY,
+  o.NAME,
+  n
+), g = r(
+  t.NAME_BACKGROUND,
+  o.NAME,
+  n
+), G = e(
+  t.NAME_PADDINGS,
+  o.NAME,
+  n
+), y = C(
+  t.PRICE_ALIGN,
+  o.PRICE,
+  n
+), b = O(
+  t.PRICE_COLOR,
+  o.PRICE,
+  n
+), x = N(
+  t.PRICE_SIZE,
+  o.PRICE,
+  n
+), Y = l(
+  t.PRICE_STYLE,
+  o.PRICE,
+  n
+), z = I(
+  t.PRICE_FONT_FAMILY,
+  o.PRICE,
+  n
+), k = r(
+  t.PRICE_BACKGROUND,
+  o.PRICE,
+  n
+), Z = e(
+  t.PRICE_PADDINGS,
+  o.PRICE,
+  n
+), K = C(
+  t.OLD_PRICE_ALIGN,
+  o.OLD_PRICE,
+  n
+), p = O(
+  t.OLD_PRICE_COLOR,
+  o.OLD_PRICE,
+  n
+), X = N(
+  t.OLD_PRICE_SIZE,
+  o.OLD_PRICE,
+  n
+), f = l(
+  t.OLD_PRICE_STYLE,
+  o.OLD_PRICE,
+  n
+), h = I(
+  t.OLD_PRICE_FONT_FAMILY,
+  o.OLD_PRICE,
+  n
+), j = r(
+  t.OLD_PRICE_BACKGROUND,
+  o.OLD_PRICE,
+  n
+), q = e(
+  t.OLD_PRICE_PADDINGS,
+  o.OLD_PRICE,
+  n
+), v = C(
+  t.OMNIBUS_PRICE_ALIGN,
+  o.OMNIBUS_PRICE,
+  n
+), w = O(
+  t.OMNIBUS_PRICE_COLOR,
+  o.OMNIBUS_PRICE,
+  n
+), H = N(
+  t.OMNIBUS_PRICE_SIZE,
+  o.OMNIBUS_PRICE,
+  n
+), J = l(
+  t.OMNIBUS_PRICE_STYLE,
+  o.OMNIBUS_PRICE,
+  n
+), Q = I(
+  t.OMNIBUS_PRICE_FONT_FAMILY,
+  o.OMNIBUS_PRICE,
+  n
+), V = r(
+  t.OMNIBUS_PRICE_BACKGROUND,
+  o.OMNIBUS_PRICE,
+  n
+), W = e(
+  t.OMNIBUS_PRICE_PADDINGS,
+  o.OMNIBUS_PRICE,
+  n
+), $ = C(
+  t.OMNIBUS_DISCOUNT_ALIGN,
+  o.OMNIBUS_DISCOUNT,
+  n
+), oo = O(
+  t.OMNIBUS_DISCOUNT_COLOR,
+  o.OMNIBUS_DISCOUNT,
+  n
+), to = N(
+  t.OMNIBUS_DISCOUNT_SIZE,
+  o.OMNIBUS_DISCOUNT,
+  n
+), no = l(
+  t.OMNIBUS_DISCOUNT_STYLE,
+  o.OMNIBUS_DISCOUNT,
+  n
+), Co = I(
+  t.OMNIBUS_DISCOUNT_FONT_FAMILY,
+  o.OMNIBUS_DISCOUNT,
+  n
+), ro = r(
+  t.OMNIBUS_DISCOUNT_BACKGROUND,
+  o.OMNIBUS_DISCOUNT,
+  n
+), Oo = e(
+  t.OMNIBUS_DISCOUNT_PADDINGS,
+  o.OMNIBUS_DISCOUNT,
+  n
+), Io = c(
+  t.BUTTON_ALIGN,
+  o.BUTTON,
+  n
+), eo = _(
+  t.BUTTON_BORDER,
+  o.BUTTON,
+  n
+), No = T(
+  t.BUTTON_BORDER_RADIUS,
+  o.BUTTON,
+  n
+), lo = i(
+  t.BUTTON_COLOR,
+  o.BUTTON,
+  n
+), co = s(
+  t.BUTTON_FONT_FAMILY,
+  o.BUTTON,
+  n
+), _o = S(
+  t.BUTTON_MARGINS,
+  o.BUTTON,
+  n
+), To = E(
+  t.BUTTON_PADDINGS,
+  o.BUTTON,
+  n
+), io = P(
+  t.BUTTON_TEXT,
+  o.BUTTON,
+  n
+), Bo = U(
+  t.BUTTON_TEXT_SIZE,
+  o.BUTTON,
+  n
+), so = R(
+  t.BUTTON_TEXT_STYLE_AND_FONT_COLOR,
+  o.BUTTON,
+  n
+), So = B(
+  t.BUTTON_FIT_TO_CONTENT,
+  o.BUTTON,
+  n
+), Eo = M(
+  t.IMAGE_SIZE,
+  o.IMAGE,
+  n
+), Po = a(
+  t.IMAGE_MARGINS,
+  o.IMAGE,
+  n
+);
+export {
+  Io as ButtonAlignControl,
+  eo as ButtonBorderControl,
+  No as ButtonBorderRadiusControl,
+  lo as ButtonColorControl,
+  So as ButtonFitToContentControl,
+  co as ButtonFontFamilyControl,
+  _o as ButtonMarginsControl,
+  To as ButtonPaddingsControl,
+  io as ButtonTextControl,
+  Bo as ButtonTextSizeControl,
+  so as ButtonTextStyleAndFontColorControl,
+  Po as ImageMarginsControl,
+  Eo as ImageSizeControl,
+  u as NameAlignControl,
+  g as NameBackgroundControl,
+  d as NameColorControl,
+  F as NameFontFamilyControl,
+  G as NamePaddingsControl,
+  m as NameSizeControl,
+  L as NameStyleControl,
+  K as OldPriceAlignControl,
+  j as OldPriceBackgroundControl,
+  p as OldPriceColorControl,
+  h as OldPriceFontFamilyControl,
+  q as OldPricePaddingsControl,
+  X as OldPriceSizeControl,
+  f as OldPriceStyleControl,
+  $ as OmnibusDiscountAlignControl,
+  ro as OmnibusDiscountBackgroundControl,
+  oo as OmnibusDiscountColorControl,
+  Co as OmnibusDiscountFontFamilyControl,
+  Oo as OmnibusDiscountPaddingsControl,
+  to as OmnibusDiscountSizeControl,
+  no as OmnibusDiscountStyleControl,
+  v as OmnibusPriceAlignControl,
+  V as OmnibusPriceBackgroundControl,
+  w as OmnibusPriceColorControl,
+  Q as OmnibusPriceFontFamilyControl,
+  W as OmnibusPricePaddingsControl,
+  H as OmnibusPriceSizeControl,
+  J as OmnibusPriceStyleControl,
+  y as PriceAlignControl,
+  k as PriceBackgroundControl,
+  b as PriceColorControl,
+  z as PriceFontFamilyControl,
+  Z as PricePaddingsControl,
+  x as PriceSizeControl,
+  Y as PriceStyleControl
+};