react-chrono - npm Package Compare versions

Comparing version 2.8.0 to 2.8.1

dist/components/timeline-elements/memoized/subtitle-memo.d.ts

 import React from 'react';
 import { Content } from './memoized-model';
 /**
- * Renders the subtitle content for the timeline card.
+ * Renders the subtitle content for the timeline card using configurable semantic tags.
  * @param {Content} props - Subtitle properties
@@ -6,0 +6,0 @@ * @returns {JSX.Element | null} The rendered subtitle

dist/components/timeline-elements/timeline-card-content/timeline-card-content.styles.d.ts

@@ -33,2 +33,16 @@ import { Theme } from '@models/Theme';
 }>> & string;
+export declare const CardTitleSemantic: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, {
+    $fontSize: string;
+    $padding?: boolean;
+    dir?: string;
+    theme: Theme;
+    as?: string;
+}>> & string;
+export declare const CardSubTitleSemantic: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
+    $fontSize?: string;
+    $padding?: boolean;
+    dir?: string;
+    theme?: Theme;
+    as?: string;
+}>> & string;
 export declare const CardTitleAnchor: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, never>> & string;
@@ -35,0 +49,0 @@ export declare const TimelineContentDetails: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, {

dist/models/TimelineModel.d.ts

@@ -114,3 +114,3 @@ import { Theme } from './Theme';
         align?: 'left' | 'right' | 'center';
-        imageFit?: 'cover' | 'contain' | 'fill' | 'none';
+        fit?: 'cover' | 'contain' | 'fill' | 'none';
     };
@@ -146,2 +146,18 @@ mode?: TimelineMode;
     useReadMore?: boolean;
+    /**
+     * Semantic configuration for card elements.
+     *
+     * This property allows you to specify the semantic HTML tags to be used for
+     * the card title and subtitle. It is useful for improving accessibility and
+     * aligning with the semantic structure of your application.
+     *
+     * @property {('h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span' | 'div')} [cardTitle]
+     *   The HTML tag to use for the card title. Defaults to 'h3' if not specified.
+     * @property {('h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span' | 'div')} [cardSubtitle]
+     *   The HTML tag to use for the card subtitle. Defaults to 'h4' if not specified.
+     */
+    semanticTags?: {
+        cardTitle?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span' | 'div';
+        cardSubtitle?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span' | 'div';
+    };
 };
@@ -148,0 +164,0 @@ export type SlideShowType = 'reveal' | 'slide_in' | 'slide_from_sides';

package.json

 {
   "name": "react-chrono",
-  "version": "2.8.0",
+  "version": "2.8.1",
   "license": "MIT",
@@ -5,0 +5,0 @@ "description": "A Modern Timeline component for React",

No alert changes

Improved metrics

Total package byte prevSize

1064449

0.5%

Lines of code

3510

1.21%

No dependency changes