@storybook/react-native-ui 9.0.0-beta.7 → 9.0.0-rc.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -1,23 +1,22 @@
1
1
  import * as _storybook_react_native_theming from '@storybook/react-native-theming';
2
+ import { useTheme } from '@storybook/react-native-theming';
2
3
  import * as react_native from 'react-native';
3
- import { View, PressableProps, TouchableOpacityProps } from 'react-native';
4
- import * as React$1 from 'react';
5
- import React__default, { FC, ComponentProps, ReactElement, PropsWithChildren, ReactNode } from 'react';
6
- import { State, StoriesHash, API } from 'storybook/internal/manager-api';
7
- import { StatusesByStoryIdAndTypeId, StatusValue, API_LoadedRefData, API_IndexHash, StoryContext, Args, API_PreparedStoryIndex, StoryIndexV2, StoryIndexV3, API_Provider, DocsOptions } from 'storybook/internal/types';
8
- import * as Fuse from 'fuse.js';
4
+ import { View } from 'react-native';
5
+ import React, { FC, ComponentProps, ReactNode } from 'react';
6
+ import { State, StoriesHash } from 'storybook/internal/manager-api';
7
+ import { Item, ExpandAction, CombinedDataset, Selection, SBUI } from '@storybook/react-native-ui-common';
8
+ import { API_LoadedRefData, API_IndexHash } from 'storybook/internal/types';
9
9
  import * as react_jsx_runtime from 'react/jsx-runtime';
10
- import { SvgProps } from 'react-native-svg';
11
10
  import { ReactRenderer } from '@storybook/react';
12
11
 
13
12
  interface NodeProps$1 {
14
- children: React__default.ReactNode | React__default.ReactNode[];
13
+ children: React.ReactNode | React.ReactNode[];
15
14
  isExpandable?: boolean;
16
15
  isExpanded?: boolean;
17
16
  }
18
- declare const BranchNode: _storybook_react_native_theming.StyledComponent<react_native.TouchableOpacityProps & React__default.RefAttributes<View> & {
19
- theme?: _storybook_react_native_theming.Theme;
20
- as?: React__default.ElementType;
17
+ declare const BranchNode: _storybook_react_native_theming.StyledComponent<react_native.TouchableOpacityProps & React.RefAttributes<View> & {
18
+ theme?: useTheme;
19
+ as?: React.ElementType;
21
20
  } & {
22
21
  depth?: number;
23
22
  isExpandable?: boolean;
@@ -25,79 +24,22 @@ declare const BranchNode: _storybook_react_native_theming.StyledComponent<react_
25
24
  isComponent?: boolean;
26
25
  isSelected?: boolean;
27
26
  }, {}, {
28
- ref?: React__default.Ref<any>;
27
+ ref?: React.Ref<any>;
29
28
  }>;
30
29
  declare const GroupNode: FC<ComponentProps<typeof BranchNode> & {
31
30
  isExpanded?: boolean;
32
31
  isExpandable?: boolean;
33
32
  }>;
34
33
  declare const ComponentNode: FC<ComponentProps<typeof BranchNode>>;
35
- declare const StoryNode: React__default.NamedExoticComponent<Omit<react_native.TouchableOpacityProps & React__default.RefAttributes<View> & {
36
- theme?: _storybook_react_native_theming.Theme;
37
- as?: React__default.ElementType;
34
+ declare const StoryNode: React.NamedExoticComponent<Omit<react_native.TouchableOpacityProps & React.RefAttributes<View> & {
35
+ theme?: useTheme;
36
+ as?: React.ElementType;
38
37
  } & {
39
38
  depth?: number;
40
39
  selected?: boolean;
41
40
  } & {
42
- ref?: React__default.Ref<any>;
43
- }, "ref"> & React__default.RefAttributes<View>>;
44
-
45
- type Refs = State['refs'];
46
- type RefType = Refs[keyof Refs] & {
47
- allStatuses?: StatusesByStoryIdAndTypeId;
48
- };
49
- type Item = StoriesHash[keyof StoriesHash];
50
- type Dataset = Record<string, Item>;
51
- interface CombinedDataset {
52
- hash: Refs;
53
- entries: [string, RefType][];
54
- }
55
- interface ItemRef {
56
- itemId: string;
57
- refId: string;
58
- }
59
- interface StoryRef {
60
- storyId: string;
61
- refId: string;
62
- }
63
- type Highlight = ItemRef | null;
64
- type Selection = StoryRef | null;
65
- declare function isExpandType(x: any): x is ExpandType;
66
- interface ExpandType {
67
- showAll: () => void;
68
- totalCount: number;
69
- moreCount: number;
70
- }
71
- type SearchItem = Item & {
72
- refId: string;
73
- path: string[];
74
- status?: StatusValue;
75
- showAll?: () => void;
76
- };
77
- type SearchResult = Fuse.FuseResult<SearchItem>;
78
- type SearchResultProps = SearchResult & {
79
- icon: string;
80
- isHighlighted: boolean;
81
- onPress: PressableProps['onPress'];
82
- };
83
- type GetSearchItemProps = (args: {
84
- item: SearchResult;
85
- index: number;
86
- key: string;
87
- }) => SearchResultProps;
88
- type SearchChildrenFn = (args: {
89
- query: string;
90
- results: SearchResult[];
91
- isBrowsing: boolean;
92
- closeMenu: (cb?: () => void) => void;
93
- getItemProps: GetSearchItemProps;
94
- highlightedIndex: number | null;
95
- }) => React.ReactNode;
96
-
97
- interface ExpandAction {
98
- ids: string[];
99
- value: boolean;
100
- }
41
+ ref?: React.Ref<any>;
42
+ }, "ref"> & React.RefAttributes<View>>;
101
43
 
102
44
  interface NodeProps {
103
45
  item: Item;
@@ -114,26 +56,26 @@ interface NodeProps {
114
56
  onSelectStoryId: (itemId: string) => void;
115
57
  status: State['status'][keyof State['status']];
116
58
  }
117
- declare const Node: React__default.NamedExoticComponent<NodeProps>;
59
+ declare const Node: React.NamedExoticComponent<NodeProps>;
118
60
  declare const LeafNodeStyleWrapper: _storybook_react_native_theming.StyledComponent<react_native.ViewProps & {
119
- theme?: _storybook_react_native_theming.Theme;
120
- as?: React__default.ElementType;
61
+ theme?: Theme$1;
62
+ as?: React.ElementType;
121
63
  }, {}, {
122
- ref?: React__default.Ref<View>;
64
+ ref?: React.Ref<View>;
123
65
  }>;
124
66
  declare const RootNode: _storybook_react_native_theming.StyledComponent<react_native.ViewProps & {
125
- theme?: _storybook_react_native_theming.Theme;
126
- as?: React__default.ElementType;
67
+ theme?: Theme$1;
68
+ as?: React.ElementType;
127
69
  }, {}, {
128
- ref?: React__default.Ref<View>;
70
+ ref?: React.Ref<View>;
129
71
  }>;
130
72
  declare const RootNodeText: _storybook_react_native_theming.StyledComponent<react_native.TextProps & {
131
- theme?: _storybook_react_native_theming.Theme;
132
- as?: React__default.ElementType;
73
+ theme?: Theme$1;
74
+ as?: React.ElementType;
133
75
  }, {}, {
134
- ref?: React__default.Ref<react_native.Text>;
76
+ ref?: React.Ref<react_native.Text>;
135
77
  }>;
136
- declare const Tree: React__default.NamedExoticComponent<{
78
+ declare const Tree: React.NamedExoticComponent<{
137
79
  isBrowsing: boolean;
138
80
  isMain: boolean;
139
81
  status?: State["status"];
@@ -144,42 +86,6 @@ declare const Tree: React__default.NamedExoticComponent<{
144
86
  onSelectStoryId: (storyId: string) => void;
145
87
  }>;
146
88
 
147
- interface ButtonProps extends TouchableOpacityProps {
148
- asChild?: boolean;
149
- size?: 'small' | 'medium';
150
- padding?: 'small' | 'medium';
151
- variant?: 'outline' | 'solid' | 'ghost';
152
- disabled?: boolean;
153
- active?: boolean;
154
- animation?: 'none' | 'rotate360' | 'glow' | 'jiggle';
155
- text?: string;
156
- Icon?: (props: SvgProps) => ReactElement;
157
- }
158
- declare const Button: React$1.ForwardRefExoticComponent<ButtonProps & React$1.RefAttributes<any>>;
159
- declare const ButtonText: _storybook_react_native_theming.StyledComponent<react_native.TextProps & {
160
- theme?: _storybook_react_native_theming.Theme;
161
- as?: React.ElementType;
162
- } & {
163
- variant: ButtonProps["variant"];
164
- active: ButtonProps["active"];
165
- }, {}, {
166
- ref?: React$1.Ref<react_native.Text>;
167
- }>;
168
- declare const ButtonIcon: ({ Icon, active, variant, }: {
169
- Icon: (props: SvgProps) => ReactElement;
170
- variant: ButtonProps["variant"];
171
- active: ButtonProps["active"];
172
- }) => react_jsx_runtime.JSX.Element;
173
-
174
- declare const IconButton: React$1.ForwardRefExoticComponent<ButtonProps & React$1.RefAttributes<unknown>>;
175
-
176
- type LayoutContextType = {
177
- isDesktop: boolean;
178
- isMobile: boolean;
179
- };
180
- declare const LayoutProvider: FC<PropsWithChildren>;
181
- declare const useLayout: () => LayoutContextType;
182
-
183
89
  interface ExplorerProps {
184
90
  isLoading: boolean;
185
91
  isBrowsing: boolean;
@@ -198,31 +104,278 @@ interface SidebarProps extends API_LoadedRefData {
198
104
  menuHighlighted?: boolean;
199
105
  setSelection: (selection: Selection) => void;
200
106
  }
201
- declare const Sidebar: React__default.NamedExoticComponent<SidebarProps>;
107
+ declare const Sidebar: React.NamedExoticComponent<SidebarProps>;
202
108
 
109
+ declare global {
110
+ interface SymbolConstructor {
111
+ readonly observable: symbol;
112
+ }
113
+ }
114
+
115
+ interface SBBaseType {
116
+ required?: boolean;
117
+ raw?: string;
118
+ }
119
+ type SBScalarType = SBBaseType & {
120
+ name: 'boolean' | 'string' | 'number' | 'function' | 'symbol';
121
+ };
122
+ type SBArrayType = SBBaseType & {
123
+ name: 'array';
124
+ value: SBType;
125
+ };
126
+ type SBObjectType = SBBaseType & {
127
+ name: 'object';
128
+ value: Record<string, SBType>;
129
+ };
130
+ type SBEnumType = SBBaseType & {
131
+ name: 'enum';
132
+ value: (string | number)[];
133
+ };
134
+ type SBIntersectionType = SBBaseType & {
135
+ name: 'intersection';
136
+ value: SBType[];
137
+ };
138
+ type SBUnionType = SBBaseType & {
139
+ name: 'union';
140
+ value: SBType[];
141
+ };
142
+ type SBOtherType = SBBaseType & {
143
+ name: 'other';
144
+ value: string;
145
+ };
146
+ type SBType = SBScalarType | SBEnumType | SBArrayType | SBObjectType | SBIntersectionType | SBUnionType | SBOtherType;
147
+
148
+ type StoryId = string;
149
+ type ComponentId = string;
150
+ type ComponentTitle = string;
151
+ type StoryName = string;
152
+ type Tag = string;
153
+ interface StoryIdentifier {
154
+ componentId: ComponentId;
155
+ title: ComponentTitle;
156
+ /** @deprecated */
157
+ kind: ComponentTitle;
158
+ id: StoryId;
159
+ name: StoryName;
160
+ /** @deprecated */
161
+ story: StoryName;
162
+ tags: Tag[];
163
+ }
164
+ interface Parameters {
165
+ [name: string]: any;
166
+ }
167
+ type ControlType = 'object' | 'boolean' | 'check' | 'inline-check' | 'radio' | 'inline-radio' | 'select' | 'multi-select' | 'number' | 'range' | 'file' | 'color' | 'date' | 'text';
168
+ type ConditionalTest = {
169
+ truthy?: boolean;
170
+ } | {
171
+ exists: boolean;
172
+ } | {
173
+ eq: any;
174
+ } | {
175
+ neq: any;
176
+ };
177
+ type ConditionalValue = {
178
+ arg: string;
179
+ } | {
180
+ global: string;
181
+ };
182
+ type Conditional = ConditionalValue & ConditionalTest;
183
+ interface ControlBase {
184
+ [key: string]: any;
185
+ /**
186
+ * @see https://storybook.js.org/docs/api/arg-types#controltype
187
+ */
188
+ type?: ControlType;
189
+ disable?: boolean;
190
+ }
191
+ interface Report {
192
+ type: string;
193
+ version?: number;
194
+ result: unknown;
195
+ status: 'failed' | 'passed' | 'warning';
196
+ }
197
+ interface ReportingAPI {
198
+ reports: Report[];
199
+ addReport: (report: Report) => void;
200
+ }
201
+ type Control = ControlType | false | (ControlBase & (ControlBase | {
202
+ type: 'color';
203
+ /**
204
+ * @see https://storybook.js.org/docs/api/arg-types#controlpresetcolors
205
+ */
206
+ presetColors?: string[];
207
+ } | {
208
+ type: 'file';
209
+ /**
210
+ * @see https://storybook.js.org/docs/api/arg-types#controlaccept
211
+ */
212
+ accept?: string;
213
+ } | {
214
+ type: 'inline-check' | 'radio' | 'inline-radio' | 'select' | 'multi-select';
215
+ /**
216
+ * @see https://storybook.js.org/docs/api/arg-types#controllabels
217
+ */
218
+ labels?: {
219
+ [options: string]: string;
220
+ };
221
+ } | {
222
+ type: 'number' | 'range';
223
+ /**
224
+ * @see https://storybook.js.org/docs/api/arg-types#controlmax
225
+ */
226
+ max?: number;
227
+ /**
228
+ * @see https://storybook.js.org/docs/api/arg-types#controlmin
229
+ */
230
+ min?: number;
231
+ /**
232
+ * @see https://storybook.js.org/docs/api/arg-types#controlstep
233
+ */
234
+ step?: number;
235
+ }));
236
+ interface InputType {
237
+ /**
238
+ * @see https://storybook.js.org/docs/api/arg-types#control
239
+ */
240
+ control?: Control;
241
+ /**
242
+ * @see https://storybook.js.org/docs/api/arg-types#description
243
+ */
244
+ description?: string;
245
+ /**
246
+ * @see https://storybook.js.org/docs/api/arg-types#if
247
+ */
248
+ if?: Conditional;
249
+ /**
250
+ * @see https://storybook.js.org/docs/api/arg-types#mapping
251
+ */
252
+ mapping?: {
253
+ [key: string]: any;
254
+ };
255
+ /**
256
+ * @see https://storybook.js.org/docs/api/arg-types#name
257
+ */
258
+ name?: string;
259
+ /**
260
+ * @see https://storybook.js.org/docs/api/arg-types#options
261
+ */
262
+ options?: readonly any[];
263
+ /**
264
+ * @see https://storybook.js.org/docs/api/arg-types#table
265
+ */
266
+ table?: {
267
+ [key: string]: unknown;
268
+ /**
269
+ * @see https://storybook.js.org/docs/api/arg-types#tablecategory
270
+ */
271
+ category?: string;
272
+ /**
273
+ * @see https://storybook.js.org/docs/api/arg-types#tabledefaultvalue
274
+ */
275
+ defaultValue?: {
276
+ summary?: string;
277
+ detail?: string;
278
+ };
279
+ /**
280
+ * @see https://storybook.js.org/docs/api/arg-types#tabledisable
281
+ */
282
+ disable?: boolean;
283
+ /**
284
+ * @see https://storybook.js.org/docs/api/arg-types#tablesubcategory
285
+ */
286
+ subcategory?: string;
287
+ /**
288
+ * @see https://storybook.js.org/docs/api/arg-types#tabletype
289
+ */
290
+ type?: {
291
+ summary?: string;
292
+ detail?: string;
293
+ };
294
+ };
295
+ /**
296
+ * @see https://storybook.js.org/docs/api/arg-types#type
297
+ */
298
+ type?: SBType | SBScalarType['name'];
299
+ /**
300
+ * @see https://storybook.js.org/docs/api/arg-types#defaultvalue
301
+ *
302
+ * @deprecated Use `table.defaultValue.summary` instead.
303
+ */
304
+ defaultValue?: any;
305
+ [key: string]: any;
306
+ }
307
+ interface StrictInputType extends InputType {
308
+ name: string;
309
+ type?: SBType;
310
+ }
311
+ interface Args {
312
+ [name: string]: any;
313
+ }
314
+ type StrictArgTypes<TArgs = Args> = {
315
+ [name in keyof TArgs]: StrictInputType;
316
+ };
317
+ interface Globals {
318
+ [name: string]: any;
319
+ }
320
+ interface Renderer {
321
+ /** What is the type of the `component` annotation in this renderer? */
322
+ component: unknown;
323
+ /** What does the story function return in this renderer? */
324
+ storyResult: unknown;
325
+ /** What type of element does this renderer render to? */
326
+ canvasElement: unknown;
327
+ mount(): Promise<Canvas>;
328
+ T?: unknown;
329
+ }
330
+ interface StoryContextForEnhancers<TRenderer extends Renderer = Renderer, TArgs = Args> extends StoryIdentifier {
331
+ component?: (TRenderer & {
332
+ T: any;
333
+ })['component'];
334
+ subcomponents?: Record<string, (TRenderer & {
335
+ T: any;
336
+ })['component']>;
337
+ parameters: Parameters;
338
+ initialArgs: TArgs;
339
+ argTypes: StrictArgTypes<TArgs>;
340
+ }
341
+ interface StoryContextUpdate<TArgs = Args> {
342
+ args?: TArgs;
343
+ globals?: Globals;
344
+ [key: string]: any;
345
+ }
346
+ type ViewMode = 'story' | 'docs';
347
+ interface Canvas {
348
+ }
349
+ interface StoryContext<TRenderer extends Renderer = Renderer, TArgs = Args> extends StoryContextForEnhancers<TRenderer, TArgs>, Required<StoryContextUpdate<TArgs>> {
350
+ loaded: Record<string, any>;
351
+ abortSignal: AbortSignal;
352
+ canvasElement: TRenderer['canvasElement'];
353
+ hooks: unknown;
354
+ originalStoryFn: StoryFn<TRenderer>;
355
+ viewMode: ViewMode;
356
+ step: StepFunction<TRenderer, TArgs>;
357
+ context: this;
358
+ canvas: Canvas;
359
+ mount: TRenderer['mount'];
360
+ reporting: ReportingAPI;
361
+ }
362
+ /** @deprecated Use {@link StoryContext} instead. */
363
+ interface PlayFunctionContext<TRenderer extends Renderer = Renderer, TArgs = Args> extends StoryContext<TRenderer, TArgs> {
364
+ }
365
+ type StepLabel = string;
366
+ type StepFunction<TRenderer extends Renderer = Renderer, TArgs = Args> = (label: StepLabel, play: PlayFunction<TRenderer, TArgs>) => Promise<void> | void;
367
+ type PlayFunction<TRenderer extends Renderer = Renderer, TArgs = Args> = (context: PlayFunctionContext<TRenderer, TArgs>) => Promise<void> | void;
368
+ type LegacyStoryFn<TRenderer extends Renderer = Renderer, TArgs = Args> = (context: StoryContext<TRenderer, TArgs>) => TRenderer['storyResult'];
369
+ type ArgsStoryFn<TRenderer extends Renderer = Renderer, TArgs = Args> = (args: TArgs, context: StoryContext<TRenderer, TArgs>) => (TRenderer & {
370
+ T: TArgs;
371
+ })['storyResult'];
372
+ type StoryFn<TRenderer extends Renderer = Renderer, TArgs = Args> = LegacyStoryFn<TRenderer, TArgs> | ArgsStoryFn<TRenderer, TArgs>;
373
+
374
+ declare const FullUI: SBUI;
203
375
  declare const Layout: ({ storyHash, story, children, }: {
204
376
  storyHash: API_IndexHash | undefined;
205
377
  story?: StoryContext<ReactRenderer, Args>;
206
378
  children: ReactNode | ReactNode[];
207
379
  }) => react_jsx_runtime.JSX.Element;
208
380
 
209
- type ToStoriesHashOptions = {
210
- provider: API_Provider<API>;
211
- docsOptions: DocsOptions;
212
- filters: State['filters'];
213
- status: State['status'];
214
- };
215
- declare const transformStoryIndexToStoriesHash: (input: API_PreparedStoryIndex | StoryIndexV2 | StoryIndexV3, { provider, docsOptions, filters, status }: ToStoriesHashOptions) => API_IndexHash | any;
216
- declare const transformStoryIndexV2toV3: (index: StoryIndexV2) => StoryIndexV3;
217
- declare const transformStoryIndexV3toV4: (index: StoryIndexV3) => API_PreparedStoryIndex;
218
-
219
- interface Storage {
220
- getItem: (key: string) => Promise<string | null>;
221
- setItem: (key: string, value: string) => Promise<void>;
222
- }
223
- declare const StorageProvider: FC<PropsWithChildren<{
224
- storage: Storage;
225
- }>>;
226
- declare const useStorage: () => Storage;
227
-
228
- 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 };
381
+ export { ComponentNode, Explorer, ExplorerProps, FullUI, GroupNode, Layout, LeafNodeStyleWrapper, Node, NodeProps$1 as NodeProps, RootNode, RootNodeText, Sidebar, SidebarProps, StoryNode, Tree, useCombination };