@instructure/ui-menu 11.7.4-snapshot-135 → 11.7.4-snapshot-142

package/CHANGELOG.md

@@ -3,7 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
-## [11.7.4-snapshot-135](https://github.com/instructure/instructure-ui/compare/v11.7.3...v11.7.4-snapshot-135) (2026-07-24)
+## [11.7.4-snapshot-142](https://github.com/instructure/instructure-ui/compare/v11.7.3...v11.7.4-snapshot-142) (2026-07-24)
+
+
+### Bug Fixes
+
+* **many:** do not allow javascript: and data: hrefs ([4a0ac03](https://github.com/instructure/instructure-ui/commit/4a0ac038c6a4102646e04d27c1c3251f97367822))
 
 
 ### Features

package/es/Menu/v1/MenuItem/index.js

@@ -27,7 +27,7 @@ import { Component } from 'react';
 import keycode from 'keycode';
 import { IconCheckSolid, IconArrowOpenEndSolid } from '@instructure/ui-icons';
 import { omitProps, getElementType, withDeterministicId, callRenderProp } from '@instructure/ui-react-utils';
-import { createChainedFunction } from '@instructure/ui-utils';
+import { createChainedFunction, safeLinkProps } from '@instructure/ui-utils';
 import { isActiveElement, findDOMNode } from '@instructure/ui-dom-utils';
 import { withStyle } from '@instructure/emotion';
 import { MenuContext } from '../../../utils/v1/MenuContext.js';
@@ -194,17 +194,28 @@ let MenuItem = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, g
       onKeyDown,
       onKeyUp,
       type,
-      href,
+      href: rawHref,
       target
     } = this.props;
     const props = omitProps(this.props, MenuItem.allowedProps);
     const ElementType = this.elementType;
+    const {
+      href,
+      rel
+    } = safeLinkProps({
+      tag: typeof ElementType === 'string' ? ElementType : 'a',
+      attr: 'href',
+      href: rawHref,
+      target,
+      rel: this.props.rel
+    });
     return _jsx(ElementType, {
       tabIndex: -1 // note: tabIndex can be overridden by Menu or MenuItemGroup components
       ,
       ...props,
       href: href,
       target: target,
+      rel: rel,
       role: this.role,
       "aria-labelledby": this.labelId,
       "aria-disabled": disabled ? 'true' : undefined,

package/es/Menu/v2/MenuItem/index.js

@@ -27,7 +27,7 @@ import { Component } from 'react';
 import keycode from 'keycode';
 import { CheckInstUIIcon, ChevronRightInstUIIcon } from '@instructure/ui-icons';
 import { omitProps, getElementType, withDeterministicId, callRenderProp } from '@instructure/ui-react-utils';
-import { createChainedFunction } from '@instructure/ui-utils';
+import { createChainedFunction, safeLinkProps } from '@instructure/ui-utils';
 import { isActiveElement, findDOMNode } from '@instructure/ui-dom-utils';
 import { withStyleNew } from '@instructure/emotion';
 import { MenuContext } from '../../../utils/v1/MenuContext.js';
@@ -230,17 +230,28 @@ let MenuItem = (_dec = withDeterministicId(), _dec2 = withStyleNew(generateStyle
       onFocus,
       onBlur,
       type,
-      href,
+      href: rawHref,
       target
     } = this.props;
     const props = omitProps(this.props, MenuItem.allowedProps);
     const ElementType = this.elementType;
+    const {
+      href,
+      rel
+    } = safeLinkProps({
+      tag: typeof ElementType === 'string' ? ElementType : 'a',
+      attr: 'href',
+      href: rawHref,
+      target,
+      rel: this.props.rel
+    });
     return _jsx(ElementType, {
       tabIndex: -1 // note: tabIndex can be overridden by Menu or MenuItemGroup components
       ,
       ...props,
       href: href,
       target: target,
+      rel: rel,
       role: this.role,
       "aria-labelledby": this.labelId,
       "aria-disabled": disabled ? 'true' : undefined,

package/lib/Menu/v1/MenuItem/index.js

@@ -14,6 +14,7 @@ var _getElementType = require("@instructure/ui-react-utils/lib/getElementType.js
 var _withDeterministicId = require("@instructure/ui-react-utils/lib/DeterministicIdContext/withDeterministicId.js");
 var _callRenderProp = require("@instructure/ui-react-utils/lib/callRenderProp.js");
 var _createChainedFunction = require("@instructure/ui-utils/lib/createChainedFunction.js");
+var _safeLinkProps = require("@instructure/ui-utils/lib/safeLinkProps.js");
 var _isActiveElement = require("@instructure/ui-dom-utils/lib/isActiveElement.js");
 var _findDOMNode = require("@instructure/ui-dom-utils/lib/findDOMNode.js");
 var _emotion = require("@instructure/emotion");
@@ -205,17 +206,28 @@ let MenuItem = exports.MenuItem = (_dec = (0, _withDeterministicId.withDetermini
       onKeyDown,
       onKeyUp,
       type,
-      href,
+      href: rawHref,
       target
     } = this.props;
     const props = (0, _omitProps.omitProps)(this.props, MenuItem.allowedProps);
     const ElementType = this.elementType;
+    const {
+      href,
+      rel
+    } = (0, _safeLinkProps.safeLinkProps)({
+      tag: typeof ElementType === 'string' ? ElementType : 'a',
+      attr: 'href',
+      href: rawHref,
+      target,
+      rel: this.props.rel
+    });
     return (0, _jsxRuntime.jsx)(ElementType, {
       tabIndex: -1 // note: tabIndex can be overridden by Menu or MenuItemGroup components
       ,
       ...props,
       href: href,
       target: target,
+      rel: rel,
       role: this.role,
       "aria-labelledby": this.labelId,
       "aria-disabled": disabled ? 'true' : undefined,

package/lib/Menu/v2/MenuItem/index.js

@@ -13,6 +13,7 @@ var _getElementType = require("@instructure/ui-react-utils/lib/getElementType.js
 var _withDeterministicId = require("@instructure/ui-react-utils/lib/DeterministicIdContext/withDeterministicId.js");
 var _callRenderProp = require("@instructure/ui-react-utils/lib/callRenderProp.js");
 var _createChainedFunction = require("@instructure/ui-utils/lib/createChainedFunction.js");
+var _safeLinkProps = require("@instructure/ui-utils/lib/safeLinkProps.js");
 var _isActiveElement = require("@instructure/ui-dom-utils/lib/isActiveElement.js");
 var _findDOMNode = require("@instructure/ui-dom-utils/lib/findDOMNode.js");
 var _emotion = require("@instructure/emotion");
@@ -240,17 +241,28 @@ let MenuItem = exports.MenuItem = (_dec = (0, _withDeterministicId.withDetermini
       onFocus,
       onBlur,
       type,
-      href,
+      href: rawHref,
       target
     } = this.props;
     const props = (0, _omitProps.omitProps)(this.props, MenuItem.allowedProps);
     const ElementType = this.elementType;
+    const {
+      href,
+      rel
+    } = (0, _safeLinkProps.safeLinkProps)({
+      tag: typeof ElementType === 'string' ? ElementType : 'a',
+      attr: 'href',
+      href: rawHref,
+      target,
+      rel: this.props.rel
+    });
     return (0, _jsxRuntime.jsx)(ElementType, {
       tabIndex: -1 // note: tabIndex can be overridden by Menu or MenuItemGroup components
       ,
       ...props,
       href: href,
       target: target,
+      rel: rel,
       role: this.role,
       "aria-labelledby": this.labelId,
       "aria-disabled": disabled ? 'true' : undefined,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-menu",
-  "version": "11.7.4-snapshot-135",
+  "version": "11.7.4-snapshot-142",
   "description": "A dropdown menu component",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -16,27 +16,27 @@
   "dependencies": {
     "@babel/runtime": "^7.29.7",
     "keycode": "^2",
-    "@instructure/console": "11.7.4-snapshot-135",
-    "@instructure/emotion": "11.7.4-snapshot-135",
-    "@instructure/shared-types": "11.7.4-snapshot-135",
-    "@instructure/ui-a11y-utils": "11.7.4-snapshot-135",
-    "@instructure/ui-dom-utils": "11.7.4-snapshot-135",
-    "@instructure/ui-icons": "11.7.4-snapshot-135",
-    "@instructure/ui-position": "11.7.4-snapshot-135",
-    "@instructure/ui-popover": "11.7.4-snapshot-135",
-    "@instructure/ui-themes": "11.7.4-snapshot-135",
-    "@instructure/ui-react-utils": "11.7.4-snapshot-135",
-    "@instructure/ui-utils": "11.7.4-snapshot-135",
-    "@instructure/ui-view": "11.7.4-snapshot-135"
+    "@instructure/console": "11.7.4-snapshot-142",
+    "@instructure/shared-types": "11.7.4-snapshot-142",
+    "@instructure/emotion": "11.7.4-snapshot-142",
+    "@instructure/ui-a11y-utils": "11.7.4-snapshot-142",
+    "@instructure/ui-dom-utils": "11.7.4-snapshot-142",
+    "@instructure/ui-icons": "11.7.4-snapshot-142",
+    "@instructure/ui-popover": "11.7.4-snapshot-142",
+    "@instructure/ui-position": "11.7.4-snapshot-142",
+    "@instructure/ui-themes": "11.7.4-snapshot-142",
+    "@instructure/ui-utils": "11.7.4-snapshot-142",
+    "@instructure/ui-react-utils": "11.7.4-snapshot-142",
+    "@instructure/ui-view": "11.7.4-snapshot-142"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "16.3.2",
     "@testing-library/user-event": "^14.6.1",
     "vitest": "^4.1.9",
-    "@instructure/ui-axe-check": "11.7.4-snapshot-135",
-    "@instructure/ui-babel-preset": "11.7.4-snapshot-135",
-    "@instructure/ui-color-utils": "11.7.4-snapshot-135"
+    "@instructure/ui-babel-preset": "11.7.4-snapshot-142",
+    "@instructure/ui-color-utils": "11.7.4-snapshot-142",
+    "@instructure/ui-axe-check": "11.7.4-snapshot-142"
   },
   "peerDependencies": {
     "react": ">=18 <=19"

package/src/Menu/v1/MenuItem/index.tsx

@@ -32,7 +32,7 @@ import {
   withDeterministicId,
   callRenderProp
 } from '@instructure/ui-react-utils'
-import { createChainedFunction } from '@instructure/ui-utils'
+import { createChainedFunction, safeLinkProps } from '@instructure/ui-utils'
 import { isActiveElement, findDOMNode } from '@instructure/ui-dom-utils'
 import { withStyle } from '@instructure/emotion'
 
@@ -235,18 +235,34 @@ class MenuItem extends Component<MenuItemProps, MenuItemState> {
   }
 
   render() {
-    const { disabled, controls, onKeyDown, onKeyUp, type, href, target } =
-      this.props
+    const {
+      disabled,
+      controls,
+      onKeyDown,
+      onKeyUp,
+      type,
+      href: rawHref,
+      target
+    } = this.props
 
     const props = omitProps(this.props, MenuItem.allowedProps)
     const ElementType = this.elementType
 
+    const { href, rel } = safeLinkProps({
+      tag: typeof ElementType === 'string' ? ElementType : 'a',
+      attr: 'href',
+      href: rawHref,
+      target,
+      rel: (this.props as { rel?: string }).rel
+    })
+
     return (
       <ElementType
         tabIndex={-1} // note: tabIndex can be overridden by Menu or MenuItemGroup components
         {...props}
         href={href}
         target={target}
+        rel={rel}
         role={this.role}
         aria-labelledby={this.labelId}
         aria-disabled={disabled ? 'true' : undefined}

package/src/Menu/v2/MenuItem/index.tsx

@@ -32,7 +32,7 @@ import {
   withDeterministicId,
   callRenderProp
 } from '@instructure/ui-react-utils'
-import { createChainedFunction } from '@instructure/ui-utils'
+import { createChainedFunction, safeLinkProps } from '@instructure/ui-utils'
 import { isActiveElement, findDOMNode } from '@instructure/ui-dom-utils'
 import { withStyleNew } from '@instructure/emotion'
 
@@ -265,12 +265,19 @@ class MenuItem extends Component<MenuItemProps, MenuItemState> {
       onFocus,
       onBlur,
       type,
-      href,
+      href: rawHref,
       target
     } = this.props
 
     const props = omitProps(this.props, MenuItem.allowedProps)
     const ElementType = this.elementType
+    const { href, rel } = safeLinkProps({
+      tag: typeof ElementType === 'string' ? ElementType : 'a',
+      attr: 'href',
+      href: rawHref,
+      target,
+      rel: (this.props as { rel?: string }).rel
+    })
 
     return (
       <ElementType
@@ -278,6 +285,7 @@ class MenuItem extends Component<MenuItemProps, MenuItemState> {
         {...props}
         href={href}
         target={target}
+        rel={rel}
         role={this.role}
         aria-labelledby={this.labelId}
         aria-disabled={disabled ? 'true' : undefined}