@itwin/itwinui-react 3.0.0-dev.4 → 3.0.0-dev.6

package/cjs/core/utils/components/Icon.js

@@ -1,50 +1,25 @@
-"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.Icon = 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 Box_js_1 = require("./Box.js");
+const React = tslib_1.__importStar(require('react'));
+const classnames_1 = tslib_1.__importDefault(require('classnames'));
+const Box_js_1 = require('./Box.js');
 const getSizeValue = (size) => {
-    switch (size) {
-        case 'small':
-            return 's';
-        case 'medium':
-            return 'm';
-        case 'large':
-            return 'l';
-        default:
-            return size;
-    }
+  switch (size) {
+    case 'small':
+      return 's';
+    case 'medium':
+      return 'm';
+    case 'large':
+      return 'l';
+    default:
+      return size;
+  }
 };
 /**
  * A utility component to provide size and fill to svgs.
@@ -61,7 +36,14 @@ const getSizeValue = (size) => {
  * </Icon>
  */
 exports.Icon = React.forwardRef((props, ref) => {
-    const { size = 'medium', fill = 'default', className, ...rest } = props;
-    return (React.createElement(Box_js_1.Box, { as: 'span', className: (0, classnames_1.default)('iui-svg-icon', className), "data-iui-icon-size": getSizeValue(size), "data-iui-icon-color": fill, ref: ref, ...rest }));
+  const { size = 'medium', fill = 'default', className, ...rest } = props;
+  return React.createElement(Box_js_1.Box, {
+    as: 'span',
+    className: (0, classnames_1.default)('iui-svg-icon', className),
+    'data-iui-icon-size': getSizeValue(size),
+    'data-iui-icon-color': fill,
+    ref: ref,
+    ...rest,
+  });
 });
 exports.default = exports.Icon;

package/cjs/core/utils/components/InputContainer.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-export declare type InputContainerProps<T extends React.ElementType = 'div'> = {
+export type InputContainerProps<T extends React.ElementType = 'div'> = {
     as?: T;
     label?: React.ReactNode;
     disabled?: boolean;
@@ -17,4 +17,4 @@ export declare type InputContainerProps<T extends React.ElementType = 'div'> = {
  * Input container to wrap inputs with label, and add optional message and icon.
  * @private
  */
-export declare const InputContainer: <T extends React.ElementType<any> = "div">(props: InputContainerProps<T>) => JSX.Element;
+export declare const InputContainer: <T extends React.ElementType<any> = "div">(props: InputContainerProps<T>) => React.JSX.Element;

package/cjs/core/utils/components/InputContainer.js

@@ -1,58 +1,87 @@
-"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.InputContainer = 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 Box_js_1 = require("./Box.js");
+const React = tslib_1.__importStar(require('react'));
+const classnames_1 = tslib_1.__importDefault(require('classnames'));
+const Box_js_1 = require('./Box.js');
 /**
  * Input container to wrap inputs with label, and add optional message and icon.
  * @private
  */
 const InputContainer = (props) => {
-    const { label, disabled, required, status, message, icon, isLabelInline, isIconInline, children, className, style, statusMessage, inputId, labelId, ...rest } = props;
-    return (React.createElement(Box_js_1.Box, { className: (0, classnames_1.default)('iui-input-container', {
-            'iui-disabled': disabled,
-            [`iui-${status}`]: !!status,
-            'iui-inline-label': isLabelInline,
-            'iui-inline-icon': isIconInline,
-            'iui-with-message': (!!message || !!icon || !!statusMessage) && !isLabelInline,
-        }, className), style: style, ...rest },
-        label && (React.createElement(Box_js_1.Box, { as: inputId && props.as !== 'label' ? 'label' : 'div', className: (0, classnames_1.default)('iui-label', {
-                'iui-required': required,
-            }), htmlFor: inputId, id: labelId }, label)),
-        children,
-        statusMessage ? (statusMessage) : (React.createElement(React.Fragment, null,
-            icon && (React.createElement(Box_js_1.Box, { as: 'span', className: 'iui-input-icon', "aria-hidden": true }, icon)),
-            message && !isLabelInline && (React.createElement(Box_js_1.Box, { className: 'iui-message' }, message))))));
+  const {
+    label,
+    disabled,
+    required,
+    status,
+    message,
+    icon,
+    isLabelInline,
+    isIconInline,
+    children,
+    className,
+    style,
+    statusMessage,
+    inputId,
+    labelId,
+    ...rest
+  } = props;
+  return React.createElement(
+    Box_js_1.Box,
+    {
+      className: (0, classnames_1.default)(
+        'iui-input-container',
+        {
+          'iui-disabled': disabled,
+          [`iui-${status}`]: !!status,
+          'iui-inline-label': isLabelInline,
+          'iui-inline-icon': isIconInline,
+          'iui-with-message':
+            (!!message || !!icon || !!statusMessage) && !isLabelInline,
+        },
+        className,
+      ),
+      style: style,
+      ...rest,
+    },
+    label &&
+      React.createElement(
+        Box_js_1.Box,
+        {
+          as: inputId && props.as !== 'label' ? 'label' : 'div',
+          className: (0, classnames_1.default)('iui-label', {
+            'iui-required': required,
+          }),
+          htmlFor: inputId,
+          id: labelId,
+        },
+        label,
+      ),
+    children,
+    statusMessage
+      ? statusMessage
+      : React.createElement(
+          React.Fragment,
+          null,
+          icon &&
+            React.createElement(
+              Box_js_1.Box,
+              { as: 'span', className: 'iui-input-icon', 'aria-hidden': true },
+              icon,
+            ),
+          message &&
+            !isLabelInline &&
+            React.createElement(
+              Box_js_1.Box,
+              { className: 'iui-message' },
+              message,
+            ),
+        ),
+  );
 };
 exports.InputContainer = InputContainer;

package/cjs/core/utils/components/InputFlexContainer.d.ts

@@ -1,5 +1,5 @@
 import type { PolymorphicForwardRefComponent } from '../props.js';
-export declare type InputFlexContainerProps = {
+export type InputFlexContainerProps = {
     isDisabled?: boolean;
     status?: 'positive' | 'warning' | 'negative';
 };

package/cjs/core/utils/components/InputFlexContainer.js

@@ -1,21 +1,33 @@
-"use strict";
-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.InputFlexContainer = 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_1 = __importDefault(require("react"));
-const classnames_1 = __importDefault(require("classnames"));
-const Box_js_1 = require("./Box.js");
+const react_1 = tslib_1.__importDefault(require('react'));
+const classnames_1 = tslib_1.__importDefault(require('classnames'));
+const Box_js_1 = require('./Box.js');
 /**
  * Utility component for input container with display flex abilities.
  * @private
  */
 exports.InputFlexContainer = react_1.default.forwardRef((props, ref) => {
-    const { isDisabled, status, children, className, style, ...rest } = props;
-    return (react_1.default.createElement(Box_js_1.Box, { className: (0, classnames_1.default)('iui-input-flex-container', className), "data-iui-status": status, "data-iui-disabled": isDisabled ? 'true' : undefined, ref: ref, style: style, ...rest }, children));
+  const { isDisabled, status, children, className, style, ...rest } = props;
+  return react_1.default.createElement(
+    Box_js_1.Box,
+    {
+      className: (0, classnames_1.default)(
+        'iui-input-flex-container',
+        className,
+      ),
+      'data-iui-status': status,
+      'data-iui-disabled': isDisabled ? 'true' : undefined,
+      ref: ref,
+      style: style,
+      ...rest,
+    },
+    children,
+  );
 });

package/cjs/core/utils/components/LinkAction.js

@@ -1,11 +1,11 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
 exports.LinkBox = exports.LinkAction = 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 polymorphic_js_1 = require("../functions/polymorphic.js");
+const polymorphic_js_1 = require('../functions/polymorphic.js');
 /**
  * Polymorphic link action component.
  * It is rendered as `a` by default.

package/cjs/core/utils/components/MiddleTextTruncation.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import type { CommonProps } from '../props.js';
-export declare type MiddleTextTruncationProps = {
+export type MiddleTextTruncationProps = {
     /**
      * Text to truncate.
      */
@@ -31,5 +31,5 @@ export declare type MiddleTextTruncationProps = {
  *   )}
  * />
  */
-export declare const MiddleTextTruncation: (props: MiddleTextTruncationProps) => JSX.Element;
+export declare const MiddleTextTruncation: (props: MiddleTextTruncationProps) => React.JSX.Element;
 export default MiddleTextTruncation;

package/cjs/core/utils/components/MiddleTextTruncation.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.MiddleTextTruncation = 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 useOverflow_js_1 = require("../hooks/useOverflow.js");
+const React = tslib_1.__importStar(require('react'));
+const useOverflow_js_1 = require('../hooks/useOverflow.js');
 const ELLIPSIS_CHAR = '…';
 /**
  * Truncates text with the ellipsis in the middle,
@@ -48,23 +26,33 @@ const ELLIPSIS_CHAR = '…';
  * />
  */
 const MiddleTextTruncation = (props) => {
-    const { text, endCharsCount = 6, textRenderer, style, ...rest } = props;
-    const [ref, visibleCount] = (0, useOverflow_js_1.useOverflow)(text);
-    const truncatedText = React.useMemo(() => {
-        if (visibleCount < text.length) {
-            return `${text.substring(0, visibleCount - endCharsCount - ELLIPSIS_CHAR.length)}${ELLIPSIS_CHAR}${text.substring(text.length - endCharsCount)}`;
-        }
-        else {
-            return text;
-        }
-    }, [endCharsCount, text, visibleCount]);
-    return (React.createElement("span", { style: {
-            display: 'flex',
-            minWidth: 0,
-            flexGrow: 1,
-            whiteSpace: 'nowrap',
-            ...style,
-        }, ref: ref, ...rest }, textRenderer?.(truncatedText, text) ?? truncatedText));
+  const { text, endCharsCount = 6, textRenderer, style, ...rest } = props;
+  const [ref, visibleCount] = (0, useOverflow_js_1.useOverflow)(text);
+  const truncatedText = React.useMemo(() => {
+    if (visibleCount < text.length) {
+      return `${text.substring(
+        0,
+        visibleCount - endCharsCount - ELLIPSIS_CHAR.length,
+      )}${ELLIPSIS_CHAR}${text.substring(text.length - endCharsCount)}`;
+    } else {
+      return text;
+    }
+  }, [endCharsCount, text, visibleCount]);
+  return React.createElement(
+    'span',
+    {
+      style: {
+        display: 'flex',
+        minWidth: 0,
+        flexGrow: 1,
+        whiteSpace: 'nowrap',
+        ...style,
+      },
+      ref: ref,
+      ...rest,
+    },
+    textRenderer?.(truncatedText, text) ?? truncatedText,
+  );
 };
 exports.MiddleTextTruncation = MiddleTextTruncation;
 exports.default = exports.MiddleTextTruncation;

package/cjs/core/utils/components/Popover.d.ts

@@ -1,8 +1,8 @@
 import * as React from 'react';
 import type { TippyProps } from '@tippyjs/react';
 import type { Placement, Instance } from 'tippy.js';
-export declare type PopoverInstance = Instance;
-export declare type PopoverProps = {
+export type PopoverInstance = Instance;
+export type PopoverProps = {
     /**
      * Controlled flag for whether the popover is visible.
      */
@@ -25,7 +25,7 @@ export declare type PopoverProps = {
  * with pre-configured props and plugins (e.g. lazy mounting, focus, etc).
  * @private
  */
-export declare const Popover: React.ForwardRefExoticComponent<Pick<PopoverProps, "disabled" | "className" | "role" | "offset" | "children" | "content" | "plugins" | "placement" | "trigger" | "visible" | "render" | "animateFill" | "appendTo" | "aria" | "delay" | "duration" | "followCursor" | "getReferenceClientRect" | "hideOnClick" | "ignoreAttributes" | "inlinePositioning" | "interactive" | "interactiveBorder" | "interactiveDebounce" | "moveTransition" | "popperOptions" | "showOnCreate" | "sticky" | "touch" | "triggerTarget" | "onAfterUpdate" | "onBeforeUpdate" | "onCreate" | "onDestroy" | "onHidden" | "onHide" | "onMount" | "onShow" | "onShown" | "onTrigger" | "onUntrigger" | "onClickOutside" | "allowHTML" | "animation" | "arrow" | "inertia" | "maxWidth" | "theme" | "zIndex" | "singleton" | "reference"> & React.RefAttributes<unknown>>;
+export declare const Popover: React.ForwardRefExoticComponent<Omit<PopoverProps, "ref"> & React.RefAttributes<unknown>>;
 /**
  * Plugin to hide Popover when either Esc key is pressed,
  * or when the content inside is not tabbable and Tab key is pressed.