@itwin/itwinui-react 3.15.5 → 5.0.0-alpha.0

package/DEV-cjs/core/Table/utils.js

@@ -1,76 +0,0 @@
-'use strict';
-Object.defineProperty(exports, '__esModule', {
-  value: true,
-});
-function _export(target, all) {
-  for (var name in all)
-    Object.defineProperty(target, name, {
-      enumerable: true,
-      get: all[name],
-    });
-}
-_export(exports, {
-  TableInstanceContext: function () {
-    return TableInstanceContext;
-  },
-  getCellStyle: function () {
-    return getCellStyle;
-  },
-  getStickyStyle: function () {
-    return getStickyStyle;
-  },
-  getSubRowStyle: function () {
-    return getSubRowStyle;
-  },
-});
-const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _react = _interop_require_wildcard._(require('react'));
-const getCellStyle = (column, isTableResizing) => {
-  let style = {};
-  style.flex = '1 1 145px';
-  if (column.width) {
-    let width =
-      'string' == typeof column.width ? column.width : `${column.width}px`;
-    style.width = width;
-    if (isTableResizing && column.canResize)
-      style.flex = `${Number(column.width)} ${Number(column.width)} ${width}`;
-    else style.flex = `0 0 ${width}`;
-  }
-  if (column.maxWidth) style.maxWidth = `${column.maxWidth}px`;
-  if (column.minWidth) style.minWidth = `${column.minWidth}px`;
-  return style;
-};
-const getStickyStyle = (column, columnList) => {
-  if (!column.sticky) return {};
-  let left = 0;
-  for (let col of columnList) {
-    if (col.id === column.id) break;
-    left += Number(col.width || col.resizeWidth || 0);
-  }
-  let right = 0;
-  for (let col of [...columnList].reverse()) {
-    if (col.id === column.id) break;
-    right += Number(col.width || col.resizeWidth || 0);
-  }
-  return {
-    '--iui-table-sticky-left': 'left' === column.sticky ? `${left}px` : void 0,
-    '--iui-table-sticky-right':
-      'right' === column.sticky ? `${right}px` : void 0,
-  };
-};
-const getSubRowStyle = ({ density = 'default', depth = 1 }) => {
-  let cellPadding = 16;
-  let expanderMargin = 8;
-  if ('condensed' === density) {
-    cellPadding = 12;
-    expanderMargin = 4;
-  } else if ('extra-condensed' === density) {
-    cellPadding = 8;
-    expanderMargin = 4;
-  }
-  let multiplier = 26 + expanderMargin;
-  return {
-    paddingInlineStart: cellPadding + depth * multiplier,
-  };
-};
-const TableInstanceContext = _react.createContext(void 0);

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

@@ -1,428 +0,0 @@
-'use strict';
-Object.defineProperty(exports, '__esModule', {
-  value: true,
-});
-function _export(target, all) {
-  for (var name in all)
-    Object.defineProperty(target, name, {
-      enumerable: true,
-      get: all[name],
-    });
-}
-_export(exports, {
-  Tab: function () {
-    return LegacyTab;
-  },
-  Tabs: function () {
-    return Tabs;
-  },
-});
-const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
-const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _classnames = _interop_require_default._(require('classnames'));
-const _react = _interop_require_wildcard._(require('react'));
-const _index = require('../../utils/index.js');
-const _Icon = require('../Icon/Icon.js');
-const TabsWrapper = _react.forwardRef((props, ref) => {
-  let {
-    className,
-    children,
-    orientation = 'horizontal',
-    type = 'default',
-    focusActivationMode = 'auto',
-    color = 'blue',
-    defaultValue,
-    value: activeValueProp,
-    onValueChange,
-    ...rest
-  } = props;
-  let [activeValue, setActiveValue] = (0, _index.useControlledState)(
-    defaultValue,
-    activeValueProp,
-    onValueChange,
-  );
-  let [stripeProperties, setStripeProperties] = _react.useState({});
-  let [hasSublabel, setHasSublabel] = _react.useState(false);
-  let idPrefix = (0, _index.useId)();
-  return _react.createElement(
-    _index.Box,
-    {
-      className: (0, _classnames.default)(
-        'iui-tabs-wrapper',
-        `iui-${orientation}`,
-        className,
-      ),
-      ...rest,
-      style: {
-        ...stripeProperties,
-        ...props?.style,
-      },
-      ref: ref,
-    },
-    _react.createElement(
-      TabsContext.Provider,
-      {
-        value: {
-          orientation,
-          type,
-          activeValue,
-          setActiveValue,
-          setStripeProperties,
-          idPrefix,
-          focusActivationMode,
-          hasSublabel,
-          setHasSublabel,
-          color,
-        },
-      },
-      children,
-    ),
-  );
-});
-TabsWrapper.displayName = 'Tabs.Wrapper';
-const TabList = _react.forwardRef((props, ref) => {
-  let { className, children, ...rest } = props;
-  let { type, hasSublabel, color } = (0, _index.useSafeContext)(TabsContext);
-  let isClient = (0, _index.useIsClient)();
-  let tablistRef = _react.useRef(null);
-  let [tablistSizeRef, tabsWidth] = (0, _index.useContainerWidth)(
-    'default' !== type,
-  );
-  let refs = (0, _index.useMergedRefs)(
-    ref,
-    tablistRef,
-    tablistSizeRef,
-    useScrollbarGutter(),
-  );
-  return _react.createElement(
-    _index.Box,
-    {
-      className: (0, _classnames.default)(
-        'iui-tabs',
-        `iui-${type}`,
-        {
-          'iui-green': 'green' === color,
-          'iui-animated': 'default' !== type && isClient,
-          'iui-not-animated': 'default' !== type && !isClient,
-          'iui-large': hasSublabel,
-        },
-        className,
-      ),
-      role: 'tablist',
-      ref: refs,
-      ...rest,
-    },
-    _react.createElement(
-      TabListContext.Provider,
-      {
-        value: {
-          tabsWidth,
-          tablistRef,
-        },
-      },
-      children,
-    ),
-  );
-});
-TabList.displayName = 'Tabs.TabList';
-const Tab = _react.forwardRef((props, forwardedRef) => {
-  let { className, children, value, label, ...rest } = props;
-  let {
-    orientation,
-    activeValue,
-    setActiveValue,
-    type,
-    setStripeProperties,
-    idPrefix,
-    focusActivationMode,
-  } = (0, _index.useSafeContext)(TabsContext);
-  let { tabsWidth, tablistRef } = (0, _index.useSafeContext)(TabListContext);
-  let tabRef = _react.useRef();
-  let isActive = activeValue === value;
-  let isActiveRef = (0, _index.useLatestRef)(isActive);
-  (0, _index.useLayoutEffect)(() => {
-    if (isActiveRef.current)
-      tabRef.current?.parentElement?.scrollTo({
-        ['horizontal' === orientation ? 'left' : 'top']:
-          tabRef.current?.[
-            'horizontal' === orientation ? 'offsetLeft' : 'offsetTop'
-          ] - 4,
-        behavior: 'instant',
-      });
-  }, [isActiveRef, orientation]);
-  (0, _index.useLayoutEffect)(() => {
-    let updateStripe = () => {
-      let currentTabRect = tabRef.current?.getBoundingClientRect();
-      let tabslistRect = tablistRef.current?.getBoundingClientRect();
-      let tabsStripePosition =
-        null != currentTabRect && null != tabslistRect
-          ? {
-              horizontal: currentTabRect.x - tabslistRect.x,
-              vertical: currentTabRect.y - tabslistRect.y,
-            }
-          : {
-              horizontal: 0,
-              vertical: 0,
-            };
-      setStripeProperties({
-        '--iui-tabs-stripe-size':
-          'horizontal' === orientation
-            ? `${currentTabRect?.width}px`
-            : `${currentTabRect?.height}px`,
-        '--iui-tabs-stripe-position':
-          'horizontal' === orientation
-            ? `${tabsStripePosition.horizontal}px`
-            : `${tabsStripePosition.vertical}px`,
-      });
-    };
-    if ('default' !== type && isActive) updateStripe();
-  }, [type, orientation, isActive, tabsWidth, setStripeProperties, tablistRef]);
-  let onKeyDown = (event) => {
-    if (event.altKey) return;
-    let allTabs = Array.from(event.currentTarget.parentElement?.children ?? []);
-    let nextTab = tabRef.current?.nextElementSibling ?? allTabs.at(0);
-    let previousTab = tabRef.current?.previousElementSibling ?? allTabs.at(-1);
-    switch (event.key) {
-      case 'ArrowDown':
-        if ('vertical' === orientation) {
-          nextTab?.focus();
-          event.preventDefault();
-        }
-        break;
-      case 'ArrowRight':
-        if ('horizontal' === orientation) {
-          nextTab?.focus();
-          event.preventDefault();
-        }
-        break;
-      case 'ArrowUp':
-        if ('vertical' === orientation) {
-          previousTab?.focus();
-          event.preventDefault();
-        }
-        break;
-      case 'ArrowLeft':
-        if ('horizontal' === orientation) {
-          previousTab?.focus();
-          event.preventDefault();
-        }
-        break;
-      default:
-        break;
-    }
-  };
-  let setInitialActiveRef = _react.useCallback(
-    (element) => {
-      if (void 0 !== activeValue) return;
-      if (element?.matches(':first-of-type')) setActiveValue(value);
-    },
-    [activeValue, setActiveValue, value],
-  );
-  return _react.createElement(
-    _index.ButtonBase,
-    {
-      className: (0, _classnames.default)('iui-tab', className),
-      role: 'tab',
-      tabIndex: isActive ? 0 : -1,
-      'aria-selected': isActive,
-      'aria-controls': `${idPrefix}-panel-${value.replaceAll(' ', '-')}`,
-      ref: (0, _index.useMergedRefs)(tabRef, forwardedRef, setInitialActiveRef),
-      ...rest,
-      id: `${idPrefix}-tab-${value.replaceAll(' ', '-')}`,
-      onClick: (0, _index.mergeEventHandlers)(props.onClick, () =>
-        setActiveValue(value),
-      ),
-      onKeyDown: (0, _index.mergeEventHandlers)(props.onKeyDown, onKeyDown),
-      onFocus: (0, _index.mergeEventHandlers)(props.onFocus, () => {
-        tabRef.current?.scrollIntoView({
-          block: 'nearest',
-          inline: 'nearest',
-        });
-        if ('auto' === focusActivationMode && !props.disabled)
-          setActiveValue(value);
-      }),
-    },
-    label ? _react.createElement(Tabs.TabLabel, null, label) : children,
-  );
-});
-Tab.displayName = 'Tabs.Tab';
-const TabIcon = _react.forwardRef((props, ref) =>
-  _react.createElement(_Icon.Icon, {
-    ...props,
-    className: (0, _classnames.default)('iui-tab-icon', props?.className),
-    ref: ref,
-  }),
-);
-TabIcon.displayName = 'Tabs.TabIcon';
-const TabLabel = _index.polymorphic.span('iui-tab-label');
-TabLabel.displayName = 'Tabs.TabLabel';
-const TabDescription = _react.forwardRef((props, ref) => {
-  let { className, children, ...rest } = props;
-  let { hasSublabel, setHasSublabel } = (0, _index.useSafeContext)(TabsContext);
-  (0, _index.useLayoutEffect)(() => {
-    if (!hasSublabel) setHasSublabel(true);
-  }, [hasSublabel, setHasSublabel]);
-  return _react.createElement(
-    _index.Box,
-    {
-      as: 'span',
-      className: (0, _classnames.default)('iui-tab-description', className),
-      ref: ref,
-      ...rest,
-    },
-    children,
-  );
-});
-TabDescription.displayName = 'Tabs.TabDescription';
-const TabsActions = _react.forwardRef((props, ref) => {
-  let { wrapperProps, className, children, ...rest } = props;
-  return _react.createElement(
-    _index.Box,
-    {
-      ...wrapperProps,
-      className: (0, _classnames.default)(
-        'iui-tabs-actions-wrapper',
-        wrapperProps?.className,
-      ),
-    },
-    _react.createElement(
-      _index.Box,
-      {
-        className: (0, _classnames.default)('iui-tabs-actions', className),
-        ref: ref,
-        ...rest,
-      },
-      children,
-    ),
-  );
-});
-TabsActions.displayName = 'Tabs.Actions';
-const TabsPanel = _react.forwardRef((props, ref) => {
-  let { value, className, children, ...rest } = props;
-  let { activeValue, idPrefix } = (0, _index.useSafeContext)(TabsContext);
-  return _react.createElement(
-    _index.Box,
-    {
-      className: (0, _classnames.default)('iui-tabs-content', className),
-      'aria-labelledby': `${idPrefix}-tab-${value.replaceAll(' ', '-')}`,
-      role: 'tabpanel',
-      hidden: activeValue !== value || void 0,
-      ref: ref,
-      ...rest,
-      id: `${idPrefix}-panel-${value.replaceAll(' ', '-')}`,
-    },
-    children,
-  );
-});
-TabsPanel.displayName = 'Tabs.Panel';
-const LegacyTabsComponent = _react.forwardRef((props, forwardedRef) => {
-  let actions;
-  if ('pill' !== props.type && props.actions) {
-    actions = props.actions;
-    props = {
-      ...props,
-    };
-    delete props.actions;
-  }
-  let {
-    labels,
-    onTabSelected,
-    focusActivationMode,
-    color,
-    activeIndex: activeIndexProp,
-    tabsClassName,
-    contentClassName,
-    wrapperClassName,
-    children,
-    ...rest
-  } = props;
-  let [activeIndex, setActiveIndex] = (0, _index.useControlledState)(
-    0,
-    activeIndexProp,
-    onTabSelected,
-  );
-  return _react.createElement(
-    TabsWrapper,
-    {
-      className: wrapperClassName,
-      focusActivationMode: focusActivationMode,
-      color: color,
-      value: `${activeIndex}`,
-      onValueChange: (value) => setActiveIndex(Number(value)),
-      ...rest,
-    },
-    _react.createElement(
-      TabList,
-      {
-        className: tabsClassName,
-        ref: forwardedRef,
-      },
-      labels.map((label, index) => {
-        let tabValue = `${index}`;
-        return _react.isValidElement(label)
-          ? _react.cloneElement(label, {
-              value: tabValue,
-            })
-          : _react.createElement(LegacyTab, {
-              key: index,
-              value: tabValue,
-              label: label,
-            });
-      }),
-    ),
-    actions && _react.createElement(TabsActions, null, actions),
-    children &&
-      _react.createElement(
-        TabsPanel,
-        {
-          value: `${activeIndex}`,
-          className: contentClassName,
-        },
-        children,
-      ),
-  );
-});
-LegacyTabsComponent.displayName = 'Tabs';
-const LegacyTab = _react.forwardRef((props, forwardedRef) => {
-  let { label, sublabel, startIcon, children, value, ...rest } = props;
-  return _react.createElement(
-    _react.Fragment,
-    null,
-    _react.createElement(
-      Tab,
-      {
-        ...rest,
-        value: value,
-        ref: forwardedRef,
-      },
-      startIcon && _react.createElement(TabIcon, null, startIcon),
-      _react.createElement(TabLabel, null, label),
-      sublabel && _react.createElement(TabDescription, null, sublabel),
-      children,
-    ),
-  );
-});
-const Tabs = Object.assign(LegacyTabsComponent, {
-  Wrapper: TabsWrapper,
-  TabList: TabList,
-  Tab: Tab,
-  TabIcon: TabIcon,
-  TabLabel: TabLabel,
-  TabDescription: TabDescription,
-  Actions: TabsActions,
-  Panel: TabsPanel,
-});
-const TabsContext = _react.createContext(void 0);
-TabsContext.displayName = 'TabsContext';
-const TabListContext = _react.createContext(void 0);
-TabListContext.displayName = 'TabListContext';
-const useScrollbarGutter = () =>
-  _react.useCallback((element) => {
-    if (element) {
-      if (element.scrollHeight > element.clientHeight) {
-        element.style.scrollbarGutter = 'stable';
-        if (!CSS.supports('scrollbar-gutter: stable'))
-          element.style.overflowY = 'scroll';
-      }
-    }
-  }, []);

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

@@ -1,84 +0,0 @@
-'use strict';
-Object.defineProperty(exports, '__esModule', {
-  value: true,
-});
-Object.defineProperty(exports, 'Tag', {
-  enumerable: true,
-  get: function () {
-    return Tag;
-  },
-});
-const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
-const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _classnames = _interop_require_default._(require('classnames'));
-const _react = _interop_require_wildcard._(require('react'));
-const _index = require('../../utils/index.js');
-const _IconButton = require('../Buttons/IconButton.js');
-const _LinkAction = require('../LinkAction/LinkAction.js');
-const Tag = _react.forwardRef((props, forwardedRef) => {
-  let {
-    className,
-    variant = 'default',
-    children,
-    onRemove,
-    onClick,
-    labelProps,
-    removeButtonProps,
-    ...rest
-  } = props;
-  let shouldUseLinkAction = !!onClick && !!onRemove;
-  return _react.createElement(
-    _index.Box,
-    {
-      as: shouldUseLinkAction
-        ? _LinkAction.LinkBox
-        : onClick
-          ? _index.ButtonBase
-          : 'span',
-      className: (0, _classnames.default)(
-        {
-          'iui-tag-basic': 'basic' === variant,
-          'iui-tag': 'default' === variant,
-        },
-        className,
-      ),
-      ref: forwardedRef,
-      onClick: shouldUseLinkAction ? void 0 : onClick,
-      ...rest,
-    },
-    'default' === variant
-      ? _react.createElement(
-          _index.Box,
-          {
-            as: shouldUseLinkAction ? _LinkAction.LinkAction : 'span',
-            onClick: shouldUseLinkAction ? onClick : void 0,
-            ...labelProps,
-            className: (0, _classnames.default)(
-              'iui-tag-label',
-              labelProps?.className,
-            ),
-          },
-          children,
-        )
-      : children,
-    onRemove &&
-      _react.createElement(
-        _IconButton.IconButton,
-        {
-          styleType: 'borderless',
-          size: 'small',
-          onClick: onRemove,
-          'aria-label': 'Delete tag',
-          ...removeButtonProps,
-          className: (0, _classnames.default)(
-            'iui-tag-button',
-            removeButtonProps?.className,
-          ),
-        },
-        _react.createElement(_index.SvgCloseSmall, {
-          'aria-hidden': true,
-        }),
-      ),
-  );
-});
-Tag.displayName = 'Tag';

package/DEV-cjs/core/Tag/TagContainer.js

@@ -1,35 +0,0 @@
-'use strict';
-Object.defineProperty(exports, '__esModule', {
-  value: true,
-});
-Object.defineProperty(exports, 'TagContainer', {
-  enumerable: true,
-  get: function () {
-    return TagContainer;
-  },
-});
-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 TagContainer = _react.forwardRef((props, forwardedRef) => {
-  let { className, children, overflow, background = 'none', ...rest } = props;
-  return _react.createElement(
-    _index.Box,
-    {
-      className: (0, _classnames.default)(
-        'iui-tag-container',
-        {
-          [`iui-${overflow}`]: !!overflow,
-          'iui-visible': 'none' !== background,
-        },
-        className,
-      ),
-      ref: forwardedRef,
-      ...rest,
-    },
-    children,
-  );
-});
-TagContainer.displayName = 'TagContainer';

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

@@ -1,22 +0,0 @@
-'use strict';
-Object.defineProperty(exports, '__esModule', {
-  value: true,
-});
-Object.defineProperty(exports, 'Textarea', {
-  enumerable: true,
-  get: function () {
-    return Textarea;
-  },
-});
-const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _react = _interop_require_wildcard._(require('react'));
-const _Input = require('../Input/Input.js');
-const Textarea = _react.forwardRef((props, forwardedRef) =>
-  _react.createElement(_Input.Input, {
-    as: 'textarea',
-    rows: 3,
-    ref: forwardedRef,
-    ...props,
-  }),
-);
-Textarea.displayName = 'Textarea';

package/DEV-cjs/core/ThemeProvider/ThemeContext.js

@@ -1,13 +0,0 @@
-'use strict';
-Object.defineProperty(exports, '__esModule', {
-  value: true,
-});
-Object.defineProperty(exports, 'ThemeContext', {
-  enumerable: true,
-  get: function () {
-    return ThemeContext;
-  },
-});
-const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
-const _react = _interop_require_wildcard._(require('react'));
-const ThemeContext = _react.createContext(void 0);