@box/blueprint-web 7.24.0 → 7.25.0

package/lib-esm/loading-indicator/loading-indicator.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"crawler":"bp_loading_indicator_module_crawler--24abd","segment":"bp_loading_indicator_module_segment--24abd","small":"bp_loading_indicator_module_small--24abd","large":"bp_loading_indicator_module_large--24abd","x-large":"bp_loading_indicator_module_x-large--24abd","default":"bp_loading_indicator_module_default--24abd","segment-transform":"bp_loading_indicator_module_segment-transform--24abd","segment-default":"bp_loading_indicator_module_segment-default--24abd","dark":"bp_loading_indicator_module_dark--24abd","segment-dark":"bp_loading_indicator_module_segment-dark--24abd","light":"bp_loading_indicator_module_light--24abd","segment-light":"bp_loading_indicator_module_segment-light--24abd"};
+var styles = {"crawler":"bp_loading_indicator_module_crawler--36c81","segment":"bp_loading_indicator_module_segment--36c81","small":"bp_loading_indicator_module_small--36c81","large":"bp_loading_indicator_module_large--36c81","x-large":"bp_loading_indicator_module_x-large--36c81","default":"bp_loading_indicator_module_default--36c81","segment-transform":"bp_loading_indicator_module_segment-transform--36c81","segment-default":"bp_loading_indicator_module_segment-default--36c81","dark":"bp_loading_indicator_module_dark--36c81","segment-dark":"bp_loading_indicator_module_segment-dark--36c81","light":"bp_loading_indicator_module_light--36c81","segment-light":"bp_loading_indicator_module_segment-light--36c81"};
 
 export { styles as default };

package/lib-esm/modal/modal.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"overlay":"bp_modal_module_overlay--394f7","content":"bp_modal_module_content--394f7","popup_bounce_in":"bp_modal_module_popup_bounce_in--394f7","smallSizeModal":"bp_modal_module_smallSizeModal--394f7","mediumSizeModal":"bp_modal_module_mediumSizeModal--394f7","largeSizeModal":"bp_modal_module_largeSizeModal--394f7","xlargeSizeModal":"bp_modal_module_xlargeSizeModal--394f7","close":"bp_modal_module_close--394f7","onColor":"bp_modal_module_onColor--394f7","backButton":"bp_modal_module_backButton--394f7","modalHeader":"bp_modal_module_modalHeader--394f7","modalTitle":"bp_modal_module_modalTitle--394f7","body":"bp_modal_module_body--394f7","scrollableContainer":"bp_modal_module_scrollableContainer--394f7","headerDividerLine":"bp_modal_module_headerDividerLine--394f7","footerDividerLine":"bp_modal_module_footerDividerLine--394f7","footer":"bp_modal_module_footer--394f7","footerButton":"bp_modal_module_footerButton--394f7"};
+var styles = {"overlay":"bp_modal_module_overlay--5b86b","content":"bp_modal_module_content--5b86b","popup_bounce_in":"bp_modal_module_popup_bounce_in--5b86b","smallSizeModal":"bp_modal_module_smallSizeModal--5b86b","mediumSizeModal":"bp_modal_module_mediumSizeModal--5b86b","largeSizeModal":"bp_modal_module_largeSizeModal--5b86b","xlargeSizeModal":"bp_modal_module_xlargeSizeModal--5b86b","close":"bp_modal_module_close--5b86b","onColor":"bp_modal_module_onColor--5b86b","backButton":"bp_modal_module_backButton--5b86b","modalHeader":"bp_modal_module_modalHeader--5b86b","modalTitle":"bp_modal_module_modalTitle--5b86b","body":"bp_modal_module_body--5b86b","scrollableContainer":"bp_modal_module_scrollableContainer--5b86b","headerDividerLine":"bp_modal_module_headerDividerLine--5b86b","footerDividerLine":"bp_modal_module_footerDividerLine--5b86b","footer":"bp_modal_module_footer--5b86b","footerButton":"bp_modal_module_footerButton--5b86b"};
 
 export { styles as default };

package/lib-esm/navigation-menu/navigation-menu.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"link":"bp_navigation_menu_module_link--54648","ellipsis":"bp_navigation_menu_module_ellipsis--54648","navigationMenuSeparator":"bp_navigation_menu_module_navigationMenuSeparator--54648"};
+var styles = {"link":"bp_navigation_menu_module_link--51f06","ellipsis":"bp_navigation_menu_module_ellipsis--51f06","navigationMenuSeparator":"bp_navigation_menu_module_navigationMenuSeparator--51f06"};
 
 export { styles as default };

package/lib-esm/page-section/page-section.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"pageSectionContainer":"bp_page_section_module_pageSectionContainer--cfd74","pageSection":"bp_page_section_module_pageSection--cfd74","pageSectionHeader":"bp_page_section_module_pageSectionHeader--cfd74","pageSectionContent":"bp_page_section_module_pageSectionContent--cfd74","pageSectionDivider":"bp_page_section_module_pageSectionDivider--cfd74"};
+var styles = {"pageSectionContainer":"bp_page_section_module_pageSectionContainer--1a75e","pageSection":"bp_page_section_module_pageSection--1a75e","pageSectionHeader":"bp_page_section_module_pageSectionHeader--1a75e","pageSectionContent":"bp_page_section_module_pageSectionContent--1a75e","pageSectionDivider":"bp_page_section_module_pageSectionDivider--1a75e"};
 
 export { styles as default };

package/lib-esm/password-input/password-input.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"passwordInput":"bp_password_input_module_passwordInput--38d2f","iconButton":"bp_password_input_module_iconButton--38d2f"};
+var styles = {"passwordInput":"bp_password_input_module_passwordInput--561e8","iconButton":"bp_password_input_module_iconButton--561e8"};
 
 export { styles as default };

package/lib-esm/primitives/base-button/base-button.module.js

@@ -1,4 +1,4 @@
 import '../../index.css';
-var styles = {"button":"bp_base_button_module_button--2cff8","icon":"bp_base_button_module_icon--2cff8","primary":"bp_base_button_module_primary--2cff8","secondary":"bp_base_button_module_secondary--2cff8","tertiary":"bp_base_button_module_tertiary--2cff8","outline":"bp_base_button_module_outline--2cff8","small":"bp_base_button_module_small--2cff8","isIconButton":"bp_base_button_module_isIconButton--2cff8","large":"bp_base_button_module_large--2cff8","hide":"bp_base_button_module_hide--2cff8"};
+var styles = {"button":"bp_base_button_module_button--baf1f","icon":"bp_base_button_module_icon--baf1f","primary":"bp_base_button_module_primary--baf1f","secondary":"bp_base_button_module_secondary--baf1f","tertiary":"bp_base_button_module_tertiary--baf1f","outline":"bp_base_button_module_outline--baf1f","small":"bp_base_button_module_small--baf1f","isIconButton":"bp_base_button_module_isIconButton--baf1f","large":"bp_base_button_module_large--baf1f","hide":"bp_base_button_module_hide--baf1f"};
 
 export { styles as default };

package/lib-esm/primitives/base-inline-notice/base-inline-notice.module.js

@@ -1,4 +1,4 @@
 import '../../index.css';
-var styles = {"noticeWrapper":"bp_base_inline_notice_module_noticeWrapper--caab5","actions":"bp_base_inline_notice_module_actions--caab5","actionButtonPrimary":"bp_base_inline_notice_module_actionButtonPrimary--caab5","actionButtonTertiary":"bp_base_inline_notice_module_actionButtonTertiary--caab5","backgroundYellow":"bp_base_inline_notice_module_backgroundYellow--caab5","backgroundBlue":"bp_base_inline_notice_module_backgroundBlue--caab5","backgroundRed":"bp_base_inline_notice_module_backgroundRed--caab5","backgroundGreen":"bp_base_inline_notice_module_backgroundGreen--caab5","backgroundPurple":"bp_base_inline_notice_module_backgroundPurple--caab5","contentContainer":"bp_base_inline_notice_module_contentContainer--caab5","content":"bp_base_inline_notice_module_content--caab5","title":"bp_base_inline_notice_module_title--caab5"};
+var styles = {"noticeWrapper":"bp_base_inline_notice_module_noticeWrapper--fe159","actions":"bp_base_inline_notice_module_actions--fe159","actionButtonPrimary":"bp_base_inline_notice_module_actionButtonPrimary--fe159","actionButtonTertiary":"bp_base_inline_notice_module_actionButtonTertiary--fe159","backgroundYellow":"bp_base_inline_notice_module_backgroundYellow--fe159","backgroundBlue":"bp_base_inline_notice_module_backgroundBlue--fe159","backgroundRed":"bp_base_inline_notice_module_backgroundRed--fe159","backgroundGreen":"bp_base_inline_notice_module_backgroundGreen--fe159","backgroundPurple":"bp_base_inline_notice_module_backgroundPurple--fe159","contentContainer":"bp_base_inline_notice_module_contentContainer--fe159","content":"bp_base_inline_notice_module_content--fe159","title":"bp_base_inline_notice_module_title--fe159"};
 
 export { styles as default };

package/lib-esm/primitives/base-text-input/base-text-input.js

@@ -2,9 +2,9 @@ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { forwardRef, useMemo, cloneElement } from 'react';
 import { useUniqueId } from '../../utils/useUniqueId.js';
-import { VisuallyHidden } from '../../visually-hidden/visually-hidden.js';
 import { InlineError } from '../inline-error/inline-error.js';
 import styles from './base-text-input.module.js';
+import { useLabelable } from '../../util-components/labelable/useLabelable.js';
 
 /**
  * This extends a default HTML &lt;input/&gt; and accepts the same props as well as some custom ones listed below.<br/>
@@ -34,20 +34,18 @@ const BaseTextInput = /*#__PURE__*/forwardRef((props, forwardedRef) => {
   const IconComponent = useMemo(() => icon && /*#__PURE__*/cloneElement(icon, {
     className: clsx(icon.props?.className, styles.iconShared)
   }), [icon]);
+  const Label = useLabelable(label, inputId);
   return jsxs(Fragment, {
     children: [jsxs("div", {
       className: clsx([styles.textInputContainer], {
         [styles.disabled]: disabled,
         [styles.error]: shouldMarkError
       }, className),
-      children: [jsx("label", {
+      children: [jsx(Label, {
         className: clsx([styles.label], {
           [styles.hidden]: hideLabel
         }),
-        htmlFor: inputId,
-        children: hideLabel ? jsx(VisuallyHidden, {
-          children: label
-        }) : label
+        hideLabel: hideLabel
       }), jsx("input", {
         ...rest,
         ...(hasError && {

package/lib-esm/primitives/base-text-input/base-text-input.module.js

@@ -1,4 +1,4 @@
 import '../../index.css';
-var styles = {"textInputContainer":"bp_base_text_input_module_textInputContainer--b0659","label":"bp_base_text_input_module_label--b0659","hidden":"bp_base_text_input_module_hidden--b0659","textInput":"bp_base_text_input_module_textInput--b0659","error":"bp_base_text_input_module_error--b0659","iconShared":"bp_base_text_input_module_iconShared--b0659","disabled":"bp_base_text_input_module_disabled--b0659","inlineError":"bp_base_text_input_module_inlineError--b0659"};
+var styles = {"textInputContainer":"bp_base_text_input_module_textInputContainer--5af83","label":"bp_base_text_input_module_label--5af83","hidden":"bp_base_text_input_module_hidden--5af83","textInput":"bp_base_text_input_module_textInput--5af83","error":"bp_base_text_input_module_error--5af83","iconShared":"bp_base_text_input_module_iconShared--5af83","disabled":"bp_base_text_input_module_disabled--5af83","inlineError":"bp_base_text_input_module_inlineError--5af83"};
 
 export { styles as default };

package/lib-esm/primitives/base-text-input/types.d.ts

@@ -1,7 +1,6 @@
 /// <reference types="react" />
-export type BaseTextInputProps = React.ComponentPropsWithRef<'input'> & {
-    /** The label for text input */
-    label: string;
+import { type Labelable } from '../../util-components/labelable/types';
+export type BaseTextInputProps = React.ComponentPropsWithRef<'input'> & Labelable & {
     /** Input type, defaults to 'text' */
     type?: 'text' | 'password';
     /** When true label text is hidden */

package/lib-esm/primitives/calendar/calendar.module.js

@@ -1,4 +1,4 @@
 import '../../index.css';
-var styles = {"calendar":"bp_calendar_module_calendar--e8324","calendarGrid":"bp_calendar_module_calendarGrid--e8324","calendarHeaderCell":"bp_calendar_module_calendarHeaderCell--e8324","calendarHeader":"bp_calendar_module_calendarHeader--e8324","calendarHeaderHeading":"bp_calendar_module_calendarHeaderHeading--e8324","calendarHeaderButton":"bp_calendar_module_calendarHeaderButton--e8324","calendarCell":"bp_calendar_module_calendarCell--e8324","today":"bp_calendar_module_today--e8324"};
+var styles = {"calendar":"bp_calendar_module_calendar--51ced","calendarGrid":"bp_calendar_module_calendarGrid--51ced","calendarHeaderCell":"bp_calendar_module_calendarHeaderCell--51ced","calendarHeader":"bp_calendar_module_calendarHeader--51ced","calendarHeaderHeading":"bp_calendar_module_calendarHeaderHeading--51ced","calendarHeaderButton":"bp_calendar_module_calendarHeaderButton--51ced","calendarCell":"bp_calendar_module_calendarCell--51ced","today":"bp_calendar_module_today--51ced"};
 
 export { styles as default };

package/lib-esm/primitives/chips/chip.module.js

@@ -1,4 +1,4 @@
 import '../../index.css';
-var styles = {"chip":"bp_chip_module_chip--79250","labelText":"bp_chip_module_labelText--79250","chipStatus":"bp_chip_module_chipStatus--79250","chipButton":"bp_chip_module_chipButton--79250","singleSelectChip":"bp_chip_module_singleSelectChip--79250","multiSelectChip":"bp_chip_module_multiSelectChip--79250","chipsGroup":"bp_chip_module_chipsGroup--79250"};
+var styles = {"chip":"bp_chip_module_chip--5a00a","labelText":"bp_chip_module_labelText--5a00a","chipStatus":"bp_chip_module_chipStatus--5a00a","chipButton":"bp_chip_module_chipButton--5a00a","singleSelectChip":"bp_chip_module_singleSelectChip--5a00a","multiSelectChip":"bp_chip_module_multiSelectChip--5a00a","chipsGroup":"bp_chip_module_chipsGroup--5a00a"};
 
 export { styles as default };

package/lib-esm/primitives/context-menu/context-menu.module.js

@@ -1,4 +1,4 @@
 import '../../index.css';
-var styles = {"menuBlock":"bp_context_menu_module_menuBlock--55525","menuItemsSeparator":"bp_context_menu_module_menuItemsSeparator--55525","menuItem":"bp_context_menu_module_menuItem--55525"};
+var styles = {"menuBlock":"bp_context_menu_module_menuBlock--fbae7","menuItemsSeparator":"bp_context_menu_module_menuItemsSeparator--fbae7","menuItem":"bp_context_menu_module_menuItem--fbae7"};
 
 export { styles as default };

package/lib-esm/primitives/dropdown-menu/dropdown-menu.module.js

@@ -1,4 +1,4 @@
 import '../../index.css';
-var styles = {"content":"bp_dropdown_menu_module_content--f89ca","ellipsis":"bp_dropdown_menu_module_ellipsis--f89ca","checkmark":"bp_dropdown_menu_module_checkmark--f89ca","item":"bp_dropdown_menu_module_item--f89ca","subMenuTrigger":"bp_dropdown_menu_module_subMenuTrigger--f89ca","radioItem":"bp_dropdown_menu_module_radioItem--f89ca","checkboxItem":"bp_dropdown_menu_module_checkboxItem--f89ca","dropdownMenuItemSeparator":"bp_dropdown_menu_module_dropdownMenuItemSeparator--f89ca"};
+var styles = {"content":"bp_dropdown_menu_module_content--7a079","ellipsis":"bp_dropdown_menu_module_ellipsis--7a079","checkmark":"bp_dropdown_menu_module_checkmark--7a079","item":"bp_dropdown_menu_module_item--7a079","subMenuTrigger":"bp_dropdown_menu_module_subMenuTrigger--7a079","radioItem":"bp_dropdown_menu_module_radioItem--7a079","checkboxItem":"bp_dropdown_menu_module_checkboxItem--7a079","dropdownMenuItemSeparator":"bp_dropdown_menu_module_dropdownMenuItemSeparator--7a079"};
 
 export { styles as default };

package/lib-esm/primitives/icon-button/icon-button.module.js

@@ -1,4 +1,4 @@
 import '../../index.css';
-var styles = {"iconButton":"bp_icon_button_module_iconButton--ee805","icon":"bp_icon_button_module_icon--ee805","default":"bp_icon_button_module_default--ee805","icon-logo":"bp_icon_button_module_icon-logo--ee805","high-contrast":"bp_icon_button_module_high-contrast--ee805","small-utility":"bp_icon_button_module_small-utility--ee805","large":"bp_icon_button_module_large--ee805","small":"bp_icon_button_module_small--ee805","x-small":"bp_icon_button_module_x-small--ee805"};
+var styles = {"iconButton":"bp_icon_button_module_iconButton--057c9","icon":"bp_icon_button_module_icon--057c9","default":"bp_icon_button_module_default--057c9","icon-logo":"bp_icon_button_module_icon-logo--057c9","high-contrast":"bp_icon_button_module_high-contrast--057c9","small-utility":"bp_icon_button_module_small-utility--057c9","large":"bp_icon_button_module_large--057c9","small":"bp_icon_button_module_small--057c9","x-small":"bp_icon_button_module_x-small--057c9"};
 
 export { styles as default };

package/lib-esm/primitives/inline-error/inline-error.module.js

@@ -1,4 +1,4 @@
 import '../../index.css';
-var styles = {"inlineError":"bp_inline_error_module_inlineError--68f85","empty":"bp_inline_error_module_empty--68f85","errorIcon":"bp_inline_error_module_errorIcon--68f85"};
+var styles = {"inlineError":"bp_inline_error_module_inlineError--fb9d1","empty":"bp_inline_error_module_empty--fb9d1","errorIcon":"bp_inline_error_module_errorIcon--fb9d1"};
 
 export { styles as default };

package/lib-esm/primitives/link/link.module.js

@@ -1,4 +1,4 @@
 import '../../index.css';
-var styles = {"link":"bp_link_module_link--4eea1","inheritFont":"bp_link_module_inheritFont--4eea1","standalone":"bp_link_module_standalone--4eea1","hasIcon":"bp_link_module_hasIcon--4eea1","icon":"bp_link_module_icon--4eea1"};
+var styles = {"link":"bp_link_module_link--d6465","inheritFont":"bp_link_module_inheritFont--d6465","standalone":"bp_link_module_standalone--d6465","hasIcon":"bp_link_module_hasIcon--d6465","icon":"bp_link_module_icon--d6465"};
 
 export { styles as default };

package/lib-esm/primitives/notification/notification.module.js

@@ -1,4 +1,4 @@
 import '../../index.css';
-var styles = {"viewport":"bp_notification_module_viewport--4eeeb","root":"bp_notification_module_root--4eeeb","container":"bp_notification_module_container--4eeeb","mobileContainer":"bp_notification_module_mobileContainer--4eeeb","withButtons":"bp_notification_module_withButtons--4eeeb","info":"bp_notification_module_info--4eeeb","success":"bp_notification_module_success--4eeeb","warning":"bp_notification_module_warning--4eeeb","error":"bp_notification_module_error--4eeeb","typeIconContainer":"bp_notification_module_typeIconContainer--4eeeb","typeIcon":"bp_notification_module_typeIcon--4eeeb","text":"bp_notification_module_text--4eeeb","contentButtonSection":"bp_notification_module_contentButtonSection--4eeeb","contentButtons":"bp_notification_module_contentButtons--4eeeb","closeButtonSection":"bp_notification_module_closeButtonSection--4eeeb","closeButton":"bp_notification_module_closeButton--4eeeb"};
+var styles = {"viewport":"bp_notification_module_viewport--e99a6","root":"bp_notification_module_root--e99a6","container":"bp_notification_module_container--e99a6","mobileContainer":"bp_notification_module_mobileContainer--e99a6","withButtons":"bp_notification_module_withButtons--e99a6","info":"bp_notification_module_info--e99a6","success":"bp_notification_module_success--e99a6","warning":"bp_notification_module_warning--e99a6","error":"bp_notification_module_error--e99a6","typeIconContainer":"bp_notification_module_typeIconContainer--e99a6","typeIcon":"bp_notification_module_typeIcon--e99a6","text":"bp_notification_module_text--e99a6","contentButtonSection":"bp_notification_module_contentButtonSection--e99a6","contentButtons":"bp_notification_module_contentButtons--e99a6","closeButtonSection":"bp_notification_module_closeButtonSection--e99a6","closeButton":"bp_notification_module_closeButton--e99a6"};
 
 export { styles as default };

package/lib-esm/primitives/page-header/page-header.module.js

@@ -1,4 +1,4 @@
 import '../../index.css';
-var styles = {"pageHeader":"bp_page_header_module_pageHeader--02cdb","sticky":"bp_page_header_module_sticky--02cdb","default":"bp_page_header_module_default--02cdb","inline":"bp_page_header_module_inline--02cdb","corner":"bp_page_header_module_corner--02cdb","startElements":"bp_page_header_module_startElements--02cdb","endElements":"bp_page_header_module_endElements--02cdb"};
+var styles = {"pageHeader":"bp_page_header_module_pageHeader--9b90b","sticky":"bp_page_header_module_sticky--9b90b","default":"bp_page_header_module_default--9b90b","inline":"bp_page_header_module_inline--9b90b","corner":"bp_page_header_module_corner--9b90b","startElements":"bp_page_header_module_startElements--9b90b","endElements":"bp_page_header_module_endElements--9b90b"};
 
 export { styles as default };

package/lib-esm/primitives/popover/popover.module.js

@@ -1,4 +1,4 @@
 import '../../index.css';
-var styles = {"popoverMainContent":"bp_popover_module_popoverMainContent--a84f0","popoverContentContainer":"bp_popover_module_popoverContentContainer--a84f0","popoverCard":"bp_popover_module_popoverCard--a84f0","popoverMainContentOuterContainer":"bp_popover_module_popoverMainContentOuterContainer--a84f0","popoverMainContentInnerContainerPadding":"bp_popover_module_popoverMainContentInnerContainerPadding--a84f0","popoverFooter":"bp_popover_module_popoverFooter--a84f0","popoverFooterTopBorder":"bp_popover_module_popoverFooterTopBorder--a84f0"};
+var styles = {"popoverMainContent":"bp_popover_module_popoverMainContent--2068d","popoverContentContainer":"bp_popover_module_popoverContentContainer--2068d","popoverCard":"bp_popover_module_popoverCard--2068d","popoverMainContentOuterContainer":"bp_popover_module_popoverMainContentOuterContainer--2068d","popoverMainContentInnerContainerPadding":"bp_popover_module_popoverMainContentInnerContainerPadding--2068d","popoverFooter":"bp_popover_module_popoverFooter--2068d","popoverFooterTopBorder":"bp_popover_module_popoverFooterTopBorder--2068d"};
 
 export { styles as default };

package/lib-esm/primitives/tabs/tabs.module.js

@@ -1,4 +1,4 @@
 import '../../index.css';
-var styles = {"hiddenWidthSetter":"bp_tabs_module_hiddenWidthSetter--61bb2","contentSwitchTabList":"bp_tabs_module_contentSwitchTabList--61bb2","contentSwitchTab":"bp_tabs_module_contentSwitchTab--61bb2","tabsListContainer":"bp_tabs_module_tabsListContainer--61bb2","tabList":"bp_tabs_module_tabList--61bb2","tabSeparator":"bp_tabs_module_tabSeparator--61bb2","tab":"bp_tabs_module_tab--61bb2"};
+var styles = {"hiddenWidthSetter":"bp_tabs_module_hiddenWidthSetter--daece","contentSwitchTabList":"bp_tabs_module_contentSwitchTabList--daece","contentSwitchTab":"bp_tabs_module_contentSwitchTab--daece","tabsListContainer":"bp_tabs_module_tabsListContainer--daece","tabList":"bp_tabs_module_tabList--daece","tabSeparator":"bp_tabs_module_tabSeparator--daece","tab":"bp_tabs_module_tab--daece"};
 
 export { styles as default };

package/lib-esm/radio-group/radio-group.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"root":"bp_radio_group_module_root--6d855","horizontal":"bp_radio_group_module_horizontal--6d855","radioOption":"bp_radio_group_module_radioOption--6d855","label":"bp_radio_group_module_label--6d855","description":"bp_radio_group_module_description--6d855","disabled":"bp_radio_group_module_disabled--6d855","radioButton":"bp_radio_group_module_radioButton--6d855","indicator":"bp_radio_group_module_indicator--6d855"};
+var styles = {"root":"bp_radio_group_module_root--0c7de","horizontal":"bp_radio_group_module_horizontal--0c7de","radioOption":"bp_radio_group_module_radioOption--0c7de","label":"bp_radio_group_module_label--0c7de","description":"bp_radio_group_module_description--0c7de","disabled":"bp_radio_group_module_disabled--0c7de","radioButton":"bp_radio_group_module_radioButton--0c7de","indicator":"bp_radio_group_module_indicator--0c7de"};
 
 export { styles as default };

package/lib-esm/search-input/search.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"search":"bp_search_module_search--c7718","searchIcon":"bp_search_module_searchIcon--c7718","global":"bp_search_module_global--c7718","searchInput":"bp_search_module_searchInput--c7718","firefoxDefaultOpacityFix":"bp_search_module_firefoxDefaultOpacityFix--c7718","withoutActionButton":"bp_search_module_withoutActionButton--c7718","clearSearchIcon":"bp_search_module_clearSearchIcon--c7718","actionButton":"bp_search_module_actionButton--c7718"};
+var styles = {"search":"bp_search_module_search--f2b54","searchIcon":"bp_search_module_searchIcon--f2b54","global":"bp_search_module_global--f2b54","searchInput":"bp_search_module_searchInput--f2b54","firefoxDefaultOpacityFix":"bp_search_module_firefoxDefaultOpacityFix--f2b54","withoutActionButton":"bp_search_module_withoutActionButton--f2b54","clearSearchIcon":"bp_search_module_clearSearchIcon--f2b54","actionButton":"bp_search_module_actionButton--f2b54"};
 
 export { styles as default };

package/lib-esm/select/select.js

@@ -1,6 +1,5 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { Caret, Checkmark } from '@box/blueprint-web-assets/icons/Fill';
-import { Label } from '@radix-ui/react-label';
 import * as ScrollArea from '@radix-ui/react-scroll-area';
 import * as SelectPrimitive from '@radix-ui/react-select';
 import clsx from 'clsx';
@@ -8,6 +7,7 @@ import { forwardRef, useCallback } from 'react';
 import { InlineError } from '../primitives/inline-error/inline-error.js';
 import { useUniqueId } from '../utils/useUniqueId.js';
 import styles from './select.module.js';
+import { useLabelable } from '../util-components/labelable/useLabelable.js';
 
 const Root = /*#__PURE__*/forwardRef((props, forwardedRef) => {
   const {
@@ -50,21 +50,19 @@ const Root = /*#__PURE__*/forwardRef((props, forwardedRef) => {
     onValueChange,
     onOpenChange: handleOnChange
   };
+  const Label = useLabelable(label, selectId);
   return jsxs("div", {
     className: clsx(styles.container, {
       [styles.disabled]: disabled
     }, className),
     children: [jsx(Label, {
       className: styles.label,
-      hidden: hideLabel,
-      htmlFor: selectId,
-      children: label
+      hideLabel: hideLabel
     }), jsxs(SelectPrimitive.Root, {
       ...selectProps,
       children: [jsxs(SelectPrimitive.Trigger, {
         ...triggerProps,
         ref: forwardedRef,
-        "aria-label": label,
         ...(hasError && {
           'aria-invalid': 'true'
         }),

package/lib-esm/select/select.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"container":"bp_select_module_container--48b8b","disabled":"bp_select_module_disabled--48b8b","label":"bp_select_module_label--48b8b","triggerBtn":"bp_select_module_triggerBtn--48b8b","error":"bp_select_module_error--48b8b","iconWrapper":"bp_select_module_iconWrapper--48b8b","icon":"bp_select_module_icon--48b8b","content":"bp_select_module_content--48b8b","viewport":"bp_select_module_viewport--48b8b","option":"bp_select_module_option--48b8b","secondaryText":"bp_select_module_secondaryText--48b8b","indicator":"bp_select_module_indicator--48b8b","separator":"bp_select_module_separator--48b8b"};
+var styles = {"container":"bp_select_module_container--48e5e","disabled":"bp_select_module_disabled--48e5e","label":"bp_select_module_label--48e5e","triggerBtn":"bp_select_module_triggerBtn--48e5e","error":"bp_select_module_error--48e5e","iconWrapper":"bp_select_module_iconWrapper--48e5e","icon":"bp_select_module_icon--48e5e","content":"bp_select_module_content--48e5e","viewport":"bp_select_module_viewport--48e5e","option":"bp_select_module_option--48e5e","secondaryText":"bp_select_module_secondaryText--48e5e","indicator":"bp_select_module_indicator--48e5e","separator":"bp_select_module_separator--48e5e"};
 
 export { styles as default };

package/lib-esm/select/types.d.ts

@@ -1,11 +1,8 @@
 import { type SelectItemProps as RadixItemProps, type SelectContentProps as RadixSelectContentProps, type SelectProps as RadixSelectProps, type SelectTriggerProps as RadixSelectTriggerProps } from '@radix-ui/react-select';
 import { type ReactElement } from 'react';
 import { type Modify } from '../types/modify';
-export interface ExtraProps {
-    /**
-     * The label for the select.
-     */
-    label: string;
+import { type Labelable } from '../util-components/labelable/types';
+export interface ExtraProps extends Labelable {
     /**
      * The placeholder value displayed within the select trigger button when no values has been selected yet.
      */

package/lib-esm/side-panel/side-panel-content.js

@@ -1,7 +1,8 @@
 import { jsx } from 'react/jsx-runtime';
 import * as RadixDialog from '@radix-ui/react-dialog';
 import { clsx } from 'clsx';
-import { forwardRef } from 'react';
+import { forwardRef, useCallback } from 'react';
+import { FocusScope } from '@radix-ui/react-focus-scope';
 import styles from './side-panel.module.js';
 import { useVariant } from './variant-context.js';
 
@@ -15,14 +16,26 @@ const SidePanelContent = /*#__PURE__*/forwardRef(({
   ...props
 }, forwardedRef) => {
   const variant = useVariant();
-  return jsx(RadixDialog.Content, {
-    ...props,
-    ref: forwardedRef,
-    asChild: asChild,
-    className: clsx(styles.content, styles.contentAnimated, {
-      [styles.dropShadowContent]: variant === 'dropShadowOverlay'
-    }, className),
-    children: children
+  const isInteractiveOverlayVariant = variant === 'interactiveOverlay';
+  const handleInteractOutside = useCallback(event => {
+    if (isInteractiveOverlayVariant) {
+      event.preventDefault();
+    }
+  }, [isInteractiveOverlayVariant]);
+  return jsx(FocusScope, {
+    trapped: !isInteractiveOverlayVariant,
+    children: jsx(RadixDialog.Content, {
+      ...props,
+      ref: forwardedRef,
+      asChild: asChild,
+      className: clsx(styles.content, styles.contentAnimatedSlideIn, {
+        [styles.overlayContent]: variant !== 'persistent',
+        [styles.contentAnimatedSlideOut]: isInteractiveOverlayVariant,
+        [styles.dropShadowContent]: variant === 'dropShadowOverlay'
+      }, className),
+      onInteractOutside: handleInteractOutside,
+      children: children
+    })
   });
 });
 /**
@@ -34,7 +47,7 @@ const SidePanelPersistentContent = /*#__PURE__*/forwardRef(({
   ...props
 }, forwardedRef) => jsx("div", {
   ref: forwardedRef,
-  className: clsx(styles.content, className),
+  className: clsx(styles.content, styles.persistentContent, className),
   ...props,
   children: children
 }));

package/lib-esm/side-panel/side-panel-header.js

@@ -40,7 +40,7 @@ const SidePanelHeader = /*#__PURE__*/forwardRef(({
     [styles.headerShadow]: isScrolledUnderHeader,
     [styles.headerMobile]: isMobile
   }, className);
-  if (variant === 'overlay' || variant === 'dropShadowOverlay') {
+  if (variant === 'overlay' || variant === 'dropShadowOverlay' || variant === 'interactiveOverlay') {
     return jsx(RadixDialog.Title, {
       ...rest,
       ref: forwardedRef,

package/lib-esm/side-panel/side-panel-overlay.d.ts

@@ -2,5 +2,6 @@
 import { type SidePanelOverlayComponentProps } from './types';
 /**
  * A layer that covers the inert portion of the view when the dialog is open.
+ * For 'interactiveOverlay' variant we not cover the inert portion of the view.
  */
 export declare const SidePanelOverlay: import("react").ForwardRefExoticComponent<Omit<SidePanelOverlayComponentProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/lib-esm/side-panel/side-panel-overlay.js

@@ -7,6 +7,7 @@ import { useVariant } from './variant-context.js';
 
 /**
  * A layer that covers the inert portion of the view when the dialog is open.
+ * For 'interactiveOverlay' variant we not cover the inert portion of the view.
  */
 const SidePanelOverlay = /*#__PURE__*/forwardRef(({
   children,
@@ -17,7 +18,7 @@ const SidePanelOverlay = /*#__PURE__*/forwardRef(({
   const variant = useVariant();
   return jsx(RadixDialog.Portal, {
     container: container,
-    children: jsx(RadixDialog.Overlay, {
+    children: variant === 'interactiveOverlay' ? children : jsx(RadixDialog.Overlay, {
       ref: forwardedRef,
       className: clsx(styles.overlay, {
         [styles.dropShadowOverlay]: variant === 'dropShadowOverlay'

package/lib-esm/side-panel/side-panel.js

@@ -26,10 +26,10 @@ const Root = props => {
       })
     });
   }
-  if (variant === 'overlay' || variant === 'dropShadowOverlay') {
+  if (variant === 'overlay' || variant === 'dropShadowOverlay' || variant === 'interactiveOverlay') {
     return jsx(Root$1, {
       ...restProps,
-      modal: true,
+      modal: variant !== 'interactiveOverlay',
       children: jsx(VariantProvider, {
         variant: variant,
         children: jsx(ScrollProvider, {

package/lib-esm/side-panel/side-panel.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"content":"bp_side_panel_module_content--4c9cb","header":"bp_side_panel_module_header--4c9cb","headerMobile":"bp_side_panel_module_headerMobile--4c9cb","headerShadow":"bp_side_panel_module_headerShadow--4c9cb","contentAnimated":"bp_side_panel_module_contentAnimated--4c9cb","slideIn":"bp_side_panel_module_slideIn--4c9cb","dropShadowContent":"bp_side_panel_module_dropShadowContent--4c9cb","close":"bp_side_panel_module_close--4c9cb","overlay":"bp_side_panel_module_overlay--4c9cb","dropShadowOverlay":"bp_side_panel_module_dropShadowOverlay--4c9cb","scrollableContainer":"bp_side_panel_module_scrollableContainer--4c9cb","footer":"bp_side_panel_module_footer--4c9cb","footerShadow":"bp_side_panel_module_footerShadow--4c9cb","footerButton":"bp_side_panel_module_footerButton--4c9cb"};
+var styles = {"content":"bp_side_panel_module_content--64cc5","header":"bp_side_panel_module_header--64cc5","headerMobile":"bp_side_panel_module_headerMobile--64cc5","headerShadow":"bp_side_panel_module_headerShadow--64cc5","persistentContent":"bp_side_panel_module_persistentContent--64cc5","contentAnimatedSlideIn":"bp_side_panel_module_contentAnimatedSlideIn--64cc5","slideIn":"bp_side_panel_module_slideIn--64cc5","contentAnimatedSlideOut":"bp_side_panel_module_contentAnimatedSlideOut--64cc5","slideOut":"bp_side_panel_module_slideOut--64cc5","dropShadowContent":"bp_side_panel_module_dropShadowContent--64cc5","close":"bp_side_panel_module_close--64cc5","overlayContent":"bp_side_panel_module_overlayContent--64cc5","overlay":"bp_side_panel_module_overlay--64cc5","dropShadowOverlay":"bp_side_panel_module_dropShadowOverlay--64cc5","scrollableContainer":"bp_side_panel_module_scrollableContainer--64cc5","footer":"bp_side_panel_module_footer--64cc5","footerShadow":"bp_side_panel_module_footerShadow--64cc5","footerButton":"bp_side_panel_module_footerButton--64cc5"};
 
 export { styles as default };

package/lib-esm/side-panel/types.d.ts

@@ -6,8 +6,10 @@ import { type ComponentPropsWithRef, type FunctionComponent, type PropsWithChild
  * 'overlay' - side panel is displayed over the page content on a darkened overlay
  *
  * 'dropShadowOverlay' - side panel is displayed over the page content on a transparent overlay
+ *
+ * 'interactiveOverlay' - side panel is displayed over the page content and does not block interaction with the page content
  */
-export type SidePanelVariant = 'persistent' | 'overlay' | 'dropShadowOverlay';
+export type SidePanelVariant = 'persistent' | 'overlay' | 'dropShadowOverlay' | 'interactiveOverlay';
 export type SidePanelProps = (SidePanelPersistentProps | SidePanelOverlayProps) & {
     variant: SidePanelVariant;
 };

package/lib-esm/slider/slider-incrementer.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"container":"bp_slider_incrementer_module_container--f6e53"};
+var styles = {"container":"bp_slider_incrementer_module_container--b3eb0"};
 
 export { styles as default };

package/lib-esm/slider/slider-range.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"container":"bp_slider_range_module_container--fb9ec","hasFocus":"bp_slider_range_module_hasFocus--fb9ec","thumb":"bp_slider_range_module_thumb--fb9ec","root":"bp_slider_range_module_root--fb9ec","disabled":"bp_slider_range_module_disabled--fb9ec","track":"bp_slider_range_module_track--fb9ec"};
+var styles = {"container":"bp_slider_range_module_container--39095","hasFocus":"bp_slider_range_module_hasFocus--39095","thumb":"bp_slider_range_module_thumb--39095","root":"bp_slider_range_module_root--39095","disabled":"bp_slider_range_module_disabled--39095","track":"bp_slider_range_module_track--39095"};
 
 export { styles as default };

package/lib-esm/slider/slider.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"container":"bp_slider_module_container--2658e"};
+var styles = {"container":"bp_slider_module_container--acbfe"};
 
 export { styles as default };

package/lib-esm/status/status.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"interactiveStatus":"bp_status_module_interactiveStatus--b3f3d","status":"bp_status_module_status--b3f3d","reverse":"bp_status_module_reverse--b3f3d","circle":"bp_status_module_circle--b3f3d","text":"bp_status_module_text--b3f3d","maxContainer":"bp_status_module_maxContainer--b3f3d","colorSurfaceStatusSurfaceGray":"bp_status_module_colorSurfaceStatusSurfaceGray--b3f3d","colorSurfaceStatusSurfaceYellow":"bp_status_module_colorSurfaceStatusSurfaceYellow--b3f3d","colorSurfaceStatusSurfaceOrange":"bp_status_module_colorSurfaceStatusSurfaceOrange--b3f3d","colorSurfaceStatusSurfaceRed":"bp_status_module_colorSurfaceStatusSurfaceRed--b3f3d","colorSurfaceStatusSurfacePurple":"bp_status_module_colorSurfaceStatusSurfacePurple--b3f3d","colorSurfaceStatusSurfaceLightBlue":"bp_status_module_colorSurfaceStatusSurfaceLightBlue--b3f3d","colorSurfaceStatusSurfaceDarkBlue":"bp_status_module_colorSurfaceStatusSurfaceDarkBlue--b3f3d","colorSurfaceStatusSurfaceGreen":"bp_status_module_colorSurfaceStatusSurfaceGreen--b3f3d"};
+var styles = {"interactiveStatus":"bp_status_module_interactiveStatus--32abb","status":"bp_status_module_status--32abb","reverse":"bp_status_module_reverse--32abb","circle":"bp_status_module_circle--32abb","text":"bp_status_module_text--32abb","maxContainer":"bp_status_module_maxContainer--32abb","colorSurfaceStatusSurfaceGray":"bp_status_module_colorSurfaceStatusSurfaceGray--32abb","colorSurfaceStatusSurfaceYellow":"bp_status_module_colorSurfaceStatusSurfaceYellow--32abb","colorSurfaceStatusSurfaceOrange":"bp_status_module_colorSurfaceStatusSurfaceOrange--32abb","colorSurfaceStatusSurfaceRed":"bp_status_module_colorSurfaceStatusSurfaceRed--32abb","colorSurfaceStatusSurfacePurple":"bp_status_module_colorSurfaceStatusSurfacePurple--32abb","colorSurfaceStatusSurfaceLightBlue":"bp_status_module_colorSurfaceStatusSurfaceLightBlue--32abb","colorSurfaceStatusSurfaceDarkBlue":"bp_status_module_colorSurfaceStatusSurfaceDarkBlue--32abb","colorSurfaceStatusSurfaceGreen":"bp_status_module_colorSurfaceStatusSurfaceGreen--32abb"};
 
 export { styles as default };

package/lib-esm/switch/switch.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"option":"bp_switch_module_option--4aaaa","label":"bp_switch_module_label--4aaaa","rightAlign":"bp_switch_module_rightAlign--4aaaa","description":"bp_switch_module_description--4aaaa","switch":"bp_switch_module_switch--4aaaa","thumb":"bp_switch_module_thumb--4aaaa","disabled":"bp_switch_module_disabled--4aaaa"};
+var styles = {"option":"bp_switch_module_option--b23cf","label":"bp_switch_module_label--b23cf","rightAlign":"bp_switch_module_rightAlign--b23cf","description":"bp_switch_module_description--b23cf","switch":"bp_switch_module_switch--b23cf","thumb":"bp_switch_module_thumb--b23cf","disabled":"bp_switch_module_disabled--b23cf"};
 
 export { styles as default };

package/lib-esm/text/text.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"textReset":"bp_text_module_textReset--80e0f","breakWord":"bp_text_module_breakWord--80e0f","textOnLightDefault":"bp_text_module_textOnLightDefault--80e0f","textOnLightSecondary":"bp_text_module_textOnLightSecondary--80e0f","textOnLightLink":"bp_text_module_textOnLightLink--80e0f","textOnDarkDefault":"bp_text_module_textOnDarkDefault--80e0f","titleMondo":"bp_text_module_titleMondo--80e0f","titleXLarge":"bp_text_module_titleXLarge--80e0f","titleLarge":"bp_text_module_titleLarge--80e0f","titleMedium":"bp_text_module_titleMedium--80e0f","titleSmall":"bp_text_module_titleSmall--80e0f","subtitle":"bp_text_module_subtitle--80e0f","bodyLargeBold":"bp_text_module_bodyLargeBold--80e0f","bodyLarge":"bp_text_module_bodyLarge--80e0f","bodyDefaultBold":"bp_text_module_bodyDefaultBold--80e0f","bodyDefaultSemibold":"bp_text_module_bodyDefaultSemibold--80e0f","bodyDefault":"bp_text_module_bodyDefault--80e0f","caption":"bp_text_module_caption--80e0f","labelBold":"bp_text_module_labelBold--80e0f","label":"bp_text_module_label--80e0f"};
+var styles = {"textReset":"bp_text_module_textReset--61771","breakWord":"bp_text_module_breakWord--61771","textOnLightDefault":"bp_text_module_textOnLightDefault--61771","textOnLightSecondary":"bp_text_module_textOnLightSecondary--61771","textOnLightLink":"bp_text_module_textOnLightLink--61771","textOnDarkDefault":"bp_text_module_textOnDarkDefault--61771","titleMondo":"bp_text_module_titleMondo--61771","titleXLarge":"bp_text_module_titleXLarge--61771","titleLarge":"bp_text_module_titleLarge--61771","titleMedium":"bp_text_module_titleMedium--61771","titleSmall":"bp_text_module_titleSmall--61771","subtitle":"bp_text_module_subtitle--61771","bodyLargeBold":"bp_text_module_bodyLargeBold--61771","bodyLarge":"bp_text_module_bodyLarge--61771","bodyDefaultBold":"bp_text_module_bodyDefaultBold--61771","bodyDefaultSemibold":"bp_text_module_bodyDefaultSemibold--61771","bodyDefault":"bp_text_module_bodyDefault--61771","caption":"bp_text_module_caption--61771","labelBold":"bp_text_module_labelBold--61771","label":"bp_text_module_label--61771"};
 
 export { styles as default };

package/lib-esm/text/types.d.ts

@@ -1,8 +1,8 @@
-import { type HTMLAttributes } from 'react';
+import { type HTMLAttributes, type LabelHTMLAttributes } from 'react';
 import { type StyledText } from '../utils/commonTypes';
 type TypographyVariant = 'titleMondo' | 'titleXLarge' | 'titleLarge' | 'titleMedium' | 'titleSmall' | 'subtitle' | 'bodyLargeBold' | 'bodyLarge' | 'bodyDefaultBold' | 'bodyDefaultSemibold' | 'bodyDefault' | 'caption' | 'labelBold' | 'label';
 type TypographyColors = 'textOnLightDefault' | 'textOnLightSecondary' | 'textOnLightLink' | 'textOnDarkDefault';
-type Element = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span' | 'legend';
+type Element = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span' | 'legend' | 'label';
 interface HeadingProps extends HTMLAttributes<HTMLHeadingElement> {
     as: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
 }
@@ -15,8 +15,11 @@ interface SpanProps extends HTMLAttributes<HTMLSpanElement> {
 interface LegendProps extends HTMLAttributes<HTMLLegendElement> {
     as: 'legend';
 }
+interface LabelProps extends LabelHTMLAttributes<HTMLLabelElement> {
+    as: 'label';
+}
 /** Supported HTML elements for text */
-export type ElementTypes = HeadingProps | ParagraphProps | LegendProps | SpanProps;
+export type ElementTypes = HeadingProps | ParagraphProps | LegendProps | SpanProps | LabelProps;
 export type TextProps = {
     /** The HTML element type which will render */
     as: Element;

package/lib-esm/text-area/text-area-autosize/text-area-autosize.module.js

@@ -1,4 +1,4 @@
 import '../../index.css';
-var styles = {"textArea":"bp_text_area_autosize_module_textArea--22d4e","error":"bp_text_area_autosize_module_error--22d4e","loading":"bp_text_area_autosize_module_loading--22d4e","loadingIndicator":"bp_text_area_autosize_module_loadingIndicator--22d4e","border":"bp_text_area_autosize_module_border--22d4e"};
+var styles = {"textArea":"bp_text_area_autosize_module_textArea--fe142","error":"bp_text_area_autosize_module_error--fe142","loading":"bp_text_area_autosize_module_loading--fe142","loadingIndicator":"bp_text_area_autosize_module_loadingIndicator--fe142","border":"bp_text_area_autosize_module_border--fe142"};
 
 export { styles as default };

package/lib-esm/text-area/text-area.d.ts

@@ -1,12 +1,10 @@
 /// <reference types="react" />
-export declare const TextArea: import("react").ForwardRefExoticComponent<(Omit<Omit<import("./text-area-autosize/types").TextareaAutosizeProps, "hasError"> & {
-    label: string;
+export declare const TextArea: import("react").ForwardRefExoticComponent<(Omit<import("../util-components/labelable/types").Labelable & Omit<import("./text-area-autosize/types").TextareaAutosizeProps, "hasError"> & {
     hideLabel?: boolean | undefined;
     disabled?: boolean | undefined;
     required?: boolean | undefined;
     error?: import("react").ReactNode;
-} & Required<Pick<import("./types").Loading, keyof import("./types").Loading>> & Omit<import("./types").Loading, keyof import("./types").Loading>, "ref"> | Omit<Omit<import("./text-area-autosize/types").TextareaAutosizeProps, "hasError"> & {
-    label: string;
+} & Required<Pick<import("./types").Loading, keyof import("./types").Loading>> & Omit<import("./types").Loading, keyof import("./types").Loading>, "ref"> | Omit<import("../util-components/labelable/types").Labelable & Omit<import("./text-area-autosize/types").TextareaAutosizeProps, "hasError"> & {
     hideLabel?: boolean | undefined;
     disabled?: boolean | undefined;
     required?: boolean | undefined;

package/lib-esm/text-area/text-area.js

@@ -3,9 +3,9 @@ import clsx from 'clsx';
 import { forwardRef } from 'react';
 import { InlineError } from '../primitives/inline-error/inline-error.js';
 import { useUniqueId } from '../utils/useUniqueId.js';
-import { VisuallyHidden } from '../visually-hidden/visually-hidden.js';
 import { TextAreaAutosize } from './text-area-autosize/text-area-autosize.js';
 import styles from './text-area.module.js';
+import { useLabelable } from '../util-components/labelable/useLabelable.js';
 
 const TextArea = /*#__PURE__*/forwardRef((props, forwardedRef) => {
   const {
@@ -22,19 +22,17 @@ const TextArea = /*#__PURE__*/forwardRef((props, forwardedRef) => {
   } = props;
   const textAreaId = useUniqueId('text-area-');
   const hasError = !!error && !disabled;
+  const Label = useLabelable(label, textAreaId);
   return jsxs("div", {
     className: clsx([styles.textAreaContainer], {
       [styles.disabled]: disabled,
       [styles.error]: hasError
     }, className),
-    children: [jsx("label", {
+    children: [jsx(Label, {
       className: clsx([styles.label], {
         [styles.hidden]: hideLabel
       }),
-      htmlFor: textAreaId,
-      children: hideLabel ? jsx(VisuallyHidden, {
-        children: label
-      }) : label
+      hideLabel: hideLabel
     }), jsx(TextAreaAutosize, {
       ...rest,
       ref: forwardedRef,

package/lib-esm/text-area/text-area.module.js

@@ -1,4 +1,4 @@
 import '../index.css';
-var styles = {"textAreaContainer":"bp_text_area_module_textAreaContainer--4933d","label":"bp_text_area_module_label--4933d","hidden":"bp_text_area_module_hidden--4933d","disabled":"bp_text_area_module_disabled--4933d","inlineError":"bp_text_area_module_inlineError--4933d"};
+var styles = {"textAreaContainer":"bp_text_area_module_textAreaContainer--52ec5","label":"bp_text_area_module_label--52ec5","hidden":"bp_text_area_module_hidden--52ec5","disabled":"bp_text_area_module_disabled--52ec5","inlineError":"bp_text_area_module_inlineError--52ec5"};
 
 export { styles as default };