@storybook/react-native-ui 9.0.0-beta.9 → 9.0.0-rc.5

package/dist/index.d.ts

@@ -1,23 +1,22 @@
 import * as _storybook_react_native_theming from '@storybook/react-native-theming';
+import { useTheme } 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_LoadedRefData, API_IndexHash, StoryContext, Args, API_PreparedStoryIndex, StoryIndexV2, StoryIndexV3, API_Provider, DocsOptions } from 'storybook/internal/types';
-import * as Fuse from 'fuse.js';
+import { View } from 'react-native';
+import React, { FC, ComponentProps, ReactNode } from 'react';
+import { State, StoriesHash } from 'storybook/internal/manager-api';
+import { Item, ExpandAction, CombinedDataset, Selection, SBUI } from '@storybook/react-native-ui-common';
+import { API_LoadedRefData, API_IndexHash } from 'storybook/internal/types';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { SvgProps } from 'react-native-svg';
 import { ReactRenderer } from '@storybook/react';
 
 interface NodeProps$1 {
-    children: React__default.ReactNode | React__default.ReactNode[];
+    children: React.ReactNode | React.ReactNode[];
     isExpandable?: boolean;
     isExpanded?: boolean;
 }
-declare const BranchNode: _storybook_react_native_theming.StyledComponent<react_native.TouchableOpacityProps & React__default.RefAttributes<View> & {
-    theme?: _storybook_react_native_theming.Theme;
-    as?: React__default.ElementType;
+declare const BranchNode: _storybook_react_native_theming.StyledComponent<react_native.TouchableOpacityProps & React.RefAttributes<View> & {
+    theme?: useTheme;
+    as?: React.ElementType;
 } & {
     depth?: number;
     isExpandable?: boolean;
@@ -25,79 +24,22 @@ declare const BranchNode: _storybook_react_native_theming.StyledComponent<react_
     isComponent?: boolean;
     isSelected?: boolean;
 }, {}, {
-    ref?: React__default.Ref<any>;
+    ref?: React.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?: _storybook_react_native_theming.Theme;
-    as?: React__default.ElementType;
+declare const StoryNode: React.NamedExoticComponent<Omit<react_native.TouchableOpacityProps & React.RefAttributes<View> & {
+    theme?: useTheme;
+    as?: React.ElementType;
 } & {
     depth?: number;
     selected?: boolean;
 } & {
-    ref?: React__default.Ref<any>;
-}, "ref"> & React__default.RefAttributes<View>>;
-
-type Refs = State['refs'];
-type RefType = Refs[keyof Refs] & {
-    allStatuses?: StatusesByStoryIdAndTypeId;
-};
-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?: 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 ExpandAction {
-    ids: string[];
-    value: boolean;
-}
+    ref?: React.Ref<any>;
+}, "ref"> & React.RefAttributes<View>>;
 
 interface NodeProps {
     item: Item;
@@ -114,26 +56,26 @@ interface NodeProps {
     onSelectStoryId: (itemId: string) => void;
     status: State['status'][keyof State['status']];
 }
-declare const Node: React__default.NamedExoticComponent<NodeProps>;
+declare const Node: React.NamedExoticComponent<NodeProps>;
 declare const LeafNodeStyleWrapper: _storybook_react_native_theming.StyledComponent<react_native.ViewProps & {
-    theme?: _storybook_react_native_theming.Theme;
-    as?: React__default.ElementType;
+    theme?: Theme$1;
+    as?: React.ElementType;
 }, {}, {
-    ref?: React__default.Ref<View>;
+    ref?: React.Ref<View>;
 }>;
 declare const RootNode: _storybook_react_native_theming.StyledComponent<react_native.ViewProps & {
-    theme?: _storybook_react_native_theming.Theme;
-    as?: React__default.ElementType;
+    theme?: Theme$1;
+    as?: React.ElementType;
 }, {}, {
-    ref?: React__default.Ref<View>;
+    ref?: React.Ref<View>;
 }>;
 declare const RootNodeText: _storybook_react_native_theming.StyledComponent<react_native.TextProps & {
-    theme?: _storybook_react_native_theming.Theme;
-    as?: React__default.ElementType;
+    theme?: Theme$1;
+    as?: React.ElementType;
 }, {}, {
-    ref?: React__default.Ref<react_native.Text>;
+    ref?: React.Ref<react_native.Text>;
 }>;
-declare const Tree: React__default.NamedExoticComponent<{
+declare const Tree: React.NamedExoticComponent<{
     isBrowsing: boolean;
     isMain: boolean;
     status?: State["status"];
@@ -144,42 +86,6 @@ declare const Tree: React__default.NamedExoticComponent<{
     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<any>>;
-declare const ButtonText: _storybook_react_native_theming.StyledComponent<react_native.TextProps & {
-    theme?: _storybook_react_native_theming.Theme;
-    as?: React.ElementType;
-} & {
-    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<unknown>>;
-
-type LayoutContextType = {
-    isDesktop: boolean;
-    isMobile: boolean;
-};
-declare const LayoutProvider: FC<PropsWithChildren>;
-declare const useLayout: () => LayoutContextType;
-
 interface ExplorerProps {
     isLoading: boolean;
     isBrowsing: boolean;
@@ -198,31 +104,332 @@ interface SidebarProps extends API_LoadedRefData {
     menuHighlighted?: boolean;
     setSelection: (selection: Selection) => void;
 }
-declare const Sidebar: React__default.NamedExoticComponent<SidebarProps>;
+declare const Sidebar: React.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>;
+
+declare const FullUI: SBUI;
 declare const Layout: ({ storyHash, story, children, }: {
     storyHash: API_IndexHash | undefined;
     story?: StoryContext<ReactRenderer, Args>;
     children: ReactNode | ReactNode[];
 }) => react_jsx_runtime.JSX.Element;
 
-type ToStoriesHashOptions = {
-    provider: API_Provider<API>;
-    docsOptions: DocsOptions;
-    filters: State['filters'];
-    status: State['status'];
-};
-declare const transformStoryIndexToStoriesHash: (input: API_PreparedStoryIndex | StoryIndexV2 | StoryIndexV3, { provider, docsOptions, filters, status }: ToStoriesHashOptions) => API_IndexHash | any;
-declare const transformStoryIndexV2toV3: (index: StoryIndexV2) => StoryIndexV3;
-declare const transformStoryIndexV3toV4: (index: StoryIndexV3) => API_PreparedStoryIndex;
-
-interface Storage {
-    getItem: (key: string) => Promise<string | null>;
-    setItem: (key: string, value: string) => Promise<void>;
-}
-declare const StorageProvider: FC<PropsWithChildren<{
-    storage: Storage;
-}>>;
-declare const useStorage: () => Storage;
-
-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, StorageProvider, StoryNode, StoryRef, Tree, isExpandType, transformStoryIndexToStoriesHash, transformStoryIndexV2toV3, transformStoryIndexV3toV4, useCombination, useLayout, useStorage };
+export { ComponentNode, Explorer, ExplorerProps, FullUI, GroupNode, Layout, LeafNodeStyleWrapper, Node, NodeProps$1 as NodeProps, RootNode, RootNodeText, Sidebar, SidebarProps, StoryNode, Tree, useCombination };