Skip to content

Commit

Permalink
Generate ARIA props
Browse files Browse the repository at this point in the history
For now, they are all given the `String` type. After spot checking a few
on MDN, that is mostly accurate, even for seemingly numeric values such
`aria-valuemin`:
https://developer.mozilla.org/en-US/docs/Web/API/Element/ariaValueMin#value

NOTE: Despite React using `camelCase` for most props, ARIA props are
indeed `kebab-case`:
- https://react.dev/learn/writing-markup-with-jsx#3-camelcase-salls-most-of-the-things:~:text=the%20browser%20console.-,Pitfall,-For%20historical%20reasons
- https://legacy.reactjs.org/docs/accessibility.html#wai-aria

This could be improved with the following type definitions, but we’ll
leave this to the implementing developer now to check support in the
browser:
https://use-form.netlify.app/interfaces/_node_modules__types_react_index_d_.react.ariaattributes
  • Loading branch information
gasi committed May 13, 2024
1 parent cfed589 commit ae4fdbf
Show file tree
Hide file tree
Showing 2 changed files with 6,022 additions and 1 deletion.
5 changes: 4 additions & 1 deletion codegen/html.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
const { props, voids, types, typesByElement, reserved } = require("./consts")
const { ariaProps, props, voids, types, typesByElement, reserved } = require("./consts")

module.exports = () => ({
path: "Elmish/HTML/Generated.purs",
Expand Down Expand Up @@ -36,6 +36,9 @@ const printRow = (e, elProps) =>
elProps.length > 0
? `
( _data :: Object String
-- ARIA
, ${ariaProps.map(p => `${p} :: String`).join("\n , ")}
-- Props
, ${elProps.map(p => `${p} :: ${propType(e, p)}`).join("\n , ")}
)`
: "()"
Expand Down
Loading

0 comments on commit ae4fdbf

Please sign in to comment.