npm - @brunoalz/smartgesti-site-editor - Versions diffs - 0.2.2 → 1.1.0 - Mend

@brunoalz/smartgesti-site-editor 0.2.2 → 1.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (607) hide show

package/dist/engine/export/exporters/sections/HeroExporter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HeroExporter.js","sources":["../../../../../src/engine/export/exporters/sections/HeroExporter.ts"],"sourcesContent":["/*\n Hero Section Exporter\n * Exporta Hero com múltiplas variações e customizações avançadas\n * Mobile-first responsive: split layout collapses to stack in mobile\n /\n\nimport { Block } from \"../../../schema/siteDocument\";\nimport { ThemeTokens } from \"../../../schema/themeTokens\";\nimport { PLACEHOLDER_IMAGE_URL } from \"../../../presets/heroVariations\";\nimport { dataBlockIdAttr, blockIdAttr, escapeHtml, resolveHref, linkTargetAttr } from \"../../shared/htmlHelpers\";\nimport { generateScopedId } from \"../../shared/idGenerator\";\nimport {\n generateButtonHoverStyles,\n generateButtonOverlayCSS,\n getButtonHoverKeyframes,\n type ButtonHoverEffect,\n type ButtonHoverOverlay,\n} from \"../../../shared/hoverEffects\";\nimport { gridPresetMap, type ImageGridItem, type ImageGridPreset } from \"../../../shared/imageGrid\";\nimport {\n generateTypographyStyles,\n mergeTypographyWithDefaults,\n heroTitleDefaults,\n heroSubtitleDefaults,\n heroDescriptionDefaults,\n type TypographyConfig,\n} from \"../../../shared/typography\";\n\n// Mapa de sombras\nconst shadowMap: Record<string, string> = {\n none: \"none\",\n sm: \"0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24)\",\n md: \"0 4px 6px rgba(0,0,0,0.1), 0 2px 4px rgba(0,0,0,0.06)\",\n lg: \"0 10px 25px rgba(0,0,0,0.15), 0 5px 10px rgba(0,0,0,0.05)\",\n xl: \"0 25px 50px rgba(0,0,0,0.25)\",\n};\n\nexport function exportHero(\n block: Block,\n depth: number,\n basePath?: string,\n theme?: ThemeTokens,\n): string {\n const {\n variation,\n variant = \"centered\",\n title,\n subtitle,\n description,\n primaryButton,\n secondaryButton,\n badge,\n align = \"center\",\n contentPosition = \"center\",\n contentSpacing = \"default\",\n blockGap = \"default\",\n minHeight = \"80vh\",\n image,\n overlay,\n overlayColor,\n background,\n // Typography colors (legacy)\n titleColor,\n subtitleColor,\n descriptionColor,\n // Typography config (novo sistema)\n titleTypography,\n subtitleTypography,\n descriptionTypography,\n // Badge styling\n badgeColor,\n badgeTextColor,\n // Layout\n contentMaxWidth = \"800px\",\n paddingY,\n // Image styling\n imageRadius = 16,\n imageShadow = \"lg\",\n imagePosition = \"right\",\n // Button size\n buttonSize = \"md\",\n // Primary button styling\n primaryButtonVariant = \"solid\",\n primaryButtonColor,\n primaryButtonTextColor,\n primaryButtonRadius = 8,\n // Secondary button styling\n secondaryButtonVariant = \"outline\",\n secondaryButtonColor,\n secondaryButtonTextColor,\n secondaryButtonRadius = 8,\n // Button hover effects\n buttonHoverEffect = \"scale\",\n buttonHoverIntensity = 50,\n buttonHoverOverlay = \"none\",\n buttonHoverIconName = \"arrow-right\",\n // Decorative\n showWave,\n waveColor = \"rgba(255,255,255,0.1)\",\n // Image Grid\n imageGridEnabled,\n imageGridPreset = \"four-equal\",\n imageGridImages = [],\n imageGridGap = 8,\n } = (block as any).props;\n\n // Determine variation types\n const heroImage = image \|\| PLACEHOLDER_IMAGE_URL;\n const isSplit = variation === \"hero-split\" \|\| variant === \"split\";\n const isParallax = variation === \"hero-parallax\";\n const isOverlayVariant = variation === \"hero-overlay\";\n const isGradient = variation === \"hero-gradient\";\n const isMinimal = variation === \"hero-minimal\";\n const isCard = variation === \"hero-card\";\n const isImageBg = (variant === \"image-bg\" \|\| isOverlayVariant \|\| isParallax \|\| isCard) && heroImage;\n const isOverlay = isImageBg && overlay;\n\n // Determine if dark background context\n const hasDarkBg = isOverlay \|\| isGradient \|\| isOverlayVariant;\n\n // Theme colors\n const themePrimaryColor = theme?.colors?.primary \|\| \"#3b82f6\";\n const themePrimaryText = theme?.colors?.primaryText \|\| \"#ffffff\";\n\n // Text colors (fallback)\n const defaultTextColor = hasDarkBg ? \"#ffffff\" : \"var(--sg-text, #1f2937)\";\n const defaultMutedColor = hasDarkBg ? \"rgba(255,255,255,0.85)\" : \"var(--sg-muted-text, #6b7280)\";\n\n // Merge typography configs with defaults (retrocompatível com titleColor, etc.)\n const mergedTitleTypo = mergeTypographyWithDefaults(\n titleTypography as TypographyConfig \| undefined,\n { ...heroTitleDefaults, color: titleColor as string \| undefined }\n );\n const mergedSubtitleTypo = mergeTypographyWithDefaults(\n subtitleTypography as TypographyConfig \| undefined,\n { ...heroSubtitleDefaults, color: subtitleColor as string \| undefined }\n );\n const mergedDescriptionTypo = mergeTypographyWithDefaults(\n descriptionTypography as TypographyConfig \| undefined,\n { ...heroDescriptionDefaults, color: descriptionColor as string \| undefined }\n );\n\n // Generate typography CSS strings\n const titleTypoStyles = generateTypographyStyles(mergedTitleTypo, defaultTextColor);\n const subtitleTypoStyles = generateTypographyStyles(mergedSubtitleTypo, defaultMutedColor);\n const descriptionTypoStyles = generateTypographyStyles(mergedDescriptionTypo, defaultMutedColor);\n\n // Badge colors\n const finalBadgeColor = badgeColor \|\| themePrimaryColor;\n const finalBadgeTextColor = badgeTextColor \|\| \"#ffffff\";\n\n // Button colors\n const finalPrimaryBtnColor = primaryButtonColor \|\| themePrimaryColor;\n const finalPrimaryBtnTextColor = primaryButtonTextColor \|\| themePrimaryText;\n const finalSecondaryBtnColor = secondaryButtonColor \|\| (hasDarkBg ? \"#ffffff\" : themePrimaryColor);\n const finalSecondaryBtnTextColor = secondaryButtonTextColor \|\| finalSecondaryBtnColor;\n\n // Section classes\n const sectionClasses = [\n \"sg-hero\",\n variation ? `sg-hero--${String(variation).replace(\"hero-\", \"\")}` : \"\",\n isSplit ? \"sg-hero--split\" : \"\",\n isParallax ? \"sg-hero--parallax\" : \"\",\n isOverlayVariant ? \"sg-hero--overlay\" : \"\",\n isGradient ? \"sg-hero--gradient\" : \"\",\n isMinimal ? \"sg-hero--minimal\" : \"\",\n isCard ? \"sg-hero--card\" : \"\",\n ]\n .filter(Boolean)\n .join(\" \");\n\n // Build background style\n let bgStyle = \"\";\n if (background) {\n bgStyle = `background: ${background};`;\n } else if (isImageBg && !isSplit) {\n bgStyle = `background-image: url(${escapeHtml(heroImage)}); background-size: cover; background-position: center;`;\n if (isParallax) bgStyle += \" background-attachment: fixed;\";\n } else {\n bgStyle = \"background-color: var(--sg-bg, #fff);\";\n }\n\n // Padding\n const paddingStyle = paddingY ? `padding: ${paddingY} 2rem;` : \"padding: 6rem 2rem;\";\n\n // Content position mapping for flexbox justify-content\n const contentPositionMap: Record<string, string> = {\n left: \"flex-start\",\n center: \"center\",\n right: \"flex-end\",\n };\n const justifyContent = contentPositionMap[contentPosition] \|\| \"center\";\n\n // Determine if layout has two blocks (content + image) - these should always be centered\n const hasTwoBlocks = isSplit \|\| isCard;\n // Note: shouldShowImageGrid is checked later, so we'll handle it in each section\n\n // Content spacing map - controls margin between elements\n const spacingMap: Record<string, { title: string; subtitle: string; description: string; badge: string; actions: string }> = {\n compact: { title: \"0.75rem\", subtitle: \"0.5rem\", description: \"1.25rem\", badge: \"1rem\", actions: \"0.25rem\" },\n default: { title: \"1.25rem\", subtitle: \"1rem\", description: \"2.5rem\", badge: \"1.5rem\", actions: \"0.5rem\" },\n spacious: { title: \"2.25rem\", subtitle: \"2rem\", description: \"3.5rem\", badge: \"2.5rem\", actions: \"1.5rem\" },\n };\n const spacing = spacingMap[contentSpacing] \|\| spacingMap.default;\n\n // Block gap map - controls justify-content, block max-width, container max-width, and gap\n const blockGapConfig: Record<string, { justify: string; blockMaxWidth: string; containerMaxWidth: string; gap: string }> = {\n default: { justify: \"center\", blockMaxWidth: \"45%\", containerMaxWidth: \"1200px\", gap: \"4rem\" },\n wide: { justify: \"space-between\", blockMaxWidth: \"45%\", containerMaxWidth: \"1400px\", gap: \"2rem\" },\n \"x-wide\": { justify: \"space-between\", blockMaxWidth: \"43%\", containerMaxWidth: \"100%\", gap: \"2rem\" },\n };\n const blocksConfig = blockGapConfig[blockGap] \|\| blockGapConfig.default;\n const blocksJustify = blocksConfig.justify;\n const blocksMaxWidth = blocksConfig.blockMaxWidth;\n const containerMaxWidth = blocksConfig.containerMaxWidth;\n const blocksGap = blocksConfig.gap;\n\n // Overlay HTML\n const overlayStyle = overlayColor\n ? `position: absolute; inset: 0; background: ${overlayColor}; z-index: 0;`\n : \"position: absolute; inset: 0; background: linear-gradient(135deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.3) 100%); z-index: 0;\";\n const overlayHtml = isOverlay\n ? `<div class=\"sg-hero__overlay\" style=\"${overlayStyle}\"></div>`\n : \"\";\n\n // Wave SVG\n const waveHtml = showWave\n ? `<div style=\"position: absolute; bottom: 0; left: 0; right: 0; height: 150px; overflow: hidden; z-index: 1;\">\n <svg viewBox=\"0 0 1200 120\" preserveAspectRatio=\"none\" style=\"position: absolute; bottom: 0; width: 100%; height: 100%;\">\n <path d=\"M0,0V46.29c47.79,22.2,103.59,32.17,158,28,70.36-5.37,136.33-33.31,206.8-37.5C438.64,32.43,512.34,53.67,583,72.05c69.27,18,138.3,24.88,209.4,13.08,36.15-6,69.85-17.84,104.45-29.34C989.49,25,1113-14.29,1200,52.47V0Z\" fill=\"${waveColor}\" opacity=\"0.5\"/>\n <path d=\"M0,0V15.81C13,36.92,27.64,56.86,47.69,72.05,99.41,111.27,165,111,224.58,91.58c31.15-10.15,60.09-26.07,89.67-39.8,40.92-19,84.73-46,130.83-49.67,36.26-2.85,70.9,9.42,98.6,31.56,31.77,25.39,62.32,62,103.63,73,40.44,10.79,81.35-6.69,119.13-24.28s75.16-39,116.92-43.05c59.73-5.85,113.28,22.88,168.9,38.84,30.2,8.66,59,6.17,87.09-7.5,22.43-10.89,48-26.93,60.65-49.24V0Z\" fill=\"${waveColor}\" opacity=\"0.3\"/>\n </svg>\n </div>`\n : \"\";\n\n // Badge HTML\n const badgeHtml = badge\n ? `<span class=\"sg-hero__badge\" style=\"display: inline-block; padding: 0.5rem 1.25rem; background: ${finalBadgeColor}; color: ${finalBadgeTextColor}; border-radius: 999px; font-size: 0.875rem; font-weight: 600; margin-bottom: ${spacing.badge};\">${escapeHtml(badge)}</span>`\n : \"\";\n\n // Title HTML - usa tipografia customizada com clamp para responsividade\n const titleFontSize = mergedTitleTypo.fontSize \|\| 48;\n const titleHtml = title\n ? `<h1 class=\"sg-hero__title\" style=\"${titleTypoStyles.cssString} font-size: clamp(2rem, 5vw, ${titleFontSize}px); line-height: 1.1; margin-bottom: ${spacing.title}; letter-spacing: -0.02em;\">${escapeHtml(title)}</h1>`\n : \"\";\n\n // Subtitle HTML - usa tipografia customizada com clamp para responsividade\n const subtitleFontSize = mergedSubtitleTypo.fontSize \|\| 24;\n const subtitleHtml = subtitle\n ? `<h2 class=\"sg-hero__subtitle\" style=\"${subtitleTypoStyles.cssString} font-size: clamp(1.125rem, 2.5vw, ${subtitleFontSize}px); line-height: 1.3; margin-bottom: ${spacing.subtitle};\">${escapeHtml(subtitle)}</h2>`\n : \"\";\n\n // Description HTML - usa tipografia customizada\n const descHtml = description\n ? `<p class=\"sg-hero__description\" style=\"max-width: 650px; margin: ${align === \"center\" ? `0 auto ${spacing.description}` : `0 0 ${spacing.description}`}; ${descriptionTypoStyles.cssString} line-height: 1.7;\">${escapeHtml(description)}</p>`\n : \"\";\n\n // Button styles\n const buttonStyles = resolveHeroButtonStyles({\n theme,\n blockId: block.id,\n buttonSize,\n primaryButtonVariant,\n primaryButtonColor: finalPrimaryBtnColor,\n primaryButtonTextColor: finalPrimaryBtnTextColor,\n primaryButtonRadius,\n secondaryButtonVariant,\n secondaryButtonColor: finalSecondaryBtnColor,\n secondaryButtonTextColor: finalSecondaryBtnTextColor,\n secondaryButtonRadius,\n hoverEffect: buttonHoverEffect,\n hoverIntensity: buttonHoverIntensity,\n hoverOverlay: buttonHoverOverlay,\n hoverIconName: buttonHoverIconName,\n });\n\n // Buttons HTML\n const primaryHref = primaryButton ? resolveHref(primaryButton.href \|\| \"#\", basePath) : \"#\";\n const secondaryHref = secondaryButton ? resolveHref(secondaryButton.href \|\| \"#\", basePath) : \"#\";\n const primaryBtnHtml = primaryButton\n ? `<a href=\"${escapeHtml(primaryHref)}\"${linkTargetAttr(primaryHref, basePath)} class=\"sg-hero__btn sg-hero__btn--primary\" style=\"${buttonStyles.primary}\">${escapeHtml(primaryButton.text)}</a>`\n : \"\";\n const secondaryBtnHtml = secondaryButton\n ? `<a href=\"${escapeHtml(secondaryHref)}\"${linkTargetAttr(secondaryHref, basePath)} class=\"sg-hero__btn sg-hero__btn--secondary\" style=\"${buttonStyles.secondary}\">${escapeHtml(secondaryButton.text)}</a>`\n : \"\";\n const buttonsHtml =\n primaryButton \|\| secondaryButton\n ? `<div class=\"sg-hero__actions\" style=\"display: flex; gap: 1rem; flex-wrap: wrap; justify-content: ${align === \"center\" ? \"center\" : \"flex-start\"}; margin-top: ${spacing.actions};\">${primaryBtnHtml}${secondaryBtnHtml}</div>`\n : \"\";\n\n // Content block\n const contentBlock = `${badgeHtml}${titleHtml}${subtitleHtml}${descHtml}${buttonsHtml}`;\n\n // Style block (hover effects)\n const styleBlock = buttonStyles.css ? `<style>${buttonStyles.css}</style>` : \"\";\n\n // Image fallback\n const imgFallback = `this.onerror=null;this.src='${escapeHtml(PLACEHOLDER_IMAGE_URL)}';`;\n\n // =========================================================================\n // IMAGE GRID EXPORT HELPER\n // =========================================================================\n const exportImageGrid = (\n images: ImageGridItem[],\n preset: ImageGridPreset,\n gap: number,\n radius: number,\n shadow: string,\n gridId: string\n ): { html: string; css: string } => {\n const config = gridPresetMap[preset];\n const shadowValue = shadowMap[shadow] \|\| shadowMap.lg;\n\n // Generate grid items HTML\n const itemsHtml = config.positions\n .map((pos, idx) => {\n const img = images[idx];\n const imgSrc = img?.src \|\| PLACEHOLDER_IMAGE_URL;\n const imgAlt = img?.alt \|\| `Imagem ${idx + 1}`;\n\n return `<div class=\"sg-hero__grid-item\" style=\"grid-column: ${pos.col}; grid-row: ${pos.row}; overflow: hidden; border-radius: ${radius}px;\">\n <img src=\"${escapeHtml(imgSrc)}\" alt=\"${escapeHtml(imgAlt)}\" style=\"width: 100%; height: 100%; object-fit: cover; box-shadow: ${shadowValue};\" onerror=\"${imgFallback}\" />\n </div>`;\n })\n .join(\"\");\n\n const gridHtml = `<div id=\"${gridId}\" class=\"sg-hero__image-grid\" style=\"display: grid; grid-template: ${config.gridTemplate}; gap: ${gap}px; width: 100%; max-width: 500px; aspect-ratio: 1 / 1;\">\n ${itemsHtml}\n </div>`;\n\n // Responsive CSS: collapse to single column on mobile\n const gridCss = `\n @media (max-width: 767px) {\n #${gridId} {\n grid-template: auto / 1fr !important;\n aspect-ratio: auto !important;\n }\n #${gridId} .sg-hero__grid-item {\n grid-column: 1 / -1 !important;\n grid-row: auto !important;\n aspect-ratio: 16 / 9;\n }\n }\n `;\n\n return { html: gridHtml, css: gridCss };\n };\n\n // Determine if we should use image grid (works in ANY variation now)\n const hasValidGridImages = imageGridImages && imageGridImages.length > 0 && (imageGridImages as ImageGridItem[]).some((img: ImageGridItem) => img?.src);\n const shouldShowImageGrid = imageGridEnabled && hasValidGridImages;\n\n // =========================================================================\n // RENDER: Split Layout (without image grid)\n // =========================================================================\n if (isSplit && heroImage && !shouldShowImageGrid) {\n const splitId = generateScopedId(block.id \|\| \"\", \"hero-split\");\n const isImageLeft = imagePosition === \"left\";\n const imgShadow = shadowMap[imageShadow] \|\| shadowMap.lg;\n\n const splitCss = `\n @media (max-width: 1023px) {\n #${splitId} {\n grid-template-columns: 1fr !important;\n gap: 2rem !important;\n padding: 0 1rem !important;\n }\n #${splitId} .sg-hero__split-image {\n order: -1;\n }\n }\n `;\n\n const splitBgStyle = background ? `background: ${background};` : \"background-color: var(--sg-bg, #fff);\";\n const imgStyle = `width: 100%; max-width: 500px; height: auto; border-radius: ${imageRadius}px; box-shadow: ${imgShadow}; object-fit: cover;`;\n const imageDiv = `<div class=\"sg-hero__split-image\" style=\"display: flex; justify-content: center; flex: 0 1 auto; max-width: ${blocksMaxWidth};\"><img src=\"${escapeHtml(heroImage)}\" alt=\"${escapeHtml(title \|\| \"\")}\" class=\"sg-hero__img\" style=\"${imgStyle}\" onerror=\"${imgFallback}\" /></div>`;\n const contentDiv = `<div class=\"sg-hero__split-content\" style=\"text-align: ${align}; position: relative; z-index: 1; max-width: ${blocksMaxWidth}; flex: 0 1 auto;\">${contentBlock}</div>`;\n\n const innerHtml = isImageLeft\n ? `<style>${splitCss}</style><div id=\"${splitId}\" class=\"sg-hero__split-inner\" style=\"display: flex; justify-content: ${blocksJustify}; gap: ${blocksGap}; align-items: center; max-width: ${containerMaxWidth}; width: 100%; padding: 0 2rem;\">${imageDiv}${contentDiv}</div>`\n : `<style>${splitCss}</style><div id=\"${splitId}\" class=\"sg-hero__split-inner\" style=\"display: flex; justify-content: ${blocksJustify}; gap: ${blocksGap}; align-items: center; max-width: ${containerMaxWidth}; width: 100%; padding: 0 2rem;\">${contentDiv}${imageDiv}</div>`;\n\n return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses}\" style=\"min-height: ${minHeight}; ${paddingStyle} display: flex; align-items: center; justify-content: ${justifyContent}; position: relative; overflow: hidden; ${splitBgStyle}\" data-variation=\"${escapeHtml(variation \|\| variant \|\| \"\")}\">${styleBlock}${innerHtml}</section>`;\n }\n\n // =========================================================================\n // RENDER: Card Layout (supports both with and without Image Grid)\n // Card always stays on the left (original position), Grid on the right\n // =========================================================================\n if (isCard && heroImage) {\n const cardBg = background \|\| \"#ffffff\";\n const cardPadding = paddingY ? `${paddingY} 3rem` : \"6rem 3rem\";\n\n // With Image Grid: Card on left + Grid on right (preserves original card position)\n if (shouldShowImageGrid) {\n const cardGridLayoutId = generateScopedId(block.id \|\| \"\", \"hero-card-grid\");\n const gridId = generateScopedId(block.id \|\| \"\", \"hero-grid\");\n\n const gridResult = exportImageGrid(\n imageGridImages as ImageGridItem[],\n imageGridPreset as ImageGridPreset,\n imageGridGap as number,\n imageRadius,\n imageShadow,\n gridId\n );\n\n const cardHtml = `<div class=\"sg-hero__card\" style=\"max-width: 500px; background: ${cardBg}; padding: 2rem; border-radius: 16px; box-shadow: 0 25px 50px rgba(0,0,0,0.25); position: relative; z-index: 2; text-align: ${align}; flex: 0 1 auto;\">${contentBlock}</div>`;\n const gridWrapperHtml = `<div class=\"sg-hero__grid-wrapper\" style=\"position: relative; z-index: 3; display: flex; justify-content: center; align-items: center; flex: 0 1 auto; max-width: ${blocksMaxWidth};\">${gridResult.html}</div>`;\n\n // Card always left, Grid always right\n const innerHtml = `${cardHtml}${gridWrapperHtml}`;\n\n // Responsive CSS\n let layoutCss = `\n @media (max-width: 1023px) {\n #${cardGridLayoutId} {\n flex-direction: column !important;\n gap: 2rem !important;\n }\n #${cardGridLayoutId} .sg-hero__grid-wrapper {\n order: -1;\n }\n }\n `;\n layoutCss += gridResult.css;\n\n const cardGridLayoutHtml = `<style>${layoutCss}</style><div id=\"${cardGridLayoutId}\" class=\"sg-hero__card-grid-layout\" style=\"display: flex; width: 100%; max-width: ${containerMaxWidth}; align-items: center; justify-content: ${blocksJustify}; position: relative; z-index: 2; padding: 0 2rem; gap: ${blocksGap};\">${innerHtml}</div>`;\n\n return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses} sg-hero--with-grid\" style=\"min-height: ${minHeight}; padding: ${cardPadding}; display: flex; align-items: center; justify-content: center; background-image: url(${escapeHtml(heroImage)}); background-size: cover; background-position: center; position: relative; overflow: hidden;\" data-variation=\"${escapeHtml(variation \|\| variant \|\| \"\")}\">${styleBlock}${overlayHtml}${cardGridLayoutHtml}</section>`;\n }\n\n // Without Image Grid: Original card layout\n const cardHtml = `\n <div class=\"sg-hero__card\" style=\"max-width: ${contentMaxWidth}; width: 100%; background: ${cardBg}; padding: 2rem; border-radius: 16px; box-shadow: 0 25px 50px rgba(0,0,0,0.25); position: relative; z-index: 2; text-align: ${align};\">\n ${contentBlock}\n </div>\n `;\n\n return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses}\" style=\"min-height: ${minHeight}; padding: ${cardPadding}; display: flex; align-items: center; justify-content: center; background-image: url(${escapeHtml(heroImage)}); background-size: cover; background-position: center; position: relative; overflow: hidden;\" data-variation=\"${escapeHtml(variation \|\| variant \|\| \"\")}\">${styleBlock}${overlayHtml}${cardHtml}</section>`;\n }\n\n // =========================================================================\n // RENDER: With Image Grid (any variation) - Floating grid alongside content\n // =========================================================================\n if (shouldShowImageGrid) {\n const gridLayoutId = generateScopedId(block.id \|\| \"\", \"hero-grid-layout\");\n const gridId = generateScopedId(block.id \|\| \"\", \"hero-grid\");\n const isGridLeft = imagePosition === \"left\";\n\n const gridResult = exportImageGrid(\n imageGridImages as ImageGridItem[],\n imageGridPreset as ImageGridPreset,\n imageGridGap as number,\n imageRadius,\n imageShadow,\n gridId\n );\n\n const gridWrapperHtml = `<div class=\"sg-hero__grid-wrapper\" style=\"position: relative; z-index: 3; display: flex; justify-content: center; align-items: center; flex: 0 1 auto; max-width: ${blocksMaxWidth};\">${gridResult.html}</div>`;\n const contentSideHtml = `<div class=\"sg-hero__content-side\" style=\"max-width: ${blocksMaxWidth}; flex: 0 1 auto; text-align: ${align}; position: relative; z-index: 2;\">${contentBlock}</div>`;\n\n // Responsive CSS for the grid layout\n let layoutCss = `\n @media (max-width: 1023px) {\n #${gridLayoutId} {\n flex-direction: column !important;\n gap: 2rem !important;\n }\n #${gridLayoutId} .sg-hero__grid-wrapper,\n #${gridLayoutId} .sg-hero__content-side {\n max-width: 100% !important;\n }\n #${gridLayoutId} .sg-hero__grid-wrapper {\n order: -1;\n }\n }\n `;\n layoutCss += gridResult.css;\n\n const innerHtml = isGridLeft\n ? `${gridWrapperHtml}${contentSideHtml}`\n : `${contentSideHtml}${gridWrapperHtml}`;\n\n const gridLayoutHtml = `<style>${layoutCss}</style><div id=\"${gridLayoutId}\" class=\"sg-hero__grid-layout\" style=\"display: flex; justify-content: ${blocksJustify}; gap: ${blocksGap}; max-width: ${containerMaxWidth}; width: 100%; align-items: center; position: relative; z-index: 2; padding: 0 2rem;\">${innerHtml}</div>`;\n\n return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses} sg-hero--with-grid\" style=\"min-height: ${minHeight}; ${paddingStyle} display: flex; align-items: center; justify-content: ${justifyContent}; ${bgStyle} position: relative; overflow: hidden;\" data-variation=\"${escapeHtml(variation \|\| variant \|\| \"\")}\">${styleBlock}${overlayHtml}${waveHtml}${gridLayoutHtml}</section>`;\n }\n\n // =========================================================================\n // RENDER: Default (centered, gradient, minimal, parallax, overlay)\n // =========================================================================\n const contentWrapHtml = `<div style=\"max-width: ${contentMaxWidth}; width: 100%; padding: 0 2rem; text-align: ${align}; position: relative; z-index: 2;\">${contentBlock}</div>`;\n\n return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses}\" style=\"min-height: ${minHeight}; ${paddingStyle} display: flex; align-items: center; justify-content: ${justifyContent}; ${bgStyle} position: relative; overflow: hidden;\" data-variation=\"${escapeHtml(variation \|\| variant \|\| \"\")}\">${styleBlock}${overlayHtml}${waveHtml}${contentWrapHtml}</section>`;\n}\n\n/\n Resolve hero button styles with independent customization for primary and secondary\n */\ninterface ButtonStylesConfig {\n theme?: ThemeTokens;\n blockId: string;\n buttonSize: string;\n primaryButtonVariant: string;\n primaryButtonColor: string;\n primaryButtonTextColor: string;\n primaryButtonRadius: number;\n secondaryButtonVariant: string;\n secondaryButtonColor: string;\n secondaryButtonTextColor: string;\n secondaryButtonRadius: number;\n hoverEffect: string;\n hoverIntensity: number;\n hoverOverlay: string;\n hoverIconName: string;\n}\n\nfunction resolveHeroButtonStyles(config: ButtonStylesConfig): { primary: string; secondary: string; css: string } {\n const {\n blockId,\n buttonSize,\n primaryButtonVariant,\n primaryButtonColor,\n primaryButtonTextColor,\n primaryButtonRadius,\n secondaryButtonVariant,\n secondaryButtonColor,\n secondaryButtonTextColor,\n secondaryButtonRadius,\n hoverEffect,\n hoverIntensity,\n hoverOverlay,\n hoverIconName,\n } = config;\n\n // Size-based styles\n const sizeStyles: Record<string, { padding: string; fontSize: string }> = {\n sm: { padding: \"0.625rem 1.25rem\", fontSize: \"0.875rem\" },\n md: { padding: \"0.875rem 2rem\", fontSize: \"1rem\" },\n lg: { padding: \"1rem 2.5rem\", fontSize: \"1.125rem\" },\n };\n const size = sizeStyles[buttonSize] \|\| sizeStyles.md;\n\n // Base button styles\n const baseStyles = [\n `padding: ${size.padding}`,\n \"font-weight: 600\",\n `font-size: ${size.fontSize}`,\n \"text-decoration: none\",\n \"display: inline-flex\",\n \"align-items: center\",\n \"justify-content: center\",\n \"gap: 0.5rem\",\n \"transition: all 0.2s ease\",\n \"position: relative\",\n \"overflow: hidden\",\n \"cursor: pointer\",\n ];\n\n // Primary button styles\n const primaryStyles = [...baseStyles, `border-radius: ${primaryButtonRadius}px`];\n switch (primaryButtonVariant) {\n case \"outline\":\n primaryStyles.push(`background-color: transparent`, `border: 2px solid ${primaryButtonColor}`, `color: ${primaryButtonColor}`);\n break;\n case \"ghost\":\n primaryStyles.push(`background-color: transparent`, `border: none`, `color: ${primaryButtonColor}`);\n break;\n default: // solid\n primaryStyles.push(`background-color: ${primaryButtonColor}`, `border: 2px solid ${primaryButtonColor}`, `color: ${primaryButtonTextColor}`);\n }\n\n // Secondary button styles\n const secondaryStyles = [...baseStyles, `border-radius: ${secondaryButtonRadius}px`];\n switch (secondaryButtonVariant) {\n case \"solid\":\n secondaryStyles.push(`background-color: ${secondaryButtonColor}`, `border: 2px solid ${secondaryButtonColor}`, `color: ${secondaryButtonTextColor}`);\n break;\n case \"ghost\":\n secondaryStyles.push(`background-color: transparent`, `border: none`, `color: ${secondaryButtonTextColor}`);\n break;\n default: // outline\n secondaryStyles.push(`background-color: transparent`, `border: 2px solid ${secondaryButtonColor}`, `color: ${secondaryButtonTextColor}`);\n }\n\n const scope = blockId ? `[data-block-id=\"${blockId}\"]` : \"\";\n let css = \"\";\n\n // Hover effects\n if (hoverEffect !== \"none\") {\n // Primary button hover\n const primaryHoverResult = generateButtonHoverStyles({\n effect: hoverEffect as ButtonHoverEffect,\n intensity: hoverIntensity,\n buttonColor: primaryButtonColor,\n buttonTextColor: primaryButtonVariant === \"solid\" ? primaryButtonTextColor : primaryButtonColor,\n variant: primaryButtonVariant as \"solid\" \| \"outline\" \| \"ghost\",\n });\n\n // Secondary button hover\n const secondaryHoverResult = generateButtonHoverStyles({\n effect: hoverEffect as ButtonHoverEffect,\n intensity: hoverIntensity,\n buttonColor: secondaryButtonColor,\n buttonTextColor: secondaryButtonVariant === \"solid\" ? secondaryButtonTextColor : secondaryButtonColor,\n variant: secondaryButtonVariant as \"solid\" \| \"outline\" \| \"ghost\",\n });\n\n if (primaryHoverResult.base) {\n css += `${scope} .sg-hero__btn--primary { ${primaryHoverResult.base} }\\n`;\n }\n if (secondaryHoverResult.base) {\n css += `${scope} .sg-hero__btn--secondary { ${secondaryHoverResult.base} }\\n`;\n }\n\n css += `\n ${scope} .sg-hero__btn--primary:hover { ${primaryHoverResult.hover} }\n ${scope} .sg-hero__btn--secondary:hover { ${secondaryHoverResult.hover} }\n `;\n\n css += getButtonHoverKeyframes();\n }\n\n // Overlay effects\n if (hoverOverlay && hoverOverlay !== \"none\") {\n css += generateButtonOverlayCSS(`${scope} .sg-hero__btn--primary`, {\n overlay: hoverOverlay as ButtonHoverOverlay,\n primaryColor: primaryButtonColor,\n iconName: hoverIconName,\n textColor: primaryButtonVariant === \"solid\" ? primaryButtonTextColor : primaryButtonColor,\n });\n css += generateButtonOverlayCSS(`${scope} .sg-hero__btn--secondary`, {\n overlay: hoverOverlay as ButtonHoverOverlay,\n primaryColor: secondaryButtonColor,\n iconName: hoverIconName,\n textColor: secondaryButtonVariant === \"solid\" ? secondaryButtonTextColor : secondaryButtonColor,\n });\n }\n\n return {\n primary: primaryStyles.join(\"; \"),\n secondary: secondaryStyles.join(\"; \"),\n css,\n };\n}\n\n"],"names":["shadowMap","exportHero","block","depth","basePath","theme","variation","variant","title","subtitle","description","primaryButton","secondaryButton","badge","align","contentPosition","contentSpacing","blockGap","minHeight","image","overlay","overlayColor","background","titleColor","subtitleColor","descriptionColor","titleTypography","subtitleTypography","descriptionTypography","badgeColor","badgeTextColor","contentMaxWidth","paddingY","imageRadius","imageShadow","imagePosition","buttonSize","primaryButtonVariant","primaryButtonColor","primaryButtonTextColor","primaryButtonRadius","secondaryButtonVariant","secondaryButtonColor","secondaryButtonTextColor","secondaryButtonRadius","buttonHoverEffect","buttonHoverIntensity","buttonHoverOverlay","buttonHoverIconName","showWave","waveColor","imageGridEnabled","imageGridPreset","imageGridImages","imageGridGap","heroImage","PLACEHOLDER_IMAGE_URL","isSplit","isParallax","isOverlayVariant","isGradient","isMinimal","isCard","isImageBg","isOverlay","hasDarkBg","themePrimaryColor","themePrimaryText","defaultTextColor","defaultMutedColor","mergedTitleTypo","mergeTypographyWithDefaults","heroTitleDefaults","mergedSubtitleTypo","heroSubtitleDefaults","mergedDescriptionTypo","heroDescriptionDefaults","titleTypoStyles","generateTypographyStyles","subtitleTypoStyles","descriptionTypoStyles","finalBadgeColor","finalBadgeTextColor","finalPrimaryBtnColor","finalPrimaryBtnTextColor","finalSecondaryBtnColor","finalSecondaryBtnTextColor","sectionClasses","bgStyle","escapeHtml","paddingStyle","justifyContent","spacingMap","spacing","blockGapConfig","blocksConfig","blocksJustify","blocksMaxWidth","containerMaxWidth","blocksGap","overlayStyle","overlayHtml","waveHtml","badgeHtml","titleFontSize","titleHtml","subtitleFontSize","subtitleHtml","descHtml","buttonStyles","resolveHeroButtonStyles","primaryHref","resolveHref","secondaryHref","primaryBtnHtml","linkTargetAttr","secondaryBtnHtml","buttonsHtml","contentBlock","styleBlock","imgFallback","exportImageGrid","images","preset","gap","radius","shadow","gridId","config","gridPresetMap","shadowValue","itemsHtml","pos","idx","img","imgSrc","imgAlt","gridHtml","gridCss","hasValidGridImages","shouldShowImageGrid","splitId","generateScopedId","isImageLeft","imgShadow","splitCss","splitBgStyle","imgStyle","imageDiv","contentDiv","innerHtml","blockIdAttr","dataBlockIdAttr","cardBg","cardPadding","cardGridLayoutId","gridResult","cardHtml","gridWrapperHtml","layoutCss","cardGridLayoutHtml","gridLayoutId","isGridLeft","contentSideHtml","gridLayoutHtml","contentWrapHtml","blockId","hoverEffect","hoverIntensity","hoverOverlay","hoverIconName","sizeStyles","size","baseStyles","primaryStyles","secondaryStyles","scope","css","primaryHoverResult","generateButtonHoverStyles","secondaryHoverResult","getButtonHoverKeyframes","generateButtonOverlayCSS"],"mappings":";;;;;;;AA6BA,MAAMA,IAAoC;AAAA,EACxC,MAAM;AAAA,EACN,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEO,SAASC,GACdC,GACAC,GACAC,GACAC,GACQ;AACR,QAAM;AAAA,IACJ,WAAAC;AAAA,IACA,SAAAC,IAAU;AAAA,IACV,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,aAAAC;AAAA,IACA,eAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,OAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,iBAAAC,IAAkB;AAAA,IAClB,gBAAAC,IAAiB;AAAA,IACjB,UAAAC,IAAW;AAAA,IACX,WAAAC,IAAY;AAAA,IACZ,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,cAAAC;AAAA,IACA,YAAAC;AAAA;AAAA,IAEA,YAAAC;AAAA,IACA,eAAAC;AAAA,IACA,kBAAAC;AAAA;AAAA,IAEA,iBAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,uBAAAC;AAAA;AAAA,IAEA,YAAAC;AAAA,IACA,gBAAAC;AAAA;AAAA,IAEA,iBAAAC,KAAkB;AAAA,IAClB,UAAAC;AAAA;AAAA,IAEA,aAAAC,KAAc;AAAA,IACd,aAAAC,KAAc;AAAA,IACd,eAAAC,KAAgB;AAAA;AAAA,IAEhB,YAAAC,KAAa;AAAA;AAAA,IAEb,sBAAAC,KAAuB;AAAA,IACvB,oBAAAC;AAAA,IACA,wBAAAC;AAAA,IACA,qBAAAC,KAAsB;AAAA;AAAA,IAEtB,wBAAAC,KAAyB;AAAA,IACzB,sBAAAC;AAAA,IACA,0BAAAC;AAAA,IACA,uBAAAC,KAAwB;AAAA;AAAA,IAExB,mBAAAC,KAAoB;AAAA,IACpB,sBAAAC,KAAuB;AAAA,IACvB,oBAAAC,KAAqB;AAAA,IACrB,qBAAAC,KAAsB;AAAA;AAAA,IAEtB,UAAAC;AAAA,IACA,WAAAC,KAAY;AAAA;AAAA,IAEZ,kBAAAC;AAAA,IACA,iBAAAC,KAAkB;AAAA,IAClB,iBAAAC,IAAkB,CAAA;AAAA,IAClB,cAAAC,KAAe;AAAA,EAAA,IACZpD,EAAc,OAGbqD,IAAYpC,KAASqC,IACrBC,KAAUnD,MAAc,gBAAgBC,MAAY,SACpDmD,KAAapD,MAAc,iBAC3BqD,KAAmBrD,MAAc,gBACjCsD,KAAatD,MAAc,iBAC3BuD,KAAYvD,MAAc,gBAC1BwD,KAASxD,MAAc,aACvByD,MAAaxD,MAAY,cAAcoD,MAAoBD,MAAcI,OAAWP,GACpFS,KAAYD,MAAa3C,GAGzB6C,KAAYD,MAAaJ,MAAcD,IAGvCO,KAAoB7D,GAAO,QAAQ,WAAW,WAC9C8D,KAAmB9D,GAAO,QAAQ,eAAe,WAGjD+D,KAAmBH,KAAY,YAAY,2BAC3CI,KAAoBJ,KAAY,2BAA2B,iCAG3DK,KAAkBC;AAAA,IACtB7C;AAAA,IACA,EAAE,GAAG8C,IAAmB,OAAOjD,EAAA;AAAA,EAAiC,GAE5DkD,KAAqBF;AAAA,IACzB5C;AAAA,IACA,EAAE,GAAG+C,IAAsB,OAAOlD,EAAA;AAAA,EAAoC,GAElEmD,KAAwBJ;AAAA,IAC5B3C;AAAA,IACA,EAAE,GAAGgD,IAAyB,OAAOnD,EAAA;AAAA,EAAuC,GAIxEoD,KAAkBC,GAAyBR,IAAiBF,EAAgB,GAC5EW,KAAqBD,GAAyBL,IAAoBJ,EAAiB,GACnFW,KAAwBF,GAAyBH,IAAuBN,EAAiB,GAGzFY,KAAkBpD,MAAcqC,IAChCgB,KAAsBpD,MAAkB,WAGxCqD,KAAuB7C,MAAsB4B,IAC7CkB,KAA2B7C,MAA0B4B,IACrDkB,KAAyB3C,OAAyBuB,KAAY,YAAYC,KAC1EoB,KAA6B3C,MAA4B0C,IAGzDE,IAAiB;AAAA,IACrB;AAAA,IACAjF,IAAY,YAAY,OAAOA,CAAS,EAAE,QAAQ,SAAS,EAAE,CAAC,KAAK;AAAA,IACnEmD,KAAU,mBAAmB;AAAA,IAC7BC,KAAa,sBAAsB;AAAA,IACnCC,KAAmB,qBAAqB;AAAA,IACxCC,KAAa,sBAAsB;AAAA,IACnCC,KAAY,qBAAqB;AAAA,IACjCC,KAAS,kBAAkB;AAAA,EAAA,EAE1B,OAAO,OAAO,EACd,KAAK,GAAG;AAGX,MAAI0B,IAAU;AACd,EAAIlE,IACFkE,IAAU,eAAelE,CAAU,MAC1ByC,MAAa,CAACN,MACvB+B,IAAU,yBAAyBC,EAAWlC,CAAS,CAAC,2DACpDG,OAAY8B,KAAW,qCAE3BA,IAAU;AAIZ,QAAME,KAAe1D,IAAW,YAAYA,CAAQ,WAAW,uBAQzD2D,KAL6C;AAAA,IACjD,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,OAAO;AAAA,EAAA,EAEiC5E,CAAe,KAAK,UAOxD6E,KAAuH;AAAA,IAC3H,SAAS,EAAE,OAAO,WAAW,UAAU,UAAU,aAAa,WAAW,OAAO,QAAQ,SAAS,UAAA;AAAA,IACjG,SAAS,EAAE,OAAO,WAAW,UAAU,QAAQ,aAAa,UAAU,OAAO,UAAU,SAAS,SAAA;AAAA,IAChG,UAAU,EAAE,OAAO,WAAW,UAAU,QAAQ,aAAa,UAAU,OAAO,UAAU,SAAS,SAAA;AAAA,EAAS,GAEtGC,IAAUD,GAAW5E,CAAc,KAAK4E,GAAW,SAGnDE,KAAqH;AAAA,IACzH,SAAS,EAAE,SAAS,UAAU,eAAe,OAAO,mBAAmB,UAAU,KAAK,OAAA;AAAA,IACtF,MAAM,EAAE,SAAS,iBAAiB,eAAe,OAAO,mBAAmB,UAAU,KAAK,OAAA;AAAA,IAC1F,UAAU,EAAE,SAAS,iBAAiB,eAAe,OAAO,mBAAmB,QAAQ,KAAK,OAAA;AAAA,EAAO,GAE/FC,IAAeD,GAAe7E,CAAQ,KAAK6E,GAAe,SAC1DE,IAAgBD,EAAa,SAC7BE,IAAiBF,EAAa,eAC9BG,IAAoBH,EAAa,mBACjCI,IAAYJ,EAAa,KAGzBK,KAAe/E,IACjB,6CAA6CA,CAAY,kBACzD,4HACEgF,IAAcrC,KAChB,wCAAwCoC,EAAY,aACpD,IAGEE,KAAWrD,KACb;AAAA;AAAA,kPAE4OC,EAAS;AAAA,yYAC8IA,EAAS;AAAA;AAAA,gBAG5Y,IAGEqD,KAAY1F,IACd,mGAAmGoE,EAAe,YAAYC,EAAmB,iFAAiFW,EAAQ,KAAK,MAAMJ,EAAW5E,CAAK,CAAC,YACtQ,IAGE2F,KAAgBlC,GAAgB,YAAY,IAC5CmC,KAAYjG,IACd,qCAAqCqE,GAAgB,SAAS,gCAAgC2B,EAAa,yCAAyCX,EAAQ,KAAK,+BAA+BJ,EAAWjF,CAAK,CAAC,UACjN,IAGEkG,KAAmBjC,GAAmB,YAAY,IAClDkC,KAAelG,IACjB,wCAAwCsE,GAAmB,SAAS,sCAAsC2B,EAAgB,yCAAyCb,EAAQ,QAAQ,MAAMJ,EAAWhF,CAAQ,CAAC,UAC7M,IAGEmG,KAAWlG,IACb,oEAAoEI,MAAU,WAAW,UAAU+E,EAAQ,WAAW,KAAK,OAAOA,EAAQ,WAAW,EAAE,KAAKb,GAAsB,SAAS,uBAAuBS,EAAW/E,CAAW,CAAC,SACzO,IAGEmG,IAAeC,GAAwB;AAAA,IAE3C,SAAS5G,EAAM;AAAA,IACf,YAAAkC;AAAA,IACA,sBAAAC;AAAA,IACA,oBAAoB8C;AAAA,IACpB,wBAAwBC;AAAA,IACxB,qBAAA5C;AAAA,IACA,wBAAAC;AAAA,IACA,sBAAsB4C;AAAA,IACtB,0BAA0BC;AAAA,IAC1B,uBAAA1C;AAAA,IACA,aAAaC;AAAA,IACb,gBAAgBC;AAAA,IAChB,cAAcC;AAAA,IACd,eAAeC;AAAA,EAAA,CAChB,GAGK+D,KAAcpG,IAAgBqG,GAAYrG,EAAc,QAAQ,KAAKP,CAAQ,IAAI,KACjF6G,KAAgBrG,IAAkBoG,GAAYpG,EAAgB,QAAQ,KAAKR,CAAQ,IAAI,KACvF8G,KAAiBvG,IACnB,YAAY8E,EAAWsB,EAAW,CAAC,IAAII,GAAeJ,IAAa3G,CAAQ,CAAC,sDAAsDyG,EAAa,OAAO,KAAKpB,EAAW9E,EAAc,IAAI,CAAC,SACzL,IACEyG,KAAmBxG,IACrB,YAAY6E,EAAWwB,EAAa,CAAC,IAAIE,GAAeF,IAAe7G,CAAQ,CAAC,wDAAwDyG,EAAa,SAAS,KAAKpB,EAAW7E,EAAgB,IAAI,CAAC,SACnM,IACEyG,KACJ1G,KAAiBC,IACb,oGAAoGE,MAAU,WAAW,WAAW,YAAY,iBAAiB+E,EAAQ,OAAO,MAAMqB,EAAc,GAAGE,EAAgB,WACvN,IAGAE,IAAe,GAAGf,EAAS,GAAGE,EAAS,GAAGE,EAAY,GAAGC,EAAQ,GAAGS,EAAW,IAG/EE,IAAaV,EAAa,MAAM,UAAUA,EAAa,GAAG,aAAa,IAGvEW,KAAc,+BAA+B/B,EAAWjC,EAAqB,CAAC,MAK9EiE,KAAkB,CACtBC,GACAC,GACAC,GACAC,GACAC,GACAC,MACkC;AAClC,UAAMC,IAASC,GAAcN,CAAM,GAC7BO,IAAclI,EAAU8H,CAAM,KAAK9H,EAAU,IAG7CmI,IAAYH,EAAO,UACtB,IAAI,CAACI,IAAKC,OAAQ;AACjB,YAAMC,KAAMZ,EAAOW,EAAG,GAChBE,KAASD,IAAK,OAAO9E,IACrBgF,KAASF,IAAK,OAAO,UAAUD,KAAM,CAAC;AAE5C,aAAO,uDAAuDD,GAAI,GAAG,eAAeA,GAAI,GAAG,sCAAsCP,CAAM;AAAA,sBACzHpC,EAAW8C,EAAM,CAAC,UAAU9C,EAAW+C,EAAM,CAAC,sEAAsEN,CAAW,eAAeV,EAAW;AAAA;AAAA,IAEzK,CAAC,EACA,KAAK,EAAE,GAEJiB,IAAW,YAAYV,CAAM,sEAAsEC,EAAO,YAAY,UAAUJ,CAAG;AAAA,QACrIO,CAAS;AAAA,aAIPO,KAAU;AAAA;AAAA,WAETX,CAAM;AAAA;AAAA;AAAA;AAAA,WAINA,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQb,WAAO,EAAE,MAAMU,GAAU,KAAKC,GAAA;AAAA,EAChC,GAGMC,KAAqBtF,KAAmBA,EAAgB,SAAS,KAAMA,EAAoC,KAAK,CAACiF,MAAuBA,GAAK,GAAG,GAChJM,KAAsBzF,MAAoBwF;AAKhD,MAAIlF,MAAWF,KAAa,CAACqF,IAAqB;AAChD,UAAMC,IAAUC,EAAiB5I,EAAM,MAAM,IAAI,YAAY,GACvD6I,IAAc5G,OAAkB,QAChC6G,IAAYhJ,EAAUkC,EAAW,KAAKlC,EAAU,IAEhDiJ,IAAW;AAAA;AAAA,WAEVJ,CAAO;AAAA;AAAA;AAAA;AAAA;AAAA,WAKPA,CAAO;AAAA;AAAA;AAAA;AAAA,OAMRK,IAAe5H,IAAa,eAAeA,CAAU,MAAM,yCAC3D6H,IAAW,+DAA+DlH,EAAW,mBAAmB+G,CAAS,wBACjHI,IAAW,+GAA+GnD,CAAc,gBAAgBR,EAAWlC,CAAS,CAAC,UAAUkC,EAAWjF,KAAS,EAAE,CAAC,iCAAiC2I,CAAQ,cAAc3B,EAAW,cAChR6B,IAAa,0DAA0DvI,CAAK,gDAAgDmF,CAAc,sBAAsBqB,CAAY,UAE5KgC,IAAYP,IACd,UAAUE,CAAQ,oBAAoBJ,CAAO,yEAAyE7C,CAAa,UAAUG,CAAS,qCAAqCD,CAAiB,oCAAoCkD,CAAQ,GAAGC,CAAU,WACrQ,UAAUJ,CAAQ,oBAAoBJ,CAAO,yEAAyE7C,CAAa,UAAUG,CAAS,qCAAqCD,CAAiB,oCAAoCmD,CAAU,GAAGD,CAAQ;AAEzQ,WAAO,YAAYG,EAAYrJ,EAAM,EAAE,CAAC,IAAIsJ,EAAgBtJ,EAAM,EAAE,CAAC,WAAWqF,CAAc,wBAAwBrE,CAAS,KAAKwE,EAAY,yDAAyDC,EAAc,2CAA2CuD,CAAY,qBAAqBzD,EAAWnF,KAAaC,KAAW,EAAE,CAAC,KAAKgH,CAAU,GAAG+B,CAAS;AAAA,EACtW;AAMA,MAAIxF,MAAUP,GAAW;AACvB,UAAMkG,IAASnI,KAAc,WACvBoI,IAAc1H,IAAW,GAAGA,CAAQ,UAAU;AAGpD,QAAI4G,IAAqB;AACvB,YAAMe,IAAmBb,EAAiB5I,EAAM,MAAM,IAAI,gBAAgB,GACpE6H,IAASe,EAAiB5I,EAAM,MAAM,IAAI,WAAW,GAErD0J,IAAanC;AAAA,QACjBpE;AAAA,QACAD;AAAA,QACAE;AAAA,QACArB;AAAA,QACAC;AAAA,QACA6F;AAAA,MAAA,GAGI8B,IAAW,mEAAmEJ,CAAM,+HAA+H3I,CAAK,sBAAsBwG,CAAY,UAC1PwC,IAAkB,qKAAqK7D,CAAc,MAAM2D,EAAW,IAAI,UAG1NN,IAAY,GAAGO,CAAQ,GAAGC,CAAe;AAG/C,UAAIC,IAAY;AAAA;AAAA,aAETJ,CAAgB;AAAA;AAAA;AAAA;AAAA,aAIhBA,CAAgB;AAAA;AAAA;AAAA;AAAA;AAKvB,MAAAI,KAAaH,EAAW;AAExB,YAAMI,KAAqB,UAAUD,CAAS,oBAAoBJ,CAAgB,qFAAqFzD,CAAiB,2CAA2CF,CAAa,2DAA2DG,CAAS,MAAMmD,CAAS;AAEnU,aAAO,YAAYC,EAAYrJ,EAAM,EAAE,CAAC,IAAIsJ,EAAgBtJ,EAAM,EAAE,CAAC,WAAWqF,CAAc,2CAA2CrE,CAAS,cAAcwI,CAAW,wFAAwFjE,EAAWlC,CAAS,CAAC,kHAAkHkC,EAAWnF,KAAaC,KAAW,EAAE,CAAC,KAAKgH,CAAU,GAAGlB,CAAW,GAAG2D,EAAkB;AAAA,IACpe;AAGA,UAAMH,IAAW;AAAA,qDACgC9H,EAAe,8BAA8B0H,CAAM,+HAA+H3I,CAAK;AAAA,UAClOwG,CAAY;AAAA;AAAA;AAIlB,WAAO,YAAYiC,EAAYrJ,EAAM,EAAE,CAAC,IAAIsJ,EAAgBtJ,EAAM,EAAE,CAAC,WAAWqF,CAAc,wBAAwBrE,CAAS,cAAcwI,CAAW,wFAAwFjE,EAAWlC,CAAS,CAAC,kHAAkHkC,EAAWnF,KAAaC,KAAW,EAAE,CAAC,KAAKgH,CAAU,GAAGlB,CAAW,GAAGwD,CAAQ;AAAA,EACvc;AAKA,MAAIjB,IAAqB;AACvB,UAAMqB,IAAenB,EAAiB5I,EAAM,MAAM,IAAI,kBAAkB,GAClE6H,IAASe,EAAiB5I,EAAM,MAAM,IAAI,WAAW,GACrDgK,IAAa/H,OAAkB,QAE/ByH,IAAanC;AAAA,MACjBpE;AAAA,MACAD;AAAA,MACAE;AAAA,MACArB;AAAA,MACAC;AAAA,MACA6F;AAAA,IAAA,GAGI+B,IAAkB,qKAAqK7D,CAAc,MAAM2D,EAAW,IAAI,UAC1NO,IAAkB,wDAAwDlE,CAAc,iCAAiCnF,CAAK,sCAAsCwG,CAAY;AAGtL,QAAIyC,IAAY;AAAA;AAAA,WAETE,CAAY;AAAA;AAAA;AAAA;AAAA,WAIZA,CAAY;AAAA,WACZA,CAAY;AAAA;AAAA;AAAA,WAGZA,CAAY;AAAA;AAAA;AAAA;AAAA;AAKnB,IAAAF,KAAaH,EAAW;AAExB,UAAMN,IAAYY,IACd,GAAGJ,CAAe,GAAGK,CAAe,KACpC,GAAGA,CAAe,GAAGL,CAAe,IAElCM,IAAiB,UAAUL,CAAS,oBAAoBE,CAAY,yEAAyEjE,CAAa,UAAUG,CAAS,gBAAgBD,CAAiB,yFAAyFoD,CAAS;AAEtT,WAAO,YAAYC,EAAYrJ,EAAM,EAAE,CAAC,IAAIsJ,EAAgBtJ,EAAM,EAAE,CAAC,WAAWqF,CAAc,2CAA2CrE,CAAS,KAAKwE,EAAY,yDAAyDC,EAAc,KAAKH,CAAO,2DAA2DC,EAAWnF,KAAaC,KAAW,EAAE,CAAC,KAAKgH,CAAU,GAAGlB,CAAW,GAAGC,EAAQ,GAAG8D,CAAc;AAAA,EAClZ;AAKA,QAAMC,KAAkB,0BAA0BtI,EAAe,+CAA+CjB,CAAK,sCAAsCwG,CAAY;AAEvK,SAAO,YAAYiC,EAAYrJ,EAAM,EAAE,CAAC,IAAIsJ,EAAgBtJ,EAAM,EAAE,CAAC,WAAWqF,CAAc,wBAAwBrE,CAAS,KAAKwE,EAAY,yDAAyDC,EAAc,KAAKH,CAAO,2DAA2DC,EAAWnF,KAAaC,KAAW,EAAE,CAAC,KAAKgH,CAAU,GAAGlB,CAAW,GAAGC,EAAQ,GAAG+D,EAAe;AAChY;AAuBA,SAASvD,GAAwBkB,GAAiF;AAChH,QAAM;AAAA,IACJ,SAAAsC;AAAA,IACA,YAAAlI;AAAA,IACA,sBAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,wBAAAC;AAAA,IACA,qBAAAC;AAAA,IACA,wBAAAC;AAAA,IACA,sBAAAC;AAAA,IACA,0BAAAC;AAAA,IACA,uBAAAC;AAAA,IACA,aAAA2H;AAAA,IACA,gBAAAC;AAAA,IACA,cAAAC;AAAA,IACA,eAAAC;AAAA,EAAA,IACE1C,GAGE2C,IAAoE;AAAA,IACxE,IAAI,EAAE,SAAS,oBAAoB,UAAU,WAAA;AAAA,IAC7C,IAAI,EAAE,SAAS,iBAAiB,UAAU,OAAA;AAAA,IAC1C,IAAI,EAAE,SAAS,eAAe,UAAU,WAAA;AAAA,EAAW,GAE/CC,IAAOD,EAAWvI,CAAU,KAAKuI,EAAW,IAG5CE,IAAa;AAAA,IACjB,YAAYD,EAAK,OAAO;AAAA,IACxB;AAAA,IACA,cAAcA,EAAK,QAAQ;AAAA,IAC3B;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,GAIIE,IAAgB,CAAC,GAAGD,GAAY,kBAAkBrI,CAAmB,IAAI;AAC/E,UAAQH,GAAA;AAAA,IACN,KAAK;AACH,MAAAyI,EAAc,KAAK,iCAAiC,qBAAqBxI,CAAkB,IAAI,UAAUA,CAAkB,EAAE;AAC7H;AAAA,IACF,KAAK;AACH,MAAAwI,EAAc,KAAK,iCAAiC,gBAAgB,UAAUxI,CAAkB,EAAE;AAClG;AAAA,IACF;AACE,MAAAwI,EAAc,KAAK,qBAAqBxI,CAAkB,IAAI,qBAAqBA,CAAkB,IAAI,UAAUC,CAAsB,EAAE;AAAA,EAAA;AAI/I,QAAMwI,IAAkB,CAAC,GAAGF,GAAY,kBAAkBjI,CAAqB,IAAI;AACnF,UAAQH,GAAA;AAAA,IACN,KAAK;AACH,MAAAsI,EAAgB,KAAK,qBAAqBrI,CAAoB,IAAI,qBAAqBA,CAAoB,IAAI,UAAUC,CAAwB,EAAE;AACnJ;AAAA,IACF,KAAK;AACH,MAAAoI,EAAgB,KAAK,iCAAiC,gBAAgB,UAAUpI,CAAwB,EAAE;AAC1G;AAAA,IACF;AACE,MAAAoI,EAAgB,KAAK,iCAAiC,qBAAqBrI,CAAoB,IAAI,UAAUC,CAAwB,EAAE;AAAA,EAAA;AAG3I,QAAMqI,IAAQV,IAAU,mBAAmBA,CAAO,OAAO;AACzD,MAAIW,IAAM;AAGV,MAAIV,MAAgB,QAAQ;AAE1B,UAAMW,IAAqBC,GAA0B;AAAA,MACnD,QAAQZ;AAAA,MACR,WAAWC;AAAA,MACX,aAAalI;AAAA,MAEb,SAASD;AAAA,IAAA,CACV,GAGK+I,IAAuBD,GAA0B;AAAA,MACrD,QAAQZ;AAAA,MACR,WAAWC;AAAA,MACX,aAAa9H;AAAA,MAEb,SAASD;AAAA,IAAA,CACV;AAED,IAAIyI,EAAmB,SACrBD,KAAO,GAAGD,CAAK,6BAA6BE,EAAmB,IAAI;AAAA,IAEjEE,EAAqB,SACvBH,KAAO,GAAGD,CAAK,+BAA+BI,EAAqB,IAAI;AAAA,IAGzEH,KAAO;AAAA,QACHD,CAAK,mCAAmCE,EAAmB,KAAK;AAAA,QAChEF,CAAK,qCAAqCI,EAAqB,KAAK;AAAA,OAGxEH,KAAOI,GAAA;AAAA,EACT;AAGA,SAAIZ,KAAgBA,MAAiB,WACnCQ,KAAOK,GAAyB,GAAGN,CAAK,2BAA2B;AAAA,IACjE,SAASP;AAAA,IACT,cAAcnI;AAAA,IACd,UAAUoI;AAAA,IACV,WAAWrI,MAAyB,UAAUE,IAAyBD;AAAA,EAAA,CACxE,GACD2I,KAAOK,GAAyB,GAAGN,CAAK,6BAA6B;AAAA,IACnE,SAASP;AAAA,IACT,cAAc/H;AAAA,IACd,UAAUgI;AAAA,IACV,WAAWjI,MAA2B,UAAUE,IAA2BD;AAAA,EAAA,CAC5E,IAGI;AAAA,IACL,SAASoI,EAAc,KAAK,IAAI;AAAA,IAChC,WAAWC,EAAgB,KAAK,IAAI;AAAA,IACpC,KAAAE;AAAA,EAAA;AAEJ;"}
1	+ {"version":3,"file":"HeroExporter.js","sources":["../../../../../src/engine/export/exporters/sections/HeroExporter.ts"],"sourcesContent":["/*\n Hero Section Exporter\n * Exporta Hero com múltiplas variações e customizações avançadas\n * Mobile-first responsive: split layout collapses to stack in mobile\n /\n\nimport { Block } from \"../../../schema/siteDocument\";\nimport { ThemeTokens } from \"../../../schema/themeTokens\";\nimport { PLACEHOLDER_IMAGE_URL, CAROUSEL_PLACEHOLDER_IMAGES } from \"../../../presets/heroVariations\";\nimport { dataBlockIdAttr, blockIdAttr, escapeHtml, resolveHref, linkTargetAttr } from \"../../shared/htmlHelpers\";\nimport { generateScopedId } from \"../../shared/idGenerator\";\nimport { generateCarouselCSS } from \"../../../shared/carouselAnimation\";\nimport {\n generateButtonHoverStyles,\n generateButtonOverlayCSS,\n getButtonHoverKeyframes,\n type ButtonHoverEffect,\n type ButtonHoverOverlay,\n} from \"../../../shared/hoverEffects\";\nimport { gridPresetMap, type ImageGridItem, type ImageGridPreset } from \"../../../shared/imageGrid\";\nimport {\n generateTypographyStyles,\n mergeTypographyWithDefaults,\n heroTitleDefaults,\n heroSubtitleDefaults,\n heroDescriptionDefaults,\n type TypographyConfig,\n} from \"../../../shared/typography\";\nimport { imageShadowMap } from \"../../../shared/shadowConstants\";\nimport { contentPositionMap, blockGapConfig } from \"../../../shared/layoutConstants\";\n\nexport function exportHero(\n block: Block,\n depth: number,\n basePath?: string,\n theme?: ThemeTokens,\n): string {\n const {\n variation,\n variant = \"centered\",\n title,\n subtitle,\n description,\n primaryButton,\n secondaryButton,\n badge,\n align = \"center\",\n contentPosition = \"center\",\n contentSpacing = \"default\",\n blockGap = \"default\",\n minHeight = \"80vh\",\n image,\n overlay,\n overlayColor,\n background,\n // Typography colors (legacy)\n titleColor,\n subtitleColor,\n descriptionColor,\n // Typography config (novo sistema)\n titleTypography,\n subtitleTypography,\n descriptionTypography,\n // Badge styling\n badgeColor,\n badgeTextColor,\n // Layout\n contentMaxWidth = \"800px\",\n paddingY,\n // Image styling\n imageRadius = 16,\n imageShadow = \"lg\",\n imagePosition = \"right\",\n // Button size\n buttonSize = \"md\",\n // Primary button styling\n primaryButtonVariant = \"solid\",\n primaryButtonColor,\n primaryButtonTextColor,\n primaryButtonRadius = 8,\n // Secondary button styling\n secondaryButtonVariant = \"outline\",\n secondaryButtonColor,\n secondaryButtonTextColor,\n secondaryButtonRadius = 8,\n // Button hover effects\n buttonHoverEffect = \"scale\",\n buttonHoverIntensity = 50,\n buttonHoverOverlay = \"none\",\n buttonHoverIconName = \"arrow-right\",\n // Decorative\n showWave,\n waveColor = \"rgba(255,255,255,0.1)\",\n // Image Grid\n imageGridEnabled,\n imageGridPreset = \"four-equal\",\n imageGridImages = [],\n imageGridGap = 8,\n // Carousel\n carouselImages,\n carouselInterval = 5,\n carouselTransition = \"crossfade\",\n } = (block as any).props;\n\n // Determine variation types\n const heroImage = image \|\| PLACEHOLDER_IMAGE_URL;\n const isSplit = variation === \"hero-split\" \|\| variant === \"split\";\n const isParallax = variation === \"hero-parallax\";\n const isOverlayVariant = variation === \"hero-overlay\";\n const isGradient = variation === \"hero-gradient\";\n const isMinimal = variation === \"hero-minimal\";\n const isCard = variation === \"hero-card\";\n const isCarousel = variation === \"hero-carousel\";\n const isImageBg = (variant === \"image-bg\" \|\| isOverlayVariant \|\| isParallax \|\| isCard \|\| isCarousel) && heroImage;\n const isOverlay = isImageBg && overlay;\n\n // Determine if dark background context\n const hasDarkBg = isOverlay \|\| isGradient \|\| isOverlayVariant \|\| isCarousel;\n\n // Theme colors\n const themePrimaryColor = theme?.colors?.primary \|\| \"#3b82f6\";\n const themePrimaryText = theme?.colors?.primaryText \|\| \"#ffffff\";\n\n // Text colors (fallback)\n const defaultTextColor = hasDarkBg ? \"#ffffff\" : \"var(--sg-text, #1f2937)\";\n const defaultMutedColor = hasDarkBg ? \"rgba(255,255,255,0.85)\" : \"var(--sg-muted-text, #6b7280)\";\n\n // Merge typography configs with defaults (retrocompatível com titleColor, etc.)\n const mergedTitleTypo = mergeTypographyWithDefaults(\n titleTypography as TypographyConfig \| undefined,\n { ...heroTitleDefaults, color: titleColor as string \| undefined }\n );\n const mergedSubtitleTypo = mergeTypographyWithDefaults(\n subtitleTypography as TypographyConfig \| undefined,\n { ...heroSubtitleDefaults, color: subtitleColor as string \| undefined }\n );\n const mergedDescriptionTypo = mergeTypographyWithDefaults(\n descriptionTypography as TypographyConfig \| undefined,\n { ...heroDescriptionDefaults, color: descriptionColor as string \| undefined }\n );\n\n // Generate typography CSS strings\n const titleTypoStyles = generateTypographyStyles(mergedTitleTypo, defaultTextColor);\n const subtitleTypoStyles = generateTypographyStyles(mergedSubtitleTypo, defaultMutedColor);\n const descriptionTypoStyles = generateTypographyStyles(mergedDescriptionTypo, defaultMutedColor);\n\n // Badge colors\n const finalBadgeColor = badgeColor \|\| themePrimaryColor;\n const finalBadgeTextColor = badgeTextColor \|\| \"#ffffff\";\n\n // Button colors\n const finalPrimaryBtnColor = primaryButtonColor \|\| themePrimaryColor;\n const finalPrimaryBtnTextColor = primaryButtonTextColor \|\| themePrimaryText;\n const finalSecondaryBtnColor = secondaryButtonColor \|\| (hasDarkBg ? \"#ffffff\" : themePrimaryColor);\n const finalSecondaryBtnTextColor = secondaryButtonTextColor \|\| finalSecondaryBtnColor;\n\n // Section classes\n const sectionClasses = [\n \"sg-hero\",\n variation ? `sg-hero--${String(variation).replace(\"hero-\", \"\")}` : \"\",\n isSplit ? \"sg-hero--split\" : \"\",\n isParallax ? \"sg-hero--parallax\" : \"\",\n isOverlayVariant ? \"sg-hero--overlay\" : \"\",\n isGradient ? \"sg-hero--gradient\" : \"\",\n isMinimal ? \"sg-hero--minimal\" : \"\",\n isCard ? \"sg-hero--card\" : \"\",\n isCarousel ? \"sg-hero--carousel\" : \"\",\n ]\n .filter(Boolean)\n .join(\" \");\n\n // Build background style\n let bgStyle = \"\";\n if (background) {\n bgStyle = `background: ${background};`;\n } else if (isImageBg && !isSplit) {\n bgStyle = `background-image: url(${escapeHtml(heroImage)}); background-size: cover; background-position: center;`;\n if (isParallax) bgStyle += \" background-attachment: fixed;\";\n } else {\n bgStyle = \"background-color: var(--sg-bg, #fff);\";\n }\n\n // Padding\n const paddingStyle = paddingY ? `padding: ${paddingY} 2rem;` : \"padding: 6rem 2rem;\";\n\n // Content position mapping for flexbox justify-content\n const justifyContent = contentPositionMap[contentPosition] \|\| \"center\";\n\n // Determine if layout has two blocks (content + image) - these should always be centered\n const hasTwoBlocks = isSplit \|\| isCard;\n // Note: shouldShowImageGrid is checked later, so we'll handle it in each section\n\n // Content spacing map - controls margin between elements\n const spacingMap: Record<string, { title: string; subtitle: string; description: string; badge: string; actions: string }> = {\n compact: { title: \"0.75rem\", subtitle: \"0.5rem\", description: \"1.25rem\", badge: \"1rem\", actions: \"0.25rem\" },\n default: { title: \"1.25rem\", subtitle: \"1rem\", description: \"2.5rem\", badge: \"1.5rem\", actions: \"0.5rem\" },\n spacious: { title: \"2.25rem\", subtitle: \"2rem\", description: \"3.5rem\", badge: \"2.5rem\", actions: \"1.5rem\" },\n };\n const spacing = spacingMap[contentSpacing] \|\| spacingMap.default;\n\n // Block gap configuration\n const blocksConfig = blockGapConfig[blockGap] \|\| blockGapConfig.default;\n const blocksJustify = blocksConfig.justify;\n const blocksMaxWidth = blocksConfig.blockMaxWidth;\n const containerMaxWidth = blocksConfig.containerMaxWidth;\n const blocksGap = blocksConfig.gap;\n\n // Overlay HTML\n const overlayStyle = overlayColor\n ? `position: absolute; inset: 0; background: ${overlayColor}; z-index: 0;`\n : \"position: absolute; inset: 0; background: linear-gradient(135deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.3) 100%); z-index: 0;\";\n const overlayHtml = isOverlay\n ? `<div class=\"sg-hero__overlay\" style=\"${overlayStyle}\"></div>`\n : \"\";\n\n // Wave SVG\n const waveHtml = showWave\n ? `<div style=\"position: absolute; bottom: 0; left: 0; right: 0; height: 150px; overflow: hidden; z-index: 1;\">\n <svg viewBox=\"0 0 1200 120\" preserveAspectRatio=\"none\" style=\"position: absolute; bottom: 0; width: 100%; height: 100%;\">\n <path d=\"M0,0V46.29c47.79,22.2,103.59,32.17,158,28,70.36-5.37,136.33-33.31,206.8-37.5C438.64,32.43,512.34,53.67,583,72.05c69.27,18,138.3,24.88,209.4,13.08,36.15-6,69.85-17.84,104.45-29.34C989.49,25,1113-14.29,1200,52.47V0Z\" fill=\"${waveColor}\" opacity=\"0.5\"/>\n <path d=\"M0,0V15.81C13,36.92,27.64,56.86,47.69,72.05,99.41,111.27,165,111,224.58,91.58c31.15-10.15,60.09-26.07,89.67-39.8,40.92-19,84.73-46,130.83-49.67,36.26-2.85,70.9,9.42,98.6,31.56,31.77,25.39,62.32,62,103.63,73,40.44,10.79,81.35-6.69,119.13-24.28s75.16-39,116.92-43.05c59.73-5.85,113.28,22.88,168.9,38.84,30.2,8.66,59,6.17,87.09-7.5,22.43-10.89,48-26.93,60.65-49.24V0Z\" fill=\"${waveColor}\" opacity=\"0.3\"/>\n </svg>\n </div>`\n : \"\";\n\n // Badge HTML\n const badgeHtml = badge\n ? `<span class=\"sg-hero__badge\" data-block-group=\"Badge\" style=\"display: inline-block; padding: 0.5rem 1.25rem; background: ${finalBadgeColor}; color: ${finalBadgeTextColor}; border-radius: 999px; font-size: 0.875rem; font-weight: 600; margin-bottom: ${spacing.badge};\">${escapeHtml(badge)}</span>`\n : \"\";\n\n // Title HTML - usa tipografia customizada com clamp para responsividade\n const titleFontSize = mergedTitleTypo.fontSize \|\| 48;\n const titleHtml = title\n ? `<h1 class=\"sg-hero__title\" style=\"${titleTypoStyles.cssString} font-size: clamp(2rem, 5vw, ${titleFontSize}px); line-height: 1.1; margin-bottom: ${spacing.title}; letter-spacing: -0.02em;\">${escapeHtml(title)}</h1>`\n : \"\";\n\n // Subtitle HTML - usa tipografia customizada com clamp para responsividade\n const subtitleFontSize = mergedSubtitleTypo.fontSize \|\| 24;\n const subtitleHtml = subtitle\n ? `<h2 class=\"sg-hero__subtitle\" style=\"${subtitleTypoStyles.cssString} font-size: clamp(1.125rem, 2.5vw, ${subtitleFontSize}px); line-height: 1.3; margin-bottom: ${spacing.subtitle};\">${escapeHtml(subtitle)}</h2>`\n : \"\";\n\n // Description HTML - usa tipografia customizada\n const descHtml = description\n ? `<p class=\"sg-hero__description\" style=\"max-width: 650px; margin: ${align === \"center\" ? `0 auto ${spacing.description}` : `0 0 ${spacing.description}`}; ${descriptionTypoStyles.cssString} line-height: 1.7;\">${escapeHtml(description)}</p>`\n : \"\";\n\n // Button styles\n const buttonStyles = resolveHeroButtonStyles({\n theme,\n blockId: block.id,\n buttonSize,\n primaryButtonVariant,\n primaryButtonColor: finalPrimaryBtnColor,\n primaryButtonTextColor: finalPrimaryBtnTextColor,\n primaryButtonRadius,\n secondaryButtonVariant,\n secondaryButtonColor: finalSecondaryBtnColor,\n secondaryButtonTextColor: finalSecondaryBtnTextColor,\n secondaryButtonRadius,\n hoverEffect: buttonHoverEffect,\n hoverIntensity: buttonHoverIntensity,\n hoverOverlay: buttonHoverOverlay,\n hoverIconName: buttonHoverIconName,\n });\n\n // Buttons HTML\n const primaryHref = primaryButton ? resolveHref(primaryButton.href \|\| \"#\", basePath) : \"#\";\n const secondaryHref = secondaryButton ? resolveHref(secondaryButton.href \|\| \"#\", basePath) : \"#\";\n const primaryBtnHtml = primaryButton\n ? `<a href=\"${escapeHtml(primaryHref)}\"${linkTargetAttr(primaryHref, basePath)} class=\"sg-hero__btn sg-hero__btn--primary\" data-block-group=\"Botão Primário\" style=\"${buttonStyles.primary}\">${escapeHtml(primaryButton.text)}</a>`\n : \"\";\n const secondaryBtnHtml = secondaryButton\n ? `<a href=\"${escapeHtml(secondaryHref)}\"${linkTargetAttr(secondaryHref, basePath)} class=\"sg-hero__btn sg-hero__btn--secondary\" data-block-group=\"Botão Secundário\" style=\"${buttonStyles.secondary}\">${escapeHtml(secondaryButton.text)}</a>`\n : \"\";\n const buttonsHtml =\n primaryButton \|\| secondaryButton\n ? `<div class=\"sg-hero__actions\" style=\"display: flex; gap: 1rem; flex-wrap: wrap; justify-content: ${align === \"center\" ? \"center\" : \"flex-start\"}; margin-top: ${spacing.actions};\">${primaryBtnHtml}${secondaryBtnHtml}</div>`\n : \"\";\n\n // Content block — wrap text content in a group for click-to-scroll\n const textContentHtml = (titleHtml \|\| subtitleHtml \|\| descHtml) ? `<div data-block-group=\"Conteúdo\">${titleHtml}${subtitleHtml}${descHtml}</div>` : \"\";\n const contentBlock = `${badgeHtml}${textContentHtml}${buttonsHtml}`;\n\n // Style block (hover effects)\n const styleBlock = buttonStyles.css ? `<style>${buttonStyles.css}</style>` : \"\";\n\n // Image fallback\n const imgFallback = `this.onerror=null;this.src='${escapeHtml(PLACEHOLDER_IMAGE_URL)}';`;\n\n // =========================================================================\n // IMAGE GRID EXPORT HELPER\n // =========================================================================\n const exportImageGrid = (\n images: ImageGridItem[],\n preset: ImageGridPreset,\n gap: number,\n radius: number,\n shadow: string,\n gridId: string\n ): { html: string; css: string } => {\n const config = gridPresetMap[preset];\n const shadowValue = imageShadowMap[shadow] \|\| imageShadowMap.lg;\n\n // Generate grid items HTML\n const itemsHtml = config.positions\n .map((pos, idx) => {\n const img = images[idx];\n const imgSrc = img?.src \|\| PLACEHOLDER_IMAGE_URL;\n const imgAlt = img?.alt \|\| `Imagem ${idx + 1}`;\n const imgScale = img?.scale ?? 1;\n const scaleStyle = imgScale !== 1 ? ` transform: scale(${imgScale}); z-index: 1;` : \"\";\n\n return `<div class=\"sg-hero__grid-item\" style=\"grid-column: ${pos.col}; grid-row: ${pos.row}; overflow: hidden; border-radius: ${radius}px;${scaleStyle}\">\n <img src=\"${escapeHtml(imgSrc)}\" alt=\"${escapeHtml(imgAlt)}\" style=\"width: 100%; height: 100%; object-fit: contain; display: block;\" onerror=\"${imgFallback}\" />\n </div>`;\n })\n .join(\"\");\n\n const gridHtml = `<div id=\"${gridId}\" class=\"sg-hero__image-grid\" style=\"display: grid; grid-template: ${config.gridTemplate}; gap: ${gap}px; width: 100%; max-width: 500px; aspect-ratio: 1 / 1;\">\n ${itemsHtml}\n </div>`;\n\n // Responsive CSS: collapse to single column on mobile\n const gridCss = `\n @media (max-width: 767px) {\n #${gridId} {\n grid-template: auto / 1fr !important;\n aspect-ratio: auto !important;\n }\n #${gridId} .sg-hero__grid-item {\n grid-column: 1 / -1 !important;\n grid-row: auto !important;\n aspect-ratio: 16 / 9;\n }\n }\n `;\n\n return { html: gridHtml, css: gridCss };\n };\n\n // Determine if we should use image grid (works in ANY variation now)\n const hasValidGridImages = imageGridImages && imageGridImages.length > 0 && (imageGridImages as ImageGridItem[]).some((img: ImageGridItem) => img?.src);\n const shouldShowImageGrid = imageGridEnabled && hasValidGridImages;\n\n // =========================================================================\n // RENDER: Carousel Layout (crossfade image background)\n // =========================================================================\n if (isCarousel) {\n const resolvedImages = (carouselImages && carouselImages.length >= 2)\n ? (carouselImages as string[])\n : CAROUSEL_PLACEHOLDER_IMAGES;\n const carouselScopeId = generateScopedId(block.id \|\| \"\", \"hero-carousel\");\n\n const carouselCss = generateCarouselCSS(\n `#${carouselScopeId}`,\n resolvedImages.length,\n carouselInterval as number,\n );\n\n // Generate carousel images HTML\n const carouselImagesHtml = resolvedImages\n .map((imgSrc: string, i: number) =>\n `<img src=\"${escapeHtml(imgSrc)}\" alt=\"Slide ${i + 1}\" class=\"sg-carousel__img\" ${i === 0 ? 'style=\"opacity: 1;\"' : ''} onerror=\"${imgFallback}\" />`\n )\n .join(\"\");\n\n // Dot indicators HTML\n const dotsHtml = `<div class=\"sg-carousel__dots\">${resolvedImages.map(() => '<span class=\"sg-carousel__dot\"></span>').join(\"\")}</div>`;\n\n // Overlay for carousel\n const carouselOverlayStyle = overlayColor\n ? `position: absolute; inset: 0; background: ${overlayColor}; z-index: 1;`\n : \"position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.7) 100%); z-index: 1;\";\n const carouselOverlayHtml = overlay\n ? `<div class=\"sg-hero__overlay\" style=\"${carouselOverlayStyle}\"></div>`\n : \"\";\n\n const carouselContentHtml = `<div style=\"max-width: ${contentMaxWidth}; width: 100%; padding: 0 2rem; text-align: ${align}; position: relative; z-index: 2;\">${contentBlock}</div>`;\n\n // Combine all CSS (carousel animation + button hover effects)\n const allCss = `<style>${carouselCss}${buttonStyles.css ? \"\\n\" + buttonStyles.css : \"\"}</style>`;\n\n return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses}\" style=\"min-height: ${minHeight}; ${paddingStyle} display: flex; align-items: center; justify-content: ${justifyContent}; position: relative; overflow: hidden; background: #000;\" data-variation=\"${escapeHtml(variation \|\| variant \|\| \"\")}\">${allCss}<div id=\"${carouselScopeId}\" style=\"position: absolute; inset: 0; z-index: 0;\">${carouselImagesHtml}${dotsHtml}</div>${carouselOverlayHtml}${carouselContentHtml}</section>`;\n }\n\n // =========================================================================\n // RENDER: Split Layout (without image grid)\n // =========================================================================\n if (isSplit && heroImage && !shouldShowImageGrid) {\n const splitId = generateScopedId(block.id \|\| \"\", \"hero-split\");\n const isImageLeft = imagePosition === \"left\";\n const imgShadow = imageShadowMap[imageShadow] \|\| imageShadowMap.lg;\n\n const splitCss = `\n @media (max-width: 1023px) {\n #${splitId} {\n grid-template-columns: 1fr !important;\n gap: 2rem !important;\n padding: 0 1rem !important;\n }\n #${splitId} .sg-hero__split-image {\n order: -1;\n }\n }\n `;\n\n const splitBgStyle = background ? `background: ${background};` : \"background-color: var(--sg-bg, #fff);\";\n const imgStyle = `width: 100%; max-width: 500px; height: auto; border-radius: ${imageRadius}px; box-shadow: ${imgShadow}; object-fit: cover;`;\n const imageDiv = `<div class=\"sg-hero__split-image\" data-block-group=\"Mídia\" style=\"display: flex; justify-content: center; flex: 0 1 auto; max-width: ${blocksMaxWidth};\"><img src=\"${escapeHtml(heroImage)}\" alt=\"${escapeHtml(title \|\| \"\")}\" class=\"sg-hero__img\" style=\"${imgStyle}\" onerror=\"${imgFallback}\" /></div>`;\n const contentDiv = `<div class=\"sg-hero__split-content\" style=\"text-align: ${align}; position: relative; z-index: 1; max-width: ${blocksMaxWidth}; flex: 0 1 auto;\">${contentBlock}</div>`;\n\n const innerHtml = isImageLeft\n ? `<style>${splitCss}</style><div id=\"${splitId}\" class=\"sg-hero__split-inner\" style=\"display: flex; justify-content: ${blocksJustify}; gap: ${blocksGap}; align-items: center; max-width: ${containerMaxWidth}; width: 100%; padding: 0 2rem;\">${imageDiv}${contentDiv}</div>`\n : `<style>${splitCss}</style><div id=\"${splitId}\" class=\"sg-hero__split-inner\" style=\"display: flex; justify-content: ${blocksJustify}; gap: ${blocksGap}; align-items: center; max-width: ${containerMaxWidth}; width: 100%; padding: 0 2rem;\">${contentDiv}${imageDiv}</div>`;\n\n return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses}\" style=\"min-height: ${minHeight}; ${paddingStyle} display: flex; align-items: center; justify-content: ${justifyContent}; position: relative; overflow: hidden; ${splitBgStyle}\" data-variation=\"${escapeHtml(variation \|\| variant \|\| \"\")}\">${styleBlock}${innerHtml}</section>`;\n }\n\n // =========================================================================\n // RENDER: Card Layout (supports both with and without Image Grid)\n // Card always stays on the left (original position), Grid on the right\n // =========================================================================\n if (isCard && heroImage) {\n const cardBg = background \|\| \"#ffffff\";\n const cardPadding = paddingY ? `${paddingY} 3rem` : \"6rem 3rem\";\n\n // With Image Grid: Card on left + Grid on right (preserves original card position)\n if (shouldShowImageGrid) {\n const cardGridLayoutId = generateScopedId(block.id \|\| \"\", \"hero-card-grid\");\n const gridId = generateScopedId(block.id \|\| \"\", \"hero-grid\");\n\n const gridResult = exportImageGrid(\n imageGridImages as ImageGridItem[],\n imageGridPreset as ImageGridPreset,\n imageGridGap as number,\n imageRadius,\n imageShadow,\n gridId\n );\n\n const cardHtml = `<div class=\"sg-hero__card\" style=\"max-width: 500px; background: ${cardBg}; padding: 2rem; border-radius: 16px; box-shadow: 0 25px 50px rgba(0,0,0,0.25); position: relative; z-index: 2; text-align: ${align}; flex: 0 1 auto;\">${contentBlock}</div>`;\n const gridWrapperHtml = `<div class=\"sg-hero__grid-wrapper\" data-block-group=\"Mídia\" style=\"position: relative; z-index: 3; display: flex; justify-content: center; align-items: center; flex: 0 1 auto; max-width: ${blocksMaxWidth};\">${gridResult.html}</div>`;\n\n // Card always left, Grid always right\n const innerHtml = `${cardHtml}${gridWrapperHtml}`;\n\n // Responsive CSS\n let layoutCss = `\n @media (max-width: 1023px) {\n #${cardGridLayoutId} {\n flex-direction: column !important;\n gap: 2rem !important;\n }\n #${cardGridLayoutId} .sg-hero__grid-wrapper {\n order: -1;\n }\n }\n `;\n layoutCss += gridResult.css;\n\n const cardGridLayoutHtml = `<style>${layoutCss}</style><div id=\"${cardGridLayoutId}\" class=\"sg-hero__card-grid-layout\" style=\"display: flex; width: 100%; max-width: ${containerMaxWidth}; align-items: center; justify-content: ${blocksJustify}; position: relative; z-index: 2; padding: 0 2rem; gap: ${blocksGap};\">${innerHtml}</div>`;\n\n return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses} sg-hero--with-grid\" style=\"min-height: ${minHeight}; padding: ${cardPadding}; display: flex; align-items: center; justify-content: center; background-image: url(${escapeHtml(heroImage)}); background-size: cover; background-position: center; position: relative; overflow: hidden;\" data-variation=\"${escapeHtml(variation \|\| variant \|\| \"\")}\">${styleBlock}${overlayHtml}${cardGridLayoutHtml}</section>`;\n }\n\n // Without Image Grid: Original card layout\n const cardHtml = `\n <div class=\"sg-hero__card\" style=\"max-width: ${contentMaxWidth}; width: 100%; background: ${cardBg}; padding: 2rem; border-radius: 16px; box-shadow: 0 25px 50px rgba(0,0,0,0.25); position: relative; z-index: 2; text-align: ${align};\">\n ${contentBlock}\n </div>\n `;\n\n return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses}\" style=\"min-height: ${minHeight}; padding: ${cardPadding}; display: flex; align-items: center; justify-content: center; background-image: url(${escapeHtml(heroImage)}); background-size: cover; background-position: center; position: relative; overflow: hidden;\" data-variation=\"${escapeHtml(variation \|\| variant \|\| \"\")}\">${styleBlock}${overlayHtml}${cardHtml}</section>`;\n }\n\n // =========================================================================\n // RENDER: With Image Grid (any variation) - Floating grid alongside content\n // =========================================================================\n if (shouldShowImageGrid) {\n const gridLayoutId = generateScopedId(block.id \|\| \"\", \"hero-grid-layout\");\n const gridId = generateScopedId(block.id \|\| \"\", \"hero-grid\");\n const isGridLeft = imagePosition === \"left\";\n\n const gridResult = exportImageGrid(\n imageGridImages as ImageGridItem[],\n imageGridPreset as ImageGridPreset,\n imageGridGap as number,\n imageRadius,\n imageShadow,\n gridId\n );\n\n const gridWrapperHtml = `<div class=\"sg-hero__grid-wrapper\" data-block-group=\"Mídia\" style=\"position: relative; z-index: 3; display: flex; justify-content: center; align-items: center; flex: 1 1 0%; max-width: ${blocksMaxWidth};\">${gridResult.html}</div>`;\n const contentSideHtml = `<div class=\"sg-hero__content-side\" style=\"max-width: ${blocksMaxWidth}; flex: 1 1 0%; text-align: ${align}; position: relative; z-index: 2;\">${contentBlock}</div>`;\n\n // Responsive CSS for the grid layout\n let layoutCss = `\n @media (max-width: 1023px) {\n #${gridLayoutId} {\n flex-direction: column !important;\n gap: 2rem !important;\n }\n #${gridLayoutId} .sg-hero__grid-wrapper,\n #${gridLayoutId} .sg-hero__content-side {\n max-width: 100% !important;\n }\n #${gridLayoutId} .sg-hero__grid-wrapper {\n order: -1;\n }\n }\n `;\n layoutCss += gridResult.css;\n\n const innerHtml = isGridLeft\n ? `${gridWrapperHtml}${contentSideHtml}`\n : `${contentSideHtml}${gridWrapperHtml}`;\n\n const gridLayoutHtml = `<style>${layoutCss}</style><div id=\"${gridLayoutId}\" class=\"sg-hero__grid-layout\" style=\"display: flex; justify-content: ${blocksJustify}; gap: ${blocksGap}; max-width: ${containerMaxWidth}; width: 100%; align-items: center; position: relative; z-index: 2; padding: 0 2rem;\">${innerHtml}</div>`;\n\n return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses} sg-hero--with-grid\" style=\"min-height: ${minHeight}; ${paddingStyle} display: flex; align-items: center; justify-content: ${justifyContent}; ${bgStyle} position: relative; overflow: hidden;\" data-variation=\"${escapeHtml(variation \|\| variant \|\| \"\")}\">${styleBlock}${overlayHtml}${waveHtml}${gridLayoutHtml}</section>`;\n }\n\n // =========================================================================\n // RENDER: Default (centered, gradient, minimal, parallax, overlay)\n // =========================================================================\n const contentWrapHtml = `<div style=\"max-width: ${contentMaxWidth}; width: 100%; padding: 0 2rem; text-align: ${align}; position: relative; z-index: 2;\">${contentBlock}</div>`;\n\n return `<section ${blockIdAttr(block.id)} ${dataBlockIdAttr(block.id)} class=\"${sectionClasses}\" style=\"min-height: ${minHeight}; ${paddingStyle} display: flex; align-items: center; justify-content: ${justifyContent}; ${bgStyle} position: relative; overflow: hidden;\" data-variation=\"${escapeHtml(variation \|\| variant \|\| \"\")}\">${styleBlock}${overlayHtml}${waveHtml}${contentWrapHtml}</section>`;\n}\n\n/\n Resolve hero button styles with independent customization for primary and secondary\n */\ninterface ButtonStylesConfig {\n theme?: ThemeTokens;\n blockId: string;\n buttonSize: string;\n primaryButtonVariant: string;\n primaryButtonColor: string;\n primaryButtonTextColor: string;\n primaryButtonRadius: number;\n secondaryButtonVariant: string;\n secondaryButtonColor: string;\n secondaryButtonTextColor: string;\n secondaryButtonRadius: number;\n hoverEffect: string;\n hoverIntensity: number;\n hoverOverlay: string;\n hoverIconName: string;\n}\n\nfunction resolveHeroButtonStyles(config: ButtonStylesConfig): { primary: string; secondary: string; css: string } {\n const {\n blockId,\n buttonSize,\n primaryButtonVariant,\n primaryButtonColor,\n primaryButtonTextColor,\n primaryButtonRadius,\n secondaryButtonVariant,\n secondaryButtonColor,\n secondaryButtonTextColor,\n secondaryButtonRadius,\n hoverEffect,\n hoverIntensity,\n hoverOverlay,\n hoverIconName,\n } = config;\n\n // Size-based styles\n const sizeStyles: Record<string, { padding: string; fontSize: string }> = {\n sm: { padding: \"0.625rem 1.25rem\", fontSize: \"0.875rem\" },\n md: { padding: \"0.875rem 2rem\", fontSize: \"1rem\" },\n lg: { padding: \"1rem 2.5rem\", fontSize: \"1.125rem\" },\n };\n const size = sizeStyles[buttonSize] \|\| sizeStyles.md;\n\n // Base button styles\n const baseStyles = [\n `padding: ${size.padding}`,\n \"font-weight: 600\",\n `font-size: ${size.fontSize}`,\n \"text-decoration: none\",\n \"display: inline-flex\",\n \"align-items: center\",\n \"justify-content: center\",\n \"gap: 0.5rem\",\n \"transition: all 0.2s ease\",\n \"position: relative\",\n \"overflow: hidden\",\n \"cursor: pointer\",\n ];\n\n // Primary button styles\n const primaryStyles = [...baseStyles, `border-radius: ${primaryButtonRadius}px`];\n switch (primaryButtonVariant) {\n case \"outline\":\n primaryStyles.push(`background-color: transparent`, `border: 2px solid ${primaryButtonColor}`, `color: ${primaryButtonColor}`);\n break;\n case \"ghost\":\n primaryStyles.push(`background-color: transparent`, `border: none`, `color: ${primaryButtonColor}`);\n break;\n default: // solid\n primaryStyles.push(`background-color: ${primaryButtonColor}`, `border: 2px solid ${primaryButtonColor}`, `color: ${primaryButtonTextColor}`);\n }\n\n // Secondary button styles\n const secondaryStyles = [...baseStyles, `border-radius: ${secondaryButtonRadius}px`];\n switch (secondaryButtonVariant) {\n case \"solid\":\n secondaryStyles.push(`background-color: ${secondaryButtonColor}`, `border: 2px solid ${secondaryButtonColor}`, `color: ${secondaryButtonTextColor}`);\n break;\n case \"ghost\":\n secondaryStyles.push(`background-color: transparent`, `border: none`, `color: ${secondaryButtonTextColor}`);\n break;\n default: // outline\n secondaryStyles.push(`background-color: transparent`, `border: 2px solid ${secondaryButtonColor}`, `color: ${secondaryButtonTextColor}`);\n }\n\n const scope = blockId ? `[data-block-id=\"${blockId}\"]` : \"\";\n let css = \"\";\n\n // Hover effects\n if (hoverEffect !== \"none\") {\n // Primary button hover\n const primaryHoverResult = generateButtonHoverStyles({\n effect: hoverEffect as ButtonHoverEffect,\n intensity: hoverIntensity,\n buttonColor: primaryButtonColor,\n buttonTextColor: primaryButtonVariant === \"solid\" ? primaryButtonTextColor : primaryButtonColor,\n variant: primaryButtonVariant as \"solid\" \| \"outline\" \| \"ghost\",\n });\n\n // Secondary button hover\n const secondaryHoverResult = generateButtonHoverStyles({\n effect: hoverEffect as ButtonHoverEffect,\n intensity: hoverIntensity,\n buttonColor: secondaryButtonColor,\n buttonTextColor: secondaryButtonVariant === \"solid\" ? secondaryButtonTextColor : secondaryButtonColor,\n variant: secondaryButtonVariant as \"solid\" \| \"outline\" \| \"ghost\",\n });\n\n if (primaryHoverResult.base) {\n css += `${scope} .sg-hero__btn--primary { ${primaryHoverResult.base} }\\n`;\n }\n if (secondaryHoverResult.base) {\n css += `${scope} .sg-hero__btn--secondary { ${secondaryHoverResult.base} }\\n`;\n }\n\n css += `\n ${scope} .sg-hero__btn--primary:hover { ${primaryHoverResult.hover} }\n ${scope} .sg-hero__btn--secondary:hover { ${secondaryHoverResult.hover} }\n `;\n\n css += getButtonHoverKeyframes();\n }\n\n // Overlay effects\n if (hoverOverlay && hoverOverlay !== \"none\") {\n css += generateButtonOverlayCSS(`${scope} .sg-hero__btn--primary`, {\n overlay: hoverOverlay as ButtonHoverOverlay,\n primaryColor: primaryButtonColor,\n iconName: hoverIconName,\n textColor: primaryButtonVariant === \"solid\" ? primaryButtonTextColor : primaryButtonColor,\n });\n css += generateButtonOverlayCSS(`${scope} .sg-hero__btn--secondary`, {\n overlay: hoverOverlay as ButtonHoverOverlay,\n primaryColor: secondaryButtonColor,\n iconName: hoverIconName,\n textColor: secondaryButtonVariant === \"solid\" ? secondaryButtonTextColor : secondaryButtonColor,\n });\n }\n\n return {\n primary: primaryStyles.join(\"; \"),\n secondary: secondaryStyles.join(\"; \"),\n css,\n };\n}\n\n"],"names":["exportHero","block","depth","basePath","theme","variation","variant","title","subtitle","description","primaryButton","secondaryButton","badge","align","contentPosition","contentSpacing","blockGap","minHeight","image","overlay","overlayColor","background","titleColor","subtitleColor","descriptionColor","titleTypography","subtitleTypography","descriptionTypography","badgeColor","badgeTextColor","contentMaxWidth","paddingY","imageRadius","imageShadow","imagePosition","buttonSize","primaryButtonVariant","primaryButtonColor","primaryButtonTextColor","primaryButtonRadius","secondaryButtonVariant","secondaryButtonColor","secondaryButtonTextColor","secondaryButtonRadius","buttonHoverEffect","buttonHoverIntensity","buttonHoverOverlay","buttonHoverIconName","showWave","waveColor","imageGridEnabled","imageGridPreset","imageGridImages","imageGridGap","carouselImages","carouselInterval","carouselTransition","heroImage","PLACEHOLDER_IMAGE_URL","isSplit","isParallax","isOverlayVariant","isGradient","isMinimal","isCard","isCarousel","isImageBg","isOverlay","hasDarkBg","themePrimaryColor","themePrimaryText","defaultTextColor","defaultMutedColor","mergedTitleTypo","mergeTypographyWithDefaults","heroTitleDefaults","mergedSubtitleTypo","heroSubtitleDefaults","mergedDescriptionTypo","heroDescriptionDefaults","titleTypoStyles","generateTypographyStyles","subtitleTypoStyles","descriptionTypoStyles","finalBadgeColor","finalBadgeTextColor","finalPrimaryBtnColor","finalPrimaryBtnTextColor","finalSecondaryBtnColor","finalSecondaryBtnTextColor","sectionClasses","bgStyle","escapeHtml","paddingStyle","justifyContent","contentPositionMap","spacingMap","spacing","blocksConfig","blockGapConfig","blocksJustify","blocksMaxWidth","containerMaxWidth","blocksGap","overlayStyle","overlayHtml","waveHtml","badgeHtml","titleFontSize","titleHtml","subtitleFontSize","subtitleHtml","descHtml","buttonStyles","resolveHeroButtonStyles","primaryHref","resolveHref","secondaryHref","primaryBtnHtml","linkTargetAttr","secondaryBtnHtml","buttonsHtml","textContentHtml","contentBlock","styleBlock","imgFallback","exportImageGrid","images","preset","gap","radius","shadow","gridId","config","gridPresetMap","itemsHtml","pos","idx","img","imgSrc","imgAlt","imgScale","scaleStyle","gridHtml","gridCss","hasValidGridImages","shouldShowImageGrid","resolvedImages","CAROUSEL_PLACEHOLDER_IMAGES","carouselScopeId","generateScopedId","carouselCss","generateCarouselCSS","carouselImagesHtml","i","dotsHtml","carouselOverlayStyle","carouselOverlayHtml","carouselContentHtml","allCss","blockIdAttr","dataBlockIdAttr","splitId","isImageLeft","imgShadow","imageShadowMap","splitCss","splitBgStyle","imgStyle","imageDiv","contentDiv","innerHtml","cardBg","cardPadding","cardGridLayoutId","gridResult","cardHtml","gridWrapperHtml","layoutCss","cardGridLayoutHtml","gridLayoutId","isGridLeft","contentSideHtml","gridLayoutHtml","contentWrapHtml","blockId","hoverEffect","hoverIntensity","hoverOverlay","hoverIconName","sizeStyles","size","baseStyles","primaryStyles","secondaryStyles","scope","css","primaryHoverResult","generateButtonHoverStyles","secondaryHoverResult","getButtonHoverKeyframes","generateButtonOverlayCSS"],"mappings":"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"}

package/dist/engine/export/exporters/sections/MarketingExporters.js CHANGED Viewed

@@ -1,43 +1,43 @@
-import { dataBlockIdAttr as $, escapeHtml as e, resolveHref as G, linkTargetAttr as R, blockIdAttr as w } from "../../shared/htmlHelpers.js";
-import { generateScopedId as H } from "../../shared/idGenerator.js";
-import { resolveResponsiveColumns as C, generateResponsiveGridStyles as B } from "../../shared/responsiveGridHelper.js";
-import { generateButtonHoverStyles as A, generateButtonOverlayCSS as E, getButtonHoverKeyframes as J } from "../../../shared/hoverEffects/buttonHover.js";
+import { dataBlockIdAttr as $, escapeHtml as e, resolveHref as E, linkTargetAttr as F, blockIdAttr as w } from "../../shared/htmlHelpers.js";
+import { generateScopedId as C } from "../../shared/idGenerator.js";
+import { resolveResponsiveColumns as k, generateResponsiveGridStyles as S } from "../../shared/responsiveGridHelper.js";
+import { generateButtonHoverStyles as G, generateButtonOverlayCSS as R, getButtonHoverKeyframes as J } from "../../../shared/hoverEffects/buttonHover.js";
 function Z(t, p, l, m) {
-  const { icon: n, title: i, description: r } = t.props, o = n ? '<div style="width: 3rem; height: 3rem; background-color: var(--sg-primary); border-radius: 0.75rem; display: flex; align-items: center; justify-content: center; margin: 0 auto 1rem; color: #fff;">[★]</div>' : "";
-  return `<div ${$(t.id)} style="padding: 1.5rem; text-align: center;">${o}<h3 style="font-size: 1.25rem; font-weight: 600; margin-bottom: 0.5rem;">${e(i)}</h3><p style="color: var(--sg-muted-text); font-size: 0.875rem;">${e(r)}</p></div>`;
+  const { icon: n, title: o, description: r } = t.props, i = n ? '<div style="width: 3rem; height: 3rem; background-color: var(--sg-primary); border-radius: 0.75rem; display: flex; align-items: center; justify-content: center; margin: 0 auto 1rem; color: #fff;">[★]</div>' : "";
+  return `<div ${$(t.id)} data-block-group="Conteúdo" style="padding: 1.5rem; text-align: center;">${i}<h3 style="font-size: 1.25rem; font-weight: 600; margin-bottom: 0.5rem;">${e(o)}</h3><p style="color: var(--sg-muted-text); font-size: 0.875rem;">${e(r)}</p></div>`;
 }
 function tt(t, p, l, m, n) {
   const {
-    title: i,
+    title: o,
     subtitle: r,
-    columns: o = 3,
-    variant: s = "default",
-    features: a = []
-  } = t.props, d = H(t.id || "", "feature-grid"), v = C(o, 1, 2, o), { inlineStyles: g, mediaQueries: y } = B(d, v, "2rem"), u = s === "image-cards", f = i || r ? `<div style="text-align: center; margin-bottom: 3rem;">${i ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(i)}</h2>` : ""}${r ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(r)}</p>` : ""}</div>` : "", z = a.map((c) => {
-    const h = u && c.image ? `<div style="width: 100%; height: 200px; background-image: url(${e(c.image)}); background-size: cover; background-position: center;"></div>` : "", b = !u && c.icon ? '<div style="width: 3rem; height: 3rem; background-color: var(--sg-primary); border-radius: 0.75rem; display: flex; align-items: center; justify-content: center; margin-bottom: 1rem; color: #fff;">[★]</div>' : "", _ = c.link ? `<a href="${e(c.link.href || "#")}" style="display: inline-block; margin-top: 0.75rem; color: var(--sg-primary); font-weight: 500; text-decoration: none; border: 1px solid var(--sg-primary); padding: 0.5rem 1rem; border-radius: var(--sg-button-radius);">${e(c.link.text)}</a>` : "", S = u && c.image ? "1.5rem" : "2rem";
-    return `<div style="background-color: var(--sg-bg); border-radius: 0.75rem; padding: ${u && c.image ? 0 : "2rem"}; box-shadow: var(--sg-card-shadow); overflow: hidden;">${h}<div style="padding: ${S};">${b}<h3 style="font-size: 1.25rem; font-weight: 600; margin-bottom: 0.5rem;">${e(c.title)}</h3><p style="color: var(--sg-muted-text);">${e(c.description)}</p>${_}</div></div>`;
+    columns: i = 3,
+    variant: a = "default",
+    features: s = []
+  } = t.props, d = C(t.id || "", "feature-grid"), u = k(i, 1, 2, i), { inlineStyles: g, mediaQueries: v } = S(d, u, "2rem"), y = a === "image-cards", f = o || r ? `<div data-block-group="Conteúdo" style="text-align: center; margin-bottom: 3rem;">${o ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(o)}</h2>` : ""}${r ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(r)}</p>` : ""}</div>` : "", z = s.map((c) => {
+    const h = y && c.image ? `<div style="width: 100%; height: 200px; background-image: url(${e(c.image)}); background-size: cover; background-position: center;"></div>` : "", b = !y && c.icon ? '<div style="width: 3rem; height: 3rem; background-color: var(--sg-primary); border-radius: 0.75rem; display: flex; align-items: center; justify-content: center; margin-bottom: 1rem; color: #fff;">[★]</div>' : "", B = c.link ? `<a href="${e(c.link.href || "#")}" style="display: inline-block; margin-top: 0.75rem; color: var(--sg-primary); font-weight: 500; text-decoration: none; border: 1px solid var(--sg-primary); padding: 0.5rem 1rem; border-radius: var(--sg-button-radius);">${e(c.link.text)}</a>` : "", H = y && c.image ? "1.5rem" : "2rem";
+    return `<div style="background-color: var(--sg-bg); border-radius: 0.75rem; padding: ${y && c.image ? 0 : "2rem"}; box-shadow: var(--sg-card-shadow); overflow: hidden;">${h}<div style="padding: ${H};">${b}<h3 style="font-size: 1.25rem; font-weight: 600; margin-bottom: 0.5rem;">${e(c.title)}</h3><p style="color: var(--sg-muted-text);">${e(c.description)}</p>${B}</div></div>`;
   }).join("");
-  return `<style>${y}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-surface);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem;">${f}<div id="${d}" style="${g}">${z}</div></div></section>`;
+  return `<style>${v}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-surface);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem;">${f}<div data-block-group="Layout" id="${d}" style="${g}">${z}</div></div></section>`;
 }
 function et(t, p, l, m) {
   const {
     title: n,
-    description: i,
+    description: o,
     primaryButton: r,
-    secondaryButton: o,
-    variant: s = "centered",
+    secondaryButton: i,
+    variant: a = "centered",
     // Button size
-    buttonSize: a = "md",
+    buttonSize: s = "md",
     // Button hover effects
     buttonHoverEffect: d = "scale",
-    buttonHoverIntensity: v = 50,
+    buttonHoverIntensity: u = 50,
     buttonHoverOverlay: g = "none",
-    buttonHoverIconName: y = "arrow-right"
-  } = t.props, u = {
+    buttonHoverIconName: v = "arrow-right"
+  } = t.props, y = {
     sm: { padding: "0.5rem 1rem", fontSize: "0.875rem" },
     md: { padding: "0.75rem 1.5rem", fontSize: "1rem" },
     lg: { padding: "1rem 2rem", fontSize: "1.125rem" }
-  }, f = u[a] || u.md, z = H(t.id || "", "cta-actions"), c = `[data-block-id="${t.id}"]`, h = s === "gradient", b = m?.colors?.primary || "#3b82f6", _ = m?.colors?.primaryText || "#ffffff", S = h ? "#fff" : b, I = h ? b : _, N = "transparent", q = h ? "#fff" : b, P = h ? "#fff" : b;
+  }, f = y[s] || y.md, z = C(t.id || "", "cta-actions"), c = `[data-block-id="${t.id}"]`, h = a === "gradient", b = m?.colors?.primary || "#3b82f6", B = m?.colors?.primaryText || "#ffffff", H = h ? "#fff" : b, I = h ? b : B, L = "transparent", q = h ? "#fff" : b, P = h ? "#fff" : b;
   let x = `
     @media (max-width: 640px) {
       #${z} {
@@ -51,68 +51,68 @@ function et(t, p, l, m) {
     }
   `;
   if (d !== "none") {
-    const j = A({
+    const _ = G({
       effect: d,
-      intensity: v,
-      buttonColor: S,
+      intensity: u,
+      buttonColor: H,
       variant: "solid"
-    }), k = A({
+    }), j = G({
       effect: d,
-      intensity: v,
+      intensity: u,
       buttonColor: P,
       variant: "outline"
     });
-    j.base && (x += `
+    _.base && (x += `
         ${c} .sg-cta__btn--primary {
-          ${j.base}
+          ${_.base}
         }
-      `), k.base && (x += `
+      `), j.base && (x += `
         ${c} .sg-cta__btn--secondary {
-          ${k.base}
+          ${j.base}
         }
       `), x += `
       ${c} .sg-cta__btn--primary:hover {
-        ${j.hover}
+        ${_.hover}
       }
       ${c} .sg-cta__btn--secondary:hover {
-        ${k.hover}
+        ${j.hover}
       }
     `, x += J();
   }
-  g && g !== "none" && (x += E(`${c} .sg-cta__btn--primary`, {
+  g && g !== "none" && (x += R(`${c} .sg-cta__btn--primary`, {
     overlay: g,
     primaryColor: b,
-    iconName: y,
+    iconName: v,
     textColor: I
-  }), x += E(`${c} .sg-cta__btn--secondary`, {
+  }), x += R(`${c} .sg-cta__btn--secondary`, {
     overlay: g,
     primaryColor: b,
-    iconName: y,
+    iconName: v,
     textColor: q
   }));
-  const Q = h ? "background: linear-gradient(135deg, var(--sg-primary), var(--sg-accent));" : "background-color: var(--sg-surface);", L = h ? "#fff" : "var(--sg-text)", M = h ? "rgba(255,255,255,0.9)" : "var(--sg-muted-text)", T = r ? G(r.href || "#", l) : "#", F = o ? G(o.href || "#", l) : "#", O = `padding: ${f.padding}; font-size: ${f.fontSize}; background-color: ${S}; color: ${I}; border-radius: var(--sg-button-radius); text-decoration: none; font-weight: 500; display: inline-block; transition: all 0.2s ease; position: relative; overflow: hidden;`, D = `padding: ${f.padding}; font-size: ${f.fontSize}; background-color: ${N}; color: ${q}; border: 2px solid ${P}; border-radius: var(--sg-button-radius); text-decoration: none; font-weight: 500; display: inline-block; transition: all 0.2s ease; position: relative; overflow: hidden;`, K = r ? `<a href="${e(T)}"${R(T, l)} class="sg-cta__btn sg-cta__btn--primary" style="${O}">${e(r.text)}</a>` : "", U = o ? `<a href="${e(F)}"${R(F, l)} class="sg-cta__btn sg-cta__btn--secondary" style="${D}">${e(o.text)}</a>` : "";
-  return `<style>${x}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; ${Q} text-align: center;"><div style="max-width: 800px; margin: 0 auto; padding: 0 1rem;"><h2 style="font-size: var(--sg-heading-h2); margin-bottom: 1rem; color: ${L};">${e(n)}</h2>${i ? `<p style="font-size: 1.125rem; margin-bottom: 2rem; color: ${M};">${e(i)}</p>` : ""}<div id="${z}" style="display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap;">${K}${U}</div></div></section>`;
+  const N = h ? "background: linear-gradient(135deg, var(--sg-primary), var(--sg-accent));" : "background-color: var(--sg-surface);", Q = h ? "#fff" : "var(--sg-text)", M = h ? "rgba(255,255,255,0.9)" : "var(--sg-muted-text)", T = r ? E(r.href || "#", l) : "#", A = i ? E(i.href || "#", l) : "#", O = `padding: ${f.padding}; font-size: ${f.fontSize}; background-color: ${H}; color: ${I}; border-radius: var(--sg-button-radius); text-decoration: none; font-weight: 500; display: inline-block; transition: all 0.2s ease; position: relative; overflow: hidden;`, D = `padding: ${f.padding}; font-size: ${f.fontSize}; background-color: ${L}; color: ${q}; border: 2px solid ${P}; border-radius: var(--sg-button-radius); text-decoration: none; font-weight: 500; display: inline-block; transition: all 0.2s ease; position: relative; overflow: hidden;`, K = r ? `<a href="${e(T)}"${F(T, l)} class="sg-cta__btn sg-cta__btn--primary" style="${O}">${e(r.text)}</a>` : "", U = i ? `<a href="${e(A)}"${F(A, l)} class="sg-cta__btn sg-cta__btn--secondary" style="${D}">${e(i.text)}</a>` : "";
+  return `<style>${x}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; ${N} text-align: center;"><div style="max-width: 800px; margin: 0 auto; padding: 0 1rem;"><div data-block-group="Conteúdo"><h2 style="font-size: var(--sg-heading-h2); margin-bottom: 1rem; color: ${Q};">${e(n)}</h2>${o ? `<p style="font-size: 1.125rem; margin-bottom: 2rem; color: ${M};">${e(o)}</p>` : ""}</div><div data-block-group="Botoes" id="${z}" style="display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap;">${K}${U}</div></div></section>`;
 }
 function rt(t, p, l, m) {
   const {
     name: n,
-    price: i,
+    price: o,
     period: r,
-    description: o,
-    features: s = [],
-    buttonText: a,
+    description: i,
+    features: a = [],
+    buttonText: s,
     highlighted: d,
-    badge: v
-  } = t.props, g = v ? `<span style="position: absolute; top: -0.75rem; right: 1rem; background-color: var(--sg-primary); color: #fff; padding: 0.25rem 0.75rem; border-radius: 9999px; font-size: 0.75rem;">${e(v)}</span>` : "", y = s.map(
+    badge: u
+  } = t.props, g = u ? `<span style="position: absolute; top: -0.75rem; right: 1rem; background-color: var(--sg-primary); color: #fff; padding: 0.25rem 0.75rem; border-radius: 9999px; font-size: 0.75rem;">${e(u)}</span>` : "", v = a.map(
     (f) => `<li style="padding: 0.5rem 0; display: flex; align-items: center; gap: 0.5rem;"><span style="color: var(--sg-success);">✓</span>${e(f)}</li>`
-  ).join(""), u = d ? "background-color: var(--sg-primary); color: var(--sg-primary-text); border: none;" : "background-color: transparent; color: var(--sg-primary); border: 1px solid var(--sg-primary);";
-  return `<div ${$(t.id)} style="background-color: var(--sg-bg); border-radius: 0.75rem; padding: 2rem; box-shadow: ${d ? "var(--sg-shadow-strong)" : "var(--sg-card-shadow)"}; border: ${d ? "2px solid var(--sg-primary)" : "1px solid var(--sg-border)"}; position: relative;">${g}<h3 style="font-size: 1.25rem; font-weight: 600; margin-bottom: 0.5rem;">${e(n)}</h3>${o ? `<p style="color: var(--sg-muted-text); margin-bottom: 1rem;">${e(o)}</p>` : ""}<div style="margin-bottom: 1.5rem;"><span style="font-size: 2.5rem; font-weight: 700;">${e(i)}</span>${r ? `<span style="color: var(--sg-muted-text);">${e(r)}</span>` : ""}</div><ul style="list-style: none; padding: 0; margin-bottom: 1.5rem;">${y}</ul>${a ? `<button style="width: 100%; padding: 0.625rem 1.25rem; ${u} border-radius: var(--sg-button-radius); font-weight: 500; cursor: pointer;">${e(a)}</button>` : ""}</div>`;
+  ).join(""), y = d ? "background-color: var(--sg-primary); color: var(--sg-primary-text); border: none;" : "background-color: transparent; color: var(--sg-primary); border: 1px solid var(--sg-primary);";
+  return `<div ${$(t.id)} data-block-group="Conteúdo" style="background-color: var(--sg-bg); border-radius: 0.75rem; padding: 2rem; box-shadow: ${d ? "var(--sg-shadow-strong)" : "var(--sg-card-shadow)"}; border: ${d ? "2px solid var(--sg-primary)" : "1px solid var(--sg-border)"}; position: relative;">${g}<h3 style="font-size: 1.25rem; font-weight: 600; margin-bottom: 0.5rem;">${e(n)}</h3>${i ? `<p style="color: var(--sg-muted-text); margin-bottom: 1rem;">${e(i)}</p>` : ""}<div style="margin-bottom: 1.5rem;"><span style="font-size: 2.5rem; font-weight: 700;">${e(o)}</span>${r ? `<span style="color: var(--sg-muted-text);">${e(r)}</span>` : ""}</div><ul style="list-style: none; padding: 0; margin-bottom: 1.5rem;">${v}</ul>${s ? `<button style="width: 100%; padding: 0.625rem 1.25rem; ${y} border-radius: var(--sg-button-radius); font-weight: 500; cursor: pointer;">${e(s)}</button>` : ""}</div>`;
 }
-function it(t, p, l, m, n) {
-  const { title: i, subtitle: r, plans: o = [] } = t.props, s = H(t.id || "", "pricing-grid"), a = Math.min(o.length, 4), d = C({ lg: a }, 1, 2, a), { inlineStyles: v, mediaQueries: g } = B(s, d, "2rem", "align-items: start;"), y = i || r ? `<div style="text-align: center; margin-bottom: 3rem;">${i ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(i)}</h2>` : ""}${r ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(r)}</p>` : ""}</div>` : "";
+function ot(t, p, l, m, n) {
+  const { title: o, subtitle: r, plans: i = [] } = t.props, a = C(t.id || "", "pricing-grid"), s = Math.min(i.length, 4), d = k({ lg: s }, 1, 2, s), { inlineStyles: u, mediaQueries: g } = S(a, d, "2rem", "align-items: start;"), v = o || r ? `<div data-block-group="Conteúdo" style="text-align: center; margin-bottom: 3rem;">${o ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(o)}</h2>` : ""}${r ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(r)}</p>` : ""}</div>` : "";
   if (!n)
     throw new Error("exportPricing requires renderChild function");
-  const u = o.map(
+  const y = i.map(
     (f) => n(
       { id: `${t.id}-plan`, type: "pricingCard", props: f },
       p + 1,
@@ -120,29 +120,29 @@ function it(t, p, l, m, n) {
       m
     )
   ).join("");
-  return `<style>${g}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-bg);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem;">${y}<div id="${s}" style="${v}">${u}</div></div></section>`;
+  return `<style>${g}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-bg);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem;">${v}<div id="${a}" style="${u}">${y}</div></div></section>`;
 }
-function ot(t, p, l, m) {
+function it(t, p, l, m) {
   const {
     quote: n,
-    authorName: i,
+    authorName: o,
     authorRole: r,
-    authorCompany: o,
-    authorAvatar: s,
-    rating: a
-  } = t.props, d = a ? `<div style="margin-bottom: 1rem; color: #fbbf24;">${"★".repeat(a)}</div>` : "", v = s ? `<img src="${e(s)}" alt="${e(i)}" style="width: 3rem; height: 3rem; border-radius: 50%; object-fit: cover;" />` : `<div style="width: 3rem; height: 3rem; border-radius: 50%; background-color: var(--sg-primary); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 600;">${i ? i.split(" ").map((g) => g[0]).join("").toUpperCase().slice(0, 2) : "?"}</div>`;
-  return `<div ${$(t.id)} style="background-color: var(--sg-surface); border-radius: var(--sg-card-radius); padding: 2rem;">${d}<blockquote style="font-size: 1rem; margin-bottom: 1.5rem; font-style: italic;">"${e(n)}"</blockquote><div style="display: flex; align-items: center; gap: 1rem;">${v}<div><div style="font-weight: 600;">${e(i)}</div>${r || o ? `<div style="color: var(--sg-muted-text); font-size: 0.875rem;">${e(r || "")}${r && o ? ", " : ""}${e(o || "")}</div>` : ""}</div></div></div>`;
+    authorCompany: i,
+    authorAvatar: a,
+    rating: s
+  } = t.props, d = s ? `<div data-block-group="Estilo" style="margin-bottom: 1rem; color: #fbbf24;">${"★".repeat(s)}</div>` : "", u = a ? `<img src="${e(a)}" alt="${e(o)}" style="width: 3rem; height: 3rem; border-radius: 50%; object-fit: cover;" />` : `<div style="width: 3rem; height: 3rem; border-radius: 50%; background-color: var(--sg-primary); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 600;">${o ? o.split(" ").map((g) => g[0]).join("").toUpperCase().slice(0, 2) : "?"}</div>`;
+  return `<div ${$(t.id)} style="background-color: var(--sg-surface); border-radius: var(--sg-card-radius); padding: 2rem;">${d}<blockquote data-block-group="Conteúdo" style="font-size: 1rem; margin-bottom: 1.5rem; font-style: italic;">"${e(n)}"</blockquote><div data-block-group="Autor" style="display: flex; align-items: center; gap: 1rem;">${u}<div><div style="font-weight: 600;">${e(o)}</div>${r || i ? `<div style="color: var(--sg-muted-text); font-size: 0.875rem;">${e(r || "")}${r && i ? ", " : ""}${e(i || "")}</div>` : ""}</div></div></div>`;
 }
 function nt(t, p, l, m, n) {
   const {
-    title: i,
+    title: o,
     subtitle: r,
-    columns: o = 3,
-    testimonials: s = []
-  } = t.props, a = H(t.id || "", "testimonial-grid"), d = C(o, 1, 2, o), { inlineStyles: v, mediaQueries: g } = B(a, d, "2rem"), y = i || r ? `<div style="text-align: center; margin-bottom: 3rem;">${i ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(i)}</h2>` : ""}${r ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(r)}</p>` : ""}</div>` : "";
+    columns: i = 3,
+    testimonials: a = []
+  } = t.props, s = C(t.id || "", "testimonial-grid"), d = k(i, 1, 2, i), { inlineStyles: u, mediaQueries: g } = S(s, d, "2rem"), v = o || r ? `<div data-block-group="Conteúdo" style="text-align: center; margin-bottom: 3rem;">${o ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(o)}</h2>` : ""}${r ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(r)}</p>` : ""}</div>` : "";
   if (!n)
     throw new Error("exportTestimonialGrid requires renderChild function");
-  const u = s.map(
+  const y = a.map(
     (f) => n(
       { id: `${t.id}-t`, type: "testimonial", props: f },
       p + 1,
@@ -150,17 +150,17 @@ function nt(t, p, l, m, n) {
       m
     )
   ).join("");
-  return `<style>${g}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-bg);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem;">${y}<div id="${a}" style="${v}">${u}</div></div></section>`;
+  return `<style>${g}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-bg);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem;">${v}<div data-block-group="Layout" id="${s}" style="${u}">${y}</div></div></section>`;
 }
-function st(t, p, l, m) {
-  const { question: n, answer: i } = t.props;
-  return `<details ${$(t.id)} style="border-bottom: 1px solid var(--sg-border); padding: 1rem 0;"><summary style="font-weight: 600; cursor: pointer; display: flex; justify-content: space-between; align-items: center;">${e(n)}<span>+</span></summary><p style="margin-top: 1rem; color: var(--sg-muted-text);">${e(i)}</p></details>`;
+function at(t, p, l, m) {
+  const { question: n, answer: o } = t.props;
+  return `<details ${$(t.id)} data-block-group="Conteúdo" style="border-bottom: 1px solid var(--sg-border); padding: 1rem 0;"><summary style="font-weight: 600; cursor: pointer; display: flex; justify-content: space-between; align-items: center;">${e(n)}<span>+</span></summary><p style="margin-top: 1rem; color: var(--sg-muted-text);">${e(o)}</p></details>`;
 }
-function at(t, p, l, m, n) {
-  const { title: i, subtitle: r, items: o = [] } = t.props, s = i || r ? `<div style="text-align: center; margin-bottom: 3rem;">${i ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(i)}</h2>` : ""}${r ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(r)}</p>` : ""}</div>` : "";
+function st(t, p, l, m, n) {
+  const { title: o, subtitle: r, items: i = [] } = t.props, a = o || r ? `<div data-block-group="Conteúdo" style="text-align: center; margin-bottom: 3rem;">${o ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(o)}</h2>` : ""}${r ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(r)}</p>` : ""}</div>` : "";
   if (!n)
     throw new Error("exportFaq requires renderChild function");
-  const a = o.map(
+  const s = i.map(
     (d) => n(
       { id: `${t.id}-faq`, type: "faqItem", props: d },
       p + 1,
@@ -168,51 +168,51 @@ function at(t, p, l, m, n) {
       m
     )
   ).join("");
-  return `<section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-bg);"><div style="max-width: 800px; margin: 0 auto; padding: 0 1rem;">${s}<div>${a}</div></div></section>`;
+  return `<section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-bg);"><div style="max-width: 800px; margin: 0 auto; padding: 0 1rem;">${a}<div>${s}</div></div></section>`;
 }
 function dt(t, p, l, m) {
-  const { title: n, subtitle: i, items: r = [] } = t.props, o = H(t.id || "", "stats-grid"), s = C({ lg: r.length }, 1, 2, r.length), { inlineStyles: a, mediaQueries: d } = B(o, s, "2rem", "text-align: center;"), v = n || i ? `<div style="text-align: center; margin-bottom: 3rem;">${n ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(n)}</h2>` : ""}${i ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(i)}</p>` : ""}</div>` : "", g = r.map(
-    (y) => `<div style="text-align: center;"><div style="font-size: 3rem; font-weight: 700; color: var(--sg-primary);">${e(y.prefix || "")}${e(y.value)}${e(y.suffix || "")}</div><div style="color: var(--sg-muted-text);">${e(y.label)}</div></div>`
+  const { title: n, subtitle: o, items: r = [] } = t.props, i = C(t.id || "", "stats-grid"), a = k({ lg: r.length }, 1, 2, r.length), { inlineStyles: s, mediaQueries: d } = S(i, a, "2rem", "text-align: center;"), u = n || o ? `<div style="text-align: center; margin-bottom: 3rem;">${n ? `<h2 style="font-size: var(--sg-heading-h2); margin-bottom: 0.5rem;">${e(n)}</h2>` : ""}${o ? `<p style="color: var(--sg-muted-text); font-size: 1.125rem;">${e(o)}</p>` : ""}</div>` : "", g = r.map(
+    (v) => `<div style="text-align: center;"><div style="font-size: 3rem; font-weight: 700; color: var(--sg-primary);">${e(v.prefix || "")}${e(v.value)}${e(v.suffix || "")}</div><div style="color: var(--sg-muted-text);">${e(v.label)}</div></div>`
   ).join("");
-  return `<style>${d}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-surface);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem;">${v}<div id="${o}" style="${a}">${g}</div></div></section>`;
+  return `<style>${d}</style><section ${w(t.id)} ${$(t.id)} style="padding: 4rem 0; background-color: var(--sg-surface);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem;">${u}<div id="${i}" style="${s}">${g}</div></div></section>`;
 }
 function lt(t, p, l, m) {
-  const { value: n, label: i, prefix: r, suffix: o } = t.props;
-  return `<div ${$(t.id)} style="text-align: center;"><div style="font-size: 2.5rem; font-weight: 700; color: var(--sg-primary);">${e(r || "")}${e(n)}${e(o || "")}</div><div style="color: var(--sg-muted-text);">${e(i)}</div></div>`;
+  const { value: n, label: o, prefix: r, suffix: i } = t.props;
+  return `<div ${$(t.id)} style="text-align: center;"><div style="font-size: 2.5rem; font-weight: 700; color: var(--sg-primary);">${e(r || "")}${e(n)}${e(i || "")}</div><div style="color: var(--sg-muted-text);">${e(o)}</div></div>`;
 }
 function mt(t, p, l, m) {
-  const { title: n, logos: i = [], grayscale: r } = t.props, o = n ? `<p style="color: var(--sg-muted-text); margin-bottom: 2rem;">${e(n)}</p>` : "", s = i.map(
-    (a) => `<img src="${e(a.src)}" alt="${e(a.alt)}" style="height: 2rem; object-fit: contain; ${r ? "filter: grayscale(100%); opacity: 0.6;" : ""}" />`
+  const { title: n, logos: o = [], grayscale: r } = t.props, i = n ? `<p style="color: var(--sg-muted-text); margin-bottom: 2rem;">${e(n)}</p>` : "", a = o.map(
+    (s) => `<img src="${e(s.src)}" alt="${e(s.alt)}" style="height: 2rem; object-fit: contain; ${r ? "filter: grayscale(100%); opacity: 0.6;" : ""}" />`
   ).join("");
-  return `<section ${w(t.id)} ${$(t.id)} style="padding: 2rem 0; background-color: var(--sg-bg);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem; text-align: center;">${o}<div style="display: flex; justify-content: center; align-items: center; gap: 3rem; flex-wrap: wrap;">${s}</div></div></section>`;
+  return `<section ${w(t.id)} ${$(t.id)} style="padding: 2rem 0; background-color: var(--sg-bg);"><div style="max-width: 1200px; margin: 0 auto; padding: 0 1rem; text-align: center;">${i}<div style="display: flex; justify-content: center; align-items: center; gap: 3rem; flex-wrap: wrap;">${a}</div></div></section>`;
 }
 function ct(t, p, l, m) {
   const {
     links: n = [],
-    size: i = "md",
+    size: o = "md",
     variant: r = "default"
-  } = t.props, o = {
+  } = t.props, i = {
     sm: "1.25rem",
     md: "1.5rem",
     lg: "2rem"
-  }, s = o[i] || o.md, a = n.map(
-    (d) => `<a href="${e(d.url)}" target="_blank" rel="noopener noreferrer" style="display: flex; align-items: center; justify-content: center; width: ${r === "filled" ? `calc(${s} + 0.75rem)` : s}; height: ${r === "filled" ? `calc(${s} + 0.75rem)` : s}; background-color: ${r === "filled" ? "var(--sg-surface)" : "transparent"}; border-radius: ${r === "filled" ? "50%" : "0"}; color: var(--sg-muted-text); text-decoration: none;">[${e(d.platform)}]</a>`
+  }, a = i[o] || i.md, s = n.map(
+    (d) => `<a href="${e(d.url)}" target="_blank" rel="noopener noreferrer" style="display: flex; align-items: center; justify-content: center; width: ${r === "filled" ? `calc(${a} + 0.75rem)` : a}; height: ${r === "filled" ? `calc(${a} + 0.75rem)` : a}; background-color: ${r === "filled" ? "var(--sg-surface)" : "transparent"}; border-radius: ${r === "filled" ? "50%" : "0"}; color: var(--sg-muted-text); text-decoration: none;">[${e(d.platform)}]</a>`
   ).join("");
-  return `<div ${$(t.id)} style="display: flex; gap: 1rem; align-items: center;">${a}</div>`;
+  return `<div ${$(t.id)} style="display: flex; gap: 1rem; align-items: center;">${s}</div>`;
 }
 export {
   et as exportCta,
-  at as exportFaq,
-  st as exportFaqItem,
+  st as exportFaq,
+  at as exportFaqItem,
   Z as exportFeature,
   tt as exportFeatureGrid,
   mt as exportLogoCloud,
-  it as exportPricing,
+  ot as exportPricing,
   rt as exportPricingCard,
   ct as exportSocialLinks,
   lt as exportStatItem,
   dt as exportStats,
-  ot as exportTestimonial,
+  it as exportTestimonial,
   nt as exportTestimonialGrid
 };
 //# sourceMappingURL=MarketingExporters.js.map