@opensite/ui 0.5.3 → 0.5.5

package/dist/comparison-feature-cards.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 { 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';
@@ -31,11 +34,11 @@ interface ComparisonFeatureCardsProps {
      */
     description?: React.ReactNode;
     /**
-     * First product card configuration
+     * First option card configuration
      */
     productA?: ProductCard;
     /**
-     * Second product card configuration
+     * Second option card configuration
      */
     productB?: ProductCard;
     /**
@@ -90,6 +93,22 @@ interface ComparisonFeatureCardsProps {
      * Additional CSS classes for the differences section
      */
     differencesClassName?: string;
+    /**
+     * 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;
     /**
      * OptixFlow image optimization configuration
      */
@@ -98,15 +117,15 @@ interface ComparisonFeatureCardsProps {
 /**
  * ComparisonFeatureCards - Side-by-side feature comparison cards
  *
- * Displays two product/service cards side by side with feature checklists.
+ * Displays two option cards side by side with feature checklists.
  * The highlighted card uses a bordered, shadowed style while the other uses
  * a muted background. Features show check icons for included items and
  * strikethrough with minus icons for excluded items. Includes optional
  * explanatory text sections below the cards.
  *
- * Best for: Product tier comparisons, subscription plan comparisons,
- * competitor feature analysis, service package breakdowns.
+ * Best for: Tier comparisons, subscription plan comparisons,
+ * feature analysis, package breakdowns.
  */
-declare function ComparisonFeatureCards({ heading, description, productA, productB, cardsSlot, suitabilityTitle, suitabilityDescription, differencesTitle, differencesDescription, className, containerClassName, headingClassName, descriptionClassName, cardsGridClassName, cardClassName, suitabilityClassName, differencesClassName, optixFlowConfig, }: ComparisonFeatureCardsProps): React.JSX.Element;
+declare function ComparisonFeatureCards({ heading, description, productA, productB, cardsSlot, suitabilityTitle, suitabilityDescription, differencesTitle, differencesDescription, className, containerClassName, headingClassName, descriptionClassName, cardsGridClassName, cardClassName, suitabilityClassName, differencesClassName, background, spacing, pattern, patternOpacity, optixFlowConfig, }: ComparisonFeatureCardsProps): React.JSX.Element;
 
 export { ComparisonFeatureCards, type ComparisonFeatureCardsProps };

package/dist/comparison-feature-cards.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 { 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';
@@ -31,11 +34,11 @@ interface ComparisonFeatureCardsProps {
      */
     description?: React.ReactNode;
     /**
-     * First product card configuration
+     * First option card configuration
      */
     productA?: ProductCard;
     /**
-     * Second product card configuration
+     * Second option card configuration
      */
     productB?: ProductCard;
     /**
@@ -90,6 +93,22 @@ interface ComparisonFeatureCardsProps {
      * Additional CSS classes for the differences section
      */
     differencesClassName?: string;
+    /**
+     * 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;
     /**
      * OptixFlow image optimization configuration
      */
@@ -98,15 +117,15 @@ interface ComparisonFeatureCardsProps {
 /**
  * ComparisonFeatureCards - Side-by-side feature comparison cards
  *
- * Displays two product/service cards side by side with feature checklists.
+ * Displays two option cards side by side with feature checklists.
  * The highlighted card uses a bordered, shadowed style while the other uses
  * a muted background. Features show check icons for included items and
  * strikethrough with minus icons for excluded items. Includes optional
  * explanatory text sections below the cards.
  *
- * Best for: Product tier comparisons, subscription plan comparisons,
- * competitor feature analysis, service package breakdowns.
+ * Best for: Tier comparisons, subscription plan comparisons,
+ * feature analysis, package breakdowns.
  */
-declare function ComparisonFeatureCards({ heading, description, productA, productB, cardsSlot, suitabilityTitle, suitabilityDescription, differencesTitle, differencesDescription, className, containerClassName, headingClassName, descriptionClassName, cardsGridClassName, cardClassName, suitabilityClassName, differencesClassName, optixFlowConfig, }: ComparisonFeatureCardsProps): React.JSX.Element;
+declare function ComparisonFeatureCards({ heading, description, productA, productB, cardsSlot, suitabilityTitle, suitabilityDescription, differencesTitle, differencesDescription, className, containerClassName, headingClassName, descriptionClassName, cardsGridClassName, cardClassName, suitabilityClassName, differencesClassName, background, spacing, pattern, patternOpacity, optixFlowConfig, }: ComparisonFeatureCardsProps): React.JSX.Element;
 
 export { ComparisonFeatureCards, type ComparisonFeatureCardsProps };