@qsxy/element-plus-react 1.0.0-next.1 → 1.0.0-next.11

package/README.md

@@ -0,0 +1,95 @@
+# @qsxy/element-plus-react
+
+[![NPM version](https://img.shields.io/npm/v/element-plus-react.svg?style=flat)](https://npmjs.org/package/@qsxy/element-plus-react)
+[![NPM downloads](http://img.shields.io/npm/dm/element-plus-react.svg?style=flat)](https://npmjs.org/package/@qsxy/element-plus-react)
+
+-   [API 文档](https://ahqsluoye.github.io/element-plus-react/)
+
+## Usage
+
+```javascript
+// how to use
+import '@qsxy/element-plus-react/dist/index.css';
+import { ElButton, ElLink } from '@qsxy/element-plus-react';
+```
+
+### Change the SCSS variable in the project
+
+element-plus-react is using SCSS. If your project also uses SCSS, you can directly change the style variable of Element in the project. Create a new style file, such as element-variables.csss, and write the following content:
+
+### 在项目中改变 SCSS 变量
+
+element-plus-react 的 theme-chalk 使用 SCSS 编写，如果你的项目也使用了 SCSS，那么可以直接在项目中改变 Element 的样式变量。新建一个样式文件，例如 element-variables.scss，写入以下内容：
+
+/_ Change the theme color variable _/
+
+/_ 改变主题色变量 _/
+
+```scss
+@use 'sass:math';
+
+@mixin set-color-mix-level($number, $mode: 'light', $--el-color-primary, $mix-color: #ffffff) {
+    --el-color-primary-#{$mode}-#{$number}: #{mix($mix-color, $--el-color-primary, math.percentage(math.div($number, 10)))};
+}
+
+// Theme color variable
+// 主题色变量
+$--el-color-primary: #4f8ffa;
+:root {
+    // Theme color variable
+    // 主题色变量
+    --el-color-primary: #4f8ffa;
+    // Theme background color variable (button class)
+    // 主题背景颜色变量（按钮类）
+    --el-bg-color-primary: #4f8ffa;
+    // Theme border color variable (button class)
+    // 主题边框颜色变量（按钮类）
+    --btn-border-color: #48aff9;
+
+    @each $i in (3, 5, 7, 8, 9) {
+        @include set-color-mix-level($i, 'light', $--el-color-primary, #ffffff);
+    }
+
+    @include set-color-mix-level(2, 'dark', $--el-color-primary, #000000);
+
+    // dark mode 暗黑模式
+    &.is-dark {
+        --el-color-primary: #{mix(#141414, $--el-color-primary, 5)};
+
+        @each $i in (3, 5, 7, 8, 9) {
+            @include set-color-mix-level($i, 'light', $--el-color-primary, #141414);
+        }
+
+        @include set-color-mix-level(2, 'dark', $--el-color-primary, #141414);
+    }
+}
+```
+
+/_ Change icon font path variable, required _/
+
+/_ 改变 icon 字体路径变量，必需 _/
+
+```scss
+$fa-font-path: '~@/assets/fonts';
+@import '@qsxy/element-plus-react/theme-chalk/index.scss';
+```
+
+## Warm Reminder
+
+Currently, this library is in the development and testing stage, and there may be some inevitable issues. If you encounter any problems, please feel free to raise an issue for me, and I will fix them as soon as possible.
+
+目前该库为开发测试阶段，会有一些不可避免的问题，如果您发现了一些问题，欢迎提 Issues 给我，我会尽快修复
+
+## Development
+
+```bash
+# install dependencies
+$ npm i @qsxy/element-plus-react
+# It is recommended to use (to avoid React version conflicts)
+# 推荐使用（避免react版本冲突）
+$ pnpm add @qsxy/element-plus-react
+```
+
+## LICENSE
+
+MIT

package/dist/Avatar/Avatar.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import { AvatarProps } from './typings';
+declare const Avatar: FC<AvatarProps>;
+export default Avatar;

package/dist/Avatar/Avatar.js

@@ -0,0 +1,87 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+/* eslint-disable indent */
+import classNames from 'classnames';
+import React, { memo, useEffect, useMemo, useState } from 'react';
+import Icon from "../Icon/Icon";
+import { addUnit, isNotEmpty, isNumber, isString } from "../Util/base";
+import { useClassNames } from "../hooks";
+var Avatar = /*#__PURE__*/memo(function (props) {
+  var icon = props.icon,
+    _props$size = props.size,
+    size = _props$size === void 0 ? 'default' : _props$size,
+    _props$shape = props.shape,
+    shape = _props$shape === void 0 ? 'circle' : _props$shape,
+    src = props.src,
+    srcSet = props.srcSet,
+    alt = props.alt,
+    _props$fit = props.fit,
+    fit = _props$fit === void 0 ? 'cover' : _props$fit,
+    _props$classPrefix = props.classPrefix,
+    classPrefix = _props$classPrefix === void 0 ? 'avatar' : _props$classPrefix,
+    onError = props.onError;
+  var _useClassNames = useClassNames(classPrefix),
+    b = _useClassNames.b,
+    m = _useClassNames.m,
+    cssVarBlock = _useClassNames.cssVarBlock;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    hasLoadError = _useState2[0],
+    setHasLoadError = _useState2[1];
+  var handleError = function handleError(e) {
+    setHasLoadError(true);
+    onError === null || onError === void 0 || onError(e);
+  };
+  useEffect(function () {
+    if (isNotEmpty(src)) {
+      setHasLoadError(false);
+    }
+  }, [src]);
+  var avatarClass = useMemo(function () {
+    var classList = [b()];
+    if (isString(size)) {
+      classList.push(m(size));
+    }
+    if (icon) {
+      classList.push(m('icon'));
+    }
+    if (shape) {
+      classList.push(m(shape));
+    }
+    return classNames(classList, props.className);
+  }, [b, icon, m, props.className, shape, size]);
+  var sizeStyle = useMemo(function () {
+    return isNumber(size) ? cssVarBlock({
+      size: addUnit(size) || ''
+    }) : {};
+  }, [cssVarBlock, size]);
+  var children = useMemo(function () {
+    return icon ? /*#__PURE__*/React.createElement(Icon, {
+      name: icon
+    }) : props.children;
+  }, [icon, props.children]);
+  return /*#__PURE__*/React.createElement("span", {
+    className: avatarClass,
+    style: _objectSpread(_objectSpread({}, sizeStyle), props.style)
+  }, (src || srcSet) && !hasLoadError ? /*#__PURE__*/React.createElement("img", {
+    src: src,
+    alt: alt,
+    srcSet: srcSet,
+    style: {
+      objectFit: fit
+    },
+    onError: handleError
+  }) : children);
+});
+Avatar.displayName = 'ElAvatar';
+export default Avatar;

package/dist/Avatar/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Avatar } from './Avatar';
+export type { AvatarProps } from './typings';

package/dist/Avatar/index.js

@@ -0,0 +1 @@
+export { default as Avatar } from "./Avatar";

package/dist/Avatar/typings.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+import { IconName } from '../Icon';
+import { BaseProps, NativeProps } from '../types/common';
+export interface AvatarProps extends BaseProps, NativeProps<'--el-avatar-text-color' | '--el-avatar-bg-color' | '--el-avatar-text-size' | '--el-avatar-icon-size' | '--el-avatar-border-radius' | '--el-avatar-size-large' | '--el-avatar-size-small' | '--el-avatar-size'> {
+    /** 设置 Avatar 的图标类型，具体参考 Icon 组件	 */
+    icon?: IconName;
+    /** Avatar 大小	*/
+    size?: number | 'large' | 'default' | 'small' | '';
+    /** Avatar 形状	 */
+    shape?: 'circle' | 'square';
+    /** Avatar 图片的源地址 */
+    src?: string;
+    /** 图片 Avatar 的原生 srcset 属性 */
+    srcSet?: string;
+    /** 图片 Avatar 的原生 alt 属性 */
+    alt?: string;
+    /** 当展示类型为图片的时候，设置图片如何适应容器 */
+    fit?: 'fill' | 'contain' | 'cover' | 'none' | 'scale-down';
+    /** 图片加载失败时触发 */
+    onError?: (e: React.SyntheticEvent<HTMLImageElement, Event>) => void;
+}

package/dist/Avatar/typings.js

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

package/dist/Badge/Badge.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { BadgeProps } from './typings';
-declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLDivElement>>>;
-export default _default;
+declare const Badge: React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLDivElement>>;
+export default Badge;

package/dist/Badge/Badge.js

@@ -1,65 +1,67 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/Badge/Badge.tsx
-var Badge_exports = {};
-__export(Badge_exports, {
-  default: () => Badge_default
-});
-module.exports = __toCommonJS(Badge_exports);
-var import_classnames = __toESM(require("classnames"));
-var import_isNumber = __toESM(require("lodash/isNumber"));
-var import_react = __toESM(require("react"));
-var import_Transition = __toESM(require("../Transition/Transition"));
-var import_hooks = require("../hooks");
-var Badge = (0, import_react.forwardRef)((props, ref) => {
-  const { type, isDot, value, max, hidden, showZero = true, color, offset = [], badgeClass, badgeStyle = {} } = props;
-  const { b, e, em, is } = (0, import_hooks.useClassNames)("badge");
-  const content = (0, import_react.useMemo)(() => {
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _templateObject;
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+import classNames from 'classnames';
+import isNumber from 'lodash/isNumber';
+import React, { forwardRef, memo, useMemo, useRef } from 'react';
+import Transition from "../Transition/Transition";
+import { useClassNames } from "../hooks";
+var Badge = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, ref) {
+  var _props$type = props.type,
+    type = _props$type === void 0 ? 'danger' : _props$type,
+    isDot = props.isDot,
+    value = props.value,
+    max = props.max,
+    hidden = props.hidden,
+    _props$showZero = props.showZero,
+    showZero = _props$showZero === void 0 ? true : _props$showZero,
+    color = props.color,
+    _props$offset = props.offset,
+    offset = _props$offset === void 0 ? [] : _props$offset,
+    badgeClass = props.badgeClass,
+    _props$badgeStyle = props.badgeStyle,
+    badgeStyle = _props$badgeStyle === void 0 ? {} : _props$badgeStyle;
+  var _useClassNames = useClassNames('badge'),
+    b = _useClassNames.b,
+    e = _useClassNames.e,
+    em = _useClassNames.em,
+    is = _useClassNames.is;
+  var nodeRef = useRef(null);
+  var content = useMemo(function () {
     if (isDot) {
-      return "";
+      return '';
     }
-    if ((0, import_isNumber.default)(value) && (0, import_isNumber.default)(max)) {
-      return max < value ? `${max}+` : `${value}`;
+    if (isNumber(value) && isNumber(max)) {
+      return max < value ? "".concat(max, "+") : "".concat(value);
     }
-    return `${value}`;
+    return "".concat(value);
   }, [isDot, max, value]);
-  return /* @__PURE__ */ import_react.default.createElement("div", { ref, className: (0, import_classnames.default)(b(), props.className), style: props.style }, props.children, /* @__PURE__ */ import_react.default.createElement(import_Transition.default, { name: "r-zoom-in-center", visible: !hidden && (!!content || isDot) && !(!showZero && value === 0), display: "inline-flex" }, /* @__PURE__ */ import_react.default.createElement(
-    "sup",
-    {
-      className: (0, import_classnames.default)(e`content`, em("content", type), is({ fixed: !!props.children, dot: isDot }), badgeClass),
-      style: { background: color, marginRight: (offset == null ? void 0 : offset[0]) ? -offset[0] : null, marginTop: offset == null ? void 0 : offset[1], ...badgeStyle }
-    },
-    content
-  )));
-});
-Badge.displayName = "ElBadge";
-Badge.defaultProps = {
-  type: "danger"
-};
-var Badge_default = (0, import_react.memo)(Badge);
+  return /*#__PURE__*/React.createElement("div", {
+    ref: ref,
+    className: classNames(b(), props.className),
+    style: props.style
+  }, props.children, /*#__PURE__*/React.createElement(Transition, {
+    nodeRef: nodeRef,
+    name: b('zoom-in-center', false),
+    visible: !hidden && (!!content || isDot) && !(!showZero && value === 0),
+    display: "inline-flex"
+  }, /*#__PURE__*/React.createElement("sup", {
+    ref: nodeRef,
+    className: classNames(e(_templateObject || (_templateObject = _taggedTemplateLiteral(["content"]))), em('content', type), is({
+      fixed: !!props.children,
+      dot: isDot
+    }), badgeClass),
+    style: _objectSpread({
+      background: color,
+      marginRight: offset !== null && offset !== void 0 && offset[0] ? -offset[0] : null,
+      marginTop: offset === null || offset === void 0 ? void 0 : offset[1]
+    }, badgeStyle)
+  }, content)));
+}));
+Badge.displayName = 'ElBadge';
+export default Badge;

package/dist/Badge/index.js

@@ -1,39 +1 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/Badge/index.ts
-var Badge_exports = {};
-__export(Badge_exports, {
-  Badge: () => import_Badge.default
-});
-module.exports = __toCommonJS(Badge_exports);
-var import_Badge = __toESM(require("./Badge"));
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  Badge
-});
+export { default as Badge } from "./Badge";

package/dist/Badge/typings.d.ts

@@ -1,14 +1,24 @@
 import React from 'react';
 import { AnimationEventProps, BaseProps, NativeProps, TypeAttributes } from '../types/common';
-export interface BadgeProps extends BaseProps, NativeProps, AnimationEventProps {
+export interface BadgeProps extends BaseProps, NativeProps<'--el-badge-bg-color' | '--el-badge-radius' | '--el-badge-font-size' | '--el-badge-padding' | '--el-badge-size'>, AnimationEventProps {
+    /** 显示值 */
     value?: string | number;
+    /** 最大值，超过最大值会显示 {max}+。 只有当 value 是数字类型时起作用。 */
     max?: number;
+    /** 是否显示小圆点。 */
     isDot?: boolean;
+    /** 是否隐藏 Badge。 */
     hidden?: Boolean;
+    /** 类型 */
     type?: TypeAttributes.Appearance;
+    /** 值为零时是否显示 Badge */
     showZero?: boolean;
+    /** 背景色 */
     color?: string;
+    /** badge 的偏移量 */
     offset?: [number, number];
+    /** 自定义 badge 样式 */
     badgeStyle?: React.CSSProperties;
+    /** 自定义 badge 类名  */
     badgeClass?: string;
 }

package/dist/Badge/typings.js

@@ -1,17 +1 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/Badge/typings.ts
-var typings_exports = {};
-module.exports = __toCommonJS(typings_exports);
+export {};

package/dist/Breadcrumb/Breadcrumb.js

@@ -1,54 +1,24 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/Breadcrumb/Breadcrumb.tsx
-var Breadcrumb_exports = {};
-__export(Breadcrumb_exports, {
-  BreadcrumbContext: () => BreadcrumbContext,
-  default: () => Breadcrumb_default
-});
-module.exports = __toCommonJS(Breadcrumb_exports);
-var import_classnames = __toESM(require("classnames"));
-var import_react = __toESM(require("react"));
-var import_hooks = require("../hooks");
-var Breadcrumb = (0, import_react.memo)((props) => {
-  const { classPrefix = "breadcrumb", separator } = props;
-  const { b } = (0, import_hooks.useClassNames)(classPrefix);
-  return /* @__PURE__ */ import_react.default.createElement(BreadcrumbContext.Provider, { value: { separator } }, /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)(b(), props.className), style: props.style }, props.children));
-});
-Breadcrumb.defaultProps = {
-  separator: "/"
-};
-var Breadcrumb_default = Breadcrumb;
-var BreadcrumbContext = (0, import_react.createContext)({
-  separator: "/"
-});
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  BreadcrumbContext
+import classNames from 'classnames';
+import React, { createContext, memo } from 'react';
+import { useClassNames } from "../hooks";
+var Breadcrumb = /*#__PURE__*/memo(function (props) {
+  var _props$classPrefix = props.classPrefix,
+    classPrefix = _props$classPrefix === void 0 ? 'breadcrumb' : _props$classPrefix,
+    _props$separator = props.separator,
+    separator = _props$separator === void 0 ? '/' : _props$separator;
+  var _useClassNames = useClassNames(classPrefix),
+    b = _useClassNames.b;
+  return /*#__PURE__*/React.createElement(BreadcrumbContext.Provider, {
+    value: {
+      separator: separator
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classNames(b(), props.className),
+    style: props.style
+  }, props.children));
 });
+Breadcrumb.displayName = 'ElBreadcrumb';
+export default Breadcrumb;
+export var BreadcrumbContext = /*#__PURE__*/createContext({
+  separator: '/'
+});