@itwin/itwinui-react 3.13.4 → 3.14.0

package/DEV-cjs/core/Dialog/DialogMain.js

@@ -1,131 +1,183 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
+'use strict';
+Object.defineProperty(exports, '__esModule', {
+  value: true,
 });
-Object.defineProperty(exports, "DialogMain", {
-    enumerable: true,
-    get: function() {
-        return DialogMain;
-    }
+Object.defineProperty(exports, 'DialogMain', {
+  enumerable: true,
+  get: function () {
+    return DialogMain;
+  },
 });
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-const _react = _interop_require_wildcard._(require("react"));
-const _classnames = _interop_require_default._(require("classnames"));
-const _index = require("../../utils/index.js");
-const _DialogContext = require("./DialogContext.js");
-const _reacttransitiongroup = require("react-transition-group");
-const _DialogDragContext = require("./DialogDragContext.js");
-const _useDragAndDrop = require("../../utils/hooks/useDragAndDrop.js");
-const DialogMain = _react.forwardRef((props, ref)=>{
-    let dialogContext = (0, _DialogContext.useDialogContext)();
-    let { className, children, styleType = 'default', isOpen = dialogContext.isOpen, isDismissible = dialogContext.isDismissible, onClose = dialogContext.onClose, closeOnEsc = dialogContext.closeOnEsc, trapFocus = dialogContext.trapFocus, setFocus = dialogContext.setFocus, preventDocumentScroll = dialogContext.preventDocumentScroll, onKeyDown, isDraggable = dialogContext.isDraggable, isResizable = dialogContext.isResizable, style: propStyle, placement = dialogContext.placement, ...rest } = props;
-    let [style, setStyle] = _react.useState();
-    let dialogRef = _react.useRef(null);
-    let hasBeenResized = _react.useRef(false);
-    let previousFocusedElement = _react.useRef();
-    let originalBodyOverflow = _react.useRef('');
-    _react.useEffect(()=>{
-        if (isOpen) originalBodyOverflow.current = document.body.style.overflow;
-    }, [
-        isOpen
-    ]);
-    _react.useEffect(()=>{
-        let ownerDocument = dialogRef.current?.ownerDocument;
-        if (!ownerDocument || !preventDocumentScroll || 'hidden' === originalBodyOverflow.current) return;
-        if (isOpen) ownerDocument.body.style.overflow = 'hidden';
-        else ownerDocument.body.style.overflow = originalBodyOverflow.current;
-        return ()=>{
-            ownerDocument.body.style.overflow = originalBodyOverflow.current;
-        };
-    }, [
-        isOpen,
-        preventDocumentScroll
-    ]);
-    let handleKeyDown = (event)=>{
-        if (event.altKey) return;
-        event.persist();
-        if (isDismissible && closeOnEsc && 'Escape' === event.key && onClose) onClose(event);
-        onKeyDown?.(event);
+const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
+const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
+const _react = _interop_require_wildcard._(require('react'));
+const _classnames = _interop_require_default._(require('classnames'));
+const _index = require('../../utils/index.js');
+const _DialogContext = require('./DialogContext.js');
+const _reacttransitiongroup = require('react-transition-group');
+const _DialogDragContext = require('./DialogDragContext.js');
+const _useDragAndDrop = require('../../utils/hooks/useDragAndDrop.js');
+const DialogMain = _react.forwardRef((props, ref) => {
+  let dialogContext = (0, _DialogContext.useDialogContext)();
+  let {
+    className,
+    children,
+    styleType = 'default',
+    isOpen = dialogContext.isOpen,
+    isDismissible = dialogContext.isDismissible,
+    onClose = dialogContext.onClose,
+    closeOnEsc = dialogContext.closeOnEsc,
+    trapFocus = dialogContext.trapFocus,
+    setFocus = dialogContext.setFocus,
+    preventDocumentScroll = dialogContext.preventDocumentScroll,
+    onKeyDown,
+    isDraggable = dialogContext.isDraggable,
+    isResizable = dialogContext.isResizable,
+    style: propStyle,
+    placement = dialogContext.placement,
+    ...rest
+  } = props;
+  let [style, setStyle] = _react.useState();
+  let dialogRef = _react.useRef(null);
+  let hasBeenResized = _react.useRef(false);
+  let previousFocusedElement = _react.useRef();
+  let originalBodyOverflow = _react.useRef('');
+  _react.useEffect(() => {
+    if (isOpen) originalBodyOverflow.current = document.body.style.overflow;
+  }, [isOpen]);
+  _react.useEffect(() => {
+    let ownerDocument = dialogRef.current?.ownerDocument;
+    if (
+      !ownerDocument ||
+      !preventDocumentScroll ||
+      'hidden' === originalBodyOverflow.current
+    )
+      return;
+    if (isOpen) ownerDocument.body.style.overflow = 'hidden';
+    else ownerDocument.body.style.overflow = originalBodyOverflow.current;
+    return () => {
+      ownerDocument.body.style.overflow = originalBodyOverflow.current;
     };
-    let { onPointerDown, transform } = (0, _useDragAndDrop.useDragAndDrop)(dialogRef, dialogContext.dialogRootRef, isDraggable);
-    let handlePointerDown = _react.useCallback((event)=>{
-        if (isDraggable) onPointerDown(event);
-    }, [
-        isDraggable,
-        onPointerDown
-    ]);
-    (0, _index.useLayoutEffect)(()=>{
-        if (!isDraggable || !isOpen) return;
-        let [translateX, translateY] = (0, _index.getTranslateValuesFromElement)(dialogRef.current);
-        setStyle((oldStyle)=>({
-                ...oldStyle,
-                insetInlineStart: dialogRef.current?.offsetLeft,
-                insetBlockStart: dialogRef.current?.offsetTop,
-                transform: `translate(${translateX}px,${translateY}px)`
-            }));
-    }, [
-        isDraggable,
-        isOpen
-    ]);
-    let setResizeStyle = _react.useCallback((newStyle)=>{
-        setStyle((oldStyle)=>({
-                ...oldStyle,
-                ...newStyle
-            }));
-    }, []);
-    let content = _react.createElement(_index.Box, {
-        className: (0, _classnames.default)('iui-dialog', {
-            'iui-dialog-default': 'default' === styleType,
-            'iui-dialog-full-page': 'fullPage' === styleType,
-            'iui-dialog-visible': isOpen,
-            'iui-dialog-draggable': isDraggable
-        }, className),
-        role: "dialog",
-        ref: (0, _index.useMergedRefs)(dialogRef, ref),
-        onKeyDown: handleKeyDown,
-        tabIndex: -1,
-        "data-iui-placement": placement,
-        style: {
-            transform,
-            ...style,
-            ...propStyle
+  }, [isOpen, preventDocumentScroll]);
+  let handleKeyDown = (event) => {
+    if (event.altKey) return;
+    event.persist();
+    if (isDismissible && closeOnEsc && 'Escape' === event.key && onClose)
+      onClose(event);
+    onKeyDown?.(event);
+  };
+  let { onPointerDown, transform } = (0, _useDragAndDrop.useDragAndDrop)(
+    dialogRef,
+    dialogContext.dialogRootRef,
+    isDraggable,
+  );
+  let handlePointerDown = _react.useCallback(
+    (event) => {
+      if (isDraggable) onPointerDown(event);
+    },
+    [isDraggable, onPointerDown],
+  );
+  (0, _index.useLayoutEffect)(() => {
+    if (!isDraggable || !isOpen) return;
+    let [translateX, translateY] = (0, _index.getTranslateValuesFromElement)(
+      dialogRef.current,
+    );
+    setStyle((oldStyle) => ({
+      ...oldStyle,
+      insetInlineStart: dialogRef.current?.offsetLeft,
+      insetBlockStart: dialogRef.current?.offsetTop,
+      transform: `translate(${translateX}px,${translateY}px)`,
+    }));
+  }, [isDraggable, isOpen]);
+  let setResizeStyle = _react.useCallback((newStyle) => {
+    setStyle((oldStyle) => ({
+      ...oldStyle,
+      ...newStyle,
+    }));
+  }, []);
+  let content = _react.createElement(
+    _index.Box,
+    {
+      className: (0, _classnames.default)(
+        'iui-dialog',
+        {
+          'iui-dialog-default': 'default' === styleType,
+          'iui-dialog-full-page': 'fullPage' === styleType,
+          'iui-dialog-visible': isOpen,
+          'iui-dialog-draggable': isDraggable,
         },
-        ...rest
-    }, _react.createElement(_index.ShadowRoot, null, _react.createElement("slot", null), isResizable && _react.createElement(_index.Resizer, {
-        elementRef: dialogRef,
-        containerRef: dialogContext.dialogRootRef,
-        onResizeStart: ()=>{
+        className,
+      ),
+      role: 'dialog',
+      ref: (0, _index.useMergedRefs)(dialogRef, ref),
+      onKeyDown: handleKeyDown,
+      tabIndex: -1,
+      'data-iui-placement': placement,
+      style: {
+        transform,
+        ...style,
+        ...propStyle,
+      },
+      ...rest,
+    },
+    _react.createElement(
+      _index.ShadowRoot,
+      null,
+      _react.createElement('slot', null),
+      isResizable &&
+        _react.createElement(_index.Resizer, {
+          elementRef: dialogRef,
+          containerRef: dialogContext.dialogRootRef,
+          onResizeStart: () => {
             if (!hasBeenResized.current) {
-                hasBeenResized.current = true;
-                setResizeStyle({
-                    maxInlineSize: '100%'
-                });
+              hasBeenResized.current = true;
+              setResizeStyle({
+                maxInlineSize: '100%',
+              });
             }
-        },
-        onResizeEnd: setResizeStyle
-    })), children);
-    return _react.createElement(_reacttransitiongroup.Transition, {
-        in: isOpen,
-        appear: true,
-        timeout: {
-            exit: 600
-        },
-        onEntered: ()=>{
-            previousFocusedElement.current = dialogRef.current?.ownerDocument.activeElement;
-            setFocus && dialogRef.current?.focus({
-                preventScroll: true
-            });
-        },
-        onExit: ()=>{
-            if (dialogRef.current?.contains(dialogRef.current?.ownerDocument.activeElement)) previousFocusedElement.current?.focus();
-        },
-        unmountOnExit: true,
-        nodeRef: dialogRef
-    }, _react.createElement(_DialogDragContext.DialogDragContext.Provider, {
+          },
+          onResizeEnd: setResizeStyle,
+        }),
+    ),
+    children,
+  );
+  return _react.createElement(
+    _reacttransitiongroup.Transition,
+    {
+      in: isOpen,
+      appear: true,
+      timeout: {
+        exit: 600,
+      },
+      onEntered: () => {
+        previousFocusedElement.current =
+          dialogRef.current?.ownerDocument.activeElement;
+        setFocus &&
+          dialogRef.current?.focus({
+            preventScroll: true,
+          });
+      },
+      onExit: () => {
+        if (
+          dialogRef.current?.contains(
+            dialogRef.current?.ownerDocument.activeElement,
+          )
+        )
+          previousFocusedElement.current?.focus();
+      },
+      unmountOnExit: true,
+      nodeRef: dialogRef,
+    },
+    _react.createElement(
+      _DialogDragContext.DialogDragContext.Provider,
+      {
         value: {
-            onPointerDown: handlePointerDown
-        }
-    }, trapFocus && _react.createElement(_index.FocusTrap, null, content), !trapFocus && content));
+          onPointerDown: handlePointerDown,
+        },
+      },
+      trapFocus && _react.createElement(_index.FocusTrap, null, content),
+      !trapFocus && content,
+    ),
+  );
 });
 DialogMain.displayName = 'Dialog.Main';

package/DEV-cjs/core/Dialog/DialogTitleBar.js

@@ -1,41 +1,76 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
+'use strict';
+Object.defineProperty(exports, '__esModule', {
+  value: true,
 });
-Object.defineProperty(exports, "DialogTitleBar", {
-    enumerable: true,
-    get: function() {
-        return DialogTitleBar;
-    }
+Object.defineProperty(exports, 'DialogTitleBar', {
+  enumerable: true,
+  get: function () {
+    return DialogTitleBar;
+  },
 });
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-const _react = _interop_require_wildcard._(require("react"));
-const _classnames = _interop_require_default._(require("classnames"));
-const _index = require("../../utils/index.js");
-const _IconButton = require("../Buttons/IconButton.js");
-const _DialogContext = require("./DialogContext.js");
-const _DialogTitleBarTitle = require("./DialogTitleBarTitle.js");
-const _DialogDragContext = require("./DialogDragContext.js");
-const DialogTitleBar = Object.assign(_react.forwardRef((props, ref)=>{
+const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
+const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
+const _react = _interop_require_wildcard._(require('react'));
+const _classnames = _interop_require_default._(require('classnames'));
+const _index = require('../../utils/index.js');
+const _IconButton = require('../Buttons/IconButton.js');
+const _DialogContext = require('./DialogContext.js');
+const _DialogTitleBarTitle = require('./DialogTitleBarTitle.js');
+const _DialogDragContext = require('./DialogDragContext.js');
+const DialogTitleBar = Object.assign(
+  _react.forwardRef((props, ref) => {
     let dialogContext = (0, _DialogContext.useDialogContext)();
-    let { children, titleText, isDismissible = dialogContext.isDismissible, onClose = dialogContext.onClose, isDraggable = dialogContext.isDraggable, className, onPointerDown: onPointerDownProp, ...rest } = props;
+    let {
+      children,
+      titleText,
+      isDismissible = dialogContext.isDismissible,
+      onClose = dialogContext.onClose,
+      isDraggable = dialogContext.isDraggable,
+      className,
+      onPointerDown: onPointerDownProp,
+      ...rest
+    } = props;
     let { onPointerDown } = (0, _DialogDragContext.useDialogDragContext)();
-    return _react.createElement(_index.Box, {
+    return _react.createElement(
+      _index.Box,
+      {
         className: (0, _classnames.default)('iui-dialog-title-bar', className, {
-            'iui-dialog-title-bar-filled': isDraggable
+          'iui-dialog-title-bar-filled': isDraggable,
         }),
         ref: ref,
-        onPointerDown: (0, _index.mergeEventHandlers)(onPointerDownProp, onPointerDown),
-        ...rest
-    }, children ? children : _react.createElement(_react.Fragment, null, _react.createElement(_DialogTitleBarTitle.DialogTitleBarTitle, null, titleText), isDismissible && _react.createElement(_IconButton.IconButton, {
-        size: "small",
-        styleType: "borderless",
-        onClick: onClose,
-        "aria-label": "Close",
-        "data-iui-shift": "right"
-    }, _react.createElement(_index.SvgClose, null))));
-}), {
-    Title: _DialogTitleBarTitle.DialogTitleBarTitle
-});
+        onPointerDown: (0, _index.mergeEventHandlers)(
+          onPointerDownProp,
+          onPointerDown,
+        ),
+        ...rest,
+      },
+      children
+        ? children
+        : _react.createElement(
+            _react.Fragment,
+            null,
+            _react.createElement(
+              _DialogTitleBarTitle.DialogTitleBarTitle,
+              null,
+              titleText,
+            ),
+            isDismissible &&
+              _react.createElement(
+                _IconButton.IconButton,
+                {
+                  size: 'small',
+                  styleType: 'borderless',
+                  onClick: onClose,
+                  'aria-label': 'Close',
+                  'data-iui-shift': 'right',
+                },
+                _react.createElement(_index.SvgClose, null),
+              ),
+          ),
+    );
+  }),
+  {
+    Title: _DialogTitleBarTitle.DialogTitleBarTitle,
+  },
+);
 DialogTitleBar.displayName = 'Dialog.TitleBar';

package/DEV-cjs/core/Dialog/DialogTitleBarTitle.js

@@ -1,13 +1,13 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
+'use strict';
+Object.defineProperty(exports, '__esModule', {
+  value: true,
 });
-Object.defineProperty(exports, "DialogTitleBarTitle", {
-    enumerable: true,
-    get: function() {
-        return DialogTitleBarTitle;
-    }
+Object.defineProperty(exports, 'DialogTitleBarTitle', {
+  enumerable: true,
+  get: function () {
+    return DialogTitleBarTitle;
+  },
 });
-const _index = require("../../utils/index.js");
+const _index = require('../../utils/index.js');
 const DialogTitleBarTitle = _index.polymorphic.div('iui-dialog-title');
 DialogTitleBarTitle.displayName = 'Dialog.TitleBar.Title';

package/DEV-cjs/core/Divider/Divider.js

@@ -1,26 +1,26 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
+'use strict';
+Object.defineProperty(exports, '__esModule', {
+  value: true,
 });
-Object.defineProperty(exports, "Divider", {
-    enumerable: true,
-    get: function() {
-        return Divider;
-    }
+Object.defineProperty(exports, 'Divider', {
+  enumerable: true,
+  get: function () {
+    return Divider;
+  },
 });
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-const _react = _interop_require_wildcard._(require("react"));
-const _classnames = _interop_require_default._(require("classnames"));
-const _Box = require("../../utils/components/Box.js");
-const Divider = _react.forwardRef((props, ref)=>{
-    let { className, orientation = 'horizontal', ...rest } = props;
-    return _react.createElement(_Box.Box, {
-        as: "hr",
-        className: (0, _classnames.default)('iui-divider', className),
-        "aria-orientation": 'vertical' === orientation ? 'vertical' : void 0,
-        ref: ref,
-        ...rest
-    });
+const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
+const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
+const _react = _interop_require_wildcard._(require('react'));
+const _classnames = _interop_require_default._(require('classnames'));
+const _Box = require('../../utils/components/Box.js');
+const Divider = _react.forwardRef((props, ref) => {
+  let { className, orientation = 'horizontal', ...rest } = props;
+  return _react.createElement(_Box.Box, {
+    as: 'hr',
+    className: (0, _classnames.default)('iui-divider', className),
+    'aria-orientation': 'vertical' === orientation ? 'vertical' : void 0,
+    ref: ref,
+    ...rest,
+  });
 });
 Divider.displayName = 'Divider';

package/DEV-cjs/core/DropdownMenu/DropdownMenu.js

@@ -1,48 +1,74 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
+'use strict';
+Object.defineProperty(exports, '__esModule', {
+  value: true,
 });
-Object.defineProperty(exports, "DropdownMenu", {
-    enumerable: true,
-    get: function() {
-        return DropdownMenu;
-    }
+Object.defineProperty(exports, 'DropdownMenu', {
+  enumerable: true,
+  get: function () {
+    return DropdownMenu;
+  },
 });
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-const _react = _interop_require_wildcard._(require("react"));
-const _index = require("../../utils/index.js");
-const _Menu = require("../Menu/Menu.js");
-const _react1 = require("@floating-ui/react");
-const DropdownMenu = _react.forwardRef((props, forwardedRef)=>_react.createElement(_react1.FloatingTree, null, _react.createElement(DropdownMenuContent, {
-        ref: forwardedRef,
-        ...props
-    })));
+const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
+const _react = _interop_require_wildcard._(require('react'));
+const _index = require('../../utils/index.js');
+const _Menu = require('../Menu/Menu.js');
+const _react1 = require('@floating-ui/react');
+const DropdownMenu = _react.forwardRef((props, forwardedRef) =>
+  _react.createElement(
+    _react1.FloatingTree,
+    null,
+    _react.createElement(DropdownMenuContent, {
+      ref: forwardedRef,
+      ...props,
+    }),
+  ),
+);
 DropdownMenu.displayName = 'DropdownMenu';
-const DropdownMenuContent = _react.forwardRef((props, forwardedRef)=>{
-    let { menuItems, children, role = 'menu', visible: visibleProp, placement = 'bottom-start', matchWidth = false, onVisibleChange, portal = true, ...rest } = props;
-    let [visible, setVisible] = (0, _index.useControlledState)(false, visibleProp, onVisibleChange);
-    let menuContent = _react.useMemo(()=>{
-        if ('function' == typeof menuItems) return menuItems(()=>setVisible(false));
-        return menuItems;
-    }, [
-        menuItems,
-        setVisible
-    ]);
-    return _react.createElement(_react.Fragment, null, _react.createElement(_Menu.Menu, {
+const DropdownMenuContent = _react.forwardRef((props, forwardedRef) => {
+  let {
+    menuItems,
+    children,
+    role = 'menu',
+    visible: visibleProp,
+    placement = 'bottom-start',
+    matchWidth = false,
+    onVisibleChange,
+    portal = true,
+    ...rest
+  } = props;
+  let [visible, setVisible] = (0, _index.useControlledState)(
+    false,
+    visibleProp,
+    onVisibleChange,
+  );
+  let menuContent = _react.useMemo(() => {
+    if ('function' == typeof menuItems)
+      return menuItems(() => setVisible(false));
+    return menuItems;
+  }, [menuItems, setVisible]);
+  return _react.createElement(
+    _react.Fragment,
+    null,
+    _react.createElement(
+      _Menu.Menu,
+      {
         trigger: children,
-        onKeyDown: (0, _index.mergeEventHandlers)(props.onKeyDown, (e)=>{
-            if (e.defaultPrevented) return;
-            if ('Tab' === e.key) setVisible(false);
+        onKeyDown: (0, _index.mergeEventHandlers)(props.onKeyDown, (e) => {
+          if (e.defaultPrevented) return;
+          if ('Tab' === e.key) setVisible(false);
         }),
         role: role,
         ref: forwardedRef,
         portal: portal,
         popoverProps: {
-            placement,
-            matchWidth,
-            visible,
-            onVisibleChange: setVisible
+          placement,
+          matchWidth,
+          visible,
+          onVisibleChange: setVisible,
         },
-        ...rest
-    }, menuContent));
+        ...rest,
+      },
+      menuContent,
+    ),
+  );
 });