@itwin/itwinui-react 3.0.4 → 3.0.6

package/cjs/core/Stepper/StepperStep.js

@@ -1,116 +1,43 @@
-'use strict';
-Object.defineProperty(exports, '__esModule', { value: true });
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
 exports.StepperStep = void 0;
-const tslib_1 = require('tslib');
+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 classnames_1 = tslib_1.__importDefault(require('classnames'));
-const React = tslib_1.__importStar(require('react'));
-const Tooltip_js_1 = require('../Tooltip/Tooltip.js');
-const index_js_1 = require('../utils/index.js');
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const React = tslib_1.__importStar(require("react"));
+const Tooltip_js_1 = require("../Tooltip/Tooltip.js");
+const index_js_1 = require("../utils/index.js");
 exports.StepperStep = React.forwardRef((props, forwardedRef) => {
-  const {
-    title,
-    index,
-    currentStepNumber,
-    totalSteps,
-    type,
-    onClick,
-    description,
-    className,
-    style,
-    stepProps,
-    trackContentProps,
-    circleProps,
-    nameProps,
-    ...rest
-  } = props;
-  const isPast = currentStepNumber > index;
-  const isActive = currentStepNumber === index;
-  const isClickable = isPast && !!onClick;
-  const onCompletedClick = () => {
-    if (isClickable) {
-      onClick?.(index);
-    }
-  };
-  const onKeyDown = (e) => {
-    if (e.altKey) {
-      return;
-    }
-    if (!isClickable) {
-      return;
-    }
-    if (e.key === 'Enter' || e.key === 'Space' || e.key === ' ') {
-      onCompletedClick();
-    }
-  };
-  const stepShape = React.createElement(
-    index_js_1.Box,
-    {
-      as: 'li',
-      ...stepProps,
-      className: (0, classnames_1.default)(
-        'iui-stepper-step',
-        { 'iui-current': isActive, 'iui-clickable': isClickable },
-        className,
-        stepProps?.className,
-      ),
-      style: {
-        inlineSize: type === 'default' ? `${100 / totalSteps}%` : undefined,
-        ...style,
-        ...stepProps?.style,
-      },
-      onClick: onCompletedClick,
-      onKeyDown: onKeyDown,
-      'aria-current': isActive ? 'step' : undefined,
-      tabIndex: isClickable ? 0 : undefined,
-      ref: forwardedRef,
-      ...rest,
-    },
-    React.createElement(
-      index_js_1.Box,
-      {
-        as: 'div',
-        ...trackContentProps,
-        className: (0, classnames_1.default)(
-          'iui-stepper-track-content',
-          trackContentProps?.className,
-        ),
-      },
-      React.createElement(
-        index_js_1.Box,
-        {
-          as: 'span',
-          ...circleProps,
-          className: (0, classnames_1.default)(
-            'iui-stepper-circle',
-            circleProps?.className,
-          ),
-        },
-        index + 1,
-      ),
-    ),
-    type === 'default' &&
-      React.createElement(
-        index_js_1.Box,
-        {
-          as: 'span',
-          ...nameProps,
-          className: (0, classnames_1.default)(
-            'iui-stepper-step-name',
-            nameProps?.className,
-          ),
-        },
-        title,
-      ),
-  );
-  return description
-    ? React.createElement(
-        Tooltip_js_1.Tooltip,
-        { content: description },
-        stepShape,
-      )
-    : stepShape;
+    const { title, index, currentStepNumber, totalSteps, type, onClick, description, className, style, stepProps, trackContentProps, circleProps, nameProps, ...rest } = props;
+    const isPast = currentStepNumber > index;
+    const isActive = currentStepNumber === index;
+    const isClickable = isPast && !!onClick;
+    const onCompletedClick = () => {
+        if (isClickable) {
+            onClick?.(index);
+        }
+    };
+    const onKeyDown = (e) => {
+        if (e.altKey) {
+            return;
+        }
+        if (!isClickable) {
+            return;
+        }
+        if (e.key === 'Enter' || e.key === 'Space' || e.key === ' ') {
+            onCompletedClick();
+        }
+    };
+    const stepShape = (React.createElement(index_js_1.Box, { as: 'li', ...stepProps, className: (0, classnames_1.default)('iui-stepper-step', { 'iui-current': isActive, 'iui-clickable': isClickable }, className, stepProps?.className), style: {
+            inlineSize: type === 'default' ? `${100 / totalSteps}%` : undefined,
+            ...style,
+            ...stepProps?.style,
+        }, onClick: onCompletedClick, onKeyDown: onKeyDown, "aria-current": isActive ? 'step' : undefined, tabIndex: isClickable ? 0 : undefined, ref: forwardedRef, ...rest },
+        React.createElement(index_js_1.Box, { as: 'div', ...trackContentProps, className: (0, classnames_1.default)('iui-stepper-track-content', trackContentProps?.className) },
+            React.createElement(index_js_1.Box, { as: 'span', ...circleProps, className: (0, classnames_1.default)('iui-stepper-circle', circleProps?.className) }, index + 1)),
+        type === 'default' && (React.createElement(index_js_1.Box, { as: 'span', ...nameProps, className: (0, classnames_1.default)('iui-stepper-step-name', nameProps?.className) }, title))));
+    return description ? (React.createElement(Tooltip_js_1.Tooltip, { content: description }, stepShape)) : (stepShape);
 });

package/cjs/core/Stepper/WorkflowDiagram.js

@@ -1,46 +1,23 @@
-'use strict';
-Object.defineProperty(exports, '__esModule', { value: true });
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
 exports.WorkflowDiagram = void 0;
-const tslib_1 = require('tslib');
+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 = tslib_1.__importStar(require('react'));
-const classnames_1 = tslib_1.__importDefault(require('classnames'));
-const index_js_1 = require('../utils/index.js');
-const WorkflowDiagramStep_js_1 = require('./WorkflowDiagramStep.js');
+const React = tslib_1.__importStar(require("react"));
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const index_js_1 = require("../utils/index.js");
+const WorkflowDiagramStep_js_1 = require("./WorkflowDiagramStep.js");
 exports.WorkflowDiagram = React.forwardRef(
-  // TODO: Remove this ref cast. ref and rest props should be applied on the same element
-  (props, ref) => {
+// TODO: Remove this ref cast. ref and rest props should be applied on the same element
+(props, ref) => {
     const { steps, className, contentProps, wrapperProps, ...rest } = props;
-    return React.createElement(
-      index_js_1.Box,
-      { as: 'div', ...wrapperProps, ref: ref },
-      React.createElement(
-        index_js_1.Box,
-        {
-          as: 'ol',
-          className: (0, classnames_1.default)(
-            'iui-workflow-diagram',
-            className,
-          ),
-          ...rest,
-        },
-        steps.map((s, index) => {
-          const thisContentProps = contentProps?.(index);
-          return React.createElement(
-            WorkflowDiagramStep_js_1.WorkflowDiagramStep,
-            {
-              contentProps: thisContentProps,
-              key: index,
-              title: s.name,
-              description: s.description,
-            },
-          );
-        }),
-      ),
-    );
-  },
-);
+    return (React.createElement(index_js_1.Box, { as: 'div', ...wrapperProps, ref: ref },
+        React.createElement(index_js_1.Box, { as: 'ol', className: (0, classnames_1.default)('iui-workflow-diagram', className), ...rest }, steps.map((s, index) => {
+            const thisContentProps = contentProps?.(index);
+            return (React.createElement(WorkflowDiagramStep_js_1.WorkflowDiagramStep, { contentProps: thisContentProps, key: index, title: s.name, description: s.description }));
+        }))));
+});
 exports.default = exports.WorkflowDiagram;

package/cjs/core/Stepper/WorkflowDiagramStep.js

@@ -1,47 +1,19 @@
-'use strict';
-Object.defineProperty(exports, '__esModule', { value: true });
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
 exports.WorkflowDiagramStep = void 0;
-const tslib_1 = require('tslib');
+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 classnames_1 = tslib_1.__importDefault(require('classnames'));
-const React = tslib_1.__importStar(require('react'));
-const Tooltip_js_1 = require('../Tooltip/Tooltip.js');
-const index_js_1 = require('../utils/index.js');
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const React = tslib_1.__importStar(require("react"));
+const Tooltip_js_1 = require("../Tooltip/Tooltip.js");
+const index_js_1 = require("../utils/index.js");
 const WorkflowDiagramStep = (props) => {
-  const { title, description, className, style, contentProps, ...rest } = props;
-  const stepShape = React.createElement(
-    index_js_1.Box,
-    {
-      as: 'li',
-      className: (0, classnames_1.default)(
-        'iui-workflow-diagram-step',
-        className,
-      ),
-      style: style,
-      ...rest,
-    },
-    React.createElement(
-      index_js_1.Box,
-      {
-        as: 'span',
-        ...contentProps,
-        className: (0, classnames_1.default)(
-          'iui-workflow-diagram-content',
-          contentProps?.className,
-        ),
-      },
-      title,
-    ),
-  );
-  return description
-    ? React.createElement(
-        Tooltip_js_1.Tooltip,
-        { content: description },
-        stepShape,
-      )
-    : stepShape;
+    const { title, description, className, style, contentProps, ...rest } = props;
+    const stepShape = (React.createElement(index_js_1.Box, { as: 'li', className: (0, classnames_1.default)('iui-workflow-diagram-step', className), style: style, ...rest },
+        React.createElement(index_js_1.Box, { as: 'span', ...contentProps, className: (0, classnames_1.default)('iui-workflow-diagram-content', contentProps?.className) }, title)));
+    return description ? (React.createElement(Tooltip_js_1.Tooltip, { content: description }, stepShape)) : (stepShape);
 };
 exports.WorkflowDiagramStep = WorkflowDiagramStep;

package/cjs/core/Surface/Surface.js

@@ -1,83 +1,66 @@
-'use strict';
-Object.defineProperty(exports, '__esModule', { value: true });
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
 exports.Surface = void 0;
-const tslib_1 = require('tslib');
+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 = tslib_1.__importStar(require('react'));
-const classnames_1 = tslib_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");
 /**
  * Helper function that returns one of the preset surface elevation values.
  */
 const getSurfaceElevationValue = (elevation) => {
-  switch (elevation) {
-    case 0:
-      return 'none';
-    case 1:
-      return 'var(--iui-shadow-1)';
-    case 2:
-      return 'var(--iui-shadow-2)';
-    case 3:
-      return 'var(--iui-shadow-3)';
-    case 4:
-      return 'var(--iui-shadow-4)';
-    case 5:
-      return 'var(--iui-shadow-5)';
-    default:
-      return '';
-  }
+    switch (elevation) {
+        case 0:
+            return 'none';
+        case 1:
+            return 'var(--iui-shadow-1)';
+        case 2:
+            return 'var(--iui-shadow-2)';
+        case 3:
+            return 'var(--iui-shadow-3)';
+        case 4:
+            return 'var(--iui-shadow-4)';
+        case 5:
+            return 'var(--iui-shadow-5)';
+        default:
+            return '';
+    }
 };
 /** Returns correct border value based on prop */
 const getBorderValue = (border) => {
-  if (typeof border === 'string') {
-    return border;
-  }
-  if (border === false) {
-    return 'none';
-  }
-  return '';
+    if (typeof border === 'string') {
+        return border;
+    }
+    if (border === false) {
+        return 'none';
+    }
+    return '';
 };
 // ----------------------------------------------------------------------------
 // Surface.Header component
 const SurfaceHeader = React.forwardRef((props, ref) => {
-  const { children, className, ...rest } = props;
-  const { setHasLayout } = (0, index_js_1.useSafeContext)(SurfaceContext);
-  React.useEffect(() => {
-    if (!(0, index_js_1.supportsHas)()) {
-      setHasLayout(true);
-    }
-  }, [setHasLayout]);
-  return React.createElement(
-    index_js_1.Box,
-    {
-      className: (0, classnames_1.default)('iui-surface-header', className),
-      ref: ref,
-      ...rest,
-    },
-    children,
-  );
+    const { children, className, ...rest } = props;
+    const { setHasLayout } = (0, index_js_1.useSafeContext)(SurfaceContext);
+    React.useEffect(() => {
+        if (!(0, index_js_1.supportsHas)()) {
+            setHasLayout(true);
+        }
+    }, [setHasLayout]);
+    return (React.createElement(index_js_1.Box, { className: (0, classnames_1.default)('iui-surface-header', className), ref: ref, ...rest }, children));
 });
 const SurfaceBody = React.forwardRef((props, ref) => {
-  const { children, className, isPadded, ...rest } = props;
-  const { setHasLayout } = (0, index_js_1.useSafeContext)(SurfaceContext);
-  React.useEffect(() => {
-    if (!(0, index_js_1.supportsHas)()) {
-      setHasLayout(true);
-    }
-  }, [setHasLayout]);
-  return React.createElement(
-    index_js_1.Box,
-    {
-      className: (0, classnames_1.default)('iui-surface-body', className),
-      ref: ref,
-      'data-iui-padded': isPadded ? 'true' : undefined,
-      ...rest,
-    },
-    children,
-  );
+    const { children, className, isPadded, ...rest } = props;
+    const { setHasLayout } = (0, index_js_1.useSafeContext)(SurfaceContext);
+    React.useEffect(() => {
+        if (!(0, index_js_1.supportsHas)()) {
+            setHasLayout(true);
+        }
+    }, [setHasLayout]);
+    return (React.createElement(index_js_1.Box, { className: (0, classnames_1.default)('iui-surface-body', className), ref: ref, "data-iui-padded": isPadded ? 'true' : undefined, ...rest }, children));
 });
 /**
  * The Surface container allows content to appear elevated through the use of a drop shadow
@@ -89,39 +72,17 @@ const SurfaceBody = React.forwardRef((props, ref) => {
  *   <Surface.Body isPadded={true}>Surface Body Content</Surface.Body>
  * </Surface>
  */
-exports.Surface = Object.assign(
-  React.forwardRef((props, ref) => {
-    const {
-      elevation,
-      border = true,
-      className,
-      style,
-      children,
-      ...rest
-    } = props;
+exports.Surface = Object.assign(React.forwardRef((props, ref) => {
+    const { elevation, border = true, className, style, children, ...rest } = props;
     const [hasLayout, setHasLayout] = React.useState(false);
     const _style = {
-      '--iui-surface-elevation': getSurfaceElevationValue(elevation),
-      '--iui-surface-border': getBorderValue(border),
-      ...style,
+        '--iui-surface-elevation': getSurfaceElevationValue(elevation),
+        '--iui-surface-border': getBorderValue(border),
+        ...style,
     };
-    return React.createElement(
-      index_js_1.Box,
-      {
-        className: (0, classnames_1.default)('iui-surface', className),
-        style: _style,
-        ref: ref,
-        'data-iui-layout': hasLayout ? 'true' : undefined,
-        ...rest,
-      },
-      React.createElement(
-        SurfaceContext.Provider,
-        { value: { setHasLayout } },
-        children,
-      ),
-    );
-  }),
-  {
+    return (React.createElement(index_js_1.Box, { className: (0, classnames_1.default)('iui-surface', className), style: _style, ref: ref, "data-iui-layout": hasLayout ? 'true' : undefined, ...rest },
+        React.createElement(SurfaceContext.Provider, { value: { setHasLayout } }, children)));
+}), {
     /**
      * 	Surface header subcomponent
      */
@@ -130,7 +91,6 @@ exports.Surface = Object.assign(
      * 	Surface body subcomponent. Additional padding can be added to the body through the 'isPadded' prop
      */
     Body: SurfaceBody,
-  },
-);
+});
 const SurfaceContext = React.createContext(undefined);
 exports.default = exports.Surface;

package/cjs/core/Table/SubRowExpander.js

@@ -1,46 +1,24 @@
-'use strict';
-Object.defineProperty(exports, '__esModule', { value: true });
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
 exports.SubRowExpander = void 0;
-const tslib_1 = require('tslib');
+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 = tslib_1.__importStar(require('react'));
-const index_js_1 = require('../utils/index.js');
-const IconButton_js_1 = require('../Buttons/IconButton.js');
+const React = tslib_1.__importStar(require("react"));
+const index_js_1 = require("../utils/index.js");
+const IconButton_js_1 = require("../Buttons/IconButton.js");
 const SubRowExpander = (props) => {
-  const { cell, isDisabled, cellProps, expanderCell, density } = props;
-  return React.createElement(
-    React.Fragment,
-    null,
-    expanderCell
-      ? expanderCell(cellProps)
-      : React.createElement(
-          IconButton_js_1.IconButton,
-          {
-            'aria-label': 'Toggle sub row',
-            'aria-expanded': cell.row.isExpanded ? 'true' : 'false',
-            style: {
-              marginInlineEnd:
-                density === 'default' || density === undefined ? 8 : 4,
-            },
-            className: 'iui-table-row-expander',
-            styleType: 'borderless',
-            size: 'small',
-            onClick: (e) => {
-              e.stopPropagation();
-              cell.row.toggleRowExpanded();
-            },
-            disabled: isDisabled,
-          },
-          React.createElement(index_js_1.SvgChevronRight, {
-            style: {
-              transform: cell.row.isExpanded ? 'rotate(90deg)' : undefined,
-            },
-          }),
-        ),
-  );
+    const { cell, isDisabled, cellProps, expanderCell, density } = props;
+    return (React.createElement(React.Fragment, null, expanderCell ? (expanderCell(cellProps)) : (React.createElement(IconButton_js_1.IconButton, { "aria-label": 'Toggle sub row', "aria-expanded": cell.row.isExpanded ? 'true' : 'false', style: {
+            marginInlineEnd: density === 'default' || density === undefined ? 8 : 4,
+        }, className: 'iui-table-row-expander', styleType: 'borderless', size: 'small', onClick: (e) => {
+            e.stopPropagation();
+            cell.row.toggleRowExpanded();
+        }, disabled: isDisabled }, React.createElement(index_js_1.SvgChevronRight, { style: {
+            transform: cell.row.isExpanded ? 'rotate(90deg)' : undefined,
+        } })))));
 };
 exports.SubRowExpander = SubRowExpander;
 exports.default = exports.SubRowExpander;