@itwin/itwinui-react 3.16.1 → 5.0.0-alpha.1

package/cjs/core/Table/index.js

@@ -1,48 +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, {
-  ActionColumn: function () {
-    return _index2.ActionColumn;
-  },
-  BaseFilter: function () {
-    return _index.BaseFilter;
-  },
-  DefaultCell: function () {
-    return _index1.DefaultCell;
-  },
-  EditableCell: function () {
-    return _index1.EditableCell;
-  },
-  ExpanderColumn: function () {
-    return _index2.ExpanderColumn;
-  },
-  FilterButtonBar: function () {
-    return _index.FilterButtonBar;
-  },
-  SelectionColumn: function () {
-    return _index2.SelectionColumn;
-  },
-  Table: function () {
-    return _Table.Table;
-  },
-  TablePaginator: function () {
-    return _TablePaginator.TablePaginator;
-  },
-  tableFilters: function () {
-    return _index.tableFilters;
-  },
-});
-const _Table = require('./Table.js');
-const _index = require('./filters/index.js');
-const _index1 = require('./cells/index.js');
-const _TablePaginator = require('./TablePaginator.js');
-const _index2 = require('./columns/index.js');

package/cjs/core/Table/utils.d.ts

@@ -1,11 +0,0 @@
-import * as React from 'react';
-import type { ColumnInstance, TableInstance } from '../../react-table/react-table.js';
-export declare const getCellStyle: <T extends Record<string, unknown>>(column: ColumnInstance<T>, isTableResizing: boolean) => React.CSSProperties | undefined;
-export declare const getStickyStyle: <T extends Record<string, unknown>>(column: ColumnInstance<T>, columnList: ColumnInstance<T>[]) => React.CSSProperties;
-export declare const getSubRowStyle: ({ density, depth }: {
-    density?: string | undefined;
-    depth?: number | undefined;
-}) => {
-    paddingInlineStart: number;
-};
-export declare const TableInstanceContext: React.Context<TableInstance<Record<string, unknown>> | undefined>;

package/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/cjs/core/Tabs/Tabs.d.ts

@@ -1,297 +0,0 @@
-import * as React from 'react';
-import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
-type TabsOrientationProps = {
-    /**
-     * Orientation of the tabs.
-     * @default 'horizontal'
-     */
-    orientation?: 'horizontal';
-    /**
-     * Type of the tabs.
-     *
-     * If `orientation = 'vertical'`, `pill` is not applicable.
-     * @default 'default'
-     */
-    type?: 'default' | 'borderless' | 'pill';
-} | {
-    orientation: 'vertical';
-    type?: 'default' | 'borderless';
-};
-type TabsWrapperOwnProps = {
-    /**
-     * Color of the bar on the active tab.
-     * @default 'blue'
-     */
-    color?: 'blue' | 'green';
-    /**
-     * Control whether focusing tabs (using arrow keys) should automatically select them.
-     * Use 'manual' if tab panel content is not preloaded.
-     * @default 'auto'
-     */
-    focusActivationMode?: 'auto' | 'manual';
-    /**
-     * Value of the tab that should be active on initial render.
-     *
-     * Should be used for uncontrolled state (when no `value` passed).
-     *
-     * If not specified, then first tab will be active by default.
-     */
-    defaultValue?: string;
-    /**
-     * Value of the active tab for controlled state.
-     */
-    value?: string;
-    /**
-     * Function that gets called when active tab is changed.
-     *
-     * Should be used alongside `value` prop.
-     */
-    onValueChange?: (value: string) => void;
-    /**
-     * @deprecated Do not use.
-     */
-    defaultChecked?: never;
-} & TabsOrientationProps;
-type TabListOwnProps = {
-    /**
-     * Tab items.
-     */
-    children: React.ReactNode[];
-};
-type TabOwnProps = {
-    /**
-     * Value used to associate the tab with a given panel.
-     */
-    value: string;
-    /**
-     * Tab label used for simple Tab construction.
-     * Cannot be used with tabs that have icons or descriptions.
-     */
-    label?: string | React.ReactNode;
-    /**
-     * @deprecated Don't pass `id`, as it will be automatically set.
-     */
-    id?: string;
-};
-type TabsActionsOwnProps = {
-    /**
-     * Passes props to the wrapper component for the actions
-     */
-    wrapperProps?: React.ComponentPropsWithRef<'div'>;
-};
-type TabsPanelOwnProps = {
-    /**
-     * Value used to associate the panel with a given tab.
-     */
-    value: string;
-    /**
-     * @deprecated Don't pass `id`, as it will be automatically set.
-     */
-    id?: string;
-};
-type TabsLegacyProps = {
-    /**
-     * Content displayed to the right/bottom of the horizontal/vertical tabs
-     *
-     * If `type = 'pill'`, `actions` is not applicable.
-     */
-    actions?: React.ReactNode[];
-    /**
-     * Elements shown for each tab.
-     * Recommended to pass an array of `Tab` components.
-     */
-    labels: React.ReactNode[];
-    /**
-     * Handler for activating a tab.
-     */
-    onTabSelected?: (index: number) => void;
-    /**
-     * Index of the active tab.
-     */
-    activeIndex?: number;
-    /**
-     * Control whether focusing tabs (using arrow keys) should automatically select them.
-     * Use 'manual' if tab panel content is not preloaded.
-     * @default 'auto'
-     */
-    focusActivationMode?: 'auto' | 'manual';
-    /**
-     * Color of the bar on the active tab.
-     * @default 'blue'
-     */
-    color?: 'blue' | 'green';
-    /**
-     * Custom CSS class name for tabs.
-     */
-    tabsClassName?: string;
-    /**
-     * Custom CSS class name for tab panel.
-     */
-    contentClassName?: string;
-    /**
-     * Custom CSS class name for the tabs wrapper.
-     */
-    wrapperClassName?: string;
-    /**
-     * Content inside the tab panel.
-     */
-    children?: React.ReactNode;
-    /**
-     * @deprecated Tabs will now overflow by default, so this prop does nothing.
-     */
-    overflowOptions?: {
-        /**
-         * @deprecated Tabs will now overflow by default, so this prop does nothing.
-         */
-        useOverflow?: boolean;
-    };
-    defaultValue?: never;
-    defaultChecked?: never;
-} & TabsOrientationProps;
-type TabLegacyProps = {
-    /**
-     * The main label shown in the tab.
-     */
-    label?: React.ReactNode;
-    /**
-     * Secondary label shown below the main label.
-     */
-    sublabel?: React.ReactNode;
-    /**
-     * Svg icon shown before the labels.
-     */
-    startIcon?: JSX.Element;
-    /**
-     * Control whether the tab is disabled.
-     */
-    disabled?: boolean;
-    /**
-     * Custom content appended to the tab.
-     */
-    children?: React.ReactNode;
-    /**
-     * `value` of the tab.
-     *
-     * Will be set by parent `Tabs` component.
-     */
-    value?: string;
-};
-/**
- * Legacy Tab component.
- * For full functionality use composition API.
- *
- * Individual tab component to be used in the `labels` prop of `Tabs`.
- * @example
- * const tabs = [
- *   <Tab label='Label 1' sublabel='Description 1' />,
- *   <Tab label='Label 2' startIcon={<SvgPlaceholder />} />,
- * ];
- */
-declare const LegacyTab: PolymorphicForwardRefComponent<"button", TabLegacyProps>;
-export { LegacyTab as Tab };
-/**
- * Tabs organize and allow navigation between groups of content that are related and at the same level of hierarchy.
- * `Tabs.Tab` and `Tabs.Panel` can be associated with each other by passing them the same `value`.
- * @example
- * <Tabs.Wrapper>
- *   <Tabs.TabList>
- *     <Tabs.Tab value='tab1' label='Label 1' />
- *     <Tabs.Tab value='tab2' label='Label 2' />
- *     <Tabs.Tab value='tab3' label='Label 3' />
- *   </Tabs.TabList>
- *   <Tabs.Actions>
- *     <Button>Sample Button</Button>
- *   </Tabs.Actions>
- *   <Tabs.Panel value='tab1'>Content 1</Tabs.Panel>
- *   <Tabs.Panel value='tab2'>Content 2</Tabs.Panel>
- *   <Tabs.Panel value='tab3'>Content 3</Tabs.Panel>
- * </Tabs.Wrapper>
- *
- * @example
- * <Tabs orientation='vertical'/>
- *
- * @example
- * <Tabs.Wrapper focusActivationMode='manual'>
- *  <Tabs.Tab value='sample'>
- *   <Tabs.TabIcon>
- *     <SvgPlaceholder />
- *   </Tabs.TabIcon>
- *   <Tabs.TabLabel>Sample Label</Tabs.TabLabel>
- *   <Tabs.TabDescription>Sample Description</Tabs.TabDescription>
- *  </Tabs.Tab>
- * </Tabs.Wrapper>
- */
-export declare const Tabs: PolymorphicForwardRefComponent<"div", TabsLegacyProps> & {
-    /**
-     * A wrapper component for Tabs
-     */
-    Wrapper: PolymorphicForwardRefComponent<"div", TabsWrapperOwnProps>;
-    /**
-     * Tablist subcomponent which contains all of the tab subcomponents.
-     * @example
-     * <Tabs.TabList>
-     *   <Tabs.Tab value='tab1' label='Label 1' />
-     *   <Tabs.Tab value='tab2' label='Label 2' />
-     *   <Tabs.Tab value='tab3' label='Label 3' />
-     * </Tabs.TabList>
-     *
-     * @example
-     * <Tabs.TabList>
-     *   <Tabs.Tab value='tab1' label='Green Tab' />
-     * </Tabs.TabList>
-     *
-     * @example
-     * <Tabs.TabList focusActivationMode='manual'>
-     *   <Tabs.Tab value='tab1' label='Manual Focus Tab' />
-     * </Tabs.TabList>
-     */
-    TabList: PolymorphicForwardRefComponent<"div", TabListOwnProps>;
-    /**
-     * Tab subcomponent which is used for each of the tabs.
-     * @example
-     * <Tabs.Tab value='tab1' label='Label 1' />
-     *
-     * @example
-     * <Tabs.Tab value='sample'>
-     *   <Tabs.TabIcon>
-     *     <SvgPlaceholder />
-     *   </Tabs.TabIcon>
-     *   <Tabs.TabLabel>Sample Label</Tabs.TabLabel>
-     *   <Tabs.TabDescription>Sample Description</Tabs.TabDescription>
-     * </Tabs.Tab>
-     *
-     */
-    Tab: PolymorphicForwardRefComponent<"button", TabOwnProps>;
-    /**
-     * Tab icon subcomponent which places an icon on the left side of the tab.
-     */
-    TabIcon: PolymorphicForwardRefComponent<"span", Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
-        ref?: ((instance: HTMLSpanElement | null) => void) | React.RefObject<HTMLSpanElement> | null | undefined;
-    }, "fill" | "as" | "key" | "size" | keyof React.HTMLAttributes<HTMLSpanElement> | "padded"> & {
-        size?: "auto" | "small" | "medium" | "large" | import("../../utils/types.js").AnyString;
-        fill?: "default" | "positive" | "informational" | "negative" | "warning" | import("../../utils/types.js").AnyString;
-        padded?: boolean;
-    } & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
-        as?: "span" | undefined;
-    }>;
-    /**
-     * Tab label subcomponent which holds the tab's label.
-     */
-    TabLabel: PolymorphicForwardRefComponent<"span", {}>;
-    /**
-     * Tab description subcomponent which places a description under the tab label.
-     */
-    TabDescription: PolymorphicForwardRefComponent<"span", {}>;
-    /**
-     * Tab actions subcomponent which contains action buttons that are placed at the end of the tabs.
-     */
-    Actions: PolymorphicForwardRefComponent<"div", TabsActionsOwnProps>;
-    /**
-     * Tab panel subcomponent which contains the tab's content.
-     * @example
-     * <Tabs.Panel value='tab1'>
-     *   Sample Panel
-     * </Tabs.Panel>
-     */
-    Panel: PolymorphicForwardRefComponent<"div", TabsPanelOwnProps>;
-};