@almadar/ui 5.111.0 → 5.113.0

package/dist/components/marketing/atoms/AnimatedGraphic.d.ts

@@ -1,32 +0,0 @@
-import React from 'react';
-import type { AssetUrl } from '@almadar/core';
-export type GraphicAnimation = 'draw' | 'fill' | 'pulse' | 'morph';
-export interface AnimatedGraphicProps extends React.HTMLAttributes<HTMLDivElement> {
-    /** Additional CSS classes applied to the root element. */
-    className?: string;
-    /** URL to an SVG file. Fetched and inlined to enable stroke/fill animations. */
-    src?: AssetUrl;
-    /** Inline SVG string. Takes precedence over src if both provided. */
-    svgContent?: string;
-    /** Animation type applied to SVG paths/shapes */
-    animation?: GraphicAnimation;
-    /** Whether to run the animation (default: false). Controlled externally or via AnimatedReveal. */
-    animate?: boolean;
-    /** Animation duration in ms (default: 1200) */
-    duration?: number;
-    /** Delay before animation starts in ms (default: 0) */
-    delay?: number;
-    /** Easing function (default: cubic-bezier(0.16, 1, 0.3, 1)) */
-    easing?: string;
-    /** Width of the graphic container */
-    width?: string | number;
-    /** Height of the graphic container */
-    height?: string | number;
-    /** Stroke color override for SVG paths */
-    strokeColor?: string;
-    /** Fill color for the 'fill' animation end state */
-    fillColor?: string;
-    /** Alt text for accessibility */
-    alt?: string;
-}
-export declare const AnimatedGraphic: React.ForwardRefExoticComponent<AnimatedGraphicProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/marketing/atoms/AnimatedReveal.d.ts

@@ -1,26 +0,0 @@
-import React from 'react';
-export type RevealTrigger = 'scroll' | 'hover' | 'manual';
-export type RevealAnimation = 'fade-up' | 'fade-down' | 'fade-in' | 'fade-left' | 'fade-right' | 'scale' | 'scale-up' | 'none';
-export interface AnimatedRevealProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {
-    /** Additional CSS classes applied to the root element. */
-    className?: string;
-    /** What triggers the animation */
-    trigger?: RevealTrigger;
-    /** Built-in animation preset */
-    animation?: RevealAnimation;
-    /** Animation duration in ms (default: 600) */
-    duration?: number;
-    /** Delay before animation starts in ms (default: 0) */
-    delay?: number;
-    /** How much of the element must be visible before triggering, 0-1 (default: 0.15) */
-    threshold?: number;
-    /** Animate only the first time the element enters the viewport (default: true) */
-    once?: boolean;
-    /** Manual control: when trigger='manual', set this to true to animate */
-    animate?: boolean;
-    /** Easing function (default: cubic-bezier(0.16, 1, 0.3, 1)) */
-    easing?: string;
-    /** Children: ReactNode or render function receiving animated state */
-    children: React.ReactNode | ((animated: boolean) => React.ReactNode);
-}
-export declare const AnimatedReveal: React.ForwardRefExoticComponent<AnimatedRevealProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/marketing/atoms/ContentSection.d.ts

@@ -1,16 +0,0 @@
-import React from "react";
-export type ContentSectionBackground = "default" | "alt" | "dark" | "gradient";
-export type ContentSectionPadding = "sm" | "md" | "lg";
-export interface ContentSectionProps {
-    /** Section content */
-    children: React.ReactNode;
-    /** Background style */
-    background?: ContentSectionBackground;
-    /** Vertical padding size */
-    padding?: ContentSectionPadding;
-    /** HTML id for anchor linking */
-    id?: string;
-    /** Additional class names */
-    className?: string;
-}
-export declare const ContentSection: React.ForwardRefExoticComponent<ContentSectionProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/marketing/atoms/MarketingStatCard.d.ts

@@ -1,13 +0,0 @@
-import React from "react";
-export type StatCardSize = "sm" | "md" | "lg";
-export interface MarketingStatCardProps {
-    /** The stat value to display prominently */
-    value: string;
-    /** Label describing the value */
-    label: string;
-    /** Size of the value text */
-    size?: StatCardSize;
-    /** Additional class names */
-    className?: string;
-}
-export declare const MarketingStatCard: React.FC<MarketingStatCardProps>;

package/dist/components/marketing/atoms/PatternTile.d.ts

@@ -1,41 +0,0 @@
-/**
- * PatternTile Atom
- *
- * Mathematically correct Islamic geometric pattern tiles using the
- * Polygons-in-Contact (PIC) method (Hankin 1925, formalized by Kaplan 2005).
- *
- * Construction: A regular polygon tiling is overlaid with star motifs.
- * Each motif touches the enclosing polygon at EDGE MIDPOINTS only.
- * Two rays emanate from each midpoint into the polygon at a specific
- * CONTACT ANGLE (theta). Where rays from adjacent midpoints intersect,
- * they form the star points. Gap tiles (squares, triangles) between
- * polygons receive inferred geometry by extending boundary rays inward.
- *
- * Variants:
- *   star8  — 8-fold star-and-cross on 4.8.8 tiling (theta = 67.5 deg)
- *   star6  — 6-fold star on hexagonal tiling (theta = 60 deg)
- *   khatam — 8-fold rosette with interlocking kites (theta = 72 deg)
- *   star10 — 10-fold girih on decagonal tiling (theta = 72 deg)
- *   star12 — 12-fold on dodecagonal tiling (theta = 75 deg)
- *
- * All tiles use stroke only (no fill), rendering as transparent overlays.
- */
-import React from 'react';
-export type PatternVariant = 'star8' | 'star6' | 'khatam' | 'star10' | 'star12' | 'rosette-double' | 'rosette-filled' | 'seigaiha' | 'greek-key' | 'celtic-knot' | 'kolam' | 'arch' | 'arabesque-vine' | 'arabesque-net';
-export interface PatternTileProps {
-    /** Which geometric pattern to render */
-    variant?: PatternVariant;
-    /** Tile unit size in SVG units */
-    size?: number;
-    /** Stroke color (CSS variable or hex) */
-    color?: string;
-    /** Line thickness */
-    strokeWidth?: number;
-    className?: string;
-}
-export declare const PatternTile: React.FC<PatternTileProps>;
-/** Returns the tile dimensions for a given variant and size */
-export declare function getTileDimensions(variant: PatternVariant, size: number): {
-    width: number;
-    height: number;
-};

package/dist/components/marketing/molecules/ArticleSection.d.ts

@@ -1,18 +0,0 @@
-/**
- * ArticleSection Molecule Component
- *
- * A centered content section with a title and constrained max-width,
- * suitable for article or documentation layouts.
- */
-import React from 'react';
-export interface ArticleSectionProps {
-    /** Section title */
-    title: string;
-    /** Section content */
-    children: React.ReactNode;
-    /** Maximum width constraint */
-    maxWidth?: 'sm' | 'md' | 'lg';
-    /** Additional class names */
-    className?: string;
-}
-export declare const ArticleSection: React.FC<ArticleSectionProps>;

package/dist/components/marketing/molecules/CTABanner.d.ts

@@ -1,26 +0,0 @@
-/**
- * CTABanner Molecule Component
- *
- * A call-to-action banner with title, subtitle, and action buttons.
- * Uses the site's theme naturally - no forced color inversions.
- */
-import React from 'react';
-import type { LinkAction } from '../../core/atoms/types';
-export type CTABannerBackground = 'default' | 'alt' | 'dark' | 'gradient' | 'primary';
-export interface CTABannerProps {
-    /** Banner headline */
-    title: string;
-    /** Supporting text below the title */
-    subtitle?: string;
-    /** Primary action button config */
-    primaryAction?: LinkAction;
-    /** Secondary action button config */
-    secondaryAction?: LinkAction;
-    /** Background style */
-    background?: CTABannerBackground;
-    /** Content alignment */
-    align?: 'center' | 'left';
-    /** Additional class names */
-    className?: string;
-}
-export declare const CTABanner: React.FC<CTABannerProps>;

package/dist/components/marketing/molecules/CaseStudyCard.d.ts

@@ -1,24 +0,0 @@
-/**
- * CaseStudyCard Molecule Component
- *
- * A card for displaying case studies with category badge, title,
- * description, and a call-to-action link button.
- */
-import React from 'react';
-export interface CaseStudyCardProps {
-    /** Case study title */
-    title: string;
-    /** Short description of the case study */
-    description: string;
-    /** Category label shown as a badge */
-    category: string;
-    /** Custom background color for the category badge (CSS value) */
-    categoryColor?: string;
-    /** URL the card links to */
-    href: string;
-    /** Label for the link button */
-    linkLabel?: string;
-    /** Additional class names */
-    className?: string;
-}
-export declare const CaseStudyCard: React.FC<CaseStudyCardProps>;

package/dist/components/marketing/molecules/CommunityLinks.d.ts

@@ -1,28 +0,0 @@
-/**
- * CommunityLinks Molecule Component
- *
- * Displays community platform links (GitHub, Discord, Twitter) as styled buttons.
- * Composes VStack, HStack, Typography, Button, and Icon atoms.
- */
-import React from 'react';
-export interface GithubLink {
-    url: string;
-    stars?: number;
-}
-export interface DiscordLink {
-    url: string;
-    members?: number;
-}
-export interface TwitterLink {
-    url: string;
-    followers?: number;
-}
-export interface CommunityLinksProps {
-    github?: GithubLink;
-    discord?: DiscordLink;
-    twitter?: TwitterLink;
-    heading?: string;
-    subtitle?: string;
-    className?: string;
-}
-export declare const CommunityLinks: React.FC<CommunityLinksProps>;

package/dist/components/marketing/molecules/FeatureCard.d.ts

@@ -1,26 +0,0 @@
-/**
- * FeatureCard Molecule Component
- *
- * A card highlighting a feature with icon, title, description, and optional link.
- * Composes Card, VStack, Icon, Typography, and Button atoms.
- */
-import React from 'react';
-import { type IconInput } from '../../core/atoms/Icon';
-export interface FeatureCardProps {
-    icon?: IconInput;
-    /** Feature title */
-    title: string;
-    /** Feature description */
-    description: string;
-    /** Optional link URL */
-    href?: string;
-    /** Label for the link button */
-    linkLabel?: string;
-    /** Card visual variant */
-    variant?: 'default' | 'bordered' | 'elevated' | 'interactive';
-    /** Card size affecting icon and spacing */
-    size?: 'sm' | 'md' | 'lg';
-    /** Additional class names */
-    className?: string;
-}
-export declare const FeatureCard: React.FC<FeatureCardProps>;

package/dist/components/marketing/molecules/GeometricPattern.d.ts

@@ -1,33 +0,0 @@
-/**
- * GeometricPattern Molecule
- *
- * Composes PatternTile into reusable layout modes for Islamic geometric
- * background decoration. Supports four modes:
- *
- *   background — full tiling fill behind content
- *   left/right — pattern fades from one side toward the other
- *   frame      — thin decorative strips above and below content
- *
- * Uses SVG <pattern> for efficient tiling and <mask> for fade effects.
- * All rendering is pure SVG (SSR-safe, no browser APIs).
- */
-import React from 'react';
-import type { PatternVariant } from '../atoms/PatternTile';
-export interface GeometricPatternProps {
-    /** Which geometric tile design */
-    variant?: PatternVariant;
-    /** Layout mode */
-    mode?: 'background' | 'left' | 'right' | 'dual' | 'around' | 'frame';
-    /** Overall opacity (default: 0.06) */
-    opacity?: number;
-    /** Stroke color passed to PatternTile */
-    color?: string;
-    /** Tile scale multiplier (default: 1) */
-    scale?: number;
-    /** Stroke width passed to PatternTile */
-    strokeWidth?: number;
-    /** Content to wrap (used in frame mode) */
-    children?: React.ReactNode;
-    className?: string;
-}
-export declare const GeometricPattern: React.FC<GeometricPatternProps>;

package/dist/components/marketing/molecules/HeroSection.d.ts

@@ -1,28 +0,0 @@
-/**
- * HeroSection Molecule Component
- *
- * A full-width hero section for landing pages and marketing content.
- * Composes atoms: Box, VStack, HStack, Badge, Typography, Button.
- * Optionally includes an InstallBox molecule for CLI commands.
- */
-import React from 'react';
-import type { LinkAction, ImageSource } from '../../core/atoms/types';
-export interface HeroSectionProps {
-    tag?: string;
-    tagVariant?: 'primary' | 'secondary' | 'accent';
-    title: string;
-    titleAccent?: string;
-    subtitle: string;
-    primaryAction?: LinkAction;
-    secondaryAction?: LinkAction;
-    installCommand?: string;
-    image?: ImageSource;
-    imagePosition?: 'below' | 'right' | 'background';
-    background?: 'dark' | 'gradient' | 'subtle';
-    align?: 'center' | 'left';
-    /** Background element (SVG animation, etc.) rendered behind hero content */
-    backgroundElement?: React.ReactNode;
-    children?: React.ReactNode;
-    className?: string;
-}
-export declare const HeroSection: React.FC<HeroSectionProps>;

package/dist/components/marketing/molecules/InstallBox.d.ts

@@ -1,16 +0,0 @@
-/**
- * InstallBox Molecule Component
- *
- * A copyable command display box for install/CLI commands.
- * Shows a monospace command with a copy-to-clipboard button.
- */
-import React from 'react';
-export interface InstallBoxProps {
-    /** The command to display and copy */
-    command: string;
-    /** Optional label above the command */
-    label?: string;
-    /** Additional class names */
-    className?: string;
-}
-export declare const InstallBox: React.FC<InstallBoxProps>;

package/dist/components/marketing/molecules/MarketingFooter.d.ts

@@ -1,29 +0,0 @@
-/**
- * MarketingFooter Molecule Component
- *
- * A themed footer for marketing/documentation sites.
- * Displays link columns, optional logo, and copyright text.
- * Uses @almadar/ui theme CSS variables for consistent branding.
- */
-import React from 'react';
-import type { AssetUrl } from '@almadar/core';
-export interface FooterLinkItem {
-    label: string;
-    href: string;
-}
-export interface FooterLinkColumn {
-    title: string;
-    items: FooterLinkItem[];
-}
-export interface FooterLogo {
-    src: AssetUrl;
-    alt: string;
-    href?: string;
-}
-export interface MarketingFooterProps {
-    columns: FooterLinkColumn[];
-    copyright?: string;
-    logo?: FooterLogo;
-    className?: string;
-}
-export declare const MarketingFooter: React.FC<MarketingFooterProps>;

package/dist/components/marketing/molecules/PricingCard.d.ts

@@ -1,19 +0,0 @@
-/**
- * PricingCard Molecule Component
- *
- * A pricing tier card showing plan name, price, features, and CTA button.
- * Composes atoms: Card, VStack, HStack, Badge, Typography, Icon, Divider, Spacer, Button.
- */
-import React from 'react';
-import type { LinkAction } from '../../core/atoms/types';
-export interface PricingCardProps {
-    name: string;
-    price: string;
-    description?: string;
-    features: string[];
-    action: LinkAction;
-    highlighted?: boolean;
-    badge?: string;
-    className?: string;
-}
-export declare const PricingCard: React.FC<PricingCardProps>;

package/dist/components/marketing/molecules/PricingGrid.d.ts

@@ -1,13 +0,0 @@
-/**
- * PricingGrid Molecule Component
- *
- * A responsive grid of PricingCard molecules.
- * Composes: SimpleGrid + PricingCard.
- */
-import React from 'react';
-import { type PricingCardProps } from './PricingCard';
-export interface PricingGridProps {
-    plans: PricingCardProps[];
-    className?: string;
-}
-export declare const PricingGrid: React.FC<PricingGridProps>;

package/dist/components/marketing/molecules/PullQuote.d.ts

@@ -1,14 +0,0 @@
-/**
- * PullQuote Molecule Component
- *
- * Large italic text with a thick left border in primary color.
- * Breaks up prose walls on long-form pages like Vision and case studies.
- */
-import React from 'react';
-export interface PullQuoteProps {
-    /** The quote text */
-    children: string;
-    /** Additional class names */
-    className?: string;
-}
-export declare const PullQuote: React.FC<PullQuoteProps>;

package/dist/components/marketing/molecules/ServiceCatalog.d.ts

@@ -1,19 +0,0 @@
-/**
- * ServiceCatalog Molecule Component
- *
- * Displays a grid of services organized by layer, each shown as a card
- * with a layer badge and service name.
- */
-import React from 'react';
-export interface ServiceCatalogItem {
-    name: string;
-    layer: string;
-    layerColor?: string;
-}
-export interface ServiceCatalogProps {
-    /** List of services to display */
-    services: ServiceCatalogItem[];
-    /** Additional class names */
-    className?: string;
-}
-export declare const ServiceCatalog: React.FC<ServiceCatalogProps>;

package/dist/components/marketing/molecules/ShowcaseCard.d.ts

@@ -1,18 +0,0 @@
-/**
- * ShowcaseCard Molecule Component
- *
- * A card for showcasing projects, demos, or portfolio items with an image, badge, and description.
- * Composes Card, Box, VStack, Badge, and Typography atoms.
- */
-import React from 'react';
-import type { ImageSource } from '../../core/atoms/types';
-export interface ShowcaseCardProps {
-    title: string;
-    description?: string;
-    image: ImageSource;
-    href?: string;
-    badge?: string;
-    accentColor?: string;
-    className?: string;
-}
-export declare const ShowcaseCard: React.FC<ShowcaseCardProps>;

package/dist/components/marketing/molecules/SplitSection.d.ts

@@ -1,19 +0,0 @@
-/**
- * SplitSection Molecule Component
- *
- * A two-column content section with text on one side and an image (or custom content) on the other.
- * Composes Box, HStack, VStack, Typography, and Icon atoms.
- */
-import React from 'react';
-import type { ImageSource } from '../../core/atoms/types';
-export interface SplitSectionProps {
-    title: string;
-    description: string | React.ReactNode;
-    bullets?: string[];
-    image?: ImageSource;
-    imagePosition?: 'left' | 'right';
-    background?: 'default' | 'alt';
-    children?: React.ReactNode;
-    className?: string;
-}
-export declare const SplitSection: React.FC<SplitSectionProps>;

package/dist/components/marketing/molecules/StatsGrid.d.ts

@@ -1,18 +0,0 @@
-/**
- * StatsGrid Molecule Component
- *
- * A responsive grid of stat items showing value + label pairs.
- * Composes: SimpleGrid + VStack + Typography.
- * Uses StatDisplay internally when available for consistent styling.
- */
-import React from 'react';
-export interface StatItem {
-    value: string;
-    label: string;
-}
-export interface StatsGridProps {
-    stats: StatItem[];
-    columns?: 2 | 3 | 4 | 6;
-    className?: string;
-}
-export declare const StatsGrid: React.FC<StatsGridProps>;

package/dist/components/marketing/molecules/StepFlow.d.ts

@@ -1,21 +0,0 @@
-/**
- * StepFlow Molecule Component
- *
- * A step-by-step progress indicator supporting horizontal and vertical orientations.
- * Composes Center, Typography, Icon, HStack, VStack, Box, and Divider atoms.
- */
-import React from 'react';
-import { type IconInput } from '../../core/atoms/Icon';
-export interface StepItemProps {
-    number?: number;
-    title: string;
-    description: string;
-    icon?: IconInput;
-}
-export interface StepFlowProps {
-    steps: StepItemProps[];
-    orientation?: 'horizontal' | 'vertical';
-    showConnectors?: boolean;
-    className?: string;
-}
-export declare const StepFlow: React.FC<StepFlowProps>;

package/dist/components/marketing/molecules/TagCloud.d.ts

@@ -1,18 +0,0 @@
-/**
- * TagCloud Molecule Component
- *
- * A collection of tags displayed as badges in a wrapping layout.
- * Composes HStack and Badge atoms.
- */
-import React from 'react';
-export interface TagCloudItem {
-    label: string;
-    href?: string;
-    variant?: string;
-}
-export interface TagCloudProps {
-    tags: string[] | TagCloudItem[];
-    variant?: 'default' | 'primary' | 'accent';
-    className?: string;
-}
-export declare const TagCloud: React.FC<TagCloudProps>;

package/dist/components/marketing/molecules/TeamCard.d.ts

@@ -1,19 +0,0 @@
-/**
- * TeamCard Molecule Component
- *
- * A card displaying a team member with avatar, name, role, and bio.
- * Composes Card, VStack, Avatar, and Typography atoms.
- */
-import React from 'react';
-import type { AssetUrl } from '@almadar/core';
-export interface TeamCardProps {
-    name: string;
-    nameAr?: string;
-    role: string;
-    bio: string;
-    avatar?: AssetUrl | {
-        initials: string;
-    };
-    className?: string;
-}
-export declare const TeamCard: React.FC<TeamCardProps>;

package/dist/components/marketing/organisms/CaseStudyOrganism.d.ts

@@ -1,29 +0,0 @@
-/**
- * CaseStudyOrganism
- *
- * Resolves an array of CaseStudyEntity and renders them as a grid of CaseStudyCard molecules.
- * Emits UI:CASE_STUDY_CLICK with { id, href } when a case study card is clicked.
- *
- * Closed Circuit Compliance:
- * - Receives ALL data via entity prop
- * - Emits events via useEventBus
- * - Never listens to events
- */
-import React from 'react';
-import type { EntityWith } from '@almadar/core';
-import type { DisplayStateProps } from '../../core/organisms/types';
-/** The per-case-study entity fields this organism reads (FieldValue-compatible). */
-export interface CaseStudyRow {
-    title: string;
-    description?: string;
-    category?: string;
-    categoryColor?: string;
-    href?: string;
-    linkLabel?: string;
-}
-export interface CaseStudyOrganismProps extends DisplayStateProps {
-    entity?: EntityWith<CaseStudyRow> | readonly EntityWith<CaseStudyRow>[];
-    heading?: string;
-    subtitle?: string;
-}
-export declare const CaseStudyOrganism: React.FC<CaseStudyOrganismProps>;

package/dist/components/marketing/organisms/FeatureGridOrganism.d.ts

@@ -1,30 +0,0 @@
-/**
- * FeatureGridOrganism
- *
- * Resolves an array of FeatureEntity and renders them as a FeatureGrid molecule.
- * Emits UI:FEATURE_CLICK with { id, href } when a feature card is clicked.
- *
- * Closed Circuit Compliance:
- * - Receives ALL data via entity prop
- * - Emits events via useEventBus
- * - Never listens to events
- */
-import React from 'react';
-import type { EntityWith } from '@almadar/core';
-import type { DisplayStateProps } from '../../core/organisms/types';
-/** The per-feature entity fields this organism reads (FieldValue-compatible; the
- *  `icon`/`href` are string names/urls, the molecule widens `icon` to `IconInput`). */
-export interface FeatureRow {
-    title: string;
-    icon?: string;
-    description?: string;
-    href?: string;
-    linkLabel?: string;
-}
-export interface FeatureGridOrganismProps extends DisplayStateProps {
-    entity?: EntityWith<FeatureRow> | readonly EntityWith<FeatureRow>[];
-    columns?: 2 | 3 | 4 | 6;
-    heading?: string;
-    subtitle?: string;
-}
-export declare const FeatureGridOrganism: React.FC<FeatureGridOrganismProps>;