@itwin/itwinui-react 3.0.0-dev.3 → 3.0.0-dev.5

package/cjs/core/InputGroup/InputGroup.js

@@ -1,35 +1,13 @@
-"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;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
 exports.InputGroup = void 0;
+const tslib_1 = require('tslib');
 /*---------------------------------------------------------------------------------------------
  * 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 index_js_1 = require("../utils/index.js");
+const React = tslib_1.__importStar(require('react'));
+const index_js_1 = require('../utils/index.js');
 /**
  * Group Checkbox/Radio components together
  * @example
@@ -46,19 +24,46 @@ const index_js_1 = require("../utils/index.js");
  * </InputGroup>
  */
 exports.InputGroup = React.forwardRef((props, forwardedRef) => {
-    const { children, disabled = false, displayStyle = 'default', label, message, status, svgIcon, required = false, ...rest } = props;
-    const icon = () => {
-        if (svgIcon) {
-            return React.cloneElement(svgIcon, { 'aria-hidden': true });
-        }
-        if (status && message) {
-            return React.cloneElement(index_js_1.StatusIconMap[status](), {
-                'aria-hidden': true,
-            });
-        }
-        return undefined;
-    };
-    return (React.createElement(index_js_1.InputContainer, { label: label, disabled: disabled, required: required, status: status, message: message, icon: icon(), isLabelInline: displayStyle === 'inline', ref: forwardedRef, ...rest },
-        React.createElement(index_js_1.Box, { className: 'iui-input-group' }, children)));
+  const {
+    children,
+    disabled = false,
+    displayStyle = 'default',
+    label,
+    message,
+    status,
+    svgIcon,
+    required = false,
+    ...rest
+  } = props;
+  const icon = () => {
+    if (svgIcon) {
+      return React.cloneElement(svgIcon, { 'aria-hidden': true });
+    }
+    if (status && message) {
+      return React.cloneElement(index_js_1.StatusIconMap[status](), {
+        'aria-hidden': true,
+      });
+    }
+    return undefined;
+  };
+  return React.createElement(
+    index_js_1.InputContainer,
+    {
+      label: label,
+      disabled: disabled,
+      required: required,
+      status: status,
+      message: message,
+      icon: icon(),
+      isLabelInline: displayStyle === 'inline',
+      ref: forwardedRef,
+      ...rest,
+    },
+    React.createElement(
+      index_js_1.Box,
+      { className: 'iui-input-group' },
+      children,
+    ),
+  );
 });
 exports.default = exports.InputGroup;

package/cjs/core/InputGroup/index.js

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

package/cjs/core/Label/Label.d.ts

@@ -1,5 +1,5 @@
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-declare type LabelOwnProps = {
+type LabelOwnProps = {
     /**
      * Set the display style of the label.
      *   - 'block' - default, no extra spacing (label and input will be on separate lines)

package/cjs/core/Label/Label.js

@@ -1,39 +1,14 @@
-"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 });
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
 exports.Label = void 0;
+const tslib_1 = require('tslib');
 /*---------------------------------------------------------------------------------------------
  * 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 React = tslib_1.__importStar(require('react'));
+const classnames_1 = tslib_1.__importDefault(require('classnames'));
+const index_js_1 = require('../utils/index.js');
 /**
  * A standalone label to be used with input components (using `htmlFor`).
  * Can be rendered as any element, e.g. span, using the `as` prop.
@@ -42,10 +17,29 @@ const index_js_1 = require("../utils/index.js");
  * <Input id='name-input' />
  */
 exports.Label = React.forwardRef((props, forwardedRef) => {
-    const { displayStyle = 'block', required, className, children, ...rest } = props;
-    return (React.createElement(index_js_1.Box, { as: 'label', className: (0, classnames_1.default)('iui-input-label', {
-            'iui-inline': displayStyle === 'inline',
-            'iui-required': required,
-        }, className), ref: forwardedRef, ...rest }, children));
+  const {
+    displayStyle = 'block',
+    required,
+    className,
+    children,
+    ...rest
+  } = props;
+  return React.createElement(
+    index_js_1.Box,
+    {
+      as: 'label',
+      className: (0, classnames_1.default)(
+        'iui-input-label',
+        {
+          'iui-inline': displayStyle === 'inline',
+          'iui-required': required,
+        },
+        className,
+      ),
+      ref: forwardedRef,
+      ...rest,
+    },
+    children,
+  );
 });
 exports.default = exports.Label;

package/cjs/core/Label/index.js

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

package/cjs/core/LabeledInput/LabeledInput.d.ts

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

package/cjs/core/LabeledInput/LabeledInput.js

@@ -1,36 +1,14 @@
-"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;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
 exports.LabeledInput = void 0;
+const tslib_1 = require('tslib');
 /*---------------------------------------------------------------------------------------------
  * 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 Input_js_1 = require("../Input/Input.js");
-const index_js_1 = require("../utils/index.js");
+const React = tslib_1.__importStar(require('react'));
+const Input_js_1 = require('../Input/Input.js');
+const index_js_1 = require('../utils/index.js');
 /**
  * Basic labeled input component
  * @example
@@ -40,10 +18,48 @@ const index_js_1 = require("../utils/index.js");
  * <LabeledInput status='negative' label='Negative' setFocus />
  */
 exports.LabeledInput = React.forwardRef((props, ref) => {
-    const uid = (0, index_js_1.useId)();
-    const { className, disabled = false, label, message, status, svgIcon, style, inputClassName, inputStyle, displayStyle = 'default', iconDisplayStyle = displayStyle === 'default' ? 'block' : 'inline', required = false, id = uid, ...rest } = props;
-    const icon = svgIcon ?? (status && index_js_1.StatusIconMap[status]());
-    return (React.createElement(index_js_1.InputContainer, { label: label, disabled: disabled, required: required, status: status, message: message, icon: icon, isLabelInline: displayStyle === 'inline', isIconInline: iconDisplayStyle === 'inline', className: className, style: style, inputId: id },
-        React.createElement(Input_js_1.Input, { disabled: disabled, className: inputClassName, style: inputStyle, required: required, ref: ref, id: id, ...rest })));
+  const uid = (0, index_js_1.useId)();
+  const {
+    className,
+    disabled = false,
+    label,
+    message,
+    status,
+    svgIcon,
+    style,
+    inputClassName,
+    inputStyle,
+    displayStyle = 'default',
+    iconDisplayStyle = displayStyle === 'default' ? 'block' : 'inline',
+    required = false,
+    id = uid,
+    ...rest
+  } = props;
+  const icon = svgIcon ?? (status && index_js_1.StatusIconMap[status]());
+  return React.createElement(
+    index_js_1.InputContainer,
+    {
+      label: label,
+      disabled: disabled,
+      required: required,
+      status: status,
+      message: message,
+      icon: icon,
+      isLabelInline: displayStyle === 'inline',
+      isIconInline: iconDisplayStyle === 'inline',
+      className: className,
+      style: style,
+      inputId: id,
+    },
+    React.createElement(Input_js_1.Input, {
+      disabled: disabled,
+      className: inputClassName,
+      style: inputStyle,
+      required: required,
+      ref: ref,
+      id: id,
+      ...rest,
+    }),
+  );
 });
 exports.default = exports.LabeledInput;

package/cjs/core/LabeledInput/index.js

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

package/cjs/core/LabeledSelect/LabeledSelect.d.ts

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

package/cjs/core/LabeledSelect/LabeledSelect.js

@@ -1,36 +1,14 @@
-"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;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
 exports.LabeledSelect = void 0;
+const tslib_1 = require('tslib');
 /*---------------------------------------------------------------------------------------------
  * 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 index_js_1 = require("../Select/index.js");
-const index_js_2 = require("../utils/index.js");
+const React = tslib_1.__importStar(require('react'));
+const index_js_1 = require('../Select/index.js');
+const index_js_2 = require('../utils/index.js');
 /**
  * Labeled select component to select value from options.
  * @example
@@ -65,22 +43,56 @@ const index_js_2 = require("../utils/index.js");
  * />
  */
 const LabeledSelect = (props) => {
-    const { className, disabled = false, label, message, status, svgIcon, displayStyle = 'default', style, selectClassName, selectStyle, required = false, triggerProps, ...rest } = props;
-    const labelId = `${(0, index_js_2.useId)()}-label`;
-    const icon = () => {
-        if (svgIcon) {
-            return React.cloneElement(svgIcon, { 'aria-hidden': true });
-        }
-        if (status && message) {
-            return index_js_2.StatusIconMap[status]();
-        }
-        return undefined;
-    };
-    return (React.createElement(index_js_2.InputContainer, { label: label, disabled: disabled, required: required, status: status, message: message, icon: displayStyle === 'default' ? icon() : undefined, isLabelInline: displayStyle === 'inline', className: className, style: style, labelId: labelId },
-        React.createElement(index_js_1.Select, { disabled: disabled, className: selectClassName, style: selectStyle, ...rest, triggerProps: {
-                'aria-labelledby': labelId,
-                ...triggerProps,
-            } })));
+  const {
+    className,
+    disabled = false,
+    label,
+    message,
+    status,
+    svgIcon,
+    displayStyle = 'default',
+    style,
+    selectClassName,
+    selectStyle,
+    required = false,
+    triggerProps,
+    ...rest
+  } = props;
+  const labelId = `${(0, index_js_2.useId)()}-label`;
+  const icon = () => {
+    if (svgIcon) {
+      return React.cloneElement(svgIcon, { 'aria-hidden': true });
+    }
+    if (status && message) {
+      return index_js_2.StatusIconMap[status]();
+    }
+    return undefined;
+  };
+  return React.createElement(
+    index_js_2.InputContainer,
+    {
+      label: label,
+      disabled: disabled,
+      required: required,
+      status: status,
+      message: message,
+      icon: displayStyle === 'default' ? icon() : undefined,
+      isLabelInline: displayStyle === 'inline',
+      className: className,
+      style: style,
+      labelId: labelId,
+    },
+    React.createElement(index_js_1.Select, {
+      disabled: disabled,
+      className: selectClassName,
+      style: selectStyle,
+      ...rest,
+      triggerProps: {
+        'aria-labelledby': labelId,
+        ...triggerProps,
+      },
+    }),
+  );
 };
 exports.LabeledSelect = LabeledSelect;
 exports.default = exports.LabeledSelect;

package/cjs/core/LabeledSelect/index.js

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

package/cjs/core/LabeledTextarea/LabeledTextarea.d.ts

@@ -1,8 +1,7 @@
 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';
-declare type LabeledTextareaProps = {
+type LabeledTextareaProps = {
     /**
      * Label for the textarea.
      */
@@ -23,7 +22,7 @@ declare type LabeledTextareaProps = {
      * Custom style for textarea.
      */
     textareaStyle?: React.CSSProperties;
-} & Pick<LabeledInputProps, 'svgIcon' | 'displayStyle' | 'iconDisplayStyle'> & TextareaProps;
+} & Pick<LabeledInputProps, 'svgIcon' | 'displayStyle' | 'iconDisplayStyle'>;
 /**
  * Textarea wrapper that allows for additional styling and labelling
  * @example

package/cjs/core/LabeledTextarea/LabeledTextarea.js

@@ -1,36 +1,14 @@
-"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;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
 exports.LabeledTextarea = void 0;
+const tslib_1 = require('tslib');
 /*---------------------------------------------------------------------------------------------
  * 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 index_js_1 = require("../utils/index.js");
-const index_js_2 = require("../Textarea/index.js");
+const React = tslib_1.__importStar(require('react'));
+const index_js_1 = require('../utils/index.js');
+const index_js_2 = require('../Textarea/index.js');
 /**
  * Textarea wrapper that allows for additional styling and labelling
  * @example
@@ -53,10 +31,48 @@ const index_js_2 = require("../Textarea/index.js");
  * />
  */
 exports.LabeledTextarea = React.forwardRef((props, ref) => {
-    const uid = (0, index_js_1.useId)();
-    const { className, style, disabled = false, label, message, status, textareaClassName, textareaStyle, displayStyle = 'default', iconDisplayStyle = displayStyle === 'default' ? 'block' : 'inline', svgIcon, required = false, id = uid, ...textareaProps } = props;
-    const icon = svgIcon ?? (status && index_js_1.StatusIconMap[status]());
-    return (React.createElement(index_js_1.InputContainer, { label: label, disabled: disabled, required: required, status: status, message: message, icon: icon, isLabelInline: displayStyle === 'inline', isIconInline: iconDisplayStyle === 'inline', className: className, style: style, inputId: id },
-        React.createElement(index_js_2.Textarea, { disabled: disabled, className: textareaClassName, style: textareaStyle, required: required, id: id, ...textareaProps, ref: ref })));
+  const uid = (0, index_js_1.useId)();
+  const {
+    className,
+    style,
+    disabled = false,
+    label,
+    message,
+    status,
+    textareaClassName,
+    textareaStyle,
+    displayStyle = 'default',
+    iconDisplayStyle = displayStyle === 'default' ? 'block' : 'inline',
+    svgIcon,
+    required = false,
+    id = uid,
+    ...textareaProps
+  } = props;
+  const icon = svgIcon ?? (status && index_js_1.StatusIconMap[status]());
+  return React.createElement(
+    index_js_1.InputContainer,
+    {
+      label: label,
+      disabled: disabled,
+      required: required,
+      status: status,
+      message: message,
+      icon: icon,
+      isLabelInline: displayStyle === 'inline',
+      isIconInline: iconDisplayStyle === 'inline',
+      className: className,
+      style: style,
+      inputId: id,
+    },
+    React.createElement(index_js_2.Textarea, {
+      disabled: disabled,
+      className: textareaClassName,
+      style: textareaStyle,
+      required: required,
+      id: id,
+      ...textareaProps,
+      ref: ref,
+    }),
+  );
 });
 exports.default = exports.LabeledTextarea;

package/cjs/core/LabeledTextarea/index.js

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