@instructure/ui-react-utils 10.26.1-snapshot-1 → 11.0.0

package/CHANGELOG.md

@@ -3,9 +3,30 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
-## [10.26.1-snapshot-1](https://github.com/instructure/instructure-ui/compare/v10.26.0...v10.26.1-snapshot-1) (2025-10-06)
+# [11.0.0](https://github.com/instructure/instructure-ui/compare/v10.26.0...v11.0.0) (2025-10-06)
 
-**Note:** Version bump only for package @instructure/ui-react-utils
+
+### Features
+
+* **many:** instUI v11 release ([36f5438](https://github.com/instructure/instructure-ui/commit/36f54382669186227ba24798bbf7201ef2f5cd4c))
+
+
+### BREAKING CHANGES
+
+* **many:** InstUI v11 contains the following breaking changes:
+- React 16 and 17 are no longer supported
+- remove `PropTypes` from all packages
+- remove `CodeEditor` component
+- remove `@instui/theme-registry` package
+- remove `@testable`, `@experimental`, `@hack` decorators
+- InstUISettingsProvider's `as` prop is removed
+- `canvas.use()`, `canvasHighContrast.use()` functions are removed
+- `canvasThemeLocal`, `canvasHighContrastThemeLocal` are removed
+- `variables` field on theme objects are removed
+- remove deprecated props from Table: Row's `isStacked`, Body's
+  `isStacked`, `hover`, and `headers`
+- `Table`'s `caption` prop is now required
+- `ui-dom-utils`'s `getComputedStyle` can now return `undefined`
 
 
 

package/es/DeterministicIdContext/withDeterministicId.js

@@ -52,12 +52,6 @@ const withDeterministicId = decorator(ComposedComponent => {
   });
   hoistNonReactStatics(WithDeterministicId, ComposedComponent);
 
-  // we have to pass these on, because sometimes users
-  // access propTypes of the component in other components
-  // eslint-disable-next-line react/forbid-foreign-prop-types
-  WithDeterministicId.propTypes = ComposedComponent.propTypes;
-  WithDeterministicId.defaultProps = ComposedComponent.defaultProps;
-
   // These static fields exist on InstUI components
   //@ts-expect-error fix this
   WithDeterministicId.allowedProps = ComposedComponent.allowedProps;

package/es/index.js

@@ -24,10 +24,7 @@
 
 /* list utils in alphabetical order */
 export { callRenderProp } from './callRenderProp';
-export { deprecated } from './deprecated';
 export { ensureSingleChild } from './ensureSingleChild';
-export { experimental } from './experimental';
-export { hack } from './hack';
 export { getDisplayName } from './getDisplayName';
 export { getElementType } from './getElementType';
 export { getInteraction } from './getInteraction';

package/lib/DeterministicIdContext/withDeterministicId.js

@@ -60,12 +60,6 @@ const withDeterministicId = exports.withDeterministicId = (0, _decorator.decorat
   });
   (0, _hoistNonReactStatics.default)(WithDeterministicId, ComposedComponent);
 
-  // we have to pass these on, because sometimes users
-  // access propTypes of the component in other components
-  // eslint-disable-next-line react/forbid-foreign-prop-types
-  WithDeterministicId.propTypes = ComposedComponent.propTypes;
-  WithDeterministicId.defaultProps = ComposedComponent.defaultProps;
-
   // These static fields exist on InstUI components
   //@ts-expect-error fix this
   WithDeterministicId.allowedProps = ComposedComponent.allowedProps;

package/lib/index.js

@@ -21,24 +21,12 @@ Object.defineProperty(exports, "callRenderProp", {
     return _callRenderProp.callRenderProp;
   }
 });
-Object.defineProperty(exports, "deprecated", {
-  enumerable: true,
-  get: function () {
-    return _deprecated.deprecated;
-  }
-});
 Object.defineProperty(exports, "ensureSingleChild", {
   enumerable: true,
   get: function () {
     return _ensureSingleChild.ensureSingleChild;
   }
 });
-Object.defineProperty(exports, "experimental", {
-  enumerable: true,
-  get: function () {
-    return _experimental.experimental;
-  }
-});
 Object.defineProperty(exports, "getDisplayName", {
   enumerable: true,
   get: function () {
@@ -57,12 +45,6 @@ Object.defineProperty(exports, "getInteraction", {
     return _getInteraction.getInteraction;
   }
 });
-Object.defineProperty(exports, "hack", {
-  enumerable: true,
-  get: function () {
-    return _hack.hack;
-  }
-});
 Object.defineProperty(exports, "matchComponentTypes", {
   enumerable: true,
   get: function () {
@@ -106,10 +88,7 @@ Object.defineProperty(exports, "withDeterministicId", {
   }
 });
 var _callRenderProp = require("./callRenderProp");
-var _deprecated = require("./deprecated");
 var _ensureSingleChild = require("./ensureSingleChild");
-var _experimental = require("./experimental");
-var _hack = require("./hack");
 var _getDisplayName = require("./getDisplayName");
 var _getElementType = require("./getElementType");
 var _getInteraction = require("./getInteraction");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-react-utils",
-  "version": "10.26.1-snapshot-1",
+  "version": "11.0.0",
   "description": "A React utility library made by Instructure Inc.",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -22,25 +22,24 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@instructure/ui-babel-preset": "10.26.1-snapshot-1",
+    "@instructure/ui-babel-preset": "11.0.0",
     "@testing-library/jest-dom": "^6.6.3",
-    "@testing-library/react": "^16.0.1",
+    "@testing-library/react": "15.0.7",
     "vitest": "^3.2.2"
   },
   "dependencies": {
     "@babel/runtime": "^7.27.6",
     "@emotion/is-prop-valid": "^1.3.1",
-    "@instructure/console": "10.26.1-snapshot-1",
-    "@instructure/shared-types": "10.26.1-snapshot-1",
-    "@instructure/ui-decorator": "10.26.1-snapshot-1",
-    "@instructure/ui-dom-utils": "10.26.1-snapshot-1",
-    "@instructure/ui-utils": "10.26.1-snapshot-1",
-    "hoist-non-react-statics": "^3.3.2",
-    "prop-types": "^15.8.1"
+    "@instructure/console": "11.0.0",
+    "@instructure/shared-types": "11.0.0",
+    "@instructure/ui-decorator": "11.0.0",
+    "@instructure/ui-dom-utils": "11.0.0",
+    "@instructure/ui-utils": "11.0.0",
+    "hoist-non-react-statics": "^3.3.2"
   },
   "peerDependencies": {
-    "react": ">=16.14 <=18",
-    "react-dom": ">=16.14 <=18"
+    "react": ">=18 <=19",
+    "react-dom": ">=18 <=19"
   },
   "publishConfig": {
     "access": "public"

package/src/DeterministicIdContext/withDeterministicId.tsx

@@ -79,12 +79,6 @@ const withDeterministicId = decorator((ComposedComponent: InstUIComponent) => {
 
   hoistNonReactStatics(WithDeterministicId, ComposedComponent)
 
-  // we have to pass these on, because sometimes users
-  // access propTypes of the component in other components
-  // eslint-disable-next-line react/forbid-foreign-prop-types
-  WithDeterministicId.propTypes = ComposedComponent.propTypes
-  WithDeterministicId.defaultProps = ComposedComponent.defaultProps
-
   // These static fields exist on InstUI components
   //@ts-expect-error fix this
   WithDeterministicId.allowedProps = ComposedComponent.allowedProps

package/src/getElementType.ts

@@ -22,7 +22,7 @@
  * SOFTWARE.
  */
 
-import { ComponentType } from 'react'
+import type { ComponentClass } from 'react'
 import { logWarn as warn } from '@instructure/console'
 import { AsElementType } from '@instructure/shared-types'
 
@@ -56,7 +56,7 @@ interface PropsObject {
  * @returns the element type
  */
 function getElementType<T extends PropsObject>(
-  Component: Omit<ComponentType<T>, 'propTypes'>,
+  Component: ComponentClass<T>,
   props: T,
   getDefault?: () => AsElementType<T>
 ) {

package/src/index.ts

@@ -24,10 +24,7 @@
 
 /* list utils in alphabetical order */
 export { callRenderProp } from './callRenderProp'
-export { deprecated } from './deprecated'
 export { ensureSingleChild } from './ensureSingleChild'
-export { experimental } from './experimental'
-export { hack } from './hack'
 export { getDisplayName } from './getDisplayName'
 export { getElementType } from './getElementType'
 export { getInteraction } from './getInteraction'
@@ -42,6 +39,7 @@ export {
   DeterministicIdContextProvider,
   withDeterministicId
 } from './DeterministicIdContext'
+
 export type { GetInteractionOptions } from './getInteraction'
 export type { InteractionType } from './getInteraction'
 export type {

package/src/safeCloneElement.ts

@@ -53,7 +53,7 @@ type GetProps<E extends ReactElement = ReactElement> = E extends
  * @param children
  */
 function safeCloneElement<
-  E extends ReactElement = ReactElement,
+  E extends ReactElement<any> = ReactElement,
   P extends GetProps<E> = GetProps<E>
 >(
   element: { ref?: any } & E,
@@ -122,11 +122,10 @@ Ignoring ref: ${originalRef}`
       ...mergedProps,
       ref(component: E) {
         if (cloneRefIsFunction) {
-          ;(cloneRef as (instance: any) => void)(component)
+          ;(cloneRef as (instance: unknown) => void)(component)
         } else {
           cloneRef.current = component
         }
-
         originalRefIsAFunction && originalRef(component)
       }
     },