├── .editorconfig ├── .eslintrc.json ├── .github ├── ISSUE_TEMPLATE │ ├── bug-report.md │ ├── change-request.md │ └── config.yml ├── PULL_REQUEST_TEMPLATE.md └── workflows │ └── ci.yml ├── .gitignore ├── .tidyrc.json ├── CHANGELOG.md ├── CONTRIBUTING.md ├── LICENSE ├── README.md ├── bower.json ├── docs └── README.md ├── package.json ├── packages.dhall ├── spago.dhall ├── src ├── React.js ├── React.purs └── React │ ├── DOM.purs │ ├── DOM │ ├── Dynamic.purs │ ├── Props.js │ ├── Props.purs │ ├── SVG.purs │ └── SVG │ │ └── Dynamic.purs │ ├── Ref.js │ ├── Ref.purs │ ├── SyntheticEvent.js │ └── SyntheticEvent.purs └── test └── Main.purs /.editorconfig: -------------------------------------------------------------------------------- 1 | # https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | indent_style = space 6 | indent_size = 2 7 | end_of_line = lf 8 | charset = utf-8 9 | trim_trailing_whitespace = true 10 | insert_final_newline = true 11 | 12 | [*.md] 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "eslint:recommended", 3 | "parserOptions": { "ecmaVersion": 6, "sourceType": "module" }, 4 | "rules": { 5 | "block-scoped-var": "error", 6 | "consistent-return": "error", 7 | "eqeqeq": "error", 8 | "guard-for-in": "error", 9 | "no-bitwise": "error", 10 | "no-caller": "error", 11 | "no-extra-parens": "off", 12 | "no-extend-native": "error", 13 | "no-loop-func": "error", 14 | "no-new": "error", 15 | "no-param-reassign": "error", 16 | "no-return-assign": "error", 17 | "no-sequences": "error", 18 | "no-unused-expressions": "error", 19 | "no-use-before-define": "error", 20 | "no-undef": "error", 21 | "no-eq-null": "error", 22 | "radix": ["error", "always"], 23 | "indent": ["error", 2, { "SwitchCase": 1 }], 24 | "quotes": ["error", "double"], 25 | "semi": ["error", "always"], 26 | "strict": ["error", "global"] 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/bug-report.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Bug report 3 | about: Report an issue 4 | title: "" 5 | labels: bug 6 | assignees: "" 7 | --- 8 | 9 | **Describe the bug** 10 | A clear and concise description of the bug. 11 | 12 | **To Reproduce** 13 | A minimal code example (preferably a runnable example on [Try PureScript](https://try.purescript.org)!) or steps to reproduce the issue. 14 | 15 | **Expected behavior** 16 | A clear and concise description of what you expected to happen. 17 | 18 | **Additional context** 19 | Add any other context about the problem here. 20 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/change-request.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Change request 3 | about: Propose an improvement to this library 4 | title: "" 5 | labels: "" 6 | assignees: "" 7 | --- 8 | 9 | **Is your change request related to a problem? Please describe.** 10 | A clear and concise description of the problem. 11 | 12 | Examples: 13 | 14 | - It's frustrating to have to [...] 15 | - I was looking for a function to [...] 16 | 17 | **Describe the solution you'd like** 18 | A clear and concise description of what a good solution to you looks like, including any solutions you've already considered. 19 | 20 | **Additional context** 21 | Add any other context about the change request here. 22 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/config.yml: -------------------------------------------------------------------------------- 1 | blank_issues_enabled: false 2 | contact_links: 3 | - name: PureScript Discourse 4 | url: https://discourse.purescript.org/ 5 | about: Ask and answer questions on the PureScript discussion forum. 6 | - name: PureScript Discord 7 | url: https://purescript.org/chat 8 | about: Ask and answer questions on the PureScript chat. 9 | -------------------------------------------------------------------------------- /.github/PULL_REQUEST_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | **Description of the change** 2 | Clearly and concisely describe the purpose of the pull request. If this PR relates to an existing issue or change proposal, please link to it. Include any other background context that would help reviewers understand the motivation for this PR. 3 | 4 | --- 5 | 6 | **Checklist:** 7 | 8 | - [ ] Added the change to the changelog's "Unreleased" section with a link to this PR and your username 9 | - [ ] Linked any existing issues or proposals that this pull request should close 10 | - [ ] Updated or added relevant documentation in the README and/or documentation directory 11 | - [ ] Added a test for the contribution (if applicable) 12 | -------------------------------------------------------------------------------- /.github/workflows/ci.yml: -------------------------------------------------------------------------------- 1 | name: CI 2 | 3 | on: 4 | push: 5 | branches: [main] 6 | pull_request: 7 | branches: [main] 8 | 9 | jobs: 10 | build: 11 | runs-on: ubuntu-latest 12 | 13 | steps: 14 | - uses: actions/checkout@v2 15 | 16 | - name: Set up PureScript toolchain 17 | uses: purescript-contrib/setup-purescript@main 18 | with: 19 | purescript: "unstable" 20 | purs-tidy: "latest" 21 | 22 | - name: Cache PureScript dependencies 23 | uses: actions/cache@v2 24 | with: 25 | key: ${{ runner.os }}-spago-${{ hashFiles('**/*.dhall') }} 26 | path: | 27 | .spago 28 | output 29 | 30 | - name: Set up Node toolchain 31 | uses: actions/setup-node@v2 32 | with: 33 | node-version: "14.x" 34 | 35 | - name: Cache NPM dependencies 36 | uses: actions/cache@v2 37 | env: 38 | cache-name: cache-node-modules 39 | with: 40 | path: ~/.npm 41 | key: ${{ runner.os }}-build-${{ env.cache-name }}-${{ hashFiles('**/package.json') }} 42 | restore-keys: | 43 | ${{ runner.os }}-build-${{ env.cache-name }}- 44 | ${{ runner.os }}-build- 45 | ${{ runner.os }}- 46 | 47 | - name: Install NPM dependencies 48 | run: npm install 49 | 50 | - name: Build the project 51 | run: npm run build 52 | 53 | - name: Run tests 54 | run: npm run test 55 | 56 | - name: Check formatting 57 | run: purs-tidy check src test 58 | 59 | - name: Verify Bower & Pulp 60 | run: | 61 | npm install bower pulp@16.0.0-0 62 | npx bower install 63 | npx pulp build -- --censor-lib --strict 64 | if [ -d "test" ]; then 65 | npx pulp test 66 | fi 67 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .* 2 | !.gitignore 3 | !.github 4 | !.editorconfig 5 | !.tidyrc.json 6 | !.eslintrc.json 7 | 8 | output 9 | generated-docs 10 | bower_components 11 | 12 | node_modules 13 | package-lock.json 14 | *.lock 15 | -------------------------------------------------------------------------------- /.tidyrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "importSort": "source", 3 | "importWrap": "source", 4 | "indent": 2, 5 | "operatorsFile": null, 6 | "ribbon": 1, 7 | "typeArrowPlacement": "first", 8 | "unicode": "never", 9 | "width": null 10 | } 11 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Changelog 2 | 3 | Notable changes to this project are documented in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/) and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). 4 | 5 | ## [Unreleased] 6 | 7 | Breaking changes: 8 | 9 | New features: 10 | 11 | Bugfixes: 12 | 13 | Other improvements: 14 | 15 | ## [v11.0.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v11.0.0) - 2023-01-04 16 | 17 | Breaking changes: 18 | - Update the Monoid/Semigroup instance of `ReactElement` to use `null` for `mempty` instead of an empty fragment. (#187) 19 | 20 | ## [v10.0.1](https://github.com/purescript-contrib/purescript-react/releases/tag/v10.0.1) - 2022-04-27 21 | 22 | Other improvements: 23 | - Minifier-friendly refereces to properties (#183 by @sd-yip) 24 | 25 | ## [v10.0.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v10.0.0) - 2022-04-27 26 | 27 | Breaking changes: 28 | - Migrate FFI to ES modules (#185 by @JordanMartinez) 29 | - Replaced polymorphic proxies with monomorphic `Proxy` (#185 by @JordanMartinez) 30 | 31 | New features: 32 | 33 | Bugfixes: 34 | 35 | Other improvements: 36 | - Added `purs-tidy` formatter (#182 by @thomashoneyman) 37 | 38 | ## [v9.0.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v9.0.0) - 2021-02-26 39 | 40 | Breaking changes: 41 | - Added support for PureScript 0.14 and dropped support for all previous versions (#177) 42 | 43 | New features: 44 | - Added roles declarations to allow safe coercions (#175) 45 | 46 | Bugfixes: 47 | 48 | Other improvements: 49 | - Changed default branch to `main` from `master` 50 | - Updated related modules and installation in README (#174) 51 | - Updated to comply with Contributors library guidelines by adding new issue and pull request templates, updating documentation, and migrating to Spago for local development and CI (#176) 52 | 53 | ## [v8.0.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v8.0.0) - 2019-08-10 54 | 55 | Breaking changes: 56 | 57 | - Added `createRef` support (#172 by @elliotdavies) 58 | 59 | ## [v7.0.1](https://github.com/purescript-contrib/purescript-react/releases/tag/v7.0.1) - 2019-05-27 60 | 61 | - Relaxed upper bound on `purescript-typelevel-prelude` (@hdgarrood) 62 | 63 | ## [v7.0.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v7.0.0) - 2019-05-17 64 | 65 | Breaking changes: 66 | 67 | - Bumped dependencies (#169 by @bbarker) 68 | 69 | Documentation: 70 | 71 | - Updated documentation (#165 by @athanclark) 72 | 73 | ## [v6.1.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v6.1.0) - 2018-08-24 74 | 75 | New features: 76 | 77 | - Exported React types (#155, @tellnobody1) 78 | 79 | ## [v6.0.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v6.0.0) - 2018-06-09 80 | 81 | Breaking changes: 82 | 83 | - Alternative class construction (#129 by @natefaubion) 84 | - Replace ReactRender with IsReactElement (#137 by @natefaubion) 85 | - Event refactoring (#144 by @ethul) 86 | - Remove children for void DOM elements (#145 and #146 by @ethul) 87 | - Updated for PureScript 0.12, including the Context API, and unsafe createElement variants (#149 by @natefaubion) 88 | 89 | New features: 90 | 91 | - Added `onError` (#133 by @safareli) 92 | 93 | ## [v5.1.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v5.1.0) - 2017-12-16 94 | 95 | New features: 96 | 97 | - Added value array for multiselect (#130 by @tellnobody1) 98 | 99 | ## [v5.0.1](https://github.com/purescript-contrib/purescript-react/releases/tag/v5.0.1) - 2017-11-21 100 | 101 | Bugfixes: 102 | 103 | - `writeRef` writes directly to `this` (#125) 104 | 105 | ## [v5.0.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v5.0.0) - 2017-11-02 106 | 107 | Breaking changes: 108 | 109 | - React 16 (#109 by @coot) 110 | - Fixed event type functions (#121 by @spicydonuts) 111 | 112 | ## [v4.4.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v4.4.0) - 2017-10-11 113 | 114 | New features: 115 | 116 | - Support refs(#100 by @coot) 117 | 118 | ## [v4.3.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v4.3.0) - 2017-09-06 119 | 120 | New features: 121 | 122 | - Add common SVG elements (#114 by @evenchange4) 123 | 124 | Other improvements: 125 | 126 | - Updated maintainers (#115 by @paf31) 127 | 128 | ## [v4.2.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v4.2.0) - 2017-08-29 129 | 130 | New features: 131 | 132 | - Added SVG element `foreignObject` (#112 by @paulyoung) 133 | - Added SVG attributes `x` and `y` (#113 by @paulyoung) 134 | 135 | Bugfixes: 136 | 137 | - Update badge version in README (#110 by @coot) 138 | - Correct documentation link (#111 by @nwolverson) 139 | 140 | ## [v4.1.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v4.1.0) - 2017-08-10 141 | 142 | New features: 143 | 144 | - Force update (#103 by @coot) 145 | - Export `childrenToArray` (#107 by @coot) 146 | 147 | ## [v4.0.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v4.0.0) - 2017-06-27 148 | 149 | - Updated for React 15 (@coot) 150 | 151 | ## [v3.0.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v3.0.0) - 2017-03-29 152 | 153 | - Updated for PureScript 0.11.1. 154 | 155 | ## [v1.3.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v1.3.0) - 2016-09-17 156 | 157 | - Added simpler props-free versions of SVG functions (@joshuahhh) 158 | 159 | ## [v1.2.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v1.2.0) - 2016-09-11 160 | 161 | - Added `preventDefault` and `stopPropagation` (@teh). 162 | 163 | ## [v1.1.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v1.1.0) - 2016-06-12 164 | 165 | - Added a variant of `writeState` with a callback (@pkamenarsky) 166 | 167 | ## [v1.0.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v1.0.0) - 2016-06-11 168 | 169 | - Updates for 1.0 core libraries and 0.9.1 compiler. This library will not work with compiler versions < 0.9.1. (@spicydonuts) 170 | 171 | ## [v0.7.1](https://github.com/purescript-contrib/purescript-react/releases/tag/v0.7.1) - 2016-03-14 172 | 173 | Bugfixes 174 | 175 | - Fixed `aria` and `data` props (#70) 176 | 177 | ## [v0.7.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v0.7.0) - 2016-02-29 178 | 179 | New features: 180 | 181 | - Fix transform state (#62 by @spencerjanssen) 182 | - Stateless components with children (#63 by @ethul) 183 | 184 | ## [v0.6.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v0.6.0) - 2016-01-25 185 | 186 | New features: 187 | 188 | - Added support for dynamic children (#54) 189 | - Updated bindings for React 0.14 (#56) 190 | 191 | Breaking changes: 192 | 193 | - The `react` library is now explicitly required in the FFI code. `purescript-react` no longer assumes that `React` is globally available. Also, with the support for 0.14 bindings of React, the DOM bindings have been split out into a separate repository [purescript-react-dom](https://github.com/purescript-contrib/purescript-react-dom). 194 | 195 | ## [v0.5.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v0.5.0) - 2015-11-19 196 | 197 | - Simplified effect types for read/write access. 198 | 199 | ## [v0.4.3](https://github.com/purescript-contrib/purescript-react/releases/tag/v0.4.3) - 2015-10-18 200 | 201 | - Added `GetInitialState` argument in `spec'` (@ethul) 202 | 203 | ## [v0.4.2](https://github.com/purescript-contrib/purescript-react/releases/tag/v0.4.2) - 2015-10-01 204 | 205 | - Fixed inline styling error (@robkuz) 206 | 207 | ## [v0.4.1](https://github.com/purescript-contrib/purescript-react/releases/tag/v0.4.1) - 2015-09-24 208 | 209 | - Fixed a bug in `getChildren` (@ethul) 210 | 211 | ## [v0.4.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v0.4.0) - 2015-09-04 212 | 213 | - Added state and props to `ReactThis` (@ethul) 214 | 215 | ## [v0.3.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v0.3.0) - 2015-09-01 216 | 217 | - Updated to support React 0.13.\* (@ethul) 218 | 219 | ## [v0.2.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v0.2.0) - 2015-08-31 220 | 221 | - Added additional arguments to lifecycle methods (@ethul) 222 | 223 | ## [v0.1.2](https://github.com/purescript-contrib/purescript-react/releases/tag/v0.1.2) - 2015-08-12 224 | 225 | - Added `displayName` (@ethul) 226 | 227 | ## [v0.1.1](https://github.com/purescript-contrib/purescript-react/releases/tag/v0.1.1) - 2015-07-29 228 | 229 | - Fixed `bower.json` file. 230 | 231 | ## [v0.1.0](https://github.com/purescript-contrib/purescript-react/releases/tag/v0.1.0) - 2015-07-02 232 | 233 | Initial release. 234 | 235 | This release works with versions 0.7.\* of the PureScript compiler. It will not work with older versions. If you are using an older version, you should require an older, compatible version of this library. 236 | 237 | - Broke up `React.DOM` module 238 | - Made `this` reference explicit 239 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # Contributing to React 2 | 3 | Thanks for your interest in contributing to `react`! We welcome new contributions regardless of your level of experience or familiarity with PureScript. 4 | 5 | Every library in the Contributors organization shares a simple handbook that helps new contributors get started. With that in mind, please [read the short contributing guide on purescript-contrib/governance](https://github.com/purescript-contrib/governance/blob/main/contributing.md) before contributing to this library. 6 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2014-2017 various contributors 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # React 2 | 3 | [![CI](https://github.com/purescript-contrib/purescript-react/workflows/CI/badge.svg?branch=main)](https://github.com/purescript-contrib/purescript-react/actions?query=workflow%3ACI+branch%3Amain) 4 | [![Release](https://img.shields.io/github/release/purescript-contrib/purescript-react.svg)](https://github.com/purescript-contrib/purescript-react/releases) 5 | [![Pursuit](https://pursuit.purescript.org/packages/purescript-react/badge)](https://pursuit.purescript.org/packages/purescript-react) 6 | [![Maintainer: ethul](https://img.shields.io/badge/maintainer-ethul-teal.svg)](https://github.com/ethul) 7 | 8 | Low-level React bindings for PureScript. For a higher-level library for working with React, please see [`react-basic`](https://github.com/lumihq/purescript-react-basic) repository (which includes a package for working with React Hooks). 9 | 10 | You may also be interested in the low-level [React DOM bindings](https://github.com/purescript-contrib/purescript-react-dom). 11 | 12 | ## Installation 13 | 14 | Install `react` with [Spago](https://github.com/purescript/spago): 15 | 16 | ```sh 17 | spago install react 18 | ``` 19 | 20 | This library requires the `react` module. This dependency may be satisfied by installing the NPM [react package](https://www.npmjs.com/package/react). 21 | 22 | ``` 23 | npm install react 24 | ``` 25 | 26 | ## Quick start 27 | 28 | The quick start hasn't been written yet (contributions are welcome!). The quick start covers a common, minimal use case for the library, whereas longer examples and tutorials are kept in the [docs directory](./docs). 29 | 30 | ## Documentation 31 | 32 | `react` documentation is stored in a few places: 33 | 34 | 1. Module documentation is [published on Pursuit](https://pursuit.purescript.org/packages/purescript-react). 35 | 2. Written documentation is kept in the [docs directory](./docs). 36 | 3. The [react-example](https://github.com/ethul/purescript-react-example) repository demonstrates these bindings in action. 37 | 38 | If you get stuck, there are several ways to get help: 39 | 40 | - [Open an issue](https://github.com/purescript-contrib/purescript-react/issues) if you have encountered a bug or problem. 41 | - Ask general questions on the [PureScript Discourse](https://discourse.purescript.org) forum or the [PureScript Discord](https://purescript.org/chat) chat. 42 | 43 | ## Contributing 44 | 45 | You can contribute to `react` in several ways: 46 | 47 | 1. If you encounter a problem or have a question, please [open an issue](https://github.com/purescript-contrib/purescript-react/issues). We'll do our best to work with you to resolve or answer it. 48 | 49 | 2. If you would like to contribute code, tests, or documentation, please [read the contributor guide](./CONTRIBUTING.md). It's a short, helpful introduction to contributing to this library, including development instructions. 50 | 51 | 3. If you have written a library, tutorial, guide, or other resource based on this package, please share it on the [PureScript Discourse](https://discourse.purescript.org)! Writing libraries and learning resources are a great way to help this library succeed. 52 | -------------------------------------------------------------------------------- /bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "purescript-react", 3 | "homepage": "https://github.com/purescript-contrib/purescript-react", 4 | "description": "PureScript bindings for react", 5 | "main": "", 6 | "keywords": [ 7 | "purescript", 8 | "react" 9 | ], 10 | "license": "MIT", 11 | "ignore": [ 12 | "*", 13 | "!src/**/*" 14 | ], 15 | "repository": { 16 | "type": "git", 17 | "url": "https://github.com/purescript-contrib/purescript-react.git" 18 | }, 19 | "dependencies": { 20 | "purescript-effect": "^4.0.0", 21 | "purescript-exceptions": "^6.0.0", 22 | "purescript-maybe": "^6.0.0", 23 | "purescript-nullable": "^6.0.0", 24 | "purescript-prelude": "^6.0.0", 25 | "purescript-typelevel-prelude": "^7.0.0", 26 | "purescript-unsafe-coerce": "^6.0.0" 27 | }, 28 | "devDependencies": { 29 | "purescript-console": "^6.0.0" 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /docs/README.md: -------------------------------------------------------------------------------- 1 | # React Documentation 2 | 3 | This directory contains documentation for `react`. If you are interested in contributing new documentation, please read the [contributor guidelines](../CONTRIBUTING.md) and [What Nobody Tells You About Documentation](https://documentation.divio.com) for help getting started. 4 | 5 | ## Frequently Asked Questions 6 | 7 | ### How to use JavaScript components? 8 | 9 | To use a React component that is published as a JavaScript module, one 10 | can leverage PureScript's FFI to define a type for the component and its 11 | props. Consider the following example. 12 | 13 | ```purescript 14 | module Clock (clockComponent) where 15 | 16 | import React (ReactClass, SyntheticEventHandler, Children) 17 | import React.SyntheticEvent (SyntheticEvent) 18 | 19 | foreign import clockComponent 20 | :: ReactClass 21 | { children :: Children 22 | , format :: String 23 | , className :: String 24 | , onTick :: SyntheticEventHandler SyntheticEvent 25 | } 26 | ``` 27 | 28 | Rendering the `clockComponent` can be done as follows. 29 | 30 | ```purescript 31 | module Component where 32 | 33 | import Prelude 34 | 35 | import Effect.Uncurried (mkEffectFn1) 36 | 37 | import React as React 38 | import React.SyntheticEvent as Event 39 | 40 | import Clock as Clock 41 | 42 | clock :: React.ReactElement 43 | clock = 44 | React.createElement Clock.clockComponent 45 | { format: "HH:mm:ss" 46 | , className: "test-class-name" 47 | , onTick: mkEffectFn1 $ \event -> do 48 | Event.preventDefault event 49 | -- etc. 50 | pure unit 51 | } [] 52 | ``` 53 | 54 | A consideration when defining a type for an external component is that 55 | some components pass their props through to a DOM element. In a case 56 | such as this, it can be helpful to leverage the props defined in the 57 | `React.DOM.Props` module. One way to accomplish this is to define the 58 | external component as follows. 59 | 60 | ```purescript 61 | module Clock 62 | ( clockComponent 63 | , format 64 | , onTick 65 | ) where 66 | 67 | import Prelude 68 | 69 | import Effect (Effect) 70 | import Effect.Uncurried (mkEffectFn1) 71 | 72 | import React (ReactClass, ReactElement, Children, createElement) 73 | import React.SyntheticEvent (SyntheticEvent) 74 | import React.DOM.Props (Props, unsafeFromPropsArray, unsafeMkProps) 75 | 76 | clockComponent :: Array Props -> Array ReactElement -> ReactElement 77 | clockComponent props children = createElement clockComponent_ (unsafeFromPropsArray props :: {}) children 78 | 79 | format :: String -> Props 80 | format = unsafeMkProps "format" 81 | 82 | onTick :: (SyntheticEvent -> Effect Unit) -> Props 83 | onTick k = unsafeMkProps "onTick" (mkEffectFn1 k) 84 | 85 | foreign import clockComponent_ 86 | :: ReactClass 87 | { children :: Children 88 | } 89 | ``` 90 | 91 | Rendering the `clockComponent` can be done as follows. 92 | 93 | ```purescript 94 | module Component where 95 | 96 | import Prelude 97 | 98 | import React as React 99 | import React.SyntheticEvent as Event 100 | import React.DOM.Props as Props 101 | 102 | import Clock as Clock 103 | 104 | clock :: React.ReactElement 105 | clock = 106 | Clock.clockComponent 107 | [ Clock.format "HH:mm:ss" 108 | , Clock.onTick $ \event -> do 109 | Event.preventDefault event 110 | -- etc. 111 | pure unit 112 | , Props.className "test-class-name" 113 | , Props.style 114 | { fontWeight: "bold" 115 | , color: "blue" 116 | } 117 | -- additional Props.* 118 | ] [] 119 | ``` 120 | 121 | ### Components with type class constraints re-mount on every render? 122 | 123 | Consider the following example where an ordered list component is 124 | defined for any item of type `a`, where `a` is constrained to have an 125 | `Ord` type class instance. 126 | 127 | ```purescript 128 | module OrderedList where 129 | 130 | import Prelude 131 | 132 | import Data.Array (sort) 133 | 134 | import React as React 135 | import React.DOM as DOM 136 | import Debug.Trace as Trace 137 | 138 | type OrderedListProps a 139 | = { items :: Array a 140 | , renderItem :: a -> React.ReactElement 141 | } 142 | 143 | orderedList :: forall a. Ord a => React.ReactClass (OrderedListProps a) 144 | orderedList = React.component "OrderedList" component 145 | where 146 | component this = 147 | pure { state: {} 148 | , componentDidMount: do 149 | _ <- pure $ Trace.spy "OrderedList.componentDidMount" 150 | pure unit 151 | , render: render <$> React.getProps this 152 | } 153 | where 154 | render 155 | { items 156 | , renderItem 157 | } = 158 | DOM.ol [ ] $ 159 | renderItem' <$> sort items 160 | where 161 | renderItem' a = 162 | DOM.li 163 | [ ] 164 | [ renderItem a ] 165 | 166 | -- This would be defined where the type parameter `a` is known. 167 | 168 | orderedListInt :: React.ReactClass (OrderedListProps Int) 169 | orderedListInt = orderedList 170 | ``` 171 | 172 | If the component `orderedList` above were to be rendered, the debugging 173 | statement `OrderedList.componentDidMount` is printed to the console each 174 | time the parent component is rendered. The reason for this is due to how 175 | the `orderedList` component is compiled to JavaScript. 176 | 177 | ```javascript 178 | var orderedList = function (dictOrd) { 179 | var component = function ($$this) { 180 | // ... 181 | }; 182 | return React.component(React.reactComponentSpec()())("OrderedList")(component); 183 | }; 184 | ``` 185 | 186 | Above, the component creation is wrapped by the function with the 187 | `dictOrd` parameter. This means that a new component is being created on 188 | each render of the component using `orderedList`. This may not be ideal 189 | in all cases; e.g., if `orderedList` had needed to store state. 190 | 191 | To avoid `orderedList` from being recreated each time, a function can be 192 | defined that specifies the type parameter with the type class contraint. 193 | If the component using the ordered list knows that the items are of type 194 | `Int`, the component can define `orderedListInt` as shown above, and use 195 | it to render the ordered list instead of `orderedList`. 196 | 197 | 198 | ### Understanding `Children` 199 | 200 | In React, we see the `children` prop type from time to time, especially 201 | when using `createElement`. This is an opaque data type, in which we can 202 | coerce into an `Array`, but we cannot create. Usually, when you see a 203 | `ReactClass` that features a `children :: Children` prop type, this 204 | means that the component itself expects children to be supplied as an 205 | argument to `createElement`, in the form of an `Array ReactElement`. 206 | 207 | However, in some circumstances (like a `ContextConsumer`), the `children` 208 | prop type might look different, like `children :: a -> ReactElement`. 209 | In this case, it would be better to use `createLeafElement`, to supply 210 | the children _directly through the props_, rather than as a separate 211 | argument. 212 | 213 | This also means that any leaf-like components should _not_ define a 214 | `children :: Children` prop - this prop should be treated as the 215 | _expectation_ of a children argument. In the clock example above, a 216 | more proper specification might look like the following: 217 | 218 | ```purescript 219 | module Clock (clockComponent) where 220 | 221 | import React (ReactClass, SyntheticEventHandler) 222 | import React.SyntheticEvent (SyntheticEvent) 223 | 224 | foreign import clockComponent 225 | :: ReactClass 226 | { format :: String 227 | , className :: String 228 | , onTick :: SyntheticEventHandler SyntheticEvent 229 | } 230 | ``` 231 | 232 | ```purescript 233 | module Component where 234 | 235 | import Prelude 236 | 237 | import Effect.Uncurried (mkEffectFn1) 238 | 239 | import React as React 240 | import React.SyntheticEvent as Event 241 | 242 | import Clock as Clock 243 | 244 | clock :: React.ReactElement 245 | clock = 246 | React.createLeafElement Clock.clockComponent 247 | { format: "HH:mm:ss" 248 | , className: "test-class-name" 249 | , onTick: mkEffectFn1 $ \event -> do 250 | Event.preventDefault event 251 | -- etc. 252 | pure unit 253 | } 254 | ``` -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "scripts": { 4 | "build": "spago build --purs-args '--censor-lib --strict'", 5 | "test": "spago test --no-install" 6 | }, 7 | "devDependencies": { 8 | "eslint": "^7.10.0", 9 | "purescript-psa": "^0.8.2" 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /packages.dhall: -------------------------------------------------------------------------------- 1 | let upstream = 2 | https://github.com/purescript/package-sets/releases/download/psc-0.15.4-20221208/packages.dhall 3 | sha256:e3549e48d0170e14838d8f0c44172253947dcb6117b51a763f33dca34f00ba43 4 | 5 | in upstream 6 | -------------------------------------------------------------------------------- /spago.dhall: -------------------------------------------------------------------------------- 1 | { name = "react" 2 | , dependencies = 3 | [ "console" 4 | , "effect" 5 | , "exceptions" 6 | , "maybe" 7 | , "nullable" 8 | , "prelude" 9 | , "typelevel-prelude" 10 | , "unsafe-coerce" 11 | ] 12 | , packages = ./packages.dhall 13 | , sources = [ "src/**/*.purs", "test/**/*.purs" ] 14 | } 15 | -------------------------------------------------------------------------------- /src/React.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | function createClass(baseClass) { 4 | function invoke1(f) { 5 | return f === undefined ? f : function (a) { 6 | return f(a)() 7 | } 8 | } 9 | function invoke2(f) { 10 | return f === undefined ? f : function (a, b) { 11 | return f(a)(b)() 12 | } 13 | } 14 | function invoke3(f) { 15 | return f === undefined ? f : function (a, b, c) { 16 | return f(a)(b)(c)() 17 | } 18 | } 19 | 20 | return function (displayName) { 21 | return function (ctrFn) { 22 | var Constructor = function (props) { 23 | baseClass.call(this, props); 24 | var spec = ctrFn(this)(); 25 | 26 | this.state = spec.state; 27 | this.render = spec.render; 28 | this.componentDidMount = spec.componentDidMount; 29 | this.componentWillUnmount = spec.componentWillUnmount; 30 | this.componentDidCatch = invoke2(spec.componentDidCatch); 31 | this.componentWillUpdate = invoke2(spec.componentWillUpdate); 32 | this.shouldComponentUpdate = invoke2(spec.shouldComponentUpdate); 33 | this.getSnapshotBeforeUpdate = invoke2(spec.getSnapshotBeforeUpdate); 34 | this.componentDidUpdate = invoke3(spec.componentDidUpdate); 35 | this.UNSAFE_componentWillMount = spec.unsafeComponentWillMount; 36 | this.UNSAFE_componentWillReceiveProps = invoke1(spec.unsafeComponentWillReceiveProps); 37 | this.UNSAFE_componentWillUpdate = invoke2(spec.unsafeComponentWillUpdate); 38 | }; 39 | 40 | Constructor.displayName = displayName; 41 | Constructor.prototype = Object.create(baseClass.prototype); 42 | Constructor.prototype.constructor = Constructor; 43 | 44 | return Constructor; 45 | }; 46 | }; 47 | } 48 | 49 | var componentImpl = createClass(React.Component); 50 | export {componentImpl}; 51 | 52 | // eslint-disable-next-line no-unused-vars 53 | function createClassWithDerivedState(classCtr) { 54 | return function(displayName) { 55 | return function(getDerivedStateFromProps) { 56 | return function(ctrFn) { 57 | var Constructor = componentImpl(displayName)(ctrFn); 58 | Constructor.getDerivedStateFromProps = function(a, b) { return getDerivedStateFromProps(a)(b); }; 59 | return Constructor; 60 | }; 61 | }; 62 | }; 63 | } 64 | 65 | export const componentWithDerivedStateImpl = createClassWithDerivedState(componentImpl); 66 | 67 | var pureComponentImpl = createClass(React.PureComponent); 68 | export {pureComponentImpl}; 69 | export const pureComponentWithDerivedStateImpl = createClassWithDerivedState(pureComponentImpl); 70 | export function statelessComponent(x) { return x; } 71 | export const fragment = React.Fragment; 72 | 73 | function getProps(this_) { 74 | return function(){ 75 | return this_.props; 76 | }; 77 | } 78 | export {getProps}; 79 | export const childrenToArray = React.Children.toArray; 80 | export const childrenCount = React.Children.count; 81 | 82 | function setStateImpl(this_) { 83 | return function(state){ 84 | return function(){ 85 | this_.setState(state); 86 | }; 87 | }; 88 | } 89 | export {setStateImpl}; 90 | 91 | function setStateWithCallbackImpl(this_) { 92 | return function(state){ 93 | return function(cb){ 94 | return function() { 95 | this_.setState(state, cb); 96 | }; 97 | }; 98 | }; 99 | } 100 | export {setStateWithCallbackImpl}; 101 | 102 | function getState(this_) { 103 | return function(){ 104 | if (!this_.state) { 105 | throw new Error("[purescript-react] Cannot get state within constructor"); 106 | } 107 | return this_.state; 108 | }; 109 | } 110 | export {getState}; 111 | 112 | function forceUpdateWithCallback(this_) { 113 | return function(cb) { 114 | return function() { 115 | this_.forceUpdate(cb); 116 | }; 117 | }; 118 | } 119 | export {forceUpdateWithCallback}; 120 | 121 | function createElement(class_) { 122 | return function(props){ 123 | return function(children){ 124 | return React.createElement.apply(React, [class_, props].concat(children)); 125 | }; 126 | }; 127 | } 128 | export {createElement as createElementImpl}; 129 | export {createElement as createElementTagName}; 130 | 131 | function createLeafElement(class_) { 132 | return function(props) { 133 | return React.createElement(class_, props); 134 | }; 135 | } 136 | export {createLeafElement as createLeafElementImpl}; 137 | 138 | function createElementDynamic(class_) { 139 | return function(props) { 140 | return function(children){ 141 | return React.createElement(class_, props, children); 142 | }; 143 | }; 144 | } 145 | export {createElementDynamic as createElementDynamicImpl}; 146 | export {createElementDynamic as createElementTagNameDynamic}; 147 | 148 | function createContext(defaultValue) { 149 | var context = React.createContext(defaultValue); 150 | return { 151 | consumer: context.Consumer, 152 | provider: context.Provider 153 | }; 154 | } 155 | export {createContext}; 156 | 157 | export var emptyReactElement = null; 158 | 159 | function isEmptyReactElement(a) { 160 | return a === emptyReactElement; 161 | }; 162 | 163 | export {isEmptyReactElement}; 164 | -------------------------------------------------------------------------------- /src/React.purs: -------------------------------------------------------------------------------- 1 | -- | This module defines foreign types and functions which wrap React's functionality. 2 | 3 | module React 4 | ( TagName 5 | , ReactElement 6 | , ReactComponent 7 | , ReactThis 8 | , ReactUnusedSnapshot 9 | , SyntheticEventHandler 10 | , Render 11 | , ComponentWillMount 12 | , ComponentDidMount 13 | , ComponentDidCatch 14 | , ComponentWillReceiveProps 15 | , ShouldComponentUpdate 16 | , ComponentWillUpdate 17 | , ComponentDidUpdate 18 | , GetSnapshotBeforeUpdate 19 | , ComponentWillUnmount 20 | , ReactSpecRequired 21 | , ReactSpecUnsafe 22 | , ReactSpecOptional 23 | , ReactSpecShouldComponentUpdate 24 | , ReactSpecAll 25 | , ReactSpecPure 26 | , ReactClassConstructor 27 | , class ReactComponentSpec 28 | , class ReactPureComponentSpec 29 | , component 30 | , componentWithDerivedState 31 | , pureComponent 32 | , pureComponentWithDerivedState 33 | , statelessComponent 34 | , ReactClass 35 | , getProps 36 | , getState 37 | , setState 38 | , setStateWithCallback 39 | , writeState 40 | , writeStateWithCallback 41 | , modifyState 42 | , modifyStateWithCallback 43 | , forceUpdate 44 | , forceUpdateWithCallback 45 | , class ReactPropFields 46 | , ReservedReactPropFields 47 | , createElement 48 | , unsafeCreateElement 49 | , createElementDynamic 50 | , unsafeCreateElementDynamic 51 | , createLeafElement 52 | , unsafeCreateLeafElement 53 | , createElementTagName 54 | , createElementTagNameDynamic 55 | , Children 56 | , childrenToArray 57 | , childrenCount 58 | , class IsReactElement 59 | , toElement 60 | , fragment 61 | , fragmentWithKey 62 | , Context 63 | , ContextProvider 64 | , ContextConsumer 65 | , createContext 66 | ) where 67 | 68 | import Prelude 69 | 70 | import Effect (Effect) 71 | import Effect.Exception (Error) 72 | import Effect.Uncurried (EffectFn1) 73 | import Prim.Row as Row 74 | import React.Ref as Ref 75 | import Type.Row (type (+)) 76 | import Unsafe.Coerce (unsafeCoerce) 77 | 78 | -- | Name of a tag. 79 | type TagName = String 80 | 81 | -- | A virtual DOM node, or component. 82 | foreign import data ReactElement :: Type 83 | 84 | foreign import emptyReactElement :: ReactElement 85 | 86 | foreign import isEmptyReactElement :: ReactElement -> Boolean 87 | 88 | instance semigroupReactElement :: Semigroup ReactElement where 89 | append a b 90 | | isEmptyReactElement a = b 91 | | isEmptyReactElement b = a 92 | | otherwise = toElement [ a, b ] 93 | 94 | instance monoidReactElement :: Monoid ReactElement where 95 | mempty = emptyReactElement 96 | 97 | -- | A mounted react component 98 | foreign import data ReactComponent :: Type 99 | 100 | -- | A reference to a component, essentially React's `this`. 101 | foreign import data ReactThis :: Type -> Type -> Type 102 | 103 | type role ReactThis representational representational 104 | 105 | foreign import data ReactUnusedSnapshot :: Type 106 | 107 | type SyntheticEventHandler event = EffectFn1 event Unit 108 | 109 | -- | A render effect. 110 | type Render = Effect ReactElement 111 | 112 | -- | A component will mount effect. 113 | type ComponentWillMount = Effect Unit 114 | 115 | -- | A component did mount effect. 116 | type ComponentDidMount = Effect Unit 117 | 118 | -- | A component did catch effect. 119 | type ComponentDidCatch = Error -> { componentStack :: String } -> Effect Unit 120 | 121 | -- | A component will receive props function. 122 | type ComponentWillReceiveProps props = props -> Effect Unit 123 | 124 | -- | A should component update function. 125 | type ShouldComponentUpdate props state = props -> state -> Effect Boolean 126 | 127 | -- | A component will update function. 128 | type ComponentWillUpdate props state = props -> state -> Effect Unit 129 | 130 | -- | A component did update function. 131 | type ComponentDidUpdate props state snapshot = props -> state -> snapshot -> Effect Unit 132 | 133 | type GetSnapshotBeforeUpdate props state snapshot = props -> state -> Effect snapshot 134 | 135 | -- | A component will unmount effect. 136 | type ComponentWillUnmount = Effect Unit 137 | 138 | -- | Required fields for constructing a ReactClass. 139 | type ReactSpecRequired state r = 140 | ( state :: state 141 | , render :: Render 142 | | r 143 | ) 144 | 145 | type ReactSpecUnsafe props state r = 146 | ( unsafeComponentWillMount :: ComponentWillMount 147 | , unsafeComponentWillReceiveProps :: ComponentWillReceiveProps props 148 | , unsafeComponentWillUpdate :: ComponentWillUpdate props state 149 | | r 150 | ) 151 | 152 | -- | Optional fields for constructing a ReactClass. 153 | type ReactSpecOptional props state snapshot r = 154 | ( componentDidMount :: ComponentDidMount 155 | , componentDidCatch :: ComponentDidCatch 156 | , componentWillUnmount :: ComponentWillUnmount 157 | , componentDidUpdate :: ComponentDidUpdate props state snapshot 158 | , getSnapshotBeforeUpdate :: GetSnapshotBeforeUpdate props state snapshot 159 | | ReactSpecUnsafe props state r 160 | ) 161 | 162 | type ReactSpecShouldComponentUpdate props state = 163 | ( shouldComponentUpdate :: ShouldComponentUpdate props state 164 | ) 165 | 166 | type ReactSpecAll props state snapshot = 167 | ReactSpecRequired state 168 | + ReactSpecOptional props state snapshot 169 | + ReactSpecShouldComponentUpdate props state 170 | 171 | type ReactSpecPure props state snapshot = 172 | ReactSpecRequired state 173 | + ReactSpecOptional props state snapshot () 174 | 175 | -- | The signature for a ReactClass constructor. A constructor takes the 176 | -- | `ReactThis` context and returns a record with appropriate lifecycle 177 | -- | methods. 178 | type ReactClassConstructor props state r = ReactThis props state -> Effect (Record r) 179 | 180 | class ReactComponentSpec :: Type -> Type -> Type -> Row Type -> Row Type -> Constraint 181 | class ReactComponentSpec props state snapshot (given :: Row Type) (spec :: Row Type) 182 | 183 | instance reactComponentSpec :: 184 | ( Row.Union given (ReactSpecAll props state ReactUnusedSnapshot) spec 185 | , Row.Nub spec (ReactSpecAll props state snapshot) 186 | ) => 187 | ReactComponentSpec props state snapshot given spec 188 | 189 | class ReactPureComponentSpec :: Type -> Type -> Type -> Row Type -> Row Type -> Constraint 190 | class ReactPureComponentSpec props state snapshot (given :: Row Type) (spec :: Row Type) 191 | 192 | instance reactPureComponentSpec :: 193 | ( Row.Union given (ReactSpecPure props state ReactUnusedSnapshot) spec 194 | , Row.Nub spec (ReactSpecPure props state snapshot) 195 | ) => 196 | ReactPureComponentSpec props state snapshot given spec 197 | 198 | -- | Creates a `ReactClass` inherited from `React.Component`. 199 | component 200 | :: forall props state snapshot given spec 201 | . ReactComponentSpec (Record props) (Record state) snapshot given spec 202 | => String 203 | -> ReactClassConstructor (Record props) (Record state) given 204 | -> ReactClass (Record props) 205 | component = componentImpl 206 | 207 | -- | Like `component`, but takes a `getDerivedStateFromProps` handler. 208 | componentWithDerivedState 209 | :: forall props state snapshot given spec 210 | . ReactComponentSpec (Record props) (Record state) snapshot given spec 211 | => String 212 | -> (Record props -> Record state -> Record state) 213 | -> ReactClassConstructor (Record props) (Record state) given 214 | -> ReactClass (Record props) 215 | componentWithDerivedState = componentWithDerivedStateImpl 216 | 217 | -- | Creates a `ReactClass` inherited from `React.PureComponent`. 218 | pureComponent 219 | :: forall props state snapshot given spec 220 | . ReactPureComponentSpec (Record props) (Record state) snapshot given spec 221 | => String 222 | -> ReactClassConstructor (Record props) (Record state) given 223 | -> ReactClass (Record props) 224 | pureComponent = pureComponentImpl 225 | 226 | -- | Like `pureComponent`, but takes a `getDerivedStateFromProps` handler. 227 | pureComponentWithDerivedState 228 | :: forall props state snapshot given spec 229 | . ReactPureComponentSpec (Record props) (Record state) snapshot given spec 230 | => String 231 | -> (Record props -> Record state -> Record state) 232 | -> ReactClassConstructor (Record props) (Record state) given 233 | -> ReactClass (Record props) 234 | pureComponentWithDerivedState = componentWithDerivedStateImpl 235 | 236 | foreign import componentImpl 237 | :: forall this props r 238 | . String 239 | -> (this -> Effect r) 240 | -> ReactClass props 241 | 242 | foreign import componentWithDerivedStateImpl 243 | :: forall this props state r 244 | . String 245 | -> (props -> state -> state) 246 | -> (this -> Effect r) 247 | -> ReactClass props 248 | 249 | foreign import pureComponentImpl 250 | :: forall this props r 251 | . String 252 | -> (this -> Effect r) 253 | -> ReactClass props 254 | 255 | foreign import pureComponentWithDerivedStateImpl 256 | :: forall this props state r 257 | . String 258 | -> (props -> state -> state) 259 | -> (this -> Effect r) 260 | -> ReactClass props 261 | 262 | foreign import statelessComponent 263 | :: forall props 264 | . (Record props -> ReactElement) 265 | -> ReactClass (Record props) 266 | 267 | -- | React class for components. 268 | foreign import data ReactClass :: Type -> Type 269 | 270 | type role ReactClass representational 271 | 272 | foreign import fragment :: ReactClass { children :: Children } 273 | 274 | -- | Read the component props. 275 | foreign import getProps 276 | :: forall props state 277 | . ReactThis props state 278 | -> Effect props 279 | 280 | foreign import setStateImpl 281 | :: forall props state update 282 | . ReactThis props state 283 | -> update 284 | -> Effect Unit 285 | 286 | foreign import setStateWithCallbackImpl 287 | :: forall props state update 288 | . ReactThis props state 289 | -> update 290 | -> Effect Unit 291 | -> Effect Unit 292 | 293 | -- | Get the component state. 294 | foreign import getState 295 | :: forall props state 296 | . ReactThis props state 297 | -> Effect state 298 | 299 | -- | Update component state given some sub-set of state properties. 300 | setState 301 | :: forall props given rest all 302 | . Row.Union given rest all 303 | => ReactThis props (Record all) 304 | -> Record given 305 | -> Effect Unit 306 | setState = setStateImpl 307 | 308 | -- | Update component state given some sub-set of state properties, while 309 | -- | also invoking a callback when applied. 310 | setStateWithCallback 311 | :: forall props given rest all 312 | . Row.Union given rest all 313 | => ReactThis props (Record all) 314 | -> Record given 315 | -> Effect Unit 316 | -> Effect Unit 317 | setStateWithCallback = setStateWithCallbackImpl 318 | 319 | -- | Update component state. 320 | writeState 321 | :: forall props all 322 | . ReactThis props (Record all) 323 | -> Record all 324 | -> Effect Unit 325 | writeState = setStateImpl 326 | 327 | -- | Update component state, while also invoking a callback when applied. 328 | writeStateWithCallback 329 | :: forall props all 330 | . ReactThis props (Record all) 331 | -> Record all 332 | -> Effect Unit 333 | -> Effect Unit 334 | writeStateWithCallback = setStateWithCallbackImpl 335 | 336 | -- | Update component state given a modification function. 337 | modifyState 338 | :: forall props state 339 | . ReactThis props state 340 | -> (state -> state) 341 | -> Effect Unit 342 | modifyState = setStateImpl 343 | 344 | -- | Update component state given a modification function, while also invoking 345 | -- | a callback when applied. 346 | modifyStateWithCallback 347 | :: forall props state 348 | . ReactThis props state 349 | -> (state -> state) 350 | -> Effect Unit 351 | -> Effect Unit 352 | modifyStateWithCallback = setStateWithCallbackImpl 353 | 354 | -- | Force render of a react component. 355 | forceUpdate :: forall props state. ReactThis props state -> Effect Unit 356 | forceUpdate this = forceUpdateWithCallback this (pure unit) 357 | 358 | -- | Force render and then run an Effect. 359 | foreign import forceUpdateWithCallback 360 | :: forall props state 361 | . ReactThis props state 362 | -> Effect Unit 363 | -> Effect Unit 364 | 365 | class ReactPropFields (required :: Row Type) (given :: Row Type) 366 | 367 | type ReservedReactPropFields r = 368 | ( key :: String 369 | , ref :: Ref.RefHandler Ref.ReactInstance 370 | | r 371 | ) 372 | 373 | instance reactPropFields :: 374 | ( Row.Union given optional (ReservedReactPropFields required) 375 | , Row.Union optional leftover (ReservedReactPropFields ()) 376 | ) => 377 | ReactPropFields required given 378 | 379 | -- | Create an element from a React class spreading the children array. Used when the children are known up front. 380 | createElement 381 | :: forall required given 382 | . ReactPropFields required given 383 | => ReactClass { children :: Children | required } 384 | -> { | given } 385 | -> Array ReactElement 386 | -> ReactElement 387 | createElement = createElementImpl 388 | 389 | -- | An unsafe version of `createElement` which does not enforce the reserved 390 | -- | properties "key" and "ref". 391 | unsafeCreateElement 392 | :: forall props 393 | . ReactClass { children :: Children | props } 394 | -> { | props } 395 | -> Array ReactElement 396 | -> ReactElement 397 | unsafeCreateElement = createElementImpl 398 | 399 | -- | Create an element from a React class passing the children array. Used for a dynamic array of children. 400 | createElementDynamic 401 | :: forall required given 402 | . ReactPropFields required given 403 | => ReactClass { children :: Children | required } 404 | -> { | given } 405 | -> Array ReactElement 406 | -> ReactElement 407 | createElementDynamic = createElementDynamicImpl 408 | 409 | -- | An unsafe version of `createElementDynamic` which does not enforce the reserved 410 | -- | properties "key" and "ref". 411 | unsafeCreateElementDynamic 412 | :: forall props 413 | . ReactClass { children :: Children | props } 414 | -> { | props } 415 | -> Array ReactElement 416 | -> ReactElement 417 | unsafeCreateElementDynamic = createElementDynamicImpl 418 | 419 | foreign import createElementImpl 420 | :: forall required given children 421 | . ReactClass required 422 | -> given 423 | -> Array children 424 | -> ReactElement 425 | 426 | foreign import createElementDynamicImpl 427 | :: forall required given children 428 | . ReactClass required 429 | -> given 430 | -> Array children 431 | -> ReactElement 432 | 433 | -- | Create an element from a React class that does not require children. Additionally it can be used 434 | -- | when the children are represented /only/ through the `children` prop - for instance, a `ContextConsumer` 435 | -- | would be turned into a `ReactElement` with `createLeafElement someContext.consumer { children: \x -> ... }`. 436 | createLeafElement 437 | :: forall required given 438 | . ReactPropFields required given 439 | => ReactClass { | required } 440 | -> { | given } 441 | -> ReactElement 442 | createLeafElement = createLeafElementImpl 443 | 444 | -- | An unsafe version of `createLeafElement` which does not enforce the reserved 445 | -- | properties "key" and "ref". 446 | unsafeCreateLeafElement 447 | :: forall props 448 | . ReactClass props 449 | -> props 450 | -> ReactElement 451 | unsafeCreateLeafElement = createLeafElementImpl 452 | 453 | foreign import createLeafElementImpl 454 | :: forall required given 455 | . ReactClass required 456 | -> given 457 | -> ReactElement 458 | 459 | -- | Create an element from a tag name spreading the children array. Used when the children are known up front. 460 | foreign import createElementTagName 461 | :: forall props 462 | . TagName 463 | -> props 464 | -> Array ReactElement 465 | -> ReactElement 466 | 467 | -- | Create an element from a tag name passing the children array. Used for a dynamic array of children. 468 | foreign import createElementTagNameDynamic 469 | :: forall props 470 | . TagName 471 | -> props 472 | -> Array ReactElement 473 | -> ReactElement 474 | 475 | -- | Internal representation for the children elements passed to a component 476 | foreign import data Children :: Type 477 | 478 | -- | Internal conversion function from children elements to an array of React elements 479 | foreign import childrenToArray :: Children -> Array ReactElement 480 | 481 | -- | Returns the number of children. 482 | foreign import childrenCount :: Children -> Int 483 | 484 | class IsReactElement a where 485 | toElement :: a -> ReactElement 486 | 487 | instance isReactElementString :: IsReactElement String where 488 | toElement = unsafeCoerce 489 | 490 | instance isReactElementNumber :: IsReactElement Number where 491 | toElement = unsafeCoerce 492 | 493 | instance isReactElementInt :: IsReactElement Int where 494 | toElement = unsafeCoerce 495 | 496 | instance isReactElementChildren :: IsReactElement Children where 497 | toElement = unsafeCoerce 498 | 499 | instance isReactElementReactElement :: IsReactElement ReactElement where 500 | toElement = identity 501 | 502 | instance isReactElementArray :: IsReactElement (Array ReactElement) where 503 | toElement = case _ of 504 | [] -> mempty 505 | children -> createElement fragment {} children 506 | 507 | -- | Creates a keyed fragment. 508 | fragmentWithKey :: String -> Array ReactElement -> ReactElement 509 | fragmentWithKey = createElement fragment <<< { key: _ } 510 | 511 | type Context a = 512 | { consumer :: ContextConsumer a 513 | , provider :: ContextProvider a 514 | } 515 | 516 | type ContextProvider a = ReactClass { children :: Children, value :: a } 517 | 518 | type ContextConsumer a = ReactClass { children :: a -> ReactElement } 519 | 520 | -- | Create a new context provider/consumer pair given a default value. 521 | foreign import createContext :: forall a. a -> Context a 522 | -------------------------------------------------------------------------------- /src/React/DOM.purs: -------------------------------------------------------------------------------- 1 | module React.DOM where 2 | 3 | import React (ReactElement, TagName, createElementTagName, createElementTagNameDynamic) 4 | import React.DOM.Props (Props, unsafeFromPropsArray) 5 | import Unsafe.Coerce (unsafeCoerce) 6 | 7 | newtype IsDynamic = IsDynamic Boolean 8 | 9 | mkDOM :: IsDynamic -> TagName -> Array Props -> Array ReactElement -> ReactElement 10 | mkDOM dynamic tag props = createElement tag (unsafeFromPropsArray props) 11 | where 12 | createElement :: TagName -> Array Props -> Array ReactElement -> ReactElement 13 | createElement = 14 | case dynamic of 15 | IsDynamic false -> createElementTagName 16 | IsDynamic true -> createElementTagNameDynamic 17 | 18 | text :: String -> ReactElement 19 | text = unsafeCoerce 20 | 21 | int :: Int -> ReactElement 22 | int = unsafeCoerce 23 | 24 | number :: Number -> ReactElement 25 | number = unsafeCoerce 26 | 27 | a :: Array Props -> Array ReactElement -> ReactElement 28 | a = mkDOM (IsDynamic false) "a" 29 | 30 | a' :: Array ReactElement -> ReactElement 31 | a' = a [] 32 | 33 | abbr :: Array Props -> Array ReactElement -> ReactElement 34 | abbr = mkDOM (IsDynamic false) "abbr" 35 | 36 | abbr' :: Array ReactElement -> ReactElement 37 | abbr' = abbr [] 38 | 39 | address :: Array Props -> Array ReactElement -> ReactElement 40 | address = mkDOM (IsDynamic false) "address" 41 | 42 | address' :: Array ReactElement -> ReactElement 43 | address' = address [] 44 | 45 | area :: Array Props -> ReactElement 46 | area props = mkDOM (IsDynamic false) "area" props [] 47 | 48 | area' :: ReactElement 49 | area' = area [] 50 | 51 | article :: Array Props -> Array ReactElement -> ReactElement 52 | article = mkDOM (IsDynamic false) "article" 53 | 54 | article' :: Array ReactElement -> ReactElement 55 | article' = article [] 56 | 57 | aside :: Array Props -> Array ReactElement -> ReactElement 58 | aside = mkDOM (IsDynamic false) "aside" 59 | 60 | aside' :: Array ReactElement -> ReactElement 61 | aside' = aside [] 62 | 63 | audio :: Array Props -> Array ReactElement -> ReactElement 64 | audio = mkDOM (IsDynamic false) "audio" 65 | 66 | audio' :: Array ReactElement -> ReactElement 67 | audio' = audio [] 68 | 69 | b :: Array Props -> Array ReactElement -> ReactElement 70 | b = mkDOM (IsDynamic false) "b" 71 | 72 | b' :: Array ReactElement -> ReactElement 73 | b' = b [] 74 | 75 | base :: Array Props -> ReactElement 76 | base props = mkDOM (IsDynamic false) "base" props [] 77 | 78 | base' :: ReactElement 79 | base' = base [] 80 | 81 | bdi :: Array Props -> Array ReactElement -> ReactElement 82 | bdi = mkDOM (IsDynamic false) "bdi" 83 | 84 | bdi' :: Array ReactElement -> ReactElement 85 | bdi' = bdi [] 86 | 87 | bdo :: Array Props -> Array ReactElement -> ReactElement 88 | bdo = mkDOM (IsDynamic false) "bdo" 89 | 90 | bdo' :: Array ReactElement -> ReactElement 91 | bdo' = bdo [] 92 | 93 | big :: Array Props -> Array ReactElement -> ReactElement 94 | big = mkDOM (IsDynamic false) "big" 95 | 96 | big' :: Array ReactElement -> ReactElement 97 | big' = big [] 98 | 99 | blockquote :: Array Props -> Array ReactElement -> ReactElement 100 | blockquote = mkDOM (IsDynamic false) "blockquote" 101 | 102 | blockquote' :: Array ReactElement -> ReactElement 103 | blockquote' = blockquote [] 104 | 105 | body :: Array Props -> Array ReactElement -> ReactElement 106 | body = mkDOM (IsDynamic false) "body" 107 | 108 | body' :: Array ReactElement -> ReactElement 109 | body' = body [] 110 | 111 | br :: Array Props -> ReactElement 112 | br props = mkDOM (IsDynamic false) "br" props [] 113 | 114 | br' :: ReactElement 115 | br' = br [] 116 | 117 | button :: Array Props -> Array ReactElement -> ReactElement 118 | button = mkDOM (IsDynamic false) "button" 119 | 120 | button' :: Array ReactElement -> ReactElement 121 | button' = button [] 122 | 123 | canvas :: Array Props -> Array ReactElement -> ReactElement 124 | canvas = mkDOM (IsDynamic false) "canvas" 125 | 126 | canvas' :: Array ReactElement -> ReactElement 127 | canvas' = canvas [] 128 | 129 | caption :: Array Props -> Array ReactElement -> ReactElement 130 | caption = mkDOM (IsDynamic false) "caption" 131 | 132 | caption' :: Array ReactElement -> ReactElement 133 | caption' = caption [] 134 | 135 | cite :: Array Props -> Array ReactElement -> ReactElement 136 | cite = mkDOM (IsDynamic false) "cite" 137 | 138 | cite' :: Array ReactElement -> ReactElement 139 | cite' = cite [] 140 | 141 | code :: Array Props -> Array ReactElement -> ReactElement 142 | code = mkDOM (IsDynamic false) "code" 143 | 144 | code' :: Array ReactElement -> ReactElement 145 | code' = code [] 146 | 147 | col :: Array Props -> ReactElement 148 | col props = mkDOM (IsDynamic false) "col" props [] 149 | 150 | col' :: ReactElement 151 | col' = col [] 152 | 153 | colgroup :: Array Props -> Array ReactElement -> ReactElement 154 | colgroup = mkDOM (IsDynamic false) "colgroup" 155 | 156 | colgroup' :: Array ReactElement -> ReactElement 157 | colgroup' = colgroup [] 158 | 159 | _data :: Array Props -> Array ReactElement -> ReactElement 160 | _data = mkDOM (IsDynamic false) "data" 161 | 162 | _data' :: Array ReactElement -> ReactElement 163 | _data' = _data [] 164 | 165 | datalist :: Array Props -> Array ReactElement -> ReactElement 166 | datalist = mkDOM (IsDynamic false) "datalist" 167 | 168 | datalist' :: Array ReactElement -> ReactElement 169 | datalist' = datalist [] 170 | 171 | dd :: Array Props -> Array ReactElement -> ReactElement 172 | dd = mkDOM (IsDynamic false) "dd" 173 | 174 | dd' :: Array ReactElement -> ReactElement 175 | dd' = dd [] 176 | 177 | del :: Array Props -> Array ReactElement -> ReactElement 178 | del = mkDOM (IsDynamic false) "del" 179 | 180 | del' :: Array ReactElement -> ReactElement 181 | del' = del [] 182 | 183 | details :: Array Props -> Array ReactElement -> ReactElement 184 | details = mkDOM (IsDynamic false) "details" 185 | 186 | details' :: Array ReactElement -> ReactElement 187 | details' = details [] 188 | 189 | dfn :: Array Props -> Array ReactElement -> ReactElement 190 | dfn = mkDOM (IsDynamic false) "dfn" 191 | 192 | dfn' :: Array ReactElement -> ReactElement 193 | dfn' = dfn [] 194 | 195 | dialog :: Array Props -> Array ReactElement -> ReactElement 196 | dialog = mkDOM (IsDynamic false) "dialog" 197 | 198 | dialog' :: Array ReactElement -> ReactElement 199 | dialog' = dialog [] 200 | 201 | div :: Array Props -> Array ReactElement -> ReactElement 202 | div = mkDOM (IsDynamic false) "div" 203 | 204 | div' :: Array ReactElement -> ReactElement 205 | div' = div [] 206 | 207 | dl :: Array Props -> Array ReactElement -> ReactElement 208 | dl = mkDOM (IsDynamic false) "dl" 209 | 210 | dl' :: Array ReactElement -> ReactElement 211 | dl' = dl [] 212 | 213 | dt :: Array Props -> Array ReactElement -> ReactElement 214 | dt = mkDOM (IsDynamic false) "dt" 215 | 216 | dt' :: Array ReactElement -> ReactElement 217 | dt' = dt [] 218 | 219 | em :: Array Props -> Array ReactElement -> ReactElement 220 | em = mkDOM (IsDynamic false) "em" 221 | 222 | em' :: Array ReactElement -> ReactElement 223 | em' = em [] 224 | 225 | embed :: Array Props -> ReactElement 226 | embed props = mkDOM (IsDynamic false) "embed" props [] 227 | 228 | embed' :: ReactElement 229 | embed' = embed [] 230 | 231 | fieldset :: Array Props -> Array ReactElement -> ReactElement 232 | fieldset = mkDOM (IsDynamic false) "fieldset" 233 | 234 | fieldset' :: Array ReactElement -> ReactElement 235 | fieldset' = fieldset [] 236 | 237 | figcaption :: Array Props -> Array ReactElement -> ReactElement 238 | figcaption = mkDOM (IsDynamic false) "figcaption" 239 | 240 | figcaption' :: Array ReactElement -> ReactElement 241 | figcaption' = figcaption [] 242 | 243 | figure :: Array Props -> Array ReactElement -> ReactElement 244 | figure = mkDOM (IsDynamic false) "figure" 245 | 246 | figure' :: Array ReactElement -> ReactElement 247 | figure' = figure [] 248 | 249 | footer :: Array Props -> Array ReactElement -> ReactElement 250 | footer = mkDOM (IsDynamic false) "footer" 251 | 252 | footer' :: Array ReactElement -> ReactElement 253 | footer' = footer [] 254 | 255 | form :: Array Props -> Array ReactElement -> ReactElement 256 | form = mkDOM (IsDynamic false) "form" 257 | 258 | form' :: Array ReactElement -> ReactElement 259 | form' = form [] 260 | 261 | h1 :: Array Props -> Array ReactElement -> ReactElement 262 | h1 = mkDOM (IsDynamic false) "h1" 263 | 264 | h1' :: Array ReactElement -> ReactElement 265 | h1' = h1 [] 266 | 267 | h2 :: Array Props -> Array ReactElement -> ReactElement 268 | h2 = mkDOM (IsDynamic false) "h2" 269 | 270 | h2' :: Array ReactElement -> ReactElement 271 | h2' = h2 [] 272 | 273 | h3 :: Array Props -> Array ReactElement -> ReactElement 274 | h3 = mkDOM (IsDynamic false) "h3" 275 | 276 | h3' :: Array ReactElement -> ReactElement 277 | h3' = h3 [] 278 | 279 | h4 :: Array Props -> Array ReactElement -> ReactElement 280 | h4 = mkDOM (IsDynamic false) "h4" 281 | 282 | h4' :: Array ReactElement -> ReactElement 283 | h4' = h4 [] 284 | 285 | h5 :: Array Props -> Array ReactElement -> ReactElement 286 | h5 = mkDOM (IsDynamic false) "h5" 287 | 288 | h5' :: Array ReactElement -> ReactElement 289 | h5' = h5 [] 290 | 291 | h6 :: Array Props -> Array ReactElement -> ReactElement 292 | h6 = mkDOM (IsDynamic false) "h6" 293 | 294 | h6' :: Array ReactElement -> ReactElement 295 | h6' = h6 [] 296 | 297 | head :: Array Props -> Array ReactElement -> ReactElement 298 | head = mkDOM (IsDynamic false) "head" 299 | 300 | head' :: Array ReactElement -> ReactElement 301 | head' = head [] 302 | 303 | header :: Array Props -> Array ReactElement -> ReactElement 304 | header = mkDOM (IsDynamic false) "header" 305 | 306 | header' :: Array ReactElement -> ReactElement 307 | header' = header [] 308 | 309 | hr :: Array Props -> ReactElement 310 | hr props = mkDOM (IsDynamic false) "hr" props [] 311 | 312 | hr' :: ReactElement 313 | hr' = hr [] 314 | 315 | html :: Array Props -> Array ReactElement -> ReactElement 316 | html = mkDOM (IsDynamic false) "html" 317 | 318 | html' :: Array ReactElement -> ReactElement 319 | html' = html [] 320 | 321 | i :: Array Props -> Array ReactElement -> ReactElement 322 | i = mkDOM (IsDynamic false) "i" 323 | 324 | i' :: Array ReactElement -> ReactElement 325 | i' = i [] 326 | 327 | iframe :: Array Props -> Array ReactElement -> ReactElement 328 | iframe = mkDOM (IsDynamic false) "iframe" 329 | 330 | iframe' :: Array ReactElement -> ReactElement 331 | iframe' = iframe [] 332 | 333 | img :: Array Props -> ReactElement 334 | img props = mkDOM (IsDynamic false) "img" props [] 335 | 336 | img' :: ReactElement 337 | img' = img [] 338 | 339 | input :: Array Props -> ReactElement 340 | input props = mkDOM (IsDynamic false) "input" props [] 341 | 342 | input' :: ReactElement 343 | input' = input [] 344 | 345 | ins :: Array Props -> Array ReactElement -> ReactElement 346 | ins = mkDOM (IsDynamic false) "ins" 347 | 348 | ins' :: Array ReactElement -> ReactElement 349 | ins' = ins [] 350 | 351 | kbd :: Array Props -> Array ReactElement -> ReactElement 352 | kbd = mkDOM (IsDynamic false) "kbd" 353 | 354 | kbd' :: Array ReactElement -> ReactElement 355 | kbd' = kbd [] 356 | 357 | keygen :: Array Props -> ReactElement 358 | keygen props = mkDOM (IsDynamic false) "keygen" props [] 359 | 360 | keygen' :: ReactElement 361 | keygen' = keygen [] 362 | 363 | label :: Array Props -> Array ReactElement -> ReactElement 364 | label = mkDOM (IsDynamic false) "label" 365 | 366 | label' :: Array ReactElement -> ReactElement 367 | label' = label [] 368 | 369 | legend :: Array Props -> Array ReactElement -> ReactElement 370 | legend = mkDOM (IsDynamic false) "legend" 371 | 372 | legend' :: Array ReactElement -> ReactElement 373 | legend' = legend [] 374 | 375 | li :: Array Props -> Array ReactElement -> ReactElement 376 | li = mkDOM (IsDynamic false) "li" 377 | 378 | li' :: Array ReactElement -> ReactElement 379 | li' = li [] 380 | 381 | link :: Array Props -> ReactElement 382 | link props = mkDOM (IsDynamic false) "link" props [] 383 | 384 | link' :: ReactElement 385 | link' = link [] 386 | 387 | main :: Array Props -> Array ReactElement -> ReactElement 388 | main = mkDOM (IsDynamic false) "main" 389 | 390 | main' :: Array ReactElement -> ReactElement 391 | main' = main [] 392 | 393 | map :: Array Props -> Array ReactElement -> ReactElement 394 | map = mkDOM (IsDynamic false) "map" 395 | 396 | map' :: Array ReactElement -> ReactElement 397 | map' = map [] 398 | 399 | mark :: Array Props -> Array ReactElement -> ReactElement 400 | mark = mkDOM (IsDynamic false) "mark" 401 | 402 | mark' :: Array ReactElement -> ReactElement 403 | mark' = mark [] 404 | 405 | menu :: Array Props -> Array ReactElement -> ReactElement 406 | menu = mkDOM (IsDynamic false) "menu" 407 | 408 | menu' :: Array ReactElement -> ReactElement 409 | menu' = menu [] 410 | 411 | menuitem :: Array Props -> ReactElement 412 | menuitem props = mkDOM (IsDynamic false) "menuitem" props [] 413 | 414 | menuitem' :: ReactElement 415 | menuitem' = menuitem [] 416 | 417 | meta :: Array Props -> ReactElement 418 | meta props = mkDOM (IsDynamic false) "meta" props [] 419 | 420 | meta' :: ReactElement 421 | meta' = meta [] 422 | 423 | meter :: Array Props -> Array ReactElement -> ReactElement 424 | meter = mkDOM (IsDynamic false) "meter" 425 | 426 | meter' :: Array ReactElement -> ReactElement 427 | meter' = meter [] 428 | 429 | nav :: Array Props -> Array ReactElement -> ReactElement 430 | nav = mkDOM (IsDynamic false) "nav" 431 | 432 | nav' :: Array ReactElement -> ReactElement 433 | nav' = nav [] 434 | 435 | noscript :: Array Props -> Array ReactElement -> ReactElement 436 | noscript = mkDOM (IsDynamic false) "noscript" 437 | 438 | noscript' :: Array ReactElement -> ReactElement 439 | noscript' = noscript [] 440 | 441 | object :: Array Props -> Array ReactElement -> ReactElement 442 | object = mkDOM (IsDynamic false) "object" 443 | 444 | object' :: Array ReactElement -> ReactElement 445 | object' = object [] 446 | 447 | ol :: Array Props -> Array ReactElement -> ReactElement 448 | ol = mkDOM (IsDynamic false) "ol" 449 | 450 | ol' :: Array ReactElement -> ReactElement 451 | ol' = ol [] 452 | 453 | optgroup :: Array Props -> Array ReactElement -> ReactElement 454 | optgroup = mkDOM (IsDynamic false) "optgroup" 455 | 456 | optgroup' :: Array ReactElement -> ReactElement 457 | optgroup' = optgroup [] 458 | 459 | option :: Array Props -> Array ReactElement -> ReactElement 460 | option = mkDOM (IsDynamic false) "option" 461 | 462 | option' :: Array ReactElement -> ReactElement 463 | option' = option [] 464 | 465 | output :: Array Props -> Array ReactElement -> ReactElement 466 | output = mkDOM (IsDynamic false) "output" 467 | 468 | output' :: Array ReactElement -> ReactElement 469 | output' = output [] 470 | 471 | p :: Array Props -> Array ReactElement -> ReactElement 472 | p = mkDOM (IsDynamic false) "p" 473 | 474 | p' :: Array ReactElement -> ReactElement 475 | p' = p [] 476 | 477 | param :: Array Props -> ReactElement 478 | param props = mkDOM (IsDynamic false) "param" props [] 479 | 480 | param' :: ReactElement 481 | param' = param [] 482 | 483 | picture :: Array Props -> Array ReactElement -> ReactElement 484 | picture = mkDOM (IsDynamic false) "picture" 485 | 486 | picture' :: Array ReactElement -> ReactElement 487 | picture' = picture [] 488 | 489 | pre :: Array Props -> Array ReactElement -> ReactElement 490 | pre = mkDOM (IsDynamic false) "pre" 491 | 492 | pre' :: Array ReactElement -> ReactElement 493 | pre' = pre [] 494 | 495 | progress :: Array Props -> Array ReactElement -> ReactElement 496 | progress = mkDOM (IsDynamic false) "progress" 497 | 498 | progress' :: Array ReactElement -> ReactElement 499 | progress' = progress [] 500 | 501 | q :: Array Props -> Array ReactElement -> ReactElement 502 | q = mkDOM (IsDynamic false) "q" 503 | 504 | q' :: Array ReactElement -> ReactElement 505 | q' = q [] 506 | 507 | rp :: Array Props -> Array ReactElement -> ReactElement 508 | rp = mkDOM (IsDynamic false) "rp" 509 | 510 | rp' :: Array ReactElement -> ReactElement 511 | rp' = rp [] 512 | 513 | rt :: Array Props -> Array ReactElement -> ReactElement 514 | rt = mkDOM (IsDynamic false) "rt" 515 | 516 | rt' :: Array ReactElement -> ReactElement 517 | rt' = rt [] 518 | 519 | ruby :: Array Props -> Array ReactElement -> ReactElement 520 | ruby = mkDOM (IsDynamic false) "ruby" 521 | 522 | ruby' :: Array ReactElement -> ReactElement 523 | ruby' = ruby [] 524 | 525 | s :: Array Props -> Array ReactElement -> ReactElement 526 | s = mkDOM (IsDynamic false) "s" 527 | 528 | s' :: Array ReactElement -> ReactElement 529 | s' = s [] 530 | 531 | samp :: Array Props -> Array ReactElement -> ReactElement 532 | samp = mkDOM (IsDynamic false) "samp" 533 | 534 | samp' :: Array ReactElement -> ReactElement 535 | samp' = samp [] 536 | 537 | script :: Array Props -> Array ReactElement -> ReactElement 538 | script = mkDOM (IsDynamic false) "script" 539 | 540 | script' :: Array ReactElement -> ReactElement 541 | script' = script [] 542 | 543 | section :: Array Props -> Array ReactElement -> ReactElement 544 | section = mkDOM (IsDynamic false) "section" 545 | 546 | section' :: Array ReactElement -> ReactElement 547 | section' = section [] 548 | 549 | select :: Array Props -> Array ReactElement -> ReactElement 550 | select = mkDOM (IsDynamic false) "select" 551 | 552 | select' :: Array ReactElement -> ReactElement 553 | select' = select [] 554 | 555 | small :: Array Props -> Array ReactElement -> ReactElement 556 | small = mkDOM (IsDynamic false) "small" 557 | 558 | small' :: Array ReactElement -> ReactElement 559 | small' = small [] 560 | 561 | source :: Array Props -> ReactElement 562 | source props = mkDOM (IsDynamic false) "source" props [] 563 | 564 | source' :: ReactElement 565 | source' = source [] 566 | 567 | span :: Array Props -> Array ReactElement -> ReactElement 568 | span = mkDOM (IsDynamic false) "span" 569 | 570 | span' :: Array ReactElement -> ReactElement 571 | span' = span [] 572 | 573 | strong :: Array Props -> Array ReactElement -> ReactElement 574 | strong = mkDOM (IsDynamic false) "strong" 575 | 576 | strong' :: Array ReactElement -> ReactElement 577 | strong' = strong [] 578 | 579 | style :: Array Props -> Array ReactElement -> ReactElement 580 | style = mkDOM (IsDynamic false) "style" 581 | 582 | style' :: Array ReactElement -> ReactElement 583 | style' = style [] 584 | 585 | sub :: Array Props -> Array ReactElement -> ReactElement 586 | sub = mkDOM (IsDynamic false) "sub" 587 | 588 | sub' :: Array ReactElement -> ReactElement 589 | sub' = sub [] 590 | 591 | summary :: Array Props -> Array ReactElement -> ReactElement 592 | summary = mkDOM (IsDynamic false) "summary" 593 | 594 | summary' :: Array ReactElement -> ReactElement 595 | summary' = summary [] 596 | 597 | sup :: Array Props -> Array ReactElement -> ReactElement 598 | sup = mkDOM (IsDynamic false) "sup" 599 | 600 | sup' :: Array ReactElement -> ReactElement 601 | sup' = sup [] 602 | 603 | table :: Array Props -> Array ReactElement -> ReactElement 604 | table = mkDOM (IsDynamic false) "table" 605 | 606 | table' :: Array ReactElement -> ReactElement 607 | table' = table [] 608 | 609 | tbody :: Array Props -> Array ReactElement -> ReactElement 610 | tbody = mkDOM (IsDynamic false) "tbody" 611 | 612 | tbody' :: Array ReactElement -> ReactElement 613 | tbody' = tbody [] 614 | 615 | td :: Array Props -> Array ReactElement -> ReactElement 616 | td = mkDOM (IsDynamic false) "td" 617 | 618 | td' :: Array ReactElement -> ReactElement 619 | td' = td [] 620 | 621 | textarea :: Array Props -> Array ReactElement -> ReactElement 622 | textarea = mkDOM (IsDynamic false) "textarea" 623 | 624 | textarea' :: Array ReactElement -> ReactElement 625 | textarea' = textarea [] 626 | 627 | tfoot :: Array Props -> Array ReactElement -> ReactElement 628 | tfoot = mkDOM (IsDynamic false) "tfoot" 629 | 630 | tfoot' :: Array ReactElement -> ReactElement 631 | tfoot' = tfoot [] 632 | 633 | th :: Array Props -> Array ReactElement -> ReactElement 634 | th = mkDOM (IsDynamic false) "th" 635 | 636 | th' :: Array ReactElement -> ReactElement 637 | th' = th [] 638 | 639 | thead :: Array Props -> Array ReactElement -> ReactElement 640 | thead = mkDOM (IsDynamic false) "thead" 641 | 642 | thead' :: Array ReactElement -> ReactElement 643 | thead' = thead [] 644 | 645 | time :: Array Props -> Array ReactElement -> ReactElement 646 | time = mkDOM (IsDynamic false) "time" 647 | 648 | time' :: Array ReactElement -> ReactElement 649 | time' = time [] 650 | 651 | title :: Array Props -> Array ReactElement -> ReactElement 652 | title = mkDOM (IsDynamic false) "title" 653 | 654 | title' :: Array ReactElement -> ReactElement 655 | title' = title [] 656 | 657 | tr :: Array Props -> Array ReactElement -> ReactElement 658 | tr = mkDOM (IsDynamic false) "tr" 659 | 660 | tr' :: Array ReactElement -> ReactElement 661 | tr' = tr [] 662 | 663 | track :: Array Props -> ReactElement 664 | track props = mkDOM (IsDynamic false) "track" props [] 665 | 666 | track' :: ReactElement 667 | track' = track [] 668 | 669 | u :: Array Props -> Array ReactElement -> ReactElement 670 | u = mkDOM (IsDynamic false) "u" 671 | 672 | u' :: Array ReactElement -> ReactElement 673 | u' = u [] 674 | 675 | ul :: Array Props -> Array ReactElement -> ReactElement 676 | ul = mkDOM (IsDynamic false) "ul" 677 | 678 | ul' :: Array ReactElement -> ReactElement 679 | ul' = ul [] 680 | 681 | var :: Array Props -> Array ReactElement -> ReactElement 682 | var = mkDOM (IsDynamic false) "var" 683 | 684 | var' :: Array ReactElement -> ReactElement 685 | var' = var [] 686 | 687 | video :: Array Props -> Array ReactElement -> ReactElement 688 | video = mkDOM (IsDynamic false) "video" 689 | 690 | video' :: Array ReactElement -> ReactElement 691 | video' = video [] 692 | 693 | wbr :: Array Props -> ReactElement 694 | wbr props = mkDOM (IsDynamic false) "wbr" props [] 695 | 696 | wbr' :: ReactElement 697 | wbr' = wbr [] 698 | -------------------------------------------------------------------------------- /src/React/DOM/Dynamic.purs: -------------------------------------------------------------------------------- 1 | module React.DOM.Dynamic where 2 | 3 | import React (ReactElement) 4 | import React.DOM as DOM 5 | import React.DOM.Props (Props) 6 | 7 | text :: String -> ReactElement 8 | text = DOM.text 9 | 10 | a :: Array Props -> Array ReactElement -> ReactElement 11 | a = DOM.mkDOM (DOM.IsDynamic true) "a" 12 | 13 | a' :: Array ReactElement -> ReactElement 14 | a' = a [] 15 | 16 | abbr :: Array Props -> Array ReactElement -> ReactElement 17 | abbr = DOM.mkDOM (DOM.IsDynamic true) "abbr" 18 | 19 | abbr' :: Array ReactElement -> ReactElement 20 | abbr' = abbr [] 21 | 22 | address :: Array Props -> Array ReactElement -> ReactElement 23 | address = DOM.mkDOM (DOM.IsDynamic true) "address" 24 | 25 | address' :: Array ReactElement -> ReactElement 26 | address' = address [] 27 | 28 | area :: Array Props -> ReactElement 29 | area props = DOM.mkDOM (DOM.IsDynamic true) "area" props [] 30 | 31 | area' :: ReactElement 32 | area' = area [] 33 | 34 | article :: Array Props -> Array ReactElement -> ReactElement 35 | article = DOM.mkDOM (DOM.IsDynamic true) "article" 36 | 37 | article' :: Array ReactElement -> ReactElement 38 | article' = article [] 39 | 40 | aside :: Array Props -> Array ReactElement -> ReactElement 41 | aside = DOM.mkDOM (DOM.IsDynamic true) "aside" 42 | 43 | aside' :: Array ReactElement -> ReactElement 44 | aside' = aside [] 45 | 46 | audio :: Array Props -> Array ReactElement -> ReactElement 47 | audio = DOM.mkDOM (DOM.IsDynamic true) "audio" 48 | 49 | audio' :: Array ReactElement -> ReactElement 50 | audio' = audio [] 51 | 52 | b :: Array Props -> Array ReactElement -> ReactElement 53 | b = DOM.mkDOM (DOM.IsDynamic true) "b" 54 | 55 | b' :: Array ReactElement -> ReactElement 56 | b' = b [] 57 | 58 | base :: Array Props -> ReactElement 59 | base props = DOM.mkDOM (DOM.IsDynamic true) "base" props [] 60 | 61 | base' :: ReactElement 62 | base' = base [] 63 | 64 | bdi :: Array Props -> Array ReactElement -> ReactElement 65 | bdi = DOM.mkDOM (DOM.IsDynamic true) "bdi" 66 | 67 | bdi' :: Array ReactElement -> ReactElement 68 | bdi' = bdi [] 69 | 70 | bdo :: Array Props -> Array ReactElement -> ReactElement 71 | bdo = DOM.mkDOM (DOM.IsDynamic true) "bdo" 72 | 73 | bdo' :: Array ReactElement -> ReactElement 74 | bdo' = bdo [] 75 | 76 | big :: Array Props -> Array ReactElement -> ReactElement 77 | big = DOM.mkDOM (DOM.IsDynamic true) "big" 78 | 79 | big' :: Array ReactElement -> ReactElement 80 | big' = big [] 81 | 82 | blockquote :: Array Props -> Array ReactElement -> ReactElement 83 | blockquote = DOM.mkDOM (DOM.IsDynamic true) "blockquote" 84 | 85 | blockquote' :: Array ReactElement -> ReactElement 86 | blockquote' = blockquote [] 87 | 88 | body :: Array Props -> Array ReactElement -> ReactElement 89 | body = DOM.mkDOM (DOM.IsDynamic true) "body" 90 | 91 | body' :: Array ReactElement -> ReactElement 92 | body' = body [] 93 | 94 | br :: Array Props -> ReactElement 95 | br props = DOM.mkDOM (DOM.IsDynamic true) "br" props [] 96 | 97 | br' :: ReactElement 98 | br' = br [] 99 | 100 | button :: Array Props -> Array ReactElement -> ReactElement 101 | button = DOM.mkDOM (DOM.IsDynamic true) "button" 102 | 103 | button' :: Array ReactElement -> ReactElement 104 | button' = button [] 105 | 106 | canvas :: Array Props -> Array ReactElement -> ReactElement 107 | canvas = DOM.mkDOM (DOM.IsDynamic true) "canvas" 108 | 109 | canvas' :: Array ReactElement -> ReactElement 110 | canvas' = canvas [] 111 | 112 | caption :: Array Props -> Array ReactElement -> ReactElement 113 | caption = DOM.mkDOM (DOM.IsDynamic true) "caption" 114 | 115 | caption' :: Array ReactElement -> ReactElement 116 | caption' = caption [] 117 | 118 | cite :: Array Props -> Array ReactElement -> ReactElement 119 | cite = DOM.mkDOM (DOM.IsDynamic true) "cite" 120 | 121 | cite' :: Array ReactElement -> ReactElement 122 | cite' = cite [] 123 | 124 | code :: Array Props -> Array ReactElement -> ReactElement 125 | code = DOM.mkDOM (DOM.IsDynamic true) "code" 126 | 127 | code' :: Array ReactElement -> ReactElement 128 | code' = code [] 129 | 130 | col :: Array Props -> ReactElement 131 | col props = DOM.mkDOM (DOM.IsDynamic true) "col" props [] 132 | 133 | col' :: ReactElement 134 | col' = col [] 135 | 136 | colgroup :: Array Props -> Array ReactElement -> ReactElement 137 | colgroup = DOM.mkDOM (DOM.IsDynamic true) "colgroup" 138 | 139 | colgroup' :: Array ReactElement -> ReactElement 140 | colgroup' = colgroup [] 141 | 142 | _data :: Array Props -> Array ReactElement -> ReactElement 143 | _data = DOM.mkDOM (DOM.IsDynamic true) "data" 144 | 145 | _data' :: Array ReactElement -> ReactElement 146 | _data' = _data [] 147 | 148 | datalist :: Array Props -> Array ReactElement -> ReactElement 149 | datalist = DOM.mkDOM (DOM.IsDynamic true) "datalist" 150 | 151 | datalist' :: Array ReactElement -> ReactElement 152 | datalist' = datalist [] 153 | 154 | dd :: Array Props -> Array ReactElement -> ReactElement 155 | dd = DOM.mkDOM (DOM.IsDynamic true) "dd" 156 | 157 | dd' :: Array ReactElement -> ReactElement 158 | dd' = dd [] 159 | 160 | del :: Array Props -> Array ReactElement -> ReactElement 161 | del = DOM.mkDOM (DOM.IsDynamic true) "del" 162 | 163 | del' :: Array ReactElement -> ReactElement 164 | del' = del [] 165 | 166 | details :: Array Props -> Array ReactElement -> ReactElement 167 | details = DOM.mkDOM (DOM.IsDynamic true) "details" 168 | 169 | details' :: Array ReactElement -> ReactElement 170 | details' = details [] 171 | 172 | dfn :: Array Props -> Array ReactElement -> ReactElement 173 | dfn = DOM.mkDOM (DOM.IsDynamic true) "dfn" 174 | 175 | dfn' :: Array ReactElement -> ReactElement 176 | dfn' = dfn [] 177 | 178 | dialog :: Array Props -> Array ReactElement -> ReactElement 179 | dialog = DOM.mkDOM (DOM.IsDynamic true) "dialog" 180 | 181 | dialog' :: Array ReactElement -> ReactElement 182 | dialog' = dialog [] 183 | 184 | div :: Array Props -> Array ReactElement -> ReactElement 185 | div = DOM.mkDOM (DOM.IsDynamic true) "div" 186 | 187 | div' :: Array ReactElement -> ReactElement 188 | div' = div [] 189 | 190 | dl :: Array Props -> Array ReactElement -> ReactElement 191 | dl = DOM.mkDOM (DOM.IsDynamic true) "dl" 192 | 193 | dl' :: Array ReactElement -> ReactElement 194 | dl' = dl [] 195 | 196 | dt :: Array Props -> Array ReactElement -> ReactElement 197 | dt = DOM.mkDOM (DOM.IsDynamic true) "dt" 198 | 199 | dt' :: Array ReactElement -> ReactElement 200 | dt' = dt [] 201 | 202 | em :: Array Props -> Array ReactElement -> ReactElement 203 | em = DOM.mkDOM (DOM.IsDynamic true) "em" 204 | 205 | em' :: Array ReactElement -> ReactElement 206 | em' = em [] 207 | 208 | embed :: Array Props -> ReactElement 209 | embed props = DOM.mkDOM (DOM.IsDynamic true) "embed" props [] 210 | 211 | embed' :: ReactElement 212 | embed' = embed [] 213 | 214 | fieldset :: Array Props -> Array ReactElement -> ReactElement 215 | fieldset = DOM.mkDOM (DOM.IsDynamic true) "fieldset" 216 | 217 | fieldset' :: Array ReactElement -> ReactElement 218 | fieldset' = fieldset [] 219 | 220 | figcaption :: Array Props -> Array ReactElement -> ReactElement 221 | figcaption = DOM.mkDOM (DOM.IsDynamic true) "figcaption" 222 | 223 | figcaption' :: Array ReactElement -> ReactElement 224 | figcaption' = figcaption [] 225 | 226 | figure :: Array Props -> Array ReactElement -> ReactElement 227 | figure = DOM.mkDOM (DOM.IsDynamic true) "figure" 228 | 229 | figure' :: Array ReactElement -> ReactElement 230 | figure' = figure [] 231 | 232 | footer :: Array Props -> Array ReactElement -> ReactElement 233 | footer = DOM.mkDOM (DOM.IsDynamic true) "footer" 234 | 235 | footer' :: Array ReactElement -> ReactElement 236 | footer' = footer [] 237 | 238 | form :: Array Props -> Array ReactElement -> ReactElement 239 | form = DOM.mkDOM (DOM.IsDynamic true) "form" 240 | 241 | form' :: Array ReactElement -> ReactElement 242 | form' = form [] 243 | 244 | h1 :: Array Props -> Array ReactElement -> ReactElement 245 | h1 = DOM.mkDOM (DOM.IsDynamic true) "h1" 246 | 247 | h1' :: Array ReactElement -> ReactElement 248 | h1' = h1 [] 249 | 250 | h2 :: Array Props -> Array ReactElement -> ReactElement 251 | h2 = DOM.mkDOM (DOM.IsDynamic true) "h2" 252 | 253 | h2' :: Array ReactElement -> ReactElement 254 | h2' = h2 [] 255 | 256 | h3 :: Array Props -> Array ReactElement -> ReactElement 257 | h3 = DOM.mkDOM (DOM.IsDynamic true) "h3" 258 | 259 | h3' :: Array ReactElement -> ReactElement 260 | h3' = h3 [] 261 | 262 | h4 :: Array Props -> Array ReactElement -> ReactElement 263 | h4 = DOM.mkDOM (DOM.IsDynamic true) "h4" 264 | 265 | h4' :: Array ReactElement -> ReactElement 266 | h4' = h4 [] 267 | 268 | h5 :: Array Props -> Array ReactElement -> ReactElement 269 | h5 = DOM.mkDOM (DOM.IsDynamic true) "h5" 270 | 271 | h5' :: Array ReactElement -> ReactElement 272 | h5' = h5 [] 273 | 274 | h6 :: Array Props -> Array ReactElement -> ReactElement 275 | h6 = DOM.mkDOM (DOM.IsDynamic true) "h6" 276 | 277 | h6' :: Array ReactElement -> ReactElement 278 | h6' = h6 [] 279 | 280 | head :: Array Props -> Array ReactElement -> ReactElement 281 | head = DOM.mkDOM (DOM.IsDynamic true) "head" 282 | 283 | head' :: Array ReactElement -> ReactElement 284 | head' = head [] 285 | 286 | header :: Array Props -> Array ReactElement -> ReactElement 287 | header = DOM.mkDOM (DOM.IsDynamic true) "header" 288 | 289 | header' :: Array ReactElement -> ReactElement 290 | header' = header [] 291 | 292 | hr :: Array Props -> ReactElement 293 | hr props = DOM.mkDOM (DOM.IsDynamic true) "hr" props [] 294 | 295 | hr' :: ReactElement 296 | hr' = hr [] 297 | 298 | html :: Array Props -> Array ReactElement -> ReactElement 299 | html = DOM.mkDOM (DOM.IsDynamic true) "html" 300 | 301 | html' :: Array ReactElement -> ReactElement 302 | html' = html [] 303 | 304 | i :: Array Props -> Array ReactElement -> ReactElement 305 | i = DOM.mkDOM (DOM.IsDynamic true) "i" 306 | 307 | i' :: Array ReactElement -> ReactElement 308 | i' = i [] 309 | 310 | iframe :: Array Props -> Array ReactElement -> ReactElement 311 | iframe = DOM.mkDOM (DOM.IsDynamic true) "iframe" 312 | 313 | iframe' :: Array ReactElement -> ReactElement 314 | iframe' = iframe [] 315 | 316 | img :: Array Props -> ReactElement 317 | img props = DOM.mkDOM (DOM.IsDynamic true) "img" props [] 318 | 319 | img' :: ReactElement 320 | img' = img [] 321 | 322 | input :: Array Props -> ReactElement 323 | input props = DOM.mkDOM (DOM.IsDynamic true) "input" props [] 324 | 325 | input' :: ReactElement 326 | input' = input [] 327 | 328 | ins :: Array Props -> Array ReactElement -> ReactElement 329 | ins = DOM.mkDOM (DOM.IsDynamic true) "ins" 330 | 331 | ins' :: Array ReactElement -> ReactElement 332 | ins' = ins [] 333 | 334 | kbd :: Array Props -> Array ReactElement -> ReactElement 335 | kbd = DOM.mkDOM (DOM.IsDynamic true) "kbd" 336 | 337 | kbd' :: Array ReactElement -> ReactElement 338 | kbd' = kbd [] 339 | 340 | keygen :: Array Props -> ReactElement 341 | keygen props = DOM.mkDOM (DOM.IsDynamic true) "keygen" props [] 342 | 343 | keygen' :: ReactElement 344 | keygen' = keygen [] 345 | 346 | label :: Array Props -> Array ReactElement -> ReactElement 347 | label = DOM.mkDOM (DOM.IsDynamic true) "label" 348 | 349 | label' :: Array ReactElement -> ReactElement 350 | label' = label [] 351 | 352 | legend :: Array Props -> Array ReactElement -> ReactElement 353 | legend = DOM.mkDOM (DOM.IsDynamic true) "legend" 354 | 355 | legend' :: Array ReactElement -> ReactElement 356 | legend' = legend [] 357 | 358 | li :: Array Props -> Array ReactElement -> ReactElement 359 | li = DOM.mkDOM (DOM.IsDynamic true) "li" 360 | 361 | li' :: Array ReactElement -> ReactElement 362 | li' = li [] 363 | 364 | link :: Array Props -> ReactElement 365 | link props = DOM.mkDOM (DOM.IsDynamic true) "link" props [] 366 | 367 | link' :: ReactElement 368 | link' = link [] 369 | 370 | main :: Array Props -> Array ReactElement -> ReactElement 371 | main = DOM.mkDOM (DOM.IsDynamic true) "main" 372 | 373 | main' :: Array ReactElement -> ReactElement 374 | main' = main [] 375 | 376 | map :: Array Props -> Array ReactElement -> ReactElement 377 | map = DOM.mkDOM (DOM.IsDynamic true) "map" 378 | 379 | map' :: Array ReactElement -> ReactElement 380 | map' = map [] 381 | 382 | mark :: Array Props -> Array ReactElement -> ReactElement 383 | mark = DOM.mkDOM (DOM.IsDynamic true) "mark" 384 | 385 | mark' :: Array ReactElement -> ReactElement 386 | mark' = mark [] 387 | 388 | menu :: Array Props -> Array ReactElement -> ReactElement 389 | menu = DOM.mkDOM (DOM.IsDynamic true) "menu" 390 | 391 | menu' :: Array ReactElement -> ReactElement 392 | menu' = menu [] 393 | 394 | menuitem :: Array Props -> ReactElement 395 | menuitem props = DOM.mkDOM (DOM.IsDynamic true) "menuitem" props [] 396 | 397 | menuitem' :: ReactElement 398 | menuitem' = menuitem [] 399 | 400 | meta :: Array Props -> ReactElement 401 | meta props = DOM.mkDOM (DOM.IsDynamic true) "meta" props [] 402 | 403 | meta' :: ReactElement 404 | meta' = meta [] 405 | 406 | meter :: Array Props -> Array ReactElement -> ReactElement 407 | meter = DOM.mkDOM (DOM.IsDynamic true) "meter" 408 | 409 | meter' :: Array ReactElement -> ReactElement 410 | meter' = meter [] 411 | 412 | nav :: Array Props -> Array ReactElement -> ReactElement 413 | nav = DOM.mkDOM (DOM.IsDynamic true) "nav" 414 | 415 | nav' :: Array ReactElement -> ReactElement 416 | nav' = nav [] 417 | 418 | noscript :: Array Props -> Array ReactElement -> ReactElement 419 | noscript = DOM.mkDOM (DOM.IsDynamic true) "noscript" 420 | 421 | noscript' :: Array ReactElement -> ReactElement 422 | noscript' = noscript [] 423 | 424 | object :: Array Props -> Array ReactElement -> ReactElement 425 | object = DOM.mkDOM (DOM.IsDynamic true) "object" 426 | 427 | object' :: Array ReactElement -> ReactElement 428 | object' = object [] 429 | 430 | ol :: Array Props -> Array ReactElement -> ReactElement 431 | ol = DOM.mkDOM (DOM.IsDynamic true) "ol" 432 | 433 | ol' :: Array ReactElement -> ReactElement 434 | ol' = ol [] 435 | 436 | optgroup :: Array Props -> Array ReactElement -> ReactElement 437 | optgroup = DOM.mkDOM (DOM.IsDynamic true) "optgroup" 438 | 439 | optgroup' :: Array ReactElement -> ReactElement 440 | optgroup' = optgroup [] 441 | 442 | option :: Array Props -> Array ReactElement -> ReactElement 443 | option = DOM.mkDOM (DOM.IsDynamic true) "option" 444 | 445 | option' :: Array ReactElement -> ReactElement 446 | option' = option [] 447 | 448 | output :: Array Props -> Array ReactElement -> ReactElement 449 | output = DOM.mkDOM (DOM.IsDynamic true) "output" 450 | 451 | output' :: Array ReactElement -> ReactElement 452 | output' = output [] 453 | 454 | p :: Array Props -> Array ReactElement -> ReactElement 455 | p = DOM.mkDOM (DOM.IsDynamic true) "p" 456 | 457 | p' :: Array ReactElement -> ReactElement 458 | p' = p [] 459 | 460 | param :: Array Props -> ReactElement 461 | param props = DOM.mkDOM (DOM.IsDynamic true) "param" props [] 462 | 463 | param' :: ReactElement 464 | param' = param [] 465 | 466 | picture :: Array Props -> Array ReactElement -> ReactElement 467 | picture = DOM.mkDOM (DOM.IsDynamic true) "picture" 468 | 469 | picture' :: Array ReactElement -> ReactElement 470 | picture' = picture [] 471 | 472 | pre :: Array Props -> Array ReactElement -> ReactElement 473 | pre = DOM.mkDOM (DOM.IsDynamic true) "pre" 474 | 475 | pre' :: Array ReactElement -> ReactElement 476 | pre' = pre [] 477 | 478 | progress :: Array Props -> Array ReactElement -> ReactElement 479 | progress = DOM.mkDOM (DOM.IsDynamic true) "progress" 480 | 481 | progress' :: Array ReactElement -> ReactElement 482 | progress' = progress [] 483 | 484 | q :: Array Props -> Array ReactElement -> ReactElement 485 | q = DOM.mkDOM (DOM.IsDynamic true) "q" 486 | 487 | q' :: Array ReactElement -> ReactElement 488 | q' = q [] 489 | 490 | rp :: Array Props -> Array ReactElement -> ReactElement 491 | rp = DOM.mkDOM (DOM.IsDynamic true) "rp" 492 | 493 | rp' :: Array ReactElement -> ReactElement 494 | rp' = rp [] 495 | 496 | rt :: Array Props -> Array ReactElement -> ReactElement 497 | rt = DOM.mkDOM (DOM.IsDynamic true) "rt" 498 | 499 | rt' :: Array ReactElement -> ReactElement 500 | rt' = rt [] 501 | 502 | ruby :: Array Props -> Array ReactElement -> ReactElement 503 | ruby = DOM.mkDOM (DOM.IsDynamic true) "ruby" 504 | 505 | ruby' :: Array ReactElement -> ReactElement 506 | ruby' = ruby [] 507 | 508 | s :: Array Props -> Array ReactElement -> ReactElement 509 | s = DOM.mkDOM (DOM.IsDynamic true) "s" 510 | 511 | s' :: Array ReactElement -> ReactElement 512 | s' = s [] 513 | 514 | samp :: Array Props -> Array ReactElement -> ReactElement 515 | samp = DOM.mkDOM (DOM.IsDynamic true) "samp" 516 | 517 | samp' :: Array ReactElement -> ReactElement 518 | samp' = samp [] 519 | 520 | script :: Array Props -> Array ReactElement -> ReactElement 521 | script = DOM.mkDOM (DOM.IsDynamic true) "script" 522 | 523 | script' :: Array ReactElement -> ReactElement 524 | script' = script [] 525 | 526 | section :: Array Props -> Array ReactElement -> ReactElement 527 | section = DOM.mkDOM (DOM.IsDynamic true) "section" 528 | 529 | section' :: Array ReactElement -> ReactElement 530 | section' = section [] 531 | 532 | select :: Array Props -> Array ReactElement -> ReactElement 533 | select = DOM.mkDOM (DOM.IsDynamic true) "select" 534 | 535 | select' :: Array ReactElement -> ReactElement 536 | select' = select [] 537 | 538 | small :: Array Props -> Array ReactElement -> ReactElement 539 | small = DOM.mkDOM (DOM.IsDynamic true) "small" 540 | 541 | small' :: Array ReactElement -> ReactElement 542 | small' = small [] 543 | 544 | source :: Array Props -> ReactElement 545 | source props = DOM.mkDOM (DOM.IsDynamic true) "source" props [] 546 | 547 | source' :: ReactElement 548 | source' = source [] 549 | 550 | span :: Array Props -> Array ReactElement -> ReactElement 551 | span = DOM.mkDOM (DOM.IsDynamic true) "span" 552 | 553 | span' :: Array ReactElement -> ReactElement 554 | span' = span [] 555 | 556 | strong :: Array Props -> Array ReactElement -> ReactElement 557 | strong = DOM.mkDOM (DOM.IsDynamic true) "strong" 558 | 559 | strong' :: Array ReactElement -> ReactElement 560 | strong' = strong [] 561 | 562 | style :: Array Props -> Array ReactElement -> ReactElement 563 | style = DOM.mkDOM (DOM.IsDynamic true) "style" 564 | 565 | style' :: Array ReactElement -> ReactElement 566 | style' = style [] 567 | 568 | sub :: Array Props -> Array ReactElement -> ReactElement 569 | sub = DOM.mkDOM (DOM.IsDynamic true) "sub" 570 | 571 | sub' :: Array ReactElement -> ReactElement 572 | sub' = sub [] 573 | 574 | summary :: Array Props -> Array ReactElement -> ReactElement 575 | summary = DOM.mkDOM (DOM.IsDynamic true) "summary" 576 | 577 | summary' :: Array ReactElement -> ReactElement 578 | summary' = summary [] 579 | 580 | sup :: Array Props -> Array ReactElement -> ReactElement 581 | sup = DOM.mkDOM (DOM.IsDynamic true) "sup" 582 | 583 | sup' :: Array ReactElement -> ReactElement 584 | sup' = sup [] 585 | 586 | table :: Array Props -> Array ReactElement -> ReactElement 587 | table = DOM.mkDOM (DOM.IsDynamic true) "table" 588 | 589 | table' :: Array ReactElement -> ReactElement 590 | table' = table [] 591 | 592 | tbody :: Array Props -> Array ReactElement -> ReactElement 593 | tbody = DOM.mkDOM (DOM.IsDynamic true) "tbody" 594 | 595 | tbody' :: Array ReactElement -> ReactElement 596 | tbody' = tbody [] 597 | 598 | td :: Array Props -> Array ReactElement -> ReactElement 599 | td = DOM.mkDOM (DOM.IsDynamic true) "td" 600 | 601 | td' :: Array ReactElement -> ReactElement 602 | td' = td [] 603 | 604 | textarea :: Array Props -> Array ReactElement -> ReactElement 605 | textarea = DOM.mkDOM (DOM.IsDynamic true) "textarea" 606 | 607 | textarea' :: Array ReactElement -> ReactElement 608 | textarea' = textarea [] 609 | 610 | tfoot :: Array Props -> Array ReactElement -> ReactElement 611 | tfoot = DOM.mkDOM (DOM.IsDynamic true) "tfoot" 612 | 613 | tfoot' :: Array ReactElement -> ReactElement 614 | tfoot' = tfoot [] 615 | 616 | th :: Array Props -> Array ReactElement -> ReactElement 617 | th = DOM.mkDOM (DOM.IsDynamic true) "th" 618 | 619 | th' :: Array ReactElement -> ReactElement 620 | th' = th [] 621 | 622 | thead :: Array Props -> Array ReactElement -> ReactElement 623 | thead = DOM.mkDOM (DOM.IsDynamic true) "thead" 624 | 625 | thead' :: Array ReactElement -> ReactElement 626 | thead' = thead [] 627 | 628 | time :: Array Props -> Array ReactElement -> ReactElement 629 | time = DOM.mkDOM (DOM.IsDynamic true) "time" 630 | 631 | time' :: Array ReactElement -> ReactElement 632 | time' = time [] 633 | 634 | title :: Array Props -> Array ReactElement -> ReactElement 635 | title = DOM.mkDOM (DOM.IsDynamic true) "title" 636 | 637 | title' :: Array ReactElement -> ReactElement 638 | title' = title [] 639 | 640 | tr :: Array Props -> Array ReactElement -> ReactElement 641 | tr = DOM.mkDOM (DOM.IsDynamic true) "tr" 642 | 643 | tr' :: Array ReactElement -> ReactElement 644 | tr' = tr [] 645 | 646 | track :: Array Props -> ReactElement 647 | track props = DOM.mkDOM (DOM.IsDynamic true) "track" props [] 648 | 649 | track' :: ReactElement 650 | track' = track [] 651 | 652 | u :: Array Props -> Array ReactElement -> ReactElement 653 | u = DOM.mkDOM (DOM.IsDynamic true) "u" 654 | 655 | u' :: Array ReactElement -> ReactElement 656 | u' = u [] 657 | 658 | ul :: Array Props -> Array ReactElement -> ReactElement 659 | ul = DOM.mkDOM (DOM.IsDynamic true) "ul" 660 | 661 | ul' :: Array ReactElement -> ReactElement 662 | ul' = ul [] 663 | 664 | var :: Array Props -> Array ReactElement -> ReactElement 665 | var = DOM.mkDOM (DOM.IsDynamic true) "var" 666 | 667 | var' :: Array ReactElement -> ReactElement 668 | var' = var [] 669 | 670 | video :: Array Props -> Array ReactElement -> ReactElement 671 | video = DOM.mkDOM (DOM.IsDynamic true) "video" 672 | 673 | video' :: Array ReactElement -> ReactElement 674 | video' = video [] 675 | 676 | wbr :: Array Props -> ReactElement 677 | wbr props = DOM.mkDOM (DOM.IsDynamic true) "wbr" props [] 678 | 679 | wbr' :: ReactElement 680 | wbr' = wbr [] 681 | -------------------------------------------------------------------------------- /src/React/DOM/Props.js: -------------------------------------------------------------------------------- 1 | function unsafeMkProps(key) { 2 | return function(value){ 3 | var result = {}; 4 | result[key] = value; 5 | return result; 6 | }; 7 | } 8 | export {unsafeMkProps}; 9 | 10 | function unsafeUnfoldProps(key) { 11 | return function(value){ 12 | var result = {}; 13 | var props = {}; 14 | props[key] = result; 15 | 16 | for (var subprop in value) { 17 | if (Object.hasOwnProperty.apply(value, [subprop])) { 18 | result[subprop] = value[subprop]; 19 | } 20 | } 21 | 22 | return props; 23 | }; 24 | } 25 | export {unsafeUnfoldProps}; 26 | 27 | function unsafePrefixProps(prefix) { 28 | return function(value){ 29 | var result = {}; 30 | 31 | for (var prop in value) { 32 | if (Object.hasOwnProperty.apply(value, [prop])) { 33 | result[prefix + prop] = value[prop]; 34 | } 35 | } 36 | 37 | return result; 38 | }; 39 | } 40 | export {unsafePrefixProps}; 41 | 42 | function unsafeFromPropsArray(props) { 43 | var result = {}; 44 | 45 | for (var i = 0, len = props.length; i < len; i++) { 46 | var prop = props[i]; 47 | 48 | for (var key in prop) { 49 | if (Object.hasOwnProperty.apply(prop, [key])) { 50 | result[key] = prop[key]; 51 | } 52 | } 53 | } 54 | 55 | return result; 56 | } 57 | export {unsafeFromPropsArray}; 58 | -------------------------------------------------------------------------------- /src/React/DOM/Props.purs: -------------------------------------------------------------------------------- 1 | module React.DOM.Props where 2 | 3 | import Prelude 4 | 5 | import Effect (Effect) 6 | import Effect.Uncurried (mkEffectFn1) 7 | import React.Ref as Ref 8 | import React.SyntheticEvent 9 | ( SyntheticAnimationEvent 10 | , SyntheticClipboardEvent 11 | , SyntheticCompositionEvent 12 | , SyntheticEvent 13 | , SyntheticFocusEvent 14 | , SyntheticInputEvent 15 | , SyntheticKeyboardEvent 16 | , SyntheticMouseEvent 17 | , SyntheticTouchEvent 18 | , SyntheticTransitionEvent 19 | , SyntheticUIEvent 20 | , SyntheticWheelEvent 21 | ) 22 | 23 | foreign import data Props :: Type 24 | 25 | foreign import unsafeMkProps :: forall val. String -> val -> Props 26 | 27 | foreign import unsafeUnfoldProps :: forall vals. String -> { | vals } -> Props 28 | 29 | foreign import unsafePrefixProps :: forall vals. String -> { | vals } -> Props 30 | 31 | foreign import unsafeFromPropsArray :: forall props. Array Props -> props 32 | 33 | aria :: forall ariaAttrs. { | ariaAttrs } -> Props 34 | aria = unsafePrefixProps "aria-" 35 | 36 | _data :: forall dataAttrs. { | dataAttrs } -> Props 37 | _data = unsafePrefixProps "data-" 38 | 39 | style :: forall style. { | style } -> Props 40 | style = unsafeUnfoldProps "style" 41 | 42 | dangerouslySetInnerHTML :: { __html :: String } -> Props 43 | dangerouslySetInnerHTML = unsafeMkProps "dangerouslySetInnerHTML" 44 | 45 | accept :: String -> Props 46 | accept = unsafeMkProps "accept" 47 | 48 | acceptCharset :: String -> Props 49 | acceptCharset = unsafeMkProps "acceptCharset" 50 | 51 | accessKey :: String -> Props 52 | accessKey = unsafeMkProps "accessKey" 53 | 54 | action :: String -> Props 55 | action = unsafeMkProps "action" 56 | 57 | allowFullScreen :: Boolean -> Props 58 | allowFullScreen = unsafeMkProps "allowFullScreen" 59 | 60 | allowTransparency :: Boolean -> Props 61 | allowTransparency = unsafeMkProps "allowTransparency" 62 | 63 | alt :: String -> Props 64 | alt = unsafeMkProps "alt" 65 | 66 | async :: Boolean -> Props 67 | async = unsafeMkProps "async" 68 | 69 | autoComplete :: String -> Props 70 | autoComplete = unsafeMkProps "autoComplete" 71 | 72 | autoFocus :: Boolean -> Props 73 | autoFocus = unsafeMkProps "autoFocus" 74 | 75 | autoPlay :: Boolean -> Props 76 | autoPlay = unsafeMkProps "autoPlay" 77 | 78 | capture :: Boolean -> Props 79 | capture = unsafeMkProps "capture" 80 | 81 | cellPadding :: String -> Props 82 | cellPadding = unsafeMkProps "cellPadding" 83 | 84 | cellSpacing :: String -> Props 85 | cellSpacing = unsafeMkProps "cellSpacing" 86 | 87 | charSet :: String -> Props 88 | charSet = unsafeMkProps "charSet" 89 | 90 | challenge :: String -> Props 91 | challenge = unsafeMkProps "checked" 92 | 93 | checked :: Boolean -> Props 94 | checked = unsafeMkProps "checked" 95 | 96 | cite :: String -> Props 97 | cite = unsafeMkProps "cite" 98 | 99 | classID :: String -> Props 100 | classID = unsafeMkProps "classID" 101 | 102 | className :: String -> Props 103 | className = unsafeMkProps "className" 104 | 105 | cols :: Int -> Props 106 | cols = unsafeMkProps "cols" 107 | 108 | colSpan :: Int -> Props 109 | colSpan = unsafeMkProps "colSpan" 110 | 111 | content :: String -> Props 112 | content = unsafeMkProps "content" 113 | 114 | contentEditable :: Boolean -> Props 115 | contentEditable = unsafeMkProps "contentEditable" 116 | 117 | contextMenu :: String -> Props 118 | contextMenu = unsafeMkProps "contextMenu" 119 | 120 | controls :: Boolean -> Props 121 | controls = unsafeMkProps "controls" 122 | 123 | coords :: String -> Props 124 | coords = unsafeMkProps "coords" 125 | 126 | crossOrigin :: String -> Props 127 | crossOrigin = unsafeMkProps "crossOrigin" 128 | 129 | dateTime :: String -> Props 130 | dateTime = unsafeMkProps "dateTime" 131 | 132 | default :: Boolean -> Props 133 | default = unsafeMkProps "default" 134 | 135 | defaultChecked :: Boolean -> Props 136 | defaultChecked = unsafeMkProps "defaultChecked" 137 | 138 | defaultValue :: String -> Props 139 | defaultValue = unsafeMkProps "defaultValue" 140 | 141 | defer :: Boolean -> Props 142 | defer = unsafeMkProps "defer" 143 | 144 | dir :: String -> Props 145 | dir = unsafeMkProps "dir" 146 | 147 | disabled :: Boolean -> Props 148 | disabled = unsafeMkProps "disabled" 149 | 150 | download :: String -> Props 151 | download = unsafeMkProps "download" 152 | 153 | draggable :: Boolean -> Props 154 | draggable = unsafeMkProps "draggable" 155 | 156 | encType :: String -> Props 157 | encType = unsafeMkProps "encType" 158 | 159 | form :: String -> Props 160 | form = unsafeMkProps "form" 161 | 162 | formAction :: String -> Props 163 | formAction = unsafeMkProps "formAction" 164 | 165 | formEncType :: String -> Props 166 | formEncType = unsafeMkProps "formEncType" 167 | 168 | formMethod :: String -> Props 169 | formMethod = unsafeMkProps "formMethod" 170 | 171 | formNoValidate :: Boolean -> Props 172 | formNoValidate = unsafeMkProps "formNoValidate" 173 | 174 | formTarget :: String -> Props 175 | formTarget = unsafeMkProps "formTarget" 176 | 177 | frameBorder :: String -> Props 178 | frameBorder = unsafeMkProps "frameBorder" 179 | 180 | headers :: String -> Props 181 | headers = unsafeMkProps "headers" 182 | 183 | height :: String -> Props 184 | height = unsafeMkProps "height" 185 | 186 | hidden :: Boolean -> Props 187 | hidden = unsafeMkProps "hidden" 188 | 189 | high :: String -> Props 190 | high = unsafeMkProps "high" 191 | 192 | href :: String -> Props 193 | href = unsafeMkProps "href" 194 | 195 | hrefLang :: String -> Props 196 | hrefLang = unsafeMkProps "hrefLang" 197 | 198 | htmlFor :: String -> Props 199 | htmlFor = unsafeMkProps "htmlFor" 200 | 201 | httpEquiv :: String -> Props 202 | httpEquiv = unsafeMkProps "httpEquiv" 203 | 204 | icon :: String -> Props 205 | icon = unsafeMkProps "icon" 206 | 207 | _id :: String -> Props 208 | _id = unsafeMkProps "id" 209 | 210 | inputMode :: String -> Props 211 | inputMode = unsafeMkProps "inputMode" 212 | 213 | integrity :: String -> Props 214 | integrity = unsafeMkProps "integrity" 215 | 216 | is :: String -> Props 217 | is = unsafeMkProps "is" 218 | 219 | key :: String -> Props 220 | key = unsafeMkProps "key" 221 | 222 | keyParams :: String -> Props 223 | keyParams = unsafeMkProps "keyParams" 224 | 225 | keyType :: String -> Props 226 | keyType = unsafeMkProps "keyType" 227 | 228 | kind :: String -> Props 229 | kind = unsafeMkProps "kind" 230 | 231 | label :: String -> Props 232 | label = unsafeMkProps "label" 233 | 234 | lang :: String -> Props 235 | lang = unsafeMkProps "lang" 236 | 237 | list :: String -> Props 238 | list = unsafeMkProps "list" 239 | 240 | loop :: Boolean -> Props 241 | loop = unsafeMkProps "loop" 242 | 243 | low :: String -> Props 244 | low = unsafeMkProps "low" 245 | 246 | manifest :: String -> Props 247 | manifest = unsafeMkProps "manifest" 248 | 249 | marginHeight :: String -> Props 250 | marginHeight = unsafeMkProps "marginHeight" 251 | 252 | marginWidth :: String -> Props 253 | marginWidth = unsafeMkProps "marginWidth" 254 | 255 | max :: String -> Props 256 | max = unsafeMkProps "max" 257 | 258 | maxLength :: String -> Props 259 | maxLength = unsafeMkProps "maxLength" 260 | 261 | media :: String -> Props 262 | media = unsafeMkProps "media" 263 | 264 | mediaGroup :: String -> Props 265 | mediaGroup = unsafeMkProps "mediaGroup" 266 | 267 | method :: String -> Props 268 | method = unsafeMkProps "method" 269 | 270 | min :: String -> Props 271 | min = unsafeMkProps "min" 272 | 273 | minLength :: String -> Props 274 | minLength = unsafeMkProps "minLength" 275 | 276 | multiple :: Boolean -> Props 277 | multiple = unsafeMkProps "multiple" 278 | 279 | muted :: Boolean -> Props 280 | muted = unsafeMkProps "muted" 281 | 282 | name :: String -> Props 283 | name = unsafeMkProps "name" 284 | 285 | nonce :: String -> Props 286 | nonce = unsafeMkProps "nonce" 287 | 288 | noValidate :: Boolean -> Props 289 | noValidate = unsafeMkProps "noValidate" 290 | 291 | open :: Boolean -> Props 292 | open = unsafeMkProps "open" 293 | 294 | optimum :: String -> Props 295 | optimum = unsafeMkProps "optimum" 296 | 297 | pattern :: String -> Props 298 | pattern = unsafeMkProps "pattern" 299 | 300 | placeholder :: String -> Props 301 | placeholder = unsafeMkProps "placeholder" 302 | 303 | poster :: String -> Props 304 | poster = unsafeMkProps "poster" 305 | 306 | preload :: String -> Props 307 | preload = unsafeMkProps "preload" 308 | 309 | profile :: String -> Props 310 | profile = unsafeMkProps "profile" 311 | 312 | radioGroup :: String -> Props 313 | radioGroup = unsafeMkProps "radioGroup" 314 | 315 | readOnly :: Boolean -> Props 316 | readOnly = unsafeMkProps "readOnly" 317 | 318 | rel :: String -> Props 319 | rel = unsafeMkProps "rel" 320 | 321 | required :: Boolean -> Props 322 | required = unsafeMkProps "required" 323 | 324 | reversed :: Boolean -> Props 325 | reversed = unsafeMkProps "reversed" 326 | 327 | role :: String -> Props 328 | role = unsafeMkProps "role" 329 | 330 | rows :: Int -> Props 331 | rows = unsafeMkProps "rows" 332 | 333 | rowSpan :: Int -> Props 334 | rowSpan = unsafeMkProps "rowSpan" 335 | 336 | sandbox :: String -> Props 337 | sandbox = unsafeMkProps "sandbox" 338 | 339 | scope :: String -> Props 340 | scope = unsafeMkProps "scope" 341 | 342 | scoped :: Boolean -> Props 343 | scoped = unsafeMkProps "scoped" 344 | 345 | scrolling :: String -> Props 346 | scrolling = unsafeMkProps "scrolling" 347 | 348 | seamless :: Boolean -> Props 349 | seamless = unsafeMkProps "seamless" 350 | 351 | selected :: Boolean -> Props 352 | selected = unsafeMkProps "selected" 353 | 354 | shape :: String -> Props 355 | shape = unsafeMkProps "shape" 356 | 357 | size :: Int -> Props 358 | size = unsafeMkProps "size" 359 | 360 | sizes :: String -> Props 361 | sizes = unsafeMkProps "sizes" 362 | 363 | span :: Int -> Props 364 | span = unsafeMkProps "span" 365 | 366 | spellCheck :: Boolean -> Props 367 | spellCheck = unsafeMkProps "spellCheck" 368 | 369 | src :: String -> Props 370 | src = unsafeMkProps "src" 371 | 372 | srcDoc :: String -> Props 373 | srcDoc = unsafeMkProps "srcDoc" 374 | 375 | srcLang :: String -> Props 376 | srcLang = unsafeMkProps "srcLang" 377 | 378 | srcSet :: String -> Props 379 | srcSet = unsafeMkProps "srcSet" 380 | 381 | start :: Int -> Props 382 | start = unsafeMkProps "start" 383 | 384 | step :: String -> Props 385 | step = unsafeMkProps "step" 386 | 387 | summary :: String -> Props 388 | summary = unsafeMkProps "summary" 389 | 390 | tabIndex :: Int -> Props 391 | tabIndex = unsafeMkProps "tabIndex" 392 | 393 | target :: String -> Props 394 | target = unsafeMkProps "target" 395 | 396 | title :: String -> Props 397 | title = unsafeMkProps "title" 398 | 399 | _type :: String -> Props 400 | _type = unsafeMkProps "type" 401 | 402 | useMap :: String -> Props 403 | useMap = unsafeMkProps "useMap" 404 | 405 | value :: String -> Props 406 | value = unsafeMkProps "value" 407 | 408 | valueArray :: Array String -> Props 409 | valueArray = unsafeMkProps "value" 410 | 411 | width :: String -> Props 412 | width = unsafeMkProps "width" 413 | 414 | wmode :: String -> Props 415 | wmode = unsafeMkProps "wmode" 416 | 417 | wrap :: String -> Props 418 | wrap = unsafeMkProps "wrap" 419 | 420 | -- RDFa Attributes 421 | about :: String -> Props 422 | about = unsafeMkProps "about" 423 | 424 | datatype :: String -> Props 425 | datatype = unsafeMkProps "datatype" 426 | 427 | inlist :: String -> Props 428 | inlist = unsafeMkProps "inlist" 429 | 430 | prefix :: String -> Props 431 | prefix = unsafeMkProps "prefix" 432 | 433 | property :: String -> Props 434 | property = unsafeMkProps "property" 435 | 436 | resource :: String -> Props 437 | resource = unsafeMkProps "resource" 438 | 439 | typeof :: String -> Props 440 | typeof = unsafeMkProps "typeof" 441 | 442 | vocab :: String -> Props 443 | vocab = unsafeMkProps "vocab" 444 | 445 | -- Non-standard Attributes 446 | autoCapitalize :: String -> Props 447 | autoCapitalize = unsafeMkProps "autoCapitalize" 448 | 449 | autoCorrect :: String -> Props 450 | autoCorrect = unsafeMkProps "autoCorrect" 451 | 452 | autoSave :: String -> Props 453 | autoSave = unsafeMkProps "autoSave" 454 | 455 | color :: String -> Props 456 | color = unsafeMkProps "color" 457 | 458 | itemProp :: String -> Props 459 | itemProp = unsafeMkProps "itemProp" 460 | 461 | itemScope :: Boolean -> Props 462 | itemScope = unsafeMkProps "itemScope" 463 | 464 | itemType :: String -> Props 465 | itemType = unsafeMkProps "itemType" 466 | 467 | itemID :: String -> Props 468 | itemID = unsafeMkProps "itemID" 469 | 470 | itemRef :: String -> Props 471 | itemRef = unsafeMkProps "itemRef" 472 | 473 | results :: Int -> Props 474 | results = unsafeMkProps "results" 475 | 476 | security :: String -> Props 477 | security = unsafeMkProps "security" 478 | 479 | unselectable :: Boolean -> Props 480 | unselectable = unsafeMkProps "unselectable" 481 | 482 | onAnimationStart :: (SyntheticAnimationEvent -> Effect Unit) -> Props 483 | onAnimationStart f = unsafeMkProps "onAnimationStart" (mkEffectFn1 f) 484 | 485 | onAnimationEnd :: (SyntheticAnimationEvent -> Effect Unit) -> Props 486 | onAnimationEnd f = unsafeMkProps "onAnimationEnd" (mkEffectFn1 f) 487 | 488 | onAnimationIteration :: (SyntheticAnimationEvent -> Effect Unit) -> Props 489 | onAnimationIteration f = unsafeMkProps "onAnimationIteration" (mkEffectFn1 f) 490 | 491 | onTransitionEnd :: (SyntheticTransitionEvent -> Effect Unit) -> Props 492 | onTransitionEnd f = unsafeMkProps "onTransitionEnd" (mkEffectFn1 f) 493 | 494 | onToggle :: (SyntheticEvent -> Effect Unit) -> Props 495 | onToggle f = unsafeMkProps "onToggle" (mkEffectFn1 f) 496 | 497 | onError :: (SyntheticEvent -> Effect Unit) -> Props 498 | onError f = unsafeMkProps "onError" (mkEffectFn1 f) 499 | 500 | onLoad :: (SyntheticEvent -> Effect Unit) -> Props 501 | onLoad f = unsafeMkProps "onLoad" (mkEffectFn1 f) 502 | 503 | onAbort :: (SyntheticEvent -> Effect Unit) -> Props 504 | onAbort f = unsafeMkProps "onAbort" (mkEffectFn1 f) 505 | 506 | onCanPlay :: (SyntheticEvent -> Effect Unit) -> Props 507 | onCanPlay f = unsafeMkProps "onCanPlay" (mkEffectFn1 f) 508 | 509 | onCanPlayThrough :: (SyntheticEvent -> Effect Unit) -> Props 510 | onCanPlayThrough f = unsafeMkProps "onCanPlayThrough" (mkEffectFn1 f) 511 | 512 | onDurationChange :: (SyntheticEvent -> Effect Unit) -> Props 513 | onDurationChange f = unsafeMkProps "onDurationChange" (mkEffectFn1 f) 514 | 515 | onEmptied :: (SyntheticEvent -> Effect Unit) -> Props 516 | onEmptied f = unsafeMkProps "onEmptied" (mkEffectFn1 f) 517 | 518 | onEncrypted :: (SyntheticEvent -> Effect Unit) -> Props 519 | onEncrypted f = unsafeMkProps "onEncrypted" (mkEffectFn1 f) 520 | 521 | onEnded :: (SyntheticEvent -> Effect Unit) -> Props 522 | onEnded f = unsafeMkProps "onEnded" (mkEffectFn1 f) 523 | 524 | onLoadedData :: (SyntheticEvent -> Effect Unit) -> Props 525 | onLoadedData f = unsafeMkProps "onLoadedData" (mkEffectFn1 f) 526 | 527 | onLoadedMetadata :: (SyntheticEvent -> Effect Unit) -> Props 528 | onLoadedMetadata f = unsafeMkProps "onLoadedMetadata" (mkEffectFn1 f) 529 | 530 | onLoadStart :: (SyntheticEvent -> Effect Unit) -> Props 531 | onLoadStart f = unsafeMkProps "onLoadStart" (mkEffectFn1 f) 532 | 533 | onPause :: (SyntheticEvent -> Effect Unit) -> Props 534 | onPause f = unsafeMkProps "onPause" (mkEffectFn1 f) 535 | 536 | onPlay :: (SyntheticEvent -> Effect Unit) -> Props 537 | onPlay f = unsafeMkProps "onPlay" (mkEffectFn1 f) 538 | 539 | onPlaying :: (SyntheticEvent -> Effect Unit) -> Props 540 | onPlaying f = unsafeMkProps "onPlaying" (mkEffectFn1 f) 541 | 542 | onProgress :: (SyntheticEvent -> Effect Unit) -> Props 543 | onProgress f = unsafeMkProps "onProgress" (mkEffectFn1 f) 544 | 545 | onRateChange :: (SyntheticEvent -> Effect Unit) -> Props 546 | onRateChange f = unsafeMkProps "onRateChange" (mkEffectFn1 f) 547 | 548 | onSeeked :: (SyntheticEvent -> Effect Unit) -> Props 549 | onSeeked f = unsafeMkProps "onSeeked" (mkEffectFn1 f) 550 | 551 | onSeeking :: (SyntheticEvent -> Effect Unit) -> Props 552 | onSeeking f = unsafeMkProps "onSeeking" (mkEffectFn1 f) 553 | 554 | onStalled :: (SyntheticEvent -> Effect Unit) -> Props 555 | onStalled f = unsafeMkProps "onStalled" (mkEffectFn1 f) 556 | 557 | onSuspend :: (SyntheticEvent -> Effect Unit) -> Props 558 | onSuspend f = unsafeMkProps "onSuspend" (mkEffectFn1 f) 559 | 560 | onTimeUpdate :: (SyntheticEvent -> Effect Unit) -> Props 561 | onTimeUpdate f = unsafeMkProps "onTimeUpdate" (mkEffectFn1 f) 562 | 563 | onVolumeChange :: (SyntheticEvent -> Effect Unit) -> Props 564 | onVolumeChange f = unsafeMkProps "onVolumeChange" (mkEffectFn1 f) 565 | 566 | onWaiting :: (SyntheticEvent -> Effect Unit) -> Props 567 | onWaiting f = unsafeMkProps "onWaiting" (mkEffectFn1 f) 568 | 569 | onCopy :: (SyntheticClipboardEvent -> Effect Unit) -> Props 570 | onCopy f = unsafeMkProps "onCopy" (mkEffectFn1 f) 571 | 572 | onCut :: (SyntheticClipboardEvent -> Effect Unit) -> Props 573 | onCut f = unsafeMkProps "onCut" (mkEffectFn1 f) 574 | 575 | onPaste :: (SyntheticClipboardEvent -> Effect Unit) -> Props 576 | onPaste f = unsafeMkProps "onPaste" (mkEffectFn1 f) 577 | 578 | onCompositionEnd :: (SyntheticCompositionEvent -> Effect Unit) -> Props 579 | onCompositionEnd f = unsafeMkProps "onCompositionEnd" (mkEffectFn1 f) 580 | 581 | onCompositionStart :: (SyntheticCompositionEvent -> Effect Unit) -> Props 582 | onCompositionStart f = unsafeMkProps "onCompositionStart" (mkEffectFn1 f) 583 | 584 | onCompositionUpdate :: (SyntheticCompositionEvent -> Effect Unit) -> Props 585 | onCompositionUpdate f = unsafeMkProps "onCompositionUpdate" (mkEffectFn1 f) 586 | 587 | onKeyDown :: (SyntheticKeyboardEvent -> Effect Unit) -> Props 588 | onKeyDown f = unsafeMkProps "onKeyDown" (mkEffectFn1 f) 589 | 590 | onKeyPress :: (SyntheticKeyboardEvent -> Effect Unit) -> Props 591 | onKeyPress f = unsafeMkProps "onKeyPress" (mkEffectFn1 f) 592 | 593 | onKeyUp :: (SyntheticKeyboardEvent -> Effect Unit) -> Props 594 | onKeyUp f = unsafeMkProps "onKeyUp" (mkEffectFn1 f) 595 | 596 | onFocus :: (SyntheticFocusEvent -> Effect Unit) -> Props 597 | onFocus f = unsafeMkProps "onFocus" (mkEffectFn1 f) 598 | 599 | onBlur :: (SyntheticFocusEvent -> Effect Unit) -> Props 600 | onBlur f = unsafeMkProps "onBlur" (mkEffectFn1 f) 601 | 602 | onChange :: (SyntheticInputEvent -> Effect Unit) -> Props 603 | onChange f = unsafeMkProps "onChange" (mkEffectFn1 f) 604 | 605 | onInput :: (SyntheticInputEvent -> Effect Unit) -> Props 606 | onInput f = unsafeMkProps "onInput" (mkEffectFn1 f) 607 | 608 | onInvalid :: (SyntheticInputEvent -> Effect Unit) -> Props 609 | onInvalid f = unsafeMkProps "onInvalid" (mkEffectFn1 f) 610 | 611 | onSubmit :: (SyntheticInputEvent -> Effect Unit) -> Props 612 | onSubmit f = unsafeMkProps "onSubmit" (mkEffectFn1 f) 613 | 614 | onClick :: (SyntheticMouseEvent -> Effect Unit) -> Props 615 | onClick f = unsafeMkProps "onClick" (mkEffectFn1 f) 616 | 617 | onContextMenu :: (SyntheticMouseEvent -> Effect Unit) -> Props 618 | onContextMenu f = unsafeMkProps "onContextMenu" (mkEffectFn1 f) 619 | 620 | onDoubleClick :: (SyntheticMouseEvent -> Effect Unit) -> Props 621 | onDoubleClick f = unsafeMkProps "onDoubleClick" (mkEffectFn1 f) 622 | 623 | onDrag :: (SyntheticMouseEvent -> Effect Unit) -> Props 624 | onDrag f = unsafeMkProps "onDrag" (mkEffectFn1 f) 625 | 626 | onDragEnd :: (SyntheticMouseEvent -> Effect Unit) -> Props 627 | onDragEnd f = unsafeMkProps "onDragEnd" (mkEffectFn1 f) 628 | 629 | onDragEnter :: (SyntheticMouseEvent -> Effect Unit) -> Props 630 | onDragEnter f = unsafeMkProps "onDragEnter" (mkEffectFn1 f) 631 | 632 | onDragExit :: (SyntheticMouseEvent -> Effect Unit) -> Props 633 | onDragExit f = unsafeMkProps "onDragExit" (mkEffectFn1 f) 634 | 635 | onDragLeave :: (SyntheticMouseEvent -> Effect Unit) -> Props 636 | onDragLeave f = unsafeMkProps "onDragLeave" (mkEffectFn1 f) 637 | 638 | onDragOver :: (SyntheticMouseEvent -> Effect Unit) -> Props 639 | onDragOver f = unsafeMkProps "onDragOver" (mkEffectFn1 f) 640 | 641 | onDragStart :: (SyntheticMouseEvent -> Effect Unit) -> Props 642 | onDragStart f = unsafeMkProps "onDragStart" (mkEffectFn1 f) 643 | 644 | onDrop :: (SyntheticMouseEvent -> Effect Unit) -> Props 645 | onDrop f = unsafeMkProps "onDrop" (mkEffectFn1 f) 646 | 647 | onMouseDown :: (SyntheticMouseEvent -> Effect Unit) -> Props 648 | onMouseDown f = unsafeMkProps "onMouseDown" (mkEffectFn1 f) 649 | 650 | onMouseEnter :: (SyntheticMouseEvent -> Effect Unit) -> Props 651 | onMouseEnter f = unsafeMkProps "onMouseEnter" (mkEffectFn1 f) 652 | 653 | onMouseLeave :: (SyntheticMouseEvent -> Effect Unit) -> Props 654 | onMouseLeave f = unsafeMkProps "onMouseLeave" (mkEffectFn1 f) 655 | 656 | onMouseMove :: (SyntheticMouseEvent -> Effect Unit) -> Props 657 | onMouseMove f = unsafeMkProps "onMouseMove" (mkEffectFn1 f) 658 | 659 | onMouseOut :: (SyntheticMouseEvent -> Effect Unit) -> Props 660 | onMouseOut f = unsafeMkProps "onMouseOut" (mkEffectFn1 f) 661 | 662 | onMouseOver :: (SyntheticMouseEvent -> Effect Unit) -> Props 663 | onMouseOver f = unsafeMkProps "onMouseOver" (mkEffectFn1 f) 664 | 665 | onMouseUp :: (SyntheticMouseEvent -> Effect Unit) -> Props 666 | onMouseUp f = unsafeMkProps "onMouseUp" (mkEffectFn1 f) 667 | 668 | onSelect :: (SyntheticEvent -> Effect Unit) -> Props 669 | onSelect f = unsafeMkProps "onSelect" (mkEffectFn1 f) 670 | 671 | onTouchCancel :: (SyntheticTouchEvent -> Effect Unit) -> Props 672 | onTouchCancel f = unsafeMkProps "onTouchCancel" (mkEffectFn1 f) 673 | 674 | onTouchEnd :: (SyntheticTouchEvent -> Effect Unit) -> Props 675 | onTouchEnd f = unsafeMkProps "onTouchEnd" (mkEffectFn1 f) 676 | 677 | onTouchMove :: (SyntheticTouchEvent -> Effect Unit) -> Props 678 | onTouchMove f = unsafeMkProps "onTouchMove" (mkEffectFn1 f) 679 | 680 | onTouchStart :: (SyntheticTouchEvent -> Effect Unit) -> Props 681 | onTouchStart f = unsafeMkProps "onTouchStart" (mkEffectFn1 f) 682 | 683 | onScroll :: (SyntheticUIEvent -> Effect Unit) -> Props 684 | onScroll f = unsafeMkProps "onScroll" (mkEffectFn1 f) 685 | 686 | onWheel :: (SyntheticWheelEvent -> Effect Unit) -> Props 687 | onWheel f = unsafeMkProps "onWheel" (mkEffectFn1 f) 688 | 689 | onAnimationStartCapture :: (SyntheticAnimationEvent -> Effect Unit) -> Props 690 | onAnimationStartCapture f = unsafeMkProps "onAnimationStartCapture" (mkEffectFn1 f) 691 | 692 | onAnimationEndCapture :: (SyntheticAnimationEvent -> Effect Unit) -> Props 693 | onAnimationEndCapture f = unsafeMkProps "onAnimationEndCapture" (mkEffectFn1 f) 694 | 695 | onAnimationIterationCapture :: (SyntheticAnimationEvent -> Effect Unit) -> Props 696 | onAnimationIterationCapture f = unsafeMkProps "onAnimationIterationCapture" (mkEffectFn1 f) 697 | 698 | onTransitionEndCapture :: (SyntheticTransitionEvent -> Effect Unit) -> Props 699 | onTransitionEndCapture f = unsafeMkProps "onTransitionEndCapture" (mkEffectFn1 f) 700 | 701 | onToggleCapture :: (SyntheticEvent -> Effect Unit) -> Props 702 | onToggleCapture f = unsafeMkProps "onToggleCapture" (mkEffectFn1 f) 703 | 704 | onErrorCapture :: (SyntheticEvent -> Effect Unit) -> Props 705 | onErrorCapture f = unsafeMkProps "onErrorCapture" (mkEffectFn1 f) 706 | 707 | onLoadCapture :: (SyntheticEvent -> Effect Unit) -> Props 708 | onLoadCapture f = unsafeMkProps "onLoadCapture" (mkEffectFn1 f) 709 | 710 | onAbortCapture :: (SyntheticEvent -> Effect Unit) -> Props 711 | onAbortCapture f = unsafeMkProps "onAbortCapture" (mkEffectFn1 f) 712 | 713 | onCanPlayCapture :: (SyntheticEvent -> Effect Unit) -> Props 714 | onCanPlayCapture f = unsafeMkProps "onCanPlayCapture" (mkEffectFn1 f) 715 | 716 | onCanPlayThroughCapture :: (SyntheticEvent -> Effect Unit) -> Props 717 | onCanPlayThroughCapture f = unsafeMkProps "onCanPlayThroughCapture" (mkEffectFn1 f) 718 | 719 | onDurationChangeCapture :: (SyntheticEvent -> Effect Unit) -> Props 720 | onDurationChangeCapture f = unsafeMkProps "onDurationChangeCapture" (mkEffectFn1 f) 721 | 722 | onEmptiedCapture :: (SyntheticEvent -> Effect Unit) -> Props 723 | onEmptiedCapture f = unsafeMkProps "onEmptiedCapture" (mkEffectFn1 f) 724 | 725 | onEncryptedCapture :: (SyntheticEvent -> Effect Unit) -> Props 726 | onEncryptedCapture f = unsafeMkProps "onEncryptedCapture" (mkEffectFn1 f) 727 | 728 | onEndedCapture :: (SyntheticEvent -> Effect Unit) -> Props 729 | onEndedCapture f = unsafeMkProps "onEndedCapture" (mkEffectFn1 f) 730 | 731 | onLoadedDataCapture :: (SyntheticEvent -> Effect Unit) -> Props 732 | onLoadedDataCapture f = unsafeMkProps "onLoadedDataCapture" (mkEffectFn1 f) 733 | 734 | onLoadedMetadataCapture :: (SyntheticEvent -> Effect Unit) -> Props 735 | onLoadedMetadataCapture f = unsafeMkProps "onLoadedMetadataCapture" (mkEffectFn1 f) 736 | 737 | onLoadStartCapture :: (SyntheticEvent -> Effect Unit) -> Props 738 | onLoadStartCapture f = unsafeMkProps "onLoadStartCapture" (mkEffectFn1 f) 739 | 740 | onPauseCapture :: (SyntheticEvent -> Effect Unit) -> Props 741 | onPauseCapture f = unsafeMkProps "onPauseCapture" (mkEffectFn1 f) 742 | 743 | onPlayCapture :: (SyntheticEvent -> Effect Unit) -> Props 744 | onPlayCapture f = unsafeMkProps "onPlayCapture" (mkEffectFn1 f) 745 | 746 | onPlayingCapture :: (SyntheticEvent -> Effect Unit) -> Props 747 | onPlayingCapture f = unsafeMkProps "onPlayingCapture" (mkEffectFn1 f) 748 | 749 | onProgressCapture :: (SyntheticEvent -> Effect Unit) -> Props 750 | onProgressCapture f = unsafeMkProps "onProgressCapture" (mkEffectFn1 f) 751 | 752 | onRateChangeCapture :: (SyntheticEvent -> Effect Unit) -> Props 753 | onRateChangeCapture f = unsafeMkProps "onRateChangeCapture" (mkEffectFn1 f) 754 | 755 | onSeekedCapture :: (SyntheticEvent -> Effect Unit) -> Props 756 | onSeekedCapture f = unsafeMkProps "onSeekedCapture" (mkEffectFn1 f) 757 | 758 | onSeekingCapture :: (SyntheticEvent -> Effect Unit) -> Props 759 | onSeekingCapture f = unsafeMkProps "onSeekingCapture" (mkEffectFn1 f) 760 | 761 | onStalledCapture :: (SyntheticEvent -> Effect Unit) -> Props 762 | onStalledCapture f = unsafeMkProps "onStalledCapture" (mkEffectFn1 f) 763 | 764 | onSuspendCapture :: (SyntheticEvent -> Effect Unit) -> Props 765 | onSuspendCapture f = unsafeMkProps "onSuspendCapture" (mkEffectFn1 f) 766 | 767 | onTimeUpdateCapture :: (SyntheticEvent -> Effect Unit) -> Props 768 | onTimeUpdateCapture f = unsafeMkProps "onTimeUpdateCapture" (mkEffectFn1 f) 769 | 770 | onVolumeChangeCapture :: (SyntheticEvent -> Effect Unit) -> Props 771 | onVolumeChangeCapture f = unsafeMkProps "onVolumeChangeCapture" (mkEffectFn1 f) 772 | 773 | onWaitingCapture :: (SyntheticEvent -> Effect Unit) -> Props 774 | onWaitingCapture f = unsafeMkProps "onWaitingCapture" (mkEffectFn1 f) 775 | 776 | onCopyCapture :: (SyntheticClipboardEvent -> Effect Unit) -> Props 777 | onCopyCapture f = unsafeMkProps "onCopyCapture" (mkEffectFn1 f) 778 | 779 | onCutCapture :: (SyntheticClipboardEvent -> Effect Unit) -> Props 780 | onCutCapture f = unsafeMkProps "onCutCapture" (mkEffectFn1 f) 781 | 782 | onPasteCapture :: (SyntheticClipboardEvent -> Effect Unit) -> Props 783 | onPasteCapture f = unsafeMkProps "onPasteCapture" (mkEffectFn1 f) 784 | 785 | onCompositionEndCapture :: (SyntheticCompositionEvent -> Effect Unit) -> Props 786 | onCompositionEndCapture f = unsafeMkProps "onCompositionEndCapture" (mkEffectFn1 f) 787 | 788 | onCompositionStartCapture :: (SyntheticCompositionEvent -> Effect Unit) -> Props 789 | onCompositionStartCapture f = unsafeMkProps "onCompositionStartCapture" (mkEffectFn1 f) 790 | 791 | onCompositionUpdateCapture :: (SyntheticCompositionEvent -> Effect Unit) -> Props 792 | onCompositionUpdateCapture f = unsafeMkProps "onCompositionUpdateCapture" (mkEffectFn1 f) 793 | 794 | onKeyDownCapture :: (SyntheticKeyboardEvent -> Effect Unit) -> Props 795 | onKeyDownCapture f = unsafeMkProps "onKeyDownCapture" (mkEffectFn1 f) 796 | 797 | onKeyPressCapture :: (SyntheticKeyboardEvent -> Effect Unit) -> Props 798 | onKeyPressCapture f = unsafeMkProps "onKeyPressCapture" (mkEffectFn1 f) 799 | 800 | onKeyUpCapture :: (SyntheticKeyboardEvent -> Effect Unit) -> Props 801 | onKeyUpCapture f = unsafeMkProps "onKeyUpCapture" (mkEffectFn1 f) 802 | 803 | onFocusCapture :: (SyntheticFocusEvent -> Effect Unit) -> Props 804 | onFocusCapture f = unsafeMkProps "onFocusCapture" (mkEffectFn1 f) 805 | 806 | onBlurCapture :: (SyntheticFocusEvent -> Effect Unit) -> Props 807 | onBlurCapture f = unsafeMkProps "onBlurCapture" (mkEffectFn1 f) 808 | 809 | onChangeCapture :: (SyntheticInputEvent -> Effect Unit) -> Props 810 | onChangeCapture f = unsafeMkProps "onChangeCapture" (mkEffectFn1 f) 811 | 812 | onInputCapture :: (SyntheticInputEvent -> Effect Unit) -> Props 813 | onInputCapture f = unsafeMkProps "onInputCapture" (mkEffectFn1 f) 814 | 815 | onInvalidCapture :: (SyntheticInputEvent -> Effect Unit) -> Props 816 | onInvalidCapture f = unsafeMkProps "onInvalidCapture" (mkEffectFn1 f) 817 | 818 | onSubmitCapture :: (SyntheticInputEvent -> Effect Unit) -> Props 819 | onSubmitCapture f = unsafeMkProps "onSubmitCapture" (mkEffectFn1 f) 820 | 821 | onClickCapture :: (SyntheticMouseEvent -> Effect Unit) -> Props 822 | onClickCapture f = unsafeMkProps "onClickCapture" (mkEffectFn1 f) 823 | 824 | onContextMenuCapture :: (SyntheticMouseEvent -> Effect Unit) -> Props 825 | onContextMenuCapture f = unsafeMkProps "onContextMenuCapture" (mkEffectFn1 f) 826 | 827 | onDoubleClickCapture :: (SyntheticMouseEvent -> Effect Unit) -> Props 828 | onDoubleClickCapture f = unsafeMkProps "onDoubleClickCapture" (mkEffectFn1 f) 829 | 830 | onDragCapture :: (SyntheticMouseEvent -> Effect Unit) -> Props 831 | onDragCapture f = unsafeMkProps "onDragCapture" (mkEffectFn1 f) 832 | 833 | onDragEndCapture :: (SyntheticMouseEvent -> Effect Unit) -> Props 834 | onDragEndCapture f = unsafeMkProps "onDragEndCapture" (mkEffectFn1 f) 835 | 836 | onDragEnterCapture :: (SyntheticMouseEvent -> Effect Unit) -> Props 837 | onDragEnterCapture f = unsafeMkProps "onDragEnterCapture" (mkEffectFn1 f) 838 | 839 | onDragExitCapture :: (SyntheticMouseEvent -> Effect Unit) -> Props 840 | onDragExitCapture f = unsafeMkProps "onDragExitCapture" (mkEffectFn1 f) 841 | 842 | onDragLeaveCapture :: (SyntheticMouseEvent -> Effect Unit) -> Props 843 | onDragLeaveCapture f = unsafeMkProps "onDragLeaveCapture" (mkEffectFn1 f) 844 | 845 | onDragOverCapture :: (SyntheticMouseEvent -> Effect Unit) -> Props 846 | onDragOverCapture f = unsafeMkProps "onDragOverCapture" (mkEffectFn1 f) 847 | 848 | onDragStartCapture :: (SyntheticMouseEvent -> Effect Unit) -> Props 849 | onDragStartCapture f = unsafeMkProps "onDragStartCapture" (mkEffectFn1 f) 850 | 851 | onDropCapture :: (SyntheticMouseEvent -> Effect Unit) -> Props 852 | onDropCapture f = unsafeMkProps "onDropCapture" (mkEffectFn1 f) 853 | 854 | onMouseDownCapture :: (SyntheticMouseEvent -> Effect Unit) -> Props 855 | onMouseDownCapture f = unsafeMkProps "onMouseDownCapture" (mkEffectFn1 f) 856 | 857 | onMouseEnterCapture :: (SyntheticMouseEvent -> Effect Unit) -> Props 858 | onMouseEnterCapture f = unsafeMkProps "onMouseEnterCapture" (mkEffectFn1 f) 859 | 860 | onMouseLeaveCapture :: (SyntheticMouseEvent -> Effect Unit) -> Props 861 | onMouseLeaveCapture f = unsafeMkProps "onMouseLeaveCapture" (mkEffectFn1 f) 862 | 863 | onMouseMoveCapture :: (SyntheticMouseEvent -> Effect Unit) -> Props 864 | onMouseMoveCapture f = unsafeMkProps "onMouseMoveCapture" (mkEffectFn1 f) 865 | 866 | onMouseOutCapture :: (SyntheticMouseEvent -> Effect Unit) -> Props 867 | onMouseOutCapture f = unsafeMkProps "onMouseOutCapture" (mkEffectFn1 f) 868 | 869 | onMouseOverCapture :: (SyntheticMouseEvent -> Effect Unit) -> Props 870 | onMouseOverCapture f = unsafeMkProps "onMouseOverCapture" (mkEffectFn1 f) 871 | 872 | onMouseUpCapture :: (SyntheticMouseEvent -> Effect Unit) -> Props 873 | onMouseUpCapture f = unsafeMkProps "onMouseUpCapture" (mkEffectFn1 f) 874 | 875 | onSelectCapture :: (SyntheticEvent -> Effect Unit) -> Props 876 | onSelectCapture f = unsafeMkProps "onSelectCapture" (mkEffectFn1 f) 877 | 878 | onTouchCancelCapture :: (SyntheticTouchEvent -> Effect Unit) -> Props 879 | onTouchCancelCapture f = unsafeMkProps "onTouchCancelCapture" (mkEffectFn1 f) 880 | 881 | onTouchEndCapture :: (SyntheticTouchEvent -> Effect Unit) -> Props 882 | onTouchEndCapture f = unsafeMkProps "onTouchEndCapture" (mkEffectFn1 f) 883 | 884 | onTouchMoveCapture :: (SyntheticTouchEvent -> Effect Unit) -> Props 885 | onTouchMoveCapture f = unsafeMkProps "onTouchMoveCapture" (mkEffectFn1 f) 886 | 887 | onTouchStartCapture :: (SyntheticTouchEvent -> Effect Unit) -> Props 888 | onTouchStartCapture f = unsafeMkProps "onTouchStartCapture" (mkEffectFn1 f) 889 | 890 | onScrollCapture :: (SyntheticUIEvent -> Effect Unit) -> Props 891 | onScrollCapture f = unsafeMkProps "onScrollCapture" (mkEffectFn1 f) 892 | 893 | onWheelCapture :: (SyntheticWheelEvent -> Effect Unit) -> Props 894 | onWheelCapture f = unsafeMkProps "onWheelCapture" (mkEffectFn1 f) 895 | 896 | ref :: Ref.RefHandler Ref.NativeNode -> Props 897 | ref = unsafeMkProps "ref" 898 | 899 | suppressContentEditableWarning :: Boolean -> Props 900 | suppressContentEditableWarning = unsafeMkProps "suppressContentEditableWarning" 901 | 902 | -- SVG attributes 903 | x :: Int -> Props 904 | x = unsafeMkProps "x" 905 | 906 | y :: Int -> Props 907 | y = unsafeMkProps "y" 908 | 909 | cx :: Int -> Props 910 | cx = unsafeMkProps "cx" 911 | 912 | cy :: Int -> Props 913 | cy = unsafeMkProps "cy" 914 | 915 | r :: Int -> Props 916 | r = unsafeMkProps "r" 917 | 918 | fill :: String -> Props 919 | fill = unsafeMkProps "fill" 920 | 921 | opacity :: Int -> Props 922 | opacity = unsafeMkProps "opacity" 923 | 924 | fillOpacity :: Int -> Props 925 | fillOpacity = unsafeMkProps "fillOpacity" 926 | 927 | stroke :: String -> Props 928 | stroke = unsafeMkProps "stroke" 929 | 930 | strokeWidth :: Int -> Props 931 | strokeWidth = unsafeMkProps "strokeWidth" 932 | 933 | points :: String -> Props 934 | points = unsafeMkProps "points" 935 | 936 | d :: String -> Props 937 | d = unsafeMkProps "d" 938 | 939 | viewBox :: String -> Props 940 | viewBox = unsafeMkProps "viewBox" 941 | -------------------------------------------------------------------------------- /src/React/DOM/SVG.purs: -------------------------------------------------------------------------------- 1 | module React.DOM.SVG where 2 | 3 | import React (ReactElement) 4 | import React.DOM (IsDynamic(..), mkDOM) 5 | import React.DOM.Props (Props) 6 | 7 | circle :: Array Props -> Array ReactElement -> ReactElement 8 | circle = mkDOM (IsDynamic false) "circle" 9 | 10 | circle' :: Array ReactElement -> ReactElement 11 | circle' = circle [] 12 | 13 | clipPath :: Array Props -> Array ReactElement -> ReactElement 14 | clipPath = mkDOM (IsDynamic false) "clipPath" 15 | 16 | clipPath' :: Array ReactElement -> ReactElement 17 | clipPath' = clipPath [] 18 | 19 | defs :: Array Props -> Array ReactElement -> ReactElement 20 | defs = mkDOM (IsDynamic false) "defs" 21 | 22 | defs' :: Array ReactElement -> ReactElement 23 | defs' = defs [] 24 | 25 | ellipse :: Array Props -> Array ReactElement -> ReactElement 26 | ellipse = mkDOM (IsDynamic false) "ellipse" 27 | 28 | ellipse' :: Array ReactElement -> ReactElement 29 | ellipse' = ellipse [] 30 | 31 | foreignObject :: Array Props -> Array ReactElement -> ReactElement 32 | foreignObject = mkDOM (IsDynamic false) "foreignObject" 33 | 34 | g :: Array Props -> Array ReactElement -> ReactElement 35 | g = mkDOM (IsDynamic false) "g" 36 | 37 | g' :: Array ReactElement -> ReactElement 38 | g' = g [] 39 | 40 | line :: Array Props -> Array ReactElement -> ReactElement 41 | line = mkDOM (IsDynamic false) "line" 42 | 43 | line' :: Array ReactElement -> ReactElement 44 | line' = line [] 45 | 46 | linearGradient :: Array Props -> Array ReactElement -> ReactElement 47 | linearGradient = mkDOM (IsDynamic false) "linearGradient" 48 | 49 | linearGradient' :: Array ReactElement -> ReactElement 50 | linearGradient' = linearGradient [] 51 | 52 | mask :: Array Props -> Array ReactElement -> ReactElement 53 | mask = mkDOM (IsDynamic false) "mask" 54 | 55 | mask' :: Array ReactElement -> ReactElement 56 | mask' = mask [] 57 | 58 | path :: Array Props -> Array ReactElement -> ReactElement 59 | path = mkDOM (IsDynamic false) "path" 60 | 61 | path' :: Array ReactElement -> ReactElement 62 | path' = path [] 63 | 64 | pattern :: Array Props -> Array ReactElement -> ReactElement 65 | pattern = mkDOM (IsDynamic false) "pattern" 66 | 67 | pattern' :: Array ReactElement -> ReactElement 68 | pattern' = pattern [] 69 | 70 | polygon :: Array Props -> Array ReactElement -> ReactElement 71 | polygon = mkDOM (IsDynamic false) "polygon" 72 | 73 | polygon' :: Array ReactElement -> ReactElement 74 | polygon' = polygon [] 75 | 76 | polyline :: Array Props -> Array ReactElement -> ReactElement 77 | polyline = mkDOM (IsDynamic false) "polyline" 78 | 79 | polyline' :: Array ReactElement -> ReactElement 80 | polyline' = polyline [] 81 | 82 | radialGradient :: Array Props -> Array ReactElement -> ReactElement 83 | radialGradient = mkDOM (IsDynamic false) "radialGradient" 84 | 85 | radialGradient' :: Array ReactElement -> ReactElement 86 | radialGradient' = radialGradient [] 87 | 88 | rect :: Array Props -> Array ReactElement -> ReactElement 89 | rect = mkDOM (IsDynamic false) "rect" 90 | 91 | rect' :: Array ReactElement -> ReactElement 92 | rect' = rect [] 93 | 94 | stop :: Array Props -> Array ReactElement -> ReactElement 95 | stop = mkDOM (IsDynamic false) "stop" 96 | 97 | stop' :: Array ReactElement -> ReactElement 98 | stop' = stop [] 99 | 100 | svg :: Array Props -> Array ReactElement -> ReactElement 101 | svg = mkDOM (IsDynamic false) "svg" 102 | 103 | svg' :: Array ReactElement -> ReactElement 104 | svg' = svg [] 105 | 106 | text :: Array Props -> Array ReactElement -> ReactElement 107 | text = mkDOM (IsDynamic false) "text" 108 | 109 | text' :: Array ReactElement -> ReactElement 110 | text' = text [] 111 | 112 | tspan :: Array Props -> Array ReactElement -> ReactElement 113 | tspan = mkDOM (IsDynamic false) "tspan" 114 | 115 | tspan' :: Array ReactElement -> ReactElement 116 | tspan' = tspan [] 117 | -------------------------------------------------------------------------------- /src/React/DOM/SVG/Dynamic.purs: -------------------------------------------------------------------------------- 1 | module React.DOM.SVG.Dynamic where 2 | 3 | import React (ReactElement) 4 | import React.DOM (IsDynamic(..), mkDOM) 5 | import React.DOM.Props (Props) 6 | 7 | circle :: Array Props -> Array ReactElement -> ReactElement 8 | circle = mkDOM (IsDynamic true) "circle" 9 | 10 | clipPath :: Array Props -> Array ReactElement -> ReactElement 11 | clipPath = mkDOM (IsDynamic true) "clipPath" 12 | 13 | defs :: Array Props -> Array ReactElement -> ReactElement 14 | defs = mkDOM (IsDynamic true) "defs" 15 | 16 | ellipse :: Array Props -> Array ReactElement -> ReactElement 17 | ellipse = mkDOM (IsDynamic true) "ellipse" 18 | 19 | g :: Array Props -> Array ReactElement -> ReactElement 20 | g = mkDOM (IsDynamic true) "g" 21 | 22 | line :: Array Props -> Array ReactElement -> ReactElement 23 | line = mkDOM (IsDynamic true) "line" 24 | 25 | linearGradient :: Array Props -> Array ReactElement -> ReactElement 26 | linearGradient = mkDOM (IsDynamic true) "linearGradient" 27 | 28 | mask :: Array Props -> Array ReactElement -> ReactElement 29 | mask = mkDOM (IsDynamic true) "mask" 30 | 31 | path :: Array Props -> Array ReactElement -> ReactElement 32 | path = mkDOM (IsDynamic true) "path" 33 | 34 | pattern :: Array Props -> Array ReactElement -> ReactElement 35 | pattern = mkDOM (IsDynamic true) "pattern" 36 | 37 | polygon :: Array Props -> Array ReactElement -> ReactElement 38 | polygon = mkDOM (IsDynamic true) "polygon" 39 | 40 | polyline :: Array Props -> Array ReactElement -> ReactElement 41 | polyline = mkDOM (IsDynamic true) "polyline" 42 | 43 | radialGradient :: Array Props -> Array ReactElement -> ReactElement 44 | radialGradient = mkDOM (IsDynamic true) "radialGradient" 45 | 46 | rect :: Array Props -> Array ReactElement -> ReactElement 47 | rect = mkDOM (IsDynamic true) "rect" 48 | 49 | stop :: Array Props -> Array ReactElement -> ReactElement 50 | stop = mkDOM (IsDynamic true) "stop" 51 | 52 | svg :: Array Props -> Array ReactElement -> ReactElement 53 | svg = mkDOM (IsDynamic true) "svg" 54 | 55 | text :: Array Props -> Array ReactElement -> ReactElement 56 | text = mkDOM (IsDynamic true) "text" 57 | 58 | tspan :: Array Props -> Array ReactElement -> ReactElement 59 | tspan = mkDOM (IsDynamic true) "tspan" 60 | -------------------------------------------------------------------------------- /src/React/Ref.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | export const createRef = React.createRef; 3 | 4 | export function liftCallbackRef(ref) { 5 | return { current: ref }; 6 | } 7 | 8 | export function getCurrentRef_(ref) { 9 | return ref.current; 10 | } 11 | -------------------------------------------------------------------------------- /src/React/Ref.purs: -------------------------------------------------------------------------------- 1 | module React.Ref 2 | ( Ref 3 | , RefHandler 4 | , ReactInstance 5 | , NativeNode 6 | , fromRef 7 | , fromEffect 8 | , getCurrentRef 9 | , createNodeRef 10 | , createInstanceRef 11 | ) where 12 | 13 | import Prelude 14 | 15 | import Data.Maybe (Maybe) 16 | import Data.Nullable (Nullable) 17 | import Data.Nullable as Nullable 18 | import Effect (Effect) 19 | import Effect.Uncurried (EffectFn1, mkEffectFn1, runEffectFn1) 20 | import Unsafe.Coerce (unsafeCoerce) 21 | 22 | --- | An instance of a React class. 23 | foreign import data ReactInstance :: Type 24 | 25 | --- | A platform-specific native layout node. On the web this will be a DOM 26 | --- | element (see `Web.HTML.HTMLElement`). 27 | foreign import data NativeNode :: Type 28 | 29 | foreign import data Ref :: Type -> Type 30 | 31 | type role Ref representational 32 | 33 | foreign import data RefHandler :: Type -> Type 34 | 35 | type role RefHandler representational 36 | 37 | foreign import createRef :: forall a. Effect (Ref a) 38 | 39 | foreign import liftCallbackRef :: forall a. Ref a -> Ref a 40 | 41 | createNodeRef :: Effect (Ref NativeNode) 42 | createNodeRef = createRef 43 | 44 | createInstanceRef :: Effect (Ref ReactInstance) 45 | createInstanceRef = createRef 46 | 47 | fromRef :: forall a. Ref a -> RefHandler a 48 | fromRef = unsafeCoerce 49 | 50 | fromEffect :: forall a. (Ref a -> Effect Unit) -> RefHandler a 51 | fromEffect f = unsafeCoerce $ mkEffectFn1 (f <<< liftCallbackRef) 52 | 53 | foreign import getCurrentRef_ :: forall a. EffectFn1 (Ref a) (Nullable a) 54 | 55 | getCurrentRef :: forall a. Ref a -> Effect (Maybe a) 56 | getCurrentRef ref = Nullable.toMaybe <$> runEffectFn1 getCurrentRef_ ref 57 | -------------------------------------------------------------------------------- /src/React/SyntheticEvent.js: -------------------------------------------------------------------------------- 1 | export function preventDefault(event) { 2 | return function() { 3 | return event.preventDefault(); 4 | }; 5 | } 6 | 7 | export function isDefaultPrevented(event) { 8 | return function() { 9 | return event.isDefaultPrevented(); 10 | }; 11 | } 12 | 13 | export function stopPropagation(event) { 14 | return function() { 15 | return event.stopPropagation(); 16 | }; 17 | } 18 | 19 | export function isPropagationStopped(event) { 20 | return function() { 21 | return event.isPropagationStopped(); 22 | }; 23 | } 24 | 25 | export function persist(event) { 26 | return function() { 27 | return event.persist(); 28 | }; 29 | } 30 | 31 | export function getModifierState(key) { 32 | return function(event) { 33 | return function() { 34 | return event.getModifierState(key); 35 | }; 36 | }; 37 | } 38 | 39 | export function unsafeGet(key) { 40 | return function (event) { 41 | return function () { 42 | return event[key]; 43 | }; 44 | }; 45 | } 46 | -------------------------------------------------------------------------------- /src/React/SyntheticEvent.purs: -------------------------------------------------------------------------------- 1 | -- | Synthethic event representation for React. 2 | -- | 3 | -- | https://reactjs.org/docs/events.html 4 | -- | https://reactjs.org/docs/handling-events.html 5 | -- | https://flow.org/en/docs/react/events/ 6 | -- | 7 | module React.SyntheticEvent 8 | ( SyntheticEvent 9 | , SyntheticAnimationEvent 10 | , SyntheticClipboardEvent 11 | , SyntheticCompositionEvent 12 | , SyntheticInputEvent 13 | , SyntheticKeyboardEvent 14 | , SyntheticFocusEvent 15 | , SyntheticMouseEvent 16 | , SyntheticTouchEvent 17 | , SyntheticTransitionEvent 18 | , SyntheticUIEvent 19 | , SyntheticWheelEvent 20 | 21 | , SyntheticEvent' 22 | , SyntheticAnimationEvent' 23 | , SyntheticClipboardEvent' 24 | , SyntheticCompositionEvent' 25 | , SyntheticFocusEvent' 26 | , SyntheticKeyboardEvent' 27 | , SyntheticMouseEvent' 28 | , SyntheticTouchEvent' 29 | , SyntheticTransitionEvent' 30 | , SyntheticUIEvent' 31 | , SyntheticWheelEvent' 32 | 33 | , SyntheticEvent_ 34 | 35 | , NativeEventTarget 36 | , NativeEvent 37 | , NativeDataTransfer 38 | , NativeAbstractView 39 | , NativeTouchList 40 | 41 | , bubbles 42 | , cancelable 43 | , currentTarget 44 | , defaultPrevented 45 | , eventPhase 46 | , isTrusted 47 | , nativeEvent 48 | , preventDefault 49 | , isDefaultPrevented 50 | , stopPropagation 51 | , isPropagationStopped 52 | , target 53 | , timeStamp 54 | , type_ 55 | , persist 56 | , animationName 57 | , clipboardData 58 | , data_ 59 | , relatedTarget 60 | , charCode 61 | , key 62 | , keyCode 63 | , locale 64 | , location 65 | , repeat 66 | , which 67 | , button 68 | , buttons 69 | , clientX 70 | , clientY 71 | , pageX 72 | , pageY 73 | , screenX 74 | , screenY 75 | , changedTouches 76 | , targetTouches 77 | , touches 78 | , altKey 79 | , ctrlKey 80 | , getModifierState 81 | , metaKey 82 | , shiftKey 83 | , propertyName 84 | , pseudoElement 85 | , elapsedTime 86 | , detail 87 | , view 88 | , deltaMode 89 | , deltaX 90 | , deltaY 91 | , deltaZ 92 | ) where 93 | 94 | import Prelude 95 | 96 | import Data.Symbol (class IsSymbol, reflectSymbol) 97 | import Effect (Effect) 98 | import Prim.Row as Row 99 | import Type.Proxy (Proxy(..)) 100 | 101 | type SyntheticEvent = SyntheticEvent_ (SyntheticEvent' ()) 102 | 103 | type SyntheticAnimationEvent = SyntheticEvent_ (SyntheticAnimationEvent' (SyntheticEvent' ())) 104 | 105 | type SyntheticClipboardEvent = SyntheticEvent_ (SyntheticClipboardEvent' (SyntheticEvent' ())) 106 | 107 | type SyntheticCompositionEvent = SyntheticEvent_ (SyntheticCompositionEvent' (SyntheticUIEvent' (SyntheticEvent' ()))) 108 | 109 | type SyntheticInputEvent = SyntheticEvent_ (SyntheticUIEvent' (SyntheticEvent' ())) 110 | 111 | type SyntheticKeyboardEvent = SyntheticEvent_ (SyntheticKeyboardEvent' (SyntheticUIEvent' (SyntheticEvent' ()))) 112 | 113 | type SyntheticFocusEvent = SyntheticEvent_ (SyntheticFocusEvent' (SyntheticUIEvent' (SyntheticEvent' ()))) 114 | 115 | type SyntheticMouseEvent = SyntheticEvent_ (SyntheticMouseEvent' (SyntheticUIEvent' (SyntheticEvent' ()))) 116 | 117 | type SyntheticTouchEvent = SyntheticEvent_ (SyntheticTouchEvent' (SyntheticUIEvent' (SyntheticEvent' ()))) 118 | 119 | type SyntheticTransitionEvent = SyntheticEvent_ (SyntheticTransitionEvent' (SyntheticEvent' ())) 120 | 121 | type SyntheticUIEvent = SyntheticEvent_ (SyntheticUIEvent' (SyntheticEvent' ())) 122 | 123 | type SyntheticWheelEvent = SyntheticEvent_ (SyntheticWheelEvent' (SyntheticMouseEvent' (SyntheticEvent' ()))) 124 | 125 | foreign import data SyntheticEvent_ :: Row Type -> Type 126 | 127 | type role SyntheticEvent_ representational 128 | 129 | foreign import data NativeEventTarget :: Type 130 | 131 | foreign import data NativeEvent :: Type 132 | 133 | foreign import data NativeDataTransfer :: Type 134 | 135 | foreign import data NativeAbstractView :: Type 136 | 137 | foreign import data NativeTouchList :: Type 138 | 139 | type SyntheticEvent' r = 140 | ( bubbles :: Boolean 141 | , cancelable :: Boolean 142 | , currentTarget :: NativeEventTarget 143 | , defaultPrevented :: Boolean 144 | , eventPhase :: Number 145 | , isTrusted :: Boolean 146 | , nativeEvent :: NativeEvent 147 | , target :: NativeEventTarget 148 | , timeStamp :: Number 149 | , type :: String 150 | | r 151 | ) 152 | 153 | type SyntheticAnimationEvent' r = 154 | ( animationName :: String 155 | , pseudoElement :: String 156 | , elapsedTime :: Number 157 | | r 158 | ) 159 | 160 | type SyntheticClipboardEvent' r = 161 | ( clipboardData :: NativeDataTransfer 162 | | r 163 | ) 164 | 165 | type SyntheticCompositionEvent' r = 166 | ( data :: String 167 | | r 168 | ) 169 | 170 | type SyntheticFocusEvent' r = 171 | ( relatedTarget :: NativeEventTarget 172 | | r 173 | ) 174 | 175 | type SyntheticKeyboardEvent' r = 176 | ( altKey :: Boolean 177 | , ctrlKey :: Boolean 178 | , getModifierState :: String -> Boolean 179 | , charCode :: Int 180 | , key :: String 181 | , keyCode :: Number 182 | , locale :: String 183 | , location :: Number 184 | , metaKey :: Boolean 185 | , repeat :: Boolean 186 | , shiftKey :: Boolean 187 | , which :: Number 188 | | r 189 | ) 190 | 191 | type SyntheticMouseEvent' r = 192 | ( altKey :: Boolean 193 | , button :: Number 194 | , buttons :: Number 195 | , clientX :: Number 196 | , clientY :: Number 197 | , ctrlKey :: Boolean 198 | , getModifierState :: String -> Boolean 199 | , metaKey :: Boolean 200 | , pageX :: Number 201 | , pageY :: Number 202 | , relatedTarget :: NativeEventTarget 203 | , screenX :: Number 204 | , screenY :: Number 205 | , shiftKey :: Boolean 206 | | r 207 | ) 208 | 209 | type SyntheticTouchEvent' r = 210 | ( altKey :: Boolean 211 | , changedTouches :: NativeTouchList 212 | , ctrlKey :: Boolean 213 | , getModifierState :: String -> Boolean 214 | , metaKey :: Boolean 215 | , targetTouches :: NativeTouchList 216 | , shiftKey :: Boolean 217 | , touches :: NativeTouchList 218 | | r 219 | ) 220 | 221 | type SyntheticTransitionEvent' r = 222 | ( propertyName :: String 223 | , pseudoElement :: String 224 | , elapsedTime :: Number 225 | | r 226 | ) 227 | 228 | type SyntheticUIEvent' r = 229 | ( detail :: Number 230 | , view :: NativeAbstractView 231 | | r 232 | ) 233 | 234 | type SyntheticWheelEvent' r = 235 | ( deltaMode :: Number 236 | , deltaX :: Number 237 | , deltaY :: Number 238 | , deltaZ :: Number 239 | | r 240 | ) 241 | 242 | bubbles :: forall r. SyntheticEvent_ (bubbles :: Boolean | r) -> Effect Boolean 243 | bubbles = get (Proxy :: Proxy "bubbles") 244 | 245 | cancelable :: forall r. SyntheticEvent_ (cancelable :: Boolean | r) -> Effect Boolean 246 | cancelable = get (Proxy :: Proxy "cancelable") 247 | 248 | currentTarget :: forall r. SyntheticEvent_ (currentTarget :: NativeEventTarget | r) -> Effect NativeEventTarget 249 | currentTarget = get (Proxy :: Proxy "currentTarget") 250 | 251 | defaultPrevented :: forall r. SyntheticEvent_ (defaultPrevented :: Boolean | r) -> Effect Boolean 252 | defaultPrevented = get (Proxy :: Proxy "defaultPrevented") 253 | 254 | eventPhase :: forall r. SyntheticEvent_ (eventPhase :: Number | r) -> Effect Number 255 | eventPhase = get (Proxy :: Proxy "eventPhase") 256 | 257 | isTrusted :: forall r. SyntheticEvent_ (isTrusted :: Boolean | r) -> Effect Boolean 258 | isTrusted = get (Proxy :: Proxy "isTrusted") 259 | 260 | nativeEvent :: forall r. SyntheticEvent_ (nativeEvent :: NativeEvent | r) -> Effect NativeEvent 261 | nativeEvent = get (Proxy :: Proxy "nativeEvent") 262 | 263 | target :: forall r. SyntheticEvent_ (target :: NativeEventTarget | r) -> Effect NativeEventTarget 264 | target = get (Proxy :: Proxy "target") 265 | 266 | timeStamp :: forall r. SyntheticEvent_ (timeStamp :: Number | r) -> Effect Number 267 | timeStamp = get (Proxy :: Proxy "timeStamp") 268 | 269 | type_ :: forall r. SyntheticEvent_ (type :: String | r) -> Effect String 270 | type_ = get (Proxy :: Proxy "type") 271 | 272 | animationName :: forall r. SyntheticEvent_ (animationName :: String | r) -> Effect String 273 | animationName = get (Proxy :: Proxy "animationName") 274 | 275 | clipboardData :: forall r. SyntheticEvent_ (clipboardData :: NativeDataTransfer | r) -> Effect NativeDataTransfer 276 | clipboardData = get (Proxy :: Proxy "clipboardData") 277 | 278 | data_ :: forall r. SyntheticEvent_ (data :: String | r) -> Effect String 279 | data_ = get (Proxy :: Proxy "data") 280 | 281 | relatedTarget :: forall r. SyntheticEvent_ (relatedTarget :: NativeEventTarget | r) -> Effect NativeEventTarget 282 | relatedTarget = get (Proxy :: Proxy "relatedTarget") 283 | 284 | charCode :: forall r. SyntheticEvent_ (charCode :: Int | r) -> Effect Int 285 | charCode = get (Proxy :: Proxy "charCode") 286 | 287 | key :: forall r. SyntheticEvent_ (key :: String | r) -> Effect String 288 | key = get (Proxy :: Proxy "key") 289 | 290 | keyCode :: forall r. SyntheticEvent_ (keyCode :: Number | r) -> Effect Number 291 | keyCode = get (Proxy :: Proxy "keyCode") 292 | 293 | locale :: forall r. SyntheticEvent_ (locale :: String | r) -> Effect String 294 | locale = get (Proxy :: Proxy "locale") 295 | 296 | location :: forall r. SyntheticEvent_ (location :: Number | r) -> Effect Number 297 | location = get (Proxy :: Proxy "location") 298 | 299 | repeat :: forall r. SyntheticEvent_ (repeat :: Boolean | r) -> Effect Boolean 300 | repeat = get (Proxy :: Proxy "repeat") 301 | 302 | which :: forall r. SyntheticEvent_ (which :: Number | r) -> Effect Number 303 | which = get (Proxy :: Proxy "which") 304 | 305 | button :: forall r. SyntheticEvent_ (button :: Number | r) -> Effect Number 306 | button = get (Proxy :: Proxy "button") 307 | 308 | buttons :: forall r. SyntheticEvent_ (buttons :: Number | r) -> Effect Number 309 | buttons = get (Proxy :: Proxy "buttons") 310 | 311 | clientX :: forall r. SyntheticEvent_ (clientX :: Number | r) -> Effect Number 312 | clientX = get (Proxy :: Proxy "clientX") 313 | 314 | clientY :: forall r. SyntheticEvent_ (clientY :: Number | r) -> Effect Number 315 | clientY = get (Proxy :: Proxy "clientY") 316 | 317 | pageX :: forall r. SyntheticEvent_ (pageX :: Number | r) -> Effect Number 318 | pageX = get (Proxy :: Proxy "pageX") 319 | 320 | pageY :: forall r. SyntheticEvent_ (pageY :: Number | r) -> Effect Number 321 | pageY = get (Proxy :: Proxy "pageY") 322 | 323 | screenX :: forall r. SyntheticEvent_ (screenX :: Number | r) -> Effect Number 324 | screenX = get (Proxy :: Proxy "screenX") 325 | 326 | screenY :: forall r. SyntheticEvent_ (screenY :: Number | r) -> Effect Number 327 | screenY = get (Proxy :: Proxy "screenY") 328 | 329 | changedTouches :: forall r. SyntheticEvent_ (changedTouches :: NativeTouchList | r) -> Effect NativeTouchList 330 | changedTouches = get (Proxy :: Proxy "changedTouches") 331 | 332 | targetTouches :: forall r. SyntheticEvent_ (targetTouches :: NativeTouchList | r) -> Effect NativeTouchList 333 | targetTouches = get (Proxy :: Proxy "targetTouches") 334 | 335 | touches :: forall r. SyntheticEvent_ (touches :: NativeTouchList | r) -> Effect NativeTouchList 336 | touches = get (Proxy :: Proxy "touches") 337 | 338 | altKey :: forall r. SyntheticEvent_ (altKey :: Boolean | r) -> Effect Boolean 339 | altKey = get (Proxy :: Proxy "altKey") 340 | 341 | ctrlKey :: forall r. SyntheticEvent_ (ctrlKey :: Boolean | r) -> Effect Boolean 342 | ctrlKey = get (Proxy :: Proxy "ctrlKey") 343 | 344 | metaKey :: forall r. SyntheticEvent_ (metaKey :: Boolean | r) -> Effect Boolean 345 | metaKey = get (Proxy :: Proxy "metaKey") 346 | 347 | shiftKey :: forall r. SyntheticEvent_ (shiftKey :: Boolean | r) -> Effect Boolean 348 | shiftKey = get (Proxy :: Proxy "shiftKey") 349 | 350 | propertyName :: forall r. SyntheticEvent_ (propertyName :: String | r) -> Effect String 351 | propertyName = get (Proxy :: Proxy "propertyName") 352 | 353 | pseudoElement :: forall r. SyntheticEvent_ (pseudoElement :: String | r) -> Effect String 354 | pseudoElement = get (Proxy :: Proxy "pseudoElement") 355 | 356 | elapsedTime :: forall r. SyntheticEvent_ (elapsedTime :: Number | r) -> Effect Number 357 | elapsedTime = get (Proxy :: Proxy "elapsedTime") 358 | 359 | detail :: forall r. SyntheticEvent_ (detail :: Number | r) -> Effect Number 360 | detail = get (Proxy :: Proxy "detail") 361 | 362 | view :: forall r. SyntheticEvent_ (view :: NativeAbstractView | r) -> Effect NativeAbstractView 363 | view = get (Proxy :: Proxy "view") 364 | 365 | deltaMode :: forall r. SyntheticEvent_ (deltaMode :: Number | r) -> Effect Number 366 | deltaMode = get (Proxy :: Proxy "deltaMode") 367 | 368 | deltaX :: forall r. SyntheticEvent_ (deltaX :: Number | r) -> Effect Number 369 | deltaX = get (Proxy :: Proxy "deltaX") 370 | 371 | deltaY :: forall r. SyntheticEvent_ (deltaY :: Number | r) -> Effect Number 372 | deltaY = get (Proxy :: Proxy "deltaY") 373 | 374 | deltaZ :: forall r. SyntheticEvent_ (deltaZ :: Number | r) -> Effect Number 375 | deltaZ = get (Proxy :: Proxy "deltaZ") 376 | 377 | foreign import preventDefault :: forall r. SyntheticEvent_ r -> Effect Unit 378 | 379 | foreign import isDefaultPrevented :: forall r. SyntheticEvent_ r -> Effect Boolean 380 | 381 | foreign import stopPropagation :: forall r. SyntheticEvent_ r -> Effect Unit 382 | 383 | foreign import isPropagationStopped :: forall r. SyntheticEvent_ r -> Effect Boolean 384 | 385 | foreign import persist :: forall r. SyntheticEvent_ r -> Effect Unit 386 | 387 | foreign import getModifierState 388 | :: forall r 389 | . String 390 | -> SyntheticEvent_ (getModifierState :: String -> Boolean | r) 391 | -> Effect Boolean 392 | 393 | get 394 | :: forall l r s a 395 | . Row.Cons l a r s 396 | => IsSymbol l 397 | => Proxy l 398 | -> SyntheticEvent_ s 399 | -> Effect a 400 | get l r = unsafeGet (reflectSymbol l) r 401 | 402 | foreign import unsafeGet :: forall r a. String -> SyntheticEvent_ r -> Effect a 403 | -------------------------------------------------------------------------------- /test/Main.purs: -------------------------------------------------------------------------------- 1 | module Test.Main where 2 | 3 | import Prelude 4 | 5 | import Effect (Effect) 6 | import Effect.Class.Console (log) 7 | 8 | main :: Effect Unit 9 | main = do 10 | log "🍝" 11 | log "You should add some tests." 12 | --------------------------------------------------------------------------------