@opensite/ui 0.5.3 → 0.5.5

package/dist/case-study-stats-metrics.d.cts

@@ -1,5 +1,8 @@
 import * as React from 'react';
+import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
+import { SectionBackground, SectionSpacing } from './types.cjs';
 import { g as BreadcrumbItem, S as StatItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
+import 'react/jsx-runtime';
 import 'class-variance-authority';
 import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
@@ -50,15 +53,15 @@ interface CaseStudyStatsMetricsProps {
      */
     contentSlot?: React.ReactNode;
     /**
-     * Company logo URL
+     * Logo image URL
      */
     companyLogoSrc?: string;
     /**
-     * Company logo alt text
+     * Logo image alt text
      */
     companyLogoAlt?: string;
     /**
-     * Custom slot for company logo (overrides companyLogoSrc)
+     * Custom slot for logo (overrides companyLogoSrc)
      */
     companyLogoSlot?: React.ReactNode;
     /**
@@ -66,23 +69,23 @@ interface CaseStudyStatsMetricsProps {
      */
     overview?: React.ReactNode;
     /**
-     * Sector/industry text
+     * Category text
      */
     sector?: React.ReactNode;
     /**
-     * Solution badge label
+     * Badge label
      */
     solutionLabel?: React.ReactNode;
     /**
-     * Solution badge icon name
+     * Badge icon name
      */
     solutionIcon?: string;
     /**
-     * Solution badge href
+     * Badge href
      */
     solutionHref?: string;
     /**
-     * Custom slot for solution badge (overrides solution props)
+     * Custom slot for badge (overrides solution props)
      */
     solutionSlot?: React.ReactNode;
     /**
@@ -101,6 +104,22 @@ interface CaseStudyStatsMetricsProps {
      * Custom slot for entire sidebar (overrides all sidebar props)
      */
     sidebarSlot?: React.ReactNode;
+    /**
+     * Background style for the section
+     */
+    background?: SectionBackground;
+    /**
+     * Vertical spacing for the section
+     */
+    spacing?: SectionSpacing;
+    /**
+     * Optional background pattern name or URL
+     */
+    pattern?: PatternName | undefined;
+    /**
+     * Pattern overlay opacity (0-1)
+     */
+    patternOpacity?: number;
     /**
      * Additional CSS classes for the section
      */
@@ -163,32 +182,32 @@ interface CaseStudyStatsMetricsProps {
     optixFlowConfig?: OptixFlowConfig;
 }
 /**
- * CaseStudyStatsMetrics displays a case study with prominent performance metrics,
- * breadcrumb navigation, prose content, and a sticky sidebar with company info and CTA.
+ * CaseStudyStatsMetrics displays content with prominent performance metrics,
+ * breadcrumb navigation, prose content, and a sticky sidebar with contextual information and CTA.
  *
  * Features a two-column layout with the main content area showing breadcrumbs, title,
- * subtitle, hero image, a grid of key statistics (4 metrics), and rich prose content
+ * subtitle, hero image, a grid of key statistics, and rich prose content
  * with headings, paragraphs, blockquotes, lists, tables, and alerts. The sticky sidebar
- * displays company logo, overview text, sector information, a solution badge with icon,
+ * displays logo, overview text, category information, a badge with icon,
  * and a call-to-action button.
  *
- * Ideal for results-focused case studies that emphasize quantifiable outcomes,
- * customer success stories with measurable impact, or ROI-driven content marketing.
+ * Ideal for results-focused pages that emphasize quantifiable outcomes,
+ * success stories with measurable impact, or data-driven content.
  *
  * @example
  * ```tsx
  * <CaseStudyStatsMetrics
- *   title="Boosting System Reliability by 125% with AI Monitoring"
+ *   title="Boosting Performance by 125%"
  *   stats={[
- *     { value: "125%", label: "improvement in system reliability" },
- *     { value: "40%", label: "reduction in downtime" }
+ *     { value: "125%", label: "improvement in performance" },
+ *     { value: "40%", label: "reduction in issues" }
  *   ]}
- *   companyLogoSrc="/logos/client.svg"
- *   overview="Enterprise software company"
+ *   companyLogoSrc="/logos/logo.svg"
+ *   overview="Leading platform"
  *   sector="Technology"
  * />
  * ```
  */
-declare function CaseStudyStatsMetrics({ breadcrumbs, breadcrumbsSlot, title, subtitle, heroImageSrc, heroImageAlt, heroMediaSlot, stats, statsSlot, content, contentSlot, companyLogoSrc, companyLogoAlt, companyLogoSlot, overview, sector, solutionLabel, solutionIcon, solutionHref, solutionSlot, ctaAction, ctaSlot, ctaLabel, sidebarSlot, className, containerClassName, contentWrapperClassName, layoutClassName, mainClassName, breadcrumbsClassName, titleClassName, subtitleClassName, heroImageClassName, statsClassName, statItemClassName, proseClassName, sidebarClassName, companyLogoClassName, optixFlowConfig, }: CaseStudyStatsMetricsProps): React.JSX.Element;
+declare function CaseStudyStatsMetrics({ breadcrumbs, breadcrumbsSlot, title, subtitle, heroImageSrc, heroImageAlt, heroMediaSlot, stats, statsSlot, content, contentSlot, companyLogoSrc, companyLogoAlt, companyLogoSlot, overview, sector, solutionLabel, solutionIcon, solutionHref, solutionSlot, ctaAction, ctaSlot, ctaLabel, sidebarSlot, background, spacing, pattern, patternOpacity, className, containerClassName, contentWrapperClassName, layoutClassName, mainClassName, breadcrumbsClassName, titleClassName, subtitleClassName, heroImageClassName, statsClassName, statItemClassName, proseClassName, sidebarClassName, companyLogoClassName, optixFlowConfig, }: CaseStudyStatsMetricsProps): React.JSX.Element;
 
 export { CaseStudyStatsMetrics, type CaseStudyStatsMetricsProps };

package/dist/case-study-stats-metrics.d.ts

@@ -1,5 +1,8 @@
 import * as React from 'react';
+import { P as PatternName } from './pattern-background-a7gKHzHy.js';
+import { SectionBackground, SectionSpacing } from './types.js';
 import { g as BreadcrumbItem, S as StatItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-k17uluAz.js';
+import 'react/jsx-runtime';
 import 'class-variance-authority';
 import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
@@ -50,15 +53,15 @@ interface CaseStudyStatsMetricsProps {
      */
     contentSlot?: React.ReactNode;
     /**
-     * Company logo URL
+     * Logo image URL
      */
     companyLogoSrc?: string;
     /**
-     * Company logo alt text
+     * Logo image alt text
      */
     companyLogoAlt?: string;
     /**
-     * Custom slot for company logo (overrides companyLogoSrc)
+     * Custom slot for logo (overrides companyLogoSrc)
      */
     companyLogoSlot?: React.ReactNode;
     /**
@@ -66,23 +69,23 @@ interface CaseStudyStatsMetricsProps {
      */
     overview?: React.ReactNode;
     /**
-     * Sector/industry text
+     * Category text
      */
     sector?: React.ReactNode;
     /**
-     * Solution badge label
+     * Badge label
      */
     solutionLabel?: React.ReactNode;
     /**
-     * Solution badge icon name
+     * Badge icon name
      */
     solutionIcon?: string;
     /**
-     * Solution badge href
+     * Badge href
      */
     solutionHref?: string;
     /**
-     * Custom slot for solution badge (overrides solution props)
+     * Custom slot for badge (overrides solution props)
      */
     solutionSlot?: React.ReactNode;
     /**
@@ -101,6 +104,22 @@ interface CaseStudyStatsMetricsProps {
      * Custom slot for entire sidebar (overrides all sidebar props)
      */
     sidebarSlot?: React.ReactNode;
+    /**
+     * Background style for the section
+     */
+    background?: SectionBackground;
+    /**
+     * Vertical spacing for the section
+     */
+    spacing?: SectionSpacing;
+    /**
+     * Optional background pattern name or URL
+     */
+    pattern?: PatternName | undefined;
+    /**
+     * Pattern overlay opacity (0-1)
+     */
+    patternOpacity?: number;
     /**
      * Additional CSS classes for the section
      */
@@ -163,32 +182,32 @@ interface CaseStudyStatsMetricsProps {
     optixFlowConfig?: OptixFlowConfig;
 }
 /**
- * CaseStudyStatsMetrics displays a case study with prominent performance metrics,
- * breadcrumb navigation, prose content, and a sticky sidebar with company info and CTA.
+ * CaseStudyStatsMetrics displays content with prominent performance metrics,
+ * breadcrumb navigation, prose content, and a sticky sidebar with contextual information and CTA.
  *
  * Features a two-column layout with the main content area showing breadcrumbs, title,
- * subtitle, hero image, a grid of key statistics (4 metrics), and rich prose content
+ * subtitle, hero image, a grid of key statistics, and rich prose content
  * with headings, paragraphs, blockquotes, lists, tables, and alerts. The sticky sidebar
- * displays company logo, overview text, sector information, a solution badge with icon,
+ * displays logo, overview text, category information, a badge with icon,
  * and a call-to-action button.
  *
- * Ideal for results-focused case studies that emphasize quantifiable outcomes,
- * customer success stories with measurable impact, or ROI-driven content marketing.
+ * Ideal for results-focused pages that emphasize quantifiable outcomes,
+ * success stories with measurable impact, or data-driven content.
  *
  * @example
  * ```tsx
  * <CaseStudyStatsMetrics
- *   title="Boosting System Reliability by 125% with AI Monitoring"
+ *   title="Boosting Performance by 125%"
  *   stats={[
- *     { value: "125%", label: "improvement in system reliability" },
- *     { value: "40%", label: "reduction in downtime" }
+ *     { value: "125%", label: "improvement in performance" },
+ *     { value: "40%", label: "reduction in issues" }
  *   ]}
- *   companyLogoSrc="/logos/client.svg"
- *   overview="Enterprise software company"
+ *   companyLogoSrc="/logos/logo.svg"
+ *   overview="Leading platform"
  *   sector="Technology"
  * />
  * ```
  */
-declare function CaseStudyStatsMetrics({ breadcrumbs, breadcrumbsSlot, title, subtitle, heroImageSrc, heroImageAlt, heroMediaSlot, stats, statsSlot, content, contentSlot, companyLogoSrc, companyLogoAlt, companyLogoSlot, overview, sector, solutionLabel, solutionIcon, solutionHref, solutionSlot, ctaAction, ctaSlot, ctaLabel, sidebarSlot, className, containerClassName, contentWrapperClassName, layoutClassName, mainClassName, breadcrumbsClassName, titleClassName, subtitleClassName, heroImageClassName, statsClassName, statItemClassName, proseClassName, sidebarClassName, companyLogoClassName, optixFlowConfig, }: CaseStudyStatsMetricsProps): React.JSX.Element;
+declare function CaseStudyStatsMetrics({ breadcrumbs, breadcrumbsSlot, title, subtitle, heroImageSrc, heroImageAlt, heroMediaSlot, stats, statsSlot, content, contentSlot, companyLogoSrc, companyLogoAlt, companyLogoSlot, overview, sector, solutionLabel, solutionIcon, solutionHref, solutionSlot, ctaAction, ctaSlot, ctaLabel, sidebarSlot, background, spacing, pattern, patternOpacity, className, containerClassName, contentWrapperClassName, layoutClassName, mainClassName, breadcrumbsClassName, titleClassName, subtitleClassName, heroImageClassName, statsClassName, statItemClassName, proseClassName, sidebarClassName, companyLogoClassName, optixFlowConfig, }: CaseStudyStatsMetricsProps): React.JSX.Element;
 
 export { CaseStudyStatsMetrics, type CaseStudyStatsMetricsProps };