@databricks/design-system 2.0.5 → 2.0.7

package/dist/patterns.js

@@ -1,4 +1,4 @@
-export { D as DocumentationSidebar, F as FIXED_VERTICAL_STEPPER_WIDTH, M as MAX_VERTICAL_WIZARD_CONTENT_WIDTH, W as Wizard, a as WizardControlled, b as WizardModal, c as WizardStepContentWrapper, d as WizardStepNavigationProvider, u as useWizardCurrentStep, e as useWizardStepNavigation } from './WizardStepContentWrapper-Bq1wm0V7.js';
+export { D as DocumentationSidebar, F as FIXED_VERTICAL_STEPPER_WIDTH, M as MAX_VERTICAL_WIZARD_CONTENT_WIDTH, W as Wizard, a as WizardControlled, b as WizardModal, c as WizardStepContentWrapper, d as WizardStepNavigationProvider, u as useWizardCurrentStep, e as useWizardStepNavigation } from './WizardStepContentWrapper-bbh_CoIf.js';
 import '@emotion/react/jsx-runtime';
 import 'lodash/isUndefined';
 import 'react';
@@ -16,6 +16,8 @@ import '@floating-ui/dom';
 import 'react-dom';
 import '@radix-ui/react-hover-card';
 import '@radix-ui/react-toast';
+import '@radix-ui/react-slider';
+import '@radix-ui/react-toolbar';
 import '@react-aria/combobox';
 import '@react-aria/listbox';
 import '@react-aria/overlays';
@@ -52,10 +54,8 @@ import '@radix-ui/react-navigation-menu';
 import '@radix-ui/react-radio-group';
 import '@radix-ui/react-progress';
 import 'react-resizable';
-import '@radix-ui/react-slider';
 import '@radix-ui/react-scroll-area';
 import '@radix-ui/react-tabs';
 import 'lodash/debounce';
 import '@radix-ui/react-toggle';
-import '@radix-ui/react-toolbar';
 //# sourceMappingURL=patterns.js.map

package/dist-types/design-system/Alert/Alert.d.ts

@@ -1,10 +1,27 @@
-import type { AlertProps as AntDAlertProps } from "antd";
 import type { ButtonProps } from "../Button";
 import { DesignSystemEventProviderAnalyticsEventTypes } from "../DesignSystemEventProvider";
 import type { AnalyticsEventProps, DangerouslySetAntdProps, HTMLDataAttributes } from "../types";
-export type AlertType = NonNullable<AntDAlertProps["type"]>;
-export interface AlertProps extends Omit<AntDAlertProps, "closeText" | "showIcon" | "type" | "icon">, HTMLDataAttributes, DangerouslySetAntdProps<Partial<Pick<AntDAlertProps, "showIcon" | "icon" | "message" | "description" | "type">>>, AnalyticsEventProps<DesignSystemEventProviderAnalyticsEventTypes.OnView> {
+export type AlertType = "success" | "info" | "warning" | "error";
+export interface AlertProps extends HTMLDataAttributes, DangerouslySetAntdProps<{
+	showIcon?: boolean;
+	icon?: React.ReactNode;
+	message?: React.ReactNode;
+	description?: React.ReactNode;
+	type?: AlertType;
+}>, AnalyticsEventProps<DesignSystemEventProviderAnalyticsEventTypes.OnView> {
 	type: AlertType;
+	message: React.ReactNode;
+	description?: React.ReactNode;
+	closable?: boolean;
+	onClose?: React.MouseEventHandler<HTMLButtonElement>;
+	afterClose?: () => void;
+	role?: string;
+	style?: React.CSSProperties;
+	className?: string;
+	prefixCls?: string;
+	onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;
+	onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;
+	onClick?: React.MouseEventHandler<HTMLDivElement>;
 	closeIconLabel?: string;
 	/**
 	* @deprecated Use CEP-governed banners instead. go/banner/create go/getabanner go/banner
@@ -13,7 +30,7 @@ export interface AlertProps extends Omit<AntDAlertProps, "closeText" | "showIcon
 	/**
 	* @deprecated Please use `actions` instead.
 	*/
-	action?: AntDAlertProps["action"];
+	action?: React.ReactNode;
 	/** Array of button props to render as footer actions. All buttons will be rendered as small size. */
 	actions?: Omit<ButtonProps, "size" | "type">[];
 	/** Force actions to be rendered beneath the description. */

package/dist-types/design-system/Button/Button.d.ts

@@ -5,6 +5,7 @@ import type { WithLoadingState } from "../LoadingState/LoadingState";
 import type { AnalyticsEventPropsWithStartInteraction, HTMLDataAttributes } from "../types";
 export { SMALL_BUTTON_HEIGHT, getButtonEmotionStyles, getMemoizedButtonEmotionStyles } from "./AntDButtonInternal";
 export type ButtonSize = "middle" | "small";
+export type ButtonForceMode = "native" | "legacy-antd" | "flag";
 export interface ButtonProps extends Omit<AntDButtonProps, "type" | "ghost" | "shape" | "size">, HTMLDataAttributes, Omit<WithLoadingState, "loading">, AnalyticsEventPropsWithStartInteraction<DesignSystemEventProviderAnalyticsEventTypes.OnClick | DesignSystemEventProviderAnalyticsEventTypes.OnView> {
 	type?: "primary" | "link" | "tertiary";
 	size?: ButtonSize;
@@ -12,6 +13,6 @@ export interface ButtonProps extends Omit<AntDButtonProps, "type" | "ghost" | "s
 	dangerouslySetForceIconStyles?: boolean;
 	dangerouslyUseFocusPseudoClass?: boolean;
 	dangerouslyAppendWrapperCss?: React.CSSProperties;
-	useNativeButtonOverride?: boolean;
+	forceMode?: ButtonForceMode;
 }
 export declare const Button: ForwardRefExoticComponent<PropsWithoutRef<ButtonProps> & RefAttributes<HTMLButtonElement>>;

package/dist-types/design-system/Drawer/Drawer.d.ts

@@ -84,7 +84,9 @@ export interface DrawerContentProps extends AnalyticsEventProps<DesignSystemEven
 	* Applies emotion styles to the top-level element in the component.
 	*/
 	css?: Interpolation<EmotionTheme>;
+	/** Applies a class name to the top-level element in the component. */
+	className?: string;
 }
-export declare const Content: ({ children, footer, title, width, height, position: positionOverride, useCustomScrollBehavior, expandContentToFullHeight, disableOpenAutoFocus, onInteractOutside, seeThrough, hideClose, closeOnClickOutside, onCloseClick, componentId, analyticsEvents, size, ...props }: DrawerContentProps) => JSX.Element;
+export declare const Content: ({ children, footer, title, width, height, position: positionOverride, useCustomScrollBehavior, expandContentToFullHeight, disableOpenAutoFocus, onInteractOutside, seeThrough, hideClose, closeOnClickOutside, onCloseClick, componentId, analyticsEvents, size, className, ...props }: DrawerContentProps) => JSX.Element;
 export declare function Root(props: Pick<DialogPrimitive.DialogProps, "onOpenChange" | "children" | "open" | "modal">): JSX.Element;
 export declare function Trigger(props: Omit<DialogPrimitive.DialogTriggerProps, "asChild">): JSX.Element;

package/dist-types/design-system/Icon/AntdIcon.d.ts

@@ -0,0 +1,3 @@
+import type { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from "react";
+import type { IconProps } from "./Icon";
+export declare const AntdIcon: ForwardRefExoticComponent<PropsWithoutRef<IconProps> & RefAttributes<HTMLSpanElement>>;

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

@@ -1,12 +1,26 @@
-import AntDIcon from "@ant-design/icons";
-import type { ForwardRefExoticComponent, PropsWithoutRef, ReactElement, RefAttributes } from "react";
+import type { ComponentType, CSSProperties, ForwardRefExoticComponent, HTMLProps, PropsWithoutRef, ReactElement, RefAttributes, SVGProps } from "react";
 import React from "react";
 import type { HTMLDataAttributes } from "../types";
-type AntDIconProps = Omit<React.ComponentProps<typeof AntDIcon>, "onPointerEnterCapture" | "onPointerLeaveCapture">;
+export { getIconClassName } from "./utils";
 export type IconColors = "danger" | "warning" | "success" | "ai";
-export interface IconProps extends Omit<AntDIconProps, "component">, HTMLDataAttributes, React.HTMLAttributes<HTMLSpanElement> {
-	component?: (props: React.SVGProps<SVGSVGElement>) => ReactElement | null;
+interface CustomIconComponentProps {
+	width: string | number;
+	height: string | number;
+	fill: string;
+	viewBox?: string;
+	className?: string;
+	style?: CSSProperties;
+}
+interface IconCompatibilityProps extends Omit<HTMLProps<HTMLSpanElement>, "onPointerEnterCapture" | "onPointerLeaveCapture"> {
+	spin?: boolean;
+	rotate?: number;
+	viewBox?: string;
+	component?: ComponentType<CustomIconComponentProps | SVGProps<SVGSVGElement>> | ForwardRefExoticComponent<CustomIconComponentProps>;
+	ariaLabel?: React.AriaAttributes["aria-label"];
+}
+export interface IconProps extends Omit<IconCompatibilityProps, "component">, HTMLDataAttributes, React.HTMLAttributes<HTMLSpanElement> {
+	component?: (props: SVGProps<SVGSVGElement>) => ReactElement | null;
 	color?: IconColors;
+	forceNativeIcon?: boolean;
 }
 export declare const Icon: ForwardRefExoticComponent<PropsWithoutRef<IconProps> & RefAttributes<HTMLSpanElement>>;
-export {};

package/dist-types/design-system/Icon/NativeIcon.d.ts

@@ -0,0 +1,3 @@
+import type { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from "react";
+import type { IconProps } from "./Icon";
+export declare const NativeIcon: ForwardRefExoticComponent<PropsWithoutRef<IconProps> & RefAttributes<HTMLSpanElement>>;

package/dist-types/design-system/Icon/__generated/icons/LakewatchIcon.d.ts

@@ -0,0 +1,4 @@
+import type { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from "react";
+import type { IconProps } from "../../Icon";
+declare const LakewatchIcon: ForwardRefExoticComponent<PropsWithoutRef<IconProps> & RefAttributes<HTMLSpanElement>>;
+export default LakewatchIcon;

package/dist-types/design-system/Icon/__generated/icons/SlidesIcon.d.ts

@@ -0,0 +1,4 @@
+import type { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from "react";
+import type { IconProps } from "../../Icon";
+declare const SlidesIcon: ForwardRefExoticComponent<PropsWithoutRef<IconProps> & RefAttributes<HTMLSpanElement>>;
+export default SlidesIcon;

package/dist-types/design-system/Icon/__generated/icons/index.d.ts

@@ -245,6 +245,7 @@ export { default as LakeflowDesignerIcon } from "./LakeflowDesignerIcon";
 export { default as LakewatchAlertIcon } from "./LakewatchAlertIcon";
 export { default as LakewatchDatasourceIcon } from "./LakewatchDatasourceIcon";
 export { default as LakewatchDetectionRuleIcon } from "./LakewatchDetectionRuleIcon";
+export { default as LakewatchIcon } from "./LakewatchIcon";
 export { default as LakewatchParserIcon } from "./LakewatchParserIcon";
 export { default as LayerGraphIcon } from "./LayerGraphIcon";
 export { default as LayerIcon } from "./LayerIcon";
@@ -384,6 +385,7 @@ export { default as SidebarOpenIcon } from "./SidebarOpenIcon";
 export { default as SidebarSyncIcon } from "./SidebarSyncIcon";
 export { default as SlashSquareIcon } from "./SlashSquareIcon";
 export { default as SlidersIcon } from "./SlidersIcon";
+export { default as SlidesIcon } from "./SlidesIcon";
 export { default as SnippetIcon } from "./SnippetIcon";
 export { default as SortAscendingIcon } from "./SortAscendingIcon";
 export { default as SortCustomHorizontalIcon } from "./SortCustomHorizontalIcon";

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

@@ -1,3 +1,4 @@
 export { Icon } from "./Icon";
 export type { IconProps } from "./Icon";
+export { getIconClassName } from "./utils";
 export * from "./__generated/icons";

package/dist-types/design-system/Icon/utils.d.ts

@@ -0,0 +1 @@
+export declare function getIconClassName(): string;

package/dist-types/design-system/TypeaheadCombobox/TypeaheadComboboxControls.d.ts

@@ -1,8 +1,6 @@
 import type { UseComboboxGetToggleButtonPropsOptions } from "downshift";
 import { type DownshiftToggleButtonProps } from "./TypeaheadComboboxToggleButton";
 import type { ButtonSize } from "../Button";
-/** Height of the non-inline controls block, for callers that position it themselves. */
-export declare const TYPEAHEAD_COMBOBOX_CONTROLS_HEIGHT = 16;
 export interface TypeaheadComboboxControlsProps {
 	getDownshiftToggleButtonProps: (options?: UseComboboxGetToggleButtonPropsOptions) => DownshiftToggleButtonProps;
 	showClearSelectionButton?: boolean;

package/dist-types/design-system/_shared_/Tabs/styles.d.ts

@@ -1,4 +1,3 @@
 import type { CSSObject } from "@emotion/react";
-import type { Theme } from "../../../theme";
-export declare const getCommonTabsListStyles: (theme: Theme) => CSSObject;
-export declare const getCommonTabsTriggerStyles: (theme: Theme) => CSSObject;
+export declare const COMMON_TABS_LIST_STYLES: CSSObject;
+export declare const COMMON_TABS_TRIGGER_STYLES: CSSObject;

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

@@ -35,7 +35,6 @@ export * from "./LegacyPopover";
 export * from "./LegacySelect";
 export * from "./LegacySkeleton";
 export * from "./LegacyTable";
-export * from "./LegacyTooltip";
 export * from "./Listbox";
 export * from "./LoadingState";
 export * from "./Menu";

package/dist-types/design-system/utils/safex.d.ts

@@ -9,9 +9,10 @@ export type SAFEXValueType = boolean | number;
 *
 * @param flag The name of the flag to check
 * @param defaultValue The default value to return if the flag is not set
+* @param testDefault The default to use in Jest or UiTestServer tests
 * @returns
 */
-export declare const safex: <T extends SAFEXValueType>(flag: string, defaultValue: T) => T;
+export declare const safex: <T extends SAFEXValueType>(flag: string, defaultValue: T, testDefault?: T) => T;
 /**
 * Reads a server-side feature flag value. Delegates to `window.__debug__serverSideSafe`
 * which is set by `@databricks/web-shared` and includes full flag resolution with
@@ -21,6 +22,7 @@ export declare const safex: <T extends SAFEXValueType>(flag: string, defaultValu
 *
 * @param flag The name of the flag to check
 * @param defaultValue The default value to return if the flag is not set
+* @param testDefault The default to use in Jest or UiTestServer tests
 * @returns
 */
-export declare const serverSideSafe: <T extends SAFEXValueType>(flag: string, defaultValue: T) => T;
+export declare const serverSideSafe: <T extends SAFEXValueType>(flag: string, defaultValue: T, testDefault?: T) => T;

package/dist-types/theme/generalVariables.d.ts

@@ -1,6 +1,5 @@
 declare const antdGeneralVariables: {
 	classnamePrefix: string;
-	iconfontCssPrefix: string;
 	borderRadiusBase: number;
 	borderWidth: number;
 	heightSm: number;

package/dist-types/~patterns/Wizard/WizardModal.d.ts

@@ -3,4 +3,4 @@ import { type ModalProps } from "../../design-system";
 export interface WizardModalProps extends Omit<ModalProps, "footer" | "onCancel" | "onOk">, Omit<WizardProps, "width" | "layout" | "title"> {
 	onModalClose: () => void;
 }
-export declare function WizardModal({ onStepChanged, onCancel, initialStep, steps, onModalClose, localizeStepNumber, cancelButtonContent, nextButtonContent, previousButtonContent, doneButtonContent, enableClickingToSteps, ...modalProps }: WizardModalProps): JSX.Element | null;
+export declare function WizardModal({ onStepChanged, onValidateStepChange, onCancel, initialStep, steps, onModalClose, localizeStepNumber, cancelButtonContent, nextButtonContent, previousButtonContent, doneButtonContent, enableClickingToSteps, ...modalProps }: WizardModalProps): JSX.Element | null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@databricks/design-system",
-  "version": "2.0.5",
+  "version": "2.0.7",
   "description": "DuBois Design System",
   "keywords": [],
   "license": "ISC",
@@ -16,6 +16,7 @@
   "types": "dist-types/index.d.ts",
   "exports": {
     "./package.json": "./package.json",
+    "./icon-metadata.json": "./dist/icon-metadata.json",
     ".": {
       "types": "./dist-types/index.d.ts",
       "import": "./dist/index.js",
@@ -54,9 +55,11 @@
   "files": [
     "/AGENTS.md",
     "/CHANGELOG.md",
+    "/setup.mjs",
     "dist",
     "dist-types",
-    "test-utils"
+    "test-utils",
+    "/design-guidance"
   ],
   "scripts": {
     "prepublish": "./scripts/prepublish",
@@ -104,7 +107,7 @@
     "@figma/code-connect": "^2.0.0",
     "@jest/globals": "^30.0.2",
     "@svgr/cli": "^8.1.0",
-    "@swc/core": "^1.15.47",
+    "@swc/core": "^1.16.2",
     "@swc/register": "^0.1.10",
     "@tanstack/react-table": "8.21.2",
     "@testing-library/jest-dom": "^6.4.2",
@@ -140,7 +143,6 @@
   },
   "dependencies": {
     "@ant-design/icons": "^4.7.0",
-    "@databricks/testing-library": "1.0.0",
     "@emotion/unitless": "^0.8.1",
     "@floating-ui/dom": "^1.6.12",
     "@floating-ui/react": "^0.26.25",
@@ -184,5 +186,6 @@
     "react-resizable": "^3.0.4",
     "tabbable": "^6.4.0",
     "tslib": "^2.8.1"
-  }
+  },
+  "bin": "./setup.mjs"
 }