@pie-lib/mask-markup 1.22.1 → 1.24.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +32 -0
- package/lib/components/dropdown.js +20 -6
- package/lib/components/dropdown.js.map +1 -1
- package/package.json +6 -6
- package/src/components/dropdown.jsx +23 -5
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,38 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
# [1.24.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/mask-markup@1.13.46...@pie-lib/mask-markup@1.24.0) (2025-09-16)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* fixed pie-lib/icons import [PD-5126] ([dcb506c](https://github.com/pie-framework/pie-lib/commit/dcb506c914a177f6d88bf73247a023bfe71dac1f))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
### Features
|
|
15
|
+
|
|
16
|
+
* split pie-toolbox into multiple packages [PD-5126] ([7d55a25](https://github.com/pie-framework/pie-lib/commit/7d55a2552d084cd3d0d5c00dc77411b2ced2f5e2))
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
# [1.23.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/mask-markup@1.13.46...@pie-lib/mask-markup@1.23.0) (2025-09-16)
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
### Bug Fixes
|
|
26
|
+
|
|
27
|
+
* fixed pie-lib/icons import [PD-5126] ([dcb506c](https://github.com/pie-framework/pie-lib/commit/dcb506c914a177f6d88bf73247a023bfe71dac1f))
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
### Features
|
|
31
|
+
|
|
32
|
+
* split pie-toolbox into multiple packages [PD-5126] ([7d55a25](https://github.com/pie-framework/pie-lib/commit/7d55a2552d084cd3d0d5c00dc77411b2ced2f5e2))
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
|
|
37
|
+
|
|
6
38
|
## [1.22.1](https://github.com/pie-framework/pie-lib/compare/@pie-lib/mask-markup@1.13.46...@pie-lib/mask-markup@1.22.1) (2025-08-11)
|
|
7
39
|
|
|
8
40
|
|
|
@@ -45,8 +45,6 @@ var _styles = require("@material-ui/core/styles");
|
|
|
45
45
|
|
|
46
46
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
47
47
|
|
|
48
|
-
var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
|
|
49
|
-
|
|
50
48
|
var _renderUi = require("@pie-lib/render-ui");
|
|
51
49
|
|
|
52
50
|
var _mathRendering = require("@pie-lib/math-rendering");
|
|
@@ -242,14 +240,18 @@ var Dropdown = /*#__PURE__*/function (_React$Component) {
|
|
|
242
240
|
visibility: 'hidden',
|
|
243
241
|
top: 0,
|
|
244
242
|
left: 0
|
|
245
|
-
}
|
|
243
|
+
},
|
|
244
|
+
tabIndex: -1,
|
|
245
|
+
"aria-hidden": "true"
|
|
246
246
|
}, (choices || []).map(function (c, index) {
|
|
247
247
|
return /*#__PURE__*/_react["default"].createElement(_MenuItem["default"], {
|
|
248
248
|
key: index,
|
|
249
249
|
classes: {
|
|
250
250
|
root: classes.menuRoot,
|
|
251
251
|
selected: classes.selected
|
|
252
|
-
}
|
|
252
|
+
},
|
|
253
|
+
tabIndex: -1,
|
|
254
|
+
"aria-hidden": "true"
|
|
253
255
|
}, /*#__PURE__*/_react["default"].createElement("span", {
|
|
254
256
|
className: classes.label,
|
|
255
257
|
dangerouslySetInnerHTML: {
|
|
@@ -258,7 +260,9 @@ var Dropdown = /*#__PURE__*/function (_React$Component) {
|
|
|
258
260
|
}));
|
|
259
261
|
})), /*#__PURE__*/_react["default"].createElement(_InputLabel["default"], {
|
|
260
262
|
className: classes.srOnly,
|
|
261
|
-
id: labelId
|
|
263
|
+
id: labelId,
|
|
264
|
+
tabIndex: -1,
|
|
265
|
+
"aria-hidden": "true"
|
|
262
266
|
}, labelText), /*#__PURE__*/_react["default"].createElement(_Button["default"], {
|
|
263
267
|
ref: this.buttonRef,
|
|
264
268
|
style: _objectSpread(_objectSpread({}, this.state.menuWidth && {
|
|
@@ -279,7 +283,7 @@ var Dropdown = /*#__PURE__*/function (_React$Component) {
|
|
|
279
283
|
disabled: disabled,
|
|
280
284
|
id: buttonId,
|
|
281
285
|
role: "combobox",
|
|
282
|
-
"aria-label": "Select
|
|
286
|
+
"aria-label": "Select an option for ".concat(labelText),
|
|
283
287
|
"aria-labelledby": valueDisplayId
|
|
284
288
|
}, correctnessIcon, /*#__PURE__*/_react["default"].createElement("span", {
|
|
285
289
|
id: valueDisplayId,
|
|
@@ -392,6 +396,11 @@ var styles = function styles() {
|
|
|
392
396
|
pointerEvents: 'none',
|
|
393
397
|
color: _renderUi.color.text(),
|
|
394
398
|
marginLeft: '5px'
|
|
399
|
+
},
|
|
400
|
+
'&:focus, &:focus-visible': {
|
|
401
|
+
outline: "3px solid ".concat(_renderUi.color.tertiary()),
|
|
402
|
+
outlineOffset: '2px',
|
|
403
|
+
borderWidth: '3px'
|
|
395
404
|
}
|
|
396
405
|
},
|
|
397
406
|
disabledCorrect: {
|
|
@@ -431,6 +440,11 @@ var styles = function styles() {
|
|
|
431
440
|
menuRoot: {
|
|
432
441
|
color: _renderUi.color.text(),
|
|
433
442
|
backgroundColor: _renderUi.color.background(),
|
|
443
|
+
'&:focus, &:focus-visible': {
|
|
444
|
+
outline: "3px solid ".concat(_renderUi.color.tertiary()),
|
|
445
|
+
outlineOffset: '-1px' // keeps it inside the item
|
|
446
|
+
|
|
447
|
+
},
|
|
434
448
|
'&:focus': {
|
|
435
449
|
color: _renderUi.color.text(),
|
|
436
450
|
backgroundColor: _renderUi.color.background()
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/dropdown.jsx"],"names":["Dropdown","props","event","setState","anchorEl","currentTarget","value","previewValue","highlightedOptionId","previewRef","current","innerHTML","index","id","stateUpdate","choices","onChange","handleHighlight","handleClose","selectedValue","state","ref","elementRefs","preview","menuWidth","hiddenRef","React","createRef","buttonRef","clientWidth","prevProps","prevState","hiddenEl","dropdownJustOpened","forEach","containsLatex","querySelector","hasMathJax","mathHandled","newWidth","found","find","choice","label","trim","undefined","classes","correct","disabled","showCorrectAnswer","singleQuery","correctValue","open","Boolean","buttonId","menuId","valueDisplayId","disabledClass","disabledCorrect","disabledIncorrect","incrementedId","parseInt","labelId","labelText","correctnessIcon","correctnessIndicatorIcon","correctIcon","incorrectIcon","position","visibility","top","left","map","c","root","menuRoot","selected","__html","srOnly","minWidth","borderWidth","transition","handleClick","getLabel","selectMenu","vertical","horizontal","style","padding","role","disablePadding","optionId","handleSelect","handleHover","selectedIndicator","Component","PropTypes","string","bool","func","object","arrayOf","shape","styles","color","text","border","borderGray","borderRadius","justifyContent","backgroundColor","background","height","width","margin","textTransform","paddingRight","right","pointerEvents","marginLeft","borderColor","incorrectWithIcon","dropdownBackground","boxSizing","fontSize","overflow","white"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Button from '@material-ui/core/Button';\nimport InputLabel from '@material-ui/core/InputLabel';\nimport Menu from '@material-ui/core/Menu';\nimport MenuItem from '@material-ui/core/MenuItem';\nimport ArrowDropDownIcon from '@material-ui/icons/ArrowDropDown';\nimport ArrowDropUpIcon from '@material-ui/icons/ArrowDropUp';\nimport Close from '@material-ui/icons/Close';\nimport Check from '@material-ui/icons/Check';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\nimport isEqual from 'lodash/isEqual';\n\nimport { color } from '@pie-lib/render-ui';\nimport { renderMath } from '@pie-lib/math-rendering';\n\nclass Dropdown extends React.Component {\n static propTypes = {\n id: PropTypes.string,\n value: PropTypes.string,\n disabled: PropTypes.bool,\n onChange: PropTypes.func,\n classes: PropTypes.object,\n correct: PropTypes.bool,\n choices: PropTypes.arrayOf(PropTypes.shape({ value: PropTypes.string, label: PropTypes.string })),\n showCorrectAnswer: PropTypes.bool,\n singleQuery: PropTypes.bool,\n correctValue: PropTypes.string,\n };\n\n constructor(props) {\n super(props);\n\n this.state = {\n anchorEl: null,\n highlightedOptionId: null,\n menuWidth: null,\n previewValue: null,\n };\n this.hiddenRef = React.createRef();\n this.buttonRef = React.createRef();\n this.previewRef = React.createRef();\n this.elementRefs = [];\n }\n\n componentDidMount() {\n // measure hidden menu width once\n if (this.hiddenRef.current && this.state.menuWidth === null) {\n this.setState({ menuWidth: this.hiddenRef.current.clientWidth });\n }\n }\n\n componentDidUpdate(prevProps, prevState) {\n const hiddenEl = this.hiddenRef.current;\n\n const dropdownJustOpened = !prevState.anchorEl && this.state.anchorEl;\n if (dropdownJustOpened) {\n this.elementRefs.forEach((ref) => {\n if (!ref) return;\n\n const containsLatex = ref.querySelector('[data-latex], [data-raw]');\n const hasMathJax = ref.querySelector('mjx-container');\n const mathHandled = ref.querySelector('[data-math-handled=\"true\"]');\n\n if (containsLatex && (!mathHandled || !hasMathJax)) {\n renderMath(ref);\n }\n });\n }\n\n if (hiddenEl) {\n const newWidth = hiddenEl.clientWidth;\n if (newWidth !== this.state.menuWidth) {\n this.elementRefs.forEach((ref) => {\n if (ref) renderMath(ref);\n });\n\n renderMath(hiddenEl);\n this.setState({ menuWidth: newWidth });\n }\n }\n }\n\n handleClick = (event) => this.setState({ anchorEl: event.currentTarget });\n\n handleClose = () => {\n const { value } = this.props;\n this.setState({ anchorEl: null, previewValue: null, highlightedOptionId: null });\n // clear displayed preview if no selection\n if (!value && this.previewRef.current) {\n this.previewRef.current.innerHTML = '';\n }\n };\n\n handleHighlight = (index) => {\n const highlightedOptionId = `dropdown-option-${this.props.id}-${index}`;\n\n // preview on hover if nothing selected\n const stateUpdate = { highlightedOptionId };\n if (!this.props.value) {\n stateUpdate.previewValue = this.props.choices[index].value;\n }\n this.setState(stateUpdate);\n };\n\n handleSelect = (value, index) => {\n this.props.onChange(this.props.id, value);\n this.handleHighlight(index);\n this.handleClose();\n };\n\n handleHover = (index) => {\n const selectedValue = this.props.value;\n\n if (selectedValue) return;\n\n const highlightedOptionId = `dropdown-option-${this.props.id}-${index}`;\n const previewValue = this.state.previewValue;\n\n this.setState({ highlightedOptionId, previewValue }, () => {\n // On hover, preview the math-rendered content inside the button if no value is selected.\n const ref = this.elementRefs[index];\n const preview = this.previewRef.current;\n\n if (ref && preview) {\n preview.innerHTML = ref.innerHTML;\n }\n });\n };\n\n getLabel(choices, value) {\n const found = (choices || []).find((choice) => choice.value === value);\n\n return found ? found.label.trim() : undefined;\n }\n\n render() {\n const { classes, id, correct, disabled, value, choices, showCorrectAnswer, singleQuery, correctValue } = this.props;\n const { anchorEl } = this.state;\n const open = Boolean(anchorEl);\n const buttonId = `dropdown-button-${id}`;\n const menuId = `dropdown-menu-${id}`;\n const valueDisplayId = `dropdown-value-${id}`;\n\n // Determine the class for disabled state, view mode and evaluate mode\n let disabledClass;\n // Reset elementRefs before each render to avoid stale references\n this.elementRefs = [];\n\n if (disabled && correct !== undefined) {\n disabledClass = correct || showCorrectAnswer ? classes.disabledCorrect : classes.disabledIncorrect;\n }\n\n // Create distinct, visually hidden labels for each dropdown\n const incrementedId = parseInt(id, 10) + 1;\n const labelId = singleQuery ? 'Query-label' : `Query-label-${incrementedId}`;\n const labelText = singleQuery ? 'Query' : `Query ${incrementedId}`;\n\n // Changed from Select to Button for dropdown to enhance accessibility. This modification offers explicit control over aria attributes and focuses management, ensuring the dropdown is compliant with accessibility standards. The use of Button and Menu components allows for better handling of keyboard interactions and provides accessible labels and menus, aligning with WCAG guidelines and improving usability for assistive technology users.\n let correctnessIcon = null;\n if (disabled && correct !== undefined) {\n correctnessIcon =\n correct || showCorrectAnswer ? (\n <Check className={classNames(classes.correctnessIndicatorIcon, classes.correctIcon)} />\n ) : (\n <Close className={classNames(classes.correctnessIndicatorIcon, classes.incorrectIcon)} />\n );\n }\n\n return (\n <>\n <div ref={this.hiddenRef} style={{ position: 'absolute', visibility: 'hidden', top: 0, left: 0 }}>\n {(choices || []).map((c, index) => (\n <MenuItem key={index} classes={{ root: classes.menuRoot, selected: classes.selected }}>\n <span className={classes.label} dangerouslySetInnerHTML={{ __html: c.label }} />\n </MenuItem>\n ))}\n </div>\n <InputLabel className={classes.srOnly} id={labelId}>\n {labelText}\n </InputLabel>\n <Button\n ref={this.buttonRef}\n style={{\n ...(this.state.menuWidth && { minWidth: `calc(${this.state.menuWidth}px + 8px)` }),\n borderWidth: open ? '2px' : '1px',\n transition: 'border-width 0.2s ease-in-out',\n }}\n aria-controls={open ? menuId : undefined}\n aria-haspopup=\"listbox\"\n aria-expanded={open ? 'true' : undefined}\n aria-activedescendant={this.state.highlightedOptionId}\n onClick={this.handleClick}\n classes={{\n root: classes.root,\n disabled: disabledClass,\n }}\n disabled={disabled}\n id={buttonId}\n role=\"combobox\"\n aria-label=\"Select answer\"\n aria-labelledby={valueDisplayId}\n >\n {correctnessIcon}\n <span\n id={valueDisplayId}\n ref={this.previewRef}\n className={classes.label}\n dangerouslySetInnerHTML={{\n __html: correctValue\n ? correctValue\n : open && this.state.previewValue\n ? this.getLabel(choices, this.state.previewValue)\n : this.getLabel(choices, value) || '',\n }}\n />\n {open ? <ArrowDropUpIcon /> : <ArrowDropDownIcon />}\n </Button>\n <Menu\n id={menuId}\n anchorEl={anchorEl}\n className={classes.selectMenu}\n keepMounted\n open={open}\n onClose={this.handleClose}\n getContentAnchorEl={null}\n anchorOrigin={{ vertical: 'bottom', horizontal: 'left' }}\n transformOrigin={{ vertical: 'top', horizontal: 'left' }}\n PaperProps={this.state.menuWidth ? { style: { minWidth: this.state.menuWidth, padding: '4px' } } : undefined}\n MenuListProps={{\n 'aria-labelledby': buttonId,\n role: 'listbox',\n disablePadding: true,\n }}\n >\n {(choices || []).map((c, index) => {\n const optionId = `dropdown-option-${id}-${index}`;\n\n return (\n <MenuItem\n id={optionId}\n classes={{ root: classes.menuRoot, selected: classes.selected }}\n key={`${c.label}-${index}`}\n value={c.value}\n onClick={() => this.handleSelect(c.value, index)}\n role=\"option\"\n aria-selected={this.state.highlightedOptionId === optionId ? 'true' : undefined}\n onMouseOver={() => this.handleHover(index)}\n >\n <span\n ref={(ref) => (this.elementRefs[index] = ref)}\n className={classes.label}\n dangerouslySetInnerHTML={{ __html: c.label }}\n />\n <span\n className={classes.selectedIndicator}\n dangerouslySetInnerHTML={{ __html: c.value === value ? ' ✓' : '' }}\n />\n </MenuItem>\n );\n })}\n </Menu>\n </>\n );\n }\n}\n\nconst styles = () => ({\n root: {\n color: color.text(),\n border: `1px solid ${color.borderGray()}`,\n borderRadius: '4px',\n justifyContent: 'space-between',\n backgroundColor: color.background(),\n position: 'relative',\n height: '45px',\n width: 'fit-content',\n margin: '2px',\n textTransform: 'none',\n '& span': {\n paddingRight: '5px',\n },\n '& svg': {\n position: 'absolute',\n right: 0,\n top: 'calc(50% - 12px)',\n pointerEvents: 'none',\n color: color.text(),\n marginLeft: '5px',\n },\n },\n disabledCorrect: {\n borderWidth: '2px',\n borderColor: color.correct(),\n color: `${color.text()} !important`,\n },\n disabledIncorrect: {\n borderWidth: '2px',\n borderColor: color.incorrectWithIcon(),\n color: `${color.text()} !important`,\n },\n selectMenu: {\n backgroundColor: color.background(),\n border: `1px solid ${color.correct()} !important`,\n '&:hover': {\n border: `1px solid ${color.text()} `,\n borderColor: 'initial',\n },\n '&:focus': {\n border: `1px solid ${color.text()}`,\n borderColor: 'initial',\n },\n // remove default padding on the inner list\n '& .MuiList-root': {\n padding: 0,\n },\n },\n selected: {\n color: `${color.text()} !important`,\n backgroundColor: `${color.background()} !important`,\n '&:hover': {\n color: color.text(),\n backgroundColor: `${color.dropdownBackground()} !important`,\n },\n },\n menuRoot: {\n color: color.text(),\n backgroundColor: color.background(),\n '&:focus': {\n color: color.text(),\n backgroundColor: color.background(),\n },\n '&:hover': {\n color: color.text(),\n backgroundColor: color.dropdownBackground(),\n },\n boxSizing: 'border-box',\n padding: '25px',\n borderRadius: '4px',\n },\n label: {\n fontSize: 'max(1rem, 14px)',\n },\n selectedIndicator: {\n fontSize: 'max(1rem, 14px)',\n position: 'absolute',\n right: '10px',\n },\n srOnly: {\n position: 'absolute',\n left: '-10000px',\n top: 'auto',\n width: '1px',\n height: '1px',\n overflow: 'hidden',\n },\n correctnessIndicatorIcon: {\n color: `${color.white()} !important`,\n position: 'absolute',\n top: '-8px !important',\n left: '-8px',\n marginLeft: '0 !important',\n borderRadius: '50%',\n fontSize: '16px',\n padding: '2px',\n },\n correctIcon: {\n backgroundColor: color.correct(),\n },\n incorrectIcon: {\n backgroundColor: color.incorrectWithIcon(),\n },\n});\n\nexport default withStyles(styles)(Dropdown);\n"],"file":"dropdown.js"}
|
|
1
|
+
{"version":3,"sources":["../../src/components/dropdown.jsx"],"names":["Dropdown","props","event","setState","anchorEl","currentTarget","value","previewValue","highlightedOptionId","previewRef","current","innerHTML","index","id","stateUpdate","choices","onChange","handleHighlight","handleClose","selectedValue","state","ref","elementRefs","preview","menuWidth","hiddenRef","React","createRef","buttonRef","clientWidth","prevProps","prevState","hiddenEl","dropdownJustOpened","forEach","containsLatex","querySelector","hasMathJax","mathHandled","newWidth","found","find","choice","label","trim","undefined","classes","correct","disabled","showCorrectAnswer","singleQuery","correctValue","open","Boolean","buttonId","menuId","valueDisplayId","disabledClass","disabledCorrect","disabledIncorrect","incrementedId","parseInt","labelId","labelText","correctnessIcon","correctnessIndicatorIcon","correctIcon","incorrectIcon","position","visibility","top","left","map","c","root","menuRoot","selected","__html","srOnly","minWidth","borderWidth","transition","handleClick","getLabel","selectMenu","vertical","horizontal","style","padding","role","disablePadding","optionId","handleSelect","handleHover","selectedIndicator","Component","PropTypes","string","bool","func","object","arrayOf","shape","styles","color","text","border","borderGray","borderRadius","justifyContent","backgroundColor","background","height","width","margin","textTransform","paddingRight","right","pointerEvents","marginLeft","outline","tertiary","outlineOffset","borderColor","incorrectWithIcon","dropdownBackground","boxSizing","fontSize","overflow","white"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Button from '@material-ui/core/Button';\nimport InputLabel from '@material-ui/core/InputLabel';\nimport Menu from '@material-ui/core/Menu';\nimport MenuItem from '@material-ui/core/MenuItem';\nimport ArrowDropDownIcon from '@material-ui/icons/ArrowDropDown';\nimport ArrowDropUpIcon from '@material-ui/icons/ArrowDropUp';\nimport Close from '@material-ui/icons/Close';\nimport Check from '@material-ui/icons/Check';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\n\nimport { color } from '@pie-lib/render-ui';\nimport { renderMath } from '@pie-lib/math-rendering';\n\nclass Dropdown extends React.Component {\n static propTypes = {\n id: PropTypes.string,\n value: PropTypes.string,\n disabled: PropTypes.bool,\n onChange: PropTypes.func,\n classes: PropTypes.object,\n correct: PropTypes.bool,\n choices: PropTypes.arrayOf(PropTypes.shape({ value: PropTypes.string, label: PropTypes.string })),\n showCorrectAnswer: PropTypes.bool,\n singleQuery: PropTypes.bool,\n correctValue: PropTypes.string,\n };\n\n constructor(props) {\n super(props);\n\n this.state = {\n anchorEl: null,\n highlightedOptionId: null,\n menuWidth: null,\n previewValue: null,\n };\n this.hiddenRef = React.createRef();\n this.buttonRef = React.createRef();\n this.previewRef = React.createRef();\n this.elementRefs = [];\n }\n\n componentDidMount() {\n // measure hidden menu width once\n if (this.hiddenRef.current && this.state.menuWidth === null) {\n this.setState({ menuWidth: this.hiddenRef.current.clientWidth });\n }\n }\n\n componentDidUpdate(prevProps, prevState) {\n const hiddenEl = this.hiddenRef.current;\n\n const dropdownJustOpened = !prevState.anchorEl && this.state.anchorEl;\n if (dropdownJustOpened) {\n this.elementRefs.forEach((ref) => {\n if (!ref) return;\n\n const containsLatex = ref.querySelector('[data-latex], [data-raw]');\n const hasMathJax = ref.querySelector('mjx-container');\n const mathHandled = ref.querySelector('[data-math-handled=\"true\"]');\n\n if (containsLatex && (!mathHandled || !hasMathJax)) {\n renderMath(ref);\n }\n });\n }\n\n if (hiddenEl) {\n const newWidth = hiddenEl.clientWidth;\n if (newWidth !== this.state.menuWidth) {\n this.elementRefs.forEach((ref) => {\n if (ref) renderMath(ref);\n });\n\n renderMath(hiddenEl);\n this.setState({ menuWidth: newWidth });\n }\n }\n }\n\n handleClick = (event) => this.setState({ anchorEl: event.currentTarget });\n\n handleClose = () => {\n const { value } = this.props;\n this.setState({ anchorEl: null, previewValue: null, highlightedOptionId: null });\n // clear displayed preview if no selection\n if (!value && this.previewRef.current) {\n this.previewRef.current.innerHTML = '';\n }\n };\n\n handleHighlight = (index) => {\n const highlightedOptionId = `dropdown-option-${this.props.id}-${index}`;\n\n // preview on hover if nothing selected\n const stateUpdate = { highlightedOptionId };\n if (!this.props.value) {\n stateUpdate.previewValue = this.props.choices[index].value;\n }\n this.setState(stateUpdate);\n };\n\n handleSelect = (value, index) => {\n this.props.onChange(this.props.id, value);\n this.handleHighlight(index);\n this.handleClose();\n };\n\n handleHover = (index) => {\n const selectedValue = this.props.value;\n\n if (selectedValue) return;\n\n const highlightedOptionId = `dropdown-option-${this.props.id}-${index}`;\n const previewValue = this.state.previewValue;\n\n this.setState({ highlightedOptionId, previewValue }, () => {\n // On hover, preview the math-rendered content inside the button if no value is selected.\n const ref = this.elementRefs[index];\n const preview = this.previewRef.current;\n\n if (ref && preview) {\n preview.innerHTML = ref.innerHTML;\n }\n });\n };\n\n getLabel(choices, value) {\n const found = (choices || []).find((choice) => choice.value === value);\n\n return found ? found.label.trim() : undefined;\n }\n\n render() {\n const { classes, id, correct, disabled, value, choices, showCorrectAnswer, singleQuery, correctValue } = this.props;\n const { anchorEl } = this.state;\n const open = Boolean(anchorEl);\n const buttonId = `dropdown-button-${id}`;\n const menuId = `dropdown-menu-${id}`;\n const valueDisplayId = `dropdown-value-${id}`;\n\n // Determine the class for disabled state, view mode and evaluate mode\n let disabledClass;\n // Reset elementRefs before each render to avoid stale references\n this.elementRefs = [];\n\n if (disabled && correct !== undefined) {\n disabledClass = correct || showCorrectAnswer ? classes.disabledCorrect : classes.disabledIncorrect;\n }\n\n // Create distinct, visually hidden labels for each dropdown\n const incrementedId = parseInt(id, 10) + 1;\n const labelId = singleQuery ? 'Query-label' : `Query-label-${incrementedId}`;\n const labelText = singleQuery ? 'Query' : `Query ${incrementedId}`;\n\n // Changed from Select to Button for dropdown to enhance accessibility. This modification offers explicit control over aria attributes and focuses management, ensuring the dropdown is compliant with accessibility standards. The use of Button and Menu components allows for better handling of keyboard interactions and provides accessible labels and menus, aligning with WCAG guidelines and improving usability for assistive technology users.\n let correctnessIcon = null;\n if (disabled && correct !== undefined) {\n correctnessIcon =\n correct || showCorrectAnswer ? (\n <Check className={classNames(classes.correctnessIndicatorIcon, classes.correctIcon)} />\n ) : (\n <Close className={classNames(classes.correctnessIndicatorIcon, classes.incorrectIcon)} />\n );\n }\n\n return (\n <>\n <div\n ref={this.hiddenRef}\n style={{ position: 'absolute', visibility: 'hidden', top: 0, left: 0 }}\n tabIndex={-1}\n aria-hidden=\"true\"\n >\n {(choices || []).map((c, index) => (\n <MenuItem\n key={index}\n classes={{ root: classes.menuRoot, selected: classes.selected }}\n tabIndex={-1}\n aria-hidden=\"true\"\n >\n <span className={classes.label} dangerouslySetInnerHTML={{ __html: c.label }} />\n </MenuItem>\n ))}\n </div>\n <InputLabel className={classes.srOnly} id={labelId} tabIndex={-1} aria-hidden=\"true\">\n {labelText}\n </InputLabel>\n <Button\n ref={this.buttonRef}\n style={{\n ...(this.state.menuWidth && { minWidth: `calc(${this.state.menuWidth}px + 8px)` }),\n borderWidth: open ? '2px' : '1px',\n transition: 'border-width 0.2s ease-in-out',\n }}\n aria-controls={open ? menuId : undefined}\n aria-haspopup=\"listbox\"\n aria-expanded={open ? 'true' : undefined}\n aria-activedescendant={this.state.highlightedOptionId}\n onClick={this.handleClick}\n classes={{\n root: classes.root,\n disabled: disabledClass,\n }}\n disabled={disabled}\n id={buttonId}\n role=\"combobox\"\n aria-label={`Select an option for ${labelText}`}\n aria-labelledby={valueDisplayId}\n >\n {correctnessIcon}\n <span\n id={valueDisplayId}\n ref={this.previewRef}\n className={classes.label}\n dangerouslySetInnerHTML={{\n __html: correctValue\n ? correctValue\n : open && this.state.previewValue\n ? this.getLabel(choices, this.state.previewValue)\n : this.getLabel(choices, value) || '',\n }}\n />\n {open ? <ArrowDropUpIcon /> : <ArrowDropDownIcon />}\n </Button>\n <Menu\n id={menuId}\n anchorEl={anchorEl}\n className={classes.selectMenu}\n keepMounted\n open={open}\n onClose={this.handleClose}\n getContentAnchorEl={null}\n anchorOrigin={{ vertical: 'bottom', horizontal: 'left' }}\n transformOrigin={{ vertical: 'top', horizontal: 'left' }}\n PaperProps={this.state.menuWidth ? { style: { minWidth: this.state.menuWidth, padding: '4px' } } : undefined}\n MenuListProps={{\n 'aria-labelledby': buttonId,\n role: 'listbox',\n disablePadding: true,\n }}\n >\n {(choices || []).map((c, index) => {\n const optionId = `dropdown-option-${id}-${index}`;\n\n return (\n <MenuItem\n id={optionId}\n classes={{ root: classes.menuRoot, selected: classes.selected }}\n key={`${c.label}-${index}`}\n value={c.value}\n onClick={() => this.handleSelect(c.value, index)}\n role=\"option\"\n aria-selected={this.state.highlightedOptionId === optionId ? 'true' : undefined}\n onMouseOver={() => this.handleHover(index)}\n >\n <span\n ref={(ref) => (this.elementRefs[index] = ref)}\n className={classes.label}\n dangerouslySetInnerHTML={{ __html: c.label }}\n />\n <span\n className={classes.selectedIndicator}\n dangerouslySetInnerHTML={{ __html: c.value === value ? ' ✓' : '' }}\n />\n </MenuItem>\n );\n })}\n </Menu>\n </>\n );\n }\n}\n\nconst styles = () => ({\n root: {\n color: color.text(),\n border: `1px solid ${color.borderGray()}`,\n borderRadius: '4px',\n justifyContent: 'space-between',\n backgroundColor: color.background(),\n position: 'relative',\n height: '45px',\n width: 'fit-content',\n margin: '2px',\n textTransform: 'none',\n '& span': {\n paddingRight: '5px',\n },\n '& svg': {\n position: 'absolute',\n right: 0,\n top: 'calc(50% - 12px)',\n pointerEvents: 'none',\n color: color.text(),\n marginLeft: '5px',\n },\n '&:focus, &:focus-visible': {\n outline: `3px solid ${color.tertiary()}`,\n outlineOffset: '2px',\n borderWidth: '3px',\n },\n },\n disabledCorrect: {\n borderWidth: '2px',\n borderColor: color.correct(),\n color: `${color.text()} !important`,\n },\n disabledIncorrect: {\n borderWidth: '2px',\n borderColor: color.incorrectWithIcon(),\n color: `${color.text()} !important`,\n },\n selectMenu: {\n backgroundColor: color.background(),\n border: `1px solid ${color.correct()} !important`,\n '&:hover': {\n border: `1px solid ${color.text()} `,\n borderColor: 'initial',\n },\n '&:focus': {\n border: `1px solid ${color.text()}`,\n borderColor: 'initial',\n },\n // remove default padding on the inner list\n '& .MuiList-root': {\n padding: 0,\n },\n },\n selected: {\n color: `${color.text()} !important`,\n backgroundColor: `${color.background()} !important`,\n '&:hover': {\n color: color.text(),\n backgroundColor: `${color.dropdownBackground()} !important`,\n },\n },\n menuRoot: {\n color: color.text(),\n backgroundColor: color.background(),\n '&:focus, &:focus-visible': {\n outline: `3px solid ${color.tertiary()}`,\n outlineOffset: '-1px', // keeps it inside the item\n },\n '&:focus': {\n color: color.text(),\n backgroundColor: color.background(),\n },\n '&:hover': {\n color: color.text(),\n backgroundColor: color.dropdownBackground(),\n },\n boxSizing: 'border-box',\n padding: '25px',\n borderRadius: '4px',\n },\n label: {\n fontSize: 'max(1rem, 14px)',\n },\n selectedIndicator: {\n fontSize: 'max(1rem, 14px)',\n position: 'absolute',\n right: '10px',\n },\n srOnly: {\n position: 'absolute',\n left: '-10000px',\n top: 'auto',\n width: '1px',\n height: '1px',\n overflow: 'hidden',\n },\n correctnessIndicatorIcon: {\n color: `${color.white()} !important`,\n position: 'absolute',\n top: '-8px !important',\n left: '-8px',\n marginLeft: '0 !important',\n borderRadius: '50%',\n fontSize: '16px',\n padding: '2px',\n },\n correctIcon: {\n backgroundColor: color.correct(),\n },\n incorrectIcon: {\n backgroundColor: color.incorrectWithIcon(),\n },\n});\n\nexport default withStyles(styles)(Dropdown);\n"],"file":"dropdown.js"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pie-lib/mask-markup",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.24.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "src/index.js",
|
|
@@ -10,10 +10,10 @@
|
|
|
10
10
|
"dependencies": {
|
|
11
11
|
"@material-ui/core": "^3.9.3",
|
|
12
12
|
"@material-ui/icons": "^3.0.2",
|
|
13
|
-
"@pie-lib/drag": "^2.
|
|
14
|
-
"@pie-lib/editable-html": "^11.
|
|
15
|
-
"@pie-lib/math-rendering": "^3.
|
|
16
|
-
"@pie-lib/render-ui": "^4.
|
|
13
|
+
"@pie-lib/drag": "^2.13.0",
|
|
14
|
+
"@pie-lib/editable-html": "^11.12.0",
|
|
15
|
+
"@pie-lib/math-rendering": "^3.13.0",
|
|
16
|
+
"@pie-lib/render-ui": "^4.26.0",
|
|
17
17
|
"classnames": "^2.2.6",
|
|
18
18
|
"debug": "^4.1.1",
|
|
19
19
|
"immutable": "^4.0.0-rc.12",
|
|
@@ -31,5 +31,5 @@
|
|
|
31
31
|
"keywords": [],
|
|
32
32
|
"author": "",
|
|
33
33
|
"license": "ISC",
|
|
34
|
-
"gitHead": "
|
|
34
|
+
"gitHead": "749699607d4543321f1c2c2d0183d1fd97e0f4c4"
|
|
35
35
|
}
|
|
@@ -10,7 +10,6 @@ import Close from '@material-ui/icons/Close';
|
|
|
10
10
|
import Check from '@material-ui/icons/Check';
|
|
11
11
|
import { withStyles } from '@material-ui/core/styles';
|
|
12
12
|
import classNames from 'classnames';
|
|
13
|
-
import isEqual from 'lodash/isEqual';
|
|
14
13
|
|
|
15
14
|
import { color } from '@pie-lib/render-ui';
|
|
16
15
|
import { renderMath } from '@pie-lib/math-rendering';
|
|
@@ -170,14 +169,24 @@ class Dropdown extends React.Component {
|
|
|
170
169
|
|
|
171
170
|
return (
|
|
172
171
|
<>
|
|
173
|
-
<div
|
|
172
|
+
<div
|
|
173
|
+
ref={this.hiddenRef}
|
|
174
|
+
style={{ position: 'absolute', visibility: 'hidden', top: 0, left: 0 }}
|
|
175
|
+
tabIndex={-1}
|
|
176
|
+
aria-hidden="true"
|
|
177
|
+
>
|
|
174
178
|
{(choices || []).map((c, index) => (
|
|
175
|
-
<MenuItem
|
|
179
|
+
<MenuItem
|
|
180
|
+
key={index}
|
|
181
|
+
classes={{ root: classes.menuRoot, selected: classes.selected }}
|
|
182
|
+
tabIndex={-1}
|
|
183
|
+
aria-hidden="true"
|
|
184
|
+
>
|
|
176
185
|
<span className={classes.label} dangerouslySetInnerHTML={{ __html: c.label }} />
|
|
177
186
|
</MenuItem>
|
|
178
187
|
))}
|
|
179
188
|
</div>
|
|
180
|
-
<InputLabel className={classes.srOnly} id={labelId}>
|
|
189
|
+
<InputLabel className={classes.srOnly} id={labelId} tabIndex={-1} aria-hidden="true">
|
|
181
190
|
{labelText}
|
|
182
191
|
</InputLabel>
|
|
183
192
|
<Button
|
|
@@ -199,7 +208,7 @@ class Dropdown extends React.Component {
|
|
|
199
208
|
disabled={disabled}
|
|
200
209
|
id={buttonId}
|
|
201
210
|
role="combobox"
|
|
202
|
-
aria-label=
|
|
211
|
+
aria-label={`Select an option for ${labelText}`}
|
|
203
212
|
aria-labelledby={valueDisplayId}
|
|
204
213
|
>
|
|
205
214
|
{correctnessIcon}
|
|
@@ -289,6 +298,11 @@ const styles = () => ({
|
|
|
289
298
|
color: color.text(),
|
|
290
299
|
marginLeft: '5px',
|
|
291
300
|
},
|
|
301
|
+
'&:focus, &:focus-visible': {
|
|
302
|
+
outline: `3px solid ${color.tertiary()}`,
|
|
303
|
+
outlineOffset: '2px',
|
|
304
|
+
borderWidth: '3px',
|
|
305
|
+
},
|
|
292
306
|
},
|
|
293
307
|
disabledCorrect: {
|
|
294
308
|
borderWidth: '2px',
|
|
@@ -327,6 +341,10 @@ const styles = () => ({
|
|
|
327
341
|
menuRoot: {
|
|
328
342
|
color: color.text(),
|
|
329
343
|
backgroundColor: color.background(),
|
|
344
|
+
'&:focus, &:focus-visible': {
|
|
345
|
+
outline: `3px solid ${color.tertiary()}`,
|
|
346
|
+
outlineOffset: '-1px', // keeps it inside the item
|
|
347
|
+
},
|
|
330
348
|
'&:focus': {
|
|
331
349
|
color: color.text(),
|
|
332
350
|
backgroundColor: color.background(),
|