@nd-storybook/storybook 0.3.0

package/dist/index.d.ts

@@ -0,0 +1,396 @@
+import * as react from 'react';
+import react__default, { ButtonHTMLAttributes, ReactNode } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as use_immer from 'use-immer';
+import * as react_use_lib_misc_hookState from 'react-use/lib/misc/hookState';
+import * as mitt from 'mitt';
+
+interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    variant?: 'primary' | 'secondary' | 'ghost' | 'dark' | 'pill';
+    icon?: string | null;
+    iconOnly?: boolean;
+}
+declare const Button: react__default.FC<ButtonProps>;
+
+interface IconProps {
+    name: string;
+    size?: number;
+    color?: string;
+    className?: string;
+    variant?: "fill" | "outline";
+}
+declare const Icon: react__default.FC<IconProps>;
+
+declare function keys(variant?: 'outline' | 'fill'): string[];
+
+interface PremiumBadgeProps {
+    className?: string;
+    size?: 'small' | 'large';
+}
+declare const PremiumBadge: react__default.FC<PremiumBadgeProps>;
+
+type SkeletonSize = 'sm' | 'md' | 'lg' | Array<'sm' | 'md' | 'lg'>;
+interface SkeletonProps {
+    className?: string;
+    size?: SkeletonSize;
+}
+declare const Skeleton: react__default.FC<SkeletonProps>;
+
+interface TypographyProps {
+    children: ReactNode;
+    className?: string;
+}
+declare const HeadingArticle: ({ children, className }: TypographyProps) => react_jsx_runtime.JSX.Element;
+declare const HeadingPage: ({ children, className }: TypographyProps) => react_jsx_runtime.JSX.Element;
+declare const Heading2: ({ children, className }: TypographyProps) => react_jsx_runtime.JSX.Element;
+declare const Heading3: ({ children, className }: TypographyProps) => react_jsx_runtime.JSX.Element;
+declare const HeadingArticleFeed: ({ children, className }: TypographyProps) => react_jsx_runtime.JSX.Element;
+declare const BodyStandard: ({ children, className }: TypographyProps) => react_jsx_runtime.JSX.Element;
+declare const BodyStandardRegular: ({ children, className }: TypographyProps) => react_jsx_runtime.JSX.Element;
+declare const BodyStandardBold: ({ children, className }: TypographyProps) => react_jsx_runtime.JSX.Element;
+declare const BodyArticle: ({ children, className }: TypographyProps) => react_jsx_runtime.JSX.Element;
+declare const BodyArticleIntro: ({ children, className }: TypographyProps) => react_jsx_runtime.JSX.Element;
+declare const BodyArticleQuote: ({ children, className }: TypographyProps) => react_jsx_runtime.JSX.Element;
+declare const MetaStandard: ({ children, className }: TypographyProps) => react_jsx_runtime.JSX.Element;
+declare const MetaRegular: ({ children, className }: TypographyProps) => react_jsx_runtime.JSX.Element;
+declare const MetaAuthor: ({ children, className }: TypographyProps) => react_jsx_runtime.JSX.Element;
+declare const DropCap: ({ children, className }: TypographyProps) => react_jsx_runtime.JSX.Element;
+declare const ArticleCity: ({ children, className }: TypographyProps) => react_jsx_runtime.JSX.Element;
+declare const ArticleType: ({ children, className }: TypographyProps) => react_jsx_runtime.JSX.Element;
+
+type NModalProps = {
+    id?: string;
+    open?: boolean;
+    size?: "md" | "xl";
+    backdrop?: boolean;
+    modalTitle?: string;
+    modalSubTitle?: string;
+    hideHeader?: boolean;
+    simplified?: boolean;
+    closeButton?: boolean;
+    noFooter?: boolean;
+    noCloseOnBackdrop?: boolean;
+    bodyClass?: string;
+    compactOnMobile?: boolean;
+    children?: react__default.ReactNode;
+    footer?: react__default.ReactNode;
+    onClose?: () => void;
+    onAfterClose?: () => void;
+};
+declare const NModal: react__default.FC<NModalProps>;
+
+interface ConfirmModalProps extends NModalProps {
+    title?: string;
+    message?: string;
+    confirmLabel?: string;
+    cancelLabel?: string;
+    onConfirm?: (props: ConfirmModalProps) => void;
+    onCancel?: (props: ConfirmModalProps) => void;
+}
+declare const ConfirmModal: react__default.FC;
+
+declare const ExampleModal: react__default.FC;
+
+declare const ModalManager: react__default.FC;
+
+interface DescriptionListProps {
+    className?: string;
+    title?: react__default.ReactNode;
+    actions?: react__default.ReactNode;
+    footer?: react__default.ReactNode;
+    isLoading?: boolean;
+    children?: react__default.ReactNode;
+}
+declare const DescriptionList: react__default.FC<DescriptionListProps>;
+
+interface DescriptionListItemProps {
+    term?: react__default.ReactNode;
+    children?: react__default.ReactNode;
+    skeleton?: SkeletonSize;
+    isLoading?: boolean;
+    className?: string;
+}
+/**
+ * DescriptionListItem component for displaying a term-description pair
+ */
+declare const DescriptionListItem: react__default.FC<DescriptionListItemProps>;
+
+interface DescriptionListItemsProps {
+    children: react__default.ReactNode;
+    isLoading?: boolean;
+}
+/**
+ * DescriptionListItems component for grouping DescriptionListItem components
+ */
+declare const DescriptionListItems: react__default.FC<DescriptionListItemsProps>;
+
+interface PortalNavigationItem {
+    href: string;
+    label: string;
+}
+interface PortalNavigationProps {
+    items: PortalNavigationItem[];
+    active?: boolean;
+    backHref?: string;
+    currentLocation?: string;
+}
+declare const PortalNavigation: react__default.FC<PortalNavigationProps>;
+
+interface NavigationCardProps {
+    icon: string;
+    headline: string;
+    description: string;
+    href: string;
+}
+
+interface NavigationCardsProps {
+    items: NavigationCardProps[];
+}
+declare function NavigationCards(props: NavigationCardsProps): react_jsx_runtime.JSX.Element;
+
+interface TabsProps {
+    tabs: Array<{
+        label: string;
+        href?: string;
+        id?: string;
+    }>;
+    activeIndex?: number;
+    defaultActiveIndex?: number;
+    onTabChange?: (index: number) => void;
+    activeTabId?: string;
+    device?: 'desktop' | 'mobile';
+}
+declare function Tabs(props: TabsProps): react_jsx_runtime.JSX.Element;
+
+interface FAQItem {
+    id?: string;
+    question: string;
+    answer: string;
+}
+interface FAQProps {
+    title?: string;
+    items: FAQItem[];
+    allowMultiple?: boolean;
+    variant?: 'default' | 'large';
+    className?: string;
+}
+declare function FAQ({ title, items, allowMultiple, variant, className }: FAQProps): react_jsx_runtime.JSX.Element;
+
+interface AccordionItemProps {
+    question: string;
+    answer: string;
+    id?: string;
+    isOpen?: boolean;
+    onToggle?: () => void;
+    variant?: 'default' | 'large';
+}
+declare function AccordionItem({ question, answer, id, isOpen: controlledIsOpen, onToggle, variant }: AccordionItemProps): react_jsx_runtime.JSX.Element;
+
+interface AccordionProps {
+    items: AccordionItemProps[];
+    title?: string;
+    allowMultiple?: boolean;
+    variant?: 'default' | 'large';
+}
+declare function Accordion({ items, title, allowMultiple, variant }: AccordionProps): react_jsx_runtime.JSX.Element;
+
+interface AlertProps {
+    className?: string;
+    children: ReactNode;
+    variant?: AlertVariant;
+}
+type AlertVariant = "dark" | "danger" | "info" | "success" | "warning";
+declare const Alert: react__default.FC<AlertProps>;
+
+interface DataFrameItemProps {
+    label: string;
+    value?: string | ReactNode;
+    skeleton?: string[];
+    isLoading?: boolean;
+    multiline?: boolean;
+}
+declare function DataFrameItem(props: DataFrameItemProps): react_jsx_runtime.JSX.Element;
+
+interface DataFrameInputField {
+    name: string;
+    label: string;
+    value?: string;
+    type?: string;
+    disabled?: boolean;
+    readonly?: boolean;
+    placeholder?: string;
+    width?: 'full' | 'half' | 'third';
+}
+interface DataFrameProps {
+    title: string;
+    items?: DataFrameItemProps[];
+    children?: ReactNode;
+    editable?: boolean;
+    onEdit?: () => void;
+    onSave?: (data: Record<string, any>) => void;
+    onCancel?: () => void;
+    editFields?: DataFrameInputField[];
+    collapsible?: boolean;
+    isOpen?: boolean;
+    onToggle?: () => void;
+    alert?: {
+        type: AlertVariant;
+        message: string;
+    };
+    actions?: Array<{
+        label: string;
+        onClick: () => void;
+        icon?: string;
+    }>;
+    isLoading?: boolean;
+}
+declare function DataFrame(props: DataFrameProps): react_jsx_runtime.JSX.Element;
+
+interface DataFramesProps {
+    frames: DataFrameProps[];
+}
+declare function DataFrames(props: DataFramesProps): react_jsx_runtime.JSX.Element;
+
+interface CardProps {
+    children?: ReactNode;
+    image?: ReactNode;
+    title?: ReactNode;
+    footer?: ReactNode;
+}
+declare const Card: react__default.FC<CardProps>;
+
+interface CollapsedCardProps {
+    title?: string;
+    collapsed?: boolean;
+    children?: ReactNode;
+    header?: ReactNode;
+    onToggle?: (isCollapsed: boolean) => void;
+}
+declare const CollapsedCard: react__default.FC<CollapsedCardProps>;
+
+interface InputProps extends react__default.InputHTMLAttributes<HTMLInputElement> {
+    value: any;
+    setValue: (value: any) => any;
+    label?: string;
+    help?: string;
+    errors?: string[] | null;
+}
+declare const Input: react__default.FC<InputProps>;
+
+interface Config$3 {
+    url: string | (() => string);
+    params?: object | (() => object);
+    onFetched?: (response: any) => void;
+    initialFetch?: boolean;
+    dataKey?: string;
+}
+declare function useFetchData<T>(config: Config$3): {
+    isLoading: boolean;
+    isInitialized: boolean;
+    data: T;
+    error: Error;
+    isEmpty: boolean;
+    initialize: () => Promise<void>;
+    fetch: () => Promise<any>;
+    clear: () => void;
+};
+
+interface Meta {
+    current_page?: number;
+    from?: number;
+    last_page?: number;
+    availableSlots?: number;
+    usedSlots?: number;
+}
+interface Config$2 {
+    url: string | (() => string);
+    params?: object | (() => object);
+    onFetched?: (response: any) => void;
+}
+declare function useFetchList<T>(config: Config$2): {
+    isLoading: boolean;
+    isInitialized: boolean;
+    data: T[];
+    meta: Meta;
+    isEmpty: boolean;
+    initialize: () => Promise<void>;
+    fetch: (resetPagination?: boolean) => Promise<void>;
+    clear: () => void;
+};
+
+interface Config$1 {
+    url: string | (() => string);
+    request?: () => Promise<any>;
+    [key: string]: any;
+}
+interface FetchConfig {
+    url?: string;
+    params?: object;
+    silent?: boolean;
+    [key: string]: any;
+}
+declare function useFormFactory<T>(config: Config$1): {
+    isLoading: boolean;
+    isInitialized: boolean;
+    setIsInitialized: react.Dispatch<react.SetStateAction<boolean>>;
+    factory: T;
+    setFactory: use_immer.Updater<T>;
+    initialize: (_config?: FetchConfig) => Promise<void>;
+    fetchFactory: (_config?: FetchConfig) => Promise<any>;
+    clear: () => void;
+};
+
+interface Config {
+    url: string | (() => string);
+    request?: (data: any) => Promise<any>;
+    onSuccess?: (response: any) => void;
+    onValidationError?: (errors: any) => void;
+    onError?: (error: any) => void;
+}
+declare function useFormHandler(config: Config): {
+    isLoading: boolean;
+    errors: Record<string, any>;
+    setErrors: react.Dispatch<react.SetStateAction<Record<string, any>>>;
+    hasErrors: boolean;
+    submit: (data: any, _config?: {
+        url?: string;
+    }) => Promise<any>;
+    clear: () => void;
+};
+
+type ModalData = {
+    key: string;
+    component: React.FC<any>;
+};
+type ActiveModalData = {
+    id: string;
+    key: string;
+    component: React.FC<any>;
+    props: object;
+};
+declare function useModalManager(): {
+    modals: ModalData[];
+    activeModals: ActiveModalData[];
+    registerModal: (key: string, component: React.FC<any>) => void;
+    open: (key: string, props?: object) => string | undefined;
+    close: (id: string) => void;
+};
+
+declare function useSharedState(): {
+    sharedState: string;
+    setSharedState: (state: react_use_lib_misc_hookState.IHookStateSetAction<string>) => void;
+};
+
+declare function setData<T extends object>(obj: T, path: string, value: any): T;
+
+/**
+ * Formats a date string to a human-readable format (DD Month YYYY)
+ * @param dateString - The date string to format
+ * @returns Formatted date string or null if input is invalid
+ */
+declare const formatDate: (dateString: string | null | undefined) => string | null;
+
+declare const eventbus: mitt.Emitter<Record<mitt.EventType, unknown>>;
+
+export { Accordion, AccordionItem, Alert, ArticleCity, ArticleType, BodyArticle, BodyArticleIntro, BodyArticleQuote, BodyStandard, BodyStandardBold, BodyStandardRegular, Button, Card, CollapsedCard, ConfirmModal, DataFrame, DataFrameItem, DataFrames, DescriptionList, DescriptionListItem, DescriptionListItems, DropCap, ExampleModal, FAQ, Heading2, Heading3, HeadingArticle, HeadingArticleFeed, HeadingPage, Icon, Input, MetaAuthor, MetaRegular, MetaStandard, ModalManager, NModal, NavigationCards, PortalNavigation, PremiumBadge, Skeleton, Tabs, eventbus, formatDate, keys as iconKeys, setData, useFetchData, useFetchList, useFormFactory, useFormHandler, useModalManager, useSharedState };
+export type { AccordionItemProps, AccordionProps, AlertProps, AlertVariant, ButtonProps, CardProps, CollapsedCardProps, ConfirmModalProps, DataFrameItemProps, DataFrameProps, DataFramesProps, DescriptionListItemProps, DescriptionListItemsProps, DescriptionListProps, FAQProps, IconProps, InputProps, Meta, NModalProps, NavigationCardsProps, PortalNavigationItem, PortalNavigationProps, PremiumBadgeProps, SkeletonProps, SkeletonSize, TabsProps, TypographyProps };