valtech-components 2.0.712 → 2.0.714

package/lib/components/organisms/bottom-nav/bottom-nav.component.d.ts

@@ -63,7 +63,7 @@ export declare class BottomNavComponent implements OnInit, OnDestroy {
         i18nNamespace?: string;
         hideLabels: boolean;
         safeArea: boolean;
-        animation: "none" | "fade" | "slide" | "scale";
+        animation: "none" | "slide" | "fade" | "scale";
     }>;
     /** Computed tabs with FAB inserted if present */
     displayTabs: import("@angular/core").Signal<BottomNavTab[]>;

package/lib/components/organisms/cards-carousel/cards-carousel.component.d.ts

@@ -1,19 +1,19 @@
-import { CardsCarouselMetadata } from './types';
+import { CardsCarouselMetadata, CarouselCardShape } from './types';
 import * as i0 from "@angular/core";
 /**
  * val-cards-carousel
  *
- * A horizontal carousel of recap cards with optional action header.
- * Combines HorizontalScroll for smooth horizontal scrolling with RecapCard
- * components for consistent card styling.
+ * A horizontal carousel of cards with optional action header.
+ * Combines HorizontalScroll for smooth horizontal scrolling with inline
+ * card rendering for consistent card styling.
  *
  * @example
  * <val-cards-carousel
  *   [props]="{
  *     header: { title: 'Featured Items', actionType: 'link', actionLabel: 'View All' },
  *     cards: [
- *       { title: 'Card 1', description: 'Description', href: '/item/1' },
- *       { title: 'Card 2', description: 'Description', href: '/item/2' }
+ *       { title: { title: 'Card 1' }, link: { text: 'Learn more', url: '/item/1' } },
+ *       { title: { title: 'Card 2' }, link: { text: 'Learn more', url: '/item/2' } }
  *     ]
  *   }"
  * ></val-cards-carousel>
@@ -25,6 +25,12 @@ export declare class CardsCarouselComponent {
      * Carousel configuration with cards and optional header.
      */
     props: CardsCarouselMetadata;
+    /**
+     * Merges shape color with additional styles.
+     */
+    mergeShapeStyle(shape: CarouselCardShape): {
+        [key: string]: string | number;
+    };
     static ɵfac: i0.ɵɵFactoryDeclaration<CardsCarouselComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<CardsCarouselComponent, "val-cards-carousel", never, { "props": { "alias": "props"; "required": false; }; }, {}, never, never, true, never>;
 }

package/lib/components/organisms/cards-carousel/types.d.ts

@@ -1,11 +1,40 @@
 import { ActionHeaderMetadata } from '../../molecules/action-header/types';
-import { RecapCardMetadata } from '../../molecules/recap-card/types';
+import { LinkMetadata } from '../../molecules/link/types';
+import { TitleBlockMetada } from '../../molecules/title-block/types';
+/**
+ * Configuration for a decorative shape within a carousel card.
+ */
+export interface CarouselCardShape {
+    /** Background color of the shape */
+    color: string;
+    /** Additional CSS styles (position, size, etc.) */
+    style?: {
+        [key: string]: string | number;
+    };
+}
+/**
+ * Configuration for a single card inside the carousel.
+ */
+export interface CarouselCardMetadata {
+    /** Title block configuration */
+    title: TitleBlockMetada;
+    /** Link configuration */
+    link: LinkMetadata;
+    /** Decorative shapes to display behind content */
+    shapes?: CarouselCardShape[];
+    /** Background color of the card (Ionic color) */
+    color?: string;
+    /** Minimum height of the card. Default: '400px' */
+    minHeight?: string;
+    /** Width of the card. Default: '280px' */
+    width?: string;
+}
 /**
  * Configuration for the cards carousel component.
  */
 export interface CardsCarouselMetadata {
-    /** Array of recap cards to display */
-    cards: RecapCardMetadata[];
+    /** Array of cards to display */
+    cards: CarouselCardMetadata[];
     /** Optional action header configuration */
     header?: ActionHeaderMetadata;
 }

package/lib/services/content/content-types/blog.d.ts

@@ -0,0 +1,148 @@
+/**
+ * Blog Post Content Type
+ *
+ * Represents a blog post with title, excerpt, cover image,
+ * and structured content blocks.
+ */
+import { ArticleMetadata } from '../../../components/organisms/article/types';
+import { ContentDocument, ContentConfig } from '../types';
+/**
+ * Blog post document interface
+ */
+export interface BlogPost extends ContentDocument<'blog'> {
+    /** Blog post title */
+    title: string;
+    /** Short excerpt/summary for listings */
+    excerpt: string;
+    /** Cover image URL */
+    coverImage?: string;
+    /** Estimated reading time in minutes */
+    readingTime?: number;
+    /** Featured post flag */
+    featured?: boolean;
+}
+/**
+ * BlogPostBuilder provides a fluent API for creating blog posts.
+ *
+ * @example
+ * ```typescript
+ * const post = new BlogPostBuilder()
+ *   .title('My First Post')
+ *   .excerpt('A brief introduction...')
+ *   .author('John Doe', '/avatars/john.jpg')
+ *   .coverImage('/images/post-cover.jpg')
+ *   .heading('Introduction')
+ *   .paragraph('Welcome to my blog...')
+ *   .build();
+ *
+ * // Convert to ArticleMetadata
+ * const article = post.toArticle();
+ * ```
+ */
+export declare class BlogPostBuilder {
+    private post;
+    /**
+     * Sets the blog post title
+     */
+    title(title: string): this;
+    /**
+     * Sets the blog post excerpt
+     */
+    excerpt(excerpt: string): this;
+    /**
+     * Sets the cover image URL
+     */
+    coverImage(url: string): this;
+    /**
+     * Marks the post as featured
+     */
+    featured(value?: boolean): this;
+    /**
+     * Sets the post author
+     */
+    author(name: string, avatar?: string, role?: string): this;
+    /**
+     * Sets the publication date
+     */
+    publishedAt(date: Date | string): this;
+    /**
+     * Sets tags for the post
+     */
+    tags(...tags: string[]): this;
+    /**
+     * Sets the category
+     */
+    category(category: string): this;
+    /**
+     * Sets the slug
+     */
+    slug(slug: string): this;
+    /**
+     * Sets the ID
+     */
+    id(id: string): this;
+    /**
+     * Adds a heading block
+     */
+    heading(text: string, level?: 1 | 2 | 3): this;
+    /**
+     * Adds a paragraph block
+     */
+    paragraph(text: string, emphasis?: boolean): this;
+    /**
+     * Adds a quote block
+     */
+    quote(text: string, author?: string, source?: string): this;
+    /**
+     * Adds a code block
+     */
+    code(code: string, language?: string): this;
+    /**
+     * Adds an unordered list
+     */
+    list(items: string[]): this;
+    /**
+     * Adds an ordered/numbered list
+     */
+    orderedList(items: string[]): this;
+    /**
+     * Adds a checklist
+     */
+    checklist(items: string[]): this;
+    /**
+     * Adds an image block
+     */
+    image(src: string, alt: string, caption?: string): this;
+    /**
+     * Adds a callout/note block
+     */
+    callout(text: string, variant?: 'info' | 'warning' | 'success' | 'error', title?: string): this;
+    /**
+     * Adds a divider
+     */
+    divider(style?: 'line' | 'dots' | 'space'): this;
+    /**
+     * Adds a button/CTA
+     */
+    button(text: string, href?: string, color?: 'primary' | 'secondary' | 'success'): this;
+    /**
+     * Configures rendering options
+     */
+    config(config: Partial<ContentConfig>): this;
+    /**
+     * Builds the final BlogPost object
+     */
+    build(): BlogPost;
+    /**
+     * Builds and converts to ArticleMetadata
+     */
+    toArticle(): ArticleMetadata;
+    /**
+     * Resets the builder for reuse
+     */
+    clear(): this;
+}
+/**
+ * Creates a new BlogPostBuilder instance
+ */
+export declare function blogPost(): BlogPostBuilder;

package/lib/services/content/content-types/documentation.d.ts

@@ -0,0 +1,183 @@
+/**
+ * Documentation Content Type
+ *
+ * Represents technical documentation with navigation,
+ * sections, and structured content blocks.
+ */
+import { ArticleMetadata } from '../../../components/organisms/article/types';
+import { ContentDocument, ContentConfig } from '../types';
+/**
+ * Navigation link for prev/next page navigation
+ */
+export interface DocNavLink {
+    /** Page title */
+    title: string;
+    /** Page slug/URL */
+    slug: string;
+}
+/**
+ * Documentation document interface
+ */
+export interface Documentation extends ContentDocument<'docs'> {
+    /** Documentation page title */
+    title: string;
+    /** Section name (e.g., "Getting Started", "API Reference") */
+    section?: string;
+    /** Version of the documentation */
+    version?: string;
+    /** Previous page navigation */
+    prevPage?: DocNavLink;
+    /** Next page navigation */
+    nextPage?: DocNavLink;
+    /** Table of contents items (auto-generated from headings if not provided) */
+    toc?: {
+        text: string;
+        level: number;
+        id: string;
+    }[];
+}
+/**
+ * DocsBuilder provides a fluent API for creating documentation pages.
+ *
+ * @example
+ * ```typescript
+ * const docs = new DocsBuilder()
+ *   .title('Installation Guide')
+ *   .section('Getting Started')
+ *   .version('1.0.0')
+ *   .heading('Prerequisites', 1)
+ *   .paragraph('Before you begin, ensure you have...')
+ *   .callout('Node.js 18+ is required', 'warning')
+ *   .heading('Installation', 1)
+ *   .code('npm install valtech-components', 'bash')
+ *   .prevPage('Introduction', '/docs/intro')
+ *   .nextPage('Configuration', '/docs/config')
+ *   .build();
+ *
+ * // Convert to ArticleMetadata
+ * const article = docs.toArticle();
+ * ```
+ */
+export declare class DocsBuilder {
+    private doc;
+    /**
+     * Sets the documentation page title
+     */
+    title(title: string): this;
+    /**
+     * Sets the section name
+     */
+    section(section: string): this;
+    /**
+     * Sets the documentation version
+     */
+    version(version: string): this;
+    /**
+     * Sets the previous page navigation
+     */
+    prevPage(title: string, slug: string): this;
+    /**
+     * Sets the next page navigation
+     */
+    nextPage(title: string, slug: string): this;
+    /**
+     * Sets the slug for the page
+     */
+    slug(slug: string): this;
+    /**
+     * Sets the ID for the page
+     */
+    id(id: string): this;
+    /**
+     * Sets tags for the documentation page
+     */
+    tags(...tags: string[]): this;
+    /**
+     * Sets the category
+     */
+    category(category: string): this;
+    /**
+     * Adds a heading block
+     */
+    heading(text: string, level?: 1 | 2 | 3): this;
+    /**
+     * Adds a paragraph block
+     */
+    paragraph(text: string, emphasis?: boolean): this;
+    /**
+     * Adds a code block
+     */
+    code(code: string, language?: string): this;
+    /**
+     * Adds a command/terminal block
+     */
+    command(command: string): this;
+    /**
+     * Adds a callout/note block
+     */
+    callout(text: string, variant?: 'info' | 'warning' | 'success' | 'error', title?: string): this;
+    /**
+     * Adds an info callout (alias for callout with info variant)
+     */
+    info(text: string, title?: string): this;
+    /**
+     * Adds a warning callout
+     */
+    warning(text: string, title?: string): this;
+    /**
+     * Adds an error callout
+     */
+    error(text: string, title?: string): this;
+    /**
+     * Adds a success callout
+     */
+    success(text: string, title?: string): this;
+    /**
+     * Adds an unordered list
+     */
+    list(items: string[]): this;
+    /**
+     * Adds an ordered/numbered list
+     */
+    orderedList(items: string[]): this;
+    /**
+     * Adds a checklist
+     */
+    checklist(items: string[]): this;
+    /**
+     * Adds an image block
+     */
+    image(src: string, alt: string, caption?: string): this;
+    /**
+     * Adds a quote block
+     */
+    quote(text: string, author?: string, source?: string): this;
+    /**
+     * Adds a divider
+     */
+    divider(style?: 'line' | 'dots' | 'space'): this;
+    /**
+     * Adds a button/CTA
+     */
+    button(text: string, href?: string, color?: 'primary' | 'secondary' | 'success'): this;
+    /**
+     * Configures rendering options
+     */
+    config(config: Partial<ContentConfig>): this;
+    /**
+     * Builds the final Documentation object
+     */
+    build(): Documentation;
+    /**
+     * Builds and converts to ArticleMetadata
+     */
+    toArticle(): ArticleMetadata;
+    /**
+     * Resets the builder for reuse
+     */
+    clear(): this;
+}
+/**
+ * Creates a new DocsBuilder instance
+ */
+export declare function docs(): DocsBuilder;

package/lib/services/content/content-types/news.d.ts

@@ -0,0 +1,162 @@
+/**
+ * News Article Content Type
+ *
+ * Represents a news article or announcement with headline,
+ * summary, featured image, and structured content blocks.
+ */
+import { ArticleMetadata } from '../../../components/organisms/article/types';
+import { ContentDocument, ContentConfig } from '../types';
+/**
+ * News article document interface
+ */
+export interface NewsArticle extends ContentDocument<'news'> {
+    /** News headline */
+    headline: string;
+    /** Short summary for listings */
+    summary: string;
+    /** Featured image URL */
+    featuredImage?: string;
+    /** Breaking news flag */
+    breaking?: boolean;
+    /** News source/outlet */
+    source?: string;
+    /** Related articles */
+    relatedArticles?: {
+        title: string;
+        slug: string;
+    }[];
+}
+/**
+ * NewsBuilder provides a fluent API for creating news articles.
+ *
+ * @example
+ * ```typescript
+ * const news = new NewsBuilder()
+ *   .headline('New Product Launch Announced')
+ *   .summary('Company reveals groundbreaking new product...')
+ *   .author('Jane Smith', '/avatars/jane.jpg', 'Technology Reporter')
+ *   .publishedAt(new Date())
+ *   .breaking()
+ *   .featuredImage('/images/product-launch.jpg')
+ *   .paragraph('In a surprise announcement today...')
+ *   .quote('This is our most innovative product yet', 'CEO John Doe')
+ *   .build();
+ *
+ * // Convert to ArticleMetadata
+ * const article = news.toArticle();
+ * ```
+ */
+export declare class NewsBuilder {
+    private article;
+    /**
+     * Sets the news headline
+     */
+    headline(headline: string): this;
+    /**
+     * Sets the news summary
+     */
+    summary(summary: string): this;
+    /**
+     * Sets the featured image URL
+     */
+    featuredImage(url: string): this;
+    /**
+     * Marks the article as breaking news
+     */
+    breaking(value?: boolean): this;
+    /**
+     * Sets the news source/outlet
+     */
+    source(source: string): this;
+    /**
+     * Sets the article author
+     */
+    author(name: string, avatar?: string, role?: string): this;
+    /**
+     * Sets the publication date
+     */
+    publishedAt(date: Date | string): this;
+    /**
+     * Sets tags for the article
+     */
+    tags(...tags: string[]): this;
+    /**
+     * Sets the category
+     */
+    category(category: string): this;
+    /**
+     * Sets the slug
+     */
+    slug(slug: string): this;
+    /**
+     * Sets the ID
+     */
+    id(id: string): this;
+    /**
+     * Adds related articles
+     */
+    relatedArticles(articles: {
+        title: string;
+        slug: string;
+    }[]): this;
+    /**
+     * Adds a heading block
+     */
+    heading(text: string, level?: 1 | 2 | 3): this;
+    /**
+     * Adds a paragraph block
+     */
+    paragraph(text: string, emphasis?: boolean): this;
+    /**
+     * Adds a quote block
+     */
+    quote(text: string, author?: string, source?: string): this;
+    /**
+     * Adds an image block
+     */
+    image(src: string, alt: string, caption?: string): this;
+    /**
+     * Adds an unordered list
+     */
+    list(items: string[]): this;
+    /**
+     * Adds an ordered/numbered list
+     */
+    orderedList(items: string[]): this;
+    /**
+     * Adds a callout/note block
+     */
+    callout(text: string, variant?: 'info' | 'warning' | 'success' | 'error', title?: string): this;
+    /**
+     * Adds a divider
+     */
+    divider(style?: 'line' | 'dots' | 'space'): this;
+    /**
+     * Adds a button/CTA
+     */
+    button(text: string, href?: string, color?: 'primary' | 'secondary' | 'success'): this;
+    /**
+     * Configures rendering options
+     */
+    config(config: Partial<ContentConfig>): this;
+    /**
+     * Builds the final NewsArticle object
+     */
+    build(): NewsArticle;
+    /**
+     * Builds and converts to ArticleMetadata
+     */
+    toArticle(): ArticleMetadata;
+    /**
+     * Gets the estimated reading time in minutes
+     */
+    getReadingTime(): number;
+    /**
+     * Resets the builder for reuse
+     */
+    clear(): this;
+}
+/**
+ * Creates a new NewsBuilder instance
+ */
+export declare function news(): NewsBuilder;

package/lib/services/content/index.d.ts

@@ -0,0 +1,49 @@
+/**
+ * Content Types Module
+ *
+ * Provides a flexible content abstraction layer that transforms
+ * structured content documents into ArticleMetadata for rendering
+ * with the val-article component.
+ *
+ * @example
+ * ```typescript
+ * // Using BlogPostBuilder
+ * import { blogPost } from 'valtech-components';
+ *
+ * const post = blogPost()
+ *   .title('My First Post')
+ *   .author('John Doe')
+ *   .heading('Introduction')
+ *   .paragraph('Welcome to my blog...')
+ *   .toArticle();
+ *
+ * // Using DocsBuilder
+ * import { docs } from 'valtech-components';
+ *
+ * const page = docs()
+ *   .title('Installation')
+ *   .section('Getting Started')
+ *   .code('npm install valtech-components', 'bash')
+ *   .toArticle();
+ *
+ * // Using NewsBuilder
+ * import { news } from 'valtech-components';
+ *
+ * const article = news()
+ *   .headline('Breaking News')
+ *   .summary('Important announcement...')
+ *   .breaking()
+ *   .toArticle();
+ *
+ * // From JSON/API response
+ * import { ContentTransformer, BlogPost } from 'valtech-components';
+ *
+ * const json: BlogPost = await fetch('/api/posts/1').then(r => r.json());
+ * const article = ContentTransformer.toArticle(json);
+ * ```
+ */
+export { ContentAuthor, ContentMeta, ContentConfig, ContentDocument, ContentBlock, HeadingBlock, ParagraphBlock, QuoteBlock, CodeBlock, ListBlock, ImageBlock, CalloutBlock, DividerBlock, ButtonBlock, CommandBlock, } from './types';
+export { ContentTransformer, toArticle } from './transformer';
+export { BlogPost, BlogPostBuilder, blogPost } from './content-types/blog';
+export { Documentation, DocNavLink, DocsBuilder, docs } from './content-types/documentation';
+export { NewsArticle, NewsBuilder, news } from './content-types/news';