react-public-components 1.1.17 → 1.1.18

package/dist/index.css

@@ -153,4 +153,44 @@
   transition: transform 0.3s cubic-bezier(0.2, 0, 0, 1), opacity 0.3s cubic-bezier(0.2, 0, 0, 1);
   will-change: transform;
 }
+
+/* BorderBeam/index.less */
+.react-public-border-beam-container {
+  position: relative;
+}
+.react-public-border-beam-mask {
+  position: absolute;
+  pointer-events: none;
+  box-sizing: border-box;
+  border-radius: inherit;
+  border: var(--border-beam-line-width, 1px) solid transparent;
+  top: calc(-1 * var(--border-beam-outset, 0px));
+  left: calc(-1 * var(--border-beam-outset, 0px));
+  right: calc(-1 * var(--border-beam-outset, 0px));
+  bottom: calc(-1 * var(--border-beam-outset, 0px));
+  -webkit-mask-image: linear-gradient(#000 0 0), linear-gradient(#000 0 0);
+  -webkit-mask-clip: padding-box, border-box;
+  -webkit-mask-composite: destination-out;
+  mask-image: linear-gradient(#000 0 0), linear-gradient(#000 0 0);
+  mask-clip: padding-box, border-box;
+  mask-composite: exclude;
+}
+.react-public-border-beam-item {
+  position: absolute;
+  width: var(--border-beam-size, 100px);
+  height: var(--border-beam-size, 100px);
+  background: var(--border-beam-gradient);
+  offset-path: rect(0% 100% 100% 0% round var(--border-beam-radius, 12px));
+  offset-anchor: 100% 50%;
+  will-change: offset-distance;
+  animation: react-public-border-beam-spin var(--border-beam-duration, 6s) linear infinite;
+}
+@keyframes react-public-border-beam-spin {
+  0% {
+    offset-distance: 0%;
+  }
+  100% {
+    offset-distance: 100%;
+  }
+}
 /*# sourceMappingURL=index.css.map */

package/dist/index.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../CollapseBox/index.less","../DisabledBox/index.less","../Masonry/index.less"],"sourcesContent":[".collapsible-wrapper {\n  position: relative;\n  box-sizing: border-box;\n}\n.collapsible-wrapper.horizontal {\n  display: inline-flex;\n  align-items: stretch;\n}\n.collapsible-wrapper.vertical {\n  display: flex;\n  flex-direction: column;\n}\n.collapsible-container {\n  position: relative;\n  box-sizing: border-box;\n  min-width: 0;\n  min-height: 0;\n  overflow: hidden;\n  background-color: #ffffff;\n  border: 1px solid #d1d5db;\n  border-radius: 8px;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);\n  transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1), height 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.collapsible-container.align-right {\n  margin-left: auto;\n}\n.collapsible-container.align-bottom {\n  margin-top: auto;\n}\n.collapsible-header {\n  position: sticky;\n  top: 0;\n  z-index: 10;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  box-sizing: border-box;\n  height: 48px;\n  padding: 12px 16px;\n  background-color: #f9fafb;\n  border-bottom: 1px solid #d1d5db;\n}\n.collapsible-header h3 {\n  margin: 0;\n  color: #1f2937;\n  font-weight: 600;\n  font-size: 18px;\n}\n.collapsible-content {\n  box-sizing: border-box;\n  padding: 16px;\n}\n.toggle-button {\n  position: absolute;\n  z-index: 10;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #8c8c8c;\n  background-color: #f3f4f6;\n  border: 1px solid #e5e7eb;\n  border-radius: 3px;\n  cursor: pointer;\n  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);\n  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;\n  font-size: 10px;\n}\n.toggle-button:hover {\n  background-color: #e5e7eb;\n  color: #1f2937;\n  border-color: #d1d5db;\n}\n.toggle-button.button-right {\n  top: 50%;\n  right: 0;\n  transform: translate(50%, -50%);\n  width: 14px;\n  height: 48px;\n}\n.toggle-button.button-left {\n  top: 50%;\n  left: 0;\n  transform: translate(-50%, -50%);\n  width: 14px;\n  height: 48px;\n}\n.toggle-button.button-bottom {\n  bottom: 0;\n  left: 50%;\n  transform: translate(-50%, 50%);\n  width: 48px;\n  height: 14px;\n}\n.toggle-button.button-top {\n  top: 0;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 48px;\n  height: 14px;\n}\n",".disabled_box_container {\n  display: flex;\n  flex: 1;\n  gap: 2px;\n  align-items: center;\n  justify-content: flex-start;\n  min-width: 0;\n  color: rgba(0, 0, 0, 0.35);\n}\n.disabled_box_container .disabled_box_title {\n  display: flex;\n  flex: 1;\n  min-width: 0;\n  margin: 0 !important;\n  padding: 0 !important;\n  overflow: hidden;\n}\n.disabled_box_container .disabled_box_icon {\n  flex-shrink: 0;\n  margin-right: 2px;\n  font-size: 12px;\n}\n.disabled_box_container .disabled_box_icon:last-child {\n  margin-right: 0;\n  margin-left: 2px;\n}\n.disabled_box_disabled {\n  color: rgba(0, 0, 0, 0.35) !important;\n  cursor: not-allowed;\n}\n.disabled_box_disabled * {\n  color: inherit !important;\n}\n",".masonry_root {\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n}\n.masonry_item {\n  position: absolute;\n  top: 0;\n  left: 0;\n  box-sizing: border-box;\n  transition: transform 0.3s cubic-bezier(0.2, 0, 0, 1), opacity 0.3s cubic-bezier(0.2, 0, 0, 1);\n  will-change: transform;\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../CollapseBox/index.less","../DisabledBox/index.less","../Masonry/index.less","../BorderBeam/index.less"],"sourcesContent":[".collapsible-wrapper {\n  position: relative;\n  box-sizing: border-box;\n}\n.collapsible-wrapper.horizontal {\n  display: inline-flex;\n  align-items: stretch;\n}\n.collapsible-wrapper.vertical {\n  display: flex;\n  flex-direction: column;\n}\n.collapsible-container {\n  position: relative;\n  box-sizing: border-box;\n  min-width: 0;\n  min-height: 0;\n  overflow: hidden;\n  background-color: #ffffff;\n  border: 1px solid #d1d5db;\n  border-radius: 8px;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);\n  transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1), height 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.collapsible-container.align-right {\n  margin-left: auto;\n}\n.collapsible-container.align-bottom {\n  margin-top: auto;\n}\n.collapsible-header {\n  position: sticky;\n  top: 0;\n  z-index: 10;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  box-sizing: border-box;\n  height: 48px;\n  padding: 12px 16px;\n  background-color: #f9fafb;\n  border-bottom: 1px solid #d1d5db;\n}\n.collapsible-header h3 {\n  margin: 0;\n  color: #1f2937;\n  font-weight: 600;\n  font-size: 18px;\n}\n.collapsible-content {\n  box-sizing: border-box;\n  padding: 16px;\n}\n.toggle-button {\n  position: absolute;\n  z-index: 10;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #8c8c8c;\n  background-color: #f3f4f6;\n  border: 1px solid #e5e7eb;\n  border-radius: 3px;\n  cursor: pointer;\n  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);\n  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;\n  font-size: 10px;\n}\n.toggle-button:hover {\n  background-color: #e5e7eb;\n  color: #1f2937;\n  border-color: #d1d5db;\n}\n.toggle-button.button-right {\n  top: 50%;\n  right: 0;\n  transform: translate(50%, -50%);\n  width: 14px;\n  height: 48px;\n}\n.toggle-button.button-left {\n  top: 50%;\n  left: 0;\n  transform: translate(-50%, -50%);\n  width: 14px;\n  height: 48px;\n}\n.toggle-button.button-bottom {\n  bottom: 0;\n  left: 50%;\n  transform: translate(-50%, 50%);\n  width: 48px;\n  height: 14px;\n}\n.toggle-button.button-top {\n  top: 0;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 48px;\n  height: 14px;\n}\n",".disabled_box_container {\n  display: flex;\n  flex: 1;\n  gap: 2px;\n  align-items: center;\n  justify-content: flex-start;\n  min-width: 0;\n  color: rgba(0, 0, 0, 0.35);\n}\n.disabled_box_container .disabled_box_title {\n  display: flex;\n  flex: 1;\n  min-width: 0;\n  margin: 0 !important;\n  padding: 0 !important;\n  overflow: hidden;\n}\n.disabled_box_container .disabled_box_icon {\n  flex-shrink: 0;\n  margin-right: 2px;\n  font-size: 12px;\n}\n.disabled_box_container .disabled_box_icon:last-child {\n  margin-right: 0;\n  margin-left: 2px;\n}\n.disabled_box_disabled {\n  color: rgba(0, 0, 0, 0.35) !important;\n  cursor: not-allowed;\n}\n.disabled_box_disabled * {\n  color: inherit !important;\n}\n",".masonry_root {\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n}\n.masonry_item {\n  position: absolute;\n  top: 0;\n  left: 0;\n  box-sizing: border-box;\n  transition: transform 0.3s cubic-bezier(0.2, 0, 0, 1), opacity 0.3s cubic-bezier(0.2, 0, 0, 1);\n  will-change: transform;\n}\n",".react-public-border-beam-container {\n  position: relative;\n}\n.react-public-border-beam-mask {\n  position: absolute;\n  pointer-events: none;\n  box-sizing: border-box;\n  border-radius: inherit;\n  /* 边框线宽 */\n  border: var(--border-beam-line-width, 1px) solid transparent;\n  /* 定位与 outset 外扩 */\n  top: calc(-1 * var(--border-beam-outset, 0px));\n  left: calc(-1 * var(--border-beam-outset, 0px));\n  right: calc(-1 * var(--border-beam-outset, 0px));\n  bottom: calc(-1 * var(--border-beam-outset, 0px));\n  /* WebKit 遮罩兼容 (Chrome, Safari, Edge) */\n  -webkit-mask-image: linear-gradient(#000 0 0), linear-gradient(#000 0 0);\n  -webkit-mask-clip: padding-box, border-box;\n  -webkit-mask-composite: destination-out;\n  /* 标准 CSS 遮罩 (Firefox, Modern Chrome) */\n  mask-image: linear-gradient(#000 0 0), linear-gradient(#000 0 0);\n  mask-clip: padding-box, border-box;\n  mask-composite: exclude;\n}\n.react-public-border-beam-item {\n  position: absolute;\n  width: var(--border-beam-size, 100px);\n  height: var(--border-beam-size, 100px);\n  background: var(--border-beam-gradient);\n  /* 沿矩形路径轨迹移动 */\n  offset-path: rect(0% 100% 100% 0% round var(--border-beam-radius, 12px));\n  offset-anchor: 100% 50%;\n  will-change: offset-distance;\n  animation: react-public-border-beam-spin var(--border-beam-duration, 6s) linear infinite;\n}\n@keyframes react-public-border-beam-spin {\n  0% {\n    offset-distance: 0%;\n  }\n  100% {\n    offset-distance: 100%;\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/index.d.cts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import React__default, { ReactNode, CSSProperties, Key } from 'react';
+import React__default, { ReactNode, CSSProperties, Key, HTMLAttributes } from 'react';
 
 type CollapseBoxDirection = 'horizontal' | 'vertical';
 type CollapseBoxButtonPosition = 'left' | 'right' | 'top' | 'bottom';
@@ -164,4 +164,26 @@ interface MasonryProps<T = any> {
 }
 declare const Masonry: <T = unknown>(props: MasonryProps<T>) => React__default.JSX.Element;
 
-export { type Breakpoint, CollapsibleBox as CollapseBox, type CollapseBoxButtonPosition, type CollapseBoxDirection, type CollapseBoxProps, DisabledBox, type DisabledBoxProps, type Gap, Masonry, type MasonryClassNames, type MasonryItem, type MasonryProps, type MasonrySemanticDOM, type MasonryStyles, CustomSplitter as Splitter, type SplitterCollapsible, type SplitterOrientation, type SplitterPanelProps, type SplitterProps, type SplitterSize };
+type BorderBeamColorStop = {
+    color: string;
+    percent: number;
+};
+interface BorderBeamProps extends Omit<HTMLAttributes<HTMLDivElement>, 'color'> {
+    /** 装饰内容 */
+    children?: ReactNode;
+    /** 流光颜色配置，支持单色字符串或渐变停靠点数组 */
+    color?: string | BorderBeamColorStop[];
+    /** 流光数量，默认为 1 */
+    count?: number;
+    /** 流光完成一圈动画的时间，单位秒，默认为 6 */
+    duration?: number;
+    /** 流光线宽，数字类型按像素处理，默认为 1px */
+    lineWidth?: number | string;
+    /** 流光层相对容器边缘的外扩距离，遇到裁剪容器时可设为 0 */
+    outset?: number | string;
+    /** 流光可见段的尺寸，数字类型按像素处理，默认为 100 */
+    size?: number | string;
+}
+declare const BorderBeam: (props: BorderBeamProps) => React.JSX.Element;
+
+export { BorderBeam, type BorderBeamColorStop, type BorderBeamProps, type Breakpoint, CollapsibleBox as CollapseBox, type CollapseBoxButtonPosition, type CollapseBoxDirection, type CollapseBoxProps, DisabledBox, type DisabledBoxProps, type Gap, Masonry, type MasonryClassNames, type MasonryItem, type MasonryProps, type MasonrySemanticDOM, type MasonryStyles, CustomSplitter as Splitter, type SplitterCollapsible, type SplitterOrientation, type SplitterPanelProps, type SplitterProps, type SplitterSize };

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import React__default, { ReactNode, CSSProperties, Key } from 'react';
+import React__default, { ReactNode, CSSProperties, Key, HTMLAttributes } from 'react';
 
 type CollapseBoxDirection = 'horizontal' | 'vertical';
 type CollapseBoxButtonPosition = 'left' | 'right' | 'top' | 'bottom';
@@ -164,4 +164,26 @@ interface MasonryProps<T = any> {
 }
 declare const Masonry: <T = unknown>(props: MasonryProps<T>) => React__default.JSX.Element;
 
-export { type Breakpoint, CollapsibleBox as CollapseBox, type CollapseBoxButtonPosition, type CollapseBoxDirection, type CollapseBoxProps, DisabledBox, type DisabledBoxProps, type Gap, Masonry, type MasonryClassNames, type MasonryItem, type MasonryProps, type MasonrySemanticDOM, type MasonryStyles, CustomSplitter as Splitter, type SplitterCollapsible, type SplitterOrientation, type SplitterPanelProps, type SplitterProps, type SplitterSize };
+type BorderBeamColorStop = {
+    color: string;
+    percent: number;
+};
+interface BorderBeamProps extends Omit<HTMLAttributes<HTMLDivElement>, 'color'> {
+    /** 装饰内容 */
+    children?: ReactNode;
+    /** 流光颜色配置，支持单色字符串或渐变停靠点数组 */
+    color?: string | BorderBeamColorStop[];
+    /** 流光数量，默认为 1 */
+    count?: number;
+    /** 流光完成一圈动画的时间，单位秒，默认为 6 */
+    duration?: number;
+    /** 流光线宽，数字类型按像素处理，默认为 1px */
+    lineWidth?: number | string;
+    /** 流光层相对容器边缘的外扩距离，遇到裁剪容器时可设为 0 */
+    outset?: number | string;
+    /** 流光可见段的尺寸，数字类型按像素处理，默认为 100 */
+    size?: number | string;
+}
+declare const BorderBeam: (props: BorderBeamProps) => React.JSX.Element;
+
+export { BorderBeam, type BorderBeamColorStop, type BorderBeamProps, type Breakpoint, CollapsibleBox as CollapseBox, type CollapseBoxButtonPosition, type CollapseBoxDirection, type CollapseBoxProps, DisabledBox, type DisabledBoxProps, type Gap, Masonry, type MasonryClassNames, type MasonryItem, type MasonryProps, type MasonrySemanticDOM, type MasonryStyles, CustomSplitter as Splitter, type SplitterCollapsible, type SplitterOrientation, type SplitterPanelProps, type SplitterProps, type SplitterSize };

package/dist/index.js

@@ -1068,7 +1068,106 @@ var Masonry = (props) => {
   );
 };
 var Masonry_default = Masonry;
+
+// BorderBeam/index.tsx
+import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
+var formatSizeUnit = (value, defaultValue) => {
+  if (value === void 0 || value === null) {
+    return defaultValue;
+  }
+  if (typeof value === "number") {
+    return `${value}px`;
+  }
+  return value;
+};
+var buildGradientString = (color) => {
+  if (!color) {
+    return "linear-gradient(to left, #1677ff 0%, transparent 100%)";
+  }
+  if (typeof color === "string") {
+    return `linear-gradient(to left, ${color} 0%, transparent 100%)`;
+  }
+  if (Array.isArray(color)) {
+    if (color.length === 0) {
+      return "linear-gradient(to left, #1677ff 0%, transparent 100%)";
+    }
+    const sorted = [...color].sort((a, b) => a.percent - b.percent);
+    const mappedStops = sorted.map((stop) => {
+      const mappedPercent = Math.min(Math.max(stop.percent / 100 * 80, 0), 80);
+      return `${stop.color} ${mappedPercent.toFixed(2)}%`;
+    });
+    return `linear-gradient(to left, ${mappedStops.join(", ")}, transparent 100%)`;
+  }
+  return "linear-gradient(to left, #1677ff 0%, transparent 100%)";
+};
+var BorderBeam = (props) => {
+  const {
+    children,
+    color,
+    count = 1,
+    duration = 6,
+    lineWidth = "1px",
+    outset = "0px",
+    size = 100,
+    className,
+    style,
+    ...restProps
+  } = props;
+  const formattedLineWidth = formatSizeUnit(lineWidth, "1px");
+  const formattedOutset = formatSizeUnit(outset, "0px");
+  const formattedSize = formatSizeUnit(size, "100px");
+  const gradientCss = buildGradientString(color);
+  const maskStyle = {
+    "--border-beam-line-width": formattedLineWidth,
+    "--border-beam-outset": formattedOutset,
+    "--border-beam-size": formattedSize,
+    "--border-beam-duration": `${duration}s`,
+    "--border-beam-gradient": gradientCss
+  };
+  const beamCount = Math.max(1, count);
+  const beams = Array.from({ length: beamCount }).map((_, index) => {
+    const delaySeconds = -(duration * index / beamCount);
+    return /* @__PURE__ */ jsx6(
+      "div",
+      {
+        className: "react-public-border-beam-item",
+        style: {
+          animationDelay: `${delaySeconds}s`
+        }
+      },
+      index
+    );
+  });
+  if (children !== void 0) {
+    return /* @__PURE__ */ jsxs4(
+      "div",
+      {
+        className: `react-public-border-beam-container ${className || ""}`.trim(),
+        style,
+        ...restProps,
+        children: [
+          children,
+          /* @__PURE__ */ jsx6("div", { className: "react-public-border-beam-mask", style: maskStyle, children: beams })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx6(
+    "div",
+    {
+      className: `react-public-border-beam-mask ${className || ""}`.trim(),
+      style: {
+        ...maskStyle,
+        ...style
+      },
+      ...restProps,
+      children: beams
+    }
+  );
+};
+var BorderBeam_default = BorderBeam;
 export {
+  BorderBeam_default as BorderBeam,
   CollapseBox_default as CollapseBox,
   DisabledBox_default as DisabledBox,
   Masonry_default as Masonry,