@itwin/itwinui-react 3.8.0 → 3.9.0

package/esm/core/Table/filters/DateRangeFilter/DatePickerInput.js

@@ -3,7 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
-import { SvgCalendar, isBefore, useId } from '../../../utils/index.js';
+import { SvgCalendar, isBefore, useId } from '../../../../utils/index.js';
 import { DatePicker } from '../../../DatePicker/DatePicker.js';
 import { InputGrid } from '../../../InputGrid/InputGrid.js';
 import { Label } from '../../../Label/Label.js';
@@ -11,7 +11,7 @@ import { InputWithDecorations } from '../../../InputWithDecorations/InputWithDec
 import { Popover } from '../../../Popover/Popover.js';
 export const DatePickerInput = React.forwardRef((props, forwardedRef) => {
     const uid = useId();
-    const { onChange, date, parseInput, formatDate, label, required, disabled, isFromOrTo, selectedDate, wrapperProps, labelProps, inputWrapperProps, id = uid, localizedNames, ...rest } = props;
+    const { onChange, date, parseInput, formatDate, label, required, disabled, isFromOrTo, selectedDate, wrapperProps, labelProps, inputWrapperProps, id = uid, localizedNames, showYearSelection, ...rest } = props;
     const isDateDisabled = (date) => {
         if (isFromOrTo === 'to') {
             return isBefore(date, selectedDate);
@@ -49,7 +49,7 @@ export const DatePickerInput = React.forwardRef((props, forwardedRef) => {
         React.createElement(Label, { as: 'label', required: required, disabled: disabled, htmlFor: id, ...labelProps }, label),
         React.createElement(InputWithDecorations, { ...inputWrapperProps },
             React.createElement(InputWithDecorations.Input, { id: id, value: inputValue, onChange: onInputChange, required: required, disabled: disabled, ref: forwardedRef, ...rest }),
-            React.createElement(Popover, { content: React.createElement(DatePicker, { date: date, onChange: onDateSelected, setFocus: true, isDateDisabled: isDateDisabled, localizedNames: localizedNames, applyBackground: false }), placement: 'bottom-end', visible: isVisible, onVisibleChange: setIsVisible, closeOnOutsideClick: true, applyBackground: true },
+            React.createElement(Popover, { content: React.createElement(DatePicker, { date: date, onChange: onDateSelected, setFocus: true, isDateDisabled: isDateDisabled, localizedNames: localizedNames, applyBackground: false, showDatesOutsideMonth: false, showYearSelection: showYearSelection }), placement: 'bottom-end', visible: isVisible, onVisibleChange: setIsVisible, closeOnOutsideClick: true, applyBackground: true },
                 React.createElement(InputWithDecorations.Button, { "aria-label": 'Date picker', ref: buttonRef },
                     React.createElement(SvgCalendar, null))))));
 });

package/esm/core/Table/filters/DateRangeFilter/DateRangeFilter.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import type { FilterButtonBarTranslation } from '../FilterButtonBar.js';
 import type { TableFilterProps } from '../types.js';
+import { DatePickerInput } from './DatePickerInput.js';
 import type { DatePickerLocalizedNames } from '../../../DatePicker/DatePicker.js';
 export type DateRangeTranslation = {
     from: string;
@@ -12,5 +13,5 @@ export type DateRangeFilterProps<T extends Record<string, unknown>> = TableFilte
     parseInput?: (text: string) => Date;
     placeholder?: string;
     translatedLabels?: DateRangeTranslation & FilterButtonBarTranslation;
-};
+} & Pick<React.ComponentProps<typeof DatePickerInput>, 'showYearSelection'>;
 export declare const DateRangeFilter: <T extends Record<string, unknown>>(props: DateRangeFilterProps<T>) => React.JSX.Element;

package/esm/core/Table/filters/DateRangeFilter/DateRangeFilter.js

@@ -3,7 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
-import { useGlobals } from '../../../utils/index.js';
+import { useGlobals } from '../../../../utils/index.js';
 import { FilterButtonBar } from '../FilterButtonBar.js';
 import { BaseFilter } from '../BaseFilter.js';
 import { DatePickerInput } from './DatePickerInput.js';
@@ -27,7 +27,7 @@ const defaultParseInput = (text) => {
     return new Date('');
 };
 export const DateRangeFilter = (props) => {
-    const { column, translatedLabels, setFilter, clearFilter, formatDate = defaultFormatDate, parseInput = defaultParseInput, placeholder = 'MMM dd, yyyy', } = props;
+    const { column, translatedLabels, setFilter, clearFilter, formatDate = defaultFormatDate, parseInput = defaultParseInput, placeholder = 'MMM dd, yyyy', showYearSelection, } = props;
     useGlobals();
     const translatedStrings = { ...defaultStrings, ...translatedLabels };
     const [from, setFrom] = React.useState(column.filterValue?.[0] ? new Date(column.filterValue?.[0]) : undefined);
@@ -63,7 +63,7 @@ export const DateRangeFilter = (props) => {
         }
     };
     return (React.createElement(BaseFilter, null,
-        React.createElement(DatePickerInput, { ref: inputRef, label: translatedStrings.from, date: from, onChange: onFromChange, formatDate: formatDate, parseInput: parseInput, onKeyDown: onKeyDown, placeholder: placeholder, selectedDate: to, isFromOrTo: 'from', localizedNames: translatedStrings.datePicker }),
-        React.createElement(DatePickerInput, { label: translatedStrings.to, date: to, onChange: onToChange, formatDate: formatDate, parseInput: parseInput, onKeyDown: onKeyDown, placeholder: placeholder, selectedDate: from, isFromOrTo: 'to', localizedNames: translatedStrings.datePicker }),
+        React.createElement(DatePickerInput, { ref: inputRef, label: translatedStrings.from, date: from, onChange: onFromChange, formatDate: formatDate, parseInput: parseInput, onKeyDown: onKeyDown, placeholder: placeholder, selectedDate: to, isFromOrTo: 'from', localizedNames: translatedStrings.datePicker, showYearSelection: showYearSelection }),
+        React.createElement(DatePickerInput, { label: translatedStrings.to, date: to, onChange: onToChange, formatDate: formatDate, parseInput: parseInput, onKeyDown: onKeyDown, placeholder: placeholder, selectedDate: from, isFromOrTo: 'to', localizedNames: translatedStrings.datePicker, showYearSelection: showYearSelection }),
         React.createElement(FilterButtonBar, { setFilter: () => setFilter([from, to]), clearFilter: clearFilter, translatedLabels: translatedLabels })));
 };

package/esm/core/Table/filters/FilterButtonBar.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { CommonProps } from '../../utils/index.js';
+import type { CommonProps } from '../../../utils/index.js';
 export type FilterButtonBarTranslation = {
     filter: string;
     clear: string;

package/esm/core/Table/filters/FilterButtonBar.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import cx from 'classnames';
-import { Box, useGlobals } from '../../utils/index.js';
+import { Box, useGlobals } from '../../../utils/index.js';
 import { Button } from '../../Buttons/Button.js';
 const defaultStrings = {
     filter: 'Filter',

package/esm/core/Table/filters/FilterToggle.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import type { HeaderGroup } from '../../../react-table/react-table.js';
-import type { CommonProps } from '../../utils/index.js';
+import type { CommonProps } from '../../../utils/index.js';
 export type FilterToggleProps<T extends Record<string, unknown>> = {
     column: HeaderGroup<T>;
 } & CommonProps;

package/esm/core/Table/filters/FilterToggle.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import cx from 'classnames';
-import { useGlobals, SvgFilterHollow, SvgFilter } from '../../utils/index.js';
+import { useGlobals, SvgFilterHollow, SvgFilter, } from '../../../utils/index.js';
 import { IconButton } from '../../Buttons/IconButton.js';
 import { Popover } from '../../Popover/Popover.js';
 /**

package/esm/core/Table/filters/NumberRangeFilter/NumberRangeFilter.js

@@ -3,7 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
-import { useGlobals } from '../../../utils/index.js';
+import { useGlobals } from '../../../../utils/index.js';
 import { FilterButtonBar } from '../FilterButtonBar.js';
 import { BaseFilter } from '../BaseFilter.js';
 import { LabeledInput } from '../../../LabeledInput/LabeledInput.js';

package/esm/core/Table/filters/TextFilter/TextFilter.js

@@ -3,7 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
-import { useGlobals } from '../../../utils/index.js';
+import { useGlobals } from '../../../../utils/index.js';
 import { Input } from '../../../Input/Input.js';
 import { FilterButtonBar } from '../FilterButtonBar.js';
 import { BaseFilter } from '../BaseFilter.js';

package/esm/core/Table/filters/tableFilters.d.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { DateRangeFilter } from './DateRangeFilter/DateRangeFilter.js';
 import type { DateRangeTranslation } from './DateRangeFilter/DateRangeFilter.js';
 import type { FilterButtonBarTranslation } from './FilterButtonBar.js';
 import type { NumberRangeTranslation, NumberRangeFilterProps } from './NumberRangeFilter/NumberRangeFilter.js';
@@ -22,7 +23,7 @@ export type DateRangeFilterOptions = {
      * Translated filter labels.
      */
     translatedLabels?: DateRangeTranslation & FilterButtonBarTranslation;
-};
+} & Pick<React.ComponentProps<typeof DateRangeFilter>, 'showYearSelection'>;
 export declare const tableFilters: {
     /**
      * Basic filter with a single input field.

package/esm/core/Tabs/Tabs.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { PolymorphicForwardRefComponent } from '../utils/index.js';
+import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
 type TabsOrientationProps = {
     /**
      * Orientation of the tabs.
@@ -268,8 +268,8 @@ export declare const Tabs: PolymorphicForwardRefComponent<"div", TabsLegacyProps
     TabIcon: PolymorphicForwardRefComponent<"span", Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
         ref?: ((instance: HTMLSpanElement | null) => void) | React.RefObject<HTMLSpanElement> | null | undefined;
     }, "fill" | "as" | "key" | "size" | keyof React.HTMLAttributes<HTMLSpanElement> | "padded"> & {
-        size?: "small" | "auto" | "medium" | "large" | import("../utils/types.js").AnyString | undefined;
-        fill?: "default" | "informational" | "negative" | "positive" | "warning" | import("../utils/types.js").AnyString | undefined;
+        size?: "small" | "auto" | "medium" | "large" | import("../../utils/types.js").AnyString | undefined;
+        fill?: "default" | import("../../utils/types.js").AnyString | "informational" | "negative" | "positive" | "warning" | undefined;
         padded?: boolean | undefined;
     } & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
         as?: "span" | undefined;

package/esm/core/Tabs/Tabs.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import cx from 'classnames';
 import * as React from 'react';
-import { useSafeContext, Box, polymorphic, useIsClient, useLayoutEffect, useMergedRefs, useContainerWidth, ButtonBase, mergeEventHandlers, useControlledState, useId, useLatestRef, } from '../utils/index.js';
+import { useSafeContext, Box, polymorphic, useIsClient, useLayoutEffect, useMergedRefs, useContainerWidth, ButtonBase, mergeEventHandlers, useControlledState, useId, useLatestRef, } from '../../utils/index.js';
 import { Icon } from '../Icon/Icon.js';
 const TabsWrapper = React.forwardRef((props, ref) => {
     const { className, children, orientation = 'horizontal', type = 'default', focusActivationMode = 'auto', color = 'blue', defaultValue, value: activeValueProp, onValueChange, ...rest } = props;

package/esm/core/Tag/Tag.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { PolymorphicForwardRefComponent } from '../utils/index.js';
+import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
 type TagProps = {
     /**
      * Text inside the tag.

package/esm/core/Tag/Tag.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import cx from 'classnames';
 import * as React from 'react';
-import { SvgCloseSmall, Box, ButtonBase } from '../utils/index.js';
+import { SvgCloseSmall, Box, ButtonBase } from '../../utils/index.js';
 import { IconButton } from '../Buttons/IconButton.js';
 import { LinkAction, LinkBox } from '../LinkAction/LinkAction.js';
 /**
@@ -22,9 +22,7 @@ export const Tag = React.forwardRef((props, forwardedRef) => {
     return (React.createElement(Box, { as: shouldUseLinkAction ? LinkBox : !!onClick ? ButtonBase : 'span', className: cx({
             'iui-tag-basic': variant === 'basic',
             'iui-tag': variant === 'default',
-        }, className), 
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any -- ref's type doesn't matter internally
-        ref: forwardedRef, onClick: !shouldUseLinkAction ? onClick : undefined, ...rest },
+        }, className), ref: forwardedRef, onClick: !shouldUseLinkAction ? onClick : undefined, ...rest },
         variant === 'default' ? (React.createElement(Box, { as: (shouldUseLinkAction ? LinkAction : 'span'), onClick: shouldUseLinkAction ? onClick : undefined, ...labelProps, className: cx('iui-tag-label', labelProps?.className) }, children)) : (children),
         onRemove && (React.createElement(IconButton, { styleType: 'borderless', size: 'small', onClick: onRemove, "aria-label": 'Delete tag', ...removeButtonProps, className: cx('iui-tag-button', removeButtonProps?.className) },
             React.createElement(SvgCloseSmall, { "aria-hidden": true })))));

package/esm/core/Tag/TagContainer.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { PolymorphicForwardRefComponent } from '../utils/index.js';
+import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
 type TagContainerProps = {
     /**
      * Tags inside the container.

package/esm/core/Tag/TagContainer.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import cx from 'classnames';
-import { Box } from '../utils/index.js';
+import { Box } from '../../utils/index.js';
 /**
  * TagContainer for grouping tags.
  * @example

package/esm/core/Textarea/Textarea.d.ts

@@ -1,4 +1,4 @@
-import type { PolymorphicForwardRefComponent } from '../utils/index.js';
+import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
 export type TextareaProps = {
     /**
      * Status of textarea.

package/esm/core/ThemeProvider/ThemeProvider.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { PolymorphicForwardRefComponent } from '../utils/index.js';
+import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
 export type ThemeOptions = {
     /**
      * Whether to apply high-contrast versions of light and dark themes.

package/esm/core/ThemeProvider/ThemeProvider.js

@@ -5,7 +5,7 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import cx from 'classnames';
-import { useMediaQuery, useMergedRefs, Box, useLayoutEffect, useControlledState, useLatestRef, importCss, isUnitTest, HydrationProvider, } from '../utils/index.js';
+import { useMediaQuery, useMergedRefs, Box, useLayoutEffect, useControlledState, useLatestRef, importCss, isUnitTest, HydrationProvider, } from '../../utils/index.js';
 import { ThemeContext } from './ThemeContext.js';
 import { ToastProvider, Toaster } from '../Toast/Toaster.js';
 /**

package/esm/core/Tile/Tile.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { PolymorphicForwardRefComponent } from '../utils/index.js';
+import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
 import { IconButton } from '../Buttons/IconButton.js';
 type TileWrapperOwnProps = {
     /**
@@ -249,7 +249,7 @@ export declare const Tile: PolymorphicForwardRefComponent<"div", TileLegacyProps
      */
     IconButton: PolymorphicForwardRefComponent<"button", Omit<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
         ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
-    }, "label" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "isActive" | "iconProps"> & {
+    }, "label" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "stretched" | "isActive" | "iconProps"> & {
         isActive?: boolean | undefined;
         label?: React.ReactNode;
         labelProps?: Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
@@ -280,7 +280,7 @@ export declare const Tile: PolymorphicForwardRefComponent<"div", TileLegacyProps
         }> & {
             content: React.ReactNode;
             children?: React.ReactNode;
-        } & import("../utils/index.js").PortalProps & {
+        } & import("../../utils/index.js").PortalProps & {
             placement?: import("@floating-ui/utils").Placement | undefined;
             visible?: boolean | undefined;
             onVisibleChange?: ((visible: boolean) => void) | undefined;

package/esm/core/Tile/Tile.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import cx from 'classnames';
-import { StatusIconMap, SvgMore, SvgNew, SvgCheckmark, useSafeContext, supportsHas, polymorphic, Box, } from '../utils/index.js';
+import { StatusIconMap, SvgMore, SvgNew, SvgCheckmark, useSafeContext, supportsHas, polymorphic, Box, } from '../../utils/index.js';
 import { DropdownMenu } from '../DropdownMenu/DropdownMenu.js';
 import { IconButton } from '../Buttons/IconButton.js';
 import { ProgressRadial } from '../ProgressIndicators/ProgressRadial.js';

package/esm/core/TimePicker/TimePicker.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { PolymorphicForwardRefComponent } from '../utils/index.js';
+import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
 export type MeridiemType = 'AM' | 'PM';
 export type Precision = 'hours' | 'minutes' | 'seconds';
 export type TimePickerProps = {

package/esm/core/TimePicker/TimePicker.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import cx from 'classnames';
 import * as React from 'react';
-import { Box } from '../utils/index.js';
+import { Box } from '../../utils/index.js';
 const isSameHour = (date1, date2, meridiem) => {
     const adjustedHours = meridiem
         ? formatHourFrom12(date1.getHours(), meridiem)

package/esm/core/Toast/Toast.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { PolymorphicForwardRefComponent } from '../utils/index.js';
+import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
 export type ToastCategory = 'informational' | 'negative' | 'positive' | 'warning';
 export type ToastProps = {
     /**

package/esm/core/Toast/Toast.js

@@ -5,7 +5,7 @@
 import * as React from 'react';
 import { Transition } from 'react-transition-group';
 import cx from 'classnames';
-import { getWindow, StatusIconMap, SvgCloseSmall, Box, useSafeContext, ButtonBase, } from '../utils/index.js';
+import { getWindow, StatusIconMap, SvgCloseSmall, Box, useSafeContext, ButtonBase, } from '../../utils/index.js';
 import { IconButton } from '../Buttons/IconButton.js';
 import { ToasterStateContext } from './Toaster.js';
 const isMotionOk = () => getWindow()?.matchMedia?.('(prefers-reduced-motion: no-preference)')?.matches;

package/esm/core/Toast/Toaster.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import cx from 'classnames';
-import { Box, useSafeContext } from '../utils/index.js';
+import { Box, useSafeContext } from '../../utils/index.js';
 import { Toast } from './Toast.js';
 // ----------------------------------------------------------------------------
 export const useToaster = () => {

package/esm/core/ToggleSwitch/ToggleSwitch.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { PolymorphicForwardRefComponent } from '../utils/index.js';
+import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
 type ToggleSwitchProps = {
     /**
      * Label for the toggle switch.

package/esm/core/ToggleSwitch/ToggleSwitch.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import cx from 'classnames';
-import { Box, SvgCheckmark } from '../utils/index.js';
+import { Box, SvgCheckmark } from '../../utils/index.js';
 /**
  * A switch for turning on and off.
  * @example

package/esm/core/Tooltip/Tooltip.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import type { Placement } from '@floating-ui/react';
-import type { PolymorphicForwardRefComponent, PortalProps } from '../utils/index.js';
+import type { PolymorphicForwardRefComponent, PortalProps } from '../../utils/index.js';
 type TooltipOptions = {
     /**
      * Placement of the Tooltip

package/esm/core/Tooltip/Tooltip.js

@@ -5,7 +5,7 @@
 import * as React from 'react';
 import cx from 'classnames';
 import { useFloating, autoUpdate, offset, flip, shift, useHover, useFocus, useDismiss, useInteractions, safePolygon, size, autoPlacement, hide, inline, useDelayGroupContext, useDelayGroup, } from '@floating-ui/react';
-import { Box, Portal, cloneElementWithRef, useControlledState, useId, useMergedRefs, } from '../utils/index.js';
+import { Box, Portal, cloneElementWithRef, useControlledState, useId, useMergedRefs, } from '../../utils/index.js';
 const useTooltip = (options = {}) => {
     const uniqueId = useId();
     const { placement = 'top', visible, onVisibleChange, middleware = { flip: true, shift: true }, autoUpdateOptions = {}, reference, ariaStrategy = 'description', id = uniqueId, ...props } = options;
@@ -53,7 +53,6 @@ const useTooltip = (options = {}) => {
         }
         /** e.g. onPointerDown --> pointerdown */
         const domEventName = (e) => e.toLowerCase().substring(2);
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         const cleanupValues = {};
         Object.entries({
             ...ariaProps,

package/esm/core/TransferList/TransferList.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { PolymorphicForwardRefComponent } from '../utils/index.js';
+import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
 import { ListItem } from '../List/ListItem.js';
 type TransferListListboxWrapperOwnProps = {};
 type TransferListItemOwnProps = {

package/esm/core/TransferList/TransferList.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
 import cx from 'classnames';
-import { getFocusableElements, useMergedRefs, useId, useSafeContext, Box, polymorphic, } from '../utils/index.js';
+import { getFocusableElements, useMergedRefs, useId, useSafeContext, Box, polymorphic, } from '../../utils/index.js';
 import { List } from '../List/List.js';
 import { ListItem } from '../List/ListItem.js';
 import { Label } from '../Label/Label.js';

package/esm/core/Tree/Tree.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { CommonProps } from '../utils/index.js';
+import type { CommonProps } from '../../utils/index.js';
 export type NodeData<T> = {
     /**
      * Array of the child nodes contained in the node.

package/esm/core/Tree/Tree.js

@@ -3,7 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
-import { getFocusableElements, useVirtualization, mergeRefs, Box, polymorphic, } from '../utils/index.js';
+import { getFocusableElements, useVirtualization, mergeRefs, Box, polymorphic, } from '../../utils/index.js';
 import cx from 'classnames';
 import { TreeContext } from './TreeContext.js';
 /**

package/esm/core/Tree/TreeNode.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { CommonProps } from '../utils/index.js';
+import type { CommonProps } from '../../utils/index.js';
 type TreeNodeProps = {
     /**
      * Unique id of the node.

package/esm/core/Tree/TreeNode.js

@@ -3,7 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
-import { getFocusableElements, Box } from '../utils/index.js';
+import { getFocusableElements, Box } from '../../utils/index.js';
 import cx from 'classnames';
 import { TreeNodeExpander } from './TreeNodeExpander.js';
 import { useTreeContext } from './TreeContext.js';

package/esm/core/Tree/TreeNodeExpander.d.ts

@@ -1,4 +1,4 @@
-import type { PolymorphicForwardRefComponent } from '../utils/index.js';
+import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
 import type { IconButtonProps } from '../Buttons/IconButton.js';
 type TreeNodeExpanderProps = {
     isExpanded?: boolean;

package/esm/core/Tree/TreeNodeExpander.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import cx from 'classnames';
-import { SvgChevronRight, SvgChevronRightSmall } from '../utils/index.js';
+import { SvgChevronRight, SvgChevronRightSmall } from '../../utils/index.js';
 import { IconButton } from '../Buttons/IconButton.js';
 import { TreeContext } from './TreeContext.js';
 export const TreeNodeExpander = React.forwardRef((props, ref) => {

package/esm/core/Typography/Anchor.d.ts

@@ -1,4 +1,4 @@
-import type { PolymorphicForwardRefComponent } from '../utils/index.js';
+import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
 type AnchorProps = {
     /**
      * Whether the anchor links to an external site.

package/esm/core/Typography/Anchor.js

@@ -4,8 +4,9 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import cx from 'classnames';
-import { Box } from '../utils/index.js';
+import { Box } from '../../utils/index.js';
 import { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden.js';
+import { TextContext } from './Text.js';
 /**
  * A consistently styled anchor component.
  *
@@ -22,7 +23,8 @@ import { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden.js';
  * <Anchor as='button' onClick={() => {}}>click me</Anchor>
  */
 export const Anchor = React.forwardRef((props, forwardedRef) => {
-    const { isExternal, underline, children, ...rest } = props;
+    const isInsideText = React.useContext(TextContext);
+    const { isExternal, underline = isInsideText, children, ...rest } = props;
     return (React.createElement(Box, { as: 'a', "data-iui-underline": underline ? 'true' : undefined, ...rest, ref: forwardedRef, className: cx('iui-anchor', { 'iui-anchor-external': isExternal }, props.className) },
         children,
         props.target === '_blank' && (React.createElement(VisuallyHidden, null, " (opens in new tab)"))));

package/esm/core/Typography/Blockquote.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { PolymorphicForwardRefComponent } from '../utils/index.js';
+import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
 type BlockquoteProps = {
     /**
      * Optional footer for any attribution/source.

package/esm/core/Typography/Blockquote.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import cx from 'classnames';
 import * as React from 'react';
-import { Box } from '../utils/index.js';
+import { Box } from '../../utils/index.js';
 /**
  * Basic blockquote component
  * @example

package/esm/core/Typography/Code.d.ts

@@ -3,4 +3,4 @@
  * @example
  * <p>Some <Code>inline code</Code> in a paragraph</p>
  */
-export declare const Code: import("../utils/props.js").PolymorphicForwardRefComponent<"code", {}>;
+export declare const Code: import("../../utils/props.js").PolymorphicForwardRefComponent<"code", {}>;

package/esm/core/Typography/Code.js

@@ -2,7 +2,7 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import { polymorphic } from '../utils/index.js';
+import { polymorphic } from '../../utils/index.js';
 /**
  * Inline code element.
  * @example

package/esm/core/Typography/Kbd.d.ts

@@ -1,4 +1,4 @@
-import type { PolymorphicForwardRefComponent } from '../utils/index.js';
+import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
 /**
  * Some predefined strings for common keyboard keys.
  */

package/esm/core/Typography/Kbd.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import cx from 'classnames';
 import * as React from 'react';
-import { Box } from '../utils/index.js';
+import { Box } from '../../utils/index.js';
 /**
  * Some predefined strings for common keyboard keys.
  */

package/esm/core/Typography/Text.d.ts

@@ -1,4 +1,5 @@
-import type { PolymorphicForwardRefComponent } from '../utils/index.js';
+import * as React from 'react';
+import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
 type TextProps = {
     /**
      * Which typography variant/size should be used for the styling?
@@ -37,4 +38,5 @@ type TextProps = {
  * <Text isSkeleton>Skeleton text</Text>
  */
 export declare const Text: PolymorphicForwardRefComponent<"div", TextProps>;
+export declare const TextContext: React.Context<boolean>;
 export {};

package/esm/core/Typography/Text.js

@@ -4,7 +4,8 @@
  *--------------------------------------------------------------------------------------------*/
 import cx from 'classnames';
 import * as React from 'react';
-import { Box } from '../utils/index.js';
+import { Box } from '../../utils/index.js';
+// ----------------------------------------------------------------------------
 /**
  * Polymorphic typography component to render any kind of text as any kind of element.
  * Users should decide which element to render based on the context of their app. Link to heading levels docs: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements#accessibility_concerns
@@ -19,10 +20,13 @@ import { Box } from '../utils/index.js';
  */
 export const Text = React.forwardRef((props, ref) => {
     const { variant = 'body', className, isMuted = false, isSkeleton = false, ...rest } = props;
-    return (React.createElement(Box, { className: cx({
-            [`iui-text-${variant}`]: variant !== 'body',
-            'iui-text-block': variant === 'body',
-            'iui-text-muted': isMuted,
-            'iui-skeleton': isSkeleton,
-        }, className), ref: ref, ...rest }));
+    return (React.createElement(TextContext.Provider, { value: true },
+        React.createElement(Box, { className: cx({
+                [`iui-text-${variant}`]: variant !== 'body',
+                'iui-text-block': variant === 'body',
+                'iui-text-muted': isMuted,
+                'iui-skeleton': isSkeleton,
+            }, className), ref: ref, ...rest })));
 });
+// ----------------------------------------------------------------------------
+export const TextContext = React.createContext(false);

package/esm/core/VisuallyHidden/VisuallyHidden.d.ts

@@ -1,4 +1,4 @@
-import type { PolymorphicForwardRefComponent } from '../utils/props.js';
+import type { PolymorphicForwardRefComponent } from '../../utils/props.js';
 type VisuallyHiddenOwnProps = {
     /**
      * When VisuallyHidden is used with an interactive element (e.g. button),

package/esm/core/VisuallyHidden/VisuallyHidden.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import cx from 'classnames';
-import { Box, ShadowRoot, useHydration } from '../utils/index.js';
+import { Box, ShadowRoot, useHydration } from '../../utils/index.js';
 /**
  * Hides content visually but keeps it still accessible to screen readers
  * and other assistive technologies.