@wasto/cms-components 1.5.10

package/dist/index.d.ts

@@ -0,0 +1,465 @@
+import * as react from 'react';
+import react__default, { ReactNode, PropsWithChildren, ComponentType } from 'react';
+import { StyleProp, ViewStyle, TextStyle } from 'react-native';
+import { BottomTabBarProps } from '@react-navigation/bottom-tabs';
+import { WastoRequestErrorContext, WastoClient } from '@wasto/sdk';
+
+type ArticlePropsExcerpts = {
+    displayMode: "excerpts";
+    excerptLength: number;
+};
+
+type ArticlePropsList = {
+    displayMode: "list";
+    itemsPerPage?: number;
+    showPagination?: boolean;
+};
+
+type ArticlePropsSingle = {
+    displayMode: "single";
+    articleId: string;
+};
+
+type ArticleDisplayMode = "single" | "list" | "excerpts";
+type ArticleProps = ArticlePropsSingle | ArticlePropsList | ArticlePropsExcerpts;
+declare function Article(props: ArticleProps): ReactNode;
+
+type ChallengeProps = {};
+declare function Challenge({}: ChallengeProps): ReactNode;
+
+type ChallengeVignetteProps = {};
+declare function ChallengeVignette({}: ChallengeVignetteProps): ReactNode;
+
+type ChatProps = {
+    title?: string;
+    cityId?: string;
+    cityGroupId?: string;
+};
+declare function Chat({ title, cityId, cityGroupId: cityGroupIdProp }: ChatProps): react__default.JSX.Element | null;
+
+type CollectionCalendarProps = {};
+declare function CollectionCalendar({}: CollectionCalendarProps): ReactNode;
+
+type ColumnsColumnCount = 2 | 3;
+type ColumnsProps = PropsWithChildren & {
+    columnCount: ColumnsColumnCount;
+};
+declare function Columns({ columnCount, children }: ColumnsProps): ReactNode;
+
+type ImageMediaProps = {
+    sourceType: "media";
+    mediaId: string;
+    alt?: string;
+    transparentBackground?: boolean;
+    showBorder?: boolean;
+};
+
+type ImageUrlProps = {
+    sourceType: "url";
+    url: string;
+    alt?: string;
+    transparentBackground?: boolean;
+    showBorder?: boolean;
+};
+
+type ImageProps = ImageUrlProps | ImageMediaProps;
+declare function Image(props: ImageProps): ReactNode;
+
+type LocationsMapProps = {
+    fullScreen?: boolean;
+    showFilters?: boolean;
+    /** Header flottant au-dessus de la carte (titre + cloche + profil). */
+    overlayHeader?: boolean;
+    overlayTitle?: string;
+};
+
+/**
+ * Web MapLibre canvas. Native uses `LocationsMap.native.tsx` instead of this file.
+ */
+declare function LocationsMap(props: LocationsMapProps): ReactNode;
+
+type NextCollectionProps = {
+    /** Route / screen name for the calendar CTA. Defaults to trying common tab paths. */
+    calendarHref?: string;
+    /** Show calendar CTA under the slider (home mockup). Default true. */
+    showCalendarCta?: boolean;
+    /**
+     * Initial day offset relative to today (0 = today, 1 = tomorrow, -1 = yesterday).
+     * User can still navigate with prev/next.
+     */
+    dayOffset?: number;
+};
+declare function NextCollection({ calendarHref, showCalendarCta, dayOffset, }: NextCollectionProps): ReactNode;
+
+type PageProps = PropsWithChildren & {
+    /** When false, content fills the screen without scrolling (e.g. fullScreen map). Default true. */
+    scroll?: boolean;
+};
+/**
+ * Page shell: top safe area + optional vertical scroll.
+ * No global horizontal padding — each block uses ContentInset or is full-bleed
+ * (map, calendar grid). Bottom inset is handled by BottomTab when using tabs.
+ */
+declare function Page({ children, scroll }: PageProps): ReactNode;
+
+type ContentInsetProps = PropsWithChildren & {
+    /** Use 12px horizontal instead of 16px */
+    tight?: boolean;
+    style?: StyleProp<ViewStyle>;
+};
+/**
+ * Horizontal page inset applied per block (not on Page).
+ * Full-bleed components (map canvas, calendar grid) skip this wrapper.
+ */
+declare function ContentInset({ children, tight, style }: ContentInsetProps): ReactNode;
+
+type TitleLevel = "1" | "2" | "3";
+type TextAlignHorizontal = "left" | "center" | "right";
+type TextAlignVertical = "top" | "middle" | "bottom";
+type TitleProps = {
+    text: string;
+    level: TitleLevel;
+    style?: StyleProp<TextStyle>;
+    numberOfLines?: number;
+    alignHorizontal?: TextAlignHorizontal;
+    alignVertical?: TextAlignVertical;
+};
+declare function Title({ text, level, style, numberOfLines, alignHorizontal, alignVertical, }: TitleProps): ReactNode;
+
+type PararaphProps = {
+    text: string;
+    style?: StyleProp<TextStyle>;
+    alignHorizontal?: TextAlignHorizontal;
+    alignVertical?: TextAlignVertical;
+};
+declare function Paragraph({ text, style, alignHorizontal, alignVertical, }: PararaphProps): ReactNode;
+
+type RecyclingInfoProps = {};
+declare function RecyclingInfo({}: RecyclingInfoProps): ReactNode;
+
+type SearchType = "all" | "waste-type" | "collection-points" | "articles";
+type SearchProps = {
+    searchType: SearchType;
+    placeholder?: string;
+};
+declare function Search({ searchType, placeholder, }: SearchProps): ReactNode;
+
+type AppHeaderSlot = "left" | "center" | "right";
+type AppHeaderLogoElement = {
+    id: string;
+    type: "logo";
+    slot: AppHeaderSlot;
+    sourceType: "url" | "media";
+    url?: string;
+    mediaId?: string;
+};
+type AppHeaderTitleElement = {
+    id: string;
+    type: "title";
+    slot: AppHeaderSlot;
+    useScreenTitle?: boolean;
+    text?: string;
+};
+type AppHeaderActionElement = {
+    id: string;
+    type: "action";
+    slot: AppHeaderSlot;
+    icon: string;
+    label?: string;
+    action: "navigate" | "back";
+    href?: string;
+};
+type AppHeaderElement = AppHeaderLogoElement | AppHeaderTitleElement | AppHeaderActionElement;
+type AppHeaderConfig = {
+    elements: AppHeaderElement[];
+};
+type HeaderProps = {
+    readonly options: {
+        title?: string;
+        headerBackVisible?: boolean;
+    };
+    readonly route: {
+        name: string;
+    };
+    readonly navigation: {
+        canGoBack: () => boolean;
+        goBack: () => void;
+    };
+    /** Flotte au-dessus du contenu (ex. carte) : fond transparent. */
+    readonly overlay?: boolean;
+    /** Config layout (`header.elements`) — logo / titre / actions. */
+    readonly headerConfig?: AppHeaderConfig | null;
+};
+declare function Header({ options, route, navigation, overlay, headerConfig, }: HeaderProps): ReactNode;
+
+type BottomTabProps = BottomTabBarProps;
+declare function BottomTab({ state, descriptors, navigation, }: BottomTabProps): ReactNode;
+
+/** Inbox list — detail uses the shared AnnouncementModal (WastoProvider). */
+declare function NotificationsScreen(): ReactNode;
+
+/** Profil local : récap secteur + actions changer / supprimer. */
+declare function ProfileScreen(): ReactNode;
+
+type VisionCaptureResult = {
+    uri: string;
+};
+type VisionProps = {
+    /** URL POST /detect (sinon fournie par startSession). */
+    detectUrl?: string;
+    /** @deprecated conservé pour compat CMS ; non utilisé en parcours Lens. */
+    offerUrl?: string;
+    title?: string;
+    description?: string;
+    height?: number;
+    /** Override ville ; sinon LocalContext.selectedCityId. */
+    cityId?: string;
+    /**
+     * Capture custom (sinon expo-image-picker si installé dans l’app hôte).
+     */
+    onRequestCapture?: () => Promise<VisionCaptureResult | null>;
+};
+declare function Vision({ detectUrl: detectUrlProp, title, description, height: heightProp, cityId: cityIdProp, onRequestCapture, }: VisionProps): react.JSX.Element;
+
+type VisionSuggestion = {
+    kind: string;
+    rank: number;
+    title: string;
+    body: string;
+    payload?: Record<string, unknown>;
+};
+type VisionActionCardProps = {
+    suggestions: VisionSuggestion[];
+    primaryLabel: string | null;
+    confidence: number | null;
+    requireConfirm: boolean;
+    onConfirm: () => void;
+    onRetake: () => void;
+    onWrong: () => void;
+    busy?: boolean;
+};
+
+type ThemeShadowStyle = {
+    shadowColor: string;
+    shadowOffset: {
+        width: number;
+        height: number;
+    };
+    shadowOpacity: number;
+    shadowRadius: number;
+    elevation: number;
+};
+/**
+ * CMS app theme — edited in console (`config.theme`), injected via WastoProvider.
+ * Maquette defaults live in `createMaquetteTheme` / `MAQUETTE_*`; components must
+ * read colors/radii from here (no hardcoded brand hex / borderRadius).
+ */
+type Theme = {
+    colors: {
+        primary: string;
+        onPrimary: string;
+        surface: string;
+        onSurface: string;
+        background: string;
+        onBackground: string;
+        /** Also used for completed challenges (maquette yellow when customized). */
+        success: string;
+        onSuccess: string;
+        error: string;
+        onError: string;
+        border: string;
+        /** Soft tint of primary (~15–20% alpha). Optional — resolved at runtime if omitted. */
+        primarySoft?: string;
+        /** Slightly elevated surface (cards on cards). Optional. */
+        surfaceElevated?: string;
+        /** Secondary / muted text color. Optional — derived from onSurface if omitted. */
+        muted?: string;
+        gradient: {
+            from: string;
+            to: string;
+        };
+    };
+    /** Primary corner radius (cards, inputs). */
+    radius: number;
+    /** Named radii. Optional — derived from `radius` if omitted. */
+    radii?: {
+        sm: number;
+        md: number;
+        lg: number;
+        pill: number;
+    };
+    /** Elevation shadows. Optional — sensible defaults if omitted. */
+    shadow?: {
+        card: ThemeShadowStyle;
+        soft: ThemeShadowStyle;
+    };
+};
+/** Fully resolved theme (all optional fields filled). */
+type ResolvedTheme = Theme & {
+    colors: Theme["colors"] & {
+        primarySoft: string;
+        surfaceElevated: string;
+        muted: string;
+    };
+    radii: {
+        sm: number;
+        md: number;
+        lg: number;
+        pill: number;
+    };
+    shadow: {
+        card: ThemeShadowStyle;
+        soft: ThemeShadowStyle;
+    };
+};
+
+type WastoSentryConfig = {
+    dsn?: string;
+    enabled?: boolean | string;
+    environment?: string;
+    debug?: boolean | string;
+    release?: string;
+    appId?: string;
+};
+type WastoErrorContext = Record<string, unknown> & {
+    source?: string;
+};
+/**
+ * Initialize Sentry for GitLab Error Tracking (DSN from env).
+ * No-op when DSN is empty, disabled, or `@sentry/react-native` is missing.
+ */
+declare function initWastoSentry(config?: WastoSentryConfig): boolean;
+declare function isWastoSentryActive(): boolean;
+declare function reportError(error: unknown, context?: WastoErrorContext): void;
+declare function wrapWithSentry<P extends Record<string, unknown>>(Component: ComponentType<P>): ComponentType<P>;
+
+type WastoContextType = {
+    apiUrl: string;
+    appId: string;
+    cityGroupId: string | null;
+    /**
+     * Studio / iframe preview — no anonymous device registration or challenge writes.
+     */
+    previewMode: boolean;
+    reportError: (error: unknown, context?: WastoErrorContext) => void;
+    onRequestError?: (error: Error, context: WastoRequestErrorContext) => void;
+};
+type WastoProviderProps = PropsWithChildren & {
+    apiUrl: string;
+    appId: string;
+    theme: Theme;
+    /** City group scoping street search / multi-city apps. */
+    cityGroupId?: string | null;
+    /** GitLab Error Tracking / Sentry config (DSN from env). */
+    sentry?: WastoSentryConfig;
+    /**
+     * When true (Studio preview): LocalContext skips analytics.track / device id.
+     */
+    previewMode?: boolean;
+};
+declare function WastoProvider(props: WastoProviderProps): ReactNode;
+declare function useWasto(): WastoContextType;
+
+/** Shared Wasto HTTP client wired with optional API error reporting. */
+declare function useWastoClient(): WastoClient;
+
+/** Fill optional theme fields with sensible defaults (retrocompat / maquette-like). */
+declare function resolveTheme(theme: Theme): ResolvedTheme;
+/**
+ * Soft elevation tinted with a brand / category color.
+ * Prefer border + category fill for cards; use sparingly (e.g. active chips).
+ */
+declare function coloredShadow(hex: string, opacity?: number): ThemeShadowStyle;
+/** Shared card: surface + border + light shadow (console / shadcn). */
+declare function cardStyle(theme: Theme, opts?: {
+    elevated?: boolean;
+}): ViewStyle;
+declare function softCardStyle(theme: Theme): ViewStyle;
+/** Inset grouped list section: one surface, rows separated by internal hairlines. */
+declare function groupedSectionStyle(theme: Theme): ViewStyle;
+
+/**
+ * Layout tokens from `.idea/maquette/00-tokens-et-style.md`.
+ * Structural spacing only — colors/radii come from Theme (CMS custom).
+ */
+declare const SPACE: {
+    /** Horizontal padding for text / section content */
+    readonly pageX: 16;
+    /** Tighter horizontal (search, chips, CTA bottom) */
+    readonly pageXTight: 12;
+    /** Vertical gap between section header and content */
+    readonly sectionY: 24;
+    /** Internal card / challenge row padding */
+    readonly cardPad: 20;
+    /** Stack gap between list rows */
+    readonly stack: 12;
+    /** Primary button height */
+    readonly buttonH: 42;
+    /** Round icon hit target */
+    readonly iconHit: 34;
+    /** Glyph inside icon hit */
+    readonly iconGlyph: 18;
+    /** Approx. tab bar content height (excl. safe area) */
+    readonly tabBarH: 86;
+    /** Next-collection card height (maquette ~196) */
+    readonly collectionCardH: 196;
+    /** Next-collection card width target */
+    readonly collectionCardW: 286;
+};
+/** Suggested radii when building a maquette-aligned Theme (defaults, not hardcoded in UI). */
+declare const MAQUETTE_RADII: {
+    readonly sm: 12;
+    readonly md: 16;
+    readonly lg: 24;
+    readonly pill: 999;
+    readonly radius: 20;
+};
+declare const MAQUETTE_COLORS: {
+    readonly background: "#F5F5F5";
+    readonly surface: "#FFFFFF";
+    readonly onSurface: "#090909";
+    readonly onBackground: "#090909";
+    readonly primary: "#00D100";
+    readonly onPrimary: "#FFFFFF";
+    readonly primarySoft: "#A6ECA6";
+    readonly muted: "#9A9A9A";
+    readonly border: "#E5E5E5";
+    readonly success: "#FEEA16";
+    readonly onSuccess: "#090909";
+    readonly error: "#D16602";
+    readonly onError: "#FFFFFF";
+    readonly surfaceElevated: "#FFFFFF";
+};
+
+/** Fixed Expo Router paths for shell screens (apps générées + playground). */
+declare const SYSTEM_ROUTES: {
+    readonly notifications: "/(system)/notifications";
+    readonly profile: "/(system)/profile";
+};
+type SystemRouteKey = keyof typeof SYSTEM_ROUTES;
+
+/**
+ * Default theme aligned with `.idea/maquette` tokens.
+ * Runtime apps override via CMS `config.theme` (console).
+ */
+declare function createMaquetteTheme(overrides?: Partial<Theme>): Theme;
+
+/**
+ * Host-agnostic navigation API.
+ * Expo Router apps pass `router.push` / `router.back`;
+ * React Navigation apps pass `navigation.navigate` / `goBack`.
+ */
+type NavigationApi = {
+    push: (href: string) => void;
+    canGoBack?: () => boolean;
+    goBack?: () => void;
+};
+type NavigationProviderProps = PropsWithChildren & {
+    value: NavigationApi;
+};
+declare function NavigationProvider({ value, children }: NavigationProviderProps): ReactNode;
+declare function useAppNavigation(): NavigationApi;
+/** Soft read — returns null when no provider (e.g. isolated component tests). */
+declare function useOptionalAppNavigation(): NavigationApi | null;
+
+export { type AppHeaderActionElement, type AppHeaderConfig, type AppHeaderElement, type AppHeaderLogoElement, type AppHeaderSlot, type AppHeaderTitleElement, Article, type ArticleDisplayMode, type ArticleProps, BottomTab, type BottomTabProps, Challenge, type ChallengeProps, ChallengeVignette, type ChallengeVignetteProps, Chat, type ChatProps, CollectionCalendar, type CollectionCalendarProps, Columns, type ColumnsColumnCount, type ColumnsProps, ContentInset, type ContentInsetProps, Header, type HeaderProps, Image, type ImageProps, LocationsMap, type LocationsMapProps, MAQUETTE_COLORS, MAQUETTE_RADII, type NavigationApi, NavigationProvider, type NavigationProviderProps, NextCollection, type NextCollectionProps, NotificationsScreen, Page, type PageProps, Paragraph, type PararaphProps, ProfileScreen, RecyclingInfo, type RecyclingInfoProps, type ResolvedTheme, SPACE, SYSTEM_ROUTES, Search, type SearchProps, type SystemRouteKey, type Theme, type ThemeShadowStyle, Title, type TitleLevel, type TitleProps, Vision, type VisionActionCardProps, type VisionCaptureResult, type VisionProps, type VisionSuggestion, type WastoContextType, type WastoErrorContext, WastoProvider, type WastoProviderProps, type WastoSentryConfig, cardStyle, coloredShadow, createMaquetteTheme, groupedSectionStyle, initWastoSentry, isWastoSentryActive, reportError, resolveTheme, softCardStyle, useAppNavigation, useOptionalAppNavigation, useWasto, useWastoClient, wrapWithSentry };