@primer/react-brand 0.72.0-rc.44ea78b6 → 0.72.0-rc.4db5fc89

package/lib/design-tokens/ts/tokens/functional/components/text-cursor-animation/colors.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:28 GMT
  */
 
 module.exports = {

package/lib/design-tokens/ts/tokens/functional/components/timeline/base.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:27 GMT
  */
 
 

package/lib/design-tokens/ts/tokens/functional/components/timeline/base.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:28 GMT
  */
 
 module.exports = {

package/lib/design-tokens/ts/tokens/functional/components/timeline/colors.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:27 GMT
  */
 
 

package/lib/design-tokens/ts/tokens/functional/components/timeline/colors.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:28 GMT
  */
 
 module.exports = {

package/lib/design-tokens/ts/tokens/functional/components/token/colors.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:27 GMT
  */
 
 

package/lib/design-tokens/ts/tokens/functional/components/token/colors.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:28 GMT
  */
 
 module.exports = {

package/lib/design-tokens/ts/tokens/functional/components/tooltip/colors.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:27 GMT
  */
 
 

package/lib/design-tokens/ts/tokens/functional/components/tooltip/colors.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:28 GMT
  */
 
 module.exports = {

package/lib/design-tokens/ts/tokens/functional/components/video-player/base.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:27 GMT
  */
 
 

package/lib/design-tokens/ts/tokens/functional/components/video-player/base.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:28 GMT
  */
 
 module.exports = {

package/lib/design-tokens/ts/tokens/functional/size/border.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:27 GMT
  */
 
 

package/lib/design-tokens/ts/tokens/functional/size/border.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:28 GMT
  */
 
 module.exports = {

package/lib/design-tokens/ts/tokens/functional/size/breakpoints.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:27 GMT
  */
 
 

package/lib/design-tokens/ts/tokens/functional/size/breakpoints.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:28 GMT
  */
 
 module.exports = {

package/lib/design-tokens/ts/tokens/functional/size/size-coarse.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:28 GMT
  */
 
 

package/lib/design-tokens/ts/tokens/functional/size/size-coarse.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:28 GMT
  */
 
 module.exports = {

package/lib/design-tokens/ts/tokens/functional/size/size-fine.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:28 GMT
  */
 
 

package/lib/design-tokens/ts/tokens/functional/size/size-fine.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:28 GMT
  */
 
 module.exports = {

package/lib/design-tokens/ts/tokens/functional/size/size.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:27 GMT
  */
 
 

package/lib/design-tokens/ts/tokens/functional/size/size.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:28 GMT
  */
 
 module.exports = {

package/lib/design-tokens/ts/tokens/functional/size/viewport.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:27 GMT
  */
 
 

package/lib/design-tokens/ts/tokens/functional/size/viewport.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:28 GMT
  */
 
 module.exports = {

package/lib/design-tokens/ts/tokens/functional/typography/typography-responsive.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:27 GMT
  */
 
 

package/lib/design-tokens/ts/tokens/functional/typography/typography-responsive.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:28 GMT
  */
 
 module.exports = {

package/lib/design-tokens/ts/tokens/functional/typography/typography.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:27 GMT
  */
 
 

package/lib/design-tokens/ts/tokens/functional/typography/typography.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 21 Jul 2026 13:23:47 GMT
+ * Generated on Tue, 28 Jul 2026 08:59:28 GMT
  */
 
 module.exports = {

package/lib/forms/Checkbox/Checkbox.d.ts

@@ -1,6 +1,7 @@
 import React, { type InputHTMLAttributes } from 'react';
 import type { BaseProps } from '../../component-helpers';
 import type { FormValidationStatus } from '../form-types';
+import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes.css';
 export type CheckboxProps = {
     /**
      * Apply indeterminate visual appearance to the checkbox

package/lib/forms/FormControl/FormControl.d.ts

@@ -1,6 +1,7 @@
 import { PropsWithChildren } from 'react';
 import type { BaseProps } from '../../component-helpers';
 import type { FormValidationStatus, FormInputSizes } from '../';
+import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes.css';
 export type FormControlProps = BaseProps<HTMLElement> & {
     /**
      * Apply a decorative border to the form control.

package/lib/forms/Radio/Radio.d.ts

@@ -1,5 +1,6 @@
 import React, { type InputHTMLAttributes } from 'react';
 import type { BaseProps } from '../../component-helpers';
+import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes.css';
 export type RadioProps = {
     /**
      * Apply inactive visual appearance to the Radio

package/lib/forms/Select/Select.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import type { BaseProps } from '../../component-helpers';
 import type { FormInputSizes, FormValidationStatus } from '../form-types';
+import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes.css';
 export type SelectProps = {
     /**
      * Applies full width styling.

package/lib/forms/TextInput/TextInput.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import type { BaseProps } from '../../component-helpers';
 import type { FormInputSizes, FormValidationStatus } from '../form-types';
+import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes.css';
 import type { Icon } from '@primer/octicons-react';
 type VisualType = React.ReactElement | React.ReactNode | Icon;
 export type TextInputProps = {

package/lib/forms/Textarea/Textarea.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import type { BaseProps } from '../../component-helpers';
 import type { FormInputSizes, FormValidationStatus } from '../form-types';
+import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes.css';
 export declare const DEFAULT_TEXTAREA_ROWS = 7;
 export declare const DEFAULT_TEXTAREA_COLS = 30;
 export declare const DEFAULT_TEXTAREA_RESIZE = "both";

package/lib/forms/index.d.ts

@@ -1,7 +1,3 @@
-/**
- * Shared form (control) design tokens
- */
-import '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes.css';
 export * from './Checkbox';
 export * from './Textarea';
 export * from './TextInput';

package/lib/hooks/useFocusTrap.d.ts

@@ -1,15 +1,15 @@
 import React from 'react';
-export interface FocusTrapHookSettings {
+export interface FocusTrapHookSettings<ContainerElement extends HTMLElement = HTMLElement, InitialFocusElement extends HTMLElement = HTMLElement> {
     /**
-     * Ref that will be used for the trapping container. If not provided, one will
+     * Ref object that will be used for the trapping container. If not provided, one will
      * be created by this hook and returned.
      */
-    containerRef: React.RefObject<HTMLElement | null>;
+    containerRef?: React.RefObject<ContainerElement | null>;
     /**
-     * Ref for the element that should receive focus when the focus trap is first enabled.
+     * Ref object for the element that should receive focus when the focus trap is first enabled.
      * If not provided, one will be created by this hook and returned. Its use is optional.
      */
-    initialFocusRef?: React.RefObject<HTMLElement | null>;
+    initialFocusRef?: React.RefObject<InitialFocusElement | null>;
     /**
      * Set to true to disable the focus trap and clean up listeners. Can be re-enabled at any time.
      */
@@ -24,7 +24,7 @@ export interface FocusTrapHookSettings {
  * that should trap focus.
  * @param settings {FocusTrapHookSettings}
  */
-export declare function useFocusTrap(settings?: FocusTrapHookSettings, dependencies?: React.DependencyList): {
-    containerRef: React.RefObject<HTMLElement | null> | undefined;
-    initialFocusRef: React.RefObject<HTMLElement | null> | undefined;
+export declare function useFocusTrap<ContainerElement extends HTMLElement = HTMLElement, InitialFocusElement extends HTMLElement = HTMLElement>(settings?: FocusTrapHookSettings<ContainerElement, InitialFocusElement>, dependencies?: React.DependencyList): {
+    containerRef: React.RefObject<ContainerElement | null>;
+    initialFocusRef: React.RefObject<InitialFocusElement | null>;
 };

package/lib/index.d.ts

@@ -56,4 +56,5 @@ export * from './SectionIntroStacked';
 export * from './Tabs';
 export * from './TextCursorAnimation';
 export * from './Tiles';
+export * from './hooks/useFocusTrap';
 export * from './hooks/useWindowSize';