@carbon/utilities-react 0.20.0-rc.0 → 0.21.0-rc.0

package/README.md

@@ -19,6 +19,44 @@ instead:
 yarn add @carbon/utilities-react
 ```
 
+## Maintainer information
+
+This package uses a convention-based multi-entry build. The supported public API
+consists of two parts.
+
+1. The root entrypoint
+
+```js
+import { utility } from '@carbon/utilities-react';
+```
+
+2. Any top-level module with a `src/<name>/index.*` file
+
+```js
+import { utility } from '@carbon/utilities-react/utility';
+```
+
+Review the
+[architecture decision record (ADR)](../../docs/decisions/0004-adopt-explicit-package-entrypoints-for-utilities.md)
+for more detail on how and why this approach is used.
+
+### Adding a utility
+
+1. Create a new top-level directory under `src/`
+2. Export the public API for that utility from `src/<name>/index.ts`,
+   `index.tsx`, `index.js`, or `index.jsx`
+3. Re-export it from `src/index.ts` if it should also be available from the
+   package root
+4. Build the package and verify the generated outputs under `es/<name>/index.*`
+   and `lib/<name>/index.js`
+
+```text
+src/
+  someReactUtility/
+    index.tsx
+    someReactUtility.tsx
+```
+
 ## 🙌 Contributing
 
 We're always looking for contributors to help us fix bugs, build new features,

package/es/StepFlow/index.d.ts

@@ -0,0 +1,2 @@
+import { i as StepGroup, n as useStepContext, r as StepContextType, t as StepProvider } from "../chunk.js";
+export { type StepContextType, StepGroup, StepProvider, useStepContext };

package/es/StepFlow/index.js

@@ -1 +1,3 @@
-import{StepGroup as p}from"./StepGroup";import{StepProvider as r,useStepContext as x}from"./StepContext";export{p as StepGroup,r as StepProvider,x as useStepContext};
+import { n as useStepContext, r as StepGroup, t as StepProvider } from "../chunk.js";
+
+export { StepGroup, StepProvider, useStepContext };

package/es/chunk.d.ts

@@ -0,0 +1,45 @@
+import React, { Dispatch, ReactNode, SetStateAction } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/StepFlow/StepGroup.d.ts
+interface StepGroupProps {
+  children: React.ReactNode;
+}
+/**
+ * Container for steps. The children are filtered for only truthy values (via Children.toArray)
+ * and only the current step is returned from this component based on the `currentStep` value
+ * from `useStepContext`.
+ */
+declare const StepGroup: ({
+  children
+}: StepGroupProps) => string | number | bigint | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | React.ReactPortal | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined>;
+//#endregion
+//#region src/StepFlow/types.d.ts
+/**
+ * This interface should be extended by the consumer to match their own unique
+ * use case given the fields within their own stepped experience.
+ */
+interface formStateType {
+  [key: string]: unknown;
+}
+interface StepContextType {
+  formState: formStateType;
+  setFormState: Dispatch<SetStateAction<formStateType>>;
+  totalSteps: number;
+  setTotalSteps: Dispatch<SetStateAction<number>>;
+  currentStep: number;
+  handleGoToStep: (step: number) => void;
+  handleNext: () => void;
+  handlePrevious: () => void;
+}
+//#endregion
+//#region src/StepFlow/StepContext.d.ts
+interface StepProviderProps {
+  children: ReactNode;
+}
+declare const StepProvider: ({
+  children
+}: StepProviderProps) => react_jsx_runtime0.JSX.Element;
+declare const useStepContext: () => StepContextType;
+//#endregion
+export { StepGroup as i, useStepContext as n, StepContextType as r, StepProvider as t };

package/es/chunk.js

@@ -0,0 +1,60 @@
+import React, { createContext, useContext, useEffect, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/StepFlow/StepGroup.tsx
+/**
+* Copyright IBM Corp. 2025, 2025
+*
+* This source code is licensed under the Apache-2.0 license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+/**
+* Container for steps. The children are filtered for only truthy values (via Children.toArray)
+* and only the current step is returned from this component based on the `currentStep` value
+* from `useStepContext`.
+*/
+const StepGroup = ({ children }) => {
+	const { setTotalSteps, currentStep } = useStepContext();
+	const childrenArray = React.Children.toArray(children);
+	useEffect(() => {
+		setTotalSteps(childrenArray.length);
+	}, [childrenArray.length, setTotalSteps]);
+	return childrenArray[currentStep - 1];
+};
+
+//#endregion
+//#region src/StepFlow/StepContext.tsx
+/**
+* Copyright IBM Corp. 2025, 2025
+*
+* This source code is licensed under the Apache-2.0 license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+const StepContext = createContext(void 0);
+const StepProvider = ({ children }) => {
+	const [totalSteps, setTotalSteps] = useState(1);
+	const [currentStep, setCurrentStep] = useState(1);
+	const [formState, setFormState] = useState({});
+	const context = {
+		formState,
+		setFormState,
+		totalSteps,
+		setTotalSteps,
+		currentStep,
+		handleGoToStep: (step) => setCurrentStep(step),
+		handleNext: () => setCurrentStep((step) => step + 1),
+		handlePrevious: () => setCurrentStep((step) => step - 1)
+	};
+	return /* @__PURE__ */ jsx(StepContext.Provider, {
+		value: context,
+		children
+	});
+};
+const useStepContext = () => {
+	const context = useContext(StepContext);
+	if (context === void 0) throw new Error("Context hook used outside of Step provider");
+	return context;
+};
+
+//#endregion
+export { useStepContext as n, StepGroup as r, StepProvider as t };

package/es/index.d.ts

@@ -0,0 +1,5 @@
+import { getInteractiveContent, getRoleContent, useInteractiveChildrenNeedDescription, useNoInteractiveChildren } from "./useNoInteractiveChildren/index.js";
+import { i as StepGroup, n as useStepContext, r as StepContextType, t as StepProvider } from "./chunk.js";
+import "./StepFlow/index.js";
+export * from "@carbon/utilities";
+export { type StepContextType, StepGroup, StepProvider, getInteractiveContent, getRoleContent, useInteractiveChildrenNeedDescription, useNoInteractiveChildren, useStepContext };

package/es/index.js

@@ -1 +1,6 @@
-export*from"@carbon/utilities";export*from"./useNoInteractiveChildren";export*from"./StepFlow";
+import { getInteractiveContent, getRoleContent, useInteractiveChildrenNeedDescription, useNoInteractiveChildren } from "./useNoInteractiveChildren/index.js";
+import { n as useStepContext, r as StepGroup, t as StepProvider } from "./chunk.js";
+
+export * from "@carbon/utilities"
+
+export { StepGroup, StepProvider, getInteractiveContent, getRoleContent, useInteractiveChildrenNeedDescription, useNoInteractiveChildren, useStepContext };

package/es/useNoInteractiveChildren/index.d.ts

@@ -0,0 +1,21 @@
+//#region src/useNoInteractiveChildren/index.d.ts
+declare function useNoInteractiveChildren(ref: any, message?: string): void;
+declare function useInteractiveChildrenNeedDescription(ref: any, message?: string): void;
+/**
+ * Determines if a given DOM node has interactive content, or is itself
+ * interactive. It returns the interactive node if one is found
+ *
+ * @param {HTMLElement} node
+ * @returns {HTMLElement}
+ */
+declare function getInteractiveContent(node: HTMLElement): HTMLElement;
+/**
+ * Determines if a given DOM node has a role, or has itself a role.
+ * It returns the node with a role if one is found
+ *
+ * @param {HTMLElement} node
+ * @returns {HTMLElement}
+ */
+declare function getRoleContent(node: HTMLElement): HTMLElement;
+//#endregion
+export { getInteractiveContent, getRoleContent, useInteractiveChildrenNeedDescription, useNoInteractiveChildren };

package/es/useNoInteractiveChildren/index.js

@@ -1,5 +1,80 @@
-import{useEffect as u}from"react";function f(r,e="component should have no interactive child nodes"){u(()=>{if(process.env.NODE_ENV==="production")return;const{current:t}=r,n=t?o(t):null;if(n){const i=`Error: ${e}.
+import { useEffect } from "react";
 
-Instead found: ${n.outerHTML}`;throw console.error(i),new Error(i)}},[e,r])}function l(r,e="interactive child node(s) should have an `aria-describedby` property"){u(()=>{if(process.env.NODE_ENV==="production")return;const{current:t}=r,n=t?o(t):null;if(n&&!n.hasAttribute("aria-describedby"))throw new Error(`Error: ${e}.
+//#region src/useNoInteractiveChildren/index.jsx
+/**
+* Copyright IBM Corp. 2016, 2026
+*
+* This source code is licensed under the Apache-2.0 license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+function useNoInteractiveChildren(ref, message = "component should have no interactive child nodes") {
+	useEffect(() => {
+		if (process.env.NODE_ENV === "production") return;
+		const { current } = ref;
+		const node = current ? getInteractiveContent(current) : null;
+		if (node) {
+			const errorMessage = `Error: ${message}.\n\nInstead found: ${node.outerHTML}`;
+			console.error(errorMessage);
+			throw new Error(errorMessage);
+		}
+	}, [message, ref]);
+}
+function useInteractiveChildrenNeedDescription(ref, message = `interactive child node(s) should have an \`aria-describedby\` property`) {
+	useEffect(() => {
+		if (process.env.NODE_ENV === "production") return;
+		const { current } = ref;
+		const node = current ? getInteractiveContent(current) : null;
+		if (node && !node.hasAttribute("aria-describedby")) throw new Error(`Error: ${message}.\n\nInstead found: ${node.outerHTML}`);
+	}, [message, ref]);
+}
+/**
+* Determines if a given DOM node has interactive content, or is itself
+* interactive. It returns the interactive node if one is found
+*
+* @param {HTMLElement} node
+* @returns {HTMLElement}
+*/
+function getInteractiveContent(node) {
+	if (!node || !node.childNodes) return null;
+	if (isFocusable(node)) return node;
+	for (const childNode of node.childNodes) {
+		const interactiveNode = getInteractiveContent(childNode);
+		if (interactiveNode) return interactiveNode;
+	}
+	return null;
+}
+/**
+* Determines if a given DOM node has a role, or has itself a role.
+* It returns the node with a role if one is found
+*
+* @param {HTMLElement} node
+* @returns {HTMLElement}
+*/
+function getRoleContent(node) {
+	if (!node || !node.childNodes) return null;
+	if (node?.getAttribute?.("role") && node.getAttribute("role") !== "") return node;
+	for (const childNode of node.childNodes) {
+		const roleNode = getRoleContent(childNode);
+		if (roleNode) return roleNode;
+	}
+	return null;
+}
+/**
+* Determines if the given element is focusable, or not
+*
+* @param {HTMLElement} element
+* @returns {boolean}
+* @see https://github.com/w3c/aria-practices/blob/0553bb51588ffa517506e2a1b2ca1422ed438c5f/examples/js/utils.js#L68
+*/
+function isFocusable(element) {
+	if (element.tabIndex === void 0 || element.tabIndex < 0) return false;
+	if (element.disabled) return false;
+	switch (element.nodeName) {
+		case "A": return !!element.href && element.rel !== "ignore";
+		case "INPUT": return element.type !== "hidden";
+		default: return true;
+	}
+}
 
-Instead found: ${n.outerHTML}`)},[e,r])}function o(r){if(!r||!r.childNodes)return null;if(s(r))return r;for(const e of r.childNodes){const t=o(e);if(t)return t}return null}function c(r){if(!r||!r.childNodes)return null;if(r?.getAttribute?.("role")&&r.getAttribute("role")!=="")return r;for(const e of r.childNodes){const t=c(e);if(t)return t}return null}function s(r){if(r.tabIndex===void 0||r.tabIndex<0||r.disabled)return!1;switch(r.nodeName){case"A":return!!r.href&&r.rel!=="ignore";case"INPUT":return r.type!=="hidden";default:return!0}}export{o as getInteractiveContent,c as getRoleContent,l as useInteractiveChildrenNeedDescription,f as useNoInteractiveChildren};
+//#endregion
+export { getInteractiveContent, getRoleContent, useInteractiveChildrenNeedDescription, useNoInteractiveChildren };

package/lib/StepFlow/index.js

@@ -1 +1,6 @@
-"use strict";var x=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var n=Object.prototype.hasOwnProperty;var s=(t,e)=>{for(var o in e)x(t,o,{get:e[o],enumerable:!0})},u=(t,e,o,S)=>{if(e&&typeof e=="object"||typeof e=="function")for(let p of y(e))!n.call(t,p)&&p!==o&&x(t,p,{get:()=>e[p],enumerable:!(S=m(e,p))||S.enumerable});return t};var C=t=>u(x({},"__esModule",{value:!0}),t);var d={};s(d,{StepGroup:()=>f.StepGroup,StepProvider:()=>r.StepProvider,useStepContext:()=>r.useStepContext});module.exports=C(d);var f=require("./StepGroup"),r=require("./StepContext");
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_StepContext = require('../chunk.js');
+
+exports.StepGroup = require_StepContext.StepGroup;
+exports.StepProvider = require_StepContext.StepProvider;
+exports.useStepContext = require_StepContext.useStepContext;

package/lib/chunk.js

@@ -0,0 +1,111 @@
+//#region \0rolldown/runtime.js
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+	if (from && typeof from === "object" || typeof from === "function") {
+		for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+			key = keys[i];
+			if (!__hasOwnProp.call(to, key) && key !== except) {
+				__defProp(to, key, {
+					get: ((k) => from[k]).bind(null, key),
+					enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+				});
+			}
+		}
+	}
+	return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+	value: mod,
+	enumerable: true
+}) : target, mod));
+
+//#endregion
+let react = require("react");
+react = __toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/StepFlow/StepGroup.tsx
+/**
+* Copyright IBM Corp. 2025, 2025
+*
+* This source code is licensed under the Apache-2.0 license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+/**
+* Container for steps. The children are filtered for only truthy values (via Children.toArray)
+* and only the current step is returned from this component based on the `currentStep` value
+* from `useStepContext`.
+*/
+const StepGroup = ({ children }) => {
+	const { setTotalSteps, currentStep } = useStepContext();
+	const childrenArray = react.default.Children.toArray(children);
+	(0, react.useEffect)(() => {
+		setTotalSteps(childrenArray.length);
+	}, [childrenArray.length, setTotalSteps]);
+	return childrenArray[currentStep - 1];
+};
+
+//#endregion
+//#region src/StepFlow/StepContext.tsx
+/**
+* Copyright IBM Corp. 2025, 2025
+*
+* This source code is licensed under the Apache-2.0 license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+const StepContext = (0, react.createContext)(void 0);
+const StepProvider = ({ children }) => {
+	const [totalSteps, setTotalSteps] = (0, react.useState)(1);
+	const [currentStep, setCurrentStep] = (0, react.useState)(1);
+	const [formState, setFormState] = (0, react.useState)({});
+	const context = {
+		formState,
+		setFormState,
+		totalSteps,
+		setTotalSteps,
+		currentStep,
+		handleGoToStep: (step) => setCurrentStep(step),
+		handleNext: () => setCurrentStep((step) => step + 1),
+		handlePrevious: () => setCurrentStep((step) => step - 1)
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StepContext.Provider, {
+		value: context,
+		children
+	});
+};
+const useStepContext = () => {
+	const context = (0, react.useContext)(StepContext);
+	if (context === void 0) throw new Error("Context hook used outside of Step provider");
+	return context;
+};
+
+//#endregion
+Object.defineProperty(exports, 'StepGroup', {
+  enumerable: true,
+  get: function () {
+    return StepGroup;
+  }
+});
+Object.defineProperty(exports, 'StepProvider', {
+  enumerable: true,
+  get: function () {
+    return StepProvider;
+  }
+});
+Object.defineProperty(exports, '__toESM', {
+  enumerable: true,
+  get: function () {
+    return __toESM;
+  }
+});
+Object.defineProperty(exports, 'useStepContext', {
+  enumerable: true,
+  get: function () {
+    return useStepContext;
+  }
+});

package/lib/index.js

@@ -1 +1,18 @@
-"use strict";var a=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var c=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var t=(f,r,p,x)=>{if(r&&typeof r=="object"||typeof r=="function")for(let m of c(r))!d.call(f,m)&&m!==p&&a(f,m,{get:()=>r[m],enumerable:!(x=b(r,m))||x.enumerable});return f},e=(f,r,p)=>(t(f,r,"default"),p&&t(p,r,"default"));var g=f=>t(a({},"__esModule",{value:!0}),f);var o={};module.exports=g(o);e(o,require("@carbon/utilities"),module.exports);e(o,require("./useNoInteractiveChildren"),module.exports);e(o,require("./StepFlow"),module.exports);
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_StepContext = require('./chunk.js');
+const require_useNoInteractiveChildren_index = require('./useNoInteractiveChildren/index.js');
+
+exports.StepGroup = require_StepContext.StepGroup;
+exports.StepProvider = require_StepContext.StepProvider;
+exports.getInteractiveContent = require_useNoInteractiveChildren_index.getInteractiveContent;
+exports.getRoleContent = require_useNoInteractiveChildren_index.getRoleContent;
+exports.useInteractiveChildrenNeedDescription = require_useNoInteractiveChildren_index.useInteractiveChildrenNeedDescription;
+exports.useNoInteractiveChildren = require_useNoInteractiveChildren_index.useNoInteractiveChildren;
+exports.useStepContext = require_StepContext.useStepContext;
+var _carbon_utilities = require("@carbon/utilities");
+Object.keys(_carbon_utilities).forEach(function (k) {
+  if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
+    enumerable: true,
+    get: function () { return _carbon_utilities[k]; }
+  });
+});

package/lib/useNoInteractiveChildren/index.js

@@ -1,5 +1,85 @@
-"use strict";var u=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var l=Object.prototype.hasOwnProperty;var a=(r,t)=>{for(var e in t)u(r,e,{get:t[e],enumerable:!0})},h=(r,t,e,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of f(t))!l.call(r,o)&&o!==e&&u(r,o,{get:()=>t[o],enumerable:!(n=d(t,o))||n.enumerable});return r};var N=r=>h(u({},"__esModule",{value:!0}),r);var E={};a(E,{getInteractiveContent:()=>i,getRoleContent:()=>s,useInteractiveChildrenNeedDescription:()=>b,useNoInteractiveChildren:()=>p});module.exports=N(E);var c=require("react");function p(r,t="component should have no interactive child nodes"){(0,c.useEffect)(()=>{if(process.env.NODE_ENV==="production")return;const{current:e}=r,n=e?i(e):null;if(n){const o=`Error: ${t}.
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_StepContext = require('../chunk.js');
+let react = require("react");
 
-Instead found: ${n.outerHTML}`;throw console.error(o),new Error(o)}},[t,r])}function b(r,t="interactive child node(s) should have an `aria-describedby` property"){(0,c.useEffect)(()=>{if(process.env.NODE_ENV==="production")return;const{current:e}=r,n=e?i(e):null;if(n&&!n.hasAttribute("aria-describedby"))throw new Error(`Error: ${t}.
+//#region src/useNoInteractiveChildren/index.jsx
+/**
+* Copyright IBM Corp. 2016, 2026
+*
+* This source code is licensed under the Apache-2.0 license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+function useNoInteractiveChildren(ref, message = "component should have no interactive child nodes") {
+	(0, react.useEffect)(() => {
+		if (process.env.NODE_ENV === "production") return;
+		const { current } = ref;
+		const node = current ? getInteractiveContent(current) : null;
+		if (node) {
+			const errorMessage = `Error: ${message}.\n\nInstead found: ${node.outerHTML}`;
+			console.error(errorMessage);
+			throw new Error(errorMessage);
+		}
+	}, [message, ref]);
+}
+function useInteractiveChildrenNeedDescription(ref, message = `interactive child node(s) should have an \`aria-describedby\` property`) {
+	(0, react.useEffect)(() => {
+		if (process.env.NODE_ENV === "production") return;
+		const { current } = ref;
+		const node = current ? getInteractiveContent(current) : null;
+		if (node && !node.hasAttribute("aria-describedby")) throw new Error(`Error: ${message}.\n\nInstead found: ${node.outerHTML}`);
+	}, [message, ref]);
+}
+/**
+* Determines if a given DOM node has interactive content, or is itself
+* interactive. It returns the interactive node if one is found
+*
+* @param {HTMLElement} node
+* @returns {HTMLElement}
+*/
+function getInteractiveContent(node) {
+	if (!node || !node.childNodes) return null;
+	if (isFocusable(node)) return node;
+	for (const childNode of node.childNodes) {
+		const interactiveNode = getInteractiveContent(childNode);
+		if (interactiveNode) return interactiveNode;
+	}
+	return null;
+}
+/**
+* Determines if a given DOM node has a role, or has itself a role.
+* It returns the node with a role if one is found
+*
+* @param {HTMLElement} node
+* @returns {HTMLElement}
+*/
+function getRoleContent(node) {
+	if (!node || !node.childNodes) return null;
+	if (node?.getAttribute?.("role") && node.getAttribute("role") !== "") return node;
+	for (const childNode of node.childNodes) {
+		const roleNode = getRoleContent(childNode);
+		if (roleNode) return roleNode;
+	}
+	return null;
+}
+/**
+* Determines if the given element is focusable, or not
+*
+* @param {HTMLElement} element
+* @returns {boolean}
+* @see https://github.com/w3c/aria-practices/blob/0553bb51588ffa517506e2a1b2ca1422ed438c5f/examples/js/utils.js#L68
+*/
+function isFocusable(element) {
+	if (element.tabIndex === void 0 || element.tabIndex < 0) return false;
+	if (element.disabled) return false;
+	switch (element.nodeName) {
+		case "A": return !!element.href && element.rel !== "ignore";
+		case "INPUT": return element.type !== "hidden";
+		default: return true;
+	}
+}
 
-Instead found: ${n.outerHTML}`)},[t,r])}function i(r){if(!r||!r.childNodes)return null;if(v(r))return r;for(const t of r.childNodes){const e=i(t);if(e)return e}return null}function s(r){if(!r||!r.childNodes)return null;if(r?.getAttribute?.("role")&&r.getAttribute("role")!=="")return r;for(const t of r.childNodes){const e=s(t);if(e)return e}return null}function v(r){if(r.tabIndex===void 0||r.tabIndex<0||r.disabled)return!1;switch(r.nodeName){case"A":return!!r.href&&r.rel!=="ignore";case"INPUT":return r.type!=="hidden";default:return!0}}
+//#endregion
+exports.getInteractiveContent = getInteractiveContent;
+exports.getRoleContent = getRoleContent;
+exports.useInteractiveChildrenNeedDescription = useInteractiveChildrenNeedDescription;
+exports.useNoInteractiveChildren = useNoInteractiveChildren;

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@carbon/utilities-react",
   "description": "Utilities and helpers to drive consistency across software products using the Carbon Design System with React",
-  "version": "0.20.0-rc.0",
+  "version": "0.21.0-rc.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
-  "types": "types/index.d.ts",
+  "types": "es/index.d.ts",
   "repository": {
     "type": "git",
     "url": "https://github.com/carbon-design-system/carbon.git",
@@ -15,9 +15,24 @@
   "files": [
     "es",
     "lib",
-    "types",
     "telemetry.yml"
   ],
+  "sideEffects": false,
+  "exports": {
+    ".": {
+      "types": "./es/index.d.ts",
+      "import": "./es/index.js",
+      "require": "./lib/index.js",
+      "default": "./es/index.js"
+    },
+    "./*": {
+      "types": "./es/*/index.d.ts",
+      "import": "./es/*/index.js",
+      "require": "./lib/*/index.js",
+      "default": "./es/*/index.js"
+    },
+    "./package.json": "./package.json"
+  },
   "keywords": [
     "ibm",
     "carbon",
@@ -30,26 +45,22 @@
     "provenance": true
   },
   "scripts": {
-    "build:es": "esbuild ./src/**/!(*-test).{js,ts,jsx,tsx} --minify --outdir=es --target=es2020 --format=esm --define:process=process",
-    "build:cjs": "esbuild ./src/**/!(*-test).{js,ts,jsx,tsx} --minify --outdir=lib --target=es2020 --format=cjs --define:process=process",
-    "build:types": "tsc",
-    "build": "yarn build:es & yarn build:cjs & yarn build:types",
-    "watch": "yarn build:es --watch & yarn build:cjs --watch",
-    "clean": "rimraf es lib",
+    "build": "yarn clean && tsdown --config tsdown.config.mts",
+    "watch": "tsdown --config tsdown.config.mts --watch",
+    "clean": "rimraf es lib types",
     "postinstall": "ibmtelemetry --config=telemetry.yml"
   },
   "peerDependencies": {
     "react": "^16.8.6 || ^17.0.1 || ^18.2.0 || ^19.0.0"
   },
   "devDependencies": {
-    "esbuild": "^0.25.0",
     "rimraf": "^6.0.1",
-    "typescript": "^5.7.3",
+    "tsdown": "^0.20.3",
     "typescript-config-carbon": "^0.9.0"
   },
   "dependencies": {
-    "@carbon/utilities": "^0.17.0-rc.0",
+    "@carbon/utilities": "^0.18.0-rc.0",
     "@ibm/telemetry-js": "^1.6.1"
   },
-  "gitHead": "f3e7c2811340637ead19b4a1a550a20820602cc4"
+  "gitHead": "d901529b78f5b70b49309ad45604fa5ec99a2e69"
 }

package/es/StepFlow/StepContext.js

@@ -1 +0,0 @@
-import{jsx as x}from"react/jsx-runtime";import{useContext as a,createContext as u,useState as r}from"react";const n=u(void 0),h=({children:t})=>{const[p,d]=r(1),[s,o]=r(1),[S,c]=r({}),i={formState:S,setFormState:c,totalSteps:p,setTotalSteps:d,currentStep:s,handleGoToStep:e=>o(e),handleNext:()=>o(e=>e+1),handlePrevious:()=>o(e=>e-1)};return x(n.Provider,{value:i,children:t})},m=()=>{const t=a(n);if(t===void 0)throw new Error("Context hook used outside of Step provider");return t};export{h as StepProvider,m as useStepContext};

package/es/StepFlow/StepGroup.js

@@ -1 +0,0 @@
-import n,{useEffect as p}from"react";import{useStepContext as c}from".";const a=({children:r})=>{const{setTotalSteps:e,currentStep:o}=c(),t=n.Children.toArray(r);return p(()=>{e(t.length)},[t.length,e]),t[o-1]};export{a as StepGroup};

package/lib/StepFlow/StepContext.js

@@ -1 +0,0 @@
-"use strict";var s=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var C=Object.getOwnPropertyNames;var f=Object.prototype.hasOwnProperty;var v=(e,t)=>{for(var n in t)s(e,n,{get:t[n],enumerable:!0})},P=(e,t,n,d)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of C(t))!f.call(e,o)&&o!==n&&s(e,o,{get:()=>t[o],enumerable:!(d=x(t,o))||d.enumerable});return e};var l=e=>P(s({},"__esModule",{value:!0}),e);var T={};v(T,{StepProvider:()=>h,useStepContext:()=>m});module.exports=l(T);var c=require("react/jsx-runtime"),r=require("react");const S=(0,r.createContext)(void 0),h=({children:e})=>{const[t,n]=(0,r.useState)(1),[d,o]=(0,r.useState)(1),[i,a]=(0,r.useState)({}),u={formState:i,setFormState:a,totalSteps:t,setTotalSteps:n,currentStep:d,handleGoToStep:p=>o(p),handleNext:()=>o(p=>p+1),handlePrevious:()=>o(p=>p-1)};return(0,c.jsx)(S.Provider,{value:u,children:e})},m=()=>{const e=(0,r.useContext)(S);if(e===void 0)throw new Error("Context hook used outside of Step provider");return e};

package/lib/StepFlow/StepGroup.js

@@ -1 +0,0 @@
-"use strict";var S=Object.create;var p=Object.defineProperty;var a=Object.getOwnPropertyDescriptor;var i=Object.getOwnPropertyNames;var l=Object.getPrototypeOf,m=Object.prototype.hasOwnProperty;var f=(t,e)=>{for(var r in e)p(t,r,{get:e[r],enumerable:!0})},s=(t,e,r,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of i(e))!m.call(t,n)&&n!==r&&p(t,n,{get:()=>e[n],enumerable:!(o=a(e,n))||o.enumerable});return t};var h=(t,e,r)=>(r=t!=null?S(l(t)):{},s(e||!t||!t.__esModule?p(r,"default",{value:t,enumerable:!0}):r,t)),d=t=>s(p({},"__esModule",{value:!0}),t);var G={};f(G,{StepGroup:()=>C});module.exports=d(G);var c=h(require("react")),u=require(".");const C=({children:t})=>{const{setTotalSteps:e,currentStep:r}=(0,u.useStepContext)(),o=c.default.Children.toArray(t);return(0,c.useEffect)(()=>{e(o.length)},[o.length,e]),o[r-1]};

package/lib/StepFlow/types.js

@@ -1 +0,0 @@
-"use strict";var n=Object.defineProperty;var S=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var i=Object.prototype.hasOwnProperty;var m=(e,t,r,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of p(t))!i.call(e,o)&&o!==r&&n(e,o,{get:()=>t[o],enumerable:!(a=S(t,o))||a.enumerable});return e};var s=e=>m(n({},"__esModule",{value:!0}),e);var c={};module.exports=s(c);

package/types/StepFlow/StepContext.d.ts

@@ -1,14 +0,0 @@
-/**
- * Copyright IBM Corp. 2025, 2025
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-import { ReactNode } from 'react';
-import { StepContextType } from './types';
-interface StepProviderProps {
-    children: ReactNode;
-}
-export declare const StepProvider: ({ children }: StepProviderProps) => import("react/jsx-runtime").JSX.Element;
-export declare const useStepContext: () => StepContextType;
-export {};

package/types/StepFlow/StepGroup.d.ts

@@ -1,17 +0,0 @@
-/**
- * Copyright IBM Corp. 2025, 2025
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-import React from 'react';
-interface StepGroupProps {
-    children: React.ReactNode;
-}
-/**
- * Container for steps. The children are filtered for only truthy values (via Children.toArray)
- * and only the current step is returned from this component based on the `currentStep` value
- * from `useStepContext`.
- */
-export declare const StepGroup: ({ children }: StepGroupProps) => string | number | bigint | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | React.ReactPortal | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined>;
-export {};

package/types/StepFlow/index.d.ts

@@ -1,9 +0,0 @@
-/**
- * Copyright IBM Corp. 2025, 2025
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-export { StepGroup } from './StepGroup';
-export { StepProvider, useStepContext } from './StepContext';
-export type { StepContextType } from './types';

package/types/StepFlow/types.d.ts

@@ -1,25 +0,0 @@
-/**
- * Copyright IBM Corp. 2025, 2025
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-import { Dispatch, SetStateAction } from 'react';
-/**
- * This interface should be extended by the consumer to match their own unique
- * use case given the fields within their own stepped experience.
- */
-interface formStateType {
-    [key: string]: unknown;
-}
-export interface StepContextType {
-    formState: formStateType;
-    setFormState: Dispatch<SetStateAction<formStateType>>;
-    totalSteps: number;
-    setTotalSteps: Dispatch<SetStateAction<number>>;
-    currentStep: number;
-    handleGoToStep: (step: number) => void;
-    handleNext: () => void;
-    handlePrevious: () => void;
-}
-export {};

package/types/index.d.ts

@@ -1,9 +0,0 @@
-/**
- * Copyright IBM Corp. 2024
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-export * from '@carbon/utilities';
-export * from './useNoInteractiveChildren';
-export * from './StepFlow';

package/types/useNoInteractiveChildren/index.d.ts

@@ -1,18 +0,0 @@
-export function useNoInteractiveChildren(ref: any, message?: string): void;
-export function useInteractiveChildrenNeedDescription(ref: any, message?: string): void;
-/**
- * Determines if a given DOM node has interactive content, or is itself
- * interactive. It returns the interactive node if one is found
- *
- * @param {HTMLElement} node
- * @returns {HTMLElement}
- */
-export function getInteractiveContent(node: HTMLElement): HTMLElement;
-/**
- * Determines if a given DOM node has a role, or has itself a role.
- * It returns the node with a role if one is found
- *
- * @param {HTMLElement} node
- * @returns {HTMLElement}
- */
-export function getRoleContent(node: HTMLElement): HTMLElement;