@itwin/itwinui-react 2.0.0-dev.0 → 2.0.0-dev.2

package/cjs/core/utils/icons/SvgStatusError.js

@@ -0,0 +1,47 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SvgStatusError = void 0;
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+var React = __importStar(require("react"));
+var SvgStatusError = function (props) {
+    return (React.createElement("svg", __assign({ viewBox: '0 0 16 16' }, props),
+        React.createElement("path", { d: 'm8 0a8 8 0 1 0 8 8 8 8 0 0 0 -8-8zm1 12h-2v-2h2zm0-3h-2v-5h2z' })));
+};
+exports.SvgStatusError = SvgStatusError;

package/cjs/core/utils/icons/SvgStatusSuccess.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export declare const SvgStatusSuccess: (props: React.ComponentProps<'svg'>) => JSX.Element;

package/cjs/core/utils/icons/SvgStatusSuccess.js

@@ -0,0 +1,47 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SvgStatusSuccess = void 0;
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+var React = __importStar(require("react"));
+var SvgStatusSuccess = function (props) {
+    return (React.createElement("svg", __assign({ viewBox: '0 0 16 16' }, props),
+        React.createElement("path", { d: 'm8 0a8 8 0 1 0 8 8 8 8 0 0 0 -8-8zm-1.35 12-3.65-3.41 1.4-1.3 2.36 2.2 4.83-4.49 1.41 1.29z' })));
+};
+exports.SvgStatusSuccess = SvgStatusSuccess;

package/cjs/core/utils/icons/SvgStatusWarning.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export declare const SvgStatusWarning: (props: React.ComponentProps<'svg'>) => JSX.Element;

package/cjs/core/utils/icons/SvgStatusWarning.js

@@ -0,0 +1,47 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SvgStatusWarning = void 0;
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+var React = __importStar(require("react"));
+var SvgStatusWarning = function (props) {
+    return (React.createElement("svg", __assign({ viewBox: '0 0 16 16' }, props),
+        React.createElement("path", { d: 'm15.86807 13.26721-6.77-11.62a1.15 1.15 0 0 0 -1.1-.67 1.17 1.17 0 0 0 -1.1.69l-6.77 11.59a1.2 1.2 0 0 0 1.1 1.72h13.45a1.19 1.19 0 0 0 1.19-1.71zm-6.87-.29h-2v-2h2zm0-3h-2v-5h2z' })));
+};
+exports.SvgStatusWarning = SvgStatusWarning;

package/cjs/core/utils/icons/SvgSwap.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export declare const SvgSwap: (props: React.ComponentProps<'svg'>) => JSX.Element;

package/cjs/core/utils/icons/SvgSwap.js

@@ -0,0 +1,47 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SvgSwap = void 0;
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+var React = __importStar(require("react"));
+var SvgSwap = function (props) {
+    return (React.createElement("svg", __assign({ viewBox: '0 0 16 16' }, props),
+        React.createElement("path", { d: 'm5 15-3.78125-3.5 3.78125-3.5v2h8v3h-8zm6-7 3.78125-3.5-3.78125-3.5v2h-8v3h8z' })));
+};
+exports.SvgSwap = SvgSwap;

package/cjs/core/utils/icons/SvgUpload.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export declare const SvgUpload: (props: React.ComponentProps<'svg'>) => JSX.Element;

package/cjs/core/utils/icons/SvgUpload.js

@@ -0,0 +1,47 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SvgUpload = void 0;
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+var React = __importStar(require("react"));
+var SvgUpload = function (props) {
+    return (React.createElement("svg", __assign({ viewBox: '0 0 16 16' }, props),
+        React.createElement("path", { d: 'm2 5h4v7h4v-7h4l-6-5zm12 6v3h-12v-3h-2v5h16v-5z' })));
+};
+exports.SvgUpload = SvgUpload;

package/cjs/core/utils/icons/index.d.ts

@@ -0,0 +1,29 @@
+export * from './StatusIconMap';
+export * from './SvgStatusSuccess';
+export * from './SvgStatusWarning';
+export * from './SvgStatusError';
+export * from './SvgInfoCircular';
+export * from './SvgClose';
+export * from './SvgCloseSmall';
+export * from './SvgChevronLeft';
+export * from './SvgChevronRight';
+export * from './SvgChevronLeftDouble';
+export * from './SvgChevronRightDouble';
+export * from './SvgCaretUpSmall';
+export * from './SvgCaretDownSmall';
+export * from './SvgCaretRightSmall';
+export * from './SvgSmileyHappy';
+export * from './SvgSwap';
+export * from './SvgUpload';
+export * from './SvgMoreVertical';
+export * from './SvgCheckmark';
+export * from './SvgCheckmarkSmall';
+export * from './SvgImportantSmall';
+export * from './SvgSortUp';
+export * from './SvgSortDown';
+export * from './SvgColumnManager';
+export * from './SvgMore';
+export * from './SvgNew';
+export * from './SvgFilter';
+export * from './SvgFilterHollow';
+export * from './SvgCalendar';

package/cjs/core/utils/icons/index.js

@@ -0,0 +1,49 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+__exportStar(require("./StatusIconMap"), exports);
+__exportStar(require("./SvgStatusSuccess"), exports);
+__exportStar(require("./SvgStatusWarning"), exports);
+__exportStar(require("./SvgStatusError"), exports);
+__exportStar(require("./SvgInfoCircular"), exports);
+__exportStar(require("./SvgClose"), exports);
+__exportStar(require("./SvgCloseSmall"), exports);
+__exportStar(require("./SvgChevronLeft"), exports);
+__exportStar(require("./SvgChevronRight"), exports);
+__exportStar(require("./SvgChevronLeftDouble"), exports);
+__exportStar(require("./SvgChevronRightDouble"), exports);
+__exportStar(require("./SvgCaretUpSmall"), exports);
+__exportStar(require("./SvgCaretDownSmall"), exports);
+__exportStar(require("./SvgCaretRightSmall"), exports);
+__exportStar(require("./SvgSmileyHappy"), exports);
+__exportStar(require("./SvgSwap"), exports);
+__exportStar(require("./SvgUpload"), exports);
+__exportStar(require("./SvgMoreVertical"), exports);
+__exportStar(require("./SvgCheckmark"), exports);
+__exportStar(require("./SvgCheckmarkSmall"), exports);
+__exportStar(require("./SvgImportantSmall"), exports);
+__exportStar(require("./SvgSortUp"), exports);
+__exportStar(require("./SvgSortDown"), exports);
+__exportStar(require("./SvgColumnManager"), exports);
+__exportStar(require("./SvgMore"), exports);
+__exportStar(require("./SvgNew"), exports);
+__exportStar(require("./SvgFilter"), exports);
+__exportStar(require("./SvgFilterHollow"), exports);
+__exportStar(require("./SvgCalendar"), exports);

package/cjs/core/utils/index.d.ts

@@ -3,3 +3,4 @@ export * from './hooks';
 export * from './components';
 export * from './props';
 export * from './color';
+export * from './icons';

package/cjs/core/utils/index.js

@@ -23,3 +23,4 @@ __exportStar(require("./hooks"), exports);
 __exportStar(require("./components"), exports);
 __exportStar(require("./props"), exports);
 __exportStar(require("./color"), exports);
+__exportStar(require("./icons"), exports);

package/esm/core/Alert/Alert.js

@@ -24,10 +24,9 @@ var __rest = (this && this.__rest) || function (s, e) {
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import SvgCloseSmall from '@itwin/itwinui-icons-react/cjs/icons/CloseSmall';
 import cx from 'classnames';
 import React from 'react';
-import { useTheme, StatusIconMap } from '../utils';
+import { useTheme, StatusIconMap, SvgCloseSmall } from '../utils';
 import '@itwin/itwinui-css/css/alert.css';
 /**
  * A small box to quickly grab user attention and communicate a brief message
@@ -48,12 +47,13 @@ export var Alert = function (props) {
     var children = props.children, className = props.className, _a = props.type, type = _a === void 0 ? 'informational' : _a, clickableText = props.clickableText, clickableTextProps = props.clickableTextProps, onClose = props.onClose, style = props.style, _b = props.isSticky, isSticky = _b === void 0 ? false : _b, rest = __rest(props, ["children", "className", "type", "clickableText", "clickableTextProps", "onClose", "style", "isSticky"]);
     useTheme();
     var StatusIcon = StatusIconMap[type];
-    return (React.createElement("div", __assign({ className: cx("iui-alert-".concat(type), { 'iui-sticky': isSticky }, className), style: style }, rest),
+    return (React.createElement("div", __assign({ className: cx('iui-alert', className), "data-iui-status": type, "data-iui-variant": isSticky ? 'sticky' : undefined, style: style }, rest),
         React.createElement(StatusIcon, { className: 'iui-alert-icon' }),
         React.createElement("span", { className: 'iui-alert-message' },
             children,
             clickableText && (React.createElement("a", __assign({}, clickableTextProps, { className: cx('iui-alert-link', clickableTextProps === null || clickableTextProps === void 0 ? void 0 : clickableTextProps.className) }), clickableText))),
         onClose && (React.createElement("button", { onClick: onClose, "aria-label": 'Close', type: 'button', className: 'iui-alert-button' },
-            React.createElement(SvgCloseSmall, { "aria-hidden": true, className: 'iui-alert-button-icon' })))));
+            React.createElement("span", { className: 'iui-alert-button-icon', "aria-hidden": true },
+                React.createElement(SvgCloseSmall, null))))));
 };
 export default Alert;

package/esm/core/Breadcrumbs/Breadcrumbs.js

@@ -26,8 +26,7 @@ var __rest = (this && this.__rest) || function (s, e) {
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
 import cx from 'classnames';
-import { useTheme, useMergedRefs, useOverflow } from '../utils';
-import SvgChevronRight from '@itwin/itwinui-icons-react/cjs/icons/ChevronRight';
+import { useTheme, useMergedRefs, useOverflow, SvgChevronRight, } from '../utils';
 import '@itwin/itwinui-css/css/breadcrumbs.css';
 /**
  * A breadcrumb trail is used as a navigational aid to help users keep track

package/esm/core/Buttons/DropdownButton/DropdownButton.js

@@ -28,9 +28,7 @@ import React from 'react';
 import cx from 'classnames';
 import { Button } from '../Button';
 import { DropdownMenu } from '../../DropdownMenu';
-import SvgCaretDownSmall from '@itwin/itwinui-icons-react/cjs/icons/CaretDownSmall';
-import SvgCaretUpSmall from '@itwin/itwinui-icons-react/cjs/icons/CaretUpSmall';
-import { useTheme, useMergedRefs } from '../../utils';
+import { SvgCaretDownSmall, SvgCaretUpSmall, useTheme, useMergedRefs, } from '../../utils';
 import '@itwin/itwinui-css/css/button.css';
 /**
  * Button that opens a DropdownMenu.

package/esm/core/Buttons/IdeasButton/IdeasButton.js

@@ -25,8 +25,7 @@ var __rest = (this && this.__rest) || function (s, e) {
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
-import SvgSmileyHappy from '@itwin/itwinui-icons-react/cjs/icons/SmileyHappy';
-import { useTheme } from '../../utils';
+import { SvgSmileyHappy, useTheme } from '../../utils';
 import { Button } from '../Button';
 /**
  * Ideas button

package/esm/core/Buttons/SplitButton/SplitButton.js

@@ -29,9 +29,7 @@ import React from 'react';
 import { Button } from '../Button';
 import { IconButton } from '../IconButton';
 import { DropdownMenu } from '../../DropdownMenu';
-import SvgCaretDownSmall from '@itwin/itwinui-icons-react/cjs/icons/CaretDownSmall';
-import SvgCaretUpSmall from '@itwin/itwinui-icons-react/cjs/icons/CaretUpSmall';
-import { useTheme } from '../../utils';
+import { SvgCaretDownSmall, SvgCaretUpSmall, useTheme, } from '../../utils';
 import '@itwin/itwinui-css/css/button.css';
 /**
  * Split button component with a DropdownMenu.

package/esm/core/Carousel/CarouselNavigation.js

@@ -29,8 +29,7 @@ import cx from 'classnames';
 import { CarouselContext } from './CarouselContext';
 import { IconButton } from '../Buttons';
 import { CarouselDotsList } from './CarouselDotsList';
-import SvgChevronLeft from '@itwin/itwinui-icons-react/cjs/icons/ChevronLeft';
-import SvgChevronRight from '@itwin/itwinui-icons-react/cjs/icons/ChevronRight';
+import { SvgChevronLeft, SvgChevronRight } from '../utils';
 /** Button for switching to previous slide */
 var PreviousButton = React.forwardRef(function (props, ref) {
     var context = React.useContext(CarouselContext);

package/esm/core/ColorPicker/ColorInputPanel.js

@@ -28,9 +28,8 @@ import React from 'react';
 import cx from 'classnames';
 import { IconButton } from '../Buttons';
 import { Input } from '../Input';
-import { ColorValue, InputContainer, useTheme } from '../utils';
+import { ColorValue, InputContainer, useTheme, SvgSwap, } from '../utils';
 import { useColorPickerContext } from './ColorPickerContext';
-import SvgSwap from '@itwin/itwinui-icons-react/cjs/icons/Swap';
 import '@itwin/itwinui-css/css/color-picker.css';
 /**
  * `ColorInputPanel` shows input fields to enter precise color values in the specified format.

package/esm/core/ComboBox/ComboBoxEndIcon.js

@@ -26,9 +26,8 @@ var __rest = (this && this.__rest) || function (s, e) {
  *--------------------------------------------------------------------------------------------*/
 import cx from 'classnames';
 import React from 'react';
-import { useSafeContext, useMergedRefs } from '../utils';
+import { useSafeContext, useMergedRefs, SvgCaretDownSmall } from '../utils';
 import { ComboBoxActionContext, ComboBoxRefsContext } from './helpers';
-import SvgCaretDownSmall from '@itwin/itwinui-icons-react/cjs/icons/CaretDownSmall';
 export var ComboBoxEndIcon = React.forwardRef(function (props, forwardedRef) {
     var className = props.className, children = props.children, onClickProp = props.onClick, disabled = props.disabled, isOpen = props.isOpen, rest = __rest(props, ["className", "children", "onClick", "disabled", "isOpen"]);
     var dispatch = useSafeContext(ComboBoxActionContext);

package/esm/core/DatePicker/DatePicker.js

@@ -24,13 +24,9 @@ var __rest = (this && this.__rest) || function (s, e) {
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import SvgChevronLeft from '@itwin/itwinui-icons-react/cjs/icons/ChevronLeft';
-import SvgChevronRight from '@itwin/itwinui-icons-react/cjs/icons/ChevronRight';
-import SvgChevronLeftDouble from '@itwin/itwinui-icons-react/cjs/icons/ChevronLeftDouble';
-import SvgChevronRightDouble from '@itwin/itwinui-icons-react/cjs/icons/ChevronRightDouble';
 import cx from 'classnames';
 import React from 'react';
-import { useTheme } from '../utils';
+import { useTheme, SvgChevronLeft, SvgChevronRight, SvgChevronLeftDouble, SvgChevronRightDouble, } from '../utils';
 import '@itwin/itwinui-css/css/date-picker.css';
 import { IconButton } from '../Buttons/IconButton';
 import { TimePicker } from '../TimePicker';

package/esm/core/Dialog/DialogTitleBar.js

@@ -26,8 +26,7 @@ var __rest = (this && this.__rest) || function (s, e) {
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
 import cx from 'classnames';
-import SvgClose from '@itwin/itwinui-icons-react/cjs/icons/Close';
-import { useTheme } from '../utils';
+import { useTheme, SvgClose } from '../utils';
 import { IconButton } from '../Buttons';
 import '@itwin/itwinui-css/css/dialog.css';
 import { useDialogContext } from './DialogContext';

package/esm/core/ExpandableBlock/ExpandableBlock.js

@@ -24,10 +24,9 @@ var __rest = (this && this.__rest) || function (s, e) {
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import SvgChevronRight from '@itwin/itwinui-icons-react/cjs/icons/ChevronRight';
 import cx from 'classnames';
 import React from 'react';
-import { useTheme, StatusIconMap, WithCSSTransition, } from '../utils';
+import { useTheme, StatusIconMap, WithCSSTransition, SvgChevronRight, } from '../utils';
 import '@itwin/itwinui-css/css/expandable-block.css';
 /**
  * Container that allows content to be hidden behind a brief title and a caption.

package/esm/core/FileUpload/FileUploadTemplate.js

@@ -3,9 +3,8 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
-import { useTheme } from '../utils';
+import { useTheme, SvgUpload } from '../utils';
 import '@itwin/itwinui-css/css/file-upload.css';
-import SvgUpload from '@itwin/itwinui-icons-react/cjs/icons/Upload';
 /**
  * Default template to be used with the `FileUpload` wrapper component.
  * Contains a hidden input with styled labels (customizable).

package/esm/core/Header/Header.js

@@ -24,11 +24,10 @@ var __rest = (this && this.__rest) || function (s, e) {
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import SvgMoreVertical from '@itwin/itwinui-icons-react/cjs/icons/MoreVertical';
 import cx from 'classnames';
 import React from 'react';
 import { IconButton } from '../Buttons';
-import { useTheme } from '../utils';
+import { useTheme, SvgMoreVertical } from '../utils';
 import '@itwin/itwinui-css/css/header.css';
 import { DropdownMenu } from '../DropdownMenu';
 var defaultTranslations = {
@@ -65,7 +64,7 @@ export var Header = function (props) {
     var appLogo = props.appLogo, breadcrumbs = props.breadcrumbs, _a = props.isSlim, isSlim = _a === void 0 ? false : _a, actions = props.actions, userIcon = props.userIcon, menuItems = props.menuItems, translatedStrings = props.translatedStrings, className = props.className, children = props.children, rest = __rest(props, ["appLogo", "breadcrumbs", "isSlim", "actions", "userIcon", "menuItems", "translatedStrings", "className", "children"]);
     useTheme();
     var headerTranslations = __assign(__assign({}, defaultTranslations), translatedStrings);
-    return (React.createElement("header", __assign({ className: cx('iui-page-header', { 'iui-slim': isSlim }, className) }, rest),
+    return (React.createElement("header", __assign({ className: cx('iui-page-header', className), "data-iui-size": isSlim ? 'slim' : undefined }, rest),
         React.createElement("div", { className: 'iui-page-header-left' },
             appLogo,
             breadcrumbs && React.createElement("div", { className: 'iui-page-header-divider' }),

package/esm/core/Header/HeaderBreadcrumbs.js

@@ -33,9 +33,8 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import SvgChevronRight from '@itwin/itwinui-icons-react/cjs/icons/ChevronRight';
 import React from 'react';
-import { useTheme } from '../utils';
+import { useTheme, SvgChevronRight } from '../utils';
 import '@itwin/itwinui-css/css/header.css';
 /**
  * Header breadcrumbs, adds chevron between each provided items.

package/esm/core/Header/HeaderDropdownButton.js

@@ -27,10 +27,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import cx from 'classnames';
 import React from 'react';
 import { DropdownMenu } from '../DropdownMenu';
-import SvgCaretDownSmall from '@itwin/itwinui-icons-react/cjs/icons/CaretDownSmall';
-import SvgCaretUpSmall from '@itwin/itwinui-icons-react/cjs/icons/CaretUpSmall';
-import { useTheme } from '../utils';
-import { useMergedRefs } from '../utils';
+import { useTheme, useMergedRefs, SvgCaretDownSmall, SvgCaretUpSmall, } from '../utils';
 import { HeaderBasicButton } from './HeaderBasicButton';
 export var HeaderDropdownButton = React.forwardRef(function (props, ref) {
     var menuItems = props.menuItems, className = props.className, children = props.children, rest = __rest(props, ["menuItems", "className", "children"]);

package/esm/core/Header/HeaderSplitButton.js

@@ -27,9 +27,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import cx from 'classnames';
 import React from 'react';
 import { DropdownMenu } from '../DropdownMenu';
-import SvgCaretDownSmall from '@itwin/itwinui-icons-react/cjs/icons/CaretDownSmall';
-import SvgCaretUpSmall from '@itwin/itwinui-icons-react/cjs/icons/CaretUpSmall';
-import { useTheme } from '../utils';
+import { useTheme, SvgCaretDownSmall, SvgCaretUpSmall, } from '../utils';
 import { HeaderBasicButton } from './HeaderBasicButton';
 export var HeaderSplitButton = React.forwardRef(function (props, forwardedRef) {
     var menuItems = props.menuItems, className = props.className, _a = props.menuPlacement, menuPlacement = _a === void 0 ? 'bottom-end' : _a, children = props.children, style = props.style, title = props.title, disabled = props.disabled, rest = __rest(props, ["menuItems", "className", "menuPlacement", "children", "style", "title", "disabled"]);

package/esm/core/InformationPanel/InformationPanelHeader.js

@@ -27,8 +27,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import React from 'react';
 import cx from 'classnames';
 import { IconButton } from '../Buttons';
-import SvgCloseSmall from '@itwin/itwinui-icons-react/cjs/icons/CloseSmall';
-import { useTheme } from '../utils';
+import { useTheme, SvgCloseSmall } from '../utils';
 import '@itwin/itwinui-css/css/information-panel.css';
 /**
  * Header of the InformationPanel to be passed in the `header` prop.

package/esm/core/Menu/MenuItem.js

@@ -26,9 +26,8 @@ var __rest = (this && this.__rest) || function (s, e) {
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
 import cx from 'classnames';
-import { useTheme, Popover, useMergedRefs } from '../utils';
+import { useTheme, Popover, useMergedRefs, SvgCaretRightSmall, } from '../utils';
 import '@itwin/itwinui-css/css/menu.css';
-import SvgCaretRightSmall from '@itwin/itwinui-icons-react/cjs/icons/CaretRightSmall';
 import { Menu } from './Menu';
 /**
  * Context used to provide menu item ref to sub-menu items.

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

@@ -24,11 +24,9 @@ var __rest = (this && this.__rest) || function (s, e) {
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import Positive from '@itwin/itwinui-icons-react/cjs/icons/CheckmarkSmall';
-import Negative from '@itwin/itwinui-icons-react/cjs/icons/ImportantSmall';
 import cx from 'classnames';
 import React from 'react';
-import { useTheme } from '../../utils';
+import { useTheme, SvgCheckmarkSmall, SvgImportantSmall, } from '../../utils';
 import '@itwin/itwinui-css/css/progress-indicator.css';
 /**
  * Circular Progress Indicator
@@ -50,8 +48,8 @@ export var ProgressRadial = function (props) {
     var _b = props.value, value = _b === void 0 ? 0 : _b, _c = props.indeterminate, indeterminate = _c === void 0 ? false : _c, status = props.status, children = props.children, _d = props.size, size = _d === void 0 ? '' : _d, className = props.className, style = props.style, rest = __rest(props, ["value", "indeterminate", "status", "children", "size", "className", "style"]);
     useTheme();
     var statusMap = {
-        negative: React.createElement(Negative, { "aria-hidden": true }),
-        positive: React.createElement(Positive, { "aria-hidden": true }),
+        negative: React.createElement(SvgImportantSmall, { "aria-hidden": true }),
+        positive: React.createElement(SvgCheckmarkSmall, { "aria-hidden": true }),
     };
     var fillStyle = {
         strokeDashoffset: status === 'positive'