@storybook/react-native-ui-lite 9.0.0-beta.11 → 9.0.0-beta.13

package/dist/index.d.ts

@@ -1,11 +1,46 @@
+import * as _storybook_react_native_theming from '@storybook/react-native-theming';
+import { useTheme, Theme } from '@storybook/react-native-theming';
+import * as react_native from 'react-native';
+import { View, PressableProps, TouchableOpacityProps } from 'react-native';
+import * as React$1 from 'react';
+import React__default, { FC, ComponentProps, ReactElement, PropsWithChildren, ReactNode } from 'react';
 import { State, StoriesHash, API } from 'storybook/internal/manager-api';
-import { StatusesByStoryIdAndTypeId, StatusValue, API_IndexHash, StoryContext, Args, API_PreparedStoryIndex, StoryIndexV2, StoryIndexV3, API_Provider, DocsOptions } from 'storybook/internal/types';
+import { StatusesByStoryIdAndTypeId, StatusValue, API_LoadedRefData, API_IndexHash, API_PreparedStoryIndex, StoryIndexV2, StoryIndexV3, API_Provider, DocsOptions } from 'storybook/internal/types';
 import * as Fuse from 'fuse.js';
-import { PressableProps } from 'react-native';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactRenderer } from '@storybook/react';
-import { Theme } from '@storybook/react-native-theming';
-import { FC, PropsWithChildren, ReactNode } from 'react';
+
+interface NodeProps$1 {
+    children: React__default.ReactNode | React__default.ReactNode[];
+    isExpandable?: boolean;
+    isExpanded?: boolean;
+}
+declare const BranchNode: _storybook_react_native_theming.StyledComponent<react_native.TouchableOpacityProps & React__default.RefAttributes<View> & {
+    theme?: useTheme;
+    as?: React__default.ElementType;
+} & {
+    depth?: number;
+    isExpandable?: boolean;
+    isExpanded?: boolean;
+    isComponent?: boolean;
+    isSelected?: boolean;
+}, {}, {
+    ref?: React__default.Ref<any>;
+}>;
+declare const GroupNode: FC<ComponentProps<typeof BranchNode> & {
+    isExpanded?: boolean;
+    isExpandable?: boolean;
+}>;
+declare const ComponentNode: FC<ComponentProps<typeof BranchNode>>;
+declare const StoryNode: React__default.NamedExoticComponent<Omit<react_native.TouchableOpacityProps & React__default.RefAttributes<View> & {
+    theme?: useTheme;
+    as?: React__default.ElementType;
+} & {
+    depth?: number;
+    selected?: boolean;
+} & {
+    ref?: React__default.Ref<any>;
+}, "ref"> & React__default.RefAttributes<View>>;
 
 type Refs = State['refs'];
 type RefType = Refs[keyof Refs] & {
@@ -59,6 +94,381 @@ type SearchChildrenFn = (args: {
     highlightedIndex: number | null;
 }) => React.ReactNode;
 
+interface ExpandAction {
+    ids: string[];
+    value: boolean;
+}
+
+interface NodeProps {
+    item: Item;
+    refId: string;
+    docsMode: boolean;
+    isOrphan: boolean;
+    isDisplayed: boolean;
+    color: string | undefined;
+    isSelected: boolean;
+    isFullyExpanded?: boolean;
+    isExpanded: boolean;
+    setExpanded: (action: ExpandAction) => void;
+    setFullyExpanded?: () => void;
+    onSelectStoryId: (itemId: string) => void;
+    status: State['status'][keyof State['status']];
+}
+declare const Node: React__default.NamedExoticComponent<NodeProps>;
+declare const LeafNodeStyleWrapper: _storybook_react_native_theming.StyledComponent<react_native.ViewProps & {
+    theme?: Theme$1;
+    as?: React__default.ElementType;
+}, {}, {
+    ref?: React__default.Ref<View>;
+}>;
+declare const RootNode: _storybook_react_native_theming.StyledComponent<react_native.ViewProps & {
+    theme?: Theme$1;
+    as?: React__default.ElementType;
+}, {}, {
+    ref?: React__default.Ref<View>;
+}>;
+declare const RootNodeText: _storybook_react_native_theming.StyledComponent<react_native.TextProps & {
+    theme?: Theme$1;
+    as?: React__default.ElementType;
+}, {}, {
+    ref?: React__default.Ref<react_native.Text>;
+}>;
+declare const Tree: React__default.NamedExoticComponent<{
+    isBrowsing: boolean;
+    isMain: boolean;
+    status?: State["status"];
+    refId: string;
+    data: StoriesHash;
+    docsMode: boolean;
+    selectedStoryId: string | null;
+    onSelectStoryId: (storyId: string) => void;
+}>;
+
+interface ButtonProps extends TouchableOpacityProps {
+    asChild?: boolean;
+    size?: 'small' | 'medium';
+    padding?: 'small' | 'medium';
+    variant?: 'outline' | 'solid' | 'ghost';
+    disabled?: boolean;
+    active?: boolean;
+    animation?: 'none' | 'rotate360' | 'glow' | 'jiggle';
+    text?: string;
+    Icon?: (props: {
+        color: string;
+    }) => ReactElement;
+}
+declare const Button: React$1.ForwardRefExoticComponent<ButtonProps & React$1.RefAttributes<any>>;
+declare const ButtonText: _storybook_react_native_theming.StyledComponent<react_native.TextProps & {
+    theme?: useTheme;
+    as?: React.ElementType;
+} & {
+    variant: ButtonProps["variant"];
+    active: ButtonProps["active"];
+}, {}, {
+    ref?: React$1.Ref<react_native.Text>;
+}>;
+declare const ButtonIcon: ({ Icon, active, variant, }: {
+    Icon: (props: {
+        color: string;
+    }) => ReactElement;
+    variant: ButtonProps["variant"];
+    active: ButtonProps["active"];
+}) => react_jsx_runtime.JSX.Element;
+
+declare const IconButton: React$1.ForwardRefExoticComponent<ButtonProps & React$1.RefAttributes<unknown>>;
+
+type LayoutContextType = {
+    isDesktop: boolean;
+    isMobile: boolean;
+};
+declare const LayoutProvider: FC<PropsWithChildren>;
+declare const useLayout: () => LayoutContextType;
+
+interface ExplorerProps {
+    isLoading: boolean;
+    isBrowsing: boolean;
+    dataset: CombinedDataset;
+    selected: Selection;
+    setSelection: (selection: Selection) => void;
+}
+declare const Explorer: FC<ExplorerProps>;
+
+declare const useCombination: (index: SidebarProps["index"], indexError: SidebarProps["indexError"], previewInitialized: SidebarProps["previewInitialized"], status: SidebarProps["status"], refs: SidebarProps["refs"]) => CombinedDataset;
+interface SidebarProps extends API_LoadedRefData {
+    refs: State['refs'];
+    status: State['status'];
+    storyId?: string;
+    refId?: string;
+    menuHighlighted?: boolean;
+    setSelection: (selection: Selection) => void;
+}
+declare const Sidebar: React__default.NamedExoticComponent<SidebarProps>;
+
+declare global {
+	interface SymbolConstructor {
+		readonly observable: symbol;
+	}
+}
+
+interface SBBaseType {
+    required?: boolean;
+    raw?: string;
+}
+type SBScalarType = SBBaseType & {
+    name: 'boolean' | 'string' | 'number' | 'function' | 'symbol';
+};
+type SBArrayType = SBBaseType & {
+    name: 'array';
+    value: SBType;
+};
+type SBObjectType = SBBaseType & {
+    name: 'object';
+    value: Record<string, SBType>;
+};
+type SBEnumType = SBBaseType & {
+    name: 'enum';
+    value: (string | number)[];
+};
+type SBIntersectionType = SBBaseType & {
+    name: 'intersection';
+    value: SBType[];
+};
+type SBUnionType = SBBaseType & {
+    name: 'union';
+    value: SBType[];
+};
+type SBOtherType = SBBaseType & {
+    name: 'other';
+    value: string;
+};
+type SBType = SBScalarType | SBEnumType | SBArrayType | SBObjectType | SBIntersectionType | SBUnionType | SBOtherType;
+
+type StoryId = string;
+type ComponentId = string;
+type ComponentTitle = string;
+type StoryName = string;
+type Tag = string;
+interface StoryIdentifier {
+    componentId: ComponentId;
+    title: ComponentTitle;
+    /** @deprecated */
+    kind: ComponentTitle;
+    id: StoryId;
+    name: StoryName;
+    /** @deprecated */
+    story: StoryName;
+    tags: Tag[];
+}
+interface Parameters {
+    [name: string]: any;
+}
+type ControlType = 'object' | 'boolean' | 'check' | 'inline-check' | 'radio' | 'inline-radio' | 'select' | 'multi-select' | 'number' | 'range' | 'file' | 'color' | 'date' | 'text';
+type ConditionalTest = {
+    truthy?: boolean;
+} | {
+    exists: boolean;
+} | {
+    eq: any;
+} | {
+    neq: any;
+};
+type ConditionalValue = {
+    arg: string;
+} | {
+    global: string;
+};
+type Conditional = ConditionalValue & ConditionalTest;
+interface ControlBase {
+    [key: string]: any;
+    /**
+     * @see https://storybook.js.org/docs/api/arg-types#controltype
+     */
+    type?: ControlType;
+    disable?: boolean;
+}
+interface Report {
+    type: string;
+    version?: number;
+    result: unknown;
+    status: 'failed' | 'passed' | 'warning';
+}
+interface ReportingAPI {
+    reports: Report[];
+    addReport: (report: Report) => void;
+}
+type Control = ControlType | false | (ControlBase & (ControlBase | {
+    type: 'color';
+    /**
+     * @see https://storybook.js.org/docs/api/arg-types#controlpresetcolors
+     */
+    presetColors?: string[];
+} | {
+    type: 'file';
+    /**
+     * @see https://storybook.js.org/docs/api/arg-types#controlaccept
+     */
+    accept?: string;
+} | {
+    type: 'inline-check' | 'radio' | 'inline-radio' | 'select' | 'multi-select';
+    /**
+     * @see https://storybook.js.org/docs/api/arg-types#controllabels
+     */
+    labels?: {
+        [options: string]: string;
+    };
+} | {
+    type: 'number' | 'range';
+    /**
+     * @see https://storybook.js.org/docs/api/arg-types#controlmax
+     */
+    max?: number;
+    /**
+     * @see https://storybook.js.org/docs/api/arg-types#controlmin
+     */
+    min?: number;
+    /**
+     * @see https://storybook.js.org/docs/api/arg-types#controlstep
+     */
+    step?: number;
+}));
+interface InputType {
+    /**
+     * @see https://storybook.js.org/docs/api/arg-types#control
+     */
+    control?: Control;
+    /**
+     * @see https://storybook.js.org/docs/api/arg-types#description
+     */
+    description?: string;
+    /**
+     * @see https://storybook.js.org/docs/api/arg-types#if
+     */
+    if?: Conditional;
+    /**
+     * @see https://storybook.js.org/docs/api/arg-types#mapping
+     */
+    mapping?: {
+        [key: string]: any;
+    };
+    /**
+     * @see https://storybook.js.org/docs/api/arg-types#name
+     */
+    name?: string;
+    /**
+     * @see https://storybook.js.org/docs/api/arg-types#options
+     */
+    options?: readonly any[];
+    /**
+     * @see https://storybook.js.org/docs/api/arg-types#table
+     */
+    table?: {
+        [key: string]: unknown;
+        /**
+         * @see https://storybook.js.org/docs/api/arg-types#tablecategory
+         */
+        category?: string;
+        /**
+         * @see https://storybook.js.org/docs/api/arg-types#tabledefaultvalue
+         */
+        defaultValue?: {
+            summary?: string;
+            detail?: string;
+        };
+        /**
+         * @see https://storybook.js.org/docs/api/arg-types#tabledisable
+         */
+        disable?: boolean;
+        /**
+         * @see https://storybook.js.org/docs/api/arg-types#tablesubcategory
+         */
+        subcategory?: string;
+        /**
+         * @see https://storybook.js.org/docs/api/arg-types#tabletype
+         */
+        type?: {
+            summary?: string;
+            detail?: string;
+        };
+    };
+    /**
+     * @see https://storybook.js.org/docs/api/arg-types#type
+     */
+    type?: SBType | SBScalarType['name'];
+    /**
+     * @see https://storybook.js.org/docs/api/arg-types#defaultvalue
+     *
+     * @deprecated Use `table.defaultValue.summary` instead.
+     */
+    defaultValue?: any;
+    [key: string]: any;
+}
+interface StrictInputType extends InputType {
+    name: string;
+    type?: SBType;
+}
+interface Args {
+    [name: string]: any;
+}
+type StrictArgTypes<TArgs = Args> = {
+    [name in keyof TArgs]: StrictInputType;
+};
+interface Globals {
+    [name: string]: any;
+}
+interface Renderer {
+    /** What is the type of the `component` annotation in this renderer? */
+    component: unknown;
+    /** What does the story function return in this renderer? */
+    storyResult: unknown;
+    /** What type of element does this renderer render to? */
+    canvasElement: unknown;
+    mount(): Promise<Canvas>;
+    T?: unknown;
+}
+interface StoryContextForEnhancers<TRenderer extends Renderer = Renderer, TArgs = Args> extends StoryIdentifier {
+    component?: (TRenderer & {
+        T: any;
+    })['component'];
+    subcomponents?: Record<string, (TRenderer & {
+        T: any;
+    })['component']>;
+    parameters: Parameters;
+    initialArgs: TArgs;
+    argTypes: StrictArgTypes<TArgs>;
+}
+interface StoryContextUpdate<TArgs = Args> {
+    args?: TArgs;
+    globals?: Globals;
+    [key: string]: any;
+}
+type ViewMode = 'story' | 'docs';
+interface Canvas {
+}
+interface StoryContext<TRenderer extends Renderer = Renderer, TArgs = Args> extends StoryContextForEnhancers<TRenderer, TArgs>, Required<StoryContextUpdate<TArgs>> {
+    loaded: Record<string, any>;
+    abortSignal: AbortSignal;
+    canvasElement: TRenderer['canvasElement'];
+    hooks: unknown;
+    originalStoryFn: StoryFn<TRenderer>;
+    viewMode: ViewMode;
+    step: StepFunction<TRenderer, TArgs>;
+    context: this;
+    canvas: Canvas;
+    mount: TRenderer['mount'];
+    reporting: ReportingAPI;
+}
+/** @deprecated Use {@link StoryContext} instead. */
+interface PlayFunctionContext<TRenderer extends Renderer = Renderer, TArgs = Args> extends StoryContext<TRenderer, TArgs> {
+}
+type StepLabel = string;
+type StepFunction<TRenderer extends Renderer = Renderer, TArgs = Args> = (label: StepLabel, play: PlayFunction<TRenderer, TArgs>) => Promise<void> | void;
+type PlayFunction<TRenderer extends Renderer = Renderer, TArgs = Args> = (context: PlayFunctionContext<TRenderer, TArgs>) => Promise<void> | void;
+type LegacyStoryFn<TRenderer extends Renderer = Renderer, TArgs = Args> = (context: StoryContext<TRenderer, TArgs>) => TRenderer['storyResult'];
+type ArgsStoryFn<TRenderer extends Renderer = Renderer, TArgs = Args> = (args: TArgs, context: StoryContext<TRenderer, TArgs>) => (TRenderer & {
+    T: TArgs;
+})['storyResult'];
+type StoryFn<TRenderer extends Renderer = Renderer, TArgs = Args> = LegacyStoryFn<TRenderer, TArgs> | ArgsStoryFn<TRenderer, TArgs>;
+
 interface Storage {
     getItem: (key: string) => Promise<string | null>;
     setItem: (key: string, value: string) => Promise<void>;
@@ -74,7 +484,7 @@ declare const LiteUI: ({ storage, theme, storyHash, story, children, }: {
     storyHash: API_IndexHash | undefined;
     story?: StoryContext<ReactRenderer, Args>;
     children: ReactNode | ReactNode[];
-}) => react_jsx_runtime.JSX.Element;
+}) => ReactElement;
 declare const Layout: ({ storyHash, story, children, }: {
     storyHash: API_IndexHash | undefined;
     story?: StoryContext<ReactRenderer, Args>;
@@ -91,4 +501,4 @@ declare const transformStoryIndexToStoriesHash: (input: API_PreparedStoryIndex |
 declare const transformStoryIndexV2toV3: (index: StoryIndexV2) => StoryIndexV3;
 declare const transformStoryIndexV3toV4: (index: StoryIndexV3) => API_PreparedStoryIndex;
 
-export { CombinedDataset, Dataset, ExpandType, GetSearchItemProps, Highlight, Item, ItemRef, Layout, LiteUI, RefType, Refs, SearchChildrenFn, SearchItem, SearchResult, SearchResultProps, Selection, Storage, StorageProvider, StoryRef, isExpandType, transformStoryIndexToStoriesHash, transformStoryIndexV2toV3, transformStoryIndexV3toV4, useStorage };
+export { Button, ButtonIcon, ButtonProps, ButtonText, CombinedDataset, ComponentNode, Dataset, ExpandType, Explorer, ExplorerProps, GetSearchItemProps, GroupNode, Highlight, IconButton, Item, ItemRef, Layout, LayoutProvider, LeafNodeStyleWrapper, LiteUI, Node, NodeProps$1 as NodeProps, RefType, Refs, RootNode, RootNodeText, SearchChildrenFn, SearchItem, SearchResult, SearchResultProps, Selection, Sidebar, SidebarProps, Storage, StorageProvider, StoryNode, StoryRef, Tree, isExpandType, transformStoryIndexToStoriesHash, transformStoryIndexV2toV3, transformStoryIndexV3toV4, useCombination, useLayout, useStorage };