@component-controls/store v4.0.3
Table of contents
- Overview
- Installation
- API
- ControlUpdateFn
- StoreContext
- useDocPropCount
- ComponentInputProps
- ControlsContextProps
- StoreContextProvider
- StateRootProps
- DocumentContextProvider
- StoryContext
- LoadingStore
- loadStore
- ControlsContextStoryProvider
- StoryContextProvider
- useStore
- useDocument
- ConfigContext
- StateRoot
- useGetDocument
- ConfigContextProvider
- useDocsByCategory
- useComponents
- useCurrentDocument
- useStoryControls
- useDocPackage
- ControlsStateProviderProps
- useConfigState
- ControlsStateProvider
- useDocs
- useConfig
- usePages
- DocSortOrder
- useThemeState
- useControl
- docSortFn
- useCurrentStory
- useTheme
- useStoryById
- ActiveTabContextProvider
- useStoryIdFromName
- DocsSortContextProvider
- useActiveTab
- usePackage
- StoryInputProps
- useDocSort
- useStoryId
- OptionsContextProvider
- useUserData
- useStory
- useDocByType
- useGetDocByType
- useComponent
- useSortedDocByType
- useStoryComponent
- DocCountType
- useDocTypeCount
- useCurrentPropsCount
- useStoryPath
- useGetStoryPath
- useNavigationInfo
- useDocumentPath
- useGetDocumentPath
- useDocDescription
- useSearch
Overview
Utility functions and hooks to abstract loading and using the store. Can also share the store across bundles using localStorage and broadcasting messages.
Installation
This package is usually installed as part of the @component-controls package, but you can also install it standalone:
$ npm install @component-controls/store --save-devAPI
ControlUpdateFn
function
defined in @component-controls/store/core/store/src/state/context/controls.tsx
parameters
| Name | Type |
|---|---|
name* | string | undefined |
newValue* | any |
StoreContext
interface
defined in @component-controls/store/core/store/src/state/context/store.tsx
properties
| Name | Type | Parent |
|---|---|---|
Provider* | typepropTypes: WeakValidationMap<> | undefined$$typeof*: | Context |
Consumer* | type$$typeof*: | Context |
displayName | string | undefined | Context |
useDocPropCount
function
Returns the number of documents by unique values in their `category` field
defined in @component-controls/store/core/store/src/state/context/categories.tsx
parameters
| Name | Type |
|---|---|
category* | string |
returns | DocCountType |
ComponentInputProps
interface
defined in @component-controls/store/core/store/src/state/context/components.ts
properties
| Name | Type | Description |
|---|---|---|
of | any | Specify the component(s), for which to have information displayed. The default, a value of "." will indicate to display information for the current component (associated with the current Story). If an array of components is specified, each component will be displayed in a separate tab. |
name | string | some component-oriented ui components can also be driven by a story id (name). ie the PropsTable can display component props, or story controls |
ControlsContextProps
interface
defined in @component-controls/store/core/store/src/state/context/controls.tsx
properties
| Name | Type | Description |
|---|---|---|
controls | ComponentControls<>[string]: ComponentControlText | ComponentControlBoolean | ComponentControlColor | ComponentControlDate | ComponentControlObject<> | ComponentControlButton<> | ComponentControlOptions<> | ComponentControlNumber | ComponentControlArray | ComponentControlFiles | ComponentControls are defined in key value pairs the name of the property is the key and the value is the ComponentControl |
updateValue* | ControlUpdateFn |
StoreContextProvider
react component
defined in @component-controls/store/core/store/src/state/context/store.tsx
properties
| Name | Type |
|---|---|
store* | Storeerror: stringconfig*author: stringcontrols[string]: ComponentControl<P>description: stringcomponent: string | Record<string, unknown> | ElementType<Props>subcomponents: Record<string, (string, Record<string, unknown>, ElementType<Props>)>smartControlssmart*: include*: exclude*: decorators: StoryRenderFn[]plugins: anycategory: stringfooterleft*: right*: menu: StaticMenuItem[]title: stringimage: stringlogo: string | ReactNodeapppropTypes*: contextTypes*: defaultProps*: displayName*: copyright: stringlanguage: stringlinks: (DetailedHTMLProps<>)[]seo: ReactChild | ReactFragment | ReactPortal | boolean | null | undefinedpages[string]: theme[string]: anystorySort: function (a*: stringb*: string) => numbertoolbarleft*: right*: sidebar: ActionItem[]components: Record<string, unknown>analytics: anyrenderFn: function (props*story*: doc*: values*: options*: ) => anywebpack: Configuration | WebpackConfigFnfinalWebpack: Configuration | WebpackConfigFnpresets: RuleType[]configPath: stringdistFolder: stringbundleName: stringstaticFolder: stringcssFileName: stringlogOptions: Partial<LogOptions>mode: "none" | "development" | "production"loadersat*: module*: ident*: loader*: options*: stories: string | string[]files: string | string[]siteRoot: stringignore: string[]categories: DocType[]siteMap: type | booleansiteUrl: stringinstrument: anysearchindexingModule*: searchingModule*: fields*: emptySearchDocuments*: hitsPerPage*: options*: tokensfigmaAccessToken*: githubAccessToken*: docs*[string]: type[string]: anytitle*: stringtype: DocTyperoute: stringdate: stringdateModified: stringstatus: "draft" | "published"tags: string[]keywords: string[]description: string | JSX.Elementimage: stringauthor: stringorder: numbermenu: stringtemplate: Example<Props>stories: string[]source: stringfileName: stringpackage: stringtestFiles: string[]testCoverage: string[]testData: stringrenderFn: FrameworkRenderFndata: DocumentDatacomponentsLookup[string]: stringMDXPage: anyisMDXComponent: booleanparameters: anycomponentat*: subcomponents: Record<string, (string, Record<string, unknown>, ElementType<Props>)>controls: ComponentControlssmartControls: SmartControlsdecorators: StoryRenderFn[]plugins: anycategory: stringnavSidebar: booleancontextSidebar: booleanfullPage: booleanstories*[string]: typename*: stringstoryName: stringid: stringrawId: stringdoc: stringstoryFn: StoryRenderFndescription: stringarguments: StoryArgumentsloc: CodeLocationsource: stringsubtitle: stringdynamic: booleandynamicId: stringcomponentat*: subcomponents: Record<string, (string, Record<string, unknown>, ElementType<Props>)>controls: ComponentControlssmartControls: SmartControlsdecorators: StoryRenderFn[]plugins: anycategory: stringcomponents*[string]: interfacename*: stringimportedName: "default" | "namespace" | stringfrom: stringrequest: stringfileName: stringpropsInfoFile: stringloc: CodeLocationpackage: stringsource: stringinfo: ComponentInfoexternalDependencies: ImportslocalDependencies: Importsjsx: JSXTreefileInfo: FileInfojest: JestTestspackages*[string]: interfacefileHash*: stringname: stringversion: stringdependencies: PackageDependenciesdevDependencies: PackageDependenciespeerDependencies: PackageDependenciesprivateNpm: booleanrepository*browse*: docs*: issues*: addObserver*: function (observer*: function (story: Story) => void) => voidremoveObserver*: function (observer*: function (story: Story) => void) => voidupdateStory*: function (story*name*: stringstoryName: stringid: stringrawId: stringdoc: stringstoryFn: StoryRenderFndescription: stringarguments: StoryArgumentsloc: CodeLocationsource: stringsubtitle: stringdynamic: booleandynamicId: stringcomponent: string | Record<string, unknown> | ElementType<Props>subcomponents: Record<string, (string, Record<string, unknown>, ElementType<Props>)>controls: ComponentControlssmartControls: SmartControlsdecorators: StoryRenderFn[]plugins: anycategory: string) => voidsearch: function (store*error*: config*: docs*: stories*: components*: packages*: addObserver*: removeObserver*: updateStory*: search*: ) => SearchResultitems*: SearchItem[]searchFn*: function (search*: ) => voidproviderlogo*: url*: name*: |
StateRootProps
interface
defined in @component-controls/store/core/store/src/state/context/StateRoot.tsx
properties
| Name | Type | Description |
|---|---|---|
storyId | string | current story id |
docId | string |
4 years ago
4 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago