ezr-antd 1.0.0

package/es/tooltip/index.js

@@ -0,0 +1,187 @@
+"use client";
+
+var __rest = this && this.__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+import * as React from 'react';
+import classNames from 'classnames';
+import RcTooltip from 'rc-tooltip';
+import useMergedState from "rc-util/es/hooks/useMergedState";
+import ContextIsolator from '../_util/ContextIsolator';
+import { useZIndex } from '../_util/hooks/useZIndex';
+import { getTransitionName } from '../_util/motion';
+import getPlacements from '../_util/placements';
+import { cloneElement, isFragment } from '../_util/reactNode';
+import { devUseWarning } from '../_util/warning';
+import zIndexContext from '../_util/zindexContext';
+import { ConfigContext } from '../config-provider';
+import { useToken } from '../theme/internal';
+import PurePanel from './PurePanel';
+import useStyle from './style';
+import { parseColor } from './util';
+const InternalTooltip = /*#__PURE__*/React.forwardRef((props, ref) => {
+  var _a, _b;
+  const {
+    prefixCls: customizePrefixCls,
+    openClassName,
+    getTooltipContainer,
+    overlayClassName,
+    color,
+    overlayInnerStyle,
+    children,
+    afterOpenChange,
+    afterVisibleChange,
+    destroyTooltipOnHide,
+    arrow = true,
+    title,
+    overlay,
+    builtinPlacements,
+    arrowPointAtCenter = false,
+    autoAdjustOverflow = true
+  } = props;
+  const mergedShowArrow = !!arrow;
+  const [, token] = useToken();
+  const {
+    getPopupContainer: getContextPopupContainer,
+    getPrefixCls,
+    direction
+  } = React.useContext(ConfigContext);
+  // ============================== Ref ===============================
+  const warning = devUseWarning('Tooltip');
+  const tooltipRef = React.useRef(null);
+  const forceAlign = () => {
+    var _a;
+    (_a = tooltipRef.current) === null || _a === void 0 ? void 0 : _a.forceAlign();
+  };
+  React.useImperativeHandle(ref, () => {
+    var _a;
+    return {
+      forceAlign,
+      forcePopupAlign: () => {
+        warning.deprecated(false, 'forcePopupAlign', 'forceAlign');
+        forceAlign();
+      },
+      nativeElement: (_a = tooltipRef.current) === null || _a === void 0 ? void 0 : _a.nativeElement
+    };
+  });
+  // ============================== Warn ==============================
+  if (process.env.NODE_ENV !== 'production') {
+    [['visible', 'open'], ['defaultVisible', 'defaultOpen'], ['onVisibleChange', 'onOpenChange'], ['afterVisibleChange', 'afterOpenChange'], ['arrowPointAtCenter', 'arrow={{ pointAtCenter: true }}']].forEach(([deprecatedName, newName]) => {
+      warning.deprecated(!(deprecatedName in props), deprecatedName, newName);
+    });
+    process.env.NODE_ENV !== "production" ? warning(!destroyTooltipOnHide || typeof destroyTooltipOnHide === 'boolean', 'usage', '`destroyTooltipOnHide` no need config `keepParent` anymore. Please use `boolean` value directly.') : void 0;
+    process.env.NODE_ENV !== "production" ? warning(!arrow || typeof arrow === 'boolean' || !('arrowPointAtCenter' in arrow), 'deprecated', '`arrowPointAtCenter` in `arrow` is deprecated. Please use `pointAtCenter` instead.') : void 0;
+  }
+  // ============================== Open ==============================
+  const [open, setOpen] = useMergedState(false, {
+    value: (_a = props.open) !== null && _a !== void 0 ? _a : props.visible,
+    defaultValue: (_b = props.defaultOpen) !== null && _b !== void 0 ? _b : props.defaultVisible
+  });
+  const noTitle = !title && !overlay && title !== 0; // overlay for old version compatibility
+  const onOpenChange = vis => {
+    var _a, _b;
+    setOpen(noTitle ? false : vis);
+    if (!noTitle) {
+      (_a = props.onOpenChange) === null || _a === void 0 ? void 0 : _a.call(props, vis);
+      (_b = props.onVisibleChange) === null || _b === void 0 ? void 0 : _b.call(props, vis);
+    }
+  };
+  const tooltipPlacements = React.useMemo(() => {
+    var _a, _b;
+    let mergedArrowPointAtCenter = arrowPointAtCenter;
+    if (typeof arrow === 'object') {
+      mergedArrowPointAtCenter = (_b = (_a = arrow.pointAtCenter) !== null && _a !== void 0 ? _a : arrow.arrowPointAtCenter) !== null && _b !== void 0 ? _b : arrowPointAtCenter;
+    }
+    return builtinPlacements || getPlacements({
+      arrowPointAtCenter: mergedArrowPointAtCenter,
+      autoAdjustOverflow,
+      arrowWidth: mergedShowArrow ? token.sizePopupArrow : 0,
+      borderRadius: token.borderRadius,
+      offset: token.marginXXS,
+      visibleFirst: true
+    });
+  }, [arrowPointAtCenter, arrow, builtinPlacements, token]);
+  const memoOverlay = React.useMemo(() => {
+    if (title === 0) {
+      return title;
+    }
+    return overlay || title || '';
+  }, [overlay, title]);
+  const memoOverlayWrapper = /*#__PURE__*/React.createElement(ContextIsolator, {
+    space: true
+  }, typeof memoOverlay === 'function' ? memoOverlay() : memoOverlay);
+  const {
+      getPopupContainer,
+      placement = 'top',
+      mouseEnterDelay = 0.1,
+      mouseLeaveDelay = 0.1,
+      overlayStyle,
+      rootClassName
+    } = props,
+    otherProps = __rest(props, ["getPopupContainer", "placement", "mouseEnterDelay", "mouseLeaveDelay", "overlayStyle", "rootClassName"]);
+  const prefixCls = getPrefixCls('tooltip', customizePrefixCls);
+  const rootPrefixCls = getPrefixCls();
+  const injectFromPopover = props['data-popover-inject'];
+  let tempOpen = open;
+  // Hide tooltip when there is no title
+  if (!('open' in props) && !('visible' in props) && noTitle) {
+    tempOpen = false;
+  }
+  // ============================= Render =============================
+  const child = /*#__PURE__*/React.isValidElement(children) && !isFragment(children) ? children : /*#__PURE__*/React.createElement("span", null, children);
+  const childProps = child.props;
+  const childCls = !childProps.className || typeof childProps.className === 'string' ? classNames(childProps.className, openClassName || `${prefixCls}-open`) : childProps.className;
+  // Style
+  const [wrapCSSVar, hashId, cssVarCls] = useStyle(prefixCls, !injectFromPopover);
+  // Color
+  const colorInfo = parseColor(prefixCls, color);
+  const arrowContentStyle = colorInfo.arrowStyle;
+  const formattedOverlayInnerStyle = Object.assign(Object.assign({}, overlayInnerStyle), colorInfo.overlayStyle);
+  const customOverlayClassName = classNames(overlayClassName, {
+    [`${prefixCls}-rtl`]: direction === 'rtl'
+  }, colorInfo.className, rootClassName, hashId, cssVarCls);
+  // ============================ zIndex ============================
+  const [zIndex, contextZIndex] = useZIndex('Tooltip', otherProps.zIndex);
+  const content = /*#__PURE__*/React.createElement(RcTooltip, Object.assign({}, otherProps, {
+    zIndex: zIndex,
+    showArrow: mergedShowArrow,
+    placement: placement,
+    mouseEnterDelay: mouseEnterDelay,
+    mouseLeaveDelay: mouseLeaveDelay,
+    prefixCls: prefixCls,
+    overlayClassName: customOverlayClassName,
+    overlayStyle: Object.assign(Object.assign({}, arrowContentStyle), overlayStyle),
+    getTooltipContainer: getPopupContainer || getTooltipContainer || getContextPopupContainer,
+    ref: tooltipRef,
+    builtinPlacements: tooltipPlacements,
+    overlay: memoOverlayWrapper,
+    visible: tempOpen,
+    onVisibleChange: onOpenChange,
+    afterVisibleChange: afterOpenChange !== null && afterOpenChange !== void 0 ? afterOpenChange : afterVisibleChange,
+    overlayInnerStyle: formattedOverlayInnerStyle,
+    arrowContent: /*#__PURE__*/React.createElement("span", {
+      className: `${prefixCls}-arrow-content`
+    }),
+    motion: {
+      motionName: getTransitionName(rootPrefixCls, 'zoom-big-fast', props.transitionName),
+      motionDeadline: 1000
+    },
+    destroyTooltipOnHide: !!destroyTooltipOnHide
+  }), tempOpen ? cloneElement(child, {
+    className: childCls
+  }) : child);
+  return wrapCSSVar(/*#__PURE__*/React.createElement(zIndexContext.Provider, {
+    value: contextZIndex
+  }, content));
+});
+const Tooltip = InternalTooltip;
+if (process.env.NODE_ENV !== 'production') {
+  Tooltip.displayName = 'Tooltip';
+}
+Tooltip._InternalPanelDoNotUseOrYouWillBeFired = PurePanel;
+export default Tooltip;

package/es/tooltip/style/index.d.ts

@@ -0,0 +1,13 @@
+import type { ArrowOffsetToken } from '../../style/placementArrow';
+import type { ArrowToken } from '../../style/roundedArrow';
+import type { GetDefaultToken } from '../../theme/internal';
+export interface ComponentToken extends ArrowOffsetToken, ArrowToken {
+    /**
+     * @desc 文字提示 z-index
+     * @descEN z-index of tooltip
+     */
+    zIndexPopup: number;
+}
+export declare const prepareComponentToken: GetDefaultToken<'Tooltip'>;
+declare const _default: (prefixCls: string, injectStyle?: boolean) => readonly [(node: React.ReactElement) => React.ReactElement, string, string];
+export default _default;

package/es/tooltip/style/index.js

@@ -0,0 +1,118 @@
+import { unit } from '@ant-design/cssinjs';
+import { resetComponent } from '../../style';
+import { initZoomMotion } from '../../style/motion';
+import getArrowStyle, { getArrowOffsetToken, MAX_VERTICAL_CONTENT_RADIUS } from '../../style/placementArrow';
+import { getArrowToken } from '../../style/roundedArrow';
+import { genPresetColor, genStyleHooks, mergeToken } from '../../theme/internal';
+const genTooltipStyle = token => {
+  const {
+    componentCls,
+    // ant-tooltip
+    tooltipMaxWidth,
+    tooltipColor,
+    tooltipBg,
+    tooltipBorderRadius,
+    zIndexPopup,
+    controlHeight,
+    boxShadowSecondary,
+    paddingSM,
+    paddingXS
+  } = token;
+  return [{
+    [componentCls]: Object.assign(Object.assign(Object.assign(Object.assign({}, resetComponent(token)), {
+      position: 'absolute',
+      zIndex: zIndexPopup,
+      display: 'block',
+      width: 'max-content',
+      maxWidth: tooltipMaxWidth,
+      visibility: 'visible',
+      // When use `autoArrow`, origin will follow the arrow position
+      '--valid-offset-x': 'var(--arrow-offset-horizontal, var(--arrow-x))',
+      transformOrigin: [`var(--valid-offset-x, 50%)`, `var(--arrow-y, 50%)`].join(' '),
+      '&-hidden': {
+        display: 'none'
+      },
+      '--antd-arrow-background-color': tooltipBg,
+      // Wrapper for the tooltip content
+      [`${componentCls}-inner`]: {
+        minWidth: '1em',
+        minHeight: controlHeight,
+        padding: `${unit(token.calc(paddingSM).div(2).equal())} ${unit(paddingXS)}`,
+        color: tooltipColor,
+        textAlign: 'start',
+        textDecoration: 'none',
+        wordWrap: 'break-word',
+        backgroundColor: tooltipBg,
+        borderRadius: tooltipBorderRadius,
+        boxShadow: boxShadowSecondary,
+        boxSizing: 'border-box'
+      },
+      // Limit left and right placement radius
+      [[`&-placement-left`, `&-placement-leftTop`, `&-placement-leftBottom`, `&-placement-right`, `&-placement-rightTop`, `&-placement-rightBottom`].join(',')]: {
+        [`${componentCls}-inner`]: {
+          borderRadius: token.min(tooltipBorderRadius, MAX_VERTICAL_CONTENT_RADIUS)
+        }
+      },
+      [`${componentCls}-content`]: {
+        position: 'relative'
+      }
+    }), genPresetColor(token, (colorKey, {
+      darkColor
+    }) => ({
+      [`&${componentCls}-${colorKey}`]: {
+        [`${componentCls}-inner`]: {
+          backgroundColor: darkColor
+        },
+        [`${componentCls}-arrow`]: {
+          '--antd-arrow-background-color': darkColor
+        }
+      }
+    }))), {
+      // RTL
+      '&-rtl': {
+        direction: 'rtl'
+      }
+    })
+  },
+  // Arrow Style
+  getArrowStyle(token, 'var(--antd-arrow-background-color)'),
+  // Pure Render
+  {
+    [`${componentCls}-pure`]: {
+      position: 'relative',
+      maxWidth: 'none',
+      margin: token.sizePopupArrow
+    }
+  }];
+};
+// ============================== Export ==============================
+export const prepareComponentToken = token => Object.assign(Object.assign({
+  zIndexPopup: token.zIndexPopupBase + 70
+}, getArrowOffsetToken({
+  contentRadius: token.borderRadius,
+  limitVerticalRadius: true
+})), getArrowToken(mergeToken(token, {
+  borderRadiusOuter: Math.min(token.borderRadiusOuter, 4)
+})));
+export default (prefixCls, injectStyle = true) => {
+  const useStyle = genStyleHooks('Tooltip', token => {
+    const {
+      borderRadius,
+      colorTextLightSolid,
+      colorBgSpotlight
+    } = token;
+    const TooltipToken = mergeToken(token, {
+      // default variables
+      tooltipMaxWidth: 250,
+      tooltipColor: colorTextLightSolid,
+      tooltipBorderRadius: borderRadius,
+      tooltipBg: colorBgSpotlight
+    });
+    return [genTooltipStyle(TooltipToken), initZoomMotion(token, 'zoom-big-fast')];
+  }, prepareComponentToken, {
+    resetStyle: false,
+    // Popover use Tooltip as internal component. We do not need to handle this.
+    injectStyle
+  });
+  return useStyle(prefixCls);
+};

package/es/tooltip/util.d.ts

@@ -0,0 +1,6 @@
+import type * as React from 'react';
+export declare function parseColor(prefixCls: string, color?: string): {
+    className: string;
+    overlayStyle: React.CSSProperties;
+    arrowStyle: React.CSSProperties;
+};

package/es/tooltip/util.js

@@ -0,0 +1,20 @@
+import classNames from 'classnames';
+import { isPresetColor } from '../_util/colors';
+export function parseColor(prefixCls, color) {
+  const isInternalColor = isPresetColor(color);
+  const className = classNames({
+    [`${prefixCls}-${color}`]: color && isInternalColor
+  });
+  const overlayStyle = {};
+  const arrowStyle = {};
+  if (color && !isInternalColor) {
+    overlayStyle.background = color;
+    // @ts-ignore
+    arrowStyle['--antd-arrow-background-color'] = color;
+  }
+  return {
+    className,
+    overlayStyle,
+    arrowStyle
+  };
+}

package/es/tour/PurePanel.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import type { TourStepProps } from './interface';
+export interface PurePanelProps extends TourStepProps {
+}
+declare const _default: (props: PurePanelProps) => React.JSX.Element;
+export default _default;

package/es/tour/PurePanel.js

@@ -0,0 +1,63 @@
+"use client";
+
+var __rest = this && this.__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+import * as React from 'react';
+import classNames from 'classnames';
+import useClosable from '../_util/hooks/useClosable';
+import { withPureRenderTheme } from '../_util/PurePanel';
+import { cloneElement } from '../_util/reactNode';
+import { ConfigContext } from '../config-provider';
+import { RawPurePanel as PopoverRawPurePanel } from '../popover/PurePanel';
+import TourPanel from './panelRender';
+import useStyle from './style';
+const PurePanel = props => {
+  const {
+      prefixCls: customizePrefixCls,
+      current = 0,
+      total = 6,
+      className,
+      style,
+      type,
+      closable,
+      closeIcon
+    } = props,
+    restProps = __rest(props, ["prefixCls", "current", "total", "className", "style", "type", "closable", "closeIcon"]);
+  const {
+    getPrefixCls
+  } = React.useContext(ConfigContext);
+  const prefixCls = getPrefixCls('tour', customizePrefixCls);
+  const [wrapCSSVar, hashId, cssVarCls] = useStyle(prefixCls);
+  const [mergedClosable, mergedCloseIcon] = useClosable({
+    closable,
+    closeIcon
+  }, null, {
+    closable: true,
+    closeIconRender: icon => /*#__PURE__*/React.isValidElement(icon) ? cloneElement(icon, {
+      className: classNames(icon.props.className, `${prefixCls}-close-icon`)
+    }) : icon
+  });
+  return wrapCSSVar(/*#__PURE__*/React.createElement(PopoverRawPurePanel, {
+    prefixCls: prefixCls,
+    hashId: hashId,
+    className: classNames(className, `${prefixCls}-pure`, type && `${prefixCls}-${type}`, cssVarCls),
+    style: style
+  }, /*#__PURE__*/React.createElement(TourPanel, {
+    stepProps: Object.assign(Object.assign({}, restProps), {
+      prefixCls,
+      total,
+      closable: mergedClosable ? {
+        closeIcon: mergedCloseIcon
+      } : undefined
+    }),
+    current: current,
+    type: type
+  })));
+};
+export default withPureRenderTheme(PurePanel);

package/es/tour/index.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { TourProps } from './interface';
+import PurePanel from './PurePanel';
+declare const Tour: React.FC<TourProps> & {
+    _InternalPanelDoNotUseOrYouWillBeFired: typeof PurePanel;
+};
+export default Tour;

package/es/tour/index.js

@@ -0,0 +1,86 @@
+"use client";
+
+var __rest = this && this.__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+import React, { useContext } from 'react';
+import RCTour from '@rc-component/tour';
+import classNames from 'classnames';
+import { useZIndex } from '../_util/hooks/useZIndex';
+import getPlacements from '../_util/placements';
+import zIndexContext from '../_util/zindexContext';
+import { ConfigContext } from '../config-provider';
+import { useToken } from '../theme/internal';
+import TourPanel from './panelRender';
+import PurePanel from './PurePanel';
+import useStyle from './style';
+const Tour = props => {
+  const {
+      prefixCls: customizePrefixCls,
+      type,
+      rootClassName,
+      indicatorsRender,
+      steps,
+      closeIcon
+    } = props,
+    restProps = __rest(props, ["prefixCls", "type", "rootClassName", "indicatorsRender", "steps", "closeIcon"]);
+  const {
+    getPrefixCls,
+    direction,
+    tour
+  } = useContext(ConfigContext);
+  const prefixCls = getPrefixCls('tour', customizePrefixCls);
+  const [wrapCSSVar, hashId, cssVarCls] = useStyle(prefixCls);
+  const [, token] = useToken();
+  const mergedSteps = React.useMemo(() => steps === null || steps === void 0 ? void 0 : steps.map(step => {
+    var _a;
+    return Object.assign(Object.assign({}, step), {
+      className: classNames(step.className, {
+        [`${prefixCls}-primary`]: ((_a = step.type) !== null && _a !== void 0 ? _a : type) === 'primary'
+      })
+    });
+  }), [steps, type]);
+  const builtinPlacements = config => {
+    var _a;
+    return getPlacements({
+      arrowPointAtCenter: (_a = config === null || config === void 0 ? void 0 : config.arrowPointAtCenter) !== null && _a !== void 0 ? _a : true,
+      autoAdjustOverflow: true,
+      offset: token.marginXXS,
+      arrowWidth: token.sizePopupArrow,
+      borderRadius: token.borderRadius
+    });
+  };
+  const customClassName = classNames({
+    [`${prefixCls}-rtl`]: direction === 'rtl'
+  }, hashId, cssVarCls, rootClassName);
+  const mergedRenderPanel = (stepProps, stepCurrent) => (/*#__PURE__*/React.createElement(TourPanel, {
+    type: type,
+    stepProps: stepProps,
+    current: stepCurrent,
+    indicatorsRender: indicatorsRender
+  }));
+  // ============================ zIndex ============================
+  const [zIndex, contextZIndex] = useZIndex('Tour', restProps.zIndex);
+  return wrapCSSVar(/*#__PURE__*/React.createElement(zIndexContext.Provider, {
+    value: contextZIndex
+  }, /*#__PURE__*/React.createElement(RCTour, Object.assign({}, restProps, {
+    closeIcon: closeIcon !== null && closeIcon !== void 0 ? closeIcon : tour === null || tour === void 0 ? void 0 : tour.closeIcon,
+    zIndex: zIndex,
+    rootClassName: customClassName,
+    prefixCls: prefixCls,
+    animated: true,
+    renderPanel: mergedRenderPanel,
+    builtinPlacements: builtinPlacements,
+    steps: mergedSteps
+  }))));
+};
+if (process.env.NODE_ENV !== 'production') {
+  Tour.displayName = 'Tour';
+}
+Tour._InternalPanelDoNotUseOrYouWillBeFired = PurePanel;
+export default Tour;

package/es/tour/interface.d.ts

@@ -0,0 +1,31 @@
+import type { ReactNode } from 'react';
+import type { TourProps as RCTourProps, TourStepProps as RCTourStepProps } from '@rc-component/tour';
+export interface TourProps extends Omit<RCTourProps, 'renderPanel'> {
+    steps?: TourStepProps[];
+    prefixCls?: string;
+    current?: number;
+    indicatorsRender?: (current: number, total: number) => ReactNode;
+    type?: 'default' | 'primary';
+}
+export interface TourStepProps extends RCTourStepProps {
+    cover?: ReactNode;
+    nextButtonProps?: {
+        children?: ReactNode;
+        onClick?: () => void;
+        className?: string;
+        style?: React.CSSProperties;
+    };
+    prevButtonProps?: {
+        children?: ReactNode;
+        onClick?: () => void;
+        className?: string;
+        style?: React.CSSProperties;
+    };
+    indicatorsRender?: (current: number, total: number) => ReactNode;
+    type?: 'default' | 'primary';
+}
+export interface TourLocale {
+    Next: string;
+    Previous: string;
+    Finish: string;
+}

package/es/tour/interface.js

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

package/es/tour/panelRender.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import type { TourStepProps } from './interface';
+interface TourPanelProps {
+    stepProps: Omit<TourStepProps, 'closable'> & {
+        closable?: Exclude<TourStepProps['closable'], boolean>;
+    };
+    current: number;
+    type: TourStepProps['type'];
+    indicatorsRender?: TourStepProps['indicatorsRender'];
+}
+declare const TourPanel: React.FC<TourPanelProps>;
+export default TourPanel;

package/es/tour/panelRender.js

@@ -0,0 +1,111 @@
+"use client";
+
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import React from 'react';
+import CloseOutlined from "@ant-design/icons/es/icons/CloseOutlined";
+import classNames from 'classnames';
+import Button from '../button';
+import { useLocale } from '../locale';
+import defaultLocale from '../locale/en_US';
+function isValidNode(node) {
+  return node !== undefined && node !== null;
+}
+// Due to the independent design of Panel, it will be too coupled to put in rc-tour,
+// so a set of Panel logic is implemented separately in antd.
+const TourPanel = props => {
+  var _a, _b;
+  const {
+    stepProps,
+    current,
+    type,
+    indicatorsRender
+  } = props;
+  const {
+    prefixCls,
+    total = 1,
+    title,
+    onClose,
+    onPrev,
+    onNext,
+    onFinish,
+    cover,
+    description,
+    nextButtonProps,
+    prevButtonProps,
+    type: stepType,
+    closable
+  } = stepProps;
+  const mergedType = stepType !== null && stepType !== void 0 ? stepType : type;
+  const mergedCloseIcon = /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: onClose,
+    className: `${prefixCls}-close`
+  }, (closable === null || closable === void 0 ? void 0 : closable.closeIcon) || /*#__PURE__*/React.createElement(CloseOutlined, {
+    className: `${prefixCls}-close-icon`
+  }));
+  const isLastStep = current === total - 1;
+  const prevBtnClick = () => {
+    var _a;
+    onPrev === null || onPrev === void 0 ? void 0 : onPrev();
+    (_a = prevButtonProps === null || prevButtonProps === void 0 ? void 0 : prevButtonProps.onClick) === null || _a === void 0 ? void 0 : _a.call(prevButtonProps);
+  };
+  const nextBtnClick = () => {
+    var _a;
+    if (isLastStep) {
+      onFinish === null || onFinish === void 0 ? void 0 : onFinish();
+    } else {
+      onNext === null || onNext === void 0 ? void 0 : onNext();
+    }
+    (_a = nextButtonProps === null || nextButtonProps === void 0 ? void 0 : nextButtonProps.onClick) === null || _a === void 0 ? void 0 : _a.call(nextButtonProps);
+  };
+  const headerNode = isValidNode(title) ? (/*#__PURE__*/React.createElement("div", {
+    className: `${prefixCls}-header`
+  }, /*#__PURE__*/React.createElement("div", {
+    className: `${prefixCls}-title`
+  }, title))) : null;
+  const descriptionNode = isValidNode(description) ? (/*#__PURE__*/React.createElement("div", {
+    className: `${prefixCls}-description`
+  }, description)) : null;
+  const coverNode = isValidNode(cover) ? /*#__PURE__*/React.createElement("div", {
+    className: `${prefixCls}-cover`
+  }, cover) : null;
+  let mergedIndicatorNode;
+  if (indicatorsRender) {
+    mergedIndicatorNode = indicatorsRender(current, total);
+  } else {
+    mergedIndicatorNode = _toConsumableArray(Array.from({
+      length: total
+    }).keys()).map((stepItem, index) => (/*#__PURE__*/React.createElement("span", {
+      key: stepItem,
+      className: classNames(index === current && `${prefixCls}-indicator-active`, `${prefixCls}-indicator`)
+    })));
+  }
+  const mainBtnType = mergedType === 'primary' ? 'default' : 'primary';
+  const secondaryBtnProps = {
+    type: 'default',
+    ghost: mergedType === 'primary'
+  };
+  const [contextLocale] = useLocale('Tour', defaultLocale.Tour);
+  return /*#__PURE__*/React.createElement("div", {
+    className: `${prefixCls}-content`
+  }, /*#__PURE__*/React.createElement("div", {
+    className: `${prefixCls}-inner`
+  }, closable && mergedCloseIcon, coverNode, headerNode, descriptionNode, /*#__PURE__*/React.createElement("div", {
+    className: `${prefixCls}-footer`
+  }, total > 1 && /*#__PURE__*/React.createElement("div", {
+    className: `${prefixCls}-indicators`
+  }, mergedIndicatorNode), /*#__PURE__*/React.createElement("div", {
+    className: `${prefixCls}-buttons`
+  }, current !== 0 ? (/*#__PURE__*/React.createElement(Button, Object.assign({}, secondaryBtnProps, prevButtonProps, {
+    onClick: prevBtnClick,
+    size: "small",
+    className: classNames(`${prefixCls}-prev-btn`, prevButtonProps === null || prevButtonProps === void 0 ? void 0 : prevButtonProps.className)
+  }), (_a = prevButtonProps === null || prevButtonProps === void 0 ? void 0 : prevButtonProps.children) !== null && _a !== void 0 ? _a : contextLocale === null || contextLocale === void 0 ? void 0 : contextLocale.Previous)) : null, /*#__PURE__*/React.createElement(Button, Object.assign({
+    type: mainBtnType
+  }, nextButtonProps, {
+    onClick: nextBtnClick,
+    size: "small",
+    className: classNames(`${prefixCls}-next-btn`, nextButtonProps === null || nextButtonProps === void 0 ? void 0 : nextButtonProps.className)
+  }), (_b = nextButtonProps === null || nextButtonProps === void 0 ? void 0 : nextButtonProps.children) !== null && _b !== void 0 ? _b : isLastStep ? contextLocale === null || contextLocale === void 0 ? void 0 : contextLocale.Finish : contextLocale === null || contextLocale === void 0 ? void 0 : contextLocale.Next)))));
+};
+export default TourPanel;