@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-dev
API
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* | type propTypes : 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* | Store error : string config *author : string controls [string ]: ComponentControl <P >description : string component : string | Record <string , unknown > | ElementType <Props >subcomponents : Record <string , (string , Record <string , unknown >, ElementType <Props >)>smartControls smart *: include *: exclude *: decorators : StoryRenderFn []plugins : any category : string footer left *: right *: menu : StaticMenuItem []title : string image : string logo : string | ReactNode app propTypes *: contextTypes *: defaultProps *: displayName *: copyright : string language : string links : (DetailedHTMLProps <>)[]seo : ReactChild | ReactFragment | ReactPortal | boolean | null | undefined pages [string ]: theme [string ]: any storySort : function (a *: string b *: string ) => number toolbar left *: right *: sidebar : ActionItem []components : Record <string , unknown >analytics : any renderFn : function (props *story *: doc *: values *: options *: ) => any webpack : Configuration | WebpackConfigFn finalWebpack : Configuration | WebpackConfigFn presets : RuleType []configPath : string distFolder : string bundleName : string staticFolder : string cssFileName : string logOptions : Partial <LogOptions >mode : "none" | "development" | "production" loaders at *: module *: ident *: loader *: options *: stories : string | string []files : string | string []siteRoot : string ignore : string []categories : DocType []siteMap : type | boolean siteUrl : string instrument : any search indexingModule *: searchingModule *: fields *: emptySearchDocuments *: hitsPerPage *: options *: tokens figmaAccessToken *: githubAccessToken *: docs *[string ]: type [string ]: any title *: string type : DocTyperoute : string date : string dateModified : string status : "draft" | "published" tags : string []keywords : string []description : string | JSX.Element image : string author : string order : number menu : string template : Example <Props >stories : string []source : string fileName : string package : string testFiles : string []testCoverage : string []testData : string renderFn : FrameworkRenderFndata : DocumentDatacomponentsLookup [string ]: string MDXPage : any isMDXComponent : boolean parameters : any component at *: subcomponents : Record <string , (string , Record <string , unknown >, ElementType <Props >)>controls : ComponentControlssmartControls : SmartControlsdecorators : StoryRenderFn []plugins : any category : string navSidebar : boolean contextSidebar : boolean fullPage : boolean stories *[string ]: type name *: string storyName : string id : string rawId : string doc : string storyFn : StoryRenderFndescription : string arguments : StoryArgumentsloc : CodeLocationsource : string subtitle : string dynamic : boolean dynamicId : string component at *: subcomponents : Record <string , (string , Record <string , unknown >, ElementType <Props >)>controls : ComponentControlssmartControls : SmartControlsdecorators : StoryRenderFn []plugins : any category : string components *[string ]: interface name *: string importedName : "default" | "namespace" | string from : string request : string fileName : string propsInfoFile : string loc : CodeLocationpackage : string source : string info : ComponentInfoexternalDependencies : ImportslocalDependencies : Importsjsx : JSXTreefileInfo : FileInfojest : JestTestspackages *[string ]: interface fileHash *: string name : string version : string dependencies : PackageDependenciesdevDependencies : PackageDependenciespeerDependencies : PackageDependenciesprivateNpm : boolean repository *browse *: docs *: issues *: addObserver *: function (observer *: function (story : Story) => void ) => void removeObserver *: function (observer *: function (story : Story) => void ) => void updateStory *: function (story *name *: string storyName : string id : string rawId : string doc : string storyFn : StoryRenderFndescription : string arguments : StoryArgumentsloc : CodeLocationsource : string subtitle : string dynamic : boolean dynamicId : string component : string | Record <string , unknown > | ElementType <Props >subcomponents : Record <string , (string , Record <string , unknown >, ElementType <Props >)>controls : ComponentControlssmartControls : SmartControlsdecorators : StoryRenderFn []plugins : any category : string ) => void search : function (store *error *: config *: docs *: stories *: components *: packages *: addObserver *: removeObserver *: updateStory *: search *: ) => SearchResult items *: SearchItem []searchFn *: function (search *: ) => void provider logo *: 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 |
3 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
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