"use strict";
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
var vertical_embed_styles_exports = {};
__export(vertical_embed_styles_exports, {
  TITLE_PRICE_LAYOUT: () => TITLE_PRICE_LAYOUT,
  generateContainerClassName: () => generateContainerClassName,
  generateContentClasses: () => generateContentClasses,
  generateImageContainerProps: () => generateImageContainerProps,
  generateVerticalEmbedClasses: () => generateVerticalEmbedClasses,
  generateVerticalEmbedStyles: () => generateVerticalEmbedStyles
});
module.exports = __toCommonJS(vertical_embed_styles_exports);
var import_classnames = __toESM(require("classnames"));
var import_ricos_document = require("./../../ricos-schema/next-schema/generated/ricos_document.js");
var import_resolve_css_color = require("./../../_shared/resolve-css-color.js");
const MIN_IMAGE_SIZE = 120;
const TITLE_PRICE_LAYOUT = {
  STACKED: "STACKED",
  SIDE_BY_SIDE: "SIDE_BY_SIDE"
};
const BUTTON_SIZE_STYLES = {
  SMALL: {
    "--vertical-embed-button-font-size": "12px",
    "--vertical-embed-button-padding": "6px 9px"
  },
  LARGE: {
    "--vertical-embed-button-font-size": "16px",
    "--vertical-embed-button-padding": "15px 24px"
  },
  MEDIUM: {
    "--vertical-embed-button-font-size": "14px",
    "--vertical-embed-button-padding": "12px"
  }
};
const convertToPixels = (value) => {
  return value !== void 0 ? `${value}px` : void 0;
};
const generateCardStyles = (cardStyles, hasImage, settings) => {
  const cardType = cardStyles?.type || import_ricos_document.AppEmbedData_CardStyles_Type.CONTAINED;
  return {
    "--vertical-embed-title-color": (0, import_resolve_css_color.resolveCssColor)(
      cardStyles?.titleColor ?? settings?.colors?.titleColor
    ),
    "--vertical-embed-text-color": (0, import_resolve_css_color.resolveCssColor)(
      cardStyles?.textColor ?? settings?.colors?.textColor
    ),
    "--vertical-embed-price-color": (0, import_resolve_css_color.resolveCssColor)(
      cardStyles?.textColor ?? settings?.colors?.textColor
    ),
    "--vertical-embed-background-color": (0, import_resolve_css_color.resolveCssColor)(
      cardStyles?.backgroundColor ?? settings?.colors?.backgroundColor
    ),
    "--vertical-embed-border-color": (0, import_resolve_css_color.resolveCssColor)(
      cardStyles?.borderColor ?? settings?.colors?.borderColor
    ),
    "--vertical-embed-border-width": convertToPixels(cardStyles?.borderWidth) || "1px",
    "--vertical-embed-border-radius": convertToPixels(cardStyles?.borderRadius),
    "--vertical-embed-content-padding": cardType === import_ricos_document.AppEmbedData_CardStyles_Type.FRAMELESS ? "0" : "18px"
  };
};
const generateButtonStyles = (buttonStyles, settings) => {
  const getButtonSizeStyles = (size) => {
    const buttonSize = size;
    return BUTTON_SIZE_STYLES[buttonSize] || BUTTON_SIZE_STYLES.MEDIUM;
  };
  return {
    "--vertical-embed-button-fill-color": (0, import_resolve_css_color.resolveCssColor)(
      buttonStyles?.backgroundColor ?? settings?.colors?.buttonFillColor
    ),
    "--vertical-embed-button-text-color": (0, import_resolve_css_color.resolveCssColor)(
      buttonStyles?.textColor ?? settings?.colors?.buttonTextColor
    ),
    "--vertical-embed-button-border-color": (0, import_resolve_css_color.resolveCssColor)(
      buttonStyles?.borderColor ?? settings?.colors?.buttonBorderColor
    ),
    "--vertical-embed-button-border-width": convertToPixels(buttonStyles?.borderWidth),
    "--vertical-embed-button-border-radius": convertToPixels(buttonStyles?.borderRadius),
    "--vertical-embed-button-hover-fill-color": (0, import_resolve_css_color.resolveCssColor)(
      buttonStyles?.backgroundColorHover ?? settings?.colors?.buttonFillColorHover
    ),
    "--vertical-embed-button-hover-text-color": (0, import_resolve_css_color.resolveCssColor)(
      buttonStyles?.textColorHover ?? settings?.colors?.buttonTextColorHover
    ),
    "--vertical-embed-button-hover-border-color": (0, import_resolve_css_color.resolveCssColor)(
      buttonStyles?.borderColorHover ?? settings?.colors?.buttonBorderColorHover
    ),
    ...getButtonSizeStyles(buttonStyles?.buttonSize)
  };
};
const generateImageStyles = (imageStyles, settings) => {
  return {
    "--vertical-embed-image-border-color": (0, import_resolve_css_color.resolveCssColor)(
      imageStyles?.borderColor ?? settings?.colors?.imageBorderColor
    ),
    "--vertical-embed-image-border-width": convertToPixels(imageStyles?.borderWidth),
    "--vertical-embed-image-border-radius": convertToPixels(imageStyles?.borderRadius)
  };
};
const generateRibbonStyles = (ribbonStyles, settings) => {
  return {
    "--vertical-embed-ribbon-fill-color": (0, import_resolve_css_color.resolveCssColor)(
      ribbonStyles?.backgroundColor ?? settings?.colors?.ribbonFillColor
    ),
    "--vertical-embed-ribbon-text-color": (0, import_resolve_css_color.resolveCssColor)(
      ribbonStyles?.textColor ?? settings?.colors?.ribbonTextColor
    ),
    "--vertical-embed-ribbon-border-color": (0, import_resolve_css_color.resolveCssColor)(
      ribbonStyles?.borderColor ?? settings?.colors?.ribbonBorderColor
    ),
    "--vertical-embed-ribbon-border-width": convertToPixels(ribbonStyles?.borderWidth),
    "--vertical-embed-ribbon-border-radius": convertToPixels(ribbonStyles?.borderRadius) || "16px"
  };
};
const generateVerticalEmbedStyles = (componentData, settings) => {
  const hasImage = !componentData?.hideImage && !!componentData?.image?.src?.url;
  return {
    ...generateCardStyles(componentData.cardStyles, hasImage, settings),
    ...generateButtonStyles(componentData.buttonStyles, settings),
    ...generateImageStyles(componentData.imageStyles, settings),
    ...generateRibbonStyles(componentData.ribbonStyles, settings)
  };
};
const generateCardClasses = (cardStyles, classes) => {
  return {
    [classes.frameless]: cardStyles?.type === import_ricos_document.AppEmbedData_CardStyles_Type.FRAMELESS
  };
};
const generateRibbonClasses = (ribbonStyles, classes) => {
  if (!ribbonStyles) {
    return {};
  }
  return {
    [classes.ribbonOnImage]: ribbonStyles.ribbonPlacement === import_ricos_document.AppEmbedData_RibbonStyles_Placement.IMAGE,
    [classes.ribbonAboveInfo]: ribbonStyles.ribbonPlacement === import_ricos_document.AppEmbedData_RibbonStyles_Placement.PRODUCT_INFO
  };
};
const generateLayoutClasses = (settings, classes) => {
  return {
    [classes.slimLayout]: settings.slimLayout
  };
};
const generateVerticalEmbedClasses = (componentData, settings, classes) => {
  return {
    ...generateLayoutClasses(settings, classes),
    ...generateCardClasses(componentData.cardStyles, classes),
    ...generateRibbonClasses(componentData.ribbonStyles, classes)
  };
};
const generateImageContainerProps = (imageStyles, classes) => {
  const imagePosition = imageStyles?.imagePosition || import_ricos_document.AppEmbedData_ImageStyles_Position.START;
  const aspectRatio = imageStyles?.aspectRatio || import_ricos_document.AppEmbedData_ImageStyles_AspectRatio.SQUARE;
  const resizing = imageStyles?.resizing || import_ricos_document.AppEmbedData_ImageStyles_Resizing.FILL;
  const baseClass = imagePosition === import_ricos_document.AppEmbedData_ImageStyles_Position.TOP ? classes.responsiveImage : classes.image;
  const aspectClass = aspectRatio === import_ricos_document.AppEmbedData_ImageStyles_AspectRatio.SQUARE ? classes.squareImage : classes.rectangleImage;
  const resizingClass = resizing === import_ricos_document.AppEmbedData_ImageStyles_Resizing.FIT ? classes.imageFit : classes.imageFill;
  const containerStyle = {
    minWidth: `${MIN_IMAGE_SIZE}px`,
    minHeight: `${MIN_IMAGE_SIZE}px`,
    backgroundSize: resizing === import_ricos_document.AppEmbedData_ImageStyles_Resizing.FIT ? "contain" : "cover",
    backgroundPosition: "center",
    backgroundRepeat: "no-repeat"
  };
  if (imagePosition === import_ricos_document.AppEmbedData_ImageStyles_Position.TOP) {
    if (aspectRatio === import_ricos_document.AppEmbedData_ImageStyles_AspectRatio.SQUARE) {
      containerStyle.width = "100%";
      containerStyle.height = "100%";
      containerStyle.aspectRatio = "1 / 1";
      containerStyle.overflow = "hidden";
    } else if (aspectRatio === import_ricos_document.AppEmbedData_ImageStyles_AspectRatio.RECTANGLE) {
      containerStyle.width = "100%";
      containerStyle.aspectRatio = "16 / 9";
      containerStyle.overflow = "hidden";
    }
  }
  return {
    className: (0, import_classnames.default)(baseClass, aspectClass, resizingClass),
    style: containerStyle
  };
};
const generateContainerClassName = (direction, imageStyles, classes) => {
  return (0, import_classnames.default)(classes[direction], classes.container, classes.cardLayout, {
    [classes.imageTop]: imageStyles?.imagePosition === import_ricos_document.AppEmbedData_ImageStyles_Position.TOP,
    [classes.imageStart]: imageStyles?.imagePosition === import_ricos_document.AppEmbedData_ImageStyles_Position.START,
    [classes.imageEnd]: imageStyles?.imagePosition === import_ricos_document.AppEmbedData_ImageStyles_Position.END,
    [classes.squareRatio]: imageStyles?.aspectRatio === import_ricos_document.AppEmbedData_ImageStyles_AspectRatio.SQUARE,
    [classes.rectangleRatio]: imageStyles?.aspectRatio === import_ricos_document.AppEmbedData_ImageStyles_AspectRatio.RECTANGLE
  });
};
const generateContentClasses = (cardStyles, imagePosition, classes) => {
  const alignment = cardStyles?.alignment || import_ricos_document.AppEmbedData_CardStyles_Alignment.START;
  const isFrameless = cardStyles?.type === import_ricos_document.AppEmbedData_CardStyles_Type.FRAMELESS;
  return (0, import_classnames.default)({
    [classes.textStart]: alignment === import_ricos_document.AppEmbedData_CardStyles_Alignment.START,
    [classes.textCenter]: alignment === import_ricos_document.AppEmbedData_CardStyles_Alignment.CENTER,
    [classes.textEnd]: alignment === import_ricos_document.AppEmbedData_CardStyles_Alignment.END,
    [classes.titlePriceStacked]: cardStyles?.titlePriceLayout === TITLE_PRICE_LAYOUT.STACKED,
    [classes.titlePriceSideBySide]: cardStyles?.titlePriceLayout === TITLE_PRICE_LAYOUT.SIDE_BY_SIDE,
    [classes.framelessContent]: isFrameless,
    [classes.framelessImageTop]: isFrameless && imagePosition === import_ricos_document.AppEmbedData_ImageStyles_Position.TOP,
    [classes.framelessImageStart]: isFrameless && imagePosition === import_ricos_document.AppEmbedData_ImageStyles_Position.START,
    [classes.framelessImageEnd]: isFrameless && imagePosition === import_ricos_document.AppEmbedData_ImageStyles_Position.END
  });
};
//# sourceMappingURL=vertical-embed-styles.js.map
