Skip to content

djyde/cans-plugin-modal-store

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

10 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

cans-plugin-modal-store

npm circle

cans plugin for creating modal store.

Usage

import cans, { inject } from 'cans'
import modalStorePlugin from 'cans-plugin-modal-store'
import Modal from '/path/to/Modal'

const app = cans()

app.use(modalStorePlugin, { names: ['user'] })

const UserModal = inject(({ models }) => {
  return (
    <Modal visible={models.modals.user.visible}>
      <div>Modal body</div>
      <button onClick={models.modals.user.hide}>Hide Modal</button>
    </Modal>
  )
})

const App = inject(({ models }) => {
  return (
    <div>
      <button onClick={models.modals.user.show}>Show Modal</button>
      <UserModal />
    </div>
  )
})

options

  • modals
    • name: string - modal name
    • emptyRecord: any - default modal record. {} is by default
    • title: (record) => string | Element - function that compute the modal title

observable property

  • visible: boolean.
  • title: string | Element - Computed modal value
  • record: any - Modal record
  • resetRecord(): reset record to emptyRecord
  • confirmLoading: boolean. Loading status
  • startLoading(): set confirmLoading to true
  • stopLoading(): set confirmLoading to false
  • show(record): set visible to true. record is optional
  • hide(): set visible to false

License

MIT License

About

cans plugin for creating modal stores

Topics

Resources

Stars

Watchers

Forks

Packages

No packages published