{"id":15363837,"url":"https://github.com/chentsulin/react-redux-sweetalert","last_synced_at":"2025-08-13T17:10:20.275Z","repository":{"id":57343348,"uuid":"58922150","full_name":"chentsulin/react-redux-sweetalert","owner":"chentsulin","description":"SweetAlert with Redux-style actions, reducers API","archived":false,"fork":false,"pushed_at":"2018-07-24T17:17:46.000Z","size":107,"stargazers_count":32,"open_issues_count":3,"forks_count":8,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-28T18:14:56.049Z","etag":null,"topics":["react","react-redux","redux","sweetalert"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/chentsulin.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-05-16T09:57:08.000Z","updated_at":"2024-05-31T18:55:08.000Z","dependencies_parsed_at":"2022-09-12T07:00:26.817Z","dependency_job_id":null,"html_url":"https://github.com/chentsulin/react-redux-sweetalert","commit_stats":null,"previous_names":[],"tags_count":8,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chentsulin%2Freact-redux-sweetalert","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chentsulin%2Freact-redux-sweetalert/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chentsulin%2Freact-redux-sweetalert/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chentsulin%2Freact-redux-sweetalert/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/chentsulin","download_url":"https://codeload.github.com/chentsulin/react-redux-sweetalert/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248621532,"owners_count":21134873,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["react","react-redux","redux","sweetalert"],"created_at":"2024-10-01T13:08:42.013Z","updated_at":"2025-04-15T07:30:59.928Z","avatar_url":"https://github.com/chentsulin.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# react-redux-sweetalert\n\n[![NPM version][npm-image]][npm-url]\n[![Build Status][travis-image]][travis-url]\n[![Test coverage][coveralls-image]][coveralls-url]\n[![Dependency Status][david_img]][david_site]\n\n\u003e SweetAlert with Redux-style actions, reducers API\n\n\n## Install\n\n```\n$ npm install react-redux-sweetalert\n```\n\n\n## Usage\n\n```js\nimport React, { Component } from 'react';\nimport { createStore, combineReducers, applyMiddleware } from 'redux';\nimport thunk from 'redux-thunk';\nimport { Provider } from 'react-redux';\nimport { reducer } from 'react-redux-sweetalert';\n\nconst rootReducer = combineReducers({\n  sweetalert: reducer,\n});\n\nconst store = createStore(\n  rootReducer,\n  applyMiddleware(thunk),\n);\n\nrender(\n  \u003cProvider store={store}\u003e\n    \u003cReduxSweetAlert /\u003e\n  \u003c/Provider\u003e\n);\n```\n\nYou should import sweetalert.css from cdn, file, node_modules(sweetalert/dist/sweetalert.css) or wherever can find the css code.\n\nCheckout full examples [here](https://github.com/chentsulin/react-redux-sweetalert/tree/master/examples).\n\n## API\n\n### types\n\n#### Payload\n\n```js\n{\n  // sweetalert option\n  title: string,\n  text?: string,\n  type?: string,\n  customClass?: string,\n  showCancelButton?: boolean,\n  showConfirmButton?: boolean,\n  confirmButtonText?: string,\n  confirmButtonColor?: string,\n  cancelButtonText?: string,\n  imageUrl?: string,\n  imageSize?: string,\n  html?: boolean,\n  animation?: boolean|string,\n  inputType?: string,\n  inputValue?: string,\n  inputPlaceholder?: string,\n  showLoaderOnConfirm?: boolean,\n\t\n  timer?: number,\n  closeOnConfirm?: boolean,\n  closeOnCancel?: boolean,\n  allowEscapeKey?: boolean,\n  allowOutsideClick?: boolean,\n\n  // custom option\n  onConfirm?: Function,\n  onCancel?: Function,\n  onClose?: Function,\n  onEscapeKey?: Function,\n  onOutsideClick?: Function,\n}\n```\n\n### actions\n\n#### swal(title: string, text: ?string, type: ?string)\n#### swal(payload: Payload)\n\n#### close()\n\n## Examples\n\n```js\nimport React, { Component, PropTypes } from 'react';\nimport { connect } from 'react-redux';\nimport ReduxSweetAlert, { swal, close } from 'react-redux-sweetalert'; // eslint-disable-line\n\n\nclass Main extends Component {\n  static propTypes = {\n    close: PropTypes.func.isRequired,\n    swal: PropTypes.func.isRequired,\n  };\n  render() {\n    return (\n      \u003cdiv\u003e\n        \u003cbutton\n          onClick={() =\u003e this.props.swal({\n            title: 'Demo',\n            text: 'SweetAlert in React',\n            onConfirm: this.props.close,\n          })}\n        \u003eAlert\u003c/button\u003e\n        \u003cReduxSweetAlert /\u003e\n      \u003c/div\u003e\n    );\n  }\n}\n\n\nexport default connect(null, {\n  swal,\n  close,\n})(Main);\n```\n\nCheckout full examples [here](./examples).\n\n## Use with ImmutableJS\n\n```js\nimport React, { Component } from 'react';\nimport { createStore, applyMiddleware } from 'redux';\nimport { combineReducers } from 'redux-immutable';\nimport thunk from 'redux-thunk';\nimport { Provider } from 'react-redux';\nimport { immutableReducer } from 'react-redux-sweetalert';\n\nconst rootReducer = combineReducers({\n  sweetalert: immutableReducer,\n});\n\nconst store = createStore(\n  rootReducer,\n  applyMiddleware(thunk),\n);\n\nrender(\n  \u003cProvider store={store}\u003e\n    \u003cReduxSweetAlert /\u003e\n  \u003c/Provider\u003e\n);\n```\n\nSee full example [here](https://github.com/chentsulin/react-redux-sweetalert/tree/master/examples/immutable/components/App.js).\n\n## License\n\nMIT © [C.T. Lin](https://github.com/chentsulin/react-redux-sweetalert)\n\n[npm-image]: https://badge.fury.io/js/react-redux-sweetalert.svg\n[npm-url]: https://npmjs.org/package/react-redux-sweetalert\n[travis-image]: https://travis-ci.org/chentsulin/react-redux-sweetalert.svg?branch=master\n[travis-url]: https://travis-ci.org/chentsulin/react-redux-sweetalert\n[coveralls-image]: https://coveralls.io/repos/chentsulin/react-redux-sweetalert/badge.svg?branch=master\u0026service=github\n[coveralls-url]: https://coveralls.io/r/chentsulin/react-redux-sweetalert?branch=master\n[david_img]: https://david-dm.org/chentsulin/react-redux-sweetalert.svg\n[david_site]: https://david-dm.org/chentsulin/react-redux-sweetalert\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchentsulin%2Freact-redux-sweetalert","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fchentsulin%2Freact-redux-sweetalert","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchentsulin%2Freact-redux-sweetalert/lists"}