@itwin/itwinui-react 3.0.0-dev.0 → 3.0.0-dev.1

package/esm/core/Footer/FooterSeparator.js

@@ -3,7 +3,6 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import { polymorphic } from '../utils/index.js';
-import '@itwin/itwinui-css/css/footer.css';
 /**
  * Footer separator. Recommended to use inside `Footer.List`.
  */

package/esm/core/Header/Header.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/header.css';
 declare type HeaderTranslations = {
     /**
      * 'More' menu button aria-label.

package/esm/core/Header/Header.js

@@ -6,7 +6,6 @@ import cx from 'classnames';
 import * as React from 'react';
 import { IconButton } from '../Buttons/index.js';
 import { SvgMoreVertical, Box } from '../utils/index.js';
-import '@itwin/itwinui-css/css/header.css';
 import { DropdownMenu } from '../DropdownMenu/index.js';
 const defaultTranslations = {
     moreOptions: 'More options',

package/esm/core/Header/HeaderBreadcrumbs.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/header.css';
 declare type HeaderBreadcrumbsProps = {
     /**
      * Array of elements, chevrons will be put between them.

package/esm/core/Header/HeaderBreadcrumbs.js

@@ -5,7 +5,6 @@
 import * as React from 'react';
 import cx from 'classnames';
 import { SvgChevronRight, Box } from '../utils/index.js';
-import '@itwin/itwinui-css/css/header.css';
 /**
  * Header breadcrumbs, adds chevron between each provided items.
  * @example

package/esm/core/Header/HeaderButton.d.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import type { ButtonProps } from '../Buttons/Button/Button.js';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/header.css';
 import type { DropdownButtonProps } from '../Buttons/DropdownButton/DropdownButton.js';
 declare type HeaderButtonProps = {
     /**

package/esm/core/Header/HeaderButton.js

@@ -4,7 +4,6 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import { Box } from '../utils/index.js';
-import '@itwin/itwinui-css/css/header.css';
 import { HeaderSplitButton } from './HeaderSplitButton.js';
 import { HeaderDropdownButton } from './HeaderDropdownButton.js';
 import { HeaderBasicButton } from './HeaderBasicButton.js';

package/esm/core/Header/HeaderLogo.d.ts

@@ -1,6 +1,5 @@
 /// <reference types="react" />
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/header.css';
 declare type HeaderLogoOwnProps = {
     /**
      * Logo shown before the main content.

package/esm/core/Header/HeaderLogo.js

@@ -5,7 +5,6 @@
 import cx from 'classnames';
 import * as React from 'react';
 import { Box } from '../utils/index.js';
-import '@itwin/itwinui-css/css/header.css';
 /**
  * Header Title section
  * @example

package/esm/core/InformationPanel/InformationPanel.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/information-panel.css';
 declare type InformationPanelProps = {
     /**
      * Is the panel open?

package/esm/core/InformationPanel/InformationPanel.js

@@ -5,7 +5,6 @@
 import cx from 'classnames';
 import * as React from 'react';
 import { useMergedRefs, Box } from '../utils/index.js';
-import '@itwin/itwinui-css/css/information-panel.css';
 /**
  * InformationPanel provides a way to view additional content or attributes
  * without leaving the main content area (e.g. Table).

package/esm/core/InformationPanel/InformationPanelBody.d.ts

@@ -1,4 +1,3 @@
-import '@itwin/itwinui-css/css/information-panel.css';
 /**
  * Body of the `InformationPanel` containing the main content.
  */

package/esm/core/InformationPanel/InformationPanelBody.js

@@ -3,7 +3,6 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import { polymorphic } from '../utils/index.js';
-import '@itwin/itwinui-css/css/information-panel.css';
 /**
  * Body of the `InformationPanel` containing the main content.
  */

package/esm/core/InformationPanel/InformationPanelContent.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/information-panel.css';
 declare type InformationPanelContentProps = {
     /**
      * If set to 'inline', the label/input pairs will be shown on the same line.

package/esm/core/InformationPanel/InformationPanelContent.js

@@ -5,7 +5,6 @@
 import cx from 'classnames';
 import * as React from 'react';
 import { Box } from '../utils/index.js';
-import '@itwin/itwinui-css/css/information-panel.css';
 /**
  * The `InformationPanelContent` component should be used inside `InformationPanelBody`
  * to style rows of key/value pairs, where the key is ideally represented by a `Label` component

package/esm/core/InformationPanel/InformationPanelHeader.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/information-panel.css';
 declare type InformationPanelHeaderProps = {
     /**
      * Callback fired when close icon is clicked.

package/esm/core/InformationPanel/InformationPanelHeader.js

@@ -6,7 +6,6 @@ import * as React from 'react';
 import cx from 'classnames';
 import { IconButton } from '../Buttons/index.js';
 import { SvgCloseSmall, Box } from '../utils/index.js';
-import '@itwin/itwinui-css/css/information-panel.css';
 /**
  * Header of the InformationPanel to be passed in the `header` prop.
  *

package/esm/core/InformationPanel/InformationPanelWrapper.d.ts

@@ -1,4 +1,3 @@
-import '@itwin/itwinui-css/css/information-panel.css';
 /**
  * InformationPanelWrapper should contain the `InformationPanel`
  * and the component over which the panel will overlay.

package/esm/core/InformationPanel/InformationPanelWrapper.js

@@ -3,7 +3,6 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import { polymorphic } from '../utils/index.js';
-import '@itwin/itwinui-css/css/information-panel.css';
 /**
  * InformationPanelWrapper should contain the `InformationPanel`
  * and the component over which the panel will overlay.

package/esm/core/Input/Input.d.ts

@@ -1,5 +1,4 @@
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/input.css';
 export declare type InputProps = {
     /**
      * Set focus on input element.

package/esm/core/Input/Input.js

@@ -5,7 +5,6 @@
 import cx from 'classnames';
 import * as React from 'react';
 import { useMergedRefs, Box } from '../utils/index.js';
-import '@itwin/itwinui-css/css/input.css';
 /**
  * Basic input component
  * @example

package/esm/core/InputGroup/InputGroup.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/utils.css';
 declare type InputGroupProps = {
     /**
      * Label of the group.

package/esm/core/InputGroup/InputGroup.js

@@ -4,7 +4,6 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import { StatusIconMap, InputContainer, Box } from '../utils/index.js';
-import '@itwin/itwinui-css/css/utils.css';
 /**
  * Group Checkbox/Radio components together
  * @example

package/esm/core/Label/Label.d.ts

@@ -1,5 +1,4 @@
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/utils.css';
 declare type LabelOwnProps = {
     /**
      * Set the display style of the label.

package/esm/core/Label/Label.js

@@ -5,7 +5,6 @@
 import * as React from 'react';
 import cx from 'classnames';
 import { Box } from '../utils/index.js';
-import '@itwin/itwinui-css/css/utils.css';
 /**
  * A standalone label to be used with input components (using `htmlFor`).
  * Can be rendered as any element, e.g. span, using the `as` prop.

package/esm/core/LabeledInput/LabeledInput.d.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import type { InputProps } from '../Input/Input.js';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/input.css';
 export declare type LabeledInputProps = {
     /**
      * Label of the input.

package/esm/core/LabeledInput/LabeledInput.js

@@ -5,7 +5,6 @@
 import * as React from 'react';
 import { Input } from '../Input/Input.js';
 import { StatusIconMap, InputContainer, useId } from '../utils/index.js';
-import '@itwin/itwinui-css/css/input.css';
 /**
  * Basic labeled input component
  * @example

package/esm/core/LabeledSelect/LabeledSelect.d.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import type { SelectProps } from '../Select/Select.js';
 import type { LabeledInputProps } from '../LabeledInput/LabeledInput.js';
-import '@itwin/itwinui-css/css/input.css';
 export declare type LabeledSelectProps<T> = {
     /**
      * Label of the select.

package/esm/core/LabeledSelect/LabeledSelect.js

@@ -5,7 +5,6 @@
 import * as React from 'react';
 import { Select } from '../Select/index.js';
 import { StatusIconMap, InputContainer, useId } from '../utils/index.js';
-import '@itwin/itwinui-css/css/input.css';
 /**
  * Labeled select component to select value from options.
  * @example

package/esm/core/LabeledTextarea/LabeledTextarea.d.ts

@@ -2,7 +2,6 @@ import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
 import type { TextareaProps } from '../Textarea/Textarea.js';
 import type { LabeledInputProps } from '../LabeledInput/LabeledInput.js';
-import '@itwin/itwinui-css/css/input.css';
 declare type LabeledTextareaProps = {
     /**
      * Label for the textarea.

package/esm/core/LabeledTextarea/LabeledTextarea.js

@@ -5,7 +5,6 @@
 import * as React from 'react';
 import { StatusIconMap, InputContainer, useId } from '../utils/index.js';
 import { Textarea } from '../Textarea/index.js';
-import '@itwin/itwinui-css/css/input.css';
 /**
  * Textarea wrapper that allows for additional styling and labelling
  * @example

package/esm/core/List/List.d.ts

@@ -1,2 +1 @@
-import '@itwin/itwinui-css/css/menu.css';
 export declare const List: import("../utils/props.js").PolymorphicForwardRefComponent<"ul", {}>;

package/esm/core/List/List.js

@@ -3,6 +3,5 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import { polymorphic } from '../utils/index.js';
-import '@itwin/itwinui-css/css/menu.css';
 export const List = polymorphic.ul('iui-list', { role: 'list' });
 List.displayName = 'List';

package/esm/core/List/ListItem.d.ts

@@ -1,6 +1,5 @@
 /// <reference types="react" />
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/menu.css';
 export declare type ListItemOwnProps = {
     /**
      * Size of the ListItem. Can be explicitly specified to be 'large',

package/esm/core/List/ListItem.js

@@ -5,7 +5,6 @@
 import * as React from 'react';
 import cx from 'classnames';
 import { polymorphic, Box } from '../utils/index.js';
-import '@itwin/itwinui-css/css/menu.css';
 const ListItemComponent = React.forwardRef((props, ref) => {
     const { size = 'default', disabled = false, active = false, actionable = false, focused = false, className, ...rest } = props;
     return (React.createElement(Box, { as: 'li', className: cx('iui-list-item', className), "data-iui-active": active ? 'true' : undefined, "data-iui-disabled": disabled ? 'true' : undefined, "data-iui-size": size === 'large' ? 'large' : undefined, "data-iui-actionable": actionable ? 'true' : undefined, "data-iui-focused": focused ? 'true' : undefined, ref: ref, ...rest }));

package/esm/core/Menu/Menu.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/menu.css';
 declare type MenuProps = {
     /**
      * Menu items. Recommended to use `MenuItem` components.

package/esm/core/Menu/Menu.js

@@ -5,7 +5,6 @@
 import * as React from 'react';
 import cx from 'classnames';
 import { useMergedRefs, getFocusableElements, Box } from '../utils/index.js';
-import '@itwin/itwinui-css/css/menu.css';
 /**
  * Basic menu component. Can be used for select or dropdown components.
  */

package/esm/core/Menu/MenuDivider.d.ts

@@ -1,4 +1,3 @@
-import '@itwin/itwinui-css/css/menu.css';
 /**
  * Divider between menu items. Should be used inside `Menu`.
  * @example

package/esm/core/Menu/MenuDivider.js

@@ -3,7 +3,6 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import { polymorphic } from '../utils/index.js';
-import '@itwin/itwinui-css/css/menu.css';
 /**
  * Divider between menu items. Should be used inside `Menu`.
  * @example

package/esm/core/Menu/MenuExtraContent.d.ts

@@ -1,4 +1,3 @@
-import '@itwin/itwinui-css/css/menu.css';
 /**
  * Component that allows to have any additional content inside `Menu`.
  * @example

package/esm/core/Menu/MenuExtraContent.js

@@ -3,7 +3,6 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import { polymorphic } from '../utils/index.js';
-import '@itwin/itwinui-css/css/menu.css';
 /**
  * Component that allows to have any additional content inside `Menu`.
  * @example

package/esm/core/Menu/MenuItem.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/menu.css';
 import type { ListItemOwnProps } from '../List/ListItem.js';
 export declare type MenuItemProps = {
     /**

package/esm/core/Menu/MenuItem.js

@@ -4,7 +4,6 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import { Popover, useMergedRefs, SvgCaretRightSmall } from '../utils/index.js';
-import '@itwin/itwinui-css/css/menu.css';
 import { Menu } from './Menu.js';
 import { ListItem } from '../List/ListItem.js';
 /**

package/esm/core/Menu/MenuItemSkeleton.d.ts

@@ -1,5 +1,4 @@
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/menu.css';
 declare type MenuItemSkeletonProps = {
     /**
      * Flag whether to show skeleton for sub-label.

package/esm/core/Menu/MenuItemSkeleton.js

@@ -5,7 +5,6 @@
 import * as React from 'react';
 import cx from 'classnames';
 import { Box, VisuallyHidden } from '../utils/index.js';
-import '@itwin/itwinui-css/css/menu.css';
 /**
  * Menu item that uses skeletons to indicate loading state.
  */

package/esm/core/Modal/Modal.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/dialog.css';
 import type { DialogMainProps } from '../Dialog/DialogMain.js';
 declare type ModalProps = {
     /**

package/esm/core/Modal/Modal.js

@@ -5,7 +5,6 @@
 import * as React from 'react';
 import ReactDOM from 'react-dom';
 import { getContainer, getDocument } from '../utils/index.js';
-import '@itwin/itwinui-css/css/dialog.css';
 import { Dialog } from '../Dialog/index.js';
 /**
  * Modal component which can wrap any content.

package/esm/core/NonIdealState/NonIdealState.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/non-ideal-state.css';
 declare type NonIdealStateProps = {
     /**
      * An svg component, preferably from @itwin/itwinui-illustrations-react.

package/esm/core/NonIdealState/NonIdealState.js

@@ -5,7 +5,6 @@
 import * as React from 'react';
 import { Box } from '../utils/index.js';
 import cx from 'classnames';
-import '@itwin/itwinui-css/css/non-ideal-state.css';
 /**
  * A stylized display to communicate common http errors and other non-ideal states.
  * Works well with svgs from @itwin/itwinui-illustrations-react.

package/esm/core/NotificationMarker/NotificationMarker.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/utils.css';
 declare type NotificationMarkerProps = {
     /**
      * Content of the NotificationMarker.

package/esm/core/NotificationMarker/NotificationMarker.js

@@ -5,7 +5,6 @@
 import * as React from 'react';
 import { Box } from '../utils/index.js';
 import cx from 'classnames';
-import '@itwin/itwinui-css/css/utils.css';
 /**
  * A small notification circle to the top-right of the passed children prop.
  * This can be applied to almost anything but mostly intended for icons within buttons with `styleType = default / borderless`.

package/esm/core/ProgressIndicators/ProgressLinear/ProgressLinear.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
-import '@itwin/itwinui-css/css/progress-indicator.css';
 declare type ProgressLinearProps = {
     /**
      * Progress percentage. Should be a number between 0 and 100.

package/esm/core/ProgressIndicators/ProgressLinear/ProgressLinear.js

@@ -5,7 +5,6 @@
 import * as React from 'react';
 import cx from 'classnames';
 import { Box } from '../../utils/index.js';
-import '@itwin/itwinui-css/css/progress-indicator.css';
 /**
  * Shows progress on a linear bar
  * @example

package/esm/core/ProgressIndicators/ProgressRadial/ProgressRadial.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
-import '@itwin/itwinui-css/css/progress-indicator.css';
 declare type ProgressRadialProps = {
     /**
      * Progress percentage. Should be a number between 0 and 100.

package/esm/core/ProgressIndicators/ProgressRadial/ProgressRadial.js

@@ -5,7 +5,6 @@
 import cx from 'classnames';
 import * as React from 'react';
 import { SvgCheckmarkSmall, SvgImportantSmall, Box, } from '../../utils/index.js';
-import '@itwin/itwinui-css/css/progress-indicator.css';
 /**
  * Circular Progress Indicator
  * @example

package/esm/core/Radio/Radio.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/radio.css';
 declare type RadioProps = {
     /**
      * Label of the radio.

package/esm/core/Radio/Radio.js

@@ -5,7 +5,6 @@
 import cx from 'classnames';
 import * as React from 'react';
 import { useMergedRefs, Box } from '../utils/index.js';
-import '@itwin/itwinui-css/css/radio.css';
 /**
  * Basic radio input component
  * @example

package/esm/core/RadioTiles/RadioTile.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/radio-tile.css';
 declare type RadioTileProps = {
     /**
      * Icon to be used.

package/esm/core/RadioTiles/RadioTile.js

@@ -5,7 +5,6 @@
 import cx from 'classnames';
 import * as React from 'react';
 import { useMergedRefs, Box } from '../utils/index.js';
-import '@itwin/itwinui-css/css/radio-tile.css';
 /**
  * RadioTile component to be used in RadioTileGroup component
  * @example

package/esm/core/RadioTiles/RadioTileGroup.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import { InputGroup } from '../InputGroup/index.js';
-import '@itwin/itwinui-css/css/radio-tile.css';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
 declare type RadioTileGroupProps = Omit<React.ComponentProps<typeof InputGroup>, 'displayStyle' | 'disabled'>;
 /**

package/esm/core/RadioTiles/RadioTileGroup.js

@@ -4,7 +4,6 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import { InputGroup } from '../InputGroup/index.js';
-import '@itwin/itwinui-css/css/radio-tile.css';
 import { Box } from '../utils/index.js';
 /**
  * RadioTileGroup component to group RadioTile components together

package/esm/core/SearchBox/SearchBox.d.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import type { IconProps, PolymorphicForwardRefComponent, InputFlexContainerProps } from '../utils/index.js';
 import type { IconButtonProps } from '../Buttons/IconButton/IconButton.js';
-import '@itwin/itwinui-css/css/searchbox.css';
 declare type SearchBoxOwnProps = {
     /**
      * Whether the searchbox is expandable.

package/esm/core/SearchBox/SearchBox.js

@@ -6,7 +6,6 @@ import * as React from 'react';
 import cx from 'classnames';
 import { InputFlexContainer, SvgSearch, SvgCloseSmall, useSafeContext, useId, Icon, useMergedRefs, mergeEventHandlers, Box, } from '../utils/index.js';
 import { IconButton } from '../Buttons/IconButton/index.js';
-import '@itwin/itwinui-css/css/searchbox.css';
 const SearchBoxContext = React.createContext(undefined);
 const SearchBoxComponent = React.forwardRef((props, ref) => {
     const { size, expandable = false, isDisabled = false, onCollapse: onCollapseProp, onExpand: onExpandProp, isExpanded: isExpandedProp, children, inputProps, className, ...rest } = props;

package/esm/core/Select/Select.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import type { PopoverProps, CommonProps } from '../utils/index.js';
-import '@itwin/itwinui-css/css/select.css';
 export declare type ItemRendererProps = {
     /**
      * Close handler that closes the dropdown.

package/esm/core/Select/Select.js

@@ -6,7 +6,6 @@ import * as React from 'react';
 import cx from 'classnames';
 import { Menu, MenuItem } from '../Menu/index.js';
 import { SvgCaretDownSmall, Popover, useId, AutoclearingHiddenLiveRegion, Box, } from '../utils/index.js';
-import '@itwin/itwinui-css/css/select.css';
 import SelectTag from './SelectTag.js';
 import SelectTagContainer from './SelectTagContainer.js';
 const isMultipleEnabled = (variable, multiple) => {

package/esm/core/Select/SelectTag.d.ts

@@ -1,5 +1,4 @@
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/select.css';
 declare type SelectTagProps = {
     /**
      * Text inside the tag.

package/esm/core/Select/SelectTag.js

@@ -5,7 +5,6 @@
 import cx from 'classnames';
 import * as React from 'react';
 import { Box } from '../utils/index.js';
-import '@itwin/itwinui-css/css/select.css';
 /**
  * Tag for showing selected value in `Select`.
  * @private

package/esm/core/SideNavigation/SideNavigation.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/side-navigation.css';
 declare type SideNavigationProps = {
     /**
      * Buttons shown in the top portion of sidenav.

package/esm/core/SideNavigation/SideNavigation.js

@@ -7,7 +7,6 @@ import cx from 'classnames';
 import { WithCSSTransition, SvgChevronRight, Box } from '../utils/index.js';
 import { IconButton } from '../Buttons/index.js';
 import { Tooltip } from '../Tooltip/index.js';
-import '@itwin/itwinui-css/css/side-navigation.css';
 /**
  * Left side navigation menu component.
  * @example

package/esm/core/SideNavigation/SidenavButton.d.ts

@@ -1,6 +1,5 @@
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
 import type { ButtonProps } from '../Buttons/Button/Button.js';
-import '@itwin/itwinui-css/css/side-navigation.css';
 declare type SidenavButtonProps = {
     /**
      * Whether the sidenav button is active,

package/esm/core/SideNavigation/SidenavButton.js

@@ -5,7 +5,6 @@
 import cx from 'classnames';
 import * as React from 'react';
 import { Button } from '../Buttons/index.js';
-import '@itwin/itwinui-css/css/side-navigation.css';
 /**
  * Wrapper around Button to be used as SideNavigation items.
  * Label is hidden when sidenav is collapsed.

package/esm/core/SideNavigation/SidenavSubmenu.d.ts

@@ -1,5 +1,4 @@
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import '@itwin/itwinui-css/css/side-navigation.css';
 /**
  * Subcomponent to be used in the `submenu` prop of `SideNavigation`.
  * @example