@storybook/react-native-ui 8.0.0-alpha.3

package/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2017 Kadira Inc. <hello@kadira.io>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

package/dist/index.d.ts

@@ -0,0 +1,492 @@
+import * as _storybook_react_native_theming from '@storybook/react-native-theming';
+import * as react_native from 'react-native';
+import { PressableProps, View, Text, TouchableOpacityProps, TouchableOpacity } 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/manager-api';
+import * as Fuse from 'fuse.js';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { SvgProps } from 'react-native-svg';
+import { R } from './types-bf5e6555.js';
+
+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 & {
+    theme?: _storybook_react_native_theming.Theme;
+    as?: React__default.ElementType<any, keyof React__default.JSX.IntrinsicElements>;
+} & {
+    depth?: number;
+    isExpandable?: boolean;
+    isExpanded?: boolean;
+    isComponent?: boolean;
+    isSelected?: boolean;
+}, {}, {
+    ref?: React__default.Ref<react_native.TouchableOpacity>;
+}>;
+declare const LeafNode: _storybook_react_native_theming.StyledComponent<react_native.TouchableOpacityProps & {
+    theme?: _storybook_react_native_theming.Theme;
+    as?: React__default.ElementType<any, keyof React__default.JSX.IntrinsicElements>;
+} & {
+    depth?: number;
+    selected?: boolean;
+}, {}, {
+    ref?: React__default.Ref<react_native.TouchableOpacity>;
+}>;
+declare const GroupNode: FC<ComponentProps<typeof BranchNode> & {
+    isExpanded?: boolean;
+    isExpandable?: boolean;
+}>;
+declare const ComponentNode: FC<ComponentProps<typeof BranchNode>>;
+declare const StoryNode: FC<ComponentProps<typeof LeafNode>>;
+
+interface ExpandAction {
+    ids: string[];
+    value: boolean;
+}
+
+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$1 = string;
+interface StoryIdentifier {
+    componentId: ComponentId;
+    title: ComponentTitle;
+    /** @deprecated */
+    kind: ComponentTitle;
+    id: StoryId;
+    name: StoryName;
+    /** @deprecated */
+    story: StoryName;
+    tags: Tag$1[];
+}
+interface Parameters {
+    [name: string]: any;
+}
+type ConditionalTest = {
+    truthy?: boolean;
+} | {
+    exists: boolean;
+} | {
+    eq: any;
+} | {
+    neq: any;
+};
+type ConditionalValue = {
+    arg: string;
+} | {
+    global: string;
+};
+type Conditional = ConditionalValue & ConditionalTest;
+interface InputType {
+    name?: string;
+    description?: string;
+    defaultValue?: any;
+    type?: SBType | SBScalarType['name'];
+    if?: Conditional;
+    [key: string]: any;
+}
+interface StrictInputType extends InputType {
+    name: string;
+    type?: SBType;
+}
+interface Args {
+    [name: string]: any;
+}
+type ArgTypes<TArgs = Args> = {
+    [name in keyof TArgs]: InputType;
+};
+type StrictArgTypes<TArgs = Args> = {
+    [name in keyof TArgs]: StrictInputType;
+};
+interface Globals {
+    [name: string]: any;
+}
+type 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;
+    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$1 = 'story' | 'docs';
+interface StoryContextForLoaders<TRenderer extends Renderer = Renderer, TArgs = Args> extends StoryContextForEnhancers<TRenderer, TArgs>, Required<StoryContextUpdate<TArgs>> {
+    hooks: unknown;
+    viewMode: ViewMode$1;
+    originalStoryFn: StoryFn<TRenderer>;
+}
+interface StoryContext<TRenderer extends Renderer = Renderer, TArgs = Args> extends StoryContextForLoaders<TRenderer, TArgs> {
+    loaded: Record<string, any>;
+    abortSignal: AbortSignal;
+    canvasElement: TRenderer['canvasElement'];
+}
+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 API_BaseEntry {
+    id: StoryId;
+    depth: number;
+    name: string;
+    refId?: string;
+    renderLabel?: (item: API_BaseEntry) => any;
+}
+interface API_RootEntry extends API_BaseEntry {
+    type: 'root';
+    startCollapsed?: boolean;
+    children: StoryId[];
+}
+interface API_GroupEntry extends API_BaseEntry {
+    type: 'group';
+    parent?: StoryId;
+    children: StoryId[];
+}
+interface API_ComponentEntry extends API_BaseEntry {
+    type: 'component';
+    parent?: StoryId;
+    children: StoryId[];
+}
+interface API_DocsEntry extends API_BaseEntry {
+    type: 'docs';
+    parent: StoryId;
+    title: ComponentTitle;
+    importPath: Path;
+    tags: Tag$1[];
+    prepared: boolean;
+    parameters?: {
+        [parameterName: string]: any;
+    };
+}
+interface API_StoryEntry extends API_BaseEntry {
+    type: 'story';
+    parent: StoryId;
+    title: ComponentTitle;
+    importPath: Path;
+    tags: Tag$1[];
+    prepared: boolean;
+    parameters?: {
+        [parameterName: string]: any;
+    };
+    args?: Args;
+    argTypes?: ArgTypes;
+    initialArgs?: Args;
+}
+type API_HashEntry = API_RootEntry | API_GroupEntry | API_ComponentEntry | API_DocsEntry | API_StoryEntry;
+/**
+ * The `IndexHash` is our manager-side representation of the `StoryIndex`.
+ * We create entries in the hash not only for each story or docs entry, but
+ * also for each "group" of the component (split on '/'), as that's how things
+ * are manipulated in the manager (i.e. in the sidebar)
+ */
+interface API_IndexHash {
+    [id: string]: API_HashEntry;
+}
+type API_StatusValue = 'pending' | 'success' | 'error' | 'warn' | 'unknown';
+interface API_StatusObject {
+    status: API_StatusValue;
+    title: string;
+    description: string;
+    data?: any;
+}
+type API_StatusState = Record<StoryId, Record<string, API_StatusObject>>;
+interface API_LoadedRefData {
+    index?: API_IndexHash;
+    indexError?: Error;
+    previewInitialized: boolean;
+}
+interface Addon_SidebarBottomType {
+    type: Addon_TypesEnum.experimental_SIDEBAR_BOTTOM;
+    /**
+     * The unique id of the tool.
+     */
+    id: string;
+    /**
+     * A React.FunctionComponent.
+     */
+    render: FC;
+}
+interface Addon_SidebarTopType {
+    type: Addon_TypesEnum.experimental_SIDEBAR_TOP;
+    /**
+     * The unique id of the tool.
+     */
+    id: string;
+    /**
+     * A React.FunctionComponent.
+     */
+    render: FC;
+}
+declare enum Addon_TypesEnum {
+    /**
+     * This API is used to create a tab the toolbar above the canvas, This API might be removed in the future.
+     * @unstable
+     */
+    TAB = "tab",
+    /**
+     * This adds panels to the addons side panel.
+     */
+    PANEL = "panel",
+    /**
+     * This adds items in the toolbar above the canvas - on the left side.
+     */
+    TOOL = "tool",
+    /**
+     * This adds items in the toolbar above the canvas - on the right side.
+     */
+    TOOLEXTRA = "toolextra",
+    /**
+     * This adds wrapper components around the canvas/iframe component storybook renders.
+     * @unstable this API is not stable yet, and is likely to change in 8.0.
+     */
+    PREVIEW = "preview",
+    /**
+     * This adds pages that render instead of the canvas.
+     * @unstable
+     */
+    experimental_PAGE = "page",
+    /**
+     * This adds items in the bottom of the sidebar.
+     * @unstable
+     */
+    experimental_SIDEBAR_BOTTOM = "sidebar-bottom",
+    /**
+     * This adds items in the top of the sidebar.
+     * @unstable This will get replaced with a new API in 8.0, use at your own risk.
+     */
+    experimental_SIDEBAR_TOP = "sidebar-top"
+}
+type Path = string;
+
+type Refs = State['refs'];
+type RefType = Refs[keyof Refs] & {
+    status?: API_StatusState;
+};
+type Item = StoriesHash[keyof StoriesHash];
+type Dataset = Record<string, Item>;
+interface CombinedDataset {
+    hash: Refs;
+    entries: [string, RefType][];
+}
+interface ItemRef {
+    itemId: string;
+    refId: string;
+}
+interface StoryRef {
+    storyId: string;
+    refId: string;
+}
+type Highlight = ItemRef | null;
+type Selection = StoryRef | null;
+declare function isExpandType(x: any): x is ExpandType;
+interface ExpandType {
+    showAll: () => void;
+    totalCount: number;
+    moreCount: number;
+}
+type SearchItem = Item & {
+    refId: string;
+    path: string[];
+    status?: API_StatusValue;
+    showAll?: () => void;
+};
+type SearchResult = Fuse.FuseResult<SearchItem>;
+type SearchResultProps = SearchResult & {
+    icon: string;
+    isHighlighted: boolean;
+    onPress: PressableProps['onPress'];
+};
+type GetSearchItemProps = (args: {
+    item: SearchResult;
+    index: number;
+    key: string;
+}) => SearchResultProps;
+type SearchChildrenFn = (args: {
+    query: string;
+    results: SearchResult[];
+    isBrowsing: boolean;
+    closeMenu: (cb?: () => void) => void;
+    getItemProps: GetSearchItemProps;
+    highlightedIndex: number | null;
+}) => React.ReactNode;
+
+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']];
+    api: API;
+}
+declare const Node: React__default.NamedExoticComponent<NodeProps>;
+declare const LeafNodeStyleWrapper: _storybook_react_native_theming.StyledComponent<react_native.ViewProps & {
+    theme?: _storybook_react_native_theming.Theme;
+    as?: React__default.ElementType<any, keyof React__default.JSX.IntrinsicElements>;
+}, {}, {
+    ref?: React__default.Ref<View>;
+}>;
+declare const RootNode: _storybook_react_native_theming.StyledComponent<react_native.ViewProps & {
+    theme?: _storybook_react_native_theming.Theme;
+    as?: React__default.ElementType<any, keyof React__default.JSX.IntrinsicElements>;
+}, {}, {
+    ref?: React__default.Ref<View>;
+}>;
+declare const RootNodeText: _storybook_react_native_theming.StyledComponent<react_native.TextProps & {
+    theme?: _storybook_react_native_theming.Theme;
+    as?: React__default.ElementType<any, keyof React__default.JSX.IntrinsicElements>;
+}, {}, {
+    ref?: React__default.Ref<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: SvgProps) => ReactElement;
+}
+declare const Button: React$1.ForwardRefExoticComponent<ButtonProps & React$1.RefAttributes<TouchableOpacity>>;
+declare const ButtonText: _storybook_react_native_theming.StyledComponent<react_native.TextProps & {
+    theme?: _storybook_react_native_theming.Theme;
+    as?: React$1.ElementType<any, keyof React$1.JSX.IntrinsicElements>;
+} & {
+    variant: ButtonProps['variant'];
+    active: ButtonProps['active'];
+}, {}, {
+    ref?: React$1.Ref<react_native.Text>;
+}>;
+declare const ButtonIcon: ({ Icon, active, variant, }: {
+    Icon: (props: SvgProps) => ReactElement;
+    variant: ButtonProps['variant'];
+    active: ButtonProps['active'];
+}) => react_jsx_runtime.JSX.Element;
+
+declare const IconButton: React$1.ForwardRefExoticComponent<ButtonProps & React$1.RefAttributes<TouchableOpacity>>;
+
+type LayoutContextType = {
+    openMobileMenu: () => void;
+    closeMobileMenu: () => void;
+    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'];
+    extra: Addon_SidebarTopType[];
+    bottom?: Addon_SidebarBottomType[];
+    storyId?: string;
+    refId?: string;
+    menuHighlighted?: boolean;
+    setSelection: (selection: Selection) => void;
+}
+declare const Sidebar: React__default.NamedExoticComponent<SidebarProps>;
+
+declare global {
+	interface SymbolConstructor {
+		readonly observable: symbol;
+	}
+}
+
+declare const Layout: ({ storyHash, story, children, }: {
+    storyHash: API_IndexHash | undefined;
+    story?: StoryContext<R, Args>;
+    children: ReactNode | ReactNode[];
+}) => react_jsx_runtime.JSX.Element;
+
+export { Button, ButtonIcon, ButtonProps, ButtonText, CombinedDataset, ComponentNode, Dataset, ExpandType, Explorer, ExplorerProps, GetSearchItemProps, GroupNode, Highlight, IconButton, Item, ItemRef, Layout, LayoutProvider, LeafNodeStyleWrapper, Node, NodeProps$1 as NodeProps, RefType, Refs, RootNode, RootNodeText, SearchChildrenFn, SearchItem, SearchResult, SearchResultProps, Selection, Sidebar, SidebarProps, StoryNode, StoryRef, Tree, isExpandType, useCombination, useLayout };