@databricks/design-system 0.2.1 → 1.0.0

package/dist/design-system/Icon/{icons → __generated/icons}/UploadIcon.d.ts

@@ -1,3 +1,3 @@
-import { IconProps } from '../Icon';
+import { IconProps } from '../../Icon';
 declare function UploadIcon(props: IconProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export default UploadIcon;

package/dist/design-system/Icon/{icons → __generated/icons}/UsbIcon.d.ts

@@ -1,3 +1,3 @@
-import { IconProps } from '../Icon';
+import { IconProps } from '../../Icon';
 declare function UsbIcon(props: IconProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export default UsbIcon;

package/dist/design-system/Icon/{icons → __generated/icons}/UserBadgeIcon.d.ts

@@ -1,3 +1,3 @@
-import { IconProps } from '../Icon';
+import { IconProps } from '../../Icon';
 declare function UserBadgeIcon(props: IconProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export default UserBadgeIcon;

package/dist/design-system/Icon/{icons → __generated/icons}/UserCircleIcon.d.ts

@@ -1,3 +1,3 @@
-import { IconProps } from '../Icon';
+import { IconProps } from '../../Icon';
 declare function UserCircleIcon(props: IconProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export default UserCircleIcon;

package/dist/design-system/Icon/{icons → __generated/icons}/UserGroupIcon.d.ts

@@ -1,3 +1,3 @@
-import { IconProps } from '../Icon';
+import { IconProps } from '../../Icon';
 declare function UserGroupIcon(props: IconProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export default UserGroupIcon;

package/dist/design-system/Icon/{icons → __generated/icons}/UserIcon.d.ts

@@ -1,3 +1,3 @@
-import { IconProps } from '../Icon';
+import { IconProps } from '../../Icon';
 declare function UserIcon(props: IconProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export default UserIcon;

package/dist/design-system/Icon/{icons → __generated/icons}/VideosIcon.d.ts

@@ -1,3 +1,3 @@
-import { IconProps } from '../Icon';
+import { IconProps } from '../../Icon';
 declare function VideosIcon(props: IconProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export default VideosIcon;

package/dist/design-system/Icon/{icons → __generated/icons}/WarningBorderIcon.d.ts

@@ -1,3 +1,3 @@
-import { IconProps } from '../Icon';
+import { IconProps } from '../../Icon';
 declare function WarningBorderIcon(props: IconProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export default WarningBorderIcon;

package/dist/design-system/Icon/{icons → __generated/icons}/WarningFillIcon.d.ts

@@ -1,3 +1,3 @@
-import { IconProps } from '../Icon';
+import { IconProps } from '../../Icon';
 declare function WarningFillIcon(props: IconProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export default WarningFillIcon;

package/dist/design-system/Icon/{icons → __generated/icons}/XCircleBorderIcon.d.ts

@@ -1,3 +1,3 @@
-import { IconProps } from '../Icon';
+import { IconProps } from '../../Icon';
 declare function XCircleBorderIcon(props: IconProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export default XCircleBorderIcon;

package/dist/design-system/Icon/{icons → __generated/icons}/XCircleFillIcon.d.ts

@@ -1,3 +1,3 @@
-import { IconProps } from '../Icon';
+import { IconProps } from '../../Icon';
 declare function XCircleFillIcon(props: IconProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export default XCircleFillIcon;

package/dist/design-system/Icon/{icons → __generated/icons}/ZoomInIcon.d.ts

@@ -1,3 +1,3 @@
-import { IconProps } from '../Icon';
+import { IconProps } from '../../Icon';
 declare function ZoomInIcon(props: IconProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export default ZoomInIcon;

package/dist/design-system/Icon/{icons → __generated/icons}/ZoomOutIcon.d.ts

@@ -1,3 +1,3 @@
-import { IconProps } from '../Icon';
+import { IconProps } from '../../Icon';
 declare function ZoomOutIcon(props: IconProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export default ZoomOutIcon;

package/dist/design-system/Icon/{icons → __generated/icons}/index.d.ts

@@ -122,7 +122,10 @@ export { default as PlusCircleBorderIcon } from './PlusCircleBorderIcon';
 export { default as PlusCircleFillIcon } from './PlusCircleFillIcon';
 export { default as PlusIcon } from './PlusIcon';
 export { default as PlusSquareIcon } from './PlusSquareIcon';
+export { default as QueryEditorIcon } from './QueryEditorIcon';
 export { default as QueryIcon } from './QueryIcon';
+export { default as QueryListViewIcon } from './QueryListViewIcon';
+export { default as QueryNavIcon } from './QueryNavIcon';
 export { default as QuestionMarkBorderIcon } from './QuestionMarkBorderIcon';
 export { default as QuestionMarkFillIcon } from './QuestionMarkFillIcon';
 export { default as ReaderModeIcon } from './ReaderModeIcon';

package/dist/design-system/Icon/index.d.ts

@@ -1,2 +1,2 @@
 export { IconProps, Icon } from './Icon';
-export * from './icons';
+export * from './__generated/icons';

package/dist/design-system/Input/Input.d.ts

@@ -3,9 +3,9 @@ import { PasswordProps as AntDPasswordProps, TextAreaProps as AntDTextAreaProps
 import { TextAreaRef } from 'antd/lib/input/TextArea';
 import React from 'react';
 import { DangerouslySetAntdProps } from '../types';
-export interface InputProps extends Omit<AntDInputProps, 'prefixCls' | 'size' | 'addonAfter' | 'allowClear' | 'bordered'>, DangerouslySetAntdProps<AntDInputProps> {
+export interface InputProps extends Omit<AntDInputProps, 'prefixCls' | 'size' | 'addonAfter' | 'bordered'>, DangerouslySetAntdProps<AntDInputProps> {
 }
-export interface TextAreaProps extends Omit<AntDTextAreaProps, 'allowClear' | 'bordered' | 'showCount' | 'size'>, DangerouslySetAntdProps<AntDTextAreaProps> {
+export interface TextAreaProps extends Omit<AntDTextAreaProps, 'bordered' | 'showCount' | 'size'>, DangerouslySetAntdProps<AntDTextAreaProps> {
 }
 export interface PasswordProps extends Omit<AntDPasswordProps, 'inputPrefixCls' | 'action' | 'visibilityToggle' | 'iconRender'>, DangerouslySetAntdProps<AntDPasswordProps> {
 }

package/dist/design-system/Notification/Notification.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/design-system/Pagination/index.d.ts

@@ -1,7 +1,9 @@
 /// <reference types="react" />
+import { SerializedStyles } from '@emotion/react';
 import { PaginationProps as AntdPaginationProps } from 'antd';
+import { Theme } from '../../theme';
 import { DangerouslySetAntdProps } from '../types';
-interface PaginationProps extends DangerouslySetAntdProps<AntdPaginationProps> {
+export interface PaginationProps extends DangerouslySetAntdProps<AntdPaginationProps> {
     /**
      * The index of the current page. Starts at 1.
      */
@@ -16,13 +18,13 @@ interface PaginationProps extends DangerouslySetAntdProps<AntdPaginationProps> {
     numTotal: number;
     /**
      * Callback that is triggered when the user navigates to a different page. Recieves the index
-     * of the new page.
+     * of the new page and the size of that page.
      */
-    onChange: (pageIndex: number) => void;
+    onChange: (pageIndex: number, pageSize?: number) => void;
     /**
      * Visual size of the pagination component.
      */
     size?: 'default' | 'small';
 }
+export declare function getPaginationEmotionStyles(clsPrefix: string, theme: Theme): SerializedStyles;
 export declare const Pagination: React.FC<PaginationProps>;
-export {};

package/dist/design-system/SegmentedControl/SegmentedControl.d.ts

@@ -2,7 +2,10 @@
 import { RadioGroupProps } from 'antd';
 import { RadioButtonProps } from 'antd/lib/radio/radioButton';
 export interface SegmentedControlButtonProps extends Omit<RadioButtonProps, 'optionType' | 'buttonStyle' | 'size' | 'prefixCls' | 'skipGroup'> {
-    size?: 'small' | 'medium';
+    size?: 'small' | 'middle';
 }
 export declare function SegmentedControlButton(props: SegmentedControlButtonProps): JSX.Element;
+export interface SegmentedControlGroupProps extends Omit<RadioGroupProps, 'size'> {
+    size?: 'small' | 'middle';
+}
 export declare function SegmentedControlGroup(props: RadioGroupProps): JSX.Element;

package/dist/design-system/Select/Select.d.ts

@@ -1,7 +1,28 @@
-/// <reference types="react" />
-import { Select as AntDSelect, SelectProps } from 'antd';
-export interface SelectInterface extends React.FC<SelectProps<any>> {
+import { Select as AntDSelect, SelectProps as AntDSelectProps } from 'antd';
+import { SelectValue as AntdSelectValue } from 'antd/lib/select';
+import React, { FC } from 'react';
+import { DangerouslySetAntdProps } from '../types';
+export declare type SelectValue = AntdSelectValue;
+declare type OmittedProps = 'bordered' | 'autoClearSearchValue' | 'dropdownRender' | 'dropdownStyle' | 'size' | 'suffixIcon' | 'tagRender' | 'clearIcon' | 'removeIcon' | 'showArrow' | 'size' | 'dropdownMatchSelectWidth' | 'menuItemSelectedIcon' | 'showSearch' | 'placeholder';
+export interface SelectProps<T = string> extends Omit<AntDSelectProps<T>, OmittedProps>, DangerouslySetAntdProps<Pick<AntDSelectProps<T>, OmittedProps>> {
+}
+export interface SelectInterface<T> extends FC<SelectProps<T>> {
     Option: typeof AntDSelect.Option;
-    OptGroup: typeof AntDSelect.OptGroup;
 }
-export declare const Select: SelectInterface;
+export declare function DuboisSelect<T extends SelectValue>({ loading, mode, dangerouslySetAntdProps, ...restProps }: SelectProps<T>): JSX.Element;
+export interface OptionProps {
+    value: string | number;
+    disabled?: boolean;
+    key?: string | number;
+    title?: string;
+    label?: React.ReactNode;
+    children: React.ReactNode;
+    'data-testid'?: string;
+    onClick?: () => void;
+}
+declare function Option(props: OptionProps): JSX.Element;
+export declare const Select: typeof DuboisSelect & {
+    Option: typeof Option;
+};
+export declare const __INTERNAL_DO_NOT_USE__Option: typeof Option;
+export {};

package/dist/design-system/Table/Table.d.ts

@@ -1,5 +1,6 @@
-import { TableProps as AntDTableProps, TablePaginationConfig as AntDTablePaginationConfig, TableColumnGroupType as AntDTableColumnGroupType, TableColumnType as AntDTableColumnType, TableColumnProps as AntDTableColumnProps, TableColumnsType as AntDTableColumnsType } from 'antd';
+import { TableColumnGroupType as AntDTableColumnGroupType, TableColumnProps as AntDTableColumnProps, TableColumnsType as AntDTableColumnsType, TableColumnType as AntDTableColumnType, TablePaginationConfig as AntDTablePaginationConfig, TableProps as AntDTableProps } from 'antd';
 export interface TableProps<RecordType> extends AntDTableProps<RecordType> {
+    scrollableInFlexibleContainer?: boolean;
 }
 export interface TablePaginationConfig extends AntDTablePaginationConfig {
 }

package/dist/design-system/Tabs/index.d.ts

@@ -3,7 +3,7 @@ import { CSSObject } from '@emotion/react';
 import { TabsProps as AntDTabsProps, TabPaneProps as AntDTabPaneProps } from 'antd';
 import { Theme } from '../../theme';
 import { DangerousGeneralProps } from '../types';
-export declare const getTabEmotionStyles: (clsPrefix: string, theme: Theme, enableAnimation: boolean) => CSSObject;
+export declare const getTabEmotionStyles: (clsPrefix: string, theme: Theme) => CSSObject;
 export interface TabsProps extends DangerousGeneralProps {
     /**
      * Set this to `true` to allow users to add and remove tab panes.

package/dist/design-system/Tag/index.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
+import React, { HTMLAttributes } from 'react';
 import { SecondaryColorToken } from '../../theme/colorList';
-interface TagProps {
+export interface TagProps extends HTMLAttributes<HTMLSpanElement> {
     /**
      * The color of the tag.
      */
@@ -17,10 +17,5 @@ interface TagProps {
      * Function called when the close button is clicked.
      */
     onClose?: () => void;
-    /**
-     * ID that can be used to select the Tag for use in unit tests.
-     */
-    dataTestId?: string;
 }
-export declare function Tag({ color, children, closable, onClose, dataTestId }: TagProps): JSX.Element;
-export {};
+export declare function Tag(props: TagProps): JSX.Element;

package/dist/design-system/Tree/Tree.d.ts

@@ -1,5 +1,34 @@
 /// <reference types="react" />
 import { TreeProps as AntDTreeProps } from 'antd';
-export interface TreeProps extends AntDTreeProps {
+import { DangerouslySetAntdProps } from '../types';
+export interface TreeProps extends DangerouslySetAntdProps<AntDTreeProps> {
+    /**
+     * An array of `TreeNode`s representing the data in the tree
+     */
+    treeData: AntDTreeProps['treeData'];
+    /**
+     * An array of keys of nodes in the tree which should be in an expanded state when the tree is first rendered.
+     */
+    defaultExpandedKeys?: string[];
+    /**
+     * An array of keys of nodes in the tree which should be in a selected state when the tree is first rendered.
+     * Use with `mode="selectable"`.
+     */
+    defaultSelectedKeys?: string[];
+    /**
+     * An array of keys of nodes in the tree which should be in a checked state when the tree is first rendered.
+     * Use with `mode="checkable"`.
+     */
+    defaultCheckedKeys?: string[];
+    /**
+     * Visually and functionally disables the tree.
+     */
+    disabled?: boolean;
+    /**
+     * The UX mode of the tree. In `default` mode, nodes are for display only and are non-interactive.
+     * In `selectable` mode, nodes can be selected and deselected. This is useful for something like a file browser.
+     * In `checkable` mode, nodes are rendered with a checkbox. This is useful for something like a nested preference list.
+     */
+    mode?: 'default' | 'selectable' | 'multiselectable' | 'checkable';
 }
-export declare const Tree: React.FC<TreeProps>;
+export declare function Tree({ treeData, defaultExpandedKeys, defaultSelectedKeys, defaultCheckedKeys, disabled, mode, dangerouslySetAntdProps, }: TreeProps): JSX.Element;

package/dist/design-system/index.d.ts

@@ -4,6 +4,7 @@ export * from './Breadcrumb';
 export * from './Button';
 export * from './Checkbox';
 export * from './Collapse';
+export * from './DatePicker';
 export * from './DesignSystemProvider';
 export * from './Dropdown';
 export * from './Form';