@itwin/itwinui-react 2.10.1 → 2.11.0

package/cjs/core/RadioTiles/RadioTile.js

@@ -1,4 +1,27 @@
 "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 __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;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -9,32 +32,32 @@ exports.RadioTile = void 0;
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 const classnames_1 = __importDefault(require("classnames"));
-const react_1 = __importDefault(require("react"));
-const utils_1 = require("../utils");
+const React = __importStar(require("react"));
+const index_js_1 = require("../utils/index.js");
 require("@itwin/itwinui-css/css/radio-tile.css");
 /**
  * RadioTile component to be used in RadioTileGroup component
  * @example
  * <RadioTile label='My tile' description='Some info' icon={<SvgSmileyHappy />} />
  */
-exports.RadioTile = react_1.default.forwardRef((props, ref) => {
+exports.RadioTile = React.forwardRef((props, ref) => {
     const { icon, label, description, setFocus = false, className, style, ...rest } = props;
-    (0, utils_1.useTheme)();
-    const inputElementRef = react_1.default.useRef(null);
-    const refs = (0, utils_1.useMergedRefs)(inputElementRef, ref);
-    react_1.default.useEffect(() => {
+    (0, index_js_1.useTheme)();
+    const inputElementRef = React.useRef(null);
+    const refs = (0, index_js_1.useMergedRefs)(inputElementRef, ref);
+    React.useEffect(() => {
         if (inputElementRef.current && setFocus) {
             inputElementRef.current.focus();
         }
     }, [setFocus]);
-    return (react_1.default.createElement("label", { className: (0, classnames_1.default)('iui-radio-tile', className), style: style },
-        react_1.default.createElement("input", { className: 'iui-radio-tile-input', type: 'radio', ref: refs, ...rest }),
-        react_1.default.createElement("div", { className: 'iui-radio-tile-content' },
+    return (React.createElement("label", { className: (0, classnames_1.default)('iui-radio-tile', className), style: style },
+        React.createElement("input", { className: 'iui-radio-tile-input', type: 'radio', ref: refs, ...rest }),
+        React.createElement("div", { className: 'iui-radio-tile-content' },
             icon &&
-                react_1.default.cloneElement(icon, {
+                React.cloneElement(icon, {
                     className: (0, classnames_1.default)('iui-radio-tile-icon', icon.props.className),
                 }),
-            label && react_1.default.createElement("div", { className: 'iui-radio-tile-label' }, label),
-            description && (react_1.default.createElement("div", { className: 'iui-radio-tile-sublabel' }, description)))));
+            label && React.createElement("div", { className: 'iui-radio-tile-label' }, label),
+            description && (React.createElement("div", { className: 'iui-radio-tile-sublabel' }, description)))));
 });
 exports.default = exports.RadioTile;

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

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { InputGroupProps } from '../InputGroup';
+import type { InputGroupProps } from '../InputGroup/index.js';
 import '@itwin/itwinui-css/css/radio-tile.css';
 export declare type RadioTileGroupProps = Omit<InputGroupProps, 'displayStyle' | 'disabled'>;
 /**

package/cjs/core/RadioTiles/RadioTileGroup.js

@@ -1,6 +1,26 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+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.RadioTileGroup = void 0;
@@ -8,10 +28,10 @@ exports.RadioTileGroup = void 0;
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-const react_1 = __importDefault(require("react"));
-const InputGroup_1 = require("../InputGroup");
+const React = __importStar(require("react"));
+const index_js_1 = require("../InputGroup/index.js");
 require("@itwin/itwinui-css/css/radio-tile.css");
-const utils_1 = require("../utils");
+const index_js_2 = require("../utils/index.js");
 /**
  * RadioTileGroup component to group RadioTile components together
  * @example
@@ -22,9 +42,9 @@ const utils_1 = require("../utils");
  */
 const RadioTileGroup = (props) => {
     const { children, label, ...rest } = props;
-    (0, utils_1.useTheme)();
-    return (react_1.default.createElement(InputGroup_1.InputGroup, { label: label, ...rest },
-        react_1.default.createElement("div", { className: 'iui-radio-tile-container' }, children)));
+    (0, index_js_2.useTheme)();
+    return (React.createElement(index_js_1.InputGroup, { label: label, ...rest },
+        React.createElement("div", { className: 'iui-radio-tile-container' }, children)));
 };
 exports.RadioTileGroup = RadioTileGroup;
 exports.default = exports.RadioTileGroup;

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

@@ -1,6 +1,6 @@
-export { RadioTileGroup } from './RadioTileGroup';
-export type { RadioTileGroupProps } from './RadioTileGroup';
-export { RadioTile } from './RadioTile';
-export type { RadioTileProps } from './RadioTile';
+export { RadioTileGroup } from './RadioTileGroup.js';
+export type { RadioTileGroupProps } from './RadioTileGroup.js';
+export { RadioTile } from './RadioTile.js';
+export type { RadioTileProps } from './RadioTile.js';
 declare const _default: "./RadioTileGroup";
 export default _default;

package/cjs/core/RadioTiles/index.js

@@ -5,8 +5,8 @@ exports.RadioTile = exports.RadioTileGroup = 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 RadioTileGroup_1 = require("./RadioTileGroup");
-Object.defineProperty(exports, "RadioTileGroup", { enumerable: true, get: function () { return RadioTileGroup_1.RadioTileGroup; } });
-var RadioTile_1 = require("./RadioTile");
-Object.defineProperty(exports, "RadioTile", { enumerable: true, get: function () { return RadioTile_1.RadioTile; } });
+var RadioTileGroup_js_1 = require("./RadioTileGroup.js");
+Object.defineProperty(exports, "RadioTileGroup", { enumerable: true, get: function () { return RadioTileGroup_js_1.RadioTileGroup; } });
+var RadioTile_js_1 = require("./RadioTile.js");
+Object.defineProperty(exports, "RadioTile", { enumerable: true, get: function () { return RadioTile_js_1.RadioTile; } });
 exports.default = './RadioTileGroup';

package/cjs/core/SearchBox/SearchBox.d.ts

@@ -0,0 +1,104 @@
+import * as React from 'react';
+import type { IconProps, PolymorphicForwardRefComponent, PolymorphicComponentProps, InputFlexContainerProps } from '../utils/index.js';
+import type { IconButtonProps } from '../Buttons/IconButton/index.js';
+import '@itwin/itwinui-css/css/searchbox.css';
+declare type SearchBoxOwnProps = {
+    /**
+     * Whether the searchbox is expandable.
+     * @default false
+     */
+    expandable?: boolean;
+    /**
+     * SearchBox state toggle.
+     */
+    isExpanded?: boolean;
+    /**
+     * Function that is called on expanding searchbox.
+     */
+    onExpand?: () => void;
+    /**
+     * Function that is called on collapsing searchbox.
+     */
+    onCollapse?: () => void;
+    /**
+     * Input props when using default searchbox.
+     */
+    inputProps?: React.ComponentPropsWithoutRef<'input'>;
+    /**
+     * Modify size of the searchbox and it's subcomponents.
+     */
+    size?: 'small' | 'large';
+};
+/**
+ * SearchBox component.
+ * Can be used to implement search functionality for pages, tables and more.
+ * @example
+ *  <SearchBox inputProps={{ placeholder: 'Basic search' }}/>
+ *
+ * @example
+ * <SearchBox expandable inputProps={{ placeholder: 'Expandable search' }}/>
+ *
+ * @example
+ * <SearchBox>
+ *   <SearchBox.CollapsedState />
+ *   <SearchBox.ExpandedState>
+ *     <SearchBox.Icon />
+ *     <SearchBox.Input />
+ *     <SearchBox.CollapseButton />
+ *   </SearchBox.ExpandedState>
+ * </SearchBox>
+ */
+export declare const SearchBox: PolymorphicForwardRefComponent<"div", SearchBoxOwnProps & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>>, keyof {
+    isDisabled?: boolean | undefined;
+    status?: "positive" | "warning" | "negative" | undefined;
+}> & {
+    isDisabled?: boolean | undefined;
+    status?: "positive" | "warning" | "negative" | undefined;
+}> & {
+    /**
+     * Icon to be placed within SearchBox.
+     * @default Looking glass icon
+     */
+    Icon: PolymorphicForwardRefComponent<"span", IconProps>;
+    /**
+     * Input to be placed within SearchBox
+     */
+    Input: React.ForwardRefExoticComponent<Pick<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "key" | keyof React.InputHTMLAttributes<HTMLInputElement>> & React.RefAttributes<HTMLInputElement>>;
+    /**
+     * Button to be placed within SearchBox. Default has looking glass icon.
+     */
+    Button: PolymorphicForwardRefComponent<"button", IconButtonProps>;
+    /**
+     * Collapse button for expandable SearchBox. Clicking on this button will collapse SearchBox.
+     */
+    CollapseButton: PolymorphicForwardRefComponent<"button", IconButtonProps>;
+    /**
+     * Expand button for expandable SearchBox. Clicking on this will expand SearchBox.
+     */
+    ExpandButton: PolymorphicForwardRefComponent<"button", IconButtonProps>;
+    /**
+     * Subcomponent to customise expanded state of the SearchBox
+     */
+    ExpandedState: {
+        ({ children, }: {
+            children: React.ReactNode;
+        }): JSX.Element | null;
+        displayName: string;
+    };
+    /**
+     * Subcomponent to customise collapsed state.
+     */
+    CollapsedState: {
+        ({ children, }: {
+            children?: React.ReactNode;
+        }): JSX.Element | null;
+        displayName: string;
+    };
+};
+export declare type SearchBoxProps = PolymorphicComponentProps<'div', SearchBoxOwnProps & InputFlexContainerProps>;
+export declare type SearchBoxInputProps = React.ComponentProps<'input'>;
+export declare type SearchBoxButtonProps = PolymorphicComponentProps<'button', IconButtonProps>;
+export declare type SearchBoxExpandButtonProps = PolymorphicComponentProps<'button', IconButtonProps>;
+export declare type SearchBoxCollapseButtonProps = PolymorphicComponentProps<'button', IconButtonProps>;
+export declare type SearchBoxIconProps = PolymorphicComponentProps<'span', IconProps>;
+export default SearchBox;

package/cjs/core/SearchBox/SearchBox.js

@@ -0,0 +1,200 @@
+"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 __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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SearchBox = void 0;
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+const React = __importStar(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
+const index_js_1 = require("../utils/index.js");
+const index_js_2 = require("../Buttons/IconButton/index.js");
+require("@itwin/itwinui-css/css/searchbox.css");
+const SearchBoxContext = React.createContext(undefined);
+const SearchBoxComponent = React.forwardRef((props, ref) => {
+    (0, index_js_1.useTheme)();
+    const { size, expandable = false, isDisabled = false, onCollapse: onCollapseProp, onExpand: onExpandProp, isExpanded: isExpandedProp, children, inputProps, className, ...rest } = props;
+    const uid = (0, index_js_1.useId)();
+    const [inputId, setInputId] = React.useState(uid);
+    const inputRef = React.useRef(null);
+    const openButtonRef = React.useRef(null);
+    const [localExpanded, setLocalExpanded] = React.useState(isExpandedProp);
+    const isExpanded = isExpandedProp !== null && isExpandedProp !== void 0 ? isExpandedProp : localExpanded;
+    const onCollapse = () => {
+        setLocalExpanded(false);
+        onCollapseProp === null || onCollapseProp === void 0 ? void 0 : onCollapseProp();
+        queueMicrotask(() => { var _a; return (_a = openButtonRef.current) === null || _a === void 0 ? void 0 : _a.focus({ preventScroll: true }); });
+    };
+    const onExpand = () => {
+        setLocalExpanded(true);
+        onExpandProp === null || onExpandProp === void 0 ? void 0 : onExpandProp();
+        queueMicrotask(() => { var _a; return (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus({ preventScroll: true }); });
+    };
+    return (React.createElement(SearchBoxContext.Provider, { value: {
+            size,
+            isDisabled,
+            onCollapse,
+            onExpand,
+            inputRef,
+            inputId,
+            setInputId,
+            openButtonRef,
+            isExpanded,
+            expandable,
+        } },
+        React.createElement(index_js_1.InputFlexContainer, { ref: ref, className: (0, classnames_1.default)('iui-searchbox', { 'iui-expandable-searchbox': expandable }, className), "data-iui-size": size, isDisabled: isDisabled, "data-iui-expanded": isExpanded, ...rest }, children !== null && children !== void 0 ? children : (React.createElement(React.Fragment, null,
+            React.createElement(SearchBoxCollapsedState, null,
+                React.createElement(SearchBoxExpandButton, null)),
+            React.createElement(SearchBoxExpandedState, null,
+                React.createElement(SearchBoxIcon, null),
+                React.createElement(SearchBoxInput, { ...inputProps }),
+                expandable ? React.createElement(SearchBoxCollapseButton, null) : null))))));
+});
+// ----------------------------------------------------------------------------
+const SearchBoxCollapsedState = ({ children, }) => {
+    const { isExpanded, expandable } = (0, index_js_1.useSafeContext)(SearchBoxContext);
+    if (!expandable || isExpanded) {
+        return null;
+    }
+    return React.createElement(React.Fragment, null, children !== null && children !== void 0 ? children : React.createElement(SearchBoxExpandButton, null));
+};
+SearchBoxCollapsedState.displayName = 'SearchBox.CollapsedState';
+// ----------------------------------------------------------------------------
+const SearchBoxExpandedState = ({ children, }) => {
+    const { isExpanded, expandable } = (0, index_js_1.useSafeContext)(SearchBoxContext);
+    if (expandable && !isExpanded) {
+        return null;
+    }
+    return React.createElement(React.Fragment, null, children);
+};
+SearchBoxExpandedState.displayName = 'SearchBox.ExpandedState';
+// ----------------------------------------------------------------------------
+const SearchBoxIcon = React.forwardRef((props, ref) => {
+    const { className, children, ...rest } = props;
+    return (React.createElement(index_js_1.Icon, { "aria-hidden": true, className: (0, classnames_1.default)('iui-search-icon', className), ref: ref, ...rest }, children !== null && children !== void 0 ? children : React.createElement(index_js_1.SvgSearch, null)));
+});
+SearchBoxIcon.displayName = 'SearchBox.Icon';
+// ----------------------------------------------------------------------------
+const SearchBoxInput = React.forwardRef((props, ref) => {
+    const { className, id: idProp, ...rest } = props;
+    const { inputId, setInputId, isDisabled, inputRef } = (0, index_js_1.useSafeContext)(SearchBoxContext);
+    React.useEffect(() => {
+        if (idProp && idProp !== inputId) {
+            setInputId(idProp);
+        }
+    }, [idProp, inputId, setInputId]);
+    return (React.createElement("input", { id: idProp !== null && idProp !== void 0 ? idProp : inputId, ref: (0, index_js_1.useMergedRefs)(ref, inputRef), role: 'searchbox', type: 'text', className: (0, classnames_1.default)('iui-search-input', className), disabled: isDisabled, ...rest }));
+});
+SearchBoxInput.displayName = 'SearchBox.Input';
+// ----------------------------------------------------------------------------
+const SearchBoxButton = React.forwardRef((props, ref) => {
+    const { children, ...rest } = props;
+    const { size: sizeContext, isDisabled } = (0, index_js_1.useSafeContext)(SearchBoxContext);
+    return (React.createElement(index_js_2.IconButton, { styleType: 'borderless', size: sizeContext, ref: ref, disabled: isDisabled, ...rest }, children !== null && children !== void 0 ? children : React.createElement(index_js_1.SvgSearch, null)));
+});
+SearchBoxButton.displayName = 'SearchBox.Button';
+// ----------------------------------------------------------------------------
+const SearchBoxCollapseButton = React.forwardRef((props, ref) => {
+    const { children, onClick: onClickProp, ...rest } = props;
+    const { onCollapse, size: sizeContext, isDisabled, } = (0, index_js_1.useSafeContext)(SearchBoxContext);
+    return (React.createElement(SearchBoxButton, { ref: ref, "aria-label": 'Close searchbox', size: sizeContext, disabled: isDisabled, onClick: (e) => {
+            onClickProp === null || onClickProp === void 0 ? void 0 : onClickProp(e);
+            if (e.isDefaultPrevented()) {
+                return;
+            }
+            onCollapse === null || onCollapse === void 0 ? void 0 : onCollapse();
+        }, ...rest }, children !== null && children !== void 0 ? children : React.createElement(index_js_1.SvgCloseSmall, null)));
+});
+SearchBoxCollapseButton.displayName = 'SearchBox.CollapseButton';
+// ----------------------------------------------------------------------------
+const SearchBoxExpandButton = React.forwardRef((props, ref) => {
+    const { children, className, onClick: onClickProp, ...rest } = props;
+    const { onExpand, size: sizeContext, isDisabled, openButtonRef, } = (0, index_js_1.useSafeContext)(SearchBoxContext);
+    return (React.createElement(SearchBoxButton, { ref: (0, index_js_1.useMergedRefs)(ref, openButtonRef), className: (0, classnames_1.default)('iui-searchbox-open-button', className), "aria-label": 'Expand searchbox', size: sizeContext, disabled: isDisabled, onClick: (e) => {
+            onClickProp === null || onClickProp === void 0 ? void 0 : onClickProp(e);
+            if (e.isDefaultPrevented()) {
+                return;
+            }
+            onExpand === null || onExpand === void 0 ? void 0 : onExpand();
+        }, ...rest }, children !== null && children !== void 0 ? children : React.createElement(index_js_1.SvgSearch, null)));
+});
+SearchBoxExpandButton.displayName = 'SearchBox.ExpandButton';
+// ----------------------------------------------------------------------------
+/**
+ * SearchBox component.
+ * Can be used to implement search functionality for pages, tables and more.
+ * @example
+ *  <SearchBox inputProps={{ placeholder: 'Basic search' }}/>
+ *
+ * @example
+ * <SearchBox expandable inputProps={{ placeholder: 'Expandable search' }}/>
+ *
+ * @example
+ * <SearchBox>
+ *   <SearchBox.CollapsedState />
+ *   <SearchBox.ExpandedState>
+ *     <SearchBox.Icon />
+ *     <SearchBox.Input />
+ *     <SearchBox.CollapseButton />
+ *   </SearchBox.ExpandedState>
+ * </SearchBox>
+ */
+exports.SearchBox = Object.assign(SearchBoxComponent, {
+    /**
+     * Icon to be placed within SearchBox.
+     * @default Looking glass icon
+     */
+    Icon: SearchBoxIcon,
+    /**
+     * Input to be placed within SearchBox
+     */
+    Input: SearchBoxInput,
+    /**
+     * Button to be placed within SearchBox. Default has looking glass icon.
+     */
+    Button: SearchBoxButton,
+    /**
+     * Collapse button for expandable SearchBox. Clicking on this button will collapse SearchBox.
+     */
+    CollapseButton: SearchBoxCollapseButton,
+    /**
+     * Expand button for expandable SearchBox. Clicking on this will expand SearchBox.
+     */
+    ExpandButton: SearchBoxExpandButton,
+    /**
+     * Subcomponent to customise expanded state of the SearchBox
+     */
+    ExpandedState: SearchBoxExpandedState,
+    /**
+     * Subcomponent to customise collapsed state.
+     */
+    CollapsedState: SearchBoxCollapsedState,
+});
+exports.SearchBox.displayName = 'SearchBox';
+exports.default = exports.SearchBox;

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

@@ -0,0 +1,4 @@
+export { SearchBox } from './SearchBox.js';
+export type { SearchBoxProps, SearchBoxButtonProps, SearchBoxCollapseButtonProps, SearchBoxExpandButtonProps, SearchBoxIconProps, SearchBoxInputProps, } from './SearchBox.js';
+declare const _default: "./SearchBox";
+export default _default;

package/cjs/core/SearchBox/index.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SearchBox = 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 SearchBox_js_1 = require("./SearchBox.js");
+Object.defineProperty(exports, "SearchBox", { enumerable: true, get: function () { return SearchBox_js_1.SearchBox; } });
+exports.default = './SearchBox';

package/cjs/core/Select/Select.d.ts

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