@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 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 answer",
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 ? ' &check;' : '' }}\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 ? ' &check;' : '' }}\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.22.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.11.1",
14
- "@pie-lib/editable-html": "^11.10.1",
15
- "@pie-lib/math-rendering": "^3.11.1",
16
- "@pie-lib/render-ui": "^4.24.1",
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": "dfbd68c9112f6e358f0554c382c41a14549f5b8d"
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 ref={this.hiddenRef} style={{ position: 'absolute', visibility: 'hidden', top: 0, left: 0 }}>
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 key={index} classes={{ root: classes.menuRoot, selected: classes.selected }}>
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="Select answer"
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(),